/* ============================================================
   REALZTAGE — SHARED STYLESHEET v2.0
   Incluye: variables, componentes de imagen, utilidades
   Todas las imágenes: Unsplash License (libre uso comercial)
   ============================================================ */

/* ── VARIABLES ── */
:root {
  --verde: #1a3a35;
  --verde-dark: #0e2420;
  --verde-mid: #254d46;
  --verde-light: #2e6059;
  --cobre: #c8894a;
  --cobre-light: #e0a96a;
  --cobre-pale: #f0c898;
  --crema: #f5f0e8;
  --blanco: #fdfaf5;
  --negro: #0a1a17;
  --font-display: 'Cormorant Garamond', serif;
  --font-body: 'Montserrat', sans-serif;

  /* Imágenes Unsplash — 1600px mínimo, q=90 */
  --img-house-modern:   'https://images.unsplash.com/photo-1570129477492-45c003edd2be?w=1600&q=90&fit=crop';
  --img-house-warm:     'https://images.unsplash.com/photo-1605276374104-dee2a0ed3cd6?w=1600&q=90&fit=crop';
  --img-house-aerial:   'https://images.unsplash.com/photo-1486325212027-8081e485255e?w=1600&q=90&fit=crop';
  --img-signing:        'https://images.unsplash.com/photo-1554224155-8d04cb21cd6c?w=1600&q=90&fit=crop';
  --img-meeting-warm:   'https://images.unsplash.com/photo-1600880292203-757bb62b4baf?w=1600&q=90&fit=crop';
  --img-couple-docs:    'https://images.unsplash.com/photo-1554995207-c18c203602cb?w=1600&q=90&fit=crop';
  --img-team-office:    'https://images.unsplash.com/photo-1521737604893-d14cc237f11d?w=1600&q=90&fit=crop';
  --img-family-home:    'https://images.unsplash.com/photo-1591123120675-6f7f1aae0e5b?w=1600&q=90&fit=crop';
  --img-handshake:      'https://images.unsplash.com/photo-1453738773917-9c3eff1db985?w=1600&q=90&fit=crop';
  --img-office-warm:    'https://images.unsplash.com/photo-1497366216548-37526070297c?w=1600&q=90&fit=crop';
  --img-finance:        'https://images.unsplash.com/photo-1579621970795-87facc2f976d?w=1600&q=90&fit=crop';
  --img-keys:           'https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=1600&q=90&fit=crop';
  --img-neighborhood:   'https://images.unsplash.com/photo-1480074568708-e7b720bb3f09?w=1600&q=90&fit=crop';
  --img-documents:      'https://images.unsplash.com/photo-1450101499163-c8848c66ca85?w=1600&q=90&fit=crop';
  --img-notary:         'https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=1600&q=90&fit=crop';
  --img-city-aerial:    'https://images.unsplash.com/photo-1512813195386-6cf811ad3542?w=1600&q=90&fit=crop';
}

/* ── RESET & BASE ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }

/* ── IMAGE FRAME ── */
.rz-img {
  position: relative;
  overflow: hidden;
  display: block;
}
.rz-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  transition: transform 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  /* Mejora de nitidez en pantallas retina */
  image-rendering: -webkit-optimize-contrast;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
.rz-img:hover img { transform: scale(1.04); }

/* Overlay cálido — mantiene legibilidad del texto */
.rz-img.overlay-warm::after {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(
    to bottom,
    transparent 40%,
    rgba(14, 36, 32, 0.7) 100%
  );
  pointer-events: none;
}
.rz-img.overlay-dark::after {
  content: '';
  position: absolute; inset: 0;
  background: rgba(10, 26, 23, 0.45);
  pointer-events: none;
}
.rz-img.overlay-side::after {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(
    to right,
    rgba(14, 36, 32, 0.5) 0%,
    transparent 60%
  );
  pointer-events: none;
}

/* Borde cobre sutil */
.rz-img.bordered {
  border: 1px solid rgba(200, 137, 74, 0.25);
}
.rz-img.bordered::before {
  content: '';
  position: absolute; inset: 0;
  border: 1px solid rgba(200, 137, 74, 0.25);
  z-index: 2;
  pointer-events: none;
}

/* ── IMAGE LABELS ── */
.rz-img-label {
  position: absolute;
  bottom: 1rem; left: 1rem;
  background: rgba(14, 36, 32, 0.88);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(200, 137, 74, 0.25);
  padding: 0.45rem 0.9rem;
  font-family: var(--font-body);
  font-size: 0.6rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--cobre);
  font-weight: 600;
  z-index: 3;
}
.rz-img-badge {
  position: absolute;
  top: 1rem; right: 1rem;
  background: var(--cobre);
  color: var(--negro);
  padding: 0.35rem 0.75rem;
  font-family: var(--font-body);
  font-size: 0.58rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-weight: 700;
  z-index: 3;
}
.rz-img-quote {
  position: absolute;
  bottom: 1.5rem; left: 1.5rem; right: 1.5rem;
  font-family: var(--font-display);
  font-size: 1.15rem;
  font-style: italic;
  color: var(--crema);
  line-height: 1.4;
  z-index: 3;
}

/* ── PHOTO GRID — 2 cols with asymmetric heights ── */
.rz-photo-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
}
.rz-photo-grid .rz-img:first-child {
  grid-row: span 2;
}

/* ── PHOTO STRIP — full-bleed horizontal ── */
.rz-photo-strip {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.5rem;
}

/* ── CINEMATIC HERO IMAGE ── */
.rz-hero-img {
  position: absolute; inset: 0;
  z-index: 0;
}
.rz-hero-img img {
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center 30%;
  display: block;
}
.rz-hero-img::after {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(
    135deg,
    rgba(10, 26, 23, 0.85) 0%,
    rgba(14, 36, 32, 0.6) 50%,
    rgba(26, 58, 53, 0.4) 100%
  );
}

/* ── SPLIT IMAGE — texto + foto mitad/mitad ── */
.rz-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  align-items: stretch;
}
.rz-split.reverse { direction: rtl; }
.rz-split.reverse > * { direction: ltr; }
.rz-split-content {
  padding: 5rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.rz-split-img {
  min-height: 480px;
}

/* ── TESTIMONIAL WITH PHOTO ── */
.rz-testimonial {
  position: relative;
  overflow: hidden;
}
.rz-testimonial-bg {
  position: absolute; inset: 0;
}
.rz-testimonial-bg img {
  width: 100%; height: 100%;
  object-fit: cover;
  filter: grayscale(20%) brightness(0.35);
}
.rz-testimonial-content {
  position: relative; z-index: 2;
  padding: 4rem;
}

/* ── CARD WITH TOP IMAGE ── */
.rz-card-img {
  width: 100%;
  overflow: hidden;
}
.rz-card-img img {
  width: 100%;
  height: 200px;
  object-fit: cover;
  display: block;
  transition: transform 0.6s ease;
}
.rz-card-img:hover img { transform: scale(1.05); }

/* ── UTILITY SIZES ── */
.rz-h-200  { height: 200px; }
.rz-h-260  { height: 260px; }
.rz-h-320  { height: 320px; }
.rz-h-400  { height: 400px; }
.rz-h-480  { height: 480px; }
.rz-h-560  { height: 560px; }
.rz-h-full { height: 100%; }

/* ── ASPECT RATIOS ── */
.rz-ratio-16-9  { aspect-ratio: 16/9; }
.rz-ratio-4-3   { aspect-ratio: 4/3; }
.rz-ratio-3-2   { aspect-ratio: 3/2; }
.rz-ratio-1-1   { aspect-ratio: 1/1; }
.rz-ratio-2-3   { aspect-ratio: 2/3; }

/* ── CREDITS (oculto visualmente, presente para SEO) ── */
.rz-img-credit {
  position: absolute;
  bottom: 0.3rem; right: 0.5rem;
  font-size: 0.5rem;
  color: rgba(255,255,255,0.3);
  z-index: 3;
  letter-spacing: 0.05em;
}

/* ── RESPONSIVE ── */
@media (max-width: 900px) {
  .rz-split { grid-template-columns: 1fr; }
  .rz-split.reverse { direction: ltr; }
  .rz-split-content { padding: 3rem 2rem; }
  .rz-split-img { min-height: 280px; }
  .rz-photo-grid { grid-template-columns: 1fr; }
  .rz-photo-grid .rz-img:first-child { grid-row: span 1; }
  .rz-photo-strip { grid-template-columns: 1fr; }
}
