/* ===================================================================
   Maylü – Estilos de producción v3.3 (MOBILE FIRST)
   - Tipografía y espacios fluidos con clamp()
   - Alturas móviles reales con 100dvh/svh
   - Safe areas para notches
   - Objetivos táctiles >= 44px
   - Grids y tarjetas adaptativas
   =================================================================== */

/* ---------- Sistema ---------- */
:root{
  --brand:#799FEA;        /* primario */
  --brand-600:#638FE9;
  --brand-700:#4F7DE4;
  --mauve:#DBC3DB;
  --graphite:#4E4C49;
  --soft:#EAE0D5;
  --lemon:#E5E580;

  --ink:#222325;
  --ink-2:#2f3032;
  --paper:#ffffff;

  --font-header:'Cormorant Garamond',serif;
  --font-body:'Montserrat',sans-serif;

  /* Escala fluida */
  --fs-body:clamp(15px, 1.6vw, 17px);
  --fs-h1:clamp(2.2rem, 6.8vw, 4rem);
  --fs-h2:clamp(1.5rem, 4.8vw, 2.25rem);
  --fs-h3:clamp(1.12rem, 3.4vw, 1.5rem);

  /* Espacios fluidos */
  --space-xs:clamp(.4rem, 1.2vw, .6rem);
  --space-s:clamp(.7rem, 1.6vw, 1rem);
  --space-m:clamp(1.2rem, 3.5vw, 2rem);
  --space-l:clamp(1.8rem, 5.6vw, 3rem);
  --space-xl:clamp(2.4rem, 7.2vw, 5rem);

  --dur-fast:.2s; --dur:.35s; --dur-slow:.8s;
  --ease:cubic-bezier(.22,.61,.36,1);
  --radius:16px;
  --shadow-1:0 8px 20px rgba(0,0,0,.08);
  --shadow-2:0 16px 34px rgba(0,0,0,.16);
  --container:1200px;
}

/* ---------- Reset / Base ---------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{ -webkit-text-size-adjust:100%; text-size-adjust:100% }
html:focus-within{scroll-behavior:smooth}
body{font-family:var(--font-body);font-size:var(--fs-body);line-height:1.6;color:var(--ink);background:var(--soft)}
img{display:block;max-width:100%}
h1,h2,h3{font-family:var(--font-header);line-height:1.2;color:var(--ink)}
h1{font-size:var(--fs-h1)} h2{font-size:var(--fs-h2)} h3{font-size:var(--fs-h3)}
a{color:var(--ink);text-decoration:none;transition:color var(--dur) var(--ease)}
a:focus-visible{outline:3px dashed var(--lemon);outline-offset:2px}
::selection{background:rgba(229,229,128,.8);color:#1a1a1a}

/* Evita zoom en iOS al enfocar campos (≥16px) */
input,select,textarea{ font-size:16px }

/* Contenedor con safe areas */
.container{
  max-width:var(--container);
  margin:0 auto;
  padding-left:clamp(12px, 3.5vw, 28px);
  padding-right:clamp(12px, 3.5vw, 28px);
  padding-left: calc(clamp(12px,3.5vw,28px) + env(safe-area-inset-left, 0px));
  padding-right: calc(clamp(12px,3.5vw,28px) + env(safe-area-inset-right, 0px));
}

section{padding:var(--space-l) 0}
.section-title{margin-bottom:var(--space-m)}
.section__lead{max-width:70ch;color:var(--ink-2);margin-inline:auto}
.no-scroll{overflow:hidden}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---------- Barra de progreso ---------- */
.progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:1200;background:linear-gradient(90deg,transparent,rgba(0,0,0,.05))}
.progress__bar{display:block;height:100%;transform-origin:left;transform:scaleX(0);background:linear-gradient(90deg,var(--brand),var(--graphite));transition:transform .15s linear}

/* ---------- Botones (tacto >=44px) ---------- */
.btn{
  display:inline-block;border-radius:999px;padding:.9rem 1.25rem;
  font-weight:700;letter-spacing:.2px;line-height:1;touch-action:manipulation;
  min-height:44px;
  transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease),background var(--dur) var(--ease),color var(--dur) var(--ease)
}
.btn--primary{background:var(--brand);color:#fff;box-shadow:var(--shadow-1);border:0}
.btn--primary:hover{transform:translateY(-2px);background:var(--brand-600);box-shadow:var(--shadow-2)}
.btn--primary:active{transform:translateY(0);background:var(--brand-700)}
.btn--ghost{background:rgba(255,255,255,.18);color:#fff;border:1px solid rgba(255,255,255,.55);backdrop-filter:blur(6px)}
.btn--ghost:hover{transform:translateY(-2px);background:rgba(255,255,255,.28)}
.btn--whatsapp{background:linear-gradient(135deg,var(--brand),var(--mauve));color:#fff;border:1px solid rgba(0,0,0,.06);box-shadow:0 10px 22px rgba(0,0,0,.12)}
.btn--whatsapp:hover{transform:translateY(-2px);box-shadow:0 16px 28px rgba(0,0,0,.18)}
.btn--chooser{background:transparent;border:2px solid var(--brand);color:var(--brand)}
.btn--chooser:hover{background:var(--brand);color:#fff;transform:translateY(-2px)}
.btn--wide{width:100%}

/* Glow sutil en hover */
.btn{position:relative;isolation:isolate}
.btn::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:0 0 0 0 rgba(121,159,234,.0);transition:box-shadow var(--dur) var(--ease);z-index:-1}
.btn--primary:hover::after{box-shadow:0 10px 24px 2px rgba(121,159,234,.35)}

/* ---------- Micro-interacción botón Uiverse ---------- */
.button{height:50px;width:200px;position:relative;background:transparent;cursor:pointer;border:2px solid var(--brand);overflow:hidden;border-radius:30px;color:var(--brand);transition:all .5s ease-in-out;display:inline-grid;place-items:center;font-weight:800;letter-spacing:.08em}
.button .btn-txt{z-index:1}
.type1::after{content:"";position:absolute;left:0;top:0;transition:all .5s ease-in-out;background:var(--brand);border-radius:30px;visibility:hidden;height:10px;width:10px;z-index:-1}
.button:hover{box-shadow:0 12px 30px rgba(121,159,234,.28);color:#fff;border-color:transparent}
.type1:hover::after{visibility:visible;transform:scale(100) translateX(2px)}

/* ---------- Header / Nav ---------- */
.header{position:fixed; top:0; left:0; right:0; z-index:1100; transition:background var(--dur) var(--ease), border-color var(--dur) var(--ease)}
.header--transparent{background:transparent;border-bottom:1px solid transparent}
.header--solid{
  background:rgba(234,224,213,.86);
  backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(0,0,0,.06)
}
.nav{
  max-width:var(--container);margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;
  padding:calc(var(--space-s) + env(safe-area-inset-top,0px)) clamp(12px, 3.5vw, 28px) var(--space-s)
}
.nav__brand{display:inline-flex;align-items:center;gap:.5rem}
.nav__brand img{display:block;height:52px;width:auto}
@media (min-width:1024px){.nav__brand img{height:60px}}
.nav__toggle{display:none;flex-direction:column;gap:5px;background:transparent;border:0;cursor:pointer;color:#fff}
.nav__toggle span{width:26px;height:2px;background:currentColor;transition:transform var(--dur) var(--ease),opacity var(--dur) var(--ease)}
.header--solid .nav__toggle{color:var(--graphite)}
.nav__menu{list-style:none;display:flex;gap:var(--space-m);align-items:center}
.nav__link{font-weight:700;position:relative;padding:.25rem .1rem}
.nav__link::after{content:'';position:absolute;left:0;right:0;bottom:-6px;height:2px;transform:scaleX(0);transform-origin:left;background:currentColor;opacity:.35;transition:transform var(--dur) var(--ease),opacity var(--dur) var(--ease)}
.nav__link:hover::after{transform:scaleX(1);opacity:.7}
/* Blanco en portada */
.header--transparent .nav__link{color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.25)}
.header--solid .nav__link{color:var(--graphite)}
.nav__link.is-active{color:var(--brand)}
.header--transparent .nav__link.is-active{color:#fff}
/* Hamburguesa → X */
.nav__toggle[aria-expanded="true"]{color:var(--graphite)}
.nav__toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav__toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.nav__toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
/* Backdrop móvil */
.nav__backdrop{position:fixed;inset:0;background:rgba(0,0,0,.38);z-index:1000}
/* Panel móvil + “✕” */
.nav__close-wrap{display:none}
.nav__close{background:transparent;border:0;font-size:1.6rem;line-height:1;color:var(--graphite);margin-left:auto}

@media (max-width:768px){
  .nav__toggle{display:flex}
  .nav__menu{
    position:fixed; top:0; right:-100%; height:100dvh; width:min(86%,380px);
    background:rgba(234,224,213,.98); backdrop-filter:blur(10px);
    flex-direction:column; align-items:flex-start;
    padding:calc(var(--space-l) + env(safe-area-inset-top,0px)) var(--space-l);
    gap:var(--space-m); transition:right var(--dur) var(--ease);
    box-shadow:-12px 0 30px rgba(0,0,0,.12); z-index:1010
  }
  .nav__menu--open{right:0}
  .nav__link{color:var(--graphite)}
  .nav__close-wrap{display:flex;position:absolute;top:10px;right:10px;width:100%;justify-content:flex-end}
}

/* ---------- Hero (altura móvil real) ---------- */
.hero{
  position:relative;
  min-height: min(100dvh, 100svh);
  display:grid;place-items:center;color:#fff;overflow:hidden
}
.hero__media{position:absolute;inset:0;z-index:-2}
.hero__video{width:100%;height:100%;object-fit:cover;filter:saturate(1.02) contrast(1.05);transform:scale(1);transition:transform .6s var(--ease)}
.hero__overlay{position:absolute;inset:0;z-index:-1;background:radial-gradient(60% 48% at 50% 28%,rgba(0,0,0,.28) 0%,transparent 65%),linear-gradient(180deg,rgba(12,20,38,.55) 0%,rgba(12,20,38,.68) 60%,rgba(12,20,38,.78) 100%)}
.hero__content{text-align:center;max-width:900px;padding:0 clamp(12px,3.5vw,28px);transform:translateZ(0)}
.hero__title{font-size:clamp(2.4rem, 8vw, 6rem);margin-bottom:var(--space-s);text-shadow:0 2px 14px rgba(0,0,0,.35)}
.hero__brand-word{color:#fff}
.hero__subtitle{max-width:70ch;margin:0 auto var(--space-m);font-size:clamp(1rem, 3.6vw, 1.125rem);color:var(--lemon);text-shadow:0 2px 10px rgba(0,0,0,.35)}
.hero__cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.hero__cta--stack{gap:10px;flex-wrap:wrap}
.hero__cta--stack .btn{min-width:170px}
.hero__badges{margin-top:1rem;display:flex;gap:.5rem;justify-content:center;list-style:none;flex-wrap:wrap}
.hero__badges li{font-size:.85rem;color:#fff;border:1px solid rgba(255,255,255,.45);padding:.35rem .6rem;border-radius:999px;background:rgba(255,255,255,.15);backdrop-filter:blur(8px)}
.hero__scroll{--size:28px;position:absolute;bottom:22px;left:50%;transform:translateX(-50%);width:var(--size);height:var(--size);background:transparent;border:2px solid rgba(255,255,255,.85);border-radius:999px;cursor:pointer;animation:bounce 1.8s ease-in-out infinite;opacity:.95}
.hero__scroll::after{content:'';display:block;width:8px;height:8px;margin:6px auto 0;border-right:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(45deg)}
.hero__sentinel{position:absolute;inset:auto 0 0 0;height:1px}
@keyframes bounce{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,7px)}}

/* ---------- Offers (cards de selección) ---------- */
.offers{background:var(--soft)}
.offers__grid{
  display:grid;
  gap:clamp(12px,2.6vw,18px);
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  align-items:stretch;
}
.offer-card{
  position:relative; isolation:isolate;
  display:flex; flex-direction:column; height:100%;
  background:#fff;border-radius:20px;overflow:hidden;
  border:1px solid rgba(0,0,0,.06); box-shadow:var(--shadow-1);
  transition:transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease), background var(--dur) var(--ease);
}
.offer-card::before,
.offer-card::after{
  content:""; position:absolute; inset:auto 0 0 auto;
  width:22%; height:22%; z-index:0;
  background:radial-gradient(80% 80% at 100% 100%, rgba(121,159,234,.28), rgba(121,159,234,.08));
  transition:all .6s var(--ease);
  border-top-left-radius:120px; border-top-right-radius:0; border-bottom-left-radius:0; border-bottom-right-radius:20px;
  pointer-events:none;
}
.offer-card::before{ top:0; right:0; left:auto; bottom:auto; border-radius:0 20px 0 120px; }
.offer-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-2) }
.offer-card:hover::before,
.offer-card:hover::after{ width:100%; height:100%; border-radius:20px; }
.offer-card__img img{width:100%;aspect-ratio:16/9;object-fit:cover}
.offer-card__body{
  position:relative;z-index:1;
  padding:clamp(14px,2.4vw,20px);
  display:flex;flex-direction:column;gap:.7rem;
  min-height:0 !important;
}
.offer-card__title{font-size:1.25rem;font-family:var(--font-header)}
.offer-card__footer{margin-top:auto;display:grid;gap:.6rem}
.offer-card__cta{align-self:stretch}

/* ---------- CTA Card (Fechas) ---------- */
.cta-card{
  display:grid; grid-template-columns:1.15fr .85fr;
  background:#fff; border:1px solid rgba(0,0,0,.06);
  border-radius:20px; overflow:hidden; box-shadow:var(--shadow-1);
  transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
  isolation:isolate;
}
.cta-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-2); }
@media (max-width:920px){ .cta-card{ grid-template-columns:1fr; } }
.cta-card__media{ position:relative; min-height:260px; }
.cta-card__media img{ width:100%; height:100%; object-fit:cover; display:block; }
.cta-card__shine{
  position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(80% 60% at 80% 20%, rgba(121,159,234,.25), transparent 60%),
    radial-gradient(80% 60% at 10% 90%, rgba(219,195,219,.25), transparent 60%);
  mix-blend-mode:soft-light;
}
.cta-card__body{ padding:clamp(16px,2vw,22px); display:grid; gap:.6rem; align-content:center; }
.cta-card__title{ font-size:clamp(1.35rem, 2.6vw, 1.8rem); }
.cta-card__lead{ color:var(--ink-2); }
.cta-card__stats{ list-style:none; padding:0; margin:.3rem 0 .6rem; color:var(--graphite); display:grid; gap:.25rem; }
.cta-chip{
  display:inline-flex; align-items:center; gap:.35rem;
  border:1px solid rgba(0,0,0,.08); border-radius:999px; padding:.25rem .6rem; background:#fff; font-size:.85rem;
}

/* ---------- Secciones ricas ---------- */
.section-rich{background:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.04) 100%)}
.rich__two{display:grid;gap:clamp(12px,2.6vw,20px);grid-template-columns:1fr;align-items:center}
.rich__media img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:16px}
.rich__text p{color:var(--ink-2)}
.rich__ctas{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:.6rem}
@media (min-width:820px){
  .rich__two{grid-template-columns:1fr 1fr}
  .rich__media img{aspect-ratio:16/10}
}

/* ---------- Chips ---------- */
.chip-row{display:flex;flex-wrap:wrap;gap:.5rem;margin:.6rem 0}
.chip{border:1px solid rgba(0,0,0,.1);background:#fff;border-radius:999px;padding:.35rem .75rem;font-size:.88rem}

/* ---------- Listas con estrellas ---------- */
.star-list{list-style:none;padding-left:0}
.star-list li{position:relative;padding-left:1.5rem;margin-bottom:.75rem;color:var(--ink-2)}
.star-list li::before{content:'✦';position:absolute;left:0;top:.2rem;color:var(--lemon);font-size:1.05rem}

/* ---------- Slider testimonios ---------- */
.slider{position:relative;overflow:hidden;border-radius:16px;border:1px solid rgba(0,0,0,.06);background:#fff}
.slider__track{display:flex;transition:transform .6s var(--ease); will-change: transform}
.slide{flex:0 0 100%;padding:clamp(16px,3.2vw,22px);min-height:120px}
.slide blockquote{font-size:clamp(1rem, 3.6vw, 1.05rem);line-height:1.7;color:var(--ink-2)}
.slide .quote-author{display:block;margin-top:.8rem;font-weight:700;color:var(--graphite)}
.slider__nav{display:flex;justify-content:center;gap:8px;margin-top:10px}
.dot{width:8px;height:8px;border-radius:999px;background:#c9c1b7;border:0}
.dot.is-active{background:var(--brand)}

/* ---------- Video (YouTube) ---------- */
.video-section .video-container{position:relative;border-radius:var(--radius);box-shadow:var(--shadow-1);border:1px solid rgba(0,0,0,.08);background:#000;overflow:hidden;aspect-ratio:16/9}
.video-section iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* ---------- Promo CTA ---------- */
.promo-cta{background:linear-gradient(90deg,rgba(121,159,234,.08),rgba(219,195,219,.08));border-top:1px solid rgba(0,0,0,.06);border-bottom:1px solid rgba(0,0,0,.06)}
.promo-cta__inner{display:flex;align-items:center;gap:.8rem;padding:1rem 0}
.promo-cta__txt{flex:1;font-size:.95rem;color:var(--ink-2)}

/* ---------- Instagram ---------- */
.insta-profile{ display:grid; place-items:center; gap:.4rem; margin-bottom:1rem; }
.insta-profile__img{ width:120px; height:120px; border-radius:50%; overflow:hidden; border:3px solid #fff; box-shadow:0 8px 22px rgba(0,0,0,.18); }
.insta-profile__img img{ width:100%; height:100%; object-fit:cover; display:block; }
.insta-profile__name{ font-weight:800; letter-spacing:.3px; }
.instagram-grid{
  display:grid; gap:clamp(10px,1.6vw,14px);
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
  margin-top:.8rem;
}
.ig-card{ display:block; background:#fff; border:1px solid rgba(0,0,0,.06); border-radius:16px; overflow:hidden; box-shadow:var(--shadow-1); transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease); }
.ig-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-2); }
.ig-card__img{ width:100%; height:220px; object-fit:cover; display:block; }
.ig-card__body{ padding:.6rem .8rem; font-size:.9rem; color:#4E4C49; }

/* ---------- Suscripción ---------- */
.subscribe{background:linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,0))}
.subscribe__wrap{display:grid;gap:1rem;grid-template-columns:1fr;align-items:center}
@media (min-width:920px){ .subscribe__wrap{grid-template-columns:1fr 1fr} }

.subscribe__text h3{font-family:var(--font-header);font-size:clamp(1.4rem,4.2vw,2rem);margin-bottom:.35rem}
.subscribe__text p{color:var(--ink-2)}

/* Inputs táctiles grandes */
.subscribe__form{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:flex-start}
.subscribe__form input,
.subscribe__form select{
  flex:1 1 220px;padding:.8rem 1rem;border-radius:999px;border:1px solid rgba(0,0,0,.1);background:#fff;font:inherit;min-height:44px
}
.subscribe__form .btn{flex:0 0 auto}
.legal-note{font-size:.85rem;color:var(--ink-2);margin-top:1rem;max-width:780px}

/* ---------- Tabs (glider) — Suscripción/WhatsApp ---------- */
.tabs-wrap{display:flex;justify-content:center;margin:.75rem 0 1rem}
.tabs{
  position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:6px;
  background:#fff;border-radius:99px;padding:6px;
  box-shadow:0 0 1px 0 rgba(24,94,224,.15),0 6px 12px 0 rgba(24,94,224,.12);
  max-width:min(860px,100%); overflow:auto; -webkit-overflow-scrolling:touch;
}
.tabs *{z-index:2}
.tabs input[type="radio"]{display:none}
.tab{text-align:center;padding:.55rem 1rem;font-size:.9rem;font-weight:700;color:var(--graphite);border-radius:99px;cursor:pointer;user-select:none;transition:color .15s ease-in;white-space:nowrap}
.tabs input[type="radio"]:checked + label{color:var(--brand-700)}
.glider{position:absolute;top:6px;left:6px;bottom:6px;width:calc(25% - 0px);background:#e6eef9;border-radius:99px;z-index:1;transition:transform .25s ease-out}
.tabs input#svc-1:checked ~ .glider,
.tabs input#sub-s1:checked ~ .glider{transform:translateX(0%)}
.tabs input#svc-2:checked ~ .glider,
.tabs input#sub-s2:checked ~ .glider{transform:translateX(100%)}
.tabs input#svc-3:checked ~ .glider,
.tabs input#sub-s3:checked ~ .glider{transform:translateX(200%)}
.tabs input#svc-4:checked ~ .glider,
.tabs input#sub-s4:checked ~ .glider{transform:translateX(300%)}
@media (max-width:700px){.tab{font-size:.8rem;padding:.5rem .7rem}}

/* ---------- Contact CTA ---------- */
.contact__cta{display:flex;gap:.6rem;justify-content:center;flex-wrap:wrap;margin-top:.5rem}

/* ---------- Modales ---------- */
.modal{position:fixed;inset:0;background:rgba(0,0,0,.6);display:none;align-items:center;justify-content:center;padding:clamp(10px,3vw,24px);z-index:1300}
.modal.is-open{display:flex}
.modal__dialog{max-width:min(980px,92vw);max-height:86vh;overflow:auto;background:#fff;border-radius:18px;box-shadow:0 22px 60px rgba(0,0,0,.32);border:1px solid rgba(0,0,0,.06)}
.modal__head{position:sticky;top:0;background:linear-gradient(180deg,#fff 70%,rgba(255,255,255,.9));border-bottom:1px solid rgba(0,0,0,.06);padding:14px 18px;display:flex;align-items:center;gap:.8rem;z-index:2}
.modal__title{font-family:var(--font-header);font-size:1.45rem}
.modal__close{margin-left:auto;border:0;background:#eee;width:38px;height:38px;border-radius:999px;font-size:1.1rem;cursor:pointer}
.modal__body{padding:18px 18px 22px}
.modal__body p{margin:.6rem 0;color:#2a2a2a}

/* ---------- To Top ---------- */
.to-top{position:fixed;right:clamp(12px,2vw,18px);bottom:clamp(12px,2vw,18px);z-index:1050;width:48px;height:48px;border-radius:999px;border:1px solid rgba(0,0,0,.2);background:rgba(255,255,255,.85);backdrop-filter:blur(8px);color:var(--graphite);display:grid;place-items:center;font-weight:700;opacity:0;pointer-events:none;transform:translateY(10px);transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease)}
.to-top--show{opacity:1;transform:none;pointer-events:auto}
.to-top:hover{box-shadow:var(--shadow-2);transform:translateY(-2px)}
.to-top:active{transform:translateY(0)}

/* ---------- Reveal on scroll ---------- */
.will-reveal{opacity:0}
.reveal-fade.will-reveal{transform:translateY(8px);filter:blur(8px)}
.reveal-up.will-reveal{transform:translateY(22px)}
.reveal-scale.will-reveal{transform:scale(.97)}
.is-visible{opacity:1 !important;transform:none !important;filter:none !important;transition:opacity var(--dur-slow) var(--ease),transform var(--dur-slow) var(--ease),filter var(--dur-slow) var(--ease);transition-delay:var(--reveal-delay,0ms)}

/* ---------- Footer ---------- */
.site-footer{background:var(--graphite);color:var(--soft);padding:var(--space-m);text-align:center;font-size:.88rem}
.footer__iso{height:72px;width:auto;vertical-align:middle;margin-right:.55rem;image-rendering:-webkit-optimize-contrast}

/* ---------- FIX ALINEACIÓN CTAs EN TARJETAS DE SERVICIOS ---------- */
.offers__grid{ align-items:stretch }
.offer-card{ display:flex; flex-direction:column; height:100% }
.offer-card__img{ flex:0 0 auto }
.offer-card__img img{ width:100%; aspect-ratio:16/9; object-fit:cover }
.offer-card__body{ flex:1 1 auto; display:flex; flex-direction:column; min-height:0 !important }
.offer-card__footer{ margin-top:auto; display:grid; gap:.65rem }
.offer-card__footer .button,.offer-card__footer .btn{ width:100% }

/* ---------- Desktop: 4 columnas en servicios (cuando hay ancho real) ---------- */
@media (min-width:1180px){
  .offers__grid{
    grid-template-columns:repeat(auto-fit, minmax(280px,1fr)) !important;
    gap:clamp(14px, 1.6vw, 22px);
  }
}

/* ---------- CERTIFICACIONES (versión ligera; la hoja dedicada puede sobrescribir) ---------- */
#certificaciones .cert-grid{
  display:grid; gap:clamp(14px, 2.2vw, 26px);
  grid-template-columns:1fr; align-items:start;
}
@media (min-width:980px){
  #certificaciones .cert-grid{ grid-template-columns:1.05fr .95fr }
}

.input-pill{
  appearance:none; -webkit-appearance:none; -moz-appearance:none;
  border:1px solid rgba(0,0,0,.12);
  background:#fff url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l5 6 5-6' stroke='%234E4C49' stroke-width='2' fill='none'/%3E%3C/svg%3E") no-repeat right 12px center/12px 8px;
  padding:.7rem 2.2rem .7rem 1rem;
  border-radius:999px; font:inherit; font-weight:800; color:var(--graphite);
  min-width:210px; cursor:pointer; white-space:nowrap;
}

.calendar__filters{ display:grid; gap:.6rem; margin-bottom:.8rem }
.calendar__nav{ display:flex; gap:.6rem; flex-wrap:wrap }

.calendar{
  border:1px solid rgba(0,0,0,.06); border-radius:16px; background:#fff;
  box-shadow:var(--shadow-1); overflow:hidden;
}
.calendar__head{
  display:flex; align-items:center; justify-content:space-between;
  padding:.65rem .9rem; border-bottom:1px solid rgba(0,0,0,.06);
  background:linear-gradient(180deg,#fff,#fafafa);
}
.calendar__grid{ display:grid; grid-template-columns:repeat(7,1fr); gap:0; padding:.2rem .35rem .8rem }
.calendar__dow,.calendar__day{ text-align:center; padding:.45rem 0 }
.calendar__dow{ font-weight:800; color:var(--graphite); opacity:.8; font-size:.85rem }
.calendar__day{ position:relative; min-height:40px; display:grid; place-items:center; font-weight:800; color:#2f3032; font-size:.95rem }
.calendar__day.is-muted{ opacity:.35; font-weight:700 }
.calendar__day.is-today{ outline:2px dashed var(--lemon); outline-offset:-6px }
.calendar__day.has-slot::after{ content:"•"; position:absolute; bottom:6px; left:50%; transform:translateX(-50%); font-size:10px; line-height:1; color:var(--brand) }

.reco{
  display:flex; align-items:center; gap:.6rem;
  padding:.7rem 1rem; border:1px solid rgba(0,0,0,.06);
  background:linear-gradient(180deg,#fff,#fafafa);
  border-radius:12px; margin-left:auto; box-shadow:var(--shadow-1);
  font-size:.95rem;
}

.cert-cards{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(300px,1fr));
  gap:clamp(12px, 2vw, 20px);
  margin-top:1.1rem;
}
@media (min-width:1400px){
  .cert-cards{ grid-template-columns:repeat(auto-fit, minmax(320px,1fr)) }
}
.cert-card{
  background:#fff; border:1px solid rgba(0,0,0,.06);
  border-radius:16px; box-shadow:var(--shadow-1);
  overflow:hidden; display:flex; flex-direction:column;
  transition:transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.cert-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-2) }
.cert-card__media img{ width:100%; aspect-ratio:16/9; object-fit:cover; display:block }
.cert-card__body{ padding:14px 16px; display:grid; gap:.35rem }
.cert-card__title{ font-family:var(--font-header); font-size:1.25rem }
.cert-card__meta{ display:flex; flex-wrap:wrap; gap:.4rem .6rem; color:var(--ink-2); font-size:.95rem }
.cert-card__actions{ margin-top:.5rem; display:grid; gap:.45rem; grid-template-columns:1fr }
@media (min-width:520px){ .cert-card__actions{ grid-template-columns:1fr 1fr } }
.cert-badge{ display:inline-flex; align-items:center; gap:.4rem; border:1px solid rgba(0,0,0,.08); border-radius:999px; padding:.25rem .6rem; font-size:.85rem; background:#fff }

/* ---------- Pequeños pulidos ---------- */
.header .nav{ align-items:center }
.btn--ghost{ border:1px solid rgba(255,255,255,.45); background:linear-gradient(180deg, rgba(255,255,255,.22), rgba(255,255,255,.1)) }
.btn--ghost:hover{ background:linear-gradient(180deg, rgba(255,255,255,.32), rgba(255,255,255,.18)) }

/* ---------- Breakpoints extra ---------- */
@media (min-width:480px){:root{--fs-h1:clamp(2.6rem, 6.8vw, 4rem);--fs-h2:clamp(1.6rem,4.8vw,2.25rem)}}
@media (min-width:1280px){:root{--fs-h1:clamp(3.2rem, 4.6vw, 4.5rem)}}

/* ---------- Reduce motion ---------- */
@media (prefers-reduced-motion:reduce){
  html:focus-within{scroll-behavior:auto}
  .btn,.offer-card,.will-reveal,.hero__video,.hero__scroll,.nav__link::after,.to-top{transition:none !important;animation:none !important}
}

/* ---------- Accesibilidad y compatibilidad ---------- */
@media (max-width:380px){ .calendar__day{ min-height:36px; font-size:.9rem } }
*{-webkit-tap-highlight-color: rgba(0,0,0,0)}
/* ——— Cortar cualquier overflow horizontal que fuerce zoom inicial ——— */
html, body { max-width: 100%; overflow-x: clip; }
@supports not (overflow: clip) { html, body { overflow-x: hidden; } }

/* ——— Los hijos de grids/containers pueden encogerse (evita “grid blowout”) ——— */
:where(.container, .offers__grid, .rich__two, .instagram-grid, .cert-cards){ min-width: 0; }
:where(.offer-card, .rich__text, .rich__media){ min-width: 0; }

/* ——— En grids de 2 columnas usa minmax(0,1fr) para que no empujen el ancho ——— */
.rich__two{ grid-template-columns: minmax(0,1fr); }
@media (min-width:820px){
  .rich__two{ grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
}

/* ——— Medios no más anchos que su contenedor ——— */
img, video, iframe { max-width: 100%; height: auto; }

/* ——— Copys largos nunca fuerzan ancho ——— */
.hero__subtitle, .section__lead { overflow-wrap:anywhere; hyphens:auto; }