@font-face{font-family:"Mona";src:url(../fonts/mona.woff2) format("woff2");font-weight:200 900;font-stretch:75% 125%;font-display:swap}
@font-face{font-family:"Martian";src:url(../fonts/martian.woff2) format("woff2");font-weight:100 800;font-stretch:75% 112.5%;font-display:swap}

:root{
  /* canvas */
  --paper:#FFFFFF; --paper-2:#F3F3F0; --ink:#0A0A0B; --ink-2:#55565B; --hair:#DEDED9;
  /* wayfinding yellow — ONLY the path to getting online: sign bands, CTAs, selected route */
  --sign:#FFD200; --sign-press:#F0C400;
  /* split-flap board surfaces only */
  --board:#121316; --tile:#1E2024; --tile-2:#17181B; --tile-ink:#F2F0E8; --board-dim:#8A8C92;
  /* connection status only */
  --go:#2BD46F;
  --r:6px; --r-tile:3px;
  --sans:"Mona",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --mono:"Martian",ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
  --pad:clamp(16px,4.5vw,56px);
  --max:1280px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.55 var(--sans);font-stretch:100%;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
img,svg{display:block}
a{color:inherit}
h1,h2,h3{margin:0;font-weight:800;text-wrap:balance}
p{margin:0;text-wrap:pretty}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--pad)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:8px;top:-60px;background:var(--ink);color:#fff;padding:10px 14px;z-index:99;border-radius:var(--r)}
.skip:focus{top:8px}
:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.ico{width:1.05em;height:1.05em;fill:currentColor;flex:none}
.pict{width:28px;height:28px;fill:currentColor;flex:none}
.pict--sm{width:20px;height:20px}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:.6em;background:var(--sign);color:var(--ink);text-decoration:none;font:700 16px/1 var(--sans);font-stretch:108%;letter-spacing:-.005em;padding:15px 20px;border-radius:var(--r);border:2px solid var(--ink);box-shadow:0 3px 0 var(--ink);transition:transform .12s ease,box-shadow .12s ease,background-color .12s;-webkit-tap-highlight-color:transparent;white-space:nowrap}
.btn:hover{background:var(--sign-press)}
.btn:hover .ico{transform:translateX(3px)}
.btn .ico{transition:transform .2s ease}
.btn:active{transform:translateY(3px);box-shadow:0 0 0 var(--ink)}
.btn--sm{padding:10px 14px;font-size:14px;box-shadow:0 2px 0 var(--ink)}
.btn--lg{padding:19px 26px;font-size:18px}
.btn--ink{background:var(--ink);color:var(--sign);box-shadow:0 3px 0 rgba(0,0,0,.35)}
.btn--ink:hover{background:#000}
.link{font-weight:600;text-underline-offset:4px;text-decoration-thickness:2px}

/* ---------- header ---------- */
.bar{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.92);backdrop-filter:saturate(1.4) blur(10px);-webkit-backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--hair)}
.bar__in{max-width:var(--max);margin:0 auto;padding:10px var(--pad);display:flex;align-items:center;gap:14px}
.brand{display:flex;align-items:baseline;gap:10px;text-decoration:none;margin-right:auto}
.brand__word{font:800 22px/1 var(--sans);font-stretch:118%;letter-spacing:-.04em}
.brand__sub{font:500 11px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2)}
.bar__tag{font:500 10px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);border:1px solid var(--hair);padding:6px 8px;border-radius:999px}
@media (max-width:560px){.brand__sub,.bar__tag{display:none}}

/* ---------- hero ---------- */
.sign{background:var(--sign);border-bottom:2px solid var(--ink);overflow:hidden}
.sign__in{max-width:var(--max);margin:0 auto;padding:0 var(--pad);display:flex;align-items:stretch;min-height:56px}
.sign__cell{display:flex;align-items:center;gap:10px;font:800 19px/1 var(--sans);font-stretch:112%;letter-spacing:-.01em;padding:12px 18px 12px 0;white-space:nowrap}
.sign__cell + .sign__cell{padding-left:18px;border-left:2px solid var(--ink)}
.sign__cell--arrow{padding-right:18px}
.sign__cell--arrow .pict{width:30px;height:30px}
.sign__cell--code{margin-left:auto;font:600 12px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;border-left:2px solid var(--ink)}
@media (max-width:640px){.sign__cell{font-size:16px}.sign__cell--code{display:none}.sign__cell .pict{width:22px;height:22px}}

.hero__copy{padding-top:clamp(28px,5vw,72px);padding-bottom:clamp(28px,4vw,48px)}
.h1{font-size:clamp(44px,8.4vw,128px);line-height:.9;letter-spacing:-.045em;font-stretch:112%;font-weight:850}
.h1 .line{display:block;overflow:hidden;padding-bottom:.06em;margin-bottom:-.06em}
.h1 .line>span{display:inline-block}
.hero__row{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:clamp(20px,5vw,80px);align-items:end;margin-top:clamp(24px,4vw,48px)}
.lede{font-size:clamp(17px,1.5vw,20px);max-width:56ch;color:#2a2b2f}
.hero__act{display:flex;align-items:center;gap:22px;flex-wrap:wrap;justify-self:end}
.ticks{list-style:none;margin:clamp(24px,3vw,40px) 0 0;padding:16px 0 0;border-top:2px solid var(--ink);display:flex;flex-wrap:wrap;gap:8px 28px;font:500 12px/1.3 var(--mono);letter-spacing:.06em;text-transform:uppercase}
.ticks li{display:flex;align-items:center;gap:8px}
.ticks li::before{content:"";width:8px;height:8px;background:var(--ink)}
@media (max-width:860px){.hero__row{grid-template-columns:1fr}.hero__act{justify-self:start}}
@media (max-width:480px){.hero__act .btn{width:100%;justify-content:center}.hero__act{width:100%}.hero__act .link{margin:0 auto}}

/* ---------- board ---------- */
.board-wrap{padding-bottom:clamp(48px,7vw,104px)}
.board{background:var(--board);color:var(--tile-ink);border-radius:10px;padding:clamp(14px,2.4vw,28px);box-shadow:0 30px 60px -30px rgba(0,0,0,.45),inset 0 0 0 1px rgba(255,255,255,.04)}
.board__head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:14px;border-bottom:1px solid #2a2c31;margin-bottom:10px}
.board__title{display:flex;align-items:center;gap:10px;font:800 18px/1 var(--sans);font-stretch:112%;color:var(--sign);letter-spacing:.02em;text-transform:uppercase}
.board__title .pict{fill:var(--sign)}
.board__sub{color:var(--board-dim);font:500 11px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase}
.board__clock{font:600 15px/1 var(--mono);letter-spacing:.06em;color:var(--tile-ink);font-variant-numeric:tabular-nums}
.flaps{width:100%;border-collapse:separate;border-spacing:0 6px;font:600 clamp(13px,1.9vw,24px)/1 var(--mono);font-stretch:100%;text-transform:uppercase;table-layout:fixed}
.flaps th{font:500 10px/1 var(--mono);letter-spacing:.1em;color:var(--board-dim);text-align:left;padding:6px 4px;font-weight:500}
.flaps td{padding:0 4px;white-space:nowrap;overflow:hidden}
.flaps th:nth-child(1){width:15%}.flaps th:nth-child(2){width:36%}.flaps th:nth-child(3){width:14%}.flaps th:nth-child(4){width:17%}.flaps th:nth-child(5){width:18%}
.flaps tr{transition:background-color .3s}
.flaps tbody tr.is-sel td{background:rgba(255,210,0,.08)}
.flaps tbody tr.is-sel td:first-child{box-shadow:inset 4px 0 0 var(--sign)}
/* text in cells is wrapped into tiles by JS; without JS shows plain mono */
.t{display:inline-block;position:relative;width:1.02em;text-align:center;background:linear-gradient(var(--tile) 0 49%,var(--tile-2) 51% 100%);border-radius:var(--r-tile);margin-right:2px;padding:.32em 0;line-height:1}
.t::after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:rgba(0,0,0,.65)}
.t.flip{animation:flip .09s linear}
@keyframes flip{0%{transform:scaleY(1)}50%{transform:scaleY(.15);filter:brightness(1.6)}100%{transform:scaleY(1)}}
.c-stat .t{color:var(--go)}
.c-stat.is-wait .t{color:var(--board-dim)}
.c-price{color:var(--tile-ink)}
html:not(.js) .flaps td{padding:10px 4px;border-top:1px solid #23252a}
@media (max-width:720px){
  .c-time{display:none}
  .flaps{table-layout:auto;font-size:min(2.75vw,16px)}
  .flaps th{width:auto!important;padding:6px 2px;font-size:9px}
  .flaps td{padding:0 2px}
  .t{margin-right:1px;width:1em}
  .board__sub{display:none}
  .board__clock{font-size:12px}
}

/* picker */
.pick{margin-top:18px;padding-top:18px;border-top:1px solid #2a2c31;display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px 18px;align-items:center}
.pick__label{font:700 17px/1.2 var(--sans);font-stretch:108%;color:var(--tile-ink)}
.pick__field{display:flex;background:#fff;border-radius:var(--r);overflow:hidden;border:2px solid #fff;max-width:520px}
.pick__field:focus-within{border-color:var(--sign)}
.pick input{flex:1;min-width:0;border:0;outline:0;font:500 17px/1 var(--sans);padding:13px 14px;color:var(--ink);background:#fff}
.pick__go{border:0;background:var(--sign);color:var(--ink);width:52px;display:grid;place-items:center;cursor:pointer;font-size:20px}
.chips{grid-column:2;display:flex;flex-wrap:wrap;gap:8px}
.chip{font:500 12px/1 var(--mono);letter-spacing:.05em;text-transform:uppercase;color:var(--tile-ink);background:transparent;border:1px solid #3a3d43;border-radius:999px;padding:9px 12px;cursor:pointer;transition:border-color .15s,background-color .15s}
.chip:hover{border-color:var(--tile-ink)}
.chip[aria-pressed="true"]{background:var(--sign);border-color:var(--sign);color:var(--ink)}
.pick__hint{grid-column:2;font:400 12px/1.4 var(--mono);color:var(--board-dim)}
html:not(.js) .pick{display:none}
@media (max-width:720px){.pick{grid-template-columns:1fr}.chips,.pick__hint{grid-column:1}}

.landed{margin-top:18px;display:flex;align-items:center;gap:16px;background:#1a1c20;border-radius:var(--r);padding:14px 14px 14px 18px;border:1px solid #2d3036}
.landed[hidden]{display:none}
.landed__bars{display:flex;align-items:flex-end;gap:3px;height:22px}
.landed__bars i{width:5px;background:#3a3d43;border-radius:1px}
.landed__bars i:nth-child(1){height:25%}.landed__bars i:nth-child(2){height:50%}.landed__bars i:nth-child(3){height:75%}.landed__bars i:nth-child(4){height:100%}
.landed__bars i.on{background:var(--go)}
.landed__txt{flex:1;font-size:17px;line-height:1.35}
.landed__txt b{font-weight:800;font-stretch:110%}
.landed__k{font:500 11px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--board-dim);margin-right:4px}
.landed__meta{display:block;font:500 13px/1.5 var(--mono);color:var(--board-dim)}
.landed__meta b{color:var(--tile-ink);font-family:var(--mono);font-weight:700}
@media (max-width:640px){.landed{flex-wrap:wrap}.landed .btn{width:100%;justify-content:center}}

/* ---------- section type ---------- */
.kicker{font:600 12px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-2);margin-bottom:18px;display:flex;align-items:center;gap:10px}
.kicker::before{content:"";width:22px;height:2px;background:currentColor}
.kicker--light{color:#b9bac0}
.h2{font-size:clamp(32px,5.2vw,72px);line-height:.96;letter-spacing:-.04em;font-stretch:110%}

/* ---------- journey ---------- */
.journey{background:var(--paper-2);border-top:2px solid var(--ink);border-bottom:2px solid var(--ink)}
.journey__pin{padding:clamp(56px,8vw,110px) 0 clamp(48px,6vw,90px);min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:center}
.route{position:relative;margin-top:clamp(28px,4vw,56px)}
.route__svg{width:100%;height:clamp(120px,16vw,220px);overflow:visible}
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,4vw,56px);margin-top:-8px}
.step{position:relative;padding-top:18px;border-top:2px solid var(--ink);transition:opacity .35s}
.step h3{font-size:clamp(22px,2.2vw,30px);letter-spacing:-.025em;font-stretch:110%;margin:14px 0 8px}
.step p{color:#33343a;max-width:36ch}
.step .pict{width:34px;height:34px;position:absolute;right:0;top:18px}
.plate{display:inline-grid;place-items:center;width:44px;height:44px;background:var(--ink);color:var(--sign);font:800 24px/1 var(--sans);font-stretch:110%;border-radius:var(--r);transition:background-color .3s,color .3s}
.step.is-on .plate{background:var(--sign);color:var(--ink);box-shadow:inset 0 0 0 2px var(--ink)}
.js .journey.is-scrub .step{opacity:.38}
.js .journey.is-scrub .step.is-on{opacity:1}
@media (max-width:860px){
  .route__svg{display:none}
  .steps{grid-template-columns:1fr;gap:0;margin-top:0;border-left:2px solid var(--hair);margin-left:21px;position:relative}
  .steps::before{content:"";position:absolute;left:-2px;top:0;width:2px;height:var(--prog,100%);background:var(--ink)}
  .step{border-top:0;padding:0 0 36px 34px}
  .plate{position:absolute;left:-23px;top:0}
  .step h3{margin-top:6px}
  .step .pict{top:0}
  .journey__pin{min-height:0}
}

/* ---------- plans timetable ---------- */
.plans{padding:clamp(64px,9vw,130px) 0}
.plans__head{display:grid;grid-template-columns:1fr minmax(0,340px);gap:12px 40px;align-items:end;margin-bottom:clamp(28px,4vw,48px)}
.plans__head .kicker{grid-column:1/-1;margin-bottom:0}
.plans__note{font-size:14px;color:var(--ink-2)}
.tt{list-style:none;margin:0;padding:0;border-top:3px solid var(--ink)}
.tt li{border-bottom:1px solid var(--ink)}
.tt__row{display:grid;grid-template-columns:56px minmax(0,1.6fr) minmax(0,.8fr) minmax(0,1fr) 48px;align-items:center;gap:16px;padding:22px 4px;text-decoration:none;position:relative;isolation:isolate}
.tt__row::before{content:"";position:absolute;inset:0;background:var(--sign);transform:scaleX(0);transform-origin:left;transition:transform .35s cubic-bezier(.2,.7,.2,1);z-index:-1}
.tt__row:hover::before,.tt__row:focus-visible::before{transform:scaleX(1)}
.tt__no{font:600 13px/1 var(--mono);color:var(--ink-2)}
.tt__name{font:800 clamp(22px,2.6vw,34px)/1.05 var(--sans);font-stretch:110%;letter-spacing:-.03em}
.tt__name small{display:block;font:400 15px/1.4 var(--sans);font-stretch:100%;letter-spacing:0;color:var(--ink-2);margin-top:6px}
.tt__cov,.tt__price{font:500 14px/1.2 var(--mono)}
.tt__cov b,.tt__price b{font:800 clamp(20px,2vw,26px)/1 var(--sans);font-stretch:108%;letter-spacing:-.02em}
.tt__go{width:44px;height:44px;border:2px solid var(--ink);border-radius:var(--r);display:grid;place-items:center;font-size:20px;transition:background-color .2s}
.tt__row:hover .tt__go{background:var(--ink);color:var(--sign)}
@media (max-width:760px){
  .plans__head{grid-template-columns:1fr}
  .tt__row{grid-template-columns:36px minmax(0,1fr) 44px;grid-template-areas:"no name go" "no cov go" "no price go";gap:6px 12px;padding:20px 2px}
  .tt__no{grid-area:no;align-self:start;padding-top:6px}.tt__name{grid-area:name}.tt__cov{grid-area:cov}.tt__price{grid-area:price}.tt__go{grid-area:go}
}

/* ---------- facts ---------- */
.facts{background:var(--ink);color:#fff;padding:clamp(56px,8vw,110px) 0}
.facts__grid{margin:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid #34363b}
.facts__grid>div{padding:22px 20px 0 0;border-right:1px solid #34363b}
.facts__grid>div+div{padding-left:20px}
.facts__grid>div:last-child{border-right:0}
.facts dt{font:500 11px/1.3 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:#a6a8ae}
.facts dd{margin:14px 0 0;font:800 clamp(38px,5.4vw,80px)/1 var(--sans);font-stretch:112%;letter-spacing:-.045em;font-variant-numeric:tabular-nums;color:#fff}
.facts__foot{margin-top:36px;max-width:70ch;color:#b9bac0;font-size:15px}
@media (max-width:860px){.facts__grid{grid-template-columns:1fr 1fr}.facts__grid>div{padding:20px 12px 24px 0;border-bottom:1px solid #34363b}.facts__grid>div:nth-child(2n){border-right:0;padding-left:14px}.facts__grid>div:nth-child(3){padding-left:0}}

/* ---------- check ---------- */
.check{padding:clamp(64px,9vw,130px) 0;border-bottom:1px solid var(--hair)}
.check__in{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(28px,6vw,96px);align-items:center}
.check p{margin-top:18px;max-width:52ch;color:#33343a}
.keys{display:flex;gap:clamp(8px,1vw,14px)}
.key{width:clamp(54px,7vw,92px);aspect-ratio:1;border-radius:50%;display:grid;place-items:center;background:var(--paper-2);border:2px solid var(--ink);font:700 clamp(24px,3vw,40px)/1 var(--mono);transition:background-color .15s,transform .15s}
.key.is-down{background:var(--sign);transform:scale(.92)}
@media (max-width:860px){.check__in{grid-template-columns:1fr}.key{width:calc((100vw - 2*var(--pad) - 4*8px)/5);max-width:72px}}

/* ---------- faq ---------- */
.faq{padding:clamp(64px,9vw,130px) 0}
.faq__in{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(28px,6vw,96px);align-items:start}
.faq__list{border-top:2px solid var(--ink)}
details{border-bottom:1px solid var(--ink)}
summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:16px;align-items:center;padding:20px 0;font:700 clamp(18px,1.6vw,21px)/1.3 var(--sans);font-stretch:106%;letter-spacing:-.01em}
summary::-webkit-details-marker{display:none}
summary::after{content:"";flex:none;width:14px;height:14px;background:linear-gradient(var(--ink),var(--ink)) center/100% 2px no-repeat,linear-gradient(var(--ink),var(--ink)) center/2px 100% no-repeat;transition:transform .25s}
details[open] summary::after{transform:rotate(45deg)}
details p{padding:0 0 22px;max-width:62ch;color:#33343a}
@media (max-width:860px){.faq__in{grid-template-columns:1fr}}

/* ---------- final sign ---------- */
.final{background:var(--sign);border-top:2px solid var(--ink)}
.final__in{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:clamp(16px,3vw,40px);padding-top:clamp(48px,7vw,96px);padding-bottom:clamp(48px,7vw,96px)}
.final__arrow{width:clamp(64px,9vw,132px);height:clamp(64px,9vw,132px);fill:var(--ink)}
.final__h{font-size:clamp(40px,7vw,108px);line-height:.9;letter-spacing:-.045em;font-stretch:115%}
.final__h span{display:block;font-weight:500;font-stretch:100%;letter-spacing:-.035em}
@media (max-width:760px){.final__in{grid-template-columns:auto 1fr}.final__in .btn{grid-column:1/-1;justify-content:center}}

/* ---------- footer ---------- */
.foot{padding:36px 0 120px;font-size:13px;color:var(--ink-2);background:var(--paper)}
.foot p{max-width:90ch}.foot p+p{margin-top:10px}

/* ---------- mobile dock ---------- */
.dock{position:fixed;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));z-index:30;display:none;align-items:center;gap:10px;background:var(--ink);color:#fff;border-radius:10px;padding:8px 8px 8px 14px;transform:translateY(140%);transition:transform .35s cubic-bezier(.2,.7,.2,1);box-shadow:0 12px 30px -10px rgba(0,0,0,.5)}
.dock.is-on{transform:none}
.dock__txt{flex:1;min-width:0;font:500 12px/1.3 var(--mono);color:#b9bac0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dock__txt b{display:block;font:700 15px/1.2 var(--sans);color:#fff}
.dock .btn{border-color:var(--sign);box-shadow:none}
@media (max-width:760px){.js .dock{display:flex}}

/* ---------- reveal gating (JS only) ---------- */
.js .rv{opacity:0;transform:translateY(24px)}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .js .rv{opacity:1;transform:none}
  .t.flip{animation:none}
  *{transition-duration:.01ms!important}
}
/* Breeze rebrand */
.lede__pick{font-weight:700;color:#0A0A0B;box-shadow:inset 0 -.42em 0 #FFD200}
.tt__cov{white-space:nowrap}
