/* LANDING — secciones específicas */

/* Image breaks — módulos editoriales entre bloques de texto */
.img-break{
  position:relative; margin:0; height:520px; overflow:hidden;
  border-bottom:1px solid var(--rule);
}
.img-break img{ width:100%; height:100%; object-fit:cover; display:block }
.img-break figcaption{
  position:absolute; left:24px; bottom:24px;
  display:flex; flex-direction:column; gap:6px;
}
.img-break figcaption .tag{ background:rgba(242,239,233,.92); padding:4px 10px }

.img-quote{
  padding:0; background:var(--bone-2);
  border-bottom:1px solid var(--rule);
}
.iq-grid{
  display:grid; grid-template-columns:1.4fr 1fr 1.4fr; gap:0;
  align-items:stretch; min-height:520px;
}
.iq-img{ margin:0; position:relative; overflow:hidden }
.iq-img img{ width:100%; height:100%; object-fit:cover; display:block }
.iq-text{
  padding:60px 48px;
  display:flex; flex-direction:column; justify-content:center; gap:18px;
  background:var(--bone);
  border-left:1px solid var(--rule-soft);
  border-right:1px solid var(--rule-soft);
}
.iq-quote{
  font-size:clamp(36px, 4vw, 56px);
  line-height:.95; letter-spacing:-.01em;
  margin:6px 0 12px; font-weight:400;
}
.iq-foot{
  font-size:14px; line-height:1.65; color:var(--ink-2);
  max-width:38ch; margin:0;
}

@media (max-width:980px){
  .img-break{ height:340px }
  .iq-grid{ grid-template-columns:1fr; min-height:auto }
  .iq-img{ aspect-ratio:16/9 }
  .iq-text{ padding:48px 32px; border:0; border-top:1px solid var(--rule-soft); border-bottom:1px solid var(--rule-soft) }
}


/* 7 claves */
.claves{ padding:120px 0 100px; border-bottom:1px solid var(--rule); background:var(--paper) }
.claves .sec-head{ margin-bottom:56px }
.claves-grid{
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:repeat(3, 1fr); gap:1px;
  background:var(--rule-soft); border:1px solid var(--rule-soft);
}
.claves-grid li{
  background:var(--bone); padding:36px 32px 40px;
  display:flex; flex-direction:column; gap:14px;
  transition:background .2s;
}
.claves-grid li:hover{ background:var(--paper) }
.claves-grid li.span-2{ grid-column:span 2; background:var(--ink); color:var(--bone) }
.claves-grid li.span-2 p{ color:#bdb6a8 }
.claves-grid li.span-2 .cl-num{ color:var(--bone); opacity:.4 }
.cl-num{
  font-family:var(--mono); font-size:11px; letter-spacing:.3em;
  color:var(--accent); font-weight:500;
}
.claves-grid h3{
  font-family:var(--serif); font-weight:400; font-size:28px;
  margin:0; line-height:1.1; letter-spacing:-.005em;
}
.claves-grid p{ margin:0; color:var(--ink-2); font-size:14px; line-height:1.55; max-width:38ch }

/* Proceso de compra */
.proceso{ padding:120px 0 100px; border-bottom:1px solid var(--rule); background:var(--ink); color:var(--bone) }
.proceso .eyebrow{ color:#9c958a }
.proceso .sec-head h2{ color:var(--bone) }
.proceso-intro{ max-width:680px; margin:24px 0 0; color:#d8d2c5; font-size:16px; line-height:1.65 }
.proceso-list{
  list-style:none; margin:60px 0 0; padding:0;
  display:grid; grid-template-columns:repeat(2, 1fr); gap:0;
  border-top:1px solid #2c2c2c; border-left:1px solid #2c2c2c;
}
.proceso-list li{
  display:flex; gap:22px; align-items:flex-start;
  padding:32px 28px;
  border-right:1px solid #2c2c2c; border-bottom:1px solid #2c2c2c;
}
.ps-num{
  font-family:var(--serif); font-size:48px; line-height:.9; font-style:italic;
  color:var(--accent); flex-shrink:0; min-width:64px;
}
.proceso-list h3{
  font-family:var(--serif); font-weight:400; font-size:22px;
  margin:0 0 8px; color:var(--bone); letter-spacing:-.005em;
}
.proceso-list p{ margin:0; color:#bdb6a8; font-size:14px; line-height:1.6 }
.proceso-foot{
  display:block; text-align:center;
  margin-top:48px; color:#7a7468;
}

@media (max-width:980px){
  .claves-grid{ grid-template-columns:repeat(2, 1fr) }
  .claves-grid li.span-2{ grid-column:span 2 }
  .proceso-list{ grid-template-columns:1fr }
}
@media (max-width:640px){
  .claves-grid{ grid-template-columns:1fr }
  .claves-grid li.span-2{ grid-column:span 1 }
}


/* HERO */
.hero{
  display:grid; grid-template-columns:1.05fr 1fr;
  gap:0; min-height:calc(100vh - 64px);
  border-bottom:1px solid var(--rule);
}
.hero-inner{
  padding:64px 56px 56px;
  display:flex; flex-direction:column; justify-content:space-between;
  border-right:1px solid var(--rule);
}
.hero-meta{ display:flex; justify-content:space-between; align-items:center }
.hero-meta .tag-right{ color:var(--accent) }
.hero-title{
  font-family:var(--serif); font-weight:400;
  font-size:clamp(48px, 6.4vw, 92px);
  line-height:1.02; letter-spacing:-.01em;
  margin:60px 0 40px;
}
.hero-sub{ max-width:520px }
.hero-sub p{ font-size:17px; line-height:1.55; color:var(--ink-2); margin:0 }
.hero-stats{
  display:grid; grid-template-columns:repeat(4, 1fr);
  gap:0; margin-top:auto; padding-top:32px;
  border-top:1px solid var(--rule);
}
.hero-stats > div{
  padding:24px 14px 6px 0;
  border-right:1px solid var(--rule-soft);
  display:flex; flex-direction:column;
}
.hero-stats > div:last-child{ border-right:0 }
.stat-n{ font-family:var(--serif); font-size:46px; line-height:1; font-weight:400 }
.stat-l{ font-family:var(--mono); font-size:10.5px; letter-spacing:.26em; text-transform:uppercase; color:var(--muted); margin-top:8px }
.hero-img{
  margin:0; position:relative; background:var(--bone-2);
  overflow:hidden;
}
.hero-img img{ width:100%; height:100%; object-fit:cover }
.hero-img figcaption{
  position:absolute; left:24px; right:24px; bottom:24px;
  display:flex; justify-content:space-between;
  color:#fff; mix-blend-mode:difference;
}
.hero-img figcaption .tag{ color:#fff }

/* Sección headers comunes */
.sec-head{ margin:0 0 56px; max-width:900px }
.sec-head .eyebrow{ display:block; margin-bottom:18px }
.sec-head h2{
  font-family:var(--serif); font-weight:400;
  font-size:clamp(36px, 4.4vw, 60px); line-height:1.05;
  letter-spacing:-.01em; margin:0;
}

/* PROMOCIÓN */
.promocion{ padding:120px 0 100px; border-bottom:1px solid var(--rule) }
.promo-grid{ display:grid; grid-template-columns:1.4fr 1fr; gap:80px; align-items:start }
.promo-copy p{ font-size:17px; line-height:1.65; color:var(--ink-2); margin:0 0 18px }
.promo-copy p strong{ color:var(--ink); font-weight:500 }
.promo-bullets{ list-style:none; padding:0; margin:36px 0 0; border-top:1px solid var(--rule) }
.promo-bullets li{
  display:flex; align-items:baseline; gap:24px;
  padding:18px 0; border-bottom:1px solid var(--rule-soft);
  font-size:15px;
}
.promo-bullets li span{
  font-family:var(--mono); font-size:11px; letter-spacing:.18em;
  color:var(--accent); min-width:24px;
}
.promo-side{
  padding:32px; background:var(--paper);
  border:1px solid var(--rule-soft);
}
.promo-side dl{ margin:0; display:grid; grid-template-columns:1fr; gap:0 }
.promo-side dt{
  font-family:var(--mono); font-size:10px; letter-spacing:.26em;
  text-transform:uppercase; color:var(--muted); margin-top:18px;
}
.promo-side dt:first-child{ margin-top:0 }
.promo-side dd{
  margin:6px 0 0; padding:0 0 18px;
  border-bottom:1px solid var(--rule-soft);
  font-size:14px; line-height:1.5;
}
.promo-side dd:last-child{ border-bottom:0 }

/* ESCALERAS */
.escaleras{ padding:120px 0 100px; border-bottom:1px solid var(--rule) }
.esc-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:24px }
.esc-card{
  display:block; background:var(--paper);
  border:1px solid var(--rule);
  transition:transform .3s ease, background .3s ease, color .3s ease;
  overflow:hidden; position:relative;
}
.esc-card-inner{ padding:36px 30px 30px; display:flex; flex-direction:column; gap:18px; min-height:480px }
.esc-roman{
  font-family:var(--serif); font-size:120px; line-height:1;
  font-style:italic; color:var(--ink); letter-spacing:-.04em;
  margin-bottom:18px;
}
.esc-meta h3{ font-family:var(--serif); font-size:32px; margin:8px 0 14px; font-weight:400 }
.esc-meta p{ font-size:14px; line-height:1.55; color:var(--ink-2); margin:0 0 24px }
.esc-stats{
  display:grid; grid-template-columns:1fr 1fr; gap:12px 18px;
  padding:18px 0; border-top:1px solid var(--rule-soft);
  border-bottom:1px solid var(--rule-soft);
  font-family:var(--mono); font-size:11px;
  letter-spacing:.14em; text-transform:uppercase; color:var(--muted);
}
.esc-stats b{ color:var(--ink); font-weight:500; font-family:var(--serif); font-size:18px; letter-spacing:0; margin-right:6px }
.esc-link{ margin-top:auto; font-size:11px; display:inline-flex; gap:10px; align-items:center; padding-top:14px }
.esc-card:hover{ background:var(--ink); color:var(--bone) }
.esc-card:hover .esc-roman{ color:var(--accent) }
.esc-card:hover p,
.esc-card:hover .esc-stats,
.esc-card:hover .esc-stats b{ color:var(--bone) }
.esc-card:hover .esc-stats{ border-color:#3a3a3a }

/* UBICACIÓN */
.ubicacion{ padding:120px 0 100px; border-bottom:1px solid var(--rule) }
.ubi-grid{ display:flex; flex-direction:column; gap:48px }
.ubi-map{ position:relative; height:520px; border:1px solid var(--rule); overflow:hidden }
.ubi-map iframe{ width:100%; height:100%; border:0; filter:grayscale(.85) contrast(1.05) }
.map-overlay{
  position:absolute; left:24px; bottom:24px; max-width:320px;
  background:var(--bone); padding:24px; border:1px solid var(--rule);
}
.map-overlay .tag{ display:block; margin-bottom:10px }
.map-overlay h3{ font-family:var(--serif); font-size:26px; margin:0 0 6px; font-weight:400; line-height:1.05 }
.map-overlay p{ margin:0 0 16px; font-size:13px; color:var(--ink-2) }
.map-overlay .btn{ padding:10px 16px; font-size:10px }

.ubi-points{
  list-style:none; padding:0; margin:0;
  display:grid; grid-template-columns:repeat(5, 1fr);
  border-top:1px solid var(--rule); border-left:1px solid var(--rule-soft);
}
.ubi-points li{
  display:flex; gap:14px; align-items:baseline;
  padding:22px 20px;
  border-right:1px solid var(--rule-soft);
  border-bottom:1px solid var(--rule-soft);
  background:var(--paper);
}
.ubi-points .num{
  font-family:var(--serif); font-size:38px; line-height:1;
  color:var(--accent); flex-shrink:0; min-width:54px;
}
.ubi-points b{ font-weight:500; font-size:14px; letter-spacing:.02em; display:block; margin-bottom:4px }
.ubi-points div div{
  font-family:var(--mono); font-size:10.5px;
  color:var(--muted); letter-spacing:.16em;
  text-transform:uppercase;
}

@media (max-width:1100px){
  .ubi-points{ grid-template-columns:repeat(2, 1fr) }
}
@media (max-width:560px){
  .ubi-points{ grid-template-columns:1fr }
}

/* GALERÍA */
.galeria{ padding:120px 0 80px; border-bottom:1px solid var(--rule) }
.gallery-strip{
  display:grid;
  grid-template-columns:repeat(12, 1fr);
  grid-auto-rows:280px;
  gap:8px; padding:0 8px;
}
.gallery-strip figure{ margin:0; position:relative; overflow:hidden; background:var(--bone-2) }
.gallery-strip figure img{ width:100%; height:100%; object-fit:cover; display:block }
.gallery-strip figcaption{ position:absolute; left:14px; bottom:12px; background:rgba(242,239,233,.92); padding:4px 10px }

/* Layout editorial: 5 imágenes en cuadrícula asimétrica
   ┌──────────────────┬─────────┐
   │       g-1        │   g-2   │
   │     (grande)     │         │
   ├──────────────────┴─────────┤
   │   g-3   │   g-4   │   g-5  │
   └──────────────────────────-─┘ */
.g-1{ grid-column:1 / 8;  grid-row:1 / 3 }
.g-2{ grid-column:8 / 13; grid-row:1 / 3 }
.g-3{ grid-column:1 / 5;  grid-row:3 / 4 }
.g-4{ grid-column:5 / 9;  grid-row:3 / 4 }
.g-5{ grid-column:9 / 13; grid-row:3 / 4 }

.render-band{
  margin:80px 0 0; position:relative; height:560px; overflow:hidden;
}
.render-band img{ width:100%; height:100%; object-fit:cover; display:block }
.render-band figcaption{
  position:absolute; right:24px; bottom:24px;
  display:flex; flex-direction:column; gap:6px; align-items:flex-end;
}
.render-band figcaption .tag{ background:rgba(242,239,233,.92); padding:4px 10px }
@media (max-width:720px){ .render-band{ height:340px; margin-top:48px } }

/* CONTACTO — visual, image + datos prominentes */
.contacto{ padding:120px 0 80px }
.contacto .sec-head{ margin-bottom:60px }

.contact-visual{
  display:grid; grid-template-columns:1.2fr 1fr;
  align-items:stretch; min-height:720px;
  border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule);
}
.cv-img{ margin:0; position:relative; overflow:hidden; background:var(--bone-2) }
.cv-img img{ width:100%; height:100%; object-fit:cover; display:block }
.cv-img figcaption{
  position:absolute; left:20px; bottom:20px;
  display:flex; flex-direction:column; gap:6px;
}
.cv-img figcaption .tag{ background:rgba(242,239,233,.92); padding:4px 10px }

.cv-info{
  padding:48px 56px;
  background:var(--paper);
  border-left:1px solid var(--rule);
  display:flex; flex-direction:column;
}

/* Tarjetas grandes para teléfono y email */
.cv-card{
  padding:28px 0;
  border-bottom:1px solid var(--rule-soft);
}
.cv-card:first-child{ padding-top:4px }
.cv-card-mail{ padding-bottom:32px }
.cv-eyebrow{
  font-family:var(--mono); font-size:11px; letter-spacing:.3em;
  text-transform:uppercase; color:var(--accent);
  display:block; margin-bottom:12px;
}
.cv-big-link{
  display:block;
  font-family:var(--serif); font-size:clamp(36px, 4.4vw, 56px);
  line-height:1; font-weight:400; letter-spacing:-.015em;
  color:var(--ink);
  transition:color .15s;
}
.cv-big-link:hover{ color:var(--accent) }
.cv-big-link-mail{
  font-size:clamp(22px, 2.4vw, 30px);
  word-break:break-all;
}
.cv-card-foot{
  display:block; margin-top:12px;
  font-family:var(--mono); font-size:10.5px; letter-spacing:.18em;
  text-transform:uppercase; color:var(--muted);
}

/* Bloques de dirección + promotor */
.cv-blocks{
  display:grid; grid-template-columns:1fr 1fr; gap:32px;
  padding-top:26px;
}
.cv-block .eyebrow{ display:block; margin-bottom:10px }
.cv-h{
  font-size:22px; font-weight:400; margin:0 0 8px; line-height:1.1;
}
.cv-addr{
  margin:0; font-size:13.5px; line-height:1.65; color:var(--ink-2);
}
.cv-addr em{ font-style:italic; color:var(--ink); font-weight:500 }
.cv-cta{ margin-top:14px; padding:9px 14px; font-size:10px }
.cv-tag-line{ margin:14px 0 0 }

@media (max-width:980px){
  .contact-visual{ grid-template-columns:1fr; min-height:auto }
  .cv-img{ aspect-ratio:16/9 }
  .cv-info{ padding:40px 28px; border-left:0; border-top:1px solid var(--rule) }
  .cv-blocks{ grid-template-columns:1fr }
}

/* Responsive */
@media (max-width: 980px){
  .hero{ grid-template-columns:1fr; min-height:auto }
  .hero-img{ height:50vh; order:-1 }
  .hero-inner{ padding:40px 24px; border-right:0; border-bottom:1px solid var(--rule) }
  .hero-stats{ grid-template-columns:repeat(2, 1fr) }
  .promo-grid, .ubi-grid{ grid-template-columns:1fr; gap:40px }
  .esc-grid{ grid-template-columns:1fr }
  .gallery-strip{ grid-template-columns:1fr 1fr; grid-auto-rows:240px }
  .g-1{ grid-column:span 2; grid-row:auto }
  .g-2{ grid-column:span 2; grid-row:auto }
  .g-3, .g-4, .g-5{ grid-column:span 1; grid-row:auto }
  .nav ul{ display:none }
  footer.site .wrap{ grid-template-columns:1fr 1fr; gap:32px }
  footer.site .legal{ grid-column:span 2; flex-direction:column; gap:8px; text-align:center }
}
