body{margin:0;background:#2A2F3A}
a{color:#8FB4E8;text-decoration:none}a:hover{color:#FFFFFF}
.mono{font-family:'Geist Mono',ui-monospace,monospace}
.navlink{color:#C5CAD3;transition:color .3s}.navlink:hover{color:#FFFFFF}
.btn-contact{position:relative;overflow:hidden;transition:transform .3s}
.btn-contact::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#5E8FD6,#6DBB86,#F5A04A);transform:translateX(-101%);transition:transform .5s cubic-bezier(.22,1,.36,1)}
.btn-contact:hover::before{transform:translateX(0)}
.btn-contact>*{position:relative}
.btn-contact:hover .arr{transform:rotate(45deg)}
.arr{transition:transform .4s cubic-bezier(.22,1,.36,1)}
.btn-primary{transition:box-shadow .4s, transform .4s}
.btn-primary:hover{box-shadow:0 0 60px -6px rgba(94,143,214,.9);transform:translateY(-2px)}
.btn-primary:hover .arr{transform:rotate(-45deg)}
.btn-ghost{transition:border-color .3s, background .3s}
.btn-ghost:hover{border-color:rgba(255,255,255,.4)!important;background:rgba(255,255,255,.05)}
.card{transition:transform .5s cubic-bezier(.22,1,.36,1), border-color .5s, box-shadow .5s}
.card:hover{transform:translateY(-6px);border-color:rgba(143,180,232,.35)!important;box-shadow:0 30px 80px -30px rgba(58,130,83,.45)}
.card:hover .arr{transform:rotate(45deg);color:#FFFFFF}
.case{transition:transform .6s cubic-bezier(.22,1,.36,1), box-shadow .7s}
.case .art{transition:transform 1.2s cubic-bezier(.22,1,.36,1)}
.case:hover{transform:translateY(-10px);box-shadow:0 40px 120px -30px rgba(58,130,83,.5)}
.case:hover .art{transform:scale(1.08)}
.case .pill-go{opacity:0;transform:scale(.6);transition:all .4s cubic-bezier(.22,1,.36,1)}
.case:hover .pill-go{opacity:1;transform:scale(1)}
.adv{transition:border-color .5s}
.adv:hover{border-color:rgba(253,186,116,.35)!important}
.adv .num{transition:color .5s}.adv:hover .num{color:rgba(255,255,255,.18)!important}
.cta-btn{transition:transform .5s cubic-bezier(.22,1,.36,1)}
.cta-btn::before{content:"";position:absolute;inset:0;border-radius:50%;background:linear-gradient(45deg,#5E8FD6,#6DBB86,#F5A04A);transform:scale(0);transition:transform .7s cubic-bezier(.22,1,.36,1)}
.cta-btn:hover{transform:scale(1.05)}
.cta-btn:hover::before{transform:scale(1)}
.cta-btn>*{position:relative}
.cta-btn::after{content:"";position:absolute;inset:0;border-radius:50%;animation:ping 2.2s infinite}
.social{transition:all .3s}.social:hover{border-color:rgba(94,143,214,.5)!important;color:#FFFFFF!important;transform:translateY(-2px)}
.flink{color:#D4D4D8;transition:color .3s}.flink:hover{color:#FFFFFF}
@keyframes ping{0%{box-shadow:0 0 0 0 rgba(94,143,214,.6)}100%{box-shadow:0 0 0 44px rgba(94,143,214,0)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
@keyframes breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.04)}}
@keyframes glow{0%,100%{box-shadow:0 0 0 rgba(94,143,214,0)}50%{box-shadow:0 0 30px rgba(94,143,214,.7)}}
.ring{animation:spin 30s linear infinite}
.ring2{animation:spin 42s linear infinite reverse}
.ring3{animation:spin 56s linear infinite}
.core{animation:breathe 6s ease-in-out infinite}
.sheen{animation:spin 18s linear infinite}
.chip{animation:floaty 5s ease-in-out infinite}
.chip.d2{animation-delay:-1.6s}.chip.d3{animation-delay:-3.2s}
.glowbtn{animation:glow 2.4s infinite}
.hscroll{scrollbar-width:none}.hscroll::-webkit-scrollbar{display:none}
@media (max-width: 900px){
  .stack{grid-template-columns:1fr!important}
  .stack>*{grid-column:auto!important;grid-row:auto!important}
  .navmenu{display:none!important}
  .hide-sm{display:none!important}
}
html{scroll-behavior:smooth}
section[id]{scroll-margin-top:90px}
.h2{font-size:clamp(36px,5vw,72px)!important}
@media (max-width: 900px){
  .pad{padding-left:20px!important;padding-right:20px!important}
  section{padding-left:20px!important;padding-right:20px!important}
  section>div{padding-left:0!important;padding-right:0!important}
  #top{padding-top:56px!important}
  #top .stack{padding:0!important}
  #metodo>div:first-child{padding:0 20px!important}
  #metodo .hscroll{padding-left:20px!important;padding-right:20px!important}
  .adv{flex-basis:84vw!important}
  .case{height:420px!important}
  .case>div:last-child{flex-direction:column;align-items:flex-start!important}
  .case>div:last-child>div:last-child{text-align:left!important}
  article.card{flex-direction:column}
  article.card>div:last-child{flex:0 0 auto!important;width:100%;box-sizing:border-box}
  footer>div{padding:28px 20px!important}
  #servicios .stack>p{grid-column:auto!important}
}
