/* ---------- Fonts ---------- */
@font-face{
  font-family: 'Posterama';
  src: url('../assets/fonts/posterama-2001.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* ---------- Tokens ---------- */
:root{
  --orange: #C46B14;
  --orange-dark: #9E5610;
  --orange-light: #E9A968;
  --orange-tint: #FBEEE0;
  --ink: #211D1A;
  --ink-soft: #55504A;
  --paper: #FAF7F2;
  --paper-alt: #F2EBE1;
  --line: #E6DDD0;
  --white: #FFFFFF;

  --font-display: 'Posterama', 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-body: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  --radius: 4px;
  --shadow-soft: 0 20px 45px -25px rgba(33,29,26,0.35);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  font-family:var(--font-body);
  color:var(--ink);
  background:var(--paper);
  -webkit-font-smoothing:antialiased;
  line-height:1.6;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3,h4{ font-family:var(--font-display); font-weight:600; margin:0 0 .5em; letter-spacing:.01em; }
p{ margin:0 0 1em; }
ul{ margin:0; padding:0; list-style:none; }
button{ font-family:inherit; cursor:pointer; }

.wrap{ max-width:1180px; margin:0 auto; padding:0 24px; }
.narrow{ max-width:760px; }
.center{ text-align:center; }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:14px 28px;
  border-radius:var(--radius);
  font-weight:700;
  font-size:.95rem;
  letter-spacing:.02em;
  border:1px solid transparent;
  transition:all .2s ease;
  white-space:nowrap;
}
.btn-primary{ background:var(--orange); color:var(--white); }
.btn-primary:hover{ background:var(--orange-dark); transform:translateY(-1px); }
.btn-outline-light{ border-color:rgba(255,255,255,.7); color:var(--white); }
.btn-outline-light:hover{ background:rgba(255,255,255,.12); }
.btn-sm{ padding:10px 20px; font-size:.85rem; }
.btn-lg{ padding:17px 36px; font-size:1.02rem; }
.btn-block{ width:100%; margin-top:20px; }

/* ---------- WhatsApp float ---------- */
.whatsapp-float{
  position:fixed; right:22px; bottom:22px; z-index:60;
  width:58px; height:58px; border-radius:50%;
  background:#25D366; color:#fff;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 12px 28px -8px rgba(0,0,0,.45);
  cursor:pointer; transition:transform .2s ease;
}
.whatsapp-float:hover{ transform:scale(1.07); }

/* ---------- Header ---------- */
.site-header{
  position:fixed; top:0; left:0; right:0; z-index:50;
  background:transparent;
  transition:background .3s ease, box-shadow .3s ease, padding .3s ease;
  padding:18px 0;
}
.site-header.scrolled{
  background:rgba(250,247,242,.92);
  backdrop-filter:blur(10px);
  box-shadow:0 1px 0 var(--line);
  padding:10px 0;
}
.header-inner{ display:flex; align-items:center; gap:28px; }
.brand{ display:flex; align-items:center; margin-right:auto; }
.brand-mark{ height:46px; width:auto; transition:height .3s ease; }
.site-header.scrolled .brand-mark{ height:38px; }
.nav{ display:flex; gap:30px; }
.nav a{ font-weight:600; font-size:.92rem; color:var(--white); transition:color .2s ease; }
.site-header.scrolled .nav a{ color:var(--ink); }
.nav a:hover{ color:var(--orange-light); }
.site-header.scrolled .nav a:hover{ color:var(--orange); }
.header-cta{ flex-shrink:0; }
.nav-toggle{ display:none; background:none; border:0; padding:6px; flex-direction:column; gap:5px; }
.nav-toggle span{ width:24px; height:2px; background:var(--white); display:block; transition:background .2s; }
.site-header.scrolled .nav-toggle span{ background:var(--ink); }

/* ---------- Hero ---------- */
.hero{ position:relative; min-height:100vh; display:flex; align-items:flex-end; color:var(--white); overflow:hidden; }
.hero-media{ position:absolute; inset:0; }
.hero-media img{ width:100%; height:100%; object-fit:cover; }
.hero-scrim{ position:absolute; inset:0; background:linear-gradient(0deg, rgba(20,16,13,.82) 0%, rgba(20,16,13,.35) 45%, rgba(20,16,13,.25) 100%); }
.hero-content{ position:relative; padding-bottom:88px; padding-top:160px; max-width:760px; }
.eyebrow{ text-transform:uppercase; letter-spacing:.22em; font-size:.78rem; font-weight:700; color:var(--orange-light); margin-bottom:14px; }
.hero h1{ font-size:clamp(3rem,7vw,5.2rem); line-height:.98; margin-bottom:20px; }
.hero-lead{ font-size:1.15rem; color:rgba(255,255,255,.88); max-width:560px; margin-bottom:34px; }
.hero-actions{ display:flex; gap:16px; flex-wrap:wrap; }

/* ---------- Stats ---------- */
.stats{ background:var(--ink); color:var(--white); padding:52px 0; }
.stats-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; text-align:center; }
.stat-num{ display:block; font-family:var(--font-display); font-size:2.6rem; color:var(--orange-light); font-weight:600; }
.stat-label{ display:block; font-size:.85rem; color:rgba(255,255,255,.72); margin-top:6px; }

/* ---------- Sections ---------- */
.section{ padding:110px 0; }
.section.alt{ background:var(--paper-alt); }

.section-bg{ position:relative; background-size:cover; background-position:center; }
.section-bg > .wrap{ position:relative; z-index:1; }
.section-bg::before{ content:""; position:absolute; inset:0; }
.section-bg-light{ background-image:url('../assets/stock/nosotros-bg.jpg'); }
.section-bg-light::before{ background:linear-gradient(180deg, rgba(250,247,242,.96) 0%, rgba(250,247,242,.9) 55%, rgba(250,247,242,.97) 100%); }
.section-bg-dark{ background-image:url('../assets/stock/cta-bg.jpg'); }
.section-bg-dark::before{ background:linear-gradient(180deg, rgba(20,16,13,.86), rgba(20,16,13,.82)); }
.section-bg-dark{ color:var(--white); }
.section-bg-dark h2{ color:var(--white); }
.section-bg-dark .section-lead{ color:rgba(255,255,255,.82); }
.section-head{ margin-bottom:56px; }
.section-eyebrow{ text-transform:uppercase; letter-spacing:.2em; font-size:.78rem; font-weight:700; color:var(--orange); margin-bottom:14px; }
.section h2{ font-size:clamp(2.1rem,4vw,3rem); color:var(--ink); }
.section-lead{ font-size:1.08rem; color:var(--ink-soft); max-width:620px; }
.section-head.center .section-lead{ margin-left:auto; margin-right:auto; }

/* ---------- Models ---------- */
.models-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.model-card{
  background:var(--white); border:1px solid var(--line); border-radius:var(--radius);
  overflow:hidden; display:flex; flex-direction:column; position:relative;
  box-shadow:var(--shadow-soft);
}
.model-card.featured{ border-color:var(--orange); }
.model-badge{
  position:absolute; top:16px; left:16px; z-index:2;
  background:var(--orange); color:var(--white);
  font-size:.72rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  padding:6px 12px; border-radius:2px;
}
.model-media{ aspect-ratio:4/3; overflow:hidden; background:var(--paper-alt); }
.model-media img{ width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.model-card:hover .model-media img{ transform:scale(1.05); }
.model-body{ padding:30px 26px 26px; display:flex; flex-direction:column; flex:1; }
.model-body h3{ font-size:2rem; color:var(--ink); margin-bottom:14px; }
.model-specs{ display:flex; gap:24px; margin-bottom:18px; padding-bottom:18px; border-bottom:1px solid var(--line); }
.model-specs li{ display:flex; flex-direction:column; }
.model-specs span{ font-size:.75rem; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-soft); }
.model-specs strong{ font-size:1.15rem; color:var(--orange-dark); font-weight:800; }
.model-plantas p{ font-size:.92rem; color:var(--ink-soft); margin-bottom:.6em; }
.link-toggle{
  background:none; border:0; padding:0; margin:4px 0 6px;
  color:var(--orange-dark); font-weight:700; font-size:.88rem;
  text-decoration:underline; text-underline-offset:3px; align-self:flex-start;
}
.model-plans{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:6px; }
.model-plans figure{ margin:0; }
.model-plans img{ border-radius:2px; border:1px solid var(--line); }
.model-plans figcaption{ font-size:.72rem; color:var(--ink-soft); text-align:center; margin-top:4px; }
.model-body .btn{ margin-top:auto; }

.specs-note{ margin-top:64px; background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:36px; }
.specs-note h4{ font-size:1rem; text-transform:uppercase; letter-spacing:.08em; color:var(--orange); margin-bottom:22px; font-family:var(--font-body); font-weight:800; }
.specs-note-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.specs-note-grid strong{ display:block; margin-bottom:6px; font-size:.95rem; }
.specs-note-grid p{ font-size:.85rem; color:var(--ink-soft); margin:0; }

/* ---------- Amenities ---------- */
.amenities-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-bottom:36px; }
.amenity-card{ margin:0; border-radius:var(--radius); overflow:hidden; position:relative; aspect-ratio:3/4; box-shadow:var(--shadow-soft); }
.amenity-card img{ width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.amenity-card:hover img{ transform:scale(1.06); }
.amenity-card figcaption{
  position:absolute; left:0; right:0; bottom:0; padding:16px;
  background:linear-gradient(0deg, rgba(20,16,13,.85), transparent);
  color:var(--white); font-weight:700; font-size:.92rem;
}
.amenity-tags{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; }
.amenity-tags li{ border:1px solid var(--line); background:var(--white); padding:8px 18px; border-radius:999px; font-size:.85rem; font-weight:600; color:var(--ink-soft); }

/* ---------- CTA band ---------- */
.cta-band h2{ margin-bottom:16px; }
.cta-band .section-lead{ margin-left:auto; margin-right:auto; margin-bottom:32px; }

/* ---------- Location ---------- */
.location-grid{ display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; }
.location-detail{ margin-bottom:20px; }
.location-detail strong{ display:block; font-size:.78rem; text-transform:uppercase; letter-spacing:.06em; color:var(--orange); margin-bottom:4px; }
.location-detail p{ margin:0; color:var(--ink-soft); }
.location-map{ border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-soft); aspect-ratio:1/1; }
.location-map iframe{ width:100%; height:100%; border:0; }

/* ---------- Footer ---------- */
.site-footer{ background:var(--ink); color:rgba(255,255,255,.75); padding:64px 0 30px; }
.footer-brand{ height:44px; margin-bottom:24px; }
.footer-legal{ font-size:.82rem; max-width:720px; color:rgba(255,255,255,.55); margin-bottom:32px; }
.footer-bottom{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; border-top:1px solid rgba(255,255,255,.12); padding-top:24px; font-size:.85rem; }
.footer-bottom a{ color:var(--orange-light); font-weight:700; }
.footer-bottom a:hover{ text-decoration:underline; }

/* ---------- Responsive ---------- */
@media (max-width: 980px){
  .models-grid{ grid-template-columns:1fr; max-width:480px; margin:0 auto; }
  .specs-note-grid{ grid-template-columns:1fr 1fr; }
  .amenities-grid{ grid-template-columns:1fr 1fr; }
  .location-grid{ grid-template-columns:1fr; }
  .stats-grid{ grid-template-columns:1fr 1fr; }
}

@media (max-width: 760px){
  .nav{
    position:fixed; top:0; right:0; height:100vh; width:78%; max-width:320px;
    background:var(--ink); flex-direction:column; padding:100px 32px; gap:26px;
    transform:translateX(100%); transition:transform .3s ease; z-index:45;
  }
  .nav.open{ transform:translateX(0); }
  .nav a{ color:var(--white); font-size:1.05rem; }
  .nav-toggle{ display:flex; }
  .header-cta{ display:none; }
  .hero-content{ padding-top:120px; padding-bottom:60px; }
  .section{ padding:72px 0; }
  .specs-note-grid{ grid-template-columns:1fr; }
  .amenities-grid{ grid-template-columns:1fr 1fr; }
  .model-plans{ grid-template-columns:1fr 1fr; }
}

@media (max-width: 520px){
  .amenities-grid{ grid-template-columns:1fr; }
  .stats-grid{ grid-template-columns:1fr 1fr; }
  .hero-actions{ flex-direction:column; }
  .hero-actions .btn{ width:100%; }
}
