/* Fuentes locales originales */
/* dm-sans: latin-ext */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url(../assets/fonts/dm-sans-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* dm-sans: latin */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url(../assets/fonts/dm-sans-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* manrope: latin-ext */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url(../assets/fonts/manrope-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* manrope: latin */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url(../assets/fonts/manrope-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Diseño del Site fuente, conservado en su orden original. */
:root{
--ink:#171818;
--paper:#f1f0eb;
--muted:#777873;
--line:rgba(23,24,24,.16);
--lime:#c7ff45;
--blue:#8a9cff;
--dark:#101112;
--shell:min(1180px,calc(100vw - 48px))}
*{
box-sizing:border-box}
html{
scroll-behavior:smooth}
body{
margin:0;
background:var(--paper);
color:var(--ink);
font-family:"DM Sans",sans-serif;
overflow-x:hidden}
a{
color:inherit;
text-decoration:none}
.shell{
width:var(--shell);
margin-inline:auto}
.ambient{
position:fixed;
border-radius:50%;
filter:blur(90px);
opacity:.14;
pointer-events:none;
z-index:-1}
.ambient-a{
width:380px;
height:380px;
background:var(--lime);
top:-180px;
right:-100px}
.ambient-b{
width:340px;
height:340px;
background:var(--blue);
bottom:-180px;
left:-120px}
.nav{
height:92px;
display:flex;
align-items:center;
justify-content:space-between;
border-bottom:1px solid var(--line);
position:relative;
z-index:5}
.brand{
display:flex;
align-items:center;
gap:12px;
font-size:14px;
font-weight:600;
letter-spacing:.02em}
.brand-mark{
width:37px;
height:37px;
border:1px solid currentColor;
border-radius:50%;
display:grid;
place-items:center;
font-family:Manrope;
font-weight:500}
.brand-mark span{
color:#8b47ff}
.nav nav{
display:flex;
align-items:center;
gap:30px;
font-size:14px}
.nav nav>a:not(.nav-cta){
color:#555}
.nav-cta{
padding:12px 18px;
border:1px solid var(--ink);
border-radius:100px}
.nav-cta span{
margin-left:14px}
.hero{
min-height:calc(100vh - 92px);
position:relative;
padding:86px 0 58px;
display:flex;
flex-direction:column;
justify-content:space-between}
.eyebrow,.section-index{
text-transform:uppercase;
font-size:12px;
letter-spacing:.18em;
color:#62635f}
.eyebrow{
display:flex;
gap:9px;
align-items:center}
.eyebrow span{
width:7px;
height:7px;
border-radius:50%;
background:var(--lime);
box-shadow:0 0 0 5px rgba(199,255,69,.18)}
h1{
font-family:Manrope,sans-serif;
font-size:clamp(62px,8.5vw,126px);
letter-spacing:-.07em;
line-height:.89;
margin:42px 0 68px;
font-weight:500;
max-width:1050px}
h1 em,.method-copy em{
font-family:Georgia,serif;
font-weight:400;
color:#757b6b}
.hero-bottom{
display:flex;
justify-content:space-between;
align-items:end;
width:70%}
.hero-bottom p{
font-size:20px;
line-height:1.45;
max-width:515px;
margin:0}
.round-link{
width:94px;
height:94px;
border-radius:50%;
border:1px solid var(--ink);
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
gap:8px;
font-size:12px;
transition:.25s}
.round-link b{
font-size:20px;
font-weight:400}
.round-link:hover{
background:var(--ink);
color:white;
transform:translateY(4px)}
.orbit{
position:absolute;
width:250px;
height:250px;
right:3%;
top:44%;
border:1px solid var(--line);
border-radius:50%;
animation:spin 22s linear infinite}
.orbit:after,.orbit:before{
content:"";
position:absolute;
inset:26px;
border:1px solid var(--line);
border-radius:48% 52% 47% 53%;
transform:rotate(27deg)}
.orbit:after{
inset:61px;
transform:rotate(-42deg)}
.orbit i{
position:absolute;
width:9px;
height:9px;
background:var(--ink);
border-radius:50%;
left:50%;
top:-5px}
.orbit i:nth-child(2){
left:auto;
right:6%;
top:68%}
.orbit i:nth-child(3){
left:7%;
top:70%;
background:var(--lime)}
.orbit i:nth-child(4){
left:50%;
top:auto;
bottom:57px;
background:var(--blue)}
.orbit span{
position:absolute;
inset:0;
display:grid;
place-items:center;
font-family:Georgia,serif;
font-style:italic;
color:#777;
animation:spinBack 22s linear infinite}
@keyframes spin{
to{
transform:rotate(360deg)}
}
@keyframes spinBack{
to{
transform:rotate(-360deg)}
}
.tensions{
padding:145px 0 170px}
.tension-grid{
display:grid;
grid-template-columns:.85fr 1.15fr;
gap:10%;
margin-top:58px}
.tension-grid h2,.doors h2,.final-cta h2{
font:500 clamp(38px,5vw,66px)/1.05 Manrope,sans-serif;
letter-spacing:-.05em;
margin:0}
.questions{
border-top:1px solid var(--line)}
.questions button{
width:100%;
border:0;
border-bottom:1px solid var(--line);
background:none;
padding:20px 7px;
text-align:left;
color:var(--ink);
font:400 20px/1.3 "DM Sans";
cursor:default;
transition:.2s}
.questions button:before{
content:"";
display:inline-block;
width:0;
height:8px;
border-radius:50%;
background:var(--lime);
margin-right:0;
transition:.2s}
.questions button:hover{
padding-left:1px}
.questions button:hover:before{
width:8px;
margin-right:13px}
.method{
background:var(--dark);
color:#f3f2ed;
border-radius:36px 36px 0 0}
.method-inner{
padding:128px 0 90px}
.section-index.light{
color:#888}
.method-copy{
display:grid;
grid-template-columns:1.35fr .65fr;
gap:10%;
align-items:end;
margin:75px 0 110px}
.method-copy .lead{
font:400 clamp(42px,5.4vw,76px)/1.08 Manrope,sans-serif;
letter-spacing:-.055em;
margin:0}
.method-copy em{
color:var(--lime)}
.method-note>p{
font-size:18px;
line-height:1.55;
color:#babbb6;
margin:0 0 38px}
.signature{
font-family:Georgia,serif;
font-style:italic;
font-size:20px}
.signature span{
display:block;
font:400 12px "DM Sans";
color:#777;
text-transform:uppercase;
letter-spacing:.15em;
margin-top:8px}
.method-line{
display:flex;
align-items:center;
gap:15px;
color:#a6a7a2;
text-transform:uppercase;
font-size:11px;
letter-spacing:.13em}
.method-line i{
height:1px;
background:#333;
flex:1}
.doors{
padding:155px 0}
.doors-head{
display:grid;
grid-template-columns:1fr 1.2fr .8fr;
gap:5%;
align-items:end;
margin-bottom:70px}
.doors-head p{
margin:0;
color:#666;
line-height:1.55}
.door-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
border-top:1px solid var(--ink);
border-bottom:1px solid var(--ink)}
.door{
min-height:520px;
padding:22px 23px 25px;
display:flex;
flex-direction:column;
border-right:1px solid var(--line);
position:relative;
overflow:hidden;
transition:.35s}
.door:last-child{
border:0}
.door:before{
content:"";
position:absolute;
inset:auto 0 0;
height:0;
background:var(--ink);
transition:.35s;
z-index:-1}
.door:hover{
color:white}
.door:hover:before{
height:100%}
.number{
font-size:11px;
color:#898a85}
.door-symbol{
font:400 58px/1 Georgia;
color:#777;
margin-top:42px;
transition:.5s}
.door:nth-child(1):hover .door-symbol{
color:var(--lime);
transform:rotate(20deg)}
.door:nth-child(2):hover .door-symbol{
color:#ff966e;
transform:translateX(10px)}
.door:nth-child(3):hover .door-symbol{
color:var(--blue);
transform:scale(1.18)}
.door:nth-child(4):hover .door-symbol{
color:#e8d6ff;
transform:rotate(45deg)}
.door-copy{
margin:auto 0 35px}
.door h3{
font:500 28px/1.1 Manrope;
margin:0 0 28px;
letter-spacing:-.035em}
.door p{
font-size:15px;
line-height:1.45;
margin:0}
.problem{
color:#777}
.answer{
margin-top:14px!important;
opacity:0;
transform:translateY(8px);
transition:.3s}
.door:hover .answer{
opacity:1;
transform:none}
.door:hover .problem{
color:#999}
.explore{
font-size:13px;
border-top:1px solid currentColor;
padding-top:16px;
display:flex;
justify-content:space-between}
.explore b{
font-size:18px;
font-weight:400}
.final-cta{
margin-bottom:130px;
padding:80px;
background:#cfff55;
border-radius:28px;
display:grid;
grid-template-columns:1.1fr .7fr auto;
align-items:end;
gap:7%}
.final-cta>div>span{
text-transform:uppercase;
letter-spacing:.16em;
font-size:11px}
.final-cta h2{
margin-top:16px}
.final-cta p{
line-height:1.55;
margin:0}
.final-cta>a{
width:116px;
height:116px;
border-radius:50%;
background:var(--ink);
color:white;
display:flex;
align-items:center;
justify-content:center;
gap:9px;
font-size:13px;
transition:.25s}
.final-cta>a:hover{
transform:rotate(-7deg) scale(1.04)}
footer{
min-height:130px;
padding:28px 0 45px;
border-top:1px solid var(--line);
display:flex;
justify-content:space-between;
align-items:center;
font-size:12px;
color:#686965}
footer p{
letter-spacing:.06em}
.toast{
position:fixed;
bottom:24px;
left:50%;
transform:translate(-50%,30px);
opacity:0;
background:#171818;
color:white;
border-radius:100px;
padding:13px 20px;
display:flex;
align-items:center;
gap:10px;
font-size:13px;
z-index:20;
pointer-events:none;
transition:.3s}
.toast b{
width:7px;
height:7px;
border-radius:50%;
background:var(--lime)}
.toast.show{
opacity:1;
transform:translate(-50%,0)}
.reveal{
opacity:0;
transform:translateY(24px);
transition:opacity .7s ease,transform .7s ease}
.reveal.visible{
opacity:1;
transform:none}

@media(max-width:850px){
:root{
--shell:calc(100vw - 30px)}
.nav{
height:74px}
.nav nav>a:not(.nav-cta){
display:none}
.nav-cta{
padding:10px 13px}
.hero{
min-height:calc(100svh - 74px);
padding:60px 0 35px}
.hero h1{
font-size:clamp(50px,14.5vw,76px);
margin:36px 0}
.hero-bottom{
width:100%;
align-items:flex-end}
.hero-bottom p{
font-size:17px;
max-width:70%}
.round-link{
width:78px;
height:78px}
.orbit{
width:155px;
height:155px;
right:-36px;
top:52%}
.orbit:after{
inset:40px}
.tensions{
padding:105px 0}
.tension-grid,.method-copy,.doors-head{
grid-template-columns:1fr;
gap:44px}
.questions button{
font-size:17px;
padding:18px 2px}
.method{
border-radius:25px 25px 0 0}
.method-inner{
padding:95px 0 72px}
.method-copy{
margin:52px 0 75px}
.method-copy .lead{
font-size:42px}
.method-note{
max-width:480px}
.method-line{
display:grid;
grid-template-columns:auto 1fr auto}
.method-line i:nth-of-type(2),.method-line span:nth-of-type(3),.method-line i:nth-of-type(3),.method-line span:nth-of-type(4){
display:none}
.doors{
padding:105px 0}
.doors-head{
margin-bottom:50px}
.doors-head .section-index{
order:0}
.doors-head h2{
order:1}
.doors-head p{
order:2}
.door-grid{
grid-template-columns:1fr 1fr}
.door{
min-height:420px;
border-bottom:1px solid var(--line)}
.door:nth-child(2){
border-right:0}
.door:nth-child(3),.door:nth-child(4){
border-bottom:0}
.door .answer{
opacity:1;
transform:none}
.final-cta{
padding:55px 30px;
grid-template-columns:1fr;
align-items:start;
gap:35px}
.final-cta>a{
width:auto;
height:auto;
border-radius:100px;
padding:17px 22px;
justify-self:start}
footer{
flex-wrap:wrap;
gap:18px}
footer p{
order:3;
width:100%}
}

@media(max-width:520px){
.brand>span:last-child{
max-width:115px;
line-height:1.1}
.nav-cta{
font-size:0}
.nav-cta span{
font-size:18px;
margin:0}
.hero-bottom p{
max-width:65%}
.door-grid{
grid-template-columns:1fr}
.door{
min-height:385px;
border-right:0!important;
border-bottom:1px solid var(--line)!important}
.door:last-child{
border-bottom:0!important}
.door-symbol{
margin-top:28px}
.door-copy{
margin-top:42px}
.final-cta{
margin-bottom:85px}
footer>span:last-child{
width:100%}
}

@media(prefers-reduced-motion:reduce){
html{
scroll-behavior:auto}
.orbit,.orbit span{
animation:none}
.reveal{
opacity:1;
transform:none;
transition:none}
}


.personal-note{
display:flex;
align-items:center;
gap:22px;
max-width:520px;
margin:-38px 0 70px auto}
.personal-note img{
width:92px;
height:92px;
object-fit:cover;
border-radius:50%;
filter:saturate(.78);
border:1px solid #444}
.personal-note p{
margin:0;
color:#a8a9a4;
font:400 15px/1.55 "DM Sans";
max-width:350px}
.newsletter{
padding:0 0 120px;
display:grid;
grid-template-columns:1fr .55fr 1fr;
gap:6%;
align-items:end;
border-bottom:1px solid var(--line)}
.newsletter h2,.resources h2{
font:500 clamp(32px,4vw,52px)/1.08 Manrope,sans-serif;
letter-spacing:-.045em;
margin:25px 0 0}
.newsletter>p{
color:#666;
line-height:1.55;
margin:0}
.newsletter form{
display:flex;
border-bottom:1px solid var(--ink);
padding-bottom:9px}
.newsletter input{
border:0;
background:none;
min-width:0;
flex:1;
font:400 16px "DM Sans";
outline:none;
color:var(--ink);
padding:10px 4px}
.newsletter input::placeholder{
color:#888}
.newsletter button{
border:0;
background:none;
font:600 13px "DM Sans";
cursor:pointer;
padding:10px 2px 10px 15px;
white-space:nowrap}
.newsletter button span{
margin-left:8px;
font-size:16px}
.resources{
padding:100px 0 130px;
display:grid;
grid-template-columns:1fr 1fr;
column-gap:10%;
position:relative}
.resources-intro{
align-self:start}
.resources ul{
list-style:none;
margin:0;
padding:0;
border-top:1px solid var(--line)}
.resources li{
padding:17px 0;
border-bottom:1px solid var(--line);
font-size:15px;
color:#494a47}
.resources li span{
display:inline-block;
width:42px;
color:#999;
font-size:11px}
.resources-link{
grid-column:2;
margin-top:38px;
justify-self:start;
border:1px solid var(--ink);
border-radius:100px;
padding:14px 18px;
font-size:13px;
transition:.25s}
.resources-link b{
font-size:16px;
margin-left:14px}
.resources-link:hover{
background:var(--ink);
color:white}
.sr-only{
position:absolute;
width:1px;
height:1px;
padding:0;
margin:-1px;
overflow:hidden;
clip:rect(0,0,0,0);
white-space:nowrap;
border:0}

@media(max-width:850px){
.personal-note{
margin:0 0 60px}
.newsletter{
grid-template-columns:1fr;
gap:30px;
padding-bottom:85px}
.newsletter>p{
max-width:430px}
.newsletter form{
max-width:520px;
width:100%}
.resources{
padding:80px 0 100px;
grid-template-columns:1fr;
gap:45px}
.resources-link{
grid-column:1;
margin-top:0}
}

@media(max-width:520px){
.personal-note{
align-items:flex-start}
.personal-note img{
width:74px;
height:74px;
flex:0 0 auto}
.newsletter form{
display:grid;
grid-template-columns:1fr auto}
.newsletter button{
padding-left:10px}
}


/* Refined editorial text palette — backgrounds remain unchanged */
body{
color:#171717}

.brand-mark span{
color:#A8B84A}

.nav nav>a:not(.nav-cta),.nav-cta,.round-link,.explore,.resources-link,.newsletter button{
color:#26333A}

.eyebrow,.section-index,.number,.signature span,footer{
color:#7B7A72}

h1 em{
color:#6E725F}

.questions button,.tension-grid h2,.doors h2,.door h3,.final-cta h2,.newsletter h2,.resources h2{
color:#171717}

.doors-head p,.problem,.newsletter>p,.resources li{
color:#7B7A72}

.door-symbol{
color:#6E725F}

.door:nth-child(1):hover .door-symbol,.door:nth-child(2):hover .door-symbol,.door:nth-child(3):hover .door-symbol,.door:nth-child(4):hover .door-symbol{
color:#A8B84A}

.door:hover,.door:hover h3,.door:hover .explore{
color:#f3f2ed}

.method-copy em{
color:#A8B84A}

.method-note>p,.personal-note p{
color:#b9baaf}

.method-line{
color:#8f9088}

.signature{
color:#f3f2ed}

.final-cta,.final-cta h2{
color:#171717}

.final-cta>a{
color:#f3f2ed}


.personal-note img{
width:110px;
height:110px}

@media(max-width:520px){
.personal-note img{
width:89px;
height:89px}
}


/* Mejoras de uso sin alterar la composición original. */
html:not(.js-reveal) .reveal { opacity: 1; transform: none; }
:focus-visible { outline: 2px solid #6e725f; outline-offset: 5px; }
.newsletter input:focus-visible { outline: 2px solid #6e725f; }
.door:focus-visible .answer { opacity: 1; transform: none; }
.toast { max-width: calc(100vw - 32px); width: max-content; }
.toast b { flex-shrink: 0; }
html { overflow-x: clip; }
.toast span { min-width: 0; overflow-wrap: anywhere; }
