/* KIWI surf — hoja de estilos única
   Tokens normalizados. Un solo lugar para cambiar la marca. */

@font-face{font-family:'Gilroy';src:url('../fonts/Gilroy.otf') format('opentype');font-weight:800;font-style:normal;font-display:swap;}
@font-face{font-family:'Lacotte';src:url('../fonts/Lacotte.otf') format('opentype');font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:'KiwiScript';src:url('../fonts/KiwiScript.otf') format('opentype');font-weight:400;font-style:normal;font-display:swap;}

:root{
  /* Color */
--navy: #10627E;
  --navy-soft: #3A4A5E;
  --ink-soft: #0B1B33;
  --green: #C2ED64;
  --green-deep: #6CAF02;
  --lime: #FFFFFF;
  --cream: #FBFCE9;
  --sky: #3DCDF9;
  --sky-deep: #0A192F;
  --orange: #FFC45C;
  --white: #FFFFFF;
  --wa: #25D366;

  /* Espacio */
  --space-1:8px;
  --space-2:16px;
  --space-3:24px;
  --space-4:40px;
  --space-5:72px;

  /* Forma */
  --radius-sm:16px;
  --radius-card:20px;
  --radius-pill:100px;
  --border:3px;
  --shadow:4px 4px 0 var(--navy);
  --shadow-md:6px 6px 0 var(--navy);
  --shadow-lg:8px 8px 0 var(--navy);

  /* Tipografía */
  --font-display:'Gilroy','Poppins',system-ui,sans-serif;
  --font-ui:'Gilroy','Poppins',system-ui,sans-serif;
  --font-body:'Poppins',system-ui,sans-serif;
  --font-script:'KiwiScript',Georgia,serif;

  --max:1180px;
  --nav-h:150px;
}

*{box-sizing:border-box;}

html{scroll-padding-top:var(--nav-h);scroll-behavior:smooth;}

body{
  margin:0;
  font-family:var(--font-body);
  color:var(--navy);
  background:var(--cream);
  overflow-x:clip;
}

img{max-width:100%;display:block;}
h1,h2,h3,h4,figure,figcaption{margin:0;}
a{color:var(--navy);text-decoration:none;}
a:hover{color:var(--green-deep);}
button{font:inherit;}

*:focus-visible{outline:3px solid var(--sky);outline-offset:3px;border-radius:4px;}

.wrap{max-width:var(--max);margin:0 auto;padding:0 clamp(18px,4vw,28px);}
.display{font-family:var(--font-display);font-weight:400;line-height:.96;text-wrap:balance;}
.ui{font-family:var(--font-ui);font-weight:800;}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}

/* ---------- Animación de entrada ---------- */
[data-reveal]{opacity:0;transform:translateY(28px);transition:opacity .75s cubic-bezier(.22,1,.36,1),transform .75s cubic-bezier(.22,1,.36,1);}
[data-reveal].is-visible{opacity:1;transform:none;}
.no-js [data-reveal]{opacity:1;transform:none;}

@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes bob{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-16px) rotate(2deg)}}
@keyframes ping{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.45);opacity:.55}}
@keyframes cardIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;}
  [data-reveal]{opacity:1 !important;transform:none !important;}
}

/* ---------- Botones ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  font-family:var(--font-ui);font-weight:800;font-size:16px;
  padding:15px 28px;border-radius:var(--radius-pill);
  border:var(--border) solid var(--navy);
  background:none;cursor:pointer;text-align:center;white-space:nowrap;
  box-shadow:var(--shadow);
  transition:transform .15s ease,box-shadow .15s ease,background .2s ease;
}
.btn:hover{transform:translate(-2px,-2px);box-shadow:var(--shadow-lg);}
.btn:active{transform:translate(1px,1px);box-shadow:2px 2px 0 var(--navy);}
.btn--primary{background:var(--green);color:var(--navy);}
.btn--primary:hover{background:#78C402;color:var(--navy);}
.btn--ghost{background:var(--white);color:var(--navy);}
.btn--ghost:hover{background:var(--cream);color:var(--navy);}
.btn--lime{background:var(--lime);color:var(--navy);}
.btn--lime:hover{background:#CEF37A;color:var(--navy);}
.btn--navy{background:var(--navy);color:var(--white);}
.btn--navy:hover{background:var(--navy-soft);color:var(--white);}
.btn--sm{padding:11px 20px;font-size:14px;box-shadow:3px 3px 0 var(--navy);}
.btn--block{width:100%;}

/* ---------- Nav ---------- */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:110;
  padding:16px 0;
  transition:background .3s ease,box-shadow .3s ease,padding .3s ease;
}
.nav.is-scrolled{
  background:rgba(251,252,233,.96);
  backdrop-filter:blur(10px);
  box-shadow:0 2px 0 var(--navy),0 6px 18px rgba(11,27,51,.08);
  padding:8px 0;
}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);}

.nav__logo{flex:none;}
.nav__logo img{
  height:116px;width:auto;
  filter:drop-shadow(0 3px 8px rgba(0,0,0,.35));
  transition:height .3s ease,filter .3s ease;
}
.nav.is-scrolled .nav__logo img{height:84px;filter:none;}

.nav__right{display:flex;align-items:center;gap:clamp(14px,2vw,26px);}

.nav__menu{display:flex;align-items:center;gap:clamp(14px,1.9vw,26px);}
.nav__link{
  font-family:var(--font-ui);font-weight:800;font-size:15px;
  color:var(--white);position:relative;padding:4px 0;white-space:nowrap;
  transition:color .25s ease;
}
.nav.is-scrolled .nav__link{color:var(--navy);}
.nav__link::after{
  content:'';position:absolute;left:0;bottom:-3px;height:3px;width:0;
  background:var(--green);border-radius:2px;transition:width .22s ease;
}
.nav__link:hover::after,.nav__link.is-active::after{width:100%;}
.nav__link:hover{color:var(--white);}
.nav.is-scrolled .nav__link:hover{color:var(--navy);}

.nav__cta{padding:11px 22px;font-size:14px;}

/* Redes del header — siempre visibles, también en móvil */
.nav__social{display:flex;align-items:center;gap:8px;flex:none;}
.nav__social a{
  width:40px;height:40px;border-radius:50%;flex:none;
  display:flex;align-items:center;justify-content:center;
  border:2px solid rgba(255,255,255,.75);
  background:rgba(11,27,51,.45);color:var(--white);
  transition:transform .2s ease,box-shadow .2s ease,background .2s ease,border-color .2s ease,color .2s ease;
}
.nav__social a:hover{
  transform:translateY(-3px);
  background:var(--lime);border-color:var(--navy);color:var(--navy);
  box-shadow:3px 3px 0 var(--navy);
}
.nav.is-scrolled .nav__social a{
  border-color:var(--navy);background:var(--white);color:var(--navy);
  box-shadow:2px 2px 0 var(--navy);
}
.nav.is-scrolled .nav__social a:hover{background:var(--lime);}

.nav__toggle{
  display:none;background:none;border:none;cursor:pointer;padding:8px;
  flex:none;z-index:130;
}
.nav__toggle span{
  display:block;width:26px;height:3px;margin:5px 0;border-radius:2px;
  background:var(--white);transition:background .3s ease,transform .3s ease,opacity .2s ease;
}
.nav.is-scrolled .nav__toggle span{background:var(--navy);}
.nav__toggle.is-open span{background:var(--navy);}
.nav__toggle.is-open span:nth-child(1){transform:translateY(8px) rotate(45deg);}
.nav__toggle.is-open span:nth-child(2){opacity:0;}
.nav__toggle.is-open span:nth-child(3){transform:translateY(-8px) rotate(-45deg);}

.backdrop{
  position:fixed;inset:0;z-index:105;
  background:rgba(11,27,51,.6);backdrop-filter:blur(4px);
  opacity:0;pointer-events:none;transition:opacity .3s ease;
}
.backdrop.is-open{opacity:1;pointer-events:auto;}

/* ---------- Hero ---------- */
.hero{
  position:relative;min-height:100svh;
  display:flex;align-items:center;
  padding:clamp(150px,20vw,190px) 0 clamp(140px,16vw,180px);
  background-color:var(--navy);
  background-image:
    linear-gradient(180deg,rgba(11,27,51,.6) 0%,rgba(11,27,51,.15) 32%),
    linear-gradient(90deg,rgba(11,27,51,.92) 0%,rgba(11,27,51,.62) 52%,rgba(11,27,51,.3) 100%),
    url('../img/hero.jpg');
  background-size:cover;background-position:center 36%;background-repeat:no-repeat;
  overflow:hidden;
}
.hero__glow{
  position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(circle at 78% 42%,rgba(61,205,249,.16),transparent 60%);
}
.hero .wrap{
  position:relative;z-index:2;
  display:grid;grid-template-columns:1.12fr .88fr;
  gap:clamp(24px,4vw,48px);align-items:center;
}
.hero__eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--font-ui);font-weight:800;font-size:13px;
  color:var(--navy);background:var(--lime);
  padding:7px 16px;border-radius:var(--radius-pill);
  border:2px solid var(--navy);box-shadow:3px 3px 0 var(--navy);
  margin-bottom:22px;
}
.hero h1{
  font-size:clamp(46px,7.4vw,96px);
  color:var(--white);letter-spacing:-.5px;
  max-width:17ch;
  text-shadow:4px 4px 0 rgba(11,27,51,.42);
}
.hero h1 em{font-style:normal;color:var(--lime);}
.hero__lead{
  font-size:clamp(16px,1.4vw,18px);line-height:1.65;color:var(--white);
  max-width:52ch;margin:26px 0 32px;text-wrap:pretty;
}
.hero__ctas{display:flex;gap:14px;flex-wrap:wrap;align-items:center;}

.hero__facts{
  display:inline-flex;align-items:center;gap:14px;flex-wrap:wrap;
  margin-top:30px;padding:10px 20px;
  background:rgba(11,27,51,.7);border:2px solid rgba(255,255,255,.28);
  border-radius:var(--radius-pill);backdrop-filter:blur(8px);
}
.hero__facts span{font-size:13px;color:var(--white);font-weight:500;}
.hero__facts strong{font-family:var(--font-ui);font-weight:800;color:var(--lime);}
.hero__facts .sep{color:rgba(255,255,255,.4);}

.hero__art{position:relative;display:flex;justify-content:center;align-items:center;}
.hero__art img{
  width:min(440px,94%);
  max-height:56svh;object-fit:contain;
  filter:drop-shadow(0 25px 42px rgba(0,0,0,.45));
  animation:bob 5s ease-in-out infinite;
}
.hero__wave{position:absolute;bottom:-1px;left:0;width:100%;line-height:0;z-index:3;}

@media (max-height:720px) and (min-width:901px){
  .hero{padding:clamp(120px,14vh,150px) 0 clamp(110px,13vh,140px);}
  .hero h1{font-size:clamp(40px,5.4vw,64px);}
  .nav__logo img{height:88px;}
  .nav.is-scrolled .nav__logo img{height:68px;}
}
.hero__wave svg{width:100%;height:auto;display:block;}

/* ---------- Marquee ---------- */
.marquee{
  background:var(--navy);overflow:hidden;padding:16px 0;
  border-top:var(--border) solid var(--green);
  border-bottom:var(--border) solid var(--green);
  position:relative;z-index:4;
}
.marquee__track{
  display:flex;width:max-content;
  animation:marquee 38s linear infinite;
  font-family:var(--font-ui);font-weight:800;font-size:19px;color:var(--lime);
}
@media (hover:hover){.marquee:hover .marquee__track{animation-play-state:paused;}}
.marquee__track span{padding:0 26px;white-space:nowrap;}
.marquee__track .dot{color:var(--orange);font-size:11px;}

/* ---------- Secciones ---------- */
.section{position:relative;padding:clamp(70px,9vw,104px) 0 clamp(118px,13vw,158px);}
.section__head{max-width:720px;margin-bottom:clamp(38px,5vw,58px);}
.section__head.is-center{text-align:center;margin-left:auto;margin-right:auto;}
.section__badge{
  display:inline-block;font-family:var(--font-ui);font-weight:800;font-size:12px;
  text-transform:uppercase;letter-spacing:.09em;
  background:var(--navy);color:var(--lime);
  padding:6px 15px;border-radius:var(--radius-pill);margin-bottom:16px;
}
.section__head h2{font-size:clamp(38px,5.6vw,72px);line-height:.98;max-width:20ch;}
.section__head.is-center h2{margin-left:auto;margin-right:auto;}
.section__head p{
  font-size:clamp(16px,1.3vw,18px);line-height:1.68;color:var(--ink-soft);
  margin-top:18px;max-width:58ch;text-wrap:pretty;
}
.section__head.is-center p{margin-left:auto;margin-right:auto;}

.wave{position:absolute;bottom:-1px;left:0;width:100%;line-height:0;z-index:2;pointer-events:none;}
.wave svg{width:100%;height:auto;display:block;}

/* ---------- Actividades ---------- */
.activities{background:var(--lime);}

.filters{
  position:sticky;top:108px;z-index:60;
  display:flex;gap:10px;flex-wrap:wrap;align-items:center;
  margin:0 -14px 34px;padding:12px 14px;
  background:rgba(194,237,100,.94);
  backdrop-filter:blur(8px);
  border-radius:var(--radius-pill);
  transition:box-shadow .25s ease;
}
.filters.is-stuck{box-shadow:0 6px 18px rgba(11,27,51,.16);}
.filters__count{
  margin-left:auto;padding-right:8px;flex:none;
  font-family:var(--font-ui);font-weight:800;font-size:13px;color:var(--green-deep);
}
.filter{
  font-family:var(--font-ui);font-weight:800;font-size:14px;
  background:var(--white);color:var(--navy);
  padding:11px 22px;border-radius:var(--radius-pill);
  border:var(--border) solid var(--navy);cursor:pointer;
  box-shadow:3px 3px 0 var(--navy);
  transition:transform .2s ease,box-shadow .2s ease,background .2s ease,color .2s ease;
}
.filter:hover{transform:translateY(-2px);box-shadow:var(--shadow);background:var(--cream);}
.filter.is-active{background:var(--navy);color:var(--lime);box-shadow:4px 4px 0 var(--green-deep);}

.price-note{
  display:flex;align-items:flex-start;gap:10px;
  max-width:760px;margin:0 0 32px;
  font-size:13.5px;line-height:1.6;color:var(--green-deep);
}
.price-note svg{flex:none;margin-top:2px;}
.price-note strong{font-family:var(--font-ui);font-weight:800;color:var(--navy);}

.act-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-3);}
.act{
  background:var(--white);border:var(--border) solid var(--navy);
  border-radius:var(--radius-card);overflow:hidden;box-shadow:var(--shadow);
  display:flex;flex-direction:column;
  transition:transform .25s ease,box-shadow .25s ease;
}
.act:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg);}
.act.is-hidden{display:none !important;}
.act__photo{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--navy);}
.act__photo img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease;}
.act:hover .act__photo img{transform:scale(1.07);}
.act__tag{
  position:absolute;top:12px;left:12px;z-index:2;
  font-family:var(--font-ui);font-weight:800;font-size:11px;color:var(--navy);
  background:var(--lime);padding:5px 12px;border-radius:var(--radius-pill);
  border:2px solid var(--navy);box-shadow:2px 2px 0 var(--navy);
}

.act__head{
  background:var(--green);border-top:var(--border) solid var(--navy);
  padding:16px 20px;
  display:flex;align-items:flex-end;justify-content:space-between;gap:var(--space-2);
}
.act__head h3{font-family:var(--font-ui);font-weight:800;font-size:19px;color:var(--navy);}
.act__place{display:flex;align-items:center;gap:6px;margin-top:5px;font-size:13px;color:var(--navy);}
.act__place svg{flex:none;}
.act__price{text-align:right;flex:none;}
.act__price strong{
  display:block;font-family:var(--font-ui);font-weight:800;font-size:18px;
  color:var(--navy);white-space:nowrap;
}
.act__price span{display:block;font-size:11px;color:var(--navy);margin-top:3px;max-width:11ch;margin-left:auto;line-height:1.3;}

.act__body{padding:18px 20px 20px;display:flex;flex-direction:column;flex:1;}
.act__body p{font-size:14px;line-height:1.55;color:var(--ink-soft);margin:0 0 16px;flex:1;}
.act__body .btn{background:var(--green);color:var(--navy);}
.act__body .btn:hover{background:#78C402;color:var(--navy);}
.act__meta{
  display:flex;flex-direction:column;gap:9px;
  padding-top:14px;margin-bottom:18px;
  border-top:1px dashed rgba(11,27,51,.22);
}
.act__meta div{display:flex;align-items:flex-start;gap:9px;font-size:13px;color:var(--navy);}
.act__meta svg{flex:none;margin-top:1px;color:var(--green-deep);}
.act__meta strong{font-family:var(--font-ui);font-weight:800;}

/* ---------- Confianza ---------- */
.why{background:var(--white);}
.logistics{
  display:grid;grid-template-columns:repeat(4,1fr);
  background:var(--cream);border:var(--border) solid var(--navy);
  border-radius:var(--radius-card);overflow:hidden;
  box-shadow:var(--shadow);
  margin-top:clamp(40px,6vw,64px);
}
.logi{
  display:flex;flex-direction:column;gap:7px;
  padding:24px 22px;
  border-right:1px solid rgba(11,27,51,.14);
}
.logi:last-child{border-right:none;}
.logi__label{
  display:flex;align-items:center;gap:7px;
  font-family:var(--font-ui);font-weight:800;font-size:11px;
  text-transform:uppercase;letter-spacing:.09em;color:var(--green-deep);
}
.logi__label svg{flex:none;}
.logi strong{font-family:var(--font-ui);font-weight:800;font-size:clamp(19px,1.9vw,23px);line-height:1.1;color:var(--navy);}
.logi span{font-size:13px;color:var(--ink-soft);line-height:1.45;}

.pillars{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:clamp(28px,4vw,52px);
  border-top:1px solid rgba(11,27,51,.14);padding-top:clamp(28px,4vw,44px);
}
.pillar{display:flex;flex-direction:column;gap:14px;}
.pillar__top{display:flex;align-items:center;gap:14px;}
.pillar__num{font-family:var(--font-ui);font-weight:800;font-size:12px;letter-spacing:.14em;color:var(--green-deep);}
.pillar__rule{flex:1;height:1px;background:rgba(11,27,51,.14);}
.pillar h3{font-family:var(--font-display);font-weight:400;font-size:clamp(24px,2.4vw,30px);line-height:1.1;max-width:18ch;}
.pillar p{font-size:15px;line-height:1.75;color:var(--ink-soft);max-width:40ch;text-wrap:pretty;}

/* ---------- Testimonios ---------- */
.voices{background:var(--cream);}
.voices__grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-3);
  align-items:stretch;
}
.voice{
  display:flex;flex-direction:column;justify-content:space-between;gap:20px;
  background:var(--white);border:var(--border) solid var(--navy);
  border-radius:var(--radius-card);padding:28px 26px;box-shadow:var(--shadow);
  transition:transform .2s ease,box-shadow .2s ease;
}
.voice:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);}
.voice blockquote{
  margin:0;font-family:var(--font-display);font-weight:400;
  font-size:clamp(20px,2vw,25px);line-height:1.28;color:var(--navy);
  text-wrap:pretty;
}
.voice blockquote::before{content:'\201C';color:var(--green);margin-right:2px;}
.voice blockquote::after{content:'\201D';color:var(--green);}
.voice figcaption{display:flex;flex-direction:column;gap:3px;padding-top:16px;border-top:1px solid rgba(11,27,51,.14);}
.voice figcaption strong{font-family:var(--font-ui);font-weight:800;font-size:15px;color:var(--navy);}
.voice figcaption span{font-size:13px;color:var(--ink-soft);}

/* Estado vacío: visible que falta contenido, imposible publicarlo por descuido */
.voice.is-empty{
  background:repeating-linear-gradient(45deg,#F4F3E4,#F4F3E4 12px,#EDEBD8 12px,#EDEBD8 24px);
  border-style:dashed;box-shadow:none;
}
.voice.is-empty:hover{transform:none;box-shadow:none;}
.voice.is-empty blockquote{color:var(--ink-soft);font-size:18px;}
.voice.is-empty blockquote::before,.voice.is-empty blockquote::after{color:rgba(11,27,51,.3);}
.voice.is-empty figcaption strong,.voice.is-empty figcaption span{color:rgba(11,27,51,.45);}
.voices__todo{
  max-width:660px;margin:28px auto 0;text-align:center;
  font-size:13px;line-height:1.6;color:var(--ink-soft);
  background:var(--white);border:2px dashed rgba(11,27,51,.3);
  border-radius:var(--radius-sm);padding:16px 20px;
}

/* ---------- Galería ---------- */
.moments{background:var(--navy);overflow:hidden;}
.moments .section__head h2{color:var(--white);}
.moments .section__head p{color:rgba(255,255,255,.88);}

.slider{position:relative;width:100%;overflow:hidden;cursor:grab;touch-action:pan-y;}
.slider:active{cursor:grabbing;}
.slider__track{display:flex;gap:22px;transition:transform .55s cubic-bezier(.4,0,.2,1);will-change:transform;}
.slider__slide{
  width:var(--slide-w,62%);flex:none;aspect-ratio:16/10;position:relative;
  border-radius:18px;overflow:hidden;
  border:1px solid rgba(255,255,255,.18);background:var(--navy-soft);
  opacity:.4;transform:scale(.9);
  transition:opacity .5s ease,transform .5s cubic-bezier(.4,0,.2,1),box-shadow .5s ease;
}
.slider__slide.is-active{
  opacity:1;transform:scale(1);
  border-color:var(--lime);
  box-shadow:0 18px 40px rgba(0,0,0,.45);
}
.slider__slide img{width:100%;height:100%;object-fit:cover;pointer-events:none;}
.slider__slide figcaption{
  position:absolute;bottom:12px;left:12px;
  font-family:var(--font-ui);font-weight:800;font-size:12px;
  background:rgba(11,27,51,.86);color:var(--white);
  padding:6px 13px;border-radius:var(--radius-pill);backdrop-filter:blur(4px);
  opacity:0;transform:translateY(6px);transition:opacity .4s ease .1s,transform .4s ease .1s;
}
.slider__slide.is-active figcaption{opacity:1;transform:none;}
.slider__hint{
  display:none;margin:18px auto 0;width:max-content;
  font-size:12px;color:rgba(255,255,255,.6);
}
.slider__fade{position:absolute;top:0;bottom:0;width:12%;pointer-events:none;z-index:2;}
.slider__fade--l{left:0;background:linear-gradient(90deg,var(--navy) 0%,rgba(11,27,51,0) 100%);}
.slider__fade--r{right:0;background:linear-gradient(270deg,var(--navy) 0%,rgba(11,27,51,0) 100%);}

.dots{display:flex;justify-content:center;margin-top:30px;}
.dots__inner{position:relative;display:flex;gap:var(--space-1);}
.dots button{width:26px;height:22px;padding:9px 0;border:none;background:none;cursor:pointer;display:block;}
.dots button span{display:block;width:26px;height:4px;border-radius:2px;background:rgba(255,255,255,.28);transition:background .2s ease;}
.dots button:hover span{background:rgba(255,255,255,.6);}
.dots__bar{
  position:absolute;top:9px;left:0;width:26px;height:4px;border-radius:2px;
  background:var(--lime);pointer-events:none;
  transition:transform .45s cubic-bezier(.4,0,.2,1);
}

/* ---------- Cita ---------- */
.quote{background:var(--cream);text-align:center;padding:clamp(80px,10vw,120px) 0 clamp(120px,14vw,160px);position:relative;}
.quote p{
  font-family:var(--font-display);font-weight:400;
  font-size:clamp(34px,5.6vw,66px);line-height:1.1;
  max-width:26ch;margin:0 auto;text-wrap:balance;
}
.quote p span{color:var(--sky-deep);}
.quote__sig{margin-top:28px;font-family:var(--font-script);font-size:30px;color:var(--green-deep);}

/* ---------- FAQ ---------- */
.faq{background:var(--white);}
.faq__list{max-width:820px;margin:0 auto;display:flex;flex-direction:column;gap:14px;}
.faq__item{
  background:var(--cream);border:var(--border) solid var(--navy);
  border-radius:var(--radius-sm);overflow:hidden;box-shadow:var(--shadow);
  transition:box-shadow .2s ease;
}
.faq__item:hover{box-shadow:var(--shadow-md);}
.faq__q{
  width:100%;background:none;border:none;text-align:left;cursor:pointer;
  padding:22px 24px;
  display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);
  font-family:var(--font-ui);font-weight:800;font-size:17px;color:var(--navy);
}
.faq__icon{
  width:32px;height:32px;border-radius:50%;flex:none;
  background:var(--lime);border:2px solid var(--navy);
  display:flex;align-items:center;justify-content:center;
  font-size:19px;font-weight:800;line-height:1;
  transition:transform .25s ease,background .25s ease;
}
.faq__item.is-open .faq__icon{transform:rotate(45deg);background:var(--orange);}
.faq__a{max-height:0;overflow:hidden;transition:max-height .32s ease;}
.faq__a p{margin:0;padding:0 24px 22px;font-size:15px;line-height:1.7;color:var(--ink-soft);}

/* ---------- CTA final ---------- */
.cta{background:var(--green);text-align:center;}
.cta h2{font-size:clamp(38px,5.6vw,68px);line-height:.99;color:var(--navy);max-width:20ch;margin:0 auto;}
.cta__lead{
  font-size:clamp(16px,1.4vw,18px);line-height:1.65;color:var(--navy);
  max-width:52ch;margin:20px auto 34px;text-wrap:pretty;
}
.cta__btns{display:flex;gap:var(--space-2);justify-content:center;flex-wrap:wrap;}

.location{
  max-width:660px;margin:46px auto 0;text-align:left;
  background:var(--white);border:var(--border) solid var(--navy);
  border-radius:var(--radius-card);padding:24px 28px;box-shadow:var(--shadow);
  display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);
}
.location h4{display:flex;align-items:center;gap:8px;font-family:var(--font-ui);font-weight:800;font-size:17px;color:var(--navy);margin-bottom:5px;}
.location h4 svg{flex:none;color:var(--green-deep);}
.location p{margin:0;font-size:14px;color:var(--ink-soft);line-height:1.5;}

.cta__social{display:flex;gap:var(--space-2);justify-content:center;margin-top:48px;}
.cta__social a{
  width:52px;height:52px;border-radius:50%;
  background:var(--navy);color:var(--white);
  border:var(--border) solid var(--navy);
  display:flex;align-items:center;justify-content:center;
  transition:transform .15s ease,background .15s ease,color .15s ease;
}
.cta__social a:hover{transform:translateY(-4px);background:var(--white);color:var(--navy);}

/* ---------- Footer ---------- */
.footer{background:var(--navy);color:var(--white);padding:60px 0 96px;}
.footer__top{
  display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:40px;
  padding-bottom:40px;border-bottom:1px solid rgba(255,255,255,.15);
}
.footer__brand{display:flex;flex-direction:column;align-items:flex-start;gap:16px;}
.footer__brand img{
  height:clamp(120px,13vw,158px);width:auto;object-fit:contain;
  filter:drop-shadow(0 4px 14px rgba(0,0,0,.3));
}
.footer__brand p{font-size:14px;color:rgba(255,255,255,.7);max-width:280px;margin:0;line-height:1.55;}
.footer__cols{display:flex;gap:clamp(32px,6vw,64px);flex-wrap:wrap;}
.footer__col{display:flex;flex-direction:column;gap:10px;}
.footer__col h4{font-family:var(--font-ui);font-weight:800;font-size:14px;color:var(--lime);margin-bottom:6px;}
.footer__col a,.footer__col p{margin:0;font-size:14px;color:rgba(255,255,255,.82);line-height:1.5;}
.footer__col a:hover{color:var(--lime);text-decoration:underline;}
.footer__bottom{
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;
  padding-top:24px;font-size:13px;color:rgba(255,255,255,.6);
}

/* ---------- WhatsApp flotante ---------- */
.wa-float{
  position:fixed;bottom:26px;right:26px;z-index:99;
  display:flex;align-items:center;gap:10px;
  background:var(--wa);color:var(--navy);
  border:var(--border) solid var(--navy);border-radius:var(--radius-pill);
  padding:13px 22px;box-shadow:var(--shadow);
  font-family:var(--font-ui);font-weight:800;font-size:14px;
  transition:transform .2s ease,box-shadow .2s ease,background .2s ease;
}
.wa-float:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);background:#2CF074;color:var(--navy);}
.wa-float svg{width:24px;height:24px;fill:currentColor;flex:none;}
.wa-float__ping{
  position:absolute;top:-5px;right:-5px;width:13px;height:13px;
  background:var(--orange);border:2px solid var(--navy);border-radius:50%;
  animation:ping 1.9s infinite;
}

/* ---------- Responsive ---------- */
@media (max-width:1024px){
  .act-grid{grid-template-columns:repeat(2,1fr);}
  .voices__grid{grid-template-columns:1fr 1fr;}
  .voices__grid .voice:last-child{grid-column:1/-1;}
  .logistics{grid-template-columns:repeat(2,1fr);}
  .logi:nth-child(2){border-right:none;}
  .logi:nth-child(1),.logi:nth-child(2){border-bottom:1px solid rgba(11,27,51,.14);}
}

@media (max-width:900px){
  :root{--nav-h:120px;}

  .nav__logo img{height:104px;}
  .nav.is-scrolled .nav__logo img{height:80px;}
  .nav__toggle{display:block;padding:6px;}
  .nav__cta{display:none;}
  .nav__right{gap:10px;}

  .nav__menu{
    position:fixed;top:0;right:0;height:100svh;width:min(330px,86vw);
    background:var(--cream);z-index:120;
    flex-direction:column;justify-content:center;align-items:flex-start;
    padding:40px;gap:24px;
    transform:translateX(100%);transition:transform .3s ease;
    box-shadow:-6px 0 25px rgba(0,0,0,.25);
  }
  .nav__menu.is-open{transform:translateX(0);}
  .nav__menu .nav__link{color:var(--navy);font-size:19px;}
  .nav__menu .nav__cta{display:inline-flex;width:100%;margin-top:var(--space-1);}

  /* Las redes del header siguen visibles, pero por debajo del logo en jerarquía */
  .nav__social{gap:7px;}
  .nav__social a{width:34px;height:34px;border-width:1.5px;}
  .nav__social a svg{width:15px;height:15px;}
  .nav__toggle span{width:24px;}

  .hero .wrap{grid-template-columns:1fr;text-align:center;}
  .hero h1{max-width:none;margin-inline:auto;}
  .hero__lead{margin-inline:auto;}
  .hero__ctas,.hero__facts{justify-content:center;}
  .hero__facts{margin-inline:auto;}
  .hero__art{order:-1;}
  .hero__art img{width:min(230px,52%);max-height:30svh;}

  .filters{top:88px;margin-inline:0;border-radius:var(--radius-card);}
  .filters__count{width:100%;margin-left:0;padding-right:0;text-align:center;}

  .section__head h2,.section__head p{margin-inline:auto;}
  .section__head{text-align:center;}
  .filters{justify-content:center;}

  .location{flex-direction:column;text-align:center;align-items:center;}
  .location h4{justify-content:center;}

  .slider__slide{width:var(--slide-w,84%);opacity:.28;transform:scale(.9);}
  .slider__hint{display:block;}
}

@media (max-width:640px){
  .act-grid{grid-template-columns:1fr;}
  .voices__grid{grid-template-columns:1fr;}
  .voices__grid .voice:last-child{grid-column:auto;}
  .price-note{font-size:13px;}
  .logistics{grid-template-columns:1fr;}
  .logi{border-right:none;border-bottom:1px solid rgba(11,27,51,.14);}
  .logi:last-child{border-bottom:none;}
  .filters{top:84px;gap:8px;padding:10px 12px;}
  .filter{font-size:13px;padding:9px 16px;}
  .nav__logo img{height:92px;}
  .nav.is-scrolled .nav__logo img{height:72px;}
  .nav__social{gap:6px;}
  .nav__social a{width:32px;height:32px;}
  .nav__social a svg{width:14px;height:14px;}
  .footer__top{flex-direction:column;}
  .footer__cols{gap:34px;}
  .wa-float{padding:14px;border-radius:50%;bottom:18px;right:18px;}
  .wa-float span{display:none;}
}

@media (max-width:420px){
  .hero__art img{width:min(180px,46%);max-height:24svh;}
  .nav__logo img{height:78px;}
  .nav.is-scrolled .nav__logo img{height:62px;}
  .nav__social a{width:30px;height:30px;}
  .nav__social a svg{width:13px;height:13px;}
  .nav__toggle span{width:22px;margin:4px 0;}
}

/* Kiwi-Admin CMS toggle support */
[data-kiwi-status="hidden"] {
  display: none !important;
}


/* ============================================================
   SLIDER DE SERVICIOS (portada) — reemplaza al hero anterior
   ============================================================ */
@keyframes hslBar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes hslZoom{from{transform:scale(1.12)}to{transform:scale(1)}}

.hsl{
  position:relative;min-height:100svh;
  display:flex;flex-direction:column;justify-content:flex-end;
  background:var(--navy);overflow:hidden;
}
.hsl__stage{position:absolute;inset:0;}

.hsl__slide{
  position:absolute;inset:0;display:flex;align-items:center;
  opacity:0;visibility:hidden;
  transition:opacity .8s ease,visibility 0s linear .8s;
}
.hsl__slide.is-active{opacity:1;visibility:visible;transition:opacity .8s ease,visibility 0s;}

.hsl__media{position:absolute;inset:0;overflow:hidden;background:var(--navy);--focus:center 50%;}
.hsl__media img{width:100%;height:100%;object-fit:cover;object-position:var(--focus);transform:scale(1.12);}
.hsl__slide.is-active .hsl__media img{animation:hslZoom 9s ease-out forwards;}
.hsl__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:var(--focus);opacity:0;transition:opacity .6s ease;}
.hsl__video.is-ready{opacity:1;}
.hsl__media img.is-hidden{opacity:0;transition:opacity .6s ease;}
.hsl__media::after{
  content:'';position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(11,27,51,.9) 0%,rgba(11,27,51,.62) 46%,rgba(11,27,51,.18) 100%),
    linear-gradient(180deg,rgba(11,27,51,.7) 0%,rgba(11,27,51,.2) 30%,rgba(11,27,51,.55) 70%,rgba(11,27,51,.93) 100%);
}

.hsl__content{
  position:relative;z-index:2;width:100%;
  padding-top:calc(var(--nav-h) + 10px);
  padding-bottom:clamp(200px,26vh,260px);
}
.hsl__content > *{
  opacity:0;transform:translateY(24px);
  transition:opacity .6s ease,transform .6s cubic-bezier(.22,1,.36,1);
}
.hsl__slide.is-active .hsl__content > *{opacity:1;transform:none;}
.hsl__slide.is-active .hsl__content > *:nth-child(1){transition-delay:.12s;}
.hsl__slide.is-active .hsl__content > *:nth-child(2){transition-delay:.20s;}
.hsl__slide.is-active .hsl__content > *:nth-child(3){transition-delay:.28s;}
.hsl__slide.is-active .hsl__content > *:nth-child(4){transition-delay:.36s;}

.hsl__eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--font-ui);font-weight:800;font-size:13px;
  color:var(--navy);background:var(--lime);
  padding:7px 16px;border-radius:var(--radius-pill);
  border:2px solid var(--navy);box-shadow:3px 3px 0 var(--navy);
  margin-bottom:20px;
}
.hsl__title{
  font-size:clamp(46px,7.6vw,104px);color:var(--white);
  letter-spacing:-.5px;max-width:14ch;
  text-shadow:4px 4px 0 rgba(11,27,51,.42);
}
.hsl__hook{
  font-size:clamp(16px,1.45vw,19px);line-height:1.6;color:var(--white);
  max-width:46ch;margin:22px 0 30px;text-wrap:pretty;
}
.hsl__ctas{display:flex;gap:20px;flex-wrap:wrap;align-items:center;}
.hsl__more{
  display:inline-flex;align-items:center;gap:7px;
  font-family:var(--font-ui);font-weight:800;font-size:15px;
  color:var(--white);padding:12px 2px;
  border-bottom:2px solid rgba(255,255,255,.45);
  transition:color .2s ease,border-color .2s ease,gap .2s ease;
}
.hsl__more:hover{color:var(--green);border-color:var(--green);gap:11px;}

/* Controles */
.hsl__bottom{position:relative;z-index:5;padding-bottom:calc(8.4vw + clamp(26px,3.5vh,48px));}
.hsl__bar-row{display:flex;align-items:center;justify-content:center;gap:clamp(16px,3vw,40px);}

.hsl__tabs{display:flex;gap:10px;flex:1;min-width:0;}
.hsl__tab{
  position:relative;flex:1;min-width:0;
  display:flex;align-items:baseline;gap:9px;
  padding:14px 4px 0;margin:0;background:none;border:none;cursor:pointer;
  text-align:left;color:rgba(255,255,255,.62);
  border-top:3px solid rgba(255,255,255,.26);
  transition:color .25s ease;
}
.hsl__tab:hover{color:var(--white);}
.hsl__tab.is-active{color:var(--white);}
.hsl__bar{
  position:absolute;top:-3px;left:0;height:3px;width:100%;
  background:var(--green);transform:scaleX(0);transform-origin:left;
}
.hsl__tab.is-active .hsl__bar{animation:hslBar var(--hsl-dur,6s) linear forwards;}
.hsl.is-paused .hsl__tab.is-active .hsl__bar{animation-play-state:paused;}
.hsl.is-manual .hsl__tab.is-active .hsl__bar{animation:none;transform:scaleX(1);}
.hsl__tab-n{font-family:var(--font-ui);font-weight:800;font-size:11px;letter-spacing:.1em;opacity:.75;}
.hsl__tab-name{
  font-family:var(--font-ui);font-weight:800;font-size:14px;line-height:1.25;
  min-width:0;text-wrap:pretty;
}
@media (max-width:1160px){.hsl__tab-n{display:none;}.hsl__tab{gap:0;}}

.hsl__nav{display:flex;align-items:center;gap:10px;flex:none;}
.hsl__count{min-width:64px;text-align:center;}
.hsl__arrow{
  width:46px;height:46px;border-radius:50%;flex:none;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  border:0;background:rgba(11,27,51,.55);color:var(--white);
  backdrop-filter:blur(6px);
  transition:transform .2s ease,background .2s ease,color .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.hsl__arrow:hover{
  background:var(--lime);color:var(--navy);
  box-shadow:3px 3px 0 rgba(11,27,51,.5);transform:translateY(-2px);
}
.hsl__count{
  font-family:var(--font-ui);font-weight:800;font-size:13px;
  color:rgba(255,255,255,.6);letter-spacing:.06em;padding:0 4px;
}
.hsl__count strong{color:var(--white);font-size:16px;}
.hsl__play{margin-left:8px;}

.hsl__wave{position:absolute;bottom:-1px;left:0;width:100%;line-height:0;z-index:3;pointer-events:none;}
.hsl__wave svg{width:100%;height:auto;display:block;}

@media (max-height:760px) and (min-width:901px){
  .hsl__title{font-size:clamp(40px,5.6vw,68px);}
  .hsl__hook{margin:16px 0 24px;}
  .hsl__content{padding-bottom:clamp(180px,24vh,220px);}
}

@media (max-width:1024px){
  .hsl__nav{justify-content:center;}
  .hsl__content{padding-bottom:clamp(110px,14vh,150px);}
  .hsl__title{max-width:none;}
  .hsl__media::after{
    background:linear-gradient(180deg,rgba(11,27,51,.78) 0%,rgba(11,27,51,.42) 34%,rgba(11,27,51,.72) 72%,rgba(11,27,51,.95) 100%);
  }
}

@media (max-width:640px){
  .hsl__bottom{padding-bottom:calc(8.4vw + 30px);}
  .hsl__ctas{gap:14px;}
  .hsl__ctas .btn{width:100%;}
  .hsl__play span{display:inline;}
}

/* En pantallas anchas el video/foto vertical del hero se recorta mucho más
   (cover sobre una caja panorámica). Cada slide define su propio punto de
   interés vertical vía --focus-desktop inline; aquí se activa solo cuando
   hay espacio horizontal de sobra para notarlo. */
@media (min-width:1025px){
  .hsl__media{--focus:var(--focus-desktop,center 50%);}
}

@media (prefers-reduced-motion: reduce){
  .hsl__slide.is-active .hsl__media img{animation:none;transform:none;}
}


/* ---------- Acordeón de planes (reemplaza las tarjetas .act) ---------- */
.plans{display:flex;flex-direction:column;gap:14px;}
.plan{
  background:var(--white);border:var(--border) solid var(--navy);
  border-radius:var(--radius-card);box-shadow:var(--shadow);overflow:hidden;
  scroll-margin-top:132px;
  transition:box-shadow .25s ease;
}
.plan.is-hidden{display:none !important;}
.plan.is-open{box-shadow:var(--shadow-lg);}
.plan__head{margin:0;}
.plan__q{
  width:100%;background:var(--white);border:0;cursor:pointer;text-align:left;
  padding:18px 20px;display:flex;align-items:center;gap:var(--space-2);
  font-family:var(--font-ui);transition:background .2s ease;
}
.plan__q:hover,.plan.is-open .plan__q{background:var(--green);}
.plan__q:focus-visible{outline:3px solid var(--green-deep);outline-offset:-3px;}
.plan__name{font-family:var(--font-ui);font-weight:800;font-size:19px;color:var(--navy);}
.plan__tag{
  font-family:var(--font-ui);font-weight:800;font-size:11px;color:var(--navy);
  background:var(--cream);border:2px solid var(--navy);
  border-radius:var(--radius-pill);padding:4px 11px;white-space:nowrap;
}
.plan__q:hover .plan__tag,.plan.is-open .plan__tag{background:var(--white);}
.plan__price{margin-left:auto;text-align:right;flex:none;}
.plan__price strong{
  display:block;font-family:var(--font-ui);font-weight:800;font-size:18px;
  color:var(--navy);white-space:nowrap;
}
.plan__price span{display:block;font-size:11px;color:var(--navy);margin-top:2px;line-height:1.3;}
.plan__icon{
  flex:none;width:34px;height:34px;border-radius:50%;
  border:2px solid var(--navy);background:var(--cream);color:var(--navy);
  display:grid;place-items:center;
  transition:transform .3s ease,background .2s ease;
}
.plan.is-open .plan__icon{transform:rotate(180deg);background:var(--white);}
.plan__panel{max-height:0;overflow:hidden;transition:max-height .34s ease;}
.plan__inner{
  padding:22px 20px;border-top:var(--border) solid var(--navy);
  display:grid;grid-template-columns:1.05fr 1fr;gap:var(--space-3);align-items:start;
}
.plan__inner > p{margin:0;font-size:15px;line-height:1.7;color:var(--ink-soft);text-wrap:pretty;}
.plan__tiers{grid-column:1/-1;display:flex;flex-direction:column;gap:6px;margin:2px 0 6px;}
.plan__tier{
  display:grid;grid-template-columns:1fr auto auto;gap:4px 14px;align-items:baseline;
  padding:9px 12px;background:var(--cream);border-radius:10px;
}
.plan__tier-name{font-family:var(--font-ui);font-weight:800;font-size:13.5px;color:var(--navy);}
.plan__tier-info{font-size:12.5px;color:var(--ink-soft);opacity:.85;}
.plan__tier-price{font-family:var(--font-ui);font-weight:800;font-size:13.5px;color:var(--green-deep);white-space:nowrap;}
.plan__side{display:flex;flex-direction:column;gap:16px;}
.plan__meta{display:flex;flex-direction:column;gap:9px;}
.plan__meta div{display:flex;align-items:flex-start;gap:9px;font-size:13.5px;color:var(--navy);}
.plan__meta svg{flex:none;margin-top:1px;color:var(--green-deep);}
.plan__meta strong{font-family:var(--font-ui);font-weight:800;}
.plan__foot{
  display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2);
  padding-top:14px;border-top:1px dashed rgba(11,27,51,.22);
}
.plan__place{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--navy);}
.plan__place svg{flex:none;color:var(--green-deep);}
.plan__foot .btn{background:var(--green);color:var(--navy);margin-left:auto;}
.plan__foot .btn:hover{background:#78C402;color:var(--navy);}

@media (max-width:860px){
  .plan__inner{grid-template-columns:1fr;}
}
@media (max-width:620px){
  .plan__q{padding:16px;gap:12px;}
  .plan__name{flex:1;min-width:0;font-size:17px;}
  .plan__price{margin-left:0;}
  .plan__icon{order:3;flex:none;margin-left:4px;}
  .plan__foot .btn{width:100%;margin-left:0;}
  .plan__tier{grid-template-columns:1fr auto;}
  .plan__tier-info{grid-column:1/-1;}
}

.before-note{
  position:relative;margin-top:var(--space-4);padding:26px 26px 24px;
  background:#FFF6E2;border:4px solid var(--navy);
  border-radius:var(--radius-card);box-shadow:var(--shadow-lg);
}
.before-note__badge{
  display:inline-flex;align-items:center;gap:7px;
  background:var(--orange);color:var(--ink-soft);border:2px solid var(--navy);
  font-family:var(--font-ui);font-weight:800;font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;
  padding:6px 14px;border-radius:var(--radius-pill);margin-bottom:14px;
}
.before-note__badge svg{flex:none;}
.before-note__title{
  display:block;font-family:var(--font-ui);font-weight:800;font-size:19px;
  color:var(--navy);margin-bottom:16px;
}
.before-note__list{
  display:grid;grid-template-columns:repeat(2,1fr);gap:12px 24px;
  list-style:none;margin:0;padding:0;
}
.before-note__list li{
  display:flex;align-items:flex-start;gap:9px;font-size:13.5px;line-height:1.55;color:var(--ink-soft);
  padding:4px 0;
}
.before-note__list svg{flex:none;margin-top:1px;color:var(--green-deep);}
.before-note__list strong{font-family:var(--font-ui);font-weight:800;color:var(--navy);}
.before-note__list-item--strong{
  background:rgba(255,196,92,.4);border:2px solid var(--navy);border-radius:12px;
  padding:9px 12px !important;
}
.before-note__list-item--strong svg{color:var(--navy);}
.before-note__foot{
  margin:18px 0 0;padding-top:14px;border-top:1px dashed rgba(11,27,51,.3);
  font-size:12.5px;color:var(--ink-soft);opacity:.85;
}
@media (max-width:620px){
  .before-note{padding:20px;}
  .before-note__list{grid-template-columns:1fr;}
}

/* ---------- Reseñas de Google ---------- */
.stars{display:flex;gap:3px;color:var(--green-deep);}
.grate{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:var(--space-3);margin-bottom:var(--space-4);
  background:var(--white);border:var(--border) solid var(--navy);
  border-radius:var(--radius-card);box-shadow:var(--shadow);
  padding:22px clamp(20px,3vw,30px);
}
.grate__score{display:flex;flex-direction:column;gap:7px;}
.grate__label{
  font-family:var(--font-ui);font-weight:800;font-size:11px;
  text-transform:uppercase;letter-spacing:.09em;color:var(--green-deep);
}
.grate__row{display:flex;align-items:center;gap:12px;}
.grate__row strong{font-family:var(--font-display);font-weight:400;font-size:40px;line-height:1;color:var(--navy);}
.grate__count{font-size:13px;color:var(--ink-soft);}
.voice .stars{margin-bottom:14px;}
@media (max-width:620px){
  .grate{flex-direction:column;align-items:flex-start;}
  .grate .btn{width:100%;}
}

/* ---------- Firma del footer ---------- */
.madeby{display:inline-flex;align-items:baseline;gap:6px;}
.madeby__brand{font-family:var(--font-ui);font-weight:800;color:var(--lime);letter-spacing:-.2px;}

/* ---------- Slider: la info baja en pantallas pequeñas ---------- */
@media (min-width:641px) and (max-width:900px){
  .hsl__content{padding-top:calc(var(--nav-h) + 4vh);}
}
@media (max-width:640px){
  .hsl__content{
    padding-top:calc(var(--nav-h) + 180px);
    padding-bottom:84px;
  }
  .hsl__title{font-size:clamp(38px,11.5vw,60px);}
  .hsl__hook{font-size:15px;line-height:1.55;margin:14px 0 24px;max-width:36ch;}
  .hsl__more{font-size:14px;padding:10px 2px;}
  .hsl__media::after{
    background:linear-gradient(180deg,rgba(11,27,51,.58) 0%,rgba(11,27,51,.22) 26%,rgba(11,27,51,.68) 66%,rgba(11,27,51,.95) 100%);
  }
}
@media (max-width:420px){
  .hsl__content{padding-top:calc(var(--nav-h) + 166px);}
}

/* ---------- Quiénes somos: texto breve + foto ---------- */
.about{
  display:grid;grid-template-columns:1fr 1.05fr;
  gap:clamp(28px,5vw,64px);align-items:center;
}
.about__text{display:flex;flex-direction:column;align-items:flex-start;gap:18px;}
.about__text h2{font-size:clamp(30px,4vw,52px);max-width:22ch;}
.about__text p{
  margin:0;font-size:clamp(15px,1.3vw,17px);line-height:1.8;
  color:var(--ink-soft);max-width:46ch;text-wrap:pretty;
}
.about__photo{
  margin:0;overflow:hidden;
  border:var(--border) solid var(--navy);
  box-shadow:var(--shadow-md);
  border-radius:clamp(60px,10vw,130px) var(--radius-card) clamp(60px,10vw,130px) var(--radius-card);
  aspect-ratio:4/3;
}
.about__photo img{width:100%;height:100%;object-fit:cover;display:block;}

@media (max-width:860px){
  .about{grid-template-columns:1fr;}
  .about__photo{border-radius:var(--radius-card);aspect-ratio:16/10;}
}

/* ---------- Estabilidad visual (CLS): las dimensiones del HTML no deforman ---------- */
.hsl__media img,.slider__slide img,.about__photo img{width:100%;height:100%;}

/* ---------- Marca de agua del hero: firma quieta, nunca compite con el fondo ---------- */
.hsl__mark{
  position:absolute;z-index:4;pointer-events:none;
  left:72%;top:50%;transform:translate(-50%,-50%);
  width:16vw;max-width:210px;min-width:132px;
  filter:drop-shadow(0 10px 26px rgba(11,27,51,.5));
}
.hsl__mark img{width:100%;height:auto;animation:markSway 9s ease-in-out infinite;transform-origin:50% 62%;}
@keyframes markSway{
  0%{transform:rotate(-5deg);}
  50%{transform:rotate(5deg);}
  100%{transform:rotate(-5deg);}
}
@media (min-width:641px) and (max-width:1024px){
  /* arriba a la derecha y el texto acotado: nunca se cruzan */
  .hsl__mark{
    left:50%;right:auto;top:calc(var(--nav-h) - 8px);transform:translateX(-50%);
    width:clamp(96px,16vw,132px);max-width:none;min-width:0;
  }
  .hsl__content{padding-top:calc(var(--nav-h) + 224px);}
  .hsl__title{max-width:18ch;}
  .hsl__hook{max-width:52ch;}
}
@media (min-width:641px) and (max-width:1024px) and (max-height:820px){
  .hsl__mark{width:clamp(72px,9vw,92px);top:calc(var(--nav-h) - 30px);}
  .hsl__content{padding-top:calc(var(--nav-h) + 132px);padding-bottom:clamp(150px,22vh,200px);}
  .hsl__title{font-size:clamp(40px,5.4vw,58px);}
}
@media (max-width:640px){
  /* centrado bajo el nav: no choca con el botón flotante de WhatsApp */
  /* debajo del nav: nunca se cruza con las redes ni con el menú */
  .hsl__mark{
    width:28vw;max-width:112px;min-width:0;
    left:50%;top:calc(var(--nav-h) - 12px);transform:translateX(-50%);
  }
  /* el logo del header estorba sobre el hero; vuelve al hacer scroll */
  .nav:not(.is-scrolled) .nav__logo{opacity:0;visibility:hidden;}
  .nav__logo{transition:opacity .3s ease,visibility .3s ease;}
}
@media (max-width:420px){
  .hsl__mark{width:27vw;max-width:100px;top:calc(var(--nav-h) - 16px);}
}
@media (min-width:641px) and (max-height:620px){
  /* horizontal muy bajo: la marca del hero estorba, el logo del nav ya identifica */
  .hsl__mark{display:none;}
  .hsl__content{padding-top:calc(var(--nav-h) + 12px);padding-bottom:clamp(130px,26vh,170px);}
}
@media (prefers-reduced-motion: reduce){
  .hsl__mark{filter:none;}
  .hsl__mark img{animation:none;}
}
