/* ═══════════════════════════════════════════════════════════════════
   FMH 2.0 · production design system
   Concept D, Fix It Properly. One signature: the measured line.
   FRAUNCES IS THE VOICE. INTER TIGHT IS THE INTERFACE.
   Scope: fmh2 pages only. Legacy pages keep their own styles until
   their migration phase; nothing here is injected globally.
   ═══════════════════════════════════════════════════════════════════ */

:root{
  /* colour tokens: the only colour values fmh2 templates may use */
  --fmh2-yellow:#F4DC32;
  --fmh2-ink:#0A0A0A;
  --fmh2-paper:#FAF8F2;
  --fmh2-bone:#F1EEE6;
  --fmh2-graphite:#2A2926;
  --fmh2-mid:#6B675E;
  --fmh2-paper-70:rgba(250,248,242,.7);
  --fmh2-paper-52:rgba(250,248,242,.52);
  --fmh2-line:rgba(10,10,10,.14);
  --fmh2-line-soft:rgba(10,10,10,.08);
  --fmh2-inkline:rgba(250,248,242,.16);
  --fmh2-inkline-soft:rgba(250,248,242,.09);

  /* type */
  --fmh2-serif:"Fraunces",Georgia,serif;
  --fmh2-sans:"Inter Tight",system-ui,-apple-system,sans-serif;

  /* spacing scale: 8pt rhythm, named steps only */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px;
  --sp-6:32px; --sp-7:48px; --sp-8:64px; --sp-9:96px; --sp-10:128px;

  /* layout */
  --fmh2-gutter:24px;
  --fmh2-rail-x:11px;
  --fmh2-radius:0px;          /* restraint: square by default */
  --fmh2-radius-pill:999px;   /* reserved for the CTA arrow chip only */
}

/* ── base ── */
.fmh2, .fmh2 *, .fmh2 *::before, .fmh2 *::after{margin:0;padding:0;box-sizing:border-box}
html.fmh2-root{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html.fmh2-root{scroll-behavior:auto}}
body.fmh2{
  background:var(--fmh2-paper);
  color:var(--fmh2-ink);
  font-family:var(--fmh2-sans);
  font-size:16.5px;
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
.fmh2 img,.fmh2 video{max-width:100%;display:block}
:where(.fmh2 a){color:inherit}
.fmh2 button{font:inherit;background:none;border:0;cursor:pointer}
:where(.fmh2 button){color:inherit}
.fmh2 ::selection{background:var(--fmh2-yellow);color:var(--fmh2-ink)}
.fmh2 a:focus-visible,.fmh2 button:focus-visible,.fmh2 input:focus-visible,.fmh2 summary:focus-visible{outline:2.5px solid var(--fmh2-ink);outline-offset:3px}
.fmh2 .on-ink a:focus-visible,.fmh2 .on-ink button:focus-visible,.fmh2 .on-ink input:focus-visible{outline-color:var(--fmh2-yellow)}

/* ── typography ─ Fraunces is the voice ── */
.f2-display{font-family:var(--fmh2-serif);font-variation-settings:"opsz" 144,"SOFT" 0,"WONK" 0;font-weight:470;letter-spacing:-.02em;line-height:1.0}
.f2-display em{font-style:italic;font-weight:530}
.f2-d1{font-size:clamp(42px,11.8vw,56px)}
.f2-d2{font-size:clamp(31px,8.6vw,42px);line-height:1.02;margin-bottom:var(--sp-4)}
/* Smallest handsets: .f2-hl headlines are white-space:nowrap so the yellow
   sweep stays on one line, and the 31px clamp floor exceeds what a 320px
   viewport can fit, pushing the whole document wider than the screen
   (/pricing and /dr-hisham-band both overflowed there). Let the scale keep
   tracking down rather than bottoming out above the available width. */
@media (max-width:380px){.f2-d1{font-size:clamp(30px,10.4vw,42px)}.f2-d2{font-size:clamp(23px,7.3vw,31px)}}
.f2-d3{font-family:var(--fmh2-serif);font-variation-settings:"opsz" 60,"SOFT" 0,"WONK" 0;font-weight:560;font-size:21px;letter-spacing:-.01em}
.f2-quote{font-family:var(--fmh2-serif);font-style:italic;font-variation-settings:"opsz" 60,"SOFT" 0,"WONK" 0;font-weight:460}
.f2-price{font-family:var(--fmh2-serif);font-variation-settings:"opsz" 144,"SOFT" 0,"WONK" 0;font-weight:560;letter-spacing:-.03em;line-height:.92;font-variant-numeric:lining-nums}
/* Inter Tight is the interface */
.f2-kick{display:flex;align-items:center;gap:10px;font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--fmh2-mid);margin-bottom:var(--sp-5)}
.f2-kick .no{font-variant-numeric:tabular-nums;color:var(--fmh2-ink)}
.f2-kick::after{content:"";height:1px;background:var(--fmh2-line);flex:1}
.on-ink .f2-kick{color:var(--fmh2-paper-52)}
.on-ink .f2-kick .no{color:var(--fmh2-paper)}
.on-ink .f2-kick::after{background:var(--fmh2-inkline)}
.f2-lede{color:var(--fmh2-graphite);font-size:17px;line-height:1.62;max-width:34em}
.on-ink .f2-lede{color:var(--fmh2-paper-70)}
.f2-small{font-size:13px;color:var(--fmh2-mid);line-height:1.6}
.f2-hl{position:relative;display:inline-block;z-index:0;white-space:nowrap}
.f2-hl::before{content:"";position:absolute;z-index:-1;left:-.1em;right:-.1em;top:.16em;bottom:.03em;background:var(--fmh2-yellow);transform:skew(-6deg,-.6deg) scaleX(0);transform-origin:left center;transition:transform .55s cubic-bezier(.65,0,.25,1) .3s}
.js .f2-rv.in .f2-hl::before,.f2-hl.on::before{transform:skew(-6deg,-.6deg) scaleX(1)}
html:not(.js) .f2-hl::before{transform:skew(-6deg,-.6deg) scaleX(1)}
@media (prefers-reduced-motion:reduce){.f2-hl::before{transform:skew(-6deg,-.6deg) scaleX(1);transition:none}}

/* ── THE MEASURED LINE · system primitive ─────────────────────────
   Approved jobs: measurement · progress · comparison · timeline ·
   orientation · precise annotation · termination.
   Before rendering one, answer: WHAT IS THIS LINE MEASURING?
   If nothing, do not render it. Never decorative. ─────────────── */
.m-line{position:relative;height:1.5px;background:var(--fmh2-yellow)}
.m-line .tick{position:absolute;top:-3.5px;width:1.5px;height:9px;background:var(--fmh2-yellow)}
.m-line--draw{transform:scaleX(0);transform-origin:left;transition:transform .9s cubic-bezier(.4,0,.2,1) .2s}
.js .f2-rv.in .m-line--draw,html:not(.js) .m-line--draw{transform:scaleX(1)}
@media (prefers-reduced-motion:reduce){.m-line--draw{transform:scaleX(1);transition:none}}
/* progress role: the scroll rail */
.m-rail{position:fixed;top:0;bottom:0;left:var(--fmh2-rail-x);width:1px;background:var(--fmh2-line-soft);z-index:40;pointer-events:none}
.m-rail .fill{position:absolute;top:0;left:0;width:100%;height:0%;background:var(--fmh2-yellow)}
.m-rail .tick{position:absolute;left:-3px;width:7px;height:1px;background:var(--fmh2-line)}
/* annotation role: measured image overlay */
.m-measure{position:absolute;left:0;right:0;height:1.5px;background:var(--fmh2-yellow);box-shadow:0 1px 0 rgba(10,10,10,.22);z-index:2}
.m-measure i{position:absolute;top:-3.5px;width:1.5px;height:9px;background:var(--fmh2-yellow)}
.m-measure .tag{position:absolute;right:14px;top:-30px;font-size:12px;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:#fff;background:rgba(10,10,10,.72);padding:5px 9px}
/* termination role: the yellow full stop */
.m-stop{color:var(--fmh2-yellow)}

/* ── CTA system ── */
.f2-cta{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%;min-height:60px;padding:0 8px 0 20px;background:var(--fmh2-ink);color:var(--fmh2-paper);text-decoration:none;font-weight:600;font-size:16px;letter-spacing:-.01em;transition:transform .12s;border-radius:var(--fmh2-radius)}
.f2-cta:active{transform:scale(.985)}
.f2-cta .arr{width:44px;height:44px;border-radius:var(--fmh2-radius-pill);background:var(--fmh2-yellow);color:var(--fmh2-ink);display:grid;place-items:center;flex:none}
.f2-cta .arr svg{width:16px;height:16px}
.f2-cta--ghost{background:transparent;color:var(--fmh2-ink);border:1.5px solid var(--fmh2-ink)}
.f2-cta--ghost .arr{background:var(--fmh2-ink);color:var(--fmh2-paper)}
.f2-cta--yellow{background:var(--fmh2-yellow);color:var(--fmh2-ink)}
.f2-cta--yellow .arr{background:var(--fmh2-ink);color:var(--fmh2-yellow)}
.f2-cta-stack{display:flex;flex-direction:column;gap:var(--sp-3);max-width:420px}
.f2-cta-note{display:flex;align-items:center;gap:8px;margin-top:var(--sp-4);font-size:12.5px;color:var(--fmh2-mid)}
.f2-cta-note .dot{width:5px;height:5px;border-radius:50%;background:var(--fmh2-yellow);outline:1px solid var(--fmh2-line)}

/* sticky assessment bar: arms after the hero, retires before the close */
.f2-sticky{position:fixed;left:0;right:0;bottom:0;z-index:50;padding:10px var(--fmh2-gutter) calc(10px + env(safe-area-inset-bottom));background:rgba(250,248,242,.94);border-top:1px solid var(--fmh2-line);transform:translateY(110%);transition:transform .35s cubic-bezier(.7,0,.2,1)}
.f2-sticky.show{transform:translateY(0)}
.f2-sticky .f2-cta{min-height:54px}
@media (prefers-reduced-motion:reduce){.f2-sticky{transition:none}}

/* ── header + mobile drawer ── */
.f2-hd{position:fixed;top:0;left:0;right:0;z-index:60;display:flex;align-items:center;justify-content:space-between;padding:14px var(--fmh2-gutter) 12px;transition:background .3s,border-color .3s;border-bottom:1px solid transparent}
.f2-hd.on{background:var(--fmh2-paper);border-bottom-color:var(--fmh2-line-soft)}
.f2-wm{font-weight:750;font-size:15px;line-height:1.02;letter-spacing:-.02em;text-decoration:none;display:inline-block;padding:7px 8px;margin:-7px -8px}
.f2-wm sup{font-size:6px;vertical-align:top;font-weight:500}
.f2-hd-menu{display:flex;align-items:center;gap:8px;min-height:44px;min-width:44px;justify-content:flex-end;font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.f2-hd-menu .tick{width:14px;height:1.5px;background:var(--fmh2-ink);position:relative}
.f2-hd-menu .tick::after{content:"";position:absolute;top:5px;left:0;width:9px;height:1.5px;background:var(--fmh2-ink)}
.f2-drawer{position:fixed;inset:0;background:var(--fmh2-ink);color:var(--fmh2-paper);z-index:80;display:flex;flex-direction:column;padding:20px var(--fmh2-gutter) 34px;transform:translateY(-102%);transition:transform .5s cubic-bezier(.7,0,.2,1);visibility:hidden}
.f2-drawer.open{transform:translateY(0);visibility:visible}
@media (prefers-reduced-motion:reduce){.f2-drawer{transition:none}}
.f2-drawer-top{display:flex;justify-content:space-between;align-items:center}
.f2-drawer-top .f2-wm{color:var(--fmh2-yellow)}
.f2-drawer-close{font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;min-height:44px;min-width:44px;text-align:right}
.f2-drawer-list{list-style:none;margin-top:9vh;flex:1}
.f2-drawer-list a{display:flex;align-items:baseline;gap:14px;text-decoration:none;font-family:var(--fmh2-serif);font-variation-settings:"opsz" 90,"SOFT" 0,"WONK" 0;font-weight:520;font-size:clamp(29px,8.4vw,38px);letter-spacing:-.02em;line-height:1.34;padding:6px 0}
.f2-drawer-list .no{font-family:var(--fmh2-sans);font-size:12px;font-weight:500;letter-spacing:.12em;color:var(--fmh2-paper-52);font-variant-numeric:tabular-nums}
.f2-drawer-list a .mln{width:0;height:2px;background:var(--fmh2-yellow);transition:width .25s;align-self:center}
.f2-drawer-list a:hover .mln,.f2-drawer-list a[aria-current] .mln{width:26px}
.f2-drawer-foot{font-size:13px;color:var(--fmh2-paper-70);line-height:1.8}
.f2-drawer-foot a{color:var(--fmh2-paper);text-decoration:none;display:inline-block;padding:9px 6px;margin:-5px -6px}
.f2-drawer-vert{position:absolute;right:16px;bottom:34px;writing-mode:vertical-rl;font-weight:750;font-size:13px;letter-spacing:-.01em;color:rgba(250,248,242,.35)}

/* ── layout ── */
.f2-sec{padding:76px var(--fmh2-gutter)}
.f2-sec--bone{background:var(--fmh2-bone)}
.f2-sec--ink{background:var(--fmh2-ink);color:var(--fmh2-paper)}

/* ── trust ledger ── */
.f2-ledger{border-top:1px solid var(--fmh2-line)}
.f2-ledger .row{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:13px 0;border-bottom:1px solid var(--fmh2-line-soft)}
.f2-ledger b{font-size:20px;font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums;white-space:nowrap}
.f2-ledger b i{font-style:normal;color:var(--fmh2-mid);font-size:13px;font-weight:500}
.f2-ledger span{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--fmh2-mid);text-align:right}
.on-ink .f2-ledger{border-top-color:var(--fmh2-inkline)}
.on-ink .f2-ledger .row{border-bottom-color:var(--fmh2-inkline-soft)}
.on-ink .f2-ledger span{color:var(--fmh2-paper-52)}

/* ── the real-patient loop ──────────────────────────────────────────
   One genuine patient, filmed before treatment and across the twelve months
   that followed. 21 seconds, 720x720, and the file carries NO audio track at
   all, so muted costs the visitor nothing and buys reliable autoplay: every
   mobile browser refuses to autoplay a clip with sound.

   The frame states what it is without the visitor having to read the caption,
   because a looping face with no label is the kind of thing a viewer is right
   to be sceptical of: REAL PATIENT, BEFORE to 12 MONTHS, and results may vary.
   The behaviour lives in fmh2.js: the source is not attached until the clip is
   near the viewport, it pauses when it leaves, and it does not autoplay at all
   for a visitor who asks for reduced motion or who is on a metered connection,
   who get the poster and a play control instead. */
.f2-loop{position:relative;margin:0;max-width:520px;background:var(--fmh2-ink)}
.f2-loop-frame{position:relative;aspect-ratio:1/1;overflow:hidden;background:var(--fmh2-ink)}
.f2-loop-frame video,.f2-loop-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.f2-loop-tag{position:absolute;top:12px;left:12px;z-index:3;background:var(--fmh2-yellow);color:var(--fmh2-ink);font-size:10.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;padding:6px 9px}
.f2-loop-arc{position:absolute;bottom:12px;left:12px;right:12px;z-index:3;display:flex;align-items:center;gap:8px;font-size:10.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.7)}
.f2-loop-arc .sep{flex:1;height:1px;background:var(--fmh2-yellow);opacity:.9}
.f2-loop-btn{position:absolute;inset:0;z-index:4;display:grid;place-items:center;background:linear-gradient(180deg,rgba(10,10,10,.08),rgba(10,10,10,.38));cursor:pointer}
.f2-loop-btn[hidden]{display:none}
.f2-loop-btn .play{width:60px;height:60px;min-width:44px;min-height:44px;background:var(--fmh2-yellow);color:var(--fmh2-ink);display:grid;place-items:center}
.f2-loop-btn:focus-visible{outline:3px solid var(--fmh2-yellow);outline-offset:-3px}
.f2-loop-cap{margin-top:10px;font-size:12px;line-height:1.6;color:var(--fmh2-mid)}
.on-ink .f2-loop-cap{color:var(--fmh2-paper-52)}

/* ── ResultComparator ─ the line's comparison job ──
   REGISTRATION (post-launch hotfix 04). Every evidence pair is a
   background-removed cutout on white, and within a pair the subject is NOT
   geometrically registered: head scale, head centre and crop all move between
   the before and the after. Overlaying them raw is what produced the reported
   "half blank / stacked" comparator: case 004's before subject starts 92px in
   from the left of a 700px canvas while its after starts at 20px, a 10.6%
   displacement, so the wipe revealed a second, offset head against a white void.

   The frame is therefore locked to the source images' own 700x810 ratio and
   each image carries its own transform, computed from the measured silhouette
   so both halves put the subject in the same place:
     --bs/--as  one scale per PAIR, so the two heads stay the same size
     --bx/--by  before: translate, anchored on head centre x and head top y
     --ax/--ay  after:  the same anchors, the same target
   The defaults below are the identity transform, so a comparator that carries
   no fit data renders exactly as it did before.

   The clip-path lives on the LAYER and the transform on the IMAGE inside it.
   Putting both on one element would move the wipe edge with the transform,
   because a CSS transform is applied after the element's own clip. */
.f2-cmp-wrap{background:var(--fmh2-paper);border:1px solid var(--fmh2-line);padding:14px 14px 18px;max-width:520px}
.f2-cmp{position:relative;overflow:hidden;touch-action:pan-y;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;cursor:ew-resize;aspect-ratio:700/810;background:#fff}
.f2-cmp .lyr{position:absolute;inset:0;overflow:hidden}
.f2-cmp .lyr.after{clip-path:inset(0 0 0 var(--pos,50%))}
.f2-cmp img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;transform-origin:50% 50%}
.f2-cmp .lyr.before img{transform:translate(var(--bx,0%),var(--by,0%)) scale(var(--bs,1))}
.f2-cmp .lyr.after img{transform:translate(var(--ax,0%),var(--ay,0%)) scale(var(--as,1))}
.f2-cmp .div{position:absolute;top:0;bottom:0;left:var(--pos,50%);width:2px;margin-left:-1px;background:var(--fmh2-yellow);pointer-events:none;z-index:3}
.f2-cmp .knob{position:absolute;top:50%;left:var(--pos,50%);transform:translate(-50%,-50%);width:40px;height:40px;border-radius:50%;background:var(--fmh2-yellow);pointer-events:none;display:grid;place-items:center;z-index:4;box-shadow:0 2px 12px rgba(10,10,10,.24)}
.f2-cmp .knob svg{width:16px;height:16px;stroke:var(--fmh2-ink);fill:none;stroke-width:2.2}
.f2-cmp .cap{position:absolute;bottom:12px;z-index:5;font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;padding:6px 9px;pointer-events:none}
.f2-cmp .cap.b{left:12px;background:rgba(10,10,10,.82);color:#fff}
.f2-cmp .cap.a{right:12px;background:var(--fmh2-yellow);color:var(--fmh2-ink)}
/* keyboard and assistive technology only. pointer-events:none is the point:
   as a full-size interactive overlay this input used to swallow every drag
   and hand it to a native range, whose thumb a finger never lands on. The
   frame itself now owns the gesture (fmh2Wipe). */
.f2-cmp input[type=range]{position:absolute;inset:0;width:100%;height:100%;opacity:0;margin:0;z-index:6;pointer-events:none}
.f2-cmp:focus-within{outline:2.5px solid var(--fmh2-ink);outline-offset:3px}
.f2-cmp-meta{display:flex;align-items:baseline;gap:6px 14px;flex-wrap:wrap;padding:14px 2px 4px;font-size:13px;color:var(--fmh2-graphite)}
.f2-cmp-meta b{font-size:19px;font-weight:700;font-variant-numeric:tabular-nums}
.f2-cmp-meta .hint{margin-left:auto;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--fmh2-mid)}
.f2-cmp-tabs{display:flex;gap:8px;margin-top:12px}
.f2-cmp-tab{flex:1;min-height:46px;border:1px solid var(--fmh2-line);background:var(--fmh2-paper);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--fmh2-mid);transition:background .15s,border-color .15s}
.f2-cmp-tab[aria-pressed="true"]{background:var(--fmh2-yellow);border-color:var(--fmh2-ink);color:var(--fmh2-ink)}
.f2-match{display:inline-flex;align-items:center;gap:8px;margin-top:var(--sp-3);font-size:12.5px;font-weight:600;background:var(--fmh2-yellow);padding:6px 10px}
.f2-match svg{width:13px;height:13px}

/* ── price panel ── */
.f2-tier{border-top:1px solid var(--fmh2-inkline);padding:28px 0 26px}
.f2-tier:last-of-type{border-bottom:1px solid var(--fmh2-inkline)}
.f2-tier .amt{font-size:clamp(64px,19vw,104px)}
.f2-tier p{margin-top:10px;color:var(--fmh2-paper-70);font-size:15px}
.f2-notes{margin:26px 0 30px;display:grid;gap:10px;list-style:none}
.f2-notes li{display:flex;gap:12px;font-size:14.5px;color:rgba(250,248,242,.85)}
.f2-notes li::before{content:"";width:14px;height:1.5px;background:var(--fmh2-yellow);flex:none;margin-top:11px}

/* ── journey steps ── */
.f2-step{display:grid;grid-template-columns:44px 1fr;gap:0 16px;padding:22px 0;border-bottom:1px solid var(--fmh2-line-soft)}
.f2-step:first-of-type{border-top:1px solid var(--fmh2-line)}
.f2-step .no{font-variant-numeric:tabular-nums;font-size:13px;font-weight:700;color:var(--fmh2-mid);padding:3px 0;align-self:start;justify-self:start}
.f2-step.lit .no{background:var(--fmh2-yellow);color:var(--fmh2-ink);padding:3px 7px}
.f2-step h3{font-family:var(--fmh2-serif);font-variation-settings:"opsz" 60,"SOFT" 0,"WONK" 0;font-weight:560;font-size:21px;letter-spacing:-.01em;margin-bottom:6px}
.f2-step p{font-size:15px;color:var(--fmh2-graphite);line-height:1.6;max-width:32em}
.f2-step .when{display:inline-block;margin-top:10px;font-size:12px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--fmh2-mid)}
.f2-step .when b{color:var(--fmh2-ink)}

/* ── surgeon / editorial ── */
.f2-gmc{display:inline-flex;align-items:center;min-height:44px;gap:10px;font-variant-numeric:tabular-nums;font-size:14px;font-weight:600;letter-spacing:.04em;border:1px solid var(--fmh2-line);padding:8px 14px}
.f2-gmc .tick{width:8px;height:8px;background:var(--fmh2-yellow);flex:none}
.f2-qa{border-top:1px solid var(--fmh2-line);padding:20px 0}
.f2-qa .q{font-family:var(--fmh2-serif);font-variation-settings:"opsz" 50,"SOFT" 0,"WONK" 0;font-weight:560;font-size:18.5px;letter-spacing:-.01em;margin-bottom:9px}
.f2-qa .q::before{content:"Q. ";color:var(--fmh2-mid)}
.f2-qa .a{font-size:16px;color:var(--fmh2-graphite);line-height:1.6;max-width:34em}
.f2-qa .a::before{content:"A. ";font-weight:700;color:var(--fmh2-ink)}

/* ── media figures + placeholder status ── */
.f2-fig{position:relative;overflow:hidden}
.f2-fig img{width:100%;object-fit:cover}
.f2-fig--mono img{filter:grayscale(1) contrast(1.06)}
.f2-fig .credit{position:absolute;right:8px;bottom:8px;font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:#fff;background:rgba(10,10,10,.62);padding:4px 8px;z-index:3}
.f2-placeholder-band{position:absolute;top:10px;left:10px;z-index:3;background:rgba(10,10,10,.8);color:var(--fmh2-yellow);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:5px 9px}

/* ── mirror close ── */
.f2-mirror{background:var(--fmh2-ink);color:var(--fmh2-paper);position:relative;overflow:hidden;padding:0 0 84px}
.f2-mirror .fig{position:relative}
.f2-mirror .fig img{width:100%;height:min(52svh,500px);object-fit:cover;object-position:50% 30%}
.f2-mirror .fig::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,10,10,.25) 0%,transparent 30%,rgba(10,10,10,.92) 92%,var(--fmh2-ink) 100%)}
.f2-mirror .in{position:relative;padding:34px var(--fmh2-gutter) 0;margin-top:-40px;z-index:2}
.f2-mirror .whisper{display:block;font-family:var(--fmh2-serif);font-style:italic;font-variation-settings:"opsz" 60,"SOFT" 0,"WONK" 0;font-weight:460;font-size:clamp(21px,6vw,27px);line-height:1.42;color:rgba(250,248,242,.92);max-width:21em;margin-bottom:30px}
.f2-mirror .whisper .y{color:var(--fmh2-yellow)}
.f2-mirror h2{font-family:var(--fmh2-serif);font-variation-settings:"opsz" 144,"SOFT" 0,"WONK" 0;font-weight:480;font-size:clamp(44px,12.6vw,64px);letter-spacing:-.02em;line-height:.98;margin-bottom:24px}

/* ── facts ledger (entity block, quiet slot) ── */
.f2-facts{border:1px solid var(--fmh2-line);background:var(--fmh2-paper);padding:20px;font-size:14px;line-height:1.65}
.f2-facts h2{font-family:var(--fmh2-sans);font-size:14px;font-weight:700;letter-spacing:.02em;margin-bottom:10px}
.f2-facts dl{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;margin:10px 0 0}
.f2-facts dt{color:var(--fmh2-mid);white-space:nowrap}
.f2-facts dd{margin:0;color:var(--fmh2-graphite)}
.f2-facts a{color:inherit;text-decoration:underline;text-underline-offset:2px}
@media(max-width:520px){.f2-facts dl{grid-template-columns:1fr}.f2-facts dt{margin-top:8px}}

/* ── FAQ accordion (visible text stays verbatim with FAQPage JSON-LD) ── */
.f2-faq{border-top:1px solid var(--fmh2-line)}
.f2-faq details{border-bottom:1px solid var(--fmh2-line-soft)}
.f2-faq summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:17px 0;font-family:var(--fmh2-serif);font-variation-settings:"opsz" 50,"SOFT" 0,"WONK" 0;font-weight:560;font-size:17.5px;cursor:pointer;min-height:48px}
.f2-faq summary::-webkit-details-marker{display:none}
.f2-faq summary::after{content:"+";font-size:22px;color:var(--fmh2-mid);flex:none;font-weight:400}
.f2-faq details[open] summary::after{content:"\2212"}
.f2-faq p{padding:0 0 16px;font-family:var(--fmh2-sans);font-size:15px;line-height:1.62;color:var(--fmh2-graphite);max-width:44em}

/* ── footer ── */
.f2-foot{background:var(--fmh2-ink);color:var(--fmh2-paper);padding:56px var(--fmh2-gutter) 110px}
.f2-foot .f2-wm{color:var(--fmh2-yellow);font-size:34px;line-height:1}
.f2-foot-grid{margin-top:38px;display:grid;gap:26px;font-size:14px;line-height:1.9}
.f2-foot h4{font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--fmh2-paper-52);margin-bottom:8px}
.f2-foot a{color:var(--fmh2-paper);text-decoration:none;display:inline-block;padding:9px 6px;margin:-5px -6px}
.f2-foot a:hover{color:var(--fmh2-yellow)}
.f2-foot .disc{margin-top:34px;padding-top:22px;border-top:1px solid var(--fmh2-inkline);font-size:12.5px;color:var(--fmh2-paper-52);line-height:1.7;max-width:46em}
.f2-foot .cols2{display:grid;grid-template-columns:1fr;gap:6px 24px;font-size:13.5px}
/* hotfix 05: the address and hours moved into the footer when the visible
   facts panel was removed from the body. On most routes this is now the only
   place a visitor can read them, so it is content, not decoration. */
.f2-foot-addr{display:block;margin-top:12px;font-style:normal;font-size:13.5px;line-height:1.75;color:var(--fmh2-paper-70)}

/* ── reveals: hidden state exists only once JS has arrived ── */
.f2-rv{transition:opacity .6s ease,transform .6s cubic-bezier(.4,0,.2,1)}
.js .f2-rv{opacity:0;transform:translateY(14px)}
.js .f2-rv.in{opacity:1;transform:none}
.f2-rv2{transition-delay:.08s}.f2-rv3{transition-delay:.16s}
@media (prefers-reduced-motion:reduce){.js .f2-rv{opacity:1;transform:none;transition:none}}

/* ── desktop ── */
@media (min-width:768px){
  :root{--fmh2-gutter:48px;--fmh2-rail-x:18px}
  .f2-sticky{display:none}
}
@media (min-width:1100px){
  :root{--fmh2-gutter:64px}
  .f2-sec{padding-top:110px;padding-bottom:110px;display:grid;grid-template-columns:minmax(180px,1fr) minmax(0,760px);gap:0 7vw;padding-left:calc(var(--fmh2-gutter) + 4vw);padding-right:calc(var(--fmh2-gutter) + 4vw)}
  .f2-sec>.f2-kick{grid-column:1;align-self:start;position:sticky;top:110px}
  .f2-sec>.f2-kick::after{display:none}
  .f2-sec>*:not(.f2-kick){grid-column:2}
  .f2-cta-stack{flex-direction:row;flex-wrap:wrap;max-width:none}
  .f2-cta{width:auto;min-width:280px;padding-right:10px;gap:22px}
  /* auto-fit, not a hard 4: the trust ledger carries 3 rows on the homepage
     since the company number moved to the compliance line, and a fixed
     4-column track left an empty cell and a stretched third one */
  .f2-ledger{display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr))}
  .f2-ledger .row{flex-direction:column;align-items:flex-start;gap:4px;border-bottom:0;border-right:1px solid var(--fmh2-line-soft);padding:20px 18px 20px 0;margin-right:18px}
  .f2-ledger .row:last-child{border-right:0}
  .f2-ledger span{text-align:left}
  .on-ink .f2-ledger .row{border-right-color:var(--fmh2-inkline-soft)}
  /* the comparator keeps the source images' own ratio at every width: the
     registration transform is expressed against that frame, so changing the
     aspect on a breakpoint would silently unregister the pair */
  .f2-tier .amt{font-size:min(9vw,150px)}
  .f2-mirror .fig img{height:min(66vh,640px)}
  .f2-mirror .in{padding-left:calc(var(--fmh2-gutter) + 4vw);max-width:1000px}
  .f2-foot{padding-left:calc(var(--fmh2-gutter) + 4vw)}
  .f2-foot-grid{grid-template-columns:repeat(3,1fr)}
  .f2-foot .cols2{grid-template-columns:1fr 1fr}
}

/* ============================================================
   ASSESSMENT OVERLAY · FMH 2.0 skin over the frozen quiz partial
   The partial's DOM, ids, classes and logic are byte-frozen; this
   section only paints them. Scoped to body.fmh2 so unmigrated
   pages keep their own inline styling untouched.
   The room is ink; the one colour is the measured yellow line.
   ============================================================ */

.fmh2 .quiz-overlay{
  /* token remap: the partial's fallback-var styling resolves to the D palette */
  --black:#0A0A0A; --black2:#191813; --black3:#23221B; --black4:#2E2D26;
  --white:#FAF8F2; --grey1:#D9D5CB; --grey2:#B3AEA3; --grey3:#8B867B;
  --gold:#F4DC32; --gold-lt:#F9E968; --gold-dk:#0A0A0A;
  --gold-bg:rgba(244,220,50,.07); --gold-bd:rgba(244,220,50,.34);
  --line:rgba(250,248,242,.09); --green:#7FB77F;
  --serif:var(--fmh2-serif); --sans:var(--fmh2-sans);
  --font-d:var(--fmh2-serif); --font-b:var(--fmh2-sans);
  --ease:cubic-bezier(.22,1,.36,1);
  position:fixed;inset:0;z-index:200;background:var(--black);color:var(--white);
  display:none;flex-direction:column;font-family:var(--fmh2-sans);
}
.fmh2 .quiz-overlay.open{display:flex;animation:f2QuizIn .28s var(--ease)}
/* focus must be visible in the ink room: the global ink outline vanishes here */
.fmh2 .quiz-overlay a:focus-visible,.fmh2 .quiz-overlay button:focus-visible,.fmh2 .quiz-overlay input:focus-visible,.fmh2 .quiz-overlay select:focus-visible{outline:2.5px solid var(--fmh2-yellow);outline-offset:3px}
/* focus containment: aria-modal alone does not stop Tab reaching the page
   behind the overlay (the frozen partial has no JS trap). While the
   assessment is open, the page landmarks leave the tab order and the
   accessibility tree (body gains .quiz-open via a tiny observer in fmh2.js;
   a :has() version of this rule cost 27 Lighthouse points in style
   invalidation on the animated homepage). Allowlist of known landmarks so any
   element a third party appends to body (a Turnstile challenge, say) is
   never hidden. */
.fmh2.quiz-open > :is(#cookie-banner,#cookie-preferences,header,nav,main,footer,.f2-sticky){visibility:hidden}
@keyframes f2QuizIn{from{opacity:0}to{opacity:1}}

/* chrome */
.fmh2 .quiz-nav{height:58px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;border-bottom:1px solid var(--line);flex-shrink:0}
.fmh2 .quiz-back{font-size:13px;font-weight:500;color:var(--grey2);display:flex;align-items:center;gap:6px;background:none;border:none;cursor:pointer;min-height:44px;padding:0 4px;transition:color .2s;font-family:inherit}
.fmh2 .quiz-back:hover{color:var(--white)}
.fmh2 .quiz-steplbl{font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--grey3)}
.fmh2 .quiz-close{font-size:20px;color:var(--grey2);width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:none;border:none;cursor:pointer;transition:color .2s}
.fmh2 .quiz-close:hover{color:var(--white)}

/* the measured line carries progress; the fill width is set by the frozen JS
   from real step position, so the instrument stays truthful */
.fmh2 .quiz-progwrap{height:3px;flex-shrink:0;background:rgba(250,248,242,.09)}
.fmh2 .quiz-progfill{height:100%;background:var(--fmh2-yellow);transition:width .4s var(--ease)}

/* body column */
.fmh2 .quiz-body{flex:1;overflow-y:auto;padding:34px 22px 24px;display:flex;flex-direction:column;max-width:620px;margin:0 auto;width:100%;animation:f2QStep .4s var(--ease)}
@keyframes f2QStep{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.fmh2 .quiz-q{font-family:var(--fmh2-serif);font-size:clamp(25px,6.4vw,31px);font-weight:600;letter-spacing:-.01em;line-height:1.16;margin-bottom:8px}
.fmh2 .quiz-sub{font-size:14.5px;line-height:1.55;color:var(--grey2);margin-bottom:24px}
.fmh2 .quiz-greet{font-family:var(--fmh2-serif);font-style:italic;font-weight:400;font-size:15px;line-height:1.5;color:var(--grey1);margin-bottom:18px;padding-left:13px;border-left:2px solid var(--fmh2-yellow)}

/* answered-so-far rail: quiet ink chips, no jewellery */
.fmh2 .quiz-rail{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-bottom:18px;min-height:0}
.fmh2 .quiz-chip{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:600;letter-spacing:.02em;color:var(--grey1);background:var(--black3);border:1px solid var(--line);border-radius:0;padding:5px 10px;box-shadow:none;animation:none}
.fmh2 .quiz-chip::before{content:'';width:5px;height:5px;border-radius:0;background:var(--fmh2-yellow);box-shadow:none}
.fmh2 .quiz-chip:last-of-type{box-shadow:none;animation:none}
.fmh2 .quiz-rail-tag{font-size:10.5px;font-style:italic;color:var(--grey3)}

/* list options: flat cards, hairline borders, selection is border + tick, never colour alone */
.fmh2 .quiz-opts{display:flex;flex-direction:column;gap:10px}
.fmh2 .quiz-opt{background:var(--black2);border:1px solid rgba(250,248,242,.17);border-radius:0;padding:16px 18px;display:flex;align-items:center;gap:14px;cursor:pointer;transition:border-color .2s,background .2s;text-align:left;width:100%;min-height:56px;font-family:inherit;color:var(--white);box-shadow:none}
.fmh2 .quiz-opt:hover{border-color:rgba(250,248,242,.4);background:var(--black3);transform:none}
.fmh2 .quiz-opt.sel{border-color:var(--fmh2-yellow);background:var(--gold-bg)}
.fmh2 .quiz-opt-emoji{display:none}
.fmh2 .quiz-opt-t{font-size:15.5px;font-weight:600;color:var(--white);margin-bottom:2px}
.fmh2 .quiz-opt-s{font-size:12.5px;color:var(--grey2)}
.fmh2 .quiz-opt.sel .quiz-opt-t{color:var(--white)}
.fmh2 .quiz-checkico{margin-left:auto;flex-shrink:0;opacity:0;transform:scale(.6);transition:.2s}
.fmh2 .quiz-opt.sel .quiz-checkico{opacity:1;transform:scale(1)}
.fmh2 .quiz-checkico circle{fill:var(--fmh2-yellow)}
.fmh2 .quiz-checkico path{stroke:var(--fmh2-ink)}

/* image grid (pattern reference) */
.fmh2 .quiz-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.fmh2 .quiz-gopt{background:var(--black2);border:1px solid rgba(250,248,242,.17);border-radius:0;overflow:hidden;cursor:pointer;transition:border-color .2s;text-align:left;width:100%;padding:0;font-family:inherit}
.fmh2 .quiz-gopt:hover{border-color:rgba(250,248,242,.4);transform:none}
.fmh2 .quiz-gopt.sel{border-color:var(--fmh2-yellow)}
.fmh2 .quiz-gimg{height:112px;overflow:hidden;position:relative;background:#fff;display:flex;align-items:center;justify-content:center}
.fmh2 .quiz-gimg img{width:auto;height:100%;object-fit:contain}
.fmh2 .quiz-gcheck{position:absolute;top:6px;right:6px;width:22px;height:22px;border-radius:0;background:var(--fmh2-yellow);display:none;align-items:center;justify-content:center}
.fmh2 .quiz-gcheck svg circle{fill:transparent}
.fmh2 .quiz-gcheck svg path{stroke:var(--fmh2-ink)}
.fmh2 .quiz-gopt.sel .quiz-gcheck{display:flex}
.fmh2 .quiz-glbl{padding:10px 12px 11px;font-size:13px;font-weight:600;color:var(--white)}
.fmh2 .quiz-gsub{font-size:11px;color:var(--grey2);margin-top:1px;font-weight:400}

/* six-zone selector: the photographic instrument, selections drawn in the yellow */
.fmh2 .quiz-zone{display:flex;flex-direction:column;align-items:center}
.fmh2 .zone-photo{position:relative;width:100%;max-width:330px;margin:2px auto 4px;border-radius:0;overflow:hidden;background:#fff;line-height:0;border:1px solid rgba(250,248,242,.16);box-shadow:none;-webkit-tap-highlight-color:transparent}
.fmh2 .zone-photo img{width:100%;display:block;filter:grayscale(1) contrast(1.04)}
.fmh2 .zone-photo svg{position:absolute;inset:0;width:100%;height:100%;touch-action:manipulation}
.fmh2 .zone-photo .zhot{cursor:pointer}
.fmh2 .zone-photo svg circle[fill-opacity]{fill:var(--fmh2-yellow)}
.fmh2 .zone-photo .zring{stroke:var(--fmh2-yellow);stroke-width:4;filter:none}
.fmh2 .zone-legend{display:flex;flex-wrap:wrap;justify-content:center;gap:7px;margin-top:10px}
.fmh2 .zleg{display:inline-flex;align-items:center;gap:8px;background:var(--black2);border:1px solid rgba(250,248,242,.17);border-radius:0;padding:8px 13px;font-size:12.5px;font-weight:500;color:var(--grey1);cursor:pointer;min-height:36px;box-shadow:none;font-family:inherit;transition:border-color .2s}
.fmh2 .zleg:hover{border-color:rgba(250,248,242,.4)}
.fmh2 .zleg.on{border-color:var(--fmh2-yellow);background:var(--gold-bg);color:var(--white)}
.fmh2 .zleg-n{width:18px;height:18px;border-radius:0;display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;background:var(--black4)!important;color:var(--white);flex-shrink:0}
.fmh2 .zleg.on .zleg-n{background:var(--fmh2-yellow)!important;color:var(--fmh2-ink)}
.fmh2 .zall{margin-top:16px;background:none;border:none;color:var(--grey1);font-size:13px;font-weight:500;cursor:pointer;font-family:inherit;text-decoration:underline;text-underline-offset:3px;min-height:44px}

/* donor scale: measured numerals */
.fmh2 .quiz-scale{display:flex;gap:9px;justify-content:space-between;margin-top:4px}
.fmh2 .quiz-scale-btn{flex:1;aspect-ratio:1;max-width:64px;background:var(--black2);border:1px solid rgba(250,248,242,.17);border-radius:0;display:flex;align-items:center;justify-content:center;font-family:var(--fmh2-serif);font-size:20px;font-weight:600;color:var(--grey1);cursor:pointer;box-shadow:none;transition:border-color .2s,background .2s}
.fmh2 .quiz-scale-btn:hover{transform:none;border-color:rgba(250,248,242,.4)}
.fmh2 .quiz-scale-btn.sel{border-color:var(--fmh2-yellow);background:var(--gold-bg);color:var(--white)}
.fmh2 .quiz-scale-ends{display:flex;justify-content:space-between;margin-top:10px;font-size:12px;color:var(--grey3)}

/* name step */
.fmh2 .quiz-name-input{width:100%;background:var(--black2);border:1px solid rgba(250,248,242,.16);box-shadow:none;border-radius:0;padding:17px 18px;font-family:var(--fmh2-serif);font-weight:500;font-size:20px;color:var(--white);outline:none;transition:border-color .25s}
.fmh2 .quiz-name-input::placeholder{color:var(--grey3);font-weight:300}
.fmh2 .quiz-name-input:focus{border-color:var(--fmh2-yellow)}

/* micro-affirmation line */
.fmh2 .quiz-aff{min-height:0;font-size:13.5px;color:var(--grey1);font-style:italic;line-height:1.5;margin-top:14px;opacity:0;transform:translateY(6px);transition:opacity .35s var(--ease),transform .35s var(--ease)}
.fmh2 .quiz-aff.show{opacity:1;transform:translateY(0)}

/* footer action */
.fmh2 .quiz-footer{margin-top:auto;padding-top:22px}
.fmh2 .quiz-next{width:100%;background:var(--fmh2-yellow);color:var(--fmh2-ink);font-family:inherit;font-size:15px;font-weight:700;letter-spacing:.01em;padding:16px;min-height:52px;border:none;border-radius:0;cursor:pointer;transition:background .2s,opacity .2s}
.fmh2 .quiz-next:hover{background:var(--gold-lt)}
.fmh2 .quiz-next:disabled{opacity:1;background:transparent;color:var(--grey3);box-shadow:inset 0 0 0 1px rgba(250,248,242,.16);cursor:default}
.fmh2 .quiz-privacy{text-align:center;font-size:12px;color:var(--grey3);margin-top:10px}

/* working state */
.fmh2 .quiz-loading{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 24px;text-align:center}
.fmh2 .quiz-ring{width:80px;height:80px;border-radius:50%;border:2px solid var(--black3);border-top-color:var(--fmh2-yellow);animation:f2Spin 1s linear infinite;margin-bottom:24px;position:relative}
@keyframes f2Spin{to{transform:rotate(360deg)}}
.fmh2 .quiz-pct{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-family:var(--fmh2-serif);font-size:18px;font-weight:600;color:var(--white)}
.fmh2 .quiz-load-h{font-family:var(--fmh2-serif);font-size:23px;font-weight:600;margin-bottom:8px}
.fmh2 .quiz-load-p{font-size:14px;color:var(--grey2)}

/* outcome panel */
.fmh2 .quiz-result{flex:1;overflow-y:auto;padding:26px 22px;max-width:620px;margin:0 auto;width:100%}
.fmh2 .res-badge{display:inline-flex;align-items:center;gap:6px;background:var(--fmh2-yellow);color:var(--fmh2-ink);font-size:10.5px;font-weight:700;padding:6px 11px;border-radius:0;letter-spacing:.1em;text-transform:uppercase;margin-bottom:14px}
.fmh2 .res-greet{font-family:var(--fmh2-serif);font-style:italic;font-size:15px;color:var(--grey1);line-height:1.5;margin-bottom:12px}
.fmh2 .res-h{font-family:var(--fmh2-serif);font-size:29px;font-weight:600;letter-spacing:-.01em;line-height:1.12;margin-bottom:8px}
.fmh2 .res-sub{font-size:15px;color:var(--grey2);margin-bottom:20px;line-height:1.6}
.fmh2 .res-imgs{display:grid;grid-template-columns:1fr 1fr;gap:2px;border-radius:0;overflow:hidden;margin-bottom:20px}
.fmh2 .res-img{height:150px;position:relative;overflow:hidden;background:var(--black3)}
.fmh2 .res-img img{width:100%;height:100%;object-fit:cover;object-position:top}
.fmh2 .res-lbl{position:absolute;bottom:0;left:0;font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:4px 8px;border-radius:0;background:rgba(10,10,10,.78);color:var(--white)}
.fmh2 .res-lbl.after{background:rgba(244,220,50,.94);color:var(--fmh2-ink)}
.fmh2 .res-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.fmh2 .res-chip{font-size:11px;font-weight:600;letter-spacing:.02em;color:var(--grey1);background:var(--black3);border:1px solid var(--line);padding:5px 10px;border-radius:0}
.fmh2 .res-promise{display:flex;align-items:center;gap:9px;font-size:12.5px;color:var(--grey1);background:var(--black2);border:1px solid var(--line);border-radius:0;padding:12px 14px;margin-bottom:14px;line-height:1.4}
.fmh2 .res-promise b{color:var(--white);font-weight:600}
.fmh2 .res-why-t{font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--grey2);margin-bottom:10px}
.fmh2 .res-why{display:flex;gap:8px;font-size:13.5px;color:var(--grey1);line-height:1.5}
.fmh2 .res-check{color:var(--green);flex-shrink:0}
.fmh2 .res-cta{width:100%;background:var(--fmh2-yellow);color:var(--fmh2-ink);font-family:inherit;font-size:15px;font-weight:700;padding:16px;min-height:52px;border:none;border-radius:0;cursor:pointer}
.fmh2 .res-cta:hover{background:var(--gold-lt)}
.fmh2 .res-wa{border-radius:0;font-weight:600}
.fmh2 .res-line{width:100%;background:transparent;border:1px solid rgba(250,248,242,.22);color:var(--white);font-family:inherit;font-size:14px;font-weight:500;padding:15px;min-height:48px;border-radius:0;cursor:pointer;transition:border-color .25s}
.fmh2 .res-line:hover{border-color:rgba(250,248,242,.5)}

/* gate + heard + Cal (partial's own style block assumes a dark room; keep it,
   square the geometry, let the remapped tokens recolour the rest) */
.fmh2 .qgate-input,.fmh2 .quiz-heard-sel,.fmh2 .qgate-err,.fmh2 .qgate-confirm,.fmh2 .qcal-head,.fmh2 #my-cal-inline{border-radius:0}
.fmh2 .qgate-input{background:var(--black2);border-color:rgba(250,248,242,.16)}
.fmh2 .qgate-input:focus{border-color:var(--fmh2-yellow)}
.fmh2 .quiz-heard-sel{background:var(--black2);border-color:rgba(250,248,242,.16)}
.fmh2 .quiz-heard-sel:focus{border-color:var(--fmh2-yellow)}
.fmh2 .quiz-heard{border-top-color:var(--line)}
.fmh2 .qgate-check input{accent-color:var(--fmh2-yellow)}
.fmh2 .qgate-sign b{color:var(--white)}
.fmh2 #my-cal-inline{border-color:rgba(250,248,242,.14);background:var(--black2)}
.fmh2 .qcal-spin{border-color:rgba(244,220,50,.25);border-top-color:var(--fmh2-yellow)}
.fmh2 .qcal-title em{color:var(--fmh2-yellow)}

/* ── lead + photo modals: paper cards in the D geometry ── */
.fmh2 #jfModal .fmh-card,.fmh2 #photoModal .fmh-card{background:var(--fmh2-paper);border-radius:0;box-shadow:0 24px 70px rgba(10,10,10,.4);font-family:var(--fmh2-sans);color:var(--fmh2-ink)}
.fmh2 #jfModal .fmh-card h3,.fmh2 #photoModal h3{font-family:var(--fmh2-serif);font-weight:600;letter-spacing:-.01em;color:var(--fmh2-ink)}
.fmh2 #photoModal h3 em{font-style:italic;color:var(--fmh2-ink)}
.fmh2 #jfModal .fmh-sub,.fmh2 #photoModal .fmh-sub{color:var(--fmh2-graphite)}
.fmh2 #jfModal label{color:var(--fmh2-mid)}
.fmh2 #jfModal input{border-radius:0;border-color:var(--fmh2-line);color:var(--fmh2-ink)}
.fmh2 #jfModal input:focus{border-color:var(--fmh2-ink);box-shadow:0 0 0 3px rgba(244,220,50,.5)}
.fmh2 #jfModal .fmh-submit,.fmh2 #photoModal .fmh-submit{border-radius:0;background:var(--fmh2-yellow);color:var(--fmh2-ink)}
.fmh2 #jfModal .fmh-err,.fmh2 #photoModal .fmh-err{border-radius:0}
.fmh2 #photoModal .ph-slot{border-radius:0;border-color:rgba(10,10,10,.28)}
.fmh2 #photoModal .ph-slot.filled{border-color:var(--fmh2-ink)}
.fmh2 #photoModal .ph-lbl{background:rgba(250,248,242,.93);color:var(--fmh2-graphite)}
.fmh2 #photoModal .ph-slot.filled .ph-lbl{background:rgba(244,220,50,.95);color:var(--fmh2-ink)}
.fmh2 #photoModal .ph-cam{background:var(--fmh2-yellow);color:var(--fmh2-ink);border-radius:0}
.fmh2 #photoModal .ph-slot.filled .ph-cam{background:var(--fmh2-ink);color:var(--fmh2-paper)}
.fmh2 #photoModal .ph-identity{border-radius:0;background:rgba(244,220,50,.16);border-color:rgba(10,10,10,.2);color:var(--fmh2-graphite)}
.fmh2 #photoModal .ph-identity b{color:var(--fmh2-ink)}
.fmh2 #photoModal .ph-done-ring{background:rgba(244,220,50,.3);border-color:rgba(10,10,10,.3)}

/* desktop: the room stays a column; give the question more air */
@media(min-width:768px){
  .fmh2 .quiz-body{padding:52px 24px 32px}
  .fmh2 .quiz-q{font-size:33px}
  .fmh2 .quiz-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (prefers-reduced-motion:reduce){
  .fmh2 .quiz-overlay.open{animation:none}
  .fmh2 .quiz-body{animation:none}
  .fmh2 .quiz-ring{animation:none}
  .fmh2 .quiz-progfill{transition:none}
  .fmh2 .quiz-aff{transition:none;opacity:1;transform:none}
}

/* The on-the-record ledger links are the whole point of that section: a
   visitor is invited to go and check the registration for themselves. They
   sat at 15px tall, which is not a target a thumb can rely on. They are
   standalone links, not words inside a sentence, so they get real height. */
.f2-ledger .row a{display:inline-flex;align-items:center;min-height:44px}