/* Hallmark · macrostructure: Midnight Transit Terminal · tone: after-dark kinetic · anchor hue: halte orange */
@import url("tokens.css");
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--color-paper);color:var(--color-ink);font:var(--text-base)/1.6 var(--font-body);text-rendering:optimizeLegibility}img{display:block;max-width:100%;height:auto}a{color:inherit}:focus-visible{outline:3px solid var(--color-focus);outline-offset:4px}.shell{width:min(calc(100% - 2 * var(--page-gutter)),var(--max-width));margin-inline:auto}.skip{position:fixed;left:1rem;top:1rem;z-index:100;transform:translateY(-180%);padding:.7rem 1rem;background:var(--color-focus);color:var(--color-paper);font-weight:900}.skip:focus{transform:none}
.topbar{position:relative;z-index:20;border-bottom:1px solid var(--color-rule)}.topbar-inner{min-height:5.5rem;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:2rem}.brand{display:inline-flex;align-items:center;text-decoration:none}.brand img{width:auto;max-height:3.6rem;max-width:14rem}.station-code{font:800 var(--text-xs)/1 var(--font-mono);letter-spacing:.15em;color:var(--color-brand);text-transform:uppercase}.actions{justify-self:end;display:flex;align-items:center;gap:.75rem}.login{font:800 var(--text-sm)/1 var(--font-mono);text-decoration:none}.ticket,.button{display:inline-flex;min-height:3rem;align-items:center;justify-content:center;padding:.7rem 1.15rem;border:1px solid var(--color-brand);border-radius:var(--radius-xs);background:var(--color-brand);color:var(--color-paper);font-weight:900;text-decoration:none;transition:transform var(--dur-base) var(--ease-out),background var(--dur-base) var(--ease-out)}.ticket:hover,.button:hover{transform:translateY(-2px);background:var(--color-brand-soft)}
.service-line{overflow:hidden;border-bottom:1px solid var(--color-rule);background:var(--color-paper-2)}.service-track{display:flex;width:max-content;animation:service 30s linear infinite}.service-group{display:flex;min-height:2.6rem;align-items:center}.service-group span{display:flex;align-items:center;gap:.65rem;margin-right:2rem;font:800 var(--text-xs)/1 var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--color-ink-2)}.service-group span::before{content:"";width:.48rem;height:.48rem;border-radius:50%;background:var(--color-signal);box-shadow:0 0 0 .2rem color-mix(in oklch,var(--color-signal) 18%,transparent)}@keyframes service{to{transform:translateX(-50%)}}
.hero{position:relative;min-height:49rem;padding:clamp(5rem,10vw,9rem) 0 4rem;overflow:hidden;isolation:isolate}.hero::before{content:"H4";position:absolute;right:-2rem;bottom:-6rem;z-index:-2;font:900 32rem/.7 var(--font-display);letter-spacing:-.1em;color:var(--color-paper-2)}.hero::after{content:"";position:absolute;inset:7rem 5vw auto auto;z-index:-1;width:26rem;height:26rem;border:1px solid var(--color-rule-strong);border-radius:50%;box-shadow:0 0 9rem color-mix(in oklch,var(--color-brand) 14%,transparent)}.hero-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:clamp(3rem,8vw,9rem);align-items:end}.route-label,.eyebrow{display:flex;align-items:center;gap:.75rem;margin:0 0 1.25rem;font:800 var(--text-xs)/1 var(--font-mono);letter-spacing:.13em;text-transform:uppercase;color:var(--color-brand)}.route-label::before,.eyebrow::before{content:"";width:2.5rem;border-top:2px solid currentColor}.hero h1{max-width:9ch;margin:0;font:900 var(--text-display)/.78 var(--font-display);letter-spacing:-.065em;text-transform:uppercase}.hero h1 em{display:block;margin-left:.6em;color:var(--color-brand);font:italic 400 .78em/.9 var(--font-accent);text-transform:none;letter-spacing:-.045em}.hero-side{border-left:1px solid var(--color-rule-strong);padding-left:2rem}.hero-side>p{margin-top:0;color:var(--color-ink-2);font-size:var(--text-lg)}.meta-board{display:grid;grid-template-columns:1fr 1fr;margin:2rem 0;border-block:1px solid var(--color-rule)}.meta-item{padding:1rem 1rem 1rem 0}.meta-item+ .meta-item{padding-left:1rem;border-left:1px solid var(--color-rule)}.meta-item small{display:block;margin-bottom:.4rem;font:800 var(--text-xs)/1 var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--color-ink-3)}.meta-item strong{font-family:var(--font-accent);font-size:1.2rem}.cta-pair{display:flex;flex-wrap:wrap;gap:.75rem}.button-ghost{background:transparent;color:var(--color-ink)}
.wide-stage{width:min(calc(100% - 2 * var(--page-gutter)),94rem);margin:-1.5rem auto 0;position:relative;z-index:5}.wide-frame{margin:0;padding:.65rem;background:var(--color-ink);box-shadow:1.15rem 1.15rem 0 var(--color-brand-deep);transform:rotate(-.25deg)}.wide-frame img{width:100%;aspect-ratio:5/1;min-height:14rem;object-fit:cover}.wide-frame figcaption{padding:.7rem .25rem .1rem;color:var(--color-paper);font:800 var(--text-xs)/1 var(--font-mono);letter-spacing:.12em;text-transform:uppercase}
.route{padding:var(--space-4xl) 0;background:var(--color-paper-2)}.route-head{display:grid;grid-template-columns:.7fr 1.3fr;gap:4rem;margin-bottom:4rem}.route h2,.feature-copy h2,.editorial h2,.faq h2,.final h2{margin:0;font:900 clamp(3.2rem,7vw,7rem)/.85 var(--font-display);letter-spacing:-.05em;text-transform:uppercase}.route-head p{max-width:34rem;margin:.3rem 0 0;color:var(--color-ink-2);font-size:var(--text-lg)}.route-board{position:relative}.route-board::before{content:"";position:absolute;left:3.65rem;top:4rem;bottom:4rem;border-left:2px solid var(--color-brand)}.stop{position:relative;display:grid;grid-template-columns:7.3rem .7fr 1.3fr auto;gap:2rem;align-items:center;min-height:9rem;border-top:1px solid var(--color-rule)}.stop:last-child{border-bottom:1px solid var(--color-rule)}.stop-code{position:relative;z-index:2;width:3rem;height:3rem;display:grid;place-items:center;margin-left:2.15rem;border:2px solid var(--color-brand);border-radius:50%;background:var(--color-paper-2);color:var(--color-brand);font:900 var(--text-xs)/1 var(--font-mono)}.stop h3{margin:0;font:900 clamp(1.6rem,3vw,2.6rem)/1 var(--font-display);text-transform:uppercase}.stop p{margin:0;color:var(--color-ink-2)}.stop-time{font:800 var(--text-xs)/1 var(--font-mono);color:var(--color-signal);letter-spacing:.08em}
.feature{padding:8rem 0;background:var(--color-brand);color:var(--color-paper)}.feature-grid{display:grid;grid-template-columns:minmax(22rem,.82fr) minmax(0,1.18fr);gap:clamp(4rem,10vw,10rem);align-items:center}.square{position:relative;margin:0;padding:.7rem;background:var(--color-ink);box-shadow:1.2rem 1.2rem 0 var(--color-brand-deep);transform:rotate(1deg)}.square img{width:100%;aspect-ratio:1;object-fit:cover;background:var(--color-paper-3)}.square figcaption{position:absolute;left:1.3rem;bottom:1.3rem;padding:.5rem .7rem;background:var(--color-paper);color:var(--color-ink);font:900 var(--text-xs)/1 var(--font-mono);letter-spacing:.1em;text-transform:uppercase}.feature-copy .eyebrow{color:var(--color-paper)}.feature-copy p{max-width:36rem;font-size:var(--text-lg)}.feature-copy .button{background:var(--color-paper);border-color:var(--color-paper)}
.editorial{padding:9rem 0}.editorial-grid{display:grid;grid-template-columns:.7fr 1.3fr;gap:clamp(4rem,10vw,11rem)}.editorial-title{position:sticky;top:3rem;align-self:start}.editorial-copy{max-width:var(--measure);color:var(--color-ink-2);font-size:1.1rem}.editorial-copy>p:first-child{margin-top:0;color:var(--color-ink);font:400 1.8rem/1.4 var(--font-accent)}.editorial-copy h3{margin:3rem 0 .7rem;color:var(--color-brand);font:900 1.8rem/1 var(--font-display);text-transform:uppercase}.dispatch{margin:3rem 0;padding:2rem 0;border-block:1px solid var(--color-rule-strong);color:var(--color-brand-soft);font:italic 400 clamp(1.6rem,3vw,2.5rem)/1.25 var(--font-accent)}
.proof{padding:8rem 0;background:var(--color-paper-3)}.proof-head{display:flex;align-items:end;justify-content:space-between;gap:3rem;margin-bottom:3rem}.proof-head h2{max-width:10ch;margin:0;font:900 clamp(3rem,6vw,6rem)/.85 var(--font-display);text-transform:uppercase}.proof-head p{max-width:28rem;color:var(--color-ink-2)}.quotes{display:grid;grid-template-columns:1.12fr .88fr;gap:1rem}.quote{margin:0;min-height:18rem;display:flex;flex-direction:column;justify-content:space-between;padding:2.2rem;background:var(--color-ink);color:var(--color-paper)}.quote:first-child{transform:translateY(1.4rem)}.quote p{margin:0;font:400 clamp(1.4rem,2.6vw,2.2rem)/1.3 var(--font-accent)}.quote cite{font:800 var(--text-xs)/1.4 var(--font-mono);font-style:normal;color:var(--color-brand-deep);text-transform:uppercase;letter-spacing:.08em}
.faq{padding:9rem 0;background:var(--color-ink);color:var(--color-paper)}.faq-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:clamp(4rem,10vw,10rem)}.faq-list{border-top:2px solid var(--color-paper)}.faq details{border-bottom:1px solid color-mix(in oklch,var(--color-paper) 20%,transparent)}.faq summary{position:relative;cursor:pointer;list-style:none;padding:1.6rem 3rem 1.6rem 0;font:900 1.25rem/1.3 var(--font-display);text-transform:uppercase}.faq summary::-webkit-details-marker{display:none}.faq summary::after{content:"+";position:absolute;right:.5rem;top:1.2rem;color:var(--color-brand);font-size:1.7rem}.faq details[open] summary::after{content:"−"}.faq details p{max-width:43rem;margin:0 0 1.7rem;color:color-mix(in oklch,var(--color-paper) 70%,transparent)}
.final{position:relative;overflow:hidden;padding:9rem 0;background:var(--color-paper)}.final::after{content:"HALTE";position:absolute;right:-3rem;bottom:-5rem;color:var(--color-paper-2);font:900 17rem/.8 var(--font-display);letter-spacing:-.08em}.final-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.2fr .8fr;gap:5rem;align-items:end}.final-copy p{color:var(--color-ink-2);font-size:var(--text-lg)}.footer{border-top:1px solid var(--color-rule);background:var(--color-paper)}.footer-row{min-height:7rem;display:flex;align-items:center;justify-content:space-between;gap:2rem;color:var(--color-ink-3);font-size:var(--text-sm)}.footer-row strong{color:var(--color-ink)}.footer-links{display:flex;gap:1.2rem}
@media(max-width:55rem){.topbar-inner{grid-template-columns:1fr auto}.station-code{display:none}.hero-grid,.route-head,.feature-grid,.editorial-grid,.faq-grid,.final-grid{grid-template-columns:1fr}.route-board::before{left:1.5rem}.stop{grid-template-columns:3rem 1fr auto;gap:1rem;padding-block:1.5rem}.stop-code{margin:0}.stop p{grid-column:2/-1}.editorial-title{position:static}.quotes{grid-template-columns:1fr}.quote:first-child{transform:none}}@media(max-width:36rem){.shell{width:min(calc(100% - 2rem),var(--max-width))}.login{display:none}.hero h1{font-size:clamp(4rem,21vw,6.5rem)}.wide-stage{width:calc(100% - 2rem)}.footer-row{flex-direction:column;align-items:flex-start;padding-block:2rem}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
/* Runtime component states */
.stop,.feature,.quote{transition:opacity .45s ease,transform .45s ease}
.js .stop,.js .feature,.js .quote{opacity:.001;transform:translateY(12px)}
.stop.is-visible,.feature.is-visible,.quote.is-visible{opacity:1;transform:none}
.service-track.is-paused{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.stop,.feature,.quote{transition:none}}
