/*
 * Diseño de la web: copia fiel de la maqueta aprobada (versión 129, 06/10/2026).
 * Los ajustes propios de WordPress están en tema.css.
 */
:root{
  color-scheme: light;
  --cream:#F7F2E7; --cream-2:#EFE6D5;
  --wine:#8A1F4B; --wine-deep:#5E1233; --rose:#D47C8E; --rose-soft:#F4DFE2;
  --sage:#A8B48A; --olive:#5E6841; --sand:#CBB8A4;
  --ink:#221E1A; --ink-soft:#5F5750; --ink-faint:#6F675B;
  --line:#DFD5C2; --line-strong:#C7BAA3;
  --display:"Newsreader",Georgia,"Times New Roman",serif;
  --body:"Karla","Helvetica Neue",Arial,sans-serif;
  --wrap:1240px; --pad:clamp(1.15rem,5vw,4rem);
  --air:clamp(4.5rem,10vw,9rem);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0; background:var(--cream); color:var(--ink); font-family:var(--body);
  font-size:1.06rem; font-weight:400; line-height:1.75; -webkit-font-smoothing:antialiased; overflow-x:hidden}
h1,h2,h3,h4{font-family:var(--display); font-weight:300; line-height:1.02; letter-spacing:-.02em; text-wrap:balance; margin:0}
em{font-style:italic}
p{margin:0}
a{color:inherit}
img{display:block; width:100%; height:100%; object-fit:cover}
.wrap{max-width:var(--wrap); margin:0 auto; padding-inline:var(--pad)}
:focus-visible{outline:2px solid var(--wine); outline-offset:4px}

.eyebrow{display:inline-flex; align-items:center; gap:.85rem; font-family:var(--body); font-size:.72rem;
  letter-spacing:.28em; text-transform:uppercase; font-weight:700; color:var(--wine); margin:0 0 1.6rem}
.eyebrow::before{content:""; width:2.4rem; height:1px; background:currentColor; opacity:.55}

.btn{display:inline-flex; align-items:center; gap:.7rem; font-family:var(--body); font-size:.74rem; font-weight:700; letter-spacing:.18em;
  text-transform:uppercase; padding:1.15rem 2.3rem; text-decoration:none; border:1px solid var(--wine); border-radius:2px;
  transition:background .3s ease,color .3s ease,border-color .3s ease, transform .35s cubic-bezier(.2,.8,.3,1), box-shadow .35s ease; cursor:pointer}
.btn::after{content:"\2192"; font-weight:400; transition:transform .35s cubic-bezier(.2,.8,.3,1)}
.btn:hover::after{transform:translateX(4px)}
.btn-solid{background:var(--wine); color:var(--cream)}
.btn-solid:hover{background:var(--wine-deep); border-color:var(--wine-deep); transform:translateY(-2px); box-shadow:0 16px 30px -18px rgba(94,18,51,.6)}
.btn-line{background:transparent; color:var(--wine)}
.btn-line:hover{background:var(--wine); color:var(--cream); transform:translateY(-2px); box-shadow:0 14px 26px -18px rgba(138,31,75,.4)}
.btn-pale{border-color:rgba(247,242,231,.6); color:var(--cream); background:transparent}
.btn-pale:hover{background:var(--cream); color:var(--wine); border-color:var(--cream); transform:translateY(-2px); box-shadow:0 16px 30px -18px rgba(0,0,0,.35)}

/* reveal */
.rv{opacity:0; transform:translateY(26px); transition:opacity 1s cubic-bezier(.2,.7,.3,1), transform 1s cubic-bezier(.2,.7,.3,1)}
.rv.on{opacity:1; transform:none}
.rv.d1{transition-delay:.1s} .rv.d2{transition-delay:.22s} .rv.d3{transition-delay:.34s} .rv.d4{transition-delay:.46s}
@media (prefers-reduced-motion:reduce){.rv{opacity:1; transform:none; transition:none}}

/* big section numeral + kicker */
.marker{display:flex; align-items:baseline; gap:1.4rem; margin-bottom:clamp(1.8rem,4vw,3rem)}
.marker .num{font-family:var(--display); font-weight:200; font-size:clamp(3.4rem,9vw,7rem); line-height:.8;
  color:var(--wine); opacity:.16; letter-spacing:-.04em}
.marker .k{font-family:var(--body); font-size:.72rem; letter-spacing:.28em; text-transform:uppercase; font-weight:700; color:var(--wine); padding-bottom:.6rem}

/* header */
.site-head{position:sticky; top:0; z-index:40; background:rgba(247,242,231,.82);
  backdrop-filter:blur(14px) saturate(1.2); -webkit-backdrop-filter:blur(14px) saturate(1.2);
  border-bottom:1px solid transparent; transition:background .35s ease, box-shadow .35s ease, border-color .35s ease}
.site-head.is-scrolled{background:rgba(247,242,231,.94); border-bottom-color:var(--line); box-shadow:0 12px 30px -24px rgba(34,30,26,.5)}
.head-in{display:flex; align-items:center; gap:2rem; min-height:84px; transition:min-height .35s ease}
.site-head.is-scrolled .head-in{min-height:64px}
.brand{display:flex; align-items:center; gap:.85rem; font-family:var(--display); font-weight:300; font-size:1.5rem; letter-spacing:-.02em;
  text-decoration:none; line-height:1; color:var(--ink)}
.brand-mark{width:auto; height:46px; display:block; object-fit:contain; transition:height .35s ease}
.site-head.is-scrolled .brand-mark{height:38px}
.brand{transition:opacity .25s ease}
.brand:hover{opacity:.66}
.brand-txt{display:block; white-space:nowrap}
.brand small{display:block; font-family:var(--body); font-size:.52rem; letter-spacing:.32em;
  text-transform:uppercase; color:var(--ink-faint); margin-top:.4rem; font-weight:600}
@media (max-width:520px){.brand-mark{height:40px}}
.site-nav{margin-left:auto; display:flex; gap:2.1rem; align-items:center}
.site-nav a:not(.btn){font-size:.71rem; letter-spacing:.16em; text-transform:uppercase; text-decoration:none;
  color:var(--ink-soft); padding-block:.3rem; border-bottom:1px solid transparent; transition:color .25s, border-color .25s}
.site-nav a:not(.btn):hover{color:var(--wine); border-bottom-color:var(--wine)}
.site-nav .btn{padding:.8rem 1.6rem}
@media (max-width:600px){.site-nav .btn{display:none}}
.nav-toggle{display:none}
@media (max-width:940px){
  .site-nav a:not(.btn){display:none}
}

/* ============ HERO — asimétrico, tipografía enorme ============ */
.hero{position:relative; padding-block:clamp(3rem,7vw,6rem) 0; overflow:hidden}
.hero-in{display:grid; grid-template-columns:1.08fr .92fr; gap:clamp(2rem,5vw,4.5rem); align-items:start}
.hero h1{font-size:clamp(2.9rem,6vw,5.1rem); font-weight:300; letter-spacing:-.03em; line-height:1.03}
.hero h1 em{font-style:normal; color:var(--wine); font-weight:300}
.hero h1 .u{position:relative; white-space:nowrap}
.hero h1 .u svg{position:absolute; left:-.02em; bottom:-.1em; width:104%; height:.32em; overflow:visible}
.hero h1 .u path{stroke:var(--rose); stroke-width:6; fill:none; stroke-linecap:round;
  stroke-dasharray:1; stroke-dashoffset:1; transition:stroke-dashoffset 1.3s cubic-bezier(.3,.8,.3,1) .55s}
.hero h1 .u.on path{stroke-dashoffset:0}
.hero-lead{margin-top:clamp(2.8rem,5vw,4rem); display:grid; gap:1rem; max-width:46ch}
.hero-lead p{color:var(--ink-soft); font-size:1.1rem}
.hero-strong{margin:clamp(2.8rem,5vw,4.2rem) 0 0; font-family:var(--display); font-style:italic; font-weight:400; font-size:clamp(1.2rem,2.2vw,1.55rem);
  color:var(--wine-deep); line-height:1.42; max-width:52ch; padding-left:1.4rem; border-left:2px solid var(--rose); text-align:left}
.hero-cta{margin-top:clamp(2.8rem,4.5vw,3.9rem); display:flex; align-items:center; gap:1.6rem; flex-wrap:wrap}
.hero-cred{font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-faint); line-height:1.7}
/* imagen con bloque de color desplazado detrás */
.hero-media{position:relative; justify-self:end; width:100%; max-width:460px; margin-top:.4rem}
.hero-media::before{content:""; position:absolute; inset:auto -1.5rem -1.5rem auto; width:74%; height:76%; background:var(--rose-soft); z-index:0; border-radius:18px; box-shadow:0 22px 44px -26px rgba(94,18,51,.30), inset 0 3px 8px rgba(255,255,255,.55), inset 0 -7px 15px rgba(94,18,51,.09)}
.hero-fig{position:relative; z-index:1; aspect-ratio:3/4; box-shadow:0 40px 70px -34px rgba(34,30,26,.4); border-radius:2px; overflow:hidden}
.hero-chip{position:absolute; z-index:2; left:-1.1rem; bottom:2.2rem; background:var(--wine); color:var(--cream);
  font-family:var(--body); font-size:.66rem; letter-spacing:.22em; text-transform:uppercase; font-weight:700;
  padding:.85rem 1.15rem; box-shadow:0 20px 34px -20px rgba(94,18,51,.7); border-radius:2px}
@media (max-width:900px){
  .hero-in{grid-template-columns:1fr; gap:2.6rem; align-items:start}
  .hero-media{order:-1; justify-self:start; max-width:340px; padding:0}
  .hero-fig{min-height:0; aspect-ratio:4/5}
  .hero-media::before{inset:auto -1rem -1rem auto}
}

/* ============ quote band rosa (bloque color 1) ============ */
.qband{margin-top:var(--air); background:var(--rose-soft); position:relative; overflow:hidden}
.qband-in{padding-block:clamp(3.6rem,8vw,6.5rem); text-align:center}
.qband blockquote{margin:0; font-family:var(--display); font-weight:300; font-style:italic;
  font-size:clamp(1.3rem,2.15vw,1.9rem); line-height:1.3; color:var(--wine-deep); max-width:none; margin-inline:auto; letter-spacing:-.005em}
.qband .q-mark{font-family:var(--display); font-size:clamp(3rem,7vw,5rem); color:var(--wine); opacity:.3; line-height:.5; display:block; margin-bottom:.4rem}

/* ============ editorial section ============ */
.ed{padding-block:var(--air)}
.ed-grid{display:grid; grid-template-columns:1.02fr .98fr; gap:clamp(2.4rem,6vw,5.5rem); align-items:center}
.ed h2{font-size:clamp(2.1rem,5.2vw,3.7rem); font-weight:300; letter-spacing:-.025em; line-height:1.02}
.ed h2 em{color:var(--wine); font-weight:300}
.ed-body{display:grid; gap:1.3rem; margin-top:1.8rem; max-width:52ch}
.ed-body p{color:var(--ink-soft); font-size:1.08rem}
.ed-media{position:relative}
.ed-media::before{content:""; position:absolute; inset:-1.5rem auto auto -1.5rem; width:66%; height:74%; background:var(--sand); z-index:0; border-radius:18px; box-shadow:0 22px 44px -26px rgba(34,30,26,.28), inset 0 3px 8px rgba(255,255,255,.5), inset 0 -7px 15px rgba(34,30,26,.10)}
.ed-media figure{position:relative; z-index:1; box-shadow:0 34px 60px -32px rgba(34,30,26,.35); border-radius:2px; overflow:hidden}
.ed-grid.flip .ed-media{order:-1}
.ed-grid.flip .ed-media::before{inset:auto -1.2rem -1.2rem auto}
@media (max-width:860px){.ed-grid{grid-template-columns:1fr; gap:2.4rem}.ed-grid.flip .ed-media{order:0}}

/* ============ area wine (bloque color 2) ============ */
.area{background:var(--wine); color:var(--cream); position:relative; overflow:hidden}
.area-grid{display:grid; grid-template-columns:.9fr 1.1fr; align-items:center}
.area figure{position:relative; overflow:hidden}
.area .txt{padding:clamp(3rem,7vw,6rem)}
.area .num{font-family:var(--display); font-weight:200; font-size:clamp(3rem,8vw,6rem); line-height:.8; color:var(--rose); opacity:.35; display:block; margin-bottom:1.4rem; letter-spacing:-.04em}
.area h2{font-size:clamp(2.1rem,5vw,3.6rem); font-weight:300; max-width:13ch; line-height:1.02}
.area h2 em{color:var(--rose); font-weight:300}
.area p{color:rgba(247,242,231,.86); margin-top:1.5rem; max-width:46ch; font-size:1.06rem}
.area .close{margin-top:2rem; font-family:var(--display); font-style:italic; font-weight:300; font-size:clamp(1.3rem,2.6vw,1.7rem); color:var(--rose)}
@media (max-width:860px){.area-grid{grid-template-columns:1fr}.area figure{order:-1}}

/* ============ sobre mi — retrato con tarjeta superpuesta ============ */
.about{padding-block:var(--air)}
.about-hero{display:grid; grid-template-columns:1fr 1fr; gap:0; align-items:center; position:relative}
.about-portrait{position:relative}
.about-portrait figure{position:relative; max-width:440px; box-shadow:0 40px 70px -34px rgba(34,30,26,.42); border-radius:2px; overflow:hidden}
.about-card{position:relative; z-index:2; background:var(--cream); border:1px solid var(--line); box-shadow:0 34px 60px -34px rgba(34,30,26,.3);
  padding:clamp(2rem,4vw,3.2rem); margin-left:-3.5rem; border-radius:2px}
.about-card .lead{font-family:var(--display); font-weight:300; font-size:clamp(1.4rem,2.6vw,1.9rem); color:var(--ink); line-height:1.32; max-width:24ch}
.about-card .cred{margin-top:1.6rem; font-size:.74rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-faint)}
@media (max-width:860px){
  .about-hero{grid-template-columns:1fr; gap:0}
  .about-portrait figure{max-width:300px}
  .about-card{margin-left:0; margin-top:-3rem; margin-right:clamp(0rem,4vw,2rem)}
}
.work-grid{margin-top:var(--air); display:grid; grid-template-columns:1.18fr .82fr; gap:clamp(2.4rem,6vw,4.5rem); align-items:start}
.work-blocks{display:grid; gap:clamp(2rem,5vw,2.8rem)}
.about-block{border-top:2px solid var(--line-strong); padding-top:1.7rem; transition:transform .3s ease}
.about-block:hover{transform:translateY(-3px)}
.about-block .micon{display:block; width:40px; height:40px; margin-bottom:1.1rem; color:var(--wine); transition:transform .4s cubic-bezier(.34,1.4,.5,1)}
.about-block:hover .micon{transform:translateY(-3px) rotate(-6deg)}
.about-block h3{font-size:1.55rem; font-weight:300; color:var(--wine-deep); margin-bottom:1rem}
.about-block p{color:var(--ink-soft); max-width:48ch}
.about-block p + p{margin-top:1rem}
.work-fig{position:relative; box-shadow:0 34px 60px -32px rgba(34,30,26,.35); border-radius:2px; overflow:hidden}
@media (max-width:860px){.work-grid{grid-template-columns:1fr}.work-fig{order:-1; max-width:320px; margin-inline:auto}}
.panel{margin-top:var(--air); background:var(--cream-2); padding:clamp(2rem,5vw,3.4rem); border-radius:2px}
.panel-lead{font-family:var(--display); font-style:italic; font-weight:300; font-size:1.35rem; color:var(--wine-deep); margin-bottom:1.8rem}
.panel-list{list-style:none; margin:0; padding:0; display:grid; gap:1.3rem}
.panel-list li{display:flex; align-items:center; gap:1.1rem; opacity:0; transform:translateY(14px);
  transition:opacity .7s cubic-bezier(.2,.7,.3,1), transform .7s cubic-bezier(.2,.7,.3,1)}
.panel.on .panel-list li{opacity:1; transform:none}
.panel.on .panel-list li:nth-child(2){transition-delay:.07s}
.panel.on .panel-list li:nth-child(3){transition-delay:.14s}
.panel.on .panel-list li:nth-child(4){transition-delay:.21s}
.panel.on .panel-list li:nth-child(5){transition-delay:.28s}
.panel.on .panel-list li:nth-child(6){transition-delay:.35s}
.panel.on .panel-list li:nth-child(7){transition-delay:.42s}
.panel-list .micon{flex:0 0 auto; width:30px; height:30px; color:var(--wine); transition:transform .4s cubic-bezier(.34,1.4,.5,1)}
.panel-list li:hover .micon{transform:translateY(-2px) rotate(-6deg)}
.panel-list span:last-child{color:var(--ink); font-size:1.04rem}

/* ============ testimonios olive (bloque color 3) ============ */
.rev{background:linear-gradient(155deg,#75834f 0%,var(--olive) 42%,#465025 100%); color:var(--cream); padding-block:var(--air)}
.rev .marker .num{color:var(--rose); opacity:.4}
.rev .marker .k{color:var(--rose)}
.rev-top{display:flex; justify-content:space-between; align-items:end; gap:2rem; flex-wrap:wrap; margin-bottom:2.6rem}
.rev-top h2{font-size:clamp(2rem,4.6vw,3.3rem); color:var(--cream); font-weight:300}
.rev-top h2 em{color:var(--rose)}
.rev-note{font-size:.72rem; color:rgba(247,242,231,.74); border:1px dashed rgba(247,242,231,.42);
  padding:.6rem .95rem; max-width:32ch; line-height:1.5; border-radius:2px}
/* carrusel de reseñas: fila con scroll-snap, 4 tarjetas visibles, flechas al desbordar.
   Cada .rev-card es un bloque idéntico y autónomo (estrellas/cita/nombre/fuente)
   pensado para mapear 1:1 a un campo repetible al pasar a WordPress. */
.rev-carousel{position:relative; margin-inline:calc(var(--pad) * -1)}
.rev-track{--rev-gap:1.5rem; display:flex; align-items:flex-start; gap:var(--rev-gap); overflow-x:auto; overflow-y:hidden;
  scroll-behavior:smooth; -webkit-overflow-scrolling:touch;
  padding:.6rem var(--pad) 3rem; scrollbar-width:none}
.rev-track::-webkit-scrollbar{display:none}
.rev-card{flex:0 0 calc((100% - var(--rev-gap) * 3) / 4); scroll-snap-align:start;
  background:var(--cream); color:var(--ink); padding:clamp(1.5rem,2.4vw,2.1rem); border-radius:2px;
  opacity:0; transform:translateY(18px); transition:opacity .8s cubic-bezier(.2,.7,.3,1), transform .8s cubic-bezier(.2,.7,.3,1), box-shadow .35s ease}
.rev-track.on .rev-card{opacity:1; transform:none}
.rev-track.on .rev-card:nth-child(2){transition-delay:.08s}.rev-track.on .rev-card:nth-child(3){transition-delay:.16s}
.rev-track.on .rev-card:nth-child(4){transition-delay:.24s}.rev-track.on .rev-card:nth-child(5){transition-delay:.32s}.rev-track.on .rev-card:nth-child(6){transition-delay:.4s}
.rev-card:hover{transform:translateY(-6px); box-shadow:0 26px 44px -28px rgba(0,0,0,.5)}
.rev-card .qm{font-family:var(--display); font-size:2.4rem; line-height:.4; color:var(--rose); display:block; margin-bottom:.8rem; opacity:.6}
.rev-card .stars{color:var(--rose); letter-spacing:.14em; font-size:.92rem; margin-bottom:.9rem}
.rev-text{position:relative; max-height:10rem; overflow:hidden; transition:max-height .45s ease}
.rev-text p{font-size:.97rem; color:var(--ink-soft); line-height:1.62}
.rev-text p + p{margin-top:.7rem}
.rev-text::after{content:""; position:absolute; left:0; right:0; bottom:0; height:2.6rem; pointer-events:none;
  background:linear-gradient(to bottom, rgba(247,242,231,0), var(--cream)); transition:opacity .3s ease}
.rev-card.open .rev-text{max-height:1800px}
.rev-card.open .rev-text::after{opacity:0}
.rev-more{margin-top:.8rem; align-self:flex-start; background:none; border:0; padding:0; cursor:pointer;
  font-family:var(--body); font-size:.66rem; letter-spacing:.18em; text-transform:uppercase; font-weight:700; color:var(--wine)}
.rev-more:hover{color:var(--wine-deep)}
.rev-card p{font-size:.97rem; color:var(--ink-soft); line-height:1.62}
.rev-card .nm{margin-top:1.2rem; font-family:var(--display); font-style:italic; font-weight:300; font-size:1.1rem; color:var(--wine-deep)}
.rev-card .src{display:block; margin-top:.4rem; font-family:var(--body); font-style:normal; font-size:.62rem;
  letter-spacing:.18em; text-transform:uppercase; color:var(--ink-faint)}
/* flechas — círculo crema con la sombra del resto de tarjetas */
.rev-nav{display:flex; gap:.7rem}
.rev-nav[hidden]{display:none}
.rev-arrow{width:3rem; height:3rem; border-radius:50%; border:0; cursor:pointer; flex:0 0 auto;
  background:var(--cream); color:var(--wine); display:grid; place-items:center;
  box-shadow:0 6px 14px -6px rgba(0,0,0,.4), 0 16px 30px -18px rgba(0,0,0,.5);
  transition:transform .25s ease, box-shadow .25s ease, opacity .25s ease}
.rev-arrow svg{width:1.15rem; height:1.15rem}
.rev-arrow:hover{transform:translateY(-2px); box-shadow:0 10px 20px -8px rgba(0,0,0,.5), 0 22px 38px -18px rgba(0,0,0,.55)}
.rev-arrow:disabled{opacity:.3; cursor:default; transform:none; box-shadow:0 4px 10px -6px rgba(0,0,0,.4)}
@media (max-width:980px){.rev-card{flex-basis:calc((100% - var(--rev-gap)) / 2)}}
@media (max-width:600px){.rev-card{flex-basis:86%}}
@media (prefers-reduced-motion:reduce){.rev-track{scroll-behavior:auto}}
.rev-cta{margin-top:clamp(1.8rem,3vw,2.6rem); text-align:center}

/* ============ modalidad ============ */
.mod{padding-block:var(--air)}
.mod-grid{margin-top:2.4rem; display:grid; grid-template-columns:1fr 1fr; gap:clamp(1.4rem,3vw,2rem)}
.mod-col{background:var(--cream-2); padding:clamp(1.8rem,4vw,2.8rem); border-top:3px solid var(--wine); border-radius:2px; transition:transform .3s ease, box-shadow .3s ease}
.mod-col:hover{transform:translateY(-4px); box-shadow:0 22px 40px -26px rgba(34,30,26,.4)}
.mod-col .micon{display:block; width:40px; height:40px; margin-bottom:1.1rem; color:var(--wine); transition:transform .4s cubic-bezier(.34,1.4,.5,1)}
.mod-col:hover .micon{transform:translateY(-3px) rotate(-6deg)}
.mod-col h3{font-family:var(--display); font-weight:300; font-size:1.5rem; color:var(--wine-deep); margin-bottom:.7rem}
.mod-col p{color:var(--ink-soft); font-size:1rem}
@media (max-width:640px){.mod-grid{grid-template-columns:1fr}}

/* ============ faq ============ */
.faq{padding-block:var(--air)}
.faq-list{margin-top:2.6rem; max-width:62ch}
.faq-list details{border-top:1px solid var(--line-strong)}
.faq-list details:last-child{border-bottom:1px solid var(--line-strong)}
.faq-list summary{list-style:none; cursor:pointer; display:flex; align-items:baseline; justify-content:space-between;
  gap:1.2rem; padding:1.6rem 0; font-family:var(--display); font-weight:300; font-size:clamp(1.15rem,2.2vw,1.4rem); color:var(--ink); transition:color .25s ease}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary:hover{color:var(--wine-deep)}
.faq-list summary::after{content:"+"; font-family:var(--body); font-weight:400; font-size:1.3rem; color:var(--wine); flex:0 0 auto; display:inline-block; transition:transform .35s cubic-bezier(.34,1.4,.5,1)}
.faq-list details[open] summary{color:var(--wine-deep)}
.faq-list details[open] summary::after{transform:rotate(135deg)}
.faq-list details p{display:block; overflow:hidden; max-height:0; opacity:0; padding-bottom:0; color:var(--ink-soft); max-width:54ch; font-size:1rem;
  transition:max-height .5s cubic-bezier(.2,.7,.3,1), opacity .4s ease, padding-bottom .5s cubic-bezier(.2,.7,.3,1)}
.faq-list details[open] p{max-height:22rem; opacity:1; padding-bottom:1.7rem}

/* pledge — franja separadora rosa, gemela de la cita */
.pledge{margin-top:var(--air); background:var(--rose-soft); position:relative; overflow:hidden}
.pledge-in{padding-block:clamp(3.2rem,6.5vw,5rem); text-align:center}
.pledge p{font-family:var(--display); font-style:italic; font-weight:400; font-size:clamp(1.25rem,2.4vw,1.7rem); color:var(--wine-deep); line-height:1.3; max-width:none; margin-inline:auto}

/* divulgacion */
.divg{padding-block:var(--air)}
.divg .lede{margin-top:1.2rem; color:var(--ink-soft); font-size:1.1rem; font-family:var(--display); font-style:italic; font-weight:300; max-width:40ch}
.pod-grid{margin-top:2.6rem; display:grid; grid-template-columns:1fr 1fr; gap:1.2rem}
.pod-card{display:flex; flex-direction:column; gap:.55rem; text-decoration:none; background:var(--cream-2);
  padding:clamp(1.6rem,3vw,2.2rem); border-left:3px solid var(--wine); border-radius:2px;
  transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease}
.pod-card:hover{transform:translateX(6px); box-shadow:0 18px 34px -22px rgba(94,18,51,.45); border-left-color:var(--wine-deep)}
.pod-card .kind{font-size:.65rem; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-faint)}
.pod-card .tt{font-family:var(--display); font-weight:300; font-size:1.35rem; color:var(--ink); line-height:1.22; transition:color .3s ease}
.pod-card:hover .tt{color:var(--wine-deep)}
.pod-card .go{font-size:.68rem; letter-spacing:.16em; text-transform:uppercase; color:var(--wine); margin-top:.3rem}
.posts-head{margin-top:clamp(3rem,6vw,4rem)}
.posts{margin-top:1.8rem; display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1.4rem,3vw,2rem)}
.post{display:flex; flex-direction:column; gap:.9rem; text-decoration:none}
.post figure{position:relative; overflow:hidden; border-radius:2px}
.post img{transition:transform .7s cubic-bezier(.2,.7,.3,1)}
.post:hover img{transform:scale(1.05)}
.post .meta{font-size:.64rem; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-faint)}
.post h3{font-size:1.35rem; font-weight:300; line-height:1.15; transition:color .3s ease, transform .3s ease}
.post:hover h3{color:var(--wine); transform:translateX(3px)}
.divg-note{margin-top:2rem; font-size:.78rem; color:var(--ink-faint)}
@media (max-width:760px){.pod-grid{grid-template-columns:1fr}.posts{grid-template-columns:1fr}}

/* contacto wine (bloque color 4) */
.contact{background:var(--wine); color:var(--cream); padding-block:var(--air)}
.contact .marker .num{color:var(--rose); opacity:.4}
.contact .marker .k{color:var(--rose)}
.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:clamp(2.4rem,6vw,4.5rem); align-items:start}
.contact h2{font-size:clamp(2.2rem,5.4vw,3.8rem); font-weight:300; max-width:12ch}
.contact h2 em{color:var(--rose); font-weight:300}
.contact-lead{margin-top:1.5rem; color:rgba(247,242,231,.86); max-width:42ch; font-size:1.08rem}
.mini{font-size:.85rem; color:rgba(247,242,231,.68); line-height:1.6; max-width:42ch}
.mini + .mini{margin-top:.7rem}
.form{display:grid; gap:1.5rem}
.form label{display:grid; gap:.55rem; font-size:.63rem; letter-spacing:.24em; text-transform:uppercase; color:rgba(247,242,231,.66)}
.form input,.form textarea{font-family:var(--body); font-size:1rem; color:var(--cream);
  background:transparent; border:0; border-bottom:1px solid rgba(247,242,231,.38); padding:.7rem 0; transition:border-color .3s ease}
.form textarea{min-height:80px; resize:vertical}
.form input:focus,.form textarea:focus{outline:0; border-bottom-color:var(--cream)}
.form ::placeholder{color:rgba(247,242,231,.44)}
.form label.consent{grid-template-columns:auto 1fr; display:grid; gap:.7rem; align-items:start;
  font-size:.78rem; letter-spacing:0; text-transform:none; color:rgba(247,242,231,.74); line-height:1.5}
.form label.consent input{width:1rem; height:1rem; margin-top:.15rem; accent-color:var(--rose)}
.form .btn{justify-self:start; margin-top:.4rem}
@media (max-width:860px){.contact-grid{grid-template-columns:1fr}}

/* footer */
.site-foot{padding-block:3.8rem 4.2rem; text-align:center}
.foot-logo{display:block; width:clamp(190px,26vw,248px); height:auto; object-fit:contain; margin:0 auto}
.foot-tagline{margin-top:1.5rem; font-family:var(--display); font-style:italic; font-weight:300; font-size:clamp(1.2rem,2.4vw,1.5rem); color:var(--wine-deep)}
.foot-grid{margin-top:2.8rem; padding-top:1.9rem; border-top:1px solid var(--line-strong); display:flex; flex-wrap:wrap; gap:1rem 2rem; justify-content:space-between; align-items:baseline;
  text-align:left; font-size:.86rem; color:var(--ink-soft)}
.foot-links{display:flex; gap:1.6rem; flex-wrap:wrap}
.foot-links a{font-size:.86rem; text-decoration:none; color:var(--ink-soft)}
.foot-links a:hover{color:var(--wine)}
.safety{margin-top:1.6rem; font-size:.8rem; color:var(--ink-faint); max-width:64ch; margin-inline:auto}
@media (max-width:560px){.foot-grid{justify-content:center; text-align:center}}

/* whatsapp */
.wa{position:fixed; right:1.1rem; bottom:1.1rem; z-index:55; width:3.4rem; height:3.4rem; border-radius:50%;
  background:var(--olive); color:var(--cream); display:grid; place-items:center; text-decoration:none;
  box-shadow:0 8px 24px rgba(34,30,26,.2); transition:transform .2s ease,background .2s ease; animation:wa-breathe 3.4s ease-in-out infinite}
.wa:hover{transform:scale(1.08); background:var(--wine); animation-play-state:paused}
.wa svg{width:1.5rem; height:1.5rem; fill:currentColor}
@keyframes wa-breathe{0%,100%{box-shadow:0 8px 24px rgba(34,30,26,.2), 0 0 0 0 rgba(94,18,51,.32)}50%{box-shadow:0 8px 24px rgba(34,30,26,.2), 0 0 0 9px rgba(94,18,51,0)}}

/* movimiento — parallax suave en fotos + flotación de la etiqueta */
.px{will-change:transform; transform:scale(1.06)}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.hero-chip{animation:floaty 4.2s ease-in-out infinite; border-radius:12px}

/* preview note */
.preview{position:fixed; right:1rem; bottom:5.2rem; z-index:60; width:min(20rem,calc(100vw - 2rem));
  background:var(--cream); border:1px solid var(--line-strong); box-shadow:0 14px 40px rgba(34,30,26,.18); border-radius:3px;
  font-size:.78rem; color:var(--ink-soft); line-height:1.5}
.preview-bar{display:flex; align-items:center; gap:.6rem; padding:.65rem .85rem; cursor:pointer; background:none; border:0; width:100%; text-align:left; font:inherit; color:var(--ink)}
.preview-bar b{font-weight:700; font-size:.6rem; letter-spacing:.2em; text-transform:uppercase}
.preview-bar .chev{margin-left:auto; color:var(--ink-faint)}
.preview-body{padding:.2rem .85rem .9rem; border-top:1px solid var(--line)}

@media (prefers-reduced-motion:reduce){*{transition:none!important; animation:none!important}}

/* balanceo suave de las flores/iconos */
.micon svg{transform-origin:50% 86%; animation:mi-sway 5.5s ease-in-out infinite}
@keyframes mi-sway{0%,100%{transform:rotate(-2.6deg)}50%{transform:rotate(2.6deg)}}
.about-block:nth-of-type(2) .micon svg{animation-delay:-2.1s}
.panel-list li:nth-child(2) .micon svg{animation-delay:-1.6s}
.panel-list li:nth-child(3) .micon svg{animation-delay:-3.2s}

/* acentos botanicos (laminas pintadas del herbario) */
.accent{display:block; margin-bottom:.7rem; line-height:0}
.accent svg{display:block; height:auto; overflow:visible; transform-origin:50% 92%; animation:mi-sway 6.5s ease-in-out infinite}
.accent.a-maceta svg{width:118px}
.accent.a-flor svg{width:150px; margin-left:-6px; animation-delay:-2.4s}
@media (max-width:860px){.accent.a-maceta svg{width:102px}.accent.a-flor svg{width:130px}}

/* flores del herbario en modo icono (pequenas) */
.hicon{display:block; line-height:0; margin-bottom:.5rem}
.hicon svg{display:block; width:auto; overflow:visible; transform-origin:50% 92%; animation:mi-sway 6.5s ease-in-out infinite}
.about-block .hicon svg{height:54px}
.panel-list .hicon{margin-bottom:0}
.panel-list .hicon svg{height:46px; animation-duration:7s}
.panel-list li{gap:.7rem; align-items:center}
/* encuadre foto hero: subir para ver el metro */
.hero-fig img{object-position:50% 82%}
.panel-list li::before{content:""; width:8px; height:8px; border-radius:50%; background:var(--rose); flex:0 0 auto}

/* proporciones a prueba de Safari (padding-hack en vez de aspect-ratio en grids) */
.area figure::before,.post figure::before,.work-fig::before,.ed-media figure::before,.about-portrait figure::before{content:""; display:block}
.area figure::before{padding-bottom:125%}
.post figure::before{padding-bottom:75%}
.work-fig::before{padding-bottom:133.33%}
.ed-media figure::before{padding-bottom:80%}
.about-portrait figure::before{padding-bottom:125%}
.area figure>img,.post figure>img,.work-fig>img,.ed-media figure>img,.about-portrait figure>img{position:absolute; inset:0}
@media (max-width:860px){.area figure::before{padding-bottom:62.5%}}

/* profundidad en tarjetas (punto medio, sin neumorfismo) — mas marcada */
.pod-card,.panel,.about-card{border-radius:14px; box-shadow:0 4px 10px -4px rgba(34,30,26,.14), 0 20px 40px -14px rgba(34,30,26,.30)}
.rev-card{border-radius:14px; box-shadow:0 4px 10px -3px rgba(0,0,0,.20), 0 22px 42px -14px rgba(0,0,0,.45)}
.pod-card,.rev-card,.about-card{transition:transform .32s cubic-bezier(.2,.8,.3,1), box-shadow .32s ease, border-color .3s ease}
.pod-card:hover,.about-card:hover{transform:translateY(-7px); box-shadow:0 8px 16px -6px rgba(94,18,51,.22), 0 34px 56px -18px rgba(94,18,51,.42)}
.rev-card:hover{transform:translateY(-8px); box-shadow:0 8px 16px -6px rgba(0,0,0,.28), 0 38px 60px -20px rgba(0,0,0,.55)}

/* profundidad tambien en las imagenes (mismo lenguaje que las tarjetas) */
.hero-fig,.ed-media figure,.area figure,.work-fig,.about-portrait figure,.post figure{
  border-radius:14px;
  box-shadow:0 6px 14px -6px rgba(34,30,26,.18), 0 26px 50px -18px rgba(34,30,26,.34);
}
.hero-media::before{border-radius:18px}
.post figure{transition:transform .32s cubic-bezier(.2,.8,.3,1), box-shadow .32s ease}
.post:hover figure{transform:translateY(-6px); box-shadow:0 10px 20px -8px rgba(34,30,26,.24), 0 40px 62px -22px rgba(34,30,26,.46)}

/* profundidad tambien en los botones (solidos, con contraste — no neumorficos) */
.btn{border-radius:16px}
/* sombra de reposo neutra y concentrada (como el chip del hero): tinta, no vino, con spread -20 para que no se derrame por los lados */
.btn-solid{box-shadow:0 20px 34px -20px rgba(34,30,26,.52), 0 4px 10px -6px rgba(34,30,26,.28)}
.btn-solid:hover{background:#FFFFFF; color:var(--wine); border-color:var(--wine); transform:translateY(-3px); box-shadow:0 18px 32px -16px rgba(34,30,26,.26)}
.btn-line{box-shadow:0 6px 14px -8px rgba(34,30,26,.2)}

/* ===== vistas (blog / articulo) ===== */
.view[hidden]{display:none!important}
.verblog-link{font-family:var(--body); font-weight:700; font-size:.74rem; letter-spacing:.16em; text-transform:uppercase; color:var(--wine); text-decoration:none}
.verblog-link:hover{color:var(--wine-deep)}
.blog-h2{margin-top:0; margin-bottom:1.5rem}
.blog-h2 a{color:inherit; text-decoration:none; transition:color .3s ease}
.blog-h2 a em{color:var(--wine); font-style:italic; font-weight:300}
.blog-h2 a:hover{color:var(--wine-deep)}
.blog-h2 .blog-arrow{color:var(--wine); font-size:.6em; display:inline-block; transition:transform .35s cubic-bezier(.2,.8,.3,1)}
.blog-h2 a:hover .blog-arrow{transform:translateX(5px)}
/* blog */
.blog-wrap{max-width:var(--wrap); margin:0 auto; padding-inline:var(--pad)}
.blog-head{padding-block:clamp(3rem,7vw,5rem) 1.2rem}
.blog-head h1{font-size:clamp(2.6rem,6vw,4.4rem); font-weight:300; letter-spacing:-.03em; line-height:1.03}
.blog-head h1 em{color:var(--wine); font-weight:300}
.blog-lede{margin-top:1.2rem; color:var(--ink-soft); font-size:1.14rem; max-width:52ch; font-family:var(--display); font-style:italic; font-weight:300}
.blog-filter{display:flex; gap:.6rem; flex-wrap:wrap; margin-top:2.2rem}
.blog-filter button{font-family:var(--body); font-size:.7rem; letter-spacing:.14em; text-transform:uppercase; font-weight:700;
  padding:.62rem 1.15rem; border:1px solid var(--line-strong); border-radius:100px; background:transparent; color:var(--ink-soft); cursor:pointer;
  transition:background .25s ease, color .25s ease, border-color .25s ease}
.blog-filter button:hover{border-color:var(--wine); color:var(--wine)}
.blog-filter button.active{background:var(--wine); color:var(--cream); border-color:var(--wine)}
.blog-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1.6rem,3vw,2.4rem); padding-block:clamp(2.4rem,5vw,3.6rem) var(--air)}
.blog-grid .post .excerpt{color:var(--ink-soft); font-size:.96rem}
@media (max-width:900px){.blog-grid{grid-template-columns:1fr 1fr}}
@media (max-width:600px){.blog-grid{grid-template-columns:1fr}}
/* articulo */
.article-wrap{max-width:760px; margin:0 auto; padding-inline:var(--pad); padding-block:clamp(2.6rem,6vw,4rem) var(--air)}
.a-back{display:inline-flex; align-items:center; gap:.5rem; font-family:var(--body); font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; font-weight:700; color:var(--wine); text-decoration:none; margin-bottom:2rem; cursor:pointer; background:none; border:0; padding:0}
.a-back:hover{color:var(--wine-deep)}
.a-meta{font-size:.68rem; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-faint); margin-bottom:.8rem}
.article h1{font-size:clamp(2.2rem,5vw,3.4rem); font-weight:300; letter-spacing:-.025em; line-height:1.06}
.a-cover{position:relative; margin-block:clamp(2rem,4vw,2.8rem); border-radius:14px; overflow:hidden; box-shadow:0 26px 50px -18px rgba(34,30,26,.34)}
.a-cover::before{content:""; display:block; padding-bottom:56%}
.a-cover>img{position:absolute; inset:0}
.a-body{font-size:1.08rem; color:var(--ink); line-height:1.85}
.a-body p{margin-top:1.4rem; max-width:66ch}
.a-body p:first-child{margin-top:0}
.a-body h2{font-family:var(--display); font-weight:300; font-size:1.7rem; color:var(--wine-deep); margin-top:2.4rem}
.a-body blockquote{margin:2.2rem 0; padding-left:1.4rem; border-left:2px solid var(--rose); font-family:var(--display); font-style:italic; font-weight:300; font-size:1.4rem; color:var(--wine-deep); line-height:1.4}
.a-cta{margin-top:3rem; padding-top:2rem; border-top:1px solid var(--line-strong)}

/* franja de atencion / contacto rapido antes del pie */
.hours{border-top:1px solid var(--line-strong); background:var(--cream-2)}
.hours-in{display:grid; grid-template-columns:1.3fr 1fr 1fr 1fr; gap:clamp(1.4rem,3vw,2.6rem); align-items:center; padding-block:clamp(2.2rem,4vw,3rem)}
.hours-brand{display:flex; flex-direction:column; gap:.45rem}
.hours-brand .m{font-family:var(--display); font-weight:300; font-size:1.55rem; color:var(--ink); line-height:1}
.hours-brand .t{font-size:.92rem; color:var(--ink-soft)}
.hours-brand .t .hb{color:var(--wine)}
.hours-col{display:grid; grid-template-columns:auto 1fr; grid-template-rows:auto auto; column-gap:.9rem; row-gap:.1rem; align-items:center; text-decoration:none; color:inherit}
.hours-ic{grid-row:1 / span 2; width:46px; height:46px; border-radius:50%; background:var(--rose-soft); color:var(--wine); display:grid; place-items:center; transition:transform .3s ease, background .3s ease, box-shadow .3s ease}
.hours-col:hover .hours-ic{transform:translateY(-3px); background:#fff; box-shadow:0 12px 22px -14px rgba(94,18,51,.5)}
.hours-ic svg{width:21px; height:21px}
.hours-col .h-t{font-family:var(--display); font-weight:300; font-size:1.25rem; color:var(--ink); line-height:1.1; align-self:end}
.hours-col .h-d{font-size:.8rem; color:var(--ink-faint); line-height:1.4; align-self:start}
@media (max-width:820px){.hours-in{grid-template-columns:1fr 1fr; gap:1.6rem 1.4rem}.hours-brand{grid-column:1 / -1; margin-bottom:.4rem}}
@media (max-width:520px){.hours-in{grid-template-columns:1fr}}

/* parrafo destacado en cursiva dentro del cuerpo editorial */
.ed-body .ed-em{font-family:var(--display); font-style:italic; font-weight:400; font-size:clamp(1.15rem,1.9vw,1.4rem);
  color:var(--wine-deep); line-height:1.42; padding-left:1.2rem; border-left:2px solid var(--rose); margin-top:.5rem}
/* separador pintado a mano con florecilla (estilo del subrayado, con movimiento) */
.divider{display:flex; justify-content:center; padding-block:clamp(2.4rem,6vw,4.4rem)}
.divider svg{width:min(300px,66%); height:auto; overflow:visible}
.divider .dl{stroke:var(--rose); stroke-width:3; fill:none; stroke-linecap:round; stroke-dasharray:1; stroke-dashoffset:1;
  transition:stroke-dashoffset 1.15s cubic-bezier(.3,.8,.3,1)}
.divider .dl.d2{transition-delay:.15s}
.divider.on .dl{stroke-dashoffset:0}
.divider .df{opacity:0; transition:opacity .7s ease .55s}
.divider.on .df{opacity:1}
.divider .petal{fill:var(--rose)} .divider .core{fill:var(--wine)}
@media (prefers-reduced-motion:reduce){.divider .dl{stroke-dashoffset:0}.divider .df{opacity:1}}
.dline{display:block; width:72px; height:2px; background:var(--sand); border-radius:2px; transform:scaleX(.4); opacity:0; transition:transform .7s cubic-bezier(.2,.7,.3,1), opacity .7s ease}
.divider.on .dline{transform:scaleX(1); opacity:1}
@media (prefers-reduced-motion:reduce){.dline{transform:none; opacity:1; transition:none}}
.ed-sep-wrap{text-align:center; padding-block:clamp(2.8rem,6vw,4.6rem)}
.ed-sep{font-family:var(--display); font-style:italic; font-weight:300; font-size:clamp(1.4rem,2.6vw,1.95rem);
  color:var(--wine-deep); line-height:1.38; max-width:30ch; margin-inline:auto}

/* Quiza sin imagen (dos columnas de texto) */
.ed-grid.ed-noimg{align-items:center}
.ed-noimg .ed-body{margin-top:0; max-width:52ch}
.ed-body .ed-close{font-family:var(--display); font-style:italic; font-weight:700; font-size:clamp(1.5rem,2.5vw,1.95rem);
  color:var(--wine-deep); line-height:1.36; margin-top:1.2rem; max-width:none}
@media (max-width:860px){.ed-noimg .ed-body{margin-top:1.4rem}}
/* videos de divulgacion */
.vids{margin-top:1.8rem; display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1.4rem,3vw,2rem)}
.vid{margin:0; text-decoration:none; color:inherit; display:block}
.vid-frame{position:relative; aspect-ratio:16/9; border-radius:14px; overflow:hidden; box-shadow:0 20px 44px -20px rgba(34,30,26,.34);
  background:linear-gradient(150deg,#3a1c2b 0%,#170b11 100%); transition:transform .32s cubic-bezier(.2,.8,.3,1), box-shadow .32s ease}
.vid-frame::after{content:""; position:absolute; inset:0; background:linear-gradient(to top, rgba(15,7,11,.74) 0%, rgba(15,7,11,.15) 44%, transparent 64%); z-index:1}
.vid:hover .vid-frame{transform:translateY(-6px); box-shadow:0 30px 54px -22px rgba(94,18,51,.5)}
.vph{position:absolute; inset:0; display:grid; place-items:center; z-index:2}
.vph svg{width:58px; height:58px; filter:drop-shadow(0 6px 16px rgba(0,0,0,.5)); transition:transform .3s ease}
.vid:hover .vph svg{transform:scale(1.1)}
.vid-meta{position:absolute; left:0; right:0; bottom:0; z-index:2; padding:1rem 1.15rem; display:grid; gap:.3rem}
.vid-kind{font-family:var(--body); font-size:.62rem; letter-spacing:.2em; text-transform:uppercase; color:var(--rose-soft)}
.vid-title{font-family:var(--display); font-weight:400; font-size:clamp(1.05rem,1.8vw,1.25rem); color:var(--cream); line-height:1.2}
.vid-cap{display:block; margin-top:.7rem; font-family:var(--body); font-size:.68rem; letter-spacing:.16em; text-transform:uppercase; color:var(--wine); transition:color .3s ease}
.vid:hover .vid-cap{color:var(--wine-deep)}
@media (max-width:760px){.vids{grid-template-columns:1fr}}

/* ===== prueba de tonos: tramo preguntas / divulgación / blog ===== */
#blog-teaser figure{margin:0}
.faq{padding-block:var(--air) calc(var(--air) * .8)}
.faq-grid{display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(2rem,6vw,5.5rem); align-items:start}
.faq-side{position:sticky; top:110px}
.faq-note{margin-top:1.4rem; color:var(--ink-soft); max-width:32ch}
.faq-link{display:inline-block; margin-top:1.4rem; font-size:.74rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--wine); text-decoration:none; border-bottom:1px solid currentColor; padding-bottom:.2rem}
.faq-link:hover{color:var(--wine-deep)}
.faq-grid .faq-list{margin-top:0; max-width:none}
@media (max-width:860px){.faq-grid{grid-template-columns:1fr}.faq-side{position:static}}

.divg-envuelto{padding-block:0}
.panel-env{--pbg:#EFE3D4; --pshadow:94,18,51;
  background:var(--pbg); border-radius:36px; padding:clamp(2.2rem,6vw,5rem) clamp(1.4rem,5vw,4.5rem);
  box-shadow:0 30px 60px -34px rgba(var(--pshadow),.34), 0 8px 18px -10px rgba(var(--pshadow),.14), inset 0 4px 10px rgba(255,255,255,.6), inset 0 -10px 22px rgba(var(--pshadow),.07);
  transition:background .5s ease, box-shadow .5s ease}
.panel-env[data-tone="rosa"]{--pbg:#F4DFE2; --pshadow:94,18,51}
.panel-env[data-tone="arena"]{--pbg:#EFE3D4; --pshadow:92,64,40}
.panel-env[data-tone="salvia"]{--pbg:#E4E8D6; --pshadow:70,80,37}
.panel-env .pod-card{background:var(--cream)}
@media (max-width:600px){.divg-envuelto.wrap{padding-inline:.6rem}.panel-env{border-radius:26px}}
#blog-teaser{padding-block:var(--air)}



/* vídeos: tarjetas claras con relieve, en lugar de pósters oscuros */
.panel-env .vid-frame{aspect-ratio:auto; min-height:210px; display:flex; flex-direction:column; justify-content:space-between; gap:1.6rem;
  padding:1.4rem 1.4rem 1.5rem; background:var(--cream); border-radius:20px;
  box-shadow:0 18px 34px -20px rgba(var(--pshadow),.38), 0 4px 10px -6px rgba(var(--pshadow),.16), inset 0 3px 8px rgba(255,255,255,.7), inset 0 -6px 14px rgba(var(--pshadow),.06)}
.panel-env .vid-frame::after{display:none}
.panel-env .vph{position:static; display:block}
.panel-env .vph svg{width:52px; height:52px; filter:drop-shadow(0 8px 12px rgba(94,18,51,.28))}
.panel-env .vph svg circle{fill:var(--wine)}
.panel-env .vph svg path{fill:var(--cream)}
.panel-env .vid-meta{position:static; padding:0; gap:.45rem}
.panel-env .vid-kind{color:var(--wine); font-weight:700}
.panel-env .vid-title{color:var(--ink); font-weight:300; font-size:clamp(1.25rem,2vw,1.45rem); line-height:1.18}
.panel-env .vid:hover .vid-frame{transform:translateY(-6px); box-shadow:0 26px 44px -22px rgba(var(--pshadow),.45), 0 6px 12px -6px rgba(var(--pshadow),.18), inset 0 3px 8px rgba(255,255,255,.7), inset 0 -6px 14px rgba(var(--pshadow),.06)}
.panel-env .vid-cap{margin-top:.9rem; padding-left:.3rem}



/* ===== Divulgación: tipografía como en la propuesta v2 (más grande) ===== */
.panel-env h2{font-size:clamp(2.2rem,4.8vw,3.5rem)!important}
.panel-env .lede{font-size:1.2rem}
.panel-env .pod-card{display:grid; grid-template-columns:1fr; row-gap:.7rem; padding:clamp(1.8rem,3.4vw,2.6rem)}
.panel-env .pod-card .kind{font-size:.68rem; letter-spacing:.2em; font-weight:700; color:var(--wine)}
.panel-env .pod-card .tt{font-family:var(--display); font-weight:400; font-size:clamp(1.5rem,3vw,2.2rem); line-height:1.15; color:var(--ink)}
.panel-env .pod-card:hover .tt{color:var(--wine-deep)}
.panel-env .pod-card .go{font-size:.7rem; letter-spacing:.16em; color:var(--ink-faint); margin-top:.2rem}
.panel-env .vid-frame{min-height:230px}
.panel-env .vid-kind{font-size:.64rem; letter-spacing:.2em}
.panel-env .vid-title{font-weight:400; font-size:clamp(1.4rem,2.3vw,1.7rem); line-height:1.15; color:var(--wine-deep)}
.panel-env .vid-cap{font-size:.68rem; letter-spacing:.16em; color:var(--ink-soft)}


/* podcast: diseño de la v2 (etiqueta y play arriba, título abajo), redondeado y con borde marcado como la tarjeta de prensa */
.dv-vids{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1rem,2.4vw,1.6rem)}
.dv-vid{display:grid; grid-template-rows:auto 1fr; text-decoration:none; color:inherit; background:var(--cream);
  border-left:3px solid var(--wine); border-radius:14px; overflow:hidden;
  box-shadow:0 4px 10px -4px rgba(34,30,26,.14), 0 20px 40px -14px rgba(34,30,26,.30);
  transition:transform .32s cubic-bezier(.2,.8,.3,1), box-shadow .32s ease}
.dv-vid:hover{transform:translateY(-7px); box-shadow:0 8px 16px -6px rgba(94,18,51,.22), 0 34px 56px -18px rgba(94,18,51,.42)}
.dv-top{display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:1.4rem 1.5rem 0}
.dv-kind{font-size:.64rem; letter-spacing:.2em; text-transform:uppercase; font-weight:700; color:var(--wine)}
.dv-play{flex:0 0 auto; width:44px; height:44px; border-radius:50%; background:var(--wine); display:grid; place-items:center; box-shadow:0 8px 14px -8px rgba(94,18,51,.6); transition:transform .25s}
.dv-vid:hover .dv-play{transform:scale(1.08)}
.dv-play svg{width:14px; height:14px; margin-left:2px}
.dv-body{padding:2.6rem 1.5rem 1.5rem; display:grid; gap:.9rem; align-content:end}
.dv-title{font-family:var(--display); font-weight:400; font-size:clamp(1.4rem,2.3vw,1.7rem); line-height:1.15; color:var(--wine-deep)}
.dv-cap{font-size:.68rem; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-soft)}
@media (max-width:760px){.dv-vids{grid-template-columns:1fr}.dv-body{padding-top:1.4rem}}


/* ===== Sobre mí: estructura de la propuesta v2, con la estética dulce ===== */
.tbd{background:rgba(212,124,142,.18); padding:0 .25em; border-radius:3px}
.sm-hero{display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(2rem,6vw,5rem); align-items:center}
.sm-portrait{position:relative; max-width:420px}
.sm-portrait::before{content:""; position:absolute; left:-1.4rem; top:-1.4rem; width:62%; height:55%; background:var(--rose-soft); border-radius:18px; z-index:0;
  box-shadow:0 22px 44px -26px rgba(94,18,51,.30), inset 0 3px 8px rgba(255,255,255,.55), inset 0 -7px 15px rgba(94,18,51,.09)}
.sm-portrait figure{position:relative; z-index:1; margin:0; aspect-ratio:4/5; overflow:hidden; border-radius:14px; box-shadow:0 6px 14px -6px rgba(34,30,26,.18), 0 26px 50px -18px rgba(34,30,26,.34)}
.sm-portrait img{width:100%; height:100%; object-fit:cover; object-position:50% 25%}
.sm-txt h2{font-size:clamp(2.2rem,5vw,3.6rem); font-weight:300}
.sm-txt h2 em,.sm-method h2 em{font-style:italic; color:var(--wine)}
.sm-lead{margin-top:1.6rem; font-family:var(--display); font-size:clamp(1.25rem,2.2vw,1.55rem); line-height:1.4; color:var(--ink); max-width:38ch}
.sm-cred{margin-top:1.4rem; font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-faint)}
.sm-path{margin-top:clamp(3.5rem,7vw,5.5rem); display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line-strong)}
.sm-item{padding:2rem clamp(1rem,3vw,2.2rem) 0 0; display:grid; gap:.6rem; align-content:start}
.sm-item + .sm-item{padding-left:clamp(1rem,3vw,2.2rem); border-left:1px solid var(--line)}
.sm-item::before{content:""; width:2rem; height:2px; background:var(--rose); border-radius:2px; margin-bottom:.4rem}
.sm-item h3{font-size:1.55rem; font-weight:300; color:var(--wine-deep)}
.sm-item p{color:var(--ink-soft); font-size:.98rem; max-width:34ch}
.sm-note{margin-top:clamp(2.6rem,5vw,3.6rem); padding-top:1.6rem; border-top:1px solid var(--line-strong); display:flex; gap:.6rem 2rem; flex-wrap:wrap; font-size:.78rem; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-faint)}
.sm-note b{color:var(--wine); font-weight:700}
.sm-method{margin-top:var(--air); display:grid; grid-template-columns:1.15fr .85fr; gap:clamp(2.4rem,6vw,5rem); align-items:center}
.sm-method h2{font-size:clamp(2rem,4.4vw,3.2rem); font-weight:300}
.sm-body{margin-top:1.6rem; display:grid; gap:1.2rem; max-width:50ch}
.sm-body p{color:var(--ink-soft); font-size:1.08rem}
.sm-method figure{margin:0; aspect-ratio:3/4; width:100%; max-width:380px; justify-self:end; overflow:hidden; border-radius:14px; box-shadow:0 6px 14px -6px rgba(34,30,26,.18), 0 26px 50px -18px rgba(34,30,26,.34)}
.sm-method figure img{width:100%; height:100%; object-fit:cover}
@media (max-width:860px){.sm-hero,.sm-method{grid-template-columns:1fr}.sm-portrait{max-width:300px; margin-left:1.4rem}.sm-method figure{justify-self:start; max-width:300px}}
@media (max-width:760px){.sm-path{grid-template-columns:1fr}.sm-item + .sm-item{padding-left:0; border-left:0; border-top:1px solid var(--line); margin-top:1.8rem}}

/* presentación justificada (en móvil, a la izquierda para evitar huecos) */
.sm-lead{text-align:justify; hyphens:auto; -webkit-hyphens:auto; max-width:42ch}
@media (max-width:600px){.sm-lead{text-align:left; hyphens:manual; -webkit-hyphens:manual}}

/* ===== inicio: texto nuevo ===== */
.hero-lead.hl2{margin-top:clamp(2.4rem,4.5vw,3.4rem); gap:1.15rem; max-width:48ch}
.hero-lead.hl2 p{font-size:1.08rem; line-height:1.72}
.hero-lead.hl2 .hero-q{font-family:var(--display); font-weight:400; font-size:clamp(1.35rem,2.2vw,1.65rem); line-height:1.32; color:var(--ink); margin-bottom:.2rem}
.hero-lead.hl2 .hero-no{font-family:var(--display); font-style:italic; font-weight:400; font-size:clamp(1.25rem,2vw,1.5rem); line-height:1.35; color:var(--wine-deep);
  padding-left:1.2rem; border-left:2px solid var(--rose); margin-block:.5rem}
.hero-in{align-items:center}

/* segundo apartado: título arriba, texto debajo */
.ed-grid.ed-stack{grid-template-columns:1fr; gap:clamp(1.6rem,3vw,2.2rem); max-width:1080px; margin-inline:auto; text-align:center}
.ed-stack h2{font-size:clamp(2.1rem,4.4vw,3.3rem); text-wrap:balance}
.ed-stack .ed-body.ed-page{margin:0; max-width:none; display:grid; gap:1.2rem}
.ed-pflow{display:grid; gap:1.1rem}
.ed-pflow p{font-size:1.12rem; text-wrap:pretty}
.ed-page .ed-close{margin-top:.8rem; text-wrap:balance; max-width:none}
@media (max-width:700px){.ed-grid.ed-stack{text-align:left}}

/* ===== La consulta (de la propuesta v2), con estética dulce ===== */
.cm{padding-block:var(--air)}
.cm-h2{font-size:clamp(2rem,4.4vw,3.2rem); font-weight:300}
.cm-h2 em{font-style:italic; color:var(--wine)}
.cm-grid{margin-top:2.4rem; display:grid; grid-template-columns:1fr 1fr; gap:clamp(1.4rem,3vw,2rem)}
.cm-col{background:var(--cream-2); padding:clamp(1.8rem,4vw,2.8rem); border-radius:14px; display:grid; gap:.9rem; align-content:start;
  box-shadow:0 4px 10px -4px rgba(34,30,26,.14), 0 20px 40px -14px rgba(34,30,26,.30)}
.cm-col h3{font-size:1.7rem; font-weight:300; color:var(--wine-deep)}
.cm-col p{color:var(--ink-soft)}
.cm-col dl{margin:.6rem 0 0; display:grid; grid-template-columns:auto 1fr; gap:.5rem 1.2rem; font-size:.95rem}
.cm-col dt{font-size:.66rem; letter-spacing:.18em; text-transform:uppercase; font-weight:700; color:var(--ink-faint); padding-top:.2rem}
.cm-col dd{margin:0; color:var(--ink)}
@media (max-width:700px){.cm-grid{grid-template-columns:1fr}}

/* ===== inicio: título arriba a lo ancho, debajo foto + texto (28/09) ===== */
.hero-top .ht-head{max-width:none}
.hero-top .ht-h1{font-size:clamp(2.6rem,5.2vw,4.6rem); line-height:1.04; max-width:20ch; text-wrap:balance}
.ht-grid{margin-top:clamp(2.6rem,5vw,4rem); display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(2.2rem,6vw,5.5rem); align-items:center}
.ht-media{justify-self:end; max-width:460px; margin-top:0; order:2}
.ht-media figure{margin:0}
.ht-media::before{inset:auto -1.5rem -1.5rem auto}
.ht-text .hero-lead.hl2{margin-top:0; max-width:50ch}
.ht-cta{margin-top:clamp(2rem,3.6vw,2.8rem); display:flex; flex-direction:column; align-items:flex-start; gap:1rem}
.ht-cta .hero-cred{margin:0}
@media (max-width:860px){.ht-grid{grid-template-columns:1fr}.ht-media{max-width:340px; justify-self:start; order:-1; margin-left:0}.ht-media::before{inset:auto -.9rem -.9rem auto}}

/* ===== segundo apartado: estructura tipográfica de la referencia (titular centrado, texto a la izquierda en columna central) ===== */
.ed.ed-band{padding-block:var(--air); margin:0}
.ed-band .ed-grid.ed-stack{max-width:870px; margin-inline:auto; text-align:left; gap:clamp(2rem,4vw,3rem)}
.ed-band .ed-stack h2{text-align:center; font-weight:400; font-size:clamp(2.2rem,4.2vw,3.4rem); line-height:1.18; letter-spacing:-.02em; max-width:none}
.ed-band .ed-stack h2 em{color:var(--wine)}
.ed-band .ed-pflow{gap:1.3rem}
.ed-band .ed-pflow p{color:var(--ink-soft); font-size:1.14rem; line-height:1.8; text-align:left}
.ed-band .ed-page .ed-close{text-align:center; font-weight:400; margin-top:1.4rem}
@media (max-width:700px){.ed-band .ed-stack h2{text-align:left}.ed-band .ed-page .ed-close{text-align:left}}

/* ===== escala única de titulares de sección (el del inicio aparte) ===== */
#top section h2, .page-view section h2, #blog .blog-head h1{font-size:clamp(2.1rem,4vw,3.2rem)!important; font-weight:300!important; line-height:1.1!important; letter-spacing:-.02em}

/* ===== ritmo vertical único =====
   entre secciones sobre crema: 1 × --gap-s (la mitad arriba de una + la mitad abajo de la otra)
   dentro de una sección, entre bloques: --gap-in (menor que entre secciones)
   las bandas de color conservan su relleno interior */
:root{--gap-half:calc(var(--air) * .55); --gap-in:calc(var(--air) * .7)}
.ed.ed-band, #top > .wp-block-post-content > section.about, #top > .wp-block-post-content > section.cm, #top > .wp-block-post-content > section.faq, #top > .wp-block-post-content > section#blog-teaser{padding-block:var(--gap-half)!important}
#top > .wp-block-post-content > section.divg-envuelto{padding-block:0!important}
.qband{margin-top:var(--gap-half)!important}
.sm-method, .about .panel{margin-top:var(--gap-in)!important}

/* ===== titular del inicio en dos líneas ===== */
.hero-top{padding-top:clamp(1.8rem,3.6vw,3.2rem)!important}
.hero-top .ht-h1{max-width:none!important; font-size:clamp(2.6rem,5.75vw,5.3rem)!important; font-weight:300; line-height:1.04!important; letter-spacing:-.035em; text-wrap:initial}
.hero-top .ht-h1 .u svg{bottom:-.14em}
.hero-top .ht-grid{margin-top:clamp(3rem,6vw,5rem)}
@media (max-width:1100px){.h1-br{display:none}.hero-top .ht-h1{text-wrap:balance}}

/* ===== frase como cinta fina (ref. allkindsoflovetherapy, sin movimiento) ===== */
.qribbon{background:#EECAD1; padding:1.07rem var(--pad); overflow:hidden}
.qr-line{margin:0; display:flex; align-items:center; justify-content:center; text-align:center;
  font-family:var(--body); font-size:clamp(1.15rem,1.66vw,1.6rem); font-weight:400; line-height:1.4; letter-spacing:normal; color:#2E1A26}
@media (max-width:600px){.qribbon{padding-block:1.1rem}}

/* ===== 30/09: dirección en La consulta + franja de prensa ===== */
.cm-addr{font-family:var(--display); font-size:clamp(1.2rem,1.8vw,1.4rem); line-height:1.45; color:var(--ink)!important}
.press-strip{margin-bottom:var(--gap-half)}
.ps-in{display:flex; align-items:center; gap:1rem 3rem; flex-wrap:wrap; padding-block:1.4rem; border-block:1px solid var(--line-strong)}
.ps-lbl{font-size:.66rem; letter-spacing:.24em; text-transform:uppercase; font-weight:700; color:var(--ink-faint)}
.ps-list{display:flex; align-items:baseline; gap:.6rem 2.6rem; flex-wrap:wrap; list-style:none; margin:0; padding:0}
.ps-list a{font-family:var(--display); font-size:clamp(1.15rem,2vw,1.4rem); font-weight:400; color:var(--ink); text-decoration:none; transition:color .2s}
.ps-list a span{font-family:var(--body); font-size:.7rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-faint); margin-left:.5rem}
.ps-list a:hover{color:var(--wine)}

/* párrafo del inicio justificado (en móvil, a la izquierda) */
.ht-text .hero-lead.hl2{max-width:54ch}
.hero-lead .hero-just{text-align:justify; hyphens:auto; -webkit-hyphens:auto}
@media (max-width:600px){.hero-lead .hero-just{text-align:left; hyphens:manual; -webkit-hyphens:manual}}

/* ===== 30/09: aire alrededor de la cinta, dirección con la misma letra, copyright ===== */
.qribbon{margin-top:calc(var(--air) * 1.05)!important}
.ed.ed-band{padding-top:calc(var(--air) * 1.05)!important}
.cm-addr{font-family:var(--body)!important; font-size:1rem!important; line-height:1.72!important; color:var(--ink-soft)!important}
.copy{margin-top:1.2rem; font-size:.78rem; color:var(--ink-faint); text-align:center}

/* ===== páginas legales ===== */
.legal h1{font-size:clamp(2.1rem,4vw,3.2rem); font-weight:300; letter-spacing:-.02em; margin-bottom:2rem}
.legal-body{font-size:1.02rem; line-height:1.8; color:var(--ink-soft)}
.legal-body h2{font-family:var(--display); font-weight:400; font-size:1.4rem; color:var(--wine-deep); margin:2.2rem 0 .6rem}
.legal-body p{margin:0 0 1rem; max-width:68ch}
.legal-body ul{margin:0 0 1rem; padding-left:1.2rem; max-width:68ch}
.legal-body li{margin-bottom:.45rem}
.legal-body b{color:var(--ink); font-weight:600}
.legal-date{margin-top:2.4rem!important; font-size:.85rem; color:var(--ink-faint)}
.consent a{color:inherit; text-decoration:underline}
.legal-table-wrap{overflow-x:auto; margin:0 0 1rem}
.legal-table{border-collapse:collapse; width:100%; font-size:.9rem; min-width:560px}
.legal-table th,.legal-table td{text-align:left; padding:.6rem .7rem; border-bottom:1px solid var(--line); vertical-align:top}
.legal-table th{font-size:.7rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-faint); font-weight:700}


/* ===== header: más contraste en el menú ===== */
.site-nav a:not(.btn){color:#3B342E!important; font-weight:600}
.site-nav a:not(.btn):hover{color:var(--wine)!important}
.brand small{color:#5F5750!important}
.brand-txt{font-weight:500!important; color:#221E1A}

/* ===== menú para pantallas estrechas ===== */
.menu-btn{display:none; margin-left:auto; align-items:center; gap:.6rem; background:none; border:1px solid var(--line-strong); border-radius:12px; padding:.6rem .9rem; cursor:pointer; color:var(--ink); font-family:var(--body); font-size:.7rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase}
.menu-btn .bars{display:grid; gap:4px; width:18px}
.menu-btn .bars span{display:block; height:1.5px; background:currentColor; transition:transform .3s ease, opacity .2s ease}
.menu-btn[aria-expanded="true"] .bars span:nth-child(1){transform:translateY(5.5px) rotate(45deg)}
.menu-btn[aria-expanded="true"] .bars span:nth-child(2){opacity:0}
.menu-btn[aria-expanded="true"] .bars span:nth-child(3){transform:translateY(-5.5px) rotate(-45deg)}
@media (max-width:940px){.site-nav{display:none!important}.menu-btn{display:inline-flex}}
.mnav{position:fixed; inset:0; z-index:39; background:var(--cream); padding:calc(96px + env(safe-area-inset-top,0px)) var(--pad) calc(2rem + env(safe-area-inset-bottom,0px)); display:flex; flex-direction:column; gap:2rem; overflow-y:auto}
.mnav[hidden]{display:none}
.mnav ul{list-style:none; margin:0; padding:0; display:grid}
.mnav li a{display:flex; justify-content:space-between; align-items:baseline; padding:1rem 0; border-bottom:1px solid var(--line); text-decoration:none; font-family:var(--display); font-size:1.8rem; font-weight:300; color:var(--ink)}
.mnav li a::after{content:"\2192"; font-family:var(--body); font-size:1rem; color:var(--wine)}
.mnav .btn{align-self:stretch; justify-content:center}
body.menu-open{overflow:hidden}
#top > .wp-block-post-content > section, #top > .wp-block-post-content > div{scroll-margin-top:84px}

/* ===== titular del inicio centrado (ref. composición Dribbble) ===== */
.hero-top .ht-head{text-align:center; display:flex; flex-direction:column; align-items:center}
.hero-top .ht-head .eyebrow{justify-content:center}
.hero-top .ht-head .eyebrow::after{content:""; width:2.4rem; height:1px; background:currentColor; opacity:.55}
.hero-top .ht-h1{text-align:center; margin-inline:auto}
.hero-top .ht-grid{margin-top:clamp(3.4rem,6.5vw,5.5rem)!important}
@media (max-width:700px){.hero-top .ht-head{text-align:left; align-items:flex-start}.hero-top .ht-head .eyebrow::after{display:none}.hero-top .ht-h1{text-align:left}}

/* ===== inicio con la composición de la referencia: texto a la izquierda y foto vertical a la derecha, centrados como bloque ===== */
.hero-top{padding-block:clamp(2rem,4vw,3.5rem) 0!important}
.hero-top .ht-grid{margin-top:0!important; grid-template-columns:minmax(0,540px) minmax(0,450px)!important; justify-content:center; gap:clamp(3rem,7vw,7rem)!important; align-items:center}
.hero-top .ht-text{text-align:left}
.hero-top .ht-text .eyebrow{justify-content:flex-start}
.hero-top .ht-text .eyebrow::after{display:none}
.hero-top .ht-text .ht-h1{text-align:left!important; font-size:clamp(2.4rem,3.4vw,3.2rem)!important; line-height:1.08!important; margin:0 0 clamp(1.6rem,3vw,2.2rem)!important; text-wrap:balance}
.hero-top .h1-br{display:none}
.hero-top .ht-media{max-width:450px!important; width:100%; justify-self:end}
.hero-top .ht-media .hero-fig{aspect-ratio:450/620!important}
.hero-top .hero-lead.hl2{max-width:none!important}
@media (max-width:860px){.hero-top .ht-grid{grid-template-columns:1fr!important}.hero-top .ht-media{justify-self:start; max-width:340px!important}}

/* ===== página del blog: rejilla editorial ===== */
#blogGrid{grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(2rem,3.4vw,3rem) clamp(1.4rem,2.6vw,2.4rem); align-items:start}
#blogGrid .post{gap:.75rem}
#blogGrid .post figure{margin:0; border-radius:14px}
#blogGrid .post .meta{color:var(--wine); font-weight:700}
#blogGrid .post h3{font-size:clamp(1.3rem,1.8vw,1.55rem); line-height:1.18}
#blogGrid .post .excerpt{line-height:1.65}
#blogGrid .read{margin-top:.2rem; font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; font-weight:700; color:var(--wine); transition:transform .3s ease}
#blogGrid .post:hover .read{transform:translateX(4px)}
/* destacado: a todo el ancho, imagen grande a la izquierda */
#blogGrid .post:nth-child(1){grid-column:1 / -1; display:grid; grid-template-columns:1.3fr 1fr; column-gap:clamp(2rem,4.5vw,4rem); align-items:center;
  padding-bottom:clamp(2rem,3.4vw,3rem); border-bottom:1px solid var(--line-strong)}
#blogGrid .post:nth-child(1) figure{grid-row:1 / span 5}
#blogGrid .post:nth-child(1) figure::before{padding-bottom:64%}
#blogGrid .post:nth-child(1) h3{font-size:clamp(1.9rem,3.2vw,2.7rem); line-height:1.08; font-weight:300}
#blogGrid .post:nth-child(1) .excerpt{font-size:1.08rem; max-width:44ch}
/* segundo: vertical, ocupa dos filas */
#blogGrid .post:nth-child(2){grid-row:span 2; align-self:stretch; display:flex; flex-direction:column}
#blogGrid .post:nth-child(2) figure{flex:1 1 auto; min-height:320px}
#blogGrid .post:nth-child(2) figure::before{padding-bottom:0}
#blogGrid .post:nth-child(2) h3{font-size:clamp(1.5rem,2.2vw,1.9rem)}
@media (max-width:900px){#blogGrid{grid-template-columns:1fr 1fr}#blogGrid .post:nth-child(2){grid-row:auto; display:grid}#blogGrid .post:nth-child(2) figure{min-height:0}#blogGrid .post:nth-child(2) figure::before{padding-bottom:75%}}
@media (max-width:640px){#blogGrid{grid-template-columns:1fr}#blogGrid .post:nth-child(1){grid-template-columns:1fr; row-gap:.75rem}#blogGrid .post:nth-child(1) figure{grid-row:auto}}

/* más aire entre "Después de los 40" y "Sobre mí" */
#top > .wp-block-post-content > section.about{padding-top:calc(var(--air) * 1.05)!important}

/* ===== ritmo vertical revisado (02/10) =====
   entre dos secciones crema: 2 × --gap-half (~160 px)
   entre contenido y una banda o panel de color: --gap-band (~150 px) */
:root{--gap-band:calc(var(--air) * 1.05)}
#top > .wp-block-post-content > section.area, #top > .wp-block-post-content > section.rev, #top > .wp-block-post-content > section.contact{margin-block:calc(var(--gap-band) - var(--gap-half))!important}
#top > .wp-block-post-content > section.contact{margin-bottom:0!important}
#top > .wp-block-post-content > section.about{padding-top:var(--gap-half)!important}
.press-strip{margin-top:var(--gap-half)!important; margin-bottom:var(--gap-band)!important}
#top > .wp-block-post-content > section#blog-teaser{padding-top:var(--gap-band)!important}
.site-foot{padding-top:var(--gap-band)!important}

/* ===== ajuste óptico de la mitad inferior (02/10): secciones más ligeras → más aire ===== */
:root{--gap-low:calc(var(--air) * 1.3)}
#top > .wp-block-post-content > section.cm{padding-top:calc(var(--gap-low) - var(--gap-half))!important; padding-bottom:var(--gap-half)!important}
#top > .wp-block-post-content > section.faq{padding-bottom:var(--gap-half)!important}
.press-strip{margin-top:calc(var(--gap-low) - var(--gap-half))!important; margin-bottom:var(--gap-half)!important}
#top > .wp-block-post-content > section#blog-teaser{padding-top:var(--gap-low)!important; padding-bottom:var(--gap-half)!important}
#top > .wp-block-post-content > section.contact{margin-top:calc(var(--gap-low) - var(--gap-half))!important}

/* ===== vida en las imágenes: aparición tipo telón + relieve que se eleva al pasar el ratón ===== */
.mfig{transition:transform .5s cubic-bezier(.2,.8,.3,1), box-shadow .5s ease}
.mfig.m-wait{clip-path:inset(100% 0 0 0 round 14px)}
.mfig.m-wait img{transform:scale(1.08)}
.mfig.m-in{clip-path:inset(0 0 0 0 round 14px); transition:clip-path 1.4s cubic-bezier(.65,0,.35,1), transform .5s cubic-bezier(.2,.8,.3,1), box-shadow .5s ease}
.mfig.m-in img:not(.px){transform:scale(1); transition:transform 1.8s cubic-bezier(.2,.7,.2,1)}
.area .mfig.m-wait{clip-path:inset(100% 0 0 0)} .area .mfig.m-in{clip-path:inset(0 0 0 0)}
@media (hover:hover){
  .hero-media:hover .hero-fig, .sm-portrait:hover figure, .sm-method figure:hover{transform:translateY(-6px);
    box-shadow:0 10px 18px -8px rgba(34,30,26,.22), 0 40px 60px -24px rgba(94,18,51,.36)}
  .hero-media::before, .sm-portrait::before{transition:transform .6s cubic-bezier(.2,.8,.3,1)}
  .hero-media:hover::before{transform:translate(8px,8px)}
  .sm-portrait:hover::before{transform:translate(-8px,-8px)}
}
@media (prefers-reduced-motion:reduce){.mfig.m-wait{clip-path:none}.mfig.m-wait img{transform:none}.mfig{transition:none!important}}

/* ===== blog: tarjetas tipo revista (ref. Real Life) con la estética de la web ===== */
main#blog{background:#EFE3D4}
main#blog .blog-head{padding-bottom:clamp(1.6rem,3vw,2.4rem)}
#blogGrid{grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:clamp(1.6rem,3.6vw,3.4rem)!important; align-items:stretch!important; max-width:1040px; margin-inline:auto; padding-bottom:var(--air)}
#blogGrid .post, #blogGrid .post:nth-child(1), #blogGrid .post:nth-child(2){grid-column:auto!important; grid-row:auto!important; display:flex!important; flex-direction:column; align-items:stretch!important; text-align:left; gap:0!important;
  background:var(--cream); border-radius:22px; overflow:hidden; padding:0!important; border:0!important;
  box-shadow:0 30px 56px -34px rgba(92,64,40,.40), 0 8px 18px -10px rgba(92,64,40,.16), inset 0 3px 8px rgba(255,255,255,.6);
  transition:transform .45s cubic-bezier(.2,.8,.3,1), box-shadow .45s ease}
#blogGrid .post:hover{transform:translateY(-6px); box-shadow:0 40px 70px -36px rgba(94,18,51,.42), 0 10px 20px -10px rgba(94,18,51,.18), inset 0 3px 8px rgba(255,255,255,.6)}
#blogGrid .post figure, #blogGrid .post:nth-child(1) figure, #blogGrid .post:nth-child(2) figure{grid-row:auto!important; flex:0 0 auto!important; min-height:0!important; border-radius:0!important; box-shadow:none!important; margin:0}
#blogGrid .post figure::before, #blogGrid .post:nth-child(1) figure::before, #blogGrid .post:nth-child(2) figure::before{padding-bottom:60%!important}
#blogGrid .post > :not(figure){margin-inline:clamp(1.4rem,2.6vw,2.1rem)}
#blogGrid .post .meta{margin-top:clamp(1.3rem,2.2vw,1.7rem)}
#blogGrid .post h3, #blogGrid .post:nth-child(1) h3, #blogGrid .post:nth-child(2) h3{font-size:clamp(1.6rem,2.4vw,2.1rem)!important; font-weight:300!important; line-height:1.12!important; margin-top:.55rem}
#blogGrid .post .excerpt, #blogGrid .post:nth-child(1) .excerpt{font-size:1.04rem!important; line-height:1.7; margin-top:.9rem; max-width:none!important}
#blogGrid .post .read{margin-top:auto; padding-top:1.4rem; margin-bottom:clamp(1.4rem,2.4vw,1.9rem)}
@media (max-width:760px){#blogGrid{grid-template-columns:1fr!important}}

/* ===== 02/10: inicio, segundo apartado y «Cómo es el proceso» ===== */
.hero-top .hero-cred{color:#3B342E; font-weight:600}
.ed-band .ed-page .ed-close{margin-top:clamp(3.4rem,6vw,5.2rem)}
#top > .wp-block-post-content > section.pr{padding-top:calc(var(--gap-low) - var(--gap-half)); padding-bottom:var(--gap-half)}
.pr-defs{position:absolute; width:0; height:0; overflow:hidden}
.pr .eyebrow{margin-bottom:1.2rem}
.pr-h2 em{font-style:italic; color:var(--wine)}
.pr-steps{list-style:none; margin:clamp(2.4rem,4vw,3.4rem) 0 0; padding:0; display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1.6rem,3.4vw,3rem); counter-reset:none}
.pr-step{display:flex; flex-direction:column; align-items:flex-start}
.pr-ill{margin:0 0 1.4rem; width:clamp(9rem,13vw,11.5rem); aspect-ratio:1/1; border-radius:18px; background:var(--cream-2); display:grid; place-items:center; overflow:hidden;
  box-shadow:0 30px 56px -34px rgba(92,64,40,.40), 0 8px 18px -10px rgba(92,64,40,.16), inset 0 3px 8px rgba(255,255,255,.6)}
.pr-ill{position:relative}
.pr-ill svg{position:absolute; left:0; top:7%; width:100%; height:86%; display:block; overflow:visible}
.pr-num{font-family:var(--body); font-size:.72rem; letter-spacing:.28em; font-weight:700; color:var(--wine)}
.pr-step h3{font-family:var(--display); font-weight:300; font-size:clamp(1.5rem,2.2vw,1.8rem); line-height:1.2; color:var(--wine-deep); margin:.5rem 0 .7rem}
.pr-step p{margin:0; color:var(--ink-soft); font-size:1.06rem; text-wrap:pretty}
.pr-grow{transform-box:fill-box; transform-origin:50% 100%; opacity:0; transform:scale(.82) translateY(6px);
  transition:opacity 1.2s ease .55s, transform 1.6s cubic-bezier(.2,.8,.3,1) .55s}
.pr-step.on .pr-grow{opacity:1; transform:none}
.pr-step.d2 .pr-grow{transition-delay:.85s}
@media (max-width:860px){.pr-steps{grid-template-columns:1fr; max-width:30rem}}
@media (prefers-reduced-motion:reduce){.pr-grow{opacity:1; transform:none; transition:none}}

/* ===== 02/10: fotos que «respiran» — aparición suave y acercamiento lento al pasar el ratón ===== */
.mfig.m-wait, .area .mfig.m-wait{clip-path:none!important; opacity:0}
.mfig.m-wait img{scale:1.05}
.mfig.m-in, .area .mfig.m-in{clip-path:none!important; opacity:1; transition:opacity 1.6s ease, box-shadow 1.2s ease!important}
.mfig img{transition:scale 2.4s cubic-bezier(.2,.7,.2,1)}
.mfig.m-in img:not(.px){transform:none}
@media (hover:hover){
  .hero-media:hover .hero-fig, .sm-portrait:hover figure, .sm-method figure:hover{transform:none!important}
  .hero-media:hover::before, .sm-portrait:hover::before{transform:none!important}
  .mfig:hover img, .hero-media:hover .mfig img, .sm-portrait:hover .mfig img, #blogGrid .post:hover .mfig img, #blog-teaser .post:hover .mfig img{scale:1.04; transition:scale 1.8s cubic-bezier(.2,.7,.2,1)}
}
@media (prefers-reduced-motion:reduce){.mfig.m-wait{opacity:1}.mfig img,.mfig:hover img{scale:1!important; transition:none!important}}

/* 02/10: en móvil, primero el texto del inicio y debajo la foto */
@media (max-width:860px){.hero-top .ht-media{order:2!important; margin-top:clamp(2.2rem,8vw,3rem)}.hero-top .ht-text{order:1}}

@media (max-width:860px){.area .area-grid > figure{order:2}.area .area-grid > .txt{order:1}}

/* ===== 02/10: páginas «Sobre mí» y «Divulgación» + títulos enlazados ===== */
.h2link{color:inherit; text-decoration:none; transition:color .3s ease}
.h2link:hover{color:var(--wine-deep)}
.h2-arrow{color:var(--wine); font-size:.6em; display:inline-block; vertical-align:middle; transition:transform .35s cubic-bezier(.2,.8,.3,1)}
.h2link:hover .h2-arrow{transform:translateX(5px)}
.page-view .h2-arrow{display:none}
.page-view .h2link{pointer-events:none}
#pag-sobre > .wp-block-post-content > section.about{padding-top:clamp(3rem,7vw,5rem)!important}
#pag-sobre > .wp-block-post-content > section.pr{padding-top:calc(var(--gap-low) - var(--gap-half))!important; padding-bottom:var(--gap-low)!important}
#pag-divulgacion > .wp-block-post-content > section.divg{padding-top:0!important; padding-bottom:var(--gap-low)!important}
#pag-divulgacion .pg-head .blog-head{padding-bottom:clamp(1.6rem,3vw,2.4rem)}
#pag-divulgacion .blog-head h1 em{color:var(--wine)}

#pag-divulgacion .panel-env{padding-top:72px}
#pag-divulgacion .panel-env > .posts-head:first-of-type{margin-top:0}
#pag-sobre > .wp-block-post-content > section.about{padding-bottom:var(--gap-half)!important}
/* 02/10: volver al inicio desde las páginas */
.pg-backbar{padding-top:clamp(1.6rem,3vw,2.4rem)}
.pg-back{display:inline-flex; text-decoration:none}
#pag-sobre > .wp-block-post-content > section.about{padding-top:clamp(1.4rem,3vw,2.4rem)!important}
#pag-divulgacion .blog-head, #blog .blog-head{padding-top:clamp(1.4rem,3vw,2.4rem)}

.site-nav a, .site-nav .btn{white-space:nowrap}
.site-nav{gap:1.6rem!important}
@media (max-width:1240px){.site-nav{display:none!important}.menu-btn{display:inline-flex!important}}

/* 02/10: «No tienes por qué…» igual que la frase anterior */
.hero-lead.hl2 .hero-no{font-family:var(--display)!important; font-style:normal!important; font-weight:400!important; font-size:clamp(1.35rem,2.2vw,1.65rem)!important; line-height:1.32!important; color:var(--ink)!important; border-left:0!important; padding-left:0!important}

/* 02/10: segundo apartado — columna de texto más estrecha y justificada, para que se lea centrada bajo el título */
@media (min-width:701px){
  .ed-band .ed-pflow{max-width:740px; margin-inline:auto}
  .ed-band .ed-pflow p{text-align:justify!important; hyphens:auto; -webkit-hyphens:auto}
}

/* 02/10: iconos clásicos de la primera maqueta (maceta con brote, capullo y flor) */
.pr-ill{width:auto!important; aspect-ratio:auto!important; background:none!important; box-shadow:none!important; border-radius:0!important; overflow:visible!important; display:block!important; margin:0 0 1rem!important; color:#6B7F4E}
.pr-ill svg{position:static!important; width:76px!important; height:76px!important; display:block; margin-left:-8px}
.pr-grow{transform:scale(.6) translateY(8%)}

/* 02/10: iconos del proceso en un solo color (fresa), solo línea */
.pr-ill{color:#3B342E!important}
.pr-ill svg, .pr-ill svg g{--c-leaf:currentColor!important; --c-petal:currentColor!important; --c-heart:currentColor!important; --f-leaf:none!important; --f-petal:none!important}

/* 02/10: un toque de color en hojas y flor (el trazo sigue en gris) */
.pr-ill .ic-leaf{fill:#CFD8B6}
.pr-ill .ic-petal{fill:#F2CDD5}
.pr-ill .ic-heart{fill:#EBCB83}

@media (min-width:701px){.pr-step p{text-align:justify; hyphens:auto; -webkit-hyphens:auto}}

/* 02/10: crecimiento por pasos — tallo que se dibuja, hojas que se abren, flor al final; un icono tras otro */
.pr-steps > .pr-step:nth-child(1){--b:.15s}
.pr-steps > .pr-step:nth-child(2){--b:.7s}
.pr-steps > .pr-step:nth-child(3){--b:1.25s}
.pr-ill .pr-grow, .pr-step.on .pr-ill .pr-grow{opacity:1!important; transform:none!important; transition:none!important}
.pr-ill .ic-stem{stroke-dasharray:1; stroke-dashoffset:1; transition:stroke-dashoffset .55s cubic-bezier(.4,.1,.3,1) var(--b,0s)}
.pr-ill .ic-leaf, .pr-ill .ic-petal, .pr-ill .ic-heart{transform-box:fill-box; opacity:0; transform:scale(.2);
  transition:transform .55s cubic-bezier(.2,.9,.3,1.15) calc(var(--b,0s) + .35s), opacity .35s ease calc(var(--b,0s) + .35s)}
.pr-ill .ic-leaf-l{transform-origin:100% 100%}
.pr-ill .ic-leaf-r{transform-origin:0% 100%}
.pr-ill .ic-petal, .pr-ill .ic-heart{transform-origin:50% 100%; transition-delay:calc(var(--b,0s) + .6s)}
.pr-ill .ic-heart{transform-origin:50% 50%}
.pr-step.on .pr-ill .ic-stem{stroke-dashoffset:0}
.pr-step.on .pr-ill .ic-leaf, .pr-step.on .pr-ill .ic-petal, .pr-step.on .pr-ill .ic-heart{opacity:1; transform:none}
@media (prefers-reduced-motion:reduce){.pr-ill .ic-stem{stroke-dashoffset:0; transition:none}.pr-ill .ic-leaf,.pr-ill .ic-petal,.pr-ill .ic-heart{opacity:1; transform:none; transition:none}}

/* 03/10: enlace «Ver en el mapa» en la tarjeta de Madrid */
.cm-map{display:inline-flex; align-items:center; gap:.55rem; margin-top:.4rem; justify-self:start; font-family:var(--body); font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; font-weight:700; color:var(--wine); text-decoration:none; padding-bottom:.25rem; border-bottom:1px solid rgba(138,31,75,.28); transition:color .3s ease, border-color .3s ease}
.cm-map svg{width:17px; height:17px; flex:none; margin-top:-2px}
.cm-map-arr{font-size:.95rem; letter-spacing:0; transition:transform .35s cubic-bezier(.2,.8,.3,1)}
.cm-map:hover{color:var(--wine-deep); border-bottom-color:var(--wine-deep)}
.cm-map:hover .cm-map-arr{transform:translate(2px,-2px)}

/* ===== contacto: vías claras (24/09) ===== */
.ways-lbl{margin-top:2rem; font-size:.66rem; letter-spacing:.22em; text-transform:uppercase; font-weight:700; color:var(--rose-soft)}
.ways{list-style:none; margin:1rem 0 0; padding:0; display:grid; gap:.8rem; max-width:26rem}
.way{display:grid; grid-template-columns:auto 1fr; column-gap:1rem; align-items:center; text-decoration:none; color:var(--cream);
  background:rgba(247,242,231,.08); border:1px solid rgba(247,242,231,.22); border-radius:16px; padding:.85rem 1.1rem;
  box-shadow:inset 0 2px 6px rgba(255,255,255,.08), 0 14px 26px -20px rgba(0,0,0,.5); transition:background .25s ease, transform .25s ease}
.way:hover{background:rgba(247,242,231,.16); transform:translateY(-2px)}
.way-ic{grid-row:span 2; width:42px; height:42px; border-radius:50%; background:var(--cream); color:var(--wine); display:grid; place-items:center}
.way-ic svg{width:20px; height:20px}
.way-t{font-family:var(--display); font-size:1.3rem; line-height:1.1}
.way-d{font-size:.82rem; color:rgba(247,242,231,.8)}
.hero-wa{font-size:.74rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--wine); text-decoration:none; border-bottom:1px solid currentColor; padding-bottom:.2rem}
.hero-wa:hover{color:var(--wine-deep)}
.hero-cta .hero-cred{flex-basis:100%}
/* WhatsApp flotante: lateral derecho, siempre visible; etiqueta en escritorio */
.wa{right:1.1rem; left:auto; bottom:calc(1.1rem + env(safe-area-inset-bottom,0px)); width:auto; min-width:3.4rem; padding:0 .95rem; gap:.55rem; display:flex; align-items:center; justify-content:center; border-radius:100px}
.wa-lbl{font-family:var(--body); font-size:.7rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; order:2}
.wa{padding:0; width:3.4rem}


/* ===== foto del inicio: brazo con enredadera ===== */
.hero-fig img{object-position:50% 38%}

/* selector de tono (solo para la revisión) */
.tone-pick{position:fixed; left:1rem; bottom:calc(1rem + env(safe-area-inset-bottom,0px)); z-index:70; display:flex; align-items:center; gap:.5rem; flex-wrap:wrap;
  background:var(--cream); border:1px solid var(--line-strong); border-radius:100px; padding:.45rem .6rem .45rem 1rem; box-shadow:0 14px 34px -16px rgba(34,30,26,.4); font-size:.72rem; color:var(--ink-soft); max-width:calc(100vw - 6rem)}
.tone-pick b{font-size:.62rem; letter-spacing:.18em; text-transform:uppercase; color:var(--ink); margin-right:.2rem}
.tone-pick button{display:inline-flex; align-items:center; gap:.4rem; border:1px solid transparent; background:none; border-radius:100px; padding:.35rem .7rem; cursor:pointer; font:inherit; color:var(--ink-soft)}
.tone-pick button span{width:14px; height:14px; border-radius:50%; box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}
@media (max-width:600px){.tone-pick{flex-wrap:nowrap; padding:.35rem .4rem; gap:.1rem}.tone-pick b{display:none}.tone-pick button{padding:.35rem .55rem}}
.tone-pick button[aria-pressed="true"]{border-color:var(--wine); color:var(--wine); font-weight:700}


/* Blog: tarjeta estilo polaroid (reborde crema alrededor de la foto), como la de la charla */
#blogGrid .post figure, #blogGrid .post:nth-child(1) figure, #blogGrid .post:nth-child(2) figure{
  margin:clamp(1.05rem,1.9vw,1.4rem) clamp(1.05rem,1.9vw,1.4rem) 0!important; border-radius:12px!important; overflow:hidden;
  box-shadow:inset 0 0 0 1px rgba(92,64,40,.06)!important}
#blogGrid .post > :not(figure){margin-inline:clamp(1.5rem,2.8vw,2.2rem)}
#blogGrid{padding-top:clamp(.6rem,1.2vw,1rem)!important}
@media (min-width:701px){ #blogGrid .post figure::before, #blogGrid .post:nth-child(1) figure::before, #blogGrid .post:nth-child(2) figure::before{padding-bottom:50%!important} }
#blog .blog-head{padding-top:clamp(.4rem,1vw,.8rem)!important; padding-bottom:clamp(1rem,1.8vw,1.5rem)!important}
/* Titular del blog */
#blog .blog-head h1.blog-title{max-width:none; text-wrap:balance}
#blog .blog-head h1.blog-title em{font-style:italic; color:var(--wine); font-weight:300}
@media (min-width:761px){ #blog .blog-head h1.blog-title{white-space:nowrap} }
/* Sin "Volver al inicio": el logo y el menú llevan a la portada. Recolocar el aire de arriba */
#blog .blog-head{padding-top:clamp(2rem,4vw,3rem)!important}
#pag-divulgacion .blog-head{padding-top:clamp(2rem,4vw,3rem)!important}
.legal.article-wrap{padding-top:clamp(2.4rem,5vw,3.6rem)}
/* Cierre del artículo + "Sigue leyendo" */
.a-cta{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1.2rem 2rem}
.a-cta-txt{font-family:var(--display); font-style:italic; font-weight:300; font-size:clamp(1.2rem,2.2vw,1.45rem); color:var(--wine-deep); margin:0}
#article .article-wrap{padding-bottom:clamp(2.4rem,5vw,3.6rem)}
.a-more{padding-top:clamp(2.6rem,5vw,4rem); padding-bottom:var(--air)}
.a-more-h{font-size:clamp(1.8rem,3.4vw,2.6rem); font-weight:300; margin-bottom:clamp(1.4rem,2.6vw,2rem)}
.a-more-h em{color:var(--wine); font-weight:300}
.a-more-grid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(1.2rem,2.4vw,2rem)}
.a-more .post{display:flex; flex-direction:column; text-decoration:none; color:inherit; background:var(--cream); border-radius:22px; overflow:hidden;
  box-shadow:0 30px 56px -34px rgba(92,64,40,.40), 0 8px 18px -10px rgba(92,64,40,.16), inset 0 3px 8px rgba(255,255,255,.6);
  transition:transform .45s cubic-bezier(.2,.8,.3,1), box-shadow .45s ease}
.a-more .post:hover{transform:translateY(-6px)}
.a-more .post figure{position:relative; margin:clamp(.9rem,1.6vw,1.2rem) clamp(.9rem,1.6vw,1.2rem) 0; border-radius:12px; overflow:hidden; box-shadow:none}
.a-more .post figure::before{padding-bottom:62%}
.a-more .post .meta{margin:1.1rem clamp(1.2rem,2.2vw,1.6rem) 0; color:var(--wine); font-weight:700}
.a-more .post h3{margin:.4rem clamp(1.2rem,2.2vw,1.6rem) clamp(1.3rem,2.2vw,1.7rem); font-size:clamp(1.2rem,1.7vw,1.4rem); line-height:1.18}
.a-more .post .read{display:none}
.a-more-all{margin-top:clamp(1.6rem,3vw,2.2rem)}
@media (max-width:860px){ .a-more-grid{grid-template-columns:1fr 1fr} .a-more-grid .post:nth-child(3){display:none} }
@media (max-width:560px){ .a-more-grid{grid-template-columns:1fr} }
/* Artículo: columna de lectura más ancha */
#article .article-wrap{max-width:900px}
#article .a-more.article-wrap{padding-top:clamp(2.4rem,5vw,3.4rem); padding-bottom:var(--air)}
#article .a-body p{max-width:none}
#article .a-body{font-size:1.1rem}
/* Autora bajo el artículo */
.a-author{display:grid; grid-template-columns:96px 1fr; gap:1.4rem; align-items:start; margin-top:clamp(2.6rem,5vw,3.6rem); padding-top:clamp(2rem,4vw,2.6rem); border-top:1px solid var(--line-strong)}
.a-author-img{width:96px; height:96px; border-radius:50%; object-fit:cover; object-position:50% 25%; background:var(--cream-2);
  box-shadow:0 0 0 5px var(--cream), 0 12px 24px -12px rgba(92,64,40,.5)}
.a-author-k{font-family:var(--body); font-size:.64rem; letter-spacing:.22em; text-transform:uppercase; font-weight:700; color:var(--wine); margin:0}
.a-author-n{font-family:var(--display); font-weight:300; font-size:1.45rem; line-height:1.15; color:var(--ink); margin:.3rem 0 .6rem}
.a-author-n em{color:var(--wine)}
.a-author-d{font-size:.92rem; line-height:1.65; color:var(--ink-soft); margin:0}
.a-author-c{margin:.8rem 0 0; font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-faint)}
.a-author-c a{color:var(--wine); text-decoration:none; font-weight:700}
.a-author-c a:hover{color:var(--wine-deep)}
@media (max-width:560px){ .a-author{grid-template-columns:72px 1fr; gap:1rem} .a-author-img{width:72px; height:72px} }
/* Contacto breve bajo el artículo — versión ligera en rosa suave */
.a-contact{margin-top:clamp(2rem,4vw,2.8rem); background:var(--rose-soft); color:var(--ink); border-radius:24px; padding:clamp(1.5rem,3.4vw,2.2rem) clamp(1.5rem,3.6vw,2.4rem);
  box-shadow:0 22px 44px -30px rgba(94,18,51,.35), inset 0 3px 8px rgba(255,255,255,.55)}
.a-contact h2{font-family:var(--display); font-weight:300; font-size:clamp(1.5rem,2.8vw,1.95rem); color:var(--ink); margin:0}
.a-contact h2 em{color:var(--wine)}
.a-contact-lead{margin:.5rem 0 0; color:var(--ink-soft); font-size:.95rem; max-width:56ch}
.a-contact .ways{grid-template-columns:1fr 1fr; max-width:none; margin-top:1.1rem; gap:.7rem}
.a-contact .way{background:var(--cream); border:0; color:var(--ink); padding:.75rem 1rem; border-radius:14px;
  box-shadow:0 10px 20px -14px rgba(94,18,51,.45), inset 0 2px 5px rgba(255,255,255,.7)}
.a-contact .way:hover{background:#fff}
.a-contact .way-ic{width:36px; height:36px; background:var(--wine); color:var(--cream)}
.a-contact .way-ic svg{width:17px; height:17px}
.a-contact .way-t{font-size:1.1rem; color:var(--wine-deep)}
.a-contact .way-d{color:var(--ink-soft); font-size:.78rem}
.a-contact-mini{margin:.9rem 0 0; font-size:.74rem; color:var(--ink-faint); line-height:1.5}
@media (max-width:640px){ .a-contact .ways{grid-template-columns:1fr} }
/* "Otros artículos": formato compacto (miniatura + título) para no recargar */
.a-more{padding-top:clamp(2.6rem,5vw,3.6rem)}
.a-more-h{font-size:clamp(1.5rem,2.6vw,1.9rem)!important; margin-bottom:clamp(1.1rem,2vw,1.5rem)}
.a-more .post{display:grid!important; grid-template-columns:76px 1fr; align-items:center; column-gap:.9rem; padding:.6rem; border-radius:18px;
  box-shadow:0 14px 28px -20px rgba(92,64,40,.45), inset 0 2px 6px rgba(255,255,255,.6)}
.a-more .post figure{margin:0!important; width:76px; border-radius:12px}
.a-more .post figure::before{padding-bottom:100%!important}
.a-more .post .meta{display:none!important}
.a-more .post h3{margin:0!important; align-self:center; font-size:1.05rem!important; line-height:1.22}
.a-more-all{margin-top:1.2rem}
@media (max-width:860px){ .a-more-grid{grid-template-columns:1fr!important} .a-more-grid .post:nth-child(3){display:grid!important} }
/* Divulgación: la foto se mueve como las demás (marco que recorta + parallax suave) */
.dv-foto .dv-clip{display:block; position:relative; overflow:hidden; border-radius:20px;
  box-shadow:0 22px 40px -22px rgba(var(--pshadow,92,64,40),.42), 0 6px 12px -6px rgba(var(--pshadow,92,64,40),.16)}
.dv-foto .dv-clip img{border-radius:0!important; box-shadow:none!important}
@media (max-width:700px){ .dv-foto .dv-clip{border-radius:12px; box-shadow:none} }
/* "Sin sorpresas y a tu ritmo": las flores crecen un poco más rápido */
.pr-steps > .pr-step:nth-child(1){--b:.1s}
.pr-steps > .pr-step:nth-child(2){--b:.52s}
.pr-steps > .pr-step:nth-child(3){--b:.94s}
.pr-ill .ic-stem{transition-duration:.42s}
.pr-ill .ic-leaf, .pr-ill .ic-petal, .pr-ill .ic-heart{transition:transform .42s cubic-bezier(.2,.9,.3,1.15) calc(var(--b,0s) + .26s), opacity .28s ease calc(var(--b,0s) + .26s)}
.pr-ill .ic-petal, .pr-ill .ic-heart{transition-delay:calc(var(--b,0s) + .45s)}
@media (prefers-reduced-motion:reduce){ .pr-ill .ic-stem, .pr-ill .ic-leaf, .pr-ill .ic-petal, .pr-ill .ic-heart{transition:none!important} }
.copy a{color:inherit; text-decoration:underline; text-decoration-color:var(--line-strong); text-underline-offset:3px}
.copy a:hover{color:var(--wine); text-decoration-color:currentColor}
.copy-sep{margin-inline:.35rem}
/* "Otros artículos": un poco más grandes (06/10) */
.a-more .post{grid-template-columns:108px 1fr!important; column-gap:1.05rem!important; padding:.8rem!important; border-radius:20px!important}
.a-more .post figure{width:108px!important; border-radius:14px!important}
.a-more .post h3{font-size:1.18rem!important; line-height:1.22}
.a-more-grid{gap:clamp(1rem,2vw,1.4rem)!important}
@media (min-width:861px){ #article .a-more.article-wrap{max-width:1040px} }
/* Categorías del blog: fila de etiquetas bajo el titular.
   En WordPress: se generan solas con las categorías que tengan entradas; si no hay ninguna (o solo "Sin categoría"), la fila no se pinta. */
.blog-cats{display:flex; flex-wrap:wrap; gap:.6rem; margin:0 auto clamp(1.4rem,2.4vw,2rem); max-width:1180px}
.blog-cats button{font-family:var(--body); font-size:.7rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:var(--wine-deep); background:var(--cream); border:0; border-radius:999px; padding:.72rem 1.25rem; cursor:pointer;
  box-shadow:0 8px 16px -10px rgba(92,64,40,.38), 0 2px 5px -3px rgba(92,64,40,.18), inset 0 2px 5px rgba(255,255,255,.7);
  transition:transform .25s ease, box-shadow .25s ease, background .25s ease, color .25s ease}
.blog-cats button:hover{transform:translateY(-2px); color:var(--wine)}
.blog-cats button.active{background:var(--wine); color:var(--cream);
  box-shadow:0 10px 18px -10px rgba(94,18,51,.6), inset 0 2px 4px rgba(255,255,255,.18)}
#blogGrid .post[hidden]{display:none!important}
@media (max-width:760px){
  .blog-cats{flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; margin-inline:calc(var(--pad) * -1); padding:.3rem var(--pad) .9rem; margin-bottom:.6rem}
  .blog-cats::-webkit-scrollbar{display:none}
  .blog-cats button{flex:0 0 auto}
}
/* Blog en tres columnas en ordenador */
@media (min-width:1000px){
  #blogGrid{grid-template-columns:repeat(3,minmax(0,1fr))!important; max-width:1180px; gap:clamp(1.4rem,2.4vw,2.2rem)!important}
  #blogGrid .post figure::before, #blogGrid .post:nth-child(1) figure::before, #blogGrid .post:nth-child(2) figure::before{padding-bottom:66%!important}
  #blogGrid .post h3, #blogGrid .post:nth-child(1) h3, #blogGrid .post:nth-child(2) h3{font-size:clamp(1.35rem,1.75vw,1.6rem)!important}
  #blogGrid .post .excerpt, #blogGrid .post:nth-child(1) .excerpt{font-size:.98rem!important}
}
/* Foto introductoria de Divulgación (Carmen en una charla), sin texto.
   Ordenador: foto apaisada a todo el ancho del panel. Móvil: tarjeta polaroid solo con la foto. */
.dv-foto{margin:clamp(1.8rem,3.4vw,2.8rem) auto var(--gap-half,2.4rem); max-width:620px}
.dv-foto img{display:block; width:100%; height:auto; aspect-ratio:16/10; object-fit:cover; object-position:62% 30%;
  border-radius:20px; background:var(--cream-2);
  box-shadow:0 22px 40px -22px rgba(var(--pshadow,92,64,40),.42), 0 6px 12px -6px rgba(var(--pshadow,92,64,40),.16)}
@media (max-width:700px){
  .dv-foto{max-width:none; background:var(--cream); border-radius:20px; padding:.8rem;
    box-shadow:0 18px 34px -20px rgba(var(--pshadow,92,64,40),.38), 0 4px 10px -6px rgba(var(--pshadow,92,64,40),.16), inset 0 3px 8px rgba(255,255,255,.7)}
  .dv-foto img{aspect-ratio:4/3; object-position:62% 30%; border-radius:12px; box-shadow:none}
}
/* Aire sobre los titulares de página (sin barra "Volver") */
#blog .blog-head{padding-top:clamp(3.4rem,7.5vw,6rem)!important}
#pag-divulgacion .blog-head{padding-top:clamp(3.4rem,7.5vw,6rem)!important}
#pag-sobre > .wp-block-post-content > section.about{padding-top:clamp(3.4rem,7.5vw,6rem)!important}
.blog-cats{margin-bottom:clamp(1.1rem,2vw,1.6rem)}