.walk-page{
  --walk-max:1180px;
  --walk-side:clamp(20px,5vw,72px);
  --walk-gap:clamp(40px,6vw,88px);
  --walk-title:clamp(2.55rem,calc(1.5rem + 3.6vw),5.35rem);
  overflow-x:clip;
  background:#14100e;
}
.walk-page main{overflow:clip}
.walk-wrap{width:min(var(--walk-max),calc(100% - var(--walk-side) - var(--walk-side)));margin-inline:auto}
.walk-page :where(h1,h2,h3,h4,p,ol,ul,figure,blockquote){min-width:0;overflow-wrap:break-word}
.walk-page h1,.walk-page h2{margin:0;font-weight:900;letter-spacing:-.065em;text-transform:uppercase}
.walk-page h2{font-size:var(--walk-title);line-height:1.02}
.walk-page p{font-size:clamp(1rem,1.35vw,1.16rem);line-height:1.68}
.walk-kicker,.walk-number{margin:0 0 18px;color:#ef7e39;font-size:.7rem!important;font-weight:900;letter-spacing:.18em;line-height:1.3!important;text-transform:uppercase}
.walk-lead{font-size:clamp(1.25rem,2.1vw,1.82rem)!important;font-weight:800;line-height:1.38!important}
.walk-section{padding:clamp(84px,11vw,156px) 0}
.walk-copy p:first-child{margin-top:0}
.walk-copy p:last-child{margin-bottom:0}
.walk-arrow-link{display:inline-block;color:#d6662d;font-size:.78rem;font-weight:900;letter-spacing:.08em;text-decoration:none;text-transform:uppercase}
.walk-arrow-link:hover{color:var(--accent)}

/* Hero */
.walk-site-header{position:absolute;z-index:20;inset:0 0 auto;height:0;overflow:visible}
.walk-hero{position:relative;display:grid;align-items:end;min-height:680px;height:min(100svh,940px);isolation:isolate;overflow:hidden;background:#0e151c;color:#f5eee7}
.walk-hero::before{content:"";position:absolute;z-index:-3;inset:0;background:radial-gradient(circle at 73% 37%,rgba(33,183,177,.13),transparent 0 19%,rgba(33,183,177,.055) 19.2% 30%,transparent 30.2%),linear-gradient(125deg,transparent 0 59%,rgba(239,126,57,.16) 59.1% 59.35%,transparent 59.45%),linear-gradient(180deg,#111b24,#0b1016)}
.walk-hero-copy{position:relative;z-index:2;width:min(var(--walk-max),calc(100% - var(--walk-side) - var(--walk-side)));margin-inline:auto;padding-bottom:clamp(88px,12vh,132px)}
.walk-hero h1{max-width:1120px;font-size:clamp(3.15rem,calc(1.35rem + 5.2vw),7.85rem);line-height:.94}
.walk-hero h1 span{display:block}
.walk-hero h1 span:first-child{color:#ef7b37}
.walk-hero-lead{max-width:680px;margin:32px 0 0;color:#bdcbd0;font-size:clamp(1.05rem,1.8vw,1.34rem)!important;line-height:1.55!important}
.walk-hero-geometry{position:absolute;z-index:-1;inset:0;pointer-events:none}
.hero-orbit{position:absolute;border:1px solid rgba(62,206,198,.25);border-radius:50%}
.orbit-one{width:min(57vw,780px);aspect-ratio:1;right:-10vw;top:6%}
.orbit-two{width:min(38vw,520px);aspect-ratio:1;right:1vw;top:17%;border-color:rgba(239,126,57,.28)}
.hero-axis{position:absolute;width:1px;height:145%;top:-18%;right:34%;background:linear-gradient(transparent,rgba(255,255,255,.18),transparent);transform:rotate(38deg)}
.hero-foot{position:absolute;width:clamp(74px,9vw,140px);height:auto;filter:invert(74%) sepia(49%) saturate(1046%) hue-rotate(329deg) brightness(102%);opacity:.18}
.hero-foot-left{right:20%;top:16%;transform:rotate(-19deg)}
.hero-foot-right{right:7%;top:43%;transform:rotate(12deg)}
.walk-hero-count{position:absolute;right:var(--walk-side);bottom:28px;left:var(--walk-side);display:grid;grid-template-columns:auto auto 1fr auto auto;align-items:center;gap:14px;color:rgba(255,255,255,.42);font-size:.61rem;font-weight:900;letter-spacing:.13em;text-transform:uppercase}
.walk-hero-count b{color:#ef7b37;font-size:.88rem}
.walk-hero-count i{height:1px;background:rgba(255,255,255,.18)}

/* 01 — first step */
.first-step{background:#eee5d9;color:#2a211b}
.first-step .walk-number{color:#a94b24}
.first-step h2{color:#211915}
.first-step-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,.82fr);gap:var(--walk-gap)}
.first-step .walk-lead{color:#91401e}
.step-diagram{grid-column:1/-1;display:grid;grid-template-columns:1fr minmax(50px,.35fr) 1fr;align-items:center;margin-top:clamp(34px,5vw,68px);padding:clamp(24px,4vw,48px);border:1px solid rgba(50,31,21,.2)}
.step-diagram>div{display:flex;align-items:center;justify-content:center;gap:clamp(18px,4vw,48px);color:#5b4639;font-size:clamp(1rem,2vw,1.4rem);font-weight:900;text-transform:uppercase}
.step-diagram img{width:clamp(48px,7vw,84px);height:clamp(108px,15vw,174px);object-fit:contain;opacity:.78}
.step-diagram>i{height:1px;background:rgba(56,35,23,.3)}

/* 02 — listening */
.listening-section{background:#101923;color:#bdc9cf}
.listening-section h2{max-width:720px;color:#f1f4f5}
.listening-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,.82fr);gap:var(--walk-gap)}
.listening-section .walk-lead{color:#63d2c9}
.listening-loop{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:clamp(58px,8vw,100px);padding-top:28px;border-top:1px solid rgba(255,255,255,.16);color:#f1ece7;text-transform:uppercase}
.listening-loop span{font-size:clamp(.67rem,1.1vw,.9rem);font-weight:900;letter-spacing:.08em}
.listening-loop i{color:#ef7e39;font-style:normal}

/* 03 — body */
.body-section{background:#e67933;color:#29170e}
.body-section .walk-number{color:#57270f}
.body-section h2{color:#21120b}
.body-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,.82fr);gap:var(--walk-gap)}
.body-grid blockquote{grid-column:1/-1;margin:clamp(40px,7vw,88px) 0 0;padding:clamp(28px,5vw,56px) 0;border-top:1px solid rgba(48,24,10,.32);border-bottom:1px solid rgba(48,24,10,.32);font-size:clamp(2rem,5vw,5rem);font-weight:900;letter-spacing:-.055em;line-height:1;text-transform:uppercase}
.body-grid blockquote small{display:block;margin-top:22px;color:#633018;font-size:clamp(.68rem,1vw,.85rem);letter-spacing:.1em;line-height:1.5}

/* 04 — learning path */
.path-section{background:#1a1411;color:#cdbeb3}
.path-heading{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,.7fr);gap:var(--walk-gap)}
.path-heading h2{max-width:760px;color:#f2e8e0}
.path-heading>p{margin:0;align-self:end}
.walk-path{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;margin:clamp(60px,8vw,104px) 0 0;padding:1px;list-style:none;background:rgba(255,255,255,.15)}
.walk-path li{position:relative;display:flex;min-height:175px;padding:24px;flex-direction:column;justify-content:space-between;gap:30px;background:#14100e}
.walk-path li:nth-child(3n){background:#111b22}
.walk-path li:nth-child(4n){background:#2b1a12}
.walk-path li::after{content:"→";position:absolute;z-index:2;right:-10px;top:50%;color:#ed7c38;font-size:1.2rem;font-weight:900;transform:translateY(-50%)}
.walk-path li:nth-child(4)::after,.walk-path li:last-child::after{display:none}
.walk-path span{color:#e77a39;font-size:.66rem;font-weight:900;letter-spacing:.12em}
.walk-path strong{color:#f0e7df;font-size:clamp(1rem,1.5vw,1.28rem);line-height:1.18;text-transform:uppercase}

/* 05 — small steps */
.small-steps{background:#e8ded2;color:#32261f}
.small-steps .walk-number{color:#a94b24}
.small-steps h2{color:#211915}
.small-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,.82fr);gap:var(--walk-gap)}
.small-steps .walk-lead{color:#8d3c1d}
.word-line{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:clamp(58px,8vw,96px);padding:24px 0;border-top:1px solid rgba(53,34,23,.24);border-bottom:1px solid rgba(53,34,23,.24);color:#4d392e;text-transform:uppercase}
.word-line span{font-size:clamp(.68rem,1.1vw,.92rem);font-weight:900;letter-spacing:.075em}
.word-line i{color:#b34b21;font-style:normal;font-weight:900}

/* 06 — everyday */
.everyday-section{position:relative;display:grid;align-items:end;min-height:clamp(720px,82vw,980px);isolation:isolate;overflow:hidden;background:#17100c;color:#f4e9e0}
.everyday-section::after{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(90deg,rgba(19,10,5,.9),rgba(19,10,5,.25) 72%),linear-gradient(180deg,rgba(19,10,5,.08),rgba(19,10,5,.78))}
.everyday-section>img{position:absolute;z-index:-2;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 62%;filter:saturate(.72) contrast(1.05)}
.everyday-content{padding-bottom:clamp(70px,10vw,120px)}
.everyday-content h2{max-width:880px;color:#fff}
.everyday-content>p:not(.walk-number){max-width:680px;color:#eee1d6}
.everyday-content .walk-lead{margin-top:34px;color:#ffc096}

/* 07 — app preview */
.app-section{background:#0d1720;color:#bdc9cf}
.app-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(310px,.7fr);align-items:center;gap:var(--walk-gap)}
.app-section h2{color:#f1f4f5}
.app-section .walk-lead{margin-top:36px;color:#63d2c9}
.development-note{margin-top:34px;padding:20px;border-left:3px solid #ed7b38;background:rgba(255,255,255,.045);color:#dce2e4;font-size:.95rem!important}
.app-preview{width:min(100%,410px);margin:0 auto}
.app-preview figcaption{margin-bottom:14px;color:#739099;font-size:.65rem;font-weight:900;letter-spacing:.13em;text-align:center;text-transform:uppercase}
.phone-frame{position:relative;min-height:650px;padding:34px 28px;border:1px solid rgba(255,255,255,.2);border-radius:42px;background:linear-gradient(150deg,#172630,#0d1319);box-shadow:0 38px 70px rgba(0,0,0,.38);overflow:hidden}
.phone-frame::before{content:"";position:absolute;width:270px;aspect-ratio:1;right:-70px;top:105px;border:1px solid rgba(83,222,211,.2);border-radius:50%;box-shadow:0 0 0 44px rgba(83,222,211,.025),0 0 0 88px rgba(83,222,211,.02)}
.preview-head{position:relative;display:flex;justify-content:space-between;gap:18px;color:#f1f4f5;font-size:.84rem;font-weight:900;letter-spacing:.06em;text-transform:uppercase}
.preview-head small{color:#76939b;font-size:.61rem}
.pulse-clock{position:relative;display:grid;place-items:center;width:230px;aspect-ratio:1;margin:70px auto 52px;border:1px solid rgba(255,255,255,.19);border-radius:50%}
.pulse-clock::before,.pulse-clock::after{content:"";position:absolute;inset:22px;border:1px solid rgba(239,126,57,.32);border-radius:50%}
.pulse-clock::after{inset:50%;width:42%;height:1px;border:0;background:#60cfc7;transform-origin:left;transform:rotate(-62deg)}
.pulse-clock i{position:absolute;top:-5px;width:10px;height:10px;border-radius:50%;background:#ef7e39;box-shadow:0 0 18px rgba(239,126,57,.8)}
.pulse-clock b{color:#f2ece7;font-size:1.75rem;letter-spacing:.08em}
.pulse-clock span{position:absolute;bottom:48px;color:#6bcfc8;font-size:.65rem;font-weight:900;letter-spacing:.12em}
.preview-feet{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(255,255,255,.12)}
.preview-feet span{display:flex;min-height:88px;align-items:center;justify-content:center;gap:15px;background:#101a22;color:#eb8250;font-size:.75rem;font-weight:900}
.preview-feet img{width:24px;height:50px;object-fit:contain;filter:invert(76%) sepia(48%) saturate(2320%) hue-rotate(329deg);opacity:.75}
.preview-pattern{display:grid;grid-template-columns:repeat(8,1fr);gap:6px;margin-top:24px}
.preview-pattern i{aspect-ratio:1;border:1px solid rgba(255,255,255,.2);border-radius:50%}
.preview-pattern i.on{border-color:#61cec6;background:#61cec6}
.phone-frame>p{margin:20px 0 0;color:#718b94;font-size:.68rem;text-align:center;text-transform:uppercase;letter-spacing:.1em}

/* 08 — first module */
.first-module{background:#eee5d9;color:#32261f}
.first-module .walk-number{color:#a94b24}
.first-module h2{color:#211915}
.module-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,.82fr);gap:var(--walk-gap)}
.module-status{display:inline-block;margin:28px 0 0;padding:8px 11px;border:1px solid rgba(52,33,22,.25);color:#87401f;font-size:.65rem!important;font-weight:900;letter-spacing:.11em;text-transform:uppercase}
.first-module .walk-lead{color:#91401e}
.pattern-board{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;margin-top:clamp(34px,5vw,62px);padding:1px;background:rgba(48,31,21,.2)}
.pattern-board>span{display:grid;grid-template-columns:auto repeat(4,1fr);align-items:center;gap:10px;min-height:82px;padding:16px;background:#e8dccd}
.pattern-board b{margin-right:8px;color:#9c4a24;font-size:.61rem;letter-spacing:.1em}
.pattern-board i{aspect-ratio:1;border:1px solid rgba(49,31,20,.28);border-radius:50%}
.pattern-board i.hit{border-color:#1d6e70;background:#1d6e70}

/* 09 — future */
.future-modules{background:#181310;color:#cdbeb2}
.future-heading{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,.68fr);gap:var(--walk-gap)}
.future-heading h2{color:#f2e9e1}
.future-heading>p{margin:0;align-self:end}
.module-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;margin:clamp(58px,8vw,100px) 0 0;padding:1px;list-style:none;background:rgba(255,255,255,.15)}
.module-list li{display:flex;min-height:112px;align-items:flex-end;padding:18px;background:#211914;color:#f0e6de;font-size:clamp(.76rem,1.15vw,.96rem);font-weight:900;letter-spacing:.045em;text-transform:uppercase}
.module-list li:nth-child(3n){background:#111b22}
.module-list li:nth-child(4n){background:#2c1b13}
.families-note{display:grid;grid-template-columns:minmax(150px,.3fr) minmax(0,1fr);gap:clamp(30px,6vw,80px);align-items:center;margin-top:clamp(64px,9vw,116px);padding-top:clamp(48px,7vw,80px);border-top:1px solid rgba(255,255,255,.16)}
.families-note>span{color:#ef7e39;font-size:clamp(5rem,12vw,10rem);font-weight:900;letter-spacing:-.09em;line-height:.8}
.families-note h3{margin:0;color:#f1e7df;font-size:clamp(1.5rem,2.7vw,2.45rem);letter-spacing:-.045em}
.families-note p{max-width:690px;margin-bottom:0}
.advanced-note{max-width:760px;margin:48px 0 0;padding-left:20px;border-left:3px solid #4bbdb7;color:#aebdc3}

/* 10 — origin */
.origin-section{background:#e57932;color:#29170e}
.origin-section .walk-number{color:#58260f}
.origin-section h2{color:#21120b}
.origin-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,.82fr);gap:var(--walk-gap)}

/* 11 — connection */
.connection-section{background:#111923;color:#bec9cf}
.connection-section h2{max-width:1040px;color:#f1f4f5}
.connection-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;margin-top:clamp(58px,8vw,96px);background:rgba(255,255,255,.16)}
.connection-grid article{min-height:330px;padding:clamp(28px,4vw,48px);background:#17222b}
.connection-grid article:last-child{background:#211812}
.connection-grid span{display:block;margin-bottom:50px;color:#61cec6;font-size:.68rem;font-weight:900;letter-spacing:.13em;text-transform:uppercase}
.connection-grid article:last-child span{color:#ef7e39}
.connection-grid strong{display:block;color:#f1e9e2;font-size:clamp(1.25rem,2.3vw,2rem);line-height:1.3}
.connection-grid p{max-width:500px}
.connection-grid a{display:inline-block;margin-top:16px;color:#f08a4a;font-size:.76rem;font-weight:900;letter-spacing:.08em;text-decoration:none;text-transform:uppercase}

/* 12 — platform and closing */
.platform-section{background:#e8ded2;color:#30241d}
.platform-section .walk-number{color:#a94b24}
.platform-section h2{color:#211915}
.platform-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,.82fr);gap:var(--walk-gap)}
.platform-section .walk-lead{color:#743a24}
.domain-name{color:#0f6b6b;white-space:nowrap}
.platform-section .development-note{border-left-color:#157979;background:rgba(16,105,105,.06);color:#43342b}
.walk-cta{padding:clamp(100px,14vw,190px) 0;background:#10171d;color:#bcc8ce}
.walk-cta h2{max-width:1020px;color:#f3f5f6}
.walk-cta>div>p:not(.walk-number):not(.platform-mark){max-width:680px;margin-top:32px}
.walk-actions{display:flex;align-items:center;flex-wrap:wrap;gap:28px;margin-top:40px}
.platform-mark{margin:clamp(72px,10vw,120px) 0 0!important;padding-top:24px;border-top:1px solid rgba(255,255,255,.16);color:#f0e8e2;font-size:clamp(1.3rem,2.3vw,2rem)!important;font-weight:900;letter-spacing:-.03em}
.platform-mark span{margin-left:14px;color:#6f8b94;font-size:.62rem;font-weight:900;letter-spacing:.13em;text-transform:uppercase}
.walk-footer{display:flex;justify-content:space-between;gap:24px;padding-block:28px;padding-inline:max(var(--walk-side),calc((100% - var(--walk-max))/2));background:#0b0e11;color:rgba(255,255,255,.48);font-size:.73rem;letter-spacing:.05em}
.walk-footer a{color:#ef7e39;font-weight:900;text-decoration:none}
.walk-back-to-top{position:fixed;z-index:30;right:clamp(16px,2vw,24px);bottom:max(clamp(16px,2vw,24px),env(safe-area-inset-bottom));width:46px;height:46px;padding:0;border:1px solid rgba(255,255,255,.2);border-radius:50%;background:rgba(13,18,22,.78);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#f1ece7;font-family:inherit;font-size:1.1rem;font-weight:800;line-height:1;cursor:pointer;box-shadow:0 6px 22px rgba(0,0,0,.18)}
.walk-back-to-top:hover{background:rgba(29,40,47,.92)}
.walk-back-to-top:focus-visible{outline:2px solid #ef7e39;outline-offset:3px}
.walk-back-to-top[hidden]{display:none}

@media(max-width:940px){
  .walk-path{grid-template-columns:repeat(2,minmax(0,1fr))}
  .walk-path li:nth-child(4)::after{display:block}
  .walk-path li:nth-child(2n)::after{display:none}
  .module-list{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pattern-board{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:760px){
  .walk-hero{min-height:690px}
  .walk-hero-copy{padding-top:150px;padding-bottom:92px}
  .walk-hero h1{font-size:clamp(2.65rem,11.5vw,4.15rem);line-height:.98}
  .walk-hero-lead{margin-top:26px}
  .orbit-one{width:115vw;right:-55vw;top:11%}
  .orbit-two{width:78vw;right:-25vw;top:20%}
  .hero-axis{right:20%}
  .hero-foot{width:72px}
  .hero-foot-left{right:20%;top:10%}
  .hero-foot-right{right:2%;top:36%}
  .first-step-grid,.listening-grid,.body-grid,.path-heading,.small-grid,.app-grid,.module-grid,.future-heading,.origin-grid,.platform-grid{grid-template-columns:1fr}
  .step-diagram{grid-column:auto}
  .listening-loop,.word-line{display:grid;grid-template-columns:1fr auto;justify-content:initial}
  .listening-loop i,.word-line i{transform:rotate(90deg)}
  .listening-loop i:last-of-type,.word-line i:last-of-type{display:none}
  .word-line{display:flex;align-items:flex-start;flex-direction:column;gap:11px}
  .word-line i{margin-left:18px}
  .word-line i:last-of-type{display:block}
  .body-grid blockquote{grid-column:auto}
  .path-heading>p,.future-heading>p{margin-top:0}
  .everyday-section{min-height:800px}
  .everyday-section::after{background:linear-gradient(180deg,rgba(19,10,5,.12) 8%,rgba(19,10,5,.92) 54%)}
  .everyday-section>img{object-position:57% center}
  .phone-frame{min-height:610px}
  .app-preview{margin-top:16px}
  .pattern-board{grid-column:auto}
  .families-note{grid-template-columns:1fr}
  .connection-grid{grid-template-columns:1fr}
  .connection-grid article{min-height:0}
  .walk-footer{flex-direction:column}
}

@media(max-width:520px){
  .walk-page{--walk-title:clamp(2.25rem,10.2vw,3.15rem)}
  .walk-hero h1{font-size:clamp(2.38rem,10.7vw,3.35rem)}
  .walk-hero-count{gap:7px;font-size:.5rem}
  .step-diagram{grid-template-columns:1fr auto 1fr;padding:22px 14px}
  .step-diagram>div{flex-direction:column;gap:12px;font-size:.72rem}
  .step-diagram img{width:43px;height:92px}
  .walk-path{grid-template-columns:1fr}
  .walk-path li{min-height:126px}
  .walk-path li::after,.walk-path li:nth-child(2n)::after,.walk-path li:nth-child(4)::after{display:block;top:auto;right:50%;bottom:-13px;transform:translateX(50%) rotate(90deg)}
  .walk-path li:last-child::after{display:none}
  .phone-frame{min-height:560px;padding:28px 20px;border-radius:32px}
  .pulse-clock{width:200px;margin-block:62px 46px}
  .pattern-board{grid-template-columns:1fr}
  .pattern-board>span{min-height:68px}
  .module-list{grid-template-columns:1fr 1fr}
  .module-list li{min-height:96px;padding:15px;font-size:.68rem}
  .families-note>span{font-size:5.4rem}
  .connection-section h2,.platform-section h2{font-size:clamp(2rem,9.4vw,2.75rem)}
  .walk-actions{align-items:flex-start;flex-direction:column}
  .platform-mark span{display:block;margin:8px 0 0}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .walk-page *,.walk-page *::before,.walk-page *::after{scroll-behavior:auto!important;transition:none!important}
}
@media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}