/* Páginas de guías (SEO): cabecera, datos clave, pasos, preguntas, tabla y llamada a la acción */
.guia{max-width:820px;margin:0 auto;padding:110px 18px 80px;line-height:1.75;font-size:1.04rem}
.guia a{color:#2f8f9d;font-weight:600}
.guia a:hover{color:#dc4f3b}

/* cabecera */
.g-hero{margin:0 -18px 34px;padding:34px 28px 30px;border-radius:24px;background:linear-gradient(135deg,#0f2a30 0%,#1b4d57 55%,#2f8f9d 100%);color:#fff;position:relative;overflow:hidden}
.g-hero::after{content:"";position:absolute;right:-60px;top:-60px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(247,107,87,.45),transparent 70%)}
.g-hero a{color:#bfe7ec}
.g-mig{font-size:.85rem;opacity:.85;margin:0 0 14px}
.g-hero h1{font-size:clamp(1.7rem,4.6vw,2.5rem);line-height:1.18;margin:0 0 12px;color:#fff;position:relative;z-index:1}
.g-hero .meta{font-size:.85rem;opacity:.8;margin:0 0 16px}
.g-hero .lead{font-size:1.1rem;line-height:1.6;margin:0;max-width:640px;color:#e6f4f6;position:relative;z-index:1}

/* datos clave */
.g-datos{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;margin:0 0 34px}
.g-dato{background:#fff;border:1px solid rgba(127,127,127,.22);border-radius:16px;padding:16px 14px;text-align:center;box-shadow:0 6px 18px rgba(22,78,87,.08)}
.g-dato b{display:block;font-family:'Unbounded',system-ui,sans-serif;font-size:1.45rem;line-height:1.1;color:#dc4f3b;margin-bottom:6px}
.g-dato span{font-size:.85rem;color:#4a5d63;line-height:1.35;display:block}

/* títulos de sección */
.guia h2{font-size:clamp(1.35rem,3vw,1.7rem);margin:42px 0 14px;padding-left:14px;border-left:5px solid #f08a3c;line-height:1.25}

/* listas con marca */
.guia ul{list-style:none;padding:0;margin:14px 0}
.guia ul li{position:relative;padding:8px 0 8px 34px}
.guia ul li::before{content:"✓";position:absolute;left:0;top:9px;width:22px;height:22px;border-radius:50%;background:rgba(69,170,184,.18);color:#1f6b76;font-weight:800;font-size:.8rem;display:flex;align-items:center;justify-content:center}

/* pasos numerados */
.guia ol.pasos{counter-reset:p;list-style:none;padding:0;margin:20px 0}
.guia ol.pasos li{counter-increment:p;position:relative;padding:18px 18px 18px 74px;margin:14px 0;border:1px solid rgba(127,127,127,.22);border-radius:18px;background:#fff;box-shadow:0 6px 18px rgba(22,78,87,.07)}
.guia ol.pasos li::before{content:counter(p);position:absolute;left:18px;top:50%;transform:translateY(-50%);width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,#f76b57,#dc4f3b);color:#fff;font-weight:800;font-size:1.1rem;display:flex;align-items:center;justify-content:center;box-shadow:0 6px 14px rgba(220,79,59,.35)}

/* aviso */
.guia .aviso{display:flex;gap:14px;align-items:flex-start;padding:16px 18px;border-radius:16px;background:#fff4e5;border:1px solid #f3c78a;margin:22px 0;color:#5a3a00}
.guia .aviso::before{content:"⚠️";font-size:1.4rem;line-height:1}

/* preguntas frecuentes */
.guia details{border:1px solid rgba(127,127,127,.25);border-radius:16px;margin:12px 0;background:#fff;overflow:hidden}
.guia summary{cursor:pointer;font-weight:700;padding:16px 48px 16px 18px;position:relative;list-style:none;color:#16323a}
.guia summary::-webkit-details-marker{display:none}
.guia summary::after{content:"+";position:absolute;right:18px;top:50%;transform:translateY(-50%);width:28px;height:28px;border-radius:50%;background:rgba(69,170,184,.18);color:#1f6b76;font-size:1.2rem;display:flex;align-items:center;justify-content:center}
.guia details[open] summary::after{content:"–";background:#dc4f3b;color:#fff}
.guia details[open] summary{background:rgba(69,170,184,.08)}
.guia details p{margin:0;padding:6px 18px 18px;color:#33484e}

/* sigue leyendo */
.g-sigue{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin:14px 0 6px}
.g-sigue a{display:block;padding:16px 18px;border:1px solid rgba(127,127,127,.25);border-radius:16px;background:#fff;text-decoration:none;color:#16323a;font-weight:700;line-height:1.35;box-shadow:0 6px 16px rgba(22,78,87,.07);transition:transform .15s,box-shadow .15s}
.g-sigue a:hover{transform:translateY(-3px);box-shadow:0 12px 26px rgba(22,78,87,.16);color:#dc4f3b}
.g-sigue a small{display:block;font-weight:500;color:#4a5d63;margin-top:4px}

/* llamada a la acción */
.guia .cta{margin:40px 0 8px;padding:28px 22px;border-radius:22px;text-align:center;background:linear-gradient(135deg,#f76b57,#dc4f3b);color:#fff;box-shadow:0 14px 34px rgba(220,79,59,.32)}
.guia .cta p{margin:0 0 14px;font-size:1.15rem;font-weight:700;color:#fff}
.guia .cta a.btn{background:#fff;color:#dc4f3b;font-weight:800}
.guia .fuente{font-size:.85rem;color:#4a5d63;margin-top:26px;padding-top:16px;border-top:1px solid rgba(127,127,127,.25)}

/* tabla de puntos */
.tabla-wrap{margin:18px 0 26px;border-radius:18px;overflow:hidden;border:1px solid rgba(127,127,127,.28);box-shadow:0 10px 30px rgba(22,78,87,.10);background:#fff}
.tabla-pts{width:100%;border-collapse:collapse;font-size:1rem}
.tabla-pts thead th{background:linear-gradient(135deg,#2f8f9d,#45aab8);color:#fff;font-size:.8rem;text-transform:uppercase;letter-spacing:.06em;padding:14px 16px;text-align:left}
.tabla-pts thead th:nth-child(2){text-align:right;width:110px}.tabla-pts thead th:nth-child(3){text-align:center;width:110px}
.tabla-pts tbody td{padding:14px 16px;border-bottom:1px solid rgba(127,127,127,.18);color:#16323a}
.tabla-pts tbody tr:nth-child(even){background:rgba(69,170,184,.06)}
.tabla-pts tbody tr:last-child td{border-bottom:0}
.tabla-pts tbody tr:hover{background:rgba(69,170,184,.14)}
.tabla-pts td:nth-child(2){text-align:right;font-weight:600;white-space:nowrap}
.tabla-pts td:nth-child(3){text-align:center}
.tabla-pts .pt{display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:38px;border-radius:50%;font-weight:800;color:#fff}
.tabla-pts .p3{background:#e0a21a}.tabla-pts .p4{background:#f08a3c}.tabla-pts .p6{background:#dc4f3b}
.tabla-pts .grupo td{background:#e8f4f6;color:#1f6b76;font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.07em;padding:9px 16px}
.leyenda{display:flex;gap:14px;flex-wrap:wrap;font-size:.85rem;opacity:.85;margin:-6px 0 14px}
.leyenda span{display:inline-flex;align-items:center;gap:6px}.leyenda i{width:14px;height:14px;border-radius:50%;display:inline-block}

@media (max-width:600px){
  .guia{padding-top:96px;font-size:1rem}
  .g-hero{margin:0 -6px 26px;padding:26px 18px 24px;border-radius:20px}
  .guia ol.pasos li{padding:16px 14px 16px 64px}
  .guia ol.pasos li::before{left:12px;width:38px;height:38px}
  .tabla-pts thead th,.tabla-pts tbody td{padding:11px 10px;font-size:.9rem}
  .tabla-pts thead th:nth-child(2),.tabla-pts thead th:nth-child(3){width:auto}
  .tabla-pts .pt{min-width:32px;height:32px}
}
