/* mobile.css v12 (9 Oct 2026): the phone layout. Everything below the first rule sits inside the phone gate
   (max-width:767px), (max-height:560px), which is the same gate js/mobile.js and the markup swap in index.html use. site.css and perf.css carry
   media="(min-width:768px) and (min-height:561px)" so they never touch the phone page. The one rule outside the gate hides desktop-markup helpers.
   Source of the layout: site-build/mobile/ui/phone.css (approved mockup). Edit there or here, not both. */
.m-only{display:none}
@media (max-width:767px), (max-height:560px){
/* phone.css: the phone layout for sastraveltour.com (design mockup, v1, 9 Oct 2026)
   Governs: portrait phones 360 to 430 wide, landscape phones (height <= 560), everything under 768 wide.
   Type: Montserrat (titles, heads) + Geist (reading). Accent plum #5B0D3D. No third family.
   Art: portrait masters 9:16 at 1.10 x viewport width, anchored to the bottom (MOBILE-DESIGN 2.1 bands).
   Glass: at most 3 live blurs on screen = header pill + two sheets. Chips, ticket, photos, bar, tiles are tint only. */

@font-face{font-family:Montserrat;src:url(../fonts/montserrat-var.woff2) format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:Geist;src:url(../fonts/geist-var.woff2) format("woff2");font-weight:100 900;font-display:swap}

:root{
  --canvas:#F7F5FB; --ink:#1B1230; --ink-g2:#3A3150; --plum:#5B0D3D; --plum-h:#74184F; --blush:#F2C6DD;
  --night:#130C24; --night-p:#1E1536; --deep:#2A0F52; --line:#8E86A6;
  --f-d:Montserrat,"Helvetica Neue",Arial,sans-serif;
  --f-b:Geist,system-ui,-apple-system,"Segoe UI",sans-serif;
  --out:cubic-bezier(.22,1,.36,1);
  --gut:12px; --pad:16px;
  --sat:env(safe-area-inset-top,0px); --sab:env(safe-area-inset-bottom,0px);
  --r-sheet:24px; --r-tile:16px; --r-chip:12px; --r-btn:14px;
  --frost-l:rgb(247 245 251/.62); --frost-d:rgb(19 12 36/.68);
  --edge-l:inset 0 0 0 1px rgb(255 255 255/.5),inset 0 1px 0 rgb(255 255 255/.8);
  --edge-d:inset 0 0 0 1px rgb(214 200 244/.18),inset 0 1px 0 rgb(255 255 255/.14);
  --shadow:0 1px 2px rgb(19 12 36/.08),0 18px 40px -18px rgb(19 12 36/.35);
  --hair:rgb(27 18 48/.14); --hair-d:rgb(214 200 244/.2);
  --gap-s:14px; --gap-m:20svh; --gap-l:34svh;
  --hh:calc(var(--sat) + 8px + 52px);        /* header bottom edge */
  --mw:calc(110vw);                           /* master width */
  --mh:calc(var(--mw)*16/9);                  /* master height */
  --mt:calc(100svh - var(--mh));              /* master top, anchored to the bottom */
  --sky-jp:#87b0fc; --sky-nr:#0a1a39; --sky-nz:#8a7cbe;
  --bar-h:calc(64px + 10px + var(--sab));
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{background:#120b1f;overscroll-behavior:none;-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--hh) + 8px)}
body{margin:0;font:400 16px/1.5 var(--f-b);color:var(--ink);background:#120b1f;overscroll-behavior:none;min-height:100svh}
main{display:block;position:relative}
img{max-width:100%;display:block}
h1,h2,h3,p,ul,ol,figure,dl,dd{margin:0}
ul,ol{padding:0;list-style:none}
a{color:inherit}
.sr{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:fixed;left:12px;top:-80px;z-index:100;background:#fff;color:var(--plum);padding:12px 16px;border-radius:12px;font-weight:600}
.skip:focus{top:12px}
:focus-visible{outline:3px solid var(--plum);outline-offset:2px}
.dark :focus-visible,.hero :focus-visible,.mp :focus-visible,.para :focus-visible,.foot :focus-visible,.hd.night :focus-visible{outline-color:#fff;box-shadow:0 0 0 6px rgb(91 13 61/.9)}

/* body carries class phb (not ph): .ph is the photo frame class with overflow:hidden, and a body with overflow:hidden stops all user scrolling */
/* ---- type ---- */
.h-sheet{font:700 1.625rem/1.12 var(--f-d);letter-spacing:-.02em;text-wrap:balance}
.h-card{font:700 1.375rem/1.15 var(--f-d);letter-spacing:-.015em;text-wrap:balance}
.h-tile{font:700 1.25rem/1.2 var(--f-d);letter-spacing:-.01em}
.h-display{font:700 2rem/1.04 var(--f-d);letter-spacing:-.025em;text-wrap:balance}
.lbl{font:500 .875rem/1.2 var(--f-b);color:var(--ink-g2)}
.lead{font:400 1rem/1.45 var(--f-b);color:var(--ink-g2)}
.src{font:500 .875rem/1.35 var(--f-b);color:var(--ink-g2)}
.coord{font:500 .875rem/1.2 var(--f-b);font-variant-numeric:tabular-nums;letter-spacing:.01em}
.pull{font:600 1.1875rem/1.3 var(--f-d);letter-spacing:-.01em;color:var(--plum);padding-top:16px;position:relative;text-wrap:balance}
.pull::before{content:"";position:absolute;left:0;top:0;width:28px;height:3px;border-radius:2px;background:var(--plum)}
.dark .pull,.dark .lbl,.dark .lead,.dark .src{color:rgb(247 245 251/.9)}
.dark .pull{color:var(--blush)}
.dark .pull::before{background:var(--blush)}
.tbc{font-style:normal;font-weight:400;color:var(--ink-g2);text-decoration:underline dotted 1px;text-underline-offset:3px;overflow-wrap:anywhere}
.dark .tbc,.hero .tbc,.mp .tbc,.para .tbc,.foot .tbc,.white .tbc{color:var(--blush)}
.sheet p+p,.blk p+p{margin-top:.75em}
.sheet :is(.h-sheet,.h-card,.h-tile):not(.sh-head *){margin-bottom:10px}
.sheet p{text-wrap:pretty;max-width:62ch}
.sheet p.pull{margin-top:.9em}

/* ---- buttons ---- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;min-height:52px;padding:0 22px;border-radius:var(--r-btn);border:0;font:600 1rem/1.1 var(--f-b);text-decoration:none;cursor:pointer;transition:background-color .2s,transform .15s var(--out),box-shadow .2s;text-align:center}
.btn.pri{background:var(--plum);color:#fff;box-shadow:0 1px 2px rgb(19 12 36/.2),0 8px 18px -8px rgb(91 13 61/.65)}
.btn.pri:hover{background:var(--plum-h)}
.btn:active{transform:scale(.98)}
.btn[disabled],.btn.is-loading{opacity:.6;pointer-events:none}
.btn.wide{width:100%}
.btn.big{width:100%;min-height:56px;font-size:1.0625rem}
.btn.sm{min-height:52px;width:100%}
.lnk{display:inline-flex;align-items:center;min-height:48px;padding:0 6px;font:600 1rem var(--f-b);color:inherit;text-underline-offset:5px}
/* a link inside running text keeps its line, but its tap area is 44px or more tall (the padding is pulled back with the negative margin) */
.sheet p a:not(.btn):not(.lnk){display:inline-block;padding:11px 2px;margin:-11px -2px}
.p-list a{display:inline-flex;align-items:center;min-height:44px;padding:0 8px}
.p-list.sr:focus-within{position:static!important;width:auto;height:auto;margin:12px 24px 0;clip:auto;white-space:normal;overflow:visible;background:rgb(19 12 36/.85);border-radius:12px;padding:6px}

/* ---- header pill (glass 1 of 3) ---- */
.hd{position:fixed;z-index:50;top:calc(var(--sat) + 8px);left:var(--gut);right:var(--gut);height:52px;display:flex;align-items:center;justify-content:space-between;padding:0 4px 0 18px;border-radius:26px;
  background:rgb(247 245 251/.74);-webkit-backdrop-filter:blur(16px) saturate(1.5);backdrop-filter:blur(16px) saturate(1.5);box-shadow:var(--edge-l),0 8px 22px -12px rgb(19 12 36/.4);
  transition:transform .4s var(--out),background-color .25s;will-change:transform}
.hd.hide{transform:translateY(calc(-100% - var(--sat) - 20px))}
.hd .brand{display:block;position:relative;width:88px;height:48px}
.hd .lg{position:absolute;left:0;top:8px;height:32px;width:auto}
.hd .lg-w{opacity:0}
.hd.night{background:rgb(19 12 36/.7);box-shadow:var(--edge-d),0 8px 22px -12px rgb(0 0 0/.6)}
.hd.night .lg-p{opacity:0}.hd.night .lg-w{opacity:1}
.mb{width:48px;height:48px;border-radius:50%;border:0;background:transparent;position:relative;cursor:pointer;color:var(--ink)}
.hd.night .mb,.mb[aria-expanded=true]{color:#fff}
.mb .bars i{position:absolute;left:13px;right:13px;height:2px;border-radius:1px;background:currentColor;transition:transform .3s var(--out),top .3s var(--out)}
.mb .bars i:nth-child(1){top:19px}.mb .bars i:nth-child(2){top:27px}
.mb[aria-expanded=true] .bars i:nth-child(1){top:23px;transform:rotate(45deg)}
.mb[aria-expanded=true] .bars i:nth-child(2){top:23px;transform:rotate(-45deg)}
.hd:has(.mb[aria-expanded=true]){background:transparent;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
.hd:has(.mb[aria-expanded=true]) .lg-p{opacity:0}.hd:has(.mb[aria-expanded=true]) .lg-w{opacity:1}
/* menu */
.mp{position:fixed;inset:0;z-index:48;background:var(--deep);color:var(--canvas);padding:calc(var(--hh) + 20px) 24px calc(24px + var(--sab));display:flex;overflow-y:auto}
.mp[hidden]{display:none}
.mp nav{display:flex;flex-direction:column;width:100%;margin-block:auto}
.mp nav a:not(.btn){display:flex;align-items:center;min-height:56px;font:700 1.625rem/1.1 var(--f-d);letter-spacing:-.015em;text-decoration:none;border-bottom:1px solid rgb(247 245 251/.12)}
.mp nav a.mp-wa{font:600 1.0625rem/1.3 var(--f-b);gap:.5em;flex-wrap:wrap;margin-top:8px;border-bottom:0}
.mp .btn{margin-top:20px;min-height:56px;font-size:1.0625rem}

/* ---- bottom bar: one button and a round WhatsApp, no container, no literal [TBC] ---- */
.bar{position:fixed;z-index:45;left:var(--gut);right:var(--gut);bottom:calc(var(--sab) + 10px);display:flex;gap:8px;padding:6px;border-radius:32px;background:rgb(250 249 253/.98);box-shadow:0 0 0 1px rgb(19 12 36/.1),0 12px 28px -10px rgb(19 12 36/.55);pointer-events:auto;transition:transform .35s var(--out),opacity .25s,visibility 0s}
.bar>*{pointer-events:auto}
.bar:not(.on){transform:translateY(calc(100% + 24px));opacity:0;visibility:hidden;transition:transform .35s var(--out),opacity .2s,visibility 0s .35s}
.bar .hold{flex:1;min-width:0;min-height:52px;border-radius:26px;font-size:1.0625rem;box-shadow:none}
.bar .wa{flex:none;width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:rgb(91 13 61/.08);color:var(--plum);box-shadow:inset 0 0 0 1.5px rgb(91 13 61/.5);text-decoration:none}
body.menu-open .bar{display:none}
.bar-pad{height:calc(var(--bar-h) + 8px)}

/* ================================================================ SCENES ================================================================ */
.chap{position:relative;isolation:isolate;--sky:var(--sky-jp);--p:0;--dock:52svh}
.chap[data-c=norway]{--sky:var(--sky-nr)}
.chap[data-c=taupo]{--sky:var(--sky-nz)}
.scene{position:sticky;top:0;height:100svh;margin-bottom:-100svh;z-index:0;overflow:hidden;background:var(--sky);pointer-events:none;contain:strict}
.plate{position:absolute;left:0;right:0;bottom:0;height:var(--mh);width:100%}
.plate picture{display:block;position:absolute;left:50%;bottom:0;width:var(--mw);height:var(--mh);transform:translate3d(calc(-50% + var(--p)*-3.5vw),calc(var(--p)*5%),0);will-change:transform}
.master{width:100%;height:100%;object-fit:cover}
.ttlbox{position:absolute;left:24px;right:24px;top:calc(var(--mt) + var(--mh)*.48);height:calc(var(--mh)*.14);display:flex;align-items:center;opacity:calc(1 - var(--p)*0);transition:opacity .2s}
.scene .ttlbox{opacity:var(--tt,1);transform:translate3d(0,calc((1 - var(--tt,1))*-24px),0)}
.ttl3{font:800 80px/1 var(--f-d);letter-spacing:.02em;color:#fff;text-shadow:0 1px 2px rgb(19 12 36/.45),0 2px 10px rgb(24 14 56/.5),0 4px 34px rgb(30 16 70/.62);white-space:nowrap}
.ttl3.jp{font-size:min(84px,calc((100vw - 56px)/3.71))}
.ttl3.nr{font-size:min(80px,calc((100vw - 64px)/5.08))}
.ttl3.nz{display:flex;flex-direction:column;font-size:min(56px,calc((100vw - 64px)/5.31));line-height:calc(var(--mh)*.07)}
.ttl3.nz span{display:block;line-height:calc(var(--mh)*.07)}
.ttlbox::before{content:"";position:absolute;left:-14%;right:-10%;top:-34%;bottom:-34%;background:radial-gradient(ellipse closest-side at 44% 50%,rgb(30 18 66/var(--ga)) 0,rgb(30 18 66/calc(var(--ga)*.88)) 18%,rgb(30 18 66/calc(var(--ga)*.62)) 38%,rgb(30 18 66/calc(var(--ga)*.34)) 58%,rgb(30 18 66/calc(var(--ga)*.12)) 78%,transparent 100%);pointer-events:none}
/* New Zealand: the jetty and boat in the portrait master sit higher than the brief (posts at m51, boat at m57), so the two-line title moves up into the lake band above them */
@media not ((orientation:landscape) and (max-height:560px)){.scene[data-k=nz] .ttlbox{top:calc(var(--mt) + var(--mh)*.385)}}
.scene{--ga:.64}
.ttl3{position:relative}
.fg{display:block;position:absolute;left:0;right:0;bottom:0;height:var(--mh);pointer-events:none}
.fg picture{display:block;position:absolute;left:50%;bottom:0;width:var(--mw);height:var(--mh);transform:translate3d(calc(-50% + var(--p)*-3.5vw),calc(var(--p)*5%),0);will-change:transform}
.fg img{width:100%;height:100%;object-fit:cover}
.fg img[hidden]{display:none}
.plate picture{-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 7%);mask-image:linear-gradient(to bottom,transparent 0,#000 7%)}
/* band guide: ?bands=1 */
.bands .scene::after{content:"";position:absolute;left:0;right:0;top:var(--mt);height:var(--mh);pointer-events:none;
  background:linear-gradient(to bottom,rgb(80,120,255,.25) 0 10%,rgb(255,255,255,.12) 10% 28%,rgb(255,200,0,.22) 28% 46%,rgb(255,255,255,0) 46% 48%,rgb(255,0,120,.28) 48% 62%,rgb(0,200,120,.2) 62% 100%);z-index:9}
.bands .scene::before{content:"";position:absolute;left:0;right:0;top:var(--dock,52svh);height:2px;background:#fff;z-index:10}

.land{position:relative;z-index:1;height:100svh;pointer-events:none;scroll-margin-top:calc(-1*(var(--hh) + 8px))}
.land .chip-cap{position:absolute;left:24px;top:max(calc(var(--hh) + 14px),calc(var(--mt) + var(--mh)*.10 + 4px))}
.land .cue{pointer-events:none}
.chip-cap{max-width:min(78%,300px);padding:11px 14px 12px;border-radius:var(--r-chip);background:rgb(247 245 251/.8);color:var(--ink);box-shadow:var(--edge-l),0 6px 18px -10px rgb(19 12 36/.4)}
.chip-cap.dk{background:rgb(19 12 36/.64);color:var(--canvas);box-shadow:var(--edge-d)}
.chip-cap .cap{font:600 1rem/1.3 var(--f-d);letter-spacing:-.005em;text-wrap:balance}
.chip-cap .coord{margin-top:5px;opacity:.9}
.chip-cap .ttl.m{font:700 1.375rem/1.2 var(--f-d);letter-spacing:-.015em;text-wrap:balance}
.cue{position:absolute;left:50%;transform:translateX(-50%);bottom:calc(var(--sab) + 22px);width:max-content;display:flex;flex-direction:column;align-items:center;gap:6px;padding:8px 14px 6px;border-radius:16px;background:rgb(19 12 36/.5);font:600 .875rem var(--f-b);color:#fff;z-index:3}
.cue i{width:2px;height:18px;border-radius:1px;background:linear-gradient(#fff,transparent);animation:cue 1.8s var(--out) infinite}
@keyframes cue{0%{transform:translateY(-6px);opacity:0}30%{opacity:1}100%{transform:translateY(8px);opacity:0}}
.chap .land .cue{opacity:var(--ct,1)}

/* ---- sheets: real glass over the picture (blur 20, tint .62), content as flat blocks, no cards in cards ---- */
.sheet{position:relative;z-index:2;isolation:isolate;width:calc(100% - 2*var(--gut));margin:0 auto var(--gap-s);padding:var(--pad);border-radius:var(--r-sheet);color:var(--ink);
  background:var(--frost-l);-webkit-backdrop-filter:blur(20px) saturate(1.5) brightness(1.04);backdrop-filter:blur(20px) saturate(1.5) brightness(1.04);box-shadow:var(--edge-l),var(--shadow);contain:paint}
.sheet::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:url(../assets/motion/grain.png);opacity:.05;mix-blend-mode:overlay}
.sheet.dark,.dark .sheet{background:var(--frost-d);color:var(--canvas);-webkit-backdrop-filter:blur(20px) saturate(1.3);backdrop-filter:blur(20px) saturate(1.3);box-shadow:var(--edge-d),var(--shadow)}
.no-bf .sheet,.no-bf .hd{-webkit-backdrop-filter:none;backdrop-filter:none;background:rgb(238 234 246/.94)}
.no-bf .sheet.dark,.no-bf .dark .sheet,.no-bf .hd.night{background:rgb(30 21 54/.94)}
@media (prefers-reduced-transparency:reduce){.sheet,.hd{-webkit-backdrop-filter:none;backdrop-filter:none;background:rgb(238 234 246/.94)}.sheet.dark,.dark .sheet,.hd.night{background:rgb(30 21 54/.94)}}
.sheet>.blk+.blk,.sheet>.blk+.mgrid{margin-top:18px;padding-top:18px;border-top:1px solid var(--hair)}
.dark .sheet>.blk+.blk{border-top-color:var(--hair-d)}
.sheet>.blk.bare{margin:0;padding:0;border:0}
/* scroll-padding-top (header clearance) is added to the snap offset, so take it off: the dock sheet then rests with its top edge at exactly --dock (52svh), measured with real touch */
.sheet.dock{margin-top:0;scroll-margin-top:calc(var(--dock,52svh) - var(--hh) - 8px);scroll-snap-align:start}
html.snap{scroll-snap-type:y proximity}
.land{scroll-snap-align:start}
.chap>.sheet:first-of-type{margin-top:0}
.sh-head{display:grid;gap:4px;margin-bottom:6px}
.sh-head .lbl{margin-bottom:0}
/* the dock: the summary sheet's top edge rests at 52% of the screen. land is 100svh, so scroll 48svh brings it there. */
.stats{margin-top:12px}
.gc{display:grid;grid-template-columns:minmax(0,42%) minmax(0,1fr);gap:12px;align-items:center;padding:12px 0;border-top:1px solid var(--hair);min-height:60px}
.dark .gc{border-top-color:var(--hair-d)}
.gc b{font:700 1.125rem/1.15 var(--f-d);letter-spacing:-.01em;overflow-wrap:break-word}
.gc span{font:400 .9375rem/1.3 var(--f-b);color:var(--ink-g2)}
.dark .gc span{color:rgb(247 245 251/.9)}

/* ---- photos ---- */
.ph{position:relative;overflow:hidden;border-radius:var(--r-tile);background:var(--night-p);margin:0}
.ph img{width:100%;height:100%;object-fit:cover}
.chip-c{position:absolute;left:8px;bottom:8px;max-width:calc(100% - 16px);padding:8px 11px;border-radius:var(--r-chip);background:rgb(247 245 251/.86);color:var(--ink);font:500 .875rem/1.3 var(--f-b)}
.chip-c.top{top:8px;bottom:auto}
.dark .chip-c,.chap.dark .chip-c{background:rgb(19 12 36/.7);color:var(--canvas)}
.sheet>#jp-day+.ph.strip{margin-top:14px}
.sheet>.ph.strip{margin:-4px 0 18px;aspect-ratio:2.6/1;border-radius:var(--r-tile)}
.rail-w{position:relative;z-index:2;margin:0 0 22px}
.rail{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 var(--gut);scroll-padding-inline:var(--gut);scrollbar-width:none;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
.rail::-webkit-scrollbar{display:none}
.rail>.ph{flex:0 0 76%;aspect-ratio:4/5;scroll-snap-align:start;border-radius:20px;box-shadow:0 14px 30px -16px rgb(19 12 36/.6)}
.rail-dots{display:flex;justify-content:center;align-items:center;gap:6px;width:max-content;margin:12px auto 0;padding:8px 12px;border-radius:16px;background:rgb(19 12 36/.5);color:#fff;font:500 .875rem/1 var(--f-b)}
.rail-dots i{width:8px;height:8px;border-radius:4px;background:rgb(255 255 255/.5);transition:width .25s var(--out),background-color .25s}
.rail-dots i.on{width:22px;background:#fff}
.rail-dots span{margin-left:6px;font-variant-numeric:tabular-nums}
.photo-w{position:relative;z-index:2;width:calc(100% - 2*var(--gut));margin:0 auto var(--gap-s)}
.photo-w .ph{aspect-ratio:16/9;border-radius:20px;box-shadow:0 14px 30px -16px rgb(19 12 36/.6)}
.head-chip{position:relative;z-index:2;width:max-content;max-width:calc(100% - 2*var(--gut));margin:var(--gap-m) var(--gut) 12px;padding:12px 18px;border-radius:var(--r-chip);background:rgb(247 245 251/.84);color:var(--ink);box-shadow:var(--edge-l)}
.head-chip.dk{background:rgb(19 12 36/.68);color:var(--canvas);box-shadow:var(--edge-d)}
.rail-w,.photo-w{margin-top:0}
.sheet+.rail-w,.sheet+.photo-w,.sheet+.head-chip{margin-top:var(--gap-m)}
.sheet+.head-chip{margin-top:var(--gap-m)}

/* ---- boarding pass: its own ticket on the scenery, not a card in a sheet ---- */
.pass{--pass-bg:rgb(250 249 253/.95);--pass-ink:var(--ink);--pass-k:var(--plum);--pass-g2:var(--ink-g2);--pl:52px;position:relative;z-index:2;width:calc(100% - 2*var(--gut));margin:0 auto var(--gap-s);border-radius:18px;overflow:hidden;background:var(--pass-bg);color:var(--pass-ink);
  -webkit-mask:radial-gradient(circle at 0 var(--pl),#0000 10px,#000 10.5px) left/51% 100% no-repeat,radial-gradient(circle at 100% var(--pl),#0000 10px,#000 10.5px) right/51% 100% no-repeat;
  mask:radial-gradient(circle at 0 var(--pl),#0000 10px,#000 10.5px) left/51% 100% no-repeat,radial-gradient(circle at 100% var(--pl),#0000 10px,#000 10.5px) right/51% 100% no-repeat;filter:drop-shadow(0 12px 18px rgb(19 12 36/.28))}
.sheet+.pass,.rail-w+.pass,.photo-w+.pass{margin-top:var(--gap-s)}
.pass.p-night{--pass-bg:rgb(30 21 54/.96);--pass-ink:var(--canvas);--pass-k:var(--blush);--pass-g2:rgb(247 245 251/.9)}
.pass.p-dawn{--pass-bg:rgb(255 244 249/.96)}
.pass-l{height:var(--pl);display:flex;align-items:center;justify-content:space-between;padding:0 18px;background:var(--plum);color:#fff;border-bottom:2px dashed rgb(255 255 255/.3)}
.pass-l .lg{width:96px;height:auto}
.pass-l b{font:600 .875rem/1.2 var(--f-b);letter-spacing:.06em;text-transform:uppercase;opacity:.92}
.pass-r{padding:16px 18px 14px;display:grid;gap:14px}
.pass-r dl{display:grid;gap:14px}
.pass dt{font:600 .875rem/1 var(--f-b);letter-spacing:.08em;color:var(--pass-k);margin-bottom:6px}
.pass dd{font:400 .9375rem/1.45 var(--f-b)}
.pass-f{font:500 .875rem/1.35 var(--f-b);color:var(--pass-g2);border-top:1px solid var(--hair);padding-top:10px}
.p-night .pass-f{border-top-color:var(--hair-d)}
.pass .tbc{color:var(--pass-g2)}

/* ---- tables, lists ---- */
.meals{width:100%;border-collapse:collapse;font-size:.9375rem}
.meals th,.meals td{padding:.78rem .4rem;text-align:left;border-bottom:1px solid var(--hair);vertical-align:baseline}
.dark .meals th,.dark .meals td{border-color:var(--hair-d)}
.meals thead th{font:600 .875rem/1 var(--f-b);color:var(--ink-g2);padding-top:.1rem}
.dark .meals thead th{color:rgb(247 245 251/.9)}
.meals tbody th{font-weight:600;width:38%}
.meals tr:last-child>*{border-bottom:0}
.day{display:grid;gap:0;font-size:.9375rem;line-height:1.4}
.day li{padding:10px 0;border-top:1px solid var(--hair)}
.day b{font-weight:600}
.jlist{display:grid;gap:10px;margin-top:12px;font:500 .9375rem/1.35 var(--f-b)}
.jlist li{display:grid;grid-template-columns:26px 1fr;gap:10px;align-items:start}
.jlist .pn{width:26px;height:26px;border-radius:50%;background:var(--plum);color:#fff;display:grid;place-items:center;font:700 .875rem/1 var(--f-d)}
.zstops{counter-reset:zs;margin-top:6px}
.zstops li{counter-increment:zs;position:relative;display:grid;gap:2px;padding:12px 0 12px 42px;border-top:1px solid var(--hair)}
.zstops li::before{content:counter(zs);position:absolute;left:0;top:12px;width:28px;height:28px;border-radius:50%;background:var(--plum);color:#fff;display:grid;place-items:center;font:600 .875rem/1 var(--f-d)}
.zstops b{font:700 1.0625rem/1.2 var(--f-d)}
.zstops span{font:400 .9375rem/1.4 var(--f-b);color:var(--ink-g2)}
.zd-t p{margin:6px 0 10px}
.ticks{display:grid;gap:10px;margin-top:12px}
.ticks li{position:relative;padding-left:22px}
.ticks li::before{content:"";position:absolute;left:2px;top:.55em;width:9px;height:9px;border-radius:50%;background:var(--plum)}
.ticks.plain li::before{width:6px;height:6px;top:.65em;left:4px}
.nsteps{display:grid;gap:0;font-size:.9375rem;line-height:1.4;margin-top:6px}
.nsteps li{display:grid;grid-template-columns:104px 1fr;gap:12px;padding:10px 0;border-top:1px solid var(--hair-d)}
.nsteps li.cold{grid-template-columns:1fr}
.nsteps b{font:600 .9375rem var(--f-b);font-variant-numeric:tabular-nums}
.nsteps .hot b{color:var(--blush)}
.ntime{margin:12px 0 4px}
.ntime svg{width:100%;height:auto;max-height:56px;display:block}
.ntime .t0{stroke:var(--blush);opacity:.4;stroke-width:2}
.ntime .band{fill:var(--blush);opacity:.85}
.ntime .t1{stroke:var(--canvas);stroke-width:2.4}
.ntime .tk circle{fill:var(--canvas)}

/* ---- infographics: every rendered label >= 14px (JS sets --m-fs; the numbers here are the measured fallback) ---- */
.jmap svg,.zmap svg,.nloc svg,.nring svg{display:block;width:100%;height:auto;overflow:visible;color:var(--ink)}
.jmap svg{max-width:300px;margin:0 auto}
.jmap .outline path{fill:rgb(247 245 251/.7);stroke:var(--line);stroke-width:1.5;stroke-linejoin:round}
.jmap .fuji{fill:none;stroke:var(--ink-g2);stroke-width:2}
.jmap .lbl circle{fill:var(--plum)}
.jmap .pin{font:700 var(--m-fs,20px) var(--f-d);fill:#fff}
.zmap .land path,.zmap .land{fill:rgb(247 245 251/.7);stroke:var(--line);stroke-width:1.6;stroke-linejoin:round}
.zmap .ctx path,.zmap .ctx{fill:none;stroke:var(--line);stroke-width:1;opacity:.4}
.zmap .lake{fill:rgb(142 134 166/.28)}
.zmap .rua{fill:none;stroke:var(--ink-g2);stroke-width:1.8}
.zmap .route{fill:none;stroke:var(--plum);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.zmap .stop circle{fill:var(--plum)}
.zmap text{font:600 var(--m-fs,25.6px) var(--f-b);fill:var(--ink);paint-order:stroke;stroke:rgb(247 245 251/.85);stroke-width:4px;stroke-linejoin:round}
.zmap .ll{font-weight:500;fill:var(--ink-g2)}
.zmap{margin-top:12px}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:8px;align-items:center}
.duo .ring,.duo .loc{min-width:0}
.nloc .land path,.nloc .land{fill:rgb(214 200 244/.14);stroke:var(--blush);stroke-opacity:.8;stroke-width:1.2}
.nloc .ctx path,.nloc .ctx{fill:rgb(214 200 244/.06);stroke:none}
.nloc .arctic{fill:none;stroke:var(--blush);stroke-width:1.2;stroke-dasharray:.02 .014}
.nloc .lof circle{fill:var(--blush)}
.nloc text{font:600 var(--m-fs,17.5px) var(--f-b);fill:var(--canvas);paint-order:stroke;stroke:rgb(19 12 36/.85);stroke-width:3px;stroke-linejoin:round}
.nring .r0{stroke:var(--blush);opacity:.4}
.nring .r1{stroke:var(--blush);stroke-dasharray:1;stroke-dashoffset:0}
.nring .rl text{font:600 var(--m-fs,21px) var(--f-b);fill:var(--blush);opacity:.9}
.nring .rl text.on{font-weight:800;fill:#fff;opacity:1}

/* seasons (NZ): 4 x 3, the word on every cell so colour is never the only cue */
.cal-k{font:600 .875rem/1.2 var(--f-b);margin:0 0 8px;color:var(--ink-g2)}
.cal{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-bottom:12px}
.cal li{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-height:54px;padding:6px 2px;border-radius:12px;text-align:center;color:var(--ink)}
.cal li b{font:700 .9375rem/1.2 var(--f-b)}
.cal li .sn{display:block;font:500 .875rem/1.2 var(--f-b)}
.cal .s-summer{background:oklch(90% .07 70)}.cal .s-autumn{background:oklch(88% .07 40)}.cal .s-winter{background:oklch(88% .05 250)}.cal .s-spring{background:oklch(90% .07 150)}

/* ---- trip card ---- */
.trip-s{padding:var(--pad)}
.trip{display:grid;gap:12px}
.trip-c{font:600 .875rem/1.2 var(--f-b);color:var(--plum)}
.dark .trip-c{color:var(--blush)}
.trip h3{font:700 1.25rem/1.2 var(--f-d);letter-spacing:-.01em}
.trip-n{font:500 .9375rem/1.3 var(--f-b);color:var(--ink-g2)}
.dark .trip-n{color:rgb(247 245 251/.9)}
.trip-b{display:grid;gap:8px}
.trip-ph{position:relative;aspect-ratio:2.4/1;border-radius:var(--r-tile);overflow:hidden;margin:-4px -4px 4px}
.trip-ph img{width:100%;height:100%;object-fit:cover}
.trip-cc{position:absolute;left:8px;bottom:8px;padding:6px 10px;border-radius:10px;background:rgb(247 245 251/.86);color:var(--ink);font:600 .875rem/1.2 var(--f-b)}
.m-fare{display:grid;gap:10px;margin:4px 0 2px;position:relative}
.m-fare input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.m-from{font:700 1.0625rem/1.25 var(--f-d);letter-spacing:-.01em;white-space:nowrap}
.m-from .tbc{font:400 .875rem var(--f-b);white-space:normal}
.m-from-f{display:none}
.m-fare input:nth-of-type(2):checked ~ .m-from-g{display:none}
.m-fare input:nth-of-type(2):checked ~ .m-from-f{display:block}
.m-seg{display:grid;grid-template-columns:1fr 1fr;gap:2px;padding:3px;border-radius:14px;background:rgb(27 18 48/.08)}
.dark .m-seg{background:rgb(255 255 255/.1)}
.m-seg label{min-height:46px;display:grid;place-items:center;padding:0 6px;text-align:center;font:600 .9375rem/1.15 var(--f-b);border-radius:11px;cursor:pointer;color:var(--ink-g2);transition:background-color .2s,color .2s}
.dark .m-seg label{color:rgb(247 245 251/.9)}
.m-fare input:nth-of-type(1):checked ~ .m-seg label:nth-child(1),.m-fare input:nth-of-type(2):checked ~ .m-seg label:nth-child(2){background:#fff;color:var(--plum);box-shadow:0 1px 3px rgb(19 12 36/.18)}
.dark .m-fare input:nth-of-type(1):checked ~ .m-seg label:nth-child(1),.dark .m-fare input:nth-of-type(2):checked ~ .m-seg label:nth-child(2){background:var(--blush);color:var(--night)}
.m-fare input:focus-visible ~ .m-seg label{outline:0}
.m-fare input:nth-of-type(1):focus-visible ~ .m-seg label:nth-child(1),.m-fare input:nth-of-type(2):focus-visible ~ .m-seg label:nth-child(2){outline:3px solid var(--plum);outline-offset:1px}
.trip ul{display:grid;margin-top:4px}
.trip li{padding:9px 0;border-top:1px solid var(--hair);font:400 .9375rem/1.35 var(--f-b)}
.dark .trip li{border-top-color:var(--hair-d)}
.trip ul li:nth-child(2){display:none}   /* the old "From ..." line: the fare block above carries it */
.dark .trip .btn.pri{background:var(--blush);color:var(--night);box-shadow:none}

/* ================================================================ INTERLUDES ================================================================ */
.exit{position:relative;z-index:1;height:62svh;pointer-events:none}
.exit .chip-cap{position:absolute;left:24px;top:max(calc(var(--hh) + 14px),calc(var(--mt) + var(--mh)*.14))}
.chap>.sheet:last-of-type{margin-bottom:0}
.trans{position:relative;z-index:3;height:54svh;margin-top:-8svh;padding:0 24px;display:flex;flex-direction:column;justify-content:space-around;pointer-events:none}
.trans .tl{width:max-content;max-width:100%;padding:12px 15px 14px;border-radius:var(--r-chip);box-shadow:var(--edge-l),0 8px 22px -12px rgb(19 12 36/.45)}
.trans .tl.w{background:rgb(247 245 251/.84);color:var(--ink)}
.trans .tl.d{background:rgb(19 12 36/.68);color:var(--canvas);box-shadow:var(--edge-d)}
.trans .ttl.m{font:700 1.375rem/1.2 var(--f-d);letter-spacing:-.015em;text-wrap:balance}
.trans .ttl.sm{font:600 1rem/1.35 var(--f-b);margin-top:6px;letter-spacing:0}
.t-jn{background:linear-gradient(to bottom,rgb(134 115 148/0) 0,rgb(236 196 218/.9) 24%,rgb(176 150 200) 48%,var(--sky-nr) 74%,var(--sky-nr) 100%)}
.t-jn .tl.w{align-self:flex-start}.t-jn .tl.d{align-self:flex-start;margin-left:0}
.t-nn{background:linear-gradient(to bottom,rgb(61 77 117/0) 0,rgb(26 40 82/.9) 22%,rgb(40 44 98) 42%,rgb(120 110 170) 70%,var(--sky-nz) 100%)}
.t-nn .tl{align-self:flex-start}

/* hero + cloud */
.hero{position:relative;height:100svh;min-height:560px;background:#2a2935;color:#fff;overflow:hidden;isolation:isolate}
.hero-sky{position:absolute;inset:0;z-index:0}
.hero-sky img{width:100%;height:100%;object-fit:cover;object-position:50% 20%}
.hero-wall{position:absolute;left:50%;top:0;height:100%;width:auto;aspect-ratio:1324/3210;transform:translateX(-50%) translateY(-9svh);z-index:1;display:block}
.hero-wall img{height:116%;width:auto;max-width:none;display:block}
.hero::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,#2a2935 0,rgb(42 41 53/0) 18%,rgb(42 41 53/0) 82%,#2a2935 100%);pointer-events:none}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:56%;z-index:2;background:linear-gradient(to bottom,rgb(26 24 36/0),rgb(26 24 36/.9) 36%,rgb(26 24 36/.97));pointer-events:none}
.chip-s{position:absolute;left:var(--gut);top:calc(var(--hh) + 10px);z-index:4}
.chip-s span{display:inline-block;padding:6px 12px;border-radius:12px;background:rgb(19 12 36/.55);color:#fff;font:500 .875rem/1.2 var(--f-b)}
.hero-copy{position:absolute;left:24px;right:24px;bottom:calc(var(--sab) + 92px);z-index:4;display:grid;gap:10px}
.hero .ttl{font:700 clamp(1.75rem,8vw,2.125rem)/1.08 var(--f-d);letter-spacing:-.025em;text-wrap:balance;color:#fff;text-shadow:0 2px 14px rgb(10 6 24/.6)}
.hero .sub{font:400 1rem/1.45 var(--f-b);color:rgb(247 245 251/.96);max-width:34ch;text-shadow:0 1px 10px rgb(10 6 24/.6)}
.hero .acts{display:flex;align-items:center;gap:10px;margin-top:6px;flex-wrap:wrap}
.hero .lnk{color:#fff}
.hero .cue{z-index:4;bottom:calc(var(--sab) + 12px)}
.cloud{position:relative;height:118svh;overflow:hidden;color:var(--ink);background:var(--sky-jp);isolation:isolate}
.cloud-sky{position:absolute;inset:0}
.cloud-sky img{width:100%;height:100%;object-fit:cover;object-position:50% 60%}
.cloud::after{content:"";position:absolute;left:0;right:0;bottom:0;height:38%;background:linear-gradient(to bottom,rgb(134 176 252/0),var(--sky-jp));pointer-events:none}
.cloud .ttl.m{font:700 clamp(1.625rem,7.4vw,2rem)/1.12 var(--f-d);letter-spacing:-.025em;text-wrap:balance;color:var(--ink);text-shadow:0 1px 18px rgb(247 245 251/.7)}
.cloud .b1{position:absolute;left:24px;right:36px;top:30%}
.cloud .b2{position:absolute;left:24px;right:24px;top:70%;z-index:2}
.cloud .coord{margin-top:8px;color:var(--ink-g2)}

/* ================================================================ SITE ================================================================ */
.site{position:relative;isolation:isolate;padding:var(--gap-m) 0 var(--gap-s);background:#8b7dbf}
.site-bg{position:sticky;top:0;height:100svh;margin-bottom:-100svh;z-index:-1;background:#8b7dbf url(../assets/motion/site-bg-m.webp) center/cover;pointer-events:none}
.site::before{content:"";position:absolute;left:0;right:0;top:-40svh;height:40svh;z-index:-2;background:linear-gradient(to bottom,rgb(139 125 191/0),#8b7dbf)}
.site>.sheet{margin-bottom:var(--gap-s)}
.site .sheet{background:rgb(247 245 251/.72);-webkit-backdrop-filter:none;backdrop-filter:none}   /* the backdrop is pre-blurred: tint only, no live blur */
.mgrid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;margin-top:14px}
.mgrid button{min-height:48px;border-radius:14px;border:1.5px solid rgb(27 18 48/.22);background:rgb(255 255 255/.6);font:600 .9375rem var(--f-b);color:var(--ink);cursor:pointer}
.mgrid button:hover{border-color:var(--plum)}
.mgrid button[aria-checked=true]{background:var(--plum);border-color:var(--plum);color:#fff}
.d-out{display:grid;gap:0;margin-top:14px}
.cty{display:grid;grid-template-columns:56px 1fr;gap:12px;align-items:center;padding:10px 0;border-top:1px solid var(--hair)}
.cty img{width:56px;height:56px;border-radius:12px;object-fit:cover}
.cty h3{font:700 1rem/1.2 var(--f-d)}
.cty p{font:400 .9375rem/1.3 var(--f-b);color:var(--ink-g2);margin-top:2px}
#mo-dep{margin-top:6px;padding-top:12px;border-top:1px solid var(--hair);display:grid;gap:8px}
#mo-dep p+p{margin-top:0}
#mo-btn{margin-top:16px}
.lead{margin-top:6px}
.filters{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.filters button{min-height:46px;padding:0 18px;border-radius:23px;border:1.5px solid rgb(27 18 48/.22);background:rgb(255 255 255/.6);font:600 .9375rem var(--f-b);color:var(--ink);cursor:pointer}
.filters button.on{background:var(--plum);border-color:var(--plum);color:#fff}
.trips{display:grid;gap:14px;margin-top:14px}
.trips .trip{padding:14px;border-radius:20px;background:rgb(255 255 255/.55);box-shadow:inset 0 0 0 1px rgb(255 255 255/.6)}
.trips .trip.is-off{display:none}
.trips .trip-ph{margin:0 0 4px}
#ab-warn{background:var(--plum);color:#fff;border-radius:var(--r-tile);padding:18px 18px 20px!important;border-top:0!important;margin-top:18px}
#ab-warn .pull{color:#fff;padding-top:14px}#ab-warn .pull::before{background:var(--blush)}
.sheet>.blk.warn+.blk{border-top:0;padding-top:0;margin-top:18px}
#ab-check .lnk{min-height:48px;text-decoration:underline}
.seq{display:grid;gap:0;margin-top:10px;counter-reset:s}
.seq li{display:grid;grid-template-columns:34px 1fr;gap:12px;position:relative;padding-bottom:16px}
.seq li::before{content:"";position:absolute;left:16px;top:34px;bottom:0;width:2px;background:rgb(91 13 61/.25)}
.seq li:last-child::before{display:none}
.seq .n{width:34px;height:34px;border-radius:50%;background:var(--plum);color:#fff;display:grid;place-items:center;font:700 1rem/1 var(--f-d)}
.seq .then .n{background:transparent;color:var(--plum);box-shadow:inset 0 0 0 2px var(--plum)}
.seq p{padding-top:5px;font:400 1rem/1.45 var(--f-b)}
.sheet>.seq+.blk{margin-top:6px;padding-top:18px;border-top:1px solid var(--hair)}
#bk-dep .btn{margin-top:16px;width:100%}
#bk-cancel .meals{margin-top:8px}

/* accordions: every closed row says what is inside */
details>summary{list-style:none;cursor:pointer;position:relative}
details>summary::-webkit-details-marker{display:none}
details>summary::after{content:"";position:absolute;right:6px;top:22px;width:9px;height:9px;border-right:2px solid var(--plum);border-bottom:2px solid var(--plum);transform:rotate(45deg);transition:transform .25s var(--out)}
.dark details>summary::after{border-color:var(--blush)}
details[open]>summary::after{transform:rotate(-135deg);top:26px}
.day-acc>summary{display:grid;gap:3px;min-height:60px;padding:6px 36px 6px 0}
.sm-t{font:700 1.125rem/1.2 var(--f-d);letter-spacing:-.01em}
.sm-p{font:400 .875rem/1.3 var(--f-b);color:var(--ink-g2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.day-acc[open] .sm-p{display:none}
.day-acc .acc-b{padding-top:8px}
.day-acc .acc-b .lead{margin-bottom:6px}
.fqg{border-top:1px solid var(--hair)}
.fqg:first-child{border-top:0}
.fqg>summary{display:grid;gap:3px;min-height:64px;padding:10px 36px 10px 0;align-content:center}
.fqg-h{display:flex;align-items:center;gap:10px}
.m-n{min-width:26px;height:26px;padding:0 8px;border-radius:13px;display:inline-grid;place-items:center;font:600 .875rem/1 var(--f-b);background:rgb(91 13 61/.1);color:var(--plum)}
.fqg[open] .sm-p{display:none}
.fqg-b{padding:0 0 8px}
.fqg-b details{border-top:1px solid var(--hair)}
.fqg-b summary{min-height:52px;padding:10px 34px 10px 0;display:flex;align-items:center;font:500 1rem/1.35 var(--f-b)}
.fqg-b summary::after{top:21px;width:8px;height:8px;border-color:var(--ink-g2)}
.fqg-b details[open]>summary::after{top:25px}
.fqg-b details[open]>summary{font-weight:600}
.fqg-b details p{padding:0 0 14px}
.fq-note{margin-top:8px;font:400 .9375rem/1.4 var(--f-b);color:var(--ink-g2)}

/* booking form */
.form-s{background:rgb(247 245 251/.9)!important}
.w1-row{display:grid;grid-template-columns:92px 1fr;gap:16px;align-items:center;margin-bottom:18px}
.w1{aspect-ratio:3/4;border-radius:18px;overflow:hidden;background:var(--deep)}
.w1 img{width:100%;height:100%;object-fit:cover}
.b-copy{display:grid;gap:8px}
.b-copy p{font:400 .9375rem/1.45 var(--f-b)}
.bform{display:grid;gap:14px}
.steps{display:flex;justify-content:space-between;position:relative;margin:0;padding:0 2px}
.steps::before{content:"";position:absolute;left:30px;right:30px;top:15px;height:2px;background:rgb(27 18 48/.18)}
.steps li{position:relative;z-index:1;display:grid;justify-items:center;gap:5px;min-width:0;font:600 .875rem/1.2 var(--f-b);color:var(--ink-g2)}
.steps .dot{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:#fff;box-shadow:inset 0 0 0 2px rgb(27 18 48/.3);font:700 .875rem/1 var(--f-b);color:var(--ink-g2)}
.steps .act .dot{box-shadow:0 0 0 3px var(--plum);color:var(--plum)}
.steps .act .st{color:var(--plum);font-weight:700}
.steps .done .dot{background:var(--plum);box-shadow:none;color:#fff;font-size:0}
.steps .done .dot::before{content:"";width:6px;height:12px;border:solid #fff;border-width:0 2.5px 2.5px 0;transform:rotate(45deg) translate(-1px,-1px)}
.steps .done .st{color:var(--ink)}
.steps .skp .dot{border-style:dashed;opacity:.8}
.note{font:400 .875rem/1.4 var(--f-b);color:var(--ink-g2)}
.note.req{font-weight:600}
.star{color:#9B1C31;font-weight:700}
.f{display:grid;gap:6px;font:600 .9375rem/1.25 var(--f-b);position:relative}
.f select,.f input[type=tel],.f input[type=email],.trav input{width:100%;min-height:56px;padding:0 14px;border-radius:12px;border:1.5px solid rgb(27 18 48/.3);background:#fff;font:400 16px var(--f-b);color:var(--ink);appearance:none;-webkit-appearance:none}
.f select{background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%235B0D3D' stroke-width='2'/%3E%3C/svg%3E") no-repeat right 16px center;padding-right:40px}
.f select:disabled{color:var(--ink-g2);background-color:rgb(27 18 48/.05);border-style:dashed;opacity:1}
.f input:hover,.f select:hover:not(:disabled),.trav input:hover{border-color:var(--plum)}
.f :focus-visible,.trav :focus-visible{outline:3px solid var(--plum);outline-offset:1px;border-color:var(--plum)}
.f [aria-invalid=true],.trav [aria-invalid=true]{border-color:#9B1C31;box-shadow:0 0 0 1px #9B1C31}
.err{font:600 .875rem/1.3 var(--f-b);color:#9B1C31;display:flex;gap:6px;align-items:flex-start}
.err::before{content:"!";flex:none;width:18px;height:18px;border-radius:50%;background:#9B1C31;color:#fff;display:grid;place-items:center;font:700 .8125rem/1 var(--f-b);margin-top:1px}
.err[hidden]{display:none}
.help{margin-top:-6px}
.cnts{display:grid;gap:0;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.cnt{display:flex;align-items:center;justify-content:space-between;min-height:60px;padding:6px 0}
.cnt+.cnt{border-top:1px solid var(--hair)}
.cl{font:600 .9375rem var(--f-b)}
.stp{display:flex;align-items:center;gap:6px}
.stp button{width:48px;height:48px;border-radius:50%;border:1.5px solid rgb(91 13 61/.45);background:#fff;color:var(--plum);font:600 1.5rem/1 var(--f-b);cursor:pointer;display:grid;place-items:center;padding:0 0 3px}
.stp button:active{background:rgb(91 13 61/.1)}
.stp input{width:48px;min-height:48px;text-align:center;border:0;background:transparent;font:600 1.125rem var(--f-b);color:var(--ink);-moz-appearance:textfield;padding:0}
.stp input::-webkit-outer-spin-button,.stp input::-webkit-inner-spin-button{-webkit-appearance:none}
.trav{border:0;margin:0;padding:0;min-width:0;display:grid;gap:10px}
.trav legend{padding:0;font:600 .9375rem/1.25 var(--f-b);margin-bottom:8px}
.trav label{display:grid;gap:6px;font:500 .875rem/1.25 var(--f-b);color:var(--ink-g2)}
.trav label+label{margin-top:8px}
.sum{font:500 .9375rem/1.4 var(--f-b);padding:12px 14px;border-radius:12px;background:rgb(91 13 61/.07)}
.chk{display:flex;align-items:center;gap:12px;min-height:52px;font:400 .9375rem/1.35 var(--f-b)}
.chk input{width:28px;height:28px;flex:none;margin:0;accent-color:var(--plum)}
.b-ok{padding:14px;border-radius:12px;background:rgb(91 13 61/.08)}
.b-ok p{margin-top:6px;font-size:.9375rem}

/* ---- paradise (item 1): one arrangement, name under the card, dots, one note ---- */
.para{position:relative;isolation:isolate;overflow:hidden;color:#fff;background:#120b1f;padding:56px 0 40px}
.p-bg{position:absolute;inset:-10%;z-index:-1}
.p-bg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:blur(36px) brightness(.4) saturate(1.2);transition:opacity .6s;opacity:0}
.p-bg img.on{opacity:1}
.p-in{display:grid;grid-template-columns:minmax(0,1fr);gap:0;position:relative}
.p-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:0 24px}
.p-count{white-space:nowrap;font:500 .875rem/1 var(--f-b);font-variant-numeric:tabular-nums;color:rgb(247 245 251/.9)}
.p-count b{font:300 1.5rem var(--f-b)}
.p-stage{margin-top:22px}
.p-track{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 17vw 10px;scrollbar-width:none;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
.p-track::-webkit-scrollbar{display:none}
.p-card{flex:0 0 66vw;aspect-ratio:2/3;scroll-snap-align:center;border-radius:22px;overflow:hidden;box-shadow:0 0 0 1px rgb(255 255 255/.22),0 24px 40px -20px rgb(0 0 0/.7);transform:scale(.9);filter:brightness(.7);transition:transform .5s var(--out),filter .5s}
.p-card.on{transform:none;filter:none}
.p-card img{width:100%;height:100%;object-fit:cover}
.p-title{padding:18px 24px 0;text-align:center;display:grid;gap:8px;justify-items:center}
.p-name{display:grid;gap:2px}
.pn{font:800 1.5rem/1.05 var(--f-d);letter-spacing:.035em;text-transform:uppercase}
.pc{font:600 .9375rem/1.2 var(--f-b);letter-spacing:.14em;text-transform:uppercase;color:rgb(247 245 251/.92)}
.p-line{font:400 1rem/1.4 var(--f-b);max-width:30ch}
.p-cta{display:grid;gap:10px;padding:18px 24px 0}
.p-cta .btn{width:100%;min-height:54px;white-space:normal;line-height:1.15;gap:.3em}
.p-cta .solid{background:#fff;color:var(--plum)}
.p-cta .ghost{background:rgb(255 255 255/.14);color:#fff;box-shadow:inset 0 0 0 1.5px rgb(255 255 255/.55)}
.tm{font-weight:400;font-size:.875rem;opacity:.78}
.p-ctl{display:flex;align-items:center;justify-content:center;gap:4px;margin-top:14px}
.p-nav{flex:none;width:48px;height:48px;border-radius:50%;border:0;background:rgb(255 255 255/.14);box-shadow:inset 0 0 0 1px rgb(255 255 255/.4);display:grid;place-items:center;cursor:pointer;color:#fff}
.p-nav svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.p-dots{display:flex}
.p-dots button{width:44px;height:48px;border:0;background:transparent;display:grid;place-items:center;cursor:pointer}
.p-dots i{width:8px;height:8px;border-radius:4px;background:rgb(255 255 255/.5);transition:width .25s var(--out),background-color .25s}
.p-dots button[aria-current=true] i{width:24px;background:#fff}
.p-note{padding:18px 24px 0;font:400 .875rem/1.4 var(--f-b);color:rgb(247 245 251/.9);text-align:center;max-width:46ch;margin-inline:auto}
.foot{position:relative;background:linear-gradient(to bottom,#120b1f 0,#120b1f 100%);padding:8px 0 calc(var(--sab) + 28px)}
.foot-in{width:calc(100% - 2*var(--gut));margin:0 auto;padding:22px 18px;border-radius:var(--r-sheet);background:rgb(30 21 54/.94);color:var(--canvas);box-shadow:var(--edge-d);display:grid;gap:16px}
.f-logo .lg{height:52px;width:auto}
.f-links{display:flex;flex-wrap:wrap;gap:0 18px}
.f-links a,.f-tbc{display:inline-flex;align-items:center;gap:.3em;min-height:44px;min-width:44px;font:500 1rem var(--f-b);text-decoration:none}
.f-links a{text-underline-offset:4px}
.f-legal p{font:400 .9375rem/1.45 var(--f-b);color:rgb(247 245 251/.92)}
.f-legal p+p{margin-top:6px}.f-b{font-weight:600!important}
.f-s{font:400 .875rem/1.4 var(--f-b);color:rgb(247 245 251/.85)}
.f-s+.f-s{margin-top:-8px}

/* short portrait phones (360x640): the chip is smaller and sits 16px under the header, so it keeps clear of the Fuji summit */
@media (orientation:portrait) and (max-height:700px){
  .land .chip-cap{top:calc(var(--hh) + 16px);padding:8px 12px 9px}
  .chip-cap .cap{font-size:.9375rem;line-height:1.25}
  .chip-cap .coord{margin-top:2px}
}

/* ================================================================ LANDSCAPE PHONES (844x390 and friends) ================================================================
   Same gate as portrait in the build: (max-width:767px) or (max-height:560px). Never the desktop layout.
   The scene becomes the 16:9 desktop master with its own title and foreground (the sandwich works here).
   Sheets, rails, tickets and trips live in one right-hand column; the left 44% stays scenery, so the title is never covered. */
@media (orientation:landscape) and (max-height:560px){
  :root{--gap-m:12svh;--gap-l:20svh;--gut:12px;--colw:min(440px,52vw);--hh:calc(var(--sat) + 6px + 44px)}
  .hd{top:calc(var(--sat) + 6px);height:44px;left:12px;right:auto;width:min(210px,40vw);padding:0 2px 0 14px;border-radius:22px}
  .hd .brand{height:44px;width:74px}.hd .lg{height:28px;top:8px}
  .mb{width:44px;height:44px}.mb .bars i{left:12px;right:12px}.mb .bars i:nth-child(1){top:17px}.mb .bars i:nth-child(2){top:25px}
  .mb[aria-expanded=true] .bars i:nth-child(1),.mb[aria-expanded=true] .bars i:nth-child(2){top:21px}
  .hd{right:auto}
  .mp{padding:calc(var(--hh) + 8px) 24px 16px;align-items:flex-start}
  .mp nav{display:grid;grid-template-columns:repeat(2,max-content);column-gap:48px;align-content:start;margin:0}
  .mp nav a:not(.btn){font-size:1.375rem;min-height:48px}
  .mp .btn{grid-column:1/-1;justify-self:start;margin-top:8px;min-height:52px}
  .scene{--ph:100svh}
  .plate picture{left:0;bottom:0;width:100%;height:100%;transform:translate3d(calc(var(--p)*-1.5%),calc(var(--p)*3%),0)}
  .plate{height:100%}
  .master{object-fit:cover;object-position:50% 100%}
  .ttlbox{left:5vw;right:auto;top:auto;bottom:34svh;height:auto;width:46vw}
  .ttl3{font-size:min(30svh,13vw)}
  .ttl3.jp{font-size:min(24svh,11vw)}
  .ttl3.nr{font-size:min(25svh,9.2vw)}
  .ttl3.nz{font-size:min(16svh,7.2vw);line-height:.98}
  .ttl3.nz span{line-height:.98}
  .fg{inset:0;height:auto}
  .fg picture{left:0;bottom:0;width:100%;height:100%;transform:translate3d(calc(var(--p)*-1.5%),calc(var(--p)*3%),0)}
  .plate picture{-webkit-mask-image:none;mask-image:none}
  .fg img{object-fit:cover;object-position:50% 100%}
  .land .chip-cap{left:5vw;right:auto;top:auto;bottom:12px;max-width:min(330px,40vw)}
  .land .cue{left:auto;right:16px;bottom:12px;flex-direction:row;gap:10px;width:auto}
  .land .cue i{height:2px;width:24px;animation:none;background:linear-gradient(to right,#fff,transparent)}
  .land{height:100svh}
  .sheet,.rail-w,.photo-w,.pass,.head-chip{width:var(--colw);margin-left:auto;margin-right:16px}
  .head-chip{width:max-content}
  .rail{padding:0 0 0 0;scroll-padding-inline:0}
  .rail>.ph{flex-basis:68%}
  .sheet{padding:16px}
  .exit{height:70svh}.exit .chip-cap{left:auto;right:16px;top:calc(var(--hh) + 6px)}
  .h-sheet{font-size:1.375rem}
  .trans{height:90svh;margin-top:-20svh;padding:0 16px;justify-content:space-around}
  .trans .tl{align-self:flex-end!important}
  .hero{min-height:0;height:100svh}
  .hero-wall{left:0;top:0;width:100%;height:100%;aspect-ratio:auto;transform:none}
  .hero-wall img{position:absolute;left:calc(74vw - 60vw);top:50%;width:120vw;height:auto;max-width:none;transform:translateY(-50%)}
  .hero::before{background:linear-gradient(90deg,rgb(26 24 36/.9) 0,rgb(26 24 36/.6) 38%,rgb(26 24 36/0) 62%)}
  .hero::after{display:none}
  .hero-copy{left:max(16px,env(safe-area-inset-left));right:auto;bottom:auto;top:50%;transform:translateY(-46%);width:min(400px,46vw);gap:8px}
  .hero .ttl{font-size:clamp(1.5rem,6.6svh,1.875rem)}
  .hero .sub{font-size:.9375rem}
  .hero .cue{display:none}
  .cloud{height:100svh}
  .cloud .b1{top:26%;left:7vw;right:auto;width:60vw}.cloud .b2{top:58%;left:7vw;right:auto;width:60vw}
  .bar{left:12px;right:auto;width:min(300px,42vw)}
  .bar .hold{font-size:1rem}
  .site{padding-top:var(--gap-m)}
  .site .sheet{width:min(560px,calc(100% - 32px));margin-inline:auto}
  .trips{grid-template-columns:repeat(2,minmax(0,1fr))}
  .para{padding:28px 0 28px}
  .p-in{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"head stage" "title stage" "cta stage" "ctl stage" "note note";column-gap:16px;padding-inline:20px;align-items:start}
  .p-head{grid-area:head;padding:0}.p-title{grid-area:title;padding:12px 0 0;text-align:left;justify-items:start}
  .p-cta{grid-area:cta;padding:14px 0 0;grid-template-columns:1fr 1fr}.p-ctl{grid-area:ctl;justify-content:flex-start}.p-stage{grid-area:stage;margin-top:0}
  .p-note{grid-area:note;padding:12px 0 0}.p-track{padding-inline:8vw}
  .p-card{flex-basis:30vw;border-radius:16px}
  .h-display{font-size:1.625rem}
}
@media (orientation:landscape) and (max-height:560px) and (min-width:700px){
  .p-card{flex-basis:26vw}
}

/* ---- narrow phones ---- */
@media (max-width:374px){
  :root{--gut:10px;--pad:14px}
  .h-sheet{font-size:1.5rem}
  .gc{grid-template-columns:minmax(0,40%) minmax(0,1fr)}
  .mgrid{gap:5px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.plate picture,.fg picture{transform:translateX(-50%)!important}}
@media (min-width:431px) and (orientation:portrait){body{max-width:none}}

.btn.is-loading{position:relative;color:transparent}
.btn.is-loading::after{content:"";position:absolute;width:22px;height:22px;border-radius:50%;border:3px solid rgb(255 255 255/.4);border-top-color:#fff;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

.sheet.flat{-webkit-backdrop-filter:none;backdrop-filter:none;background:rgb(247 245 251/.76)}
.sheet.dark.flat,.dark .sheet.flat{background:rgb(19 12 36/.8)}
.p-cta .lb{display:block}

}