/* =========================================================
   AMX SPORTS — PALETA MAESTRA ÚNICA
   Todas las páginas deben consumir únicamente estas variables.
   No definir colores nuevos en páginas individuales.
========================================================= */
:root{
  /* 1. COLOR PRINCIPAL DE TEXTO */
  --color-text:#111111;
  /* 2. FONDO PRINCIPAL */
  --color-bg:#F4F5F3;
  /* 3. TEXTO SECUNDARIO */
  --color-text-secondary:#4B5A56;

  /* Identidad */
  --color-brand:#0B2D29;
  --color-brand-hover:#0B2D29;
  --color-on-brand:#FFFFFF;

  /* Superficie */
  --color-surface:#FFFFFF;
  --color-border:#D8DEDB;
  --color-muted:#68746F;

  /* Estados y transparencias: derivados de la misma paleta */
  --color-brand-08:rgba(11,45,41,.08);
  --color-brand-14:rgba(11,45,41,.14);
  --color-brand-18:rgba(11,45,41,.18);
  --color-white-08:rgba(255,255,255,.08);
  --color-white-10:rgba(255,255,255,.10);
  --color-white-12:rgba(255,255,255,.12);
  --color-white-16:rgba(255,255,255,.16);
  --color-white-18:rgba(255,255,255,.18);
  --color-white-25:rgba(255,255,255,.25);
  --color-black-25:rgba(17,17,17,.25);
}

/* Base */
html,body{background:var(--color-bg)!important;color:var(--color-text)!important}
body{--jade:var(--color-brand);--jade2:var(--color-brand);--jade3:var(--color-text);--ink:var(--color-text);--soft:var(--color-bg)}

a{color:inherit}
p{color:var(--color-text-secondary)}

/* Elementos de marca: ÚNICO verde */
.site-header,.hero,.dark,.contact,.cta-strip,footer,
.project-card,.project-card.featured,.primary,.featured,.ticker,
.nav,.mobile-nav,.menu,.site-footer,.contact-card,
.primary-office,.amx-purpose,.amx-contact{background-color:var(--color-brand)!important;background-image:none!important;color:var(--color-on-brand)!important}

.site-header *, .hero *, .dark *, .contact *, .cta-strip *, footer *,
.project-card *, .site-footer *, .contact-card *, .primary-office *,
.amx-purpose *, .amx-contact *{color:var(--color-on-brand)!important}

/* Fondos claros */
.section,.values,.locations,.ecosystem,.news,.sponsors,.story,
.white,.light,.light-section,.amx-home-directory{background:var(--color-bg)!important;color:var(--color-text)!important}

.cards article,.location-grid article,.partner-grid article,.news-grid article,
.form,.legal-article,.legal-nav,.amx-directory-card,
.surface,.card,.box,.panel-light{background:var(--color-surface)!important;color:var(--color-text)!important;border-color:var(--color-border)!important}

/* Textos */
.section p,.values p,.locations p,.ecosystem p,.news p,.sponsors p,.story p,
.cards p,.service-list p,.location-grid p,.partner-grid p,.amx-directory-card p,
small,.muted,.secondary,.description{color:var(--color-text-secondary)!important}

/* Títulos en fondos claros */
.section h1,.section h2,.section h3,.values h1,.values h2,.values h3,
.locations h1,.locations h2,.locations h3,.ecosystem h1,.ecosystem h2,.ecosystem h3,
.news h1,.news h2,.news h3,.sponsors h1,.sponsors h2,.sponsors h3,
.story h1,.story h2,.story h3,.amx-home-directory h1,.amx-home-directory h2,
.amx-home-directory h3{color:var(--color-text)!important}

/* Enlaces y botones */
.btn.primary,.primary,.darkbtn,.chat-open-btn{background:var(--color-brand)!important;color:var(--color-on-brand)!important;border-color:var(--color-brand)!important}
.btn.ghost{background:transparent!important;color:var(--color-on-brand)!important;border-color:var(--color-white-25)!important}

/* Bordes */
.cards article,.location-grid article,.partner-grid article,.form,
.service-list,.statement,.amx-directory-card{border-color:var(--color-border)!important}

/* Formularios */
input,select,textarea{color:inherit!important;border-color:var(--color-border)!important;background:transparent!important}
option{background:var(--color-surface)!important;color:var(--color-text)!important}

/* Elimina acentos de colores anteriores y los lleva al jade único */
[style*="#168B78"],[style*="#168b78"],[style*="#123B36"],[style*="#123b36"],
[style*="#075B58"],[style*="#075b58"],[style*="#063F39"],[style*="#063f39"],
[style*="#0B2925"],[style*="#0b2925"],[style*="#103B34"],[style*="#103b34"],
[style*="#176F60"],[style*="#176f60"],[style*="#1B5A50"],[style*="#1b5a50"],
[style*="#20A783"],[style*="#20a783"],[style*="#2CC4A4"],[style*="#2cc4a4"],
[style*="#B7E600"],[style*="#b7e600"],[style*="#E7B64A"],[style*="#e7b64a"],
[style*="#164A83"],[style*="#1746A2"],[style*="#a87919"]{color:var(--color-brand)!important}

/* Cuando el elemento tiene fondo de marca, conservar contraste */
[style*="background:#168B78"],[style*="background:#168b78"],
[style*="background:#123B36"],[style*="background:#123b36"],
[style*="background:#075B58"],[style*="background:#075b58"]{background:var(--color-brand)!important;color:var(--color-on-brand)!important}

/* Swatches/documentación de marca: también usan la paleta maestra */
.l7-swatch-color{background:var(--color-brand)!important}

/* Responsive común */
img,video,svg{max-width:100%;height:auto}
iframe{max-width:100%}
*,*::before,*::after{min-width:0}
@media(max-width:900px){
  .site-footer .footer-main{grid-template-columns:1fr 1fr!important;gap:30px!important}
  .site-footer .footer-bottom{flex-direction:column!important;align-items:flex-start!important}
  .nav{max-width:100vw;overflow-x:hidden}
}
@media(max-width:600px){
  .site-footer .footer-main{grid-template-columns:1fr!important}
  .site-footer{padding:55px 6vw 22px!important}
  .form-grid{grid-template-columns:1fr!important}
}


/* =========================================================
   AMX SPORTS — PALETA FINAL UNIFICADA
   Verde petróleo único: #123B36
   Fondo general: blanco
   Texto general: negro
   En superficies verdes: texto blanco
========================================================= */

:root{
  --color-brand:#123B36;
  --color-brand-hover:#123B36;
  --color-on-brand:#FFFFFF;
  --color-text:#111111;
  --color-bg:#FFFFFF;
  --color-text-secondary:#111111;
  --color-surface:#FFFFFF;
  --color-border:#D9DEDC;
  --color-muted:#111111;

  --amx-jade:#123B36;
  --amx-jade-dark:#123B36;
  --amx-jade-mid:#123B36;
  --jade:#123B36;
  --jade2:#123B36;
  --jade3:#111111;
  --ink:#111111;
  --soft:#FFFFFF;
}

/* Base: blanco + texto negro */
html,
body{
  background:#FFFFFF!important;
  color:#111111!important;
}

body,
p,
li,
label,
td,
th,
small,
.muted,
.secondary,
.description{
  color:#111111;
}

/* =========================================================
   HEADER Y FOOTER — VERDE PETRÓLEO ÚNICO
========================================================= */
.site-header,
.site-footer,
footer{
  background:#123B36!important;
  background-image:none!important;
  color:#FFFFFF!important;
}

.site-header *,
.site-footer *,
footer *{
  color:#FFFFFF!important;
}

.site-header a:hover,
.site-footer a:hover,
footer a:hover{
  color:#FFFFFF!important;
}

/* =========================================================
   SECCIONES NORMALES — BLANCO + TEXTO NEGRO
========================================================= */
.section,
.values,
.locations,
.ecosystem,
.news,
.sponsors,
.story,
.white,
.light,
.light-section,
.amx-home-directory{
  background:#FFFFFF!important;
  color:#111111!important;
}

.section *,
.values *,
.locations *,
.ecosystem *,
.news *,
.sponsors *,
.story *,
.white *,
.light *,
.light-section *,
.amx-home-directory *{
  color:#111111;
}

/* Tarjetas sobre fondo blanco */
.cards article,
.location-grid article,
.partner-grid article,
.news-grid article,
.form,
.legal-article,
.legal-nav,
.amx-directory-card,
.surface,
.card,
.box,
.panel-light{
  background:#FFFFFF!important;
  color:#111111!important;
  border-color:#D9DEDC!important;
}

/* =========================================================
   BLOQUES VERDES — SIEMPRE #123B36 + TEXTO BLANCO
========================================================= */
.hero,
.dark,
.contact,
.ticker,
.cta-strip,
.project-card,
.project-card.featured,
.league-prizes div,
.primary-office,
.amx-purpose,
.amx-contact,
.soon{
  background:#123B36!important;
  background-image:none!important;
  color:#FFFFFF!important;
}

.hero *,
.dark *,
.contact *,
.ticker *,
.cta-strip *,
.project-card *,
.league-prizes div *,
.primary-office *,
.amx-purpose *,
.amx-contact *,
.soon *{
  color:#FFFFFF!important;
}

/* Botones de marca */
.primary,
.btn.primary,
.darkbtn,
.featured,
.chat-open-btn{
  background:#123B36!important;
  color:#FFFFFF!important;
  border-color:#123B36!important;
}

/* Botón transparente sobre fondo verde */
.ghost,
.btn.ghost{
  color:#FFFFFF!important;
  border-color:rgba(255,255,255,.55)!important;
  background:transparent!important;
}

/* =========================================================
   ELIMINAR TONOS VERDES ALTERNOS, VERDES CLAROS Y BEIGE
   Solo se conserva #123B36 como verde de marca.
========================================================= */

/* Fondos claros alternos */
[style*="#F4F1E8"],
[style*="#f4f1e8"],
[style*="#F4F5F3"],
[style*="#f4f5f3"],
[style*="#F4F7F3"],
[style*="#f4f7f3"],
[style*="#edf3ef"],
[style*="#EDF3EF"],
[style*="#F5F7F6"],
[style*="#f5f7f6"]{
  background:#FFFFFF!important;
}

/* Cualquier bloque que declare uno de los verdes antiguos como fondo */
[style*="#168B78"],[style*="#168b78"],
[style*="#075B58"],[style*="#075b58"],
[style*="#063F39"],[style*="#063f39"],
[style*="#0B2925"],[style*="#0b2925"],
[style*="#103B34"],[style*="#103b34"],
[style*="#176F60"],[style*="#176f60"],
[style*="#1B5A50"],[style*="#1b5a50"],
[style*="#20A783"],[style*="#20a783"],
[style*="#2CC4A4"],[style*="#2cc4a4"]{
  background:#123B36!important;
  color:#FFFFFF!important;
}

/* El contenido de esos bloques también queda blanco */
[style*="#168B78"] *,
[style*="#168b78"] *,
[style*="#075B58"] *,
[style*="#075b58"] *,
[style*="#063F39"] *,
[style*="#063f39"] *,
[style*="#0B2925"] *,
[style*="#0b2925"] *,
[style*="#103B34"] *,
[style*="#103b34"] *,
[style*="#176F60"] *,
[style*="#176f60"] *,
[style*="#1B5A50"] *,
[style*="#1b5a50"] *,
[style*="#20A783"] *,
[style*="#20a783"] *,
[style*="#2CC4A4"] *,
[style*="#2cc4a4"] *{
  color:#FFFFFF!important;
}

/* Acentos antiguos: negro sobre blanco; blanco sobre bloques verdes */
.hero h1 span,
.hero em,
.story-number,
.event-details strong,
.news-grid small,
.feature-logo,
.office-index,
.office-role,
.amx-cookie-kicker{
  color:#111111!important;
}

.dark .hero h1 span,
.dark em,
.dark .story-number,
.dark .event-details strong,
.dark .news-grid small,
.dark .feature-logo,
.dark .office-index,
.dark .office-role,
.dark .amx-cookie-kicker,
.hero h1 span,
.hero em{
  color:#FFFFFF!important;
}

/* Formularios */
input,
select,
textarea{
  color:#111111!important;
  background:#FFFFFF!important;
  border-color:#D9DEDC!important;
}

.dark input,
.dark select,
.dark textarea,
.contact input,
.contact select,
.contact textarea{
  color:#FFFFFF!important;
  background:rgba(255,255,255,.06)!important;
  border-color:rgba(255,255,255,.35)!important;
}

option{
  background:#FFFFFF!important;
  color:#111111!important;
}

/* No permitir colores de hover distintos */
a:hover{
  color:#123B36;
}
.site-header a:hover,
.site-footer a:hover,
footer a:hover,
.dark a:hover,
.contact a:hover,
.hero a:hover{
  color:#FFFFFF;
}
