.how-page{background:#0b151c}.how-container{width:min(1180px,calc(100% - 48px));margin:auto}.how-page h2{font-size:clamp(2.8rem,4.7vw,5rem)}.how-page em{color:var(--turq);font-style:normal}.how-hero{padding:170px 0 100px;background:radial-gradient(circle at 82% 35%,#173f49,transparent 32%)}.hero-layout{display:grid;grid-template-columns:1fr .7fr;align-items:center;gap:100px}.how-hero h1{margin:0 0 30px;font-size:clamp(4.8rem,8vw,8.3rem)}.how-hero>div>div>p:not(.eyebrow){max-width:520px;color:#b8c5c9;font-size:1.15rem}.hero-route{display:flex;flex-direction:column;align-items:center}.hero-route span{display:grid;width:78px;height:78px;place-items:center;border:1px solid rgba(0,212,216,.45);border-radius:50%;color:var(--turq);font-weight:800}.hero-route i{width:1px;height:50px;background:rgba(0,212,216,.35)}
.how-step{padding:120px 0}.step-layout{display:grid;grid-template-columns:.85fr 1.15fr;align-items:center;gap:clamp(70px,9vw,140px)}.step-layout.reverse .step-copy{order:2}.step-layout.reverse>.visual-shell{order:1}.step-copy{position:relative}.step-num{display:block;margin-bottom:38px;color:var(--turq);font-size:clamp(4rem,7vw,7rem);font-weight:900;line-height:1}.light .step-num{color:#087d80}.step-copy h2{margin-bottom:25px}.step-copy>p:not(.eyebrow){max-width:540px;color:#adbbc0}.light .step-copy>p:not(.eyebrow){color:#556267}.profile-fields{display:flex;flex-wrap:wrap;gap:8px;padding:0;margin:25px 0 0;list-style:none}.profile-fields li{padding:8px 12px;border:1px solid #b5bdbc;border-radius:99px;font-size:.72rem}.visual-shell{min-width:0;border:1px solid rgba(255,255,255,.17);border-radius:32px;background:#10242c;box-shadow:0 30px 70px rgba(0,0,0,.22);overflow:hidden}.light .visual-shell{border-color:#c7cecb;background:#fff;box-shadow:0 24px 55px rgba(11,21,28,.1)}
.profile-builder{padding:40px;color:#17242a}.profile-builder header{display:flex;justify-content:space-between;padding-bottom:22px;border-bottom:1px solid #dce1df}.profile-builder header span{font-weight:800}.profile-builder header b{color:#087d80;font-size:.72rem}.profile-builder label{display:block;margin:24px 0 9px;font-size:.72rem;font-weight:700}.fake-input{padding:14px;border-radius:10px;background:#edf0ef;color:#647177;font-size:.82rem}.choice-row{display:flex;flex-wrap:wrap;gap:8px}.choice-row span{padding:9px 12px;border:1px solid #d2d8d6;border-radius:99px;font-size:.72rem}.choice-row .selected{border-color:#087d80;background:#c8f6f3;color:#08666a}.profile-builder button{width:100%;margin-top:30px;padding:14px;border:0;border-radius:99px;background:var(--turq);font-weight:800}
.dark{background:radial-gradient(circle at 15% 50%,#14323b,transparent 32%),#0b151c}.question-deck{display:flex;flex-direction:column;gap:14px;padding:45px}.question-deck span{align-self:flex-start;padding:17px 22px;border:1px solid rgba(0,212,216,.36);border-radius:17px;background:#143039;font-size:.9rem}.question-deck span:nth-child(even){align-self:flex-end;background:#0d5d63}.question-deck span:nth-child(3){font-weight:700;color:var(--turq)}
.matches{display:flex;flex-direction:column;gap:13px;padding:30px}.matches article{padding:24px;border-radius:20px;background:#fff;color:#17242a;box-shadow:0 8px 22px rgba(11,21,28,.08)}.matches article>div{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px}.matches i,.conversation header i{display:grid;width:48px;height:48px;place-items:center;border-radius:50%;background:linear-gradient(145deg,var(--turq),#7068ff);color:white;font-style:normal;font-weight:800}.matches b,.matches small{display:block}.matches small{color:#758187;font-size:.72rem}.matches strong{color:#087d80;font-size:1.8rem}.matches article>p{margin:20px 0;color:#58666b;font-size:.78rem}.matches footer{display:flex;flex-wrap:wrap;gap:7px}.matches footer span{padding:6px 9px;border-radius:99px;background:#d8f6f4;font-size:.72rem}
.final-step{padding:120px 0;background:linear-gradient(145deg,#102730,#0b151c)}.conversation{padding:32px}.conversation header{display:flex;align-items:center;gap:12px;padding-bottom:20px;border-bottom:1px solid rgba(255,255,255,.15)}.conversation header b,.conversation header small{display:block}.conversation header small{color:var(--turq);font-size:.72rem}.conversation>p{max-width:75%;padding:15px;border-radius:18px;background:#263a42;font-size:.78rem}.conversation>p:nth-of-type(2){margin-left:auto;background:var(--turq);color:#08282d}.conversation footer{display:flex;justify-content:space-between;margin-top:50px;padding:10px 12px 10px 18px;border:1px solid rgba(255,255,255,.2);border-radius:99px;color:#8fa0a5;font-size:.72rem}.conversation footer b{display:grid;width:30px;height:30px;place-items:center;border-radius:50%;background:var(--turq);color:#072329}.how-closing{padding:110px 0;text-align:center;background:var(--turq);color:#062026}.how-closing .eyebrow{color:#16575a}.how-closing h2{margin-bottom:35px}.how-closing .button{border-color:white;background:white}
@media(max-width:850px){.hero-layout,.step-layout{grid-template-columns:1fr}.hero-route{display:none}.step-layout.reverse .step-copy,.step-layout.reverse>.visual-shell{order:initial}.how-hero{padding-top:145px}.how-step,.final-step{padding:85px 0}.step-layout{gap:50px}.visual-shell{max-width:620px;width:100%;margin:auto}}
@media(max-width:560px){.how-container{width:calc(100% - 32px)}.how-hero h1{font-size:clamp(3.3rem,16vw,4.4rem)}.how-page h2{font-size:clamp(2.5rem,12vw,3.4rem)}.profile-builder,.question-deck,.conversation{padding:25px}.matches{padding:15px}.matches article{padding:18px}.matches strong{font-size:1.35rem}.step-num{margin-bottom:24px}.how-closing{padding:80px 0}}
.how-hero{padding-bottom:75px}.step-copy .eyebrow{display:inline-block;padding-bottom:0;border-bottom:0;text-decoration:none}.search-deck{padding:40px}.search-deck header{display:flex;justify-content:space-between;gap:20px;padding-bottom:22px;border-bottom:1px solid rgba(255,255,255,.16)}.search-deck header small{color:#9eafb4}.search-deck>div{display:flex;flex-wrap:wrap;gap:10px;margin:30px 0}.search-deck span{padding:11px 14px;border:1px solid rgba(0,212,216,.34);border-radius:99px;font-size:.72rem}.search-deck .free-filter{background:#00d4d8;color:#062026;font-weight:800}.search-deck>p{margin:0;color:#9cabb0;font-size:.72rem}.final-step .step-copy p:last-child{max-width:620px}@media(max-width:850px){.how-hero{padding-bottom:55px}}@media(max-width:560px){.search-deck{padding:25px}.search-deck header{flex-direction:column;gap:5px}}
.profile-builder button[aria-hidden="true"]{pointer-events:none}
.how-page .matches i,.how-page .conversation header i{background:var(--turq);color:#0b151c}
/* Alineación de cada número con su línea del titular, sin alturas fijas. */
@media(min-width:851px){
  .how-hero .hero-layout{row-gap:30px}
  .how-hero .hero-layout>div:first-child{display:contents}
  .how-hero .hero-layout>div:first-child>.eyebrow{grid-column:1;grid-row:1;margin:0}
  .how-hero .hero-layout h1{grid-column:1;grid-row:2;margin:0}
  .how-hero .hero-layout>div:first-child>p:not(.eyebrow){grid-column:1;grid-row:3;margin:0}
  .how-hero .hero-layout>div:first-child>.button{grid-column:1;grid-row:4;justify-self:start}
  .how-hero .hero-route{grid-column:2;grid-row:2;align-self:stretch;display:grid;grid-template-rows:repeat(4,1fr);justify-items:center;position:relative}
  .how-hero .hero-route::before{content:"";position:absolute;top:12.5%;bottom:12.5%;left:50%;width:1px;background:rgba(0,212,216,.35)}
  .how-hero .hero-route span{align-self:center;position:relative;background:#0b151c}
  .how-hero .hero-route i{display:none}
}
