/* =========================================================================
   RightSite — Brand Design System v3  (Fable-report-faithful)
   Source of truth: the L2 report (template.html) + intake_form.html.
   DNA: JetBrains Mono BASE font · Almarai only for narrative/labels/hints ·
   Libre Baskerville titles · translucent-black cards with the deep double
   shadow · small uppercase mono buttons · underline fields · thin dividers.
   ========================================================================= */

:root{
  --navy:#182241; --cream:#F5F0E7; --sage:#A1AF86;
  --green:#5fd3a1; --amber:#e8c162; --red:#e88;
  --line:rgba(245,240,231,.13);
  --shadow:0 2px 8px rgba(0,0,0,.30),0 18px 44px rgba(0,0,0,.48);
  --card-bg:rgba(0,0,0,.22);
  --serif:'Libre Baskerville',Georgia,'Times New Roman',serif;
  --sans:'Almarai',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --mono:'JetBrains Mono',ui-monospace,'SF Mono',Menlo,monospace;
}

*{ box-sizing:border-box; }
html{ overflow-y:scroll; }
body{ background:var(--navy); color:var(--cream); font-family:var(--mono); margin:0; -webkit-font-smoothing:antialiased; }
a{ color:inherit; text-decoration:none; }

/* ---- layout ---- */
.wrap{ max-width:1568px; margin:0 auto; padding:0 120px 210px; }
.wrap.narrow{ max-width:820px; }
.wrap.slim{ max-width:520px; }
.wrap.wide{ max-width:1220px; }
.grid{ display:grid; gap:12px; }
.g2{ grid-template-columns:1fr 1fr; } .g3{ grid-template-columns:repeat(3,1fr); } .g4{ grid-template-columns:repeat(4,1fr); }
.span2{ grid-column:1 / -1; }
@media(max-width:760px){ .g2,.g3,.g4{ grid-template-columns:1fr; } }

/* ---- topbar (report chrome) ---- */
/* Header sized to match rightsite.net: ~102px tall, 40px logo (Jim 2026-07-08) */
.topbar{ display:flex; align-items:center; gap:22px; padding:31px 0; border-bottom:1px solid var(--line); margin-bottom:18px; }
.topbar img{ height:40px; display:block; }
.topbar .spacer{ flex:1; }
.topnav{ display:flex; gap:22px; }
.topnav a{ font-size:11.5px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:rgba(245,240,231,.5); padding:6px 2px; white-space:nowrap; }
.topnav a:hover, .topnav a.on{ color:var(--cream); }
.acct{ font-family:var(--sans); font-size:11.5px; color:rgba(245,240,231,.5); }
@media(max-width:720px){ .topnav{ display:none; } }

/* ---- type ---- */
.kick{ font-size:11.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--sage); font-weight:800; }
h1.title{ font-family:var(--serif); font-weight:400; font-size:38px; line-height:1.08; letter-spacing:-.02em; margin:14px 0 4px; }
.h2{ font-family:var(--serif); font-weight:400; font-size:21px; letter-spacing:-.01em; margin:0; }
.secnum{ font-family:var(--serif); font-size:13px; color:var(--sage); opacity:.7; margin-right:6px; }
.sec-head{ display:flex; align-items:baseline; gap:6px; margin:36px 0 10px; padding-top:16px; border-top:1px solid var(--line); }
.narr{ font-family:var(--sans); font-size:13.5px; color:rgba(245,240,231,.62); line-height:1.55; margin:2px 0 22px; max-width:660px; }
.ital{ font-family:var(--sans); font-style:italic; font-size:12.5px; color:rgba(245,240,231,.5); line-height:1.5; margin-top:12px; }
.hint{ font-family:var(--sans); font-size:11px; color:rgba(245,240,231,.6); margin-top:3px; }
.muted{ color:rgba(245,240,231,.45); }
.center{ text-align:center; }
.err{ color:var(--red); font-family:var(--sans); font-size:12.5px; }

/* ---- buttons (report style: small uppercase mono) ---- */
.btn{ display:inline-block; cursor:pointer; font-family:var(--mono); font-weight:800; letter-spacing:.07em; font-size:12px; text-transform:uppercase; background:var(--sage); color:var(--navy); border:0; border-radius:8px; padding:12px 20px; text-align:center; transition:.15s; }
.btn:hover{ filter:brightness(1.08); }
.btn.ghost{ background:transparent; color:var(--sage); border:1px solid var(--sage); }
.btn.ghost:hover{ background:rgba(161,175,134,.1); filter:none; }
.btn.sm{ padding:9px 14px; font-size:11px; }
.btn.block{ display:block; width:100%; }

/* ---- cards (the shadow is the signature) ---- */
.card{ background:var(--card-bg); border:1px solid var(--line); border-radius:14px; padding:16px 18px; box-shadow:var(--shadow); }

/* ---- KPI (report klabel/kval/krng) ---- */
.klabel{ font-family:var(--sans); font-size:11.5px; letter-spacing:.08em; text-transform:uppercase; color:rgba(245,240,231,.55); }
.kval{ font-size:26px; font-weight:800; margin-top:6px; }
.krng{ font-family:var(--sans); font-size:11px; color:rgba(245,240,231,.45); margin-top:4px; }

/* ---- fields (report underline style) ---- */
.field{ display:flex; flex-direction:column; gap:2px; border-bottom:1px solid var(--line); padding:5px 0; }
.field label{ font-family:var(--sans); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:rgba(245,240,231,.82); }
.field input, .field select, .field textarea{ font-family:var(--mono); font-size:14px; background:transparent; border:0; outline:none; color:var(--cream); padding:7px 2px; width:100%; }
.field select option{ background:var(--navy); }
.field input:focus, .field select:focus, .field textarea:focus{ background:rgba(161,175,134,.08); }
.field textarea{ font-family:var(--sans); font-size:13.5px; min-height:84px; resize:vertical; line-height:1.5; }

/* ---- verdict & badges (report exact) ---- */
.fbox{ display:inline-flex; align-items:center; gap:8px; padding:10px 18px; border-radius:14px; font-weight:800; letter-spacing:.05em; font-size:15px; }
.go{ background:rgba(95,211,161,.15); color:var(--green); border:1px solid rgba(95,211,161,.4); }
.hold{ background:rgba(232,193,98,.13); color:var(--amber); border:1px solid rgba(232,193,98,.4); }
.nogo{ background:rgba(238,136,136,.12); color:var(--red); border:1px solid rgba(238,136,136,.4); }
.pbadge{ display:inline-block; font-size:10.5px; font-weight:800; letter-spacing:.06em; padding:2px 8px; border-radius:6px; }
.pb-open{ background:rgba(95,211,161,.15); color:var(--green); border:1px solid rgba(95,211,161,.35); }
.pb-verify{ background:rgba(232,193,98,.15); color:var(--amber); border:1px solid rgba(232,193,98,.35); }
.pb-flag{ background:transparent; color:var(--amber); border:1px dashed rgba(232,193,98,.5); }
.pb-util{ background:rgba(161,175,134,.15); color:var(--sage); border:1px solid rgba(161,175,134,.4); }
.pb-nogo{ background:rgba(238,136,136,.12); color:var(--red); border:1px solid rgba(238,136,136,.35); }

/* ---- table (report exact, right-aligned figures) ---- */
table.t{ width:100%; border-collapse:collapse; font-size:12.5px; margin-top:10px; }
table.t th{ font-family:var(--sans); font-size:11px; letter-spacing:.07em; text-transform:uppercase; color:rgba(245,240,231,.55); text-align:right; padding:7px 8px; border-bottom:1px solid var(--line); }
table.t td{ text-align:right; padding:7px 8px; border-bottom:1px solid rgba(245,240,231,.06); }
table.t th:first-child, table.t td:first-child{ text-align:left; }
table.t th.l, table.t td.l{ text-align:left; }

/* ---- choice cards (intake typegrid) ---- */
.typegrid{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.typegrid.two{ grid-template-columns:1fr 1fr; }
.type{ cursor:pointer; border:1px solid var(--line); border-radius:12px; padding:14px 12px; background:rgba(0,0,0,.18); }
.type.on{ border-color:var(--sage); background:rgba(161,175,134,.12); }
.type .tname{ font-weight:800; font-size:13px; }
.type .tdesc{ font-family:var(--sans); font-size:11px; color:rgba(245,240,231,.55); margin-top:5px; line-height:1.45; }
@media(max-width:720px){ .typegrid, .typegrid.two{ grid-template-columns:1fr 1fr; } }

/* ---- advanced accordion (intake) ---- */
details.adv{ border:1px solid var(--line); border-radius:14px; background:rgba(0,0,0,.18); padding:4px 18px; margin-top:14px; }
details.adv summary{ cursor:pointer; font-family:var(--sans); font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:rgba(245,240,231,.6); padding:10px 0; list-style:none; }
details.adv summary::-webkit-details-marker{ display:none; }
details.adv summary::before{ content:"+ "; }
details.adv[open] summary::before{ content:"– "; }

/* ---- pricing packs ---- */
.packs{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.pcard{ background:var(--card-bg); border:1px solid var(--line); border-radius:14px; padding:24px 22px 20px; box-shadow:var(--shadow); display:flex; flex-direction:column; position:relative; }
.pcard.pop{ border-color:var(--sage); }
.pcard h3{ font-family:var(--serif); font-weight:400; font-size:19px; margin:0 0 10px; }
.price-lg{ font-family:var(--serif); font-size:40px; line-height:1; margin:4px 0 8px; }
.price-lg.green{ color:var(--green); }
.price-sub{ font-size:11px; color:rgba(245,240,231,.45); line-height:1.6; min-height:2.6em; }
.rule{ height:1px; background:var(--line); margin:16px 0; border:0; }
.best-for-l{ font-size:10.5px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:rgba(245,240,231,.4); margin-bottom:4px; }
.best-for-t{ font-family:var(--sans); font-size:12.5px; color:rgba(245,240,231,.62); margin:0 0 18px; min-height:3em; line-height:1.5; }
.pcard .btn{ margin-top:auto; }
.footnote{ font-size:10.5px; color:rgba(245,240,231,.4); margin-top:12px; line-height:1.55; }
.pop-pill{ position:absolute; top:-11px; left:50%; transform:translateX(-50%); background:var(--sage); color:var(--navy); font-size:10px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; padding:4px 12px; border-radius:999px; white-space:nowrap; box-shadow:0 2px 8px rgba(0,0,0,.35); }
.check{ display:flex; align-items:flex-start; gap:10px; padding:8px 0; font-family:var(--sans); font-size:13px; color:rgba(245,240,231,.7); }
.check svg{ flex:0 0 auto; width:17px; height:17px; color:var(--sage); margin-top:1px; }
@media(max-width:1000px){ .packs{ grid-template-columns:1fr 1fr; } }
@media(max-width:640px){ .packs{ grid-template-columns:1fr; } }

/* ---- Google Places autocomplete dropdown (address autofill) ---- */
.pac-container{ background:#1e2a48; border:1px solid var(--line); border-radius:10px; box-shadow:var(--shadow); font-family:var(--sans); margin-top:4px; }
.pac-item{ border-top:1px solid rgba(245,240,231,.07); padding:8px 12px; color:rgba(245,240,231,.7); font-size:12.5px; cursor:pointer; }
.pac-item:first-child{ border-top:0; }
.pac-item:hover, .pac-item-selected{ background:rgba(161,175,134,.12); }
.pac-item-query{ color:var(--cream); font-size:13px; }
.pac-matched{ color:var(--sage); }
.pac-icon{ display:none; }
.pac-logo:after{ opacity:.4; }

/* ---- misc ---- */
.no-print{}
@media print{ .no-print{ display:none!important; } body{ background:var(--navy); -webkit-print-color-adjust:exact; print-color-adjust:exact; } }