/*
Theme Name: Duranmuebles
Description: Tema a medida para Duranmuebles. Todos los textos y fotos se editan desde el panel de WordPress.
Version: 1.0
Author: Duranmuebles
*/

:root{
  --void:#0A0A09;--char:#131210;--line:#2A2721;
  --smoke:#9D968A;--bone:#F0EBE1;--brass:#C89A4C;--brass-dim:#8A6A34;
  --f-d:"Instrument Serif","Iowan Old Style",Georgia,serif;
  --f-b:"Archivo","Helvetica Neue",Arial,sans-serif;
  --f-m:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  --gut:clamp(20px,5vw,64px);
}
*{box-sizing:border-box}
body{margin:0;background:var(--void);color:var(--bone);font-family:var(--f-b);font-size:16px;line-height:1.6;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
.mono{font-family:var(--f-m);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--smoke)}

.bar{position:fixed;top:0;left:0;right:0;z-index:60;display:flex;align-items:center;gap:16px;padding:12px var(--gut);background:linear-gradient(to bottom,rgba(10,10,9,.94),rgba(10,10,9,0));pointer-events:none}
.bar>*{pointer-events:auto}
.lock{line-height:1;text-decoration:none}
.lock b{display:block;font-family:var(--f-m);font-weight:500;font-size:13.5px;letter-spacing:.28em;color:var(--bone)}
.lock i{display:block;font-family:var(--f-d);font-style:italic;font-size:12px;color:var(--brass);margin-top:3px}
.bar-nav{display:flex;gap:20px;margin-left:auto}
.bar-nav a{color:var(--smoke);text-decoration:none;transition:color .25s}
.bar-nav a:hover{color:var(--brass)}
@media (max-width:800px){.bar-nav{display:none}}
.cta-top{font-family:var(--f-m);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;border:1px solid var(--brass-dim);color:var(--brass);border-radius:999px;padding:8px 15px;text-decoration:none;margin-left:auto;transition:background .25s,color .25s}
.bar-nav+.cta-top{margin-left:20px}
.cta-top:hover{background:var(--brass);color:var(--void)}
.rail{position:fixed;left:0;top:0;bottom:0;width:2px;z-index:55;background:var(--line)}
.rail i{display:block;width:100%;height:0;background:var(--brass)}

/* hero */
.hero{position:relative;min-height:92svh;display:flex;align-items:flex-end;padding:0 var(--gut) clamp(34px,6vh,72px);overflow:hidden}
.hero .bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.55}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,var(--void) 4%,rgba(10,10,9,.62) 48%,rgba(10,10,9,.72))}
.hero-in{position:relative;z-index:2;width:100%}
.kicker{margin:0 0 clamp(16px,3.5vh,30px)}
.hero h1{font-family:var(--f-d);font-weight:400;font-size:clamp(42px,8.8vw,122px);line-height:.94;letter-spacing:-.025em;margin:0;max-width:15ch}
.hero h1 .ln{display:block;overflow:hidden}
.hero h1 .ln>span{display:block}
.hero h1 i{font-style:italic;color:var(--brass)}
.hero-foot{display:flex;flex-wrap:wrap;align-items:flex-end;gap:20px 48px;margin-top:clamp(24px,4.5vh,48px);padding-top:20px;border-top:1px solid var(--line)}
.hero-foot p{margin:0;max-width:50ch;color:var(--smoke);font-size:15.5px}
.hero-foot strong{color:var(--bone);font-weight:500}
.cue{display:flex;align-items:center;gap:10px;margin-left:auto}
.cue .ln2{display:block;width:48px;height:1px;background:var(--brass);transform-origin:left}

/* corte */
.corte{position:relative;height:300vh}
.corte-pin{position:relative;height:100svh;overflow:hidden;display:flex;align-items:center;justify-content:center}
.plate{position:absolute;inset:0}
.plate img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.plate .fin{clip-path:inset(0 100% 0 0)}
.plate::after{content:"";position:absolute;inset:0;background:rgba(10,10,9,.5);z-index:2}
.blade{position:absolute;top:0;bottom:0;left:0;width:1px;z-index:3;background:linear-gradient(to bottom,transparent,var(--brass) 18%,var(--brass) 82%,transparent);box-shadow:0 0 22px 3px rgba(200,154,76,.4);opacity:0}
.corte-cap{position:relative;z-index:5;text-align:center;padding:0 var(--gut);pointer-events:none}
.corte-cap h2{font-family:var(--f-d);font-weight:400;font-size:clamp(30px,6vw,72px);line-height:1.02;letter-spacing:-.02em;margin:0 0 14px;text-wrap:balance}
.corte-cap .swap{display:block;position:relative;height:1.05em;overflow:hidden}
.corte-cap .swap b{display:block;font-weight:400;position:absolute;inset:0}
.corte-cap .swap b.b{color:var(--brass);transform:translateY(100%)}
.corte-cap p{margin:0 auto;max-width:46ch;color:var(--smoke);font-size:15px}

/* secciones */
.sec{padding:clamp(74px,12vh,140px) var(--gut);position:relative}
.sec-num{display:flex;align-items:baseline;gap:14px;border-top:1px solid var(--line);padding-top:14px;margin-bottom:clamp(22px,4vh,42px)}
.sec-num h2{font-family:var(--f-d);font-weight:400;font-size:clamp(26px,4.4vw,52px);line-height:1.05;letter-spacing:-.02em;margin:0;text-wrap:balance}
.sec-num .n{font-family:var(--f-m);font-size:11px;color:var(--brass);letter-spacing:.16em}
.lede{color:var(--smoke);max-width:58ch;font-size:16px;margin:0 0 clamp(26px,4.5vh,48px)}

/* tipos */
.tipos{height:280vh;position:relative}
.tipos-pin{height:100svh;overflow:hidden;display:flex;align-items:center}
.tipos-track{display:flex;gap:clamp(14px,2.2vw,26px);padding-inline:var(--gut);will-change:transform}
.tipo{flex:0 0 clamp(248px,32vw,368px);height:clamp(340px,60svh,500px);position:relative;overflow:hidden;border:1px solid var(--line);background:var(--char);text-decoration:none;color:inherit;display:block}
.tipo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.tipo:hover img{transform:scale(1.05)}
.tipo-i{position:absolute;left:0;right:0;bottom:0;z-index:3;padding:20px 18px 18px;background:linear-gradient(to top,rgba(10,10,9,.96) 38%,rgba(10,10,9,0))}
.tipo-i h3{font-family:var(--f-d);font-weight:400;font-size:27px;margin:0 0 5px;letter-spacing:-.01em;line-height:1.1}
.tipo-i p{margin:0 0 12px;font-size:13.5px;color:var(--smoke);line-height:1.45}
.tipo-i .foot{display:flex;align-items:baseline;gap:10px;border-top:1px solid var(--line);padding-top:10px}
.tipo-i .desde{font-family:var(--f-m);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--brass)}
.tipo-i .url{font-family:var(--f-m);font-size:10.5px;color:var(--smoke);margin-left:auto;opacity:.7}
.tipos-hint{position:absolute;top:calc(50% - clamp(210px,37svh,305px));left:var(--gut);z-index:4}

/* cifras */
.figs{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));border-top:1px solid var(--line)}
.fig{padding:24px 24px 26px 0;border-bottom:1px solid var(--line)}
.fig .v{font-family:var(--f-d);font-weight:400;font-size:clamp(42px,6.6vw,80px);line-height:1;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.fig .v s{text-decoration:none;color:var(--brass);font-size:.5em;vertical-align:.55em;margin-left:2px}
.fig .k{margin-top:8px;display:block}

/* taller */
.taller-g{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin-top:6px}
.taller-g figure{margin:0;position:relative;overflow:hidden;border:1px solid var(--line);aspect-ratio:4/5}
.taller-g img{width:100%;height:100%;object-fit:cover}
.taller-g figcaption{position:absolute;left:0;right:0;bottom:0;padding:10px 12px;font-family:var(--f-m);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--bone);background:linear-gradient(to top,rgba(10,10,9,.92),transparent)}

/* escaleras */
.esc{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;margin-top:8px}
@media (max-width:720px){.esc{grid-template-columns:minmax(0,1fr)}}
.esc img{width:100%;height:100%;object-fit:cover;border:1px solid var(--line)}
.esc-t{margin-top:20px;max-width:58ch}
.esc-t p{margin:0;color:var(--smoke);font-size:15.5px}

/* proceso */
.proc{position:relative;padding-left:clamp(28px,5vw,72px)}
.proc-line{position:absolute;left:0;top:6px;bottom:6px;width:1px;background:var(--line)}
.proc-line i{position:absolute;left:0;top:0;width:100%;height:100%;background:var(--brass);transform:scaleY(0);transform-origin:top}
.step{position:relative;padding-block:clamp(16px,2.6vh,28px);border-bottom:1px solid var(--line);display:grid;grid-template-columns:minmax(0,auto) minmax(0,1fr);gap:6px 32px}
.step::before{content:"";position:absolute;left:calc(clamp(28px,5vw,72px)*-1);top:calc(clamp(16px,2.6vh,28px) + 11px);width:9px;height:9px;border-radius:50%;background:var(--void);border:1px solid var(--brass-dim);transform:translateX(-4px)}
.step h3{font-family:var(--f-b);font-weight:600;font-size:17px;margin:0}
.step p{margin:0;color:var(--smoke);font-size:15px;max-width:56ch}
.step .t{font-family:var(--f-m);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--brass-dim);grid-column:1/-1}
@media (min-width:780px){.step{grid-template-columns:minmax(0,230px) minmax(0,1fr) minmax(0,110px)}.step .t{grid-column:auto;text-align:right}}

/* banda constructores */
.band{margin:0 var(--gut);border:1px solid var(--line);background:var(--char);padding:26px clamp(20px,3vw,32px);display:flex;flex-wrap:wrap;gap:16px 32px;align-items:center}
.band-t{flex:1 1 320px;min-width:0}
.band-t h3{font-family:var(--f-d);font-weight:400;font-size:clamp(21px,3vw,30px);margin:0 0 7px;letter-spacing:-.015em;line-height:1.15}
.band-t p{margin:0;color:var(--smoke);font-size:14.5px;max-width:56ch}

/* cierre */
.close{padding:clamp(86px,15vh,180px) var(--gut);text-align:center;position:relative}
.close h2{font-family:var(--f-d);font-weight:400;font-size:clamp(34px,7.6vw,100px);line-height:.98;letter-spacing:-.03em;margin:0 auto 24px;max-width:15ch;text-wrap:balance}
.close h2 i{font-style:italic;color:var(--brass)}
.close>p{margin:0 auto 30px;max-width:44ch;color:var(--smoke)}
.ctas{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.cta{font-family:var(--f-m);font-size:11px;letter-spacing:.14em;text-transform:uppercase;padding:14px 26px;border-radius:999px;text-decoration:none;border:1px solid var(--brass-dim);color:var(--brass);transition:background .3s,color .3s;display:inline-block}
.cta:hover{background:var(--brass);color:var(--void)}
.cta.solid{background:var(--brass);color:var(--void);border-color:var(--brass)}
.cta.solid:hover{background:transparent;color:var(--brass)}

footer{padding:32px var(--gut) 46px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:14px 28px;align-items:baseline}
footer p{margin:0;color:var(--smoke);font-size:13.5px;max-width:56ch}
footer a{color:var(--brass)}
:focus-visible{outline:2px solid var(--brass);outline-offset:3px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ---------- paginas interiores ---------- */
.wrap-page{max-width:1120px;margin:0 auto;padding-inline:var(--gut)}
.crumb{max-width:1120px;margin:0 auto;padding:86px var(--gut) 0}
.crumb a{color:var(--smoke);text-decoration:none}
.crumb a:hover{color:var(--brass)}
.crumb span{color:var(--brass-dim);margin-inline:8px}
.hero-pg{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(20px,3vw,44px);align-items:center;padding-block:clamp(28px,5vh,52px) clamp(44px,7vh,80px)}
@media (max-width:840px){.hero-pg{grid-template-columns:minmax(0,1fr)}}
.hero-pg h1{font-family:var(--f-d);font-weight:400;font-size:clamp(34px,6vw,70px);line-height:1;letter-spacing:-.025em;margin:0 0 18px;text-wrap:balance}
.hero-pg .bajada{margin:0 0 22px;color:var(--smoke);font-size:16.5px;max-width:46ch}
.price-line{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 14px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding-block:14px;margin-bottom:22px}
.price-line .big{font-family:var(--f-d);font-size:clamp(26px,3.6vw,38px);color:var(--brass);letter-spacing:-.02em;line-height:1}
.hero-shot{position:relative;aspect-ratio:4/5;border:1px solid var(--line);overflow:hidden}
.hero-shot img{width:100%;height:100%;object-fit:cover}
.sec-pg{padding-block:clamp(48px,8vh,92px);border-top:1px solid var(--line)}
.sec-h{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 16px;margin-bottom:18px}
.sec-h h2{font-family:var(--f-d);font-weight:400;font-size:clamp(26px,4.2vw,46px);line-height:1.06;letter-spacing:-.02em;margin:0;text-wrap:balance}
.sec-h .n{font-family:var(--f-m);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--brass);margin-left:auto}
.specs{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:0;border-top:1px solid var(--line);margin:0}
.spec{padding:18px 24px 20px 0;border-bottom:1px solid var(--line)}
.spec dt{font-family:var(--f-m);font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--brass);margin-bottom:6px}
.spec dd{margin:0;font-size:15px;color:var(--bone)}
