/* ============================================================
   SmartBeat — overrides sobre el template "Fitrainer"
   Paleta: 071313 · 00C1C1 · 66B0B0 · 99B0B0 · DFE0E2
   El rojo (#DC1D24) y el rojo oscuro (#A3050B) ya se cambiaron
   a cyan/teal en style.css; aquí van los ajustes finos.
   ============================================================ */
:root{
  --sb-ink:#071313; --sb-cyan:#00C1C1; --sb-cyan-deep:#0A7F85;
  --sb-teal1:#66B0B0; --sb-teal2:#99B0B0; --sb-mist:#DFE0E2;
}

/* Botones cyan -> texto oscuro (mejor contraste que blanco sobre cyan) */
.btn-primary, a.btn-primary{ color:var(--sb-ink) !important; font-weight:600; }
.btn-primary:hover{ color:#fff !important; }

/* Acentos de precio/números sobre fondo blanco: cyan más profundo para que se lean */
.price-amount .secondary, .price-amount .h1, .funfact .secondary{ color:var(--sb-cyan-deep) !important; }

/* Logo real en la nav */
.header-left img{ height:34px; width:auto !important; }

/* Recolorear gráficos decorativos rojos (círculo, etiquetas) hacia cyan.
   OJO: el círculo y la etiqueta "exp" son background-image, no <img>. */
img[src*="circle-bg1"], img[src*="tag_red"]{ filter:hue-rotate(180deg) saturate(1.1); }
.circle-container .circle{ filter:hue-rotate(180deg) saturate(1.1); }
.index2 .about .about-exp{ filter:hue-rotate(180deg) saturate(1.1); }

/* Asegurar que la base oscura sea el teal de marca */
body.index2{ background-color:var(--sb-ink); }

/* Tira de confianza (texto en el marquee del "partner slider") */
.sb-trust-item{
  display:flex; align-items:center; justify-content:center; height:70px;
  padding:0 18px; text-align:center; color:#fff; font-weight:600;
  font-size:clamp(.85rem,1.1vw,1rem); line-height:1.25; letter-spacing:.02em;
  border:1px solid rgba(255,255,255,.28); border-radius:2px; min-height:70px;
}

/* Acordeón FAQ con acento de marca (Bootstrap usa azul por defecto) */
.sb-accordion .accordion-button{
  background:#fff; color:var(--sb-ink); box-shadow:none;
}
.sb-accordion .accordion-button:not(.collapsed){
  background:var(--sb-mist); color:var(--sb-ink);
}
.sb-accordion .accordion-button:focus{
  border-color:var(--sb-cyan); box-shadow:0 0 0 .2rem rgba(0,193,193,.25);
}
.sb-accordion .accordion-button:not(.collapsed)::after{
  filter:hue-rotate(180deg) saturate(2);
}
.sb-accordion .accordion-body{ color:#3a4a4a; line-height:1.7; }

/* Video de fondo del banner intermedio: por encima el overlay y el texto */
.video-banner .video-banner-inner .sb-bgvideo{ pointer-events:none; }
.video-banner .video-banner-inner .overlay{ z-index:1; }

/* Logo del footer un poco contenido */
.footer-top-left img{ max-height:40px; width:auto !important; }

/* --- Legibilidad: secciones oscuras (sin fondo propio) con título claro --- */
.about .about-right h2,
.faq .faq-title h2,
.location .location-title h2{ color:#fff !important; }
.about .about-right p{ color:var(--sb-mist) !important; }
.about .about-right .fst-italic{ color:var(--sb-mist) !important; }

/* Eyebrows cyan sobre secciones CLARAS: cyan más profundo para contraste AA */
.program .program-title-left h6,
.team .team-title h6,
.appointment .appointment-right h6{ color:var(--sb-cyan-deep) !important; }