@font-face{font-family:'Bricolage Grotesque';font-weight:200 800;font-display:swap;src:url(../fonts/bricolage-grotesque-latin-ext-wght-normal.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}
@font-face{font-family:'Bricolage Grotesque';font-weight:200 800;font-display:swap;src:url(../fonts/bricolage-grotesque-latin-wght-normal.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}
@font-face{font-family:'Hanken Grotesk';font-weight:100 900;font-display:swap;src:url(../fonts/hanken-grotesk-latin-ext-wght-normal.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}
@font-face{font-family:'Hanken Grotesk';font-weight:100 900;font-display:swap;src:url(../fonts/hanken-grotesk-latin-wght-normal.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}
/* Estudio de reformas premium: portada a sangre (foto o plano animado), franja de confianza, servicios con imagen, presupuesto en 4 pasos, antes/después, proceso, FAQ, zonas y pie completo. Grafito + yeso + latón. */
:root{
  color-scheme:light;
  --fondo:#f5f4f1; --papel:#ffffff; --tinta:#15171a; --gris:#5b6067; --linea:#e2e0da; --suave:#ecebe6;
  --noche:#0f1113; --noche2:#171a1d; --yeso:#efece5; --gris-n:#a7a399;
  --laton:#a97c27; --laton2:#d4ad5c; --ok:#2f7d55;
  --display:'Bricolage Grotesque','Arial Narrow',system-ui,sans-serif;
  --texto:'Hanken Grotesk',system-ui,-apple-system,'Segoe UI',sans-serif;
  --r:22px;
}
*{box-sizing:border-box}[hidden]{display:none!important}
html{scroll-behavior:smooth;scroll-padding-top:84px}
html{scroll-padding-top:84px;overflow-x:clip}
body{margin:0;background:var(--fondo);color:var(--tinta);font:17px/1.62 var(--texto);-webkit-font-smoothing:antialiased}
.env{max-width:1200px;margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
a{color:inherit}img{max-width:100%;display:block}
:focus-visible{outline:3px solid var(--laton2);outline-offset:3px;border-radius:6px}
h1,h2,h3{font-family:var(--display);text-wrap:balance;margin:0}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before{animation:none!important;transition:none!important}}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:16px 28px;border-radius:999px;font:700 16px/1 var(--texto);text-decoration:none;border:0;cursor:pointer;white-space:nowrap;transition:transform .2s,background .2s,box-shadow .2s}
.btn:hover{transform:translateY(-1px)}
.btn svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.btn-oro{background:var(--laton2);color:#15171a;box-shadow:0 10px 30px -12px rgba(212,173,92,.7)}.btn-oro:hover{background:#e2bd70}
.btn-claro{background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.22);backdrop-filter:blur(6px)}.btn-claro:hover{background:rgba(255,255,255,.14)}
.btn-tinta{background:var(--tinta);color:var(--fondo)}
.k{display:inline-flex;align-items:center;gap:10px;font:700 13px var(--texto);letter-spacing:.12em;text-transform:uppercase;color:var(--laton)}
.k::before{content:"";width:26px;height:1.5px;background:currentColor}
/* ===== cabecera ===== */
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:20;background:var(--noche)}
.cab{position:fixed;left:0;right:0;top:env(safe-area-inset-top,0px);z-index:15;color:#fff;transition:background .3s,box-shadow .3s,padding .3s}
.cab.solida{background:rgba(15,17,19,.94);backdrop-filter:blur(12px);box-shadow:0 1px 0 rgba(255,255,255,.07)}
.cab .env{display:flex;align-items:center;gap:26px;padding-block:18px;transition:padding .3s}
.cab.solida .env{padding-block:12px}
.marca{display:flex;align-items:center;gap:12px;text-decoration:none}.marca .ico{width:40px;height:40px;flex:none}
.marca .mt{display:grid;line-height:1}.marca b{font:800 24px/1 var(--display);letter-spacing:.05em;color:#f3f0e9}.marca small{font:600 10.5px/1 var(--texto);letter-spacing:.42em;color:var(--gris-n);margin-top:5px}
.cab nav{display:flex;gap:26px;margin-left:auto}
.cab nav a{text-decoration:none;font-weight:600;font-size:15px;color:rgba(255,255,255,.75);position:relative;padding-block:6px}
.cab nav a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1.5px;background:var(--laton2);transform:scaleX(0);transform-origin:left;transition:transform .25s}
.cab nav a:hover{color:#fff}.cab nav a:hover::after{transform:scaleX(1)}
.cab .tel{display:flex;align-items:center;gap:8px;font-weight:700;text-decoration:none;color:#fff;white-space:nowrap}
.cab .tel svg{width:18px;height:18px;fill:none;stroke:var(--laton2);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.cab .btn{padding:12px 20px;font-size:15px}
@media (max-width:1040px){.cab nav{display:none}.cab .tel{margin-left:auto}}
@media (max-width:640px){.cab .tel,.cab .btn{display:none}}
/* ===== portada ===== */
.portada{position:relative;min-height:min(880px,100svh);display:flex;align-items:flex-end;color:#fff;background:var(--noche);overflow:hidden;isolation:isolate}
.portada .foto{position:absolute;inset:0;z-index:-2}
.portada .foto img{width:100%;height:100%;object-fit:cover;transform:scale(1.04);animation:zoom 14s ease-out forwards}
@keyframes zoom{to{transform:scale(1)}}
.portada::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(15,17,19,.55) 0%,rgba(15,17,19,.25) 35%,rgba(15,17,19,.88) 100%),radial-gradient(ellipse 70% 60% at 80% 35%,rgba(212,173,92,.10),transparent 70%)}
.portada.sinfoto::before{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:52px 52px}
.portada .env{width:100%;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:48px;align-items:end;padding-block:150px 64px}
@media (max-width:980px){.portada .env{grid-template-columns:minmax(0,1fr);padding-block:120px 44px}}
.portada .k{color:var(--laton2)}
.portada h1{font-size:clamp(42px,6.2vw,84px);line-height:.98;font-weight:800;letter-spacing:-.025em;margin-top:20px}
.portada h1 em{font-style:normal;color:var(--laton2)}
.portada .lead{font-size:clamp(18px,2vw,21px);color:rgba(255,255,255,.78);max-width:46ch;margin:26px 0 34px}
.portada .acc{display:flex;flex-wrap:wrap;gap:12px}
.plano{width:100%;max-width:470px;justify-self:end;aspect-ratio:1/1;margin-bottom:6px}
.portada:not(.sinfoto) .plano{display:none}
@media (max-width:980px){.plano{display:none}}
.plano .m{fill:none;stroke:var(--laton2);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1500;stroke-dashoffset:1500;animation:dib 3.4s cubic-bezier(.6,.1,.2,1) .2s forwards}
.plano .f{fill:none;stroke:rgba(239,236,229,.5);stroke-width:1.2;stroke-dasharray:700;stroke-dashoffset:700;animation:dib 2.6s 1.2s ease forwards}
.plano .c{fill:none;stroke:rgba(212,173,92,.5);stroke-width:1;stroke-dasharray:4 5}
.plano text{fill:#aaa598;font:600 12px var(--texto);letter-spacing:.08em;opacity:0;animation:ap .6s 2.6s forwards}
.plano .z{fill:rgba(212,173,92,.07);opacity:0;animation:ap 1s 2.4s forwards}
@keyframes dib{to{stroke-dashoffset:0}}@keyframes ap{to{opacity:1}}
.tarjeta-p{background:rgba(23,26,29,.72);backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.12);border-radius:var(--r);padding:26px;justify-self:end;width:100%;max-width:420px}
.portada.sinfoto .tarjeta-p{display:none}
@media (max-width:980px){.tarjeta-p{display:none}}
.tarjeta-p h3{font-size:22px;margin-bottom:6px}.tarjeta-p p{margin:0 0 18px;color:rgba(255,255,255,.7);font-size:15.5px}
.tarjeta-p .op{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.tarjeta-p .op a{padding:14px;border-radius:14px;border:1px solid rgba(255,255,255,.14);text-decoration:none;font-weight:600;font-size:15px;transition:border-color .2s,background .2s}
.tarjeta-p .op a:hover{border-color:var(--laton2);background:rgba(212,173,92,.08)}
/* ===== franja ===== */
.franja{background:var(--noche2);color:#cfcbc1}
.franja .env{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;padding-block:24px}
@media (max-width:900px){.franja .env{grid-template-columns:repeat(2,minmax(0,1fr))}}
.franja div{display:flex;gap:14px;align-items:center;font-size:14.5px;min-width:0;line-height:1.35}.franja b{color:#fff;font-weight:700;display:block;font-size:15.5px}
.franja svg{width:30px;height:30px;flex:none;fill:none;stroke:var(--laton2);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
/* ===== secciones ===== */
section{padding-block:96px}
@media (max-width:700px){section{padding-block:68px}}
.tit{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:20px 40px;margin-bottom:44px}
@media (max-width:800px){.tit{grid-template-columns:minmax(0,1fr)}}
.tit h2{font-size:clamp(34px,4.6vw,56px);line-height:1.03;font-weight:700;letter-spacing:-.015em;margin-top:14px}
.tit p{color:var(--gris);margin:16px 0 0;max-width:60ch}
/* servicios */
.servs{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:18px}
.serv{grid-column:span 2;position:relative;border-radius:var(--r);overflow:hidden;min-height:400px;display:flex;align-items:flex-end;color:#fff;text-decoration:none;background:linear-gradient(160deg,#20242a,#121417);isolation:isolate}
.serv.g{grid-column:span 3;min-height:460px}
@media (max-width:980px){.serv,.serv.g{grid-column:span 3;min-height:360px}}
@media (max-width:640px){.servs{grid-template-columns:minmax(0,1fr)}.serv,.serv.g{grid-column:auto;min-height:320px}}
.serv img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.serv:hover img{transform:scale(1.05)}
.serv::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(0,0,0,0) 38%,rgba(10,11,13,.5) 62%,rgba(10,11,13,.88) 100%)}.serv.confoto .tx{text-shadow:0 1px 14px rgba(0,0,0,.45)}
.serv:not(.confoto){background:radial-gradient(ellipse 90% 70% at 50% 25%,#262a31 0%,#14171a 70%);border:1px solid rgba(255,255,255,.06)}.serv:not(.confoto)::after{background:linear-gradient(180deg,transparent 45%,rgba(10,11,13,.6) 100%)}
.serv .dib{position:absolute;inset:0 0 auto 0;height:62%;display:grid;place-items:center;z-index:-1}
.serv .dib svg{width:46%;max-width:200px;fill:none;stroke:var(--laton2);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;opacity:.85}
.serv.confoto .dib{display:none}
.serv .tx{padding:28px;display:grid;gap:8px}
.serv h3{font-size:clamp(24px,2.4vw,30px);font-weight:700}
.serv p{margin:0;color:rgba(255,255,255,.78);font-size:15.5px;max-width:42ch}
.serv .ir{display:inline-flex;align-items:center;gap:8px;margin-top:8px;font-weight:700;color:var(--laton2);font-size:15px}
.serv .ir svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.2;transition:transform .2s}.serv:hover .ir svg{transform:translateX(4px)}
/* por qué */
.porque{background:var(--papel);border-block:1px solid var(--linea)}
.pq{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1px solid var(--linea)}
@media (max-width:900px){.pq{grid-template-columns:minmax(0,1fr)}}
.pq div{padding:30px 30px 30px 0;border-right:1px solid var(--linea);min-width:0}
.pq div:nth-child(3n){border-right:0}
@media (max-width:900px){.pq div{border-right:0;border-bottom:1px solid var(--linea);padding-right:0}}
.pq h3{font-size:23px;font-weight:700;margin:14px 0 8px}.pq p{margin:0;color:var(--gris)}
.pq svg{width:36px;height:36px;fill:none;stroke:var(--laton);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
/* proyectos antes/después */
.proy{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
@media (max-width:800px){.proy{grid-template-columns:minmax(0,1fr)}}
.ad{position:relative;border-radius:var(--r);overflow:hidden;aspect-ratio:4/3;max-width:100%;background:var(--suave);user-select:none;touch-action:pan-y}
.ad img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ad .antes{clip-path:inset(0 calc(100% - var(--p,50%)) 0 0)}
.ad .barra{position:absolute;top:0;bottom:0;left:var(--p,50%);width:2px;background:#fff;transform:translateX(-1px)}
.ad .barra i{position:absolute;top:50%;left:50%;width:46px;height:46px;margin:-23px 0 0 -23px;border-radius:50%;background:#fff;box-shadow:0 6px 20px rgba(0,0,0,.3);display:grid;place-items:center;font-style:normal;color:#15171a;font-weight:800}
.ad .et{position:absolute;top:14px;padding:6px 12px;border-radius:999px;background:rgba(15,17,19,.7);color:#fff;font:700 12px var(--texto);letter-spacing:.08em;text-transform:uppercase}
.ad .et.a{left:14px}.ad .et.d{right:14px}
.ad input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0}
.proy figure{margin:0}.proy figcaption{padding:14px 4px 0;font-weight:600}.proy figcaption small{display:block;font-weight:400;color:var(--gris)}
.gal{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:18px}
@media (max-width:760px){.gal{grid-template-columns:repeat(2,minmax(0,1fr))}}
.gal img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:16px}
/* presupuesto por pasos: estudio premium */
.presu{background:radial-gradient(ellipse 80% 60% at 85% 0%,rgba(212,173,92,.10),transparent 60%),var(--noche);color:var(--yeso)}
.presu .cab-p{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:20px 48px;margin-bottom:46px}
@media (max-width:900px){.presu .cab-p{grid-template-columns:minmax(0,1fr)}}
.presu h2{font-size:clamp(36px,5vw,62px);line-height:1;font-weight:700;letter-spacing:-.02em;margin-top:14px}
.presu .sub{color:#b9b5ab;margin:0;max-width:40ch}
.presu .k{color:var(--laton2)}
.estudio{display:grid;grid-template-columns:minmax(0,1fr) 340px;border-radius:30px;overflow:hidden;background:#15181b;border:1px solid rgba(255,255,255,.07);box-shadow:0 40px 80px -40px rgba(0,0,0,.8)}
@media (max-width:980px){.estudio{grid-template-columns:minmax(0,1fr)}}
.asist{padding:clamp(26px,4.4vw,56px);min-width:0;position:relative}
.cont-p{display:flex;align-items:center;gap:16px;margin-bottom:34px;font:600 13px var(--texto);letter-spacing:.14em;text-transform:uppercase;color:#8f8b82}
.cont-p b{color:var(--laton2);font:800 15px var(--display);letter-spacing:.04em}
.cont-p .ln{flex:1;height:1px;background:rgba(255,255,255,.1);position:relative;overflow:hidden}
.cont-p .ln i{position:absolute;inset:0 auto 0 0;width:25%;background:var(--laton2);transition:width .5s cubic-bezier(.2,.7,.2,1)}
.paso-f h3{font-size:clamp(28px,3.2vw,40px);font-weight:700;letter-spacing:-.01em;line-height:1.08}
.paso-f .pp{color:#9f9b92;margin:12px 0 30px;font-size:16px}
.paso-f.entra{animation:entra .45s cubic-bezier(.2,.7,.2,1)}
@keyframes entra{from{opacity:0;transform:translateX(26px)}to{opacity:1;transform:none}}
.opciones{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
@media (max-width:760px){.opciones{grid-template-columns:repeat(2,minmax(0,1fr))}}
.opciones.dos-col{grid-template-columns:repeat(2,minmax(0,1fr))}
.opcion{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:14px;text-align:left;padding:22px 20px 20px;border-radius:20px;border:1px solid rgba(255,255,255,.09);background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.01));color:var(--yeso);font:700 17px/1.2 var(--display);cursor:pointer;transition:border-color .25s,background .25s,transform .25s,box-shadow .25s;min-width:0}
.opcion:hover{transform:translateY(-3px);border-color:rgba(212,173,92,.45);box-shadow:0 18px 40px -24px rgba(0,0,0,.9)}
.opcion svg{width:46px;height:46px;fill:none;stroke:var(--laton2);stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
.opcion small{display:block;margin-top:5px;font:400 13.5px/1.35 var(--texto);color:#98948b}
.opcion::after{content:"";position:absolute;top:16px;right:16px;width:22px;height:22px;border-radius:50%;border:1.5px solid rgba(255,255,255,.18);transition:all .25s}
.opcion[aria-pressed="true"]{border-color:var(--laton2);background:linear-gradient(180deg,rgba(212,173,92,.14),rgba(212,173,92,.04))}
.opcion[aria-pressed="true"]::after{background:var(--laton2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12l4 4 8-8' fill='none' stroke='%2315171a' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px no-repeat;border-color:var(--laton2)}
.opcion.simple{padding:20px;font-size:17px}
.opcion.simple .big{font:800 26px/1 var(--display);color:#fff}
.campos{display:grid;gap:26px}
.fila{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px}@media (max-width:560px){.fila{grid-template-columns:minmax(0,1fr)}}
.campo{position:relative;display:block}
.campo input,.campo textarea{width:100%;padding:24px 0 10px;border:0;border-bottom:1px solid rgba(239,236,229,.2);background:transparent;color:#fff;font:500 18px var(--texto);border-radius:0;transition:border-color .25s}
.campo textarea{min-height:86px;resize:vertical}
.campo span{position:absolute;left:0;top:24px;color:#8f8b82;font:500 16px var(--texto);pointer-events:none;transition:all .2s}
.campo input:focus,.campo textarea:focus{outline:none;border-color:var(--laton2)}
.campo input:focus+span,.campo input:not(:placeholder-shown)+span,.campo textarea:focus+span,.campo textarea:not(:placeholder-shown)+span{top:0;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--laton2)}
.cuando{margin-top:6px}
.check{display:flex;gap:12px;align-items:flex-start;font:500 14.5px/1.45 var(--texto);color:#b9b5ab;cursor:pointer}
.check input{appearance:none;width:22px;height:22px;margin:1px 0 0;flex:none;border-radius:7px;border:1.5px solid rgba(255,255,255,.25);background:transparent;cursor:pointer;display:grid;place-items:center}
.check input:checked{background:var(--laton2);border-color:var(--laton2)}
.check input:checked::after{content:"";width:10px;height:6px;border:2.5px solid #15171a;border-top:0;border-right:0;transform:rotate(-45deg) translate(1px,-1px)}
.trampa{position:absolute;left:-9999px}
.nav-f{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:38px;padding-top:26px;border-top:1px solid rgba(255,255,255,.07)}
.atras{display:inline-flex;align-items:center;gap:8px;background:none;border:0;color:#b9b5ab;font:600 15px var(--texto);cursor:pointer;padding:10px 0}.atras:hover{color:#fff}
.atras svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2}
.estado{min-height:1.4em;margin:14px 0 0;font-weight:600;font-size:15px}.estado.mal{color:#ffb3a3}
.hecho{text-align:left;padding:10px 0 4px}.hecho .sello{width:76px;height:76px;border-radius:50%;display:grid;place-items:center;background:rgba(212,173,92,.12);border:1px solid rgba(212,173,92,.4);margin-bottom:24px}
.hecho svg{width:36px;height:36px;fill:none;stroke:var(--laton2);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.hecho h3{font-size:clamp(28px,3.2vw,40px)}.hecho p{color:#b9b5ab;margin:12px 0 0;max-width:42ch}
/* resumen lateral */
.resumen{background:linear-gradient(180deg,#1b1f23,#14171a);border-left:1px solid rgba(255,255,255,.07);padding:clamp(26px,3.4vw,40px);display:flex;flex-direction:column;gap:22px;min-width:0}
@media (max-width:980px){.resumen{border-left:0;border-top:1px solid rgba(255,255,255,.07)}}
.resumen h4{margin:0;font:700 13px var(--texto);letter-spacing:.14em;text-transform:uppercase;color:#8f8b82}
.res-l{list-style:none;margin:0;padding:0;display:grid;gap:0}
.res-l li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 14px;padding:16px 0;border-bottom:1px solid rgba(255,255,255,.07)}
.res-l li i{grid-row:span 2;width:30px;height:30px;border-radius:50%;border:1px solid rgba(255,255,255,.14);display:grid;place-items:center;font:700 12px var(--texto);font-style:normal;color:#8f8b82;transition:all .3s}
.res-l li.ok i{background:var(--laton2);border-color:var(--laton2);color:#15171a}
.res-l small{font:600 12px var(--texto);letter-spacing:.1em;text-transform:uppercase;color:#7f7b73}
.res-l b{font:600 16px var(--texto);color:#ece9e2;min-height:1.3em}
.res-l li:not(.ok) b{color:#5f5c56;font-weight:500}
.compromiso{margin-top:auto;display:grid;gap:12px;font-size:14.5px;color:#b9b5ab}
.compromiso div{display:flex;gap:12px;align-items:flex-start}.compromiso svg{width:20px;height:20px;flex:none;margin-top:2px;fill:none;stroke:var(--laton2);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.datos{display:grid;gap:14px}.datos a{display:flex;gap:14px;align-items:center;text-decoration:none;font-weight:700;font-size:16px;color:#fff}
.datos svg{width:22px;height:22px;flex:none;fill:none;stroke:var(--laton2);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.datos small{display:block;font:500 12px var(--texto);color:#8f8b82;letter-spacing:.06em}
.opcion{padding-right:46px}.opcion.simple .big{white-space:nowrap}
@media (max-width:560px){.opcion.simple .big{font-size:21px}.opcion{padding:18px 40px 16px 16px;gap:10px;font-size:15.5px}.opcion svg{width:38px;height:38px}.opcion::after{top:12px;right:12px;width:20px;height:20px}.compromiso{display:none}.res-l li{padding:12px 0}}
.legal{font-size:12px;color:#77736b;margin:0}
/* proceso */
.pasos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px;counter-reset:n}
@media (max-width:900px){.pasos{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:520px){.pasos{grid-template-columns:minmax(0,1fr)}}
.paso{position:relative;padding-top:26px;border-top:2px solid var(--tinta);min-width:0}
.paso b{display:block;font:800 46px/1 var(--display);color:var(--laton);font-variant-numeric:tabular-nums;margin-bottom:14px}
.paso h3{font-size:21px;font-weight:700;margin-bottom:6px}.paso p{margin:0;color:var(--gris);font-size:16px}
/* faq */
.dos{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:56px;align-items:start}
@media (max-width:900px){.dos{grid-template-columns:minmax(0,1fr);gap:34px}}
.incl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:26px 0 0;padding:0;list-style:none}
.incl li{background:var(--papel);border:1px solid var(--linea);border-radius:14px;padding:14px 16px;font-weight:600;font-size:15.5px;display:flex;gap:10px;align-items:center}
.incl li::before{content:"";width:9px;height:9px;border-radius:2px;background:var(--laton);flex:none}
details{border-bottom:1px solid var(--linea);padding:20px 0}
summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px;font:700 19px/1.35 var(--display)}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font:400 30px/.8 var(--texto);color:var(--laton);transition:transform .25s}
details[open] summary::after{transform:rotate(45deg)}
details p{margin:12px 0 0;color:var(--gris)}
/* zonas */
.zonas{background:var(--papel);border-top:1px solid var(--linea)}
.lista-z{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;font-size:15.5px}
@media (max-width:640px){.lista-z{grid-template-columns:repeat(2,minmax(0,1fr))}}
.lista-z ul{margin:10px 0 0;padding:0;list-style:none}.lista-z li{padding:8px 0;border-bottom:1px dashed var(--linea)}
.lista-z b{display:block;font:700 13px var(--texto);letter-spacing:.1em;text-transform:uppercase;color:var(--laton)}
/* cta final */
.cta{position:relative;background:var(--noche);color:#fff;overflow:hidden}
.cta .env{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px;padding-block:64px}
.cta h2{font-size:clamp(30px,4vw,48px);line-height:1.05;font-weight:700;max-width:18ch}
/* pie */
footer{background:#0b0c0e;color:#8f8b82;font-size:14.5px}
.pie{display:grid;grid-template-columns:minmax(0,1.3fr) repeat(3,minmax(0,1fr));gap:36px;padding-block:56px 34px}
@media (max-width:900px){.pie{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.pie h4{margin:0 0 14px;font:700 13px var(--texto);letter-spacing:.1em;text-transform:uppercase;color:#cfcbc1}
.pie ul{margin:0;padding:0;list-style:none;display:grid;gap:9px}.pie a{text-decoration:none}.pie a:hover{color:#fff}
.pie p{margin:16px 0 0;max-width:34ch}
.bajo{border-top:1px solid rgba(255,255,255,.07)}.bajo .env{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;padding-block:20px 30px;font-size:13.5px}
/* flotantes y barra móvil */
.flot{position:fixed;right:max(18px,env(safe-area-inset-right,0px));bottom:max(18px,env(safe-area-inset-bottom,0px));z-index:14}
.flot a{width:60px;height:60px;border-radius:50%;display:grid;place-items:center;background:#1f9d55;box-shadow:0 12px 30px rgba(0,0,0,.35)}
.flot svg{width:30px;height:30px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.barra-m{display:none}
@media (max-width:640px){
  .barra-m{display:grid;grid-template-columns:repeat(var(--n,1),minmax(0,1fr));gap:8px;position:fixed;left:0;right:0;bottom:0;z-index:14;padding:10px max(12px,env(safe-area-inset-right,0px)) calc(10px + env(safe-area-inset-bottom,0px)) max(12px,env(safe-area-inset-left,0px));background:rgba(15,17,19,.95);backdrop-filter:blur(10px);border-top:1px solid rgba(255,255,255,.08)}
  .barra-m a{display:flex;align-items:center;justify-content:center;gap:8px;padding:14px;border-radius:14px;font:700 15px var(--texto);text-decoration:none;color:#fff;background:rgba(255,255,255,.08)}
  .barra-m a.p{background:var(--laton2);color:#15171a}
  .barra-m svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
  .flot{display:none}body{padding-bottom:84px}
}
/* ===== tema claro (confianza) ===== */
:root{color-scheme:light}
body::before{background:#fff}
.cab,.cab.solida{background:rgba(255,255,255,.96);backdrop-filter:blur(12px);box-shadow:0 1px 0 var(--linea);color:var(--tinta)}
.marca b{color:var(--tinta)}.marca small{color:var(--gris)}
.cab nav a{color:#41464d}.cab nav a:hover{color:var(--tinta)}.cab .tel{color:var(--tinta)}
.portada.sinfoto{background:linear-gradient(180deg,#fbfaf7,#f1efe9);color:var(--tinta)}
.portada.sinfoto::after{background:radial-gradient(ellipse 60% 55% at 82% 40%,rgba(212,173,92,.16),transparent 70%)}
.portada.sinfoto::before{background-image:linear-gradient(rgba(21,23,26,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(21,23,26,.045) 1px,transparent 1px)}
.portada.sinfoto .k,.portada.sinfoto h1 em{color:var(--laton)}
.portada.sinfoto .lead{color:#4b5057}
.portada.sinfoto .btn-claro{background:#fff;color:var(--tinta);border:1px solid #d6d3cb}.portada.sinfoto .btn-claro:hover{background:#f6f4ef}
.portada.sinfoto .plano .m{stroke:var(--laton)}.portada.sinfoto .plano .f{stroke:rgba(21,23,26,.35)}.portada.sinfoto .plano .c{stroke:rgba(169,124,39,.45)}.portada.sinfoto .plano text{fill:#6b7077}.portada.sinfoto .plano .z{fill:rgba(212,173,92,.14)}
.franja{background:#fff;color:var(--gris);border-block:1px solid var(--linea)}.franja b{color:var(--tinta)}.franja svg{stroke:var(--laton)}
.serv:not(.confoto){background:linear-gradient(180deg,#fff,#f6f4ef);border:1px solid var(--linea);color:var(--tinta);box-shadow:0 20px 40px -32px rgba(21,23,26,.35)}
.serv:not(.confoto){flex-direction:column;align-items:stretch;justify-content:space-between}.serv:not(.confoto) .dib{position:relative;inset:auto;height:auto;flex:1;min-height:150px;padding-top:28px}.serv:not(.confoto) .dib svg{width:38%;max-width:170px}
.serv:not(.confoto)::after{display:none}.serv:not(.confoto) p{color:var(--gris)}.serv:not(.confoto) .ir{color:var(--laton)}.serv:not(.confoto) .dib svg{stroke:var(--laton)}
/* presupuesto claro */
.presu{background:var(--papel);color:var(--tinta);border-block:1px solid var(--linea)}
.presu .k{color:var(--laton)}.presu .sub{color:var(--gris)}
.estudio{background:#fff;border:1px solid var(--linea);box-shadow:0 40px 80px -48px rgba(21,23,26,.35)}
.cont-p{color:var(--gris)}.cont-p b{color:var(--laton)}.cont-p .ln{background:var(--linea)}.cont-p .ln i{background:var(--laton)}
.paso-f .pp{color:var(--gris)}
.opcion{background:#fff;border:1px solid #dedbd3;color:var(--tinta)}
.opcion:hover{border-color:var(--laton2);box-shadow:0 18px 36px -26px rgba(21,23,26,.4)}
.opcion svg{stroke:var(--laton)}.opcion small{color:var(--gris)}.opcion.simple .big{color:var(--tinta)}
.opcion::after{border-color:#cfccc4}
.opcion[aria-pressed="true"]{background:#fbf6ea;border-color:var(--laton2);box-shadow:0 0 0 1px var(--laton2) inset}
.campo input,.campo textarea{color:var(--tinta);border-bottom-color:#cfccc4}.campo span{color:#7b8087}
.campo input:focus,.campo textarea:focus{border-color:var(--laton)}
.campo input:focus+span,.campo input:not(:placeholder-shown)+span,.campo textarea:focus+span,.campo textarea:not(:placeholder-shown)+span{color:var(--laton)}
.check{color:#4b5057}.check input{border-color:#bdb9b0}
.nav-f{border-top-color:var(--linea)}.atras{color:#4b5057}.atras:hover{color:var(--tinta)}
.estado.mal{color:#b3261e}
.hecho .sello{background:#fbf6ea;border-color:var(--laton2)}.hecho svg{stroke:var(--laton)}.hecho p{color:var(--gris)}
.resumen{background:#faf8f4;border-left-color:var(--linea)}
@media (max-width:980px){.resumen{border-top-color:var(--linea)}}
.resumen h4{color:var(--gris)}.res-l li{border-bottom-color:var(--linea)}
.res-l li i{border-color:#cfccc4;color:var(--gris)}.res-l li.ok i{background:var(--laton2);border-color:var(--laton2);color:#15171a}
.res-l small{color:#7b8087}.res-l b{color:var(--tinta)}.res-l li:not(.ok) b{color:#a3a29c}
.compromiso{color:#4b5057}.compromiso svg{stroke:var(--ok)}
.datos a{color:var(--tinta)}.datos svg{stroke:var(--laton)}.datos small{color:var(--gris)}.legal{color:#8a8e94}
/* cierre y pie */
.cta{background:#efe8d8;color:var(--tinta)}
footer{background:#f1f0ec;color:var(--gris);border-top:1px solid var(--linea)}
footer .marca b{color:var(--tinta)}.pie h4{color:var(--tinta)}.pie a:hover{color:var(--tinta)}.bajo{border-top-color:var(--linea)}
@media (max-width:640px){.barra-m{background:rgba(255,255,255,.97);border-top:1px solid var(--linea);box-shadow:0 -8px 24px -16px rgba(21,23,26,.3)}.barra-m a{background:var(--suave);color:var(--tinta)}.barra-m a.p{background:var(--laton2);color:#15171a}}
/* fotos reales */
.portada.confotoH .plano{display:none}
.portada.confotoH .env{align-items:center;padding-block:130px 70px}
.hero-foto{margin:0;justify-self:end;width:100%;max-width:500px;aspect-ratio:4/5;border-radius:28px;overflow:hidden;position:relative;box-shadow:0 50px 90px -50px rgba(21,23,26,.55),0 0 0 1px rgba(21,23,26,.06)}
.hero-foto img{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.05);animation:zoom 12s ease-out forwards}
.hero-foto figcaption{position:absolute;left:16px;bottom:16px;padding:8px 14px;border-radius:999px;background:rgba(255,255,255,.92);color:var(--tinta);font:700 13px var(--texto);display:flex;gap:8px;align-items:center}
.hero-foto figcaption::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--ok)}
@media (max-width:980px){.portada.confotoH .env{padding-block:110px 48px}.hero-foto{justify-self:stretch;max-width:none;aspect-ratio:4/3.4;border-radius:22px}}
#proyectos{background:var(--papel);border-block:1px solid var(--linea)}
.obras{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
@media (max-width:900px){.obras{grid-template-columns:minmax(0,1fr);gap:36px}}
.obra{margin:0;min-width:0}
.obra .im{border-radius:22px;overflow:hidden;aspect-ratio:4/5;background:var(--suave)}
@media (max-width:900px){.obra .im{aspect-ratio:4/3}}
.obra img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.obra:hover img{transform:scale(1.04)}
.obra figcaption{padding:20px 2px 0;display:grid;gap:4px}
.obra .lug{font:700 12.5px var(--texto);letter-spacing:.14em;text-transform:uppercase;color:var(--laton)}
.obra h3{font-size:23px;font-weight:700}
.obra p{margin:0;color:var(--gris);font-size:15.5px}
/* servicios: 2 con foto + 3 compactos */
.serv.g{min-height:420px}
.minis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin-top:18px;border-top:1px solid var(--linea)}
@media (max-width:900px){.minis{grid-template-columns:minmax(0,1fr)}}
.mini{display:flex;gap:18px;align-items:flex-start;padding:28px 28px 28px 0;text-decoration:none;color:var(--tinta);border-right:1px solid var(--linea);min-width:0;transition:background .2s}
.mini:last-child{border-right:0}.mini+.mini{padding-left:28px}
@media (max-width:900px){.mini,.mini+.mini{border-right:0;border-bottom:1px solid var(--linea);padding:22px 0}}
.mini svg{width:64px;height:38px;flex:none;margin-top:4px;fill:none;stroke:var(--laton);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.mini h3{font-size:20px;font-weight:700;margin-bottom:4px}.mini p{margin:0;color:var(--gris);font-size:15.5px}
.mini:hover h3{color:var(--laton)}
/* legal */
#abrirLegal{text-decoration:underline;text-underline-offset:3px}
.legalD{border:0;padding:0;border-radius:22px;max-width:min(92vw,680px);width:100%;background:#fff;color:var(--tinta);box-shadow:0 40px 100px -30px rgba(21,23,26,.55)}
.legalD::backdrop{background:rgba(21,23,26,.5);backdrop-filter:blur(3px)}
.legalC{padding:34px clamp(22px,4vw,40px);max-height:82vh;overflow:auto;position:relative}
.legalC h2{font-size:28px;margin-bottom:6px}.legalC h3{font:700 13px var(--texto);letter-spacing:.12em;text-transform:uppercase;color:var(--laton);margin:22px 0 6px}
.legalC p{margin:0;color:#41464d;font-size:15.5px}
.cerrarL{position:absolute;top:14px;right:14px;width:40px;height:40px;border-radius:50%;border:1px solid var(--linea);background:#fff;font:400 24px/1 var(--texto);cursor:pointer}
nav a.act{color:var(--tinta)!important}nav a.act::after{transform:scaleX(1)!important}
/* antes y después destacado */
.proy{display:block}
.proy .fest{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(28px,5vw,72px);align-items:center;margin:0 0 64px}
@media (max-width:900px){.proy .fest{grid-template-columns:minmax(0,1fr);gap:24px;margin-bottom:48px}}
.fest .ad{aspect-ratio:3/4;max-height:720px;border-radius:26px;box-shadow:0 40px 80px -50px rgba(21,23,26,.55)}
.fest figcaption{padding:0;display:grid;gap:10px;font-weight:400}
.fest .lug{font:700 12.5px var(--texto);letter-spacing:.14em;text-transform:uppercase;color:var(--laton)}
.fest h3{font-size:clamp(30px,3.6vw,46px);line-height:1.05;font-weight:700}
.fest p{margin:0;color:var(--gris);font-size:18px;max-width:42ch}
.fest .pista{margin-top:10px;font:600 14px var(--texto);color:#7b8087}
/* vídeos */
.vids{display:grid;grid-template-columns:repeat(var(--nv,1),minmax(0,1fr));gap:22px}
@media (max-width:800px){.vids{grid-template-columns:minmax(0,1fr)}}
.vid{margin:0;min-width:0}.vid video{width:100%;display:block;border-radius:22px;background:#15171a;max-height:78vh;box-shadow:0 40px 80px -50px rgba(21,23,26,.5)}
.vid figcaption{padding:16px 2px 0;display:grid;gap:3px}.vid h3{font-size:22px}.vid p{margin:0;color:var(--gris);font-size:15.5px}
/* aparición suave */
.rev{opacity:1;transform:none;transition:opacity .7s,transform .7s}
.js .rev.esp{opacity:0;transform:translateY(24px)}
/* ===== páginas interiores ===== */
.subhero{padding:140px 0 56px;background:var(--papel);border-bottom:1px solid var(--linea)}
.subhero h1{font-size:clamp(36px,5.4vw,64px);line-height:1.02;font-weight:800;letter-spacing:-.02em;margin-top:16px;max-width:20ch}
.subhero .lead{font-size:clamp(18px,2vw,21px);color:var(--gris);max-width:58ch;margin:20px 0 0}
.subhero .acc{margin-top:28px}
.migas{display:flex;gap:10px;font-size:14px;color:var(--gris);margin-bottom:22px}.migas a{color:var(--gris)}.migas a:hover{color:var(--tinta)}
.contenido{padding-block:72px}
.dos2{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:56px;align-items:start}
@media (max-width:900px){.dos2{grid-template-columns:minmax(0,1fr);gap:36px}}
.bloque h2{font-size:clamp(24px,3vw,32px);line-height:1.1;font-weight:700;margin-bottom:12px}
.bloque p{color:var(--gris);margin:0 0 28px;max-width:60ch}
.incl.uno{grid-template-columns:minmax(0,1fr)}
.contenido .obras,.contenido .proy{margin-top:56px}
.obras.n1{grid-template-columns:minmax(0,420px)}
.obras.n2{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:800px){.obras,.obras.n2{grid-template-columns:minmax(0,1fr)}}
.faqs{padding-block:24px 72px}
.otros{padding-block:0 72px}
.minis.dosm{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:700px){.minis.dosm{grid-template-columns:minmax(0,1fr)}}
.legalp{max-width:760px}.legalp h2{font-size:24px;margin:34px 0 10px}.legalp p{color:var(--gris);margin:0 0 12px}.legalp a{color:var(--laton)}
