:root { --navy:#071f4b; --blue:#1769c2; --yellow:#ffffff; --cream:#f7f9fc; --sky:#dbe9ff; --orange:#d52b45; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; background:var(--cream); color:var(--navy); font-family:Arial,Helvetica,sans-serif; }
a { color:inherit; text-decoration:none; }
.site-header { height:76px; padding:0 4.5vw; display:flex; align-items:center; justify-content:space-between; position:relative; z-index:20; border-bottom:1px solid rgba(11,31,55,.2); }
.brand { display:flex; align-items:center; gap:10px; font-size:14px; font-weight:900; letter-spacing:.12em; }
.brand-dot { width:16px; height:16px; background:var(--yellow); border:4px solid var(--navy); border-radius:50%; }
nav { display:flex; align-items:center; gap:30px; font-size:10px; font-weight:900; letter-spacing:.14em; text-transform:uppercase; }
nav a:hover { color:var(--orange); }
.nav-cta { padding:12px 17px; color:var(--cream); background:var(--navy); border-radius:2px; }
.hero { padding:58px 4.5vw 64px; display:grid; grid-template-columns:1fr .9fr; align-items:center; gap:4vw; position:relative; overflow:hidden; }
.hero-copy { position:relative; z-index:3; }
.status { width:min(410px,100%); margin-bottom:50px; padding:11px 14px; display:flex; justify-content:space-between; background:var(--sky); border-left:6px solid var(--blue); font-size:9px; font-weight:900; letter-spacing:.14em; }
.status strong { color:var(--blue); }
.eyebrow,.section-number { margin:0 0 25px; font-size:10px; font-weight:900; letter-spacing:.18em; }
.hero h1,.route h2,.countdown h2,.contract h2 { margin:0; font-family:Impact,"Arial Black",sans-serif; font-weight:900; letter-spacing:-.035em; line-height:.86; text-transform:uppercase; }
.hero h1 { font-size:clamp(78px,10vw,150px); }
.hero h1 em { color:var(--blue); font-style:normal; }
.intro { max-width:570px; margin:32px 0; font-size:clamp(17px,1.4vw,21px); line-height:1.55; }
.hero-actions { display:flex; flex-wrap:wrap; gap:12px; }
.button { min-height:54px; padding:0 23px; display:inline-flex; align-items:center; justify-content:center; gap:28px; border:2px solid var(--navy); font-size:10px; font-weight:900; letter-spacing:.12em; text-transform:uppercase; transition:transform .2s,box-shadow .2s; }
.button:hover { transform:translate(-3px,-3px); box-shadow:5px 5px 0 var(--navy); }
.button-yellow { background:var(--yellow); }
.button-outline { background:rgba(255,255,255,.3); }
.hero-art { min-height:570px; display:grid; place-items:center; position:relative; }
.hero-photo { width:min(470px,78vw); height:550px; margin:0; position:relative; z-index:2; border:8px solid var(--navy); box-shadow:18px 18px 0 var(--orange); transform:rotate(1.5deg); overflow:hidden; background:var(--navy); }
.hero-photo img { width:100%; height:100%; display:block; object-fit:cover; object-position:center 18%; }
.hero-photo figcaption { position:absolute; left:0; right:0; bottom:0; padding:14px 16px; color:white; background:rgba(7,31,75,.9); font-size:9px; font-weight:900; letter-spacing:.16em; }
.sun { position:absolute; width:550px; height:550px; background:var(--yellow); border-radius:50%; }
.token,.token-shadow { width:min(390px,74vw); aspect-ratio:1; border-radius:50%; position:absolute; }
.token-shadow { background:var(--orange); transform:translate(22px,26px); }
.token { padding:25px; color:var(--cream); background:var(--blue); border:10px solid var(--navy); box-shadow:inset 0 0 0 3px var(--cream); transform:rotate(-6deg); z-index:2; }
.token-ring { height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; border:2px dashed rgba(244,240,229,.65); border-radius:50%; }
.token-ring strong { font-family:Impact,"Arial Black",sans-serif; font-size:clamp(110px,12vw,160px); letter-spacing:-.06em; line-height:.9; }
.token-ring span { font-size:11px; font-weight:900; letter-spacing:.22em; }
.station-card { min-width:210px; padding:18px 20px; display:grid; gap:4px; position:absolute; right:0; bottom:65px; z-index:4; background:var(--cream); border:3px solid var(--navy); box-shadow:8px 8px 0 var(--navy); transform:rotate(3deg); }
.station-card span,.station-card i { font-size:9px; font-weight:900; font-style:normal; letter-spacing:.16em; }
.station-card strong { font-family:Impact,"Arial Black",sans-serif; color:var(--blue); font-size:52px; line-height:1; }
.route-line { position:absolute; inset:auto -30px 60px 46%; height:6px; background:var(--blue); transform:rotate(-12deg); }
.route-line i { width:22px; height:22px; position:absolute; top:-8px; background:var(--yellow); border:5px solid var(--navy); border-radius:50%; }
.route-line i:nth-child(2){left:43%}.route-line i:nth-child(3){right:8%}
.service-strip { min-height:60px; padding:15px 4.5vw; display:flex; align-items:center; justify-content:space-between; gap:18px; overflow:hidden; color:var(--cream); background:var(--navy); white-space:nowrap; font-size:9px; font-weight:900; letter-spacing:.12em; }
.service-strip strong { color:var(--yellow); }.service-strip i { color:var(--orange); }
.photo-story { display:grid; grid-template-columns:1.15fr .85fr; color:white; background:var(--blue); }
.photo-story figure { margin:0; position:relative; overflow:hidden; }
.photo-story img { width:100%; height:100%; display:block; object-fit:cover; }
.photo-primary { min-height:640px; }
.photo-primary img { object-position:center; }
.photo-story figcaption { position:absolute; left:18px; bottom:18px; padding:9px 11px; color:var(--navy); background:white; font-size:8px; font-weight:900; letter-spacing:.14em; }
.photo-story-copy { padding:62px 4.5vw 44px; display:flex; flex-direction:column; justify-content:center; }
.photo-story-copy h2 { margin:0 0 22px; font-family:Impact,"Arial Black",sans-serif; font-size:clamp(54px,5.8vw,88px); font-weight:900; letter-spacing:-.035em; line-height:.88; }
.photo-story-copy>p:not(.section-number):not(.photo-credit) { max-width:560px; margin:0 0 28px; font-size:16px; line-height:1.55; }
.photo-secondary { height:235px; border:5px solid white; }
.photo-secondary img { object-position:center 35%; }
.photo-credit { margin:14px 0 0; color:rgba(255,255,255,.65); font-size:8px; line-height:1.45; }
.section { padding:85px 4.5vw; }
.route { display:grid; grid-template-columns:1fr .85fr; gap:9vw; background:var(--cream); }
.route h2,.countdown h2,.contract h2 { font-size:clamp(60px,7.5vw,115px); }
.route h2 em { color:var(--orange); font-style:normal; }
.route-photo { margin:36px 0 0; height:285px; position:relative; overflow:hidden; border:6px solid var(--navy); box-shadow:11px 11px 0 var(--blue); background:var(--sky); }
.route-photo img { width:100%; height:100%; display:block; object-fit:cover; object-position:center 28%; }
.route-photo figcaption { position:absolute; left:0; right:0; bottom:0; padding:11px 13px; display:flex; align-items:center; justify-content:space-between; gap:16px; color:white; background:rgba(7,31,75,.93); font-size:8px; font-weight:900; letter-spacing:.1em; }
.route-photo figcaption span { color:#bfd9ff; font-size:7px; }
.route-photo figcaption a { text-decoration:underline; }
.route-map { position:relative; padding:18px 0; }
.map-line { width:5px; position:absolute; top:40px; bottom:40px; left:25px; background:var(--blue); }
.route-map article { min-height:155px; display:grid; grid-template-columns:52px 1fr; gap:24px; position:relative; }
.route-map article > span { width:52px; height:52px; display:grid; place-items:center; position:relative; z-index:2; background:var(--yellow); border:5px solid var(--navy); border-radius:50%; font-size:10px; font-weight:900; }
.route-map h3 { margin:6px 0 10px; font-family:Impact,"Arial Black",sans-serif; font-size:28px; letter-spacing:.02em; }
.route-map p { max-width:350px; margin:0; color:rgba(11,31,55,.7); line-height:1.55; }
.countdown { min-height:540px; display:grid; grid-template-columns:.8fr 1.2fr; align-items:center; gap:7vw; color:var(--cream); background:var(--blue); position:relative; overflow:hidden; }
.countdown::after { content:"PB"; position:absolute; right:-60px; bottom:-130px; color:rgba(255,255,255,.035); font-family:Impact,"Arial Black",sans-serif; font-size:480px; letter-spacing:-.08em; }
.section-number.light { color:var(--sky); }
.date { margin:30px 0 0; color:var(--yellow); font-size:10px; font-weight:900; letter-spacing:.15em; }
.departure-board { display:grid; grid-template-columns:repeat(2,1fr); position:relative; z-index:2; background:var(--navy); border:9px solid var(--navy); gap:6px; box-shadow:14px 14px 0 var(--yellow); }
.board-cell { aspect-ratio:1.5; display:flex; align-items:flex-end; justify-content:space-between; padding:18px; background:#102a48; border-top:2px solid rgba(255,255,255,.12); }
.board-cell strong { font-family:"Courier New",monospace; font-size:clamp(48px,6vw,88px); line-height:.8; letter-spacing:-.08em; }
.board-cell span { color:var(--yellow); font-size:9px; font-weight:900; letter-spacing:.15em; }
.contract { background:var(--yellow); }
.contract-heading { display:grid; grid-template-columns:1fr .4fr; align-items:end; gap:6vw; }
.contract-heading p { max-width:300px; margin:0 0 10px; line-height:1.55; }
.contract-box { margin-top:55px; padding:20px 20px 20px 28px; display:flex; align-items:center; justify-content:space-between; gap:25px; background:var(--cream); border:4px solid var(--navy); box-shadow:12px 12px 0 var(--orange); }
.contract-box div { min-width:0; display:grid; gap:10px; }
.contract-box span { font-size:9px; font-weight:900; letter-spacing:.18em; }
.contract-box code { overflow:hidden; text-overflow:ellipsis; font-size:clamp(12px,1.5vw,19px); font-weight:800; }
.contract-box button { flex:0 0 auto; min-width:160px; height:60px; color:var(--cream); background:var(--navy); border:0; cursor:pointer; font-size:9px; font-weight:900; letter-spacing:.14em; }
.contract-box button:hover { background:var(--blue); }
footer { padding:75px 4.5vw 45px; display:grid; grid-template-columns:.65fr 1.1fr .25fr; align-items:end; gap:6vw; color:var(--cream); background:var(--navy); }
.footer-brand { display:grid; font-weight:900; }.footer-brand span { font-size:10px; letter-spacing:.2em; }.footer-brand strong { font-family:Impact,"Arial Black",sans-serif; font-size:55px; letter-spacing:-.03em; }.footer-brand i { color:var(--yellow); font-size:22px; font-style:normal; }
.disclaimer { color:#aebdca; font-size:10px; line-height:1.55; }
footer>a { justify-self:end; font-size:9px; font-weight:900; letter-spacing:.12em; }
@media(max-width:900px){nav a:not(.nav-cta){display:none}.hero,.route,.countdown,.photo-story{grid-template-columns:1fr}.hero-art{min-height:580px}.photo-primary{min-height:520px}.contract-heading{grid-template-columns:1fr}.contract-heading p{margin-top:20px}footer{grid-template-columns:1fr}footer>a{justify-self:start}}
@media(max-width:600px){.site-header{height:66px}.hero{padding:48px 5.5vw 55px}.hero h1{font-size:clamp(72px,23vw,105px)}.status{margin-bottom:35px}.hero-actions{display:grid}.button{width:100%}.hero-art{min-height:485px}.hero-photo{height:455px;box-shadow:11px 11px 0 var(--orange)}.station-card{right:8px;bottom:5px}.service-strip{justify-content:flex-start}.service-strip i{display:none}.photo-primary{min-height:390px}.photo-story-copy{padding:52px 5.5vw 40px}.photo-secondary{height:210px}.section{padding:65px 5.5vw}.route h2,.countdown h2,.contract h2{font-size:clamp(58px,17vw,82px)}.departure-board{box-shadow:9px 9px 0 var(--yellow)}.board-cell{aspect-ratio:1.1;padding:12px}.board-cell strong{font-size:46px}.contract-box{display:grid;padding:16px}.contract-box button{width:100%}footer{padding-top:60px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button{transition:none}}