
.how-page{background:var(--am-paper)}
.how-hero{min-height:720px;padding:calc(var(--am-header-height) + 6rem) 0 5rem;color:#fff;background:
radial-gradient(circle at 76% 32%,rgba(214,169,59,.2),transparent 29%),
linear-gradient(145deg,var(--am-navy-950),#0b315b 68%,#123f6b);overflow:hidden}
.how-hero-inner{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(340px,.92fr);gap:clamp(2.5rem,6vw,6rem);align-items:center}
.how-hero h1{max-width:820px;margin:.65rem 0 1.35rem;font-size:clamp(3.1rem,6.7vw,6.6rem);line-height:.91;letter-spacing:-.055em}
.how-hero .lead{max-width:710px;color:rgba(255,255,255,.7);font-size:clamp(1rem,1.45vw,1.22rem);line-height:1.8}
.how-actions{display:flex;gap:.75rem;flex-wrap:wrap;margin-top:2rem}
.button-ghost-light{border-color:rgba(255,255,255,.25);background:rgba(255,255,255,.04);color:#fff}
.route-visual{position:relative;min-height:430px;display:grid;place-items:center}
.route-visual::before{content:"";position:absolute;width:410px;height:410px;border:1px solid rgba(255,255,255,.1);border-radius:50%}
.route-visual::after{content:"";position:absolute;width:270px;height:270px;border:1px solid rgba(214,169,59,.2);border-radius:50%}
.route-visual svg{position:relative;z-index:1;width:min(100%,720px)}
.route-path{fill:none;stroke:rgba(255,255,255,.42);stroke-width:3;stroke-dasharray:9 10}.route-node{fill:#d6a93b;stroke:#fff;stroke-width:2}.route-plane{fill:#fff;filter:drop-shadow(0 10px 16px rgba(0,0,0,.25))}
.how-section{padding:clamp(4.5rem,8vw,8rem) 0;background:var(--am-paper)}.how-section.alt{background:#eef2f5}.how-section.navy{background:var(--am-navy-950);color:#fff}
.how-heading{display:grid;grid-template-columns:minmax(0,.95fr) minmax(300px,.72fr);gap:3rem;align-items:end;margin-bottom:3rem}
.how-heading.center{display:block;max-width:840px;margin-inline:auto;text-align:center}
.how-heading h2,.support-card h2{margin:.4rem 0 0;font-size:clamp(2.25rem,4.5vw,4.8rem);line-height:1;letter-spacing:-.045em}
.how-heading>p,.how-heading>div+p,.support-card>p:not(.section-eyebrow){color:var(--am-muted);line-height:1.8}.navy .how-heading>p,.navy .how-heading>div+p{color:rgba(255,255,255,.62)}
.fracture-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem}.fracture-grid div{min-height:160px;padding:1.25rem;border:1px solid var(--am-border);background:#fff;font-weight:850;display:flex;align-items:flex-end;position:relative}.fracture-grid div::before{content:"";position:absolute;left:1.2rem;top:1.2rem;width:28px;height:3px;background:#b24d43}
.how-note{margin:1.35rem 0 0;color:var(--am-muted);font-size:.82rem;line-height:1.75}.center-note{text-align:center;max-width:820px;margin-inline:auto;margin-top:1.5rem}
.value-tabs{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:.35rem;margin-bottom:1rem}
.value-tabs button{min-height:90px;padding:.65rem .45rem;border:1px solid var(--am-border);background:#fff;color:var(--am-ink);font-weight:850;font-size:.74rem;cursor:pointer}
.value-tabs button span{display:block;color:var(--am-gold-600);font-size:.62rem;margin-bottom:.45rem}.value-tabs button[aria-selected="true"]{background:var(--am-navy-950);border-color:var(--am-navy-950);color:#fff}
.value-detail{display:grid;grid-template-columns:minmax(260px,.7fr) 1.3fr;gap:2rem;padding:2rem;border:1px solid var(--am-border);background:#fff;box-shadow:var(--am-shadow-sm)}
.value-detail .stage-no{color:var(--am-gold-600);font-weight:900;font-size:.7rem;letter-spacing:.12em}.value-detail h3{font-size:clamp(2rem,3.7vw,3.3rem);margin:.5rem 0}.value-detail .stage-why{color:var(--am-muted);line-height:1.7}
.stage-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.7rem}.stage-grid div{padding:1rem;background:#f2f5f7;border-top:2px solid var(--am-gold-500)}.stage-grid small{display:block;color:var(--am-muted);font-size:.66rem;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.stage-grid p{margin:.55rem 0 0;font-size:.82rem;line-height:1.65}
.distinction-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.7rem}.distinction-grid div{min-height:100px;display:flex;align-items:center;padding:1rem;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.035);font-weight:900;font-size:.83rem}
.loop-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1rem}.loop-grid article{min-width:0;padding:1.5rem;background:#fff;border:1px solid var(--am-border)}.loop-grid article>span{color:var(--am-gold-600);font-size:.7rem;font-weight:900}
.mini-route{display:flex;min-width:0;max-width:100%;gap:.4rem;overflow-x:auto;overflow-y:hidden;margin-top:1rem}.mini-route div{min-width:135px;flex:1;padding:.85rem;border:1px solid var(--am-border);background:#fff;text-align:center;font-size:.78rem;font-weight:850}.loop-grid .mini-route div{background:#f7f9fa}
.mini-route div+div::before{content:"→";color:var(--am-gold-600);margin-inline-end:.45rem}[dir="rtl"] .mini-route div+div::before{content:"←"}
.directions-grid{display:grid;grid-template-columns:minmax(0,1fr) 220px minmax(0,1fr);gap:1.2rem;align-items:center}.directions-grid article{min-width:0;padding:1.5rem;border:1px solid var(--am-border);background:#fff}.directions-grid h3{font-size:1.5rem;margin:0}
.directions-core{width:190px;height:190px;border-radius:50%;border:1px solid var(--am-gold-500);display:grid;place-items:center;text-align:center;padding:1.25rem;font-weight:900;color:var(--am-navy-950);box-shadow:0 0 0 15px rgba(214,169,59,.08);margin:auto}
.bridge-five{display:grid;grid-template-columns:repeat(5,1fr);gap:.7rem}.bridge-five div{padding:1.2rem;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.035);font-weight:900;text-align:center}
.two-columns{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.support-card{padding:2rem;background:#fff;border:1px solid var(--am-border)}.support-card h2{font-size:clamp(2rem,3.3vw,3.4rem)}
.support-chips{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:1.3rem}.support-chips span{padding:.65rem .8rem;background:#eef2f5;border:1px solid var(--am-border);font-size:.77rem;font-weight:850}
.boundary-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;max-width:980px;margin-inline:auto}.boundary-grid article{padding:2rem;background:#fff;border:1px solid var(--am-border)}.boundary-grid article>span{color:var(--am-gold-600);font-size:.7rem;font-weight:900}.boundary-grid h3{font-size:1.55rem}.boundary-grid p{color:var(--am-muted);line-height:1.75}
.choose-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.choose-card{min-height:270px;padding:1.5rem;border:1px solid var(--am-border);background:#fff;display:flex;flex-direction:column}.choose-card span{color:var(--am-gold-600);font-size:.7rem;font-weight:900}.choose-card h3{font-size:1.35rem;line-height:1.2;margin:2rem 0 .8rem}.choose-card p{color:var(--am-muted);font-size:.84rem;line-height:1.7}.choose-card strong{margin-top:auto;color:var(--am-navy-950);font-size:.78rem}
.how-close{padding:clamp(5rem,9vw,9rem) 0;background:linear-gradient(145deg,var(--am-navy-950),#0b315c);color:#fff;text-align:center}.how-close-inner{max-width:930px}.how-close h2{font-size:clamp(2.7rem,5vw,5.4rem);line-height:1;letter-spacing:-.045em;margin:.6rem 0 1rem}.how-close .lead{color:rgba(255,255,255,.65);line-height:1.8}.how-close .how-actions{justify-content:center}
@media(max-width:1050px){.value-tabs{display:flex;width:100%;min-width:0;max-width:100%;overflow-x:auto;overflow-y:hidden}.value-tabs button{min-width:130px}.how-hero-inner,.how-heading,.value-detail,.two-columns{grid-template-columns:1fr}.fracture-grid,.distinction-grid{grid-template-columns:repeat(2,1fr)}.directions-grid{grid-template-columns:1fr}.directions-core{margin:1rem auto}.bridge-five{grid-template-columns:repeat(3,1fr)}}
@media(max-width:680px){.how-hero{min-height:auto;padding-top:calc(var(--am-header-height) + 4rem)}.how-hero h1{font-size:clamp(2.8rem,14vw,4.4rem)}.route-visual{min-height:240px}.route-visual::before{width:260px;height:260px}.route-visual::after{width:180px;height:180px}
.fracture-grid,.distinction-grid,.loop-grid,.bridge-five,.boundary-grid,.choose-grid{grid-template-columns:1fr}.stage-grid{grid-template-columns:1fr}.mini-route{display:grid}.mini-route div{min-width:0}.mini-route div+div::before,[dir="rtl"] .mini-route div+div::before{display:block;content:"↓";margin:0 0 .35rem}.directions-core{width:160px;height:160px}}
