/* ca-brand.css — Privacy Insight Solutions brand system (from BRAND-KIT.md v1.1)
   Applied to the hi-fi Corporate Audit page. Dark, refined, restrained.
   Gold is the discretion/precision marker — capped (~8% of accent volume). */

:root{
  --navy:#07121f; --steel:#a8b4bf; --steel-muted:#c4d0de; --white:#f8faff;
  --accent:#3498db; --gold:#d4af37; --amber:#f39c12; --success:#2ecc71; --alert:#e74c3c;
  --accent-bg:rgba(52,152,219,.1); --accent-border:rgba(52,152,219,.3);
  --gold-bg:rgba(212,175,55,.1); --gold-border:rgba(212,175,55,.3);
  --border:rgba(168,180,191,.2); --glass:rgba(7,18,31,.95);
  /* tier accent — gold by default (Corporate Audit / premium); overridden per service */
  --tier:var(--gold); --tier-border:var(--gold-border); --tier-tint:rgba(212,175,55,.035);
  --font-main:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,'SF Mono',Consolas,monospace;
  --rail-w:264px; --maxw:1200px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;background:#07121f;background-image:radial-gradient(circle at 50% 0%,#112235 0%,#07121f 60%);
  background-attachment:fixed;color:var(--steel-muted);font-family:var(--font-main);
  font-size:16px;line-height:1.7;-webkit-font-smoothing:antialiased;
}
a{color:var(--accent);text-decoration:none;}
a:hover{text-decoration:underline;text-underline-offset:3px;}
.link-accent{color:var(--accent);}
strong{color:var(--white);font-weight:700;}
.currency{color:var(--gold);}
[data-mono]{font-family:var(--font-mono);font-variant-numeric:tabular-nums;}
.skip-link{position:absolute;left:-999px;}
.skip-link:focus{left:16px;top:16px;background:var(--white);color:var(--navy);padding:8px 14px;border-radius:6px;z-index:100;}

/* tier override: accent-blue services (e.g. The Lockdown) */
body.tier-accent{--tier:var(--accent);--tier-border:var(--accent-border);--tier-tint:rgba(52,152,219,.05);}
/* tier override: steel (entry — The Mirror) */
body.tier-steel{--tier:var(--steel);--tier-border:rgba(168,180,191,.35);--tier-tint:rgba(168,180,191,.05);}
/* tier override: amber (threat mitigation — The Shield) */
body.tier-amber{--tier:var(--amber);--tier-border:rgba(243,156,18,.32);--tier-tint:rgba(243,156,18,.05);}
/* tier: gold (premium — The Eraser / Corporate Audit) — matches the :root default, declared for clarity */
body.tier-gold{--tier:var(--gold);--tier-border:var(--gold-border);--tier-tint:rgba(212,175,55,.035);}

/* offer / retainer / add-on callout (e.g. The Guardian, add-ons) */
.offerbox{border:1px solid var(--tier-border);background:var(--tier-tint);border-radius:12px;padding:1.4rem 1.6rem;margin:1.6rem 0;}
.offerbox h3{color:var(--white);margin:0 0 .5rem;font-size:1.05rem;display:flex;align-items:baseline;gap:.6rem;flex-wrap:wrap;}
.offerbox h3 .tag{font-family:var(--font-mono);color:var(--tier);font-size:.78rem;font-weight:500;}
.offerbox p{margin:0 0 .5rem;font-size:.92rem;max-width:none;}
.offerbox ul{margin:.5rem 0 0;padding-left:1.1rem;font-size:.88rem;color:var(--steel-muted);}
.offerbox li{margin-bottom:.35rem;}

/* ---------- header ---------- */
.site-header{position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;
  padding:1rem 2rem;background:var(--glass);backdrop-filter:blur(10px);border-bottom:1px solid var(--border);}
.logo{font-size:1.2rem;font-weight:800;letter-spacing:2px;color:var(--white);}
.logo .logo-mark{color:var(--gold);}
.main-nav{display:flex;align-items:center;gap:1.6rem;}
.main-nav a{font-size:.8rem;font-weight:600;letter-spacing:1px;text-transform:uppercase;color:var(--steel);transition:color .2s;}
.main-nav a:hover{color:var(--white);text-decoration:none;}
.main-nav a.active{color:var(--white);}
.nav-cta{background:var(--white);color:var(--navy)!important;padding:.6rem 1.1rem;border-radius:6px;font-weight:700;}
.nav-cta:hover{opacity:.9;text-decoration:none;}
.hamburger{display:none;background:none;border:none;color:var(--white);font-size:1.4rem;cursor:pointer;}

/* ---------- shell ---------- */
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 2rem;}
.breadcrumb{font-size:.78rem;color:var(--steel);padding:1.2rem 0 0;}
.breadcrumb a{color:var(--steel);}
.breadcrumb .sep{margin:0 .5rem;color:var(--border);}
.eyebrow{font-family:var(--font-mono);font-size:.75rem;font-weight:500;letter-spacing:.12em;
  text-transform:uppercase;color:var(--gold);display:inline-flex;align-items:center;gap:.5rem;margin-bottom:1rem;}
.eyebrow--steel{color:var(--steel);}

/* ---------- hero ---------- */
.hero{display:grid;grid-template-columns:1.12fr .88fr;gap:3.2rem;align-items:start;
  padding:3.4rem 0 3rem;border-bottom:1px solid var(--border);}
.hero-main{max-width:640px;}
.hero h1{font-size:clamp(2.1rem,4.2vw,3.2rem);font-weight:800;letter-spacing:-.03em;line-height:1.08;
  color:var(--white);margin:.3rem 0 1.2rem;text-wrap:balance;}
.hero-sub{font-size:1.16rem;line-height:1.6;color:var(--steel-muted);text-wrap:pretty;margin:0;}

/* engagement panel (fills the hero's right side with real facts) */
.hero-panel{border:1px solid var(--border);border-top:3px dotted var(--tier);border-radius:4px 4px 12px 12px;
  padding:1.6rem 1.7rem;background:var(--tier-tint);}
.hp-eyebrow{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--steel);}
.hp-price{font-size:1.9rem;font-weight:800;color:var(--white);margin:.5rem 0 .1rem;}
.hp-note{font-family:var(--font-mono);font-size:.8rem;color:var(--steel);margin:0 0 1.1rem;}
.hp-spec{margin:0 0 1.3rem;padding:0;border-top:1px solid var(--border);}
.hp-spec>div{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;
  padding:.62rem 0;border-bottom:1px solid var(--border);}
.hp-spec dt{font-family:var(--font-mono);font-size:.74rem;letter-spacing:.04em;text-transform:uppercase;color:var(--steel);}
.hp-spec dd{margin:0;font-family:var(--font-mono);font-size:.8rem;color:var(--steel-muted);text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap;flex-shrink:0;}
.hp-ctas{display:flex;flex-direction:column;gap:.6rem;}
.hp-consent{font-family:var(--font-mono);font-size:.74rem;color:var(--steel);margin:1rem 0 0;display:flex;align-items:center;gap:.5rem;line-height:1.4;}
.hp-consent::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--success);flex-shrink:0;}

/* shared CTA row + assurance (used by the CTA band) */
.hero-ctas{display:flex;gap:.9rem;flex-wrap:wrap;}
.assurance{font-family:var(--font-mono);font-size:.82rem;color:var(--steel);margin-top:1.3rem;display:flex;align-items:center;gap:.5rem;}
.assurance::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--success);flex-shrink:0;}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.85rem 1.7rem;
  border-radius:6px;font-weight:700;font-size:.9rem;border:1px solid transparent;cursor:pointer;transition:.2s;font-family:inherit;}
.btn:hover{transform:scale(1.02);opacity:.95;text-decoration:none;}
.btn-primary{background:var(--white);color:var(--navy);}
.btn-outline{background:transparent;border-color:var(--border);color:var(--white);}
.btn-outline:hover{border-color:var(--steel);}
.btn-block{width:100%;}

/* ---------- two-column rail layout ---------- */
.layout{display:grid;grid-template-columns:var(--rail-w) 1fr;gap:0;align-items:start;}
.rail{position:sticky;top:84px;align-self:start;padding:2.2rem 1.6rem 2rem 0;border-right:1px dotted var(--tier-border);
  display:flex;flex-direction:column;gap:.3rem;}
.rail-eyebrow{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--tier);margin-bottom:1.1rem;}
.rail-item{display:grid;grid-template-columns:auto 1fr;column-gap:.7rem;align-items:baseline;
  padding:.7rem .85rem;border-radius:8px;border-left:2px solid transparent;cursor:pointer;transition:.2s;text-decoration:none;}
.rail-item:hover{background:rgba(255,255,255,.03);text-decoration:none;}
.rail-item.is-active{background:var(--accent-bg);border-left-color:var(--accent);}
.rail-n{font-family:var(--font-mono);font-size:.95rem;color:var(--steel);grid-row:span 2;align-self:center;font-variant-numeric:tabular-nums;}
.rail-item.is-active .rail-n{color:var(--accent);}
.rail-name{font-weight:700;font-size:1rem;color:var(--steel);}
.rail-item.is-active .rail-name{color:var(--white);}
.rail-kicker{font-family:var(--font-mono);font-size:.72rem;color:var(--steel);opacity:.75;grid-column:2;}
.rail-progress{height:2px;background:var(--border);border-radius:2px;margin:1.4rem .85rem .4rem;overflow:hidden;}
.rail-progress span{display:block;height:100%;width:0;background:var(--accent);transition:width .15s linear;}
.rail-foot{margin-top:1.3rem;display:flex;flex-direction:column;gap:.6rem;}

/* ---------- content column ---------- */
.content{padding:2.4rem 0 2.4rem 3rem;min-width:0;}
.pillar{padding-bottom:3rem;margin-bottom:3rem;border-bottom:1px solid var(--border);scroll-margin-top:90px;}
.pillar:last-of-type{border-bottom:none;}
.pillar-head{display:flex;align-items:baseline;gap:1rem;margin-bottom:.4rem;}
.pillar-head .num{font-family:var(--font-mono);font-size:2.6rem;font-weight:500;color:var(--tier);line-height:1;opacity:.55;}
.pillar-head .meta{display:flex;flex-direction:column;}
.pillar-head .kick{font-family:var(--font-mono);font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--steel);}
.pillar-head .name{font-size:1.9rem;font-weight:800;letter-spacing:-.02em;color:var(--white);line-height:1.1;}
.pillar-promise{font-size:1.12rem;color:var(--steel-muted);max-width:620px;margin:0 0 2rem;text-wrap:pretty;}

.content h2{font-size:1.4rem;font-weight:800;letter-spacing:-.02em;line-height:1.2;color:var(--white);margin:2.2rem 0 .8rem;}
.content h3{font-size:1.05rem;font-weight:700;color:var(--white);margin:1.4rem 0 .5rem;}
.content p{margin:0 0 1rem;max-width:680px;text-wrap:pretty;}
.content ul{margin:0 0 1.2rem;padding-left:1.2rem;max-width:680px;}
.content li{margin-bottom:.55rem;}
.content li::marker{color:var(--steel);}

/* consent callout */
.callout{display:flex;gap:.9rem;align-items:flex-start;background:rgba(46,204,113,.07);border:1px solid rgba(46,204,113,.28);
  border-radius:10px;padding:1.2rem 1.4rem;margin:1.6rem 0;}
.callout .tick{color:var(--success);font-size:1.1rem;line-height:1.4;flex-shrink:0;}
.callout h3{margin:0 0 .3rem;font-size:1rem;color:var(--success);}
.callout p{margin:0;font-size:.92rem;max-width:none;}

/* surfaces grid */
.surfaces{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin:1rem 0 1.6rem;}
.surface{background:rgba(255,255,255,.03);border:1px solid var(--border);border-radius:10px;padding:1.1rem 1.2rem;transition:border-color .2s;}
.surface:hover{border-color:var(--accent-border);}
.surface .s-n{font-family:var(--font-mono);font-size:.78rem;color:var(--tier);font-variant-numeric:tabular-nums;}
.surface .s-t{font-weight:700;color:var(--white);font-size:.98rem;margin:.25rem 0 .35rem;}
.surface .s-d{font-size:.86rem;color:var(--steel-muted);line-height:1.55;margin:0;}

/* deliverables table */
.deliv{width:100%;border-collapse:collapse;border:1px solid var(--border);border-radius:10px;overflow:hidden;margin:.8rem 0 1.6rem;}
.deliv td{padding:.9rem 1.1rem;border-bottom:1px solid var(--border);vertical-align:top;}
.deliv tr:last-child td{border-bottom:none;}
.deliv .d-t{font-weight:700;color:var(--white);font-size:.92rem;width:42%;}
.deliv .d-t small{display:block;font-weight:400;color:var(--steel);font-family:var(--font-mono);font-size:.72rem;margin-top:.2rem;}
.deliv .d-d{font-size:.88rem;color:var(--steel-muted);}

/* process steps */
.process{display:flex;flex-direction:column;gap:.7rem;margin:.8rem 0 1rem;}
.step{display:flex;gap:.9rem;align-items:flex-start;}
.step .step-n{width:30px;height:30px;border-radius:50%;background:var(--accent);color:var(--white);
  display:flex;align-items:center;justify-content:center;font-size:.85rem;font-weight:700;flex-shrink:0;}
.step .step-b strong{display:block;color:var(--white);font-size:.96rem;}
.step .step-b span{font-size:.88rem;color:var(--steel-muted);}

/* solutions cards */
.sols{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin-top:.6rem;}
.sol{background:rgba(255,255,255,.03);border:1px solid var(--border);border-radius:10px;padding:1.3rem;}
.sol h3{margin:0 0 .4rem;}
.sol p{font-size:.9rem;margin:0;max-width:none;}

/* ---------- SEO / positioning zone ---------- */
.seo-zone{padding:3rem 0;border-top:1px solid var(--border);}
.seo-zone .eyebrow{color:var(--steel);}
.seo-grid{columns:2;column-gap:2.4rem;margin-top:1.4rem;}
.seo-block{break-inside:avoid;margin-bottom:1.8rem;}
.seo-block h3{font-size:1.02rem;color:var(--white);margin:0 0 .5rem;}
.seo-block p{font-size:.9rem;color:var(--steel-muted);margin:0 0 .7rem;max-width:none;}
.seo-block ul{font-size:.88rem;}

/* ---------- FAQ ---------- */
.faq{max-width:760px;margin-top:1.2rem;}
.faq-item{border:1px solid var(--border);border-radius:8px;margin-bottom:.7rem;overflow:hidden;}
.faq-trigger{width:100%;padding:1.1rem 1.2rem;background:rgba(255,255,255,.02);border:none;color:var(--white);
  text-align:left;font-weight:700;font-size:.96rem;cursor:pointer;display:flex;justify-content:space-between;
  align-items:center;gap:1rem;font-family:inherit;}
.faq-trigger:hover{background:rgba(255,255,255,.05);}
.faq-trigger .ic{color:var(--steel);transition:transform .3s;flex-shrink:0;}
.faq-item.open .faq-trigger .ic{transform:rotate(180deg);}
.faq-body{max-height:0;overflow:hidden;transition:max-height .3s ease;background:rgba(0,0,0,.18);}
.faq-item.open .faq-body{max-height:340px;}
.faq-body p{padding:1.1rem 1.2rem;margin:0;font-size:.92rem;}

/* ---------- CTA band ---------- */
.cta-band{text-align:center;padding:4rem 2rem;border-top:1px solid var(--border);
  background:linear-gradient(145deg,var(--tier-tint) 0%,rgba(7,18,31,.6) 100%);}
.cta-band h2{font-size:clamp(1.7rem,3vw,2.3rem);font-weight:800;letter-spacing:-.02em;color:var(--white);
  margin:0 auto .9rem;max-width:640px;text-wrap:balance;}
.cta-band p{max-width:540px;margin:0 auto 1.6rem;}
.cta-band .hero-ctas{justify-content:center;}
.cta-band .assurance{justify-content:center;}

/* ---------- footer ---------- */
.site-footer{border-top:1px solid var(--border);padding:3rem 0 2rem;}
.footer-grid{display:grid;grid-template-columns:1.5fr repeat(4,1fr);gap:2rem;}
.footer-desc{font-size:.85rem;color:var(--steel);margin-top:.8rem;max-width:240px;}
.footer-col h4{font-size:.82rem;font-weight:800;letter-spacing:1px;color:var(--white);margin:0 0 .8rem;}
.footer-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.5rem;}
.footer-col a{font-size:.85rem;color:var(--steel);}
.footer-col a:hover{color:var(--white);}
.footer-bottom{font-family:var(--font-mono);font-size:.78rem;color:var(--steel);margin-top:2.4rem;padding-top:1.4rem;border-top:1px solid var(--border);}

/* ---------- stat strip ---------- */
.stat-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:0;
  border:1px solid var(--border);border-radius:12px;overflow:hidden;margin:0 0 2.8rem;}
.stat-item{padding:1.5rem 1.6rem;border-right:1px solid var(--border);text-align:center;}
.stat-item:last-child{border-right:none;}
.stat-n{display:block;font-family:var(--font-mono);font-size:2.2rem;font-weight:700;color:var(--white);
  letter-spacing:-.03em;line-height:1;}
.stat-l{display:block;font-size:.83rem;color:var(--steel-muted);line-height:1.45;margin:.5rem 0 .4rem;}
.stat-src{display:block;font-family:var(--font-mono);font-size:.72rem;color:var(--steel);opacity:.7;}

/* info-gap — board's structural blind spot */
.info-gap{border-left:2px solid var(--tier);padding:.15rem 0 .15rem 1rem;margin:0 0 1.8rem;
  font-size:1.05rem;color:var(--white);line-height:1.6;max-width:640px;}

/* reg-cite — academic/regulatory footnote */
.reg-cite{font-family:var(--font-mono);font-size:.78rem;color:var(--steel);
  margin:-.4rem 0 1rem;display:block;max-width:680px;}

/* ---------- mobile section bar (hidden on desktop) ---------- */
.mobile-bar{display:none;}
.mobile-scrim{display:none;}

@media(max-width:900px){
  .main-nav{display:none;}
  .main-nav.open{display:flex;position:absolute;top:100%;left:0;right:0;flex-direction:column;
    align-items:flex-start;gap:1.1rem;background:var(--glass);backdrop-filter:blur(12px);
    padding:1.4rem 2rem;border-bottom:1px solid var(--border);}
  .main-nav.open .nav-cta{align-self:stretch;text-align:center;}
  .hamburger{display:block;}
  .content{padding:2rem 0 0;}
  .layout{grid-template-columns:1fr;}
  .rail{display:none;}
  .surfaces,.sols{grid-template-columns:1fr;}
  .seo-grid{columns:1;}
  .hero{padding:2.6rem 0 2.4rem;grid-template-columns:1fr;gap:2rem;}
  .hero-main{max-width:none;}

  /* sticky current-section bar */
  .mobile-bar{display:block;position:sticky;top:65px;z-index:30;margin:0 -2rem;}
  .mobile-bar-btn{width:100%;display:flex;align-items:center;justify-content:space-between;gap:.8rem;
    background:var(--glass);backdrop-filter:blur(10px);border:none;border-bottom:1px solid var(--border);
    padding:.85rem 2rem;color:var(--white);font-family:inherit;font-weight:700;font-size:.95rem;cursor:pointer;}
  .mobile-bar-btn .mb-cur{display:flex;align-items:center;gap:.55rem;}
  .mobile-bar-btn .mb-n{font-family:var(--font-mono);color:var(--tier);}
  .mobile-bar-btn .mb-ic{color:var(--steel);transition:transform .25s;}
  .mobile-bar.open .mb-ic{transform:rotate(180deg);}
  .mobile-bar-prog{height:2px;background:var(--border);}
  .mobile-bar-prog span{display:block;height:100%;width:0;background:var(--accent);transition:width .15s linear;}
  .mobile-sheet{position:absolute;left:0;right:0;top:100%;background:var(--glass);backdrop-filter:blur(14px);
    border-bottom:1px solid var(--border);padding:.6rem;transform:translateY(-8px);opacity:0;pointer-events:none;transition:.22s;}
  .mobile-bar.open .mobile-sheet{transform:translateY(0);opacity:1;pointer-events:auto;}
  .ms-item{display:grid;grid-template-columns:auto 1fr;column-gap:.7rem;align-items:baseline;
    padding:.85rem .9rem;border-radius:8px;border-left:2px solid transparent;text-decoration:none;}
  .ms-item.is-active{background:var(--accent-bg);border-left-color:var(--accent);}
  .ms-n{font-family:var(--font-mono);color:var(--steel);grid-row:span 2;align-self:center;}
  .ms-item.is-active .ms-n{color:var(--accent);}
  .ms-name{font-weight:700;color:var(--steel);}
  .ms-item.is-active .ms-name{color:var(--white);}
  .ms-kick{font-family:var(--font-mono);font-size:.72rem;color:var(--steel);opacity:.75;grid-column:2;}
  .ms-ctas{display:flex;flex-direction:column;gap:.55rem;padding:.7rem .5rem .4rem;}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .stat-strip{grid-template-columns:repeat(2,1fr);}
  .stat-item:nth-child(2){border-right:none;}
  .stat-item:nth-child(3){border-top:1px solid var(--border);}
  .stat-item:nth-child(4){border-right:none;border-top:1px solid var(--border);}
}
@media(max-width:560px){
  .wrap{padding:0 1rem;}
  .mobile-bar{margin:0 -1rem;}
  .mobile-bar-btn{padding:.85rem 1rem;}
  .footer-grid{grid-template-columns:1fr;}
}

/* ============================================================
   HUB PAGES (pillar / SEO collection pages)
   Reuse the service-page shell (header, hero, rail, mobile bar,
   FAQ, CTA band, footer) and add a few hub-only components.
   EVERY selector below is scoped to body[data-page="hub"] so none
   of it can bleed onto service pages — even where it extends a
   shared base class (.surface). Hub pages set <body data-page="hub">.
   ============================================================ */

/* section blocks in the content column */
body[data-page="hub"] .hub-sec{padding-bottom:2.8rem;margin-bottom:2.8rem;border-bottom:1px solid var(--border);scroll-margin-top:96px;}
body[data-page="hub"] .hub-sec:last-of-type{border-bottom:none;margin-bottom:0;padding-bottom:1rem;}
body[data-page="hub"] .hub-head{display:flex;align-items:baseline;gap:.95rem;margin-bottom:.9rem;}
body[data-page="hub"] .hub-head .num{font-family:var(--font-mono);font-size:1rem;color:var(--tier);opacity:.75;font-variant-numeric:tabular-nums;flex-shrink:0;}
body[data-page="hub"] .hub-head h2{font-size:1.5rem;font-weight:800;letter-spacing:-.02em;color:var(--white);margin:0;line-height:1.15;}
body[data-page="hub"] .hub-sub{font-size:1.04rem;color:var(--steel-muted);max-width:640px;margin:0 0 1.4rem;text-wrap:pretty;}
body[data-page="hub"] .hub-subhead{font-family:var(--font-mono);font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:var(--steel);margin:2.1rem 0 1rem;}
body[data-page="hub"] .hub-note{font-family:var(--font-mono);font-size:.74rem;color:var(--steel);margin:-.3rem 0 1.2rem;line-height:1.5;}
body[data-page="hub"] .hub-note code{color:var(--tier);background:var(--tier-tint);padding:.05rem .4rem;border-radius:4px;font-size:.95em;}

/* clickable cards (reading + related) — extend .surface, anchor-only */
body[data-page="hub"] a.surface{display:block;text-decoration:none;}
body[data-page="hub"] a.surface:hover{text-decoration:none;border-color:var(--tier-border);background:var(--tier-tint);}
body[data-page="hub"] a.surface .s-t{display:block;}
body[data-page="hub"] a.surface .s-t .go{color:var(--tier);opacity:0;transition:opacity .2s;}
body[data-page="hub"] a.surface:hover .s-t .go{opacity:1;}
body[data-page="hub"] .s-skel{display:flex;flex-direction:column;gap:.42rem;margin-top:.55rem;}
body[data-page="hub"] .s-skel i{display:block;height:7px;border-radius:4px;background:rgba(168,180,191,.12);}
body[data-page="hub"] .s-skel i:last-child{width:68%;}

/* service signpost cards — tier-coded per service via local --tier override */
body[data-page="hub"] .svc-card{display:grid;grid-template-columns:1fr auto;gap:.3rem 1rem;align-items:baseline;
  background:rgba(255,255,255,.03);border:1px solid var(--border);border-left:2px solid var(--tier);
  border-radius:10px;padding:1.05rem 1.3rem;text-decoration:none;transition:.2s;margin-bottom:.75rem;}
body[data-page="hub"] .svc-card:hover{border-color:var(--tier-border);border-left-color:var(--tier);background:var(--tier-tint);text-decoration:none;}
body[data-page="hub"] .svc-name{font-weight:700;color:var(--white);font-size:1.02rem;}
body[data-page="hub"] .svc-name .go{color:var(--tier);opacity:0;transition:opacity .2s;}
body[data-page="hub"] .svc-card:hover .svc-name .go{opacity:1;}
body[data-page="hub"] .svc-price{font-family:var(--font-mono);color:var(--tier);font-size:.82rem;white-space:nowrap;font-variant-numeric:tabular-nums;}
body[data-page="hub"] .svc-desc{grid-column:1/-1;font-size:.9rem;color:var(--steel-muted);margin:.15rem 0 0;line-height:1.55;max-width:none;}
body[data-page="hub"] .svc-card.t-steel{--tier:var(--steel);}
body[data-page="hub"] .svc-card.t-accent{--tier:var(--accent);}
body[data-page="hub"] .svc-card.t-amber{--tier:var(--amber);}
body[data-page="hub"] .svc-card.t-gold{--tier:var(--gold);}

@media(max-width:900px){
  body[data-page="hub"] .hub-sec{padding-bottom:2.2rem;margin-bottom:2.2rem;}
}