/* ══════════════════════════════════════════════════════════════════════════
   NOVA CLEAN — shared design pass for the nav and footer pages
   ══════════════════════════════════════════════════════════════════════════

   WHY A FILE AND NOT A <style> BLOCK PER PAGE
   This covers 38 pages. Thirty-eight copies of the same rules would drift
   apart within a week and there would be no single place to change the accent
   or revert the whole thing. One file, one <link> per page, one place to edit.

   WHAT IT DOES
   Brings the nav and footer pages onto the same system as /services,
   /pricing and /install:
       accent      #15803d, the on-white green chosen by the 2026-07-24
                   accessibility audit and now shared by all cleaned pages
       ink         #0E1113 headings, #545B60 body, #878F94 quiet
       rules       #E3E6E9 hairlines, #CDD2D6 on controls
       surfaces    #FFFFFF panels, radius 10px; controls radius 6px
       controls    one filled ink primary, everything else quiet
   Ambient glows and decorative gradients are removed. The brand green
   #58d900 is not used on these light surfaces at all.

   SCOPING RULES I HELD TO
   1. Only class selectors that belong to page content. No bare `a`, `span`,
      `em` or `strong` rules, because those exist in the shared nav and footer
      too and this file must never touch shared chrome.
   2. Nothing inside <pre>, <code> or a terminal mockup. On /install 33 green
      declarations are real CLI output, and recolouring product output would
      be falsifying a screenshot. Those selectors are excluded explicitly.
   3. !important throughout, because these pages carry heavy inline and
      !important-laden CSS of their own; a first pass without it on /pricing
      moved the count 179 -> 170 because almost nothing won.

   TO REVERT: remove the <link> tags, or delete this file's contents. Nothing
   in the page markup was changed.
   ══════════════════════════════════════════════════════════════════════════ */

:root{
  --nc-canvas:#F2F3F5;
  --nc-panel:#FFFFFF;
  --nc-ink:#0E1113;
  --nc-ink2:#545B60;
  --nc-ink3:#878F94;
  --nc-rule:#E3E6E9;
  --nc-rule2:#CDD2D6;
  --nc-accent:#15803d;
  --nc-shadow:0 1px 2px rgba(14,17,19,.05),0 1px 1px rgba(14,17,19,.03);
  --nc-shadow-lg:0 1px 2px rgba(14,17,19,.05),0 10px 28px -8px rgba(14,17,19,.09);
}

/* ── eyebrows and their dots ─────────────────────────────────────────────── */
.hero-eyebrow,
.feature-eyebrow,
.bucket-card-eyebrow,
.section-eyebrow{color:var(--nc-accent) !important;border-color:rgba(21,128,61,0.28) !important;}
.hero-eyebrow-dot,
.corner-dot{background:var(--nc-accent) !important;color:var(--nc-accent) !important;
  border-color:var(--nc-accent) !important;box-shadow:none !important;}

/* ── tick marks in feature lists ─────────────────────────────────────────── */
.bullet-check{color:var(--nc-accent) !important;background:transparent !important;
  border-color:transparent !important;box-shadow:none !important;}

/* ── cards and panels ────────────────────────────────────────────────────── */
.feat-card,
.related-card,
.bucket-card,
.detail-card,
.stat-item{background:var(--nc-panel) !important;border-color:var(--nc-rule) !important;
  border-radius:10px !important;box-shadow:var(--nc-shadow) !important;}
.feat-card:hover,
.related-card:hover,
.bucket-card:hover{border-color:var(--nc-rule2) !important;box-shadow:var(--nc-shadow-lg) !important;
  transform:none !important;}

/* Icon chips were brand-green gradients. */
.feat-icon,
.related-icon{background:rgba(21,128,61,0.08) !important;background-image:none !important;
  border-color:rgba(21,128,61,0.22) !important;color:var(--nc-accent) !important;
  border-radius:6px !important;box-shadow:none !important;}

/* ── numbers and emphasis ────────────────────────────────────────────────── */
/* .stat-num and hero <em> are gradients clipped to the text, so colour alone
   does nothing until the clip is cleared. */
.stat-num,
.page-hero h1 em,
.solution-hero h1 em{background:none !important;background-image:none !important;
  -webkit-background-clip:initial !important;background-clip:initial !important;
  -webkit-text-fill-color:var(--nc-ink) !important;color:var(--nc-ink) !important;}
.stat-label{color:var(--nc-ink2) !important;}

/* ── controls ────────────────────────────────────────────────────────────── */
.btn-primary{background:var(--nc-ink) !important;background-image:none !important;
  border:1px solid var(--nc-ink) !important;color:#FFFFFF !important;border-radius:6px !important;}
.btn-primary:hover{background:#23282C !important;}
.btn-secondary,
.btn-ghost{background:var(--nc-panel) !important;background-image:none !important;
  border:1px solid var(--nc-rule2) !important;color:var(--nc-ink) !important;border-radius:6px !important;}
.btn-secondary:hover,
.btn-ghost:hover{border-color:var(--nc-ink) !important;}

/* ── in-content links ────────────────────────────────────────────────────── */
/* Deliberately scoped to content containers. A bare `a` rule would repaint
   every link in the shared nav and footer. */
.page-hero a:not(.btn-primary):not(.btn-secondary),
.feature-section a:not(.btn-primary):not(.btn-secondary),
.feature-text a,
.bucket-card-link,
.related-section a:not(.related-card){color:var(--nc-accent) !important;}

/* ── ambient decoration ──────────────────────────────────────────────────── */
/* The cleaned pages carry no orbs or glow washes. */
.cin-orb,
.hero-orb,
.bg-glow,
[class*="-orb"]{display:none !important;background-image:none !important;}

/* ── never touch product output ──────────────────────────────────────────── */
/* Belt and braces: even though no selector above targets these, make it
   explicit that terminal and code content keeps whatever it already had. */
pre, pre *, code, code *,
[class*="terminal"] *, [class*="console"] *{
  color:revert; background:revert; border-color:revert;}

/* ── SPECIFICITY NOTE ─────────────────────────────────────────────────────
   These pages defend their colours with container-qualified rules that
   already carry !important, e.g.

       .feature-section.section-light .feature-eyebrow{color:#2f8a00!important}
       .page-hero .btn-primary{background:linear-gradient(...)!important}

   Those are (0,3,0) and (0,2,0). A single-class rule with !important is
   (0,1,0) and loses no matter where it sits in the cascade, which is why the
   first pass moved borders but left every colour untouched.

   The class name is repeated to reach the same specificity without having to
   know every container each page wraps its content in. On a tie the later
   stylesheet wins, and this file is the last one loaded on every page.
   ────────────────────────────────────────────────────────────────────── */

.feature-eyebrow.feature-eyebrow.feature-eyebrow,
.hero-eyebrow.hero-eyebrow.hero-eyebrow,
.bucket-card-eyebrow.bucket-card-eyebrow.bucket-card-eyebrow,
.pe-faq-eyebrow.pe-faq-eyebrow.pe-faq-eyebrow{
  color:var(--nc-accent) !important;
  background:rgba(21,128,61,0.06) !important;
  border-color:rgba(21,128,61,0.28) !important;}

.bullet-check.bullet-check.bullet-check{
  color:var(--nc-accent) !important;background:transparent !important;border-color:transparent !important;}

.btn-primary.btn-primary.btn-primary{
  background:var(--nc-ink) !important;background-image:none !important;
  border-color:var(--nc-ink) !important;color:#FFFFFF !important;}
.btn-primary.btn-primary.btn-primary:hover{background:#23282C !important;transform:none !important;filter:none !important;}
.btn-primary.btn-primary.btn-primary::before{display:none !important;}
.btn-secondary.btn-secondary.btn-secondary{
  background:var(--nc-panel) !important;background-image:none !important;
  border-color:var(--nc-rule2) !important;color:var(--nc-ink) !important;}

/* Gradient-clipped headline words and stat numerals. */
.page-hero h1 em, .solution-hero h1 em, h2 em,
.stat-num.stat-num.stat-num{
  background:none !important;background-image:none !important;
  -webkit-background-clip:initial !important;background-clip:initial !important;
  -webkit-text-fill-color:var(--nc-ink) !important;color:var(--nc-ink) !important;}

.feat-icon.feat-icon.feat-icon,
.related-icon.related-icon.related-icon{
  background:rgba(21,128,61,0.08) !important;background-image:none !important;
  border-color:rgba(21,128,61,0.22) !important;color:var(--nc-accent) !important;}

.feat-card.feat-card, .related-card.related-card,
.bucket-card.bucket-card, .pe-faq-item.pe-faq-item{
  border-color:var(--nc-rule) !important;background:var(--nc-panel) !important;}

/* ══════════════════════════════════════════════════════════════════════════
   SECOND VOCABULARY: the footer / reference pages
   ══════════════════════════════════════════════════════════════════════════
   The nav pages above share one solution-page template. The footer pages do
   not; /how-to, /integrations, /api, /cli, /changelog and the legal set each
   grew their own class names for the same three shapes, which is why the
   first block moved /solutions/sre from 49 green declarations to 3 and left
   /how-to on 1128. Same treatment, their names.

   All of these render on a WHITE body and paint brand #58d900 straight onto
   it, which measures about 2.3:1 — the exact failure the 2026-07-24
   accessibility audit fixed on the rest of the site. Moving them to #15803d
   is what makes them consistent AND what makes them readable.

   Classes are repeated for specificity for the same reason as above.
   ══════════════════════════════════════════════════════════════════════════ */

/* Panels: cards, tool tiles, doc tiles, API and CLI blocks. */
.doc-card.doc-card, .api-section.api-section, .cli-cmd.cli-cmd,
.int-tool.int-tool, .cl-entry.cl-entry, .legal-card.legal-card{
  background:var(--nc-panel) !important;
  border-color:var(--nc-rule) !important;
  box-shadow:var(--nc-shadow) !important;}
.doc-card.doc-card:hover, .int-tool.int-tool:hover, .cli-cmd.cli-cmd:hover{
  border-color:var(--nc-rule2) !important;
  box-shadow:var(--nc-shadow-lg) !important;
  transform:none !important;}

/* Labels, tags and method chips: tinted accent, not brand green on white. */
.docs-category-label.docs-category-label, .cl-tag.cl-tag,
.api-method.api-method, .int-tool-tag.int-tool-tag{
  color:var(--nc-accent) !important;
  background:rgba(21,128,61,0.08) !important;
  border-color:rgba(21,128,61,0.22) !important;}

/* Plain in-content links that were painted brand green. */
.doc-card-link.doc-card-link, .form-label.form-label,
.docs-link.docs-link, .cl-link.cl-link{
  color:var(--nc-accent) !important;
  border-color:rgba(21,128,61,0.28) !important;}

/* Status dots and small decorations. */
.int-tool-dot.int-tool-dot{
  background:var(--nc-accent) !important;
  border-color:var(--nc-accent) !important;
  box-shadow:none !important;}

/* Links and table headers INSIDE content containers only. These are scoped to
   a container class on purpose: a bare `a` or `th` rule would reach into the
   shared nav and footer, which this file must never touch. */
.doc-card a, .int-tool a, .api-section a, .cli-cmd a,
.cl-entry a, .legal-body a, .docs-grid a{
  color:var(--nc-accent) !important;}
.api-section th, .legal-body th, .docs-grid th, form th{
  color:var(--nc-ink) !important;
  background:var(--nc-panel) !important;
  border-color:var(--nc-rule) !important;}

/* Form controls on /contact-support and the legal pages. Scoped to `form` so
   no button in the shared chrome is reachable. */
form button, form .btn, .contact-form button{
  background:var(--nc-ink) !important;background-image:none !important;
  border:1px solid var(--nc-ink) !important;color:#FFFFFF !important;
  border-radius:6px !important;box-shadow:none !important;}
form input:focus, form textarea:focus, form select:focus{
  outline:none !important;
  border-color:var(--nc-ink) !important;
  box-shadow:0 0 0 3px rgba(14,17,19,0.08) !important;}

/* Icon artwork inside those panels. The icons inherit brand green through
   `currentColor` on stroke/fill, so the parent colour is what actually moves
   them; these rules catch the ones that hard-code it. */
.doc-card svg, .int-tool svg, .api-section svg, .docs-grid svg,
.doc-card svg *, .int-tool svg *, .api-section svg *, .docs-grid svg *{
  color:var(--nc-accent) !important;}