/* SELF-HOSTED FONTS (Bunny mirror, no tracking, RGPD) */
/* latin */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/playfair-display-latin-400-normal.woff2) format('woff2'); 
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/playfair-display-latin-ext-400-normal.woff2) format('woff2'); 
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/playfair-display-latin-500-normal.woff2) format('woff2'); 
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/playfair-display-latin-ext-500-normal.woff2) format('woff2'); 
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Source Serif 4';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/source-serif-4-latin-400-normal.woff2) format('woff2'); 
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Source Serif 4';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/source-serif-4-latin-ext-400-normal.woff2) format('woff2'); 
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Source Serif 4';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/source-serif-4-latin-500-normal.woff2) format('woff2'); 
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Source Serif 4';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/source-serif-4-latin-ext-500-normal.woff2) format('woff2'); 
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/inter-latin-400-normal.woff2) format('woff2'); 
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/inter-latin-ext-400-normal.woff2) format('woff2'); 
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/inter-latin-500-normal.woff2) format('woff2'); 
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/inter-latin-ext-500-normal.woff2) format('woff2'); 
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/inter-latin-600-normal.woff2) format('woff2'); 
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/inter-latin-ext-600-normal.woff2) format('woff2'); 
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* ═══════════════════════════════════════════════════════════════
   ALU INMOBILIARIA — ESTILOS COMPARTIDOS
   Versión: 1.0 · Abril 2026
   Estética: luxury/refined · Paleta: cream + navy + burnished gold
   ═══════════════════════════════════════════════════════════════ */

/* ── TOKENS ── */
:root {
  --cream: #F2E8E0;
  --cream-dark: #E8D8CC;
  --navy: #011620;
  --navy-light: #0A2A3A;
  --gold: #C0995A;
  --gold-dark: #A87D38;
  --gold-light: #D4B57A;
  --white: #FAFAF8;
  --text: #011620;
  --text-light: #4A5568;
  --font-display: 'Playfair Display', Georgia, serif;
  --font-body: 'Source Serif 4', Georgia, serif;
  --font-ui: 'Inter', system-ui, sans-serif;
  --gutter: clamp(1.5rem, 4vw, 4rem);
  --max-width: 1400px;
}

/* ── RESET ── */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html {
  background: var(--navy);
  color: var(--text);
  font-family: var(--font-body);
  font-size: clamp(15px, 1.1vw, 18px);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
body { background: var(--cream); overflow-x: hidden; }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
button { border: none; background: none; cursor: pointer; font-family: inherit; }


/* ── SCROLL PROGRESS ── */
.scroll-progress {
  position: fixed; top: 0; left: 0;
  height: 2px; background: var(--gold);
  z-index: 9997; transform-origin: left; transform: scaleX(0);
}

/* ── PRELOADER ── */
.preloader {
  position: fixed; inset: 0; z-index: 9999;
  background: var(--navy);
  display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 2rem;
}
.preloader.done { pointer-events: none; }
@keyframes preloaderSafety { 0%,85%{opacity:1;visibility:visible} 100%{opacity:0;visibility:hidden} }
.preloader { animation: preloaderSafety 4.5s ease forwards; }
.preloader__logo { width: 160px; opacity: 0; transform: translateY(20px); }
.preloader__counter {
  font-family: var(--font-display); font-size: 4rem;
  color: var(--gold); font-weight: 400; opacity: 0;
}
.preloader__line {
  width: 60px; height: 1px; background: var(--gold);
  transform: scaleX(0); transform-origin: left;
}

/* ── HEADER ── */
.header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  padding: 1rem var(--gutter);
  display: flex; align-items: center; justify-content: space-between;
  transition: background .4s, backdrop-filter .4s;
}
.header.scrolled {
  background: rgba(1,22,32,.88);
  backdrop-filter: blur(14px);
}
.header__logo img { height: 75px; width: auto; object-fit: contain; }
.header__logo .logo-horizontal { display: block; height: 56px; }
.header__logo .logo-icon { display: none; height: 60px; }
@media (max-width: 768px) {
  /* En mobile mostramos el logo horizontal igual que en desktop, solo más pequeño */
  .header__logo .logo-horizontal { display: block; height: 38px; }
  .header__logo .logo-icon { display: none; }
}
@media (max-width: 380px) {
  /* En pantallas muy pequeñas, dejamos solo el icono para que no se solape con la hamburguesa */
  .header__logo .logo-horizontal { display: none; }
  .header__logo .logo-icon { display: block; height: 38px; }
}
.nav-list {
  display: flex; gap: 2.5rem; list-style: none;
  align-items: center;
  font-family: var(--font-ui); font-size: .75rem;
  font-weight: 500; letter-spacing: .08em; text-transform: uppercase;
}
.nav-link {
  color: var(--white); position: relative;
  padding: .25rem 0; transition: color .3s;
  display: inline-flex; align-items: center;
  line-height: 1;
}
.nav-link::after {
  content: ''; position: absolute; bottom: 0; left: 0;
  width: 0; height: 1px; background: var(--gold);
  transition: width .4s cubic-bezier(.22,1,.36,1);
}
.nav-link:hover::after { width: 100%; }
.nav-link.active::after { width: 100%; }

/* hamburger */
.nav-toggle {
  display: none; width: 28px; height: 20px;
  flex-direction: column; justify-content: space-between;
  cursor: pointer; z-index: 130;
}
.nav-toggle span {
  display: block; width: 100%; height: 2px;
  background: var(--white); transition: all .3s;
}
.nav-toggle.open span:nth-child(1) { transform: translateY(9px) rotate(45deg); }
.nav-toggle.open span:nth-child(2) { opacity: 0; }
.nav-toggle.open span:nth-child(3) { transform: translateY(-9px) rotate(-45deg); }

/* ═══════════════════════════════════════════════════════════════
   MOBILE OVERLAY · Reescrito para ser USABLE en móvil
   - Scroll vertical
   - Padding superior para no chocar con el header
   - Tipografía más pequeña (no caben h1 grandes con 15 items)
   - Grupos colapsables con <details>
═══════════════════════════════════════════════════════════════ */
/* ═══════════════════════════════════════════════════════════════
   MOBILE NAV OVERLAY · v10.33 · Estrategia simplificada
   El overlay es un panel a pantalla completa que se desplaza
   verticalmente con scroll natural del documento (no scroll interno).
   Esto garantiza que arrastrar el dedo SIEMPRE desplace el contenido.
═══════════════════════════════════════════════════════════════ */
.nav-overlay {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  /* z-index 120: ENCIMA del header (100) y nav-toggle (110)
     Sin esto, el header tapa la zona superior del menú y bloquea
     el scroll y los toques en esa zona. */
  z-index: 120;
  background: var(--navy);
  /* Scroll vertical natural en toda la pantalla */
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  /* Padding generoso · safe-area respetada en iPhone X+ */
  padding: 5.5rem 1.5rem 4rem;
  padding-bottom: calc(4rem + env(safe-area-inset-bottom, 0px));
  /* Estado cerrado · invisible y sin captura de eventos */
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .3s ease, visibility 0s linear .3s;
}
.nav-overlay.open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: opacity .3s ease, visibility 0s linear 0s;
}
.nav-overlay .nav-list {
  flex-direction: column;
  align-items: stretch;
  gap: .2rem;
  list-style: none;
  padding: 0;
  margin: 0 0 1.5rem;
  border-bottom: 1px solid rgba(192,153,90,.2);
  padding-bottom: 1.5rem;
}
.nav-overlay .nav-list li {
  border-bottom: 1px solid rgba(192,153,90,.12);
}
.nav-overlay .nav-list li:last-child {
  border-bottom: none;
}
.nav-overlay .nav-link {
  font-family: var(--font-display);
  font-size: 1.15rem;
  font-weight: 400;
  color: var(--cream);
  display: block;
  padding: .8rem .4rem;
  min-height: 48px;
  text-decoration: none;
  letter-spacing: -.005em;
  transition: color .2s, padding-left .2s;
  display: flex;
  align-items: center;
}
.nav-overlay .nav-link:hover,
.nav-overlay .nav-link:focus {
  color: var(--gold);
  padding-left: .8rem;
}
/* Las dos primarias destacadas: Vender / Comprar */
.nav-overlay .nav-link--primary {
  color: var(--gold);
  font-weight: 500;
}
.nav-overlay .nav-link--primary:hover {
  color: var(--cream);
}

/* ── NAV: Herramientas dropdown + CTA Valora tu piso ── */
.nav-desktop { display: flex; align-items: center; gap: 2rem; }

.nav-item-has-dropdown { position: relative; }
/* Puente invisible: cubre el gap entre el botón y el panel para que el hover no se pierda */
.nav-item-has-dropdown::after {
  content: ''; position: absolute;
  top: 100%; left: -30px; right: -30px;
  height: 1.6rem;
  pointer-events: auto;
}
.nav-link--dropdown {
  background: none; border: 0; cursor: pointer;
  font: inherit; color: var(--white);
  letter-spacing: .08em; text-transform: uppercase;
  padding: .25rem 0;
  display: inline-flex; align-items: center; gap: .35rem;
  line-height: 1;
  transition: color .3s;
}
.nav-link--dropdown::after {
  content: ''; position: absolute; bottom: 0; left: 0;
  width: 0; height: 1px; background: var(--gold);
  transition: width .4s cubic-bezier(.22,1,.36,1);
}
.nav-item-has-dropdown:hover .nav-link--dropdown::after,
.nav-item-has-dropdown:focus-within .nav-link--dropdown::after { width: 100%; }
.nav-link__chevron {
  width: 9px; height: 9px; transition: transform .3s;
  fill: none; stroke: currentColor; stroke-width: 2;
  stroke-linecap: round; stroke-linejoin: round;
}
.nav-item-has-dropdown:hover .nav-link__chevron,
.nav-item-has-dropdown:focus-within .nav-link__chevron { transform: rotate(180deg); }

.nav-dropdown {
  position: absolute; top: calc(100% + 1.1rem); left: 50%;
  transform: translateX(-50%) translateY(-8px);
  min-width: 320px;
  background: rgba(1,22,32,.96);
  backdrop-filter: blur(18px);
  border: 1px solid rgba(192,153,90,.22);
  border-top: 2px solid var(--gold);
  padding: .5rem;
  opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity .3s, transform .3s, visibility .3s;
  z-index: 200;
}
.nav-dropdown::before {
  content: ''; position: absolute; top: -7px; left: 50%;
  transform: translateX(-50%) rotate(45deg);
  width: 12px; height: 12px;
  background: rgba(1,22,32,.96);
  border-top: 2px solid var(--gold);
  border-left: 1px solid rgba(192,153,90,.22);
}
.nav-item-has-dropdown:hover .nav-dropdown,
.nav-item-has-dropdown:focus-within .nav-dropdown,
.nav-item-has-dropdown.is-open .nav-dropdown {
  opacity: 1; visibility: visible; pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}
.nav-dropdown__item {
  display: flex; align-items: flex-start; gap: .75rem;
  padding: .55rem .8rem;
  color: var(--white); text-decoration: none;
  border-radius: 2px;
  transition: background .25s;
  text-transform: none; letter-spacing: 0;
}
.nav-dropdown__item:hover,
.nav-dropdown__item:focus { background: rgba(192,153,90,.10); outline: 0; }
.nav-dropdown__icon {
  flex: 0 0 32px; height: 32px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(192,153,90,.10);
  border: 1px solid rgba(192,153,90,.25);
  color: var(--gold);
  font-size: 1rem;
}
.nav-dropdown__title {
  font-family: var(--font-ui); font-size: .82rem; font-weight: 600;
  color: var(--white); letter-spacing: .02em;
}
.nav-dropdown__desc {
  font-family: var(--font-ui); font-size: .72rem; font-weight: 400;
  color: rgba(255,255,255,.62); margin-top: .15rem; line-height: 1.4;
}

/* CTA "Valora tu piso gratis" — botón borde dorado, elegante, no invasivo */
.nav-cta {
  display: inline-block;
  font-family: var(--font-ui); font-size: .72rem; font-weight: 600;
  letter-spacing: .1em; text-transform: uppercase;
  color: var(--gold);
  padding: .65rem 1.15rem;
  border: 1px solid var(--gold);
  text-decoration: none;
  transition: all .35s cubic-bezier(.22,1,.36,1);
  white-space: nowrap;
}
.nav-cta:hover,
.nav-cta:focus {
  background: var(--gold); color: var(--navy);
  outline: 0;
  box-shadow: 0 4px 18px rgba(192,153,90,.28);
}

/* Mobile overlay: items extra */
.nav-overlay__group { display: flex; flex-direction: column; align-items: center; gap: .9rem; margin-top: .5rem; }
.nav-overlay__group-label {
  font-family: var(--font-ui); font-size: .65rem; font-weight: 600;
  letter-spacing: .15em; text-transform: uppercase;
  color: var(--gold); opacity: .7; margin-bottom: .2rem;
}


/* Grupos secundarios · acordeones colapsables */
.nav-overlay__group {
  margin: 0;
  padding: 0;
  border-bottom: 1px solid rgba(192,153,90,.12);
}
.nav-overlay__group-label {
  display: block;
  width: 100%;
  background: transparent;
  border: none;
  text-align: left;
  font-family: var(--font-ui);
  font-size: .7rem;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--gold-dark);
  padding: 1rem .4rem;
  min-height: 48px;
  cursor: pointer;
  position: relative;
}
.nav-overlay__group-label::after {
  content: '+';
  position: absolute;
  right: .5rem;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1.4rem;
  font-weight: 300;
  color: var(--gold);
  transition: transform .25s;
}
.nav-overlay__group.is-open .nav-overlay__group-label::after {
  content: '−';
}
.nav-overlay__group-content {
  display: none;
  padding-bottom: 1rem;
}
.nav-overlay__group.is-open .nav-overlay__group-content {
  display: block;
}
.nav-overlay__sublink {
  display: flex;
  align-items: center;
  padding: .65rem .8rem;
  min-height: 44px;
  font-family: var(--font-ui);
  font-size: .88rem;
  color: rgba(242,232,224,.78);
  text-decoration: none;
  transition: color .2s, padding-left .2s;
}
.nav-overlay__sublink:hover {
  color: var(--gold);
  padding-left: 1.2rem;
}

/* CTA final del overlay (Recibir novedades) */
.nav-overlay__cta {
  margin-top: 2rem;
  padding: 0 .4rem;
}
.nav-overlay__alert {
  display: inline-block;
  font-family: var(--font-ui);
  font-size: .82rem;
  font-style: italic;
  color: var(--gold);
  text-decoration: none;
  border-bottom: 1px solid var(--gold);
  padding: 4px 0;
  letter-spacing: .02em;
}
.nav-overlay__alert:hover {
  color: var(--cream);
  border-bottom-color: var(--cream);
}
.nav-overlay .nav-cta {
  margin-top: 1.5rem;
  font-size: .85rem; padding: 1rem 2rem;
}


/* Bloques del dropdown (Si compras / Si vendes) y items "Próximamente" */
.nav-dropdown__group { padding: .35rem 0; }
.nav-dropdown__group + .nav-dropdown__group { border-top: 0.5px solid rgba(192,153,90,.18); margin-top: .25rem; }
.nav-dropdown__group-title {
  display: block;
  padding: .65rem 1.1rem .45rem;
  font-family: var(--font-ui);
  font-size: .62rem;
  font-weight: 500;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--gold);
  opacity: .65;
}
.nav-dropdown__item--soon {
  opacity: .42;
  cursor: default;
  pointer-events: none;
}
.nav-dropdown__item--soon:hover,
.nav-dropdown__item--soon:focus { background: transparent; }
.nav-dropdown__badge {
  display: inline-block;
  margin-left: .5rem;
  padding: 1px 7px 2px;
  font-size: .58rem;
  font-weight: 500;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--gold);
  border: 0.5px solid rgba(192,153,90,.45);
  border-radius: 999px;
  vertical-align: middle;
  opacity: .85;
}
/* Equivalente en overlay móvil */
.nav-overlay__subgroup-title {
  display: block;
  padding: .8rem 0 .25rem;
  font-family: var(--font-ui);
  font-size: .58rem;
  font-weight: 500;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--gold);
  opacity: .55;
}
.nav-overlay__sublink--soon {
  opacity: .45;
  cursor: default;
  pointer-events: none;
}
.nav-overlay__badge {
  display: inline-block;
  margin-left: .4rem;
  padding: 1px 6px 2px;
  font-size: .55rem;
  font-weight: 500;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--gold);
  border: 0.5px solid rgba(192,153,90,.45);
  border-radius: 999px;
  vertical-align: middle;
}

/* Responsive: Herramientas dropdown se oculta en mobile (se gestiona en overlay) */
@media (max-width: 1024px) {
  .nav-list { gap: 1.6rem; }
  .nav-cta { padding: .55rem .95rem; font-size: .68rem; }
  .nav-desktop { gap: 1.4rem; }
}


@media (max-width: 768px) { .nav-desktop { display: none !important; } .nav-toggle { display: flex !important; } }

/* ── PAGE HERO ── */
.hero {
  position: relative; height: 100vh; min-height: 600px;
  display: flex; align-items: flex-end;
  padding: 4rem var(--gutter); overflow: hidden;
}
.hero--short { height: 50vh; min-height: 350px; }
.hero__bg { position: absolute; inset: 0; z-index: 0; }
.hero__bg img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.15); }
.hero__overlay {
  position: absolute; inset: 0;
  z-index: 4;
  pointer-events: none;
  background: linear-gradient(to top,
    rgba(1,22,32,.72) 0%, rgba(1,22,32,.32) 50%, rgba(1,22,32,.08) 100%);
}
.hero__content {
  position: relative; z-index: 5; max-width: 900px; padding-bottom: 4rem;
}
.hero__badge {
  display: inline-flex; align-items: center; gap: .6rem;
  font-family: var(--font-ui);
  font-size: .65rem; font-weight: 500; letter-spacing: .18em;
  text-transform: uppercase; color: var(--gold-light);
  background: transparent; padding: 0;
  margin-bottom: 2.5rem; opacity: 0; transform: translateY(20px);
}
.hero__badge::before {
  content: ''; display: block; width: 28px; height: 1px;
  background: var(--gold); flex-shrink: 0;
}
.hero__title {
  font-family: var(--font-display);
  font-size: clamp(3rem, 7.5vw, 7rem);
  font-weight: 400; line-height: .92;
  color: var(--gold); text-transform: uppercase;
  letter-spacing: -.02em; margin-bottom: 1.2rem;
}
.hero__title .word { display: inline-block; overflow: hidden; margin-right: .3em; }
.hero__title .char { display: inline-block; transform: translateY(120%) rotate(8deg); opacity: 0; }
.hero__claim {
  font-family: var(--font-body);
  font-size: clamp(1rem, 1.8vw, 1.35rem);
  font-weight: 300; color: var(--cream);
  max-width: 550px; margin-bottom: 2.5rem;
  opacity: 0; font-style: italic; transform: translateY(30px);
}
.hero__scroll {
  display: flex; align-items: center; gap: .75rem;
  font-family: var(--font-ui); font-size: .68rem; font-weight: 500;
  letter-spacing: .15em; text-transform: uppercase;
  color: var(--gold-light); cursor: pointer; opacity: 0;
}
.hero__scroll-line { width: 48px; height: 1px; background: var(--gold); animation: scrollP 2s ease-in-out infinite; }
@keyframes scrollP { 0%,100%{transform:scaleX(1);opacity:1} 50%{transform:scaleX(.4);opacity:.3} }
.hero__deco { display: none; }
.hero__deco--tl { top: 2rem; left: var(--gutter); width: 80px; height: 80px; border-top: 1px solid rgba(192,153,90,.3); border-left: 1px solid rgba(192,153,90,.3); opacity: 0; }
.hero__deco--br { bottom: 2rem; right: var(--gutter); width: 80px; height: 80px; border-bottom: 1px solid rgba(192,153,90,.3); border-right: 1px solid rgba(192,153,90,.3); opacity: 0; }

/* ── SUBNAV ── */
.subnav {
  position: sticky; top: 0; z-index: 50;
  background: var(--navy); padding: 0 var(--gutter);
  border-bottom: 1px solid rgba(192,153,90,.12);
  transform: translateY(-100%); opacity: 0;
}
.subnav.vis { transform: translateY(0); opacity: 1; transition: all .5s cubic-bezier(.22,1,.36,1); }
.subnav__inner { max-width: var(--max-width); margin: 0 auto; display: flex; align-items: center; justify-content: space-between; }
.subnav__brand { font-family: var(--font-display); font-size: 1rem; color: var(--gold); font-weight: 500; padding: .9rem 0; }
.subnav__links { display: flex; gap: 2rem; list-style: none; font-family: var(--font-ui); font-size: .7rem; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; }
.subnav__links a { color: var(--cream-dark); padding: .9rem 0; display: block; transition: color .3s; }
.subnav__links a:hover { color: var(--gold); }
.subnav__links .cta { color: var(--navy); background: var(--gold); padding: .45rem 1.4rem; margin: .45rem 0; font-weight: 600; transition: background .3s; }
.subnav__links .cta:hover { background: var(--gold-light); }

/* ── SECTIONS (cream bg) ── */
.section { padding: 8rem var(--gutter); }
.section__inner { max-width: var(--max-width); margin: 0 auto; }
.section--dark { background: var(--navy); color: var(--cream); }
.section__label {
  font-family: var(--font-ui); font-size: .7rem; font-weight: 600;
  letter-spacing: .15em; text-transform: uppercase;
  color: var(--gold-dark); margin-bottom: .8rem;
}
.section__heading {
  font-family: var(--font-display);
  font-size: clamp(1.9rem, 3.5vw, 3.2rem);
  font-weight: 400; line-height: 1.1; margin-bottom: 2rem;
}
.section__heading em { color: var(--gold-dark); font-style: italic; }
.section__body { font-size: 1rem; color: var(--text-light); line-height: 1.8; margin-bottom: 1.2rem; }
.gold-line { width: 0; height: 2px; background: var(--gold); margin: 1rem 0; }

/* ── GRID LAYOUTS ── */
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: center; }
.grid-2--reverse { grid-template-columns: .8fr 1.2fr; }
@media (max-width: 900px) { .grid-2, .grid-2--reverse { grid-template-columns: 1fr; } }

/* ── IMAGE REVEAL ── */
.img-wrap { position: relative; overflow: hidden; border-radius: 2px; }
.img-wrap img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.15); }
.img-wrap__reveal { position: absolute; inset: 0; z-index: 2; transform-origin: right; pointer-events: none; }
.img-wrap__reveal--cream { background: var(--cream); }
.img-wrap__reveal--navy { background: var(--navy); transform-origin: top; }

/* ── STATS ── */
.stats { background: var(--navy); padding: 5rem var(--gutter); overflow: hidden; }
.stats__inner { max-width: var(--max-width); margin: 0 auto; display: grid; grid-template-columns: repeat(4,1fr); gap: 1px; background: rgba(192,153,90,.12); }
.stat { background: var(--navy); padding: 3rem 2rem; text-align: center; }
.stat__number { font-family: var(--font-display); font-size: clamp(2.5rem,4vw,4rem); font-weight: 400; color: var(--gold); line-height: 1; }
.stat__label { font-family: var(--font-ui); font-size: .7rem; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; color: rgba(242,232,224,.5); margin-top: .8rem; }
@media (max-width: 768px) { .stats__inner { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .stats__inner { grid-template-columns: 1fr; } .stat { padding: 2rem 1.5rem; } }

/* ── SERVICES GRID ── */
.services__header { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; margin-bottom: 5rem; }
.services__title {
  font-family: var(--font-display);
  font-size: clamp(2.2rem, 4.5vw, 4rem);
  font-weight: 400; line-height: 1.05;
  color: var(--gold); text-transform: uppercase;
}
.services__title .word { display: inline-block; overflow: hidden; margin-right: .2em; }
.services__title .char { display: inline-block; transform: translateY(100%); }
.services__subtitle { font-size: 1rem; color: rgba(242,232,224,.65); line-height: 1.8; align-self: end; }
.services__grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; background: rgba(192,153,90,.12); }
.svc {
  background: var(--navy); padding: 3rem 2rem;
  position: relative; overflow: hidden; transition: background .5s;
}
.svc:hover { background: var(--navy-light); }
.svc__num { font-family: var(--font-display); font-size: 3rem; font-weight: 400; color: rgba(192,153,90,.1); margin-bottom: .8rem; line-height: 1; transition: color .5s; }
.svc:hover .svc__num { color: rgba(192,153,90,.25); }
.svc__title { font-family: var(--font-ui); font-size: .78rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--gold); margin-bottom: .8rem; }
.svc__text { font-size: .88rem; color: rgba(242,232,224,.55); line-height: 1.7; }
.svc__line { position: absolute; bottom: 0; left: 0; width: 0; height: 2px; background: var(--gold); transition: width .6s cubic-bezier(.22,1,.36,1); }
.svc:hover .svc__line { width: 100%; }
.svc__link { display: inline-block; margin-top: 1.2rem; font-family: var(--font-ui); font-size: .7rem; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--gold-light); transition: color .3s; }
.svc__link:hover { color: var(--gold); }
@media (max-width: 900px) { .services__header { grid-template-columns: 1fr; } .services__grid { grid-template-columns: 1fr; } }

/* ── HORIZONTAL GALLERY ── */
.hgallery { overflow: hidden; position: relative; }
.hgallery__track { display: flex; gap: 1.5rem; padding: 6rem var(--gutter); width: max-content; will-change: transform; }
.hgallery__item { width: clamp(280px,35vw,500px); flex-shrink: 0; position: relative; overflow: hidden; border-radius: 2px; }
.hgallery__item img { width: 100%; height: clamp(350px,45vw,550px); object-fit: cover; transition: transform 1s cubic-bezier(.22,1,.36,1); }
.hgallery__item:hover img { transform: scale(1.06); }
.hgallery__item-overlay { position: absolute; inset: 0; background: linear-gradient(to top,rgba(1,22,32,.6) 0%,transparent 40%); pointer-events: none; }
.hgallery__item-text { position: absolute; bottom: 1.5rem; left: 1.5rem; color: var(--white); font-family: var(--font-ui); font-size: .72rem; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; transform: translateY(20px); opacity: 0; transition: all .5s; }
.hgallery__item:hover .hgallery__item-text { transform: translateY(0); opacity: 1; }
.hgallery__header { padding: 0 var(--gutter); max-width: var(--max-width); margin: 0 auto; }

/* ── PARALLAX HIGHLIGHT ── */
.highlight { position: relative; height: 80vh; min-height: 500px; display: flex; align-items: center; justify-content: center; text-align: center; overflow: hidden; }
.highlight__bg { position: absolute; inset: -25%; z-index: 0; }
.highlight__bg img { width: 100%; height: 100%; object-fit: cover; }
.highlight__overlay { position: absolute; inset: 0; background: rgba(1,22,32,.7); pointer-events: none; }
.highlight__content { position: relative; z-index: 2; max-width: 700px; padding: 0 var(--gutter); }
.highlight__quote { font-family: var(--font-display); font-size: clamp(1.5rem,3.5vw,2.6rem); font-weight: 400; font-style: italic; color: var(--gold-light); line-height: 1.35; margin-bottom: 2rem; }
.highlight__quote .word { display: inline-block; overflow: hidden; margin-right: .25em; }
.highlight__quote .char { display: inline-block; transform: translateY(100%); }
.highlight__author { font-family: var(--font-ui); font-size: .72rem; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--cream); opacity: 0; }
.highlight__line { width: 0; height: 1px; background: var(--gold); margin: 0 auto 2rem; }

/* ── REVIEWS ── */
.reviews { padding: 6rem var(--gutter) 8rem; overflow: hidden; }
.reviews__header { max-width: var(--max-width); margin: 0 auto 4rem; display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; flex-wrap: wrap; }
.reviews__score { display: flex; align-items: center; gap: 1.2rem; }
.reviews__score-number { font-family: var(--font-display); font-size: 3.5rem; font-weight: 400; color: var(--gold); line-height: 1; }
.reviews__stars { display: flex; gap: 3px; }
.reviews__star { width: 18px; height: 18px; color: var(--gold); }
.reviews__score-text { font-family: var(--font-ui); font-size: .72rem; color: var(--text-light); }
.reviews__google { display: flex; align-items: center; gap: .5rem; font-family: var(--font-ui); font-size: .8rem; font-weight: 500; color: var(--text-light); }
.reviews__google svg { width: 18px; height: 18px; }
.reviews__track { display: flex; gap: 1.5rem; width: max-content; will-change: transform; }
@keyframes reviewScroll { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }
.review-card {
  width: clamp(300px,30vw,400px); flex-shrink: 0;
  background: var(--white); border: 1px solid var(--cream-dark);
  padding: 2rem; position: relative;
  transition: transform .3s, box-shadow .3s;
}
.review-card:hover { transform: translateY(-4px); box-shadow: 0 12px 40px rgba(1,22,32,.08); }
.review-card__stars { display: flex; gap: 2px; margin-bottom: 1rem; }
.review-card__star { width: 14px; height: 14px; color: #FBBC04; }
.review-card__text { font-family: var(--font-body); font-size: .92rem; color: var(--text); line-height: 1.7; margin-bottom: 1.5rem; min-height: 80px; }
.review-card__footer { display: flex; align-items: center; justify-content: space-between; padding-top: 1.2rem; border-top: 1px solid var(--cream-dark); }
.review-card__author { display: flex; align-items: center; gap: .8rem; }
.review-card__avatar { width: 36px; height: 36px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-family: var(--font-ui); font-size: .8rem; font-weight: 600; color: var(--white); }
.review-card__name { font-family: var(--font-ui); font-size: .78rem; font-weight: 600; color: var(--text); }
.review-card__date { font-family: var(--font-ui); font-size: .65rem; color: var(--text-light); }
.review-card__google { display: flex; align-items: center; gap: .35rem; font-family: var(--font-ui); font-size: .6rem; color: var(--text-light); }
.review-card__google svg { width: 14px; height: 14px; }
.reviews__cta { max-width: var(--max-width); margin: 3rem auto 0; text-align: center; }
.reviews__cta a { font-family: var(--font-ui); font-size: .75rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--gold-dark); border-bottom: 1px solid var(--gold); padding-bottom: .2rem; transition: color .3s; }
.reviews__cta a:hover { color: var(--gold); }

/* ── TEAM ── */
.team__members { display: flex; gap: 3rem; margin-top: 2rem; padding-top: 2rem; border-top: 1px solid var(--cream-dark); }
.team__member-name { font-family: var(--font-ui); font-size: .85rem; font-weight: 600; color: var(--text); }
.team__member-role { font-family: var(--font-ui); font-size: .75rem; color: var(--gold-dark); font-weight: 500; }

/* ── CTA + CONTACT ── */
.cta__heading { font-family: var(--font-display); font-size: clamp(1.8rem,3.5vw,3rem); font-weight: 400; line-height: 1.1; color: var(--gold); }
.cta__heading em { font-style: italic; color: var(--cream); }
.cta__text { margin-top: 2rem; color: rgba(242,232,224,.6); line-height: 1.8; }
.cta__phone { display: inline-block; margin-top: 2rem; font-family: var(--font-display); font-size: 1.8rem; color: var(--gold-light); transition: color .3s, letter-spacing .3s; }
.cta__phone:hover { color: var(--gold); letter-spacing: .05em; }
.cta__address { margin-top: 1.5rem; font-family: var(--font-ui); font-size: .82rem; color: rgba(242,232,224,.4); line-height: 1.7; }
.contact-form { display: flex; flex-direction: column; gap: 1rem; }
.fg label { font-family: var(--font-ui); font-size: .7rem; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--gold); display: block; margin-bottom: .4rem; }
.fg input, .fg textarea { width: 100%; padding: .8rem 0; background: transparent; border: none; border-bottom: 1px solid rgba(192,153,90,.25); color: var(--cream); font-family: var(--font-body); font-size: 1rem; outline: none; transition: border-color .3s; }
.fg input:focus, .fg textarea:focus { border-color: var(--gold); }
.fg textarea { resize: vertical; min-height: 80px; }
.fg input::placeholder, .fg textarea::placeholder { color: rgba(242,232,224,.25); }
.form__submit {
  margin-top: 1rem; font-family: var(--font-ui); font-size: .78rem;
  font-weight: 600; letter-spacing: .1em; text-transform: uppercase;
  color: var(--navy); background: var(--gold);
  padding: 1rem 3rem; border: none; cursor: pointer;
  transition: background .3s, transform .3s;
  align-self: flex-start; position: relative; overflow: hidden;
}
.form__submit::before { content: ''; position: absolute; inset: 0; background: var(--gold-light); transform: scaleX(0); transform-origin: left; transition: transform .4s cubic-bezier(.22,1,.36,1); z-index: 0; }
.form__submit:hover::before { transform: scaleX(1); }
.form__submit span { position: relative; z-index: 1; }
.form__submit:hover { transform: translateY(-2px); }
.form__legal { font-family: var(--font-ui); font-size: .65rem; color: rgba(242,232,224,.3); line-height: 1.5; }
.form__legal a { color: var(--gold-dark); }

/* ── FOOTER ── */
.footer {
  background: var(--navy);
  border-top: 1px solid rgba(192,153,90,.08);
  padding: 4rem var(--gutter) 2rem;
  color: rgba(242,232,224,.45);
}
.footer__inner { max-width: var(--max-width); margin: 0 auto; display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: 4rem; }
.footer__brand-logo { height: 55px; width: auto; object-fit: contain; margin-bottom: 1rem; opacity: .7; }
.footer__brand-text { font-size: .83rem; line-height: 1.7; max-width: 280px; }
.footer__col-title { font-family: var(--font-ui); font-size: .68rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--gold-dark); margin-bottom: 1rem; }
.footer__col-link { display: block; padding: .2rem 0; font-size: .83rem; transition: color .3s; }
.footer__col-link:hover { color: var(--cream); }
.footer__bottom { max-width: var(--max-width); margin: 4rem auto 0; padding-top: 2rem; border-top: 1px solid rgba(192,153,90,.06); display: flex; justify-content: space-between; font-family: var(--font-ui); font-size: .68rem; }
@media (max-width: 768px) { .footer__inner { grid-template-columns: 1fr 1fr; gap: 2rem; } .footer__bottom { flex-direction: column; gap: .5rem; } }
@media (max-width: 480px) { .footer__inner { grid-template-columns: 1fr; gap: 1.5rem; } }

/* ── COOKIE ── */
.cookie-banner {
  position: fixed; bottom: 1.5rem; left: 1.5rem; right: 1.5rem; z-index: 200;
  background: var(--navy); border: 1px solid rgba(192,153,90,.15);
  padding: 1.5rem 2rem; display: flex; align-items: center;
  justify-content: space-between; gap: 2rem;
  transform: translateY(200%); transition: transform .6s cubic-bezier(.22,1,.36,1);
  max-width: 680px;
}
.cookie-banner.vis { transform: translateY(0); }
.cookie-banner__text { font-family: var(--font-ui); font-size: .75rem; color: rgba(242,232,224,.65); line-height: 1.5; }
.cookie-banner__text a { color: var(--gold); }
.cookie-banner__actions { display: flex; gap: .75rem; flex-shrink: 0; }
.cb { font-family: var(--font-ui); font-size: .68rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; padding: .55rem 1.1rem; cursor: pointer; transition: all .3s; }
/* Paridad visual exigida por la Guía AEPD 2024: Aceptar y Rechazar deben tener la misma prominencia */
.cb { font-family: var(--font-ui); font-size: .72rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; padding: .8rem 1.6rem; border: 1px solid var(--gold); cursor: pointer; transition: background .3s, color .3s; min-width: 120px; }
.cb--a { background: var(--gold); color: var(--navy); }
.cb--a:hover { background: var(--gold-light); }
.cb--r { background: transparent; color: var(--gold); }
.cb--r:hover { background: var(--gold); color: var(--navy); }
@media (max-width: 600px) { .cookie-banner { flex-direction: column; align-items: stretch; left: 1rem; right: 1rem; bottom: 1rem; padding: 1.2rem; } }

/* ── BLOG ── */
.blog-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 2rem; }
.blog-card { background: var(--white); border: 1px solid var(--cream-dark); overflow: hidden; transition: transform .3s, box-shadow .3s; }
.blog-card:hover { transform: translateY(-4px); box-shadow: 0 12px 40px rgba(1,22,32,.08); }
.blog-card__img { height: 200px; overflow: hidden; }
.blog-card__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.blog-card:hover .blog-card__img img { transform: scale(1.06); }
.blog-card__body { padding: 1.8rem; }
.blog-card__tag { font-family: var(--font-ui); font-size: .65rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--gold-dark); margin-bottom: .8rem; }
.blog-card__title { font-family: var(--font-display); font-size: 1.2rem; font-weight: 400; line-height: 1.3; margin-bottom: .8rem; color: var(--text); }
.blog-card__excerpt { font-size: .88rem; color: var(--text-light); line-height: 1.6; }
.blog-card__meta { margin-top: 1.2rem; padding-top: 1rem; border-top: 1px solid var(--cream-dark); font-family: var(--font-ui); font-size: .68rem; color: var(--text-light); display: flex; justify-content: space-between; }

/* blog article page */
.article { max-width: 780px; margin: 0 auto; padding: 6rem var(--gutter) 4rem; }
.article__tag { font-family: var(--font-ui); font-size: .68rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--gold-dark); margin-bottom: 1rem; }
.article__title { font-family: var(--font-display); font-size: clamp(1.8rem, 3.5vw, 2.8rem); font-weight: 400; line-height: 1.2; margin-bottom: 1.5rem; }
.article__meta { font-family: var(--font-ui); font-size: .78rem; color: var(--text-light); margin-bottom: 3rem; padding-bottom: 2rem; border-bottom: 1px solid var(--cream-dark); }
.article__content { font-size: 1.05rem; line-height: 1.85; color: var(--text); }
.article__content h2 { font-family: var(--font-display); font-size: 1.5rem; font-weight: 400; margin: 3rem 0 1.2rem; color: var(--text); }
.article__content h3 { font-family: var(--font-ui); font-size: .85rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--gold-dark); margin: 2.5rem 0 1rem; }
.article__content p { margin-bottom: 1.5rem; }
.article__content strong { font-weight: 600; color: var(--text); }
.article__content a { color: var(--gold-dark); border-bottom: 1px solid var(--gold-light); transition: color .3s; }
.article__content a:hover { color: var(--gold); }
.article__sources { margin-top: 3rem; padding-top: 2rem; border-top: 1px solid var(--cream-dark); font-family: var(--font-ui); font-size: .78rem; color: var(--text-light); line-height: 1.8; }
.article__sources strong { color: var(--text); font-weight: 600; }
.article__author { margin-top: 3rem; padding: 2rem; background: var(--cream-dark); border-left: 3px solid var(--gold); font-family: var(--font-ui); font-size: .82rem; color: var(--text-light); line-height: 1.7; }
.article__author strong { color: var(--text); font-weight: 600; }

/* ── SERVICE PAGE ── */
.service-hero {
  position: relative;
  background: var(--navy);
  color: var(--cream);
  padding: 10rem var(--gutter) 5rem;
  overflow: hidden;
  min-height: 60vh;
  display: flex;
  align-items: flex-end;
}
.service-hero--image {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  min-height: 75vh;
}
.service-hero--image::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(1,22,32,.30) 0%,
    rgba(1,22,32,.55) 55%,
    rgba(1,22,32,.92) 100%
  );
  z-index: 1;
}
.service-hero--image::after {
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 4px;
  background: var(--gold);
  z-index: 2;
}
.service-hero__inner {
  position: relative;
  z-index: 3;
  max-width: var(--max-width);
  margin: 0 auto;
  width: 100%;
}
.service-hero__label { font-family: var(--font-ui); font-size: .7rem; font-weight: 600; letter-spacing: .15em; text-transform: uppercase; color: var(--gold); margin-bottom: 1rem; }
.service-hero__title { font-family: var(--font-display); font-size: clamp(2rem, 4vw, 3.5rem); font-weight: 400; line-height: 1.1; color: var(--cream); margin-bottom: 2rem; text-shadow: 0 2px 16px rgba(1,22,32,.4); }
.service-hero__desc { font-size: 1.05rem; color: rgba(242,232,224,.92); line-height: 1.8; max-width: 650px; text-shadow: 0 1px 6px rgba(1,22,32,.5); }
.service-content { padding: 5rem var(--gutter); max-width: 900px; margin: 0 auto; }
.service-content h2 { font-family: var(--font-display); font-size: 1.6rem; font-weight: 400; margin: 3rem 0 1.2rem; }
.service-content p { font-size: 1rem; color: var(--text-light); line-height: 1.85; margin-bottom: 1.5rem; }
.service-cta { text-align: center; padding: 4rem var(--gutter) 6rem; }

/* ── CTA EDITORIAL ALU ──────────────────────────────────────────
   Botón refinado al estilo inmobiliarias boutique de élite (The
   Modern House, Aesop, Aman). Mantiene la elegancia minimal del
   sitio sin caer en el rectángulo dorado tipo "click here".
   Tres capas: minimal en reposo, animación de línea en hover,
   inversión completa en focus. Mantiene 48px de altura mínima
   para target táctil (Apple HIG / Google Material). */
.service-cta__btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  font-family: var(--font-display);
  font-size: 1.05rem;
  font-weight: 400;
  font-style: italic;
  letter-spacing: .01em;
  text-transform: none;
  color: var(--navy);
  background: transparent;
  padding: 1.1rem 3rem 1.1rem .2rem;
  border: none;
  text-decoration: none;
  overflow: hidden;
  transition: color .35s ease, padding .35s ease;
  cursor: pointer;
  z-index: 1;
}
/* Línea fina dorada bajo el texto. Acaba antes de la flecha. */
.service-cta__btn::before {
  content: '';
  position: absolute;
  left: .2rem;
  right: 4.8rem;
  bottom: .85rem;
  height: 1px;
  background: var(--gold);
  transform-origin: left center;
  transition: right .4s cubic-bezier(.65,.05,.36,1);
  z-index: -1;
}
/* Flecha → SVG limpio (línea + punta) inyectada por CSS */
.service-cta__btn::after {
  content: '';
  width: 36px;
  height: 14px;
  margin-left: 2.4rem;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 14' fill='none' stroke='%23C0995A' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'><line x1='0' y1='7' x2='32' y2='7'/><polyline points='26,2 32,7 26,12'/></svg>");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  position: relative;
  transition: width .35s cubic-bezier(.65,.05,.36,1), margin-left .35s, filter .35s;
}
.service-cta__btn:hover::after {
  width: 52px;
  margin-left: 2.8rem;
  filter: brightness(.78) saturate(1.1);
}

.service-cta__btn:hover {
  color: var(--gold-dark);
  padding-right: 3.8rem;
}
.service-cta__btn:hover::before {
  right: 5.6rem;
}

.service-cta__btn:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 6px;
  border-radius: 2px;
}
@media (max-width: 480px) {
  .service-cta__btn {
    font-size: .98rem;
    padding: 1rem 1.8rem 1rem .2rem;
  }
}

/* ── REVEALS ── */
.rv { opacity: 0; transform: translateY(50px); }

/* ── UTILITIES ── */
::selection { background: var(--gold); color: var(--navy); }
::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: var(--cream); }
::-webkit-scrollbar-thumb { background: var(--gold-dark); border-radius: 3px; }

/* ═══════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════ */
@media (max-width: 768px) {
  html { font-size: 15px; }
  .header { padding: 1rem 1.25rem; }
  .hero { padding: 2rem 1.25rem; min-height: 100svh; }
  .hero__content { padding-bottom: 2.5rem; }
  .hero__title { font-size: clamp(2.4rem, 11vw, 3.5rem); }
  .hero__deco--tl, .hero__deco--br { width: 50px; height: 50px; }
  .subnav__links { gap: .8rem; font-size: .6rem; }
  .subnav__links .cta { padding: .35rem .7rem; }
  .section { padding: 5rem 1.25rem; }
  .section__heading { font-size: 1.7rem; }
  .stats { padding: 3rem 1rem; }
  .services__header { margin-bottom: 3rem; gap: 1.5rem; }
  .svc { padding: 2rem 1.5rem; }
  .highlight { height: 55vh; min-height: 350px; }
  .team__members { flex-wrap: wrap; gap: 1.5rem; }
  .reviews { padding: 5rem 1.25rem; }
  .review-card { width: 280px; padding: 1.5rem; }
  .reviews__score-number { font-size: 2.5rem; }
  .fg input, .fg textarea { min-height: 44px; padding: .9rem 0; }
  .form__submit { width: 100%; text-align: center; padding: .9rem 2rem; }
  .blog-grid { grid-template-columns: 1fr; }
  .article { padding: 5rem 1.25rem 3rem; }
}

@media (max-width: 480px) {
  :root { --gutter: 1rem; }
  .hero__title { font-size: 2.2rem; }
  .hero__deco--tl, .hero__deco--br { display: none; }
  .subnav__brand { display: none; }
  .subnav__links { flex-wrap: wrap; justify-content: center; padding: .5rem 0; gap: .5rem; }
  .section__heading { font-size: 1.45rem; }
  .team__members { flex-direction: column; gap: 1rem; }
  .cta__heading { font-size: 1.4rem; }
  .cta__phone { font-size: 1.3rem; }
  .cookie-banner { left: .5rem; right: .5rem; bottom: .5rem; }
  .cb { flex: 1; text-align: center; }
}

@supports (padding: max(0px)) {
  .hero { padding-bottom: max(2.5rem, env(safe-area-inset-bottom)); }
  .cookie-banner { bottom: max(1rem, env(safe-area-inset-bottom)); }
}

@media (hover: none) and (pointer: coarse) {
  a, button { -webkit-tap-highlight-color: transparent; }
  .nav-link::after { display: none; }
  .svc__line { width: 100% !important; height: 1px; opacity: .2; }
  .hgallery__item-text { transform: translateY(0); opacity: 1; }
}

@media (max-height: 500px) and (orientation: landscape) {
  .hero { min-height: 100svh; padding: 1.5rem var(--gutter); }
  .hero__content { padding-bottom: 1rem; }
  .hero__title { font-size: 2rem; }
}

/* ── EDITORIAL ARTICLE LAYOUT ── */
.article__hero { width: 100vw; margin-left: calc(-50vw + 50%); height: clamp(350px,45vw,520px); overflow: hidden; margin-bottom: 3rem; position: relative; }
.article__hero img { width: 100%; height: 100%; object-fit: cover; }
.article__hero-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(1,22,32,.15) 0%, transparent 40%); }
.article__lead { font-size: 1.15rem; font-style: italic; color: var(--text); line-height: 1.75; border-left: 3px solid var(--gold); padding-left: 1.5rem; margin-bottom: 2.5rem; }
.article__pullimg { margin: 3rem 0; overflow: hidden; border-radius: 2px; }
.article__pullimg--wide { width: 100vw; margin-left: calc(-50vw + 50%); height: clamp(280px,35vw,420px); }
.article__pullimg--wide img { width: 100%; height: 100%; object-fit: cover; }
.article__pullimg--float { float: right; width: 45%; margin: 0 0 1.5rem 2rem; max-height: 380px; }
.article__pullimg--float img { width: 100%; height: 100%; object-fit: cover; border-radius: 2px; }
@media (max-width: 768px) {
  .article__pullimg--float { float: none; width: 100%; margin: 2rem 0; max-height: none; }
  .article__hero { height: 250px; }
}
.article__content h2 { position: relative; padding-left: 0; }
.article__content h2::before { content: ''; position: absolute; left: -2rem; top: .4em; width: 4px; height: .8em; background: var(--gold); border-radius: 1px; }
@media (max-width: 768px) { .article__content h2::before { display: none; } }
.article__nav { display: flex; justify-content: space-between; gap: 2rem; padding: 2rem var(--gutter); max-width: 780px; margin: 0 auto; }
.article__nav a { font-family: var(--font-ui); font-size: .75rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--gold-dark); transition: color .3s; }
.article__nav a:hover { color: var(--gold); }

/* ── WHATSAPP FLOTANTE ── */
.whatsapp-float {
  position: fixed; bottom: 1.8rem; right: 1.8rem; z-index: 190;
  width: 56px; height: 56px; border-radius: 50%;
  background: #25D366; display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 20px rgba(37,211,102,.35);
  transition: transform .3s, box-shadow .3s;
  cursor: pointer;
}
.whatsapp-float:hover { transform: scale(1.08); box-shadow: 0 6px 28px rgba(37,211,102,.45); }
.whatsapp-float svg { width: 28px; height: 28px; fill: #fff; }
@media (max-width: 480px) { .whatsapp-float { bottom: 1.2rem; right: 1.2rem; width: 50px; height: 50px; } .whatsapp-float svg { width: 24px; height: 24px; } }


/* ── FAB UNIFICADO ALU ── */
.alu-fab{position:fixed;bottom:1.8rem;right:1.8rem;z-index:190}
.alu-fab__btn{width:48px;height:48px;border-radius:50%;background:var(--gold);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 3px 14px rgba(192,153,90,.35);transition:transform .25s,box-shadow .25s}
.alu-fab__btn:hover{transform:scale(1.08);box-shadow:0 5px 20px rgba(192,153,90,.45)}
.alu-fab__btn svg{width:24px;height:24px;fill:none;stroke:#fff;stroke-width:26;stroke-linecap:round;stroke-linejoin:round}
.alu-fab__menu{position:absolute;bottom:58px;right:0;background:var(--navy);border-radius:10px;box-shadow:0 6px 28px rgba(1,22,32,.2);padding:.4rem 0;min-width:200px;opacity:0;transform:translateY(6px);pointer-events:none;transition:opacity .2s,transform .2s}
.alu-fab__menu.is-open{opacity:1;transform:translateY(0);pointer-events:auto}
.alu-fab__menu a{display:flex;align-items:center;gap:.7rem;padding:.65rem 1.1rem;color:var(--cream);text-decoration:none;font-size:.82rem;font-family:var(--font-ui);transition:background .15s}
.alu-fab__menu a:hover{background:rgba(255,255,255,.08)}
.alu-fab__menu a svg{width:18px;height:18px;flex-shrink:0}
.alu-fab__menu a .fa-wa svg{fill:#25D366}
@media(max-width:480px){.alu-fab{bottom:1.2rem;right:1.2rem}.alu-fab__btn{width:44px;height:44px}.alu-fab__btn svg{width:22px;height:22px}}

/* ── SCROLL-TOP (chevron sin caja) ──
   Solo trazo dorado. Apilado encima del FAB de contacto, mismo eje vertical
   (centro a 38px del borde derecho: igual que el FAB, right 16 + width 44/2).
   Aparece tras 600px de scroll. Se aparta solo cuando el menú del FAB se abre
   o cuando el banner de cookies está visible. Sin tooltip. */
.alu-top {
  position: fixed;
  bottom: 100px;
  right: 1.8rem;
  z-index: 185;
  width: 48px;
  height: 48px;
  padding: 0;
  background: var(--navy);
  border: 1.5px solid var(--gold);
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transform: translateY(8px);
  pointer-events: none;
  box-shadow: 0 3px 14px rgba(1,22,32,.25);
  transition: opacity .25s cubic-bezier(.4,0,.2,1), transform .25s cubic-bezier(.4,0,.2,1), background .25s, box-shadow .25s;
}
.alu-top.is-visible {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.alu-top:hover {
  background: var(--gold);
  border-color: var(--gold);
  transform: translateY(-3px);
  box-shadow: 0 6px 22px rgba(192,153,90,.45);
}
.alu-top:hover svg { stroke: var(--navy); }
.alu-top svg {
  width: 22px;
  height: 22px;
  stroke: var(--gold);
  stroke-width: 2.4;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: stroke .25s;
}
/* Coordinación con el menú del FAB de contacto: cuando el menú está abierto,
   el chevron se desliza fuera para no competir por el espacio. */
body:has(#aluFabMenu.is-open) .alu-top.is-visible {
  opacity: 0;
  transform: translateY(28px);
  pointer-events: none;
}
/* Coordinación con el banner de cookies. */
body:has(.cookie-banner.vis) .alu-top.is-visible {
  transform: translateY(-110px);
}
@media (max-width: 480px) {
  .alu-top {
    bottom: 80px;
    right: 1.2rem;
    width: 44px;
    height: 44px;
    padding: 0;
  }
  .alu-top svg { width: 20px; height: 20px; }
}

/* ── CALCULADORA ── */
.calc { background: var(--white); border: 1px solid var(--cream-dark); padding: 2.5rem; margin: 2rem 0; }
.calc__title { font-family: var(--font-display); font-size: 1.3rem; font-weight: 400; margin-bottom: 1.5rem; }
.calc__row { display: flex; gap: 1.5rem; margin-bottom: 1.2rem; flex-wrap: wrap; }
.calc__field { flex: 1; min-width: 200px; }
.calc__field label { display: block; font-family: var(--font-ui); font-size: .7rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--gold-dark); margin-bottom: .4rem; }
.calc__field input, .calc__field select {
  width: 100%; padding: .7rem .8rem; border: 1px solid var(--cream-dark);
  font-family: var(--font-body); font-size: 1rem; color: var(--text);
  background: var(--cream); outline: none; transition: border-color .3s;
}
.calc__field input:focus, .calc__field select:focus { border-color: var(--gold); }
.calc__btn {
  display: inline-block; margin-top: 1rem; font-family: var(--font-ui); font-size: .78rem;
  font-weight: 600; letter-spacing: .1em; text-transform: uppercase;
  color: var(--navy); background: var(--gold); padding: .9rem 2.5rem;
  border: none; cursor: pointer; transition: background .3s;
}
.calc__btn:hover { background: var(--gold-light); }
.calc__results { margin-top: 2rem; display: none; }
.calc__results.vis { display: block; }
.calc__result-row { display: flex; justify-content: space-between; padding: .7rem 0; border-bottom: 1px solid var(--cream-dark); font-size: .95rem; }
.calc__result-row:last-child { border-bottom: none; }
.calc__result-label { color: var(--text-light); }
.calc__result-value { font-weight: 600; color: var(--text); }
.calc__result-total { font-family: var(--font-display); font-size: 1.4rem; color: var(--gold-dark); padding-top: 1rem; margin-top: .5rem; border-top: 2px solid var(--gold); display: flex; justify-content: space-between; }
.calc__disclaimer { margin-top: 1.5rem; font-family: var(--font-ui); font-size: .72rem; color: var(--text-light); line-height: 1.6; border-left: 3px solid var(--cream-dark); padding-left: 1rem; }
.calc__cta { margin-top: 2rem; padding: 1.5rem; background: var(--navy); text-align: center; }
.calc__cta p { font-family: var(--font-body); font-size: .95rem; color: rgba(242,232,224,.7); margin-bottom: 1rem; }
.calc__cta a { font-family: var(--font-ui); font-size: .75rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--gold); }

/* ── VALORACIÓN FORM ── */
.val-form { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem; }
@media (max-width: 768px) { .val-form { grid-template-columns: 1fr; } }
.val-form .full { grid-column: 1 / -1; }

@media (max-width: 768px) { #herramientas [style*="grid-template-columns:repeat(3"] { grid-template-columns: 1fr !important; } }

/* ── HERRAMIENTAS (siempre visible, sin rv) ── */
.tools-section { padding: 6rem var(--gutter); background: var(--cream); }
.tools-inner { max-width: var(--max-w); margin: 0 auto; }
.tools-label { font-family: var(--font-ui); font-size: .72rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--gold-dark); margin-bottom: 1rem; }
.tools-line { width: 48px; height: 1px; background: var(--gold); margin-bottom: 2rem; }
.tools-heading { font-family: var(--font-display); font-size: clamp(1.8rem, 3.5vw, 2.8rem); font-weight: 400; color: var(--navy); line-height: 1.15; margin-bottom: 3rem; max-width: 700px; }
.tools-heading em { font-style: italic; color: var(--gold-dark); }
.tools-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.tool-card { background: var(--white); border: 1px solid var(--cream-dark); padding: 2.5rem 2rem; text-decoration: none; color: inherit; display: block; transition: border-color .4s, transform .4s, box-shadow .4s; position: relative; }
.tool-card:hover { border-color: var(--gold); transform: translateY(-4px); box-shadow: 0 20px 40px rgba(1,22,32,.08); }
.tool-icon { font-family: var(--font-display); font-size: 3rem; font-weight: 400; color: var(--gold); opacity: .25; line-height: 1; margin-bottom: 1.5rem; font-style: italic; }
.tool-title { font-family: var(--font-display); font-size: 1.4rem; font-weight: 500; color: var(--navy); margin-bottom: .8rem; }
.tool-text { font-family: var(--font-body); font-size: .95rem; color: var(--text-light); line-height: 1.7; margin-bottom: 1.5rem; }
.tool-link { font-family: var(--font-ui); font-size: .75rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--gold-dark); }
@media (max-width: 900px) { .tools-grid { grid-template-columns: 1fr; gap: 1rem; } .tools-section { padding: 4rem var(--gutter); } }

/* ── AVISO LEGAL PROMINENTE ── */
.legal-notice { background: #fef9f0; border-left: 4px solid var(--gold); padding: 1.5rem 1.8rem; margin: 2rem 0; }
.legal-notice__title { font-family: var(--font-ui); font-size: .75rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--gold-dark); margin-bottom: .8rem; display: flex; align-items: center; gap: .6rem; }
.legal-notice__title::before { content: '⚠'; font-size: 1.1rem; }
.legal-notice p { font-family: var(--font-body); font-size: .88rem; line-height: 1.7; color: var(--text); margin-bottom: .7rem; }
.legal-notice p:last-child { margin-bottom: 0; }
.legal-notice strong { color: var(--navy); font-weight: 600; }
.legal-notice__refs { font-family: var(--font-ui); font-size: .72rem; color: var(--text-light); margin-top: .8rem; padding-top: .8rem; border-top: 1px solid rgba(192,153,90,.2); line-height: 1.6; }

/* Checkbox de aceptación */
.legal-accept { display: flex; align-items: flex-start; gap: .8rem; padding: 1rem; background: var(--cream); border: 1px solid var(--cream-dark); margin: 1.5rem 0; cursor: pointer; }
.legal-accept input[type="checkbox"] { margin-top: .25rem; flex-shrink: 0; width: 18px; height: 18px; accent-color: var(--gold); cursor: pointer; }
.legal-accept label { font-family: var(--font-body); font-size: .85rem; line-height: 1.6; color: var(--text); cursor: pointer; }
.legal-accept label a { color: var(--gold-dark); text-decoration: underline; }

/* ── FAQ section ── */
.faq-section { padding: 5rem 2rem 3rem; background: var(--cream); }
.faq-section__inner { max-width: 820px; margin: 0 auto; }
.faq-section__title { 
  font-family: var(--font-display); font-size: clamp(1.6rem, 3vw, 2.2rem);
  font-weight: 400; color: var(--navy); text-align: center;
  margin-bottom: 2.5rem;
}
.faq__list { display: flex; flex-direction: column; gap: .8rem; }
.faq__item {
  background: var(--white); border: 1px solid rgba(1,22,32,.08);
  border-radius: 2px; padding: 0;
  transition: border-color .3s, box-shadow .3s;
}
.faq__item[open] { border-color: var(--gold); box-shadow: 0 6px 24px rgba(1,22,32,.06); }
.faq__q {
  padding: 1.1rem 1.4rem;
  font-family: var(--font-ui); font-size: .92rem; font-weight: 600;
  color: var(--navy); cursor: pointer; list-style: none;
  display: flex; justify-content: space-between; align-items: center; gap: 1rem;
}
.faq__q::after {
  content: '+'; color: var(--gold); font-size: 1.5rem; font-weight: 300;
  transition: transform .3s;
}
.faq__item[open] .faq__q::after { content: '−'; }
.faq__q::-webkit-details-marker { display: none; }
.faq__a {
  padding: 0 1.4rem 1.2rem;
  font-family: var(--font-body); font-size: .92rem; line-height: 1.7;
  color: var(--text-light, #555);
}
.faq__a p { margin: 0; }

/* ── Exit-intent modal ── */
.eim-overlay {
  position: fixed; inset: 0; background: rgba(1,22,32,.78);
  backdrop-filter: blur(6px);
  z-index: 9998; display: none;
  align-items: center; justify-content: center; padding: 1.5rem;
  animation: eimFade .35s ease-out;
}
.eim-overlay.is-open { display: flex; }
@keyframes eimFade { from { opacity: 0; } to { opacity: 1; } }
.eim-modal {
  background: var(--cream); max-width: 540px; width: 100%;
  position: relative; padding: 3rem 2.5rem 2.5rem;
  border-top: 4px solid var(--gold);
  animation: eimSlide .45s cubic-bezier(.22,1,.36,1);
  box-shadow: 0 30px 80px rgba(0,0,0,.5);
}
@keyframes eimSlide { from { transform: translateY(20px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
.eim-close {
  position: absolute; top: 1rem; right: 1rem;
  width: 34px; height: 34px; background: none; border: 0;
  cursor: pointer; color: var(--navy); font-size: 1.4rem;
  display: flex; align-items: center; justify-content: center;
  transition: opacity .2s;
}
.eim-close:hover { opacity: .55; }
.eim-eyebrow {
  font-family: var(--font-ui); font-size: .68rem; font-weight: 600;
  letter-spacing: .15em; text-transform: uppercase;
  color: var(--gold-dark, #9A7843); text-align: center; margin-bottom: .8rem;
}
.eim-title {
  font-family: var(--font-display); font-size: clamp(1.5rem, 3vw, 1.95rem);
  font-weight: 400; color: var(--navy); text-align: center;
  line-height: 1.2; margin-bottom: 1rem;
}
.eim-text {
  font-family: var(--font-body); font-size: .92rem; line-height: 1.6;
  color: var(--text, #333); text-align: center; margin-bottom: 1.8rem;
}
.eim-actions { display: flex; flex-direction: column; gap: .7rem; align-items: center; }
.eim-btn {
  display: inline-block; padding: 1rem 2.4rem;
  background: var(--gold); color: var(--navy);
  font-family: var(--font-ui); font-size: .78rem; font-weight: 600;
  letter-spacing: .12em; text-transform: uppercase; text-decoration: none;
  transition: all .3s cubic-bezier(.22,1,.36,1);
}
.eim-btn:hover { background: var(--navy); color: var(--gold); }
.eim-secondary {
  font-family: var(--font-ui); font-size: .72rem;
  color: rgba(1,22,32,.5); text-transform: uppercase; letter-spacing: .08em;
  background: none; border: 0; cursor: pointer; padding: .5rem;
  transition: color .2s;
}
.eim-secondary:hover { color: var(--navy); }
@media (max-width: 600px) {
  .eim-modal { padding: 2.5rem 1.5rem 2rem; }
}

/* ── Article: tabla de contenidos ── */
.article-toc {
  background: rgba(192,153,90,.06);
  border-left: 3px solid var(--gold);
  padding: 1.4rem 1.8rem 1.4rem 1.8rem;
  margin: 0 0 2.5rem 0;
}
.article-toc__label {
  font-family: var(--font-ui); font-size: .68rem; font-weight: 600;
  letter-spacing: .15em; text-transform: uppercase;
  color: var(--gold-dark, #9A7843); margin: 0 0 .8rem 0;
}
.article-toc__list {
  list-style: decimal; margin: 0; padding-left: 1.4rem;
  font-family: var(--font-body); font-size: .92rem;
  color: var(--text, #333);
}
.article-toc__list li { margin: .35rem 0; }
.article-toc__list a {
  color: var(--text, #333); text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: color .25s, border-color .25s;
}
.article-toc__list a:hover {
  color: var(--gold-dark, #9A7843);
  border-bottom-color: var(--gold);
}

/* ── Article: relacionados ── */
.related-articles {
  background: var(--cream); padding: 4rem 2rem 5rem;
}
.related-articles__inner { max-width: 1100px; margin: 0 auto; }
.related-articles__title {
  font-family: var(--font-display); font-size: clamp(1.4rem, 2.8vw, 1.9rem);
  font-weight: 400; color: var(--navy);
  margin: 0 0 2rem 0; text-align: center;
}
.related-articles__grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 1.2rem;
}
.related-card {
  background: var(--white); padding: 1.6rem 1.4rem;
  border: 1px solid rgba(1,22,32,.08);
  text-decoration: none;
  display: flex; align-items: center; min-height: 110px;
  transition: all .35s cubic-bezier(.22,1,.36,1);
}
.related-card:hover {
  border-color: var(--gold);
  box-shadow: 0 8px 28px rgba(1,22,32,.10);
  transform: translateY(-3px);
}
.related-card__title {
  font-family: var(--font-ui); font-size: .92rem; font-weight: 600;
  color: var(--navy); line-height: 1.4;
}


/* === HERO KEN BURNS + FADE-IN ATMOSFRICO === */
@keyframes kenBurnsZoom {
  0%   { transform: scale(1.18) translate(0,0); }
  100% { transform: scale(1.05) translate(-1.5%, -1%); }
}
@keyframes heroBgFadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}
.hero__bg img {
  animation: kenBurnsZoom 22s ease-out forwards, heroBgFadeIn 1.4s ease-out both;
  will-change: transform, opacity;
}
@media (prefers-reduced-motion: reduce) {
  .hero__bg img { animation: none; transform: scale(1.05); }
}

/* Fade-in escalonado del contenido del hero */
.hero__content > * {
  opacity: 0;
  transform: translateY(18px);
  animation: heroContentIn .9s cubic-bezier(.2,.7,.2,1) forwards;
}
.hero__content > *:nth-child(1) { animation-delay: .35s; }
.hero__content > *:nth-child(2) { animation-delay: .55s; }
.hero__content > *:nth-child(3) { animation-delay: .75s; }
.hero__content > *:nth-child(4) { animation-delay: .95s; }
.hero__content > *:nth-child(5) { animation-delay: 1.15s; }
@keyframes heroContentIn {
  to { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
  .hero__content > * { animation: none; opacity: 1; transform: none; }
}

/* ── BREADCRUMB GLOBAL: evita solape con header fijo ── */
.breadcrumb {
  margin-top: 107px; /* altura aproximada del header desktop */
}
@media (max-width: 768px) {
  .breadcrumb {
    margin-top: 84px; /* header en móvil */
  }
}
/* Cuando hay breadcrumb antes del service-hero, este no necesita tanto padding-top */
.breadcrumb ~ .service-hero { padding-top: 3rem; }
.breadcrumb ~ .section:first-of-type { padding-top: 2.5rem; }

/* ── MENU DROPDOWN: garantizar z-index por encima del breadcrumb y del hero ── */
.nav-item-has-dropdown { position: relative; z-index: 500; }
.nav-dropdown { z-index: 500 !important; }

/* ════════════════════════════════════════════════════════════
   v10.6 · Menú rediseñado · Comprar/Vender + Recibir novedades
   ════════════════════════════════════════════════════════════ */

/* "Comprar" y "Vender" como ítems primarios · ligero peso adicional */
.nav-link--primary {
  font-weight: 500;
  color: var(--cream);
}

/* Enlace «Recibir novedades» a la derecha del menú · enlace editorial */
.nav-alert {
  display: inline-block;
  font-family: var(--font-ui);
  font-size: .82rem;
  font-style: italic;
  color: var(--gold);
  text-decoration: none;
  border-bottom: 1px solid var(--gold);
  padding: 2px 0;
  letter-spacing: .02em;
  white-space: nowrap;
  flex-shrink: 0;
  transition: color .25s, border-color .25s;
}
.nav-alert:hover,
.nav-alert:focus {
  color: var(--cream);
  border-bottom-color: var(--cream);
  outline: 0;
}

/* Dropdown a 3 columnas · usado por «Herramientas» nuevo */
.nav-dropdown--3col {
  min-width: 720px;
  display: flex !important;
  flex-direction: row !important;
  gap: 1.25rem;
  padding: 1.5rem 1.5rem !important;
}
.nav-dropdown--3col .nav-dropdown__group {
  flex: 1 1 33.33%;
  min-width: 0;
}
.nav-dropdown--3col .nav-dropdown__group-title {
  font-family: var(--font-ui);
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--gold);
  padding: 0 .8rem .5rem .8rem;
  border-bottom: 1px solid rgba(192,153,90,.18);
  margin-bottom: .4rem;
}

/* Subgrupos en menú móvil · titulares de bloque */
.nav-overlay__subgroup-title {
  font-family: var(--font-ui);
  font-size: .65rem;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--gold);
  opacity: .55;
  margin-top: .8rem;
  margin-bottom: -.3rem;
}

/* CTA «Recibir novedades» dentro del menú móvil · más visible */
.nav-overlay__cta {
  margin-top: 2rem;
  text-align: center;
}
.nav-overlay__alert {
  display: inline-block;
  font-family: var(--font-ui);
  font-size: 1rem;
  color: var(--gold);
  text-decoration: none;
  border-bottom: 1px solid var(--gold);
  padding: .4rem 0;
  font-style: italic;
  letter-spacing: .02em;
  transition: color .25s, border-color .25s;
}
.nav-overlay__alert:hover { color: var(--cream); border-bottom-color: var(--cream); }

/* Pequeñas correcciones visuales del nav-desktop (solo desktop) */
@media (min-width: 769px) {
  .nav-desktop {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    flex-wrap: nowrap;
  }
}
.nav-desktop .nav-list {
  display: flex;
  align-items: center;
  gap: 2rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

/* En pantallas más estrechas, el dropdown 3col se compacta a 2col */
@media (max-width: 1100px) {
  .nav-dropdown--3col {
    min-width: 540px;
    flex-wrap: wrap !important;
  }
  .nav-dropdown--3col .nav-dropdown__group {
    flex: 1 1 calc(50% - 1.25rem);
  }
}

/* En móvil, el «Recibir novedades» del header desktop se oculta (lo recoge el overlay) */
@media (max-width: 980px) {
  .nav-desktop .nav-alert { display: none; }
}

/* ════════════════════════════════════════════════════════════
   v10.6 · Acordeón FAQ contextual reutilizable
   Usado en /comprar/, /vender/, /herencias/, etc.
   ════════════════════════════════════════════════════════════ */
.faq-block {
  max-width: 920px;
  margin: 4rem auto 2rem auto;
  padding: 0 1.5rem;
}
.faq-block__label {
  font-family: var(--font-ui);
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--gold-dark);
  margin-bottom: .8rem;
}
.faq-block__title {
  font-family: var(--font-display);
  font-size: clamp(1.4rem, 2.4vw, 1.9rem);
  font-weight: 400;
  color: var(--navy);
  line-height: 1.3;
  letter-spacing: -0.005em;
  margin-bottom: 2rem;
}
.faq-block__title.on-dark {
  color: var(--cream);
}

.faq-item {
  border-top: 1px solid var(--cream-dark);
  position: relative;
}
.faq-item:last-child {
  border-bottom: 1px solid var(--cream-dark);
}
.faq-item__trigger {
  width: 100%;
  text-align: left;
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 1.2rem 3rem 1.2rem 0;
  font-family: var(--font-ui);
  font-size: 1rem;
  font-weight: 500;
  color: var(--navy);
  position: relative;
  letter-spacing: .01em;
  line-height: 1.4;
  transition: color .25s ease;
}
.faq-item__trigger:hover { color: var(--gold-dark); }
.faq-item__trigger::after {
  content: '+';
  position: absolute;
  right: .5rem;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1.5rem;
  font-weight: 300;
  color: var(--gold);
  transition: transform .3s ease;
  line-height: 1;
}
.faq-item[aria-expanded="true"] .faq-item__trigger::after {
  content: '−';
}
.faq-item__panel {
  max-height: 0;
  overflow: hidden;
  transition: max-height .35s ease;
}
.faq-item[aria-expanded="true"] .faq-item__panel {
  max-height: 800px;
}
.faq-item__panel-inner {
  padding: 0 3rem 1.4rem 0;
  color: var(--text);
  font-family: var(--font-ui);
  font-size: .95rem;
  line-height: 1.7;
  max-width: 70ch;
}
.faq-item__panel-inner p { margin-bottom: .8rem; }
.faq-item__panel-inner p:last-child { margin-bottom: 0; }
.faq-item__panel-inner a {
  color: var(--gold-dark);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}
.faq-item__panel-inner a:hover { color: var(--navy); }

.faq-block__more {
  margin-top: 1.8rem;
  font-family: var(--font-ui);
  font-size: .9rem;
}
.faq-block__more a {
  color: var(--gold-dark);
  text-decoration: none;
  border-bottom: 1px solid var(--gold);
  padding-bottom: 2px;
}
.faq-block__more a:hover { color: var(--navy); border-bottom-color: var(--navy); }

/* Variante para fondo oscuro */
.faq-block.on-dark .faq-item {
  border-color: rgba(242,232,224,.15);
}
.faq-block.on-dark .faq-item__trigger {
  color: var(--cream);
}
.faq-block.on-dark .faq-item__trigger:hover {
  color: var(--gold);
}
.faq-block.on-dark .faq-item__panel-inner {
  color: rgba(242,232,224,.78);
}

/* ── SUBSCRIBE HERO (recibir-novedades) ── */
.subscribe-hero {
  position: relative;
  padding: 11rem var(--gutter) 5rem;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  min-height: 60vh;
  display: flex;
  align-items: flex-end;
  border-bottom: 4px solid var(--gold);
}
.subscribe-hero__inner { position: relative; z-index: 2; max-width: var(--max-width); margin: 0 auto; width: 100%; }
.subscribe-hero__kicker {
  font-family: var(--font-ui); font-size: .72rem; font-weight: 600;
  letter-spacing: .18em; text-transform: uppercase;
  color: var(--gold); margin-bottom: 1rem;
  text-shadow: 0 1px 8px rgba(1,22,32,.5);
}
.subscribe-hero__title {
  font-family: var(--font-display); font-size: clamp(2rem, 4vw, 3.4rem);
  font-weight: 400; line-height: 1.1; color: var(--cream);
  margin-bottom: 1.6rem; text-shadow: 0 2px 16px rgba(1,22,32,.4);
  max-width: 800px;
}
.subscribe-hero__lead {
  font-size: 1.05rem; color: rgba(242,232,224,.92); line-height: 1.75;
  max-width: 640px; text-shadow: 0 1px 6px rgba(1,22,32,.5);
}
.subscribe-form__title { font-family: var(--font-display); font-size: 1.6rem; font-weight: 400; margin: 0 0 .7rem; color: var(--navy); }
.subscribe-form__hint { font-size: .98rem; color: var(--text-light); margin-bottom: 2rem; line-height: 1.7; }


/* ── CTA STICKY · "VER CATÁLOGO" ────────────────────────────────
   Botón flotante elegante que aparece tras 600px de scroll para
   llevar al usuario directamente al catálogo activo. Se apila a
   la izquierda del FAB de contacto, mismo eje vertical, separado
   1.5rem. Mobile-first: en pantallas pequeñas el texto se oculta
   y solo queda el icono. Z-index ligeramente menor que el FAB
   para que no compita visualmente cuando se abre el menú del FAB.
   Inspiración: Ünkut (+55% clics tras añadir sticky), patrón
   Aman / Aesop (botones-link refinados, no rectángulos chillones).
*/
.alu-cta-catalog {
  position: fixed;
  bottom: 1.8rem;
  right: 1.8rem;
  /* En desktop empuja a la izquierda del FAB de contacto */
  margin-right: 70px;
  z-index: 188;
  display: inline-flex;
  align-items: center;
  gap: .7rem;
  padding: .85rem 1.4rem .85rem 1.2rem;
  background: var(--navy);
  color: var(--cream);
  font-family: var(--font-ui);
  font-size: .8rem;
  font-weight: 600;
  letter-spacing: .04em;
  text-decoration: none;
  border: 1px solid var(--gold);
  border-radius: 999px;
  box-shadow: 0 4px 18px rgba(1,22,32,.25);
  opacity: 0;
  transform: translateY(20px);
  pointer-events: none;
  transition: opacity .35s ease, transform .35s ease, background .25s, color .25s, padding .25s;
  white-space: nowrap;
  cursor: pointer;
}
.alu-cta-catalog.is-visible {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.alu-cta-catalog:hover,
.alu-cta-catalog:focus {
  background: var(--gold);
  color: var(--navy);
  outline: 0;
  padding-right: 1.6rem;
}
.alu-cta-catalog svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform .25s;
}
.alu-cta-catalog:hover svg { transform: translateX(3px); }

/* Cuando se abre el menú del FAB de contacto, este CTA se aparta
   sutilmente para no competir por el espacio */
body:has(#aluFabMenu.is-open) .alu-cta-catalog {
  opacity: .4;
  pointer-events: none;
}
/* Cuando hay banner de cookies, sube */
body:has(.cookie-banner.vis) .alu-cta-catalog {
  transform: translateY(-110px);
}

/* MOBILE: texto se oculta, queda icono + label corto */
@media (max-width: 640px) {
  .alu-cta-catalog {
    bottom: 1.2rem;
    right: 1.2rem;
    margin-right: 60px;
    padding: .7rem 1rem .7rem .9rem;
    font-size: .72rem;
  }
}
@media (max-width: 380px) {
  /* En móviles muy estrechos, solo el icono + texto mínimo */
  .alu-cta-catalog {
    padding: .65rem .9rem;
    font-size: .68rem;
    gap: .5rem;
  }
}

/* ── VOLVER AL CATÁLOGO ──
   Pill sticky exclusiva de las fichas de propiedad.
   Mismo lenguaje visual que .alu-cta-catalog (navy/cream/borde dorado/píldora)
   pero con chevron izquierdo y semántica de retorno.
   Aparece tras 80px de scroll. Misma coordinación con FAB y banner de cookies. */
.alu-back-catalog {
  position: fixed;
  bottom: 1.8rem;
  right: 1.8rem;
  margin-right: 70px;
  z-index: 188;
  display: inline-flex;
  align-items: center;
  gap: .7rem;
  padding: .85rem 1.4rem .85rem 1.2rem;
  background: var(--navy);
  color: var(--cream);
  font-family: var(--font-ui);
  font-size: .8rem;
  font-weight: 600;
  letter-spacing: .04em;
  text-decoration: none;
  border: 1px solid var(--gold);
  border-radius: 999px;
  box-shadow: 0 4px 18px rgba(1,22,32,.25);
  opacity: 0;
  transform: translateY(20px);
  pointer-events: none;
  transition: opacity .35s ease, transform .35s ease, background .25s, color .25s, padding .25s;
  white-space: nowrap;
  cursor: pointer;
}
.alu-back-catalog.is-visible {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.alu-back-catalog:hover,
.alu-back-catalog:focus {
  background: var(--gold);
  color: var(--navy);
  outline: 0;
  padding-left: 1.4rem;
}
.alu-back-catalog svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform .25s;
}
.alu-back-catalog:hover svg { transform: translateX(-3px); }
body:has(#aluFabMenu.is-open) .alu-back-catalog {
  opacity: .4;
  pointer-events: none;
}
body:has(.cookie-banner.vis) .alu-back-catalog {
  transform: translateY(-110px);
}
@media (max-width: 640px) {
  .alu-back-catalog {
    bottom: 1.2rem;
    right: 1.2rem;
    margin-right: 60px;
    padding: .7rem 1rem .7rem .9rem;
    font-size: .72rem;
  }
}
@media (max-width: 380px) {
  .alu-back-catalog {
    padding: .65rem .9rem;
    font-size: .68rem;
    gap: .5rem;
  }
}


/* ═══════════════════════════════════════════════════════════════
   CTA EDITORIAL UNIVERSAL · ALU
   Reemplaza TODOS los rectángulos dorados antiguos del sitio.
   Mismo lenguaje que .service-cta__btn (servicios), aplicado a:
   - .btn.btn--gold (vender, recursos/*)
   - .lp-hero__cta (herencias, parcelas)
   - .eval-cta-btn (evaluacion-parcela)
   - .calc-r-cta-btn (calculadora-coste-parcela)
   Selector múltiple para máxima cobertura sin tocar HTML.
   Los !important son necesarios para superar los inline styles
   antiguos que quedan en HTMLs sin tocar.
═══════════════════════════════════════════════════════════════ */
.btn.btn--gold,
.lp-hero__cta,
.eval-cta-btn,
.calc-r-cta-btn,
.alu-btn {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  font-family: var(--font-display) !important;
  font-size: 1.05rem !important;
  font-weight: 400 !important;
  font-style: italic !important;
  letter-spacing: .01em !important;
  text-transform: none !important;
  color: var(--navy) !important;
  background: transparent !important;
  padding: 1.1rem 3rem 1.1rem .2rem !important;
  border: none !important;
  border-radius: 0 !important;
  text-decoration: none !important;
  overflow: hidden !important;
  cursor: pointer;
  z-index: 1;
  box-shadow: none !important;
  transition: color .35s ease, padding .35s ease;
}
/* Línea fina dorada bajo el texto */
.btn.btn--gold::before,
.lp-hero__cta::before,
.eval-cta-btn::before,
.calc-r-cta-btn::before,
.alu-btn::before {
  content: '';
  position: absolute;
  left: .2rem;
  right: 4.8rem;
  bottom: .85rem;
  height: 1px;
  background: var(--gold);
  transform-origin: left center;
  transition: right .4s cubic-bezier(.65,.05,.36,1);
  z-index: -1;
}
/* Flecha → SVG dorado con margin-left explícito */
.btn.btn--gold::after,
.lp-hero__cta::after,
.eval-cta-btn::after,
.calc-r-cta-btn::after,
.alu-btn::after {
  content: '';
  width: 36px;
  height: 14px;
  margin-left: 2.4rem;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 14' fill='none' stroke='%23C0995A' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'><line x1='0' y1='7' x2='32' y2='7'/><polyline points='26,2 32,7 26,12'/></svg>");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  position: relative;
  flex-shrink: 0;
  transition: width .35s cubic-bezier(.65,.05,.36,1), margin-left .35s, filter .35s;
}
/* Hover: idéntico a .service-cta__btn */
.btn.btn--gold:hover,
.lp-hero__cta:hover,
.eval-cta-btn:hover,
.calc-r-cta-btn:hover,
.alu-btn:hover {
  color: var(--gold-dark) !important;
  background: transparent !important;
  padding-right: 3.8rem !important;
  transform: none !important;
}
.btn.btn--gold:hover::before,
.lp-hero__cta:hover::before,
.eval-cta-btn:hover::before,
.calc-r-cta-btn:hover::before,
.alu-btn:hover::before {
  right: 5.6rem;
}
.btn.btn--gold:hover::after,
.lp-hero__cta:hover::after,
.eval-cta-btn:hover::after,
.calc-r-cta-btn:hover::after,
.alu-btn:hover::after {
  width: 52px;
  margin-left: 2.8rem;
  filter: brightness(.78) saturate(1.1);
}
/* Focus accesible */
.btn.btn--gold:focus-visible,
.lp-hero__cta:focus-visible,
.eval-cta-btn:focus-visible,
.calc-r-cta-btn:focus-visible,
.alu-btn:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 6px;
  border-radius: 2px;
}
/* Mobile */
@media (max-width: 480px) {
  .btn.btn--gold,
  .lp-hero__cta,
  .eval-cta-btn,
  .calc-r-cta-btn,
  .alu-btn {
    font-size: .98rem !important;
    padding: 1rem 2.4rem 1rem .2rem !important;
  }
}
/* Caso especial · "Ver en Google Maps" en contacto: lo cubrimos con
   selector general inline ya tratado más arriba. */

/* Limpieza de iconos antiguos (📞 ✉) que quedan dentro de algunos botones */
.btn.btn--gold > svg,
.lp-hero__cta > svg,
.eval-cta-btn > svg,
.calc-r-cta-btn > svg {
  display: none;
}


/* ═══════════════════════════════════════════════════════════════
   ELEMENTOS REFACTOR OPCIÓN B · landings comerciales
   - .lp-pull-quote: cita destacada en Playfair italic
   - .lp-figure: imagen intercalada con caption opcional
   - .lp-bullets: lista de bullets visuales con icono dorado
═══════════════════════════════════════════════════════════════ */
.lp-pull-quote {
  max-width: 900px;
  margin: 5rem auto;
  padding: 2.5rem 3rem;
  text-align: center;
  position: relative;
}
.lp-pull-quote::before,
.lp-pull-quote::after {
  content: '';
  display: block;
  width: 60px;
  height: 1px;
  background: var(--gold);
  margin: 0 auto;
  opacity: .5;
}
.lp-pull-quote::before { margin-bottom: 2rem; }
.lp-pull-quote::after { margin-top: 2rem; }
.lp-pull-quote p {
  font-family: var(--font-display);
  font-size: clamp(1.4rem, 2.6vw, 2rem);
  font-weight: 400;
  font-style: italic;
  line-height: 1.4;
  color: var(--navy);
  margin: 0;
  letter-spacing: -.005em;
}
@media (max-width: 640px) {
  .lp-pull-quote {
    margin: 3rem auto;
    padding: 1.5rem 1.5rem;
  }
}

/* Imagen intercalada full-width entre secciones */
.lp-figure {
  margin: 4rem auto 5rem;
  max-width: 1100px;
  padding: 0 var(--gutter);
}
.lp-figure__img {
  width: 100%;
  height: auto;
  display: block;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}
.lp-figure__caption {
  font-family: var(--font-ui);
  font-size: .78rem;
  letter-spacing: .04em;
  color: var(--text-light);
  font-style: italic;
  margin-top: .9rem;
  text-align: center;
}
@media (max-width: 640px) {
  .lp-figure { margin: 2.5rem auto 3rem; padding: 0 1rem; }
}


/* ═══════════════════════════════════════════════════════════════
   VÍDEO HERO · index.html
   ESTRATEGIA: Imagen siempre visible como capa base.
   Vídeo encima solo en desktop. En mobile, vídeo oculto para
   ahorrar datos del usuario. Si el vídeo falla por cualquier
   motivo, la imagen sigue visible.
   - Desktop (>768px): imagen + vídeo encima en bucle
   - Mobile (≤768px): solo imagen estática
   - prefers-reduced-motion: solo imagen
═══════════════════════════════════════════════════════════════ */
.hero__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  z-index: 1;
}
/* Vídeo del hero · 2 capas alternadas para bucle invisible (crossfade) */
.hero__video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.hero__video--a {
  z-index: 2;
}
/* Capa B: empieza invisible. JS la hace visible con crossfade */
.hero__video--b {
  z-index: 3;
  opacity: 0;
  transition: opacity 1.2s ease-in-out;
}
.hero__video--b.is-visible {
  opacity: 1;
}
/* Accesibilidad: si el usuario pide reducir movimiento, solo imagen */
@media (prefers-reduced-motion: reduce) {
  .hero__video { display: none; }
}

/* ═══════════════════════════════════════════════════════════════
   VÍDEO EDITORIAL EN /NOSOTROS · Libro ALU sobre mesa
   Vídeo vertical (560×704, ratio 4:5) con texto al lado.
   Layout 2 col en desktop, apilado en mobile.
═══════════════════════════════════════════════════════════════ */
.alu-video-section {
  background: var(--cream);
  padding: 5rem var(--gutter);
}
.alu-video-section__wrap {
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 380px 1fr;
  gap: 4rem;
  align-items: center;
}
.alu-video-section__el {
  width: 100%;
  height: auto;
  aspect-ratio: 560 / 704;
  object-fit: cover;
  display: block;
  border-radius: 2px;
}
.alu-video-section__text { padding: 1rem 0; }
.alu-video-section__kicker {
  font-family: var(--font-ui);
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--gold-dark);
  margin: 0 0 1.4rem;
}
.alu-video-section__quote {
  font-family: var(--font-display);
  font-size: clamp(1.6rem, 3vw, 2.4rem);
  font-weight: 400;
  font-style: italic;
  color: var(--navy);
  line-height: 1.3;
  margin: 0;
  letter-spacing: -.005em;
}
@media (max-width: 768px) {
  .alu-video-section__wrap {
    grid-template-columns: 1fr;
    gap: 2rem;
    max-width: 500px;
  }
  .alu-video-section__el { max-width: 320px; margin: 0 auto; }
  .alu-video-section__text { text-align: center; }
}


/* En MOBILE el header es transparente sobre el vídeo del hero (igual que en PC).
   Cuando hace scroll, el JS aplica .scrolled que añade fondo navy translúcido. */


/* ═══════════════════════════════════════════════════════════════
   FIXES MOBILE · Sección herramientas
═══════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  .tools-section { padding: 3.5rem 1.25rem; }
  .tools-heading {
    font-size: 1.6rem;
    line-height: 1.2;
    margin-bottom: 2rem;
  }
  .tool-card {
    padding: 1.8rem 1.4rem;
  }
  .tool-icon {
    font-size: 2rem;
    margin-bottom: 1rem;
    opacity: .35;
  }
  .tool-title {
    font-size: 1.2rem;
    margin-bottom: .5rem;
  }
  .tool-text {
    font-size: .9rem;
    line-height: 1.55;
    margin-bottom: 1rem;
  }
  .tool-link {
    font-size: .72rem;
  }
}

/* ═══════════════════════════════════════════════════════════════
   FIXES MOBILE · Mejoras generales
═══════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  /* Que el header en mobile siempre tenga el fondo navy translúcido */
  .header {
    padding: .9rem 1.1rem;
  }
  /* Logo icon con tamaño correcto en mobile */
  .header__logo .logo-icon { height: 44px; }
  /* Espaciado en sección title */
  .section-title-block { margin-bottom: 2.5rem; }
  /* Garantizar que <section> respete padding mobile */
  .section { padding: 4rem 1.25rem; }
}


/* ═══════════════════════════════════════════════════════════════
   RESET DEFENSIVO · Sección herramientas
   Garantiza que el contenido de las tool-cards no se sobreponga
   independientemente del estado de las animaciones reveal.
═══════════════════════════════════════════════════════════════ */
.tool-card {
  position: relative;
  display: flex !important;
  flex-direction: column;
  gap: 0;
  text-decoration: none;
  overflow: hidden;
}
.tool-card .tool-icon,
.tool-card .tool-title,
.tool-card .tool-text,
.tool-card .tool-link {
  position: relative;
  z-index: 1;
  margin: 0;
  display: block;
}
.tool-card .tool-icon { margin-bottom: 1rem; }
.tool-card .tool-title { margin-bottom: .6rem; line-height: 1.2; }
.tool-card .tool-text { margin-bottom: 1.2rem; }
.tool-card .tool-link { margin-top: auto; }




/* ═══════════════════════════════════════════════════════════════
   BLOQUEO DEL SCROLL · Cuando el overlay del menú está abierto
   Aplicar overflow:hidden en html bloquea el scroll del documento
   PERO permite que el .nav-overlay (con z-index 120 y overflow:auto)
   tenga su propio scroll. Es la técnica más fiable en iOS Safari.
═══════════════════════════════════════════════════════════════ */
html.nav-open {
  overflow: hidden;
  height: 100%;
}
html.nav-open body {
  overflow: hidden;
  height: 100%;
}


/* ═══════════════════════════════════════════════════════════════
   LENIS · CSS oficial para nested scroll y prevent
   Permite que elementos con [data-lenis-prevent] tengan scroll
   nativo del navegador (independiente del smooth scroll de Lenis).
   Sin esto, Lenis intercepta TODOS los gestos de scroll del documento
   y bloquea el scroll dentro de overlays/modales.
═══════════════════════════════════════════════════════════════ */
.lenis.lenis-smooth [data-lenis-prevent] {
  overscroll-behavior: contain;
}
.lenis.lenis-stopped {
  overflow: hidden;
}

/* ============================================================
   FLOTANTES LIGEROS · v002 · 24/09/2026
   Sustituye el aspecto de .alu-fab, .alu-top, .alu-cta-catalog y
   .alu-back-catalog: sin fondo, sin caja, sin píldora. Solo dibujo
   y texto. El color se adapta al fondo que pasa por debajo:
   js/main.js mide el fondo de cada pieza y le pone .fl-light
   (fondo claro: tinta navy) o .fl-dark (fondo oscuro: tinta cream).
   Sin JS se queda en tinta cream con halo navy.
   ============================================================ */
.alu-fab__btn, .alu-fab__menu a, .alu-top, .alu-cta-catalog, .alu-back-catalog {
  --fl-ink: var(--cream);
  --fl-accent: var(--gold);
  --fl-halo: rgba(1,22,32,.7);
  color: var(--fl-ink);
  transition: color .45s ease, opacity .35s ease, transform .35s ease;
}
.fl-light { --fl-ink: var(--navy); --fl-accent: var(--gold-dark); --fl-halo: rgba(242,232,224,.95); }
.fl-dark  { --fl-ink: var(--cream); --fl-accent: var(--gold); --fl-halo: rgba(1,22,32,.7); }

/* Botón de contacto: la casa sola, trazo fino */
.alu-fab__btn {
  width: 48px; height: 48px;
  background: none; border: 0; border-radius: 0; box-shadow: none;
  -webkit-tap-highlight-color: transparent;
}
.alu-fab__btn:hover { transform: none; box-shadow: none; }
.alu-fab__btn svg {
  width: 26px; height: 26px;
  stroke: currentColor; stroke-width: 18;
  filter: drop-shadow(0 0 6px var(--fl-halo)) drop-shadow(0 0 2px var(--fl-halo));
  transition: transform .35s ease, stroke .3s;
}
.alu-fab__btn:hover svg, .alu-fab__btn:focus-visible svg { stroke: var(--fl-accent); transform: translateY(-2px); }
.alu-fab__btn:focus-visible { outline: 1px solid var(--fl-accent); outline-offset: 2px; }
/* Menú abierto: la casa cede a un aspa fina */
.alu-fab__btn::before, .alu-fab__btn::after {
  content: ""; position: absolute; width: 22px; height: 1.5px;
  background: currentColor; opacity: 0; transform: rotate(0);
  box-shadow: 0 0 6px var(--fl-halo);
  transition: opacity .25s, transform .35s ease;
}
.alu-fab__btn { position: relative; }
.alu-fab:has(.alu-fab__menu.is-open) .alu-fab__btn svg { opacity: 0; transform: scale(.6); }
.alu-fab:has(.alu-fab__menu.is-open) .alu-fab__btn::before { opacity: 1; transform: rotate(45deg); }
.alu-fab:has(.alu-fab__menu.is-open) .alu-fab__btn::after  { opacity: 1; transform: rotate(-45deg); }

/* Menú: sin panel. Tres líneas alineadas a la derecha, icono al final */
.alu-fab__menu {
  background: none; box-shadow: none; border-radius: 0;
  padding: 0; min-width: 0; bottom: 56px; right: 0;
  display: flex; flex-direction: column; align-items: flex-end; gap: .15rem;
  transform: none;
}
.alu-fab__menu a {
  flex-direction: row-reverse; gap: .75rem;
  padding: .7rem .6rem .7rem 1rem; min-height: 44px;
  background: none;
  font-size: .72rem; font-weight: 500; letter-spacing: .14em; text-transform: uppercase;
  white-space: nowrap;
  text-shadow: 0 0 14px var(--fl-halo), 0 0 6px var(--fl-halo), 0 0 2px var(--fl-halo);
  opacity: 0; transform: translateY(8px);
}
.alu-fab__menu a:hover { background: none; color: var(--fl-accent); }
.alu-fab__menu a svg { width: 18px; height: 18px; filter: drop-shadow(0 0 5px var(--fl-halo)) drop-shadow(0 0 2px var(--fl-halo)); }
.alu-fab__menu a .fa-wa svg { fill: currentColor; }
.alu-fab__menu a span { display: flex; color: var(--fl-accent); }
.alu-fab__menu.is-open a { opacity: 1; transform: none; }
.alu-fab__menu.is-open a:nth-child(3) { transition-delay: 0s; }
.alu-fab__menu.is-open a:nth-child(2) { transition-delay: .05s; }
.alu-fab__menu.is-open a:nth-child(1) { transition-delay: .1s; }
@media (max-width: 480px) {
  .alu-fab__btn { width: 44px; height: 44px; }
  .alu-fab__btn svg { width: 24px; height: 24px; }
  .alu-fab__menu { bottom: 50px; }
}

/* Subir arriba: solo el chevron */
.alu-top {
  background: none; border: 0; border-radius: 0; box-shadow: none;
}
.alu-top svg {
  stroke: currentColor; stroke-width: 1.6;
  filter: drop-shadow(0 0 5px var(--fl-halo)) drop-shadow(0 0 2px var(--fl-halo));
}
.alu-top:hover { background: none; box-shadow: none; transform: translateY(-3px); }
.alu-top:hover svg { stroke: var(--fl-accent); }
.alu-top:focus-visible { outline: 1px solid var(--fl-accent); outline-offset: 2px; }

/* Ver catálogo / Volver al catálogo: texto con subrayado dorado */
.alu-cta-catalog, .alu-back-catalog {
  background: none; border: 0; border-radius: 0; box-shadow: none;
  padding: .75rem .4rem; min-height: 44px; margin-right: 64px;
  font-size: .72rem; font-weight: 500; letter-spacing: .14em; text-transform: uppercase;
  text-shadow: 0 0 14px var(--fl-halo), 0 0 6px var(--fl-halo), 0 0 2px var(--fl-halo);
  gap: .6rem;
}
.alu-cta-catalog span, .alu-back-catalog span {
  background: linear-gradient(var(--fl-accent), var(--fl-accent)) no-repeat left bottom / 30% 1px;
  padding-bottom: 3px;
  transition: background-size .35s ease;
}
.alu-cta-catalog svg, .alu-back-catalog svg {
  width: 15px; height: 15px; stroke: var(--fl-accent); stroke-width: 1.5;
  filter: drop-shadow(0 0 5px var(--fl-halo)) drop-shadow(0 0 2px var(--fl-halo));
}
.alu-cta-catalog:hover, .alu-cta-catalog:focus,
.alu-back-catalog:hover, .alu-back-catalog:focus {
  background: none; color: var(--fl-ink); padding: .75rem .4rem; outline: 0;
}
.alu-cta-catalog:hover span, .alu-cta-catalog:focus-visible span,
.alu-back-catalog:hover span, .alu-back-catalog:focus-visible span { background-size: 100% 1px; }
.alu-cta-catalog:hover svg { transform: none; }
/* Con el menú de contacto abierto, el enlace al catálogo desaparece del todo */
body:has(#aluFabMenu.is-open) .alu-cta-catalog,
body:has(#aluFabMenu.is-open) .alu-back-catalog { opacity: 0; pointer-events: none; }
@media (max-width: 640px) {
  .alu-cta-catalog, .alu-back-catalog { margin-right: 54px; padding: .75rem .3rem; font-size: .68rem; letter-spacing: .12em; }
}
@media (max-width: 380px) {
  .alu-cta-catalog, .alu-back-catalog { font-size: .64rem; letter-spacing: .1em; gap: .45rem; }
}
@media (prefers-reduced-motion: reduce) {
  .alu-fab__btn, .alu-fab__menu a, .alu-top, .alu-cta-catalog, .alu-back-catalog,
  .alu-fab__btn svg, .alu-cta-catalog span, .alu-back-catalog span { transition: none; }
}