/* ==========================================================================
   Grupo SRM — Sistema de diseño para Divi (v1.0)
   Cómo se usa: en el Visual Builder, abre cualquier sección/fila/módulo →
   Avanzado → ID y clases CSS → "Clase CSS" y escribe una de las clases de abajo.
   Todo el contenido (textos, imágenes, enlaces) sigue siendo 100 % editable.
   ========================================================================== */

/* ---------- 1. Tokens ---------- */
:root {
  /* Paleta oficial — Manual de marca Grupo SRM */
  --srm-ink: #1d1d18;          /* Negro corporativo: tipografía y estructura */
  --srm-orange: #e84e0f;       /* Naranja corporativo (PMS ≈172 C): botones, acentos, títulos grandes */
  --srm-muted: #706f6f;        /* Gris texto (5.0:1 sobre blanco) */
  --srm-note: #878787;         /* Gris claro (notas): solo sobre fondo oscuro o texto ≥ 19px */
  --srm-line: #e6e6e6;         /* Gris fondo: bordes, divisores, tarjetas */

  /* Derivados para accesibilidad WCAG 2.2 AA (misma familia cromática) */
  --srm-orange-ink: #bf400c;   /* Naranja para texto pequeño/enlaces sobre claro (5.3:1) */
  --srm-orange-dark: #a3360a;  /* Hover de botones */
  --srm-orange-on-dark: #f0703e; /* Naranja para texto pequeño sobre negro (5.7:1) */
  --srm-orange-soft: #fdebe3;  /* Fondo de iconos */
  --srm-ink-2: #2a2a24;        /* Tarjetas sobre fondo negro */
  --srm-cream: #f4f4f4;        /* Fondo de sección claro (tinte del gris fondo) */
  --srm-white: #ffffff;

  /* Tipografía oficial web: Jost (equivalente libre de Geometr415 BT) */
  --srm-font-head: "Jost", "Geometr415 BT", "Futura", "Helvetica Neue", Arial, sans-serif;
  --srm-font-body: "Jost", "Geometr415 BT", "Futura", "Helvetica Neue", Arial, sans-serif;

  --srm-radius: 14px;
  --srm-radius-sm: 8px;
  --srm-shadow: 0 1px 2px rgba(29,29,24,.06), 0 8px 24px rgba(29,29,24,.06);
  --srm-gap: clamp(16px, 2.5vw, 28px);
  --srm-section-y: clamp(56px, 8vw, 112px);

  --srm-fs-h1: clamp(2.2rem, 1.5rem + 3.2vw, 4.1rem);
  --srm-fs-h2: clamp(1.75rem, 1.25rem + 2vw, 2.8rem);
  --srm-fs-h3: clamp(1.2rem, 1.05rem + .6vw, 1.45rem);
  --srm-fs-lead: clamp(1.1rem, 1rem + .4vw, 1.3rem);
}

/* ---------- 2. Base ---------- */
body {
  font-family: var(--srm-font-body);
  color: var(--srm-ink);
  font-size: 18px;
  line-height: 1.6;
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
}
/* Especificidad baja a propósito: lo que cambies en el Visual Builder (Diseño → Texto del título) tiene prioridad. */
body h1, body h2, body h3, body h4, body h5, body h6 {
  font-family: var(--srm-font-head);
  color: inherit;
  letter-spacing: -0.015em;
  line-height: 1.15;
  padding-bottom: .4em;
}
body h1 { font-size: var(--srm-fs-h1); font-weight: 600; }
body h2 { font-size: var(--srm-fs-h2); font-weight: 600; }
body h3 { font-size: var(--srm-fs-h3); font-weight: 500; }

#page-container a { color: var(--srm-orange-ink); text-underline-offset: 3px; }
#page-container .srm-bg-dark a:not(.et_pb_button) { color: var(--srm-orange-on-dark); }

/* ---------- 3. Accesibilidad ---------- */
.srm-skip-link {
  position: absolute; left: 12px; top: -60px; z-index: 100000;
  background: var(--srm-ink); color: #fff !important; padding: 12px 18px;
  border-radius: var(--srm-radius-sm); font-weight: 700; text-decoration: none;
}
.srm-skip-link:focus { top: 12px; }

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 3px solid var(--srm-orange) !important;
  outline-offset: 3px !important;
  border-radius: 4px;
}
.srm-bg-dark :where(a, button):focus-visible { outline-color: #fff !important; }

.screen-reader-text, .srm-sr-only {
  position: absolute !important; width: 1px; height: 1px; overflow: hidden;
  clip: rect(1px,1px,1px,1px); white-space: nowrap;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
  .et_animated, .et-waypoint { opacity: 1 !important; transform: none !important; }
}

/* ---------- 4. Secciones ---------- */
/* Especificidad (0,2,0): el padding/ancho que ajustes en el Visual Builder sobrescribe estos valores. */
.et_pb_section.srm-section { padding-top: var(--srm-section-y); padding-bottom: var(--srm-section-y); }

.srm-section .et_pb_row { width: 90%; max-width: 1200px; padding-top: 0; padding-bottom: 0; }

.srm-section .et_pb_row + .et_pb_row { margin-top: clamp(28px, 4vw, 48px); }

.et_pb_section.srm-bg-dark { background-color: var(--srm-ink); color: #e6e6e6; }
.srm-bg-dark h1, .srm-bg-dark h2, .srm-bg-dark h3 { color: #fff !important; }
.et_pb_section.srm-bg-cream { background-color: var(--srm-cream); }
.et_pb_section.srm-bg-orange { background-color: var(--srm-orange-ink); color: #fff; }
.srm-bg-orange h2, .srm-bg-orange h3 { color: #fff !important; }

/* Hero */
.et_pb_section.srm-hero { padding-top: clamp(48px, 7vw, 96px); padding-bottom: clamp(48px, 7vw, 96px); position: relative; overflow: hidden; }
.srm-hero .et_pb_row { align-items: center; }
@media (min-width: 981px) { .srm-hero .et_pb_row { display: flex; } }
.srm-hero h1 .srm-accent, .srm-accent { color: var(--srm-orange); }
.srm-hero-media img { border-radius: var(--srm-radius); aspect-ratio: 4 / 3; object-fit: cover; width: 100%; }

/* ---------- 5. Tipografía de apoyo (módulo Texto) ---------- */
.srm-eyebrow, .srm-eyebrow p {
  font-family: var(--srm-font-head); font-size: .85rem; font-weight: 500;
  letter-spacing: .22em; text-transform: uppercase; color: var(--srm-orange-ink);
  margin-bottom: 10px !important;
}
.srm-bg-dark .srm-eyebrow, .srm-bg-dark .srm-eyebrow p { color: var(--srm-orange-on-dark); }
.srm-lead, .srm-lead p { font-size: var(--srm-fs-lead); line-height: 1.55; color: var(--srm-muted); max-width: 62ch; }
.srm-bg-dark .srm-lead, .srm-bg-dark .srm-lead p { color: #d0d0cc; }
.srm-center, .et_pb_module.srm-center, .et_pb_module.srm-center .et_pb_text_inner { text-align: center !important; }
.srm-center .srm-lead, .srm-center.srm-lead p { margin-left: auto; margin-right: auto; }

.srm-checklist ul { list-style: none !important; padding: 0 !important; margin: 0; }
.srm-checklist li { position: relative; padding-left: 30px; margin-bottom: 10px; }
.srm-checklist li::before {
  content: ""; position: absolute; left: 0; top: .35em; width: 18px; height: 18px; border-radius: 50%;
  background: var(--srm-orange-ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2.2' d='M3.5 8.2l3 3 6-6.4'/%3E%3C/svg%3E") center/12px no-repeat;
}

/* ---------- 6. Botones (módulo Botón → clase srm-btn + variante) ---------- */
body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .et_pb_button.srm-btn,
body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .srm-btn .et_pb_button {
  font-family: var(--srm-font-head); font-weight: 600; font-size: 19px; line-height: 1.2; /* 19px semibold/bold = texto grande WCAG */
  padding: 15px 26px !important; border-radius: 999px; border: 2px solid transparent;
  min-height: 48px; display: inline-flex; align-items: center; gap: 8px;
  transition: background-color .2s, color .2s, border-color .2s, transform .2s;
  letter-spacing: 0;
}
body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .et_pb_button.srm-btn::after { display: none !important; }
body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .et_pb_button.srm-btn:hover { transform: translateY(-1px); padding: 15px 26px !important; }

body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .et_pb_button.srm-btn--primary { background: var(--srm-orange); color: #fff; font-weight: 700; }
body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .et_pb_button.srm-btn--primary:hover { background: var(--srm-orange-dark); color: #fff; }

body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .et_pb_button.srm-btn--ghost { background: transparent; color: var(--srm-ink); border-color: var(--srm-ink); }
body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .et_pb_button.srm-btn--ghost:hover { background: var(--srm-ink); color: #fff; }

body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .srm-bg-dark .et_pb_button.srm-btn--ghost,
body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .srm-bg-orange .et_pb_button.srm-btn--ghost,
body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .et_pb_button.srm-btn--light { background: transparent; color: #fff; border-color: #fff; }
body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .srm-bg-dark .et_pb_button.srm-btn--ghost:hover,
body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .et_pb_button.srm-btn--light:hover { background: #fff; color: var(--srm-ink); }

body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .et_pb_button.srm-btn--white { background: #fff; color: var(--srm-orange-ink); }
body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .et_pb_button.srm-btn--white:hover { background: var(--srm-ink); color: #fff; }

body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .et_pb_button.srm-btn--whatsapp { background: #1a7f45; color: #fff; }
body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .et_pb_button.srm-btn--whatsapp:hover { background: #136135; color: #fff; }

/* Botones en línea: añade también la clase srm-btn-inline al módulo Botón */
.et_pb_button_module_wrapper:has(> .srm-btn-inline) { display: inline-block; margin: 0 10px 14px 0 !important; vertical-align: middle; }
@media (max-width: 479px) { .et_pb_button_module_wrapper:has(> .srm-btn-inline) { display: block; margin-right: 0 !important; } .et_pb_button_module_wrapper:has(> .srm-btn-inline) .et_pb_button { width: 100%; justify-content: center; } }
.srm-microcopy, .srm-microcopy p { font-size: .9rem; color: var(--srm-muted); margin-top: 6px; }
.srm-bg-dark .srm-microcopy p { color: var(--srm-note); }

/* ---------- 7. Tarjetas (módulo Blurb → clase srm-card) ---------- */
.et_pb_blurb.srm-card {
  background: #fff; border: 1px solid var(--srm-line); border-radius: var(--srm-radius);
  padding: 28px 24px; height: calc(100% - 30px); box-shadow: var(--srm-shadow);
  transition: transform .2s, box-shadow .2s, border-color .2s; position: relative;
}
.et_pb_blurb.srm-card:hover { transform: translateY(-3px); border-color: var(--srm-orange); }
.srm-card .et_pb_main_blurb_image { margin-bottom: 18px; text-align: left; }
.srm-card .et-pb-icon {
  font-size: 26px !important; color: var(--srm-orange-ink) !important; background: var(--srm-orange-soft);
  width: 56px; height: 56px; line-height: 56px; border-radius: 12px; text-align: center;
}
.srm-card .et_pb_main_blurb_image img { width: 56px; height: 56px; padding: 12px; background: var(--srm-orange-soft); border-radius: 12px; }
.srm-bg-dark .srm-card .et_pb_main_blurb_image img { background: #3a2a20; }
.srm-card--step .et_pb_main_blurb_image img { background: var(--srm-ink); }
.srm-card .et_pb_module_header, .srm-card .et_pb_module_header a { font-size: var(--srm-fs-h3) !important; color: var(--srm-ink) !important; text-decoration: none; }
/* Toda la tarjeta clicable cuando el Blurb tiene URL */
.srm-card .et_pb_module_header a::after { content: ""; position: absolute; inset: 0; border-radius: var(--srm-radius); }
.srm-card .et_pb_blurb_description { color: var(--srm-muted); }
.srm-card .srm-card-link { font-weight: 700; color: var(--srm-orange-ink); margin-top: 8px; display: inline-block; }
.et_pb_row .et_pb_column .et_pb_blurb.srm-card { margin-bottom: 30px; }
.srm-bg-dark .et_pb_blurb.srm-card { background: var(--srm-ink-2); border-color: #3a3a33; box-shadow: none; }
.srm-bg-dark .srm-card .et_pb_module_header, .srm-bg-dark .srm-card .et_pb_module_header a { color: #fff !important; }
.srm-bg-dark .srm-card .et_pb_blurb_description { color: #d0d0cc; }

/* Variante compacta: icono a la izquierda */
.et_pb_blurb.srm-card--inline { box-shadow: none; padding: 20px; }

/* ---------- 8. Cifras (módulo Contador numérico → clase srm-stat) ---------- */
.et_pb_number_counter.srm-stat { text-align: left; border-left: 3px solid var(--srm-orange); padding-left: 18px; }
.srm-stat .percent { font-family: var(--srm-font-head); font-weight: 800; font-size: clamp(2.2rem, 1.6rem + 2vw, 3.25rem) !important; line-height: 1.05 !important; color: inherit; height: auto !important; }
.srm-stat .percent p { line-height: 1.05; }
.srm-stat .title { font-size: .95rem !important; color: var(--srm-muted) !important; font-weight: 500 !important; }
.srm-bg-dark .srm-stat .title { color: #cfcac2 !important; }
.srm-stat .percent-value + .percent-sign { color: var(--srm-orange); }

/* Cifra en módulo Texto (más flexible que el Contador: admite "+130", "24/7"…) */
.et_pb_text.srm-stat { border-left: 3px solid var(--srm-orange); padding-left: 18px; }
.srm-stat .srm-stat-num { font-family: var(--srm-font-head); font-weight: 600; font-size: clamp(2.1rem, 1.6rem + 2vw, 3.2rem); color: var(--srm-orange); line-height: 1.05; padding-bottom: 4px; }
.srm-stat p:last-child { font-size: .95rem; color: var(--srm-muted); padding-bottom: 0; }
.srm-bg-dark .srm-stat p:last-child { color: #d0d0cc; }
.srm-bg-dark .srm-stat .srm-stat-num { color: var(--srm-orange); } /* cifra grande: 4.45:1 sobre negro, válido para texto grande */

/* ---------- 9. Barra de confianza / logos ---------- */
.srm-trustbar { border-bottom: 1px solid var(--srm-line); }
.et_pb_image.srm-logo { margin-bottom: 0 !important; }
.et_pb_image.srm-logo img { max-height: 48px; width: auto; filter: grayscale(1); opacity: .75; transition: filter .2s, opacity .2s; }
.et_pb_image.srm-logo:hover img { filter: none; opacity: 1; }
@media (min-width: 768px) { .srm-logos-row { display: flex; align-items: center; } .srm-logos-row .et_pb_column { margin-bottom: 0 !important; } }

/* Insignias de confianza (texto con <ul class="srm-badges">) */
.srm-badges { list-style: none !important; padding: 0 !important; display: flex; flex-wrap: wrap; gap: 10px 22px; margin: 0; }
.srm-badges li { display: flex; align-items: center; gap: 8px; font-weight: 600; font-size: .95rem; padding: 0 !important; }
.srm-badges li::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--srm-orange); flex: none; }

/* ---------- 10. Testimonios (módulo Testimonio → clase srm-quote) ---------- */
.et_pb_testimonial.srm-quote { background: #fff; border-radius: var(--srm-radius); border: 1px solid var(--srm-line); padding: 32px !important; }
.srm-quote .et_pb_testimonial_description_inner { font-size: 1.05rem; }
.srm-quote .et_pb_testimonial_author { font-family: var(--srm-font-head); margin-top: 14px; display: block; }
.srm-quote::before { color: var(--srm-orange) !important; }

/* ---------- 11. FAQ (módulo Acordeón → clase srm-faq) ---------- */
.et_pb_accordion.srm-faq .et_pb_toggle { border: 0; border-bottom: 1px solid var(--srm-line); background: transparent !important; padding: 22px 4px; margin: 0 !important; }
.srm-faq .et_pb_toggle_title { font-family: var(--srm-font-head); font-size: 1.1rem !important; color: var(--srm-ink) !important; padding-right: 40px; }
.srm-faq .et_pb_toggle_title::before { color: var(--srm-orange-ink) !important; font-size: 22px; }
.srm-faq .et_pb_toggle_content { color: var(--srm-muted); padding-top: 12px; max-width: 75ch; }

/* ---------- 12. Formulario (módulo Formulario de contacto → clase srm-form) ---------- */
.et_pb_contact_form_container.srm-form .input,
.srm-form .et_pb_contact_field input, .srm-form .et_pb_contact_field textarea, .srm-form .et_pb_contact_field select {
  background: #fff !important; border: 1.5px solid #8a8a85 !important; border-radius: var(--srm-radius-sm) !important;
  font-size: 1rem !important; padding: 14px 16px !important; color: var(--srm-ink) !important; min-height: 48px;
}
.srm-form .input:focus { border-color: var(--srm-orange-ink) !important; }
.srm-form .et_contact_bottom_container .et_pb_button { background: var(--srm-orange) !important; font-size: 19px !important; font-weight: 700 !important; color: #fff !important; border-radius: 999px !important; border: 0 !important; padding: 14px 28px !important; }
.srm-form .et_contact_bottom_container .et_pb_button::after { display: none; }

/* ---------- 13. Header (Theme Builder) ---------- */
.srm-header { border-bottom: 1px solid var(--srm-line); background: #fff !important; }
.srm-header .et_pb_row { display: flex; align-items: center; gap: 24px; width: 92% !important; max-width: 1280px; }
.srm-header .et_pb_column { margin-bottom: 0 !important; }
.srm-header .et_pb_menu__menu > nav > ul > li > a { font-family: var(--srm-font-head); font-weight: 600; font-size: 15px; color: var(--srm-ink) !important; }
.srm-header .et_pb_menu__menu > nav > ul > li.current-menu-item > a { color: var(--srm-orange-ink) !important; }
.srm-header .srm-header-cta { text-align: right; }
@media (max-width: 980px) { .srm-hide-tablet { display: none !important; } }

/* Barra superior de contacto */
.srm-topbar { background: var(--srm-ink) !important; color: #e6e6e6; font-size: .85rem; }
.srm-topbar p { padding-bottom: 0; }
.srm-topbar-right { text-align: right; }
@media (max-width: 980px) { .srm-topbar-right { text-align: center; } }
.srm-topbar a { color: #fff !important; text-decoration: none; }

/* ---------- 14. Footer (Theme Builder) ---------- */
.srm-footer { background: var(--srm-ink) !important; color: #d0d0cc; font-size: .95rem; }
.srm-footer h2, .srm-footer h3, .srm-footer h4 { color: #fff !important; font-size: 1rem !important; letter-spacing: .04em; text-transform: uppercase; }
.srm-footer ul { list-style: none !important; padding: 0 !important; }
.srm-footer li { margin-bottom: 8px; }
.srm-footer a { color: #e6e6e6 !important; text-decoration: none; }
.srm-footer a:hover { color: var(--srm-orange) !important; text-decoration: underline; }
.srm-footer-legal { border-top: 1px solid #3a3a33; font-size: .85rem; color: var(--srm-note); }

/* ---------- 15. Barra sticky móvil (fila en el footer con clase srm-mobilebar) ---------- */
.srm-mobilebar { display: none !important; }
@media (max-width: 767px) {
  .srm-mobilebar {
    display: flex !important; position: fixed !important; left: 0; right: 0; bottom: 0; z-index: 9999;
    background: #fff; border-top: 1px solid var(--srm-line); padding: 10px 12px calc(10px + env(safe-area-inset-bottom)) !important;
    width: 100% !important; max-width: none !important; gap: 10px; margin: 0 !important; box-shadow: 0 -6px 18px rgba(0,0,0,.08);
  }
  .srm-mobilebar .et_pb_column { flex: 1; margin: 0 !important; width: auto !important; }
  .srm-mobilebar .et_pb_button_module_wrapper, .srm-mobilebar .et_pb_button { width: 100%; justify-content: center; }
  body.srm-has-mobilebar { padding-bottom: 76px; }
}
/* En el Visual Builder la barra se muestra en su lugar para poder editarla */
.et-fb .srm-mobilebar { display: flex !important; position: static !important; }

/* ---------- 16. Utilidades ---------- */
.srm-rounded img, .srm-rounded { border-radius: var(--srm-radius); overflow: hidden; }
.srm-maxw-narrow { max-width: 820px !important; }
.srm-divider-top { border-top: 1px solid var(--srm-line); }
.srm-equal .et_pb_column { display: flex; flex-direction: column; }
@media (min-width: 981px) { .srm-equal { display: flex; } }
/* Fila de 2 columnas (imagen + texto) centradas verticalmente */
@media (min-width: 981px) { .srm-vcenter { display: flex; align-items: center; } }

/* Ocultar el botón "volver arriba" que tapa la barra móvil */
@media (max-width: 767px) { .et_pb_scroll_top { bottom: 90px !important; } }

/* ---------- 17. Contraste en fondos oscuros/naranja ---------- */
.srm-bg-dark .srm-microcopy, .srm-bg-dark .srm-microcopy li, .srm-bg-dark .srm-microcopy p { color: #d0d0cc; }
.srm-bg-orange .srm-microcopy, .srm-bg-orange .srm-microcopy p, .srm-bg-orange .srm-lead p, .srm-bg-orange .srm-lead { color: #fff; }
.srm-bg-orange .srm-eyebrow, .srm-bg-orange .srm-eyebrow p { color: #fff; opacity: .9; }
.srm-bg-orange a:not(.et_pb_button) { color: #fff; text-decoration: underline; }
.et_pb_testimonial.srm-quote, .srm-quote .et_pb_testimonial_description_inner, .srm-quote p { color: var(--srm-ink) !important; }
.srm-quote .et_pb_testimonial_author { color: var(--srm-ink) !important; font-weight: 700; }
.srm-quote .et_pb_testimonial_meta { color: var(--srm-muted) !important; }
.srm-bg-orange .et_pb_contact_form_container.srm-form { background: #fff; color: var(--srm-ink); border-radius: var(--srm-radius); padding: clamp(20px, 3vw, 32px); }
.srm-bg-orange .srm-form a { color: var(--srm-orange-ink) !important; }
.srm-footer .et_pb_image img { max-width: 140px; }

/* ---------- 18. Hero claro (predominio de fondos claros) ---------- */
.srm-hero.srm-bg-cream { background-image: linear-gradient(180deg, #f4f4f4 0%, #ffffff 100%); }
.srm-hero .srm-hero-media img { box-shadow: 0 20px 50px rgba(29,29,24,.12); }
.srm-trustbar { border-top: 1px solid var(--srm-line); }

/* ---------- 19. Botones píldora naranja (decisión de marca) ----------
   Todos los botones: forma píldora y familia naranja.
   Texto ≥19px semibold = "texto grande" WCAG → el naranja #E84E0F con blanco (3.8:1) cumple AA. */
body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .et_pb_button.srm-btn,
body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .et_pb_contact_form_container .et_pb_button,
body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .srm-header-cta .et_pb_button {
  border-radius: 999px !important;
  padding: 16px 32px !important;
  letter-spacing: .01em;
}
body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .et_pb_button.srm-btn:hover { padding: 16px 32px !important; }

/* Principal: naranja sólido que resalta */
body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .et_pb_button.srm-btn--primary,
body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .et_pb_button.srm-btn--whatsapp {
  background: var(--srm-orange); color: #fff; border-color: var(--srm-orange);
  box-shadow: 0 8px 22px rgba(232, 78, 15, .35);
}
body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .et_pb_button.srm-btn--primary:hover,
body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .et_pb_button.srm-btn--whatsapp:hover {
  background: var(--srm-orange-dark); border-color: var(--srm-orange-dark); color: #fff;
  box-shadow: 0 12px 28px rgba(232, 78, 15, .45); transform: translateY(-2px);
}

/* Secundario: contorno naranja (sobre fondos claros) */
body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .et_pb_button.srm-btn--ghost {
  background: #fff; color: var(--srm-orange); border: 2px solid var(--srm-orange); font-weight: 700;
}
body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .et_pb_button.srm-btn--ghost:hover { background: var(--srm-orange); color: #fff; }

/* Sobre fondo negro: principal naranja; secundario contorno naranja claro */
body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .srm-bg-dark .et_pb_button.srm-btn--ghost { background: transparent; color: var(--srm-orange-on-dark); border-color: var(--srm-orange-on-dark); }
body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .srm-bg-dark .et_pb_button.srm-btn--ghost:hover { background: var(--srm-orange); border-color: var(--srm-orange); color: #fff; }

/* Sobre bloque naranja: píldora blanca con texto naranja */
body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .srm-bg-orange .et_pb_button.srm-btn,
body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .et_pb_button.srm-btn--light,
body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .et_pb_button.srm-btn--white {
  background: #fff; color: var(--srm-orange-ink); border: 2px solid #fff; box-shadow: 0 8px 22px rgba(29,29,24,.18);
}
body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .srm-bg-orange .et_pb_button.srm-btn:hover,
body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .et_pb_button.srm-btn--light:hover,
body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .et_pb_button.srm-btn--white:hover { background: var(--srm-ink); border-color: var(--srm-ink); color: #fff; }

/* Formulario: botón enviar como píldora naranja */
body :is(#page-container, #et-boc, #et-fb-app, .et-l--header, .et-l--footer) .srm-form .et_contact_bottom_container .et_pb_button { box-shadow: 0 8px 22px rgba(232, 78, 15, .35); padding: 16px 34px !important; }

/* ==========================================================================
   20. Estilo editorial "producto protagonista"
   Mucho aire, titulares grandes centrados, tiles claros con radios amplios,
   poco texto por bloque, header translúcido. Fondos claros predominantes.
   ========================================================================== */
:root { --srm-radius-xl: 28px; --srm-tile: #f4f4f4; }

body h1, body h2 { letter-spacing: -0.025em; }
body h1 { font-size: clamp(2.6rem, 1.6rem + 4.6vw, 5.4rem); line-height: 1.04; font-weight: 600; }
body h2 { font-size: clamp(2rem, 1.3rem + 3vw, 3.6rem); line-height: 1.07; font-weight: 600; }
.srm-h2-xl h2 { font-size: clamp(2.2rem, 1.4rem + 3.6vw, 4.2rem); }
.srm-lead, .srm-lead p { font-size: clamp(1.15rem, 1rem + .55vw, 1.45rem); line-height: 1.5; }
.srm-center .srm-lead, .srm-lead.srm-center p { margin-left: auto; margin-right: auto; }

/* Filas */
.srm-section .et_pb_row.srm-row-wide { max-width: 1320px; width: 92%; }
.srm-section .et_pb_row.srm-maxw-narrow { max-width: 880px !important; }
.srm-center-col { text-align: center; }
.srm-center-col .et_pb_button_module_wrapper:has(> .srm-btn-inline) { margin: 6px 6px 14px !important; }

/* Hero centrado */
.et_pb_section.srm-hero--center { padding-top: clamp(64px, 9vw, 128px); padding-bottom: clamp(48px, 6vw, 80px); background: linear-gradient(180deg, #f4f4f4 0%, #ffffff 70%); }
.srm-hero--center .et_pb_row:not(.srm-stats-row) { display: block; }
.srm-hero--center .srm-accent { color: var(--srm-orange); }
.srm-hero--center .srm-microcopy .srm-badges { justify-content: center; margin-top: 4px; }
.et_pb_image.srm-hero-media img, .et_pb_image.srm-feature-media img {
  width: 100%; aspect-ratio: 16 / 8; object-fit: contain; background: #fff;
  border-radius: var(--srm-radius-xl); box-shadow: 0 30px 80px rgba(29,29,24,.10);
}
.srm-bg-cream .et_pb_image.srm-feature-media img { background: #fff; }

/* Cifras centradas sin bordes */
.srm-stats-row .et_pb_text.srm-stat { border-left: 0; padding-left: 0; text-align: center; }
@media (min-width: 981px) { .srm-stats-row { border-top: 1px solid var(--srm-line); padding-top: 40px !important; } }

/* Tiles (módulo Blurb → clase srm-tile) */
.et_pb_blurb.srm-tile {
  background: var(--srm-tile); border: 0; border-radius: var(--srm-radius-xl);
  padding: clamp(32px, 4vw, 56px); height: calc(100% - 30px); position: relative; text-align: center;
  transition: transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s;
}
.et_pb_row .et_pb_column .et_pb_blurb.srm-tile { margin-bottom: 30px; }
.et_pb_blurb.srm-tile:hover { transform: scale(1.015); box-shadow: 0 20px 50px rgba(29,29,24,.08); }
.srm-bg-cream .et_pb_blurb.srm-tile { background: #fff; }
.srm-tile .et_pb_main_blurb_image { margin: 0 auto 20px; text-align: center; }
.srm-tile .et_pb_main_blurb_image img { width: 64px; height: 64px; padding: 14px; background: #fff; border-radius: 18px; }
.srm-bg-cream .srm-tile .et_pb_main_blurb_image img { background: var(--srm-tile); }
.srm-tile .et_pb_module_header, .srm-tile .et_pb_module_header a { font-size: clamp(1.4rem, 1.1rem + 1vw, 2rem) !important; font-weight: 600; color: var(--srm-ink) !important; text-decoration: none; letter-spacing: -0.015em; }
.srm-tile .et_pb_module_header a::after { content: ""; position: absolute; inset: 0; border-radius: var(--srm-radius-xl); }
.srm-tile .et_pb_blurb_description { color: var(--srm-muted); font-size: 1.05rem; max-width: 40ch; margin: 0 auto; }
.srm-tile .srm-card-link { color: var(--srm-orange-ink); font-weight: 600; font-size: 1.05rem; margin-top: 10px; display: inline-block; }
.et_pb_blurb.srm-tile--sm { padding: 32px 28px; }
.srm-tile--sm .et_pb_module_header, .srm-tile--sm .et_pb_module_header a { font-size: 1.3rem !important; }

/* Destacados (módulo Texto → clase srm-highlight) */
.et_pb_text.srm-highlight { text-align: center; }
.srm-highlight p:first-child strong { display: block; font-size: 1.2rem; font-weight: 600; color: var(--srm-ink); }
.srm-highlight p { color: var(--srm-muted); font-size: 1rem; padding-bottom: 4px; }
.srm-bg-dark .srm-highlight p:first-child strong { color: #fff; }
.srm-bg-dark .srm-highlight p { color: #d0d0cc; }

/* Pasos (módulo Texto → clase srm-step) */
.et_pb_text.srm-step { text-align: left; border-top: 2px solid var(--srm-line); padding-top: 22px; }
.srm-step .srm-step-num { font-size: 2.6rem; font-weight: 600; color: var(--srm-orange); line-height: 1; padding-bottom: 14px; }
.srm-step h3 { font-size: 1.35rem !important; }
.srm-step p:last-child { color: var(--srm-muted); }

/* Bloque negro y testimonios con radios amplios */
.et_pb_testimonial.srm-quote { border-radius: var(--srm-radius-xl); border: 0; }
.et_pb_section.srm-bg-dark { background-color: var(--srm-ink); }

/* FAQ más limpia */
.et_pb_accordion.srm-faq { margin-top: 24px; text-align: left; }
.srm-faq .et_pb_toggle_title { font-weight: 500; font-size: 1.2rem !important; }

/* Bloque naranja: formulario en tarjeta blanca con radio amplio */
.srm-bg-orange .et_pb_contact_form_container.srm-form { border-radius: var(--srm-radius-xl); padding: clamp(24px, 3.5vw, 44px); }

/* Header translúcido fijo (Theme Builder) */
.et-l--header { position: sticky; top: 0; z-index: 9990; }
.admin-bar .et-l--header { top: 32px; }
.srm-header--glass, .et_pb_section.srm-header--glass {
  background: rgba(255,255,255,.78) !important;
  -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px);
  border-bottom: 1px solid rgba(29,29,24,.08);
}
.srm-header .et_pb_menu__menu > nav > ul > li > a { font-weight: 500 !important; font-size: 15px !important; }
.srm-header-cta .et_pb_button.srm-btn { font-size: 16px !important; padding: 10px 22px !important; box-shadow: none !important; }
/* Barra superior clara y discreta */
.et_pb_section.srm-topbar--light { background: #f4f4f4 !important; color: var(--srm-muted); font-size: .8rem; }
.srm-topbar--light a { color: var(--srm-ink) !important; }

@media (max-width: 980px) {
  .srm-hero--center h1 br, .srm-h2-xl h2 br { display: none; }
  .et_pb_image.srm-hero-media img, .et_pb_image.srm-feature-media img { aspect-ratio: 4 / 3; }
}

/* ---------- 21. Tiles de negocio (grupo paraguas) — Blurb con logo → clase srm-tile srm-tile--brand ---------- */
.srm-tile--brand .et_pb_main_blurb_image { margin-bottom: 18px; }
.srm-tile--brand .et_pb_main_blurb_image img {
  width: auto !important; height: 88px; max-width: 220px; object-fit: contain;
  padding: 0; background: transparent !important; border-radius: 16px;
}
.srm-tile-cat { font-size: .78rem; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; color: var(--srm-orange-ink); padding-bottom: 6px !important; }
.srm-tile--brand .et_pb_module_header { margin-top: 0; }

/* ---------- 22. Tiles con fotografía (Blurb → clase srm-tile srm-tile--photo) ---------- */
.et_pb_blurb.srm-tile--photo { padding: 0 0 clamp(28px, 3vw, 40px); overflow: hidden; }
.srm-tile--photo .et_pb_main_blurb_image { margin: 0 0 24px !important; width: 100%; max-width: none !important; }
.srm-tile--photo .et_pb_main_blurb_image .et_pb_image_wrap, .srm-tile--photo .et_pb_main_blurb_image img {
  display: block; width: 100% !important; height: auto !important; aspect-ratio: 4 / 3; object-fit: contain; /* imágenes actuales: composiciones cuadradas con texto → sin recorte. Con fotografía nueva 16:10 cambia a cover */
  padding: 0 !important; border-radius: 0 !important; background: #fff !important;
  transition: transform .6s cubic-bezier(.2,.8,.2,1);
}
.et_pb_blurb.srm-tile--photo:hover .et_pb_main_blurb_image img { transform: scale(1.04); }
.srm-tile--photo .et_pb_blurb_container { padding: 0 clamp(24px, 3vw, 44px); }

/* ---------- 23. Header del Theme Builder: logo, menú y CTA ---------- */
.srm-menu .et_pb_menu__logo img, .srm-header .et_pb_menu__logo img { max-height: 44px !important; width: auto !important; }
.srm-menu .et_pb_menu__logo-wrap { flex: 0 0 auto; margin-right: 24px; }
.srm-header .et_pb_menu, .srm-header .et_pb_menu__wrap, .srm-header .et_pb_menu__menu, .srm-header .et-menu-nav { background: transparent !important; }
.srm-header .et-menu > li > a { color: var(--srm-ink) !important; padding-top: 22px !important; padding-bottom: 22px !important; }
.srm-header .et-menu > li { padding-left: 14px; padding-right: 14px; }
.srm-header .et-menu .sub-menu { border-top: 3px solid var(--srm-orange); border-radius: 0 0 12px 12px; box-shadow: 0 18px 40px rgba(29,29,24,.12); }
.srm-header .et_mobile_nav_menu .mobile_menu_bar:before { color: var(--srm-ink) !important; }
.srm-header .et_pb_column { display: flex; align-items: center; }
.srm-header .srm-header-cta { justify-content: flex-end; }

/* ---------- 24. Formato cuadrado (la mayoría de imágenes de la biblioteca son 1:1) ---------- */
.et_pb_image.srm-square img, .et_pb_image.srm-feature-media.srm-square img {
  aspect-ratio: 1 / 1 !important; object-fit: cover; width: 100%;
  border-radius: var(--srm-radius-xl); box-shadow: 0 30px 80px rgba(29,29,24,.10); background: #fff;
}
.srm-tile--photo .et_pb_main_blurb_image .et_pb_image_wrap, .srm-tile--photo .et_pb_main_blurb_image img { aspect-ratio: 1 / 1 !important; object-fit: cover !important; }
@media (min-width: 981px) { .srm-vcenter .et_pb_column_1_2 + .et_pb_column_1_2 { padding-left: 2%; } }

/* ---------- 25. Saludo humano (Texto → clases srm-greeting-*) ---------- */
.et_pb_section.srm-greeting { background: #fff; }
.srm-greeting-title h2 { font-size: clamp(2.2rem, 1.4rem + 3.4vw, 4rem); }
.srm-greeting-text p { margin-bottom: .6em; }
.srm-greeting-text strong { color: var(--srm-ink); font-weight: 600; }

/* ---------- 26. Max Mega Menu dentro del header nuevo (conserva los iconos de cada opción) ----------
   Los iconos se siguen configurando en Apariencia → Menús → (opción) → Mega Menu → Icono. */
.et-l--header [id^="mega-menu-wrap-"],
.et-l--header [id^="mega-menu-wrap-"] [id^="mega-menu-"] { background: transparent !important; }
.et-l--header [id^="mega-menu-wrap-"] .mega-menu-item > a.mega-menu-link {
  font-family: var(--srm-font-head) !important; font-weight: 500 !important; font-size: 15px !important;
  color: var(--srm-ink) !important; background: transparent !important; border: 0 !important;
  text-transform: none !important; letter-spacing: 0 !important;
}
.et-l--header [id^="mega-menu-wrap-"] [id^="mega-menu-"] > li.mega-menu-item > a.mega-menu-link { height: 64px !important; line-height: 64px !important; padding: 0 14px !important; }
.et-l--header [id^="mega-menu-wrap-"] [id^="mega-menu-"] > li.mega-menu-item > a.mega-menu-link:hover,
.et-l--header [id^="mega-menu-wrap-"] [id^="mega-menu-"] > li.mega-menu-item.mega-toggle-on > a.mega-menu-link,
.et-l--header [id^="mega-menu-wrap-"] [id^="mega-menu-"] > li.mega-current-menu-ancestor > a.mega-menu-link,
.et-l--header [id^="mega-menu-wrap-"] [id^="mega-menu-"] > li.mega-current-menu-item > a.mega-menu-link { color: var(--srm-orange-ink) !important; background: transparent !important; }
/* Iconos (Dashicons / Font Awesome / Genericons) en naranja */
.et-l--header [id^="mega-menu-wrap-"] .mega-menu-link:before { color: var(--srm-orange) !important; opacity: 1 !important; margin-right: 8px !important; }
/* Desplegables: tarjeta blanca */
.et-l--header [id^="mega-menu-wrap-"] ul.mega-sub-menu {
  background: #fff !important; border: 1px solid var(--srm-line) !important; border-top: 3px solid var(--srm-orange) !important;
  border-radius: 0 0 16px 16px !important; box-shadow: 0 24px 60px rgba(29,29,24,.14) !important; padding: 10px !important;
}
.et-l--header [id^="mega-menu-wrap-"] ul.mega-sub-menu li.mega-menu-item a.mega-menu-link {
  color: var(--srm-ink) !important; background: transparent !important; border-radius: 10px !important;
  padding: 10px 14px !important; line-height: 1.35 !important; height: auto !important; font-size: 15px !important;
}
.et-l--header [id^="mega-menu-wrap-"] ul.mega-sub-menu li.mega-menu-item a.mega-menu-link:hover { background: var(--srm-cream) !important; color: var(--srm-orange-ink) !important; }
/* Móvil: botón hamburguesa y panel claro */
.et-l--header [id^="mega-menu-wrap-"] .mega-menu-toggle { background: transparent !important; }
.et-l--header [id^="mega-menu-wrap-"] .mega-menu-toggle .mega-toggle-block .mega-toggle-animated-inner,
.et-l--header [id^="mega-menu-wrap-"] .mega-menu-toggle .mega-toggle-block .mega-toggle-animated-inner:before,
.et-l--header [id^="mega-menu-wrap-"] .mega-menu-toggle .mega-toggle-block .mega-toggle-animated-inner:after { background-color: var(--srm-ink) !important; }
@media (max-width: 980px) {
  .et-l--header [id^="mega-menu-wrap-"] .mega-menu-toggle + [id^="mega-menu-"] { background: #fff !important; border-radius: 0 0 16px 16px; box-shadow: 0 24px 60px rgba(29,29,24,.14); }
  .et-l--header [id^="mega-menu-wrap-"] [id^="mega-menu-"] > li.mega-menu-item > a.mega-menu-link { height: 48px !important; line-height: 48px !important; }
}

/* ---------- 27. Saludo con el equipo saludando de fondo ----------
   Imagen por defecto: assets/img/grupo-srm-equipo-saludando.webp (1200×520, 70 KB).
   Para cambiarla: Visual Builder → Sección "Saludo" → Fondo → Imagen (tiene prioridad). */
.et_pb_section.srm-greeting--photo {
  --srm-greet-w: min(1400px, 100vw);
  --srm-greet-h: calc(var(--srm-greet-w) * 0.4334);      /* proporción 1200×520 */
  background-color: #fff;
  background-image:
    linear-gradient(180deg, rgba(255,255,255,0) 55%, rgba(255,255,255,.85) 84%, #fff 96%),
    linear-gradient(90deg, #fff 0%, rgba(255,255,255,0) 7%, rgba(255,255,255,0) 93%, #fff 100%),
    url("../img/grupo-srm-equipo-saludando.webp");
  background-repeat: no-repeat;
  background-position: center top;
  background-size: var(--srm-greet-w) var(--srm-greet-h);
  padding-top: calc(var(--srm-greet-h) - clamp(40px, 5vw, 90px)) !important; /* el título roza el borde difuminado */
  padding-bottom: clamp(56px, 7vw, 96px) !important;
}
@media (max-width: 767px) {
  .et_pb_section.srm-greeting--photo { --srm-greet-w: 150vw; }
}

/* ---------- 28. Legibilidad: textos largos alineados a la izquierda ----------
   Regla: titulares y frases de una línea pueden ir centrados; párrafos de varias líneas, a la izquierda.
   Módulo Texto → clase srm-text-left: el bloque queda centrado en la página (máx. 62 caracteres por línea)
   pero las líneas empiezan a la izquierda. */
.et_pb_module.srm-text-left { max-width: 62ch; margin-left: auto !important; margin-right: auto !important; }
.et_pb_module.srm-text-left, .et_pb_module.srm-text-left .et_pb_text_inner, .et_pb_module.srm-text-left p { text-align: left !important; }

/* Tiles, destacados y cifras con texto de varias líneas: a la izquierda */
.et_pb_blurb.srm-tile, .et_pb_blurb.srm-tile .et_pb_blurb_description, .et_pb_blurb.srm-tile .et_pb_module_header { text-align: left !important; }
.srm-tile .et_pb_blurb_description { margin: 0 !important; }
.srm-tile:not(.srm-tile--photo) .et_pb_main_blurb_image { margin-left: 0 !important; text-align: left !important; }
.srm-tile--brand .et_pb_main_blurb_image img { margin-left: 0; }
.et_pb_text.srm-highlight, .et_pb_text.srm-highlight p { text-align: left !important; }
@media (min-width: 981px) { .srm-highlights .et_pb_column { padding-right: 2%; } }

/* ---------- 29. Logos oficiales de cada negocio (Medios → Logo-GrupoSRM-*.png, 314×314 transparentes) ----------
   Se muestran solos, limpios y grandes (como en "Quiénes somos"). */
.srm-tile--brand .et_pb_main_blurb_image img {
  width: 160px !important; height: 160px !important; max-width: none; object-fit: contain;
  background: transparent !important; border-radius: 0; padding: 0 !important; box-shadow: none !important;
}
.srm-tile--brand .et_pb_main_blurb_image { margin-bottom: 8px !important; }

/* ---------- 30. "Tienda" destacada en el menú ----------
   Aplica a enlaces a TiendaSRM.com o /Tienda2/ y a cualquier opción con la clase CSS "srm-menu-destacado"
   (Apariencia → Menús → Opciones de pantalla → Clases CSS). */
.et-l--header [id^="mega-menu-"] > li.mega-menu-item > a.mega-menu-link:is([href*="tiendasrm" i], [href*="Tienda2"]),
.et-l--header [id^="mega-menu-"] > li.mega-menu-item.srm-menu-destacado > a.mega-menu-link,
.srm-header .et-menu > li > a:is([href*="tiendasrm" i], [href*="Tienda2"]),
.srm-header .et-menu > li.srm-menu-destacado > a {
  background: var(--srm-orange-soft) !important; color: var(--srm-orange-ink) !important; font-weight: 600 !important;
  border-radius: 999px !important; height: 40px !important; line-height: 40px !important;
  margin-top: 12px !important; padding: 0 18px !important;
  box-shadow: inset 0 0 0 1.5px rgba(232,78,15,.35);
}
.et-l--header [id^="mega-menu-"] > li.mega-menu-item > a.mega-menu-link:is([href*="tiendasrm" i], [href*="Tienda2"]):hover,
.et-l--header [id^="mega-menu-"] > li.mega-menu-item.srm-menu-destacado > a.mega-menu-link:hover,
.srm-header .et-menu > li > a:is([href*="tiendasrm" i], [href*="Tienda2"]):hover,
.srm-header .et-menu > li.srm-menu-destacado > a:hover { background: var(--srm-orange) !important; color: #fff !important; }
.et-l--header [id^="mega-menu-"] > li.mega-menu-item > a.mega-menu-link:is([href*="tiendasrm" i], [href*="Tienda2"]):before { color: inherit !important; }
.srm-header .et-menu > li > a:is([href*="tiendasrm" i], [href*="Tienda2"]) { padding-top: 0 !important; padding-bottom: 0 !important; display: inline-block; }

/* ---------- 31. Tiles con foto: solo marco, sin fondo (las fotos tienen fondo blanco) ---------- */
.et_pb_blurb.srm-tile--photo,
.srm-bg-cream .et_pb_blurb.srm-tile--photo {
  background: transparent !important;
  border: 1.5px solid var(--srm-line) !important;
  box-shadow: none !important;
}
.srm-tile--photo .et_pb_main_blurb_image .et_pb_image_wrap,
.srm-tile--photo .et_pb_main_blurb_image img { background: transparent !important; }
.et_pb_blurb.srm-tile--photo:hover { border-color: var(--srm-orange) !important; box-shadow: none !important; transform: none; }

/* ---------- 32. Logos de negocios centrados y más grandes ---------- */
.et_pb_blurb.srm-tile--brand .et_pb_main_blurb_image {
  display: flex !important; justify-content: center; align-items: center;
  width: 100% !important; max-width: none !important; margin: 0 0 18px !important; text-align: center !important;
}
.et_pb_blurb.srm-tile--brand .et_pb_main_blurb_image .et_pb_image_wrap { display: block; margin: 0 auto; }
.et_pb_blurb.srm-tile--brand .et_pb_main_blurb_image img {
  width: clamp(160px, 16vw, 210px) !important; height: clamp(160px, 16vw, 210px) !important; margin: 0 auto !important;
}
/* El Blurb de Divi fija un ancho al contenedor de la imagen (Diseño → Imagen e icono → Ancho): lo liberamos */
.et_pb_blurb.srm-tile--brand .et_pb_main_blurb_image .et_pb_image_wrap { width: auto !important; max-width: none !important; }

/* ---------- 33. Imágenes de tiles de borde a borde (Divi limita el Blurb a 550px) ---------- */
.et_pb_blurb.srm-tile .et_pb_blurb_content { max-width: none !important; width: 100%; }
.et_pb_blurb.srm-tile--photo .et_pb_main_blurb_image,
.et_pb_blurb.srm-tile--photo .et_pb_main_blurb_image .et_pb_image_wrap,
.et_pb_blurb.srm-tile--photo .et_pb_main_blurb_image img { width: 100% !important; max-width: none !important; display: block; }

/* Clientes en texto (de "Quiénes somos") */
.srm-clients { list-style: none !important; padding: 0 !important; margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 28px; max-width: 1100px; }
.srm-clients li { font-family: var(--srm-font-head); font-weight: 600; font-size: clamp(1rem, .9rem + .4vw, 1.25rem); color: #9a9995; letter-spacing: -.01em; padding: 0 !important; }

/* ---------- 34. Títulos en dos niveles (regla de marca) ----------
   Primera línea: negro, tamaño completo. Segunda línea: naranja y SIEMPRE más pequeña.
   En el Visual Builder: escribe la segunda línea dentro de <span class="srm-accent">…</span>. */
body h1 .srm-accent, body h2 .srm-accent {
  display: block; color: var(--srm-orange); font-size: .62em; line-height: 1.12;
  font-weight: 600; letter-spacing: -0.015em; margin-top: .12em;
}
.srm-bg-dark h1 .srm-accent, .srm-bg-dark h2 .srm-accent { color: var(--srm-orange); }
body .srm-bg-orange :is(h1, h2) .srm-accent { color: #FFD3BF !important; opacity: 1; }
.srm-hero--center h1 br, .srm-h2-xl h2 br { display: none; } /* el span ya va en su propia línea */

/* ---------- 35. Formulario «¿Prefieres que te llamemos?» ---------- */
.srm-form .et_pb_contact_main_title { font-size: clamp(1.4rem, 2.2vw, 1.8rem); font-weight: 600; color: var(--srm-ink); margin-bottom: 18px; }
.srm-bg-orange .srm-form .et_pb_contact_main_title { color: var(--srm-ink); }
body .srm-bg-orange .srm-microcopy a, body .srm-bg-orange .srm-lead a { color: #fff !important; text-decoration: underline; }

/* ---------- 36. Sin contrastes entre imágenes y fondo ----------
   Regla: ninguna imagen debe "recortarse" contra el fondo de su sección.
   - Footer: mismo gris del fondo del logo (Logotipo_GrupoSRM-SRMGroup.jpg = #343434).
   - Fotos de producto con fondo blanco sobre secciones grises claras: se funden con multiply. */
:root { --srm-footer-bg: #343434; }
.srm-footer, .et-l--footer .et_pb_section.srm-footer { background: var(--srm-footer-bg) !important; }
.srm-footer-legal { border-top-color: #4a4a4a !important; color: #b8b8b4 !important; }
.srm-bg-cream .et_pb_image img, .srm-bg-cream .srm-tile .et_pb_main_blurb_image img { background: transparent !important; mix-blend-mode: multiply; }

/* ---------- 37. Footer: «Síguenos» (módulo Seguir en redes sociales, clase srm-social) ---------- */
.srm-footer h2 + .et_pb_social_media_follow, .srm-footer .srm-social { margin-top: 4px; }
.srm-footer .srm-social li.et_pb_social_icon { margin: 0 10px 10px 0 !important; }
.srm-footer .srm-social li a.icon { background: transparent !important; border: 1px solid #6a6a66 !important; border-radius: 999px !important; width: 40px; height: 40px; display: inline-flex !important; align-items: center; justify-content: center; transition: background .2s, border-color .2s; }
.srm-footer .srm-social li a.icon::before { color: #fff !important; font-size: 18px !important; line-height: 40px !important; width: 40px !important; height: 40px !important; }
.srm-footer .srm-social li a.icon:hover, .srm-footer .srm-social li a.icon:focus-visible { background: var(--srm-orange) !important; border-color: var(--srm-orange) !important; }
.srm-footer .srm-social a:hover { text-decoration: none !important; }

/* ---------- 38. Regla de fondos (cliente) ----------
   - Secciones SOLO de texto: pueden llevar color de fondo (gris, oscuro, naranja).
   - Secciones con imágenes de fondo blanco: fondo BLANCO, salvo que la imagen vaya dentro de un recuadro (tarjeta).
   - Inicio (hero, solo texto): gris de marca. */
.et_pb_section.srm-hero--center { background: #E6E6E6 !important; }
.srm-hero--center .srm-lead, .srm-hero--center .srm-lead p, .srm-hero--center .srm-microcopy, .srm-hero--center .srm-microcopy li { color: #555451 !important; }
.srm-footer .srm-social { display: flex; flex-wrap: wrap; gap: 8px; }
.srm-footer .srm-social li.et_pb_social_icon { margin: 0 !important; }
.srm-footer .srm-social li a.icon, .srm-footer .srm-social li a.icon::before { width: 36px !important; height: 36px !important; line-height: 36px !important; font-size: 16px !important; }

/* ---------- 39. Mega Menu: cada opción del submenú en una sola línea ---------- */
@media (min-width: 981px) {
  .et-l--header [id^="mega-menu-wrap-"] ul.mega-sub-menu { width: max-content !important; min-width: 260px; max-width: 92vw; }
  .et-l--header [id^="mega-menu-wrap-"] ul.mega-sub-menu li.mega-menu-item a.mega-menu-link { white-space: nowrap !important; }
}

/* ---------- 40. Título del formulario visible sobre la tarjeta blanca ---------- */
body .srm-bg-orange .srm-form h3.et_pb_contact_main_title, body .srm-form h3.et_pb_contact_main_title { color: var(--srm-ink) !important; }

/* ---------- 41. Píldora "Tienda SRM" igual a "Cotizar" y alineada con los textos del menú ---------- */
.et-l--header [id^="mega-menu-"] > li.mega-menu-item:has(> a.mega-menu-link:is([href*="tiendasrm" i], [href*="Tienda2"])),
.et-l--header [id^="mega-menu-"] > li.mega-menu-item.srm-menu-destacado { vertical-align: top !important; }
.et-l--header [id^="mega-menu-"] > li.mega-menu-item > a.mega-menu-link:is([href*="tiendasrm" i], [href*="Tienda2"]),
.et-l--header [id^="mega-menu-"] > li.mega-menu-item.srm-menu-destacado > a.mega-menu-link {
  background: var(--srm-orange) !important; color: #fff !important; font-weight: 700 !important; font-size: 16px !important;
  height: 48px !important; line-height: 48px !important; margin-top: 8px !important; padding: 0 22px !important;
  box-shadow: none !important;
}
.et-l--header [id^="mega-menu-"] > li.mega-menu-item > a.mega-menu-link:is([href*="tiendasrm" i], [href*="Tienda2"]):hover,
.et-l--header [id^="mega-menu-"] > li.mega-menu-item.srm-menu-destacado > a.mega-menu-link:hover { background: var(--srm-orange-ink) !important; color: #fff !important; }
/* Íconos de «Síguenos» más grandes */
.srm-footer .srm-social { gap: 12px; }
.srm-footer .srm-social li a.icon, .srm-footer .srm-social li a.icon::before { width: 48px !important; height: 48px !important; line-height: 48px !important; font-size: 22px !important; }
.srm-footer .srm-social { flex-wrap: nowrap; width: max-content; max-width: none; }
/* «Síguenos» en bloque propio, centrado, una sola fila */
.srm-footer .srm-footer-social { text-align: center; }
.srm-footer .srm-footer-social .srm-social { margin: 8px auto 0 !important; justify-content: center; flex-wrap: wrap; width: auto; }

/* ---------- 42. H1 del inicio: primera línea siempre en una sola línea ---------- */
@media (min-width: 600px) {
  .srm-hero--center h1 { white-space: nowrap; width: max-content; max-width: 94vw; position: relative; left: 50%; transform: translateX(-50%); font-size: min(86px, 6.6vw) !important; }
  .srm-hero--center h1 .srm-accent { white-space: nowrap; }
}

/* ---------- 43. Texto de entrada (srm-lead) más pequeño: ~17–19 px ---------- */
.srm-lead, .srm-lead p { font-size: clamp(1.0625rem, .95rem + .3vw, 1.1875rem) !important; line-height: 1.6 !important; }

/* ---------- 44. Franja de cifras (sección srm-stats-band, fondo naranja de marca oscuro) ---------- */
.et_pb_section.srm-stats-band { padding: clamp(28px, 4vw, 48px) 0 !important; }
.srm-stats-band .et_pb_row { padding: 0 !important; }
.srm-stats-band .et_pb_text.srm-stat { border-left: 0 !important; padding-left: 0 !important; }
.srm-stats-band .srm-stat .srm-stat-num { color: #fff !important; }
.srm-stats-band .srm-stat p:last-child { color: #FFE3D6 !important; font-size: 1rem; }
.srm-stats-band .srm-stats-row, .srm-stats-band .et_pb_row { border: 0 !important; margin-top: 0 !important; }
/* Franja de cifras en el naranja puro del logo (#E84E0F). Etiquetas blancas ≥19px semibold = texto grande (contraste AA 3:1). */
.et_pb_section.srm-stats-band { background-color: var(--srm-orange) !important; }
.srm-stats-band .srm-stat p:last-child { color: #fff !important; font-size: 1.1875rem !important; font-weight: 600 !important; }

/* ---------- 45. Marco de los tiles con foto: más grueso y naranja de marca ---------- */
.et_pb_blurb.srm-tile--photo, .srm-bg-cream .et_pb_blurb.srm-tile--photo { border: 3px solid var(--srm-orange) !important; }
.et_pb_blurb.srm-tile--photo:hover { border-color: var(--srm-orange-ink) !important; }

/* ---------- 46. Paleta complementaria de fondos (solo secciones de texto) ----------
   Uso: Sección → Avanzado → Clase CSS: srm-bg-petroleo | srm-bg-frambuesa | srm-bg-marino | srm-bg-ladrillo (texto blanco)
                                         srm-bg-mostaza | srm-bg-celeste | srm-bg-aguamarina | srm-bg-menta (texto negro)
   También están como colores globales en el selector de color del Visual Builder. */
:root {
  --srm-petroleo: #28605F; --srm-frambuesa: #CB4077; --srm-marino: #1C4F7D; --srm-ladrillo: #9B2816;
  --srm-mostaza: #D7B954; --srm-celeste: #71CEDC; --srm-aguamarina: #74D6CD; --srm-menta: #74D7BE;
}
.et_pb_section.srm-bg-petroleo { background-color: var(--srm-petroleo) !important; }
.et_pb_section.srm-bg-frambuesa { background-color: var(--srm-frambuesa) !important; }
.et_pb_section.srm-bg-marino { background-color: var(--srm-marino) !important; }
.et_pb_section.srm-bg-ladrillo { background-color: var(--srm-ladrillo) !important; }
.et_pb_section.srm-bg-mostaza { background-color: var(--srm-mostaza) !important; }
.et_pb_section.srm-bg-celeste { background-color: var(--srm-celeste) !important; }
.et_pb_section.srm-bg-aguamarina { background-color: var(--srm-aguamarina) !important; }
.et_pb_section.srm-bg-menta { background-color: var(--srm-menta) !important; }
/* Fondos oscuros → texto blanco; segunda línea del título en durazno */
:is(.srm-bg-petroleo, .srm-bg-frambuesa, .srm-bg-marino, .srm-bg-ladrillo),
:is(.srm-bg-petroleo, .srm-bg-frambuesa, .srm-bg-marino, .srm-bg-ladrillo) :is(h1, h2, h3, h4, p, li, .srm-lead, .srm-lead p, .srm-microcopy, .srm-eyebrow p) { color: #fff !important; }
:is(.srm-bg-petroleo, .srm-bg-frambuesa, .srm-bg-marino, .srm-bg-ladrillo) :is(h1, h2) .srm-accent { color: #FFD3BF !important; }
:is(.srm-bg-petroleo, .srm-bg-frambuesa, .srm-bg-marino, .srm-bg-ladrillo) a:not(.et_pb_button) { color: #fff !important; text-decoration: underline; }
/* Fondos claros → texto negro de marca; segunda línea del título en negro (más pequeña, como siempre) */
:is(.srm-bg-mostaza, .srm-bg-celeste, .srm-bg-aguamarina, .srm-bg-menta),
:is(.srm-bg-mostaza, .srm-bg-celeste, .srm-bg-aguamarina, .srm-bg-menta) :is(h1, h2, h3, h4, p, li, .srm-lead, .srm-lead p, .srm-microcopy, .srm-eyebrow p) { color: var(--srm-ink) !important; }
:is(.srm-bg-mostaza, .srm-bg-celeste, .srm-bg-aguamarina, .srm-bg-menta) :is(h1, h2) .srm-accent { color: var(--srm-ink) !important; opacity: .85; }
:is(.srm-bg-mostaza, .srm-bg-celeste, .srm-bg-aguamarina, .srm-bg-menta) a:not(.et_pb_button) { color: var(--srm-ink) !important; text-decoration: underline; }

/* ---------- 47. Paleta complementaria: detalles de legibilidad (destacados, botones, imágenes) ---------- */
:is(.srm-bg-petroleo, .srm-bg-frambuesa, .srm-bg-marino, .srm-bg-ladrillo) :is(strong, .srm-highlight p:first-child strong) { color: #fff !important; }
:is(.srm-bg-petroleo, .srm-bg-frambuesa, .srm-bg-marino, .srm-bg-ladrillo) .srm-highlight p:not(:first-child) { color: #E8F0EF !important; }
:is(.srm-bg-petroleo, .srm-bg-frambuesa, .srm-bg-marino, .srm-bg-ladrillo) .srm-eyebrow p { color: #FFD3BF !important; }
:is(.srm-bg-mostaza, .srm-bg-celeste, .srm-bg-aguamarina, .srm-bg-menta) :is(strong, .srm-highlight p) { color: var(--srm-ink) !important; }
:is(.srm-bg-mostaza, .srm-bg-celeste, .srm-bg-aguamarina, .srm-bg-menta) .srm-eyebrow p { color: var(--srm-ink) !important; opacity: .8; }
/* Botón secundario (contorno): blanco en fondos oscuros, negro en fondos claros */
body :is(#page-container, #et-boc, #et-fb-app) :is(.srm-bg-petroleo, .srm-bg-frambuesa, .srm-bg-marino, .srm-bg-ladrillo) .et_pb_button.srm-btn--ghost { background: transparent !important; color: #fff !important; border-color: #fff !important; }
body :is(#page-container, #et-boc, #et-fb-app) :is(.srm-bg-petroleo, .srm-bg-frambuesa, .srm-bg-marino, .srm-bg-ladrillo) .et_pb_button.srm-btn--ghost:hover { background: #fff !important; color: var(--srm-ink) !important; }
body :is(#page-container, #et-boc, #et-fb-app) :is(.srm-bg-mostaza, .srm-bg-celeste, .srm-bg-aguamarina, .srm-bg-menta) .et_pb_button.srm-btn--ghost { background: transparent !important; color: var(--srm-ink) !important; border-color: var(--srm-ink) !important; }
body :is(#page-container, #et-boc, #et-fb-app) :is(.srm-bg-mostaza, .srm-bg-celeste, .srm-bg-aguamarina, .srm-bg-menta) .et_pb_button.srm-btn--ghost:hover { background: var(--srm-ink) !important; color: #fff !important; }
/* La foto (fondo blanco) va como recuadro blanco redondeado sobre el color */
:is(.srm-bg-petroleo, .srm-bg-frambuesa, .srm-bg-marino, .srm-bg-ladrillo, .srm-bg-mostaza, .srm-bg-celeste, .srm-bg-aguamarina, .srm-bg-menta) .srm-feature-media img { background: #fff !important; mix-blend-mode: normal !important; border-radius: var(--srm-radius-xl, 28px); }

/* ---------- 48. Destacados con ícono en recuadro (Blurb → clase srm-highlight-card) ----------
   El ícono va en un círculo blanco para leerse sobre cualquier fondo (blanco, gris o paleta complementaria). */
.et_pb_blurb.srm-highlight-card { border: 1.5px solid rgba(255,255,255,.45); border-radius: var(--srm-radius, 20px); padding: clamp(20px, 2.2vw, 28px) !important; height: 100%; background: rgba(255,255,255,.06); }
.srm-section:not(:is(.srm-bg-petroleo, .srm-bg-frambuesa, .srm-bg-marino, .srm-bg-ladrillo, .srm-bg-dark, .srm-bg-orange)) .et_pb_blurb.srm-highlight-card { border-color: var(--srm-ink); background: transparent; }
.srm-highlight-card .et_pb_main_blurb_image { margin: 0 0 14px !important; text-align: left !important; width: auto !important; }
.srm-highlight-card .et_pb_main_blurb_image .et_pb_image_wrap { display: inline-flex; width: 52px !important; height: 52px; border-radius: 50%; background: #fff; align-items: center; justify-content: center; }
.srm-highlight-card .et_pb_main_blurb_image img { width: 28px !important; height: 28px; }
.srm-highlight-card .et_pb_module_header { font-size: 1.15rem !important; font-weight: 600; padding-bottom: 6px !important; }
.srm-highlight-card .et_pb_blurb_description p { font-size: 1rem; line-height: 1.55; }
.srm-highlight-card .et_pb_blurb_content { max-width: none !important; text-align: left; }

/* ---------- 49. Franja de clientes sobre color de la paleta: sin líneas grises, nombres legibles ---------- */
:is(.srm-bg-petroleo, .srm-bg-frambuesa, .srm-bg-marino, .srm-bg-ladrillo, .srm-bg-mostaza, .srm-bg-celeste, .srm-bg-aguamarina, .srm-bg-menta).srm-trustbar { border: 0 !important; }
:is(.srm-bg-mostaza, .srm-bg-celeste, .srm-bg-aguamarina, .srm-bg-menta) .srm-clients li { color: var(--srm-ink) !important; opacity: .78; }
:is(.srm-bg-petroleo, .srm-bg-frambuesa, .srm-bg-marino, .srm-bg-ladrillo) .srm-clients li { color: #fff !important; opacity: .85; }

/* ---------- 50. Gris suave de marca (#E6E6E6) como fondo de sección: clase srm-bg-gris ---------- */
.et_pb_section.srm-bg-gris { background-color: #E6E6E6 !important; }
.srm-bg-gris.srm-trustbar { border: 0 !important; }
.srm-bg-gris .srm-clients li { color: #5f5e5c !important; }
.srm-bg-gris .srm-lead, .srm-bg-gris .srm-lead p, .srm-bg-gris .srm-microcopy, .srm-bg-gris .srm-microcopy p { color: #555451 !important; }

/* ---------- 51. Recuadros de marcas: reborde gris ---------- */
.et_pb_blurb.srm-tile--brand, .srm-bg-cream .et_pb_blurb.srm-tile--brand { border: 2px solid #C4C4C4 !important; }
.et_pb_blurb.srm-tile--brand:hover { border-color: var(--srm-gray, #878787) !important; }

/* ---------- 52. Quiénes somos: línea de tiempo, listado de clientes y sectores ---------- */
.srm-timeline { position: relative; border-left: 2px solid var(--srm-orange); padding-left: clamp(20px, 3vw, 36px) !important; }
.et_pb_text.srm-tl-item { position: relative; margin-bottom: clamp(24px, 3vw, 36px) !important; }
.srm-tl-item::before { content: ""; position: absolute; left: calc(-1 * clamp(20px, 3vw, 36px) - 8px); top: 10px; width: 14px; height: 14px; border-radius: 50%; background: var(--srm-orange); box-shadow: 0 0 0 4px #E6E6E6; }
.srm-tl-item .srm-tl-year { font-family: var(--srm-font-head); font-weight: 600; font-size: clamp(1.6rem, 1.2rem + 1.2vw, 2.2rem); color: var(--srm-orange-ink); line-height: 1; padding-bottom: 6px; }
.srm-tl-item h3 { font-size: 1.25rem !important; padding-bottom: 6px; }
.srm-tl-item p:last-child { color: #555451; }
.srm-clients-all { columns: 3 220px; column-gap: 32px; list-style: none !important; padding: 0 !important; font-size: .95rem; }
.srm-clients-all li { break-inside: avoid; padding: 3px 0 !important; color: var(--srm-ink); }
.srm-chips { list-style: none !important; padding: 0 !important; display: flex; flex-wrap: wrap; gap: 8px; }
.srm-chips li { border: 1.5px solid #C4C4C4; border-radius: 999px; padding: 6px 14px !important; font-size: .9rem; background: #fff; }
.srm-acc-clients .et_pb_toggle { background: #fff !important; border: 2px solid #C4C4C4 !important; border-radius: var(--srm-radius, 20px); margin-bottom: 12px !important; }
.srm-acc-clients .et_pb_toggle_title { color: var(--srm-ink) !important; }

/* ---------- 53. Páginas de producto: fichas técnicas, chips centrados y checklist ---------- */
.et_pb_text.srm-spec-card { background: #fff; border: 2px solid #C4C4C4; border-radius: var(--srm-radius, 20px); padding: clamp(20px, 2.4vw, 30px) !important; height: 100%; }
.srm-spec-card h3 { font-size: 1.2rem !important; padding-bottom: 10px; color: var(--srm-ink); }
.srm-spec-card ul { padding-left: 1.1em !important; margin: 0; }
.srm-spec-card li { font-size: .98rem; line-height: 1.55; color: #3d3c39; padding-bottom: 6px; }
.srm-chips--center { justify-content: center; margin-top: 8px !important; }
.srm-checklist { list-style: none !important; padding: 0 !important; }
.srm-checklist li { position: relative; padding: 0 0 10px 30px !important; }
.srm-checklist li::before { content: "✓"; position: absolute; left: 0; top: 0; font-weight: 700; }
.srm-bg-orange .srm-checklist li, .srm-bg-orange .srm-checklist li::before { color: #fff; }

/* ---------- 54. Imágenes en su formato original (clase srm-natural): nunca recortar ni deformar ----------
   Regla del cliente: usar las gráficas de Medios tal como fueron diseñadas (rectangulares, cuadradas, banners). */
.et_pb_image.srm-natural, .et_pb_image.srm-natural .et_pb_image_wrap { width: 100%; }
.et_pb_image.srm-natural img { width: 100% !important; height: auto !important; aspect-ratio: auto !important; object-fit: initial !important; }
.et_pb_image.srm-hero-banner { margin-top: clamp(24px, 4vw, 48px) !important; }
.et_pb_image.srm-hero-banner img, .et_pb_image.srm-photo-card img, .et_pb_image.srm-logo-card img { border-radius: var(--srm-radius-xl, 28px); background: #fff; }
.et_pb_image.srm-logo-card img { padding: clamp(16px, 3vw, 36px); box-sizing: border-box; }
.srm-contact-lines p { padding-bottom: 4px !important; }

/* ---------- 55. Miniaturas y accesos rápidos (páginas de producto) ---------- */
.srm-row-narrow-imgs { max-width: 720px !important; }
.et_pb_image.srm-thumb img { box-shadow: none !important; border: 2px solid #C4C4C4; }
.srm-chips--nav li { padding: 0 !important; border-color: var(--srm-orange) !important; }
.srm-chips--nav li a { display: inline-block; padding: 6px 14px; color: var(--srm-orange-ink) !important; font-weight: 600; text-decoration: none !important; }
.srm-chips--nav li:hover { background: var(--srm-orange) !important; }
.srm-chips--nav li:hover a { color: #fff !important; }
.srm-bg-gris .srm-chips li { background: #fff; }
.srm-lead .srm-chips { margin-top: 10px !important; }
.srm-lead .srm-chips li { font-size: .88rem !important; line-height: 1.3; }
/* Texto de entrada alineado con su título en columnas que no son centradas */
.et_pb_column:not(.srm-center-col) .et_pb_text.srm-lead:not(.srm-center) { margin-left: 0 !important; }
.srm-checklist--2col { columns: 2 280px; column-gap: 40px; }
.srm-checklist--2col li { break-inside: avoid; }
.srm-checklist li::before { color: var(--srm-orange); }
.srm-bg-orange .srm-checklist li::before { color: #fff; }
/* Recuadros con ícono compactos (5 por fila) */
.et_pb_blurb.srm-highlight-card--sm { padding: 18px !important; }
.srm-highlight-card--sm .et_pb_module_header { font-size: 1.02rem !important; }
.srm-highlight-card--sm .et_pb_blurb_description p { font-size: .92rem; }
.srm-highlight-card--sm .et_pb_main_blurb_image .et_pb_image_wrap { width: 44px !important; height: 44px; }
.srm-highlight-card--sm .et_pb_main_blurb_image img { width: 24px !important; height: 24px; }

/* ---------- 56. Tarjetas con banner, lista de servicios y lista de enlaces ---------- */
.et_pb_text.srm-banner-card-text { margin-top: 16px !important; }
.srm-banner-card-text p:first-child { font-family: var(--srm-font-head); font-size: .8rem; letter-spacing: .14em; text-transform: uppercase; color: var(--srm-orange-ink); padding-bottom: 4px; }
.srm-banner-card-text h3 { font-size: 1.35rem !important; padding-bottom: 6px; }
.srm-service-list li { padding-bottom: 14px !important; line-height: 1.5; }
.srm-link-list { list-style: none !important; padding: 0 !important; }
.srm-link-list li { border-bottom: 1px solid #DADADA; padding: 14px 0 !important; }
.srm-link-list a { color: var(--srm-ink) !important; font-weight: 600; text-decoration: none; }
.srm-link-list a:hover { color: var(--srm-orange-ink) !important; }
.et_pb_text:has(.srm-service-list), .et_pb_text:has(.srm-service-list) .et_pb_text_inner { max-width: none !important; width: 100% !important; }
.srm-service-list { columns: 2 340px !important; column-gap: 48px !important; }
.et_pb_text.srm-group-title { margin-top: clamp(24px, 3vw, 40px) !important; }
.srm-group-title h3 { font-size: 1.15rem !important; letter-spacing: .02em; color: var(--srm-orange-ink) !important; }

/* ---------- 57. Galería e instructivos (páginas de servicio) ---------- */
.srm-gallery-row .et_pb_column { margin-bottom: 18px !important; }
.et_pb_image.srm-gallery-item img { box-shadow: none !important; border: 2px solid #fff; }
.et_pb_image.srm-gallery-item a:hover img { border-color: var(--srm-orange); }
.et_pb_image.srm-instructivo { max-width: 320px; margin-left: auto !important; margin-right: auto !important; }
.srm-spec-card + .srm-spec-card, .et_pb_image + .srm-spec-card { margin-top: 16px !important; }

/* ---------- 58. Columnas con color de fondo (clase de columna srm-col-card + srm-col--<color>) ---------- */
.et_pb_column.srm-col-card { border-radius: var(--srm-radius-xl, 28px); padding: clamp(24px, 3vw, 40px) !important; text-align: center; }
.et_pb_column.srm-col--petroleo { background: var(--srm-petroleo); }
.et_pb_column.srm-col--marino { background: var(--srm-marino); }
.et_pb_column.srm-col--frambuesa { background: var(--srm-frambuesa); }
.et_pb_column.srm-col--ladrillo { background: var(--srm-ladrillo); }
:is(.srm-col--petroleo, .srm-col--marino, .srm-col--frambuesa, .srm-col--ladrillo) :is(h3, p) { color: #fff !important; }
.srm-col-card .srm-col-text { margin-bottom: 18px !important; }
.srm-col-card .srm-col-text h3 { font-size: 1.4rem !important; padding-bottom: 8px; }
.srm-col-card .et_pb_image.srm-instructivo { margin-bottom: 20px !important; }
.srm-col-card .et_pb_text.srm-col-text, .srm-col-card .et_pb_text.srm-col-text * { text-align: center !important; }

/* ---------- 59. Texto sobre la franja blanca de una cabecera (columna srm-banner-wrap + texto srm-banner-band) ---------- */
.et_pb_column.srm-banner-wrap { position: relative; }
.et_pb_text.srm-banner-band { position: absolute !important; left: 0; right: 0; top: calc(clamp(24px, 4vw, 48px) + 36.5%); height: 28%; margin: 0 !important; display: flex; align-items: center; pointer-events: none; }
.srm-banner-band .et_pb_text_inner, .srm-banner-band p { width: 100%; height: 100%; padding: 0 !important; display: flex; }
.srm-banner-band span { flex: 1; display: flex; align-items: center; justify-content: center; font-family: var(--srm-font-head); font-weight: 600; text-transform: uppercase; letter-spacing: .04em; font-size: clamp(1.1rem, 3.4vw, 3rem); color: #7d7d7d; }
.et_pb_column.srm-banner-wrap { margin-top: clamp(24px, 4vw, 48px) !important; }
.srm-banner-wrap .et_pb_image.srm-hero-banner { margin: 0 !important; }
.et_pb_text.srm-banner-band { top: 36.5% !important; }

/* ---------- 60. Galería en mosaico (columna srm-bento; imagen grande = srm-bento-lg) ---------- */
.et_pb_column.srm-bento { display: grid !important; grid-template-columns: repeat(4, 1fr); gap: clamp(10px, 1.4vw, 18px); grid-auto-flow: dense; }
.et_pb_column.srm-bento::after { display: none !important; }
.srm-bento > .et_pb_module { margin: 0 !important; width: 100% !important; }
.srm-bento > .srm-bento-lg { grid-column: span 2; grid-row: span 2; }
.srm-bento .et_pb_image img { border-radius: 18px; box-shadow: none !important; transition: transform .25s ease; }
.srm-bento .et_pb_image a:hover img { transform: scale(1.02); }
@media (max-width: 767px) { .et_pb_column.srm-bento { grid-template-columns: repeat(2, 1fr); } }

/* ---------- 61. Impresión: título de franja, sellos/certificado, pasos y tiles con pie ---------- */
.srm-band-title p { color: #fff !important; font-weight: 600; font-size: clamp(1.05rem, 1.6vw, 1.3rem); }
.et_pb_image.srm-cert { max-width: 280px; margin-left: auto !important; margin-right: auto !important; }
.srm-steps-list { padding-left: 1.2em !important; }
.srm-steps-list li { padding-bottom: 8px; }
.srm-bg-orange .srm-steps-list li { color: #fff; }
.srm-tile--caption .et_pb_blurb_description:empty, .srm-tile--caption .et_pb_blurb_description p:empty { display: none; }
.srm-tile--caption .et_pb_module_header { font-size: 1.05rem !important; }
.srm-band-title h3 { color: #fff !important; font-size: 1.2rem !important; margin-top: 12px; }
.srm-bg-orange .et_pb_blurb.srm-highlight-card { border-color: rgba(255,255,255,.6); background: rgba(255,255,255,.08); }
.srm-bg-orange .srm-highlight-card :is(h4, .et_pb_module_header, p) { color: #fff !important; }

/* ---------- 62. Video de cabecera (texto srm-video-wrap con <video>) — formato original 16:9 ---------- */
.et_pb_text.srm-video-wrap .et_pb_text_inner { max-width: none !important; }
.srm-video-wrap video.srm-hero-video { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; border-radius: var(--srm-radius-xl, 28px); background: #E6E6E6; }
/* Imagen con el ancho del título que le sigue (clase srm-title-width) */
.et_pb_image.srm-title-width { max-width: min(100%, 760px) !important; margin: 0 auto clamp(20px, 3vw, 36px) !important; }
/* Aire entre el título de una franja y sus cifras */
.srm-stats-band .et_pb_text.srm-band-title { margin-bottom: clamp(24px, 3.5vw, 44px) !important; }
.et_pb_image.srm-title-width { max-width: min(100%, 580px) !important; }

/* ---------- 63. Imagen a todo el ancho pegada al bloque anterior (sección srm-banner-full) ---------- */
.et_pb_section.srm-banner-full { padding: 0 !important; background: #fff; }
.srm-banner-full .et_pb_row.srm-row-full { width: 100% !important; max-width: none !important; padding: 0 !important; }
.srm-banner-full .et_pb_column { margin: 0 !important; }
.et_pb_image.srm-full-img { margin: 0 !important; width: 100% !important; max-width: none !important; }
.et_pb_image.srm-full-img .et_pb_image_wrap, .et_pb_image.srm-full-img img { display: block; width: 100% !important; height: auto !important; border-radius: 0 !important; box-shadow: none !important; }
.et_pb_section.srm-hero:has(+ .srm-banner-full) { padding-bottom: 0 !important; }
.et_pb_section.srm-hero:has(+ .srm-banner-full) .et_pb_row:last-child { padding-bottom: 0 !important; margin-bottom: 0 !important; }
.et_pb_section.srm-hero:has(+ .srm-banner-full) .srm-video-wrap { margin-bottom: 0 !important; }
.et_pb_section.srm-hero:has(+ .srm-banner-full) .srm-video-wrap video.srm-hero-video { border-radius: var(--srm-radius-xl, 28px) var(--srm-radius-xl, 28px) 0 0; }

/* ---------- 64. Tiles con pie (srm-tile--caption): mismo tamaño con o sin enlace, sin cortar palabras, altura pareja y compacta ---------- */
/* La columna estira el tile (flex) en vez de height fijo: así el pie nunca se corta */
.et_pb_column:has(> .srm-tile--caption) { display: flex !important; flex-direction: column; }
.et_pb_blurb.srm-tile--caption { padding-bottom: 0 !important; display: flex !important; flex-direction: column; height: auto !important; flex: 1 0 auto; }
.srm-tile--caption .et_pb_main_blurb_image { margin-bottom: 0 !important; }
.srm-tile--caption .et_pb_blurb_content { display: flex !important; flex-direction: column; height: auto !important; flex: 1 0 auto; }
.srm-tile--caption .et_pb_blurb_container { flex: 1; display: flex; flex-direction: column; padding: 14px 18px 16px !important; }
.srm-tile--caption .et_pb_module_header, .srm-tile--caption .et_pb_module_header a { font-size: clamp(.95rem, 1.1vw, 1.05rem) !important; line-height: 1.3 !important; word-break: normal !important; overflow-wrap: normal !important; hyphens: manual !important; padding-bottom: 4px !important; margin: 0 !important; }
.srm-tile--caption .et_pb_blurb_description { margin-top: auto; }
.srm-tile--caption .et_pb_blurb_description p { padding: 0 !important; margin: 0 !important; }
.srm-tile--caption .srm-card-link { font-size: .9rem !important; }

/* ---------- 65. Palabras compuestas que no deben partirse (Impresión-Arte, pre-ensamblan…) ---------- */
.srm-nowrap { white-space: nowrap; }

/* ---------- 66. Tarjetas de proceso en columna de color (requisitos de archivos por proceso) ---------- */
.srm-col-card .srm-proc-card h3 { font-size: clamp(1.7rem, 2.3vw, 2.1rem) !important; line-height: 1.15 !important; padding-bottom: 12px !important; margin-bottom: 12px !important; border-bottom: 2px solid rgba(255,255,255,.6); }
.srm-col-card .srm-proc-card .srm-col-sub { font-size: 1.02rem; opacity: .85; padding-bottom: 12px !important; }
.srm-col-card .srm-proc-card ul { padding-left: 1.1em !important; margin: 0; }
.srm-col-card .srm-proc-card li { color: #fff !important; font-size: clamp(1.05rem, 1.15vw, 1.15rem); line-height: 1.5; padding-bottom: 8px; }

/* ---------- 67. Filas de 5 tarjetas pequeñas entre 981 y 1239 px: menos medianil para que las palabras no se partan ---------- */
@media (min-width: 981px) and (max-width: 1239px) {
  .srm-highlights.et_pb_row_5col > .et_pb_column { width: 18.4% !important; margin-right: 2% !important; }
  .srm-highlights.et_pb_row_5col > .et_pb_column:last-child { margin-right: 0 !important; }
  .srm-highlights.et_pb_row_5col .srm-highlight-card { padding: 14px !important; }
}

/* ---------- 68. Borde de tarjeta en los colores de la paleta (clase srm-border--<color>) ---------- */
.srm-border--petroleo { border-color: var(--srm-petroleo) !important; }
.srm-border--frambuesa { border-color: var(--srm-frambuesa) !important; }
.srm-border--marino { border-color: var(--srm-marino) !important; }
.srm-border--ladrillo { border-color: var(--srm-ladrillo) !important; }
.srm-border--mostaza { border-color: var(--srm-mostaza) !important; }
.srm-border--celeste { border-color: var(--srm-celeste) !important; }
.srm-border--aguamarina { border-color: var(--srm-aguamarina) !important; }
.srm-border--menta { border-color: var(--srm-menta) !important; }
.srm-border--orange { border-color: var(--srm-orange) !important; }
:is(.srm-border--petroleo, .srm-border--frambuesa, .srm-border--marino, .srm-border--ladrillo, .srm-border--mostaza, .srm-border--celeste, .srm-border--aguamarina, .srm-border--menta, .srm-border--orange) { border-width: 3px !important; border-style: solid !important; }

/* ---------- 69. Icono alusivo en el título de cada proceso ---------- */
.srm-col-card .srm-proc-card h3 { display: flex; align-items: center; gap: 14px; }
.srm-proc-ico { width: clamp(38px, 3vw, 46px) !important; height: auto; flex: 0 0 auto; }
/* Tarjetas de requisitos generales en «Cómo preparar tus archivos»: mismo tamaño de texto que las guías por proceso */
.srm-track-archivos .srm-spec-card h3 { font-size: clamp(1.25rem, 1.6vw, 1.45rem) !important; }
.srm-track-archivos .srm-spec-card li { font-size: clamp(1.05rem, 1.15vw, 1.15rem); line-height: 1.5; }

/* ---------- 70. Video de YouTube embebido (iframe.srm-yt dentro de srm-video-wrap) — 16:9 ---------- */
.srm-video-wrap iframe.srm-yt { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; border: 0; border-radius: var(--srm-radius-xl, 28px); background: #111; }
.srm-col-card .srm-proc-card p strong { color: #fff; }

/* ---------- 71. Separación clara entre menú y contenido (pedido del cliente): fondo casi opaco + línea inferior + sombra suave ---------- */
.et_pb_section.srm-header, .et_pb_section.srm-header--glass {
  background: rgba(255, 255, 255, .97) !important;
  border-bottom: 2px solid #D9D9D9 !important;
  box-shadow: 0 6px 18px -10px rgba(29, 29, 24, .28) !important;
}

/* ---------- 72. Tarjetas con ícono sobre fondos claros: reborde gris (regla del cliente) y círculo del ícono visible ---------- */
.srm-section:not(:is(.srm-bg-petroleo, .srm-bg-frambuesa, .srm-bg-marino, .srm-bg-ladrillo, .srm-bg-dark, .srm-bg-orange)) .et_pb_blurb.srm-highlight-card { border: 2px solid #C4C4C4 !important; background: #fff; }
.srm-section:not(:is(.srm-bg-petroleo, .srm-bg-frambuesa, .srm-bg-marino, .srm-bg-ladrillo, .srm-bg-dark, .srm-bg-orange)) .srm-highlight-card .et_pb_main_blurb_image .et_pb_image_wrap { background: #FCE9DF; }
.srm-col-card .srm-proc-card p:not(.srm-col-sub) { font-size: clamp(1.05rem, 1.15vw, 1.15rem); line-height: 1.5; }

/* ---------- 73. Cotizador 3D (plugin [cotizador_3d], contenedor #p3dc): título responsivo y menos relleno en celular ---------- */
/* Los títulos del plugin van en su azul (#0f3460) aunque la sección sea de color: si no, quedan blancos sobre la tarjeta blanca */
#p3dc :is(h1, h2, h3, h4, h5, h6) { color: #0f3460 !important; font-size: clamp(1.2rem, 2vw, 1.35rem) !important; white-space: normal !important; line-height: 1.2 !important; }
/* Encabezados de la tabla de resultados: blancos sobre la franja azul del plugin (Divi los pone grises) */
#p3dc thead th, #p3dc tr[style*="background"] th { color: #fff !important; }
@media (max-width: 600px) { #p3dc #p3dc-form { padding: 18px !important; } }

/* ---------- 74. Bloques compactos (recordatorios antes de una herramienta, p. ej. el cotizador 3D) ---------- */
.et_pb_text.srm-compact { padding: clamp(18px, 2vw, 26px) clamp(20px, 2.4vw, 30px) !important; height: auto; }
.srm-compact h3 { font-size: clamp(1.15rem, 1.5vw, 1.3rem) !important; padding-bottom: 10px !important; }
ul.srm-checklist { list-style: none !important; padding: 0 !important; margin: 0; }
ul.srm-checklist li { position: relative; padding: 0 0 8px 30px !important; font-size: 1.02rem; line-height: 1.5; }
ul.srm-checklist li::before { position: absolute; left: 0; top: 0; width: 22px; height: 22px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 700; color: #fff; }
ul.srm-checklist li.si::before { content: "✓"; background: var(--srm-petroleo); }
ul.srm-checklist li.no::before { content: "✕"; background: var(--srm-ladrillo); }
ul.srm-mat-mini { list-style: none !important; padding: 0 !important; margin: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px 22px; }
ul.srm-mat-mini li { padding: 0 !important; font-size: .95rem; line-height: 1.4; }
ul.srm-mat-mini li strong { display: block; color: var(--srm-ink); }
@media (max-width: 767px) { ul.srm-mat-mini { grid-template-columns: repeat(2, 1fr); } }
.srm-mat-more { font-size: .92rem; padding-top: 12px !important; }
.et_pb_image.srm-img-compact { max-width: 380px; margin-left: auto !important; margin-right: auto !important; }
/* En dos columnas, el recordatorio de materiales va en 2 columnas internas */
.et_pb_column_1_2 ul.srm-mat-mini { grid-template-columns: repeat(2, 1fr); }
@media (max-width: 420px) { ul.srm-mat-mini { grid-template-columns: 1fr; } }
/* Tarjetas compactas lado a lado: misma altura */
.srm-equal .et_pb_text.srm-compact { height: 100% !important; }
/* Recordatorios del cotizador: mismo tamaño de texto en ambas tarjetas */
ul.srm-mat-mini li, ul.srm-checklist li, .srm-mat-note { font-size: 1rem !important; line-height: 1.45; }
.srm-mat-note { padding-bottom: 12px !important; }

/* ---------- 75. Checklist moderno: ícono de línea fina sobre cuadro redondeado suave (reemplaza los círculos ✓ ✕) ---------- */
ul.srm-checklist li { padding-left: 38px !important; padding-bottom: 12px !important; }
ul.srm-checklist li::before { content: "" !important; top: 0; width: 26px; height: 26px; border-radius: 8px; background-repeat: no-repeat; background-position: center; background-size: 16px 16px; }
ul.srm-checklist li.si::before { background-color: #E4EFEE; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2328605F' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E"); }
ul.srm-checklist li.no::before { background-color: #F6E4E0; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239B2816' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M7 7l10 10M17 7L7 17'/%3E%3C/svg%3E"); }

/* ---------- 76. Checklist: círculo delineado con chulo / equis gruesos y redondeados (referencia del cliente) ---------- */
ul.srm-checklist li::before { width: 26px; height: 26px; border-radius: 0; background-color: transparent !important; background-size: 26px 26px; top: -1px; }
ul.srm-checklist li.si::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='16' cy='16' r='14' stroke='%235DB54A' stroke-width='2.6'/%3E%3Cpath d='M9.5 16.5l4.5 4.5 8.5-9.5' stroke='%235DB54A' stroke-width='3.6'/%3E%3C/svg%3E") !important; }
ul.srm-checklist li.no::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none' stroke-linecap='round'%3E%3Ccircle cx='16' cy='16' r='14' stroke='%23E03A2B' stroke-width='2.6'/%3E%3Cpath d='M11 11l10 10M21 11L11 21' stroke='%23E03A2B' stroke-width='3.6'/%3E%3C/svg%3E") !important; }

/* ---------- 77. Menú en una sola línea entre 981 y 1365 px (antes se partía en dos filas) ---------- */
@media (min-width: 981px) and (max-width: 1365px) {
  .srm-header .et_pb_row > .et_pb_column:first-child { width: 84% !important; margin-right: 2% !important; }
  .srm-header .et_pb_row > .et_pb_column:last-child { width: 14% !important; margin-right: 0 !important; }
  .srm-header #mega-menu-wrap-primary-menu #mega-menu-primary-menu > li.mega-menu-item > a.mega-menu-link { padding-left: 9px !important; padding-right: 9px !important; font-size: 14px !important; }
  .srm-header .et-menu > li { padding-left: 0 !important; padding-right: 0 !important; }
}
@media (min-width: 981px) and (max-width: 1100px) {
  .srm-header .et_pb_row { width: 96% !important; }
  .srm-header #mega-menu-wrap-primary-menu #mega-menu-primary-menu > li.mega-menu-item > a.mega-menu-link { padding-left: 7px !important; padding-right: 7px !important; font-size: 13.5px !important; }
  .srm-header .et_pb_menu__logo img { max-height: 38px !important; }
}

/* ---------- 78. Sin botones flotantes de AddToAny (pedido del cliente). Para reactivarlos, borra esta regla ---------- */
.a2a_kit.a2a_floating_style { display: none !important; }

/* ---------- 79. Píldoras (srm-chips) sobre fondos de color: translúcidas con texto blanco (antes: blanco sobre blanco) ---------- */
:is(.srm-bg-petroleo, .srm-bg-frambuesa, .srm-bg-marino, .srm-bg-ladrillo, .srm-bg-dark, .srm-bg-orange) .srm-chips li {
  background: rgba(255, 255, 255, .1) !important; border-color: rgba(255, 255, 255, .55) !important; color: #fff !important;
}

/* ---------- 80. Desplegables de texto legal/detalle (clase srm-terms): mismo aspecto que la FAQ, sin generar FAQPage schema ---------- */
.et_pb_accordion.srm-terms .et_pb_toggle { border: 0; border-bottom: 1px solid var(--srm-line); background: transparent !important; padding: 18px 4px; margin: 0 !important; }
.srm-terms .et_pb_toggle_title { font-family: var(--srm-font-head); font-size: 1.05rem !important; color: var(--srm-ink) !important; padding-right: 40px; }
.srm-terms .et_pb_toggle_title::before { color: var(--srm-orange-ink) !important; font-size: 22px; }
.srm-terms .et_pb_toggle_content { color: var(--srm-muted); padding-top: 12px; font-size: .98rem; line-height: 1.6; }
.srm-terms .et_pb_toggle_content p { padding-bottom: 10px; }

/* ---------- 81. Tarjetas de Web Pack (columna srm-pack-card): caja blanca, botón alineado abajo ---------- */
.et_pb_column.srm-pack-card { background: #fff; border: 2px solid #C4C4C4; border-radius: var(--srm-radius, 20px); padding: clamp(18px, 2vw, 26px) !important; display: flex !important; flex-direction: column; }
.srm-pack-card > .et_pb_module { margin-bottom: 14px !important; }
.srm-pack-card .et_pb_image img { border-radius: 14px; }
.srm-pack-intro h3 { font-size: clamp(1.3rem, 1.7vw, 1.5rem) !important; padding-bottom: 8px !important; }
.srm-pack-intro p { font-size: 1rem; line-height: 1.55; }
.srm-pack-card .srm-pack-detail .et_pb_toggle { padding: 12px 2px; border-top: 1px solid var(--srm-line); }
.srm-pack-card > .et_pb_button_module_wrapper, .srm-pack-card > .et_pb_module:last-child { margin-top: auto !important; margin-bottom: 0 !important; }
.srm-pack-card .et_pb_button_module_wrapper .et_pb_button { width: 100%; text-align: center; }
/* Toggles sueltos con clase srm-terms (desplegables cerrados) */
.et_pb_toggle.srm-terms { border: 0 !important; border-bottom: 1px solid var(--srm-line) !important; background: transparent !important; padding: 18px 4px !important; margin: 0 !important; }
.srm-pack-card .et_pb_toggle.srm-pack-detail { border-top: 1px solid var(--srm-line) !important; padding: 12px 2px !important; }

/* ---------- 82. Tarjetas de plan (hosting): nombre, capacidad destacada y características ---------- */
.srm-plan-card h3 { font-size: clamp(1.25rem, 1.6vw, 1.45rem) !important; padding-bottom: 4px !important; }
.srm-plan-card .srm-plan-cap { font-family: var(--srm-font-head); font-size: clamp(1.8rem, 2.6vw, 2.3rem); font-weight: 700; color: var(--srm-orange-ink); line-height: 1.1; padding-bottom: 14px !important; }
.srm-plan-card .srm-plan-cap span { font-size: 1rem; font-weight: 500; color: var(--srm-muted); }
.srm-plan-card ul { padding-left: 1.1em !important; margin: 0; }
.srm-plan-card li { font-size: 1.02rem; line-height: 1.5; padding-bottom: 4px; }
.et_pb_text.srm-plan-group { margin-top: clamp(16px, 2.5vw, 30px) !important; margin-bottom: 0 !important; }
.srm-track-planes .et_pb_row.srm-row-narrow-imgs { max-width: 860px !important; }
/* Planes en 3 columnas: tarjetas apiladas con aire, sin altura forzada */
.srm-track-planes .et_pb_text.srm-plan-card { height: auto !important; margin-bottom: 18px !important; }
.srm-track-planes .et_pb_text.srm-plan-group { margin-top: 0 !important; margin-bottom: 12px !important; }
.srm-plan-card .srm-plan-cap span { display: block; padding-top: 2px; }
@media (min-width: 981px) and (max-width: 1200px) { .srm-plan-card li { font-size: .92rem; } .et_pb_text.srm-plan-card { padding: 18px 20px !important; } }

/* ---------- 83. Formas de pago: códigos QR, imagen pequeña y tarjetas de pasarela ---------- */
.et_pb_image.srm-qr { max-width: 340px; margin-left: auto !important; margin-right: auto !important; }
.et_pb_image.srm-qr--tall { max-width: 260px; }
.et_pb_image.srm-img-small { max-width: 220px; margin-left: auto !important; margin-right: auto !important; }
.et_pb_column.srm-pay-card { background: #fff; border: 2px solid #C4C4C4; border-radius: var(--srm-radius, 20px); padding: clamp(18px, 2vw, 26px) !important; display: flex !important; flex-direction: column; }
.srm-pay-card > .et_pb_module { margin-bottom: 14px !important; }
.srm-pay-card .et_pb_image { max-width: 420px; margin-left: auto !important; margin-right: auto !important; }
.srm-pay-card > .et_pb_module:last-child, .srm-pay-card > .et_pb_button_module_wrapper { margin-top: auto !important; margin-bottom: 0 !important; }
.srm-pay-card .et_pb_button { width: 100%; text-align: center; }
.srm-col-card .srm-proc-card ul li { padding-bottom: 4px; }
.srm-spec-card ol { padding-left: 1.3em !important; }
.srm-spec-card ol li { padding-bottom: 8px; line-height: 1.5; }
/* Franja de cabecera con una sola línea de varios conceptos (srm-banner-band--list) */
.srm-banner-band--list span { font-size: clamp(.8rem, 1.9vw, 1.75rem) !important; white-space: nowrap; letter-spacing: .03em; }
@media (max-width: 600px) { .et_pb_text.srm-banner-band--list { display: none !important; } }

/* ---------- 84. Códigos QR legibles: misma altura (proporción original), clic para ampliar ---------- */
.et_pb_column.srm-qr-card { background: #fff; border: 2px solid #C4C4C4; border-radius: var(--srm-radius, 20px); padding: clamp(18px, 2vw, 28px) !important; display: flex !important; flex-direction: column; align-items: center; }
.srm-qr-card > .et_pb_module { margin-bottom: 12px !important; width: 100%; }
.srm-qr-title h3 { font-size: clamp(1.15rem, 1.5vw, 1.35rem) !important; padding-bottom: 0 !important; }
.et_pb_image.srm-qr { text-align: center !important; max-width: none !important; margin: auto 0 0 !important; }
.et_pb_image.srm-qr .et_pb_image_wrap { display: inline-block; }
.et_pb_image.srm-qr img { height: 520px !important; width: auto !important; max-width: 100% !important; object-fit: contain; border-radius: 14px; cursor: zoom-in; box-shadow: none !important; }
@media (max-width: 980px) { .et_pb_image.srm-qr img { height: auto !important; width: 100% !important; max-width: 420px !important; } }
.srm-col-card .srm-proc-card ol { padding-left: 1.3em !important; margin: 0; }
.srm-col-card .srm-proc-card ol li { color: #fff !important; font-size: clamp(1rem, 1.1vw, 1.1rem); line-height: 1.5; padding-bottom: 6px; }
/* Enlaces dentro de columnas de color: blancos y subrayados (el naranja no contrasta) */
.srm-col-card a { color: #fff !important; text-decoration: underline; text-underline-offset: 2px; }
/* QR: la altura escala con la pantalla para que el cuadrado nunca supere el ancho de su tarjeta (misma altura en ambos) */
@media (min-width: 981px) { .et_pb_image.srm-qr img { height: min(520px, 33vw) !important; } }

/* ---------- 85. Centro de descargas: tarjeta por documento (ícono, título, nota, tamaño y botón abajo) ---------- */
.et_pb_column.srm-dl-card { background: #fff; border: 2px solid #C4C4C4; border-radius: var(--srm-radius, 20px); padding: clamp(18px, 2vw, 26px) !important; display: flex !important; flex-direction: column; }
.srm-dl-card > .et_pb_module { margin-bottom: 10px !important; }
.srm-dl-icon .srm-dl-ico { width: 44px !important; height: 44px; padding: 8px; border-radius: 12px; background: #FCE9DF; }
.srm-dl-text h3 { font-size: clamp(1.1rem, 1.4vw, 1.25rem) !important; padding-bottom: 6px !important; }
.srm-dl-text p { font-size: .98rem; line-height: 1.55; }
.srm-dl-text .srm-dl-meta { font-size: .85rem; color: var(--srm-muted); letter-spacing: .03em; padding-top: 4px; }
.srm-dl-card > .et_pb_button_module_wrapper, .srm-dl-card > .et_pb_module:last-child { margin-top: auto !important; margin-bottom: 0 !important; }
.srm-dl-card .et_pb_button { width: 100%; text-align: center; }

/* ---------- 86. Página de preguntas frecuentes: atajos por tema y listas de artículos (módulo Blog) ---------- */
.srm-chips--links li { padding: 0 !important; }
.srm-chips--links a { display: inline-block; padding: 8px 16px; color: var(--srm-ink) !important; text-decoration: none; }
.srm-chips--links li:hover { border-color: var(--srm-orange) !important; }
.srm-chips--links li:hover a { color: var(--srm-orange-ink) !important; }
.srm-faq-posts-title h3 { font-size: clamp(1.1rem, 1.4vw, 1.25rem) !important; padding-top: 18px !important; }
.et_pb_blog_grid_wrapper.srm-faq-posts .et_pb_blog_grid, .srm-faq-posts.et_pb_blog_grid_wrapper { background: transparent !important; }
.srm-faq-posts .et_pb_post { background: #fff !important; border: 2px solid #C4C4C4 !important; border-radius: var(--srm-radius, 20px) !important; padding: 20px 22px !important; box-shadow: none !important; }
.srm-faq-posts .et_pb_post .entry-title { font-size: 1.05rem !important; line-height: 1.35 !important; padding-bottom: 8px !important; }
.srm-faq-posts .et_pb_post .entry-title a { color: var(--srm-ink) !important; }
.srm-faq-posts .et_pb_post .more-link { color: var(--srm-orange-ink) !important; font-weight: 600; }
.srm-faq-posts .et_pb_post .post-meta, .srm-faq-posts .et_pb_post .post-content-inner { display: none; }
html { scroll-behavior: smooth; }
.et_pb_section[id] { scroll-margin-top: 130px; }
/* Tablas dentro de desplegables (p. ej. presupuesto informal vs. formal): ocupan el ancho disponible, sin desbordar en celular */
.srm-terms table { width: 100% !important; max-width: 100%; table-layout: fixed; border-collapse: collapse; margin: 10px 0 16px; }
.srm-terms th, .srm-terms td { padding: 8px 10px; vertical-align: top; font-size: .95rem; line-height: 1.4; border: 1px solid var(--srm-line); overflow-wrap: break-word; }
.srm-terms th { background: #F3F3F3; color: var(--srm-ink); }
@media (max-width: 600px) { .srm-terms th, .srm-terms td { padding: 6px; font-size: .82rem; } }
/* Artículos (módulo Blog en cuadrícula): rejilla pareja en lugar de mampostería escalonada */
.srm-faq-posts .et_pb_salvattore_content { display: grid !important; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.srm-faq-posts .et_pb_salvattore_content > .column { display: contents !important; }
.srm-faq-posts .et_pb_post { margin: 0 !important; display: flex; flex-direction: column; height: 100%; }
.srm-faq-posts .et_pb_post .more-link { margin-top: auto; padding-top: 8px; }
@media (max-width: 980px) { .srm-faq-posts .et_pb_salvattore_content { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .srm-faq-posts .et_pb_salvattore_content { grid-template-columns: 1fr; } }

/* ---------- 87. Panel blanco dentro de una sección de color (columna srm-panel) ---------- */
.et_pb_column.srm-panel { background: #fff; border-radius: var(--srm-radius, 20px); padding: clamp(10px, 2vw, 22px) clamp(18px, 3vw, 36px) !important; box-shadow: 0 18px 40px -24px rgba(0,0,0,.45); }
.srm-panel .et_pb_toggle.srm-terms:last-child { border-bottom: 0 !important; }
.srm-panel .srm-terms .et_pb_toggle_title { font-size: 1.1rem !important; }
.srm-panel :is(p, li, td, h2, h3, h4, strong) { color: inherit; }
:is(.srm-bg-marino, .srm-bg-ladrillo) .srm-panel .et_pb_toggle_content, :is(.srm-bg-marino, .srm-bg-ladrillo) .srm-panel .et_pb_toggle_content :is(p, li, td, h2, h3, h4) { color: var(--srm-muted) !important; }
:is(.srm-bg-marino, .srm-bg-ladrillo) .srm-panel .et_pb_toggle_title, :is(.srm-bg-marino, .srm-bg-ladrillo) .srm-panel .et_pb_toggle_content :is(strong, th, h2) { color: var(--srm-ink) !important; }
@media (max-width: 600px) {
  .srm-terms table { display: block; overflow-x: auto; table-layout: auto; -webkit-overflow-scrolling: touch; }
  .srm-terms th, .srm-terms td { overflow-wrap: normal; word-break: normal; min-width: 120px; }
}
/* Enlaces dentro del panel blanco en sección de color: naranja (no blanco sobre blanco) */
:is(.srm-bg-petroleo, .srm-bg-frambuesa, .srm-bg-marino, .srm-bg-ladrillo, .srm-bg-dark, .srm-bg-orange) .srm-panel a,
:is(.srm-bg-petroleo, .srm-bg-frambuesa, .srm-bg-marino, .srm-bg-ladrillo, .srm-bg-dark, .srm-bg-orange) .srm-panel a :is(span, strong, em) { color: var(--srm-orange-ink) !important; text-decoration: underline; text-underline-offset: 2px; }

/* ---------- 88. Íconos en los títulos de los desplegables de Procesos (clase srm-tico--<nombre>); el texto no cambia ---------- */
.srm-tico .et_pb_toggle_title { padding-left: 52px !important; position: relative; min-height: 38px; display: flex; align-items: center; }
.srm-tico .et_pb_toggle_title { background-repeat: no-repeat; background-position: 8px center; background-size: 24px 24px; }
.srm-tico--presupuesto .et_pb_toggle_title { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23bf400c' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='3' width='14' height='18' rx='2'/%3E%3Cpath d='M8 7h8M8 11h2M12 11h2M16 11h0M8 15h2M12 15h2M8 18h6'/%3E%3C/svg%3E"); }
.srm-tico--comprar .et_pb_toggle_title { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23bf400c' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 4h2l2.4 11h11l2-8H6.2'/%3E%3Ccircle cx='9' cy='19.5' r='1.3'/%3E%3Ccircle cx='17' cy='19.5' r='1.3'/%3E%3C/svg%3E"); }
.srm-tico--credito .et_pb_toggle_title { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23bf400c' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='5' width='20' height='14' rx='2'/%3E%3Cpath d='M2 10h20M6 15h4'/%3E%3C/svg%3E"); }
.srm-tico--documentos .et_pb_toggle_title { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23bf400c' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 7a2 2 0 012-2h4l2 2h8a2 2 0 012 2v8a2 2 0 01-2 2H5a2 2 0 01-2-2z'/%3E%3Cpath d='M8 13h8'/%3E%3C/svg%3E"); }
/* Panel blanco: negritas legibles (gana a la regla de negritas blancas de las secciones de color) */
.et_pb_section:is(.srm-bg-petroleo, .srm-bg-frambuesa, .srm-bg-marino, .srm-bg-ladrillo) .srm-panel .et_pb_toggle .et_pb_toggle_content strong { color: var(--srm-ink) !important; }
.et_pb_section:is(.srm-bg-petroleo, .srm-bg-frambuesa, .srm-bg-marino, .srm-bg-ladrillo) .srm-panel .et_pb_toggle .et_pb_toggle_content a strong,
.et_pb_section:is(.srm-bg-petroleo, .srm-bg-frambuesa, .srm-bg-marino, .srm-bg-ladrillo) .srm-panel .et_pb_toggle .et_pb_toggle_content a span { color: var(--srm-orange-ink) !important; }
/* Íconos de Procesos más grandes (pedido del cliente) */
.srm-tico .et_pb_toggle_title { padding-left: 66px !important; min-height: 46px; background-size: 34px 34px !important; background-position: 6px center !important; }

/* ---------- 89. Blog: tarjetas de artículos con extracto + formulario original en panel blanco ---------- */
.srm-blog-cards .et_pb_post .post-content-inner { display: block !important; color: var(--srm-muted); font-size: .95rem; line-height: 1.55; }
.srm-blog-cards .et_pb_post .post-content-inner p { padding-bottom: 0; }
.srm-blog-cards .et_pb_post .entry-title { font-size: 1.12rem !important; }
.srm-blog-cards .et_pb_post { padding: 22px 24px !important; }
.srm-blog-cards .et_pb_post:hover { border-color: var(--srm-orange) !important; }
.srm-form-panel .et_pb_contact_form_container { margin: 0 !important; }
.srm-form-panel .et_pb_contact_main_title { color: var(--srm-ink) !important; font-size: clamp(1.15rem, 1.6vw, 1.4rem) !important; padding-bottom: 14px; }
.srm-form-panel :is(p, label, span, .et_pb_contact_captcha_question) { color: var(--srm-ink) !important; }
.srm-form-panel .et_pb_contact_form input.input, .srm-form-panel .et_pb_contact_form textarea { background: #F6F6F6 !important; color: var(--srm-ink) !important; border: 1px solid var(--srm-line) !important; border-radius: 10px; }
.srm-form-panel .et_pb_contact_form input.input::placeholder { color: #6b6b6b !important; }
.srm-form-panel .et_contact_bottom_container { float: none; display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 10px; }
.srm-form-panel .et_pb_contact_submit { background: var(--srm-orange) !important; color: #fff !important; border: 0 !important; border-radius: 999px !important; padding: 10px 26px !important; }
.srm-form-panel .et-pb-contact-message, .srm-form-panel .et-pb-contact-message p { color: var(--srm-ink) !important; }
/* Formulario original del blog: campos alineados (Nombre + Apellido en una fila, correo y aceptación a todo el ancho), sin sombras */
.et_pb_column.srm-form-panel .et_pb_contact_form { margin-left: 0 !important; }
.et_pb_column.srm-form-panel .et_pb_contact_form .et_pb_contact_field { padding-left: 0 !important; margin-left: 0 !important; width: 100% !important; float: left !important; clear: none; margin-bottom: 14px !important; }
@media (min-width: 601px) {
  .et_pb_column.srm-form-panel .et_pb_contact_form .et_pb_contact_field_0, .et_pb_column.srm-form-panel .et_pb_contact_form .et_pb_contact_field_1 { width: 49% !important; }
  .et_pb_column.srm-form-panel .et_pb_contact_form .et_pb_contact_field_1 { margin-left: 2% !important; }
}
.et_pb_column.srm-form-panel .et_pb_contact_form .et_pb_contact_field_2 { clear: both; }
.et_pb_column.srm-form-panel .et_pb_contact_form :is(input.input, textarea, .et_pb_contact_captcha) { box-shadow: none !important; }
.et_pb_column.srm-form-panel .et_pb_contact_form .et_pb_contact_captcha { background: #F6F6F6 !important; border: 1px solid var(--srm-line) !important; border-radius: 10px; color: var(--srm-ink) !important; }
.et_pb_column.srm-form-panel .et_pb_contact_form :is(p, label, .et_pb_contact_field_options_title, .et_pb_contact_field_checkbox label) { color: var(--srm-ink) !important; }
.et_pb_column.srm-form-panel .et_pb_contact_field_checkbox input + label i { background: #F6F6F6 !important; border: 1px solid #9a9a9a !important; box-shadow: none !important; }
.et_pb_column.srm-form-panel .et_contact_bottom_container { margin-top: 6px; align-items: center; }
.et_pb_column.srm-form-panel .et_contact_bottom_container { clear: both !important; float: none !important; width: 100% !important; display: flex !important; justify-content: flex-end; align-items: center; gap: 12px; margin-top: 8px !important; padding-top: 4px; }
.et_pb_column.srm-form-panel .et_pb_contact_submit { white-space: nowrap; margin-left: 0 !important; }
.et_pb_column.srm-form-panel .et_pb_contact_right { float: none !important; display: flex; align-items: center; gap: 8px; }
.et_pb_column.srm-form-panel .et_pb_contact_right p { margin: 0 !important; padding: 0 !important; }
/* Tarjetas del blog: «leer más» siempre al pie de la tarjeta */
.srm-blog-cards .et_pb_post .post-content { flex: 1; display: flex; flex-direction: column; }
.srm-blog-cards .et_pb_post .post-content .more-link { margin-top: auto; padding-top: 10px; }

/* ---------- 90. Páginas legales: texto original en panel blanco, índice y títulos legibles ---------- */
.srm-legal-nav li.is-current { background: var(--srm-ink) !important; border-color: var(--srm-ink) !important; }
.srm-legal-nav li.is-current a { color: #fff !important; }
.srm-legal-panel { padding-top: clamp(22px, 3vw, 40px) !important; padding-bottom: clamp(22px, 3vw, 40px) !important; }
.srm-legal-toc-wrap { margin-bottom: 8px !important; }
.srm-legal-toc-wrap h2 { font-size: 1.05rem !important; letter-spacing: .08em; text-transform: uppercase; color: var(--srm-ink) !important; padding-bottom: 10px !important; }
.srm-legal-toc { columns: 2; column-gap: 32px; list-style: none !important; padding: 0 0 18px !important; margin: 0 !important; border-bottom: 1px solid var(--srm-line); }
.srm-legal-toc li { break-inside: avoid; padding: 3px 0 !important; font-size: .95rem; line-height: 1.4; }
.srm-legal-toc a { color: var(--srm-orange-ink) !important; text-decoration: none !important; }
.srm-legal-toc a:hover { text-decoration: underline !important; }
@media (max-width: 700px) { .srm-legal-toc { columns: 1; } }
.srm-legal .rte p, .srm-legal p { color: var(--srm-ink) !important; font-size: 1rem; line-height: 1.7; padding-bottom: 12px; overflow-wrap: anywhere; }
.srm-legal p.srm-legal-meta { color: var(--srm-muted) !important; font-size: .95rem; padding-bottom: 4px; }
.srm-legal h2 { font-size: clamp(1.1rem, 1.5vw, 1.3rem) !important; line-height: 1.3 !important; color: var(--srm-ink) !important; padding: 26px 0 10px !important; margin-top: 10px; border-top: 1px solid var(--srm-line); scroll-margin-top: 140px; }
.srm-legal :is(ul, ol) { padding-left: 1.4em !important; margin-bottom: 14px; }
.srm-legal li { color: var(--srm-ink) !important; line-height: 1.65; padding-bottom: 4px; }
.srm-legal strong { color: var(--srm-ink) !important; }

/* ---------- 91. Páginas legales originales (5750 términos, 5744 venta, 921 datos): contenido intacto y sin diseño.
   Mismos tamaños que en el sitio actual (títulos 30 px, texto 15 px); evita que hereden el H1 grande del tema nuevo. ---------- */
:is(body.page-id-5750, body.page-id-5744, body.page-id-921) #main-content .et_pb_text_inner h1 {
  font-size: 30px !important; line-height: 30px !important; font-weight: 500 !important; letter-spacing: 0 !important; padding-bottom: 10px !important;
}
:is(body.page-id-5750, body.page-id-5744, body.page-id-921) #main-content .et_pb_text_inner p { font-size: 15px !important; line-height: 25.5px !important; }

/* ---------- 92. Contacto: tarjetas de canales con botón al pie, mapa original adaptable, notas y formulario original ---------- */
.srm-contact-card .srm-card-link { color: var(--srm-orange-ink) !important; font-weight: 600; }
.srm-contact-card:hover { border-color: var(--srm-orange) !important; }
.srm-anastasia { max-width: 640px; margin: 22px auto 26px !important; }
.srm-anastasia img { border-radius: var(--srm-radius, 20px); }
.srm-map iframe { width: 100% !important; height: clamp(300px, 40vw, 460px) !important; border: 0; border-radius: var(--srm-radius, 20px); display: block; }
.srm-map { margin-bottom: 18px !important; }
.srm-contact-notes { margin-bottom: 18px !important; padding-bottom: 14px; border-bottom: 1px solid var(--srm-line); }
.et_pb_column.srm-form-panel .srm-contact-notes :is(p, li, strong) { color: var(--srm-ink) !important; font-size: .97rem; line-height: 1.6; }
.srm-contact-notes ul { padding-left: 1.2em !important; }
.srm-contact-notes li { padding-bottom: 6px; }
.et_pb_column.srm-form-panel .et_pb_contact_form select { background-color: #F6F6F6 !important; color: var(--srm-ink) !important; border: 1px solid var(--srm-line) !important; border-radius: 10px; box-shadow: none !important; }
.et_pb_column.srm-form-panel .et_pb_contact_field_options_title { font-weight: 600; padding-bottom: 6px; }
.et_pb_column.srm-form-panel .et_pb_contact_field_checkbox label { line-height: 1.5; }
.et_pb_section .et_pb_column.srm-form-panel .srm-contact-notes strong { color: var(--srm-ink) !important; }
.srm-contact-card .et_pb_module_header, .srm-contact-card .et_pb_module_header a { color: var(--srm-ink) !important; }

/* ---------- 93. Entradillas centradas: el ancho máximo de lectura se centra (antes quedaban corridas a la izquierda) ---------- */
.et_pb_module.srm-lead.srm-center, .srm-lead.srm-center > .et_pb_text_inner > p, .srm-center-col .srm-lead.srm-center { margin-left: auto !important; margin-right: auto !important; }
.srm-open-chat.et_pb_blurb { cursor: pointer; }
.et_pb_blurb:has(.et_pb_module_header a) { cursor: pointer; }
/* Contacto · ¿Dónde estamos?: datos y sedes a la izquierda, mapa a la derecha (misma altura) */
.srm-visit-note { background: #fff; border-left: 4px solid var(--srm-orange); border-radius: 12px; padding: 14px 18px !important; margin-bottom: 18px !important; }
.srm-visit-note p { color: var(--srm-ink) !important; padding-bottom: 0 !important; }
.srm-sedes-col .srm-sede-card { margin-bottom: 18px !important; }
.srm-sedes-col .srm-sede-card:last-child { margin-bottom: 0 !important; }
@media (min-width: 981px) {
  .srm-ubicacion-row { display: flex; align-items: stretch; }
  .srm-map-col { display: flex; flex-direction: column; }
  .srm-map-col .srm-map { flex: 1; display: flex; }
  .srm-map-col .srm-map .et_pb_code_inner { flex: 1; display: flex; }
  .srm-map-col .srm-map iframe { height: 100% !important; min-height: 360px; }
}
.srm-sedes-col .et_pb_blurb.srm-sede-card { height: auto !important; min-height: 0 !important; flex: none !important; }
.srm-sedes-col.et_pb_column { display: block !important; }

/* ---------- 94. Inicio · «Nuestras 5 líneas principales»: jerarquía (Stands grande → 4 líneas → «También hacemos» pequeño) ---------- */
.et_pb_row.srm-line-main { background: var(--srm-tile); border-radius: var(--srm-radius-xl, 28px); padding: clamp(18px, 3vw, 40px) !important; margin-bottom: 30px !important; }
.srm-line-main-img img { border-radius: 20px; width: 100%; height: auto; }
.srm-line-main-text h3 { font-size: clamp(1.9rem, 1.3rem + 2vw, 3rem) !important; line-height: 1.1 !important; color: var(--srm-ink) !important; padding-bottom: 12px !important; letter-spacing: -0.02em; }
.srm-line-main-text p { font-size: var(--srm-fs-lead, 1.15rem); line-height: 1.55; color: var(--srm-muted); }
.srm-tile--line .et_pb_module_header, .srm-tile--line .et_pb_module_header a { font-size: clamp(1.15rem, 0.9rem + 0.7vw, 1.45rem) !important; }
.srm-tile--line .et_pb_blurb_description p { font-size: .97rem; line-height: 1.5; }
@media (min-width: 600px) and (max-width: 1239px) {
  .et_pb_row.srm-lines-4 { display: grid !important; grid-template-columns: 1fr 1fr; gap: 0 4%; }
  .et_pb_row.srm-lines-4 > .et_pb_column { width: 100% !important; margin-right: 0 !important; }
}
.srm-also-title { margin-top: 10px !important; }
.srm-also-row .srm-also-card { padding: 18px 20px !important; }
.srm-also-row .srm-also-card .et_pb_module_header { font-size: 1.1rem !important; }
.srm-also-row .srm-also-card .et_pb_main_blurb_image .et_pb_image_wrap { width: 44px !important; height: 44px !important; }
/* Líneas 2–5: títulos en una sola línea y el enlace «Ver … ›» siempre al pie de la tarjeta */
.srm-tile--line .et_pb_module_header, .srm-tile--line .et_pb_module_header a { font-size: clamp(1.1rem, 0.95rem + 0.4vw, 1.3rem) !important; white-space: nowrap; }
.srm-tile--line.et_pb_blurb { height: 100%; display: flex; flex-direction: column; }
.srm-tile--line .et_pb_blurb_content { flex: 1; display: flex; flex-direction: column; max-width: none; }
.srm-tile--line .et_pb_blurb_container { flex: 1; display: flex; flex-direction: column; padding: 0 clamp(18px, 2vw, 28px) !important; }
.srm-tile--line .et_pb_blurb_description { flex: 1; display: flex; flex-direction: column; }
.srm-tile--line .et_pb_blurb_description p:last-child { margin-top: auto; padding-top: 10px; }
.et_pb_row.srm-lines-4 > .et_pb_column { display: flex; flex-direction: column; }
@media (min-width: 1240px) and (max-width: 1439px) { .srm-tile--line .et_pb_module_header, .srm-tile--line .et_pb_module_header a { font-size: 1.05rem !important; } }
/* Tarjetas con enlace «… ›» (contacto, exhibición, «también hacemos»): el enlace siempre al pie, alineado entre tarjetas */
.srm-contact-card.et_pb_blurb { display: flex; flex-direction: column; }
.srm-contact-card .et_pb_blurb_content { flex: 1; display: flex; flex-direction: column; max-width: none; }
.srm-contact-card .et_pb_blurb_container { flex: 1; display: flex; flex-direction: column; }
.srm-contact-card .et_pb_blurb_description { flex: 1; display: flex; flex-direction: column; }
.srm-contact-card .et_pb_blurb_description p:last-child { margin-top: auto; padding-top: 8px; }

/* ---------- 95. Inicio · Líneas 1 y 2 (Stands y Seguridad) en 2 columnas destacadas; líneas 3–5 en 3 columnas ---------- */
.et_pb_column.srm-line-feature { background: var(--srm-tile); border-radius: var(--srm-radius-xl, 28px); padding: clamp(20px, 2.6vw, 36px) !important; display: flex; flex-direction: column; }
.srm-line-feature .srm-line-main-img { text-align: center; margin-bottom: 18px !important; }
.srm-line-feature .srm-line-main-img img { max-width: min(100%, 380px); border-radius: 20px; }
.srm-line-feature .srm-line-main-text { flex: 1; }
.srm-line-feature .srm-line-main-text h3 { font-size: clamp(1.6rem, 1.1rem + 1.4vw, 2.4rem) !important; }
.srm-line-feature .et_pb_button_module_wrapper { display: inline-block; margin-right: 10px; }
@media (max-width: 980px) { .et_pb_column.srm-line-feature { margin-bottom: 24px !important; } }
@media (min-width: 600px) and (max-width: 980px) {
  .et_pb_row.srm-lines-3 { display: grid !important; grid-template-columns: 1fr 1fr 1fr; gap: 0 3%; }
  .et_pb_row.srm-lines-3 > .et_pb_column { width: 100% !important; margin-right: 0 !important; }
}
.et_pb_row.srm-lines-3 > .et_pb_column { display: flex; flex-direction: column; }
/* Marcas y empresas: «Visitar … ›» siempre al pie, alineado entre tarjetas */
.srm-tile--brand.et_pb_blurb { height: 100%; display: flex; flex-direction: column; }
.srm-tile--brand .et_pb_blurb_content { flex: 1; display: flex; flex-direction: column; max-width: none; }
.srm-tile--brand .et_pb_blurb_container { flex: 1; display: flex; flex-direction: column; }
.srm-tile--brand .et_pb_blurb_description { flex: 1; display: flex; flex-direction: column; }
.srm-tile--brand .et_pb_blurb_description p:last-child { margin-top: auto; padding-top: 10px; }
.srm-track-negocios .et_pb_row > .et_pb_column { display: flex; flex-direction: column; }
.et_pb_row.srm-lines-3 > .et_pb_column > .et_pb_module.srm-tile--line { flex: 1; }
.et_pb_row.srm-lines-3 .et_pb_column .et_pb_blurb.srm-tile--line { margin-bottom: 30px !important; }
@media (min-width: 600px) and (max-width: 980px) { .et_pb_row.srm-lines-3 > .et_pb_column { margin-bottom: 0 !important; } }

/* ---------- 96. Menú Productos: ícono de ojo para «Exhibición para el punto de venta» (mismo estilo que los íconos de Mega Menu) ---------- */
#mega-menu-wrap-primary-menu #mega-menu-primary-menu li.mega-menu-item > a.mega-menu-link[href*="exhibidores-y-displays-para-punto-de-venta"]::before {
  content: "\f177"; font-family: dashicons; font-size: 15px; width: 15px; height: 20.25px; line-height: 20.25px; margin: 0 8px 0 0;
  color: rgb(232, 78, 15); vertical-align: top; display: inline-block; text-align: left; speak: never; -webkit-font-smoothing: antialiased;
}
/* Clientes justo después del saludo: sin fondo propio, como continuación del saludo */
.srm-trustbar--after-greeting { border-top: 0 !important; }

/* ---------- 97. Quiénes somos (página 76, diseño anterior con estilos propios «sx-»): misma tipografía que el resto del sitio.
   Sus estilos internos forzaban font-family:inherit en títulos (salían en Actor); aquí títulos y botones pasan a la fuente de títulos del sitio. ---------- */
body.page-id-76 #main-content :is(h1, h2, h3, h4, h5, h6),
body.page-id-76 #main-content :is(h1, h2, h3, h4, h5, h6) :is(a, span, strong),
body.page-id-76 #main-content .et_pb_module_header,
body.page-id-76 #main-content .et_pb_module_header a,
body.page-id-76 #main-content .et_pb_button,
body.page-id-76 #main-content .et_pb_toggle_title { font-family: var(--srm-font-head) !important; }

/* ---------- 98. Inicio · saludo sin botones, párrafos seguidos, y clientes pegados debajo con fondo celeste ---------- */
.srm-greeting-text p { margin-bottom: 0 !important; padding-bottom: 0 !important; }
.et_pb_section.srm-greeting { padding-bottom: clamp(24px, 3vw, 40px) !important; }
.et_pb_section.srm-trustbar--after-greeting { padding-top: clamp(28px, 3vw, 40px) !important; padding-bottom: clamp(28px, 3vw, 40px) !important; border: 0 !important; }
.srm-bg-celeste.srm-trustbar .srm-eyebrow p, .srm-bg-celeste.srm-trustbar a, .srm-bg-celeste.srm-trustbar li { color: var(--srm-ink) !important; }
.srm-bg-celeste.srm-trustbar a { text-decoration: underline; text-underline-offset: 3px; }

/* ---------- 99. Entradillas a ancho completo (columna 4_4): el bloque de lectura (62ch) siempre centrado,
   también cuando el texto va alineado a la izquierda (srm-text-left). Amplía la sección 93. ---------- */
.et_pb_column_4_4 > .et_pb_module.srm-lead { margin-left: auto !important; margin-right: auto !important; }
.et_pb_row .et_pb_column.et_pb_column_4_4:not(.srm-center-col) > .et_pb_module.et_pb_text.srm-lead,
.et_pb_row .et_pb_column.et_pb_column_4_4.srm-center-col > .et_pb_module.et_pb_text.srm-lead { margin-left: auto !important; margin-right: auto !important; }

/* ---------- 100. Inicio · «Conoce nuestras marcas»: mismas tarjetas que Quiénes somos (filas sx-marcas-row copiadas de la página 76).
   Reglas tomadas de los estilos de Quiénes somos, acotadas a la sección de marcas del inicio. ---------- */
.srm-track-negocios .sx-marcas-row { margin-bottom: 16px !important; }
@media (min-width: 981px) {
  .srm-track-negocios .et_pb_row.sx-marcas-row .et_pb_column { width: calc((100% - 64px) / 5) !important; margin-right: 16px !important; }
  .srm-track-negocios .et_pb_row.sx-marcas-row .et_pb_column.et-last-child, .srm-track-negocios .et_pb_row.sx-marcas-row .et_pb_column:last-child { margin-right: 0 !important; }
}
@media (max-width: 980px) { .srm-track-negocios .sx-marcas-row .et_pb_column { margin-bottom: 24px !important; } }
.srm-track-negocios .sx-blurb.et_pb_blurb { border: 1px solid #E2E2E0; border-radius: 6px; background: #fff; padding: 20px !important; height: 100%; box-sizing: border-box; transition: border-color .2s; }
.srm-track-negocios .sx-blurb.et_pb_blurb:hover { border-color: #F26A21; }
.srm-track-negocios .sx-blurb .et_pb_main_blurb_image { margin-bottom: 14px !important; text-align: left !important; }
.srm-track-negocios .sx-blurb .et_pb_main_blurb_image img { width: 140px !important; max-width: 100% !important; height: auto; background: transparent !important; mix-blend-mode: normal !important; }
.srm-track-negocios .sx-blurb .et_pb_blurb_description p, .srm-track-negocios .sx-blurb .et_pb_module_header { overflow-wrap: normal !important; word-wrap: normal !important; hyphens: none; }
.srm-track-negocios .sx-blurb .et_pb_module_header { font-size: 19px !important; font-weight: 400 !important; color: #2B2B2B !important; padding: 0 0 6px !important; font-family: var(--srm-font-head) !important; }
.srm-track-negocios .sx-blurb .et_pb_module_header a { color: #2B2B2B !important; }
.srm-track-negocios .sx-blurb .et_pb_blurb_description p { font-size: 15px !important; line-height: 1.5 !important; color: #555 !important; padding: 0 0 10px !important; }
.srm-track-negocios .sx-blurb p.sx-dom a { color: #C2410C !important; text-decoration: none; }
.srm-track-negocios .sx-blurb p.sx-dom a:hover { text-decoration: underline; }
.srm-track-negocios .sx-blurb .et_pb_blurb_description p.sx-dom { font-size: 14px !important; color: #C2410C !important; padding: 0 !important; }
.srm-track-negocios .sx-marcas-row > .et_pb_column { display: flex; flex-direction: column; }

/* ---------- 101. Logo del menú más grande (pedido del cliente): 62px en escritorio, 54px en portátiles pequeños, 50px en celular ---------- */
.srm-menu .et_pb_menu__logo img, .srm-header .et_pb_menu__logo img { max-height: 62px !important; }
@media (max-width: 1365px) { .srm-menu .et_pb_menu__logo img, .srm-header .et_pb_menu__logo img { max-height: 54px !important; } }
@media (max-width: 980px) { .srm-header .et_pb_menu__logo img { max-height: 50px !important; } }

/* ---------- 102. Botón blanco dentro de tarjetas de color (srm-col-card): texto naranja legible (la regla de enlaces blancos lo dejaba invisible) ---------- */
body #page-container .srm-col-card a.et_pb_button.srm-btn--white { color: var(--srm-orange-ink) !important; text-decoration: none !important; }
body #page-container .srm-col-card a.et_pb_button.srm-btn--white:hover { color: #fff !important; }

/* ---------- 103. Menú en celular y tableta ----------
   El botón hamburguesa de Divi no abre nada: Divi arma su menú móvil copiando la lista del menú,
   pero aquí el menú es de Max Mega Menu (otro marcado). Se oculta el de Divi y se usa el botón de Mega Menu,
   cuyo punto de corte está en 980px (Mega Menu → Temas de menú → Menú móvil). */
@media (max-width: 980px) {
  .srm-header .et_mobile_nav_menu { display: none !important; }
  .srm-header .et_pb_menu__menu { display: flex !important; }
  .et-l--header [id^="mega-menu-wrap-"] [id^="mega-menu-"] > li.mega-menu-item > a.mega-menu-link { padding: 0 20px !important; }
  .et-l--header [id^="mega-menu-wrap-"] ul.mega-sub-menu { box-shadow: none !important; border-radius: 0 !important; border-left: 0 !important; border-right: 0 !important; }
}
