/* Hero V6 — universo creativo desarrollado en HTML/CSS/SVG, sin imágenes de fondo */
.hero-v6{
  min-height:100svh;
  padding:calc(var(--header) + 24px) 0 34px;
  display:flex;
  align-items:center;
  overflow:hidden;
  isolation:isolate;
  background:
    radial-gradient(circle at 74% 44%,rgba(129,95,255,.34),transparent 24%),
    radial-gradient(circle at 81% 61%,rgba(60,212,255,.22),transparent 26%),
    radial-gradient(circle at 61% 36%,rgba(165,96,255,.18),transparent 25%),
    radial-gradient(circle at 58% 80%,rgba(52,176,255,.12),transparent 31%),
    radial-gradient(circle at 18% 92%,rgba(60,110,255,.08),transparent 26%),
    linear-gradient(180deg,#040915 0%,#060d1b 54%,#071124 100%);
}
.hero-v6::before,
.hero-v6::after{
  content:"";
  position:absolute;
  pointer-events:none;
  inset:auto;
  border-radius:50%;
  filter:blur(22px);
  opacity:.7;
  z-index:-1;
}
.hero-v6::before{
  width:620px;
  height:620px;
  right:-50px;
  top:2%;
  background:radial-gradient(circle,rgba(118,101,255,.32),transparent 68%);
  animation:v6SectionGlow 9s ease-in-out infinite;
}
.hero-v6::after{
  width:440px;
  height:440px;
  right:11%;
  bottom:0;
  background:radial-gradient(circle,rgba(61,208,255,.24),transparent 66%);
  animation:v6SectionGlow 12s ease-in-out infinite reverse;
}
.hero-v6 .hero-grid{
  background-size:58px 58px;
  opacity:.72;
  mask-image:radial-gradient(circle at 72% 48%,#000 0 48%,transparent 84%);
}
.hero-v6 .hero-grid::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 76% 44%,rgba(101,111,255,.18),transparent 0 6px,transparent 7px),
    radial-gradient(circle at 65% 70%,rgba(74,212,255,.16),transparent 0 6px,transparent 7px),
    radial-gradient(circle at 54% 32%,rgba(155,93,255,.18),transparent 0 5px,transparent 6px);
  animation:v6Twinkle 7s linear infinite;
  opacity:.55;
}
.hero-v6-grid{
  display:grid;
  grid-template-columns:minmax(540px,.9fr) minmax(650px,1.1fr);
  gap:22px;
  align-items:center;
  width:min(1320px,calc(100% - 48px));
}
.hero-v6-copy{
  position:relative;
  z-index:7;
  max-width:590px;
}
.hero-v6 .eyebrow{
  margin-bottom:22px;
  color:#91a8d9;
  font-size:.7rem;
  letter-spacing:.17em;
}
.hero-v6-title{
  margin:0;
  font-family:"Space Grotesk",sans-serif;
  font-size:clamp(3.1rem,4.1vw,4.45rem);
  line-height:.98;
  letter-spacing:-.058em;
  font-weight:700;
}
.hero-v6-title span{
  display:block;
  white-space:nowrap;
}
.hero-v6-title .gradient-text{
  background:linear-gradient(96deg,#48a4ff 0%,#647cff 42%,#9a56ff 93%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  filter:drop-shadow(0 0 28px rgba(101,102,255,.19));
}
.hero-v6-lead{
  max-width:585px;
  margin:25px 0 0;
  color:#aab6ce;
  font-size:.98rem;
  line-height:1.72;
}
.hero-v6-actions{
  display:flex;
  align-items:center;
  gap:14px;
  margin-top:28px;
  flex-wrap:nowrap;
}
.hero-v6-actions .button{
  min-height:54px;
  padding:0 21px;
  border-radius:16px;
  font-size:.88rem;
}
.hero-v6-actions .button-primary{
  min-width:185px;
  background:linear-gradient(100deg,#2f7dff 0%,#6a66ff 52%,#9454ff 100%);
  box-shadow:0 18px 44px rgba(56,86,255,.31),inset 0 1px 0 rgba(255,255,255,.2);
}
.hero-v6-actions .button-primary:hover{
  box-shadow:0 20px 54px rgba(56,86,255,.42),0 0 28px rgba(132,81,255,.23);
}
.hero-v6-facts{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:13px;
  margin-top:27px;
}
.hero-v6-facts article{
  min-height:84px;
  display:flex;
  align-items:center;
  gap:13px;
  padding:15px 16px;
  border:1px solid rgba(149,168,230,.14);
  border-radius:18px;
  background:linear-gradient(180deg,rgba(20,30,56,.55),rgba(7,13,27,.46));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 12px 35px rgba(0,0,0,.12);
}
.hero-v6-facts .fact-icon{
  width:39px;
  height:39px;
  flex:0 0 39px;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:#b69eff;
  border:1px solid rgba(146,106,255,.52);
  box-shadow:0 0 18px rgba(128,96,255,.12);
  font-size:.78rem;
}
.hero-v6-facts article:nth-child(2) .fact-icon{
  color:#4cc5ff;
  border-color:rgba(58,187,255,.45);
}
.hero-v6-facts article:nth-child(3) .fact-icon{
  color:#4cd8ff;
  border-color:rgba(57,209,255,.48);
}
.hero-v6-facts strong{
  display:block;
  font-family:"Space Grotesk",sans-serif;
  font-size:.91rem;
}
.hero-v6-facts small{
  display:block;
  margin-top:2px;
  color:#7f8da9;
  font-size:.67rem;
}

.hero-v6-universe{
  position:relative;
  min-height:700px;
  isolation:isolate;
  perspective:1900px;
  transform:translateX(6px);
  --jarvis-intensity:.18;
  --pointer-glow-x:52%;
  --pointer-glow-y:49%;
}
.hero-v6-universe::before,
.hero-v6-universe::after{
  content:"";
  position:absolute;
  inset:14% 8% 10% 10%;
  border-radius:50%;
  pointer-events:none;
  opacity:.55;
  z-index:1;
}
.hero-v6-universe::before{
  background:radial-gradient(circle at var(--pointer-glow-x) var(--pointer-glow-y),rgba(111,101,255,.34),transparent 34%);
  filter:blur(30px);
  animation:v6PulseField 6.8s ease-in-out infinite;
}
.hero-v6-universe::after{
  inset:8% 2% 4% 6%;
  background:radial-gradient(circle at 50% 50%,rgba(60,196,255,.08),transparent 36%);
  filter:blur(50px);
}
.universe-aura{
  position:absolute;
  left:52%;
  top:49%;
  width:700px;
  height:700px;
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:
    radial-gradient(circle,rgba(132,91,255,.38) 0%,rgba(82,119,255,.28) 24%,rgba(55,195,255,.16) 44%,rgba(73,87,214,.1) 57%,transparent 74%);
  filter:blur(16px) saturate(1.25);
  opacity:1;
  animation:v6Aura 5s ease-in-out infinite;
  z-index:-2;
}
.universe-aura::before,
.universe-aura::after{
  content:"";
  position:absolute;
  inset:12%;
  border-radius:50%;
  border:1px solid rgba(115,132,255,.14);
  box-shadow:0 0 42px rgba(108,114,255,.15), inset 0 0 42px rgba(78,171,255,.08);
  animation:v6Radiate 8.5s linear infinite;
}
.universe-aura::after{
  inset:23%;
  border-style:dashed;
  border-color:rgba(126,104,255,.2);
  animation-duration:11s;
  animation-direction:reverse;
}
.universe-orbits{
  position:absolute;
  inset:-3% -5% -3% -5%;
  width:110%;
  height:108%;
  overflow:visible;
  filter:drop-shadow(0 0 12px rgba(108,100,255,.32)) drop-shadow(0 0 24px rgba(77,186,255,.22));
  z-index:0;
}
.orbit-lines{
  transform-box:fill-box;
  transform-origin:center;
  animation:v6OrbitDrift 40s linear infinite;
  opacity:.95;
}
.orbit-lines ellipse,
.orbit-lines path{
  stroke-linecap:round;
  filter:drop-shadow(0 0 6px rgba(112,125,255,.14));
}
.orbit-stars circle,.orbit-micro circle,.orbit-micro rect{
  filter:drop-shadow(0 0 7px currentColor);
}

.universe-core-v6{
  position:absolute;
  left:52%;
  top:49%;
  width:440px;
  height:440px;
  transform:translate(-50%,-50%);
  transform-style:preserve-3d;
  z-index:3;
  transition:transform .18s ease-out, filter .24s ease;
}
.universe-core-v6::before,
.universe-core-v6::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  border-radius:50%;
  pointer-events:none;
  opacity:.45;
}
.universe-core-v6::before{
  width:530px;
  height:530px;
  border:1px solid rgba(116,123,255,.2);
  box-shadow:0 0 32px rgba(104,117,255,.14), inset 0 0 24px rgba(84,188,255,.08);
  animation:v6Radiate 10s linear infinite;
}
.universe-core-v6::after{
  width:466px;
  height:466px;
  border:1px dashed rgba(108,205,255,.18);
  box-shadow:0 0 26px rgba(81,174,255,.1);
  animation:v6Radiate 8s linear infinite reverse;
}
.core-plate{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  border-radius:48px;
  border:1px solid rgba(136,153,255,.28);
  background:linear-gradient(145deg,rgba(112,122,255,.22),rgba(15,23,54,.48));
  backdrop-filter:blur(10px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.09),0 18px 45px rgba(0,0,0,.14),0 0 34px rgba(91,104,255,.14),0 0 70px rgba(77,191,255,.08);
}
.plate-5{width:415px;height:415px;opacity:.36;transform:translate(-50%,-50%) rotate(4deg)}
.plate-4{width:366px;height:366px;opacity:.52;transform:translate(-50%,-50%) rotate(-2deg)}
.plate-3{width:320px;height:320px;opacity:.68;transform:translate(-50%,-50%) rotate(1deg)}
.plate-2{width:272px;height:272px;opacity:.84}
.plate-1{
  width:232px;
  height:232px;
  opacity:.98;
  background:linear-gradient(145deg,rgba(111,124,255,.34),rgba(9,17,42,.88));
  box-shadow:0 0 78px rgba(72,91,255,.34),0 0 128px rgba(145,92,255,.2), inset 0 1px 0 rgba(255,255,255,.14);
}
.core-logo-v6{
  position:absolute;
  left:50%;
  top:50%;
  width:198px;
  height:198px;
  transform:translate(-50%,-50%) translateZ(75px);
  display:grid;
  place-items:center;
  border-radius:48px;
  background:radial-gradient(circle at 48% 42%,rgba(23,43,102,.98),rgba(8,13,30,.98) 72%);
  border:1px solid rgba(128,157,255,.58);
  box-shadow:
    0 24px 70px rgba(0,0,0,.5),
    0 0 86px rgba(54,100,255,.58),
    0 0 136px rgba(142,74,255,.42),
    0 0 176px rgba(76,202,255,.18),
    inset 0 1px 0 rgba(255,255,255,.18);
  animation:v6CoreFloat 5.2s ease-in-out infinite;
  overflow:visible;
}
.core-logo-v6::before{
  content:"";
  position:absolute;
  inset:-12px;
  border-radius:54px;
  padding:2px;
  background:linear-gradient(135deg,#41b7ff 0%,#4a79ff 24%,#8d5eff 58%,#54d9ff 100%);
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  filter:drop-shadow(0 0 26px rgba(95,102,255,.82)) drop-shadow(0 0 38px rgba(76,202,255,.24));
}
.core-logo-v6::after{
  content:"";
  position:absolute;
  inset:18px;
  border-radius:24px;
  border:1px solid rgba(130,153,255,.18);
  box-shadow:inset 0 0 26px rgba(75,104,255,.15), 0 0 36px rgba(77,191,255,.12);
}
.core-logo-v6 .core-scan,
.core-logo-v6 .core-pulse{display:none}
.core-logo-v6 img{
  width:137px;
  height:137px;
  position:relative;
  z-index:2;
  filter:drop-shadow(0 0 16px rgba(255,255,255,.18));
}

.hero-v6-universe .universe-node-v6 strong{position:relative;z-index:2;}
.hero-v6-universe .universe-node-v6 .node-icon-v6{position:relative;z-index:2;}
.universe-node-v6.is-hot::before{opacity:.82;}
.universe-node-v6.is-hot::after{opacity:.9;animation-duration:2.4s;}
.hero-v6-universe.is-radiating .core-logo-v6::before{filter:drop-shadow(0 0 30px rgba(95,102,255,.9)) drop-shadow(0 0 50px rgba(76,202,255,.36));}
.hero-v6-universe.is-radiating .universe-aura{filter:blur(14px) saturate(1.45);}

.universe-node-v6{
  position:absolute;
  z-index:6;
  display:inline-flex;
  align-items:center;
  gap:10px;
  min-height:48px;
  padding:11px 16px;
  border:1px solid rgba(153,170,235,.26);
  border-radius:18px;
  background:linear-gradient(180deg,rgba(21,33,67,.9),rgba(8,14,31,.84));
  backdrop-filter:blur(16px);
  box-shadow:0 14px 34px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.065),0 0 20px rgba(84,114,255,.16),0 0 40px rgba(76,202,255,.06);
  color:#eef3ff;
  font-size:.8rem;
  white-space:nowrap;
  transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease, filter .24s ease;
  animation:v6NodeFloat 6.5s ease-in-out infinite;
  will-change:transform, box-shadow;
  overflow:hidden;
}
.universe-node-v6::before{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:inherit;
  padding:1px;
  background:linear-gradient(135deg,rgba(61,145,255,.98),rgba(132,98,255,.96),rgba(80,225,255,.82));
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  opacity:.5;
}
.universe-node-v6::after{
  content:"";
  position:absolute;
  left:-35%;
  top:0;
  width:34%;
  height:100%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.22),transparent);
  transform:skewX(-22deg);
  animation:v6NodeGlint 6s linear infinite;
  opacity:.55;
}
.universe-node-v6:hover,.universe-node-v6.is-hot{
  transform:translateY(-5px) scale(1.045);
  border-color:rgba(126,156,255,.75);
  box-shadow:0 18px 40px rgba(0,0,0,.29),0 0 28px rgba(76,102,255,.34),0 0 46px rgba(135,92,255,.28),0 0 66px rgba(76,202,255,.18);
  filter:brightness(1.12);
}
.node-icon-v6{
  width:24px;
  height:24px;
  display:grid;
  place-items:center;
  color:#59c5ff;
  filter:drop-shadow(0 0 9px rgba(67,174,255,.34));
}
.node-icon-v6 svg{
  width:22px;
  height:22px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.node-large{padding-inline:18px;font-size:.84rem}
.node-small{padding-inline:14px;font-size:.78rem}
.node-strategy{right:15%;top:10%;animation-delay:-2.1s}
.node-web{right:7%;top:23%;animation-delay:-3.2s}
.node-communication{left:14%;top:47%;animation-delay:-2.6s}
.node-ux{right:6%;top:43%;animation-delay:-.2s}
.node-direction{left:16%;top:66%;animation-delay:-3.7s}
.node-content{right:8%;top:63%;animation-delay:-1.8s}
.node-projects{left:29%;bottom:10%;animation-delay:-2.9s}
.node-ai{left:54%;bottom:4%;animation-delay:-4.1s}
.node-automation{right:8%;bottom:18%;animation-delay:-2.3s}

@keyframes v6Aura{
  0%,100%{transform:translate(-50%,-50%) scale(.96);opacity:.84}
  50%{transform:translate(-50%,-50%) scale(1.06);opacity:1}
}
@keyframes v6SectionGlow{
  0%,100%{transform:scale(.96);opacity:.48}
  50%{transform:scale(1.08);opacity:.82}
}
@keyframes v6PulseField{
  0%,100%{opacity:.42;transform:scale(.95)}
  50%{opacity:.74;transform:scale(1.06)}
}
@keyframes v6Radiate{
  0%{transform:translate(-50%,-50%) rotate(0deg) scale(.96);opacity:.18}
  50%{opacity:.42}
  100%{transform:translate(-50%,-50%) rotate(360deg) scale(1.04);opacity:.18}
}
@keyframes v6OrbitDrift{to{transform:rotate(360deg)}}
@keyframes v6CoreFloat{
  0%,100%{transform:translate(-50%,-50%) translateZ(75px) translateY(0)}
  50%{transform:translate(-50%,-50%) translateZ(75px) translateY(-10px)}
}
@keyframes v6NodeFloat{
  0%,100%{transform:translate3d(0,0,0)}
  25%{transform:translate3d(6px,-4px,0)}
  50%{transform:translate3d(0,-7px,0)}
  75%{transform:translate3d(-6px,-2px,0)}
}
@keyframes v6NodeGlint{
  0%{left:-38%;opacity:0}
  12%{opacity:.12}
  32%{opacity:.55}
  56%{opacity:0}
  100%{left:132%;opacity:0}
}
@keyframes v6Twinkle{
  0%,100%{opacity:.25;transform:translateY(0)}
  50%{opacity:.7;transform:translateY(-4px)}
}


.hero-v6-universe.is-radiating{
  --jarvis-intensity:1;
}
.hero-v6-universe.is-radiating .universe-core-v6::before{
  opacity:.7;
  box-shadow:0 0 44px rgba(98,118,255,.28),0 0 100px rgba(86,201,255,.16), inset 0 0 32px rgba(113,83,255,.12);
}
.hero-v6-universe.is-radiating .universe-core-v6::after{
  opacity:.85;
}
.hero-v6-universe.is-radiating .core-logo-v6{
  box-shadow:0 24px 70px rgba(0,0,0,.5),0 0 80px rgba(54,100,255,.56),0 0 140px rgba(142,74,255,.4),inset 0 1px 0 rgba(255,255,255,.15);
}
.hero-v6-universe.is-radiating .core-plate{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 18px 45px rgba(0,0,0,.12),0 0 38px rgba(91,104,255,.14);
}
.hero-v6-universe.is-radiating .orbit-lines{
  opacity:1;
}
.hero-v6-universe.is-radiating .universe-node-v6{
  box-shadow:0 16px 36px rgba(0,0,0,.24),0 0 24px rgba(73,193,255,.14),0 0 30px rgba(119,102,255,.12), inset 0 1px 0 rgba(255,255,255,.06);
}
@media(max-width:1240px){
  .hero-v6-grid{grid-template-columns:minmax(500px,.92fr) minmax(560px,1.08fr);gap:14px}
  .hero-v6-title{font-size:clamp(3rem,4vw,4.2rem)}
  .hero-v6-universe{transform:scale(.9);transform-origin:center}
  .hero-v6-actions{flex-wrap:wrap}
}
@media(max-width:980px){
  .hero-v6{padding-top:calc(var(--header) + 46px)}
  .hero-v6-grid{grid-template-columns:1fr;width:min(100% - 28px,820px)}
  .hero-v6-copy{max-width:760px}
  .hero-v6-title{font-size:clamp(3rem,7vw,4.7rem)}
  .hero-v6-title span{white-space:normal}
  .hero-v6-universe{min-height:650px;transform:scale(.88);margin-top:-8px}
  .hero-v6-facts{max-width:720px}
}
@media(max-width:640px){
  .hero-v6-title{font-size:clamp(2.55rem,11vw,3.55rem);line-height:.98}
  .hero-v6-lead{font-size:.92rem}
  .hero-v6-actions{display:grid;grid-template-columns:1fr}
  .hero-v6-actions .button{width:100%}
  .hero-v6-facts{grid-template-columns:1fr}
  .hero-v6-universe{min-height:510px;transform:scale(.7);margin-inline:-92px;margin-top:-24px;margin-bottom:-54px}
  .universe-node-v6{font-size:.72rem;padding:9px 13px;min-height:43px}
  .node-icon-v6{width:20px;height:20px}
  .node-icon-v6 svg{width:19px;height:19px}
}

/* Retrato personal integrado únicamente como fondo del hero */
.hero-v6-portrait-bg{
  position:absolute;
  inset:0;
  z-index:-3;
  pointer-events:none;
  background-image:url('../img/hero-diego-futurista.webp');
  background-repeat:no-repeat;
  background-position:center 50%;
  background-size:auto 132%;
  opacity:.12;
  filter:blur(1.35px) brightness(.7) contrast(1.07) saturate(.82) hue-rotate(2deg);
  mix-blend-mode:screen;
  -webkit-mask-image:radial-gradient(ellipse 30% 62% at 50% 44%,#000 0 42%,rgba(0,0,0,.86) 58%,transparent 82%);
  mask-image:radial-gradient(ellipse 30% 62% at 50% 44%,#000 0 42%,rgba(0,0,0,.86) 58%,transparent 82%);
  transform:scale(1.06);
  animation:heroPortraitBreath 9s ease-in-out infinite;
}
.hero-v6-portrait-bg::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 50% 40%,rgba(89,104,255,.24),transparent 30%),
    radial-gradient(circle at 54% 52%,rgba(66,200,255,.12),transparent 28%),
    linear-gradient(90deg,rgba(5,10,22,.76) 0%,rgba(5,10,22,.12) 33%,rgba(5,10,22,.1) 67%,rgba(5,10,22,.58) 100%);
}
@keyframes heroPortraitBreath{
  0%,100%{opacity:.14;transform:scale(1.05) translateY(0)}
  50%{opacity:.19;transform:scale(1.08) translateY(-4px)}
}
@media(max-width:980px){
  .hero-v6-portrait-bg{
    background-position:center 40%;
    background-size:auto 108%;
    opacity:.11;
    -webkit-mask-image:radial-gradient(ellipse 40% 54% at 50% 38%,#000 0 38%,rgba(0,0,0,.8) 57%,transparent 82%);
    mask-image:radial-gradient(ellipse 40% 54% at 50% 38%,#000 0 38%,rgba(0,0,0,.8) 57%,transparent 82%);
  }
}
@media(max-width:640px){
  .hero-v6-portrait-bg{
    background-position:center 34%;
    background-size:auto 90%;
    opacity:.075;
    filter:blur(1.6px) brightness(.62) contrast(1.02) saturate(.62);
  }
}
@media(prefers-reduced-motion:reduce){
  .hero-v6-portrait-bg{animation:none}
}