/* Clients Finder — legal pages (privacy, refund, terms).
   Scoped to .cf-legal so it cannot touch anything else on the site.
   The page content already ships with .cf-legal-hero / -callout / -toc /
   -prose blocks; this file lays them out and gives them the brand type. */

.cf-legal{
 --ink:#10265E;--ink-2:#1B3A73;--muted:#5A6C93;--line:#ECE4DB;--soft:#FBF7F2;
 --orange:#F4531F;--orange-deep:#D33F10;--tint:#FFF3EC;
 font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;
 color:var(--muted);line-height:1.75;-webkit-font-smoothing:antialiased;
 max-width:1200px;margin:0 auto;padding:0 56px 96px;
 display:grid;grid-template-columns:minmax(0,1fr) 296px;column-gap:56px;align-items:start}
.cf-legal *{box-sizing:border-box}
.cf-legal strong,.cf-legal b{color:var(--ink);font-weight:800}
.cf-legal a{color:var(--orange-deep);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1.5px}
.cf-legal a:hover{color:var(--orange)}

/* ------------------------------------------------------------------ hero */
.cf-legal-hero{grid-column:1;padding:40px 0 0}
.cf-legal-hero .eyebrow{display:inline-block;margin:0 0 18px;padding:8px 15px;border-radius:999px;
 font:800 12px/1 'Plus Jakarta Sans',sans-serif;letter-spacing:.16em;text-transform:uppercase;
 color:var(--orange-deep);background:var(--tint)}
.cf-legal-hero h1{margin:0;font-family:'Bricolage Grotesque',Georgia,serif;font-weight:800;color:var(--ink);
 font-size:clamp(34px,4.6vw,56px);line-height:1.04;letter-spacing:-.04em;max-width:18ch}
.cf-legal-hero .lead{margin:20px 0 0;font-size:18.5px;line-height:1.7;max-width:62ch;color:var(--muted)}
.cf-legal-hero-text{display:block}

/* --------------------------------------------------------------- callout */
.cf-legal-callout{grid-column:1;margin:30px 0 0;padding:22px 26px;border-radius:18px;
 background:#fff;border:1px solid var(--line);border-left:4px solid var(--orange);
 font-size:16px;line-height:1.7}
.cf-legal-callout strong{color:var(--ink)}

/* ------------------------------------------------- table of contents */
.cf-legal-toc{grid-column:2;grid-row:1 / span 99;align-self:start;position:sticky;top:96px;
 display:flex;flex-direction:column;gap:2px;padding:20px;margin:40px 0 0;
 border-radius:20px;background:#fff;border:1px solid var(--line)}
.cf-legal-toc::before{content:"On this page";display:block;margin:0 6px 12px;
 font:800 11.5px/1 'Plus Jakarta Sans',sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#9AA6C0}
.cf-legal-toc a{display:block;padding:10px 12px;border-radius:11px;border-left:2px solid transparent;
 font:700 14.5px/1.45 'Plus Jakarta Sans',sans-serif;color:var(--ink);text-decoration:none;
 transition:background .16s,color .16s,border-color .16s}
.cf-legal-toc a:hover{color:var(--orange-deep);background:var(--soft);border-left-color:var(--orange)}

/* ----------------------------------------------------------------- prose */
.cf-legal-prose{grid-column:1;margin:40px 0 0;max-width:74ch}
.cf-legal-prose h2{margin:44px 0 14px;scroll-margin-top:110px;
 font-family:'Bricolage Grotesque',Georgia,serif;font-weight:800;color:var(--ink);
 font-size:clamp(23px,2.4vw,29px);line-height:1.2;letter-spacing:-.03em}
.cf-legal-prose h2:first-child{margin-top:0}
.cf-legal-prose h3{margin:30px 0 10px;font-family:'Bricolage Grotesque',Georgia,serif;font-weight:800;
 color:var(--ink-2);font-size:19.5px;line-height:1.3;letter-spacing:-.02em}
.cf-legal-prose p{margin:0 0 16px;font-size:16.5px;line-height:1.8}
.cf-legal-prose ul,.cf-legal-prose ol{margin:0 0 18px;padding-left:0;list-style:none;display:grid;gap:11px}
.cf-legal-prose li{position:relative;padding-left:30px;font-size:16.5px;line-height:1.75}
.cf-legal-prose ul>li::before{content:"";position:absolute;left:8px;top:11px;width:7px;height:7px;
 border-radius:50%;background:var(--orange)}
.cf-legal-prose ol{counter-reset:cfl}
.cf-legal-prose ol>li{counter-increment:cfl}
.cf-legal-prose ol>li::before{content:counter(cfl);position:absolute;left:0;top:2px;
 display:grid;place-items:center;width:22px;height:22px;border-radius:7px;
 font:800 12px/1 'Plus Jakarta Sans',sans-serif;color:var(--orange-deep);background:var(--tint)}
.cf-legal-prose hr{margin:38px 0;border:0;border-top:1px solid var(--line)}
.cf-legal-prose table{width:100%;margin:0 0 20px;border-collapse:collapse;
 border:1px solid var(--line);border-radius:14px;overflow:hidden;font-size:15.5px}
.cf-legal-prose th,.cf-legal-prose td{padding:13px 16px;text-align:left;border-bottom:1px solid var(--line)}
.cf-legal-prose th{font:800 13.5px/1.3 'Plus Jakarta Sans',sans-serif;color:var(--ink);background:var(--soft)}
.cf-legal-prose tr:last-child td{border-bottom:0}

/* the small "last updated" line that some pages end (or start) with */
.cf-legal-tiny{grid-column:1;margin:26px 0 0;padding:14px 18px;border-radius:14px;
 background:var(--soft);border:1px solid var(--line);
 font-size:13.5px;line-height:1.65;color:#8A95AE;max-width:74ch}
.cf-legal-tiny a{color:#7C8AA6}

/* the .rise class is the site's reveal animation; make sure nothing can
   leave a legal page invisible if that script does not run */
.cf-legal .rise{opacity:1;transform:none}

@media(max-width:1023px){
 .cf-legal{padding-left:40px;padding-right:40px}
 .cf-legal{grid-template-columns:minmax(0,1fr);column-gap:0}
 .cf-legal-hero,.cf-legal-callout,.cf-legal-toc,.cf-legal-prose,.cf-legal-tiny{grid-column:1}
 .cf-legal-toc{position:static;flex-direction:row;flex-wrap:wrap;gap:8px;margin-top:26px;padding:16px}
 .cf-legal-toc::before{flex:1 0 100%;margin:0 2px 4px}
 .cf-legal-toc a{border-left:0;padding:9px 14px;border-radius:999px;background:var(--soft)}
 .cf-legal-toc a:hover{border-left:0;background:var(--tint)}
 .cf-legal-prose{margin-top:30px}
}
@media(max-width:640px){
 .cf-legal{padding:0 20px 64px}
 .cf-legal-hero{padding-top:26px}
 .cf-legal-hero .lead{font-size:16.5px}
 .cf-legal-callout{padding:18px 18px;border-radius:14px;font-size:15.5px}
 .cf-legal-prose p,.cf-legal-prose li{font-size:16px}
 .cf-legal-prose h2{margin-top:34px}
}