/* ═══════════════════════════════════════════════════════
   CREALAB · TAMI FABBRONI — Sistema de diseño 2026
   ═══════════════════════════════════════════════════════ */

/* ── Variables de marca ── */
:root {
  --verde-oscuro:   #313831;
  --verde-petroleo: #2E4847;
  --crema:          #E7DFC8;
  --gris-carbon:    #39393B;
  --gris-topo:      #6B6258;
  --coral:          #E87079;
  --blanco:         #FAFAF8;

  --font-titulo:  'Jost', sans-serif;
  --font-cuerpo:  'Poppins', sans-serif;
  --font-firma:   'Caveat', cursive;

  --radio:        12px;
  --radio-lg:     20px;
  --sombra:       0 4px 24px rgba(49,56,49,.10);
  --sombra-hover: 0 8px 40px rgba(49,56,49,.18);
  --trans:        0.3s ease;
  --ancho:        1140px;
}

/* ── Reset ── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
/* Las animaciones de entrada (.fade-right) empujan bloques 32px hacia la
   derecha hasta que se revelan. En pantallas angostas eso hacía que la
   página se pudiera correr de costado y se viera cortada por la derecha.
   Va `clip` y no `hidden` porque `hidden` en la raíz rompe position:sticky. */
html { scroll-behavior:smooth; font-size:16px; -webkit-text-size-adjust:100%; overflow-x:clip; }
body { font-family:var(--font-cuerpo); font-weight:400; color:var(--gris-carbon); background:#EFE8D8; line-height:1.7; overflow-x:hidden; overflow-x:clip; }
img  { max-width:100%; height:auto; display:block; }
a    { color:inherit; text-decoration:none; }
ul,ol { list-style:none; }
button { cursor:pointer; border:none; background:none; font-family:inherit; }

/* ── Accesibilidad ── */
:focus-visible { outline:3px solid var(--coral); outline-offset:3px; border-radius:4px; }
.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; }

/* ════════════════════════════════════════════════════════
   UTILIDADES
   ════════════════════════════════════════════════════════ */

.container {
  width:100%;
  max-width:var(--ancho);
  margin-inline:auto;
  padding-inline:1.25rem;
}

.section { padding-block:5.5rem; }
.section--verde       { background-color:var(--verde-petroleo); color:var(--blanco); }
.section--verde-oscuro{ background-color:var(--verde-oscuro); color:var(--blanco); }
.section--crema       { background-color:var(--crema); }

.section__header {
  text-align:center;
  max-width:640px;
  margin-inline:auto;
  margin-bottom:3.5rem;
}

.section__eyebrow {
  font-family:var(--font-titulo);
  font-size:.78rem;
  font-weight:500;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--gris-topo);
  margin-bottom:.75rem;
}
.section__eyebrow--light { color:rgba(231,223,200,.65); }

.section__title {
  font-family:var(--font-titulo);
  font-size:clamp(1.75rem,4vw,2.6rem);
  font-weight:600;
  line-height:1.2;
  color:var(--verde-oscuro);
  letter-spacing:-.01em;
}

/* ── Botones ── */
.btn {
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  font-family:var(--font-titulo);
  font-size:.95rem;
  font-weight:500;
  letter-spacing:.02em;
  padding:.85rem 2rem;
  border-radius:50px;
  transition:transform var(--trans), box-shadow var(--trans), background-color var(--trans), color var(--trans), border-color var(--trans);
  cursor:pointer;
  white-space:nowrap;
}
.btn:hover { transform:translateY(-2px); box-shadow:0 6px 24px rgba(232,112,121,.3); }
.btn:active { transform:translateY(0); }

.btn--primary  { background:var(--verde-oscuro); color:var(--crema); }
.btn--primary:hover { background:var(--coral); color:var(--blanco); }

.btn--crema    { background:var(--crema); color:var(--verde-oscuro); }
.btn--crema:hover { background:var(--coral); color:var(--blanco); }

.btn--coral    { background:var(--coral); color:var(--blanco); }
.btn--coral:hover { background:var(--verde-oscuro); color:var(--crema); }

.btn--outline  { background:transparent; color:var(--verde-oscuro); border:2px solid var(--verde-oscuro); }
.btn--outline:hover { background:var(--coral); color:var(--blanco); border-color:var(--coral); }

/* Contorno claro: para botones sobre fondo oscuro (hero) */
.btn--claro    { background:transparent; color:var(--crema); border:2px solid rgba(231,223,200,.65); }
.btn--claro:hover { background:var(--crema); color:var(--verde-oscuro); border-color:var(--crema); }

.btn--blanco   { background:var(--blanco); color:var(--verde-oscuro); }
.btn--blanco:hover { background:var(--coral); color:var(--blanco); }

.btn--grande   { font-size:1.05rem; padding:1rem 2.5rem; }

/* ── Animaciones scroll ── */
.fade-up {
  opacity:0;
  transform:translateY(28px);
  transition:opacity .6s ease, transform .6s ease;
}
.fade-up.visible { opacity:1; transform:translateY(0); }
.fade-up:nth-child(2) { transition-delay:.1s; }
.fade-up:nth-child(3) { transition-delay:.2s; }

/* ════════════════════════════════════════════════════════
   NAVEGACIÓN
   ════════════════════════════════════════════════════════ */

.header {
  position:fixed;
  top:0; left:0; right:0;
  z-index:100;
  background:transparent;
  transition:background var(--trans), box-shadow var(--trans);
}
.header.scrolled {
  background:rgba(49,56,49,.97);
  box-shadow:0 2px 16px rgba(49,56,49,.25);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}

.nav {
  display:flex;
  align-items:center;
  justify-content:space-between;
  height:68px;
}

.nav__logo img {
  height:auto;
  width:160px;
  filter:brightness(0) invert(1);
  opacity:.9;
  transition:opacity var(--trans), filter var(--trans);
}
.header.scrolled .nav__logo img {
  filter:brightness(0) invert(1);
  opacity:.9;
}
.nav__logo:hover img { opacity:.7; }

.nav__toggle {
  display:flex;
  flex-direction:column;
  gap:5px;
  width:28px;
  padding:4px 0;
  z-index:101;
}
.nav__toggle span {
  display:block;
  height:2px;
  background:var(--blanco);
  border-radius:2px;
  transition:transform var(--trans), opacity var(--trans), background var(--trans);
}
.header.scrolled .nav__toggle span { background:var(--crema); }

.nav__toggle.active span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.nav__toggle.active span:nth-child(2) { opacity:0; }
.nav__toggle.active span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

.nav__menu {
  display:flex;
  flex-direction:column;
  position:fixed;
  top:0; right:-100%;
  width:min(300px,80vw);
  height:100dvh;
  background:var(--verde-oscuro);
  padding:96px 2rem 2rem;
  gap:.25rem;
  transition:right var(--trans);
  z-index:100;
}
.nav__menu.open { right:0; }

.nav__link {
  font-family:var(--font-titulo);
  font-size:1.1rem;
  font-weight:400;
  color:var(--crema);
  padding:.6rem 0;
  border-bottom:1px solid rgba(231,223,200,.15);
  transition:color var(--trans);
  display:block;
}
.nav__link:hover { color:var(--coral); }

.nav__link--cta {
  margin-top:1rem;
  background:var(--coral);
  color:var(--blanco);
  padding:.7rem 1.5rem;
  border-radius:50px;
  text-align:center;
  border-bottom:none;
  font-weight:500;
}
.nav__link--cta:hover { background:#d45f68; color:var(--blanco); }

/* ── Dropdown submenú ── */
.nav__item--dropdown { position:relative; }

.nav__dropdown-toggle {
  font-family:var(--font-titulo);
  font-size:1.1rem;
  font-weight:400;
  color:var(--crema);
  padding:.6rem 0;
  border-bottom:1px solid rgba(231,223,200,.15);
  transition:color var(--trans);
  display:flex;
  align-items:center;
  gap:.35rem;
  width:100%;
  cursor:pointer;
}
.nav__dropdown-toggle:hover { color:var(--coral); }

.nav__flecha {
  font-size:.7rem;
  transition:transform var(--trans);
  display:inline-block;
}
.nav__item--dropdown.open .nav__flecha { transform:rotate(180deg); }

.nav__dropdown {
  display:none;
  flex-direction:column;
  gap:0;
  padding-left:1rem;
  border-left:2px solid rgba(231,223,200,.15);
  margin:0 0 .25rem;
}
.nav__item--dropdown.open .nav__dropdown { display:flex; }

.nav__dropdown-link {
  font-family:var(--font-titulo);
  font-size:.97rem;
  font-weight:400;
  color:rgba(231,223,200,.75);
  padding:.45rem 0;
  transition:color var(--trans);
  display:block;
  border-bottom:1px solid rgba(231,223,200,.08);
}
.nav__dropdown-link:hover { color:var(--coral); }

.nav-overlay {
  display:none;
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.5);
  z-index:99;
}
.nav-overlay.open { display:block; }

/* ════════════════════════════════════════════════════════
   HERO — CREALAB
   ════════════════════════════════════════════════════════ */

.hero {
  position:relative;
  min-height:100svh;
  display:flex;
  flex-direction:column;
  justify-content:center;
  color:var(--blanco);
  overflow:hidden;
}

.hero__bg {
  position:absolute;
  inset:0;
  z-index:0;
}
.hero__bg img {
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 40%;
}
.hero__overlay {
  position:absolute;
  inset:0;
  background:linear-gradient(160deg,
    rgba(46,72,71,.78) 0%,
    rgba(49,56,49,.65) 55%,
    rgba(49,56,49,.35) 100%);
}

.hero__content {
  position:relative;
  z-index:1;
  padding-top:100px;
  padding-bottom:80px;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:.75rem;
}

/* Sello COATÍ + CREALAB: chiquitos arriba, como en la tarjeta de vista previa */
.hero__marca-fila {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.85rem;
  animation:fadeUp .7s ease both;
}

.hero__sello {
  width:clamp(42px,4.5vw,64px);
  height:auto;
  filter:brightness(0) invert(1);
  opacity:.85;
}

.hero__marca {
  font-family:var(--font-titulo);
  font-size:clamp(1.1rem,2.4vw,1.75rem);
  font-weight:600;
  letter-spacing:.3em;
  color:var(--crema);
  line-height:1;
  margin-right:-.3em; /* compensa el espaciado de la última letra */
}

/* La firma pasa a ser lo más grande */
.hero__firma {
  height:auto;
  width:clamp(290px,44vw,600px);
  filter:brightness(0) invert(1);
  opacity:.9;
  margin-top:.35rem;
  animation:fadeUp .7s ease .1s both;
}

.hero__tagline {
  font-family:var(--font-titulo);
  font-size:clamp(.82rem,1.6vw,1rem);
  font-weight:600;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:rgba(231,223,200,.92);
  margin-top:.5rem;
  animation:fadeUp .7s ease .2s both;
}

.hero__ctas {
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:.75rem;
  margin-top:1rem;
  animation:fadeUp .7s ease .3s both;
}
/* En pantallas grandes, los tres botones en una sola fila */
@media (min-width: 900px) {
  .hero__ctas { flex-wrap:nowrap; }
  .hero__ctas .btn { padding-inline:1.5rem; }
}
/* Salto de línea que solo existe en celular (no afecta la vista de escritorio) */
.br-movil { display:none; }

/* En celulares angostos, que la frase no se corte */
@media (max-width: 700px) {
  .br-movil { display:inline; }
}
@media (max-width: 420px) {
  .hero__tagline { letter-spacing:.08em; }
  .hero__ctas .btn { padding-inline:1.4rem; }
}

.hero__scroll {
  position:absolute;
  bottom:2rem;
  left:50%;
  transform:translateX(-50%);
  z-index:1;
  color:rgba(231,223,200,.7);
  animation:bounce 2.2s ease infinite;
  transition:color var(--trans);
}
.hero__scroll:hover { color:var(--coral); }

@keyframes fadeUp {
  from { opacity:0; transform:translateY(20px); }
  to   { opacity:1; transform:translateY(0); }
}
@keyframes bounce {
  0%,100% { transform:translateX(-50%) translateY(0); }
  50%      { transform:translateX(-50%) translateY(8px); }
}

/* ════════════════════════════════════════════════════════
   MANIFIESTO
   ════════════════════════════════════════════════════════ */

.manifiesto { background:transparent; }

.manifiesto__items {
  display:grid;
  gap:1.5rem;
  margin-top:2rem;
}

.manifiesto__item {
  display:flex;
  align-items:baseline;
  gap:1rem;
  padding:1.5rem 0;
  border-bottom:1px solid rgba(178,168,156,.2);
}
.manifiesto__item:first-child { border-top:1px solid rgba(178,168,156,.2); }

.manifiesto__num {
  font-family:var(--font-titulo);
  font-size:1.5rem;
  color:var(--gris-topo);
  flex-shrink:0;
}

.manifiesto__frase {
  font-family:var(--font-titulo);
  font-size:clamp(1.2rem,3vw,1.75rem);
  font-weight:400;
  color:var(--verde-oscuro);
  line-height:1.3;
  letter-spacing:-.01em;
}

/* ════════════════════════════════════════════════════════
   MUNDOS: ACOMPAÑAMIENTO + LABORATORIO
   ════════════════════════════════════════════════════════ */

.mundo__header {
  max-width:620px;
  margin-bottom:3rem;
}

.mundo__titulo {
  font-family:var(--font-titulo);
  font-size:clamp(1.6rem,3.5vw,2.4rem);
  font-weight:600;
  line-height:1.2;
  color:var(--crema);
  letter-spacing:-.01em;
  margin-bottom:.75rem;
}
.mundo__titulo--oscuro { color:var(--verde-oscuro); }

.mundo__desc {
  font-size:1rem;
  color:rgba(231,223,200,.75);
  line-height:1.7;
}
.mundo__desc--oscuro { color:var(--gris-topo); }

.mundo__cards {
  display:grid;
  gap:1.25rem;
}

/* Tarjetas oscuras (Acompañamiento) */
.mundo-card {
  background:rgba(255,255,255,.07);
  border:1px solid rgba(231,223,200,.15);
  border-radius:var(--radio-lg);
  padding:2rem;
  transition:transform var(--trans), box-shadow var(--trans), border-color var(--trans);
}
.mundo-card:hover {
  transform:translateY(-3px);
  box-shadow:0 8px 32px rgba(0,0,0,.2);
  border-color:rgba(231,223,200,.3);
}

.mundo-card--destacado {
  border-color:rgba(232,112,121,.4);
  background:rgba(232,112,121,.08);
}

/* Tarjetas claras (Laboratorio) */
.mundo-card--claro {
  background:rgba(250,250,248,.8);
  border-color:rgba(178,168,156,.2);
}
.mundo-card--claro:hover {
  border-color:rgba(49,56,49,.2);
  box-shadow:var(--sombra-hover);
}
.mundo-card--destacado-claro {
  border-color:rgba(46,72,71,.3);
  background:rgba(46,72,71,.06);
}

.mundo-card__badge {
  display:inline-block;
  background:var(--coral);
  color:var(--blanco);
  font-family:var(--font-titulo);
  font-size:.72rem;
  font-weight:500;
  letter-spacing:.08em;
  padding:.25rem .75rem;
  border-radius:50px;
  margin-bottom:1rem;
}
.mundo-card__badge--oscuro {
  background:var(--verde-petroleo);
  color:var(--crema);
}

.mundo-card__icono {
  font-size:1.6rem;
  color:rgba(231,223,200,.3);
  line-height:1;
  margin-bottom:.5rem;
}
.mundo-card__icono--oscuro { color:rgba(49,56,49,.2); }

.mundo-card__titulo {
  font-family:var(--font-titulo);
  font-size:1.15rem;
  font-weight:600;
  color:var(--crema);
  margin-bottom:.6rem;
  line-height:1.3;
}
.mundo-card__titulo--oscuro { color:var(--verde-oscuro); }

.mundo-card__desc {
  font-size:.93rem;
  color:rgba(231,223,200,.75);
  line-height:1.7;
  margin-bottom:1.25rem;
}
.mundo-card__desc--oscuro { color:var(--gris-topo); }

.mundo-card__cta {
  font-family:var(--font-titulo);
  font-size:.88rem;
  font-weight:500;
  color:var(--coral);
  transition:color var(--trans), letter-spacing var(--trans);
}
.mundo-card__cta:hover { color:var(--crema); letter-spacing:.03em; }

.mundo-card__cta--oscuro { color:var(--verde-petroleo); }
.mundo-card__cta--oscuro:hover { color:var(--verde-oscuro); }

/* ════════════════════════════════════════════════════════
   CÓMO SE CONECTAN
   ════════════════════════════════════════════════════════ */

.conectan { background:transparent; }

.conectan__subtitulo {
  font-family:var(--font-titulo);
  font-size:1.1rem;
  font-style:italic;
  color:var(--gris-topo);
  margin-top:.5rem;
}

.conectan__grid {
  display:grid;
  gap:3rem;
  align-items:center;
  margin-top:1rem;
}

.conectan__imagen {
  position:relative;
  border-radius:var(--radio-lg);
  overflow:hidden;
}
/* Hijo directo, para no alcanzar a la firma que va anidada adentro */
.conectan__imagen > img {
  width:100%;
  height:340px;
  object-fit:cover;
  /* La foto es apaisada y con la cara al medio: recortar desde arriba
     se la comería. */
  object-position:center;
}
.conectan__firma {
  position:absolute;
  bottom:1.25rem;
  right:1.25rem;
  background:rgba(231,223,200,.92);
  border-radius:var(--radio);
  padding:.6rem .9rem;
  backdrop-filter:blur(4px);
}
.conectan__firma img { height:28px; width:auto; }

.conectan__intro {
  font-size:1.05rem;
  color:var(--gris-carbon);
  line-height:1.8;
  margin-bottom:2rem;
  font-style:italic;
  border-left:3px solid var(--coral);
  padding-left:1.25rem;
}

.conectan__lista {
  display:flex;
  flex-direction:column;
  gap:.75rem;
  margin-bottom:2rem;
}
.conectan__item {
  display:flex;
  align-items:flex-start;
  gap:.75rem;
  font-size:.97rem;
  color:var(--gris-carbon);
  padding:.6rem 0;
  border-bottom:1px solid rgba(178,168,156,.18);
  line-height:1.5;
}
.conectan__icono {
  color:var(--verde-petroleo);
  font-weight:600;
  flex-shrink:0;
  margin-top:.1rem;
}

.conectan__credenciales {
  display:flex;
  flex-wrap:wrap;
  gap:.4rem .6rem;
  font-family:var(--font-titulo);
  font-size:.8rem;
  color:var(--gris-topo);
  letter-spacing:.03em;
}

/* ════════════════════════════════════════════════════════
   CTA FINAL
   ════════════════════════════════════════════════════════ */

.cta-final__container {
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:1.75rem;
}

.cta-final__titulo {
  font-family:var(--font-titulo);
  font-size:clamp(1.9rem,5vw,3.2rem);
  font-weight:600;
  color:var(--crema);
  line-height:1.2;
  letter-spacing:-.02em;
}

.cta-final__desc {
  font-size:1rem;
  color:rgba(231,223,200,.72);
  max-width:440px;
  line-height:1.7;
}

.cta-final__botones {
  display:flex;
  flex-wrap:wrap;
  gap:.75rem;
  justify-content:center;
}

.cta-final__redes {
  display:flex;
  align-items:center;
  gap:1.5rem;
  margin-top:.5rem;
}

.cta-final__red {
  display:flex;
  align-items:center;
  gap:.4rem;
  font-family:var(--font-titulo);
  font-size:.85rem;
  color:rgba(231,223,200,.55);
  transition:color var(--trans);
}
.cta-final__red:hover { color:var(--coral); }

/* ════════════════════════════════════════════════════════
   FOOTER
   ════════════════════════════════════════════════════════ */

.footer {
  background:var(--gris-carbon);
  padding-block:1.5rem 1.25rem;
}

.footer__inner {
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:1rem;
  text-align:center;
}

.footer__top {
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:1rem 2rem;
  width:100%;
}

.footer__logo {
  height:20px;
  width:auto;
  max-width:110px;
  display:block;
  flex-shrink:0;
}

.footer__links {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:.5rem 1.25rem;
}

.footer__ig {
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  font-family:var(--font-titulo);
  font-size:.8rem;
  color:rgba(178,168,156,.7);
  white-space:nowrap;
  transition:color var(--trans);
}
.footer__ig:hover { color:var(--crema); }
.footer__ig svg { flex-shrink:0; opacity:.8; }

.footer__copy {
  font-size:.75rem;
  color:rgba(178,168,156,.45);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:100%;
  padding-inline:1rem;
}

/* ════════════════════════════════════════════════════════
   WHATSAPP FLOTANTE
   ════════════════════════════════════════════════════════ */

.wpp-float {
  position:fixed;
  bottom:1.75rem;
  right:1.75rem;
  z-index:90;
  width:56px;
  height:56px;
  background:#25D366;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 4px 20px rgba(37,211,102,.4);
  transition:transform var(--trans), box-shadow var(--trans);
  animation:wppPulse 3s ease infinite;
}
.wpp-float:hover {
  transform:scale(1.1) translateY(-2px);
  box-shadow:0 8px 30px rgba(37,211,102,.55);
  animation:none;
}
@keyframes wppPulse {
  0%,100% { box-shadow:0 4px 20px rgba(37,211,102,.4); }
  50%      { box-shadow:0 4px 30px rgba(37,211,102,.65); }
}

/* ════════════════════════════════════════════════════════
   MANIFIESTO — RECUADRO ORGÁNICO
   ════════════════════════════════════════════════════════ */

.manifiesto-wrap {
  background:transparent;
  padding-block:3.5rem;
}

.manifiesto-box {
  position:relative;
  max-width:640px;
  margin-inline:auto;
  border:1.5px solid rgba(46,72,71,.25);
  border-radius:28px;
  padding:2.5rem 2.5rem 2rem;
  text-align:center;
  background:var(--blanco);
}

.manifiesto-frase {
  font-family:var(--font-titulo);
  font-size:clamp(1rem,2.2vw,1.25rem);
  font-weight:400;
  color:var(--verde-petroleo);
  line-height:1.6;
  padding:.4rem 0;
}
.manifiesto-frase + .manifiesto-frase {
  border-top:1px solid rgba(46,72,71,.1);
}

.manifiesto-hoja {
  position:absolute;
  bottom:-14px;
  right:20px;
  width:40px;
  height:40px;
  opacity:.6;
}

/* ════════════════════════════════════════════════════════
   DOS MUNDOS — ORGÁNICO
   ════════════════════════════════════════════════════════ */

.mundos-organicos {
  background:var(--crema);
}

.mundos-grid {
  display:grid;
  grid-template-columns:1fr;
  gap:2.5rem;
  align-items:center;
}

/* Columnas texto */
.mundo-col {
  display:flex;
  flex-direction:column;
  gap:1.5rem;
}

.mundo-badge {
  display:inline-block;
  font-family:var(--font-titulo);
  font-size:.78rem;
  font-weight:600;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--verde-petroleo);
  border:1.5px solid var(--verde-petroleo);
  border-radius:50px;
  padding:.45rem 1.25rem;
  align-self:flex-start;
}

.mundo-items {
  display:flex;
  flex-direction:column;
  gap:.25rem;
}

.mundo-items li {
  display:flex;
  align-items:flex-start;
  gap:.65rem;
  font-family:var(--font-cuerpo);
  font-size:.97rem;
  color:var(--gris-carbon);
  line-height:1.6;
  padding:.5rem 0;
  border-bottom:1px solid rgba(46,72,71,.1);
}
.mundo-items li:last-child { border-bottom:none; }

.hoja-ico {
  width:16px;
  height:16px;
  flex-shrink:0;
  color:var(--verde-petroleo);
  margin-top:.2rem;
}

/* Botón orgánico */
.btn--organico {
  display:inline-flex;
  align-items:center;
  font-family:var(--font-titulo);
  font-size:.92rem;
  font-weight:500;
  color:var(--blanco);
  background:var(--coral);
  padding:.7rem 1.75rem;
  border-radius:50px;
  transition:background var(--trans), transform var(--trans);
  align-self:flex-start;
}
.btn--organico:hover {
  background:var(--verde-oscuro);
  color:var(--crema);
  transform:translateY(-2px);
  box-shadow:0 6px 24px rgba(49,56,49,.25);
}

/* Imágenes centro */
/* Las dos fotos del centro iban lado a lado, en huecos verticales de
   163px. La foto de sesión es apaisada y con una persona en cada punta:
   ahí solo se veía el 42% del ancho, o sea el sillón del medio. Ahora
   van una arriba de otra: la de sesión a lo ancho y la ilustración,
   que sí es vertical, más chica debajo. */
.mundo-imagenes {
  display:grid;
  grid-template-columns:1fr;
  gap:.8rem;
  justify-items:center;
}

.mundo-img-wrap {
  border-radius:20px;
  overflow:hidden;
  box-shadow:0 4px 20px rgba(49,56,49,.12);
  aspect-ratio:3/4;
  width:100%;
}
.mundo-img-wrap--ancha   { aspect-ratio:16/9; }
.mundo-img-wrap--retrato { width:62%; }
.mundo-img-wrap img {
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:top center;
  transition:transform .5s ease;
}
.mundo-img-wrap:hover img { transform:scale(1.03); }

/* ════════════════════════════════════════════════════════
   PÁGINA DE TALLERES
   ════════════════════════════════════════════════════════ */

.page-hero {
  padding-top:120px;
  padding-bottom:4rem;
}
.page-hero__container { max-width:700px; }
.page-hero__titulo {
  font-family:var(--font-titulo);
  font-size:clamp(2rem,5vw,3.5rem);
  font-weight:600;
  color:var(--crema);
  line-height:1.15;
  letter-spacing:-.02em;
  margin:1rem 0;
}
.page-hero__desc {
  font-size:1.05rem;
  color:rgba(231,223,200,.75);
  line-height:1.75;
}

.talleres-page { background:transparent; }

.taller-full {
  display:grid;
  gap:3rem;
  padding-block:3.5rem;
  align-items:center;
}

.taller-full__etiqueta {
  font-family:var(--font-titulo);
  font-size:.75rem;
  font-weight:500;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--gris-topo);
  margin-bottom:.25rem;
}

.taller-full__titulo {
  font-family:var(--font-titulo);
  font-size:clamp(1.6rem,3.5vw,2.4rem);
  font-weight:600;
  color:var(--verde-oscuro);
  line-height:1.2;
  letter-spacing:-.01em;
  margin-bottom:.75rem;
}

.taller-full__desc {
  font-size:1rem;
  color:var(--gris-topo);
  line-height:1.8;
  margin-bottom:1.5rem;
}

.taller-full__sub {
  font-family:var(--font-titulo);
  font-size:.78rem;
  font-weight:500;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--gris-topo);
  margin-bottom:.75rem;
}

.taller-full__features {
  display:flex;
  flex-direction:column;
  gap:.5rem;
  margin-bottom:2rem;
}
.taller-full__features li {
  font-size:.95rem;
  color:var(--gris-carbon);
  display:flex;
  align-items:flex-start;
  gap:.5rem;
  line-height:1.5;
}

.taller-full__horarios {
  background:var(--crema);
  border-radius:var(--radio);
  padding:1.25rem;
  margin-bottom:2rem;
}

.taller-full__imagen {
  border-radius:var(--radio-lg);
  overflow:hidden;
}
.taller-full__imagen img {
  width:100%;
  height:400px;
  object-fit:cover;
  object-position:top center;
}

.taller-full__divisor {
  border:none;
  border-top:1px solid rgba(178,168,156,.2);
  margin:0;
}

.horarios-grid {
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:.5rem;
}
.horario {
  display:flex;
  flex-direction:column;
  gap:.1rem;
  background:rgba(250,250,248,.8);
  border-radius:8px;
  padding:.55rem .7rem;
}
.horario__dia {
  font-family:var(--font-titulo);
  font-size:.72rem;
  font-weight:500;
  color:var(--gris-topo);
  text-transform:uppercase;
  letter-spacing:.06em;
}
.horario__hora {
  font-size:.9rem;
  color:var(--verde-oscuro);
  font-weight:400;
}

.check { color:var(--coral); font-size:1.05rem; flex-shrink:0; margin-top:.1rem; }

.cta-volver__container {
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:1.5rem;
}
.cta-volver__texto {
  font-family:var(--font-titulo);
  font-size:1.15rem;
  color:var(--verde-oscuro);
}
.cta-volver__botones {
  display:flex;
  flex-wrap:wrap;
  gap:.75rem;
  justify-content:center;
}

/* ════════════════════════════════════════════════════════
   BLOG
   ════════════════════════════════════════════════════════ */

.blog-lista { background:transparent; }

.blog-grid {
  display:grid;
  gap:2rem;
}

.blog-grid {
  display:grid;
  gap:2rem;
}

.blog-card {
  display:flex;
  flex-direction:column;
  gap:1rem;
  background:transparent;
  border:none;
  padding:0;
}
.blog-card:hover { box-shadow:none; border-color:transparent; }

.blog-card__imagen {
  width:100%;
  aspect-ratio:1/1;
  overflow:hidden;
  background:var(--crema);
  border-radius:var(--radio);
  border:6px solid #C4B49A;
  box-shadow:0 0 0 1px rgba(178,168,156,.25);
}
.blog-card__imagen img {
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .4s ease;
}
.blog-card:hover .blog-card__imagen img { transform:scale(1.04); }

.blog-card__imagen--vacia {
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:120px;
}
.blog-card__imagen--vacia::after {
  content:'📷';
  font-size:2rem;
  opacity:.25;
}

.blog-card__body {
  display:flex;
  flex-direction:column;
  gap:.5rem;
}

.blog-card__extracto {
  font-size:.93rem;
  color:var(--gris-topo);
  line-height:1.75;
  display:-webkit-box;
  -webkit-line-clamp:4;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

/* Botón Leer más */
.btn-leer-mas {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.45rem;
  font-family:var(--font-titulo);
  font-size:.88rem;
  font-weight:500;
  color:var(--blanco);
  background:var(--coral);
  border:none;
  padding:.55rem 1.5rem;
  border-radius:50px;
  cursor:pointer;
  transition:background var(--trans), color var(--trans), transform var(--trans), box-shadow var(--trans);
  align-self:flex-start;
  margin-top:.5rem;
  text-decoration:none;
}
.btn-leer-mas:hover {
  background:var(--verde-oscuro);
  color:var(--crema);
  transform:translateY(-2px);
  box-shadow:0 6px 24px rgba(49,56,49,.25);
}

/* ════════════════════════════════════════════════════════
   MODAL
   ════════════════════════════════════════════════════════ */

.modal {
  position:fixed;
  inset:0;
  z-index:500;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:1rem;
}
.modal[hidden] { display:none; }
.modal.abriendo { display:flex; }

.modal__overlay {
  position:absolute;
  inset:0;
  background:rgba(49,56,49,.6);
  backdrop-filter:blur(4px);
  -webkit-backdrop-filter:blur(4px);
  cursor:pointer;
  animation:fadeIn .25s ease;
}

.modal__caja {
  position:relative;
  background:var(--blanco);
  border-radius:var(--radio-lg);
  width:100%;
  max-width:680px;
  max-height:88dvh;
  overflow-y:auto;
  box-shadow:0 20px 60px rgba(49,56,49,.25);
  animation:slideUp .3s ease;
  scroll-behavior:smooth;
}

.modal__cerrar {
  position:sticky;
  top:0;
  float:right;
  margin:1rem 1rem 0 0;
  width:36px;
  height:36px;
  border-radius:50%;
  background:var(--crema);
  border:none;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  color:var(--verde-oscuro);
  transition:background var(--trans), transform var(--trans);
  z-index:10;
  flex-shrink:0;
}
.modal__cerrar:hover { background:var(--coral); color:var(--blanco); transform:rotate(90deg); }

.modal__cuerpo {
  padding:1rem 2.25rem 2.25rem;
  clear:both;
}

.modal__titulo {
  font-family:var(--font-titulo);
  font-size:clamp(1.4rem,3vw,2rem);
  font-weight:600;
  color:var(--verde-oscuro);
  line-height:1.2;
  margin:.75rem 0 1.25rem;
  letter-spacing:-.01em;
}

.modal__cuerpo p {
  font-size:.97rem;
  color:var(--gris-topo);
  line-height:1.85;
  margin-bottom:.9rem;
}

.modal__cita {
  font-family:var(--font-titulo);
  font-size:1.1rem;
  font-style:italic;
  color:var(--verde-petroleo) !important;
  font-weight:500;
}

.modal__firma {
  font-family:var(--font-firma);
  font-size:1.15rem;
  color:var(--verde-petroleo) !important;
  margin-top:1.5rem !important;
  padding-top:1rem;
  border-top:1px solid rgba(178,168,156,.2);
}

@keyframes fadeIn {
  from { opacity:0; }
  to   { opacity:1; }
}
@keyframes slideUp {
  from { opacity:0; transform:translateY(24px); }
  to   { opacity:1; transform:translateY(0); }
}
.blog-card:hover {
  box-shadow:var(--sombra-hover);
  border-color:rgba(49,56,49,.15);
}

.blog-card__meta {
  margin-bottom:1rem;
}
.blog-card__fecha {
  font-family:var(--font-titulo);
  font-size:.75rem;
  font-weight:500;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--gris-topo);
}

.blog-card__titulo {
  font-family:var(--font-titulo);
  font-size:clamp(1.1rem,2vw,1.4rem);
  font-weight:600;
  color:var(--verde-oscuro);
  line-height:1.3;
  letter-spacing:-.01em;
  display:flex;
  align-items:flex-start;
  gap:.5rem;
}
.blog-card__titulo .hoja-ico {
  flex-shrink:0;
  margin-top:.2rem;
  width:15px;
  height:15px;
}

.blog-card__extracto {
  font-size:.97rem;
  color:var(--gris-topo);
  line-height:1.8;
  margin-bottom:.9rem;
}
.blog-card__extracto--pendiente {
  color:var(--gris-topo);
  opacity:.6;
  font-style:italic;
}

.blog-card__cita {
  font-family:var(--font-titulo);
  font-size:1.1rem;
  font-style:italic;
  color:var(--verde-petroleo);
  font-weight:500;
}

.blog-card__blockquote {
  border-left:3px solid var(--coral);
  padding:.75rem 1.25rem;
  margin:1rem 0 1rem;
  font-size:.95rem;
  color:var(--gris-carbon);
  line-height:1.7;
  font-style:italic;
}
.blog-card__blockquote cite {
  display:block;
  margin-top:.4rem;
  font-style:normal;
  font-family:var(--font-titulo);
  font-size:.82rem;
  color:var(--gris-topo);
  font-weight:500;
}

.blog-card__firma {
  font-family:var(--font-firma);
  font-size:1.1rem;
  color:var(--verde-petroleo);
  margin-top:1.5rem;
  padding-top:1rem;
  border-top:1px solid rgba(178,168,156,.2);
}

/* ════════════════════════════════════════════════════════
   FAQ ACORDEÓN ORGÁNICO
   ════════════════════════════════════════════════════════ */

.faq-organico { background:transparent; }

.faq-card {
  max-width:700px;
  margin-inline:auto;
  background:var(--blanco);
  border-radius:28px;
  box-shadow:0 4px 32px rgba(49,56,49,.10);
  overflow:hidden;
}

.faq-card__header {
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.65rem;
  padding:2rem 2rem 1.5rem;
  border-bottom:1px solid rgba(46,72,71,.1);
}

/* El ícono va aparte para que el título quede centrado de verdad */
.faq-card__header svg {
  position:absolute;
  left:2rem;
  top:2rem;
  color:var(--verde-petroleo);
  flex-shrink:0;
}
@media (max-width: 560px) {
  .faq-card__header svg { display:none; }
}

.faq-card__header h2 {
  font-family:var(--font-titulo);
  font-size:1rem;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--verde-petroleo);
  border:2px solid var(--verde-petroleo);
  border-radius:50px;
  padding:.5rem 1.5rem;
  display:inline-block;
}

/* Ítem */
.faq-item {
  border-bottom:1px solid rgba(46,72,71,.08);
}
.faq-item:last-of-type { border-bottom:none; }

.faq-item__pregunta {
  display:flex;
  align-items:center;
  gap:.75rem;
  padding:1.1rem 1.75rem;
  cursor:pointer;
  list-style:none;
  font-family:var(--font-titulo);
  font-size:1rem;
  font-weight:400;
  color:var(--gris-carbon);
  transition:color var(--trans);
  user-select:none;
}
.faq-item__pregunta::-webkit-details-marker { display:none; }
.faq-item__pregunta:hover { color:var(--verde-petroleo); }

.faq-item[open] .faq-item__pregunta { color:var(--verde-petroleo); }

.faq-item__icono {
  flex-shrink:0;
  width:16px;
  height:16px;
  color:var(--verde-petroleo);
}
.faq-item__icono svg {
  width:100%;
  height:100%;
  display:block;
}

/* Botón +/- */
.faq-item__toggle {
  margin-left:auto;
  flex-shrink:0;
  width:24px;
  height:24px;
  border:1.5px solid var(--verde-petroleo);
  border-radius:50%;
  position:relative;
  color:var(--verde-petroleo);
}
.faq-item__toggle::before,
.faq-item__toggle::after {
  content:'';
  position:absolute;
  background:var(--verde-petroleo);
  border-radius:2px;
}
.faq-item__toggle::before {
  width:10px; height:1.5px;
  top:50%; left:50%;
  transform:translate(-50%,-50%);
}
.faq-item__toggle::after {
  width:1.5px; height:10px;
  top:50%; left:50%;
  transform:translate(-50%,-50%);
  transition:transform var(--trans), opacity var(--trans);
}
.faq-item[open] .faq-item__toggle::after {
  transform:translate(-50%,-50%) rotate(90deg);
  opacity:0;
}

/* Respuesta */
.faq-item__respuesta {
  padding:.25rem 1.75rem 1.25rem 3.25rem;
}
.faq-item__respuesta p {
  font-size:.95rem;
  color:var(--gris-topo);
  line-height:1.8;
  margin-bottom:.5rem;
}
.faq-item__respuesta p:last-child { margin-bottom:0; }

/* CTA dentro del card */
.faq-card__cta {
  padding:1.75rem;
  text-align:center;
  border-top:1px solid rgba(46,72,71,.08);
}

/* ════════════════════════════════════════════════════════
   COACHING HERO BAR (solo título, fondo claro)
   ════════════════════════════════════════════════════════ */

.coaching-hero-bar {
  padding-top:100px;
  padding-bottom:2.5rem;
  background:transparent;
  text-align:center;
}

.coaching-hero-titulo {
  font-family:var(--font-titulo);
  font-size:clamp(2rem,4.5vw,3.2rem);
  font-weight:600;
  color:var(--verde-oscuro);
  letter-spacing:-.02em;
  line-height:1.2;
  margin-bottom:.85rem;
}

.coaching-hero-desc {
  font-size:1rem;
  color:var(--gris-topo);
  line-height:1.75;
  max-width:540px;
  margin-inline:auto;
  font-style:italic;
}

/* ════════════════════════════════════════════════════════
   PÁGINA COACHING — 2 COLUMNAS
   ════════════════════════════════════════════════════════ */

.coaching-page { background:transparent; }

.coaching-layout {
  display:grid;
  gap:3rem;
  align-items:start;
}

/* Artículo */
.coaching-articulo__titulo {
  font-family:var(--font-titulo);
  font-size:clamp(1.4rem,3vw,2rem);
  font-weight:600;
  color:var(--verde-oscuro);
  margin-bottom:1.25rem;
  letter-spacing:-.01em;
}

.coaching-articulo__subtitulo {
  font-family:var(--font-titulo);
  font-size:1.1rem;
  font-weight:600;
  color:var(--verde-petroleo);
  margin:2rem 0 .75rem;
}

.coaching-articulo p {
  font-size:.97rem;
  color:var(--gris-topo);
  line-height:1.85;
  margin-bottom:.9rem;
}

.coaching-articulo__lista {
  display:flex;
  flex-direction:column;
  gap:.5rem;
  margin-bottom:1rem;
}
.coaching-articulo__lista li {
  display:flex;
  align-items:flex-start;
  gap:.65rem;
  font-size:.95rem;
  color:var(--gris-carbon);
  line-height:1.6;
  padding:.4rem 0;
  border-bottom:1px solid rgba(46,72,71,.08);
}
.coaching-articulo__lista li:last-child { border-bottom:none; }

/* Pilares */
.coaching-pilares {
  display:flex;
  flex-direction:column;
  gap:1rem;
  margin:1rem 0 1.5rem;
}
.coaching-pilar {
  display:flex;
  gap:1rem;
  align-items:flex-start;
  background:var(--crema);
  border-radius:var(--radio);
  padding:1rem 1.25rem;
}
.coaching-pilar__num {
  font-family:var(--font-titulo);
  font-size:1.1rem;
  font-weight:600;
  color:var(--gris-topo);
  flex-shrink:0;
}
.coaching-pilar p {
  margin:0 !important;
  font-size:.93rem;
}

/* Pasos de sesión */
.coaching-pasos {
  display:flex;
  flex-direction:column;
  gap:.75rem;
  margin:1rem 0 1.5rem;
}
.coaching-paso {
  display:flex;
  gap:1rem;
  align-items:flex-start;
  padding:1rem 1.25rem;
  background:var(--blanco);
  border:1px solid rgba(46,72,71,.12);
  border-radius:var(--radio);
  transition:border-color var(--trans), box-shadow var(--trans);
}
.coaching-paso:hover {
  border-color:rgba(46,72,71,.25);
  box-shadow:var(--sombra);
}
.coaching-paso__num {
  font-family:var(--font-titulo);
  font-size:1.3rem;
  font-weight:600;
  color:var(--coral);
  flex-shrink:0;
  line-height:1.2;
  min-width:1.5rem;
}
.coaching-paso div { display:flex; flex-direction:column; gap:.25rem; }
.coaching-paso strong {
  font-family:var(--font-titulo);
  font-size:.95rem;
  font-weight:600;
  color:var(--verde-oscuro);
}
.coaching-paso p {
  font-size:.88rem !important;
  color:var(--gris-topo) !important;
  margin:0 !important;
  line-height:1.6 !important;
}

/* Info box */
.coaching-info-box {
  display:flex;
  flex-direction:column;
  gap:.5rem;
  background:var(--crema);
  border-radius:var(--radio);
  padding:1.25rem 1.5rem;
  margin:1.5rem 0;
}
.coaching-info-item {
  display:flex;
  align-items:center;
  gap:.65rem;
  font-size:.92rem;
  color:var(--verde-petroleo);
  font-family:var(--font-titulo);
  font-weight:400;
}

/* Cita */
.coaching-quote {
  border-left:3px solid var(--coral);
  padding:.9rem 1.25rem;
  margin:1.5rem 0;
  font-size:.97rem;
  color:var(--gris-carbon);
  line-height:1.8;
  font-style:italic;
  background:rgba(232,112,121,.04);
  border-radius:0 var(--radio) var(--radio) 0;
}

/* Video / link card */
.coaching-video { margin:2rem 0; }

.video-link-card {
  display:flex;
  flex-direction:column;
  border:1px solid rgba(46,72,71,.15);
  border-radius:var(--radio-lg);
  overflow:hidden;
  transition:box-shadow var(--trans), border-color var(--trans);
  color:inherit;
}
.video-link-card:hover {
  box-shadow:var(--sombra-hover);
  border-color:rgba(46,72,71,.28);
}

.video-link-card__thumb {
  position:relative;
  aspect-ratio:16/9;
  background:var(--gris-carbon);
  overflow:hidden;
}
.video-link-card__thumb img {
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .4s ease;
}
.video-link-card:hover .video-link-card__thumb img {
  transform:scale(1.03);
}

.video-link-card__play {
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(49,56,49,.45);
  transition:background var(--trans);
}
.video-link-card:hover .video-link-card__play {
  background:rgba(232,112,121,.65);
}
.video-link-card__play svg {
  filter:drop-shadow(0 2px 6px rgba(0,0,0,.4));
  width:52px;
  height:52px;
}

.video-link-card__info {
  padding:1.25rem 1.5rem;
  background:var(--blanco);
  display:flex;
  flex-direction:column;
  gap:.4rem;
}

.video-link-card__label {
  font-family:var(--font-titulo);
  font-size:.75rem;
  font-weight:600;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--coral);
}

.video-link-card__titulo {
  font-family:var(--font-titulo);
  font-size:1.05rem;
  font-weight:600;
  color:var(--verde-oscuro);
  line-height:1.3;
}

.video-link-card__desc {
  font-size:.88rem;
  color:var(--gris-topo);
  line-height:1.7;
}

/* FAQ dentro del artículo */
.coaching-faq { margin-top:2.5rem; }
.coaching-faq .faq-card { max-width:100%; }

/* Sidebar */
.coaching-sidebar {
  display:flex;
  flex-direction:column;
  gap:1.5rem;
}

.sidebar-card {
  background:var(--blanco);
  border:1px solid rgba(46,72,71,.15);
  border-radius:var(--radio-lg);
  padding:1.75rem;
}

.sidebar-card__titulo {
  font-family:var(--font-titulo);
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--verde-petroleo);
  margin-bottom:1.25rem;
  padding-bottom:.75rem;
  border-bottom:2px solid var(--crema);
}

.sidebar-card__lista {
  display:flex;
  flex-direction:column;
  gap:.5rem;
  margin-bottom:1.5rem;
}
.sidebar-card__lista li {
  display:flex;
  align-items:flex-start;
  gap:.6rem;
  font-size:.92rem;
  color:var(--gris-carbon);
  line-height:1.5;
  padding:.35rem 0;
  border-bottom:1px solid rgba(46,72,71,.07);
}
.sidebar-card__lista li:last-child { border-bottom:none; }

/* Posts recientes */
.sidebar-posts {
  display:flex;
  flex-direction:column;
  gap:.25rem;
}

.sidebar-post {
  display:flex;
  flex-direction:column;
  gap:.15rem;
  padding:.75rem 0;
  border-bottom:1px solid rgba(46,72,71,.08);
  transition:color var(--trans);
}
.sidebar-post:last-child { border-bottom:none; }
.sidebar-post:hover .sidebar-post__titulo { color:var(--coral); }

.sidebar-post__fecha {
  font-family:var(--font-titulo);
  font-size:.72rem;
  font-weight:500;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--gris-topo);
}

.sidebar-post__titulo {
  font-family:var(--font-titulo);
  font-size:.95rem;
  font-weight:500;
  color:var(--verde-oscuro);
  line-height:1.35;
  transition:color var(--trans);
}

/* ════════════════════════════════════════════════════════
   PÁGINA PRODUCTOS
   ════════════════════════════════════════════════════════ */

.productos-intro__container {
  display:grid;
  gap:3rem;
  align-items:center;
}
.productos-intro__texto p {
  font-size:.97rem;
  color:var(--gris-topo);
  line-height:1.8;
  margin-bottom:.9rem;
}
.productos-pilares {
  display:flex;
  flex-direction:column;
  gap:.6rem;
  margin-top:1.25rem;
}
.productos-pilar {
  display:flex;
  align-items:flex-start;
  gap:.65rem;
  font-size:.93rem;
  color:var(--gris-carbon);
  line-height:1.5;
}
.productos-intro__imagen {
  border-radius:var(--radio-lg);
  overflow:hidden;
}
.productos-intro__imagen img {
  width:100%;
  height:420px;
  object-fit:cover;
  object-position:top center;
}

/* Marca de agua COATI en toda la página */
.pagina-productos {
  position:relative;
}
.pagina-productos::before {
  content:'';
  position:fixed;
  inset:0;
  background-image:url('../img/logo-coati.png');
  background-size:280px 280px;
  background-repeat:repeat;
  opacity:.06;
  mix-blend-mode:multiply;
  pointer-events:none;
  z-index:0;
}
.pagina-productos > main,
.pagina-productos > footer { position:relative; z-index:1; }

/* Hero productos: 2 columnas logo-izquierda / texto-derecha */
/* Celular: arriba el sello + "Laboratorio Creativo", después el título y la frase */
.productos-hero-grid {
  display:grid;
  grid-template-columns:1fr;
  grid-template-areas:
    "logo"
    "titulo"
    "desc";
  gap:.9rem;
  align-items:center;
  padding-block:1rem;
}
.productos-hero-titulo { grid-area:titulo; }
.productos-hero-logo   { grid-area:logo; }
.productos-hero-desc   { grid-area:desc; }

.productos-hero-logo {
  display:flex;
  flex-direction:row;
  align-items:center;
  justify-content:flex-start;
  gap:.75rem;
}
.productos-hero-logo img {
  width:64px;
  height:auto;
  filter:brightness(0) invert(1);
  opacity:.8;
}
.productos-hero-logo .section__eyebrow { margin:0; }

/* Escritorio: el sello grande a la izquierda con su bajada, título y frase a la derecha */
@media (min-width: 768px) {
  .productos-hero-grid {
    grid-template-columns:auto 1fr;
    grid-template-areas:
      "logo titulo"
      "logo desc";
    gap:.5rem 2.5rem;
  }
  .productos-hero-logo {
    flex-direction:column;
    justify-content:center;
    gap:.5rem;
  }
  .productos-hero-logo img { width:150px; }
  .productos-hero-logo .section__eyebrow { text-align:center; }
}

/* Grilla de productos */
.productos-grilla { background:var(--crema); }
.productos-grid {
  display:grid;
  gap:1.5rem;
  margin-bottom:3rem;
}

.producto-card {
  background:var(--blanco);
  border-radius:var(--radio-lg);
  overflow:hidden;
  border:1px solid rgba(178,168,156,.2);
  transition:box-shadow var(--trans), border-color var(--trans);
}
.producto-card:hover {
  box-shadow:var(--sombra-hover);
  border-color:rgba(49,56,49,.15);
}

.producto-card__imagen {
  aspect-ratio:1/1;
  overflow:hidden;
  background:rgba(231,223,200,.4);
}
.producto-card__imagen img {
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .4s ease;
}
.producto-card:hover .producto-card__imagen img { transform:scale(1.04); }

.producto-card__imagen--vacia {
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:.75rem;
  color:var(--gris-topo);
  opacity:.5;
}
.producto-card__imagen--vacia p {
  font-family:var(--font-titulo);
  font-size:.78rem;
  letter-spacing:.06em;
  text-transform:uppercase;
}

.producto-card__info { padding:1.25rem 1.5rem 1.5rem; }
.producto-card__categoria {
  font-family:var(--font-titulo);
  font-size:.72rem;
  font-weight:500;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--gris-topo);
  margin-bottom:.35rem;
}
.producto-card__nombre {
  font-family:var(--font-titulo);
  font-size:1.1rem;
  font-weight:600;
  color:var(--verde-oscuro);
  margin-bottom:.5rem;
}
.producto-card__desc {
  font-size:.88rem;
  color:var(--gris-topo);
  line-height:1.7;
  margin-bottom:1rem;
}

.productos-ig {
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:1rem;
  padding-top:1rem;
}
.productos-ig p {
  font-family:var(--font-titulo);
  font-size:1rem;
  color:var(--verde-petroleo);
}

/* Tagline */
.productos-tagline { background:transparent; padding-block:4rem; }
.productos-tagline__box {
  max-width:700px;
  margin-inline:auto;
  text-align:center;
  border:1.5px solid rgba(46,72,71,.2);
  border-radius:28px;
  padding:2.5rem 2rem;
}
.productos-tagline__sup {
  font-family:var(--font-titulo);
  font-size:.78rem;
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--gris-topo);
  margin-bottom:1rem;
}
.productos-tagline__titulo {
  font-family:var(--font-titulo);
  font-size:clamp(1.2rem,2.5vw,1.7rem);
  font-weight:500;
  color:var(--verde-petroleo);
  line-height:1.45;
  font-style:italic;
}

/* Info cards algodón */
.productos-info { background:transparent; }
.productos-info-grid {
  display:grid;
  gap:1.25rem;
}
.info-card {
  border:1px solid rgba(46,72,71,.12);
  border-radius:var(--radio-lg);
  padding:1.75rem;
  transition:box-shadow var(--trans), border-color var(--trans);
}
.info-card:hover {
  box-shadow:var(--sombra);
  border-color:rgba(46,72,71,.22);
}
.info-card__icono {
  font-size:1.75rem;
  margin-bottom:.75rem;
  line-height:1;
}
.info-card__titulo {
  font-family:var(--font-titulo);
  font-size:1rem;
  font-weight:600;
  color:var(--verde-oscuro);
  margin-bottom:.6rem;
}
.info-card p {
  font-size:.9rem;
  color:var(--gris-topo);
  line-height:1.75;
}

/* Proceso y packaging */
.productos-proceso-grid {
  display:grid;
  gap:3rem;
}
.proceso-bloque__titulo {
  font-family:var(--font-titulo);
  font-size:clamp(1.2rem,2.5vw,1.6rem);
  font-weight:600;
  color:var(--verde-oscuro);
  margin:0.5rem 0 1rem;
  letter-spacing:-.01em;
}
.proceso-bloque p {
  font-size:.95rem;
  color:var(--gris-topo);
  line-height:1.8;
  margin-bottom:1rem;
}
.proceso-bloque__lista {
  display:flex;
  flex-direction:column;
  gap:.65rem;
}
.proceso-bloque__lista li {
  display:flex;
  align-items:flex-start;
  gap:.65rem;
  font-size:.92rem;
  color:var(--gris-carbon);
  line-height:1.6;
  padding:.5rem 0;
  border-bottom:1px solid rgba(46,72,71,.08);
}
.proceso-bloque__lista li:last-child { border-bottom:none; }

/* Imagen sidebar coaching */
.sidebar-imagen {
  border-radius:var(--radio-lg);
  overflow:hidden;
  width:100%;
}
.sidebar-imagen img {
  width:100%;
  height:auto;
  display:block;
  object-fit:cover;
  transition:transform .4s ease;
}
.sidebar-imagen:hover img { transform:scale(1.02); }

/* ════════════════════════════════════════════════════════
   IG FEED — ÚLTIMAS PUBLICACIONES
   ════════════════════════════════════════════════════════ */

.ig-feed {
  background:transparent;
  padding-block:3rem;
}

.ig-feed__header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:.75rem;
  margin-bottom:1.25rem;
}

.ig-feed__titulo {
  font-family:var(--font-titulo);
  font-size:.82rem;
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--gris-topo);
}

.ig-feed__handle {
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  font-family:var(--font-titulo);
  font-size:.85rem;
  font-weight:500;
  color:var(--verde-petroleo);
  transition:color var(--trans);
}
.ig-feed__handle:hover { color:var(--coral); }

.ig-feed__grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:.5rem;
}

.ig-post {
  display:block;
  position:relative;
  aspect-ratio:1/1;
  overflow:hidden;
  border-radius:var(--radio);
  background:var(--crema);
}

.ig-post img {
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .4s ease;
  display:block;
}

.ig-post__overlay {
  position:absolute;
  inset:0;
  background:rgba(49,56,49,.0);
  display:flex;
  align-items:center;
  justify-content:center;
  transition:background var(--trans);
}

.ig-post:hover img { transform:scale(1.05); }
.ig-post:hover .ig-post__overlay { background:rgba(49,56,49,.45); }
.ig-post__overlay svg { opacity:0; transition:opacity var(--trans); }
.ig-post:hover .ig-post__overlay svg { opacity:1; }

.ig-post--vacio {
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--crema);
  min-height:120px;
}
.ig-post--vacio::after {
  content:'📸';
  font-size:1.75rem;
  opacity:.25;
}

.ig-feed__cta {
  text-align:center;
  margin-top:1.5rem;
}

/* ════════════════════════════════════════════════════════
   RETOQUES DE FOTO — filtros CSS por imagen
   ════════════════════════════════════════════════════════ */

/* Blog post 1: Tami en montaña — calidez y brillo */
.blog-card:nth-child(1) .blog-card__imagen img {
  filter: brightness(1.1) contrast(1.05) saturate(0.92);
  object-position: center 30%;
}
/* Blog post 2: Sierras — ya bien expuesta, leve ajuste */
.blog-card:nth-child(2) .blog-card__imagen img {
  filter: brightness(1.08) contrast(1.06) saturate(0.88);
  object-position: center 40%;
}
/* Blog post 3: Niebla — aclarar sombras */
.blog-card:nth-child(3) .blog-card__imagen img {
  filter: brightness(1.18) contrast(1.08) saturate(0.85);
  object-position: center center;
}

/* Taller costura: oscura, necesita más brillo y calidez */
.foto-costura {
  object-position: left center;
  filter: brightness(1.28) contrast(1.06) saturate(1.1) sepia(0.08);
}

/* Estampa: buena exposición, leve ajuste editorial */
.foto-estampa {
  filter: brightness(1.06) contrast(1.04) saturate(0.88);
}

/* Bebé COATI: exterior, desaturar levemente para editorial */
.foto-bebe {
  filter: brightness(1.08) contrast(1.04) saturate(0.9);
}

/* nav link activo */
.nav__link--activo { color:var(--coral) !important; font-weight:500; }
.nav__dropdown-link--activo { color:var(--coral) !important; }

/* utilidad alineación centro */
.tc { text-align:center; }

/* ════════════════════════════════════════════════════════
   RESPONSIVE — TABLET 768px+
   ════════════════════════════════════════════════════════ */

@media (min-width: 768px) {
  .section { padding-block:7rem; }

  /* Nav desktop */
  .nav__toggle { display:none; }
  .nav__menu {
    position:static;
    width:auto;
    height:auto;
    background:transparent;
    padding:0;
    flex-direction:row;
    gap:.1rem;
    align-items:center;
  }
  .nav__link {
    font-size:1rem;
    color:rgba(250,250,248,.9);
    padding:.4rem .75rem;
    border-bottom:none;
  }
  .header.scrolled .nav__link { color:rgba(231,223,200,.9); }
  .nav__link--cta { margin-top:0; padding:.5rem 1.25rem; }
  .header.scrolled .nav__link--cta { color:var(--blanco); }

  /* Dropdown desktop */
  .nav__dropdown-toggle {
    font-size:1rem;
    color:rgba(250,250,248,.9);
    padding:.4rem .65rem;
    border-bottom:none;
    width:auto;
  }
  .header.scrolled .nav__dropdown-toggle { color:rgba(231,223,200,.9); }

  .nav__dropdown {
    position:absolute;
    top:calc(100% + .5rem);
    left:0;
    background:var(--blanco);
    border-radius:var(--radio);
    box-shadow:var(--sombra-hover);
    padding:.5rem 0;
    min-width:220px;
    border-left:none;
    margin:0;
    z-index:200;
  }
  .nav__item--dropdown.open .nav__dropdown { display:flex; }

  .nav__dropdown-link {
    color:var(--gris-carbon);
    font-size:.88rem;
    padding:.55rem 1.25rem;
    border-bottom:1px solid rgba(178,168,156,.12);
  }
  .nav__dropdown-link:last-child { border-bottom:none; }
  .nav__dropdown-link:hover { color:var(--coral); background:var(--crema); }

  /* Manifiesto */
  .manifiesto__items {
    grid-template-columns:1fr 1fr 1fr;
    gap:0;
  }
  .manifiesto__item {
    flex-direction:column;
    gap:.5rem;
    padding:2rem 2.5rem;
    border-bottom:none;
    border-right:1px solid rgba(178,168,156,.2);
    border-top:1px solid rgba(178,168,156,.2);
  }
  .manifiesto__item:first-child { border-top:1px solid rgba(178,168,156,.2); }
  .manifiesto__item:last-child { border-right:none; }

  /* Tarjetas 3 columnas */
  .mundo__cards { grid-template-columns:repeat(3,1fr); }

  /* Conectan */
  .conectan__grid { grid-template-columns:1fr 1fr; gap:5rem; }

  /* Blog */
  .blog-grid { grid-template-columns:repeat(3,1fr); gap:2.5rem; align-items:start; }

  /* DOS MUNDOS orgánico — 3 columnas */
  .mundos-grid {
    grid-template-columns:1fr 1fr 1fr;
    gap:2rem;
  }
  .mundo-imagenes { gap:.75rem; }

  /* Coaching 2 columnas */
  .coaching-layout { grid-template-columns:1fr 340px; gap:4rem; }

  /* Productos */
  .productos-intro__container { grid-template-columns:1fr 1fr; gap:5rem; }
  .productos-grid { grid-template-columns:repeat(3,1fr); }
  .productos-info-grid { grid-template-columns:repeat(2,1fr); }
  .productos-proceso-grid { grid-template-columns:1fr 1fr; gap:4rem; }

  /* Talleres page */
  .taller-full { grid-template-columns:1fr 1fr; }
  .taller-full--inverso .taller-full__contenido { order:2; }
  .taller-full--inverso .taller-full__imagen    { order:1; }
  .taller-full__imagen img { height:480px; }
  .horarios-grid { grid-template-columns:repeat(3,1fr); }

  /* Footer */
  .footer__top { justify-content:space-between; flex-wrap:nowrap; }
  .footer__inner { gap:.6rem; }
}

/* ════════════════════════════════════════════════════════
   RESPONSIVE — DESKTOP 1024px+
   ════════════════════════════════════════════════════════ */

@media (min-width: 1024px) {
  .container { padding-inline:2rem; }
  .hero__content { max-width:780px; margin-inline:auto; }
  .conectan__imagen > img { height:400px; }
}

/* ════════════════════════════════════════════════════════
   ACCESIBILIDAD: reduce-motion
   ════════════════════════════════════════════════════════ */

@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after {
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
  .fade-up { opacity:1; transform:none; }
  .fade-left,.fade-right { opacity:1; transform:none; }
  html { scroll-behavior:auto; }
}

/* ════════════════════════════════════════════════════════
   ANIMACIONES HORIZONTALES
   ════════════════════════════════════════════════════════ */

.fade-left {
  opacity:0;
  transform:translateX(-32px);
  transition:opacity .7s ease, transform .7s ease;
}
.fade-left.visible { opacity:1; transform:translateX(0); }

.fade-right {
  opacity:0;
  transform:translateX(32px);
  transition:opacity .7s ease, transform .7s ease;
}
.fade-right.visible { opacity:1; transform:translateX(0); }

/* ════════════════════════════════════════════════════════
   PÁGINA: SOBRE MÍ
   ════════════════════════════════════════════════════════ */

.sobre-eyebrow {
  font-family:var(--font-titulo);
  font-size:.75rem;
  font-weight:500;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--verde-petroleo);
  margin-bottom:.6rem;
}

/* Bio: imagen + texto */
.sobre-bio { background:transparent; }

.sobre-bio__grid {
  display:grid;
  gap:3.5rem;
  align-items:center;
}

.sobre-bio__imagen {
  position:relative;
  border-radius:var(--radio-lg);
  overflow:hidden;
}
/* Hijo directo: si no, esta regla también le pegaba a la firma de abajo
   (que va anidada adentro) y la agrandaba hasta tapar la foto. */
.sobre-bio__imagen > img {
  width:100%;
  height:340px;
  object-fit:cover;
  /* Antes recortaba desde arriba, que servía para la ilustración de
     cuerpo entero. Con la foto hay que recortar desde el centro o se
     pierde la cara. */
  object-position:center;
}

.sobre-bio__texto {
  display:flex;
  flex-direction:column;
  gap:1.1rem;
}
.sobre-bio__texto p {
  font-size:.97rem;
  color:var(--gris-carbon);
  line-height:1.85;
}
.sobre-bio__texto .conectan__intro {
  margin-bottom:.25rem;
}
.sobre-bio__texto .conectan__credenciales {
  margin-top:.75rem;
}

/* Sendero divisor */
.sobre-sendero-wrap {
  padding-block:1.5rem;
  overflow:hidden;
}
.sobre-sendero {
  width:100%;
  height:60px;
  display:block;
}
.sobre-sendero__path {
  stroke-dasharray:1200;
  stroke-dashoffset:1200;
  transition:stroke-dashoffset 1.6s cubic-bezier(0.25, 0.1, 0.25, 1);
}
.sobre-sendero.draw .sobre-sendero__path {
  stroke-dashoffset:0;
}

/* Valores */
.sobre-valores { background:transparent; padding-top:0; }

.sobre-valores__grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:2rem 1.5rem;
}

.sobre-valor {
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:.85rem;
  padding:1.5rem 1rem;
}

.sobre-valor__icono {
  width:52px;
  height:52px;
  border-radius:50%;
  background:rgba(46,72,71,.1);
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  color:var(--verde-petroleo);
  transition:background var(--trans), transform var(--trans);
}
.sobre-valor:hover .sobre-valor__icono {
  background:rgba(46,72,71,.18);
  transform:translateY(-3px);
}

.sobre-valor__titulo {
  font-family:var(--font-titulo);
  font-size:1rem;
  font-weight:600;
  color:var(--verde-oscuro);
  line-height:1.3;
}

.sobre-valor__texto {
  font-size:.88rem;
  color:var(--gris-topo);
  line-height:1.7;
  max-width:200px;
}

/* CTA sobre mí */
.sobre-cta {
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:1.75rem;
}
.sobre-cta__texto {
  font-size:1.15rem;
  color:rgba(231,223,200,.88);
  line-height:1.7;
  max-width:440px;
}

/* Responsive tablet+ */
@media (min-width: 768px) {
  .sobre-bio__grid { grid-template-columns:1fr 1fr; gap:5rem; }
  .sobre-bio__imagen > img { height:400px; }
  .sobre-valores__grid { grid-template-columns:repeat(4,1fr); gap:1.5rem; }
  .sobre-valor__texto { max-width:none; }
}

/* ════════════════════════════════════════════════════════
   PÁGINA COACHING — SECCIONES NUEVAS
   ════════════════════════════════════════════════════════ */

/* Para quién es */
.coaching-para-quien {
  background:transparent;
  padding-block:2.5rem;
}

.coaching-quien__grid {
  display:grid;
  gap:2rem;
  align-items:center;
}

.coaching-quien__card {
  background:rgba(250,250,248,.6);
  border:1px solid rgba(49,56,49,.1);
  border-radius:var(--radio);
  padding:1.5rem 1.75rem;
}

.coaching-quien__titulo {
  font-family:var(--font-titulo);
  font-size:1rem;
  font-weight:600;
  color:var(--verde-oscuro);
  margin-bottom:1rem;
  letter-spacing:-.01em;
}

.coaching-quien__lista {
  display:flex;
  flex-direction:column;
  gap:.6rem;
}
.coaching-quien__lista li {
  display:flex;
  align-items:flex-start;
  gap:.65rem;
  font-size:.9rem;
  color:var(--gris-carbon);
  line-height:1.55;
}
.coaching-quien__punto {
  color:var(--coral);
  font-size:1rem;
  flex-shrink:0;
  font-weight:700;
}

/* Foto apaisada: va entera, sin recortar los costados */
.coaching-quien__imagen { margin:0; }
.coaching-quien__imagen img {
  display:block;
  width:100%;
  height:auto;
  border-radius:var(--radio-lg);
}

/* Etapas / proceso */
.coaching-etapas { background:var(--crema); padding-block:3rem; }

.coaching-etapas__sub {
  font-size:.97rem;
  color:var(--gris-topo);
  text-align:center;
  margin-top:.5rem;
  line-height:1.7;
}

.coaching-etapas__scene {
  display:flex;
  flex-direction:column;
}

/* Línea orgánica animada */
.coaching-etapas__svg {
  width:100%;
  height:56px;
  display:block;
  flex-shrink:0;
}
.coaching-etapas__line {
  stroke-dasharray:1600;
  stroke-dashoffset:1600;
  transition:stroke-dashoffset 1.8s cubic-bezier(0.25,0.1,0.25,1);
}
.coaching-etapas__line.draw {
  stroke-dashoffset:0;
}

.coaching-etapas__grid {
  display:grid;
  grid-template-columns:1fr;
  gap:2rem;
}

.coaching-etapa {
  display:flex;
  flex-direction:column;
  gap:.75rem;
  padding-top:1rem;
}

.coaching-etapa__num {
  font-family:var(--font-titulo);
  font-size:.75rem;
  font-weight:600;
  letter-spacing:.12em;
  color:var(--verde-petroleo);
}

.coaching-etapa__titulo {
  font-family:var(--font-titulo);
  font-size:1rem;
  font-weight:600;
  color:var(--verde-oscuro);
  line-height:1.3;
}

.coaching-etapa__texto {
  font-size:.9rem;
  color:var(--gris-topo);
  line-height:1.75;
}

/* Frase final */
.coaching-cita-final { text-align:center; }

.coaching-cita-final__inner {
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:2rem;
  max-width:600px;
  margin-inline:auto;
}

.coaching-cita-final__frase {
  font-family:var(--font-firma);
  font-size:clamp(1.6rem,4vw,2.4rem);
  color:var(--crema);
  line-height:1.45;
  font-weight:500;
}

/* Logo COATI junto a título de taller */
.taller-coati-titulo {
  display:flex;
  flex-direction:row;
  align-items:center;
  gap:.75rem;
  flex-wrap:nowrap;
}
.taller-coati-titulo .taller-full__titulo {
  margin-bottom:0;
}
.taller-coati-logo {
  width:36px;
  height:36px;
  object-fit:contain;
  opacity:.55;
  flex-shrink:0;
  mix-blend-mode:multiply;
}

/* Responsive coaching nuevas secciones */
@media (min-width: 768px) {
  .coaching-quien__grid { grid-template-columns:1fr 1fr; gap:5rem; }
  .coaching-etapas__grid { grid-template-columns:repeat(4,1fr); gap:1.5rem; }
  .coaching-etapas__svg { height:64px; }
}