/* Volt ecosystem — a 3D world behind readable, static HTML. */
:root{--volt-muted:#97a7ba;--vc-ease:cubic-bezier(.2,.7,.2,1)}
html{scroll-padding-top:100px}

/* ── The world: one layer behind the hero and the services ── */
.vc-experience{position:relative;isolation:isolate;--vc-accent:#3b9cff;--vc-hue:0deg;--journey-progress:0;--nav-index:0}
.vc-world{position:absolute;inset:0;z-index:0;pointer-events:none}
.vc-world-frame{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:radial-gradient(ellipse 50% 55% at 72% 54%,#0f2a4630,transparent 72%)}
/* Scrim: the text column always sits on dark, the world breathes on the right. */
.vc-world-frame::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,#06080b 0%,#06080bf2 22%,#06080b9e 40%,#06080b00 58%),linear-gradient(180deg,#06080bb8 0,#06080b00 20%,#06080b00 74%,#06080b 100%)}
#vc-scene{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity 1.4s var(--vc-ease)}
#vc-scene-poster{position:absolute;top:15%;right:3%;width:min(52%,760px);height:70%;object-fit:contain;filter:hue-rotate(var(--vc-hue));transition:opacity .8s,filter .6s}
.vc-3d-ready #vc-scene{opacity:1}.vc-3d-ready #vc-scene-poster{opacity:0}
.vc-world-hud,.vc-world-bottom{position:absolute;z-index:2;right:max(28px,calc(50% - 592px));font:10px 'JetBrains Mono',monospace;color:#7d93aa}
.vc-world-hud{top:100px;display:flex;align-items:center;gap:12px;letter-spacing:.16em;text-transform:uppercase}
.vc-world-hud b{font-weight:400;color:var(--vc-accent);transition:color .6s}
#vc-scene-name{color:#c9d8e8}
.vc-live-dot{width:6px;height:6px;border-radius:50%;background:var(--vc-accent);box-shadow:0 0 12px var(--vc-accent);transition:background .6s,box-shadow .6s}
.vc-world-bottom{bottom:104px;max-width:240px;text-align:right;line-height:1.7;letter-spacing:.04em;color:#6c7f94}

/* ── Content sits above the world, aligned with every other section ── */
.vc-new-hero,.vc-journey,.vc-stack{position:relative;z-index:1;max-width:1240px;margin:0 auto;padding-left:28px;padding-right:28px}
.vc-hero-poster,.vc-chapter-poster{display:none}

.vc-new-hero{min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding-top:132px;padding-bottom:64px}
.vc-hero-copy{max-width:640px}
.vc-hero-copy h1{font-size:clamp(40px,4.3vw,62px)!important;line-height:1.05!important;letter-spacing:-.055em!important}
.vc-hero-copy h1 br{display:none}.vc-hero-copy h1 span:last-child{display:block;margin-top:10px}
.vc-hero-copy>p{font-size:16.5px!important;line-height:1.75!important;max-width:470px!important}
.vc-hero-copy>div:has(>.p3){gap:10px!important}.vc-hero-copy .p3,.vc-hero-copy .p4{font-size:13.5px!important;padding:14px 20px!important}
.vc-hero-copy .p4{background:#06080b80;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.vc-hero-stats{gap:18px!important;margin-top:34px!important}.vc-hero-stats>div>div:first-child{font-size:23px!important}.vc-hero-stats>div>div:last-child{font-size:10.5px!important;max-width:140px;line-height:1.6}
.vc-scroll-cue{display:inline-flex;align-items:center;gap:13px;margin-top:44px;font:10px 'JetBrains Mono',monospace;letter-spacing:.1em;text-transform:uppercase;color:#7f92a8;width:max-content;transition:color .3s}
.vc-scroll-cue:hover{color:#dbe8f7}
.vc-scroll-cue>span:first-child{display:grid;place-items:center;width:26px;height:40px;border:1px solid #415774;border-radius:20px;color:var(--vc-accent);overflow:hidden}
.vc-cue-arrow{display:block;font-size:12px}

/* ── Services journey ── */
.vc-journey{padding-top:80px}
.vc-journey-heading{max-width:600px;padding-bottom:32px}
.vc-kicker{display:flex;flex-wrap:wrap;align-items:center;gap:14px;font:10px 'JetBrains Mono',monospace;letter-spacing:.14em;text-transform:uppercase;color:#72b9ff}
.vc-journey h2{font:600 clamp(36px,4vw,56px)/1.05 'Space Grotesk',sans-serif;letter-spacing:-.045em;color:#f0f5fc;margin:20px 0}
.vc-journey-heading p{color:var(--volt-muted);font-size:15px;line-height:1.75;max-width:400px;margin:0}

/* Chapter index: glass bar, sliding marker for the active service, overall progress on top. */
.vc-chapter-nav{position:sticky;top:84px;z-index:5;display:flex;max-width:600px;border:1px solid #ffffff14;border-radius:14px;background:#080b10a6;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);overflow:hidden;box-shadow:0 18px 40px #0000004d}
.vc-chapter-nav::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--vc-accent);opacity:.6;transform-origin:0 50%;transform:scaleX(var(--journey-progress));transition:background .6s}
.vc-chapter-nav::after{content:"";position:absolute;left:0;bottom:0;width:25%;height:2px;background:var(--vc-accent);box-shadow:0 0 14px var(--vc-accent);transform:translateX(calc(var(--nav-index) * 100%));transition:transform .55s var(--vc-ease),background .6s,opacity .3s}
.vc-chapter-nav:not(:has([aria-current]))::after{opacity:0}
.vc-chapter-nav a{flex:1;display:flex;flex-direction:column;gap:6px;padding:14px 16px;color:#8392a5;font-size:12px;font-weight:600;transition:color .3s,background-color .3s}
.vc-chapter-nav a:hover{color:#dbe8f7;background:#ffffff08}
.vc-chapter-nav a>span:first-child{font:10px 'JetBrains Mono',monospace;color:#56657a;transition:color .3s}
.vc-chapter-nav a[aria-current]{color:#fff}.vc-chapter-nav a[aria-current]>span:first-child{color:var(--vc-accent)}

/* Each service gets a full screen, its own colour and a ghost index behind the copy. */
.vc-chapter{position:relative;isolation:isolate;min-height:100vh;min-height:100svh;display:flex;align-items:center;scroll-margin-top:40px}
.vc-chapter[data-chapter="0"]{--accent:#3b9cff}.vc-chapter[data-chapter="1"]{--accent:#22d3ee}.vc-chapter[data-chapter="2"]{--accent:#34d399}.vc-chapter[data-chapter="3"]{--accent:#a78bfa}
.vc-chapter::before{content:attr(data-num);position:absolute;z-index:-1;left:-.06em;top:50%;transform:translateY(-60%);font:700 clamp(220px,25vw,370px)/.8 'Space Grotesk',sans-serif;letter-spacing:-.07em;color:transparent;-webkit-text-stroke:1px #7fb4ff24;-webkit-text-stroke:1px color-mix(in srgb,var(--accent) 24%,transparent);pointer-events:none;user-select:none}
.vc-chapter-copy{max-width:580px;padding:96px 0}
.vc-chapter .vc-kicker{color:var(--accent)}
.vc-chapter .vc-kicker::before{content:"";width:28px;height:1px;background:currentColor;box-shadow:0 0 10px currentColor}
.vc-chapter h3{font:500 clamp(34px,3.7vw,54px)/1.08 'Space Grotesk',sans-serif;letter-spacing:-.04em;margin:22px 0;color:#f2f7ff;text-wrap:balance}
.vc-chapter-copy>p{color:#a7b5c6;line-height:1.8;font-size:16.5px;max-width:470px;margin:0}
.vc-service-tags{display:flex;flex-wrap:wrap;gap:9px;margin:26px 0 30px}
.vc-service-tags span{font:10.5px 'JetBrains Mono',monospace;padding:7px 10px;border:1px solid #88baff2e;border-color:color-mix(in srgb,var(--accent) 32%,transparent);background:color-mix(in srgb,var(--accent) 7%,transparent);border-radius:6px;color:#c3d3e6}
.vc-service-link{display:inline-flex;align-items:center;gap:28px;color:#e5f1ff;font-size:14.5px;font-weight:600;padding:13px 0;border-bottom:1px solid var(--accent);transition:gap .3s var(--vc-ease),color .3s}
.vc-service-link:hover{gap:40px;color:var(--accent)}

/* ── Stack band (it used to weigh down Desarrollo) ── */
.vc-stack{padding-top:24px;padding-bottom:64px}
.vc-stack-title{font:10.5px 'JetBrains Mono',monospace;letter-spacing:.16em;color:#66727f;text-transform:uppercase;margin-bottom:16px}
.vc-marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.vc-marquee-track{display:flex;width:max-content;animation:vcMarquee 45s linear infinite}
.vc-marquee:hover .vc-marquee-track{animation-play-state:paused}
.vc-marquee-list{display:flex;gap:10px;margin:0;padding:0 10px 0 0;list-style:none}
.vc-marquee-list li{padding:9px 14px;border:1px solid #ffffff14;border-radius:9px;font:12px 'JetBrains Mono',monospace;color:#9aa8b8;background:#ffffff05;white-space:nowrap;transition:color .25s,border-color .25s,background-color .25s}
.vc-marquee-list li:hover{color:#fff;border-color:#3b9cff73;background:#3b9cff12}
@keyframes vcMarquee{to{transform:translateX(-50%)}}

/* ── Sections below keep their inline design; these are refinements ── */
#porque,#precios,#cotizar{padding-top:110px!important}#porque h2,#precios h2{font-weight:500!important;letter-spacing:-.04em!important;max-width:730px}
.vc-gar-grid>div{background:transparent!important;border-width:1px 0 0!important;border-radius:0!important}
.vc-aviso{border-color:#349fff25!important;background:linear-gradient(100deg,#2f8fff0b,transparent)!important}.vc-aviso>span:first-child{color:#7fc0ff!important;border-color:#7fc0ff40!important}.vc-aviso-cta>a{background:#80bfff!important;color:#061322!important}
.vc-header{transition:background-color .4s,border-color .4s,box-shadow .4s}
.vc-header:not(.is-scrolled){background-color:#06080b4d!important;border-bottom-color:transparent!important}
.vc-header.is-scrolled{box-shadow:0 12px 32px #00000059}
/* A light sweep across primary buttons; it paints between the gradient and the label. */
.p3,.p5{position:relative;overflow:hidden;isolation:isolate}
.p3::after,.p5::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(105deg,transparent 35%,#ffffff70 50%,transparent 65%);transform:translateX(-110%);transition:transform .8s var(--vc-ease)}
.p3:hover::after,.p5:hover::after{transform:translateX(110%)}
.vc-lift{transition:translate .4s var(--vc-ease),border-color .4s,box-shadow .4s}
.vc-lift:hover{translate:0 -5px;border-color:#5baaff73!important;box-shadow:0 24px 60px #00000066}
.vc-faq{transition:border-color .3s}.vc-faq:hover,.vc-faq[open]{border-color:#3b9cff4d!important}

/* ── Motion (only with html.vc-motion: JS present and no reduced-motion preference) ── */
@keyframes vcRise{from{opacity:0;transform:translate3d(0,26px,0)}to{opacity:1;transform:none}}
@keyframes vcCue{0%{transform:translateY(-12px);opacity:0}35%{opacity:1}70%,100%{transform:translateY(10px);opacity:0}}
@keyframes vcBlink{50%{opacity:.35}}
@keyframes vcSheen{to{background-position:100% 0}}
.vc-motion [data-reveal]{opacity:0}
.vc-motion [data-reveal].is-in{opacity:1;animation:vcRise .9s var(--vc-ease) backwards;animation-delay:calc(var(--d,0) * 90ms)}
[data-reveal="1"]{--d:1}[data-reveal="2"]{--d:2}[data-reveal="3"]{--d:3}[data-reveal="4"]{--d:4}
.vc-faq:nth-child(2){--d:1}.vc-faq:nth-child(3){--d:2}.vc-faq:nth-child(4){--d:3}.vc-faq:nth-child(5){--d:4}
.vc-motion .vc-hero-copy>*,.vc-motion .vc-scroll-cue{animation:vcRise 1s var(--vc-ease) backwards}
.vc-motion .vc-hero-copy>:nth-child(2){animation-delay:.1s}.vc-motion .vc-hero-copy>:nth-child(3){animation-delay:.22s}
.vc-motion .vc-hero-copy>:nth-child(4){animation-delay:.32s}.vc-motion .vc-hero-copy>:nth-child(5){animation-delay:.44s}.vc-motion .vc-scroll-cue{animation-delay:.6s}
.vc-motion .vc-hero-copy h1 span:last-child{background-image:linear-gradient(100deg,#7fc0ff,#1e90ff 30%,#0b5fbf 50%,#1e90ff 70%,#7fc0ff)!important;background-size:200% 100%!important;animation:vcSheen 8s ease-in-out infinite alternate}
.vc-motion .vc-cue-arrow{animation:vcCue 2.2s var(--vc-ease) infinite}
.vc-motion .vc-live-dot{animation:vcBlink 2.4s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){.vc-marquee-track{animation:none;width:auto}.vc-marquee-list{flex-wrap:wrap}.vc-marquee-list[aria-hidden]{display:none}.vc-marquee{-webkit-mask-image:none;mask-image:none}}

/* ── Desktop sizes ── */
@media(min-width:861px){
 .vc-experience{margin-top:-67px}/* the world also runs under the translucent header */
 .vc-hero-stats{display:grid!important;grid-template-columns:repeat(3,1fr);gap:14px!important}.vc-hero-stats .vc-stat-sep{display:none}
}
@media(min-width:861px) and (max-height:760px){.vc-new-hero{padding-top:104px}.vc-hero-copy h1{font-size:clamp(38px,4vw,55px)!important}.vc-world-hud{top:84px}.vc-world-bottom{bottom:88px}.vc-chapter-copy{padding:72px 0}}
@media(min-width:861px) and (max-width:1100px){
 .vc-world-frame::after{background:linear-gradient(90deg,#06080b 0%,#06080bf2 34%,#06080bb3 52%,#06080b33 72%),linear-gradient(180deg,#06080bb8 0,#06080b00 20%,#06080b00 74%,#06080b 100%)}
 .vc-hero-stats{gap:12px!important}.vc-head{gap:18px!important}.vc-nav{gap:18px!important}.vc-head-wa{display:none!important}
}

/* ── Mobile: no WebGL; the illustrations become a dimmed backdrop instead of pushing content ── */
@media(max-width:860px){
 .vc-world{display:none}
 .vc-new-hero{min-height:0;padding-top:44px;padding-bottom:36px;isolation:isolate;overflow:clip}
 .vc-hero-copy h1{font-size:clamp(35px,8vw,54px)!important;max-width:630px}
 .vc-hero-copy>p{font-size:15px!important;max-width:540px!important}
 .vc-hero-copy>div:first-child{font-size:9px!important}
 .vc-hero-stats{display:grid!important;grid-template-columns:repeat(3,1fr);gap:12px!important;margin-top:28px!important}.vc-hero-stats .vc-stat-sep{display:none}.vc-hero-stats>div>div:last-child{max-width:110px}
 .vc-hero-poster,.vc-chapter-poster{display:block;position:absolute;z-index:-1;height:auto;opacity:.24;pointer-events:none;-webkit-mask-image:radial-gradient(closest-side,#000 50%,transparent);mask-image:radial-gradient(closest-side,#000 50%,transparent)}
 .vc-hero-poster{top:-20px;right:-34%;width:min(125%,640px)}
 .vc-chapter-poster{top:0;right:-30%;width:min(110%,540px);filter:hue-rotate(var(--hue,0deg))}
 .vc-chapter[data-chapter="1"]{--hue:-23deg}.vc-chapter[data-chapter="2"]{--hue:-51deg}.vc-chapter[data-chapter="3"]{--hue:44deg}
 .vc-scroll-cue{margin-top:28px}
 .vc-journey-heading{padding-bottom:20px}.vc-journey h2{font-size:38px!important;max-width:420px}.vc-journey-heading p{max-width:460px}
 .vc-chapter-nav{top:62px;max-width:none;border-radius:12px}.vc-chapter-nav a{padding:12px 10px;font-size:11px}
 .vc-chapter{min-height:0;overflow:clip;border-bottom:1px solid #ffffff12;scroll-margin-top:70px}
 .vc-chapter::before{display:none}
 .vc-chapter-copy{max-width:none;padding:56px 0 48px}
 .vc-chapter h3{font-size:32px!important;max-width:550px;margin:18px 0 16px}
 .vc-chapter-copy>p{max-width:550px;font-size:15px}
 .vc-stack{padding-top:40px;padding-bottom:36px}
 #porque,#precios,#cotizar{padding-top:64px!important}
}
