:root{
  --ink:#0b1220; --ink-2:#334155; --ink-3:#64748b;
  --panel:#ffffff; --panel-2:#f8fafc;

  /* Base NextUS (azules) */
  --navy:#0B3B8F;
  --blue:#0A66FF;
  --cyan:#00B4FF;

  /* WhatsApp */
  --wa:#25D366;
  --wa2:#1FA855;

  /* Colores del logo */
  --y:#F5B301; --g:#16A34A; --t:#14B8A6; --b:#2563EB; --p:#7C3AED; --m:#EC4899; --r:#EF4444;

  --radius:18px;
  --shadow:0 10px 25px rgba(2,6,23,.08);
  --shadow-2:0 18px 60px rgba(2,6,23,.16);

  --ok:#22c55e; --ok-2:#16a34a; --ok-bg:#f0fdf4; --ok-b:#86efac;
}

*{box-sizing:border-box;margin:0;padding:0}
html,body{margin:0;overflow-x:hidden}
body{
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial,sans-serif;
  color:var(--ink);
  background:
    radial-gradient(900px 520px at 12% 10%, rgba(0,180,255,.10), transparent 62%),
    radial-gradient(900px 520px at 86% 18%, rgba(10,102,255,.10), transparent 60%),
    linear-gradient(180deg,#f3f6ff 0%,#f8fbff 40%,#ffffff 100%);
}
a{color:inherit;text-decoration:none}
.wrap{max-width:1260px;margin-inline:auto;padding:0 18px}
.cv{content-visibility:auto; contain-intrinsic-size: 1px 700px;}

/* Canvas BG */
#bg-canvas{ position:fixed; inset:0; width:100vw; height:100vh; z-index:-1; pointer-events:none; }

/* ===== Separadores modernos con texto ===== */
.slice{
  position:relative;
  width:100%;
  height:96px;
  overflow:hidden;
  isolation:isolate;
  margin: 10px 0;
}
.slice .layer{
  position:absolute; inset:-18px -40px;
  transform:skewY(-4deg);
  clip-path: polygon(0 0, 100% 42%, 100% 100%, 0 58%);
  background:
    linear-gradient(90deg,
      rgba(245,179,1,.18),
      rgba(22,163,74,.16),
      rgba(20,184,166,.16),
      rgba(37,99,235,.16),
      rgba(124,58,237,.16),
      rgba(236,72,153,.14),
      rgba(239,68,68,.12)
    );
  opacity:.9;
  filter: blur(.2px);
}
.slice .layer.back{
  inset:-24px -50px;
  transform:skewY(-5.3deg);
  clip-path: polygon(0 0, 100% 36%, 100% 100%, 0 64%);
  background: linear-gradient(90deg, rgba(11,59,143,.14), rgba(0,180,255,.10));
  opacity:.75;
}
.slice .shine{
  position:absolute; inset:0;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.35), transparent);
  mix-blend-mode:soft-light;
  opacity:.45;
  transform:translateX(-100%);
}
.slice.flip .layer{
  clip-path: polygon(0 0, 100% 58%, 100% 100%, 0 42%);
  transform:skewY(4deg);
}
.slice.flip .layer.back{
  clip-path: polygon(0 0, 100% 64%, 100% 100%, 0 36%);
  transform:skewY(5.3deg);
}
.slice .label{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:10px 14px;
  border-radius:999px;
  background:rgba(255,255,255,.78);
  border:1px solid rgba(2,6,23,.10);
  box-shadow:0 10px 22px rgba(2,6,23,.10);
  backdrop-filter: blur(10px) saturate(160%);
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--navy);
  font-size:12px;
  white-space:nowrap;
}
.slice .label .chip{
  width:10px;height:10px;border-radius:999px;
  background:linear-gradient(135deg,var(--blue),var(--cyan),var(--p));
  box-shadow:0 0 0 6px rgba(0,180,255,.10);
  flex:0 0 auto;
}

@media (prefers-reduced-motion:no-preference){
  .slice .layer{ animation: drift 18s ease-in-out infinite; will-change: transform }
  .slice .layer.back{ animation-duration: 22s; animation-direction: reverse }
  .slice .shine{ animation: shine 8s linear infinite }
  @keyframes drift{
    0%{ transform:skewY(-4deg) translateX(0) }
    50%{ transform:skewY(-4deg) translateX(18px) }
    100%{ transform:skewY(-4deg) translateX(0) }
  }
  @keyframes shine{
    0%{ transform:translateX(-120%) }
    100%{ transform:translateX(120%) }
  }
}

/* Header */
header{
  position:sticky; top:0; z-index:40;
  background:rgba(255,255,255,.86);
  backdrop-filter:saturate(180%) blur(10px);
  border-bottom:1px solid rgba(2,6,23,.08)
}
.nav{ display:flex; align-items:center; justify-content:space-between; height:64px }
.brand{ display:flex; align-items:center; gap:10px }
.brand-logo{ height:44px; width:auto; display:block }

.menu{ display:flex; gap:6px; align-items:center }
.menu a{
  padding:10px 12px; border-radius:12px; color:var(--ink-2);
  transition:transform .2s ease, box-shadow .2s ease, background .2s ease;
  position:relative; overflow:hidden;
  font-weight:800;
}
.menu a::before{
  content:''; position:absolute; top:0; left:-100%; width:100%; height:100%;
  background:linear-gradient(90deg,transparent,rgba(0,180,255,.10),transparent);
  transition:left .4s ease;
}
.menu a:hover::before{ left:100% }
.menu a:hover,.menu a:focus{
  background:rgba(2,6,23,.04);
  transform:translateY(-1px);
  box-shadow:0 3px 10px rgba(10,102,255,.12)
}

@keyframes gradientShift{
  0%{background-position:0% 50%}
  50%{background-position:100% 50%}
  100%{background-position:0% 50%}
}

.menu a.moodle-pill{
  font-weight:900; color:#fff;
  background:linear-gradient(135deg,var(--navy),var(--blue),var(--cyan));
  background-size:220% 220%;
  border:none; box-shadow:0 10px 24px rgba(10,102,255,.24);
}
@media (prefers-reduced-motion:no-preference){
  .menu a.moodle-pill{ animation: gradientShift 3.8s ease infinite; }
}
.menu a.moodle-pill::after{
  content:''; position:absolute; inset:-1px; border-radius:12px;
  box-shadow: 0 0 0 2px rgba(255,255,255,.18) inset;
  pointer-events:none;
}

.cta{ display:none }
.hamb{
  display:inline-flex; align-items:center; justify-content:center;
  width:44px; height:44px; border-radius:12px;
  background:var(--panel-2); border:1px solid rgba(2,6,23,.08);
  transition:transform .2s ease, background .2s ease;
}
.hamb:hover{ background:rgba(0,180,255,.10); transform:scale(1.04) }
.hamb svg{ width:20px; height:20px }

/* Drawer */
.drawer{
  position:fixed; inset:0 0 0 auto; width:min(86vw,420px);
  background:#fff; transform:translateX(100%);
  transition:transform .3s ease; z-index:50;
  border-left:1px solid rgba(2,6,23,.08)
}
.drawer.open{ transform:translateX(0) }
.drawer .head{ display:flex; align-items:center; justify-content:space-between; padding:18px 16px; border-bottom:1px solid rgba(2,6,23,.08) }
.drawer nav{ display:grid; gap:8px; padding:16px }
.drawer a{
  padding:14px 16px; border-radius:14px; background:var(--panel-2);
  border:1px solid rgba(2,6,23,.06);
  transition:transform .2s ease, background .2s ease;
  font-weight:900;
}
.drawer a:hover,.drawer a:focus{
  background:linear-gradient(135deg,rgba(10,102,255,.10),rgba(0,180,255,.10));
  transform:translateX(4px)
}

/* Botones (efectos regresados) */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:12px 16px; border-radius:14px; font-weight:900;
  border:1px solid rgba(2,6,23,.10);
  background:rgba(255,255,255,.88);
  color:var(--ink);
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease;
  font-size:clamp(14px,2.8vw,16px);
  position:relative; overflow:hidden;
  white-space:nowrap;
  will-change: transform;
}
.btn::before{
  content:'';
  position:absolute;
  top:0; left:-120%;
  width:50%; height:100%;
  transform:skewX(-18deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.60),transparent);
  transition:left .45s ease;
}
.btn:hover::before{ left:140% }
.btn:hover,.btn:focus{
  transform:translateY(-2px);
  box-shadow:0 12px 22px rgba(2,6,23,.12);
  border-color: rgba(0,180,255,.22);
}

.btn.primary{
  background:linear-gradient(135deg,var(--navy),var(--blue),var(--cyan));
  background-size:200% 200%;
  color:#fff; border-color:transparent;
  box-shadow:0 14px 28px rgba(10,102,255,.20);
}
.btn.moodle{
  background:
    radial-gradient(120% 120% at 20% 20%, rgba(255,255,255,.22), transparent 45%),
    linear-gradient(135deg,var(--navy),var(--blue),var(--cyan));
  background-size:240% 240%;
  color:#fff; border:none;
  box-shadow:0 14px 30px rgba(0,180,255,.20);
}
@media (prefers-reduced-motion:no-preference){
  .btn.primary{ animation: gradientShift 3.2s ease infinite; }
  .btn.moodle{ animation: gradientShift 3.2s ease infinite; }
}
.btn.ghost:hover,.btn.ghost:focus{ background:rgba(255,255,255,.95) }

.btn.whatsapp{
  background:linear-gradient(135deg,var(--wa),var(--wa2));
  color:#063a1f;
  border-color:transparent;
  box-shadow:0 14px 26px rgba(37,211,102,.22);
}
.btn.whatsapp:hover,.btn.whatsapp:focus{
  box-shadow:0 18px 34px rgba(37,211,102,.28);
}

/* Layout */
section{ padding:56px 0 }
.sec-head{ display:flex; align-items:end; justify-content:space-between; gap:16px; margin-bottom:18px }
.sec-title{ font-size:clamp(24px,5vw,38px); font-weight:900; color:var(--ink) }
.sub{ color:var(--ink-3); font-size:clamp(15px,2.8vw,19px); line-height:1.55 }
.grid{ display:grid; gap:16px }

/* HERO */
.hero{ padding:26px 0 12px }
.hero-top{
  display:grid;
  gap:18px;
  grid-template-columns: 1.08fr .92fr;
  align-items:stretch;
}
.hero-left{
  position:relative;
  border-radius:24px;
  padding:26px 26px 22px;
  background:
    radial-gradient(120% 90% at 10% 20%, rgba(245,179,1,.10), transparent 60%),
    radial-gradient(120% 90% at 85% 25%, rgba(236,72,153,.10), transparent 60%),
    radial-gradient(120% 90% at 65% 70%, rgba(20,184,166,.10), transparent 62%),
    linear-gradient(180deg, rgba(255,255,255,.72), rgba(255,255,255,.35));
  border:1px solid rgba(10,102,255,.16);
  box-shadow:0 18px 50px rgba(11,59,143,.10);
  overflow:hidden;
  backdrop-filter: blur(14px) saturate(170%);
}
.eyebrow{
  display:inline-flex; gap:8px; align-items:center;
  padding:8px 12px; border-radius:999px;
  background:rgba(10,102,255,.10);
  border:1px solid rgba(10,102,255,.22);
  font-weight:900; color:var(--navy);
  font-size:clamp(13px,2.5vw,15px);
  width:fit-content;
}

/* ===== NUEVO: línea de confianza discreta ===== */
.trust-line{
  margin-top:10px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.55);
  border:1px solid rgba(2,6,23,.10);
  color:var(--ink-2);
  font-weight:900;
  font-size:clamp(12px,2.4vw,14px);
  width:fit-content;
}

.hero-title{
  font-size:clamp(36px,6.8vw,62px);
  line-height:1.02;
  font-weight:900;
  letter-spacing:-.7px;
  margin:14px 0 10px;
  color:var(--ink);
}
.hero-title .prepa{
  display:inline-block;
  background:linear-gradient(90deg, var(--navy), var(--blue), var(--cyan), var(--p), var(--m));
  background-size:280% 280%;
  -webkit-background-clip:text; background-clip:text;
  color:transparent;
  position:relative;
  text-shadow: 0 14px 40px rgba(10,102,255,.18);
}
@media (prefers-reduced-motion:no-preference){
  .hero-title .prepa{ animation: gradientShift 4.2s ease infinite; }
}
.hero-title .prepa::after{
  content:'';
  position:absolute;
  left:-6%;
  right:-6%;
  bottom:6px;
  height:14px;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(0,180,255,.25), rgba(124,58,237,.18), rgba(236,72,153,.16));
  filter: blur(10px);
  z-index:-1;
}

/* ===== NUEVO: resaltar SEP sin ensuciar ===== */
.hero-title .sep{
  color:var(--navy);
  font-weight:900;
}

/* ===== NUEVO: subtítulo más compacto ===== */
.hero-sub{ max-width:56ch; }

.cta-row{ display:flex; gap:12px; flex-wrap:wrap; margin-top:16px }

/* ===== CORREGIDO: mini-kpis como sellos en una sola fila ===== */
.mini-kpis{
  margin-top:18px;
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}
.mini{
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px 14px;
  border-radius:999px;
  border:1px solid rgba(2,6,23,.08);
  background:rgba(255,255,255,.58);
  backdrop-filter: blur(12px) saturate(160%);
  box-shadow:0 10px 18px rgba(2,6,23,.08);
}
.mini-ico{
  width:34px;
  height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:linear-gradient(135deg, rgba(10,102,255,.12), rgba(0,180,255,.10));
  border:1px solid rgba(0,180,255,.18);
  flex:0 0 auto;
}
.mini-txt b{
  display:block;
  font-size:clamp(15px,2.6vw,18px);
  line-height:1.05;
}
.mini-txt span{
  display:block;
  color:var(--ink-3);
  font-weight:900;
  font-size:12px;
  margin-top:2px;
}

.hero-right{
  display:grid;
  grid-template-rows: 1fr;
  gap:16px;
}
.hero-banner{
  border-radius:24px;
  overflow:hidden;
  border:1px solid rgba(2,6,23,.08);
  background:linear-gradient(135deg, rgba(11,59,143,.12), rgba(0,180,255,.10));
  box-shadow:0 18px 55px rgba(11,59,143,.10);
  min-height: 360px;
}
.hero-banner img{ width:100%; height:100%; object-fit:cover; display:block; filter:saturate(1.05) contrast(1.04); }

/* BLOQUES glass */
.glass-block{
  border-radius:24px;
  border:1px solid rgba(2,6,23,.08);
  background:rgba(255,255,255,.52);
  backdrop-filter: blur(14px) saturate(170%);
  box-shadow:0 18px 55px rgba(2,6,23,.10);
  padding:22px;
}

/* BENEFICIOS */
.pill-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-top:14px; }
.pill{
  padding:12px 12px;
  border-radius:16px;
  background:rgba(255,255,255,.62);
  border:1px solid rgba(10,102,255,.14);
  text-align:center;
  font-weight:900;
  font-size:clamp(13px,2.6vw,15px);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  backdrop-filter: blur(10px) saturate(150%);
}
.pill:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 20px rgba(10,102,255,.10);
  border-color: rgba(0,180,255,.28);
}
.checks{ display:grid; gap:12px; margin-top:14px }
.check{ display:flex; gap:10px; align-items:flex-start; }
.dot{
  width:12px; height:12px; border-radius:999px;
  background:linear-gradient(135deg,var(--blue),var(--cyan),var(--p));
  margin-top:6px;
  box-shadow:0 0 0 6px rgba(0,180,255,.10);
  flex:0 0 auto;
}
.check b{ font-weight:900 }
.check span{ color:var(--ink-3); font-weight:800; display:block; margin-top:2px }

/* PROGRAMAS */
#programas .programs{ display:grid; grid-template-columns:repeat(auto-fit,minmax(310px,1fr)); gap:18px }
.prog{
  position:relative; overflow:hidden;
  border:1px solid rgba(10,102,255,.16);
  border-radius:24px;
  background:rgba(255,255,255,.55);
  backdrop-filter: blur(14px) saturate(170%);
  box-shadow:0 18px 55px rgba(11,59,143,.10);
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease
}
.prog:hover,.prog:focus-within{
  transform:translateY(-6px);
  box-shadow:0 26px 70px rgba(11,59,143,.14);
  border-color:rgba(0,180,255,.35)
}

/* Ribbon SIMÉTRICO + llamativo */
.prog .ribbon{
  position:absolute;
  top:14px;
  left:50%;
  transform:translateX(-50%);
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:10px 16px;
  border-radius:999px;
  color:#fff;
  font-weight:900;
  letter-spacing:.3px;
  background:linear-gradient(135deg, var(--navy), var(--blue), var(--cyan), var(--p));
  background-size:220% 220%;
  box-shadow:0 16px 34px rgba(10,102,255,.22);
  border:1px solid rgba(255,255,255,.22);
  backdrop-filter: blur(10px) saturate(160%);
  z-index:2;
}
.prog .ribbon::before{
  content:'';
  position:absolute;
  inset:-2px;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(255,255,255,.22), transparent, rgba(255,255,255,.20));
  opacity:.6;
  filter: blur(10px);
  z-index:-1;
}
.prog .ribbon-inner{ opacity:.95 }
.prog .ribbon-inner.strong{ opacity:1 }
.prog .ribbon-dot{ opacity:.9; transform:translateY(-1px); }
@media (prefers-reduced-motion:no-preference){
  .prog .ribbon{ animation: gradientShift 3.6s ease infinite; }
}
@media (max-width:560px){
  .prog .ribbon{ top:10px; padding:9px 14px; font-size:13px; }
}

.prog .thumb{
  width:100%; aspect-ratio:16/9;
  background:linear-gradient(135deg, var(--navy), var(--cyan));
  border-bottom:1px solid rgba(2,6,23,.06);
  overflow:hidden
}
.prog .thumb img{ width:100%; height:100%; object-fit:cover; display:block; filter:saturate(1.05) contrast(1.05); transition:transform .35s ease }
.prog:hover .thumb img{ transform:scale(1.04) }
.prog .inner{ padding:20px; display:grid; gap:12px }
.prog .tag{
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 12px; border-radius:999px;
  background:rgba(0,180,255,.14); border:1px solid rgba(0,180,255,.22);
  font-weight:900; color:var(--navy);
  font-size:clamp(13px,2.7vw,15px)
}
.prog h3{
  font-size:clamp(22px,4vw,28px); font-weight:900;
  background:linear-gradient(90deg,var(--navy),var(--blue),var(--cyan),var(--p),var(--m));
  -webkit-background-clip:text; background-clip:text; color:transparent
}
.prog p{ color:var(--ink-2); font-size:clamp(15px,2.8vw,16px); line-height:1.55 }
.prog .points,.prog .requirements{ display:grid; gap:8px; margin:4px 0 }
.prog .points li,.prog .requirements li{ list-style:none; display:flex; align-items:start; gap:8px; color:var(--ink-2); font-size:clamp(14px,2.8vw,15px) }
.prog .points li::before,.prog .requirements li::before{ content:'✔'; color:var(--ok); font-weight:900; line-height:1.2 }
.prog .requirements-title{ font-size:clamp(15px,2.8vw,16px); font-weight:900; color:var(--ink); margin:8px 0 2px }

/* RVOE */
.rvoe-hero{ display:grid; grid-template-columns: 1fr; gap:14px; }
.portada-box{
  border-radius:24px;
  overflow:hidden;
  border:1px solid rgba(2,6,23,.10);
  background:rgba(255,255,255,.50);
  backdrop-filter: blur(14px) saturate(170%);
  box-shadow:0 18px 55px rgba(2,6,23,.10);
}
.portada-box img{ width:100%; height:auto; display:block; object-fit:cover; max-height:520px; }
.rvoe-card{
  border-radius:24px;
  border:1px solid rgba(34,197,94,.30);
  background:linear-gradient(180deg, rgba(240,253,244,.75), rgba(255,255,255,.55));
  backdrop-filter: blur(14px) saturate(170%);
  box-shadow:0 18px 55px rgba(2,6,23,.10);
  padding:22px;
}
.rvoe-pill{
  display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;
  background:#dcfce7;border:1px solid var(--ok-b);font-weight:900;color:var(--ok-2)
}

/* TESTIMONIOS */
.testimonials{ grid-template-columns:repeat(4,1fr) }
.testimonial{
  padding:18px;
  display:grid;
  gap:12px;
  position:relative;
  overflow:hidden;
  border-radius:22px;
  border:1px solid rgba(2,6,23,.08);
  background:rgba(255,255,255,.56);
  backdrop-filter: blur(12px) saturate(160%);
  box-shadow:0 14px 34px rgba(2,6,23,.10);
}
.t-head{ display:flex; gap:12px; align-items:center; position:relative; z-index:1; }
.avatar{
  width:44px; height:44px;
  border-radius:14px;
  object-fit:cover;
  border:1px solid rgba(2,6,23,.10);
  box-shadow:0 10px 18px rgba(2,6,23,.12);
  background:#e5e7eb;
  flex:0 0 auto;
}
.t-meta{ display:grid; gap:2px }
.t-name{ font-weight:900; color:var(--ink); font-size:15px; line-height:1.1 }
.t-tag{ font-weight:900; color:var(--navy); font-size:12px; opacity:.9 }
.t-city{ color:var(--ink-3); font-weight:800; font-size:12px; }
.t-body q{ color:var(--ink-2); line-height:1.55; font-weight:700; font-size:14px; }
.stars{ display:flex; gap:2px; color:#f59e0b; font-size:14px; }

/* GALERÍA */
.rail{ display:flex; gap:12px; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:6px; scrollbar-width:thin; scrollbar-color: rgba(15,23,42,.15) transparent }
.rail::-webkit-scrollbar{ height:8px } .rail::-webkit-scrollbar-thumb{ background: rgba(15,23,42,.15); border-radius:999px }
.shot{ scroll-snap-align:start; min-width:250px; max-width:340px; aspect-ratio:4/3; border-radius:18px; background:#e5e7eb; position:relative; border:1px solid rgba(2,6,23,.10); overflow:hidden; transition:transform .2s ease; box-shadow:0 12px 22px rgba(2,6,23,.08) }
.shot:hover{ transform:scale(1.02); box-shadow:0 16px 30px rgba(0,0,0,.12) }
.shot img{ width:100%; height:100%; object-fit:cover; display:block; }

/* RECURSOS */
.resources{ grid-template-columns:repeat(3,1fr) }
.res{
  display:grid; gap:10px; overflow:hidden;
  border:1px solid rgba(2,6,23,.10);
  border-radius:20px;
  transition:transform .2s ease, box-shadow .2s ease;
  background:rgba(255,255,255,.56);
  backdrop-filter: blur(12px) saturate(160%);
  box-shadow:0 14px 34px rgba(2,6,23,.10);
}
.res:hover{ transform:translateY(-3px); box-shadow:0 18px 40px rgba(0,0,0,.12) }
.res img{ width:100%; height:170px; object-fit:cover; display:block }
.res-title{
  font-size:clamp(18px,3vw,22px); font-weight:900; margin:6px 0;
  background:linear-gradient(90deg,var(--navy),var(--blue),var(--cyan),var(--p),var(--m));
  -webkit-background-clip:text; background-clip:text; color:transparent
}

/* FAQ sin click */
.faq .item{
  border:1px solid rgba(2,6,23,.10);
  border-radius:16px;
  margin-bottom:10px;
  overflow:hidden;
  background:rgba(255,255,255,.56);
  backdrop-filter: blur(12px) saturate(160%);
  box-shadow:0 14px 34px rgba(2,6,23,.08);
  padding:16px;
}
.faq .q{ font-weight:900; font-size:clamp(15px,2.8vw,16px); color:var(--ink); }
.faq .a{ margin-top:8px; color:var(--ink-3); font-size:clamp(14px,2.8vw,15px); font-weight:700; line-height:1.55; }

/* REDES */
.socials-grid{ display:grid; grid-template-columns:1.2fr .8fr; gap:16px; align-items:stretch; }
.socials-card, .socials-mini{
  border-radius:24px;
  border:1px solid rgba(2,6,23,.10);
  background:rgba(255,255,255,.52);
  backdrop-filter: blur(14px) saturate(170%);
  box-shadow:0 18px 55px rgba(2,6,23,.10);
  padding:22px;
}
.social-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:12px; margin-top:12px; }
.social-btn{
  display:flex; align-items:center; gap:10px;
  padding:12px 14px;
  border-radius:16px;
  background:rgba(255,255,255,.72);
  border:1px solid rgba(2,6,23,.10);
  font-weight:900;
  transition:transform .2s ease, background .2s ease, box-shadow .2s ease, border-color .2s ease;
  backdrop-filter: blur(10px) saturate(150%);
}
.social-btn:hover{
  background:rgba(255,255,255,.90);
  transform:translateY(-2px);
  box-shadow:0 14px 26px rgba(0,0,0,.10);
  border-color: rgba(0,180,255,.22);
}
.social-btn img{ width:24px; height:24px }

.badge-line{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:12px;
  border-radius:16px;
  background:rgba(255,255,255,.75);
  border:1px solid rgba(2,6,23,.08);
  backdrop-filter: blur(10px) saturate(150%);
}
.badge-line b{ font-weight:900; color:var(--navy) }
.badge-line span{ font-weight:900; color:var(--ink-3); font-size:12px }

/* CONTACTO */
.contact-title{
  font-size:clamp(26px,5vw,40px);
  font-weight:900;
  margin-bottom:18px;
  background:linear-gradient(90deg,var(--navy),var(--blue),var(--cyan),var(--p),var(--m));
  -webkit-background-clip:text; background-clip:text; color:transparent
}
.contact-section{
  border-radius:24px;
  border:1px solid rgba(2,6,23,.10);
  background:rgba(255,255,255,.50);
  backdrop-filter: blur(14px) saturate(170%);
  box-shadow:0 18px 55px rgba(2,6,23,.10);
  padding:22px;
}
.contact-grid{ display:grid; grid-template-columns:1fr 1fr; gap:16px }
.contact-card{
  border-radius:22px;
  border:1px solid rgba(2,6,23,.10);
  background:rgba(255,255,255,.58);
  backdrop-filter: blur(12px) saturate(160%);
  box-shadow:0 14px 34px rgba(2,6,23,.10);
  padding:20px;
}
.contact-card-title{ font-size:clamp(18px,3vw,22px); font-weight:900; margin-bottom:10px; color:var(--ink) }
.contact-card-desc{ color:var(--ink-3); margin-bottom:16px; line-height:1.5; font-weight:800 }
.map-card{ overflow:hidden; border-radius:18px; border:1px solid rgba(2,6,23,.10) }
.map-card iframe{ width:100%; height:320px; border:0; display:block }

footer{ padding:24px 0; color:var(--ink-3); border-top:1px solid rgba(2,6,23,.08); font-weight:700 }

/* CTA bar */
.cta-bar{
  position:fixed;
  left:50%;
  transform:translateX(-50%);
  bottom:14px;
  z-index:55;
  width:min(980px, calc(100% - 24px));
  background:rgba(255,255,255,.86);
  backdrop-filter: blur(12px) saturate(170%);
  border:1px solid rgba(2,6,23,.10);
  border-radius:18px;
  box-shadow:0 18px 50px rgba(2,6,23,.18);
  padding:10px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
}
.cta-bar .left{ display:flex; flex-direction:column; gap:2px; padding-left:6px; min-width: 170px; }
.cta-bar .left b{ font-weight:900; color:var(--navy) }
.cta-bar .left span{ color:var(--ink-3); font-weight:900; font-size:13px }
.cta-bar .right{ display:flex; gap:10px; flex-wrap:wrap; justify-content:flex-end; }

/* Responsive */
@media (max-width:980px){
  .menu{ display:none }
  .cta{ display:inline-block }
  .wrap{max-width:1150px}
}
@media (max-width:960px){
  section{ padding:46px 0 }
  .hero-top{ grid-template-columns:1fr }
  .hero-banner{ min-height: 260px; }

  /* CORREGIDO: ahora mini-kpis es flex, no grid */
  .mini-kpis{ flex-direction:column; }

  .pill-grid{ grid-template-columns:repeat(2,1fr); }
  .testimonials{ grid-template-columns:repeat(2,1fr) }
  .resources{ grid-template-columns:1fr 1fr }
  .contact-grid{ grid-template-columns:1fr }
  .socials-grid{ grid-template-columns:1fr; }
}
@media (max-width:560px){
  section{ padding:38px 0 }
  .hero{ padding:18px 0 10px }
  .hero-title{ text-align:center; }
  .sub{ text-align:center; margin-inline:auto }
  .cta-row{ justify-content:center }

  /* NUEVO: centrado de la trust line en móvil */
  .trust-line{ margin-inline:auto; text-align:center; }

  /* NUEVO: centra sellos en móvil */
  .mini-kpis{ justify-content:center; }

  .cta-bar{ flex-direction:column; align-items:stretch }
  .cta-bar .right{ justify-content:space-between }
  .testimonials{ grid-template-columns:1fr }
  .resources{ grid-template-columns:1fr }
  .pill-grid{ grid-template-columns:1fr; }
  .slice{ height:84px }
  .social-grid{ grid-template-columns:1fr; }
  .slice .label{ font-size:11px; letter-spacing:.10em; padding:9px 12px; }
}