/* Veriko landing — Seguridad. Hereda base/shell/.hero/.sec/.caps/.cta de home.css.
   Propio: ritmo compacto, hero/columna estrecha, la franja centrada de "fuente oficial". Tokens-only. */

/* Ritmo vertical compacto (mismo criterio que el resto del slice). */
.security-page .hero{padding:44px 0 40px}
.security-page .sec{padding:40px 0}
@media(min-width:768px){.security-page .hero{padding:56px 0 48px}.security-page .sec{padding:52px 0}}
@media(min-width:1100px){.security-page .hero{padding:64px 0 56px}.security-page .sec{padding:60px 0}}

/* Hero: degradado verde (confirmado), al estilo de las verticales de soluciones —
   tinte suave + glow radial desde la esquina superior izquierda. */
.security-page .hero{position:relative;overflow:hidden;background:radial-gradient(55% 65% at 0% 0%,rgba(21,128,61,.10),transparent 62%),linear-gradient(180deg,var(--color-success-light),var(--color-surface) 74%)}

/* Cuerpo como subtítulo: debajo del título, a la izquierda, ancho legible. */
.sec-lead{margin-top:0;max-width:64ch;color:var(--color-text-secondary);font-size:var(--font-size-lg);line-height:1.6}
/* Subtítulo pegado al título: el sec-head solo necesita su gran margen cuando lo sigue un grid. */
.security-page .sec-head:has(+ .sec-lead){margin-bottom:6px}

/* Sello de la "fuente oficial". */
.sec-badge{display:inline-flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:50%;background:var(--color-primary-light);margin-bottom:16px}
.sec-badge .ic{width:26px;height:26px;color:var(--color-primary)}

/* Hero: checklist de confianza (llena la 2ª columna en desktop). */
.hero-trust{list-style:none;margin:0;padding:24px;display:flex;flex-direction:column;gap:14px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-md);align-self:center}
.hero-trust li{display:flex;align-items:flex-start;gap:11px;color:var(--color-text-primary);font-size:15px;line-height:1.45}
.hero-trust .ic{width:20px;height:20px;flex:none;color:var(--color-success-text);stroke-width:2.5;margin-top:1px}

/* Enlace "Ver estado" bajo disponibilidad. */
.avail-link{margin-top:16px}
.avail-link a{display:inline-flex;align-items:center;gap:6px;font-weight:600;color:var(--color-primary)}
.avail-link .ic{width:15px;height:15px;transition:transform .15s ease}
.avail-link a:hover .ic{transform:translateX(3px)}
@media(prefers-reduced-motion:reduce){.avail-link .ic{transition:none}.avail-link a:hover .ic{transform:none}}
