/* v2: bigger, photographic, alive. Loaded after site.css on every page.
   Type: the root goes from 16px to 18px, so everything in rem scales up ~12.5%, and small
   data text (pills, notes, captions) is lifted further so nothing reads under ~16px. */
html{font-size:18px}
body{font-size:1.05rem;line-height:1.7}
.lede{font-size:clamp(1.15rem,1.8vw,1.4rem);line-height:1.6}
h1{font-size:clamp(3.2rem,8.6vw,7.4rem);line-height:.88}
h2{font-size:clamp(2.3rem,5.4vw,4.2rem)}
.kicker{font-size:.86rem}
.small{font-size:.95rem}
.note{font-size:.98rem;color:var(--muted);line-height:1.6}
.pill{font:600 .92rem/1.1 var(--body);letter-spacing:0;padding:8px 12px}
.field{font-size:1rem}
.field b{font-size:1.05rem}
table{font-size:1rem}
th{font-size:.8rem}
.answer-b{font-size:1.18rem;line-height:1.65}
.answer-k{font-size:.82rem}
.card p{font-size:1.02rem}
.faq summary{font-size:1.1rem}
.faq-a{font-size:1.04rem}
.sources ol{font-size:.95rem}
.rel-t{font-size:1.4rem}
.rel-d{font-size:1rem}
.cx-hub span,.cx-time small,.legend{font-size:.9rem}
.cx-hub b{font-size:1.5rem}
.cx-time{font-size:1.45rem}
.ch b{font-size:1.8rem}
.ch-name{font-size:1.1rem}
.ch-rank{font-size:2.4rem}
.rlist li{font-size:1rem}
.mlabel{font-size:13px}
.tip{font-size:1rem}
.park-row span,.park-total small{font-size:.9rem}
.arrive-why{font-size:1.02rem}
.foot p,.foot-grid a{font-size:1rem}
.sec{padding-block:clamp(64px,9vw,128px)}
.tool{padding:clamp(18px,3.4vw,36px)}

/* Photos */
.ph{position:relative;overflow:hidden;background:#15171c center/cover no-repeat}
.ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:var(--fx,50% 50%)}
.ph-missing{background:radial-gradient(120% 90% at 20% 10%,rgba(255,184,28,.35),transparent 55%),radial-gradient(120% 90% at 90% 90%,rgba(255,130,0,.35),transparent 55%),#14161b}
.ph-credit{position:absolute;right:12px;bottom:8px;margin:0;font-size:.72rem;color:rgba(255,255,255,.55);z-index:3;text-shadow:0 1px 2px #000}

/* Photo hero */
.phero{position:relative;min-height:clamp(600px,88vh,920px);display:grid;align-items:end;overflow:hidden;isolation:isolate;border-bottom:1px solid var(--line)}
.phero.tall{min-height:clamp(680px,96vh,1040px)}
.phero-media{position:absolute;inset:0;z-index:-2}
.phero-media .ph{position:absolute;inset:0}
.phero-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(11,12,15,.35) 0%,rgba(11,12,15,.15) 30%,rgba(11,12,15,.75) 72%,var(--night) 100%),linear-gradient(90deg,rgba(11,12,15,.75),rgba(11,12,15,0) 65%)}
.phero-in{padding-block:clamp(120px,16vh,200px) clamp(48px,7vw,88px)}
.phero-copy{max-width:62rem}
.phero .lede{color:#E9E6DF;text-shadow:0 2px 18px rgba(0,0,0,.6)}
.phero h1{text-shadow:0 6px 40px rgba(0,0,0,.45)}
.phero .board{background:rgba(10,11,14,.78);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.kb img{animation:kb 22s ease-in-out infinite alternate;transform-origin:center}
.kb2 img{animation-delay:-11s}
@keyframes kb{from{transform:scale(1.12) translate(-1.5%,1%)}to{transform:scale(1) translate(0,0)}}
.ph-split{position:absolute;inset:0;display:grid;grid-template-columns:1fr 1fr}
.ph-split .ph{position:relative}
.ph-split .ph:first-child::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 60%,rgba(255,184,28,.18))}
.ph-split .ph:last-child::after{content:"";position:absolute;inset:0;background:linear-gradient(270deg,transparent 60%,rgba(255,130,0,.18))}
.ph-seam{position:absolute;left:50%;top:0;bottom:0;width:2px;background:linear-gradient(180deg,transparent,rgba(255,255,255,.7),transparent);transform:translateX(-50%)}
.ph-seam svg{position:absolute;left:50%;top:38%;width:56px;height:56px;margin-left:-28px;fill:#fff;filter:drop-shadow(0 0 14px rgba(255,184,28,.9));animation:seam 7s ease-in-out infinite}
@keyframes seam{0%,100%{transform:translate(-120px,0) rotate(-6deg)}50%{transform:translate(120px,-30px) rotate(-12deg)}}
@media (max-width:760px){.ph-split{grid-template-columns:1fr;grid-template-rows:1fr 1fr}.ph-seam{left:0;right:0;top:50%;bottom:auto;width:auto;height:2px;transform:none;background:linear-gradient(90deg,transparent,rgba(255,255,255,.7),transparent)}.ph-seam svg{top:-28px}}

/* Postcard rail */
.cards-rail{display:grid;grid-auto-flow:column;grid-auto-columns:min(380px,82vw);gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 2px 18px;margin-top:1.6rem;scrollbar-width:thin;scrollbar-color:var(--gold) transparent}
.cards-rail:focus-visible{outline:2px solid var(--orange)}
.pcard{position:relative;display:block;aspect-ratio:4/5;border-radius:20px;overflow:hidden;scroll-snap-align:start;text-decoration:none;color:var(--text);border:1px solid var(--line);background:#14161b}
.pcard .ph{position:absolute;inset:0}
.pcard .ph img{transition:transform 1.2s var(--ease)}
.pcard:hover .ph img{transform:scale(1.07)}
.pcard::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(8,9,12,.92))}
.pcard-t{position:absolute;left:20px;right:20px;bottom:18px;z-index:2;display:grid;gap:4px}
.pcard-k{font:600 .82rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.pcard-t b{font:800 1.9rem/1 var(--display);text-transform:uppercase;letter-spacing:.01em}
.pcard-t span:last-child{color:#DCD8D0;font-size:1rem;line-height:1.45}
a.pcard:hover{color:var(--text);border-color:var(--gold)}

/* Photo band */
.pband{position:relative;min-height:clamp(520px,72vh,760px);display:grid;align-items:center;overflow:hidden;isolation:isolate;border-top:1px solid var(--line)}
.pband-ph{position:absolute!important;inset:0;z-index:-2}
.pband-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(11,12,15,.92) 0%,rgba(11,12,15,.6) 45%,rgba(11,12,15,.1) 100%)}
.pband.right .pband-shade{background:linear-gradient(270deg,rgba(11,12,15,.92) 0%,rgba(11,12,15,.6) 45%,rgba(11,12,15,.1) 100%)}
.pband.right .pband-copy{margin-left:auto}
.pband-copy{max-width:36rem;padding-block:64px}
.pband-copy p{color:#E3E0D8;font-size:1.15rem}

/* Ribbon */
.ribbon{background:#08090B;border-block:1px solid var(--line);overflow:hidden}
.ribbon-in{display:flex;align-items:center;gap:18px;padding-block:18px;flex-wrap:wrap}
.ribbon b{font:800 2rem/1 var(--display);letter-spacing:.04em}
.ribbon-line{position:relative;flex:1 1 260px;height:28px;min-width:180px}
.ribbon-line::before{content:"";position:absolute;left:0;right:0;top:50%;border-top:2px dashed rgba(255,255,255,.25)}
.ribbon-plane{position:absolute;top:0;left:0;width:28px;height:28px;animation:rib 6s cubic-bezier(.45,.05,.55,.95) infinite alternate}
.ribbon-plane svg{width:28px;height:28px;fill:#fff;filter:drop-shadow(0 0 8px rgba(255,184,28,.9))}
@keyframes rib{0%{left:0;transform:scaleX(1)}49%{transform:scaleX(1)}50%{left:calc(100% - 28px);transform:scaleX(-1)}100%{left:0;transform:scaleX(-1)}}
.ribbon-t{font:600 .95rem/1.3 var(--mono);color:var(--muted);letter-spacing:.04em}

/* Big stats */
.bigstats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2px;background:var(--line);border:1px solid var(--line);border-radius:22px;overflow:hidden;margin-top:1.6rem}
.bigstat{background:var(--night-2);padding:28px 24px}
.bigstat b{display:block;font:800 clamp(3rem,6vw,5.2rem)/.9 var(--display);font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.bigstat span{display:block;margin-top:10px;color:var(--muted);font-size:1.02rem;line-height:1.45}
@media (max-width:900px){.bigstats{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:480px){.bigstats{grid-template-columns:minmax(0,1fr)}}

/* Two-city duo */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:1.6rem}
.duo-card{position:relative;min-height:440px;border-radius:24px;overflow:hidden;display:grid;align-items:end;isolation:isolate;border:1px solid var(--line)}
.duo-card .ph{position:absolute;inset:0;z-index:-2}
.duo-card::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 30%,rgba(8,9,12,.94))}
.duo-in{padding:26px}
.duo-in b{display:block;font:800 clamp(3rem,6vw,4.6rem)/.85 var(--display)}
.duo-in p{margin:.6rem 0 0;color:#DCD8D0;font-size:1.05rem}
@media (max-width:760px){.duo{grid-template-columns:1fr}.duo-card{min-height:360px}}

/* Header gets a stronger presence */
.brand img{width:150px}
.nav{font-size:1rem}

@media (prefers-reduced-motion:reduce){.kb img,.ph-seam svg,.ribbon-plane{animation:none!important}}
/* Containment: wide boards scroll inside themselves, never the page */
.phero{grid-template-columns:minmax(0,1fr)}
.phero-in,.phero-copy{min-width:0}
.hero .wrap,.phero .wrap{min-width:0}
.board{max-width:100%}
/* Form labels: readable, not tiny mono */
.pform label>span,.pform legend{font:600 1rem/1.3 var(--body);letter-spacing:0;text-transform:none;color:var(--text)}
.pchip span{font-size:1rem}
.pform input,.pform textarea{font-size:1.05rem}
.consent{font-size:1rem}
.counter span{font-size:1.05rem}
@media (max-width:560px){h1{font-size:clamp(2.6rem,11.5vw,3.6rem)}.phero-in{padding-top:96px}.ribbon b{font-size:1.6rem}}
@media (max-width:760px){.ph-seam svg{display:none}}
/* Request-a-nonstop */
.rq{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,64px);align-items:start}
@media (max-width:900px){.rq{grid-template-columns:minmax(0,1fr)}}
.rq-total{font-size:1.1rem;color:var(--muted)}.rq-total b{font:800 2.4rem/1 var(--display);color:var(--gold);margin-right:6px}
.rq-board{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:8px}
.rq-board li{display:grid;grid-template-columns:34px minmax(0,1fr) minmax(0,120px) 40px;gap:12px;align-items:center;padding:12px 14px;border-radius:12px;background:var(--night);border:1px solid var(--line);font-size:1.05rem}
.rq-board li.rq-empty{display:block;color:var(--muted)}
.rq-rank{font:800 1.4rem/1 var(--display);color:var(--dim)}
.rq-board li:first-child .rq-rank{color:var(--gold)}
.rq-bar{height:10px;border-radius:999px;background:rgba(255,255,255,.06);overflow:hidden}.rq-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--gold),var(--orange))}
.rq-board b{text-align:right;font:800 1.3rem/1 var(--display)}
.rq-ok{color:var(--go);font-weight:600;margin:0}
/* All-guides index */
.guide-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(300px,100%),1fr));gap:12px}
.guide{display:grid;gap:6px;padding:18px 20px;border-radius:16px;background:var(--panel);border:1px solid var(--line);text-decoration:none;color:var(--text);transition:border-color .2s,transform .2s var(--ease)}
.guide:hover{border-color:var(--gold);transform:translateY(-2px);color:var(--text)}
.guide b{font:800 1.35rem/1.1 var(--display);text-transform:uppercase;letter-spacing:.02em}
.guide span{color:var(--muted);font-size:1rem;line-height:1.5}
.guides[hidden],.guide[hidden]{display:none}
input[type=search]{width:100%;background:var(--night);color:var(--text);border:1px solid var(--line-2);border-radius:12px;padding:14px 16px;font:inherit;font-size:1.1rem;min-height:52px}
/* Nav never wraps; with five items plus the CTA it collapses to the menu button earlier. */
.nav a{white-space:nowrap}
@media (max-width:1180px){
  .nav{position:absolute;left:0;right:0;top:66px;flex-direction:column;gap:0;background:var(--night-2);border-bottom:1px solid var(--line);padding:8px clamp(16px,4.5vw,48px) 16px;display:none}
  .nav.open{display:flex}
  .nav a{padding:12px 0;border-bottom:1px solid var(--line);font-size:1.05rem}
  .menu{display:block}
  .top .btn-sm{margin-left:auto}
}
/* Phones: darker shade so copy reads over bright sky, and room under the buttons for the photo credit. */
@media (max-width:760px){
  .phero-shade{background:linear-gradient(180deg,rgba(11,12,15,.5) 0%,rgba(11,12,15,.6) 35%,rgba(11,12,15,.86) 70%,var(--night) 100%)}
  .phero-in{padding-bottom:72px}
  .phero .ph-credit{left:16px;right:16px;text-align:right;line-height:1.35}
}
/* The shade lives inside the transformed media layer, so it must stack above the photos there. */
.phero-media .phero-shade{z-index:1}