:root{
  --base:#0D3156;
  --base-dark:#0D3156;
  --base-deep:#0D3156;
  --ink:#071827;
  --white:#FFFFFF;
  --text:#FFFFFF;
  --muted:#D5E2EC;
  --line:rgba(255,255,255,.18);
  --glass:rgba(13,49,86,.62);
  --green:#00D084;
  --purple:#8E44FF;
  --red:#FF3B30;
  --orange:#FF9500;
  --blue:#168CFF;
  --cyan:#00C7FF;
  --yellow:#FFC400;
  --pink:#FF2D55;
  --max:112rem;
  --ease:cubic-bezier(.2,.78,.22,1);

  --header-h:5rem;

  --action-green:#00C875;

  --action-orange:#FF8A00;

  --action-red:#E53935;

  --page-gutter:clamp(.9rem,3.5vw,2.25rem);
  --page-gutter-total:clamp(1.8rem,7vw,4.5rem);
  --mobile-header-edge:clamp(1rem,4vw,1.5rem);

  --header-total-h:calc(var(--header-h) + env(safe-area-inset-top,0px));
}
*{box-sizing:border-box}
html{
  min-width:100%;
  background:#0D3156;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
  scroll-behavior:smooth;
}
body{
  margin:0;
  min-width:100%;
  min-height:100svh;
  min-height:100dvh;
  overflow-x:hidden;
  background:#0D3156;
  color:var(--text);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:geometricPrecision;
}
button,input,select,textarea{font:inherit}
button,a{-webkit-tap-highlight-color:transparent}
button{cursor:pointer;touch-action:manipulation}
body.mobile-menu-open{overflow:hidden}
a{color:inherit}
img,svg{display:block;max-width:100%}
main,section,article,div,nav,header,footer,form,label{min-width:0}
h1,h2,h3,p,span,strong,small,button,a{overflow-wrap:anywhere}
[hidden]{display:none!important}
.shell{
  width:min(calc(100% - var(--page-gutter-total)),var(--max));
  margin-inline:auto;
}

/* Decorative stars no longer alter the page hue */
#spaceCanvas{
  position:fixed;
  inset:0;
  width:100%;
  height:100%;
  z-index:-3;
  pointer-events:none;
  opacity:.22;
}
.space-wash{
  position:fixed;
  inset:0;
  z-index:-2;
  pointer-events:none;
  background:#0D3156;
}
/* HEADER — single glass layer, mobile-first */
.header{
  position:fixed;
  inset:0 0 auto;
  z-index:100;
  min-height:var(--header-total-h);
  padding-top:env(safe-area-inset-top,0px);
  padding-inline:var(--mobile-header-edge);
  border:0;
  border-bottom:1px solid rgba(255,255,255,.12);
  background:rgba(4,20,36,.76);
  -webkit-backdrop-filter:blur(1.25rem) saturate(145%);
  backdrop-filter:blur(1.25rem) saturate(145%);
  box-shadow:0 .7rem 1.7rem rgba(0,0,0,.18);
}

.header-shell{
  width:100%;
  max-width:var(--max);
  margin-inline:auto;
}

.header-row{
  min-height:var(--header-h);
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:clamp(.45rem,1.6vw,1rem);
  padding:.46rem 0;
}

.brand{
  min-width:0;
  max-width:100%;
  display:flex;
  align-items:center;
  gap:clamp(.42rem,1.5vw,.62rem);
  overflow:hidden;
  border:0;
  background:transparent;
  color:#fff;
  text-decoration:none;
  text-align:left;
}

.brand-logo{
  --s:clamp(2.5rem,10vw,3.2rem);
  position:relative;
  width:var(--s);
  aspect-ratio:1;
  flex:0 0 auto;
  perspective:720px;
  filter:drop-shadow(0 .3rem .5rem rgba(0,0,0,.28));
}
.brand-logo__object{position:absolute;inset:0;transform-style:preserve-3d;animation:logoSpin 14s linear infinite}
.brand-logo__front,.brand-logo__back,.brand-logo__slice{position:absolute;inset:0;backface-visibility:hidden}
.brand-logo__slice{opacity:.3;filter:brightness(.68)}
.brand-logo__slice.s1{transform:translateZ(-.24rem)}
.brand-logo__slice.s2{transform:translateZ(-.12rem)}
.brand-logo__front{transform:translateZ(.28rem)}
.brand-logo__back{transform:rotateY(180deg) translateZ(.28rem)}
.brand-logo__back img{transform:scaleX(-1)}
@keyframes logoSpin{to{transform:rotateY(360deg)}}

.brand-text{min-width:0;display:grid;gap:.04rem;overflow:hidden}
.brand-name{
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:clamp(.78rem,3.7vw,1.05rem);
  font-weight:700;
  line-height:1.04;
  letter-spacing:clamp(.03em,.5vw,.075em);
}
.brand-tag{
  color:rgba(225,237,246,.8);
  font-size:clamp(.48rem,2.3vw,.61rem);
  font-weight:450;
  line-height:1.2;
  letter-spacing:.02em;
}

.nav{display:none;justify-self:center;gap:.18rem}
.nav button{
  min-height:2.7rem;
  padding:.52rem .9rem;
  border:1px solid transparent;
  border-radius:.36rem;
  background:transparent;
  color:rgba(229,239,246,.9);
  font-size:clamp(.72rem,1.02vw,.82rem);
  font-weight:520;
  letter-spacing:.04em;
  transition:background .18s ease,border-color .18s ease,color .18s ease,transform .18s ease;
}
.nav button:hover,
.nav button:focus-visible{
  background:rgba(255,255,255,.09);
  border-color:rgba(255,255,255,.14);
  color:#fff;
  outline:none;
}
.nav button.active{
  background:rgba(255,255,255,.14);
  border-color:rgba(255,255,255,.19);
  color:#fff;
}

.header-actions{
  display:flex;
  flex:0 0 auto;
  align-items:center;
  gap:clamp(.18rem,.8vw,.32rem);
}
.icon{
  width:clamp(2.15rem,10vw,2.55rem);
  aspect-ratio:1;
  display:grid;
  place-items:center;
  border:0;
  border-radius:.42rem;
  background:var(--action-green);
  color:#fff;
  text-decoration:none;
  font-size:clamp(.82rem,3vw,.98rem);
  transition:background .18s ease,transform .18s ease,box-shadow .18s ease;
}
.icon:hover,
.icon:focus-visible{
  background:var(--action-orange);
  transform:translateY(-.04rem);
  box-shadow:0 .45rem 1rem rgba(255,138,0,.24);
  outline:none;
}

/* Mobile menu lives in the SAME glass surface as the header. */
.mobile-nav{
  display:grid;
  grid-template-rows:0fr;
  max-height:0;
  margin:0;
  overflow:hidden;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  background:transparent;
  border:0;
  box-shadow:none;
  transition:grid-template-rows .22s var(--ease),max-height .22s var(--ease),opacity .16s ease,visibility 0s linear .22s;
}
.mobile-nav.open{
  grid-template-rows:1fr;
  max-height:calc(100dvh - var(--header-total-h) - 1rem);
  margin-bottom:.72rem;
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transition-delay:0s;
}
.mobile-nav-inner{
  min-height:0;
  overflow:hidden;
  display:grid;
  padding:.35rem 0 .72rem;
  border-top:1px solid rgba(255,255,255,.10);
}
.mobile-nav.open .mobile-nav-inner{overflow:visible}
.mobile-nav button{
  width:100%;
  min-height:2.95rem;
  padding:.8rem clamp(1rem,4vw,1.3rem);
  border:0;
  border-bottom:1px solid rgba(255,255,255,.11);
  border-radius:0;
  background:transparent;
  color:rgba(255,255,255,.92);
  text-align:left;
  font-size:clamp(.78rem,3.25vw,.92rem);
  font-weight:520;
  line-height:1.2;
  letter-spacing:.028em;
  transition:background .16s ease,color .16s ease,padding-left .16s ease;
}
.mobile-nav button:last-child{border-bottom:0}
.mobile-nav button:hover,
.mobile-nav button:focus-visible{
  background:rgba(255,255,255,.055);
  color:#fff;
  padding-left:clamp(.85rem,3.2vw,1.15rem);
  outline:none;
}
.mobile-nav button.active{
  background:rgba(255,255,255,.075);
  color:#fff;
  box-shadow:inset .16rem 0 0 rgba(255,255,255,.75);
}



@media(max-width:24.99rem){
  :root{--mobile-header-edge:.85rem}
  .brand-tag{display:none}
  .header-row{gap:.32rem}
  .header-actions{gap:.15rem}
}

@media(max-width:21.99rem){
  
  .brand-logo{--s:2.25rem}
  .brand-name{font-size:.72rem;letter-spacing:.025em}
  .icon{width:2rem}
}

@media(min-width:64rem){
  .header{padding-inline:0}
  .header-shell{width:min(calc(100% - var(--page-gutter-total)),var(--max))}
  .header-row{grid-template-columns:auto minmax(0,1fr) auto}
  .brand-logo{--s:clamp(3rem,4vw,4rem)}
  .brand-name{font-size:clamp(.88rem,1.3vw,1.16rem)}
  .brand-tag{font-size:clamp(.5rem,.8vw,.63rem)}
  .icon{width:clamp(2.45rem,3vw,2.8rem)}
  .nav{display:flex;min-width:0;justify-content:center;flex-wrap:wrap}
  #menuBtn,.mobile-nav{display:none}
}

@media(max-height:30rem) and (max-width:63.99rem){
  .mobile-nav.open{overflow-y:auto;overscroll-behavior:contain}
  .mobile-nav.open .mobile-nav-inner{overflow:visible}
}

/* LAYOUT */
main{
  padding-bottom:clamp(2.5rem,6vw,4rem);
  background:#0D3156;
}
.page{
  display:block;
  background:#0D3156;
}

/* HERO — full-bleed, without frames */
.hero{
  position:relative;
  left:50%;
  width:100vw;
  margin-left:-50vw;
  isolation:isolate;
  overflow:hidden;
  min-height:100svh;
  min-height:100dvh;
  background:#0D3156;
  border:0;
  border-radius:0;
  box-shadow:0 3.6rem 4.8rem -1.8rem rgba(0,0,0,.82);

  z-index:3;
}

.hero::after{
  content:"";
  position:absolute;
  right:0;
  bottom:0;
  left:0;
  height:clamp(3.5rem,10vh,7rem);
  z-index:8;
  pointer-events:none;
  box-shadow:inset 0 -3.5rem 4.6rem -2.2rem rgba(0,0,0,.72);
}





.hero-bg,
.hero-shade{
  position:absolute;
  inset:0;
}

.hero-bg{
  z-index:-4;
  overflow:hidden;
}

.hero-bg img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  border:0;
  border-radius:0;
  box-shadow:none;
}

.hero-shade{
  z-index:-3;
  pointer-events:none;
  background:rgba(0,0,0,.30);
}

.hero-content{
  position:relative;
  z-index:5;
  width:min(calc(100% - var(--page-gutter-total)),var(--max));
  min-height:100svh;
  min-height:100dvh;
  margin-inline:auto;
  display:grid;
  align-content:end;
  gap:clamp(.58rem,1.7vh,1rem);
  padding-top:calc(var(--header-total-h) + clamp(.55rem,1.8vh,1rem));
  padding-bottom:clamp(1rem,2.8vh,1.65rem);
}

.hero-copy{
  max-width:42rem;
  display:grid;
  justify-items:start;
  gap:clamp(.3rem,1vh,.5rem);
}

.hero-kicker{
  margin:0;
  color:#fff;
  font-size:clamp(.55rem,2vw,.63rem);
  font-weight:900;
  letter-spacing:.14em;
  text-transform:uppercase;
}

.hero-counter{
  color:#E4EDF3;
  font-size:.56rem;
  font-weight:800;
  letter-spacing:.08em;
}

.hero-title{
  margin:0;
  max-width:13ch;
  color:#fff;
  font-size:clamp(1.8rem,8.4vw,5rem);
  font-weight:950;
  line-height:.92;
  letter-spacing:-.048em;
  text-transform:uppercase;
  text-wrap:balance;
  overflow-wrap:anywhere;
}

.hero-description{
  max-width:38rem;
  margin:0;
  color:#F4F8FA;
  font-size:clamp(.76rem,2.6vw,.96rem);
  font-weight:500;
  line-height:1.45;
  overflow-wrap:anywhere;
}

.hero-chips{
  display:flex;
  flex-wrap:wrap;
  gap:.28rem;
}

.hero-chip{
  min-height:1.6rem;
  display:inline-flex;
  align-items:center;
  padding:.24rem .4rem;
  border:1px solid rgba(255,255,255,.22);
  border-radius:.42rem;
  background:rgba(0,0,0,.28);
  color:#fff;
  font-size:.54rem;
  font-weight:800;
}

.hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:.4rem;
}

/* Text enters upward with fade after each image change */
.hero-copy.is-appearing > *{
  opacity:0;
  animation:heroRiseFade .58s var(--ease) forwards;
}
.hero-copy.is-appearing > :nth-child(1){animation-delay:.02s}
.hero-copy.is-appearing > :nth-child(2){animation-delay:.06s}
.hero-copy.is-appearing > :nth-child(3){animation-delay:.10s}
.hero-copy.is-appearing > :nth-child(4){animation-delay:.14s}
.hero-copy.is-appearing > :nth-child(5){animation-delay:.18s}
.hero-copy.is-appearing > :nth-child(6){animation-delay:.22s}

@keyframes heroRiseFade{
  from{
    opacity:0;
    transform:translateY(1.5rem);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}

.btn{
  min-height:2.66rem;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.6rem .84rem;
  border:0;
  border-radius:.58rem;
  color:#fff;
  font-size:.7rem;
  font-weight:900;
  text-decoration:none;
  transition:transform .14s ease,box-shadow .18s ease,background .18s ease;
}

.btn:active{
  transform:scale(.97);
}

.btn-green{
  background:var(--action-green);
  color:#fff;
  box-shadow:0 .62rem 1.25rem rgba(0,200,117,.28);
}

.btn-green:hover,
.btn-green:focus-visible{
  background:var(--action-orange);
  color:#fff;
  box-shadow:0 .8rem 1.5rem rgba(255,138,0,.34);
  outline:none;
}

.btn-base{
  background:var(--action-orange);
  color:#fff;
  box-shadow:0 .62rem 1.25rem rgba(255,138,0,.30);
}

.btn-base:hover,
.btn-base:focus-visible{
  background:var(--action-red);
  color:#fff;
  box-shadow:0 .8rem 1.5rem rgba(229,57,53,.34);
  outline:none;
}

.btn-purple{
  background:var(--action-red);
  color:#fff;
  box-shadow:0 .62rem 1.25rem rgba(229,57,53,.30);
}
.btn-purple:hover,
.btn-purple:focus-visible{
  background:var(--action-green);
  color:#fff;
  box-shadow:0 .8rem 1.5rem rgba(0,200,117,.34);
  outline:none;
}


.hero-bottom{
  display:grid;
  gap:.42rem;
  min-width:0;
}

.hero-control-row{
  display:flex;
  align-items:center;
  gap:.4rem;
}

.hero-next{
  width:2.2rem;
  aspect-ratio:1;
  display:grid;
  place-items:center;
  border:0;
  border-radius:50%;
  background:var(--action-orange);
  color:#fff;
  font-size:1rem;
  font-weight:850;
  box-shadow:0 .55rem 1.15rem rgba(255,138,0,.30);
  transition:background .18s ease,transform .18s ease,box-shadow .18s ease;
}
.hero-next:hover,
.hero-next:focus-visible{
  background:var(--action-red);
  color:#fff;
  transform:translateX(.1rem);
  box-shadow:0 .72rem 1.35rem rgba(229,57,53,.34);
  outline:none;
}


.hero-progress{
  width:min(8rem,34vw);
  height:.2rem;
  border-radius:999px;
  overflow:hidden;
  background:rgba(255,255,255,.22);
}

.hero-progress span{
  display:block;
  width:100%;
  height:100%;
  transform-origin:left center;
  background:var(--green);
  animation:progress 4s linear infinite;
}

@keyframes progress{
  from{transform:scaleX(0)}
  to{transform:scaleX(1)}
}

.hero.reset-progress .hero-progress span{
  animation:none;
}

.hero-cards{
  display:flex;
  align-items:flex-end;
  gap:clamp(.34rem,1.7vw,.6rem);
  min-width:0;
  max-width:100%;
  overflow-x:auto;
  overscroll-behavior-inline:contain;
  scroll-snap-type:x proximity;
  scroll-padding-inline:.1rem;
  padding:.14rem .02rem .52rem;
  scrollbar-width:none;
}

.hero-cards::-webkit-scrollbar{
  display:none;
}

.hero-preview{
  position:relative;
  scroll-snap-align:start;
  flex:0 0 clamp(5.1rem,25vw,6.9rem);
  aspect-ratio:.78;
  overflow:hidden;
  padding:0;
  border:0;
  border-radius:.58rem;
  background:#111;
  box-shadow:0 .78rem 1.55rem rgba(0,0,0,.30);
  transition:box-shadow .18s ease,opacity .1s ease;
}

.hero-preview img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .28s var(--ease);
}

.hero-preview:hover img{
  transform:scale(1.045);
}

.hero-preview:hover{
  box-shadow:0 1rem 1.9rem rgba(0,0,0,.38);
}

.hero-preview::after{
  content:"";
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.16);
}

.hero-preview-label{
  position:absolute;
  z-index:1;
  right:.34rem;
  bottom:.34rem;
  left:.34rem;
  color:#fff;
  font-size:clamp(.44rem,1.8vw,.56rem);
  font-weight:900;
  line-height:1.06;
  text-align:left;
}

.hero-preview.source{
  opacity:0;
}

.hero-preview.enter{
  animation:cardEnter .2s var(--ease) both;
}

@keyframes cardEnter{
  from{
    opacity:0;
    transform:translateX(.9rem);
  }
  to{
    opacity:1;
    transform:none;
  }
}

/* Expanding image itself has no frame */
.hero-opening{
  position:absolute;
  z-index:3;
  overflow:hidden;
  pointer-events:none;
  border:0;
  border-radius:0;
  background:#111;
  box-shadow:none;
  will-change:left,top,width,height,border-radius;
}

.hero-opening img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.hero-opening::after{
  content:"";
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.30);
}


.hero-scroll-cue{
  position:absolute;
  z-index:8;
  right:50%;
  bottom:.42rem;
  transform:translateX(50%);
  display:flex;
  align-items:center;
  gap:.28rem;
  padding:.24rem .4rem;
  border:0;
  background:transparent;
  color:rgba(255,255,255,.78);
  font-size:.52rem;
  font-weight:850;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.hero-scroll-cue b{
  display:inline-block;
  font-size:.78rem;
  animation:scrollCue 1.4s ease-in-out infinite;
}
@keyframes scrollCue{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(.22rem)}
}

/* COUNTERS — CLEAN SINGLE IMPLEMENTATION */
.counter-section{
  position:relative;
  left:50%;
  width:100vw;
  margin-left:-50vw;
  margin-top:0;
  margin-bottom:0;
  overflow:hidden;
  z-index:1;
  padding:clamp(2rem,4.5vw,3.25rem) 0;
  background:#0D3156;
  border:0;
  outline:0;
  box-shadow:none;
  isolation:isolate;
}

.counter-section::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(ellipse at 72% 18%,rgba(51,126,194,.30) 0%,rgba(51,126,194,.14) 30%,rgba(51,126,194,0) 68%),
    radial-gradient(ellipse at 18% 24%,rgba(5,25,45,.38) 0%,rgba(5,25,45,.16) 36%,rgba(5,25,45,0) 72%);
  transform:translate3d(-2%,0,0) scale(1.04);
  animation:counterAura 7s ease-in-out infinite alternate;
}

@keyframes counterAura{
  from{transform:translate3d(-2%,0,0) scale(1.04)}
  to{transform:translate3d(2%,0,0) scale(1.07)}
}

/* ALWAYS two columns: 3 years and 200 clients stay on the same horizontal row. */
.counter-grid{
  width:min(calc(100% - var(--page-gutter-total)),86rem);
  margin-inline:auto;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  align-items:center;
  column-gap:clamp(.3rem,2vw,2rem);
}

.counter-card{
  position:relative;
  min-width:0;
  min-height:clamp(5.2rem,8vw,6.6rem);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:clamp(.38rem,1.5vw,.9rem);
  padding:clamp(.75rem,2vw,1.2rem) clamp(.35rem,1.4vw,.9rem);
  background:transparent;
  color:#fff;
  text-align:left;
  opacity:0;
  transform:translateY(1.1rem) scale(.98);
}

.counter-card + .counter-card{
  border:0;
}

.counter-section.is-active .counter-card{
  animation:counterCardIn .68s var(--ease) forwards;
}

.counter-section.is-active .counter-card:nth-child(2){
  animation-delay:.11s;
}

@keyframes counterCardIn{
  0%{opacity:0;transform:translateY(1.1rem) scale(.98)}
  68%{opacity:1;transform:translateY(-.08rem) scale(1.01)}
  100%{opacity:1;transform:translateY(0) scale(1)}
}

.counter-value{
  position:relative;
  flex:0 0 auto;
  color:#fff;
  font-size:clamp(2rem,5.5vw,4.5rem);
  font-weight:1000;
  line-height:1;
  letter-spacing:-.05em;
  font-variant-numeric:tabular-nums;
  text-shadow:0 .35rem 1rem rgba(0,0,0,.28),0 0 1.8rem rgba(105,183,255,.16);
  transform-origin:center;
}

.counter-value::after{
  content:none;
}

.counter-section.is-active .counter-value::after{
  animation:none;
}

.counter-value.is-complete{
  animation:counterPop .38s var(--ease);
}

@keyframes counterPop{
  0%{transform:scale(1)}
  55%{transform:scale(1.10)}
  100%{transform:scale(1)}
}

.counter-label{
  min-width:0;
  margin:0;
  color:#fff;
  font-size:clamp(.56rem,1.75vw,1.02rem);
  font-weight:900;
  line-height:1.08;
  letter-spacing:.018em;
  text-transform:uppercase;
  text-shadow:0 .2rem .65rem rgba(0,0,0,.22);
  overflow-wrap:anywhere;
}

/* INTERNAL PAGES
   The header is fixed over the Home hero only.
   Other pages receive exactly the needed top clearance. */
.page[data-page="servicios"],
.page[data-page="nosotros"],
.page[data-page="contacto"]{
  min-height:calc(100svh - var(--header-h));
  min-height:calc(100dvh - var(--header-h));
  padding-top:calc(var(--header-total-h) + clamp(.75rem,2.4vw,1.15rem));
}

.page[data-page="servicios"] > .section,
.page[data-page="nosotros"] > .section,
.page[data-page="contacto"] > .section{
  margin-top:0;
}

/* SECTIONS */
.section{
  margin-top:clamp(1rem,3vw,1.35rem);
  padding:clamp(.74rem,2.4vw,1rem);
  border:0;
  border-radius:0;
  background:#0D3156;
  box-shadow:none;
}
.section-head{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  align-items:flex-end;
  gap:clamp(.58rem,2vw,1rem);
  margin-bottom:.82rem;
}
.section-kicker{color:#B7DCFF;font-size:.57rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
.section-title{margin:.14rem 0 0;font-size:clamp(1.18rem,4.4vw,1.95rem);font-weight:950;line-height:1.04}
.section-copy{max-width:52rem;margin:.22rem 0 0;color:var(--muted);font-size:clamp(.63rem,2.1vw,.71rem);line-height:1.48}
.section-link{
  min-height:2.22rem;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.42rem .66rem;
  border:0;
  border-radius:.5rem;
  background:var(--action-green);
  color:#fff;
  font-size:.6rem;
  font-weight:850;
  text-decoration:none;
  box-shadow:0 .52rem 1.1rem rgba(0,200,117,.26);
  transition:background .18s ease,transform .18s ease,box-shadow .18s ease;
}
.section-link:hover,
.section-link:focus-visible{
  background:var(--action-orange);
  color:#fff;
  transform:translateY(-.06rem);
  box-shadow:0 .7rem 1.3rem rgba(255,138,0,.30);
  outline:none;
}



.page[data-page="inicio"] > .section{
  margin-top:0;
  padding-top:clamp(1.15rem,3vw,1.65rem);
  border:0;
  border-top:0;
  background:#0D3156;
  box-shadow:none;
}

/* SERVICE CARDS — only photo zooms */
.service-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,22rem),1fr));
  gap:clamp(.78rem,2.2vw,1.25rem);
  align-items:start;
}
.service-card{--accent:#00D084;--accent-dark:#071B15;position:relative;min-width:0;overflow:hidden;border:1px solid rgba(255,255,255,.14);border-radius:.72rem;background:#103A63;box-shadow:0 .9rem 2.1rem rgba(5,34,62,.22)}
.service-main{display:grid}
.service-media{position:relative;aspect-ratio:16/10;overflow:hidden;background:#0B2848}
.service-media img{width:100%;height:100%;object-fit:cover;transition:transform .32s var(--ease)}
.service-card:hover .service-media img{transform:scale(1.05)}
.service-media::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.27)}
.service-label{position:absolute;z-index:2;left:.68rem;bottom:.66rem;max-width:82%;padding:.32rem .48rem;border-radius:.42rem;background:var(--accent);color:#06131E;font-size:.56rem;font-weight:950}
.service-body{display:grid;gap:.5rem;padding:clamp(.78rem,2.4vw,.98rem)}
.service-body h3{margin:0;font-size:clamp(1.04rem,3.1vw,1.45rem);font-weight:950;line-height:1.12;letter-spacing:-.025em}
.service-body p{margin:0;color:#D3E0E7;font-size:clamp(.67rem,2.1vw,.78rem);line-height:1.46}
.service-chips{display:flex;flex-wrap:wrap;gap:.32rem}
.service-chip{min-height:1.72rem;display:inline-flex;align-items:center;padding:.26rem .44rem;border:1px solid rgba(255,255,255,.12);border-radius:.42rem;background:var(--accent-dark);color:#fff;font-size:.55rem;font-weight:800}
.service-actions{display:grid;grid-template-columns:1fr;gap:.4rem}
.card-btn{
  min-height:2.55rem;
  border:0;
  border-radius:.48rem;
  color:#fff;
  font-size:.63rem;
  font-weight:950;
  transition:transform .14s ease,box-shadow .18s ease,background .18s ease;
}
.card-btn:active{
  transform:scale(.975);
}

/* Servicios: única paleta de acciones = rojo + naranja */
.card-btn-detail{
  background:var(--action-red);
  color:#fff;
  box-shadow:0 .58rem 1.18rem rgba(229,57,53,.30);
}
.card-btn-detail:hover,
.card-btn-detail:focus-visible{
  background:var(--action-green);
  color:#fff;
  box-shadow:0 .76rem 1.42rem rgba(0,200,117,.34);
  outline:none;
}

.card-btn-request{
  background:var(--action-orange);
  color:#fff;
  box-shadow:0 .58rem 1.18rem rgba(255,138,0,.30);
}
.card-btn-request:hover,
.card-btn-request:focus-visible{
  background:var(--action-red);
  color:#fff;
  box-shadow:0 .76rem 1.42rem rgba(229,57,53,.34);
  outline:none;
}
.service-expand{display:grid;grid-template-rows:0fr;border-top:0 solid transparent;transition:grid-template-rows .28s var(--ease),border-top-width .18s ease,border-color .18s ease}
.service-expand-inner{min-height:0;overflow:hidden}
.service-card.expanded .service-expand{grid-template-rows:1fr;border-top-width:1px;border-color:rgba(255,255,255,.1)}
.service-expand-content{display:grid;gap:.42rem;padding:0 clamp(.78rem,2.4vw,.98rem) clamp(.78rem,2.4vw,.98rem)}
.service-card.expanded .service-expand-content{padding-top:.7rem}
.service-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,10rem),1fr));gap:.36rem;margin:0;padding:0;list-style:none}
.service-list li{padding:.5rem .56rem;border-radius:.42rem;background:#0D3156;border-left:.22rem solid var(--accent);color:#E2ECF1;font-size:.58rem;line-height:1.36}

/* FILTERS */
.tools{display:grid;gap:.58rem;margin-bottom:.84rem}
.search{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.4rem;padding:.4rem;border:1px solid rgba(255,255,255,.14);border-radius:.5rem;background:#103A67}
.search input{min-width:0;width:100%;border:0;outline:0;background:transparent;color:#fff;padding:.38rem .3rem;font-size:.73rem}
.search input::placeholder{color:#B8CCE0}
.search button{
  width:2rem;
  border:0;
  border-radius:.4rem;
  background:var(--action-red);
  color:#fff;
  transition:background .18s ease,transform .18s ease;
}
.search button:hover,
.search button:focus-visible{
  background:var(--action-orange);
  transform:scale(1.04);
  outline:none;
}

.filter-group{display:grid;gap:.3rem}
.filter-title{color:#D2E5F6;font-size:.56rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.filter-row{
  display:flex;
  flex-wrap:wrap;
  gap:.38rem;
  max-width:100%;
  overflow:visible;
}
.filter-row::-webkit-scrollbar{display:none}
.filter{
  flex:0 0 auto;
  min-height:2rem;
  padding:.4rem .62rem;
  border:0;
  border-radius:.18rem;
  background:var(--action-green);
  color:#fff;
  font-size:.57rem;
  font-weight:760;
  transition:background .18s ease,transform .18s ease,box-shadow .18s ease;
}
.filter:hover,
.filter:focus-visible{
  background:var(--action-orange);
  color:#fff;
  transform:translateY(-.04rem);
  box-shadow:0 .45rem 1rem rgba(255,138,0,.28);
  outline:none;
}
.filter.active{
  background:var(--action-red);
  color:#fff;
  box-shadow:0 .45rem 1rem rgba(229,57,53,.28);
}
.result{color:#D2E3ED;font-size:.58rem}

/* ABOUT */
.about-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,26rem),1fr));
  gap:.68rem;
}
.company-card,.manager-card,.info-card{padding:.82rem;border:1px solid rgba(255,255,255,.15);border-radius:.62rem;background:#103A63;box-shadow:0 .65rem 1.45rem rgba(5,34,62,.18)}
.company-card h3,.info-card h3{margin:0;font-size:.82rem;font-weight:950}
.company-card p,.info-card p{margin:.36rem 0 0;color:#D2E0E7;font-size:.64rem;line-height:1.5}
.company-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,13rem),1fr));gap:.48rem;margin-top:.72rem}
.company-fact{padding:.64rem;border-radius:.46rem;background:#0D3156;border-left:.25rem solid var(--cyan)}
.company-fact strong{display:block;font-size:.62rem}
.company-fact span{display:block;margin-top:.14rem;color:#D3E1E8;font-size:.6rem;line-height:1.4}
.activity-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,14rem),1fr));gap:.46rem;margin:.72rem 0 0;padding:0;list-style:none}
.activity-list li{padding:.62rem;border-radius:.46rem;background:#0D3156;border-left:.24rem solid var(--green);color:#E2EBEF;font-size:.61rem;line-height:1.4}
.management-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr));gap:.68rem;margin-top:.76rem}
.manager-card{display:grid;gap:.52rem}
.manager-head{display:flex;align-items:center;gap:.56rem;min-width:0}
.manager-avatar{width:3.15rem;aspect-ratio:1;display:grid;place-items:center;border-radius:.5rem;background:var(--cyan);color:#052036;font-size:1rem;font-weight:950}
.manager-card:nth-child(2) .manager-avatar{background:var(--purple);color:#fff}
.manager-card h3{margin:0;overflow-wrap:anywhere;font-size:.8rem;font-weight:950}
.manager-card small{display:block;margin-top:.08rem;color:#C8D9E3;font-size:.55rem}
.manager-credential{padding:.56rem .6rem;border-radius:.46rem;background:#0D3156;color:#D8E5EB;font-size:.59rem;line-height:1.42}
.gallery-note{margin:0 0 .65rem;color:#D1E0E7;font-size:.59rem;line-height:1.4}
.experience-gallery{display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:clamp(8rem,24vw,14rem);gap:.5rem}
.gallery-card{position:relative;overflow:hidden;margin:0;border-radius:.58rem;background:#0B2848;box-shadow:0 .7rem 1.5rem rgba(5,34,62,.22)}
.gallery-card:first-child{grid-column:1/-1;grid-row:span 2}
.gallery-card img{width:100%;height:100%;object-fit:cover;transition:transform .32s var(--ease)}
.gallery-card:hover img{transform:scale(1.045)}
.gallery-card::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.24)}
.gallery-caption{position:absolute;z-index:2;right:.54rem;bottom:.54rem;left:.54rem;display:flex;align-items:end;justify-content:space-between;gap:.4rem}
.gallery-caption strong{font-size:.64rem;font-weight:950}
.gallery-caption span{flex:0 0 auto;padding:.24rem .38rem;border-radius:.4rem;background:var(--cyan);color:#052036;font-size:.5rem;font-weight:950}

/* CONTACT */
.contact-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,24rem),1fr));
  gap:.68rem;
}
.contact-actions{
  display:flex;
  flex-wrap:wrap;
  gap:.36rem;
  margin-top:.5rem;
}
.contact-btn{
  flex:1 1 min(100%,10rem);
  min-height:2.45rem;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:0;
  border-radius:.46rem;
  background:var(--action-green);
  color:#fff;
  font-size:.58rem;
  font-weight:820;
  text-decoration:none;
  transition:background .18s ease,transform .18s ease,box-shadow .18s ease;
}
.contact-btn:hover,
.contact-btn:focus-visible{
  background:var(--action-orange);
  color:#fff;
  transform:translateY(-.04rem);
  box-shadow:0 .55rem 1.1rem rgba(255,138,0,.28);
  outline:none;
}

/* DIALOG */
dialog{
  width:auto;
  max-width:calc(100dvw - var(--page-gutter-total));
  max-height:calc(100dvh - var(--page-gutter-total));
  padding:0;
  border:0;
  background:transparent;
  color:#173038;
}
dialog::backdrop{background:rgba(0,0,0,.64)}
.sheet{
  width:min(40rem,calc(100dvw - var(--page-gutter-total)));
  max-width:100%;
  max-height:calc(100dvh - var(--page-gutter-total));
  overflow:auto;
  border-radius:.62rem;
  background:#F8FBFB;
  box-shadow:0 1.7rem 3.8rem rgba(0,0,0,.34);
}
.sheet-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.5rem;padding:.76rem;border-bottom:1px solid rgba(10,65,76,.1)}
.sheet-head h2{margin:0;font-size:.92rem;font-weight:950}
.sheet-close{
  width:2.12rem;
  aspect-ratio:1;
  border:0;
  border-radius:.4rem;
  background:var(--action-red);
  color:#fff;
  transition:background .18s ease,transform .18s ease;
}
.sheet-close:hover,
.sheet-close:focus-visible{
  background:var(--action-orange);
  transform:rotate(4deg);
  outline:none;
}

.sheet-body{display:grid;gap:.6rem;padding:.8rem}
.sheet-body p{margin:0;color:#5D7278;font-size:.64rem;line-height:1.46}
.choice{display:grid;gap:.3rem;padding:.62rem;border:1px solid rgba(10,65,76,.1);border-radius:.46rem;background:#fff}
.choice span{color:#708489;font-size:.57rem}

/* FOOTER */
.footer{
  margin-top:1.4rem;
  border-top:1px solid rgba(255,255,255,.14);
  background:#0D3156;
}
.footer-row{display:grid;gap:.7rem;padding-block:1.05rem}
.footer strong{font-size:.74rem;font-weight:950}
.footer p{margin:.24rem 0 0;color:#D4E2E9;font-size:.56rem;line-height:1.42}
.footer-links{display:flex;flex-wrap:wrap;gap:.38rem;max-width:100%}
.footer-links button{
  border:0;
  background:var(--action-green);
  color:#fff;
  padding:.34rem .52rem;
  border-radius:.36rem;
  font-size:.57rem;
  font-weight:650;
  text-decoration:none;
  transition:background .18s ease,transform .18s ease;
}
.footer-links button:hover,
.footer-links button:focus-visible{
  background:var(--action-red);
  transform:translateY(-.04rem);
  outline:none;
}


/* RESPONSIVE — single consolidated implementation */
@media(max-width:29.99rem){
  :root{--header-h:4.5rem}
  .hero-actions{display:grid;grid-template-columns:1fr;width:100%}
  .hero-actions .btn{width:100%}
  .hero-preview{flex-basis:clamp(4.7rem,26vw,5.55rem)}
  .counter-section{padding:1.35rem 0}
  .counter-card{min-height:4.6rem;gap:.28rem;padding:.65rem .16rem}
  .counter-value{font-size:clamp(1.7rem,8.4vw,2.4rem)}
  .counter-label{font-size:clamp(.48rem,2.45vw,.7rem);line-height:1.08}
  .section{padding-inline:0}
  .section-link{width:100%}
  .filter{min-height:2.2rem;padding:.46rem .62rem}
  .experience-gallery{grid-template-columns:1fr;grid-auto-rows:auto}
  .gallery-card,.gallery-card:first-child{grid-column:auto;grid-row:auto;min-height:clamp(11rem,62vw,17rem)}
  .gallery-caption{align-items:flex-end;flex-wrap:wrap}
  .contact-btn{flex-basis:100%}
  .footer-links button{flex:1 1 8rem;min-height:2.35rem}
}


@media(max-width:24.99rem){
  .hero-scroll-cue{display:none}
}

@media(max-width:21.99rem){
  :root{--page-gutter:.78rem;--page-gutter-total:1.56rem}
  .counter-card{gap:.18rem;padding-inline:.08rem}
  .counter-value{font-size:1.65rem}
  .counter-label{font-size:.47rem}
}

@media(min-width:30rem){
  .service-actions{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(min-width:56rem){
  .hero-content{grid-template-columns:minmax(0,1fr) minmax(18rem,.78fr);align-items:end}
  .hero-bottom{width:min(100%,33rem);justify-self:end}
  .hero-preview{flex-basis:clamp(6rem,10vw,7.4rem)}
  .experience-gallery{grid-template-columns:1.4fr 1fr 1fr;grid-auto-rows:clamp(9rem,16vw,14rem)}
  .gallery-card:first-child{grid-column:1;grid-row:span 2}
  .footer-row{grid-template-columns:minmax(0,1fr) auto;align-items:end}
}


@media(min-width:100rem){
  .section-title{font-size:2rem}
  .hero-content{gap:1.2rem}
}

@media(hover:none),(pointer:coarse){
  .service-card:hover .service-media img,
  .gallery-card:hover img,
  .hero-preview:hover img{transform:none}
}

@media(max-height:42rem){
  .hero-content{gap:.44rem;padding-top:calc(var(--header-total-h) + .32rem);padding-bottom:.68rem}
  .hero-title{font-size:clamp(1.65rem,6.8vw,3.4rem);line-height:.94}
  .hero-description{font-size:clamp(.7rem,2.3vw,.84rem);line-height:1.38}
  .hero-chip{min-height:1.42rem;padding:.2rem .34rem;font-size:.5rem}
  .btn{min-height:2.36rem;padding:.48rem .7rem}
  .hero-preview{flex-basis:clamp(4.35rem,18vw,5.65rem)}
  .hero-cards{padding-bottom:.18rem}
  .hero-scroll-cue{display:none}
}

@media(max-height:35rem){
  .hero-kicker,.hero-counter{font-size:.5rem}
  .hero-title{font-size:clamp(1.48rem,6vw,2.8rem)}
  .hero-description{max-width:32rem}
  .hero-preview{flex-basis:4.2rem}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .brand-logo__object{animation:none!important}
}

/* Layout utilities migrated from legacy inline styles */
.section--compact-top{margin-top:.7rem}
.section-head--spaced{margin-top:1rem}

.brand-logo__front img,.brand-logo__back img,.brand-logo__slice img{width:100%;height:100%;object-fit:contain}

/* Service accent variables moved out of generated inline styles */
.service-card--seguridad{--accent:#00D084;--accent-dark:#071B15;}
.service-card--emergencias{--accent:#FF3B30;--accent-dark:#220807;}
.service-card--extintores{--accent:#FF9500;--accent-dark:#211000;}
.service-card--capacitacion{--accent:#8E44FF;--accent-dark:#14071F;}
.service-card--ambiente{--accent:#3DDC84;--accent-dark:#071B12;}
.service-card--transporte{--accent:#168CFF;--accent-dark:#071426;}
.service-card--construccion{--accent:#FFC400;--accent-dark:#201800;}
.service-card--automotriz{--accent:#00C7FF;--accent-dark:#061A20;}
.service-card--maquinaria{--accent:#FF7A00;--accent-dark:#211000;}
.service-card--ferreteria{--accent:#D33CFF;--accent-dark:#1A071F;}
.service-card--combustibles{--accent:#FF2D55;--accent-dark:#21070E;}
.service-card--consultoria{--accent:#4D7CFE;--accent-dark:#091326;}