/* ═══════════════════════════════════════════════════════════
   BIENES RAÍCES FUTURO — styles.css
   Versión: 3.0 — Documentada, responsive y optimizada
   
   PALETA DE COLORES:
   --r:  #8B1A2B (Vino/Burdeos) — Botones, badges, precios
   --r2: #6d1421 (Vino oscuro) — Hover de botones
   --az: #1E3A5F (Azul marino) — Navbar, footer, fondos oscuros
   --az2:#1A3050 (Azul secundario) — Cobertura, footer
   --d:  #C9A84C (Dorado) — Títulos, bordes, cursor
   --d2: #dfc06a (Dorado claro) — Hover dorado
   --bl: #FAFAF8 (Fondo claro) — Fondo general
   --g1: #F4F2EE (Gris claro) — Fondos de secciones
   --g2: #E8E4DC (Gris medio) — Bordes, separadores
   --tx: #1a1a1a (Texto oscuro) — Color de texto principal
   
   BREAKPOINTS:
   ≤1100px — Tablet horizontal
   ≤900px  — Tablet vertical
   ≤768px  — Móvil
   ≤480px  — Móvil pequeño
   ═══════════════════════════════════════════════════════════ */

/* ─────────────────────────────────────────
   VARIABLES GLOBALES
   ───────────────────────────────────────── */
:root {
  --r: #8B1A2B;
  --r2: #6d1421;
  --az: #1E3A5F;
  --az2: #1A3050;
  --d: #C9A84C;
  --d2: #dfc06a;
  --bl: #FAFAF8;
  --g1: #F4F2EE;
  --g2: #E8E4DC;
  --tx: #1a1a1a;
}

/* ─────────────────────────────────────────
   RESET GENERAL
   ───────────────────────────────────────── */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
html {
  scroll-behavior: smooth;
}
body {
  font-family: 'Outfit', sans-serif;
  background: var(--bl);
  color: var(--tx);
  overflow-x: hidden;
  cursor: none; /* Cursor personalizado en escritorio */
}
img {
  max-width: 100%;
  display: block;
}

/* ─────────────────────────────────────────
   CURSOR PERSONALIZADO (Dorado #C9A84C)
   Se oculta en móvil para mejor experiencia
   ───────────────────────────────────────── */
@media (max-width: 768px) {
  body { cursor: auto; }
  #cur, #cur-r { display: none; }
}
#cur {
  width: 10px;
  height: 10px;
  background: var(--d);
  border-radius: 50%;
  position: fixed;
  pointer-events: none;
  z-index: 99999;
  transform: translate(-50%, -50%);
  transition: width .2s, height .2s;
}
#cur-r {
  width: 30px;
  height: 30px;
  border: 2px solid rgba(201, 168, 76, .4);
  border-radius: 50%;
  position: fixed;
  pointer-events: none;
  z-index: 99998;
  transform: translate(-50%, -50%);
  transition: all .1s ease;
}

/* ─────────────────────────────────────────
   BARRA DE PROGRESO (Scroll)
   ───────────────────────────────────────── */
#prog {
  position: fixed;
  top: 0;
  left: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--r), var(--d));
  z-index: 9999;
  width: 0;
}

/* ═══════════════════════════════════════════════════════════
   LOADER — Pantalla de carga inicial
   ═══════════════════════════════════════════════════════════ */
#ld {
  position: fixed;
  inset: 0;
  background: var(--az);
  z-index: 9999;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 18px;
  transition: opacity .6s;
}
.ld-logo {
  width: 130px;
  border: 2px solid var(--d);
  border-radius: 10px;
  padding: 5px;
  background: rgba(0, 0, 0, .25);
  animation: bounceIn .6s ease;
}
.ld-n {
  font-family: 'Cormorant Garamond', serif;
  font-size: 22px;
  color: #fff;
  letter-spacing: 3px;
  text-align: center;
}
.ld-s {
  font-size: 10px;
  letter-spacing: 5px;
  color: rgba(255, 255, 255, .45);
  text-transform: uppercase;
}
.ld-bar {
  width: 180px;
  height: 2px;
  background: rgba(255, 255, 255, .15);
  overflow: hidden;
  border-radius: 2px;
}
.ld-fill {
  height: 100%;
  background: var(--d);
  width: 0;
  transition: width 1.8s ease;
}

/* ═══════════════════════════════════════════════════════════
   NAVBAR — Fijo superior con backdrop blur
   ═══════════════════════════════════════════════════════════ */
nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  background: rgba(30, 58, 95, .97);
  backdrop-filter: blur(16px);
  padding: 0 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 68px;
  border-bottom: 2px solid var(--d);
  transition: height .3s;
}
nav.sc {
  height: 56px;
}
.nl {
  display: flex;
  align-items: center;
  cursor: pointer;
}
.nl img {
  height: 42px;
  transition: height .3s;
}
nav.sc .nl img {
  height: 34px;
}
.nls {
  display: flex;
  gap: 2px;
  list-style: none;
}
.nls a {
  color: rgba(255, 255, 255, .65);
  text-decoration: none;
  font-size: 12.5px;
  padding: 7px 11px;
  transition: all .25s;
}
.nls a:hover {
  color: #fff;
  background: rgba(255, 255, 255, .07);
}
.nc {
  background: var(--r);
  color: #fff;
  padding: 9px 20px;
  font-size: 11.5px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  font-weight: 600;
  border: none;
  cursor: pointer;
  transition: all .3s;
  white-space: nowrap;
}
.nc:hover {
  background: var(--r2);
}

/* ─────────────────────────────────────────
   MENÚ HAMBURGUESA (Móvil)
   ───────────────────────────────────────── */
.ham {
  display: none;
  flex-direction: column;
  gap: 5px;
  cursor: pointer;
  background: none;
  border: none;
  padding: 4px;
}
.ham span {
  width: 22px;
  height: 2px;
  background: #fff;
  display: block;
}

/* ─────────────────────────────────────────
   MENÚ MÓVIL — Deslizable desde la izquierda
   ───────────────────────────────────────── */
.mm {
  position: fixed;
  inset: 0;
  z-index: 4000;
  background: var(--az);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 22px;
  transform: translateX(-100%);
  transition: transform .4s cubic-bezier(.25, .46, .45, .94);
}
.mm.open {
  transform: translateX(0);
}
.mm a {
  font-family: 'Cormorant Garamond', serif;
  font-size: 30px;
  color: #fff;
  text-decoration: none;
  transition: color .3s;
}
.mm a:hover {
  color: var(--d);
}
.mm-cl {
  position: absolute;
  top: 20px;
  right: 24px;
  background: none;
  border: none;
  color: #fff;
  font-size: 28px;
  cursor: pointer;
}

/* ═══════════════════════════════════════════════════════════
   HERO — Sección principal con efecto Ken Burns
   ═══════════════════════════════════════════════════════════ */
#hero {
  min-height: 100vh;
  background: var(--az);
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  padding: 0;
}
.hbg .g1 {
  position: absolute;
  top: -20%;
  right: -8%;
  width: 650px;
  height: 650px;
  background: radial-gradient(circle, rgba(139, 26, 43, .14) 0%, transparent 70%);
}
.hbg .g2 {
  position: absolute;
  bottom: -20%;
  left: -5%;
  width: 480px;
  height: 480px;
  background: radial-gradient(circle, rgba(201, 168, 76, .09) 0%, transparent 70%);
}
.hbg .gr {
  position: absolute;
  inset: 0;
  background-image: 
    linear-gradient(rgba(255, 255, 255, .025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .025) 1px, transparent 1px);
  background-size: 60px 60px;
}
.hi {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 110px 40px 150px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 56px;
  align-items: center;
}
.heb {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(201, 168, 76, .1);
  border: 1px solid rgba(201, 168, 76, .22);
  color: var(--d);
  font-size: 10.5px;
  letter-spacing: 3px;
  text-transform: uppercase;
  padding: 6px 14px;
  margin-bottom: 24px;
  opacity: 0;
  animation: fu .7s .4s forwards;
}
.heb::before {
  content: '';
  width: 6px;
  height: 6px;
  background: var(--d);
  border-radius: 50%;
  animation: blink 1.5s infinite;
}
h1.ht {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(38px, 5.5vw, 68px);
  font-weight: 700;
  color: #fff;
  line-height: 1.07;
  margin-bottom: 18px;
  opacity: 0;
  animation: fu .8s .55s forwards;
}
h1.ht .gd {
  color: var(--d);
  font-style: italic;
}
.hsb {
  font-size: 15px;
  color: rgba(255, 255, 255, .6);
  line-height: 1.75;
  max-width: 480px;
  margin-bottom: 32px;
  opacity: 0;
  animation: fu .7s .7s forwards;
}
.hbts {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  opacity: 0;
  animation: fu .7s .85s forwards;
}

/* ─────────────────────────────────────────
   BOTONES PRINCIPALES
   ───────────────────────────────────────── */
.btn-r {
  background: var(--r);
  color: #fff;
  padding: 14px 34px;
  font-size: 12.5px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  font-weight: 600;
  border: none;
  cursor: pointer;
  transition: all .25s cubic-bezier(.25, .46, .45, .94);
}
.btn-r:hover {
  transform: translateY(-2px) scale(1.02);
  box-shadow: 0 12px 32px rgba(139, 26, 43, .35);
}
.btn-r:active {
  transform: translateY(0) scale(.98);
}
.btn-o {
  background: transparent;
  color: #fff;
  padding: 14px 34px;
  font-size: 12.5px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  font-weight: 500;
  border: 1.5px solid rgba(255, 255, 255, .28);
  cursor: pointer;
  transition: all .3s;
}
.btn-o:hover {
  border-color: var(--d);
  color: var(--d);
}

/* ─────────────────────────────────────────
   ESTADÍSTICAS DEL HERO
   ───────────────────────────────────────── */
.hst {
  display: flex;
  gap: 28px;
  margin-top: 36px;
  padding-top: 28px;
  border-top: 1px solid rgba(255, 255, 255, .1);
  opacity: 0;
  animation: fu .7s 1s forwards;
  flex-wrap: wrap;
}
.hst-i .n {
  font-family: 'Cormorant Garamond', serif;
  font-size: 34px;
  font-weight: 700;
  color: var(--d);
  line-height: 1;
}
.hst-i .l {
  font-size: 11.5px;
  color: rgba(255, 255, 255, .45);
  margin-top: 3px;
}

/* ─────────────────────────────────────────
   TARJETAS FLOTANTES DEL HERO
   ───────────────────────────────────────── */
.hfc {
  position: relative;
  height: 460px;
  opacity: 0;
  animation: fu .8s .6s forwards;
}
.pfc {
  position: absolute;
  background: #fff;
  overflow: hidden;
  box-shadow: 0 18px 55px rgba(0, 0, 0, .28);
  border-top: 3px solid var(--r);
}
.pfc:nth-child(1) { width: 250px; top: 0; right: 30px; animation: fl1 6s ease-in-out infinite; }
.pfc:nth-child(2) { width: 215px; bottom: 50px; right: 0; animation: fl2 7s ease-in-out infinite; }
.pfc:nth-child(3) { width: 200px; top: 170px; left: 0; animation: fl3 5s ease-in-out infinite; }
.pfi {
  height: 130px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 52px;
}
.pfi.a { background: linear-gradient(135deg, #e8f0fc, #cddaf5); }
.pfi.b { background: linear-gradient(135deg, #fce8e8, #f5cdcd); }
.pfi.c { background: linear-gradient(135deg, #e8f4ec, #cdefd8); }
.pfb { padding: 12px 14px; }
.pfp {
  font-family: 'Cormorant Garamond', serif;
  font-size: 19px;
  font-weight: 700;
  color: var(--az);
}
.pfn { font-size: 12px; font-weight: 500; margin: 2px 0; }
.pfl { font-size: 10.5px; color: #aaa; }
.pfbdg {
  display: inline-block;
  color: #fff;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  padding: 3px 8px;
  margin-bottom: 5px;
}
.bdg-v { background: var(--r); }
.bdg-r { background: var(--az); }
.bdg-n { background: #2e7d32; }

/* ═══════════════════════════════════════════════════════════
   BARRA DE BÚSQUEDA
   ═══════════════════════════════════════════════════════════ */
.hs-wrap {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 92%;
  max-width: 920px;
  z-index: 3;
}
.hs {
  background: #fff;
  border-top: 3px solid var(--r);
  display: flex;
  align-items: stretch;
  box-shadow: 0 -6px 36px rgba(0, 0, 0, .12);
}
.hs input {
  flex: 1;
  padding: 16px 18px;
  border: none;
  border-right: 1px solid var(--g2);
  font-family: 'Outfit', sans-serif;
  font-size: 14px;
  outline: none;
  min-width: 0;
}
.hs input::placeholder { color: #bbb; }
.hs select {
  padding: 16px 18px;
  background: #fff;
  border: none;
  border-right: 1px solid var(--g2);
  font-family: 'Outfit', sans-serif;
  font-size: 14px;
  outline: none;
  cursor: pointer;
  min-width: 130px;
  appearance: none;
}
.hs button {
  background: var(--r);
  color: #fff;
  border: none;
  padding: 16px 28px;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  cursor: pointer;
  white-space: nowrap;
  transition: background .3s;
}
.hs button:hover { background: var(--r2); }

/* ═══════════════════════════════════════════════════════════
   TICKER — Barra de texto deslizante
   ═══════════════════════════════════════════════════════════ */
.tkb {
  background: var(--r);
  padding: 11px 0;
  overflow: hidden;
}
.tki {
  display: flex;
  white-space: nowrap;
  animation: tick 38s linear infinite;
}
.tkitem {
  display: inline-flex;
  align-items: center;
  gap: 18px;
  padding: 0 36px;
  font-size: 12.5px;
  font-weight: 600;
  color: #fff;
}
.tksep {
  width: 5px;
  height: 5px;
  background: rgba(255, 255, 255, .45);
  border-radius: 50%;
  display: inline-block;
}

/* ═══════════════════════════════════════════════════════════
   SECCIONES GENERALES
   ═══════════════════════════════════════════════════════════ */
section {
  padding: 110px 40px 100px;
}
.sl {
  font-size: 10.5px;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: var(--r);
  font-weight: 600;
  margin-bottom: 10px;
}
.sl-d { color: var(--d); }
.st {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(26px, 4vw, 46px);
  font-weight: 700;
  line-height: 1.1;
  margin-bottom: 14px;
}
.st-w { color: #fff; }
.st-d { color: var(--az); }
.ss {
  font-size: 14.5px;
  color: #555;
  line-height: 1.8;
  max-width: 520px;
}
.sh {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 44px;
  flex-wrap: wrap;
  gap: 18px;
}

/* ═══════════════════════════════════════════════════════════
   DASHBOARD — Métricas y gráfica de barras
   ═══════════════════════════════════════════════════════════ */
#dashboard {
  background: var(--az);
  padding: 88px 40px;
}
.dsh-hd {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 36px;
  flex-wrap: wrap;
  gap: 16px;
}
.live-b {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 11px;
  color: #4caf50;
  font-weight: 600;
}
.live-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #4caf50;
  animation: blink 1.5s infinite;
}
.dsh-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  margin-bottom: 24px;
}
.dc {
  background: rgba(255, 255, 255, .06);
  border: 1px solid rgba(255, 255, 255, .1);
  padding: 26px;
  cursor: pointer;
  transition: all .35s;
  position: relative;
  overflow: hidden;
}
.dc::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--d);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .4s;
}
.dc:hover {
  background: rgba(255, 255, 255, .1);
  transform: translateY(-4px);
}
.dc:hover::before { transform: scaleX(1); }
.dc .ico { font-size: 26px; margin-bottom: 14px; }
.dc .num {
  font-family: 'Cormorant Garamond', serif;
  font-size: 38px;
  font-weight: 700;
  color: var(--d);
  line-height: 1;
}
.dc .lbl {
  font-size: 11px;
  letter-spacing: .5px;
  color: rgba(255, 255, 255, .45);
  text-transform: uppercase;
  margin-top: 4px;
}
.dc .dlt { font-size: 11.5px; margin-top: 10px; }
.up { color: #4caf50; }
.dn { color: #e05555; }

/* ─────────────────────────────────────────
   GRÁFICA DE BARRAS (3 años)
   ───────────────────────────────────────── */
.dcc {
  background: rgba(255, 255, 255, .06);
  border: 1px solid rgba(255, 255, 255, .1);
  padding: 28px;
  overflow-x: auto;
}
.dcc h3 {
  font-size: 11px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .4);
  margin-bottom: 24px;
}
.bchart-wrap {
  min-height: 160px;
  height: auto;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  overflow: hidden;
}
.bc-col {
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
}
.bc-bar-group {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 4px;
  width: 100%;
  height: 160px;
}
.bc-bar {
  width: 10px;
  min-width: 8px;
  max-width: 14px;
  border-radius: 3px 3px 0 0;
  cursor: pointer;
  transform-origin: bottom;
  animation: growUp .6s ease forwards;
  background: var(--g2);
}
.bc-bar-2024 { background: rgba(201, 168, 76, .45) !important; }
.bc-bar-2025 { background: var(--d) !important; }
.bc-bar-2026 { background: var(--r) !important; }
.bc-bar.hi { opacity: 1 !important; box-shadow: 0 0 8px currentColor; }
.bc-bar::after {
  content: attr(data-v);
  position: absolute;
  top: -22px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--az);
  color: #fff;
  font-size: 8px;
  font-weight: 600;
  padding: 2px 5px;
  border-radius: 3px;
  white-space: nowrap;
  opacity: 0;
  transition: opacity .2s;
  pointer-events: none;
}
.bc-bar:hover::after { opacity: 1; }
.bc-lbl {
  font-size: 10px;
  font-weight: 600;
  color: rgba(255, 255, 255, .6);
  margin-top: 4px;
}

/* ═══════════════════════════════════════════════════════════
   CATÁLOGO DE PROPIEDADES
   ═══════════════════════════════════════════════════════════ */
#propiedades { background: var(--g1); }
.ftabs {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
  margin-bottom: 28px;
}
.ft {
  padding: 8px 20px;
  background: none;
  border: 1.5px solid var(--g2);
  color: #555;
  font-family: 'Outfit', sans-serif;
  font-size: 12.5px;
  cursor: pointer;
  transition: all .3s;
  font-weight: 500;
}
.ft.on {
  background: var(--az);
  border-color: var(--az);
  color: #fff;
  font-weight: 600;
}
.ft:hover:not(.on) {
  border-color: var(--az);
  color: var(--az);
}
.btn-filtros-av {
  background: none;
  border: 1.5px solid var(--r);
  color: var(--r);
  font-size: 12px;
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 9px 20px;
  cursor: pointer;
  font-weight: 600;
  transition: all .3s;
  align-self: flex-end;
}
.btn-filtros-av:hover {
  background: var(--r);
  color: #fff;
}
.advp {
  background: #fff;
  border: 1px solid var(--g2);
  border-left: 3px solid var(--r);
  padding: 26px;
  margin-bottom: 24px;
  display: none;
}
.advp.open { display: block; }
.advg {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}
.af label {
  font-size: 10.5px;
  color: #777;
  text-transform: uppercase;
  letter-spacing: 1px;
  display: block;
  margin-bottom: 5px;
}
.af select, .af input {
  width: 100%;
  padding: 9px 13px;
  border: 1px solid var(--g2);
  font-family: 'Outfit', sans-serif;
  font-size: 13px;
  outline: none;
  transition: border-color .3s;
}
.af select:focus { border-color: var(--az); }
.rng label {
  display: flex;
  justify-content: space-between;
  font-size: 11.5px;
  color: #777;
  margin-bottom: 5px;
}
input[type=range] {
  width: 100%;
  accent-color: var(--r);
}
.pbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
  flex-wrap: wrap;
  gap: 10px;
}
.pcnt { font-size: 13.5px; color: #555; }
.vtgl { display: flex; gap: 7px; }
.vb {
  background: none;
  border: 1.5px solid var(--g2);
  color: #999;
  padding: 6px 12px;
  cursor: pointer;
  transition: all .3s;
  font-size: 15px;
}
.vb.on {
  background: var(--az);
  border-color: var(--az);
  color: #fff;
}

/* ─────────────────────────────────────────
   TARJETAS DE PROPIEDAD
   ───────────────────────────────────────── */
.pgrid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 26px;
}
.pgrid.lv { grid-template-columns: 1fr; }
.pc {
  background: #fff;
  overflow: hidden;
  border: 1px solid var(--g2);
  border-radius: 8px;
  transition: transform .35s cubic-bezier(.25, .46, .45, .94), box-shadow .35s;
  cursor: pointer;
  position: relative;
}
.pc:hover {
  transform: translateY(-6px);
  box-shadow: 0 24px 56px rgba(30, 58, 95, .10);
}
.pci {
  position: relative;
  overflow: hidden;
  height: 205px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.pci-ph {
  font-size: 64px;
  transition: transform .5s;
}
.pc:hover .pci-ph { transform: scale(1.06); }
.pbdg {
  position: absolute;
  top: 12px;
  left: 12px;
  padding: 4px 11px;
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: #fff;
}
.bv { background: var(--r); }
.br { background: var(--az); }
.bn { background: #2e7d32; }
.pfav {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .92);
  border: none;
  font-size: 15px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all .3s;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .12);
}
.pfav:hover, .pfav.on { transform: scale(1.15); }
.asr-rib {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(30, 58, 95, .85);
  backdrop-filter: blur(4px);
  padding: 6px 12px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.asr-av {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
}
.asr-av img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top;
}
.asr-nm { font-size: 11px; color: rgba(255, 255, 255, .85); }
.pcb { padding: 20px; }
.pcp {
  font-family: 'Cormorant Garamond', serif;
  font-size: 24px;
  font-weight: 700;
  color: var(--r);
}
.pcn { font-size: 14px; font-weight: 600; color: var(--az); margin: 5px 0 4px; }
.pcl { font-size: 11.5px; color: #888; }
.pcsp {
  display: flex;
  gap: 14px;
  margin: 12px 0;
  padding: 12px 0;
  border-top: 1px solid var(--g2);
  border-bottom: 1px solid var(--g2);
  flex-wrap: wrap;
}
.pcs {
  font-size: 11.5px;
  color: #666;
  display: flex;
  align-items: center;
  gap: 5px;
}
.pcs strong { color: var(--az); }
.pcft {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 12px;
  gap: 8px;
  flex-wrap: wrap;
}
.btn-det {
  background: none;
  border: 1.5px solid var(--r);
  color: var(--r);
  font-size: 11px;
  letter-spacing: 1px;
  text-transform: uppercase;
  font-weight: 600;
  padding: 7px 15px;
  cursor: pointer;
  transition: all .25s cubic-bezier(.25, .46, .45, .94);
  white-space: nowrap;
}
.btn-det:hover { background: var(--r); color: #fff; }
.btn-det:active { transform: scale(.96); }
.btn-pdf {
  background: none;
  border: 1.5px solid var(--d);
  color: #8a6e2a;
  font-size: 11px;
  letter-spacing: .8px;
  text-transform: uppercase;
  font-weight: 600;
  padding: 7px 15px;
  cursor: pointer;
  transition: all .3s;
  white-space: nowrap;
}
.btn-pdf:hover { background: var(--d); color: var(--az); }
.pgrid.lv .pc { display: flex; }
.pgrid.lv .pci { width: 240px; height: auto; flex-shrink: 0; }
.pgrid.lv .pcb { flex: 1; display: flex; flex-direction: column; justify-content: center; }

/* ═══════════════════════════════════════════════════════════
   PROPIEDAD DESTACADA
   ═══════════════════════════════════════════════════════════ */
#dest { background: var(--az); padding: 0; overflow: hidden; }
.dest-w { display: grid; grid-template-columns: 1fr 1fr; min-height: 540px; }
.dest-img {
  background: linear-gradient(135deg, #152840, #1e3a5f);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 110px;
  position: relative;
}
.dest-img::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent 55%, var(--az) 100%);
}
.dest-tag {
  position: absolute;
  top: 32px;
  left: 32px;
  z-index: 2;
  background: var(--d);
  color: var(--az);
  padding: 10px 24px;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  border-radius: 4px;
}
.dest-c { padding: 60px 56px; display: flex; flex-direction: column; justify-content: center; }
.dest-pr { font-family: 'Cormorant Garamond', serif; font-size: 40px; color: #fff; font-weight: 700; }
.dest-nm { font-family: 'Cormorant Garamond', serif; font-size: 28px; color: #fff; font-weight: 600; margin: 8px 0; line-height: 1.2; }
.dest-loc { font-size: 13px; color: rgba(255, 255, 255, .5); margin-bottom: 16px; }
.dest-desc { font-size: 13.5px; color: rgba(255, 255, 255, .6); line-height: 1.8; margin-bottom: 24px; }
.dest-sp { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-bottom: 24px; }
.ds { border-left: 2px solid var(--d); padding-left: 12px; }
.ds .dn { font-family: 'Cormorant Garamond', serif; font-size: 26px; color: #fff; }
.ds .dl { font-size: 10px; color: rgba(255, 255, 255, .45); text-transform: uppercase; letter-spacing: 1px; }
.dest-asr {
  display: flex;
  align-items: center;
  gap: 12px;
  background: rgba(255, 255, 255, .07);
  padding: 14px 18px;
  margin-bottom: 22px;
  border-left: 3px solid var(--d);
}
.dest-asr .av { width: 44px; height: 44px; border-radius: 50%; overflow: hidden; flex-shrink: 0; border: 2px solid var(--d); }
.dest-asr .av img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
.dest-asr .nm { font-size: 13px; color: #fff; font-weight: 600; }
.dest-asr .rl { font-size: 11px; color: rgba(255, 255, 255, .5); }
.dest-btns { display: flex; gap: 11px; flex-wrap: wrap; }
.btn-d {
  background: var(--d);
  color: var(--az);
  padding: 14px 30px;
  font-size: 12px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  font-weight: 700;
  border: none;
  cursor: pointer;
  transition: all .3s;
}
.btn-d:hover { background: var(--d2); transform: translateY(-1px); }
.btn-pdf-w {
  background: none;
  border: 1.5px solid rgba(201, 168, 76, .5);
  color: var(--d);
  padding: 14px 20px;
  font-size: 11.5px;
  letter-spacing: 1px;
  text-transform: uppercase;
  font-weight: 600;
  cursor: pointer;
  transition: all .3s;
}
.btn-pdf-w:hover { background: rgba(201, 168, 76, .1); }

/* ═══════════════════════════════════════════════════════════
   PÁGINA VENDE
   ═══════════════════════════════════════════════════════════ */
#vende { background: #fff; }
.vende-w { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.vsteps { display: flex; flex-direction: column; gap: 24px; margin-top: 28px; }
.vs { display: flex; gap: 18px; align-items: flex-start; }
.vs-n {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: var(--r);
  color: #fff;
  font-family: 'Cormorant Garamond', serif;
  font-size: 19px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.vs-t h4 { font-size: 15px; font-weight: 600; color: var(--az); margin-bottom: 3px; }
.vs-t p { font-size: 13.5px; color: #666; line-height: 1.6; }
.vcard {
  background: var(--az);
  color: #fff;
  padding: 44px;
  position: relative;
  overflow: hidden;
}
.vcard::before {
  content: '';
  position: absolute;
  top: -40px;
  right: -40px;
  width: 190px;
  height: 190px;
  border: 38px solid rgba(201, 168, 76, .08);
  border-radius: 50%;
}
.vcard h3 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 28px;
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 14px;
}
.vcard h3 span { color: var(--d); font-style: italic; }
.vcard p { font-size: 13.5px; color: rgba(255, 255, 255, .6); line-height: 1.75; margin-bottom: 22px; }
.vben { display: flex; flex-direction: column; gap: 9px; margin-bottom: 28px; }
.vb2 { display: flex; align-items: center; gap: 11px; font-size: 13.5px; color: rgba(255, 255, 255, .8); }
.vb2::before {
  content: '✓';
  width: 19px;
  height: 19px;
  background: var(--d);
  color: var(--az);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 700;
  flex-shrink: 0;
}

/* ═══════════════════════════════════════════════════════════
   CTA — Llamado a la acción
   ═══════════════════════════════════════════════════════════ */
.ctab {
  background: var(--r);
  padding: 56px 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  flex-wrap: wrap;
}
.ctab h2 { font-family: 'Cormorant Garamond', serif; font-size: 30px; color: #fff; font-weight: 700; line-height: 1.2; }
.ctab h2 span { color: var(--d); font-style: italic; }
.ctab p { font-size: 13.5px; color: rgba(255, 255, 255, .65); margin-top: 5px; }
.btn-w {
  background: #fff;
  color: var(--r);
  padding: 14px 34px;
  font-size: 12.5px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  font-weight: 700;
  border: none;
  cursor: pointer;
  transition: all .3s;
  white-space: nowrap;
}
.btn-w:hover { background: var(--g1); transform: translateY(-2px); }

/* ═══════════════════════════════════════════════════════════
   EQUIPO — Directiva y Agentes
   ═══════════════════════════════════════════════════════════ */
#equipo { background: var(--g1); }
.eq-intro { max-width: 640px; margin-bottom: 44px; }
.dir-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 20px;
  color: var(--az);
  margin-bottom: 24px;
  padding-bottom: 12px;
  border-bottom: 2px solid var(--g2);
}
.dir-title span { color: var(--r); }
.dir-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-bottom: 44px; }
.tc {
  background: #fff;
  overflow: hidden;
  border: 1px solid var(--g2);
  transition: transform .35s, box-shadow .35s;
  cursor: pointer;
}
.tc:hover { transform: translateY(-5px); box-shadow: 0 16px 44px rgba(30, 58, 95, .11); }
.tc.ceo { grid-column: span 2; display: flex; }
.tc-av { overflow: hidden; }
.tc-avi { width: 100%; height: 200px; overflow: hidden; }
.tc-avi img { width: 100%; height: 100%; object-fit: cover; object-position: center 25%; transition: transform .5s; }
.tc:hover .tc-avi img { transform: scale(1.04); }
.tc.ceo .tc-av { width: 240px; flex-shrink: 0; }
.tc.ceo .tc-avi { height: 100%; }
.tc-b { padding: 22px; }
.tc.ceo .tc-b { flex: 1; display: flex; flex-direction: column; justify-content: center; padding: 28px; }
.tc-rl { font-size: 9.5px; font-weight: 700; letter-spacing: 2.5px; text-transform: uppercase; color: var(--r); margin-bottom: 5px; }
.tc-nm { font-family: 'Cormorant Garamond', serif; font-size: 19px; font-weight: 700; color: var(--az); line-height: 1.1; margin-bottom: 6px; }
.tc.ceo .tc-nm { font-size: 24px; }
.tc-qt { font-size: 12.5px; color: var(--r); font-style: italic; margin-bottom: 6px; font-weight: 500; }
.tc-desc { font-size: 12px; color: #666; line-height: 1.6; margin-bottom: 12px; }
.tc-email { font-size: 10.5px; color: var(--az); font-weight: 500; margin-bottom: 12px; word-break: break-all; }
.tc-ctc { display: flex; gap: 8px; }
.tc-ico {
  width: 30px;
  height: 30px;
  border: 1.5px solid var(--g2);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  color: #888;
  cursor: pointer;
  transition: all .3s;
}
.tc-ico:hover { border-color: var(--r); color: var(--r); }
.ag-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 20px;
  color: var(--az);
  margin: 44px 0 24px;
  padding-top: 12px;
  border-top: 2px solid var(--g2);
}
.ag-title span { color: var(--r); }
.ag-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 18px; }
.agc {
  background: #fff;
  border: 1px solid var(--g2);
  transition: all .35s;
  cursor: pointer;
  overflow: hidden;
  position: relative;
}
.agc:hover { border-color: var(--r); box-shadow: 0 10px 32px rgba(139, 26, 43, .1); transform: translateY(-4px); }
.agc.lucky { background: linear-gradient(135deg, #fff9ee, #fff3d4); border-color: var(--d) !important; }
.agc-top { padding: 22px 18px 16px; text-align: center; border-bottom: 1px solid var(--g2); }
.agc-av {
  width: 70px;
  height: 70px;
  border-radius: 50%;
  margin: 0 auto 12px;
  overflow: hidden;
  border: 3px solid var(--d);
  box-shadow: 0 4px 14px rgba(0, 0, 0, .12);
}
.agc-av img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
.agc-nm { font-size: 14px; font-weight: 600; color: var(--az); }
.agc-rl { font-size: 10px; color: #aaa; letter-spacing: 1px; text-transform: uppercase; margin: 2px 0 10px; }
.stars { display: flex; justify-content: center; gap: 2px; margin-bottom: 6px; }
.star { font-size: 13px; color: #ddd; }
.star.on { color: var(--d); }
.agc-rat { font-size: 11px; color: #888; margin-bottom: 6px; }
.agc-ventas {
  display: inline-block;
  background: var(--r);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 20px;
}
.agc-body { padding: 14px 18px; }
.agc-qt { font-size: 12px; color: var(--r); font-style: italic; font-weight: 500; margin-bottom: 5px; }
.agc-desc { font-size: 11.5px; color: #666; line-height: 1.6; margin-bottom: 8px; }
.agc-email { font-size: 10.5px; color: var(--az); font-weight: 500; word-break: break-all; margin-bottom: 10px; }
.agc-btns { display: flex; gap: 8px; }
.agc-btn {
  flex: 1;
  padding: 9px;
  background: none;
  border: 1.5px solid var(--g2);
  font-family: 'Outfit', sans-serif;
  font-size: 11px;
  letter-spacing: .5px;
  text-transform: uppercase;
  font-weight: 600;
  cursor: pointer;
  transition: all .3s;
}
.agc-btn.r { border-color: var(--r); color: var(--r); }
.agc-btn.r:hover { background: var(--r); color: #fff; }
.agc-btn:hover { border-color: var(--az); color: var(--az); }
.rev-btn {
  position: absolute;
  top: 10px;
  right: 10px;
  background: rgba(30, 58, 95, .08);
  border: none;
  font-size: 10px;
  color: var(--az);
  padding: 4px 8px;
  cursor: pointer;
  font-family: 'Outfit', sans-serif;
  font-weight: 600;
  transition: all .3s;
}
.rev-btn:hover { background: var(--az); color: #fff; }

/* ═══════════════════════════════════════════════════════════
   CORREOS CORPORATIVOS
   ═══════════════════════════════════════════════════════════ */
#correos { background: var(--az); padding: 80px 40px; }
.corr-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; margin-top: 32px; }
.corr-c {
  background: rgba(255, 255, 255, .06);
  border: 1px solid rgba(255, 255, 255, .1);
  padding: 18px;
  transition: all .3s;
  cursor: pointer;
}
.corr-c:hover { background: rgba(255, 255, 255, .12); border-color: var(--d); transform: translateY(-3px); }
.corr-av { width: 42px; height: 42px; border-radius: 50%; overflow: hidden; margin-bottom: 10px; }
.corr-av img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
.corr-nm { font-size: 12.5px; font-weight: 600; color: #fff; }
.corr-rl { font-size: 10px; color: rgba(255, 255, 255, .4); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 7px; }
.corr-email { font-size: 10px; color: var(--d); word-break: break-all; font-weight: 500; }
.corr-copy { font-size: 10px; color: rgba(255, 255, 255, .3); margin-top: 4px; }

/* ═══════════════════════════════════════════════════════════
   COBERTURA — Mapa y zonas
   ═══════════════════════════════════════════════════════════ */
#cobertura { background: var(--az2); padding: 88px 40px; }
.cob-w { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
.zona {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 0;
  border-bottom: 1px solid rgba(255, 255, 255, .08);
  cursor: pointer;
  transition: all .3s;
}
.zona:hover { padding-left: 8px; }
.zona:last-child { border-bottom: none; }
.zona-dot { width: 9px; height: 9px; border-radius: 50%; flex-shrink: 0; }
.zona-nm { font-size: 14px; color: rgba(255, 255, 255, .75); font-weight: 500; }
.zona-ct {
  margin-left: auto;
  background: rgba(255, 255, 255, .08);
  color: rgba(255, 255, 255, .5);
  font-size: 10.5px;
  padding: 3px 9px;
  border-radius: 20px;
}
.cob-map { height: 380px; background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .1); overflow: hidden; }
.cob-map svg { width: 100%; height: 100%; }

/* ═══════════════════════════════════════════════════════════
   TESTIMONIOS — Carrusel
   ═══════════════════════════════════════════════════════════ */
#testimonios { background: #fff; overflow: hidden; }
.tt-wrap { overflow: hidden; margin-top: 44px; }
.tt-track {
  display: flex;
  gap: 22px;
  transition: transform .55s cubic-bezier(.25, .46, .45, .94);
}
.tcard {
  min-width: calc(33.33% - 15px);
  background: var(--g1);
  padding: 32px;
  border: 1px solid var(--g2);
  border-top: 3px solid var(--r);
  position: relative;
}
.tcard .qs { position: absolute; top: 8px; left: 20px; font-family: 'Cormorant Garamond', serif; font-size: 56px; color: var(--r); opacity: .15; line-height: 1; }
.tstars { color: var(--d); font-size: 13.5px; letter-spacing: 1.5px; margin-bottom: 14px; }
.ttxt { font-size: 13.5px; line-height: 1.8; color: #555; font-style: italic; margin-bottom: 22px; padding-left: 16px; }
.tauth { display: flex; align-items: center; gap: 11px; }
.tav { width: 38px; height: 38px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 700; color: #fff; flex-shrink: 0; }
.tnm { font-size: 13.5px; font-weight: 600; color: var(--az); }
.tsub { font-size: 11.5px; color: #999; }
.tctrl { display: flex; gap: 10px; justify-content: center; margin-top: 28px; align-items: center; }
.tbtn {
  background: none;
  border: 1.5px solid var(--g2);
  color: #999;
  width: 42px;
  height: 42px;
  font-size: 17px;
  cursor: pointer;
  transition: all .3s;
  display: flex;
  align-items: center;
  justify-content: center;
}
.tbtn:hover { border-color: var(--r); color: var(--r); }
.tdots { display: flex; gap: 7px; }
.tdot { width: 7px; height: 7px; border-radius: 50%; background: var(--g2); cursor: pointer; transition: all .3s; }
.tdot.on { background: var(--r); width: 22px; border-radius: 4px; }

/* ═══════════════════════════════════════════════════════════
   CONTACTO — Formulario y datos
   ═══════════════════════════════════════════════════════════ */
#contacto { background: var(--g1); }
.cont-w { display: grid; grid-template-columns: 1fr 1fr; gap: 52px; }
.ci-lst { display: flex; flex-direction: column; gap: 14px; }
.ci { display: flex; gap: 14px; align-items: flex-start; }
.ci-ico {
  width: 38px;
  height: 38px;
  background: var(--r);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 17px;
  flex-shrink: 0;
}
.ci-t strong { display: block; font-size: 12.5px; color: var(--az); font-weight: 600; }
.ci-t span { font-size: 13px; color: #666; }
.hrs { margin-top: 22px; background: #fff; padding: 18px; border-left: 3px solid var(--d); }
.hrs p { font-size: 13px; color: #555; line-height: 1.6; }
.hrs strong { color: var(--az); }
.cform { background: #fff; padding: 36px; border-top: 3px solid var(--r); }
.cform h3 { font-family: 'Cormorant Garamond', serif; font-size: 22px; color: var(--az); margin-bottom: 22px; }
.fg { margin-bottom: 14px; }
.fg label {
  display: block;
  font-size: 10.5px;
  color: #888;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 5px;
  font-weight: 600;
}
.fg input, .fg textarea, .fg select {
  width: 100%;
  padding: 11px 14px;
  border: 1.5px solid var(--g2);
  font-family: 'Outfit', sans-serif;
  font-size: 13.5px;
  color: var(--tx);
  outline: none;
  transition: border-color .3s;
  background: #fff;
}
.fg input:focus, .fg textarea:focus, .fg select:focus { border-color: var(--r); }
.fg textarea { height: 96px; resize: none; }
.fgr { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.sbmt {
  width: 100%;
  background: var(--r);
  color: #fff;
  padding: 15px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  border: none;
  cursor: pointer;
  transition: all .3s;
  margin-top: 6px;
}
.sbmt:hover { background: var(--r2); transform: translateY(-1px); }

/* ═══════════════════════════════════════════════════════════
   FOOTER
   ═══════════════════════════════════════════════════════════ */
footer { background: var(--az2); color: #fff; padding: 64px 40px 32px; }
.foot-t { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 44px; margin-bottom: 44px; }
.fb-brd .lw { display: flex; align-items: center; margin-bottom: 14px; }
.fb-brd .li { height: 44px; }
.fb-brd p { font-size: 12.5px; color: rgba(255, 255, 255, .45); line-height: 1.7; max-width: 270px; }
.fb-lnk h5 {
  font-size: 9.5px;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--d);
  margin-bottom: 16px;
  font-weight: 600;
}
.fb-lnk ul { list-style: none; display: flex; flex-direction: column; gap: 9px; }
.fb-lnk a { font-size: 12.5px; color: rgba(255, 255, 255, .45); text-decoration: none; transition: color .3s; cursor: pointer; }
.fb-lnk a:hover { color: #fff; }
.socs { display: flex; gap: 9px; margin-top: 18px; }
.soc {
  width: 32px;
  height: 32px;
  border: 1px solid rgba(255, 255, 255, .13);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  color: rgba(255, 255, 255, .35);
  cursor: pointer;
  transition: all .3s;
}
.soc:hover { border-color: var(--d); color: var(--d); }
.foot-b {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 24px;
  border-top: 1px solid rgba(255, 255, 255, .08);
  font-size: 11.5px;
  color: rgba(255, 255, 255, .25);
  flex-wrap: wrap;
  gap: 10px;
}

/* ═══════════════════════════════════════════════════════════
   MODALES — Sistema de ventanas emergentes
   ═══════════════════════════════════════════════════════════ */
.mov {
  position: fixed;
  inset: 0;
  background: rgba(10, 15, 30, .9);
  z-index: 5000;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity .35s;
  backdrop-filter: blur(6px);
}
.mov.open { opacity: 1; pointer-events: all; }
.modal {
  background: #fff;
  width: 90%;
  max-width: 980px;
  max-height: 90vh;
  overflow-y: auto;
  transform: scale(.96) translateY(14px);
  transition: transform .35s;
}
.mov.open .modal { transform: scale(1) translateY(0); }
.mh {
  padding: 24px 32px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: var(--az);
  gap: 16px;
  flex-wrap: wrap;
}
.mh-l h2 { font-family: 'Cormorant Garamond', serif; font-size: 22px; color: #fff; font-weight: 700; }
.mh-l .mp { font-family: 'Cormorant Garamond', serif; font-size: 20px; color: var(--d); }
.mh-r { display: flex; align-items: center; gap: 10px; }
.mcl { background: none; border: none; color: rgba(255, 255, 255, .6); font-size: 22px; cursor: pointer; }
.mb { padding: 32px; }
.mgal { display: grid; grid-template-columns: 2fr 1fr; gap: 7px; margin-bottom: 16px; }
.mm-main { height: 280px; background: var(--g1); display: flex; align-items: center; justify-content: center; font-size: 80px; }
.mm-side { display: flex; flex-direction: column; gap: 7px; }
.mm-s {
  flex: 1;
  background: var(--g1);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 38px;
  cursor: pointer;
  opacity: .55;
  border: 2px solid transparent;
  transition: all .3s;
}
.mm-s:hover, .mm-s.on { opacity: 1; border-color: var(--r); }
.m-thumbs { display: flex; gap: 7px; overflow-x: auto; padding-bottom: 3px; margin-bottom: 20px; }
.m-th {
  width: 68px;
  height: 50px;
  background: var(--g1);
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  cursor: pointer;
  opacity: .5;
  border: 2px solid transparent;
  transition: all .3s;
}
.m-th:hover, .m-th.on { opacity: 1; border-color: var(--r); }
.m-asr {
  display: flex;
  align-items: center;
  gap: 14px;
  background: var(--g1);
  padding: 16px 20px;
  border-left: 3px solid var(--d);
  margin-bottom: 22px;
}
.m-asr .av { width: 48px; height: 48px; border-radius: 50%; overflow: hidden; flex-shrink: 0; border: 2px solid var(--d); }
.m-asr .av img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
.m-asr .inf .nm { font-size: 15px; font-weight: 600; color: var(--az); }
.m-asr .inf .rl { font-size: 12px; color: #888; }
.m-asr .inf .em { font-size: 11px; color: var(--r); margin-top: 2px; }
.m-asr .inf .rt { color: var(--d); font-size: 12px; margin-top: 2px; }
.minfo { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.mdesc h3 { font-family: 'Cormorant Garamond', serif; font-size: 19px; color: var(--az); margin-bottom: 8px; }
.mdesc p { font-size: 13.5px; color: #555; line-height: 1.8; }
.mspg { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 18px; }
.msi { background: var(--g1); padding: 13px; text-align: center; }
.msi .n { font-family: 'Cormorant Garamond', serif; font-size: 22px; color: var(--r); }
.msi .l { font-size: 10px; color: #888; text-transform: uppercase; }
.mbtns { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 18px; }
.mcont h3 { font-size: 15px; color: var(--az); font-weight: 600; margin-bottom: 14px; }

/* ─────────────────────────────────────────
   MODAL DE RESEÑAS
   ───────────────────────────────────────── */
.rev-modal { display: flex; flex-direction: column; gap: 14px; max-height: 340px; overflow-y: auto; }
.rev-item { background: var(--g1); padding: 16px; border-left: 3px solid var(--d); }
.rev-hd { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
.rev-nm { font-size: 13.5px; font-weight: 600; color: var(--az); }
.rev-st { color: var(--d); font-size: 12px; }
.rev-txt { font-size: 13px; color: #555; line-height: 1.6; font-style: italic; }
.rev-dt { font-size: 11px; color: #aaa; margin-top: 4px; }
.rev-form { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--g2); }
.rev-form h4 { font-size: 14px; font-weight: 600; color: var(--az); margin-bottom: 10px; }
.stp { display: flex; gap: 6px; margin-bottom: 10px; }
.stp-s { font-size: 24px; cursor: pointer; color: #ddd; transition: color .2s; }
.stp-s.on { color: var(--d); }

/* ═══════════════════════════════════════════════════════════
   TOAST + FABs + SCROLL TOP
   ═══════════════════════════════════════════════════════════ */
.tst {
  position: fixed;
  bottom: 26px;
  right: 26px;
  z-index: 8000;
  background: var(--az);
  border-left: 4px solid var(--d);
  padding: 14px 20px;
  max-width: 280px;
  transform: translateX(110%);
  transition: transform .4s cubic-bezier(.25, .46, .45, .94);
  box-shadow: 0 14px 36px rgba(0, 0, 0, .22);
}
.tst.show { transform: translateX(0); }
.tt { font-size: 13px; font-weight: 600; color: #fff; }
.tm { font-size: 11.5px; color: rgba(255, 255, 255, .55); margin-top: 2px; }
.fab-w {
  position: fixed;
  bottom: 26px;
  left: 26px;
  z-index: 3000;
  width: 52px;
  height: 52px;
  background: #25D366;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  box-shadow: 0 6px 22px rgba(37, 211, 102, .4);
  animation: bounce 2.5s infinite;
  text-decoration: none;
  transition: transform .3s;
}
.fab-w:hover { transform: scale(1.1); animation: none; }
.scrtop {
  position: fixed;
  bottom: 90px;
  right: 26px;
  z-index: 3000;
  width: 40px;
  height: 40px;
  background: #fff;
  border: 1.5px solid var(--g2);
  color: var(--az);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 17px;
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
  transition: all .3s;
  box-shadow: 0 4px 14px rgba(0, 0, 0, .09);
}
.scrtop.vis { opacity: 1; pointer-events: all; }
.scrtop:hover { background: var(--r); border-color: var(--r); color: #fff; }

/* ═══════════════════════════════════════════════════════════
   REVEAL ON SCROLL — Animaciones de entrada
   ═══════════════════════════════════════════════════════════ */
.rev { opacity: 0; transform: translateY(32px); transition: opacity .65s ease, transform .65s ease; }
.rev.vis { opacity: 1; transform: translateY(0); }
.revl { opacity: 0; transform: translateX(-30px); transition: opacity .65s ease, transform .65s ease; }
.revl.vis { opacity: 1; transform: translateX(0); }
.revr { opacity: 0; transform: translateX(30px); transition: opacity .65s ease, transform .65s ease; }
.revr.vis { opacity: 1; transform: translateX(0); }

/* ═══════════════════════════════════════════════════════════
   ANIMACIONES GLOBALES
   ═══════════════════════════════════════════════════════════ */
@keyframes fu { to { opacity: 1; transform: translateY(0); } }
@keyframes tick { to { transform: translateX(-50%); } }
@keyframes fl1 { 0%, 100% { transform: translateY(0) rotate(-.5deg); } 50% { transform: translateY(-13px) rotate(.5deg); } }
@keyframes fl2 { 0%, 100% { transform: translateY(0) rotate(.5deg); } 50% { transform: translateY(-16px) rotate(-.5deg); } }
@keyframes fl3 { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
@keyframes bounceIn { 0% { transform: scale(0); opacity: 0; } 60% { transform: scale(1.1); } 100% { transform: scale(1); opacity: 1; } }
@keyframes bounce { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
@keyframes blink { 0%, 100% { opacity: 1; } 50% { opacity: .3; } }
@keyframes growUp { from { transform: scaleY(0); } to { transform: scaleY(1); } }
/* ─────────────────────────────────────────
   ANIMACIÓN LUCKY — Sacudida al saludar
   ───────────────────────────────────────── */
@keyframes luckyShake {
  0%, 100% { transform: translateX(0); }
  20% { transform: translateX(-8px) rotate(-2deg); }
  40% { transform: translateX(8px) rotate(2deg); }
  60% { transform: translateX(-5px) rotate(-1deg); }
  80% { transform: translateX(5px) rotate(1deg); }
}
.agc.lucky-shake {
  animation: luckyShake 0.6s ease;
}

/* ═══════════════════════════════════════════════════════════
   RESPONSIVE — TABLET HORIZONTAL (≤1100px)
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 1100px) {
  .dsh-grid { grid-template-columns: repeat(2, 1fr); }
  .pgrid { grid-template-columns: repeat(2, 1fr); }
  .dir-grid { grid-template-columns: repeat(2, 1fr); }
  .tc.ceo { grid-column: span 2; }
  .ag-grid { grid-template-columns: repeat(3, 1fr); }
  .corr-grid { grid-template-columns: repeat(4, 1fr); }
  .foot-t { grid-template-columns: 1fr 1fr; gap: 32px; }
  .cob-w { grid-template-columns: 1fr; }
  .tcard { min-width: calc(50% - 11px); }
}

/* ═══════════════════════════════════════════════════════════
   RESPONSIVE — TABLET VERTICAL (≤900px)
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 900px) {
  .hi { grid-template-columns: 1fr; padding: 100px 24px 150px; }
  .hfc { display: none; }
  .dest-w { grid-template-columns: 1fr; }
  .dest-img { height: 260px; font-size: 80px; }
  .dest-img::after { background: linear-gradient(0deg, var(--az) 0%, transparent 60%); }
  .vende-w { grid-template-columns: 1fr; }
  .cont-w { grid-template-columns: 1fr; }
  .minfo { grid-template-columns: 1fr; }
  .mgal { grid-template-columns: 1fr; }
  .mm-side { display: none; }
  nav { padding: 0 20px; }
}

/* ═══════════════════════════════════════════════════════════
   RESPONSIVE — MÓVIL (≤768px)
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  section { padding: 60px 20px; }
  nav { padding: 0 16px; }
  .nls { display: none; }
  .ham { display: flex; }
  .nc { display: none; }
  .hs { flex-direction: column; }
  .hs input, .hs select { border-right: none; border-bottom: 1px solid var(--g2); }
  .dsh-grid { grid-template-columns: 1fr 1fr; }
  .dsh-hd { flex-direction: column; align-items: flex-start; }
  .pgrid { grid-template-columns: 1fr; }
  .pgrid.lv .pc { flex-direction: column; }
  .pgrid.lv .pci { width: 100%; height: 200px; }
  .advg { grid-template-columns: 1fr 1fr; }
  .dir-grid { grid-template-columns: 1fr; }
  .tc.ceo { grid-column: auto; flex-direction: column; }
  .tc.ceo .tc-av { width: 100%; }
  .tc.ceo .tc-avi { height: 220px; }
  .ag-grid { grid-template-columns: repeat(2, 1fr); }
  .corr-grid { grid-template-columns: repeat(2, 1fr); }
  .tcard { min-width: 100%; }
  .fgr { grid-template-columns: 1fr; }
  .foot-t { grid-template-columns: 1fr; }
  .ctab { flex-direction: column; text-align: center; }
  .dest-c { padding: 36px 24px; }
  .mh { flex-direction: column; align-items: flex-start; }
  .mh-r { width: 100%; justify-content: space-between; }
  .ftabs { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 4px; }
  .ft { white-space: nowrap; flex-shrink: 0; }
}

/* ═══════════════════════════════════════════════════════════
   RESPONSIVE — MÓVIL PEQUEÑO (≤480px)
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 480px) {
  h1.ht { font-size: 36px; }
  .dsh-grid { grid-template-columns: 1fr; }
  .ag-grid { grid-template-columns: 1fr; }
  .corr-grid { grid-template-columns: 1fr; }
  .dc .num { font-size: 30px; }
  .hst { gap: 16px; }
  .hst-i .n { font-size: 26px; }
  .bchart-wrap { height: 120px; }
  .tkitem { font-size: 11px; padding: 0 20px; }
}