/* 職人の手しごと / Shokunin — legal and support pages.
   Loaded after styles.css (tokens, base, footer). Headings use the Mincho stack from the OS:
   the LP's Shippori Mincho subset only covers the LP's own characters (TOKENS.md). */

body.legal { background: var(--bg); }

/* Header: static, on the page colour (the LP's header is fixed over the night hero) */
.legal-header { border-bottom: 1px solid var(--line); }
.legal-header .wrap { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-4); padding-block: var(--sp-3); }
.legal-header .brand { opacity: 1; transform: none; color: var(--ink); }
.legal-header .brand span { font-family: var(--font-display); }
.doc-lang { display: inline-flex; border: 1px solid var(--line); border-radius: var(--radius-pill); overflow: hidden; }
.doc-lang a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 var(--sp-4); color: var(--ink-soft); font-size: var(--fs-sm); font-weight: 600; text-decoration: none; }
.doc-lang a:hover { color: var(--ink); }
.doc-lang a[aria-current="true"] { background: var(--ink); color: var(--bg); }

/* One language at a time once the script has picked one; without JS both are shown */
html[data-doc="ja"] [data-doc-lang="en"],
html[data-doc="en"] [data-doc-lang="ja"] { display: none; }

/* Document */
.doc { padding-block: var(--sp-8) var(--sp-9); }
.doc article { max-width: 46em; }
.doc article + article { margin-top: var(--sp-9); }
.eyebrow { font-size: var(--fs-xs); letter-spacing: var(--tracking-wide, 0.12em); color: var(--accent); font-weight: 700; }
.doc h1 { margin-top: var(--sp-2); font-size: var(--fs-2xl); }
.doc .meta { margin-top: var(--sp-3); font-size: var(--fs-sm); color: var(--ink-soft); }
.doc .lead { margin-top: var(--sp-6); }
.doc h2 { margin-top: var(--sp-8); padding-top: var(--sp-5); border-top: 1px solid var(--line); font-size: var(--fs-xl); }
.doc h3 { margin-top: var(--sp-6); font-size: var(--fs-lg); }
.doc p, .doc ul, .doc ol { margin: var(--sp-4) 0 0; }
.doc ul, .doc ol { padding-left: 1.4em; }
.doc li + li { margin-top: var(--sp-2); }
.doc .note { margin-top: var(--sp-5); padding: var(--sp-4) var(--sp-5); border-radius: var(--radius-md); background: var(--bg-raise); border: 1px solid var(--line); }
.doc a { overflow-wrap: anywhere; }

/* Definition tables (data held, 特定商取引法) */
.doc dl.table { margin: var(--sp-5) 0 0; border-top: 1px solid var(--line); }
.doc dl.table > div { display: grid; gap: var(--sp-1) var(--sp-5); padding-block: var(--sp-4); border-bottom: 1px solid var(--line); }
.doc dl.table dt { font-weight: 700; }
.doc dl.table dd { margin: 0; }
.doc dl.table dd p:first-child { margin-top: 0; }
@media (min-width: 720px) { .doc dl.table > div { grid-template-columns: 12em 1fr; } }

/* FAQ */
.faq details { border-bottom: 1px solid var(--line); }
.faq details:first-of-type { border-top: 1px solid var(--line); margin-top: var(--sp-5); }
.faq summary { cursor: pointer; padding-block: var(--sp-4); font-weight: 700; min-height: 44px; }
.faq details > p:last-child { padding-bottom: var(--sp-4); }
.faq details p:first-of-type { margin-top: 0; }

.contact-list { list-style: none; padding: 0 !important; }
.contact-list li { display: grid; gap: var(--sp-1) var(--sp-5); }
@media (min-width: 720px) { .contact-list li { grid-template-columns: 8em 1fr; } }
.contact-list b { font-weight: 700; }

:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }