/* ═══════════════════════════════════════════════════════════════════════
   ELEVARE · REDISEÑO OPUS-INSPIRED · v1
   Override sobre styles.css — estética light/athletic/editorial
   Inspirado en opusathletic.com
   ═══════════════════════════════════════════════════════════════════════ */

/* ─── 1 · PALETTE — bone + ink + micro-#8B8782 ─────────────────────────── */
:root {
  --bg:        #F4F1EA !important;   /* bone / off-white cálido */
  --bg-alt:    #ECE7DD !important;   /* cream un grado más oscuro */
  --ink:       #0A0A0A !important;   /* negro profundo */
  --ink-soft:  #1A1A1A !important;
  --muted:     #6B6B68 !important;   /* gris medio para sub-text */
  --line:      #D8D2C5 !important;   /* línea sutil cream */
  --line-soft: rgba(10,10,10,0.08) !important;
  --accent:    #0A0A0A !important;   /* acento principal = NEGRO (no #8B8782) */
  --accent-ink:#0A0A0A !important;
  --accent-micro:#8B8782 !important;   /* #8B8782 reservado para micro-detalles */
  --radius:    0px !important;       /* sharp edges */
  --container: 1280px !important;
}

/* ─── 2 · BODY · base limpia ───────────────────────────────────────── */
html, body {
  background: var(--bg) !important;
  color: var(--ink) !important;
}
body {
  font-family: 'Inter', 'Helvetica Neue', sans-serif !important;
  font-weight: 400 !important;
  letter-spacing: -0.005em;
}

/* ─── 3 · TODAS LAS SECCIONES OSCURAS → CLARAS ─────────────────────── */
.manifesto, .results, .commitment, .investment, .filter, .diff,
.notes, .sub-cta, .case-hero, .sub-hero {
  background: var(--bg) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}
.manifesto::before, .investment::before, .results::before,
.commitment::before, .filter::before {
  display: none !important;
}

/* Section eyebrows / index labels */
.section__index, .section__index.light, .eyebrow {
  color: var(--muted) !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 12px !important;
  letter-spacing: 0.28em !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
}
.eyebrow .dot { background: var(--accent-micro) !important; }

/* ─── 4 · TIPOGRAFÍA · sans-serif athletic, all-caps ──────────────── */
h1, h2, h3, h4,
.hero__title, .section__title, .case-hero__name,
.div-card__title, .investment__item h3, .commitment__item h3,
.footer__cta-title, .results__featured-title {
  font-family: 'Archivo Black', 'Inter', sans-serif !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
  letter-spacing: -0.025em !important;
  color: var(--ink) !important;
  font-style: normal !important;
}

/* Kill all italic serif emphasis */
h1 em, h2 em, h3 em, .hero__title em, .case-hero__name em,
.section__title em, .muted, .muted-light {
  font-style: normal !important;
  font-family: inherit !important;
  color: var(--muted) !important;
  font-weight: 900 !important;
}

/* Body text */
p, li, .hero__sub, .div-card__lead, .investment__item-desc {
  font-family: 'Inter', sans-serif !important;
  color: var(--ink) !important;
  font-weight: 400 !important;
}

/* ─── 5 · HERO · big calm composition ─────────────────────────────── */
.hero {
  background: var(--bg) !important;
  color: var(--ink) !important;
  border-bottom: 1px solid var(--line) !important;
}
.hero__title {
  font-size: clamp(56px, 9vw, 140px) !important;
  line-height: 0.88 !important;
  color: var(--ink) !important;
}
.hero__sub {
  color: var(--ink) !important;
  max-width: 540px;
  font-size: 17px !important;
  line-height: 1.55 !important;
  font-weight: 300 !important;
}
.hero__meta {
  color: var(--muted) !important;
  border-top: 1px solid var(--line) !important;
}
.hero__bg-art { opacity: 0.04 !important; }
.hero__bg-art polygon { fill: var(--ink) !important; }
.hero__scroll { color: var(--muted) !important; }
.hero__logo,
.hero__logo-mark,
.hero__logo-word,
.hero__logo-tag {
  color: var(--ink) !important;
}

/* ─── 6 · NAV · clean editorial ───────────────────────────────────── */
.nav {
  background: var(--bg) !important;
  border-bottom: 1px solid var(--line) !important;
}
.nav::before {
  background: transparent !important;
  backdrop-filter: none !important;
}
.nav.is-scrolled {
  background: rgba(244, 241, 234, 0.95) !important;
  border-bottom: 1px solid var(--line) !important;
}
.nav.is-scrolled::before {
  background: transparent !important;
  backdrop-filter: blur(10px) !important;
}
.nav__inner a, .nav__menu a {
  color: var(--ink) !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
}
.nav__lang button { color: var(--ink) !important; }
.nav__cta {
  background: var(--ink) !important;
  color: var(--bg) !important;
  padding: 12px 22px !important;
  border-radius: 0 !important;
}

/* ─── 7 · BUTTONS · sharp + uppercase ─────────────────────────────── */
.btn {
  border-radius: 0 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.16em !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
  font-size: 12.5px !important;
  padding: 16px 28px !important;
  transition: all .25s ease !important;
}
.btn--primary {
  background: var(--ink) !important;
  color: var(--bg) !important;
  border: 1px solid var(--ink) !important;
}
.btn--primary:hover {
  background: transparent !important;
  color: var(--ink) !important;
}
.btn--ghost, .btn--ghost-light {
  background: transparent !important;
  color: var(--ink) !important;
  border: 1px solid var(--ink) !important;
}
.btn--ghost:hover, .btn--ghost-light:hover {
  background: var(--ink) !important;
  color: var(--bg) !important;
}
.btn--sm { padding: 10px 18px !important; font-size: 11px !important; }

/* ─── 8 · DIV CARDS · light minimal ────────────────────────────────── */
.div-card {
  background: var(--bg-alt) !important;
  color: var(--ink) !important;
  border: 1px solid var(--line) !important;
  border-radius: 0 !important;
}
.div-card--performance {
  background: var(--ink) !important;
  color: var(--bg) !important;
}
.div-card--performance .div-card__title,
.div-card--performance .div-card__lead,
.div-card--performance .div-card__list li,
.div-card--performance .div-card__tag,
.div-card--performance .div-card__body {
  color: var(--bg) !important;
}
.div-card--performance .div-card__list li::before {
  background: var(--accent-micro) !important;
}
.div-card__tag {
  color: var(--accent-micro) !important;
  letter-spacing: 0.26em !important;
  font-size: 11px !important;
  font-weight: 600 !important;
}
.div-card__more {
  color: var(--ink) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.16em !important;
  font-weight: 600 !important;
  font-size: 12px !important;
}
.div-card--performance .div-card__more { color: var(--bg) !important; }

/* ─── 9 · INVESTMENT · light editorial ────────────────────────────── */
.investment {
  background: var(--bg) !important;
  color: var(--ink) !important;
  border-top: 1px solid var(--line) !important;
  border-bottom: 1px solid var(--line) !important;
}
.investment .section__title.light { color: var(--ink) !important; }
.investment .section__title .muted-light { color: var(--muted) !important; }
.investment__intro p { color: var(--muted) !important; }
.investment__list { border-top: 1px solid var(--line) !important; }
.investment__item {
  border-bottom: 1px solid var(--line) !important;
}
.investment__item:hover { background: rgba(0,0,0,0.02) !important; }
.investment__item::before { background: var(--accent-micro) !important; opacity: 0; }
.investment__item:hover::before { opacity: 1; }
.investment__item-num { color: var(--line) !important; }
.investment__item:hover .investment__item-num { color: var(--muted) !important; }
.investment__item-tag {
  color: var(--accent-micro) !important;
  letter-spacing: 0.26em !important;
}
.investment__item h3 { color: var(--ink) !important; }
.investment__item-price strong { color: var(--ink) !important; }
.investment__item-price span { color: var(--muted) !important; }
.investment__item-desc { color: var(--muted) !important; }
.investment__item-includes li { color: var(--ink) !important; }
.investment__item-includes li::before { background: var(--accent-micro) !important; }
.investment__item-guarantee {
  background: rgba(139, 135, 130,0.05) !important;
  border: 1px solid rgba(139, 135, 130,0.20) !important;
  border-left: 2px solid var(--accent-micro) !important;
}
.investment__item-guarantee strong { color: var(--accent-micro) !important; }
.investment__item-guarantee span { color: var(--ink) !important; }
.investment__item-meta { color: var(--muted) !important; }
.investment__item-meta strong { color: var(--ink) !important; }
.investment__item--elite {
  background: var(--bg-alt) !important;
  border-bottom: 1px solid var(--line) !important;
}
.investment__item--elite::before { background: var(--accent-micro) !important; opacity: 1; }
.investment__item--elite .investment__item-price strong { color: var(--ink) !important; }
.investment__item--elite .investment__item-tag { color: var(--accent-micro) !important; }
.investment__process {
  background: transparent !important;
  border: 1px solid var(--line) !important;
  border-left: 2px solid var(--ink) !important;
}
.investment__process h4 { color: var(--ink) !important; }
.investment__process ol li { color: var(--ink) !important; }
.investment__process ol li strong { color: var(--ink) !important; }
.investment__process p { color: var(--muted) !important; }
.investment__note {
  border: 1px solid var(--line) !important;
  border-left: 2px solid var(--ink) !important;
  background: transparent !important;
  color: var(--ink) !important;
}

/* ─── 10 · COMMITMENT · light grid ────────────────────────────────── */
.commitment .section__title.light { color: var(--ink) !important; }
.commitment .section__title .muted-light { color: var(--muted) !important; }
.commitment__item {
  background: transparent !important;
  border-bottom: 1px solid var(--line) !important;
}
.commitment__num {
  color: var(--accent-micro) !important;
  font-family: 'Archivo Black', sans-serif !important;
}
.commitment__item h3 { color: var(--ink) !important; }
.commitment__item p { color: var(--muted) !important; }

/* ─── 11 · RESULTS · case grids ───────────────────────────────────── */
.results .section__title.light { color: var(--ink) !important; }
.results .section__title .muted-light { color: var(--muted) !important; }
.results__card {
  background: var(--bg-alt) !important;
  border: 1px solid var(--line) !important;
  border-radius: 0 !important;
  color: var(--ink) !important;
}
.results__card-title, .results__card h3 { color: var(--ink) !important; }
.results__card p, .results__card-discipline { color: var(--muted) !important; }
.results__featured {
  background: var(--bg-alt) !important;
  border: 1px solid var(--line) !important;
}

/* ─── 12 · FILTER, DIFF, FAQ ──────────────────────────────────────── */
.filter, .diff, .faq {
  background: var(--bg) !important;
  color: var(--ink) !important;
}
.diff__row {
  border-bottom: 1px solid var(--line) !important;
}
.diff__row > div { color: var(--ink) !important; }
.diff__row--head > div {
  color: var(--muted) !important;
  font-weight: 600 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  font-size: 11px !important;
}
.faq__item { border-bottom: 1px solid var(--line) !important; }
.faq__item summary { color: var(--ink) !important; }
.faq__body { color: var(--muted) !important; }
.faq__icon::before, .faq__icon::after { background: var(--ink) !important; }

/* ─── 13 · NOTES & MAGNET ─────────────────────────────────────────── */
.notes, .magnet {
  background: var(--bg) !important;
  color: var(--ink) !important;
}
.notes__title, .magnet__title { color: var(--ink) !important; }
.notes__lead, .magnet__lead { color: var(--muted) !important; }
.notes__issue, .magnet__doc {
  background: var(--bg-alt) !important;
  border: 1px solid var(--line) !important;
  color: var(--ink) !important;
}
.notes__issue p, .notes__issue header { color: var(--ink) !important; }
.notes__form input, .magnet__form input {
  background: var(--bg) !important;
  border: 1px solid var(--ink) !important;
  border-radius: 0 !important;
  color: var(--ink) !important;
}

/* ─── 14 · APPLY (formulario) ─────────────────────────────────────── */
.apply { background: var(--bg-alt) !important; color: var(--ink) !important; }
.apply input, .apply textarea, .apply select {
  background: var(--bg) !important;
  border: 1px solid var(--ink) !important;
  border-radius: 0 !important;
  color: var(--ink) !important;
}
.apply__choice-card {
  background: var(--bg) !important;
  border: 1px solid var(--line) !important;
  border-radius: 0 !important;
  color: var(--ink) !important;
}
.apply__choice-card:hover { border-color: var(--ink) !important; }

/* ─── 15 · FOOTER · light ──────────────────────────────────────────── */
.footer { background: var(--bg-alt) !important; color: var(--ink) !important; }
.footer__cta { background: var(--ink) !important; color: var(--bg) !important; }
.footer__cta-title, .footer__cta-eyebrow, .footer__cta-sub { color: var(--bg) !important; }
.footer__logo, .footer__logo-mark, .footer__logo-word, .footer__logo-tag,
.footer__tagline-quote, .footer__cols h4, .footer__cols a {
  color: var(--ink) !important;
}
.footer__phone { color: var(--muted) !important; }
.footer__meta { background: transparent !important; border-top: 1px solid var(--line) !important; }
.footer__meta-block span, .footer__meta-label, .footer__meta-value {
  color: var(--ink) !important;
}
.footer__bottom { border-top: 1px solid var(--line) !important; color: var(--muted) !important; }
.footer__bottom a { color: var(--ink) !important; }

/* ─── 16 · COOKIE BANNER · invertido a light ──────────────────────── */
#cookie-banner {
  background: var(--ink) !important;
  color: var(--bg) !important;
  border: 1px solid var(--ink) !important;
}
.cookie-banner__msg { color: rgba(255,255,255,0.85) !important; }
.cookie-banner__msg a { color: var(--bg) !important; text-decoration: underline !important; }
.cookie-banner__btn {
  background: var(--bg) !important;
  color: var(--ink) !important;
  border-radius: 0 !important;
}

/* ─── 17 · MISC OVERRIDES ──────────────────────────────────────────── */
/* Borders sharp everywhere */
*, *::before, *::after { border-radius: 0 !important; }
input, textarea, button { border-radius: 0 !important; }

/* Method, experience cards */
.pillar, .exp__card, .method__card, .method__pillar {
  background: var(--bg-alt) !important;
  border: 1px solid var(--line) !important;
  border-radius: 0 !important;
}

/* Reveal animations stay (only colors change) */
.reveal { opacity: 0; transform: translateY(20px); transition: opacity .8s ease, transform .8s ease; }
.reveal.is-visible { opacity: 1; transform: translateY(0); }

/* ─── 18 · MARQUEE OPCIONAL ────────────────────────────────────────── */
/* Si más adelante quieres añadir una franja de texto en bucle al hero,
   añade <div class="elev-marquee">…</div> y descomenta esto */
.elev-marquee {
  background: var(--ink);
  color: var(--bg);
  padding: 18px 0;
  overflow: hidden;
  white-space: nowrap;
  font-family: 'Archivo Black', sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.24em;
  font-size: 14px;
}
.elev-marquee__track {
  display: inline-block;
  animation: elev-marquee 30s linear infinite;
}
.elev-marquee__track > span { margin: 0 32px; }
@keyframes elev-marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* ═══════════════════════════════════════════════════════════════════════
   19 · CONTRAST FIX — TEXTO LEGIBLE EN FONDOS NEGROS
   Asegura que en cualquier sección que mantiene fondo oscuro
   TODOS los textos sean blancos/cream.
   ═══════════════════════════════════════════════════════════════════════ */

/* ─── DIV-CARD PERFORMANCE (fondo negro) ─────────────────────────── */
.div-card--performance,
.div-card--performance *,
.div-card--performance h1,
.div-card--performance h2,
.div-card--performance h3,
.div-card--performance h4,
.div-card--performance p,
.div-card--performance li,
.div-card--performance span,
.div-card--performance strong,
.div-card--performance em {
  color: var(--bg) !important;
}
.div-card--performance .div-card__tag {
  color: var(--accent-micro) !important;
}
.div-card--performance .muted,
.div-card--performance .muted-light {
  color: rgba(245, 244, 241, 0.65) !important;
}
.div-card--performance .div-card__list li::before {
  background: var(--accent-micro) !important;
}
.div-card--performance .div-card__more {
  color: var(--bg) !important;
}

/* ─── FOOTER CTA STRIP (banda negra superior del footer) ─────────── */
.footer__cta,
.footer__cta *,
.footer__cta h1,
.footer__cta h2,
.footer__cta h3,
.footer__cta p,
.footer__cta span,
.footer__cta a {
  color: var(--bg) !important;
}
.footer__cta-eyebrow {
  color: var(--accent-micro) !important;
}
/* Botones DENTRO del footer__cta — invertidos para contraste */
.footer__cta .btn--primary {
  background: var(--bg) !important;
  color: var(--ink) !important;
  border: 1px solid var(--bg) !important;
}
.footer__cta .btn--primary:hover {
  background: transparent !important;
  color: var(--bg) !important;
}
.footer__cta .btn--ghost,
.footer__cta .btn--ghost-light {
  background: transparent !important;
  color: var(--bg) !important;
  border: 1px solid var(--bg) !important;
}
.footer__cta .btn--ghost:hover,
.footer__cta .btn--ghost-light:hover {
  background: var(--bg) !important;
  color: var(--ink) !important;
}
/* SVG fill dentro del CTA */
.footer__cta svg { fill: var(--bg) !important; color: var(--bg) !important; }

/* ─── COOKIE BANNER (fondo negro) ────────────────────────────────── */
#cookie-banner,
#cookie-banner *,
.cookie-banner__msg,
.cookie-banner__inner {
  color: var(--bg) !important;
}
#cookie-banner .cookie-banner__msg { color: rgba(245,244,241,0.85) !important; }
#cookie-banner .cookie-banner__msg a {
  color: var(--bg) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}
#cookie-banner .cookie-banner__btn {
  background: var(--bg) !important;
  color: var(--ink) !important;
  border-radius: 0 !important;
}
#cookie-banner .cookie-banner__btn:hover {
  background: var(--accent-micro) !important;
  color: var(--ink) !important;
}

/* ─── NAV CTA BUTTON (negro fijo en navbar) ──────────────────────── */
.nav__cta,
.nav__cta * {
  color: var(--bg) !important;
}
.nav__cta:hover {
  background: transparent !important;
  color: var(--ink) !important;
  outline: 1px solid var(--ink) !important;
}

/* ─── ALL BTN--PRIMARY (sólido negro) ────────────────────────────── */
.btn--primary,
.btn--primary span,
.btn--primary * {
  color: var(--bg) !important;
}
.btn--primary svg {
  fill: var(--bg) !important;
  color: var(--bg) !important;
}
/* Hover invertido: btn primary pasa a fondo cream + texto negro */
.btn--primary:hover,
.btn--primary:hover span,
.btn--primary:hover * {
  color: var(--ink) !important;
}
.btn--primary:hover svg {
  fill: var(--ink) !important;
  color: var(--ink) !important;
}

/* ─── MARQUEE FIX (si se usa) ────────────────────────────────────── */
.elev-marquee, .elev-marquee * {
  color: var(--bg) !important;
}

/* ─── DROPDOWN / ACCORDION CONTENT en fondo oscuro (por si acaso) ── */
[class*="--dark"],
[class*="--dark"] *,
.is-dark,
.is-dark * {
  color: var(--bg) !important;
}
[class*="--dark"] .muted,
[class*="--dark"] .muted-light {
  color: rgba(245,244,241,0.65) !important;
}

/* ─── SUB-CTA (si existe con bg oscuro residual) ─────────────────── */
.sub-cta--dark,
.sub-cta--dark * {
  color: var(--bg) !important;
}

/* ─── SECCIONES CON CLASE --DARK (sub-section--dark, etc.) ───────── */
.sub-section--dark,
.sub-section--dark * {
  color: var(--bg) !important;
  background-color: var(--ink) !important;
}
.sub-section--dark .muted-light,
.sub-section--dark .muted {
  color: rgba(245,244,241,0.6) !important;
}
.sub-section--dark .section__index.light {
  color: var(--accent-micro) !important;
}
.sub-section--dark .case-quote footer strong,
.sub-section--dark .case-quote footer span {
  color: var(--bg) !important;
}

/* ─── CASE-HERO · mantiene foto nítida con overlay oscuro ────────── */
/* NOTA: la paleta de textos se define en la sección 25 (línea ~1316) */
.case-hero__media { display: block !important; }
.case-hero__img {
  filter: none !important;
  opacity: 1 !important;
}
.case-hero__overlay {
  background: linear-gradient(180deg,
    rgba(0,0,0,0.35) 0%,
    rgba(0,0,0,0.55) 60%,
    rgba(0,0,0,0.85) 100%) !important;
}


/* ═══════════════════════════════════════════════════════════════════════
   20 · FIX CRÍTICO DE CONTRASTE — secciones que mantienen fondo negro
   El override de h1/h2/h3 a color:ink las hacía invisibles sobre negro.
   Ahora forzamos cream/bg en TODA la jerarquía interior.
   ═══════════════════════════════════════════════════════════════════════ */

/* ─── MÉTODO ELEVARE (sec. 04 — fondo negro mantenido) ───────────── */
.method {
  background: var(--ink) !important;
  color: var(--bg) !important;
}
.method *,
.method h1, .method h2, .method h3, .method h4,
.method p, .method li, .method span, .method strong, .method em {
  color: var(--bg) !important;
}
.method .section__title,
.method .section__title.light,
.method .section__title em {
  color: var(--bg) !important;
}
.method .section__title .muted,
.method .section__title .muted-light {
  color: rgba(245,244,241,0.55) !important;
}
.method .section__index,
.method .section__index.light {
  color: var(--accent-micro) !important;
}
.method__num {
  color: var(--accent-micro) !important;
  font-family: 'Archivo Black', sans-serif !important;
}
.method__item p,
.method__item p span {
  color: rgba(245,244,241,0.75) !important;
}
.method__list {
  border-top: 1px solid rgba(255,255,255,0.10) !important;
}
.method__item {
  border-bottom: 1px solid rgba(255,255,255,0.10) !important;
}
.method__item:hover {
  background: rgba(255,255,255,0.025) !important;
}
.method__pillar, .method__card, .method__pillars > * {
  background: rgba(255,255,255,0.035) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  color: var(--bg) !important;
}
.method__pillar h3, .method__card h3 { color: var(--bg) !important; }
.method__pillar p, .method__card p { color: rgba(245,244,241,0.75) !important; }

/* ─── RESULTS FEATURED (casos destacados en home, fondo negro) ──── */
.results__featured {
  background: transparent !important;
  border-top: 1px solid var(--line) !important;
}
.results__featured-body {
  background: var(--ink) !important;
  color: var(--bg) !important;
}
.results__featured-body *,
.results__featured-body h1,
.results__featured-body h2,
.results__featured-body h3,
.results__featured-body h4,
.results__featured-body p,
.results__featured-body span,
.results__featured-body a,
.results__featured-body strong {
  color: var(--bg) !important;
}
.results__featured-tag {
  color: var(--accent-micro) !important;
  letter-spacing: 0.26em !important;
}
.results__featured-name,
.results__featured-name * {
  color: var(--bg) !important;
}
.results__featured-name .muted,
.results__featured-name .muted-light {
  color: rgba(245,244,241,0.55) !important;
}
.results__featured-lead {
  color: rgba(245,244,241,0.78) !important;
}
.results__featured-cta {
  color: var(--bg) !important;
  border-bottom-color: var(--bg) !important;
}
.results__featured-cta:hover {
  color: var(--accent-micro) !important;
  border-bottom-color: var(--accent-micro) !important;
}

/* ─── NAV CTA "SOLICITAR EVALUACIÓN" (botón negro arriba derecha) ── */
/* Selectores reforzados (más específicos que .nav__menu a) */
.nav__menu a.nav__cta,
.nav .nav__cta,
header.nav a.nav__cta,
a.nav__cta {
  background: var(--ink) !important;
  color: var(--bg) !important;
  border: 1px solid var(--ink) !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  padding: 12px 22px !important;
  border-radius: 0 !important;
}
.nav__menu a.nav__cta:hover,
.nav .nav__cta:hover,
header.nav a.nav__cta:hover,
a.nav__cta:hover {
  background: transparent !important;
  color: var(--ink) !important;
}
/* Span/texto dentro del botón */
.nav__cta *, .nav__cta span {
  color: inherit !important;
}

/* ─── RESULTS CARDS (otras tarjetas de casos si aparecen) ────────── */
/* Si .results__card tiene fondo claro, deja texto oscuro (bien).
   Pero por si acaso una versión está en negro… */
.results__card[style*="ink"],
.results__card.is-dark {
  background: var(--ink) !important;
  color: var(--bg) !important;
}
.results__card[style*="ink"] *,
.results__card.is-dark * {
  color: var(--bg) !important;
}

/* ─── BOTONES DENTRO DE NAV (que NO son CTA) ─────────────────────── */
.nav__menu a:not(.nav__cta):not(.btn) {
  color: var(--ink) !important;
}
.nav__menu a:not(.nav__cta):not(.btn):hover {
  color: var(--accent-micro) !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   21 · FIX HOVER · sec. 08 CÓMO FUNCIONA (process cards)
   El hover invierte la card a fondo negro — forzamos texto cream
   ═══════════════════════════════════════════════════════════════════════ */

/* Estado normal — light */
.process__step {
  background: var(--bg-alt) !important;
  color: var(--ink) !important;
  border: 1px solid var(--line) !important;
  border-radius: 0 !important;
  transition: transform .35s ease, background .25s ease, color .25s ease, border-color .25s ease !important;
}
.process__step h3,
.process__step p,
.process__step span,
.process__step .process__num {
  color: var(--ink) !important;
}
.process__step .process__num { color: var(--muted) !important; }

/* Estado hover — fondo negro + TODO el texto cream */
.process__step:hover,
.process__step:hover * {
  color: var(--bg) !important;
}
.process__step:hover {
  background: var(--ink) !important;
  border-color: var(--ink) !important;
  transform: translateY(-6px) !important;
}
.process__step:hover h3,
.process__step:hover p,
.process__step:hover span {
  color: var(--bg) !important;
}
.process__step:hover .process__num {
  color: var(--accent-micro) !important;
}

/* Misma lógica para otros cards que hacen hover→dark (exp, pillar, etc.) */
.exp__card:hover,
.exp__card:hover *,
.pillar:hover,
.pillar:hover * {
  color: var(--bg) !important;
}
.exp__card:hover,
.pillar:hover {
  background: var(--ink) !important;
  border-color: var(--ink) !important;
}
.exp__card:hover .exp__num,
.pillar:hover .pillar__num {
  color: var(--accent-micro) !important;
}

/* Magnet doc card hover */
.magnet__doc:hover,
.magnet__doc:hover * {
  color: var(--bg) !important;
}
.magnet__doc:hover {
  background: var(--ink) !important;
  border-color: var(--ink) !important;
}

/* Investment item hover — ya es light, no necesita fix */
/* Commitment item — no tiene hover background-change por defecto */

/* ═══════════════════════════════════════════════════════════════════════
   22 · FIX WHATSAPP BUTTON (footer CTA) — texto + icono visibles
   ═══════════════════════════════════════════════════════════════════════ */
.footer__cta .btn,
.footer__cta a.btn,
.footer__cta .btn *,
.footer__cta a.btn *,
.footer__cta .btn span,
.footer__cta .btn svg {
  color: var(--ink) !important;
}
.footer__cta .btn--primary,
.footer__cta a.btn--primary {
  background: var(--bg) !important;
  color: var(--ink) !important;
  border: 1px solid var(--bg) !important;
}
.footer__cta .btn--primary span,
.footer__cta .btn--primary * {
  color: var(--ink) !important;
}
.footer__cta .btn--primary svg,
.footer__cta .btn--primary svg path {
  fill: var(--ink) !important;
  color: var(--ink) !important;
}
.footer__cta .btn--primary:hover {
  background: transparent !important;
  color: var(--bg) !important;
  border: 1px solid var(--bg) !important;
}
.footer__cta .btn--primary:hover *,
.footer__cta .btn--primary:hover span { color: var(--bg) !important; }
.footer__cta .btn--primary:hover svg,
.footer__cta .btn--primary:hover svg path {
  fill: var(--bg) !important;
  color: var(--bg) !important;
}
/* Ghost button en footer CTA */
.footer__cta .btn--ghost,
.footer__cta .btn--ghost-light,
.footer__cta a.btn--ghost,
.footer__cta a.btn--ghost-light {
  background: transparent !important;
  color: var(--bg) !important;
  border: 1px solid var(--bg) !important;
}
.footer__cta .btn--ghost *, .footer__cta .btn--ghost-light *,
.footer__cta .btn--ghost span, .footer__cta .btn--ghost-light span {
  color: var(--bg) !important;
}
.footer__cta .btn--ghost:hover,
.footer__cta .btn--ghost-light:hover {
  background: var(--bg) !important;
  color: var(--ink) !important;
}
.footer__cta .btn--ghost:hover *,
.footer__cta .btn--ghost-light:hover * { color: var(--ink) !important; }

/* ═══════════════════════════════════════════════════════════════════════
   23 · APPLY SECTION (formulario aplicación) → conversión total a light
   El apply__form interno tenía fondo #101010 y borders oscuros.
   Convertimos TODO a light: form, stepper, choice cards, pills, buttons.
   ═══════════════════════════════════════════════════════════════════════ */

/* Sección base */
.apply {
  background: var(--bg) !important;
  color: var(--ink) !important;
}
.apply::before { display: none !important; }
.apply__container { color: var(--ink) !important; }

/* Section title del apply */
.apply .cta__title,
.apply .cta__title * { color: var(--ink) !important; }
.apply .cta__title em {
  color: var(--accent-micro) !important;
  font-style: normal !important;
}
.apply .cta__sub { color: var(--muted) !important; }
.apply .section__index.light { color: var(--accent-micro) !important; }

/* Availability bar */
.apply__availability {
  background: var(--bg-alt) !important;
  border: 1px solid var(--line) !important;
  color: var(--ink) !important;
}
.apply__avail-item, .apply__avail-item * { color: var(--ink) !important; }
.apply__avail-label { color: var(--muted) !important; }
.apply__avail-value { color: var(--ink) !important; }
.apply__avail-value--accent { color: var(--accent-micro) !important; }

/* Form container */
.apply__form {
  background: var(--bg-alt) !important;
  border: 1px solid var(--line) !important;
  color: var(--ink) !important;
  padding: 48px !important;
}

/* Stepper */
.apply__stepper {
  background: var(--bg) !important;
  border: 1px solid var(--line) !important;
}
.apply__stepper-item {
  border-right: 1px solid var(--line) !important;
  color: var(--ink) !important;
}
.apply__stepper-item.is-active {
  background: rgba(139, 135, 130, 0.08) !important;
}
.apply__stepper-num {
  color: var(--accent-micro) !important;
  font-family: 'Archivo Black', sans-serif !important;
}
.apply__stepper-label {
  color: var(--ink) !important;
  font-family: 'Inter', sans-serif !important;
}

/* Step head — "TRES PREGUNTAS PARA EMPEZAR BIEN" */
.apply__step-head { color: var(--ink) !important; }
.apply__step-eyebrow {
  color: var(--accent-micro) !important;
  font-family: 'Inter', sans-serif !important;
}
.apply__step-title,
.apply__step-title *,
.apply__step-title span {
  color: var(--ink) !important;
  font-family: 'Archivo Black', sans-serif !important;
}
.apply__step-title .muted-light,
.apply__step-title .muted {
  color: var(--muted) !important;
  font-weight: 900 !important;
}

/* Question blocks */
.apply__question,
.apply__question * { color: var(--ink) !important; }
.apply__question legend {
  color: var(--muted) !important;
  font-family: 'Inter', sans-serif !important;
  letter-spacing: 0.28em !important;
  font-weight: 600 !important;
}

/* Choice cards (División, Disponibilidad, etc.) */
.apply__choice-card {
  background: var(--bg) !important;
  border: 1px solid var(--line) !important;
  color: var(--ink) !important;
  border-radius: 0 !important;
}
.apply__choice-card:hover {
  border-color: var(--ink) !important;
  background: rgba(10, 10, 10, 0.025) !important;
}
.apply__choice-card:has(input:checked) {
  border-color: var(--ink) !important;
  background: var(--bg-alt) !important;
}
.apply__choice-card * { color: var(--ink) !important; }
.apply__choice-tag {
  color: var(--accent-micro) !important;
  font-family: 'Inter', sans-serif !important;
  letter-spacing: 0.30em !important;
}
.apply__choice-title { color: var(--ink) !important; }
.apply__choice-desc { color: var(--muted) !important; }

/* Pill-style buttons (Piloto motorsport, Deportista, Inmediato, etc.) */
.apply input[type="radio"] + label,
.apply input[type="checkbox"] + label,
.apply .pill,
.apply .form-pill {
  background: var(--bg) !important;
  border: 1px solid var(--ink) !important;
  color: var(--ink) !important;
  border-radius: 0 !important;
}
.apply input[type="radio"]:checked + label,
.apply input[type="checkbox"]:checked + label,
.apply .pill.is-active,
.apply .form-pill.is-active {
  background: var(--ink) !important;
  color: var(--bg) !important;
}

/* Inputs, textareas */
.apply input[type="text"],
.apply input[type="email"],
.apply input[type="tel"],
.apply textarea,
.apply select {
  background: var(--bg) !important;
  border: 1px solid var(--ink) !important;
  color: var(--ink) !important;
  border-radius: 0 !important;
}
.apply input::placeholder, .apply textarea::placeholder {
  color: var(--muted) !important;
}
.apply label {
  color: var(--ink) !important;
}

/* Step navigation buttons — Continuar, Atrás, Enviar */
.apply__nav,
.apply__step-actions,
.apply__actions {
  background: transparent !important;
}
.apply__nav button,
.apply__nav .btn,
.apply__step-actions button,
.apply__step-actions .btn,
.apply__actions button,
.apply__actions .btn,
.apply button[type="submit"],
.apply button.btn,
.apply .btn--primary,
.apply .btn--ghost {
  background: var(--ink) !important;
  color: var(--bg) !important;
  border: 1px solid var(--ink) !important;
  border-radius: 0 !important;
}
.apply__nav button *,
.apply__step-actions button *,
.apply .btn *,
.apply .btn span {
  color: var(--bg) !important;
}
/* Hover invertido limpio (cream con borde negro) */
.apply__nav button:hover,
.apply__nav .btn:hover,
.apply__step-actions button:hover,
.apply__step-actions .btn:hover,
.apply__actions button:hover,
.apply__actions .btn:hover,
.apply .btn--primary:hover,
.apply button.btn:hover {
  background: var(--bg) !important;
  color: var(--ink) !important;
  border: 1px solid var(--ink) !important;
}
.apply__nav button:hover *,
.apply__step-actions button:hover *,
.apply .btn:hover *,
.apply .btn:hover span { color: var(--ink) !important; }

/* Ghost button específico en apply (Atrás) */
.apply .btn--ghost,
.apply .btn--ghost-light {
  background: transparent !important;
  color: var(--ink) !important;
  border: 1px solid var(--ink) !important;
}
.apply .btn--ghost:hover,
.apply .btn--ghost-light:hover {
  background: var(--ink) !important;
  color: var(--bg) !important;
}
.apply .btn--ghost:hover *,
.apply .btn--ghost-light:hover * { color: var(--bg) !important; }

/* ═══════════════════════════════════════════════════════════════════════
   24 · KILL GOLD · paleta 100% blanco/negro/gris (Opus pure minimal)
   Elimina TODO uso de oro (#8B8782) — sustituido por ink o muted
   ═══════════════════════════════════════════════════════════════════════ */

/* Variable global: #8B8782-micro deja de ser oro */
:root {
  --accent-micro: var(--ink) !important;
  --accent: var(--ink) !important;
}

/* ── Palabras enfatizadas en títulos (era oro, ahora ink negro) ─── */
em, h1 em, h2 em, h3 em,
.cta__title em,
.apply .cta__title em,
.hero__title em,
.section__title em,
.case-hero__name em,
.diff__row em,
.investment__item h3 em,
.commitment__item h3 em {
  color: var(--ink) !important;
  font-style: normal !important;
  font-weight: 900 !important;
}

/* ── Eyebrow tags · TODOS muted gris (no más oro) ─────────────────── */
.eyebrow,
.eyebrow span,
.section__index,
.section__index.light,
.case-hero__discipline,
.apply__step-eyebrow,
.apply__choice-tag,
.apply__avail-label,
.div-card__tag,
.div-card--performance .div-card__tag,
.results__featured-tag,
.investment__item-tag,
.investment__item--elite .investment__item-tag,
.notes__tag,
.magnet__tag {
  color: var(--muted) !important;
}

/* ── Punto del eyebrow (era dorado) ─────────────────────────────── */
.eyebrow .dot,
.dot {
  background: var(--ink) !important;
}

/* ── Números grandes · ahora ink (en secciones light) ───────────── */
.commitment__num,
.apply__stepper-num,
.s1__num,
.s2__num,
.s3__num {
  color: var(--ink) !important;
  font-family: 'Archivo Black', sans-serif !important;
}

/* En secciones con fondo OSCURO mantenido (método), números cream */
.method__num {
  color: var(--bg) !important;
}
.process__step:hover .process__num,
.exp__card:hover .exp__num,
.pillar:hover .pillar__num {
  color: var(--bg) !important;
}

/* ── División Performance (negra) · tag era oro, ahora cream ────── */
.div-card--performance .div-card__tag {
  color: rgba(245, 244, 241, 0.7) !important;
}
.div-card--performance .div-card__list li::before {
  background: rgba(245, 244, 241, 0.7) !important;
}

/* ── Results featured (cards de casos en home) · tag cream ──────── */
.results__featured-tag {
  color: rgba(245, 244, 241, 0.7) !important;
}
.results__featured-cta:hover {
  color: var(--bg) !important;
  border-bottom-color: var(--bg) !important;
}

/* ── Footer CTA strip (banda negra) · eyebrow cream ─────────────── */
.footer__cta-eyebrow {
  color: rgba(245, 244, 241, 0.65) !important;
}

/* ── Investment item (incluyendo Elite) ─────────────────────────── */
.investment__item::before {
  background: var(--ink) !important;
}
.investment__item--elite::before {
  background: var(--ink) !important;
}
.investment__item--elite .investment__item-price strong {
  color: var(--ink) !important;
}
.investment__item-includes li::before {
  background: var(--ink) !important;
}
.investment__item-guarantee {
  background: rgba(10, 10, 10, 0.03) !important;
  border: 1px solid var(--line) !important;
  border-left: 2px solid var(--ink) !important;
}
.investment__item-guarantee strong {
  color: var(--ink) !important;
}
.investment__process {
  border-left: 2px solid var(--ink) !important;
}
.investment__process h4 {
  color: var(--ink) !important;
}
.investment__process ol li strong {
  color: var(--ink) !important;
}

/* ── Apply choice tags · ahora muted ────────────────────────────── */
.apply__choice-tag,
.apply__step-eyebrow {
  color: var(--muted) !important;
}
.apply__choice-card:has(input:checked) {
  border-color: var(--ink) !important;
  background: var(--bg-alt) !important;
}
.apply__avail-value--accent {
  color: var(--ink) !important;
}

/* ── Diff table accent (si tenía oro) ───────────────────────────── */
.diff__row > div:first-child {
  color: var(--ink) !important;
}

/* ── Sub-pages (Performance, Physique) · titles is-current ──────── */
.nav__menu a.is-current,
.nav__menu a.is-current::after {
  color: var(--ink) !important;
  background: var(--ink) !important;
}

/* ── Mini-numbers en notas / inversión (eyebrow numerico) ──────── */
.notes__include-num,
.investment__item-num,
.commitment__item .commitment__num {
  color: var(--ink) !important;
}

/* ── Background art del hero (era oro tenue) ────────────────────── */
[fill="#8B8782"],
[fill="#8B8782"] *,
.hero__bg-art polygon[fill="#8B8782"] {
  fill: var(--ink) !important;
}
[stroke="#8B8782"] {
  stroke: var(--ink) !important;
}

/* ── Cualquier elemento con clase --accent o color inline #8B8782 ── */
[style*="#8B8782"],
[style*="#8b8782"],
[style*="#a8a39e"] {
  color: var(--ink) !important;
}

/* ── Apply form inputs focus border ─────────────────────────────── */
.apply input:focus,
.apply textarea:focus,
.apply select:focus {
  border-color: var(--ink) !important;
  outline: 2px solid var(--ink) !important;
  outline-offset: 2px !important;
}

/* ── Underline en hover de nav links · no más oro ──────────────── */
.nav__menu a:not(.nav__cta):not(.btn):hover {
  color: var(--ink) !important;
}
.nav__menu a:not(.nav__cta):not(.btn)::after {
  background: var(--ink) !important;
}

/* ── Process step hover number · era oro, ahora ─────────────────── */
.process__step:hover .process__num {
  color: var(--bg) !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   25 · CASE PAGES (caso-*.html) · paleta sin oro, mantiene foto de fondo
   ═══════════════════════════════════════════════════════════════════════ */

/* ── Case Hero (con foto de fondo + overlay oscuro) ──────────────── */
.case-hero {
  background: #000 !important;
  color: var(--bg) !important;
}
.case-hero, .case-hero * {
  color: var(--bg) !important;
}
.case-hero__crumb {
  color: rgba(245, 244, 241, 0.65) !important;
}
.case-hero__crumb a {
  color: var(--bg) !important;
}
.case-hero__crumb a:hover {
  color: rgba(245, 244, 241, 0.7) !important;
}
.case-hero__crumb-current {
  color: rgba(245, 244, 241, 0.6) !important;
}
.case-hero__discipline {
  color: rgba(245, 244, 241, 0.65) !important;
  font-family: 'Inter', sans-serif !important;
  letter-spacing: 0.32em !important;
}
.case-hero__name {
  color: var(--bg) !important;
  font-family: 'Archivo Black', sans-serif !important;
}
.case-hero__name .muted-light,
.case-hero__name .muted {
  color: rgba(245, 244, 241, 0.55) !important;
  font-weight: 900 !important;
  font-style: normal !important;
}
.case-hero__sub {
  color: rgba(245, 244, 241, 0.8) !important;
}
.case-hero__meta {
  border-top: 1px solid rgba(255, 255, 255, 0.15) !important;
}
.case-hero__meta span {
  color: rgba(245, 244, 241, 0.55) !important;
  letter-spacing: 0.24em !important;
}
.case-hero__meta strong {
  color: var(--bg) !important;
}

/* ── Sub-section--dark (sección "El reto" de cada caso) ──────────── */
.sub-section--dark {
  background: var(--ink) !important;
  color: var(--bg) !important;
}
.sub-section--dark, .sub-section--dark * {
  color: var(--bg) !important;
}
.sub-section--dark .section__title { color: var(--bg) !important; }
.sub-section--dark .section__title .muted,
.sub-section--dark .section__title .muted-light {
  color: rgba(245, 244, 241, 0.55) !important;
  font-weight: 900 !important;
}
.sub-section--dark .sub-section__lead {
  color: rgba(245, 244, 241, 0.78) !important;
}
.sub-section--dark .section__index,
.sub-section--dark .section__index.light {
  color: rgba(245, 244, 241, 0.6) !important;
}

/* Sub-points dentro de sub-section--dark */
.sub-section--dark .sub-point__num,
.sub-point__num {
  color: var(--bg) !important;
  font-family: 'Archivo Black', sans-serif !important;
}
.sub-section--dark .sub-point h3 { color: var(--bg) !important; }
.sub-section--dark .sub-point p {
  color: rgba(245, 244, 241, 0.75) !important;
}

/* ── Sub-section--alt (otras secciones del caso, light) ──────────── */
.sub-section--alt {
  background: var(--bg-alt) !important;
  color: var(--ink) !important;
}
.sub-section--alt, .sub-section--alt * { color: var(--ink) !important; }
.sub-section--alt .section__title { color: var(--ink) !important; }
.sub-section--alt .section__title .muted {
  color: var(--muted) !important;
  font-weight: 900 !important;
}
.sub-section--alt .section__index { color: var(--muted) !important; }
.sub-section--alt .sub-section__lead { color: var(--ink) !important; }
.sub-section--alt .sub-point__num { color: var(--ink) !important; }
.sub-section--alt .sub-point h3 { color: var(--ink) !important; }
.sub-section--alt .sub-point p { color: var(--muted) !important; }

/* ── Case results (métricas, dentro de sub-section--dark) ────────── */
.case-results {
  border-top: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
}
.case-result {
  border-right: 1px solid rgba(255, 255, 255, 0.12) !important;
}
.case-result__label {
  color: rgba(245, 244, 241, 0.65) !important;
  letter-spacing: 0.24em !important;
  font-family: 'Inter', sans-serif !important;
}
.case-result__value {
  color: var(--bg) !important;
  font-family: 'Archivo Black', sans-serif !important;
}
.case-result p {
  color: rgba(245, 244, 241, 0.7) !important;
}

/* ── Case quote (cita del cliente, dentro de sub-section--dark) ──── */
.case-quote {
  border-top: 1px solid rgba(255, 255, 255, 0.12) !important;
}
.case-quote p {
  color: var(--bg) !important;
  font-family: 'Inter', serif !important;
  font-weight: 300 !important;
  font-style: italic !important;
}
.case-quote footer strong {
  color: var(--bg) !important;
  font-family: 'Archivo Black', sans-serif !important;
}
.case-quote footer span {
  color: rgba(245, 244, 241, 0.65) !important;
  font-family: 'Inter', sans-serif !important;
}

/* ── Cases grid (página casos.html, listado) ─────────────────────── */
.cases-grid-section {
  background: var(--bg) !important;
  color: var(--ink) !important;
}
.case-card {
  background: var(--bg-alt) !important;
  border: 1px solid var(--line) !important;
  border-radius: 0 !important;
  color: var(--ink) !important;
}
a.case-card:hover {
  border-color: var(--ink) !important;
  box-shadow: 0 30px 60px -30px rgba(0,0,0,0.18) !important;
}
a.case-card:hover .case-card__more {
  color: var(--ink) !important;
}
.case-card__more {
  color: var(--ink) !important;
  letter-spacing: 0.16em !important;
}
.case-card__title,
.case-card__name,
.case-card h3 {
  color: var(--ink) !important;
  font-family: 'Archivo Black', sans-serif !important;
}
.case-card__discipline,
.case-card__tag {
  color: var(--muted) !important;
}
.case-card__lead,
.case-card p {
  color: var(--muted) !important;
}

/* ── Sub-CTA inferior (siguiente caso / aplicar) ─────────────────── */
.sub-cta {
  background: var(--bg) !important;
  color: var(--ink) !important;
}
.sub-cta, .sub-cta * { color: var(--ink) !important; }
.sub-cta .section__index,
.sub-cta .section__index.light { color: var(--muted) !important; }
.sub-cta .cta__title { color: var(--ink) !important; }
.sub-cta .cta__title em {
  color: var(--ink) !important;
  font-style: normal !important;
}
.sub-cta .cta__sub { color: var(--muted) !important; }

/* ── Cualquier mención hardcoded a #8B8782 en case pages ─────────── */
.case-hero [style*="B8956A"],
.case-hero [style*="bfa15a"],
[class*="case-"] [style*="B8956A"],
[class*="case-"] [style*="bfa15a"] {
  color: var(--muted) !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   26 · FIX FINAL · botón CASOS en nav + buttons en .sub-cta
   ═══════════════════════════════════════════════════════════════════════ */

/* ── 1 · .is-current en nav (botón Casos cuando estás en casos.html) ─ */
/* El bug: bg negro + texto negro = invisible. Fix: solo subraya, no rellena */
.nav__menu a.is-current {
  color: var(--ink) !important;
  background: transparent !important;
  position: relative !important;
}
.nav__menu a.is-current::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: -4px !important;
  height: 1px !important;
  width: 100% !important;
  background: var(--ink) !important;
}

/* ── 2 · BUTTONS dentro de .sub-cta — escapan del universal * ──────── */
.sub-cta .btn--primary,
.sub-cta .btn--primary *,
.sub-cta .btn--primary span,
.sub-cta .btn--primary svg {
  color: var(--bg) !important;
  fill: var(--bg) !important;
}
.sub-cta .btn--primary {
  background: var(--ink) !important;
  border: 1px solid var(--ink) !important;
}
.sub-cta .btn--primary:hover,
.sub-cta .btn--primary:hover *,
.sub-cta .btn--primary:hover span,
.sub-cta .btn--primary:hover svg {
  color: var(--ink) !important;
  fill: var(--ink) !important;
  background: transparent !important;
}

.sub-cta .btn--ghost,
.sub-cta .btn--ghost *,
.sub-cta .btn--ghost-light,
.sub-cta .btn--ghost-light * {
  color: var(--ink) !important;
  background: transparent !important;
  border: 1px solid var(--ink) !important;
}
.sub-cta .btn--ghost:hover,
.sub-cta .btn--ghost:hover *,
.sub-cta .btn--ghost-light:hover,
.sub-cta .btn--ghost-light:hover * {
  background: var(--ink) !important;
  color: var(--bg) !important;
}

/* ── 3 · Resto de secciones con universal * + botones internos ──────── */
/* Footer (apart from CTA strip) buttons */
.footer .btn--primary,
.footer .btn--primary *,
.footer .btn--primary span {
  color: var(--bg) !important;
}
.footer .btn--primary {
  background: var(--ink) !important;
  border: 1px solid var(--ink) !important;
}

/* Apply section buttons (refuerza por si .apply * fuerza ink) */
.apply .btn--primary,
.apply .btn--primary *,
.apply .btn--primary span,
.apply .btn--primary svg,
.apply button.btn--primary,
.apply button.btn--primary * {
  color: var(--bg) !important;
  fill: var(--bg) !important;
}
.apply .btn--primary {
  background: var(--ink) !important;
  border: 1px solid var(--ink) !important;
}

/* CTA section (en home) */
.cta .btn--primary,
.cta .btn--primary *,
.cta .btn--primary span {
  color: var(--bg) !important;
}
.cta .btn--primary {
  background: var(--ink) !important;
  border: 1px solid var(--ink) !important;
}

/* Investment CTAs */
.investment .btn--primary,
.investment .btn--primary *,
.investment .btn--primary span,
.investment .btn--primary svg {
  color: var(--bg) !important;
  fill: var(--bg) !important;
}
.investment .btn--primary {
  background: var(--ink) !important;
  border: 1px solid var(--ink) !important;
}

/* Cases sub-cta inferior — ya cubierto arriba */

/* ── 4 · UTILIDAD GENERAL · btn--primary SIEMPRE protege su contraste ─ */
/* Selector de máxima especificidad sin recurrir a IDs */
body .btn--primary,
body a.btn--primary,
body button.btn--primary {
  background: var(--ink) !important;
  color: var(--bg) !important;
  border: 1px solid var(--ink) !important;
}
body .btn--primary span,
body .btn--primary svg,
body .btn--primary *,
body a.btn--primary *,
body button.btn--primary * {
  color: var(--bg) !important;
  fill: var(--bg) !important;
}
body .btn--primary:hover {
  background: transparent !important;
  color: var(--ink) !important;
}
body .btn--primary:hover *,
body .btn--primary:hover span,
body .btn--primary:hover svg {
  color: var(--ink) !important;
  fill: var(--ink) !important;
}

/* Excepción: en zonas YA negras (footer CTA strip), invertir */
body .footer__cta .btn--primary,
body .footer__cta a.btn--primary {
  background: var(--bg) !important;
  color: var(--ink) !important;
  border: 1px solid var(--bg) !important;
}
body .footer__cta .btn--primary *,
body .footer__cta .btn--primary span,
body .footer__cta .btn--primary svg {
  color: var(--ink) !important;
  fill: var(--ink) !important;
}
body .footer__cta .btn--primary:hover {
  background: transparent !important;
  color: var(--bg) !important;
}
body .footer__cta .btn--primary:hover *,
body .footer__cta .btn--primary:hover span,
body .footer__cta .btn--primary:hover svg {
  color: var(--bg) !important;
  fill: var(--bg) !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   27 · SUB-PAGES (performance.html, physique.html) — elementos específicos
   ═══════════════════════════════════════════════════════════════════════ */

/* ── Sub-hero (similar al case-hero pero de Performance/Physique) ──── */
.sub-hero {
  background: #000 !important;
  color: var(--bg) !important;
}
.sub-hero, .sub-hero * {
  color: var(--bg) !important;
}
.sub-hero__crumb {
  color: rgba(245, 244, 241, 0.6) !important;
  font-family: 'Inter', sans-serif !important;
}
.sub-hero__crumb a {
  color: var(--bg) !important;
}
.sub-hero__crumb a:hover {
  color: rgba(245, 244, 241, 0.7) !important;
}
.sub-hero__crumb-current {
  color: rgba(245, 244, 241, 0.6) !important;
}
.sub-hero__title {
  color: var(--bg) !important;
  font-family: 'Archivo Black', sans-serif !important;
}
.sub-hero__title em {
  color: var(--bg) !important;
  font-style: normal !important;
  font-weight: 900 !important;
}
.sub-hero__sub {
  color: rgba(245, 244, 241, 0.78) !important;
}
.sub-hero__stats {
  border-top: 1px solid rgba(255, 255, 255, 0.15) !important;
}
.sub-hero__stats span {
  color: var(--bg) !important;
  font-family: 'Archivo Black', sans-serif !important;
}
.sub-hero__stats em {
  color: rgba(245, 244, 241, 0.55) !important;
  font-family: 'Inter', sans-serif !important;
  font-style: normal !important;
  letter-spacing: 0.24em !important;
}

/* CTAs dentro del sub-hero (necesitan ser visibles sobre el negro) */
.sub-hero .btn--primary,
.sub-hero .btn--primary * {
  background: var(--bg) !important;
  color: var(--ink) !important;
  border: 1px solid var(--bg) !important;
}
.sub-hero .btn--primary span,
.sub-hero .btn--primary svg {
  color: var(--ink) !important;
  fill: var(--ink) !important;
}
.sub-hero .btn--primary:hover,
.sub-hero .btn--primary:hover * {
  background: transparent !important;
  color: var(--bg) !important;
}
.sub-hero .btn--primary:hover svg,
.sub-hero .btn--primary:hover span {
  color: var(--bg) !important;
  fill: var(--bg) !important;
}
.sub-hero .btn--ghost,
.sub-hero .btn--ghost-light,
.sub-hero .btn--ghost *,
.sub-hero .btn--ghost-light * {
  background: transparent !important;
  color: var(--bg) !important;
  border: 1px solid var(--bg) !important;
}
.sub-hero .btn--ghost:hover,
.sub-hero .btn--ghost-light:hover {
  background: var(--bg) !important;
  color: var(--ink) !important;
}
.sub-hero .btn--ghost:hover *,
.sub-hero .btn--ghost-light:hover * { color: var(--ink) !important; }

/* ── Sub-sections (en performance/physique) — fondo light coherente ── */
.sub-section { background: var(--bg) !important; color: var(--ink) !important; }
.sub-section .section__title { color: var(--ink) !important; }
.sub-section .section__title .muted {
  color: var(--muted) !important;
  font-weight: 900 !important;
}
.sub-section__lead { color: var(--muted) !important; }
.sub-point__num { color: var(--ink) !important; }
.sub-point h3 { color: var(--ink) !important; }
.sub-point p { color: var(--muted) !important; }
.sub-section__points { border-top: 1px solid var(--line) !important; }
.sub-point { border-bottom: 1px solid var(--line) !important; }

/* ── Disc-cards (grid de disciplinas con hover→dark) ──────────────── */
.disc-card {
  background: var(--bg-alt) !important;
  border: 1px solid var(--line) !important;
  border-radius: 0 !important;
  color: var(--ink) !important;
  transition: transform .5s ease, background .35s ease, color .35s ease, border-color .35s ease !important;
}
.disc-card *, .disc-card h3, .disc-card p, .disc-card .disc-card__num,
.disc-card .disc-card__tag {
  color: var(--ink) !important;
}
.disc-card .disc-card__num { color: var(--muted) !important; }
.disc-card .disc-card__tag {
  color: var(--muted) !important;
  border-top: 1px solid var(--line) !important;
  letter-spacing: 0.24em !important;
}

/* Hover dark — texto cream */
.disc-card:hover {
  background: var(--ink) !important;
  border-color: var(--ink) !important;
  transform: translateY(-6px) !important;
}
.disc-card:hover,
.disc-card:hover * { color: var(--bg) !important; }
.disc-card:hover .disc-card__num {
  color: rgba(245, 244, 241, 0.7) !important;
}
.disc-card:hover .disc-card__tag {
  color: rgba(245, 244, 241, 0.6) !important;
  border-top-color: rgba(255, 255, 255, 0.15) !important;
}

/* ── Capacities grid (sub-section--dark) ──────────────────────────── */
.cap-grid {
  border-top: 1px solid rgba(255, 255, 255, 0.12) !important;
}
.cap-grid > * {
  border-right: 1px solid rgba(255, 255, 255, 0.12) !important;
  color: var(--bg) !important;
}
.cap-grid h3, .cap-grid h4 { color: var(--bg) !important; }
.cap-grid p { color: rgba(245, 244, 241, 0.75) !important; }
.cap-grid .cap-num,
.cap-grid [class*="num"] {
  color: var(--bg) !important;
  font-family: 'Archivo Black', sans-serif !important;
}

/* ── Investment elite hover::before (era hardcoded #8B8782) ─────────── */
.investment__item--elite:hover::before {
  background: var(--ink) !important;
}

/* ── Página legal (aviso-legal, privacidad, cookies) ─────────────── */
/* La .legal section ya tiene un <style> inline con bg negro y texto cream.
   Si Carlos quiere convertirla a light, descomentaríamos esto. De momento
   mantenemos las legales con su look propio (no las tocamos). */

/* ═══════════════════════════════════════════════════════════════════════
   28 · TEXT RENDERING FIX · nitidez en headings sobre fondo oscuro
   macOS Safari por defecto usa subpixel-antialiased que añade halo RGB
   en texto claro sobre fondo oscuro. Forzamos antialiased para nitidez.
   ═══════════════════════════════════════════════════════════════════════ */

/* Global · antialiased en todo el body (afecta cualquier texto en dark) */
body, html {
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  text-rendering: optimizeLegibility !important;
}

/* Refuerzo específico en headings dentro de secciones oscuras */
.sub-section--dark,
.sub-section--dark *,
.method,
.method *,
.case-hero,
.case-hero *,
.sub-hero,
.sub-hero *,
.results__featured-body,
.results__featured-body *,
.div-card--performance,
.div-card--performance *,
.footer__cta,
.footer__cta *,
#cookie-banner,
#cookie-banner * {
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
}

/* Específicamente para titulares grandes (más visible la mejora) */
.sub-section--dark .section__title,
.method .section__title,
.case-hero__name,
.sub-hero__title,
.results__featured-name,
.div-card--performance .div-card__title,
.footer__cta-title,
.hero__title {
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  text-rendering: geometricPrecision !important;
  /* También resetea cualquier filter residual del motion-3d */
  filter: none !important;
  backface-visibility: hidden !important;
  transform-style: flat !important;
}

/* Cleanup de motion-3d después de la entrada — fuerza compositing limpio */
[data-m3-enter].is-in {
  will-change: auto !important;  /* libera capa GPU */
  transform: none !important;     /* sin perspective residual */
}
[data-m3-enter].is-in .section__title,
[data-m3-enter].is-in h1,
[data-m3-enter].is-in h2,
[data-m3-enter].is-in h3 {
  transform: none !important;
  filter: none !important;
}