/* ============================================================
   WEIZ DESARROLLOS — ficha técnica de obra
   paleta — base neutra #222222 (decisión de Fede, 28/10/2026)
                       secundarios #d9d4c7 #8e8778 #333333
   ============================================================ */
:root{
  --ink:#222222; --ink-2:#333333; --grey:#b2b2b2;
  --sand:#d9d4c7; --olive:#8e8778;
  --bg:#ffffff; --bg-alt:#f5f5f5; --surface:#ffffff;
  --on-bg:#222222; --on-bg-soft:#5c5c5c; --on-bg-faint:#8a8a8a;
  --rule:#e2e2e2;
  --dark-bg:#222222; --dark-surface:#333333;
  --on-dark:#f0f0f0; --on-dark-soft:#b9b9b9; --on-dark-faint:#8a8a8a;
  --dark-rule:#3f3f3f;
  --f:"Archivo","Helvetica Neue",Arial,system-ui,sans-serif;
  color-scheme:light dark;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#1b1b1b; --bg-alt:#222222; --surface:#222222;
    --on-bg:#f0f0f0; --on-bg-soft:#b9b9b9; --on-bg-faint:#8a8a8a;
    --rule:#3a3a3a; --dark-bg:#151515; --dark-surface:#222222; --dark-rule:#333333;
  }
}
:root[data-theme="dark"]{
  --bg:#1b1b1b; --bg-alt:#222222; --surface:#222222;
  --on-bg:#f0f0f0; --on-bg-soft:#b9b9b9; --on-bg-faint:#8a8a8a;
  --rule:#3a3a3a; --dark-bg:#151515; --dark-surface:#222222; --dark-rule:#333333;
}

*{box-sizing:border-box}
[hidden]{display:none !important}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} }
body{
  margin:0; background:var(--bg); color:var(--on-bg);
  font-family:var(--f); font-size:16px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{display:block; max-width:100%; height:auto}
figure{margin:0}
a{color:inherit}
h1,h2,h3{margin:0; font-weight:500; letter-spacing:-.015em; text-wrap:balance}
p{margin:0}
.num{font-variant-numeric:tabular-nums}
.sr{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
.wrap{width:100%; max-width:1000px; margin-inline:auto; padding-inline:20px}
.rot{font-size:clamp(11px,1.4vw,11.5px); font-weight:500; letter-spacing:.16em;
     text-transform:uppercase; color:var(--on-bg-soft)}
.notch{clip-path:polygon(0 0, 100% 0, 100% 100%, 16% 100%, 16% 90%, 0 90%)}

/* ---------- cabecera ---------- */
.site-head{
  position:sticky; top:env(safe-area-inset-top,0px); z-index:40;
  background:color-mix(in srgb, var(--bg) 92%, transparent);
  backdrop-filter:blur(10px); border-bottom:1px solid var(--rule);
}
.site-head__in{display:flex; align-items:center; gap:16px; min-height:60px; padding-block:10px}
.brand{display:flex; align-items:center; text-decoration:none; flex:0 0 auto}
.brand svg{width:112px; height:auto; color:var(--on-bg)}
.volver{
  margin-left:auto; display:inline-flex; align-items:center; gap:7px; text-decoration:none;
  font-size:12px; font-weight:500; letter-spacing:.1em; text-transform:uppercase;
  color:var(--on-bg-soft); white-space:nowrap;
}
.volver:hover{color:var(--on-bg)}
.volver svg{width:14px; height:14px}
.volver:focus-visible{outline:2px solid var(--olive); outline-offset:3px}

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  font-family:var(--f); font-size:12.5px; font-weight:500;
  letter-spacing:.1em; text-transform:uppercase; text-decoration:none;
  padding:12px 18px; border:1px solid currentColor; background:transparent;
  color:var(--on-bg); cursor:pointer;
}
.btn:hover{background:var(--on-bg); color:var(--bg)}
.btn:focus-visible{outline:2px solid var(--olive); outline-offset:3px}
.btn--solid{background:var(--ink); color:#fff; border-color:var(--ink)}
.btn--solid:hover{background:var(--ink-2); border-color:var(--ink-2); color:#fff}
.btn--onDark{color:var(--on-dark)}
.btn--onDark:hover{background:var(--on-dark); color:var(--ink)}

/* ---------- carrusel ---------- */
.car{position:relative; background:var(--dark-surface); margin-top:clamp(16px,3vw,26px)}
.car__track{position:relative; aspect-ratio:3/2}
.car__slide{position:absolute; inset:0; opacity:0; visibility:hidden; transition:opacity .45s ease}
.car__slide.is-on{opacity:1; visibility:visible}
.car__slide img{width:100%; height:100%; object-fit:cover}
.car__slide--v img{object-fit:contain; background:var(--dark-bg)}
.car__nav{
  position:absolute; top:50%; transform:translateY(-50%);
  width:44px; height:44px; display:grid; place-items:center;
  background:rgba(20,20,20,.55); color:#fff; border:0; cursor:pointer;
  opacity:0; transition:opacity .2s ease, background .2s ease;
}
.car:hover .car__nav, .car:focus-within .car__nav{opacity:1}
.car__nav:hover{background:rgba(20,20,20,.85)}
.car__nav:focus-visible{opacity:1; outline:2px solid var(--sand); outline-offset:-2px}
.car__nav--prev{left:0} .car__nav--next{right:0}
.car__nav svg{width:18px; height:18px}
.car__count{
  position:absolute; right:10px; bottom:10px;
  font-size:11px; font-weight:500; letter-spacing:.08em; color:#fff;
  background:rgba(20,20,20,.6); padding:4px 8px; font-variant-numeric:tabular-nums;
}
.car__ia{
  position:absolute; left:10px; top:10px; z-index:2;
  font-size:10px; font-weight:500; letter-spacing:.12em; text-transform:uppercase;
  color:#fff; background:rgba(20,20,20,.66); padding:5px 9px;
}
@media (hover:none){ .car__nav{opacity:1} }
@media (prefers-reduced-motion:reduce){ .car__slide{transition:none} }

/* ---------- encabezado de la ficha ---------- */
.ficha-head{padding-top:clamp(22px,4vw,36px)}
.ficha-head__meta{display:flex; flex-wrap:wrap; gap:8px 14px; align-items:baseline}
.ficha-head h1{font-size:clamp(23px,4.2vw,38px); line-height:1.07; font-stretch:104%; margin-top:10px}
.ficha-head__loc{
  margin-top:8px; display:flex; flex-wrap:wrap; gap:6px 14px; align-items:center;
  font-size:14.5px; color:var(--on-bg-soft);
}
.ficha-head__loc a{display:inline-flex; align-items:center; gap:6px; color:var(--on-bg); text-decoration:none; font-weight:500}
.ficha-head__loc a svg{color:var(--olive)}
.ficha-head__loc a:hover{text-decoration:underline}
.ficha-head__loc svg{width:14px; height:14px}
.estado{
  display:inline-flex; align-items:center; gap:7px;
  font-size:11.5px; font-weight:500; letter-spacing:.11em; text-transform:uppercase;
  padding:5px 10px; background:var(--rule); color:var(--on-bg-soft);
}
.estado::before{content:""; width:7px; height:7px; border-radius:50%; background:var(--on-bg-faint); display:block}
.estado--disponible{background:var(--sand); color:var(--ink)}
.estado--disponible::before{background:var(--ink)}

.precio{margin-top:clamp(16px,2.6vw,22px); display:grid; gap:3px}
.precio .amount{font-size:clamp(26px,5vw,40px); line-height:1; font-weight:500;
                font-stretch:104%; letter-spacing:-.02em; color:var(--on-bg-soft)}

.resumen{margin-top:clamp(16px,2.6vw,22px); font-size:clamp(15px,2vw,17px);
         color:var(--on-bg-soft); max-width:62ch}

/* ---------- tira de destacados ---------- */
.destacados{
  margin-top:clamp(22px,4vw,34px); padding-block:clamp(18px,3vw,24px);
  border-top:1px solid var(--rule); border-bottom:1px solid var(--rule);
  display:grid; grid-template-columns:repeat(2,1fr); gap:18px 10px;
}
@media (min-width:620px){ .destacados{grid-template-columns:repeat(3,1fr)} }
@media (min-width:900px){ .destacados{grid-template-columns:repeat(6,1fr)} }
.dest{display:grid; gap:2px; text-align:center}
.dest b{font-size:clamp(16px,2.4vw,20px); font-weight:500; font-stretch:103%; letter-spacing:-.01em}
.dest span{font-size:11.5px; color:var(--on-bg-soft); line-height:1.35}

/* ---------- bloques ---------- */
.bloque{padding-top:clamp(30px,5vw,46px)}
.bloque > h2{
  font-size:12px; font-weight:500; letter-spacing:.16em; text-transform:uppercase;
  color:var(--on-bg-soft); padding-bottom:12px; border-bottom:1px solid var(--rule);
}
.dl{margin:0; display:grid; grid-template-columns:1fr}
@media (min-width:720px){ .dl{grid-template-columns:1fr 1fr; column-gap:clamp(28px,4vw,56px)} }
.dl__row{display:flex; justify-content:space-between; gap:18px; padding:11px 0;
         border-bottom:1px solid var(--rule); font-size:14.5px}
.dl__row dt{color:var(--on-bg-soft); margin:0}
.dl__row dd{margin:0; text-align:right; font-weight:500}

table.amb{width:100%; border-collapse:collapse; font-size:14.5px}
table.amb th{
  text-align:left; font-size:11px; font-weight:500; letter-spacing:.13em; text-transform:uppercase;
  color:var(--on-bg-soft); padding:12px 0 10px; border-bottom:1px solid var(--rule);
}
table.amb th:nth-child(2), table.amb td:nth-child(2){text-align:right; white-space:nowrap}
table.amb th:nth-child(3), table.amb td:nth-child(3){text-align:right; white-space:nowrap; color:var(--on-bg-soft)}
table.amb td{padding:11px 0; border-bottom:1px solid var(--rule)}
table.amb td:first-child{font-weight:500}
@media (max-width:560px){
  table.amb th:nth-child(2), table.amb td:nth-child(2){display:none}
}

.chips{display:flex; flex-wrap:wrap; gap:8px; padding-top:16px}
.chip{
  font-size:13px; padding:7px 12px; background:var(--bg-alt);
  border:1px solid var(--rule); color:var(--on-bg-soft);
}

.plano{background:var(--sand); padding:clamp(18px,3vw,34px); margin-top:16px}
.plano img{margin-inline:auto; width:100%; max-width:860px; mix-blend-mode:multiply}
.plano figcaption{margin-top:10px; text-align:center; color:var(--ink-2)}

/* ---------- CTA ---------- */
.cta{
  margin-top:clamp(34px,6vw,60px); padding:clamp(22px,3.4vw,34px);
  background:var(--ink); color:var(--on-dark); display:grid; gap:16px;
}
@media (min-width:800px){ .cta{grid-template-columns:1fr auto; align-items:center; gap:34px} }
.cta h2{color:var(--on-dark); font-size:clamp(19px,2.8vw,25px)}
.cta p{color:var(--on-dark-soft); font-size:15px; margin-top:6px; max-width:54ch}
.cta .rot{color:var(--on-dark-soft)}
.cta__btns{display:flex; flex-wrap:wrap; gap:10px}

.nota{
  margin-top:clamp(26px,4vw,40px); padding-top:18px; border-top:1px solid var(--rule);
  font-size:12.5px; color:var(--on-bg-soft); line-height:1.6; max-width:78ch;
}

/* ---------- pie ---------- */
.site-foot{background:var(--dark-bg); color:var(--on-dark-soft);
           border-top:1px solid var(--dark-rule); margin-top:clamp(40px,7vw,80px)}
.site-foot__in{padding-block:30px calc(30px + env(safe-area-inset-bottom,0px));
               display:grid; gap:18px}
@media (min-width:700px){ .site-foot__in{grid-template-columns:1fr auto; align-items:end} }
.site-foot svg{width:130px; height:auto; color:var(--on-dark)}
.site-foot a{color:var(--on-dark-soft); text-decoration:none;
             font-size:12px; letter-spacing:.1em; text-transform:uppercase}
.site-foot a:hover{color:var(--on-dark)}

/* ---------- burbuja de WhatsApp ---------- */
.wa-float{
  position:fixed; z-index:60; right:16px; bottom:calc(72px + env(safe-area-inset-bottom,0px));
  display:flex; align-items:center; gap:10px;
  background:var(--ink); color:#fff; text-decoration:none;
  padding:12px 17px 12px 14px; box-shadow:0 6px 28px rgba(20,20,20,.34);
}
.wa-float:hover{background:var(--ink-2)}
.wa-float:focus-visible{outline:2px solid var(--sand); outline-offset:3px}
.wa-float span{font-size:13px; font-weight:500}
.wa-float svg{width:20px; height:20px; flex:0 0 auto}
@media (max-width:520px){ .wa-float span{display:none} .wa-float{padding:14px} }