/* ========================================================
   slate-accents.css
   Overlay loaded AFTER typography-crisp.css. Adds WARM slate
   as a structural accent — deliberately in a small number of
   places so it punctuates the cream/gold palette rather than
   replacing it.

   Where it appears:
     - .featured section (warm-stone surface, dark text)
         WAS charcoal in main.css — now inverted to a light
         stone alt-band that breaks the cream rhythm before Join
     - .testi section (deep-slate surface, cream text + cream cards)
         WAS cream in main.css — now a dark editorial strip that
         makes the testimonials feel pinned-up, not just stacked
     - Site footer (same deep slate as testimonials)
     - .ec-pullquote utility class kept available for future use
       on single-escort / blog pages (not used on the homepage)

   Where it does NOT appear (deliberate):
     - Nav / header — stays cream for continuity with hero
     - CTAs — stay gold so the hierarchy reads
     - Body / headings elsewhere — ink, not slate
     - Gallery cards — cream frames warm photos best
   ======================================================== */

:root {
  /* Three tiers of slate, all warm-leaning so they sit with cream/gold
     rather than fighting it. Pure #1c232c reads as "different site";
     a bit of red/brown in the black keeps the family. */
  --slate-deep: #1a1f26;   /* footer + testimonials surface */
  --slate-soft: #e8e5df;   /* featured surface — warm stone */
  --slate-pale: #d6d9dc;   /* cool-light stone — unused currently, kept for future chip/badge accents */
  --slate-fg:   #eceae4;   /* text on slate-deep */
  --slate-fg-mute: rgba(236,234,228,.68);
  --slate-hair: rgba(236,234,228,.12);
}

/* ========================================================
   CONTACT BAR — warm beige strip above the charcoal header.
   Carolina's brand-system call (2026-05-08): beige top zone,
   charcoal logo zone beneath, cream content. Replaces the
   earlier slate-deep "page bookend" pattern.
   .cb-link colour is set in main.css (var(--text-body)) for
   legibility on the lighter surface — leave alone here.
   ======================================================== */
.contact-bar {
  background: var(--gold-pale);
}

/* ========================================================
   HEADER — stays as main.css intends (warm translucent glass).
   The cool slate experiment read as cold against the cream/gold
   palette, so we leave the header alone and only deepen the
   hairline + soften the logo weight below.

   The logo in main.css is Playfair 600 — heavier than the
   Hero/Welcome headlines (both 400), which made it dominate.
   Dropping to 500 so it reads as a confident wordmark rather
   than the loudest thing on the page.
   ======================================================== */
header {
  border-bottom: 1px solid rgba(20, 20, 24, .08);
}
.logo {
  font-weight: 500;
}
.logo em {
  font-weight: 400;
}

/* ========================================================
   FEATURED — back to charcoal at the design-system spec.
   Carolina's brand-system call (2026-05-08): drop the warm-stone
   inversion, return to dark editorial. Background pinned to literal
   #2a2a2e (the spec) rather than var(--charcoal) because
   typography-crisp.css redefines that var to #141418 for body-text
   crispness — too dark for this surface. Text-colour rules from
   main.css (cream + gold-light eyebrows/headings) re-apply naturally
   once the slate-accents inversion below is removed.
   ::before gold-glow is allowed back through for atmosphere.
   ======================================================== */
.featured {
  background: #2a2a2e;
}

/* ========================================================
   TESTIMONIALS — cream → warm stone backdrop
   Uses the same warm stone tier as Featured so the two light
   stone bands feel like siblings (both "spreads" in the magazine
   rhythm). Cards stay cream; dark text on stone is unchanged.
   Testimonial body dropped from all-italic to upright for
   readability — italic kept only for the emphasis pattern.
   ======================================================== */
.testi {
  background: var(--slate-soft);
}
/* Section heads stay default (gold eyebrow, dark sec-h2) — the
   stone surface takes them without any overrides needed. */

/* Testimonial card body — drop italic, keep serif, slightly
   firmer colour for readability. */
.testi .testi-text {
  font-style: normal;
  color: var(--charcoal);
}

/* ========================================================
   FOOTER — charcoal at the design-system spec, cream text, gold accents
   Background pinned to literal #2a2a2e (same reason as #hdr / .featured:
   typography-crisp.css's --charcoal override is text-tuned, not
   surface-tuned). Other footer rules below (cream-on-dark text,
   gold-light hovers) work unchanged on charcoal.
   ======================================================== */
footer {
  background: #2a2a2e;
  color: var(--slate-fg-mute);
}
.footer-brand p,
.footer-col p,
.footer-col a,
.footer-col li a {
  color: var(--slate-fg-mute);
}
.footer-brand .logo { color: var(--slate-fg); }
.footer-brand .logo em { color: var(--gold-light); }
.footer-col h4,
.footer-col .contact-label {
  color: var(--gold-light);
  /* Weight kept at main.css default (600). Earlier bump to 700
     read as too heavy on the slate surface. */
}
.footer-col a:hover,
.footer-brand a:hover { color: var(--gold-light); }
/* Social pills — retint borders/icons onto the warm slate */
.footer-brand [aria-label="Bluesky"],
.footer-brand [aria-label="Telegram"] {
  border-color: rgba(212,184,150,.22) !important;
  color: var(--slate-fg-mute) !important;
}
.footer-disclaimer {
  border-top: 1px solid var(--slate-hair);
}
.footer-disclaimer p {
  color: var(--slate-fg-mute);
}
.footer-bottom {
  border-top: 1px solid var(--slate-hair);
  color: var(--slate-fg-mute);
}
.footer-bottom a:hover { color: var(--gold-light); }

/* ========================================================
   PULLQUOTE / TESTIMONIAL SURFACE
   Drop .ec-pullquote on a <section> to get a warm-stone strip
   that breaks cream-on-cream repetition once per page.
   Template-agnostic — works wherever it's dropped.
   ======================================================== */
.ec-pullquote {
  background: var(--slate-soft);
  padding: 4.5rem 2rem;
  text-align: center;
}
.ec-pullquote-inner {
  max-width: 58ch;
  margin: 0 auto;
}
.ec-pullquote blockquote,
.ec-pullquote .quote {
  font-family: var(--serif);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(1.4rem, 2.6vw, 2rem);
  line-height: 1.35;
  letter-spacing: -.005em;
  color: var(--charcoal);
  margin-bottom: 1.2rem;
}
.ec-pullquote blockquote em,
.ec-pullquote .quote em { color: var(--gold); }
.ec-pullquote cite,
.ec-pullquote .cite {
  display: inline-block;
  font-family: var(--sans);
  font-style: normal;
  font-weight: 700;
  font-size: .7rem;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--text-body);
}