/* ==========================================================================
   MOIRA GOLDGOD v2 — hoja de estilos única
   Orden: 1 variables · 2 reset · 3 tipografía · 4 layout · 5 botones
          6 header · 7 barra fija · 8 componentes · 9 secciones
          10 calendario · 11 formularios · 12 modales · 13 responsive
   ========================================================================== */

/* ---------- 1. VARIABLES -------------------------------------------- */
:root{
  --background-main:#F7F5F2;
  --background-soft:#F1EFEC;
  --card:#FFFFFF;
  --text-main:#111111;
  --text-secondary:#6B6B6B;
  --border-soft:#E8E5E1;
  --red-primary:#FF3434;
  --red-dark:#E62525;
  --whatsapp:#25D366;
  --whatsapp-dark:#1EB855;
  --yellow-accent:#FFB000;
  --black-section:#090909;
  --black-card:#171717;

  --container:1180px;
  --pad-side:32px;
  --radius:24px;
  --radius-sm:14px;
  --radius-pill:999px;

  --shadow-sm:0 2px 8px rgba(17,17,17,.05);
  --shadow-md:0 8px 30px rgba(17,17,17,.08);
  --shadow-lg:0 18px 50px rgba(17,17,17,.14);
  --shadow-bar:0 12px 40px rgba(0,0,0,.28);

  --font:'Inter','Manrope',system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  --bar-h:96px;
}

/* ---------- 2. RESET ------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--font);
  font-size:16px;
  line-height:1.6;
  color:var(--text-main);
  background:var(--background-main);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
button{font:inherit;color:inherit;cursor:pointer;border:0;background:none;}
a{color:inherit;text-decoration:none;}
ul,ol{margin:0;padding:0;list-style:none;}
h1,h2,h3,h4,p{margin:0;}
input,select,textarea{font:inherit;color:inherit;}

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

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important;}
}

/* ---------- 3. TIPOGRAFÍA -------------------------------------------- */
.h1{font-size:68px;line-height:.98;font-weight:800;letter-spacing:-.03em;}
.h2{font-size:52px;line-height:1.04;font-weight:800;letter-spacing:-.025em;}
.h3{font-size:30px;line-height:1.18;font-weight:700;letter-spacing:-.015em;}
.h4{font-size:21px;line-height:1.3;font-weight:700;letter-spacing:-.01em;}
.lead{font-size:20px;line-height:1.55;color:var(--text-secondary);}
.small{font-size:14px;line-height:1.5;}
.red{color:var(--red-primary);}
.muted{color:var(--text-secondary);}

.eyebrow{
  font-size:12.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--red-primary);display:flex;align-items:center;gap:10px;flex-wrap:wrap;
}
.eyebrow--light{color:var(--yellow-accent);}

.script{
  font-family:'Caveat','Segoe Script','Brush Script MT',cursive;
  font-size:64px;line-height:1.1;font-weight:700;letter-spacing:0;
}

/* ---------- 4. LAYOUT ------------------------------------------------ */
.container{width:100%;max-width:var(--container);margin:0 auto;padding:0 var(--pad-side);}
.section{padding:96px 0;}
.section--tight{padding:64px 0;}
.section--soft{background:var(--background-soft);}
.section--white{background:#fff;}
.section--black{background:var(--black-section);color:#fff;}
.section--black .lead,.section--black .muted{color:#9A9A9A;}

.section-head{max-width:760px;margin-bottom:52px;display:flex;flex-direction:column;gap:16px;}
.section-head--center{margin-left:auto;margin-right:auto;text-align:center;align-items:center;}

.grid{display:grid;gap:24px;}
/* Sin esto los hijos de un grid no bajan de su ancho mínimo de contenido y
   desbordan el contenedor en pantallas angostas. */
.grid > *{min-width:0;}
.grid-2{grid-template-columns:repeat(2,1fr);}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-4{grid-template-columns:repeat(4,1fr);}
/* La grilla de cursos se arma sola segun cuantos haya: con 2 quedan 2 columnas
   centradas, con 3 quedan 3. Asi no hay que tocar el CSS al agregar o sacar
   un curso. */
.grid-cursos{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));}
.stack{display:flex;flex-direction:column;}
.row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}

/* espacio inferior para que la barra fija nunca tape contenido */
#app{padding-bottom:calc(var(--bar-h) + 24px);}

/* ---------- 5. BOTONES ----------------------------------------------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  min-height:52px;padding:0 26px;border-radius:var(--radius-pill);
  font-size:16px;font-weight:600;letter-spacing:-.01em;text-align:center;
  transition:transform .18s ease,background .18s ease,box-shadow .18s ease,opacity .18s ease;
  cursor:pointer;
}
.btn:hover{transform:translateY(-2px);}
.btn:active{transform:translateY(0);}
.btn--black{background:var(--text-main);color:#fff;}
.btn--black:hover{background:#000;box-shadow:var(--shadow-md);}
.btn--red{background:var(--red-primary);color:#fff;}
.btn--red:hover{background:var(--red-dark);box-shadow:0 10px 26px rgba(255,52,52,.32);}
.btn--wa{background:var(--whatsapp);color:#062d14;}
.btn--wa:hover{background:var(--whatsapp-dark);}
.btn--ghost{background:transparent;color:var(--text-main);border:1.5px solid var(--border-soft);}
.btn--ghost:hover{border-color:var(--text-main);background:#fff;}
.btn--light{background:#fff;color:var(--text-main);}
.btn--outline-light{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.3);}
.btn--outline-light:hover{border-color:#fff;background:rgba(255,255,255,.08);}
.btn--sm{min-height:44px;padding:0 18px;font-size:14.5px;}
.btn--block{width:100%;}
.btn[disabled],.btn[aria-disabled="true"]{opacity:.4;pointer-events:none;}

.link-under{text-decoration:underline;text-underline-offset:3px;font-weight:600;}

/* ---------- 6. HEADER ------------------------------------------------ */
.header{
  position:sticky;top:0;z-index:60;height:76px;
  background:rgba(247,245,242,.9);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--border-soft);
}
.header__in{height:76px;display:flex;align-items:center;justify-content:space-between;gap:20px;}
/* Logo original de la marca (puma + MG + tipografía). Es naranja sobre fondo
   transparente: se ve bien tanto sobre el crema como sobre el negro. */
.logo{display:flex;align-items:center;gap:11px;font-weight:800;letter-spacing:-.02em;font-size:16.5px;flex:0 0 auto;}
.logo__mark{
  width:38px;height:38px;border-radius:11px;background:var(--text-main);color:#fff;
  display:grid;place-items:center;font-size:14px;font-weight:800;letter-spacing:.02em;flex:0 0 auto;
}
.logo--footer{color:#fff;}
.logo--footer .logo__mark{background:#fff;color:var(--text-main);}
.nav{display:flex;align-items:center;gap:24px;}
/* Nada del header parte en dos líneas: el logo ya ocupa bastante ancho. */
.nav a,.header__in .btn{white-space:nowrap;}
.nav a{font-size:15px;font-weight:500;color:#3B3B3B;transition:color .15s;}
.nav a:hover,.nav a.is-active{color:var(--text-main);}
.nav a.is-active{font-weight:600;}

/* ---- acciones del header: lupa + cuenta + hamburguesa ---- */
.hdr-actions{display:flex;align-items:center;gap:8px;flex:0 0 auto;}

.icon-btn{
  position:relative;
  width:44px;height:44px;border-radius:50%;display:grid;place-items:center;
  color:var(--text-main);background:transparent;transition:background .15s,color .15s;
  text-decoration:none;
}
.icon-btn svg{width:21px;height:21px;}
.icon-btn:hover{background:rgba(17,17,17,.07);}

.cart-badge{
  position:absolute;top:2px;right:2px;min-width:16px;height:16px;padding:0 4px;
  border-radius:999px;background:var(--red-primary);color:#fff;font-size:10.5px;
  font-weight:700;line-height:16px;text-align:center;
}

.btn--ingresar{min-height:44px;padding:0 22px;}

/* Menú de la cuenta */
.cuenta{position:relative;}
.cuenta__menu{
  position:absolute;top:calc(100% + 10px);right:0;z-index:70;display:none;
  min-width:236px;padding:8px;border-radius:16px;
  background:var(--black-card);border:1px solid rgba(255,255,255,.1);
  box-shadow:0 18px 44px rgba(0,0,0,.34);
}
.cuenta__menu.is-open{display:block;}
.cuenta__top{display:flex;align-items:center;gap:11px;padding:12px 12px 14px;border-bottom:1px solid rgba(255,255,255,.1);margin-bottom:6px;}
.cuenta__id{min-width:0;}
.cuenta__id b{display:block;color:#fff;font-size:14.5px;line-height:1.25;}
.cuenta__id span{display:block;color:#8A8A8A;font-size:12.5px;margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:150px;}
.avatar{
  width:38px;height:38px;border-radius:50%;flex:0 0 auto;display:grid;place-items:center;
  background:var(--red-primary);color:#fff;font-weight:700;font-size:16px;
}
.cuenta__menu a,.cuenta__menu button{
  display:block;width:100%;text-align:left;padding:10px 12px;border-radius:10px;
  color:#D6D6D6;font-size:15px;transition:background .14s,color .14s;
}
.cuenta__menu a:hover,.cuenta__menu button:hover{background:rgba(255,255,255,.08);color:#fff;}

.burger{display:none;width:46px;height:46px;border-radius:12px;place-items:center;border:1.5px solid var(--border-soft);background:#fff;}
.burger span{display:block;width:19px;height:2px;background:var(--text-main);border-radius:2px;position:relative;}
.burger span::before,.burger span::after{content:'';position:absolute;left:0;width:19px;height:2px;background:var(--text-main);border-radius:2px;}
.burger span::before{top:-6px;} .burger span::after{top:6px;}

.mobile-menu{
  position:fixed;inset:0;z-index:80;background:var(--background-main);
  display:flex;flex-direction:column;padding:20px var(--pad-side) 32px;
  transform:translateY(-100%);transition:transform .3s cubic-bezier(.4,0,.2,1);overflow-y:auto;
}
.mobile-menu.is-open{transform:translateY(0);}
.mobile-menu__top{display:flex;align-items:center;justify-content:space-between;height:56px;margin-bottom:20px;}
.mobile-menu__close{width:46px;height:46px;border-radius:12px;border:1.5px solid var(--border-soft);background:#fff;font-size:22px;line-height:1;display:grid;place-items:center;}
.mobile-menu nav{display:flex;flex-direction:column;gap:2px;margin-bottom:26px;}
.mobile-menu nav a{font-size:25px;font-weight:700;letter-spacing:-.02em;padding:13px 0;border-bottom:1px solid var(--border-soft);}
.mobile-menu__cta{display:flex;flex-direction:column;gap:12px;margin-top:auto;}

/* ---------- 7. BARRA FIJA INFERIOR ------------------------------------ */
.stickybar{
  position:fixed;left:50%;transform:translateX(-50%);bottom:18px;z-index:70;
  width:min(1150px,calc(100% - 36px));
  background:var(--black-section);color:#fff;border-radius:var(--radius);
  box-shadow:var(--shadow-bar);
  display:flex;align-items:center;justify-content:space-between;gap:22px;
  padding:18px 22px;
}
/* Los display van en CSS, NO inline: si no, el estilo inline le gana a la
   media query de móvil y se muestran las dos variantes superpuestas. */
.stickybar__desktop{display:flex;align-items:center;justify-content:space-between;gap:22px;width:100%;}
.stickybar__text{font-size:15.5px;font-weight:600;line-height:1.35;}
.stickybar__actions{display:flex;gap:10px;flex:0 0 auto;}
.stickybar__mobile{display:none;}

/* ---------- 8. COMPONENTES ------------------------------------------- */
.card{background:var(--card);border:1px solid var(--border-soft);border-radius:var(--radius);box-shadow:var(--shadow-sm);}
.card--pad{padding:32px;}

.badge{
  display:inline-flex;align-items:center;gap:6px;
  font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  padding:5px 10px;border-radius:var(--radius-pill);
  background:rgba(17,17,17,.06);color:var(--text-secondary);
}
.badge--red{background:var(--red-primary);color:#fff;}
.badge--dark{background:var(--text-main);color:#fff;}

.chip{
  display:inline-flex;align-items:center;gap:6px;
  padding:7px 13px;border-radius:var(--radius-pill);
  background:var(--background-soft);border:1px solid var(--border-soft);
  font-size:13.5px;font-weight:500;
}
.chip--dark{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.12);color:#EDEDED;}

.check{display:flex;align-items:flex-start;gap:10px;font-size:15.5px;line-height:1.5;}
.check::before{
  content:'';flex:0 0 auto;width:19px;height:19px;margin-top:3px;border-radius:50%;
  background:var(--red-primary) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/11px no-repeat;
}
.check--dark::before{background-color:#fff;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23090909' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");}
.cross{display:flex;align-items:flex-start;gap:10px;font-size:15.5px;color:var(--text-secondary);}
.cross::before{content:'—';flex:0 0 auto;font-weight:700;color:#C4C0BA;}

/* Fila de cierre de sección: precio a la izquierda, botones a la derecha. */
.cta-row{margin-top:20px;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;}

/* media con relación de aspecto */
.media{position:relative;overflow:hidden;background:var(--background-soft);border-radius:var(--radius);}
.media img{width:100%;height:100%;object-fit:cover;}
.media--45{aspect-ratio:4/5;}
.media--11{aspect-ratio:1/1;}
.media--169{aspect-ratio:16/9;}
.media--34{aspect-ratio:3/4;}
.media__scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.5) 0%,rgba(0,0,0,0) 35%,rgba(0,0,0,.15) 60%,rgba(0,0,0,.82) 100%);}

.play{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:74px;height:74px;border-radius:50%;background:rgba(255,255,255,.94);
  display:grid;place-items:center;box-shadow:0 8px 28px rgba(0,0,0,.3);
  transition:transform .2s ease,background .2s ease;
}
.play::after{content:'';width:0;height:0;margin-left:5px;border-left:20px solid var(--text-main);border-top:13px solid transparent;border-bottom:13px solid transparent;}
.play:hover{transform:translate(-50%,-50%) scale(1.07);background:#fff;}
.play--sm{width:52px;height:52px;}
.play--sm::after{margin-left:4px;border-left:15px solid var(--text-main);border-top:10px solid transparent;border-bottom:10px solid transparent;}

.videotag{
  position:absolute;top:14px;right:14px;
  background:rgba(9,9,9,.82);color:#fff;font-size:12px;font-weight:600;
  padding:5px 10px;border-radius:8px;backdrop-filter:blur(4px);
}
.videocap{position:absolute;left:0;right:0;bottom:0;padding:18px 20px;color:#fff;}
.videocap h4{font-size:17px;font-weight:700;line-height:1.25;}

/* ---------- 9. SECCIONES --------------------------------------------- */

/* HERO */
.hero{padding:64px 0 84px;}
.hero__grid{display:grid;grid-template-columns:1.06fr .94fr;gap:56px;align-items:center;}
/* el titular escala con el ancho para no comerse la pantalla en monitores anchos */
.hero .h1{font-size:clamp(38px,4.3vw,64px);}
.hero .media__scrim{background:linear-gradient(180deg,rgba(0,0,0,.42) 0%,rgba(0,0,0,0) 34%,rgba(0,0,0,.1) 58%,rgba(0,0,0,.78) 100%);}
.hero__bullets{display:grid;grid-template-columns:1fr 1fr;gap:12px 24px;margin-top:30px;}
.hero__bullets .check{font-size:14.5px;}
.hero__actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:32px;}
.hero__card{position:relative;}
.hero__slide{display:none;}
.hero__slide.is-active{display:block;}
.hero__name{position:absolute;top:20px;left:22px;color:#fff;font-size:19px;font-weight:700;text-shadow:0 2px 12px rgba(0,0,0,.5);}
.hero__dots{position:absolute;bottom:16px;left:50%;transform:translateX(-50%);display:flex;gap:7px;}
.hero__dot{width:26px;height:4px;border-radius:2px;background:rgba(255,255,255,.4);transition:background .2s;}
.hero__dot.is-active{background:#fff;}
.hero__arrow{
  position:absolute;top:50%;transform:translateY(-50%);width:42px;height:42px;border-radius:50%;
  background:rgba(255,255,255,.9);display:grid;place-items:center;font-size:19px;box-shadow:var(--shadow-sm);
}
.hero__arrow--l{left:-14px;} .hero__arrow--r{right:-14px;}
.hero__quote{margin-top:18px;padding:20px 22px;}
.hero__book{
  flex:0 0 auto;width:42px;height:42px;border-radius:12px;background:var(--background-soft);
  display:grid;place-items:center;font-size:20px;
}

/* PRODUCTOS */
.prod{display:flex;flex-direction:column;overflow:hidden;}
.prod__media{position:relative;}
.prod__body{padding:28px 30px 30px;display:flex;flex-direction:column;flex:1;gap:14px;}
.prod__promise{font-size:17px;font-weight:600;line-height:1.35;}
.prod__data{display:flex;flex-wrap:wrap;gap:8px;}
.prod__price{display:flex;align-items:baseline;gap:11px;flex-wrap:wrap;margin-top:auto;padding-top:10px;}
.prod__price b{font-size:34px;font-weight:800;letter-spacing:-.03em;line-height:1;}
.prod__price del{font-size:17px;color:#B4AFA8;}
.prod__off{background:rgba(255,52,52,.1);color:var(--red-dark);font-size:12px;font-weight:700;padding:4px 9px;border-radius:7px;}

/* Precio en pesos (lo que se cobra por Mercado Pago). Va debajo del precio
   en dólares, más chico, para que no compita con el precio principal. */
.precio-ars{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-top:9px;}
.precio-ars b{font-size:26px;font-weight:800;letter-spacing:-.03em;color:var(--text-main);}
/* El logo oficial, a su tamaño de exportación (105x28). El object-fit evita
   que se deforme si algún día se cambia por una imagen de otra proporción. */
.precio-ars__logo{width:105px;height:28px;object-fit:contain;display:block;flex:0 0 auto;}
/* Reemplazo por si el logo no está disponible. */
.precio-ars__mp{
  background:#00B1EA;color:#fff;font-size:11.5px;font-weight:700;
  padding:4px 9px;border-radius:6px;white-space:nowrap;
}
.prod__actions{display:flex;flex-direction:column;gap:10px;margin-top:6px;}

/* CAMPUS */
.campus__pasos{display:flex;flex-direction:column;gap:16px;margin-top:26px;}
.campus__paso{display:flex;gap:14px;align-items:flex-start;}
.campus__num{
  flex:0 0 auto;width:36px;height:36px;border-radius:11px;
  background:rgba(255,255,255,.1);color:#fff;display:grid;place-items:center;
  font-size:13px;font-weight:800;
}
.campus__grid{margin-top:56px;}
.campus__feat{
  background:var(--black-card);border:1px solid rgba(255,255,255,.08);
  border-radius:var(--radius);padding:24px;
}
.campus__feat b{color:#fff;font-size:16px;}

/* MÉTODO (bento) */
.bento{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.bento__card{padding:28px;display:flex;flex-direction:column;gap:13px;}
.bento__num{font-size:13px;font-weight:800;letter-spacing:.1em;color:var(--red-primary);}
.bento__vis{display:flex;flex-wrap:wrap;gap:7px;margin-top:auto;padding-top:14px;}
.bento__big{grid-column:1/-1;padding:34px;display:grid;grid-template-columns:1fr auto;gap:30px;align-items:center;background:var(--black-card);color:#fff;border:0;}
.bento__list{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:20px;}
.bento__list b{display:block;font-size:15.5px;}
.bento__list span{font-size:14px;color:#9A9A9A;}

/* VIDEO CENTRAL */
.vidcentral{max-width:940px;margin:0 auto;}
.vidcentral__player{position:relative;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-lg);}
.vidcentral__bar{
  position:absolute;left:0;right:0;bottom:0;background:rgba(9,9,9,.9);backdrop-filter:blur(8px);
  padding:16px 20px;display:flex;align-items:center;justify-content:space-between;gap:16px;color:#fff;
}
.vidcentral__bar p{font-size:15px;font-weight:600;}
.guion{max-width:820px;margin:34px auto 0;font-size:17.5px;line-height:1.7;color:var(--text-secondary);text-align:center;}

/* PRUEBA SOCIAL */
.social-strip{display:flex;align-items:center;justify-content:space-between;gap:30px;flex-wrap:wrap;padding:30px 34px;}
.social-strip__items{display:flex;gap:40px;flex-wrap:wrap;}
.social-strip__items div b{display:block;font-size:27px;font-weight:800;letter-spacing:-.02em;line-height:1.1;}
.social-strip__items div span{font-size:13.5px;color:var(--text-secondary);}

/* ETAPAS (audios) */
.etapa{padding:26px 28px;display:flex;gap:20px;align-items:flex-start;}
.etapa__n{
  flex:0 0 auto;width:46px;height:46px;border-radius:13px;background:var(--text-main);color:#fff;
  display:grid;place-items:center;font-weight:800;font-size:15px;
}

/* PLANES */
.plan{padding:34px;display:flex;flex-direction:column;gap:18px;position:relative;}
.plan--rec{border:2px solid var(--red-primary);box-shadow:var(--shadow-md);}
.plan__price{display:flex;align-items:baseline;gap:11px;flex-wrap:wrap;}
.plan__price b{font-size:42px;font-weight:800;letter-spacing:-.03em;line-height:1;}
.plan__price del{font-size:19px;color:#B4AFA8;}
.plan__feat{display:flex;flex-direction:column;gap:11px;flex:1;}

/* TEMARIO */
.lecc{display:flex;align-items:center;gap:13px;padding:12px 0;border-bottom:1px solid var(--border-soft);font-size:15px;}
.lecc:last-child{border-bottom:0;}
.lecc i{
  flex:0 0 auto;width:27px;height:27px;border-radius:8px;background:var(--background-soft);
  display:grid;place-items:center;font-style:normal;font-size:12px;font-weight:700;color:var(--text-secondary);
}
.lecc--bonus i{background:rgba(255,176,0,.18);color:#8A5D00;}

/* TABS */
.tabs{display:flex;gap:8px;background:var(--background-soft);padding:5px;border-radius:var(--radius-pill);width:max-content;max-width:100%;}
.tab{padding:11px 22px;border-radius:var(--radius-pill);font-size:15px;font-weight:600;color:var(--text-secondary);transition:all .18s;}
.tab.is-active{background:#fff;color:var(--text-main);box-shadow:var(--shadow-sm);}
.tabpanel{display:none;} .tabpanel.is-active{display:block;}

/* ACORDEÓN */
.acc{background:#fff;border:1px solid var(--border-soft);border-radius:var(--radius-sm);margin-bottom:12px;overflow:hidden;}
.acc__q{
  width:100%;text-align:left;padding:22px 26px;display:flex;align-items:center;justify-content:space-between;gap:20px;
  font-size:17px;font-weight:600;line-height:1.35;
}
.acc__ico{flex:0 0 auto;width:28px;height:28px;border-radius:50%;background:var(--background-soft);display:grid;place-items:center;font-size:17px;transition:transform .25s,background .2s;}
.acc.is-open .acc__ico{transform:rotate(45deg);background:var(--red-primary);color:#fff;}
.acc__a{max-height:0;overflow:hidden;transition:max-height .3s ease;}
.acc__a p{padding:0 26px 24px;color:var(--text-secondary);font-size:16px;line-height:1.65;}

/* SERVICIOS */
.serv{padding:28px;display:flex;flex-direction:column;gap:13px;}
.serv__ico{width:48px;height:48px;border-radius:14px;background:var(--background-soft);display:grid;place-items:center;font-size:22px;}

/* BREADCRUMB */
.crumb{display:flex;align-items:center;gap:9px;font-size:13.5px;color:var(--text-secondary);padding:22px 0 0;flex-wrap:wrap;}
.crumb a:hover{color:var(--text-main);text-decoration:underline;}

/* PÁGINA INTERNA — encabezado */
.phead{padding:34px 0 56px;}
.phead__grid{display:grid;grid-template-columns:1.1fr .9fr;gap:52px;align-items:center;}
.phead__media{position:relative;}

/* PÁGINA DE ACCESO */
.login{padding-top:34px;}
.login__grid{display:grid;grid-template-columns:1fr 460px;gap:38px;align-items:stretch;}
.login__aside{background:var(--black-section);border-radius:var(--radius);padding:30px;color:#fff;}
.login__card{background:#fff;border:1px solid var(--border-soft);border-radius:var(--radius);box-shadow:var(--shadow-md);padding:38px;align-self:start;}
.login__row{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin:4px 0 18px;}
.login__check{display:flex;align-items:center;gap:9px;font-size:14.5px;color:var(--text-secondary);cursor:pointer;}
.login__check input{width:19px;height:19px;accent-color:var(--red-primary);}
.login__sep{display:flex;align-items:center;gap:14px;margin:22px 0 14px;color:var(--text-secondary);font-size:13.5px;}
.login__sep::before,.login__sep::after{content:'';flex:1;height:1px;background:var(--border-soft);}
.tabs--full{width:100%;margin-bottom:22px;}
.tabs--full .tab{flex:1;text-align:center;}
/* Contenedor del botón real de Google (Identity Services). Alto fijo para
   que no salte el layout mientras el SDK termina de cargar y lo dibuja. */
.gsi-btn{min-height:44px;display:flex;justify-content:center;}
.gsi-btn > div{width:100%!important;}

/* El formulario real lo genera Academy LMS con sus propias clases.
   Estos selectores lo dejan con el mismo aspecto que el maquetado. */
.login__form{margin-top:24px;}
.login__form form{margin:0;}
.login__form label,
.login__form .academy-form-group label{font-size:14px;font-weight:600;display:block;margin-bottom:7px;}
.login__form input[type="text"],
.login__form input[type="email"],
.login__form input[type="password"]{
  width:100%;min-height:50px;padding:13px 15px;border:1.5px solid var(--border-soft);
  border-radius:12px;background:#fff;font-size:16px;
  transition:border-color .15s,box-shadow .15s;
}
.login__form input:focus{outline:0;border-color:var(--text-main);box-shadow:0 0 0 3px rgba(17,17,17,.06);}
.login__form button[type="submit"],
.login__form .academy-btn{
  width:100%;min-height:52px;border-radius:var(--radius-pill);
  background:var(--red-primary);color:#fff;font-size:16px;font-weight:600;cursor:pointer;
  transition:background .18s,transform .18s;
}
.login__form button[type="submit"]:hover,
.login__form .academy-btn:hover{background:var(--red-dark);transform:translateY(-2px);}
.login__form a{color:var(--text-main);}

/* LEGAL */
.legal-block{max-width:800px;}
.legal-block h3{margin-top:34px;}
.legal-block p{color:var(--text-secondary);margin-top:10px;font-size:16.5px;line-height:1.7;}
.disclaimer{background:var(--background-soft);border:1px solid var(--border-soft);border-radius:var(--radius);padding:30px 34px;}

/* FOOTER */
.footer{background:var(--black-section);color:#fff;padding:72px 0 34px;}
.footer__grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:44px;}
.footer h4{font-size:13px;font-weight:700;letter-spacing:.11em;text-transform:uppercase;color:#8A8A8A;margin-bottom:18px;}
.footer a{font-size:15px;color:#D6D6D6;display:block;padding:6px 0;transition:color .15s;}
.footer a:hover{color:#fff;}
.footer__bottom{margin-top:52px;padding-top:26px;border-top:1px solid rgba(255,255,255,.1);display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:13.5px;color:#8A8A8A;}
.footer__social{display:flex;gap:10px;margin-top:20px;}
.footer__social a{
  width:42px;height:42px;border-radius:12px;background:rgba(255,255,255,.08);
  display:grid;place-items:center;padding:0;font-size:12px;font-weight:700;color:#fff;
}
.footer__social a:hover{background:var(--red-primary);}

/* ---------- 10. CALENDARIO ------------------------------------------- */
.booking{display:grid;grid-template-columns:.85fr 1.15fr;gap:0;overflow:hidden;}
.booking__side{background:var(--background-soft);padding:34px;border-right:1px solid var(--border-soft);min-width:0;}
.booking__main{padding:34px;min-width:0;}

.steps{display:flex;gap:8px;margin-bottom:26px;flex-wrap:wrap;}
.step{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600;color:var(--text-secondary);}
.step i{width:26px;height:26px;border-radius:50%;background:var(--background-soft);border:1px solid var(--border-soft);display:grid;place-items:center;font-style:normal;font-size:12.5px;font-weight:700;}
.step.is-active{color:var(--text-main);}
.step.is-active i{background:var(--text-main);color:#fff;border-color:var(--text-main);}
.step.is-done i{background:var(--red-primary);color:#fff;border-color:var(--red-primary);}
.step__sep{width:16px;height:1px;background:var(--border-soft);}

.svc-opt{
  width:100%;text-align:left;padding:22px;border:2px solid var(--border-soft);border-radius:var(--radius-sm);
  background:#fff;display:flex;justify-content:space-between;gap:18px;align-items:flex-start;
  transition:border-color .18s,box-shadow .18s;margin-bottom:14px;
}
.svc-opt:hover{border-color:#C9C4BD;}
.svc-opt.is-sel{border-color:var(--red-primary);box-shadow:0 0 0 3px rgba(255,52,52,.1);}

.cal__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;}
.cal__nav{width:40px;height:40px;border-radius:11px;border:1px solid var(--border-soft);background:#fff;display:grid;place-items:center;font-size:17px;}
.cal__nav[disabled]{opacity:.3;pointer-events:none;}
.cal__month{font-size:17px;font-weight:700;text-transform:capitalize;}
.cal__dows{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-bottom:8px;}
.cal__dows span{text-align:center;font-size:11.5px;font-weight:700;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;}
.cal__grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;}
.cal__day{
  aspect-ratio:1;border-radius:11px;background:#fff;border:1px solid var(--border-soft);
  display:grid;place-items:center;font-size:15px;font-weight:600;transition:all .15s;min-height:42px;
}
.cal__day:hover:not([disabled]){border-color:var(--text-main);}
.cal__day[disabled]{background:transparent;border-color:transparent;color:#C9C4BD;pointer-events:none;}
.cal__day.is-sel{background:var(--red-primary);border-color:var(--red-primary);color:#fff;}
.cal__day.is-empty{background:transparent;border-color:transparent;pointer-events:none;}

.slots{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
.slot{
  padding:13px 8px;border-radius:11px;border:1px solid var(--border-soft);background:#fff;
  font-size:15px;font-weight:600;text-align:center;transition:all .15s;min-height:46px;
}
.slot:hover:not([disabled]){border-color:var(--text-main);}
.slot.is-sel{background:var(--text-main);border-color:var(--text-main);color:#fff;}
.slot[disabled]{opacity:.35;text-decoration:line-through;pointer-events:none;}

.summary{background:var(--background-soft);border-radius:var(--radius-sm);padding:22px 24px;}
.summary__row{display:flex;justify-content:space-between;gap:16px;padding:9px 0;border-bottom:1px solid var(--border-soft);font-size:15px;}
.summary__row:last-child{border-bottom:0;}
.summary__row b{text-align:right;}
.summary__total{display:flex;justify-content:space-between;align-items:baseline;padding-top:16px;margin-top:6px;border-top:2px solid var(--text-main);}
.summary__total b{font-size:28px;font-weight:800;letter-spacing:-.02em;}

.success{text-align:center;max-width:560px;margin:0 auto;padding:20px 0;}
.success__ico{
  width:82px;height:82px;border-radius:50%;background:rgba(37,211,102,.14);margin:0 auto 24px;
  display:grid;place-items:center;font-size:38px;
}
.success__code{
  display:inline-block;background:var(--background-soft);border:1px dashed #C9C4BD;border-radius:11px;
  padding:13px 22px;font-size:21px;font-weight:800;letter-spacing:.06em;margin:8px 0 22px;
}

/* ---------- 11. FORMULARIOS ------------------------------------------- */
.field{display:flex;flex-direction:column;gap:7px;margin-bottom:16px;}
.field label{font-size:14px;font-weight:600;}
.field label span{color:var(--red-primary);}
.field input,.field select,.field textarea{
  min-height:50px;padding:13px 15px;border:1.5px solid var(--border-soft);border-radius:12px;
  background:#fff;font-size:16px;transition:border-color .15s,box-shadow .15s;width:100%;
}
.field textarea{min-height:104px;resize:vertical;line-height:1.5;}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-color:var(--text-main);box-shadow:0 0 0 3px rgba(17,17,17,.06);}
.field.has-error input,.field.has-error select,.field.has-error textarea{border-color:var(--red-primary);}
.field__err{font-size:13px;color:var(--red-primary);font-weight:500;display:none;}
.field.has-error .field__err{display:block;}
.field--check{flex-direction:row;align-items:flex-start;gap:11px;}
.field--check input{width:20px;height:20px;min-height:20px;flex:0 0 auto;margin-top:2px;accent-color:var(--red-primary);}
.field--check label{font-weight:400;font-size:14.5px;color:var(--text-secondary);line-height:1.5;}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 18px;}

.pay-opt{
  display:flex;align-items:center;gap:13px;padding:16px 18px;border:1.5px solid var(--border-soft);
  border-radius:12px;background:#fff;margin-bottom:10px;cursor:pointer;transition:border-color .15s;
}
.pay-opt:hover{border-color:#C9C4BD;}
.pay-opt.is-sel{border-color:var(--red-primary);box-shadow:0 0 0 3px rgba(255,52,52,.09);}
.pay-opt input{width:19px;height:19px;accent-color:var(--red-primary);flex:0 0 auto;}

.notice{
  background:rgba(255,176,0,.13);border:1px solid rgba(255,176,0,.35);border-radius:12px;
  padding:14px 17px;font-size:14.5px;font-weight:600;color:#7A5200;display:flex;gap:10px;align-items:flex-start;
}

/* Checkout: dos columnas en desktop, una sola desde tablet.
   Va como clase (no inline) para que las media queries puedan pisarlo. */
.checkout-grid{grid-template-columns:1.25fr .75fr;}
@media (max-width:900px){ .checkout-grid{grid-template-columns:1fr;} }

.coupon{display:flex;gap:9px;}
.coupon input{flex:1;text-transform:uppercase;}
.coupon-ok{color:#1B7F3C;font-size:13.5px;font-weight:600;margin-top:7px;}
.coupon-bad{color:var(--red-primary);font-size:13.5px;font-weight:600;margin-top:7px;}

/* ---------- 12. MODALES Y TOASTS -------------------------------------- */
.modal{position:fixed;inset:0;z-index:100;display:none;align-items:center;justify-content:center;padding:20px;}
.modal.is-open{display:flex;}
.modal__bg{position:absolute;inset:0;background:rgba(9,9,9,.82);backdrop-filter:blur(5px);}
.modal__box{position:relative;background:#fff;border-radius:var(--radius);max-width:820px;width:100%;overflow:hidden;box-shadow:var(--shadow-lg);max-height:92vh;overflow-y:auto;}
.modal__close{position:absolute;top:14px;right:14px;z-index:2;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.94);display:grid;place-items:center;font-size:21px;box-shadow:var(--shadow-sm);}
.modal__player{position:relative;aspect-ratio:16/9;background:#0C0C0C;display:grid;place-items:center;text-align:center;padding:30px;}
.modal__player img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.32;}
.modal__player > div{position:relative;color:#fff;}
/* Reproductor de Vimeo incrustado */
.modal__video{position:relative;aspect-ratio:16/9;background:#000;}
.modal__video iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.modal__foot{padding:24px 28px;}

/* ---- BUSCADOR ---- */
.search{position:fixed;inset:0;z-index:120;display:none;justify-content:center;padding:14vh 20px 20px;}
.search.is-open{display:flex;}
.search__bg{position:absolute;inset:0;background:rgba(9,9,9,.62);backdrop-filter:blur(5px);}
.search__box{position:relative;width:100%;max-width:620px;background:#fff;border-radius:var(--radius);box-shadow:var(--shadow-lg);overflow:hidden;max-height:72vh;display:flex;flex-direction:column;}
.search__field{display:flex;align-items:center;gap:12px;padding:16px 18px;border-bottom:1px solid var(--border-soft);flex:0 0 auto;}
.search__field svg{width:21px;height:21px;color:var(--text-secondary);flex:0 0 auto;}
.search__field input{flex:1;min-width:0;border:0;outline:0;font-size:17px;background:transparent;padding:6px 0;}
.search__close{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font-size:22px;color:var(--text-secondary);flex:0 0 auto;}
.search__close:hover{background:var(--background-soft);color:var(--text-main);}
.search__results{overflow-y:auto;padding:8px;}
.search__hint{padding:22px 14px;color:var(--text-secondary);font-size:15px;}
.search__item{display:block;padding:13px 14px;border-radius:12px;transition:background .14s;}
.search__item:hover{background:var(--background-soft);}
.search__cat{display:block;font-size:11px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--red-primary);margin-bottom:4px;}
.search__item b{display:block;font-size:16px;line-height:1.3;}
.search__desc{display:block;font-size:14px;color:var(--text-secondary);margin-top:3px;line-height:1.45;}

.toast-wrap{position:fixed;right:18px;bottom:calc(var(--bar-h) + 22px);z-index:110;display:flex;flex-direction:column;gap:10px;pointer-events:none;}
.toast{
  background:var(--text-main);color:#fff;border-radius:13px;padding:14px 18px;font-size:14.5px;font-weight:600;
  box-shadow:var(--shadow-lg);max-width:330px;animation:toastIn .28s ease;
}
.toast--ok{background:#146B32;}
.toast--bad{background:var(--red-dark);}
@keyframes toastIn{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:translateY(0);}}

/* Aparición al scrollear.
   El estado oculto SOLO se aplica si el JS arrancó (body.anim). Así, si el script
   falla o tarda, el contenido se ve igual en lugar de quedar en blanco. */
body.anim .reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease;}
body.anim .reveal.is-in{opacity:1;transform:none;}

/* ---------- 13. RESPONSIVE -------------------------------------------- */
/* Entre 900 y 1240 px el menú completo, el logo y las acciones van justos:
   se achica un poco el menú para que todo entre en una línea. */
@media (max-width:1240px) and (min-width:901px){
  .nav{gap:16px;}
  .nav a{font-size:14.5px;}
}

@media (max-width:1080px){
  .h1{font-size:56px;} .h2{font-size:44px;}
  .hero__grid{gap:38px;}
  .bento{grid-template-columns:repeat(2,1fr);}
  .footer__grid{grid-template-columns:1fr 1fr;gap:36px;}
}

/* --- TABLET --- */
@media (max-width:900px){
  :root{--pad-side:24px;--bar-h:84px;}
  .h1{font-size:48px;} .h2{font-size:38px;} .h3{font-size:26px;} .script{font-size:46px;}
  .section{padding:72px 0;}
  .nav{display:none;}
  .burger{display:grid;}
  /* En móvil quedan lupa + cuenta + hamburguesa, como en el header de escritorio
     pero sin el menú desplegado. */
  .hero{padding:40px 0 60px;}
  .hero__grid{grid-template-columns:1fr;gap:40px;}
  .hero__card{max-width:460px;}
  .grid-2,.grid-3,.grid-4{grid-template-columns:repeat(2,1fr);}
  .booking{grid-template-columns:1fr;}
  .booking__side{border-right:0;border-bottom:1px solid var(--border-soft);}
  .bento__big{grid-template-columns:1fr;}
  .bento__list{grid-template-columns:repeat(2,1fr);}
  .phead__grid{grid-template-columns:1fr;gap:34px;}
  .phead__media{max-width:420px;}
  .login__grid{grid-template-columns:1fr;gap:24px;}
  .login__aside{order:2;}
  .stickybar__text{font-size:14.5px;}
}

/* En pantallas medianas y chicas el header tiene que entrar sí o sí en una
   línea: logo + carrito + lupa + cuenta + hamburguesa. Achicamos separaciones
   y botones para ganar lugar antes de tener que esconder nada. */
@media (max-width:700px){
  .header__in{gap:10px;}
  .hdr-actions{gap:4px;}
  .icon-btn{width:40px;height:40px;}
  .icon-btn svg{width:19px;height:19px;}
  .btn--ingresar{min-height:40px;padding:0 15px;font-size:14.5px;}
  .burger{width:42px;height:42px;}
}
/* Abajo de ~560px ya no entra el nombre completo al lado de los botones:
   queda solo el monograma MG, que sigue linkeando al inicio. */
@media (max-width:560px){
  .logo span:not(.logo__mark){display:none;}
  .header .logo__mark{width:36px;height:36px;}
  /* En el menú desplegado y en el footer sí hay lugar: ahí se ve completo. */
  .mobile-menu .logo span:not(.logo__mark),
  .footer .logo span:not(.logo__mark){display:inline;}
}

/* --- MÓVIL --- */
@media (max-width:640px){
  :root{--pad-side:18px;--radius:20px;--bar-h:78px;}
  .h1{font-size:42px;} .h2{font-size:34px;} .h3{font-size:25px;}
  .lead{font-size:18px;} .script{font-size:38px;}
  .section{padding:56px 0;}
  .section--tight{padding:44px 0;}
  .section-head{margin-bottom:34px;}

  .grid-2,.grid-3,.grid-4,.bento,.bento__list,.form-grid,.social-strip__items{grid-template-columns:1fr;}
  .hero__bullets{grid-template-columns:1fr;}
  .hero__actions{flex-direction:column;}
  .hero__actions .btn{width:100%;}
  .hero__arrow--l{left:6px;} .hero__arrow--r{right:6px;}
  .card--pad,.plan,.bento__card,.serv{padding:22px;}
  /* El calendario necesita más ancho útil: menos padding y celdas más chicas
     para que las 7 columnas entren sin recortarse en 360-390 px. */
  .booking__side,.booking__main{padding:18px;}
  .cal__grid,.cal__dows{gap:4px;}
  .cal__day{min-height:34px;border-radius:9px;font-size:14px;}
  .prod__body{padding:22px;}
  .prod__price b{font-size:29px;}
  .plan__price b{font-size:35px;}
  .precio-ars b{font-size:23px;}
  .precio-ars__logo{width:94px;height:25px;}
  .logo{font-size:14.5px;gap:9px;}
  .logo__mark{width:34px;height:34px;border-radius:10px;font-size:12.5px;}
  .login__card,.login__aside{padding:22px;}
  /* En pantallas angostas la lupa sale del header: la búsqueda queda dentro
     del menú, así entran logo + Ingresar + hamburguesa sin apretarse. */
  #btnBuscar{display:none;}
  .hdr-actions{gap:6px;}
  .btn--ingresar{padding:0 16px;font-size:14.5px;}
  .search{padding:0;align-items:stretch;}
  .search__box{max-width:100%;max-height:100%;border-radius:0;}
  .campus__grid{margin-top:34px;}
  .cta-row{flex-direction:column;align-items:flex-start;gap:16px;}
  .cta-row .row{width:100%;}
  .btn{width:100%;}
  .row .btn,.stickybar .btn,.coupon .btn,.tabs .tab{width:auto;}
  .slots{grid-template-columns:repeat(2,1fr);}
  .acc__q{padding:18px;font-size:16px;}
  .acc__a p{padding:0 18px 20px;}
  .footer{padding:52px 0 26px;}
  .footer__grid{grid-template-columns:1fr;gap:30px;}
  .vidcentral__bar{flex-direction:column;align-items:stretch;gap:12px;padding:14px;}
  .vidcentral__bar p{text-align:center;}
  .guion{font-size:16px;text-align:left;}
  .tabs{width:100%;}
  .tab{flex:1;text-align:center;padding:11px 10px;font-size:14px;}
  .social-strip{padding:22px;}
  .social-strip__items{gap:18px;}
  .social-strip__items div{display:flex;align-items:baseline;gap:9px;}
  .social-strip__items div b{font-size:22px;}
  .modal__box{max-height:88vh;}
  .toast-wrap{right:12px;left:12px;bottom:calc(var(--bar-h) + 14px);}
  .toast{max-width:100%;}

  /* barra fija compacta */
  .stickybar{bottom:10px;padding:12px 14px;width:calc(100% - 20px);gap:10px;}
  .stickybar__desktop{display:none;}
  .stickybar__mobile{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;}
  .stickybar__mobile p{font-size:13.5px;font-weight:700;line-height:1.2;flex:1;min-width:0;}
  .stickybar__mobile .btn{flex:0 0 auto;min-height:46px;padding:0 16px;font-size:14px;}
  .stickybar__wa{
    flex:0 0 auto;width:46px;height:46px;border-radius:50%;background:var(--whatsapp);
    display:grid;place-items:center;
  }
}

/* ---------- EL METODO MALIK ------------------------------------------ */
.internal-ribbon{
  position:fixed;top:88px;right:18px;z-index:90;
  background:#fff;border:1px solid var(--border-soft);border-radius:999px;
  padding:8px 12px;font-size:11px;font-weight:800;letter-spacing:.08em;
  color:var(--text-main);box-shadow:var(--shadow-sm);
}
.internal-badge{position:absolute;top:14px;right:14px;background:#fff;color:var(--text-main);}
.img-label{
  position:absolute;left:14px;bottom:14px;z-index:2;
  background:rgba(255,255,255,.92);color:#111;border-radius:999px;
  padding:6px 10px;font-size:11.5px;font-weight:700;
}
.mini-script{font-size:30px;margin-top:12px;color:var(--red-primary);}
.testimonial{overflow:hidden;background:var(--black-card);border-color:rgba(255,255,255,.1);color:#fff;}
.testimonial__body{padding:18px;display:flex;flex-direction:column;gap:10px;}
.testimonial__body p{font-size:15px;color:#D6D6D6;line-height:1.55;}
.testimonial__body b:last-child{font-size:14px;color:#fff;}
.campus-panel{
  padding:26px;background:var(--black-card);border-color:rgba(255,255,255,.1);color:#fff;
}
.progress{height:10px;border-radius:999px;background:rgba(255,255,255,.1);overflow:hidden;margin:16px 0;}
.progress span{display:block;height:100%;background:var(--red-primary);border-radius:inherit;}
.audio-player{
  display:flex;align-items:center;gap:14px;background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:14px;margin-top:12px;
}
.audio-player button{
  width:44px;height:44px;border-radius:50%;background:#fff;color:#111;font-weight:800;
}
.audio-player small{display:block;color:#AFAFAF;margin-top:2px;}
.team-widget{position:fixed;right:18px;bottom:126px;z-index:75;}
.team-bubble{
  min-height:48px;border-radius:999px;background:var(--whatsapp);color:#062d14;
  padding:0 18px;font-size:14px;font-weight:800;box-shadow:var(--shadow-md);
}
.team-card{
  display:none;position:absolute;right:0;bottom:58px;width:310px;
  background:#fff;border:1px solid var(--border-soft);border-radius:20px;
  padding:22px;box-shadow:var(--shadow-lg);
}
.team-widget.is-open .team-card{display:block;}
.team-card p{font-size:14.5px;color:var(--text-secondary);margin:8px 0 16px;}
.team-close{position:absolute;top:10px;right:12px;font-size:22px;color:var(--text-secondary);}
.serv{position:relative;}
.pay-opt small,.svc-opt small{color:var(--text-secondary);}
.cross{align-items:flex-start;}
.search{display:none!important;}
.h1,.h2,.h3,.h4,.btn,.nav a{letter-spacing:0;}

@media (max-width:640px){
  .internal-ribbon{top:78px;right:10px;font-size:9.5px;padding:6px 9px;}
  .team-widget{right:10px;bottom:96px;}
  .team-bubble{display:none;}
  .team-card{display:none;}
  .grid-4{grid-template-columns:1fr;}
}
