/* ── Landing build sequence (all classes prefixed wk-) ───────────────── */
.hero.walk{display:block;overflow:visible;min-height:0;border-bottom:1px solid var(--line)}
.wk-track{position:relative;height:1100vh}
.wk-stage{position:sticky;top:var(--wk-top,73px);height:calc(100vh - var(--wk-top,73px));height:calc(100svh - var(--wk-top,73px));overflow:hidden;background:#111}
.wk-poster,.wk-canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.wk-canvas{opacity:0;transition:opacity .4s}
.wk-canvas.on{opacity:1}
.wk-shade{position:absolute;inset:0;pointer-events:none;opacity:0;
  background:linear-gradient(180deg,rgba(10,10,10,.55),transparent 18%),linear-gradient(0deg,rgba(10,10,10,.5),transparent 16%),
             linear-gradient(90deg,rgba(12,12,12,.6),transparent 44%)}

/* your original hero content, laid over the first frame */
.wk-intro{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;z-index:3}
.wk-intro .hero-in{padding-block:clamp(20px,4vw,44px) clamp(18px,2.4vw,28px)}
.wk-intro .d1{font-size:clamp(2.5rem,4.8vw,4.4rem)}
.wk-intro .hero h1,.wk-intro h1{margin-bottom:22px}
@media (max-height:920px){.wk-intro .hero-note{display:none}}
.wk-intro .tblock{margin-bottom:clamp(14px,2.4vw,26px)}

/* the obvious "scroll to see it" button */
.wk-go{position:absolute;z-index:5;right:clamp(16px,5vw,72px);top:clamp(110px,24vh,230px);display:flex;align-items:center;gap:16px;
  padding:14px 26px 14px 14px;border-radius:999px;border:1px solid var(--gold);cursor:pointer;text-align:left;
  background:rgba(17,17,17,.62);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:var(--text);
  box-shadow:0 20px 50px -20px rgba(0,0,0,.8);transition:background .3s,transform .3s}
.wk-go:hover{background:rgba(201,168,76,.18);transform:translateY(-2px)}
.wk-go-ico{position:relative;flex:none;width:52px;height:52px;border-radius:50%;background:var(--gold);color:#17150d;display:grid;place-items:center}
.wk-go-ico::before,.wk-go-ico::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid var(--gold);animation:wkPulse 2.2s ease-out infinite}
.wk-go-ico::after{animation-delay:1.1s}
.wk-go-ico svg{width:22px;height:22px;animation:wkBob 1.6s ease-in-out infinite}
.wk-go b{display:block;font-family:"Playfair Display",Georgia,serif;font-weight:500;font-size:clamp(1.15rem,1.6vw,1.4rem);line-height:1.15}
.wk-go small{display:block;font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-top:4px}
@keyframes wkPulse{from{transform:scale(1);opacity:.7}to{transform:scale(1.75);opacity:0}}
@keyframes wkBob{0%,100%{transform:translateY(-3px)}50%{transform:translateY(4px)}}

/* stage cards */
.wk-cards{position:absolute;left:clamp(16px,4vw,56px);top:50%;transform:translateY(-50%);width:min(460px,calc(100% - 32px));pointer-events:none;z-index:4}
.wk-card{position:absolute;left:0;top:50%;width:100%;transform:translateY(-50%);opacity:0;visibility:hidden;pointer-events:auto;
  padding:clamp(22px,2.6vw,32px);border-radius:var(--r,14px);background:rgba(17,17,17,.74);border:1px solid var(--line);
  -webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%);box-shadow:0 30px 70px -40px rgba(0,0,0,.9)}
.wk-k{display:flex;justify-content:space-between;gap:12px;margin-bottom:14px;font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold)}
.wk-k span:last-child{color:var(--muted)}
.wk-card h2{font-family:"Playfair Display",Georgia,serif;font-weight:500;font-size:clamp(1.8rem,3vw,2.6rem);line-height:1.08;margin:0 0 14px}
.wk-card h2 em{color:var(--gold);font-style:italic}
.wk-card p{color:rgba(245,240,232,.8);font-size:15.5px;margin:0}
.wk-card ul{list-style:none;display:grid;gap:8px;margin:16px 0 0;padding:0}
.wk-card li{display:flex;gap:10px;font-size:14.5px;color:rgba(245,240,232,.86)}
.wk-card li::before{content:"";flex:none;width:6px;height:6px;margin-top:9px;border-radius:50%;background:var(--gold)}
.wk-badge{display:flex;align-items:center;gap:14px;margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}
.wk-badge img{height:50px;width:auto}
.wk-badge span{font-size:13.5px;color:var(--muted);line-height:1.45}
.wk-count{display:flex;align-items:baseline;gap:10px;margin-top:16px}
.wk-count b{font-family:"Playfair Display",Georgia,serif;font-size:3rem;line-height:1;color:var(--gold-soft);font-variant-numeric:tabular-nums;min-width:1.6em}
.wk-count span{color:var(--muted);font-size:14px}
.wk-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}
.wk-stats div{padding:14px;border-radius:10px;background:rgba(255,255,255,.035);border:1px solid var(--line)}
.wk-stats b{display:block;font-family:"Playfair Display",Georgia,serif;font-weight:500;font-size:1.85rem;line-height:1.05;color:var(--gold-soft)}
.wk-stats span{font-size:12.5px;color:var(--muted)}

/* council stamp on the sketch */
.wk-stamp{position:absolute;z-index:4;right:clamp(56px,8vw,120px);top:18%;padding:16px 26px;border:4px double #b3261e;border-radius:10px;color:#b3261e;
  font:600 20px/1.15 "IBM Plex Mono",monospace;letter-spacing:.12em;text-transform:uppercase;text-align:center;opacity:0;mix-blend-mode:multiply;transform:rotate(-8deg) scale(1.5);
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -2.2 1.9'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -2.2 1.9'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.wk-stamp small{display:block;font-weight:500;font-size:11.5px;margin-top:6px;letter-spacing:.14em}
.wk-note{position:absolute;z-index:4;right:clamp(16px,4vw,56px);top:16px;font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:rgba(245,240,232,.5);opacity:0}

/* progress rail, HUD, skip */
.wk-rail{position:absolute;z-index:4;right:clamp(16px,4vw,56px);top:50%;transform:translateY(-50%);list-style:none;display:grid;gap:14px;margin:0;padding:0;opacity:0}
.wk-rail li{display:flex;align-items:center;justify-content:flex-end;gap:12px;color:var(--muted);transition:color .4s}
.wk-rail li span{font:400 10.5px/1 "IBM Plex Mono",monospace;letter-spacing:.12em;text-transform:uppercase;opacity:0;transform:translateX(6px);transition:opacity .4s,transform .4s}
.wk-rail li i{width:9px;height:9px;border-radius:50%;border:1px solid var(--line-2);transition:background .4s,border-color .4s,transform .4s}
.wk-rail li.done i{background:rgba(201,168,76,.45);border-color:transparent}
.wk-rail li.on{color:var(--gold-soft)}
.wk-rail li.on span{opacity:1;transform:none}
.wk-rail li.on i{background:var(--gold);border-color:var(--gold);transform:scale(1.35);box-shadow:0 0 0 5px rgba(201,168,76,.13)}
.wk-hud{position:absolute;z-index:4;left:clamp(16px,4vw,56px);bottom:24px;display:flex;gap:16px;align-items:center;color:var(--muted);opacity:0;
  font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase}
.wk-hud .wk-bar{width:140px;height:1px;background:var(--line-2);position:relative}
.wk-hud .wk-bar i{position:absolute;inset:0;background:var(--gold);transform-origin:0 50%;transform:scaleX(0)}
.wk-skip{position:absolute;z-index:4;right:clamp(16px,4vw,56px);bottom:20px;font-size:13px;color:var(--muted);text-decoration:none;padding:8px 14px;border-radius:999px;border:1px solid var(--line);background:rgba(17,17,17,.5);opacity:0}
.wk-skip:hover{color:var(--text);border-color:var(--line-2)}

/* finished home + call to action */
.wk-end{position:absolute;inset:0;z-index:5;opacity:0;visibility:hidden}
.wk-end img{width:100%;height:100%;object-fit:cover;transform:scale(1.06)}
.wk-end::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(10,10,10,.88),rgba(10,10,10,.15) 48%,rgba(10,10,10,.35))}
.wk-end-cap{position:absolute;z-index:1;left:clamp(16px,4vw,56px);right:clamp(16px,4vw,56px);bottom:clamp(56px,11vh,110px);max-width:760px}
.wk-end-cap h2{font-family:"Playfair Display",Georgia,serif;font-weight:500;font-size:clamp(2.4rem,5.6vw,4.8rem);line-height:1.02;margin:12px 0 16px}
.wk-end-cap h2 em{color:var(--gold);font-style:italic}
.wk-end-cap p{color:rgba(245,240,232,.82);max-width:52ch;margin:0 0 24px}

@media (max-width:860px){
  .wk-intro .hero-note,.wk-intro .tblock{display:none}
  .wk-go{left:50%;right:auto;top:16px;transform:translateX(-50%);padding:10px 20px 10px 10px;gap:12px;white-space:nowrap}
  .wk-go:hover{transform:translateX(-50%)}
  .wk-go-ico{width:42px;height:42px}
  .wk-cards{top:auto;bottom:70px;transform:none}
  .wk-card{top:auto;bottom:0;transform:none}
  .wk-card h2{font-size:1.65rem}
  .wk-card p{font-size:14.5px}
  .wk-rail{top:24px;transform:none;gap:10px}
  .wk-rail li span{display:none}
  .wk-stamp{right:16px;top:14%;font-size:15px;padding:12px 18px}
  .wk-note{top:auto;bottom:62px}
  .wk-hud .wk-bar{width:70px}
}
@media (prefers-reduced-motion:reduce){.wk-go-ico::before,.wk-go-ico::after,.wk-go-ico svg{animation:none}}