/*
 * Sistema de diseño · rebranding 2026 (Murcia Fibra, Almería Fibra, Fibra Medios Telecom)
 * Capa que va DESPUÉS de main.css y de los estilos de los shortcodes.
 * Solo estilos: no cambia textos ni estructura. Para desactivarla, quitar el enqueue
 * 'fm-design-system' en functions/brand-assets.php.
 * Referencia: ANALISIS-DISENO-2026-11-10.md
 */

/* ---------- Fuentes (alojadas en el tema, sin Google Fonts) ---------- */
@font-face {
  font-family: "Outfit";
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url("../assets/fonts/outfit-latin.woff2") format("woff2");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("../assets/fonts/inter-latin.woff2") format("woff2");
}

/* ---------- Tokens ---------- */
:root {
  --ds-red: #D41235;
  --ds-red-hover: #B80D2B;
  --ds-red-tint: #FCEBEE;
  --ds-lemon: #FACC15;
  --ds-lemon-deep: #EAB308;
  --ds-ink: #060606;
  --ds-ink-2: #5B5F66;
  --ds-line: #E7E7EA;
  --ds-bg: #FFFFFF;
  --ds-bg-soft: #F6F6F6;

  --ds-font-head: "Outfit", system-ui, -apple-system, "Segoe UI", sans-serif;
  --ds-font-body: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;

  --ds-fs-xs: 14px;
  --ds-fs-sm: 16px;
  --ds-fs-md: 20px;
  --ds-fs-lg: 28px;
  --ds-fs-xl: 40px;
  --ds-fs-2xl: clamp(40px, 5.2vw, 72px);

  --ds-radius-card: 16px;
  --ds-radius-pill: 999px;
  --ds-shadow: 0 8px 24px -8px rgba(6, 6, 6, .12);
  --ds-ease: cubic-bezier(.2, .7, .2, 1);
}

/* ---------- Base tipográfica ---------- */
html body,
html body .elementor-widget-text-editor,
html body .elementor-widget-text-editor p,
html body p,
html body li,
html body input,
html body textarea,
html body select,
html body button {
  font-family: var(--ds-font-body) !important;
}
html body { color: var(--ds-ink); -webkit-font-smoothing: antialiased; }

html body h1, html body h2, html body h3, html body h4,
html body .elementor-heading-title,
html body .elementskit-section-title,
html body .fm-hero-h1,
html body .fm-card-title,
html body .fm-card-price,
html body .fm-feature-title,
html body .fm-resenas-title {
  font-family: var(--ds-font-head) !important;
  letter-spacing: -0.01em;
}

/* Títulos de sección: un solo estilo (sin versales gritonas) */
html body .elementor-widget-heading h2.elementor-heading-title,
html body .fm-resenas-title {
  font-size: var(--ds-fs-xl) !important;
  font-weight: 800 !important;
  line-height: 1.1 !important;
  text-transform: none !important;
  color: var(--ds-ink);
}
html body .fm-resenas-subtitle {
  font-family: var(--ds-font-body) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: .14em !important;
  text-transform: uppercase;
  color: var(--ds-red) !important;
}

/* ---------- Botones: un primario y un secundario ---------- */
html body .elementor-button,
html body .fm-cta-primary,
html body .fm-cta-secondary,
html body .fm-card-button {
  font-family: var(--ds-font-body) !important;
  font-weight: 600 !important;
  font-size: var(--ds-fs-sm) !important;
  letter-spacing: 0 !important;
  border-radius: var(--ds-radius-pill) !important;
  min-height: 48px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  box-shadow: none !important;
  transition: background-color .2s var(--ds-ease), color .2s var(--ds-ease), border-color .2s var(--ds-ease), transform .2s var(--ds-ease) !important;
}
html body .fm-cta-primary,
html body .fm-card-button {
  background: var(--ds-red) !important;
  color: #fff !important;
}
html body .fm-cta-primary:hover,
html body .fm-card-button:hover { background: var(--ds-red-hover) !important; }
html body .fm-cta-secondary {
  background: #fff !important;
  color: var(--ds-ink) !important;
  border: 1.5px solid var(--ds-line) !important;
}
html body .fm-cta-secondary:hover { border-color: var(--ds-ink) !important; }
html body .elementor-button:focus-visible,
html body .fm-cta-primary:focus-visible,
html body .fm-cta-secondary:focus-visible,
html body .fm-card-button:focus-visible,
html body a:focus-visible {
  outline: 2px solid var(--ds-red);
  outline-offset: 3px;
}

/* ---------- Cabecera ---------- */
html body .elementskit-navbar-nav > li > .ekit-menu-nav-link {
  font-family: var(--ds-font-body) !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  color: var(--ds-ink) !important;
}
html body .elementskit-navbar-nav > li > .ekit-menu-nav-link:hover { color: var(--ds-red) !important; }
html body .elementor-location-header .fm-brand-svg-logo {
  max-height: 48px !important;
  min-width: 132px;
}
/* «Área clientes» pasa a secundario para que el teléfono sea la única pastilla roja */
html body a.elementor-button[href*="clientes."] {
  background: transparent !important;
  color: var(--ds-ink) !important;
  border: 1.5px solid var(--ds-line) !important;
}
html body a.elementor-button[href*="clientes."]:hover { border-color: var(--ds-ink) !important; }

/* Aviso de cookies con la tipografía de la marca */
html body .cmplz-cookiebanner,
html body .cmplz-cookiebanner * { font-family: var(--ds-font-body) !important; }

/* ---------- Hero ---------- */
html body .fm-bespoke-hero .fm-hero-h1 {
  font-size: var(--ds-fs-2xl) !important;
  font-weight: 800 !important;
  line-height: 1.02 !important;
  letter-spacing: -0.02em !important;
  text-transform: none !important;
  color: var(--ds-ink) !important;
}
html body .fm-bespoke-hero .fm-hero-gradient-text {
  color: var(--ds-red) !important;
  background: none !important;
  -webkit-text-fill-color: var(--ds-red) !important;
}
html body .fm-hero-social-proof {
  font-size: var(--ds-fs-xs) !important;
  color: var(--ds-ink-2) !important;
}
html body .fm-hero-social-proof strong { color: var(--ds-ink); }
html body .fm-stars-row,
html body .fm-ha-rating .s { color: var(--ds-lemon, #FACC15) !important; }
/* Que el titular no quede debajo de la cabecera fija en móvil */
@media (max-width: 767px) {
  /* la cabecera fija mide 68 px en móvil */
  html body .fm-bespoke-hero { padding-top: 92px !important; }
  html body .elementor-location-header .elementor-button { min-height: 40px; font-size: 15px !important; }
  html body .fm-bespoke-hero .fm-hero-h1 { font-size: 44px !important; }
  html body .fm-hero-col-visual { min-height: 320px; }
}

/* ---------- Tarifas ---------- */
html body .fm-card-container {
  border-radius: var(--ds-radius-card) !important;
  box-shadow: var(--ds-shadow) !important;
  border: 0 !important;
  height: 100%;
}
html body .fm-card-content { display: flex; flex-direction: column; height: 100%; }
html body .fm-card-title {
  font-size: var(--ds-fs-md) !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  min-height: 2.4em;           /* títulos de 1 y 2 líneas alineados */
  display: flex; align-items: flex-end; justify-content: center;
  color: var(--ds-ink) !important;
}
html body .fm-card-desc {
  font-size: var(--ds-fs-xs) !important;
  line-height: 1.45 !important;
  color: var(--ds-ink-2) !important;
}
html body .fm-card-price {
  font-weight: 800 !important;
  letter-spacing: -0.03em !important;
  color: var(--ds-red) !important;
}
html body .fm-card-period,
html body .fm-card-footer { color: var(--ds-ink-2) !important; }
html body .fm-card-footer { margin-top: auto; }
html body .fm-card-badge {
  font-family: var(--ds-font-body) !important;
  background: #FDD207 !important;   /* amarillo de marca, letras rojas */
  color: var(--ds-red) !important;
  border: 0 !important;
  border-radius: var(--ds-radius-pill) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: .06em !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25) !important;
}

/* ---------- Ventajas ---------- */
html body .fm-feature-card {
  border-radius: var(--ds-radius-card) !important;
  border: 1px solid var(--ds-line) !important;
  box-shadow: none !important;
  background: #fff !important;
}
html body .fm-feature-card:hover { border-color: var(--ds-red) !important; transform: none !important; }
html body .fm-feature-icon-wrapper {
  background: transparent !important;
  color: var(--ds-red) !important;
  width: auto !important; height: auto !important;
  justify-content: flex-start !important;
}
html body .fm-feature-title {
  font-size: var(--ds-fs-md) !important;
  font-weight: 700 !important;
  text-transform: none !important;
  letter-spacing: -0.01em !important;
}
html body .fm-feature-desc {
  font-size: var(--ds-fs-xs) !important;
  line-height: 1.5 !important;
  color: var(--ds-ink-2) !important;
}

/* ---------- Reseñas: colores de marca ---------- */
html body .fm-testimonial-card {
  border-radius: var(--ds-radius-card) !important;
  border: 1px solid var(--ds-line) !important;
  box-shadow: none !important;
}
html body .fm-avatar-letter {
  background: var(--ds-red-tint) !important;
  color: var(--ds-red) !important;
  font-family: var(--ds-font-head) !important;
  font-weight: 700 !important;
}
html body .fm-card-stars { color: var(--ds-lemon, #FACC15) !important; }
html body .fm-verified-badge {
  background: var(--ds-bg-soft) !important;
  color: var(--ds-ink-2) !important;
}
html body .fm-verified-badge svg { color: var(--ds-ink-2) !important; stroke: currentColor; }
html body .fm-card-name { font-family: var(--ds-font-head) !important; font-weight: 700 !important; }
html body .fm-card-text { font-size: 15px !important; line-height: 1.5 !important; color: var(--ds-ink) !important; }
@media (max-width: 767px) {
  html body .fm-card-name { font-size: 16px !important; line-height: 1.2 !important; }
}

/* ---------- Menú móvil: blanco, no gris oscuro ---------- */
@media (max-width: 1024px) {
  html body .elementskit-menu-container,
  html body .elementskit-menu-offcanvas-elements {
    background: #fff !important;
  }
  html body .elementskit-navbar-nav > li > .ekit-menu-nav-link {
    color: var(--ds-ink) !important;
    font-family: var(--ds-font-head) !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    text-transform: none !important;
  }
}

/* ---------- Movimiento: el contenido nunca espera a la animación ---------- */
/* Animaciones de entrada de Elementor (fadeInUp, fadeInRight…): eran de 1,25 s, con
   deslizamientos laterales y el contenido invisible hasta que saltaban. Ahora: el
   contenido se ve siempre y solo sube 14 px en 0,6 s, sin tocar la opacidad
   (así no hay huecos en blanco ni parpadeo). */
html body .elementor-invisible { visibility: visible !important; }
html body .elementor-element.animated:is(.fadeIn, .fadeInUp, .fadeInDown, .fadeInLeft, .fadeInRight, .zoomIn, .slideInUp, .slideInLeft, .slideInRight) {
  animation: fmRise .6s cubic-bezier(.2, .7, .2, 1) both !important;
}
@keyframes fmRise { from { transform: translate3d(0, 14px, 0); } to { transform: none; } }
@media (prefers-reduced-motion: reduce) {
  html body .animated, html body [class*="fm-marquee-row"] { animation: none !important; transition: none !important; }
}

/* Reseñas en móvil (y con movimiento reducido): fila que se desliza con el dedo */
html body .fm-marquee-container.fm-marquee-static {
  -webkit-mask-image: none !important;
  mask-image: none !important;
  overflow-x: auto !important;
  scroll-snap-type: x mandatory;
  scroll-padding-inline: 20px;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding: 4px 0 12px;
}
html body .fm-marquee-container.fm-marquee-static::-webkit-scrollbar { display: none; }
html body .fm-marquee-static .fm-marquee-row {
  transform: none !important;
  display: flex !important;
  gap: 12px;
  padding: 0 20px;
  width: max-content;
}
html body .fm-marquee-static .fm-testimonial-card {
  scroll-snap-align: start;
  width: 82vw !important;
  max-width: 340px !important;
  margin: 0 !important;
}
html body .fm-marquee-static .fm-card-text { -webkit-line-clamp: 8 !important; }

/* ---------- Tarifas: qué incluye y tarjeta recomendada ---------- */
html body .fm-card-note {
  display: block;
  margin-top: 4px;
  font-size: 13px;
  font-weight: 500;
  color: var(--ds-ink-2);
}
html body .fm-card-includes {
  list-style: none;
  margin: 14px auto 0;
  padding: 14px 0 0;
  border-top: 1px solid var(--ds-line);
  display: none;              /* solo en pantallas anchas: en móvil van 2 tarjetas por fila */
  text-align: left;
  width: fit-content;
}
html body .fm-card-includes li {
  position: relative;
  padding-left: 24px;
  margin: 6px 0;
  font-size: 14px;
  color: var(--ds-ink);
}
html body .fm-card-includes li::before {
  content: "";
  position: absolute;
  left: 0; top: 4px;
  width: 14px; height: 8px;
  border-left: 2px solid var(--ds-red);
  border-bottom: 2px solid var(--ds-red);
  transform: rotate(-45deg);
}
@media (min-width: 1025px) {
  html body .fm-card-includes { display: block; }
  html body .fm-card-includes + * { margin-top: 0; }
  html body .fm-card-container .fm-card-note { display: none; }
}
html body .fm-card--featured {
  outline: 3.5px solid #FDD207 !important;
  outline-offset: -3.5px !important;
  border-color: #FDD207 !important;
}
html body .fm-card-container { position: relative; }
html body .fm-card--featured .fm-card-badge {
  position: absolute !important;
  top: 0 !important; left: 50% !important; right: auto !important;
  transform: translate(-50%, -50%) !important;
  padding: 6px 16px !important;
  background: #FDD207 !important;
  color: var(--ds-red) !important;
  border: 0 !important;
  font-weight: 800 !important;
  letter-spacing: .06em !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25) !important;
  white-space: nowrap;
  z-index: 2;
}

/* ---------- Cobertura: el mapa se queda, el texto va en un panel blanco ---------- */
html body .elementor-top-section:has(#map) .elementor-inner-section .elementor-inner-column:first-child > .elementor-widget-wrap {
  background: #fff;
  border-radius: var(--ds-radius-card);
  box-shadow: 0 16px 40px -12px rgba(6, 6, 6, .35);
  padding: 28px 32px !important;
  margin: 24px 0;
  max-width: 460px;
}
/* El buscador va por encima del panel, alineado con su texto */
html body .elementor-top-section:has(#map) .elementor-widget:has(#map) { z-index: auto !important; }
/* el hueco reservado (widget HTML vacío) queda bajo el texto: el buscador va ahí */
html body .elementor-top-section:has(#map) .mapboxgl-ctrl-top-right { z-index: 3 !important; top: 278px !important; }
@media (min-width: 1141px) {
  html body .elementor-top-section:has(#map) .mapboxgl-ctrl-top-right {
    left: calc((100vw - 1140px) / 2 + 32px) !important;
  }
}
html body .elementor-top-section:has(#map) .elementor-inner-column:first-child h2,
html body .elementor-top-section:has(#map) .elementor-inner-column:first-child p,
html body .elementor-top-section:has(#map) .elementor-inner-column:first-child .elementor-widget-text-editor {
  color: var(--ds-ink) !important;
}
html body .elementor-top-section:has(#map) .elementor-inner-column:first-child h2 {
  font-size: var(--ds-fs-lg) !important;
}
html body .elementor-top-section:has(#map) .elementor-inner-column:first-child p {
  font-size: 15px !important;
  line-height: 1.5 !important;
  color: var(--ds-ink-2) !important;
}
html body .mapboxgl-ctrl-geocoder {
  border-radius: var(--ds-radius-pill) !important;
  box-shadow: 0 0 0 1.5px var(--ds-line) !important;
  min-width: min(400px, calc(100vw - 48px)) !important;
}
html body .mapboxgl-ctrl-geocoder--input {
  height: 52px !important;
  font-size: 16px !important;   /* 16 px evita el zoom automático de iOS */
  padding-left: 44px !important;
  border-radius: var(--ds-radius-pill) !important;
}
html body .mapboxgl-ctrl-geocoder--icon-search { top: 15px !important; left: 14px !important; }
@media (max-width: 767px) {
  html body .elementor-top-section:has(#map) .elementor-inner-section .elementor-inner-column:first-child > .elementor-widget-wrap {
    margin: 16px;
    padding: 22px !important;
  }
  html body .elementor-top-section:has(#map) .mapboxgl-ctrl-top-right {
    left: 38px !important;
    right: 38px !important;
    width: auto !important;
    top: 300px !important;
  }
  html body .elementor-top-section:has(#map) .mapboxgl-ctrl-geocoder {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
  }
}
html body .fm-stars-row .fm-stars-empty { color: var(--ds-line) !important; }

/* =====================================================================
 * SUBPÁGINAS: una sola plantilla (fondo blanco, cabecera clara, rojo
 * solo en las secciones que tienen fondo propio).
 * El rojo de fondo venía de .row-fluid (ajustes de Elementor), y las
 * secciones sin fondo dejaban ver ese rojo.
 * ===================================================================== */
html body:not(.home) #primary,
html body:not(.home) .row-fluid { background-color: var(--ds-bg) !important; }

/* Texto de las secciones SIN fondo propio: oscuro sobre blanco */
html body:not(.home) [data-elementor-type="wp-page"] > .elementor-section:not([data-settings*="background_background"]) :is(h1, h2, h3, h4, h5, .elementor-heading-title) {
  color: var(--ds-ink) !important;
  text-shadow: none !important;
}
html body:not(.home) [data-elementor-type="wp-page"] > .elementor-section:not([data-settings*="background_background"]) :is(p, li, label, span:not(.elementor-button-text):not(.elementor-button-content-wrapper), .elementor-text-editor, .elementor-widget-text-editor, .elementor-tab-title, .elementor-tab-content, .elementor-toggle-title, .elementor-icon-list-text, .elementor-field-option label) {
  color: var(--ds-ink-2) !important;
  text-shadow: none !important;
}
html body:not(.home) [data-elementor-type="wp-page"] > .elementor-section:not([data-settings*="background_background"]) :is(strong, b, .elementor-tab-title, .elementor-toggle-title, .elementor-accordion-title) {
  color: var(--ds-ink) !important;
}
html body:not(.home) [data-elementor-type="wp-page"] > .elementor-section:not([data-settings*="background_background"]) a:not(.elementor-button):not([class*="fm-"]) {
  color: var(--ds-red) !important;
}

/* Cabecera de subpágina (1.ª sección con altura mínima: «Tarifas», «Servicios», «Contáctanos»…) */
html body:not(.home) [data-elementor-type="wp-page"] > .elementor-section:first-child:is(.elementor-section-height-min-height, :not(:has(form, img, iframe, .elementor-widget-text-editor, .elementor-widget-shortcode, .elementor-widget-html, .elementor-widget-image))) {
  background: var(--ds-bg-soft) !important;
  background-image: none !important;
  min-height: 0 !important;
  padding: 56px 0 48px !important;
  border-bottom: 1px solid var(--ds-line);
}
html body:not(.home) [data-elementor-type="wp-page"] > .elementor-section:first-child:is(.elementor-section-height-min-height, :not(:has(form, img, iframe, .elementor-widget-text-editor, .elementor-widget-shortcode, .elementor-widget-html, .elementor-widget-image))) > .elementor-background-overlay { display: none !important; }
html body:not(.home) [data-elementor-type="wp-page"] > .elementor-section:first-child:is(.elementor-section-height-min-height, :not(:has(form, img, iframe, .elementor-widget-text-editor, .elementor-widget-shortcode, .elementor-widget-html, .elementor-widget-image))) > .elementor-container { min-height: 0 !important; }
html body:not(.home) [data-elementor-type="wp-page"] > .elementor-section:first-child:is(.elementor-section-height-min-height, :not(:has(form, img, iframe, .elementor-widget-text-editor, .elementor-widget-shortcode, .elementor-widget-html, .elementor-widget-image))) :is(h1, h2, .elementor-heading-title) {
  color: var(--ds-ink) !important;
  font-size: clamp(36px, 4.4vw, 56px) !important;
  font-weight: 800 !important;
  line-height: 1.05 !important;
  letter-spacing: -0.02em !important;
  text-transform: none !important;
  font-style: normal !important;
  text-shadow: none !important;
}
html body:not(.home) [data-elementor-type="wp-page"] > .elementor-section:first-child:is(.elementor-section-height-min-height, :not(:has(form, img, iframe, .elementor-widget-text-editor, .elementor-widget-shortcode, .elementor-widget-html, .elementor-widget-image))) :is(p, a, span, li, .elementor-widget-text-editor, .rank-math-breadcrumb) {
  color: var(--ds-ink-2) !important;
  font-size: 14px !important;
  text-shadow: none !important;
}
html body:not(.home) [data-elementor-type="wp-page"] > .elementor-section:first-child:is(.elementor-section-height-min-height, :not(:has(form, img, iframe, .elementor-widget-text-editor, .elementor-widget-shortcode, .elementor-widget-html, .elementor-widget-image))) a:hover { color: var(--ds-red) !important; }

/* Acordeones y desplegables (FAQ) sobre blanco */
html body:not(.home) :is(.elementor-accordion-item, .elementor-toggle-item) {
  border: 0 !important;
  border-bottom: 1px solid var(--ds-line) !important;
}
html body:not(.home) :is(.elementor-accordion, .elementor-toggle) :is(.elementor-tab-title, .elementor-tab-content) {
  border: 0 !important;
  background: transparent !important;
}
html body:not(.home) :is(.elementor-accordion, .elementor-toggle) .elementor-tab-title {
  font-family: var(--ds-font-head) !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  padding: 20px 0 !important;
}
html body:not(.home) :is(.elementor-accordion, .elementor-toggle) .elementor-tab-title :is(i, svg) { color: var(--ds-red) !important; fill: var(--ds-red) !important; }

/* Formularios: campos claros con borde y foco visible */
html body .elementor-form :is(input:not([type=checkbox]):not([type=radio]):not([type=submit]), textarea, select) {
  background: #fff !important;
  border: 1.5px solid var(--ds-line) !important;
  border-radius: 12px !important;
  min-height: 48px;
  font-size: 16px !important;
  color: var(--ds-ink) !important;
  transition: border-color .2s var(--ds-ease), box-shadow .2s var(--ds-ease);
}
html body .elementor-form :is(input, textarea, select):focus {
  border-color: var(--ds-red) !important;
  box-shadow: 0 0 0 4px rgba(212, 18, 53, .12) !important;
  outline: none !important;
}
html body .elementor-form ::placeholder { color: #8A8E95 !important; }

/* Secciones con fondo propio que usaban el rojo antiguo (#CF0904) */
html body [data-elementor-type="wp-page"] .elementor-section[data-settings*="background_background"]:is([style*="207, 9, 4"], [style*="#CF0904"], [style*="#cf0904"]) { background-color: var(--ds-red) !important; }

/* Entradas del blog: lectura cómoda */
html body.single-post :is(.the-content, .elementor-widget-theme-post-content) :is(p, li) {
  font-size: 17px !important;
  line-height: 1.7 !important;
  color: #2A2D33 !important;
  max-width: 70ch;
}
html body.single-post :is(.the-content, .elementor-widget-theme-post-content) :is(h2, h3) {
  margin-top: 1.6em !important;
  color: var(--ds-ink) !important;
}

/* =====================================================================
 * ANIMACIONES DE BOTONES
 * Rápidas (160–220 ms), solo transform/opacidad/sombra, sin rebotes.
 * ===================================================================== */
html body :is(.elementor-button, .fm-cta-primary, .fm-cta-secondary, .fm-card-button, .elementor-form [type=submit]) {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  will-change: transform;
  transition:
    transform .2s var(--ds-ease),
    box-shadow .2s var(--ds-ease),
    background-color .2s var(--ds-ease),
    color .2s var(--ds-ease),
    border-color .2s var(--ds-ease) !important;
}
/* Brillo que cruza el botón al pasar el ratón */
html body :is(.fm-cta-primary, .fm-card-button, .elementor-button:not([href*="clientes."]), .elementor-form [type=submit])::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,.28) 50%, transparent 70%);
  transform: translateX(-120%);
  transition: transform .6s var(--ds-ease);
  pointer-events: none;
}
@media (hover: hover) {
  html body :is(.fm-cta-primary, .fm-card-button, .elementor-button:not([href*="clientes."]), .elementor-form [type=submit]):hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 24px -12px rgba(212, 18, 53, .7) !important;
  }
  html body :is(.fm-cta-primary, .fm-card-button, .elementor-button:not([href*="clientes."]), .elementor-form [type=submit]):hover::after { transform: translateX(120%); }
  html body :is(.fm-cta-secondary, a.elementor-button[href*="clientes."]):hover {
    transform: translateY(-2px);
    background: var(--ds-bg-soft) !important;
  }
  /* El icono se adelanta un poco */
  html body :is(.fm-cta-primary, .fm-cta-secondary, .elementor-button) svg,
  html body .elementor-button .elementor-button-icon { transition: transform .2s var(--ds-ease); }
  html body :is(.fm-cta-primary, .fm-cta-secondary, .elementor-button):hover svg,
  html body .elementor-button:hover .elementor-button-icon { transform: translateX(2px); }
}
/* Al pulsar: se hunde (también en móvil) */
html body :is(.elementor-button, .fm-cta-primary, .fm-cta-secondary, .fm-card-button, .elementor-form [type=submit]):active {
  transform: translateY(0) scale(.97);
  box-shadow: none !important;
  transition-duration: .08s !important;
}
/* Tarjetas de tarifa: suben un poco al pasar el ratón */
@media (hover: hover) {
  html body .fm-card-container { transition: transform .25s var(--ds-ease), box-shadow .25s var(--ds-ease); }
  html body .fm-card-container:hover { transform: translateY(-4px); box-shadow: 0 20px 40px -16px rgba(6, 6, 6, .25) !important; }
}
@media (prefers-reduced-motion: reduce) {
  html body :is(.elementor-button, .fm-cta-primary, .fm-cta-secondary, .fm-card-button, .fm-card-container, .elementor-form [type=submit]),
  html body :is(.elementor-button, .fm-cta-primary, .fm-cta-secondary, .fm-card-button)::after,
  html body :is(.elementor-button, .fm-cta-primary, .fm-cta-secondary) svg { transition: none !important; transform: none !important; }
}

/* FAQ: la banda era una imagen con el texto dibujado (BANNER-ESTUDIANTES-1.png, rojo antiguo).
   Parche hasta cambiarla en Elementor por un título de verdad (H1). */
html body:not(.home) [data-elementor-type="wp-page"] > .elementor-section:has(img[src*="BANNER-ESTUDIANTES"]) {
  background: var(--ds-bg-soft) !important;
  border-bottom: 1px solid var(--ds-line);
  padding: 56px 24px 48px !important;
  text-align: center;
}
html body:not(.home) [data-elementor-type="wp-page"] > .elementor-section:has(img[src*="BANNER-ESTUDIANTES"]) > .elementor-container { display: none !important; }
html body:not(.home) [data-elementor-type="wp-page"] > .elementor-section:has(img[src*="BANNER-ESTUDIANTES"])::before {
  content: "Preguntas frecuentes";
  display: block;
  font-family: var(--ds-font-head);
  font-size: clamp(36px, 4.4vw, 56px);
  font-weight: 800;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--ds-ink);
}

/* Fondo de la página: en la portada era el rojo antiguo (#CF0904) y asomaba como una
   franja de otro rojo entre el bono pyme y el pie. */
html body.home { background-color: var(--ds-red) !important; }
html body:not(.home) { background-color: var(--ds-bg) !important; }

/* Pie · «Déjanos tu teléfono»: campo y botón en la misma línea, misma altura, sin solaparse */
html body .elementor-form:has(#form-field-llamame) .elementor-form-fields-wrapper {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: stretch;
  gap: 8px;
  margin: 0 !important;
}
html body .elementor-form:has(#form-field-llamame) .elementor-field-group {
  margin: 0 !important;
  padding: 0 !important;
}
html body .elementor-form:has(#form-field-llamame) .elementor-field-type-text {
  flex: 1 1 160px !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  order: 1 !important;
}
html body .elementor-form:has(#form-field-llamame) .elementor-field-type-submit {
  position: static !important;   /* el tema lo colocaba en absoluto encima del campo */
  left: auto !important; right: auto !important; top: auto !important;
  order: 2 !important;
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: none !important;
}
html body .elementor-form:has(#form-field-llamame) .elementor-field-type-acceptance {
  flex: 1 1 100% !important;
  width: 100% !important;
  max-width: none !important;
  order: 3 !important;
}
html body .elementor-form:has(#form-field-llamame) #form-field-llamame {
  height: 48px !important;
  min-height: 48px;
  border-radius: var(--ds-radius-pill) !important;
  padding: 0 20px !important;
}
html body .elementor-form:has(#form-field-llamame) [type=submit] {
  height: 48px !important;
  min-height: 48px;
  padding: 0 22px !important;
  margin: 0 !important;
  position: static !important;
  white-space: nowrap;
}
