:root{
  --cream:#F5F0E8; --cream-deep:#EBE4D6; --malva:#E4DDE8; --surface:#fff;
  --ink:#2B2B2B; --muted:#5E5A60;
  --accent:#7A1F35; --accent-dark:#5A1626; --accent-soft:#A4475C;
  --line:rgba(122,31,53,.14);
  --serif:'Playfair Display',Georgia,'Times New Roman',serif;
  --sans:Inter,system-ui,-apple-system,'Segoe UI',Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:92px}
body{margin:0;background:var(--cream);color:var(--ink);font:16px/1.75 var(--sans);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--accent)}
.wrap{max-width:1120px;margin:0 auto;padding:0 20px}
.narrow{max-width:780px}
.skip{position:absolute;left:-9999px}.skip:focus{left:12px;top:12px;background:#fff;padding:8px;z-index:9}

h1,h2,h3,.logo{font-family:var(--serif);font-weight:400;letter-spacing:-.02em;line-height:1.15;margin:0 0 .5em}
h1{font-size:clamp(2.4rem,5.2vw,4.1rem)}
h2{font-size:clamp(1.9rem,3.6vw,2.9rem)}
h3{font-size:1.3rem}
h1 em,h2 em,.logo em{font-style:italic;color:var(--accent)}
.eyebrow{font-size:.75rem;letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:var(--accent-soft);margin:0 0 1rem}
.lead{font-size:1.15rem;color:var(--muted);max-width:34em}

.btn{display:inline-block;background:var(--accent);color:var(--cream);text-decoration:none;font-weight:500;font-size:.95rem;padding:15px 26px;border-radius:999px;border:1.5px solid var(--accent);transition:background .2s;cursor:pointer;font-family:var(--sans)}
.btn:hover{background:var(--accent-dark)}
.btn-sm{padding:9px 18px;font-size:.85rem}
.btn-ghost{background:transparent;color:var(--accent)}
.btn-ghost:hover{background:var(--accent);color:var(--cream)}
.link{color:var(--ink);text-underline-offset:4px}

.nav{position:sticky;top:0;z-index:5;background:rgba(245,240,232,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.nav-in{display:flex;align-items:center;justify-content:space-between;height:68px}
.logo{font-size:1.5rem;margin:0;color:var(--ink);text-decoration:none}
.nav nav{display:flex;gap:26px;align-items:center}
.nav nav a:not(.btn){color:var(--ink);text-decoration:none;font-size:.92rem}
.nav nav a:not(.btn):hover{color:var(--accent)}

section{padding:96px 0}
.band{background:var(--cream-deep)}
.band-malva{background:var(--malva)}

.hero{padding:72px 0 96px}
.hero-in{display:grid;grid-template-columns:1.25fr .75fr;gap:64px;align-items:center}
.cta-row{display:flex;gap:24px;align-items:center;flex-wrap:wrap;margin:2rem 0}
.badges{list-style:none;padding:0;margin:0;display:flex;gap:10px;flex-wrap:wrap}
.badges li{font-size:.8rem;border:1px solid var(--line);border-radius:999px;padding:5px 14px;color:var(--muted);background:rgba(255,255,255,.5)}
.hero-photo{margin:0}
.hero-photo img{border-radius:220px 220px 18px 18px;box-shadow:0 30px 60px -30px rgba(90,22,38,.35)}

.cards{list-style:none;padding:0;margin:2.5rem 0 0;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.cards li{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:28px}
.cards p{margin:0;color:var(--muted);font-size:.95rem}

.split{display:grid;grid-template-columns:.8fr 1.2fr;gap:64px;align-items:start}
.prose p{margin:0 0 1.1em}
.steps{padding-left:1.2em;margin:1.5em 0 0}
.steps li{margin-bottom:.6em}
.steps li::marker{color:var(--accent);font-family:var(--serif)}

.about{display:grid;grid-template-columns:.7fr 1.3fr;gap:64px;align-items:center}
.about img{border-radius:18px}
.role{color:var(--accent);font-weight:500;margin-top:-.4em}
.facts{margin:1.5rem 0 0;display:grid;gap:10px}
.facts div{display:grid;grid-template-columns:140px 1fr;border-top:1px solid var(--line);padding-top:10px}
.facts dt{font-size:.8rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}
.facts dd{margin:0}

details{border-bottom:1px solid var(--line);padding:18px 0}
summary{cursor:pointer;font-family:var(--serif);font-size:1.2rem;list-style:none;display:flex;justify-content:space-between;gap:16px}
summary::-webkit-details-marker{display:none}
summary::after{content:'+';color:var(--accent);font-size:1.5rem;line-height:1}
details[open] summary::after{content:'–'}
details p{color:var(--muted);margin:.8em 0 0}

.cta-final{background:var(--accent);color:var(--cream)}
.cta-final h2,.cta-final h2 em,.cta-final .eyebrow{color:var(--cream)}
.cta-final .btn-ghost{color:var(--cream);border-color:var(--cream)}
.cta-final .btn-ghost:hover{background:var(--cream);color:var(--accent)}
.form{background:var(--cream);color:var(--ink);border-radius:18px;padding:32px;display:grid;gap:14px}
.form label{display:grid;gap:6px;font-size:.85rem;font-weight:500}
.form input,.form select,.form textarea{font:inherit;font-weight:400;padding:11px 14px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink)}
.form input:focus,.form select:focus,.form textarea:focus{outline:2px solid var(--accent-soft);outline-offset:1px}
.hp{position:absolute;left:-9999px}
.form-msg{margin:0;font-size:.9rem;min-height:1.4em}

.foot{padding:48px 0;font-size:.88rem;color:var(--muted)}
.foot p{margin:.4em 0}
.crisis{background:var(--surface);border-left:3px solid var(--accent);padding:14px 18px;border-radius:8px;margin-bottom:1.5rem!important}

@media (max-width:860px){
  section{padding:64px 0}
  .hero{padding:40px 0 64px}
  .hero-in,.split,.about{grid-template-columns:1fr;gap:36px}
  .hero-photo{order:-1;max-width:200px}
  .cards{grid-template-columns:1fr}
  .nav nav a:not(.btn){display:none}
  .about img{max-width:320px}
}
@media (min-width:861px) and (max-width:1000px){.cards{grid-template-columns:repeat(2,1fr)}}

.hero.sub{padding:48px 0 80px}
.crumbs{font-size:.82rem;color:var(--muted);margin-bottom:1.2rem}
.crumbs a{color:var(--muted)}
.lead-prose{font-size:1.05rem;max-width:36em}
.chips{list-style:none;padding:0;margin:1rem 0 0;display:flex;flex-wrap:wrap;gap:10px}
.chips a{display:inline-block;padding:8px 16px;border:1px solid var(--line);border-radius:999px;background:var(--surface);text-decoration:none;font-size:.9rem}
.chips a:hover{background:var(--accent);color:var(--cream)}
.foot-links{margin:.5em 0;line-height:2}
.foot-links a{color:var(--muted)}
.cards h3 a{color:inherit;text-decoration:none}
.cards h3 a:hover{color:var(--accent)}
.hero-name{font-family:var(--serif);font-size:clamp(1.3rem,2.2vw,1.65rem);color:var(--accent);margin:0 0 .35rem;letter-spacing:-.01em}
@media (max-width:560px){.logo{font-size:1.15rem}}
.ilustracion{margin:2rem 0 0;max-width:380px}
.ilustracion img{border-radius:18px;box-shadow:0 24px 50px -28px rgba(90,22,38,.35)}
@media (max-width:860px){.ilustracion{max-width:300px;margin:1.5rem auto 0}}
.hero-ilustracion img{border-radius:22px;box-shadow:0 40px 70px -30px rgba(90,22,38,.45),0 0 0 8px rgba(255,255,255,.55);animation:flotar 6s ease-in-out infinite}
@keyframes flotar{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-14px) rotate(1deg)}}
@media (prefers-reduced-motion:reduce){.hero-ilustracion img{animation:none}}
.chips-label{margin:1.5rem 0 0;font-size:.85rem;color:var(--muted)}
.logo{display:flex;align-items:center;gap:10px}
.logo-avatar{height:64px;width:auto;flex:none;filter:drop-shadow(0 4px 6px rgba(90,22,38,.18))}
.nav-in{height:80px}
@media (max-width:560px){.logo-avatar{height:54px}.nav-in{height:70px}}
@media (max-width:560px){.logo{font-size:1.02rem;gap:6px}.logo-avatar{height:50px}.nav .btn-sm{padding:8px 14px}}