/* ===== Fractional SDRs page (solutions/fractional-sdr/page.css). Every class carries the frx- prefix; kit classes are bmk-, page-type classes pt-.
   T3 detail page: breadcrumb, family strip, split hero with one contained film (the page's only loop), the ladder, the tally,
   the quadrant, questions and the close. Sand only where a dense object lives; quiet sections sit on white with hairlines.
   One amber spark per visual. Breakpoints: 1080, 820, 560.
   Brief 3 (11 Nov 2026): the proof strip, the relay and "how you buy" were cut, with their CSS. */
.frx-k{font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--taupe)}
.frx-dim{color:#8B8172}
.frx-cap{margin-top:14px;font-family:var(--mono);font-size:12px;color:var(--taupe);text-align:center}
.frx-links{display:flex;flex-wrap:wrap;gap:10px 26px}
.frx-chip{display:inline-flex;align-items:center;font-size:14px;line-height:1.3;padding:6px 12px;border-radius:999px;background:var(--sand0);box-shadow:inset 0 0 0 1px var(--hair2);color:var(--ink);white-space:nowrap}
.frx-zn{display:inline-flex;align-items:center;height:26px;padding:0 10px;border-radius:7px;background:var(--ink);color:#FFFFFF;font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.07em;text-transform:uppercase;white-space:nowrap}
/* a draft value reads as a value, still marked as draft (the production build strips it; its row or cell then hides) */
[data-sol] .frx-spec .draft{font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:0;text-transform:none;white-space:normal;line-height:1.4;padding:3px 9px;border-radius:7px}
[data-sol] .frx-zn-c .draft,[data-sol] .frx-spec .frx-zn~.draft{height:26px;padding:0 10px;border-radius:7px;font-size:12px;letter-spacing:.07em}

/* ---------- 1 · hero: the film frame (720 x 540; upright 540 x 720 on phones) ---------- */
.frx-hero .pt-hero-visual>.film{aspect-ratio:720/540}
@media (max-width:560px){.frx-hero .pt-hero-visual>.film{aspect-ratio:540/720}}

/* ---------- 2 · who calls: the ladder, a caller profile, the gate (vetted, NDA) ---------- */
.frx-who-floor{padding:clamp(12px,3.4vw,56px) clamp(12px,3.4vw,56px) clamp(16px,2.4vw,32px)}
.frx-lad{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(12px,1.8vw,22px);align-items:stretch}
.frx-lad-card{background:var(--object);border-radius:22px;box-shadow:var(--bmk-lift);padding:clamp(20px,3vw,40px);display:flex;flex-direction:column;min-width:0}
.frx-lad-top,.frx-id-top{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.frx-lad-top{padding-bottom:16px;border-bottom:1.5px solid var(--ink)}
.frx-rungs{flex:1;display:flex;flex-direction:column;justify-content:center;gap:10px;padding:24px 0 4px}
.frx-rung{display:grid;grid-template-columns:minmax(0,150px) minmax(0,1fr);gap:18px;align-items:center}
.frx-rung-n{display:flex;align-items:center;gap:10px;font-size:clamp(19px,1.9vw,26px);font-weight:700;letter-spacing:-.03em;line-height:1.1;color:#B9AF9F;white-space:nowrap}
.frx-apex{flex:none;display:block;width:13px;height:11px;background:var(--amber);clip-path:polygon(50% 0,100% 100%,0 100%)}
.frx-rung-tr{position:relative;display:block;height:46px;border-radius:12px;background:var(--sand0)}
.frx-rung-f{position:absolute;left:12px;top:17px;bottom:17px;width:calc(var(--w) * (100% - 24px));border-radius:6px;background:var(--sand3)}
.frx-rung-tok{position:absolute;top:5px;left:calc(12px + var(--w) * (100% - 24px) - 36px);display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:var(--ink);box-shadow:0 0 0 3px var(--object);font-family:var(--mono);font-size:12px;font-weight:500;color:#FFFFFF}
.frx-chk{display:flex;align-items:center;gap:10px;font-size:15px;line-height:1.3;min-width:0}
.frx-chk i{flex:none;display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;background:var(--ink);color:#FFFFFF}
.frx-side{display:flex;flex-direction:column;gap:clamp(12px,1.8vw,22px);min-width:0}
.frx-id{background:var(--object);border-radius:22px;box-shadow:var(--bmk-lift);padding:clamp(20px,2.6vw,34px);display:flex;flex-direction:column;gap:20px;min-width:0}
.frx-id-who{display:flex;align-items:center;gap:16px;min-width:0}
.frx-av{flex:none;display:inline-flex;align-items:center;justify-content:center;width:64px;height:64px;border-radius:50%;background:var(--sand2);font-family:var(--mono);font-size:17px;font-weight:500;color:var(--ink)}
.frx-id-nm{display:flex;flex-direction:column;align-items:flex-start;gap:7px;min-width:0}
.frx-id-nm b{font-size:clamp(24px,2.2vw,30px);line-height:1.05;letter-spacing:-.035em;font-weight:700}
.frx-rk{display:inline-flex;align-items:center;height:24px;padding:0 9px;border-radius:6px;background:var(--ink);color:#FFFFFF;font-family:var(--mono);font-size:11.5px;letter-spacing:.07em;text-transform:uppercase}
.frx-id-rows{margin:0;display:grid;gap:12px;padding-top:18px;border-top:1px solid var(--hair)}
.frx-id-rows>div{display:grid;grid-template-columns:92px minmax(0,1fr);gap:12px;align-items:center}
.frx-id-rows dd{margin:0;display:flex;flex-wrap:wrap;gap:6px;font-size:15.5px;line-height:1.4;min-width:0}
/* the gate: said, not explained (vetted, NDA); the criteria stay for the intro call */
.frx-gate{border-radius:20px;box-shadow:inset 0 0 0 1px var(--hair2);padding:clamp(18px,2.2vw,28px);display:flex;flex-direction:column;gap:14px;min-width:0}
.frx-checks{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
@media (max-width:820px){.frx-lad{grid-template-columns:minmax(0,1fr)}}
@media (max-width:560px){
  .frx-lad-card,.frx-id{border-radius:16px;padding:18px 16px}
  .frx-rung{grid-template-columns:76px minmax(0,1fr);gap:10px}
  .frx-rung-n{font-size:16px;gap:6px}
  .frx-apex{width:10px;height:9px}
  .frx-rung-tr{height:38px;border-radius:10px}
  .frx-rung-f{left:8px;top:14px;bottom:14px;width:calc(var(--w) * (100% - 16px));border-radius:5px}
  .frx-rung-tok{top:5px;left:calc(8px + var(--w) * (100% - 16px) - 28px);width:28px;height:28px;font-size:10.5px;box-shadow:0 0 0 2px var(--object)}
  .frx-av{width:52px;height:52px;font-size:15px}
  .frx-id-rows>div{grid-template-columns:76px minmax(0,1fr)}
}

/* ---------- 3 · the caller matters: 39 meetings as a tally, drawn once, then still (on white); then the question left open ---------- */
.frx-mo-lede{max-width:28ch}
.frx-tally{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4.4vw,72px);align-items:center;padding:clamp(24px,3.2vw,44px) 0;border-top:1.5px solid var(--ink);border-bottom:1px solid var(--rule)}
.frx-tally-n{display:flex;flex-direction:column;gap:clamp(10px,1.6vw,22px);min-width:0}
.frx-tally-n b{font-family:var(--mono);font-weight:500;font-size:clamp(96px,12vw,176px);letter-spacing:-.07em;line-height:1}
.frx-tally-n span{font-size:clamp(19px,1.8vw,24px);line-height:1.3;font-weight:600;letter-spacing:-.02em;max-width:24ch}
.frx-marks{display:flex;flex-wrap:wrap;gap:clamp(14px,1.8vw,26px) clamp(12px,1.5vw,22px);min-width:0}
.frx-marks svg{display:block;width:clamp(48px,4.6vw,64px);height:auto;overflow:visible}
.frx-marks path{fill:none;stroke:var(--ink);stroke-width:3.2;stroke-linecap:round;stroke-dasharray:1 2;stroke-dashoffset:1;transition:stroke-dashoffset .32s cubic-bezier(.4,0,.2,1);transition-delay:calc(var(--i) * 45ms + .2s)}
.frx-marks path.frx-last{stroke:var(--amber);stroke-width:4}
.bmk-seen .frx-marks path{stroke-dashoffset:0}
.frx-tally-src{margin-top:16px;font-family:var(--mono);font-size:12px;line-height:1.55;color:var(--taupe)}
@media (prefers-reduced-motion:reduce){.frx-marks path{transition:none}}
@media (max-width:820px){.frx-tally{grid-template-columns:minmax(0,1fr)}}
/* the question left open, with the one mid-page button */
.frx-ask{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px 32px;margin-top:clamp(36px,4.4vw,64px)}
.frx-ask-q{font-size:clamp(21px,2.1vw,30px);line-height:1.2;font-weight:700;letter-spacing:-.03em;color:var(--fg);max-width:30ch}
.frx-ask-q span{display:block;color:var(--fg3)}
@media (max-width:560px){.frx-ask{flex-direction:column;align-items:flex-start}}

/* ---------- 4 · which caller fits: the living quadrant ---------- */
.frx-fit-lede{max-width:24ch}
.frx-fit-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.frx-fit-tabs [role="tab"]{all:unset;box-sizing:border-box;cursor:pointer;position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:12px;min-height:54px;padding:0 20px;border-radius:14px;background:var(--raised);box-shadow:inset 0 0 0 1px var(--hair2);transition:box-shadow .25s ease,background-color .25s ease}
.frx-fit-tabs [role="tab"]:hover{box-shadow:inset 0 0 0 1px var(--taupe)}
.frx-fit-tabs [role="tab"][aria-selected="true"]{background:var(--object);box-shadow:inset 0 0 0 1.5px var(--ink)}
.frx-fit-tabs [role="tab"]:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.frx-fit-tabs [role="tab"] b{font-size:16px;font-weight:600;letter-spacing:-.015em;color:var(--fg3);transition:color .25s ease}
.frx-fit-tabs [aria-selected="true"] b{color:var(--fg)}
.frx-fit-tabs .bmk-fill{left:18px;right:18px;bottom:7px}
.frx-fit-body{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:clamp(16px,2.6vw,40px);align-items:center;background:var(--sand0);border-radius:24px;padding:clamp(14px,3vw,48px)}
.frx-map{position:relative;padding:0 0 30px 30px;min-width:0}
.frx-map-grid{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:8px;aspect-ratio:1/.88}
.frx-zone{display:flex;flex-direction:column;align-items:flex-start;gap:9px;padding:clamp(12px,1.6vw,20px);border-radius:16px;background:rgba(255,253,250,.45);box-shadow:inset 0 0 0 1px var(--hair);transition:background-color .45s ease,box-shadow .45s ease;min-width:0}
.frx-zone b{font-size:clamp(14px,1.3vw,17px);line-height:1.25;font-weight:600;letter-spacing:-.015em;color:var(--fg3);max-width:15ch;transition:color .45s ease}
.frx-zn-c{display:flex}
.frx-zn-c:empty{display:none}
.frx-fit[data-kit-i="0"] .frx-zone[data-z="0"],.frx-fit[data-kit-i="1"] .frx-zone[data-z="1"],.frx-fit[data-kit-i="2"] .frx-zone[data-z="2"]{background:var(--object);box-shadow:inset 0 0 0 1.5px var(--ink),0 18px 36px -26px rgba(92,83,69,.5)}
.frx-fit[data-kit-i="0"] .frx-zone[data-z="0"] b,.frx-fit[data-kit-i="1"] .frx-zone[data-z="1"] b,.frx-fit[data-kit-i="2"] .frx-zone[data-z="2"] b{color:var(--ink)}
.frx-toks{position:absolute;inset:0;pointer-events:none}
.frx-tok{position:absolute;display:flex;align-items:center;justify-content:center;width:46px;height:46px;margin:-23px 0 0 -23px;border-radius:50%;background:var(--sand2);color:var(--ink);font-family:var(--mono);font-size:13.5px;font-weight:500;opacity:0;transform:scale(.6);transition:opacity .45s ease,transform .55s var(--bmk-enter),background-color .45s ease,color .45s ease,box-shadow .45s ease;transition-delay:var(--dl),var(--dl),0s,0s,0s}
.bmk-seen .frx-tok{opacity:1;transform:none}
.frx-fit[data-kit-i="0"] .bmk-seen .frx-tok:not([data-z="0"]),.frx-fit[data-kit-i="1"] .bmk-seen .frx-tok:not([data-z="1"]),.frx-fit[data-kit-i="2"] .bmk-seen .frx-tok:not([data-z="2"]){opacity:.32}
.frx-fit[data-kit-i="0"] .frx-tok[data-z="0"],.frx-fit[data-kit-i="1"] .frx-tok[data-z="1"],.frx-fit[data-kit-i="2"] .frx-tok[data-z="2"]{background:var(--ink);color:#FFFFFF}
.frx-fit[data-kit-i="0"] .frx-tok[data-best="0"],.frx-fit[data-kit-i="1"] .frx-tok[data-best="1"],.frx-fit[data-kit-i="2"] .frx-tok[data-best="2"]{box-shadow:0 0 0 3px var(--object),0 0 0 6px var(--amber)}
.frx-ax{position:absolute;font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--taupe);white-space:nowrap;text-align:center}
.frx-ax-x{left:30px;right:0;bottom:2px}
.frx-ax-y{left:0;top:0;bottom:30px;width:18px;writing-mode:vertical-rl;transform:rotate(180deg)}
.frx-fit-panels{display:grid;min-width:0}
.frx-fit-p{grid-area:1/1;display:flex;flex-direction:column;gap:18px;background:var(--object);border-radius:20px;box-shadow:var(--bmk-lift);padding:clamp(20px,2.8vw,40px);min-width:0}
.frx-say{font-size:clamp(26px,2.6vw,38px);line-height:1.08;letter-spacing:-.038em;font-weight:700;color:var(--fg)}
.frx-say span{color:var(--fg3)}
.frx-spec{display:grid;margin:0;border-top:1px solid var(--rule)}
.frx-spec>div{display:grid;grid-template-columns:104px minmax(0,1fr);gap:16px;padding:14px 0;border-bottom:1px solid var(--rule);align-items:baseline}
.frx-spec>div:has(>dd:empty){display:none}
.clean .frx-spec>div:has(>dd>.draft:only-child){display:none}
.frx-spec dt{font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--fg3)}
.frx-spec dd{margin:0;font-size:16px;line-height:1.5;color:var(--fg)}
.frx-fit-go{margin-top:auto;align-self:flex-start}
@media (max-width:1080px){.frx-fit-body{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
@media (max-width:820px){
  .frx-fit-body{grid-template-columns:minmax(0,1fr)}
  .frx-map{max-width:560px;width:100%;justify-self:center}
}
@media (max-width:560px){
  .frx-fit-tabs{flex-direction:column}
  .frx-fit-tabs [role="tab"]{min-height:48px;padding:0 16px}
  .frx-fit-tabs [role="tab"] b{font-size:15px}
  .frx-fit-body{border-radius:18px;padding:14px 12px 16px}
  .frx-map{padding:0 0 26px 24px}
  .frx-map-grid{aspect-ratio:1/1.16;gap:6px}
  .frx-zone{padding:10px;gap:7px;border-radius:12px}
  .frx-zone b{font-size:12.5px;max-width:none}
  .frx-zn{height:22px;padding:0 7px;font-size:10.5px}
  [data-sol] .frx-zn-c .draft{height:22px;padding:0 7px;font-size:10px}
  .frx-tok{width:32px;height:32px;margin:-16px 0 0 -16px;font-size:11px}
  .frx-fit[data-kit-i="0"] .frx-tok[data-best="0"],.frx-fit[data-kit-i="1"] .frx-tok[data-best="1"],.frx-fit[data-kit-i="2"] .frx-tok[data-best="2"]{box-shadow:0 0 0 2px var(--object),0 0 0 4.5px var(--amber)}
  .frx-ax{font-size:10px}
  .frx-ax-x{left:24px;bottom:0}
  .frx-ax-y{bottom:26px;width:14px}
  .frx-fit-p{padding:20px 18px;border-radius:16px}
  .frx-spec>div{grid-template-columns:minmax(0,1fr);gap:4px}
}

/* ---------- 5 · questions ---------- */
.frx-faq-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:clamp(24px,5vw,88px);align-items:start}
.frx-faq-head{position:sticky;top:96px;display:flex;flex-direction:column;gap:18px}
@media (max-width:820px){.frx-faq-grid{grid-template-columns:minmax(0,1fr)}.frx-faq-head{position:static}}

/* ---------- 6 · close ---------- */
.frx-end-cell{padding-block:clamp(84px,10vw,150px)!important}
.frx-end-head{display:flex;flex-direction:column;align-items:flex-start;gap:24px}
.frx-end-h{font-size:clamp(42px,6.2vw,96px);max-width:13ch}
.frx-next{display:grid;grid-template-columns:auto auto minmax(0,1fr) auto;align-items:baseline;gap:8px 18px;margin-top:clamp(44px,5vw,72px);padding:22px 4px;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);color:inherit}
.frx-next:hover{text-decoration:none;background:var(--subtle)}
.frx-next b{font-size:clamp(20px,1.9vw,26px);letter-spacing:-.025em}
.frx-next span:not(.frx-k){font-size:15px;color:var(--fg3)}
.frx-next i{font-style:normal;font-size:22px;transition:transform .2s ease}
.frx-next:hover i{transform:translateX(4px)}
@media (max-width:560px){.frx-next{grid-template-columns:auto minmax(0,1fr) auto}.frx-next span:not(.frx-k){grid-column:1/-1;grid-row:2}}