/* ═══════════════════════════════════════════════════════════════════
   Sistema de diseño · Dra. Lourdes Tomás — "Editorial Mentor"
   Oro #eac12c (la luz de la luciérnaga) · verde orgánico · papel cálido
   ═══════════════════════════════════════════════════════════════════ */

@font-face{
  font-family:'Montserrat';font-style:normal;font-weight:400;font-display:swap;
  src:url('/assets/fonts/montserrat-400.woff2') format('woff2');
}
@font-face{
  font-family:'Montserrat';font-style:normal;font-weight:600;font-display:swap;
  src:url('/assets/fonts/montserrat-600.woff2') format('woff2');
}

:root{
  --gold:#eac12c; --gold-deep:#bd930f; --gold-soft:#f7e6a8;
  --ink:#2b2926; --muted:#7c7266; --paper:#fbf8f1; --card:#ffffff;
  --line:#e7dfd0; --green:#38472e; --green-soft:#e6ebdf;
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;
  --sans:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --mono:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
  --maxw:1180px; --radius:16px;
  font-size:17px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;} *{animation:none!important;transition:none!important;}}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);line-height:1.62;-webkit-font-smoothing:antialiased;}
img{max-width:100%;height:auto;display:block;}
a{color:var(--gold-deep);text-decoration:none;}
a:hover{text-decoration:underline;}
h1,h2,h3,h4{font-family:var(--serif);font-weight:600;line-height:1.1;margin:0;text-wrap:balance;}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px;}
.eyebrow{font-family:var(--mono);font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-deep);}

/* ── Botones ── */
.btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:.76rem;letter-spacing:.09em;text-transform:uppercase;padding:13px 22px;border-radius:999px;border:1.6px solid transparent;cursor:pointer;transition:transform .15s,background .15s;text-decoration:none;}
.btn:hover{transform:translateY(-1px);text-decoration:none;}
.btn-gold,.btn{background:var(--gold);color:#231f16;border-color:var(--gold);}
.btn:hover{background:var(--gold-deep);color:#fff;}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--line);}
.btn.ghost:hover{background:transparent;color:var(--ink);border-color:var(--ink);}

/* ── Cabecera ── */
.site-header{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--paper) 90%,transparent);backdrop-filter:blur(9px);border-bottom:1px solid var(--line);}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;height:82px;gap:20px;}
.brand{display:flex;align-items:center;gap:13px;color:var(--ink);}
.brand:hover{text-decoration:none;}
.brand img{width:46px;height:auto;}
.lockup{display:flex;flex-direction:column;gap:3px;font-family:'Montserrat',var(--sans);text-transform:uppercase;line-height:1;}
.lockup .nm{font-weight:400;font-size:1rem;letter-spacing:.13em;color:#5a5a5c;}
.lockup .tg{font-weight:600;font-size:.66rem;letter-spacing:.16em;color:var(--gold-deep);}
.site-nav{display:flex;gap:26px;align-items:center;font-family:var(--mono);font-size:.72rem;letter-spacing:.13em;text-transform:uppercase;}
.site-nav a{color:var(--muted);}
.site-nav a:hover{color:var(--gold-deep);text-decoration:none;}
.site-header .wrap > .brand{margin-right:auto;}
.nav-cta{padding:11px 18px;font-family:var(--mono);font-size:.72rem;letter-spacing:.13em;text-transform:uppercase;white-space:nowrap;}
.cta-corta{display:none;}

/* Botón de tres barras: solo existe en móvil (ver el @media de abajo). */
.nav-toggle{display:none;width:30px;height:22px;padding:0;border:0;background:transparent;position:relative;cursor:pointer;}
.nav-toggle span{position:absolute;left:0;width:100%;height:1.5px;background:var(--ink);border-radius:2px;
  transition:transform .22s ease,opacity .18s ease;}
.nav-toggle span:nth-child(1){top:2px;}
.nav-toggle span:nth-child(2){top:50%;margin-top:-.75px;}
.nav-toggle span:nth-child(3){bottom:2px;}
.nav-toggle.is-open span:nth-child(1){transform:translateY(8.25px) rotate(45deg);}
.nav-toggle.is-open span:nth-child(2){opacity:0;}
.nav-toggle.is-open span:nth-child(3){transform:translateY(-8.25px) rotate(-45deg);}

@media(max-width:860px){
  .site-header .wrap{gap:14px;}
  .nav-toggle{display:block;order:3;flex:0 0 auto;}
  .nav-cta{order:2;padding:10px 14px;font-size:.66rem;letter-spacing:.1em;white-space:nowrap;}
  /* El desplegable cuelga de la cabecera entera, no del .wrap, para ocupar
     todo el ancho de la pantalla igual que la barra que tiene encima. */
  .site-nav{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;
    gap:0;background:var(--paper);border-bottom:1px solid var(--line);
    box-shadow:0 14px 28px rgba(31,31,33,.09);padding:6px 0 10px;}
  .site-nav.is-open{display:flex;}
  .site-nav a{padding:15px 22px;font-size:.78rem;letter-spacing:.14em;color:var(--ink);border-bottom:1px solid var(--line);}
  .site-nav a:last-child{border-bottom:0;}
}
/* Por debajo de 560 la barra no da para la marca completa, el CTA y el botón:
   se abrevia el CTA y el logotipo pierde la bajada. */
@media(max-width:560px){
  .site-header .wrap{height:88px;gap:8px;padding:0 16px;}
  /* La luciérnaga se cede a sí misma el sitio: en una barra de 360px el nombre
     y «tu médico mentor» dicen más que el símbolo. En el pie sigue estando. */
  .site-header .brand img{display:none;}
  .site-header .lockup{gap:2px;}
  .site-header .lockup .nm{font-size:1.06rem;letter-spacing:.04em;}
  .site-header .lockup .nm .tit{display:block;font-size:.66rem;letter-spacing:.13em;margin-bottom:3px;}
  .site-header .lockup .tg{font-size:.68rem;letter-spacing:.1em;}
  .nav-cta{padding:9px 12px;font-size:.62rem;letter-spacing:.07em;}
  .cta-larga{display:none;}
  .cta-corta{display:inline;}
  .site-nav a{padding:15px 16px;}
}

/* ── Main ── */
.site-main{min-height:60vh;}
.page-head{margin:44px 0 30px;}
.page-head h1{font-size:clamp(2rem,4.4vw,3rem);}
.lead{color:var(--muted);font-size:1.12rem;}

/* ── HOME: hero ── */
.hero-home{padding:64px 0 105px;}
.hero-home .top{display:grid;grid-template-columns:1.25fr .75fr;gap:48px;align-items:center;}
@media(max-width:820px){.hero-home .top{grid-template-columns:1fr;gap:26px;}
  .hero-home .top > .aside{order:-1;padding-top:0;}
  .hero-home{padding-top:34px;}}
.hero-home h1{font-size:clamp(1.65rem,3.1vw,2.35rem);letter-spacing:-.01em;line-height:1.16;margin:0;}
.hero-home h1 .kicker{display:block;font-family:var(--mono);font-weight:400;font-size:.72rem;letter-spacing:.2em;line-height:1.4;margin-bottom:18px;}
.hero-home h1 .g{color:var(--gold-deep);font-style:italic;}
.hero-home .lead{max-width:48ch;margin:22px 0 0;}
/* La frase del paciente pesa un poco más que el resto: es la que engancha. */
.lead .cita{font-weight:600;color:var(--ink);}
.hero-home .quote{font-family:var(--serif);font-style:italic;font-size:1.12rem;color:var(--ink);border-left:3px solid var(--gold);padding-left:18px;margin-top:20px;max-width:52ch;}
.hero-home .cta{display:flex;gap:13px;flex-wrap:wrap;margin-top:28px;}
.hero-home .aside{padding-top:6px;}
.portrait{margin:0 auto;max-width:82%;}
/* En el teléfono el retrato es un medallón: círculo con el rostro, alineado a
   la izquierda con el texto que tiene encima. */
@media(max-width:820px){
  .portrait{max-width:100%;margin:0;}
  .hero-home .portrait img{width:min(138px,36vw);aspect-ratio:1;border-radius:50%;object-position:50% 50%;
    box-shadow:0 12px 26px -18px rgba(31,31,33,.45);}
  .hero-home .portrait figcaption{display:none;}
}
.portrait img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 22%;border-radius:20px;background:var(--green-soft);}
.portrait figcaption{font-family:var(--serif);font-style:italic;text-align:center;text-wrap:balance;font-size:.95rem;color:var(--muted);margin-top:14px;}
.portrait figcaption b{color:var(--gold-deep);font-style:normal;}

/* ── HOME: frase puente hacia los pilares ── */
/* La frase de los tres pilares es la bisagra de la home: presenta al médico
   mentor y anuncia las tres secciones que vienen. Banda a todo lo ancho en
   verde suave, para que corte la página y no se pueda pasar por alto, sin
   competir con la banda verde oscura del manifiesto que viene más abajo.
   El hueco de arriba (padding inferior del hero) y el de abajo (padding
   superior del primer pilar) son iguales: la banda queda centrada entre
   las dos secciones. */
.bridge,.tira{background:var(--green-soft);border-top:1px solid #d3dcc6;border-bottom:1px solid #d3dcc6;padding:50px 0;}
.bridge p,.tira h2{margin:0 auto;max-width:58ch;text-align:center;text-wrap:balance;font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(1.2rem,1.05rem + .7vw,1.46rem);line-height:1.42;color:var(--ink);white-space:normal;}
@media(max-width:560px){.bridge,.tira{padding:34px 0;}}
.bridge a{color:#8f6f06;text-decoration:none;border-bottom:2px solid var(--gold);font-style:normal;font-weight:600;}
.bridge a:hover{color:var(--ink);text-decoration:none;}
/* El corte de línea del puente lo marca un <br>, no el ancho: la primera
   frase entera arriba y «Hoy son tres proyectos vivos» debajo. */
.bridge p{max-width:none;}

/* La tira de titular de sección comparte regla con el puente de la home
   (arriba) para que no puedan separarse con el tiempo. */
.tira + .lp-sec{padding-top:46px;}
.tira + .lp-sec .num-grid{margin-top:0;}

/* ── HOME: secciones de pilar ── */
.pillar-sec{padding:74px 0;}
.bridge + .pillar-sec{padding-top:40px;}
@media(max-width:820px){.bridge + .pillar-sec{padding-top:74px;}}
.pillar-sec .grid{display:grid;grid-template-columns:1.145fr .855fr;gap:52px;align-items:center;
  /* Alto mínimo común: Sanar es más alto porque lleva dos párrafos, y sin esto
     Educar y Ayudar quedaban apretadas al lado. Así respiran las tres igual. */
  min-height:clamp(342px,34vw,432px);}
@media(max-width:820px){.pillar-sec .grid{grid-template-columns:1fr;gap:26px;}
  .pillar-sec .grid > .visual{order:-1;}}
.pillar-sec.flip .grid{grid-template-columns:.855fr 1.145fr;}
.pillar-sec.flip .grid > .visual{order:-1;}
@media(max-width:820px){.pillar-sec.flip .grid{grid-template-columns:1fr;}
  .pillar-sec.flip .grid > .visual{order:-1;}}
.pillar-sec h2{font-size:clamp(1.35rem,2.5vw,1.85rem);margin:12px 0 0;}
.pillar-sec h2 em{font-style:italic;color:var(--gold-deep);}
.pillar-sec p{color:var(--muted);font-size:1.05rem;margin:16px 0 0;}
.pillar-sec .quote{font-family:var(--serif);font-style:italic;font-size:1.15rem;color:var(--ink);border-left:3px solid var(--gold);padding-left:18px;margin-top:20px;}
.pillar-sec .act{margin-top:26px;display:flex;gap:12px;flex-wrap:wrap;}
/* franja verde (manifiesto) */
.band-green{background:var(--green);color:#f1e9d8;padding:78px 0;}
.band-green .eyebrow{color:var(--gold);}
.band-green h2{color:#fbf6ea;font-size:clamp(1.35rem,2.5vw,1.85rem);margin:12px 0 0;}
.band-green h2 em{font-style:italic;color:var(--gold);}
.band-green p{color:#cfd6c4;margin:16px 0 0;font-size:1.05rem;}
.band-green .quote{font-family:var(--serif);font-style:italic;font-size:1.22rem;color:var(--gold-soft);border-left:3px solid var(--gold);padding-left:18px;margin-top:22px;}
.band-green .grid{display:grid;grid-template-columns:1fr 1fr;gap:46px;align-items:center;}
@media(max-width:820px){.band-green .grid{grid-template-columns:1fr;gap:24px;}}
.band-green .video{position:relative;aspect-ratio:16/9;border-radius:16px;overflow:hidden;background:#2b3724;box-shadow:0 18px 44px -24px rgba(0,0,0,.65);}
.band-green .video iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;}

/* ── Newsletter ── */
.newsletter{padding:88px 0;}
/* Una sola columna centrada: en dos columnas el texto dejaba medio recuadro
   vacío debajo, y el formulario quedaba arrinconado a la derecha. */
.newsletter .box{text-align:center;}
.newsletter h2{font-size:clamp(1.3rem,2.4vw,1.75rem);margin:10px 0 0;}
.newsletter p{color:var(--muted);margin:12px auto 0;max-width:68ch;}
.newsletter .box > div:first-child{margin-bottom:30px;}
.nl-form{display:flex;flex-direction:column;gap:14px;text-align:left;max-width:700px;margin:0 auto;border:1px solid var(--line);border-radius:20px;padding:32px 34px;}
@media(max-width:560px){.nl-form{padding:24px 20px;border-radius:16px;}}
.nl-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
@media(max-width:560px){.nl-row{grid-template-columns:1fr;}}
.nl-form .hp{position:absolute;left:-9999px;}
.nl-field{display:flex;flex-direction:column;gap:6px;font-size:.8rem;font-weight:600;letter-spacing:.02em;color:var(--muted);}
.nl-field input{padding:13px 16px;border:1.6px solid var(--line);border-radius:10px;font:inherit;font-weight:400;background:var(--card);color:var(--ink);}
.nl-field input:focus{outline:2px solid var(--gold);outline-offset:1px;border-color:var(--gold);}
.nl-temas{border:0;padding:0;margin:2px 0 0;text-align:center;}
.nl-temas legend{padding:0;font-size:.8rem;font-weight:600;letter-spacing:.02em;color:var(--muted);margin-bottom:10px;}
.nl-temas legend span{font-weight:400;text-transform:none;letter-spacing:0;}
.nl-temas-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:4px;}
@media(max-width:620px){.nl-temas-grid{grid-template-columns:1fr;}}
.nl-tema{display:flex;align-items:center;gap:9px;margin:0;padding:10px 16px;border:1.4px solid var(--line);border-radius:18px;background:var(--card);cursor:pointer;font-size:.86rem;text-align:left;transition:border-color .15s,background .15s;}
/* Dos líneas dentro de cada opción: el tema y, debajo, qué cubre. Deja de ser
   una píldora redonda para que la segunda línea no quede apretada contra el
   borde. */
.nl-tema-txt{display:flex;flex-direction:column;line-height:1.25;}
.nl-tema-s{font-size:.72rem;color:var(--muted);font-weight:400;margin-top:2px;}
.nl-tema:has(input:checked) .nl-tema-s{font-weight:400;}
.nl-tema:hover{border-color:var(--gold);}
.nl-tema input{accent-color:var(--gold);margin:0;}
.nl-tema:has(input:checked){border-color:var(--gold);background:rgba(234,193,44,.12);font-weight:600;}
.nl-tema:has(input:focus-visible){outline:2px solid var(--gold);outline-offset:2px;}
.nl-consent{display:flex;align-items:flex-start;justify-content:center;gap:9px;font-size:.82rem;line-height:1.5;color:var(--muted);cursor:pointer;}
.nl-consent input{accent-color:var(--gold);margin:2px 0 0;flex:none;}
.nl-consent a{color:var(--ink);text-decoration:underline;}
.nl-form .btn{align-self:center;margin-top:6px;}
.nl-msg{margin:0;padding:0;font-size:.9rem;line-height:1.5;}
.nl-msg:empty{display:none;}
.nl-msg.ok{background:var(--green-soft);color:var(--green);border-radius:12px;padding:14px 18px;margin-bottom:4px;}
.nl-msg.err{background:rgba(190,60,40,.09);color:#9c3a26;border-radius:10px;padding:11px 16px;margin-bottom:14px;font-size:.86rem;}
.nl-submit{position:relative;display:inline-flex;align-items:center;gap:9px;}
.nl-submit[disabled]{cursor:progress;opacity:.75;}
.nl-spinner{display:none;width:14px;height:14px;border:2px solid currentColor;border-top-color:transparent;border-radius:50%;animation:nl-gira .6s linear infinite;}
.nl-submit.enviando .nl-spinner{display:block;}
@keyframes nl-gira{to{transform:rotate(360deg);}}
@media (prefers-reduced-motion:reduce){.nl-spinner{animation-duration:1.6s;}}
.nl-note{font-size:.78rem;color:var(--muted);margin:14px auto 0;max-width:660px;text-align:center;}

/* ── Blog: grid de tarjetas ── */
.post-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:26px 22px;margin:26px 0 60px;}
/* Tarjeta: caja sobria de esquinas rectas con etiqueta de categoría */
.card{background:var(--card);border:1px solid var(--line);border-radius:4px;overflow:hidden;
  display:flex;flex-direction:column;transition:border-color .2s,transform .2s;}
.card:hover{border-color:var(--gold);transform:translateY(-2px);}
.card .card-img{display:block;overflow:hidden;background:var(--green-soft);}
.card .card-img img{aspect-ratio:16/10;object-fit:cover;width:100%;transition:transform .45s ease;}
.card:hover .card-img img{transform:scale(1.03);}
.card .card-cat{display:inline-block;align-self:flex-start;margin:14px 16px 0;font-family:var(--mono);font-size:.6rem;
  letter-spacing:.16em;text-transform:uppercase;color:var(--gold-deep);}
.card .card-cat:hover{color:var(--ink);text-decoration:none;}
.card h2,.card h3{font-size:.98rem;margin:7px 0 0;padding:0 16px;line-height:1.32;}
.card h2 a,.card h3 a{color:var(--ink);}
.card h2 a:hover,.card h3 a:hover{color:var(--gold-deep);text-decoration:none;}
.card p{color:var(--muted);font-size:.83rem;margin:8px 0 0;padding:0 16px 18px;line-height:1.55;}

/* ── Artículo ── */
.post{max-width:780px;margin:0 auto;padding:40px 0 70px;}
.breadcrumb{font-family:var(--mono);font-size:.74rem;color:var(--muted);letter-spacing:.03em;margin-bottom:20px;}
@media(max-width:760px){.breadcrumb{display:none;}
  .page-landing > .wrap{padding-top:30px;}
  .cat-head{padding-top:30px;}
  .post.wrap{padding-top:30px;}}
.breadcrumb a{color:var(--gold-deep);}
.breadcrumb .sep{margin:0 8px;opacity:.5;}
.post-header h1{font-size:clamp(1.9rem,4.2vw,2.8rem);margin:8px 0 12px;}
.post-meta{font-family:var(--mono);font-size:.74rem;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;}
.post-cover{border-radius:var(--radius);margin:26px 0;}

/* ── Prosa ── */
.prose{font-size:1.09rem;}
.prose p{margin:0 0 1.15em;}
.prose h2{font-size:1.6rem;margin:1.6em 0 .45em;}
.prose h3{font-size:1.28rem;margin:1.4em 0 .35em;}
.prose img{border-radius:var(--radius);margin:1.4em 0;}
.prose ul,.prose ol{padding-left:1.3em;margin:0 0 1.15em;}
.prose blockquote{border-left:3px solid var(--gold);margin:1.4em 0;padding:.2em 0 .2em 1.2em;color:var(--muted);font-style:italic;font-family:var(--serif);}
.prose a{text-decoration:underline;}

/* ── Paginación ── */
.pagination{display:flex;gap:20px;align-items:center;justify-content:center;margin:0 0 60px;font-family:var(--mono);font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;}

/* ── Footer ── */
.site-footer{background:var(--green);color:#cfd6c4;padding:60px 0 36px;margin-top:40px;}
.site-footer .cols{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr 1fr;gap:30px;}
.site-footer h4 a{color:inherit;}
.site-footer h4 a:hover{color:var(--gold);text-decoration:none;}
@media(max-width:760px){
  .site-footer .cols{grid-template-columns:1fr 1fr;gap:30px 20px;}
  /* Con cinco bloques en dos columnas la marca quedaba encajonada a media
     anchura y el último bloque suelto. La marca cruza entera y debajo 2x2. */
  .site-footer .cols > div:first-child{grid-column:1 / -1;}
}
.site-footer .brand{margin-bottom:12px;}
/* La frase arranca donde arranca el nombre, no donde arranca la luciérnaga:
   46px del logo + 13px de separación. */
.site-footer .cols > div:first-child > p{margin-left:calc(46px + 13px);}
/* El claim, en el mismo dorado que «Tu médico mentor» del lockup. */
.site-footer .claim{color:var(--gold);}
@media(max-width:760px){.site-footer .cols > div:first-child > p{margin-left:calc(42px + 13px);max-width:34ch;}
  .site-footer{padding:46px 0 30px;}
  .site-footer .base{flex-direction:column;align-items:flex-start;gap:10px;}}
.site-footer .lockup .nm{color:#f2ece0;font-size:.92rem;}
.site-footer .lockup .tg{color:var(--gold);font-size:.62rem;}
.site-footer .brand img{width:42px;}
.site-footer p{color:#aeb8a0;font-size:.9rem;max-width:32ch;margin:0;}
.site-footer h4{font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);font-weight:400;margin:0 0 13px;}
.site-footer ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:9px;}
.site-footer a{color:#cfd6c4;font-size:.9rem;}
.site-footer a:hover{color:var(--gold);}
.site-footer .base{border-top:1px solid #46543a;margin-top:36px;padding-top:20px;font-family:var(--mono);font-size:.7rem;letter-spacing:.05em;color:#93a184;display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;}

/* 404 */
.page-404{text-align:center;padding:70px 0;}


/* ═══ Páginas landing (consulta, libro…) — mismo lenguaje que la home ═══ */
.page-landing .breadcrumb{padding-top:22px;}
.page-landing .page-head{margin:10px 0 26px;}

.lp-hero{padding:26px 0 56px;}
.lp-hero .grid{display:grid;grid-template-columns:1.15fr .85fr;gap:52px;align-items:center;}
@media(max-width:820px){.lp-hero .grid{grid-template-columns:1fr;gap:28px;}}
.lp-hero h1{font-size:clamp(1.8rem,3.6vw,2.6rem);margin:14px 0 0;}
.lp-hero .lp-tagline{font-family:var(--serif);font-style:italic;font-size:1.2rem;color:var(--gold-deep);margin:14px 0 0;}
.lp-hero .lead{margin:16px 0 0;}
.lp-hero .visual img{width:100%;border-radius:18px;display:block;}
.book-cover img{width:100%;max-width:330px;margin:0 auto;border-radius:10px;box-shadow:0 26px 50px -26px rgba(43,41,38,.6);}

.lp-sec{padding:64px 0;}
.lp-sec.alt{background:var(--card);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.lp-sec h2{font-size:clamp(1.35rem,2.5vw,1.85rem);margin:0 0 14px;}
.lp-sec .lead{color:var(--muted);font-size:1.08rem;max-width:62ch;margin:0 0 8px;}
.lp-sec .grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start;}
@media(max-width:820px){.lp-sec .grid{grid-template-columns:1fr;gap:24px;}}
.lp-final{text-align:center;}
.lp-final .lp-cta,.lp-final .num-grid{justify-content:center;}
.lp-final .lead{margin-left:auto;margin-right:auto;}

.lp-tagline{font-family:var(--serif);font-style:italic;color:var(--gold-deep);}
.stars{font-family:var(--mono);font-size:.78rem;letter-spacing:.06em;color:var(--muted);margin:14px 0 0;}
.stars span{color:var(--gold);letter-spacing:.1em;margin-right:8px;font-size:1rem;}

.num-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:38px;margin:76px 0 0;}
/* En las secciones de columnas numeradas, el título va centrado y con aire */
.lp-sec:has(.num-grid) h2{text-align:center;max-width:none;text-wrap:nowrap;white-space:nowrap;}
@media(max-width:760px){.lp-sec:has(.num-grid) h2{white-space:normal;text-wrap:balance;}}
/* Los dos propósitos del cierre: mismo guion dorado que el resto de bloques
   de la página, y sin los 76px de hueco que arrastraba la retícula de tres. */
.num-grid.two{grid-template-columns:repeat(2,1fr);gap:56px;max-width:820px;margin:44px auto 0;}
.num-grid.two .num-card::before{content:"";display:block;width:32px;height:2px;background:var(--gold);margin-bottom:18px;}
.num-grid.two .num-card p{line-height:1.75;}
.num-grid.four{grid-template-columns:repeat(2,1fr);max-width:960px;margin-left:auto;margin-right:auto;}
@media(max-width:760px){.num-grid,.num-grid.two,.num-grid.four{grid-template-columns:1fr;}}
.num-card{background:none;border:0;border-radius:0;padding:0;text-align:left;}
.num-card .n{font-family:var(--mono);font-size:1.15rem;font-weight:600;letter-spacing:.14em;color:var(--gold-deep);display:block;}
.num-card h3{font-size:1.04rem;margin:12px 0 8px;line-height:1.25;}
.num-card p{color:var(--muted);font-size:.93rem;margin:0;line-height:1.6;}

.check-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:13px;}
.check-list li{position:relative;padding-left:34px;color:var(--muted);}
.check-list li::before{content:"";position:absolute;left:0;top:.4em;width:16px;height:9px;border-left:2.5px solid var(--gold-deep);border-bottom:2.5px solid var(--gold-deep);transform:rotate(-45deg);}

/* Preguntas del libro y beneficios: misma retícula. El filete dorado va como
   un guion corto sobre el titular y no como una barra de altura completa —
   cuatro barras verticales enjaulaban el bloque y lo hacían pesado. */
.qa,.benefit-list{display:grid;grid-template-columns:1fr 1fr;gap:54px 60px;margin-top:42px;}
@media(max-width:820px){.qa,.benefit-list{grid-template-columns:1fr;gap:40px;}}
.qa article,.benefit-list article{border-left:0;padding-left:0;}
.qa article::before,.benefit-list article::before{content:"";display:block;width:32px;height:2px;background:var(--gold);margin-bottom:18px;}
.qa h3,.benefit-list h3{font-size:1.06rem;margin:0 0 10px;color:var(--ink);}
.qa p,.benefit-list p{color:var(--muted);font-size:.96rem;line-height:1.75;margin:0;}


.chips{list-style:none;padding:0;margin:18px 0;display:flex;flex-wrap:wrap;gap:9px;}
.chips li{font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;padding:8px 15px;border-radius:999px;background:rgba(255,255,255,.1);border:1px solid rgba(241,236,221,.28);color:#f1ecdd;}

.quotes{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:26px;}
@media(max-width:820px){.quotes{grid-template-columns:1fr;}}
.quotes figure{margin:0;background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:22px 24px;}
.quotes blockquote{margin:0;font-family:var(--serif);font-style:italic;font-size:1rem;color:var(--ink);line-height:1.55;}
.quotes figcaption{margin-top:12px;font-family:var(--mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-deep);}

/* ── Carrusel de opiniones ──────────────────────────────────────────────────
   Sin JavaScript sigue siendo una fila de citas que se arrastra con el dedo:
   el scroll-snap ya hace el trabajo. El script solo añade flechas y puntos. */
.quotes.carrusel{display:flex;gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;
  scroll-padding:0;margin-top:30px;padding:4px;
  scrollbar-width:none;-ms-overflow-style:none;}
.quotes.carrusel::-webkit-scrollbar{display:none;}
.quotes.carrusel:focus-visible{outline:2px solid var(--gold);outline-offset:4px;border-radius:18px;}
.quotes.carrusel figure{flex:0 0 calc(50% - 11px);scroll-snap-align:start;
  display:flex;flex-direction:column;justify-content:space-between;}
@media(max-width:820px){.quotes.carrusel figure{flex:0 0 100%;}}
.quotes.carrusel figcaption span{display:block;margin-top:5px;letter-spacing:.1em;
  color:var(--muted);font-size:.62rem;}

.carrusel-mandos{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:24px;}
.carrusel-flecha{width:38px;height:38px;border-radius:999px;border:1px solid var(--line);
  background:var(--card);color:var(--muted);font-size:1.25rem;line-height:1;cursor:pointer;
  transition:border-color .15s,color .15s;}
.carrusel-flecha:hover{border-color:var(--gold);color:var(--ink);}
.carrusel-flecha:focus-visible{outline:2px solid var(--gold);outline-offset:2px;}
.carrusel-puntos{display:flex;gap:8px;}
.carrusel-puntos button{width:8px;height:8px;padding:0;border:0;border-radius:999px;
  background:var(--line);cursor:pointer;transition:background .2s,transform .2s;}
.carrusel-puntos button[aria-current="true"]{background:var(--gold);transform:scale(1.3);}
.carrusel-puntos button:focus-visible{outline:2px solid var(--gold);outline-offset:3px;}

.band-green .visual-side img{width:100%;border-radius:18px;display:block;}
.band-green .addr{font-family:var(--mono);font-size:.82rem;letter-spacing:.03em;color:var(--gold-soft);margin-top:14px;}
.band-green .horas{list-style:none;padding:0;margin:20px 0 0;font-family:var(--mono);font-size:.84rem;letter-spacing:.02em;color:var(--gold-soft);}
.band-green .horas li{margin-bottom:7px;}
.band-green .horas b{color:#fbf6ea;font-weight:600;}
.band-green a{color:var(--gold-soft);}
.note-sm{font-size:.92rem;color:var(--muted);}
.lp-cta{display:flex;gap:12px;flex-wrap:wrap;margin:24px 0 0;}
.lp-close{font-family:var(--serif);font-style:italic;font-size:1.24rem;margin:48px 0 0;color:var(--ink);}
/* La frase de cierre y su botón iban demasiado juntos: parecían una sola pieza. */
.lp-close + .lp-cta{margin-top:34px;}

/* El puente del «sobre mí» hacia la Escuela: cierra el relato y no compite
   con el cuerpo del texto. */
.sm-puente{margin-top:32px;padding:22px 26px;background:var(--green-soft);border-radius:14px;color:var(--ink);}
.sm-puente p{margin:0;font-family:var(--serif);font-style:italic;font-size:1.05rem;}
.sm-puente .pregunta{font-weight:600;font-size:1.14rem;margin-bottom:6px;}
.sm-puente a{font-style:normal;font-weight:600;color:#8f6f06;border-bottom:2px solid var(--gold);}
.sm-puente a:hover{color:var(--ink);text-decoration:none;}
.stars .half{background:linear-gradient(90deg,var(--gold) 50%,var(--line) 50%);-webkit-background-clip:text;background-clip:text;color:transparent;}

/* ═══ Blog: rejilla + barra lateral con filtro por categorías ═══ */
.blog-layout{display:grid;grid-template-columns:1fr 250px;gap:52px;align-items:start;}
@media(max-width:900px){.blog-layout{grid-template-columns:1fr;gap:30px;}
  .blog-layout .blog-side{order:-1;}}
.blog-main .post-grid{grid-template-columns:repeat(3,1fr);margin-top:0;}
@media(max-width:1100px){.blog-main .post-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:560px){.blog-main .post-grid{grid-template-columns:1fr;}}

.blog-side{position:sticky;top:100px;}
@media(max-width:900px){.blog-side{position:static;}}
.side-title{font-family:var(--mono);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin:0 0 14px;}
.cat-chips{display:flex;flex-wrap:wrap;gap:8px;}
.chip{display:inline-flex;align-items:baseline;gap:7px;white-space:nowrap;font-family:var(--mono);font-size:.68rem;letter-spacing:.09em;text-transform:uppercase;
  padding:8px 13px;border:1px solid var(--line);border-radius:8px;background:var(--card);color:var(--muted);transition:border-color .15s,color .15s;}
.chip:hover{border-color:var(--gold);color:var(--ink);text-decoration:none;}
.chip .n{font-size:.62rem;opacity:.55;}
.chip.active{background:var(--ink);border-color:var(--ink);color:var(--paper);}
.chip.active .n{opacity:.7;}

/* Cabecera de categoría: ruta + título contenido */
.cat-head{margin:26px 0 34px;}
.cat-head .breadcrumb{margin-bottom:14px;text-transform:lowercase;}
.cat-head .breadcrumb .sep{margin:0 7px;opacity:.45;}
.cat-head h1{font-size:clamp(1.7rem,3.2vw,2.3rem);}
.cat-count{font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-deep);margin:10px 0 0;}
.cat-head .lead{margin:14px 0 0;max-width:60ch;}
/* Filtro lateral: áreas destacadas y temas */
.cat-chips.areas .chip{background:var(--green-soft);border-color:transparent;color:var(--green);font-weight:600;}
.cat-chips.areas .chip:hover{border-color:var(--green);}
.cat-chips.areas .chip.active{background:var(--green);border-color:var(--green);color:#f1ecdd;}
.side-title.sep{margin-top:26px;padding-top:20px;border-top:1px solid var(--line);}

/* ═══ Consentimiento de cookies ═══
   Mismas piezas y medidas que en la Escuela de Salud y Lou.art; los colores van
   con los tokens de esta web para que no parezca un injerto. */
.cookie-banner,.cookie-modal{font-family:var(--mono);color:var(--ink);z-index:9999;}
.cookie-banner{position:fixed;left:16px;right:16px;bottom:16px;max-width:760px;margin:0 auto;
  background:var(--card);border:1px solid var(--line);border-radius:8px;padding:16px;
  box-shadow:0 10px 30px rgba(43,41,38,.16);display:none;}
.cookie-banner h3{font-family:var(--serif);margin:0 0 8px;font-size:1rem;}
.cookie-banner p{margin:0 0 12px;font-size:.78rem;line-height:1.5;color:var(--muted);}
.cookie-banner a{color:var(--gold-deep);text-decoration:underline;}
.cookie-actions{display:flex;gap:8px;flex-wrap:wrap;}
.cookie-btn{border:1px solid var(--line);background:var(--paper);color:var(--ink);border-radius:8px;
  padding:9px 13px;font-family:var(--mono);font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;
  cursor:pointer;width:auto;flex:0 0 auto;transition:border-color .15s,background .15s;}
.cookie-btn:hover{border-color:var(--ink);}
.cookie-btn.primary{background:var(--ink);color:var(--paper);border-color:var(--ink);}
.cookie-btn.primary:hover{background:var(--green);border-color:var(--green);}
.cookie-manage{position:fixed;right:16px;bottom:16px;z-index:9998;border:1px solid var(--line);
  background:color-mix(in srgb,var(--card) 70%,transparent);backdrop-filter:blur(3px);color:var(--muted);
  border-radius:8px;font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;
  padding:9px 12px;cursor:pointer;display:none;width:auto;}
.cookie-manage:hover{background:var(--card);color:var(--ink);}
.cookie-modal{position:fixed;inset:0;background:rgba(43,41,38,.42);display:none;align-items:center;
  justify-content:center;padding:16px;}
.cookie-modal-card{width:min(520px,100%);background:var(--card);border:1px solid var(--line);
  border-radius:10px;padding:22px;}
.cookie-modal-card h3{font-family:var(--serif);margin:0 0 16px;font-size:1.1rem;}
.cookie-row{display:flex;align-items:center;gap:12px;margin-bottom:12px;font-size:.82rem;color:var(--muted);}
.cookie-row input[type=checkbox]{width:17px;height:17px;flex:0 0 auto;accent-color:var(--gold-deep);}

/* ═══ Páginas legales ═══ */
.legal{max-width:820px;}
.legal h1{font-size:clamp(1.6rem,3vw,2.1rem);margin:12px 0 0;}
.legal .lead{margin:16px 0 0;}
.legal h2{font-size:1.2rem;margin:2em 0 .5em;}
.legal h3{font-size:1.02rem;margin:1.6em 0 .4em;}
.legal p{margin:0 0 1em;color:var(--muted);}
.legal a{text-decoration:underline;}
.legal-datos{list-style:none;padding:0;margin:18px 0 24px;border-top:1px solid var(--line);}
.legal-datos li{display:flex;gap:18px;padding:10px 0;border-bottom:1px solid var(--line);font-size:.94rem;}
.legal-datos li b{flex:0 0 170px;color:var(--ink);}
.legal-datos li span{color:var(--muted);}
@media(max-width:560px){.legal-datos li{flex-direction:column;gap:3px;} .legal-datos li b{flex:none;}}
.legal-lista{margin:0 0 1.2em;padding-left:1.2em;color:var(--muted);}
.legal-lista li{margin-bottom:.6em;}
.legal-lista b{color:var(--ink);}
.tabla-scroll{overflow-x:auto;margin:16px 0 24px;}
.legal-tabla{width:100%;border-collapse:collapse;font-size:.88rem;min-width:560px;}
.legal-tabla th,.legal-tabla td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top;color:var(--muted);}
.legal-tabla th{background:var(--card);color:var(--ink);font-family:var(--mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;}
.legal-tabla code{font-family:var(--mono);font-size:.85em;background:var(--card);padding:2px 6px;border-radius:4px;color:var(--ink);}
.legal-fecha{margin-top:32px;font-family:var(--mono);font-size:.72rem;letter-spacing:.06em;color:var(--muted);}
.site-footer .legal-links{display:flex;gap:18px;}

/* ── Banner de curso al final del artículo ───────────────────────────────── */
.banner-curso{margin:56px 0 8px;border:1.5px solid var(--gold);border-radius:16px;
  background:linear-gradient(180deg,rgba(234,193,44,.07),rgba(234,193,44,.02));
  padding:34px 36px;display:grid;gap:26px;}
.banner-curso:has(.bc-img){grid-template-columns:minmax(0,220px) 1fr;align-items:center;}
.bc-img{width:100%;height:auto;border-radius:12px;}
.bc-cuerpo{display:flex;flex-direction:column;gap:12px;}
.bc-eyebrow{margin:0;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gold-deep,#a8871a);font-weight:600;}
.bc-titulo{margin:0;font-size:clamp(1.15rem,2.4vw,1.5rem);line-height:1.25;text-wrap:balance;}
.bc-texto{margin:0;color:var(--muted);line-height:1.6;font-size:.95rem;}
.bc-cta{align-self:flex-start;margin-top:6px;display:inline-block;background:var(--gold);
  color:#1b1913;font-weight:600;font-size:.85rem;letter-spacing:.08em;text-transform:uppercase;
  padding:14px 26px;border-radius:999px;text-decoration:none;transition:transform .12s,filter .12s;}
.bc-cta:hover{filter:brightness(1.06);transform:translateY(-1px);}
.bc-cta:focus-visible{outline:2px solid var(--ink);outline-offset:3px;}
@media (max-width:720px){
  .banner-curso{padding:26px 22px;}
  .banner-curso:has(.bc-img){grid-template-columns:1fr;}
  .bc-cta{align-self:stretch;text-align:center;}
}
@media (prefers-reduced-motion:reduce){.bc-cta{transition:none;}}
.bc-prueba{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin:2px 0 0;
  font-size:.85rem;color:var(--muted);}
.bc-prueba b{color:var(--ink);font-weight:650;}
.bc-estrellas{display:inline-flex;gap:1px;line-height:1;}
.bc-estrellas .e{color:#dcd6c4;font-size:1rem;}
.bc-estrellas .e.llena{color:var(--gold);}
.bc-estrellas .e.media{background:linear-gradient(90deg,var(--gold) 50%,#dcd6c4 50%);
  -webkit-background-clip:text;background-clip:text;color:transparent;}
.bc-sep{opacity:.5;}

/* ── Sobre mí ────────────────────────────────────────────────────────────── */
.sm-hero .lp-tagline{margin-top:22px;font-style:italic;color:var(--green);font-size:1.02rem;}
/* La foto del hero, un 18% más pequeña y pegada al texto (mismo criterio que
   el retrato de la home): el hueco sobrante se reparte a los dos lados. */
.sm-hero .visual-side img{width:100%;border-radius:18px;display:block;}
.sm-hero .visual-side{max-width:82%;margin:0 auto;}
@media(max-width:820px){.sm-hero .visual-side{max-width:100%;}}
.sm-historia{max-width:680px;margin-inline:auto;}
.sm-centrado{text-align:center;margin-bottom:34px;}
.sm-ayudas{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;}
.sm-ayuda{border:1px solid var(--line);border-radius:14px;background:var(--card);padding:26px 24px;
  display:flex;flex-direction:column;gap:12px;}
.sm-ayuda h3{margin:0;font-size:1.02rem;}
.sm-ayuda p{margin:0;color:var(--muted);font-size:.92rem;line-height:1.6;flex:1;}
.sm-ayuda .btn{align-self:flex-start;}
.sm-formacion{max-width:640px;margin:0 auto;display:flex;flex-direction:column;gap:0;}
.sm-formacion > div{display:grid;grid-template-columns:1fr 1.4fr;gap:18px;padding:15px 4px;
  border-bottom:1px solid var(--line);}
.sm-formacion > div:last-child{border-bottom:0;}
.sm-formacion dt{font-size:.85rem;color:var(--muted);}
.sm-formacion dd{margin:0;font-weight:600;font-size:.94rem;}
.sm-publicaciones{max-width:640px;margin:0 auto;padding:0;list-style:none;
  display:flex;flex-direction:column;}
.sm-publicaciones li{border-bottom:1px solid var(--line);}
.sm-publicaciones li:last-child{border-bottom:0;}
.sm-publicaciones a{display:block;padding:14px 4px;color:var(--ink);text-decoration:none;}
.sm-publicaciones a:hover{color:var(--gold-deep,#a8871a);}
.sm-redes{text-align:center;}
.sm-redes p{display:flex;gap:14px;justify-content:center;margin-top:18px;flex-wrap:wrap;}
.sm-redes a{border:1.4px solid var(--line);border-radius:999px;padding:10px 22px;
  text-decoration:none;color:var(--ink);font-size:.9rem;}
.sm-redes a:hover{border-color:var(--gold);}
@media (max-width:720px){.sm-formacion > div{grid-template-columns:1fr;gap:2px;}}
.sm-medio{display:block;font-size:.78rem;color:var(--muted);margin-top:2px;}

/* Fotografías reales de las áreas: sin marco, la imagen habla sola. */
.visual.foto figure{margin:0;}
.visual.foto figcaption{margin-top:12px;text-align:center;font-family:var(--serif);font-style:italic;font-size:.95rem;color:var(--muted);}
.visual.foto img{width:100%;height:auto;border-radius:14px;display:block;
  box-shadow:0 14px 40px rgba(27,25,19,.13);}


/* ── Logos de empresas e instituciones ───────────────────────────────────────
   Mismo tratamiento que el funnel del CRM, que es el que se ve bien: rejilla
   con caja de tamaño fijo y object-fit, para que logos de proporciones muy
   distintas queden ópticamente alineados. A color (en gris se leían pobres) y
   con mix-blend-mode para que los que traen fondo blanco se fundan con el papel. */
.logos{display:grid;justify-items:center;align-items:center;margin:36px auto 0;
  --box-w:128px;--box-h:48px;grid-template-columns:repeat(5,1fr);max-width:880px;gap:38px 28px;}
/* --k: factor de ajuste óptico por logo (lo lleva cada <img> en su style).
   Sin él, un logo muy alargado y otro casi cuadrado ocupan la misma caja pero
   se ven de tamaños muy distintos. Los valores son los del funnel del CRM. */
.logos img{width:calc(var(--box-w)*var(--k,1));height:calc(var(--box-h)*var(--k,1));
  max-width:100%;object-fit:contain;object-position:center;mix-blend-mode:multiply;}
@media (max-width:860px){.logos{grid-template-columns:repeat(4,1fr);max-width:660px;}}
@media (max-width:520px){.logos{grid-template-columns:repeat(2,1fr);max-width:330px;gap:28px 20px;}}

/* ── /empresa-saludable ─────────────────────────────────────────────────────
   Piezas que no tenía ninguna otra landing: las cifras bajo el hero, los
   sellos en fila y la rejilla de portadas de las microlecciones. */
.es-cifras{margin:18px 0 0;font-family:var(--mono);font-size:.82rem;letter-spacing:.04em;color:var(--muted);}
.es-cifras b{color:var(--gold-deep);font-weight:600;}
/* Con .lp-sec .lead delante para ganarle en especificidad: si no, su margin
   izquierdo anula el centrado de la caja y el texto queda descolgado del H2. */
.lp-sec .lead.es-intro{max-width:62ch;margin:0 auto 8px;}
.es-sellos{list-style:none;padding:0;margin:26px auto 0;display:flex;flex-wrap:wrap;justify-content:center;gap:10px 12px;max-width:860px;}
.es-sellos li{font-family:var(--mono);font-size:.74rem;letter-spacing:.08em;text-transform:uppercase;padding:9px 15px;border:1px solid var(--line);border-radius:999px;background:var(--card);color:var(--ink);}
.es-sellos-grande{margin-top:44px;}
.es-ruta{font-family:var(--mono);font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-deep);margin:46px 0 18px;font-weight:600;}
.es-lecciones{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;}
@media(max-width:900px){.es-lecciones{grid-template-columns:repeat(2,1fr);}}
.es-lecciones figure{margin:0;}
.es-lecciones img{width:100%;height:auto;border-radius:12px;box-shadow:0 16px 34px -22px rgba(43,41,38,.5);}
.es-lecciones figcaption{margin-top:12px;font-size:.92rem;line-height:1.4;color:var(--ink);display:flex;gap:9px;align-items:baseline;}
.es-lecciones figcaption span{font-family:var(--mono);font-size:.74rem;color:var(--gold-deep);flex:none;}
