/* ==========================================================================
   Abaroa Realty + — theme.css  ·  Sistema de diseño compartido (canónico)
   Verde Abaroa #0C3A33 + hueso #F4F1E8 + tinta. Zodiak (display) + Switzer (text).
   Calibre Engel & Völkers · Zillow · luxury. Anti-AI-slop estricto.
   Reveal gating: TODO visible por default; sólo <html.js-anim> oculta reveals.
   ========================================================================== */

/* ----------------------------------------------------------------- TOKENS  */
:root{
  /* — Color (muestreado del logo real) — */
  --green:      #0C3A33;
  --green-deep: #082A24;
  --green-700:  #13473C;
  --bone:       #F4F1E8;
  --paper:      #FBF9F3;
  --ink:        #15170F;
  --stone:      #6E776C;
  --line:       rgba(12,58,51,0.14);
  --line-dk:    rgba(244,241,232,0.16);
  --cream:      #F4F1E8;
  --green-soft: rgba(12,58,51,0.045);

  /* — Tipografía — */
  --ff-display: 'Zodiak', Georgia, 'Times New Roman', serif;
  --ff-text:    'Switzer', system-ui, -apple-system, sans-serif;

  --t-hero: clamp(44px, 7.4vw, 112px);
  --t-h1:   clamp(34px, 5vw, 72px);
  --t-h2:   clamp(27px, 3.6vw, 48px);
  --t-h3:   clamp(19px, 1.9vw, 27px);
  --t-lead: clamp(17px, 1.5vw, 22px);
  --t-body: 16.5px;
  --t-sm:   13.5px;
  --t-xs:   11.5px;

  /* — Spacing (base 4) — */
  --s-1: 4px;  --s-2: 8px;  --s-3: 12px; --s-4: 16px; --s-5: 20px;
  --s-6: 24px; --s-8: 32px; --s-10: 40px; --s-12: 48px; --s-16: 64px;
  --s-20: 80px; --s-24: 96px;

  /* — Layout — */
  --maxw: 1280px;
  --pad:  clamp(20px, 5vw, 72px);
  --section: clamp(80px, 12vw, 170px);
  --radius: 3px;
  --radius-lg: 4px;

  /* — Motion — */
  --ease-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-io:   cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: .35s;
  --dur:      .6s;
  --dur-slow: 1s;

  /* — Chrome — */
  --header-h: 86px;
}

/* ----------------------------------------------------------------- RESET   */
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ -webkit-text-size-adjust:100%; }
html.lenis,html.lenis body{ height:auto; }
.lenis.lenis-smooth{ scroll-behavior:auto !important; }
.lenis.lenis-smooth [data-lenis-prevent]{ overscroll-behavior:contain; }
.lenis.lenis-stopped{ overflow:hidden; }
body{
  font-family:var(--ff-text);
  font-size:var(--t-body);
  line-height:1.6;
  color:var(--ink);
  background:var(--bone);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  font-feature-settings:"kern","liga","calt";
  overflow-x:hidden;
}
img,picture,video{ display:block; max-width:100%; height:auto; }
button,input,select,textarea{ font:inherit; color:inherit; background:none; border:none; }
button{ cursor:pointer; }
a{ color:inherit; text-decoration:none; }
ul,ol{ list-style:none; }
::selection{ background:var(--green); color:var(--bone); }

/* ----------------------------------------------------------------- BASE    */
h1,h2,h3,h4{
  font-family:var(--ff-display);
  font-weight:400;
  line-height:1.04;
  letter-spacing:-0.015em;
  color:var(--ink);
  text-wrap:balance;
}
h1{ font-size:var(--t-h1); }
h2{ font-size:var(--t-h2); }
h3{ font-size:var(--t-h3); letter-spacing:-0.01em; line-height:1.12; }
p{ text-wrap:pretty; }

.bg-bone{ background:var(--bone); color:var(--ink); }
.bg-paper{ background:var(--paper); color:var(--ink); }
.bg-green{ background:var(--green); color:var(--bone); }
.bg-green .eyebrow{ color:var(--bone); opacity:.7; }
.bg-green h1,.bg-green h2,.bg-green h3{ color:var(--bone); }

/* ----------------------------------------------------------------- LAYOUT  */
.wrap{
  width:100%;
  max-width:var(--maxw);
  margin-inline:auto;
  padding-inline:var(--pad);
}
.section{ padding-block:var(--section); }
.section--tight{ padding-block:clamp(56px,8vw,110px); }

/* hairline divider */
.rule{ height:1px; background:var(--line); border:0; width:100%; }
.bg-green .rule{ background:var(--line-dk); }

/* eyebrow / kicker */
.eyebrow{
  font-family:var(--ff-text);
  font-weight:600;
  font-size:var(--t-xs);
  text-transform:uppercase;
  letter-spacing:0.16em;
  color:var(--stone);
  display:inline-flex;
  align-items:center;
  gap:var(--s-3);
}
.eyebrow::before{
  content:"";
  width:26px; height:1px;
  background:currentColor;
  opacity:.55;
}
.eyebrow--plain::before{ display:none; }

.lead{
  font-size:var(--t-lead);
  line-height:1.5;
  color:var(--stone);
  max-width:54ch;
  text-wrap:pretty;
}
.bg-green .lead{ color:rgba(244,241,232,.72); }

/* ----------------------------------------------------------------- HEADER  */
.site-header{
  position:fixed;
  inset:0 0 auto 0;
  z-index:90;
  height:var(--header-h);
  display:flex;
  align-items:center;
  transition:background var(--dur) var(--ease-expo),
             box-shadow var(--dur) var(--ease-expo),
             transform var(--dur-fast) var(--ease-expo),
             border-color var(--dur) var(--ease-expo);
  background:transparent;
  border-bottom:1px solid transparent;
}
.site-header.scrolled{
  background:var(--bone);
  border-bottom:1px solid var(--line);
}
.site-header.hide{ transform:translateY(-101%); }

.site-header__inner{
  width:100%;
  max-width:var(--maxw);
  margin-inline:auto;
  padding-inline:var(--pad);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--s-8);
}
.brand{ display:flex; align-items:center; flex:0 0 auto; }
.brand img{ height:48px; width:auto; transition:opacity var(--dur) var(--ease-expo), height var(--dur) var(--ease-expo); }
.site-header.scrolled .brand img{ height:40px; }
@media (max-width:680px){ .brand img{ height:40px; } }
.brand__cream{ display:block; }
.brand__green{ display:none; position:absolute; }
.site-header.scrolled .brand__cream{ display:none; }
.site-header.scrolled .brand__green{ display:block; position:static; }

/* nav */
.nav{ display:flex; align-items:center; gap:clamp(18px,2vw,34px); }
.nav__link{
  font-family:var(--ff-text);
  font-weight:500;
  font-size:var(--t-sm);
  letter-spacing:0.01em;
  color:var(--bone);
  position:relative;
  padding-block:6px;
  transition:color var(--dur-fast) var(--ease-expo);
}
.nav__link::after{
  content:"";
  position:absolute; left:0; bottom:0;
  width:100%; height:1px;
  background:currentColor;
  transform:scaleX(0); transform-origin:left;
  transition:transform var(--dur) var(--ease-expo);
}
.nav__link:hover::after,
.nav__link[aria-current="page"]::after{ transform:scaleX(1); }
.nav__link[aria-current="page"]{ opacity:1; }
.site-header.scrolled .nav__link{ color:var(--ink); }

.header__right{ display:flex; align-items:center; gap:var(--s-5); }

/* hamburger */
.nav-toggle{
  display:none;
  width:38px; height:38px;
  position:relative;
  flex:0 0 auto;
}
.nav-toggle span{
  position:absolute; left:8px; right:8px; height:1.5px;
  background:var(--bone);
  transition:transform var(--dur-fast) var(--ease-expo),
             opacity var(--dur-fast) var(--ease-expo),
             background var(--dur) var(--ease-expo);
}
.nav-toggle span:nth-child(1){ top:14px; }
.nav-toggle span:nth-child(2){ bottom:14px; }
.site-header.scrolled .nav-toggle span{ background:var(--ink); }
.nav-open .nav-toggle span:nth-child(1){ top:18px; transform:rotate(45deg); }
.nav-open .nav-toggle span:nth-child(2){ bottom:18px; transform:rotate(-45deg); }

/* mobile drawer */
.mobile-nav{
  position:fixed; inset:0;
  z-index:80;
  background:var(--green);
  color:var(--bone);
  padding:calc(var(--header-h) + 28px) var(--pad) var(--pad);
  display:flex; flex-direction:column;
  gap:var(--s-2);
  opacity:0; visibility:hidden;
  transform:translateY(-12px);
  transition:opacity var(--dur) var(--ease-expo),
             transform var(--dur) var(--ease-expo),
             visibility var(--dur);
}
.nav-open .mobile-nav{ opacity:1; visibility:visible; transform:none; }
.mobile-nav a{
  font-family:var(--ff-display);
  font-size:clamp(28px,8vw,44px);
  font-weight:400;
  letter-spacing:-0.02em;
  padding-block:var(--s-3);
  border-bottom:1px solid var(--line-dk);
  color:var(--bone);
}
.mobile-nav__cta{ margin-top:var(--s-8); }
.mobile-nav__meta{
  margin-top:auto;
  font-size:var(--t-sm);
  color:rgba(244,241,232,.62);
  letter-spacing:0.02em;
}

/* ----------------------------------------------------------------- BUTTONS */
.btn{
  --btn-fg:var(--bone);
  --btn-bg:var(--green);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:var(--s-3);
  font-family:var(--ff-text);
  font-weight:600;
  font-size:var(--t-sm);
  letter-spacing:0.04em;
  line-height:1;
  padding:15px 26px;
  border-radius:var(--radius);
  position:relative;
  overflow:hidden;
  isolation:isolate;
  color:var(--btn-fg);
  transition:color var(--dur) var(--ease-expo);
  will-change:transform;
}
.btn > *{ position:relative; z-index:1; }
.btn .btn__arrow{
  display:inline-block;
  transition:transform var(--dur) var(--ease-expo);
}
.btn:hover .btn__arrow{ transform:translateX(4px); }

/* primary — fill-up on hover (verde -> verde-deep wipe) */
.btn-primary{
  background:var(--green);
  color:var(--bone);
}
.btn-primary::before{
  content:"";
  position:absolute; inset:0;
  z-index:0;
  background:var(--green-deep);
  transform:translateY(101%);
  transition:transform var(--dur) var(--ease-expo);
}
.btn-primary:hover::before{ transform:translateY(0); }

/* ghost — outline verde, fills on hover */
.btn-ghost{
  background:transparent;
  color:var(--green);
  border:1px solid var(--green);
}
.btn-ghost::before{
  content:"";
  position:absolute; inset:0;
  z-index:0;
  background:var(--green);
  transform:translateY(101%);
  transition:transform var(--dur) var(--ease-expo);
}
.btn-ghost:hover{ color:var(--bone); }
.btn-ghost:hover::before{ transform:translateY(0); }

/* ghost on dark */
.bg-green .btn-ghost{ color:var(--bone); border-color:var(--line-dk); }
.bg-green .btn-ghost::before{ background:var(--bone); }
.bg-green .btn-ghost:hover{ color:var(--green); }

/* small / link button */
.btn-sm{ padding:11px 18px; }
.btn-link{
  display:inline-flex; align-items:center; gap:var(--s-2);
  font-family:var(--ff-text); font-weight:600;
  font-size:var(--t-sm); letter-spacing:0.04em;
  color:var(--green);
  padding-bottom:3px;
  border-bottom:1px solid var(--line);
  transition:border-color var(--dur) var(--ease-expo);
}
.btn-link .btn__arrow{ transition:transform var(--dur) var(--ease-expo); }
.btn-link:hover{ border-color:var(--green); }
.btn-link:hover .btn__arrow{ transform:translateX(4px); }
.bg-green .btn-link{ color:var(--bone); border-color:var(--line-dk); }
.bg-green .btn-link:hover{ border-color:var(--bone); }

/* ----------------------------------------------------------------- SEARCH  */
.search-bar{
  display:flex;
  align-items:stretch;
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:var(--radius);
  overflow:hidden;
  width:100%;
}
.search-bar__seg{
  flex:1 1 0;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:3px;
  padding:14px clamp(16px,2vw,24px);
  border-right:1px solid var(--line);
  position:relative;
  min-width:0;
}
.search-bar__label{
  font-family:var(--ff-text);
  font-weight:600;
  font-size:var(--t-xs);
  text-transform:uppercase;
  letter-spacing:0.14em;
  color:var(--stone);
}
.search-bar__seg select,
.search-bar__seg input{
  font-family:var(--ff-text);
  font-weight:500;
  font-size:15px;
  color:var(--ink);
  letter-spacing:0.005em;
  width:100%;
  cursor:pointer;
  appearance:none;
  -webkit-appearance:none;
  background:transparent;
  text-overflow:ellipsis;
}
.search-bar__seg input{ cursor:text; }
.search-bar__seg select{
  background-image:
    linear-gradient(45deg,transparent 50%,var(--stone) 50%),
    linear-gradient(135deg,var(--stone) 50%,transparent 50%);
  background-position:
    calc(100% - 9px) calc(50% + 1px),
    calc(100% - 4px) calc(50% + 1px);
  background-size:5px 5px,5px 5px;
  background-repeat:no-repeat;
  padding-right:18px;
}
.search-bar__seg select:focus,
.search-bar__seg input:focus{ outline:none; }
.search-bar__action{
  flex:0 0 auto;
  display:flex;
  border-right:0;
  padding:6px;
}
.search-bar__action .btn{ width:100%; height:100%; white-space:nowrap; }

/* ----------------------------------------------------------------- CARD    */
.listing-card{
  display:block;
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:var(--radius);
  overflow:hidden;
  position:relative;
  transition:border-color var(--dur) var(--ease-expo),
             transform var(--dur) var(--ease-expo);
  will-change:transform;
}
.listing-card:hover{
  border-color:rgba(12,58,51,0.32);
  transform:translateY(-3px);
}
.listing-card__media{
  position:relative;
  aspect-ratio:4/3;
  overflow:hidden;
  background:var(--green-deep);
}
.listing-card__media img{
  width:100%; height:100%;
  object-fit:cover;
  transition:transform var(--dur-slow) var(--ease-expo);
}
.listing-card:hover .listing-card__media img{ transform:scale(1.05); }

.tag{
  position:absolute;
  top:var(--s-4); left:var(--s-4);
  z-index:2;
  display:inline-flex; align-items:center;
  font-family:var(--ff-text);
  font-weight:600;
  font-size:var(--t-xs);
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--bone);
  background:rgba(8,42,36,0.82);
  backdrop-filter:saturate(1.1);
  padding:7px 12px;
  border-radius:2px;
}
.tag--rental{ background:rgba(8,42,36,0.82); }
.tag--sale{ background:rgba(8,42,36,0.82); }
.tag--type{
  left:auto; right:var(--s-4);
  background:rgba(244,241,232,0.92);
  color:var(--green);
}

.listing-card__body{
  padding:var(--s-6) var(--s-6) var(--s-8);
  display:flex; flex-direction:column;
  gap:var(--s-2);
}
.listing-card__price{
  font-family:var(--ff-text);
  font-weight:600;
  font-size:21px;
  letter-spacing:-0.005em;
  color:var(--ink);
  line-height:1.1;
}
.listing-card__price .per{
  font-weight:500;
  font-size:13px;
  color:var(--stone);
  letter-spacing:0.02em;
}
.listing-card__title{
  font-family:var(--ff-display);
  font-weight:400;
  font-size:var(--t-h3);
  line-height:1.14;
  letter-spacing:-0.01em;
  color:var(--ink);
  margin-top:2px;
  /* clamp to 2 lines */
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.listing-card__zone{
  font-family:var(--ff-text);
  font-size:var(--t-sm);
  color:var(--stone);
  letter-spacing:0.01em;
  display:flex; align-items:center; gap:var(--s-2);
}
.specs{
  display:flex; align-items:center;
  gap:var(--s-4);
  margin-top:var(--s-4);
  padding-top:var(--s-4);
  border-top:1px solid var(--line);
  font-family:var(--ff-text);
  font-size:var(--t-sm);
  font-weight:500;
  color:var(--ink);
}
.specs li{ display:flex; align-items:baseline; gap:5px; }
.specs li .specs__n{ font-weight:600; }
.specs li .specs__u{ color:var(--stone); font-weight:400; font-size:12.5px; }
.specs li + li::before{
  content:"";
  width:3px; height:3px; border-radius:50%;
  background:var(--line);
  align-self:center;
  margin-right:var(--s-3);
}

/* hover CTA reveal */
.listing-card__cta{
  margin-top:var(--s-4);
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--ff-text); font-weight:600;
  font-size:var(--t-sm); letter-spacing:0.04em;
  color:var(--green);
  opacity:0; transform:translateY(6px);
  transition:opacity var(--dur) var(--ease-expo),
             transform var(--dur) var(--ease-expo);
}
.listing-card:hover .listing-card__cta{ opacity:1; transform:none; }
.listing-card__cta .btn__arrow{ transition:transform var(--dur) var(--ease-expo); }
.listing-card:hover .listing-card__cta .btn__arrow{ transform:translateX(4px); }

/* featured variant — taller media, larger type */
.listing-card--featured{ display:grid; grid-template-columns:1fr; }
.listing-card--featured .listing-card__media{ aspect-ratio:3/2; }
.listing-card--featured .listing-card__title{ font-size:clamp(24px,3vw,38px); }
.listing-card--featured .listing-card__price{ font-size:25px; }
.listing-card--featured .listing-card__body{ padding:var(--s-8) var(--s-10) var(--s-10); }
@media (min-width:900px){
  .listing-card--featured{ grid-template-columns:1.25fr 1fr; }
  .listing-card--featured .listing-card__media{ aspect-ratio:auto; height:100%; min-height:460px; }
  .listing-card--featured .listing-card__body{ justify-content:center; }
}

/* grid helper for cards */
.card-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:clamp(20px,2.4vw,32px);
}
@media (min-width:680px){ .card-grid{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:1080px){ .card-grid{ grid-template-columns:repeat(3,1fr); } }

/* ----------------------------------------------------------------- STAT    */
.stat-band{
  display:grid;
  grid-template-columns:1fr;
  gap:var(--s-10) var(--s-8);
}
@media (min-width:680px){ .stat-band{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:900px){ .stat-band{ grid-template-columns:repeat(4,1fr); } }
.stat{ display:flex; flex-direction:column; gap:var(--s-2); }
.stat__n{
  font-family:var(--ff-display);
  font-weight:300;
  font-size:clamp(40px,5.5vw,72px);
  line-height:1;
  letter-spacing:-0.03em;
  color:var(--bone);
}
.bg-bone .stat__n,.bg-paper .stat__n{ color:var(--green); }
.stat__label{
  font-family:var(--ff-text);
  font-weight:500;
  font-size:var(--t-sm);
  letter-spacing:0.02em;
  line-height:1.45;
  color:rgba(244,241,232,.66);
  max-width:24ch;
}
.bg-bone .stat__label,.bg-paper .stat__label{ color:var(--stone); }
.stat__sep{ width:32px; height:1px; background:var(--line-dk); margin-top:2px; }
.bg-bone .stat__sep,.bg-paper .stat__sep{ background:var(--line); }

/* ----------------------------------------------------------------- MARQUEE */
.marquee{
  overflow:hidden;
  width:100%;
  --marquee-gap:clamp(28px,4vw,64px);
}
.marquee__track{
  display:flex;
  align-items:center;
  gap:var(--marquee-gap);
  width:max-content;
  will-change:transform;
}
.marquee__item{
  font-family:var(--ff-display);
  font-weight:300;
  font-size:clamp(34px,6vw,80px);
  letter-spacing:-0.02em;
  line-height:1;
  color:var(--bone);
  white-space:nowrap;
  display:flex; align-items:center; gap:var(--marquee-gap);
}
.bg-bone .marquee__item,.bg-paper .marquee__item{ color:var(--green); }
.marquee__item::after{
  content:"";
  width:8px; height:8px;
  border-radius:50%;
  background:currentColor;
  opacity:.4;
  flex:0 0 auto;
}
/* CSS fallback animation when JS not running (no js-anim) */
.marquee__track{ animation:marquee-slide 52s linear infinite; }
.js-anim .marquee__track{ animation:none; }
@keyframes marquee-slide{
  from{ transform:translateX(0); }
  to{ transform:translateX(calc(-50% - (var(--marquee-gap) / 2))); }
}

/* ----------------------------------------------------------------- FOOTER  */
.site-footer{
  background:var(--green-deep);
  color:var(--bone);
  padding-block:clamp(64px,9vw,120px) var(--s-10);
}
.site-footer__top{
  display:grid;
  grid-template-columns:1fr;
  gap:var(--s-16) var(--s-12);
  padding-bottom:clamp(48px,7vw,88px);
  border-bottom:1px solid var(--line-dk);
}
@media (min-width:680px){ .site-footer__top{ grid-template-columns:1.4fr 1fr 1fr; } }
@media (min-width:1080px){ .site-footer__top{ grid-template-columns:1.6fr 1fr 1fr 1.1fr; } }
.site-footer__brand img{ height:46px; width:auto; margin-bottom:var(--s-6); }
.site-footer__tagline{
  font-family:var(--ff-display);
  font-weight:300;
  font-size:clamp(20px,2.2vw,28px);
  line-height:1.18;
  letter-spacing:-0.01em;
  color:var(--bone);
  max-width:22ch;
}
.footer-col__h{
  font-family:var(--ff-text);
  font-weight:600;
  font-size:var(--t-xs);
  text-transform:uppercase;
  letter-spacing:0.16em;
  color:rgba(244,241,232,.5);
  margin-bottom:var(--s-5);
}
.footer-col ul{ display:flex; flex-direction:column; gap:var(--s-3); }
.footer-col a,.footer-col li{
  font-family:var(--ff-text);
  font-size:var(--t-body);
  color:rgba(244,241,232,.8);
  letter-spacing:0.005em;
  transition:color var(--dur-fast) var(--ease-expo);
}
.footer-col a:hover{ color:var(--bone); }
.site-footer__bottom{
  display:flex; flex-wrap:wrap; gap:var(--s-4) var(--s-8);
  align-items:center; justify-content:space-between;
  padding-top:var(--s-8);
  font-family:var(--ff-text);
  font-size:var(--t-sm);
  color:rgba(244,241,232,.55);
  letter-spacing:0.01em;
}
.site-footer__bottom a{ color:rgba(244,241,232,.7); transition:color var(--dur-fast) var(--ease-expo); }
.site-footer__bottom a:hover{ color:var(--bone); }
.footer-credit{ display:flex; flex-wrap:wrap; gap:var(--s-2) var(--s-6); align-items:center; }

/* ----------------------------------------------------------------- REVEAL  */
/* DEFAULT: everything visible. Only when <html class="js-anim"> do we hide. */
.js-anim .reveal{ opacity:0; transform:translateY(22px); }
.js-anim .reveal-line{ overflow:hidden; display:block; }
.js-anim .reveal-line > *{ display:block; transform:translateY(105%); transition:transform 1.05s cubic-bezier(.16,1,.3,1); transition-delay:var(--rl-delay,0s); }
.js-anim .reveal-line.is-in > *{ transform:translateY(0); }
.js-anim [data-count]{ /* count-up handled in JS, keep visible */ }

/* ----------------------------------------------------------------- MISC    */
.cursor-dot,.cursor-ring{
  position:fixed; top:0; left:0;
  pointer-events:none; z-index:9999;
  border-radius:50%;
  mix-blend-mode:difference;
  opacity:0;
  transition:opacity var(--dur) var(--ease-expo);
}
.cursor-dot{ width:6px; height:6px; background:var(--bone); transform:translate(-50%,-50%); }
.cursor-ring{ width:36px; height:36px; border:1px solid var(--bone); transform:translate(-50%,-50%); }
.has-cursor .cursor-dot,.has-cursor .cursor-ring{ opacity:1; }
@media (hover:none){ .cursor-dot,.cursor-ring{ display:none; } }

/* utility: media frame with subtle inner hairline (luxury, no soft shadow) */
.frame{ position:relative; border-radius:var(--radius); overflow:hidden; }
.frame::after{
  content:""; position:absolute; inset:0;
  box-shadow:inset 0 0 0 1px rgba(12,58,51,0.10);
  pointer-events:none; border-radius:inherit;
}

/* ----------------------------------------------------------------- A11Y    */
:focus-visible{ outline:2px solid var(--green); outline-offset:3px; border-radius:2px; }
.bg-green :focus-visible{ outline-color:var(--bone); }
.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

/* ----------------------------------------------------------------- RESPONSIVE */
@media (max-width:900px){
  .nav,.header__right .btn{ display:none; }
  .nav-toggle{ display:block; }
  .search-bar{ flex-direction:column; }
  .search-bar__seg{ border-right:0; border-bottom:1px solid var(--line); }
  .search-bar__action{ padding:var(--s-3); }
  .search-bar__action .btn{ padding:15px; }
}
@media (max-width:680px){
  .specs{ flex-wrap:wrap; gap:var(--s-3); }
  .specs li + li::before{ margin-right:var(--s-2); }
}

/* ----------------------------------------------------------------- REDUCED MOTION */
@media (prefers-reduced-motion:reduce){
  *{ animation:none !important; transition:none !important; scroll-behavior:auto !important; }
  .marquee__track{ animation:none !important; }
  .js-anim .reveal,
  .js-anim .reveal-line > *{ opacity:1 !important; transform:none !important; }
}

/* =================================================================
   V3 · CORREDOR BINACIONAL TJ–SD (mapa editorial, sin fotografía)
   Panel verde invertido: el frente industrial se lee como plano,
   no como interior. Alcance: sólo .vrow--map / .corridor-*.
   ================================================================= */
/* evita el grid blowout: el SVG no debe imponer su ancho intrínseco */
.vrow.vrow--map{ grid-template-columns:minmax(0,1fr); }
@media (min-width:900px){
  .vrow.vrow--map{ grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); }
}
.vrow__media--map{ background:var(--green); min-width:0; max-width:100%; }
.vrow__media--map::after{ box-shadow:inset 0 0 0 1px var(--line-dk); }
.corridor__svg{ display:block; width:100%; max-width:100%; height:auto; aspect-ratio:5/4; }

/* halo cartográfico: el rótulo recorta la retícula que pasa por detrás */
.corridor__place,.corridor__tag,.corridor__micro{
  paint-order:stroke fill; stroke:#0C3A33; stroke-width:5; stroke-linejoin:round;
}
.corridor__place{
  font-family:var(--ff-display); font-weight:300; font-size:34px;
  letter-spacing:-.01em; stroke-width:7;
}
.corridor__tag{
  font-family:var(--ff-text); font-weight:600; font-size:13px;
  letter-spacing:.15em; text-transform:uppercase;
}
.corridor__micro{
  font-family:var(--ff-text); font-weight:500; font-size:12px;
  letter-spacing:.18em; text-transform:uppercase;
}

/* rótulos que cambian de longitud según ancho (el viewBox es fijo) */
.corridor__sm{ display:none; }
@media (max-width:899px){
  .corridor__sm{ display:inline; }
  .corridor__lg{ display:none; }
}

/* mobile-first legibility: el viewBox no cambia, la tipografía sí */
@media (max-width:899px){
  .corridor__place{ font-size:46px; }
  .corridor__tag{   font-size:19px; letter-spacing:.13em; }
  .corridor__micro{ font-size:17px; letter-spacing:.14em; }
}
@media (max-width:480px){
  .corridor__place{ font-size:54px; stroke-width:10; }
  .corridor__tag{   font-size:22px; letter-spacing:.11em; stroke-width:7; }
  .corridor__micro{ font-size:20px; letter-spacing:.12em; stroke-width:7; }
}

/* trazo: sólo se oculta cuando el sitio corre en modo animado */
.js-anim .corridor .corridor__draw{ stroke-dasharray:1; stroke-dashoffset:1; }
.js-anim .corridor .corridor__fade{ opacity:0; }
.js-anim .corridor.is-in .corridor__draw{
  animation:corridorDraw .95s var(--ease-expo) var(--d,0s) forwards;
}
.js-anim .corridor.is-in .corridor__fade{
  animation:corridorFade .6s var(--ease-expo) var(--d,0s) forwards;
}
@keyframes corridorDraw{ to{ stroke-dashoffset:0; } }
@keyframes corridorFade{ from{ opacity:0; } to{ opacity:1; } }

@media (prefers-reduced-motion:reduce){
  .js-anim .corridor .corridor__draw{ stroke-dasharray:none !important; stroke-dashoffset:0 !important; }
  .js-anim .corridor .corridor__fade{ opacity:1 !important; }
}

/* =================================================================
   INDUSTRIAL · industrial.html (inventario en comercialización,
   fuera de EasyBroker). Alcance: sólo .ind-*. No redefine tokens
   ni modifica reglas previas.
   ================================================================= */

/* botón crema — primario sobre fondo verde */
.ind-btn-cream{ background:var(--bone); color:var(--green); }
.ind-btn-cream::before{ content:""; position:absolute; inset:0; z-index:0;
  background:var(--green-700); transform:translateY(101%);
  transition:transform var(--dur) var(--ease-expo); }
.ind-btn-cream:hover::before{ transform:translateY(0); }
.ind-btn-cream:hover{ color:var(--bone); }

/* ------------------------------------------------------------ HERO */
.ind-hero{ position:relative; overflow:hidden; }
.ind-hero__inner{
  position:relative; z-index:2;
  padding-top:calc(var(--header-h) + clamp(36px,7vw,84px));
  padding-bottom:clamp(40px,6vw,88px);
}
.ind-hero h1{
  margin-top:var(--s-6);
  font-size:var(--t-h1); font-weight:300;
  letter-spacing:-0.02em; line-height:1.02;
  max-width:16ch;
}
.ind-hero .lead{ margin-top:var(--s-6); max-width:52ch; }
.ind-hero__cta{ display:flex; flex-wrap:wrap; gap:var(--s-4); margin-top:clamp(26px,3.6vw,38px); }
.ind-hero__media{ position:relative; width:100%; }
.ind-hero__media img{ width:100%; aspect-ratio:16/10; object-fit:cover; object-position:center 55%; }
.ind-pills{ display:flex; flex-wrap:wrap; gap:var(--s-2) var(--s-3); margin-top:clamp(26px,3.4vw,40px); }
.ind-pill{
  font-family:var(--ff-text); font-weight:500; font-size:var(--t-sm);
  color:rgba(244,241,232,.9); border:1px solid var(--line-dk);
  border-radius:100px; padding:8px 16px;
}
.ind-pill b{ color:var(--bone); font-weight:600; }
@media (min-width:1000px){
  .ind-hero{ min-height:clamp(560px,74svh,780px); display:flex; align-items:center; }
  .ind-hero__copy{ max-width:58%; }
  .ind-hero__media{ position:absolute; top:0; right:0; bottom:0; width:46%; margin:0; }
  .ind-hero__media img{ height:100%; aspect-ratio:auto; }
  .ind-hero__media::after{
    content:""; position:absolute; inset:0; pointer-events:none;
    background:linear-gradient(90deg, rgba(8,42,36,1) 0%, rgba(8,42,36,.52) 34%, rgba(8,42,36,.10) 100%);
  }
}

/* ------------------------------------------------- BLOQUE DE COMPLEJO */
.ind-cx{ display:grid; grid-template-columns:1fr; gap:clamp(28px,4vw,44px); }
@media (min-width:980px){
  .ind-cx{ grid-template-columns:minmax(0,5.4fr) minmax(0,6.6fr); gap:clamp(40px,5vw,84px); align-items:start; }
  .ind-cx--flip .ind-cx__media{ order:2; }
  .ind-cx--flip .ind-cx__data{ order:1; }
}
/* mobile: primero el encabezado del complejo, luego la fotografía */
@media (max-width:979px){
  .ind-cx__data{ order:1; }
  .ind-cx__media{ order:2; }
}
.ind-cx__num{
  font-family:var(--ff-text); font-weight:600; font-size:var(--t-xs);
  letter-spacing:.16em; text-transform:uppercase; color:var(--stone);
  display:flex; align-items:center; gap:var(--s-3); flex-wrap:wrap;
}
.ind-cx__num b{ color:var(--green); font-weight:600; }
.ind-cx h2{ margin-top:var(--s-4); max-width:16ch; }
.ind-cx__addr{
  font-family:var(--ff-text); font-size:14px; line-height:1.55; color:var(--stone);
  margin-top:var(--s-5); padding-top:var(--s-5); border-top:1px solid var(--line);
  max-width:44ch;
}
.ind-cx__addr b{ color:var(--ink); font-weight:600; }
.ind-cx__media{ display:grid; gap:var(--s-4); align-content:start; }
@media (min-width:620px) and (max-width:979px){ .ind-cx__media--pair{ grid-template-columns:1fr 1fr; } }
.ind-cx__media figure{ margin:0; }
.ind-cx__media img{ width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:var(--radius); }
.ind-cap{
  font-family:var(--ff-text); font-size:12.5px; letter-spacing:.02em;
  color:var(--stone); margin-top:var(--s-3);
}

/* tag operación */
.ind-tag{
  display:inline-flex; align-items:center;
  font-family:var(--ff-text); font-weight:600; font-size:var(--t-xs);
  letter-spacing:.14em; text-transform:uppercase;
  color:var(--green); background:var(--green-soft);
  border:1px solid var(--line); border-radius:100px; padding:5px 11px;
}

/* ------------------------------------------------------ UNIDADES */
.ind-units{ margin-top:clamp(24px,3vw,34px); border-top:1px solid var(--line); }
.ind-unit{
  display:grid; grid-template-columns:1fr; gap:var(--s-3);
  padding:var(--s-6) 0; border-bottom:1px solid var(--line);
}
@media (min-width:560px){
  .ind-unit{ grid-template-columns:minmax(0,1fr) auto; align-items:start; gap:var(--s-4) var(--s-8); }
}
.ind-unit__name{ font-family:var(--ff-text); font-weight:600; font-size:16.5px; color:var(--ink); }
.ind-unit__meta{ font-family:var(--ff-text); font-size:14px; line-height:1.55; color:var(--stone); margin-top:5px; }
.ind-unit__meta b{ color:var(--ink); font-weight:600; }
.ind-unit__price{ text-align:left; }
@media (min-width:560px){ .ind-unit__price{ text-align:right; } }
.ind-unit__from{
  display:block; font-family:var(--ff-text); font-weight:600; font-size:var(--t-xs);
  letter-spacing:.14em; text-transform:uppercase; color:var(--stone); margin-bottom:7px;
}
.ind-unit__n{
  font-family:var(--ff-display); font-weight:400; font-size:clamp(23px,2.4vw,30px);
  line-height:1; color:var(--green); white-space:nowrap;
}
.ind-cur{
  font-family:var(--ff-text); font-weight:600; font-size:12px;
  letter-spacing:.12em; margin-left:7px; color:var(--green);
  border:1px solid var(--line); border-radius:3px; padding:3px 7px;
  vertical-align:2px; display:inline-block;
}
.ind-unit__per{ display:block; font-family:var(--ff-text); font-weight:500; font-size:13px; color:var(--stone); margin-top:8px; }

/* lista de características con guion */
.ind-feats{ margin-top:var(--s-6); display:flex; flex-direction:column; gap:var(--s-3); }
.ind-feats li{
  font-family:var(--ff-text); font-size:14.5px; line-height:1.55; color:var(--stone);
  position:relative; padding-left:26px;
}
.ind-feats li::before{
  content:""; position:absolute; left:0; top:.72em;
  width:14px; height:1px; background:var(--green); opacity:.55;
}

/* variante sobre verde */
.ind-cx--dark .ind-cx__num{ color:rgba(244,241,232,.6); }
.ind-cx--dark .ind-cx__num b{ color:var(--bone); }
.ind-cx--dark .ind-cx__addr{ color:rgba(244,241,232,.72); border-top-color:var(--line-dk); }
.ind-cx--dark .ind-cx__addr b{ color:var(--bone); }
.ind-cx--dark .ind-units{ border-top-color:var(--line-dk); }
.ind-cx--dark .ind-unit{ border-bottom-color:var(--line-dk); }
.ind-cx--dark .ind-unit__name{ color:var(--bone); }
.ind-cx--dark .ind-unit__meta{ color:rgba(244,241,232,.66); }
.ind-cx--dark .ind-unit__meta b{ color:var(--bone); }
.ind-cx--dark .ind-unit__from,
.ind-cx--dark .ind-unit__per{ color:rgba(244,241,232,.6); }
.ind-cx--dark .ind-unit__n{ color:var(--bone); }
.ind-cx--dark .ind-cur{ color:var(--bone); border-color:var(--line-dk); }
.ind-cx--dark .ind-feats li{ color:rgba(244,241,232,.72); }
.ind-cx--dark .ind-feats li::before{ background:var(--bone); opacity:.5; }
.ind-cx--dark .ind-tag{ color:var(--bone); background:rgba(244,241,232,.07); border-color:var(--line-dk); }

/* panel tipográfico (sin fotografía) */
.ind-panel{
  background:rgba(244,241,232,.05); border:1px solid var(--line-dk);
  border-radius:var(--radius-lg); padding:clamp(24px,3.4vw,40px);
}
.ind-panel__k{
  font-family:var(--ff-text); font-weight:600; font-size:var(--t-xs);
  letter-spacing:.16em; text-transform:uppercase; color:rgba(244,241,232,.6);
}
.ind-panel h3{ color:var(--bone); margin-top:var(--s-4); font-size:clamp(21px,2.4vw,28px); max-width:20ch; }
.ind-units + .ind-panel{ margin-top:clamp(28px,3.4vw,42px); }
.ind-panel p{ font-family:var(--ff-text); font-size:14.5px; line-height:1.62; color:rgba(244,241,232,.72); margin-top:var(--s-4); max-width:46ch; }

/* nota de moneda / advertencia editorial */
.ind-note{
  display:flex; gap:var(--s-4); align-items:flex-start;
  background:var(--paper); border:1px solid var(--line); border-left:3px solid var(--green);
  border-radius:var(--radius); padding:var(--s-5) var(--s-6);
  margin-top:clamp(32px,4vw,48px);
}
.ind-note__i{ font-family:var(--ff-display); color:var(--green); font-size:20px; line-height:1.1; }
.ind-note p{ font-family:var(--ff-text); font-size:14px; line-height:1.6; color:var(--ink); margin:0; max-width:78ch; }
.ind-note b{ color:var(--green); font-weight:600; }

/* ------------------------------------------------------ SERVICIOS */
.ind-serv{ display:grid; grid-template-columns:1fr; gap:0 clamp(28px,4vw,64px); margin-top:clamp(32px,4vw,52px); }
@media (min-width:680px){ .ind-serv{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:1080px){ .ind-serv{ grid-template-columns:repeat(3,1fr); } }
.ind-sv{ border-top:1px solid var(--line); padding:var(--s-6) 0 var(--s-8); }
.ind-sv__k{ font-family:var(--ff-display); font-weight:300; font-size:26px; color:var(--green); opacity:.42; line-height:1; }
.ind-sv h3{ font-size:18px; margin-top:var(--s-4); }
.ind-sv p{ font-family:var(--ff-text); font-size:14px; line-height:1.62; color:var(--stone); margin-top:var(--s-3); }

/* ------------------------------------------------------- GALERÍA */
.ind-gal{ display:grid; grid-template-columns:1fr; gap:var(--s-4); margin-top:clamp(32px,4vw,52px); }
.ind-gal figure{ margin:0; position:relative; border-radius:var(--radius); overflow:hidden; }
.ind-gal img{ width:100%; aspect-ratio:4/3; object-fit:cover; }
@media (min-width:900px){
  .ind-gal{ grid-template-columns:repeat(12,1fr); gap:clamp(12px,1.4vw,20px); }
  .ind-g4{ grid-column:span 4; }
  .ind-g5{ grid-column:span 5; }
  .ind-g7{ grid-column:span 7; }
  .ind-g12{ grid-column:span 12; }
  /* ratios pareados para que cada fila cierre a la misma altura */
  .ind-g7 img{ aspect-ratio:21/10; }
  .ind-g5 img{ aspect-ratio:3/2; }
  .ind-g12 img{ aspect-ratio:21/9; }
}

/* ---------------------------------------------------------- PLANO */
.ind-plano{
  background:var(--paper); border:1px solid var(--line);
  border-radius:var(--radius-lg); padding:clamp(14px,2.4vw,28px);
  margin-top:clamp(32px,4vw,52px);
}
.ind-plano__scroll{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
.ind-plano__scroll img{
  width:100%; min-width:640px; aspect-ratio:16/9;
  object-fit:cover; object-position:center top;
  background:#fff; border-radius:2px;
}
@media (min-width:820px){ .ind-plano__scroll img{ min-width:0; } }
.ind-plano__hint{
  font-family:var(--ff-text); font-weight:600; font-size:var(--t-xs);
  letter-spacing:.14em; text-transform:uppercase; color:var(--stone);
  margin-bottom:var(--s-3);
}
@media (min-width:820px){ .ind-plano__hint{ display:none; } }
.ind-legend{ display:flex; flex-wrap:wrap; gap:var(--s-3) var(--s-8); margin-top:var(--s-5); padding-top:var(--s-5); border-top:1px solid var(--line); }
.ind-legend span{
  display:inline-flex; align-items:center; gap:var(--s-3);
  font-family:var(--ff-text); font-weight:600; font-size:12.5px;
  letter-spacing:.06em; text-transform:uppercase; color:var(--stone);
}
.ind-legend i{ width:11px; height:11px; border-radius:2px; background:var(--green); display:block; }
.ind-legend i.ind-legend__out{ background:transparent; border:1px solid var(--stone); }
.ind-chips{ display:flex; flex-wrap:wrap; gap:var(--s-2); margin-top:var(--s-6); }
.ind-chip{
  font-family:var(--ff-text); font-weight:600; font-size:12px;
  letter-spacing:.06em; text-transform:uppercase;
  color:var(--green); background:var(--green-soft);
  border:1px solid var(--line); border-radius:100px; padding:7px 13px;
}
.ind-chip--out{ color:var(--stone); background:transparent; opacity:.75; }

/* ----------------------------------------------------------- PASOS */
.ind-steps{ display:grid; grid-template-columns:1fr; gap:0 clamp(32px,4vw,72px); margin-top:clamp(32px,4vw,52px); }
@media (min-width:820px){ .ind-steps{ grid-template-columns:repeat(3,1fr); } }
.ind-step{ border-top:1px solid var(--line-dk); padding:var(--s-6) 0 var(--s-8); }
.ind-step__k{ font-family:var(--ff-display); font-weight:300; font-size:26px; color:var(--bone); opacity:.45; line-height:1; }
.ind-step h3{ color:var(--bone); font-size:18px; margin-top:var(--s-4); }
.ind-step p{ font-family:var(--ff-text); font-size:14px; line-height:1.62; color:rgba(244,241,232,.7); margin-top:var(--s-3); }

/* ------------------------------------------------------------ FAQ */
.ind-faq{ display:grid; grid-template-columns:1fr; gap:0 clamp(32px,4vw,72px); margin-top:clamp(28px,3.4vw,44px); }
@media (min-width:900px){ .ind-faq{ grid-template-columns:1fr 1fr; } }
.ind-faq__item{ border-top:1px solid var(--line); padding:var(--s-6) 0; }
.ind-faq__item h3{ font-size:17px; max-width:32ch; }
.ind-faq__item p{ font-family:var(--ff-text); font-size:14px; line-height:1.62; color:var(--stone); margin-top:var(--s-3); max-width:52ch; }

/* ---------------------------------------------------------- CIERRE */
.ind-close{ display:grid; grid-template-columns:1fr; gap:var(--s-8); align-items:center; }
@media (min-width:820px){ .ind-close{ grid-template-columns:1.3fr 1fr; gap:var(--s-16); } }
.ind-close h2{ max-width:18ch; }
.ind-close .lead{ margin-top:var(--s-5); }
.ind-close__cta{ margin-top:clamp(24px,3vw,32px); display:flex; flex-wrap:wrap; gap:var(--s-4); }
.ind-close__card{ background:var(--green-deep); border-radius:var(--radius-lg); padding:clamp(28px,4vw,40px); }
.ind-close__card .ind-name{ font-family:var(--ff-display); font-weight:400; font-size:24px; color:var(--bone); }
.ind-close__card .ind-role{ font-family:var(--ff-text); font-size:var(--t-sm); color:rgba(244,241,232,.6); margin-top:6px; letter-spacing:.03em; }
.ind-close__list{ margin-top:var(--s-6); display:flex; flex-direction:column; gap:var(--s-3); }
.ind-close__list a{ font-family:var(--ff-text); font-size:14.5px; color:rgba(244,241,232,.9); }
.ind-close__list a:hover{ color:var(--bone); }

/* enlace a Google Maps dentro de la direccion de un complejo (industrial.html) */
.ind-maplink{ display:inline-block; margin-top:8px; font-family:var(--ff-text); font-size:13.5px;
  font-weight:600; letter-spacing:.02em; color:var(--green); border-bottom:1px solid rgba(12,58,51,.28);
  padding-bottom:2px; transition:border-color .25s ease, opacity .25s ease; }
.ind-maplink:hover{ border-color:var(--green); opacity:.75; }
.ind-cx--dark .ind-maplink{ color:rgba(244,241,232,.92); border-bottom-color:rgba(244,241,232,.34); }
.ind-cx--dark .ind-maplink:hover{ border-bottom-color:rgba(244,241,232,.9); }
