/* ==== assets/css/10-hero.css ==== */
/* Organic Pet · barra roja HOT SALE + banner principal (bundle «landing»). Dueño: secciones.
   Reescritos sin GemPages con los valores del original (dom-desk.html, elementos g55c69d8Tq y
   g1lgSjZ0_y): texto Poppins 700 de 25 px con alto de línea 180 % (16 px en ≤ 1024 px) y un
   <span> de 12 px dentro, lo que da los 49 px / 29,8 px de alto medidos; color #F5F9FA sobre
   #E5001B. El banner ocupa el 100 % del ancho con su proporción (2:1 escritorio, 4:5 móvil).
   Los selectores llevan el prefijo de la sección (especificidad 0,2,0) para ganar al «preflight»
   de 04-secciones.css (.opl-gps p / img = 0,1,1), como hacían las reglas de GemPages. */

.opl-sec--portada .opl-barra {
  text-align: left;
}

.opl-sec--portada .opl-barra__texto {
  width: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: #E5001B;
  color: #F5F9FA;
  font-family: 'Poppins', sans-serif;
  font-size: 25px;
  font-weight: 700;
  line-height: 180%;
  letter-spacing: calc(var(--font-heading-scale) * .06rem);
  text-align: center;
  text-shadow: none;
  word-break: break-word;
}

@media only screen and (max-width: 1024px) {
  .opl-sec--portada .opl-barra__texto {
    font-size: 16px;
    line-height: 180%;
  }
}

.opl-sec--portada .opl-hero {
  position: relative;
  display: flex;
  justify-content: center;
  text-align: center;
}

.opl-sec--portada .opl-hero picture {
  display: contents;
}

.opl-sec--portada .opl-hero__img {
  display: inline-block;
  width: 100%;
  max-width: 100%;
  height: auto;
  object-fit: cover;
  border: 0 none #000000;
  border-radius: 0;
}
/* ==== assets/css/11-confianza.css ==== */
/* Organic Pet · Barra de confianza (trust bar) — CSS literal del original.
   Generado por landing/tools/extraer-secciones.py desde landing/qa/referencia/origen/dom-desk.html
   (bloque gp-custom-code data-id="gh5Pj4van8"). NO editar a mano: cambiar el script y volver a generar. */
  /* ========================================
     ORGANIC PET — TRUST BAR OCEANO ESENCIAL
     Compatible con Shopify y GemPages
     ======================================== */

  .opn-trust-v4,
  .opn-trust-v4 * {
    box-sizing: border-box !important;
  }

  .opn-trust-v4 {
    position: relative !important;
    z-index: 1 !important;
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    background: #12384F !important;
    color: #FFFFFF !important;
    font-family: "Poppins", Arial, sans-serif !important;
  }

  .opn-trust-v4__inner {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    align-items: center !important;
    width: 100% !important;
    max-width: 1200px !important;
    min-height: 76px !important;
    margin: 0 auto !important;
    padding: 13px 20px !important;
  }

  .opn-trust-v4__item {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 15px !important;
    text-align: center !important;
  }

  /* Separadores entre indicadores */
  .opn-trust-v4__item:not(:last-child)::after {
    content: "" !important;
    position: absolute !important;
    top: 50% !important;
    right: 0 !important;
    width: 1px !important;
    height: 34px !important;
    background: rgba(22, 182, 190, 0.5) !important;
    transform: translateY(-50%) !important;
  }

  /* Cifras principales */
  .opn-trust-v4__number {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #CAF56B !important;
    font-size: 21px !important;
    font-weight: 800 !important;
    line-height: 1.15 !important;
    letter-spacing: -0.3px !important;
    white-space: nowrap !important;
  }

  /* Texto descriptivo */
  .opn-trust-v4__label {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #FFFFFF !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    line-height: 1.3 !important;
    letter-spacing: 0 !important;
  }

  /* Estrella de calificacion */
  .opn-trust-v4__star {
    color: #CAF56B !important;
    font-size: 0.9em !important;
    vertical-align: 1px !important;
  }

  /* ========================================
     VERSION MOVIL
     ======================================== */

  @media (max-width: 700px) {
    .opn-trust-v4__inner {
      grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
      min-height: 68px !important;
      padding: 12px 5px !important;
    }

    .opn-trust-v4__item {
      gap: 4px !important;
      padding: 0 5px !important;
    }

    .opn-trust-v4__number {
      font-size: 15px !important;
      font-weight: 800 !important;
      letter-spacing: -0.3px !important;
    }

    .opn-trust-v4__label {
      font-size: 10px !important;
      font-weight: 500 !important;
      line-height: 1.25 !important;
    }

    .opn-trust-v4__item:not(:last-child)::after {
      height: 30px !important;
    }
  }

  /* Pantallas pequenas */
  @media (max-width: 360px) {
    .opn-trust-v4__inner {
      padding: 11px 3px !important;
    }

    .opn-trust-v4__item {
      padding: 0 3px !important;
    }

    .opn-trust-v4__number {
      font-size: 13px !important;
    }

    .opn-trust-v4__label {
      font-size: 9px !important;
    }
  }
/* ==== assets/css/12-resultados.css ==== */
/* Organic Pet · Resultados + video de la veterinaria + CTA — CSS literal del original.
   Generado por landing/tools/extraer-secciones.py desde landing/qa/referencia/origen/dom-desk.html
   (bloque gp-custom-code data-id="gxKuS7r62r"). NO editar a mano: cambiar el script y volver a generar. */
/* ==========================================
   ORGANIC PET — RESULTADOS + VIDEO + CTA
   OCÉANO ESENCIAL
   ========================================== */

#op-resultados,
#op-resultados * {
  box-sizing: border-box !important;
}

#op-resultados {
  --azul: #12384F;
  --turquesa: #16B6BE;
  --lima: #CAF56B;
  --hielo: #F6FAFB;
  --aqua: #E0F4F3;
  --gris: #5A6B76;

  position: relative !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 38px 16px 58px !important;
  overflow: hidden !important;
  background: #F6FAFB !important;
  color: #173044 !important;
  font-family: "Poppins", Arial, sans-serif !important;
}

#op-resultados .op-container {
  position: relative;
  width: 100%;
  max-width: 1100px;
  margin: 0 auto;
}

/* ==========================================
   ENCABEZADO
   ========================================== */

#op-resultados .op-encabezado {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

#op-resultados .op-titulo {
  max-width: 750px;
  margin: 0 auto 12px !important;
  padding: 0 !important;
  color: #12384F !important;
  font-size: clamp(26px, 4vw, 40px) !important;
  font-weight: 800 !important;
  line-height: 1.17 !important;
  letter-spacing: -0.5px !important;
  text-align: center !important;
}

#op-resultados .op-titulo-acento {
  background-image: linear-gradient(
    transparent 73%,
    #CAF56B 73%
  );
  background-repeat: no-repeat;
}

#op-resultados .op-subtitulo {
  max-width: 590px;
  margin: 0 auto 25px !important;
  color: #5A6B76 !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
  text-align: center !important;
}

/* ==========================================
   CATEGORÍAS
   ========================================== */

#op-resultados .op-categorias {
  display: grid !important;
  grid-template-columns:
    repeat(2, minmax(0, 1fr)) !important;
  gap: 9px !important;
  width: 100%;
  max-width: 1000px;
  margin: 0 auto 25px !important;
}

#op-resultados .op-categoria {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 48px !important;
  margin: 0 !important;
  padding: 10px 9px !important;

  background: #FFFFFF !important;
  border: 1.5px solid #B9DDE0 !important;
  border-radius: 13px !important;
  color: #12384F !important;

  font-family: inherit !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  text-align: center !important;
  white-space: normal !important;
  cursor: pointer !important;

  transition:
    background .2s ease,
    color .2s ease,
    border-color .2s ease !important;
}

#op-resultados .op-categoria--todos {
  grid-column: 1 / -1 !important;
  justify-self: center !important;
}

#op-resultados .op-categoria:hover {
  background: #E0F4F3 !important;
  border-color: #16B6BE !important;
}

#op-resultados .op-categoria.activa,
#op-resultados .op-categoria.activa:hover {
  background: #12384F !important;
  border-color: #12384F !important;
  color: #FFFFFF !important;
}

#op-resultados .op-categoria.activa::before {
  content: "" !important;
  display: inline-block !important;
  flex: 0 0 auto !important;
  width: 7px !important;
  height: 7px !important;
  margin-right: 7px !important;
  border-radius: 50% !important;
  background: #CAF56B !important;
}

/* ==========================================
   CARRUSEL
   ========================================== */

#op-resultados .op-carrusel {
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
}

#op-resultados .op-ventana {
  width: 100%;
  overflow: hidden;
  border-radius: 22px;
  touch-action: pan-y;
  cursor: grab;
  user-select: none;
  -webkit-user-select: none;
}

#op-resultados .op-ventana:active {
  cursor: grabbing;
}

#op-resultados .op-pista {
  display: flex !important;
  align-items: stretch !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  transition: transform .38s ease !important;
  will-change: transform;
}

#op-resultados .op-pista.sin-animacion {
  transition: none !important;
}

#op-resultados .op-slide {
  flex: 0 0 100% !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 2px !important;
}

#op-resultados .op-slide[hidden] {
  display: none !important;
}

/* ==========================================
   TARJETAS DE RESULTADOS
   ========================================== */

#op-resultados .op-tarjeta {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #FFFFFF;
  border: 1px solid #D9E9EA;
  border-radius: 21px;
  box-shadow: 0 7px 24px rgba(18,56,79,.07);
}

#op-resultados .op-tarjeta::after {
  content: "";
  display: block;
  width: 100%;
  height: 4px;
  flex-shrink: 0;
  background: linear-gradient(
    90deg,
    #12384F,
    #16B6BE 65%,
    #CAF56B
  );
}

#op-resultados .op-imagen {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: #E0F4F3;
}

#op-resultados .op-imagen img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
}

#op-resultados .op-placeholder {
  display: grid;
  grid-template-columns: 1fr 1fr;
  width: 100%;
  height: 100%;
}

#op-resultados .op-placeholder div {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  background: #EDF3F4;
  color: #12384F;
  text-align: center;
}

#op-resultados .op-placeholder div + div {
  background: #E0F4F3;
  border-left: 2px solid white;
}

/* ==========================================
   INFORMACIÓN DE LA MASCOTA
   ========================================== */

#op-resultados .op-info {
  display: flex;
  align-items: center;
  gap: 13px;
  width: 100%;
  padding: 19px 20px 21px;
  background: #FFFFFF;
}

#op-resultados .op-icono-mascota {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 43px;
  height: 43px;
  border-radius: 13px;
  background: #E0F4F3;
  color: #12384F;
}

#op-resultados .op-icono-mascota svg {
  width: 22px;
  height: 22px;
  fill: currentColor;
}

#op-resultados .op-datos {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 5px;
  min-width: 0;
}

#op-resultados .op-nombre {
  margin: 0 !important;
  color: #12384F !important;
  font-size: 21px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
}

#op-resultados .op-tiempo {
  margin: 0 !important;
  color: #5A6B76 !important;
  font-size: 12px !important;
  line-height: 1.4 !important;
}

#op-resultados .op-tiempo strong {
  color: #173044 !important;
  font-weight: 700 !important;
}

/* ==========================================
   NAVEGACIÓN DEL CARRUSEL
   ========================================== */

#op-resultados .op-navegacion {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: 17px;
}

#op-resultados .op-flecha {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  min-width: 108px !important;
  min-height: 49px !important;
  margin: 0 !important;
  padding: 10px 13px !important;

  background: #FFFFFF !important;
  border: 1.5px solid #B7D4D9 !important;
  border-radius: 13px !important;
  color: #12384F !important;

  font-family: inherit !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  cursor: pointer !important;
}

#op-resultados .op-flecha:hover {
  background: #E0F4F3 !important;
}

#op-resultados .op-arrow {
  font-size: 19px;
  line-height: 1;
}

#op-resultados .op-contador {
  color: #12384F !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  white-space: nowrap;
  text-align: center;
}

#op-resultados .op-ayuda {
  margin: 14px auto 0 !important;
  color: #5A6B76 !important;
  font-size: 11px !important;
  line-height: 1.4 !important;
  text-align: center !important;
}

/* ==========================================
   VIDEO DE LA VETERINARIA
   ========================================== */

#op-resultados .op-video-seccion {
  width: 100%;
  max-width: 850px;
  margin: 46px auto 0;
  text-align: center;
}

#op-resultados .op-video-encabezado {
  max-width: 690px;
  margin: 0 auto 22px;
}

#op-resultados .op-video-titulo {
  margin: 0 auto 12px !important;
  color: #12384F !important;
  font-size: clamp(24px, 3.6vw, 34px) !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  letter-spacing: -0.4px !important;
  text-align: center !important;
}

#op-resultados .op-video-linea {
  display: block !important;
}

#op-resultados .op-video-acento {
  color: #087B81 !important;
}

/* ==========================================
   CAMBIO 1:
   BORDE AZUL OCÉANO #12384F
   ========================================== */

#op-resultados .op-video-contenedor {
  width: 80% !important;
  max-width: 336px !important;
  margin: 0 auto;
  padding: 6px;

  background: #12384F !important;
  border: 2px solid #12384F !important;
  border-radius: 22px;

  box-shadow: 0 8px 28px rgba(18,56,79,.08);
}

/* Mantener video vertical 9:16 */

#op-resultados .op-video-reproductor {
  position: relative;
  width: 100%;
  aspect-ratio: 9 / 16;
  overflow: hidden;
  border-radius: 17px;
  background: #12384F;
}

/* Compatibilidad con video horizontal */

#op-resultados .op-video-contenedor.horizontal {
  max-width: 640px !important;
}

#op-resultados
.op-video-contenedor.horizontal
.op-video-reproductor {
  aspect-ratio: 16 / 9;
}

/* Reproductor */

#op-resultados .op-video-reproductor video,
#op-resultados .op-video-reproductor iframe {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: #12384F;
}

#op-resultados .op-video-reproductor video {
  object-fit: contain !important;
}

/* ==========================================
   CAMBIO 2:
   BOTÓN DE PLAY SOBRE LA PORTADA
   ========================================== */

#op-resultados .op-video-play-overlay {
  position: absolute !important;
  z-index: 3 !important;

  top: 50% !important;
  left: 50% !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  width: 64px !important;
  height: 64px !important;

  padding: 0 !important;
  margin: 0 !important;

  transform: translate(-50%, -50%) !important;

  border: none !important;
  border-radius: 50% !important;

  background: #CAF56B !important;
  color: #12384F !important;

  box-shadow:
    0 3px 12px rgba(18,56,79,.20) !important;

  cursor: pointer !important;
}

/* Ocultar al reproducir */

#op-resultados .op-video-play-overlay[hidden] {
  display: none !important;
}

/* Triángulo azul océano */

#op-resultados .op-video-play-overlay svg {
  display: block !important;
  width: 28px !important;
  height: 28px !important;

  margin-left: 3px !important;

  fill: #12384F !important;
}

#op-resultados .op-video-play-overlay:focus-visible {
  outline: 3px solid #FFFFFF !important;
  outline-offset: 4px !important;
}

/* Placeholder si no hay URL */

#op-resultados .op-video-pendiente {
  position: absolute;
  inset: 0;

  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;

  padding: 24px;
  color: #FFFFFF;
  text-align: center;

  background: linear-gradient(
    145deg,
    #12384F,
    #156E7C
  );
}

#op-resultados .op-video-play {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 64px;
  height: 64px;

  border-radius: 50%;
  background: #CAF56B;
  color: #12384F;

  font-size: 27px;
  padding-left: 4px;
}

#op-resultados .op-video-pendiente strong {
  color: #FFFFFF;
  font-size: 17px;
  font-weight: 800;
  line-height: 1.35;
}

#op-resultados .op-video-pendiente span {
  color: #E0F4F3;
  font-size: 12px;
  line-height: 1.5;
}

/* ==========================================
   CTA HACIA PRODUCTOS
   ========================================== */

#op-resultados .op-cta-bloque {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;

  width: 100%;
  max-width: 600px;

  margin: 28px auto 0;
  text-align: center;
}

#op-resultados .op-cta-productos {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;

  width: 100% !important;
  max-width: 480px !important;
  min-height: 58px !important;

  margin: 0 auto !important;
  padding: 15px 20px !important;

  background: #CAF56B !important;
  border: 2px solid #CAF56B !important;
  border-radius: 14px !important;

  color: #193341 !important;
  font-family: inherit !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  text-align: center !important;
  text-decoration: none !important;

  box-shadow: 0 6px 16px rgba(18,56,79,.09);
  cursor: pointer !important;

  transition:
    background .2s ease,
    transform .2s ease,
    box-shadow .2s ease !important;
}

#op-resultados .op-cta-productos:hover {
  background: #D9FF88 !important;
  border-color: #D9FF88 !important;
  color: #193341 !important;
  transform: translateY(-2px);
  box-shadow: 0 9px 20px rgba(18,56,79,.13);
}

#op-resultados .op-cta-flecha {
  font-size: 23px;
  line-height: 1;
}

#op-resultados .op-cta-texto {
  margin: 0 auto !important;
  color: #5A6B76 !important;
  font-size: 12px !important;
  line-height: 1.5 !important;
  text-align: center !important;
}

/* ==========================================
   ACCESIBILIDAD
   ========================================== */

#op-resultados button:focus-visible,
#op-resultados a:focus-visible,
#op-resultados .op-ventana:focus-visible {
  outline: 3px solid #16B6BE !important;
  outline-offset: 3px !important;
}

/* ==========================================
   TABLET
   ========================================== */

@media (min-width: 720px) {

  #op-resultados {
    padding: 55px 24px 70px !important;
  }

  #op-resultados .op-categorias {
    grid-template-columns:
      repeat(3, minmax(0, 1fr)) !important;
    gap: 11px !important;
  }

  #op-resultados .op-categoria--todos {
    grid-column: 1 / -1 !important;
    width: 240px !important;
    max-width: 100% !important;
    justify-self: center !important;
  }

  #op-resultados .op-categoria {
    font-size: 14px !important;
    min-height: 50px !important;
  }

  #op-resultados .op-info {
    padding: 22px 27px 24px;
  }

  #op-resultados .op-nombre {
    font-size: 25px !important;
  }

  #op-resultados .op-tiempo {
    font-size: 14px !important;
  }

  #op-resultados .op-flecha {
    min-width: 135px !important;
    font-size: 14px !important;
  }

  #op-resultados .op-video-seccion {
    margin-top: 58px;
  }
}

/* ==========================================
   ESCRITORIO
   ========================================== */

@media (min-width: 1000px) {

  #op-resultados .op-categorias {
    grid-template-columns:
      repeat(6, minmax(0, 1fr)) !important;
  }

  #op-resultados .op-categoria--todos {
    grid-column: 1 / -1 !important;
    width: 240px !important;
    justify-self: center !important;
  }

  #op-resultados .op-categoria {
    font-size: 12px !important;
    padding: 10px 6px !important;
  }
}

/* ==========================================
   MÓVILES PEQUEÑOS
   ========================================== */

@media (max-width: 380px) {

  #op-resultados .op-flecha {
    min-width: 92px !important;
    padding: 10px 7px !important;
    font-size: 11px !important;
  }

  #op-resultados .op-contador {
    font-size: 11px !important;
  }

  #op-resultados .op-nombre {
    font-size: 18px !important;
  }

  #op-resultados .op-info {
    padding: 16px 14px;
    gap: 10px;
  }

  #op-resultados .op-cta-productos {
    font-size: 13px !important;
    min-height: 56px !important;
  }
}

/* REDUCIR MOVIMIENTO */

@media (prefers-reduced-motion: reduce) {

  #op-resultados .op-pista,
  #op-resultados .op-categoria,
  #op-resultados .op-cta-productos {
    transition: none !important;
  }
}
/* ==== assets/css/13-dos-formas.css ==== */
/* Organic Pet · Dos formas de cuidar su piel (op-care-system) — CSS literal del original.
   Generado por landing/tools/extraer-secciones.py desde landing/qa/referencia/origen/dom-desk.html
   (bloque gp-custom-code data-id="grD8qMnGsg"). NO editar a mano: cambiar el script y volver a generar. */
/* ==========================================
   ORGANIC PET — CUIDADO INTERNO Y EXTERNO
   OCÉANO ESENCIAL — VERSIÓN ACTUALIZADA
   Compatible con Shopify y GemPages
   ========================================== */

#op-care-system,
#op-care-system * {
  box-sizing: border-box !important;
}

#op-care-system {
  --op-navy: #12384F;
  --op-navy-dark: #0D2B3E;
  --op-turquoise: #16B6BE;
  --op-lime: #CAF56B;
  --op-ice: #F6FAFB;
  --op-white: #FFFFFF;
  --op-aqua: #E0F4F3;
  --op-ink: #173044;
  --op-gray: #5A6B76;

  position: relative !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 65px 20px 75px !important;
  overflow: hidden !important;

  background: linear-gradient(
    160deg,
    #12384F 0%,
    #0D2B3E 100%
  ) !important;

  color: #FFFFFF !important;
  font-family: "Poppins", Arial, sans-serif !important;
}

/* ==========================================
   CONTENEDOR GENERAL
   ========================================== */

#op-care-system .op-care-container {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 1120px;
  margin: 0 auto;
}

/* ==========================================
   DECORACIÓN SUTIL DE MASCOTAS
   ========================================== */

#op-care-system .op-care-paw {
  position: absolute;
  z-index: 0;

  color: #CAF56B;
  opacity: .07;

  pointer-events: none;
  user-select: none;
  line-height: 1;
}

#op-care-system .op-care-paw--one {
  top: 6%;
  left: 2%;
  font-size: 85px;
  transform: rotate(-22deg);
}

#op-care-system .op-care-paw--two {
  right: 2%;
  bottom: 7%;
  font-size: 100px;
  transform: rotate(18deg);
}

/* ==========================================
   ENCABEZADO
   ========================================== */

#op-care-system .op-care-header {
  max-width: 790px;
  margin: 0 auto 38px;
  text-align: center;
}

/* TÍTULO PRINCIPAL */

#op-care-system .op-care-title {
  margin: 0 auto !important;
  padding: 0 !important;

  color: #FFFFFF !important;
  font-family: inherit !important;

  font-size: clamp(30px, 4vw, 46px) !important;
  font-weight: 800 !important;
  line-height: 1.12 !important;
  letter-spacing: -1px !important;

  text-align: center !important;
}

/* TÍTULO EN DOS LÍNEAS */

#op-care-system .op-care-title-line {
  display: block !important;
  color: #FFFFFF !important;
}

#op-care-system .op-care-title-accent {
  display: block !important;
  color: #CAF56B !important;
}

/* LÍNEA DECORATIVA */

#op-care-system .op-care-title::after {
  content: "";

  display: block;
  width: 62px;
  height: 4px;

  margin: 17px auto 0;
  border-radius: 999px;

  background: #16B6BE;
}

/* ==========================================
   NUEVO TEXTO PERSUASIVO
   ========================================== */

#op-care-system .op-care-intro {
  max-width: 650px;

  margin: 20px auto 0 !important;
  padding: 0 !important;

  color: #E0F4F3 !important;
  font-family: inherit !important;

  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 1.65 !important;

  text-align: center !important;
}

#op-care-system .op-care-intro strong {
  color: #CAF56B !important;
  font-weight: 800 !important;
}

/* ==========================================
   DISTRIBUCIÓN DE LAS TARJETAS
   ========================================== */

#op-care-system .op-care-grid {
  display: grid !important;

  grid-template-columns:
    minmax(0, 1fr)
    76px
    minmax(0, 1fr) !important;

  align-items: stretch !important;

  gap: 16px !important;
  width: 100% !important;
}

/* ==========================================
   TARJETAS
   APARIENCIA IDÉNTICA
   ========================================== */

#op-care-system .op-care-card {
  display: flex !important;
  flex-direction: column !important;

  min-width: 0 !important;
  width: 100% !important;
  height: 100% !important;

  overflow: hidden !important;

  background: #FFFFFF !important;
  border: 2px solid #16B6BE !important;
  border-radius: 22px !important;

  box-shadow:
    0 12px 36px rgba(0,0,0,.13) !important;
}

/* ==========================================
   FRANJA SUPERIOR
   MISMO COLOR EN AMBAS TARJETAS
   ========================================== */

#op-care-system .op-care-card-label {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  gap: 9px !important;

  width: 100% !important;
  min-height: 52px !important;

  margin: 0 !important;
  padding: 13px 16px !important;

  background: #16B6BE !important;

  color: #12384F !important;
  font-family: inherit !important;

  font-size: 15px !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  letter-spacing: .5px !important;

  text-align: center !important;
}

#op-care-system .op-care-label-icon {
  font-size: 19px !important;
  line-height: 1 !important;
}

/* ==========================================
   ÁREA DE IMAGEN
   MISMO FONDO Y DIMENSIONES
   ========================================== */

#op-care-system .op-care-image-wrap {
  position: relative;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  width: 100% !important;
  min-height: 280px !important;

  margin: 0 !important;
  padding: 20px !important;

  overflow: hidden !important;

  background: #F6FAFB !important;
}

/* IMÁGENES DE LOS PRODUCTOS */

#op-care-system .op-care-product-image {
  display: block !important;

  width: 100% !important;
  height: 255px !important;

  margin: 0 auto !important;

  object-fit: contain !important;
  object-position: center !important;

  border-radius: 14px !important;
}

/* ==========================================
   CONTENIDO DE LAS TARJETAS
   ========================================== */

#op-care-system .op-care-card-content {
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;

  width: 100% !important;
  min-height: 185px !important;

  margin: 0 !important;
  padding: 25px 25px 30px !important;

  background: #FFFFFF !important;

  text-align: center !important;
}

/* TÍTULOS DE TARJETAS */

#op-care-system .op-care-card-title {
  max-width: 350px;

  margin: 0 auto 12px !important;
  padding: 0 !important;

  color: #12384F !important;

  font-family: inherit !important;
  font-size: 21px !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;

  text-align: center !important;
}

/* DESCRIPCIONES */

#op-care-system .op-care-card-description {
  max-width: 370px;

  margin: 0 auto !important;
  padding: 0 !important;

  color: #5A6B76 !important;

  font-family: inherit !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;

  text-align: center !important;
}

/* PALABRAS DESTACADAS
   MISMO COLOR EN AMBAS TARJETAS */

#op-care-system
.op-care-card-description strong {
  color: #087B81 !important;
  font-weight: 800 !important;
}

/* ==========================================
   CONECTOR CENTRAL
   ========================================== */

#op-care-system .op-care-connector {
  position: relative;
  z-index: 4;

  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;

  gap: 9px !important;

  min-width: 0 !important;

  text-align: center !important;
}

/* CÍRCULO CON SIGNO + */

#op-care-system .op-care-plus {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  width: 64px !important;
  height: 64px !important;
  flex: 0 0 64px !important;

  border: 5px solid #12384F !important;
  border-radius: 50% !important;

  background: #CAF56B !important;
  color: #12384F !important;

  box-shadow:
    0 6px 22px rgba(0,0,0,.15) !important;

  font-family: inherit !important;
  font-size: 37px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

/* TEXTO BAJO EL + */

#op-care-system .op-care-connector-text {
  color: #E0F4F3 !important;

  font-family: inherit !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  letter-spacing: .5px !important;

  text-align: center !important;
}

/* ==========================================
   TABLET
   ========================================== */

@media (max-width: 950px) and (min-width: 701px) {

  #op-care-system .op-care-grid {
    grid-template-columns:
      minmax(0, 1fr)
      60px
      minmax(0, 1fr) !important;

    gap: 10px !important;
  }

  #op-care-system .op-care-plus {
    width: 54px !important;
    height: 54px !important;
    flex-basis: 54px !important;

    font-size: 31px !important;
  }

  #op-care-system .op-care-card-content {
    padding: 23px 16px 26px !important;
  }

  #op-care-system .op-care-card-title {
    font-size: 18px !important;
  }

  #op-care-system .op-care-product-image {
    height: 225px !important;
  }

  #op-care-system .op-care-image-wrap {
    min-height: 250px !important;
  }
}

/* ==========================================
   MÓVIL
   ========================================== */

@media (max-width: 700px) {

  #op-care-system {
    padding: 49px 15px 58px !important;
  }

  /* DECORACIÓN */

  #op-care-system .op-care-paw--one {
    font-size: 64px;
    top: 3%;
    left: -5%;
  }

  #op-care-system .op-care-paw--two {
    font-size: 65px;
    bottom: 3%;
    right: -4%;
  }

  /* ENCABEZADO */

  #op-care-system .op-care-header {
    margin-bottom: 28px !important;
  }

  #op-care-system .op-care-title {
    font-size: 29px !important;
    line-height: 1.15 !important;
    letter-spacing: -.7px !important;
  }

  #op-care-system .op-care-title::after {
    width: 55px;
    height: 4px;
    margin-top: 15px;
  }

  /* TEXTO PERSUASIVO */

  #op-care-system .op-care-intro {
    max-width: 360px;

    margin-top: 17px !important;

    font-size: 14px !important;
    line-height: 1.55 !important;
  }

  /* TARJETAS APILADAS */

  #op-care-system .op-care-grid {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;

    gap: 0 !important;
  }

  #op-care-system .op-care-card {
    width: 100% !important;
    max-width: 440px !important;

    height: auto !important;

    border-radius: 20px !important;
  }

  /* FRANJAS SUPERIORES */

  #op-care-system .op-care-card-label {
    min-height: 47px !important;

    padding: 11px 13px !important;

    font-size: 13px !important;
  }

  #op-care-system .op-care-label-icon {
    font-size: 17px !important;
  }

  /* IMÁGENES */

  #op-care-system .op-care-image-wrap {
    min-height: 270px !important;
    padding: 13px !important;
  }

  #op-care-system .op-care-product-image {
    height: 245px !important;
  }

  /* CONTENIDO */

  #op-care-system .op-care-card-content {
    min-height: 160px !important;

    padding: 20px 18px 24px !important;
  }

  #op-care-system .op-care-card-title {
    margin-bottom: 9px !important;
    font-size: 19px !important;
  }

  #op-care-system .op-care-card-description {
    font-size: 13px !important;
    line-height: 1.55 !important;
  }

  /* CONECTOR ENTRE TARJETAS */

  #op-care-system .op-care-connector {
    z-index: 5;
    margin: -7px 0 !important;
  }

  #op-care-system .op-care-plus {
    width: 54px !important;
    height: 54px !important;
    flex-basis: 54px !important;

    border: 5px solid #12384F !important;

    font-size: 31px !important;
  }

  #op-care-system .op-care-connector-text {
    display: none !important;
  }
}

/* ==========================================
   MÓVILES PEQUEÑOS
   ========================================== */

@media (max-width: 380px) {

  #op-care-system {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  #op-care-system .op-care-title {
    font-size: 27px !important;
  }

  #op-care-system .op-care-intro {
    font-size: 13px !important;
  }

  #op-care-system .op-care-image-wrap {
    min-height: 240px !important;
  }

  #op-care-system .op-care-product-image {
    height: 215px !important;
  }

  #op-care-system .op-care-card-title {
    font-size: 18px !important;
  }

  #op-care-system .op-care-card-description {
    font-size: 12.5px !important;
  }
}
/* ==== assets/css/14-productos.css ==== */
/* Organic Pet · Productos + contador HOT SALE + modal «foto y modo de uso» — CSS literal del original.
   Generado por landing/tools/extraer-secciones.py desde landing/qa/referencia/origen/dom-desk.html
   (bloque gp-custom-code data-id="gFIjx757Mi"). NO editar a mano: cambiar el script y volver a generar. */
#op-productos,#op-productos *,#op-product-modal,#op-product-modal *{box-sizing:border-box!important}
#op-productos{width:100%!important;margin:0!important;padding:58px 16px 72px!important;background:#F6FAFB!important;color:#173044!important;font-family:Poppins,Arial,sans-serif!important;scroll-margin-top:80px}
#op-productos .op-container{max-width:1200px;margin:auto}
#op-productos .op-heading{text-align:center;max-width:770px;margin:0 auto 28px}
#op-productos .op-heading h2{font:800 clamp(28px,4vw,41px)/1.18 Poppins,Arial,sans-serif!important;color:#12384F!important;margin:0 0 10px!important;letter-spacing:-.7px!important}
#op-productos .op-heading h2 span{color:#087B81!important}
#op-productos .op-heading p{font-size:14px!important;line-height:1.5!important;color:#5A6B76!important;margin:0!important}

/* BANNER HOT SALE */
#op-productos .op-sale-banner{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:25px;max-width:1050px;margin:0 auto 27px;padding:24px 29px;background:linear-gradient(120deg,#12384F,#0D2B3E);border:1px solid #35586B;border-radius:21px;box-shadow:0 10px 30px rgba(18,56,79,.13)}
#op-productos .op-sale-tag{display:inline-flex;align-items:center;padding:7px 12px;border-radius:999px;background:#D62828;color:#fff;font:900 11px/1 Poppins,Arial,sans-serif;letter-spacing:.8px}
#op-productos .op-sale-title{margin:12px 0 5px!important;color:#fff!important;font:900 clamp(26px,3.5vw,41px)/1.08 Poppins,Arial,sans-serif!important;letter-spacing:-1px!important}
#op-productos .op-sale-title strong{color:#CAF56B!important}
#op-productos .op-sale-desc{margin:0!important;color:#DCECEF!important;font-size:12px!important;line-height:1.5!important}
#op-productos .op-sale-clock{text-align:center;min-width:252px}
#op-productos .op-sale-clock-title{display:block;margin-bottom:9px;color:#EFF8F9;font-size:11px;font-weight:800;letter-spacing:.4px}
#op-productos .op-sale-counter{display:flex;align-items:flex-start;justify-content:center;gap:6px;font-variant-numeric:tabular-nums}
#op-productos .op-sale-unit{display:flex;flex-direction:column;align-items:center;gap:5px}
#op-productos .op-sale-unit b{display:grid;place-items:center;min-width:63px;height:55px;padding:4px;border-radius:11px;background:#fff;color:#12384F;font-size:28px;font-weight:900;line-height:1}
#op-productos .op-sale-unit small{color:#DAE8EA;font-size:9px;font-weight:800;letter-spacing:.3px}
#op-productos .op-sale-sep{margin-top:8px;color:#CAF56B;font-size:27px;font-weight:900}
#op-productos .op-sale-note{margin:8px 0 0!important;color:#D1E0E4!important;font-size:9px!important;line-height:1.45!important}

/* GRID DE PRODUCTOS */
#op-productos .op-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:20px!important;align-items:stretch!important}
#op-productos .op-card{display:flex!important;flex-direction:column!important;min-width:0;overflow:hidden;background:#fff!important;border:1.5px solid #DCEAED!important;border-radius:20px!important;box-shadow:0 6px 24px rgba(18,56,79,.07);transition:transform .2s,box-shadow .2s}
#op-productos .op-card.featured{border:2px solid #16B6BE!important;box-shadow:0 9px 30px rgba(18,56,79,.12)}
#op-productos .op-card-header{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:90px;padding:20px 14px 15px;text-align:center}
#op-productos .op-feature{display:inline-flex;padding:7px 12px;border-radius:99px;background:#E0F4F3;color:#087B81;font-size:10px;font-weight:800;letter-spacing:.3px}
#op-productos .op-name{margin:0!important;color:#12384F!important;font-size:23px!important;font-weight:800!important;line-height:1.17!important;letter-spacing:-.5px!important;text-align:center!important}

/* IMAGEN INTERACTIVA */
#op-productos .op-image-wrap{position:relative;width:calc(100% - 30px);aspect-ratio:4/3;margin:0 15px;background:#F6FAFB;border-radius:15px;overflow:hidden}
#op-productos .op-image-button{position:absolute!important;inset:0!important;display:flex!important;align-items:center!important;justify-content:center!important;width:100%!important;height:100%!important;padding:12px!important;margin:0!important;border:0!important;border-radius:15px!important;background:transparent!important;cursor:zoom-in!important;touch-action:manipulation}
#op-productos .op-image{display:block;width:100%;height:100%;object-fit:contain;object-position:center}
#op-productos .op-image-hint{position:absolute;left:50%;bottom:9px;transform:translateX(-50%);max-width:calc(100% - 14px);padding:7px 11px;background:rgba(255,255,255,.97);border:1px solid #D9EBEC;border-radius:99px;color:#12384F;font-size:10.5px;font-weight:700;white-space:nowrap;box-shadow:0 2px 9px rgba(18,56,79,.08)}

/* BADGES DE DESCUENTO ROJOS */
#op-productos .op-discount{position:absolute;z-index:2;top:11px;right:11px;padding:10px 12px;border-radius:10px;background:#D62828!important;color:#fff!important;font-size:16px!important;font-weight:900!important;line-height:1!important;pointer-events:none;box-shadow:0 3px 10px rgba(132,19,19,.16)}

/* CONTENIDO DE TARJETAS */
#op-productos .op-body{display:flex;flex:1;flex-direction:column;padding:20px 19px 22px}
#op-productos .op-benefit{margin:0 0 10px!important;color:#12384F!important;font-size:19px!important;font-weight:800!important;line-height:1.3!important}
#op-productos .op-includes{margin:0 0 14px!important;color:#5A6B76!important;font-size:12.5px!important;line-height:1.6!important}
#op-productos .op-reviews{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin-bottom:16px;color:#5A6B76;font-size:12px}
#op-productos .op-stars{position:relative;display:inline-block;color:#D1DCE0;font:700 18px/1 Arial,sans-serif;letter-spacing:1px;white-space:nowrap}
#op-productos .op-stars::after{content:"★★★★★";position:absolute;inset:0 auto 0 0;width:var(--stars,100%);overflow:hidden;color:#16B6BE;white-space:nowrap}
#op-productos .op-review-count{color:#87959F;font-size:11px}
#op-productos .op-bottom{margin-top:auto}
#op-productos .op-divider{height:1px;margin-bottom:17px;background:#E5EEF0}
#op-productos .op-prices{display:flex;align-items:baseline;flex-wrap:wrap;gap:9px;min-height:42px;margin-bottom:17px}
#op-productos .op-price{color:#12384F;font-size:29px;font-weight:900;line-height:1.1;letter-spacing:-.8px;white-space:nowrap}
#op-productos .op-old-price{color:#89969E;font-size:15px;text-decoration:line-through;white-space:nowrap}

/* BOTONES SHOPIFY */
#op-productos .op-buy,#op-product-modal .op-buy{display:flex!important;align-items:center!important;justify-content:center!important;gap:9px!important;width:100%!important;min-height:56px!important;padding:13px 12px!important;margin:0!important;background:#CAF56B!important;border:2px solid #CAF56B!important;border-radius:13px!important;color:#193341!important;font:800 13px/1.25 Poppins,Arial,sans-serif!important;cursor:pointer!important;text-align:center!important;box-shadow:0 4px 10px rgba(18,56,79,.07)}
#op-productos .op-buy:hover:not(:disabled),#op-product-modal .op-buy:hover:not(:disabled){background:#D9FF88!important;border-color:#D9FF88!important}
#op-productos .op-buy:disabled,#op-product-modal .op-buy:disabled{opacity:.68!important;cursor:wait!important}
#op-productos .op-buy svg,#op-product-modal .op-buy svg{width:20px;height:20px;fill:none;stroke:#193341;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
#op-productos .op-trust,#op-product-modal .op-trust{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:5px;margin:12px 0 0!important;color:#5A6B76!important;font-size:10px!important;line-height:1.5!important;text-align:center!important}
#op-productos .op-status,#op-product-modal .op-status{margin:8px 0 0!important;color:#087B81!important;font-size:12px!important;line-height:1.4!important;text-align:center!important}
#op-productos .op-status:empty,#op-product-modal .op-status:empty{display:none}
#op-productos .op-status.error,#op-product-modal .op-status.error{color:#B42318!important}
#op-productos button:focus-visible,#op-product-modal button:focus-visible{outline:3px solid #16B6BE!important;outline-offset:3px!important}

/* POP-UP DE FOTO Y MODO DE USO */
#op-product-modal[hidden]{display:none!important}
#op-product-modal{position:fixed!important;inset:0!important;z-index:2147483000!important;display:flex!important;align-items:center!important;justify-content:center!important;padding:14px!important;background:rgba(8,31,45,.72)!important;color:#173044!important;font-family:Poppins,Arial,sans-serif!important}
#op-product-modal .op-modal-dialog{display:flex;flex-direction:column;width:min(900px,100%);max-height:calc(100vh - 28px);max-height:calc(100dvh - 28px);overflow:hidden;border-radius:20px;background:#fff;box-shadow:0 20px 70px rgba(0,0,0,.25)}
#op-product-modal .op-modal-header{display:flex;align-items:center;justify-content:space-between;gap:12px;flex:none;padding:17px 20px;border-bottom:1px solid #E5EEF0}
#op-product-modal .op-modal-kicker{margin:0 0 4px;color:#087B81;font-size:10px;font-weight:800;letter-spacing:.7px}
#op-product-modal .op-modal-title{margin:0!important;color:#12384F!important;font-size:clamp(19px,3vw,26px)!important;line-height:1.2!important;font-weight:800!important}
#op-product-modal .op-modal-close{display:grid!important;place-items:center!important;flex:none;width:42px!important;height:42px!important;margin:0!important;padding:0!important;border:0!important;border-radius:50%!important;background:#F1F7F8!important;color:#12384F!important;font-size:27px!important;cursor:pointer!important}
#op-product-modal .op-modal-scroll{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:20px}
#op-product-modal .op-modal-layout{display:grid;grid-template-columns:minmax(0,.87fr) minmax(0,1.13fr);align-items:start;gap:24px}
#op-product-modal .op-modal-visual{display:flex;align-items:center;justify-content:center;aspect-ratio:4/3;padding:16px;border-radius:14px;background:#F6FAFB}
#op-product-modal .op-modal-photo{width:100%;height:100%;object-fit:contain}
#op-product-modal .op-modal-subtitle{margin:0 0 13px!important;color:#12384F!important;font-size:20px!important;font-weight:800!important}
#op-product-modal .op-modal-guide{display:grid;gap:10px}
#op-product-modal .op-modal-item{padding:11px 13px;border:1px solid #E3EFF0;border-radius:11px;background:#F6FAFB}
#op-product-modal .op-modal-item h4{margin:0 0 4px!important;color:#12384F!important;font-size:13px!important;font-weight:800!important}
#op-product-modal .op-modal-item p{margin:0!important;color:#4F626D!important;font-size:12.5px!important;line-height:1.55!important}
#op-product-modal .op-modal-note{margin:14px 0 0!important;color:#5A6B76!important;font-size:12px!important;line-height:1.55!important}
#op-product-modal .op-modal-dose{margin-top:14px}
#op-product-modal .op-modal-dose h4{margin:0 0 8px!important;color:#12384F!important;font-size:14px!important;font-weight:800!important}
#op-product-modal .op-modal-table{width:100%;border-collapse:collapse;table-layout:fixed}
#op-product-modal .op-modal-table th{padding:9px 6px;background:#E0F4F3;color:#12384F;font-size:11px;text-align:left}
#op-product-modal .op-modal-table td{padding:10px 6px;border-bottom:1px solid #E5EEF0;color:#173044;font-size:11px;line-height:1.4;vertical-align:top}
#op-product-modal .op-modal-table td small{display:block;margin-top:3px;color:#5A6B76;font-size:10.5px}
#op-product-modal .op-modal-dose-note{margin:8px 0 0!important;color:#5A6B76!important;font-size:11px!important;line-height:1.5!important}
#op-product-modal .op-modal-footer{flex:none;padding:13px 20px 15px;border-top:1px solid #E5EEF0;background:#fff}
#op-product-modal .op-modal-footer-row{display:flex;align-items:center;gap:14px}
#op-product-modal .op-modal-price{flex:none;min-width:110px;color:#12384F;font-size:24px;font-weight:900;white-space:nowrap}
#op-product-modal .op-modal-buy{flex:1;min-width:0}
#op-product-modal .op-trust{margin-top:7px!important}

/* RESPONSIVE */
@media(hover:hover) and (min-width:650px){
  #op-productos .op-card:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(18,56,79,.12)}
}

@media(min-width:650px) and (max-width:999px){
  #op-productos .op-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

@media(min-width:1100px){
  #op-productos .op-name{font-size:25px!important}
  #op-productos .op-benefit{font-size:20px!important}
  #op-productos .op-price{font-size:32px!important}
}

@media(max-width:649px){
  #op-productos{padding:43px 14px 59px!important}
  #op-productos .op-heading{margin-bottom:23px}
  #op-productos .op-sale-banner{grid-template-columns:1fr;gap:18px;padding:21px 15px;margin-bottom:24px;text-align:center;border-radius:17px}
  #op-productos .op-sale-title{font-size:clamp(25px,7vw,34px)!important}
  #op-productos .op-sale-clock{min-width:0}
  #op-productos .op-sale-unit b{min-width:58px;height:52px;font-size:27px}
  #op-productos .op-grid{grid-template-columns:1fr!important;max-width:420px;margin:0 auto;gap:20px!important}
  #op-productos .op-card-header{min-height:0;padding:21px 15px 17px}
  #op-productos .op-name{font-size:26px!important}
  #op-productos .op-body{padding:20px 20px 23px}
  #op-productos .op-benefit{font-size:20px!important}
  #op-productos .op-includes{font-size:13px!important}
  #op-productos .op-price{font-size:33px}
  #op-productos .op-buy{min-height:58px!important;font-size:15px!important}
  #op-productos .op-trust{font-size:11px!important}
}

@media(max-width:700px){
  #op-product-modal{padding:8px!important}
  #op-product-modal .op-modal-dialog{max-height:calc(100dvh - 16px);border-radius:17px}
  #op-product-modal .op-modal-header{padding:14px 15px 12px}
  #op-product-modal .op-modal-scroll{padding:14px}
  #op-product-modal .op-modal-layout{grid-template-columns:1fr;gap:16px}
  #op-product-modal .op-modal-visual{aspect-ratio:16/9;max-height:195px;padding:10px}
  #op-product-modal .op-modal-footer{padding:11px 13px 13px}
  #op-product-modal .op-modal-price{min-width:0;font-size:21px}
  #op-product-modal .op-modal-buy{min-height:51px!important;font-size:12px!important;padding:10px!important}
}

@media(max-width:380px){
  #op-productos .op-sale-unit b{min-width:49px;height:47px;font-size:24px}
  #op-productos .op-name{font-size:24px!important}
  #op-productos .op-price{font-size:29px}
  #op-productos .op-discount{font-size:15px!important;padding:8px 10px}
}

@media(prefers-reduced-motion:reduce){
  #op-productos .op-card{transition:none}
}
/* ==== assets/css/15-quiz.css ==== */
/* Organic Pet · Quiz «¿No sabes cuál elegir?» — CSS literal del original.
   Generado por landing/tools/extraer-secciones.py desde landing/qa/referencia/origen/dom-desk.html
   (bloque gp-custom-code data-id="gsXW_i2JWk"). NO editar a mano: cambiar el script y volver a generar. */
#op-quiz,
#op-quiz * {
  box-sizing: border-box !important;
}

#op-quiz {
  --navy: #12384F;
  --navy2: #0D2B3E;
  --teal: #16B6BE;
  --lime: #CAF56B;
  --aqua: #E0F4F3;
  --ice: #F6FAFB;
  --ink: #173044;
  --gray: #5A6B76;

  position: relative !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 64px 18px 74px !important;

  background: linear-gradient(
    155deg,
    #12384F 0%,
    #0D2B3E 100%
  ) !important;

  color: #FFFFFF !important;
  font-family: "Poppins", Arial, sans-serif !important;
  scroll-margin-top: 75px;
  overflow: hidden !important;
}

#op-quiz .opq-wrap {
  max-width: 1020px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

#op-quiz .opq-intro {
  text-align: center;
  max-width: 700px;
  margin: 0 auto 30px;
}

#op-quiz .opq-eyebrow {
  display: inline-block;
  margin-bottom: 12px;
  color: #CAF56B;
  font-weight: 800;
  letter-spacing: 1.1px;
  font-size: 11px;
}

#op-quiz .opq-title {
  margin: 0 0 12px !important;
  color: #FFFFFF !important;
  font-size: clamp(28px, 4vw, 43px) !important;
  line-height: 1.13 !important;
  font-weight: 800 !important;
  letter-spacing: -.6px !important;
  text-align: center !important;
}

#op-quiz .opq-title em {
  display: block !important;
  font-style: normal;
  color: #CAF56B;
}

#op-quiz .opq-desc {
  margin: 0 auto !important;
  color: #E0F4F3 !important;
  font-size: 15px !important;
  line-height: 1.55 !important;
  text-align: center !important;
}

#op-quiz .opq-panel {
  max-width: 790px;
  margin: 0 auto;
  background: #FFFFFF !important;
  color: #173044 !important;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 22px !important;
  padding: 30px !important;
  box-shadow: 0 15px 40px rgba(0,0,0,.15);
}

/* PROGRESO */

#op-quiz .opq-step-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin: 0 0 12px;
}

#op-quiz .opq-step-label {
  font-size: 12px !important;
  color: #5A6B76 !important;
  font-weight: 700 !important;
}

#op-quiz .opq-step-count {
  font-size: 12px !important;
  color: #087B81 !important;
  font-weight: 800 !important;
}

#op-quiz .opq-progress {
  display: flex;
  gap: 6px;
  margin-bottom: 26px;
}

#op-quiz .opq-progress span {
  height: 5px;
  flex: 1;
  border-radius: 99px;
  background: #E1E9EC;
}

#op-quiz .opq-progress span.on {
  background: #16B6BE;
}

/* PREGUNTAS */

#op-quiz .opq-question {
  margin: 0 0 9px !important;
  color: #12384F !important;
  font-size: clamp(21px, 3vw, 27px) !important;
  line-height: 1.22 !important;
  font-weight: 800 !important;
  outline: none !important;
}

#op-quiz .opq-help {
  margin: 0 0 22px !important;
  color: #5A6B76 !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
}

#op-quiz .opq-options {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  margin-bottom: 25px;
}

#op-quiz .opq-options.multi {
  grid-template-columns: repeat(2, minmax(0,1fr));
}

#op-quiz .opq-option {
  width: 100% !important;
  min-height: 56px !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  text-align: left !important;
  padding: 12px 14px !important;
  margin: 0 !important;

  border: 1.5px solid #DCE9EB !important;
  border-radius: 12px !important;
  background: #FFFFFF !important;
  color: #173044 !important;

  font: 600 13px/1.4 "Poppins", Arial, sans-serif !important;
  cursor: pointer !important;

  transition:
    background .15s,
    border-color .15s !important;
}

#op-quiz .opq-option:hover {
  background: #F3FAF9 !important;
  border-color: #16B6BE !important;
}

#op-quiz .opq-option[aria-pressed="true"] {
  background: #E0F4F3 !important;
  border-color: #16B6BE !important;
  color: #12384F !important;
}

#op-quiz .opq-mark {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;

  width: 22px;
  height: 22px;

  border: 1.7px solid #98ABB2;
  border-radius: 7px;

  font-size: 13px;
  font-weight: 900;
  color: transparent;
  background: white;
}

#op-quiz .opq-option[aria-pressed="true"] .opq-mark {
  background: #16B6BE;
  color: #FFFFFF;
  border-color: #16B6BE;
}

#op-quiz .opq-option.single .opq-mark {
  border-radius: 50%;
}

/* NAVEGACIÓN */

#op-quiz .opq-actions {
  display: flex;
  gap: 11px;
  align-items: center;
}

#op-quiz .opq-next,
#op-quiz .opq-buy {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;

  width: 100% !important;
  min-height: 54px !important;
  margin: 0 !important;
  padding: 13px 14px !important;

  background: #CAF56B !important;
  border: 2px solid #CAF56B !important;
  border-radius: 12px !important;
  color: #193341 !important;

  font: 800 14px/1.25 "Poppins", Arial, sans-serif !important;
  cursor: pointer !important;
  text-align: center !important;
}

#op-quiz .opq-next:disabled,
#op-quiz .opq-buy:disabled {
  opacity: .48 !important;
  cursor: not-allowed !important;
}

#op-quiz .opq-back,
#op-quiz .opq-restart {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  min-height: 54px !important;
  margin: 0 !important;
  padding: 10px 17px !important;

  border: 1.5px solid #CBDFE2 !important;
  border-radius: 12px !important;
  background: #FFFFFF !important;
  color: #12384F !important;

  font: 700 13px "Poppins", Arial, sans-serif !important;
  cursor: pointer !important;
}

/* RESULTADOS */

#op-quiz .opq-results-intro {
  text-align: center;
  margin: 0 0 22px;
}

#op-quiz .opq-results-check {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: 42px;
  height: 42px;
  border-radius: 50%;

  background: #E0F4F3;
  color: #087B81;
  font-size: 23px;
  font-weight: 800;
  margin-bottom: 12px;
}

#op-quiz .opq-results-title {
  margin: 0 0 8px !important;
  color: #12384F !important;

  font-size: clamp(23px, 3vw, 30px) !important;
  line-height: 1.18 !important;
  font-weight: 800 !important;
  text-align: center !important;
}

#op-quiz .opq-results-subtitle {
  margin: 0 !important;
  color: #5A6B76 !important;
  font-size: 13px !important;
  line-height: 1.55 !important;
  text-align: center !important;
}

#op-quiz .opq-results-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 14px;
}

/* TARJETA DE RECOMENDACIÓN */

#op-quiz .opq-rec {
  display: flex;
  flex-direction: column;
  min-width: 0;

  background: #FFFFFF;
  border: 1.5px solid #DCE9EB;
  border-radius: 16px;
  padding: 16px;
}

#op-quiz .opq-rec.first {
  border: 2px solid #16B6BE;
  box-shadow: 0 6px 20px rgba(22,182,190,.09);
}

#op-quiz .opq-rec-tag {
  align-self: flex-start;
  border-radius: 99px;
  background: #E0F4F3;
  padding: 6px 10px;

  color: #087B81;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .3px;
}

#op-quiz .opq-rec:not(.first) .opq-rec-tag {
  background: #F1F5F6;
  color: #5A6B76;
}

#op-quiz .opq-rec-name {
  margin: 12px 0 9px !important;
  color: #12384F !important;
  font-size: 19px !important;
  line-height: 1.2 !important;
  font-weight: 800 !important;
}

#op-quiz .opq-rec-imgbox {
  display: flex;
  align-items: center;
  justify-content: center;

  aspect-ratio: 4/3;
  width: 100%;
  background: #F6FAFB;
  border-radius: 12px;
  padding: 9px;
  margin-bottom: 13px;
}

#op-quiz .opq-rec-img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}

#op-quiz .opq-rec-reason {
  margin: 0 0 15px !important;
  color: #4D616D !important;
  font-size: 12.5px !important;
  line-height: 1.55 !important;
}

#op-quiz .opq-rec-bottom {
  margin-top: auto;
}

#op-quiz .opq-rec-prices {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 9px;
  margin-bottom: 13px;
}

#op-quiz .opq-price {
  font-weight: 900;
  font-size: 25px;
  color: #12384F;
}

#op-quiz .opq-old {
  color: #89969E;
  text-decoration: line-through;
  font-size: 13px;
}

#op-quiz .opq-buy {
  min-height: 52px !important;
  font-size: 12px !important;
  padding: 10px !important;
}

#op-quiz .opq-rec-status {
  min-height: 0;
  margin: 8px 0 0 !important;
  font-size: 11px !important;
  line-height: 1.45 !important;
  color: #087B81 !important;
}

#op-quiz .opq-rec-status:empty {
  display: none;
}

#op-quiz .opq-rec-status.error {
  color: #B42318 !important;
}

#op-quiz .opq-results-footer {
  display: flex;
  justify-content: center;
  margin-top: 20px;
}

/* ACCESIBILIDAD */

#op-quiz button:focus-visible {
  outline: 3px solid #16B6BE !important;
  outline-offset: 3px !important;
}

/* RESPONSIVE */

@media(max-width:700px) {

  #op-quiz {
    padding: 47px 14px 54px !important;
  }

  #op-quiz .opq-intro {
    margin-bottom: 24px;
  }

  #op-quiz .opq-desc {
    font-size: 13px !important;
  }

  #op-quiz .opq-panel {
    padding: 19px 15px !important;
    border-radius: 17px !important;
  }

  #op-quiz .opq-options.multi {
    grid-template-columns: 1fr;
  }

  #op-quiz .opq-options {
    gap: 9px;
  }

  #op-quiz .opq-option {
    min-height: 53px !important;
    font-size: 13px !important;
  }

  #op-quiz .opq-results-grid {
    grid-template-columns: 1fr;
  }

  #op-quiz .opq-rec {
    padding: 15px;
  }

  #op-quiz .opq-rec-imgbox {
    max-height: 210px;
  }

  #op-quiz .opq-price {
    font-size: 27px;
  }

}

@media(max-width:360px) {

  #op-quiz .opq-panel {
    padding: 16px 12px !important;
  }

  #op-quiz .opq-next {
    font-size: 12px !important;
  }

  #op-quiz .opq-back {
    padding: 10px !important;
  }

}

@media(prefers-reduced-motion:reduce) {

  #op-quiz .opq-option {
    transition: none !important;
  }

}
/* ==== assets/css/16-testimonios.css ==== */
/* Organic Pet · Testimonios en video (op-reviews-video) — CSS literal del original.
   Generado por landing/tools/extraer-secciones.py desde landing/qa/referencia/origen/dom-desk.html
   (bloque gp-custom-code data-id="gsOsqbto38"). NO editar a mano: cambiar el script y volver a generar. */
#op-reviews-video, #op-reviews-video * {box-sizing:border-box!important;font-family:"Poppins",Arial,sans-serif!important}
#op-reviews-video {
  --oprv-navy:#12384F;--oprv-teal:#16B6BE;--oprv-lime:#CAF56B;
  width:100%!important;margin:0!important;padding:60px 16px 64px!important;
  background:#F6FAFB!important;color:#12384F!important;overflow:hidden!important;
  scroll-margin-top:80px;
}
#op-reviews-video .oprv-container {width:100%;max-width:1170px;margin:0 auto}
#op-reviews-video .oprv-header {max-width:720px;text-align:center;margin:0 auto 31px}
#op-reviews-video .oprv-kicker {display:inline-flex;align-items:center;justify-content:center;padding:8px 14px;margin:0 0 14px;border:1px solid #B8E4E3;border-radius:30px;background:#E0F4F3;color:#087B81;font-size:11px;font-weight:800;letter-spacing:.7px;text-transform:uppercase}
#op-reviews-video .oprv-title {margin:0!important;color:#12384F!important;font-size:clamp(29px,4vw,43px)!important;font-weight:800!important;line-height:1.13!important;letter-spacing:-.8px!important;text-align:center!important}
#op-reviews-video .oprv-title span {display:block;color:#087B81!important}
#op-reviews-video .oprv-subtitle {margin:13px auto 0!important;max-width:610px;color:#5A6B76!important;font-size:14px!important;line-height:1.6!important;text-align:center!important}

/* Carrusel: tres videos en escritorio, dos en tablet, uno con vista previa del siguiente en móvil */
#op-reviews-video .oprv-track {display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 40px)/3);gap:20px;width:100%;padding:6px 4px 21px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-behavior:smooth;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:none}
#op-reviews-video .oprv-track::-webkit-scrollbar {display:none}
#op-reviews-video .oprv-track.dragging {cursor:grabbing;scroll-snap-type:none;scroll-behavior:auto}
#op-reviews-video .oprv-card {min-width:0;scroll-snap-align:start}
#op-reviews-video .oprv-media {position:relative;aspect-ratio:9/16;width:100%;overflow:hidden;background:linear-gradient(150deg,#DCEFF0,#B8D9E0);border:3px solid #16B6BE;border-radius:21px;box-shadow:0 9px 26px rgba(18,56,79,.12)}
#op-reviews-video .oprv-video {position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1;opacity:0;pointer-events:none;background:#DCEFF0;transition:opacity .2s ease}
#op-reviews-video .oprv-card.ready .oprv-video,#op-reviews-video .oprv-card.playing .oprv-video {opacity:1}
#op-reviews-video .oprv-card.playing .oprv-video {pointer-events:auto}
#op-reviews-video .oprv-poster {position:absolute;inset:0;z-index:1;width:100%;height:100%;object-fit:cover;transition:opacity .2s ease}
#op-reviews-video .oprv-card.ready .oprv-poster,#op-reviews-video .oprv-card.playing .oprv-poster {opacity:0;pointer-events:none}
#op-reviews-video .oprv-placeholder {position:absolute;inset:0;z-index:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:26px;text-align:center;color:#406879;font-size:12px;font-weight:700;line-height:1.5;background:linear-gradient(155deg,#E0F4F3,#C5E4E7)}
#op-reviews-video .oprv-placeholder svg {width:42px;height:42px;stroke:#087B81;fill:none}
#op-reviews-video .oprv-card.empty .oprv-placeholder {z-index:2}
#op-reviews-video .oprv-card.empty .oprv-media {border-style:dashed;border-color:#B8D9DB;box-shadow:none}
#op-reviews-video .oprv-badge {position:absolute;top:13px;left:13px;z-index:3;padding:7px 11px;border-radius:30px;background:rgba(255,255,255,.94);color:#12384F;font-size:10px;font-weight:800;letter-spacing:.3px;pointer-events:none}
#op-reviews-video .oprv-play {position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:4;display:grid!important;place-items:center!important;width:66px!important;height:66px!important;margin:0!important;padding:0!important;border:3px solid #FFFFFF!important;border-radius:50%!important;background:#CAF56B!important;color:#193341!important;box-shadow:0 7px 24px rgba(18,56,79,.22);cursor:pointer!important;transition:transform .18s ease}
#op-reviews-video .oprv-play:hover {transform:translate(-50%,-50%) scale(1.07)}
#op-reviews-video .oprv-play svg {width:27px;height:27px;margin-left:3px;fill:currentColor}
#op-reviews-video .oprv-info {position:absolute;inset:auto 0 0;z-index:3;padding:70px 16px 18px;background:linear-gradient(0deg,rgba(13,43,62,.93),rgba(13,43,62,0));color:#FFFFFF;pointer-events:none}
#op-reviews-video .oprv-name {display:block;margin:0!important;color:#FFFFFF!important;font-size:16px!important;font-weight:800!important;line-height:1.25!important}
#op-reviews-video .oprv-detail {display:block;margin:4px 0 0!important;color:#D7E9EF!important;font-size:12px!important;font-weight:500!important;line-height:1.4!important}
#op-reviews-video .oprv-card.playing .oprv-play,#op-reviews-video .oprv-card.playing .oprv-info,#op-reviews-video .oprv-card.playing .oprv-badge {opacity:0;visibility:hidden;pointer-events:none}
#op-reviews-video .oprv-card.error .oprv-placeholder {z-index:2}
#op-reviews-video .oprv-card.error .oprv-play {display:none!important}

/* Controles */
#op-reviews-video .oprv-navigation {display:flex;justify-content:center;align-items:center;gap:12px;margin-top:9px}
#op-reviews-video .oprv-arrow {display:grid!important;place-items:center!important;width:45px!important;height:45px!important;padding:0!important;margin:0!important;background:#FFFFFF!important;border:1.5px solid #CDE3E6!important;border-radius:50%!important;color:#12384F!important;cursor:pointer!important;box-shadow:0 3px 10px rgba(18,56,79,.06)}
#op-reviews-video .oprv-arrow svg {width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
#op-reviews-video .oprv-arrow:disabled {opacity:.35!important;cursor:default!important}
#op-reviews-video .oprv-swipe {margin:13px 0 0!important;text-align:center!important;color:#5A6B76!important;font-size:11px!important;font-weight:600!important}

/* CTA de vuelta a la sección de productos */
#op-reviews-video .oprv-bottom {max-width:455px;margin:29px auto 0;text-align:center}
#op-reviews-video .oprv-cta {display:flex!important;align-items:center!important;justify-content:center!important;min-height:57px!important;width:100%!important;padding:14px 18px!important;border:0!important;border-radius:13px!important;background:#CAF56B!important;color:#193341!important;text-decoration:none!important;text-align:center!important;font-size:14px!important;font-weight:800!important;line-height:1.3!important;box-shadow:0 5px 16px rgba(18,56,79,.1);transition:background .18s ease}
#op-reviews-video .oprv-cta:hover {background:#D9FF88!important}
#op-reviews-video .oprv-trust {margin:13px 0 0!important;color:#5A6B76!important;text-align:center!important;font-size:12px!important;line-height:1.45!important}
#op-reviews-video button:focus-visible,#op-reviews-video a:focus-visible,#op-reviews-video .oprv-track:focus-visible {outline:3px solid #16B6BE!important;outline-offset:3px!important}
@media(max-width:950px){#op-reviews-video .oprv-track{grid-auto-columns:46%;gap:16px}}
@media(max-width:600px){
  #op-reviews-video{padding:47px 14px 54px!important}
  #op-reviews-video .oprv-header{margin-bottom:23px}
  #op-reviews-video .oprv-track{grid-auto-columns:79%;gap:12px;padding:4px 14px 20px 2px;width:calc(100% + 14px)}
  #op-reviews-video .oprv-media{border-radius:19px}
  #op-reviews-video .oprv-subtitle{font-size:13px!important}
  #op-reviews-video .oprv-play{width:62px!important;height:62px!important}
  #op-reviews-video .oprv-bottom{margin-top:25px}
}
@media(prefers-reduced-motion:reduce){#op-reviews-video .oprv-track{scroll-behavior:auto}#op-reviews-video .oprv-play,#op-reviews-video .oprv-video,#op-reviews-video .oprv-poster,#op-reviews-video .oprv-cta{transition:none}}
/* ==== assets/css/17-garantia.css ==== */
/* Organic Pet · Garantía 30 días (op-garantia) — CSS literal del original.
   Generado por landing/tools/extraer-secciones.py desde landing/qa/referencia/origen/dom-desk.html
   (bloque gp-custom-code data-id="g9Sxr1nqR6"). NO editar a mano: cambiar el script y volver a generar. */
/* ==========================================
   AISLAMIENTO
   ========================================== */

#op-garantia,
#op-garantia * {
  box-sizing: border-box !important;
}

#op-garantia {
  --opg-navy: #12384F;
  --opg-dark: #0D2B3E;
  --opg-teal: #16B6BE;
  --opg-lime: #CAF56B;
  --opg-aqua: #E0F4F3;

  position: relative !important;

  width: 100% !important;
  margin: 0 !important;

  padding: 75px 20px !important;

  background:
    linear-gradient(
      145deg,
      #12384F 0%,
      #0D2B3E 100%
    ) !important;

  color: #FFFFFF !important;

  font-family:
    "Poppins",
    Arial,
    sans-serif !important;

  overflow: hidden !important;
}

/* ==========================================
   CONTENEDOR
   ========================================== */

#op-garantia .opg-container {
  position: relative;
  z-index: 1;

  display: grid;

  grid-template-columns:
    minmax(0, 1.4fr)
    minmax(0, .8fr);

  align-items: center;
  gap: 55px;

  width: 100%;
  max-width: 1140px;

  margin: 0 auto;
}

/* ==========================================
   COLUMNA DE TEXTO
   ========================================== */

#op-garantia .opg-copy {
  min-width: 0;
}

/* ETIQUETA SUPERIOR */

#op-garantia .opg-kicker {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  gap: 8px !important;

  margin: 0 0 22px !important;
  padding: 9px 14px !important;

  background:
    rgba(22, 182, 190, .14) !important;

  border:
    1px solid
    rgba(22, 182, 190, .45) !important;

  border-radius: 999px !important;

  color: #CAF56B !important;

  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: .8px !important;
  line-height: 1.25 !important;
}

#op-garantia .opg-kicker svg {
  width: 18px;
  height: 18px;

  flex: none;

  stroke: #CAF56B;
  fill: none;
}

/* ==========================================
   TÍTULO PRINCIPAL
   ========================================== */

#op-garantia .opg-title {
  max-width: 690px;

  margin: 0 0 19px !important;
  padding: 0 !important;

  color: #FFFFFF !important;

  font-size:
    clamp(31px, 4.4vw, 51px) !important;

  font-weight: 800 !important;
  line-height: 1.13 !important;

  letter-spacing: -1.3px !important;
  text-align: left !important;
}

/* SEGUNDA PARTE DEL TÍTULO */

#op-garantia .opg-title span {
  display: block;

  margin-top: 5px;

  color: #CAF56B !important;
}

/* ==========================================
   DESCRIPCIÓN
   ========================================== */

#op-garantia .opg-description {
  max-width: 610px;

  margin: 0 0 25px !important;

  color: #E0F4F3 !important;

  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 1.7 !important;

  text-align: left !important;
}

/* ==========================================
   KITS CUBIERTOS
   ========================================== */

#op-garantia .opg-applies-title {
  margin: 0 0 12px !important;

  color: #FFFFFF !important;

  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
}

#op-garantia .opg-kits {
  display: flex;
  flex-wrap: wrap;

  gap: 9px;

  margin-bottom: 27px;
}

#op-garantia .opg-kit {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  gap: 7px;

  padding: 9px 12px;

  background:
    rgba(255,255,255,.08);

  border:
    1px solid
    rgba(255,255,255,.19);

  border-radius: 999px;

  color: #FFFFFF !important;

  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;

  white-space: normal;
}

#op-garantia .opg-kit svg {
  width: 15px;
  height: 15px;

  flex: none;

  stroke: #CAF56B;
  fill: none;
}

/* ==========================================
   BOTÓN CTA
   ========================================== */

#op-garantia .opg-cta {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  gap: 11px !important;

  min-height: 59px !important;

  margin: 0 !important;
  padding: 15px 25px !important;

  background: #CAF56B !important;

  border:
    2px solid #CAF56B !important;

  border-radius: 13px !important;

  color: #193341 !important;

  font-family:
    "Poppins",
    Arial,
    sans-serif !important;

  font-size: 14px !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;

  text-align: center !important;
  text-decoration: none !important;

  cursor: pointer !important;

  box-shadow:
    0 7px 20px rgba(0,0,0,.13);

  transition:
    background .2s ease,
    transform .2s ease;
}

#op-garantia .opg-cta:hover {
  background: #D9FF88 !important;
  border-color: #D9FF88 !important;

  transform: translateY(-2px);
}

#op-garantia .opg-cta svg {
  width: 20px;
  height: 20px;

  flex: none;

  stroke: #193341;
  fill: none;
}

/* ==========================================
   COLUMNA VISUAL
   VISIBLE EN ESCRITORIO Y TABLET
   ========================================== */

#op-garantia .opg-visual {
  display: flex;
  justify-content: center;
  align-items: center;

  min-width: 0;
}

/* MARCO DEL SELLO */

#op-garantia .opg-seal {
  position: relative;

  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;

  width: 100%;
  max-width: 330px;

  aspect-ratio: 1 / 1;

  padding: 30px;

  background:
    radial-gradient(
      circle at center,
      rgba(22,182,190,.12),
      rgba(22,182,190,.03) 72%
    );

  border:
    2px solid
    rgba(202,245,107,.66);

  border-radius: 50%;

  box-shadow:
    0 0 0 12px
      rgba(202,245,107,.055),
    0 16px 40px
      rgba(0,0,0,.12);

  text-align: center;
}

/* ÍCONO ESCUDO */

#op-garantia .opg-seal-icon {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 43px;
  height: 43px;

  margin-bottom: 8px;
}

#op-garantia .opg-seal-icon svg {
  width: 39px;
  height: 39px;

  stroke: #CAF56B;
  fill: none;
}

/* NÚMERO 30 */

#op-garantia .opg-seal-number {
  display: block;

  margin: 0 !important;

  color: #CAF56B !important;

  font-size:
    clamp(86px, 10vw, 122px) !important;

  font-weight: 900 !important;

  line-height: .95 !important;
  letter-spacing: -5px !important;
}

/* TEXTO DÍAS */

#op-garantia .opg-seal-days {
  display: block;

  margin-top: 5px;

  color: #FFFFFF !important;

  font-size: 21px !important;
  font-weight: 800 !important;

  letter-spacing: 5px !important;
  line-height: 1.3 !important;
}

/* SEPARADOR DEL SELLO */

#op-garantia .opg-seal-divider {
  width: 64px;
  height: 2px;

  margin: 16px auto;

  background: #16B6BE;

  border-radius: 99px;
}

/* TEXTO INFERIOR DEL SELLO */

#op-garantia .opg-seal-caption {
  max-width: 170px;

  margin: 0 !important;

  color: #E0F4F3 !important;

  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;

  letter-spacing: .4px !important;
  text-align: center !important;
}

/* ==========================================
   RESPONSIVE TABLET
   ========================================== */

@media (min-width: 701px) and (max-width: 950px) {

  #op-garantia .opg-container {
    gap: 28px;

    grid-template-columns:
      minmax(0, 1.3fr)
      minmax(0, .8fr);
  }

  #op-garantia .opg-seal {
    max-width: 265px;
    padding: 22px;
  }

  #op-garantia .opg-seal-number {
    font-size: 95px !important;
  }

  #op-garantia .opg-title {
    font-size:
      clamp(28px, 4vw, 38px) !important;
  }

}

/* ==========================================
   RESPONSIVE MÓVIL
   ========================================== */

@media (max-width: 700px) {

  #op-garantia {
    padding: 49px 17px 57px !important;
  }

  #op-garantia .opg-container {
    grid-template-columns: 1fr;
    gap: 0;
  }

  #op-garantia .opg-copy {
    text-align: center;
  }

  #op-garantia .opg-kicker {
    margin-bottom: 20px !important;
  }

  #op-garantia .opg-title {
    max-width: 520px;

    margin: 0 auto 17px !important;

    font-size:
      clamp(29px, 8vw, 38px) !important;

    letter-spacing: -.9px !important;

    text-align: center !important;
  }

  #op-garantia .opg-description {
    max-width: 520px;

    margin: 0 auto 25px !important;

    font-size: 14px !important;
    line-height: 1.7 !important;

    text-align: center !important;
  }

  #op-garantia .opg-applies-title {
    text-align: center !important;
  }

  #op-garantia .opg-kits {
    justify-content: center;
    gap: 8px;

    margin-bottom: 25px;
  }

  #op-garantia .opg-kit {
    padding: 9px 11px;

    font-size: 10.5px !important;
  }

  #op-garantia .opg-cta {
    width: 100% !important;
    max-width: 420px !important;

    min-height: 59px !important;

    font-size: 14px !important;
  }

  /* ========================================
     CAMBIO SOLICITADO

     OCULTAR COMPLETAMENTE EL SELLO
     CIRCULAR DE 30 DÍAS EN CELULAR.

     NO AFECTA TABLET NI ESCRITORIO.
     ======================================== */

  #op-garantia .opg-visual {
    display: none !important;
  }

}

/* ==========================================
   ACCESIBILIDAD
   ========================================== */

#op-garantia .opg-cta:focus-visible {
  outline: 3px solid #16B6BE !important;
  outline-offset: 4px !important;
}

@media (prefers-reduced-motion: reduce) {

  #op-garantia .opg-cta {
    transition: none !important;
  }

}
/* ==== assets/css/18-faq.css ==== */
/* Organic Pet · preguntas frecuentes, CTA, asesora y botón de WhatsApp (bundle «landing»).
   Dueño: secciones. Reescritos sin GemPages con los valores de dom-desk.html (filas gp-row
   gjDcuibyYQ y glNqt5BWKA) y lo medido en landing/qa/referencia/actual/estilos-*.json.
   Escritorio: fila con 32 px arriba y abajo, contenido de 1200 px centrado; título Poppins 46 px
   (130 %, -1 px, mayúsculas) con <span> de 25 px; preguntas de 72 px (24 px + 24 px de relleno),
   respuesta sans-serif 16 px / 130 % con 50 px a la izquierda; CTA de 44,8 px; chat de 520×620.
   Móvil (≤ 767 px): fondo #F6FAFB, relleno 20 px, título 28 px / 100 %, preguntas 18 px / 100 %
   con 21 px de relleno, respuesta 13 px, CTA de 50 px que «tiembla» (shake, 0,7 s, lineal, en
   bucle) salvo con prefers-reduced-motion.
   Todos los selectores llevan el prefijo .opl-sec--… (0,2,0) para ganar al preflight. */

/* ===================== fila del FAQ ===================== */
.opl-sec--faq .opl-faq {
  display: flex;
  flex-direction: column;
  width: 100%;
  margin: 0;
  padding: 32px 0;
  background-color: transparent;
}

.opl-sec--faq .opl-faq__fila,
.opl-sec--faq .opl-faq__cta-fila {
  display: flex;
  flex-direction: column;
  width: 1200px;
  max-width: 100%;
  margin: 0 auto;
}

@media (max-width: 1024px) {
  .opl-sec--faq .opl-faq__fila,
  .opl-sec--faq .opl-faq__cta-fila { width: 100%; }
}

/* ---------- títulos (PREGUNTAS FRECUENTES / ¿OTRAS DUDAS?) ---------- */
.opl-sec--faq .opl-faq__titulo-caja,
.opl-sec--faq .opl-asesor-titulo-caja {
  display: flex;
  justify-content: flex-start;
  text-align: left;
}

.opl-sec--faq .opl-faq__titulo,
.opl-sec--faq .opl-asesor-titulo {
  width: 100%;
  margin: 0;
  overflow: hidden;
  background-color: transparent;
  color: #121212;
  font-family: 'Poppins', sans-serif;
  font-size: 46px;
  font-weight: 400;
  line-height: 130%;
  letter-spacing: -1px;
  text-transform: uppercase;
  text-align: left;
  text-shadow: none;
  word-break: break-word;
}

.opl-sec--faq .opl-asesor-titulo { text-align: center; }

.opl-sec--faq .opl-faq__titulo strong,
.opl-sec--faq .opl-asesor-titulo strong { font-weight: 700; }

/* ---------- acordeón ---------- */
.opl-sec--faq .opl-faq__acordeon {
  display: flex;
  flex-direction: column;
  width: 100%;
}

.opl-sec--faq .opl-faq__item {
  display: block;
  width: 100%;
  overflow: clip;
  background: transparent;
  border-bottom: 1px solid #16B6BE;
}

.opl-sec--faq .opl-faq__pregunta {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 24px 16px;
  border: 0 none #121212;
  color: #FFFFFF;
  cursor: pointer;
  list-style: none;
}

.opl-sec--faq .opl-faq__pregunta::-webkit-details-marker { display: none; }

/* hueco del icono «colapsar» de GemPages (invisible): mantiene el mismo ancho de texto */
.opl-sec--faq .opl-faq__pregunta::after {
  content: "";
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
}

.opl-sec--faq .opl-faq__icono {
  display: inline-flex;
  flex: 0 0 16px;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  overflow: hidden;
  color: #16B6BE;
}

.opl-sec--faq .opl-faq__icono svg {
  display: block;
  width: 100%;
  height: auto;
}

.opl-sec--faq .opl-faq__item[open] .opl-faq__icono { color: #121212; }

@media (hover: hover) and (pointer: fine) {
  .opl-sec--faq .opl-faq__item:hover .opl-faq__icono { color: #121212; }
}

.opl-sec--faq .opl-faq__pregunta-texto {
  display: block;
  flex: 0 1 auto;
  min-width: 0;
  overflow: hidden;
  color: #000000;
  font-family: 'Poppins', sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
  text-align: left;
  text-shadow: none;
  word-break: break-word;
}

.opl-sec--faq .opl-faq__pregunta-texto strong { font-weight: 700; }

.opl-sec--faq .opl-faq__respuesta {
  padding: 0 16px 24px 50px;
  overflow: hidden;
  color: #242424;
  font-family: sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 130%;
  letter-spacing: normal;
  text-align: left;
  word-break: break-word;
}

.opl-sec--faq .opl-faq__respuesta strong { font-weight: 700; }

/* ---------- CTA ¡QUIERO ALIVIAR SU PIEL! ---------- */
.opl-sec--faq .opl-faq__cta-caja {
  margin: 32px 0;
  text-align: center;
}

.opl-sec--faq .opl-faq__cta {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 100%;
  height: auto;
  padding: 8px 24px;
  border-radius: 10px;
  box-shadow: 2.4492935982947064e-16px 4px 12px 0px rgba(21, 21, 21, 0.66);
  background: #CAF56B;
  color: #173044;
  font-family: 'Poppins', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 180%;
  text-align: center;
  text-decoration: none;
  transition: color .2s cubic-bezier(.4, 0, .2, 1), background-color .2s cubic-bezier(.4, 0, .2, 1), border-color .2s cubic-bezier(.4, 0, .2, 1);
}

.opl-sec--faq .opl-faq__cta:hover { background: #4d4d4d; }

.opl-sec--faq .opl-faq__cta-texto {
  position: relative;
  display: flex;
  height: 100%;
  align-items: center;
  overflow: hidden;
  overflow-wrap: break-word;
  word-break: break-word;
}

.opl-sec--faq .opl-faq__cta-linea { display: block; white-space: pre-line; }

.opl-sec--faq .opl-faq__cta-texto strong { font-weight: 700; }

/* Animación «shake» del original (gp-animation, solo móvil, al aparecer, en bucle, 0,7 s lineal).
   El script de GemPages no se puede descargar (dominio fuera de la lista permitida): los
   fotogramas son una aproximación documentada en DESVIACIONES.md. */
@keyframes opl-shake {
  0%, 100% { transform: translateX(0); }
  20%, 60% { transform: translateX(-4px); }
  40%, 80% { transform: translateX(4px); }
}

/* ---------- asesora (hueco del chat de Sedda: 520 × 620 px) ---------- */
.opl-sec--faq .opl-asesor {
  width: 100%;
  text-align: left;
}

.opl-sec--faq .opl-asesor__marco {
  display: block;
  width: 100%;
  max-width: 520px;
  height: 620px;
  margin: 0 auto;
}

.opl-sec--faq .opl-asesor iframe {
  display: block;
  width: 100%;
  max-width: 520px;
  height: 620px;
  margin: 0 auto;
  border: 0;
}

/* Tarjeta con el mismo aspecto del widget de Sedda que se veía en el original (sin sombra exterior:
   dentro del iframe original la sombra quedaba recortada por el propio marco de 520 × 620) */
.opl-sec--faq .opl-asesora {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
  border: 1px solid #2e2e2e;
  border-radius: 18px;
  background: #121212;
  color: #f4f4f4;
  font-family: 'Poppins', system-ui, -apple-system, sans-serif;
  letter-spacing: normal;
}

.opl-sec--faq .opl-asesora__cabecera {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid #2e2e2e;
  background: #1a1a1a;
}

.opl-sec--faq .opl-asesora__avatar {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: #ffdc00;
  color: #121212;
  font-size: 18px;
  font-weight: 700;
  line-height: 1;
}

.opl-sec--faq .opl-asesora__quien {
  flex: 1;
  min-width: 0;
}

.opl-sec--faq .opl-asesora__nombre {
  margin: 0;
  overflow: hidden;
  color: #f4f4f4;
  font-family: inherit;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: normal;
}

.opl-sec--faq .opl-asesora__estado {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  color: #9a9a9a;
  font-size: 12px;
  line-height: 1.5;
}

.opl-sec--faq .opl-asesora__punto {
  flex-shrink: 0;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #25d366;
}

.opl-sec--faq .opl-asesora__icono-wa {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border: 1px solid #2e2e2e;
  border-radius: 12px;
  background: #242424;
  color: #25d366;
  transition: color .18s ease, border-color .18s ease;
}

.opl-sec--faq .opl-asesora__icono-wa:hover { color: #4ae387; border-color: #25d366; }

.opl-sec--faq .opl-asesora__icono-wa svg { width: 19px; height: 19px; }

.opl-sec--faq .opl-asesora__conversacion {
  display: flex;
  flex: 1;
  flex-direction: column;
  justify-content: flex-end;
  gap: 8px;
  padding: 18px 14px;
  overflow-y: auto;
}

.opl-sec--faq .opl-asesora__sistema {
  align-self: center;
  max-width: 92%;
  margin: 0 0 auto;
  padding: 8px 14px;
  border-radius: 12px;
  background: rgba(255, 220, 0, .08);
  color: #e8cf5a;
  font-size: 12px;
  line-height: 1.55;
  text-align: center;
}

.opl-sec--faq .opl-asesora__mensaje {
  align-self: flex-start;
  max-width: 85%;
  margin: 0;
  padding: 10px 14px;
  border-radius: 16px;
  border-bottom-left-radius: 4px;
  background: #242424;
  color: #f4f4f4;
  font-size: 14px;
  line-height: 1.55;
}

.opl-sec--faq .opl-asesora__mensaje strong { font-weight: 700; }

.opl-sec--faq .opl-asesora__cta {
  display: flex;
  align-self: center;
  align-items: center;
  gap: 9px;
  min-height: 44px;
  margin-top: 12px;
  padding: 12px 20px;
  border-radius: 999px;
  background: #25d366;
  color: #ffffff;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.3;
  text-decoration: none;
  transition: transform .15s ease, filter .15s ease;
}

.opl-sec--faq .opl-asesora__cta:hover { filter: brightness(1.08); }
.opl-sec--faq .opl-asesora__cta:active { transform: scale(.97); }
.opl-sec--faq .opl-asesora__cta svg { flex-shrink: 0; width: 19px; height: 19px; }

.opl-sec--faq .opl-asesora__pie {
  flex-shrink: 0;
  margin: 0;
  padding: 8px 0 10px;
  background: #1a1a1a;
  border-top: 1px solid #2e2e2e;
  color: #9a9a9a;
  font-size: 11px;
  line-height: 1.4;
  text-align: center;
}

/* ===================== fila de opiniones + WhatsApp ===================== */
.opl-sec--opiniones > .opl-cc {
  padding-top: 32px;
}

.opl-sec--whatsapp .opl-whatsapp {
  display: flex;
  flex-direction: column;
  padding-bottom: 32px;
  background-color: transparent;
}

.opl-sec--whatsapp .opl-whatsapp__caja {
  text-align: center;
}

.opl-sec--whatsapp .opl-whatsapp__boton {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  max-width: 100%;
  height: auto;
  padding: 8px 24px;
  border-radius: 10px;
  background: #4ED633;
  box-shadow: none;
  color: #FFFFFF;
  font-family: sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 180%;
  text-align: center;
  text-decoration: none;
  transition: color .2s cubic-bezier(.4, 0, .2, 1), background-color .2s cubic-bezier(.4, 0, .2, 1), border-color .2s cubic-bezier(.4, 0, .2, 1);
}

.opl-sec--whatsapp .opl-whatsapp__boton:hover { background: #4d4d4d; }

.opl-sec--whatsapp .opl-whatsapp__icono {
  position: relative;
  z-index: 1;
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  margin-right: 8px;
  word-break: break-word;
}

.opl-sec--whatsapp .opl-whatsapp__icono > svg {
  height: 1em !important;
  width: auto !important;
}

.opl-sec--whatsapp .opl-whatsapp__texto {
  position: relative;
  display: flex;
  height: 100%;
  align-items: center;
  overflow: hidden;
  overflow-wrap: break-word;
  word-break: break-word;
}

/* el <p> del original: bloque con la letra de 16 px (14 px en móvil) que contiene el <span> de 21 px;
   esa mezcla de tamaños es la que da los 46,8 px / 43,2 px de alto del botón */
.opl-sec--whatsapp .opl-whatsapp__linea { display: block; white-space: pre-line; }

.opl-sec--whatsapp .opl-whatsapp__texto strong { font-weight: 700; }

.opl-sec--whatsapp .opl-whatsapp__subtitulo {
  width: 100%;
  margin: 0;
  overflow: hidden;
  background-color: transparent;
  color: #121212;
  font-family: sans-serif;
  font-size: 10px;
  font-weight: 700;
  line-height: 180%;
  text-align: center;
  word-break: break-word;
}

/* ===================== móvil (≤ 767 px, como GemPages) ===================== */
@media only screen and (max-width: 767px) {
  .opl-sec--faq .opl-faq {
    padding: 20px 0;
    background-color: #F6FAFB;
  }

  .opl-sec--faq .opl-faq__fila,
  .opl-sec--faq .opl-faq__cta-fila {
    padding-left: 10px;
    padding-right: 10px;
  }

  .opl-sec--faq .opl-faq__titulo-caja { padding: 10px; }

  .opl-sec--faq .opl-faq__titulo,
  .opl-sec--faq .opl-asesor-titulo {
    font-size: 28px;
    line-height: 100%;
    text-align: center;
  }

  .opl-sec--faq .opl-faq__acordeon { margin-bottom: 14px; }

  .opl-sec--faq .opl-faq__pregunta { padding: 21px 14px; }

  .opl-sec--faq .opl-faq__pregunta-texto {
    font-size: 18px;
    line-height: 100%;
  }

  .opl-sec--faq .opl-faq__respuesta {
    padding: 0 14px 21px 44px;
    font-size: 13px;
  }

  .opl-sec--faq .opl-faq__cta-caja { margin-top: 10px; }

  .opl-sec--faq .opl-faq__cta {
    height: 50px;
    font-size: 14px;
  }

  .opl-sec--faq .opl-asesor-titulo-caja { padding: 32px 10px 25px; }

  .opl-sec--faq .opl-asesor {
    padding-left: 15px;
    padding-right: 15px;
  }

  .opl-sec--opiniones > .opl-cc {
    padding-top: 0;
    background-color: #F5F9FA;
  }

  .opl-sec--whatsapp .opl-whatsapp {
    background-color: #F5F9FA;
  }

  .opl-sec--whatsapp .opl-whatsapp__caja { border-radius: 15px; }

  .opl-sec--whatsapp .opl-whatsapp__boton { font-size: 14px; }

  .opl-sec--whatsapp .opl-whatsapp__icono { margin-right: 10px; }

  .opl-sec--whatsapp .opl-whatsapp__subtitulo { font-size: 26px; }
}

@media only screen and (max-width: 767px) and (prefers-reduced-motion: no-preference) {
  .opl-sec--faq .opl-faq__cta {
    animation: opl-shake .7s linear 0s infinite;
  }
}
/* ==== assets/css/19-opiniones.css ==== */
/* Organic Pet · Opiniones de clientes (organic-reviews) — CSS literal del original.
   Generado por landing/tools/extraer-secciones.py desde landing/qa/referencia/origen/dom-desk.html
   (bloque gp-custom-code data-id="gXt4fqGed8"). NO editar a mano: cambiar el script y volver a generar. */
#organic-reviews,#organic-reviews *{box-sizing:border-box!important}
#organic-reviews{
  --navy:#12384F;--teal:#16B6BE;--teal-dark:#087B81;
  --aqua:#E0F4F3;--lime:#CAF56B;--muted:#5A6B76;
  width:100%!important;margin:0!important;padding:68px 20px 75px!important;
  background:#F6FAFB!important;color:#12384F!important;
  font-family:"Poppins",Arial,sans-serif!important;
  overflow-x:clip;scroll-margin-top:85px
}
#organic-reviews .organic-reviews__container{width:min(1120px,100%);margin:0 auto}
#organic-reviews .organic-reviews__header{max-width:760px;margin:0 auto 32px;text-align:center}
#organic-reviews .organic-reviews__eyebrow{
  display:inline-flex;align-items:center;justify-content:center;
  margin-bottom:14px;padding:8px 14px;border:1px solid #B8E4E3;
  border-radius:999px;background:#E0F4F3;color:#087B81;
  font-size:11px;font-weight:800;letter-spacing:.8px;text-transform:uppercase
}
#organic-reviews .organic-reviews__header h2{
  margin:0!important;color:#12384F!important;
  font:800 clamp(29px,4.2vw,44px)/1.13 "Poppins",Arial,sans-serif!important;
  letter-spacing:-.9px!important;text-align:center!important
}
#organic-reviews .organic-reviews__header h2 span{display:block;color:#087B81!important}

/* RESUMEN */
#organic-reviews .organic-reviews__summary{
  display:grid;grid-template-columns:.82fr 1.35fr;gap:28px;align-items:center;
  padding:28px 30px;border:1.5px solid #DCE9EC;border-radius:21px;
  background:#FFFFFF;box-shadow:0 7px 24px rgba(18,56,79,.07)
}
#organic-reviews .organic-reviews__score{text-align:center}
#organic-reviews .organic-reviews__score-label{
  display:block;margin-bottom:5px;color:#087B81;
  font-size:10px;font-weight:800;letter-spacing:.7px;text-transform:uppercase
}
#organic-reviews .organic-reviews__score>strong{
  display:block;margin-top:2px;color:#12384F;
  font-size:clamp(46px,7vw,63px);font-weight:900;line-height:1;letter-spacing:-2px
}
#organic-reviews .organic-reviews__average-stars{
  display:inline-flex;gap:2px;margin:9px 0 7px;font-size:20px;line-height:1
}
#organic-reviews .organic-reviews__summary-star{
  position:relative;display:inline-block;color:#D9E5E7
}
#organic-reviews .organic-reviews__summary-star::after{
  content:"★";position:absolute;inset:0 auto 0 0;
  width:var(--star-fill,0%);overflow:hidden;color:#16B6BE;white-space:nowrap
}
#organic-reviews .organic-reviews__score>span:last-child{
  display:block;color:#5A6B76;font-size:11px;line-height:1.4
}

/* DISTRIBUCIÓN: SOLO PORCENTAJES */
#organic-reviews .organic-reviews__breakdown{display:grid;gap:9px}
#organic-reviews .organic-reviews__bar-row{
  display:grid;grid-template-columns:32px minmax(70px,1fr) 43px;
  gap:10px;align-items:center;color:#5A6B76;font-size:11px;line-height:1
}
#organic-reviews .organic-reviews__bar-rating{
  color:#12384F;font-weight:700;white-space:nowrap
}
#organic-reviews .organic-reviews__bar-rating b{color:#16B6BE;font-weight:900}
#organic-reviews .organic-reviews__bar{
  height:8px;overflow:hidden;border-radius:999px;background:#EAF1F3
}
#organic-reviews .organic-reviews__bar i{
  display:block;height:100%;border-radius:inherit;background:#16B6BE
}
#organic-reviews .organic-reviews__bar-meta{
  color:#5A6B76;font-variant-numeric:tabular-nums;
  text-align:right;white-space:nowrap;font-weight:700
}

/* FILTROS */
#organic-reviews .organic-reviews__toolbar{
  display:flex;align-items:center;justify-content:space-between;
  gap:18px;margin:28px 0 18px
}
#organic-reviews .organic-reviews__filters{
  display:flex;flex-wrap:wrap;gap:8px;min-width:0
}
#organic-reviews .organic-reviews__filters button{
  appearance:none;min-height:40px;padding:9px 14px;margin:0!important;
  border:1.5px solid #CFE3E6!important;border-radius:999px!important;
  background:#FFFFFF!important;color:#12384F!important;
  font:700 11px/1.2 "Poppins",Arial,sans-serif!important;
  white-space:nowrap;cursor:pointer!important
}
#organic-reviews .organic-reviews__filters button:hover{
  border-color:#16B6BE!important;background:#F1FAFA!important
}
#organic-reviews .organic-reviews__filters button.is-active{
  border-color:#12384F!important;background:#12384F!important;color:#FFFFFF!important
}
#organic-reviews .organic-reviews__sort{
  display:flex;flex:0 0 auto;align-items:center;gap:8px;
  color:#5A6B76;font-size:11px;font-weight:700
}
#organic-reviews .organic-reviews__sort select{
  min-height:41px;max-width:195px;padding:0 10px;
  border:1.5px solid #CFE3E6!important;border-radius:11px!important;
  background:#FFFFFF!important;color:#12384F!important;
  font:600 11px "Poppins",Arial,sans-serif!important;cursor:pointer
}

/* TARJETAS */
#organic-reviews .organic-reviews__grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;align-items:start
}
#organic-reviews .organic-review-card{
  display:flex;min-width:0;flex-direction:column;padding:21px;
  border:1.5px solid #DCE9EC!important;border-radius:19px!important;
  background:#FFFFFF!important;box-shadow:0 6px 22px rgba(18,56,79,.06)
}
#organic-reviews .organic-review-card__top{
  display:flex;align-items:center;justify-content:space-between;
  gap:10px;margin-bottom:15px
}
#organic-reviews .organic-review-card__stars{
  display:inline-flex;gap:2px;font-size:17px;line-height:1
}
#organic-reviews .organic-review-card__stars .is-filled{color:#16B6BE}
#organic-reviews .organic-review-card__stars .is-empty{color:#DCE6E8}
#organic-reviews .organic-review-card__topic{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:26px;padding:6px 10px;border-radius:999px;
  background:#E0F4F3;color:#087B81;
  font-size:9px;font-weight:800;line-height:1.2;text-align:center
}
#organic-reviews .organic-review-card__image{
  width:100%;margin:0 0 16px;overflow:hidden;
  border-radius:14px;background:#E0F4F3;aspect-ratio:4/3
}
#organic-reviews .organic-review-card__image img{
  display:block;width:100%;height:100%;object-fit:cover;object-position:center
}
#organic-reviews .organic-review-card__body{
  margin:0!important;color:#4D5E6A!important;
  font:400 13px/1.7 "Poppins",Arial,sans-serif!important;
  white-space:pre-line;overflow-wrap:anywhere
}
#organic-reviews .organic-review-card__footer{
  display:flex;align-items:center;margin-top:19px;
  padding-top:15px;border-top:1px solid #E5EEF0
}
#organic-reviews .organic-review-card__person{
  display:flex;min-width:0;align-items:center;gap:10px
}
#organic-reviews .organic-review-card__avatar{
  display:grid;place-items:center;width:39px;height:39px;flex:0 0 39px;
  border:1px solid #B8E4E3;border-radius:50%;
  background:#E0F4F3;color:#087B81;font-size:11px;font-weight:800
}
#organic-reviews .organic-review-card__person-text{min-width:0}
#organic-reviews .organic-review-card__person strong{
  display:block;overflow:hidden;color:#12384F;
  font-size:12px;font-weight:800;line-height:1.3;
  text-overflow:ellipsis;white-space:nowrap
}
#organic-reviews .organic-review-card__verified{
  display:inline-flex;margin-top:3px;color:#5A6B76;
  font-size:10px;line-height:1.3
}
#organic-reviews .organic-reviews__empty{
  grid-column:1/-1;padding:30px 20px;
  border:1px dashed #CFE3E6;border-radius:16px;
  background:#FFFFFF;color:#5A6B76;font-size:13px;text-align:center
}

/* PAGINACIÓN */
#organic-reviews .organic-reviews__pagination{
  display:flex;align-items:center;justify-content:center;
  gap:15px;margin-top:28px
}
#organic-reviews .organic-reviews__page-arrow{
  display:grid!important;place-items:center!important;
  width:44px!important;height:44px!important;margin:0!important;padding:0!important;
  border:1.5px solid #12384F!important;border-radius:50%!important;
  background:#12384F!important;color:#FFFFFF!important;
  font:700 19px/1 "Poppins",Arial,sans-serif!important;cursor:pointer!important
}
#organic-reviews .organic-reviews__page-arrow:not(:disabled):hover{
  background:#087B81!important;border-color:#087B81!important
}
#organic-reviews .organic-reviews__page-arrow:disabled{
  opacity:.3!important;cursor:not-allowed!important
}
#organic-reviews .organic-reviews__pagination>span{
  min-width:95px;color:#5A6B76;font-size:11px;font-weight:700;text-align:center
}

/* CTA */
#organic-reviews .organic-reviews__cta-box{
  max-width:540px;margin:34px auto 0;text-align:center
}
#organic-reviews .organic-reviews__cta-title{
  margin:0 0 14px!important;color:#12384F!important;
  font:800 clamp(17px,2.8vw,21px)/1.35 "Poppins",Arial,sans-serif!important;
  text-align:center!important
}
#organic-reviews .organic-reviews__cta{
  display:flex!important;align-items:center!important;justify-content:center!important;
  gap:10px!important;width:100%!important;min-height:57px!important;
  margin:0!important;padding:14px 18px!important;
  background:#CAF56B!important;border:2px solid #CAF56B!important;
  border-radius:13px!important;color:#193341!important;text-decoration:none!important;
  font:800 14px/1.3 "Poppins",Arial,sans-serif!important;
  text-align:center!important;box-shadow:0 5px 16px rgba(18,56,79,.1)
}
#organic-reviews .organic-reviews__cta:hover{
  background:#D9FF88!important;border-color:#D9FF88!important
}
#organic-reviews .organic-reviews__cta svg{
  width:19px;height:19px;stroke:currentColor;fill:none;flex:none
}
#organic-reviews button:focus-visible,
#organic-reviews select:focus-visible,
#organic-reviews a:focus-visible{
  outline:3px solid #16B6BE!important;outline-offset:3px!important
}

/* RESPONSIVE */
@media(max-width:760px){
  #organic-reviews{padding:51px 15px 59px!important}
  #organic-reviews .organic-reviews__header{margin-bottom:24px}
  #organic-reviews .organic-reviews__header h2{
    font-size:clamp(29px,8vw,38px)!important;letter-spacing:-.8px!important
  }
  #organic-reviews .organic-reviews__eyebrow{
    margin-bottom:11px;padding:7px 12px;font-size:10px
  }
  #organic-reviews .organic-reviews__summary{
    grid-template-columns:.78fr 1.35fr;gap:14px;padding:20px 14px;border-radius:17px
  }
  #organic-reviews .organic-reviews__score>strong{font-size:47px}
  #organic-reviews .organic-reviews__average-stars{gap:1px;font-size:17px}
  #organic-reviews .organic-reviews__score>span:last-child{font-size:10px}
  #organic-reviews .organic-reviews__bar-row{
    grid-template-columns:28px minmax(40px,1fr) 40px;gap:6px;font-size:10px
  }
  #organic-reviews .organic-reviews__bar{height:7px}
  #organic-reviews .organic-reviews__toolbar{
    align-items:stretch;flex-direction:column;gap:12px;margin:23px 0 16px
  }
  #organic-reviews .organic-reviews__filters{
    flex-wrap:nowrap;width:100%;overflow-x:auto;padding:1px 1px 5px;
    scrollbar-width:none;-webkit-overflow-scrolling:touch
  }
  #organic-reviews .organic-reviews__filters::-webkit-scrollbar{display:none}
  #organic-reviews .organic-reviews__filters button{flex:0 0 auto;min-height:40px}
  #organic-reviews .organic-reviews__sort{justify-content:space-between;width:100%}
  #organic-reviews .organic-reviews__sort select{
    flex:0 1 195px;min-width:0;max-width:195px
  }
  #organic-reviews .organic-reviews__grid{
    grid-template-columns:1fr;gap:14px
  }
  #organic-reviews .organic-review-card{
    padding:18px;border-radius:17px!important
  }
  #organic-reviews .organic-review-card__image{
    margin-bottom:14px;border-radius:12px;aspect-ratio:16/10
  }
  #organic-reviews .organic-review-card__body{
    font-size:13px!important;line-height:1.65!important
  }
  #organic-reviews .organic-reviews__cta-box{margin-top:29px}
  #organic-reviews .organic-reviews__cta{font-size:13px!important}
}
@media(max-width:380px){
  #organic-reviews{padding-inline:12px!important}
  #organic-reviews .organic-reviews__summary{gap:10px;padding-inline:12px}
  #organic-reviews .organic-reviews__score>strong{font-size:43px}
  #organic-reviews .organic-reviews__average-stars{font-size:15px}
  #organic-reviews .organic-reviews__bar-row{
    grid-template-columns:26px minmax(30px,1fr) 38px;gap:4px;font-size:9px
  }
  #organic-reviews .organic-review-card{padding:16px}
}