/* ============================================================
   contacto.css — /contacto
   ============================================================
   Cuelga de las variables del tema (--theme-*, --uw-*), así que sigue
   al modo claro/oscuro y a los temas de campaña. Usa también
   mayorista.css (formulario, migas, avisos y preguntas).
   ============================================================ */

.ct-estado{display:inline-flex;align-items:center;gap:.5rem;margin-top:1.1rem;padding:.45rem .95rem;border-radius:999px;font-size:.85rem;font-weight:600;border:1px solid var(--theme-border);background:var(--theme-card);color:var(--theme-text)}
.ct-estado i{width:9px;height:9px;border-radius:50%;background:#94a3b8;flex:none}
.ct-estado.abierto i{background:#22c55e;box-shadow:0 0 0 4px rgba(34,197,94,.18);animation:pulse 2s infinite}
.ct-estado.cerrado i{background:#f59e0b}

/* Los canales: grandes, tocables y con lo que se puede esperar de cada uno */
.ct-canales{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.ct-canal{position:relative;display:flex;flex-direction:column;gap:.35rem;padding:1.5rem;border-radius:18px;background:var(--theme-card);border:1px solid var(--theme-border);color:var(--theme-text);text-decoration:none;transition:transform .2s,border-color .2s,box-shadow .2s}
.ct-canal:hover{transform:translateY(-3px);border-color:var(--uw-green);box-shadow:0 14px 34px var(--uw-green-glow)}
.ct-canal-ico{width:46px;height:46px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:1.35rem;margin-bottom:.5rem;background:rgba(var(--uw-acento-rgb),.12);color:var(--uw-green)}
.ct-canal.wa .ct-canal-ico{background:rgba(37,211,102,.14);color:#25d366}
.ct-canal strong{font-family:var(--uw-font-display);font-size:1.02rem}
.ct-canal span{color:var(--uw-muted);font-size:.88rem;line-height:1.55}
.ct-canal b{color:var(--uw-green);font-size:.95rem;margin-top:.2rem;word-break:break-word}
.ct-canal.wa{border-color:rgba(37,211,102,.45)}
.ct-canal-etq{position:absolute;top:1rem;right:1rem;font-size:.7rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:.25rem .55rem;border-radius:999px;background:#25d366;color:#04210f}

/* Las tiendas, con mapa y cómo llegar */
.ct-tiendas{display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.ct-tienda{background:var(--theme-card);border:1px solid var(--theme-border);border-radius:20px;overflow:hidden;display:flex;flex-direction:column}
.ct-mapa{aspect-ratio:16/10;background:var(--theme-surface);border-bottom:1px solid var(--theme-border)}
.ct-mapa iframe{width:100%;height:100%;border:0;display:block}
.ct-tienda-cuerpo{padding:1.5rem;display:flex;flex-direction:column;gap:.8rem;flex:1}
.ct-tienda h3{margin:0;font-family:var(--uw-font-display);font-size:1.15rem;color:var(--theme-text)}
.ct-tienda address{font-style:normal;color:var(--theme-text);line-height:1.6;font-size:.95rem}
.ct-tienda address small{display:block;color:var(--uw-muted);font-size:.85rem}
.ct-horario{display:flex;gap:.55rem;align-items:flex-start;color:var(--uw-muted);font-size:.9rem;line-height:1.5}
.ct-horario i{color:var(--uw-green);margin-top:.1rem}
.ct-llegar{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:auto;padding-top:.4rem}
.ct-btn{display:inline-flex;align-items:center;gap:.45rem;padding:.6rem 1rem;border-radius:12px;font-size:.88rem;font-weight:600;text-decoration:none;border:1px solid var(--theme-border);color:var(--theme-text);background:var(--theme-surface);transition:border-color .2s,color .2s}
.ct-btn:hover{border-color:var(--uw-green);color:var(--uw-green)}

/* Por qué comprar tranquilo */
.ct-garantias{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.ct-garantia{display:flex;gap:.9rem;align-items:flex-start;padding:1.25rem;border-radius:16px;background:var(--theme-card);border:1px solid var(--theme-border)}
.ct-garantia i{font-size:1.4rem;color:var(--uw-green);flex:none;margin-top:.1rem}
.ct-garantia strong{display:block;font-family:var(--uw-font-display);color:var(--theme-text);font-size:.95rem;margin-bottom:.2rem}
.ct-garantia span{color:var(--uw-muted);font-size:.86rem;line-height:1.55}

/* La ficha de la empresa */
.ct-empresa{display:grid;gap:0;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));background:var(--theme-card);border:1px solid var(--theme-border);border-radius:18px;overflow:hidden}
.ct-empresa div{padding:1.1rem 1.35rem;border-right:1px solid var(--theme-border);border-bottom:1px solid var(--theme-border)}
.ct-empresa dt{font-size:.72rem;letter-spacing:.09em;text-transform:uppercase;color:var(--uw-muted);font-weight:700;margin-bottom:.3rem}
.ct-empresa dd{margin:0;color:var(--theme-text);font-size:.95rem;line-height:1.5}
.ct-empresa a{color:var(--uw-green);text-decoration:none}
.ct-redes{display:flex;gap:.6rem;flex-wrap:wrap}
.ct-redes a{display:inline-flex;align-items:center;gap:.35rem}

@media (max-width:640px){
  .ct-canal,.ct-tienda-cuerpo{padding:1.25rem}
  .ct-llegar .ct-btn{flex:1;justify-content:center}
}