*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
:root{
  --teal:    oklch(0.74 0.14 210);
  --teal-dk: oklch(0.50 0.13 210);
  --teal-lt: oklch(0.96 0.018 210);
  --mag:     oklch(0.54 0.25 350);
  --mag-dk:  oklch(0.42 0.22 350);
  --navy:    oklch(0.14 0.03 250);
  --off:     oklch(0.97 0.005 90);
  --white:   oklch(0.99 0.002 90);
  --gray:    oklch(0.52 0.008 250);
  --gray-lt: oklch(0.88 0.006 250);
  --display: 'Big Shoulders Display', sans-serif;
  --body:    'Archivo', sans-serif;
  
  
}



html{scroll-behavior:smooth;}
body{font-family:var(--body);background:var(--off);color:var(--navy);overflow-x:hidden;cursor:none;}

/* CURSOR */
#cur{
  position:fixed;z-index:9998;pointer-events:none;
  width:8px;height:8px;background:var(--teal);border-radius:50%;
  transform:translate(-50%,-50%);
  transition:width .25s,height .25s,background .25s;
  will-change:transform;
}
#cur-ring{
  position:fixed;z-index:9997;pointer-events:none;
  width:38px;height:38px;border:1.5px solid var(--teal);border-radius:50%;
  transform:translate(-50%,-50%);
  transition:width .35s cubic-bezier(.22,1,.36,1),height .35s cubic-bezier(.22,1,.36,1),border-color .25s;
  will-change:transform;
}
body.ch #cur{width:18px;height:18px;background:var(--mag);}
body.ch #cur-ring{width:58px;height:58px;border-color:var(--mag);}

/* Cursor personalizado: solo en dispositivos con mouse real.
   En touch (celulares/tablets) no hay puntero que reemplazar. */
@media (hover:none), (pointer:coarse){
  body{cursor:auto;}
  #cur,#cur-ring{display:none;}
  .hamburger,.mclose,.btn-send,.orb-card{cursor:auto;}
}

/* LOADER */
#loader{
  position:fixed;inset:0;z-index:9999;
  background:var(--off);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.8rem;
  transition:transform .75s cubic-bezier(.76,0,.24,1);
}
#loader.out{transform:translateY(-100%);}
.ldr-svg{width:68px;height:68px;}
.ldr-circle{
  stroke-dasharray:138;stroke-dashoffset:138;
  animation:drawC .85s cubic-bezier(.22,1,.36,1) .25s forwards;
}
.ldr-dot{transform-origin:center;transform:scale(0);animation:popD .4s cubic-bezier(.34,1.56,.64,1) 1s forwards;}
@keyframes drawC{to{stroke-dashoffset:0;}}
@keyframes popD{to{transform:scale(1);}}
.ldr-text{
  font-family:var(--display);font-size:1.1rem;font-weight:800;
  letter-spacing:.28em;text-transform:uppercase;color:var(--navy);
  clip-path:inset(0 0 100% 0);
  animation:revT .6s cubic-bezier(.22,1,.36,1) .9s forwards;
}
.ldr-text span{color:var(--teal);}
@keyframes revT{to{clip-path:inset(0 0 0% 0);}}

/* NAV */
nav{
  position:fixed;top:0;left:0;right:0;z-index:500;
  display:flex;align-items:center;justify-content:space-between;
  padding:1.2rem 5vw;
  transition:background .4s,box-shadow .4s;
}
nav.scrolled{
  background:oklch(.99 .002 90/.93);
  backdrop-filter:blur(14px);
  box-shadow:0 1px 0 var(--gray-lt);
}
.nav-brand{display:flex;align-items:center;gap:10px;text-decoration:none;}
.nav-iso{width:28px;height:28px;flex-shrink:0;}
.nav-name{font-family:var(--display);font-size:.9rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--navy);}
.nav-name em{color:var(--teal);font-style:normal;}
.nav-links{display:flex;align-items:center;gap:2.5rem;list-style:none;}
.nav-links a{text-decoration:none;font-size:.77rem;font-weight:400;letter-spacing:.07em;text-transform:uppercase;color:var(--gray);transition:color .2s;}
.nav-links a:hover{color:var(--navy);}
.ncta{background:var(--mag)!important;color:var(--white)!important;padding:.48rem 1.4rem;border-radius:100px;font-weight:500!important;letter-spacing:0!important;text-transform:none!important;transition:background .2s,transform .2s!important;}
.ncta:hover{background:var(--mag-dk)!important;transform:translateY(-1px);}
.hamburger{display:none;flex-direction:column;gap:5px;cursor:none;background:none;border:none;padding:4px;}
.hamburger span{display:block;width:22px;height:1.5px;background:var(--navy);}
.mmenu{display:none;position:fixed;inset:0;z-index:490;background:var(--off);flex-direction:column;align-items:center;justify-content:center;gap:2.5rem;}
.mmenu.open{display:flex;}
.mmenu a{font-family:var(--display);font-size:2.8rem;font-weight:900;letter-spacing:-.03em;color:var(--navy);text-decoration:none;transition:color .2s;}
.mmenu a:hover{color:var(--teal);}
.mclose{position:absolute;top:1.5rem;right:5vw;background:none;border:none;cursor:none;font-size:2rem;color:var(--navy);}
.nav-logo{height:60px;width:auto;display:block;}

/* ABOVE FOLD */
.above-fold{height:100vh;display:flex;flex-direction:column;overflow:hidden;}

/* HERO */
.hero{
  flex:1;min-height:0;position:relative;overflow:hidden;
  background:var(--off);
  display:grid;grid-template-columns:minmax(360px,1fr) minmax(700px,70vw);
  align-items:center;
  padding:5rem 0 5rem 5vw;gap:3rem;
}
.hero-label{
  font-size:.7rem;font-weight:500;letter-spacing:.22em;text-transform:uppercase;
  color:var(--teal);display:flex;align-items:center;gap:12px;margin-bottom:2.2rem;
  opacity:0;animation:fadeIn .5s 1.8s forwards;
}
.hero-label::before{content:'';width:32px;height:1px;background:var(--teal);}
.hero-heading{
  font-family:var(--display);
  font-size:clamp(4.5rem,5.0vw,5.0rem);
  font-weight:900;letter-spacing:-.04em;line-height:.92;
  color:var(--navy);margin-bottom:2rem;
}

    #c {
  position: absolute;
  top: 15%;
  left: 0;
  right: 0;
  bottom: 0;
  width: 120%;
  height: 95%;
}
.line{display:block;}
.line-inner{
  display:block;clip-path:inset(-0.12em 0 100% 0);
  animation:lineRev .85s cubic-bezier(.22,1,.36,1) forwards;
}
.line:nth-child(1) .line-inner{animation-delay:1.9s;}
.line:nth-child(2) .line-inner{animation-delay:2.05s;}
.line:nth-child(3) .line-inner{animation-delay:2.2s;}
.hl{color:var(--teal);}
@keyframes lineRev{to{clip-path:inset(-0.12em 0 -0.12em 0);}}
@keyframes fadeIn{to{opacity:1;}}
.colgado{
  font-size:1.25rem;font-weight:300;line-height:1.2;
  color:#333;max-width:440px;margin-bottom:2.5rem;
  opacity:0;animation:fadeIn .6s 2.5s forwards;
}
.txt-ficha{
  font-size:1.25rem;font-weight:300;line-height:1.2;
  color:#fff;max-width:440px;margin-bottom:2.5rem;
  opacity:0;animation:fadeIn .6s 2.5s forwards;
}
.hero-ctas{display:flex;gap:1rem;flex-wrap:wrap;opacity:0;animation:fadeIn .6s 2.7s forwards;}
.btn{
  padding:.55rem 2.2rem;border-radius:100px;
  font-family:var(--body);font-size:.9rem;font-weight:500;
  text-decoration:none;display:inline-flex;align-items:center;gap:8px;
  transition:transform .2s,background .2s;
}
.btn-primary{background:var(--mag);color:var(--white);}
.btn-primary:hover{background:var(--mag-dk);transform:translateY(-2px);}
.btn-ghost{background:transparent;color:var(--navy);border:1.5px solid var(--gray-lt);}
.btn-ghost:hover{border-color:var(--teal);color:var(--teal);transform:translateY(-2px);}

/* Hero orb */
/*.hero-right{
  position:relative;display:flex;align-items:center;justify-content:center;
  height:500px;
  opacity:0;animation:fadeIn .8s 2.3s forwards;
}*/
.orb{position:relative;display:flex;align-items:center;justify-content:center;}
.orb-outer{
  position:absolute;width:400px;height:400px;border-radius:50%;
  border:1px solid oklch(.74 .14 210/.15);
  animation:spin 22s linear infinite;
}
.orb-mid{
  position:absolute;width:290px;height:290px;border-radius:50%;
  border:1px solid oklch(.74 .14 210/.28);
  animation:spin 16s linear infinite reverse;
}
.orb-inner{
  width:175px;height:175px;border-radius:50%;
  background:oklch(.74 .14 210/.07);
  border:1.5px solid oklch(.74 .14 210/.4);
  display:flex;align-items:center;justify-content:center;
  flex-direction:column;gap:6px;
}
.orb-core{
  width:16px;height:16px;border-radius:50%;background:var(--mag);
  animation:pulseMag 2.6s ease-in-out infinite;
}
.orb-lbl{font-size:.58rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--teal-dk);}
.orb-sat{
  position:absolute;width:9px;height:9px;border-radius:50%;background:var(--teal);
}
@keyframes spin{from{transform:rotate(0deg);}to{transform:rotate(360deg);}}
@keyframes pulseMag{
  0%,100%{box-shadow:0 0 0 0 oklch(.54 .25 350/.5);}
  60%{box-shadow:0 0 0 14px oklch(.54 .25 350/0);}
}

@keyframes servNameShimmer{
  0%  { color: oklch(.74 .14 210/.4); text-shadow:none; }
  42% { color: oklch(.99 .002 90/1); text-shadow: 0 0 18px oklch(.74 .14 210/.4); }
  100%{ color: var(--teal); text-shadow:none; }
}

/* Orbit labels */
.orb-tag{
  position:absolute;font-size:.6rem;font-weight:500;letter-spacing:.12em;
  text-transform:uppercase;color:var(--teal-dk);white-space:nowrap;
}

/* -- hero-right: canvas + mano -- */
.hero-right{
  position:relative;
  align-self:stretch;
  min-height:700px;
  overflow:hidden;
  opacity:0;
  animation:fadeIn .8s 2.3s forwards;
}
#c{
  position: absolute;
  top: 25%;        /* subir este valor = canvas más abajo */
  left: 0;
  right: 0;
  bottom: -10%;    /* compensar para que no se achique */
  width: 100%;
  height: 100%;
}
}
.mano{
  position:absolute;
  /*bottom:-12%;*/
  top:5%;
  left:50%;
  height:160%;
  width:120%;
  z-index:2;
  pointer-events:none;
  display:block;
  transform-origin:50% 100%;
  animation:manoRock 4s ease-in-out infinite;
}
@keyframes manoRock{
  0%,100%{transform:translateX(-50%) rotate(-3deg);}
  50%    {transform:translateX(-50%) rotate(3deg);}
}

/* MARQUEE STRIP */
.marquee-strip{background:var(--teal);overflow:hidden;position:relative;z-index:5;}
.mq-track{display:flex;gap:0;width:max-content;will-change:transform;}
.mq-item{
  display:flex;align-items:center;gap:2.2rem;padding:0 2.2rem;
  font-family:var(--display);font-size:2.7rem;font-weight:800;
  letter-spacing:-.02em;text-transform:uppercase;color:var(--white);white-space:nowrap;
}
.mq-dot{width:6px;height:6px;border-radius:50%;background:var(--mag);flex-shrink:0;}
/* Animación de mq-track y cli-track ahora se controla por JS (ver main.js, initMarquee)
   para evitar el bug de Chrome donde animaciones CSS por compositor corren a
   velocidad descontrolada en ciertas versiones/pantallas de alta tasa de refresco. */

/* SECTIONS */
section{padding:7rem 5vw;}
.s-label{
  font-size:.7rem;font-weight:500;letter-spacing:.22em;text-transform:uppercase;
  color:var(--teal);display:flex;align-items:center;gap:12px;margin-bottom:1.2rem;
}
.s-label::before{content:'';width:28px;height:1px;background:var(--teal);}
.s-title{
  font-family:var(--display);
  font-size:clamp(2.4rem,4.5vw,4rem);
  font-weight:900;letter-spacing:-.035em;line-height:.98;
  color:var(--navy);margin-bottom:1.2rem;
}
.s-title em{font-style:italic;color:var(--teal);}
.s-body{font-size:1.2rem;font-weight:300;line-height:1.3;color:var(--gray);max-width:520px;}

/* REVEAL */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s cubic-bezier(.22,1,.36,1),transform .8s cubic-bezier(.22,1,.36,1);}
.reveal.in{opacity:1;transform:none;}
.reveal-scale{opacity:0;transform:scale(.96);transition:opacity .8s cubic-bezier(.22,1,.36,1),transform .8s cubic-bezier(.22,1,.36,1);}
.reveal-scale.in{opacity:1;transform:scale(1);}
.d1{transition-delay:.1s;}.d2{transition-delay:.2s;}.d3{transition-delay:.3s;}.d4{transition-delay:.4s;}

/* NOSOTROS */
#nosotros{background:var(--white);display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center;}
#nosotros > .nos-img-wrap{order:-1;}
.nos-stats{display:grid;grid-template-columns:1fr 1fr;gap:2rem 3rem;margin-top:3rem;}
.stat-row{display:flex;align-items:baseline;gap:2px;}
.stat-num{
  font-family:var(--display);font-size:clamp(2.8rem,4.5vw,4rem);
  font-weight:900;letter-spacing:-.04em;line-height:1;color:var(--teal);
}
.stat-sup{font-family:var(--display);font-size:clamp(1.6rem,2.5vw,2.2rem);font-weight:900;color:var(--mag);}
.stat-label{font-size:.82rem;font-weight:300;color:var(--gray);margin-top:.35rem;}
.nos-img-wrap{position:relative;}
.nos-img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:4px;display:block;}
.nos-badge{
  position:absolute;bottom:1.8rem;/*left:1.2rem;*/
  background:var(--teal);color:var(--white);
  padding:.9rem 1.3rem;border-radius:4px;
  font-family:var(--display);font-size:1.5rem;font-weight:900;letter-spacing:-.02em;
  z-index:2;
}
.nos-badge small{display:block;font-family:var(--body);font-size:.68rem;font-weight:400;letter-spacing:.08em;text-transform:uppercase;opacity:.82;margin-top:2px;}

/* FILOSOFÍA */
.fil-section{position:relative;height:200vh;z-index:1;}
.fil-sticky{position:sticky;top:0;height:90vh;overflow:hidden;}
.fil-bg{
  position:absolute;inset:0;
  background:url('imgs/fondo-zambullida.jpg') center/cover no-repeat;
  will-change:transform;filter:brightness(.52) saturate(.75);
}
.fil-overlay{position:absolute;inset:0;background:linear-gradient(135deg,oklch(.14 .03 250/.65) 0%,oklch(.50 .13 210/.38) 100%);}
.fil-figura{
  position:absolute;
  bottom:0;right:5vw;
  width:clamp(200px,28vw,420px);
  z-index:3;pointer-events:none;
  will-change:transform;
  transform-origin:bottom center;
}
.fil-figura img{width:100%;height:auto;display:block;filter:drop-shadow(0 20px 40px oklch(0 0 0/.4));}
.fil-content{
  position:absolute;
  top:50%;left:5vw;
  transform:translateY(-50%);
  z-index:4;max-width:520px;
  /*will-change:transform,opacity;*/
}
.fil-content .s-label{color:var(--teal);justify-content:flex-start;}
.fil-content .s-label::before{background:var(--teal);}
.fil-quote{
  font-family:var(--display);
  font-size:clamp(2.2rem,4.5vw,4rem);
  font-weight:900;font-style:italic;
  letter-spacing:-.035em;line-height:1.08;
  color:var(--white);margin:1.8rem 0 1.5rem;
}
.fil-sub{font-size:1rem;font-weight:300;line-height:1.76;color:oklch(.99 .002 90/.62);}

/* PLAYER ONE (split) */
.player-section{display:grid;grid-template-columns:1fr 1fr;min-height:580px;overflow:hidden;background:var(--white);}
.player-img-wrap{position:relative;overflow:hidden;}
.player-img{position:absolute;inset:-15%;background:url('imgs/player-one.jpg') center/cover no-repeat;will-change:transform;}
.player-content{padding:6rem 4vw;display:flex;flex-direction:column;justify-content:center;}
.player-quote{
  font-family:var(--display);font-size:clamp(1.6rem,2.8vw,2.6rem);
  font-weight:900;font-style:italic;letter-spacing:-.03em;line-height:1.12;
  color:var(--navy);margin:1.2rem 0 1.6rem;
    margin-top:140px;
}
.player-body{font-size:.95rem;font-weight:300;line-height:1.8;color:var(--gray);}

/* METODOLOG�A */
#metodologia{background:var(--off);}
.tl-wrap{position:relative;margin-top:4rem;padding-top:2rem;}
.tl-line{position:absolute;top:2.4rem;left:0;right:0;height:2px;background:var(--gray-lt);}
.tl-fill{position:absolute;top:0;left:0;height:100%;background:linear-gradient(90deg,var(--teal),oklch(.74 .14 210/.45));width:0;transition:width 1.5s cubic-bezier(.22,1,.36,1);}
.tl-steps{display:grid;grid-template-columns:repeat(5,1fr);position:relative;z-index:2;}
.tl-step{display:flex;flex-direction:column;align-items:center;padding:0 1rem;opacity:0;transform:translateY(16px);transition:opacity .5s,transform .5s;}
.tl-step.in{opacity:1;transform:none;}
.tl-dot{width:16px;height:16px;border-radius:50%;border:2px solid var(--gray-lt);background:var(--off);margin-bottom:2rem;flex-shrink:0;position:relative;z-index:3;transition:border-color .4s,background .4s,transform .4s;}
.tl-step.in .tl-dot{border-color:var(--teal);background:var(--teal);transform:scale(1.35);}
.tl-num{font-family:var(--display);font-size:.64rem;font-weight:700;letter-spacing:.16em;color:var(--teal);margin-bottom:.8rem;}
.tl-name{font-family:var(--display);font-size:1rem;font-weight:900;letter-spacing:-.01em;text-transform:uppercase;color:var(--navy);text-align:center;margin-bottom:.6rem;}
.tl-desc{font-size:.78rem;font-weight:300;line-height:1.6;color:var(--gray);text-align:center;}
.tl-result{font-size:.74rem;font-style:italic;color:var(--teal-dk);margin-top:.6rem;text-align:center;line-height:1.5;}

/* METODOLOGÍA ALTERNATIVA — orbital */

.black{color:#000};
.white{color:#FFF};

/* dos columnas: texto 1/3 — orbital 2/3 */
.orb-layout {
  display:grid;
  grid-template-columns:1fr 2fr;
  gap:5rem;
  align-items:center;
}
.orb-text { max-width:420px; }

.orb-met-wrap {
  position:relative;
  width:100%;
  height:600px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-top:0;
}
#orb-met-canvas {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  pointer-events:none;
}
.orb-met-center {
  position:absolute;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:6px;
  z-index:3;
  pointer-events:none;
}
.orb-met-core {
  width:18px;height:18px;border-radius:50%;
  background:var(--mag);
  box-shadow:0 0 0 0 oklch(.54 .25 350/.5);
  animation:pulseMag 2.6s ease-in-out infinite;
}
.orb-met-label {
  font-family:var(--display);
  font-size:.65rem;font-weight:800;
  letter-spacing:.14em;text-transform:uppercase;
  color:oklch(.74 .14 210/.5);
}
.orb-met-cards { position:absolute;inset:0;pointer-events:none; }
.orb-card {
  position:absolute;
  width:140px;
  border-radius: 8px;
  padding: 13px 16px;
  display:flex;flex-direction:column;gap:5px;
  pointer-events:all;
  cursor:none;
  transition:transform .25s cubic-bezier(.22,1,.36,1);
}
.orb-card:hover { transform:scale(1.06) !important; z-index:10; }
.orb-card-num {
  font-family:var(--display);
  font-size:.62rem;font-weight:700;letter-spacing:.16em;
  color:var(--mag);
}
.orb-card-name {
  font-family:var(--display);
  font-size:.95rem;font-weight:900;letter-spacing:-.01em;
  text-transform:uppercase;color:var(--white);
  line-height:1.1;
}
.orb-card-desc {
  font-size:.72rem;font-weight:300;line-height:1.55;
  color:oklch(.99 .002 90/.4);
}
.orb-card-result {
  font-size:.7rem;font-style:italic;
  color:var(--teal);line-height:1.4;
}
.orb-slider-arrow{
  display:none;
  align-items:center;justify-content:center;
  position:absolute;top:50%;transform:translateY(-50%);
  width:36px;height:36px;border-radius:50%;
  background:oklch(1 0 0/.12);border:1px solid oklch(1 0 0/.28);
  color:var(--white);font-size:1.5rem;line-height:1;
  z-index:6;cursor:pointer;padding:0;
}
.orb-slider-prev{left:.2rem;}
.orb-slider-next{right:.2rem;}
@media(max-width:1024px){
  .orb-layout { grid-template-columns:1fr; gap:3rem; }
  .orb-text { max-width:100%; }
}
@media(max-width:720px){
  .orb-met-wrap { height:auto;flex-direction:column;gap:2rem; }
  #orb-met-canvas { display:none; }
  .orb-met-cards { position:static;display:flex;flex-direction:column;gap:1.5rem;padding:1.5rem 0; }
  .orb-card { position:static;width:100%; }
  .orb-met-center { position:static;margin-bottom:1rem; }
}

/* CLIENTES */
#clientes{background:var(--off);}
.cli-head{text-align:center;margin-bottom:3rem;}
.cli-head .s-label{justify-content:center;}
.cli-head .s-label::before{display:none;}
.cli-mq-wrap{overflow:hidden;padding:1.5rem 0;position:relative;}
.cli-mq-wrap::before,.cli-mq-wrap::after{
  content:'';position:absolute;top:0;bottom:0;width:120px;z-index:2;
}
.cli-mq-wrap::before{left:0;background:linear-gradient(to right,var(--off),transparent);}
.cli-mq-wrap::after{right:0;background:linear-gradient(to left,var(--off),transparent);}
.cli-track{display:flex;gap:1.5rem;width:max-content;will-change:transform;}
.logo-ph{
  width:164px;height:76px;flex-shrink:0;
  background:var(--white);border-radius:8px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;
  transition:border-color .2s;
}
.logo-ph:hover{border-color:var(--teal);}
.logo-ph svg{width:18px;height:18px;color:var(--gray-lt);}
.logo-ph span{font-size:.6rem;font-weight:400;letter-spacing:.08em;text-transform:uppercase;color:oklch(.75 .006 250);text-align:center;padding:0 .5rem;line-height:1.4;}

/* CONTACTO */
#contacto{background:var(--white);}
.ct-grid{display:grid;grid-template-columns:1fr 1fr;gap:6rem;margin-top:3.5rem;}
.c-info{display:flex;flex-direction:column;gap:1.8rem;}
.c-item{display:flex;align-items:flex-start;gap:1rem;}
.c-icon{width:42px;height:42px;border-radius:50%;background:var(--teal-lt);flex-shrink:0;display:flex;align-items:center;justify-content:center;}
.c-icon svg{width:18px;height:18px;stroke:var(--teal);fill:none;stroke-width:1.5;}
.c-text{font-size:.9rem;font-weight:300;color:var(--gray);line-height:1.55;}
.c-text strong{display:block;font-weight:500;color:var(--navy);margin-bottom:2px;}
.c-form{display:flex;flex-direction:column;gap:1.2rem;}
.f-row{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;}
.f-group{display:flex;flex-direction:column;gap:6px;}
.f-group label{font-size:.7rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--gray);}
.f-group input,.f-group textarea,.f-group select{
  background:var(--off);border:1.5px solid var(--gray-lt);
  border-radius:8px;padding:.8rem 1rem;
  font-family:var(--body);font-size:.9rem;font-weight:300;
  color:var(--navy);outline:none;appearance:none;
  transition:border-color .2s,background .2s;
}
.f-group input:focus,.f-group textarea:focus,.f-group select:focus{border-color:var(--teal);background:var(--white);}
.f-group input::placeholder,.f-group textarea::placeholder{color:oklch(.78 .005 250);}
.f-group textarea{resize:vertical;min-height:130px;}
.f-group select option{background:var(--white);}
.mag-wrap{display:inline-block;transition:transform .5s cubic-bezier(.22,1,.36,1);}
.btn-send{
  background:var(--mag);color:var(--white);border:none;
  font-family:var(--body);font-size:.9rem;font-weight:500;
  padding:.9rem 2.5rem;border-radius:100px;cursor:none;
  transition:background .2s;
}
.btn-send:hover{background:var(--mag-dk);}

/* FOOTER */
footer{
  background:var(--navy);padding:2.5rem 5vw;
  display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:1.5rem;
  border-top:2px solid oklch(.74 .14 210/.18);
}
.ft-brand{font-family:var(--display);font-size:1rem;font-weight:900;letter-spacing:.05em;text-transform:uppercase;color:oklch(.99 .002 90/.35);}
.ft-brand em{color:var(--teal);font-style:normal;}
.ft-copy{font-size:.72rem;color:oklch(.99 .002 90/.18);font-weight:300;}
.ft-links{display:flex;gap:1.8rem;}
.ft-links a{font-size:.74rem;color:oklch(.99 .002 90/.28);text-decoration:none;letter-spacing:.05em;transition:color .2s;}
.ft-links a:hover{color:var(--teal);}

/* RESPONSIVE */
@media(max-width:1024px){
  .hero{grid-template-columns:1fr;padding:8rem 5vw 5rem;gap:3rem;}  /* restaurar padding derecho en tablet */
  .hero-right{align-self:auto;min-height:360px;}
  .orb-outer{width:280px;height:280px;}
  .orb-mid{width:200px;height:200px;}
  .orb-inner{width:130px;height:130px;}
  #nosotros{grid-template-columns:1fr;gap:3rem;}
  .nos-badge{left:0;}
  .serv-grid{grid-template-columns:1fr 1fr;}
  .ct-grid{grid-template-columns:1fr;gap:3rem;}
  .player-section{grid-template-columns:1fr;}
  .player-img-wrap{height:320px;position:relative;}
  .player-img{position:absolute;inset:0;}
  .serv-header{grid-template-columns:1fr;}
}

@media(max-width:720px){
  section{padding:5rem 5vw;}
  .hero{padding:6rem 5vw 4rem;}
  /* height:auto (en vez de 100vh) + overflow:visible en ambos ejes: mezclar
     overflow-x:hidden con overflow-y:visible hace que el navegador calcule
     overflow-y como "auto" (regla del spec CSS Overflow), lo que crea un
     contenedor con scroll propio de 100vh y atrapa el scroll de la página
     (solo se ve el hero, el resto sólo es accesible vía el menú). El body
     ya tiene overflow-x:hidden, así que no hace falta repetirlo acá. */
  .above-fold{height:auto;overflow:visible;}
  .hero{overflow:visible;}
  .hero-right{height:300px;min-height:0;overflow:visible;z-index:6;}
  .nav-links{display:none;}
  .hamburger{display:flex;}
  .tl-steps{grid-template-columns:1fr 1fr;}
  .tl-line{display:none;}
  .serv-grid{grid-template-columns:1fr;}
  .f-row{grid-template-columns:1fr;}
  footer{flex-direction:column;text-align:center;}
  .ft-links{justify-content:center;}
  .player-content{padding:1.5rem 6vw 2.5rem;}
  .player-quote{margin-top:56px;}
  .mq-item{font-size:1.89rem;}
  #clientes{padding-top:30px;}
}
@media(max-width:480px){
    .tl-steps{grid-template-columns:1fr;}
    .serv-header{gap: 0.2rem}
    
  #c {
  position: absolute;
  top: 15%;
  left: 0;
  right: 0;
  bottom: 0;
  width: 115%;
  height: 95%;
}

.fil-content {
  position: absolute;
  top: 145px;
  left: 5vw;
  transform: none;
  z-index: 4;
  max-width: 400px;
  will-change: transform,opacity;
}

.fil-section{
height:100vh;
}

.hero-heading {
    font-family: var(--display);
    font-size: clamp(3.5rem, 6.5vw, 6.5rem);
    }


}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;}
  .line-inner,.ldr-text{clip-path:none!important;}
}
/* METODOLOGÍA ALTERNATIVA — cards horizontales sobre fondo navy */
.met-alt-grid {
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:1px;
  background:oklch(.74 .14 210/.12);
  border-radius:12px;
  overflow:hidden;
}
.met-alt-card {
  background:oklch(.14 .03 250/.6);
  padding:2.5rem 1.6rem;
  position:relative;
  transition:background .25s;
}
.met-alt-card:hover { background:oklch(.14 .03 250/.9); }
.met-alt-num {
  font-family:var(--display);
  font-size:clamp(3rem,5vw,4.5rem);
  font-weight:900;letter-spacing:-.05em;line-height:1;
  color:oklch(.74 .14 210/.15);
  margin-bottom:1.2rem;
  transition:color .25s;
}
.met-alt-card:hover .met-alt-num { color:oklch(.74 .14 210/.35); }
.met-alt-name {
  font-family:var(--display);
  font-size:1rem;font-weight:900;
  letter-spacing:-.01em;text-transform:uppercase;
  color:var(--white);margin-bottom:.7rem;
}
.met-alt-desc {
  font-size:.78rem;font-weight:300;line-height:1.6;
  color:oklch(.99 .002 90/.45);margin-bottom:.8rem;
}
.met-alt-result {
  font-size:.73rem;font-style:italic;
  color:var(--teal);line-height:1.5;
}
.met-alt-line {
  position:absolute;top:2rem;right:-1px;
  width:1px;height:calc(100% - 4rem);
  background:oklch(.74 .14 210/.15);
}

@media(max-width:1024px){
  .met-alt-grid { grid-template-columns:1fr 1fr; }
  .met-alt-card:nth-child(2n) .met-alt-line { display:none; }
}
@media(max-width:720px){
  .met-alt-grid { grid-template-columns:1fr; }
  .met-alt-line { display:none; }
}

/* ORBITAL SERVICIOS */
.orb-met-wrap{position:relative;width:100%;height:600px;display:flex;align-items:center;justify-content:center;margin-top:2rem;}
#orb-met-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;}
.orb-met-center{position:absolute;display:flex;align-items:center;justify-content:center;z-index:3;pointer-events:none;}
.orb-met-iso{width:clamp(48px,5vw,72px);height:auto;display:block;opacity:.9;}
.orb-met-cards{position:absolute;inset:0;pointer-events:none;}
.orb-card{
  position:absolute;width:160px;
  display:flex;flex-direction:column;gap:5px;
  pointer-events:all;cursor:default;
  transition:transform .25s cubic-bezier(.22,1,.36,1);
  opacity:1;
}
.orb-card:hover{transform:scale(1.06) !important;z-index:10 !important;}
.orb-card-num{font-family:var(--display);font-size:.62rem;font-weight:700;letter-spacing:.16em;color:var(--mag);}
.orb-card-name{font-family:var(--display);font-size:1.2rem;font-weight:900;letter-spacing:-.01em;text-transform:uppercase;color:var(--white);line-height:1.1;}
.orb-card-desc{font-size:1.0rem;font-weight:300;line-height:1.0;color:oklch(.99 .002 90/.55);}
.orb-card-result{font-size:.9rem;font-style:italic;color:var(--teal);line-height:1.4;}

@media(max-width:780px){
  .orb-met-wrap{height:360px;overflow:hidden;}
  .orb-card,.orb-card-num,.orb-card-name,.orb-card-desc,.orb-card-result{opacity:1!important;color:var(--white)!important;}
  .orb-card-num{color:var(--mag)!important;}
  .orb-card-result{color:var(--teal)!important;}
  .orb-card-desc{color:oklch(.99 .002 90/.7)!important;}
}
@media(max-width:480px){
  .orb-met-wrap{height:460px;overflow:hidden;}
  .orb-card{width:130px;}
  .orb-card,.orb-card-num,.orb-card-name,.orb-card-desc,.orb-card-result{opacity:1!important;color:var(--white)!important;}
  .orb-card-num{color:var(--mag)!important;}
  .orb-card-result{color:var(--teal)!important;}
  .orb-card-desc{color:oklch(.99 .002 90/.7)!important;}
}

/* "Cómo trabajamos" — slider de fichas en pantallas chicas */
@media(max-width:720px){
  .orb-layout{min-width:0;}
  .orb-met-wrap{height:auto;overflow:visible;flex-direction:column;gap:1.2rem;width:100%;min-width:0;}
  #orb-met-canvas{display:none;}
  .orb-met-center{display:none;}
  .orb-met-cards{
    position:static;inset:auto;min-width:0;
    display:flex!important;flex-direction:row!important;flex-wrap:nowrap;
    overflow-x:auto;scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;scrollbar-width:none;
    gap:0;width:100%;padding:.5rem 0 1.2rem;
  }
  .orb-met-cards::-webkit-scrollbar{display:none;}
  .orb-card{
    position:static!important;left:auto!important;top:auto!important;
    opacity:1!important;z-index:auto!important;
    flex:0 0 100%;max-width:100%;width:auto!important;box-sizing:border-box;
    scroll-snap-align:start;
    background:oklch(1 0 0/.05);border:1px solid oklch(1 0 0/.12);
    border-radius:8px;padding:1.2rem 1.4rem;
  }
  .orb-card,.orb-card-num,.orb-card-name,.orb-card-desc,.orb-card-result{color:var(--white)!important;}
  .orb-card-num{color:var(--mag)!important;}
  .orb-card-result{color:var(--teal)!important;}
  .orb-card-desc{color:oklch(.99 .002 90/.7)!important;}
  .orb-slider-arrow{display:flex;top:calc(100% + 35px);transform:none;}
  .colgado{font-size:15px;}
}

/* SERVICIOS */
#servicios{background:#5e5e5e;}
.serv-header{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:end;margin-bottom:3.5rem;}
#servicios .s-label{color:var(--teal);}
#servicios .s-title{color:var(--white);}
#serv-body{color:oklch(.99 .002 90/.5);max-width:460px;}
.serv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;}
.serv-card{
  background:oklch(.16 .025 250);
  padding:2.6rem 2.2rem;
  border-radius:6px;
  border:1px solid oklch(.24 .03 250);
  box-shadow:0 4px 24px oklch(0 0 0/.28);
  transform-style:preserve-3d;
  will-change:transform;
  transition:background .3s,box-shadow .3s,border-color .3s;
}
.serv-card:hover{background:oklch(.19 .04 210);box-shadow:0 8px 40px oklch(0 0 0/.38);border-color:oklch(.74 .14 210/.3);}
.serv-n{
  font-family:var(--display);
  font-size:clamp(3.5rem,5.5vw,5rem);
  font-weight:900;letter-spacing:-.05em;line-height:1;
  color:oklch(.99 .002 90/.22);
  margin-bottom:1.4rem;
}
.serv-name{font-family:var(--display);clamp(1.5rem,2.5vw,3rem);font-weight:900;letter-spacing:-.02em;color:var(--teal);margin-bottom:.7rem;line-height:1.15;}
.serv-desc{font-size:.84rem;font-weight:300;line-height:1.72;color:oklch(.99 .002 90/.52);}


/* ORBITAL layout — 2 col */
.orb-layout{display:grid;grid-template-columns:1fr 2fr;gap:5rem;align-items:center;}
.orb-text{max-width:420px;}

@media(max-width:1200px){
  .orb-layout{grid-template-columns:1fr 1.6fr;gap:3.5rem;}
}
@media(max-width:1024px){
  .serv-grid{grid-template-columns:1fr 1fr;}
  .serv-header{grid-template-columns:1fr;}
  .orb-layout{grid-template-columns:1fr;gap:2.5rem;}
  .orb-text{max-width:100%;}
  .orb-met-wrap{margin-top:0;}
}
@media(max-width:720px){
  .serv-grid{grid-template-columns:1fr;}
}

@media(max-width:480px){
    .tl-steps{grid-template-columns:1fr;}
    .serv-header{gap: 0.2rem}
}

/* GSAP SERVICIOS */
.serv-char{display:inline-block;will-change:transform,opacity;}

@keyframes servNumShimmer{
  0%  {color:oklch(.74 .14 210/.12);text-shadow:none;}
  42% {color:oklch(.74 .14 210/.78);text-shadow:0 0 28px oklch(.74 .14 210/.42),0 0 56px oklch(.74 .14 210/.2);}
  100%{color:oklch(.74 .14 210/.12);text-shadow:none;}
}

@media(prefers-reduced-motion:reduce){
  #serv-label,#serv-title,#serv-body,.serv-char{opacity:1!important;transform:none!important;}
}