/* Landing page only. Generated by build.mjs into assets/home.css, so it works whatever assets/style.css contains. */
body.home{--bg:#f6f1e6;--surface:#fbf8f1;--ink:#14213d;--muted:#5b6477;--line:#d9d2c1;--accent:#34578a;--on-accent:#fbf8f1;--soft:#ece5d6;--mark:rgba(52,87,138,.16);background:var(--bg);color:var(--ink)}
@media (prefers-color-scheme:dark){body.home{--bg:#0e1523;--surface:#121a2b;--ink:#ebe6da;--muted:#a1a9ba;--line:#2a3550;--accent:#9db8e2;--on-accent:#0e1523;--soft:#18223a;--mark:rgba(157,184,226,.2)}}
body.home .top{background:transparent;border-bottom:1px solid var(--line)}
body.home .brand svg rect{fill:var(--ink)}
body.home .brand svg path{stroke:var(--bg)}
body.home .foot{background:transparent;border-top:1px solid var(--line)}
.landing{flex:1 0 auto;width:100%}
.landing *{box-sizing:border-box}
.hero{padding:clamp(28px,5vw,72px) 0 clamp(44px,7vw,88px)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"label" "plate" "quote" "cta";gap:0}
.label{grid-area:label;font:500 12px/1 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--accent);margin:0 0 20px;display:flex;align-items:center;gap:14px}
.label::before{content:"";width:34px;height:1px;background:currentColor}
.plate{grid-area:plate;margin:0 0 28px;color:var(--ink)}
.plate .map{display:block;width:100%;height:auto;aspect-ratio:21/9;background:var(--surface);border:1px solid var(--line)}
.map .contours{stroke:var(--accent)}
.map .route,.map .summit,.map .ticks{stroke:var(--ink)}
.map circle[fill]{fill:var(--ink)}
.map text{fill:var(--ink)}
.plate figcaption{font:400 12px/1.5 var(--sans);color:var(--muted);margin-top:10px}
.plate figcaption b{font-weight:600;color:var(--ink);margin-right:6px}
.quote{grid-area:quote;margin:0;max-width:46rem}
.q1{font:400 clamp(19px,1.8vw + 12px,26px)/1.62 var(--serif);margin:0 0 clamp(22px,3.5vw,38px);color:var(--ink);text-wrap:pretty}
.q1 mark{background:linear-gradient(transparent 58%,var(--mark) 58%);color:inherit;padding:0 .08em;margin:0 -.08em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.q2{font:italic 400 clamp(32px,6.2vw,58px)/1.08 var(--serif);letter-spacing:-.012em;margin:0;color:var(--accent);text-wrap:balance;position:relative;padding-top:22px}
.q2::before{content:"";position:absolute;left:0;top:0;width:56px;height:2px;background:var(--accent)}
.q2 span{background:linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat;padding-bottom:.08em}
.quote footer{display:flex;align-items:center;gap:14px;margin-top:22px;font:500 12.5px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.quote .rule{width:34px;height:1px;background:var(--muted)}
.cta{grid-area:cta;margin-top:clamp(28px,4vw,44px);max-width:46rem}
.tag{font:italic 400 clamp(17px,1vw + 12px,20px)/1.5 var(--serif);color:var(--muted);margin:0 0 20px}
.buttons{display:flex;flex-wrap:wrap;align-items:center;gap:16px 26px;margin:0}
.btn{display:inline-flex;align-items:center;gap:12px;background:var(--ink);color:var(--bg);text-decoration:none;font:500 15px/1 var(--sans);letter-spacing:.02em;padding:17px 28px;border-radius:2px;transition:background-color .25s,transform .25s}
.btn:hover{background:var(--accent);color:var(--on-accent)}
.btn span{display:inline-block;transition:transform .25s}
.btn:hover span{transform:translateX(5px)}
.alt{color:var(--muted);font:italic 400 17px/1 var(--serif);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px;text-decoration-color:var(--line)}
.alt:hover{color:var(--accent);text-decoration-color:var(--accent)}
@media (min-width:900px){
  .hero-grid{grid-template-columns:minmax(0,1.3fr) minmax(0,.85fr);grid-template-areas:"label plate" "quote plate" "cta plate";column-gap:clamp(40px,6vw,88px);grid-template-rows:auto auto 1fr;align-items:start}
  .plate{margin:0;position:sticky;top:24px}
  .plate .map{aspect-ratio:4/5}
  .label{margin-bottom:34px}
}
.intro{padding-block:clamp(36px,6vw,72px);border-top:1px solid var(--line);display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:24px 56px;align-items:end}
.lede{font:400 clamp(18px,1vw + 13px,22px)/1.6 var(--serif);margin:0;max-width:40rem}
.facts{font:500 12px/1.8 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:0}
.facts b{font:600 clamp(40px,5vw,60px)/1 var(--serif);letter-spacing:-.02em;color:var(--ink);display:block;text-transform:none;margin-bottom:4px}
.facts i{font-style:normal;opacity:.5;margin:0 4px}
.doors{padding-bottom:clamp(48px,8vw,104px)}
.doors h2{font:500 12px/1 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--accent);margin:0 0 18px}
.doors ul{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.doors li{border-bottom:1px solid var(--line);margin:0;padding:0}
.doors a{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr) 3.2rem;align-items:baseline;gap:6px 28px;padding:18px 4px;text-decoration:none;color:var(--ink);transition:padding-left .25s,background-color .25s}
.doors a:hover{padding-left:14px;background:var(--soft)}
.d-name{font:600 clamp(20px,2vw,26px)/1.2 var(--serif)}
.d-desc{color:var(--muted);font-size:14.5px}
.d-n{font:400 13px var(--mono);color:var(--accent);text-align:right}
@media (max-width:760px){
  .intro{grid-template-columns:1fr}
  .doors a{grid-template-columns:1fr 3.2rem}
  .d-desc{grid-column:1/-1;order:3}
}
@media (prefers-reduced-motion:no-preference){
  .rise{opacity:0;transform:translateY(12px);animation:rise 1s cubic-bezier(.2,.7,.2,1) forwards;animation-delay:var(--d,0s)}
  @keyframes rise{to{opacity:1;transform:none}}
  .map .c{opacity:0;animation:fade 1.4s ease forwards;animation-delay:calc(.3s + var(--i) * .12s)}
  @keyframes fade{to{opacity:1}}
  .map .route{stroke-dashoffset:0}
  .map .summit{opacity:0;animation:fade 1s 2.4s ease forwards}
  .q2 span{background-size:0 1px;animation:underline 1.6s 1.8s ease forwards}
  @keyframes underline{to{background-size:100% 1px}}
}
