/* ProxyMojo design system — shell + front page. Adapted from the approved
   homepage design; data-bearing sections are server-rendered with real records. */

:root{
  --bg:#F4F7F8; --bg-2:#FFFFFF; --tint:#E7F2F1; --tint-2:#EEF5F5;
  --ink:#0E2530; --ink-2:#4F6470; --ink-3:#59686F; /* was #8698A1: 2.99:1 on white, failed AA */
  --line:#E0E9EA; --line-2:#EBF1F1;
  --teal:#0E8C93; --teal-2:#17C0B2; --teal-ink:#0A5B60; --teal-soft:#DBF1EF;
  --grad-teal:linear-gradient(120deg,#0E8C93 0%,#1AC4B4 100%);
  --coral:#FF6A4D; --coral-2:#FF8C5A; --coral-ink:#E14E30; --coral-soft:#FFE7DF;
  --grad-coral:linear-gradient(120deg,#FF6A4D 0%,#FF9152 100%);
  --gold:#F2A621; --gold-soft:#FCEECF;
  --navy:#0A2029; --navy-2:#0F2E37; --navy-line:rgba(255,255,255,.1); --navy-ink:#9FB6BC;
  --r-xl:22px; --r-lg:16px; --r-md:12px;
  --sh-sm:0 1px 2px rgba(14,37,48,.05),0 12px 28px -18px rgba(14,37,48,.26);
  --sh-md:0 22px 46px -24px rgba(14,37,48,.32);
  --sh-lg:0 44px 88px -34px rgba(10,91,96,.45);
  --maxw:1200px;
}
body{font-family:'Hanken Grotesk',system-ui,sans-serif;background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased}
.pcx a{text-decoration:none;color:inherit}
.pcx img{max-width:100%;display:block}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 26px}
.mono{font-family:'IBM Plex Mono',monospace;letter-spacing:-.01em}
.pcx h1,.pcx h2,.pcx h3,.site-head h1,.site-head h2{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;line-height:1.05;letter-spacing:-.02em;color:var(--ink)}
.gt-t{background:var(--grad-teal);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.gt-c{background:var(--grad-coral);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.eyebrow{font-family:'IBM Plex Mono',monospace;font-size:12px;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--teal);display:inline-flex;align-items:center;gap:9px}
.eyebrow::before{content:"";width:20px;height:1px;background:var(--teal);opacity:.6}
.eyebrow.c{justify-content:center}
.sec-head{max-width:660px;margin:0 auto 52px;text-align:center}
.sec-head h2{font-size:clamp(29px,4.2vw,46px);margin:15px 0 15px}
.sec-head p{color:var(--ink-2);font-size:17px}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-family:'Hanken Grotesk',sans-serif;font-weight:700;font-size:15px;padding:14px 24px;border-radius:12px;border:1px solid transparent;cursor:pointer;white-space:nowrap;transition:transform .16s,box-shadow .18s,background .2s,border-color .2s,color .2s;text-decoration:none}
.btn:focus-visible{outline:2px solid var(--coral);outline-offset:3px}
.btn-cta{background:var(--grad-coral);color:#fff!important;box-shadow:0 14px 30px -12px rgba(255,106,77,.6)}
.btn-cta:hover{transform:translateY(-2px);color:#fff}
.btn-teal{background:var(--grad-teal);color:#fff!important}
.btn-teal:hover{transform:translateY(-2px)}
.btn-out{background:var(--bg-2);color:var(--ink)!important;border-color:var(--line);box-shadow:var(--sh-sm)}
.btn-out:hover{border-color:var(--teal);color:var(--teal)!important;transform:translateY(-2px)}
.arrow{font-weight:700;color:var(--teal);display:inline-flex;align-items:center;gap:7px;font-size:15px}
.arrow svg{transition:transform .2s}
.arrow:hover svg,a:hover .arrow svg{transform:translateX(4px)}

/* HEADER */
.site-head{position:sticky;top:0;z-index:60}
.topbar{background:var(--navy);color:var(--navy-ink)}
.topbar-in{display:flex;align-items:center;justify-content:space-between;height:40px}
.tb-l{display:flex;align-items:center;gap:8px;font-family:'IBM Plex Mono',monospace;font-size:11.5px;letter-spacing:.04em}
.tb-l svg{color:var(--teal-2)}
.tb-r{display:flex;align-items:center;gap:16px}
.tb-r a{font-size:12.5px;color:var(--navy-ink);transition:color .15s;text-decoration:none}
.tb-r a:hover{color:#fff}
.nav-shell{background:rgba(244,247,248,.9);backdrop-filter:saturate(160%) blur(16px);border-bottom:1px solid var(--line);position:relative}
.site-head.scrolled .nav-shell{background:rgba(244,247,248,.98);box-shadow:0 8px 28px -16px rgba(14,37,48,.32)}
.nav-in{display:flex;align-items:center;gap:20px;height:70px}
.brand{display:flex;align-items:center;gap:10px;font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:20px;letter-spacing:-.02em;color:var(--ink);text-decoration:none}
.brand .mk{width:32px;height:32px;border-radius:9px;background:var(--grad-teal);display:grid;place-items:center;box-shadow:0 8px 18px -8px rgba(14,140,147,.7)}
.brand .mk svg{width:19px;height:19px}
.brand{flex:none}
.nav-links{display:flex;flex-wrap:nowrap;align-items:center;gap:20px;margin:0;list-style:none;padding:0}
.nav-links li{list-style:none;margin:0;padding:0;flex:none}
.nav-links a{display:inline-block;white-space:nowrap;font-size:14px;font-weight:500;color:var(--ink-2);transition:color .15s;position:relative;padding:6px 0;text-decoration:none}
.nav-links a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;border-radius:2px;background:var(--grad-teal);transform:scaleX(0);transform-origin:left;transition:transform .2s}
.nav-links a:hover{color:var(--ink)}
.nav-links a:hover::after,.nav-links .current-menu-item a::after{transform:scaleX(1)}
.nav-links .current-menu-item a{color:var(--ink)}
.nav-in nav{flex:0 1 auto;min-width:0}
.nav-right{margin-left:auto;flex:none;display:flex;align-items:center;gap:10px}
.nav-search{display:flex;align-items:center;gap:8px;background:var(--bg-2);border:1px solid var(--line);border-radius:10px;padding:9px 12px;color:var(--ink-3);font-size:13px;font-weight:500;box-shadow:var(--sh-sm);text-decoration:none;white-space:nowrap}
.nav-search:hover{border-color:var(--teal);color:var(--ink)}
.nav-search svg{flex:none}
.nav-right .btn{white-space:nowrap}
.nav-cta-short{display:none}
.nav-toggle{display:none;background:var(--bg-2);border:1px solid var(--line);border-radius:9px;width:44px;height:44px;align-items:center;justify-content:center;cursor:pointer;color:var(--ink);flex:none}
.nav-toggle:hover{border-color:var(--teal);color:var(--teal)}
.nav-backdrop{display:none}

/* The three tiers below are calibrated against the *measured* width of the link
   row, so they have to be re-checked whenever a menu item is added. They were
   originally tuned for six links; a seventh ("Best proxy for…") pushed the row
   to 711px and left 16px of clearance at 1160px and again at 1040px — close
   enough that a slightly wider font fallback put the last link underneath the
   search box. Each tier now hands over with ~60px in hand instead.

   Safety net first: the link row may shrink and clip, but it may never sit on
   top of the actions to its right. Clipping a link looks tidy and is obvious in
   testing; overlapping reads as a broken site. */
.nav-in nav{overflow:hidden}
.nav-links{flex:none}

/* Tier 1: unconditional, and deliberately not a media query.
   .wrap is capped at --maxw (1200px), so past a 1200px viewport the header box
   stops growing and extra screen width buys nothing. A viewport-keyed
   breakpoint therefore cannot fix the top end: at 1600px the row was still
   overflowing its 1200px container by 46px while the query sat unmatched.
   Seven links only fit the capped container at this tighter sizing, so it
   applies everywhere and the media queries below handle the narrow end. */
.nav-in{gap:16px}
.nav-links{gap:15px}
.nav-links a{font-size:13.5px}
.brand{font-size:18px}
.nav-right{gap:8px}
.nav-right .btn{padding:11px 14px!important;font-size:14px}
/* Tier 2 (<1240px): icon-only search + short CTA label, which together buy back
   roughly 120px — enough to carry the seven-link row down to the next tier. */
@media(max-width:1240px){
  .nav-search{padding:9px 10px}
  .nav-search .nav-search-label{display:none}
  .nav-cta-full{display:none}
  .nav-cta-short{display:inline}
}
/* Tier 3 (<1120px): collapse to an accessible drawer. Seven links plus icon
   search and short CTA clear the right-hand actions down to about 1055px, so
   handing over at 1120px keeps a real margin. That does mean 1024px landscape
   tablets now get the drawer rather than the full nav — at that width the row
   had 16px of clearance, which is not a margin worth defending. */
@media(max-width:1120px){
  .nav-in nav{display:none}
  .nav-toggle{display:flex}
  .nav-shell.open .nav-backdrop{display:block;position:fixed;inset:110px 0 0;background:rgba(10,32,41,.35);z-index:59}
  .nav-shell.open nav{display:block;position:absolute;top:70px;left:0;right:0;background:var(--bg-2);border-bottom:1px solid var(--line);box-shadow:var(--sh-md);z-index:70;max-height:calc(100vh - 110px);overflow-y:auto}
  .nav-shell.open .nav-links{flex-direction:column;align-items:stretch;gap:0;padding:8px 0}
  .nav-shell.open .nav-links li{border-bottom:1px solid var(--line-2)}
  .nav-shell.open .nav-links li:last-child{border-bottom:none}
  .nav-shell.open .nav-links a{display:block;padding:14px 26px;font-size:15px;font-weight:600;color:var(--ink)}
  .nav-shell.open .nav-links a:hover{background:var(--tint-2);color:var(--teal)}
  .nav-shell.open .nav-links a::after{display:none}
}
@media(max-width:560px){
  .nav-right .btn{display:none}
  .brand .brand-word{font-size:17px}
}

/* DARK modifier */
.dk{background:var(--navy);color:#fff;position:relative;overflow:hidden}
.dk::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(760px 340px at 50% -6%,rgba(26,196,180,.14),transparent 60%),radial-gradient(520px 280px at 90% 108%,rgba(255,106,77,.1),transparent 60%)}
.dk>.wrap{position:relative;z-index:1}
.dk h2,.dk h3{color:#fff}
.dk p,.dk .sec-head p,.dk .head-row p{color:var(--navy-ink)}
.dk .eyebrow{color:var(--teal-2)} .dk .eyebrow::before{background:var(--teal-2)}
.dk .arrow{color:var(--teal-2)}
.dk .card{background:var(--navy-2);border-color:var(--navy-line)}
.dk .card:hover{border-color:rgba(26,196,180,.5)}
.dk .card p{color:var(--navy-ink)}
.dk .uc .tag{color:var(--teal-2);background:rgba(26,196,180,.13)}
.dk .stat{background:var(--navy-2);border-color:var(--navy-line)}
.dk .stat .l{color:var(--navy-ink)}
.dk .fp-nm{color:#fff} .dk .fp-ty{color:var(--navy-ink)}
.dk .fp-specs{background:var(--navy-line);border-color:var(--navy-line)}
.dk .fp-specs>div{background:var(--navy)}
.dk .fp-specs .k{color:var(--navy-ink)} .dk .fp-specs .v{color:#fff}
.dk .fp-badge{color:var(--gold);background:rgba(242,166,33,.15)}
.dk .btn-out{background:rgba(255,255,255,.06);color:#fff!important;border-color:var(--navy-line);box-shadow:none}
.dk .btn-out:hover{border-color:var(--teal-2)}
.dk .checklist li{color:#fff}
.dk .faq{background:var(--navy-2);border-color:var(--navy-line)}
.dk .faq[open]{border-color:var(--teal-2)}
.dk .faq summary{color:#fff}
.dk .faq summary .pm{background:rgba(26,196,180,.15);color:var(--teal-2)}
.dk .faq[open] summary .pm{background:var(--grad-teal);color:#fff}
.dk .faq-b{color:var(--navy-ink)}

/* HERO */
.hero{position:relative;padding:72px 0 46px;overflow:hidden}
.hero-bg{position:absolute;inset:0;z-index:0;pointer-events:none}
.hero-bg .g{position:absolute;border-radius:50%;filter:blur(85px)}
.hero-bg .g1{width:520px;height:520px;background:rgba(26,196,180,.22);top:-160px;right:-60px}
.hero-bg .g2{width:440px;height:440px;background:rgba(255,106,77,.13);bottom:-200px;left:-120px}
.hero-bg .grid{position:absolute;inset:0;background-image:linear-gradient(rgba(14,37,48,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(14,37,48,.045) 1px,transparent 1px);background-size:48px 48px;-webkit-mask-image:radial-gradient(115% 78% at 60% 0%,#000,transparent 72%);mask-image:radial-gradient(115% 78% at 60% 0%,#000,transparent 72%)}
.hero-in{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:52px;align-items:center}
.pill{display:inline-flex;align-items:center;gap:10px;background:var(--bg-2);border:1px solid var(--line);border-radius:100px;padding:8px 15px;font-size:13px;color:var(--ink-2);box-shadow:var(--sh-sm)}
.pill b{color:var(--ink);font-weight:700}
.hero h1{font-size:clamp(40px,5.6vw,64px);font-weight:800;letter-spacing:-.03em;margin:22px 0 6px}
.rotor{height:1.14em;overflow:hidden;position:relative;display:block}
.rotor span{display:block;position:absolute;left:0;width:100%;opacity:0;transform:translateY(100%);transition:transform .5s cubic-bezier(.2,.8,.2,1),opacity .5s;background:var(--grad-coral);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.rotor span.on{opacity:1;transform:translateY(0)}
.rotor span.out{opacity:0;transform:translateY(-100%)}
.hero .lead{font-size:18px;color:var(--ink-2);max-width:520px;margin:22px 0 26px}
.searchbar{display:flex;gap:8px;background:var(--bg-2);border:1px solid var(--line);padding:8px;border-radius:15px;box-shadow:var(--sh-md);max-width:520px}
.searchbar input{flex:1;border:none;outline:none;background:transparent;color:var(--ink);font-family:inherit;font-size:15px;padding:0 12px}
.hero-cta{display:flex;gap:12px;margin:20px 0 20px;flex-wrap:wrap}
.pop{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:13px;color:var(--ink-3)}
.pop a{background:var(--tint-2);border:1px solid var(--line);border-radius:8px;padding:5px 11px;color:var(--ink-2);font-weight:500;text-decoration:none}
.pop a:hover{border-color:var(--teal);color:var(--teal)}
.ticker-wrap{margin-top:24px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:11px 0;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.ticker{display:flex;gap:30px;width:max-content;animation:slide 30s linear infinite}
.ticker .t{display:inline-flex;align-items:center;gap:8px;font-family:'IBM Plex Mono',monospace;font-size:12.5px;color:var(--ink-2);white-space:nowrap}
.ticker .t b{color:var(--ink)}
.ticker .dt{color:var(--ink-3);font-size:11px}
@keyframes slide{to{transform:translateX(-50%)}}

.cluster{display:flex;flex-direction:column;gap:16px}
.chips{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.chip{background:var(--bg-2);border:1px solid var(--line);border-radius:15px;padding:16px 18px;box-shadow:var(--sh-sm);position:relative}
.chip .ci{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;margin-bottom:12px;color:#fff}
.chip .n{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:25px;letter-spacing:-.02em}
.chip .l{font-size:12.5px;color:var(--ink-2)}
.badge-daily{position:absolute;top:14px;right:14px;font-family:'IBM Plex Mono',monospace;font-size:9.5px;font-weight:600;color:var(--teal);background:var(--teal-soft);border-radius:6px;padding:3px 7px}
.board{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r-xl);box-shadow:var(--sh-lg);overflow:hidden}
.board-h{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--line-2)}
.board-h .t{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:15px;display:flex;align-items:center;gap:8px}
.board-h .t svg{color:var(--teal)}
.live{font-family:'IBM Plex Mono',monospace;font-size:10.5px;font-weight:600;color:var(--teal);background:var(--teal-soft);border-radius:7px;padding:4px 9px}
.brow{display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid var(--line-2);text-decoration:none;color:inherit}
.brow:last-of-type{border-bottom:none}
.brow:hover{background:var(--tint-2)}
.brow.top{background:linear-gradient(90deg,rgba(242,166,33,.1),transparent)}
.brow .rk{font-family:'IBM Plex Mono',monospace;font-weight:600;font-size:13px;color:var(--ink-3);width:16px;text-align:center;flex:none}
.brow.top .rk{color:var(--gold)}
.brow .av{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;color:#fff;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:14px;flex:none}
.brow .nm{font-weight:700;font-size:14.5px}
.brow .rt{font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--ink-3)}
.brow .pr{margin-left:auto;text-align:right}
.brow .pr .v{font-family:'IBM Plex Mono',monospace;font-weight:600;font-size:14px}
.brow .pr .u{font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--ink-3)}
.board-f{padding:14px 18px;text-align:center}

.stats{padding:42px 0}
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.stat{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r-lg);padding:22px;box-shadow:var(--sh-sm)}
.stat .n{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:32px;letter-spacing:-.03em}
.stat .l{font-family:'IBM Plex Mono',monospace;font-size:11.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-3);margin-top:6px}

.pcx section{position:relative;z-index:1}
.pad{padding:92px 0}
.card{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r-lg);padding:28px;box-shadow:var(--sh-sm);transition:transform .22s,border-color .22s,box-shadow .22s;position:relative;overflow:hidden;text-decoration:none;color:inherit}
.card:hover{transform:translateY(-4px);border-color:rgba(14,140,147,.4);box-shadow:var(--sh-md)}
.card .ci{width:50px;height:50px;border-radius:13px;display:grid;place-items:center;margin-bottom:18px;color:#fff}
.card h3{font-size:20px;margin-bottom:9px}
.card p{color:var(--ink-2);font-size:14.5px}
.ci.teal{background:var(--grad-teal)}
.ci.coral{background:var(--grad-coral)}
.ci.gold{background:linear-gradient(120deg,#F2A621,#F7C24E)}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}

.about{display:grid;grid-template-columns:1.05fr .95fr;gap:54px;align-items:center}
.about h2{font-size:clamp(28px,3.7vw,42px);margin:15px 0 18px}
.about p{color:var(--ink-2);margin-bottom:16px;font-size:16px}
.about-feats{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:24px}
.fpill{display:flex;gap:12px;align-items:flex-start;background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r-md);padding:14px;box-shadow:var(--sh-sm)}
.fpill .i{width:34px;height:34px;border-radius:9px;flex:none;display:grid;place-items:center;background:var(--teal-soft);color:var(--teal)}
.fpill .ft{font-weight:700;font-size:14px}
.fpill .fd{font-size:12px;color:var(--ink-3)}
.term{background:var(--navy);border:1px solid var(--navy-line);border-radius:var(--r-xl);box-shadow:var(--sh-lg);overflow:hidden;font-family:'IBM Plex Mono',monospace}
.term-top{display:flex;align-items:center;gap:7px;padding:14px 16px;border-bottom:1px solid var(--navy-line)}
.term-top i{width:11px;height:11px;border-radius:50%}
.term-top .p{margin-left:10px;color:var(--navy-ink);font-size:12px}
.term-b{padding:20px 18px}
.term-cmd{color:var(--navy-ink);font-size:12.5px;margin-bottom:16px}
.term-cmd b{color:var(--teal-2)}
.term-it{display:flex;align-items:center;justify-content:space-between;padding:11px 0;border-bottom:1px dashed var(--navy-line)}
.term-it:last-child{border-bottom:none}
.term-it .nm{color:#EAF3F2;font-size:13.5px}
.term-it .pr{color:var(--teal-2);font-weight:600;font-size:13.5px}
.term-cur{color:var(--navy-ink);font-size:12px;margin-top:16px}
.term-cur .bl{display:inline-block;width:8px;height:14px;background:var(--teal-2);vertical-align:-2px;margin-left:4px;animation:blink 1.1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}

.bento{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.eco{display:flex;flex-direction:column;min-height:210px}
.eco .top{display:flex;align-items:center;justify-content:space-between}
.eco .idx{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--ink-3)}
.eco h3{font-size:21px;margin:16px 0 9px}
.eco p{flex:1}
.eco .foot{margin-top:16px}
.eco .rail{height:3px;width:44px;border-radius:3px;margin-top:6px}

.tools .sec-head h2{color:#fff}
.tool-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;position:relative;max-width:760px;margin:0 auto}
.tool{background:var(--navy-2);border:1px solid var(--navy-line);border-radius:var(--r-lg);padding:24px;transition:transform .22s,border-color .22s;text-decoration:none;display:block}
.tool:hover{transform:translateY(-4px);border-color:rgba(26,196,180,.5)}
.tool .ti{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;margin-bottom:16px;background:rgba(26,196,180,.14);color:var(--teal-2)}
.tool h3{color:#fff;font-size:16.5px;margin-bottom:8px}
.tool p{color:var(--navy-ink);font-size:13.5px;margin-bottom:16px}
.tool .tl{font-family:'IBM Plex Mono',monospace;font-size:12.5px;font-weight:600;color:var(--coral-2);display:inline-flex;gap:6px;align-items:center}

.uc{padding:24px}
.uc .tag{font-family:'IBM Plex Mono',monospace;font-size:10.5px;font-weight:600;text-transform:uppercase;letter-spacing:.07em;color:var(--teal);background:var(--teal-soft);padding:4px 9px;border-radius:6px}
.uc h3{font-size:18px;margin:13px 0 8px}
.uc p{color:var(--ink-2);font-size:14px}

.head-row{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:42px;flex-wrap:wrap}
.head-row h2{font-size:clamp(27px,3.6vw,38px);margin-top:12px}
.head-row p{color:var(--ink-2);margin-top:6px;max-width:520px}
.fp{padding:24px}
.fp-top{display:flex;align-items:center;gap:13px;margin-bottom:18px}
.fp-av{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;color:#fff;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:16px;flex:none}
.fp-nm{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:17px}
.fp-ty{font-family:'IBM Plex Mono',monospace;font-size:11.5px;color:var(--ink-3)}
.fp-badge{margin-left:auto;font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--teal);background:var(--teal-soft);border-radius:7px;padding:5px 9px}
.fp-specs{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:11px;overflow:hidden;margin-bottom:18px}
.fp-specs>div{background:var(--bg-2);padding:12px 14px}
.fp-specs .k{font-family:'IBM Plex Mono',monospace;font-size:10.5px;color:var(--ink-3);text-transform:uppercase;letter-spacing:.05em}
.fp-specs .v{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:15px}
.fp .btn{width:100%}

.dec{display:grid;grid-template-columns:1fr 1fr;gap:54px;align-items:center}
.dec h2{font-size:clamp(28px,3.7vw,42px);margin:15px 0 18px}
.dec .lead{color:var(--ink-2);font-size:16px;margin-bottom:24px}
.checklist{display:grid;grid-template-columns:1fr 1fr;gap:13px 22px;margin-bottom:28px;padding:0}
.checklist li{list-style:none;display:flex;align-items:center;gap:11px;font-size:14.5px;font-weight:500}
.checklist .ck{width:23px;height:23px;border-radius:7px;background:var(--teal-soft);color:var(--teal);display:grid;place-items:center;flex:none}
.cmp{background:var(--bg-2);color:var(--ink);border:1px solid var(--line);border-radius:var(--r-xl);box-shadow:var(--sh-lg);overflow:hidden}
.cmp-h{padding:18px 20px;border-bottom:1px solid var(--line-2);display:flex;align-items:center;justify-content:space-between}
.cmp-h .t{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;color:var(--ink)}
.cmp-h .tag{font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--teal);background:var(--teal-soft);padding:4px 9px;border-radius:7px}
.cmp-r{display:flex;align-items:center;gap:13px;padding:16px 20px;border-bottom:1px solid var(--line-2)}
.cmp-r .av{width:36px;height:36px;border-radius:9px;display:grid;place-items:center;color:#fff;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:14px;flex:none}
.cmp-r .nm{font-weight:600;font-size:15px;color:var(--ink)}
.cmp-r .st{font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--ink-3)}
.cmp-r .pr{margin-left:auto;font-family:'IBM Plex Mono',monospace;font-weight:600;color:var(--ink)}
.cmp-f{padding:16px 20px}.cmp-f .btn{width:100%}

.faq-wrap{max-width:840px;margin:0 auto}
.faq{background:var(--bg-2);border:1px solid var(--line);border-radius:13px;margin-bottom:12px;overflow:hidden;box-shadow:var(--sh-sm);transition:border-color .2s}
.faq[open]{border-color:var(--teal)}
.faq summary{list-style:none;cursor:pointer;padding:20px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px;font-family:'Bricolage Grotesque',sans-serif;font-weight:600;font-size:17px}
.faq summary::-webkit-details-marker{display:none}
.faq summary .pm{width:28px;height:28px;flex:none;border-radius:8px;background:var(--teal-soft);color:var(--teal);display:grid;place-items:center;transition:transform .22s}
.faq[open] summary .pm{transform:rotate(45deg);background:var(--grad-teal);color:#fff}
.faq-b{padding:0 24px 22px;color:var(--ink-2);font-size:15px;max-width:720px}

.cta{border-radius:26px;padding:64px 44px;text-align:center;position:relative;overflow:hidden;background:linear-gradient(120deg,#0E8C93 0%,#159A8F 45%,#FF6A4D 130%)}
.cta::before{content:"";position:absolute;inset:0;background:radial-gradient(560px 260px at 16% 12%,rgba(255,255,255,.2),transparent 60%),radial-gradient(520px 260px at 88% 94%,rgba(255,140,90,.4),transparent 60%)}
.cta h2{color:#fff;font-size:clamp(28px,4.4vw,46px);position:relative;margin-bottom:16px}
.cta p{color:rgba(255,255,255,.9);max-width:560px;margin:0 auto 30px;position:relative;font-size:17px}
.cta-b{display:flex;gap:13px;justify-content:center;flex-wrap:wrap;position:relative}
.cta .btn-w{background:#fff;color:var(--teal-ink)!important}
.cta .btn-l{background:rgba(255,255,255,.14);color:#fff!important;border-color:rgba(255,255,255,.5)}
.cta .btn-l:hover{background:rgba(255,255,255,.24)}

/* FOOTER */
.pcx-footer{background:var(--navy);color:var(--navy-ink);margin-top:70px}
.pcx-footer a{text-decoration:none}
.pcx-footer a:focus-visible,.f-chip:focus-visible{outline:2px solid var(--teal-2);outline-offset:3px;border-radius:4px}

/* CTA band */
.f-cta{background:var(--navy-2);border-bottom:1px solid var(--navy-line)}
.f-cta-in{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:34px 0;flex-wrap:wrap}
.f-cta-in h3{color:#fff;font-size:22px;margin:0}
.f-cta-in p{font-size:14px;margin:8px 0 0;max-width:520px;color:var(--navy-ink)}
.f-chips{display:flex;gap:10px;flex-wrap:wrap}
.f-chip{display:inline-flex;align-items:center;gap:9px;background:var(--navy);border:1px solid var(--navy-line);border-radius:100px;padding:10px 17px;color:#fff;font-family:'Bricolage Grotesque',sans-serif;font-weight:600;font-size:14px;transition:border-color .2s,transform .2s}
.f-chip:hover{border-color:var(--teal-2);transform:translateY(-2px)}
.f-chip i{width:8px;height:8px;border-radius:50%;flex:none}

/* Columns */
.f-main{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr 1fr;gap:34px;padding:54px 0 40px;align-items:start}
.f-brand .brand{color:#fff;margin-bottom:16px}
.f-brand p{font-size:13.5px;line-height:1.7;max-width:340px}
.f-stats{display:flex;flex-wrap:wrap;gap:22px;list-style:none;padding:0;margin:20px 0 0}
.f-stats li{display:flex;flex-direction:column;gap:2px}
.f-stats b{font-family:'Bricolage Grotesque',sans-serif;font-size:20px;color:#fff;line-height:1}
.f-stats span{font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:.05em;text-transform:uppercase;color:rgba(159,182,188,.75)}
.f-col h4{color:#fff;font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.1em;text-transform:uppercase;margin:0 0 16px}
.f-col a{display:block;font-size:14px;margin-bottom:11px;color:var(--navy-ink);transition:color .15s,padding-left .15s}
.f-col a:hover{color:#fff;padding-left:3px}

/* Bottom bar */
.f-bot{border-top:1px solid var(--navy-line);padding:22px 0;display:flex;align-items:center;justify-content:space-between;gap:14px 24px;flex-wrap:wrap;font-family:'IBM Plex Mono',monospace;font-size:12px;color:rgba(159,182,188,.8)}
.f-bot .f-note{flex:1 1 260px;min-width:0}
.f-bot .lg{display:flex;gap:18px;flex-wrap:wrap}
.f-bot a{color:inherit}
.f-bot a:hover{color:#fff}
.f-top{white-space:nowrap}

@media(max-width:1100px){
  .f-main{grid-template-columns:1.4fr 1fr 1fr 1fr;gap:28px}
  .f-main .f-col:last-child{grid-column:2 / -1;display:grid;grid-template-columns:repeat(3,1fr);gap:0 24px}
  .f-main .f-col:last-child h4{grid-column:1/-1}
}
@media(max-width:860px){
  .f-main{grid-template-columns:1fr 1fr;gap:32px 28px}
  .f-brand{grid-column:1/-1}
  .f-main .f-col:last-child{grid-column:auto;display:block}
  .f-main .f-col:last-child h4{grid-column:auto}
  .f-cta-in{flex-direction:column;align-items:flex-start;gap:18px}
}
@media(max-width:560px){
  .f-main{grid-template-columns:1fr;gap:26px;padding:40px 0 30px}
  .f-stats{gap:18px}
  .f-bot{justify-content:flex-start;font-size:11.5px}
  .f-bot .f-note{flex-basis:100%}
}

/* Interior content area gets breathing room under the sticky header */
.pdc-page{padding-top:1.5rem}

.rv{opacity:0;transform:translateY(22px);transition:opacity .6s cubic-bezier(.2,.7,.2,1),transform .6s cubic-bezier(.2,.7,.2,1)}
.rv.in{opacity:1;transform:none}

@media(max-width:980px){
  .hero-in,.about,.dec{grid-template-columns:1fr;gap:40px}
  .bento,.stat-grid{grid-template-columns:1fr 1fr}
  .tb-r a{display:none}
}
@media(max-width:640px){
  .grid-3,.bento,.tool-grid,.about-feats,.checklist,.stat-grid{grid-template-columns:1fr}
  .chips{grid-template-columns:1fr 1fr}
  .pad{padding:62px 0}.cta{padding:44px 22px;border-radius:18px}.wrap{padding-inline:18px}
}
@media(prefers-reduced-motion:reduce){
  .pcx *{animation:none!important;transition:none!important}
  .rv{opacity:1;transform:none}
  .rotor span.on{opacity:1;transform:none}
}

/* ========== PROVIDER PROFILE PAGE ========== */
:root{
  --ev-ver:#0E8C93; --ev-ver-bg:#DBF1EF;
  --ev-clm:#976614; --ev-clm-bg:#F5ECD6;
  --ev-obs:#3A5A86; --ev-obs-bg:#E6ECF5;
  --ev-edt:#6E4A72; --ev-edt-bg:#EFE7F0;
  --ev-unk:#6B7076; --ev-unk-bg:#EAEAE4;
}
.ev{font-family:'IBM Plex Mono',monospace;font-size:10.5px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;padding:3px 8px;border-radius:6px;display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.ev::before{content:"";width:6px;height:6px;border-radius:50%}
.ev.ver{color:var(--ev-ver);background:var(--ev-ver-bg)} .ev.ver::before{background:var(--ev-ver)}
.ev.clm{color:var(--ev-clm);background:var(--ev-clm-bg)} .ev.clm::before{background:var(--ev-clm)}
.ev.obs{color:var(--ev-obs);background:var(--ev-obs-bg)} .ev.obs::before{background:var(--ev-obs)}
.ev.edt{color:var(--ev-edt);background:var(--ev-edt-bg)} .ev.edt::before{background:var(--ev-edt)}
.ev.unk{color:var(--ev-unk);background:var(--ev-unk-bg);border:1px dashed rgba(107,112,118,.5)} .ev.unk::before{background:transparent;border:1.5px dashed var(--ev-unk)}
.crumb{border-bottom:1px solid var(--line);background:var(--bg-2)}
.crumb-in{display:flex;align-items:center;gap:9px;padding:13px 0;font-size:13px;color:var(--ink-3);font-family:'IBM Plex Mono',monospace;flex-wrap:wrap}
.crumb-in a{color:var(--ink-2);text-decoration:none}.crumb-in a:hover{color:var(--teal)}
.crumb-in .cur{color:var(--ink)}
.phero{background:var(--navy);color:#fff;position:relative;overflow:hidden}
.phero::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(760px 360px at 78% -10%,rgba(26,196,180,.18),transparent 60%),radial-gradient(520px 300px at 6% 120%,rgba(255,106,77,.12),transparent 60%)}
.phero-in{position:relative;z-index:1;padding:44px 0 40px;display:grid;grid-template-columns:1fr auto;gap:36px;align-items:start}
.pident{display:flex;gap:18px;align-items:flex-start}
.pident .logo{width:66px;height:66px;border-radius:16px;background:var(--grad-teal);display:grid;place-items:center;font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:26px;color:#fff;flex:none}
.pcat{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--teal-2);margin-bottom:8px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.pcat .st{color:var(--navy-ink);display:inline-flex;align-items:center;gap:6px}
.pcat .st::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--gold)}
.phero h1{color:#fff;font-size:clamp(30px,4.4vw,44px);font-weight:800;margin-bottom:10px}
.psub{color:var(--navy-ink);font-size:15.5px;max-width:520px}
.pchips{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.pcta{background:var(--navy-2);border:1px solid var(--navy-line);border-radius:16px;padding:20px;width:280px}
.pcta .lbl{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--navy-ink);margin-bottom:12px}
.pcta .btn{width:100%}
.pcta .disc{font-size:11px;color:var(--navy-ink);margin-top:12px;line-height:1.5}
.pcta .official,.side-card .official{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;color:var(--teal-2);margin-top:12px;font-family:'IBM Plex Mono',monospace;text-decoration:none}
.side-card .official{color:var(--teal);font-weight:600;font-family:'Hanken Grotesk',sans-serif}
.meter{margin-top:20px;background:rgba(255,255,255,.05);border:1px solid var(--navy-line);border-radius:12px;padding:14px 16px}
.meter .mt{display:flex;justify-content:space-between;align-items:center;font-size:12.5px;color:#fff;font-weight:600;margin-bottom:9px}
.meter .mt span{font-family:'IBM Plex Mono',monospace;color:var(--navy-ink);font-weight:400}
.meter .bar{height:7px;border-radius:7px;background:rgba(255,255,255,.09);overflow:hidden}
.meter .bar i{display:block;height:100%;background:var(--grad-teal);border-radius:7px}
.player{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:40px;align-items:start;padding:48px 0 80px}
.legend{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:24px;font-size:12px;color:var(--ink-3)}
.legend .lt{font-family:'IBM Plex Mono',monospace;text-transform:uppercase;letter-spacing:.08em;margin-right:4px}
.panel{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r-lg);padding:26px 28px;box-shadow:var(--sh-sm);margin-bottom:22px;scroll-margin-top:130px}
.panel-h{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px;flex-wrap:wrap}
.panel h2{font-size:20px}
.prose{color:var(--ink-2);font-size:14.5px;margin-bottom:14px}
.empty{border:1px dashed rgba(107,112,118,.4);border-radius:12px;padding:20px;background:var(--tint-2);display:flex;gap:13px;align-items:flex-start}
.empty .ico{width:34px;height:34px;border-radius:9px;background:var(--ev-unk-bg);color:var(--ev-unk);display:grid;place-items:center;flex:none}
.empty .et{font-weight:600;font-size:14px;margin-bottom:3px}
.empty .ed{color:var(--ink-2);font-size:13.5px}
.facts{display:flex;flex-direction:column}
.frow{display:grid;grid-template-columns:186px 1fr auto;gap:16px;align-items:center;padding:13px 0;border-bottom:1px solid var(--line-2)}
.frow:last-child{border-bottom:none}
.frow .k{font-size:13.5px;color:var(--ink-2)}
.frow .v{font-family:'IBM Plex Mono',monospace;font-weight:600;font-size:14px}
.frow .v.u{color:var(--ev-unk);font-weight:500}
.frow .v a{color:var(--teal);text-decoration:underline;text-underline-offset:2px}
.ptable{width:100%;border-collapse:collapse;font-size:13.5px}
.ptable th,.ptable td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line-2);vertical-align:top}
.ptable thead th{font-family:'IBM Plex Mono',monospace;font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-3);border-bottom:1px solid var(--line)}
.ptable-wrap{overflow-x:auto}
.pc{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.pc .col{border:1px solid var(--line);border-radius:12px;padding:18px;background:var(--tint-2)}
.pc .col h3{font-size:14px;display:flex;align-items:center;gap:8px;margin-bottom:12px}
.pc .col.good h3{color:var(--teal-ink)}.pc .col.bad h3{color:var(--coral-ink)}
.pc .col .ph{font-size:13px;color:var(--ink-3);font-style:italic}
.pc .col ul{padding-left:1.2em;font-size:13.5px;color:var(--ink-2)}
.status-list{display:flex;flex-direction:column;gap:10px}
.stat-row{display:flex;align-items:center;gap:12px;font-size:14px}
.stat-row .dotk{width:9px;height:9px;border-radius:50%;flex:none}
.alts{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.alt{display:flex;align-items:center;gap:12px;padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:var(--bg-2);transition:transform .18s,border-color .18s;text-decoration:none}
.alt:hover{transform:translateY(-2px);border-color:var(--teal)}
.alt .av{width:36px;height:36px;border-radius:9px;display:grid;place-items:center;color:#fff;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:14px;flex:none}
.alt .nm{font-weight:600;font-size:14.5px}
.alt .ty{font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--ink-3)}
.alt .go{margin-left:auto;color:var(--teal)}
.sources ol{list-style:none;counter-reset:s;padding:0;margin:0}
.src{display:flex;gap:13px;padding:13px 0;border-bottom:1px solid var(--line-2);counter-increment:s}
.src:last-child{border-bottom:none}
.src::before{content:counter(s);font-family:'IBM Plex Mono',monospace;font-size:12px;font-weight:600;color:var(--teal);background:var(--teal-soft);width:26px;height:26px;border-radius:7px;display:grid;place-items:center;flex:none}
.src .sc a{font-weight:600;font-size:14px;color:var(--ink);display:inline-flex;align-items:center;gap:6px;text-decoration:none}
.src .sc a:hover{color:var(--teal)}
.src .sc .u{font-family:'IBM Plex Mono',monospace;font-size:11.5px;color:var(--ink-3);display:block;margin-top:2px;overflow-wrap:anywhere}
.side{position:sticky;top:100px;display:flex;flex-direction:column;gap:16px}
.side-card{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r-lg);padding:20px;box-shadow:var(--sh-sm)}
.side-card .sh{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);margin-bottom:14px}
.side-card .btn{width:100%}
.side-card .disc{font-size:11px;color:var(--ink-3);margin-top:11px;line-height:1.5}
.side-mini .row{display:flex;align-items:center;justify-content:space-between;padding:9px 0;border-bottom:1px solid var(--line-2);font-size:13.5px}
.side-mini .row:last-child{border-bottom:none}
.side-mini .row .k{color:var(--ink-2)}
.side-mini .row .v{font-family:'IBM Plex Mono',monospace;font-weight:600}
.jump a{display:flex;align-items:center;gap:9px;padding:8px 0;font-size:14px;color:var(--ink-2);transition:color .15s;text-decoration:none}
.jump a:hover{color:var(--teal)}
.jump a::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--line);flex:none;transition:background .15s}
.jump a:hover::before{background:var(--teal)}
.report{font-size:12.5px;color:var(--ink-3);display:inline-flex;align-items:center;gap:7px;text-decoration:none}
.report:hover{color:var(--teal)}
@media(max-width:980px){
  .phero-in{grid-template-columns:1fr}
  .pcta{width:100%;max-width:420px}
  /* minmax(0,1fr), not 1fr: a plain fr track keeps a min-content floor, so a
     wide specs table pushed the column to 802px inside a 768px viewport. */
  .player{grid-template-columns:minmax(0,1fr);gap:28px}
  .pcol-main{min-width:0}
  .side{position:static;order:2}
}
@media(max-width:600px){
  .pc,.alts{grid-template-columns:1fr}
  .frow{grid-template-columns:1fr auto;row-gap:6px}
  .frow .k{grid-column:1/-1}
}

/* ========== DIRECTORY ARCHIVE ========== */
.ahero{background:var(--tint);border-bottom:1px solid var(--line)}
.ahero-in{padding:44px 0 40px;max-width:760px}
.ahero .eyebrow{margin-bottom:14px}
.ahero h1{font-size:clamp(32px,4.6vw,46px);font-weight:800;margin-bottom:14px}
.ahero p{color:var(--ink-2);font-size:17px;margin-bottom:20px}
.adisc{display:flex;gap:10px;align-items:flex-start;background:var(--bg-2);border:1px solid var(--line);border-left:3px solid var(--gold);border-radius:10px;padding:13px 16px;font-size:13px;color:var(--ink-2);max-width:640px}
.adisc svg{flex:none;color:var(--gold);margin-top:2px}
.toolbar{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-sm);padding:18px 20px;margin:-28px 0 22px;position:relative;z-index:2}
.tb-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr auto;gap:14px;align-items:end}
.fld{display:flex;flex-direction:column;gap:6px;min-width:0}
.fld label{font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}
.fld input,.fld select{font-family:inherit;font-size:14px;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:11px 12px;outline:none;transition:border-color .15s;width:100%}
.fld input:focus,.fld select:focus{border-color:var(--teal)}
.fld .with-ic{position:relative}
.fld .with-ic svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--ink-3)}
.fld .with-ic input{padding-left:34px}
.toolbar .btn{height:44px}
.tb-meta{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:16px;padding-top:16px;border-top:1px solid var(--line-2);flex-wrap:wrap}
.count{font-size:14px;color:var(--ink-2)}
.count b{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;color:var(--ink)}
.count .sub{color:var(--ink-3);font-size:13px}
.sortwrap{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ink-3)}
.sortwrap select{font-family:inherit;font-size:13.5px;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:9px;padding:8px 10px;outline:none}
.btn.sm{padding:9px 15px;font-size:13.5px;border-radius:10px}
.plist{display:flex;flex-direction:column;gap:12px}
.prow{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-sm);padding:18px 20px;display:grid;grid-template-columns:minmax(210px,1.7fr) .95fr .95fr 1.15fr .95fr minmax(120px,auto);gap:18px;align-items:center;transition:border-color .18s,box-shadow .18s,transform .18s}
.prow:hover{border-color:rgba(14,140,147,.4);box-shadow:var(--sh-md);transform:translateY(-2px)}
.pid{display:flex;align-items:center;gap:12px;min-width:0}
.cbx{position:relative;flex:none;width:20px;height:20px;cursor:pointer;display:block}
.cbx input{position:absolute;opacity:0;width:20px;height:20px;cursor:pointer;margin:0}
.cbx span:not(.screen-reader-text){position:absolute;inset:0;border:1.5px solid var(--line);border-radius:6px;background:var(--bg-2);transition:.15s;display:grid;place-items:center}
.cbx span:not(.screen-reader-text)::after{content:"";width:10px;height:10px;background:var(--grad-teal);border-radius:3px;transform:scale(0);transition:transform .15s}
.cbx input:checked+span{border-color:var(--teal)}
.cbx input:checked+span::after{transform:scale(1)}
.cbx input:focus-visible+span{outline:2px solid var(--coral);outline-offset:2px}
.pav{width:44px;height:44px;border-radius:11px;display:grid;place-items:center;color:#fff;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:15px;flex:none}
.pnm{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:16.5px;display:block;text-decoration:none}
.pnm:hover{color:var(--teal)}
.ptag{font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--ink-3);margin-top:2px}
.pcol{display:flex;flex-direction:column;gap:6px;min-width:0}
.pcol .cl{font-family:'IBM Plex Mono',monospace;font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}
.pcol .cv{font-family:'IBM Plex Mono',monospace;font-weight:600;font-size:13.5px;color:var(--ink)}
.pcol .cv.u{color:var(--ev-unk);font-weight:500}
.types{display:flex;flex-wrap:wrap;gap:5px}
.tt{font-size:11px;background:var(--teal-soft);color:var(--teal-ink);border-radius:5px;padding:2px 7px;font-weight:600}
.pact{display:flex;flex-direction:column;gap:8px;align-items:stretch}
.pact .btn{width:100%}
.pager{display:flex;justify-content:center;gap:8px;margin-top:30px}
.pager a,.pager span{min-width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--line);border-radius:10px;background:var(--bg-2);font-weight:600;font-size:14px;color:var(--ink-2);transition:.15s;text-decoration:none;padding:0 8px}
.pager a:hover{border-color:var(--teal);color:var(--teal)}
.pager .cur{background:var(--grad-teal);color:#fff;border-color:transparent}
.pager .nx{padding:0 16px}
.tray{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(140%);z-index:70;background:var(--navy);color:#fff;border:1px solid var(--navy-line);border-radius:16px;box-shadow:0 30px 60px -20px rgba(0,0,0,.5);padding:14px 18px;display:flex;align-items:center;gap:18px;transition:transform .3s cubic-bezier(.2,.8,.2,1);max-width:calc(100% - 32px)}
.tray.on{transform:translateX(-50%) translateY(0)}
.tray .tl{font-size:13.5px;color:var(--navy-ink)}
.tray .tl b{color:#fff;font-family:'Bricolage Grotesque',sans-serif}
.tray .tchips{display:flex;gap:8px;flex-wrap:wrap}
.tray .cchip{background:var(--navy-2);border:1px solid var(--navy-line);border-radius:100px;padding:5px 10px 5px 12px;font-size:12.5px;display:flex;align-items:center;gap:8px}
.tray .cchip button{background:none;border:none;color:var(--navy-ink);cursor:pointer;font-size:14px;line-height:1;padding:0}
.tray .cchip button:hover{color:#fff}
.tray .tact{display:flex;gap:8px;align-items:center}
.tray .clear{font-size:13px;color:var(--navy-ink);background:none;border:none;cursor:pointer}
.tray .clear:hover{color:#fff}
@media(max-width:1020px){
  .prow{grid-template-columns:1fr 1fr;gap:16px 20px}
  .pid{grid-column:1/-1;padding-bottom:14px;border-bottom:1px solid var(--line-2)}
  .pact{grid-column:1/-1;flex-direction:row}
  .pact .btn{width:auto;flex:1}
  .tb-grid{grid-template-columns:1fr 1fr}
  .toolbar .btn{width:100%}
}
@media(max-width:560px){
  .prow{grid-template-columns:1fr}
  .tray{flex-direction:column;align-items:stretch;gap:10px}
}

/* Rich prose inside content panels (methodology, guides, glossary, posts) */
.pcx-prose h2,.prose h2{font-size:24px;margin:1.4em 0 .5em}
.pcx-prose h3,.prose h3{font-size:19px;margin:1.2em 0 .4em}
.pcx-prose p,.prose p{margin:0 0 1em;color:var(--ink-2)}
.pcx-prose ul,.pcx-prose ol,.prose ul,.prose ol{margin:0 0 1em 1.3em;color:var(--ink-2)}
.pcx-prose li,.prose li{margin-bottom:.4em}
.pcx-prose a,.prose a{color:var(--teal);text-decoration:underline;text-underline-offset:2px}
.pcx-prose strong{color:var(--ink)}
.pdc-glossary-index{display:flex;flex-wrap:wrap;gap:.4rem .5rem}
.pdc-glossary-index a{background:var(--tint-2);color:var(--teal-ink);border:1px solid var(--line);border-radius:999px;padding:.25em .8em;font-size:.85rem;text-decoration:none;font-weight:600}
.pdc-glossary-index a:hover{background:var(--grad-teal);color:#fff;border-color:transparent}
.panel[id]{scroll-margin-top:120px}

/* Compare modal */
.pdc-modal[hidden]{display:none}
.pdc-modal{position:fixed;inset:0;z-index:120;display:flex;align-items:center;justify-content:center;padding:20px}
.pdc-modal-backdrop{position:absolute;inset:0;background:rgba(10,32,41,.55);backdrop-filter:blur(3px)}
.pdc-modal-box{position:relative;z-index:1;background:var(--bg-2);border:1px solid var(--line);border-radius:18px;box-shadow:0 44px 88px -30px rgba(10,32,41,.6);width:min(920px,100%);max-height:88vh;display:flex;flex-direction:column;overflow:hidden;animation:pdcModalIn .22s cubic-bezier(.2,.8,.2,1)}
@keyframes pdcModalIn{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
.pdc-modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:22px 26px 16px;border-bottom:1px solid var(--line-2)}
.pdc-modal-head h2{font-size:24px;margin-top:6px}
.pdc-modal-x{background:var(--bg);border:1px solid var(--line);border-radius:10px;width:40px;height:40px;font-size:22px;line-height:1;color:var(--ink-2);cursor:pointer;flex:none;transition:.15s}
.pdc-modal-x:hover{border-color:var(--coral);color:var(--coral)}
.pdc-modal-body{padding:8px 26px 20px;overflow:auto}
.pdc-modal-foot{padding:14px 26px;border-top:1px solid var(--line-2);background:var(--tint-2)}
.pdc-cmp-scroll{overflow-x:auto}
.pdc-cmp-table{width:100%;border-collapse:collapse;font-size:13.5px;min-width:520px}
.pdc-cmp-table th,.pdc-cmp-table td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--line-2);vertical-align:top}
.pdc-cmp-table thead th{position:sticky;top:0;background:var(--navy);color:#fff;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:14px}
.pdc-cmp-table thead th a{color:#fff;text-decoration:none}
.pdc-cmp-table thead th:first-child{background:var(--navy-2)}
.pdc-cmp-table tbody th{font-family:'IBM Plex Mono',monospace;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-3);font-weight:600}
.pdc-cmp-table td .u,.pdc-cmp-table .u{color:var(--ev-unk);font-weight:500}
.pdc-cmp-visit{font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--teal-2)!important;font-weight:400}
@media(max-width:560px){.pdc-modal{padding:10px}.pdc-modal-head,.pdc-modal-body,.pdc-modal-foot{padding-left:16px;padding-right:16px}}

/* ========== V2 PLAYFUL PALETTE + HOME COMPONENTS ========== */
:root{
  --bg:#F1F7F9; --tint:#E0F4F1; --tint-2:#E9F6F4;
  --teal:#0AA6B4; --teal-2:#20E3CD; --teal-ink:#08727C; --teal-soft:#D3F5F0;
  --grad-teal:linear-gradient(120deg,#0AA6B4 0%,#24E6CE 100%);
  --grad-sky:linear-gradient(120deg,#2FA9F0 0%,#57D2F7 100%);
  --grad-violet:linear-gradient(120deg,#6E63F2 0%,#9E8CFF 100%);
  --grad-pink:linear-gradient(120deg,#FF5C9B 0%,#FF86B6 100%);
  --grad-lime:linear-gradient(120deg,#1EC46E 0%,#4ADE85 100%);
  --coral:#FF5A44; --coral-2:#FF9A3C; --coral-ink:#E5432B; --coral-soft:#FFE4DD;
  --grad-coral:linear-gradient(120deg,#FF5A44 0%,#FF9E3A 100%);
  --gold:#FBB024; --gold-soft:#FDEFCF;
}
.pav-logo,.av-logo{background:#fff;border:1px solid var(--line);overflow:hidden}
.pav-logo img,.av-logo img{width:100%;height:100%;object-fit:contain;padding:5px}
.logo.logo-img{background:#fff;padding:0;overflow:hidden;border:1px solid var(--navy-line)}
.logo.logo-img img{width:100%;height:100%;object-fit:contain;padding:8px}
.pdc-cmp-logo{vertical-align:middle;border-radius:5px;background:#fff;object-fit:contain}
.pdc-logo-img{border-radius:9px;background:#fff;object-fit:contain}

/* ===== Homepage v2 (playful) ===== */
.grad-sky{--g:linear-gradient(120deg,#2FA9F0 0%,#57D2F7 100%)}
.tint-mint{background:linear-gradient(180deg,#E7F9F3,#EFFAF6)}
.tint-lav{background:linear-gradient(180deg,#EFECFD,#F5F3FE)}
.tint-sky{background:linear-gradient(180deg,#E6F2FD,#EFF6FE)}
.tint-peach{background:linear-gradient(180deg,#FDEEE8,#FEF4F0)}
.band{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.hero2{position:relative;padding:56px 0 48px;overflow:hidden;background:linear-gradient(155deg,#E4FBF4 0%,#EFF9FA 40%,#FCEBF2 100%)}
.hero2 .hero-bg{position:absolute;inset:0;z-index:0;pointer-events:none}
.hero2 .g{position:absolute;border-radius:50%;filter:blur(85px)}
.hero2 .g1{width:520px;height:520px;background:rgba(32,227,205,.28);top:-150px;right:-40px}
.hero2 .g2{width:460px;height:460px;background:rgba(255,92,155,.15);bottom:-180px;left:-120px}
.hero2 .grid{position:absolute;inset:0;background-image:linear-gradient(rgba(10,166,180,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(10,166,180,.06) 1px,transparent 1px);background-size:48px 48px;-webkit-mask-image:radial-gradient(115% 78% at 60% 0%,#000,transparent 72%);mask-image:radial-gradient(115% 78% at 60% 0%,#000,transparent 72%)}
.hero2-in{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.03fr) minmax(0,.97fr);gap:48px;align-items:center}
.pill2{display:inline-flex;align-items:center;gap:9px;background:var(--bg-2);border:1px solid var(--line);border-radius:100px;padding:6px 15px 6px 8px;font-size:13px;color:var(--ink-2);box-shadow:var(--sh-sm)}
.pill2 .dot{width:8px;height:8px;border-radius:50%;background:var(--teal-2);box-shadow:0 0 0 4px var(--teal-soft)}
.pill2 b{color:var(--ink);font-weight:700}
.hero2 h1{font-size:clamp(38px,5.3vw,60px);font-weight:800;letter-spacing:-.03em;margin:20px 0 6px}
.hero2 .lead{font-size:18px;color:var(--ink-2);max-width:520px;margin:20px 0 22px}
.trustrow{display:flex;gap:18px;flex-wrap:wrap;align-items:center;margin-bottom:20px}
.trustrow .t{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ink-2);font-weight:500}
.trustrow .t svg{color:var(--teal)}
.hmeter{display:inline-flex;align-items:center;gap:4px}
.hmeter .seg{width:14px;height:5px;border-radius:3px;background:var(--line)}
.hmeter .seg.on{background:var(--grad-teal)}
.hmeter i{font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--ink-3);font-style:normal;margin-left:3px}
.hw{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r-xl);box-shadow:var(--sh-lg);overflow:hidden}
.hw-top{display:flex;align-items:center;justify-content:space-between;padding:15px 18px;border-bottom:1px solid var(--line-2);gap:12px}
.hw-top .t{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:14.5px;display:flex;align-items:center;gap:8px}
.hw-top .t svg{color:var(--teal)}
.hw-live{font-family:'IBM Plex Mono',monospace;font-size:10.5px;font-weight:600;color:var(--teal);background:var(--teal-soft);border-radius:7px;padding:4px 9px;display:flex;align-items:center;gap:6px}
.hw-live::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--teal)}
.hw-search{display:flex;align-items:center;gap:9px;padding:12px 18px;border-bottom:1px solid var(--line-2)}
.hw-search svg{color:var(--ink-3);flex:none}
.hw-search input{flex:1;border:none;outline:none;background:transparent;font-family:inherit;font-size:14px;color:var(--ink)}
.hw-pills{display:flex;gap:7px;padding:12px 18px 6px;flex-wrap:wrap}
.hwp{font-size:12px;font-weight:600;color:var(--ink-2);background:var(--bg);border:1px solid var(--line);border-radius:100px;padding:5px 12px;cursor:pointer;transition:.15s}
.hwp:hover{border-color:var(--teal);color:var(--teal)}
.hwp.on{background:var(--grad-teal);color:#fff;border-color:transparent}
.hw-list{max-height:296px;overflow-y:auto}
.hwrow{display:flex;align-items:center;gap:12px;padding:12px 18px;border-bottom:1px solid var(--line-2);transition:background .15s;text-decoration:none;color:inherit}
.hwrow:hover{background:var(--tint-2)}
.hav{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;color:#fff;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:12.5px;flex:none;overflow:hidden}
.hav img{width:100%;height:100%;object-fit:contain;padding:4px;background:#fff}
.hwi{min-width:0;flex:1}
.hnm{font-weight:700;font-size:14px;display:block}
.htypes{display:flex;gap:4px;margin-top:3px;flex-wrap:wrap}
.htt{font-size:9.5px;background:var(--teal-soft);color:var(--teal-ink);border-radius:4px;padding:1px 6px;font-family:'IBM Plex Mono',monospace}
.hwp2{text-align:right;flex:none}
.hprice{font-family:'IBM Plex Mono',monospace;font-weight:600;font-size:13px;display:block}
.hwrow .hmeter{margin-top:4px;justify-content:flex-end}
.hw-foot{display:flex;align-items:center;justify-content:space-between;padding:13px 18px;background:var(--tint);gap:10px}
.hw-foot .n{font-size:12.5px;color:var(--ink-2)}.hw-foot .n b{font-family:'Bricolage Grotesque',sans-serif}
.stats2{display:grid;grid-template-columns:repeat(4,1fr);padding:8px 0}
.stat2{padding:32px 24px;border-right:1px solid var(--navy-line)}
.stat2:last-child{border-right:none}
.stat2 .n{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:36px;letter-spacing:-.03em;background:var(--grad-teal);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.stat2 .l{font-size:14.5px;color:#fff;font-weight:600;margin-top:6px}
.stat2 .s{font-family:'IBM Plex Mono',monospace;font-size:10.5px;color:var(--navy-ink);letter-spacing:.05em;text-transform:uppercase}
.cats{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.cat{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r-lg);padding:24px;box-shadow:var(--sh-sm);transition:transform .2s,border-color .2s,box-shadow .2s;display:flex;flex-direction:column;text-decoration:none;color:inherit}
.cat:hover{transform:translateY(-4px);border-color:var(--teal);box-shadow:var(--sh-md)}
.cat .ci{width:46px;height:46px;border-radius:12px;background:var(--grad-teal);color:#fff;display:grid;place-items:center;margin-bottom:16px}
.cat h3{font-size:17px;margin-bottom:6px}
.cat .n{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--ink-3);margin-bottom:14px}
.cat .n b{color:var(--teal);font-weight:600}
.cat .go{margin-top:auto;color:var(--teal);font-weight:700;font-size:13.5px;display:inline-flex;align-items:center;gap:6px}
.model{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:center}
.model .lead{font-size:16.5px;margin:14px 0 22px}
.labels{display:grid;gap:11px}
.lab{display:grid;grid-template-columns:140px 1fr;gap:16px;align-items:start;background:var(--navy-2);border:1px solid var(--navy-line);border-radius:12px;padding:15px 18px}
.lab .d{font-size:13px;color:var(--navy-ink)}
.lab .d b{color:#fff}
.record{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r-xl);box-shadow:var(--sh-lg);overflow:hidden;color:var(--ink)}
.record .rhd{padding:14px 18px;background:var(--grad-teal);color:#fff;display:flex;align-items:center;justify-content:space-between;font-family:'IBM Plex Mono',monospace;font-size:11px}
.record .prov{display:flex;align-items:center;gap:11px;padding:15px 18px;border-bottom:1px solid var(--line-2)}
.record .prov .av{width:38px;height:38px;border-radius:10px;background:var(--tint);color:var(--teal-ink);display:grid;place-items:center;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;border:1px solid var(--line);overflow:hidden}
.record .prov .av img{width:100%;height:100%;object-fit:contain;padding:4px;background:#fff}
.record .prov .nm{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:16px}
.record .prov .ty{font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--ink-3)}
.rfield{padding:12px 18px;border-bottom:1px solid var(--line-2)}
.rfield:last-child{border-bottom:none}
.rfield .top{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.rfield .k{font-size:13px;color:var(--ink-2)}
.rfield .v{font-family:'IBM Plex Mono',monospace;font-weight:600;font-size:13.5px}
.rfield .v.u{color:var(--ev-unk);font-weight:500}
.rfield .meta{display:flex;gap:9px;align-items:center;margin-top:7px;flex-wrap:wrap}
.rfield .src{font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--ink-3)}
.finder{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r-xl);box-shadow:var(--sh-md);max-width:900px;margin:0 auto;overflow:hidden}
.fstep{padding:26px 30px;border-bottom:1px solid var(--line-2)}
.fstep .q{display:flex;align-items:center;gap:11px;margin-bottom:16px}
.fstep .q .num{width:26px;height:26px;border-radius:50%;background:var(--grad-teal);color:#fff;display:grid;place-items:center;font-family:'IBM Plex Mono',monospace;font-size:12px;font-weight:600;flex:none}
.fstep .q h3{font-size:17px}
.fopts{display:flex;flex-wrap:wrap;gap:10px}
.fopt{font-size:14px;font-weight:600;color:var(--ink-2);background:var(--bg);border:1.5px solid var(--line);border-radius:12px;padding:11px 18px;cursor:pointer;transition:.15s}
.fopt:hover{border-color:var(--teal);color:var(--teal)}
.fopt.on{border-color:var(--teal);background:var(--teal-soft);color:var(--teal-ink)}
.fresult{padding:26px 30px;background:var(--tint);display:none}
.fresult.show{display:block;animation:pdcFade .4s ease}
@keyframes pdcFade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.fres-head{display:flex;align-items:center;gap:12px;margin-bottom:18px;flex-wrap:wrap}
.fres-head .rec{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:19px}
.fres-head .rec b{color:var(--teal-ink)}
.fmatch{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:18px}
.fm{background:var(--bg-2);border:1px solid var(--line);border-radius:12px;padding:14px;display:flex;align-items:center;gap:11px;text-decoration:none;color:inherit}
.fm .av{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;color:#fff;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:12px;flex:none;overflow:hidden}
.fm .av img{width:100%;height:100%;object-fit:contain;padding:3px;background:#fff}
.fm .nm{font-weight:700;font-size:14px}
.fm .pr{font-family:'IBM Plex Mono',monospace;font-size:11.5px;color:var(--ink-3)}
.tabs{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-bottom:32px}
.tab{font-size:14px;font-weight:600;color:var(--navy-ink);background:var(--navy-2);border:1px solid var(--navy-line);border-radius:100px;padding:9px 18px;cursor:pointer;transition:.15s}
.tab:hover{color:#fff}
.tab.on{background:var(--grad-teal);color:#fff;border-color:transparent}
.tabpane{display:none}.tabpane.on{display:block}
.fgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.fcard{background:var(--navy-2);border:1px solid var(--navy-line);border-radius:var(--r-lg);padding:22px}
.fcard .ft{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.fcard .av{width:44px;height:44px;border-radius:11px;display:grid;place-items:center;color:#fff;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;flex:none;overflow:hidden}
.fcard .av img{width:100%;height:100%;object-fit:contain;padding:5px;background:#fff}
.fcard .nm{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:16px;color:#fff}
.fcard .ty{font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--navy-ink)}
.fcard .frow{display:flex;justify-content:space-between;align-items:center;padding:9px 0;border-top:1px solid var(--navy-line);font-size:13px;color:var(--navy-ink)}
.fcard .frow .v{font-family:'IBM Plex Mono',monospace;font-weight:600;color:#fff}
.fcard .fbtn{display:flex;gap:8px;margin-top:16px}
.fcard .fbtn .btn{flex:1}
.tab-empty{text-align:center;padding:40px;color:var(--navy-ink)}
.tab-empty b{color:#fff;font-family:'Bricolage Grotesque',sans-serif;font-size:22px;display:block;margin-bottom:6px}
.vs{max-width:840px;margin:0 auto;background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r-xl);box-shadow:var(--sh-md);overflow:hidden}
.vs-h{display:grid;grid-template-columns:1.5fr 1fr 1fr}
.vs-h>div{padding:18px 20px;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:14.5px}
.vs-h .us{background:var(--teal-soft);color:var(--teal-ink);text-align:center}
.vs-h .them{text-align:center;color:var(--ink-3)}
.vs-r{display:grid;grid-template-columns:1.5fr 1fr 1fr;border-top:1px solid var(--line-2)}
.vs-r>div{padding:15px 20px;display:flex;align-items:center;font-size:14px}
.vs-r .lbl{color:var(--ink-2)}
.vs-r .c{justify-content:center}
.vs-r .yes{color:var(--teal)}.vs-r .no{color:var(--ink-3)}
.vs-r .us-col{background:rgba(14,140,147,.04)}
.uc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.uc2{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r-lg);padding:22px;box-shadow:var(--sh-sm);transition:transform .2s,border-color .2s}
.uc2:hover{transform:translateY(-3px);border-color:var(--teal)}
.uc2 .tag{font-family:'IBM Plex Mono',monospace;font-size:10.5px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--teal);background:var(--teal-soft);padding:4px 9px;border-radius:6px}
.uc2 h3{font-size:17px;margin:13px 0 7px}
.uc2 p{color:var(--ink-2);font-size:14px}
@media(max-width:980px){
  .hero2-in,.model{grid-template-columns:1fr;gap:38px}
  .cats,.stats2{grid-template-columns:1fr 1fr}
  .stat2{border-right:none;border-bottom:1px solid var(--navy-line)}
  .fmatch,.fgrid,.uc-grid{grid-template-columns:1fr}
}
@media(max-width:600px){
  .cats,.stats2{grid-template-columns:1fr}
  .vs-h,.vs-r{grid-template-columns:1.3fr .8fr .8fr}
  .vs-h>div,.vs-r>div{padding:12px;font-size:12.5px}
  .lab{grid-template-columns:1fr;gap:8px}
}

/* ========== COUPON CODES ========== */
.cpn-list{display:flex;flex-direction:column;gap:10px}
.cpn{display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:center;border:1px solid var(--line);border-radius:12px;padding:14px 16px;background:var(--bg-2);transition:border-color .18s}
.cpn:hover{border-color:var(--teal)}
.cpn-best{border-color:var(--teal);background:linear-gradient(90deg,var(--teal-soft),var(--bg-2) 60%)}
.cpn-info{display:flex;flex-direction:column;gap:3px;min-width:0}
.cpn-flag{font-family:'IBM Plex Mono',monospace;font-size:9.5px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--teal-ink);background:var(--teal-soft);border-radius:5px;padding:2px 7px;align-self:flex-start}
.cpn-disc{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:15.5px;color:var(--ink)}
.cpn-date{font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--ink-3)}
.cpn-code{display:inline-flex;align-items:center;gap:10px;background:var(--bg);border:1px dashed var(--teal);border-radius:9px;padding:9px 13px;cursor:pointer;font-family:'IBM Plex Mono',monospace;font-weight:600;font-size:14px;color:var(--teal-ink);transition:background .15s,border-color .15s}
.cpn-code:hover{background:var(--teal-soft)}
.cpn-code:focus-visible{outline:2px solid var(--coral);outline-offset:2px}
.cpn-code.copied{border-style:solid;background:var(--teal-soft)}
.cpn-cta{font-family:'Hanken Grotesk',sans-serif;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--teal);border-left:1px solid rgba(14,140,147,.3);padding-left:10px}
.cpn-go{white-space:nowrap}
.cpn-badge{display:inline-block;font-family:'IBM Plex Mono',monospace;font-size:10.5px;font-weight:600;color:var(--coral-ink);background:var(--coral-soft);border-radius:5px;padding:2px 8px;text-decoration:none;margin-top:2px}
.cpn-badge:hover{background:var(--coral);color:#fff}
@media(max-width:640px){
  .cpn{grid-template-columns:1fr;gap:10px}
  .cpn-code{justify-content:space-between}
  .cpn-go{width:100%}
}

/* Provider notice (withheld link / under review) */
.pdc-notice{border-color:var(--gold);border-left:4px solid var(--gold);background:linear-gradient(90deg,rgba(251,176,36,.07),var(--bg-2) 55%)}
.pdc-notice-in{display:flex;gap:14px;align-items:flex-start}
.pdc-notice-ico{color:var(--gold);flex:none;margin-top:2px}
.pdc-notice h2{font-size:17px;margin:0 0 6px}
.pdc-notice p{margin:0;color:var(--ink-2);font-size:14.5px;max-width:70ch}

/* ==================== MOBILE REFINEMENTS (<=720px) ==================== */
@media(max-width:720px){
  /* Tighter shell spacing so content isn't squeezed by padding */
  .wrap{padding-inline:16px}
  .panel{padding:18px 16px;border-radius:14px;margin-bottom:16px}
  .panel h2{font-size:18px}
  .phero-in{padding:26px 0 24px;gap:22px}
  .ahero-in{padding:28px 0 26px}
  .ahero h1{font-size:clamp(26px,7vw,34px)}
  .player{padding:26px 0 40px;gap:22px}
  .pcx-footer{margin-top:40px}
  .crumb-in{padding:10px 0;font-size:12px}

  /* Provider hero: smaller logo + heading, chips wrap cleanly */
  .pident{gap:13px}
  .pident .logo{width:52px;height:52px;border-radius:13px;font-size:20px}
  .phero h1{font-size:clamp(25px,7vw,32px)}
  .psub{font-size:14.5px}
  .pchips{gap:6px;margin-top:14px}
  .pcta{padding:16px;border-radius:14px}

  /* Topbar: keep the claim short so it stays on one line */
  .tb-l{font-size:10.5px;letter-spacing:0}
  .tb-l .tb-long{display:none}
  .topbar-in{height:34px}

  /* DATA TABLES → stacked labelled cards (no horizontal scrolling for facts) */
  .ptable-wrap{overflow-x:visible}
  .ptable{min-width:0;border-collapse:separate;border-spacing:0}
  .ptable thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .ptable tr{display:block;border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin-bottom:10px;background:var(--bg-2)}
  .ptable td,.ptable th{display:flex;justify-content:space-between;align-items:baseline;gap:14px;border:0;padding:6px 0;text-align:right}
  .ptable td::before,.ptable th::before{content:attr(data-label);font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-3);text-align:left;flex:none}
  .ptable th[scope="row"]{border-bottom:1px solid var(--line-2);margin-bottom:4px;padding-bottom:8px}
  .ptable th[scope="row"]::before{color:var(--ink-3)}

  /* At-a-glance rows stack instead of squeezing into columns */
  .frow{grid-template-columns:1fr;row-gap:4px;padding:11px 0}
  .frow .k{grid-column:auto;font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-3)}
  .frow .v{font-size:14px;word-break:break-word}

  /* Sidebar: drop what the page already shows above (CTA + jump nav) */
  .side .side-card:first-child{display:none}
  .side .side-card:last-of-type{display:none}
  .side{gap:12px}

  /* Coupons stack full width */
  .cpn{grid-template-columns:1fr;gap:10px;padding:13px 14px}
  .cpn-code{justify-content:space-between;width:100%}
  .cpn-go{width:100%}

  /* Directory rows: label each data cell */
  .prow{padding:15px 16px;gap:14px}
  .pcol .cl{font-size:9px}
  .pact{flex-direction:row;gap:8px}
  .pact .btn{flex:1}
}
@media(max-width:420px){
  .wrap{padding-inline:14px}
  .pident .logo{width:46px;height:46px;font-size:18px}
  .ptable td,.ptable th{flex-direction:column;align-items:flex-start;gap:2px;text-align:left}
  .f-stats{gap:14px}
}

/* Hero grid must never be widened by its max-content children (the price
   ticker is width:max-content, which was blowing the column to ~2700px and
   clipping the headline on small screens). */
.hero2-in{grid-template-columns:minmax(0,1.03fr) minmax(0,.97fr)}
.hero-copy,.hero2-in>*{min-width:0}
.ticker-wrap{max-width:100%}
@media(max-width:980px){
  .hero2-in,.model{grid-template-columns:minmax(0,1fr)}
}

/* ==================== TABLET (721–980px) ==================== */
@media(min-width:721px) and (max-width:980px){
  /* Card grids keep two columns instead of collapsing to one — a single
     column wastes half a tablet screen. */
  .fgrid,.uc-grid,.grid-3,.fmatch,.bento,.tool-grid{grid-template-columns:repeat(2,1fr)}
  .cats,.stats2{grid-template-columns:repeat(2,1fr)}
  .about-feats,.checklist{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:980px){
  /* Once the provider layout is single-column the sidebar repeats what the
     page already showed above, so drop the duplicate CTA and jump nav. */
  .side .side-card:first-child{display:none}
  .side .side-card:last-of-type{display:none}
  .side{gap:12px}
  /* Keep wide data tables inside their own scroller, never the page. */
  .ptable-wrap{max-width:100%}
}

/* ==================== POLISH PASS ====================
   Refinement only — no layout or design changes. Fixes numeric alignment,
   table scannability, heading/button consistency and focus coverage. */

/* 1. Tabular figures so prices, dates and counts line up in columns */
.ptable td,.ptable th,.pcol .cv,.cpn-disc,.f-stats b,.stat2 .n,.hprice,.frow .v,
.side-mini .row .v,.pdc-cmp-table td,.brow .pr .v,.fp-specs .v,.term-it .pr,
.ticker .t,.pager a,.pager span{font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}

/* 2. Data tables: zebra + hover so a wide row is easy to track across */
@media(min-width:721px){
  .ptable tbody tr:nth-child(even){background:rgba(14,140,147,.028)}
  .ptable tbody tr{transition:background .15s}
  .ptable tbody tr:hover{background:var(--tint-2)}
  /* Numeric / short columns read better right-aligned */
  .ptable td[data-label="Price"],.ptable td[data-label="Checked"],
  .ptable td[data-label="Verified"]{text-align:right;white-space:nowrap}
  .ptable th[data-label="Plan"]{white-space:nowrap}
}
/* Price is the scan target — give it weight without changing the palette */
.ptable td[data-label="Price"]{font-weight:700;color:var(--ink)}

/* 3. Consistent panel headings (were mixing 20px and 24px) */
.panel h2,.pdc-coupons h2,.pdc-notice h2{font-size:20px;line-height:1.2}
.panel .panel-h{align-items:baseline}

/* 4. Consistent control heights and comfortable tap targets */
.btn{min-height:44px}
.btn.sm{min-height:38px}
.cpn-code{min-height:44px}

/* 5. Focus visibility everywhere interactive (keyboard + a11y polish) */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,
summary:focus-visible,.cbx input:focus-visible+span{outline:2px solid var(--coral);outline-offset:2px;border-radius:4px}
.faq summary:focus-visible{outline-offset:-2px}

/* 6. Evidence bar: tighter rhythm, clearer state contrast */
.pdc-evidence-bar ul{padding:.7rem 1rem}
.pdc-ev-no{opacity:.85}

/* 7. Empty states read as informative, not broken */
.empty{align-items:center}
.empty .et{color:var(--ink)}

/* 8. Source list: long URLs never blow out the panel */
.src .sc a{overflow-wrap:anywhere}


/* 10. Directory rows: clearer separation of provider vs data */
.prow .pid{border-right:1px solid var(--line-2);padding-right:16px}
@media(max-width:1020px){ .prow .pid{border-right:0;padding-right:0} }

/* ==================== STICKY MOBILE VISIT BAR ==================== */
.pdc-stickybar{display:none}
@media(max-width:720px){
  .pdc-stickybar{display:block;position:fixed;left:0;right:0;bottom:0;z-index:80;
    background:var(--bg-2);border-top:1px solid var(--line);
    box-shadow:0 -8px 28px -14px rgba(14,37,48,.35);
    padding:9px 14px calc(9px + env(safe-area-inset-bottom));
    transform:translateY(110%);transition:transform .26s cubic-bezier(.2,.8,.2,1)}
  .pdc-stickybar.on{transform:translateY(0)}
  .pdc-stickybar[hidden]{display:none}
  .psb-in{display:flex;align-items:center;gap:11px}
  .psb-logo{width:34px;height:34px;border-radius:9px;background:#fff;border:1px solid var(--line);flex:none;display:grid;place-items:center;overflow:hidden}
  .psb-logo img{width:100%;height:100%;object-fit:contain;padding:4px}
  .psb-info{display:flex;flex-direction:column;gap:1px;min-width:0;flex:1}
  .psb-name{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:14.5px;color:var(--ink);
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .psb-meta{display:flex;align-items:center;gap:7px;flex-wrap:nowrap;overflow:hidden}
  .psb-price{font-family:'IBM Plex Mono',monospace;font-size:11.5px;font-weight:600;color:var(--teal-ink);
    font-variant-numeric:tabular-nums;white-space:nowrap}
  .psb-cpn{font-family:'IBM Plex Mono',monospace;font-size:10px;font-weight:600;color:var(--coral-ink);
    background:var(--coral-soft);border-radius:4px;padding:1px 6px;white-space:nowrap;
    max-width:96px;overflow:hidden;text-overflow:ellipsis}
  .psb-ad{font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.06em;text-transform:uppercase;
    color:var(--ink-3);border:1px solid var(--line);border-radius:3px;padding:0 4px;flex:none}
  .pdc-stickybar .psb-go{flex:none;min-width:88px;padding:12px 16px;min-height:44px}
  /* Keep the footer reachable above the bar */
  body.has-stickybar .pcx-footer{padding-bottom:64px}
}
@media(prefers-reduced-motion:reduce){
  .pdc-stickybar{transition:none}
}

/* ==================== HERO FACT STRIP (provider single) ==================== */
.pfacts{display:flex;flex-wrap:wrap;gap:1px;margin-top:22px;
  background:var(--navy-line);border:1px solid var(--navy-line);border-radius:13px;overflow:hidden;max-width:560px}
.pfacts .pf{background:rgba(255,255,255,.035);padding:12px 14px;display:flex;flex-direction:column;gap:5px;min-width:0;flex:1 1 0}
.pf-k{font-family:'IBM Plex Mono',monospace;font-size:9.5px;letter-spacing:.07em;text-transform:uppercase;
  color:var(--navy-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pf-v{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:18px;color:#fff;line-height:1.2;
  overflow-wrap:break-word;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pf-v em{font-style:normal;font-family:'IBM Plex Mono',monospace;font-size:10.5px;font-weight:500;
  color:var(--teal-2);margin-left:5px;letter-spacing:.02em}
.pmeta{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:16px;font-size:12.5px;color:var(--navy-ink)}
.pmeta span{display:inline-flex;align-items:center;gap:6px}
.pmeta svg{color:var(--teal-2);flex:none}
.pmeta a{color:var(--navy-ink);text-decoration:underline;text-underline-offset:2px;text-decoration-color:var(--navy-line)}
.pmeta a:hover{color:#fff;text-decoration-color:var(--teal-2)}
.pmeta .pm-hot svg{color:var(--coral)}
.pmeta .pm-hot a{color:#fff;font-weight:600;text-decoration-color:var(--coral)}
@media(max-width:980px){
  .pfacts{max-width:none}
  .pf-v{font-size:17px}
}
@media(max-width:720px){
  .pfacts{margin-top:18px;border-radius:12px}
  .pfacts .pf{flex:1 1 42%}
  .pfacts .pf{padding:11px 13px}
  .pf-v{font-size:16.5px}
  .pmeta{gap:7px 14px;margin-top:14px;font-size:12px}
}
@media(max-width:420px){
  .pf-k{font-size:9px}
  .pf-v{font-size:15.5px}
}
.pf-v.sm{font-size:14px;white-space:normal;line-height:1.25;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.pf-v.sm em{display:block;margin:2px 0 0}
@media(max-width:720px){.pf-v.sm{font-size:13.5px}}
/* Pending chips sit on the dark hero — the light-surface grey has no contrast there. */
.pchips .ev.unk{color:var(--navy-ink);background:rgba(255,255,255,.04);border:1px dashed var(--navy-line)}
.pchips .ev.unk::before{border-color:var(--navy-ink)}
.pfacts-note{display:block;padding:14px 16px;background:rgba(255,255,255,.035)}
.pfacts-note p{color:var(--navy-ink);font-size:13.5px;line-height:1.6;margin:0 0 8px}
.pfacts-note a{color:var(--teal-2);font-size:12.5px;font-weight:600;text-decoration:none;font-family:'IBM Plex Mono',monospace}
.pfacts-note a:hover{color:#fff}
@media(max-width:720px){.pfacts-note{padding:13px 14px}.pfacts-note p{font-size:13px}}

/* ==================== CHARTS (inline SVG, no library) ==================== */
.pdc-charts{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px;margin:0 0 22px}
.pdc-chart{margin:0;border:1px solid var(--line);border-radius:14px;padding:16px;background:var(--bg-2);min-width:0}
.pdc-chart figcaption{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px;flex-wrap:wrap}
.pdc-chart .ch-t{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:14.5px;color:var(--ink)}
.pdc-chart .ch-n{margin:12px 0 0;font-size:12px;line-height:1.55;color:var(--ink-3)}
/* Sidebar evidence donut */
.side-chart{text-align:center}
.side-chart .sh{text-align:left}
.pdc-donut-svg{display:block;margin:4px auto 12px;max-width:100%;height:auto}
.pdc-donut-svg .pdc-d-num{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:25px;fill:var(--ink);font-variant-numeric:tabular-nums}
.pdc-donut-svg .pdc-d-sub{font-family:'IBM Plex Mono',monospace;font-size:9.5px;letter-spacing:.07em;text-transform:uppercase;fill:var(--ink-3)}
.ch-legend{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:6px 10px;text-align:left}
.ch-legend li{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--ink-3)}
.ch-legend .dot{width:8px;height:8px;border-radius:50%;flex:none;background:var(--line)}
.ch-legend .is-on{color:var(--ink-2)}
.ch-legend .is-on .dot{background:#17C0B2}
.ch-legend .is-off .dot{border:1.5px dashed var(--ink-3);background:transparent}
@media(max-width:980px){
  .pdc-charts{grid-template-columns:1fr}
}
@media(max-width:720px){
  .pdc-charts{gap:12px;margin-bottom:16px}
  .pdc-chart{padding:14px;border-radius:12px}
  .pdc-chart .ch-t{font-size:14px}
}
/* Bar rows are HTML, not SVG: labels keep their true size at any viewport. */
.pdc-bars{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.pdc-bar{display:grid;grid-template-columns:minmax(0,112px) minmax(0,1fr) auto;align-items:center;gap:10px}
/* Floor the row height. The grid row inside each bar measured correctly at
   ~19px, but the row box itself collapsed to 6px, so the label, the track and
   the price all spilled over the row beneath — the chart rendered as a stack
   of hairlines with the text overlapping. min-height only sets a floor, so
   rows whose sub-label wraps to two lines still grow past it. */
.pdc-bar{min-height:20px}
@media(max-width:980px){.pdc-bar{min-height:18px}}
.pb-l{font-size:12.5px;color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.pdc-bar.is-hi .pb-l{font-weight:700;color:var(--ink)}
.pb-track{height:16px;border-radius:5px;background:var(--line);opacity:.55;overflow:hidden;min-width:0}
.pb-fill{display:block;height:100%;border-radius:5px;background:var(--teal);opacity:.42}
.pdc-bar.is-hi .pb-fill{background:var(--coral);opacity:1}
.pb-v{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--ink-3);font-variant-numeric:tabular-nums;white-space:nowrap}
.pdc-bar.is-hi .pb-v{font-weight:600;color:var(--coral-ink)}
@media(max-width:720px){
  .pdc-bar{grid-template-columns:minmax(0,88px) minmax(0,1fr) auto;gap:8px}
  .pb-l{font-size:12px}
  .pb-v{font-size:11.5px}
  .pb-track{height:14px}
}
@media(max-width:420px){
  .pdc-bar{grid-template-columns:minmax(0,74px) minmax(0,1fr) auto;gap:7px}
  .pb-l{font-size:11.5px}
}
/* Sample-size sub-label under a bar label */
.pb-l{display:flex;flex-direction:column;gap:1px;line-height:1.25}
.pb-s{font-family:'IBM Plex Mono',monospace;font-size:9.5px;color:var(--ink-3);font-weight:400;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Homepage price landscape */
.pcx-landscape{display:grid;grid-template-columns:1.35fr 1fr;gap:18px;align-items:start}
.pcx-landscape .pdc-chart{background:var(--bg-2)}
.mix-in{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.mix-in .pdc-donut-svg{margin:0;flex:none}
.mix-legend{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;min-width:0;flex:1}
.mix-legend li{display:flex;align-items:center;gap:8px;font-size:13px;min-width:0}
.mix-legend .dot{width:9px;height:9px;border-radius:50%;flex:none}
.mix-legend a{color:var(--ink-2);text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mix-legend a:hover{color:var(--teal-ink);text-decoration:underline}
.mix-legend b{margin-left:auto;font-family:'IBM Plex Mono',monospace;font-size:12.5px;
  color:var(--ink);font-variant-numeric:tabular-nums}
/* Archive charts */
.adir-charts{margin-top:22px;grid-template-columns:1.35fr 1fr}
.adir-cov{display:flex;flex-direction:column;align-items:center;text-align:center}
.adir-cov figcaption{width:100%}
.adir-cov .ch-n{text-align:left}
@media(max-width:980px){
  .pcx-landscape,.adir-charts{grid-template-columns:1fr}
}
@media(max-width:720px){
  .pcx-landscape{gap:12px}
  .mix-in{gap:14px}
  .mix-legend li{font-size:12.5px}
  .adir-charts{margin-top:16px}
}
@media(max-width:420px){
  .mix-in{flex-direction:column;align-items:flex-start}
  .mix-legend{width:100%}
}
.pdc-bars.has-sub .pdc-bar{grid-template-columns:minmax(0,168px) minmax(0,1fr) auto}
@media(max-width:720px){
  .pdc-bars.has-sub .pdc-bar{grid-template-columns:minmax(0,132px) minmax(0,1fr) auto}
  .pb-s{font-size:9px}
}
@media(max-width:420px){
  .pdc-bars.has-sub .pdc-bar{grid-template-columns:minmax(0,118px) minmax(0,1fr) auto}
}
@media(max-width:720px){
  /* Sample sizes wrap rather than truncate — a clipped "27 providers · from $0…"
     is worse than two lines. */
  .pb-s{white-space:normal;overflow:visible;text-overflow:clip;line-height:1.3}
}
/* Compare-page charts */
.cmp-charts{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin-bottom:24px}

/* ---- Archive chart row spacing ----
   The toolbar tucks up into the hero with a -28px margin. When the chart row
   is present it takes over that tuck, and the toolbar gets normal spacing —
   otherwise the toolbar is pulled back over the charts. */
.adir-charts{margin-top:-28px;position:relative;z-index:2}
.wrap.after-charts .toolbar{margin-top:0}

/* Bars were too pale to read against their track at a glance. */
.pb-track{opacity:1;background:var(--line)}
.pb-fill{opacity:.66}
.pdc-bar.is-hi .pb-fill{opacity:1}

/* Coverage card: donut, a real count legend, then the note — so the card
   carries content instead of centring a lone donut in white space. */
.adir-cov{justify-content:flex-start}
.adir-cov .pdc-donut-svg{margin:6px auto 14px}
.cov-legend{list-style:none;margin:0 0 4px;padding:0;display:flex;gap:8px 18px;
  flex-wrap:wrap;justify-content:center;width:100%}
.cov-legend li{display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--ink-2)}
.cov-legend .dot{width:9px;height:9px;border-radius:50%;flex:none}
.cov-legend b{font-family:'IBM Plex Mono',monospace;font-variant-numeric:tabular-nums;color:var(--ink)}
@media(max-width:980px){
  .adir-charts{margin-top:-28px}
}
@media(max-width:720px){
  .adir-charts{margin-top:-20px;gap:12px}
}
/* The coverage card is stretched to match the taller price card, so its slack
   pooled at the base. Pin the note to the bottom: both cards' notes then line
   up and the leftover space sits between the legend and the note. */
.adir-cov .ch-n{margin-top:auto;padding-top:12px}
@media(max-width:720px){
  /* 88px cut off names like "Oculus Proxies"; the track has room to spare. */
  .pdc-bar{grid-template-columns:minmax(0,104px) minmax(0,1fr) auto}
}

/* ---- Chart mobile corrections ---- */
@media(max-width:980px){
  /* The provider layout is single-column here, so the sidebar donut restates
     the hero's evidence meter (and the hero chips already break it down by
     section). Same de-duplication rule as the sidebar CTA and jump nav. */
  .side-chart{display:none}
}
@media(max-width:720px){
  /* Legend entries are real links to the segment archives; 20px is far below
     a usable touch target, so the whole row becomes tappable. */
  .mix-legend li{min-height:44px}
  .mix-legend a{flex:1;padding:12px 0}
  .mix-legend{gap:0}
  .mix-legend li+li{border-top:1px solid var(--line)}
}

/* The block renderer's table wrapper had no overflow rule at all, so the
   comparison matrix (5 columns) spilled past its wrapper and widened the whole
   page on mobile instead of scrolling inside it. */
.pdc-table-wrap{overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch}
@media(max-width:720px){
  .pdc-comparison .pdc-table{min-width:480px}
  .pdc-comparison .pdc-table th,.pdc-comparison .pdc-table td{white-space:normal}
}

/* ==================== CHARTS — TABLET TIER (721–980px) ====================
   Charts were collapsing to a single full-width column here, leaving a 477px
   bar track for a $0.14 value and wasting half the screen — the same problem
   D-39 fixed for the other card grids. Two columns instead, which puts these
   cards at ~343px: the width the compare page already proves works. Card width
   drives the bar sizing, so the compact bar rules apply here too, and tablets
   are touch devices, so the 44px legend target does as well. */
@media(min-width:721px) and (max-width:980px){
  .pcx-landscape,.adir-charts,.pdc-charts{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
  .pdc-bar{grid-template-columns:minmax(0,104px) minmax(0,1fr) auto;gap:8px}
  .pdc-bars.has-sub .pdc-bar{grid-template-columns:minmax(0,132px) minmax(0,1fr) auto}
  .pb-l{font-size:12px}
  .pb-v{font-size:11.5px}
  .pb-track{height:14px}
  .pb-s{white-space:normal;overflow:visible;text-overflow:clip;line-height:1.3}
  /* Touch targets: same reasoning as mobile, tablets are touch devices. */
  .mix-legend{gap:0}
  .mix-legend li{min-height:44px}
  .mix-legend li+li{border-top:1px solid var(--line)}
  .mix-legend a{flex:1;padding:12px 0}
}
@media(max-width:980px){
  /* Beside a 132px donut in a ~335px card the legend has no room, so
     "Anti-detect browsers" was cut. Stack the donut above it instead. */
  .mix-in{flex-direction:column;align-items:flex-start}
  .mix-in .pdc-donut-svg{align-self:center}
  .mix-legend{width:100%}
  /* Long names ("Entry plan (141 GB)") wrap rather than truncate — same rule
     already applied to the sample-size sub-labels. */
  .pb-l{white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:break-word}
}
/* The 1.5% width floor in the builder keeps the cheapest bar from vanishing at
   desktop, but 1.5% of an 81px tablet track is ~1px. A pixel floor expresses
   the same intent in a unit that survives narrow tracks. */
.pb-fill{min-width:6px}

/* ==================== CHART DETAIL PANEL ====================
   Shown on hover, focus or tap. Fixed-positioned and hidden on scroll, so it
   can never widen the page or drift away from the bar it describes. */
.pdc-tip{position:fixed;z-index:200;max-width:min(280px,calc(100vw - 24px));
  background:var(--ink);color:#fff;border-radius:10px;padding:11px 13px;
  box-shadow:0 12px 32px -10px rgba(14,37,48,.5);pointer-events:none;
  opacity:0;transform:translateY(3px);transition:opacity .13s ease,transform .13s ease}
.pdc-tip.on{opacity:1;transform:translateY(0)}
.pdc-tip-h{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:13px;
  margin-bottom:7px;padding-bottom:6px;border-bottom:1px solid rgba(255,255,255,.16)}
.pdc-tip-l{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;margin:0}
.pdc-tip-l dt{font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.05em;
  text-transform:uppercase;color:rgba(255,255,255,.62);white-space:nowrap;margin:0}
.pdc-tip-l dd{margin:0;font-size:12.5px;line-height:1.4;text-align:right;
  font-variant-numeric:tabular-nums;overflow-wrap:break-word}
/* Make it obvious which row the panel belongs to. */
.pdc-bar[data-pdc-tip]{cursor:pointer;border-radius:6px}
.pdc-bar[data-pdc-tip]:hover .pb-track,.pdc-bar.pdc-tip-on .pb-track{background:var(--line-2,#d5dee0)}
.pdc-bar[data-pdc-tip]:hover .pb-fill,.pdc-bar.pdc-tip-on .pb-fill{opacity:.85}
.pdc-bar.is-hi[data-pdc-tip]:hover .pb-fill,.pdc-bar.is-hi.pdc-tip-on .pb-fill{opacity:1}
.pdc-bar[data-pdc-tip]:focus-visible{outline:2px solid var(--teal);outline-offset:3px}
.pdc-d-arc{cursor:pointer;transition:opacity .13s ease}
.pdc-donut-svg:hover .pdc-d-arc{opacity:.5}
.pdc-donut-svg .pdc-d-arc:hover,.pdc-d-arc.pdc-tip-on{opacity:1}
@media(prefers-reduced-motion:reduce){
  .pdc-tip,.pdc-d-arc{transition:none}
}
@media(max-width:720px){
  .pdc-tip{max-width:calc(100vw - 20px);padding:10px 12px}
  .pdc-tip-l dd{font-size:12px}
}
/* Search results row: four columns rather than the archive's six. Defined here,
   not as an inline style on the element, so the responsive rules below can
   actually collapse it on narrow screens. */
.prow-4{grid-template-columns:minmax(210px,1.7fr) .95fr 1.15fr minmax(120px,auto)}
@media(max-width:980px){ .prow-4{grid-template-columns:1fr 1fr} }
@media(max-width:600px){ .prow-4{grid-template-columns:1fr} }

/* ==================== WCAG AA CONTRAST FIXES ====================
   From the pre-launch audit, measured against each element's real composited
   background. Selectors are scoped by surface: the same class appears on both
   the dark hero and light cards, and darkening it globally makes the dark
   surface worse, which is exactly what a first pass here did. */

/* Teal links on LIGHT surfaces only (2.95:1 -> 7.8:1). */
.side-card .official,
.frow .v a,
.jump a:hover,
.mix-legend a:hover,
.nav-links a:hover{color:var(--teal-ink)}
/* The same class on the dark hero card must stay light. */
.pcta .official{color:var(--teal-2)}

/* "Verified" chip: teal on mint was 3.44:1. */
.ev.ver{color:var(--teal-ink)}
/* "Recorded" chip: gold on soft gold was 4.22:1. */
.ev.clm{color:#7A5200}

/* Coral text on LIGHT surfaces (3.94–4.06:1 -> 5.3–5.9:1). Deliberately not
   applied to .pf-v em, which sits on the dark hero. */
.pc .col.bad h3,
.pdc-bar.is-hi .pb-v{color:#B33B22}

/* Avatar plates carry white initials and are painted by an inline style, so the
   override needs !important. White on the old gold plate was 2.05:1. */
.alt .av,
.pav,
.pdc-comparison .pav{background:#0A5B60 !important}

/* WCAG 2.4.1 Bypass Blocks: hidden until focused. */
.skip-link{position:absolute;left:-9999px;top:0;z-index:300;background:var(--ink);color:#fff;
  padding:12px 18px;border-radius:0 0 10px 0;font-weight:600;font-size:14px;text-decoration:none}
.skip-link:focus{left:0}
/* The "unknown" chip sits on a grey plate, where --ink-3 lands at 4.14:1. */
.ev.unk{color:#4A585E}
/* --teal (#0AA6B4) is a brand colour tuned for fills and gradients; as text on a
   light surface it lands at 2.95:1. These are the text-only usages. The token
   itself is left alone so buttons, icons and rules keep the brand hue. */
.eyebrow,
.cat .go,
.cats .n b,
.stat2 .n,
.fp-more,
.term-it .pr{color:var(--teal-ink)}
/* Teal text on the teal-soft chip was 2.54:1. */
.pill2,.pill2 b{color:var(--teal-ink)}
/* Hero widget "live" badge: teal on teal-soft was 2.54:1. */
.hw-live{color:var(--teal-ink)}

/* The skip link was invisible even when focused: .pcx a{color:inherit} is
   (0,1,1) and outranks .skip-link{color:#fff} at (0,1,0), so the label
   rendered in --ink on an --ink background. Restore it above that rule. */
.pcx a.skip-link{color:#fff}
.pcx a.skip-link:focus{color:#fff;left:0;outline:3px solid var(--teal-2);outline-offset:-3px}
/* Product-type chip: --teal on --teal-soft measured 2.54:1 against a 4.5:1
   requirement at 10.5px. --teal-ink on the same ground is 4.92:1. */
.tag,.uc .tag,.uc2 .tag,.cmp-h .tag{color:var(--teal-ink)}

/* Tool forms (price calculator, coverage finder).
   These previously carried grid-template-columns as an inline style, which
   outranks every media query — the same trap the .prow-4 fix addressed — so the
   fields could never collapse and two number inputs ended up 64px wide on a
   phone. Defined as classes so the breakpoints can do their job. */
.tool-grid{display:grid;grid-template-columns:1fr 1fr auto;gap:14px;align-items:end}
.tool-grid-1{display:grid;grid-template-columns:1fr auto;gap:14px;align-items:end}
.tool-grid .btn,.tool-grid-1 .btn{white-space:nowrap}
@media(max-width:720px){
  .tool-grid,.tool-grid-1{grid-template-columns:1fr}
  .tool-grid .btn,.tool-grid-1 .btn{width:100%;justify-content:center}
}
/* Derived-result callout on the calculator. */
.tool-result{margin:0;padding:16px 18px;background:var(--teal-soft);border-radius:12px;font-size:15px;color:var(--teal-ink)}
.tool-note{margin:14px 0 0;font-size:13px;color:var(--ink-3)}
