@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');:root{--navy:#08263c;--deep:#061e32;--blue:#164b65;--teal:#30b6bf;--amber:#f5b765;--cream:#f9f5eb;--ink:#122e43;--muted:#557083}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:'DM Sans',sans-serif;color:var(--ink);line-height:1.6}a{color:inherit}h1,h2,h3{font-family:Manrope,sans-serif;letter-spacing:-.035em;line-height:1.16}h1{font-size:clamp(2.6rem,5vw,5rem);margin:18px 0}h2{font-size:clamp(1.85rem,3.5vw,3rem);margin:14px 0}h3{font-size:1.22rem;margin:10px 0}p{margin:12px 0}header{position:sticky;top:0;background:#08263cf7;color:white;z-index:10;border-bottom:1px solid #4da5b355}.nav{max-width:1200px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:22px;padding:16px 25px}.brand{font:800 1.85rem Manrope;text-decoration:none;white-space:nowrap}.brand span{color:#55d5de}.tag{font-size:.67rem;letter-spacing:.14em;color:#d5e3e9;margin-left:15px;border-left:1px solid #9fc1c9;padding-left:16px}.links{display:flex;flex-wrap:wrap;gap:23px}.links a{text-decoration:none;font-weight:700;font-size:.91rem}.links a:hover,.links a.active{color:var(--amber)}.wrap{max-width:1200px;margin:auto}.hero{background:linear-gradient(110deg,#072b42,#0c3a4d);color:white;position:relative;overflow:hidden}.hero:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#08283eef 0%,#08283edc 42%,#08283e33 100%),url('assets/path-forward.jpg') center right/cover no-repeat}.hero-inner{position:relative;max-width:1200px;margin:auto;padding:105px 25px 110px;min-height:560px;display:flex;align-items:center}.hero-content{max-width:720px}.kicker{color:var(--teal);font-size:.75rem;letter-spacing:.18em;text-transform:uppercase;font-weight:800}.hero .kicker{color:#8be3e4}.hero h1 em{color:var(--amber);font-style:normal}.hero p{max-width:660px;font-size:1.22rem;color:#e2f0f2}.buttons{display:flex;gap:13px;flex-wrap:wrap;margin-top:30px}.btn{display:inline-flex;align-items:center;gap:14px;padding:14px 23px;background:#c8673e;border:1px solid #f2a27b;color:white;border-radius:8px;text-decoration:none;font-weight:800;transition:transform .2s}.btn:hover{transform:translateY(-2px)}.btn.secondary{background:#062c3bb5;border-color:#5cd1da}.btn.dark{background:var(--navy);border-color:var(--navy)}.btn.teal{background:#168e9a;border-color:#168e9a}.section{padding:83px 25px}.cream{background:var(--cream)}.dark{background:var(--navy);color:#fff}.muted{color:var(--muted)}.dark .muted{color:#c2d7df}.intro{max-width:780px;font-size:1.1rem}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:34px}.grid.two{grid-template-columns:repeat(2,1fr)}.card{background:#fff;border:1px solid #dce9e9;border-radius:14px;padding:28px;box-shadow:0 14px 30px #062a4210}.card h3{color:var(--navy)}.card p{color:#4e6675}.card a{font-weight:800;color:#116e81;text-decoration:none}.dark .card{background:#113a50;border-color:#37667b;color:white}.dark .card h3,.dark .card p{color:white}.step-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:0;margin-top:40px}.step{padding:22px 14px 15px;text-align:center;position:relative;border-top:8px solid var(--step)}.step:before{content:attr(data-num);display:grid;place-items:center;position:absolute;top:-33px;left:calc(50% - 27px);height:54px;width:54px;background:var(--step);border-radius:50%;color:white;font-weight:800;box-shadow:0 0 0 6px var(--cream)}.step h3{margin-top:17px}.step p{font-size:.9rem}.split{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}.art{width:100%;height:360px;object-fit:cover;border-radius:18px;box-shadow:0 20px 45px #021b2933}.dark .art{box-shadow:0 20px 45px #0004}.note{border-left:3px solid #e8a351;padding:10px 18px;background:#fdf3df;color:#4c3a25;margin-top:24px}.resource-row{display:flex;gap:16px;overflow-x:auto;padding:20px 0;scroll-snap-type:x mandatory}.resource-row .card{min-width:240px;max-width:260px;scroll-snap-align:start}.pill{font-size:.72rem;letter-spacing:.08em;color:#1d8894;font-weight:800}.footer{background:#04192a;color:#bed4df;padding:46px 25px}.footer .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:30px}.footer a{color:#bed4df}.footer nav{display:flex;gap:13px;flex-wrap:wrap}.cta{background:linear-gradient(120deg,#0a344b,#12536b);color:white;text-align:center;padding:70px 25px}.cta p{max-width:620px;margin:15px auto}.disclaimer{font-size:.85rem;opacity:.85}.mini{font-size:.85rem}.jump{scroll-margin-top:100px}@media(max-width:760px){.tag{display:none}.nav{flex-direction:column;align-items:flex-start}.links{gap:14px}.links a{font-size:.83rem}.hero-inner{min-height:490px;padding:70px 23px}.hero:before{background:linear-gradient(90deg,#08283ef0,#08283e9c),url('assets/path-forward.jpg') center/cover}.section{padding:62px 23px}.grid,.grid.two,.split{grid-template-columns:1fr}.step-grid{grid-template-columns:1fr;gap:24px}.step{border-top:0;border-left:8px solid var(--step);text-align:left;padding:0 18px 0 65px;min-height:60px}.step:before{top:0;left:0;transform:translateX(-26px);box-shadow:0 0 0 6px var(--cream)}.step h3{margin-top:0}.art{height:270px}}
/* Motion layer v1 â€” calm, tactile, and accessible */
:root{--motion-ease:cubic-bezier(.22,1,.36,1)}
.hero:before{animation:landscape-arrive 1.8s var(--motion-ease) both;will-change:transform}
.hero-content{animation:content-arrive .9s .12s var(--motion-ease) both}
@keyframes landscape-arrive{from{transform:scale(1.065);opacity:.72}to{transform:scale(1);opacity:1}}
@keyframes content-arrive{from{opacity:0;transform:translateY(17px)}to{opacity:1;transform:translateY(0)}}
.btn{transition:transform .25s var(--motion-ease),box-shadow .25s ease,background-color .25s ease}
.btn:hover{transform:translateY(-3px);box-shadow:0 10px 22px #001b2d33}
.btn:active{transform:translateY(0) scale(.98)}
.card{transition:transform .35s var(--motion-ease),box-shadow .35s ease,border-color .35s ease}
.card:hover{transform:translateY(-5px);box-shadow:0 20px 40px #062a4222;border-color:#87bfc5}
.step:before{transition:transform .3s var(--motion-ease),box-shadow .3s ease}
.step:hover:before{transform:scale(1.1);box-shadow:0 0 0 6px var(--cream),0 0 0 11px color-mix(in srgb,var(--step) 18%,transparent)}
.art{transition:transform .65s var(--motion-ease),box-shadow .4s ease}
.art:hover{transform:scale(1.015);box-shadow:0 26px 55px #021b2944}
a:focus-visible{outline:3px solid var(--amber);outline-offset:4px;border-radius:3px}
.jump{scroll-margin-top:115px}
@media(max-width:760px){.step:hover:before{transform:translateX(-26px) scale(1.08)}}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 .hero:before,.hero-content{animation:none!important;will-change:auto}
 .btn,.card,.step:before,.art{transition:none!important}
 .btn:hover,.btn:active,.card:hover,.art:hover{transform:none!important}
 .step:hover:before{transform:none!important}
 @media(max-width:760px){.step:hover:before{transform:translateX(-26px)!important}}
}
/* Scroll reveal layer v2 â€” one-time, progressive enhancement */
@media(prefers-reduced-motion:no-preference){
 .motion-ready .reveal-on-scroll:not(.is-visible){opacity:0;transform:translate3d(0,24px,0)}
 .motion-ready .reveal-on-scroll{transition:opacity .65s ease,transform .65s cubic-bezier(.22,1,.36,1);transition-delay:var(--reveal-delay,0ms)}
 .motion-ready .reveal-on-scroll.is-visible{opacity:1;transform:translate3d(0,0,0)}
 .motion-ready .step.reveal-on-scroll:not(.is-visible){transform:translate3d(0,18px,0)}
 .motion-ready .step.reveal-on-scroll.is-visible{transform:translate3d(0,0,0)}
}
@media(prefers-reduced-motion:reduce){
 .reveal-on-scroll{opacity:1!important;transform:none!important;transition:none!important}
}