/* =============================================================================
   fsb — /fineshield, Direction B "Split plate" (founder's pick, 2026-09-29).
   Page-scoped (front matter `css: fsb`); replaces fss.css on this page (fss.css is
   left untouched because /css is cached). Every class here is prefixed fsb-, and
   every token lives on .fsb, so nothing leaks into the site nav, footer or site.css.

   Refinement pass over the design folder (Product/FineShield-Page-Design-0929/B):
     · the site's real nav and footer; B's simplified header/footer are gone;
     · one accent (deep ink blue) at most once per section; eyebrows stay grey;
     · the proof panel is split: #record is plain columns, #dashboard puts the two
       screenshots on the soft tinted panel on their own (one focal point each);
     · phone sizes: headlines step down, the hero photo is a square crop, the
       editorial photo a 4:3 crop, the Zoom film crops to FineShield's panel;
     · films: webm + mp4, captions, posters, preload=metadata, play muted in view.
   Behaviour: /js/fsb-0929.js. Without it everything is visible and the films wait
   for play with native controls.
   ========================================================================== */

.fsb{
  /* colour */
  --fsb-bg:#FFFFFF;
  --fsb-ink:#141518;            /* headlines */
  --fsb-text:#3A3C42;           /* body, 10.6:1 on white */
  --fsb-muted:#5E626B;          /* eyebrows, captions, 6.1:1 on white */
  --fsb-accent:#22408C;         /* the one accent, 9.6:1 on white */
  --fsb-band-text:#E4E9F6;      /* body on the accent band, 8.0:1 */
  --fsb-tint:#F1F3F8;           /* soft panel behind product screens */
  --fsb-hair:rgba(0,0,0,.08);
  --fsb-hair-2:rgba(0,0,0,.14);
  --fsb-shadow:0 1px 2px rgba(16,24,40,.04),0 8px 24px rgba(16,24,40,.05);
  /* type */
  --fsb-serif:var(--display);
  --fsb-sans:var(--body);
  --fsb-fs-h1:clamp(42px,5.6vw,80px);
  --fsb-fs-stmt:clamp(36px,5.4vw,78px);
  --fsb-fs-h2:clamp(34px,4.4vw,62px);
  --fsb-fs-h3:clamp(26px,2.5vw,36px);
  --fsb-fs-num:clamp(56px,6vw,92px);
  --fsb-fs-body:clamp(16.5px,1.2vw,18px);
  --fsb-fs-lede:clamp(17.5px,1.4vw,20px);
  --fsb-fs-small:15px;
  --fsb-fs-eyebrow:12.5px;
  --fsb-track-eyebrow:.12em;
  /* space */
  --fsb-gap:clamp(16px,2.2vw,32px);
  --fsb-sec:clamp(72px,10vw,152px);
  --fsb-s2:16px;--fsb-s3:24px;--fsb-s4:32px;--fsb-s5:48px;--fsb-s6:64px;
  --fsb-r-plate:18px;--fsb-r-card:14px;
  /* motion */
  --fsb-rise:12px;--fsb-dur:520ms;--fsb-ease:cubic-bezier(.2,.7,.2,1);

  background:var(--fsb-bg);color:var(--fsb-text);font-size:var(--fsb-fs-body);line-height:1.6;
  overflow-x:clip}
.fsb :is(h1,h2,h3){color:var(--fsb-ink);font-weight:400}
.fsb h1 em,.fsb h2 em{font-style:italic;color:var(--fsb-accent)}
.fsb a:focus-visible,.fsb summary:focus-visible,.fsb video:focus-visible{outline:3px solid var(--fsb-accent);outline-offset:3px}
.fsb [id]{scroll-margin-top:calc(var(--navh) + 16px)}

.wrap.fsb-wrap{max-width:var(--maxw)}  /* the site's column, so the page lines up with the nav */
.fsb-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--fsb-gap)}
.fsb-eyebrow{font-size:var(--fsb-fs-eyebrow);font-weight:600;line-height:1.3;letter-spacing:var(--fsb-track-eyebrow);
  text-transform:uppercase;color:var(--fsb-muted);margin-bottom:var(--fsb-s3)}
.fsb-h2{font-family:var(--fsb-serif);font-size:var(--fsb-fs-h2);line-height:1.06;letter-spacing:-.015em;text-wrap:balance;max-width:18ch}
.fsb-sub{max-width:56ch;margin-top:var(--fsb-s3);color:var(--fsb-text)}
.fsb-sec{padding-block:var(--fsb-sec)}
.fsb-sec-top0{padding-top:0}
.fsb-hair{border-top:1px solid var(--fsb-hair)}
.fsb-head{max-width:760px}
.fsb-cap{margin-top:12px;font-size:13px;line-height:1.45;color:var(--fsb-muted)}

/* ---------- hero ---------- */
.fsb-hero{padding:clamp(28px,3.4vw,48px) 0 var(--fsb-sec)}
.fsb-hero .crumbs{margin-bottom:clamp(28px,3.4vw,44px)}
.fsb-hero-g{align-items:center;row-gap:var(--fsb-s5)}
.fsb-hero-t{grid-column:1 / span 7;max-width:680px}
.fsb-hero-p{grid-column:8 / span 5}
.fsb-h1{font-family:var(--fsb-serif);font-size:var(--fsb-fs-h1);line-height:1.04;letter-spacing:-.02em;text-wrap:balance}
.fsb-lede{margin-top:var(--fsb-s4);font-size:var(--fsb-fs-lede);line-height:1.6;max-width:60ch}
.fsb-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:var(--fsb-s4)}
.fsb-chips li{font-size:14px;font-weight:500;line-height:1;color:var(--fsb-ink);padding:9px 14px;border:1px solid var(--fsb-hair-2);border-radius:999px;background:#fff}
.cta-row.fsb-cta{margin-top:40px}

/* ---------- 0930: the moment, rendered — a chat message card (hero: as sent; #turn: held) ---------- */
.fsb-chat{background:#fff;border:1px solid var(--fsb-hair-2);border-radius:var(--fsb-r-card);box-shadow:var(--fsb-shadow);
  padding:0 0 4px;font-size:15.5px;line-height:1.5;color:var(--fsb-ink);overflow:hidden}
.fsb-chat-h{display:flex;justify-content:space-between;gap:12px;padding:12px 18px;border-bottom:1px solid var(--fsb-hair);
  font-size:13px;color:var(--fsb-muted)}
.fsb-chat-ch{font-weight:600;color:var(--fsb-ink)}
.fsb-chat-m{display:grid;grid-template-columns:36px minmax(0,1fr);column-gap:12px;padding:14px 18px 6px}
.fsb-chat-a{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:8px;
  background:#D9DEEA;color:var(--fsb-accent);font-size:13px;font-weight:600;letter-spacing:.02em}
.fsb-chat-a2{background:#E7E1D4;color:#5B4A2B}
.fsb-chat-b p{margin:0}
.fsb-chat-b p + p{margin-top:6px}
.fsb-chat-n{font-weight:600}
.fsb-chat-n span{margin-left:8px;font-weight:400;font-size:12.5px;color:var(--fsb-muted)}
.fsb-chat-l{margin:6px 0 0;padding-left:22px}
.fsb-chat-l li + li{margin-top:2px}
.fsb-chat-f{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:10px;padding:12px 18px 10px;
  border-top:1px solid var(--fsb-hair);font-size:13px;color:var(--fsb-muted)}
.fsb-chat-sent{font-weight:600;color:var(--fsb-ink)}
.fsb-chat-x{background:linear-gradient(transparent 55%,#F6DCDC 55%);box-shadow:inset 0 -1.5px 0 #C0392B}
/* held */
.fsb-hold{padding-bottom:0}
.fsb-hold-bar{display:flex;align-items:center;gap:8px;padding:10px 18px;background:var(--fsb-accent);color:#fff;font-size:13px;font-weight:600}
.fsb-hold-bar svg{width:16px;height:16px;flex:none}
.fsb-hold-bar span{margin-left:auto;font-weight:400;opacity:.85}
.fsb-hold-why{display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px 14px;margin:12px 18px 0;padding:12px 14px;
  background:var(--fsb-tint);border-radius:10px;font-size:14px}
.fsb-hold-why dt{font-weight:600;color:var(--fsb-muted)}
.fsb-hold-why dd{margin:0}
.fsb-hold-alt{margin:12px 18px 0;padding:12px 14px;border:1px solid var(--fsb-hair-2);border-radius:10px;font-size:14.5px}
.fsb-hold-alt b,.fsb-flag-s b{display:block;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--fsb-muted);margin-bottom:4px}
.fsb-hold-acts{display:flex;flex-wrap:wrap;gap:8px;padding:14px 18px 16px}
.fsb-hold-acts span{font-size:13.5px;font-weight:500;padding:8px 12px;border-radius:8px;border:1px solid var(--fsb-hair-2);color:var(--fsb-ink)}
.fsb-hold-acts span:first-child{background:var(--fsb-accent);border-color:var(--fsb-accent);color:#fff}

/* ---------- 0930: split sections (text 5 · media 6) ---------- */
.fsb-split{align-items:start;row-gap:var(--fsb-s5)}
.fsb-split-t{grid-column:1 / span 5}
.fsb-split-m{grid-column:7 / span 6}
.fsb-split-rev .fsb-split-t{grid-column:8 / span 5;grid-row:1}
.fsb-split-rev .fsb-split-m{grid-column:1 / span 6;grid-row:1}
.fsb-split-t .fsb-chips{margin-top:var(--fsb-s4)}
.fsb-split-t .cta-row.fsb-cta{margin-top:var(--fsb-s4)}

/* the claim letter */
.fsb-quote{margin:0;padding:clamp(24px,3vw,40px);background:var(--fsb-tint);border-radius:var(--fsb-r-card)}
.fsb-quote p{margin:0;font-family:var(--fsb-serif);font-size:clamp(21px,1.9vw,26px);line-height:1.35;color:var(--fsb-ink);text-wrap:pretty}
.fsb-quote cite{display:block;margin-top:var(--fsb-s3);font-style:normal;font-size:var(--fsb-fs-small);color:var(--fsb-muted)}

/* figures with a source */
.fsb-figs{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--fsb-gap);margin-top:clamp(48px,5vw,72px)}
.fsb-figs-1{grid-template-columns:minmax(0,1fr);max-width:760px}
.fsb-figs li{padding-top:var(--fsb-s3);border-top:1px solid var(--fsb-hair-2)}
.fsb-fig-n{display:block;font-family:var(--fsb-serif);font-size:clamp(34px,3.6vw,52px);line-height:1;letter-spacing:-.02em;color:var(--fsb-ink)}
.fsb-figs p{margin-top:12px;font-size:16px;max-width:44ch}
.fsb-src{margin-top:var(--fsb-s4);font-size:13px;line-height:1.5;color:var(--fsb-muted);max-width:90ch}
.fsb-src a{color:inherit;text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--fsb-hair-2)}
.fsb-src a:hover{color:var(--fsb-ink)}

/* the scale: three large numbers */
.fsb-big{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--fsb-gap);margin-top:clamp(48px,5vw,80px)}
.fsb-big li{padding-top:var(--fsb-s3);border-top:1px solid var(--fsb-hair-2)}
.fsb-big-n{display:block;font-family:var(--fsb-serif);font-size:var(--fsb-fs-num);line-height:.95;letter-spacing:-.03em;color:var(--fsb-ink)}
.fsb-big-l{display:block;margin-top:12px;font-size:15px;color:var(--fsb-text);max-width:26ch}

/* the pattern: six lines */
.fsb-six{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--fsb-s3) var(--fsb-s5);margin-top:clamp(40px,5vw,72px)}
.fsb-six li{display:grid;grid-template-columns:40px minmax(0,1fr);column-gap:14px;padding-top:var(--fsb-s3);border-top:1px solid var(--fsb-hair-2)}
.fsb-six-i{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:10px;background:var(--fsb-tint);color:var(--fsb-accent)}
.fsb-six-i svg{width:22px;height:22px}
.fsb-six-k{display:block;font-size:var(--fsb-fs-eyebrow);font-weight:600;letter-spacing:var(--fsb-track-eyebrow);text-transform:uppercase;color:var(--fsb-muted)}
.fsb-six p{margin-top:4px;color:var(--fsb-ink)}
.fsb-stake-w{margin-top:clamp(40px,4vw,56px);max-width:62ch;font-family:var(--fsb-serif);font-size:clamp(21px,1.9vw,26px);line-height:1.35}

/* the gap: five lines */
.fsb-gap{margin:0}
.fsb-gap div{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.6fr);column-gap:var(--fsb-s3);padding:16px 0;border-top:1px solid var(--fsb-hair-2)}
.fsb-gap div:last-child{border-bottom:1px solid var(--fsb-hair-2)}
.fsb-gap dt{font-weight:600;color:var(--fsb-ink)}
.fsb-gap dd{margin:0;font-size:16px}

/* the product: eight facts + the flag */
.fsb-prod-g{align-items:start;row-gap:var(--fsb-s5);margin-top:clamp(40px,5vw,72px)}
.fsb-facts{grid-column:1 / span 7;margin:0}
.fsb-facts div{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.8fr);column-gap:var(--fsb-s3);padding:16px 0;border-top:1px solid var(--fsb-hair-2)}
.fsb-facts div:last-child{border-bottom:1px solid var(--fsb-hair-2)}
.fsb-facts dt{font-weight:600;color:var(--fsb-ink)}
.fsb-facts dd{margin:0;font-size:16px}
.fsb-flag{grid-column:9 / span 4;position:sticky;top:calc(var(--navh) + 24px)}
.fsb-flag-c{background:#fff;border:1px solid var(--fsb-hair-2);border-radius:var(--fsb-r-card);box-shadow:var(--fsb-shadow);padding:18px 20px 20px;font-size:15px;line-height:1.5;color:var(--fsb-ink)}
.fsb-flag-k{font-size:var(--fsb-fs-eyebrow);font-weight:600;letter-spacing:var(--fsb-track-eyebrow);text-transform:uppercase;color:var(--fsb-muted)}
.fsb-flag-d{margin-top:12px}
.fsb-flag-w{margin-top:12px;padding:12px 14px;background:var(--fsb-tint);border-radius:10px;font-size:14.5px}
.fsb-flag-s{margin-top:12px;padding:12px 14px;border:1px solid var(--fsb-hair-2);border-radius:10px;font-size:14.5px}

/* commitments · measures ---------- */
.fsb-commits{list-style:none;margin:0}
.fsb-commits li{display:grid;grid-template-columns:44px minmax(0,1fr);column-gap:var(--fsb-s2);padding:18px 0;border-top:1px solid var(--fsb-hair-2)}
.fsb-commits li:last-child{border-bottom:1px solid var(--fsb-hair-2)}
.fsb-num-s{font-family:var(--fsb-serif);font-size:30px;line-height:1;color:var(--fsb-accent);letter-spacing:-.02em}
.fsb-commits h3{font-family:var(--fsb-sans);font-size:17px;font-weight:600;line-height:1.3}
.fsb-commits p{margin-top:4px;font-size:16px}
.fsb-measures{list-style:none;margin:0}
.fsb-measures li{padding:16px 0;border-top:1px solid var(--fsb-hair-2);font-family:var(--fsb-serif);font-size:clamp(20px,1.7vw,24px);line-height:1.3;color:var(--fsb-ink)}
.fsb-measures li:last-child{border-bottom:1px solid var(--fsb-hair-2)}

/* the objection */
.fsb-obj{max-width:820px}
.fsb-obj-h{max-width:22ch}

/* sources */
.fsb-sources{padding:0 0 var(--fsb-sec)}
.fsb-src-h{font-family:var(--fsb-sans);font-size:var(--fsb-fs-eyebrow);font-weight:600;letter-spacing:var(--fsb-track-eyebrow);text-transform:uppercase;color:var(--fsb-muted);
  padding-top:var(--fsb-s4);border-top:1px solid var(--fsb-hair)}
.fsb-src-l{margin:var(--fsb-s3) 0 0;padding-left:1.4em;font-size:13.5px;line-height:1.55;color:var(--fsb-muted);max-width:90ch}
.fsb-src-l li + li{margin-top:6px}
.fsb-src-l a{color:var(--fsb-text);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--fsb-hair-2)}
.fsb-src-l a:hover{color:var(--fsb-ink)}

/* ---------- statement + films ---------- */
.fsb-films{padding-bottom:var(--fsb-sec)}
.fsb-statement{text-align:center;max-width:1040px;margin:0 auto;padding-top:var(--fsb-sec);border-top:1px solid var(--fsb-hair)}
.fsb-statement .fsb-eyebrow{margin-bottom:var(--fsb-s4)}
.fsb-stmt-h{font-family:var(--fsb-serif);font-size:var(--fsb-fs-stmt);line-height:1.05;letter-spacing:-.02em;text-wrap:balance;margin-inline:auto}
.fsb-statement .fsb-sub{margin:var(--fsb-s4) auto 0;max-width:52ch}
.fsb-draw{background-image:linear-gradient(var(--fsb-accent),var(--fsb-accent));background-repeat:no-repeat;
  background-position:0 92%;background-size:100% 2px;padding-bottom:.04em}
.fsb-anim .fsb-draw{background-size:0% 2px;transition:background-size 900ms var(--fsb-ease) 250ms}
.fsb-anim .fsb-in .fsb-draw{background-size:100% 2px}
.fsb-jump{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 28px;margin-top:var(--fsb-s5)}
.fsb-jump a{display:inline-flex;align-items:center;min-height:44px;font-size:15px;font-weight:500;color:var(--fsb-ink);
  text-decoration:none;border-bottom:1px solid var(--fsb-hair-2)}
.fsb-jump a:hover{border-color:var(--fsb-ink)}

.fsb-film{padding-top:clamp(72px,9vw,136px)}
.fsb-film-g{align-items:center;row-gap:var(--fsb-s4)}
.fsb-film-v{grid-column:1 / span 7;grid-row:1}
.fsb-film-t{grid-column:9 / span 4;grid-row:1}
.fsb-flip .fsb-film-v{grid-column:6 / span 7}
.fsb-flip .fsb-film-t{grid-column:1 / span 4}
.fsb-tall .fsb-film-v{grid-column:8 / span 4}
.fsb-tall .fsb-film-t{grid-column:2 / span 5}
.fsb-screen{position:relative;overflow:hidden;border-radius:var(--fsb-r-card);background:#0d0f14;box-shadow:var(--fsb-shadow);border:1px solid var(--fsb-hair)}
.fsb-screen video{display:block;width:100%;height:auto}
.fsb-screen-zoom{background:#E4E6E5}
.fsb-screen-room{background:#F3F2EF}
.fsb-film-k{font-size:var(--fsb-fs-eyebrow);font-weight:600;line-height:1.3;letter-spacing:var(--fsb-track-eyebrow);text-transform:uppercase;color:var(--fsb-muted);margin-bottom:var(--fsb-s2)}
.fsb-film-h{font-family:var(--fsb-serif);font-size:var(--fsb-fs-h3);line-height:1.12;letter-spacing:-.01em;text-wrap:balance}
.fsb-film-p{margin-top:var(--fsb-s3)}
.fsb-stake{margin-top:var(--fsb-s3);padding-left:var(--fsb-s2);border-left:1px solid var(--fsb-hair-2);color:var(--fsb-ink)}
.fsb-fine{margin-top:clamp(56px,7vw,96px);text-align:center;font-size:var(--fsb-fs-small);color:var(--fsb-muted)}

/* ---------- how: four steps ---------- */
.fsb-steps{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--fsb-gap);margin-top:clamp(56px,6vw,88px)}
.fsb-steps li{padding-top:var(--fsb-s3);border-top:1px solid var(--fsb-hair-2)}
.fsb-step-top{display:flex;align-items:flex-start;justify-content:space-between}
.fsb-num{font-family:var(--fsb-serif);font-size:var(--fsb-fs-num);line-height:.9;color:var(--fsb-ink);letter-spacing:-.03em}
.fsb-ico{width:28px;height:28px;color:var(--fsb-muted);flex:none;margin-top:6px}
.fsb-steps h3{margin-top:var(--fsb-s3);font-family:var(--fsb-sans);font-size:13px;font-weight:600;line-height:1.3;letter-spacing:var(--fsb-track-eyebrow);text-transform:uppercase}
.fsb-steps p{margin-top:8px;font-size:16.5px}

/* ---------- editorial photograph ---------- */
.fsb-edit{padding-bottom:var(--fsb-sec)}
.fsb-edit img{display:block;width:100%;height:auto;aspect-ratio:1952 / 608;object-fit:cover;border-radius:var(--fsb-r-plate)}

/* ---------- dashboard on the tinted panel ---------- */
.fsb-panel{margin-top:clamp(48px,5vw,80px);background:var(--fsb-tint);border-radius:clamp(16px,2vw,24px);
  padding:clamp(20px,5vw,80px) clamp(16px,5vw,80px) clamp(24px,4vw,56px)}
.fsb-shot + .fsb-shot{margin-top:clamp(40px,5vw,72px)}
.fsb-shot img{display:block;width:100%;height:auto;aspect-ratio:16 / 9;border-radius:12px;border:1px solid var(--fsb-hair);box-shadow:var(--fsb-shadow);background:#fff}
.fsb-shot figcaption{margin-top:14px;font-size:var(--fsb-fs-small);line-height:1.55;color:var(--fsb-text);max-width:70ch}
.fsb-shot-note{margin-top:var(--fsb-s4);font-size:13px;color:var(--fsb-muted)}

/* ---------- FAQ ---------- */
.fsb-faq-g{align-items:start;row-gap:var(--fsb-s5)}
.fsb-faq-h{grid-column:1 / span 4}
.fsb-faq{grid-column:6 / span 7;border-top:1px solid var(--fsb-hair-2)}
.fsb-faq details{border-bottom:1px solid var(--fsb-hair-2)}
.fsb-faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:var(--fsb-s3);padding:24px 0;
  font-family:var(--fsb-serif);font-size:clamp(21px,1.8vw,25px);line-height:1.3;color:var(--fsb-ink)}
.fsb-faq summary::-webkit-details-marker{display:none}
.fsb-faq summary::after{content:"";flex:none;width:14px;height:14px;margin-top:7px;
  background:linear-gradient(var(--fsb-ink),var(--fsb-ink)) center / 14px 1.5px no-repeat,linear-gradient(var(--fsb-ink),var(--fsb-ink)) center / 1.5px 14px no-repeat;
  transition:transform .25s}
.fsb-faq details[open] summary::after{transform:rotate(45deg)}
.fsb-faq details p{padding:0 0 28px;max-width:62ch}

/* ---------- CTA band ---------- */
.fsb-close{padding-bottom:var(--fsb-sec)}
.fsb-band{background:var(--fsb-accent);border-radius:clamp(16px,2vw,24px);padding:clamp(56px,8vw,128px) clamp(24px,6vw,96px);text-align:left}
.fsb .fsb-band-h{color:#fff;font-family:var(--fsb-serif);font-size:var(--fsb-fs-h2);line-height:1.06;letter-spacing:-.015em}
.fsb .fsb-band-h em{color:#fff}
.fsb-band-p{margin:var(--fsb-s4) 0 0;max-width:60ch;color:var(--fsb-band-text)}
.cta-row.fsb-band-cta{justify-content:flex-start;margin-top:var(--fsb-s5)}
.fsb-band .btn-light{background:#fff;color:var(--fsb-accent)}
.fsb-band .btn-light:hover{background:#EEF1F9}
.fsb-band .btn-out-dark{border-color:rgba(255,255,255,.6);color:#fff}
.fsb-band .btn-out-dark:hover{border-color:#fff;background:rgba(255,255,255,.08)}
.fsb .fsb-band a:focus-visible{outline-color:#fff}

/* ---------- motion: fade + rise; only below-the-fold items, only with JS ---------- */
.fsb-anim .fsb-rv:not(.fsb-in){opacity:0;transform:translateY(var(--fsb-rise))}
.fsb-anim .fsb-rv{transition:opacity var(--fsb-dur) var(--fsb-ease),transform var(--fsb-dur) var(--fsb-ease)}

/* ---------- tablet ---------- */
@media (max-width:1000px){
  .fsb-steps{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:var(--fsb-s6)}
}
@media (max-width:900px){
  .fsb-hero-t,.fsb-hero-p,.fsb-faq-h,.fsb-faq,
  .fsb-film-v,.fsb-film-t,.fsb-flip .fsb-film-v,.fsb-flip .fsb-film-t,.fsb-tall .fsb-film-v,.fsb-tall .fsb-film-t{grid-column:1 / -1;grid-row:auto}
  .fsb-hero-p{max-width:560px}
  .fsb-tall .fsb-film-v{max-width:420px}
  .fsb-split-t,.fsb-split-m,.fsb-split-rev .fsb-split-t,.fsb-split-rev .fsb-split-m,.fsb-facts,.fsb-flag{grid-column:1 / -1;grid-row:auto}
  .fsb-split-m{max-width:640px}
  .fsb-flag{position:static;max-width:520px}
  .fsb-big{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--fsb-s3)}
  .fsb-big-n{font-size:clamp(40px,7vw,64px)}
}

/* ---------- phone ---------- */
@media (max-width:700px){
  .fsb-edit img{aspect-ratio:4 / 3}
  .fsb-statement,.fsb-fine{text-align:left}
  .fsb-statement .fsb-sub,.fsb-stmt-h{margin-left:0}
  .fsb-jump{justify-content:flex-start;gap:0 22px}
  .cta-row.fsb-cta{margin-top:32px}
  .fsb-film-h{font-size:28px}
  /* the Zoom film on a phone: crop to FineShield's panel; the script moves the crop to the recap and the email */
  .fsb-screen-zoom video{aspect-ratio:580 / 1000;height:auto;object-fit:cover;object-position:94.1% 50%;transition:object-position .6s ease}
  .fsb-screen-zoom[data-frame="recap"] video{object-position:34% 50%}
  .fsb-screen-zoom[data-frame="email"] video{object-position:46.5% 50%}
}
@media (max-width:700px){
  .fsb-figs,.fsb-six{grid-template-columns:minmax(0,1fr)}
  .fsb-big{grid-template-columns:minmax(0,1fr);row-gap:var(--fsb-s4)}
  .fsb-gap div,.fsb-facts div{grid-template-columns:minmax(0,1fr);row-gap:4px}
  .fsb-chat-m,.fsb-hold-why,.fsb-hold-alt,.fsb-hold-acts,.fsb-chat-h,.fsb-chat-f,.fsb-hold-bar{padding-left:14px;padding-right:14px}
  .fsb-hold-why,.fsb-hold-alt{margin-left:14px;margin-right:14px;padding-left:12px;padding-right:12px}
  .fsb-quote p{font-size:19px}
  .fsb-stake-w{font-size:20px}
}
@media (max-width:560px){
  .fsb-steps{grid-template-columns:minmax(0,1fr);row-gap:var(--fsb-s5)}
  .fsb-steps li{display:grid;grid-template-columns:64px minmax(0,1fr);column-gap:12px}
  .fsb-step-top{grid-row:1 / span 2}
  .fsb-step-top .fsb-ico{display:none}
  .fsb-num{font-size:52px}
  .fsb-steps h3{margin-top:4px}
  .fsb-faq summary{padding:20px 0}
}

@media (prefers-reduced-motion:reduce){
  .fsb-anim .fsb-rv:not(.fsb-in){opacity:1;transform:none}
  .fsb-anim .fsb-rv{transition:none}
  .fsb-anim .fsb-draw{background-size:100% 2px;transition:none}
  .fsb-faq summary::after,.fsb-screen-zoom video{transition:none}
}