/* 2026-10-13 "natural" pass. The owner said the site looked made with AI and
   the colours felt unnatural. The tells were: red on every heading rule, card
   border, kicker, link and lead border; every block a bordered card in a grid;
   mono uppercase labels everywhere; cold grey text. This file loads LAST and
   only overrides; delete its <link> to return to the previous look.
   Red is now kept for one job: emphasis the eye should land on (hero "Found."). */

html.sr-night {
  --ink-fg: #24211d;       /* warm near-black, not pure #111 */
  --ink-muted: #6b655b;    /* warm grey, reads like printed text */
  --ink-rule: #e4dfd5;
  --ink-surface: #fbf9f5;
  --nat-band: #efebe3;     /* one stone tint for the bands */
  --nat-link: #24211d;
  --im-line: transparent;
}
html.sr-night .sv,
html.sr-night .sv-home {
  --sv-fg: #24211d; --sv-muted: #6b655b; --sv-line: #e4dfd5;
  --sv-highlight: #24211d; --sv-accent: #24211d;
}

/* The drawn red rule under every h2, the red dotted "signal" line and the red
   top edge each card got on scroll: all gone. */
html.sr-night .im-heading::after { display: none !important; }
html.sr-night .im-signal { display: none !important; }
html.sr-night .im-card.im-entered { border-top-color: var(--ink-rule) !important; }
@media (hover: hover) and (pointer: fine) {
  html.sr-night .im-card:hover { border-color: #cfc8bb !important; box-shadow: none !important; }
}

/* Labels: small sans in muted ink, sentence case as written in the copy. */
html.sr-night :is(.sv-kicker, .dashboard-value-label, .byo-label, .sgd-label, .sfi-kicker, .sf-h, .sf-eyebrow, .sep-kicker) {
  font: 600 13px/1.5 var(--font-jakarta), system-ui, sans-serif !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: var(--ink-muted) !important;
}

/* Links: ink with a real underline instead of red text. */
html.sr-night .sv .sv-link,
html.sr-night .sv-home .sv-link {
  color: var(--nat-link) !important;
  text-decoration: underline;
  text-decoration-color: #b9b1a3;
  text-underline-offset: 5px;
  text-decoration-thickness: 1px;
}
html.sr-night .sv .sv-link:hover { text-decoration-color: currentColor; }

/* Buttons: softer corner, warm ink. */
html.sr-night :is(.sv-button, .svh-primary, .sh-cta, .sf-cta, .srp-btn, .dashboard-value-actions a:first-child) {
  background: var(--ink-fg) !important; border-radius: 6px !important;
}

/* ---- Homepage ---------------------------------------------------------- */

/* Spacing inside a section: label sits close to its heading, heading close
   to its lead, then real air before the content. */
html.sr-night .sv-home .sv-kicker { margin-bottom: 12px !important; }
html.sr-night .sv-home .sv-head .sv-lead { margin-top: 20px; }
html.sr-night .sv-home .sv-head { margin-bottom: clamp(40px, 5vw, 64px); }

/* Split headings keep their two columns but lose the red side bar. */
html.sr-night .sv.sv-home > section .sv-head .sv-lead { border-left: 0 !important; padding-left: 0 !important; }

/* Close section: no red stub above the label. */
html.sr-night .sv.sv-home > section.sv-close .sv-kicker::before { display: none !important; }

/* Problems, the three "why SingRank" pillars and the method steps were all
   boxed cards. Now they are open columns divided by one hairline, the way a
   printed page would set them. Plans and proof keep their frames (they are
   real objects: an offer, a screenshot). */
html.sr-night .sv-home :is(.sv-value, .sv-step, .dashboard-value article) {
  background: transparent !important;
  border: 0 !important;
  border-top: 1px solid #d6cfc2 !important;
  border-radius: 0 !important;
  padding: 24px 0 0 !important;
}
html.sr-night .sv-home :is(.sv-values, .sv-steps, .dashboard-value-grid) {
  column-gap: clamp(32px, 4vw, 56px) !important;
  row-gap: 40px !important;
}
html.sr-night .sv-home .sv-value .sv-h3 { color: var(--ink-fg) !important; }
html.sr-night .sv-home .sv-step:before { color: var(--ink-muted) !important; font: 500 13px/1.5 var(--font-jakarta), sans-serif !important; letter-spacing: 0; }
html.sr-night .sv-home .sv-step img { border-radius: 4px; }

/* Evidence cards and plans: quieter frame. */
html.sr-night .sv-home :is(.sv-evidence-card, .svp-plan, .dashboard-value-compare) {
  border-color: var(--ink-rule) !important;
  background: var(--ink-surface) !important;
}
html.sr-night .sv-home .sv-evidence-links article { border-top: 1px solid #d6cfc2 !important; }

/* One stone band for "why SingRank" instead of the translucent grey overlay. */
html.sr-night .sv.sv-home > section.dashboard-value { background: var(--nat-band) !important; border-top: 0 !important; }

/* Client logos: drop the boxes, let the marks sit on the paper. */
html.sr-night .sv-home .sv-logo { background: transparent !important; border: 0 !important; }
html.sr-night .sv-home .sv-client figcaption { color: #8d867b; }

@media (max-width: 760px) {
  html.sr-night .sv-home :is(.sv-values, .sv-steps, .dashboard-value-grid) { row-gap: 32px !important; }
}

/* Hero: the small mono uppercase labels around the banner become quiet sans.
   "Found." stays red: that is the one place the eye should land. */
html.sr-night :is(.svh-eyebrow, .svh-pillars, .hg-top, .hg-foot) {
  font-family: var(--font-jakarta), system-ui, sans-serif !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  font-size: 13px !important;
  color: var(--ink-muted) !important;
}
html.sr-night .svh-pillars::before { background: var(--ink-rule) !important; }

/* "Why SingRank" pillar titles match the problem titles' scale. */
html.sr-night .sv-home .dashboard-value article h3 { font-size: clamp(19px, 1.7vw, 22px) !important; font-weight: 500 !important; }

/* Leftover red markers: list arrows, FAQ and disclosure plus signs, the
   italic red "Guides" label. Ink, a step lighter than text. */
html.sr-night .sv .sv-outcomes li:before { color: #9a9285 !important; }
html.sr-night .sv .sv-faq summary:after { color: #9a9285 !important; }
html.sr-night .cro-plus::before, html.sr-night .cro-plus::after { background: #9a9285 !important; }
html.sr-night .sgd-eyebrow {
  font: 600 13px/1.5 var(--font-jakarta), system-ui, sans-serif !important;
  font-style: normal !important; color: var(--ink-muted) !important;
}

/* The ask section and the disclosure below it drew two lines in a row. */
html.sr-night .sv.sv-home > section.cro-more { border-top: 0 !important; }
html.sr-night .sv.sv-home > section.cro-more > * { border-top: 0 !important; }