/**
 * images.css — Ultra-realistic photography layer for SINERGÍA
 * Unsplash photos with dark overlays — text always readable
 */

/* ================================================================
   HERO — Executive leadership transformation
   ================================================================ */
.hero {
  background-image: url('https://images.unsplash.com/photo-1521737711867-e3b97375f902?auto=format&fit=crop&w=1920&q=90');
  background-size: cover;
  background-position: center 30%;
  background-attachment: fixed;
}
.hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    135deg,
    rgba(13, 27, 62, 0.92) 0%,
    rgba(13, 27, 62, 0.78) 50%,
    rgba(13, 27, 62, 0.88) 100%
  );
  z-index: 0;
}
.hero__canvas { z-index: 1; }
.hero__content { z-index: 2; }
.hero__scroll-hint { z-index: 2; }

/* ================================================================
   CRISIS — Burnout / Stress environment
   ================================================================ */
.crisis {
  background-image: url('https://images.unsplash.com/photo-1434494817513-cc112a976e36?auto=format&fit=crop&w=1920&q=85');
  background-size: cover;
  background-position: center;
  position: relative;
}
.crisis::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(13, 27, 62, 0.93) 0%,
    rgba(30, 10, 10, 0.88) 40%,
    rgba(13, 27, 62, 0.95) 100%
  );
  z-index: 0;
}
.crisis .container { position: relative; z-index: 1; }

/* ================================================================
   TRÍADA — Clinical / mental health context
   ================================================================ */
.triada {
  background-image: url('https://images.unsplash.com/photo-1579389083175-0d6c4b3e6e52?auto=format&fit=crop&w=1920&q=85');
  background-size: cover;
  background-position: center;
  position: relative;
}
.triada::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    160deg,
    rgba(13, 27, 62, 0.95) 0%,
    rgba(26, 43, 82, 0.90) 100%
  );
  z-index: 0;
}
.triada .container { position: relative; z-index: 1; }

/* Phase photos — small cinematic photos inside each phase card */
.triada__phase-photo {
  width: 100%;
  height: 140px;
  object-fit: cover;
  border-radius: 8px;
  margin-bottom: 16px;
  filter: saturate(0.7) contrast(1.1);
  display: block;
}

/* ================================================================
   SISTEMA VENN — Abstract neural/data network
   ================================================================ */
.sistema {
  background-image: url('https://images.unsplash.com/photo-1451187580459-43490279c0fa?auto=format&fit=crop&w=1920&q=85');
  background-size: cover;
  background-position: center;
  position: relative;
}
.sistema::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(13, 27, 62, 0.88);
  z-index: 0;
}
.sistema .container { position: relative; z-index: 1; }

/* ================================================================
   GEMAS — Collaboration / Eastern philosophy
   ================================================================ */
.gemas {
  background-image: url('https://images.unsplash.com/photo-1522202176988-66273c2fd55f?auto=format&fit=crop&w=1920&q=85');
  background-size: cover;
  background-position: center top;
  position: relative;
}
.gemas::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(26, 43, 82, 0.94);
  z-index: 0;
}
.gemas .container { position: relative; z-index: 1; }
.gem-modal { z-index: 1000; }

/* Gem card photo strip */
.gem-card__img-wrap {
  width: 100%;
  height: 120px;
  overflow: hidden;
  border-radius: 8px 8px 0 0;
  margin: -16px -16px 14px -16px;
  width: calc(100% + 32px);
}
.gem-card__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(0.5) brightness(0.7);
  transition: filter 400ms ease, transform 600ms ease;
  display: block;
}
.gem-card:hover .gem-card__img {
  filter: saturate(0.85) brightness(0.85);
  transform: scale(1.05);
}

/* ================================================================
   NARDONE — Strategic therapy / coaching
   ================================================================ */
.nardone {
  background-image: url('https://images.unsplash.com/photo-1524178232363-1fb2b075b655?auto=format&fit=crop&w=1920&q=85');
  background-size: cover;
  background-position: center 40%;
  position: relative;
}
.nardone::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    135deg,
    rgba(13, 27, 62, 0.94) 0%,
    rgba(26, 43, 82, 0.90) 100%
  );
  z-index: 0;
}
.nardone .container { position: relative; z-index: 1; }

/* Nardone portrait / side image */
.nardone__portrait {
  width: 100%;
  border-radius: 12px;
  object-fit: cover;
  height: 320px;
  filter: saturate(0.6) contrast(1.15) brightness(0.85);
  box-shadow: 0 8px 40px rgba(0,0,0,0.5);
}

/* ================================================================
   DIAGNÓSTICO 360 — Data analytics
   ================================================================ */
.diagnostico {
  background-image: url('https://images.unsplash.com/photo-1551288049-bebda4e38f71?auto=format&fit=crop&w=1920&q=85');
  background-size: cover;
  background-position: center;
  position: relative;
}
.diagnostico::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(13, 27, 62, 0.92);
  z-index: 0;
}
.diagnostico .container { position: relative; z-index: 1; }

/* ================================================================
   IMPACTO — Success / transformation
   ================================================================ */
.impacto {
  background-image: url('https://images.unsplash.com/photo-1552664730-d307ca884978?auto=format&fit=crop&w=1920&q=85');
  background-size: cover;
  background-position: center;
  position: relative;
}
.impacto::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(26, 43, 82, 0.93) 0%,
    rgba(13, 27, 62, 0.90) 100%
  );
  z-index: 0;
}
.impacto .container { position: relative; z-index: 1; }

/* Impacto hero image */
.impacto__hero-img {
  width: 100%;
  height: 260px;
  object-fit: cover;
  border-radius: 16px;
  margin-bottom: 40px;
  filter: saturate(0.75) brightness(0.85);
  box-shadow: 0 12px 48px rgba(0,0,0,0.5);
}

/* ================================================================
   CASOS DE ÉXITO — Industry transformation
   ================================================================ */
.casos {
  background-image: url('https://images.unsplash.com/photo-1557804506-669a67965ba0?auto=format&fit=crop&w=1920&q=85');
  background-size: cover;
  background-position: center;
  position: relative;
}
.casos::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(13, 27, 62, 0.93);
  z-index: 0;
}
.casos .container { position: relative; z-index: 1; }

/* Caso card photo */
.caso-card__img-wrap {
  width: calc(100% + 32px);
  margin: -24px -16px 16px -16px;
  height: 150px;
  overflow: hidden;
  border-radius: 12px 12px 0 0;
}
.caso-card__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(0.5) brightness(0.65) contrast(1.1);
  transition: filter 400ms ease, transform 500ms ease;
  display: block;
}
.caso-card:hover .caso-card__img {
  filter: saturate(0.8) brightness(0.8);
  transform: scale(1.04);
}

/* ================================================================
   NOM-035 — Legal / compliance
   ================================================================ */
.nom035 {
  background-image: url('https://images.unsplash.com/photo-1589829545856-d10d557cf95f?auto=format&fit=crop&w=1920&q=85');
  background-size: cover;
  background-position: center;
  position: relative;
}
.nom035::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    135deg,
    rgba(13, 27, 62, 0.95) 0%,
    rgba(26, 43, 82, 0.91) 100%
  );
  z-index: 0;
}
.nom035 .container { position: relative; z-index: 1; }

/* ================================================================
   METODOLOGÍA — Workshop / implementation
   ================================================================ */
.metodologia {
  background-image: url('https://images.unsplash.com/photo-1542744173-8e7e53415bb0?auto=format&fit=crop&w=1920&q=85');
  background-size: cover;
  background-position: center;
  position: relative;
}
.metodologia::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(26, 43, 82, 0.93);
  z-index: 0;
}
.metodologia .container { position: relative; z-index: 1; }

/* Phase card photo */
.metodologia__phase-img {
  width: 100%;
  height: 120px;
  object-fit: cover;
  border-radius: 8px;
  margin-bottom: 12px;
  filter: saturate(0.6) brightness(0.75) contrast(1.1);
  display: block;
}

/* ================================================================
   PAQUETES — Professional services investment
   ================================================================ */
.paquetes {
  background-image: url('https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?auto=format&fit=crop&w=1920&q=85');
  background-size: cover;
  background-position: center top;
  position: relative;
}
.paquetes::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(13, 27, 62, 0.94);
  z-index: 0;
}
.paquetes .container { position: relative; z-index: 1; }

/* ================================================================
   CONTACTO — Professional / executive
   ================================================================ */
.contacto {
  background-image: url('https://images.unsplash.com/photo-1600880292089-90a7e086ee0c?auto=format&fit=crop&w=1920&q=85');
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
}
.contacto::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(13, 27, 62, 0.90) 0%,
    rgba(13, 27, 62, 0.95) 100%
  );
  z-index: 0;
}
.contacto__canvas { z-index: 1; }
.contacto__inner { z-index: 2; }