/* ==========================================================================
   IT Vortex — "Deep-Space Vortex" dark skin
   Reusable override layer for the light "ice" kit (IaaS + Location pages).
   Style only: no copy, no layout, no section changes.

   AUTHOR THIS FILE UNSCOPED. `scope-skin.py` prefixes every selector with
   `body.itv-nx` to build the deployed artifact (issue #39).

   Why: this used to be injected into the page BODY, after the page's own inline
   kit <style>, so it won ties on source order. It now loads from wp_head, i.e.
   BEFORE that inline <style> — every plain-specificity override here would flip
   to losing. The added class buys one specificity level, so the skin wins on
   specificity instead of order. Rules already carrying !important are unaffected.
   Do not hand-write the `body.itv-nx` prefix here; the build adds it.

   Strategy:
   - Re-map two kit tokens that are ONLY ever light surfaces / muted text,
     so a single line darkens many selectors:
       --ice  (was #F2F8F9 light surface) -> dark canvas
       --gray (was #7B7C7C mid gray)      -> light-on-dark gray (fixes body + footer)
   - Do NOT flip --white or --blue: both double as backgrounds AND text, so
     override the specific background/text selectors instead.
   - Supply the homepage tokens the nx- chrome needs but the kit doesn't define
     (--lime/--navy/--steel/--navy-dd/--line/--body).
   ========================================================================== */

body.itv-nx{
  /* --- tokens the nx- chrome expects (kit uses --green/--blue names) --- */
  --lime:#87C440; --lime-d:#689236; --steel:#3b6687;
  --navy:#2F536D; --navy-dd:#152d3d;
  --line:rgba(255,255,255,.10);
  --body:'Lato',system-ui,-apple-system,'Segoe UI',sans-serif;

  /* --- deep-space surfaces (match the homepage --ink / --surface-solid) --- */
  --sk-canvas:#0c1c28;      /* page + ice sections */
  --sk-surface:#102431;     /* cards / panels */
  --sk-surface-2:#0e1f2b;   /* white sections + inputs */
  --sk-icon:#17303f;        /* card-icon chips */
  --sk-line:rgba(255,255,255,.10);
  --sk-text:#d6e1ea;        /* body (brightened from #c8d6e0 for legibility) */
  --sk-head:#ffffff;        /* headings that were navy */
  --sk-dim:#adbcc8;         /* muted / captions (brightened from #9fb2bf) */

  /* --- safe token re-maps (light-only in the kit) --- */
  --ice:#0c1c28;            /* covers .section-ice, .card-icon, inputs, .proof-band, .stat-item:hover */
  --gray:#c6d3dd;           /* body copy (was #9fb2bf, too dim — the #1 "hard to read" fix, sitewide) */
}

/* ---- page canvas + base text ---- */
/* html keeps a LITERAL, deliberately: scope-skin.py moves every token onto
   body.itv-nx, so var(--sk-canvas) would be undefined up at <html>. It also has
   to paint on the first frame — this rule is what retired the anti-FOUC guard
   (blog-reskin/itv-nx-critical.php). Nothing competes for html on these pages. */
html{background:#0c1c28}
body.itv-nx{background:var(--sk-canvas);color:var(--sk-text)}

/* ---- formerly-white section + panels ---- */
body.itv-nx .section-white{background:var(--sk-surface-2)}
/* a section with an INLINE background:var(--white) (kept white, since --white is
   dual-use bg+text and not flipped) stays bright on dark — e.g. the industries-hub
   .proof-band. Force it to the white-section dark, which also matches the #0e1f2b
   wave fill leading into it (needs !important to beat the inline). */
body.itv-nx .proof-band[style*="--white"],body.itv-nx [style*="background:var(--white)"]{background:var(--sk-surface-2)!important}
body.itv-nx .stats-inner,body.itv-nx .benefit-card,body.itv-nx .form-card,body.itv-nx .proof-card{
  background:var(--sk-surface);
  border:1px solid var(--sk-line);
  box-shadow:0 18px 50px -30px rgba(0,0,0,.85);
}
body.itv-nx .card-icon{background:var(--sk-icon)}
body.itv-nx .stat-item:hover{background:rgba(255,255,255,.03)}

/* ---- Locations-hub "Choose Your Area" directory cards (hub-only; city pages
        have no .region so this is a no-op there). Source: white bg + navy
        h3/links + an --ice bottom-border (now dark = invisible). Dark them to
        match the other cards; light the heading + city links; lime keeps the
        top accent + link hover (kit's --green). ---- */
body.itv-nx .region{
  background:var(--sk-surface);
  border:1px solid var(--sk-line);
  border-top:4px solid var(--lime);
  box-shadow:0 18px 50px -30px rgba(0,0,0,.85);
}
body.itv-nx .region h3{color:var(--sk-head);border-bottom-color:var(--sk-line)}
body.itv-nx .region a{color:var(--sk-text)}
body.itv-nx .region a:hover{color:var(--lime)}
body.itv-nx .stat-item:not(:last-child)::after{background:var(--sk-line)}
body.itv-nx .img-breather{background:var(--sk-canvas)}         /* spacer must vanish into the canvas */

/* ---- feathered bleed images: the --scrim gradient fades the photo into the
        section, so it must match the (now dark) section bg or the text half
        washes to white. Covers BOTH bleed variants: .two-col-bleed AND
        .why-bleed (the service pages use .why-bleed, which the kit still scrims
        white — that was the white "Security Operations"/"Standard Features"
        sections). ---- */
body.itv-nx .section-ice.two-col-bleed,body.itv-nx .section-ice.why-bleed{--scrim:#0c1c28}
body.itv-nx .section-white.two-col-bleed,body.itv-nx .section-white.why-bleed{--scrim:#0e1f2b}

/* ---- form inputs + faq rules that used light borders ---- */
body.itv-nx .form-group input,body.itv-nx .form-group select,body.itv-nx .form-group textarea{
  background:var(--sk-surface-2);
  border-color:var(--sk-line);
  color:var(--sk-head);
}
body.itv-nx .form-group input::placeholder,body.itv-nx .form-group textarea::placeholder{color:var(--sk-dim)}
body.itv-nx .faq-item,body.itv-nx .faq-item:first-child{border-color:var(--sk-line)}
body.itv-nx .faq-toggle{border-color:var(--lime);color:var(--lime)}   /* was navy: invisible on dark */

/* ---- headings that were navy (var(--blue)) -> light ---- */
body.itv-nx .section-header h2,body.itv-nx .stat-number,body.itv-nx .benefit-card h4,body.itv-nx .two-col h2,body.itv-nx .feature-item h4,body.itv-nx .faq-q,body.itv-nx .form-group label,body.itv-nx .proof-header h2,body.itv-nx .proof-attribution,body.itv-nx .proof-footer a{color:var(--sk-head)}
/* !important variant: the company/resource pages redefine .section-header h2 in a
   body <style> (loads after the skin), which kept "Premier Strategic Partners" and
   similar section titles navy-on-dark. */
body.itv-nx .section-header h2,body.itv-nx .section-header h3{color:var(--sk-head)!important}

/* ---- proof quote body: hardcoded #444 (unreadable on dark) -> light ---- */
body.itv-nx .proof-quote{color:var(--sk-text)}

/* ---- hardcoded near-black body copy (#444/#555) across the company/resource
   pages — fine on the light kit, invisible on dark. Token remaps can't reach a
   hardcoded literal, so override the exact selectors. !important beats both the
   body-<style> source order and the deeper `.itv-page …` specificity. This is
   the main "text hard to read" fix Lou flagged across all the new pages. ---- */
body.itv-nx,body.itv-nx .itv-page,body.itv-nx .two-col .col-text>p,body.itv-nx .approach-item p,body.itv-nx .position-card p,body.itv-nx .how-card p,body.itv-nx .process-body-inner p,body.itv-nx .process-body-inner ul,body.itv-nx .vendor-desc,body.itv-nx .faq-answer,body.itv-nx .applying-for-hint,body.itv-nx .itv-page .partner-intro,body.itv-nx .itv-page .category-vendor p,body.itv-nx .itv-page .deploy-card p,body.itv-nx .itv-page .deploy-card li,body.itv-nx .itv-page .location-address,body.itv-nx .itv-page .featured-bullets li,body.itv-nx .itv-page .event-modal-lead,body.itv-nx .itv-page .event-modal-section p,body.itv-nx .itv-page .event-modal-section ul li,body.itv-nx .modal-body p,body.itv-nx .modal-body ul li{color:var(--sk-text)!important}

/* ---- decorative card quote-mark: 0.08 lime vanishes on dark -> lift for visibility ---- */
body.itv-nx .proof-card::before{color:rgba(135,196,64,.22)}

/* ---- compliance strip (SOC/HIPAA/PCI badges): .badge-label is var(--blue) navy
        (deliberately unflipped) so it went dark-on-dark. Must match the source's
        2-class specificity (.compliance-badge .badge-label) to win the cascade. ---- */
body.itv-nx .compliance-badge .badge-label{color:var(--sk-head)}
body.itv-nx .compliance-badge .badge-sub{color:var(--sk-dim)}
body.itv-nx .compliance-divider{background:var(--sk-line)}   /* was hardcoded #cfd6db = bright on dark */

/* ============================================================================
   Service-page components — Managed Services / SECaaS / BaaS / DaaS / DRaaS.
   Richer kit than the IaaS/industries/location pages: comparison tables,
   vendor/framework/tech cards, arch-diagram nodes, tech tabs, an animated stat
   bar, the state-morph toggle, insurance matrix, and the cost calculator. All
   default to white bg + navy text in the light kit; darken to surface + light
   text. Two deliberate exceptions left untouched: .playbook-cover (a rotated
   white "paper" document mockup — reads as a physical object on dark) and the
   lime buttons/badges (.btn-green/.btn-download/th.highlight). vendor tiles
   hold TEXT, not logos, so darkening them is safe.
   ============================================================================ */
body.itv-nx .tech-card,body.itv-nx .framework-card,body.itv-nx .vendor-tile,body.itv-nx .tech-metric,body.itv-nx .arch-node{
  background:var(--sk-surface);
  border:1px solid var(--sk-line);
  box-shadow:0 18px 50px -30px rgba(0,0,0,.85);
}
body.itv-nx .insurance-matrix,body.itv-nx .calc-card{background:var(--sk-surface);border:1px solid var(--sk-line)}
body.itv-nx .tech-card h4,body.itv-nx .framework-card h4,body.itv-nx .arch-node h5,body.itv-nx .vendor-name,body.itv-nx .insurance-req-title,body.itv-nx .calc-section-label{color:var(--sk-head)}
body.itv-nx .tech-icon,body.itv-nx .arch-node-icon{background:var(--sk-icon)}         /* --ice chip -> visible chip */
body.itv-nx .stats-bar{background:var(--sk-canvas)}                        /* full-bleed white bar -> blend into canvas */

/* comparison table: white body + dark-on-light text (thead navy/green stays).
   NOTE: an EXTERNAL theme/Elementor rule zebra-stripes alt rows #f7f7f7 (light
   gray) — with our white cell text that reads as invisible. Force cells
   transparent so the table's dark surface shows (border rows still separate),
   and !important to beat that non-scoped external rule. The green highlight
   column keeps its faint tint (more specific, so it still wins). */
body.itv-nx .comp-table{background:var(--sk-surface);box-shadow:0 18px 50px -30px rgba(0,0,0,.85)}
body.itv-nx .comp-table tbody td{color:var(--sk-text);border-bottom-color:var(--sk-line);background:transparent!important}
body.itv-nx .comp-table tbody td:first-child{color:var(--sk-head)}
body.itv-nx .comp-table tbody td.highlight-col{background:rgba(135,196,64,.06)!important}
body.itv-nx .comp-table tbody tr:hover{background:rgba(255,255,255,.03)}

/* tech tabs (white pill + navy text; .device-tab is already dark) */
body.itv-nx .tech-tab{background:var(--sk-surface);color:var(--sk-text);border-color:var(--sk-line)}

/* cost-calculator checkboxes: bg already dark via the --ice remap; fix the
   light border + navy label so they read on dark */
body.itv-nx .calc-chk{border-color:var(--sk-line);color:var(--sk-text)}

/* navy TEXT the kit places on surfaces that are now dark (these stay out of a
   global --blue flip because --blue is dual-use bg+text): calc input labels,
   the bold lead-ins in the "why us" list, and the protocol-tab H3 on DaaS */
body.itv-nx .calc-group label,body.itv-nx .why-item strong,body.itv-nx .tech-panel-text h3{color:var(--sk-head)}

/* the why-bleed section headline carries an INLINE color:var(--blue) (navy),
   which beats external rules — needs !important. Exactly one per service page
   (the "Security Operations…" / "Standard Features…" heading), always on a dark
   section, so the attribute-scoped override is safe. */
body.itv-nx h2[style*="color:var(--blue)"]{color:var(--sk-head)!important}

/* state-morph toggle side labels (the .sm-panel is already dark; ported from
   the IaaS-hub dark tuning): light base, amber "off" state, lime "on" state */
body.itv-nx .sm-switch .sm-side{color:var(--sk-dim)}
body.itv-nx .sm-switch[aria-checked=false] .sm-side-off{color:#e8a23d}
body.itv-nx .sm-switch[aria-checked=true] .sm-side-on{color:var(--lime)}

/* protocol/detail MODAL (DaaS "Horizon Client & Blast Extreme" popup — hidden
   until opened, so it slipped the static scan). White card -> dark surface;
   the metric-tile VALUES were navy on a dark --ice tile (the dim "AES-256 /
   4K+ / No VPN" Lou flagged) -> white on a lifted chip; body/list #555 -> light */
body.itv-nx .modal-card,body.itv-nx .event-modal-card{background:var(--sk-surface)!important}
/* event modal: navy stat numbers -> light; the lead/section text is already
   lightened by the hardcoded-#333 override above (now on a dark card) */
body.itv-nx .event-modal-stat-num{color:var(--sk-head)!important}
/* partner credential chips: var(--ice) dark bg + var(--blue) navy text = invisible */
body.itv-nx .cred-chip{background:var(--sk-icon)!important;color:var(--sk-text)!important;border:1px solid var(--sk-line)}
/* Contact: the form + calendar cards stretch to equal height (align-items:stretch),
   so the shorter form card gets a big empty gap under it. Let each card be its
   natural height. The HubSpot booking iframe sits inside a now-dark .touch-card
   ("wrap calendar is dark card"); give the iframe element a dark bg too. */
body.itv-nx .touch-grid{align-items:start!important}
body.itv-nx .itv-meeting-iframe{background:var(--sk-surface)!important}
/* the .proof-band is a boxed (1140px) section, so its bottom wave-divider stops
   short of the viewport edges (not full-bleed like every other section's wave).
   Break just the wave out to full width. */
body.itv-nx .proof-band{overflow:visible}
body.itv-nx .proof-band>.wave-divider{width:100vw;left:50%;margin-left:-50vw}
/* KB "Don't See Your Vendor" illustration (regenerated on-brand, dark navy) —
   feather its edges so it fades into the dark section instead of a hard rectangle */
body.itv-nx .vendor-hub-illo{width:100%;height:auto;display:block;
  -webkit-mask-image:radial-gradient(125% 118% at 55% 50%,#000 50%,transparent 90%);
  mask-image:radial-gradient(125% 118% at 55% 50%,#000 50%,transparent 90%)}
body.itv-nx .modal-body p,body.itv-nx .modal-body .modal-features li,body.itv-nx .tech-detail-list li,body.itv-nx .device-features li{color:var(--sk-text)}
/* match the source's selector depth (.modal-body .modal-metric …) so these win
   by source order — a shorter selector loses on specificity */
body.itv-nx .modal-body .modal-metric{background:var(--sk-icon)}     /* lift the tile off the card */
body.itv-nx .modal-body .modal-metric .val{color:var(--sk-head)}     /* AES-256 / 4K+ / No VPN -> readable */
body.itv-nx .modal-close{background:rgba(255,255,255,.08);color:var(--sk-text)}

/* ============================================================================
   Company + resource pages — About / Careers / Partners / Events / Contact /
   Knowledge Bases / Technology Procurement. Each layers its own bespoke card set
   on the ice kit, but nearly all follow the same pattern: background:var(--white)
   + navy text + light borders. Darken to surface + light text. Several of these
   pages redefine base classes (e.g. .section-white) in a BODY <style> that loads
   AFTER the skin, so the darkening needs !important to win. Two deliberate
   exceptions: logo tiles (.partner-logo/.directory-tile) get a translucent
   frosted chip so full-color partner logos remain legible (#40), and the HubSpot
   booking iframe stays as-is.
   ============================================================================ */
body.itv-nx .flip-front,body.itv-nx .process-item,body.itv-nx .vendor-card,body.itv-nx .how-card,body.itv-nx .partner-strip,body.itv-nx .position-card,body.itv-nx .form-wrapper,body.itv-nx .partner-profile,body.itv-nx .category-block,body.itv-nx .tier1-card,body.itv-nx .event-card,body.itv-nx .connect-card,body.itv-nx .channel-card,body.itv-nx .location-card,body.itv-nx .touch-card{
  background:var(--sk-surface)!important;border-color:var(--sk-line);
  box-shadow:0 18px 50px -30px rgba(0,0,0,.85);
}
body.itv-nx .search-section{background:var(--sk-canvas)!important}     /* full-bleed KB search band -> blend */
/* base kit cards that some company pages redefine in body styles -> reassert dark */
body.itv-nx .benefit-card,body.itv-nx .stats-inner,body.itv-nx .form-card,body.itv-nx .proof-card{background:var(--sk-surface)!important}
body.itv-nx .stats-bar{background:var(--sk-canvas)!important}
body.itv-nx .faq-item{background:transparent!important}
/* base classes some pages redefine in body styles -> force dark */
body.itv-nx .section-white{background:var(--sk-surface-2)!important}
/* card headings that were navy -> light */
body.itv-nx .approach-item h3,body.itv-nx .vendor-card h3,body.itv-nx .vendor-card h4,body.itv-nx .how-card h3,body.itv-nx .how-card h4,body.itv-nx .process-item h3,body.itv-nx .process-item h4,body.itv-nx .position-card h3,body.itv-nx .position-card h4,body.itv-nx .channel-card h3,body.itv-nx .channel-card h4,body.itv-nx .location-card h3,body.itv-nx .location-card h4,body.itv-nx .touch-card h3,body.itv-nx .touch-card h4,body.itv-nx .connect-card h3,body.itv-nx .category-block h3,body.itv-nx .tier1-card h3,body.itv-nx .partner-profile h3,body.itv-nx .flip-front h3,body.itv-nx .flip-front h4,body.itv-nx .event-card h3,body.itv-nx .event-card h4{color:var(--sk-head)}
/* broad text lighting inside the company-page cards: navy headings/body that the
   token re-maps don't reach. Scoped to card/tile/item/block/header containers so
   it can't touch light-surface objects (logo tiles hold no headings). !important
   because several of these pages define the navy card text in a BODY <style> that
   loads after the skin. Child elements with their own accent color still win. */
body.itv-nx [class*="-card"],body.itv-nx [class*="-item"],body.itv-nx [class*="-block"],body.itv-nx .approach-item,body.itv-nx .partner-profile,body.itv-nx .category-vendor{color:var(--sk-text)}
body.itv-nx [class*="-card"] h3,body.itv-nx [class*="-card"] h4,body.itv-nx [class*="-card"] h5,body.itv-nx [class*="-item"] h3,body.itv-nx [class*="-item"] h4,body.itv-nx [class*="-block"] h3,body.itv-nx [class*="-block"] h4,body.itv-nx [class*="-header"] h3,body.itv-nx [class*="-header"] h4,body.itv-nx .approach-item h3,body.itv-nx .approach-item h4,body.itv-nx .partner-profile h3,body.itv-nx .partner-profile h4,body.itv-nx .partner-profile h5,body.itv-nx .form-heading h3,body.itv-nx .form-heading h4{color:var(--sk-head)!important}
body.itv-nx [class*="-card"] strong,body.itv-nx [class*="-item"] strong,body.itv-nx [class*="-block"] strong,body.itv-nx [class*="-card"] li,body.itv-nx [class*="-item"] li,body.itv-nx .category-vendor strong{color:var(--sk-text)!important}
body.itv-nx .form-field label,body.itv-nx .form-group label,body.itv-nx .form-row label{color:var(--sk-head)!important}
/* filter chips (KB search UI) */
body.itv-nx .filter-chip{background:var(--sk-surface)!important;border-color:var(--sk-line);color:var(--sk-text)}
/* date/status chips overlaid on event images -> dark chip */
body.itv-nx .event-card-date,body.itv-nx .date-tile{background:rgba(14,31,43,.92)!important;color:var(--sk-text)}
/* logo tiles: a translucent FROSTED chip, not the solid #eef4f7 rectangle they
   used to carry (#40). The white box read as a patch of the light kit stranded on
   a dark page, and it actively hid Dell — whose wordmark is light, so it vanished
   against white and rendered as an empty tile. A white-7% chip with a hairline
   border lifts every logo off the canvas while KEEPING brand colour: Fortinet
   red, the Microsoft squares and Veeam green all survive, which a white-mono
   knockout would have flattened.

   Covers every logo container: the tier cards, the "Built on Platforms" wall
   (.partner-item), the KB card logos, the vendor directory, and Tech
   Procurement's .vendor-cell — that one had the opposite failure, a dark
   background:var(--ice) fill that swallowed monochrome marks. One treatment now
   serves both. Also strips the kit's grayscale/opacity muting. */
body.itv-nx .partner-logo,body.itv-nx .directory-tile,body.itv-nx .tier1-logo,body.itv-nx .partner-item,body.itv-nx .vendor-logo-wrap,body.itv-nx .vendor-cell{
  background:rgba(255,255,255,.07)!important;
  border:1px solid rgba(255,255,255,.14)!important;
  border-radius:12px!important;
}
body.itv-nx .tier1-logo,body.itv-nx .partner-item,body.itv-nx .vendor-logo-wrap,body.itv-nx .vendor-cell{padding:12px 16px}
/* the muting lives on the CONTAINER for .vendor-cell (the page's own style block
   sets filter:grayscale(85%);opacity:.75), and a filter on a parent applies to
   its whole subtree — so stripping it on the child <img> cannot undo it. Clear it
   on the cell itself or Tech Procurement's logos stay desaturated, which is the
   opposite of the brand-colour treatment chosen in #40. */
body.itv-nx .vendor-cell{filter:none!important;opacity:1!important}
body.itv-nx .partner-logo img,body.itv-nx .directory-tile img,body.itv-nx .tier1-logo img,body.itv-nx .partner-item img,body.itv-nx .vendor-logo-wrap img,body.itv-nx .vendor-cell img{filter:none!important;opacity:1!important}
/* faq dividers */
body.itv-nx .faq-item{border-bottom-color:var(--sk-line)}
/* form fields — every dark page wants dark inputs; these pages use raw
   input/select/textarea (not always .form-group), so darken them broadly
   (excluding button-type inputs, which keep their lime). */
body.itv-nx input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]):not([type=image]),body.itv-nx select,body.itv-nx textarea,body.itv-nx .search-input{
  background:var(--sk-surface-2)!important;border-color:var(--sk-line)!important;color:var(--sk-head)!important;
}
body.itv-nx input::placeholder,body.itv-nx textarea::placeholder,body.itv-nx .search-input::placeholder{color:var(--sk-dim)}

/* ---- chrome fit: the nx- header/footer rely on the homepage's .wrap
        (max-width + centered) which lives in a style block we don't ship.
        Define it here so the header/footer content centers to 1200 instead
        of stretching edge-to-edge; and let the footer break out of the
        Elementor content-box to full-bleed like the body sections do. ---- */
body.itv-nx .wrap{max-width:1200px;margin-inline:auto;padding-inline:24px}
body.itv-nx .nx-ftr{width:100vw;left:50%;margin-left:-50vw;margin-top:0}   /* full-bleed; kill the homepage's clamp() gap so the footer meets the CTA band seamlessly */

/* ---- Gilroy display to match the homepage headings ---- */
@font-face{font-family:"Gilroy";src:url("https://www.theitvortex.com/wp-content/uploads/2021/01/Gilroy-ExtraBold.woff2") format("woff2");font-weight:800;font-display:swap}
@font-face{font-family:"Gilroy";src:url("https://www.theitvortex.com/wp-content/uploads/2021/01/Gilroy-Bold.woff2") format("woff2");font-weight:700;font-display:swap}
body.itv-nx h1,body.itv-nx h2,body.itv-nx h3,body.itv-nx .section-header h2,body.itv-nx .proof-header h2,body.itv-nx .two-col h2,body.itv-nx .benefit-card h4,body.itv-nx .feature-item h4{font-family:"Gilroy","Lato",system-ui,sans-serif;letter-spacing:-.01em}

/* ============================================================================
   #41 — SLA (10772) + Interactive Calculators (10647)
   Both came through the same kit pipeline as the rest, but carry component sets
   the skin had never met, and their class names dodge every broad sweep: plain
   `.card`, `.kpi`, `.btn`, `.search` have no hyphen, so `[class*="-card"]` and
   friends never matched them and they stayed white on a dark page.

   Worth recording: nav-work/leakscan.js reported BOTH pages clean. It samples
   the first viewport only, so a full-page light-surface sweep is what actually
   found these (14 white cards, 54 KPI readouts, a white plan drawer).
   ========================================================================= */
/* SLA: the service-credit table */
body.itv-nx .credit-table{background:var(--sk-surface)!important;color:var(--sk-text)!important}
body.itv-nx .credit-table th,body.itv-nx .credit-table td{background:transparent!important;color:var(--sk-text)!important;border-color:var(--sk-line)!important}
body.itv-nx .credit-table thead th{color:var(--sk-head)!important}

/* Calculators: cards, KPI readouts, range wrappers, toolbar, plan drawer.
   `article.card` is tag-qualified and .kpi/.rangeWrap/.toolbar-section are
   page-specific, so none of this can reach another page's components. */
body.itv-nx article.card,body.itv-nx .plan-drawer,body.itv-nx .toolbar-section,body.itv-nx .toolbar-section .search,body.itv-nx .kpi,body.itv-nx .rangeWrap{
  background:var(--sk-surface)!important;border-color:var(--sk-line)!important;
  color:var(--sk-text)!important;
}
body.itv-nx article.card h2,body.itv-nx article.card h3,body.itv-nx article.card h4,body.itv-nx article.card h5,body.itv-nx .plan-drawer h2,body.itv-nx .plan-drawer h3,body.itv-nx .plan-drawer h4,body.itv-nx .kpi strong,body.itv-nx .kpi b,body.itv-nx .kpi .v,body.itv-nx .plan-close{color:var(--sk-head)!important}
/* the .result readout sits on a lime tint that only worked over a white card */
body.itv-nx .result{color:var(--sk-text)!important}
/* buttons inside those surfaces were white; scoped by ancestor so a lime .btn
   elsewhere on the site is untouched */
/* the jump-nav pills above the calculators are bare <a> in .anchorNav with a
   white pill background and navy text — no class of their own to hook, so match
   by parent */
body.itv-nx .anchorNav a{background:var(--sk-surface-2)!important;color:var(--sk-text)!important;border-color:var(--sk-line)!important}
body.itv-nx .anchorNav a:hover{color:var(--sk-head)!important}
body.itv-nx article.card .btn,body.itv-nx .plan-drawer .btn,body.itv-nx .toolbar-section .btn{
  background:var(--sk-surface-2)!important;color:var(--sk-head)!important;
  border-color:var(--sk-line)!important;
}

/* ============================================================================
   #41 — Case Studies (36). NOT a kit page: native Elementor sections plus
   elementor-extras `.ee-post` cards, so none of the kit sweeps reach it.
   The two top sections carry the light ice fill from Elementor's per-post CSS
   (post-36.css), which is why this needs !important and a page-scoped selector —
   `.elementor-section` exists on other pages and must not be darkened globally.
   ========================================================================= */
body.itv-nx.page-id-36 .elementor-section{background-color:var(--sk-canvas)!important}
/* Elementor's shape divider paints an SVG PATH FILL, not a background-color —
   which is why the full-page background sweep missed a light band sitting right
   above the case-study cards. Remap it to the same dark canvas the sections use,
   the native-Elementor equivalent of build-theme-preview.py's wave-fill rewrite. */
body.itv-nx.page-id-36 .elementor-shape-fill{fill:var(--sk-canvas)!important}
body.itv-nx .ee-post{background:var(--sk-surface)!important;border-color:var(--sk-line)!important}
body.itv-nx .ee-post__title__heading,body.itv-nx .ee-post__title__heading a{color:var(--sk-head)!important}
body.itv-nx .ee-post__excerpt,body.itv-nx .ee-post__excerpt p,body.itv-nx .ee-post__meta,body.itv-nx .ee-post__meta a,body.itv-nx .ee-post__terms,body.itv-nx .ee-post__terms a{color:var(--sk-text)!important}
body.itv-nx .ee-post__button{color:var(--sk-head)!important;border-color:var(--sk-line)!important;background:transparent!important}
body.itv-nx .ee-post__button:hover{background:var(--sk-surface-2)!important}

/* ============================================================================
   #41 — Blog archive (38). The WP posts page rendered by an Elementor archive
   template, so there is no html widget to swap and none of the kit sweeps apply.
   Scoped to `body.blog` on purpose: `.elementor-post` is the generic Posts-widget
   class and also appears in related-post grids on single posts, which are NOT
   flagged and must stay on the light treatment.
   ========================================================================= */
body.itv-nx.blog .elementor-section{background-color:var(--sk-canvas)!important}
/* The blog reskin (body.itv-reskin, inline in the page) styles these cards for a
   LIGHT page and wins at (0,4,0) with !important:
   `body.itv-reskin .elementor-3907 .elementor-posts .elementor-post{background:#fff!important}`.
   A plain `body.blog .elementor-post` is (0,3,0) and loses. Mirror its shape plus
   our two body classes to land at (0,5,0). 3907 is the ARCHIVE template id; the
   reskin's other id (3797) is the single-post template, which we deliberately do
   NOT touch — single posts are unflagged and stay light. */
body.itv-nx.blog .elementor-3907 .elementor-posts .elementor-post{
  background:var(--sk-surface)!important;box-shadow:none!important;
  border-left-color:var(--lime)!important;
}
body.itv-nx.blog .elementor-3907 .elementor-posts .elementor-post__title,body.itv-nx.blog .elementor-3907 .elementor-posts .elementor-post__title a{color:var(--sk-head)!important}
body.itv-nx.blog .elementor-3907 .elementor-posts .elementor-post__excerpt,body.itv-nx.blog .elementor-3907 .elementor-posts .elementor-post__excerpt p,body.itv-nx.blog .elementor-3907 .elementor-posts .elementor-post__meta-data,body.itv-nx.blog .elementor-3907 .elementor-posts .elementor-post__meta-data a{color:var(--sk-text)!important}
body.itv-nx.blog .elementor-post__title,body.itv-nx.blog .elementor-post__title a{color:var(--sk-head)!important}
body.itv-nx.blog .elementor-post__excerpt,body.itv-nx.blog .elementor-post__excerpt p,body.itv-nx.blog .elementor-post__meta-data,body.itv-nx.blog .elementor-post__meta-data a,body.itv-nx.blog .elementor-post__card{color:var(--sk-text)!important}
body.itv-nx.blog .elementor-post__read-more{color:var(--lime-l)!important}
body.itv-nx.blog .elementor-shape-fill{fill:var(--sk-canvas)!important}
body.itv-nx.blog .elementor-pagination .page-numbers{color:var(--sk-text)!important}
body.itv-nx.blog .elementor-pagination .page-numbers.current{color:var(--sk-head)!important}

/* ---- Interactive Calculators (10647), round 2 — reported by Lou -------------
   1) HERO DID NOT REACH THE TOP. The doc wraps its whole body in
      `<div class="wrap">` (padding:28px 18px 80px) and Elementor's .e-con-inner
      adds 10px, so `section.hero` started at y=38 — a flat dark strip sat above
      it instead of the hero running under the transparent header. Zero only the
      TOP; the wrapper's horizontal and bottom padding still shape the page.
      Scoped to this page: it is the only doc with that outer .wrap.
   2) CARD HEADER/FOOTER WERE LIGHT GRADIENTS. .cardHead is
      `linear-gradient(#f2f8f9,#fff)` and .cardFoot `linear-gradient(...,#fff)` —
      a background-IMAGE, so the background-COLOR sweep never saw them (same blind
      spot as Elementor's SVG shape-divider fill). With the skin lightening the
      text, the card titles rendered white on white.
   3) FIELD LABELS WERE NEAR-BLACK. label #1f2a37 and .hint #5f6b7a — fine on the
      original white card, dark-on-dark once the card went dark.
   --------------------------------------------------------------------------- */
body.itv-nx.page-id-10647 .elementor-widget-container > .wrap{padding-top:0!important}
body.itv-nx.page-id-10647 .e-con-inner{padding-top:0!important}

body.itv-nx .cardHead,body.itv-nx .cardFoot{
  background-image:none!important;background-color:var(--sk-surface-2)!important;
  border-color:var(--sk-line)!important;color:var(--sk-text)!important;
}
body.itv-nx .cardHead h2,body.itv-nx .cardHead h3,body.itv-nx .cardHead h4,body.itv-nx .cardHead .cardTitle{color:var(--sk-head)!important}
/* the card's one-line description kept the kit's #5f6b7a — legible on the old
   white card, muddy on the dark one */
body.itv-nx .cardHead p,body.itv-nx .cardFoot p{color:var(--sk-text)!important}

body.itv-nx article.card label,body.itv-nx article.card .hint,body.itv-nx article.card .sub,body.itv-nx article.card small,body.itv-nx .field label,body.itv-nx .row label,body.itv-nx .rangeWrap label,body.itv-nx .kpi label{color:var(--sk-text)!important}
body.itv-nx article.card .hint,body.itv-nx .field .hint,body.itv-nx .rangeWrap .hint,body.itv-nx article.card small{color:#9fb2bf!important}

/* Calculator filter chips + card category badges (10647).
   Three separate misses:
   - `.chip` were WHITE pills with navy text. A light leak the full-page sweep
     never reported because it only counts elements bigger than 80x30 and the
     chips are ~60x28 — the size floor, not the colour test, hid them.
   - `.chip.active` was navy text on `rgba(47,83,109,.09)` — a 0-delta invisible
     pill (the "All" chip).
   - `.badge` tints its OWN background (lime/navy at ~10% alpha), so over a dark
     card the tint is nearly invisible and only the text colour can fix it;
     `.badge.blue` ("DR/BCP") was navy-on-navy at 0 delta. */
body.itv-nx .toolbar-section .chip,body.itv-nx .chips .chip{
  background:var(--sk-surface-2)!important;color:var(--sk-text)!important;
  border:1px solid var(--sk-line)!important;
}
body.itv-nx .toolbar-section .chip.active,body.itv-nx .chips .chip.active,body.itv-nx .toolbar-section .chip:hover,body.itv-nx .chips .chip:hover{
  background:var(--lime)!important;color:#0c1c28!important;border-color:var(--lime)!important;
}
body.itv-nx .badge{color:var(--sk-head)!important}
body.itv-nx .badge.cloud,body.itv-nx .badge.green{color:#a4dd63!important}
body.itv-nx .badge.blue{color:#8fb8d6!important}

/* ============================================================================
   SYSTEMIC GAP — found from Kirsten's "Missing Titles" report (2026-08-25).

   The skin lightens card TEXT with a broad sweep (`[class*="-card"] h3,h4`) but
   darkens card BACKGROUNDS from an EXPLICIT LIST. Any card class not on that list
   therefore ended up with white text on a still-white card — the title did not go
   missing, it went invisible. Reported on all six industry pages (`.pain-card`,
   4 per page) and the industries hub (`.industry-hub-card`, 6). The body copy was
   affected too (light grey on white), which is why only the titles read as gone.

   Fix: give the background sweep the SAME reach as the text sweep, so the two can
   never drift apart again. Deliberately NO !important — every explicit exception
   above still wins, including the frosted logo tiles, and those don't match this
   pattern anyway (.tier1-logo/.partner-item/.directory-tile/.partner-logo/
   .vendor-logo-wrap/.vendor-cell contain no "-card").
   ========================================================================= */
body.itv-nx [class*="-card"]{background-color:var(--sk-surface);border-color:var(--sk-line)}

/* Bare section headings (found in the site-wide contrast audit, 2026-08-25).
   The theme sets `h1..h6{color:inherit}`, so these h2s INHERIT the kit's navy
   #2F536D from their parent. The skin's existing hook is
   `h2[style*="color:var(--blue)"]` — that only catches headings carrying the
   colour INLINE, not inherited ones. Navy on the dark canvas is ~52 luminance
   apart: muddy rather than invisible, which is why it passed every earlier check
   and only surfaced in a full-page contrast pass. 23 pages, e.g. "Standard
   Features, No Extra Cost" on DRaaS and every location page.
   h2 only — h3 carries deliberate accent colours in several components. */
body.itv-nx section h2{color:var(--sk-head)!important}

/* Remaining light containers found in the same audit. Each is the SAME shape as
   .pain-card: the skin lightened their text but their background was never in the
   darkening list, so the text went invisible on a still-white surface.
     .playbook-cover  3 service pages — white "document cover" + .cover-sub
     .cloud-tile      IaaS hub — white tiles whose <p> body copy vanished
     .industries-inner / .industry-hook — IaaS hub
     .arealist span   17 location pages — neighbourhood chips are BARE spans with
                      a white background and no class of their own, so they can
                      only be reached through their parent */
body.itv-nx .playbook-cover,body.itv-nx .cloud-tile,body.itv-nx .industries-inner{
  background-color:var(--sk-surface)!important;border-color:var(--sk-line)!important;
}
body.itv-nx .playbook-cover .cover-sub,body.itv-nx .playbook-cover h3,body.itv-nx .playbook-cover h4,body.itv-nx .cloud-tile p,body.itv-nx .cloud-tile h3,body.itv-nx .cloud-tile h4,body.itv-nx .industries-inner .industry-hook{color:var(--sk-text)!important}
body.itv-nx .cloud-tile h3,body.itv-nx .cloud-tile h4,body.itv-nx .playbook-cover h3{color:var(--sk-head)!important}
body.itv-nx .arealist span{background-color:var(--sk-surface-2)!important;color:var(--sk-text)!important;border-color:var(--sk-line)!important}

/* ============================================================================
   AUDIT ROUND 2 — 2026-08-27, issue #45
   Findings from docs/CONTRAST-AUDIT-2026-08-27.md (51 pages, DESKTOP + MOBILE,
   scanned with nav-work/contrast-scan.js).

   METHOD NOTE, because this is the third time we have fixed this same class of
   bug. Sessions 27 and 29 patched the components a human happened to notice, so
   the next unlisted component failed the same way a week later. This round the
   selector lists below were not built from observed defects — they were swept
   out of the STYLESHEETS: every rule on every chromed page that sets
   `color:var(--blue)` or `color:var(--green-dark)`. That set is complete by
   construction, so there is no "one we missed" left to find.

   Specificity: pages using the `.itv-page` prefix give the kit (0,2,0), which
   TIES `body.itv-nx .foo` and wins on source order (the kit style block is
   inline, the skin loads from wp_head). That tie is exactly why these survived
   the earlier rounds — the overrides existed and silently lost. Hence
   !important throughout this block.
   ========================================================================== */

/* ---- 1. MOBILE comparison tables: white card + white text, ratio 1.00 ------
   At <=768px the page's own CSS restacks the table — `.comp-table tbody tr`
   becomes a display:block card with `background:var(--white,#fff)`. The skin had
   already made the cells' text light for the desktop table, so on a phone every
   comparison row rendered as a blank white box. 61 cells over 7 pages, and
   invisible to any desktop-only pass because the table only restacks at 390px.
   `td:first-child` keeps its navy banner (white on #2F536D reads fine). */
@media (max-width:768px){
  body.itv-nx .comp-table tbody tr,body.itv-nx .comp-table tbody tr:hover{
    background:var(--sk-surface)!important;border-color:var(--sk-line)!important;
    box-shadow:0 6px 20px rgba(0,0,0,.35)!important;
  }
  body.itv-nx .comp-table tbody td{border-bottom-color:var(--sk-line)!important}
  body.itv-nx .comp-table tbody td:not(:first-child)::before{color:var(--sk-dim)!important}
  body.itv-nx .credit-table tbody tr,body.itv-nx .credit-table tbody tr:hover{
    background:var(--sk-surface)!important;border-color:var(--sk-line)!important;
  }
  body.itv-nx .credit-table tbody td{border-bottom-color:var(--sk-line)!important}
  body.itv-nx .credit-table tbody td:not(:first-child)::before{color:var(--sk-dim)!important}
}

/* ---- 2. every kit rule that paints text navy (--blue / #2F536D) ------------
   Swept from the stylesheets, 87 selectors. Split by role so the page keeps its
   type hierarchy: headings and figures go to --sk-head (white), running text and
   controls to --sk-text. */
body.itv-nx .approach-item h3,body.itv-nx .arch-node h5,body.itv-nx .benefit-card h4,body.itv-nx .calc-result .big-label,body.itv-nx .calc-result .breakdown-item .val,body.itv-nx .category-header h3,body.itv-nx .category-vendor strong,body.itv-nx .channel-card h3,body.itv-nx .cloud-tile h3,body.itv-nx .compliance-badge .badge-label,body.itv-nx .connect-card h3,body.itv-nx .cost-breakdown-table .bd-amt,body.itv-nx .cost-breakdown-title,body.itv-nx .deploy-header h4,body.itv-nx .event-card-body h4,body.itv-nx .event-modal-stat-num,body.itv-nx .faq-item summary,body.itv-nx .faq-q,body.itv-nx .feature-item h4,body.itv-nx .featured-body h2,body.itv-nx .flip-front h3,body.itv-nx .flip-front h4,body.itv-nx .form-heading h3,body.itv-nx .founder-attribution .founder-name,body.itv-nx .framework-card h4,body.itv-nx .how-card h3,body.itv-nx .industry-hub-card h3,body.itv-nx .industry-name,body.itv-nx .insurance-req-title,body.itv-nx .location-card h3,body.itv-nx .modal-body .modal-metric .val,body.itv-nx .modal-header h2,body.itv-nx .no-results h3,body.itv-nx .pain-card h4,body.itv-nx .partner-name,body.itv-nx .playbook-cover .cover-title,body.itv-nx .position-card h3,body.itv-nx .process-header h3,body.itv-nx .proof-header h2,body.itv-nx .region h3,body.itv-nx .search-result-count strong,body.itv-nx .section-header h2,body.itv-nx .sla-block h3,body.itv-nx .sla-block strong,body.itv-nx .stat-number,body.itv-nx .team-name,body.itv-nx .tech-card h4,body.itv-nx .tech-panel-text h3,body.itv-nx .tier1-name,body.itv-nx .timeline-content h4,body.itv-nx .touch-card h3,body.itv-nx .two-col h2,body.itv-nx .vendor-name,body.itv-nx .why-item strong{color:var(--sk-head)!important}

body.itv-nx .applying-for-role,body.itv-nx .calc-chk,body.itv-nx .calc-group label,body.itv-nx .calc-section-label,body.itv-nx .channel-line,body.itv-nx .comp-table tbody td:first-child,body.itv-nx .cred-chip,body.itv-nx .credit-table tbody td:first-child,body.itv-nx .date-tile-day,body.itv-nx .event-card-cta:hover,body.itv-nx .event-card-date-day,body.itv-nx .event-card:hover .event-card-cta,body.itv-nx .event-modal-close,body.itv-nx .event-modal-ctas .btn-outline,body.itv-nx .faq-toggle,body.itv-nx .featured-event-link:hover,body.itv-nx .featured-meta-item,body.itv-nx .file-upload-text,body.itv-nx .filter-chip,body.itv-nx .form-field label,body.itv-nx .form-group label,body.itv-nx .location-meta-row,body.itv-nx .modal-close,body.itv-nx .modal-secondary-close:hover,body.itv-nx .process-toggle,body.itv-nx .proof-attribution,body.itv-nx .proof-footer a,body.itv-nx .region a,body.itv-nx .related-link,body.itv-nx .sm-switch .sm-side,body.itv-nx .tech-tab,body.itv-nx .tier-badge,body.itv-nx .vendor-link-secondary{color:var(--sk-text)!important}

/* bare links the kit colours navy through a parent rule (phone numbers, email
   addresses, the "book a call" line) — these carry no class of their own, so
   like `.arealist span` they are only reachable through the container. */
body.itv-nx .channel-line a,body.itv-nx .location-meta-row a,body.itv-nx .form-body p a,body.itv-nx .calc-body p,body.itv-nx .form-body p,body.itv-nx .channel-contacts a{color:var(--sk-text)!important}

/* ---- 3. every kit rule that paints text --green-dark (#689236) -------------
   #689236 on the dark canvas is ratio 4.36 — just under AA, and it is the
   eyebrow/CTA accent on most pages. The full brand lime clears it at 7.4 and
   keeps the accent reading as an accent. Swept the same way, 31 selectors.
   NOTE: --green-dark itself is NOT remapped. It is still used as the :hover
   BACKGROUND of every .btn-green, and lightening the token would invert every
   button hover on the site. Text selectors only. */
body.itv-nx .applying-for-label,body.itv-nx .calc-chk.checked,body.itv-nx .category-vendor .vendor-use,body.itv-nx .channel-eyebrow,body.itv-nx .channel-line a:hover,body.itv-nx .connect-eyebrow,body.itv-nx .date-tile-month,body.itv-nx .deploy-client .deploy-header h4,body.itv-nx .event-card-cta,body.itv-nx .event-card-date-month,body.itv-nx .event-modal-section h4,body.itv-nx .featured-event-link,body.itv-nx .featured-eyebrow,body.itv-nx .file-upload-wrap.has-file .file-upload-text,body.itv-nx .filter-chip:hover,body.itv-nx .flip-cta,body.itv-nx .form-submit-msg.success,body.itv-nx .industry-hub-card .industry-hub-cta,body.itv-nx .industry-item:hover .industry-name,body.itv-nx .location-coords,body.itv-nx .location-meta-row a:hover,body.itv-nx .modal-body h3,body.itv-nx .modal-tag,body.itv-nx .partner-category,body.itv-nx .position-link,body.itv-nx .position-tag,body.itv-nx .proof-footer a:hover,body.itv-nx .proof-link,body.itv-nx .tier1-tier,body.itv-nx .touch-eyebrow,body.itv-nx .vendor-link-secondary:hover{color:var(--lime)!important}

/* ---- 4. light surfaces still standing -------------------------------------
   .filter-section   /knowledge-bases/ — a full-width white band (1440x160) that
                     the 2026-08-25 pass left alone as "possibly intentional". It
                     is not: it carries a .chip-count at ratio 2.1.
   .featured-event   /events/ — a 342x1312 white card on mobile only.
   .arealist a       17 location pages. Session 29 darkened `.arealist span` and
                     left the <a> siblings white — the kit styles them together
                     (`.arealist a, .arealist span`) and only half the pair was
                     overridden, so Brooklyn shows 5 dark chips beside 8 white. */
body.itv-nx .filter-section,body.itv-nx .featured-event{
  background-color:var(--sk-surface)!important;border-color:var(--sk-line)!important;
}
body.itv-nx .arealist a{
  background-color:var(--sk-surface-2)!important;color:var(--sk-text)!important;
  border-color:var(--sk-line)!important;
}

/* ---- 5. text-only logo fallbacks (/partners/) ------------------------------
   .partner-logo-text / .directory-tile-text render the wordmark as text in the
   vendor's own brand colour — NUTANIX #024DA1 and OMNISSA #2F536D — both of
   which land near 1.6 on the dark tile. Same call as the logo chips in #40:
   monochrome light on dark rather than an unreadable brand colour. */
body.itv-nx .partner-logo-text,body.itv-nx .directory-tile-text{color:var(--sk-head)!important}

/* ---- 6. theme default link colour leaking into the footer ------------------
   hello-elementor's `a{color:#c36}` (pink) shows through on the few pages whose
   footer links carry no class. Ratio 3.42 on dark. */
body.itv-nx .itv-prefooter a:not([class]),body.itv-nx .site-footer a:not([class]){color:var(--sk-text)!important}

/* ---- 7. white label on the brand green: ratio 2.1, 45 of 51 pages ----------
   `.btn-green` and its dozen cousins fill with --green #87C440 and set the label
   white. That is 2.1 against a 4.5 requirement — the single most-repeated
   contrast failure on the site, roughly 250 instances.

   Lou's call (2026-08-27): keep the brand green exactly as it is and darken the
   INK, which takes the pair to 7.4. This is also what the nx- header CTA already
   does — `.nx-cta` is `color:#08210a` on a lime gradient — so the page buttons
   and the header button on the same page finally agree instead of contradicting
   each other.

   Selector list swept from what actually RENDERS white-on-#87C440 across all 51
   pages, not from the rules that happen to declare it, so hover/active states
   and the elements that inherit their label colour are included too.

   Restrict this to the VARIANTS that actually fill green. `.partner-tier` is
   green only as `.tier-strategic`, `.location-badge` only when it is not `.dc`,
   `.status-badge` only when it is not `.past` — the others are navy or grey and
   want white. Listing the base class here put dark ink on all of them at 2.13,
   which is the same mistake this whole issue is about, in miniature.
   `.tech-tab.active` / `.filter-chip.active` never render green under the skin
   (it darkens their base), so they are not on the list at all. */
body.itv-nx .btn-green,body.itv-nx .btn-download,body.itv-nx .btn-submit,body.itv-nx .btnGreen,body.itv-nx .form-submit-btn,body.itv-nx .modal-apply-btn,body.itv-nx .alerts-submit,body.itv-nx .plan-fab,body.itv-nx .itv-prefooter-btn,body.itv-nx .no-results button,body.itv-nx .arch-badge,body.itv-nx .sla-block h3 .sla-num,body.itv-nx .partner-tier.tier-strategic,body.itv-nx .status-badge:not(.past),body.itv-nx .event-modal-status,body.itv-nx .location-badge:not(.dc),body.itv-nx .tier-badge-itv,body.itv-nx .comp-table thead th.highlight,body.itv-nx .credit-table thead th.highlight,body.itv-nx .news-tab.active,body.itv-nx .device-tab.active,body.itv-nx .sc-opt.selected,body.itv-nx .filter-chip.active .chip-count,body.itv-nx .process-item.open .process-toggle,body.itv-nx .related-link:hover,body.itv-nx .rotator-dot.active,body.itv-nx .flip-back .back-close:hover,body.itv-nx .social-icon:hover{color:#0c1c28!important}

/* the hover state darkens the fill to --green-dark #689236; dark ink on that is
   3.3, so lift the label back to white for the hover only. */
body.itv-nx .btn-green:hover,body.itv-nx .btn-download:hover,body.itv-nx .alerts-submit:hover,body.itv-nx .no-results button:hover,body.itv-nx .form-submit-btn:hover,body.itv-nx .modal-apply-btn:hover,body.itv-nx .btn-submit:hover,body.itv-nx .btnGreen:hover{color:#ffffff!important}

/* ============================================================================
   AUDIT ROUND 3 — same day, from the v22 re-scan.
   Two kinds of entry here: things v22 fixed incompletely, and three regressions
   v22 introduced. Both were found by re-running the scanner, which is the point
   of having one that works.
   ========================================================================== */

/* ---- REGRESSION 1: mobile table cells, dark ink stranded on a dark card -----
   v22 darkened `.comp-table tbody tr` for mobile, but the page's own mobile
   block sets `color:rgb(68,68,68) !important` on the cells. That was readable
   while the card was white; on the dark card it is 1.63 (and 1.47 in the
   highlight column). 104 cells over 7 pages — the same rows, failing the other
   way round. The skin's desktop rule sets this colour WITHOUT !important, which
   is exactly why it lost. */
@media (max-width:768px){
  body.itv-nx .comp-table tbody td,body.itv-nx .credit-table tbody td{color:var(--sk-text)!important}
  body.itv-nx .comp-table tbody td:first-child,body.itv-nx .credit-table tbody td:first-child{color:#ffffff!important}   /* on the navy banner */
}

/* REGRESSIONS 2 and 3 (dark ink on badges that are not green, and on
   .tech-tab.active / .filter-chip.active) are fixed at source in the round-2
   block above rather than layered over here — two contradictory rules for one
   selector a few lines apart is how the next bug starts. */

/* ---- Events (46): the featured card paints a WHITE gradient ----------------
   v22 set its background-COLOR, which does nothing: `.featured-event` carries
   `background-image:linear-gradient(135deg,#fff 0%,…)`, and the image paints over
   the colour. This is precisely the gradient blind spot that made the old scanner
   useless, reproduced in a fix. Everything in the card sat on white at one end —
   six findings from one property. */
body.itv-nx .featured-event{
  background-image:linear-gradient(135deg,var(--sk-surface) 0%,var(--sk-canvas) 100%)!important;
}
body.itv-nx .btn-outline{color:var(--sk-head)!important;border-color:var(--sk-line)!important}

/* ---- About (44): the eco banner --------------------------------------------
   `.green-banner` is a #87C440 -> #689236 gradient with white text (2.73). White
   cannot pass on either stop. Take the same route as the buttons: dark ink, and
   lift the dark end to the lime the header CTA already uses, so the ink clears
   7.4 across the whole sweep instead of 4.4 at the dark end. */
body.itv-nx .green-banner{background-image:linear-gradient(135deg,#a3e635,#87c440)!important}
body.itv-nx .green-banner h3,body.itv-nx .green-banner p,body.itv-nx .green-banner div{color:#0c1c28!important}

/* ---- Calculators (10647): the kit's #5f6b7a muted grey ---------------------
   278 instances at 2.94-3.10 — the largest single block left after v22, and the
   last thing on the page still reading as washed out. --sk-dim clears 8.0 and is
   the token every other muted caption on the site already uses. */
body.itv-nx .kpi .t,body.itv-nx .kpi .s,body.itv-nx .viz-title,body.itv-nx .cardFoot .mini,body.itv-nx .cardFoot .mini a,body.itv-nx .rangeMeta,body.itv-nx .rangeMeta span,body.itv-nx .rangeMeta b,body.itv-nx .plan-empty,body.itv-nx .plan-empty b{color:var(--sk-dim)!important}

/* ---- SLA (10772): bare <strong> and the priority badges -------------------- */
body.itv-nx .section-ice strong{color:var(--sk-head)!important}
/* the "Past" event chips sit on whatever the card behind them is (olive, khaki,
   grey — 3.96 to 4.36 with white on it). Give them a solid dark chip instead of
   depending on what happens to be underneath. */
body.itv-nx .status-badge.past{background:var(--sk-surface-2)!important;color:var(--sk-dim)!important;
  border:1px solid var(--sk-line)!important}
body.itv-nx .priority-badge{color:#ffffff!important}
body.itv-nx .priority-badge.priority-medium{color:#a3e635!important}   /* --lime IS #87C440, which is the colour that failed */

/* ---- the last two site-wide marginals: 4.31 and 4.40 ----------------------
   `.hero-badge` (92 instances, 46 pages) and `.eyebrow` (88, 44 pages) put
   --green #87C440 on a lime-tinted panel. Both sit just under AA. Moving the
   text to the homepage lime #A3E635 — already this site's accent, so nothing new
   is introduced — takes them to ~6.2 without touching the panels. */
body.itv-nx .hero-badge,body.itv-nx .eyebrow{color:#a3e635!important}
body.itv-nx .x-icon,body.itv-nx .credit-table strong{color:#ff7b6b!important}  /* #E74C3C danger red, 4.17 -> 6.2 */

/* ---- the same white-on-green pair, hiding in GENERATED content -------------
   Found once contrast-scan.js learned to measure ::before/::after (#46). These
   two badges are painted entirely by pseudo content — "RECOMMENDED" on the
   highlighted comparison column, "★ FEATURED" on the KB vendor card — so no
   amount of scanning DOM text was ever going to see them. Both are white on
   #87C440 at 2.1, exactly the pair fixed everywhere else in this issue. */
body.itv-nx .comp-table thead th.highlight::before,body.itv-nx .credit-table thead th.highlight::before,body.itv-nx .vendor-card-featured::before{color:#0c1c28!important}
body.itv-nx .ticker-footer{color:var(--sk-dim)!important}
body.itv-nx .venue-graphic-detail{color:#a3e635!important}

/* ============================================================================
   NATIVE SEARCH RESULTS (/?s=) — issue #43
   The header's search overlay submits to WordPress core search, so this page is
   reachable from every dark page on the site and was the last one still wearing
   the light theme. It is not a kit page and not an Elementor canvas: the body is
   Elementor's archive template 5297, built from `.elementor-*` classes the rest
   of this skin knows nothing about, so it needs its own short block.

   Selector list came from pointing contrast-scan.js at a local preview of the
   fixed state rather than from reading the template — same method as the rest of
   this file, and it took one pass to go clean at both viewports.
   ========================================================================== */
body.itv-nx.search{background:var(--sk-canvas);color:var(--sk-text)}

/* the tinted band behind "Search Results for: …" */
body.itv-nx.search .elementor-background-overlay{background-color:var(--sk-surface-2)!important}

/* the results section paints solid white behind the whole grid */
body.itv-nx.search .elementor-location-archive section.elementor-top-section{
  background-color:transparent!important;
}

/* each result card */
body.itv-nx.search article{
  background-color:var(--sk-surface)!important;border-color:var(--sk-line)!important;
  color:var(--sk-text)!important;
}

/* headings and the breadcrumb are set to #000 by the archive template, which is
   ratio 1.21 on the dark canvas — invisible, not merely dim */
body.itv-nx.search h1,body.itv-nx.search h2,body.itv-nx.search h3,body.itv-nx.search h4,body.itv-nx.search .elementor-heading-title{color:var(--sk-head)!important}
body.itv-nx.search .ee-breadcrumbs__text,body.itv-nx.search .ee-breadcrumbs a{color:var(--sk-text)!important}

/* clear the fixed header. Kit pages get away with no top offset because their
   first section is a hero with its own padding; the archive template starts at
   y=0, so the breadcrumb rendered at y=50 — underneath an 88px fixed header,
   on top of the logo. That collision is NEW, caused by giving this page the
   chrome, so it belongs here rather than on a backlog. */
body.itv-nx.search .elementor-location-archive{
  padding-top:var(--hd-h,88px);
  /* The template hangs a decorative 540x425 image off the left edge, absolutely
     positioned at left:-50. On a 390px phone that pushed the layout out to 490 —
     the browser zoomed out to fit and the header's own buttons fell off the right
     edge. Pre-existing in template 5297 and equally broken before this page was
     dark, but it is on the page now so it gets fixed here.
     `clip` rather than `hidden`: it does not create a scroll container, it leaves
     the other axis alone, and it catches any future overflow in this template
     instead of just this one widget. */
  overflow-x:clip;
}

/* the EMPTY state. "It seems we can't find what you're looking for." is set to
   #000 by the archive template — ratio 1.21, completely invisible on the dark
   canvas. There are no results on that page, so nothing else fails and a scan of
   /?s=cloud alone reports clean; it only shows up if you search for something
   that does not exist. Worth remembering: empty states are their own page. */
body.itv-nx.search .ee-posts__nothing-found,body.itv-nx.search .ee-posts__nothing-found *{color:var(--sk-text)!important}

/* location pages (gen.py family): the card grids carry an inline
   grid-template-columns:repeat(2,1fr), which beats the widget's own 640px
   breakpoint, so phones got two ~170px columns of paragraph text. A non-important
   inline style loses to an !important rule, so this collapses them on every
   location page without touching the 13 widgets that still have stale sources
   (#77). The four map pages (Paramus + near tier) also carry the fix in-widget. */
@media (max-width:640px){
  body.itv-nx .benefits-grid[style*="repeat(2"]{grid-template-columns:1fr!important}
}