/* Level UP · V23 · corrección visual V22 + curaduría fotográfica
   No altera el logo final. */

/* HOME · primer pantallazo más corporativo y legible */
.hero{
  min-height:auto!important;
  padding:58px 0 72px!important;
  align-items:center!important;
}
.hero .wrap{width:min(calc(100% - 64px),1360px)}
.hero-grid{
  grid-template-columns:minmax(0,1.25fr) minmax(430px,.75fr)!important;
  gap:58px!important;
  align-items:center!important;
}
.hero-copy{padding-top:0!important}
.hero .display{
  font-size:clamp(54px,4.65vw,72px)!important;
  line-height:.965!important;
  letter-spacing:-.055em!important;
  max-width:840px!important;
  margin-top:15px!important;
  text-wrap:balance!important;
}
.hero .brand-line{
  margin-top:20px!important;
  font-size:clamp(22px,1.8vw,28px)!important;
}
.hero .lead{
  max-width:690px!important;
  margin:17px 0 24px!important;
  font-size:clamp(18px,1.45vw,21px)!important;
  line-height:1.5!important;
}
.hero-actions{gap:10px!important}
.hero-media{
  width:100%;
  height:auto!important;
  min-height:0!important;
  aspect-ratio:1/1!important;
  border-radius:28px!important;
}
.hero-media img{object-position:center 42%!important}
.hero-note{
  left:16px!important;right:16px!important;bottom:16px!important;
  padding:12px 14px!important;border-radius:14px!important;
  background:rgba(17,17,17,.76)!important;
  font-size:11.5px!important;line-height:1.4!important;
}

/* HOME · las tres puertas no deben parecer otra página completa */
.audiences-v22{padding:64px 0 72px!important}
.audiences-head-v22{
  grid-template-columns:1.15fr .85fr!important;
  gap:54px!important;
  margin-bottom:30px!important;
  align-items:end!important;
}
.audiences-head-v22 .h2{font-size:clamp(34px,3.8vw,52px)!important;max-width:760px}
.audiences-head-v22 .lead{font-size:18px!important;line-height:1.5!important}
.audiences-grid-v22{gap:12px!important}
.audiences-grid-v22 a{
  min-height:190px!important;
  padding:22px!important;
  border-radius:18px!important;
}
.audiences-grid-v22 h3{font-size:27px!important;margin:24px 0 9px!important}
.audiences-grid-v22 p{font-size:15px!important;line-height:1.45!important;margin-bottom:18px!important}

/* La franja fotográfica del Home debe comunicar diversidad, no una sola activación. */
.photo-ribbon-v9{background:#121212;padding:8px;gap:8px}
.photo-ribbon-v9 figure{border-radius:14px;overflow:hidden}
.photo-ribbon-v9 img{filter:saturate(.9) contrast(1.02)}
.photo-ribbon-v9 figcaption{background:linear-gradient(transparent,rgba(0,0,0,.72));padding-top:44px}

/* Evitar que la fotografía de experiencia vuelva a dominar como una segunda portada. */
.experience{min-height:620px!important}
.experience img{object-position:center 48%!important}

/* Internas: fotografía con proporciones estables. */
.org-hero-media{max-height:620px}
.org-hero-media img{object-fit:cover}

/* En desktop amplio, el menú sigue respirando aunque sumemos Empresas. */
@media (min-width:1180px){
  .nav-inner{gap:28px}
  .nav-links{gap:18px!important}
  .nav-links a{font-size:12.5px}
}

@media (max-width:1120px){
  .hero .wrap{width:min(calc(100% - 48px),1240px)}
  .hero-grid{grid-template-columns:minmax(0,1.08fr) minmax(390px,.92fr)!important;gap:38px!important}
  .hero .display{font-size:clamp(50px,5.1vw,64px)!important}
  .hero-media{aspect-ratio:4/5!important}
}

@media (max-width:980px){
  .hero{padding:38px 0 58px!important}
  .hero-grid{grid-template-columns:1fr!important;gap:28px!important}
  .hero .display{max-width:780px!important;font-size:clamp(48px,7vw,64px)!important}
  .hero .lead{max-width:720px!important}
  .hero-media{aspect-ratio:16/10!important;max-height:none!important}
  .audiences-head-v22{grid-template-columns:1fr!important;gap:16px!important}
  .audiences-grid-v22{grid-template-columns:1fr 1fr!important}
  .audiences-grid-v22 a:last-child{grid-column:1/-1}
}

@media (max-width:640px){
  .hero{padding:24px 0 48px!important}
  .hero .wrap{width:min(calc(100% - 32px),1240px)}
  .hero-grid{gap:24px!important}
  .hero .display{
    font-size:clamp(38px,10.4vw,45px)!important;
    line-height:.98!important;
    letter-spacing:-.05em!important;
    text-wrap:pretty!important;
  }
  .hero .brand-line{font-size:21px!important;line-height:1.13!important;margin-top:16px!important}
  .hero .lead{font-size:16.5px!important;line-height:1.47!important;margin:14px 0 20px!important}
  .hero-actions{display:grid!important;grid-template-columns:1fr!important}
  .hero-actions .btn{width:100%!important}
  .hero-media{aspect-ratio:4/3!important;border-radius:18px!important}
  .hero-note{display:none!important}

  .audiences-v22{padding:52px 0 58px!important}
  .audiences-head-v22{margin-bottom:22px!important}
  .audiences-head-v22 .h2{font-size:34px!important;line-height:1.02!important}
  .audiences-head-v22 .lead{font-size:16px!important}
  .audiences-grid-v22{grid-template-columns:1fr!important}
  .audiences-grid-v22 a,.audiences-grid-v22 a:last-child{grid-column:auto!important;min-height:0!important;padding:20px!important}
  .audiences-grid-v22 h3{font-size:25px!important;margin-top:20px!important}

  .photo-ribbon-v9{padding:6px!important;gap:6px!important}
  .experience{min-height:480px!important}
}

/* Reset necesario: algunas internas usan <figure class="hero-media"> y el margen nativo causaba overflow móvil. */
figure.hero-media{margin:0!important}
