/* Shifts Primed guide pages. A navy title panel, then numbered steps joined by a line that fills as you read. */
:root{--navy:#102538;--teal:#087d76;--teal-bright:#5cd1c3;--mint:#e4f3ee;--gold:#edbd6d;--cream:#f7faf9;--ink:#183044;--muted:#526777;--border:#dbe8e7;--white:#fff;--ease:cubic-bezier(.2,.8,.2,1);--spring:cubic-bezier(.34,1.56,.64,1);--display:Manrope,"Segoe UI",system-ui,sans-serif;--body:"DM Sans","Segoe UI",system-ui,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font-family:var(--body);overflow-x:clip}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}img{max-width:100%}h1,h2,p{margin-top:0}h1,h2{font-family:var(--display);letter-spacing:-.035em;text-wrap:balance}p{line-height:1.65}main:focus{outline:0}
a:focus-visible,button:focus-visible{outline:3px solid #b77d1a;outline-offset:4px;border-radius:6px}
.container{width:min(1160px,calc(100% - 42px));margin-inline:auto}.wrap{width:min(780px,calc(100% - 42px));margin-inline:auto}
.skip{position:fixed;left:12px;top:-80px;z-index:60;padding:12px;background:var(--white)}.skip:focus{top:12px}
.preview{background:#f2c56f;color:#182b36;text-align:center;padding:8px 15px;font-size:12px;font-weight:700;letter-spacing:.09em}
.scroll-progress{position:fixed;inset:0 0 auto;height:3px;z-index:50;pointer-events:none}.scroll-progress i{display:block;height:100%;background:linear-gradient(90deg,var(--teal),var(--gold));transform:scaleX(var(--p,0));transform-origin:left}
.site-head{position:sticky;top:0;z-index:40;background:color-mix(in srgb,var(--cream) 88%,transparent);backdrop-filter:blur(12px);transition:box-shadow .3s}.site-head.stuck{box-shadow:0 1px 0 var(--border),0 10px 24px #10253810}
.nav{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-block:12px;transition:padding .3s var(--ease)}.stuck .nav{padding-block:6px}.brand-logo{display:block;width:204px;height:auto;transition:width .3s var(--ease)}.stuck .brand-logo{width:150px}
.navlinks{display:flex;gap:6px;font-size:14px;font-weight:700}.navlinks a{padding:9px 13px;border-radius:99px;transition:color .2s,background-color .2s}.navlinks a:hover{color:var(--teal);background:var(--mint)}
.nav-right{display:flex;align-items:center;gap:10px}.navcta{display:inline-flex;gap:9px;border-radius:99px;background:var(--navy);color:var(--white);padding:11px 20px;font-weight:700;font-size:14px;transition:transform .22s var(--ease),box-shadow .22s}.navcta:hover{transform:translateY(-2px);box-shadow:0 12px 22px #10253826}
.menu-btn{display:none;width:42px;height:42px;border-radius:50%;border:1px solid var(--border);background:var(--white);position:relative;padding:0}.menu-btn i{position:absolute;left:12px;right:12px;height:2px;background:var(--navy);border-radius:2px;top:16px;transition:transform .25s var(--ease),top .25s var(--ease)}.menu-btn i+i{top:24px}.menu-btn[aria-expanded=true] i{top:20px;transform:rotate(45deg)}.menu-btn[aria-expanded=true] i+i{transform:rotate(-45deg)}
.arrow{display:inline-block;transition:transform .25s var(--ease)}a:hover>.arrow{transform:translateX(4px)}
.guide-hero{background:radial-gradient(ellipse at 85% 20%,#245565 0%,transparent 50%),linear-gradient(120deg,#0b1c2a,#153c49);color:var(--white);border-radius:30px;padding:44px 0 52px;margin-top:6px}
.back{display:inline-flex;align-items:center;min-height:44px;font-size:14px;font-weight:700;color:#c3d6db;transition:color .2s,transform .25s var(--ease)}.back:hover{color:var(--white);transform:translateX(-4px)}
.eyebrow{display:block;margin:18px 0 12px;font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
h1{font-size:clamp(34px,5vw,54px);line-height:1.1;margin-bottom:18px}.intro{font-size:18px;color:#c3d6db;margin:0;max-width:62ch}
.article{padding:48px 0 72px}
.steps{list-style:none;margin:0;padding:0;counter-reset:step;position:relative}
.steps:before{content:'';position:absolute;left:21px;top:22px;bottom:44px;width:2px;background:var(--border)}
.steps:after{content:'';position:absolute;left:21px;top:22px;bottom:44px;width:2px;background:linear-gradient(var(--teal),var(--teal-bright));transform:scaleY(var(--line,1));transform-origin:top}
.steps li{counter-increment:step;position:relative;padding:0 0 34px 68px}.steps li:before{content:counter(step);position:absolute;z-index:1;left:0;top:0;width:44px;height:44px;border-radius:50%;background:var(--navy);color:var(--white);display:grid;place-items:center;font:800 17px var(--display)}
.steps h2{font-size:24px;line-height:1.25;margin:7px 0 8px;color:var(--navy)}.steps p{margin:0;color:var(--muted);font-size:16px;max-width:62ch}
.motion-on .steps li{opacity:.2;transform:translateY(20px);transition:opacity .6s var(--ease),transform .6s var(--ease)}.motion-on .steps li:before{transform:scale(.7);transition:transform .5s var(--spring),background-color .4s}.motion-on .steps li.visible{opacity:1;transform:none}.motion-on .steps li.visible:before{transform:none;background:var(--teal)}
.note{background:var(--mint);border-left:5px solid var(--teal);border-radius:14px;padding:20px 24px;line-height:1.6;margin:8px 0 24px}
.sources{display:flex;flex-direction:column;align-items:flex-start;gap:8px;font-size:13px;color:var(--muted);padding:6px 0 4px}.sources a{color:#075e59;font-size:15px;font-weight:700;text-decoration:underline;text-underline-offset:3px}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:20px;margin-top:30px}.button{display:inline-flex;gap:9px;align-items:center;border-radius:99px;background:var(--teal);color:var(--white);padding:14px 23px;font-weight:700;font-size:14px;transition:transform .22s var(--ease),box-shadow .22s}.button:hover{transform:translateY(-2px);box-shadow:0 12px 22px #087d7640}.text-link{color:#075e59;font-weight:700;font-size:15px;text-decoration:underline;text-underline-offset:3px}
footer{border-top:1px solid var(--border);padding:30px 0 44px;color:var(--muted);font-size:12px;line-height:1.6}.footrow{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-bottom:10px;color:var(--ink)}.footrow a{text-decoration:underline;text-underline-offset:3px}
.motion-on .back,.motion-on .eyebrow,.motion-on h1,.motion-on .intro{animation:rise .7s var(--ease) both}.motion-on .eyebrow{animation-delay:.06s}.motion-on h1{animation-delay:.12s}.motion-on .intro{animation-delay:.22s}@keyframes rise{from{opacity:0;transform:translateY(16px)}}
@media(max-width:980px){.navlinks{position:absolute;top:100%;left:0;right:0;flex-direction:column;gap:0;background:var(--cream);padding:6px 21px 14px;box-shadow:0 14px 22px #10253818;visibility:hidden;opacity:0;transform:translateY(-8px);transition:opacity .2s,transform .25s var(--ease),visibility .25s}.navlinks.open{visibility:visible;opacity:1;transform:none}.navlinks a{padding:13px 4px;font-size:16px;border-bottom:1px solid var(--border);border-radius:0}.menu-btn{display:block}}
@media(max-width:700px){.container{width:calc(100% - 32px)}.wrap{width:calc(100% - 40px)}.brand-logo{width:150px}.stuck .brand-logo{width:124px}.guide-hero{border-radius:20px;padding:24px 0 38px}.intro{font-size:16px}.article{padding:36px 0 52px}.steps li{padding:0 0 28px 56px}.steps li:before{width:38px;height:38px;font-size:15px}.steps:before,.steps:after{left:18px}.steps h2{font-size:21px;margin-top:4px}.steps p{font-size:15px}.button{width:100%;justify-content:center}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}
.steps li:last-child:after{content:'';position:absolute;z-index:1;left:0;top:44px;bottom:-60px;width:44px;background:var(--cream)}
