/* Self-assessment pages: index grid + chat quiz. Self-contained tokens. */
.sa{--t:#006d68;--t2:#0b8f88;--o:#ff5c35;--ink:#0a1e1c;--mut:#5a7875;--line:#d9ebe9;--bg:#f4fefd;font-family:Montserrat,'Montserrat-Medium',system-ui,sans-serif;color:var(--ink)}
.sa-wrap{max-width:1100px;margin:0 auto;padding:28px 18px 80px}
.sa-hero{text-align:center;padding:26px 0 18px}
.sa-hero h1{font-size:34px;line-height:1.15;margin:0 0 8px}
.sa-hero p{color:var(--mut);font-size:15px;max-width:640px;margin:0 auto}
.sa-kicker{display:inline-block;font-size:10.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#fff;background:linear-gradient(90deg,var(--t),var(--t2));padding:4px 11px;border-radius:999px;margin-bottom:10px}
.sa-cats{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin:16px 0 22px}
.sa-cat{border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:8px 15px;font-size:13px;font-weight:600;cursor:pointer;color:var(--ink)}
.sa-cat.on{background:var(--t);border-color:var(--t);color:#fff}
.sa-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.sa-tile{display:flex;flex-direction:column;gap:6px;border:1px solid var(--line);border-radius:18px;padding:16px 18px;background:#fff;text-decoration:none;color:inherit;transition:transform .15s,box-shadow .15s}
.sa-tile:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(0,60,55,.1)}
.sa-tile small{font-size:10.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--t)}
.sa-tile b{font-size:15.5px;line-height:1.25}
.sa-tile p{margin:0;font-size:12.5px;color:var(--mut);line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sa-tile .sa-meta{font-size:11.5px;color:var(--mut);margin-top:auto;padding-top:6px}
.sa-tile .sa-go{color:var(--o);font-weight:700;font-size:12.5px}

/* quiz */
.sa-quiz{max-width:760px;margin:0 auto}
.sa-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.sa-head h1{font-size:24px;margin:0;line-height:1.2}
.sa-step{font-size:12px;font-weight:700;color:var(--mut);white-space:nowrap}
.sa-bar{height:8px;border-radius:4px;background:#e3f1ef;overflow:hidden;margin-bottom:14px}
.sa-bar-fill{height:100%;width:0;border-radius:4px;background:linear-gradient(90deg,var(--t),var(--o));transition:width .35s}
.sa-log{display:flex;flex-direction:column;gap:12px;padding:18px;border:1px solid var(--line);border-radius:22px;background:#fff;min-height:380px}
.sa-msg{display:flex;gap:10px;align-items:flex-end;animation:saIn .25s}
@keyframes saIn{from{opacity:0;transform:translateY(8px)}}
.sa-msg.me{justify-content:flex-end}
.sa-av{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,var(--t),var(--t2));color:#fff;display:flex;align-items:center;justify-content:center;font-size:15px;flex:0 0 auto}
.sa-bub{max-width:82%;padding:12px 15px;border-radius:18px 18px 18px 6px;background:var(--bg);font-size:14.5px;line-height:1.55}
.sa-msg.me .sa-bub{background:var(--t);color:#fff;border-radius:18px 18px 6px 18px}
.sa-msg.wide .sa-bub{max-width:100%;width:100%}
.sa-q{display:block}.sa-q small{display:block;font-size:10.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--t);margin-bottom:4px}
.sa-opts{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.sa-opt{border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:9px 14px;font:inherit;font-size:13px;font-weight:600;cursor:pointer;color:var(--ink);transition:all .12s}
.sa-opt:hover:not(:disabled){border-color:var(--t);transform:translateY(-1px)}
.sa-opt.on{background:var(--t);border-color:var(--t);color:#fff}
.sa-opt:disabled:not(.on){opacity:.45}
.sa-opt.start{background:var(--o);border-color:var(--o);color:#fff;padding:11px 20px;font-size:14px}
.sa-dots{display:inline-flex;gap:4px;vertical-align:middle}.sa-dots i{width:7px;height:7px;border-radius:50%;background:var(--mut);animation:saDot 1s infinite}.sa-dots i:nth-child(2){animation-delay:.15s}.sa-dots i:nth-child(3){animation-delay:.3s}
@keyframes saDot{0%,80%,100%{opacity:.3}40%{opacity:1}}
.sa-muted{color:var(--mut);font-size:12px}
.sa-lead{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.sa-in{height:42px;border:1.5px solid var(--line);border-radius:11px;padding:0 12px;font:inherit;font-size:14px;width:100%;background:#fff}
.sa-in:focus{outline:0;border-color:var(--t);box-shadow:0 0 0 3px rgba(0,109,104,.14)}
.sa-tel{display:grid;grid-template-columns:86px 1fr;gap:6px}
.sa-tel select{height:42px;border:1.5px solid var(--line);border-radius:11px;padding:0 8px;font:inherit;background:#fff}
.sa-err{margin:0;color:#b3261e;font-size:12.5px}
.sa-lead-actions{display:flex;gap:8px;flex-wrap:wrap}
.sa-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:44px;padding:0 18px;border-radius:12px;border:1.5px solid var(--line);background:#fff;font:inherit;font-size:14px;font-weight:700;cursor:pointer;text-decoration:none;color:var(--ink)}
.sa-btn.primary{background:linear-gradient(90deg,var(--o),#ff7a52);border-color:transparent;color:#fff;box-shadow:0 8px 20px rgba(255,92,53,.3)}
.sa-btn.ghost:hover{border-color:var(--t)}
.sa-link{background:none;border:0;padding:0;color:var(--t);font:inherit;font-weight:700;text-decoration:underline;cursor:pointer}
.sa-result{display:grid;grid-template-columns:130px 1fr;gap:18px;align-items:start}
.sa-ring{position:relative;width:130px;height:130px}
.sa-ring svg{width:130px;height:130px}
.sa-ring .bg{fill:none;stroke:#e3f1ef;stroke-width:11}
.sa-ring .fg{fill:none;stroke-width:11;stroke-linecap:round;transform:rotate(-90deg);transform-origin:50% 50%;transition:stroke-dasharray .9s cubic-bezier(.2,.8,.2,1)}
.sa-ring.ok .fg{stroke:#0E734F}.sa-ring.mid .fg{stroke:#D9A03B}.sa-ring.high .fg{stroke:#B3261E}
.sa-ring-mid{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.sa-ring-mid b{font-size:28px;line-height:1}.sa-ring-mid small{font-size:11px;font-weight:700;color:var(--mut)}
.sa-result-txt small:first-child{display:block;font-size:10.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--t)}
.sa-result-txt h3{margin:4px 0 6px;font-size:20px;line-height:1.25}
.sa-result-txt p{margin:0 0 10px;font-size:14px;line-height:1.55}
.sa-crisis{padding:10px 12px;border-radius:12px;background:#fdeceb;border:1px solid #f3b9b4;font-size:13px;margin-bottom:10px}
.sa-crisis a{color:#b3261e}
.sa-cta{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0 8px}
.sa-experts{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.sa-ex{display:grid;grid-template-columns:48px 1fr auto;gap:12px;align-items:center;padding:10px 12px;border:1px solid var(--line);border-radius:14px;background:#fff;text-decoration:none;color:inherit;transition:border-color .15s,transform .12s}
.sa-ex:hover{border-color:var(--t);transform:translateY(-1px)}
.sa-ex img,.sa-ex-av{width:48px;height:48px;border-radius:14px;object-fit:cover;display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--t),var(--o));color:#fff;font-weight:800}
.sa-ex-body b{display:block;font-size:14px}.sa-ex-body small{display:block;font-size:12px;color:var(--mut)}
.sa-ex-next{color:#0E734F!important;font-weight:700}
.sa-ex-cta{text-align:right;font-size:12.5px;color:var(--mut)}.sa-ex-cta b{color:var(--o)}
.sa-ex-skel{height:70px;border-radius:14px;background:linear-gradient(90deg,#eef6f5 25%,#fff 50%,#eef6f5 75%);background-size:400% 100%;animation:saSh 1.4s infinite}
@keyframes saSh{0%{background-position:100% 0}100%{background-position:0 0}}
.sa-more{font-size:13px;font-weight:700;color:var(--t);text-decoration:none;margin-top:4px}
.sa-trust{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-top:14px;font-size:12px;color:var(--mut)}
@media(max-width:600px){.sa-hero h1{font-size:26px}.sa-bub{max-width:92%}.sa-result{grid-template-columns:1fr}.sa-ring{margin:0 auto}}

/* ---- v2: hero, blobs, icons, reveal, result, experts ---- */
.sa-crumb{font-size:12px;color:var(--mut);margin-bottom:8px}.sa-crumb a{color:var(--t);text-decoration:none}
.sa-hero{position:relative;overflow:hidden;border-radius:26px;padding:44px 28px 34px;background:linear-gradient(135deg,#f0fbfa,#fff 55%,#fff4f0);border:1px solid var(--line);margin-bottom:18px}
.sa-hero-d{text-align:left;padding:34px 30px}
.sa-blob{position:absolute;border-radius:50%;filter:blur(40px);opacity:.55;pointer-events:none;animation:saFloat 14s ease-in-out infinite}
.sa-blob.a{width:320px;height:320px;background:#b9ece8;right:-80px;top:-120px}
.sa-blob.b{width:260px;height:260px;background:#ffd4c7;left:-70px;bottom:-120px;animation-delay:-7s}
@keyframes saFloat{0%,100%{transform:translate(0,0)}50%{transform:translate(18px,-22px)}}
.sa-hero>*:not(.sa-blob){position:relative;z-index:1}
.sa-blob{position:absolute!important;z-index:0}
.sa-hero h1{font-size:38px}.sa-hero-d h1{font-size:32px;margin:6px 0 8px}
.sa-hero-d p{margin:0 0 14px;max-width:70ch}
.sa-stats{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin:22px 0 16px}
.sa-stats div{min-width:110px;padding:10px 14px;border-radius:14px;background:#fff;border:1px solid var(--line)}
.sa-stats b{display:block;font-size:22px;line-height:1.1}.sa-stats small{font-size:11px;color:var(--mut)}
.sa-search{display:flex;align-items:center;gap:8px;max-width:520px;margin:0 auto;height:50px;border-radius:999px;background:#fff;border:1.5px solid var(--line);padding:0 16px;box-shadow:0 8px 24px rgba(0,60,55,.08)}
.sa-search input{flex:1;border:0;outline:0;font:inherit;font-size:15px;background:transparent}
.sa-cat em{font-style:normal;font-size:11px;opacity:.7;margin-left:3px}
.sa-ico{width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,#e6f9f8,#fff4f0);display:inline-flex;align-items:center;justify-content:center;font-size:20px;flex:0 0 auto}
.sa-ico.big{width:64px;height:64px;font-size:32px;border-radius:18px;margin-bottom:10px;box-shadow:0 8px 20px rgba(0,60,55,.1)}
.sa-tile-top{display:flex;justify-content:space-between;align-items:center}
.sa-tile .sa-meta{display:flex;gap:10px;align-items:center}
.sa-tile:hover .sa-ico{transform:rotate(-6deg) scale(1.08)}
.sa-ico{transition:transform .2s}
.reveal{opacity:0;transform:translateY(14px);transition:opacity .5s ease,transform .5s ease;transition-delay:calc(var(--i,0)*40ms)}
.reveal.in{opacity:1;transform:none}
.sa-none{text-align:center;color:var(--mut);padding:20px}
.sa-chips{display:flex;gap:8px;flex-wrap:wrap}
.sa-chips span{font-size:12.5px;font-weight:600;padding:6px 12px;border-radius:999px;background:#fff;border:1px solid var(--line)}
.sa-head-l{display:flex;gap:10px;align-items:center}
.sa-head-l b{display:block;font-size:14px}.sa-head-l small{font-size:11.5px;color:var(--mut)}
.sa-av.lg{width:40px;height:40px;font-size:18px;box-shadow:0 0 0 0 rgba(0,109,104,.35);animation:saPulse 2.4s infinite}
@keyframes saPulse{0%{box-shadow:0 0 0 0 rgba(0,109,104,.35)}70%{box-shadow:0 0 0 12px rgba(0,109,104,0)}100%{box-shadow:0 0 0 0 rgba(0,109,104,0)}}
.sa-quiz{margin:0 auto 34px;padding:22px;border-radius:26px;background:linear-gradient(180deg,#f7fdfc,#fff);border:1px solid var(--line);box-shadow:0 20px 50px rgba(0,60,55,.08)}
.sa-log{border:0;background:transparent;padding:6px 0 0;min-height:320px}
.sa-opt{animation:saIn .35s both;animation-delay:var(--d,0ms)}
.sa-opt em{font-style:normal;margin-right:6px}
.sa-msg.result .sa-bub{background:linear-gradient(160deg,#f7fdfc,#fff);border:1px solid var(--line);box-shadow:0 12px 30px rgba(0,60,55,.08)}
.sa-confetti{position:absolute;left:0;right:0;top:0;height:0;pointer-events:none;z-index:5}
.sa-confetti i{position:absolute;top:-10px;width:8px;height:14px;border-radius:2px;animation:saDrop 2.2s ease-in forwards}
@keyframes saDrop{0%{transform:translateY(0) rotate(0);opacity:1}100%{transform:translateY(520px) rotate(540deg);opacity:0}}
.sa-quiz{position:relative}
.sa-ex{animation:saSlide .45s both;animation-delay:var(--d,0ms)}
@keyframes saSlide{from{opacity:0;transform:translateX(-14px)}}
.sa-ex-next i{display:inline-block;width:8px;height:8px;border-radius:50%;background:#0E734F;margin-right:5px;animation:saPulseDot 1.6s infinite}
@keyframes saPulseDot{0%,100%{box-shadow:0 0 0 0 rgba(14,115,79,.4)}50%{box-shadow:0 0 0 6px rgba(14,115,79,0)}}
.sa-ex-cta{display:flex;flex-direction:column;align-items:flex-end;gap:2px}
.sa-ex-cta b{display:inline-block;padding:8px 14px;border-radius:999px;background:var(--o);color:#fff!important;font-size:12.5px}
.sa-content{max-width:860px;margin:0 auto;display:flex;flex-direction:column;gap:22px}
.sa-content h2{font-size:22px;margin:0 0 8px;line-height:1.25}
.sa-content p{font-size:15px;line-height:1.65;color:var(--ink);margin:0 0 8px}
.sa-content section{padding:22px 24px;border-radius:20px;background:#fff;border:1px solid var(--line)}
.sa-sample-h{font-weight:700;margin-top:10px!important}
.sa-sample{margin:0;padding-left:20px;color:var(--mut);font-size:14px;line-height:1.6}
.sa-bands{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:10px}
.sa-band{padding:14px;border-radius:14px;border:1px solid var(--line);background:#fafefe}
.sa-band small{display:inline-block;font-size:10.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:3px 9px;border-radius:999px;margin-bottom:6px}
.sa-band.ok small{background:#e3f4ec;color:#0E734F}.sa-band.mid small{background:#fdf3e3;color:#8A5A12}.sa-band.high small{background:#fdeceb;color:#B3261E}
.sa-band b{display:block;font-size:14.5px;margin-bottom:4px}.sa-band p{font-size:13px!important;color:var(--mut)!important;margin:0!important}
.sa-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.sa-steps>div{padding:14px;border-radius:14px;background:var(--bg)}
.sa-steps span{display:inline-flex;width:28px;height:28px;border-radius:50%;background:var(--t);color:#fff;align-items:center;justify-content:center;font-weight:800;font-size:13px;margin-bottom:8px}
.sa-steps b{display:block;font-size:14.5px;margin-bottom:4px}.sa-steps p{font-size:13px!important;color:var(--mut)!important;margin:0!important}
.sa-how,.sa-faqs,.sa-cta{max-width:860px;margin:34px auto 0}
.sa-how h2,.sa-faqs h2,.sa-cta h2{font-size:24px;margin:0 0 12px;text-align:center}
.sa-faq{border:1px solid var(--line);border-radius:14px;background:#fff;padding:0 18px;margin-bottom:8px}
.sa-faq summary{cursor:pointer;padding:14px 0;font-weight:700;font-size:15px;list-style:none;display:flex;justify-content:space-between;align-items:center}
.sa-faq summary::after{content:"+";font-size:20px;color:var(--t);transition:transform .2s}
.sa-faq[open] summary::after{transform:rotate(45deg)}
.sa-faq p{margin:0 0 14px;font-size:14px;line-height:1.6;color:var(--mut)}
.sa-cta{text-align:center;padding:30px 24px;border-radius:24px;background:linear-gradient(135deg,var(--t),var(--t2));color:#fff}
.sa-cta h2,.sa-cta p{color:#fff}.sa-cta p{opacity:.92;max-width:60ch;margin:0 auto 14px;font-size:15px}
.sa-content .sa-cta{border:0}
.sa-rels{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}
.sa-rel{display:flex;gap:10px;align-items:center;padding:10px 12px;border-radius:14px;border:1px solid var(--line);background:#fff;text-decoration:none;color:inherit;transition:transform .15s,border-color .15s}
.sa-rel:hover{transform:translateY(-2px);border-color:var(--t)}
.sa-rel b{display:block;font-size:13.5px}.sa-rel small{font-size:11.5px;color:var(--mut)}
@media(max-width:700px){.sa-hero{padding:30px 18px}.sa-hero h1{font-size:28px}.sa-bands,.sa-steps{grid-template-columns:1fr}.sa-content section{padding:18px}.sa-ex-cta b{padding:6px 10px}}

/* ---- v3: popular strip, social proof, share, extra ---- */
.sa-popular{margin:0 0 18px}
.sa-popular-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:10px}
.sa-popular-head h2{font-size:18px;margin:0}.sa-popular-head small{color:var(--mut);font-size:12px}
.sa-pops{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}
.sa-pop{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;padding:14px 10px;border-radius:16px;background:#fff;border:1px solid var(--line);text-decoration:none;color:inherit;transition:transform .15s,box-shadow .15s;animation:saIn .5s both;animation-delay:calc(var(--i,0)*70ms)}
.sa-pop:hover{transform:translateY(-3px);box-shadow:0 12px 26px rgba(0,60,55,.1)}
.sa-pop b{font-size:12.5px;line-height:1.25}.sa-pop small{font-size:10.5px;color:var(--mut)}
.sa-proof{display:inline-block;font-size:11px;font-weight:700;color:#8A5A12;background:#fdf3e3;padding:3px 9px;border-radius:999px;margin-top:4px;align-self:flex-start}
.sa-chips span.hot{background:#fdf3e3;color:#8A5A12;border-color:#f3dcb0}
.sa-share{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.sa-share button,.sa-share a{border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:7px 12px;font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;text-decoration:none;color:var(--ink)}
.sa-share button:hover,.sa-share a:hover{border-color:var(--t)}
.sa-extra{line-height:1.65}
@media(max-width:900px){.sa-pops{grid-template-columns:repeat(3,1fr)}}
@media(max-width:520px){.sa-pops{grid-template-columns:repeat(2,1fr)}}

/* ======================= v4: professional polish (CSS only) ======================= */
.sa h1,.sa h2,.sa h3,.sa h4,.sa h5,.sa h6{font-family:'Merriweather',serif!important;color:var(--t1,var(--ink));text-transform:capitalize;letter-spacing:-.01em}
.sa h1{font-weight:700;line-height:1.15}.sa h2{font-weight:700;line-height:1.25}.sa h3{font-weight:700}
.sa p{line-height:1.7}
.sa-wrap{padding:28px 20px 96px}
.sa-crumb{margin-bottom:12px}.sa-crumb a{transition:color .2s ease}.sa-crumb a:hover{color:var(--t2);text-decoration:underline;cursor:pointer}

/* hero */
.sa-hero{padding:40px 32px 32px;box-shadow:0 1px 2px rgba(10,30,28,.04),0 12px 32px -18px rgba(0,109,104,.25)}
.sa-hero-d{padding:36px 36px 30px}
.sa-hero h1{margin:8px 0 10px}
.sa-hero p{color:var(--mut);font-size:16px}
.sa-chips{margin-top:16px}
.sa-chips span{transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;box-shadow:0 1px 2px rgba(10,30,28,.05)}
.sa-chips span:hover{transform:translateY(-2px);border-color:var(--t);box-shadow:0 6px 14px -6px rgba(0,109,104,.35)}
.sa-ico.big{box-shadow:0 10px 24px -10px rgba(0,109,104,.35);border:1px solid var(--line)}
.sa-kicker{letter-spacing:.1em}

/* stats + search */
.sa-stats div{transition:transform .2s ease,box-shadow .2s ease;box-shadow:0 1px 2px rgba(10,30,28,.04)}
.sa-stats div:hover{transform:translateY(-2px);box-shadow:0 10px 24px -12px rgba(0,109,104,.35)}
.sa-search{transition:box-shadow .2s ease,border-color .2s ease}
.sa-search:focus-within{border-color:var(--t);box-shadow:0 0 0 4px rgba(0,109,104,.12),0 8px 24px rgba(0,60,55,.08)}

/* category pills */
.sa-cats{gap:8px;margin:20px 0 22px}
.sa-cat{transition:background-color .2s ease,border-color .2s ease,color .2s ease,transform .2s ease,box-shadow .2s ease;cursor:pointer}
.sa-cat:hover{border-color:var(--t);transform:translateY(-1px);box-shadow:0 6px 14px -8px rgba(0,109,104,.4)}
.sa-cat:focus-visible,.sa-tile:focus-visible,.sa-opt:focus-visible,.sa-btn:focus-visible,.sa-ex:focus-visible,.sa-rel:focus-visible,.sa-pop:focus-visible,.sa-link:focus-visible,.sa-faq summary:focus-visible{outline:0;box-shadow:0 0 0 3px #fff,0 0 0 6px rgba(0,109,104,.45)}
.sa-cat:active{transform:translateY(0)}

/* tiles / cards */
.sa-tile{padding:18px 20px;box-shadow:0 1px 2px rgba(10,30,28,.04);transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.sa-tile:hover{transform:translateY(-3px);border-color:var(--t);box-shadow:0 16px 32px -14px rgba(0,109,104,.28)}
.sa-tile b{font-family:'Merriweather',serif;font-weight:700;font-size:15px;line-height:1.35;color:var(--t1,var(--ink))}
.sa-tile p{line-height:1.5}
.sa-tile .sa-go{transition:transform .2s ease;display:inline-block}
.sa-tile:hover .sa-go{transform:translateX(3px)}
.sa-pop,.sa-rel{transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.sa-pop:hover,.sa-rel:hover{border-color:var(--t);box-shadow:0 14px 28px -14px rgba(0,109,104,.3)}

/* quiz card */
.sa-quiz{padding:26px 26px 22px;box-shadow:0 1px 2px rgba(10,30,28,.04),0 24px 56px -28px rgba(0,60,55,.28)}
.sa-head{margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.sa-head h1{font-size:22px}
.sa-bar{height:10px;background:#e3f1ef}
.sa-bar-fill{box-shadow:0 0 0 1px rgba(255,255,255,.6) inset}
.sa-log{gap:14px;padding-top:10px}
.sa-bub{font-size:15px;line-height:1.6;box-shadow:0 1px 2px rgba(10,30,28,.04)}
.sa-msg.me .sa-bub{box-shadow:0 6px 14px -8px rgba(0,109,104,.5)}
.sa-q{font-size:16px;font-weight:600;line-height:1.5}
.sa-q small{margin-bottom:6px}
.sa-opts{gap:8px;margin-top:12px}
.sa-opt{padding:10px 16px;background:#fff;border-width:1.5px;transition:background-color .2s ease,border-color .2s ease,color .2s ease,transform .2s ease,box-shadow .2s ease;cursor:pointer}
.sa-opt:hover:not(:disabled){background:var(--bg);border-color:var(--t);transform:translateY(-1px);box-shadow:0 6px 14px -8px rgba(0,109,104,.45)}
.sa-opt:active:not(:disabled){transform:translateY(0)}
.sa-opt.on{background:var(--t);border-color:var(--t);color:#fff;box-shadow:0 6px 16px -8px rgba(0,109,104,.6)}
.sa-opt.start{box-shadow:0 10px 22px -8px rgba(255,92,53,.55)}
.sa-opt.start:hover:not(:disabled){background:var(--o);border-color:var(--o);color:#fff;transform:translateY(-2px);box-shadow:0 14px 26px -8px rgba(255,92,53,.6)}
.sa-in,.sa-tel select{transition:border-color .2s ease,box-shadow .2s ease}
.sa-lead{gap:10px}

/* buttons */
.sa-btn{transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease,background-color .2s ease;cursor:pointer}
.sa-btn:hover{transform:translateY(-2px)}
.sa-btn:active{transform:translateY(-1px)}
.sa-btn.primary:hover{box-shadow:0 14px 28px rgba(255,92,53,.38)}
.sa-btn.ghost{box-shadow:0 1px 2px rgba(10,30,28,.05)}
.sa-btn.ghost:hover{border-color:var(--t);box-shadow:0 8px 18px -8px rgba(0,109,104,.4)}
.sa-link{transition:color .2s ease}.sa-link:hover{color:var(--t2)}
.sa-share button,.sa-share a{transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;cursor:pointer}
.sa-share button:hover,.sa-share a:hover{transform:translateY(-1px);box-shadow:0 6px 14px -8px rgba(0,109,104,.4)}

/* result + experts */
.sa-result{gap:22px}
.sa-result-txt h3{font-size:22px}
.sa-ex{padding:12px 14px;box-shadow:0 1px 2px rgba(10,30,28,.04);transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.sa-ex:hover{transform:translateY(-2px);box-shadow:0 14px 28px -14px rgba(0,109,104,.3)}
.sa-ex-cta b{transition:transform .2s ease,box-shadow .2s ease}
.sa-ex:hover .sa-ex-cta b{transform:translateX(2px);box-shadow:0 8px 16px -8px rgba(255,92,53,.6)}

/* content sections */
.sa-content{gap:18px}
.sa-content section{padding:26px 28px;box-shadow:0 1px 2px rgba(10,30,28,.04);transition:box-shadow .2s ease,border-color .2s ease}
.sa-content section:hover{box-shadow:0 12px 28px -18px rgba(0,60,55,.22)}
.sa-content h2{margin-bottom:10px}
.sa-band{transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.sa-band:hover{transform:translateY(-2px);border-color:var(--t);box-shadow:0 12px 24px -14px rgba(0,109,104,.3)}
.sa-band b{font-family:'Merriweather',serif}
.sa-steps>div{transition:transform .2s ease,box-shadow .2s ease}
.sa-steps>div:hover{transform:translateY(-2px);box-shadow:0 12px 24px -16px rgba(0,109,104,.3)}
.sa-steps b{font-family:'Merriweather',serif;font-weight:700}

/* FAQ */
.sa-faq{transition:border-color .2s ease,background-color .2s ease,box-shadow .2s ease}
.sa-faq:hover{border-color:var(--t);background:var(--bg)}
.sa-faq[open]{border-color:var(--t);box-shadow:0 10px 24px -16px rgba(0,109,104,.3)}
.sa-faq summary{transition:color .2s ease}
.sa-faq summary:hover{color:var(--t)}

/* CTA band */
.sa-cta{box-shadow:0 20px 44px -20px rgba(0,109,104,.5)}
.sa-cta .sa-btn.primary{box-shadow:0 10px 24px rgba(0,0,0,.18)}

/* trust */
.sa-trust{gap:16px;margin-top:16px}
.sa-trust span{padding:6px 10px;border-radius:999px;background:#fff;border:1px solid var(--line);transition:border-color .2s ease}
.sa-trust span:hover{border-color:var(--t)}

/* responsive */
@media(max-width:1280px){.sa-wrap{max-width:1040px}}
@media(max-width:768px){.sa-hero{padding:28px 20px 24px}.sa-hero-d{padding:26px 20px 22px}.sa-hero h1{font-size:26px}.sa-quiz{padding:18px 16px 16px}.sa-content section{padding:20px 18px}.sa-grid{grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}.sa-stats div{min-width:0;flex:1 1 40%}}
@media(max-width:420px){.sa-wrap{padding:16px 12px 80px}.sa-hero h1{font-size:23px}.sa-stats{gap:8px}.sa-chips span{font-size:11.5px;padding:5px 10px}.sa-opt{padding:9px 12px;font-size:12.5px}.sa-bub{max-width:100%;font-size:14px}.sa-msg{gap:8px}.sa-av{width:28px;height:28px;font-size:13px}.sa-btn{height:42px;font-size:13.5px;padding:0 14px}.sa-cta{padding:22px 16px}.sa-share{gap:6px}.sa-ex{grid-template-columns:44px 1fr auto;gap:8px}.sa-ex-cta b{padding:6px 10px;font-size:11.5px}}
.sa-back{background:transparent;border-style:dashed;color:var(--mut)}
.sa-back:hover:not(:disabled){color:var(--ink)}
.sa-opt em{opacity:.9}
.sa-opt::after{content:attr(data-v);display:none}
@media(min-width:900px){.sa-opt[data-v]:not(.start):not(.sa-back)::before{content:counter(k);counter-increment:k;display:inline-flex;width:18px;height:18px;border-radius:6px;margin-right:6px;align-items:center;justify-content:center;font-size:10px;font-weight:800;background:rgba(0,109,104,.1);color:var(--t)}.sa-opts{counter-reset:k}.sa-opt.on::before{background:rgba(255,255,255,.25);color:#fff}}

/* ======================= v5: full-width, contrast, motion, responsive ======================= */
.sa-wrap{max-width:1280px;padding:24px 28px 96px}
.sa-quiz{max-width:960px}
.sa-content,.sa-how,.sa-faqs,.sa-cta{max-width:960px}
.sa-grid{grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:14px}
.sa-pops{gap:10px}

/* text on the teal CTA band and the teal chips must be white — the heading rule set it to ink */
.sa-cta h2,.sa-cta p,.sa-cta small{color:#fff!important}
.sa-cta{background:linear-gradient(120deg,var(--t) 0%,var(--t2) 60%,#0fa39b 100%);background-size:200% 200%;animation:saShift 12s ease infinite}
@keyframes saShift{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
.sa-cat.on,.sa-cat.on em{color:#fff}
.sa-kicker{color:#fff}
.sa-msg.me .sa-bub,.sa-opt.on{color:#fff!important}
.sa-hero-d .sa-kicker{color:#fff}

/* hero motion */
.sa-hero{background:linear-gradient(135deg,#eefbfa,#fff 50%,#fff3ee);background-size:200% 200%;animation:saShift 18s ease infinite}
.sa-ico.big{animation:saFloatIco 4.5s ease-in-out infinite}
@keyframes saFloatIco{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-6px) rotate(-3deg)}}
.sa-hero h1{animation:saIn .6s both}
.sa-hero p{animation:saIn .6s .1s both}
.sa-chips span{animation:saIn .5s both;animation-delay:calc(.15s + var(--i,0)*60ms)}
.sa-stats div:nth-child(1){--i:0}.sa-stats div:nth-child(2){--i:1}.sa-stats div:nth-child(3){--i:2}.sa-stats div:nth-child(4){--i:3}
.sa-stats div{animation:saIn .5s both;animation-delay:calc(.2s + var(--i,0)*80ms)}
.sa-chips span:nth-child(1){--i:0}.sa-chips span:nth-child(2){--i:1}.sa-chips span:nth-child(3){--i:2}.sa-chips span:nth-child(4){--i:3}.sa-chips span:nth-child(5){--i:4}.sa-chips span:nth-child(6){--i:5}

/* attention on the primary CTAs without being loud */
.sa-btn.primary,.sa-opt.start{position:relative;overflow:hidden}
.sa-btn.primary::after,.sa-opt.start::after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-20deg);animation:saShine 3.6s ease-in-out infinite}
@keyframes saShine{0%,60%{left:-60%}100%{left:140%}}
.sa-cta .sa-btn.primary{animation:saBreathe 2.8s ease-in-out infinite}
@keyframes saBreathe{0%,100%{box-shadow:0 10px 24px rgba(0,0,0,.18)}50%{box-shadow:0 14px 34px rgba(255,92,53,.45)}}

/* section rhythm + soft tinted backgrounds so the page is not one long white column */
.sa-content section:nth-of-type(even){background:linear-gradient(180deg,#fafefe,#fff)}
.sa-about{border-left:4px solid var(--t)}
.sa-scoring{background:linear-gradient(180deg,#f4fbfa,#fff)!important}
.sa-when{border-left:4px solid var(--o)}
.sa-related{background:linear-gradient(180deg,#fff7f4,#fff)!important}
.sa-popular{padding:18px 20px;border-radius:20px;background:linear-gradient(135deg,#f0fbfa,#fff);border:1px solid var(--line)}
.sa-how{padding:26px;border-radius:22px;background:linear-gradient(135deg,#f4fbfa,#fff6f2);border:1px solid var(--line)}

/* quiz readability */
.sa-log{min-height:360px}
.sa-bub{max-width:88%}
.sa-msg.wide .sa-bub{max-width:100%}
.sa-opts{gap:8px 8px}
.sa-opt{flex:1 1 auto;justify-content:center;display:inline-flex;align-items:center;min-height:44px}
.sa-opt.sa-back{flex:0 0 auto}
.sa-q{font-size:17px}

/* responsive — real breakpoints */
@media(max-width:1280px){.sa-wrap{max-width:1140px}}
@media(max-width:1024px){.sa-grid{grid-template-columns:repeat(2,1fr)}.sa-pops{grid-template-columns:repeat(3,1fr)}.sa-bands,.sa-steps{grid-template-columns:1fr 1fr}}
@media(max-width:768px){.sa-wrap{padding:16px 16px 84px}.sa-grid{grid-template-columns:1fr 1fr;gap:10px}.sa-bands,.sa-steps{grid-template-columns:1fr}.sa-hero{border-radius:20px}.sa-quiz{padding:16px 14px 14px;border-radius:20px}.sa-result{grid-template-columns:1fr}.sa-cats{overflow-x:auto;flex-wrap:nowrap;justify-content:flex-start;padding-bottom:6px;-webkit-overflow-scrolling:touch}.sa-cat{flex:0 0 auto}.sa-content section{padding:18px 16px}.sa-cta{padding:26px 18px}.sa-share{gap:6px}}
@media(max-width:520px){.sa-grid{grid-template-columns:1fr}.sa-pops{grid-template-columns:repeat(2,1fr)}.sa-opt{flex:1 1 46%;font-size:12.5px;padding:9px 10px}.sa-opt.sa-back{flex:1 1 100%}.sa-bub{max-width:100%}.sa-hero h1{font-size:24px}.sa-stats div{flex:1 1 44%}.sa-search{height:46px}.sa-ex{grid-template-columns:44px 1fr}.sa-ex-cta{grid-column:2;flex-direction:row;justify-content:space-between;align-items:center}.sa-head{flex-wrap:wrap}.sa-step{font-size:11px}}
@media(max-width:390px){.sa-wrap{padding:12px 12px 80px}.sa-hero{padding:22px 16px 20px}.sa-hero h1{font-size:22px}.sa-chips span{font-size:11px;padding:5px 9px}.sa-opt{flex:1 1 100%}.sa-btn{width:100%}.sa-cta .sa-btn{width:auto}}
@media(prefers-reduced-motion:reduce){.sa *{animation:none!important;transition:none!important}}

/* ======================= v6: fixes from review ======================= */
/* CTA band inside the article: the generic section background was painting it white */
.sa-content section.sa-cta,.sa-cta{background:linear-gradient(120deg,var(--t) 0%,var(--t2) 60%,#0fa39b 100%)!important;background-size:200% 200%!important;border:0!important;box-shadow:0 20px 44px -20px rgba(0,109,104,.5)!important;color:#fff}
.sa-content section.sa-cta:hover{box-shadow:0 20px 44px -20px rgba(0,109,104,.5)!important}
/* every section in the article spans the article; FAQ was narrower than its siblings */
.sa-content>section{max-width:none;margin-left:0;margin-right:0;width:100%}
.sa-content .sa-faqs h2{text-align:left}
.sa-faq summary{padding-right:34px;position:relative;gap:12px}
.sa-faq summary::after{position:absolute;right:0;top:50%;transform:translateY(-50%)}
.sa-faq[open] summary::after{transform:translateY(-50%) rotate(45deg)}
/* the start button is a button, not a full-width bar */
.sa-opt.start{flex:0 0 auto;min-width:200px}
.sa-opts:has(.start){justify-content:flex-start}
/* breadcrumb / hero clear of the sticky header */
.sa-wrap{padding-top:22px}
.sa-hero-d .sa-ico.big{margin-top:4px}
/* band cards: equal height, tidy */
.sa-bands{align-items:stretch}.sa-band{display:flex;flex-direction:column}
.sa-steps>div{min-height:100%}
/* related tiles keep two lines max */
.sa-rel b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* ======================================================================================
   v7 — CSS-only visual redesign. Same HTML, same JS, same palette (--t, --t2, --o, --ink,
   --mut, --line, --bg). Design system: radius 8 / 12 / 20, three shadow levels, 200ms ease.
   ====================================================================================== */
.sa{--r-s:8px;--r-m:12px;--r-l:20px;--sh-1:0 1px 2px rgba(10,30,28,.05);--sh-2:0 6px 18px -8px rgba(0,109,104,.22);--sh-3:0 24px 56px -28px rgba(0,60,55,.32);--ease:.2s ease;--t1:#0a1e1c;
  --tint-t:rgba(0,109,104,.06);--tint-t2:rgba(0,109,104,.12);--tint-o:rgba(255,92,53,.08);color:var(--ink);background:#fff}
.sa h1,.sa h2,.sa h3,.sa h4,.sa h5,.sa h6{font-family:'Merriweather',serif!important;color:var(--t1);text-transform:capitalize;letter-spacing:-.012em}
.sa-wrap{max-width:1180px;padding:20px 24px 96px}

/* ---------- breadcrumb ---------- */
.sa-crumb{font-size:12.5px;color:var(--mut);margin:0 0 14px;display:flex;gap:6px;align-items:center}
.sa-crumb a{color:var(--t);font-weight:600;text-decoration:none;transition:color var(--ease)}
.sa-crumb a:hover{color:var(--t2);text-decoration:underline}

/* ---------- hero: compact, hierarchical, calm ---------- */
.sa-hero{animation:none;background:linear-gradient(180deg,var(--tint-t),transparent 70%),#fff;border:1px solid var(--line);border-radius:var(--r-l);padding:34px 36px 30px;box-shadow:var(--sh-1);margin-bottom:22px}
.sa-hero-d{padding:30px 36px 28px}
.sa-blob{opacity:.28!important;filter:blur(56px)!important}
.sa-hero h1{font-size:34px;font-weight:700;line-height:1.18;margin:8px 0 10px;max-width:22ch}
.sa-hero-d h1{max-width:24ch}
.sa-hero p{font-size:16px;line-height:1.65;color:var(--mut);max-width:64ch;margin:0}
.sa-hero:not(.sa-hero-d) h1,.sa-hero:not(.sa-hero-d) p{margin-left:auto;margin-right:auto}
.sa-kicker{background:var(--t);color:#fff;font-size:10.5px;letter-spacing:.1em;padding:5px 12px;border-radius:999px;box-shadow:var(--sh-1)}
.sa-ico.big{width:56px;height:56px;font-size:28px;border-radius:16px;background:#fff;border:1px solid var(--line);box-shadow:var(--sh-2);animation:none;margin:0 0 12px}
.sa-chips{margin-top:18px;gap:8px}
.sa-chips span{background:#fff;border:1px solid var(--line);border-radius:999px;padding:7px 13px;font-size:12.5px;font-weight:600;color:var(--ink);box-shadow:var(--sh-1);animation:none;transition:border-color var(--ease),transform var(--ease),box-shadow var(--ease)}
.sa-chips span:hover{border-color:var(--t);transform:translateY(-2px);box-shadow:var(--sh-2)}
.sa-chips span.hot{background:var(--tint-o);color:#b93a15;border-color:rgba(255,92,53,.35)}
.sa-stats{margin:22px auto 18px;gap:10px}
.sa-stats div{animation:none;background:#fff;border:1px solid var(--line);border-radius:var(--r-m);padding:12px 18px;min-width:118px;box-shadow:var(--sh-1);transition:transform var(--ease),box-shadow var(--ease),border-color var(--ease)}
.sa-stats div:hover{transform:translateY(-2px);box-shadow:var(--sh-2);border-color:var(--t)}
.sa-stats b{font-size:24px;color:var(--t)}.sa-stats small{font-size:11px;letter-spacing:.02em}
.sa-search{height:52px;border-radius:999px;border:1.5px solid var(--line);box-shadow:var(--sh-2)}
.sa-search:focus-within{border-color:var(--t);box-shadow:0 0 0 4px var(--tint-t2),var(--sh-2)}

/* ---------- category chips + tiles ---------- */
.sa-cats{gap:8px;margin:18px 0 22px}
.sa-cat{border-radius:999px;padding:9px 16px;font-size:13px;font-weight:600;background:#fff;border:1.5px solid var(--line);box-shadow:var(--sh-1);transition:background-color var(--ease),border-color var(--ease),color var(--ease),transform var(--ease),box-shadow var(--ease)}
.sa-cat:hover{border-color:var(--t);color:var(--t);transform:translateY(-1px)}
.sa-cat.on{background:var(--t);border-color:var(--t);color:#fff;box-shadow:var(--sh-2)}
.sa-cat em{opacity:.7}
.sa-popular{background:linear-gradient(180deg,var(--tint-t),#fff);border:1px solid var(--line);border-radius:var(--r-l);padding:20px 22px;box-shadow:var(--sh-1)}
.sa-popular-head h2{font-size:18px}
.sa-pop{border-radius:var(--r-m);animation:none;box-shadow:var(--sh-1)}
.sa-pop:hover{transform:translateY(-3px);box-shadow:var(--sh-2);border-color:var(--t)}
.sa-grid{gap:14px}
.sa-tile{border-radius:var(--r-l);padding:20px 20px 18px;box-shadow:var(--sh-1);gap:8px}
.sa-tile:hover{transform:translateY(-3px);box-shadow:var(--sh-3);border-color:var(--t)}
.sa-tile-top small{font-size:10.5px;letter-spacing:.08em;background:var(--tint-t);color:var(--t);padding:4px 9px;border-radius:999px;text-transform:uppercase;font-weight:800}
.sa-tile b{font-size:16px;line-height:1.3}
.sa-tile p{font-size:13px;line-height:1.55;color:var(--mut)}
.sa-tile .sa-meta{border-top:1px solid var(--line);padding-top:10px;margin-top:6px;font-size:12px;color:var(--mut)}
.sa-tile .sa-go{color:var(--o);font-weight:700;margin-left:auto}
.sa-ico{width:42px;height:42px;border-radius:var(--r-m);background:var(--tint-t);border:1px solid rgba(0,109,104,.12);font-size:21px}

/* ---------- ASSESSMENT CARD — the product ---------- */
.sa-quiz{max-width:920px;margin:0 auto 28px;padding:28px 28px 22px;background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:var(--sh-3),var(--sh-1);position:relative}
.sa-quiz::before{content:"";position:absolute;inset:0 0 auto 0;height:5px;border-radius:24px 24px 0 0;background:linear-gradient(90deg,var(--t),var(--t2) 60%,var(--o))}
.sa-head{margin:6px 0 14px;padding-bottom:14px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px}
.sa-head h1{font-size:22px;margin:0}
.sa-head-l b{font-size:15px;color:var(--t1)}
.sa-head-l small{font-size:12px;color:var(--mut)}
.sa-av.lg{width:42px;height:42px;font-size:19px;border-radius:12px;box-shadow:var(--sh-2);animation:none}
.sa-step{font-size:12px;font-weight:700;color:var(--t);background:var(--tint-t);padding:6px 12px;border-radius:999px;white-space:nowrap}
.sa-bar{height:10px;border-radius:999px;background:var(--tint-t);margin:0 0 18px;overflow:hidden;box-shadow:inset 0 1px 2px rgba(0,0,0,.04)}
.sa-bar-fill{border-radius:999px;background:linear-gradient(90deg,var(--t),var(--t2));box-shadow:0 0 0 1px rgba(255,255,255,.5) inset;transition:width .4s cubic-bezier(.2,.8,.2,1)}
.sa-log{min-height:340px;gap:16px;padding:4px 0 0}
.sa-msg{gap:12px}
.sa-av{width:34px;height:34px;border-radius:10px;font-size:15px;box-shadow:var(--sh-1)}
.sa-bub{background:var(--bg);border:1px solid rgba(0,109,104,.1);border-radius:16px 16px 16px 6px;padding:14px 18px;font-size:15px;line-height:1.6;max-width:86%;box-shadow:var(--sh-1)}
.sa-msg.me .sa-bub{background:var(--t);border-color:var(--t);color:#fff!important;border-radius:16px 16px 6px 16px;box-shadow:var(--sh-2);font-weight:600}
.sa-msg.wide .sa-bub{max-width:100%;width:100%}
.sa-q{font-size:17.5px;font-weight:600;line-height:1.5;color:var(--t1);margin-bottom:4px}
.sa-q small{font-size:10.5px;font-weight:800;letter-spacing:.09em;color:var(--t);margin-bottom:8px}
.sa-opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;margin-top:14px}
.sa-opts:has(.start){display:flex}
.sa-opt{border-radius:var(--r-m);border:1.5px solid var(--line);background:#fff;padding:12px 14px;min-height:48px;font-size:13.5px;font-weight:600;color:var(--ink);box-shadow:var(--sh-1);justify-content:flex-start;animation:none;
  transition:transform var(--ease),box-shadow var(--ease),border-color var(--ease),background-color var(--ease),color var(--ease)}
.sa-opt em{font-size:16px;margin-right:8px}
.sa-opt:hover:not(:disabled){transform:translateY(-2px);border-color:var(--t);background:var(--tint-t);box-shadow:var(--sh-2)}
.sa-opt:active:not(:disabled){transform:translateY(0)}
.sa-opt.on{background:var(--t);border-color:var(--t);color:#fff!important;box-shadow:0 8px 20px -8px rgba(0,109,104,.7),0 0 0 3px var(--tint-t2)}
.sa-opt.on::before{background:rgba(255,255,255,.22)!important;color:#fff!important}
.sa-opt:disabled:not(.on){opacity:.4;box-shadow:none}
.sa-opt.start{background:var(--o);border-color:var(--o);color:#fff;border-radius:var(--r-m);padding:13px 24px;font-size:15px;box-shadow:0 10px 22px -8px rgba(255,92,53,.6)}
.sa-opt.start:hover:not(:disabled){background:var(--o);transform:translateY(-2px);box-shadow:0 14px 28px -8px rgba(255,92,53,.65)}
.sa-opt.sa-back{background:transparent;border-style:dashed;color:var(--mut);box-shadow:none}
@media(min-width:900px){.sa-opt[data-v]:not(.start):not(.sa-back)::before{background:var(--tint-t2);color:var(--t);border-radius:6px;width:20px;height:20px}}
.sa-lead{gap:10px;margin-top:12px}
.sa-in,.sa-tel select{border-radius:var(--r-s);height:44px;border:1.5px solid var(--line);box-shadow:var(--sh-1)}
.sa-in:focus,.sa-tel select:focus{border-color:var(--t);box-shadow:0 0 0 4px var(--tint-t2)}
.sa-lead-actions{gap:8px;margin-top:2px}
.sa-trust{margin-top:16px;gap:10px}
.sa-trust span{border-radius:999px;background:#fff;border:1px solid var(--line);padding:6px 11px;font-size:12px}

/* ---------- buttons ---------- */
.sa-btn{border-radius:var(--r-m);height:46px;padding:0 20px;font-size:14px;font-weight:700;transition:transform var(--ease),box-shadow var(--ease),border-color var(--ease),background-color var(--ease),color var(--ease)}
.sa-btn.primary{background:var(--o);border-color:var(--o);color:#fff;box-shadow:0 8px 20px -6px rgba(255,92,53,.55)}
.sa-btn.primary::after{display:none}
.sa-btn.primary:hover{transform:translateY(-2px);box-shadow:0 14px 28px -8px rgba(255,92,53,.6)}
.sa-btn.primary:active{transform:translateY(0)}
.sa-btn.ghost{background:#fff;border:1.5px solid var(--line);color:var(--ink);box-shadow:var(--sh-1)}
.sa-btn.ghost:hover{border-color:var(--t);color:var(--t);transform:translateY(-2px);box-shadow:var(--sh-2)}
.sa-btn:focus-visible,.sa-opt:focus-visible,.sa-cat:focus-visible,.sa-tile:focus-visible,.sa-faq summary:focus-visible,.sa-link:focus-visible,.sa-ex:focus-visible,.sa-rel:focus-visible{outline:0;box-shadow:0 0 0 3px #fff,0 0 0 6px var(--t)}
.sa-link{color:var(--t);font-weight:700}

/* ---------- RESULT — the conclusion ---------- */
.sa-msg.result .sa-bub{background:linear-gradient(180deg,var(--tint-t),#fff 40%);border:1px solid rgba(0,109,104,.18);box-shadow:var(--sh-3);padding:22px 24px;border-radius:20px}
.sa-result{gap:24px;align-items:center}
.sa-ring{width:140px;height:140px}.sa-ring svg{width:140px;height:140px}
.sa-ring .bg{stroke:var(--tint-t2);stroke-width:12}.sa-ring .fg{stroke-width:12}
.sa-ring-mid b{font-size:32px;color:var(--t1)}.sa-ring-mid small{font-size:11px;letter-spacing:.06em;text-transform:uppercase}
.sa-result-txt small:first-child{font-size:10.5px;letter-spacing:.1em;color:var(--t)}
.sa-result-txt h3{font-size:24px;line-height:1.25;margin:6px 0 8px;text-transform:none}
.sa-result-txt p{font-size:15px;line-height:1.65;color:var(--ink)}
.sa-cta-inline,.sa-cta{gap:10px}
.sa-result .sa-cta{background:none!important;box-shadow:none!important;padding:0;border:0!important;margin:10px 0 10px;text-align:left;border-radius:0}
.sa-crisis{border-radius:var(--r-m)}
.sa-share{gap:8px;margin-top:6px}
.sa-share button,.sa-share a{border-radius:999px;border:1.5px solid var(--line);background:#fff;box-shadow:var(--sh-1);transition:transform var(--ease),border-color var(--ease),box-shadow var(--ease)}
.sa-share button:hover,.sa-share a:hover{border-color:var(--t);color:var(--t);transform:translateY(-1px)}
.sa-experts{gap:10px;margin-top:12px}
.sa-ex{border-radius:var(--r-m);padding:14px 16px;border:1px solid var(--line);box-shadow:var(--sh-1);animation:none}
.sa-ex:hover{transform:translateY(-2px);box-shadow:var(--sh-2);border-color:var(--t)}
.sa-ex img,.sa-ex-av{border-radius:var(--r-m)}
.sa-ex-body b{font-size:14.5px;color:var(--t1)}
.sa-ex-next{color:#0E734F!important}
.sa-ex-cta b{background:var(--o);border-radius:var(--r-s);padding:9px 14px;font-size:12.5px;box-shadow:0 6px 14px -6px rgba(255,92,53,.6)}
.sa-more{display:inline-block;margin-top:6px;color:var(--t)}

/* ---------- INFORMATION SECTIONS — structure without a wall of cards ---------- */
.sa-content{max-width:920px;gap:0}
.sa-content>section{background:transparent;border:0;border-radius:0;box-shadow:none!important;padding:34px 0;border-bottom:1px solid var(--line)}
.sa-content>section:first-child{padding-top:10px}
.sa-content>section:hover{box-shadow:none}
.sa-content h2{font-size:24px;line-height:1.25;margin:0 0 12px;text-transform:none}
.sa-content p{font-size:15.5px;line-height:1.75;color:var(--ink);max-width:70ch;margin:0 0 10px}
.sa-about,.sa-when{border-left:0;padding-left:0}
.sa-about{background:transparent!important}
.sa-sample-h{font-size:14px;color:var(--t);margin-top:14px!important}
.sa-sample{padding:0;margin:8px 0 0;list-style:none;display:flex;flex-direction:column;gap:6px;max-width:70ch}
.sa-sample li{padding:10px 14px;border-radius:var(--r-s);background:var(--bg);border:1px solid rgba(0,109,104,.1);font-size:14px;color:var(--ink);position:relative;padding-left:34px}
.sa-sample li::before{content:"“";position:absolute;left:12px;top:4px;font-family:'Merriweather',serif;font-size:22px;color:var(--t);line-height:1}
.sa-scoring{background:transparent!important}
.sa-bands{gap:12px;margin-top:16px}
.sa-band{border-radius:var(--r-l);padding:18px;background:#fff;border:1px solid var(--line);box-shadow:var(--sh-1);border-top:4px solid var(--line)}
.sa-band.ok{border-top-color:#0E734F}.sa-band.mid{border-top-color:#D9A03B}.sa-band.high{border-top-color:#B3261E}
.sa-band small{letter-spacing:.08em}
.sa-band b{font-size:15.5px;line-height:1.3;margin-bottom:6px}
.sa-band p{font-size:13.5px!important;line-height:1.55!important;color:var(--mut)!important}
.sa-band:hover{transform:translateY(-2px);box-shadow:var(--sh-2);border-color:var(--line)}
.sa-steps{gap:12px;margin-top:6px}
.sa-steps>div{border-radius:var(--r-l);background:var(--bg);border:1px solid rgba(0,109,104,.1);padding:18px}
.sa-steps span{width:30px;height:30px;font-size:13px;border-radius:10px;box-shadow:var(--sh-2)}
.sa-steps b{font-size:15px}
.sa-steps p{font-size:13.5px!important;line-height:1.55!important}
.sa-when{background:transparent!important}
.sa-related{background:transparent!important}
.sa-rels{gap:10px;margin-top:6px}
.sa-rel{border-radius:var(--r-m);padding:12px 14px;box-shadow:var(--sh-1)}
.sa-extra{background:transparent!important}
.sa-how{background:var(--bg);border:1px solid rgba(0,109,104,.1);border-radius:var(--r-l);padding:28px;box-shadow:var(--sh-1);margin-top:34px}
.sa-how h2{font-size:24px;text-transform:none;margin-bottom:14px}

/* ---------- FAQ ---------- */
.sa-faqs{padding-top:34px}
.sa-content .sa-faqs{padding:34px 0}
.sa-faqs h2{margin-bottom:14px}
.sa-faq{border-radius:var(--r-m);border:1px solid var(--line);background:#fff;padding:0 20px;margin-bottom:8px;box-shadow:var(--sh-1);transition:border-color var(--ease),box-shadow var(--ease),background-color var(--ease)}
.sa-faq:hover{border-color:var(--t);background:#fff;box-shadow:var(--sh-2)}
.sa-faq[open]{border-color:var(--t);background:var(--bg)}
.sa-faq summary{padding:16px 36px 16px 0;font-size:15.5px;font-weight:700;color:var(--t1);line-height:1.4}
.sa-faq summary::after{width:26px;height:26px;border-radius:50%;background:var(--tint-t);color:var(--t);display:inline-flex;align-items:center;justify-content:center;font-size:18px;line-height:1;transition:transform var(--ease),background-color var(--ease)}
.sa-faq[open] summary::after{background:var(--t);color:#fff}
.sa-faq p{font-size:14.5px;line-height:1.7;color:var(--ink);margin:0 0 16px;max-width:70ch}

/* ---------- CTA ---------- */
.sa-cta,.sa-content section.sa-cta{background:var(--t)!important;background-image:linear-gradient(135deg,var(--t),var(--t2))!important;animation:none!important;border-radius:var(--r-l)!important;padding:34px 28px!important;box-shadow:var(--sh-3)!important;border:0!important;text-align:center;margin-top:34px}
.sa-content section.sa-cta{border-bottom:0!important}
.sa-cta h2{font-size:24px;text-transform:none;margin-bottom:8px}
.sa-cta p{font-size:15.5px;max-width:58ch;opacity:.94}
.sa-cta .sa-btn.primary{animation:none;height:50px;padding:0 26px;font-size:15px;box-shadow:0 12px 26px rgba(0,0,0,.22)}
.sa-cta .sa-btn.primary:hover{box-shadow:0 16px 32px rgba(0,0,0,.28)}

/* ---------- index FAQ/CTA outside the article ---------- */
.sa-faqs h2,.sa-how h2{text-align:left}

/* ---------- desktop / mobile ---------- */
@media(min-width:1280px){.sa-wrap{max-width:1180px}.sa-quiz{padding:32px 32px 24px}}
@media(max-width:768px){.sa-wrap{padding:14px 14px 84px}.sa-hero,.sa-hero-d{padding:24px 18px 22px;border-radius:18px}.sa-hero h1{font-size:26px;max-width:none}.sa-hero p{font-size:15px}.sa-quiz{padding:18px 14px 14px;border-radius:18px}.sa-quiz::before{border-radius:18px 18px 0 0}.sa-bub{max-width:100%;padding:12px 14px;font-size:14.5px}.sa-q{font-size:16px}.sa-opts{grid-template-columns:1fr 1fr}.sa-opt{min-height:46px;padding:11px 12px;font-size:13px}.sa-content>section{padding:26px 0}.sa-content h2{font-size:21px}.sa-content p{font-size:15px}.sa-bands,.sa-steps{grid-template-columns:1fr}.sa-cta,.sa-content section.sa-cta{padding:26px 18px!important}.sa-faq summary{font-size:14.5px;padding:14px 32px 14px 0}}
@media(max-width:420px){.sa-wrap{padding:12px 12px 80px}.sa-hero h1{font-size:23px}.sa-stats div{min-width:0;flex:1 1 44%;padding:10px 12px}.sa-stats b{font-size:20px}.sa-search{height:46px}.sa-opts{grid-template-columns:1fr}.sa-opt{min-height:48px;font-size:13.5px}.sa-opt.start{width:100%;justify-content:center}.sa-lead-actions .sa-btn{width:100%}.sa-ring{width:120px;height:120px}.sa-ring svg{width:120px;height:120px}.sa-result-txt h3{font-size:20px}.sa-ex{grid-template-columns:44px 1fr}.sa-ex-cta{grid-column:2;flex-direction:row;justify-content:space-between}.sa-btn{height:44px;font-size:13.5px}.sa-cta .sa-btn.primary{width:100%}.sa-head{flex-wrap:wrap}.sa-step{font-size:11px}}

/* ======================= v8: split hero, feature strip, AI blocks ======================= */
.sa-hero-split{display:grid;grid-template-columns:1.1fr .9fr;gap:28px;align-items:center;text-align:left;padding:38px 40px 34px}
.sa-hero-split h1{margin-left:0;margin-right:0;max-width:16ch;font-size:40px}
.sa-hero-split p{margin-left:0;max-width:56ch}
.sa-hero-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}
.sa-proof-row{display:flex;align-items:center;gap:10px;margin-top:16px;font-size:12.5px;color:var(--mut)}
.sa-avatars{display:inline-flex}.sa-avatars i{width:28px;height:28px;border-radius:50%;border:2px solid #fff;margin-left:-8px;background:linear-gradient(135deg,var(--t),var(--t2));color:#fff;font-style:normal;font-size:11px;font-weight:800;display:inline-flex;align-items:center;justify-content:center}
.sa-avatars i:first-child{margin-left:0}.sa-avatars i:nth-child(2){background:linear-gradient(135deg,var(--o),#ff8a66)}.sa-avatars i:nth-child(4){background:linear-gradient(135deg,#7A5AA8,#a98ad9)}
.sa-hero-art{position:relative;min-height:300px}
.sa-orb{position:absolute;left:50%;top:50%;width:230px;height:230px;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle at 35% 35%,rgba(0,109,104,.18),rgba(0,109,104,.04) 60%,transparent 70%);border:1px dashed rgba(0,109,104,.3)}
.sa-mock{position:absolute;background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px 14px;box-shadow:var(--sh-3);width:200px;animation:saMock 7s ease-in-out infinite}
.sa-mock small{display:block;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--mut)}
.sa-mock b{display:block;font-family:'Merriweather',serif;font-size:15px;margin:3px 0 8px;color:var(--t1)}
.sa-mock i{display:block;height:6px;border-radius:3px;background:var(--tint-t2);position:relative;overflow:hidden}
.sa-mock i::after{content:"";position:absolute;left:0;top:0;bottom:0;width:var(--w);border-radius:3px;background:linear-gradient(90deg,var(--t),var(--o))}
.sa-mock em{display:block;font-style:italic;font-size:12px;line-height:1.5;color:var(--ink)}
.sa-mock.a{left:0;top:6%}.sa-mock.b{right:0;top:30%;animation-delay:-2.5s}.sa-mock.c{left:8%;bottom:0;width:250px;animation-delay:-5s}
@keyframes saMock{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.sa-feats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:0 0 22px}
.sa-feat{padding:18px;border-radius:var(--r-l);background:#fff;border:1px solid var(--line);box-shadow:var(--sh-1);transition:transform var(--ease),box-shadow var(--ease),border-color var(--ease)}
.sa-feat:hover{transform:translateY(-3px);box-shadow:var(--sh-2);border-color:var(--t)}
.sa-feat span{display:inline-flex;width:38px;height:38px;border-radius:12px;background:var(--tint-t);align-items:center;justify-content:center;font-size:18px;margin-bottom:10px;color:var(--t)}
.sa-feat b{display:block;font-family:'Merriweather',serif;font-size:14.5px;margin-bottom:4px;color:var(--t1)}
.sa-feat p{font-size:12.5px;line-height:1.5;color:var(--mut);margin:0}
.sa-ai-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:6px}
.sa-ai-grid>div{padding:16px 18px;border-radius:var(--r-l);background:var(--bg);border:1px solid rgba(0,109,104,.12)}
.sa-ai-grid b{display:block;font-family:'Merriweather',serif;font-size:15px;margin-bottom:6px;color:var(--t1)}
.sa-ai-grid p{font-size:14px!important;line-height:1.6!important;margin:0!important}
.sa-clin{margin-top:12px!important;padding:12px 14px;border-radius:var(--r-m);background:var(--tint-o);border:1px solid rgba(255,92,53,.25);font-size:14px!important}
.sa-airead{padding:4px 0}
.sa-ai-badge{display:inline-block;font-size:10.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:4px 10px;border-radius:999px;background:linear-gradient(90deg,var(--t),#7A5AA8);color:#fff;margin-bottom:8px}
.sa-airead-t{font-size:15px;line-height:1.65;color:var(--ink);margin:0 0 8px;min-height:24px}
.sa-airead-steps{margin:0 0 8px;padding-left:0;list-style:none;display:flex;flex-direction:column;gap:6px}
.sa-airead-steps li{padding:9px 12px 9px 34px;border-radius:var(--r-s);background:#fff;border:1px solid var(--line);font-size:13.5px;position:relative}
.sa-airead-steps li::before{content:"✓";position:absolute;left:12px;color:#0E734F;font-weight:800}
@media(max-width:1024px){.sa-feats{grid-template-columns:1fr 1fr}}
@media(max-width:860px){.sa-hero-split{grid-template-columns:1fr;padding:26px 20px}.sa-hero-split h1{font-size:30px;max-width:none}.sa-hero-art{min-height:240px;margin-top:6px}.sa-mock{width:170px}.sa-mock.c{width:210px}.sa-ai-grid{grid-template-columns:1fr}}
@media(max-width:520px){.sa-feats{grid-template-columns:1fr}.sa-hero-art{display:none}.sa-hero-actions .sa-btn{width:100%}}

/* ======================= v9: animated line icons ======================= */
.sa-ico{color:var(--t);background:linear-gradient(135deg,var(--tint-t),#fff);border:1px solid rgba(0,109,104,.14);overflow:visible}
.sa-ico svg{width:60%;height:60%;display:block;overflow:visible}
.sa-ico.big svg{width:62%;height:62%}
.sa-tile:hover .sa-ico,.sa-pop:hover .sa-ico,.sa-rel:hover .sa-ico{background:var(--t);color:#fff;border-color:var(--t)}
.sa-ico .draw{stroke-dasharray:140;stroke-dashoffset:140;animation:saDraw 2.4s ease-out forwards}
@keyframes saDraw{to{stroke-dashoffset:0}}
.sa-ico .pulse{transform-origin:50% 55%;animation:saBeat 1.8s ease-in-out infinite}
@keyframes saBeat{0%,100%{transform:scale(1)}30%{transform:scale(1.08)}45%{transform:scale(.98)}}
.sa-ico .breath{transform-origin:50% 50%;animation:saBreathe 3.6s ease-in-out infinite;opacity:.9}
.sa-ico .breath.b{animation-delay:-.6s;opacity:.6}.sa-ico .breath.c{animation-delay:-1.2s;opacity:.35}
@keyframes saBreathe{0%,100%{transform:scale(.92)}50%{transform:scale(1.06)}}
.sa-ico .flame{transform-origin:50% 90%;animation:saFlicker 1.4s ease-in-out infinite}
@keyframes saFlicker{0%,100%{transform:scaleY(1) skewX(0)}50%{transform:scaleY(1.06) skewX(-3deg)}}
.sa-ico .needle{transform-origin:24px 32px;animation:saNeedle 3s ease-in-out infinite}
.ico-compass .needle{transform-origin:24px 24px;animation:saSpin 8s linear infinite}
@keyframes saNeedle{0%,100%{transform:rotate(-25deg)}50%{transform:rotate(20deg)}}
@keyframes saSpin{to{transform:rotate(360deg)}}
.sa-ico .rays{transform-origin:24px 26px;animation:saSpin 14s linear infinite}
.sa-ico .ring{transform-origin:24px 24px;animation:saSpin 10s linear infinite}
.sa-ico .moon{transform-origin:50% 50%;animation:saRock 4s ease-in-out infinite}
.sa-ico .star{animation:saTwinkle 2s ease-in-out infinite}
@keyframes saRock{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(6deg)}}
@keyframes saTwinkle{0%,100%{opacity:.3}50%{opacity:1}}
.sa-ico .rocket{transform-origin:50% 50%;animation:saLift 2.2s ease-in-out infinite}
.sa-ico .fire{animation:saTwinkle 1s ease-in-out infinite}
@keyframes saLift{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
.sa-ico .tick{stroke-dasharray:30;stroke-dashoffset:30;animation:saDraw 1.6s .4s ease-out forwards}
.sa-ico .kid{transform-origin:50% 50%;animation:saBeat 2.6s ease-in-out infinite}
.sa-ico .dots{stroke-dasharray:1 5;animation:saTwinkle 1.6s ease-in-out infinite}
.sa-ico .door{transform-origin:24px 40px;animation:saDoor 4s ease-in-out infinite}
@keyframes saDoor{0%,60%,100%{transform:scaleX(1)}80%{transform:scaleX(.7)}}
.sa-ico .shine{stroke-width:3;opacity:.5;animation:saTwinkle 2.4s ease-in-out infinite}
.sa-ico .wave{animation:saDraw 2.4s ease-out forwards}
@media(prefers-reduced-motion:reduce){.sa-ico *{animation:none!important}.sa-ico .draw,.sa-ico .tick{stroke-dashoffset:0}}

/* ======================= v10: illustration, live strip, full-width, 3D ======================= */
.sa-wrap{max-width:1320px}
/* full-bleed hero band */
.sa-hero{position:relative}
.sa-hero::before{content:"";position:absolute;top:0;bottom:0;left:50%;width:100vw;transform:translateX(-50%);background:linear-gradient(180deg,#eefaf8,#f7fdfc 60%,transparent);z-index:-1;border-bottom:1px solid rgba(0,109,104,.08)}
.sa-hero{border:0;box-shadow:none;background:transparent!important;animation:none;border-radius:0;padding:40px 8px 34px}
.sa-hero-split{grid-template-columns:1.05fr .95fr;gap:36px}
.sa-hero-art{position:relative;min-height:380px;transform:translate(var(--px,0),var(--py,0));transition:transform .4s ease}
.sa-art{position:absolute;inset:0;width:100%;height:100%;max-height:420px;margin:auto;overflow:visible}
.sa-art .art-cloud-a{transform-origin:270px 90px;animation:artDrift 9s ease-in-out infinite}
.sa-art .art-cloud-b{transform-origin:420px 170px;animation:artDrift 11s ease-in-out infinite reverse}
@keyframes artDrift{0%,100%{transform:translate(0,0)}50%{transform:translate(10px,-8px)}}
.sa-art .art-sun{transform-origin:266px 90px;animation:saSpin 24s linear infinite}
.sa-art .art-scribble{stroke-dasharray:220;stroke-dashoffset:220;animation:artScribble 6s ease-in-out infinite}
@keyframes artScribble{0%{stroke-dashoffset:220}40%,70%{stroke-dashoffset:0}100%{stroke-dashoffset:220}}
.sa-art .art-person{transform-origin:262px 400px;animation:artBreath 5s ease-in-out infinite}
@keyframes artBreath{0%,100%{transform:scale(1)}50%{transform:scale(1.012)}}
.sa-art .art-eye{animation:artBlink 5.5s infinite}
@keyframes artBlink{0%,94%,100%{transform:scaleY(1)}97%{transform:scaleY(.1)}}
.sa-art .art-wave{animation:artWave 8s ease-in-out infinite}
@keyframes artWave{0%,100%{transform:translateX(0)}50%{transform:translateX(-14px)}}
.sa-art-warm .art-cloud-b path:first-child{fill:#ffd7c6}.sa-art-warm .art-wave path{fill:#ffe1d5}
.sa-hero-split .sa-mock{z-index:2}
.sa-hero-d .sa-hero-art{min-height:300px}
.sa-hero-cta{margin-top:18px;height:50px;padding:0 24px;font-size:15px}

/* live specialists strip */
.sa-live{margin:-8px 0 20px;padding:14px 0 12px;border-bottom:1px solid var(--line)}
.sa-live-head{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:10px;padding:0 8px}
.sa-live-head b{font-size:14px;color:var(--t1)}.sa-live-head small{color:var(--mut);font-size:12px}
.sa-live-dot{width:10px;height:10px;border-radius:50%;background:#0E734F;align-self:center;animation:aiDot 1.6s infinite}
@keyframes aiDot{0%,100%{box-shadow:0 0 0 0 rgba(14,115,79,.4)}50%{box-shadow:0 0 0 7px rgba(14,115,79,0)}}
.sa-marquee{overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.sa-marquee-track{display:flex;gap:10px;width:max-content;animation:saMarquee calc(var(--n,10)*4s) linear infinite}
.sa-marquee:hover .sa-marquee-track{animation-play-state:paused}
@keyframes saMarquee{to{transform:translateX(-50%)}}
.sa-live-card{display:flex;gap:10px;align-items:center;padding:8px 14px 8px 8px;border-radius:999px;background:#fff;border:1px solid var(--line);text-decoration:none;color:inherit;box-shadow:var(--sh1);transition:transform var(--ease),border-color var(--ease),box-shadow var(--ease);white-space:nowrap}
.sa-live-card:hover{transform:translateY(-2px);border-color:var(--t);box-shadow:var(--sh2)}
.sa-live-card img,.sa-live-av{width:36px;height:36px;border-radius:50%;object-fit:cover;display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--t),var(--o));color:#fff;font-size:12px;font-weight:800}
.sa-live-card b{display:block;font-size:12.5px;color:var(--t1)}.sa-live-card small{display:block;font-size:10.5px;color:var(--mut)}.sa-live-card em{display:block;font-style:normal;font-size:10.5px;color:#0E734F;font-weight:700}

/* 3D */
.t3d{transform-style:preserve-3d;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;will-change:transform;position:relative}
.t3d::after{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(circle at var(--gx,50%) var(--gy,50%),rgba(255,255,255,.35),transparent 60%);opacity:0;transition:opacity .25s;pointer-events:none}
.t3d:hover::after{opacity:1}
.sa-ico{transform-style:preserve-3d;perspective:400px}
.sa-tile:hover .sa-ico,.sa-pop:hover .sa-ico{animation:saCoin .9s ease}
@keyframes saCoin{0%{transform:rotateY(0)}100%{transform:rotateY(360deg)}}
.sa-ico.big{animation:saFloat3d 5s ease-in-out infinite}
@keyframes saFloat3d{0%,100%{transform:translateY(0) rotateX(0) rotateY(0)}50%{transform:translateY(-6px) rotateX(8deg) rotateY(-10deg)}}
.sa-band,.sa-feat{transform-style:preserve-3d}
.sa-quiz{transform-style:preserve-3d}
.sa-quiz::after{content:"";position:absolute;inset:auto 6% -14px 6%;height:28px;border-radius:50%;background:radial-gradient(ellipse at center,rgba(0,60,55,.18),transparent 70%);z-index:-1;filter:blur(6px)}

@media(max-width:860px){.sa-hero-art{min-height:260px}.sa-hero-d .sa-hero-art{display:none}.sa-hero{padding:26px 4px 24px}}
@media(max-width:520px){.sa-hero-art{display:none}.sa-live-card{padding:6px 12px 6px 6px}}
@media(prefers-reduced-motion:reduce){.sa-art *{animation:none!important}.sa-marquee-track{animation:none}}
/* Safety: if the script never runs (blocked, error), revealed content still appears after 1.5s. */
.reveal{animation:saRevealFallback 0s 1.5s forwards}
@keyframes saRevealFallback{to{opacity:1;transform:none}}

/* ======================= v12: list-page pattern from the approved mock ======================= */
/* Section heads: title left, subtitle right, baseline-aligned (mock .section-head). */
.sa-sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;margin:0 0 16px;padding:0 4px}
.sa-sec-head h2{font-size:28px;margin:0;text-transform:none}
.sa-sec-head p{font-size:13px;color:var(--mut);margin:0;text-align:right}
.sa-how .sa-sec-head h2,.sa-popular .sa-sec-head h2{font-size:26px}
.sa-faqs h2,.sa-cta h2{text-align:left}
.sa-cta h2{text-align:center}

/* Hero: AI-first headline, italic teal second line, trust chips (mock h1 span + .trust). */
.sa-hero-split h1 em{display:block;font-style:normal;color:var(--t);font-size:.86em;margin-top:4px}
.sa-trust.hero{margin-top:18px;gap:8px}
.sa-trust.hero span{font-size:11.5px;background:rgba(255,255,255,.72);border:1px solid var(--line);padding:8px 11px}

/* 01/02/03 path cards (mock .ai-path/.path/.num). */
.sa-how{background:transparent;border:0;box-shadow:none;padding:34px 0 8px;margin-top:8px}
.sa-path{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.sa-path-c{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:19px;padding:20px;box-shadow:var(--sh-1);transition:transform var(--ease),box-shadow var(--ease),border-color var(--ease)}
.sa-path-c:hover{transform:translateY(-5px);box-shadow:var(--sh-2);border-color:var(--t)}
.sa-num{flex:none;width:42px;height:42px;border-radius:13px;background:var(--tint-t);color:var(--t);display:grid;place-items:center;font-weight:900;font-size:14px;font-family:'Merriweather',serif}
.sa-path-c b{display:block;font-family:'Merriweather',serif;font-size:15px;margin-bottom:5px;color:var(--t1)}
.sa-path-c small{font-size:12.5px;color:var(--mut);line-height:1.55}

/* Tiles: category badge on the right, corner blob, deeper hover (mock .card). */
.sa-tile{min-height:250px;padding:20px;border-radius:21px;overflow:hidden;position:relative}
.sa-tile::after{content:"";position:absolute;width:110px;height:110px;border-radius:50%;right:-55px;top:-55px;background:linear-gradient(135deg,#e0faf6,#fff0e8);z-index:0}
.sa-tile>*{position:relative;z-index:1}
.sa-tile-top{align-items:flex-start}
.sa-badge{font-size:10px!important;font-weight:850;letter-spacing:.04em;color:var(--t);background:#edf8f6;border-radius:999px;padding:7px 10px;height:max-content}
.sa-tile h3,.sa-tile b{font-family:'Merriweather',serif;font-size:19px;margin:16px 0 8px;line-height:1.25}
.sa-tile p{font-size:13px;color:#71868e}
.sa-tile .sa-meta{margin-top:auto;border-top:1px solid #e3eeee;padding-top:14px}
.sa-tile:hover{transform:translateY(-8px) rotateX(1deg);box-shadow:0 25px 45px rgba(8,77,72,.14)}

/* Search row with a filter affordance (mock .search-row). */
.sa-search{box-shadow:var(--sh-2);margin-bottom:14px}
.sa-cats{margin-top:0}

.sa-disclaimer{text-align:center;color:#7b8f96;font-size:11.5px;margin:34px auto 0;max-width:860px;line-height:1.6}
@media(max-width:1050px){.sa-path{grid-template-columns:1fr}}
@media(max-width:650px){.sa-sec-head{display:block}.sa-sec-head p{text-align:left;margin-top:5px}.sa-sec-head h2{font-size:23px}.sa-tile{min-height:0}}

/* ======================= v13: approved page designs ======================= */
.sa-kicker.plain{background:none;color:var(--t);padding:0;font-size:11px;letter-spacing:.12em;box-shadow:none}
.sa-hero-v13{padding:34px 8px 30px}
.sa-hero-v13 h1{font-size:44px;max-width:14ch}
.sa-hero-v13 p{font-size:15px}
.sa-hero-v13 .sa-chips{margin-top:14px}
.sa-hero-v13 .sa-chips span{padding:6px 11px;font-size:12px}
.sa-hero-v13 .sa-hero-actions{margin-top:16px}
.sa-hero-v13 .sa-proof-row{margin-top:14px}
/* family illustration + handwritten caption + chip card */
.sa-fam{position:relative;width:100%;height:100%;min-height:330px}
.sa-art-fam{position:absolute;inset:0;width:100%;height:100%}
.sa-hand{position:absolute;left:0;top:6%;font-family:'Caveat','Segoe Script','Comic Sans MS',cursive;color:var(--t);font-size:26px;line-height:1.05;transform:rotate(-8deg);display:flex;flex-direction:column;gap:2px}
.sa-hand span:nth-child(2){padding-left:14px}.sa-hand span:nth-child(3){padding-left:28px;font-size:22px}
.sa-say-card{position:absolute;right:0;top:8%;background:#fff;border:1px solid var(--line);border-radius:16px;padding:12px 16px;box-shadow:var(--sh2);display:flex;flex-direction:column;gap:6px;animation:aiBob 6s ease-in-out infinite}
.sa-say-card b{font-size:12.5px;color:var(--t1)}
.sa-say-card::after{content:"";position:absolute;left:-7px;bottom:16px;width:12px;height:12px;background:#fff;border-left:1px solid var(--line);border-bottom:1px solid var(--line);transform:rotate(45deg)}
.sa-art-fam .art-person{animation:artBreath 5s ease-in-out infinite;transform-origin:center bottom}
.sa-art-fam .p2{animation-delay:-1.5s}.sa-art-fam .p3{animation-delay:-3s}
.sa-art-fam .art-heart{transform-origin:center;animation:saBeat 2.2s ease-in-out infinite}
.sa-art-fam .art-heart.d{animation-delay:-1.1s}
.sa-art-fam .art-leaves{animation:artWave 7s ease-in-out infinite}
/* index hero mocks as icon rows */
.sa-mock{display:flex;gap:10px;align-items:center;width:230px}
.sa-mock-ic{width:36px;height:36px;border-radius:10px;background:var(--tint-t);display:grid;place-items:center;font-size:18px;flex:none}
.sa-mock b{font-size:13px;margin:0 0 2px}.sa-mock small{text-transform:none;letter-spacing:0;font-weight:500;font-size:11px}
.sa-mock.a{left:0;top:2%}.sa-mock.b{right:0;top:32%}.sa-mock.c{left:6%;bottom:4%;width:240px}
.sa-mock i{display:none}
.sa-hero:not(.sa-hero-d) .sa-orb{display:none}

/* quiz + why panel */
.sa-quiz-row{display:grid;grid-template-columns:1fr 300px;gap:16px;align-items:start;margin:0 auto 26px;max-width:1240px}
.sa-quiz-row .sa-quiz{margin:0;max-width:none}
.sa-why{background:var(--bg);border:1px solid rgba(0,109,104,.12);border-radius:24px;padding:22px;position:sticky;top:96px}
.sa-why h3{font-size:20px;margin:0 0 12px;text-transform:none}
.sa-why ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.sa-why li{display:flex;gap:10px;align-items:center;font-size:13.5px;color:var(--ink)}
.sa-why li span{width:34px;height:34px;border-radius:10px;background:#fff;border:1px solid var(--line);display:grid;place-items:center;font-size:16px;flex:none}
.sa-why-hand{margin-top:18px;font-family:'Caveat','Segoe Script',cursive;font-size:24px;color:var(--t);line-height:1.05;text-align:right;transform:rotate(-4deg)}

/* content sections styled like the design */
.sa-content>section{padding:26px 28px;border:0;border-bottom:0;border-radius:22px;margin-bottom:16px}
.sa-two-col{display:grid;grid-template-columns:1.4fr 1fr;gap:20px;background:var(--bg)!important;border:1px solid rgba(0,109,104,.1)!important}
.sa-sample-box{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px 18px}
.sa-sample-box b{display:block;font-family:'Merriweather',serif;font-size:14px;margin-bottom:8px}
.sa-sample li{padding-left:30px;font-size:13px}.sa-sample li i{position:absolute;left:12px;top:6px;font-style:normal;font-family:'Merriweather',serif;font-size:20px;color:var(--t)}
.sa-ai{background:#fff!important;border:1px solid var(--line)!important}
.sa-ai-ic{display:inline-grid;place-items:center;width:42px;height:42px;border-radius:12px;background:var(--tint-t);font-size:20px;margin-bottom:8px}
.sa-band-peach{background:#fff3ee!important;border:1px solid #ffd9c9!important;display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:center}
.sa-band-mint{background:var(--bg)!important;border:1px solid rgba(0,109,104,.1)!important}
.sa-who-ic{width:54px;height:54px;border-radius:50%;background:#fff;display:grid;place-items:center;font-size:24px;border:1px solid #ffd9c9}
.sa-who-ic.heart{color:#ff5c35}
.sa-who-hand{font-family:'Caveat','Segoe Script',cursive;font-size:24px;color:var(--t);line-height:1.05;text-align:center;transform:rotate(-5deg)}
.sa-band-peach h2{margin-bottom:6px}
.sa-bands{grid-template-columns:repeat(3,1fr)}
.sa-band{position:relative;padding:18px 18px 18px 70px;border-top:1px solid var(--line)!important;border-radius:16px}
.sa-band.ok{background:#f0faf5;border-color:#bfe3d0!important}.sa-band.mid{background:#fff8ea;border-color:#f3dcb0!important}.sa-band.high{background:#fdf0ee;border-color:#f3b9b4!important}
.sa-bars{position:absolute;left:18px;top:20px;display:flex;gap:3px;align-items:flex-end;width:36px;height:34px}
.sa-bars i{flex:1;border-radius:2px 2px 0 0;background:currentColor;opacity:.85}
.sa-band.ok .sa-bars{color:#0E734F}.sa-band.mid .sa-bars{color:#D9A03B}.sa-band.high .sa-bars{color:#B3261E}
.sa-steps.arrows{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:center;gap:12px}
.sa-steps.arrows>div{background:#fff;border:1px solid var(--line);border-radius:16px}
.sa-arrow{font-style:normal;font-size:22px;color:var(--t);opacity:.6}
.sa-faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px 12px}
.sa-faq-grid .sa-faq{margin:0}
.sa-rels.row{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}
.sa-rels.row .sa-rel{flex-direction:column;align-items:flex-start;gap:8px;padding:14px}
.sa-cta.dark,.sa-content section.sa-cta.dark{background:linear-gradient(135deg,#0a4a46,#0b6f69)!important;display:grid;grid-template-columns:auto 1fr auto;gap:22px;align-items:center;text-align:left;padding:26px 30px!important;border-radius:22px!important}
.sa-cta.dark.row{grid-template-columns:1fr auto}
.sa-cta-art svg{width:110px;height:110px}
.sa-cta-txt h2{font-size:24px;margin:0 0 6px}.sa-cta-txt p{margin:0;opacity:.92}
.sa-cta-act{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.sa-cta-act small{font-size:11.5px;opacity:.8}
.sa-trustrow{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:18px 0 8px}
.sa-trustrow>div{display:grid;grid-template-columns:40px 1fr;gap:4px 12px;align-items:center;padding:12px 14px}
.sa-trustrow span{grid-row:span 2;width:40px;height:40px;border-radius:12px;background:var(--tint-t);display:grid;place-items:center;font-size:18px}
.sa-trustrow b{font-size:13.5px;color:var(--t1)}.sa-trustrow small{font-size:11.5px;color:var(--mut)}
/* index tiles per design */
.sa-badge{background:#edf8f6;color:var(--t);font-size:9.5px!important;letter-spacing:.06em}
.sa-tile .sa-meta span{font-weight:600;color:var(--mut)}
.sa-tile .sa-meta span+span::before{content:"•";margin:0 6px;color:#c9d9d7}
.sa-tile .sa-go::before{content:none}
.sa-how-art{position:absolute;right:20px;top:-10px;font-size:64px;opacity:.9}
.sa-how{position:relative}
.sa-how .sa-path{grid-template-columns:repeat(3,1fr);padding-right:90px}
@media(max-width:1000px){.sa-quiz-row{grid-template-columns:1fr}.sa-why{position:static}.sa-two-col{grid-template-columns:1fr}.sa-steps.arrows{grid-template-columns:1fr}.sa-arrow{display:none}.sa-faq-grid{grid-template-columns:1fr}.sa-rels.row{grid-template-columns:repeat(3,1fr)}.sa-trustrow{grid-template-columns:1fr 1fr}.sa-cta.dark,.sa-content section.sa-cta.dark{grid-template-columns:1fr;text-align:center}.sa-cta-act{align-items:center}.sa-band-peach{grid-template-columns:1fr}.sa-who-hand{display:none}.sa-how .sa-path{padding-right:0}.sa-how-art{display:none}}
@media(max-width:600px){.sa-hero-v13 h1{font-size:28px}.sa-rels.row{grid-template-columns:1fr 1fr}.sa-trustrow{grid-template-columns:1fr}.sa-bands{grid-template-columns:1fr}.sa-hand{font-size:20px}}

/* ======================= v14: trust band inside the grid ======================= */
.sa-trustband{grid-column:1/-1;margin:10px 0;padding:30px 32px;border-radius:24px;background:linear-gradient(140deg,#f2fbfa,#fff 55%,#fff5f0);border:1px solid rgba(0,109,104,.12);box-shadow:var(--sh-1)}
.sa-tb-kicker{display:inline-block;font-size:10.5px;font-weight:800;letter-spacing:.12em;color:var(--t);margin-bottom:8px}
.sa-tb-head h2{font-size:26px;line-height:1.2;margin:0 0 8px;text-transform:none}
.sa-tb-head p{font-size:14.5px;line-height:1.65;color:var(--mut);max-width:80ch;margin:0}
.sa-tb-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:20px 0}
.sa-tb-c{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px 18px;box-shadow:var(--sh-1);transition:transform var(--ease),box-shadow var(--ease)}
.sa-tb-c:hover{transform:translateY(-3px);box-shadow:var(--sh-2)}
.sa-tb-c span{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:12px;background:var(--tint-t);font-size:18px;margin-bottom:8px}
.sa-tb-c b{display:block;font-family:'Merriweather',serif;font-size:14px;margin-bottom:4px;color:var(--t1)}
.sa-tb-c p{font-size:12.5px;line-height:1.55;color:var(--mut);margin:0}
.sa-tb-quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.sa-tb-quotes figure{margin:0;padding:16px 18px;border-radius:16px;background:#fff;border:1px solid var(--line)}
.sa-tb-quotes blockquote{margin:0 0 8px;font-size:13.5px;line-height:1.6;color:var(--ink);font-style:italic}
.sa-tb-quotes figcaption{font-size:12px;color:var(--mut);font-weight:700}
.sa-tb-foot{margin:16px 0 0;font-size:11.5px;color:var(--mut);text-align:center}
@media(max-width:1000px){.sa-tb-grid{grid-template-columns:1fr 1fr}.sa-tb-quotes{grid-template-columns:1fr}}
@media(max-width:600px){.sa-trustband{padding:22px 18px}.sa-tb-head h2{font-size:21px}.sa-tb-grid{grid-template-columns:1fr}}

/* ======================= v15: bands + mobile-first chat ======================= */
.sa-proofband{grid-column:1/-1;margin:10px 0;padding:30px 32px;border-radius:24px;background:linear-gradient(140deg,#0a4a46,#0b6f69);color:#fff;box-shadow:var(--sh-3)}
.sa-proofband .sa-tb-kicker{color:#8fd6cd}
.sa-pb-head h2{color:#fff;font-size:26px;line-height:1.25;margin:0 0 16px;text-transform:none;max-width:26ch}
.sa-pb-cols{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.sa-pb-c{padding:18px 20px;border-radius:18px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16)}
.sa-pb-c.now{background:rgba(255,255,255,.14)}
.sa-pb-c b{display:block;font-family:'Merriweather',serif;font-size:15px;margin-bottom:10px;color:#fff}
.sa-pb-c ul{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:6px}
.sa-pb-c li{font-size:13.5px;line-height:1.5;color:rgba(255,255,255,.92)}
.sa-pb-c.later li{opacity:.72}
.sa-pb-c.now li::marker{content:"✓  "}
.sa-pb-nums{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:18px 0}
.sa-pb-nums div{text-align:center;padding:12px;border-radius:14px;background:rgba(255,255,255,.1)}
.sa-pb-nums b{display:block;font-family:'Merriweather',serif;font-size:26px;color:#fff}
.sa-pb-nums small{font-size:11px;color:rgba(255,255,255,.8)}
.sa-pb-note{display:grid;grid-template-columns:44px 1fr;gap:12px;align-items:start;padding:16px 18px;border-radius:16px;background:rgba(255,255,255,.1)}
.sa-pb-note span{width:44px;height:44px;border-radius:12px;background:rgba(255,255,255,.16);display:grid;place-items:center;font-size:20px}
.sa-pb-note p{margin:0;font-size:13.5px;line-height:1.6;color:rgba(255,255,255,.92)}
.sa-pb-note b{color:#fff}

.sa-reassure{background:var(--bg)!important;border:1px solid rgba(0,109,104,.1)!important}
.sa-re-head h2{font-size:24px;margin:2px 0 14px;text-transform:none}
.sa-re-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.sa-re-grid>div{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px 18px}
.sa-re-grid span{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:12px;background:var(--tint-t);font-size:18px;margin-bottom:8px}
.sa-re-grid b{display:block;font-family:'Merriweather',serif;font-size:14.5px;margin-bottom:5px}
.sa-re-grid p{font-size:12.5px!important;line-height:1.55!important;color:var(--mut)!important;margin:0!important}
.sa-re-quote{margin-top:14px;padding:16px 18px;border-radius:16px;background:#fff;border-left:4px solid var(--t)}
.sa-re-quote blockquote{margin:0 0 6px;font-style:italic;font-size:14px;line-height:1.6}
.sa-re-quote figcaption{font-size:12px;color:var(--mut)}

/* ---------- chat: no dead space, answered questions fold, 3D depth ---------- */
.sa-quiz{padding:20px 20px 16px}
.sa-log{min-height:0;max-height:min(62vh,560px);overflow:auto;scroll-behavior:smooth;padding-right:4px;gap:12px}
.sa-log::-webkit-scrollbar{width:6px}.sa-log::-webkit-scrollbar-thumb{background:var(--tint-t2);border-radius:3px}
/* an answered question collapses to its stem */
.sa-msg.answered .sa-opts{display:none}
.sa-msg.answered .sa-bub{background:#fff;border-style:dashed;opacity:.72;padding:9px 13px}
.sa-msg.answered .sa-q{font-size:13.5px;font-weight:500;color:var(--mut)}
.sa-msg.answered .sa-q small{display:none}
/* option cards with real depth, and a press */
.sa-opts{gap:10px}
.sa-opt{transform-style:preserve-3d;box-shadow:0 2px 0 rgba(0,109,104,.12),var(--sh-1)}
.sa-opt:hover:not(:disabled){box-shadow:0 6px 0 rgba(0,109,104,.14),var(--sh-2);transform:translateY(-3px)}
.sa-opt:active:not(:disabled){transform:translateY(0);box-shadow:0 1px 0 rgba(0,109,104,.18)}
.sa-opt.on{box-shadow:0 4px 0 rgba(0,80,76,.5),0 10px 24px -10px rgba(0,109,104,.7)}
.sa-bub{will-change:transform}
.sa-msg{animation:saPop .32s cubic-bezier(.2,.9,.3,1.2) both}
@keyframes saPop{from{opacity:0;transform:translateY(10px) scale(.97)}}
.sa-msg.me{animation:saPopMe .32s cubic-bezier(.2,.9,.3,1.2) both}
@keyframes saPopMe{from{opacity:0;transform:translateY(10px) scale(.97)}}

/* ---------- mobile first: the chat becomes the page ---------- */
@media(max-width:900px){
  .sa-quiz-row{grid-template-columns:1fr;gap:12px}
  .sa-why{order:2}
  .sa-quiz{padding:14px 12px 10px;border-radius:20px}
  .sa-log{max-height:none;min-height:auto;overflow:visible}
  .sa-head{margin:2px 0 10px;padding-bottom:10px}
  .sa-head-l small{display:none}
  .sa-step{font-size:11px;padding:5px 10px}
  .sa-bub{max-width:100%;font-size:15px;padding:13px 15px}
  .sa-msg{gap:8px}
  .sa-av{width:30px;height:30px;font-size:14px}
  .sa-q{font-size:16.5px}
  .sa-opts{grid-template-columns:1fr;gap:8px}
  .sa-opt{min-height:52px;font-size:15px;justify-content:flex-start;padding:12px 16px}
  .sa-opt em{font-size:20px}
  .sa-opt.sa-back{min-height:44px;font-size:13px}
  .sa-trust{gap:6px;font-size:11px}
  .sa-hero-v13 .sa-hero-actions .sa-btn{flex:1 1 100%;justify-content:center}
  .sa-re-grid{grid-template-columns:1fr}
  .sa-pb-cols,.sa-pb-nums{grid-template-columns:1fr 1fr}
  .sa-pb-head h2{font-size:21px}
  .sa-pb-note{grid-template-columns:1fr}
}
@media(max-width:480px){
  .sa-pb-cols{grid-template-columns:1fr}
  .sa-proofband{padding:22px 18px}
  .sa-opt{min-height:54px}
  .sa-in,.sa-tel select{height:48px}
  .sa-btn{height:48px;width:100%}
  .sa-lead-actions{flex-direction:column}
  .sa-share button,.sa-share a{flex:1 1 100%;text-align:center}
}

/* ======================= v16: option meter, no numbers, quiet scroll ======================= */
.sa-opt[data-v]::before{display:none!important}          /* the old 1–5 badge */
.sa-opt em{display:none}
.sa-opts{grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:9px}
.sa-opt{position:relative;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:11px;text-align:left;padding:13px 15px;min-height:54px;font-size:14px;font-weight:600;overflow:hidden}
.sa-opt::after{content:"";position:absolute;left:0;top:0;bottom:0;width:calc(var(--lvl,0)*100%);background:linear-gradient(90deg,rgba(0,109,104,.09),rgba(0,109,104,.02));opacity:0;transition:opacity .2s;pointer-events:none}
.sa-opt:hover:not(:disabled)::after{opacity:1}
.sa-opt.on::after{opacity:0}
.sa-opt-t{line-height:1.3}
/* segmented intensity meter — the whole scale readable at a glance */
.sa-meter{display:flex;gap:2.5px;align-items:flex-end;height:20px;flex:none}
.sa-meter i{width:4px;border-radius:2px;background:var(--line);height:40%;transition:background .18s,height .18s}
.sa-meter i:nth-child(2){height:55%}.sa-meter i:nth-child(3){height:70%}.sa-meter i:nth-child(4){height:85%}.sa-meter i:nth-child(5){height:100%}
.sa-meter i.on{background:linear-gradient(180deg,var(--t2),var(--t))}
.sa-opt:hover:not(:disabled) .sa-meter i.on{background:linear-gradient(180deg,var(--o),#e8552f)}
.sa-opt.on .sa-meter i{background:rgba(255,255,255,.35)}
.sa-opt.on .sa-meter i.on{background:#fff}
.sa-tick{opacity:0;transform:scale(.6);transition:opacity .18s,transform .18s;font-weight:900;color:#fff}
.sa-opt.on .sa-tick{opacity:1;transform:scale(1)}
.sa-opt.sa-back{grid-template-columns:1fr;justify-items:center;min-height:44px;font-size:13px}
.sa-opt.start{grid-template-columns:1fr;justify-items:center}

/* the log scrolls without showing a bar until you use it */
.sa-log{scrollbar-width:none;-ms-overflow-style:none;overscroll-behavior:contain}
.sa-log::-webkit-scrollbar{width:0}
.sa-quiz{position:relative}
.sa-quiz::after{content:"";position:absolute;left:20px;right:20px;bottom:64px;height:34px;background:linear-gradient(180deg,transparent,#fff);pointer-events:none;opacity:.9}
@media(max-width:900px){.sa-quiz::after{display:none}.sa-opts{grid-template-columns:1fr}.sa-opt{min-height:56px;font-size:15px}}

/* ======================= v17: meaningful answer icons, deeper 3D chat ======================= */
.sa-meter{display:none}
.sa-oico{width:34px;height:34px;border-radius:11px;background:var(--tint-t);color:var(--t);display:grid;place-items:center;flex:none;transition:background .2s,color .2s,transform .25s}
.sa-oico svg{width:20px;height:20px;overflow:visible}
.sa-oico svg .fill{fill:currentColor;fill-opacity:.12}
.sa-oico svg .pan.low{opacity:.45}
.sa-opt:hover:not(:disabled) .sa-oico{background:#fff;color:var(--o);transform:rotateY(14deg) scale(1.06)}
.sa-opt.on .sa-oico{background:rgba(255,255,255,.2);color:#fff;transform:none}
.sa-opt{transition:transform .22s cubic-bezier(.2,.8,.2,1),box-shadow .22s,border-color .2s,background-color .2s,color .2s}

/* the chat card itself gets depth, and each bubble arrives in 3D */
.sa-quiz{perspective:1200px}
.sa-log{transform-style:preserve-3d}
.sa-msg{animation:saIn3d .42s cubic-bezier(.2,.85,.25,1.05) both;transform-origin:left bottom}
.sa-msg.me{transform-origin:right bottom;animation-name:saIn3dMe}
@keyframes saIn3d{from{opacity:0;transform:perspective(700px) rotateX(-8deg) translateY(14px) scale(.97)}}
@keyframes saIn3dMe{from{opacity:0;transform:perspective(700px) rotateX(-8deg) translateY(14px) scale(.97)}}
.sa-bub{box-shadow:0 1px 0 rgba(0,109,104,.08),0 10px 22px -16px rgba(0,60,55,.5)}
.sa-msg.me .sa-bub{box-shadow:0 2px 0 rgba(0,80,76,.35),0 12px 24px -14px rgba(0,109,104,.7)}
.sa-av{box-shadow:0 3px 0 rgba(0,80,76,.35),0 8px 18px -10px rgba(0,109,104,.7);transition:transform .25s}
.sa-msg:hover .sa-av{transform:translateY(-2px) rotate(-6deg)}
/* the question card floats a little above the thread */
.sa-q{position:relative}
.sa-msg:not(.answered) .sa-bub:has(.sa-q){background:linear-gradient(180deg,#fff,var(--bg));box-shadow:0 2px 0 rgba(0,109,104,.1),0 18px 34px -22px rgba(0,60,55,.6)}
/* progress bar reads as a track with a moving head */
.sa-bar{position:relative}
.sa-bar-fill::after{content:"";position:absolute;right:-1px;top:50%;transform:translateY(-50%);width:12px;height:12px;border-radius:50%;background:#fff;border:2.5px solid var(--o);box-shadow:0 2px 8px rgba(255,92,53,.5)}
.sa-bar-fill{position:relative;overflow:visible}
@media(max-width:900px){.sa-oico{width:38px;height:38px}.sa-oico svg{width:22px;height:22px}}
@media(prefers-reduced-motion:reduce){.sa-msg{animation:none}.sa-opt,.sa-oico{transition:none}}

/* ======================= v18: trust, sources, next steps + sticky fix ======================= */
/* The sticky panel and any anchor jump sat under the site header. */
.sa-why{top:150px}
.sa-quiz,.sa-content>section,.sa-hero{scroll-margin-top:150px}
#sa-app{scroll-margin-top:150px}

.sa-byline{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;padding:14px 18px;border-radius:16px;background:#fff;border:1px solid var(--line);box-shadow:var(--sh-1);margin-bottom:16px}
.sa-by-ic{width:40px;height:40px;border-radius:12px;background:var(--tint-t);display:grid;place-items:center;font-size:19px}
.sa-byline b{display:block;font-size:14px;color:var(--t1)}
.sa-byline small{font-size:12px;color:var(--mut)}
.sa-by-badge{font-size:11.5px;font-weight:800;color:#0E734F;background:#e3f4ec;border:1px solid #bfe3d0;border-radius:999px;padding:6px 12px;white-space:nowrap}

.sa-method{background:#fff!important;border:1px solid var(--line)!important}
.sa-method-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:8px}
.sa-method-grid>div{padding:16px 18px;border-radius:16px;background:var(--bg);border:1px solid rgba(0,109,104,.1)}
.sa-method-grid b{display:block;font-family:'Merriweather',serif;font-size:14.5px;margin-bottom:6px;color:var(--t1)}
.sa-method-grid p{font-size:13.5px!important;line-height:1.6!important;margin:0!important;color:var(--ink)!important}
.sa-cite{margin-top:8px!important;padding:9px 11px;border-left:3px solid var(--t);background:#fff;border-radius:8px;font-size:12px!important;color:var(--mut)!important;font-style:italic}

.sa-after-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:8px}
.sa-after-c{display:block;padding:16px 18px;border-radius:16px;background:#fff;border:1px solid var(--line);text-decoration:none;color:inherit;transition:transform var(--ease),box-shadow var(--ease),border-color var(--ease)}
.sa-after-c:hover{transform:translateY(-3px);box-shadow:var(--sh-2);border-color:var(--t)}
.sa-after-c span{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:12px;background:var(--tint-t);font-size:18px;margin-bottom:8px}
.sa-after-c b{display:block;font-family:'Merriweather',serif;font-size:14.5px;margin-bottom:5px;color:var(--t1)}
.sa-after-c small{font-size:12.5px;line-height:1.55;color:var(--mut)}
@media(max-width:1000px){.sa-method-grid{grid-template-columns:1fr}.sa-after-grid{grid-template-columns:1fr 1fr}.sa-why{top:auto}}
@media(max-width:600px){.sa-after-grid{grid-template-columns:1fr}.sa-byline{grid-template-columns:auto 1fr}.sa-by-badge{grid-column:1/-1;justify-self:start}}