/* Natura Nácar — una tarea por color */
  :root{
    --misty:#C6D1D9;        /* fondo: el lujo sutil */
    --misty-velo:#E8EEF2;   /* misty aclarado para campos amplios */
    --blanco:#FFFFFF;       /* fondo: luminosidad */
    --oro:#C9A360;          /* títulos (el que ella eligió para leerse) */
    --oro-linea:#D4AF37;    /* filetes y detalles */
    --rosa:#DAABB5;         /* rótulos y firma */
    --rosa-texto:#B07C88;   /* rosa con contraste para rótulos pequeños */
    --tinta:#3F4A52;        /* texto de servicio */
    --tinta-suave:#6B7780;
    /* Fondo de página (antes blanco). Se elige con el selector de la maqueta */
    --fondo:#ECE6E4;        /* Nácar: perla cálida (Misty + Dusty Rose), elegido por Sofía 2026-11-10 */
    --fondo-2:#E2DAD9;      /* secciones alternas, un punto más hondo */
  }

  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  body{font-family:'Montserrat',sans-serif;font-weight:300;color:var(--tinta);background:var(--fondo);line-height:1.75;font-size:15px}
  a{color:inherit;text-decoration:none}
  img{display:block;max-width:100%}
  .wrap{max-width:1180px;margin:0 auto;padding:0 clamp(16px,4vw,40px)}
  .eyebrow{display:inline-block;font-size:.7rem;letter-spacing:.28em;text-transform:uppercase;color:var(--rosa-texto);font-weight:500}
  h1,h2,h3{font-family:'Cormorant Garamond',serif;font-weight:500;color:var(--oro);line-height:1.15}
  h2{font-size:clamp(2rem,4vw,3rem);margin-top:10px}
  .section-head{text-align:center;margin-bottom:clamp(40px,5vw,64px)}
  .section-head p{max-width:600px;margin:14px auto 0;color:var(--tinta-suave)}
  .filete{width:64px;height:1px;background:var(--oro-linea);margin:18px auto 0}
  section{padding:clamp(72px,9vw,120px) 0}
  .btn{display:inline-block;font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;font-weight:500;padding:15px 32px;border:1px solid var(--oro-linea);color:var(--tinta);background:transparent;transition:.3s}
  .btn:hover{background:var(--oro-linea);color:var(--blanco)}
  .btn.lleno{background:var(--oro);border-color:var(--oro);color:var(--blanco)}
  .btn.lleno:hover{background:transparent;color:var(--oro)}
  .pendiente{font-style:italic;color:var(--rosa-texto)}

  /* Cabecera */
  header{position:sticky;top:0;z-index:10;background:color-mix(in srgb,var(--fondo) 88%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid rgba(212,175,55,.25)}
  /* Filetes del logo (Sofía, 2026-11-10): dos líneas de oro finas que se desvanecen hacia fuera */
  .logo-w{display:inline-flex;align-items:center;gap:14px}
  .logo-w i{display:block;width:28px;height:1px;background:linear-gradient(90deg,rgba(212,175,55,0),#C9A360)}
  .logo-w i:last-child{background:linear-gradient(90deg,#C9A360,rgba(212,175,55,0))}
  footer .logo-w{margin-bottom:8px}
  /* Cabecera a todo el ancho, con el logo a la izquierda como en la web original (83px de alto, ~98px de margen) */
  nav{display:flex;align-items:center;justify-content:space-between;height:83px}
  header nav.wrap{max-width:none;padding:0 clamp(16px,7vw,98px)}
  /* LOGO (Sofía, 2026-11-10): el de la web original (Cormorant 500, 1,7rem, .12em) con el dorado «A»:
     el mismo degradado sin los dos tonos marrones, para que no se vea oscuro. Sin sombra. */
  .logo{font-family:'Cormorant Garamond',serif;font-size:1.7rem;font-weight:500;letter-spacing:.12em;line-height:1.7;
    background:linear-gradient(100deg,#BE9447 0%,#D4B06C 14%,#EBD7A6 26%,#C49A4E 40%,#E0C488 54%,#B88D42 68%,#E4CC97 82%,#C29849 100%);
    -webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
  .menu{display:flex;gap:clamp(18px,3vw,36px);list-style:none;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;font-weight:500}
  .menu a:hover{color:var(--oro)}

  /* Portada: una sola promesa, un botón */
  .hero{position:relative;min-height:clamp(560px,88vh,820px);display:flex;align-items:center;text-align:center;
    background:radial-gradient(ellipse 46% 30% at 50% 47%,rgba(255,255,255,.55),rgba(255,255,255,0) 100%),linear-gradient(180deg,rgba(198,209,217,.12),rgba(255,255,255,0) 55%,color-mix(in srgb,var(--fondo) 85%,transparent) 92%,var(--fondo)),url('img/fondo-hero-nacar.jpg') center/cover;padding:0}
  /* Título opción B (Sofía, 2026-11-10): FILOSOFÍA en mayúsculas finas; FILO gris azulado, SOFÍA con el oro texturizado de la web */
  .hero h1{font-family:'Cormorant Garamond',serif;font-weight:400;letter-spacing:.3em;font-size:clamp(2.2rem,6.4vw,5rem);line-height:1.1;margin-right:-.3em}
  .hero h1 .filo{color:#8A9AA6;filter:drop-shadow(0 1px 1px rgba(30,38,46,.28)) drop-shadow(0 3px 10px rgba(30,38,46,.2)) drop-shadow(0 8px 26px rgba(30,38,46,.14))}
  .hero h1 .sof{background:url('img/fondo-mujer-alquimista.jpg') center/cover;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;
    filter:drop-shadow(0 1px 1px rgba(30,24,16,.5)) drop-shadow(0 3px 10px rgba(30,24,16,.4)) drop-shadow(0 8px 28px rgba(30,24,16,.3))}
  .hero p{max-width:560px;margin:22px auto 38px;font-size:1.05rem;color:var(--tinta)}
  .hero .eyebrow{display:block;margin:20px 0 42px;color:#8E5A67}

  /* Cursos */
  .cursos{background:var(--fondo)}
  .rejilla{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(22px,2.6vw,36px)}
  .curso{display:flex;flex-direction:column;background:var(--blanco);border:1px solid rgba(198,209,217,.9);transition:.35s}
  .curso:hover{transform:translateY(-4px);box-shadow:0 18px 40px -22px rgba(63,74,82,.35);border-color:var(--oro-linea)}
  .curso .foto{aspect-ratio:4/3;background-size:cover;background-position:center;position:relative}
  .curso .foto::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(198,209,217,.15),rgba(198,209,217,.55))}
  .curso .num{position:absolute;left:20px;bottom:14px;z-index:1;font-family:'Cormorant Garamond',serif;font-size:3rem;color:#fff;line-height:1}
  .curso .cuerpo{padding:26px 26px 28px;display:flex;flex-direction:column;flex:1}
  .curso .tag{font-size:.64rem;letter-spacing:.24em;text-transform:uppercase;color:var(--rosa-texto);font-weight:500}
  .curso h3{font-size:1.75rem;margin:8px 0 10px}
  .curso p{font-size:.92rem;color:var(--tinta-suave);flex:1}
  .curso .pie{display:flex;justify-content:space-between;align-items:center;margin-top:22px;padding-top:16px;border-top:1px solid rgba(212,175,55,.35);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase}
  .curso .pie .precio{font-family:'Cormorant Garamond',serif;font-size:1.15rem;letter-spacing:.04em;text-transform:none;color:var(--oro)}
  .curso.vivido{background:var(--misty-velo)}

  /* Constelaciones en grupo */
  .grupo{background:var(--misty)}
  .grupo .eyebrow{color:var(--tinta)}
  .dos{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(255,255,255,.7)}
  .dos > div{background:var(--misty);padding:clamp(30px,4vw,52px)}
  .dos h3{font-size:2rem;margin:6px 0 12px}
  .dos p{margin-bottom:22px}
  .grupo .intro{max-width:720px;margin:0 auto clamp(40px,5vw,60px);text-align:center;font-family:'Cormorant Garamond',serif;font-size:clamp(1.3rem,2.2vw,1.65rem);font-style:italic;line-height:1.5}

  /* La filosofía */
  .filosofia .cita{max-width:780px;margin:0 auto;text-align:center;font-family:'Cormorant Garamond',serif;font-size:clamp(1.5rem,3vw,2.2rem);font-style:italic;color:var(--tinta);line-height:1.4}
  .fuerzas{display:grid;grid-template-columns:repeat(4,1fr);margin-top:clamp(48px,6vw,80px);border-top:1px solid var(--oro-linea)}
  .fuerzas > div{padding:28px 22px 0;border-right:1px solid var(--misty)}
  .fuerzas > div:last-child{border-right:0}
  .fuerzas span{font-family:'Cormorant Garamond',serif;font-size:2.6rem;color:var(--misty);line-height:1;filter:brightness(.82)}
  .fuerzas h3{font-size:1.4rem;margin:8px 0 0}

  /* FAQ */
  .faq{background:var(--fondo-2)}
  .faq details{max-width:780px;margin:0 auto;border-bottom:1px solid rgba(63,74,82,.15);padding:22px 0}
  .faq summary{cursor:pointer;list-style:none;font-family:'Cormorant Garamond',serif;font-size:1.4rem;color:var(--tinta);display:flex;justify-content:space-between;gap:20px}
  .faq summary::after{content:"+";color:var(--oro);font-size:1.6rem;line-height:1}
  .faq details[open] summary::after{content:"–"}
  .faq details p{margin-top:12px;color:var(--tinta-suave)}

  /* Contacto */
  .contacto{text-align:center}
  .canales{display:flex;justify-content:center;flex-wrap:wrap;gap:14px;margin-top:34px}
  footer{border-top:1px solid rgba(212,175,55,.35);padding:34px 0;text-align:center;font-size:.72rem;letter-spacing:.14em;color:var(--tinta-suave)}
  footer .logo{display:inline-block}

  .aviso{position:fixed;bottom:16px;left:50%;transform:translateX(-50%);z-index:20;background:var(--tinta);color:#fff;font-size:.72rem;letter-spacing:.08em;padding:10px 18px;border-radius:30px;opacity:.92}

  @media (max-width:960px){
    .rejilla{grid-template-columns:1fr 1fr}
    .fuerzas{grid-template-columns:1fr 1fr}
    .fuerzas > div:nth-child(2){border-right:0}
  }
  @media (max-width:640px){
    .menu{display:none}
    .rejilla,.dos,.fuerzas{grid-template-columns:1fr}
    .fuerzas > div{border-right:0;border-bottom:1px solid var(--misty);padding-bottom:22px}
    .hero{min-height:clamp(520px,78vh,720px)}
  }
  /* ── VARIAS PÁGINAS (2026-11-10) ───────────────────────────── */
  .menu a.activo{color:var(--oro);border-bottom:1px solid var(--oro-linea);padding-bottom:4px}
  .banda{position:relative;text-align:center;padding:clamp(70px,9vw,110px) 0 clamp(56px,7vw,84px);
    background:linear-gradient(180deg,rgba(198,209,217,.12),rgba(255,255,255,0) 55%,color-mix(in srgb,var(--fondo) 85%,transparent) 92%,var(--fondo)),url('img/fondo-hero-nacar.jpg') center/cover}
  .banda h1{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:clamp(2.2rem,5vw,3.6rem);color:var(--oro);margin-top:12px;
    filter:drop-shadow(0 1px 1px rgba(30,24,16,.25))}
  .banda .eyebrow{color:#8E5A67}
  .banda p{max-width:600px;margin:14px auto 0}
  .banda + section{padding-top:clamp(40px,5vw,64px)}
  .mas{text-align:center;margin-top:clamp(36px,4vw,52px)}

  /* Inicio: la explicación de la filosofía es el primer apartado (Sofía, 2026-11-10) */
  .explica .texto{max-width:720px;margin:0 auto;columns:2 320px;column-gap:48px}
  .explica .texto p{margin-bottom:1.1em;break-inside:avoid}
  .explica .destacada{text-align:center;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:clamp(1.6rem,3vw,2.3rem);color:var(--oro);margin:clamp(30px,4vw,48px) 0 0}
  .explica .rotulo-fuerzas{text-align:center;margin-top:clamp(44px,5vw,64px);font-size:.7rem;letter-spacing:.28em;text-transform:uppercase;color:var(--rosa-texto);font-weight:500}
  .explica .fuerzas{margin-top:18px}
  .explica ~ .cursos{background:var(--fondo-2)}
  .explica .fuerzas span{font-family:'Cormorant Garamond',serif;font-size:2.6rem;color:var(--misty);line-height:1;filter:brightness(.82)}
  .explica .fuerzas h3{font-size:1.4rem;margin:8px 0 0}

  /* Filosofía en la portada: cita + botón; la explicación se despliega al pulsar */
  .explica .cita-intro{max-width:780px;margin:clamp(28px,4vw,48px) auto 0;text-align:center;font-family:'Cormorant Garamond',serif;font-size:clamp(1.5rem,3vw,2.2rem);font-style:italic;color:var(--tinta);line-height:1.4}
  .explica .desplegable{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .6s ease,opacity .6s ease}
  .explica .desplegable.abierto{grid-template-rows:1fr;opacity:1}
  .explica .desplegable > .dentro{overflow:hidden;min-height:0}
  .explica .desplegable .texto{margin-top:clamp(40px,5vw,64px)}
  .explica button.btn{cursor:pointer;font-family:inherit}
  @media (prefers-reduced-motion:reduce){.explica .desplegable{transition:none}}
  .explica .desplegable[hidden]{display:none}