/* =============================================================================
   Fulkram V2, design system. Direction 1A "Ledger" extended for a multi-page,
   proof-led site. Paper-dominant, hairlines instead of cards, one violet accent.
   Canonical brand rules: brand/fulkram/README.md
   ============================================================================= */
@font-face{font-family:'Sora';font-style:normal;font-weight:300 800;font-display:swap;src:url(/fonts/sora.woff2) format('woff2');}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/jetbrains-mono.woff2) format('woff2');}

:root{
  color-scheme: light;
  --paper:#F4F4F2; --card:#FFFFFF; --ink:#111110; --ink2:#55554F; --muted:#6E6E68; --faint:#70706A;
  --rule:#DEDEDA; --rule-strong:#111110;
  --band:#111110; --band-ink:#FFFFFF; --band-mut:#8A8A85; --band-body:#B5B5B0; --band-rule:#2A2A28;
  --accent:oklch(0.55 0.13 300); --on-accent:#FFFFFF;
  --sans:Sora,"Helvetica Neue",Arial,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,Menlo,Monaco,monospace;
  --pad:clamp(20px,5vw,64px); --maxw:1200px; --measure:70ch;
}
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;}*{animation:none!important;transition:none!important;}}
[id]{scroll-margin-top:96px;}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden;}
img,svg{display:block;max-width:100%;height:auto;}
a{color:var(--accent);text-underline-offset:3px;}
p{margin:0 0 15px;max-width:var(--measure);}
h1,h2,h3,h4{margin:0;font-weight:600;letter-spacing:-0.03em;text-wrap:pretty;}
strong,b{font-weight:600;color:var(--ink);}
code{font-family:var(--mono);font-size:0.88em;background:#EAEAE6;padding:1px 5px;}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;}
.skip{position:absolute;left:-9999px;top:0;background:var(--ink);color:var(--paper);padding:10px 16px;z-index:200;}
.skip:focus{left:0;}

/* --- layout ---------------------------------------------------------------- */
.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--pad);}
.sec{padding-block:clamp(48px,7vw,84px);}
.rule-t{border-top:1px solid var(--rule);}
.eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);}
.lede{font-size:17px;line-height:1.65;color:var(--ink2);max-width:62ch;}
.h1{font-size:clamp(30px,4.6vw,52px);letter-spacing:-0.035em;line-height:1.05;}
.h2{font-size:clamp(24px,3.2vw,32px);line-height:1.15;}
.h3{font-size:20px;letter-spacing:-0.02em;}

/* --- bar ------------------------------------------------------------------- */
.bar{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--paper) 92%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--rule);}
.bar .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:16px;}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--ink);}
.brand svg{color:var(--ink);flex:none;}
.brand b{font-size:20px;font-weight:600;letter-spacing:-0.035em;}
.bar nav{display:flex;align-items:center;gap:clamp(12px,2.2vw,26px);font-size:14px;flex-wrap:wrap;justify-content:flex-end;}
.bar nav a{color:var(--ink2);text-decoration:none;padding-block:4px;}
.bar nav a:hover{color:var(--ink);}
.bar nav a[aria-current="true"]{color:var(--ink);border-bottom:2px solid var(--accent);}
.bar nav .cta{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;border-bottom:1px solid var(--ink);color:var(--ink);padding-bottom:2px;}
@media (max-width:820px){.bar nav a.thin{display:none;}}

/* --- page head ------------------------------------------------------------- */
.pagehead{padding-block:clamp(44px,7vw,80px) clamp(28px,4vw,44px);display:flex;flex-direction:column;gap:18px;}
.pagehead .demand{font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);}
.crumb{font-family:var(--mono);font-size:12px;color:var(--faint);}
.crumb a{color:var(--faint);text-decoration:none;}
.crumb a:hover{color:var(--ink);}

/* --- chips ------------------------------------------------------------------ */
.chip{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;padding:3px 8px;white-space:nowrap;vertical-align:middle;}
.chip-live{background:var(--ink);color:var(--paper);}
.chip-shot{border:1px solid var(--ink2);color:var(--ink2);}
.chip-proto{border:1px dashed var(--muted);color:var(--muted);}
.chip-notproven{border:1px solid var(--accent);color:var(--accent);}
.chip-past{border:1px solid var(--rule);color:var(--faint);}

/* --- claim chips (ledger-backed numbers) ------------------------------------ */
a.claim{color:inherit;text-decoration:none;border-bottom:1px dotted color-mix(in srgb,var(--muted) 50%,transparent);cursor:help;}
a.claim:hover{border-bottom-color:var(--accent);color:var(--accent);}

/* --- door grid --------------------------------------------------------------- */
.doors{display:grid;gap:1px;background:var(--rule);border-block:1px solid var(--rule);}
@media(min-width:680px){.doors{grid-template-columns:repeat(2,1fr);}}
@media(min-width:1040px){.doors{grid-template-columns:repeat(4,1fr);}}
.door{background:var(--paper);padding:26px 24px 24px;display:flex;flex-direction:column;gap:10px;text-decoration:none;color:var(--ink);min-height:190px;transition:background .15s ease;}
.door:hover{background:var(--card);}
.door .d{font-family:var(--mono);font-size:11px;letter-spacing:.08em;color:var(--muted);}
.door h3{font-size:17.5px;line-height:1.3;letter-spacing:-0.02em;}
.door p{font-size:13.5px;line-height:1.55;color:var(--ink2);margin:0;}
.door .go{margin-top:auto;font-family:var(--mono);font-size:12px;color:var(--ink);}
.door:hover .go{color:var(--accent);}

/* --- proof rows -------------------------------------------------------------- */
.prow{display:grid;grid-template-columns:1fr;gap:10px 32px;padding-block:24px;border-top:1px solid var(--rule);}
@media(min-width:860px){.prow{grid-template-columns:150px 1.2fr 1fr;}}
.prow:last-child{border-bottom:1px solid var(--rule);}
.prow .metric{font-family:var(--mono);font-size:21px;font-weight:500;letter-spacing:-0.02em;font-variant-numeric:tabular-nums;line-height:1.25;}
.prow h3{font-size:17.5px;margin-bottom:7px;}
.prow p{font-size:14.5px;line-height:1.65;color:var(--ink2);margin:0;}
.prow .see{font-size:14px;}
.prow .see .lbl{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);display:block;margin-bottom:6px;}

/* --- headrow ------------------------------------------------------------------ */
.headrow{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding-bottom:20px;border-bottom:1px solid var(--rule-strong);flex-wrap:wrap;}
.headrow .l{display:flex;flex-direction:column;gap:12px;}
.headrow .r{font-size:14px;color:var(--ink2);max-width:320px;}
@media(min-width:820px){.headrow .r{text-align:right;}}

/* --- buyer quote ------------------------------------------------------------- */
.bq{border-left:2px solid var(--rule-strong);padding:4px 0 4px 18px;margin:22px 0;max-width:62ch;}
.bq q{font-size:16.5px;line-height:1.6;color:var(--ink);quotes:'\201C' '\201D';font-style:normal;}
.bq .who{display:block;margin-top:8px;font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;color:var(--faint);}

/* --- testimonial clips: the video, then the words said in it ------------------ */
.clips{display:grid;gap:34px 26px;margin-block:30px;}
.clips.wide{max-width:980px;}
@media(min-width:820px){.clips.wide{grid-template-columns:repeat(2,minmax(0,1fr));}}
.clips.tall{grid-template-columns:minmax(0,300px);}
@media(min-width:600px){.clips.tall{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(min-width:1000px){.clips.tall{grid-template-columns:repeat(4,minmax(0,1fr));}}
.clip{margin:0;display:flex;flex-direction:column;gap:12px;}
.clip .frame{position:relative;width:100%;aspect-ratio:16/9;background:var(--ink);border:1px solid var(--rule);overflow:hidden;}
.clips.tall .frame{aspect-ratio:9/16;}
.clip .frame.square{aspect-ratio:1/1;}
.clip iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.clip .bq{margin:0;}
.clip .bq q{font-size:15px;}
.clip.full{max-width:620px;margin-top:34px;}
.clip figcaption{font-size:13px;line-height:1.6;color:var(--ink2);}
.clip figcaption b{color:var(--ink);}

/* --- questions page: native details/summary, no script needed ---------------- */
.qas{margin-top:26px;max-width:760px;border-top:1px solid var(--rule);}
.qa{border-bottom:1px solid var(--rule);padding:4px 0;}
.qa summary{cursor:pointer;list-style:none;padding:16px 28px 16px 0;position:relative;font-size:17px;font-weight:500;color:var(--ink);}
.qa summary::-webkit-details-marker{display:none;}
.qa summary::after{content:"+";position:absolute;right:4px;top:14px;font-family:var(--mono);color:var(--muted);}
.qa[open] summary::after{content:"\2212";}
.qa > div{padding:0 0 18px;max-width:66ch;color:var(--ink2);}

/* --- NOT PROVEN block --------------------------------------------------------- */
.notproven{border:1px solid var(--accent);border-left-width:4px;padding:20px 22px;margin:24px 0;max-width:70ch;}
.notproven .lbl{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);display:block;margin-bottom:10px;}
.notproven p{font-size:15px;color:var(--ink2);margin-bottom:10px;}
.notproven p:last-child{margin-bottom:0;}

/* --- figures ------------------------------------------------------------------ */
.figs{display:grid;gap:30px;margin-block:32px;}
@media(min-width:760px){.figs{grid-template-columns:repeat(2,1fr);}}
.figs.one{grid-template-columns:1fr;max-width:760px;}
.figs figure{margin:0;display:flex;flex-direction:column;gap:11px;}
.figs img{width:100%;border:1px solid var(--rule);}
.figs figcaption{font-size:13px;line-height:1.6;color:var(--ink2);}
.figs figcaption b{color:var(--ink);}

/* --- steps / numbered ---------------------------------------------------------- */
.numrow{display:grid;grid-template-columns:44px 1fr;gap:20px;padding-block:22px;border-top:1px solid var(--rule);}
.numrow:last-child{border-bottom:1px solid var(--rule);}
.numrow .n{font-family:var(--mono);font-size:13px;color:var(--faint);}
.numrow h3{font-size:17.5px;margin-bottom:7px;}
.numrow p{font-size:14.5px;color:var(--ink2);margin:0;}

/* --- link list ------------------------------------------------------------------ */
.openable{margin:22px 0;padding:0;list-style:none;border-top:1px solid var(--rule);}
.openable li{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:13px 0;border-bottom:1px solid var(--rule);font-size:15px;flex-wrap:wrap;}
.openable .what{color:var(--ink2);}
.openable .what b{color:var(--ink);}
.openable a.open{font-family:var(--mono);font-size:13px;white-space:nowrap;}

/* --- band ------------------------------------------------------------------------ */
.band{background:var(--band);color:var(--band-ink);}
.band .eyebrow{color:var(--band-mut);}
.band h2,.band h3{color:#fff;}
.band p{color:var(--band-body);}
.band .wrap{padding-block:clamp(48px,7vw,76px);}
.pull{font-size:clamp(22px,3vw,30px);font-weight:600;letter-spacing:-0.03em;line-height:1.22;max-width:26ch;}

/* --- tables ----------------------------------------------------------------------- */
.scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;}
table{width:100%;border-collapse:collapse;font-size:14.5px;}
th,td{text-align:left;padding:11px 16px 11px 0;border-bottom:1px solid var(--rule);vertical-align:top;color:var(--ink2);}
th{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);font-weight:400;white-space:nowrap;}
td b{color:var(--ink);}

/* --- CTA block ---------------------------------------------------------------------- */
.ctablock{border-top:1px solid var(--rule-strong);margin-top:clamp(36px,5vw,56px);padding-top:26px;display:flex;flex-wrap:wrap;align-items:baseline;gap:14px 28px;}
.ctablock .big{font-size:19px;font-weight:600;letter-spacing:-0.02em;}
.linkline{display:inline-block;font-family:var(--mono);font-size:13px;letter-spacing:.06em;color:var(--ink);border-bottom:2px solid var(--accent);padding-bottom:4px;text-decoration:none;}
.linkline:hover{color:var(--accent);}

/* --- forms ---------------------------------------------------------------------------- */
.form{display:flex;flex-direction:column;gap:20px;max-width:560px;}
.form label{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);display:block;margin-bottom:7px;}
.form input,.form textarea,.form select{width:100%;background:transparent;border:0;border-bottom:1px solid var(--rule);padding:0 0 10px;font-family:var(--sans);font-size:15.5px;color:var(--ink);border-radius:0;}
.form select{appearance:none;-webkit-appearance:none;cursor:pointer;background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 12px) 45%,calc(100% - 7px) 45%;background-size:5px 5px;background-repeat:no-repeat;padding-right:24px;}
.form select:focus-visible{outline:none;border-bottom:2px solid var(--accent);}
.form .opt{display:flex;gap:12px;align-items:flex-start;font-family:var(--sans);font-size:14.5px;letter-spacing:0;text-transform:none;color:var(--ink2);cursor:pointer;margin:0;}
.form .opt input{width:auto;margin-top:4px;flex:none;accent-color:var(--accent);}
.form textarea{min-height:110px;resize:vertical;line-height:1.6;}
.form input::placeholder,.form textarea::placeholder{color:var(--faint);}
.form input:focus-visible,.form textarea:focus-visible{outline:none;border-bottom:2px solid var(--accent);}
.send{display:flex;align-items:center;gap:20px;flex-wrap:wrap;}
.send button{background:var(--ink);color:var(--paper);border:0;padding:15px 26px;font-family:var(--sans);font-size:14.5px;font-weight:500;cursor:pointer;}
.send button:hover{opacity:.88;}
.send button:disabled{opacity:.5;cursor:default;}
.form-status{font-size:13.5px;min-height:1.2em;color:var(--ink2);}
.form-status.ok{color:var(--accent);font-weight:500;}
.form-status.err{color:#B4322A;}
.hp{position:absolute;left:-9999px;height:1px;overflow:hidden;}

/* --- footer ------------------------------------------------------------------------------ */
footer{border-top:1px solid var(--rule);margin-top:clamp(40px,6vw,72px);}
footer .wrap{padding-block:32px 44px;display:flex;flex-direction:column;gap:20px;}
.foot-top{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;}
.foot-nav{display:flex;flex-wrap:wrap;gap:10px 24px;font-size:13px;}
.foot-nav a{color:var(--ink2);text-decoration:none;}
.foot-nav a:hover{color:var(--ink);}
.legal{font-family:var(--mono);font-size:11px;line-height:1.8;color:var(--faint);max-width:760px;}
.legal a{color:var(--faint);}

/* --- home hero with portrait (V1 pattern carried into V2) ------------------- */
.homehero{display:grid;gap:clamp(28px,5vw,64px);align-items:end;padding-block:clamp(40px,6vw,72px) clamp(32px,5vw,52px);}
@media(min-width:900px){.homehero{grid-template-columns:1.5fr 1fr;}}
.homehero .copy{display:flex;flex-direction:column;gap:clamp(18px,2.4vw,26px);}
.portrait{margin:0;display:flex;flex-direction:column;gap:12px;}
.portrait img{width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;object-position:50% 18%;border:1px solid var(--rule);}
.portrait figcaption{display:flex;justify-content:space-between;gap:16px;font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);}
@media(max-width:899px){.homehero .portrait{order:-1;}}

/* --- primary CTA button (audit round 3) ------------------------------------ */
.btn{display:inline-block;background:var(--ink);color:var(--paper);padding:15px 26px;font-size:14.5px;font-weight:500;text-decoration:none;border:0;cursor:pointer;}
.btn:hover{opacity:.88;}
/* claims table readability */
#main table td b{font-family:var(--mono);font-weight:500;font-size:13.5px;}
#main table td:last-child,#main table th:last-child{white-space:nowrap;}
/* phone: photo stays first (Dylan's call) but cropped so the headline shares the fold */
@media(max-width:899px){.homehero .portrait img{aspect-ratio:16/10;object-position:50% 12%;}}