/* =============================================================
   KERA CLICK — hoja de estilos del sitio publico

   Los colores salen de estas variables. El panel las sobrescribe
   en vivo, asi que si cambias la paleta desde el panel no hace
   falta tocar este archivo.
============================================================= */

:root{
  --bg:#030b1a;
  --bg-grad:#061633;
  --surface:#0a1c38;
  --surface-2:#0e2447;
  --ink:#eaf2fb;
  --muted:#8fa9c8;
  --faint:#5c789c;
  --glow:#389ae4;
  --glow-2:#63bdf5;

  --line:color-mix(in srgb, var(--glow) 22%, transparent);
  --line-soft:color-mix(in srgb, var(--glow) 12%, transparent);
  --shadow:0 24px 70px -24px rgba(0,10,30,.8);
  --r:14px;
  --maxw:1180px;
  --verde:#25d366;
  --exito:#3ad07a;
}

html[data-theme="light"]{
  --bg:#ffffff;
  --bg-grad:#eef4fb;
  --surface:#ffffff;
  --surface-2:#f2f7fd;
  --ink:#001b42;
  --muted:#4a648a;
  --faint:#8ba1bd;
  --glow:#135ea4;
  --glow-2:#389ae4;

  --line:color-mix(in srgb, var(--glow) 20%, transparent);
  --line-soft:color-mix(in srgb, var(--glow) 10%, transparent);
  --shadow:0 24px 60px -28px rgba(0,27,66,.25);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:86px}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  transition:background .4s ease,color .4s ease;
}
body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(900px 600px at 78% -8%, color-mix(in srgb,var(--glow) 20%,transparent), transparent 62%),
    radial-gradient(760px 520px at 4% 12%, color-mix(in srgb,var(--glow-2) 13%,transparent), transparent 60%),
    linear-gradient(180deg, var(--bg), var(--bg-grad) 46%, var(--bg));
}
#circuito{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.6}

.saltar{position:absolute;left:-9999px;top:0;background:var(--ink);color:var(--bg);padding:10px 16px;z-index:200;border-radius:0 0 8px 0}
.saltar:focus{left:0}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px;position:relative;z-index:2}
.section-pad{padding:110px 0;position:relative;z-index:2}
h1,h2,h3,h4,h5{font-family:'Space Grotesk',sans-serif;font-weight:600;line-height:1.12;letter-spacing:-.02em}
a{color:inherit}
img{max-width:100%;display:block}

.eyebrow{
  font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--glow-2);font-weight:500;
  display:inline-flex;align-items:center;gap:12px;
}
.eyebrow .linea{width:34px;height:1px;background:currentColor;display:inline-block;opacity:.6}

/* ============================ HEADER ============================ */
header{
  position:fixed;top:0;left:0;right:0;z-index:100;
  background:color-mix(in srgb,var(--bg) 78%,transparent);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border-bottom:1px solid transparent;transition:border-color .3s,background .3s;
}
header.scrolled{border-bottom-color:var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;height:70px;max-width:var(--maxw);margin:0 auto;padding:0 28px;gap:18px}
.marca{
  font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:19px;letter-spacing:.14em;
  color:var(--ink);text-decoration:none;display:flex;align-items:center;gap:12px;flex-shrink:0;
}
.marca-logo{
  width:40px;height:40px;border-radius:50%;object-fit:cover;flex-shrink:0;
  box-shadow:0 0 0 1px var(--line),0 0 18px -4px color-mix(in srgb,var(--glow) 70%,transparent);
}
.nav-links{display:flex;gap:26px;align-items:center}
.nav-links a{color:var(--muted);text-decoration:none;font-size:14.5px;font-weight:500;transition:color .2s;white-space:nowrap}
.nav-links a:hover,.nav-links a.activo{color:var(--ink)}
.nav-tools{display:flex;gap:9px;align-items:center}
.toggle{
  background:transparent;border:1px solid var(--line);color:var(--ink);
  width:38px;height:36px;border-radius:9px;display:flex;align-items:center;justify-content:center;
  cursor:pointer;font-family:'JetBrains Mono',monospace;font-size:12px;transition:border-color .2s,background .2s;
}
.toggle:hover{border-color:var(--glow);background:color-mix(in srgb,var(--glow) 10%,transparent)}
.toggle svg{width:17px;height:17px}
.menu-btn{display:none;background:transparent;border:1px solid var(--line);color:var(--ink);width:38px;height:36px;border-radius:9px;cursor:pointer;align-items:center;justify-content:center}

/* ============================= HERO ============================= */
.hero{padding:150px 0 100px;position:relative;z-index:2}
.hero-grid{display:flex;align-items:center;justify-content:space-between;gap:56px}
.hero-inner{max-width:660px;flex:1}
.hero h1{font-size:clamp(2.3rem,5.4vw,4.05rem);margin:24px 0 24px}
.hero h1 .destacado{
  color:var(--glow-2);
  background-image:linear-gradient(180deg,transparent 62%,color-mix(in srgb,var(--glow) 34%,transparent) 62%);
  -webkit-box-decoration-break:clone;box-decoration-break:clone;
  border-radius:3px;padding:0 .04em;
}
.hero p.lead{font-size:clamp(1.02rem,1.9vw,1.24rem);color:var(--muted);max-width:640px;margin-bottom:38px}
.cta-row{display:flex;gap:14px;flex-wrap:wrap}
.btn{
  display:inline-flex;align-items:center;gap:10px;padding:14px 26px;border-radius:11px;
  font-size:14.5px;font-weight:600;text-decoration:none;border:1px solid transparent;cursor:pointer;
  font-family:'Inter',sans-serif;transition:transform .2s,box-shadow .25s,border-color .2s,background .2s;
}
.btn svg{width:17px;height:17px}
.btn-primary{background:linear-gradient(135deg,var(--glow),var(--glow-2));color:#04121f;box-shadow:0 10px 30px -12px color-mix(in srgb,var(--glow) 85%,transparent)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 18px 40px -12px color-mix(in srgb,var(--glow) 90%,transparent)}
.btn-ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.btn-ghost:hover{border-color:var(--glow);transform:translateY(-2px);background:color-mix(in srgb,var(--glow) 8%,transparent)}
.hero-stats{display:flex;gap:44px;margin-top:52px;flex-wrap:wrap}
.hero-stats .stat .n{font-family:'Space Grotesk',sans-serif;font-size:1.85rem;font-weight:600;line-height:1;margin-bottom:6px;color:var(--glow-2)}
.hero-stats .stat .l{font-size:13px;color:var(--muted);font-family:'JetBrains Mono',monospace;letter-spacing:.04em}

.hero-logo{flex-shrink:0}
.medallon{position:relative;width:320px;height:320px;display:flex;align-items:center;justify-content:center}
.medallon::before{
  content:"";position:absolute;inset:-14%;border-radius:50%;
  background:radial-gradient(circle at 40% 40%,color-mix(in srgb,var(--glow) 44%,transparent),transparent 62%),
             radial-gradient(circle at 66% 62%,color-mix(in srgb,var(--glow-2) 40%,transparent),transparent 60%);
  filter:blur(20px);opacity:.85;z-index:0;
}
.medallon img{position:relative;z-index:1;width:100%;height:100%;object-fit:cover;border-radius:50%;box-shadow:0 0 0 1px var(--line),0 30px 70px -30px rgba(0,0,0,.8)}
.medallon .anillo{position:absolute;inset:-5%;border-radius:50%;border:1px solid var(--line);z-index:2;animation:girar 30s linear infinite}
.medallon .anillo::after{content:"";position:absolute;top:-3px;left:50%;width:7px;height:7px;border-radius:50%;background:var(--glow-2);box-shadow:0 0 14px var(--glow-2);transform:translateX(-50%)}
@keyframes girar{to{transform:rotate(360deg)}}
@keyframes latir{0%,100%{opacity:1}50%{opacity:.35}}

/* ========================== ENCABEZADOS ========================= */
.sec-head{max-width:720px;margin-bottom:52px}
.sec-head h2{font-size:clamp(1.85rem,4vw,2.85rem);margin:18px 0 16px}
.sec-head p{color:var(--muted);font-size:1.06rem}

/* ========================== PUBLICIDAD ========================== */
.seccion-publicidad{
  position:relative;
  border-top:1px solid var(--line-soft);
  border-bottom:1px solid var(--line-soft);
  background:
    radial-gradient(900px 500px at 50% 0%, color-mix(in srgb,var(--glow) 12%,transparent), transparent 70%);
}
.pub-cabecera{max-width:800px;margin:0 auto 54px;text-align:center}
.pub-cabecera .sello{display:flex;width:fit-content;margin:0 auto 18px}
.pub-cabecera .eyebrow{display:flex;justify-content:center}
.pub-cabecera h2{font-size:clamp(1.9rem,4.4vw,3.05rem);margin:18px 0 20px}
.pub-cabecera p{color:var(--muted);font-size:1.08rem}
.sello{
  display:inline-flex;align-items:center;gap:9px;font-family:'JetBrains Mono',monospace;
  font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;
  padding:9px 18px;border-radius:30px;margin-bottom:20px;
  color:#04121f;background:linear-gradient(135deg,var(--glow),var(--glow-2));
  box-shadow:0 10px 30px -12px color-mix(in srgb,var(--glow) 90%,transparent);
}
.sello::before{content:"";width:8px;height:8px;border-radius:50%;background:#04121f;animation:latir 2s infinite}

.pub-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:46px}
.pub-card{
  border:1px solid var(--line);border-radius:16px;padding:28px 26px;
  background:color-mix(in srgb,var(--surface) 62%,transparent);
  transition:border-color .3s,transform .3s,box-shadow .3s;position:relative;overflow:hidden;
}
.pub-card::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--glow-2),transparent);opacity:0;transition:opacity .35s}
.pub-card:hover{border-color:color-mix(in srgb,var(--glow) 55%,transparent);transform:translateY(-4px);box-shadow:0 20px 46px -26px color-mix(in srgb,var(--glow) 80%,transparent)}
.pub-card:hover::before{opacity:.85}
.pub-card .ico{width:42px;height:42px;border-radius:11px;display:flex;align-items:center;justify-content:center;margin-bottom:18px;color:var(--glow-2);background:color-mix(in srgb,var(--glow) 14%,transparent);border:1px solid var(--line)}
.pub-card .ico svg{width:21px;height:21px}
.pub-card h3{font-size:1.13rem;margin-bottom:9px}
.pub-card p{color:var(--muted);font-size:.94rem}

.pub-garantia{
  display:flex;gap:22px;align-items:flex-start;
  border:1px solid color-mix(in srgb,var(--glow) 45%,transparent);
  background:color-mix(in srgb,var(--glow) 9%,transparent);
  border-radius:18px;padding:32px 34px;margin-bottom:56px;
}
.pub-garantia .escudo{flex-shrink:0;width:44px;height:44px;color:var(--glow-2)}
.pub-garantia .escudo svg{width:100%;height:100%}
.pub-garantia h3{font-size:1.3rem;margin-bottom:10px}
.pub-garantia p{color:var(--muted);font-size:.99rem}

.pub-planes{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:44px;align-items:start}
.plan{
  border:1px solid var(--line);border-radius:18px;padding:32px 28px;
  background:color-mix(in srgb,var(--surface) 66%,transparent);display:flex;flex-direction:column;
  transition:border-color .3s,transform .3s;position:relative;
}
.plan:hover{border-color:color-mix(in srgb,var(--glow) 50%,transparent);transform:translateY(-3px)}
.plan.destacado{
  border-color:var(--glow);background:color-mix(in srgb,var(--surface-2) 92%,transparent);
  box-shadow:0 26px 60px -30px color-mix(in srgb,var(--glow) 90%,transparent);
}
.plan .etiqueta{
  position:absolute;top:-11px;left:28px;font-family:'JetBrains Mono',monospace;font-size:10.5px;
  letter-spacing:.14em;text-transform:uppercase;padding:5px 12px;border-radius:20px;
  background:linear-gradient(135deg,var(--glow),var(--glow-2));color:#04121f;font-weight:600;
}
.plan h3{font-size:1.3rem;margin-bottom:8px}
.plan .resumen{color:var(--muted);font-size:.92rem;margin-bottom:22px;min-height:44px}
.plan .precio{font-family:'Space Grotesk',sans-serif;font-size:2.15rem;font-weight:600;line-height:1;color:var(--glow-2)}
.plan .periodo{font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--muted);margin:8px 0 22px}
.plan ul{list-style:none;margin-bottom:26px;flex:1}
.plan ul li{display:flex;gap:10px;align-items:flex-start;padding:7px 0;font-size:.92rem;color:var(--muted)}
.plan ul li svg{width:16px;height:16px;color:var(--glow-2);flex-shrink:0;margin-top:3px}
.plan .btn{width:100%;justify-content:center}
.pub-cta{text-align:center}
.pub-cta .btn{font-size:15.5px;padding:16px 34px}

/* =========================== SERVICIOS ========================== */
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.svc{
  border:1px solid var(--line);border-radius:var(--r);padding:30px 26px;
  background:color-mix(in srgb,var(--surface) 58%,transparent);
  transition:border-color .3s,transform .3s;position:relative;overflow:hidden;
}
.svc::before{content:"";position:absolute;top:0;left:0;width:100%;height:1px;background:linear-gradient(90deg,transparent,var(--glow-2),transparent);opacity:0;transition:opacity .4s}
.svc:hover{border-color:color-mix(in srgb,var(--glow) 50%,transparent);transform:translateY(-4px)}
.svc:hover::before{opacity:.8}
.svc .num{font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--faint);margin-bottom:16px}
.svc .ico{width:38px;height:38px;margin-bottom:18px;color:var(--glow-2)}
.svc .ico svg{width:100%;height:100%}
.svc h3{font-size:1.2rem;margin-bottom:10px}
.svc p{color:var(--muted);font-size:.94rem;margin-bottom:18px}
.svc .precio{font-family:'JetBrains Mono',monospace;font-size:13px;color:var(--muted);border-top:1px solid var(--line-soft);padding-top:14px}
.svc .precio b{color:var(--ink);font-weight:500}

/* ============================ PROCESO =========================== */
.proc-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:0;border-top:1px solid var(--line)}
.proc{padding:32px 20px 32px 0;border-right:1px solid var(--line);position:relative}
.proc:last-child{border-right:none}
.proc .paso{font-family:'JetBrains Mono',monospace;font-size:12.5px;color:var(--muted);margin-bottom:18px;display:flex;align-items:center;gap:8px}
.proc .paso::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--glow-2);box-shadow:0 0 12px var(--glow-2)}
.proc h3{font-size:1.08rem;margin-bottom:10px}
.proc p{color:var(--muted);font-size:.9rem}

/* ============================ POR QUE =========================== */
.why-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.feat{
  display:flex;gap:16px;padding:24px;border:1px solid var(--line);border-radius:var(--r);
  background:color-mix(in srgb,var(--surface) 50%,transparent);transition:border-color .3s,transform .3s;
}
.feat:hover{border-color:color-mix(in srgb,var(--glow) 48%,transparent);transform:translateY(-2px)}
.feat .fico{flex-shrink:0;width:34px;height:34px;color:var(--glow-2)}
.feat .fico svg{width:100%;height:100%}
.feat h4{font-family:'Space Grotesk',sans-serif;font-size:1.05rem;margin-bottom:6px;font-weight:600}
.feat p{color:var(--muted);font-size:.92rem}

/* =========================== COTIZADOR ========================== */
.cotiza-wrap{display:grid;grid-template-columns:1.15fr .85fr;gap:26px;align-items:start}
.cotiza-panel{border:1px solid var(--line);border-radius:18px;padding:34px;background:color-mix(in srgb,var(--surface) 68%,transparent)}
.cotiza-panel .grp{margin-bottom:28px}
.cotiza-panel .grp:last-child{margin-bottom:0}
.grp-label{font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--glow-2);margin-bottom:14px;display:block}
.opt-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.opt{display:flex;align-items:flex-start;gap:11px;padding:13px 15px;border:1px solid var(--line);border-radius:10px;cursor:pointer;transition:border-color .2s,background .2s}
.opt:hover{border-color:color-mix(in srgb,var(--glow) 50%,transparent)}
.opt input{accent-color:var(--glow);width:16px;height:16px;cursor:pointer;flex-shrink:0;margin-top:2px}
.opt.sel{border-color:var(--glow);background:color-mix(in srgb,var(--glow) 12%,transparent)}
.opt .otxt{flex:1;display:flex;flex-direction:column;gap:3px;min-width:0}
.opt .ot{font-size:14px;font-weight:500;color:var(--ink);line-height:1.25}
.opt .od{font-size:12px;color:var(--muted);line-height:1.35}
.opt .op{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--faint);flex-shrink:0;margin-top:2px}
.cotiza-result{border:1px solid var(--line);border-radius:18px;padding:34px;background:var(--surface-2);position:sticky;top:90px}
.cotiza-result .rlabel{font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--glow-2)}
.cotiza-result .monto{font-family:'Space Grotesk',sans-serif;font-size:2.5rem;font-weight:600;margin:12px 0 4px;line-height:1}
.cotiza-result .usd{font-family:'JetBrains Mono',monospace;font-size:14px;color:var(--muted);margin-bottom:8px}
.cotiza-result .aviso{font-size:12.5px;color:var(--faint);margin:18px 0 0;border-top:1px solid var(--line-soft);padding-top:18px}
.cotiza-result ul{list-style:none;margin:0 0 20px;font-size:13px}
.cotiza-result ul li{display:flex;justify-content:space-between;gap:14px;padding:7px 0;color:var(--muted);border-bottom:1px solid var(--line-soft)}
.cotiza-result ul li span:last-child{font-family:'JetBrains Mono',monospace;color:var(--ink);white-space:nowrap}
.cotiza-result .btn{width:100%;justify-content:center}
.nota-apoyo{
  display:flex;gap:10px;align-items:flex-start;font-size:13px;color:var(--ink);
  border:1px solid color-mix(in srgb,var(--glow) 45%,transparent);
  background:color-mix(in srgb,var(--glow) 10%,transparent);
  border-radius:10px;padding:13px 15px;margin-bottom:20px;
}
.nota-apoyo svg{width:18px;height:18px;color:var(--glow-2);flex-shrink:0;margin-top:1px}
.nota-apoyo b,.resalte{font-weight:600;color:var(--glow-2)}

/* =========================== PORTAFOLIO ========================= */
.port-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.port{
  border:1px solid var(--line);border-radius:16px;overflow:hidden;text-decoration:none;color:inherit;
  background:color-mix(in srgb,var(--surface) 60%,transparent);display:flex;flex-direction:column;
  transition:border-color .3s,transform .3s,box-shadow .3s;
}
.port:hover{border-color:var(--glow);transform:translateY(-5px);box-shadow:0 26px 56px -30px color-mix(in srgb,var(--glow) 85%,transparent)}
.port .vista{
  aspect-ratio:16/10;background:var(--surface-2);position:relative;overflow:hidden;
  display:flex;align-items:center;justify-content:center;border-bottom:1px solid var(--line-soft);
}
.port .vista img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.port:hover .vista img{transform:scale(1.05)}
.port .vista .marcador{
  font-family:'Space Grotesk',sans-serif;font-size:2.6rem;font-weight:700;letter-spacing:.04em;
  color:color-mix(in srgb,var(--glow) 55%,transparent);
}
.port .vista .cinta{
  position:absolute;top:12px;left:12px;font-family:'JetBrains Mono',monospace;font-size:10px;
  letter-spacing:.12em;text-transform:uppercase;padding:5px 10px;border-radius:20px;
  background:linear-gradient(135deg,var(--glow),var(--glow-2));color:#04121f;font-weight:600;
}
.port .cuerpo{padding:22px;display:flex;flex-direction:column;flex:1}
.port .giro{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--glow-2);margin-bottom:10px}
.port h3{font-size:1.16rem;margin-bottom:9px}
.port p{color:var(--muted);font-size:.91rem;margin-bottom:16px;flex:1}
.port .tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:16px}
.port .tags span{font-size:11px;padding:4px 10px;border-radius:20px;border:1px solid var(--line-soft);color:var(--muted)}
.port .ir{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--glow-2);border-top:1px solid var(--line-soft);padding-top:14px}
.port .ir svg{width:15px;height:15px;transition:transform .25s}
.port:hover .ir svg{transform:translate(3px,-3px)}

/* ============================ NOTICIAS ========================== */
.not-filtros{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:26px}
.not-filtros button{
  background:transparent;border:1px solid var(--line);color:var(--muted);cursor:pointer;
  padding:8px 16px;border-radius:20px;font-family:'JetBrains Mono',monospace;font-size:11.5px;
  letter-spacing:.08em;text-transform:uppercase;transition:all .2s;
}
.not-filtros button:hover{border-color:var(--glow);color:var(--ink)}
.not-filtros button.activo{background:linear-gradient(135deg,var(--glow),var(--glow-2));border-color:transparent;color:#04121f;font-weight:600}

.not-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.nota{
  border:1px solid var(--line);border-radius:16px;overflow:hidden;cursor:pointer;
  background:color-mix(in srgb,var(--surface) 60%,transparent);display:flex;flex-direction:column;
  transition:border-color .3s,transform .3s;text-align:left;font-family:inherit;color:inherit;padding:0;
}
.nota:hover{border-color:var(--glow);transform:translateY(-4px)}
.nota .foto{aspect-ratio:16/9;background:var(--surface-2);overflow:hidden;position:relative;border-bottom:1px solid var(--line-soft)}
.nota .foto img{width:100%;height:100%;object-fit:cover}
.nota .foto .sinfoto{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:color-mix(in srgb,var(--glow) 45%,transparent)}
.nota .foto .sinfoto svg{width:46px;height:46px}
.nota .cuerpo{padding:22px;display:flex;flex-direction:column;flex:1}
.nota .meta{display:flex;align-items:center;gap:10px;margin-bottom:12px;flex-wrap:wrap}
.chip{
  font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;
  padding:4px 10px;border-radius:20px;font-weight:600;
}
.chip.promocion{background:color-mix(in srgb,#ffb020 20%,transparent);color:#ffc65c;border:1px solid color-mix(in srgb,#ffb020 40%,transparent)}
.chip.trabajo{background:color-mix(in srgb,var(--glow) 18%,transparent);color:var(--glow-2);border:1px solid var(--line)}
.chip.noticia{background:color-mix(in srgb,#7c5cff 20%,transparent);color:#a992ff;border:1px solid color-mix(in srgb,#7c5cff 40%,transparent)}
.chip.evento{background:color-mix(in srgb,var(--exito) 18%,transparent);color:var(--exito);border:1px solid color-mix(in srgb,var(--exito) 40%,transparent)}
.nota .fecha{font-family:'JetBrains Mono',monospace;font-size:11.5px;color:var(--faint)}
.nota h3{font-size:1.13rem;margin-bottom:9px;line-height:1.25}
.nota p{color:var(--muted);font-size:.91rem;flex:1;margin-bottom:16px}
.nota .leer{display:flex;align-items:center;gap:7px;font-size:13px;font-weight:600;color:var(--glow-2)}
.nota .leer svg{width:15px;height:15px;transition:transform .25s}
.nota:hover .leer svg{transform:translateX(3px)}
.vacio{border:1px dashed var(--line);border-radius:14px;padding:44px;text-align:center;color:var(--muted);grid-column:1/-1}

/* ========================== TESTIMONIOS ========================= */
.tst-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.tst{border:1px solid var(--line);border-radius:var(--r);padding:28px;background:color-mix(in srgb,var(--surface) 52%,transparent)}
.tst .estrellas{color:var(--glow-2);letter-spacing:3px;margin-bottom:16px;font-size:14px}
.tst p{font-size:.95rem;margin-bottom:20px}
.tst .quien{display:flex;align-items:center;gap:12px}
.tst .av{width:40px;height:40px;border-radius:50%;background:color-mix(in srgb,var(--glow) 16%,transparent);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-family:'Space Grotesk',sans-serif;font-weight:600;color:var(--glow-2)}
.tst .quien b{font-size:14px;display:block;font-family:'Space Grotesk',sans-serif}
.tst .quien span{font-size:12px;color:var(--muted)}

/* ============================= AGENDA =========================== */
.agenda-box{
  border:1px solid var(--line);border-radius:20px;padding:52px;text-align:center;
  background:color-mix(in srgb,var(--surface) 62%,transparent);position:relative;overflow:hidden;
}
.agenda-box::before{
  content:"";position:absolute;inset:0;z-index:0;
  background:radial-gradient(600px 300px at 50% 0%,color-mix(in srgb,var(--glow) 16%,transparent),transparent 70%);
}
.agenda-box > *{position:relative;z-index:1}
.agenda-box .pin{display:inline-flex;align-items:center;gap:8px;font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--muted);border:1px solid var(--line);padding:7px 14px;border-radius:30px;margin-bottom:24px}
.agenda-box .pin .vivo{width:8px;height:8px;border-radius:50%;background:var(--exito);box-shadow:0 0 10px var(--exito);animation:latir 2s infinite}
.agenda-box h2{font-size:clamp(1.7rem,3.8vw,2.6rem);margin-bottom:16px}
.agenda-box p{color:var(--muted);max-width:560px;margin:0 auto 30px}
.agenda-box .cta-row{justify-content:center}

/* ========================== FORMULARIO ========================== */
.form-wrap{display:grid;grid-template-columns:.9fr 1.1fr;gap:46px;align-items:start}
.form-aside h2{font-size:clamp(1.7rem,3.8vw,2.5rem);margin:18px 0 18px}
.form-aside p{color:var(--muted);margin-bottom:26px}
.chk{display:flex;gap:12px;align-items:flex-start;margin-bottom:15px;font-size:.94rem;color:var(--muted)}
.chk svg{flex-shrink:0;width:19px;height:19px;color:var(--glow-2);margin-top:2px}
form .field{margin-bottom:17px}
form label{display:block;font-size:12.5px;font-family:'JetBrains Mono',monospace;color:var(--muted);margin-bottom:8px;letter-spacing:.03em}
form input,form select,form textarea{
  width:100%;background:var(--surface-2);border:1px solid var(--line);border-radius:10px;
  padding:13px 15px;color:var(--ink);font-family:'Inter',sans-serif;font-size:14.5px;transition:border-color .2s,box-shadow .2s;
}
form input:focus,form select:focus,form textarea:focus{outline:none;border-color:var(--glow);box-shadow:0 0 0 3px color-mix(in srgb,var(--glow) 18%,transparent)}
form input.malo,form select.malo,form textarea.malo{border-color:#ff5c72}
form textarea{resize:vertical;min-height:96px}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
form .btn{width:100%;justify-content:center;margin-top:6px}
form .btn[disabled]{opacity:.6;cursor:wait}
.form-nota{font-size:12px;color:var(--faint);margin-top:14px;text-align:center}
.form-error{margin-top:14px;border:1px solid #ff5c7255;background:#ff5c7214;border-radius:10px;padding:13px 15px;font-size:13.5px;color:#ff8b9c}
.form-ok{display:none;border:1px solid color-mix(in srgb,var(--exito) 45%,transparent);background:color-mix(in srgb,var(--exito) 10%,transparent);border-radius:14px;padding:30px;text-align:center}
.form-ok.show{display:block}
.form-ok b{font-family:'Space Grotesk',sans-serif;font-size:1.2rem;display:block;margin-bottom:8px}
.form-ok p{color:var(--muted);font-size:14px}

/* ============================ CONTACTO ========================== */
.contact-wrap{display:grid;grid-template-columns:.8fr 1.2fr;gap:26px;align-items:stretch}
.contact-info{border:1px solid var(--line);border-radius:18px;padding:34px;background:color-mix(in srgb,var(--surface) 60%,transparent)}
.contact-info .ci{display:flex;gap:14px;margin-bottom:24px;align-items:flex-start}
.contact-info .ci:last-child{margin-bottom:0}
.contact-info .ci svg{width:20px;height:20px;color:var(--glow-2);flex-shrink:0;margin-top:3px}
.contact-info .ci .lbl{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;margin-bottom:3px}
.contact-info .ci a,.contact-info .ci span{color:var(--ink);text-decoration:none;font-size:15px}
.contact-info .ci a:hover{color:var(--glow-2);text-decoration:underline}
.map-box{border:1px solid var(--line);border-radius:18px;overflow:hidden;min-height:340px}
.map-box iframe{width:100%;height:100%;min-height:340px;border:0;filter:grayscale(.9) contrast(1.05) invert(.92) hue-rotate(180deg)}
html[data-theme="light"] .map-box iframe{filter:grayscale(.4)}

/* ============================= FOOTER =========================== */
footer{border-top:1px solid var(--line);padding:54px 0 30px;margin-top:40px;position:relative;z-index:2;background:color-mix(in srgb,var(--bg) 60%,transparent)}
.foot-grid{display:flex;justify-content:space-between;gap:34px;flex-wrap:wrap;margin-bottom:40px}
.foot-brand .marca{font-size:21px;margin-bottom:14px}
.foot-brand p{color:var(--muted);font-size:14px;max-width:320px}
.foot-col h5{font-family:'JetBrains Mono',monospace;font-size:12px;text-transform:uppercase;letter-spacing:.1em;color:var(--glow-2);margin-bottom:16px}
.foot-col a{display:block;color:var(--ink);text-decoration:none;font-size:14px;margin-bottom:11px;opacity:.78;transition:opacity .2s,color .2s}
.foot-col a:hover{opacity:1;color:var(--glow-2)}
.foot-bottom{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line-soft);padding-top:24px;flex-wrap:wrap;gap:14px}
.foot-bottom p{font-size:12.5px;color:var(--faint);font-family:'JetBrains Mono',monospace}
.socials{display:flex;gap:10px}
.socials a{width:36px;height:36px;border:1px solid var(--line);border-radius:9px;display:flex;align-items:center;justify-content:center;color:var(--ink);transition:border-color .2s,transform .2s,color .2s}
.socials a:hover{border-color:var(--glow);color:var(--glow-2);transform:translateY(-2px)}
.socials svg{width:17px;height:17px}

/* ========================== WHATSAPP FLOTANTE =================== */
.wa-flotante{
  position:fixed;bottom:24px;right:24px;z-index:60;width:56px;height:56px;border-radius:50%;
  background:var(--verde);display:flex;align-items:center;justify-content:center;
  box-shadow:0 12px 32px -8px rgba(37,211,102,.6);transition:transform .25s;
}
.wa-flotante:hover{transform:scale(1.08)}
.wa-flotante svg{width:29px;height:29px;color:#fff}

/* ============================= MODALES ========================== */
.modal-buscar{position:fixed;inset:0;z-index:120;background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:blur(10px);display:none;align-items:flex-start;justify-content:center;padding-top:13vh}
.modal-buscar.show{display:flex}
.caja-buscar{width:min(560px,90vw);background:var(--surface);border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:var(--shadow)}
.caja-buscar input{width:100%;background:transparent;border:none;padding:20px 22px;color:var(--ink);font-size:17px;font-family:'Inter',sans-serif;border-bottom:1px solid var(--line)}
.caja-buscar input:focus{outline:none}
.resultados{max-height:340px;overflow-y:auto}
.resultados a{display:flex;align-items:center;gap:12px;padding:14px 22px;color:var(--ink);text-decoration:none;border-bottom:1px solid var(--line-soft);transition:background .15s}
.resultados a:hover{background:color-mix(in srgb,var(--glow) 12%,transparent)}
.resultados a .k{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--faint);margin-left:auto}
.resultados .nada{padding:22px;color:var(--muted);font-size:14px;text-align:center}

.modal-noticia{position:fixed;inset:0;z-index:130;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(10px);display:none;align-items:flex-start;justify-content:center;padding:6vh 20px;overflow-y:auto}
.modal-noticia.show{display:flex}
.caja-noticia{width:min(760px,100%);background:var(--surface);border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow);position:relative;overflow:hidden}
.caja-noticia .cerrar{position:absolute;top:16px;right:16px;z-index:3;width:38px;height:38px;border-radius:10px;border:1px solid var(--line);background:color-mix(in srgb,var(--bg) 70%,transparent);color:var(--ink);cursor:pointer;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(8px)}
.caja-noticia .cerrar:hover{border-color:var(--glow)}
.caja-noticia .cerrar svg{width:18px;height:18px}
.caja-noticia .portada{width:100%;aspect-ratio:16/8;object-fit:cover;border-bottom:1px solid var(--line-soft)}
.caja-noticia .interior{padding:34px 38px 40px}
.caja-noticia .meta{display:flex;gap:12px;align-items:center;margin-bottom:16px;flex-wrap:wrap}
.caja-noticia h2{font-size:clamp(1.5rem,3.4vw,2.15rem);margin-bottom:16px}
.caja-noticia .resumen{color:var(--ink);font-size:1.05rem;margin-bottom:22px;padding-bottom:22px;border-bottom:1px solid var(--line-soft)}
.caja-noticia .texto p{color:var(--muted);margin-bottom:16px;font-size:.98rem}
.caja-noticia .acciones{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px;padding-top:24px;border-top:1px solid var(--line-soft)}

/* ============================= REVELAR ========================== */
.revelar{opacity:0;transform:translateY(22px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1)}
.revelar.visible{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .revelar{opacity:1;transform:none;transition:none}
  .medallon .anillo{animation:none}
  html{scroll-behavior:auto}
}

/* =========================== RESPONSIVO ========================= */
@media (max-width:1080px){
  .proc-grid{grid-template-columns:repeat(3,1fr)}
  .proc{border-bottom:1px solid var(--line)}
  .proc:nth-child(3n){border-right:none}
}
@media (max-width:980px){
  .hero{padding:126px 0 80px}
  .hero-grid{flex-direction:column-reverse;gap:40px;align-items:flex-start}
  .hero-inner{max-width:100%}
  .medallon{width:250px;height:250px}
  .svc-grid,.tst-grid,.port-grid,.not-grid,.pub-grid,.pub-planes{grid-template-columns:repeat(2,1fr)}
  .cotiza-wrap,.form-wrap,.contact-wrap{grid-template-columns:1fr}
  .cotiza-result{position:static}
  .section-pad{padding:88px 0}
}
@media (max-width:680px){
  .wrap{padding:0 20px}
  .nav{padding:0 20px}
  .nav-links{display:none}
  .menu-btn{display:flex}
  .nav-links.abierto{display:flex;position:absolute;top:70px;left:0;right:0;flex-direction:column;background:var(--bg);border-bottom:1px solid var(--line);padding:22px 20px;gap:18px;align-items:flex-start}
  .medallon{width:200px;height:200px}
  .svc-grid,.tst-grid,.why-grid,.opt-grid,.port-grid,.not-grid,.pub-grid,.pub-planes,.proc-grid{grid-template-columns:1fr}
  .proc{border-right:none!important;padding-right:0}
  .field-row{grid-template-columns:1fr}
  .hero-stats{gap:26px}
  .section-pad{padding:72px 0}
  .agenda-box{padding:34px 22px}
  .cotiza-panel,.cotiza-result,.contact-info{padding:24px}
  .pub-garantia{flex-direction:column;padding:26px 22px;gap:16px}
  .caja-noticia .interior{padding:26px 22px 32px}
  .wa-flotante{bottom:18px;right:18px;width:52px;height:52px}
  .wa-flotante svg{width:26px;height:26px}
}