@font-face{font-family:"Host Grotesk";src:url(fonts/host-grotesk-latin-400-normal.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Host Grotesk";src:url(fonts/host-grotesk-latin-400-italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Host Grotesk";src:url(fonts/host-grotesk-latin-500-normal.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Host Grotesk";src:url(fonts/host-grotesk-latin-600-normal.woff2) format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Martian Mono";src:url(fonts/martian-mono-latin-400-normal.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Martian Mono";src:url(fonts/martian-mono-latin-500-normal.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}
/* Concepto: "tasar es medir". La página es una lámina de agrimensura: papel, tinta, cianotipia y cotas en rojo. */
:root{
  --paper:#ECEBE6; --paper-2:#E3E2DB; --sheet:#F4F3EF; --ink:#15171C; --ink-2:#4B4F58; --ink-3:#7C7F87;
  --rule:#CDCCC4; --blue:#1F44A3; --blue-soft:#1F44A31F; --red:#C23A2B;
  --f-sans:"Host Grotesk",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-mono:"Martian Mono",ui-monospace,"SFMono-Regular",Consolas,monospace;
  --gut:clamp(18px,3.4vw,52px);
  --ease:cubic-bezier(.2,.7,.1,1);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--f-sans);font-size:17px;line-height:1.5;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
::selection{background:var(--blue);color:var(--paper)}
a{color:inherit}
button,input,select{font:inherit;color:inherit}
img,svg,canvas{display:block;max-width:100%}
.mono{font-family:var(--f-mono);font-size:.7rem;letter-spacing:.02em;text-transform:uppercase;font-weight:400}
.wrap{padding-inline:var(--gut);max-width:1480px;margin:0 auto}
:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* ---------- Header ---------- */
.top{position:fixed;inset:0 0 auto;z-index:40;padding-top:env(safe-area-inset-top,0px);transition:background .4s var(--ease),border-color .4s}
.top.solid{background:color-mix(in srgb,var(--paper) 97%,transparent);backdrop-filter:blur(6px);border-bottom:1px solid var(--rule)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;height:64px;gap:24px}
.logo{display:flex;align-items:baseline;gap:10px;text-decoration:none}
.logo b{font-weight:600;font-size:1.3rem;letter-spacing:-.03em;position:relative}
.logo b::after{content:"";position:absolute;left:0;right:0;bottom:-5px;height:7px;background:
  linear-gradient(var(--red),var(--red)) left center/1px 7px no-repeat,
  linear-gradient(var(--red),var(--red)) right center/1px 7px no-repeat,
  linear-gradient(var(--red),var(--red)) center/100% 1px no-repeat}
.logo span{color:var(--ink-3)}
.nav{display:flex;gap:28px;align-items:center}
.nav a{text-decoration:none;font-size:.92rem;color:var(--ink-2)}
.nav a:hover{color:var(--ink)}
.nav a.btn,.nav a.btn:hover{color:var(--paper)}
.btn{display:inline-flex;align-items:center;gap:12px;border:0;cursor:pointer;text-decoration:none;font-weight:500;font-size:.95rem;padding:13px 18px 13px 20px;background:var(--ink);color:var(--paper);border-radius:2px;transition:background .25s}
.btn:hover{background:var(--blue)}
.btn .ar{display:inline-block;width:18px;height:1px;background:currentColor;position:relative;transition:width .3s var(--ease)}
.btn .ar::after{content:"";position:absolute;right:0;top:-3px;width:7px;height:7px;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:rotate(45deg)}
.btn:hover .ar{width:26px}
.btn.ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.btn.ghost:hover{background:var(--ink);color:var(--paper)}
@media (max-width:860px){.nav a:not(.btn){display:none}}
@media (max-width:560px){.logo span{display:none}.top .btn{padding:10px 14px;font-size:.88rem}.top .btn .ar{display:none}}

/* ---------- Hero / carta ---------- */
.hero{position:relative;min-height:clamp(620px,90svh,900px);display:flex;align-items:flex-end;overflow:hidden;border-bottom:1px solid var(--rule)}
#carta{position:absolute;inset:0;width:100%;height:100%}
.hud{position:absolute;inset:80px var(--gut) auto auto;display:grid;gap:4px;text-align:right;color:var(--ink-2);pointer-events:none}
.hud .k{color:var(--ink-3)}
.cross{position:absolute;pointer-events:none;inset:0;opacity:0;transition:opacity .3s}
.cross i{position:absolute;background:var(--ink);opacity:.25}
.cross .h{left:0;right:0;height:1px}
.cross .v{top:0;bottom:0;width:1px}
.cross .lbl{position:absolute;background:var(--ink);color:var(--paper);padding:5px 7px;white-space:nowrap;transform:translate(12px,12px)}
.hero-copy{position:relative;z-index:2;width:100%;padding-block:0 clamp(36px,6vw,72px)}
.hero h1{font-weight:500;font-size:clamp(2.6rem,7.2vw,6.4rem);line-height:.95;letter-spacing:-.045em;margin:0;max-width:11.5ch;text-wrap:balance}
.hero h1 .ln{display:block;overflow:hidden;padding-bottom:.06em}
.hero h1 .ln>span{display:block}
.hero h1 em{font-style:italic;font-weight:400;color:var(--blue)}
.hero-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:32px;align-items:end;margin-top:clamp(24px,3vw,40px)}
.hero p.lead{margin:0;max-width:38ch;color:var(--ink-2);font-size:1.08rem}
.quick{display:flex;align-items:stretch;background:var(--sheet);box-shadow:0 0 0 1px var(--ink)}
.quick label{display:flex;flex-direction:column;padding:10px 16px 10px;gap:2px;border-right:1px solid var(--rule)}
.quick label .mono{color:var(--ink-3)}
.quick select,.quick input{border:0;background:transparent;padding:2px 0;font-size:1rem;font-weight:500;outline:none;min-width:0}
.quick select{min-width:150px}
.quick input{width:86px}
.quick .btn{border-radius:0}
@media (max-width:900px){.hero-copy::before{content:"";position:absolute;inset:-90px 0 0;background:linear-gradient(to top,var(--paper) 62%,color-mix(in srgb,var(--paper) 0%,transparent));z-index:-1}.hero-row{grid-template-columns:1fr}.quick{flex-wrap:wrap}.quick label{flex:1 1 40%}.quick .btn{flex:1 1 100%;justify-content:center}.hud{display:none}}

/* ---------- Secciones ---------- */
section{position:relative}
.sec-head{display:grid;grid-template-columns:minmax(160px,1fr) 3fr;gap:24px;padding-block:clamp(72px,10vw,140px) clamp(32px,4vw,56px)}
.sec-head .mono{color:var(--ink-3);padding-top:.7em}
.sec-head h2{margin:0;font-weight:500;font-size:clamp(2rem,4.4vw,3.7rem);line-height:1;letter-spacing:-.04em;max-width:16ch;text-wrap:balance}
.sec-head p{margin:18px 0 0;max-width:52ch;color:var(--ink-2)}
@media (max-width:760px){.sec-head{grid-template-columns:1fr;gap:10px}}

/* ---------- Tasador ---------- */
.tasador{background:var(--paper)}
.tz{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);grid-template-areas:'form lam' 'lead lam';gap:0 clamp(24px,4vw,64px);padding-bottom:clamp(80px,10vw,140px);align-items:start}
.tz>.form{grid-area:form}.tz>.lamina{grid-area:lam}.tz>.pedido{grid-area:lead}
@media (max-width:980px){.tz{grid-template-columns:1fr;grid-template-areas:'form' 'lam' 'lead';row-gap:28px}}
.form{display:flex;flex-direction:column}
.q{display:grid;grid-template-columns:32px 1fr;gap:6px 14px;padding:22px 0;border-top:1px solid var(--rule)}

.q .n{color:var(--ink-3);padding-top:4px}
.q .t{font-weight:500;font-size:1.02rem}
.q .ctl{grid-column:2}
.seg{display:flex;flex-wrap:wrap;gap:0;margin-top:8px}
.seg button{border:1px solid var(--ink);background:transparent;padding:9px 14px;margin:0 -1px -1px 0;cursor:pointer;font-size:.92rem;transition:background .2s,color .2s}
.seg button[aria-pressed="true"]{background:var(--ink);color:var(--paper)}
.seg button:hover:not([aria-pressed="true"]){background:var(--paper-2)}
.fld{display:flex;align-items:baseline;gap:10px;margin-top:6px;border-bottom:1px solid var(--ink);max-width:260px}
.fld input,.fld select{border:0;background:transparent;font-size:1.6rem;font-weight:500;letter-spacing:-.02em;padding:4px 0;width:100%;outline:none;-moz-appearance:textfield}
.fld input::-webkit-outer-spin-button,.fld input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.fld .u{color:var(--ink-3)}
.fld.wide{max-width:380px}
.fld select{font-size:1.35rem;cursor:pointer}
.check{display:flex;gap:10px;align-items:center;cursor:pointer;margin-top:8px;font-size:.95rem}
.check input{width:18px;height:18px;accent-color:var(--ink)}

@media (max-width:980px){.lamina{position:relative!important;top:auto!important}}
.lamina{position:sticky;top:84px;background:var(--sheet);box-shadow:0 0 0 1px var(--ink);display:flex;flex-direction:column}
.lamina .bar{display:flex;justify-content:space-between;padding:10px 14px;border-bottom:1px solid var(--ink);color:var(--ink-2)}
.planbox{position:relative;background:
  linear-gradient(var(--blue-soft) 1px,transparent 1px) 0 0/20px 20px,
  linear-gradient(90deg,var(--blue-soft) 1px,transparent 1px) 0 0/20px 20px;
  height:clamp(250px,calc(100svh - 330px),520px)}
@media (max-width:980px){.planbox{height:auto;aspect-ratio:560/430}}
#plan{width:100%;height:100%}
#plan .w{fill:none;stroke:var(--ink);stroke-linecap:square}
#plan .w.ext{stroke-width:5}
#plan .w.int{stroke-width:2.2}
#plan .door{fill:none;stroke:var(--ink);stroke-width:1}
#plan .door.sw{stroke-dasharray:2 3}
#plan .cota{stroke:var(--red);stroke-width:1;fill:none}
#plan .cota-t{fill:var(--red);font-family:var(--f-mono);font-size:10px}
#plan .rl{fill:var(--ink);font-family:var(--f-sans);font-size:12px;font-weight:500}
#plan .ra{fill:var(--ink-3);font-family:var(--f-mono);font-size:9px}
#plan .bal{fill:none;stroke:var(--ink);stroke-width:1.2;stroke-dasharray:4 3}
#plan .sea{fill:none;stroke:var(--blue);stroke-width:1}
#plan .sea-t{fill:var(--blue);font-family:var(--f-mono);font-size:9px;letter-spacing:.2em}
#plan .north{fill:none;stroke:var(--ink);stroke-width:1}
#plan .draw{stroke-dasharray:1;stroke-dashoffset:1;animation:draw .9s var(--ease) forwards;animation-delay:calc(var(--i,0)*45ms)}
#plan .fade{opacity:0;animation:fade .5s ease forwards;animation-delay:calc(300ms + var(--i,0)*40ms)}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes fade{to{opacity:1}}
.rotulo{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--ink)}
.rotulo div{padding:8px 12px;border-right:1px solid var(--rule);display:flex;flex-direction:column;gap:3px;min-width:0}
.rotulo div:last-child{border-right:0}
.rotulo .mono{color:var(--ink-3);font-size:.6rem}
.rotulo b{font-weight:500;font-size:.92rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width:560px){.rotulo{grid-template-columns:repeat(2,minmax(0,1fr))}.rotulo div:nth-child(2){border-right:0}.rotulo div:nth-child(-n+2){border-bottom:1px solid var(--rule)}}

.valor{border-top:1px solid var(--ink);padding:18px 14px 16px;display:flex;flex-direction:column;gap:12px;background:var(--ink);color:var(--paper)}
.valor .mono{color:color-mix(in srgb,var(--paper) 60%,transparent)}
.flap{display:flex;gap:3px;flex-wrap:nowrap}
.flap .c{position:relative;width:clamp(22px,3.3vw,40px);height:clamp(34px,5vw,58px);background:#23262D;border-radius:3px;display:flex;align-items:center;justify-content:center;font-family:var(--f-mono);font-weight:500;font-size:clamp(1rem,2.6vw,1.75rem);color:#F4F3EF;overflow:hidden;perspective:200px}
.flap .c::after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:#0D0F12}
.flap .c.sp{background:transparent;width:clamp(8px,1.2vw,14px)}
.flap .c.sp::after{display:none}
.flap .c span{display:block;transform-origin:50% 50%}
.flap .c.tick span{animation:flapk 70ms linear}
@keyframes flapk{0%{transform:rotateX(0)}50%{transform:rotateX(-80deg);opacity:.4}100%{transform:rotateX(0)}}
.valor .det{display:flex;flex-wrap:wrap;gap:6px 22px;font-size:.92rem;color:color-mix(in srgb,var(--paper) 82%,transparent)}
.valor .det b{color:var(--paper);font-weight:500}

.pedido{padding:26px 0 0;margin-top:34px;border-top:1px solid var(--ink);display:flex;flex-direction:column;gap:14px}
@media (max-width:980px){.pedido{margin-top:0}}
.pedido h3{margin:0;font-weight:500;font-size:clamp(1.4rem,2.2vw,1.8rem);letter-spacing:-.03em;line-height:1.1}
.pedido .row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:560px){.pedido .row2{grid-template-columns:1fr}}
.pedido label{display:flex;flex-direction:column;gap:4px}
.pedido label .mono{color:var(--ink-3);font-size:.6rem}
.pedido input{border:0;border-bottom:1px solid var(--ink);background:transparent;padding:6px 0;font-size:1.05rem;outline:none;border-radius:0}
.pedido .seg{margin-top:0}
.pedido .seg button{font-size:.85rem;padding:7px 11px}
.pedido small{color:var(--ink-3);font-size:.8rem}
.err{color:var(--red);font-size:.85rem;min-height:1.2em}

/* ---------- Proceso / regla ---------- */
.proc{border-top:1px solid var(--rule);padding-bottom:clamp(80px,10vw,140px)}
.ruler{position:relative;padding-top:56px}
.ruler .base{position:absolute;left:0;right:0;top:20px;height:12px;background:
  repeating-linear-gradient(90deg,var(--ink) 0 1px,transparent 1px 10px) bottom/100% 6px no-repeat,
  repeating-linear-gradient(90deg,var(--ink) 0 1px,transparent 1px 50px) bottom/100% 12px no-repeat;opacity:.55}
.ruler .base::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--ink)}
.ruler .prog{position:absolute;left:0;top:13px;height:1px;width:100%;background:var(--red);transform-origin:0 50%;transform:scaleX(0)}
.ruler .prog::before,.ruler .prog::after{content:"";position:absolute;top:-4px;width:1px;height:9px;background:var(--red)}
.ruler .prog::before{left:0}.ruler .prog::after{right:0}
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}
.step{padding:0 24px 0 0;position:relative}
.step::before{content:"";position:absolute;left:0;top:-36px;width:1px;height:28px;background:var(--ink)}
.step .mono{color:var(--red);display:block;margin-bottom:14px}
.step h3{margin:0 0 10px;font-weight:500;font-size:1.3rem;letter-spacing:-.025em;line-height:1.15}
.step p{margin:0;color:var(--ink-2);font-size:.97rem;max-width:30ch}
@media (max-width:860px){.steps{grid-template-columns:1fr 1fr;row-gap:48px}.ruler .base,.ruler .prog{display:none}.step::before{display:none}.ruler{padding-top:0}}
@media (max-width:520px){.steps{grid-template-columns:1fr}}

/* ---------- Barrios ---------- */
.barrios{background:var(--paper-2);border-top:1px solid var(--rule)}
.tabla{padding-bottom:clamp(80px,10vw,140px)}
.fila{display:grid;grid-template-columns:minmax(140px,1.3fr) minmax(0,3fr) 120px;gap:20px;align-items:center;padding:13px 0;border-top:1px solid var(--rule);cursor:default}
.fila:last-child{border-bottom:1px solid var(--rule)}
.fila .nm{font-weight:500;font-size:1.05rem;letter-spacing:-.01em}
.fila .bar{height:9px;position:relative}
.fila .bar i{position:absolute;inset:0 auto 0 0;background:var(--ink);transform-origin:0 50%;transition:background .25s}
.fila .bar::after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:var(--rule);z-index:-1}
.fila .v{text-align:right;font-family:var(--f-mono);font-size:.82rem}
.fila:hover .bar i{background:var(--blue)}
.tabla .nota{margin-top:20px;color:var(--ink-3);font-size:.85rem;max-width:70ch}
@media (max-width:640px){.fila{grid-template-columns:1fr 92px}.fila .bar{grid-column:1 / -1;order:3}}

/* ---------- Argumento ---------- */
.arg{border-top:1px solid var(--rule)}
.arg-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px;padding-bottom:clamp(80px,10vw,140px)}
.arg blockquote{grid-column:1 / span 7;margin:0;font-size:clamp(1.5rem,2.9vw,2.4rem);line-height:1.12;letter-spacing:-.03em;font-weight:400;text-wrap:balance}
.arg blockquote em{font-style:italic;color:var(--blue)}
.arg .cols{grid-column:8 / span 5;display:flex;flex-direction:column;gap:26px;padding-top:8px}
.arg .cols div{border-top:1px solid var(--ink);padding-top:12px}
.arg .cols h3{margin:0 0 6px;font-weight:500;font-size:1.05rem}
.arg .cols p{margin:0;color:var(--ink-2);font-size:.97rem}
@media (max-width:900px){.arg blockquote,.arg .cols{grid-column:1 / -1}}

/* ---------- FAQ ---------- */
.faq{border-top:1px solid var(--rule)}
.faq-list{padding-bottom:clamp(80px,10vw,140px);display:grid;grid-template-columns:minmax(160px,1fr) 3fr;gap:24px}
.faq-list>div{grid-column:2}
@media (max-width:760px){.faq-list{grid-template-columns:1fr}.faq-list>div{grid-column:1}}
details{border-top:1px solid var(--rule)}
details:last-child{border-bottom:1px solid var(--rule)}
summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:20px;padding:20px 0;font-size:1.12rem;font-weight:500;letter-spacing:-.015em}
summary::-webkit-details-marker{display:none}
summary .pm{position:relative;width:14px;height:14px;flex:none;margin-top:6px}
summary .pm::before,summary .pm::after{content:"";position:absolute;background:var(--ink);transition:transform .3s var(--ease)}
summary .pm::before{left:0;right:0;top:6.5px;height:1px}
summary .pm::after{top:0;bottom:0;left:6.5px;width:1px}
details[open] summary .pm::after{transform:scaleY(0)}
details p{margin:0 0 22px;color:var(--ink-2);max-width:62ch}

/* ---------- Cierre ---------- */
.fin{background:var(--ink);color:var(--paper);overflow:hidden}
.fin .wrap{padding-block:clamp(80px,11vw,150px) 28px}
.fin h2{margin:0;font-weight:500;font-size:clamp(2.4rem,7vw,6.2rem);line-height:.95;letter-spacing:-.045em;max-width:13ch}
.fin h2 em{font-style:italic;font-weight:400;color:#8FA6E6}
.fin .btn{background:var(--paper);color:var(--ink);margin-top:36px}
.fin .btn:hover{background:#8FA6E6}
.marca{margin-top:clamp(70px,9vw,120px);position:relative}
.marca b{display:block;font-weight:600;font-size:clamp(5rem,24vw,22rem);letter-spacing:-.07em;line-height:.8;color:var(--paper)}
.marca .dim{display:flex;align-items:center;gap:12px;margin-top:22px;color:color-mix(in srgb,var(--paper) 55%,transparent)}
.marca .dim i{flex:1;height:1px;background:var(--red);position:relative}
.marca .dim i::before,.marca .dim i::after{content:"";position:absolute;top:-5px;width:1px;height:11px;background:var(--red)}
.marca .dim i::before{left:0}.marca .dim i::after{right:0}
.foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;margin-top:40px;padding-top:18px;border-top:1px solid #2C3038;color:color-mix(in srgb,var(--paper) 55%,transparent);font-size:.85rem}
.foot a{text-decoration:none}
.foot a:hover{color:var(--paper)}

.rv{opacity:0;transform:translateY(18px);transition:opacity .9s var(--ease),transform .9s var(--ease);transition-delay:var(--d,0s)}
.rv.in{opacity:1;transform:none}
.no-js .rv,.reduced .rv{opacity:1;transform:none}
.fila .bar i{transform:scaleX(0);transition:transform 1.2s var(--ease) calc(var(--d,0s) + .15s)}
.fila.in .bar i,.no-js .fila .bar i,.reduced .fila .bar i{transform:scaleX(1)}
.hero h1 .ln>span{animation:rise 1.1s cubic-bezier(.16,1,.3,1) both}
.hero h1 .ln:nth-child(2)>span{animation-delay:.09s}.hero h1 .ln:nth-child(3)>span{animation-delay:.18s}
.hero-row>*{animation:up .9s var(--ease) .5s both}.hero-row>*+*{animation-delay:.6s}
@keyframes rise{from{transform:translateY(105%)}}
@keyframes up{from{opacity:0;transform:translateY(16px)}}
@media (prefers-reduced-motion:reduce){.hero h1 .ln>span,.hero-row>*{animation:none}}
@media (prefers-reduced-motion:reduce){#plan .draw{animation:none;stroke-dashoffset:0}#plan .fade{animation:none;opacity:1}.flap .c.tick span{animation:none}}

/* utilidades que reemplazan estilos en línea (CSP sin unsafe-inline) */
.sub{color:var(--ink-3)}
.fld.w150{width:150px}
.duo{display:flex;gap:28px;flex-wrap:wrap}
.mt8{margin-top:8px}
.step-red{color:var(--red)}
.mini{color:var(--ink-3);font-size:.6rem}
.pedido .acts{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.pedido .seg.mt6{margin-top:6px}
.steps{list-style:none;margin:0;padding:0}
#plan .rl.sm{font-size:10px}
.marca b{font-size:clamp(4.6rem,23vw,21rem)!important;letter-spacing:-.065em!important;line-height:1.02!important}
.contacto a{text-decoration:none}
.contacto a:hover{color:var(--paper)}
#plan .gap{stroke:var(--sheet);stroke-width:4}
.nf{min-height:100svh;display:flex;flex-direction:column;justify-content:center;gap:22px}
.nf .mono{color:var(--red)}
.nf h1{margin:0;font-weight:500;font-size:clamp(2.4rem,6vw,5rem);line-height:.95;letter-spacing:-.045em;max-width:12ch}
.nf .btn{align-self:flex-start}
[hidden]{display:none!important}
.hero h1{max-width:13.5ch}
#plan .patio{fill:none;stroke:var(--ink);stroke-width:1.2;stroke-dasharray:4 3}
#plan .verde{fill:none;stroke:var(--ink-3);stroke-width:.9}
#plan .lote{fill:none;stroke:var(--ink);stroke-width:2.2;stroke-dasharray:10 5}
#plan .lm{fill:none;stroke:var(--blue);stroke-width:1.4}