/* shared.css - shared landing-page sections (hero proof, why-us, FAQ, final CTA, eval, section atmosphere, reveal). GLOBAL as of v0.57.0; loads on every page so any template can compose the finalized sections. Behaviour ships in landing.js. */
.stk-hero__glow{position:absolute;width:520px;height:520px;border-radius:50%;right:-140px;top:-120px;background:radial-gradient(circle,rgba(37,99,235,.30),transparent 60%);filter:blur(30px);z-index:0;pointer-events:none;animation:stk-hero-float 13s ease-in-out infinite;}
.stk-hero.is-in [data-reveal]{opacity:1;transform:none;}
.stk-hero__proof{position:relative;z-index:1;background:rgba(255,255,255,.05);border:1px solid rgba(147,197,253,.18);border-radius:var(--stk-r-panel);padding:28px 28px 26px;backdrop-filter:blur(10px);box-shadow:0 24px 60px rgba(2,8,23,.45);}
.stk-hero__proof-rating{display:flex;align-items:center;gap:15px;}
.stk-hero__proof-num{font-family:var(--stk-display);font-weight:800;font-size:46px;line-height:1;color:#fff;font-variant-numeric:tabular-nums;}
.stk-hero__proof-stars{display:flex;gap:3px;margin-bottom:5px;}
.stk-hero__proof-stars svg{width:16px;height:16px;color:var(--stk-blue-300);}
.stk-hero__proof-verified{display:inline-flex;align-items:center;gap:5px;font-family:var(--stk-display);font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--stk-blue-300);}
.stk-hero__proof-verified svg{width:13px;height:13px;}
.stk-hero__proof-count{font-size:12.5px;color:var(--stk-muted-3);margin-top:3px;}
.stk-hero__proof-div{height:1px;background:rgba(147,197,253,.14);margin:20px 0;}
.stk-hero__proof-label{font-family:var(--stk-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--stk-muted-2);}
.stk-hero__proof-sub{font-size:12px;color:var(--stk-muted-3);}
.stk-hero__proof-link{display:inline-flex;align-items:center;gap:5px;margin-top:11px;font-family:var(--stk-display);font-weight:600;font-size:13px;color:var(--stk-blue-300);text-decoration:none;}
.stk-hero__proof-link svg{width:12px;height:12px;transition:transform .18s ease;}
.stk-hero__proof-link:hover svg{transform:translate(2px,-2px);}
.stk-hero__proof-guar{display:flex;align-items:center;gap:9px;font-size:13.5px;color:#fff;font-weight:500;}
.stk-hero__proof-guar svg{width:18px;height:18px;color:var(--stk-blue-400);flex:none;}
@media(prefers-reduced-motion:reduce){.stk-hero__atmos,.stk-hero__glow{animation:none;}}
.stk-why{background:#fff;}
.stk-why__inner{display:grid;grid-template-columns:.85fr 1.15fr;gap:88px;align-items:start;}
.stk-why__title{font-family:var(--stk-display);font-weight:800;font-size:clamp(30px,3.4vw,40px);line-height:1.1;letter-spacing:-.02em;color:var(--stk-ink);margin:14px 0 18px;}
.stk-why__title .acc{background:linear-gradient(135deg,var(--stk-blue) 0%,var(--stk-blue-deep) 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;}
.stk-why__lead{font-size:16px;line-height:1.6;color:var(--stk-ink-3);margin:0 0 26px;max-width:380px;}
.stk-why__proof{display:flex;gap:14px;align-items:flex-start;background:var(--stk-blue-50);border:1px solid var(--stk-blue-200);border-radius:var(--stk-r-card);padding:18px 20px;}
.stk-why__proof svg{width:22px;height:22px;color:var(--stk-blue);flex:none;margin-top:1px;}
.stk-why__proof strong{display:block;font-family:var(--stk-display);font-weight:700;font-size:15px;color:var(--stk-ink);margin-bottom:3px;}
.stk-why__proof span{font-size:13px;line-height:1.5;color:var(--stk-ink-3);}
.stk-why__list{display:flex;flex-direction:column;}
.stk-why__item{display:flex;gap:20px;padding:24px 0;border-top:1px solid var(--stk-border);align-items:flex-start;opacity:0;transform:translateY(16px);transition:opacity .6s cubic-bezier(.22,.61,.36,1),transform .6s cubic-bezier(.22,.61,.36,1);}
.stk-why__item:first-child{border-top:0;padding-top:0;}
.stk-why.is-in .stk-why__item{opacity:1;transform:none;}
.stk-why__tile{flex:none;width:48px;height:48px;border-radius:var(--stk-r-btn);background:var(--stk-blue-50);border:1px solid var(--stk-blue-200);display:grid;place-items:center;transition:background .25s ease,border-color .25s ease,box-shadow .25s ease;}
.stk-why__tile svg{width:22px;height:22px;color:var(--stk-blue);transition:color .25s ease;}
.stk-why__item:hover .stk-why__tile{background:var(--stk-blue);border-color:var(--stk-blue);box-shadow:0 8px 20px rgba(37,99,235,.25);}
.stk-why__item:hover .stk-why__tile svg{color:#fff;}
.stk-why__h{font-family:var(--stk-display);font-weight:700;font-size:18px;color:var(--stk-ink);margin:2px 0 6px;flex:0 0 160px;}
.stk-why__d{font-size:14.5px;line-height:1.6;color:var(--stk-ink-3);margin:0;flex:1 1 0;min-width:0;}
@media(max-width:860px){.stk-why__inner{grid-template-columns:1fr;gap:36px;}.stk-why__item{display:grid;grid-template-columns:auto 1fr;column-gap:16px;row-gap:6px;align-items:start;}.stk-why__tile{grid-column:1;grid-row:1 / span 2;}.stk-why__h{grid-column:2;grid-row:1;}.stk-why__d{grid-column:2;grid-row:2;}}
@media(prefers-reduced-motion:reduce){.stk-why__item{opacity:1;transform:none;transition:none;}}
.acc{background:linear-gradient(135deg,var(--stk-blue) 0%,var(--stk-blue-deep) 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;}
[data-rg] .rev{opacity:0;transform:translateY(18px);transition:opacity .6s cubic-bezier(.22,.61,.36,1),transform .6s cubic-bezier(.22,.61,.36,1);}
[data-rg].is-in .rev{opacity:1;transform:none;}
.v1{background:linear-gradient(180deg,var(--stk-white) 0%,var(--stk-surface-1) 30%,var(--stk-surface-1) 70%,var(--stk-white) 100%);}
@media(prefers-reduced-motion:reduce){[data-rg] .rev{opacity:1;transform:none;transition:none;}}
.stk-evalfa{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:44px;align-items:start;max-width:var(--stk-container-default);margin:0 auto;}
.stk-evalfa__btn{width:100%;text-align:left;display:flex;align-items:center;gap:14px;padding:15px 18px;border-radius:var(--stk-r-card);background:rgba(255,255,255,.03);border:1px solid rgba(147,197,253,.12);color:#fff;cursor:pointer;font-family:var(--stk-display);transition:border-color .2s,background .2s;}
.stk-evalfa__btn:hover{border-color:rgba(96,165,250,.4);}
.stk-evalfa__btn[aria-selected="true"]{background:rgba(37,99,235,.18);border-color:rgba(96,165,250,.55);}
.stk-evalfa__panel{display:none;}
.stk-evalfa__panel.is-active{display:block;animation:stk-fade .4s ease;}
.stk-evalfa__pct{font-family:var(--stk-display);font-weight:800;font-size:54px;line-height:1;color:#fff;font-variant-numeric:tabular-nums;}
@media(max-width:780px){.stk-evalfa{grid-template-columns:1fr;gap:24px;}}
@media(prefers-reduced-motion:reduce){.stk-evalfa__panel.is-active{animation:none;}}
.stk-case.is-in{opacity:1;transform:none;}
.s2{background:#fff;}
/* Section flow: render surface sections as a gentle swell (white -> tint -> white)
   so every white/surface boundary is seamless. Scoped to role + location because
   shared.css only loads there; marketing pages keep the flat patterns.css fill. */
.stk-page__section--surface{background:linear-gradient(180deg,var(--stk-white) 0%,var(--stk-surface-1) 30%,var(--stk-surface-1) 70%,var(--stk-white) 100%);}
/* Let a centered section heading break out of a narrow reading column to its full
   heading width, so long titles (e.g. the FAQ heading) stay on one line while the
   reading content below keeps the narrow width. Clamped so it never overflows. */
.stk-page__inner--narrow > .stk-section-head:not(.stk-section-head--left){width:var(--stk-container-heading);max-width:calc(100vw - 2*var(--stk-section-x));margin-left:50%;transform:translateX(-50%);}
/* Section background treatments. Used sparingly on "moment" sections only, never
   behind reading-heavy content. --glow: a soft brand-blue corner glow for depth.
   (The hero is already a glow+grid combo via .stk-hero__glow + .stk-hero__atmos.) */
.stk-page__section--glow::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(820px 560px at 82% 46%,rgba(37,99,235,.28),transparent 72%);-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 22%,#000 88%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0,#000 22%,#000 88%,transparent 100%);}
.stk-page__section--glow > .stk-page__inner{position:relative;z-index:1;}
/* --grid: edge framing. A faint grid pulled to the flanks with a clean reading
   channel down the middle. Used sparingly on one section per page, away from --glow. */
.stk-page__section--grid::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background-image:linear-gradient(rgba(37,99,235,.18) 1px,transparent 1px),linear-gradient(90deg,rgba(37,99,235,.18) 1px,transparent 1px);background-size:40px 40px;-webkit-mask-image:linear-gradient(90deg,#000 0,transparent 26%,transparent 74%,#000 100%),linear-gradient(180deg,transparent 0,#000 18%,#000 82%,transparent 100%);-webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,#000 0,transparent 26%,transparent 74%,#000 100%),linear-gradient(180deg,transparent 0,#000 18%,#000 82%,transparent 100%);mask-composite:intersect;}
.stk-page__section--grid > .stk-page__inner{position:relative;z-index:1;}
.s2__fchip{font-family:var(--stk-display);font-weight:600;font-size:13px;color:var(--stk-ink-2);background:#fff;border:1px solid var(--stk-border);border-radius:var(--stk-r-pill);padding:8px 16px;cursor:pointer;transition:all .2s;}
.s2__fchip:hover{border-color:var(--stk-blue-300);color:var(--stk-blue);}
.s2__fchip.is-active{background:var(--stk-blue);border-color:var(--stk-blue);color:#fff;}
.s2__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;max-width:var(--stk-container-default);margin:0 auto;}
.s2__card{background:var(--stk-surface-1);border:1px solid var(--stk-border);border-radius:var(--stk-r-card);padding:24px;transition:opacity .35s,transform .35s,box-shadow .35s,border-color .35s,background .35s;}
.s2__card.is-dim{opacity:.32;}
.s2__card.is-match{background:#fff;border-color:var(--stk-blue);box-shadow:0 14px 36px rgba(37,99,235,.10);transform:translateY(-3px);}
.s2__chead{display:flex;align-items:center;gap:12px;margin-bottom:12px;}
.s2__cico{width:38px;height:38px;border-radius:var(--stk-r-btn);background:var(--stk-blue-50);color:var(--stk-blue);display:grid;place-items:center;flex:none;}
.s2__cico svg{width:20px;height:20px;}
.s2__cname{font-family:var(--stk-display);font-weight:700;font-size:17px;color:var(--stk-ink);margin:0;letter-spacing:-.01em;}
.s2__cone{font-size:13.5px;line-height:1.5;color:var(--stk-ink-3);margin:0 0 14px;}
.s2__cchip{font-family:var(--stk-mono);font-size:11px;color:var(--stk-ink-2);background:#fff;border:1px solid var(--stk-border);border-radius:var(--stk-r-pill);padding:3px 9px;transition:all .25s;}
.s2__card.is-match .s2__cchip.is-hit{background:var(--stk-blue);border-color:var(--stk-blue);color:#fff;}
@media(max-width:820px){.s1__grid,.s2__grid{grid-template-columns:1fr;}}
@media(prefers-reduced-motion:reduce){[data-rg] .rev{opacity:1;transform:none;transition:none;}.s1__card,.s1__detail,.s2__card,.s1__ico{transition:none;}}
.acc{background:linear-gradient(135deg,var(--stk-blue-300) 0%,var(--stk-blue) 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;}
.cov{position:relative;overflow:hidden;background:linear-gradient(160deg,var(--stk-navy-900) 0%,var(--stk-navy-800) 100%);color:#fff;}
.cov__bar-val{font-family:var(--stk-display);font-weight:800;font-size:18px;color:#fff;white-space:nowrap;}
.cov__bar--ind .cov__bar-fill{background:var(--stk-muted-2);}
.cov__bar--stk .cov__bar-val{color:var(--stk-blue-300);}
.cov.is-in .cov__bar--ind .cov__bar-fill{width:100%;}
.cov.is-in .cov__bar--stk .cov__bar-fill{width:27%;}
@media(prefers-reduced-motion:reduce){[data-rg] .rev{opacity:1;transform:none;transition:none;}}
[data-rg] .rev{opacity:0;transform:translateY(16px);transition:opacity .6s cubic-bezier(.22,.61,.36,1),transform .6s cubic-bezier(.22,.61,.36,1);}
.faq__list{max-width:820px;margin:0 auto;border-top:1px solid var(--stk-border);}
.faq__item{border-bottom:1px solid var(--stk-border);}
.faq__q{width:100%;display:flex;justify-content:space-between;align-items:center;gap:20px;background:none;border:0;padding:24px 4px;cursor:pointer;text-align:left;font-family:var(--stk-display);font-weight:600;font-size:18px;line-height:1.35;color:var(--stk-ink);letter-spacing:-.01em;transition:color .2s;}
.faq__q:hover{color:var(--stk-blue);}
.faq__q:focus-visible{outline:2px solid var(--stk-blue);outline-offset:3px;border-radius:var(--stk-r-sm);}
.faq__qic{width:30px;height:30px;border-radius:var(--stk-r-pill);background:var(--stk-surface-2);color:var(--stk-ink-3);display:grid;place-items:center;flex:none;transition:transform var(--stk-acc-dur) var(--stk-acc-ease),background .25s,color .25s;}
.faq__qic svg{width:16px;height:16px;}
.faq__item.is-open .faq__qic{transform:rotate(180deg);background:var(--stk-blue);color:#fff;}
.faq__item.is-open .faq__q{color:var(--stk-blue);}
.faq__a{display:grid;grid-template-rows:0fr;overflow:hidden;transition:grid-template-rows var(--stk-acc-dur) var(--stk-acc-ease);}
.faq__item.is-open .faq__a{grid-template-rows:1fr;}
.faq__a-inner{overflow:hidden;min-height:0;}
.faq__a-content{padding:2px 4px 26px;font-size:15px;line-height:1.65;color:var(--stk-ink-3);max-width:680px;}
.faq__a-inner a{color:var(--stk-blue);text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:1px;transition:color .2s;}
.faq__a-inner a:hover{color:var(--stk-blue-hover);}
.no-js .faq__a{grid-template-rows:1fr;}
.no-js .faq__qic{display:none;}
.faq__more{text-align:center;margin-top:38px;font-size:15px;color:var(--stk-muted);}
.faq__more a{color:var(--stk-blue);font-weight:600;text-decoration:none;}
.faq__more a:hover{text-decoration:underline;}
@media(prefers-reduced-motion:reduce){[data-rg] .rev{opacity:1;transform:none;transition:none;}.faq__a,.faq__qic{transition:none;}}
[data-rg] .rev{opacity:0;transform:translateY(14px);transition:opacity .55s cubic-bezier(.22,.61,.36,1),transform .55s cubic-bezier(.22,.61,.36,1);}
.b190{background:#fff;padding:60px 0;}
.b190__band{max-width:var(--stk-container-default);margin:0 auto;background:var(--stk-blue-50);border:1px solid var(--stk-blue-200);border-radius:var(--stk-r-panel);padding:26px 30px;}
.b190__top{display:flex;align-items:center;gap:16px;}
.b190__ico{flex:none;width:42px;height:42px;border-radius:var(--stk-r-btn);background:var(--stk-blue);color:#fff;display:grid;place-items:center;box-shadow:0 4px 12px rgba(37,99,235,.22);}
.b190__ico svg{width:22px;height:22px;}
.b190__head{flex:1 1 auto;min-width:0;}
.b190__lead{font-family:var(--stk-display);font-weight:700;font-size:16px;color:var(--stk-ink);margin:0 0 2px;letter-spacing:-.01em;}
.b190__sub{font-size:13px;line-height:1.5;color:var(--stk-ink-3);margin:0;}
.b190__link{flex:none;display:inline-flex;align-items:center;gap:8px;font-family:var(--stk-display);font-weight:600;font-size:14px;color:#fff;background:var(--stk-blue);border-radius:var(--stk-r-btn);padding:13px 22px;text-decoration:none;white-space:nowrap;transition:background .2s,gap .2s,box-shadow .2s;}
.b190__link:hover{gap:11px;color:#fff;background:var(--stk-blue-hover);box-shadow:0 8px 20px rgba(37,99,235,.25);}
.b190__link svg{width:15px;height:15px;}
.b190__chips{list-style:none;display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 0;padding:18px 0 0;border-top:1px solid var(--stk-blue-200);}
.b190__chip{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--stk-blue-200);border-radius:999px;padding:8px 14px 8px 11px;font-family:var(--stk-display);font-weight:600;font-size:13px;color:var(--stk-ink-2);}
.b190__chip svg{flex:none;width:15px;height:15px;color:var(--stk-blue);}
@media(max-width:720px){.b190__top{flex-wrap:wrap;}.b190__link{margin-top:4px;width:100%;justify-content:center;}}
@media(prefers-reduced-motion:reduce){[data-rg] .rev{opacity:1;transform:none;transition:none;}}
.lf__pt-ic .stk-i-star{color:#f59e0b;}
.dacc{background:linear-gradient(135deg,var(--stk-blue-300) 0%,var(--stk-blue) 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;}
.fcta{position:relative;overflow:hidden;background:linear-gradient(160deg,var(--stk-navy-900) 0%,var(--stk-navy-800) 100%);color:#fff;text-align:center;}
.fcta__glow{position:absolute;width:680px;height:680px;border-radius:50%;background:radial-gradient(circle,rgba(37,99,235,.30),transparent 68%);top:-220px;left:50%;transform:translateX(-50%);pointer-events:none;}
.fcta__glow2{position:absolute;width:380px;height:380px;border-radius:50%;background:radial-gradient(circle,rgba(37,99,235,.16),transparent 70%);bottom:-150px;right:-100px;pointer-events:none;}
.fcta__inner{position:relative;z-index:1;max-width:740px;margin:0 auto;}
.fcta__title{font-family:var(--stk-display);font-weight:800;font-size:clamp(32px,4.6vw,52px);letter-spacing:-.03em;line-height:1.05;margin:0 0 18px;color:#fff;}
.fcta__lead{font-size:18px;line-height:1.6;color:var(--stk-muted-3);margin:0 auto 38px;max-width:580px;}
.fcta__actions{display:flex;align-items:center;gap:14px;justify-content:center;flex-wrap:wrap;}
.fcta__tagline{margin:46px 0 0;font-family:var(--stk-display);font-weight:600;font-size:15px;letter-spacing:.01em;color:var(--stk-muted-2);}
.fcta__tagline .stk{color:var(--stk-blue-300);}
.acc{background:linear-gradient(135deg,var(--stk-blue),var(--stk-blue-deep));-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;}
.cov .acc{background:linear-gradient(135deg,var(--stk-blue-300),var(--stk-blue));-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;}
.fcta .dacc{background:linear-gradient(135deg,var(--stk-blue-300),var(--stk-blue));-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;}
/* Final CTA as an inset dark card (role + location) */
.fcta--card{background:var(--stk-white);overflow:visible;}
.fcta--card .fcta__card{position:relative;overflow:hidden;background:linear-gradient(160deg,var(--stk-navy-900) 0%,var(--stk-navy-800) 100%);border-radius:28px;padding:72px 56px;box-shadow:0 28px 64px -16px rgba(7,18,36,.55),0 6px 16px rgba(7,18,36,.22);}
.fcta--card .fcta__card::after{content:"";position:absolute;inset:0;border-radius:28px;padding:1px;background:linear-gradient(180deg,rgba(255,255,255,.20),rgba(255,255,255,0) 38%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;z-index:3;}
.fcta--card .fcta__glow{top:-260px;width:560px;height:560px;z-index:1;}
.fcta--card .fcta__inner{position:relative;z-index:2;}
.fcta--grid .fcta__card::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background-image:linear-gradient(rgba(148,197,253,.075) 1px,transparent 1px),linear-gradient(90deg,rgba(148,197,253,.075) 1px,transparent 1px);background-size:46px 46px;-webkit-mask-image:radial-gradient(135% 125% at 50% 44%,transparent 33%,#000 82%);mask-image:radial-gradient(135% 125% at 50% 44%,transparent 33%,#000 82%);}
.fcta__trust{list-style:none;margin:38px 0 0;padding:30px 0 0;border-top:1px solid rgba(255,255,255,.10);display:flex;gap:12px;justify-content:center;flex-wrap:wrap;position:relative;z-index:2;}
.fcta__trust .ct-pill{display:inline-flex;align-items:center;gap:9px;padding:9px 15px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.045);border-radius:var(--stk-r-pill);font-family:var(--stk-body);font-weight:500;font-size:13px;color:rgba(255,255,255,.76);}
.fcta__trust .ct-pill svg{width:16px;height:16px;color:var(--stk-blue-300);flex:none;}
@media (max-width:600px){.fcta--card .fcta__card{padding:48px 24px;border-radius:22px;}.fcta__trust{gap:10px;}}
.stk-evalfa__panel .stk-meter__fill{transition:width .65s cubic-bezier(.4,0,.2,1);}
.stk-page__section.v1 .v1__with{transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;}
.stk-page__section.v1 .v1__with:hover{transform:translateY(-4px);box-shadow:0 18px 44px rgba(15,23,42,.12);border-color:var(--stk-blue-200);}
.stk-page__section.v1 .v1__without{transition:color .2s ease;}
.stk-page__section.v1 .v1__without svg:first-of-type{transition:color .2s ease,transform .2s ease;}
.stk-page__section.v1 .v1__without:hover{color:var(--stk-ink-2);}
.stk-page__section.v1 .v1__without:hover svg:first-of-type{color:var(--stk-error);transform:scale(1.18);}
.stk-hero__proof-link:hover{color:#fff;}
.lf__pt-ic .stk-i-star{color:#fbbf24;}
html.no-js [data-rg] .rev{opacity:1 !important;transform:none !important;}
html.no-js .stk-evalfa__panel{display:block !important;opacity:1 !important;visibility:visible !important;position:relative !important;transform:none !important;margin-bottom:14px;}
html.no-js .stk-evalfa__detail{display:block;}
@media(prefers-reduced-motion:reduce){.stk-evalfa__panel .stk-meter__fill{transition:none;}.stk-page__section.v1 .v1__with{transition:none;}.stk-page__section.v1 .v1__with:hover{transform:none;}.stk-page__section.v1 .v1__without svg:first-of-type{transition:none;}.stk-page__section.v1 .v1__without:hover svg:first-of-type{transform:none;}}
.faq__more a svg{width:15px;height:15px;flex:none;vertical-align:-2px;margin-left:2px;}
.faq__a-inner a svg{width:14px;height:14px;flex:none;vertical-align:-2px;margin-left:2px;}
body.single-stk_role .stk-page__inner{max-width:var(--stk-container-wide);}
body.single-stk_role .stk-evalfa,
body.single-stk_role .s2__grid,
body.single-stk_role .cov__main,
body.single-stk_role .lf__grid,
body.single-stk_role .fork__grid{max-width:var(--stk-container-wide);}
@keyframes stk-hero-float{0%,100%{transform:translate(0,0);}50%{transform:translate(-26px,22px);}}
@keyframes stk-fade{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}

/* ---- Breadcrumb (seated inside the category pillar hero) ------------- */
.stk-crumb{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-family:var(--stk-body,sans-serif);font-size:13px;color:var(--stk-ink-3,#475569);}
.stk-crumb a{color:var(--stk-ink-3,#475569);text-decoration:none;transition:color .15s ease;}
.stk-crumb a:hover{color:var(--stk-blue,#2563eb);}
.stk-crumb__sep{color:var(--stk-blue-300,#93c5fd);}
.stk-crumb__here{color:var(--stk-ink-3,#475569);font-weight:500;}

/* ==========================================================================
   COMPARE MODELS - neutral permanent vs contract table (.stk-cmp)
   Non-gated (shared). No directional cues; two valid choices.
   ========================================================================== */
.stk-cmp { max-width: 920px; margin: 0 auto; }

/* Emphasis toggle: hidden until JS adds .is-interactive, so no-JS users get the
   default-focus table with both columns intact and the control out of the way. */
.stk-cmp__toggle { display: none; }
.stk-cmp.is-interactive .stk-cmp__toggle {
  display: flex;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto 30px;
  gap: 4px;
  padding: 4px;
  background: var(--stk-surface-2);
  border: 1px solid var(--stk-border);
  border-radius: 999px;
}
.stk-cmp__toggle-btn {
  border: 0;
  background: transparent;
  cursor: pointer;
  font-family: var(--stk-display);
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  padding: 8px 22px;
  border-radius: 999px;
  color: var(--stk-ink-3);
  transition: background-color .2s ease, color .2s ease;
}
.stk-cmp__toggle-btn[aria-pressed="true"] { background: var(--stk-blue); color: #fff; box-shadow: 0 2px 8px rgba(37, 99, 235, .25); }
.stk-cmp__toggle-btn:focus-visible { outline: 2px solid var(--stk-blue); outline-offset: 2px; }

/* Rows: airy and gap-separated (no rule lines). The focused value column renders
   as elevated payoff-style cards; the other side stays flat and fully readable. */
.stk-cmp__row {
  display: grid;
  grid-template-columns: 0.82fr 1fr 1fr;
  gap: 16px;
  align-items: center;
  margin-bottom: 11px;
}
.stk-cmp__row--head { margin-bottom: 12px; }
.stk-cmp__h {
  font-family: var(--stk-mono);
  font-size: 11px;
  letter-spacing: .13em;
  text-transform: uppercase;
  color: var(--stk-ink-3);
  transition: color .25s ease;
}
.stk-cmp__h--a,
.stk-cmp__h--b { padding-left: 24px; }
.stk-cmp.is-focus-a .stk-cmp__h--a,
.stk-cmp.is-focus-b .stk-cmp__h--b { color: var(--stk-blue); }
.stk-cmp__attr {
  font-family: var(--stk-display);
  font-weight: 700;
  font-size: 14.5px;
  color: var(--stk-ink);
  line-height: 1.35;
}

/* Value cells reserve the card geometry on both sides, so toggling swaps the
   elevation without reflowing the row. Neutral baseline: readable ink-3. */
.stk-cmp__val {
  position: relative;
  font-size: 14px;
  line-height: 1.5;
  color: var(--stk-ink-3);
  padding: 15px 20px 15px 24px;
  border: 1px solid transparent;
  border-radius: var(--stk-r-card);
  transition: color .25s ease, background-color .25s ease, border-color .25s ease, box-shadow .25s ease;
}
/* Focused value = elevated card with the payoff gradient accent bar. */
.stk-cmp.is-focus-a .stk-cmp__val--a,
.stk-cmp.is-focus-b .stk-cmp__val--b {
  background: #fff;
  border-color: var(--stk-border);
  box-shadow: 0 10px 30px rgba(15, 23, 42, .06);
  color: var(--stk-ink);
  font-weight: 500;
}
.stk-cmp.is-focus-a .stk-cmp__val--a::after,
.stk-cmp.is-focus-b .stk-cmp__val--b::after {
  content: "";
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 4px;
  border-radius: var(--stk-r-card) 0 0 var(--stk-r-card);
  background: linear-gradient(var(--stk-blue), var(--stk-blue-400));
}

/* Blog callout below the table */
.stk-cmp__more { text-align: center; margin: 34px 0 0; }
.stk-cmp__more a {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--stk-blue);
  font-weight: 600;
  font-size: 14.5px;
  text-decoration: none;
  transition: color .2s ease;
}
.stk-cmp__more a:hover { color: var(--stk-blue-hover); text-decoration: underline; }
.stk-cmp__more svg { width: 16px; height: 16px; flex: none; transition: transform .2s ease; }
.stk-cmp__more a:hover svg { transform: translateX(3px); }

@media (max-width: 720px) {
  .stk-cmp__row { grid-template-columns: 1fr; gap: 7px; margin-bottom: 14px; }
  .stk-cmp__row--head { display: none; }
  .stk-cmp__attr { font-size: 15px; margin-bottom: 1px; }
  .stk-cmp__h--a, .stk-cmp__h--b { padding-left: 0; }
  .stk-cmp__val { padding: 13px 18px 13px 22px; }
  .stk-cmp__val::before {
    display: block;
    font-family: var(--stk-mono); font-size: 10px; letter-spacing: .1em;
    text-transform: uppercase; color: var(--stk-muted-2); line-height: 1.6;
  }
  .stk-cmp__val--a::before { content: "Contract"; }
  .stk-cmp__val--b::before { content: "Permanent"; }
  /* With JS the toggle filters to the focused side for a single-column read;
     both values stay in the DOM for SEO, and the redundant label is hidden. */
  .stk-cmp.is-interactive.is-focus-b .stk-cmp__val--a,
  .stk-cmp.is-interactive.is-focus-a .stk-cmp__val--b { display: none; }
  .stk-cmp.is-interactive .stk-cmp__val::before { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .stk-cmp__h, .stk-cmp__val, .stk-cmp__toggle-btn,
  .stk-cmp__more a, .stk-cmp__more svg { transition: none; }
}

/* ==========================================================================
   PROCESS STEPS - upgrade variants (A/B). Non-gated.
   stepper = big editorial numbers connected in sequence.
   cards   = elevated step cards with the gradient accent bar.
   ========================================================================== */

/* --- Variant A: stepper --------------------------------------------------- */
.stk-pflow { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; margin-top: 14px; }
.stk-pflow--4 { grid-template-columns: repeat(4, 1fr); }
.stk-pflow__step { position: relative; padding-top: 6px; }
.stk-pflow__num {
  font-family: var(--stk-display);
  font-weight: 800;
  font-size: 52px;
  line-height: 1;
  letter-spacing: -.03em;
  color: var(--stk-blue);
  font-variant-numeric: tabular-nums;
  margin-bottom: 16px;
}
/* connector thread into the gap (every step but the last), centered on the numeral */
.stk-pflow__step:not(:last-child) .stk-pflow__num::after {
  content: "";
  position: absolute;
  top: 26px;
  left: calc(100% + 10px);
  width: 22px;
  height: 2px;
  background: linear-gradient(90deg, var(--stk-blue-300), rgba(147, 197, 253, 0));
}
.stk-pflow__title { font-family: var(--stk-display); font-weight: 700; font-size: 17px; color: var(--stk-navy-900); line-height: 1.3; margin: 0 0 8px; }
.stk-pflow__desc { font-size: 14.5px; color: var(--stk-ink-2); line-height: 1.6; margin: 0; }

/* --- Variant B: cards ----------------------------------------------------- */
.stk-pcards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 14px; }
.stk-pcards--4 { grid-template-columns: repeat(4, 1fr); }
.stk-pcard {
  position: relative;
  background: #fff;
  border: 1px solid var(--stk-border);
  border-radius: var(--stk-r-card);
  padding: 26px 22px 24px 26px;
  box-shadow: 0 10px 30px rgba(15, 23, 42, .06);
}
.stk-pcard::before {
  content: "";
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 4px;
  border-radius: var(--stk-r-card) 0 0 var(--stk-r-card);
  background: linear-gradient(var(--stk-blue), var(--stk-blue-400));
}
.stk-pcard__num {
  font-family: var(--stk-display);
  font-weight: 800;
  font-size: 34px;
  line-height: 1;
  letter-spacing: -.02em;
  color: var(--stk-blue);
  font-variant-numeric: tabular-nums;
  margin-bottom: 14px;
}
.stk-pcard__title { font-family: var(--stk-display); font-weight: 700; font-size: 16.5px; color: var(--stk-navy-900); line-height: 1.3; margin: 0 0 8px; }
.stk-pcard__desc { font-size: 14px; color: var(--stk-ink-3); line-height: 1.6; margin: 0; }

@media (max-width: 980px) {
  .stk-pflow--4, .stk-pcards--4 { grid-template-columns: repeat(2, 1fr); }
  .stk-pflow__step:not(:last-child) .stk-pflow__num::after { display: none; }
}
@media (max-width: 560px) {
  .stk-pflow, .stk-pflow--4, .stk-pcards, .stk-pcards--4 { grid-template-columns: 1fr; gap: 16px; }
}

/* --- Variant C: pipeline (numbered tiles, connected, consistent hover) ----- */
.stk-ppipe { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 30px; }
.stk-ppipe--4 { grid-template-columns: repeat(4, 1fr); }

.stk-ppipe__step {
  position: relative;
  background: var(--stk-white);
  border: 1px solid var(--stk-border);
  border-radius: var(--stk-r-card);
  padding: 26px 22px 24px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .05);
  transition:
    box-shadow .22s cubic-bezier(.4, 0, .2, 1),
    border-color .22s cubic-bezier(.4, 0, .2, 1);
}
/* Hover: the consistent global card treatment used across approved pages -
   thin blue border + soft blue-tinted shadow (no bespoke flourishes). */
.stk-ppipe__step:hover {
  border-color: var(--stk-blue);
  box-shadow: 0 16px 40px -16px rgba(37, 99, 235, .25);
}

.stk-ppipe__num {
  width: 50px; height: 50px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%;
  background: linear-gradient(180deg, var(--stk-blue), var(--stk-blue-hover));
  color: #fff;
  font-family: var(--stk-display); font-weight: 700; font-size: 17px;
  font-variant-numeric: tabular-nums;
  box-shadow: 0 6px 16px rgba(37, 99, 235, .25);
  margin-bottom: 16px;
}
.stk-ppipe__title { font-family: var(--stk-display); font-weight: 700; font-size: 16.5px; color: var(--stk-navy-900); line-height: 1.3; margin: 0 0 8px; }
.stk-ppipe__desc { font-size: 14px; color: var(--stk-ink-3); line-height: 1.6; margin: 0; }

/* staggered entrance (1-2-3-4), only inside a reveal section */
@keyframes stk-ppipe-in { from { opacity: 0; transform: translateY(24px) scale(.97); } to { opacity: 1; transform: none; } }
[data-rg] .stk-ppipe__step { opacity: 0; }
[data-rg].is-in .stk-ppipe__step { animation: stk-ppipe-in .6s cubic-bezier(.22, .61, .36, 1) forwards; }
[data-rg].is-in .stk-ppipe__step:nth-child(1) { animation-delay: .06s; }
[data-rg].is-in .stk-ppipe__step:nth-child(2) { animation-delay: .18s; }
[data-rg].is-in .stk-ppipe__step:nth-child(3) { animation-delay: .30s; }
[data-rg].is-in .stk-ppipe__step:nth-child(4) { animation-delay: .42s; }

/* progress rail below the tiles: fills dynamically to the hovered step */
.stk-ppipe__rail {
  grid-column: 1 / -1;
  position: relative;
  height: 6px;
  margin: 12px 2px 2px;
  border-radius: 999px;
  background: var(--stk-surface-2);
  overflow: hidden;
}
.stk-ppipe__rail-fill {
  position: absolute;
  inset: 0;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--stk-blue), var(--stk-blue-400));
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform .45s cubic-bezier(.4, 0, .2, 1);
}
/* hover a tile -> fill the bar to that step (tile N => N/4); tracks back and forth */
.stk-ppipe__step:nth-child(1):hover ~ .stk-ppipe__rail .stk-ppipe__rail-fill { transform: scaleX(.25); }
.stk-ppipe__step:nth-child(2):hover ~ .stk-ppipe__rail .stk-ppipe__rail-fill { transform: scaleX(.5); }
.stk-ppipe__step:nth-child(3):hover ~ .stk-ppipe__rail .stk-ppipe__rail-fill { transform: scaleX(.75); }
.stk-ppipe__step:nth-child(4):hover ~ .stk-ppipe__rail .stk-ppipe__rail-fill { transform: scaleX(1); }

@media (max-width: 980px) {
  .stk-ppipe--4 { grid-template-columns: repeat(2, 1fr); }
  .stk-ppipe__rail { display: none; }
}
@media (max-width: 560px) {
  .stk-ppipe, .stk-ppipe--4 { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  [data-rg] .stk-ppipe__step { opacity: 1; }
  .stk-ppipe__step { animation: none !important; }
  .stk-ppipe__rail-fill { transition: none; }
}

/* ==========================================================================
   Consistent card hover for pricing + client-story tiles.
   Matches the How it works tiles and the approved pages (path/case/location):
   thin blue border + soft blue-tinted shadow, replacing the base black-shadow
   hover. Resting state stays the calm base shadow. No lift (reveal locks it).
   ========================================================================== */
.stk-card.stk-card--content:hover,
.stk-card.stk-card--review:hover {
  border-color: var(--stk-blue);
  box-shadow: 0 16px 40px -16px rgba(37, 99, 235, .25);
}


/* Hiring fork (shared partial; relocated from role.css so it styles on any page) */
.fork{background:linear-gradient(180deg,var(--stk-white) 0%,var(--stk-surface-1) 30%,var(--stk-surface-1) 70%,var(--stk-white) 100%);}
.fork__grid{display:grid;grid-template-columns:1fr auto 1fr;align-items:stretch;max-width:1000px;margin:0 auto;}
.fork__card{background:#fff;border:1px solid var(--stk-border);border-radius:var(--stk-r-card);padding:44px 48px;display:flex;flex-direction:column;transition:transform .25s,box-shadow .25s,border-color .25s;}
.fork__card:hover{transform:translateY(-4px);box-shadow:0 18px 44px rgba(15,23,42,.09);border-color:var(--stk-blue-200);}
.fork__ico{width:48px;height:48px;border-radius:var(--stk-r-btn);background:var(--stk-blue-50);color:var(--stk-blue);display:grid;place-items:center;margin-bottom:18px;}
.fork__ico svg{width:24px;height:24px;}
.fork__kicker{font-family:var(--stk-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--stk-blue);margin:0 0 5px;}
.fork__name{font-family:var(--stk-display);font-weight:700;font-size:22px;letter-spacing:-.01em;color:var(--stk-ink);margin:0 0 8px;}
.fork__best{font-size:14.5px;line-height:1.5;color:var(--stk-muted);margin:0 0 24px;}
.fork__best b{color:var(--stk-ink-2);font-weight:600;}
.fork__facts{list-style:none;margin:0 0 28px;padding:0;display:flex;flex-direction:column;gap:13px;}
.fork__fact{display:flex;gap:11px;font-size:14px;line-height:1.5;color:var(--stk-ink-3);}
.fork__fact svg{width:17px;height:17px;color:var(--stk-blue);flex:none;margin-top:2px;}
.fork__cta{margin-top:auto;}
.fork__cta .stk-btn{width:auto;}
.fork__or{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0 26px;}
.fork__or-line{width:1px;flex:1;background:var(--stk-border);}
.fork__or-pill{font-family:var(--stk-mono);font-size:11px;font-weight:600;letter-spacing:.08em;color:var(--stk-muted);background:#fff;border:1px solid var(--stk-border);border-radius:var(--stk-r-pill);width:46px;height:46px;display:grid;place-items:center;margin:16px 0;flex:none;}
.fork__compare{text-align:center;margin-top:38px;}
.fork__compare a{display:inline-flex;align-items:center;gap:8px;font-family:var(--stk-display);font-weight:600;font-size:15px;color:var(--stk-blue);text-decoration:none;transition:gap .2s,color .2s;}
.fork__compare a:hover{gap:12px;color:var(--stk-blue-hover);}
.fork__compare svg{width:16px;height:16px;}
@media(max-width:820px){.fork__grid{grid-template-columns:1fr;gap:14px;}.fork__or{flex-direction:row;padding:6px 0;}.fork__or-line{width:auto;height:1px;flex:1;}.fork__or-pill{margin:0 16px;}}
@media(prefers-reduced-motion:reduce){.fork__card{transition:none;}}


/* Founder/location quote treatment (generalized from location.css; de-scoped + non-gated so it styles identically on any page, including the blue <strong> highlight) */
.stk-locmap__quote{position:relative;z-index:2;text-align:center;max-width:620px;padding:32px 28px;margin:0 auto;}
.stk-locmap__eyebrow{font-family:var(--stk-mono);font-size:var(--stk-pt-micro);letter-spacing:.08em;text-transform:uppercase;color:var(--stk-blue);margin:0 0 18px;}
.stk-locmap__text{font-family:var(--stk-display);font-weight:600;font-size:clamp(1.55rem,2.9vw,2.3rem);line-height:1.36;color:var(--stk-ink);margin:0;}.stk-locmap__text strong{color:var(--stk-blue);font-weight:700;}
.stk-locmap__by{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:24px;}
.stk-locmap__name{font-weight:700;color:var(--stk-blue);font-family:var(--stk-display);}
.stk-locmap__role{font-size:var(--stk-pt-small);color:var(--stk-ink-2);}
@media(max-width:860px){.stk-locmap__quote{padding:28px 22px;}}

/* ============================================================
   Payoff "without -> with" contrast (.v1).  Promoted out of role.css
   so the payoff module renders on any page (e.g. About "Built by
   Canadians"), not just role/location. Class-scoped, inert without
   .v1__grid markup.
   ============================================================ */
.v1__grid{display:grid;grid-template-columns:.82fr 40px 1.4fr;column-gap:24px;row-gap:14px;max-width:980px;margin:0 auto;align-items:center;}
.v1__hw{text-align:right;font-family:var(--stk-mono);font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:var(--stk-muted-2);}
.v1__hmid{}
.v1__hs{font-family:var(--stk-mono);font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:var(--stk-blue);padding-left:24px;}
.v1__without{display:flex;align-items:center;justify-content:flex-end;text-align:right;gap:9px;color:var(--stk-muted);font-size:15px;line-height:1.4;}
.v1__without svg{width:14px;height:14px;color:var(--stk-muted-3);flex:none;}
.v1__arrow{display:grid;place-items:center;color:var(--stk-blue-300);}
.v1__arrow svg{width:18px;height:18px;}
.v1__with{position:relative;background:#fff;border:1px solid var(--stk-border);border-radius:var(--stk-r-card);padding:17px 22px 17px 26px;box-shadow:0 10px 30px rgba(15,23,42,.06);}
.v1__with::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;border-radius:var(--stk-r-card) 0 0 var(--stk-r-card);background:linear-gradient(var(--stk-blue),var(--stk-blue-400));}
.v1__wh{display:flex;align-items:center;gap:10px;font-family:var(--stk-display);font-weight:700;font-size:17px;color:var(--stk-ink);margin:0 0 4px;letter-spacing:-.01em;}
.v1__wh svg{width:18px;height:18px;color:var(--stk-blue);flex:none;}
.v1__wd{font-size:13.5px;line-height:1.55;color:var(--stk-ink-3);margin:0;padding-left:28px;}
@media(max-width:820px){.v1__grid{grid-template-columns:1fr;row-gap:8px;}.v1__hw,.v1__arrow,.v1__without{text-align:left;justify-content:flex-start;}.v1__hw{display:none;}}
