/* ===== Versión celular: layout ordenado en una sola columna ===== */
@media (max-width:820px){
:root{--m:24px}
html,body{overflow-x:hidden}
body{background:#fff}
.sec{height:auto!important;min-height:0!important;padding:0!important;display:block;overflow:hidden}
.sec>*,.sec>*>*{position:static!important}
.sec .shield{position:absolute!important}
.sec>.top{position:fixed!important}
.sec>.navblur{position:fixed!important}
.top .logo{position:absolute!important}
.top .logo>*{position:absolute!important}
.top .burger{position:absolute!important}
.top .burger span{position:absolute!important}
.top nav{position:fixed!important}
.top nav a{position:static!important}
.top .sep,.top .under{display:none!important}
.gapsec{display:block!important;height:calc(var(--gh,60)*var(--u))!important;background:#fff}
.sec img{display:block;width:100%!important;height:auto!important;max-width:none!important;margin:0!important;object-fit:cover}
.fig{width:100%!important;height:auto!important;overflow:hidden!important;background:none!important}
.fig img{position:static!important;width:100%!important;height:auto!important}

/* barra superior */
.top{height:72px!important;background:linear-gradient(rgba(0,0,0,.5),transparent)}
.top .logo{left:var(--m)!important;top:10px!important;width:112px!important;height:52px!important}
.top .logo img{position:absolute!important;left:0!important;top:0!important;width:100%!important;height:auto!important}
.top .burger{right:var(--m)!important}
html.scrolled .top{background:none!important}

.top .logo,.top .burger{z-index:11}
.top nav{background:rgba(18,16,12,.985)!important}
html:has(.top nav.open){overflow:hidden}
.top.dk nav.open~*{color:#fff}
/* portadas */
.hero{position:relative;display:flex!important;flex-direction:column;justify-content:flex-end;min-height:62svh!important;padding:96px var(--m) 44px!important;color:#fff}
.hero:has(.rule){min-height:100svh!important;padding-bottom:64px!important}
.hero>img.bg{position:absolute!important;inset:0;width:100%!important;height:100%!important;object-fit:cover;object-position:62% center;z-index:0}
.hero>.navwrap{display:none!important}
.hero>.hello,.hero>.rule,.hero>.nordelta{position:relative!important;left:auto!important;top:auto!important;z-index:2;margin-left:0!important;margin-right:0!important}
.hello{font-size:34px!important;line-height:40px!important;white-space:normal!important;font-weight:300}
.hello .fl{position:static!important;display:block!important;font-size:inherit!important;line-height:inherit!important;letter-spacing:.03em!important;padding:0!important;white-space:normal!important;width:auto!important;left:auto!important;top:auto!important}
.hero .rule{display:block;width:min(240px,62%)!important;height:1px!important;margin:20px 0 16px!important;background:#fff;scale:1 1;animation:none}
.hero .nordelta{font-size:14px!important;line-height:20px!important;letter-spacing:.22em!important;transform:none!important;margin:0!important}
.hero>.nordelta:not(:last-child){margin:0!important}
.hero .hello+.nordelta{margin-top:14px!important}

/* título grande (logo) sobre foto */
.sec.logo-sec{position:relative;min-height:56svh!important;display:flex!important;align-items:center;justify-content:center}
.logo-sec>img.bg{position:absolute!important;inset:0;width:100%!important;height:100%!important}
.bigtitle{position:relative!important;left:auto!important;top:auto!important;transform:translateY(-10%);z-index:2;width:74%;max-width:340px;text-align:center}
.bigtitle img{width:100%!important;height:auto!important}

/* fotos y pares */
.photo,.grey.photo{padding:0!important}
.duo{display:grid!important;grid-template-columns:1fr 1fr;gap:10px;padding:24px var(--m)!important}
.duo img{width:100%!important;aspect-ratio:1/1;object-fit:cover;height:100%!important}
.photo.duo{padding:0!important;gap:0}
.plans{padding:8px 0 24px!important}
.sec:has(>img+img:last-child):not(.duo):not(.photo){display:grid;grid-template-columns:1fr;gap:16px;padding:24px var(--m)!important}

/* textos */
.sec:has(>.txt),.sec:has(>h2),.sec:has(>h3){padding:44px 0 !important}
.sec>h2,.sec>h3,.sec>.txt,.sec>.cap,.sec>.cap-l,.sec>.cap-l{margin-left:var(--m)!important;margin-right:var(--m)!important}
.sec h2{font-size:22px!important;line-height:28px!important;margin-top:0!important;margin-bottom:16px!important;white-space:normal!important;letter-spacing:.04em!important}
.sec h3{font-size:19px!important;line-height:26px!important;margin-top:28px!important;margin-bottom:12px!important;white-space:normal!important}
.sec h2.big{font-size:28px!important;line-height:34px!important;text-align:center}
.sec>img~h2,.sec>img~h3{margin-top:28px!important}
.sec>:is(.txt,h2,h3,.cap)~img{margin-top:28px!important}
.sec>img~.txt{margin-top:0}
.txt{width:auto!important;font-size:14px!important;line-height:22px!important;text-align:justify!important;text-justify:inter-word;hyphens:auto;-webkit-hyphens:auto;color:#6b6b6b}
.txt p{display:block;margin:0 0 13px!important}
.txt p.gap{display:none!important}
.txt .ln{display:inline!important;width:auto!important;white-space:normal!important;letter-spacing:.01em!important;word-spacing:0!important}
.txt .h{display:none}
.h{display:none}

/* Estudio Ramos: retratos lado a lado */
.sec.ramos{display:grid!important;grid-template-columns:1fr 1fr;column-gap:12px;padding:44px var(--m)!important}
.ramos>h2,.ramos>.txt{grid-column:1/-1;margin-left:0!important;margin-right:0!important}
.sec.ramos>img{width:100%!important;height:auto!important;aspect-ratio:4/5;object-fit:cover;margin:0!important}
.ramos>.txt{margin-top:22px!important}
.ball>.txt{margin-bottom:0}


/* ART + NORDELTA */
.twocol{padding:44px 0!important}
.bigart{font-size:34px!important;line-height:40px!important;margin-bottom:20px!important}
.twocol>img{margin:20px 0!important}
.twocol .txt+.txt{margin-top:0!important}

/* planos de locales */
.vline{display:none!important}
.cap-l{font-size:13px!important;line-height:20px!important;color:#3d3d3d;margin-top:14px!important;margin-bottom:6px!important}
.cap-l p{margin:0!important;white-space:normal!important;width:auto!important}
.cap-l b{font-weight:600}
.plans>img{margin-top:18px!important}

/* unidades */
.unidades{padding:56px var(--m) 48px!important;text-align:center}
.unidades>h2.big{margin:0 0 22px!important}
.unidades>img{max-width:340px!important;margin:0 auto!important}
.unidades>.cap{margin:22px auto 0!important;font-size:10.5px!important;line-height:17px!important;letter-spacing:.06em;white-space:normal!important;width:auto!important;color:#6b6b6b}
.unidades>.dl{display:block!important;width:46px!important;height:46px!important;margin:18px auto 0!important}
.unidades>.dl img{width:100%!important;height:100%!important}

/* pie */
.foot{padding:52px var(--m) 56px!important;text-align:center;background:#f7f7f7}
.foot>img.logo-img{width:190px!important;height:auto!important;margin:0 auto 26px!important}
.foot>.mail{display:block;font-size:13px!important;line-height:20px!important;letter-spacing:.12em;white-space:normal!important;margin:0 auto!important;width:auto!important;color:#3d3d3d}
.mapa{padding:0!important}
}
@media (max-width:820px){.top.dk:has(nav.open) .logo img{filter:brightness(0) invert(1)}}

/* respeta los márgenes y espacios entre imágenes del diseño (proporcionales al ancho) */
@media (max-width:820px){
.sec[style*="--pt"]{padding:calc(var(--pt)*var(--u)) calc(var(--pr)*var(--u)) calc(var(--pb)*var(--u)) calc(var(--pl)*var(--u))!important;display:block}
.sec[style*="--gap"]{display:grid!important;grid-template-columns:1fr;row-gap:calc(var(--gap)*var(--u))}
.sec[style*="--w1"]{display:grid!important;grid-template-columns:calc(var(--w1)*var(--u)) calc(var(--w2)*var(--u));column-gap:calc(var(--cg)*var(--u));align-items:start}
.sec[style*="--pt"] img{height:auto!important;object-fit:cover}
.sec.photo.duo[style*="--w1"]{column-gap:0}
/* portadas: título legible sobre cualquier foto */
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:62%;background:linear-gradient(to bottom,rgba(0,0,0,0),rgba(0,0,0,.58));z-index:1;pointer-events:none}
.hero .hello,.hero .nordelta{text-shadow:0 1px 14px rgba(0,0,0,.35)}
.hero{padding-bottom:56px!important}
/* logo grande de la 2.ª imagen del Home */
.bigtitle{width:58%!important;max-width:260px!important;transform:translateY(-34%)!important}
}
@media (max-width:820px){
.sec.ramos>img{order:1}
.sec.ramos>h2{order:2;margin:26px 0 0!important}
.sec.ramos>.txt{order:3;margin-top:14px!important}
}

@media (max-width:820px){
.foot>.legal{position:static!important;width:auto!important;margin:36px 0 0!important;padding-top:20px!important;font-size:10.5px!important;line-height:16.5px!important;text-align:justify!important;text-align-last:center!important;border-top:1px solid #dcdcdc}
.foot>.legal p.lg-c{font-size:10.5px!important;margin-bottom:8px!important}
}