/* Infinity & Beyond — details-v6: Practicalities (details.html).
 * Loads after the shared v6 layer: an expand-all control per question group, and the hand-drawn journey map blended
 * into the page palette instead of sitting in its own parchment frame. */
.page-details .faq-group-head { display: flex; align-items: baseline; justify-content: space-between; gap: 24px; }
.page-details .faq-group-head h2 { margin-bottom: 0; }
.page-details .faq-expand {
  appearance: none; background: none; border: 0; padding: 0 0 4px; cursor: pointer; flex: none;
  font:500 var(--type-caption)/1.5 var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--muted);
  border-bottom: 1px solid var(--line); transition: color .3s, border-color .3s;
}
.page-details .faq-expand:hover, .page-details .faq-expand:focus-visible { color: var(--ink); border-color: var(--ink); }
.page-details .faq-group .faq-group-head + details { margin-top: 26px; }

/* the map: same paper as the page, drawing multiplied into it, lightly desaturated */
.cinematic-v4.page-details .journey-map { background: transparent; padding: 0; }
.cinematic-v4.page-details .journey-map img { background: transparent; mix-blend-mode: multiply; filter: saturate(.72) contrast(1.02); max-height: 720px; }
.page-details .journey-map figcaption { font-size:var(--type-caption); letter-spacing: .06em; text-transform: uppercase; color: var(--muted); margin-top: 14px; }

@media (max-width: 620px) {
  .page-details .faq-group-head { flex-direction: column; align-items: flex-start; gap: 12px; }
}

/* cut pass: the question nav lists what is on this page, then where the rest lives; the documents note runs full width */
.page-details .faq-nav > a + .kicker { margin-top: 34px; padding-top: 22px; border-top: 1px solid var(--line); }
.page-details .faq-nav > .kicker + a { border-top: 1px solid var(--line); }
.page-details .travel-preparation { grid-template-columns: 1fr; max-width: 760px; }
@media (max-width: 900px) {
  .cinematic-v4.page-details .faq-nav > a + .kicker { margin-top: 12px; padding-top: 0; border-top: 0; }
}
/* cut pass, round 2: the way in — three map panels drawn from real coastlines (review/source-research/build_way_in_map.py) */
.cinematic-v4.page-details .journey-map.way-in-map { background: transparent; padding: 0; }
.page-details .way-in-grid { display: grid; grid-template-columns: 480fr 800fr; gap: 24px; align-items: start; }
.page-details .way-in-panel { display: block; width: 100%; height: auto; border: 1px solid var(--line); background: #e3e7dd; }
.page-details .way-in-panel-bm, .page-details .way-in-panel-c { display: none; }
.page-details .way-in-map figcaption span { text-transform: none; letter-spacing: 0; opacity: .75; }
.way-in-map .map-sea { fill: #e3e7dd; }
.way-in-map .map-land { fill: #f6f4ec; stroke: #17201c; stroke-width: .7; stroke-linejoin: round; }
.way-in-map .map-land-ctx { fill: #edece4; stroke: #a6ada4; stroke-width: .6; stroke-linejoin: round; }
.way-in-map .map-frame { fill: none; stroke: #ae472b; stroke-width: 1; stroke-dasharray: 3 2.5; }
.way-in-map .map-frame-inset { stroke: #17201c; stroke-dasharray: none; stroke-width: .8; }
.way-in-map .map-route-air { fill: none; stroke: #ae472b; stroke-width: 1.5; }
.way-in-map .map-route-home { fill: none; stroke: #152e25; stroke-width: 1.2; stroke-dasharray: 4 3; }
.way-in-map .map-route-road { fill: none; stroke: #17201c; stroke-width: 1.3; stroke-dasharray: 2.5 2.5; stroke-linecap: round; }
.way-in-map .map-place { fill: #f7f7f2; stroke: #17201c; stroke-width: 1.3; }
.way-in-map .map-place-ctx { stroke: #7d877e; }
.way-in-map .map-place-cape { fill: #17201c; }
.way-in-map .map-stay { fill: #ae472b; stroke: #f7f7f2; stroke-width: 1.2; }
.way-in-map .map-tick { stroke: #17201c; stroke-width: .8; }
.way-in-map .map-scale { fill: none; stroke: #17201c; stroke-width: .9; }
.way-in-map .map-north path { fill: #17201c; }
.way-in-map text { font:500 var(--type-caption)/1 var(--sans); letter-spacing: .08em; text-transform: uppercase; fill: #17201c; paint-order: stroke; stroke: rgba(246, 244, 236, .85); stroke-width: 3px; stroke-linejoin: round; }
.way-in-map .map-lbl-ctx { fill: #6a746b; }
.way-in-map .map-lbl-strong { font-weight: 700; }
.way-in-map .map-stay-lbl { fill: #ae472b; font-weight: 700; }
.way-in-map .map-sea-lbl { font:italic 400 var(--type-body) var(--serif); letter-spacing: .12em; text-transform: none; fill: #6f7d72; stroke: none; }
.way-in-map .map-route-lbl { font-size:var(--type-caption); text-transform: none; letter-spacing: .04em; }
.way-in-map .map-route-lbl-rust { fill: #ae472b; }
.way-in-map .map-route-lbl-green { fill: #152e25; }
.way-in-map .map-note { font-size:var(--type-caption); fill: #6a746b; letter-spacing: .1em; }
.way-in-map .map-note-ink { fill: #17201c; }
@media (max-width: 900px) {
  .page-details .way-in-grid { grid-template-columns: 1fr; gap: 16px; }
  .page-details .way-in-panel-b { display: none; }
  .page-details .way-in-panel-bm, .page-details .way-in-panel-c { display: block; }
  .way-in-panel-a text { font-size:var(--type-body); } .way-in-panel-a .map-sea-lbl { font-size:var(--type-body); } .way-in-panel-a .map-route-lbl { font-size:var(--type-caption); } .way-in-panel-a .map-note { font-size:var(--type-caption); }
  .way-in-panel-bm text { font-size:var(--type-body); } .way-in-panel-bm .map-sea-lbl { font-size:var(--type-body); } .way-in-panel-bm .map-route-lbl { font-size:var(--type-caption); } .way-in-panel-bm .map-note { font-size:var(--type-caption); }
}