/* ZUMA Desarrollos · sitio 2026 */
:root{
  --bg:#F1F1EE; --surface:#FFFFFF; --ink:#16181A; --muted:#5C605D; --line:#D8D9D3;
  --accent:#5E4487; --accent-soft:#ECE6F4; --wa:#16794A; --wa-ink:#FFFFFF;
  --display:"Josefin Sans","Futura","Century Gothic",system-ui,sans-serif;
  --body:"Figtree","Segoe UI",system-ui,-apple-system,sans-serif;
  --gutter-l:max(16px, env(safe-area-inset-left, 0px));
  --gutter-r:max(16px, env(safe-area-inset-right, 0px));
  color-scheme:light;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#111213; --surface:#1A1C1E; --ink:#ECECE8; --muted:#A3A6A1; --line:#2F3234;
  --accent:#B7A0DB; --accent-soft:#2A2337; --wa:#2BA866; --wa-ink:#06140C; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#111213; --surface:#1A1C1E; --ink:#ECECE8; --muted:#A3A6A1; --line:#2F3234;
  --accent:#B7A0DB; --accent-soft:#2A2337; --wa:#2BA866; --wa-ink:#06140C; color-scheme:dark}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.55;overflow-x:hidden}
a{color:inherit}
img{max-width:100%;display:block}
.wrap{max-width:1180px;margin:0 auto;padding-left:var(--gutter-l);padding-right:var(--gutter-r)}
h1,h2,h3{font-family:var(--display);font-weight:300;text-wrap:balance;margin:0;letter-spacing:.02em}
h1{font-size:clamp(2rem,4.4vw,3.4rem);line-height:1.05;text-transform:uppercase}
h2{font-size:clamp(1.6rem,3.4vw,2.6rem);line-height:1.1;text-transform:uppercase}
h3{font-size:1.25rem;font-weight:400;line-height:1.2}
.eyebrow{font-family:var(--display);font-weight:600;font-size:.78rem;letter-spacing:.22em;text-transform:uppercase;color:var(--accent)}
.lead{font-size:1.12rem;color:var(--muted);max-width:60ch;margin:0}
section{padding-block:clamp(48px,8vw,96px)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

/* header */
header.site{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--surface) 94%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
header.site .wrap{display:flex;align-items:center;gap:24px;padding-block:10px}
.logo{height:38px;width:auto}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .logo{filter:invert(1)}}
:root[data-theme="dark"] .logo{filter:invert(1)}
nav.main{display:flex;gap:22px;margin-left:auto;font-size:.95rem}
nav.main a{text-decoration:none;color:var(--muted)}
nav.main a:hover{color:var(--ink)}
.btn{display:inline-flex;align-items:center;gap:8px;font:600 .95rem var(--body);text-decoration:none;border-radius:6px;padding:11px 18px;border:1px solid transparent;cursor:pointer;white-space:nowrap}
.btn-wa{background:var(--wa);color:var(--wa-ink)}
.btn-ghost{border-color:var(--line);color:var(--ink);background:var(--surface)}
.btn-accent{background:var(--accent);color:var(--surface)}
.wa-ico{width:18px;height:18px;flex:none}
@media (max-width:860px){nav.main{display:none} header.site .btn-wa{margin-left:auto;padding:9px 12px}}

/* hero */
.hero{padding-block:clamp(32px,6vw,72px) 0}
.hero-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(24px,4vw,56px);align-items:end}
.hero-copy{display:grid;gap:22px;min-width:0;padding-bottom:clamp(8px,3vw,40px)}
.hero-photo{position:relative;aspect-ratio:4/3.3;max-width:100%;overflow:hidden;border-radius:2px;margin:0}
.hero-photo img{width:100%;height:100%;object-fit:cover}
.hero-photo figcaption{position:absolute;left:0;bottom:0;background:var(--surface);color:var(--ink);font-size:.8rem;padding:6px 12px}
.facts{display:flex;flex-wrap:wrap;gap:8px 28px;font-size:.92rem;color:var(--muted)}
.facts b{font-family:var(--display);font-weight:600;font-size:1.5rem;color:var(--ink);display:block;line-height:1.1;font-variant-numeric:tabular-nums}
@media (max-width:860px){.hero-grid{grid-template-columns:1fr}}

/* three doors */
.doors{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:clamp(32px,5vw,64px)}
.door{display:grid;gap:8px;align-content:start;padding:28px 24px;text-decoration:none;border-left:1px solid var(--line);transition:background .2s}
.door:first-child{border-left:0}
.door:hover{background:var(--surface)}
.door .eyebrow{color:var(--muted)}
.door h3{font-size:1.45rem;text-transform:uppercase;letter-spacing:.04em;font-weight:300}
.door p{margin:0;color:var(--muted);font-size:.95rem}
.door .go{font-weight:600;color:var(--accent);font-size:.92rem}
@media (max-width:760px){.doors{grid-template-columns:1fr}.door{border-left:0;border-top:1px solid var(--line)}.door:first-child{border-top:0}}

/* availability */
.sec-head{display:flex;gap:24px;align-items:end;justify-content:space-between;flex-wrap:wrap;margin-bottom:32px}
.sec-head > div:first-child{display:grid;gap:12px;min-width:0}
.filters{display:flex;gap:6px;flex-wrap:wrap}
.chip{font:500 .88rem var(--body);border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:999px;padding:6px 14px;cursor:pointer}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px}
.card{background:var(--surface);border:1px solid var(--line);display:grid;grid-template-rows:auto 1fr;min-width:0}
.card .ph{aspect-ratio:16/10;max-width:100%;overflow:hidden;background:var(--accent-soft);position:relative;display:block}
.card .ph img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.card .ph:hover img{transform:scale(1.03)}
.card .tag{position:absolute;top:10px;left:10px;background:var(--surface);color:var(--ink);font:600 .72rem var(--body);letter-spacing:.12em;text-transform:uppercase;padding:4px 8px}
.card .bd{display:grid;gap:10px;padding:18px 18px 20px;align-content:start}
.card h3 a{text-decoration:none}
.card .where{font-size:.85rem;color:var(--muted)}
.card dl{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;margin:0;font-size:.92rem}
.card dt{color:var(--muted)}
.card dd{margin:0;font-variant-numeric:tabular-nums}
.card .acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:4px}
.card .btn{padding:8px 14px;font-size:.88rem}
.fine{font-size:.85rem;color:var(--muted);margin-top:20px}

/* colony */
.colony{background:var(--surface);border-block:1px solid var(--line)}
.colony-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:clamp(24px,4vw,56px);align-items:start}
.colony-copy{display:grid;gap:20px;min-width:0}
.mosaic{display:grid;grid-template-columns:1.4fr 1fr;grid-template-rows:1fr 1fr;gap:10px;aspect-ratio:5/4;max-width:100%}
.mosaic img{width:100%;height:100%;object-fit:cover}
.mosaic img:first-child{grid-row:span 2}
.two{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.two > div{border-top:1px solid var(--line);padding-top:14px;display:grid;gap:6px;min-width:0;align-content:start}
.two p{margin:0;font-size:.93rem;color:var(--muted)}
.two a.more{font-weight:600;color:var(--accent);font-size:.9rem;text-decoration:none}
ul.ticks{list-style:none;margin:0;padding:0;display:grid;gap:6px;font-size:.95rem}
ul.ticks li{padding-left:22px;position:relative}
ul.ticks li::before{content:"";position:absolute;left:2px;top:.55em;width:9px;height:9px;border-right:1.5px solid var(--accent);border-bottom:1.5px solid var(--accent);transform:rotate(-45deg) translateY(-3px)}
@media (max-width:860px){.colony-grid{grid-template-columns:1fr}}
@media (max-width:480px){.two{grid-template-columns:1fr}}

/* hotel band */
.hotel-band{display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(20px,4vw,48px);align-items:center}
.hotel-band img{width:100%;aspect-ratio:16/10;object-fit:cover}
.hotel-band > div{display:grid;gap:16px;min-width:0}
@media (max-width:860px){.hotel-band{grid-template-columns:1fr}}

/* brands */
.brands{display:flex;flex-wrap:wrap;gap:10px 28px;font-family:var(--display);font-size:1.15rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}

/* plazas */
.plazas{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.plaza{background:var(--bg);padding:16px;display:grid;gap:4px;align-content:start;min-width:0;text-decoration:none}
a.plaza:hover{background:var(--surface)}
.plaza .st{font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.plaza b{font-weight:600}
.plaza span{font-size:.88rem;color:var(--muted)}
.plaza .av{color:var(--accent);font-weight:600;font-size:.82rem}
.strip{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin-bottom:28px}
.strip a{display:grid;gap:6px;min-width:0;text-decoration:none}
.strip img{aspect-ratio:4/3;width:100%;object-fit:cover}
.strip span{font-size:.8rem;color:var(--muted)}
@media (max-width:860px){.strip{grid-template-columns:repeat(3,1fr)}}
@media (max-width:480px){.strip{grid-template-columns:repeat(2,1fr)}}

/* steps */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;counter-reset:s}
.step{display:grid;gap:8px;border-top:2px solid var(--ink);padding-top:16px;min-width:0}
.step::before{counter-increment:s;content:"Paso " counter(s);font:600 .78rem var(--display);letter-spacing:.2em;text-transform:uppercase;color:var(--accent)}
.step p{margin:0;color:var(--muted);font-size:.95rem}
@media (max-width:760px){.steps{grid-template-columns:1fr}}

/* proximamente 1,300 m2 */
.prox{background:var(--accent-soft);border-block:1px solid var(--line)}
.prox-head{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(20px,4vw,48px);align-items:end;margin-bottom:28px}
.prox-head > div{display:grid;gap:14px;min-width:0}
.prox-head img{width:100%;aspect-ratio:16/9;object-fit:cover;max-width:100%}
.mods{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
.mod{background:var(--surface);border:1px solid var(--line);padding:18px;display:grid;gap:10px;align-content:start;min-width:0}
.mod .k{font:600 .75rem var(--display);letter-spacing:.2em;text-transform:uppercase;color:var(--accent)}
.mod h3{text-transform:uppercase;letter-spacing:.03em}
.mod p{margin:0;font-size:.92rem;color:var(--muted)}
.mod .giros b{color:var(--ink);font-weight:600}
.split{width:100%;height:46px;display:block}
.split rect{fill:var(--accent);stroke:var(--surface);stroke-width:3}
.split text{fill:var(--surface);font:600 11px var(--body);text-anchor:middle}
.mod .btn{justify-self:start;padding:8px 14px;font-size:.88rem}
@media (max-width:860px){.prox-head{grid-template-columns:1fr}}

/* form */
.cita{background:var(--ink);color:var(--bg)}
.cita .lead{color:color-mix(in srgb,var(--bg) 72%,transparent)}
.cita-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(24px,4vw,56px);align-items:start}
.cita-copy{display:grid;gap:18px;min-width:0}
.cita .eyebrow{color:color-mix(in srgb,var(--accent) 55%,var(--bg))}
form{display:grid;grid-template-columns:1fr 1fr;gap:14px;min-width:0}
form .full{grid-column:1/-1}
label{display:grid;gap:6px;font-size:.85rem;min-width:0}
input,select,textarea{font:inherit;font-size:1rem;padding:11px 12px;border-radius:4px;border:1px solid color-mix(in srgb,var(--bg) 25%,transparent);background:color-mix(in srgb,var(--bg) 8%,var(--ink));color:var(--bg);width:100%}
textarea{min-height:84px;resize:vertical}
.out{grid-column:1/-1;display:grid;gap:10px;background:color-mix(in srgb,var(--bg) 8%,var(--ink));border:1px solid color-mix(in srgb,var(--bg) 25%,transparent);padding:14px;border-radius:4px}
.out pre{white-space:pre-wrap;margin:0;font:inherit;font-size:.9rem}
.out .row{display:flex;gap:8px;flex-wrap:wrap}
@media (max-width:860px){.cita-grid{grid-template-columns:1fr}}
@media (max-width:480px){form{grid-template-columns:1fr}}

footer{padding-block:40px 96px;font-size:.9rem;color:var(--muted)}
footer .wrap{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:24px}
footer b{color:var(--ink);display:block;margin-bottom:4px}
.sel{user-select:all}
[hidden]{display:none!important}
.fab{position:fixed;right:calc(18px + env(safe-area-inset-right,0px));bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:30;border-radius:999px;box-shadow:0 6px 20px rgba(0,0,0,.25);padding:13px 18px}

/* property page */
.crumb{font-size:.88rem;color:var(--muted);padding-top:20px}
.crumb a{text-decoration:none;color:var(--accent);font-weight:600}
.p-hero{position:relative;margin-top:16px;aspect-ratio:21/9;max-height:62vh;width:100%;overflow:hidden;background:var(--accent-soft)}
.p-hero img{width:100%;height:100%;object-fit:cover}
@media (max-width:700px){.p-hero{aspect-ratio:4/3}}
.p-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:clamp(24px,4vw,56px);align-items:start;padding-top:clamp(28px,5vw,48px)}
.p-copy{display:grid;gap:18px;min-width:0}
.p-side{background:var(--surface);border:1px solid var(--line);padding:22px;display:grid;gap:14px;min-width:0;position:sticky;top:76px}
.p-side h3{text-transform:uppercase;letter-spacing:.04em}
.p-side ul{margin:0;padding-left:18px;display:grid;gap:6px}
.p-side .none{color:var(--muted);margin:0}
.p-side .btn{justify-content:center}
.meta{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;margin:0;font-size:.95rem}
.meta dt{color:var(--muted)}
.meta dd{margin:0}
@media (max-width:860px){.p-grid{grid-template-columns:1fr}.p-side{position:static}}
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px}
.gallery button{all:unset;cursor:zoom-in;display:block;aspect-ratio:4/3;overflow:hidden;background:var(--accent-soft)}
.gallery button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.gallery img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.gallery button:hover img{transform:scale(1.03)}
dialog.lb{border:0;padding:0;background:transparent;max-width:min(96vw,1400px);max-height:92vh}
dialog.lb::backdrop{background:rgba(0,0,0,.86)}
dialog.lb img{max-width:min(96vw,1400px);max-height:86vh;object-fit:contain;margin:auto}
dialog.lb .bar{display:flex;justify-content:space-between;gap:8px;padding-top:10px}
dialog.lb .bar button{font:600 .9rem var(--body);background:#fff;color:#111;border:0;border-radius:999px;padding:8px 14px;cursor:pointer}
.others{display:flex;flex-wrap:wrap;gap:8px}
.others a{font-size:.9rem;border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:6px 14px;text-decoration:none}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
@media (max-width:560px){.gallery{grid-template-columns:repeat(2,1fr);gap:6px}}

/* ===== más onda ===== */
:root{--lime:#C8F169}
h2{font-weight:400}
.eyebrow::before{content:"";display:inline-block;width:22px;height:2px;background:currentColor;vertical-align:middle;margin-right:10px;transform:translateY(-2px)}
.btn{transition:transform .15s, box-shadow .2s, background .2s}
.btn:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(0,0,0,.14)}
.btn-glass{background:rgba(255,255,255,.14);color:#fff;border-color:rgba(255,255,255,.45);backdrop-filter:blur(6px)}
.btn-glass:hover{background:rgba(255,255,255,.24)}

.hero-full{position:relative;min-height:min(88vh,820px);display:grid;align-items:end;color:#fff;overflow:hidden;padding:0;background:#16181A}
.hf-slides img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.06);transition:opacity 1.4s ease, transform 7s ease}
.hf-slides img.on{opacity:1;transform:scale(1)}
.hero-full::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,10,14,.15) 0%,rgba(10,10,14,.25) 40%,rgba(10,10,14,.82) 100%)}
.hf-copy{position:relative;z-index:2;display:grid;gap:22px;padding-block:120px 48px;width:100%}
.hf-copy .eyebrow{color:var(--lime)}
.hf-copy h1{font-size:clamp(2.6rem,7.4vw,6rem);font-weight:300;line-height:.98;max-width:13ch;text-shadow:0 2px 30px rgba(0,0,0,.25)}
.hf-copy h1 em{font-style:normal;font-weight:600;color:var(--lime);display:block}
.hf-copy .lead{color:rgba(255,255,255,.86);max-width:56ch}
.hf-copy .facts{color:rgba(255,255,255,.75);gap:8px 40px}
.hf-copy .facts b{color:#fff;font-size:clamp(2rem,4vw,3rem);font-weight:300}
.hf-cap{position:absolute;right:var(--gutter-r);bottom:20px;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.7)}
@media (max-width:700px){.hf-cap{display:none}.hf-copy{padding-block:96px 36px}}

.ticker{background:var(--accent);color:#fff;overflow:hidden;white-space:nowrap;border-block:1px solid rgba(0,0,0,.1)}
.tk{display:inline-flex;gap:0;animation:tk 38s linear infinite;padding-block:12px}
.tk span{font:600 .85rem var(--display);letter-spacing:.26em;text-transform:uppercase;padding-inline:22px}
.tk span::after{content:"✦";margin-left:44px;opacity:.6}
@keyframes tk{to{transform:translateX(-50%)}}

.doors{margin-top:0;border-top:0}
.door{position:relative;overflow:hidden;padding-block:34px}
.door::before{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .35s}
.door:hover::before{transform:scaleX(1)}
.door .go{transition:letter-spacing .25s}
.door:hover .go{letter-spacing:.04em}

.card{transition:transform .25s, box-shadow .25s}
.card:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(20,16,40,.12)}
.card .tag{background:var(--ink);color:var(--bg)}

.reel{overflow:hidden;background:var(--ink);padding-block:14px}
.rl{display:flex;gap:12px;width:max-content;animation:tk 60s linear infinite}
.reel:hover .rl{animation-play-state:paused}
.rl a{display:block;width:clamp(200px,24vw,320px);aspect-ratio:4/3;overflow:hidden;flex:none}
.rl img{width:100%;height:100%;object-fit:cover;transition:transform .5s, filter .3s;filter:saturate(.9)}
.rl a:hover img{transform:scale(1.06);filter:saturate(1.1)}

.prox h2, .colony h2{position:relative}
.cita{background:linear-gradient(135deg,#16181A 0%,#2A1F3D 100%)}
.cita .eyebrow{color:var(--lime)}

.rv{opacity:0;transform:translateY(26px);transition:opacity .7s ease, transform .7s ease}
.rv.in{opacity:1;transform:none}

/* property hero with title overlay */
.p-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(10,10,14,.7))}
.p-hero .p-title{position:absolute;left:clamp(16px,3vw,36px);bottom:clamp(16px,3vw,32px);z-index:2;color:#fff;display:grid;gap:8px}
.p-hero .p-title .eyebrow{color:var(--lime)}
.p-hero .p-title h1{font-size:clamp(2.2rem,6vw,4.6rem);text-shadow:0 2px 24px rgba(0,0,0,.3)}
.p-hero img{animation:kb 14s ease-out both}
@keyframes kb{from{transform:scale(1.08)}to{transform:scale(1)}}
.p-side{border-top:4px solid var(--accent)}

@media (prefers-reduced-motion:reduce){.tk,.rl,.p-hero img{animation:none}.hf-slides img{transition:none}}

/* fix: sección de citas legible en modo claro y oscuro */
.cita{color:#F1F1EE}
.cita h2{color:#FFFFFF}
.cita .lead{color:rgba(241,241,238,.82)}
.cita label{color:rgba(241,241,238,.9)}
.cita input,.cita select,.cita textarea{background:rgba(255,255,255,.08);color:#FFFFFF;border-color:rgba(255,255,255,.28)}
.cita input::placeholder,.cita textarea::placeholder{color:rgba(255,255,255,.5)}
.cita select option{color:#16181A;background:#FFFFFF}
.cita .out{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.28);color:#F1F1EE}
.cita .btn-ghost{background:transparent;color:#FFFFFF;border-color:rgba(255,255,255,.45)}
.reel{background:#0F1012}

/* header transparente sobre la portada, logo grande en óvalo */
body.home header.site{position:fixed;left:0;right:0;top:0;transition:background .35s, border-color .35s, backdrop-filter .35s}
body.home header.site .logo-pill{display:inline-flex;align-items:center;border-radius:999px;transition:background .35s, padding .35s, box-shadow .35s}
body.home header.site .logo{transition:height .35s}
body.home header.site.over{background:transparent;border-bottom-color:transparent;backdrop-filter:none}
body.home header.site.over .wrap{padding-block:18px}
body.home header.site.over .logo-pill{background:rgba(255,255,255,.92);padding:12px 30px;box-shadow:0 8px 28px rgba(0,0,0,.28)}
body.home header.site.over .logo{height:56px;filter:none!important}
body.home header.site.over nav.main a{color:rgba(255,255,255,.9);text-shadow:0 1px 8px rgba(0,0,0,.45)}
body.home header.site.over nav.main a:hover{color:#fff}
@media (max-width:700px){body.home header.site.over .logo{height:40px}body.home header.site.over .logo-pill{padding:9px 20px}}
/* texto de portada más chico */
.hf-copy{gap:18px;padding-top:150px}
.hf-copy h1{font-size:clamp(2rem,4.6vw,3.7rem);max-width:15ch}
.hf-copy .lead{font-size:1rem}
.hf-copy .facts b{font-size:clamp(1.6rem,2.8vw,2.2rem)}
html{scroll-padding-top:72px}

/* ===== móvil dinámico ===== */
.hf-dots{display:none}
.mbar{display:none}
.snap-ui{display:none}
@media (max-width:700px){
  /* portada a pantalla completa con swipe */
  .hero-full{min-height:100svh}
  .hf-copy{padding-top:120px;padding-bottom:64px}
  .hf-slides img{transition:opacity 1.1s ease, transform 9s linear;transform:scale(1.18)}
  .hf-slides img.on{transform:scale(1.02)}
  .hf-dots{display:flex;gap:6px;position:absolute;left:var(--gutter-l);bottom:22px}
  .hf-dots i{display:block;width:8px;height:8px;border-radius:99px;background:rgba(255,255,255,.45);transition:width .35s, background .35s}
  .hf-dots i.on{width:28px;background:var(--lime)}
  .hf-copy .facts{flex-wrap:nowrap;gap:22px}
  .hf-copy .facts > div{font-size:.78rem;line-height:1.25}
  .hf-copy .btn{flex:1;justify-content:center}

  /* carruseles horizontales con snap */
  [data-snap]{display:flex!important;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;
    margin-inline:calc(-1 * var(--gutter-l)) calc(-1 * var(--gutter-r));padding-inline:var(--gutter-l) var(--gutter-r);
    scroll-padding-inline:var(--gutter-l);scrollbar-width:none;-webkit-overflow-scrolling:touch;background:none!important;border:0!important}
  [data-snap]::-webkit-scrollbar{display:none}
  [data-snap] > *{flex:0 0 84%;scroll-snap-align:start;min-width:0}
  .doors[data-snap] > .door{flex-basis:78%;background:var(--surface);border:1px solid var(--line)!important;border-radius:14px;padding:22px}
  .doors[data-snap] > .door:first-child{background:var(--accent);color:#fff;border-color:var(--accent)!important}
  .doors[data-snap] > .door:first-child p,.doors[data-snap] > .door:first-child .eyebrow,.doors[data-snap] > .door:first-child .go{color:rgba(255,255,255,.9)}
  .doors{margin-top:20px}
  .cards[data-snap] > .card{border-radius:14px;overflow:hidden}
  .plazas[data-snap] > .plaza{flex-basis:62%;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
  .mods[data-snap] > .mod{border-radius:14px}

  /* indicador debajo de cada carrusel */
  .snap-ui{display:flex;align-items:center;gap:12px;margin-top:14px;font-size:.78rem;color:var(--muted);font-variant-numeric:tabular-nums}
  .snap-track{position:relative;flex:1;height:3px;background:var(--line);border-radius:3px;overflow:hidden}
  .snap-track b{position:absolute;top:0;bottom:0;left:0;width:20%;background:var(--accent);border-radius:3px;transition:left .15s}
  .snap-hint{font-weight:600;color:var(--accent);animation:nudge 1.6s ease-in-out infinite}
  .snap-hint::after{content:" →"}
  .snap-ui.moved .snap-hint{opacity:0;transition:opacity .3s}
  @keyframes nudge{50%{transform:translateX(5px)}}

  /* filtros pegajosos */
  .filters{position:sticky;top:64px;z-index:5}
  .sec-head{margin-bottom:20px}

  /* barra inferior de acciones */
  .fab{display:none!important}
  .mbar{display:grid;grid-template-columns:1fr 1.2fr;gap:8px;position:fixed;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom,0px));z-index:40;
    padding:8px;border-radius:18px;background:color-mix(in srgb,var(--ink) 88%,transparent);backdrop-filter:blur(12px);box-shadow:0 10px 30px rgba(0,0,0,.3);
    transform:translateY(140%);transition:transform .4s cubic-bezier(.2,.8,.2,1)}
  .mbar.show{transform:none}
  .mbar a{display:flex;align-items:center;justify-content:center;gap:8px;padding:13px 10px;border-radius:12px;font:600 .95rem var(--body);text-decoration:none}
  .mbar svg{width:18px;height:18px}
  .mb-cita{color:var(--bg);border:1px solid color-mix(in srgb,var(--bg) 30%,transparent)}
  .mb-wa{background:var(--wa);color:#fff}
  footer{padding-bottom:120px}

  /* galería de inmueble deslizable */
  .gallery[data-snap] > button{flex:0 0 88%;aspect-ratio:4/3;border-radius:12px;scroll-snap-align:start}
  .p-hero{border-radius:14px}
}
@media (max-width:700px) and (prefers-reduced-motion:reduce){.snap-hint{animation:none}.hf-slides img{transform:none}}

/* logo oficial: óvalo negro con letras blancas */
.logo.logo-oval{height:46px;width:auto;filter:none!important}
:root[data-theme="dark"] .logo.logo-oval{filter:drop-shadow(0 0 1px rgba(255,255,255,.55))!important}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .logo.logo-oval{filter:drop-shadow(0 0 1px rgba(255,255,255,.55))!important}}
body.home header.site.over .logo-pill{background:none!important;padding:0!important;box-shadow:none!important}
body.home header.site.over .logo.logo-oval{height:92px;filter:drop-shadow(0 8px 22px rgba(0,0,0,.45))!important}
@media (max-width:700px){body.home header.site.over .logo.logo-oval{height:64px}.logo.logo-oval{height:40px}}

/* al bajar: el óvalo se encoge y termina en barra negra con las letras */
.brand{display:inline-flex;align-items:center}
.logo.logo-letters{display:none;filter:none!important}
body.home header.site.over .logo.logo-oval{height:var(--lh,92px);transition:none}
header.site.dark-bar{background:#0E0E10!important;border-bottom-color:#0E0E10!important;backdrop-filter:none}
header.site.dark-bar .wrap{padding-block:14px}
header.site.dark-bar .logo.logo-oval{display:none}
header.site.dark-bar .logo.logo-letters{display:block;height:34px;animation:lettersIn .35s ease both}
header.site.dark-bar nav.main a{color:rgba(255,255,255,.78)}
header.site.dark-bar nav.main a:hover{color:#fff}
@keyframes lettersIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@media (max-width:700px){header.site.dark-bar .logo.logo-letters{height:28px}}
@media (prefers-reduced-motion:reduce){header.site.dark-bar .logo.logo-letters{animation:none}}

/* transición fluida del header en la portada (sin saltos) */
body.home header.site{background:rgba(14,14,16,var(--bgA,0))!important;border-bottom:1px solid rgba(14,14,16,var(--bgA,0))!important;backdrop-filter:none!important;transition:none}
body.home header.site .wrap{padding-block:var(--pad,18px)!important}
body.home header.site .brand{position:relative}
body.home header.site .logo-pill{background:none!important;padding:0!important;box-shadow:none!important}
body.home header.site .logo.logo-oval{display:block!important;height:var(--lh,92px);opacity:var(--ovA,1);filter:drop-shadow(0 8px 22px rgba(0,0,0,calc(.45 * var(--ovA,1))))!important;transition:none}
body.home header.site .logo.logo-letters{display:block!important;position:absolute;left:0;top:50%;height:34px;transform:translateY(-50%);opacity:var(--ltA,0);animation:none}
body.home header.site nav.main a{color:rgba(255,255,255,.88);text-shadow:0 1px 8px rgba(0,0,0,calc(.45 * (1 - var(--bgA,0))))}
body.home header.site nav.main a:hover{color:#fff}
body.home header.site:not(.done) .logo.logo-letters{pointer-events:none}
@media (max-width:700px){body.home header.site .logo.logo-letters{height:28px}}

/* móvil: las tres puertas van apiladas, sin carrusel, para que no se muevan al bajar */
@media (max-width:700px){
  .doors{display:grid;grid-template-columns:1fr;gap:10px;margin-top:20px;border:0}
  .doors > .door{background:var(--surface);border:1px solid var(--line)!important;border-radius:14px;padding:16px 18px;gap:4px}
  .doors > .door:first-child{background:var(--accent);color:#fff;border-color:var(--accent)!important}
  .doors > .door:first-child p,.doors > .door:first-child .eyebrow,.doors > .door:first-child .go{color:rgba(255,255,255,.9)}
  .doors > .door h3{font-size:1.2rem}
  .doors > .door p{font-size:.88rem}
}
/* carruseles: el gesto vertical siempre baja la página */
[data-snap]{overscroll-behavior-x:contain}

/* carruseles: solo se mueven de lado; nunca hacia arriba o abajo con el dedo */
[data-snap]{overflow-y:hidden!important;touch-action:pan-x pan-y}
@media (max-width:700px){[data-snap] > .rv{transform:none}}

/* logo: nunca se deforma; conserva su proporción original */
header.site .logo{max-width:none!important;width:auto!important;object-fit:contain}

/* móvil: barra de acciones más compacta */
@media (max-width:700px){
  .mbar{left:auto;right:calc(12px + env(safe-area-inset-right,0px));bottom:calc(12px + env(safe-area-inset-bottom,0px));grid-template-columns:auto auto;gap:6px;padding:5px;border-radius:999px}
  .mbar a{padding:8px 13px;border-radius:999px;font-size:.8rem;gap:6px}
  .mbar svg{width:15px;height:15px}
}
