/* ==========================================================
   COMPOINT · Fondo 3D animado de la portada (v1)
   Solo aplica con <body class="cp-site cp-3d">.
   Toda la portada queda sobre un espacio oscuro con una
   constelación 3D en movimiento; las secciones claras se
   vuelven paneles de vidrio oscuro.
   ========================================================== */

/* tonos claros -> vidrio oscuro (las reglas existentes los usan) */
body.cp-3d{
  --cp-white:rgba(14,36,68,.55); --cp-dk:#e9f1fb; --cp-dkm:#a2b6cd; --cp-dkl:rgba(134,197,255,.16); --cp-ice:transparent;
  --cp-glass:linear-gradient(160deg,rgba(20,48,88,.78),rgba(7,22,44,.72));
  background:#040d1b; color:var(--cp-ink);
}

/* ---------- capa de fondo fija ---------- */
.cp-bg3d{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;
  background:
    radial-gradient(1200px 800px at 85% -10%,#0f2f57 0%,transparent 60%),
    radial-gradient(900px 700px at -10% 45%,#0a2747 0%,transparent 62%),
    linear-gradient(180deg,#061427 0%,#040d1b 55%,#030a16 100%)}
.cp-bg3d canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.cp-aur{position:absolute;inset:-25%;opacity:.85}
.cp-aur i{position:absolute;border-radius:50%;will-change:transform}
.cp-aur i:nth-child(1){width:48vmax;height:48vmax;left:50%;top:-4%;background:radial-gradient(circle,rgba(59,155,255,.42),transparent 66%);animation:cpAur1 28s ease-in-out infinite alternate}
.cp-aur i:nth-child(2){width:40vmax;height:40vmax;left:-4%;top:36%;background:radial-gradient(circle,rgba(47,210,122,.2),transparent 66%);animation:cpAur2 34s ease-in-out infinite alternate}
.cp-aur i:nth-child(3){width:54vmax;height:54vmax;left:38%;top:60%;background:radial-gradient(circle,rgba(70,96,235,.3),transparent 66%);animation:cpAur3 40s ease-in-out infinite alternate}
@keyframes cpAur1{to{transform:translate(-16vw,12vh) scale(1.15)}}
@keyframes cpAur2{to{transform:translate(20vw,-12vh) scale(1.22)}}
@keyframes cpAur3{to{transform:translate(-12vw,-18vh) scale(.9)}}
.cp-vig{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 35%,transparent 50%,rgba(1,5,12,.6) 100%)}

/* ---------- contenido encima del fondo ---------- */
body.cp-3d .cp-topbar,body.cp-3d section,body.cp-3d .cp-footer{position:relative;z-index:1}
body.cp-3d .cp-topbar{background:rgba(3,10,22,.7);border-bottom:1px solid rgba(134,197,255,.08)}
body.cp-3d .cp-hd{background:rgba(5,16,32,.66);-webkit-backdrop-filter:blur(18px) saturate(150%);backdrop-filter:blur(18px) saturate(150%)}
body.cp-3d .cp-hero,body.cp-3d .cp-dark,body.cp-3d .cp-ice,body.cp-3d .cps,body.cp-3d section[style]{background:transparent!important}
body.cp-3d .cp-sec{color:var(--cp-ink)}
/* línea de luz entre secciones */
body.cp-3d .cp-sec::before,body.cp-3d .cps::before{content:"";position:absolute;left:50%;top:0;width:min(1100px,88%);height:1px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,rgba(134,197,255,.28),rgba(95,174,70,.25),transparent);pointer-events:none}

/* textos */
body.cp-3d .cp-eyebrow,body.cp-3d .cp-tag{color:var(--cp-blue2)}
body.cp-3d .cp-sh h2{background:linear-gradient(180deg,#ffffff 30%,#b9d8ff);-webkit-background-clip:text;background-clip:text;color:transparent}
body.cp-3d .cp-sh p,body.cp-3d .cp-row div span,body.cp-3d .cp-wcard p,body.cp-3d .cp-card>p,body.cp-3d .cp-info p span{color:var(--cp-dkm)}

/* paneles de vidrio */
body.cp-3d .cp-card,body.cp-3d .cp-wcard,body.cp-3d .cp-mini,body.cp-3d .cp-st{
  background:var(--cp-glass);border:1px solid rgba(134,197,255,.16);color:var(--cp-ink);
  box-shadow:0 30px 60px -40px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.07)}
body.cp-3d .cp-wcard:hover{box-shadow:0 34px 60px -30px rgba(59,155,255,.4),inset 0 1px 0 rgba(255,255,255,.1);border-color:rgba(134,197,255,.32)}
body.cp-3d .cp-st:hover,body.cp-3d .cp-card:hover{border-color:rgba(134,197,255,.28)}
body.cp-3d .cp-ri{background:rgba(59,155,255,.14);color:var(--cp-blue2);box-shadow:inset 0 0 0 1px rgba(134,197,255,.22),0 0 22px -6px rgba(59,155,255,.6)}
body.cp-3d .cp-kit-c{background:linear-gradient(160deg,rgba(22,56,104,.92),rgba(6,20,39,.94));border:1px solid rgba(134,197,255,.22);box-shadow:0 50px 80px -40px rgba(0,0,0,.9),0 0 0 1px rgba(95,174,70,.08),0 0 60px -20px rgba(59,155,255,.35)}
body.cp-3d .cp-btn--gl{background:rgba(255,255,255,.06);border-color:rgba(134,197,255,.25);color:var(--cp-ink)!important}
body.cp-3d .cp-btn--pri{box-shadow:0 14px 30px -12px var(--cp-blue),0 0 0 1px rgba(255,255,255,.1) inset}
body.cp-3d .cp-btn--pri:hover{box-shadow:0 18px 40px -12px var(--cp-blue),0 0 30px -6px rgba(59,155,255,.6)}

/* formularios oscuros */
body.cp-3d .cp-f input,body.cp-3d .cp-f select,body.cp-3d .cp-f textarea{background:rgba(3,12,26,.55);border:1px solid rgba(134,197,255,.18);color:var(--cp-ink);color-scheme:dark}
body.cp-3d .cp-f input::placeholder,body.cp-3d .cp-f textarea::placeholder{color:#6f86a3}
body.cp-3d .cp-f input:focus,body.cp-3d .cp-f select:focus,body.cp-3d .cp-f textarea:focus{outline:0;border-color:var(--cp-blue);box-shadow:0 0 0 3px rgba(59,155,255,.22)}
body.cp-3d .cp-f select option{background:#0b2242;color:#e9f1fb}

/* pie */
body.cp-3d .cp-footer{background:rgba(3,9,20,.86);border-top:1px solid rgba(134,197,255,.12)}

/* ---------- entrada al hacer scroll ---------- */
body.cp-3d.cp-rv .cp-rv-el{opacity:0;translate:0 34px;scale:.97;transition:opacity .9s cubic-bezier(.2,.7,.2,1) var(--d,0s),translate .9s cubic-bezier(.2,.7,.2,1) var(--d,0s),scale .9s cubic-bezier(.2,.7,.2,1) var(--d,0s)}
body.cp-3d.cp-rv .cp-rv-el.is-in{opacity:1;translate:0 0;scale:1}

@media (max-width:760px){
  .cp-aur{opacity:.6}
}
@media (prefers-reduced-motion:reduce){
  .cp-aur i{animation:none}
  body.cp-3d.cp-rv .cp-rv-el{opacity:1;translate:none;scale:none;transition:none}
}
