/* ==========================================================================
   HALITEL — pay.css — sección Formas de pago (logos grandes y completos)
   ========================================================================== */
.payment{ background:rgba(6,9,18,.66); }
.pay-note{ color:var(--muted); max-width:680px; margin-top:14px; font-size:.95rem; line-height:1.6; }

.pay-grid{ display:grid; grid-template-columns:repeat(6,1fr); gap:14px; margin-top:38px; align-items:stretch; }
.pay-tile{ background:var(--card); border:1px solid var(--border); border-radius:14px; padding:12px 10px;
  display:flex; flex-direction:column; align-items:center; gap:11px;
  transition:transform .28s var(--ease-io,ease), border-color .28s, box-shadow .3s; }
.pay-tile:hover{ transform:translateY(-4px); border-color:var(--border-blue); box-shadow:0 16px 36px rgba(22,103,255,.14); }

/* Área blanca del logo: el logo se ve COMPLETO (contain) y grande */
.pay-logo{ width:100%; height:72px; border-radius:10px; background:#ffffff;
  display:flex; align-items:center; justify-content:center; padding:8px 9px; box-sizing:border-box; }
.pay-logo img{ width:100%; height:100%; object-fit:contain; object-position:center; display:block; }
.pay-fallback{ display:none; font-family:var(--font-display); font-weight:700; font-size:1.2rem; color:#0a2e73; }
.pay-logo.noimg{ background:linear-gradient(180deg,#0c1830,#070d1a); border:1px solid var(--border-blue); }
.pay-logo.noimg .pay-fallback{ display:block; color:var(--blue-bright); }

.pay-name{ color:var(--text); font-size:.76rem; font-weight:600; letter-spacing:.01em; text-align:center; }

@media (max-width:1024px){ .pay-grid{ grid-template-columns:repeat(3,1fr); } .pay-logo{ height:80px; } }
@media (max-width:600px){ .pay-grid{ grid-template-columns:repeat(2,1fr); } }