/* ============================================================
   casas.css — estilos de la sección Casas (listado + landing).
   Reusa la identidad de site.css (naranja #f75700, Stack Sans Text,
   .section/.card/.btn), sumando lo específico de esta sección.
   ============================================================ */

/* ---------- Listado ---------- */
.casas-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
@media(max-width:991.98px){.casas-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:575.98px){.casas-grid{grid-template-columns:1fr}}

.casa-card{display:flex;flex-direction:column;background:#fff;border-radius:10px;overflow:hidden;
  box-shadow:0 5px 25px rgba(0,0,0,.10);transition:transform .22s ease,box-shadow .22s ease;height:100%}
.casa-card:hover{transform:translateY(-6px);box-shadow:0 10px 50px rgba(0,0,0,.15)}
.casa-card .casa-thumb{aspect-ratio:4/3;overflow:hidden;background:#e9e5e0}
.casa-card .casa-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.casa-card:hover .casa-thumb img{transform:scale(1.05)}
.casa-card .casa-body{padding:18px 20px 22px;display:flex;flex-direction:column;gap:9px}
.casa-card .casa-body h3{font-size:24px;margin:0;color:#111}
.casa-card .casa-meta{display:flex;flex-wrap:wrap;gap:14px;color:#6b6b6b;font-size:14px}
.casa-card .casa-meta span{display:inline-flex;align-items:center;gap:6px}
.casa-card .casa-go{margin-top:2px;color:#f75700;font-weight:600;font-size:13px;text-transform:uppercase;letter-spacing:1px}

/* ---------- Hero del modelo ---------- */
.casa-hero{position:relative;min-height:80vh;display:flex;align-items:flex-end;overflow:hidden;color:#fff}
.casa-hero .casa-hero-bg{position:absolute;inset:0}
.casa-hero .casa-hero-bg img{width:100%;height:100%;object-fit:cover}
.casa-hero .casa-hero-bg::after{content:"";position:absolute;inset:0;
  background:linear-gradient(0deg,rgba(0,0,0,.85) 0%,rgba(0,0,0,.25) 55%,rgba(0,0,0,.45) 100%)}
.casa-hero .casa-hero-inner{position:relative;z-index:2;width:100%;padding-bottom:48px}
.casa-hero h1{color:#fff;font-size:clamp(44px,9vw,92px);line-height:.94;margin:0}
.casa-hero .casa-hero-sub{max-width:640px;margin-top:14px;font-size:19px;color:#ececec}
.casa-hero .casa-cta-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
/* Botón "Descargar ficha PDF" (outline claro sobre el hero oscuro): en hover se
   rellenaba de blanco y el texto quedaba blanco (invisible). Forzamos contraste. */
.casa-hero .btn-outline-light{color:#fff;border-color:rgba(255,255,255,.65)}
.casa-hero .btn-outline-light:hover,
.casa-hero .btn-outline-light:focus{background:#fff;color:#111;border-color:#fff}

.casa-specstrip{display:flex;flex-wrap:wrap;gap:34px;margin-top:26px;padding-top:22px;border-top:1px solid rgba(255,255,255,.25)}
.casa-specstrip .s{display:flex;flex-direction:column;gap:2px}
.casa-specstrip .s .n{font-size:30px;font-weight:500;color:#fff;letter-spacing:-.02em;line-height:1}
.casa-specstrip .s .l{font-size:12px;text-transform:uppercase;letter-spacing:1.5px;color:#cfcdca}

/* Al saltar a una sección desde el sub-nav, que quede debajo del header (~60px)
   y del sub-nav pegado (~58px), no tapada por ellos. */
section[id]{scroll-margin-top:122px}
@media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}

/* ---------- Sub-nav de secciones ---------- */
/* Pegado debajo del header fijo (~60px en estado scrolleado). z-index por
   debajo del botón flotante "seguí bajando" (.scroll-hint, z-index 50) para
   no taparlo, y por debajo del navbar principal (z 1030). */
.casa-subnav{position:sticky;top:60px;z-index:20;background:rgba(255,255,255,.95);
  backdrop-filter:blur(8px);border-bottom:1px solid #ececec}
.casa-subnav .inner{display:flex;gap:6px;overflow-x:auto;padding:11px 0;transition:padding-left .18s ease}
/* Cuando el sub-nav queda PEGADO bajo el header, el logo circular (120px de
   ancho, cuelga ~123px) tapa los primeros ítems. Solo en ese estado corremos
   los ítems a la derecha para librar el logo (misma medida en desktop y mobile,
   porque el logo arranca en el borde del contenedor en ambos). */
.casa-subnav.is-stuck .inner{padding-left:130px}
.casa-subnav a{white-space:nowrap;font-size:13.5px;font-weight:500;color:#6b6b6b;padding:8px 16px;border-radius:999px;transition:.15s}
.casa-subnav a:hover{color:#111;background:#f2f2f2}

/* ---------- Video ---------- */
.casa-video{max-width:920px;margin:0 auto}
.casa-video .video-thumb{aspect-ratio:16/9;border-radius:12px;overflow:hidden}
.casa-video .video-thumb img{width:100%;height:100%;object-fit:cover}
.casa-video-cap{margin-top:14px;text-align:center;color:#6b6b6b;font-size:14px}

/* ---------- Galerías (renders / planos) ---------- */
.casa-gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;grid-auto-flow:dense}
.casa-gallery.planos{grid-template-columns:repeat(3,1fr)}
@media(max-width:991.98px){.casa-gallery,.casa-gallery.planos{grid-template-columns:repeat(2,1fr)}}
@media(max-width:575.98px){.casa-gallery,.casa-gallery.planos{grid-template-columns:1fr}}
.casa-gallery a{display:block;border-radius:10px;overflow:hidden;aspect-ratio:1;background:#e9e5e0}
.casa-gallery.planos a{aspect-ratio:4/3}
.casa-gallery a img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}
.casa-gallery a:hover img{transform:scale(1.04)}
.casa-gallery a.big{grid-column:span 2;grid-row:span 2;aspect-ratio:auto}
@media(max-width:575.98px){.casa-gallery a.big{grid-column:auto;grid-row:auto;aspect-ratio:1}}

/* ---------- Memoria descriptiva ---------- */
.casa-memo-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:26px}
@media(max-width:991.98px){.casa-memo-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:575.98px){.casa-memo-grid{grid-template-columns:1fr}}
.casa-memo-tile{background:#fff;border:1px solid #eceae7;border-radius:12px;padding:20px;display:flex;flex-direction:column;gap:5px}
.casa-memo-tile .k{font-size:12px;text-transform:uppercase;letter-spacing:1.3px;color:#f75700;font-weight:600}
.casa-memo-tile .v{font-size:19px;color:#111;font-weight:400}

/* ---------- Precio ---------- */
.casa-precio{position:relative;overflow:hidden;color:#fff;padding:72px 0;
  background:linear-gradient(135deg,#FF7A2A 0%,#F75700 55%,#D63F00 100%)}
@media(max-width:575.98px){.casa-precio{padding:52px 0}}
.casa-precio::before{content:"";position:absolute;inset:0;
  background:radial-gradient(60% 90% at 85% 10%,rgba(255,197,2,.40),transparent 60%)}
.casa-precio .inner{position:relative;z-index:2;display:grid;grid-template-columns:1.1fr 1fr;gap:44px;align-items:center}
@media(max-width:767.98px){.casa-precio .inner{grid-template-columns:1fr}}
.casa-precio h2{color:#fff;font-size:clamp(28px,5vw,42px);margin:14px 0 10px}
.casa-precio .price{font-size:clamp(48px,9vw,84px);font-weight:600;color:#fff;letter-spacing:-.03em;line-height:1}
.casa-precio .price small{display:block;font-size:14px;font-weight:400;letter-spacing:1.5px;text-transform:uppercase;color:rgba(255,255,255,.85);margin-top:8px}
.casa-precio .pago{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.28);border-radius:16px;padding:26px 28px}
.casa-precio .pago h4{color:#fff;font-size:20px;margin:0 0 14px}
.casa-precio .pago .pago-text{color:#fff;font-weight:300;font-size:15.5px;line-height:1.7;white-space:pre-line}
.casa-precio .casa-cta-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px}

/* Badge negro reusable sobre el hero (si hiciera falta) */
.casa-eyebrow{display:inline-block;background:rgba(255,255,255,.12);color:#fff;font-size:12px;font-weight:600;
  text-transform:uppercase;letter-spacing:2px;padding:6px 18px;border-radius:6px;margin-bottom:14px}

@media(prefers-reduced-motion:reduce){.casa-card,.casa-card .casa-thumb img,.casa-gallery a img{transition:none}}