:root{--bg:#0c0912;--panel:#121019;--text:#f9f4ec;--muted:#c5bec8;--accent:#ff803d;--accent-ink:#17100c;--border:#302b38;--radius:12px;--gap:14px;--width:1640px;--body:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;--display:Georgia,"Times New Roman",serif;color-scheme:dark}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:1rem}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--body);font-size:1rem;line-height:1.48;font-synthesis:none;-webkit-font-smoothing:antialiased;overflow-wrap:anywhere}
img{max-width:100%;display:block}
button,a,summary{-webkit-tap-highlight-color:transparent}
button,a,input,summary{font:inherit}
a{color:inherit;text-underline-offset:.2em}
button,summary{color:inherit}
:focus-visible{outline:3px solid var(--accent);outline-offset:4px}
::selection{background:var(--accent);color:var(--accent-ink)}
.skip{position:fixed;z-index:30;left:1rem;top:1rem;padding:.7rem 1rem;background:var(--text);color:var(--bg);transform:translateY(-220%);border-radius:6px}
.skip:focus{transform:none}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.page{max-width:var(--width);margin-inline:auto}
.head{display:flex;align-items:center;justify-content:space-between;gap:.5rem 2rem;padding:.6rem clamp(20px,3.6vw,66px);min-height:64px}
.brand{display:inline-flex;align-items:center;gap:clamp(.7rem,1.7vw,1.6rem);text-decoration:none;flex-wrap:wrap}
.brand-name{font-size:clamp(1.55rem,2.15vw,2.35rem);font-weight:650;letter-spacing:-.066em;line-height:1.12}
.brand-logo{display:block;width:auto;max-width:min(180px,36vw);max-height:48px;object-fit:contain}
.tagline{font-size:clamp(.73rem,.94vw,.95rem);letter-spacing:-.02em;color:var(--muted)}
.nav{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;column-gap:clamp(.9rem,2.4vw,2.6rem);row-gap:0}
.nav a{font-size:clamp(.86rem,1.04vw,1.04rem);text-decoration:none;display:inline-flex;align-items:center;min-height:44px}
.nav a:hover,.foot a:hover,.text-link:hover{color:var(--accent)}
.hero{position:relative;display:grid;grid-template-columns:minmax(0,1.51fr) minmax(0,1fr);align-items:stretch;isolation:isolate;margin-bottom:var(--gap);background:var(--bg)}
.hero-picture{position:relative;min-height:clamp(320px,34vw,565px);overflow:hidden;isolation:isolate;background:var(--panel)}
.hero-picture img,.tile-picture img,.story-picture img{height:100%;width:100%;object-fit:cover;object-position:var(--fx,50%) var(--fy,50%)}
.hero-picture img{position:absolute;inset:0}
.hero-picture::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 73%,var(--bg) 100%);pointer-events:none}
.hero-copy{position:relative;z-index:1;align-self:center;min-width:0;padding:clamp(1.25rem,3.5vw,4rem) clamp(1.25rem,1.65vw,2.4rem) clamp(1.25rem,3.5vw,4rem) clamp(1rem,2vw,2rem)}
.hero-copy h1,.hero-copy h2{margin:0;font-family:var(--display);font-size:clamp(3.15rem,5.0vw,6.2rem);font-weight:400;letter-spacing:-.058em;line-height:1.01;text-wrap:balance}
.hero-copy p{color:var(--muted);max-width:49ch;margin:1rem 0 0;font-size:clamp(1rem,1.35vw,1.4rem)}
.pill{display:inline-flex;gap:.8rem;align-items:center;justify-content:center;padding:.82rem 1.45rem;border:1px solid transparent;border-radius:999px;width:fit-content;max-width:100%;min-height:44px;background:var(--accent);color:var(--accent-ink);font-weight:650;font-size:.98rem;line-height:1.3;text-decoration:none;box-shadow:0 6px 32px color-mix(in srgb,var(--accent) 17%,transparent);transition:filter .18s,box-shadow .18s}
.pill::after{content:"→";font-size:1.3em;line-height:1}
.pill:hover{filter:brightness(1.08);box-shadow:0 8px 34px color-mix(in srgb,var(--accent) 28%,transparent)}
.hero-copy .pill{margin-top:clamp(1.25rem,2.2vw,2.5rem)}
.hero.reverse{grid-template-columns:minmax(0,1fr) minmax(0,1.51fr)}
.hero.reverse .hero-picture{order:2}
.hero.reverse .hero-picture::after{background:linear-gradient(270deg,transparent 73%,var(--bg))}
.hero.reverse .hero-copy{padding-inline:clamp(1.25rem,3.5vw,4rem)}
.hero.no-photo{grid-template-columns:1fr}
.hero.no-photo .hero-copy{max-width:1050px;padding:clamp(2rem,6vw,6rem) clamp(1.25rem,3.5vw,4rem)}
.content-block{margin-inline:clamp(16px,2.15vw,46px);margin-bottom:clamp(18px,1.5vw,28px)}
.section-intro{padding:clamp(12px,2vw,30px) 0}
.section-intro h2,.text-block h2{font-family:var(--display);font-size:clamp(1.8rem,3.1vw,3.6rem);font-weight:400;letter-spacing:-.04em;line-height:1.13;margin:0}
.section-intro p,.text-block p{max-width:70ch;color:var(--muted);margin:.6rem 0 0}
.tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap);align-items:stretch}
.tile,.road{position:relative;min-width:0}
.tile{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:0 8px 24px #00000012}
.tile:hover,.tile:focus-within{border-color:color-mix(in srgb,var(--border),var(--accent) 45%)}
.tile-wide{grid-column:span 2}
.tile summary,.road summary{cursor:pointer;list-style:none}
.tile summary::-webkit-details-marker,.road summary::-webkit-details-marker{display:none}
.tile summary:focus-visible{outline-offset:-3px;border-radius:var(--radius)}
.tile-picture{aspect-ratio:1.25;overflow:hidden;background:var(--bg)}
.tile-wide .tile-picture{aspect-ratio:2.59}
.tile-picture img{transition:transform .45s}
.tile summary:hover img{transform:scale(1.018)}
.tile-info{position:relative;display:block;min-height:clamp(102px,8.3vw,144px);padding:clamp(15px,1.6vw,27px) clamp(15px,1.63vw,26px) 1.24rem}
.tile-title{display:flex;align-items:baseline;gap:.65rem;justify-content:space-between;font-size:clamp(1.22rem,1.78vw,1.95rem);line-height:1.23;letter-spacing:-.035em;margin:0 0 .42rem;font-weight:500}
.tile-summary{display:block;color:var(--muted);font-size:clamp(.93rem,1.16vw,1.16rem);line-height:1.41}
.more-mark{font-family:var(--body);font-size:.65em;color:var(--muted);font-weight:400;flex:none}
.tile summary:hover .more-mark,.road summary:hover .road-name{color:var(--accent)}
.detail-body{padding:0 1.4rem 1.25rem;color:var(--muted);font-size:1rem}
.detail-body p,.copytext p{margin:0 0 .85em;white-space:pre-line}
.detail-body p:last-child,.copytext p:last-child{margin-bottom:0}
.detail-body a,.text-link{display:inline-flex;align-items:center;min-height:44px;color:var(--accent);font-weight:600}
.roadmap{display:grid;grid-template-columns:minmax(100px,.68fr) minmax(0,3fr);gap:clamp(.8rem,1.8vw,2.4rem);align-items:start;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:clamp(18px,2.05vw,34px) clamp(18px,2.5vw,46px)}
.roadmap-title{font-size:clamp(1.5rem,2.05vw,2.4rem);line-height:1.2;letter-spacing:-.035em;font-weight:500;margin:0}
.roadmap-lead{color:var(--muted);font-size:.98rem;margin:.5rem 0 0}
.road-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,165px),1fr));gap:1.4rem .5rem;align-items:start}
.road{padding-left:clamp(.75rem,2.1vw,2.35rem);border-left:1px solid var(--border)}
.road-name{display:block;font-weight:550;font-size:clamp(.97rem,1.18vw,1.24rem);letter-spacing:-.022em}
.road-status{display:flex;gap:.58em;align-items:baseline;margin-top:.45rem;font-size:.9rem;color:var(--muted)}
.road-status::before{content:"";width:.58em;height:.58em;align-self:center;flex:none;border-radius:50%;background:var(--accent);box-shadow:0 0 12px color-mix(in srgb,var(--accent) 30%,transparent)}
.road .detail-body{padding:.8rem 0 0}
.text-block{border-top:1px solid var(--border);padding-block:clamp(1.4rem,2.6vw,3.2rem)}
.text-block .pill{margin-top:1rem}
.foot{color:var(--muted);font-size:.84rem;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.5rem 1.5rem;padding:.15rem clamp(20px,3.6vw,66px) 1.65rem}
.foot a{min-height:44px;display:inline-flex;align-items:center;text-decoration:none}
.foot-links{display:flex;gap:1.2rem;align-items:center;flex-wrap:wrap}
.preview-notice{padding:.55rem 1rem;text-align:center;background:#ffdb9e;color:#301c09;font-weight:650;font-size:.88rem}
.info-dialog{border:1px solid var(--border);background:var(--panel);color:var(--text);width:min(94vw,560px);max-height:86vh;max-height:86dvh;overflow:auto;overscroll-behavior:contain;border-radius:var(--radius);padding:0;box-shadow:0 20px 90px #000a}
.info-dialog::backdrop{background:#07040cd9;backdrop-filter:blur(6px)}
.dialog-inner{padding:clamp(1.25rem,3vw,2.15rem)}
.dialog-bar{display:flex;justify-content:flex-end;align-items:center;margin:-.55rem -.55rem .2rem}
.close-dialog{display:flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;background:transparent;border:1px solid var(--border);border-radius:50%;cursor:pointer;font-size:1.5rem;line-height:1}
.close-dialog:hover{border-color:var(--accent)}
.dialog-title{font-family:var(--display);font-size:clamp(2.2rem,4.4vw,3.7rem);font-weight:400;line-height:1.04;letter-spacing:-.05em;margin:0 0 1rem}
.dialog-intro{color:var(--text);font-size:1.09rem;margin:0 0 1rem}
.info-dialog .detail-body{padding:0;color:var(--muted)}
html.has-dialog{overflow:hidden}
@media(min-width:1750px){.page{border-inline:1px solid var(--border)}}
@media(max-width:960px){.head{padding-inline:1.25rem}.brand{gap:.5rem 1rem}.tagline{font-size:.73rem}.hero{grid-template-columns:1.4fr 1fr}.hero-copy h1,.hero-copy h2{font-size:clamp(2.6rem,5.8vw,4.3rem)}.hero-picture{min-height:320px}.tiles{grid-template-columns:repeat(2,minmax(0,1fr))}.tile-info{min-height:112px}.tile-picture{aspect-ratio:1.75}.tile-wide .tile-picture{aspect-ratio:3.55}.roadmap{grid-template-columns:1fr;gap:1rem}.road:first-child{padding-left:0;border-left:0}.road-list{column-gap:1rem}}
@media(max-width:620px){.head{align-items:flex-start;flex-direction:column;gap:.15rem;padding:.85rem 1.05rem .3rem}.brand{width:100%;gap:.55rem 1rem}.tagline{font-size:.76rem}.nav{justify-content:flex-start;column-gap:1.3rem}.nav a{font-size:.9rem}.hero,.hero.reverse{grid-template-columns:1fr}.hero-picture,.hero.reverse .hero-picture{order:0;min-height:auto;aspect-ratio:1.68}.hero-picture img,.tile-picture img,.story-picture img{object-position:var(--mfx,var(--fx,50%)) var(--mfy,var(--fy,50%))}.hero-picture::after,.hero.reverse .hero-picture::after{background:linear-gradient(180deg,transparent 86%,var(--bg))}.hero-copy,.hero.reverse .hero-copy{padding:.5rem 1.15rem 1.4rem}.hero-copy h1,.hero-copy h2{font-size:clamp(2.65rem,10.3vw,4.2rem);max-width:16ch}.hero-copy .pill{margin-top:1rem}.content-block{margin-inline:1rem;margin-bottom:1.05rem}.tiles{gap:var(--gap)}.tile-title{font-size:1.19rem}.tile-info{min-height:0;padding:.9rem .83rem 1rem}.tile-summary{font-size:.9rem}.tile-picture{aspect-ratio:1.17}.tile-wide .tile-picture{aspect-ratio:2.4}.road-list{grid-template-columns:1fr;gap:0}.road,.road:first-child{padding:.65rem 0;border-left:0;border-top:1px solid var(--border)}.road-name{font-size:1rem}.road summary{min-height:44px}.roadmap{padding:1rem 1.12rem;gap:.65rem}.road-status{margin-top:.15rem}.foot{padding:.15rem 1rem 1rem;gap:.15rem .9rem}}
@media(max-width:380px){.tiles{grid-template-columns:1fr}.tile-wide{grid-column:auto}.tile-picture,.tile-wide .tile-picture{aspect-ratio:1.9}.tagline{display:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.tile-picture{display:block}
.hero-copy h1,.hero-copy h2,.section-intro h2,.roadmap-title,.text-block h2,.tile-title [data-title],.road-name{white-space:pre-line}
[hidden],dialog:not([open]){display:none!important}
