/* ============================================================================
   Travel Zone — Nosotros (página nueva)  ·  CSS ADITIVO
   Tratamiento cinematográfico sky→navy, consistente con el Capítulo 08 y
   contacto. NO modifica style.css. Tipografías: Fraunces (display) + Inter.
   ============================================================================ */

.nos{ position:relative; color:#fff; }
.nos-wrap{ width:100%; max-width:1080px; margin:0 auto; padding:0 clamp(20px, 5vw, 48px); }

/* nav-link estado actual (por si style.css no lo define) */
.nav-link.is-current{ color:#fff; background: rgba(255,255,255,0.12); }

/* ---------- Apertura (sky→navy cinemático, despeja el nav fijo) ---------- */
.nos-hero{
  position:relative; isolation:isolate;
  padding: clamp(140px, 20vh, 230px) 0 clamp(60px, 10vh, 120px);
  overflow:hidden;
}
.nos-hero-bg{
  position:absolute; inset:0; z-index:-1;
  background:
    radial-gradient(ellipse 70% 60% at 78% 12%, rgba(91,169,213,0.20) 0%, transparent 60%),
    radial-gradient(ellipse 90% 70% at 12% 0%, rgba(76,125,177,0.16) 0%, transparent 55%),
    linear-gradient(180deg, #1b3a5c 0%, #112c4c 32%, #0b1d3a 64%, #080812 100%);
}
.nos-hero-bg::after{ /* netline sutil, eco del Cap 08 */
  content:""; position:absolute; inset:0;
  background-image:
    linear-gradient(transparent 96%, rgba(91,169,213,0.10) 100%),
    linear-gradient(90deg, transparent 96%, rgba(91,169,213,0.08) 100%);
  background-size: 64px 64px, 64px 64px; opacity:.5;
  -webkit-mask-image: radial-gradient(ellipse 80% 70% at 70% 20%, #000, transparent 75%);
          mask-image: radial-gradient(ellipse 80% 70% at 70% 20%, #000, transparent 75%);
}
.nos-eyebrow{
  margin:0; font-family:'Inter', system-ui, sans-serif;
  text-transform:uppercase; letter-spacing:0.18em; font-size:12px; font-weight:600;
  color: var(--tz-light, #5ba9d5);
}
.nos-headline{
  margin:18px 0 0; max-width:20ch;
  font-family:'Fraunces', serif; font-weight:400; letter-spacing:-0.01em;
  font-size: clamp(32px, 5.4vw, 60px); line-height:1.05;
}
.nos-subhead{
  margin:22px 0 0; max-width:62ch;
  font-family:'Inter', system-ui, sans-serif;
  font-size: clamp(15px, 1.6vw, 18px); line-height:1.65; color: rgba(246,248,251,0.82);
}

/* ---------- Bloques editoriales (título / cuerpo) ---------- */
.nos-block{ padding: clamp(46px, 8vh, 96px) 0; position:relative; }
.nos-grid{ display:grid; grid-template-columns: 0.8fr 1.2fr; gap: clamp(22px, 5vw, 64px); align-items:start; }
.nos-title{
  margin:0; font-family:'Fraunces', serif; font-weight:400;
  font-size: clamp(24px, 3.4vw, 38px); line-height:1.12;
}
.nos-body{
  margin:0; max-width:64ch;
  font-family:'Inter', system-ui, sans-serif;
  font-size: clamp(15px, 1.5vw, 17px); line-height:1.7; color: rgba(246,248,251,0.80);
}

/* ---------- Misión / Visión (tarjetas en cristal navy) ---------- */
.nos-mv-grid{ display:grid; grid-template-columns:1fr 1fr; gap: clamp(20px, 3vw, 32px); }
.nos-card{
  padding: clamp(24px, 3vw, 38px);
  background: linear-gradient(160deg, rgba(37,62,92,0.55), rgba(11,29,58,0.42));
  border:1px solid rgba(91,169,213,0.18); border-radius:18px;
  box-shadow: 0 18px 50px -28px rgba(0,0,0,0.6);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
.nos-card-eyebrow{
  display:block; margin-bottom:10px;
  font-family:'Inter', system-ui, sans-serif; text-transform:uppercase;
  letter-spacing:0.12em; font-size:12px; color: var(--tz-light, #5ba9d5);
}
.nos-card .nos-title{ margin-bottom:14px; }

/* ---------- Cifras de respaldo ---------- */
.nos-stats{
  padding: clamp(46px, 8vh, 92px) 0;
  border-top:1px solid rgba(255,255,255,0.08);
  border-bottom:1px solid rgba(255,255,255,0.08);
  background: linear-gradient(180deg, rgba(91,169,213,0.06), transparent 70%);
}
.nos-stats-grid{ display:grid; grid-template-columns: repeat(4, 1fr); gap: clamp(20px, 3vw, 40px); }
.nos-stat{ display:flex; flex-direction:column; gap:8px; }
.nos-stat-num{ font-family:'Fraunces', serif; font-size: clamp(34px, 5vw, 56px); line-height:1; color:#fff; }
.nos-stat-label{ font-family:'Inter', system-ui, sans-serif; font-size:13px; line-height:1.45; color: rgba(246,248,251,0.70); }

/* ---------- Cierre + CTA ---------- */
.nos-closing{
  padding: clamp(64px, 13vh, 150px) 0; text-align:center; position:relative;
  background: radial-gradient(ellipse 80% 60% at 50% 0%, rgba(91,169,213,0.10), transparent 62%);
}
.nos-closing-text{
  margin:0 auto 28px; max-width:26ch;
  font-family:'Fraunces', serif; font-size: clamp(22px, 3vw, 34px); line-height:1.25;
}
.nos-cta{ display:inline-flex; align-items:center; gap:10px; }
.nos-cta span{ transition: transform .3s cubic-bezier(0.22,1,0.36,1); }
.nos-cta:hover span{ transform: translateX(4px); }

/* ---------- Reveal on scroll ---------- */
[data-reveal]{ opacity:0; transform: translateY(26px); transition: opacity .8s cubic-bezier(0.22,1,0.36,1), transform .8s cubic-bezier(0.22,1,0.36,1); }
[data-reveal].is-in{ opacity:1; transform:none; }

/* ---------- Responsive ---------- */
@media (max-width: 860px){
  .nos-grid{ grid-template-columns: 1fr; gap: 16px; }
  .nos-mv-grid{ grid-template-columns: 1fr; }
  .nos-stats-grid{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 420px){
  .nos-stats-grid{ grid-template-columns: 1fr; }
}

/* ---------- Accesibilidad: reduced motion ---------- */
@media (prefers-reduced-motion: reduce){
  [data-reveal]{ opacity:1; transform:none; transition:none; }
  .nos-cta span{ transition:none; }
}
