/*
Theme Name: SEO Agencies Austin
Theme URI: https://seoagenciesaustin.com
Author: SEO Agencies Austin
Description: A lightweight directory & comparison theme for SEO agencies serving Austin, TX. Agencies are a custom post type with Specialty, Area and Industry taxonomies; profiles, category, comparison, and get-matched templates generate automatically. Classic PHP theme, no page builder required.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GPL-2.0-or-later
Text Domain: saa
*/

/* ============================================================
   SEO Agencies Austin — design system
   Dark mode is the DEFAULT; light via [data-theme="light"].
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@500;600&display=swap');

/* ---------- tokens ---------- */
:root{
  --accent:#3FA0DC; --accent-hover:#5CB2E6; --accent-soft:#10263A; --accent-contrast:#0B0B0E;
  --accent-text:#6FBBEF;
  --gold:#E0A53B;
  --bg:#0B0B0E; --bg-subtle:#131318; --surface:#17171D; --surface-2:#1D1D24;
  --border:#26262E; --border-strong:#34343E;
  --text:#F4F4F5; --text-muted:#A1A1AA; --text-faint:#71717A;
  --success:#22C55E; --warning:#F59E0B; --danger:#EF4444; --info:#3B82F6;
  --score-low:#EF4444; --score-mid:#F59E0B; --score-high:#22C55E;
  --radius:14px; --radius-sm:10px; --radius-pill:999px;
  --grid:rgba(255,255,255,.05);
  --glow1:rgba(80,170,235,.22); --glow2:rgba(80,170,235,.13); --glow3:rgba(59,130,246,.12);
  --shadow-sm:0 1px 2px rgba(0,0,0,.4);
  --shadow-md:0 6px 22px rgba(0,0,0,.45);
  --shadow-lg:0 18px 50px rgba(0,0,0,.55);
  --maxw:1200px;
  --ring:0 0 0 2px var(--bg), 0 0 0 4px var(--accent);
}
:root[data-theme="light"]{
  --accent:#2E90D9; --accent-hover:#2179BE; --accent-soft:#E8F3FB; --accent-contrast:#FFFFFF;
  --accent-text:#1E7CC2;
  --gold:#D9962A;
  --bg:#FFFFFF; --bg-subtle:#F7F7F5; --surface:#FFFFFF; --surface-2:#FBFBFA;
  --border:#E7E5E0; --border-strong:#D8D5CE;
  --text:#18181B; --text-muted:#6B7280; --text-faint:#9CA3AF;
  --shadow-sm:0 1px 2px rgba(16,16,20,.06);
  --shadow-md:0 4px 16px rgba(16,16,20,.08);
  --shadow-lg:0 12px 40px rgba(16,16,20,.12);
  --score-low:#DC2626; --score-mid:#D97706; --score-high:#16A34A;
  --grid:rgba(17,24,39,.07);
  --glow1:rgba(46,144,217,.20); --glow2:rgba(46,144,217,.12); --glow3:rgba(59,130,246,.10);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;background:var(--bg);}
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:'Inter',system-ui,sans-serif; font-size:16px; line-height:1.6;
  -webkit-font-smoothing:antialiased; transition:background .25s ease,color .25s ease;
}
h1,h2,h3,h4{margin:0;font-weight:700;letter-spacing:-.02em;line-height:1.1;color:var(--text);}
h1{font-size:2.5rem;} h2{font-size:1.875rem;line-height:1.2;}
h3{font-size:1.375rem;line-height:1.3;font-weight:600;letter-spacing:-.01em;}
h4{font-size:1.125rem;font-weight:600;letter-spacing:-.01em;}
p{margin:0;}
a{color:inherit;text-decoration:none;}
.mono{font-family:'JetBrains Mono',monospace;}
::selection{background:var(--accent);color:var(--accent-contrast);}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px;}
.section{padding:80px 0;}
.section.sm{padding:48px 0;}
.muted{color:var(--text-muted);} .faint{color:var(--text-faint);} .center{text-align:center;}
.bg-subtle{background:var(--bg);}

.eyebrow{font-size:.75rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-text);}
.label{font-size:.72rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--text-faint);}

/* ---------- nav ---------- */
.nav{position:sticky;top:0;z-index:50;border-bottom:1px solid transparent;transition:.25s;}
.nav.scrolled{background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:blur(12px);border-color:var(--border);}
.nav .row{display:flex;align-items:center;gap:22px;height:68px;}
.wordmark{font-weight:700;font-size:1.18rem;letter-spacing:-.02em;display:flex;align-items:center;}
.wordmark .dot{color:var(--accent);}
.nav .links{display:flex;gap:4px;margin-left:8px;}
.nav .links a{font-size:.93rem;color:var(--text-muted);padding:8px 12px;border-radius:8px;display:flex;align-items:center;gap:4px;transition:.15s;}
.nav .links a:hover{color:var(--text);background:var(--surface);}
.nav .spacer{flex:1;}
.nav .right{display:flex;align-items:center;gap:10px;}

/* ---------- buttons ---------- */
.btn{font-family:inherit;font-weight:600;font-size:.95rem;cursor:pointer;border:1px solid transparent;
  display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 18px;height:44px;
  border-radius:var(--radius-sm);transition:.16s ease;white-space:nowrap;line-height:1;}
.btn svg{width:17px;height:17px;}
.btn-primary{background:var(--accent);color:var(--accent-contrast);box-shadow:var(--shadow-sm);}
.btn-primary:hover{background:var(--accent-hover);transform:translateY(-1px);box-shadow:var(--shadow-md);}
.btn-secondary{background:var(--surface);border-color:var(--border);color:var(--text);}
.btn-secondary:hover{background:var(--surface-2);border-color:var(--border-strong);}
.btn-ghost{background:transparent;color:var(--text-muted);}
.btn-ghost:hover{color:var(--text);background:var(--surface);}
.btn-lg{height:52px;padding:0 26px;font-size:1.02rem;}
.btn-sm{height:36px;padding:0 14px;font-size:.875rem;}
.btn-block{width:100%;}
.btn:focus-visible{outline:none;box-shadow:var(--ring);}
.icon-btn{width:40px;height:40px;padding:0;display:grid;place-items:center;background:transparent;border:1px solid var(--border);color:var(--text-muted);border-radius:var(--radius-sm);cursor:pointer;transition:.15s;}
.icon-btn:hover{color:var(--text);border-color:var(--border-strong);}
.icon-btn svg{width:18px;height:18px;}

/* ---------- chips / badges ---------- */
.chip{display:inline-flex;align-items:center;gap:6px;font-size:.8rem;font-weight:500;color:var(--text-muted);
  padding:5px 11px;border:1px solid var(--border);border-radius:var(--radius-pill);background:var(--surface);white-space:nowrap;}
.chip svg{width:13px;height:13px;opacity:.8;}
.chip.solid{background:var(--accent-soft);color:var(--accent-text);border-color:transparent;}
.badge{display:inline-flex;align-items:center;gap:5px;font-size:.68rem;font-weight:700;letter-spacing:.05em;
  text-transform:uppercase;padding:4px 9px;border-radius:var(--radius-pill);}
.badge svg{width:12px;height:12px;}
.badge.feat{background:var(--accent-soft);color:var(--accent-text);border:1px solid color-mix(in srgb,var(--accent) 30%,transparent);}
.badge.ver{background:color-mix(in srgb,var(--success) 14%,transparent);color:var(--success);}

/* trust score pill */
.trust{font-family:'JetBrains Mono',monospace;font-weight:600;font-size:.95rem;
  display:inline-flex;align-items:center;justify-content:center;min-width:42px;padding:3px 10px;border-radius:8px;}
.trust.pending{background:var(--surface-2);color:var(--text-faint);border:1px dashed var(--border-strong);}

/* ---------- section header ---------- */
.shead{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:32px;}
.shead .eyebrow{margin-bottom:10px;}
.shead .seeall{font-size:.92rem;font-weight:600;color:var(--accent-text);white-space:nowrap;display:inline-flex;align-items:center;gap:5px;}
.shead .seeall svg{width:15px;height:15px;}

/* ---------- grids ---------- */
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}

/* ---------- agency card (compact, ColdEmailKit-style) ---------- */
.acard{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
  padding:15px 16px;display:flex;flex-direction:column;gap:9px;transition:.18s ease;position:relative;cursor:pointer;}
.acard:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--border-strong);}
.acard .ctop{display:flex;align-items:center;gap:11px;}
.mono-tile{width:38px;height:38px;flex:0 0 38px;border-radius:9px;background:var(--bg-subtle);
  color:var(--text);display:grid;place-items:center;font-weight:700;font-size:1.02rem;border:1px solid var(--border);
  position:relative;overflow:hidden;}
.mono-tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:6px;background:var(--surface);}
.acard .nm{flex:1;min-width:0;}
.acard .nmline{display:flex;align-items:center;gap:7px;}
.acard .nm h3{font-size:1.04rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.acard .nm .sub{font-size:.75rem;color:var(--text-faint);margin-top:1px;}
.crown svg{width:16px;height:16px;color:var(--gold);fill:var(--gold);}
.ver-check svg{width:16px;height:16px;color:var(--accent-text);}
.acard .desc{font-size:.84rem;color:var(--text-muted);line-height:1.45;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
/* dotted-leader stat list */
.slist{display:flex;flex-direction:column;gap:7px;margin-top:auto;padding-top:3px;}
.srow{display:flex;align-items:flex-end;gap:8px;font-size:.8rem;}
.srow .sl{display:flex;align-items:center;gap:7px;color:var(--text-muted);white-space:nowrap;}
.srow .sl svg{width:14px;height:14px;color:var(--text-faint);}
.srow .ldr{flex:1;border-bottom:1px dotted var(--border-strong);min-width:18px;margin-bottom:5px;}
.srow .sv{font-weight:600;color:var(--text);white-space:nowrap;}
.srow .sv.faint{color:var(--text-faint);font-weight:500;}

/* row variant (ranked list) */
.arow{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
  padding:18px 20px;display:grid;grid-template-columns:auto 46px 1fr auto auto;gap:18px;align-items:center;transition:.18s;}
.arow:hover{border-color:var(--border-strong);box-shadow:var(--shadow-md);}
.arow .rk{font-family:'JetBrains Mono';font-weight:600;font-size:1.1rem;color:var(--text-faint);width:26px;text-align:center;}
.arow .main{min-width:0;}
.arow .main h3{font-size:1.12rem;}
.arow .main .desc{font-size:.85rem;color:var(--text-muted);margin-top:3px;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;}
.arow .main .chips{margin-top:8px;}
.arow .rstats{display:flex;gap:22px;text-align:center;}
.arow .rstats .v{font-weight:700;font-size:1rem;} .arow .rstats .l{font-size:.64rem;letter-spacing:.08em;text-transform:uppercase;color:var(--text-faint);}
@media(max-width:860px){ .arow{grid-template-columns:auto 1fr;gap:12px;} .arow .rstats,.arow .acta{grid-column:2;justify-self:start;} }

/* ---------- tiles ---------- */
.tile{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:20px;
  display:flex;flex-direction:column;gap:10px;transition:.18s;}
.tile:hover{transform:translateY(-3px);border-color:var(--border-strong);box-shadow:var(--shadow-md);}
.tile .ic{width:40px;height:40px;border-radius:11px;background:var(--accent-soft);color:var(--accent-text);
  display:grid;place-items:center;}
.tile .ic svg{width:20px;height:20px;}
.tile h4{font-size:1.05rem;}
.tile .cnt{font-size:.85rem;color:var(--text-muted);display:flex;align-items:center;gap:5px;}
.tile .cnt svg{width:14px;height:14px;}

/* ---------- comparison ---------- */
.vs{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
  padding:20px;display:flex;flex-direction:column;gap:12px;transition:.18s;}
.vs:hover{border-color:var(--border-strong);box-shadow:var(--shadow-md);transform:translateY(-3px);}
.vs .pair{display:flex;align-items:center;gap:14px;justify-content:center;}
.vs .pair .side{font-weight:600;font-size:1.02rem;text-align:center;flex:1;}
.vs .pair .v{font-family:'JetBrains Mono';font-weight:600;color:var(--accent-text);font-size:.85rem;
  width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--accent-soft);flex:0 0 auto;}
.vs .angle{font-size:.82rem;color:var(--text-faint);text-align:center;}

/* ---------- filter bar ---------- */
.filterbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;}
.fselect{font-family:inherit;font-size:.88rem;font-weight:500;color:var(--text);padding:0 14px;height:42px;display:inline-flex;align-items:center;gap:8px;
  border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);cursor:pointer;transition:.15s;}
.fselect:hover{border-color:var(--border-strong);}
.fselect svg{width:15px;height:15px;color:var(--text-faint);}
.fsearch{flex:1;min-width:200px;display:flex;align-items:center;gap:9px;height:42px;padding:0 14px;
  border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);}
.fsearch svg{width:16px;height:16px;color:var(--text-faint);flex:0 0 auto;}
.fsearch input{flex:1;border:none;background:transparent;color:var(--text);font-family:inherit;font-size:.9rem;outline:none;}
.fsearch input::placeholder{color:var(--text-faint);}

/* filter rail (B) */
.rail{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:20px;position:sticky;top:84px;
  display:flex;flex-direction:column;gap:20px;}
.rail .grp{display:flex;flex-direction:column;gap:9px;}
.rail .opt{display:flex;align-items:center;gap:9px;font-size:.88rem;color:var(--text-muted);cursor:pointer;}
.rail .cbox{width:16px;height:16px;border:1.5px solid var(--border-strong);border-radius:5px;flex:0 0 auto;display:grid;place-items:center;}
.rail .cbox.on{background:var(--accent);border-color:var(--accent);}
.rail .cbox.on svg{width:11px;height:11px;color:var(--accent-contrast);}
.rail .pricebtns{display:flex;gap:7px;}
.rail .pb{flex:1;text-align:center;padding:7px 0;border:1px solid var(--border);border-radius:8px;font-weight:600;font-size:.85rem;color:var(--text-muted);cursor:pointer;}
.rail .pb.on{background:var(--accent-soft);color:var(--accent-text);border-color:transparent;}

/* ---------- lead form ---------- */
.lead{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:26px;
  display:flex;flex-direction:column;gap:18px;box-shadow:var(--shadow-lg);}
.lead .lhead{display:flex;align-items:center;justify-content:space-between;}
.lead .step{font-size:.72rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-text);}
.dots{display:flex;gap:6px;}
.dots .d{width:8px;height:8px;border-radius:50%;background:var(--border-strong);}
.dots .d.on{background:var(--accent);}
.lead .q{font-size:1.3rem;font-weight:700;letter-spacing:-.01em;}
.choices{display:flex;flex-wrap:wrap;gap:8px;}
.choice{padding:8px 13px;border:1px solid var(--border);border-radius:var(--radius-pill);font-size:.85rem;font-weight:500;
  color:var(--text-muted);cursor:pointer;transition:.15s;user-select:none;}
.choice:hover{border-color:var(--border-strong);color:var(--text);}
.choice.on{background:var(--accent-soft);color:var(--accent-text);border-color:color-mix(in srgb,var(--accent) 40%,transparent);}
.field{display:flex;flex-direction:column;gap:7px;}
.field .fl{font-size:.8rem;font-weight:500;color:var(--text-muted);}
.inp{height:46px;padding:0 14px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-subtle);
  color:var(--text);font-family:inherit;font-size:.92rem;width:100%;transition:.15s;}
.inp::placeholder{color:var(--text-faint);}
.inp:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 18%,transparent);}
select.inp{cursor:pointer;}
.disclosure{font-size:.76rem;color:var(--text-faint);text-align:center;line-height:1.4;}

/* ---------- band / stat strip ---------- */
.band{background:var(--bg);}
.stripbar{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;}
.stripbar .s{padding:14px 28px;text-align:center;}
.stripbar .s .v{font-weight:700;font-size:1.7rem;letter-spacing:-.02em;}
.stripbar .s .l{font-size:.8rem;color:var(--text-muted);margin-top:2px;}
.stripbar .sep{width:1px;background:var(--border);align-self:stretch;margin:8px 0;}

/* ---------- FAQ ---------- */
.faq .item{border:1px solid var(--border);border-radius:var(--radius);margin-bottom:12px;background:var(--surface);overflow:hidden;}
.faq .qq{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:18px 20px;cursor:pointer;font-weight:600;font-size:1.02rem;}
.faq .qq .pl{width:22px;height:22px;flex:0 0 auto;color:var(--accent-text);transition:.2s;}
.faq .item.open .qq .pl{transform:rotate(45deg);}
.faq .aa{max-height:0;overflow:hidden;transition:max-height .25s ease;}
.faq .aa-in{padding:0 20px 18px;color:var(--text-muted);font-size:.93rem;line-height:1.6;}
.faq .item.open .aa{max-height:240px;}

/* ---------- newsletter inline ---------- */
.nl{display:flex;gap:10px;max-width:480px;margin:0 auto;}
.nl .inp{flex:1;}

/* ---------- footer ---------- */
.foot{background:var(--bg-subtle);border-top:1px solid var(--border);}
.foot .cols{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:32px;padding:56px 0 36px;}
.foot h4{font-size:.95rem;margin-bottom:14px;}
.foot a{display:block;color:var(--text-muted);font-size:.9rem;padding:5px 0;transition:.15s;}
.foot a:hover{color:var(--text);}
.foot .strip{border-top:1px solid var(--border);padding:20px 0;font-size:.83rem;color:var(--text-faint);}

/* hero skyline texture */
.skyline{position:absolute;left:0;right:0;bottom:0;width:100%;height:160px;opacity:.06;pointer-events:none;color:var(--text);}

/* hero background graphic: fading grid + soft blue glow (real layers) */
.hero-bg{position:relative;overflow:hidden;}
.hero-layer{position:absolute;inset:0;z-index:0;pointer-events:none;}
.hero-grid{
  background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);
  background-size:40px 40px;
  -webkit-mask-image:radial-gradient(125% 120% at 50% -10%,#000 32%,transparent 76%);
          mask-image:radial-gradient(125% 120% at 50% -10%,#000 32%,transparent 76%);}
.hero-glow{
  background:
    radial-gradient(46% 62% at 50% -10%,var(--glow1),transparent 70%),
    radial-gradient(40% 52% at 85% 6%,var(--glow2),transparent 72%),
    radial-gradient(42% 56% at 13% 12%,var(--glow3),transparent 74%);}
:root[data-theme="light"] .skyline{opacity:.05;}

/* misc */
.note-line{font-size:.8rem;color:var(--text-faint);}
.divider{height:1px;background:var(--border);}

/* blog post prose (the global p{margin:0} reset strips spacing otherwise) */
.entry h2{font-size:1.5rem;margin:34px 0 12px;}
.entry h3{font-size:1.2rem;margin:26px 0 10px;}
.entry p{margin:0 0 18px;}
.entry ul,.entry ol{margin:0 0 18px;padding-left:22px;}
.entry li{margin-bottom:8px;}
.entry li::marker{color:var(--text-faint);}
.entry a{color:var(--accent-text);font-weight:600;text-decoration:underline;}
.entry strong{color:var(--text);font-weight:700;}
.entry img{border-radius:var(--radius);margin:22px 0;height:auto;}
.entry blockquote{border-left:3px solid var(--accent);padding-left:18px;margin:22px 0;color:var(--text);font-style:italic;}
.entry > *:first-child{margin-top:0;}

/* ---------- sub-page components ---------- */
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:9px;font-size:.85rem;color:var(--text-muted);}
.crumbs a{color:var(--text-muted);}
.crumbs a:hover{color:var(--accent-text);}
.crumbs .sep{color:var(--text-faint);}
.crumbs .cur{color:var(--text);font-weight:500;}

/* profile hero */
.phero{display:grid;grid-template-columns:1fr 340px;gap:40px;align-items:start;}
.phero .ptitle{display:flex;align-items:center;gap:16px;margin:14px 0 12px;}
.phero .logo-lg{width:64px;height:64px;flex:0 0 64px;border-radius:14px;background:var(--bg-subtle);border:1px solid var(--border);
  display:grid;place-items:center;font-weight:700;font-size:1.6rem;position:relative;overflow:hidden;}
.phero .logo-lg img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:11px;background:var(--surface);}
.phero h1{font-size:2.3rem;}
.phero .loc{color:var(--text-muted);font-size:.95rem;display:flex;align-items:center;gap:7px;margin-bottom:14px;}
.phero .loc svg{width:15px;height:15px;}
.badges{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px;}
.aside-card{position:sticky;top:88px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
  padding:22px;display:flex;flex-direction:column;gap:14px;box-shadow:var(--shadow-md);}
.aside-card .pstat{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.aside-card .pstat .c{display:flex;flex-direction:column;gap:3px;}
.aside-card .pstat .c .v{font-weight:700;font-size:1.15rem;}
.aside-card .pstat .c .l{font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--text-faint);}

/* key-value table */
.kv{border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;}
.kv .row{display:grid;grid-template-columns:200px 1fr;gap:16px;padding:13px 18px;font-size:.92rem;border-bottom:1px solid var(--border);}
.kv .row:last-child{border-bottom:none;}
.kv .row:nth-child(odd){background:var(--bg-subtle);}
.kv .k{color:var(--text-muted);} .kv .v{color:var(--text);font-weight:500;}

/* trust score factor bars */
.factors{display:flex;flex-direction:column;gap:16px;max-width:640px;}
.factor .top{display:flex;justify-content:space-between;font-size:.9rem;margin-bottom:7px;}
.factor .top .w{color:var(--text-faint);}
.factor .track{height:8px;border-radius:999px;background:var(--bg-subtle);border:1px solid var(--border);overflow:hidden;}
.factor .fill{height:100%;background:var(--border-strong);border-radius:999px;}
.factor.pending .fill{background:repeating-linear-gradient(45deg,var(--border-strong),var(--border-strong) 5px,transparent 5px,transparent 10px);width:100%!important;opacity:.5;}

.empty-note{border:1px dashed var(--border-strong);border-radius:var(--radius);padding:24px;text-align:center;color:var(--text-muted);background:var(--bg-subtle);}

/* comparison table */
.cmp{border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;}
.cmp .crow{display:grid;grid-template-columns:200px 1fr 1fr;border-bottom:1px solid var(--border);}
.cmp .crow:last-child{border-bottom:none;}
.cmp .crow > div{padding:14px 18px;font-size:.92rem;border-left:1px solid var(--border);}
.cmp .crow > div:first-child{border-left:none;color:var(--text-muted);background:var(--bg-subtle);font-weight:500;}
.cmp .crow.head > div{background:var(--surface);}
.cmp .crow.head{align-items:stretch;}
.cmp .chead{display:flex;flex-direction:column;gap:10px;align-items:flex-start;}
.cmp .chead .nm{display:flex;align-items:center;gap:10px;font-weight:700;font-size:1.1rem;}
.cmp .crow .vy{font-weight:600;color:var(--text);}
.cmp .crow.alt > div:not(:first-child){background:var(--bg-subtle);}

/* sub-page hero (specialty/category) */
.pagehead{background:var(--bg-subtle);border-bottom:1px solid var(--border);padding:44px 0;}
.pagehead .ic-lg{width:52px;height:52px;border-radius:13px;background:var(--accent-soft);color:var(--accent-text);
  display:grid;place-items:center;margin-bottom:16px;}
.pagehead .ic-lg svg{width:26px;height:26px;}
.pagehead p{max-width:68ch;color:var(--text-muted);margin-top:12px;font-size:1.05rem;}
.checklist{display:grid;grid-template-columns:1fr 1fr;gap:12px 28px;max-width:760px;margin-top:8px;}
.checklist .ci{display:flex;gap:10px;align-items:flex-start;font-size:.95rem;color:var(--text-muted);}
.checklist .ci svg{width:18px;height:18px;color:var(--accent-text);flex:0 0 auto;margin-top:2px;}

@media(max-width:860px){
  .phero{grid-template-columns:1fr;}
  .aside-card{position:static;}
  .kv .row{grid-template-columns:1fr;gap:2px;}
  .cmp .crow{grid-template-columns:110px 1fr 1fr;}
  .checklist{grid-template-columns:1fr;}
}

/* ---------- responsive ---------- */
@media(max-width:980px){
  .grid-3{grid-template-columns:repeat(2,1fr);}
  .grid-4{grid-template-columns:repeat(2,1fr);}
  .nav .links{display:none;}
  h1{font-size:2.1rem;} h2{font-size:1.6rem;}
  .section{padding:56px 0;}
}
@media(max-width:640px){
  .grid-3,.grid-2,.grid-4{grid-template-columns:1fr;}
  .foot .cols{grid-template-columns:1fr 1fr;}
  .hide-sm{display:none;}
}

/* ---------- theme additions ---------- */
/* site hero (front page + taxonomy/compare heads can reuse) */
.site-hero{position:relative;overflow:hidden;text-align:center;padding:172px 0 108px;margin-top:-68px;background:var(--bg-subtle);}
.site-hero h1{font-size:3.4rem;line-height:1.05;margin:14px auto 16px;max-width:17ch;}
.site-hero .accent{color:var(--accent-text);}
.site-hero .lede{font-size:1.18rem;color:var(--text-muted);max-width:60ch;margin:0 auto;}
.site-hero .cta-row{display:flex;gap:12px;justify-content:center;margin-top:24px;flex-wrap:wrap;}
.site-hero .trustline{margin-top:16px;font-size:.9rem;color:var(--text-faint);}

/* trust score color tiers */
.trust.low{background:color-mix(in srgb,var(--score-low) 15%,transparent);color:var(--score-low);}
.trust.mid{background:color-mix(in srgb,var(--score-mid) 16%,transparent);color:var(--score-mid);}
.trust.high{background:color-mix(in srgb,var(--score-high) 15%,transparent);color:var(--score-high);}
.factor .fill.low{background:var(--score-low);} .factor .fill.mid{background:var(--score-mid);} .factor .fill.high{background:var(--score-high);}

/* get-matched split */
.gm{display:grid;grid-template-columns:1fr 460px;gap:48px;align-items:start;padding:64px 0;}
.gm .points{display:flex;flex-direction:column;gap:18px;margin-top:24px;}
.gm .pt{display:flex;gap:13px;align-items:flex-start;}
.gm .pt .ic{width:38px;height:38px;flex:0 0 38px;border-radius:10px;background:var(--accent-soft);color:var(--accent-text);display:grid;place-items:center;}
.gm .pt .ic svg{width:19px;height:19px;}
.gm .pt h4{font-size:1.02rem;margin-bottom:2px;}
.gm .pt p{font-size:.9rem;color:var(--text-muted);}

/* mobile nav */
.nav .burger{display:none;width:40px;height:40px;border:1px solid var(--border);border-radius:var(--radius-sm);
  background:transparent;color:var(--text);cursor:pointer;place-items:center;}
.nav .burger svg{width:20px;height:20px;}
.mobile-menu{display:none;border-bottom:1px solid var(--border);background:var(--bg);}
.mobile-menu.open{display:block;}
.mobile-menu a{display:block;padding:13px 24px;color:var(--text);border-top:1px solid var(--border);font-weight:500;}
.mobile-menu .mm-cta{padding:16px 24px;}

@media(max-width:980px){
  .site-hero h1{font-size:2.4rem;}
  .gm{grid-template-columns:1fr;gap:32px;}
  .nav .burger{display:grid;}
  .nav .right .hide-sm{display:none;}
}

/* ===== Light-only palette (dark mode removed) ===== */
:root{
  --accent:#2E90D9; --accent-hover:#2179BE; --accent-soft:#E8F3FB; --accent-contrast:#FFFFFF; --accent-text:#1E7CC2; --gold:#D9962A;
  --bg:#FFFFFF; --bg-subtle:#F7F7F5; --surface:#FFFFFF; --surface-2:#FBFBFA;
  --border:#E7E5E0; --border-strong:#D8D5CE;
  --text:#18181B; --text-muted:#6B7280; --text-faint:#9CA3AF;
  --shadow-sm:0 1px 2px rgba(16,16,20,.06); --shadow-md:0 4px 16px rgba(16,16,20,.08); --shadow-lg:0 12px 40px rgba(16,16,20,.12);
  --score-low:#DC2626; --score-mid:#D97706; --score-high:#16A34A;
  --grid:rgba(17,24,39,.07); --glow1:rgba(46,144,217,.20); --glow2:rgba(46,144,217,.12); --glow3:rgba(59,130,246,.10);
}

/* ===== Mobile overflow guards ===== */
html,body{overflow-x:clip;max-width:100%;}
img,svg,table{max-width:100%;}
.cmp{overflow-x:auto;}
@media(max-width:640px){
  .wordmark{font-size:1rem;}
  .site-hero{padding-top:104px;padding-bottom:60px;}
  .site-hero h1{font-size:2rem;}
  .wrap{padding:0 18px;}
  .nav .row{gap:12px;}
  .cmp .crow{grid-template-columns:96px 1fr 1fr;}
}

/* ===== Reviews list ===== */
.rev-summary{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:16px 18px;border:1px solid var(--border);border-radius:var(--radius);background:var(--bg-subtle);margin-bottom:18px;}
.rev-summary .rev-score{font-size:1.6rem;font-weight:700;color:var(--text);}
.rev-summary .rev-stars,.review-card .rev-rate{color:var(--gold);letter-spacing:1px;font-size:1rem;}
.rev-dim{color:var(--border-strong);}
.rev-summary .rev-meta{color:var(--text-muted);font-size:.92rem;}
.reviews-list{display:flex;flex-direction:column;gap:14px;}
.review-card{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);padding:16px 18px;}
.review-card .rev-head{display:flex;align-items:center;gap:12px;}
.review-card .rev-av{width:38px;height:38px;flex:0 0 38px;border-radius:50%;background:var(--accent-soft);color:var(--accent-text);display:grid;place-items:center;font-weight:700;}
.review-card .rev-id{flex:1;min-width:0;}
.review-card .rev-name{font-weight:600;color:var(--text);}
.review-card .rev-when{font-size:.8rem;color:var(--text-faint);}
.review-card .rev-text{margin-top:11px;color:var(--text-muted);font-size:.94rem;line-height:1.6;}
.reviews-pager{display:flex;gap:7px;justify-content:center;margin-top:18px;flex-wrap:wrap;}
.reviews-pager button{min-width:36px;height:36px;padding:0 11px;border:1px solid var(--border);background:var(--surface);color:var(--text-muted);border-radius:var(--radius-sm);font-family:inherit;font-weight:600;font-size:.9rem;cursor:pointer;transition:.15s;}
.reviews-pager button:hover{border-color:var(--border-strong);color:var(--text);}
.reviews-pager button.on{background:var(--accent);border-color:var(--accent);color:var(--accent-contrast);}
.reviews-pager button[disabled]{opacity:.4;cursor:default;}

/* ===== Forms (submit / pickers) ===== */
.saa-form .fld,.cmp-picker .fld{display:flex;flex-direction:column;gap:6px;margin-bottom:16px;}
.saa-form .fld>span,.cmp-picker .fld>span{font-size:.85rem;font-weight:600;color:var(--text-muted);}
.saa-form .fld em{color:var(--accent-text);font-style:normal;}
.saa-form .fld-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
textarea.inp{resize:vertical;font-family:inherit;line-height:1.5;}
select.inp{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:36px;}
.ticklist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px;}
.ticklist li{display:flex;gap:10px;align-items:flex-start;font-size:.95rem;color:var(--text-muted);line-height:1.45;}
.ticklist li svg{flex:0 0 18px;width:18px;height:18px;color:var(--success);margin-top:1px;}
.cmp-picker{display:flex;align-items:flex-end;gap:14px;flex-wrap:wrap;padding:18px;border:1px solid var(--border);border-radius:var(--radius);background:var(--bg-subtle);margin-bottom:26px;}
.cmp-picker .fld{flex:1;min-width:200px;margin-bottom:0;}
.cmp-picker .cmp-vs{padding-bottom:11px;color:var(--text-faint);font-weight:700;}
@media(max-width:560px){.saa-form .fld-row{grid-template-columns:1fr;}.cmp-picker .cmp-vs{display:none;}}

/* ============================================================
   MOBILE PASS — comprehensive small-screen fixes
   ============================================================ */
@media(max-width:860px){
  /* comparison table scrolls horizontally instead of crushing */
  .cmp{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:var(--radius);}
  .cmp .crow{grid-template-columns:130px minmax(150px,1fr) minmax(150px,1fr);min-width:540px;}
  .cmp .crow > div{padding:12px 14px;}
  /* profile: surface the CTA/stat card above the long content */
  .phero{display:flex;flex-direction:column;gap:24px;}
  .phero.is-profile .phero-main{order:2;}
  .phero.is-profile .aside-card{order:1;}
  /* blog content tables can scroll too */
  .entry table{display:block;overflow-x:auto;white-space:nowrap;}
}
@media(max-width:640px){
  .section{padding:46px 0;}
  .wrap{padding:0 16px;}
  /* clamp inline-sized headings (band/CTA/hero use style="font-size:…") */
  .center h2,.band h2{font-size:1.5rem!important;line-height:1.25;}
  .pagehead{padding:32px 0;}
  .pagehead h1{font-size:1.8rem;}
  .pagehead p{font-size:.98rem;}
  .phero h1{font-size:1.75rem;}
  .phero .ptitle{gap:12px;margin:10px 0;}
  .phero .logo-lg{width:52px;height:52px;flex:0 0 52px;font-size:1.3rem;}
  .lead{padding:20px;}
  .lead .q{font-size:1.12rem;}
  .shead{flex-wrap:wrap;gap:10px;margin-bottom:24px;}
  .nl{flex-direction:column;}
  .nl .inp,.nl .btn{width:100%;}
  .stripbar .s{padding:10px 16px;}
  .stripbar .s .v{font-size:1.4rem;}
  .foot .cols{grid-template-columns:1fr 1fr;gap:22px;padding:40px 0 28px;}
  .cmp-picker{padding:14px;}
  .cmp-picker .btn{width:100%;}
  .btn-lg{height:48px;padding:0 20px;font-size:.98rem;}
  /* keep buttons comfortably tappable & full-width in stacked CTAs */
  .site-hero .cta-row .btn,.cta-row .btn{flex:1 1 auto;}
}
@media(max-width:420px){
  .foot .cols{grid-template-columns:1fr;}
  .aside-card .pstat{grid-template-columns:1fr 1fr;}
  h1{font-size:1.9rem;}
}