.in-w{margin:0;max-width:min(100%,40em);font-family:var(--font-mono);font-size:clamp(12px,3.3vw,15px);line-height:1.6;letter-spacing:.2em;color:#C9CCD6;text-wrap:balance;animation:in-up .7s cubic-bezier(.2,.7,.2,1) .1s both}
.in-n{margin:0;max-width:100%;font-weight:300;font-size:clamp(25px,7.4vw,96px);line-height:1;letter-spacing:.12em;padding-left:.12em;white-space:nowrap;color:#fff;text-wrap:balance;animation:in-up .8s cubic-bezier(.2,.7,.2,1) .35s both}
.in-l{display:block;width:min(120px,30vw);height:2px;background:#673AB7;transform-origin:center;animation:in-line .5s cubic-bezier(.2,.7,.2,1) .75s both}
.in-c{margin:0;max-width:100%;font-family:var(--font-mono);font-size:clamp(10.5px,2.9vw,14px);line-height:1.7;letter-spacing:.16em;color:rgba(255,255,255,.64);animation:in-up .6s cubic-bezier(.2,.7,.2,1) .95s both}
@media (min-width:641px){.in-w{letter-spacing:.26em}.in-c{letter-spacing:.26em}}
@keyframes in-up{0%{opacity:0;transform:translateY(10px)}100%{opacity:1;transform:none}}
@keyframes in-line{0%{opacity:0;transform:scaleX(0)}100%{opacity:1;transform:scaleX(1)}}

/* Inicio: bienvenida, tres móviles (el scroll vertical los mueve en horizontal) y presentación comercial */
.hx{position:relative;background:#F7F7FA;color:#111;--pw:clamp(210px,66vw,268px)}
.hx-st{position:relative;overflow:hidden;padding:max(88px,calc(env(safe-area-inset-top,0px) + 80px)) 0 0}
.hx-pv{display:flex;flex-wrap:wrap;justify-content:center;gap:56px 36px;padding:clamp(24px,5vw,48px) var(--gx-r) clamp(48px,8vw,88px) var(--gx)}
.ph3-dev{position:relative;width:var(--pw);margin:0;pointer-events:none}
.ph3-dev:nth-child(1){--w:.75}
.ph3-dev:nth-child(2){--w:.55}
.ph3-dev:nth-child(3){--w:.95}
.ph3-box{position:relative;width:100%;aspect-ratio:9/19.5}
.ph3-cap{margin:18px 0 0;text-align:center;font-family:var(--font-mono);font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:#595959}
/* Con JS y sin movimiento reducido: escena fija durante las demostraciones y scroll libre al terminar */
.hx-on{--ex:113;--ex2:223;--ex3:43;height:calc((890 + var(--ex) + var(--ex2) + var(--ex3)) * 1vh);--pw:clamp(190px,min(70vw,calc((100svh - 140px) / 2.17)),340px)}
.hx-on .hx-st{position:sticky;top:0;height:100vh;height:100svh;padding:0}
.hx-on .hx-pv{position:absolute;inset:0;display:block;padding:0;gap:0;perspective:1400px;pointer-events:none}
.hx-on .ph3-dev{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) translate3d(var(--x,0px),var(--y,0px),0) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) scale(var(--sc,1));opacity:var(--op,1);will-change:transform,opacity}
.hx-on .ph3-cap{display:none}
@media (max-width:640px){.hx-on{--ex:130;--ex2:228;--ex3:43;height:calc((835 + var(--ex) + var(--ex2) + var(--ex3)) * 1vh)}}
/* Presentación comercial: solo aparece después de los móviles */
.cm{position:relative;overflow:hidden;background:#F7F7FA;padding-top:clamp(88px,12vw,176px);padding-bottom:clamp(56px,8vw,112px)}
.cm-in{position:relative;z-index:1}
.cm .lead{margin-top:28px;max-width:34ch;font-size:clamp(17px,4.6vw,22px)}
.cm .ctas{margin-top:34px;display:flex;flex-wrap:wrap;align-items:center;gap:14px 16px}
.cm .cm-wa{margin-top:0;min-height:52px;padding:0 26px}
.cm .ihb{position:relative;display:inline-flex;align-items:center;justify-content:center;overflow:hidden;isolation:isolate;min-width:200px;min-height:52px;padding:0 28px;color:#111;background:#fff;border:1px solid #111;border-radius:999px;font:500 16px var(--font-sans);cursor:pointer;-webkit-tap-highlight-color:transparent}
.cm .ihb-t{position:relative;z-index:2;display:inline-block;transform:translateX(4px);transition:transform .3s ease,opacity .3s ease}
.cm .ihb-h{position:absolute;inset:0;z-index:3;display:flex;align-items:center;justify-content:center;gap:8px;color:#fff;opacity:0;transform:translateX(48px);transition:transform .3s ease,opacity .3s ease}
.cm .ihb-ar{flex:none}
.cm .ihb-d{position:absolute;z-index:1;left:20%;top:40%;width:8px;height:8px;border-radius:999px;background:#111;transition:left .3s ease,top .3s ease,width .3s ease,height .3s ease}
.cm .ihb:focus-visible{outline:2px solid #111;outline-offset:3px}
.cm .ihb:active .ihb-t,.cm .ihb:focus-visible .ihb-t{transform:translateX(48px);opacity:0}
.cm .ihb:active .ihb-h,.cm .ihb:focus-visible .ihb-h{transform:translateX(-4px);opacity:1}
.cm .ihb:active .ihb-d,.cm .ihb:focus-visible .ihb-d{left:0;top:0;width:100%;height:100%}
@media (hover:hover){
  .cm .ihb:hover .ihb-t{transform:translateX(48px);opacity:0}
  .cm .ihb:hover .ihb-h{transform:translateX(-4px);opacity:1}
  .cm .ihb:hover .ihb-d{left:0;top:0;width:100%;height:100%}
}
@media (min-width:641px){.cm h1{font-size:clamp(34px,6.75vw,106px);max-width:15ch}.cm .lead{max-width:44ch}}
@media (max-width:640px){
  .cm h1{font-size:clamp(28px,9vw,40px);line-height:1.05;letter-spacing:-.035em;max-width:none}
  .cm .lead{max-width:none}
  .cm .ctas{flex-direction:column;align-items:stretch;gap:12px}
  .cm .cm-wa,.cm .cm-sec{width:100%;min-height:54px}
}
@media (prefers-reduced-motion:reduce){.cm .ihb-t,.cm .ihb-h,.cm .ihb-d{transition:none}}
.cm-in.is-armed .rv{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}
.cm-in.is-armed.is-in .rv{opacity:1;transform:none}
.cm-in.is-armed .rv:nth-child(2){transition-delay:.08s}
.cm-in.is-armed .rv:nth-child(3){transition-delay:.16s}
.cm-in.is-armed .rv:nth-child(4){transition-delay:.24s}
@media (prefers-reduced-motion:reduce){.cm-in.is-armed .rv{opacity:1;transform:none;transition:none}}
/* Etiquetas superiores de seccion: tamano, tipografia, color y revelado unificados */
.light .mono.sec-tag{display:block;margin:0;font-family:var(--font-mono);font-size:16.5px;font-weight:400;line-height:1.4;letter-spacing:.16em;text-transform:uppercase;color:#673AB7;max-width:100%;overflow-wrap:anywhere}
.light .sec-tag+h1,.light .sec-tag+h2{margin-top:16px}
@media (max-width:640px){.light .mono.sec-tag{font-size:clamp(12px,3.6vw,14px);letter-spacing:.08em}}
.sec-tag.st-armed{opacity:0;transform:translateY(10px);transition:opacity .45s ease-out,transform .45s ease-out}
.sec-tag.st-armed.st-in{opacity:1;transform:none}
.cm-in.is-armed .rv.sec-tag{transform:translateY(10px);transition:opacity .45s ease-out,transform .45s ease-out}
.cm-in.is-armed.is-in .rv.sec-tag{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.sec-tag.st-armed,.cm-in.is-armed .rv.sec-tag{opacity:1;transform:none;transition:none}}
/* Marco del móvil */
.ph3-fr{position:absolute;inset:0;padding:calc(var(--pw) * .024);border-radius:calc(var(--pw) * .17);background:linear-gradient(160deg,#2b2b31,#17171b);border:1px solid #44444d;box-shadow:0 34px 60px -26px rgba(20,20,40,.5),0 10px 24px -12px rgba(20,20,40,.3),inset 0 0 0 1px rgba(255,255,255,.05)}
.ph3-fr::before,.ph3-fr::after{content:"";position:absolute;width:3px;background:#34343c}
.ph3-fr::before{left:-3px;top:17%;height:5%;border-radius:2px 0 0 2px;box-shadow:0 calc(var(--pw) * .2) 0 #34343c}
.ph3-fr::after{right:-3px;top:23%;height:9%;border-radius:0 2px 2px 0}
.ph3-sc{position:relative;width:100%;height:100%;overflow:hidden;isolation:isolate;border-radius:calc(var(--pw) * .146);font:400 calc(var(--pw) * .05)/1.35 Inter,"Helvetica Neue",Arial,sans-serif;background:#fff;color:#111}
.ph3-sc *{box-sizing:border-box}
.ph3-sc svg{display:block}
.ph3-is{position:absolute;left:50%;top:2.2%;z-index:9;width:27%;height:3.1%;transform:translateX(-50%);border-radius:99px;background:#000}
.ph3-sc .pg{position:absolute;left:0;top:0;width:100%;will-change:transform}
.ph3-sc .hd{position:absolute;left:0;right:0;top:0;z-index:6;display:flex;align-items:center;justify-content:space-between;padding:2.7em 1.3em .8em}
/* 1 · Apartamento Oliva */
.s1{background:#f7f2e9;color:#2b211a;--wb:clamp(0,calc((var(--w) - .6) / .4),1)}
.s1 .pg{transform:translateY(calc(var(--wb) * -24em))}
.s1-hero{position:relative;height:27em;overflow:hidden;background:#e4dccd}
.s1-hero svg,.s1-vid{position:absolute;inset:0;width:100%;height:100%;transform-origin:50% 52%}
.s1-vid{object-fit:cover;opacity:0;transition:opacity .4s ease}
.s1-hero.has-vid .s1-vid{opacity:1}
.s1-hero.has-vid svg.o-sc{opacity:0}
.o-far{transform:scale(1.07)}
.o-mid{transform:scale(1.12)}
.o-near{transform:scale(1.22)}
.o-corr{opacity:0;pointer-events:none}
@keyframes o-far{from{transform:scale(1)}}
@keyframes o-mid{from{transform:scale(1.01)}}
@keyframes o-near{from{transform:scale(1.02)}}
@keyframes o-corr{0%,17%{opacity:1;transform:scale(1)}70%{opacity:1}100%{opacity:0;transform:scale(3.4)}}
.s1.o-go .o-far{animation:o-far 2.9s cubic-bezier(.25,.1,.25,1) both}
.s1.o-go .o-mid{animation:o-mid 2.9s cubic-bezier(.25,.1,.25,1) both}
.s1.o-go .o-near{animation:o-near 2.9s cubic-bezier(.25,.1,.25,1) both}
.s1.o-go .o-corr{animation:o-corr 2.9s cubic-bezier(.4,0,.3,1) both}
.s1.o-go.o-done .o-far,.s1.o-go.o-done .o-mid,.s1.o-go.o-done .o-near,.s1.o-go.o-done .o-corr{animation-duration:.01s}
@media (prefers-reduced-motion:reduce){.s1 .o-far,.s1 .o-mid,.s1 .o-near,.s1 .o-corr{animation:none !important}}
.s1-ov{position:absolute;left:0;right:0;bottom:0;padding:6em 1.4em 1.5em;background:linear-gradient(180deg,rgba(34,25,17,0),rgba(34,25,17,.78));color:#fff}
.s1-ov small{display:block;font-size:.6em;letter-spacing:.2em;text-transform:uppercase;opacity:.94}
.s1-ov h4{margin:.6em 0 0;font:400 1.6em/1.1 "Times New Roman",Times,"Liberation Serif",serif;letter-spacing:-.02em}
.s1 .hd{color:#fff;background:linear-gradient(180deg,rgba(34,25,17,.5),rgba(34,25,17,0))}
.s1 .hd::before{content:"";position:absolute;inset:0;z-index:-1;background:#2b211a;opacity:clamp(0,calc((var(--wb) - .1) * 6),1)}
.s1 .hd b{font:400 1.1em/1 "Times New Roman",Times,"Liberation Serif",serif;letter-spacing:.04em}
.s1 .hd i{display:block;width:1.3em;height:.9em;border-top:2px solid #fff;border-bottom:2px solid #fff;position:relative}
.s1 .hd i::after{content:"";position:absolute;left:0;right:0;top:50%;height:2px;margin-top:-1px;background:#fff}
.s1-body{background:#f7f2e9;padding:1.5em 1.4em 3.4em;color:#2b211a}
.s1-rate{display:flex;align-items:baseline;flex-wrap:wrap;gap:.2em .6em;font-size:.78em;color:#5b4c3d}
.s1-rate b{color:#a67c52;font-weight:600}
.s1-rate small{font-size:.82em;color:#9a8b78}
.s1-body p{margin:.9em 0 0;font-size:.84em;line-height:1.55;color:#4a3d31}
.s1-k{margin:1.6em 0 .7em;font-size:.62em;letter-spacing:.2em;text-transform:uppercase;color:#6b7050}
.s1-chips{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:.55em}
.s1-chips li{display:flex;align-items:center;gap:.5em;padding:.66em .7em;border:1px solid #d9cfbd;border-radius:99px;font-size:.67em;white-space:nowrap;color:#4a3d31;opacity:clamp(0,calc((var(--wb) - var(--t)) * 7),1);transform:translateY(calc((1 - clamp(0,calc((var(--wb) - var(--t)) * 7),1)) * .8em))}
.s1-chips li::before{content:"";flex:none;width:.5em;height:.5em;border-radius:50%;background:#8a8f63}
.s1-btn{display:flex;width:100%;justify-content:center;margin:1.7em 0 0;padding:1.1em;border:0;border-radius:.8em;background:#2b211a;color:#f7f2e9;font:500 .86em/1 Inter,"Helvetica Neue",Arial,sans-serif;letter-spacing:.01em;cursor:pointer;pointer-events:auto;opacity:clamp(0,calc((var(--wb) - .5) * 6),1);transform:translateY(calc((1 - clamp(0,calc((var(--wb) - .5) * 6),1)) * 1em))}
.s1-sheet{position:absolute;left:0;right:0;bottom:0;z-index:12;padding:1.3em 1.4em 1.6em;border-radius:1.4em 1.4em 0 0;background:#fbf8f2;box-shadow:0 -1em 2em -1em rgba(43,33,26,.35);color:#2b211a;transform:translateY(105%);transition:transform .45s cubic-bezier(.2,.8,.2,1);pointer-events:auto;visibility:hidden}
.s1-sheet.is-open{transform:none;visibility:visible}
.s1-sh-h{display:flex;justify-content:space-between;align-items:center}
.s1-sh-h b{font:400 1.2em/1 "Times New Roman",Times,"Liberation Serif",serif}
.s1-x{width:2em;height:2em;border:1px solid #d9cfbd;border-radius:50%;background:transparent;color:#2b211a;font-size:.9em;line-height:1;cursor:pointer}
.s1-r{display:flex;justify-content:space-between;align-items:center;margin-top:.9em;padding-bottom:.9em;border-bottom:1px solid #e5dccb;font-size:.8em}
.s1-r span{color:#6b5d4d}
.s1-st{display:flex;align-items:center;gap:.7em}
.s1-st button{width:1.9em;height:1.9em;border:1px solid #cfc3ad;border-radius:50%;background:#fff;color:#2b211a;font-size:1em;line-height:1;cursor:pointer}
.s1-st output{min-width:3.6em;text-align:center;font-weight:600}
.s1-go{display:flex;width:100%;justify-content:center;margin-top:1.1em;padding:1em;border:0;border-radius:.8em;background:#2b211a;color:#f7f2e9;font:500 .84em/1 Inter,"Helvetica Neue",Arial,sans-serif;cursor:pointer}
.s1-msg{margin:.8em 0 0;min-height:2.6em;font-size:.68em;line-height:1.4;color:#6b5d4d}
/* 2 · Moda */
.s2{background:#faf9f6;color:#161616}
.s2 .pg{padding-top:4.7em;transform:translateY(calc(var(--w) * -29em))}
.s2 .hd{background:rgba(250,249,246,.95);border-bottom:1px solid #e6e2da}
.s2 .hd b{font-weight:500;font-size:1em;letter-spacing:.34em}
.s2-ban{position:relative;height:17em;background:#e4ddd1;overflow:hidden}
.s2-ban svg{position:absolute;right:-1em;bottom:-.6em;width:12.5em;height:auto}
.s2-ban div{position:absolute;left:1.3em;top:2.2em}
.s2-ban small{display:block;font-size:.68em;letter-spacing:.18em;text-transform:uppercase;color:#6a6258}
.s2-ban h4{margin:.5em 0 0;font:400 2.15em/1 "Times New Roman",Times,"Liberation Serif",serif;letter-spacing:-.03em}
.s2-ban u{display:inline-block;margin-top:1.2em;font-size:.76em;text-decoration:none;border-bottom:1px solid #161616;padding-bottom:.15em}
.s2-tabs{display:flex;gap:1.1em;padding:1.1em 1.3em .6em;font-size:.76em;color:#7a7268}
.s2-tabs span:first-child{color:#161616;border-bottom:1px solid #161616;padding-bottom:.25em}
.s2-h{display:flex;justify-content:space-between;align-items:baseline;padding:.7em 1.3em .8em;font-size:.76em;color:#7a7268}
.s2-h b{font:400 1.7em/1 "Times New Roman",Times,"Liberation Serif",serif;color:#161616;letter-spacing:-.02em}
.s2-g{display:grid;grid-template-columns:1fr 1fr;gap:1.2em .9em;padding:0 1.2em 2.6em}
.s2-c{opacity:clamp(0,calc((var(--w) - var(--t)) * 8),1);transform:translateY(calc((1 - clamp(0,calc((var(--w) - var(--t)) * 8),1)) * 1.4em))}
.s2-im{aspect-ratio:3/4;background:var(--bg);display:flex;align-items:flex-end;justify-content:center;overflow:hidden}
.s2-im svg{width:80%;height:auto;margin-bottom:.4em}
.s2-c p{margin:.55em 0 0;font-size:.78em;line-height:1.3;color:#2b2b2b}
.s2-c p b{display:block;font-weight:600;margin-top:.15em;color:#161616}
/* 3 · Restaurante */
.s3{background:#17120e;color:#f3e9dc;--sw:clamp(0,calc((var(--w) - .38) * 12),1);--ms:clamp(0,calc((var(--w) - .5) / .43),1);--tp:clamp(0,calc((var(--w) - .24) * 14),1)}
.s3 .hd{background:linear-gradient(180deg,#17120e 84%,rgba(23,18,14,0))}
.s3 .hd b{font:400 1.25em/1 "Times New Roman",Times,"Liberation Serif",serif;letter-spacing:.02em}
.s3 .hd small{font-size:.62em;letter-spacing:.18em;color:#b8a78f}
.s3-home{position:absolute;inset:0;padding:5em 1.4em 1.6em;display:flex;flex-direction:column;opacity:calc(1 - var(--sw));transform:translateX(calc(var(--sw) * -7%))}
.s3-photo{position:relative;flex:none;margin:-.9em -1.4em 0;aspect-ratio:1064/1370;background:#000;overflow:hidden}.s3-photo video{display:block;width:100%;height:100%;object-fit:contain;background:#000}.s3-photo::after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 1.4em 1em #17120e}
.s3-home h4{margin:.8em 0 0;font:400 1.95em/1.02 "Times New Roman",Times,"Liberation Serif",serif;letter-spacing:-.025em;text-align:center}
.s3-home p{margin:.7em 0 0;font-size:.76em;line-height:1.5;color:#b8a78f;text-align:center}
.s3-bs{display:flex;gap:.7em;margin-top:auto;padding-top:1em}
.s3-b{position:relative;flex:1;display:flex;align-items:center;justify-content:center;padding:1em .4em;border-radius:.6em;font-size:.8em;font-weight:500;white-space:nowrap;border:1px solid #f3e9dc}
.s3-b1{background:#f3e9dc;color:#17120e;transform:scale(calc(1 - var(--tp) * (1 - clamp(0,calc((var(--w) - .37) * 40),1)) * .05))}
.s3-b2{color:#f3e9dc}
.s3-tap{position:absolute;left:62%;top:58%;width:2.6em;height:2.6em;margin:-1.3em 0 0 -1.3em;border-radius:50%;background:rgba(23,18,14,.28);border:1.5px solid rgba(23,18,14,.55);opacity:calc(var(--tp) * (1 - clamp(0,calc((var(--w) - .385) * 40),1)));transform:scale(calc(.5 + var(--tp) * .5))}
.s3-menu{position:absolute;inset:0;opacity:var(--sw);transform:translateX(calc((1 - var(--sw)) * 8%))}
.s3-menu .pg{padding:5em 1.3em 2em;transform:translateY(calc(var(--ms) * var(--mr,25.5) * -1em))}
.s3-menu h4{margin:0;font:400 1.9em/1 "Times New Roman",Times,"Liberation Serif",serif;letter-spacing:-.02em}
.s3-menu h5{margin:1.5em 0 .1em;font-size:.66em;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:#d9a066}
.s3-d{display:grid;grid-template-columns:1fr auto;gap:.1em .8em;padding:.8em 0;border-bottom:1px solid rgba(243,233,220,.14);opacity:clamp(0,calc((var(--w) - var(--t)) * 30),1);transform:translateY(calc((1 - clamp(0,calc((var(--w) - var(--t)) * 30),1)) * 1em))}
.s3-d b{font:400 1.05em/1.2 "Times New Roman",Times,"Liberation Serif",serif}
.s3-d i{font-style:normal;font-size:.9em;color:#d9a066;font-weight:500}
.s3-d span{grid-column:1;font-size:.7em;line-height:1.35;color:#b8a78f}
@media (prefers-reduced-motion:reduce){.ph3-lb span,.ph3-ft i{transition:none}}

/* Pasos */
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:48px;border-top:1px solid var(--hair)}
.step{padding:20px 24px 0 0}
.step+.step{padding-left:24px;border-left:1px solid var(--hair)}
.step b{display:block;margin-top:10px;font-weight:300;font-size:28px;line-height:1;letter-spacing:-.03em}
.step p{margin:10px 0 0;font-size:16px;color:var(--mute)}

/* Como trabajo: Sticky Scroll Reveal (adaptado, sin React) */
.cw{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:0 64px;margin-top:48px;border-top:1px solid var(--hair);align-items:start}
.cw-list{list-style:none;margin:0;padding:0}
.cw-step{min-height:max(220px,36vh);display:flex;flex-direction:column;justify-content:center;padding:32px 0 32px 28px;border-left:2px solid var(--hair)}
.cw-k{color:#673AB7}
.cw-step b{display:block;margin-top:10px;font-weight:300;font-size:clamp(28px,3.2vw,44px);line-height:1;letter-spacing:-.035em;color:#000}
.cw-step p{margin:14px 0 0;max-width:32ch;font-size:19px;line-height:1.3;letter-spacing:-.02em;color:#2a2a2a}
.cw-panel{position:sticky;top:max(96px,calc(50vh - 190px));margin-top:32px}
.cw-card{position:relative;height:340px;overflow:hidden;border:1px solid var(--hair);background-color:#fff;background-image:radial-gradient(rgba(103,58,183,.18) 1px,transparent 1px);background-size:24px 24px}
.cw-layer{position:absolute;inset:0 0 28px 0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;opacity:0}
.cw-layer.is-on{opacity:1}
.cw-num{font-weight:300;font-size:clamp(110px,13vw,190px);line-height:.9;letter-spacing:-.05em;color:#673AB7}
.cw-name{color:#000}
.cw-bar{position:absolute;left:24px;right:24px;bottom:20px;display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.cw-seg{height:2px;background:var(--hair)}
.cw-seg.is-on{background:#673AB7}
.cw-on .cw-step{opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s ease,border-color .4s ease}
.cw-on .cw-step.is-in{opacity:.3;transform:none}
.cw-on .cw-step.is-on{opacity:1;transform:none;border-left-color:#673AB7}
.cw-on .cw-layer{transform:translateY(10px);transition:opacity .5s ease,transform .5s ease}
.cw-on .cw-layer.is-on{transform:none}
.cw-seg{transition:background .4s ease}
@media (max-width:900px){
  .cw{grid-template-columns:minmax(0,1fr)}
  .cw-panel{display:none}
  .cw-step{min-height:0;padding:24px 0 24px 20px}
  .cw-on .cw-step.is-in{opacity:.45}
  .cw-on .cw-step.is-on{opacity:1}
}
@media (prefers-reduced-motion:reduce){.cw-on .cw-step,.cw-on .cw-layer,.cw-seg{transition:none}}

/* Sobre mí */
.about{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:24px 64px}
.about p{margin:0 0 18px;font-size:19px;line-height:1.35;letter-spacing:-.02em;color:#d4d4d4}

/* Contacto */
.contact{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:40px 64px;align-items:start}
.contact h2{font-size:clamp(44px,7.4vw,112px);line-height:.92}
.contact .lead{margin-top:28px}
.info{margin-top:28px;display:grid;gap:4px}
form{display:grid;gap:18px}
.fr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
label{display:grid;gap:8px}
input,select,textarea{width:100%;min-height:48px;padding:12px 16px;background:var(--void);color:var(--bone);border:1px solid #3a3a3a;border-radius:10px;font:400 16px var(--font-sans)}
select{appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,#fff 50%),linear-gradient(135deg,#fff 50%,transparent 50%);background-position:calc(100% - 22px) 55%,calc(100% - 16px) 55%;background-size:6px 6px,6px 6px;background-repeat:no-repeat}
textarea{min-height:120px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--bone)}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--bone);outline-offset:2px}
.chk{display:flex;align-items:flex-start;gap:12px;color:var(--mute);font-size:14px;line-height:1.4}