/* ===== Capa futurista compartida (todas las páginas) ===== */
:root{--fx-glow-c:rgba(31,214,224,.6);--fx-glow-p:rgba(248,54,150,.5);--fx-space:#0e0222}
body{background:#fbf9fd}

/* Barra de progreso y luz de cursor */
.fx-progress{position:fixed;top:0;left:0;height:2px;width:100%;z-index:60;transform-origin:left;transform:scaleX(0);
  background:linear-gradient(90deg,var(--cyan),var(--purple),var(--pink));box-shadow:0 0 14px var(--fx-glow-c)}
.fx-spot{position:fixed;left:0;top:0;width:520px;height:520px;margin:-260px 0 0 -260px;border-radius:50%;pointer-events:none;z-index:1;
  background:radial-gradient(circle,rgba(31,214,224,.10),transparent 60%);mix-blend-mode:multiply;opacity:0;transition:opacity .4s}
@media (hover:hover){.fx-spot.on{opacity:1}}

/* Navegación: vidrio oscuro */
.nav{background:rgba(14,2,34,.84)!important;border-bottom:1px solid transparent;
  border-image:linear-gradient(90deg,transparent,var(--cyan),var(--pink),transparent) 1;
  box-shadow:0 10px 40px -20px rgba(31,214,224,.5)}
.nav .brand-logo{filter:brightness(0) invert(1) drop-shadow(0 0 8px rgba(31,214,224,.6))}
.navlinks a,.nav-direct,.nav-trigger{color:#e7dcf5!important}
.navlinks a:hover,.nav-direct:hover{color:var(--cyan)!important;text-shadow:0 0 10px var(--fx-glow-c)}
.mobile-toggle{color:#fff!important;background:transparent!important;border-color:rgba(31,214,224,.5)!important}
.nav-dropdown{background:rgba(14,2,34,.96)!important;border-color:rgba(31,214,224,.35)!important}
.nav-dropdown a,.nav-dropdown strong{color:#e7dcf5!important}
.nav-dropdown small{color:#b3a4cc!important}
@media (max-width:900px){.navlinks.open{background:rgba(14,2,34,.97)!important;border-color:rgba(31,214,224,.3)!important}}

/* Secciones: rejilla y línea de escaneo */
.section{position:relative}
.section:not(.dark){background-image:linear-gradient(rgba(86,7,148,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(86,7,148,.05) 1px,transparent 1px);background-size:56px 56px}
.section::before{content:"";position:absolute;top:0;left:8%;right:8%;height:1px;pointer-events:none;
  background:linear-gradient(90deg,transparent,var(--cyan),var(--pink),transparent);box-shadow:0 0 12px var(--fx-glow-c);opacity:.7}
.dark{background-color:var(--fx-space)!important;
  background-image:radial-gradient(ellipse 50% 60% at 85% 20%,rgba(31,214,224,.14),transparent 70%),
  radial-gradient(ellipse 40% 50% at 10% 90%,rgba(248,54,150,.16),transparent 70%),
  linear-gradient(rgba(31,214,224,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(31,214,224,.06) 1px,transparent 1px)!important;
  background-size:auto,auto,56px 56px,56px 56px!important}

/* ---------- Primera sección de cada página = escenario ---------- */
:is(html main>section:first-of-type,html main>article>header:first-child){position:relative;overflow:hidden;color:#fff;
  background:
    radial-gradient(ellipse 60% 60% at 78% 42%,rgba(86,7,148,.85),transparent 70%),
    radial-gradient(ellipse 40% 40% at 98% 95%,rgba(248,54,150,.32),transparent 70%),
    radial-gradient(ellipse 50% 50% at 0% 0%,rgba(31,214,224,.18),transparent 70%),
    var(--fx-space)!important}
:is(html main>section:first-of-type,html main>article>header:first-child)::before{content:"";position:absolute;top:auto;left:-50%;right:-50%;bottom:-10%;height:70%;pointer-events:none;z-index:0;opacity:1;box-shadow:none;
  background:none;background-image:linear-gradient(rgba(31,214,224,.35) 1px,transparent 1px),linear-gradient(90deg,rgba(31,214,224,.35) 1px,transparent 1px);
  background-size:60px 60px;transform:perspective(500px) rotateX(62deg);transform-origin:50% 100%;
  -webkit-mask-image:linear-gradient(0deg,#000 10%,transparent 85%);mask-image:linear-gradient(0deg,#000 10%,transparent 85%);
  animation:fxFloor 3s linear infinite}
@keyframes fxFloor{to{background-position:0 60px}}
:is(html main>section:first-of-type,html main>article>header:first-child)::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background:linear-gradient(105deg,transparent 40%,rgba(31,214,224,.14) 50%,transparent 60%);
  background-size:300% 100%;animation:fxSweep 2.6s .4s ease-out both}
@keyframes fxSweep{from{background-position:120% 0}to{background-position:-60% 0}}
:is(html main>section:first-of-type,html main>article>header:first-child)>.wrap,:is(html main>section:first-of-type,html main>article>header:first-child)>div{position:relative;z-index:2}
:is(html main>section:first-of-type,html main>article>header:first-child) h1,:is(html main>section:first-of-type,html main>article>header:first-child) h2,:is(html main>section:first-of-type,html main>article>header:first-child) h3{color:#fff!important;text-shadow:0 0 30px rgba(31,214,224,.3),0 0 60px rgba(86,7,148,.7)}
:is(html main>section:first-of-type,html main>article>header:first-child) .light{background:none!important;-webkit-text-fill-color:currentColor;color:#cdb8ea!important}
:is(html main>section:first-of-type,html main>article>header:first-child) p,:is(html main>section:first-of-type,html main>article>header:first-child) .lead,:is(html main>section:first-of-type,html main>article>header:first-child) li{color:#dccff0}
:is(html main>section:first-of-type,html main>article>header:first-child) .eyebrow,:is(html main>section:first-of-type,html main>article>header:first-child) .level-tag{color:var(--cyan)!important;text-shadow:0 0 10px var(--fx-glow-c)}
:is(html main>section:first-of-type,html main>article>header:first-child) .hero-proof{color:#bcaed6}
:is(html main>section:first-of-type,html main>article>header:first-child) .btn.outline{background:rgba(31,214,224,.06);color:#fff;border-color:rgba(31,214,224,.8)}
:is(html main>section:first-of-type,html main>article>header:first-child) .btn.outline:hover{background:rgba(31,214,224,.16);box-shadow:0 0 30px var(--fx-glow-c)}
:is(html main>section:first-of-type,html main>article>header:first-child) .photo-credit{color:var(--cyan);text-shadow:0 0 10px var(--fx-glow-c)}
:is(html main>section:first-of-type,html main>article>header:first-child) .conf-facts span,:is(html main>section:first-of-type,html main>article>header:first-child) .cities span{background:rgba(255,255,255,.06)!important;color:#fff!important;border-color:rgba(31,214,224,.5)!important}
:is(html main>section:first-of-type,html main>article>header:first-child) img{box-shadow:0 0 0 1px rgba(31,214,224,.6),0 0 60px rgba(31,214,224,.28),0 30px 90px rgba(0,0,0,.5)}
:is(html main>section:first-of-type,html main>article>header:first-child) .brand-logo{box-shadow:none}
.fx-particles{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.fx-cursor::after{content:"";display:inline-block;width:.5ch;height:1em;margin-left:4px;vertical-align:-.12em;background:var(--cyan);box-shadow:0 0 10px var(--cyan);animation:fxBlink 1s steps(1) infinite}
@keyframes fxBlink{50%{opacity:0}}

/* Red del diamante del home */
.hero-net .net-lines path{stroke:var(--cyan)!important;stroke-opacity:.7;filter:drop-shadow(0 0 5px var(--cyan));stroke-dasharray:6 5;animation:fxDash 12s linear infinite}
.hero-net .net-nodes circle{fill:var(--cyan)!important;filter:drop-shadow(0 0 8px var(--cyan));animation:fxPulse 2.6s ease-in-out infinite}
.hero-net .net-nodes circle:nth-child(3n){fill:var(--pink)!important;filter:drop-shadow(0 0 8px var(--pink));animation-delay:.9s}
.hero-net .net-nodes circle:nth-child(3n+1){animation-delay:1.8s}
@keyframes fxDash{to{stroke-dashoffset:-220}}
@keyframes fxPulse{50%{opacity:.3}}

/* Foto holograma del home */
.hero-photo{position:relative}
.hero-collage{position:relative}
.hero-collage::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;
  background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(31,214,224,.09) 3px 4px),linear-gradient(180deg,transparent 55%,rgba(31,214,224,.22));mix-blend-mode:screen}
.hero-collage::before{content:"";position:absolute;left:0;right:0;height:18%;top:-20%;z-index:2;pointer-events:none;
  background:linear-gradient(180deg,transparent,rgba(31,214,224,.28),transparent);animation:fxScan 5s 2.2s linear infinite}
@keyframes fxScan{to{top:105%}}
.fx-hud{position:absolute;inset:-14px;pointer-events:none;z-index:3}
.fx-hud i{position:absolute;width:26px;height:26px;border:2px solid var(--cyan);filter:drop-shadow(0 0 6px var(--cyan))}
.fx-hud i:nth-child(1){top:0;left:0;border-right:0;border-bottom:0}
.fx-hud i:nth-child(2){top:0;right:0;border-left:0;border-bottom:0}
.fx-hud i:nth-child(3){bottom:0;left:0;border-right:0;border-top:0}
.fx-hud i:nth-child(4){bottom:0;right:0;border-left:0;border-top:0}
.fx-ring{position:absolute;left:50%;top:50%;width:118%;aspect-ratio:1;transform:translate(-50%,-50%);z-index:0;pointer-events:none;
  border-radius:50%;border:1px dashed rgba(31,214,224,.45);animation:fxSpin 40s linear infinite}
.fx-ring::before{content:"";position:absolute;inset:8%;border-radius:50%;border:1px solid rgba(248,54,150,.25);border-top-color:var(--pink);animation:fxSpin2 9s linear infinite}
@keyframes fxSpin{to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes fxSpin2{to{transform:rotate(-360deg)}}
.fx-chip{position:absolute;z-index:4;font-size:11px;font-weight:700;letter-spacing:.04em;color:#fff;padding:8px 12px;
  background:rgba(14,2,34,.78);border:1px solid rgba(31,214,224,.6);box-shadow:0 0 20px rgba(31,214,224,.25);animation:fxFloat 5s ease-in-out infinite}
.fx-chip b{color:var(--cyan);display:block;font-size:10px;font-weight:800}
.fx-chip.c1{top:10%;right:-6%}
.fx-chip.c2{bottom:16%;left:-8%;border-color:rgba(248,54,150,.6);animation-delay:1.5s}
.fx-chip.c2 b{color:var(--pink)}
@keyframes fxFloat{50%{transform:translateY(-8px)}}

/* Títulos con degradado de luz */
h2 .light{background:linear-gradient(90deg,var(--purple),var(--pink) 55%,var(--cyan));-webkit-background-clip:text;background-clip:text;color:transparent!important}
.dark h2 .light{background:linear-gradient(90deg,#cdb8ea,var(--cyan));-webkit-background-clip:text;background-clip:text}

/* Eyebrow con indicador */
.eyebrow::before{content:"";display:inline-block;width:6px;height:6px;margin-right:10px;vertical-align:middle;
  background:var(--cyan);transform:rotate(45deg) translateY(-1px);box-shadow:0 0 10px var(--cyan)}

/* Botones */
.btn{background-image:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.5) 50%,transparent 65%);
  background-size:260% 100%;background-position:130% 0;background-repeat:no-repeat;
  box-shadow:0 0 18px -4px var(--fx-glow-p);transition:transform .2s,box-shadow .3s,background-position .6s}
.btn:hover{background-position:-30% 0;box-shadow:0 0 34px 2px var(--fx-glow-p);transform:translateY(-1px)}
.btn.outline{background-image:none;box-shadow:none}

/* Tarjetas: borde de luz y esquinas HUD */
.path,.card,.dc-card,.challenge,.enterprise-grid article,.quote,.resource,.format,.show-points div,.journey div,.alliance{
  position:relative;border:1px solid transparent!important;
  background:linear-gradient(rgba(255,255,255,.9),rgba(255,255,255,.9)) padding-box,
             linear-gradient(135deg,rgba(31,214,224,.9),#e6ddea 30%,#e6ddea 70%,rgba(248,54,150,.85)) border-box!important}
.dark .card,.dark .quote,.dark .resource,.dark .format{background:linear-gradient(rgba(20,6,46,.85),rgba(20,6,46,.85)) padding-box,
  linear-gradient(135deg,rgba(31,214,224,.9),rgba(255,255,255,.1) 30%,rgba(255,255,255,.1) 70%,rgba(248,54,150,.85)) border-box!important}
.path::before,.card::before,.dc-card::before,.challenge::before,.enterprise-grid article::before,.resource::before{
  content:"";position:absolute;top:10px;left:10px;width:16px;height:16px;border-top:2px solid var(--cyan);border-left:2px solid var(--cyan);
  border-radius:4px 0 0 0;opacity:.8;transition:all .35s;pointer-events:none}
.path::after,.card::after,.dc-card::after,.challenge::after,.enterprise-grid article::after,.resource::after{
  content:"";position:absolute;bottom:10px;right:10px;width:16px;height:16px;border-bottom:2px solid var(--pink);border-right:2px solid var(--pink);
  border-radius:0 0 4px 0;opacity:.8;transition:all .35s;pointer-events:none}
.path:hover::before,.card:hover::before,.dc-card:hover::before,.challenge:hover::before,.enterprise-grid article:hover::before,.resource:hover::before{width:40px;height:40px;opacity:1;filter:drop-shadow(0 0 6px var(--cyan))}
.path:hover::after,.card:hover::after,.dc-card:hover::after,.challenge:hover::after,.enterprise-grid article:hover::after,.resource:hover::after{width:40px;height:40px;opacity:1;filter:drop-shadow(0 0 6px var(--pink))}
.path:hover,.card:hover,.dc-card:hover,.challenge:hover,.enterprise-grid article:hover,.resource:hover,.format:hover{
  box-shadow:0 0 0 1px rgba(31,214,224,.4),0 24px 60px -20px rgba(86,7,148,.5),0 0 50px -10px var(--fx-glow-c)}
.step-card{box-shadow:inset 0 0 0 1px rgba(31,214,224,.45),0 0 30px -14px var(--fx-glow-c)}
.step-card:hover{box-shadow:inset 0 0 0 1px rgba(31,214,224,.85),0 0 50px -8px var(--fx-glow-c)}
.path-no,.challenge-no{color:var(--cyan)!important;text-shadow:0 0 14px var(--fx-glow-c)}

/* Formularios con luz */
.proposal-form input:focus,.proposal-form select:focus,.proposal-form textarea:focus{outline:none;border-color:var(--cyan)!important;box-shadow:0 0 0 3px rgba(31,214,224,.2),0 0 20px rgba(31,214,224,.25)}

/* Cifras, diamantes, fotos */
.stat strong{background:linear-gradient(90deg,var(--purple),var(--pink) 60%,var(--cyan));-webkit-background-clip:text;background-clip:text;color:transparent}
.fill-diamond,.separator .diamond,.diamond{filter:drop-shadow(0 0 8px rgba(31,214,224,.7))}
.separator:before,.separator:after{background:linear-gradient(90deg,transparent,var(--cyan),transparent)!important;box-shadow:0 0 10px var(--fx-glow-c)}
.nia-img,.method-img,.incompany-photo img,.gallery img,.book-band img{box-shadow:0 0 0 1px rgba(31,214,224,.6),0 0 50px rgba(31,214,224,.28)}
.faq-list details{border-color:rgba(31,214,224,.35)!important}
.faq-list details[open] summary{color:var(--purple);text-shadow:0 0 12px rgba(31,214,224,.35)}

/* WhatsApp, cierre y pie */
.wa-float{animation:fxRing 2.6s ease-out infinite}
@keyframes fxRing{0%{box-shadow:0 0 0 0 rgba(31,214,224,.6)}100%{box-shadow:0 0 0 20px rgba(31,214,224,0)}}
.closing{position:relative;background:radial-gradient(ellipse 60% 70% at 50% 100%,rgba(86,7,148,.22),transparent 70%)}
.footer{background:var(--fx-space)!important;border-top:1px solid rgba(31,214,224,.35)}

/* Aparición tipo materialización */
.js-anim .reveal{filter:blur(6px)}
.js-anim .reveal.in{filter:none;transition:filter .9s ease,opacity .9s ease,transform .9s ease}

/* ---------- Versión ligera para celular ---------- */
@media (max-width:760px){
  :is(html main>section:first-of-type,html main>article>header:first-child)::before{animation:none;opacity:.6}
  .fx-ring,.fx-ring::before,.fx-chip,.hero-net .net-lines path{animation:none!important}
  .fx-spot{display:none}
  .js-anim .reveal{filter:none}
  .fx-chip.c1{right:0}.fx-chip.c2{left:0}
  .fx-hud{inset:-8px}
}
@media (prefers-reduced-motion:reduce){
  :is(html main>section:first-of-type,html main>article>header:first-child)::before,:is(html main>section:first-of-type,html main>article>header:first-child)::after,.hero-collage::before,.hero-net .net-lines path,.hero-net .net-nodes circle,
  .wa-float,.fx-ring,.fx-ring::before,.fx-chip,.fx-cursor::after{animation:none!important}
  .hero-collage::before,.fx-particles{display:none}
  .js-anim .reveal{filter:none}
}
/* ===== Marcos HUD en fotos y anillo en primeras secciones ===== */
img.fx-corners{padding:8px;box-sizing:border-box;
  background:
    linear-gradient(var(--cyan),var(--cyan)) left top/24px 2px no-repeat,
    linear-gradient(var(--cyan),var(--cyan)) left top/2px 24px no-repeat,
    linear-gradient(var(--cyan),var(--cyan)) right top/24px 2px no-repeat,
    linear-gradient(var(--cyan),var(--cyan)) right top/2px 24px no-repeat,
    linear-gradient(var(--pink),var(--pink)) left bottom/24px 2px no-repeat,
    linear-gradient(var(--pink),var(--pink)) left bottom/2px 24px no-repeat,
    linear-gradient(var(--pink),var(--pink)) right bottom/24px 2px no-repeat,
    linear-gradient(var(--pink),var(--pink)) right bottom/2px 24px no-repeat!important;
  filter:drop-shadow(0 0 6px rgba(31,214,224,.35))}
img.fx-front{position:relative;z-index:1}
.fx-ring.fx-ring-free{width:auto;transform:translate(-50%,-50%)}