body{margin:0;background:#0B0B0A;font-family:Inter,system-ui,sans-serif}
a{color:#FFBF36}a:hover{color:#FFD27A}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
.nav{background:rgba(11,11,10,0.55);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
@supports (animation-timeline: scroll()){.nav{background:rgba(11,11,10,0);backdrop-filter:none;animation:navbg linear both;animation-timeline:scroll(root);animation-range:0 160px}}
@keyframes navbg{to{background:rgba(11,11,10,0.95);border-bottom-color:rgba(255,255,255,0.08)}}
.btn{transition:transform .3s cubic-bezier(.16,1,.3,1),background-color .3s cubic-bezier(.16,1,.3,1)}
.btn:hover{transform:translateY(-1px)}.btn:active{transform:scale(.98)}
.opt{transition:border-color .25s cubic-bezier(.16,1,.3,1),background-color .25s}
.opt:hover{border-color:#FFBF36;background-color:rgba(255,191,54,0.06)}
.heroA{background-image:linear-gradient(90deg,rgba(11,11,10,0.94) 0%,rgba(11,11,10,0.78) 48%,rgba(11,11,10,0.35) 100%),url(../img/hero.webp);background-size:cover;background-position:center}
.tile-photo{background-image:linear-gradient(180deg,rgba(11,11,10,0.2),rgba(11,11,10,0.92)),url(../img/hero.webp);background-size:cover;background-position:70% 60%}
/* Imagen del hero en capa propia para animar solo transform */
.heroA{position:relative;overflow:hidden;isolation:isolate;background-image:none}
.heroA::before{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(90deg,rgba(11,11,10,0.94) 0%,rgba(11,11,10,0.78) 48%,rgba(11,11,10,0.35) 100%),url(../img/hero.webp);background-size:cover;background-position:center}
:focus-visible{outline:2px solid #FFBF36;outline-offset:3px}
header nav a{background:linear-gradient(#FFBF36,#FFBF36) 0 100%/0 1px no-repeat;padding-bottom:3px;transition:background-size .35s cubic-bezier(.16,1,.3,1),color .25s}
header nav a:hover{background-size:100% 1px;color:#FFFFFF}
.btn span[aria-hidden]{transition:translate .35s cubic-bezier(.16,1,.3,1)}
.btn:hover span[aria-hidden]{translate:3px 0}
.btn{box-shadow:0 0 0 rgba(255,191,54,0)}
.btn[style*="#FFBF36"]:hover{box-shadow:0 10px 30px -10px rgba(255,191,54,0.55)}
.opt span[aria-hidden]{transition:translate .3s cubic-bezier(.16,1,.3,1),color .3s}
.opt:hover span[aria-hidden]{translate:4px 0;color:#FFBF36}
#casos article{transition:translate .5s cubic-bezier(.16,1,.3,1),border-color .4s,box-shadow .5s}
#casos article:hover{translate:0 -4px;box-shadow:0 24px 50px -24px rgba(0,0,0,0.7)}
.tile-photo{background-image:none!important;background-color:#151514;overflow:hidden;isolation:isolate}
.tile-photo::before{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(180deg,rgba(11,11,10,0.2),rgba(11,11,10,0.92)),url(../img/hero.webp);background-size:cover;background-repeat:no-repeat;background-position:70% 60%;transition:transform 1.2s cubic-bezier(.16,1,.3,1)}
.tile-photo:hover::before{transform:scale(1.06)}
#equipo img{filter:grayscale(0.35) contrast(1.02);transition:filter .6s cubic-bezier(.16,1,.3,1),translate .6s cubic-bezier(.16,1,.3,1)}
#equipo figure:hover img{filter:none;translate:0 -4px}
.progress{position:fixed;top:0;left:0;right:0;height:2px;z-index:60;background:#FFBF36;transform-origin:0 50%;transform:scaleX(0);pointer-events:none}
@media (prefers-reduced-motion: no-preference){
  @keyframes rise{from{opacity:0;transform:translateY(28px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
  @keyframes settle{from{transform:scale(1.08)}to{transform:scale(1)}}
  @keyframes grow{to{transform:scaleX(1)}}
  .heroA::before{animation:settle 2.4s cubic-bezier(.16,1,.3,1) both}
  .hero-in>*{animation:rise .9s cubic-bezier(.16,1,.3,1) both}
  .hero-in>*:nth-child(2){animation-delay:.08s}
  .hero-in>*:nth-child(3){animation-delay:.16s}
  .hero-card{animation:rise 1s cubic-bezier(.16,1,.3,1) .3s both}
  @supports (animation-timeline: view()){
    .progress{animation:grow linear both;animation-timeline:scroll(root)}
    section:not(#inicio) h2,#casos article,#metodo li,#equipo figure,#dudas dl>div,#contacto form,.guarantee{animation:rise linear both;animation-timeline:view();animation-range:entry 0% entry 35%}
  }
}
h1,h2,h3{text-wrap:balance}p{text-wrap:pretty}

/* Carrusel de casos en vídeo */
.vc{padding:104px 0 96px;border-top:1px solid rgba(255,255,255,0.06)}
.vc-head{max-width:1280px;margin:0 auto;padding:0 24px;display:flex;flex-wrap:wrap;gap:24px;align-items:flex-end;justify-content:space-between}
.vc-intro{display:flex;flex-direction:column;gap:12px;max-width:620px}
.vc-intro h2{margin:0;font-family:Outfit,sans-serif;font-weight:600;font-size:44px;line-height:1.1;letter-spacing:-0.02em;color:#fff}
.vc-intro p{margin:0;font-size:17px;line-height:1.6;color:#A3A39C}
.vc-nav{display:flex;gap:10px}
.vc-arrow{width:52px;height:52px;border-radius:50%;border:1px solid #34342F;background:#141412;color:#EDEDEA;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background-color .25s,border-color .25s,color .25s,transform .3s cubic-bezier(.16,1,.3,1)}
.vc-arrow:hover{background:#FFBF36;border-color:#FFBF36;color:#0B0B0A}
.vc-arrow:active{transform:scale(.95)}
.vc-arrow:disabled{opacity:.35;pointer-events:none}
.vc-track{margin-top:40px;display:grid;grid-auto-flow:column;grid-auto-columns:min(340px,78vw);gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding:0 max(24px,calc((100% - 1232px) / 2)) 8px;scroll-padding-inline:max(24px,calc((100% - 1232px) / 2));scrollbar-width:none;overscroll-behavior-x:contain}
.vc-track::-webkit-scrollbar{display:none}
.vc-card{scroll-snap-align:start;display:flex;flex-direction:column;gap:12px;margin:0}
.vc-media{position:relative;aspect-ratio:4/5;border-radius:22px;overflow:hidden;background:#171716;border:1px solid #242422}
.vc-media video{width:100%;height:100%;object-fit:cover;display:block;background:#000;transition:transform 1s cubic-bezier(.16,1,.3,1)}
.vc-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,11,10,0) 45%,rgba(11,11,10,0.75) 100%);pointer-events:none;transition:opacity .3s}
.vc-card:hover .vc-media video{transform:scale(1.04)}
.vc-play{position:absolute;left:16px;bottom:16px;z-index:2;height:48px;padding:0 18px 0 6px;border-radius:999px;border:0;background:rgba(11,11,10,0.72);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:#fff;font:600 14px Inter,system-ui,sans-serif;display:flex;align-items:center;gap:10px;cursor:pointer;transition:transform .3s cubic-bezier(.16,1,.3,1)}
.vc-play:hover{transform:translateY(-1px)}
.vc-play__icon{width:36px;height:36px;border-radius:50%;background:#FFBF36;display:flex;align-items:center;justify-content:center;transition:transform .3s cubic-bezier(.16,1,.3,1)}
.vc-play:hover .vc-play__icon{transform:scale(1.08)}
.vc-card.is-playing .vc-play,.vc-card.is-playing .vc-media::after{opacity:0;pointer-events:none}
.vc-card.is-playing .vc-media video{transform:none;object-fit:contain}
.vc-card h3{margin:4px 0 0;font-family:Outfit,sans-serif;font-size:20px;font-weight:600;line-height:1.25;color:#fff}
.vc-card p{margin:0;font-size:14px;color:#A3A39C}
.vc-note{max-width:1280px;margin:20px auto 0;padding:0 24px;font-size:12px;color:#8C8C86}
@media (prefers-reduced-motion: reduce){.vc-track{scroll-behavior:auto}.vc-media video,.vc-play,.vc-arrow{transition:none}}
@media (max-width:640px){.vc-intro h2{font-size:34px}.vc-nav{display:none}}
/* Carrusel dentro del ancho de contenido, con 3,5 tarjetas visibles */
.vc-track{--vc-gap:18px;--vc-n:3.5;width:min(calc(100% - 48px),1232px);margin:40px auto 0;padding:0 0 8px;scroll-padding-inline:0;gap:var(--vc-gap);grid-auto-columns:calc((100% - (var(--vc-gap) * 3)) / var(--vc-n))}
@media (max-width:1024px){.vc-track{--vc-n:2.5}}
@media (max-width:640px){.vc-track{--vc-n:1.25;--vc-gap:14px;width:calc(100% - 32px)}}
