/* =========================================================================
   ProfeMax — hoja de estilo del sitio público
   Índigo de la interfaz (#2563eb) para la web; los azules del logotipo
   (#1C75BC/#4FA6DC/#A5D5F2) viven solo dentro del logo, nunca en superficies.
   ========================================================================= */

:root{
  /* Índigo — el mismo de la aplicación */
  --indigo-950:#172554; --indigo-900:#1e3a8a; --indigo-800:#1e40af;
  --indigo-700:#1d4ed8; --indigo-600:#2563eb; --indigo-500:#3b82f6;
  --indigo-100:#dbeafe; --indigo-50:#eff6ff;

  /* Marca (solo el logotipo) */
  --marca-oscuro:#1C75BC; --marca-claro:#4FA6DC; --marca-palido:#A5D5F2;

  /* Neutros */
  --tinta:#0f172a; --texto:#334155; --suave:#64748b; --tenue:#94a3b8;
  --linea:#e2e8f0; --linea-suave:#f1f5f9;
  --fondo:#ffffff; --fondo-alt:#f8fafc;

  /* Acentos de apoyo */
  --verde:#059669; --verde-suave:#ecfdf5;
  --ambar:#d97706; --ambar-suave:#fffbeb;

  --radio:14px; --radio-lg:22px; --radio-xl:30px;
  --sombra-sm:0 1px 2px rgba(15,23,42,.05);
  --sombra:0 4px 16px -4px rgba(15,23,42,.10), 0 2px 6px -2px rgba(15,23,42,.06);
  --sombra-lg:0 24px 50px -12px rgba(15,23,42,.20), 0 8px 20px -8px rgba(15,23,42,.10);
  --sombra-azul:0 20px 45px -12px rgba(37,99,235,.35);

  --ancho:1180px;
  --fuente:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:88px}
body{
  margin:0;font-family:var(--fuente);color:var(--texto);background:var(--fondo);
  font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img,svg,video{max-width:100%;height:auto;display:block}
a{color:var(--indigo-600);text-decoration:none}
a:hover{color:var(--indigo-800)}
h1,h2,h3,h4{color:var(--tinta);line-height:1.15;margin:0 0 .5em;letter-spacing:-.022em;font-weight:800;
  text-wrap:balance} /* evita la línea huérfana de una sola palabra */
h1{font-size:clamp(2.2rem,5.2vw,3.9rem);font-weight:900;letter-spacing:-.035em}
h2{font-size:clamp(1.75rem,3.6vw,2.6rem);letter-spacing:-.03em}
h3{font-size:clamp(1.12rem,1.9vw,1.35rem);font-weight:700}
h4{font-size:1rem;font-weight:700}
p{margin:0 0 1.05em}
ul,ol{margin:0 0 1.05em;padding-left:1.25em}
li{margin-bottom:.4em}
strong{color:var(--tinta);font-weight:650}
:focus-visible{outline:3px solid var(--indigo-500);outline-offset:3px;border-radius:6px}

/* ---------- Estructura ---------- */
.contenedor{width:100%;max-width:var(--ancho);margin-inline:auto;padding-inline:24px}
.contenedor--angosto{max-width:820px}
.seccion{padding:clamp(64px,8vw,110px) 0}
.seccion--compacta{padding:clamp(48px,5vw,72px) 0}
.seccion--alt{background:var(--fondo-alt);border-block:1px solid var(--linea-suave)}
.seccion--oscura{background:var(--indigo-950);color:#cbd5e1}
.seccion--oscura h2,.seccion--oscura h3,.seccion--oscura h4{color:#fff}
.seccion--oscura a{color:#93c5fd}

.encabezado-seccion{max-width:760px;margin:0 auto clamp(40px,5vw,64px);text-align:center}
.encabezado-seccion--izq{margin-inline:0;text-align:left}
.encabezado-seccion p{font-size:1.1rem;color:var(--suave);margin-bottom:0;text-wrap:pretty}
.seccion--oscura .encabezado-seccion p{color:#94a3b8}

.rotulo{
  display:inline-flex;align-items:center;gap:8px;font-size:.76rem;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;color:var(--indigo-600);
  background:var(--indigo-50);border:1px solid var(--indigo-100);
  padding:7px 14px;border-radius:999px;margin-bottom:20px;
}
.seccion--oscura .rotulo{color:#93c5fd;background:rgba(59,130,246,.14);border-color:rgba(147,197,253,.25)}
.rotulo svg{width:14px;height:14px}

/* ---------- Botones ---------- */
.boton{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  font-family:inherit;font-size:1rem;font-weight:650;line-height:1;
  padding:16px 28px;border-radius:12px;border:1px solid transparent;cursor:pointer;
  transition:transform .16s ease,box-shadow .16s ease,background .16s ease,border-color .16s ease;
  text-align:center;white-space:nowrap;
}
.boton svg{width:18px;height:18px;flex-shrink:0}
.boton--primario{background:var(--indigo-600);color:#fff;box-shadow:var(--sombra-azul)}
.boton--primario:hover{background:var(--indigo-700);color:#fff;transform:translateY(-2px);box-shadow:0 24px 50px -12px rgba(37,99,235,.45)}
.boton--claro{background:#fff;color:var(--indigo-800);border-color:var(--linea);box-shadow:var(--sombra-sm)}
.boton--claro:hover{color:var(--indigo-900);border-color:var(--indigo-500);transform:translateY(-2px)}
.boton--contorno{background:transparent;color:#fff;border-color:rgba(255,255,255,.35)}
.boton--contorno:hover{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.6)}
.boton--grande{padding:19px 34px;font-size:1.06rem}
.boton--pequeno{padding:11px 18px;font-size:.9rem}
/* En la barra fija el resplandor del botón se derramaba sobre el fondo claro. */
.nav__acciones .boton--primario{box-shadow:0 6px 16px -6px rgba(37,99,235,.5)}
.boton--bloque{width:100%}
.grupo-botones{display:flex;flex-wrap:wrap;gap:14px}
.grupo-botones--centro{justify-content:center}

/* ---------- Navegación ---------- */
.nav{
  position:sticky;top:0;z-index:60;background:rgba(255,255,255,.86);
  backdrop-filter:saturate(180%) blur(14px);-webkit-backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid transparent;transition:border-color .2s ease,box-shadow .2s ease;
}
.nav.esta-fija{border-bottom-color:var(--linea);box-shadow:0 2px 12px -6px rgba(15,23,42,.12)}
.nav__fila{display:flex;align-items:center;gap:18px;height:76px}
.nav__marca{display:flex;align-items:center;gap:10px;flex-shrink:0}
.nav__marca svg{height:34px;width:auto}
.nav__nombre{font-weight:900;font-size:1.32rem;letter-spacing:-.03em;color:var(--marca-oscuro);line-height:1}
.nav__nombre span{color:var(--marca-claro)}
.nav__enlaces{display:flex;align-items:center;gap:4px;margin-left:auto}
.nav__enlace{
  padding:10px 14px;border-radius:9px;font-size:.955rem;font-weight:550;color:var(--texto);
  transition:background .15s ease,color .15s ease;
}
.nav__enlace:hover{background:var(--indigo-50);color:var(--indigo-700)}
.nav__enlace.activo{color:var(--indigo-700);font-weight:650}
.nav__acciones{display:flex;align-items:center;gap:10px;margin-left:14px}
.nav__hamburguesa{
  display:none;margin-left:auto;width:44px;height:44px;border:1px solid var(--linea);
  border-radius:11px;background:#fff;cursor:pointer;align-items:center;justify-content:center;
}
.nav__hamburguesa svg{width:22px;height:22px;color:var(--tinta)}

@media (max-width:1000px){
  .nav__enlaces,.nav__acciones{
    display:none;position:absolute;top:76px;left:0;right:0;background:#fff;
    border-bottom:1px solid var(--linea);flex-direction:column;align-items:stretch;
    gap:2px;padding:16px 24px;margin:0;box-shadow:var(--sombra);
  }
  .nav__acciones{top:auto;border-bottom:none;padding-top:0;padding-bottom:22px}
  /* Abierto: cada bloque ocupa su propia fila completa. Sin `flex-basis:100%`
     el contenedor flexible los deja a media anchura y los botones salen
     encogidos contra el borde izquierdo. */
  .nav.abierto .nav__enlaces,
  .nav.abierto .nav__acciones{
    display:flex;position:static;box-shadow:none;border:none;
    flex-basis:100%;width:100%;margin-left:0;
  }
  .nav.abierto .nav__enlaces{padding:12px 0 0;gap:2px}
  .nav.abierto .nav__acciones{padding:16px 0 20px;gap:10px}
  .nav.abierto .nav__fila{flex-wrap:wrap;height:auto;padding-bottom:0}
  .nav.abierto .nav__hamburguesa{margin-left:auto}
  .nav__hamburguesa{display:flex}
  .nav__enlace{padding:13px 12px;font-size:1.05rem}
  .nav__acciones .boton{width:100%}
}

/* ---------- Portada ---------- */
.portada{
  position:relative;overflow:hidden;color:#e2e8f0;
  background:linear-gradient(160deg,#172554 0%,#1e3a8a 42%,#1d4ed8 100%);
  padding:clamp(64px,8vw,104px) 0 clamp(80px,9vw,120px);
}
.portada::before{
  content:"";position:absolute;inset:0;opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:52px 52px;
  mask-image:radial-gradient(ellipse 80% 60% at 50% 30%,#000 30%,transparent 78%);
  -webkit-mask-image:radial-gradient(ellipse 80% 60% at 50% 30%,#000 30%,transparent 78%);
}
.portada::after{
  content:"";position:absolute;width:760px;height:760px;border-radius:50%;
  top:-320px;right:-240px;pointer-events:none;
  background:radial-gradient(circle,rgba(79,166,220,.34) 0%,transparent 68%);
}
.portada__interior{position:relative;z-index:1;text-align:center;max-width:1000px;margin-inline:auto}
.portada h1{color:#fff;margin-bottom:.45em}
.portada h1 em{font-style:normal;color:var(--marca-palido)}
.portada__bajada{font-size:clamp(1.06rem,2.1vw,1.28rem);color:#c7d7f5;max-width:660px;margin:0 auto 34px}
.portada .rotulo{color:#bfdbfe;background:rgba(255,255,255,.10);border-color:rgba(191,219,254,.28)}
.portada__nota{margin-top:20px;font-size:.9rem;color:#a5c0e8}
.portada__nota strong{color:#e0ecff}

.portada__lienzo{position:relative;z-index:1;margin-top:clamp(46px,6vw,72px)}

/* Marco tipo navegador para las capturas */
.marco{
  background:#fff;border-radius:var(--radio-lg);overflow:hidden;
  box-shadow:var(--sombra-lg);border:1px solid rgba(255,255,255,.14);
}
.marco__barra{
  display:flex;align-items:center;gap:7px;padding:12px 16px;
  background:#f1f5f9;border-bottom:1px solid var(--linea);
}
.marco__punto{width:11px;height:11px;border-radius:50%;background:#cbd5e1}
.marco__punto:nth-child(1){background:#f87171}
.marco__punto:nth-child(2){background:#fbbf24}
.marco__punto:nth-child(3){background:#4ade80}
.marco__url{
  margin-left:12px;flex:1;background:#fff;border:1px solid var(--linea);border-radius:7px;
  padding:5px 12px;font-size:.76rem;color:var(--tenue);text-align:left;
}
.marco img{width:100%;display:block}
.marco--plano{box-shadow:var(--sombra);border-color:var(--linea)}

/* Marcador para capturas que aún no existen */
.marco__pendiente{
  aspect-ratio:16/8;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:10px;background:repeating-linear-gradient(45deg,#f8fafc,#f8fafc 12px,#f1f5f9 12px,#f1f5f9 24px);
  color:var(--tenue);font-size:.9rem;text-align:center;padding:28px;
}
.marco__pendiente code{background:#fff;border:1px solid var(--linea);border-radius:6px;padding:3px 8px;font-size:.82rem;color:var(--suave)}

/* ---------- Barra de confianza ---------- */
.confianza{padding:26px 0;background:var(--fondo-alt);border-bottom:1px solid var(--linea-suave)}
.confianza__fila{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px 40px}
.confianza__item{display:flex;align-items:center;gap:9px;font-size:.9rem;font-weight:600;color:var(--suave)}
.confianza__item svg{width:19px;height:19px;color:var(--verde);flex-shrink:0}

/* ---------- Rejillas y tarjetas ---------- */
.rejilla{display:grid;gap:22px}
.rejilla--2{grid-template-columns:repeat(2,1fr)}
.rejilla--3{grid-template-columns:repeat(3,1fr)}
.rejilla--4{grid-template-columns:repeat(4,1fr)}
@media (max-width:980px){.rejilla--3,.rejilla--4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.rejilla--2,.rejilla--3,.rejilla--4{grid-template-columns:1fr}}

.tarjeta{
  background:#fff;border:1px solid var(--linea);border-radius:var(--radio-lg);padding:30px;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;height:100%;
}
.tarjeta:hover{transform:translateY(-4px);box-shadow:var(--sombra-lg);border-color:var(--indigo-100)}
.tarjeta h3{margin-bottom:.5em}
.tarjeta p:last-child{margin-bottom:0}
.tarjeta__icono{
  width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(140deg,var(--indigo-600),var(--indigo-800));margin-bottom:20px;
  box-shadow:0 8px 18px -8px rgba(37,99,235,.6);
}
.tarjeta__icono svg{width:25px;height:25px;color:#fff}
.tarjeta--suave{background:var(--fondo-alt);border-color:var(--linea-suave)}
.tarjeta--suave:hover{background:#fff}
.seccion--oscura .tarjeta{background:rgba(255,255,255,.045);border-color:rgba(148,163,184,.18);color:#cbd5e1}
.seccion--oscura .tarjeta:hover{background:rgba(255,255,255,.075);border-color:rgba(147,197,253,.3)}

.lista-visto{list-style:none;padding:0;margin:0}
.lista-visto li{position:relative;padding-left:32px;margin-bottom:12px}
.lista-visto li::before{
  content:"";position:absolute;left:0;top:.42em;width:19px;height:19px;border-radius:50%;
  background:var(--verde-suave) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23059669' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/12px no-repeat;
}
.seccion--oscura .lista-visto li::before{background-color:rgba(5,150,105,.2)}

/* ---------- Bloques alternos (texto + captura) ---------- */
.bloque{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(36px,5vw,72px);align-items:center}
.bloque + .bloque{margin-top:clamp(64px,8vw,110px)}
.bloque--invertido .bloque__texto{order:2}
.bloque--invertido .bloque__medio{order:1}
.bloque__texto h2{font-size:clamp(1.55rem,2.9vw,2.1rem)}
.bloque__texto p{color:var(--suave)}
@media (max-width:900px){
  .bloque{grid-template-columns:1fr;gap:32px}
  .bloque--invertido .bloque__texto,.bloque--invertido .bloque__medio{order:initial}
}

/* ---------- Diagrama de flujo ---------- */
.flujo{display:grid;grid-template-columns:repeat(4,1fr);gap:0;position:relative}
.flujo__paso{position:relative;padding:0 18px;text-align:center}
.flujo__paso::after{
  content:"";position:absolute;top:31px;left:calc(50% + 42px);right:calc(-50% + 42px);
  height:2px;background:linear-gradient(90deg,var(--indigo-100),var(--indigo-500));
}
.flujo__paso:last-child::after{display:none}
.flujo__numero{
  width:64px;height:64px;border-radius:50%;margin:0 auto 20px;display:flex;
  align-items:center;justify-content:center;background:#fff;border:2px solid var(--indigo-600);
  color:var(--indigo-700);font-weight:800;font-size:1.25rem;position:relative;z-index:1;
  box-shadow:0 0 0 8px var(--fondo-alt);
}
.flujo__paso h4{margin-bottom:.4em}
.flujo__paso p{font-size:.94rem;color:var(--suave);margin:0}
@media (max-width:860px){
  .flujo{grid-template-columns:1fr;gap:34px;text-align:left}
  .flujo__paso{display:grid;grid-template-columns:64px 1fr;gap:20px;text-align:left;padding:0}
  .flujo__numero{margin:0;box-shadow:none}
  .flujo__paso::after{top:70px;left:31px;right:auto;bottom:-34px;width:2px;height:auto;
    background:linear-gradient(180deg,var(--indigo-500),var(--indigo-100))}
  .flujo__paso > div{grid-column:2}
}

/* ---------- Precios ---------- */
.precios{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;align-items:stretch}
@media (max-width:1080px){.precios{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.precios{grid-template-columns:1fr}}
.plan{
  background:#fff;border:1px solid var(--linea);border-radius:var(--radio-lg);padding:30px 26px;
  display:flex;flex-direction:column;position:relative;transition:transform .2s ease,box-shadow .2s ease;
}
.plan:hover{transform:translateY(-4px);box-shadow:var(--sombra-lg)}
.plan--destacado{border:2px solid var(--indigo-600);box-shadow:var(--sombra-azul)}
.plan__cinta{
  position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:var(--indigo-600);
  color:#fff;font-size:.72rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;
  padding:6px 15px;border-radius:999px;white-space:nowrap;
}
.plan__nombre{font-size:1.05rem;font-weight:750;color:var(--tinta);margin-bottom:6px}
.plan__para{font-size:.87rem;color:var(--tenue);margin-bottom:20px;min-height:2.6em}
.plan__precio{display:flex;align-items:baseline;gap:5px;margin-bottom:6px}
.plan__cifra{font-size:2.9rem;font-weight:900;color:var(--tinta);letter-spacing:-.04em;line-height:1}
.plan__periodo{font-size:.92rem;color:var(--tenue);font-weight:550}
.plan__moneda{font-size:.8rem;color:var(--tenue);margin-bottom:24px}
.plan ul{list-style:none;padding:0;margin:0 0 26px;flex:1}
.plan li{position:relative;padding-left:27px;margin-bottom:11px;font-size:.94rem}
.plan li::before{
  content:"";position:absolute;left:0;top:.35em;width:17px;height:17px;border-radius:50%;
  background:var(--indigo-50) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/11px no-repeat;
}
.plan li.no{color:var(--tenue)}
.plan li.no::before{
  background:var(--linea-suave) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='3.4' stroke-linecap='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'/%3E%3Cline x1='6' y1='6' x2='18' y2='18'/%3E%3C/svg%3E") center/10px no-repeat;
}

/* ---------- Formularios ---------- */
.formulario{
  background:#fff;border:1px solid var(--linea);border-radius:var(--radio-xl);
  padding:clamp(28px,4vw,44px);box-shadow:var(--sombra);
}
.campos{display:grid;gap:20px}
.campos--2{grid-template-columns:1fr 1fr}
@media (max-width:680px){.campos--2{grid-template-columns:1fr}}
.campo{display:flex;flex-direction:column;gap:7px}
.campo--ancho{grid-column:1/-1}
.campo label{font-size:.9rem;font-weight:650;color:var(--tinta)}
.campo label .req{color:#dc2626}
.campo .ayuda{font-size:.82rem;color:var(--tenue);font-weight:400}
.campo input,.campo select,.campo textarea{
  font-family:inherit;font-size:1rem;color:var(--tinta);background:#fff;
  border:1px solid var(--linea);border-radius:11px;padding:13px 15px;width:100%;
  transition:border-color .15s ease,box-shadow .15s ease;
}
.campo textarea{min-height:140px;resize:vertical;line-height:1.6}
.campo select{appearance:none;cursor:pointer;padding-right:42px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2.4' stroke-linecap='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 15px center;background-size:17px}
.campo input:focus,.campo select:focus,.campo textarea:focus{
  outline:none;border-color:var(--indigo-500);box-shadow:0 0 0 4px rgba(59,130,246,.14);
}
/* Solo se marca en rojo DESPUÉS de que la persona haya interactuado con el
   campo: `:invalid` a secas pinta de rojo un formulario recién abierto. */
.campo input:user-invalid,
.campo select:user-invalid,
.campo textarea:user-invalid{border-color:#f87171;box-shadow:0 0 0 4px rgba(248,113,113,.13)}
.casilla{display:flex;gap:12px;align-items:flex-start;font-size:.9rem;color:var(--suave)}
.casilla input{width:19px;height:19px;flex-shrink:0;margin-top:2px;accent-color:var(--indigo-600)}
.miel{position:absolute;left:-9999px;opacity:0;height:0;width:0;overflow:hidden}
.aviso-form{
  padding:15px 18px;border-radius:12px;font-size:.94rem;margin-bottom:22px;display:none;
  border:1px solid transparent;
}
.aviso-form.ok{display:block;background:var(--verde-suave);border-color:#a7f3d0;color:#065f46}
.aviso-form.error{display:block;background:#fef2f2;border-color:#fecaca;color:#991b1b}

/* ---------- Acordeón / FAQ ---------- */
.acordeon{border:1px solid var(--linea);border-radius:var(--radio);background:#fff;margin-bottom:12px;overflow:hidden}
.acordeon summary{
  cursor:pointer;list-style:none;padding:21px 56px 21px 24px;font-weight:650;color:var(--tinta);
  position:relative;font-size:1.02rem;transition:background .15s ease;
}
.acordeon summary::-webkit-details-marker{display:none}
.acordeon summary:hover{background:var(--fondo-alt)}
.acordeon summary::after{
  content:"";position:absolute;right:24px;top:50%;width:13px;height:13px;margin-top:-6px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='3' stroke-linecap='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") center/contain no-repeat;
  transition:transform .2s ease;
}
.acordeon[open] summary::after{transform:rotate(180deg)}
.acordeon__cuerpo{padding:0 24px 24px;color:var(--suave)}
.acordeon__cuerpo p:last-child,.acordeon__cuerpo ul:last-child{margin-bottom:0}

/* ---------- Llamado final ---------- */
.llamado{
  position:relative;overflow:hidden;border-radius:var(--radio-xl);text-align:center;
  background:linear-gradient(150deg,#1e3a8a,#2563eb);color:#dbeafe;
  padding:clamp(46px,6vw,76px) clamp(26px,5vw,60px);
}
.llamado::after{
  content:"";position:absolute;width:520px;height:520px;border-radius:50%;bottom:-300px;left:-160px;
  background:radial-gradient(circle,rgba(165,213,242,.28),transparent 70%);pointer-events:none;
}
.llamado > *{position:relative;z-index:1}
.llamado h2{color:#fff}
.llamado p{max-width:600px;margin-inline:auto;color:#c7d7f5;font-size:1.08rem}

/* ---------- Blog ---------- */
.entradas{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
@media (max-width:980px){.entradas{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.entradas{grid-template-columns:1fr}}
.entrada{
  background:#fff;border:1px solid var(--linea);border-radius:var(--radio-lg);overflow:hidden;
  display:flex;flex-direction:column;transition:transform .2s ease,box-shadow .2s ease;height:100%;
}
.entrada:hover{transform:translateY(-4px);box-shadow:var(--sombra-lg)}
.entrada__portada{
  aspect-ratio:16/9;background:linear-gradient(140deg,var(--indigo-700),var(--indigo-500));
  display:flex;align-items:center;justify-content:center;padding:24px;
}
.entrada__portada svg{width:64px;height:64px;color:rgba(255,255,255,.75)}
.entrada__portada img{width:100%;height:100%;object-fit:cover}
.entrada__cuerpo{padding:26px;display:flex;flex-direction:column;flex:1}
.entrada__meta{font-size:.8rem;color:var(--tenue);margin-bottom:11px;display:flex;gap:9px;align-items:center;flex-wrap:wrap}
.entrada__etiqueta{background:var(--indigo-50);color:var(--indigo-700);font-weight:650;padding:3px 10px;border-radius:999px}
.entrada h3{font-size:1.14rem;margin-bottom:.5em}
.entrada h3 a{color:var(--tinta)}
.entrada h3 a:hover{color:var(--indigo-700)}
.entrada p{font-size:.95rem;color:var(--suave);flex:1;margin-bottom:16px}
.entrada__mas{font-size:.9rem;font-weight:650;display:inline-flex;align-items:center;gap:6px}

.articulo{max-width:760px;margin-inline:auto}
.articulo h2{font-size:clamp(1.4rem,2.6vw,1.85rem);margin-top:2em}
.articulo h3{margin-top:1.7em}
.articulo p,.articulo li{font-size:1.06rem;line-height:1.75}
.articulo img{border-radius:var(--radio);border:1px solid var(--linea);margin:2em 0}
.articulo blockquote{
  margin:2em 0;padding:4px 0 4px 24px;border-left:4px solid var(--indigo-500);
  font-size:1.14rem;color:var(--tinta);font-style:italic;
}
.articulo__cabecera{text-align:center;margin-bottom:clamp(34px,4vw,52px)}
.articulo__cabecera .entrada__meta{justify-content:center}

/* ---------- Texto legal ---------- */
.legal{max-width:820px;margin-inline:auto}
.legal h2{font-size:clamp(1.3rem,2.4vw,1.7rem);margin-top:2.2em;padding-top:1.4em;border-top:1px solid var(--linea)}
.legal h2:first-of-type{margin-top:1em}
.legal h3{margin-top:1.7em;font-size:1.08rem}
.legal p,.legal li{font-size:1rem}
.legal__fecha{color:var(--tenue);font-size:.92rem}
.indice{background:var(--fondo-alt);border:1px solid var(--linea);border-radius:var(--radio-lg);padding:26px 30px;margin-bottom:44px}
.indice h2{border:none;margin:0 0 14px;padding:0;font-size:1rem;text-transform:uppercase;letter-spacing:.08em;color:var(--suave)}
.indice ol{margin:0;padding-left:1.25em;columns:2;column-gap:32px}
@media (max-width:640px){.indice ol{columns:1}}
.indice li{margin-bottom:7px;font-size:.94rem}

.tabla-envoltura{overflow-x:auto;margin:1.6em 0;border:1px solid var(--linea);border-radius:var(--radio)}
table{border-collapse:collapse;width:100%;font-size:.94rem;min-width:520px}
th,td{padding:13px 16px;text-align:left;border-bottom:1px solid var(--linea)}
th{background:var(--fondo-alt);font-weight:700;color:var(--tinta);font-size:.85rem;
   text-transform:uppercase;letter-spacing:.05em}
tbody tr:last-child td{border-bottom:none}

/* ---------- Pie ---------- */
.pie{background:var(--indigo-950);color:#94a3b8;padding:clamp(52px,6vw,76px) 0 34px;font-size:.94rem}
.pie a{color:#cbd5e1}
.pie a:hover{color:#fff}
.pie__rejilla{display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr;gap:40px;padding-bottom:44px}
@media (max-width:900px){.pie__rejilla{grid-template-columns:1fr 1fr;gap:36px}}
@media (max-width:520px){.pie__rejilla{grid-template-columns:1fr}}
.pie__marca{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.pie__marca svg{height:32px;width:auto}
.pie__nombre{font-weight:900;font-size:1.24rem;color:#fff;letter-spacing:-.03em}
.pie__nombre span{color:var(--marca-palido)}
.pie h4{color:#fff;font-size:.82rem;text-transform:uppercase;letter-spacing:.11em;margin-bottom:16px}
.pie ul{list-style:none;padding:0;margin:0}
.pie li{margin-bottom:11px}
.pie__contacto{display:flex;align-items:center;gap:9px;margin-bottom:11px}
.pie__contacto svg{width:17px;height:17px;color:#64748b;flex-shrink:0}
.pie__base{
  border-top:1px solid rgba(148,163,184,.18);padding-top:26px;display:flex;
  justify-content:space-between;gap:18px;flex-wrap:wrap;font-size:.87rem;color:#64748b;
}

/* ---------- WhatsApp flotante ---------- */
.whatsapp{
  position:fixed;right:20px;bottom:20px;z-index:70;width:58px;height:58px;border-radius:50%;
  background:#25D366;display:flex;align-items:center;justify-content:center;
  box-shadow:0 10px 26px -6px rgba(37,211,102,.55);transition:transform .18s ease;
}
.whatsapp:hover{transform:scale(1.08)}
.whatsapp svg{width:31px;height:31px;color:#fff}
@media (max-width:520px){.whatsapp{width:52px;height:52px;right:16px;bottom:16px}.whatsapp svg{width:27px;height:27px}}

/* ---------- Utilidades ---------- */
.centro{text-align:center}
.mt-0{margin-top:0}.mb-0{margin-bottom:0}
.mt-2{margin-top:22px}.mt-3{margin-top:34px}.mt-4{margin-top:48px}
.silencio{color:var(--suave)}
.pequeno{font-size:.9rem}
.solo-lectores{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0;
}
.migas{font-size:.87rem;color:var(--tenue);margin-bottom:22px}
.migas a{color:var(--suave)}
.migas span{margin-inline:7px}

/* ---------- Aparición al desplazar ---------- */
.aparece{opacity:0;transform:translateY(22px);transition:opacity .6s ease,transform .6s ease}
.aparece.visible{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;transition-duration:.01ms !important;
    scroll-behavior:auto !important}
  .aparece{opacity:1;transform:none}
}

@media print{
  .nav,.pie,.whatsapp,.llamado{display:none}
  body{font-size:12pt;color:#000}
}