/* =========================================================
   PATH — un programa de Conectto Lab
   Sistema visual basado en /brand/brand-guide.md
   ========================================================= */

@import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&display=swap');

:root{
  /* Familia Teal/Verde (principal) */
  --teal-900:#255059;
  --teal-700:#078C8C;
  --teal-500:#03AFAB;
  --teal-300:#46D1CA;
  --teal-100:#9AD8D6;

  /* Familia Coral/Naranja (acento cálido) */
  --coral-700:#F27850;
  --coral-500:#F98C6E;
  --coral-300:#F2AD94;
  --coral-200:#EAC8BE;
  --coral-100:#F9D9CD;

  /* Familia Neutra/Tierra (soporte) */
  --earth-700:#A6786D;
  --earth-500:#BF968E;
  --earth-300:#CCB1AE;
  --earth-200:#D6CEC9;
  --earth-100:#EFE2DA;

  --cream:#F7EFE9;
  --ink:#20393E;
  --white:#FFFFFF;

  --font:'Jost', 'Century Gothic', 'Poppins', system-ui, sans-serif;

  --container:1180px;
  --radius-lg:28px;
  --radius-md:18px;
  --radius-sm:12px;
  --shadow-soft:0 20px 50px -25px rgba(37,80,89,0.35);
  --header-h:4.4rem;

  --space-1:.5rem;
  --space-2:1rem;
  --space-3:1.5rem;
  --space-4:2.5rem;
  --space-5:4rem;
  --space-6:6rem;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  font-family:var(--font);
  color:var(--ink);
  background:var(--white);
  -webkit-font-smoothing:antialiased;
  line-height:1.6;
  overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4{ margin:0; font-weight:600; letter-spacing:-0.01em; }
p{ margin:0; }
section{ position:relative; }
section[id]{ scroll-margin-top: var(--header-h); }

.container{
  width:100%;
  max-width:var(--container);
  margin:0 auto;
  padding:0 var(--space-3);
  position:relative;
}

/* Evita el "blowout" de grid/flex: permite que las celdas se
   encojan por debajo del ancho mínimo de su contenido (texto largo). */
.hero .container > *,
.autoridad-top > *,
.founders > *,
.conectto-blurb > *,
.modules > *,
.resultados .container > *,
.results-grid > *,
.footer-top > *,
.footer-links > *,
.pricing-grid > * {
  min-width: 0;
}

/* -------------------- Utility -------------------- */
.eyebrow{
  display:inline-block;
  font-size:.78rem;
  font-weight:600;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--coral-700);
  margin-bottom:var(--space-2);
}
.eyebrow.on-dark{ color:var(--teal-300); }

.section-title{
  font-size:clamp(1.9rem, 3.4vw, 2.7rem);
  line-height:1.15;
  max-width:44rem;
}
.section-subtag{
  margin-top:.5rem;
  font-size:.95rem;
  font-weight:500;
  letter-spacing:.03em;
  color:var(--coral-700);
}
.section-lede{
  margin-top:var(--space-2);
  font-size:1.1rem;
  color:#4B6167;
  max-width:40rem;
}
.on-dark .section-lede{ color:var(--teal-100); }

.section-head{
  margin-bottom:var(--space-5);
}
.section-head.center{
  margin-left:auto; margin-right:auto; text-align:center;
}
.section-head.center .section-title{ margin-left:auto; margin-right:auto; }
.section-head.center .section-lede{ margin-left:auto; margin-right:auto; }

/* -------------------- Buttons -------------------- */
.btn-row{
  display:flex;
  flex-wrap:wrap;
  gap:1rem;
  margin-top:var(--space-4);
}
.section-head.center + .btn-row,
.center-btns{ justify-content:center; }

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  padding:.95rem 1.9rem;
  border-radius:999px;
  font-family:var(--font);
  font-weight:600;
  font-size:1rem;
  border:2px solid transparent;
  cursor:pointer;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease, border-color .18s ease;
  white-space:nowrap;
}
.btn:hover{ transform:translateY(-2px); }
.btn-primary{
  background:var(--coral-700);
  color:var(--white);
  box-shadow:0 14px 30px -12px rgba(242,120,80,.55);
}
.btn-primary:hover{ background:#e0653c; }

.btn-secondary{
  background:transparent;
  color:var(--teal-900);
  border-color:var(--teal-900);
}
.btn-secondary:hover{ background:var(--teal-900); color:var(--white); }

.on-dark .btn-secondary{ color:var(--white); border-color:rgba(255,255,255,.6); }
.on-dark .btn-secondary:hover{ background:var(--white); color:var(--teal-900); }

/* -------------------- Header -------------------- */
.site-header{
  position:fixed;
  top:0; left:0; right:0;
  z-index:100;
  padding:.85rem 0;
  background:rgba(247,239,233,0);
  transition:background .25s ease, box-shadow .25s ease, padding .25s ease;
}
.site-header.is-scrolled{
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(10px);
  box-shadow:0 8px 30px -20px rgba(32,57,62,.4);
  padding:.55rem 0;
}
.site-header .container{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
}
.brand-logo{ display:flex; align-items:center; gap:.6rem; }
.brand-logo img{ height:26px; width:auto; }

.main-nav{
  display:flex;
  align-items:center;
  gap:1.9rem;
}
.main-nav a{
  font-size:.95rem;
  font-weight:500;
  color:var(--teal-900);
  opacity:.85;
}
.main-nav a:hover{ opacity:1; }

.header-ctas{ display:flex; align-items:center; }
.header-ctas .btn{ padding:.65rem 1.35rem; font-size:.9rem; }

.nav-toggle{
  display:none;
  width:44px; height:44px;
  border-radius:50%;
  border:1.5px solid var(--teal-900);
  background:transparent;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}
.nav-toggle span, .nav-toggle span::before, .nav-toggle span::after{
  content:'';
  display:block;
  width:18px; height:2px;
  background:var(--teal-900);
  position:relative;
  transition:transform .2s ease, opacity .2s ease;
}
.nav-toggle span::before{ position:absolute; top:-6px; }
.nav-toggle span::after{ position:absolute; top:6px; }

/* -------------------- Hero (Parte 1) -------------------- */
.hero{
  padding:6.6rem 0 3rem;
  background:linear-gradient(160deg, var(--cream) 0%, #EFF6F5 55%, var(--teal-100) 130%);
  overflow:hidden;
}
.hero .container{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:var(--space-4);
  align-items:center;
}
.hero h1{
  font-size:clamp(2.6rem, 5.4vw, 4.4rem);
  line-height:.95;
  color:var(--teal-900);
  letter-spacing:.01em;
}
.hero-tagline{
  margin-top:.6rem;
  font-size:clamp(1rem, 1.3vw, 1.15rem);
  font-weight:500;
  font-style:italic;
  color:var(--coral-700);
}
.hero h2{
  margin-top:.9rem;
  font-size:clamp(1.2rem, 2vw, 1.55rem);
  font-weight:500;
  color:var(--ink);
  max-width:32rem;
  line-height:1.3;
}
.hero p{
  margin-top:.85rem;
  font-size:1.02rem;
  color:#4B6167;
  max-width:32rem;
}
.hero p + p{ margin-top:.5rem; }
.hero .btn-row{ margin-top:1.75rem; }

.hero-visual{
  position:relative;
  border-radius:var(--radius-lg);
  overflow:hidden;
  aspect-ratio:4/3.85;
  box-shadow:var(--shadow-soft);
}
.hero-visual img{ width:100%; height:100%; object-fit:cover; }
.hero-visual::after{
  content:'';
  position:absolute; inset:0;
  background:linear-gradient(200deg, rgba(37,80,89,0) 65%, rgba(37,80,89,.28) 100%);
}

/* -------------------- Wave dividers -------------------- */
.wave{
  position:absolute;
  left:0; right:0; bottom:-1px;
  line-height:0;
  pointer-events:none;
  z-index:1;
}
.wave svg{ width:100%; height:60px; display:block; }
.fill-white{ fill:var(--white); }
.fill-cream{ fill:var(--cream); }
.fill-teal-900{ fill:var(--teal-900); }
.fill-warm{ fill:var(--coral-500); }
.fill-warm2{ fill:var(--coral-100); }
.fill-dark{ fill:#132C31; }

/* -------------------- Autoridad (Parte 2) -------------------- */
.autoridad{
  padding:var(--space-6) 0 var(--space-5);
  background:var(--white);
}
.autoridad-banner{
  border-radius:var(--radius-lg);
  overflow:hidden;
  box-shadow:var(--shadow-soft);
  margin-bottom:var(--space-5);
}
.autoridad-banner img{ width:100%; height:auto; display:block; }

.autoridad-top{
  max-width:44rem;
  margin:0 auto var(--space-6);
  text-align:center;
}
.autoridad-top .section-title,
.autoridad-top .section-lede{ margin-left:auto; margin-right:auto; }

.method-callout{
  background:var(--teal-900);
  color:var(--white);
  border-radius:var(--radius-md);
  padding:var(--space-4);
  margin-top:var(--space-4);
}
.method-callout p{ color:var(--teal-100); }
.method-callout strong{ color:var(--white); }

.founders{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:var(--space-4);
}
.founder-card{
  background:var(--cream);
  border-radius:var(--radius-md);
  padding:var(--space-4);
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:.35rem;
}
.founder-photo{
  width:11.5rem;
  height:11.5rem;
  border-radius:50%;
  overflow:hidden;
  box-shadow:var(--shadow-soft);
  margin-bottom:.75rem;
  border:4px solid var(--white);
}
.founder-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 20%;
}
.founder-card h3{ font-size:1.3rem; color:var(--teal-900); }
.founder-role{
  font-size:.85rem;
  font-weight:600;
  letter-spacing:.05em;
  text-transform:uppercase;
  color:var(--coral-700);
}
.founder-card p{ color:#4B6167; font-size:.98rem; margin-top:.5rem; max-width:26rem; }

.conectto-blurb{
  margin-top:var(--space-5);
  background:var(--teal-900) url('../assets/graphics/conectto-blurb-bg.jpg') center / cover no-repeat;
  color:var(--white);
  border-radius:var(--radius-lg);
  padding:var(--space-5) var(--space-4);
  text-align:center;
  position:relative;
  overflow:hidden;
  min-height:22rem;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.conectto-blurb::before{
  content:'';
  position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(22,51,56,.55) 0%, rgba(22,51,56,.15) 55%);
  z-index:0;
}
.blurb-logo{
  position:relative;
  z-index:1;
  height:22px;
  width:auto;
  margin:0 auto 1.4rem;
}
.conectto-blurb h3{
  position:relative;
  z-index:1;
  font-size:clamp(1.4rem, 2.6vw, 1.9rem);
  max-width:36rem;
  margin:0 auto;
  line-height:1.35;
}
.conectto-blurb p{
  position:relative;
  z-index:1;
  color:var(--teal-100);
  margin:1rem auto 0;
  max-width:34rem;
}
.brand-word{ color:var(--white); }
.e-accent{
  color:var(--coral-300);
  font-style:italic;
}

/* -------------------- Método (Parte 3) -------------------- */
.metodo{
  padding:var(--space-5) 0 var(--space-6);
  background:var(--cream);
}
.metodo-banner{
  border-radius:var(--radius-lg);
  overflow:hidden;
  margin-bottom:var(--space-6);
  position:relative;
  box-shadow:var(--shadow-soft);
}
.metodo-banner img{ width:100%; height:clamp(180px,26vw,320px); object-fit:cover; object-position:center 15%; }
.metodo-banner::after{
  content:'';
  position:absolute; inset:0;
  background:linear-gradient(100deg, rgba(37,80,89,.82) 0%, rgba(37,80,89,.4) 42%, rgba(7,140,140,.18) 65%, rgba(242,120,80,.32) 100%);
}
.metodo-banner-text{
  position:absolute; inset:0;
  display:flex; flex-direction:column; justify-content:center;
  padding:0 var(--space-5);
  color:var(--white);
  max-width:30rem;
  z-index:2;
}
.metodo-banner-text .eyebrow{ color:var(--coral-300); }
.metodo-banner-text p{ margin-top:.6rem; color:var(--teal-100); }

.modules{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:var(--space-3);
  counter-reset:mod;
}
.module-card{
  background:var(--white);
  border-radius:var(--radius-md);
  padding:var(--space-4);
  border-top:6px solid var(--mod-color, var(--teal-700));
  box-shadow:0 24px 50px -35px rgba(37,80,89,.4);
  display:flex;
  flex-direction:column;
}
.module-card .mod-number{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:2.6rem; height:2.6rem;
  border-radius:50%;
  background:var(--mod-color, var(--teal-700));
  color:var(--white);
  font-weight:600;
  margin-bottom:var(--space-3);
}
.module-card .mod-weeks{
  font-size:.8rem;
  font-weight:600;
  letter-spacing:.05em;
  text-transform:uppercase;
  color:var(--mod-color, var(--teal-700));
  margin-bottom:.3rem;
}
.module-card h3{ font-size:1.4rem; color:var(--teal-900); margin-bottom:.7rem; }
.module-card p{ color:#4B6167; font-size:.98rem; }
.module-card .mod-develops{
  margin-top:auto;
  padding-top:1rem;
  border-top:1px solid var(--earth-100);
  font-size:.9rem;
  color:var(--teal-900);
}
.module-card .mod-develops strong{ display:block; margin-bottom:.3rem; color:var(--mod-color, var(--teal-700)); }

.module-card.mod-1{ --mod-color:var(--teal-700); }
.module-card.mod-2{ --mod-color:var(--coral-700); }
.module-card.mod-3{ --mod-color:var(--earth-700); }

.metodo-note{
  margin-top:var(--space-4);
  background:var(--white);
  border-radius:var(--radius-md);
  padding:var(--space-4);
  display:flex;
  align-items:center;
  gap:var(--space-3);
  font-size:1.02rem;
  color:var(--teal-900);
}
.metodo-note svg{ flex:none; width:2.4rem; height:2.4rem; color:var(--coral-700); }

/* -------------------- Resultados (Parte 4) -------------------- */
.resultados{
  padding:var(--space-6) 0;
  background:var(--white);
}
.resultados .container{
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:var(--space-5);
  align-items:start;
}
.resultados-photo{
  position:sticky;
  top:6.5rem;
  border-radius:var(--radius-lg);
  overflow:hidden;
  box-shadow:var(--shadow-soft);
}
.resultados-photo img{ width:100%; }

.results-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1rem;
}
.result-card{
  background:var(--cream);
  border-radius:var(--radius-md);
  padding:var(--space-3);
  border-left:5px solid var(--r-color, var(--teal-700));
}
.result-card[data-mod="1"]{ --r-color:var(--teal-700); }
.result-card[data-mod="2"]{ --r-color:var(--coral-700); }
.result-card[data-mod="3"]{ --r-color:var(--earth-700); }
.result-card .r-tag{
  font-size:.72rem;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--r-color, var(--teal-700));
  margin-bottom:.4rem;
}
.result-card h4{ font-size:1.03rem; color:var(--teal-900); line-height:1.35; }

/* -------------------- FAQ (Parte 5) -------------------- */
.faq{
  padding:var(--space-6) 0;
  background:var(--teal-900);
  color:var(--white);
}
.faq-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:var(--space-5);
}
.faq-block h3{
  font-size:1.05rem;
  color:var(--teal-300);
  text-transform:uppercase;
  letter-spacing:.06em;
  margin-bottom:1rem;
}
.faq-block ul{ display:flex; flex-direction:column; gap:.6rem; }
.faq-block li{
  color:var(--teal-100);
  font-size:1rem;
  padding-left:1.3rem;
  position:relative;
}
.faq-block li::before{
  content:'';
  position:absolute; left:0; top:.55em;
  width:6px; height:6px;
  border-radius:50%;
  background:var(--coral-500);
}

.accordion{ margin-top:var(--space-3); }
.accordion-item{
  border-bottom:1px solid rgba(255,255,255,.15);
}
.accordion-item:first-child{ border-top:1px solid rgba(255,255,255,.15); }
.accordion-trigger{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:1.3rem 0;
  background:none;
  border:none;
  color:var(--white);
  font-family:var(--font);
  font-size:1.08rem;
  font-weight:500;
  text-align:left;
  cursor:pointer;
}
.accordion-trigger .plus{
  flex:none;
  width:1.6rem; height:1.6rem;
  position:relative;
}
.accordion-trigger .plus::before,
.accordion-trigger .plus::after{
  content:'';
  position:absolute;
  background:var(--coral-500);
  border-radius:2px;
  transition:transform .25s ease, opacity .25s ease;
}
.accordion-trigger .plus::before{ left:0; top:50%; width:100%; height:2px; transform:translateY(-50%); }
.accordion-trigger .plus::after{ top:0; left:50%; height:100%; width:2px; transform:translateX(-50%); }
.accordion-item.is-open .accordion-trigger .plus::after{ transform:translateX(-50%) rotate(90deg); opacity:0; }

.accordion-panel{
  max-height:0;
  overflow:hidden;
  transition:max-height .3s ease;
}
.accordion-panel-inner{
  padding-bottom:1.4rem;
  color:var(--teal-100);
  font-size:1rem;
  max-width:44rem;
}
.accordion-panel-inner a{ font-weight:600; }
.price-highlight{
  display:inline-block;
  font-size:1.5rem;
  font-weight:600;
  color:var(--white);
}

/* -------------------- Pagos (modalidades de pago) -------------------- */
.pagos{
  padding:var(--space-6) 0;
  background:linear-gradient(135deg, var(--coral-100) 0%, var(--earth-100) 45%, var(--teal-100) 130%);
  overflow:hidden;
}
.pagos-swirl{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}
.pricing-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:var(--space-3);
  align-items:stretch;
}
.pricing-card{
  position:relative;
  background:var(--white);
  border-radius:var(--radius-lg);
  padding:var(--space-4);
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  box-shadow:0 24px 50px -30px rgba(37,80,89,.35);
  border:2px solid transparent;
}
.pricing-card.is-featured{
  border-color:var(--coral-500);
  transform:translateY(-10px);
  box-shadow:0 30px 60px -25px rgba(242,120,80,.4);
}
.pricing-badge{
  position:absolute;
  top:-.9rem;
  left:50%;
  transform:translateX(-50%);
  background:var(--coral-700);
  color:var(--white);
  font-size:.72rem;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  padding:.35rem .9rem;
  border-radius:999px;
  box-shadow:0 8px 16px -6px rgba(242,120,80,.6);
}
.pricing-tag{
  font-size:.78rem;
  font-weight:600;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--teal-700);
  margin-bottom:.8rem;
}
.pricing-amount{
  font-size:2rem;
  font-weight:600;
  color:var(--teal-900);
  margin-bottom:.4rem;
}
.pricing-amount span{ font-size:1rem; font-weight:500; color:#4B6167; }
.pricing-desc{ color:#4B6167; font-size:.95rem; margin-bottom:1.5rem; line-height:1.6; }
.pricing-total{ font-size:.82rem; color:var(--teal-700); font-weight:600; }
.pricing-card .btn{ width:100%; margin-top:auto; }

.pagos-note{
  position:relative;
  margin-top:var(--space-5);
  text-align:center;
  color:var(--teal-900);
  font-size:.98rem;
  line-height:1.7;
}
.pagos-note a{ font-weight:600; text-decoration:underline; color:var(--coral-700); }

/* -------------------- Logo inline en texto -------------------- */
.inline-logo{
  display:inline-block;
  height:.85em;
  width:auto;
  vertical-align:middle;
  margin:0 .12em;
  transform:translateY(-.08em);
}

/* -------------------- Testimonios (estilo chat) -------------------- */
.testimonios{
  padding:var(--space-6) 0;
  background:var(--cream);
}
.testi-grid{
  columns:2;
  column-gap:var(--space-3);
  margin-top:var(--space-2);
}
.testi-bubble{
  break-inside:avoid;
  margin-bottom:var(--space-3);
  background:var(--white);
  border-radius:20px;
  border-top-left-radius:4px;
  padding:1.4rem 1.5rem;
  box-shadow:0 18px 40px -28px rgba(37,80,89,.4);
}
.testi-head{
  display:flex;
  align-items:center;
  gap:.7rem;
  margin-bottom:.7rem;
}
.testi-avatar{
  flex:none;
  width:2.3rem; height:2.3rem;
  border-radius:50%;
  background:var(--teal-700);
  color:var(--white);
  font-size:.78rem;
  font-weight:600;
  display:flex;
  align-items:center;
  justify-content:center;
}
.testi-name{ font-weight:600; color:var(--teal-900); font-size:.98rem; }
.testi-bubble p{
  color:#4B6167;
  font-size:.95rem;
  line-height:1.65;
  font-style:italic;
}

/* -------------------- Footer -------------------- */
.site-footer{
  background:#132C31;
  color:var(--teal-100);
  padding:var(--space-5) 0 var(--space-3);
}
.footer-top{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:var(--space-4);
  flex-wrap:wrap;
  padding-bottom:var(--space-4);
  border-bottom:1px solid rgba(255,255,255,.1);
}
.footer-brand img{ height:26px; margin-bottom:.6rem; }
.footer-tagline{ font-size:.95rem; color:var(--teal-300); font-style:italic; }
.footer-links{ display:flex; gap:var(--space-5); flex-wrap:wrap; }
.footer-links h4{ color:var(--white); font-size:.85rem; text-transform:uppercase; letter-spacing:.06em; margin-bottom:.8rem; }
.footer-links ul{ display:flex; flex-direction:column; gap:.55rem; }
.footer-links a{ font-size:.92rem; color:var(--teal-100); opacity:.85; }
.footer-links a:hover{ opacity:1; }
.footer-bottom{
  padding-top:var(--space-3);
  display:flex;
  justify-content:space-between;
  gap:1rem;
  flex-wrap:wrap;
  font-size:.82rem;
  color:rgba(255,255,255,.5);
}

/* -------------------- Sticky mobile CTA -------------------- */
.mobile-cta{
  position:fixed;
  left:0; right:0; bottom:0;
  z-index:90;
  display:none;
  padding:.7rem;
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(10px);
  box-shadow:0 -12px 30px -20px rgba(0,0,0,.3);
}
.mobile-cta .btn{ width:100%; padding:.85rem 1rem; font-size:.95rem; }

/* -------------------- Reveal animation -------------------- */
.reveal{ opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .6s ease; }
.reveal.in{ opacity:1; transform:none; }

/* =========================================================
   Responsive
   ========================================================= */
@media (max-width: 980px){
  .main-nav{ display:none; }
  .header-ctas{ display:none; }
  .nav-toggle{ display:flex; }

  .hero{ padding-top:6.5rem; }
  .hero .container{ grid-template-columns:1fr; }
  .hero-visual{ order:-1; aspect-ratio:16/11; }

  .founders{ grid-template-columns:1fr; }

  .modules{ grid-template-columns:1fr; }

  .resultados .container{ grid-template-columns:1fr; }
  .resultados-photo{ position:static; aspect-ratio:16/9; }
  .resultados-photo img{ height:100%; object-fit:cover; }

  .results-grid{ grid-template-columns:1fr; }

  .pricing-grid{ grid-template-columns:1fr; }
  .pricing-card.is-featured{ transform:none; }

  .testi-grid{ columns:1; }

  .mobile-cta{ display:flex; }
  body{ padding-bottom:4.5rem; }
}

@media (max-width: 620px){
  .founder-card{ padding:var(--space-3); }
  .conectto-blurb{ padding:var(--space-4) var(--space-3); min-height:0; }
  .footer-top{ flex-direction:column; }
  .footer-links{ gap:var(--space-4); }

  /* El texto del banner de método pasa de superpuesto a apilado
     debajo de la foto: en pantallas angostas no cabe encima sin cortarse. */
  .metodo-banner{ display:flex; flex-direction:column; }
  .metodo-banner img{ height:200px; }
  .metodo-banner::after{ display:none; }
  .metodo-banner-text{
    position:static;
    max-width:none;
    background:var(--teal-900);
    padding:var(--space-4) var(--space-3);
  }
}