/* home-page pillar walkabout.
   DEFAULT (no JS, or prefers-reduced-motion): a plain stacked list — every
   pillar visible and reachable without a single line of script.
   walk.js adds .walk-on to opt into the scroll-driven sequence below. */
.walk{background:#211F1B;color:var(--paper)}
.walk-track{position:relative}
.walk-stage{position:relative}
.walk-path{display:none;position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.walk-path .ahead{stroke:var(--sand-400);opacity:.18;stroke-width:2.5;stroke-linecap:round;stroke-dasharray:0.1 12;fill:none}
.walk-path .walked{stroke:var(--ochre-500);opacity:.55;stroke-width:2.5;stroke-linecap:round;fill:none}
.walk-mark circle{fill:#211F1B;stroke:var(--sand-400);stroke-width:2;stroke-dasharray:0.1 5;stroke-linecap:round;opacity:.85;transition:fill .4s,stroke .4s}
.walk-mark text{font-family:var(--font-display);font-weight:700;font-size:13px;fill:var(--sand-400);transition:fill .4s}
.walk-mark.hit circle{fill:var(--ochre-600);stroke:var(--ochre-400);stroke-dasharray:none;opacity:1}
.walk-mark.hit text{fill:var(--paper)}
.walk-item{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;text-align:center;padding:clamp(56px,8vw,88px) 24px;text-decoration:none;color:var(--paper);border-bottom:1px solid rgba(255,255,255,.07)}
.walk-item:last-of-type{border-bottom:0}
.walk-glow{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(660px,90vw);height:min(660px,90vw);border-radius:50%;background:radial-gradient(circle,color-mix(in oklab,var(--wx,#A35A2A) 24%,transparent) 0%,transparent 65%);pointer-events:none}
.walk-medal{width:clamp(140px,18vw,195px);height:clamp(140px,18vw,195px);border-radius:50%;object-fit:contain;padding:clamp(12px,1.6vw,18px);background:var(--sand-100);border:3px solid var(--wx,var(--ochre-500));box-shadow:0 0 0 10px color-mix(in oklab,var(--wx,#A35A2A) 22%,transparent),0 30px 80px -20px rgba(0,0,0,.6);position:relative}
.walk-eyebrow{font-family:var(--font-display);font-weight:600;font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:color-mix(in oklab,var(--wx,#BE7B4E) 55%,white);position:relative}
.walk-name{font-family:var(--font-display);font-weight:700;font-size:clamp(36px,5vw,62px);letter-spacing:-0.02em;line-height:1.05;position:relative}
.walk-line{font-size:clamp(15px,1.6vw,19px);line-height:1.6;max-width:48ch;color:var(--sand-300);font-style:italic;position:relative}
.walk-cta{font-family:var(--font-display);font-weight:600;font-size:14px;color:color-mix(in oklab,var(--wx,#BE7B4E) 45%,white);border-bottom:2px dotted color-mix(in oklab,var(--wx,#BE7B4E) 60%,transparent);padding-bottom:3px;position:relative;transition:color .2s,border-color .2s}
a.walk-item:hover .walk-cta{color:var(--paper);border-bottom-style:solid}
a.walk-item:hover{color:var(--paper)}
.walk-dots{display:none;position:absolute;bottom:34px;left:50%;transform:translateX(-50%);gap:14px;z-index:3}
.walk-dot{width:10px;height:10px;border-radius:50%;border:1.5px solid var(--sand-400);background:transparent;cursor:pointer;padding:0;transition:background .3s,border-color .3s,transform .3s}
.walk-dot.on{background:var(--ochre-400);border-color:var(--ochre-400);transform:scale(1.3)}
.walk-skip{display:none;position:absolute;bottom:30px;right:32px;z-index:3;color:var(--sand-400);font-family:var(--font-display);font-weight:600;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;text-decoration:none}
.walk-skip:hover{color:var(--paper)}

/* --- scroll-driven layer, opted into by walk.js ---------------------------
   Everything above renders a usable page on its own; these rules only apply
   once the script has confirmed it can run and motion is wanted. */
.walk-on .walk-track{height:540vh}
.walk-on .walk-stage{position:sticky;top:0;height:100vh;overflow:hidden;display:flex;align-items:center;justify-content:center}
.walk-on .walk-path{display:block}
.walk-on .walk-item{position:absolute;inset:0;padding:0 24px;opacity:0;visibility:hidden;border-bottom:0}
.walk-on .walk-item.on{opacity:1;visibility:visible}
.walk-on .walk-dots{display:flex}
.walk-on .walk-skip{display:block}
@media(max-width:640px){.walk-on .walk-skip{display:none}.walk-on .walk-dots{bottom:24px}}