/* === RDN Scope Alias Patch (aplica estilos a #rdn-mobile-home y #rdn-mobile) === */
@media (max-width: 991px){
  :is(#rdn-mobile-home, #rdn-mobile),
  :is(#rdn-mobile-home, #rdn-mobile) *{ box-sizing: border-box; }
  :is(#rdn-mobile-home, #rdn-mobile){ max-width:480px; margin:0 auto; padding:16px 14px 40px; }
}
/* === fin patch === */
/* ============================================================
   RDN Mobile — styles.css
   ============================================================ */

/* ===== Base ===== */
:root{
  --opiniones:#F2C94C;
  --violet:#9C27B0;
  --ink:#1e293b;
  --muted:#64748b;
  --bg:#f2f7fc;
  --brand:#03A9F4;
  --orange:#FF9800;
  --green:#4CAF50;
  --red:#ED5B55;
  --wa:#25D366;
  --radius:18px;
  --b4:4px;
  --shadow:0 12px 30px rgba(0,0,0,.12);
  --shadow-sm:0 10px 26px rgba(0,0,0,.10);
  --why-green:#2E7D32; /* Defino el verde aquí para reusarlo */
  
  /* Colores CTA (de tu CSS) */
  --rdn-red: #ED5B55; /* Asumo este valor */
  --rdn-red-dark: #d32f2f; /* Asumo este valor */
  --rdn-wa: #25D366;
  --rdn-wa-dark: #1da851; /* Asumo este valor */
  
  /* --- Colores WhatsApp (AÑADIDOS) --- */
  --wa-green: #dcf8c6;
  --wa-send-btn: #00a884;
  --wa-bg: #e5ddd5; 
}

:is(#rdn-mobile-home, #rdn-mobile), :is(#rdn-mobile-home, #rdn-mobile) *{ box-sizing:border-box; }
body{ margin:0; background:var(--bg); font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial; color:var(--ink); }
:is(#rdn-mobile-home, #rdn-mobile){ max-width:480px; margin:0 auto; padding:16px 14px 40px; }

/* ===== Utilidades ===== */
.section-title{ font-size:22px; margin:28px 0 8px; letter-spacing:-.01em }
.hint{ margin:6px 0 14px; color:#000; font-size:13px; text-align:center }
.helper{ margin:8px 0 14px; text-align:center; color:#000; font-size:12.25px }
.frame-title{ font-weight:800; margin:0 0 8px; }
.frame-sub{ margin:0 0 14px; color:#64748b; }
.frame-list{ margin:0 0 10px 18px; padding:0; }
/* Ajuste de margen para el subtítulo de Google Maps */
.envio-option .frame-sub {
  margin-bottom: 10px;
}

/* ===== Grid 3x2 (Sección A) ===== */
.grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  grid-auto-rows:128px;
  gap:14px;
}
.card{
  display:grid; place-items:center;
  background:#fff;
  border:var(--b4) solid rgba(0,0,0,.08);
  border-radius:var(--radius);
  box-shadow:0 10px 28px rgba(0,0,0,.12);
  min-height:128px;
  user-select:none; touch-action:manipulation;
  transition:border-color .18s ease, box-shadow .18s ease, transform .06s ease;
  padding:8px;
}
.card:active{ transform:scale(.98) }

/* Sombra dinámica para la grilla */
.card.active{ 
  border-color: var(--card-color, var(--brand)); 
  box-shadow: 0 12px 34px var(--card-shadow, rgba(3,169,244,.18));
}

.card-img{
  width:96px; height:96px; object-fit:contain; display:block;
  filter: drop-shadow(0 7px 12px rgba(0,0,0,.12));
}

/* ============================================================
   CSS DEL PANEL (Cortina + Slide)
   ============================================================ */

.panel-wrapper {
  max-height: 0;
  margin-top: 0;
  transition: max-height 0.4s ease-out, 
              margin-top 0.4s ease-out;
  overflow: hidden; 
}
.panel-wrapper.show {
  max-height: 300px;
  margin-top: 16px;
}
#panel {
background: #fff;
  border: var(--b4) solid var(--card-color, rgba(0,0,0,.08));
  border-radius: var(--radius);
  box-shadow: 0 10px 28px var(--card-shadow, rgba(0,0,0,.12));
  padding: 16px 14px 16px;
  transition: transform 0.5s cubic-bezier(0.65, 0, 0.35, 1);
  transform: translateX(0);
}
#panel.slide-out {
  transform: translateX(-105%);
  transition-duration: 0.4s;
}
#panel.slide-in {
  transform: translateX(105%);
  transition: none;
}
/* Estilos internos del panel (Estos no cambian) */
.panel-head{ display:grid; grid-template-columns:64px 1fr; gap:12px; align-items:center; margin-top:10px; }
.panel-img-wrap{
  width:64px; height:64px; border-radius:14px; background:#f6f8fb;
  display:grid; place-items:center; border:1px solid rgba(0,0,0,.06);
  box-shadow: inset 0 1px 2px rgba(0,0,0,.04);
}
.panel-img{ width:52px; height:52px; object-fit:contain; display:block }
.panel .ttl{ font-weight:800; text-transform:uppercase; letter-spacing:.02em; font-size:14px; margin:0 0 6px }
.panel .desc{ color:#64748b; font-size:13.5px; line-height:1.45 }
.panel .cta{ margin-top:18px }
.panel .cta a{
  display:inline-flex; align-items:center; gap:.55em;
  font-weight:800; font-size:14px; color:inherit; text-decoration:none;
  border:2px solid currentColor; border-radius:999px;
  padding:.45em .85em; background:#fff;
  box-shadow: 0 4px 12px rgba(0,0,0,.10);
  transition: transform .06s ease, box-shadow .18s ease;
  /* El botón "Ver detalle" ahora es un trigger, no un link */
  cursor: pointer; 
}
.panel .cta a svg{ width:16px; height:16px; transition: transform .18s ease }
.panel .cta a:active{ transform: translateY(1px); box-shadow: 0 2px 8px rgba(0,0,0,.12) }
.panel .cta a:active svg{ transform: translateX(3px) }

/* Carrusel de píldoras (Sección B) */
.carousel{ position:relative; height:80px; margin:2px 0 6px; touch-action:pan-x; user-select:none; overflow:hidden; }
.pill{
  position:absolute; top:0; left:50%;
  width:74%; max-width:380px; height:80px; transform:translateX(-50%);
  background:#fff; border:var(--b4) solid rgba(0,0,0,.08); border-radius:var(--radius);
  display:grid; grid-template-columns:26px 1fr; gap:10px; align-items:center; padding:8px 12px;
  will-change:transform, opacity, border-color; transition: transform .20s cubic-bezier(.2,.7,.2,1), opacity .20s ease, border-color .18s ease;
}
/* Centra el subtítulo SOLO en el carrusel de píldoras */
.pill .sub {
  text-align: center !important;
}
.ico{ width:26px; height:26px; border-radius:8px; background:#eef6ff; display:grid; place-items:center }
.ttl{ font-weight:900; font-size:15.5px; text-transform:uppercase; letter-spacing:.01em }
.sub{ color:#6b7280; font-size:12.75px; margin-top:1px; line-height:1.34 }
.pill.current{ z-index:3; transform:translateX(-50%) scale(1) translateY(0); border-color:var(--brand) }
.pill.left { z-index:2; transform:translateX(calc(-50% - 50%)) scale(.8) translateY(3px) }
.pill.right{ z-index:2; transform:translateX(calc(-50% + 50%)) scale(.8) translateY(3px) }
.pill.hidden-left{  z-index:1; opacity:0; transform:translateX(calc(-50% - 120%)) scale(.78) translateY(8px) }
.pill.hidden-right{ z-index:1; opacity:0; transform:translateX(calc(-50% + 120%)) scale(.78) translateY(8px) }
.dots{ display:flex; gap:8px; justify-content:center; margin-top:2px }
.dot{ width:6px; height:6px; border-radius:999px; background:#c9d2dc; transition:transform .2s ease, background .2s ease }
.dot.active{ background:#111; transform:scale(1.25) }

/* ============================================================
   INICIO: CSS MODIFICADO (Sección B - Trust Grid)
   ============================================================ */
.trust{ margin-top:10px }
.trust-grid{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.trust .card{ 
  cursor:pointer;
  border:var(--b4) solid rgba(0,0,0,.08);
  display: grid;
  place-items: center;
  text-align: center;
  padding: 8px;
  transition: border-color .18s ease, box-shadow .18s ease;
}
.icon-lg{ 
  width:56px; height:56px; border-radius:14px; 
  display:grid; place-items:center; margin-bottom:6px; 
  color:var(--brand);
}
.icon-lg svg{ 
  width:36px; height:36px; display:block; 
  fill:none;
  stroke:currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}
.trust .card h3 {
    font-size: 16px;
    margin: 0 0 6px;
}
.trust .card p {
    font-size: 13.5px;
    color: var(--muted);
    line-height: 1.45;
    margin: 0 0 10px;
    padding: 0 4px;
}
.btn-pill{ 
  display:inline-flex; align-items:center; gap:10px; padding:9px 14px; 
  border:2px solid var(--brand); border-radius:999px; 
  background:#fff; color:var(--brand); 
  font-weight:800; font-size:14px; text-decoration:none; 
  transition:background .15s ease, color .15s ease;
  cursor: pointer;
}
.btn-pill svg{ width:16px; height:16px }
/* ============================================================
   FIN: CSS MODIFICADO (Sección B - Trust Grid)
   ============================================================ */

/* ============================================================
   INICIO: CSS NUEVO (Modal "Trust Grid")
   ============================================================ */
.trust-modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
    display: grid;
    place-items: center;
    padding: 14px;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.25s ease, visibility 0.25s ease;
    z-index: 100;
}
.trust-modal-panel {
    background: #fff;
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    padding: 24px 20px 20px;
    width: 100%;
    max-width: 420px;
    position: relative;
    transform: scale(0.95) translateY(10px);
    transition: transform 0.25s ease;
}
.trust-modal-overlay.show {
    opacity: 1;
    visibility: visible;
}
.trust-modal-overlay.show .trust-modal-panel {
    transform: scale(1) translateY(0);
}
.trust-modal-close {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    background: #f1f5f9;
    border: 0;
    border-radius: 999px;
    cursor: pointer;
    color: var(--muted);
}
.trust-modal-close svg {
    width: 20px;
    height: 20px;
    stroke-width: 2.5;
}
.trust-modal-content h3 {
    font-size: 20px;
    margin: 0 0 10px;
    padding-right: 30px; 
    color: var(--ink);
}
.trust-modal-content p {
    font-size: 15px;
    color: var(--muted);
    line-height: 1.5;
    margin: 0;
}
.trust-modal-link-wrap {
    text-align: right;
    margin-top: 16px;
}
.trust-modal-link {
    font-size: 13.5px;
    font-weight: 700;
    color: var(--brand);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    opacity: 0.8;
    transition: opacity 0.15s ease;
}
.trust-modal-link:hover {
    opacity: 1;
}
.trust-modal-link svg {
    width: 14px;
    height: 14px;
    stroke-width: 2.5;
    transition: transform 0.15s ease;
}
.trust-modal-link:hover svg {
    transform: translateX(3px);
}
/* ============================================================
   FIN: CSS NUEVO (Modal "Trust Grid")
   ============================================================ */

/* ============================================================
   INICIO: CSS NUEVO (Bottom Sheet Modal - Sección A)
   ============================================================ */
.action-sheet-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
  /* Detrás de la barra sticky (99999) pero encima del overlay (99997) */
  z-index: 99997;   
}
.action-sheet-panel {
  position: fixed;
  left: 0;
  right: 0;  
  /* Se acopla perfecto a la barra de 64px */
  bottom: 64px;
  background: #fff;
  /* Bordes redondeados solo arriba */
  border-top-left-radius: var(--radius);
  border-top-right-radius: var(--radius);
  box-shadow: 0 -4px 30px rgba(0,0,0,.2);
  /* Padding para el contenido Y para salvar la barra sticky */
  /* 64px de tu barra + 20px de aire = 84px */
  /* Padding-top ajustado (24px - 4px = 20px) */
  padding: 20px 20px 24px; 
  
  /* Oculto por defecto (100% abajo) */
  transform: translateY(100%);
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);

  /* ======================================================= */
  /* ▼▼▼ AÑADÍ ESTA LÍNEA AQUÍ ▼▼▼                          */
  /* ======================================================= */
  border-top: var(--b4, 4px) solid var(--card-color, var(--brand));
  /* ======================================================= */
  
  /* Se ubica entre el overlay y la barra sticky */
  z-index: 99998;
}
.action-sheet-overlay.show {
  opacity: 1;
  visibility: visible;
}
.action-sheet-overlay.show .action-sheet-panel {
  transform: translateY(0); /* Estado visible */
}

/* Botón de cerrar (igual al otro modal) */
.action-sheet-close {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    background: #f1f5f9;
    border: 0;
    border-radius: 999px;
    cursor: pointer;
    color: var(--muted);
}
.action-sheet-close svg {
    width: 20px;
    height: 20px;
    stroke-width: 2.5;
}

/* Contenido del Bottom Sheet */
.action-sheet-content h3 {
  font-size: 22px;
  margin: 0 0 10px;
  padding-right: 30px;
  color: var(--ink);
}
.action-sheet-content p {
  font-size: 15px;
  color: var(--muted);
  line-height: 1.55;
  margin: 0 0 24px;
}
/* El botón "Pro" CTA */
.action-sheet-cta-wrap {
  text-align: center;
}
.action-sheet-cta-wrap .btn-pill {
  /* Hacemos que ocupe más ancho */
  width: 100%;
  max-width: 320px;
  padding-top: 12px;
  padding-bottom: 12px;
  font-size: 16px;
  display: inline-flex;
  justify-content: center;
  /* Hereda los estilos .cta-shadow... */
}
/* ============================================================
   FIN: CSS NUEVO (Bottom Sheet Modal)
   ============================================================ */


/* Cómo funciona (Sección C) */
.cf-wrap{ margin-top:28px }
.cf-title{ font-size:22px; margin:4px 0 6px; letter-spacing:-.01em }
.cf-sub{ margin:0 0 12px; color:#4b5f72; font-size:13.8px; font-weight:600 }
.cf-hint{ margin:6px 0 14px; text-align:center; color:#000; font-size:12.25px }
.cf-rail{
  display:flex; gap:14px; overflow-x:auto; scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch; padding:16px 2px 10px; padding-left:18px; scroll-padding-left:18px;
}
.cf-rail::-webkit-scrollbar{ display:none }
.cf-rail > .cf-stepcard:first-child{ margin-left:4px }
.cf-stepcard{
  position:relative; flex:0 0 86%; max-width:86%;
  background:#fff; border:var(--b4) solid rgba(0,0,0,.08); border-radius:var(--radius);
  scroll-snap-align:center; box-shadow:none;
  transition:transform .22s ease, border-color .18s ease;
}
.cf-stepcard.cf-active{ border-color:var(--orange); transform:scale(1.02) }
.cf-badge{
  position:absolute; top:-12px; right:-12px; width:40px; height:40px;
  display:grid; place-items:center; background:#f57c00; color:#fff; font-weight:900;
  border-radius:999px; box-shadow:0 6px 16px rgba(0,0,0,.18); letter-spacing:.01em;
  border:3px solid #fff; z-index:5;
}
.cf-step-media{ position:relative; height:56vw; max-height:280px; border-radius:12px; margin:10px; overflow:hidden; background:linear-gradient(180deg,#fff5e6,#ffefd6); display:grid; place-items:center; }
.cf-img{ width:auto; height:auto; max-width:354px; max-height:100%; object-fit:contain; display:block; border-radius:12px; }
.cf-step-body{ padding:4px 14px 14px }
.cf-step-body h3{ margin:0 0 4px; font-size:16px; letter-spacing:.005em }
.cf-step-body p{ margin:0; color:#6b7280; font-size:13.25px; line-height:1.45 }
.cf-hint-arrow{
  position:absolute; right:8px; top:50%; transform:translateY(-50%);
  display:flex; align-items:center; gap:6px; padding:6px 10px;
  background:#ffffffd0; border:2px solid var(--orange); color:var(--orange); border-radius:999px;
  font-size:12px; font-weight:800; box-shadow:0 0 0 0 rgba(255,152,0,.45); animation:cf-pulse 1.4s ease-in-out infinite;
}
.cf-hint-arrow svg{ width:14px; height:14px }
@keyframes cf-pulse{ 0%{ box-shadow:0 0 0 0 rgba(255,152,0,.45) } 70%{ box-shadow:0 0 0 10px rgba(255,152,0,0) } 100%{ box-shadow:0 0 0 0 rgba(255,152,0,0) } }
.cf-stepcard:not(.cf-active) .cf-hint-arrow{ display:none }
.cf-dots{ display:flex; gap:8px; justify-content:center; margin-top:8px }
.dot{ width:6px; height:6px; border-radius:999px; background:#c9d2dc; transition:transform .2s ease, background .2s ease }
.dot.cf-on{ background:#111; transform:scale(1.25) }

/* Envío (Sección nueva) */
.envio-wrap{ max-width:480px; margin:20px auto 0; padding:0 0 6px }
.preamble{ margin:0 0 12px; color:#000; font-size:13.5px; }
.envio-options{
  display:grid; grid-template-columns:1fr 1fr;
  grid-template-areas: "main main" "left right";
  gap:14px;
}
.envio-slot-main{ grid-area: main; }
.envio-slot-left{ grid-area: left; }
.envio-slot-right{ grid-area: right; }
.envio-option{
  position:relative; background:#fff; border:var(--b4) solid rgba(0,0,0,.08);
  border-radius:var(--radius); box-shadow:var(--shadow);
  padding:14px; min-height:120px; cursor:pointer;
  transition: transform .08s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}
.envio-option:active{ transform: scale(.99) }
.envio-option[data-type="maps"]{ border-color: var(--red) }
.envio-option[data-type="interior"]{ border-color: var(--brand) }
.envio-option[data-type="caba"]{ border-color: var(--wa) }
.envio-option .icon{
  width:44px; height:44px; border-radius:12px; margin-bottom:8px;
  display:grid; place-items:center; background:#f6f8fb;
  border:1px solid rgba(0,0,0,.06); box-shadow: inset 0 1px 2px rgba(0,0,0,.04);
}
.envio-option h3{ margin:0 0 6px; font-size:16px; font-weight:900 }
.envio-option p{ margin:0; color:var(--muted); font-size:13.5px; line-height:1.45 }
.envio-option .frame{ display:none; margin-top:10px; border:2px dashed rgba(0,0,0,.08); border-radius:14px; padding:12px; background:#ffffffd9; backdrop-filter: blur(6px); }
.envio-option.expanded .frame{ display:block }
.envio-option[data-type="maps"] .frame{ border-color: rgba(237,91,85,.35) }
.envio-option[data-type="interior"] .frame{ border-color: rgba(3,169,244,.35) }
.envio-option[data-type="caba"] .frame{ border-color: rgba(37,211,102,.35) }
.envio-btn{ display:inline-flex; align-items:center; gap:.55em; font-weight:900; font-size:14px; text-decoration:none; border-radius:999px; padding:.58em 1.05em; background:#fff; box-shadow: var(--shadow-sm); }
.envio-btn .arrow{ transition: transform .15s ease }
.envio-btn:hover .arrow{ transform: translateX(3px) }
.envio-btn--red{ border:2px solid var(--red); color:var(--red) }
.envio-btn--blue{ border:2px solid var(--brand); color:var(--brand) }
.envio-btn--wa{ border:2px solid var(--wa); color:var(--wa) }
@keyframes envio-promote { from { transform: scale(.995); opacity:.98; } to { transform: scale(1); opacity:1; } }
.envio-option.promoted{ animation: envio-promote .18s ease-out }
.envio-option.glow[data-type="maps"]{ box-shadow: 0 0 0 6px rgba(237,91,85,.10), var(--shadow-sm); }
.envio-option.glow[data-type="interior"]{ box-shadow: 0 0 0 6px rgba(3,169,244,.12), var(--shadow-sm); }
.envio-option.glow[data-type="caba"]{ box-shadow: 0 0 0 6px rgba(37,211,102,.14), var(--shadow-sm); }
.wa-preview{ background:#eafaf0;border:1px solid rgba(37,211,102,.35);border-radius:16px;padding:10px 12px;margin:6px 0 10px;font-size:14px;color:#114b2d }

/* ===== PLANTILLA — SECCIÓN X ===== */
.sec-x{
  --sec-x-accent: var(--brand);
  margin-top: 28px;
}
.sec-x .sec-x-body{
  background:#fff;
  border: var(--b4) solid rgba(0,0,0,.08);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 14px;
}
.sec-x .item{
  border: var(--b4) solid rgba(0,0,0,.06);
  border-radius: calc(var(--radius) - 4px);
  padding: 10px 12px;
  transition: transform .15s ease, border-color .18s ease;
}
.sec-x .item.active{
  border-color: var(--sec-x-accent);
  transform: scale(1.01);
}


/* ===== SECCIÓN E — Empresas & Seguros (violeta) ===== */
.sec-empresas{ --emp-accent: var(--violet, #9C27B0); margin-top: 28px; }
.sec-empresas .sec-empresas-body{
  background:#fff; border: var(--b4) solid rgba(0,0,0,.08);
  border-radius: var(--radius); box-shadow: var(--shadow); padding: 14px;
}
.emp-grid{
  display:grid; grid-template-columns:1fr 1fr; gap:12px;
}
.emp-item{
  background:#ffffff; border: var(--b4) solid rgba(0,0,0,.06);
  border-radius: calc(var(--radius) - 6px); padding:10px 12px;
  cursor: pointer;
  transition: border-color .18s ease, box-shadow .18s ease;
}
.emp-item.active {
  --card-color: var(--emp-accent);
  --card-shadow: rgba(156, 39, 176, .20);
  border-color: var(--card-color) !important;
  box-shadow: 0 10px 26px var(--card-shadow) !important;
}

.emp-ico{
  width:48px; height:48px; border-radius:14px; display:grid; place-items:center; margin-bottom:6px;
  color: var(--emp-accent); background:#faf5ff; border:1px solid rgba(0,0,0,.06);
}
.emp-ico svg{ width:30px; height:30px }
.emp-title{ margin:0 0 4px; font-size:15px; font-weight:900; letter-spacing:.005em }
.emp-desc{ margin:0; color:#6b7280; font-size:13.25px; line-height:1.45 }
.emp-cta{ display:flex; justify-content:center; margin-top:12px }
.emp-btn{
  border-color: var(--emp-accent) !important; color: var(--emp-accent) !important;
}
.sec-empresas .emp-claim{
  margin: 4px 0 10px;
  color: #111;
  font-weight: 700;
  font-size: 13.75px;
  text-align: center;
}
@media (max-width: 991px){
  .emp-grid{ grid-template-columns: 1fr 1fr; }
}

/* ===== ¿Por qué reparar mi equipo? (Aislado en #rdn-why) ===== */
#rdn-why{
  --panel:#fff;
  --border: rgba(0,0,0,.08);
  --shadow: 0 12px 30px rgba(0,0,0,.12);
  --shadow-sm: 0 10px 26px rgba(0,0,0,.10);
  --radius: 18px;
  --radius-sm: 14px;
}
#rdn-why .why-card{
  background:var(--panel); border:var(--b4) solid var(--border);
  border-radius:var(--radius); box-shadow:var(--shadow); padding:12px; overflow:hidden;
}
#rdn-why .why-hero{
  border-radius: calc(var(--radius) - 6px); overflow:hidden; border:1px solid var(--border);
  background:#eef2f7; aspect-ratio: 16/9;
}
#rdn-why .why-hero img{ 
  width:100%; height:100%; object-fit:cover; display:block;
  transition: opacity 0.2s ease-in-out;
}
#rdn-why .why-acc{ margin-top:10px; border:var(--b4) solid var(--border); border-radius:16px; overflow:hidden }
#rdn-why .acc-item + .acc-item{ border-top:1px solid rgba(0,0,0,.06) }
#rdn-why .acc-btn{
  width:100%; text-align:left; background:#fff; border:0; padding:14px;
  display:flex; align-items:center; gap:12px; font-weight:900; font-size:15px; color:var(--ink);
}
#rdn-why .acc-ico{
  width:38px; height:38px; border-radius:12px; display:grid; place-items:center;
  background:#f6f8fb; border:1px solid rgba(0,0,0,.06);
}
#rdn-why .acc-btn .chev{ margin-left:auto; width:18px; height:18px; transform:rotate(0deg); transition:transform .15s ease }
#rdn-why .acc-item.open .acc-btn .chev{ transform:rotate(90deg) }
#rdn-why .acc-item.open{ border-left: var(--b4) solid var(--brand) }
#rdn-why .acc-panel{ 
  display:none; background:#fff; 
  padding:10px 14px 14px;
}
#rdn-why .acc-item.open .acc-panel{ display:block }
#rdn-why .acc-panel h3{ margin:2px 0 6px; font-size:15.5px }
#rdn-why .acc-panel p{ margin:0 0 8px; color:#475569; font-size:13.5px; line-height:1.55 }
#rdn-why .acc-panel ul{ margin:6px 0 0 18px; color:#475569; font-size:13.25px }
#rdn-why .acc-panel li{ margin:4px 0 }
#rdn-why .why-card{ border-color: var(--why-green) !important; box-shadow: 0 12px 30px rgba(46,125,50,.18); }
#rdn-why .why-acc{ border-color: rgba(46,125,50,.35) !important; }
#rdn-why .acc-item.open{ border-left-color: var(--why-green) !important; }
#rdn-why .acc-ico{ background: rgba(46,125,50,.06); border-color: rgba(46,125,50,.25); }
#rdn-why .why-acc{ border-color: var(--border) !important; }
#rdn-why .acc-ico{ background:#f6f8fb !important; border-color: rgba(0,0,0,.06) !important; }
#rdn-why .why-help{
  margin:10px 2px 2px 2px;
  font-size:15px;
  color:#000; 
  opacity:.92;
}

/* ===== Tipografía unificada: Help texts & Subtítulos ===== */
.hint, .helper, .cf-hint, .why-help, .preamble.hint, .frame-sub{
  text-align:center;
  font-size:13.5px;
  line-height:1.5;
  color:#000;
  opacity:.92;
  margin:6px 0;
}
.sub, .cf-sub{
  text-align:center;
  font-size:15px;
  font-weight:700;
  letter-spacing:-.01em;
  margin:8px 0 6px;
  color:#0f172a;
}
.sub-left{ text-align:left !important; margin-left:4px; }
#rdn-why .sub{ font-size:16px; }
.hint, .helper, .cf-hint, .why-help, .preamble.hint, .frame-sub{
  text-align:center;
  font-size:13.5px;
  line-height:1.5;
  margin:6px 0;
  color:#000;
  opacity:.92;
}
.sub, .cf-sub{
  font-size:15px;
  font-weight:700;
  letter-spacing:-.01em;
  margin:8px 0 6px;
  color:#0f172a;
  text-align:center;
}
.cf-sub.sub-left{ text-align:left; margin-left:4px; }
#rdn-why .sub{ font-size:16px; }
.sub, .cf-sub{
  text-align:left !important;
  font-weight:400 !important;
  font-size:15px !important;
  letter-spacing:-.01em;
  margin:8px 0 6px;
  color:#0f172a;
}
#rdn-why .sub{ font-size:16px !important; }
.hint, .helper, .cf-hint, .why-help, .preamble.hint, .frame-sub{
  text-align:center !important;
  font-size:13.5px;
  line-height:1.5;
  margin:6px 0;
  color:#000;
  opacity:.92;
}

/* === Accent-colored shadows system === */
.sec-empresas{ --emp-accent: var(--violet, #8E24AA); }
.sec-empresas .emp-item{
  box-shadow: var(--shadow-sm, 0 8px 22px rgba(0,0,0,.08));
}
.envio-option{
  transition: box-shadow .2s ease, border-color .2s ease, transform .15s ease;
}
.envio-option.expanded[data-type="maps"]{ box-shadow: 0 12px 30px rgba(237,91,85,.18), var(--shadow-sm); }
.envio-option.expanded[data-type="interior"]{ box-shadow: 0 12px 30px rgba(3,169,244,.18), var(--shadow-sm); }
.envio-option.expanded[data-type="caba"]{ box-shadow: 0 12px 30px rgba(37,211,102,.20), var(--shadow-sm); }
#rdn-why .why-card{
  transition: box-shadow .2s ease, border-color .2s ease;
}
.sec-empresas .sec-empresas-body{
  border-color: var(--emp-accent) !important;
  box-shadow: 0 12px 30px rgba(156,39,176,.20) !important;
}
.sec-empresas .emp-grid .emp-item{
  border-color: rgba(0,0,0,.08) !important;
  box-shadow: var(--shadow-sm, 0 8px 22px rgba(0,0,0,.08)) !important;
}
.sec-x{ --sec-x-accent:#03A9F4; --sec-x-shadow: rgba(3,169,244,.18); }
.sec-x .item.active{
  border-color: var(--sec-x-accent) !important;
  box-shadow: 0 12px 30px var(--sec-x-shadow) !important;
}
.cf-stepcard.cf-active{
  box-shadow: 0 12px 30px rgba(255,152,0,.20);
}
.envio-option[data-type="maps"]{ box-shadow: 0 8px 22px rgba(237,91,85,.10), var(--shadow-sm); }
.envio-option[data-type="interior"]{ box-shadow: 0 8px 22px rgba(3,169,244,.10), var(--shadow-sm); }
.envio-option[data-type="caba"]{ box-shadow: 0 8px 22px rgba(37,211,102,.12), var(--shadow-sm); }
.sec-empresas .emp-grid .emp-item{
  --card-color: var(--emp-accent);
  --card-shadow: rgba(156,39,176,.20);
}
.sec-empresas .emp-grid .emp-item{ 
  box-shadow: none !important;
}

/* === Tus clases CTA para reusar === */
.cta-shadow {
  box-shadow: 0 6px 16px rgba(0,0,0,.12), 0 0 0 2px rgba(229,57,53,.10), 0 0 18px 5px rgba(229,57,53,.32) !important;
  background-color: var(--rdn-red) !important;
  border-color: var(--rdn-red) !important;
  color: #fff !important;
  font-weight: 600 !important;
}
.cta-shadow:hover {
  background-color: var(--rdn-red-dark) !important;
  border-color: var(--rdn-red-dark) !important;
}
.cta-shadow-wa {
  box-shadow: 0 6px 16px rgba(0,0,0,.10), 0 0 0 2px rgba(37,211,102,.10), 0 0 18px 5px rgba(37,211,102,.30) !important;
  background-color: var(--rdn-wa) !important;
  border-color: var(--rdn-wa) !important;
  color: #fff !important;
  font-weight: 600 !important;
}
.cta-shadow-wa:hover {
  background-color: var(--rdn-wa-dark) !important;
  border-color: var(--rdn-wa-dark) !important;
}
/* ================================== */


/* ============================================================
   SECCIÓN #sec-proceso (SWAP)
   ============================================================ */
#sec-proceso {
  box-sizing: border-box;
  padding: 28px 0 22px;
  background: transparent;
}
#sec-proceso * { box-sizing: border-box; }
#sec-proceso .proc-wrap {
  max-width: 452px;
  width: 100%;
  margin: 0 auto;
  padding: 0;
}
#sec-proceso .proc-title {
  color: var(--ink);
  font-weight: 800;
  margin: 0 0 6px;
}
#sec-proceso .proc-sub {
  color: var(--muted);
  margin: 0 0 12px;
}
#sec-proceso .proc-grid {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 12px;
}
#sec-proceso .proc-card {
  width: 100%;
  background: rgba(255, 255, 255, .62);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  border: 2px solid rgba(0, 0, 0, .06);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, border-width .18s ease;
  cursor: pointer;
  overflow: hidden;
}
#sec-proceso .proc-card:hover {
  transform: translateY(-1px);
  border-color: rgba(3, 169, 244, .4);
}
#sec-proceso .proc-card.proc-active {
  order: -1;
  border-color: var(--brand) !important;
  border-width: 4px !important;
  box-shadow: 0 20px 40px rgba(3, 169, 244, .28) !important;
  cursor: default;
}
#sec-proceso .proc-figure,
#sec-proceso .proc-body {
  display: none;
}
#sec-proceso .proc-card.proc-active .proc-figure,
#sec-proceso .proc-card.proc-active .proc-body {
  display: block;
}
#sec-proceso .proc-figure {
  margin: 0 0 12px;
  padding: 13px;
  border-radius: calc(var(--radius) - 2px);
  overflow: hidden;
  background: transparent;
}
#sec-proceso .proc-figure img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: calc(var(--radius) - 11px);
}
#sec-proceso .proc-body {
  padding: 0 16px 16px 16px;
}
#sec-proceso .proc-body p {
  color: var(--ink);
  margin: 0 0 12px;
  line-height: 1.38;
}
#sec-proceso .proc-body strong {
  font-weight: 800;
}
#sec-proceso .proc-small-content {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 16px;
}
#sec-proceso .proc-ico {
  font-size: 1.2rem;
  line-height: 1;
  filter: drop-shadow(0 6px 12px rgba(0, 0, 0, .08));
}
#sec-proceso .proc-h3 {
  margin: 0 0 4px;
  color: var(--ink);
  font-size: 1rem;
}
#sec-proceso .proc-p {
  margin: 0;
  color: var(--muted);
  font-size: .96rem;
  line-height: 1.28;
}
#sec-proceso .proc-card.proc-active .proc-small-content {
  display: none;
}

/* ============================================================
   SECCIÓN #garantia (MODIFICADA CON BOTÓN INTERNO)
   ============================================================ */
#garantia {
  --garantia-green: var(--why-green);
  padding: 28px 0 22px;
}
#garantia .garantia-wrap {
  max-width: 452px;
  width: 100%;
  margin: 0 auto;
  padding: 0;
}
/* La tarjeta ahora es un contenedor simple */
#garantia .garantia-card {
  background: #fff;
  border: 4px solid var(--garantia-green);
  border-radius: var(--radius);
  box-shadow: 0 12px 30px rgba(46,125,50,.18);
  padding: 16px;
  margin-top: 12px;
  /* Ya no es un grid */
}
/* NUEVO: El .garantia-content ahora es el grid */
#garantia .garantia-content {
  display: grid;
  grid-template-columns: 48px 1fr;
  align-items: center;
  gap: 14px;
}
#garantia .garantia-icon {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: rgba(46,125,50,.06);
  border: 1px solid rgba(46,125,50,.25);
}
#garantia .garantia-icon svg {
  width: 30px;
  height: 30px;
}
#garantia .garantia-text h3 {
  margin: 0 0 4px;
  color: var(--ink);
  font-size: 1rem;
  font-weight: 800;
}
#garantia .garantia-text p {
  margin: 0;
  color: var(--muted);
  font-size: .9rem;
  line-height: 1.45;
}
/* El CTA ahora tiene margen arriba para separarse del texto */
#garantia .garantia-cta{ 
  display:flex; 
  justify-content:center; 
  margin-top: 16px; /* <-- Margen interno */
}
#garantia .garantia-btn{
  border-color: var(--garantia-green) !important; 
  color: var(--garantia-green) !important;
}
/* ============================================================
   FIN: SECCIÓN #garantia
   ============================================================ */


/* ============================================================
   SECCIÓN #faq (DISEÑO REFINADO)
   ============================================================ */
#faq {
  padding: 28px 0 22px;
}
#faq .faq-wrap {
  max-width: 452px;
  width: 100%;
  margin: 0 auto;
  padding: 0;
}
#faq .faq-acc {
  background: #fff;
  border: var(--b4, 4px) solid var(--brand, #03A9F4);
  border-radius: var(--radius, 18px);
  box-shadow: 0 12px 30px rgba(3,169,244,.18);
  overflow: hidden;
}
#faq .acc-item + .acc-item {
  border-top: 1px solid rgba(3,169,244,.2);
}
#faq .acc-btn {
  width: 100%;
  text-align: left;
  background: #fff;
  border: 0;
  padding: 16px 14px;
  display: flex;
  align-items: center;
  gap: 12px;
  font-weight: 800;
  font-size: 15px;
  color: var(--brand, #03A9F4);
  transition: background .2s ease, color .2s ease;
}
#faq .acc-btn .chev {
  margin-left: auto;
  width: 18px;
  height: 18px;
  transform: rotate(0deg);
  transition: transform .2s ease, stroke .2s ease;
  stroke: var(--brand);
}
#faq .acc-ico {
  display: none;
}
#faq .acc-item.open .acc-btn {
  background: var(--brand);
  color: #fff;
}
#faq .acc-item.open .acc-btn .chev {
  transform: rotate(90deg);
  stroke: #fff;
}
#faq .acc-panel {
  display: none;
  background: #fff;
  padding: 6px 14px 14px;
  font-size: 14px;
  line-height: 1.5;
  color: var(--muted);
  border-top: 1px solid rgba(3,169,244,.2);
}
#faq .acc-item.open .acc-panel {
  display: block;
}
#faq .faq-cta {
  display: flex;
  justify-content: center;
  margin-top: 16px;
}

/* ============================================================
   FIX IMAGEN "PLANETA"
   ============================================================ */
#rdn-why .why-hero img[src*="rdn-reparar-planeta"] {
  object-position: bottom;
}

/* Estilo para la tarjeta cuando su modal está activo */
.trust .card.active {
  --card-color: var(--brand); /* El azul */
  /* Sombra azul, como la de la grilla de arriba */
  --card-shadow: rgba(3, 169, 244, .18); 
  
  border-color: var(--card-color);
  box-shadow: 0 10px 26px var(--card-shadow);
}

/* Anular sombra del CTA (versión con ID, más fuerte) */
#action-sheet-content .cta-shadow {
  box-shadow: none !important;
}

/* ============================================================
   ESTILOS PARA EL LINK "MÁS INFO" (BOTTOM SHEET)
   ============================================================ */
.action-sheet-info-link-wrap {
  text-align: center;
  margin-top: 16px; /* Espacio para separarlo del botón rojo */
  padding-bottom: 4px; /* Un poco de aire abajo */
}

.action-sheet-info-link {
  color: var(--muted, #64748b);
  font-size: 14px;
  font-weight: 600;
  text-decoration: underline;
  text-decoration-color: rgba(100, 116, 139, 0.4);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  transition: color 0.2s ease;
}

/* Para que se vea 'vivo' al tocarlo */
.action-sheet-info-link:active {
  color: var(--brand, #03A9F4);
  text-decoration-color: var(--brand, #03A9F4);
}



/* ============================================================
   INICIO: ESTILOS AÑADIDOS (SECCIÓN CHAT + ENVÍO)
   ============================================================ */
  
  .chat-window {
    box-sizing: border-box; 
    width: 100%;
    
    background-color: var(--wa-bg);
    background-image: url('https://w0.peakpx.com/wallpaper/744/548/HD-wallpaper-whatsapp-ma-doodle-pattern.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;

    border-radius: var(--radius); 
    box-shadow: var(--shadow-sm); 
    padding: 20px;
    display: flex;
    flex-direction: column;
    overflow: hidden; 
  }

  .chat-message {
    opacity: 0;
    display: flex; 
    box-sizing: border-box;
    margin-top: 12px;
  }
  .chat-message:first-child { 
    margin-top: 0; 
  }
  .chat-message.sent {
    justify-content: flex-end; 
  }
  .bubble {
    box-sizing: border-box;
    padding: 12px 18px;
    border-radius: 20px;
    max-width: 80%; 
    line-height: 1.5;
    font-size: 15px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.08); 
  }
  .bubble p {
    margin: 0;
  }
  .received .bubble {
    background: #fff; 
    color: #333;
    border: none; 
    border-bottom-left-radius: 4px; 
    margin-right: auto; 
  }
  .sent .bubble {
    background: var(--wa-green); 
    color: #111; 
    border: none;
    border-bottom-right-radius: 4px; 
  }
  .typing .bubble {
    padding: 14px 18px;
    display: flex;
  }
  .typing span {
    display: inline-block;
    width: 8px;
    height: 8px;
    background: #ccc;
    border-radius: 50%;
    margin: 0 2px;
    animation: typing-dots 1.2s infinite ease-in-out;
  }
  @keyframes typing-dots {
    0%, 60%, 100% { transform: scale(0.6); opacity: 0.4; }
    30% { transform: scale(1); opacity: 1; }
  }
  .chat-input-bar {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 12px; 
    padding-top: 12px; 
    border-top: none; 
  }
  .fake-input {
    flex: 1; 
    background: #fff; 
    border: none;
    border-radius: 999px; 
    padding: 12px 18px;
    font-size: 15px;
    color: #333; 
    box-shadow: 0 1px 2px rgba(0,0,0,0.05);
  }
  .send-button {
    width: 46px;
    height: 46px;
    flex-shrink: 0; 
    border-radius: 50%;
    background: var(--wa-send-btn); 
    color: #fff;
    display: grid;
    place-items: center;
    cursor: pointer;
    box-shadow: 0 1px 2px rgba(0,0,0,0.08);
  }
  .send-button svg {
    width:22px; 
    height:22px; 
    transform: rotate(0deg) translate(1px, 1px);
  }
  @keyframes send-press {
    0% { transform: scale(1); }
    50% { transform: scale(0.9); }
    100% { transform: scale(1); }
  }
  .send-button.pressing {
    animation: send-press 0.2s ease-out;
  }
  .chat-follow-up {
    margin-top: 20px;
    opacity: 0; 
    transition: opacity 0.5s ease-out;
  }
  .chat-follow-up.is-visible {
    opacity: 1;
  }
  .cta-text { 
    text-align: center;
    font-size: 14px;
    color: var(--ink);
    margin-bottom: 15px;
  }
  .cta-buttons {
    display: flex;
    flex-direction: column; 
    align-items: center; 
    gap: 12px;
  }
  .cta-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 12px 25px; 
    border-radius: 999px; 
    text-decoration: none;
    color: #fff;
    font-weight: 700;
    font-size: 15px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    max-width: 280px; 
    width: 100%; 
    box-sizing: border-box; 
    background-size: 200% auto;
    transition: transform 0.25s ease, 
                box-shadow 0.25s ease;
  }
  .cta-btn svg {
    width: 22px;
    height: 22px;
    fill: currentColor;
  }
  .cta-btn.wa {
    background: var(--wa-send-btn); 
  }
  .cta-btn.wa:hover {
    transform: translateY(-4px); 
    box-shadow: 0 10px 20px rgba(0,0,0,0.15); 
  }

  /* --- Animaciones Controladas por JS --- */
  
  .chat-message.is-visible {
    animation: slideIn 0.5s ease-out forwards;
  }
  @keyframes slideIn {
    from { opacity: 0; transform: translateY(15px); }
    to   { opacity: 1; transform: translateY(0); }
  }
  
  .chat-message.typing.is-visible {
    animation-name: slideInTyping;
    animation-duration: 0.5s;
    animation-timing-function: ease-out;
    animation-fill-mode: forwards;
    overflow: hidden; 
    max-height: 0; 
  }
  @keyframes slideInTyping {
    from { opacity: 0; transform: translateY(15px); max-height: 0;}
    to   { opacity: 1; transform: translateY(0); max-height: 60px;}
  }
  
  .chat-message.typing.is-hiding {
    animation-name: slideOutTyping;
    animation-duration: 0.4s;
    animation-timing-function: ease-in;
    animation-fill-mode: forwards;
    overflow: hidden; 
    max-height: 60px; 
  }
  @keyframes slideOutTyping {
    from { opacity: 1; transform: translateY(0); max-height: 60px; margin-top: 12px;}
    to   { opacity: 0; transform: translateY(10px); max-height: 0; margin-top: 0;}
  }
  
  /* --- ESTILOS PARA LAS SECCIONES EXTRA ("TEPA") --- */
  
  /* Guía de Embalaje */
  .guia-pasos {
    display: flex;
    flex-direction: column;
    gap: 15px;
    margin-top: 10px;
  }
  .paso-item {
    background: #fff;
    border-radius: var(--radius);
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 15px;
    
    border: var(--b4) solid rgba(0,0,0,.08); 
    box-shadow: var(--shadow-sm); 
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
  }
  
  .paso-item.is-active {
    border-color: var(--brand); /* Borde Azul */
    box-shadow: 0 12px 30px rgba(3,169,244,.18), var(--shadow-sm); /* Sombra Azul */
  }
  
  .paso-icono {
    font-size: 24px;
    flex-shrink: 0;
  }
  .paso-texto h3 {
    margin: 0 0 4px 0;
    font-size: 16px;
    color: var(--ink);
  }
  .paso-texto p {
    margin: 0;
    font-size: 14px;
    color: var(--muted);
    line-height: 1.5;
  }
  .etiqueta-helper {
    text-align: center;
    font-size: 13px;
    color: var(--muted);
    margin: 20px 0 6px 0;
  }
  .direccion-box {
    background: #fff;
    border-radius: var(--radius);
    padding: 16px;
    box-shadow: var(--shadow-sm);
    border: 4px dashed var(--wa-send-btn); /* Borde verde 4px Punteado */
    text-align: center;
    margin-top: 15px;
    
    transition: box-shadow 0.3s ease;
  }
  
  .direccion-box.is-active {
    /* Sombra verde (0, 168, 132) */
    box-shadow: 0 12px 30px rgba(0, 168, 132, .18), var(--shadow-sm); 
  }
  
  .direccion-label {
    display: block;
    text-align: left;
    font-weight: 700;
    font-size: 14px;
    color: var(--ink);
    margin-bottom: 8px;
    padding-left: 5px;
  }
  .direccion-box p {
    margin: 0;
    font-size: 15px;
    line-height: 1.5;
  }
  .direccion-box strong {
    font-size: 16px;
    color: var(--ink);
  }

  /* Sección Confianza (¡CON SOMBRA NARANJA!) */
  .confianza-lista {
    list-style-type: none;
    padding-left: 0;
    margin-top: 14px;
    background: #fff;
    border-radius: var(--radius);
    padding: 16px;
    border: var(--b4) solid var(--orange); /* BORDE NARANJA */
    box-shadow: 0 12px 30px rgba(255,152,0,.20); /* SOMBRA NARANJA */
  }
  .confianza-lista li {
    padding-left: 0;
    margin-bottom: 12px;
    font-size: 15px;
    color: var(--muted);
    line-height: 1.5;
  }
  .confianza-lista li:last-child {
    margin-bottom: 0;
  }
  .confianza-lista li strong { 
    color: var(--ink);
    font-weight: 700;
    display: block;
    margin-bottom: 4px;
  }
  
  /* (¡SOLUCIÓN!) Sección FAQ (Acordeón) (¡CON SOMBRA AZUL!) */
  #faq-envio .faq-accordion { /* <-- ID ÚNICO */
    background: #fff;
    border: var(--b4) solid var(--brand); /* BORDE AZUL */
    border-radius: var(--radius);
    box-shadow: 0 12px 30px rgba(3,169,244,.18); /* SOMBRA AZUL */
    overflow: hidden;
  }
  #faq-envio .faq-accordion details { /* <-- ID ÚNICO */
    margin-bottom: 0;
    border: none;
    box-shadow: none;
  }
  #faq-envio .faq-accordion details + details { /* <-- ID ÚNICO */
    border-top: 1px solid rgba(3,169,244,.2); /* Separador Azul */
  }
  #faq-envio .faq-accordion details[open] { /* <-- ID ÚNICO */
    border-color: transparent;
  }
  #faq-envio .faq-accordion summary { /* <-- ID ÚNICO */
    padding: 16px;
    font-weight: 700;
    color: var(--ink);
    cursor: pointer;
    list-style: none;
  }
  #faq-envio .faq-accordion summary::-webkit-details-marker { /* <-- ID ÚNICO */
    display: none;
  }
  #faq-envio .faq-accordion details[open] summary { /* <-- ID ÚNICO */
    color: var(--brand); /* Color Azul */
    border-bottom: 1px solid rgba(3,169,244,.2); /* Separador Azul */
  }
  #faq-envio .faq-accordion .faq-content { /* <-- ID ÚNICO */
    padding: 16px;
    font-size: 14px;
    color: var(--muted);
    line-height: 1.6;
  }
  #faq-envio .faq-accordion .faq-content p { /* <-- ID ÚNICO */
    margin: 0;
  }

/* ============================================================
   FIN: ESTILOS AÑADIDOS
   ============================================================ */

/* Forzar caso normal solo en el widget mobile */
#rdn-mobile h1.section-title,
#rdn-mobile h2.section-title,
#rdn-mobile .section-title{
  text-transform: none !important;
  letter-spacing: normal !important;
  font-variant-caps: normal !important;
}


