/* PAGE 28: aligned editorial guide. Styles stay inside this page. */
.how-page{padding:42px 0 96px}
.how-page *{box-sizing:border-box}
.how-shell{width:min(var(--container),calc(100% - var(--gutter)*2));margin-inline:auto}
.how-page :is(.step-body,.mode-name,.open-map-main,.open-map-list,.return-node){min-width:0}
.how-page .how-kicker{display:block;color:#6a645c;font-size:14px;font-weight:850;letter-spacing:.1em;text-transform:uppercase}
.how-page .how-hero{padding:48px 0 64px;border-bottom:1px solid #1515152e}
.how-page h1{max-width:1040px;margin:14px 0 24px;font-size:clamp(46px,5.8vw,76px);line-height:1.02;letter-spacing:-.055em}
.how-page .how-hero p{max-width:820px;margin:0;font-size:18px;line-height:1.65;color:var(--muted)}
.how-page .hero-actions{display:flex;flex-wrap:wrap;gap:16px;align-items:center;margin-top:28px}
.how-page :is(.hero-primary,.hero-secondary,.moja-link,.orientation-primary,.orientation-secondary){display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:12px 20px;font-size:14px;font-weight:800;line-height:1.4;text-decoration:none;transition:color .15s,background-color .15s,border-color .15s}
.how-page :is(.hero-primary,.orientation-primary){background:var(--red);color:#fff;border:1px solid var(--red)}
.how-page .hero-secondary{padding-inline:0;color:var(--ink);border-bottom:1px solid #15151540}
.how-page .journey{margin-top:64px;border-top:2px solid var(--ink)}
.how-page .journey-step{display:grid;grid-template-columns:72px minmax(0,1fr);gap:32px;align-items:start;padding:48px 0;border-bottom:1px solid #1515152e}
.how-page .step-number{font-size:64px;font-weight:900;line-height:1;letter-spacing:-.055em;color:#b8b0a4}
.how-page .step-head{max-width:860px;margin-bottom:28px}
.how-page .step-head h2{margin:10px 0 16px;font-size:clamp(30px,3.2vw,42px);line-height:1.12;letter-spacing:-.04em}
.how-page .step-head p{max-width:780px;margin:0;font-size:16px;line-height:1.65;color:var(--muted)}
.how-page .mode-index{border-top:2px solid var(--ink);border-bottom:2px solid var(--ink)}
.how-page .mode-item{display:grid;grid-template-columns:38px minmax(0,1fr) 24px;gap:20px;align-items:center;min-height:98px;padding:22px 16px;border-bottom:1px solid #15151529;color:var(--ink);text-decoration:none;transition:background-color .15s,color .15s}
.how-page .mode-item:last-child{border-bottom:0}
.how-page .mode-token{font-size:14px;font-weight:800;color:var(--muted)}
.how-page .mode-name{display:grid;grid-template-columns:minmax(170px,.7fr) minmax(0,1.3fr);gap:24px;align-items:start}
.how-page .mode-name strong{font-size:22px;line-height:1.25;letter-spacing:-.025em}
.how-page .mode-name small{font-size:16px;font-weight:400;line-height:1.6;color:var(--muted)}
.how-page .mode-arrow{font-size:24px;transition:transform .15s}
.how-page .mode-item:hover{background:var(--surface);color:var(--red)}
.how-page .mode-item:hover .mode-arrow{transform:translateX(4px)}
.how-page .open-map{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);border:2px solid var(--ink)}
.how-page .open-map-main{padding:30px;background:var(--ink);color:#fff}
.how-page .open-map-main>span{font-size:14px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#fff}
.how-page .open-map-main h3{margin:14px 0 18px;font-size:30px;line-height:1.15;letter-spacing:-.03em;color:#fff}
.how-page .open-map-main p{margin:0;font-size:16px;line-height:1.65;color:#ffffffd9}
.how-page .open-map-list{display:grid}
.how-page .open-map-row{display:grid;grid-template-columns:minmax(100px,.4fr) minmax(0,1fr);gap:18px;align-items:start;padding:22px;border-bottom:1px solid #15151529}
.how-page .open-map-row:last-child{border-bottom:0}
.how-page .open-map-row strong,.how-page .open-map-row span{font-size:16px;line-height:1.6}
.how-page .open-map-row span{color:var(--muted)}
.how-page :is(.access-rail,.completion-grid){display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:2px solid var(--ink);border-bottom:2px solid var(--ink)}
.how-page :is(.access-cell,.completion-cell){padding:28px 24px;min-height:156px;border-right:1px solid #15151529}
.how-page :is(.access-cell,.completion-cell):last-child{border-right:0}
.how-page :is(.access-cell,.completion-cell)>strong{display:block;font-size:24px;line-height:1.2;letter-spacing:-.03em}
.how-page :is(.access-cell,.completion-cell)>span{display:block;margin-top:16px;font-size:16px;line-height:1.65;color:var(--muted)}
.how-page .access-cell:last-child{background:var(--ink);color:#fff}
.how-page .access-cell:last-child>span{color:#ffffffd9}
.how-page .moja-strip{padding:32px;background:var(--ink);color:#fff;border-top:4px solid var(--red)}
.how-page .moja-strip .how-kicker{color:#fff}
.how-page .moja-strip-head{display:flex;align-items:center;justify-content:space-between;gap:24px}
.how-page .moja-strip h3{margin:12px 0;font-size:36px;line-height:1.12;color:#fff}
.how-page .moja-strip p{max-width:560px;margin:0;font-size:16px;line-height:1.65;color:#ffffffd9}
.how-page .moja-link{color:#fff;border:1px solid #ffffff80;flex-shrink:0}
.how-page .moja-states{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:28px;border-top:1px solid #ffffff40}
.how-page .moja-state{padding:20px 20px 0 0;border-right:1px solid #ffffff40}
.how-page .moja-state+.moja-state{padding-left:20px}
.how-page .moja-state:last-child{border-right:0}
.how-page .moja-state strong{display:block;font-size:18px;line-height:1.3}
.how-page .moja-state span{display:block;margin-top:8px;font-size:16px;line-height:1.6;color:#ffffffd9}
.how-page .return-explainer{margin-top:64px;padding-top:30px;border-top:2px solid var(--ink)}
.how-page .return-explainer h2{max-width:840px;margin:12px 0 28px;font-size:36px;line-height:1.15;letter-spacing:-.035em}
.how-page .return-flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid #15151540}
.how-page .return-node{padding:24px;border-right:1px solid #15151529}
.how-page .return-node:last-child{border-right:0}
.how-page .return-node strong{display:block;font-size:18px;line-height:1.3}
.how-page .return-node span{display:block;margin-top:12px;font-size:16px;line-height:1.65;color:var(--muted)}
.how-page .trust-note{margin-top:40px;padding:24px;border-left:4px solid var(--red);background:var(--surface)}
.how-page .trust-note strong{display:block;font-size:18px;line-height:1.4}
.how-page .trust-note p{max-width:850px;margin:10px 0 0;font-size:16px;line-height:1.65;color:var(--muted)}
.how-page .orientation-cta{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:32px;align-items:center;margin-top:64px;padding:40px;background:var(--ink);color:#fff;border-top:4px solid var(--red)}
.how-page .orientation-cta .how-kicker{color:#fff}
.how-page .orientation-cta h2{max-width:760px;margin:12px 0 16px;font-size:clamp(34px,4vw,46px);line-height:1.08;letter-spacing:-.04em;color:#fff}
.how-page .orientation-cta p{margin:0;font-size:16px;line-height:1.65;color:#ffffffd9}
.how-page .orientation-actions{display:flex;flex-wrap:wrap;gap:12px}
.how-page .orientation-secondary{color:#fff;border:1px solid #ffffff80}
.how-page :is(.hero-primary,.orientation-primary):hover{background:#ce2023;border-color:#ce2023;color:#fff}
.how-page :is(.moja-link,.orientation-secondary):hover{background:#ffffff14;border-color:#fff;color:#fff}
.how-page .hero-secondary:hover{color:var(--red);border-color:var(--red)}
.how-page :is(a,button):focus-visible{outline:2px solid var(--red);outline-offset:4px}
@media(max-width:1100px){.how-page .open-map{grid-template-columns:1fr}.how-page .return-flow{grid-template-columns:repeat(2,minmax(0,1fr))}.how-page .return-node{border-bottom:1px solid #15151529}.how-page .return-node:nth-child(2n){border-right:0}.how-page .return-node:nth-child(n+3){border-bottom:0}.how-page .moja-strip-head{align-items:start;flex-direction:column}.how-page .orientation-cta{grid-template-columns:1fr}}
@media(max-width:760px){.how-page .journey-step{grid-template-columns:48px minmax(0,1fr);gap:20px}.how-page .step-number{font-size:44px}.how-page .mode-name{grid-template-columns:1fr;gap:8px}.how-page :is(.access-rail,.completion-grid,.moja-states){grid-template-columns:1fr}.how-page :is(.access-cell,.completion-cell){min-height:0;border-right:0;border-bottom:1px solid #15151529}.how-page :is(.access-cell,.completion-cell):last-child{border-bottom:0}.how-page .moja-state,.how-page .moja-state+.moja-state{padding:20px 0;border-right:0;border-bottom:1px solid #ffffff40}.how-page .moja-state:last-child{border-bottom:0}}
@media(max-width:620px){.how-page{padding-top:22px;padding-bottom:72px}.how-page .how-hero{padding:32px 0 44px}.how-page h1{font-size:42px}.how-page .how-hero p{font-size:16px}.how-page .hero-actions{display:grid}.how-page .journey{margin-top:44px}.how-page .journey-step{grid-template-columns:1fr;gap:18px;padding:34px 0}.how-page .mode-item{grid-template-columns:24px minmax(0,1fr) 20px;gap:12px;padding:20px 0}.how-page .mode-name strong{font-size:21px}.how-page .open-map-main{padding:24px}.how-page .open-map-row{grid-template-columns:1fr;gap:8px}.how-page .moja-strip{padding:24px}.how-page .moja-link{width:100%}.how-page .return-explainer h2{font-size:30px}.how-page .return-flow{grid-template-columns:1fr}.how-page .return-node,.how-page .return-node:nth-child(n+3){border-right:0;border-bottom:1px solid #15151529}.how-page .return-node:last-child{border-bottom:0}.how-page .orientation-cta{padding:30px 22px;gap:24px}.how-page .orientation-actions{display:grid}.how-page :is(.orientation-primary,.orientation-secondary){width:100%}}