/* ==========================================================================
   The AI Product Manager Blueprint — design system
   Royal blue + yellow from the book cover. Barlow Condensed display type,
   DM Sans body. One coherent set of tokens, components, and layouts.
   ========================================================================== */
:root{
 --blue:#0f2d8f;--blue-2:#1c44c6;--hero:#052f9a;--deep:#08206b;--navy:#071540;--ink:#0d1730;
 --yellow:#ffcf08;--yellow-2:#ffdc4a;--yellow-d:#d9ad00;
 --paper:#fafbf9;--soft:#f2f4f9;--soft-2:#e8ecf6;--white:#fff;
 --muted:#5b6780;--muted-2:#8a95ab;--line:#dfe4ee;--line-2:#c9d2e3;
 --display:'Barlow Condensed','Arial Narrow',Impact,sans-serif;--body:'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
 --r:12px;--r-lg:18px;--shadow:0 18px 40px rgba(7,21,64,.12);--shadow-lg:0 30px 70px rgba(7,21,64,.22);
 --ease:cubic-bezier(.2,.75,.25,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:104px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.65 var(--body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
button,input,select,textarea{font:inherit}
button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}
button,a{touch-action:manipulation}
button{cursor:pointer;border:0;background:none;color:inherit;padding:0}
button:disabled{cursor:not-allowed}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block;height:auto}
svg{display:block}
.icon{width:22px;height:22px;flex-shrink:0}
h1,h2,h3,h4,p{margin:0}
h1,h2{font-family:var(--display);font-weight:700;text-transform:uppercase;line-height:.94;letter-spacing:-.01em}
h1{font-size:clamp(58px,7.2vw,108px);font-weight:800}
h2{font-size:clamp(40px,4.4vw,64px)}
h3{font-size:22px;line-height:1.25;letter-spacing:-.02em;font-weight:700}
p{margin:18px 0;color:var(--muted)}
em{font-style:normal;color:var(--blue)}
.hl{color:var(--blue)}
strong{font-weight:700}
::selection{background:var(--yellow);color:var(--deep)}
[hidden]{display:none!important}
a,button,input,textarea,select,summary{outline-offset:4px}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid var(--yellow-d);border-radius:4px}

/* ---------- layout primitives ---------- */
.container{width:min(1240px,calc(100% - 96px));margin:0 auto}
.narrow{max-width:800px}
.constrained{max-width:700px}
.section{padding:clamp(72px,9vw,124px) 0}
.soft-section{background:var(--soft)}
.section-heading{max-width:760px}
.section-heading p{max-width:600px;font-size:17px}
.section-top{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:52px}
.section-top .text-link{flex-shrink:0;margin-bottom:6px}
.split-heading{display:grid;grid-template-columns:1.05fr 1fr;gap:80px;align-items:start}
.split-heading h2{font-size:clamp(36px,3.9vw,56px)}
.two-col{display:grid;grid-template-columns:1.2fr 1fr;gap:90px;align-items:center}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.small{font-size:13px}
.muted{color:var(--muted)}
.lead{font-size:21px;line-height:1.55;color:var(--ink)}
.large-copy{font-size:23px;line-height:1.45;color:var(--ink);font-weight:500;letter-spacing:-.01em}
.skip{position:fixed;left:20px;top:-100px;background:var(--yellow);color:var(--deep);padding:12px 20px;z-index:1000;font-weight:700;border-radius:8px}
.skip:focus{top:15px}
.link-row{display:flex;flex-wrap:wrap;gap:8px 28px}

/* ---------- eyebrow, tags, chips ---------- */
.eyebrow{display:flex;align-items:center;gap:10px;font-size:11px;font-weight:700;letter-spacing:.18em;line-height:1.5;margin-bottom:22px;text-transform:uppercase;color:var(--blue)}
.eyebrow>span{height:8px;width:8px;background:var(--yellow);display:inline-block;flex-shrink:0;border-radius:2px;box-shadow:0 0 0 3px rgba(255,207,8,.22)}
.eyebrow.light{color:#dbe4ff}
.tag{display:inline-block;background:#e9eef9;color:var(--blue);padding:6px 10px;border-radius:6px;font-size:10px;font-weight:700;letter-spacing:.1em;line-height:1.4;text-transform:uppercase}
.chip{display:inline-flex;flex-direction:column;gap:2px;padding:12px 16px;border:1px solid rgba(255,255,255,.14);border-radius:10px;font-size:13px;color:#c9d4f6;background:rgba(255,255,255,.04);transition:border-color .2s,background .2s,transform .2s}
.chip b{color:#fff;font-size:13px}
a.chip:hover{border-color:rgba(255,255,255,.4);background:rgba(255,255,255,.08);transform:translateY(-2px)}

/* ---------- buttons & links ---------- */
.button{min-height:56px;padding:16px 26px;display:inline-flex;align-items:center;justify-content:center;gap:14px;border:1px solid transparent;border-radius:10px;background:var(--yellow);color:var(--deep);font-size:15px;font-weight:700;line-height:1.3;transition:transform .25s var(--ease),box-shadow .25s var(--ease),background .25s;box-shadow:0 8px 20px -6px rgba(255,207,8,.55);white-space:nowrap}
.button .icon{width:18px;height:18px;transition:transform .25s var(--ease)}
.button:hover{transform:translateY(-3px);box-shadow:0 16px 30px -8px rgba(255,207,8,.7);background:var(--yellow-2)}
.button:hover .icon{transform:translateX(3px)}
.button.blue{background:var(--blue);color:#fff;box-shadow:0 10px 24px -8px rgba(15,45,143,.6)}
.button.blue:hover{background:var(--blue-2);box-shadow:0 18px 34px -10px rgba(15,45,143,.7)}
.button.outline{background:transparent;border-color:var(--line-2);color:var(--blue);box-shadow:none}
.button.outline:hover{border-color:var(--blue);background:#fff;box-shadow:var(--shadow)}
.button.outline-light{color:#fff;border-color:rgba(255,255,255,.35);background:rgba(255,255,255,.06);box-shadow:none;backdrop-filter:blur(6px)}
.button.outline-light:hover{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.6);box-shadow:none}
.button.small{min-height:44px;font-size:13px;gap:10px;padding:10px 16px;border-radius:8px}
.button.text-button{background:transparent;box-shadow:none;color:var(--blue)}
.button.text-button:hover{background:var(--soft);transform:none}
.button-row{display:flex;flex-wrap:wrap;align-items:center;gap:24px;margin:28px 0}
.text-link{display:inline-flex;align-items:center;gap:10px;font-size:14px;line-height:1.5;font-weight:700;color:var(--blue);padding:4px 0;border:0;background:none}
.text-link .icon{width:18px;height:18px;transition:transform .2s}
.text-link:hover .icon{transform:translateX(4px)}
.text-link:hover{text-decoration:underline;text-underline-offset:5px}
.text-link.light{color:var(--yellow)}

/* ---------- header ---------- */
.header{height:84px;position:sticky;top:0;z-index:100;background:rgba(250,251,249,.86);border-bottom:1px solid var(--line);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px)}
.header-inner{max-width:1440px;width:calc(100% - 64px);height:100%;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:22px}
.brand{display:flex;align-items:center;gap:11px;flex-shrink:0;color:var(--blue)}
.brand-mark{width:42px;height:42px;background:transparent;padding:0;display:inline-flex;border-radius:9px;overflow:hidden;box-shadow:0 6px 14px -6px rgba(15,45,143,.7)}
.brand-mark img{display:block;width:100%;height:100%;object-fit:cover}
.brand-name{font-size:8px;font-weight:700;letter-spacing:.14em;line-height:1.4;color:var(--ink)}
.brand-name strong{display:block;font:700 27px/1 var(--display);letter-spacing:.02em;color:var(--blue)}
.brand-dot{color:var(--yellow-d)}
.desktop-nav{display:flex;gap:28px;align-items:center;margin-left:auto}
.desktop-nav>a{font-size:14px;font-weight:500;position:relative;padding:12px 0;color:var(--ink)}
.desktop-nav>a:hover,.desktop-nav>a[aria-current]{color:var(--blue)}
.desktop-nav>a[aria-current]:after{content:'';position:absolute;bottom:4px;left:0;width:100%;height:2px;background:var(--yellow);border-radius:2px}
.nav-ctas{display:flex;align-items:center;gap:22px;margin-left:18px}
.nav-buy{display:flex;gap:6px;align-items:center;font-size:13px;font-weight:700;color:var(--blue)}
.nav-buy .icon{width:15px;height:15px}
.menu-toggle{display:none}

/* ---------- hero ---------- */
.hero{position:relative;background:var(--hero);color:#fff;overflow:hidden;isolation:isolate}
.hero-bg{position:absolute;inset:0;z-index:-1}
.hero-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px);background-size:72px 72px;mask-image:linear-gradient(180deg,#000 30%,transparent 95%);-webkit-mask-image:linear-gradient(180deg,#000 30%,transparent 95%)}
.hero-glow{position:absolute;inset:0;background:radial-gradient(60% 55% at 78% 30%,rgba(50,100,255,.55),transparent 70%),radial-gradient(45% 45% at 10% 100%,rgba(255,207,8,.16),transparent 65%)}
.hero-inner{min-height:740px;display:grid;grid-template-columns:1.06fr .94fr;gap:40px;align-items:end;position:relative}
.hero-copy{padding:88px 0 96px;position:relative;z-index:3}
.hero-badge{display:inline-flex;align-items:center;gap:10px;padding:9px 16px 9px 12px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.08);border-radius:999px;font-size:11px;font-weight:700;letter-spacing:.14em;color:#e5ecff;margin-bottom:34px;backdrop-filter:blur(8px)}
.hero-badge .icon{width:15px;height:15px;color:var(--yellow);fill:var(--yellow)}
.hero h1{font-size:clamp(70px,7.6vw,116px);line-height:.9;letter-spacing:-.012em}
.hero h1 .hl{color:var(--yellow);text-shadow:0 12px 40px rgba(255,207,8,.25)}
.hero-subtitle{font-size:17px;line-height:1.7;margin:32px 0 36px;color:#d6dffb;max-width:560px}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap}
.hero-proof{list-style:none;padding:0;margin:44px 0 0;display:flex;gap:14px 0;flex-wrap:wrap;color:#c7d3fb;font-size:13px}
.hero-proof li{display:flex;align-items:baseline;gap:8px;padding:0 26px 0 0;margin-right:26px;border-right:1px solid rgba(255,255,255,.2)}
.hero-proof li:last-child{border:0;margin:0;padding:0}
.hero-proof b{font:700 30px/1 var(--display);color:#fff}
.hero-showcase{position:relative;align-self:stretch;display:flex;align-items:flex-end;justify-content:center;padding-top:60px;min-height:640px;perspective:1400px}
.hero-stage{position:absolute;inset:0;pointer-events:none}
.hero-halo{position:absolute;left:50%;bottom:-6%;width:88%;aspect-ratio:1;transform:translateX(-50%);border-radius:50%;background:radial-gradient(circle,rgba(70,120,255,.55) 0%,rgba(28,68,198,.28) 40%,transparent 70%);filter:blur(6px)}
.hero-ring{position:absolute;left:50%;bottom:4%;width:78%;aspect-ratio:1;transform:translateX(-50%);border-radius:50%;border:1px solid rgba(255,255,255,.14);animation:ring-spin 40s linear infinite}
.hero-ring:before{content:'';position:absolute;top:-6px;left:50%;width:12px;height:12px;border-radius:50%;background:var(--yellow);box-shadow:0 0 0 6px rgba(255,207,8,.2)}
.hero-ring-2{width:100%;bottom:-8%;border-color:rgba(255,207,8,.18);animation-duration:64s;animation-direction:reverse}
.hero-ring-2:before{width:8px;height:8px;background:#9fb6ff;box-shadow:0 0 0 5px rgba(159,182,255,.18)}
@keyframes ring-spin{to{transform:translateX(-50%) rotate(360deg)}}
.hero-author-photo{display:block;width:100%;max-width:520px;height:auto;max-height:740px;object-fit:contain;object-position:center bottom;position:relative;z-index:1;mask-image:linear-gradient(to bottom,#000 90%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,#000 90%,transparent 100%);transform:rotateY(var(--ry,0deg)) rotateX(var(--rx,0deg));transition:transform .6s var(--ease);transform-style:preserve-3d}
.float-card{position:absolute;z-index:4;display:flex;flex-direction:column;gap:4px;padding:16px 20px;border-radius:14px;background:#fff;color:var(--deep);box-shadow:var(--shadow-lg);animation:floaty 6s ease-in-out infinite}
.float-card b{font:800 40px/1 var(--display);letter-spacing:-.01em}
.float-card span{font-size:11px;line-height:1.35;font-weight:600;color:var(--muted);letter-spacing:.02em}
.float-a{top:24%;left:-2%;background:var(--yellow);animation-delay:-2s}
.float-a span{color:var(--deep)}
.float-b{bottom:26%;right:-3%}
.hero-author-chip{position:absolute;right:0;top:72px;z-index:4;display:flex;align-items:center;gap:12px;padding:8px 16px 8px 8px;border-radius:999px;background:rgba(7,21,64,.6);border:1px solid rgba(255,255,255,.14);backdrop-filter:blur(12px);font-size:11px;color:#c7d3fb;line-height:1.4}
.hero-author-chip img{width:38px;height:38px;border-radius:50%;object-fit:cover;object-position:50% 12%;border:2px solid rgba(255,255,255,.35);background:#c9d4f6}
.hero-author-chip strong{display:block;color:#fff;font-size:13px}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}

/* ---------- marquee ---------- */
.marquee{position:relative;z-index:3;background:var(--yellow);color:var(--deep);overflow:hidden;height:56px;display:flex;align-items:center;border-top:1px solid rgba(0,0,0,.08)}
.marquee-track{display:flex;gap:0;white-space:nowrap;animation:marquee 34s linear infinite;will-change:transform}
.marquee-track span{font:700 19px/1 var(--display);letter-spacing:.08em;padding:0 30px;display:flex;align-items:center;gap:30px}
.marquee-track span:after{content:'';width:8px;height:8px;border-radius:50%;background:var(--deep);opacity:.55}
@keyframes marquee{to{transform:translateX(-50%)}}

/* ---------- why this book ---------- */
.why-section{--why-blue:#2463f5;--why-blue-d:#1747c9;--why-ink:#0a173e;--why-muted:#5b6d91;--why-line:#dbe5f7;--why-script:'Bradley Hand','Segoe Script','Brush Script MT','Snell Roundhand',cursive;position:relative;overflow:hidden;padding:104px 0 96px;background:linear-gradient(180deg,#fbfcff,#f6f9ff);border-bottom:1px solid var(--line)}
.why-bg{position:absolute;inset:0;pointer-events:none}
.why-orb{position:absolute;border-radius:50%;background:radial-gradient(circle at 40% 40%,#e6eeff,#eff4ff 60%,#f6f9ff00 72%);opacity:.9}
.why-orb-a{width:360px;height:360px;top:110px;left:-60px}
.why-orb-b{width:520px;height:520px;right:-180px;bottom:-140px;opacity:.75}
.why-waves{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:#dde6f8;stroke-width:1.5}
.why-waves path{vector-effect:non-scaling-stroke}
.why-section>.container{position:relative;width:min(1240px,calc(100% - 72px))}
.why-head{text-align:center;margin:0 auto 40px}
.why-head .eyebrow{justify-content:center;letter-spacing:.24em;font-size:11px;color:var(--why-blue);margin-bottom:22px}
.why-head .eyebrow span{width:26px;height:2px;border-radius:2px;background:var(--why-blue);box-shadow:none}
.why-head h2{font:700 clamp(46px,5.4vw,82px)/1.06 var(--body);letter-spacing:-.05em;text-transform:none;color:var(--why-ink)}
.why-head h2>span{display:block}
.why-head h2 em{color:var(--why-blue);font-style:normal;background:linear-gradient(90deg,var(--why-blue) 0 35%,#6b9bff 50%,var(--why-blue) 65% 100%);background-size:280% 100%;background-position:100% 0;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.why-head p{font-size:clamp(17px,1.5vw,21px);line-height:1.55;color:var(--why-muted);margin:18px auto 0;max-width:760px}
.why-chart{position:relative;margin:0 auto;padding:34px 40px 26px;border:1px solid #e4ebfa;border-radius:26px;background:linear-gradient(170deg,#fff 0%,#fcfdff 55%,#f7faff 100%);box-shadow:0 46px 100px -40px #1e3f9a3d,0 16px 38px -24px #1e3f9a24,0 0 0 1px #fff inset}
.why-chart-top{display:flex;justify-content:space-between;align-items:flex-start;gap:28px}
.why-kicker{display:block;font-size:11px;font-weight:700;letter-spacing:.16em;color:#8c9ab7;margin-bottom:12px}
.why-chart-top h3{font:700 clamp(22px,2.2vw,31px)/1.2 var(--body);letter-spacing:-.04em;color:var(--why-ink)}
.why-chart-sub{font-size:clamp(14px,1.2vw,16.5px);line-height:1.5;color:#8b98b3;margin:10px 0 0;max-width:560px}
.why-big{flex-shrink:0;display:flex;align-items:center;gap:15px;padding:15px 22px;border:1px solid #dbe6fb;border-radius:18px;background:linear-gradient(145deg,#eef4ff,#f6f9ff);box-shadow:0 1px 0 #fff inset}
.why-big-icon{display:grid;place-items:center;width:38px;height:38px;flex-shrink:0;color:var(--why-blue)}
.why-big-icon .icon{width:30px;height:30px;stroke-width:2.2}
.why-big strong{display:block;font:700 clamp(30px,3.1vw,40px)/1 var(--body);letter-spacing:-.055em;color:var(--why-blue);font-variant-numeric:tabular-nums}
.why-big small{display:block;font-size:12px;margin-top:7px;color:#8b98b3}
.why-chart-body{margin:52px 0 0 60px}
.why-plot{position:relative;height:320px;border-left:1px solid #e3eaf7}
.why-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.why-line{fill:none;stroke:url(#why-line-fill);stroke-width:3.2;stroke-linecap:round;vector-effect:non-scaling-stroke}
.why-line-glow{fill:none;stroke:#4a86ff;stroke-width:15;stroke-linecap:round;vector-effect:non-scaling-stroke;opacity:.1;filter:blur(7px)}
.why-gl{position:absolute;left:0;right:0;top:var(--y);border-top:1px dashed var(--why-line);transform-origin:left}
.why-gl i{position:absolute;right:calc(100% + 18px);top:0;transform:translateY(-50%);font:500 12.5px/1 var(--body);font-style:normal;color:#8b98b3;white-space:nowrap}
.why-gl-base{border-top-style:solid;border-top-color:#d3deef}
.why-guide{position:absolute;left:var(--x);top:var(--y);bottom:0;border-left:1px dashed #d8e3f8;transform-origin:bottom}
.why-node{position:absolute;z-index:3;left:var(--x);top:var(--y);width:17px;height:17px;margin:-8.5px 0 0 -8.5px;border:3.5px solid var(--why-blue);border-radius:50%;background:#fff;box-shadow:0 0 0 5px #fff,0 0 0 6px #dbe6fb,0 5px 14px #2463f533}
.why-node-start{width:15px;height:15px;margin:-7.5px 0 0 -7.5px;border-width:3px;border-color:#7fa4ee}
.why-node-peak{width:19px;height:19px;margin:-9.5px 0 0 -9.5px;box-shadow:0 0 0 6px #fff,0 0 0 7px #cfdffb,0 8px 20px #2463f54d}
.why-node-peak:before{content:'';position:absolute;inset:-5px;border-radius:50%;background:var(--why-blue);opacity:0}
.why-node-peak:after{content:'';position:absolute;inset:-13px;border:1.5px solid var(--why-blue);border-radius:50%;opacity:0}
.why-comet{position:absolute;z-index:2;left:0;top:0;will-change:transform,opacity;width:9px;height:9px;margin:-4.5px 0 0 -4.5px;border-radius:50%;background:#fff;box-shadow:0 0 0 3px var(--why-blue),0 0 18px 6px #2463f580;pointer-events:none}
.why-comet[hidden]{display:none}
.why-val{position:absolute;z-index:3;left:var(--x);top:var(--y);transform:translate(-50%,calc(-100% - 20px));white-space:nowrap;font:700 clamp(14px,1.4vw,18px)/1 var(--body);letter-spacing:-.03em;color:var(--why-ink);font-variant-numeric:tabular-nums}
.why-val-start{padding:8px 14px;border-radius:999px;background:#e3edff;color:var(--why-blue);font-size:12.5px;font-weight:700;transform:translate(-40%,calc(-100% - 14px));box-shadow:0 6px 16px -10px #2463f580}
.why-val-peak{padding:10px 18px;border-radius:999px;background:linear-gradient(135deg,#4a86ff,#2160ee 55%,#1747c9);color:#fff;font-size:clamp(15px,1.6vw,20px);letter-spacing:-.035em;transform:translate(-50%,calc(-100% - 22px));box-shadow:0 16px 30px -12px #1d55e6b3,0 1px 0 #ffffff55 inset}
.why-annot{position:absolute;z-index:4;left:var(--x);top:var(--y);transform:translate(-100%,-100%);margin:-16px 0 0 -96px;display:flex;align-items:flex-end;gap:10px;color:var(--why-blue);pointer-events:none}
.why-annot-text{font:400 clamp(18px,1.9vw,25px)/1.2 var(--why-script);font-style:italic;text-align:right;letter-spacing:.01em;white-space:nowrap;padding-bottom:12px;transform:rotate(-4deg);transform-origin:100% 100%}
.why-annot-arrow{flex-shrink:0;width:clamp(66px,7.4vw,104px);height:auto}
.why-stages{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:20px 0 0;padding:0;list-style:none}
.why-stages li{position:relative;text-align:center;display:flex;flex-direction:column;gap:5px;padding:2px 8px}
.why-stages li+li:before{content:'';position:absolute;left:0;top:6%;height:78%;border-left:1px solid #e8eef9}
.why-stages strong{font:700 12.5px/1.2 var(--body);text-transform:uppercase;letter-spacing:.05em;color:var(--why-ink)}
.why-stages span{font-size:12px;color:var(--why-muted)}
.why-stages em{font-size:12px;font-style:normal;font-weight:700;color:var(--why-blue);margin-top:2px}
.why-chart figcaption{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:26px;padding:20px 0 4px;border-top:1px solid #edf2fb}
.why-disclaimer{display:flex;align-items:center;gap:10px;font-size:12px;line-height:1.5;color:#93a0ba}
.why-disclaimer i{display:grid;place-items:center;width:24px;height:24px;flex-shrink:0;border:1px solid #dfe7f5;border-radius:50%;color:#a6b2c9}
.why-disclaimer .icon{width:14px;height:14px}
.why-more{flex-shrink:0;display:inline-flex;align-items:center;gap:9px;padding:13px 24px 13px 22px;border-radius:999px;background:linear-gradient(135deg,#4a86ff,#2160ee 55%,#1747c9);color:#fff;font:700 14px/1 var(--body);letter-spacing:-.01em;white-space:nowrap;box-shadow:0 16px 30px -12px #1d55e6b3,0 1px 0 #ffffff55 inset;transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.why-more:hover{transform:translateY(-2px);box-shadow:0 22px 38px -14px #1d55e6cc,0 1px 0 #ffffff55 inset}
.why-more .icon{width:16px;height:16px;transition:transform .3s var(--ease)}
.why-more:hover .icon{transform:translateX(4px)}
.why-benefits-head{text-align:center;margin:58px 0 26px}
.why-benefits-head h3{font:700 clamp(26px,2.6vw,34px)/1.15 var(--body);letter-spacing:-.04em;color:var(--why-ink)}
.why-benefits-head p{font-size:clamp(15px,1.2vw,17px);margin:8px 0 0;color:var(--why-muted)}
.why-flow{display:flex;justify-content:center;align-items:stretch;flex-wrap:nowrap;margin:0 auto;padding:0;list-style:none;max-width:1180px}
.why-step{position:relative;flex:1 1 0;min-width:0;display:flex;align-items:center;justify-content:center;gap:10px;padding:10px 12px;font:700 clamp(13px,1.15vw,15.5px)/1.25 var(--body);letter-spacing:-.02em;color:var(--why-ink);transition:color .3s}
.why-step+.why-step:before{content:'';position:absolute;left:0;top:12%;height:76%;border-left:1px solid #dde5f4}
.why-step-icon{display:grid;place-items:center;width:34px;height:34px;flex-shrink:0;border-radius:11px;background:#eaf1ff;color:var(--why-blue);transition:transform .4s var(--ease),background .3s,color .3s}
.why-step-icon .icon{width:19px;height:19px}
.why-step span{min-width:0}
.why-step-arrow{display:grid;place-items:center;flex-shrink:0;color:var(--why-blue);transition:transform .35s var(--ease)}
.why-step-arrow .icon{width:18px;height:18px}
.why-step:hover{color:var(--why-blue)}
.why-step:hover .why-step-icon{transform:translateY(-3px) scale(1.06);background:linear-gradient(145deg,#2f6bff,#1747c9);color:#fff}
.why-step:hover .why-step-arrow{transform:translateX(4px)}
.why-actions{display:flex;flex-direction:column;align-items:center;gap:18px;margin-top:38px}
.why-buttons{display:flex;justify-content:center;align-items:center;gap:20px}
.why-note{font-size:13.5px;color:#8291ae;margin:0}
.why-actions .button{min-height:58px;padding:17px 30px;border-radius:14px;font-size:15.5px;gap:12px}
.why-actions .button .icon{width:19px;height:19px}
.why-actions .button.blue{position:relative;overflow:hidden;background:linear-gradient(135deg,#3b7bff,#1d55e6 55%,#1445c4);box-shadow:0 18px 34px -14px #1d55e6b3,0 0 0 1px #1d55e6 inset}
.why-actions .button.blue:after{content:'';position:absolute;top:-40%;bottom:-40%;left:-30%;width:40%;background:linear-gradient(105deg,transparent 0,#ffffff3d 45%,#ffffff66 50%,#ffffff3d 55%,transparent 100%);transform:translateX(-160%) skewX(-18deg);transition:transform .9s var(--ease)}
.why-actions .button.blue:hover{transform:translateY(-3px);background:linear-gradient(135deg,#4a86ff,#2560f0 55%,#1a4ed4);box-shadow:0 26px 44px -16px #1d55e6cc,0 0 0 1px #1d55e6 inset}
.why-actions .button.blue:hover:after{transform:translateX(420%) skewX(-18deg)}
.why-actions .button.blue .icon{transition:transform .4s var(--ease)}
.why-actions .button.blue:hover .icon{transform:translate(3px,-3px)}
.why-actions .button.outline{border-color:#d6e0f3;color:var(--why-ink);background:#fff;box-shadow:0 10px 24px -20px #1e3f9a66}
.why-actions .button.outline:hover{border-color:var(--why-blue);color:var(--why-blue);background:#fff;box-shadow:0 18px 36px -20px #1e3f9a66;transform:translateY(-3px)}
.why-actions .button.outline .icon{transition:transform .4s var(--ease)}
.why-actions .button.outline:hover .icon{transform:translateX(5px)}
@keyframes whyUp{from{opacity:0;translate:0 26px}}
@keyframes whyFade{from{opacity:0;translate:0 8px}}
@keyframes whyCard{from{opacity:0;translate:0 32px;scale:.97}}
@keyframes whyShine{to{background-position:0 0}}
@keyframes whyDraw{from{clip-path:inset(-20% 100% -20% 0)}to{clip-path:inset(-20% 0 -20% 0)}}
@keyframes whyStroke{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes whyPop{from{opacity:0;scale:.3}to{opacity:1;scale:1}}
@keyframes whyGrow{from{opacity:0;scale:1 0}}
@keyframes whyRule{from{opacity:0;scale:0 1}}
@keyframes whyHitNode{0%{scale:1}38%{scale:1.24}100%{scale:1}}
@keyframes whyHitRing{0%{opacity:.55;scale:.6}100%{opacity:0;scale:2.3}}
@keyframes whyHitPill{0%{translate:0 0}38%{translate:0 -5px}100%{translate:0 0}}
@keyframes whyHitGlow{0%,100%{box-shadow:0 16px 30px -12px #1d55e6b3,0 0 0 0 #2463f500,0 1px 0 #ffffff55 inset}30%{box-shadow:0 24px 42px -12px #1d55e6e6,0 0 0 6px #2463f526,0 1px 0 #ffffff55 inset}}
@keyframes whyShadow{from{box-shadow:0 10px 30px -20px #1e3f9a26}}
@keyframes whyStep{from{opacity:0;translate:-14px 0}}
@keyframes whyArrow{from{opacity:0;translate:-8px 0}}
@keyframes whyPeakPop{0%{opacity:0;scale:.35;translate:0 16px}55%{opacity:1;scale:1.16;translate:0 -4px}80%{scale:.97}100%{opacity:1;scale:1;translate:0 0}}
@keyframes whyChip{0%{opacity:0;scale:.5}60%{opacity:1;scale:1.1}100%{opacity:1;scale:1}}
@keyframes whyBurst{from{opacity:.5;scale:.5}to{opacity:0;scale:3.2}}
@keyframes whyBump{0%{scale:1}45%{scale:1.13}100%{scale:1}}
@keyframes whyWrite{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 -8% 0 0)}}
@media(prefers-reduced-motion:no-preference){
 .why-armed :is(.why-head,.why-chart,.why-benefits-head,.why-step,.why-actions):not(.why-in){opacity:0}
 .why-armed .why-head.why-in{animation:whyUp .9s var(--ease) backwards}
 .why-armed .why-head.why-in .eyebrow{animation:whyFade .7s var(--ease) .05s backwards}
 .why-armed .why-head.why-in h2>span{animation:whyUp .9s var(--ease) backwards}
 .why-armed .why-head.why-in .why-line-1{animation-delay:.12s}
 .why-armed .why-head.why-in .why-line-2{animation-delay:.24s}
 .why-armed .why-head.why-in h2 em{animation:whyShine 1.6s var(--ease) .9s forwards}
 .why-armed .why-head.why-in p{animation:whyFade .8s var(--ease) .42s backwards}
 .why-armed .why-chart.why-in{animation:whyCard .95s var(--ease) backwards,whyShadow 1.6s var(--ease) backwards}
 .why-armed .why-chart.why-in .why-chart-intro{animation:whyFade .7s var(--ease) .18s backwards}
 .why-armed .why-chart.why-in .why-big{animation:whyPop .8s cubic-bezier(.34,1.4,.64,1) .3s backwards}
 .why-armed .why-chart.why-in figcaption{animation:whyFade .7s var(--ease) .5s backwards}
 .why-armed .why-chart.why-in .why-gl{animation:whyRule .9s var(--ease) calc(.25s + var(--g,0) * 55ms) backwards}
 .why-armed .why-chart.why-in .why-line{stroke-dasharray:1;animation:whyStroke 2s cubic-bezier(.4,.1,.2,1) .5s backwards}
 .why-armed .why-chart.why-in .why-line-glow{stroke-dasharray:1;animation:whyStroke 2s cubic-bezier(.4,.1,.2,1) .5s backwards}
 .why-armed .why-chart.why-in .why-area{animation:whyDraw 2.1s cubic-bezier(.4,.1,.2,1) .5s backwards}
 .why-armed .why-chart.why-in .why-node{animation:whyPop .55s cubic-bezier(.34,1.56,.64,1) var(--d) backwards}
 .why-armed .why-chart.why-in .why-guide{animation:whyGrow .6s var(--ease) var(--d) backwards}
 .why-armed .why-chart.why-in :is(.why-val,.why-stages li){animation:whyFade .6s var(--ease) var(--d) backwards}
 .why-armed .why-chart.why-in b.why-val-start{animation:whyChip .7s cubic-bezier(.34,1.5,.64,1) var(--d) backwards}
 .why-armed .why-chart.why-in b.why-val-peak{animation:whyPeakPop .9s cubic-bezier(.34,1.56,.64,1) calc(var(--d) + .08s) backwards}
 .why-armed .why-chart.why-in .why-node-peak{animation:whyPop .7s cubic-bezier(.34,1.8,.64,1) var(--d) backwards}
 .why-armed .why-chart.why-in .why-node-peak:before{animation:whyBurst 1.1s ease-out calc(var(--d) + .12s) backwards}
 .why-armed .why-chart.why-in .why-big strong{animation:whyBump .75s cubic-bezier(.34,1.56,.64,1) 2.3s}
 .why-armed .why-chart.why-in .why-annot-text{animation:whyWrite 1s cubic-bezier(.4,.1,.2,1) 2.5s backwards}
 .why-armed .why-chart.why-in .why-annot-path{stroke-dasharray:1;animation:whyStroke .8s ease-out 3.1s backwards}
 .why-armed .why-chart.why-in .why-annot-tip{animation:whyFade .4s var(--ease) 3.8s backwards}
 /* Once the entrance has played, pin it off. Otherwise removing .why-hit swaps the animation back
    to the delayed entrance, which restarts and holds the node and pill invisible for its delay. */
 .why-armed .why-chart.why-in.why-settled .why-node-peak,.why-armed .why-chart.why-in.why-settled b.why-val-peak{animation:none}
 /* Arrival pop: the travelling dot adds .why-hit as it lands on the senior node.
    Selectors outrank the entrance rules so the pop can replay on every loop. */
 .why-armed .why-chart.why-in .why-node-peak.why-hit{animation:whyHitNode .46s cubic-bezier(.25,.8,.3,1)}
 .why-armed .why-chart.why-in .why-node-peak.why-hit:after{animation:whyHitRing .62s cubic-bezier(.22,1,.36,1)}
 .why-armed .why-chart.why-in b.why-val-peak.why-hit{animation:whyHitPill .46s cubic-bezier(.25,.8,.3,1),whyHitGlow .55s cubic-bezier(.22,1,.36,1)}
 .why-armed .why-benefits-head.why-in{animation:whyUp .8s var(--ease) backwards}
 .why-armed .why-step.why-in{animation:whyStep .7s var(--ease) calc(var(--i,0) * 100ms) backwards}
 .why-armed .why-step.why-in .why-step-icon{animation:whyPop .65s cubic-bezier(.34,1.5,.64,1) calc(var(--i,0) * 100ms + .18s) backwards}
 .why-armed .why-step.why-in .why-step-arrow{animation:whyArrow .6s var(--ease) calc(var(--i,0) * 100ms + .28s) backwards}
 .why-armed .why-actions.why-in{animation:whyUp .8s var(--ease) .1s backwards}
}
@media(prefers-reduced-motion:no-preference){
 .why-node-peak.why-hit{animation:whyHitNode .46s cubic-bezier(.25,.8,.3,1)}
 .why-node-peak.why-hit:after{animation:whyHitRing .62s cubic-bezier(.22,1,.36,1)}
 b.why-val-peak.why-hit{animation:whyHitPill .46s cubic-bezier(.25,.8,.3,1),whyHitGlow .55s cubic-bezier(.22,1,.36,1)}
}
@media(max-width:1180px){
 .why-chart-sub{max-width:420px}
 .why-step{flex-direction:column;gap:7px;text-align:center;padding:10px 8px}
 .why-step-arrow{position:absolute;right:-9px;top:50%;translate:0 -50%}
 .why-step+.why-step:before{display:none}
}
@media(max-width:860px){
 .why-section{padding:82px 0 78px}
 .why-section>.container{width:calc(100% - 40px)}
 .why-head h2{font-size:clamp(40px,7vw,58px)}
 .why-chart{padding:28px 26px 20px;border-radius:22px}
 .why-chart-top{flex-direction:column;gap:18px}
 .why-big{align-self:stretch}
 .why-chart-sub{max-width:none}
 .why-chart-body{margin:44px 0 0 48px}
 .why-plot{height:280px}
 .why-annot{margin:-14px 0 0 -78px}
 .why-stages em{display:none}
 .why-benefits-head{margin:48px 0 22px}
 .why-flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;max-width:620px}
 .why-step{flex-direction:row;justify-content:flex-start;gap:11px;padding:12px 13px;border:1px solid #dfe7f6;border-radius:15px;background:#fff;text-align:left;font-size:14.5px;box-shadow:0 8px 20px -18px #1e3f9a4d}
 .why-step-arrow{display:none}
 .why-buttons{gap:14px}
}
@media(max-width:560px){
 .why-section>.container{width:calc(100% - 28px)}
 .why-orb-a{width:240px;height:240px;top:40px;left:-80px}
 .why-orb-b{width:320px;height:320px;right:-140px;bottom:-80px}
 .why-head{margin-bottom:30px}
 .why-head h2{font-size:clamp(36px,9vw,48px);line-height:1.08}
 .why-head .eyebrow{font-size:10px;margin-bottom:18px}
 .why-head p{font-size:16px;margin-top:16px}
 .why-chart{padding:22px 14px 16px;border-radius:18px}
 .why-chart-body{margin-top:50px}
 .why-kicker{font-size:9px;letter-spacing:.1em}
 .why-chart-top h3{font-size:20px}
 .why-chart-sub{font-size:13px;margin-top:8px}
 .why-big{padding:12px 15px;gap:12px;border-radius:15px}
 .why-big-icon{width:30px;height:30px}
 .why-big-icon .icon{width:24px;height:24px}
 .why-big strong{font-size:28px}
 .why-big small{font-size:10.5px;margin-top:5px}
 .why-chart-body{margin:40px 0 0 32px}
 .why-plot{height:230px}
 .why-gl i{font-size:9.5px;right:calc(100% + 8px)}
 .why-val{font-size:11.5px;transform:translate(-50%,calc(-100% - 14px))}
 .why-val-start{font-size:9.5px;padding:5px 9px;transform:translate(-32%,calc(-100% - 10px))}
 .why-val-peak{font-size:12px;padding:6px 11px;transform:translate(-50%,calc(-100% - 14px))}
 .why-node{width:13px;height:13px;margin:-6.5px 0 0 -6.5px;border-width:2.5px;box-shadow:0 0 0 4px #fff,0 0 0 5px #dbe6fb}
 .why-node-start{width:11px;height:11px;margin:-5.5px 0 0 -5.5px;border-width:2px}
 .why-node-peak{width:15px;height:15px;margin:-7.5px 0 0 -7.5px;box-shadow:0 0 0 4px #fff,0 0 0 5px #cfdffb}
 .why-annot{margin:-10px 0 0 -46px;gap:5px}
 .why-annot-text{font-size:13px;padding-bottom:7px;white-space:normal;max-width:96px}
 .why-annot-arrow{width:46px}
 .why-stages li{padding:2px 3px}
 .why-stages strong{font-size:9px;letter-spacing:.02em}
 .why-stages span{font-size:8.5px}
 .why-chart figcaption{flex-direction:column;align-items:flex-start;gap:14px;margin-top:20px;padding:16px 0 4px}
 .why-disclaimer{font-size:11px;gap:8px}
 .why-disclaimer i{width:21px;height:21px}
 .why-more{padding:12px 20px;font-size:13px}
 .why-benefits-head{margin:40px 0 18px}
 .why-benefits-head p{font-size:14px}
 .why-flow{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
 .why-step{font-size:13.5px;padding:11px;gap:10px;border-radius:14px}
 .why-step-icon{width:31px;height:31px;border-radius:10px}
 .why-step-icon .icon{width:17px;height:17px}
 .why-actions{margin-top:30px;gap:14px}
 .why-buttons{flex-direction:column;gap:12px;width:100%}
 .why-actions .button{width:100%;min-height:56px}
 .why-note{font-size:12.5px}
}
@media(prefers-reduced-motion:reduce){.why-comet{display:none}.why-head h2 em{background:none;-webkit-text-fill-color:currentColor;color:var(--why-blue)}}

/* ---------- salary section ---------- */
.salary-section{background:var(--navy);color:#fff;position:relative;overflow:hidden}
.salary-section:before{content:'';position:absolute;inset:0;background:radial-gradient(50% 60% at 100% 0%,rgba(28,68,198,.45),transparent 70%),linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:100% 100%,72px 72px,72px 72px;pointer-events:none}
.salary-section>.container{position:relative}
.salary-section .eyebrow{color:#c9d4f6}
.salary-section h2{color:#fff}
.salary-section h2 em{color:var(--yellow)}
.salary-section .section-heading p{color:#b9c6ee}
.salary-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.salary-tile{padding:30px 26px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.045);border-radius:var(--r-lg);display:flex;flex-direction:column;gap:6px;position:relative;overflow:hidden;transition:transform .3s var(--ease),border-color .3s}
.salary-tile:hover{transform:translateY(-4px);border-color:rgba(255,255,255,.3)}
.salary-tile b{font:800 clamp(48px,4.6vw,66px)/1 var(--display);color:var(--yellow);letter-spacing:-.01em}
.salary-tile strong{font-size:15px;color:#fff;margin-top:10px}
.salary-tile span{font-size:12px;color:#aab8e6}
.salary-tile.hot{background:var(--yellow);border-color:var(--yellow);color:var(--deep)}
.salary-tile.hot b{color:var(--deep)}
.salary-tile.hot strong{color:var(--deep)}
.salary-tile.hot span{color:#5c4a00}
.salary-chart-wrap{margin-top:36px;padding:clamp(24px,3.5vw,44px);border:1px solid rgba(255,255,255,.12);border-radius:var(--r-lg);background:rgba(255,255,255,.03);backdrop-filter:blur(4px)}
.salary-global{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:28px}
.salary-global-label{font-size:10px;letter-spacing:.16em;color:#aab8e6;font-weight:700;margin-right:8px}

/* ---------- roadmap ---------- */
.roadmap-section{--roadmap-blue:#1240b5;background:radial-gradient(ellipse at 50% 45%,#f8faff 0%,#f2f5fa 80%);padding:clamp(76px,7.18vw,120px) 0 clamp(90px,9.57vw,160px)}
.roadmap-section>.container{width:min(1474px,88%)}
.roadmap-heading .eyebrow{font-size:clamp(11px,.96vw,16px);letter-spacing:.15em;line-height:1.5;color:var(--roadmap-blue);gap:14px;margin-bottom:20px}
.roadmap-heading .eyebrow>span{width:15px;height:16px;border-radius:4px;box-shadow:none;background:#ffd326}
.roadmap-heading h2{font-size:clamp(62px,7.18vw,120px);font-weight:800;line-height:.9;letter-spacing:-.002em;color:#071331}
.roadmap-heading h2>span,.roadmap-heading h2>em{display:block}
.roadmap-heading h2>em{font-size:.88em;color:var(--roadmap-blue)}
.roadmap-summary{display:flex;justify-content:space-between;align-items:baseline;gap:30px;margin-top:19px}
.roadmap-summary p{font-size:clamp(17px,1.56vw,26px);line-height:1.5;color:#596987;margin:0;font-weight:500}
.roadmap-summary .text-link{font-size:clamp(14px,1.2vw,20px);color:var(--roadmap-blue);flex-shrink:0;gap:16px}
.roadmap-summary .text-link .icon{width:22px;height:22px}
.roadmap-section .roadmap-track{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) minmax(0,1.13fr) minmax(0,.97fr);gap:clamp(20px,2.03vw,34px);margin-top:75px;align-items:start}
.roadmap-section .roadmap-line{display:block;position:absolute;left:30px;right:30px;top:60px;height:1px;background:linear-gradient(90deg,var(--roadmap-blue),#edc724);z-index:0}
.roadmap-section .roadmap-step{position:relative;z-index:1;display:flex;flex-direction:column;min-width:0;min-height:276px;background:#fff;border:1px solid #d8e1ef;border-radius:20px;padding:29px clamp(20px,1.79vw,30px) 26px;transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.roadmap-section .roadmap-step:last-child{padding-right:12px}
/* Hover pop: selectors carry an extra class so they outrank the scroll-reveal transform/transition (.js-reveal .reveal-ready) defined later */
.roadmap-section .roadmap-track .roadmap-step{transition:opacity .45s var(--ease),transform .5s cubic-bezier(.34,1.56,.64,1),box-shadow .45s var(--ease),border-color .3s var(--ease)}
.roadmap-section .roadmap-step:before{content:'';position:absolute;left:24px;right:24px;top:-1px;height:4px;border-radius:0 0 4px 4px;background:linear-gradient(90deg,var(--roadmap-blue),#ffd326);transform:scaleX(0);transform-origin:left;transition:transform .55s var(--ease);pointer-events:none}
.roadmap-section .roadmap-step-featured:before{background:var(--roadmap-blue)}
.roadmap-section .roadmap-step:after{content:'';position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;background:linear-gradient(110deg,transparent 35%,rgba(18,64,181,.07) 50%,transparent 65%) no-repeat;background-size:260% 100%;background-position:140% 0;opacity:0;transition:background-position .9s var(--ease),opacity .3s}
.roadmap-section .roadmap-step-featured:after{background-image:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.5) 50%,transparent 65%)}
.roadmap-section .step-number{transition:box-shadow .4s var(--ease)}
.roadmap-section .chapter-label{transition:transform .4s cubic-bezier(.34,1.56,.64,1)}
@media(hover:hover) and (pointer:fine){
 .roadmap-section .roadmap-track .roadmap-step:hover{z-index:2;transform:translateY(-12px) scale(1.03);border-color:#b7c7ea;box-shadow:0 30px 60px -20px rgba(18,64,181,.38),0 12px 24px -14px rgba(7,21,64,.2)}
 .roadmap-section .roadmap-track .roadmap-step-featured:hover{border-color:#ffda32;box-shadow:0 34px 64px -20px rgba(217,173,0,.6),0 14px 26px -14px rgba(48,53,69,.28)}
 .roadmap-section .roadmap-track:has(.roadmap-step:hover) .roadmap-step:not(:hover){opacity:.72;transform:scale(.98)}
 .roadmap-section .roadmap-step:hover:before{transform:scaleX(1)}
 .roadmap-section .roadmap-step:hover:after{opacity:1;background-position:-40% 0}
 .roadmap-section .roadmap-step:hover .step-number{animation:roadmap-badge-pop .65s cubic-bezier(.34,1.56,.64,1);box-shadow:inset 0 1px 1px rgba(255,255,255,.2),0 12px 24px -8px rgba(18,64,181,.6)}
 .roadmap-section .roadmap-step:hover .chapter-label{transform:translateX(6px)}
}
@keyframes roadmap-badge-pop{0%{transform:scale(1) rotate(0)}35%{transform:scale(1.2) rotate(-8deg)}65%{transform:scale(.95) rotate(4deg)}100%{transform:scale(1) rotate(0)}}
.roadmap-section .step-number{display:flex;flex-shrink:0;width:64px;height:64px;align-items:center;justify-content:center;background:linear-gradient(135deg,#164ac6,#1137a5);color:#fff;border-radius:16px;font:700 36px/1 var(--display);margin-bottom:12px;box-shadow:inset 0 1px 1px rgba(255,255,255,.2)}
.roadmap-section .roadmap-step h3{font-family:var(--display);font-size:clamp(30px,2.64vw,44px);font-weight:800;line-height:1.05;letter-spacing:-.015em;color:#071331}
.roadmap-section .roadmap-step p{font-size:clamp(15px,1.2vw,20px);line-height:1.4;min-height:0;margin:10px 0 30px;color:#415476;white-space:nowrap}
.roadmap-section .chapter-label{margin-top:auto;font-size:clamp(13px,1.08vw,18px);line-height:1.5;font-weight:700;color:var(--roadmap-blue);letter-spacing:.045em;text-transform:uppercase}
.roadmap-section .roadmap-step-featured{margin-top:-20px;min-height:314px;background:linear-gradient(120deg,#ffcf08,#ffda21);border-color:#ffda32;box-shadow:0 22px 40px rgba(48,53,69,.13);padding-top:30px;padding-bottom:28px}
.roadmap-section .roadmap-step-featured .step-number{width:72px;height:72px;font-size:40px;margin-bottom:13px}
.roadmap-section .roadmap-step-featured h3{font-size:clamp(34px,3.11vw,52px)}
.roadmap-section .roadmap-step-featured p{color:#20395a}
@media(min-width:1101px) and (max-width:1400px){
 .roadmap-section .roadmap-step{min-height:252px;padding:24px 20px}
 .roadmap-section .roadmap-step-featured{min-height:292px}
 .roadmap-section .step-number{width:54px;height:54px;font-size:30px;border-radius:13px}
 .roadmap-section .roadmap-step-featured .step-number{width:62px;height:62px;font-size:34px}
 .roadmap-section .roadmap-step p{font-size:1.16vw}
}
@media(max-width:1100px){
 .roadmap-section .roadmap-track{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:44px;align-items:stretch}
 .roadmap-section .roadmap-line{display:none}
 .roadmap-summary{align-items:flex-start;flex-direction:column;gap:14px}
 .roadmap-section .roadmap-step{min-height:250px;padding:26px}
 .roadmap-section .roadmap-step-featured{margin-top:0;min-height:250px}
 .roadmap-section .roadmap-step p{white-space:normal;font-size:17px}
 .roadmap-section .roadmap-step h3{font-size:36px}
 .roadmap-section .roadmap-step-featured h3{font-size:42px}
 .roadmap-heading h2{font-size:7.18vw}
}
@media(max-width:780px){
 .roadmap-section>.container{width:calc(100% - 40px)}
 .roadmap-section .roadmap-track{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
 .roadmap-heading h2{font-size:clamp(48px,9vw,70px)}
 .roadmap-heading h2>em{font-size:.83em;max-width:650px;margin-top:6px}
 .roadmap-heading .eyebrow{font-size:10px;gap:10px;letter-spacing:.12em}
 .roadmap-heading .eyebrow>span{width:10px;height:11px}
}
@media(max-width:560px){
 .roadmap-section{padding:64px 0 72px}
 .roadmap-section .roadmap-track{grid-template-columns:1fr;gap:18px;margin-top:32px}
 .roadmap-section .roadmap-step{min-height:228px;padding:26px}
 .roadmap-section .roadmap-step-featured{min-height:254px}
 .roadmap-heading h2{font-size:clamp(44px,12vw,67px)}
 .roadmap-summary p{font-size:17px}
 .roadmap-section .step-number{width:54px;height:54px;font-size:30px;border-radius:13px;margin-bottom:14px}
 .roadmap-section .roadmap-step p{margin-bottom:24px}
 .roadmap-section .chapter-label{font-size:14px}
}

/* ---------- skills ---------- */
.skills-layout{display:grid;grid-template-columns:.85fr 1.15fr;gap:90px;align-items:start}
.skill-grid{display:grid;grid-template-columns:1fr 1fr;column-gap:28px;align-content:start}
.skill-item{display:flex;gap:14px;align-items:center;border-bottom:1px solid var(--line);padding:16px 0;font-size:15px;font-weight:500;line-height:1.4;transition:color .2s,padding-left .2s}
.skill-item:hover{color:var(--blue);padding-left:4px}
.skill-item span{font:700 12px var(--display);color:var(--muted-2);min-width:22px;letter-spacing:.04em}
.skill-item .icon{width:16px;height:16px;margin-left:auto;opacity:0;transform:translateX(-6px);transition:opacity .2s,transform .2s;color:var(--blue)}
.skill-item:hover .icon{opacity:1;transform:none}
.skill-stamp{margin-top:48px;display:flex;align-items:center;gap:16px;font:800 96px/1 var(--display);color:var(--blue)}
.skill-stamp>span{font:700 11px/1.5 var(--body);letter-spacing:.14em;border-left:2px solid var(--yellow);padding-left:14px;color:var(--muted)}

/* ---------- projects ---------- */
.projects-section{background:#fff}
.project-showcase{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}
.project-visual-caption{font-size:10px;letter-spacing:.14em;color:var(--blue);display:block;margin:26px 0 14px;font-weight:700}
.project-visual h3{font-size:30px;letter-spacing:-.02em}
.project-visual p{font-size:15px;max-width:460px}
.project-list>a{display:flex;align-items:center;gap:20px;padding:22px 0;border-bottom:1px solid var(--line);transition:padding-left .25s var(--ease)}
.project-list>a:first-child{border-top:1px solid var(--line)}
.project-list>a:hover{padding-left:8px}
.project-list>a>span{font:700 26px var(--display);color:var(--muted-2);min-width:34px}
.project-list>a>div{flex:1}
.project-list h3{font-size:20px;font-weight:600}
.project-list small{display:block;font-size:13px;color:var(--muted);margin-top:4px}
.project-list>a>.icon{width:18px;color:var(--blue)}
.project-list>a:hover h3{color:var(--blue)}

/* ---------- book section ---------- */
.book-section{background:var(--paper)}
.book-layout{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.book-copy h2{font-size:clamp(56px,5.6vw,84px);line-height:.9}
.book-copy h2 .hl{color:var(--blue)}
.book-copy p{font-size:15px}
.book-subtitle{color:var(--ink);font-size:22px;font-weight:700;margin:26px 0 0;letter-spacing:-.02em}
.book-tagline{font-size:14px;margin:6px 0 0;color:var(--blue);font-weight:600}
.buy-visual{min-height:600px;background:radial-gradient(70% 60% at 50% 40%,#dfe6f6,#eef1f8 70%);position:relative;display:flex;align-items:center;justify-content:center;perspective:1200px;border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line)}
.buy-visual:before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(15,45,143,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(15,45,143,.06) 1px,transparent 1px);background-size:40px 40px;mask-image:radial-gradient(circle at 50% 50%,#000 30%,transparent 80%);-webkit-mask-image:radial-gradient(circle at 50% 50%,#000 30%,transparent 80%)}
.buy-visual .book-scene{width:290px;height:435px;margin-top:-16px}
.buy-visual .book-object{transform:rotateX(6deg) rotateY(-24deg) rotateZ(-6deg)}
.buy-visual .book-object.flipped{transform:rotateX(5deg) rotateY(156deg) rotateZ(3deg)}
.flip-control{display:inline-flex;gap:8px;align-items:center;justify-content:center;position:absolute;bottom:20px;left:50%;transform:translateX(-50%);color:var(--blue);font-size:12px;font-weight:700;white-space:nowrap;padding:10px 16px;border-radius:999px;background:#fff;border:1px solid var(--line);z-index:6;box-shadow:var(--shadow)}
.flip-control:hover{background:var(--soft)}
.flip-control .icon{width:15px;height:15px}
.edition-badge{position:absolute;z-index:5;right:24px;top:24px;font-size:9px;line-height:1.6;letter-spacing:.16em;border:1px solid var(--line-2);padding:10px 12px;color:var(--blue);background:#fff;border-radius:8px;font-weight:700}
.edition-badge strong{font:700 24px var(--display);display:block}
.best-badge{position:absolute;left:24px;top:24px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;width:112px;height:112px;border-radius:50%;background:var(--yellow);color:var(--deep);font:700 13px/1.15 var(--display);letter-spacing:.06em;text-align:center;transform:rotate(-10deg);box-shadow:0 12px 26px -8px rgba(217,173,0,.7);border:4px solid #fff;z-index:5}
.best-badge .icon{width:18px;height:18px;fill:var(--deep)}
.check-list{list-style:none;margin:28px 0;padding:0;display:grid;gap:12px}
.check-list li{display:flex;align-items:flex-start;gap:12px;font-size:14px;line-height:1.55;color:var(--ink)}
.check-list .icon{width:20px;height:20px;color:var(--blue);background:#e9eef9;border-radius:50%;padding:3px;flex-shrink:0;margin-top:1px}
.contents-section{padding-top:96px}
.contents-section h3{font-family:var(--display);font-size:38px;text-transform:uppercase;letter-spacing:-.01em;line-height:1}
.contents-section .eyebrow{margin-bottom:12px}
.chapter-groups{display:grid;grid-template-columns:1fr 1fr;gap:0 48px;align-items:start}
.chapter-groups details{border-bottom:1px solid var(--line)}
summary{list-style:none;cursor:pointer}
summary::-webkit-details-marker{display:none}
.chapter-groups summary{display:flex;gap:14px;align-items:center;padding:18px 0;font-size:15px;font-weight:600;transition:color .2s}
.chapter-groups summary:hover{color:var(--blue)}
.chapter-part{font:700 11px var(--display);color:var(--blue);letter-spacing:.1em;width:56px;flex-shrink:0}
.chapter-range{font-size:11px;font-weight:500;color:var(--muted);margin-left:auto;white-space:nowrap}
.chapter-groups summary>.icon{height:14px;width:14px;color:var(--blue);transition:transform .25s}
.chapter-groups ol{padding-left:70px;color:var(--muted);font-size:14px;line-height:1.6;margin:0 0 20px}
.chapter-groups li{padding:5px 6px}
.chapter-groups li::marker{color:var(--blue);font-weight:700}
details[open] summary .icon{transform:rotate(45deg)}

/* ---------- resources band ---------- */
.resources-band{background:var(--blue);color:#fff;position:relative;overflow:hidden}
.resources-band:before{content:'';position:absolute;inset:0;background:radial-gradient(50% 60% at 90% 10%,rgba(80,130,255,.45),transparent 70%);pointer-events:none}
.resources-band>.container{position:relative}
.resources-band h2{font-size:clamp(46px,4.8vw,70px);line-height:.94}
.resources-band h2 .hl{color:var(--yellow)}
.resources-band p{color:#d0dbfc;font-size:16px;max-width:460px;margin:26px 0}
.resources-layout{display:grid;grid-template-columns:1.1fr .9fr;gap:70px;align-items:center}
.pack-list{list-style:none;padding:0;margin:34px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:6px 24px}
.pack-list a{display:flex;align-items:center;gap:10px;padding:9px 0;font-size:13px;color:#dbe4ff;border-bottom:1px solid rgba(255,255,255,.1);transition:color .2s,padding-left .2s}
.pack-list a:hover{color:#fff;padding-left:4px}
.pack-list .icon{width:16px;height:16px;color:var(--yellow)}
.pack-visual{position:relative;display:flex;align-items:center;justify-content:center;min-height:460px}
.pack-visual-stage{position:absolute;left:50%;top:50%;width:92%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.18),rgba(255,255,255,.04) 55%,transparent 72%)}
.pack-stack{position:relative;width:min(100%,440px);height:auto;filter:drop-shadow(0 34px 44px rgba(0,18,63,.6))}
.free-seal{border-radius:50%;height:104px;width:104px;position:absolute;right:4%;bottom:6%;color:var(--deep);background:var(--yellow);display:flex;align-items:center;justify-content:center;flex-direction:column;font:800 32px/1 var(--display);transform:rotate(12deg);border:5px solid var(--blue);box-shadow:0 0 0 2px #6e88c5,0 18px 30px -10px rgba(0,0,0,.5)}
.free-seal>span{font:700 7px/1.3 var(--body);letter-spacing:.12em;text-align:center;margin-top:4px}

/* ---------- compare table ---------- */
.compare-table{margin-top:56px;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;background:#fff}
.compare-head,.compare-row{display:grid;grid-template-columns:.7fr 1.2fr 1.4fr;gap:0}
.compare-head{background:var(--soft);border-bottom:1px solid var(--line)}
.compare-head span{padding:18px 26px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--muted)}
.compare-head .compare-good{color:var(--blue);background:#e9eef9}
.compare-row{border-top:1px solid var(--line)}
.compare-row:first-of-type{border-top:0}
.compare-row span{padding:22px 26px;font-size:15px;line-height:1.5;display:flex;align-items:center;gap:12px}
.compare-key{font:700 14px var(--display);letter-spacing:.1em;text-transform:uppercase;color:var(--ink)}
.compare-row .compare-bad{color:var(--muted)}
.compare-row .compare-bad .icon{width:18px;height:18px;color:#c0392b;flex-shrink:0}
.compare-row .compare-good{color:var(--ink);font-weight:600;background:#f4f7fd}
.compare-row .compare-good .icon{width:20px;height:20px;color:var(--blue);background:#e9eef9;border-radius:50%;padding:3px;flex-shrink:0}

/* ---------- audience paths ---------- */
.audience-section{--audience-blue:#1549c2;background:radial-gradient(ellipse at 50% 42%,#fff 0%,#f7f9fd 75%,#eef3fa 100%);padding:clamp(58px,3.4vw,74px) 0 clamp(88px,7vw,142px)}
.audience-section>.container{width:min(1810px,83.5%)}
.audience-heading{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(340px,1fr);gap:6%;align-items:center}
.audience-heading .eyebrow{font-size:clamp(11px,.92vw,18px);letter-spacing:.19em;gap:16px;margin-bottom:22px;color:var(--audience-blue)}
.audience-heading .eyebrow>span{width:15px;height:15px;border-radius:0;box-shadow:none;background:var(--yellow)}
.audience-heading h2{font-size:clamp(60px,4.75vw,103px);font-weight:800;line-height:.84;letter-spacing:-.005em;color:#071331}
.audience-heading h2>span,.audience-heading h2>em{display:block;white-space:nowrap}
.audience-heading h2>em{color:var(--audience-blue);margin-top:8px}
.audience-heading>p{align-self:center;margin:28px 0 0;font-size:clamp(20px,1.54vw,33px);font-weight:500;line-height:1.36;letter-spacing:-.02em;color:#586887}
.audience-section .audience-grid{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(28px,2.13vw,46px);margin-top:36px}
.audience-line{position:absolute;z-index:0;left:2%;right:2%;top:132px;height:2px;background:linear-gradient(90deg,#4d6ca9,#9cacc8)}
.audience-card{position:relative;z-index:1;min-width:0;min-height:302px;padding:29px clamp(28px,1.67vw,36px) 28px;background:rgba(255,255,255,.96);border:1px solid #d8e1ef;border-radius:19px;box-shadow:0 12px 30px rgba(31,55,99,.035);transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s}
.audience-card:hover{transform:translateY(-5px);border-color:#becde5;box-shadow:0 20px 38px rgba(31,55,99,.1)}
.audience-number{display:flex;width:73px;height:69px;align-items:center;justify-content:center;margin:0 0 20px;background:linear-gradient(135deg,#1652d2,#0c3eb3);border-radius:15px;box-shadow:inset 0 1px 1px rgba(255,255,255,.28);font:700 37px/1 var(--display);letter-spacing:0;color:#fff}
.audience-card h3{font-family:var(--display);font-size:clamp(29px,1.6vw,35px);font-weight:800;line-height:1.05;letter-spacing:-.01em;color:#071331}
.audience-card p{margin:13px 0 0;font-size:clamp(18px,1.2vw,26px);font-weight:500;line-height:1.42;letter-spacing:-.01em;color:#586887}
@media(max-width:1180px){
 .audience-section>.container{width:calc(100% - 64px)}
 .audience-heading{grid-template-columns:minmax(0,1.45fr) minmax(280px,.8fr);gap:5%}
 .audience-heading h2{font-size:5vw}
 .audience-section .audience-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
 .audience-line{display:none}
 .audience-card{min-height:260px}
}
@media(max-width:780px){
 .audience-section{padding:64px 0 76px}
 .audience-section>.container{width:calc(100% - 40px)}
 .audience-heading{grid-template-columns:1fr;gap:24px}
 .audience-heading h2{font-size:clamp(48px,10.8vw,76px)}
 .audience-heading h2>span,.audience-heading h2>em{white-space:normal}
 .audience-heading>p{margin:0;font-size:19px}
 .audience-section .audience-grid{margin-top:36px;gap:18px}
 .audience-card{min-height:245px;padding:26px}
 .audience-card h3{font-size:30px}
 .audience-card p{font-size:18px}
}
@media(max-width:560px){
 .audience-section>.container{width:calc(100% - 32px)}
 .audience-heading .eyebrow{font-size:10px;gap:10px;margin-bottom:18px}
 .audience-heading .eyebrow>span{width:11px;height:11px}
 .audience-heading h2{font-size:12.2vw}
 .audience-section .audience-grid{grid-template-columns:1fr}
 .audience-card{min-height:240px}
 .audience-number{width:64px;height:61px;font-size:33px;border-radius:13px}
}
/* Paths motion. audience-motion.js drives it with classes: audience-armed (script running, content may be hidden) →
   audience-in (per group: .audience-heading, .audience-grid, each .audience-card, added as it scrolls into view;
   cards entering together get a --card cascade index). audience-running is set only while on screen, so ambient loops pause off screen. */
.audience-card:nth-child(3){--n:1}.audience-card:nth-child(4){--n:2}.audience-card:nth-child(5){--n:3}
@media(prefers-reduced-motion:no-preference){
 .audience-armed .audience-heading:not(.audience-in) :is(.eyebrow,h2>span,h2>em),.audience-armed .audience-heading:not(.audience-in)>p,.audience-armed .audience-grid:not(.audience-in) .audience-line,.audience-armed .audience-card:not(.audience-in){opacity:0}
 /* Heading: the square spins in, each line rises out of a blur, the blue line carries a repeating light sweep */
 .audience-heading.audience-in .eyebrow{animation:audience-rise .9s cubic-bezier(.22,1,.36,1) backwards}
 .audience-heading.audience-in .eyebrow>span{animation:audience-square-in .8s cubic-bezier(.34,1.56,.64,1) .15s backwards,audience-ping 2.8s cubic-bezier(.22,1,.36,1) 1.4s infinite}
 .audience-heading.audience-in h2>span{animation:audience-line-in 1.1s cubic-bezier(.22,1,.36,1) .08s backwards}
 .audience-armed .audience-heading h2>em{background:linear-gradient(105deg,var(--audience-blue) 42%,#6f9bff 50%,var(--audience-blue) 58%) 100% 0/250% 100% no-repeat;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
 .audience-heading.audience-in h2>em{animation:audience-line-in 1.1s cubic-bezier(.22,1,.36,1) .22s backwards,audience-shimmer 7s cubic-bezier(.45,.05,.55,.95) 1.5s infinite}
 .audience-heading.audience-in>p{animation:audience-rise 1s cubic-bezier(.22,1,.36,1) .4s backwards}
 /* The connector draws left to right, then a light pulse travels it (linear over the first 70% of a 5s loop) */
 .audience-grid.audience-in .audience-line{transform-origin:left;animation:audience-draw 1.4s cubic-bezier(.65,0,.35,1) .15s backwards}
 .audience-armed .audience-line:after{content:'';position:absolute;top:-3px;left:0;width:140px;height:8px;margin-left:-140px;border-radius:4px;background:linear-gradient(90deg,transparent,#6f9bff,#1652d2,transparent);opacity:0;pointer-events:none}
 .audience-grid.audience-in .audience-line:after{animation:audience-run 5s linear 2.2s infinite}
 /* Cards cascade in; the number flips up, then the title and text follow */
 .audience-card.audience-in{animation:audience-card-in .9s cubic-bezier(.22,1,.36,1) calc(.3s + var(--card,0) * .16s) backwards}
 .audience-card.audience-in .audience-number{animation:audience-badge-in .9s cubic-bezier(.34,1.56,.64,1) calc(.45s + var(--card,0) * .16s) backwards,audience-badge-glow 5s linear calc(2.2s + (var(--n,0) + .5) * .875s) infinite}
 .audience-card.audience-in h3{animation:audience-rise .8s cubic-bezier(.22,1,.36,1) calc(.58s + var(--card,0) * .16s) backwards}
 .audience-card.audience-in p{animation:audience-rise .8s cubic-bezier(.22,1,.36,1) calc(.68s + var(--card,0) * .16s) backwards}
 /* Each number catches the light as the pulse passes its card */
 .audience-armed .audience-number{position:relative;overflow:hidden;transition:scale .5s cubic-bezier(.34,1.56,.64,1),rotate .5s cubic-bezier(.34,1.56,.64,1)}
 .audience-armed .audience-number:after{content:'';position:absolute;inset:0;background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.55) 50%,transparent 70%);translate:-120% 0;pointer-events:none}
 .audience-card.audience-in .audience-number:after{animation:audience-badge-sheen 5s ease-out calc(2.2s + (var(--n,0) + .5) * .875s) infinite}
 .audience-armed:not(.audience-running) :is(.eyebrow>span,h2>em,.audience-number),.audience-armed:not(.audience-running) .audience-line:after,.audience-armed:not(.audience-running) .audience-number:after{animation-play-state:paused}
}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 .audience-armed .audience-card:before{content:'';position:absolute;inset:0;z-index:-1;border-radius:inherit;background:radial-gradient(260px circle at var(--mx,50%) var(--my,50%),rgba(22,82,210,.07),transparent 72%);opacity:0;transition:opacity .35s var(--ease);pointer-events:none}
 .audience-armed .audience-card:after{content:'';position:absolute;left:28px;right:28px;bottom:-1px;height:3px;border-radius:3px;background:linear-gradient(90deg,#1652d2,#6f9bff);scale:0 1;transform-origin:left;transition:scale .55s cubic-bezier(.22,1,.36,1);pointer-events:none}
 .audience-armed .audience-card:hover:before{opacity:1}
 .audience-armed .audience-card:hover:after{scale:1 1}
 .audience-armed .audience-card:hover .audience-number{scale:1.06;rotate:-6deg}
}
@keyframes audience-rise{from{opacity:0;translate:0 22px}}
@keyframes audience-square-in{from{opacity:0;scale:0;rotate:-90deg}}
@keyframes audience-ping{0%{box-shadow:0 0 0 0 rgba(255,207,8,.45)}60%,100%{box-shadow:0 0 0 8px rgba(255,207,8,0)}}
@keyframes audience-line-in{from{opacity:0;translate:0 .4em;filter:blur(12px)}}
@keyframes audience-shimmer{0%{background-position:100% 0}30%,100%{background-position:0 0}}
@keyframes audience-draw{from{scale:0 1}}
@keyframes audience-run{0%{left:0;opacity:0}6%{opacity:1}64%{opacity:1}70%,100%{left:calc(100% + 140px);opacity:0}}
@keyframes audience-card-in{from{opacity:0;translate:0 34px;scale:.96;filter:blur(6px)}}
@keyframes audience-badge-in{from{opacity:0;transform:perspective(400px) rotateX(-90deg)}}
@keyframes audience-badge-glow{0%{box-shadow:inset 0 1px 1px rgba(255,255,255,.28),0 0 0 0 rgba(22,82,210,.4)}16%,100%{box-shadow:inset 0 1px 1px rgba(255,255,255,.28),0 0 0 12px rgba(22,82,210,0)}}
@keyframes audience-badge-sheen{0%{translate:-120% 0}14%,100%{translate:120% 0}}

/* ---------- article cards & thumbnails ---------- */
.blog-section{background:#fff}
.article-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;align-items:start}
.article-card{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s}
.article-card:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:var(--line-2)}
.article-card-art{display:block;overflow:hidden;border-bottom:1px solid var(--line)}
.thumb{width:100%;height:auto;display:block;transition:transform .6s var(--ease)}
.article-card:hover .thumb{transform:scale(1.03)}
.article-card-body{padding:26px}
.card-meta{display:flex;justify-content:space-between;gap:10px;font-size:11px;color:var(--muted);margin-bottom:14px;font-weight:600;letter-spacing:.04em;text-transform:uppercase}
.card-meta>span:first-child{color:var(--blue)}
.article-card h3{font-size:22px;line-height:1.2}
.article-card h3 a:hover{color:var(--blue)}
.article-card p{font-size:14px;line-height:1.7;margin:12px 0 20px}
.article-card .text-link{font-size:13px}

/* ---------- author ---------- */
.author-layout{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.author-image-wrap{position:relative;border-radius:var(--r-lg);overflow:hidden;background:#e4e6e5;box-shadow:var(--shadow)}
.author-image-wrap>img{width:100%;height:auto;object-fit:cover;display:block}
.portrait-label{position:absolute;bottom:0;left:0;right:0;background:var(--yellow);color:var(--deep);font-size:10px;font-weight:700;padding:14px 22px;letter-spacing:.14em}
.author-layout p{font-size:16px}
.author-signature{font-family:var(--display);font-size:34px;color:var(--blue);margin:28px 0 0;font-weight:700;text-transform:uppercase;letter-spacing:.01em}
.author-signature+p{margin-top:4px}
.socials{display:flex;gap:10px;align-items:center;margin-top:26px}
.socials a{display:grid;place-items:center;border:1px solid var(--line);border-radius:10px;width:40px;height:40px;background:#fff;transition:transform .2s,box-shadow .2s}
.socials a:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.socials img{width:20px;height:20px;object-fit:contain}
.about-stats{display:flex;gap:0;margin:32px 0 6px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.about-stats>div{flex:1;padding:18px 20px 18px 0;display:flex;align-items:center;gap:14px;border-right:1px solid var(--line)}
.about-stats>div:last-child{border:0}
.about-stats>div+div{padding-left:20px}
.about-stats b{font:800 40px/1 var(--display);color:var(--blue)}
.about-stats span{font-size:12px;color:var(--muted);line-height:1.35}

/* ---------- FAQ ---------- */
.faq-section{background:var(--soft)}
.faq-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:90px;align-items:start}
.faq-aside{position:sticky;top:120px}
.faq-book{margin-top:36px;display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.faq-book>img{width:min(100%,300px);height:auto;filter:drop-shadow(0 26px 34px rgba(7,21,64,.28))}
.faq-book>span{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.faq-list details{border-bottom:1px solid var(--line-2)}
.faq-list summary{display:flex;align-items:center;gap:24px;justify-content:space-between;padding:24px 0;font-size:17px;line-height:1.45;font-weight:600;transition:color .2s}
.faq-list summary:hover{color:var(--blue)}
.faq-list summary .icon{width:18px;height:18px;color:var(--blue);transition:transform .25s;flex-shrink:0}
.faq-list details:first-child summary{padding-top:0}
.faq-list details>p{font-size:15px;margin:0 40px 26px 0;line-height:1.8}

/* ---------- final CTA ---------- */
.final-cta{background:#052f9a;color:#fff;padding:clamp(72px,8vw,100px) 0;position:relative;overflow:hidden;min-height:520px;display:flex;align-items:center}
.final-bg{position:absolute;inset:0;background:radial-gradient(60% 90% at 30% 50%,#1148c2,#052f9a 70%),#052f9a}
.final-photo{position:absolute;right:0;top:0;bottom:0;width:56%;pointer-events:none}
.final-photo>img{width:100%;height:100%;object-fit:cover;object-position:right center;mask-image:linear-gradient(to right,transparent 0,#000 32%);-webkit-mask-image:linear-gradient(to right,transparent 0,#000 32%)}
.final-inner{position:relative;width:min(1240px,calc(100% - 96px));display:grid;grid-template-columns:minmax(0,620px);gap:34px}
.final-cta h2{font-size:clamp(40px,4vw,58px)}
.final-cta h2 em{color:var(--yellow)}
.final-cta p{color:#cbd8f6;font-size:16px;margin-bottom:0}
.final-actions{display:flex;flex-wrap:wrap;gap:12px}
.final-actions .button{justify-content:space-between;min-width:280px}

/* Closing banner, matched to the approved author-left reference. */
.final-cta.final-cta-redesign{--yellow:#ffd000;background:#0345c5;padding:0;min-height:0;display:block;isolation:isolate}
.final-cta-redesign .final-bg{z-index:-1;background:radial-gradient(ellipse at 20% 30%,#1474fa 0%,#0754db 35%,transparent 65%),linear-gradient(115deg,#0351d9,#003aaa)}
.final-cta-redesign .final-inner{width:min(1920px,92%);min-height:clamp(520px,38.5vw,804px);display:grid;grid-template-columns:45% minmax(0,1fr);gap:3.5%;position:relative;padding:0;order:initial}
.final-cta-redesign .final-copy{grid-column:2;grid-row:1;min-width:0;align-self:center;padding:clamp(66px,6.35vw,133px) 0 clamp(60px,5.3vw,111px)}
.final-cta-redesign .eyebrow{font-size:clamp(12px,1vw,21px);line-height:1.5;letter-spacing:.15em;gap:18px;margin-bottom:16px;color:#f3f7ff}
.final-cta-redesign .eyebrow>span{width:19px;height:19px;border-radius:4px;box-shadow:none;background:var(--yellow)}
.final-cta-redesign h2{font-size:clamp(48px,5.08vw,106px);line-height:.9;font-weight:800;letter-spacing:-.012em}
.final-cta-redesign h2>span{display:block;white-space:nowrap}
.final-cta-redesign h2 em{color:var(--yellow)}
.final-cta-redesign p{font-size:clamp(18px,1.53vw,32px);line-height:1.2;letter-spacing:-.01em;color:#e4eeff;margin:24px 0 0}
.final-cta-redesign .final-actions{display:grid;grid-template-columns:1.04fr 1fr;gap:22px;margin-top:40px}
.final-cta-redesign .final-actions .button{width:100%;min-width:0;min-height:clamp(58px,4vw,84px);font-size:clamp(14px,1.2vw,25px);border-radius:12px;padding:18px clamp(20px,2.1vw,44px);gap:18px;justify-content:space-between}
.final-cta-redesign .final-actions .button.primary{background:var(--yellow);border-color:#ffdf36;box-shadow:0 12px 28px -8px rgba(255,208,0,.55);color:#073081}
.final-cta-redesign .final-actions .button.primary:hover{background:#ffe047}
.final-cta-redesign .final-actions .outline-light{background:rgba(65,115,216,.22);border-color:#d7e5ff}
.final-cta-redesign .final-actions .outline-light:hover{background:rgba(92,144,244,.35)}
.final-cta-redesign .final-actions .icon{width:clamp(20px,1.4vw,29px);height:clamp(20px,1.4vw,29px)}
.final-cta-redesign .final-photo{grid-column:1;grid-row:1;position:relative;inset:auto;align-self:stretch;width:100%;height:auto;min-width:0;margin:0;order:initial;display:flex;justify-content:center;align-items:flex-end;pointer-events:none;container-type:size}
.final-cta-redesign .final-photo>img{position:absolute;bottom:0;display:block;height:auto;width:min(100cqw,100cqh - clamp(8px,.8vw,16px));max-width:none;aspect-ratio:1;object-fit:contain;object-position:center bottom;mask-image:url('/assets/generated/author-pointing-book-v2-mask.webp');-webkit-mask-image:url('/assets/generated/author-pointing-book-v2-mask.webp');mask-mode:luminance;mask-size:100% 100%;mask-repeat:no-repeat}
@media(min-width:781px) and (max-width:1180px){
 .final-cta-redesign .final-inner{min-height:480px}
 .final-cta-redesign .final-copy{padding:62px 0}
 .final-cta-redesign h2{font-size:5vw}
 .final-cta-redesign .final-actions{gap:12px;margin-top:30px}
 .final-cta-redesign .final-actions .button{font-size:1.15vw;padding:15px 14px;gap:10px;min-height:54px}
 .final-cta-redesign p{font-size:17px;line-height:1.45}
 .final-cta-redesign .eyebrow{font-size:11px;gap:12px}
 .final-cta-redesign .eyebrow>span{width:12px;height:12px}
}
@media(max-width:780px){
 .final-cta-redesign .final-inner{width:calc(100% - 40px);min-height:0;grid-template-columns:minmax(0,1fr);gap:0}
 .final-cta-redesign .final-copy{grid-column:1;grid-row:1;width:100%;max-width:620px;margin:auto;padding:56px 0 24px}
 .final-cta-redesign h2{font-size:clamp(36px,9.4vw,65px);line-height:.98}
 .final-cta-redesign .eyebrow{font-size:12px;gap:12px;margin-bottom:24px}
 .final-cta-redesign .eyebrow>span{width:12px;height:12px}
 .final-cta-redesign p{font-size:18px;line-height:1.5;margin-top:24px}
 .final-cta-redesign .final-actions{gap:14px;margin-top:28px}
 .final-cta-redesign .final-actions .button{font-size:13px;padding:18px 16px;gap:10px;min-height:58px}
 .final-cta-redesign .final-photo{grid-column:1;grid-row:2;aspect-ratio:1;width:100%;max-width:490px;margin:8px auto 0}
 .final-cta-redesign .final-photo>img{height:auto;width:100%;aspect-ratio:1}
}
@media(max-width:480px){
 .final-cta-redesign .final-inner{width:calc(100% - 32px)}
 .final-cta-redesign h2{font-size:9.3vw}
 .final-cta-redesign .final-actions{grid-template-columns:1fr;gap:12px}
 .final-cta-redesign .final-actions .button{font-size:15px;padding:18px 20px}
 .final-cta-redesign p{font-size:17px}
}

/* ---------- footer ---------- */
.footer{background:var(--navy);color:#c3cdea}
.footer-top{display:grid;grid-template-columns:1.8fr .9fr 1.3fr 1.1fr 1.1fr;gap:36px;padding:72px 0 56px}
.footer .brand{margin-bottom:24px}
.footer .brand-name{color:#c3cdea}
.footer .brand-name strong{color:#fff}
.footer .brand-mark{background:transparent;box-shadow:none}
.footer-brand p{font-size:15px;line-height:1.6;color:#fff;font-weight:500}
.footer-brand .small{color:#8a98c4;display:block;max-width:320px;line-height:1.6}
.footer .socials a{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14)}
.footer h3{font-size:11px;font-weight:700;margin-bottom:20px;letter-spacing:.16em;text-transform:uppercase;color:#fff}
.footer-top>div:not(:first-child)>a{display:flex;gap:4px;align-items:center;font-size:14px;line-height:1.5;color:#aab6d9;margin-bottom:12px;transition:color .2s}
.footer-top a:hover{color:var(--yellow)}
.footer-top a .icon{width:12px;height:12px}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding:24px 0;display:flex;justify-content:space-between;gap:20px;font-size:12px;color:#8a98c4}
.footer-bottom a:hover{color:var(--yellow)}

/* ---------- inner pages ---------- */
.breadcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:28px;font-size:12px;color:var(--muted);font-weight:500}
.breadcrumb a{color:var(--blue)}
.breadcrumb>span{color:var(--muted-2)}
.page-hero{padding:64px 0 76px;position:relative}
.page-hero h1{font-size:clamp(56px,6.6vw,96px);max-width:1080px}
.page-hero .eyebrow{margin-bottom:22px}
.page-hero p{max-width:680px}
.page-hero .lead{margin-top:26px;color:var(--muted)}
.availability{font-size:12px;display:flex;align-items:center;gap:8px;font-weight:600;color:var(--muted)}
.availability>span{width:8px;height:8px;display:inline-block;border-radius:50%;background:var(--yellow-d);box-shadow:0 0 0 4px rgba(217,173,0,.2)}
.resource-book-cover{position:relative;width:min(100%,380px);justify-self:center;padding:24px 0}
.cover-stage{position:absolute;left:50%;top:50%;width:120%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,#e3e9f8 0%,rgba(227,233,248,.5) 45%,transparent 70%);z-index:0}
.resource-book-cover img{position:relative;z-index:1;width:100%;height:auto;filter:drop-shadow(0 30px 40px rgba(7,21,64,.3))}
.count-label{color:var(--muted);font-size:12px;white-space:nowrap;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.filter-toolbar{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:0 0 32px;padding:18px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.filter-tabs{display:flex;gap:6px;flex-wrap:wrap}
.filter-chip{border:1px solid transparent;border-radius:999px;padding:10px 16px;font-size:13px;font-weight:600;white-space:nowrap;transition:background .2s,color .2s}
.filter-chip:hover{background:var(--soft-2)}
.filter-chip.active{background:var(--blue);color:#fff}
.search-box{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:10px;padding:11px 14px;background:#fff;min-width:250px}
.search-box>.icon{width:17px;height:17px;color:var(--muted-2)}
.search-box>input{min-width:0;width:100%;outline:0;border:0;font-size:14px;color:var(--ink);background:none}
.search-box:focus-within{border-color:var(--blue);box-shadow:0 0 0 3px rgba(15,45,143,.12)}
.resource-icon{background:var(--blue);display:grid;place-items:center;width:46px;height:46px;color:var(--yellow);border-radius:12px}
.empty-state{text-align:center;background:var(--soft);padding:60px 25px;grid-column:1/-1;border:1px dashed var(--line-2);border-radius:var(--r-lg)}
.empty-state h3{font-size:26px}
.empty-state p{font-size:15px}
.featured-article{display:grid;grid-template-columns:1.1fr 1fr;gap:56px;align-items:center;background:#fff;padding:28px;border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow)}
.featured-art{display:block;border-radius:12px;overflow:hidden}
.featured-article h2{font-size:clamp(34px,3.6vw,50px);margin-top:20px;line-height:1}
.featured-article h2 a:hover{color:var(--blue)}
.featured-article p{font-size:15px;max-width:480px}
.compact-title{font-size:clamp(34px,3.4vw,46px)}
.about-hero{padding-top:56px}
.about-hero h1{font-size:clamp(64px,7vw,100px)}
.about-hero .lead{font-size:21px;color:var(--ink);font-weight:500}
.about-hero .author-image-wrap{max-width:460px}
.about-hero .author-image-wrap>img{aspect-ratio:.82;object-fit:cover;object-position:74% 50%}
.author-background-grid{margin-top:48px;align-items:start;gap:70px}
.author-background-grid h3{font-size:20px;margin-bottom:12px}
.author-detail-row{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;border-bottom:1px solid var(--line-2);padding:22px 0}
.author-detail-row strong{display:block;font-size:17px;line-height:1.5;font-weight:600}
.author-detail-row small{display:block;margin-top:8px;font-size:13px;color:var(--muted)}
.author-detail-row>.icon{width:18px;height:18px;margin-top:5px;color:var(--blue)}
a.author-detail-row:hover strong{color:var(--blue)}
.author-detail-row .text-link{margin-top:12px}
.author-background-grid>div>.small .text-link{font-size:inherit}
.author-world{background:var(--soft)}
.zero-logo{margin-bottom:26px;border-radius:14px;box-shadow:var(--shadow)}
.author-world p{font-size:16px}
.other-books{border-top:1px solid var(--line-2);padding-top:30px}
.other-books h3{font-size:11px;color:var(--muted);margin-bottom:14px;letter-spacing:.16em;text-transform:uppercase}
.other-books>a{display:flex;align-items:center;justify-content:space-between;gap:15px;border-bottom:1px solid var(--line-2);padding:20px 0;font-size:18px;font-weight:600;transition:padding-left .2s}
.other-books>a:hover{color:var(--blue);padding-left:6px}
.other-books .icon{width:18px}
.other-books .current-book{color:var(--blue)}
.contact-section{padding-top:0}
.contact-layout{display:grid;grid-template-columns:1fr 1.1fr;gap:90px}
.contact-portrait{position:relative;width:240px;height:240px;margin-bottom:30px}
.contact-portrait-stage{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 50% 40%,#e9eef9,#dfe6f6)}
.contact-portrait>img{position:absolute;left:7%;bottom:0;width:86%;height:auto;filter:drop-shadow(0 12px 18px rgba(7,21,64,.22))}
.contact-details>h2{font-size:clamp(34px,3.4vw,44px)}
.contact-details>p{font-size:16px}
.email-link{font-size:18px;color:var(--blue);font-weight:700;display:block;overflow-wrap:anywhere;margin:30px 0 10px}
.contact-details>.text-link{font-size:13px}
.contact-topics{margin-top:36px}
.contact-topics>div{border-top:1px solid var(--line);padding:20px 0}
.contact-topics h3{font-size:16px}
.contact-topics p{font-size:14px;margin:7px 0 0}
.contact-form{padding:38px;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow)}
.contact-form h2{font-size:34px}
.contact-form>p{font-size:14px;margin:12px 0 28px}
.contact-form label{display:flex;flex-direction:column;gap:8px;margin-bottom:20px;font-size:13px;font-weight:600}
.contact-form input,.contact-form select,.contact-form textarea{padding:13px 14px;border:1px solid var(--line-2);border-radius:8px;background:#fff;width:100%;min-width:0;color:var(--ink);font-size:15px;resize:vertical}
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{outline:0;border-color:var(--blue);box-shadow:0 0 0 3px rgba(15,45,143,.12)}
.contact-form textarea{min-height:150px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.contact-form .button{width:100%}
.contact-form .form-note{font-size:12px;margin-bottom:0;color:var(--muted)}
#contact-result{margin-top:24px;padding:16px;border:1px solid #b5c7e6;border-radius:8px;color:var(--blue);font-size:13px;background:#f4f7fd}
#contact-result p{font-size:13px;margin:8px 0}
.legal-body{padding-top:0}
.legal-body section{margin-bottom:46px}
.legal-body h2{font-size:32px;line-height:1.05}
.legal-body p{font-size:15px;line-height:1.85}
.legal-body .answer-box a{overflow-wrap:anywhere;color:var(--blue);font-weight:600}
.legal-body .answer-box h3{margin-bottom:8px}

/* ---------- article pages ---------- */
.reading-progress{position:fixed;top:84px;left:0;width:100%;height:3px;background:transparent;z-index:101}
.reading-progress span{display:block;background:var(--yellow);height:100%;width:0}
.article-header{max-width:900px;padding:56px 0 40px}
.article-header h1{font-family:var(--body);font-size:clamp(38px,4.6vw,58px);font-weight:700;line-height:1.08;letter-spacing:-.04em;margin:22px 0;text-transform:none}
.article-header .lead{max-width:740px;color:var(--muted);font-size:19px}
.article-byline{display:flex;gap:12px;align-items:center;margin-top:28px}
.article-byline>img{height:44px;width:44px;object-fit:cover;object-position:50% 50%;border-radius:50%;background:#fff;box-shadow:0 0 0 1px var(--line)}
.article-byline>div{margin-right:auto;font-size:14px;line-height:1.6}
.article-byline>div a{color:var(--ink);font-weight:600}
.article-byline>div span{font-size:12px;color:var(--muted);display:block}
.icon-button{border:1px solid var(--line);border-radius:10px;width:40px;height:40px;display:grid;place-items:center;color:var(--blue);background:#fff;transition:background .2s}
.icon-button:hover{background:var(--soft)}
.icon-button>.icon{width:17px;height:17px}
.icon-button[aria-pressed=true]{background:var(--yellow);border-color:var(--yellow)}
.article-hero-art{max-width:1100px;margin-bottom:56px}
.article-hero-art .thumb{border-radius:var(--r-lg);box-shadow:var(--shadow)}
.article-hero-photo{width:100%;height:auto;aspect-ratio:2.1;object-fit:cover;object-position:50% 40%;border-radius:var(--r-lg);box-shadow:var(--shadow)}
.article-layout{display:grid;grid-template-columns:240px 1fr;gap:80px;align-items:start;max-width:1100px;padding-bottom:100px}
.article-toc{position:sticky;top:120px}
.article-toc>.eyebrow{font-size:10px;margin-bottom:18px}
.article-toc nav{display:grid;gap:12px}
.article-toc nav a{font-size:13px;line-height:1.45;color:var(--muted);padding-left:12px;border-left:2px solid var(--line);transition:color .2s,border-color .2s}
.article-toc nav a:hover,.article-toc nav a.active{color:var(--blue);border-color:var(--blue)}
.toc-book{position:relative;isolation:isolate;overflow:hidden;margin-top:30px;border-radius:14px;color:#fff;
 background:linear-gradient(168deg,#16389f 0%,#0f2d8f 44%,#081f66 100%);
 box-shadow:0 22px 40px -26px rgba(7,21,64,.95),inset 0 1px 0 rgba(255,255,255,.16)}
.toc-book:before{content:'';position:absolute;top:0;left:0;right:0;height:3px;z-index:2;background:linear-gradient(90deg,var(--yellow),var(--yellow-2) 45%,rgba(255,207,8,0))}
.toc-book-shelf{position:relative;display:grid;place-items:center;padding:24px 20px 22px;
 background:radial-gradient(80% 100% at 50% 0%,rgba(120,160,255,.26),transparent 72%);
 border-bottom:1px solid rgba(255,255,255,.12)}
.toc-book-cover{width:124px;height:auto;
 filter:drop-shadow(0 16px 18px rgba(2,8,32,.55)) drop-shadow(0 3px 5px rgba(2,8,32,.4));
 transition:transform .38s var(--ease),filter .38s var(--ease)}
.toc-book-shelf:hover .toc-book-cover{transform:translateY(-5px) scale(1.03);filter:drop-shadow(0 24px 26px rgba(2,8,32,.62)) drop-shadow(0 4px 6px rgba(2,8,32,.45))}
.toc-book-shelf:focus-visible{outline:3px solid var(--yellow);outline-offset:-3px;border-radius:14px 14px 0 0}
.toc-book-body{display:flex;flex-direction:column;align-items:stretch;gap:9px;padding:18px 20px 20px}
.toc-book-label{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:700;letter-spacing:.14em;line-height:1.5;text-transform:uppercase;color:var(--yellow)}
.toc-book-label:before{content:'';width:7px;height:7px;border-radius:2px;background:var(--yellow);box-shadow:0 0 0 3px rgba(255,207,8,.22)}
.toc-book strong{font-size:17px;line-height:1.3;letter-spacing:-.01em;text-wrap:balance}
.toc-book-sub{font-size:14px;line-height:1.55;color:#c8d5fa}
.toc-book-cta{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:5px;padding:12px 10px;border-radius:9px;white-space:nowrap;
 background:var(--yellow);color:var(--deep);font-size:14px;font-weight:700;line-height:1.25;text-align:center;
 box-shadow:0 10px 20px -10px rgba(255,207,8,.75);transition:background .25s,transform .25s var(--ease),box-shadow .25s var(--ease)}
.toc-book-cta:hover{background:var(--yellow-2);transform:translateY(-2px);box-shadow:0 16px 26px -12px rgba(255,207,8,.9)}
.toc-book-cta .icon{width:14px;height:14px}
@media (prefers-reduced-motion:reduce){.toc-book-cover,.toc-book-cta{transition:none}.toc-book-shelf:hover .toc-book-cover{transform:none}}
.article-prose{min-width:0}
.answer-box{background:#eef2fb;border-left:4px solid var(--blue);padding:30px 32px;border-radius:0 var(--r) var(--r) 0}
.answer-box .eyebrow{font-size:10px;margin-bottom:14px}
.answer-box p{font-size:18px!important;line-height:1.7!important;color:var(--ink);margin:0;font-weight:500}
.article-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;margin:26px 0 0}
.article-stats>div{border:1px solid var(--line);border-radius:var(--r);padding:18px 18px 16px;background:#fff}
.article-stats b{display:block;font:800 34px/1 var(--display);color:var(--blue);letter-spacing:-.01em;margin-bottom:8px}
.article-stats span{font-size:12px;line-height:1.45;color:var(--muted)}
.takeaways{margin:34px 0}
.takeaways h2{font-size:22px!important;font-family:var(--body);text-transform:none;letter-spacing:-.02em}
.takeaways ul{padding-left:0;list-style:none;font-size:15px;line-height:1.7;color:var(--ink);margin:14px 0 0;display:grid;gap:8px}
.takeaways li{padding:12px 16px 12px 44px;position:relative;background:var(--soft);border-radius:10px}
.takeaways li:before{content:'';position:absolute;left:16px;top:17px;width:16px;height:16px;border-radius:50%;background:var(--yellow);box-shadow:inset 0 0 0 4px var(--soft),0 0 0 1px var(--yellow)}
.article-prose>section{margin-top:56px;scroll-margin-top:120px}
.article-section-num{font:700 12px var(--display);color:var(--blue);display:inline-block;margin-bottom:12px;letter-spacing:.14em;background:var(--soft);padding:5px 9px;border-radius:6px}
.article-prose h2{font-family:var(--body);text-transform:none;font-size:31px;letter-spacing:-.03em;line-height:1.18}
.article-prose p{font-size:16px;line-height:1.85;margin:18px 0}
.article-prose .prose-list{margin:18px 0;padding-left:22px;font-size:16px;line-height:1.75;color:var(--ink);display:grid;gap:8px}
.article-prose .prose-list b{color:var(--blue)}
.table-intro{font-size:14px!important;color:var(--muted)}
.table-wrap{overflow-x:auto;margin:20px 0;border:1px solid var(--line);border-radius:var(--r);background:#fff}
.data-table{width:100%;border-collapse:collapse;font-size:14px;min-width:560px}
.data-table caption{caption-side:bottom;text-align:left;font-size:12px;color:var(--muted);padding:12px 16px;border-top:1px solid var(--line)}
.data-table th,.data-table td{text-align:left;padding:14px 16px;border-bottom:1px solid var(--line);vertical-align:top;line-height:1.5}
.data-table thead th{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);background:var(--soft)}
.data-table tbody th{font-weight:600;color:var(--ink)}
.data-table td b{font:700 18px var(--display);color:var(--blue);letter-spacing:.02em}
.data-table td small{display:block;font-size:11px;color:var(--muted)}
.data-table tbody tr:last-child th,.data-table tbody tr:last-child td{border-bottom:0}
.article-chart{background:var(--navy);color:#fff;border-radius:var(--r-lg);padding:clamp(22px,3vw,34px);margin:22px 0;position:relative;overflow:hidden}
.article-chart:before{content:'';position:absolute;inset:0;background:radial-gradient(60% 70% at 100% 0%,rgba(28,68,198,.45),transparent 70%);pointer-events:none}
.article-chart>*{position:relative}
.steps-list{list-style:none;padding:0;margin:20px 0 0;display:grid;gap:0}
.steps-list li{display:flex;gap:18px;padding:18px 0;border-top:1px solid var(--line)}
.steps-list li:last-child{border-bottom:1px solid var(--line)}
.steps-list li>span{font:800 26px/1 var(--display);color:var(--blue);min-width:38px;padding-top:2px}
.steps-list strong{font-size:16px;color:var(--ink)}
.steps-list p{font-size:15px;margin:6px 0 0;line-height:1.7}
.article-prose #questions>h2{margin-bottom:24px}
.article-prose .faq-list summary{font-size:16px}
.article-prose .faq-list p{font-size:15px}
.article-source{border-top:1px solid var(--line);margin-top:52px;padding-top:26px}
.article-source h3{font-size:16px}
.article-source p{font-size:14px;line-height:1.75}
.article-source .small{margin-top:-6px}
.article-author-box{display:grid;grid-template-columns:88px minmax(0,1fr);column-gap:22px;align-items:start;padding:24px 0 22px;margin-top:20px;border-top:1px solid var(--line)}
.author-box-avatar{width:88px;height:88px;object-fit:cover;object-position:50% 50%;border-radius:50%;background:#fff;box-shadow:0 0 0 1px var(--line),0 10px 22px -14px rgba(7,21,64,.5)}
.author-box-text{display:flex;flex-direction:column;align-items:flex-start;min-width:0;padding-top:4px}
.author-box-kicker{font-size:12px;font-weight:700;letter-spacing:.14em;line-height:1.1;text-transform:uppercase;color:var(--muted-2)}
.article-author-box h3{font-size:21px;line-height:1.2;letter-spacing:-.01em;margin-top:1px}
.article-author-box p{font-size:15px;margin:8px 0 0;line-height:1.7;color:var(--muted)}
.article-author-box a{display:inline-flex;align-items:center;gap:8px;margin-top:13px;font-size:14px;color:var(--blue);font-weight:700;transition:gap .25s var(--ease),color .2s}
.article-author-box a .icon{width:15px;height:15px}
.article-author-box a:hover{gap:12px;color:var(--blue-2)}
@media (max-width:560px){
 .article-author-box{grid-template-columns:72px minmax(0,1fr);column-gap:16px}
 .author-box-avatar{width:72px;height:72px}
 .article-author-box h3{font-size:19px}
}
.article-cta{position:relative;isolation:isolate;overflow:hidden;margin-top:44px;padding:40px;border-radius:20px;color:#fff;
 background:linear-gradient(150deg,#0b2670 0%,#071540 56%,#050f2e 100%);
 box-shadow:0 34px 64px -38px rgba(7,21,64,.95),inset 0 1px 0 rgba(255,255,255,.1);
 display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"copy cover" "actions actions";column-gap:44px;align-items:center}
.article-cta:before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;
 background:radial-gradient(68% 92% at 100% 0%,rgba(38,84,224,.5),transparent 68%),radial-gradient(52% 64% at 0% 100%,rgba(255,207,8,.1),transparent 70%)}
.article-cta:after{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--yellow),var(--yellow-2) 38%,rgba(28,68,198,.9))}
.article-cta .eyebrow{color:#dbe4ff;margin-bottom:14px}
.article-cta h2{font-family:var(--display);text-transform:uppercase;font-size:38px;line-height:.98;letter-spacing:-.01em;color:#fff}
.article-cta p{color:#c9d6ff;margin:14px 0 0}
.article-cta-copy{grid-area:copy;min-width:0;display:flex;flex-direction:column;align-items:flex-start}
.cta-stats{list-style:none;display:flex;flex-wrap:wrap;gap:14px 34px;margin:26px 0 0;padding:0}
.cta-stats li{display:flex;flex-direction:column;gap:3px;margin:0;padding:0}
.cta-stats li:before{content:none}
.cta-stats strong{font-family:var(--display);font-size:36px;font-weight:700;line-height:.88;color:var(--yellow)}
.cta-stats span{font-weight:700;text-transform:uppercase;color:#a9bbee}
.article-cta-cover{grid-area:cover;justify-self:center;align-self:center;display:block;margin:0 20px 18px 0;transition:transform .45s var(--ease)}
.article-cta-cover>img{width:160px;height:auto;
 filter:drop-shadow(0 22px 26px rgba(2,8,32,.6)) drop-shadow(0 4px 7px rgba(2,8,32,.45));
 transition:filter .45s var(--ease)}
.article-cta-cover:hover{transform:translateY(-6px) rotate(-1.5deg)}
.article-cta-cover:hover>img{filter:drop-shadow(0 32px 34px rgba(2,8,32,.68)) drop-shadow(0 5px 9px rgba(2,8,32,.5))}
.article-cta-cover:focus-visible{outline:3px solid var(--yellow);outline-offset:8px;border-radius:6px}
.article-cta-actions{grid-area:actions;display:flex;flex-wrap:wrap;gap:12px;margin-top:34px;padding-top:28px;border-top:1px solid rgba(255,255,255,.14)}
.article-cta-actions .button{flex:1 1 230px;min-width:0}
@media (prefers-reduced-motion:reduce){.article-cta-cover,.article-cta-cover>img{transition:none}.article-cta-cover:hover{transform:none}}
.not-found{min-height:65vh;display:flex;align-items:center}

/* ---------- toast, dialog, reveal ---------- */
.toast{position:fixed;left:50%;bottom:30px;transform:translate(-50%,25px);background:var(--navy);color:#fff;border-radius:10px;padding:13px 24px;font-size:13px;font-weight:500;z-index:300;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;max-width:90%;text-align:center;box-shadow:var(--shadow-lg)}
.toast.visible{transform:translate(-50%,0);opacity:1}
dialog{width:min(540px,calc(100% - 36px));border:0;border-radius:var(--r-lg);padding:46px;color:var(--ink);background:var(--paper);box-shadow:var(--shadow-lg)}
dialog::backdrop{background:rgba(6,19,44,.7);backdrop-filter:blur(6px)}
.dialog-close{position:absolute;right:16px;top:16px;width:36px;height:36px;display:grid;place-items:center;border-radius:8px}
.dialog-close:hover{background:var(--soft)}
.dialog-close>.icon{width:18px}
.dialog-icon{height:56px;width:56px;display:grid;place-items:center;border-radius:12px;background:var(--yellow);color:var(--blue);margin-bottom:24px}
.dialog-icon>.icon{height:28px;width:28px}
dialog h2{font-size:48px}
dialog p{font-size:15px}
dialog .button{margin:5px 0;width:100%}
.js-reveal .reveal-ready{opacity:0;transform:translateY(22px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.js-reveal .reveal-ready.is-visible,.reveal-done .reveal-ready{opacity:1;transform:none}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media(min-width:1500px){.hero-inner{min-height:800px}.hero-author-photo{max-height:800px;max-width:620px}.hero h1{font-size:120px}}
@media(max-width:1180px){
 .container{width:calc(100% - 64px)}
 .header-inner{width:calc(100% - 44px);gap:16px}
 .desktop-nav{gap:18px}.desktop-nav>a{font-size:13px}.nav-ctas{gap:14px;margin-left:6px}
 .brand-name strong{font-size:24px}.brand-mark{width:36px;height:36px}
 .hero h1{font-size:clamp(64px,7.4vw,96px)}.hero-inner{gap:24px;min-height:680px}.hero-author-photo{max-height:660px}
 .float-card b{font-size:34px}
 .skills-layout,.book-layout,.resources-layout,.author-layout,.faq-layout,.split-heading,.contact-layout{gap:56px}
 .salary-tiles{grid-template-columns:repeat(2,1fr)}
 .search-box{min-width:200px;max-width:260px}
 .footer-top{gap:24px}
 .article-layout{gap:50px;grid-template-columns:210px 1fr}
}
@media(max-width:1000px){
 .nav-buy{display:none}.nav-ctas{margin-left:0}
 .hero-inner{grid-template-columns:1fr .9fr;min-height:620px}.hero h1{font-size:clamp(60px,8vw,84px)}.hero-subtitle{font-size:15px}
 .hero-actions .button{padding:14px 18px;font-size:14px}.hero-copy{padding:64px 0 80px}
 .hero-author-photo{max-height:580px}.float-card{padding:12px 16px}.float-card b{font-size:30px}.float-card span{font-size:10px}
 .hero-author-chip{display:none}
 .section-top{align-items:flex-start;flex-direction:column;gap:18px}.section-top .text-link{margin:0}
 .split-heading{grid-template-columns:1fr;gap:28px}
 .principle-grid{gap:28px;margin-top:48px}
 .roadmap-track{grid-template-columns:repeat(3,1fr);gap:18px}.roadmap-line{display:none}.roadmap-step p{min-height:0}
 .skills-layout{grid-template-columns:1fr;gap:40px}.skills-layout>div:first-child{position:relative}.skill-stamp{position:absolute;right:0;bottom:0;margin:0}.skills-layout .section-heading{padding-right:150px}
 .skill-grid{grid-template-columns:repeat(2,1fr)}
 .project-showcase{gap:36px}.project-visual h3{font-size:26px}
 .book-layout{gap:40px}.buy-visual{min-height:540px}.buy-visual .book-scene{width:250px;height:375px}.book-copy h2{font-size:64px}
 .chapter-groups{gap:0 28px}.chapter-range{display:none}.chapter-groups summary .icon{margin-left:auto}
 .resources-layout{gap:40px}.resources-band h2{font-size:54px}.pack-visual{min-height:380px}
 .compare-head,.compare-row{grid-template-columns:.6fr 1fr 1.3fr}.compare-row span{padding:18px 18px;font-size:14px}.compare-head span{padding:16px 18px}
 .audience-grid{grid-template-columns:repeat(2,1fr);gap:20px}
 .article-grid{gap:18px}.article-card-body{padding:20px}.article-card h3{font-size:20px}
 .author-layout{gap:44px}.faq-layout{gap:44px;grid-template-columns:1fr}.faq-aside{position:static}.faq-book{display:none}
 .final-photo{width:64%}.final-inner{grid-template-columns:minmax(0,520px)}
 .footer-top{grid-template-columns:1.8fr 1fr 1fr;gap:28px}
 .two-col{gap:44px}.about-hero h1{font-size:72px}
 .contact-layout{gap:36px;grid-template-columns:1fr}.contact-details{max-width:600px}.contact-portrait{width:200px;height:200px}
 .article-layout{grid-template-columns:1fr;max-width:760px}.article-toc{position:static}.article-toc nav{grid-template-columns:1fr 1fr;gap:12px}.toc-book{display:none}
 .featured-article{gap:30px;padding:22px}
}
@media(max-width:780px){
 .container{width:calc(100% - 44px)}
 .header{height:72px}.header-inner{width:calc(100% - 36px)}.desktop-nav{display:none}.nav-ctas{margin-left:auto}.nav-ctas .button{min-height:40px;font-size:12px;padding:8px 12px}
 .menu-toggle{display:grid;place-items:center;width:40px;height:40px;border-radius:8px;border:1px solid var(--line);background:#fff}.menu-toggle>.icon{width:20px;height:20px}
 #mobile-nav{position:absolute;top:72px;left:0;right:0;background:var(--paper);border-bottom:1px solid var(--line);padding:16px 22px 22px;box-shadow:var(--shadow);display:grid;grid-template-columns:1fr 1fr;gap:6px}
 #mobile-nav>a{padding:12px 10px;font-size:15px;font-weight:500;border-radius:8px}#mobile-nav>a:hover{background:var(--soft)}
 #mobile-nav>a:nth-last-child(-n+2){font-weight:700;color:var(--blue);background:var(--soft)}
 html{scroll-padding-top:90px}
 .hero-inner{grid-template-columns:1fr;gap:0;min-height:0}
 .hero-copy{padding:56px 0 20px}.hero h1{font-size:clamp(62px,15vw,92px)}.hero-badge{font-size:9px;padding:8px 12px;margin-bottom:26px;letter-spacing:.1em}
 .hero-subtitle{font-size:15px;margin:24px 0 28px}.hero-actions{gap:10px}.hero-actions .button{width:100%;justify-content:space-between}
 .hero-proof{margin-top:30px;gap:14px 0}.hero-proof li{padding-right:16px;margin-right:16px}.hero-proof b{font-size:24px}
 .hero-showcase{min-height:0;padding-top:24px;max-width:440px;margin:0 auto;width:100%}.hero-author-photo{max-height:520px;transform:none!important}
 .float-a{top:16%;left:-6%}.float-b{bottom:20%;right:-6%}
 .marquee{height:48px}.marquee-track span{font-size:16px;padding:0 22px}
 h2{font-size:clamp(36px,8vw,52px)}
 .large-copy{font-size:19px}
 .principle-grid{grid-template-columns:1fr;gap:26px}
 .salary-tiles{gap:12px}.salary-tile{padding:22px 20px}.salary-chart-wrap{padding:18px 14px 22px;margin-top:24px}
 .roadmap-track{grid-template-columns:1fr 1fr;gap:14px}.roadmap-step{padding:22px 20px}.roadmap-step h3{font-size:21px}.roadmap-step p{font-size:13px}
 .skills-layout .section-heading{padding-right:0}.skill-stamp{display:none}.skill-grid{grid-template-columns:1fr 1fr;column-gap:18px}.skill-item{font-size:13px;padding:13px 0}
 .project-showcase{grid-template-columns:1fr;gap:28px}.project-list h3{font-size:17px}.project-list small{font-size:12px}
 .book-layout{grid-template-columns:1fr;gap:36px}.buy-visual{min-height:500px}.buy-visual .book-scene{width:240px;height:360px}.best-badge{width:96px;height:96px;font-size:11px;left:16px;top:16px}.edition-badge{right:16px;top:16px}
 .contents-section{padding-top:64px}.contents-section h3{font-size:30px}.chapter-groups{grid-template-columns:1fr}.chapter-range{display:inline}.chapter-groups summary>.icon{margin-left:0}.chapter-groups summary{font-size:14px}.chapter-groups ol{padding-left:60px;font-size:13px}
 .resources-layout{grid-template-columns:1fr;gap:30px}.resources-band h2{font-size:clamp(48px,11vw,64px)}.pack-list{grid-template-columns:1fr}.pack-visual{min-height:0;padding:20px 0}.pack-stack{width:min(100%,320px)}.free-seal{width:84px;height:84px;font-size:26px;right:0;bottom:10px}
 .compare-table{margin-top:36px}.compare-head{display:none}.compare-row{grid-template-columns:1fr}.compare-row span{padding:14px 20px}.compare-row .compare-key{padding-top:20px;padding-bottom:4px;background:var(--soft)}.compare-row .compare-bad:before{content:'Elsewhere';font-size:10px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--muted-2);min-width:76px}.compare-row .compare-good:before{content:'Blueprint';font-size:10px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--blue);min-width:76px}
 .audience-grid{grid-template-columns:1fr 1fr;gap:16px}.audience-grid>div{padding:24px 20px}
 .article-grid{grid-template-columns:1fr 1fr;gap:18px}.blog-section .article-grid>.article-card:last-child{display:none}
 .author-layout{grid-template-columns:1fr;gap:32px}.author-image-wrap{max-width:560px}
 .final-cta{min-height:0;display:flex;flex-direction:column;padding-bottom:0}.final-inner{order:1}.final-photo{order:2}.final-cta h2{font-size:clamp(36px,8vw,48px)}.final-actions .button{width:100%;min-width:0}.final-inner{width:calc(100% - 44px);margin:0 auto;padding-bottom:20px}.final-photo{position:relative;width:100%;height:auto;margin-top:8px}.final-photo>img{height:auto;aspect-ratio:16/10;object-position:70% 50%;mask-image:linear-gradient(to bottom,transparent 0,#000 18%);-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 18%)}
 .footer-top{grid-template-columns:1fr 1fr;gap:34px 28px;padding:52px 0 40px}.footer-brand{grid-column:1/-1}
 .footer-bottom{flex-wrap:wrap;row-gap:10px}
 .page-hero{padding:48px 0 56px}.page-hero h1{font-size:clamp(52px,11vw,76px)}
 .filter-toolbar{flex-direction:column;align-items:stretch}.search-box{max-width:none}
 .featured-article{grid-template-columns:1fr;gap:24px;padding:18px}
 .about-hero{padding-top:40px}.about-hero h1{font-size:clamp(56px,12vw,80px)}.about-stats>div{padding:14px 12px 14px 0}.about-stats>div+div{padding-left:12px}.about-stats b{font-size:32px}.about-stats span{font-size:11px}
 .two-col{grid-template-columns:1fr;gap:36px}
 .contact-topics{display:grid;grid-template-columns:1fr;gap:0}.contact-form{padding:28px}.form-row{grid-template-columns:1fr;gap:0}
 .contact-form input,.contact-form select,.contact-form textarea{font-size:16px}
 .article-header{padding:40px 0 30px}.article-header h1{font-size:clamp(32px,6.8vw,44px)}.article-header .lead{font-size:17px}.article-hero-art{margin-bottom:36px}
 .article-toc nav{grid-template-columns:1fr}.article-toc{padding-bottom:24px;border-bottom:1px solid var(--line)}
 .article-cta{column-gap:30px;padding:30px}.article-cta h2{font-size:31px}
 .cta-stats{gap:14px 26px}.cta-stats strong{font-size:31px}
 .article-cta-cover{margin:0 14px 14px 0}.article-cta-cover>img{width:128px}
 .article-cta-actions{margin-top:28px;padding-top:24px}
 .article-stats{grid-template-columns:1fr 1fr}
 .reading-progress{top:72px}
 dialog{padding:36px 28px}dialog h2{font-size:40px}
}
@media(max-width:560px){
 .container{width:calc(100% - 36px)}.header-inner{width:calc(100% - 28px);gap:10px}.header{height:66px}#mobile-nav{top:66px;grid-template-columns:1fr}
 .brand-name{font-size:6.5px;letter-spacing:.08em}.brand-name strong{font-size:21px}.brand-mark{width:32px;height:32px;border-radius:7px}.brand{gap:8px}
 .nav-ctas .button{font-size:11px;padding:8px 10px;min-height:36px;gap:6px}.nav-ctas .button>.icon{display:none}
 .hero-copy{padding:44px 0 12px}.hero h1{font-size:clamp(56px,16.5vw,80px)}.hero-subtitle{font-size:14px}.hero-badge{font-size:8px}
 .hero-proof{gap:10px 0}.hero-proof li{padding-right:12px;margin-right:12px;font-size:12px}.hero-proof b{font-size:22px}
 .hero-showcase{max-width:360px}.hero-author-photo{max-height:440px}
 .float-card{padding:10px 14px;border-radius:10px}.float-card b{font-size:26px}.float-card span{font-size:9px}.float-a{left:-4%;top:12%}.float-b{right:-4%;bottom:18%}
 .marquee{height:44px}.marquee-track span{font-size:14px;padding:0 16px;gap:16px}
 .section{padding:60px 0}h2{font-size:clamp(34px,9.5vw,46px)}
 .eyebrow{font-size:10px;margin-bottom:18px}.section-heading p{font-size:15px}
 .salary-tiles{grid-template-columns:1fr 1fr;gap:10px}.salary-tile{padding:18px 14px;border-radius:14px}.salary-tile b{font-size:40px}.salary-tile strong{font-size:13px}.salary-tile span{font-size:11px}
 .roadmap-track{grid-template-columns:1fr}
 .skill-grid{grid-template-columns:1fr}
 .buy-visual{min-height:460px}.buy-visual .book-scene{width:220px;height:330px}.book-copy h2{font-size:clamp(56px,15vw,72px)}.book-subtitle{font-size:19px}
 .contents-section h3{font-size:26px}
 .audience-grid{grid-template-columns:1fr}
 .article-grid{grid-template-columns:1fr}.blog-section .article-grid>.article-card:last-child{display:block}
 .about-stats{flex-direction:column}.about-stats>div{border-right:0;border-bottom:1px solid var(--line);padding:12px 0}.about-stats>div+div{padding-left:0}.about-stats>div:last-child{border:0}
 .footer-top{grid-template-columns:1fr 1fr;gap:28px 20px}
 .footer-bottom{font-size:11px}
 .page-hero h1{font-size:clamp(48px,13vw,64px)}.page-hero .lead{font-size:17px}
 .featured-article h2{font-size:32px}
 .compact-title{font-size:32px}
 .contact-form{padding:22px}.contact-form h2{font-size:28px}
 .article-header h1{font-size:clamp(30px,8vw,38px)}
 .answer-box{padding:22px}.answer-box p{font-size:16px!important}
 .article-prose h2{font-size:26px}.article-prose p{font-size:15px}
 .article-stats{grid-template-columns:1fr 1fr;gap:10px}.article-stats b{font-size:28px}
 .article-page .soft-section .article-card:last-child{display:none}
 .not-found h1{font-size:52px}
}
@media(max-width:380px){.nav-ctas .button{font-size:10px;padding:8px}.brand-name strong{font-size:19px}.hero h1{font-size:54px}.salary-tiles{grid-template-columns:1fr}.article-stats{grid-template-columns:1fr}}

/* ---------- Free companion pack reference redesign ---------- */
.resources-band-redesign{min-height:900px;padding:78px 0 70px;background:radial-gradient(circle at 77% 18%,#1260ed 0,#0749ca 31%,#0637a8 61%,#05267f 100%)}
.resources-band-redesign:before{background:radial-gradient(42% 62% at 83% 28%,rgba(73,144,255,.48),transparent 72%),linear-gradient(90deg,rgba(0,12,71,.2),transparent 50%)}
.resources-band-redesign>.resources-layout{width:min(1490px,calc(100% - 104px));grid-template-columns:minmax(600px,.92fr) minmax(650px,1.08fr);gap:34px;align-items:center}
.resources-band-redesign .resources-copy{position:relative;z-index:2;min-width:0}
.resources-band-redesign .eyebrow{margin-bottom:29px;font-size:12px;letter-spacing:.24em}
.resources-band-redesign h2{font-size:clamp(68px,5.25vw,88px);font-weight:800;line-height:.9;letter-spacing:-.012em}
.resources-band-redesign .resources-copy>p{max-width:590px;margin:27px 0 23px;color:#e1e9ff;font-size:19px;line-height:1.48}
.resources-band-redesign .resources-copy>.button{width:min(100%,400px);min-height:63px;justify-content:space-between;padding:17px 30px;border-radius:11px;font-size:17px;box-shadow:0 15px 30px -15px rgba(255,207,0,.7)}
.pack-benefits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:34px}
.pack-benefits>a{position:relative;display:grid;grid-template-columns:58px minmax(0,1fr);grid-template-rows:auto auto;align-items:center;column-gap:13px;min-height:120px;padding:17px 15px;border:1px solid rgba(142,181,255,.45);border-radius:14px;background:linear-gradient(145deg,rgba(10,72,189,.72),rgba(3,45,143,.58));box-shadow:inset 0 1px 0 rgba(255,255,255,.06);transition:transform .2s,border-color .2s,background .2s}
.pack-benefits>a:hover{transform:translateY(-4px);border-color:rgba(204,224,255,.85);background:linear-gradient(145deg,rgba(15,88,218,.86),rgba(4,53,158,.72))}
.pack-benefits>a{position:relative}
.pack-benefits>a:focus-visible{outline:2px solid var(--yellow);outline-offset:3px;border-radius:14px;border-color:rgba(255,212,0,.7)}
.pack-benefits>a:active{transform:translateY(-1px) scale(.98);transition-duration:.08s}
.pack-go{position:absolute;top:10px;right:10px;width:24px;height:24px;display:grid;place-items:center;border-radius:50%;background:var(--yellow);color:#0b1233;opacity:0;transform:translate(-6px,6px) scale(.7);transition:opacity .25s,transform .35s cubic-bezier(.34,1.56,.64,1)}
.pack-benefits .pack-go .icon{width:13px;height:13px;color:#0b1233;stroke-width:2.6;rotate:-45deg}
.pack-benefits>a:is(:hover,:focus-visible) .pack-go{opacity:1;transform:none}
@media(hover:none){.pack-go{opacity:.9;transform:none;background:rgba(255,212,0,.16)}.pack-benefits .pack-go .icon{color:#ffd400}}
.pack-more{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:14px;margin-top:14px;padding:12px 14px 12px 12px;border:1px dashed rgba(142,181,255,.5);border-radius:14px;background:rgba(3,40,130,.35);color:#c8d9ff;overflow:hidden;isolation:isolate;transition:border-color .25s,background .25s,transform .2s}
.pack-more:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(100deg,transparent 30%,rgba(255,212,0,.14) 50%,transparent 70%);translate:-100% 0;transition:translate .8s cubic-bezier(.22,1,.36,1)}
.pack-more>b{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--yellow);color:#0b1233;font-size:15px;font-weight:800;letter-spacing:-.02em;box-shadow:0 0 0 5px rgba(255,212,0,.14);transition:scale .5s cubic-bezier(.34,1.56,.64,1)}
.pack-more strong{display:block;font-size:14px;line-height:1.3;color:#fff}
.pack-more small{display:block;margin-top:3px;font-size:12px;line-height:1.35;color:#c8d9ff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pack-more>i{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;border:1px solid rgba(154,196,255,.45);color:#ffd400;transition:background .25s,color .25s,border-color .25s}
.pack-more .icon{width:16px;height:16px;transition:transform .3s cubic-bezier(.34,1.56,.64,1)}
.pack-more:hover,.pack-more:focus-visible{border-style:solid;border-color:rgba(255,212,0,.6);background:rgba(10,72,189,.6)}
.pack-more:hover:before{translate:100% 0}
.pack-more:hover>b{scale:1.1}
.pack-more:hover>i,.pack-more:focus-visible>i{background:var(--yellow);border-color:var(--yellow);color:#0b1233}
.pack-more:hover .icon{transform:translateX(3px)}
.pack-more:focus-visible{outline:2px solid var(--yellow);outline-offset:3px;border-radius:14px}
.pack-more:active{transform:scale(.99)}
.pack-armed .pack-benefits:not(.pack-in)+.pack-more{opacity:0}
@media(prefers-reduced-motion:no-preference){.pack-benefits.pack-in+.pack-more{animation:pack-card-in .9s cubic-bezier(.22,1,.36,1) .85s backwards}}
@media(max-width:700px){.pack-more{gap:10px;padding:10px}.pack-more>b{width:38px;height:38px;font-size:13px}.pack-more strong{font-size:13px}.pack-more small{font-size:11px;white-space:normal}.pack-more>i{width:30px;height:30px}.pack-go{width:20px;height:20px;top:7px;right:7px}}
.pack-benefits>a>span{grid-row:1/3;width:58px;height:58px;display:grid;place-items:center;border:1px solid rgba(154,196,255,.38);border-radius:50%;background:radial-gradient(circle at 35% 30%,#246cdd,#0a3eaa 72%)}
.pack-benefits .icon{width:31px;height:31px;color:#ffd400;stroke-width:2}
.pack-benefits strong{align-self:end;font-size:14px;line-height:1.28;color:#fff}
.pack-benefits small{align-self:start;margin-top:6px;font-size:11px;line-height:1.35;color:#c8d9ff}
.resources-band-redesign .pack-visual{min-height:740px;align-items:flex-start;justify-content:flex-end;padding-top:0}
.resources-band-redesign .pack-visual:before{content:'';position:absolute;width:92%;height:70%;right:-8%;bottom:1%;border-radius:50%;background:radial-gradient(ellipse,rgba(71,140,255,.34),rgba(13,65,177,.12) 48%,transparent 72%);filter:blur(5px)}
.resources-band-redesign .pack-stack{position:relative;z-index:1;width:min(100%,700px);max-width:none;margin-top:115px;filter:drop-shadow(0 42px 42px rgba(0,18,67,.58))}
.pack-note{position:absolute;z-index:2;right:0;top:22px;margin:0;font:italic 24px/1.2 "Comic Sans MS","Bradley Hand",cursive;color:#e2eaff;transform:rotate(-5deg)}
.pack-note:before{content:'↙';position:absolute;left:-55px;top:38px;font:40px/1 "Comic Sans MS","Bradley Hand",cursive;transform:rotate(12deg)}
@media(max-width:1320px){
 .resources-band-redesign>.resources-layout{width:calc(100% - 72px);grid-template-columns:minmax(540px,.95fr) minmax(540px,1.05fr);gap:24px}.resources-band-redesign h2{font-size:clamp(62px,5.2vw,74px)}.resources-band-redesign .resources-copy>p{font-size:17px}.pack-benefits>a{grid-template-columns:48px 1fr;min-height:108px;padding:14px 12px}.pack-benefits>a>span{width:48px;height:48px}.pack-benefits .icon{width:27px;height:27px}.resources-band-redesign .pack-stack{width:min(100%,650px)}.pack-note{right:4px;font-size:20px}
}
@media(max-width:1040px){
 .resources-band-redesign{padding:70px 0 76px}.resources-band-redesign>.resources-layout{grid-template-columns:1fr;gap:25px}.resources-band-redesign .resources-copy{max-width:760px}.resources-band-redesign h2{font-size:clamp(67px,8.4vw,86px)}.resources-band-redesign .resources-copy>p{font-size:19px}.resources-band-redesign .pack-visual{min-height:650px;justify-content:center}.resources-band-redesign .pack-stack{width:min(100%,660px)}.pack-note{right:6%;top:22px;font-size:23px}
}
@media(max-width:700px){
 .resources-band-redesign{min-height:0;padding:59px 0 67px}.resources-band-redesign>.resources-layout{width:calc(100% - 36px);gap:28px}.resources-band-redesign .eyebrow{margin-bottom:23px;font-size:9px}.resources-band-redesign h2{font-size:clamp(49px,13.4vw,68px)}.resources-band-redesign .resources-copy>p{margin:23px 0 21px;font-size:15px}.resources-band-redesign .resources-copy>.button{width:100%;min-height:56px;padding:14px 18px;font-size:14px}.pack-benefits{grid-template-columns:1fr 1fr;gap:10px;margin-top:25px}.pack-benefits>a{grid-template-columns:42px 1fr;min-height:101px;padding:12px 10px;column-gap:10px}.pack-benefits>a>span{width:42px;height:42px}.pack-benefits .icon{width:24px;height:24px}.pack-benefits strong{font-size:12px}.pack-benefits small{font-size:9px}.resources-band-redesign .pack-visual{min-height:0;padding:0}.resources-band-redesign .pack-stack{width:min(100%,480px);margin-top:84px}.pack-note{right:0;top:6px;font-size:17px}.pack-note:before{left:-38px;top:28px;font-size:31px}
}
@media(max-width:390px){
 .pack-benefits{grid-template-columns:1fr}.pack-benefits>a{min-height:88px}.resources-band-redesign .pack-stack{margin-top:0}.pack-note{display:none}
}
/* Companion pack motion. pack-motion.js drives it with classes: pack-armed (script running, content may be hidden) →
   pack-in (per group: .resources-copy, .pack-benefits, .pack-visual, added as each scrolls into view).
   pack-running is set only while the section is on screen, so ambient loops pause off screen. */
.resources-band-redesign h2 .pack-line{display:block}
.resources-band-redesign h2>.pack-line:nth-child(2){--d:.1s}
.resources-band-redesign h2 .hl>.pack-line:nth-child(1){--d:.22s}
.resources-band-redesign h2 .hl>.pack-line:nth-child(2){--d:.32s}
.pack-benefits>a:nth-child(2){--i:1}.pack-benefits>a:nth-child(3){--i:2}.pack-benefits>a:nth-child(4){--i:3}.pack-benefits>a:nth-child(5){--i:4}.pack-benefits>a:nth-child(6){--i:5}
@media(prefers-reduced-motion:no-preference){
 .pack-armed .resources-copy:not(.pack-in)>:is(.eyebrow,p,.button),.pack-armed .resources-copy:not(.pack-in) .pack-line,.pack-armed .pack-benefits:not(.pack-in)>a,.pack-armed .pack-visual:not(.pack-in) :is(.pack-note,.pack-stack),.pack-armed .pack-visual:not(.pack-in):before{opacity:0}
 /* Section light breathes slowly */
 .pack-armed:before{transform-origin:83% 28%;animation:pack-ambient 12s ease-in-out infinite alternate}
 /* Copy: eyebrow, then the headline line by line out of a blur, then the paragraph and button */
 .resources-copy.pack-in>.eyebrow{animation:pack-rise .9s cubic-bezier(.22,1,.36,1) backwards}
 .resources-copy.pack-in>.eyebrow>span{animation:pack-pop .8s cubic-bezier(.34,1.56,.64,1) .15s backwards,pack-ping 2.8s cubic-bezier(.22,1,.36,1) 1.4s infinite}
 .resources-copy.pack-in .pack-line{animation:pack-line-in 1.1s cubic-bezier(.22,1,.36,1) var(--d,0s) backwards}
 /* The yellow lines carry a light sweep that repeats while on screen */
 .pack-armed .hl .pack-line{background:linear-gradient(105deg,var(--yellow) 42%,#fff8cf 50%,var(--yellow) 58%) 100% 0/250% 100% no-repeat;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
 .resources-copy.pack-in .hl .pack-line{animation:pack-line-in 1.1s cubic-bezier(.22,1,.36,1) var(--d,0s) backwards,pack-shimmer 7s cubic-bezier(.45,.05,.55,.95) calc(1.2s + var(--d,0s)) infinite}
 .resources-copy.pack-in>p{animation:pack-rise 1s cubic-bezier(.22,1,.36,1) .45s backwards}
 .pack-armed .resources-copy>.button{position:relative;overflow:hidden;isolation:isolate}
 .pack-armed .resources-copy>.button:after{content:'';position:absolute;top:0;bottom:0;left:0;width:45%;z-index:-1;background:linear-gradient(100deg,transparent,rgba(255,255,255,.6),transparent);translate:-120% 0;pointer-events:none}
 .resources-copy.pack-in>.button{animation:pack-button-in .9s cubic-bezier(.34,1.56,.64,1) .58s backwards}
 .resources-copy.pack-in>.button:after{animation:pack-sheen 5.5s cubic-bezier(.45,.05,.55,.95) 1.6s infinite}
 /* Cards cascade in; each icon badge pops and its stroke draws on */
 .pack-benefits.pack-in>a{animation:pack-card-in .9s cubic-bezier(.22,1,.36,1) calc(.4s + var(--i,0) * 70ms) backwards}
 .pack-benefits.pack-in>a>span{animation:pack-badge-in .8s cubic-bezier(.34,1.56,.64,1) calc(.55s + var(--i,0) * 70ms) backwards}
 .pack-armed .pack-benefits.pack-in .icon path{stroke-dasharray:1;animation:pack-draw 1s cubic-bezier(.65,0,.35,1) calc(.7s + var(--i,0) * 70ms) backwards}
 .pack-benefits>a>span{transition:scale .6s cubic-bezier(.34,1.56,.64,1),box-shadow .35s var(--ease)}
 .pack-benefits .icon{transition:rotate .6s cubic-bezier(.34,1.56,.64,1)}
 /* Stack rises into place then floats; the glow under it breathes in step. The note writes itself in, then the arrow nudges toward the book */
 .pack-visual.pack-in .pack-stack{animation:pack-stack-in 1.4s cubic-bezier(.22,1,.36,1) .1s backwards,pack-float 7s ease-in-out 1.5s infinite}
 .pack-visual.pack-in:before{animation:pack-fade 1.2s cubic-bezier(.22,1,.36,1) .2s backwards,pack-glow 7s ease-in-out 1.5s infinite}
 .pack-visual.pack-in .pack-note{animation:pack-write 1.3s cubic-bezier(.65,0,.35,1) .8s backwards}
 .pack-visual.pack-in .pack-note:before{animation:pack-arrow-in .7s cubic-bezier(.34,1.56,.64,1) 1.9s backwards,pack-nudge 2.6s ease-in-out 2.8s infinite}
 .pack-armed:not(.pack-running):before,.pack-armed:not(.pack-running) .pack-visual:before,.pack-armed:not(.pack-running) .button:after,.pack-armed:not(.pack-running) .pack-note:before,.pack-armed:not(.pack-running) :is(.eyebrow>span,.hl .pack-line,.pack-stack){animation-play-state:paused}
}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 .pack-armed .pack-benefits>a{isolation:isolate}
 .pack-armed .pack-benefits>a:before{content:'';position:absolute;inset:0;z-index:-1;border-radius:inherit;background:radial-gradient(190px circle at var(--mx,50%) var(--my,50%),rgba(128,176,255,.3),transparent 72%);opacity:0;transition:opacity .35s var(--ease);pointer-events:none}
 .pack-armed .pack-benefits>a{position:relative}
 .pack-armed .pack-benefits>a:hover:before{opacity:1}
 .pack-armed .pack-benefits>a:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 18px 34px -18px rgba(0,10,60,.8)}
 .pack-armed .pack-benefits>a:hover>span{scale:1.08;box-shadow:0 0 0 6px rgba(255,212,0,.12)}
 .pack-armed .pack-benefits>a:hover .icon{rotate:-10deg}
}
@media(hover:hover) and (pointer:fine) and (min-width:1041px) and (prefers-reduced-motion:no-preference){
 .pack-parallax .pack-stack{transform:perspective(1600px) rotateY(calc(var(--px,0) * 9deg)) rotateX(calc(var(--py,0) * -6deg));transition:transform 1.2s cubic-bezier(.22,1,.36,1)}
 .pack-parallax .pack-note{translate:calc(var(--px,0) * -18px) calc(var(--py,0) * -12px);transition:translate 1.2s cubic-bezier(.22,1,.36,1)}
}
@keyframes pack-ambient{to{scale:1.12;opacity:.72}}
@keyframes pack-rise{from{opacity:0;translate:0 22px}}
@keyframes pack-fade{from{opacity:0}}
@keyframes pack-pop{from{opacity:0;scale:0}}
@keyframes pack-ping{0%{box-shadow:0 0 0 3px rgba(255,207,8,.3)}60%,100%{box-shadow:0 0 0 10px rgba(255,207,8,0)}}
@keyframes pack-line-in{from{opacity:0;translate:0 .42em;filter:blur(12px)}}
@keyframes pack-shimmer{0%{background-position:100% 0}30%,100%{background-position:0 0}}
@keyframes pack-button-in{from{opacity:0;translate:0 18px;scale:.94}}
@keyframes pack-sheen{0%{translate:-120% 0}26%,100%{translate:260% 0}}
@keyframes pack-card-in{from{opacity:0;translate:0 28px;scale:.94;filter:blur(6px)}}
@keyframes pack-badge-in{from{opacity:0;scale:.3;rotate:-40deg}}
@keyframes pack-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes pack-stack-in{from{opacity:0;translate:0 80px;rotate:3deg;scale:.92}}
@keyframes pack-float{0%,100%{translate:0 0}50%{translate:0 -14px}}
@keyframes pack-glow{0%,100%{opacity:1;scale:1}50%{opacity:.7;scale:.93}}
@keyframes pack-write{from{clip-path:inset(-30px 100% -70px -100px)}to{clip-path:inset(-30px -30px -70px -100px)}}
@keyframes pack-arrow-in{from{opacity:0;translate:16px -16px}}
@keyframes pack-nudge{0%,100%{translate:0 0}50%{translate:-6px 6px}}

/* ---------- FAQ: straight answers (home) ---------- */
.faqx{position:relative;overflow:hidden;padding:104px 0 112px;background:radial-gradient(ellipse 70% 60% at 22% 40%,#eaf0ff 0,rgba(234,240,255,0) 70%),linear-gradient(180deg,#f8faff 0,#f3f6fc 100%);isolation:isolate}
.faqx-bg{position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:linear-gradient(rgba(15,45,143,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(15,45,143,.055) 1px,transparent 1px);background-size:56px 56px;-webkit-mask:radial-gradient(ellipse 60% 70% at 25% 45%,#000 0,transparent 75%);mask:radial-gradient(ellipse 60% 70% at 25% 45%,#000 0,transparent 75%)}
.faqx-layout{width:min(1240px,calc(100% - 80px));display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);gap:72px;align-items:start}
.faqx-aside{position:sticky;top:110px}
.faqx-head .eyebrow{margin-bottom:24px;letter-spacing:.22em}
.faqx-head h2{margin:0;font:800 clamp(50px,4.9vw,78px)/.9 var(--display);letter-spacing:-.01em;color:#071331;text-transform:uppercase}
.faqx-line{display:block;overflow:hidden;padding-bottom:.04em;white-space:nowrap}
.faqx-line>*{display:block}
.faqx-line em{font-style:normal;color:#174ac2;background:linear-gradient(90deg,#1c44c6,#0752df);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.faqx-head p{max-width:380px;margin:22px 0 0;font-size:17px;line-height:1.6;color:#4a5d83}

/* Book stage */
.faqx-book{margin:30px 0 0;width:min(100%,400px);display:flex;flex-direction:column;align-items:center}
.faqx-stage{--rx:0deg;--ry:0deg;position:relative;width:100%;aspect-ratio:1/1.08;display:grid;place-items:center;perspective:1100px}
.faqx-halo{position:absolute;inset:12% 8% 10%;border-radius:50%;background:radial-gradient(circle,rgba(28,68,198,.2) 0,rgba(28,68,198,.07) 45%,transparent 70%);filter:blur(6px)}
.faqx-ring{position:absolute;width:78%;aspect-ratio:1;border-radius:50%;border:1.5px dashed rgba(15,45,143,.16)}
.faqx-ring::after{content:"";position:absolute;top:-5px;left:50%;width:9px;height:9px;margin-left:-4.5px;border-radius:50%;background:var(--yellow);box-shadow:0 0 0 4px rgba(255,207,8,.25)}
.faqx-float{position:relative;width:80%;transform:rotateX(var(--rx)) rotateY(var(--ry));transform-style:preserve-3d;transition:transform .5s var(--ease)}
.faqx-float img{display:block;width:100%;height:auto;filter:drop-shadow(0 30px 30px rgba(7,21,64,.25))}
.faqx-book figcaption{margin-top:6px;font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#6a7b9c}

/* Meter */
.faqx-meter{display:flex;align-items:center;gap:16px;margin:4px 0 18px;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#6a7b9c}
.faqx-meter b{display:inline-block;min-width:1ch;color:#0f2d8f;font-variant-numeric:tabular-nums}
.faqx-meter i{position:relative;flex:1;height:4px;border-radius:4px;background:#dfe6f3;overflow:hidden}
.faqx-meter s{position:absolute;inset:0;border-radius:inherit;background:linear-gradient(90deg,#1c44c6,#0752df 70%,var(--yellow));transform:scaleX(var(--faqx-read,0));transform-origin:left;transition:transform .7s var(--ease)}

/* Cards */
.faqx-list{display:grid;gap:12px}
.faqx-item{--mx:50%;--my:50%;position:relative;overflow:hidden;border:1px solid #d9e2f0;border-radius:16px;background:rgba(255,255,255,.82);box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 14px 30px -26px rgba(7,21,64,.4);transition:border-color .35s,box-shadow .45s var(--ease),transform .45s var(--ease),background-color .35s}
.faqx-item::before{content:"";position:absolute;left:0;top:14px;bottom:14px;width:3px;border-radius:0 3px 3px 0;background:linear-gradient(180deg,var(--yellow),#1c44c6);transform:scaleY(0);transform-origin:top;transition:transform .55s var(--ease)}
.faqx-item::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(360px circle at var(--mx) var(--my),rgba(28,68,198,.07),transparent 60%);opacity:0;transition:opacity .3s}
.faqx-item:hover{border-color:#bccbe6;transform:translateY(-2px);box-shadow:0 22px 40px -28px rgba(7,21,64,.45)}
.faqx-item:hover::after{opacity:1}
.faqx-item summary{position:relative;z-index:1;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:20px;padding:20px 22px 20px 20px;cursor:pointer;list-style:none;border-radius:16px}
.faqx-item summary::-webkit-details-marker{display:none}
.faqx-item summary:focus-visible{outline:2px solid #1c44c6;outline-offset:2px}
.faqx-num{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:#eef2fb;font:800 18px/1 var(--display);letter-spacing:.02em;color:#0f2d8f;transition:background-color .35s,color .35s,transform .5s var(--ease)}
.faqx-q{display:flex;flex-direction:column;gap:3px;min-width:0}
.faqx-q small{font-size:10.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#7b8baa;transition:color .35s}
.faqx-q>span{font-size:18px;line-height:1.38;font-weight:700;color:#101933;transition:color .3s}
.faqx-item summary:hover .faqx-q>span{color:#1249c5}
.faqx-toggle{display:grid;place-items:center;width:40px;height:40px;border:1px solid #d5dfed;border-radius:50%;color:#0752df;background:#fff;transition:background-color .35s,border-color .35s,color .35s,transform .55s var(--ease)}
.faqx-toggle .icon{width:18px;height:18px;stroke-width:2}
.faqx-item summary:hover .faqx-toggle{border-color:#0752df}
.faqx-body>div>p{margin:0;padding:0 70px 24px 84px;font-size:15.5px;line-height:1.75;color:#4a5d83}

/* Open state (native, then JS-driven) */
.faqx-item[open],.faqx-js .faqx-item.is-open{border-color:#b9c9ea;background:#fff;box-shadow:0 26px 50px -30px rgba(15,45,143,.45)}
.faqx-item[open]::before,.faqx-js .faqx-item.is-open::before{transform:scaleY(1)}
.faqx-item[open] .faqx-num{background:#0f2d8f;color:#fff}
.faqx-item[open] .faqx-q small{color:#1c44c6}
.faqx-item[open] .faqx-toggle{background:#0f2d8f;border-color:#0f2d8f;color:#fff;transform:rotate(135deg)}
.faqx-js .faqx-item:not(.is-open) .faqx-num{background:#eef2fb;color:#0f2d8f}
.faqx-js .faqx-item:not(.is-open) .faqx-q small{color:#7b8baa}
.faqx-js .faqx-item:not(.is-open) .faqx-toggle{background:#fff;border-color:#d5dfed;color:#0752df;transform:none}
.faqx-js .faqx-item:not(.is-open)::before{transform:scaleY(0)}
.faqx-js .faqx-item:not(.is-open){border-color:#d9e2f0;background:rgba(255,255,255,.82);box-shadow:0 14px 30px -26px rgba(7,21,64,.4)}
.faqx-js .faqx-item.is-open .faqx-num{background:#0f2d8f;color:#fff;transform:rotate(-6deg) scale(1.04)}
.faqx-js .faqx-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .52s var(--ease)}
.faqx-js .faqx-body>div{min-height:0;overflow:hidden}
.faqx-js .faqx-body p{opacity:0;transform:translateY(-8px);transition:opacity .3s,transform .45s var(--ease)}
.faqx-js .faqx-item.is-open .faqx-body{grid-template-rows:1fr}
.faqx-js .faqx-item.is-open .faqx-body p{opacity:1;transform:none;transition:opacity .45s .12s,transform .55s .08s var(--ease)}

/* Foot */
.faqx-foot{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:22px;padding:20px 22px;border:1px dashed #c6d3ea;border-radius:16px;background:linear-gradient(100deg,rgba(255,255,255,.6),rgba(234,240,255,.7))}
.faqx-foot>div:first-child{display:flex;flex-direction:column;gap:2px;min-width:0}
.faqx-foot strong{white-space:nowrap;font:800 24px/1.05 var(--display);letter-spacing:.01em;text-transform:uppercase;color:#071331}
.faqx-foot span{font-size:14px;color:#5b6780}
.faqx-actions{display:flex;gap:10px;flex-shrink:0}
.faqx-actions .button{padding-block:12px;min-height:0}
.faqx-actions .button.outline{background:#fff;border-color:#c9d6ee}

/* Motion */
@media(prefers-reduced-motion:no-preference){
 .faqx-armed .faqx-head:not(.faqx-in) :is(.eyebrow,p),.faqx-armed .faqx-book:not(.faqx-in),.faqx-armed .faqx-main:not(.faqx-in) :is(.faqx-meter,.faqx-item,.faqx-foot){opacity:0}
 .faqx-armed .faqx-head:not(.faqx-in) .faqx-line>*{transform:translateY(105%)}
 .faqx-head.faqx-in .eyebrow{animation:faqx-rise .8s var(--ease) backwards}
 .faqx-head.faqx-in .faqx-line>*{animation:faqx-line 1s cubic-bezier(.22,1,.36,1) backwards}
 .faqx-head.faqx-in .faqx-line:nth-child(2)>*{animation-delay:.09s}
 .faqx-head.faqx-in .faqx-line:nth-child(3)>*{animation-delay:.18s}
 .faqx-head.faqx-in p{animation:faqx-rise .9s var(--ease) .32s backwards}
 .faqx-book.faqx-in{animation:faqx-book 1.2s cubic-bezier(.22,1,.36,1) .1s backwards}
 .faqx-main.faqx-in .faqx-meter{animation:faqx-rise .7s var(--ease) backwards}
 .faqx-main.faqx-in .faqx-item{animation:faqx-card .8s cubic-bezier(.22,1,.36,1) backwards;animation-delay:calc(var(--i)*70ms + .08s)}
 .faqx-main.faqx-in .faqx-foot{animation:faqx-rise .8s var(--ease) .65s backwards}
 .faqx-running .faqx-float img{animation:faqx-float 6s ease-in-out infinite}
 .faqx-running .faqx-ring{animation:faqx-spin 28s linear infinite}
 .faqx-running .faqx-halo{animation:faqx-breathe 6s ease-in-out infinite}
 .faqx-nudge .faqx-halo{animation:faqx-flash .9s var(--ease)}
 .faqx-nudge .faqx-float{animation:faqx-nod .8s cubic-bezier(.34,1.56,.64,1)}
 @keyframes faqx-rise{from{opacity:0;transform:translateY(18px)}}
 @keyframes faqx-line{from{transform:translateY(105%)}}
 @keyframes faqx-book{from{opacity:0;transform:translateY(40px) rotate(-6deg) scale(.94)}}
 @keyframes faqx-card{from{opacity:0;transform:translateX(34px);filter:blur(4px)}}
 @keyframes faqx-float{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-12px) rotate(-1.2deg)}}
 @keyframes faqx-spin{to{transform:rotate(360deg)}}
 @keyframes faqx-breathe{0%,100%{opacity:.85;transform:scale(1)}50%{opacity:1;transform:scale(1.05)}}
 @keyframes faqx-flash{40%{opacity:1;transform:scale(1.14)}}
 @keyframes faqx-nod{35%{scale:1.035}}
}
@media(prefers-reduced-motion:reduce){.faqx-item,.faqx-item *,.faqx-float{transition:none!important}}

@media(max-width:1180px){
 .faqx-layout{width:calc(100% - 56px);gap:44px}
 .faqx-q>span{font-size:16.5px}
 .faqx-body>div>p{padding:0 40px 22px 84px}
 .faqx-foot{flex-direction:column;align-items:flex-start}
}
@media(max-width:900px){
 .faqx{padding:76px 0 84px}
 .faqx-layout{width:calc(100% - 48px);grid-template-columns:1fr;gap:28px}
 .faqx-aside{position:static;display:grid;grid-template-columns:1fr 280px;align-items:center;gap:20px}
 .faqx-book{margin:0;width:100%}
 .faqx-head h2{font-size:clamp(52px,8.4vw,72px)}
}
@media(max-width:640px){
 .faqx{padding:60px 0 68px}
 .faqx-layout{width:calc(100% - 32px)}
 .faqx-aside{grid-template-columns:1fr}
 .faqx-head h2{font-size:clamp(46px,13vw,60px)}
 .faqx-head p{font-size:15.5px}
 .faqx-book{width:min(100%,300px);margin:6px auto 0}
 .faqx-meter{font-size:10.5px}
 .faqx-item summary{gap:12px;padding:15px 14px}
 .faqx-num{width:36px;height:36px;border-radius:10px;font-size:15px}
 .faqx-toggle{width:34px;height:34px}.faqx-toggle .icon{width:16px;height:16px}
 .faqx-q>span{font-size:15.5px}
 .faqx-body>div>p{padding:0 16px 18px 62px;font-size:14.5px;line-height:1.7}
 .faqx-foot{padding:18px 16px}
 .faqx-actions{width:100%;flex-direction:column}
 .faqx-actions .button{justify-content:center}
}

/* ---------- Portfolio projects reference redesign ---------- */
.projects-redesign{position:relative;overflow:hidden;padding:36px 0 52px;background:radial-gradient(ellipse at 56% 38%,#fff 0,#fbfcfe 65%,#f6f9fc 100%)}
.projects-redesign>.container{width:min(1460px,87.5%)}
.projects-heading-row{position:relative;display:flex;justify-content:space-between;align-items:flex-end;gap:60px}
.projects-heading{position:relative;z-index:2;max-width:930px}
.projects-heading .eyebrow{margin-bottom:20px;font-size:11px;letter-spacing:.17em}
.projects-heading h2{font-size:clamp(58px,4.2vw,70px);font-weight:800;line-height:.91;letter-spacing:-.006em;color:#071331}
.projects-heading h2>span,.projects-heading h2>em{display:block;white-space:nowrap}
.projects-heading h2>em{margin-top:4px;color:#164bc7}
.projects-heading>p{max-width:670px;margin:19px 0 0;font-size:17px;line-height:1.5;color:#536482}
.projects-heading-row>.text-link{position:relative;z-index:2;flex-shrink:0;margin:0 8px 12px 0;font-size:15px;gap:18px}
.projects-dots{position:absolute;right:365px;top:68px;width:150px;height:80px;opacity:.7;background-image:radial-gradient(circle,#8fb2ee 1.4px,transparent 1.8px);background-size:25px 25px}
.projects-orbit{position:absolute;right:-210px;top:-325px;width:460px;height:460px;border:58px solid rgba(231,237,248,.52);border-radius:50%}
.projects-redesign .project-showcase{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:46px;align-items:start;margin-top:28px}
.projects-redesign .project-visual>.rag-workflow{min-height:480px;padding:28px 40px 24px;border-radius:15px;background:linear-gradient(145deg,#071947,#062478 68%,#0c42b4);box-shadow:0 24px 50px -36px rgba(4,28,94,.75)}
.projects-redesign .rag-workflow>*{position:relative;z-index:1}
.projects-redesign .rag-workflow:after{content:'';position:absolute;z-index:0;right:40px;top:54px;width:142px;height:96px;border:1px solid rgba(126,176,255,.55);border-radius:13px;background:linear-gradient(145deg,rgba(45,104,221,.28),rgba(20,61,148,.18));box-shadow:-46px 18px 0 -1px rgba(31,80,178,.18),-88px 34px 0 -1px rgba(24,64,147,.13);transform:rotate(7deg)}
.projects-redesign .rag-workflow:before{background:radial-gradient(65% 80% at 82% 10%,rgba(40,94,220,.58),transparent 69%)}
.projects-redesign .rag-workflow figcaption>span{margin-bottom:12px;font-size:10px}
.projects-redesign .rag-workflow figcaption>strong{font-size:48px;line-height:.92}
.projects-redesign .rag-question{margin:24px 0 18px;padding:15px 20px}
.projects-redesign .rag-question b{font-size:17px}
.projects-redesign .rag-steps{gap:42px}
.projects-redesign .rag-steps li{padding:15px 18px}
.projects-redesign .rag-steps li:not(:last-child):after{right:-31px;font-size:26px}
.projects-redesign .rag-steps strong{font-size:16px;margin:8px 0 5px}
.projects-redesign .rag-steps small{font-size:11px}
.projects-redesign .rag-workflow .diagram-note{position:absolute;left:40px;bottom:18px;margin:0;padding-top:13px;width:calc(100% - 80px);border-top:1px solid rgba(255,255,255,.08);font-size:11px!important}
.projects-redesign .project-visual-caption{margin:16px 0 8px;font-size:10px;letter-spacing:.15em;color:#1749bd}
.projects-redesign .project-visual h3{font-size:23px;line-height:1.2;color:#101a35}
.projects-redesign .project-visual p{max-width:none;margin:7px 0 0;font-size:14px;line-height:1.45;color:#5a6884}
.projects-redesign .project-list{overflow:hidden;border:1px solid #d6e0ed;border-radius:16px;background:rgba(255,255,255,.9);box-shadow:0 20px 46px -42px rgba(7,21,64,.35)}
.projects-redesign .project-list>a{min-height:101px;padding:18px 28px;gap:22px;border-bottom:1px solid #dce4ee;transition:background .2s,color .2s,padding-left .2s}
.projects-redesign .project-list>a:first-child{border-top:0}
.projects-redesign .project-list>a:last-child{border-bottom:0}
.projects-redesign .project-list>a:hover{padding-left:32px;background:#f8faff}
.projects-redesign .project-list>a>span{min-width:43px;font-size:31px;color:#7b8ba9}
.projects-redesign .project-list h3{font-size:18px;line-height:1.25;color:#101a35}
.projects-redesign .project-list small{margin-top:5px;font-size:12px;line-height:1.4;color:#60708f}
.projects-redesign .project-list>a>.icon{width:19px;height:19px;color:#0752d9}
.projects-redesign .project-list>a.is-featured{min-height:94px;margin:8px;padding:13px 20px;border:0;border-radius:10px;background:linear-gradient(90deg,#edf3ff,#e6efff)}
.projects-redesign .project-list>a.is-featured:hover{padding-left:24px}
.projects-redesign .project-list>a.is-featured>span,.projects-redesign .project-list>a.is-featured h3{color:#0752d9}
@media(max-width:1200px){
 .projects-redesign>.container{width:calc(100% - 64px)}.projects-heading h2{font-size:clamp(52px,5.2vw,62px)}.projects-redesign .project-showcase{gap:32px}.projects-redesign .project-visual>.rag-workflow{min-height:445px;padding:26px 28px 22px}.projects-redesign .rag-workflow figcaption>strong{font-size:41px}.projects-redesign .rag-workflow .diagram-note{left:28px;width:calc(100% - 56px)}.projects-redesign .rag-steps{gap:20px}.projects-redesign .rag-steps li:not(:last-child):after{right:-18px}.projects-redesign .project-list>a{padding:16px 20px;gap:15px}.projects-redesign .project-list h3{font-size:16px}
}
@media(max-width:900px){
 .projects-redesign{padding:58px 0 68px}.projects-heading-row{align-items:flex-start;flex-direction:column;gap:20px}.projects-heading-row>.text-link{margin:0}.projects-heading h2{font-size:clamp(50px,7vw,62px)}.projects-dots{right:0;top:100px}.projects-orbit{display:none}
 .projects-redesign .project-showcase{grid-template-columns:1fr;gap:30px;margin-top:36px}.projects-redesign .project-visual>.rag-workflow{min-height:460px}.projects-redesign .project-list{width:100%}
}
@media(max-width:620px){
 .projects-redesign{padding:54px 0 62px}.projects-redesign>.container{width:calc(100% - 36px)}.projects-heading .eyebrow{font-size:9px}.projects-heading h2{font-size:clamp(44px,12vw,56px);line-height:.92}.projects-heading h2>span,.projects-heading h2>em{white-space:normal}.projects-heading>p{font-size:15px}.projects-dots{display:none}
 .projects-redesign .project-visual>.rag-workflow{min-height:650px;padding:25px 20px 22px}.projects-redesign .rag-workflow figcaption>strong{font-size:37px}.projects-redesign .rag-workflow:after{right:18px;top:90px;width:95px;height:70px}.projects-redesign .rag-question{margin-top:22px}.projects-redesign .rag-steps{grid-template-columns:1fr;gap:16px}.projects-redesign .rag-steps li:not(:last-child):after{content:'↓';right:50%;top:auto;bottom:-20px;font-size:20px}.projects-redesign .rag-workflow .diagram-note{left:20px;width:calc(100% - 40px)}
 .projects-redesign .project-visual h3{font-size:20px}.projects-redesign .project-list>a{min-height:94px;padding:15px 16px;gap:12px}.projects-redesign .project-list>a:hover{padding-left:19px}.projects-redesign .project-list>a>span{min-width:34px;font-size:27px}.projects-redesign .project-list h3{font-size:15px}.projects-redesign .project-list small{font-size:11px}.projects-redesign .project-list>a.is-featured{margin:7px;padding:13px 12px}.projects-redesign .project-list>a.is-featured:hover{padding-left:15px}
}

/* ---------- Portfolio projects card layout ---------- */
.projects-redesign{padding:68px 0 82px;background:radial-gradient(ellipse at 55% 40%,#fff 0,#fbfcff 64%,#f5f8fc 100%)}
.projects-redesign>.container{width:min(1470px,calc(100% - 112px))}
.projects-heading-row{display:block;min-height:290px}
.projects-heading{max-width:1060px}
.projects-heading .eyebrow{margin-bottom:27px;font-size:12px;letter-spacing:.18em}
.projects-heading h2{font-size:clamp(70px,5.8vw,96px);line-height:.89;letter-spacing:-.012em}
.projects-heading h2>em{position:relative;width:max-content;max-width:100%;margin-top:8px;color:#1352de}
.projects-heading h2>em:after{content:'';position:absolute;left:0;bottom:-17px;width:330px;max-width:42%;height:6px;border-radius:999px;background:#ffc800;transform:rotate(-2deg)}
.projects-heading>p{max-width:780px;margin:32px 0 0;font-size:20px;line-height:1.5;color:#415b93}
.projects-note{position:absolute;right:82px;top:70px;margin:0;padding-bottom:13px;font:italic 27px/1.15 "Comic Sans MS","Bradley Hand",cursive;color:#7795d5;transform:rotate(-5deg)}
.projects-note:after{content:'';position:absolute;left:20px;right:-24px;bottom:0;height:3px;border-radius:50%;background:#87a8ea;transform:rotate(-8deg)}
.project-card-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px;margin-top:34px}
.project-card{position:relative;min-width:0;min-height:420px;overflow:hidden;padding:28px 28px 32px;border-radius:14px;background:radial-gradient(circle at 68% 24%,#1260f2 0,#0752dc 42%,#063fc2 100%);box-shadow:0 24px 35px -25px rgba(0,61,190,.62);color:#fff;transition:opacity .45s var(--ease),transform .5s cubic-bezier(.34,1.56,.64,1),box-shadow .45s var(--ease)}
/* Card sheen lives in a second background layer so the base gradient overlay is kept */
.project-card:before{content:'';position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.2) 50%,transparent 65%) no-repeat 140% 0/260% 100%,linear-gradient(135deg,rgba(255,255,255,.08),transparent 42%,rgba(2,25,107,.13));pointer-events:none;transition:background-position .9s var(--ease)}
.project-card:after{content:'';position:absolute;z-index:2;left:24px;right:24px;top:0;height:4px;border-radius:0 0 4px 4px;background:#ffc800;transform:scaleX(0);transform-origin:left;transition:transform .55s var(--ease);pointer-events:none}
.project-card-number{transform-origin:left center;transition:color .3s var(--ease)}
.project-card-art svg{transition:transform .5s cubic-bezier(.34,1.56,.64,1),filter .45s var(--ease)}
.project-card p{transition:transform .45s cubic-bezier(.34,1.56,.64,1)}
@media(hover:hover) and (pointer:fine){
 .project-card-grid .project-card:hover,.project-card-grid .project-card:focus-visible{z-index:2;transform:translateY(-12px) scale(1.03);box-shadow:0 38px 60px -26px rgba(0,61,190,.8),0 14px 26px -16px rgba(2,25,105,.45)}
 .project-card-grid:has(.project-card:hover) .project-card:not(:hover){opacity:.7;transform:scale(.98)}
 .project-card:hover:before{background-position:-40% 0,0 0}
 .project-card:hover:after,.project-card:focus-visible:after{transform:scaleX(1)}
 .project-card:hover .project-card-number,.project-card:focus-visible .project-card-number{color:#fff;animation:roadmap-badge-pop .65s cubic-bezier(.34,1.56,.64,1)}
 .project-card:hover .project-card-art svg{transform:translateY(-6px) scale(1.07);filter:drop-shadow(0 22px 22px rgba(2,25,105,.34))}
 .project-card:hover p{transform:translateX(4px)}
}
.project-card:focus-visible{outline:4px solid #ffc800;outline-offset:4px}
.project-card-number{position:relative;z-index:1;display:block;font:700 52px/1 var(--display);color:#a7c5ff}
.project-card-art{position:relative;z-index:1;display:flex;height:128px;align-items:center;justify-content:center;margin:2px -6px 4px}
.project-card-art svg{display:block;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 14px 18px rgba(2,25,105,.24))}
.project-card-art circle:not(.art-white):not(.art-none){fill:#0752df}.project-card-art .art-white{fill:#fff}.project-card-art .art-soft{fill:#4290ff}.project-card-art .art-mid{fill:#7ab1ff}.project-card-art .art-deep{fill:#0752df}.project-card-art .art-pale{fill:#eaf3ff}.project-card-art .art-none{fill:none}.project-card-art .art-stroke,.project-card-art .art-stroke-soft,.project-card-art .art-stroke-mid,.project-card-art .art-stroke-light{fill:none;stroke-linecap:round;stroke-linejoin:round}.project-card-art .art-stroke{stroke:#0752df;stroke-width:7}.project-card-art .art-stroke-soft{stroke:#79a9ff;stroke-width:7}.project-card-art .art-stroke-mid{stroke:#5295ff;stroke-width:6}.project-card-art .art-stroke-light{stroke:#fff;stroke-width:6}
.project-card h3{position:relative;z-index:1;margin:3px 0 18px;font:800 31px/1.08 var(--display);letter-spacing:-.01em;color:#fff}
.project-card p{position:relative;z-index:1;margin:0;font-size:16px;line-height:1.45;color:#fff}
.projects-footer{display:flex;justify-content:flex-end;min-height:114px;padding:28px 26px 0 0}
.projects-all-link{display:flex;align-items:center;gap:14px;color:#0752df;transform:rotate(-3deg)}
.projects-all-link>svg{width:76px;height:60px;overflow:visible;fill:none;stroke:currentColor;stroke-width:4;stroke-linecap:round;stroke-linejoin:round}
.projects-all-link>span{font:italic 25px/1.05 "Comic Sans MS","Bradley Hand",cursive}
.projects-all-link small{display:block;margin-top:5px;font-size:16px;color:#7693d1}
.projects-all-link:hover>span{text-decoration:underline;text-decoration-color:#ffc800;text-decoration-thickness:4px;text-underline-offset:7px}
@media(max-width:1280px){
 .projects-redesign>.container{width:calc(100% - 64px)}.projects-heading-row{min-height:255px}.projects-heading h2{font-size:clamp(65px,6vw,78px)}.projects-heading>p{font-size:18px}.projects-note{right:35px;font-size:23px}
 .project-card{min-height:390px;padding:24px 20px 28px}.project-card-number{font-size:46px}.project-card-art{height:112px}.project-card h3{font-size:27px}.project-card p{font-size:14px}
}
@media(max-width:980px){
 .projects-redesign{padding:62px 0 72px}.projects-heading-row{display:block;min-height:0}.projects-heading h2{font-size:clamp(57px,7.7vw,72px)}.projects-note{display:none}
 .project-card-grid{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:56px}.project-card{min-height:390px}.project-card:nth-child(n+4){min-height:365px}.projects-footer{padding-right:0}
}
@media(max-width:700px){
 .projects-redesign>.container{width:calc(100% - 36px)}.projects-heading .eyebrow{font-size:9px}.projects-heading h2{font-size:clamp(47px,13.3vw,64px);line-height:.91}.projects-heading h2>span,.projects-heading h2>em{white-space:normal}.projects-heading h2>em:after{bottom:-12px;width:210px;height:4px}.projects-heading>p{margin-top:27px;font-size:15px}.projects-heading>p br{display:none}
 .project-card-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:42px}.project-card{min-height:372px;padding:22px 19px 25px}.project-card:nth-child(n+4){min-height:372px}.project-card-number{font-size:43px}.project-card-art{height:105px;margin-left:-8px;margin-right:-8px}.project-card h3{font-size:25px}.project-card p{font-size:13px}.projects-all-link>span{font-size:22px}.projects-all-link small{font-size:14px}
}
@media(max-width:480px){
 .projects-redesign{padding:55px 0 64px}.projects-heading h2{font-size:clamp(44px,13.7vw,58px)}.project-card-grid{grid-template-columns:1fr;gap:16px}.project-card,.project-card:nth-child(n+4){display:grid;grid-template-columns:72px 1fr;grid-template-rows:auto auto auto;column-gap:12px;min-height:0;padding:24px}.project-card-number{grid-row:1;font-size:48px}.project-card-art{grid-column:1;grid-row:2/4;width:78px;height:94px;margin:0;align-self:start}.project-card h3{grid-column:2;grid-row:1/2;margin:6px 0 10px;font-size:28px}.project-card p{grid-column:2;grid-row:2/4;font-size:14px}.projects-footer{min-height:100px;padding-top:24px}.projects-all-link>svg{width:62px}.projects-all-link>span{font-size:20px}.projects-all-link small{font-size:12px}
}

/* ---------- Skill stack reference redesign ---------- */
.skills-redesign{position:relative;overflow:hidden;padding:78px 0 55px;background:radial-gradient(ellipse at 48% 50%,#fff 0,#fafcfe 64%,#f5f8fc 100%)}
.skills-redesign>.skills-layout{width:min(1640px,85%);display:grid;grid-template-columns:minmax(540px,630px) minmax(0,1fr);gap:60px;align-items:center}
.skills-redesign .skills-copy{position:relative;z-index:1;min-width:0}
.skills-redesign .eyebrow{margin-bottom:34px;font-size:12px;letter-spacing:.2em}
.skills-redesign .skills-copy h2{font-size:clamp(66px,4.4vw,84px);font-weight:800;line-height:.9;letter-spacing:-.006em;color:#071331}
.skills-redesign .skills-copy h2>span,.skills-redesign .skills-copy h2>em{display:block;white-space:nowrap}
.skills-redesign .skills-copy h2>em{margin-top:9px;color:#1746b5}
.skills-redesign .skills-copy>p{max-width:560px;margin:32px 0 25px;font-size:19px;line-height:1.55;color:#5a6885}
.skills-redesign .skills-copy>.text-link{font-size:16px;gap:16px}
.skills-redesign .skills-copy>.text-link .icon{width:20px;height:20px}
.skills-redesign .skill-stamp{position:relative;right:auto;bottom:auto;z-index:2;margin:40px 0 0;display:flex;align-items:center;gap:22px;font-size:126px;line-height:.78;letter-spacing:-.025em;color:#1746b5}
.skills-redesign .skill-stamp>span{padding:7px 0 7px 22px;border-left:3px solid var(--yellow);font-size:13px;line-height:1.55;letter-spacing:.17em;color:#697590}
.skill-dots{position:absolute;z-index:-1;right:-14px;bottom:4px;width:104px;height:92px;opacity:.58;background-image:radial-gradient(circle,#b8c6dd 2px,transparent 2.4px);background-size:23px 23px}
.skill-orbits{position:absolute;z-index:-1;right:-190px;bottom:-2px;width:340px;height:340px;border:1px solid #dbe4f0;border-radius:50%}
.skill-orbits:before,.skill-orbits:after{content:'';position:absolute;border:1px solid #dbe4f0;border-radius:50%}
.skill-orbits:before{inset:36px}.skill-orbits:after{inset:72px}
.skill-orbits:after{box-shadow:-73px -70px 0 -66px var(--yellow)}
.skills-redesign .skill-grid{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;column-gap:72px;align-content:start;padding:28px 40px;border:1px solid #d7e1ed;border-radius:12px;background:rgba(255,255,255,.86);box-shadow:0 18px 48px -42px rgba(7,21,64,.35)}
.skills-redesign .skill-grid:before{content:'';position:absolute;left:50%;top:32px;bottom:32px;width:1px;background:#d8e1ed}
.skills-redesign .skill-item{min-width:0;min-height:56px;padding:0 8px;gap:18px;border-color:#dce4ee;font-size:17px;line-height:1.3;font-weight:500;color:#14203c;transition:color .2s,background .2s,padding-left .2s}
.skills-redesign .skill-item:nth-last-child(-n+2){border-bottom:0}
.skills-redesign .skill-item:hover{padding-left:12px;background:#f7faff;color:#1649bd}
.skills-redesign .skill-item>span{min-width:42px;font-size:14px;letter-spacing:.01em;color:#7886a3}
/* Hover pop, same language as the roadmap cards: the row lifts into a floating card, number becomes a badge, others dim */
.skills-redesign .skill-grid{transition:border-color .4s var(--ease),box-shadow .4s var(--ease)}
.skills-redesign .skill-grid .skill-item{position:relative;border-radius:10px;transition:color .25s var(--ease),background .25s var(--ease),opacity .35s var(--ease),padding-left .45s cubic-bezier(.34,1.56,.64,1),transform .45s cubic-bezier(.34,1.56,.64,1),box-shadow .4s var(--ease),border-color .25s}
.skills-redesign .skill-item:before{content:'';position:absolute;left:0;top:12px;bottom:12px;width:3px;border-radius:3px;background:linear-gradient(180deg,#1746b5,#ffd326);transform:scaleY(0);transition:transform .45s var(--ease);pointer-events:none}
.skills-redesign .skill-item:after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(110deg,transparent 35%,rgba(23,70,181,.08) 50%,transparent 65%) no-repeat;background-size:260% 100%;background-position:140% 0;opacity:0;transition:background-position .9s var(--ease),opacity .3s}
.skills-redesign .skill-item>span{position:relative;z-index:0;transition:color .25s var(--ease)}
.skills-redesign .skill-item>span:before{content:'';position:absolute;z-index:-1;left:-9px;top:50%;width:36px;height:28px;margin-top:-14px;border-radius:8px;background:linear-gradient(135deg,#164ac6,#1137a5);box-shadow:0 8px 18px -6px rgba(18,64,181,.55);opacity:0;transform:scale(.4);transition:opacity .25s var(--ease),transform .45s cubic-bezier(.34,1.56,.64,1)}
@media(hover:hover) and (pointer:fine){
 .skills-redesign .skill-grid:has(.skill-item:hover){border-color:#c3d1ea;box-shadow:0 28px 60px -40px rgba(18,64,181,.35)}
 .skills-redesign .skill-grid:has(.skill-item:hover) .skill-item:not(:hover){opacity:.55}
 .skills-redesign .skill-grid .skill-item:hover,.skills-redesign .skill-grid .skill-item:focus-visible{z-index:3;padding-left:22px;background:#fff;color:#1649bd;border-bottom-color:transparent;transform:translateY(-3px) scale(1.04);box-shadow:0 18px 36px -14px rgba(18,64,181,.35),0 6px 14px -8px rgba(7,21,64,.18)}
 .skills-redesign .skill-item:hover:before,.skills-redesign .skill-item:focus-visible:before{transform:scaleY(1)}
 .skills-redesign .skill-item:hover:after{opacity:1;background-position:-40% 0}
 .skills-redesign .skill-item:hover>span,.skills-redesign .skill-item:focus-visible>span{color:#fff;animation:roadmap-badge-pop .65s cubic-bezier(.34,1.56,.64,1)}
 .skills-redesign .skill-item:hover>span:before,.skills-redesign .skill-item:focus-visible>span:before{opacity:1;transform:none}
}
/* Laptop widths: give the skill list room so names stay on one line */
@media(min-width:1381px) and (max-width:1600px){
 .skills-redesign>.skills-layout{grid-template-columns:480px minmax(0,1fr);gap:40px}
 .skills-redesign .skill-grid{column-gap:28px;padding:24px 22px}
 .skills-redesign .skill-item{gap:14px;font-size:15px}
 .skills-redesign .skill-item>span{min-width:34px}
 .skills-redesign .skill-grid .skill-item:hover,.skills-redesign .skill-grid .skill-item:focus-visible{padding-left:12px}
}
@media(max-width:1380px){
 .skills-redesign>.skills-layout{width:calc(100% - 80px);grid-template-columns:minmax(420px,500px) minmax(0,1fr);gap:42px}.skills-redesign .skills-copy h2{font-size:clamp(58px,4.7vw,70px)}.skills-redesign .skills-copy>p{font-size:17px}.skills-redesign .skill-grid{column-gap:42px;padding:24px 28px}.skills-redesign .skill-item{font-size:15px}.skills-redesign .skill-stamp{font-size:108px}
}
@media(max-width:1100px){
 .skills-redesign{padding:68px 0 74px}.skills-redesign>.skills-layout{width:calc(100% - 64px);grid-template-columns:1fr;gap:42px}.skills-redesign .skills-copy{max-width:760px}.skills-redesign .skills-copy h2{font-size:clamp(60px,7.5vw,76px)}.skills-redesign .skill-stamp{position:relative;right:auto;bottom:auto}.skill-orbits{right:-70px}.skill-dots{right:100px}
 .skills-redesign .skill-grid{width:100%;column-gap:58px;padding:28px 36px}.skills-redesign .skill-item{font-size:16px}
}
@media(max-width:680px){
 .skills-redesign{padding:58px 0 66px}.skills-redesign>.skills-layout{width:calc(100% - 36px);gap:32px}.skills-redesign .eyebrow{margin-bottom:22px}.skills-redesign .skills-copy h2{font-size:clamp(47px,13.5vw,64px);line-height:.92}.skills-redesign .skills-copy h2>span,.skills-redesign .skills-copy h2>em{white-space:normal}.skills-redesign .skills-copy>p{margin:24px 0 20px;font-size:15px}.skills-redesign .skills-copy>.text-link{font-size:14px}.skills-redesign .skill-stamp{margin-top:32px;font-size:88px}.skills-redesign .skill-stamp>span{font-size:10px;padding-left:16px}.skill-orbits,.skill-dots{display:none}
 .skills-redesign .skill-grid{grid-template-columns:1fr;padding:18px 20px;column-gap:0}.skills-redesign .skill-grid:before{display:none}.skills-redesign .skill-item{min-height:52px;padding:0 4px;font-size:15px}.skills-redesign .skill-item:nth-last-child(2){border-bottom:1px solid #dce4ee}.skills-redesign .skill-item>span{min-width:38px;font-size:13px}
}

/* ---------- Why this book reference redesign ---------- */
.compare-redesign{padding:76px 0 94px;background:radial-gradient(ellipse at 58% 42%,#fff 0,#f9fbfe 66%,#f4f8fc 100%)}
.compare-redesign>.container{width:min(1460px,87.5%)}
.compare-top{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(460px,.85fr);gap:54px;align-items:center}
.compare-heading .eyebrow{margin-bottom:30px;font-size:12px;letter-spacing:.19em}
.compare-heading h2{font-size:clamp(58px,4.2vw,70px);line-height:.91;letter-spacing:-.006em;color:#071331}
.compare-heading h2 span,.compare-heading h2 em{display:block;white-space:nowrap}
.compare-heading h2 em{margin-top:8px;color:#1649bd}
.compare-heading>p{margin:25px 0 0;font-size:20px;line-height:1.5;color:#536382}
.compare-journey{display:grid;grid-template-columns:1fr 56px 1fr;align-items:center;gap:18px;margin-top:10px}
.scatter-side,.path-side{min-width:0;text-align:center}
.scatter-chips{display:grid;grid-template-columns:1fr 1fr;gap:11px 12px;align-items:center;margin-bottom:18px}
.scatter-chips span{display:block;padding:9px 8px;border-radius:7px;background:#f1f4f8;box-shadow:0 8px 18px -16px rgba(7,21,64,.6);font-size:11px;line-height:1.2;color:#3f4f70;transform:rotate(-7deg)}
.scatter-chips span:nth-child(even){transform:rotate(7deg)}
.scatter-chips span:nth-child(3){transform:rotate(-4deg)}
.scatter-chips span:nth-child(4){transform:rotate(8deg)}
.scatter-side strong,.path-side>strong{display:block;font-size:10px;letter-spacing:.2em;line-height:1.4;color:#243657}
.scatter-side small,.path-side>small{display:block;margin-top:5px;font-size:11px;color:#71809d}
.journey-arrow{color:#a7c8ff}
.journey-arrow .icon{width:48px;height:48px;stroke-width:1.7}
.path-card{position:relative;min-height:168px;margin-bottom:17px;padding:23px 22px 18px 42px;border:1px solid #c8dbff;border-radius:13px;background:linear-gradient(145deg,rgba(255,255,255,.94),#f7faff);box-shadow:0 14px 28px -24px rgba(14,73,195,.45);text-align:left}
.path-card ul{list-style:none;margin:0;padding:0;display:grid;gap:17px}
.path-card li{position:relative;font-size:11px;font-weight:500;color:#172442;white-space:nowrap}
.path-card li:before{content:'';position:absolute;width:8px;height:8px;left:-24px;top:5px;border-radius:50%;background:#6da1ff;box-shadow:0 0 0 3px #edf4ff}
.path-line{position:absolute;left:21px;top:32px;bottom:30px;width:2px;background:#a8c7ff}
.path-launch{position:absolute;right:-9px;top:-17px;width:52px;height:52px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(145deg,#2165ef,#0649d2);color:#fff;box-shadow:0 12px 24px -10px rgba(6,73,210,.75)}
.path-launch .icon{width:25px;height:25px}
.path-side>strong{color:#1649bd}
.compare-redesign .compare-table{margin-top:36px;border-color:#d8e0ed;border-radius:20px;overflow:visible;box-shadow:0 22px 55px -46px rgba(7,21,64,.34)}
.compare-redesign .compare-head,.compare-redesign .compare-row{display:grid;grid-template-columns:280px minmax(0,1fr) minmax(0,1.2fr)}
.compare-redesign .compare-head{border-radius:20px 20px 0 0;background:#f7f8fb}
.compare-redesign .compare-head span{min-height:68px;padding:18px 32px;display:flex;align-items:center;font:700 16px/1.2 var(--display);letter-spacing:.12em;color:#66738f}
.compare-redesign .compare-head .compare-good{position:relative;justify-content:space-between;gap:16px;border:1px solid #93b7ff;border-bottom-color:#d4e2ff;border-radius:18px 18px 0 0;background:linear-gradient(90deg,#f1f6ff,#eaf2ff);color:#1750c8}
.compare-head .compare-good b{flex-shrink:0;padding:8px 15px;border-radius:999px;background:#dbe8ff;font:700 10px/1 var(--body);letter-spacing:.1em;color:#1750c8}
.compare-redesign .compare-row{border-top:1px solid #e0e5ee}
.compare-redesign .compare-row span{min-height:82px;padding:14px 30px;font-size:17px;line-height:1.35}
.compare-redesign .compare-key{gap:20px;border-right:1px solid #e0e5ee;font:700 18px/1 var(--display);letter-spacing:.1em;color:#101a35}
.compare-key i{width:52px;height:52px;display:grid;place-items:center;flex-shrink:0;border-radius:12px;background:#f1f4f9;color:#334461;font-style:normal}
.compare-key i .icon{width:27px;height:27px}
.compare-redesign .compare-row .compare-bad{gap:18px;color:#5c6b89}
.compare-redesign .compare-row .compare-bad .icon{width:38px;height:38px;padding:10px;border-radius:50%;background:#ffe8e8;color:#ef4f45;stroke-width:2;flex-shrink:0}
.compare-redesign .compare-row .compare-good{gap:24px;border-left:1px solid #93b7ff;border-right:1px solid #93b7ff;background:linear-gradient(90deg,#f5f8ff,#edf4ff);font-weight:600;color:#152448}
.compare-redesign .compare-row .compare-good .icon{width:38px;height:38px;padding:9px;border-radius:50%;background:linear-gradient(145deg,#2165ef,#0649d2);color:#fff;stroke-width:2.2;flex-shrink:0}
.compare-redesign .compare-row:last-child .compare-good{border-bottom:1px solid #93b7ff;border-radius:0 0 18px 18px}
@media(max-width:1450px){
 .compare-top{grid-template-columns:1fr}.compare-heading{max-width:1000px}.compare-journey{width:min(100%,610px);margin:4px auto 0}
}
@media(max-width:1180px){
 .compare-redesign>.container{width:calc(100% - 64px)}.compare-top{grid-template-columns:1fr;gap:38px}.compare-heading h2{font-size:clamp(51px,5.2vw,64px)}.compare-heading>p{font-size:17px}
 .compare-redesign .compare-head,.compare-redesign .compare-row{grid-template-columns:220px minmax(0,1fr) minmax(0,1.2fr)}.compare-redesign .compare-head span{padding:16px 22px;font-size:14px}.compare-redesign .compare-row span{padding:13px 22px;font-size:15px}.compare-redesign .compare-key{gap:14px;font-size:16px}.compare-key i{width:46px;height:46px}
}
@media(max-width:900px){
 .compare-top{grid-template-columns:1fr}.compare-heading{max-width:760px}.compare-heading h2{font-size:clamp(54px,7.4vw,67px)}.compare-journey{width:min(100%,610px);margin:4px auto 0}
 .compare-redesign .compare-table{margin-top:42px}.compare-redesign .compare-head,.compare-redesign .compare-row{grid-template-columns:170px minmax(0,1fr) minmax(0,1.15fr)}.compare-redesign .compare-row span{padding:12px 16px;font-size:14px}.compare-redesign .compare-key{gap:10px;font-size:14px}.compare-key i{width:40px;height:40px}.compare-key i .icon{width:22px;height:22px}.compare-redesign .compare-row .compare-bad,.compare-redesign .compare-row .compare-good{gap:12px}.compare-redesign .compare-row .compare-bad .icon,.compare-redesign .compare-row .compare-good .icon{width:32px;height:32px;padding:8px}.compare-head .compare-good b{display:none}
}
@media(max-width:700px){
 .compare-redesign{padding:62px 0 72px}.compare-redesign>.container{width:calc(100% - 36px)}.compare-heading .eyebrow{margin-bottom:22px}.compare-heading h2{font-size:clamp(44px,12vw,58px);line-height:.92}.compare-heading h2 span,.compare-heading h2 em{white-space:normal}.compare-heading>p{font-size:16px}.compare-journey{display:none}
 .compare-redesign .compare-table{display:grid;gap:14px;margin-top:34px;border:0;background:transparent;box-shadow:none}.compare-redesign .compare-head{display:none}.compare-redesign .compare-row{grid-template-columns:1fr;overflow:hidden;border:1px solid #d9e2ef;border-radius:14px;background:#fff}.compare-redesign .compare-row span{min-height:0;padding:14px 17px}.compare-redesign .compare-key{border-right:0;background:#f6f8fb;font-size:16px}.compare-redesign .compare-row .compare-bad,.compare-redesign .compare-row .compare-good{gap:12px}.compare-redesign .compare-row .compare-bad:before,.compare-redesign .compare-row .compare-good:before{min-width:68px;font-size:9px;letter-spacing:.13em}.compare-redesign .compare-row .compare-bad:before{content:'Tutorials';color:#9b5a5a}.compare-redesign .compare-row .compare-good:before{content:'Blueprint';color:#1650c8}.compare-redesign .compare-row .compare-good{border:0;border-top:1px solid #c8dcff;border-radius:0;background:#eef4ff}.compare-redesign .compare-row:last-child .compare-good{border:0;border-top:1px solid #c8dcff;border-radius:0}.compare-redesign .compare-row .compare-bad .icon,.compare-redesign .compare-row .compare-good .icon{width:29px;height:29px;padding:7px}
}
/* Why-this-book motion. compare-motion.js drives it with classes: compare-armed (script running, content may be hidden) →
   compare-in (per group: .compare-heading, .compare-journey, .compare-head, each .compare-row, added as it scrolls into view;
   rows entering together get a --row cascade index). compare-running is set only while on screen, so ambient loops pause off screen. */
.scatter-chips span:nth-child(1){--c:0;--fx:-42px;--fy:-30px;--fr:-18deg}
.scatter-chips span:nth-child(2){--c:1;--fx:44px;--fy:-34px;--fr:20deg}
.scatter-chips span:nth-child(3){--c:2;--fx:-54px;--fy:4px;--fr:-14deg}
.scatter-chips span:nth-child(4){--c:3;--fx:52px;--fy:2px;--fr:16deg}
.scatter-chips span:nth-child(5){--c:4;--fx:-38px;--fy:34px;--fr:-20deg}
.scatter-chips span:nth-child(6){--c:5;--fx:46px;--fy:32px;--fr:18deg}
.path-card li:nth-child(2){--i:1}.path-card li:nth-child(3){--i:2}.path-card li:nth-child(4){--i:3}
.compare-row:nth-child(3){--n:1}.compare-row:nth-child(4){--n:2}.compare-row:nth-child(5){--n:3}.compare-row:nth-child(6){--n:4}
@media(prefers-reduced-motion:no-preference){
 .compare-armed .compare-heading:not(.compare-in)>:is(.eyebrow,p),.compare-armed .compare-heading:not(.compare-in) h2>*,.compare-armed .compare-journey:not(.compare-in) :is(.scatter-chips span,.scatter-side>strong,.scatter-side>small,.journey-arrow,.path-card,.path-side>strong,.path-side>small),.compare-armed .compare-head:not(.compare-in),.compare-armed .compare-row:not(.compare-in){opacity:0}
 /* Heading: eyebrow, then each headline line out of a blur, then the line under it */
 .compare-heading.compare-in>.eyebrow{animation:compare-rise .9s cubic-bezier(.22,1,.36,1) backwards}
 .compare-heading.compare-in>.eyebrow>span{animation:compare-pop .8s cubic-bezier(.34,1.56,.64,1) .15s backwards,compare-ping 2.8s cubic-bezier(.22,1,.36,1) 1.4s infinite}
 .compare-heading.compare-in h2>span{animation:compare-line-in 1.1s cubic-bezier(.22,1,.36,1) .08s backwards}
 .compare-heading.compare-in h2>em{animation:compare-line-in 1.1s cubic-bezier(.22,1,.36,1) .22s backwards}
 .compare-heading.compare-in>p{animation:compare-rise 1s cubic-bezier(.22,1,.36,1) .4s backwards}
 /* Journey: the noise flies in from every direction and keeps drifting; the arrow draws; the clear path builds top to bottom */
 .compare-journey.compare-in .scatter-chips span{animation:compare-chip-in .9s cubic-bezier(.22,1,.36,1) calc(var(--c,0) * 60ms) backwards,compare-drift 5.5s ease-in-out calc(1s + var(--c,0) * -.9s) infinite}
 .compare-journey.compare-in .scatter-side>:is(strong,small),.compare-journey.compare-in .path-side>:is(strong,small){animation:compare-rise .8s cubic-bezier(.22,1,.36,1) .5s backwards}
 .compare-journey.compare-in .path-side>:is(strong,small){animation-delay:1.3s}
 .compare-journey.compare-in .journey-arrow{animation:compare-arrow-in .8s cubic-bezier(.22,1,.36,1) .55s backwards,compare-nudge 2.4s ease-in-out 1.8s infinite}
 .compare-armed .compare-journey.compare-in .journey-arrow path{stroke-dasharray:1;animation:compare-draw .8s cubic-bezier(.65,0,.35,1) .6s backwards}
 .compare-journey.compare-in .path-card{animation:compare-card-in 1s cubic-bezier(.22,1,.36,1) .75s backwards}
 .compare-journey.compare-in .path-line{transform-origin:top;animation:compare-grow 1.1s cubic-bezier(.65,0,.35,1) 1s backwards}
 .compare-journey.compare-in .path-card li{animation:compare-step-in .7s cubic-bezier(.22,1,.36,1) calc(1.1s + var(--i,0) * .16s) backwards}
 /* A light runs down the path and each step glows as it passes (travel is linear over the first 70% of the 4s loop) */
 .compare-journey.compare-in .path-card li:before{animation:compare-pop .6s cubic-bezier(.34,1.56,.64,1) calc(1.15s + var(--i,0) * .16s) backwards,compare-step-glow 4s linear calc(2.4s + var(--i,0) * .933s) infinite}
 .compare-armed .path-line:after{content:'';position:absolute;left:50%;top:0;width:6px;height:26px;margin:-13px 0 0 -3px;border-radius:3px;background:linear-gradient(transparent,#2165ef,transparent);opacity:0;pointer-events:none}
 .compare-journey.compare-in .path-line:after{animation:compare-run 4s linear 2.4s infinite}
 .compare-journey.compare-in .path-launch{animation:compare-launch-in .9s cubic-bezier(.34,1.56,.64,1) 1.7s backwards,compare-launch-ping 2.8s cubic-bezier(.22,1,.36,1) 2.8s infinite}
 .compare-armed .compare-journey.compare-in .path-launch path{stroke-dasharray:1;animation:compare-draw .7s cubic-bezier(.65,0,.35,1) 2s backwards}
 /* Table: header, then rows cascade; crosses land with a shake, checks pop and draw */
 .compare-head.compare-in{animation:compare-rise .8s cubic-bezier(.22,1,.36,1) backwards}
 .compare-head.compare-in .compare-good b{animation:compare-pop .7s cubic-bezier(.34,1.56,.64,1) .35s backwards}
 .compare-row.compare-in{animation:compare-row-in .8s cubic-bezier(.22,1,.36,1) calc(var(--row,0) * 110ms) backwards}
 .compare-row.compare-in .compare-key i{animation:compare-pop .7s cubic-bezier(.34,1.56,.64,1) calc(.12s + var(--row,0) * 110ms) backwards}
 .compare-row.compare-in .compare-bad .icon{animation:compare-shake .7s cubic-bezier(.22,1,.36,1) calc(.22s + var(--row,0) * 110ms) backwards}
 .compare-row.compare-in .compare-good .icon{animation:compare-check-in .8s cubic-bezier(.34,1.56,.64,1) calc(.36s + var(--row,0) * 110ms) backwards}
 .compare-armed .compare-row.compare-in .icon path{stroke-dasharray:1;animation:compare-draw .6s cubic-bezier(.65,0,.35,1) calc(.3s + var(--row,0) * 110ms) backwards}
 .compare-armed .compare-row.compare-in .compare-good .icon path{animation-delay:calc(.52s + var(--row,0) * 110ms)}
 .compare-row.compare-in .compare-good{animation:compare-good-in .9s cubic-bezier(.22,1,.36,1) calc(.28s + var(--row,0) * 110ms) backwards}
 /* A sheen sweeps down the Blueprint column row by row */
 .compare-armed .compare-row .compare-good{position:relative;overflow:hidden;isolation:isolate}
 .compare-armed .compare-row .compare-good:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.9) 50%,transparent 70%);translate:-100% 0;pointer-events:none}
 .compare-row.compare-in .compare-good:after{animation:compare-sheen 7s ease-in-out calc(1.8s + var(--n,0) * .14s) infinite}
 .compare-key i,.compare-row .compare-good .icon,.compare-row .compare-bad .icon{transition:scale .5s cubic-bezier(.34,1.56,.64,1),rotate .5s cubic-bezier(.34,1.56,.64,1),background .3s var(--ease),color .3s var(--ease),box-shadow .3s var(--ease)}
 .path-launch{transition:scale .5s cubic-bezier(.34,1.56,.64,1)}
 .path-launch .icon{transition:translate .4s cubic-bezier(.34,1.56,.64,1)}
 .compare-armed:not(.compare-running) :is(.eyebrow>span,.scatter-chips span,.journey-arrow,.path-card li,.path-launch),.compare-armed:not(.compare-running) .path-card li:before,.compare-armed:not(.compare-running) .path-line:after,.compare-armed:not(.compare-running) .compare-good:after{animation-play-state:paused}
}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 .compare-armed .compare-row:hover .compare-key i{scale:1.08;rotate:-6deg;background:#e6eeff;color:#1649bd}
 .compare-armed .compare-row:hover .compare-bad .icon{scale:.92}
 .compare-armed .compare-row:hover .compare-good .icon{scale:1.14;box-shadow:0 0 0 6px rgba(33,101,239,.14)}
 .compare-armed .path-card:hover .path-launch{scale:1.08}
 .compare-armed .path-card:hover .path-launch .icon{translate:2px -2px}
}
@keyframes compare-rise{from{opacity:0;translate:0 22px}}
@keyframes compare-pop{from{opacity:0;scale:0}}
@keyframes compare-ping{0%{box-shadow:0 0 0 3px rgba(255,207,8,.3)}60%,100%{box-shadow:0 0 0 10px rgba(255,207,8,0)}}
@keyframes compare-line-in{from{opacity:0;translate:0 .4em;filter:blur(12px)}}
@keyframes compare-chip-in{from{opacity:0;translate:var(--fx) var(--fy);rotate:var(--fr);scale:.8;filter:blur(4px)}}
@keyframes compare-drift{0%,100%{translate:0 0}50%{translate:calc(var(--fx) * .07) calc(var(--fy) * .1 + 2px)}}
@keyframes compare-arrow-in{from{opacity:0;translate:-16px 0}}
@keyframes compare-nudge{0%,100%{translate:0 0}50%{translate:6px 0}}
@keyframes compare-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes compare-card-in{from{opacity:0;translate:0 20px;scale:.96}}
@keyframes compare-grow{from{scale:1 0}}
@keyframes compare-step-in{from{opacity:0;translate:-10px 0}}
@keyframes compare-step-glow{0%{background:#6da1ff;box-shadow:0 0 0 3px #edf4ff}6%{background:#2165ef;box-shadow:0 0 0 6px rgba(33,101,239,.2)}20%,100%{background:#6da1ff;box-shadow:0 0 0 3px #edf4ff}}
@keyframes compare-run{0%{top:0;opacity:0}8%{opacity:1}70%{top:100%;opacity:1}78%,100%{top:100%;opacity:0}}
@keyframes compare-launch-in{from{opacity:0;scale:.2;rotate:-90deg}}
@keyframes compare-launch-ping{0%{box-shadow:0 12px 24px -10px rgba(6,73,210,.75),0 0 0 0 rgba(33,101,239,.4)}70%,100%{box-shadow:0 12px 24px -10px rgba(6,73,210,.75),0 0 0 14px rgba(33,101,239,0)}}
@keyframes compare-row-in{from{opacity:0;translate:0 16px}}
@keyframes compare-shake{0%{opacity:0;scale:.4}35%{opacity:1;scale:1.1;rotate:0deg}50%{rotate:-14deg}65%{rotate:10deg}80%{rotate:-5deg}100%{rotate:0deg}}
@keyframes compare-check-in{from{opacity:0;scale:.2;rotate:-45deg}}
@keyframes compare-good-in{from{color:rgba(21,36,72,0)}}
@keyframes compare-sheen{0%{translate:-100% 0}22%,100%{translate:100% 0}}

/* ---------- Contact page: one-screen redesign ---------- */
.ctc{--c-blue:#0b4fe0;--c-blue-d:#0a3bbf;--c-navy:#08123f;--c-ink:#101a35;--c-muted:#56668a;--c-line:#dfe7f3;--c-soft:#edf4ff;--ease-out:cubic-bezier(.22,1,.36,1);
 --pad-y:20px;--h1:60px;--gap-main:22px;--card-pad:24px;--field-h:42px;--area-h:74px;--portrait:196px;--gap-sec:18px;
 position:relative;isolation:isolate;overflow:hidden;min-height:calc(100svh - 84px);display:flex;align-items:center;padding:var(--pad-y) 0;background:radial-gradient(60% 50% at 50% 30%,#fff 0,#f9fbff 60%,#f4f8ff 100%)}
.ctc-orb{position:absolute;z-index:-1;border-radius:50%;pointer-events:none}
.ctc-orb-a{width:520px;height:520px;right:-190px;top:-230px;background:radial-gradient(circle at 35% 65%,rgba(208,228,255,.95),rgba(232,242,255,.35) 58%,transparent 72%);box-shadow:inset 0 0 0 70px rgba(236,244,255,.5);animation:ctc-drift 14s ease-in-out infinite alternate}
.ctc-orb-b{width:460px;height:460px;left:-250px;bottom:-190px;background:radial-gradient(circle at 70% 30%,rgba(212,231,255,.9),rgba(232,242,255,.3) 60%,transparent 72%);box-shadow:inset 0 0 0 60px rgba(236,244,255,.45);animation:ctc-drift 16s ease-in-out -6s infinite alternate-reverse}
.ctc-shell{width:min(900px,calc(100% - 48px));margin:0 auto}
.ctc .ctc-shell p{margin-bottom:0}

/* Intro */
.ctc-intro{text-align:center}
.ctc-pill{display:inline-flex;align-items:center;gap:9px;padding:6px 16px;border-radius:999px;background:#e8f1fd;border:1px solid #d9e6f8;font:700 11px/1.4 var(--body);letter-spacing:.24em;color:var(--c-navy)}
.ctc-pill i{width:8px;height:8px;border-radius:50%;background:var(--yellow);box-shadow:0 0 0 0 rgba(255,207,8,.6);animation:ctc-pulse 2.4s ease-out infinite}
.ctc-intro h1{margin-top:12px;font-size:var(--h1);font-weight:800;line-height:.95;letter-spacing:-.01em;color:var(--c-navy);white-space:nowrap}
.ctc-intro h1 em{font-style:normal;background:linear-gradient(90deg,#0a44d6,#1f6bff 45%,#0a44d6) 0 0/200% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:var(--c-blue);animation:ctc-sheen 6s ease-in-out 1.2s infinite}
.ctc-intro p{margin:10px auto 0;font-size:16px;line-height:1.45;color:var(--c-muted)}

/* Cards */
.ctc-main{display:grid;grid-template-columns:330px minmax(0,1fr);gap:26px;margin-top:var(--gap-main);align-items:stretch}
.ctc-card{position:relative;background:rgba(255,255,255,.92);border:1px solid var(--c-line);border-radius:20px;box-shadow:0 1px 0 #fff inset,0 24px 60px -38px rgba(8,30,90,.35);backdrop-filter:blur(6px)}
.ctc-author{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--card-pad) 22px;text-align:center;background:linear-gradient(180deg,rgba(248,251,255,.95),rgba(255,255,255,.92))}
.ctc-portrait{position:relative;width:var(--portrait);height:var(--portrait)}
.ctc-ring{position:absolute;inset:-7px;border-radius:50%;background:conic-gradient(from 0deg,#0b4fe0,#8dbbff 30%,rgba(141,187,255,0) 55%,#ffcf08 80%,#0b4fe0);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 2.5px),#000 calc(100% - 2px));mask:radial-gradient(farthest-side,transparent calc(100% - 2.5px),#000 calc(100% - 2px));animation:ctc-spin 9s linear infinite}
.ctc-photo{position:absolute;inset:0;overflow:hidden;border-radius:50%;background:radial-gradient(circle at 50% 38%,#f4f9ff 0,#d9e9ff 58%,#bfd8fb 100%)}
.ctc-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:none;transform-origin:50% 50%;transition:transform .6s var(--ease-out)}
.ctc-author:hover .ctc-photo img{transform:scale(1.03)}
.ctc-author h2{margin-top:18px;font-size:32px;line-height:1;letter-spacing:.005em;color:var(--c-navy)}
.ctc-role{margin-top:9px;font:700 10px/1.4 var(--body);letter-spacing:.16em;color:#4c5f91;white-space:nowrap}
.ctc-role span{padding:0 5px;color:#a3b1d1}
.ctc-bio{margin-top:12px;font-size:14.5px;line-height:1.5;color:#3a4a6e}
.ctc-socials{display:flex;gap:14px;margin-top:18px}
.ctc-social{width:40px;height:40px;display:grid;place-items:center;border-radius:50%;color:#fff;box-shadow:0 8px 18px -10px rgba(8,20,64,.7);transition:transform .35s var(--ease-out),box-shadow .35s}
.ctc-social svg{width:19px;height:19px}
.ctc-social img{width:100%;height:100%;border-radius:50%}
.ctc-li{background:#0a66c2}.ctc-x{background:#0b0b0f}.ctc-z{background:#0b1a4a}
.ctc-social:hover,.ctc-social:focus-visible{transform:translateY(-4px) rotate(-6deg);box-shadow:0 14px 24px -12px rgba(8,20,64,.8)}

/* Form */
.ctc-form{padding:var(--card-pad) 28px;display:grid;grid-template-columns:auto 1fr;column-gap:14px;align-content:center}
.ctc-form>*{grid-column:1/-1}
.ctc-form-icon{grid-column:1;grid-row:1/3;width:44px;height:44px;display:grid;place-items:center;border-radius:12px;background:var(--c-soft);color:var(--c-blue);align-self:center}
.ctc-form-icon .icon{width:22px;height:22px;stroke-width:2}
.ctc-form h2{grid-column:2;font-size:30px;line-height:1;color:var(--c-navy);align-self:end}
.ctc-lede{grid-column:2;margin-top:3px;font-size:13px;line-height:1.45;color:var(--c-muted)}
.ctc-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:16px}
.ctc-field{position:relative;display:flex;flex-direction:column;gap:5px;margin-top:12px}
.ctc-row .ctc-field{margin-top:0}
.ctc-label{display:flex;justify-content:space-between;align-items:baseline;font:600 12px/1.35 var(--body);color:var(--c-ink)}
.ctc-count{font-weight:500;font-size:11px;color:#8a97b4;font-variant-numeric:tabular-nums}
.ctc-field input,.ctc-field select,.ctc-field textarea{width:100%;min-width:0;height:var(--field-h);padding:0 13px;border:1px solid #cdd8ea;border-radius:10px;background:#fff;color:var(--c-ink);font:500 14px/1.4 var(--body);transition:border-color .2s,box-shadow .25s,background .2s}
.ctc-field textarea{height:var(--area-h);min-height:56px;max-height:220px;padding:10px 13px;resize:vertical;display:block}
.ctc-field ::placeholder{color:#8f9bb5;font-weight:400}
.ctc-field input:hover,.ctc-field select:hover,.ctc-field textarea:hover{border-color:#aebfdc}
.ctc-field input:focus,.ctc-field select:focus,.ctc-field textarea:focus{outline:0;border-color:var(--c-blue);box-shadow:0 0 0 4px rgba(11,79,224,.12)}
.ctc-select{position:relative;display:block}
.ctc-select select{appearance:none;-webkit-appearance:none;padding-right:40px;cursor:pointer}
.ctc-select svg{position:absolute;right:13px;top:50%;width:18px;height:18px;translate:0 -50%;color:var(--c-ink);pointer-events:none;transition:rotate .3s var(--ease-out)}
.ctc-select:focus-within svg{rotate:180deg;color:var(--c-blue)}
.ctc-err{position:absolute;right:4px;top:0;font:600 11px/1.35 var(--body);color:#d0342c;opacity:0;translate:0 4px;transition:.25s var(--ease-out);pointer-events:none}
.ctc-field.is-invalid input,.ctc-field.is-invalid textarea{border-color:#e0574f;box-shadow:0 0 0 4px rgba(224,87,79,.1)}
.ctc-field.is-invalid .ctc-err{opacity:1;translate:0 0}
.ctc-field:has(textarea).is-invalid .ctc-count{opacity:0}
.ctc-field.is-invalid{animation:ctc-shake .4s}
.ctc-field textarea.is-hint{animation:ctc-hint .7s var(--ease-out)}
.ctc-submit{position:relative;overflow:hidden;margin-top:16px;height:48px;display:flex;align-items:center;justify-content:center;gap:10px;border:0;border-radius:11px;background:linear-gradient(90deg,#0a3bbf,#0b55ec);color:#fff;font:700 15px/1 var(--body);cursor:pointer;box-shadow:0 14px 28px -16px rgba(8,60,200,.9);transition:transform .25s var(--ease-out),box-shadow .25s}
.ctc-submit:before{content:'';position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.35) 50%,transparent 65%);translate:-110% 0;transition:translate .8s var(--ease-out)}
.ctc-submit:hover{transform:translateY(-2px);box-shadow:0 20px 34px -16px rgba(8,60,200,.95)}
.ctc-submit:hover:before{translate:110% 0}
.ctc-submit:active{transform:translateY(0) scale(.99)}
.ctc-submit:focus-visible{outline:3px solid #ffcf08;outline-offset:3px}
.ctc-submit-ic{display:grid;transition:transform .35s var(--ease-out)}
.ctc-submit-ic .icon{width:19px;height:19px;stroke-width:2}
.ctc-submit:hover .ctc-submit-ic{transform:translate(2px,-2px) rotate(-8deg)}
.ctc-submit.is-sent .ctc-submit-ic{animation:ctc-fly .9s var(--ease-out)}
.ctc-note{display:flex;justify-content:center;align-items:center;gap:7px;margin-top:10px;font-size:11.5px;line-height:1.4;color:#6c7a98;text-align:center}
.ctc-note .icon{flex:none;width:13px;height:13px;stroke-width:2}
.ctc-result{position:absolute;left:14px;right:14px;bottom:14px;display:flex;gap:12px;padding:14px 16px;border-radius:14px;background:#f2fbf6;border:1px solid #bfe6cf;box-shadow:0 20px 40px -22px rgba(8,30,90,.45);animation:ctc-pop .5s var(--ease-out)}
.ctc-result[hidden]{display:none}
.ctc-result-ic{flex:none;width:30px;height:30px;display:grid;place-items:center;border-radius:50%;background:#1fb866;color:#fff}
.ctc-result-ic .icon{width:16px;height:16px;stroke-width:2.6}
.ctc-result>div{flex:1;min-width:0}
.ctc-result strong{display:block;font-size:14px;color:#0c3b25}
.ctc-result p{margin-top:2px;font-size:12.5px;line-height:1.45;color:#3d5a4b}
.ctc-result a{color:#0a3bbf;text-decoration:underline;overflow-wrap:anywhere}
.ctc-result-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.ctc-result-actions button{padding:5px 11px;border:1px solid #bcd0ea;border-radius:8px;background:#fff;font:600 12px/1.3 var(--body);color:#0a3bbf;cursor:pointer;transition:background .2s}
.ctc-result-actions button:hover{background:#eef4ff}
.ctc-result-actions [data-result-close]{position:absolute;top:8px;right:8px;padding:4px;border:0;background:transparent;color:#5b6d63;display:grid}
.ctc-result-actions [data-result-close] .icon{width:14px;height:14px}

/* Reasons */
.ctc-reasons{margin-top:var(--gap-sec)}
.ctc-rule{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:22px}
.ctc-rule span{height:1px;background:linear-gradient(90deg,transparent,#cdd9ea)}
.ctc-rule span:last-child{background:linear-gradient(90deg,#cdd9ea,transparent)}
.ctc-rule h2{font:700 10.5px/1.3 var(--body);letter-spacing:.24em;color:#52658f;white-space:nowrap}
.ctc-reason-grid{display:grid;grid-template-columns:repeat(3,1fr);margin-top:10px}
.ctc-reason{position:relative;display:grid;justify-items:center;gap:0;padding:8px 14px;border:0;border-radius:14px;background:transparent;font-family:var(--body);text-align:center;cursor:pointer;transition:background .3s,transform .3s var(--ease-out)}
.ctc-reason+.ctc-reason:before{content:'';position:absolute;left:0;top:12%;bottom:12%;width:1px;background:#d6e0ee}
.ctc-reason-ic{width:40px;height:40px;display:grid;place-items:center;margin-bottom:6px;border-radius:12px;background:var(--c-soft);color:var(--c-blue);transition:transform .4s var(--ease-out),background .3s,color .3s}
.ctc-reason-ic .icon{width:21px;height:21px;stroke-width:1.9}
.ctc-reason strong{font-size:14px;line-height:1.3;color:var(--c-navy)}
.ctc-reason small{margin-top:1px;font-size:12px;line-height:1.4;color:#5a6a8c}
.ctc-reason:hover,.ctc-reason:focus-visible{background:rgba(234,243,255,.7);transform:translateY(-2px);outline:0}
.ctc-reason:hover .ctc-reason-ic,.ctc-reason:focus-visible .ctc-reason-ic{transform:translateY(-2px) rotate(-6deg);background:var(--c-blue);color:#fff}

/* Quote */
.ctc-quote{display:flex;align-items:center;gap:22px;width:min(700px,100%);margin:12px auto 0;padding:12px 30px;border-radius:16px;background:linear-gradient(100deg,#e9f2ff,#f2f7ff);border:1px solid #dde8f8}
.ctc-quote-mark{flex:none;padding-right:20px;border-right:1px solid #9db6e0;font:700 54px/.6 Georgia,serif;color:var(--c-blue);height:34px;padding-top:12px}
.ctc-quote div{flex:1;min-width:0}
.ctc-quote strong{display:block;font-size:15.5px;line-height:1.35;color:var(--c-navy)}
.ctc-quote p{margin-top:2px;font-size:12.5px;line-height:1.4;color:#50618a}
.ctc-quote cite{flex:none;font-size:12px;font-style:normal;color:#50618a}
.ctc-quote cite:before{content:'';display:inline-block;width:14px;height:1px;margin-right:7px;vertical-align:middle;background:currentColor}

/* Motion */
@media(prefers-reduced-motion:no-preference){
 .ctc-in{animation:ctc-rise .9s var(--ease-out) backwards;animation-delay:calc(var(--d,0)*90ms + 60ms)}
 .ctc-intro h1.ctc-in{animation-name:ctc-rise-blur}
 .ctc-author.ctc-in .ctc-portrait{animation:ctc-zoom 1s var(--ease-out) .35s backwards}
 .ctc-author.ctc-in  .ctc-author.ctc-in .ctc-social{animation:ctc-rise .6s var(--ease-out) backwards}
 .ctc-author.ctc-in .ctc-social:nth-child(1){animation-delay:.7s}.ctc-author.ctc-in .ctc-social:nth-child(2){animation-delay:.78s}.ctc-author.ctc-in .ctc-social:nth-child(3){animation-delay:.86s}
 .ctc-reason{animation:ctc-rise .7s var(--ease-out) backwards}
 .ctc-reason:nth-child(1){animation-delay:.6s}.ctc-reason:nth-child(2){animation-delay:.68s}.ctc-reason:nth-child(3){animation-delay:.76s}
}
@media(prefers-reduced-motion:reduce){.ctc-ring,.ctc-orb,.ctc-pill i,.ctc-intro h1 em{animation:none}}
@keyframes ctc-rise{from{opacity:0;translate:0 18px}}
@keyframes ctc-rise-blur{from{opacity:0;translate:0 22px;filter:blur(8px)}}
@keyframes ctc-zoom{from{opacity:0;scale:.82}}
@keyframes ctc-spin{to{rotate:360deg}}
@keyframes ctc-drift{to{translate:-30px 26px;scale:1.06}}
@keyframes ctc-pulse{0%{box-shadow:0 0 0 0 rgba(255,207,8,.6)}80%,100%{box-shadow:0 0 0 8px rgba(255,207,8,0)}}
@keyframes ctc-sheen{0%,60%{background-position:100% 0}100%{background-position:-100% 0}}
@keyframes ctc-shake{20%,60%{translate:-4px 0}40%,80%{translate:4px 0}}
@keyframes ctc-hint{0%{box-shadow:0 0 0 0 rgba(11,79,224,.3)}100%{box-shadow:0 0 0 10px rgba(11,79,224,0)}}
@keyframes ctc-fly{40%{transform:translate(26px,-22px) rotate(-20deg);opacity:0}41%{transform:translate(-26px,22px);opacity:0}100%{transform:none;opacity:1}}
@keyframes ctc-pop{from{opacity:0;translate:0 12px;scale:.97}}

/* Tall screens: roomier, icon stacked like the reference */
@media(min-width:821px) and (min-height:1200px){
 .ctc{--pad-y:36px;--h1:72px;--gap-main:30px;--card-pad:30px;--field-h:44px;--area-h:96px;--portrait:220px;--gap-sec:30px}
 .ctc-shell{width:min(960px,calc(100% - 48px))}
 .ctc-main{grid-template-columns:350px minmax(0,1fr)}
 .ctc-form-icon{grid-row:auto;margin-bottom:12px}
 .ctc-form h2,.ctc-lede{grid-column:1/-1}
 .ctc-form h2{font-size:36px}.ctc-lede{font-size:14px;margin-top:6px}
 .ctc-author h2{font-size:36px}
 .ctc-intro p{font-size:18px}
 .ctc-reason-ic{width:48px;height:48px;margin-bottom:10px}
 .ctc-reason strong{font-size:15px}.ctc-reason small{font-size:13px}
 .ctc-quote{margin-top:22px;padding:16px 34px}.ctc-quote strong{font-size:17px}.ctc-quote p{font-size:13.5px}
}
/* Short laptop screens */
@media(min-width:821px) and (max-height:1019px){
 .ctc{--pad-y:14px;--h1:50px;--gap-main:16px;--card-pad:18px;--field-h:38px;--area-h:58px;--portrait:156px;--gap-sec:12px}
 .ctc-pill{padding:4px 13px;font-size:10px}
 .ctc-intro h1{margin-top:8px}
 .ctc-intro p{margin-top:6px;font-size:14.5px;line-height:1.4}
 .ctc-form h2{font-size:26px}.ctc-lede{font-size:12.5px}
 .ctc-form-icon{width:40px;height:40px}
 .ctc-row{margin-top:12px}.ctc-field{margin-top:9px}
 .ctc-submit{margin-top:12px;height:44px}.ctc-note{margin-top:7px;font-size:11px}
 .ctc-author h2{font-size:28px;margin-top:16px}.ctc-bio{font-size:13.5px;margin-top:8px}.ctc-socials{margin-top:13px}.ctc-social{width:36px;height:36px}
 .ctc-reason-grid{margin-top:6px}
 .ctc-reason{grid-template-columns:auto auto;justify-content:center;align-items:center;column-gap:10px;text-align:left;padding:6px 10px}
 .ctc-reason-ic{grid-row:1/3;width:36px;height:36px;margin:0}
 .ctc-reason strong{font-size:13.5px;align-self:end}.ctc-reason small{font-size:11.5px;align-self:start}
 .ctc-quote{margin-top:8px;padding:8px 26px}.ctc-quote-mark{font-size:44px;height:26px;padding-top:10px}.ctc-quote strong{font-size:14px}.ctc-quote p{font-size:12px}
}
@media(min-width:821px) and (max-height:800px){
 .ctc{--h1:42px;--pad-y:10px;--area-h:48px;--field-h:36px;--portrait:130px;--card-pad:14px;--gap-main:12px}
 .ctc-intro p br{display:none}
 .ctc-lede{display:none}.ctc-form h2{align-self:center}.ctc-form-icon{grid-row:1;width:36px;height:36px}
 .ctc-quote p{display:none}
}

@media(min-width:821px) and (max-height:720px){.ctc-reason small{display:none}.ctc-reason strong{align-self:center}}
/* Tablet and phone: natural flow */
@media(max-width:820px){
 .ctc{min-height:0;display:block;padding:40px 0 52px}
 .ctc-shell{width:min(600px,calc(100% - 32px))}
 .ctc-intro h1{font-size:clamp(40px,11vw,64px);white-space:normal}
 .ctc-intro h1 span,.ctc-intro h1 em{display:block}
 .ctc-intro p{font-size:16px}
 .ctc-main{grid-template-columns:1fr;gap:18px;margin-top:28px}
 .ctc-author{padding:26px 20px}
 .ctc{--portrait:170px}
 .ctc-form{padding:24px 20px}
 .ctc-field input,.ctc-field select,.ctc-field textarea{font-size:16px}
 .ctc-field textarea{height:120px}
 .ctc-reasons{margin-top:32px}
 .ctc-reason-grid{margin-top:14px}
 .ctc-quote{margin-top:20px}
}
@media(max-width:560px){
 .ctc-intro p br,.ctc-bio br{display:none}
 .ctc-form{grid-template-columns:1fr}
 .ctc-form-icon{grid-row:auto;margin-bottom:10px}
 .ctc-form h2,.ctc-lede{grid-column:1/-1}.ctc-form h2{font-size:28px}
 .ctc-row{grid-template-columns:1fr;gap:0}.ctc-row .ctc-field+.ctc-field{margin-top:12px}
 .ctc-rule{gap:12px}.ctc-rule h2{font-size:9.5px;letter-spacing:.16em}
 .ctc-reason-grid{grid-template-columns:1fr;gap:4px}
 .ctc-reason{grid-template-columns:auto 1fr;justify-items:start;column-gap:14px;text-align:left;padding:10px 8px}
 .ctc-reason+.ctc-reason:before{left:8px;right:8px;top:0;bottom:auto;width:auto;height:1px}
 .ctc-reason-ic{grid-row:1/3;margin:0}
 .ctc-quote{flex-wrap:wrap;gap:12px 16px;padding:16px 18px}.ctc-quote-mark{padding-right:14px}.ctc-quote div{flex-basis:70%}.ctc-quote cite{margin-left:auto}
 .ctc-result{position:static;margin-top:14px}
}

/* ---------- Book showcase reference redesign ---------- */
.book-section.book-redesign{padding:0;background:#fff;overflow-x:clip}
.book-redesign .book-stage{position:relative;isolation:isolate;overflow:hidden;padding:104px 0;color:#fff;background:radial-gradient(36% 55% at 25% 52%,rgba(70,140,255,.55) 0,rgba(70,140,255,0) 72%),radial-gradient(45% 55% at 92% -8%,rgba(115,170,255,.42) 0,rgba(115,170,255,0) 70%),linear-gradient(160deg,#0a48e2 0%,#0839c4 48%,#062c9a 100%)}
.book-section.book-redesign .book-stage>.book-layout{width:min(1320px,calc(100% - 80px));grid-template-columns:minmax(0,.46fr) minmax(0,.54fr);gap:80px;align-items:center}
.book-redesign .book-visual-column{min-width:0}
/* Glass panel with a floating 3D book render */
.book-section.book-redesign .buy-visual{position:relative;display:grid;place-items:center;min-height:0;aspect-ratio:.86;border-radius:26px;border:1.5px solid rgba(150,198,255,.55);background:radial-gradient(70% 55% at 50% 72%,rgba(110,172,255,.42),rgba(60,120,255,.12) 62%,rgba(40,100,255,.05)),linear-gradient(180deg,rgba(255,255,255,.1),rgba(255,255,255,.03));box-shadow:inset 0 0 60px rgba(120,182,255,.22),inset 0 1px 0 rgba(255,255,255,.35),0 0 70px -12px rgba(90,160,255,.5),0 40px 80px -40px rgba(0,10,70,.7);overflow:hidden}
.book-section.book-redesign .buy-visual::before{content:"";position:absolute;left:50%;top:52%;width:96%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,rgba(150,202,255,.55) 0,rgba(80,142,255,.22) 40%,transparent 68%);mask-image:none;-webkit-mask-image:none;opacity:1;animation:bookGlow 6s ease-in-out infinite}
.book-section.book-redesign .buy-visual::after{content:"";position:absolute;left:50%;bottom:7%;width:72%;height:11%;transform:translateX(-50%);border-radius:50%;background:radial-gradient(closest-side,rgba(195,228,255,.95),rgba(100,168,255,.45) 45%,transparent);filter:blur(10px);animation:bookFloor 6s ease-in-out infinite;pointer-events:none}
.book-redesign .book-float-wrap{position:relative;z-index:1;width:62%;perspective:1400px}
.book-redesign .book-float{position:relative;display:block;transform-style:preserve-3d;animation:bookFloat 6s ease-in-out infinite;will-change:transform}
.book-redesign .book-float img{display:block;width:100%;height:auto;filter:drop-shadow(0 30px 26px rgba(0,12,70,.5)) drop-shadow(0 0 34px rgba(125,185,255,.4))}
.book-redesign .book-float::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 42%,rgba(255,255,255,.34) 50%,transparent 58%) no-repeat 130% 0/250% 100%;-webkit-mask:url(/assets/generated/book-front-3d-faq.webp) center/100% 100% no-repeat;mask:url(/assets/generated/book-front-3d-faq.webp) center/100% 100% no-repeat;mix-blend-mode:screen;animation:bookShine 7s ease-in-out 1.2s infinite;pointer-events:none}
/* Copy */
.book-section.book-redesign .book-copy{min-width:0}
.book-section.book-redesign .book-copy .eyebrow{margin-bottom:22px;font-size:14px;letter-spacing:.2em;color:#fff}
.book-section.book-redesign .book-copy .eyebrow>span{box-shadow:0 0 0 3px rgba(255,207,8,.25),0 0 14px rgba(255,207,8,.7)}
.book-section.book-redesign .book-copy h2{margin:0 0 20px;font-size:clamp(38px,4.45vw,68px);line-height:.95;letter-spacing:-.008em}
.book-section.book-redesign .book-copy h2 span,.book-section.book-redesign .book-copy h2 em{display:block;white-space:nowrap}
.book-section.book-redesign .book-copy h2 span{color:#fff}
.book-section.book-redesign .book-copy h2 em{margin-top:.03em;color:var(--yellow);font-size:1.36em;font-style:normal;line-height:.9;text-shadow:0 10px 40px rgba(255,207,8,.22)}
.book-section.book-redesign .book-subtitle{margin:0 0 10px;color:#fff;font-size:clamp(24px,2.05vw,31px);font-weight:600;line-height:1.2;letter-spacing:-.012em}
.book-section.book-redesign .book-copy p.book-lede{max-width:none;margin:0;color:rgba(235,242,255,.9);font-size:clamp(16px,1.22vw,18.5px);line-height:1.5}
.book-section.book-redesign .check-list{gap:10px;margin:24px 0 32px}
.book-section.book-redesign .check-list li{align-items:center;gap:18px;color:rgba(235,242,255,.92);font-size:clamp(16px,1.25vw,18.5px);line-height:1.35}
.book-section.book-redesign .check-list li span{display:block}
.book-section.book-redesign .check-list strong{color:#fff;font-weight:700}
.book-section.book-redesign .check-list .icon{width:34px;height:34px;margin:0;padding:8px;border-radius:50%;color:#fff;stroke-width:2.6;background:linear-gradient(145deg,#4f90ff,#1f52dc);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 0 16px rgba(90,160,255,.55)}
.book-section.book-redesign .book-actions{display:grid;grid-template-columns:1.36fr 1fr;gap:18px;margin:0}
.book-section.book-redesign .book-actions .button{min-height:64px;padding:0 24px;justify-content:center;gap:20px;border-radius:8px;font-size:18px}
.book-section.book-redesign .book-actions .primary{box-shadow:0 18px 36px -16px rgba(255,207,8,.6)}
.book-section.book-redesign .book-actions .outline{border:1.5px solid #fff;color:#fff;background:rgba(255,255,255,.02)}
.book-section.book-redesign .book-actions .outline:hover{background:rgba(255,255,255,.1);border-color:#fff;box-shadow:none}
.js-reveal .book-stage .reveal-ready{transition-delay:var(--reveal-delay,0ms)}
@keyframes bookFloat{0%,100%{transform:translateY(6px) rotateY(-5deg) rotateX(1deg)}50%{transform:translateY(-12px) rotateY(4deg) rotateX(-1.5deg)}}
@keyframes bookFloor{0%,100%{opacity:1;transform:translateX(-50%) scale(1)}50%{opacity:.72;transform:translateX(-50%) scale(.86)}}
@keyframes bookGlow{0%,100%{opacity:.85;transform:translate(-50%,-50%) scale(1)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.07)}}
@keyframes bookShine{0%,55%{background-position:130% 0}85%,100%{background-position:-30% 0}}
@media(max-width:1180px){
 .book-section.book-redesign .book-stage>.book-layout{gap:52px}
 .book-section.book-redesign .check-list{gap:8px;margin:18px 0 24px}
 .book-section.book-redesign .buy-visual{aspect-ratio:.7}
 .book-redesign .book-float-wrap{width:68%}
 .book-section.book-redesign .book-actions .button{min-height:56px;padding:0 16px;gap:12px;font-size:16px}
}
@media(max-width:1100px){
 .book-redesign .book-stage{padding:80px 0 88px}
 .book-section.book-redesign .book-stage>.book-layout{grid-template-columns:1fr;gap:52px}
 .book-section.book-redesign .book-visual-column{width:100%;max-width:500px;margin:0 auto}
 .book-section.book-redesign .buy-visual{aspect-ratio:.86}
 .book-redesign .book-float-wrap{width:62%}
 .book-section.book-redesign .book-copy{width:100%;max-width:640px;margin:0 auto}
 .book-section.book-redesign .book-copy h2{font-size:clamp(38px,6.4vw,58px)}
}
@media(max-width:620px){
 .book-redesign .book-stage{padding:56px 0 64px}
 .book-section.book-redesign .book-stage>.book-layout{width:calc(100% - 32px);gap:40px}
 .book-section.book-redesign .buy-visual{border-radius:20px}
 .book-section.book-redesign .book-copy .eyebrow{font-size:11px;margin-bottom:16px}
 .book-section.book-redesign .book-copy h2{font-size:9vw}
 .book-section.book-redesign .book-copy h2 span,.book-section.book-redesign .book-copy h2 em{white-space:normal}
 .book-section.book-redesign .book-subtitle{font-size:22px}
 .book-section.book-redesign .book-copy p.book-lede{font-size:15.5px}
 .book-section.book-redesign .check-list{gap:12px;margin:22px 0 28px}
 .book-section.book-redesign .check-list li{gap:12px;font-size:14.5px;align-items:flex-start}
 .book-section.book-redesign .check-list .icon{width:26px;height:26px;padding:6px}
 .book-section.book-redesign .book-actions{grid-template-columns:1fr}
 .book-section.book-redesign .book-actions .button{width:100%;min-height:56px}
}

/* ---------- About hero redesign ---------- */
.about-hero.about-hero-redesign{position:relative;overflow:hidden;padding:88px 0 104px;background:linear-gradient(180deg,#f7f9ff 0%,#fff 55%,#f5f8ff 100%)}
.about-hero-redesign .about-decor{position:absolute;inset:0;pointer-events:none}
.about-hero-redesign .about-arc{position:absolute;border-radius:50%;background:radial-gradient(circle at 50% 50%,rgba(28,68,198,.07),rgba(28,68,198,0) 68%)}
.about-hero-redesign .about-arc-l{width:620px;height:620px;left:-360px;top:8%;box-shadow:inset 0 0 0 1px rgba(28,68,198,.06)}
.about-hero-redesign .about-arc-r{width:560px;height:560px;right:-330px;top:22%;box-shadow:inset 0 0 0 1px rgba(28,68,198,.06)}
.about-hero-redesign .about-dots{position:absolute;width:128px;height:148px;background:radial-gradient(circle,rgba(21,69,189,.38) 1.6px,transparent 2px) 0 0/25px 25px;animation:aboutFloat 9s ease-in-out infinite}
.about-hero-redesign .about-dots-l{left:3.2%;top:52%}
.about-hero-redesign .about-dots-r{right:3.2%;bottom:12%;opacity:.6;animation-delay:-4.5s}
.about-hero.about-hero-redesign .container{position:relative;width:min(1280px,calc(100% - 80px))}
.about-hero.about-hero-redesign .author-layout{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:80px;align-items:center}
.about-hero-redesign .about-portrait{margin:0;padding:7px;background:#fff;border:1px solid #e2e8f4;border-radius:24px;box-shadow:0 36px 70px -40px rgba(7,21,64,.38),0 0 0 6px rgba(255,255,255,.6);transition:transform .5s var(--ease),box-shadow .5s var(--ease);animation:aboutRise .9s var(--ease) both}
.about-hero-redesign .about-portrait:hover{transform:translateY(-6px);box-shadow:0 48px 80px -44px rgba(7,21,64,.45),0 0 0 6px rgba(255,255,255,.6)}
.about-hero-redesign .about-photo{position:relative;overflow:hidden;border-radius:18px;background:#eef1f6}
.about-hero-redesign .about-photo>img{display:block;width:100%;height:auto;aspect-ratio:1/1.02;object-fit:cover;object-position:50% 46%;transition:transform 1.2s var(--ease)}
.about-hero-redesign .about-portrait:hover .about-photo>img{transform:scale(1.035)}
.about-hero.about-hero-redesign .portrait-label{position:static;display:flex;align-items:center;justify-content:center;gap:14px;min-height:56px;padding:12px 20px;background:linear-gradient(90deg,#ffc800,#ffd62a);color:var(--navy);font-size:15px;font-weight:700;letter-spacing:.16em;line-height:1;text-align:center;text-transform:uppercase;white-space:nowrap}
.about-hero.about-hero-redesign .portrait-label>span:last-child{margin-right:-.16em}
.about-hero.about-hero-redesign .portrait-label>span+span:before{content:'•';margin-right:14px;opacity:.7}
.about-hero-redesign .about-copy{min-width:0}
.about-hero-redesign .about-copy>*{animation:aboutRise .8s var(--ease) both}
.about-hero-redesign .about-copy>:nth-child(1){animation-delay:.08s}
.about-hero-redesign .about-copy>:nth-child(2){animation-delay:.16s}
.about-hero-redesign .about-copy>:nth-child(3){animation-delay:.24s}
.about-hero-redesign .about-copy>:nth-child(4){animation-delay:.32s}
.about-hero-redesign .about-copy>:nth-child(5){animation-delay:.4s}
.about-hero.about-hero-redesign h1{margin:0 0 14px;font-size:clamp(52px,5.4vw,84px);font-weight:800;line-height:.95;letter-spacing:-.012em}
.about-hero-redesign h1 span{color:var(--navy)}
.about-hero-redesign h1 em{color:var(--blue-2);font-style:normal}
.about-hero-redesign .about-dot{display:inline-block;width:.15em;height:.15em;margin-left:.05em;border-radius:50%;background:var(--yellow);vertical-align:baseline;animation:aboutPulse 2.8s ease-in-out 1s infinite}
.about-hero-redesign .author-layout .about-lead{margin:0 0 26px;text-wrap:balance;font-size:clamp(19px,1.55vw,23px);font-weight:700;line-height:1.3;letter-spacing:-.01em;color:var(--navy)}
.about-hero-redesign .author-layout .about-body{max-width:62ch;margin:0 0 18px;font-size:clamp(16px,1.3vw,19px);line-height:1.62;color:#34405c}
.about-hero-redesign .about-body a{color:var(--blue-2);font-weight:600;text-decoration:underline;text-decoration-color:rgba(28,68,198,.3);text-underline-offset:4px;transition:text-decoration-color .2s}
.about-hero-redesign .about-body a:hover{text-decoration-color:currentColor}
.about-hero-redesign .about-actions{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin-top:34px}
.about-hero-redesign .about-actions .button{min-height:56px;padding:0 26px;border-radius:10px;font-size:16px}
.about-hero-redesign .about-actions .button.blue{background:var(--blue-2);box-shadow:0 14px 28px -14px rgba(28,68,198,.75)}
.about-hero-redesign .about-actions .button.blue:hover{background:#1a3db0}
.about-hero-redesign .about-actions .button.outline{border:1.5px solid var(--blue-2);color:var(--blue-2);background:#fff}
.about-hero-redesign .about-actions .button.outline:hover{background:#f0f4ff}
.about-hero-redesign .socials{margin:0 0 0 10px;gap:8px}
.about-hero-redesign .socials a{width:48px;height:48px;border:0;border-radius:12px;background:transparent}
.about-hero-redesign .socials a:hover{background:#fff;box-shadow:0 12px 24px -12px rgba(7,21,64,.35)}
.about-hero-redesign .socials img{width:36px;height:36px}
@keyframes aboutRise{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@keyframes aboutFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
@keyframes aboutPulse{0%,100%{box-shadow:0 0 0 0 rgba(255,207,8,.55)}50%{box-shadow:0 0 0 .09em rgba(255,207,8,0)}}
@media(prefers-reduced-motion:reduce){
 .about-hero-redesign .about-portrait,.about-hero-redesign .about-copy>*,.about-hero-redesign .about-dots,.about-hero-redesign .about-dot{animation:none}
 .about-hero-redesign .about-portrait,.about-hero-redesign .about-photo>img{transition:none}
}
@media(max-width:1180px){
 .about-hero.about-hero-redesign .author-layout{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:56px}
 .about-hero-redesign .socials{margin-left:0}
 .about-hero-redesign .about-actions{gap:12px}
 .about-hero-redesign .about-actions .button{min-height:52px;padding:0 20px;font-size:15px;gap:10px}
}
@media(max-width:900px){
 .about-hero.about-hero-redesign{padding:48px 0 80px}
 .about-hero.about-hero-redesign .author-layout{grid-template-columns:1fr;gap:48px}
 .about-hero-redesign .about-portrait{width:100%;max-width:460px;justify-self:center}
 .about-hero-redesign .about-copy{width:100%;max-width:640px;margin:0 auto}
 .about-hero.about-hero-redesign h1{font-size:clamp(52px,10vw,80px)}
 .about-hero-redesign .about-dots{display:none}
}
@media(max-width:620px){
 .about-hero.about-hero-redesign{padding:32px 0 64px}
 .about-hero.about-hero-redesign .container{width:calc(100% - 32px)}
 .about-hero.about-hero-redesign .author-layout{gap:36px}
 .about-hero-redesign .about-portrait{padding:5px;border-radius:20px}
 .about-hero-redesign .about-photo{border-radius:15px}
 .about-hero.about-hero-redesign .portrait-label{min-height:48px;gap:10px;font-size:13px;letter-spacing:.14em}.about-hero.about-hero-redesign .portrait-label>span+span:before{margin-right:10px}.about-hero.about-hero-redesign .portrait-label>span:last-child{margin-right:-.14em}
 .about-hero.about-hero-redesign h1{font-size:clamp(46px,14.5vw,64px)}
 .about-hero-redesign h1 span,.about-hero-redesign h1 em{display:inline}
 .about-hero-redesign .author-layout .about-lead{font-size:19px;margin-bottom:18px}
 .about-hero-redesign .author-layout .about-body{font-size:16px}
 .about-hero-redesign .about-actions{flex-direction:column;align-items:stretch;gap:12px;margin-top:26px}
 .about-hero-redesign .about-actions .button{width:100%}
 .about-hero-redesign .socials{justify-content:center;margin-top:6px}
}

/* ---------- From the author reference redesign ---------- */
.author-section.author-redesign{padding:104px 0 112px;background:radial-gradient(circle at 52% 45%,#fff 0,#fff 43%,#fbfcff 100%)}
.author-section.author-redesign .container{width:min(1380px,87.5%)}
.author-section.author-redesign .author-layout{grid-template-columns:minmax(0,1.12fr) minmax(420px,.88fr);gap:70px;align-items:center}
.author-section.author-redesign .author-image-wrap{margin:0;border-radius:18px;background:#eef2f8;box-shadow:0 26px 60px -40px rgba(7,21,64,.32)}
.author-section.author-redesign .author-image-wrap>img{width:100%;aspect-ratio:1.13;object-fit:cover;object-position:50% 50%}
.author-section.author-redesign .portrait-label{position:static;min-height:60px;display:flex;align-items:center;justify-content:center;gap:0;padding:14px 22px;text-align:center;background:linear-gradient(90deg,#ffcc05,#ffd61f);font-size:14px;letter-spacing:0;width:100%;box-sizing:border-box;white-space:nowrap;container-type:inline-size}
.author-section.author-redesign .portrait-label>*{font-size:clamp(7px,2.6cqi,15.5px);font-weight:700;line-height:1;letter-spacing:.12em}.author-section.author-redesign .portrait-label strong{font-weight:800}
.author-section.author-redesign .portrait-label>*+*:before{content:'•';margin:0 .85em 0 .73em;opacity:.7}
.author-section.author-redesign .portrait-label>span:last-child{margin-right:0}
.author-section.author-redesign .author-copy{min-width:0}
.author-section.author-redesign .eyebrow{margin-bottom:30px;font-size:13px;letter-spacing:.15em}
.author-section.author-redesign h2{margin:0 0 26px;font-size:clamp(58px,4.55vw,72px);line-height:.94;letter-spacing:-.025em}
.author-section.author-redesign h2 span,.author-section.author-redesign h2 em{display:block}
.author-section.author-redesign h2 span{color:var(--navy)}
.author-section.author-redesign h2 em{color:#0d4cd3;font-style:normal}
.author-section.author-redesign .author-copy>p:not(.author-signature):not(.author-role){max-width:570px;margin:0 0 26px;color:#31456f;font-size:20px;line-height:1.42}
.author-section.author-redesign .author-signature{margin:32px 0 2px;color:#0b4dc8;font-size:30px;line-height:1;text-transform:uppercase}
.author-section.author-redesign .author-role{margin:0;color:#6074a2;font-size:17px;line-height:1.4}
.author-section.author-redesign .author-actions{display:flex;align-items:center;gap:28px;margin-top:34px}
.author-section.author-redesign .author-actions .button{min-width:294px;min-height:70px;justify-content:center;border-radius:10px;font-size:20px;background:linear-gradient(90deg,#0938b6,#064dd1);box-shadow:0 17px 30px -20px rgba(5,62,194,.75)}
.author-section.author-redesign .author-actions .button .icon{width:27px;height:27px}
.author-section.author-redesign .author-action-divider{width:1px;height:52px;background:#9bb0d7}
.author-section.author-redesign .author-actions .socials{gap:20px;margin:0}
.author-section.author-redesign .author-actions .socials a{width:50px;height:50px;padding:0;border:0;border-radius:9px;background:transparent;box-shadow:0 8px 18px -12px rgba(7,21,64,.55)}
.author-section.author-redesign .author-actions .socials img{width:100%;height:100%}
@media(max-width:1180px){
 .author-section.author-redesign .portrait-label{padding-inline:10px}
 .author-section.author-redesign{padding:82px 0 88px}
 .author-section.author-redesign .author-layout{grid-template-columns:minmax(0,1.05fr) minmax(390px,.95fr);gap:44px}
 .author-section.author-redesign h2{font-size:clamp(50px,5.3vw,64px)}
 .author-section.author-redesign .author-copy>p:not(.author-signature):not(.author-role){font-size:17px}
 .author-section.author-redesign .author-actions{flex-wrap:wrap;gap:18px}.author-section.author-redesign .author-actions .button{min-width:230px;font-size:17px}
 .author-section.author-redesign .author-action-divider{display:none}
}
@media(max-width:900px){
 .author-section.author-redesign .author-layout{grid-template-columns:1fr;gap:52px}
 .author-section.author-redesign .author-image-wrap{width:100%;max-width:700px;margin:0 auto}
 .author-section.author-redesign .author-copy{max-width:700px;margin:0 auto}
 .author-section.author-redesign h2{font-size:clamp(54px,8vw,72px)}
 .author-section.author-redesign .author-copy>p:not(.author-signature):not(.author-role){max-width:650px;font-size:19px}
}
@media(max-width:620px){
 .author-section.author-redesign{padding:62px 0 68px}
 .author-section.author-redesign .container{width:calc(100% - 32px)}
 .author-section.author-redesign .author-layout{gap:38px}
 .author-section.author-redesign .author-image-wrap{border-radius:14px}
 .author-section.author-redesign .author-image-wrap>img{aspect-ratio:1.05;object-position:49% 50%}
 .author-section.author-redesign .portrait-label{min-height:50px;padding:12px 10px}

 .author-section.author-redesign .eyebrow{margin-bottom:22px;font-size:10px}
 .author-section.author-redesign h2{font-size:clamp(49px,14.2vw,62px);margin-bottom:22px}
 .author-section.author-redesign .author-copy>p:not(.author-signature):not(.author-role){font-size:16px;line-height:1.48;margin-bottom:20px}
 .author-section.author-redesign .author-signature{font-size:27px;margin-top:27px}.author-section.author-redesign .author-role{font-size:15px}
 .author-section.author-redesign .author-actions{align-items:stretch;gap:16px;flex-wrap:wrap;margin-top:28px}
 .author-section.author-redesign .author-actions .button{width:100%;min-width:0;min-height:58px;font-size:17px}
 .author-section.author-redesign .author-action-divider{display:none}
 .author-section.author-redesign .author-actions .socials{width:100%;justify-content:flex-start}.author-section.author-redesign .author-actions .socials a{width:44px;height:44px}
}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.js-reveal .reveal-ready{opacity:1;transform:none}.float-card{animation:none}.hero-author-photo{transform:none!important}}
@media print{.header,.footer,.article-toc,.reading-progress,.article-cta,.final-cta,.icon-button,.marquee,.article-chart{display:none}body{color:#000;background:#fff}.container{width:100%}.article-layout{display:block}.article-prose{max-width:none}.article-header{padding:0}.article-prose p{color:#222}.section{padding:20px 0}}

/* ---------- Look inside: table of contents redesign ---------- */
.book-section.book-redesign .contents-section{position:relative;width:min(1240px,calc(100% - 64px));margin-top:112px;padding:0 0 112px}
.book-redesign .contents-head{position:relative;margin:0 auto 52px;text-align:center}
.book-redesign .contents-head .eyebrow{justify-content:center;margin-bottom:22px;font-size:13px;letter-spacing:.24em}
.book-section.book-redesign .contents-section .contents-head h3{margin:0;font:700 clamp(42px,4.7vw,70px)/.94 var(--display);color:var(--navy);letter-spacing:-.012em;text-transform:uppercase}
.book-redesign .contents-head h3 span{display:block}
.book-redesign .contents-hint{display:flex;align-items:center;justify-content:center;gap:20px;margin:22px 0 0;font-size:16px;line-height:1.4;color:#6b7896}
.book-redesign .contents-hint::before,.book-redesign .contents-hint::after{content:"";width:56px;height:1px;background:#d6deec}
.book-redesign .contents-dots{position:absolute;width:104px;height:104px;background:radial-gradient(circle,rgba(21,69,189,.3) 1.5px,transparent 2px) 0 0/24px 24px;pointer-events:none;animation:aboutFloat 9s ease-in-out infinite}
.book-redesign .contents-dots-l{left:-34px;top:-8px}
.book-redesign .contents-dots-r{right:-34px;top:34px;height:152px;animation-delay:-4.5s}
.book-section.book-redesign .contents-section .chapter-groups{grid-template-columns:1fr 1fr;gap:12px 24px}
.book-section.book-redesign .contents-section .chapter-groups details{background:#fff;border:1px solid #e3e8f3;border-radius:14px;box-shadow:0 1px 2px rgba(7,21,64,.04),0 12px 26px -22px rgba(7,21,64,.28);transition:border-color .25s,box-shadow .25s}
.book-section.book-redesign .contents-section .chapter-groups details:hover{border-color:#c8d5f0;box-shadow:0 1px 2px rgba(7,21,64,.04),0 20px 36px -24px rgba(7,21,64,.4)}
.book-section.book-redesign .contents-section .chapter-groups details[open]{border-color:#b9c9ee;box-shadow:0 1px 2px rgba(7,21,64,.04),0 24px 44px -28px rgba(21,69,189,.45)}
.book-section.book-redesign .contents-section .chapter-groups summary{gap:0;min-height:64px;padding:10px 22px 10px 24px;font-size:17px;font-weight:600;line-height:1.3;color:var(--navy);border-radius:14px}
.book-section.book-redesign .contents-section .chapter-groups summary:hover{color:var(--blue-2)}
.book-section.book-redesign .contents-section .chapter-groups summary:focus-visible{outline-offset:-3px;border-radius:14px}
.book-section.book-redesign .contents-section .chapter-part{flex:0 0 78px;width:auto;margin-right:24px;padding:4px 0;border-right:1px solid #dfe5f0;font:700 15px/1.2 var(--display);letter-spacing:.06em;color:var(--blue-2)}
.book-redesign .chapter-title{flex:1;min-width:0}
.book-section.book-redesign .contents-section .chapter-range{display:inline;margin-left:16px;font-size:13px;font-weight:500;color:#7a86a0}
.book-section.book-redesign .contents-section .chapter-groups summary>.icon{flex:0 0 auto;width:22px;height:22px;margin-left:36px;stroke-width:2;color:var(--blue-2);transition:transform .45s cubic-bezier(.34,1.56,.64,1)}
.book-section.book-redesign .contents-section .chapter-groups ol{margin:0 22px 0 24px;padding:14px 0 18px 103px;border-top:1px solid #edf1f8;font-size:14.5px;line-height:1.55;color:#4f5d7b}
.book-redesign .chapter-groups details[open] ol{animation:chaptersOpen .4s var(--ease) both}
/* Pop-up reveal: cards that enter together cascade via --reveal-delay set in app.js */
.js-reveal .book-redesign .chapter-groups details.reveal-ready{opacity:0;transform:translateY(26px) scale(.94);transition:opacity .5s var(--ease) var(--reveal-delay,0ms),transform .7s cubic-bezier(.34,1.56,.64,1) var(--reveal-delay,0ms),border-color .25s,box-shadow .25s}
.js-reveal .book-redesign .chapter-groups details.reveal-ready.is-visible,.reveal-done .book-redesign .chapter-groups details.reveal-ready{opacity:1;transform:none}
@keyframes chaptersOpen{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
@media(max-width:1180px){
 .book-section.book-redesign .contents-section .chapter-groups summary{font-size:15.5px;padding:10px 18px 10px 20px}
 .book-section.book-redesign .contents-section .chapter-part{flex-basis:70px;margin-right:16px}
 .book-section.book-redesign .contents-section .chapter-range{font-size:12px}
 .book-section.book-redesign .contents-section .chapter-groups summary>.icon{margin-left:18px}
 .book-section.book-redesign .contents-section .chapter-groups ol{margin:0 18px 0 20px;padding-left:87px}
}
@media(max-width:900px){
 .book-section.book-redesign .contents-section{margin-top:80px;padding-bottom:80px}
 .book-section.book-redesign .contents-section .chapter-groups{grid-template-columns:1fr;gap:10px}
 .book-redesign .contents-dots{display:none}
}
@media(max-width:620px){
 .book-section.book-redesign .contents-section{width:calc(100% - 32px);margin-top:64px;padding-bottom:64px}
 .book-redesign .contents-head{margin-bottom:32px}
 .book-redesign .contents-head .eyebrow{font-size:11px;margin-bottom:16px}
 .book-section.book-redesign .contents-section .contents-head h3{font-size:clamp(32px,9.6vw,44px)}
 .book-redesign .contents-hint{font-size:14px;gap:12px}.book-redesign .contents-hint::before,.book-redesign .contents-hint::after{width:28px}
 .book-section.book-redesign .contents-section .chapter-groups summary{min-height:58px;padding:8px 14px 8px 16px;font-size:15px}
 .book-section.book-redesign .contents-section .chapter-part{flex-basis:62px;margin-right:14px;font-size:13px}
 .book-section.book-redesign .contents-section .chapter-range{display:none}
 .book-section.book-redesign .contents-section .chapter-groups summary>.icon{width:20px;height:20px;margin-left:12px}
 .book-section.book-redesign .contents-section .chapter-groups ol{margin:0 14px 0 16px;padding:12px 0 16px 60px;font-size:13.5px}
}

/* ---------- Salary section redesign (explorer styles live in components/salary-chart.css) ---------- */
.salary-section.salary-redesign{padding:112px 0 120px;background:radial-gradient(55% 45% at 50% 0,rgba(38,92,230,.38),rgba(38,92,230,0) 70%),radial-gradient(40% 40% at 0 100%,rgba(38,92,230,.18),transparent 70%),linear-gradient(180deg,#0b205f 0%,#08194d 55%,#071540 100%)}
.salary-section.salary-redesign:before{display:none}
.salary-section.salary-redesign>.container{width:min(1320px,calc(100% - 64px))}
@media(max-width:720px){.salary-section.salary-redesign{padding:72px 0 80px}.salary-section.salary-redesign>.container{width:calc(100% - 32px)}}

/* Skill stack motion. skills-motion.js drives it with classes: sk-armed (script running, content may be hidden) →
   sk-in (per group: .skills-copy, .skill-stamp, .skill-grid, added as each scrolls into view).
   sk-running is set only while the section is on screen, so ambient loops pause off screen. */
.skills-redesign .sk-line{display:block}
.skills-redesign .sk-count{font:inherit;letter-spacing:inherit;font-variant-numeric:tabular-nums}
.skills-redesign h2 em>.sk-line:nth-child(1){--d:.12s}
.skills-redesign h2 em>.sk-line:nth-child(2){--d:.22s}
@media(prefers-reduced-motion:no-preference){
 .sk-armed .skills-copy:not(.sk-in)>:is(.eyebrow,p,.text-link,.skill-dots,.skill-orbits),.sk-armed .skills-copy:not(.sk-in) .sk-line,.sk-armed .skill-stamp:not(.sk-in),.sk-armed .skill-grid:not(.sk-in){opacity:0}
 /* Copy: eyebrow, then the headline line by line out of a blur, then the paragraph and link */
 .skills-copy.sk-in>.eyebrow{animation:sk-rise .9s cubic-bezier(.22,1,.36,1) backwards}
 .skills-copy.sk-in>.eyebrow>span{animation:sk-pop .8s cubic-bezier(.34,1.56,.64,1) .15s backwards,sk-ping 2.8s cubic-bezier(.22,1,.36,1) 1.4s infinite}
 .skills-copy.sk-in .sk-line{animation:sk-line-in 1.1s cubic-bezier(.22,1,.36,1) var(--d,0s) backwards}
 /* The blue lines carry a light sweep that repeats while on screen */
 .sk-armed .skills-copy h2 em>.sk-line{background:linear-gradient(105deg,#1746b5 42%,#7aa2ff 50%,#1746b5 58%) 100% 0/250% 100% no-repeat;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
 .skills-copy.sk-in h2 em>.sk-line{animation:sk-line-in 1.1s cubic-bezier(.22,1,.36,1) var(--d,0s) backwards,sk-shimmer 7s cubic-bezier(.45,.05,.55,.95) calc(1.4s + var(--d,0s)) infinite}
 .skills-copy.sk-in>p{animation:sk-rise 1s cubic-bezier(.22,1,.36,1) .4s backwards}
 .skills-copy.sk-in>.text-link{animation:sk-rise 1s cubic-bezier(.22,1,.36,1) .52s backwards}
 .skills-copy.sk-in>.text-link .icon{animation:sk-nudge 2.6s ease-in-out 2s infinite}
 .skills-copy.sk-in>.text-link:hover .icon{animation:none}
 /* Decor: dots ripple in, orbits expand, then the yellow dot sways along its ring */
 .skills-copy.sk-in>.skill-dots{animation:sk-fade 1.2s cubic-bezier(.22,1,.36,1) .7s backwards}
 .sk-armed .skill-orbits{translate:calc(var(--px,0) * -18px) calc(var(--py,0) * -18px);transition:translate .8s cubic-bezier(.22,1,.36,1)}
 .skills-copy.sk-in>.skill-orbits{animation:sk-orbits-in 1.6s cubic-bezier(.22,1,.36,1) .3s backwards}
 .skills-copy.sk-in>.skill-orbits:after{animation:sk-sway 9s ease-in-out 1.9s infinite alternate}
 /* Stamp: the number rises and counts up, the yellow rule and label wipe in */
 .skill-stamp.sk-in>.sk-count{display:inline-block;animation:sk-stamp-in 1s cubic-bezier(.34,1.56,.64,1) backwards}
 .skill-stamp.sk-in>span{animation:sk-wipe .9s cubic-bezier(.65,0,.35,1) .35s backwards}
 /* Card lifts in, the divider draws down, then the rows cascade with their numbers ticking in */
 .skill-grid.sk-in{animation:sk-card-in 1.1s cubic-bezier(.22,1,.36,1) .1s backwards}
 .skill-grid.sk-in:not(.sk-done):before{transform-origin:top;animation:sk-draw-y 1.2s cubic-bezier(.65,0,.35,1) .45s backwards}
 .skill-grid.sk-in:not(.sk-done)>.skill-item{animation:sk-row-in .8s cubic-bezier(.22,1,.36,1) calc(.35s + var(--r,0) * 60ms + var(--c,0) * 45ms) backwards}
 .skill-grid.sk-in:not(.sk-done)>.skill-item>span{animation:sk-num-in .7s cubic-bezier(.34,1.56,.64,1) calc(.5s + var(--r,0) * 60ms + var(--c,0) * 45ms) backwards}
 /* A soft pulse travels down the column divider while the section is on screen */
 .sk-armed .skill-grid:before{background:linear-gradient(180deg,transparent,rgba(23,70,181,.75),rgba(255,211,38,.9),transparent) 0 -40%/1px 18% no-repeat,#d8e1ed}
 .sk-running .skill-grid.sk-done:before{animation:sk-pulse 5.5s cubic-bezier(.45,.05,.55,.95) 1.8s infinite}
 .sk-armed:not(.sk-running) :is(.eyebrow>span,h2 em>.sk-line,.text-link .icon,.skill-orbits:after){animation-play-state:paused}
}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 /* Pointer spotlight inside the card, painted under the rows */
 .sk-armed .skill-grid:after{content:'';position:absolute;inset:0;z-index:-1;border-radius:inherit;background:radial-gradient(320px circle at var(--mx,50%) var(--my,50%),rgba(23,70,181,.07),transparent 70%);opacity:0;transition:opacity .4s var(--ease);pointer-events:none}
 .sk-armed .skill-grid:hover:after{opacity:1}
}
@keyframes sk-rise{from{opacity:0;translate:0 18px}}
@keyframes sk-fade{from{opacity:0}}
@keyframes sk-pop{from{opacity:0;scale:0;rotate:-90deg}}
@keyframes sk-ping{0%{box-shadow:0 0 0 0 rgba(255,207,8,.55)}70%,100%{box-shadow:0 0 0 9px rgba(255,207,8,0)}}
@keyframes sk-line-in{from{opacity:0;translate:0 .45em;filter:blur(10px)}60%{filter:blur(0)}}
@keyframes sk-shimmer{0%{background-position:100% 0}35%,100%{background-position:0 0}}
@keyframes sk-nudge{0%,70%,100%{translate:0}80%{translate:5px 0}90%{translate:1px 0}}
@keyframes sk-orbits-in{from{opacity:0;scale:.55}}
@keyframes sk-sway{to{rotate:-40deg}}
@keyframes sk-stamp-in{from{opacity:0;translate:0 30px;scale:.8}}
@keyframes sk-wipe{from{clip-path:inset(0 100% 0 0);opacity:0}to{clip-path:inset(0 0 0 0)}}
@keyframes sk-card-in{from{opacity:0;translate:0 36px;scale:.97;box-shadow:0 0 0 0 rgba(7,21,64,0)}}
@keyframes sk-draw-y{from{transform:scaleY(0)}}
@keyframes sk-row-in{from{opacity:0;translate:-14px 0}}
@keyframes sk-num-in{from{opacity:0;translate:0 10px;scale:.6}}
@keyframes sk-pulse{0%{background-position:0 -40%}60%,100%{background-position:0 140%}}

/* ---------- resources page: light pack panel (September 16, 2026) ---------- */
.pack-page{position:relative;isolation:isolate;overflow:hidden;padding:clamp(36px,4vw,56px) 0 clamp(72px,8vw,112px)}
.pack-page>.container{width:min(1340px,calc(100% - 64px))}
.pack-deco{position:absolute;inset:0;z-index:-1;pointer-events:none}
.pack-anchor{position:absolute;top:0;left:0;width:1px;height:1px;pointer-events:none}
.pack-blob{position:absolute;border-radius:50%}
.pack-blob-a{width:clamp(260px,26vw,400px);aspect-ratio:1;left:calc(50% - min(670px,50vw) - 110px);top:-40px;background:radial-gradient(circle at 60% 55%,#f7b8ea 0,#f9c9ef 55%,#fbd6f3 100%)}
.pack-blob-b{width:clamp(260px,24vw,380px);aspect-ratio:1;right:calc(50% - min(670px,50vw) - 130px);bottom:16px;background:radial-gradient(circle at 40% 40%,#d8def9 0,#dfe4fb 60%,#e6eafc 100%)}
.pack-sparks{position:absolute;width:74px;right:calc(50% - min(670px,50vw) - 44px);top:clamp(4px,1.5vw,18px);color:#f06ad8}
.pack-box{position:relative;padding:clamp(30px,3vw,40px) clamp(24px,2vw,30px) clamp(36px,3.4vw,50px);border-radius:clamp(26px,3vw,40px);background:linear-gradient(180deg,rgba(248,250,255,.94),rgba(244,247,254,.96));border:1px solid rgba(255,255,255,.95);box-shadow:0 1px 0 #fff inset,0 40px 90px -30px rgba(40,60,140,.22),0 10px 30px -12px rgba(40,60,140,.1);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.pack-head{text-align:center}
.pack-pill{display:inline-flex;align-items:center;gap:14px;margin:0;padding:11px 26px;border-radius:999px;background:#f8faff;border:1px solid #dfe5f2;box-shadow:0 4px 14px -8px rgba(30,50,120,.18);font-size:14px;line-height:1.2;font-weight:700;letter-spacing:.22em;color:#1532b8}
.pack-pill>span{width:12px;height:12px;border-radius:50%;background:var(--yellow)}
.pack-head h1{margin:clamp(14px,1.6vw,20px) 0 0;font:700 clamp(30px,4.2vw,58px)/1 var(--body);text-transform:none;letter-spacing:-.055em;color:#07091c}
.pack-head h1 span{display:block}
.pack-title-a{color:#1433d6;font-size:1.2em;line-height:.98}
.pack-title-b{margin-top:.08em}
@media(min-width:1181px){.pack-head h1 span{white-space:nowrap}}
.pack-lede{margin:clamp(12px,1.3vw,16px) 0 0;font-size:clamp(16px,1.6vw,21px);line-height:1.5;color:#3e4a74}
.pack-tiles{list-style:none;margin:clamp(22px,2.4vw,30px) 0 0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(12px,1.2vw,16px) clamp(10px,1.1vw,14px)}
.pack-tiles li{--w:calc((100% - 4 * clamp(10px,1.1vw,14px)) / 5);flex:0 0 var(--w);min-width:0;display:flex;align-items:center;gap:clamp(12px,1.1vw,16px);padding:clamp(14px,1.3vw,18px) clamp(12px,1.1vw,16px);border-radius:12px;background:#fff;border:1px solid #e7ebf3;box-shadow:0 2px 6px -2px rgba(20,40,110,.06);scroll-margin-top:120px;transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s;cursor:default}
.pack-tiles li:nth-child(n+11){flex-basis:calc(var(--w) * 1.17)}
.pack-tiles li:hover{transform:translateY(-4px);border-color:#d3dbee;box-shadow:0 20px 34px -18px rgba(20,40,110,.28)}
.pack-tiles li{position:relative}
.pack-tiles li.pack-picked{z-index:2;border-color:#1433d6;transform:translateY(-6px) scale(1.04);box-shadow:0 0 0 4px rgba(20,51,214,.14),0 26px 44px -20px rgba(20,51,214,.45)}
.pack-tiles li.pack-wave{z-index:1}
@media(prefers-reduced-motion:no-preference){
 .pack-tiles li.pack-wave{animation:pack-wave .95s cubic-bezier(.34,1.56,.64,1) calc(var(--i,0) * 55ms) both}
 .pack-tiles li.pack-wave .pack-icon{animation:pack-wave-icon .95s cubic-bezier(.34,1.56,.64,1) calc(var(--i,0) * 55ms + 60ms) both}
 .pack-tiles li.pack-wave:after{animation:pack-ripple 1.1s cubic-bezier(.22,1,.36,1) calc(var(--i,0) * 55ms + 150ms)}
 @keyframes pack-wave{0%,100%{transform:none}45%{transform:translateY(-9px) scale(1.06);border-color:#1433d6;box-shadow:0 0 0 4px rgba(20,51,214,.14),0 26px 44px -20px rgba(20,51,214,.45)}}
 @keyframes pack-wave-icon{0%,100%{transform:none}45%{transform:rotate(-8deg) scale(1.12)}}
}
@media(prefers-reduced-motion:reduce){.pack-tiles li.pack-wave{border-color:#1433d6}}
.pack-tiles li.pack-picked .pack-icon{transform:rotate(-6deg) scale(1.06)}
.pack-tiles li:is(.pack-picked,.pack-wave):after{content:'';position:absolute;inset:-1px;border-radius:inherit;border:2px solid #1433d6;pointer-events:none;opacity:0}
@media(prefers-reduced-motion:no-preference){
 .pack-tiles li.pack-picked{animation:pack-pop .75s cubic-bezier(.34,1.56,.64,1) both}
 .pack-tiles li:is(.pack-picked,.pack-wave):after{animation:pack-ripple 1.1s cubic-bezier(.22,1,.36,1) .15s}
 @keyframes pack-pop{0%{transform:none;border-color:#e7ebf3;box-shadow:0 2px 6px -2px rgba(20,40,110,.06)}55%{transform:translateY(-9px) scale(1.08)}}
 @keyframes pack-ripple{0%{opacity:.9;inset:-1px}100%{opacity:0;inset:-14px}}
}
.pack-icon{width:clamp(48px,3.9vw,56px);aspect-ratio:1;flex-shrink:0;border-radius:12px;display:grid;place-items:center;color:#0c1440;background:var(--tint);transition:transform .3s var(--ease)}
.pack-icon .icon{width:48%;height:48%}
.pack-tiles li:hover .pack-icon{transform:rotate(-6deg) scale(1.06)}
.pack-tint-blue{--tint:#e2ebfd}.pack-tint-yellow{--tint:#fdf1cf}.pack-tint-pink{--tint:#fce3f1}.pack-tint-green{--tint:#dcf4ea}.pack-tint-violet{--tint:#ebe6fb}
[data-cat=portfolio] .pack-icon{color:#3137d4}[data-cat=jobs] .pack-icon{color:#4b2fd0}[data-cat=remote] .pack-icon{color:#1f43d6}
.pack-text{min-width:0}
.pack-tiles b{display:block;font-size:clamp(15px,1.15vw,16.5px);line-height:1.25;font-weight:600;letter-spacing:-.015em;color:#0b1233}
.pack-tiles small{display:block;margin-top:5px;font-size:clamp(12px,.95vw,13px);line-height:1.35;color:#5d6788}
.pack-dock{position:relative;display:flex;justify-content:center;margin-top:clamp(28px,3.2vw,40px)}
.pack-download-button{position:relative;overflow:hidden;min-height:clamp(62px,5.3vw,76px);min-width:min(100%,clamp(300px,29vw,434px));padding:16px 40px;gap:20px;border-radius:14px;font-size:clamp(20px,2.1vw,30px);font-weight:700;letter-spacing:-.02em;color:#0b1233;background:linear-gradient(180deg,#ffd52e 0%,#ffc400 100%);box-shadow:0 1px 0 rgba(255,255,255,.55) inset,0 16px 30px -12px rgba(230,170,0,.6)}
.pack-download-button:hover{background:linear-gradient(180deg,#ffdc4a 0%,#ffcb14 100%)}
.pack-download-button .icon{width:1.15em;height:1.15em;stroke-width:2.2}
.pack-download-button:hover .icon{transform:translateY(3px)}
.pack-btn-shine{position:absolute;top:0;bottom:0;left:-40%;width:35%;background:linear-gradient(105deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-18deg);pointer-events:none}
.pack-hint{position:absolute;left:calc(50% + min(50%,clamp(150px,14.5vw,217px)) + 20px);top:50%;display:flex;align-items:center;gap:14px;transform:translateY(-38%);color:#0b1233;pointer-events:none}
.pack-arrow{width:clamp(56px,5.6vw,82px);height:auto;flex-shrink:0}
.pack-script{position:relative;display:block;font:italic 400 clamp(30px,3.1vw,44px)/1 "Bradley Hand","Segoe Print","Ink Free","Comic Sans MS",cursive;letter-spacing:-.01em;rotate:-9deg;white-space:nowrap}
.pack-swoosh{position:absolute;left:-2%;bottom:-14px;width:78%;height:auto;color:#f06ad8;opacity:.85}
.pack-ticks{position:absolute;right:-26px;top:-24px;width:22px;height:auto}
@media(prefers-reduced-motion:no-preference){
 .pack-btn-shine{animation:pack-shine 3.2s var(--ease) infinite}
 @keyframes pack-shine{0%,60%{left:-40%}100%{left:140%}}
 .pack-head>*{animation:pack-in .7s var(--ease) both}
 .pack-head>h1{animation-delay:.06s}.pack-head>.pack-lede{animation-delay:.12s}
 .pack-tiles li{animation:pack-in .6s var(--ease) both;animation-delay:calc(var(--i)*45ms + .2s)}
 .pack-dock>*{animation:pack-in .7s var(--ease) .7s both}
 @keyframes pack-in{from{opacity:0;transform:translateY(16px)}}
 .pack-hint{animation:none}
 .pack-arrow{animation:pack-nudge 1.8s var(--ease) 1.4s infinite}
 @keyframes pack-nudge{0%,100%{transform:translateX(0)}50%{transform:translateX(6px)}}
 .pack-blob-a{animation:pack-drift 12s ease-in-out infinite alternate}
 .pack-blob-b{animation:pack-drift 14s ease-in-out infinite alternate-reverse}
 @keyframes pack-drift{to{transform:translate(24px,18px)}}
}
@media(min-width:1181px) and (max-height:1000px){
 .pack-page{padding-top:24px}
 .pack-box{padding-top:26px;padding-bottom:30px}
 .pack-pill{padding:9px 22px;font-size:13px}
 .pack-head h1{margin-top:12px;font-size:clamp(30px,3.7vw,52px)}
 .pack-lede{margin-top:10px;font-size:clamp(16px,1.4vw,19px)}
 .pack-tiles{margin-top:20px;row-gap:12px}
 .pack-tiles li{padding-top:12px;padding-bottom:12px}
 .pack-dock{margin-top:24px}
 .pack-download-button{min-height:60px}
}
@media(min-width:1181px) and (max-height:820px){
 .pack-page{padding-top:16px}
 .pack-box{padding-top:20px;padding-bottom:24px}
 .pack-pill{padding:7px 18px;font-size:12px}
 .pack-head h1{margin-top:10px;font-size:clamp(28px,3.3vw,46px)}
 .pack-lede{margin-top:8px;font-size:16px;line-height:1.4}
 .pack-tiles{margin-top:16px;row-gap:10px}
 .pack-tiles li{padding-top:9px;padding-bottom:9px}
 .pack-icon{width:44px}
 .pack-dock{margin-top:18px}
 .pack-download-button{min-height:54px;font-size:22px}
}
@media(max-width:1180px){
 .pack-tiles li{--w:calc((100% - 2 * clamp(10px,1.1vw,14px)) / 3)}
 .pack-tiles li:nth-child(n+11){flex-basis:var(--w)}
 .pack-dock{flex-direction:column;align-items:center;gap:10px}
 .pack-hint{position:static;transform:none;flex-direction:column;gap:8px}
 .pack-arrow{rotate:90deg;width:48px}
 .pack-script{rotate:-6deg}
}
@media(max-width:860px){
 .pack-tiles li{--w:calc((100% - clamp(10px,1.1vw,14px)) / 2)}
 .pack-sparks{right:4px;width:54px}
}
@media(max-width:620px){
 .pack-page{padding-top:20px}
 .pack-page>.container{width:calc(100% - 32px)}
 .pack-box{padding:26px 16px 32px}
 .pack-pill{font-size:11px;padding:9px 18px;gap:10px;letter-spacing:.18em}
 .pack-pill>span{width:9px;height:9px}
 .pack-lede br{display:none}
 .pack-tiles li,.pack-tiles li:nth-child(n+11){flex-basis:100%;padding:12px 14px}
 .pack-download-button{width:100%;min-width:0;padding:16px 20px}
 .pack-blob-a{left:-140px;top:-80px}.pack-blob-b{right:-140px}
}

/* ---------- Inside the book: 3D flipbook (home) ---------- */
.flipbook-section{position:relative;overflow:hidden;isolation:isolate;padding:clamp(80px,8vw,120px) 0 clamp(72px,7vw,104px);background:radial-gradient(ellipse 55% 50% at 50% 58%,#e3ebff 0,rgba(227,235,255,0) 72%),linear-gradient(180deg,#fff 0,#f6f8fd 100%)}
.fb-bg{position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:radial-gradient(rgba(15,45,143,.13) 1px,transparent 1.4px);background-size:22px 22px;-webkit-mask:radial-gradient(ellipse 60% 55% at 50% 60%,#000 0,transparent 78%);mask:radial-gradient(ellipse 60% 55% at 50% 60%,#000 0,transparent 78%)}
.fb-head{max-width:980px;margin:0 auto;text-align:center}
.fb-head .eyebrow{justify-content:center;margin-bottom:22px;letter-spacing:.22em}
.fb-head h2{margin:0;font:800 clamp(46px,5.6vw,84px)/.92 var(--display);letter-spacing:-.005em;text-transform:uppercase;color:#071331}
.fb-head h2>*{display:block}
.fb-head h2 em{font-style:normal;color:#174ac2}
.fb-head p{max-width:560px;margin:22px auto 0;font-size:18px;line-height:1.6;color:#4a5d83}

.fb-wrap{--fb-w:min(350px,calc((100vw - 56px) / 2));--fb-h:calc(var(--fb-w) * 1.5);--fb-t:calc(var(--fb-w) * .11);--fb-gap:calc(var(--fb-t) / 5);--fb-shift:0px;--fb-bx:9deg;--fb-by:24deg;--fb-floor:1.05;position:relative;margin-top:clamp(28px,4vw,48px)}
.fb-wrap[data-state=open]{--fb-gap:1.2px;--fb-shift:calc(var(--fb-w) / 2);--fb-bx:12deg;--fb-by:0deg;--fb-floor:2.1}
.fb-wrap[data-state=back]{--fb-shift:var(--fb-w);--fb-bx:9deg;--fb-by:-24deg}
.fb-stage{position:relative;height:calc(var(--fb-h) * 1.2);perspective:2200px;perspective-origin:50% 40%;cursor:pointer;touch-action:pan-y;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;outline:none}
.fb-stage:focus-visible{outline:2px solid #1c44c6;outline-offset:6px;border-radius:24px}
.fb-float,.fb-scene{position:absolute;inset:0;transform-style:preserve-3d}
.fb-scene{--px:0deg;--py:0deg;transform:rotateX(calc(var(--fb-bx) + var(--py))) rotateY(calc(var(--fb-by) + var(--px)));transition:transform 1s cubic-bezier(.22,1,.36,1),rotate 1.3s cubic-bezier(.22,1,.36,1)}
.fb-book{position:absolute;left:50%;top:50%;width:var(--fb-w);height:var(--fb-h);margin:calc(var(--fb-h) / -2) 0 0 calc(var(--fb-w) / -2);transform-style:preserve-3d;transform:translateX(var(--fb-shift));transition:transform .85s cubic-bezier(.45,.05,.25,1)}
.fb-leaf{--z:0;--turn:0;--peek:0deg;position:absolute;inset:0;transform-origin:left center;transform-style:preserve-3d;transform:translateZ(calc(var(--z) * var(--fb-gap))) rotateY(calc(var(--turn) * -180deg + var(--peek)));transition:transform .9s cubic-bezier(.5,.08,.22,1) var(--d,0ms)}
.fb-face{position:absolute;inset:0;overflow:hidden;background:#fff;-webkit-backface-visibility:hidden;backface-visibility:hidden;border-radius:0 5px 5px 0}
.fb-back{transform:rotateY(180deg) translateZ(.01px);border-radius:5px 0 0 5px}
.fb-face img{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none}
.fb-face::before{content:"";position:absolute;inset:0 auto 0 0;z-index:1;width:14%;background:linear-gradient(90deg,rgba(7,21,64,.2),rgba(7,21,64,.05) 45%,transparent);pointer-events:none}
.fb-back::before{inset:0 0 0 auto;background:linear-gradient(270deg,rgba(7,21,64,.2),rgba(7,21,64,.05) 45%,transparent)}
.fb-leaf:first-child .fb-front,.fb-leaf:last-child .fb-back{box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.fb-leaf:first-child .fb-front::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,rgba(255,255,255,.18) 0,transparent 32%,transparent 70%,rgba(0,0,0,.12));pointer-events:none}
.fb-shade{position:absolute;inset:0;z-index:2;opacity:0;pointer-events:none;background:linear-gradient(90deg,rgba(7,21,64,.35),rgba(7,21,64,.08) 60%,rgba(255,255,255,.12))}
.fb-back .fb-shade{background:linear-gradient(270deg,rgba(7,21,64,.35),rgba(7,21,64,.08) 60%,rgba(255,255,255,.12))}
.fb-leaf.is-turning .fb-shade{animation:fb-shade .9s cubic-bezier(.5,.08,.22,1) var(--d,0ms) both}
.fb-endpaper{position:absolute;inset:0;background:radial-gradient(circle at 50% 45%,#1f4fd0 0,#0f2d8f 70%);display:grid;place-items:center}
.fb-endpaper::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);background-size:18px 18px}
.fb-endpaper span{position:relative;font:800 calc(var(--fb-w) * .075)/1 var(--display);letter-spacing:.14em;color:rgba(255,255,255,.28);text-transform:uppercase}
.fb-endpaper span b{color:rgba(255,207,8,.55);font-weight:800}

/* Depth: spine and page block, only while the book is shut */
.fb-spine{position:absolute;top:0;left:0;width:var(--fb-t);height:100%;background:#0f2d8f url(/assets/flipbook/spine.webp) center/100% 100% no-repeat;border-radius:3px;-webkit-backface-visibility:hidden;backface-visibility:hidden;transform-origin:left center;opacity:0;transition:opacity .35s;box-shadow:inset -6px 0 10px -6px rgba(0,0,0,.35),inset 6px 0 10px -6px rgba(255,255,255,.2)}
.fb-spine-front{transform:translateZ(var(--fb-gap)) rotateY(-90deg)}
.fb-spine-back{transform:translateZ(calc(var(--fb-gap) * 6)) rotateY(90deg)}
.fb-wrap[data-state=closed] .fb-spine-front,.fb-wrap[data-state=back] .fb-spine-back{opacity:1;transition:opacity .35s .45s}
.fb-wrap:not(.fb-js) .fb-spine-front{opacity:1}
.fb-floor{position:absolute;left:50%;top:calc(50% + var(--fb-h) / 2 - 6px);width:calc(var(--fb-w) * var(--fb-floor));height:44px;translate:-50% 0;border-radius:50%;background:radial-gradient(closest-side,rgba(7,21,64,.3),rgba(7,21,64,.1) 60%,transparent);filter:blur(8px);transition:width .9s cubic-bezier(.45,.05,.25,1)}
.fb-hint{position:absolute;left:50%;bottom:4px;display:inline-flex;align-items:center;gap:8px;translate:-50% 0;padding:8px 14px 8px 10px;border:1px solid #d5dfed;border-radius:999px;background:rgba(255,255,255,.9);box-shadow:0 12px 28px -18px rgba(7,21,64,.45);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#0f2d8f;pointer-events:none;transition:opacity .35s,translate .35s}
.fb-hint .icon{width:16px;height:16px}
.fb-wrap.fb-touched .fb-hint,.fb-wrap[data-state=open] .fb-hint,.fb-wrap[data-state=back] .fb-hint{opacity:0;translate:-50% 8px}
.fb-wrap:not(.fb-js) .fb-hint,.fb-wrap:not(.fb-js) .fb-controls,.fb-wrap:not(.fb-js) .fb-caption,.fb-wrap:not(.fb-js) .fb-tip{display:none}

/* Controls */
.fb-controls{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:22px}
.fb-btn{display:grid;place-items:center;width:48px;height:48px;padding:0;border:1px solid #c9d6ee;border-radius:50%;background:#fff;color:#0f2d8f;cursor:pointer;box-shadow:0 10px 24px -18px rgba(7,21,64,.5);transition:background-color .25s,color .25s,border-color .25s,transform .35s var(--ease),opacity .25s}
.fb-btn .icon{width:20px;height:20px;transition:transform .45s var(--ease)}
.fb-btn:not(.fb-next) .icon{transform:rotate(180deg)}
.fb-btn:hover:not(:disabled){background:#0f2d8f;border-color:#0f2d8f;color:#fff;transform:translateY(-2px)}
.fb-btn:focus-visible{outline:2px solid #1c44c6;outline-offset:3px}
.fb-btn:disabled{opacity:.4;cursor:default}
.fb-next.is-restart .icon{transform:rotate(-180deg)}
.fb-next.is-restart{background:var(--yellow);border-color:var(--yellow)}
.fb-dots{display:flex;align-items:center;gap:8px}
.fb-dots button{width:9px;height:9px;padding:0;border:0;border-radius:9px;background:#c7d3ea;cursor:pointer;transition:width .45s var(--ease),background-color .3s}
.fb-dots button:hover{background:#8fa6d6}
.fb-dots button[aria-current]{width:30px;background:linear-gradient(90deg,#1c44c6,#0752df)}
.fb-dots button:focus-visible{outline:2px solid #1c44c6;outline-offset:3px}
.fb-caption{display:flex;align-items:center;justify-content:center;gap:12px;margin:16px 0 0;font-size:15px;font-weight:600;color:#101933;text-align:center}
.fb-caption b{padding:4px 9px;border-radius:6px;background:#0f2d8f;font-size:11px;font-weight:700;letter-spacing:.1em;color:#fff;font-variant-numeric:tabular-nums}
.fb-tip{margin:8px 0 0;font-size:13px;color:#6a7b9c;text-align:center}

@media(prefers-reduced-motion:no-preference){
 .fb-wrap.fb-auto .fb-leaf{transition-duration:.5s}
 .fb-wrap.fb-auto .fb-leaf.is-turning .fb-shade{animation-duration:.5s}
 .fb-wrap.fb-auto .fb-book{transition-duration:.6s}
 .fb-wrap.fb-auto .fb-scene{transition-duration:.7s}
 .fb-wrap.fb-auto .fb-hint{opacity:0}
 @media(hover:hover){.fb-wrap[data-state=closed] .fb-stage:hover .fb-leaf:first-child{--peek:-14deg}}
 .fb-armed:not(.fb-in) .fb-stage{opacity:0;translate:0 50px}
 .fb-armed:not(.fb-in) .fb-scene{rotate:y 45deg}
 .fb-armed .fb-stage{transition:opacity .9s var(--ease),translate 1.1s cubic-bezier(.22,1,.36,1)}
 .fb-running .fb-float{animation:fb-float 6.5s ease-in-out infinite}
 .fb-running[data-state=closed] .fb-hint{animation:fb-hint 2.4s ease-in-out infinite}
 @keyframes fb-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
 @keyframes fb-hint{0%,100%{box-shadow:0 12px 28px -18px rgba(7,21,64,.45),0 0 0 0 rgba(28,68,198,.25)}50%{box-shadow:0 12px 28px -18px rgba(7,21,64,.45),0 0 0 8px rgba(28,68,198,0)}}
 @keyframes fb-shade{0%{opacity:0}50%{opacity:1}100%{opacity:0}}
}
@media(prefers-reduced-motion:reduce){.fb-leaf,.fb-book,.fb-scene,.fb-floor{transition:none}}
@media(max-width:720px){
 .fb-wrap{--fb-bx:7deg;--fb-by:18deg}
 .fb-wrap[data-state=open]{--fb-bx:9deg}
 .fb-wrap[data-state=back]{--fb-by:-18deg}
 .fb-head p{font-size:16px}
 .fb-stage{height:calc(var(--fb-h) * 1.18 + 40px)}
 .fb-book{top:calc(50% - 16px)}
 .fb-floor{top:calc(50% - 16px + var(--fb-h) / 2 - 6px)}
 .fb-hint{padding:6px 12px 6px 8px;font-size:11px}
 .fb-controls{gap:12px}
 .fb-btn{width:44px;height:44px}
 .fb-dots{gap:6px}.fb-dots button[aria-current]{width:22px}
 .fb-caption{flex-direction:column;gap:8px;font-size:14px}
}

/* ---------- Resources page: THE PACK, EXPLAINED ---------- */
.pfaq{position:relative;overflow:hidden;isolation:isolate;padding:clamp(80px,9vw,128px) 0;background:radial-gradient(ellipse 55% 60% at 18% 30%,#e7eeff 0,rgba(231,238,255,0) 70%),radial-gradient(ellipse 40% 50% at 92% 90%,rgba(255,207,8,.12) 0,rgba(255,207,8,0) 70%),linear-gradient(180deg,#f5f7fc 0,#eef2f9 100%)}
.pfaq-grid{position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:radial-gradient(rgba(15,45,143,.13) 1.2px,transparent 1.3px);background-size:26px 26px;-webkit-mask:radial-gradient(ellipse 50% 70% at 20% 40%,#000 0,transparent 72%);mask:radial-gradient(ellipse 50% 70% at 20% 40%,#000 0,transparent 72%)}
.pfaq-layout{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:clamp(48px,6vw,96px);align-items:start}
.pfaq-aside{position:sticky;top:110px}
.pfaq-head .eyebrow{letter-spacing:.22em;margin-bottom:24px}
.pfaq-head h2{margin:0;font:800 clamp(56px,5.6vw,88px)/.9 var(--display);color:#071331}
.pfaq-line{display:block;overflow:hidden;padding:0 .1em .12em 0;margin-bottom:-.08em}
.pfaq-line>span{position:relative;display:inline-block}
.pfaq-line em{color:#1a3fbf;background:linear-gradient(90deg,#0f2d8f,#1c52e0);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.pfaq-swoosh{position:absolute;left:2%;right:6%;bottom:-.02em;width:92%;height:.2em;color:var(--yellow);z-index:-1}
.pfaq-swoosh path{stroke-dasharray:1;stroke-dashoffset:0}
.pfaq-head p{max-width:390px;margin:22px 0 0;font-size:17px;line-height:1.6;color:#4a5d83}

/* Question cards */
.pfaq-list{position:relative;display:grid;gap:14px;padding-left:28px}
.pfaq-rail{position:absolute;left:6px;top:10px;bottom:10px;width:2px;border-radius:2px;background:#dce4f2}
.pfaq-rail i{position:absolute;left:-5px;top:0;width:12px;height:12px;border-radius:50%;background:var(--yellow);box-shadow:0 0 0 4px rgba(255,207,8,.28),0 0 0 1px #d9ad00 inset;transform:translateY(var(--pfaq-y,26px));transition:transform .6s cubic-bezier(.34,1.3,.64,1),opacity .3s}
.pfaq-item{--mx:50%;--my:50%;position:relative;border:1px solid #d9e2f0;border-radius:18px;background:rgba(255,255,255,.78);box-shadow:0 14px 30px -28px rgba(7,21,64,.45);transition:border-color .35s,box-shadow .45s var(--ease),transform .45s var(--ease),background-color .35s}
.pfaq-item::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(320px circle at var(--mx) var(--my),rgba(28,68,198,.08),transparent 60%);opacity:0;transition:opacity .3s}
.pfaq-item:hover{border-color:#bccbe6;transform:translateX(4px)}
.pfaq-item:hover::after{opacity:1}
.pfaq-item summary{position:relative;z-index:1;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:18px;padding:18px 20px;list-style:none;cursor:pointer;border-radius:18px}
.pfaq-item summary::-webkit-details-marker{display:none}
.pfaq-item summary:focus-visible{outline:2px solid #1c44c6;outline-offset:2px}
.pfaq-ic{display:grid;place-items:center;width:46px;height:46px;border-radius:13px;background:#eef2fb;color:#0f2d8f;transition:background-color .4s,color .4s,transform .6s cubic-bezier(.34,1.56,.64,1)}
.pfaq-ic .icon{width:21px;height:21px}
.pfaq-q{display:flex;flex-direction:column;gap:3px;min-width:0}
.pfaq-q small{font-size:10.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#7b8baa;transition:color .35s}
.pfaq-q>span{font-size:18px;line-height:1.35;font-weight:700;color:#101933;transition:color .3s}
.pfaq-item summary:hover .pfaq-q>span{color:#1249c5}
.pfaq-toggle{display:grid;place-items:center;width:38px;height:38px;border:1px solid #d5dfed;border-radius:50%;background:#fff;color:#0752df;transition:background-color .35s,border-color .35s,color .35s,transform .55s var(--ease)}
.pfaq-toggle .icon{width:17px;height:17px;stroke-width:2}
.pfaq-body>div>p{margin:0;padding:0 64px 24px 84px;font-size:15.5px;line-height:1.75;color:#4a5d83}

.pfaq-item[open]{border-color:#b9c9ea;background:#fff;box-shadow:0 30px 56px -34px rgba(15,45,143,.5)}
.pfaq-item[open] .pfaq-ic{background:linear-gradient(135deg,#0f2d8f,#1c52e0);color:#fff;transform:rotate(-8deg)}
.pfaq-item[open] .pfaq-q small{color:#1c44c6}
.pfaq-item[open] .pfaq-toggle{background:#0f2d8f;border-color:#0f2d8f;color:#fff;transform:rotate(135deg)}
.pfaq-js .pfaq-item:not(.is-open){border-color:#d9e2f0;background:rgba(255,255,255,.78);box-shadow:0 14px 30px -28px rgba(7,21,64,.45)}
.pfaq-js .pfaq-item:not(.is-open) .pfaq-ic{background:#eef2fb;color:#0f2d8f;transform:none}
.pfaq-js .pfaq-item:not(.is-open) .pfaq-q small{color:#7b8baa}
.pfaq-js .pfaq-item:not(.is-open) .pfaq-toggle{background:#fff;border-color:#d5dfed;color:#0752df;transform:none}
.pfaq-js .pfaq-item:not(.is-open):hover .pfaq-toggle{border-color:#0752df;transform:rotate(90deg)}
.pfaq-js .pfaq-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .55s var(--ease)}
.pfaq-js .pfaq-body>div{min-height:0;overflow:hidden}
.pfaq-js .pfaq-body p{opacity:0;transform:translateY(-10px);filter:blur(3px);transition:opacity .25s,transform .4s var(--ease),filter .25s}
.pfaq-js .pfaq-item.is-open .pfaq-body{grid-template-rows:1fr}
.pfaq-js .pfaq-item.is-open .pfaq-body p{opacity:1;transform:none;filter:none;transition:opacity .45s .14s,transform .6s .1s var(--ease),filter .45s .14s}

/* Foot link */
.pfaq-foot{display:flex;align-items:center;gap:16px;margin:18px 0 0 28px;padding:16px 20px;border:1px dashed #c6d3ea;border-radius:18px;background:linear-gradient(100deg,rgba(255,255,255,.55),rgba(234,240,255,.75));transition:border-color .3s,background-color .3s}
.pfaq-foot-ic{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--yellow);color:#08206b;flex-shrink:0}
.pfaq-foot-ic .icon{width:19px;height:19px}
.pfaq-foot>span:nth-child(2){display:flex;flex-direction:column;flex:1;min-width:0}
.pfaq-foot strong{font:800 21px/1.1 var(--display);letter-spacing:.01em;text-transform:uppercase;color:#071331}
.pfaq-foot small{font-size:14px;color:#5b6780}
.pfaq-foot>.icon{width:20px;height:20px;color:#0f2d8f;transition:transform .4s var(--ease)}
.pfaq-foot:hover{border-color:#0f2d8f;border-style:solid}
.pfaq-foot:hover>.icon{transform:translateX(5px)}

@media(prefers-reduced-motion:no-preference){
 .pfaq-armed .pfaq-head:not(.pfaq-in) :is(.eyebrow,p),.pfaq-armed .pfaq-main:not(.pfaq-in) :is(.pfaq-item,.pfaq-foot,.pfaq-rail){opacity:0}
 .pfaq-armed .pfaq-head:not(.pfaq-in) .pfaq-line>span{transform:translateY(110%)}
 .pfaq-armed .pfaq-head:not(.pfaq-in) .pfaq-swoosh path{stroke-dashoffset:1}
 .pfaq-head.pfaq-in .eyebrow{animation:pfaq-rise .8s var(--ease) backwards}
 .pfaq-head.pfaq-in .pfaq-line>span{animation:pfaq-line 1s cubic-bezier(.22,1,.36,1) backwards}
 .pfaq-head.pfaq-in .pfaq-line:nth-child(2)>span{animation-delay:.1s}
 .pfaq-head.pfaq-in .pfaq-swoosh path{transition:stroke-dashoffset .9s cubic-bezier(.65,0,.35,1) .7s}
 .pfaq-head.pfaq-in p{animation:pfaq-rise .9s var(--ease) .3s backwards}
 .pfaq-main.pfaq-in .pfaq-rail{animation:pfaq-rail .9s cubic-bezier(.22,1,.36,1) backwards;transform-origin:top}
 .pfaq-main.pfaq-in .pfaq-item{animation:pfaq-card .8s cubic-bezier(.22,1,.36,1) backwards;animation-delay:calc(var(--i)*80ms + .1s)}
 .pfaq-main.pfaq-in .pfaq-foot{animation:pfaq-rise .8s var(--ease) .5s backwards}
 .pfaq-nudge .pfaq-item.is-open .pfaq-ic{animation:pfaq-wiggle .6s cubic-bezier(.34,1.56,.64,1)}
 @keyframes pfaq-rise{from{opacity:0;transform:translateY(18px)}}
 @keyframes pfaq-line{from{transform:translateY(110%)}}
 @keyframes pfaq-pop{from{opacity:0;transform:scale(.9)}}
 @keyframes pfaq-rail{from{opacity:0;transform:scaleY(0)}}
 @keyframes pfaq-card{from{opacity:0;transform:translateY(24px);filter:blur(4px)}}
 @keyframes pfaq-ping{0%{opacity:.9;transform:scale(.6)}80%,100%{opacity:0;transform:scale(1.6)}}
 @keyframes pfaq-wiggle{0%{transform:rotate(0) scale(.9)}100%{transform:rotate(-8deg) scale(1)}}
}
@media(prefers-reduced-motion:reduce){.pfaq-item,.pfaq-item *,.pfaq-rail i{transition:none!important}}

@media(max-width:1100px){
 .pfaq-q>span{font-size:16.5px}
 .pfaq-body>div>p{padding:0 32px 22px 84px}
}
@media(max-width:900px){
 .pfaq-layout{grid-template-columns:1fr;gap:40px}
 .pfaq-aside{position:static}
}
@media(max-width:680px){
 .pfaq{padding:60px 0 70px}
 .pfaq-head h2{font-size:clamp(52px,15vw,66px)}
 .pfaq-head p{font-size:15.5px}
 .pfaq-list{padding-left:20px;gap:10px}
 .pfaq-rail{left:3px}
 .pfaq-item summary{gap:12px;padding:14px}
 .pfaq-ic{width:38px;height:38px;border-radius:11px}
 .pfaq-ic .icon{width:18px;height:18px}
 .pfaq-q>span{font-size:15.5px}
 .pfaq-toggle{width:32px;height:32px}
 .pfaq-body>div>p{padding:0 16px 18px;font-size:15px}
 .pfaq-foot{margin-left:20px;padding:14px 16px}
 .pfaq-foot strong{font-size:18px}
 .pfaq-foot small{font-size:13px}
}

/* ---------- About: experience timeline (components/experience.mjs, assets/experience-motion.js) ---------- */
.xp{--xp-bg:#050e30;--xp-card:#0a1a4c;--xp-text:#aab6d6;--xp-line:rgba(255,255,255,.09);--xp-glow:#3d6bff;position:relative;overflow:hidden;overflow:clip;isolation:isolate;background:var(--xp-bg);color:#fff}
.xp-bg{position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(900px 620px at 8% 0%,rgba(40,86,230,.34),transparent 62%),radial-gradient(760px 560px at 100% 100%,rgba(28,68,198,.3),transparent 64%),radial-gradient(420px 320px at 88% 12%,rgba(255,207,8,.07),transparent 70%)}
.xp-bg:after{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:64px 64px;-webkit-mask-image:radial-gradient(ellipse 70% 60% at 30% 30%,#000 10%,transparent 75%);mask-image:radial-gradient(ellipse 70% 60% at 30% 30%,#000 10%,transparent 75%)}
.xp-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(48px,7vw,110px);align-items:start}
.xp-intro{position:sticky;top:124px}
.xp-intro .eyebrow{color:#9fb6ff}
.xp h2{color:#fff;font-size:clamp(46px,5vw,76px);line-height:.92}
.xp h2>span,.xp h2>em{display:block}
.xp h2 em{color:var(--yellow)}
.xp-lead{max-width:470px;margin:26px 0 0;color:var(--xp-text);font-size:17px;line-height:1.7}
.xp-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin:40px 0 0;border-top:1px solid var(--xp-line)}
.xp-stats>div{display:flex;flex-direction:column-reverse;justify-content:flex-end;padding:22px 0 20px;border-bottom:1px solid var(--xp-line)}
.xp-stats>div:nth-child(odd){padding-right:20px;border-right:1px solid var(--xp-line)}
.xp-stats>div:nth-child(even){padding-left:28px}
.xp-stats dt{font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#8292bb}
.xp-stats dd{margin:0 0 4px;font:800 clamp(44px,4.2vw,60px)/1 var(--display);color:#fff;font-variant-numeric:tabular-nums}
.xp-stats dd i{font-style:normal;color:var(--yellow)}
.xp-profile{display:inline-flex;align-items:center;gap:8px;margin-top:28px;font-size:14px;font-weight:600;color:#dbe4ff;border-bottom:1px solid rgba(219,228,255,.3);padding-bottom:3px;transition:color .25s,border-color .25s}
.xp-profile .icon{width:16px;height:16px;transition:transform .3s var(--ease)}
.xp-profile:hover{color:var(--yellow);border-color:var(--yellow)}
.xp-profile:hover .icon{transform:translate(2px,-2px)}

.xp-track{--xp-node:60px;--xp-p:1;position:relative}
.xp-rail{position:absolute;left:calc(var(--xp-node)/2 - 1px);top:calc(var(--xp-node)/2);bottom:var(--xp-rail-end,120px);width:2px;border-radius:2px;background:rgba(255,255,255,.1)}
.xp-rail i{position:absolute;inset:0;border-radius:inherit;background:linear-gradient(180deg,#3d6bff,#7aa0ff 60%,var(--yellow));transform-origin:top;transform:scaleY(var(--xp-p));box-shadow:0 0 18px rgba(61,107,255,.7)}
.xp-rail b{position:absolute;left:50%;top:calc(var(--xp-p)*100%);width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:#fff;box-shadow:0 0 0 4px rgba(255,207,8,.35),0 0 24px 6px rgba(255,207,8,.55);opacity:0;transition:opacity .3s}
.xp-list{list-style:none;margin:0;padding:0;display:grid;gap:26px}
.xp-item{display:grid;grid-template-columns:var(--xp-node) minmax(0,1fr);gap:26px;align-items:start}
.xp-node{position:relative;z-index:1;display:grid;place-items:center;width:var(--xp-node);height:var(--xp-node);margin-top:22px;border-radius:18px;background:#fff;box-shadow:0 0 0 6px var(--xp-bg),0 14px 30px -10px rgba(0,0,0,.6);transition:filter .6s var(--ease),opacity .6s var(--ease),transform .6s var(--ease),box-shadow .6s var(--ease)}
.xp-node svg{width:30px;height:30px}
.xp-node:after{content:'';position:absolute;inset:-6px;border-radius:22px;border:2px solid var(--xp-ring,#3d6bff);opacity:0}
.xp-instagram .xp-node{--xp-ring:#e1306c;background:radial-gradient(circle at 30% 107%,#fdf497 0,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285aeb 90%)}
.xp-medium .xp-node{--xp-ring:#fff;background:#000;box-shadow:0 0 0 6px var(--xp-bg),inset 0 0 0 1px rgba(255,255,255,.22),0 14px 30px -10px rgba(0,0,0,.6)}
.xp-medium .xp-node svg{width:32px}
.xp-youtube .xp-node{--xp-ring:#ff3b3b}
.xp-now .xp-node{--xp-ring:var(--yellow);background:transparent;border-radius:50%;box-shadow:0 0 0 6px var(--xp-bg),0 0 0 7px rgba(255,207,8,.4),0 18px 40px -10px rgba(61,107,255,.8)}
.xp-now .xp-node:after{border-radius:50%}
.xp-now .xp-node img{width:100%;height:100%;border-radius:50%}

.xp-card{--mx:50%;--my:0%;position:relative;overflow:hidden;padding:26px 30px 28px;border-radius:var(--r-lg);background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.02));border:1px solid var(--xp-line);transition:transform .7s var(--ease),opacity .7s var(--ease),border-color .35s,background-color .35s}
.xp-card:before{content:'';position:absolute;inset:0;background:radial-gradient(420px circle at var(--mx) var(--my),rgba(91,132,255,.16),transparent 45%);opacity:0;transition:opacity .35s;pointer-events:none}
.xp-card:hover{border-color:rgba(143,172,255,.3)}
.xp-card:hover:before{opacity:1}
.xp-year{position:absolute;right:18px;top:-14px;font:800 124px/1 var(--display);color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.07);pointer-events:none;user-select:none;transition:-webkit-text-stroke-color .5s}
.xp-card:hover .xp-year{-webkit-text-stroke-color:rgba(255,255,255,.14)}
.xp-meta{position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:10px;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#8fa2d6}
.xp-span{padding:3px 9px;border-radius:99px;background:rgba(255,255,255,.07);letter-spacing:.04em;color:#c8d3f3}
.xp-card h3{position:relative;margin-top:12px;color:#fff;font-size:24px}
.xp-org{position:relative;margin:4px 0 0;font-size:14px;color:#8292bb}
.xp-text{position:relative;margin:14px 0 0;max-width:560px;color:var(--xp-text);font-size:15.5px;line-height:1.7}
.xp-tags{position:relative;display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 0;padding:0;list-style:none}
.xp-tags li{padding:5px 12px;border-radius:99px;border:1px solid rgba(255,255,255,.1);font-size:12.5px;font-weight:500;color:#c8d3f3}

.xp-now .xp-card{padding:32px 34px 30px;background:linear-gradient(160deg,#0f2466,#0a1a4c 55%,#081440) padding-box,linear-gradient(135deg,rgba(255,207,8,.85),rgba(61,107,255,.6) 45%,rgba(255,255,255,.08)) border-box;border:1px solid transparent;box-shadow:0 40px 90px -40px rgba(61,107,255,.75)}
.xp-now .xp-card h3{font-size:clamp(26px,2.4vw,32px)}
.xp-now .xp-year{-webkit-text-stroke-color:rgba(255,207,8,.16)}
.xp-live{display:inline-flex;align-items:center;gap:8px;padding:4px 11px 4px 9px;border-radius:99px;background:rgba(255,207,8,.12);color:var(--yellow);letter-spacing:.06em}
.xp-live i{position:relative;width:7px;height:7px;border-radius:50%;background:var(--yellow)}
.xp-live i:after{content:'';position:absolute;inset:0;border-radius:50%;background:var(--yellow);animation:xp-ping 1.8s cubic-bezier(0,0,.2,1) infinite}
.xp-foot{position:relative;display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px}
.xp-foot .xp-tags li{border-color:rgba(255,207,8,.25);color:#ffe98a}
.xp-link{display:inline-flex;align-items:center;gap:8px;min-height:42px;padding:0 18px;border-radius:99px;background:var(--yellow);color:var(--deep);font-size:14px;font-weight:700;transition:transform .3s var(--ease),box-shadow .3s}
.xp-link .icon{width:16px;height:16px;transition:transform .3s var(--ease)}
.xp-link:hover{transform:translateY(-2px);box-shadow:0 14px 28px -12px rgba(255,207,8,.7)}
.xp-link:hover .icon{transform:translate(2px,-2px)}
@keyframes xp-ping{75%,to{transform:scale(2.6);opacity:0}}
@keyframes xp-ring{0%{opacity:.9;transform:scale(1)}to{opacity:0;transform:scale(1.35)}}
@keyframes xp-rise{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}

/* Motion states: only applied once experience-motion.js arms the section, so content never depends on script. */
.xp-armed .xp-rail b{opacity:1}
.xp-armed .xp-item:not(.is-lit) .xp-node{filter:grayscale(1) brightness(.55);opacity:.55;transform:scale(.86)}
.xp-armed .xp-item.is-lit .xp-node:after{animation:xp-ring .9s var(--ease)}
.xp-armed .xp-item:not(.is-seen) .xp-card{opacity:.22;transform:translateX(18px)}
.xp-armed:not(.xp-in) :is(.xp-intro .eyebrow,.xp h2>*,.xp-lead,.xp-stats>div,.xp-profile){opacity:0}
.xp-in :is(.xp-intro .eyebrow,.xp h2>*,.xp-lead,.xp-stats>div,.xp-profile){animation:xp-rise .8s cubic-bezier(.22,1,.36,1) backwards}
.xp-in h2>:nth-child(1){animation-delay:.06s}.xp-in h2>:nth-child(2){animation-delay:.12s}.xp-in h2>:nth-child(3){animation-delay:.2s}
.xp-in .xp-lead{animation-delay:.3s}
.xp-in .xp-stats>div:nth-child(1){animation-delay:.38s}.xp-in .xp-stats>div:nth-child(2){animation-delay:.44s}.xp-in .xp-stats>div:nth-child(3){animation-delay:.5s}.xp-in .xp-stats>div:nth-child(4){animation-delay:.56s}
.xp-in .xp-profile{animation-delay:.64s}

@media(max-width:1020px){
 .xp-grid{grid-template-columns:1fr;gap:56px}
 .xp-intro{position:static}
 .xp-lead{max-width:640px}
 .xp-stats{grid-template-columns:repeat(4,minmax(0,1fr))}
 .xp-stats>div:nth-child(n){padding:20px 14px;border-right:1px solid var(--xp-line)}
 .xp-stats>div:first-child{padding-left:0}
 .xp-stats>div:last-child{border-right:0}
}
@media(max-width:640px){
 .xp-track{--xp-node:46px}
 .xp-item{gap:16px}
 .xp-node{margin-top:18px;border-radius:14px}
 .xp-node svg{width:24px;height:24px}
 .xp-card,.xp-now .xp-card{padding:22px 20px 22px}
 .xp-card h3{font-size:21px}
 .xp-now .xp-card h3{font-size:24px}
 .xp-year{font-size:88px;top:-8px;right:10px}
 .xp-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
 .xp-stats>div:nth-child(n){padding:18px 16px 16px 0}
 .xp-stats>div:nth-child(even){padding-left:18px;border-right:0}
 .xp-text{font-size:15px}
 .xp-link{width:100%;justify-content:center}
}
@media(prefers-reduced-motion:reduce){
 .xp-live i:after{animation:none}
 .xp-card,.xp-node,.xp-link,.xp-profile .icon{transition:none}
}

/* ---------- Long-form guide blocks (September 16, 2026 rewrite) ---------- */
.article-prose h3{font-family:var(--body);text-transform:none;font-size:21px;letter-spacing:-.02em;line-height:1.3;margin:34px 0 0;color:var(--ink)}
.article-prose h4{font-family:var(--body);text-transform:none;font-size:17px;letter-spacing:-.01em;margin:26px 0 0;color:var(--ink)}
.article-prose p a,.article-prose li a,.article-prose td a,.answer-box p a,.faq-list p a{color:var(--blue-2);font-weight:600;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.article-prose p a:hover,.article-prose li a:hover,.article-prose td a:hover{text-decoration-thickness:2px}
.article-prose ol.prose-list{list-style:decimal}
.article-prose .prose-list li::marker{color:var(--blue);font-weight:700}
.article-prose .data-table td,.article-prose .data-table th{font-size:14px}
.article-prose .data-table td b{font:600 14px var(--body);color:var(--ink);letter-spacing:0}
.callout{margin:26px 0;padding:22px 24px;border-radius:var(--r);background:#fff8d6;border:1px solid #f1dc7a}
.callout>strong{display:block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#7a5c00;margin-bottom:8px}
.callout p{margin:8px 0 0!important;font-size:15px!important;line-height:1.75!important}
.callout ul,.callout ol{margin:10px 0 0;padding-left:20px;font-size:15px;line-height:1.7;display:grid;gap:6px}
.callout.blue{background:#eef3ff;border-color:#c9d8fb}.callout.blue>strong{color:var(--blue)}
.example-box{margin:26px 0;border:1px solid var(--line);border-radius:var(--r);background:#fff;overflow:hidden}
.example-box>strong{display:block;padding:12px 20px;background:var(--soft);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--line)}
.example-box>div{padding:6px 20px 16px}
.example-box p{font-size:15px!important;line-height:1.75!important}
.article-prose blockquote{margin:26px 0;padding:4px 0 4px 22px;border-left:3px solid var(--yellow);font-size:18px;line-height:1.65;color:var(--ink);font-weight:500}
.source-list{margin:10px 0 16px;padding-left:20px;font-size:14px;line-height:1.6;display:grid;gap:8px}
.source-list a{color:var(--blue-2);font-weight:600;overflow-wrap:anywhere}
.source-list span{display:block;color:var(--muted);font-size:13px}
@media (max-width:760px){.article-prose h3{font-size:19px}.callout,.example-box>div{padding-left:16px;padding-right:16px}.article-prose blockquote{font-size:16px}}
.toc-fold>summary{list-style:none;pointer-events:none;display:block}
.toc-fold>summary::-webkit-details-marker{display:none}
.toc-fold>summary .eyebrow{font-size:10px;margin-bottom:18px}
.toc-count{display:none}
@media(max-width:1000px){
 .toc-fold{border:1px solid var(--line);border-radius:var(--r);background:#fff}
 .toc-fold>summary{pointer-events:auto;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px}
 .toc-fold>summary .eyebrow{margin:0}
 .toc-count{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--blue)}
 .toc-count:after{content:'';width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .2s}
 .toc-fold[open] .toc-count:after{transform:rotate(-135deg) translateY(-2px)}
 .toc-fold nav{padding:0 18px 18px}
}
@media(max-width:780px){.article-toc{padding-bottom:0!important;border-bottom:0!important}}

/* ---------- Article Q&A (open, no accordion) ---------- */
.qa-section .qa-intro{margin:10px 0 0;color:var(--muted);font-size:15px}
.qa-list{margin-top:26px;display:grid;gap:14px;counter-reset:qa}
.qa-item{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);gap:18px;padding:22px 24px 20px 20px;border:1px solid var(--line);border-radius:var(--r);background:#fff;box-shadow:0 14px 30px -28px rgba(7,21,64,.35);transition:border-color .25s,box-shadow .3s}
.qa-item::before{content:"";position:absolute;left:0;top:18px;bottom:18px;width:3px;border-radius:0 3px 3px 0;background:linear-gradient(180deg,var(--yellow),var(--blue-2))}
.qa-item:hover{border-color:#c9d6ee;box-shadow:0 20px 38px -30px rgba(7,21,64,.45)}
.qa-num{display:grid;place-items:center;width:38px;height:38px;border-radius:10px;background:var(--soft);font:700 14px/1 var(--display);letter-spacing:.04em;color:var(--blue)}
.article-prose .qa-q{margin:6px 0 0;font-size:18px;line-height:1.4;letter-spacing:-.015em;color:var(--ink)}
.article-prose .qa-a{margin:10px 0 0;font-size:15.5px;line-height:1.8;color:#3d4a66}
.qa-a a{color:var(--blue-2);font-weight:600;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
@media (max-width:760px){.qa-item{grid-template-columns:1fr;gap:10px;padding:18px 16px 16px 18px}.qa-num{width:32px;height:32px;font-size:12.5px}.article-prose .qa-q{margin-top:0;font-size:16.5px}.article-prose .qa-a{font-size:15px}}
@media print{.qa-item{box-shadow:none;break-inside:avoid}}

/* ---------- Reading type scale: articles + inner pages (September 17, 2026) ----------
   One scale for everything outside the homepage. Nothing readable goes below 14px;
   uppercase labels bottom out at 12px.
   label 12 · meta 14 · small 15 · body 18 · lead 21 · h4 19 · h3 23 · h2 34 */
:root{--fs-label:12px;--fs-meta:14px;--fs-small:15px;--fs-body:18px;--fs-lead:21px;--fs-h4:19px;--fs-h3:23px;--fs-h2:34px;--lh-body:1.75;--prose:#35415c}
@media(max-width:560px){:root{--fs-body:17px;--fs-lead:19px;--fs-h4:18px;--fs-h3:21px;--fs-h2:28px}}

/* labels: eyebrows, tags, meta caps */
body:not([data-page="home"]) main .eyebrow,
body:not([data-page="home"]) main .tag,
body:not([data-page="home"]) main .card-meta,
body:not([data-page="home"]) main .count-label,
body:not([data-page="home"]) .article-toc>.eyebrow,
body:not([data-page="home"]) .toc-book-label,
body:not([data-page="home"]) .cta-stats span,
body:not([data-page="home"]) .toc-fold>summary .eyebrow,
body:not([data-page="home"]) .answer-box .eyebrow,
body:not([data-page="home"]) .callout>strong,
body:not([data-page="home"]) .example-box>strong,
body:not([data-page="home"]) .data-table thead th,
body:not([data-page="home"]) .article-section-num,
body:not([data-page="home"]) .other-books h3,
body:not([data-page="home"]) .pfaq-q small,
body:not([data-page="home"]) .xp-meta,
body:not([data-page="home"]) .contact-rule h2,
body:not([data-page="home"]) .contact-author-role{font-size:var(--fs-label);letter-spacing:.12em;line-height:1.5}
body:not([data-page="home"]) main .tag{padding:6px 11px}

/* meta: breadcrumbs, bylines, captions, notes */
body:not([data-page="home"]) .breadcrumb,
body:not([data-page="home"]) .availability,
body:not([data-page="home"]) .article-byline>div span,
body:not([data-page="home"]) .data-table caption,
body:not([data-page="home"]) .data-table td small,
body:not([data-page="home"]) .toc-book-sub,
body:not([data-page="home"]) .source-list span,
body:not([data-page="home"]) .article-stats span,
body:not([data-page="home"]) main .small,
body:not([data-page="home"]) .contact-form label,
body:not([data-page="home"]) .form-note,
body:not([data-page="home"]) .filter-chip,
body:not([data-page="home"]) .reel-meta,
body:not([data-page="home"]) .reel-source,
body:not([data-page="home"]) .xp-tags li,
body:not([data-page="home"]) .xp-org,
body:not([data-page="home"]) .pack-text small,
body:not([data-page="home"]) #contact-result p{font-size:var(--fs-meta);line-height:1.55}

/* small body: UI copy, cards, tables, sidebars */
body:not([data-page="home"]) .article-byline>div,
body:not([data-page="home"]) .article-toc nav a,
body:not([data-page="home"]) .toc-count,
body:not([data-page="home"]) .article-prose .data-table td,
body:not([data-page="home"]) .article-prose .data-table th,
body:not([data-page="home"]) .data-table,
body:not([data-page="home"]) .article-card-body p,
body:not([data-page="home"]) main .text-link,
body:not([data-page="home"]) .source-list,
body:not([data-page="home"]) .article-author-box a,
body:not([data-page="home"]) .reel-desc,
body:not([data-page="home"]) .gx-facts,
body:not([data-page="home"]) .gx-more,
body:not([data-page="home"]) .gx-note,
body:not([data-page="home"]) .contact-topics p,
body:not([data-page="home"]) .contact-form>p,
body:not([data-page="home"]) .contact-form input,
body:not([data-page="home"]) .contact-form select,
body:not([data-page="home"]) .contact-form textarea,
body:not([data-page="home"]) .featured-article p{font-size:var(--fs-small);line-height:1.65}
body:not([data-page="home"]) .article-toc nav a{line-height:1.45}

/* body: long-form reading text */
body:not([data-page="home"]) .article-prose p,
body:not([data-page="home"]) .article-prose .prose-list,
body:not([data-page="home"]) .takeaways ul,
body:not([data-page="home"]) .callout p,
body:not([data-page="home"]) .callout ul,
body:not([data-page="home"]) .callout ol,
body:not([data-page="home"]) .example-box p,
body:not([data-page="home"]) .steps-list p,
body:not([data-page="home"]) .article-prose .qa-a,
body:not([data-page="home"]) .article-prose .faq-list p,
body:not([data-page="home"]) .article-prose .faq-list summary,
body:not([data-page="home"]) .qa-section .qa-intro,
body:not([data-page="home"]) .article-source p,
body:not([data-page="home"]) .article-author-box p,
body:not([data-page="home"]) .legal-body p,
body:not([data-page="home"]) .xp-text,
body:not([data-page="home"]) .empty-state p{font-size:var(--fs-body)!important;line-height:var(--lh-body)!important}
body:not([data-page="home"]) .article-prose p,
body:not([data-page="home"]) .article-prose .qa-a,
body:not([data-page="home"]) .legal-body p{color:var(--prose)}
body:not([data-page="home"]) .article-prose .prose-list,
body:not([data-page="home"]) .takeaways ul{gap:10px}
body:not([data-page="home"]) .article-prose p{margin:20px 0}
body:not([data-page="home"]) .callout p{margin:8px 0 0!important}
body:not([data-page="home"]) .table-intro{font-size:var(--fs-small)!important}
body:not([data-page="home"]) .answer-box p{font-size:19px!important;line-height:1.7!important}
body:not([data-page="home"]) .article-prose blockquote{font-size:20px;line-height:1.6}
body:not([data-page="home"]) .article-header .lead,
body:not([data-page="home"]) .page-hero .lead{font-size:var(--fs-lead);line-height:1.6}

/* headings */
body:not([data-page="home"]) .article-prose h2{font-size:var(--fs-h2);line-height:1.18}
body:not([data-page="home"]) .article-prose h3,
body:not([data-page="home"]) .takeaways h2{font-size:var(--fs-h3)!important;line-height:1.3}
body:not([data-page="home"]) .article-prose h4,
body:not([data-page="home"]) .steps-list strong,
body:not([data-page="home"]) .article-source h3,
body:not([data-page="home"]) .article-author-box h3,
body:not([data-page="home"]) .contact-topics h3{font-size:var(--fs-h4);line-height:1.35}
body:not([data-page="home"]) .article-prose .qa-q{font-size:20px;line-height:1.4}
body:not([data-page="home"]) .qa-num{font-size:15px}

/* about page: book series panel was scaling down to 8px */
body[data-page="about"] .series-intro .series-mission,
body[data-page="about"] .series-header p{font-size:12px!important;letter-spacing:.16em}
body[data-page="about"] .series-header h3{font-size:clamp(13px,.8vw,15px)!important}
body[data-page="about"] .series-book-title{font-size:clamp(12px,.7vw,14px)!important;letter-spacing:.12em}
body[data-page="about"] .series-book-marker{font-size:12px!important}
body[data-page="about"] .series-book-action{font-size:14px!important}
body[data-page="about"] .series-intro>p:not(.series-mission){font-size:clamp(17px,1vw,19px)!important;color:var(--muted)}

@media(max-width:560px){
 body:not([data-page="home"]) .article-prose p,
 body:not([data-page="home"]) .article-prose .qa-a{line-height:1.72!important}
 body:not([data-page="home"]) .answer-box p{font-size:18px!important}
 body:not([data-page="home"]) .article-prose .qa-q{font-size:18px}
 body[data-page="about"] .series-intro .series-mission,body[data-page="about"] .series-header p{white-space:normal}
}
body:not([data-page="home"]) .article-source p.small{font-size:var(--fs-meta)!important;line-height:1.6!important;color:var(--muted)}
body:not([data-page="home"]) #contact-result strong{font-size:var(--fs-small)}

/* ---------- Site chrome type pass: header, footer, charts (September 17, 2026) ----------
   Header and footer are shared by every page, so these apply site-wide.
   Same scale as above: label 12 · meta 14 · small 15. */

/* header: logo tagline was 8px (6.5px on phones) */
.brand-name{font-size:10px;letter-spacing:.07em;line-height:1.3}
.brand-name strong{font-size:29px;margin-top:1px}
.desktop-nav>a{font-size:15px}
.nav-buy,.nav-ctas .button.small{font-size:14px}
@media(max-width:1180px){.desktop-nav>a{font-size:14px}.brand-name strong{font-size:26px}}
@media(max-width:780px){.nav-ctas .button,.nav-ctas .button.small{font-size:13px}#mobile-nav>a{font-size:16px}}
@media(max-width:560px){.menu-toggle{flex-shrink:0}.brand-name{font-size:8px;letter-spacing:.04em}.brand-name strong{font-size:22px}.nav-ctas .button,.nav-ctas .button.small{font-size:12px;padding:8px 10px}}
@media(max-width:380px){.brand-name{font-size:7px;letter-spacing:.03em}.brand-name strong{font-size:19px}.nav-ctas .button,.nav-ctas .button.small{font-size:11px;padding:8px}}

/* footer: headings 11px, notes 13px, bottom bar 11 to 12px */
.footer h3{font-size:12px;letter-spacing:.14em}
.footer-brand p{font-size:16px}
.footer-brand .small{font-size:14px;line-height:1.6;color:#9eabd3}
.footer-top>div:not(:first-child)>a{font-size:15px;color:#b6c1e2}
.footer-bottom{font-size:14px;color:#9eabd3}
@media(max-width:560px){.footer-bottom{font-size:13px}}

/* salary charts inside articles: labels were 10 to 13px */
body:not([data-page="home"]) .sc-tab{font-size:14px}
body:not([data-page="home"]) .sc-legend,
body:not([data-page="home"]) .sc-toggle,
body:not([data-page="home"]) .sc-table caption,
body:not([data-page="home"]) .sc-tip{font-size:14px}
body:not([data-page="home"]) .sc-headline>span{font-size:15px}
body:not([data-page="home"]) .sc-headline strong{font-size:17px}
body:not([data-page="home"]) .sc-chapter,
body:not([data-page="home"]) .sc-table thead th{font-size:12px;letter-spacing:.12em}
body:not([data-page="home"]) .sc-grid>span>i,
body:not([data-page="home"]) .sc-avg>em{font-size:13px}
body:not([data-page="home"]) .sc-val{font-size:14px}
body:not([data-page="home"]) .sc-label strong{font-size:15px}
body:not([data-page="home"]) .sc-label small{font-size:13px}
body:not([data-page="home"]) .sc-table{font-size:15px}
body:not([data-page="home"]) .sc-notes{font-size:15px;line-height:1.6}
@media(max-width:780px){
 body:not([data-page="home"]) .sc-val{font-size:11px}
 body:not([data-page="home"]) .sc-label strong{font-size:12px}
 body:not([data-page="home"]) .sc-legend,body:not([data-page="home"]) .sc-grid>span>i,body:not([data-page="home"]) .sc-avg>em{font-size:12px}
}

/* phone leftovers on resources + contact */
@media(max-width:700px){
 body[data-page="resources"] .pack-pill{font-size:12px}
 body[data-page="resources"] .pfaq-foot small{font-size:14px}

}
@media(max-width:780px){
 body[data-page="contact"] .contact-quote p{font-size:15px}
 body[data-page="contact"] .contact-quote cite{font-size:14px}
}

/* ---------- Article share dock (September 17, 2026) ----------
   LinkedIn, X, WhatsApp, and copy link. Brand fill springs out from the centre on hover,
   a tooltip rises above, and copy morphs the link icon into a drawn check with a ring pulse. */
@property --share-ang{syntax:'<angle>';initial-value:0deg;inherits:false}
.article-byline{flex-wrap:wrap;row-gap:14px}
.share-dock{list-style:none;margin:0;padding:5px 5px 5px 16px;display:flex;align-items:center;gap:6px;border:1px solid transparent;border-radius:999px;
 background:linear-gradient(#fff,#fff) padding-box,conic-gradient(from var(--share-ang),var(--line) 0 58%,var(--blue-2) 74%,var(--yellow) 84%,var(--line) 96%) border-box;
 box-shadow:0 8px 24px -12px rgba(7,21,64,.18);animation:share-spin 7s linear infinite;animation-play-state:paused}
.share-dock:hover,.share-dock:focus-within{animation-play-state:running}
.share-dock li{display:block;margin:0;padding:0;animation:share-pop .65s cubic-bezier(.34,1.56,.64,1) both;animation-delay:calc(var(--i,0)*80ms + .2s)}
.share-dock li::before{content:none}
.share-label{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-right:4px;animation:share-fade .5s ease both}
.share-btn{--brand:var(--blue);--glow:rgba(15,45,143,.4);position:relative;isolation:isolate;width:40px;height:40px;padding:0;border:0;border-radius:50%;display:grid;place-items:center;
 color:var(--ink);background:var(--soft);cursor:pointer;text-decoration:none;-webkit-tap-highlight-color:transparent;
 transition:transform .4s cubic-bezier(.34,1.56,.64,1),color .25s ease,box-shadow .35s ease}
.share-linkedin{--brand:#0a66c2;--glow:rgba(10,102,194,.45)}
.share-x{--brand:#0f1419;--glow:rgba(15,20,25,.38)}
.share-whatsapp{--brand:#25d366;--glow:rgba(37,211,102,.5)}
.share-fill{position:absolute;inset:0;z-index:-1;border-radius:50%;background:var(--brand);transform:scale(0);transition:transform .45s cubic-bezier(.34,1.56,.64,1),background .3s}
.share-btn::after{content:'';position:absolute;inset:0;border-radius:50%;border:2px solid var(--brand);opacity:0;pointer-events:none}
.share-icon{grid-area:1/1;width:17px;height:17px;transition:transform .45s cubic-bezier(.34,1.56,.64,1),opacity .25s ease}
.share-check path{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset .35s ease}
.share-tip{position:absolute;bottom:calc(100% + 10px);left:50%;padding:5px 9px;border-radius:7px;background:var(--ink);color:#fff;font-size:11px;font-weight:600;line-height:1.2;white-space:nowrap;
 pointer-events:none;opacity:0;transform:translate(-50%,6px) scale(.92);transition:opacity .22s ease,transform .3s cubic-bezier(.34,1.56,.64,1)}
.share-tip::after{content:'';position:absolute;top:100%;left:50%;margin-left:-5px;border:5px solid transparent;border-top-color:var(--ink)}
@media (hover:hover){
 .share-btn:hover{transform:translateY(-4px);color:#fff;box-shadow:0 12px 22px -8px var(--glow)}
 .share-btn:hover .share-fill{transform:scale(1)}
 .share-btn:hover .share-icon:not(.share-check){transform:rotate(-10deg) scale(1.1)}
 .share-btn:hover .share-tip{opacity:1;transform:translate(-50%,0) scale(1)}
}
.share-btn:focus-visible{outline:2px solid var(--blue-2);outline-offset:3px;color:#fff}
.share-btn:focus-visible .share-fill{transform:scale(1)}
.share-btn:focus-visible .share-tip{opacity:1;transform:translate(-50%,0) scale(1)}
.share-btn:active{transform:scale(.9)}
.share-copy.copied{--brand:#16a34a;--glow:rgba(22,163,74,.45);color:#fff}
.share-copy.copied .share-fill{transform:scale(1)}
.share-copy.copied .share-link{opacity:0;transform:scale(.3) rotate(-90deg)}
.share-copy.copied .share-check path{stroke-dashoffset:0;transition-delay:.12s}
.share-copy.copied::after{animation:share-ring .7s ease-out}
.share-copy.copied .share-tip{opacity:1;transform:translate(-50%,0) scale(1)}
@keyframes share-pop{from{opacity:0;transform:translateY(10px) scale(.55)}to{opacity:1;transform:none}}
@keyframes share-fade{from{opacity:0;transform:translateX(-6px)}to{opacity:1;transform:none}}
@keyframes share-ring{from{opacity:.75;transform:scale(1)}to{opacity:0;transform:scale(1.75)}}
@keyframes share-spin{to{--share-ang:360deg}}
@media (max-width:640px){.share-btn{width:42px;height:42px}.share-dock{margin-left:56px}}
@media (max-width:420px){.share-dock{margin-left:0}}
@media (prefers-reduced-motion:reduce){.share-dock,.share-dock li,.share-label{animation:none}.share-btn,.share-fill,.share-icon,.share-tip,.share-check path{transition:none}.share-copy.copied::after{animation:none}}
@media print{.share-dock{display:none}}

/* ---------- Article next-step panel: beat the prose reading scale (September 20, 2026) ----------
   .article-cta lives inside .article-prose, so the `.article-prose p` colour rule was
   painting its supporting line dark slate on navy. These carry the higher specificity. */
body:not([data-page="home"]) .article-prose .article-cta p{font-size:17px!important;line-height:1.65!important;color:#c9d6ff!important;margin:14px 0 0}
body:not([data-page="home"]) .article-prose .cta-stats{font-size:inherit;margin:24px 0 0;gap:14px 30px}
body:not([data-page="home"]) .article-prose .cta-stats strong{font-size:36px;line-height:.88;color:var(--yellow)}
body:not([data-page="home"]) .article-prose .article-cta h2{font-family:var(--display);font-size:38px;line-height:.98;color:#fff}
@media(max-width:1000px){
 body:not([data-page="home"]) .article-prose .article-cta h2{font-size:31px}
 body:not([data-page="home"]) .article-prose .cta-stats strong{font-size:31px}
}
@media(max-width:560px){
 body:not([data-page="home"]) .article-prose .article-cta p{font-size:16px!important}
 .article-cta{padding:26px;grid-template-columns:1fr;grid-template-areas:"cover" "copy" "actions"}
 .article-cta-cover{justify-self:start;margin:0 0 24px}
 .article-cta-cover>img{width:104px}
 .cta-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 18px}.cta-stats strong{font-size:28px}
 .article-cta-actions{flex-direction:column;margin-top:26px;padding-top:22px}
 .article-cta-actions .button{flex:0 0 auto;width:100%}
}

/* ---------- Author box: name leads the block (September 20, 2026) ----------
   The reading scale pins the bio at 18px, so the name has to clear it. */
body:not([data-page="home"]) .article-author-box h3{font-size:23px!important;line-height:1.2;letter-spacing:-.015em;margin-top:1px}
body:not([data-page="home"]) .article-author-box p{margin:8px 0 0!important;color:var(--muted)}
body:not([data-page="home"]) .article-author-box a{font-size:15px}
@media(max-width:560px){
 body:not([data-page="home"]) .article-author-box h3{font-size:20px!important}
}

/* Cookie consent (only rendered when a GA4 ID is configured) */
.consent{position:fixed;z-index:90;left:16px;right:16px;bottom:16px;max-width:560px;margin-left:auto;display:flex;align-items:center;gap:16px;padding:16px 18px;background:var(--navy);color:#fff;border-radius:var(--r-lg);box-shadow:var(--shadow-lg);font-size:15px;line-height:1.5}
.consent p{flex:1;color:#dfe6fb}
.consent a{color:var(--yellow);text-decoration:underline}
.consent-actions{display:flex;gap:8px;flex-shrink:0}
.consent .button.outline{color:#fff;border-color:rgba(255,255,255,.4)}
.footer-consent{font-size:12px;color:#8a98c4;text-decoration:underline}
.footer-consent:hover{color:var(--yellow)}
@media (max-width:560px){.consent{flex-direction:column;align-items:stretch}.consent-actions .button{flex:1;justify-content:center}}