/* ============================================================
   CONTACTO · Asesoría Inmobiliaria Profesional
   Paleta de marca: esmeralda + oro rosa + crema
   ============================================================ */

:root {
  --emerald:    #02311d;
  --emerald-700:#02311d;
  --emerald-500:#02311d;
  --rose:       #c08a6a;
  --rose-300:   #d7a888;

  --bg:      #fefefe;   /* crema muestreado del logo */
  --surface: #ffffff;
  --ink:     #15201a;
  --muted:   #6f6a63;
  --line:    #e7ded2;
  --wa:      #25c160;

  --grad: linear-gradient(120deg, #02311c 0%, #16573d 45%, #c08a6a 100%);
  --grad-soft: linear-gradient(120deg, #1f7a54, #c08a6a);

  --radius: 22px;
  --radius-sm: 14px;
  --shadow: 0 18px 45px rgba(20,40,30,0.12);
  --shadow-card: 0 14px 34px rgba(20,40,30,0.14);
  --maxw: 1500px;

  /* ---- Botones (editables desde el panel) ---- */
  --btn:       #16573d;
  --btn-dark:  #02311d;
  --btn-grad:  var(--grad);
  --btn-ink:   #ffffff;
  --btn-shadow: rgba(20,40,30,.30);

  /* ---- Footer (editable desde el panel) ---- */
  --footer-bg:    #02311c;
  --footer-ink:   #dfe7e1;
  --footer-head:  #ffffff;
  --footer-sub:   #cdd8d1;
  --footer-muted: #aab8b0;
  --footer-link-hover: var(--rose-300);
  --footer-border: rgba(255,255,255,.12);

  /* ---- Fondo parallax (back.png) ---- */
  --bg-veil-opacity: .82;
  --bgY: 0px;
}

* { margin:0; padding:0; box-sizing:border-box; }

html { scroll-behavior:smooth; }

body {
  font-family: 'Inter', system-ui, -apple-system, Segoe UI, Helvetica, Arial, sans-serif;
  background: var(--bg);
  color: var(--ink);
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  position: relative;
  isolation: isolate;            /* contiene las capas de fondo */
  z-index: 0;
}

/* ===== FONDO DEL SITIO: imagen back.png (parallax) + velo de color ===== */
body::before {                   /* imagen, capa más profunda */
  content:""; position:fixed; left:0; right:0; top:-12%; height:124%;
  background:url('../img/back.png') center top / cover no-repeat;
  transform: translate3d(0, var(--bgY), 0);
  will-change: transform; z-index:-2; pointer-events:none;
}
body::after {                    /* velo del color de fondo, encima de la imagen */
  content:""; position:fixed; inset:0;
  background: var(--bg); opacity: var(--bg-veil-opacity);
  z-index:-1; pointer-events:none;
}
@media (prefers-reduced-motion: reduce){
  body::before { transform:none; }
}
 
a { text-decoration:none; color:inherit; }
img { display:block; max-width:100%; }

.container { max-width: var(--maxw); margin:0 auto; padding:0 32px; }
.btn-grad {
  background: #1b583e !important;
}
/* ---------- BUTTONS ---------- */
.btn-grad {
  display:inline-flex; align-items:center; gap:9px;
   background: #1b583e !important; color:var(--btn-ink); border:none;
  padding:13px 24px; border-radius:999px;
  font-weight:700; font-size:15px; cursor:pointer;
  box-shadow: 0 8px 20px var(--btn-shadow);
  transition: transform .15s, box-shadow .2s, filter .2s;
  font-family:inherit; position:relative; overflow:hidden; isolation:isolate;
}
.btn-grad:hover { transform:translateY(-2px); box-shadow:0 12px 28px var(--btn-shadow); filter:brightness(1.04); }

.btn-outline {
  display:inline-flex; align-items:center; gap:9px;
  border:1.5px solid var(--line); background:var(--surface);
  color:var(--ink); padding:12px 22px; border-radius:999px;
  font-weight:700; font-size:15px; cursor:pointer; font-family:inherit;
  transition: border-color .2s, color .2s;
}
.btn-outline:hover { border-color:var(--rose); color:var(--emerald); }
.btn-outline .ico { color:var(--rose); display:flex; }

.btn-wa {
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  background: var(--wa); color:#fff; border:none;
  padding:13px 22px; border-radius:999px;
  font-weight:700; font-size:15px; cursor:pointer; font-family:inherit;
  box-shadow: 0 8px 20px rgba(37,193,96,0.32);
  transition: transform .15s;
}
.btn-wa:hover { transform:translateY(-2px); }

/* ---------- HEADER ---------- */
.site-header {
  display:flex; align-items:center; justify-content:space-between;
  gap:24px; padding:0px 32px; max-width:var(--maxw); margin:0 auto;
}
.brand img { height:80px; width:auto; }
.brand .fallback {
  font-family:'Playfair Display',serif; font-size:30px; font-weight:800;
  color:var(--emerald); letter-spacing:.5px;
}
nav.main-nav { display:flex; gap:34px; }
nav.main-nav a {
  font-weight:600; font-size:15px; color:#2c352f;
  position:relative; padding-bottom:5px;
  transition:color .25s ease, transform .25s ease;
}
nav.main-nav a::before {                /* subrayado que entra al pasar el cursor */
  content:""; position:absolute; left:0; right:0; bottom:0; height:2.5px;
  background:var(--grad); border-radius:3px;
  transform:scaleX(0); transform-origin:right;
  transition:transform .34s cubic-bezier(.65,0,.35,1);
}
nav.main-nav a:hover { color:var(--emerald); transform:translateY(-1px); }
nav.main-nav a:hover::before { transform:scaleX(1); transform-origin:left; }
nav.main-nav a.active { color:var(--emerald); }
nav.main-nav a.active::after {
  content:""; position:absolute; left:0; right:0; bottom:0;
  height:2.5px; background:var(--grad); border-radius:3px;
}
.header-actions { display:flex; align-items:center; gap:14px; }

/* mobile nav toggle */
.nav-toggle { display:none; background:none; border:none; cursor:pointer; color:var(--emerald); }

/* ---------- HERO (home) ---------- */
.hero {   margin: auto ; padding:0 32px 25px; background: white !important}
.hero-inner {
  position:relative; overflow:hidden; border-radius:26px;
  background: var(--grad); min-height:560px; display:flex; align-items:stretch;
}
.hero-text { position:relative; z-index:2; padding:56px 60px; color:#fff; max-width:640px; }
.eyebrow {
  display:inline-flex; align-items:center; gap:8px;
  font-weight:700; letter-spacing:1.5px; font-size:13px; text-transform:uppercase;
}
.hero .location { margin-bottom:22px; }
.hero h1 { font-size:64px; font-weight:800; line-height:1.04; letter-spacing:-.5px; text-shadow:0 4px 18px rgba(0,0,0,.14); }
.divider { width:74px; height:4px; background:rgba(255,255,255,.85); border-radius:4px; margin:26px 0 22px; }
.hero-feats { font-size:21px; font-weight:600; opacity:.96; margin-bottom:30px; }
.hero-buttons { display:flex; gap:16px; flex-wrap:wrap; }
.btn-glass {
  display:inline-flex; align-items:center; gap:11px;
  background: linear-gradient(120deg, rgba(255,255,255,.26), rgba(255,255,255,.12));
  border:1.5px solid rgba(255,255,255,.6); color:#fff;
  padding:16px 30px; border-radius:999px; font-size:17px; font-weight:700;
  cursor:pointer; backdrop-filter:blur(4px); transition:transform .15s; font-family:inherit;
}
.btn-glass:hover { transform:translateY(-2px); }
.hero-buttons .btn-wa { padding:16px 30px; font-size:17px; }
.hero-img {
  position:absolute; top:0; right:0; bottom:0; width:54%;
  object-fit:cover; object-position:center;
  -webkit-mask-image: linear-gradient(to right, transparent, #000 20%);
  mask-image: linear-gradient(to right, transparent, #000 20%);
}

/* ---------- STATS ---------- */
.stats {
  position:relative; z-index:3; max-width:var(--maxw);
  margin:-78px auto 0; padding:0 32px;
  display:flex; justify-content:flex-end; gap:18px; flex-wrap:wrap;
}
.stat-card {
  background: rgba(255,255,255,.97); backdrop-filter:blur(6px);
  border-radius:20px; padding:20px 24px;
  display:flex; align-items:center; gap:15px; box-shadow:var(--shadow); min-width:230px;
}
.stat-icon {
  width:54px; height:54px; flex:none; border-radius:15px; background:var(--grad);
  display:flex; align-items:center; justify-content:center; color:#fff;
}
.stat-big { font-family:'Playfair Display',serif; font-size:27px; font-weight:800; line-height:1; }
.stat-label { font-size:13.5px; color:var(--muted); margin-top:4px; }

/* ---------- BENEFITS ---------- */
.benefits {
  max-width:var(--maxw); margin:32px auto 0; padding:0 32px;
  display:flex; align-items:center; gap:36px; flex-wrap:wrap;
}
.benefit { display:flex; align-items:center; gap:13px; }
.benefit .b-icon {
  width:42px; height:42px; flex:none; border-radius:12px;
  background:rgba(192,138,106,.14); color:var(--rose);
  display:flex; align-items:center; justify-content:center;
}
.benefit .b-text { font-size:15px; font-weight:600; }
.sep { width:1px; height:40px; background:var(--line); }

/* ---------- SECTION HEADING ---------- */
.section { max-width:var(--maxw); margin:56px auto; padding:0 32px; }
.section-head { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:24px; }
.section-head .eyebrow { color:var(--rose); margin-bottom:8px; }
.section-head h2 { font-size:34px; font-weight:800; line-height:1.1; }
.section-head p.sub { color:var(--muted); margin-top:6px; max-width:560px; }
.see-all { display:inline-flex; align-items:center; gap:11px; font-weight:600; font-size:15px; color:#333; white-space:nowrap; }
.see-all .arrow {
  width:38px; height:38px; border-radius:999px; background:var(--emerald); color:#fff;
  display:flex; align-items:center; justify-content:center;
}
.benefit.reveal.in {
  background: white;
  padding: 20px;
  border-radius: 20px;
}
/* ---------- FEATURED GRID (image-overlay cards) ---------- */
.grid { display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
.card {
  position:relative; border-radius:var(--radius); overflow:hidden;
  box-shadow:var(--shadow-card); aspect-ratio:3/3.7; cursor:pointer;
  transition:transform .2s;
}
.card:hover { transform:translateY(-5px); }
.card > img { width:100%; height:100%; object-fit:cover; }
.card::after { content:""; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(0,0,0,.82) 0%, rgba(0,0,0,.32) 42%, rgba(0,0,0,0) 70%); }
.badge {
  position:absolute; top:16px; left:16px; z-index:2; background:var(--grad);
  color:#fff; font-size:11.5px; font-weight:800; letter-spacing:.6px;
  padding:7px 13px; border-radius:999px;
}
.card-loc {
  position:absolute; top:16px; right:16px; z-index:2;
  display:inline-flex; align-items:center; gap:6px;
  color:#fff; font-size:12.5px; font-weight:600; text-shadow:0 1px 4px rgba(0,0,0,.5);
}
.card-body { position:absolute; left:0; right:0; bottom:0; z-index:2; padding:22px; color:#fff; }
.card-title { font-size:23px; font-weight:800; margin-bottom:6px; }
.card-foot { display:flex; align-items:flex-end; justify-content:space-between; gap:10px; }
.card-sub { font-size:13.5px; opacity:.9; }
.card-price-wrap { text-align:right; }
.card-desde { display:inline-flex; align-items:center; gap:5px; font-size:11.5px; opacity:.85; }
.card-price { font-family:'Playfair Display',serif; font-size:23px; font-weight:800; }

/* ---------- PAGE BANNER (sub-pages) ---------- */
.page-banner {  margin:0px auto 0; padding:0 32px 25px; background: white !important}
.page-banner-inner {
  position:relative; overflow:hidden; border-radius:26px; background:var(--grad);
  color:#fff; padding:46px 52px; display:flex; flex-direction:column; gap:10px;
}
.page-banner h1 { font-size:46px; font-weight:800; line-height:1.05; }
.page-banner p { max-width:680px; opacity:.95; font-size:17px; }
.page-banner .leaf-accent { position:absolute; right:-20px; bottom:-30px; opacity:.18; width:280px; }

/* ---------- FILTERS ---------- */
.toolbar { max-width:var(--maxw); margin:30px auto 0; padding:0 32px;
  display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap; }
.search {
  display:flex; align-items:center; gap:10px; background:var(--surface);
  border:1.5px solid var(--line); border-radius:999px; padding:11px 18px; min-width:280px; flex:1; max-width:420px;
}
.search input { border:none; outline:none; font-family:inherit; font-size:15px; width:100%; background:transparent; color:var(--ink); }
.search .ico { color:var(--rose); display:flex; }
.chips { display:flex; gap:10px; flex-wrap:wrap; }
.chip {
  border:1.5px solid var(--line); background:var(--surface); color:#3a423c;
  padding:9px 16px; border-radius:999px; font-size:14px; font-weight:600; cursor:pointer;
  font-family:inherit; transition:all .15s; white-space:nowrap;
}
.chip:hover { border-color:var(--rose); }
.chip.active { background:var(--emerald); color:#fff; border-color:var(--emerald); }

.result-count { max-width:var(--maxw); margin:18px auto 0; padding:0 32px; color:var(--muted); font-size:14px; }

/* ---------- CATALOG CARDS (with actions) ---------- */
.catalog { max-width:var(--maxw); margin:18px auto 70px; padding:0 32px;
  display:grid; grid-template-columns:repeat(3,1fr); gap:26px; }
.cat-card {
  background:var(--surface); border-radius:var(--radius); overflow:hidden;
  box-shadow:var(--shadow-card); display:flex; flex-direction:column;
  transition:transform .2s, box-shadow .2s;
}
.cat-card:hover { transform:translateY(-5px); box-shadow:0 22px 46px rgba(20,40,30,.18); }
.cat-media { position:relative; aspect-ratio:4/2.6; overflow:hidden; }
.cat-media img { width:100%; height:100%; object-fit:cover; }
.cat-media .badge { font-size:11px; padding:6px 12px; }
.status-pill {
  position:absolute; bottom:14px; left:16px; z-index:2;
  background:rgba(15,70,49,.9); color:#fff; font-size:12px; font-weight:700;
  padding:6px 12px; border-radius:999px; backdrop-filter:blur(3px);
}
.cat-body { padding:22px 22px 20px; display:flex; flex-direction:column; gap:12px; flex:1; }
.cat-loc { display:inline-flex; align-items:center; gap:6px; color:var(--rose); font-size:13px; font-weight:700; letter-spacing:.3px; text-transform:uppercase; }
.cat-title { font-size:24px; font-weight:800; line-height:1.12; }
.cat-type { color:var(--muted); font-size:14.5px; margin-top:-4px; }
.dev-tag { font-size:12px; font-weight:700; color:var(--emerald); }
.feat-list { display:flex; flex-wrap:wrap; gap:7px; }
.feat {
  background:rgba(31,122,84,.08); color:var(--emerald-700);
  font-size:12.5px; font-weight:600; padding:5px 11px; border-radius:999px;
}
.cat-foot { margin-top:auto; padding-top:8px; border-top:1px solid var(--line); }
.price-row { display:flex; align-items:baseline; gap:8px; margin:12px 0 14px; }
.price-row .desde { font-size:12px; color:var(--muted); text-transform:uppercase; letter-spacing:.5px; }
.price-row .price { font-family:'Playfair Display',serif; font-size:27px; font-weight:800; color:var(--ink); }
.cat-actions { display:grid; grid-template-columns:1fr auto; gap:10px; }
.cat-actions .btn-grad { width:100%; justify-content:center; font-size:14px; padding:12px 14px; }
.cat-actions .wa-icon {
  width:46px; height:46px; flex:none; border-radius:12px; background:var(--wa); color:#fff;
  display:flex; align-items:center; justify-content:center; cursor:pointer; transition:transform .15s;
}
.cat-actions .wa-icon:hover { transform:translateY(-2px); }

/* ---------- CONTACT ---------- */
.contact-wrap { max-width:var(--maxw); margin:40px auto 60px; padding:0 32px;
  display:grid; grid-template-columns:1.1fr .9fr; gap:40px; align-items:start; }
.card-panel { background:var(--surface); border-radius:var(--radius); box-shadow:var(--shadow-card); padding:34px; }
.card-panel h2 { font-size:28px; font-weight:800; margin-bottom:6px; }
.card-panel .sub { color:var(--muted); margin-bottom:22px; }
.field { margin-bottom:16px; }
.field label { display:block; font-size:13.5px; font-weight:600; margin-bottom:6px; color:#3a423c; }
.field input, .field select, .field textarea {
  width:100%; border:1.5px solid var(--line); border-radius:12px; padding:13px 15px;
  font-family:inherit; font-size:15px; color:var(--ink); background:#fff; outline:none; transition:border-color .2s;
}
.field input:focus, .field select:focus, .field textarea:focus { border-color:var(--emerald-500); }
.field textarea { resize:vertical; min-height:110px; }
.form-actions { display:flex; gap:12px; flex-wrap:wrap; margin-top:6px; }
.form-actions .btn-wa, .form-actions .btn-outline { font-size:15px; }
.form-note { font-size:12.5px; color:var(--muted); margin-top:14px; }

.info-list { display:flex; flex-direction:column; gap:18px; }
.info-item { display:flex; gap:14px; align-items:flex-start; }
.info-item .i-icon {
  width:46px; height:46px; flex:none; border-radius:13px; background:var(--grad); color:#fff;
  display:flex; align-items:center; justify-content:center;
}
.info-item .i-label { font-size:13px; color:var(--muted); }
.info-item .i-value { font-size:16px; font-weight:700; color:var(--ink); }
.info-item a.i-value:hover { color:var(--emerald); }

/* ---------- TEAM ---------- */
.team-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:26px; max-width:900px; }
.team-card {
  background:var(--surface); border-radius:var(--radius); box-shadow:var(--shadow-card);
  padding:30px; display:flex; gap:22px; align-items:center;
}
.team-card .avatar {
  width:104px; height:104px; flex:none; border-radius:50%; overflow:hidden;
  border:3px solid var(--rose-300); box-shadow:0 6px 16px rgba(20,40,30,.15);
}
.team-card .avatar img { width:100%; height:100%; object-fit:cover; }
.team-card .t-name { font-family:'Playfair Display',serif; font-size:22px; font-weight:800; }
.team-card .t-role { color:var(--rose); font-weight:700; font-size:14px; margin:2px 0 12px; }
.team-contact { display:flex; gap:10px; }
.team-contact a {
  width:40px; height:40px; border-radius:11px; background:rgba(31,122,84,.1); color:var(--emerald);
  display:flex; align-items:center; justify-content:center; transition:all .15s;
}
.team-contact a:hover { background:var(--emerald); color:#fff; }

/* ---------- CTA STRIP ---------- */
.cta-strip { max-width:var(--maxw); margin:60px auto; padding:0 32px; }
.cta-inner {
  background:var(--grad); border-radius:26px; color:#fff; padding:44px 52px;
  display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap;
}
.cta-inner h2 { font-size:32px; font-weight:800; }
.cta-inner p { opacity:.95; margin-top:6px; }
.cta-inner .btn-glass { font-size:16px; }

/* ---------- FOOTER ---------- */
.site-footer { background:var(--footer-bg); color:var(--footer-ink); margin-top:30px; transition:background .3s; }
.footer-top { max-width:var(--maxw); margin:0 auto; padding:50px 32px 30px;
  display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:40px; }
.footer-brand img { width:120px;  margin-bottom:16px; }
.footer-brand .slogan { font-family:'Playfair Display',serif; font-style:italic; color:var(--footer-head); font-size:18px; margin-bottom:8px; }
.footer-brand p { font-size:14px; opacity:.85; max-width:320px; }
.footer-col h4 { color:var(--footer-head); font-size:15px; font-weight:700; margin-bottom:14px; letter-spacing:.3px; }
.footer-col a, .footer-col p { display:block; color:var(--footer-sub); font-size:14px; margin-bottom:9px; transition:color .2s, transform .2s; }
.footer-col a:hover { color:var(--footer-link-hover); transform:translateX(3px); }
.footer-bottom { border-top:1px solid var(--footer-border); }
.footer-bottom .container { padding-top:18px; padding-bottom:24px; display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.footer-bottom small { color:var(--footer-muted); font-size:12.5px; line-height:1.6; }
.footer-legal { max-width:760px; }

/* ---------- WHATSAPP FLOAT ---------- */
.wa-float {
  position:fixed !important; z-index:60;
  right:calc(22px + env(safe-area-inset-right, 0px));
  bottom:calc(22px + env(safe-area-inset-bottom, 0px));
  left:auto; top:auto;
  width:60px; height:60px; border-radius:50%; background:var(--wa); color:#fff;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 12px 30px rgba(37,193,96,.45); cursor:pointer;
  transition:transform .18s ease, box-shadow .18s ease;
}
.wa-float:hover { transform:scale(1.08); box-shadow:0 16px 38px rgba(37,193,96,.55); }
.wa-float svg { width:30px; height:30px; position:relative; z-index:1; }
@media (max-width:600px){
  .wa-float { width:56px; height:56px;
    right:calc(16px + env(safe-area-inset-right, 0px));
    bottom:calc(16px + env(safe-area-inset-bottom, 0px)); }
  .wa-float svg { width:28px; height:28px; }
}

/* ---------- DETALLE (página por desarrollo) ---------- */
.crumb { max-width:var(--maxw); margin:18px auto 0; padding:0 32px; font-size:13.5px; color:var(--muted); }
.crumb a { color:var(--muted); }
.crumb a:hover { color:var(--emerald); }
.crumb .sep-c { margin:0 8px; opacity:.6; }
.crumb .cur { color:var(--emerald); font-weight:600; }

.detail-cover { max-width:var(--maxw); margin:14px auto 0; padding:0 32px; }
.detail-cover-inner { position:relative; border-radius:26px; overflow:hidden; min-height:420px; box-shadow:var(--shadow); }
.detail-cover-inner > img { width:100%; height:100%; min-height:420px; object-fit:cover; position:absolute; inset:0; }
.detail-cover-inner::after { content:""; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(0,0,0,.78) 0%, rgba(0,0,0,.25) 48%, rgba(0,0,0,0) 75%); }
.detail-cover-content { position:relative; z-index:2; padding:38px 42px; display:flex; flex-direction:column; gap:8px;
  min-height:420px; justify-content:flex-end; color:#fff; }
.detail-cover-content .badge { position:static; align-self:flex-start; margin-bottom:6px; }
.detail-dev { font-weight:700; font-size:14px; opacity:.92; letter-spacing:.3px; }
.detail-cover-content h1 { font-size:48px; font-weight:800; line-height:1.05; text-shadow:0 4px 18px rgba(0,0,0,.25); }
.detail-loc { display:inline-flex; align-items:center; gap:7px; font-size:16px; font-weight:600; opacity:.96; }

.detail-wrap { max-width:var(--maxw); margin:34px auto 20px; padding:0 32px;
  display:grid; grid-template-columns:1fr 380px; gap:40px; align-items:start; }
.detail-main h2 { font-size:28px; font-weight:800; margin:6px 0 12px; }
.detail-main h3 { font-size:19px; font-weight:800; color:var(--emerald); margin:28px 0 14px; }
.detail-main p.lead { font-size:17px; color:#3a423c; line-height:1.7; }

.check-list { list-style:none; display:grid; grid-template-columns:1fr 1fr; gap:12px 22px; }
.check-list li { display:flex; align-items:flex-start; gap:10px; font-size:15.5px; font-weight:500; }
.check-list .ck { width:24px; height:24px; flex:none; border-radius:50%; background:rgba(31,122,84,.12); color:var(--emerald);
  display:flex; align-items:center; justify-content:center; margin-top:1px; }

.spec-grid { display:grid; grid-template-columns:1fr 1fr; gap:0; border:1px solid var(--line); border-radius:16px; overflow:hidden; background:var(--surface); }
.spec-item { padding:16px 18px; border-bottom:1px solid var(--line); }
.spec-item:nth-child(odd) { border-right:1px solid var(--line); }
.spec-label { font-size:12.5px; color:var(--muted); text-transform:uppercase; letter-spacing:.5px; margin-bottom:3px; }
.spec-value { font-size:15.5px; font-weight:700; color:var(--ink); }

.loc-note { background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:20px; display:flex;
  align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.loc-note .lp { display:flex; align-items:center; gap:12px; }
.loc-note .pin { width:44px; height:44px; flex:none; border-radius:12px; background:var(--grad); color:#fff; display:flex; align-items:center; justify-content:center; }

/* sidebar */
.detail-side { position:sticky; top:20px; }
.price-card { background:var(--surface); border-radius:var(--radius); box-shadow:var(--shadow-card); padding:26px; }
.price-card .pc-desde { font-size:12.5px; color:var(--muted); text-transform:uppercase; letter-spacing:.5px; }
.price-card .pc-price { font-family:'Playfair Display',serif; font-size:38px; font-weight:800; line-height:1.1; margin:2px 0 6px; }
.price-card .pc-status { display:inline-block; background:rgba(31,122,84,.1); color:var(--emerald-700);
  font-size:13px; font-weight:700; padding:6px 12px; border-radius:999px; margin-bottom:18px; }
.price-card .pc-actions { display:flex; flex-direction:column; gap:10px; }
.price-card .btn-grad, .price-card .btn-wa, .price-card .btn-outline { width:100%; justify-content:center; }
.pc-agent { margin-top:18px; padding-top:18px; border-top:1px solid var(--line); display:flex; align-items:center; gap:12px; }
.pc-agent img { width:48px; height:48px; border-radius:50%; object-fit:cover; border:2px solid var(--rose-300); }
.pc-agent .pa-label { font-size:12px; color:var(--muted); }
.pc-agent .pa-name { font-size:14.5px; font-weight:700; }

.detail-notfound { max-width:680px; margin:80px auto; padding:0 32px; text-align:center; }
.detail-notfound h1 { font-size:34px; font-weight:800; margin-bottom:10px; }
.detail-notfound p { color:var(--muted); margin-bottom:22px; }

/* ---------- RESPONSIVE ---------- */
@media (max-width:1180px){
  .grid { grid-template-columns:repeat(2,1fr); }
  .catalog { grid-template-columns:repeat(2,1fr); }
  .hero h1 { font-size:52px; }
  nav.main-nav { display:none; }
  .nav-toggle { display:flex; }
}
@media (max-width:900px){
  .contact-wrap { grid-template-columns:1fr; }
  .footer-top { grid-template-columns:1fr 1fr; }
}
@media (max-width:860px){
  .hero-img { width:100%; opacity:.32; -webkit-mask-image:none; mask-image:none; }
  .hero-text { max-width:100%; padding:42px 30px; }
  .stats { justify-content:stretch; }
  .stat-card { flex:1; }
  .team-grid { grid-template-columns:1fr; }
}
@media (max-width:600px){
  .container,.site-header { padding-left:18px; padding-right:18px; }
  .hero,.stats,.benefits,.section,.toolbar,.result-count,.catalog,.page-banner,.contact-wrap,.cta-strip { padding-left:18px; padding-right:18px; }
  .hero h1 { font-size:40px; }
  .page-banner h1 { font-size:34px; }
  .grid { grid-template-columns:1fr; }
  .catalog { grid-template-columns:1fr; }
  .footer-top { grid-template-columns:1fr; }
  .hero-text { padding:34px 22px; }
  .section-head { flex-direction:column; align-items:flex-start; }
  .cta-inner, .page-banner-inner, .hero-inner { padding:32px 26px; }
}

/* mobile nav drawer */
.mobile-menu { display:none; }
.mobile-menu.open {
  display:flex; flex-direction:column; gap:4px; background:var(--surface);
  border-top:1px solid var(--line); padding:10px 18px 16px;
}
.mobile-menu a { padding:12px 6px; font-weight:600; border-bottom:1px solid var(--line); }
.mobile-menu a:last-child { border-bottom:none; }

/* ---------- RESPONSIVE: detalle ---------- */
@media (max-width:1000px){
  .detail-wrap { grid-template-columns:1fr; }
  .detail-side { position:static; }
}
@media (max-width:600px){
  .crumb,.detail-cover,.detail-wrap { padding-left:18px; padding-right:18px; }
  .detail-cover-content { padding:28px 22px; }
  .detail-cover-content h1 { font-size:34px; }
  .check-list { grid-template-columns:1fr; }
  .spec-grid { grid-template-columns:1fr; }
  .spec-item:nth-child(odd) { border-right:none; }
}

/* enlaces a la página de detalle desde las tarjetas */
.cat-title a { color:inherit; transition:color .15s; }
.cat-title a:hover { color:var(--emerald); }
.cat-media a { display:block; width:100%; height:100%; }
.detail-link {
  display:inline-flex; align-items:center; gap:7px; align-self:flex-start;
  color:var(--emerald); font-weight:700; font-size:14px; margin:2px 0 14px;
}
.detail-link svg { transition:transform .15s; }
.detail-link:hover svg { transform:translateX(3px); }

/* ---------- GALERÍA (carrusel) ---------- */
.gallery { max-width:var(--maxw); margin:30px auto 0; padding:0 56px; position:relative; }
.gallery-viewport { overflow:hidden; }
.gallery-track { display:flex; transition:transform .6s cubic-bezier(.4,0,.2,1); }
.gallery-slide { flex:0 0 33.3333%; padding:0 8px; box-sizing:border-box; }
.gallery-slide img { width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:16px; cursor:pointer; box-shadow:var(--shadow-card); transition:transform .2s; display:block; }
.gallery-slide img:hover { transform:translateY(-3px); }
.gallery-nav { position:absolute; top:50%; transform:translateY(-50%); z-index:3; width:46px; height:46px; border-radius:50%; border:none; background:var(--surface); color:var(--emerald); box-shadow:var(--shadow-card); cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background .2s; }
.gallery-nav:hover { background:var(--emerald); color:#fff; }
.gallery-nav.prev { left:6px; } .gallery-nav.next { right:6px; }
@media (max-width:1000px){ .gallery-slide { flex-basis:50%; } }
@media (max-width:640px){ .gallery { padding:0 44px; } .gallery-slide { flex-basis:100%; } }

/* lightbox / modal */
.lightbox { position:fixed; inset:0; z-index:200; background:rgba(10,15,12,.92); display:flex; align-items:center; justify-content:center; }
.lightbox[hidden] { display:none; }
.lightbox .lb-img { max-width:90vw; max-height:85vh; border-radius:10px; box-shadow:0 20px 60px rgba(0,0,0,.5); }
.lb-close { position:absolute; top:18px; right:24px; background:none; border:none; color:#fff; font-size:40px; line-height:1; cursor:pointer; opacity:.85; }
.lb-close:hover { opacity:1; }
.lb-nav { position:absolute; top:50%; transform:translateY(-50%); width:54px; height:54px; border-radius:50%; border:none; background:rgba(255,255,255,.14); color:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background .2s; }
.lb-nav:hover { background:rgba(255,255,255,.28); }
.lb-prev { left:18px; } .lb-next { right:18px; }
@media (max-width:600px){ .lb-prev{left:8px} .lb-next{right:8px} .lb-nav{width:44px;height:44px} }

/* ============================================================
   MEJORAS: efectos, animaciones y micro-interacciones
   ============================================================ */

/* ---------- WATER WAVE: el botón se "llena" de agua al pasar el cursor ---------- */
.btn-grad, .btn-wa, .btn-glass, .btn-outline,
.cat-actions .wa-icon, .see-all .arrow, .team-contact a,
.gallery-nav, .wa-float, .chip, .info-item .i-icon, .lb-nav {
  position:relative; overflow:hidden; isolation:isolate;
}
/* capa de agua (oculta hasta el hover): sube desde abajo con la superficie ondulada.
   Por defecto agua blanca translúcida (para botones de color con texto blanco). */
.btn-grad::before, .btn-wa::before, .btn-glass::before, .btn-outline::before,
.cat-actions .wa-icon::before, .see-all .arrow::before, .team-contact a::before,
.gallery-nav::before, .wa-float::before, .chip::before,
.info-item .i-icon::before, .lb-nav::before {
  content:""; position:absolute; left:-12%; right:-12%; bottom:0;
  height:0; z-index:-1; pointer-events:none;
  background-repeat:repeat-x; background-position:left bottom; background-size:120px 100%;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='100' preserveAspectRatio='none'%3E%3Cpath d='M0 14 C 20 4 40 4 60 14 C 80 24 100 24 120 14 L120 100 L0 100 Z' fill='%23ffffff' fill-opacity='0.30'/%3E%3C/svg%3E");
  transition:height .5s cubic-bezier(.34,1.1,.4,1);
}
/* botones claros (texto oscuro): el agua es color esmeralda */
.btn-outline::before, .see-all .arrow::before, .team-contact a::before,
.gallery-nav::before, .chip::before, .info-item .i-icon::before {
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='100' preserveAspectRatio='none'%3E%3Cpath d='M0 14 C 20 4 40 4 60 14 C 80 24 100 24 120 14 L120 100 L0 100 Z' fill='%2316573d' fill-opacity='0.16'/%3E%3C/svg%3E");
}
/* botón glass (sobre el hero): agua más sutil para no tapar el texto blanco */
.btn-glass::before {
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='100' preserveAspectRatio='none'%3E%3Cpath d='M0 14 C 20 4 40 4 60 14 C 80 24 100 24 120 14 L120 100 L0 100 Z' fill='%23ffffff' fill-opacity='0.20'/%3E%3C/svg%3E");
}
/* al pasar el cursor: el agua sube y la superficie se mece de lado a lado */
.btn-grad:hover::before, .btn-wa:hover::before, .btn-glass:hover::before, .btn-outline:hover::before,
.cat-actions .wa-icon:hover::before, .see-all:hover .arrow::before, .team-contact a:hover::before,
.gallery-nav:hover::before, .wa-float:hover::before, .chip:hover::before,
.info-item:hover .i-icon::before, .lb-nav:hover::before {
  height:92%;
  animation:waveSlosh 1.1s linear infinite;
}
@keyframes waveSlosh {
  from { background-position:0 bottom; }
  to   { background-position:-120px bottom; }
}
@media (prefers-reduced-motion: reduce){
  .btn-grad::before, .btn-wa::before, .btn-glass::before, .btn-outline::before,
  .cat-actions .wa-icon::before, .see-all .arrow::before, .team-contact a::before,
  .gallery-nav::before, .wa-float::before, .chip::before,
  .info-item .i-icon::before, .lb-nav::before { transition:none; }
  .btn-grad:hover::before, .btn-wa:hover::before, .btn-glass:hover::before, .btn-outline:hover::before,
  .cat-actions .wa-icon:hover::before, .see-all:hover .arrow::before, .team-contact a:hover::before,
  .gallery-nav:hover::before, .wa-float:hover::before, .chip:hover::before,
  .info-item:hover .i-icon::before, .lb-nav:hover::before { animation:none; }
}
/* la onda circular del clic (creada por JS) */
.ripple {
  position:absolute; border-radius:50%; transform:scale(0);
  pointer-events:none; z-index:0; mix-blend-mode:screen;
  background: var(--ripple-color, rgba(255,255,255,.55));
  animation: rippleWave .66s cubic-bezier(.22,1,.36,1) forwards;
}
.btn-outline .ripple, .chip .ripple, .see-all .arrow .ripple,
.gallery-nav .ripple, .team-contact a .ripple { mix-blend-mode:normal; }
@keyframes rippleWave { to { transform:scale(2.8); opacity:0; } }

/* ---------- HEADER fijo con aparición al hacer scroll ---------- */
#site-header { position:sticky; top:0; z-index:40; transition:background .3s ease, box-shadow .3s ease; background: white !important}
.site-header { transition:padding .3s ease; }
#site-header.is-stuck { background:var(--bg); box-shadow:0 8px 30px rgba(20,40,30,.12); -webkit-backdrop-filter:saturate(1.2); backdrop-filter:saturate(1.2); }
#site-header.is-stuck .site-header { padding-top:2px; padding-bottom:2px; }
#site-header .brand img, .site-header .brand .fallback { transition:transform .3s ease; }
#site-header.is-stuck .brand img { transform:scale(.92); }

/* ---------- ANIMACIONES DE ENTRADA (scroll reveal) ---------- */
html.js-reveal .reveal {
  opacity:0; transform:translateY(28px);
  transition: opacity .7s cubic-bezier(.22,1,.36,1), transform .7s cubic-bezier(.22,1,.36,1);
  transition-delay: var(--rd, 0ms); will-change: opacity, transform;
}
html.js-reveal .reveal.in { opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){
  html.js-reveal .reveal { opacity:1 !important; transform:none !important; transition:none !important; }
}

/* ---------- HERO: degradado vivo + título con efecto máquina de escribir ---------- */
.hero-inner, .cta-inner, .page-banner-inner {
  background-size:180% 180%; animation: gradFlow 18s ease infinite;
}
@keyframes gradFlow { 0%{background-position:0% 50%} 50%{background-position:100% 50%} 100%{background-position:0% 50%} }
@media (prefers-reduced-motion: reduce){ .hero-inner, .cta-inner, .page-banner-inner { animation:none; } }

.hero-text h1 { min-height:2.12em; }      /* evita el salto mientras se escribe */
.tw-caret {
  display:inline-block; width:3px; height:.92em; margin-left:5px;
  background:currentColor; vertical-align:-1px; border-radius:2px;
  animation: caretBlink 1.05s steps(1) infinite;
}
@keyframes caretBlink { 50% { opacity:0; } }

/* ---------- TARJETAS: zoom de imagen + lift ---------- */
.card > img, .cat-media img { transition: transform .65s cubic-bezier(.22,1,.36,1); }
.card:hover > img { transform:scale(1.07); }
.cat-card:hover .cat-media img { transform:scale(1.06); }
.card { transition: transform .25s cubic-bezier(.22,1,.36,1), box-shadow .25s ease; }
.card:hover { transform:translateY(-6px); box-shadow:0 26px 50px rgba(20,40,30,.22); }
/* brillo diagonal que recorre la tarjeta al pasar el cursor */
.card::before {
  content:""; position:absolute; inset:0; z-index:3; pointer-events:none;
  background:linear-gradient(115deg, transparent 38%, rgba(255,255,255,.28) 50%, transparent 62%);
  background-size:250% 100%; background-position:150% 0; opacity:0; transition:opacity .2s;
}
.card:hover::before { opacity:1; animation: cardShine 1s ease forwards; }
@keyframes cardShine { from { background-position:150% 0; } to { background-position:-120% 0; } }

/* ---------- MICRO-INTERACCIONES ---------- */
.stat-card { transition: transform .3s cubic-bezier(.22,1,.36,1), box-shadow .3s ease; }
.stat-card:hover { transform:translateY(-5px); box-shadow:0 24px 50px rgba(20,40,30,.18); }
.stat-card:hover .stat-icon { animation: iconPop .5s ease; }
.benefit { transition: transform .25s ease; }
.benefit:hover { transform:translateY(-3px); }
.benefit:hover .b-icon { animation: iconPop .5s ease; }
@keyframes iconPop { 0%,100%{ transform:scale(1) } 45%{ transform:scale(1.14) rotate(-4deg) } }
.see-all .arrow { transition: transform .3s cubic-bezier(.22,1,.36,1); }
.see-all:hover .arrow { transform:translateX(4px); }
.info-item .i-icon { transition: transform .3s ease; }
.info-item:hover .i-icon { transform:rotate(-6deg) scale(1.06); }
.team-card { transition: transform .3s cubic-bezier(.22,1,.36,1), box-shadow .3s ease; }
.team-card:hover { transform:translateY(-5px); box-shadow:0 24px 48px rgba(20,40,30,.18); }

/* ---------- WhatsApp flotante: anillo de pulso ---------- */
.wa-float { animation: waFloatIn .55s cubic-bezier(.22,1,.36,1) backwards; }
.wa-float::after {
  content:""; position:absolute; inset:0; border-radius:50%;
  box-shadow:0 0 0 0 rgba(37,193,96,.55); animation: waPulse 2.4s ease-out infinite; z-index:-1;
}
@keyframes waPulse { 0%{ box-shadow:0 0 0 0 rgba(37,193,96,.5) } 70%{ box-shadow:0 0 0 16px rgba(37,193,96,0) } 100%{ box-shadow:0 0 0 0 rgba(37,193,96,0) } }
@keyframes waFloatIn { from { transform:scale(0) rotate(-30deg); opacity:0 } to { transform:none; opacity:1 } }

/* ---------- Sección "destacados": separador sutil entre bloques ---------- */
.section.featured-listings { margin-top:38px; }
.section .eyebrow.alt { color:var(--emerald); }

/* ---------- Menú móvil: aparición suave ---------- */
.mobile-menu.open { animation: menuDrop .28s ease; }
@keyframes menuDrop { from { opacity:0; transform:translateY(-8px) } to { opacity:1; transform:none } }
.mobile-menu a { transition: color .2s, padding-left .2s; }
.mobile-menu a:hover { color:var(--emerald); padding-left:12px; }

/* ---------- Botones del catálogo: ola también en el grad ---------- */
.cat-actions .btn-grad, .pc-actions .btn-grad, .pc-actions .btn-wa { position:relative; overflow:hidden; }

/* respeta el "reduce motion" globalmente para animaciones decorativas */
@media (prefers-reduced-motion: reduce){
  .card::before, .wa-float::after, .stat-card:hover .stat-icon,
  .benefit:hover .b-icon, .btn-grad:hover::before, .btn-wa:hover::before { animation:none !important; }
}

/* ============================================================
   AJUSTES SOLICITADOS POR CLIENTA
   1) Hero: marca "Contacto" grande + lema debajo más chico
   2) Fuentes un poco más grandes en todo el sitio (responsivo)
   Bloque agregado al final para sobrescribir los tamaños base.
   ============================================================ */

/* ---------- HERO: marca + lema ---------- */
.hero .hero-brand { margin-bottom: 6px; }

.hero .hero-marca {
  font-family: 'Playfair Display', serif;
  color: #e5b651;
  font-size: clamp(56px, 8.2vw, 96px);
  font-weight: 800;
  line-height: 1.0;
  letter-spacing: -0.5px;
  margin: 0 0 6px;
  text-shadow: 0 4px 18px rgba(0,0,0,.18);
}

.hero .hero-lema {
  font-size: clamp(20px, 2.6vw, 32px);
  font-weight: 600;
  line-height: 1.25;
  color: #fff;
  opacity: .95;
  letter-spacing: .2px;
  margin: 0;
  max-width: 30ch;
}

/* ---------- FUENTES UN POCO MÁS GRANDES ---------- */
body { font-size: 17px; }

/* Navegación */
nav.main-nav a       { font-size: 16px; }
.brand .fallback     { font-size: 32px; }

/* Hero (texto secundario y botones) */
.hero-feats          { font-size: clamp(18px, 2vw, 23px); }
.btn-glass,
.hero-buttons .btn-wa{ font-size: 18px; }

/* Stats */
.stat-big            { font-size: 29px; }
.stat-label          { font-size: 15px; }

/* Encabezados de sección */
.section-head h2     { font-size: clamp(28px, 4vw, 38px); }
.benefit .b-text     { font-size: 16.5px; }

/* Tarjetas (home y catálogo) */
.card-title          { font-size: 25px; }
.card-sub            { font-size: 15px; }
.card-price          { font-size: 25px; }
.cat-title           { font-size: 26px; }
.cat-type            { font-size: 16px; }
.price-row .price    { font-size: 29px; }
.cat-actions .btn-grad { font-size: 15.5px; }

/* Banners de página interna */
.page-banner h1      { font-size: clamp(34px, 5vw, 52px); }
.page-banner p       { font-size: 19px; }

/* Botones genéricos / formularios */
.btn-grad, .btn-wa, .btn-outline { font-size: 16px; }
.field label         { font-size: 14.5px; }
.field input, .field select, .field textarea { font-size: 16px; }
.card-panel h2       { font-size: 30px; }

/* Página de detalle */
.detail-cover-content h1 { font-size: clamp(36px, 5vw, 54px); }
.detail-loc          { font-size: 17.5px; }
.detail-main h2      { font-size: 30px; }
.detail-main h3      { font-size: 21px; }
.detail-main p.lead  { font-size: 19px; }
.check-list li       { font-size: 17px; }
.spec-value          { font-size: 17px; }
.spec-label          { font-size: 13.5px; }
.info-item .i-value  { font-size: 17.5px; }
.info-item .i-label  { font-size: 14px; }
.price-card .pc-price{ font-size: clamp(34px, 4vw, 42px); }

/* Equipo */
.team-card .t-name   { font-size: 24px; }
.team-card .t-role   { font-size: 15px; }

/* CTA y footer */
.cta-inner h2        { font-size: clamp(27px, 3.6vw, 36px); }
.footer-brand .slogan{ font-size: 20px; }
.footer-brand p      { font-size: 15px; }
.footer-col h4       { font-size: 16px; }
.footer-col a, .footer-col p { font-size: 15px; }

/* En móviles, baja un poco la base para que respire el texto */
@media (max-width: 600px) {
  body { font-size: 16px; }
}

/* ============================================================
   PLANES DE FINANCIAMIENTO + TABLA DE RENTAS (página de detalle)
   ============================================================ */
.fin-note {
  font-size: 14px; color: var(--muted); margin: 2px 0 16px;
}
.fin-grid {
  display: grid; grid-template-columns: repeat(2, 1fr);
  gap: 18px; margin-bottom: 14px;
}
.fin-plan {
  border: 1px solid var(--line); border-radius: var(--radius-sm);
  overflow: hidden; background: var(--surface); box-shadow: var(--shadow-card);
}
.fin-plan-head {
  background: var(--grad); color: #fff;
  font-weight: 700; letter-spacing: .4px; text-transform: uppercase;
  font-size: 14px; text-align: center; padding: 12px 14px;
}
.fin-table { width: 100%; border-collapse: collapse; }
.fin-table th, .fin-table td {
  padding: 11px 14px; font-size: 14px;
  border-bottom: 1px solid var(--line); text-align: left;
}
.fin-table th {
  color: var(--muted); font-weight: 600; text-transform: uppercase;
  letter-spacing: .3px; font-size: 12.5px; width: 52%;
}
.fin-table td { color: var(--ink); font-weight: 600; text-align: right; }
.fin-table tr:last-child th, .fin-table tr:last-child td { border-bottom: none; }
.fin-table tr.fin-total th, .fin-table tr.fin-total td {
  background: #f4efe7; color: var(--emerald); font-weight: 800; font-size: 15px;
}

.rentas-card {
  border: 1px solid var(--line); border-radius: var(--radius-sm);
  overflow: hidden; background: var(--surface);
  box-shadow: var(--shadow-card); max-width: 460px; margin-bottom: 6px;
}
.rentas-head {
  background: var(--grad); color: #fff; font-weight: 700;
  text-transform: uppercase; letter-spacing: .5px; font-size: 14px;
  text-align: center; padding: 12px 14px;
}
.rentas-table { width: 100%; border-collapse: collapse; }
.rentas-table th, .rentas-table td {
  padding: 9px 16px; font-size: 14px; border-bottom: 1px solid var(--line);
}
.rentas-table th { text-align: left; font-weight: 600; color: var(--ink); width: 50%; }
.rentas-table td { text-align: right; color: var(--muted); font-weight: 600; }
.rentas-table tr:nth-child(even) { background: #faf7f2; }
.rentas-table tr.rentas-total th, .rentas-table tr.rentas-total td {
  background: #f4efe7; color: var(--emerald); font-weight: 800; font-size: 15px;
  border-bottom: none;
}

@media (max-width: 640px) {
  .fin-grid { grid-template-columns: 1fr; }
}