/* Level UP · V21 · voz de marca + QA móvil
   Capa final sobre V20/V19. No altera el logo aprobado. */
:root{
  --brand-green:#009A45;
  --brand-lime:#92C83D;
}

/* Voz visual */
.brand-line{
  margin:20px 0 0;
  font-size:clamp(22px,2.2vw,30px);
  line-height:1.12;
  letter-spacing:-.035em;
  font-weight:780;
  color:var(--brand-green);
  max-width:680px;
}
.hero .brand-line + .lead{margin-top:18px}
.brand-accent{color:var(--brand-green)}

/* El logo final debe permanecer intacto y con aire suficiente. */
.brand .brand-logo{
  height:34px!important;
  max-width:172px!important;
  width:auto!important;
  object-fit:contain!important;
  object-position:left center!important;
}
footer .brand .brand-logo{height:32px!important;max-width:162px!important}

/* Copys largos B2B: evitar saltos torpes y botones comprimidos. */
.hero-copy,.org-hero-copy,.about-copy,.talk-copy,.exp-hero-copy,.case-top{min-width:0}
.hero .display,.org-hero h1,.about-hero h1,.exp-hero h1,.talk-hero h1{max-width:100%;text-wrap:balance}
.h2,.h3,h1,h2,h3{text-wrap:balance}
.btn{white-space:normal;text-align:center;line-height:1.2}

/* Las cifras mantienen jerarquía pero no dominan la página móvil. */
.stat .num,.signal-number,.one-four,.proof-num,.leadership-number{font-variant-numeric:tabular-nums}

/* Header móvil estable: el desplegable no cambia la altura de la página. */
.nav-inner{position:relative}

@media (max-width:980px){
  .nav.menu-open .nav-links{
    position:absolute;
    z-index:40;
    top:100%;
    left:0;
    right:0;
    width:auto!important;
    padding:12px 18px max(18px,env(safe-area-inset-bottom))!important;
    border:1px solid rgba(0,0,0,.08)!important;
    border-radius:0 0 18px 18px;
    background:rgba(247,246,242,.985);
    box-shadow:0 22px 45px rgba(0,0,0,.14);
    backdrop-filter:blur(18px);
  }
  .nav-links a{padding:13px 0!important}
  .mobile-nav-hablemos{margin-top:8px!important;padding:13px 16px!important}
}

@media (max-width:640px){
  :root{--mobile-gutter:16px}

  .brand .brand-logo{height:29px!important;max-width:148px!important}
  footer .brand .brand-logo{height:28px!important;max-width:144px!important}
  .nav,.nav-inner{min-height:66px!important}

  /* Home: el nuevo H1 es deliberadamente largo; esta medida mantiene ritmo sin 8-9 líneas gigantes. */
  .hero .display{
    font-size:clamp(39px,10.7vw,45px)!important;
    line-height:.96!important;
    letter-spacing:-.052em!important;
    text-wrap:pretty;
  }
  .hero-copy{padding-top:4px!important}
  .hero .brand-line{font-size:23px;line-height:1.12;margin-top:18px}
  .hero .lead{font-size:17px!important;line-height:1.48!important;margin-top:16px!important}
  .hero-actions{margin-top:22px}
  .micro-route{margin-top:24px!important}
  .hero .hero-media{aspect-ratio:4/3!important;border-radius:20px!important}
  .hero-note{font-size:12px!important;line-height:1.35}

  /* Encabezados internos: contundentes sin romper la pantalla. */
  .org-hero h1,.about-hero h1,.exp-hero h1,.talk-hero h1,
  .method-intro h1,.case-title{
    font-size:clamp(39px,10.8vw,47px)!important;
    line-height:.97!important;
    letter-spacing:-.052em!important;
  }
  .h2{font-size:clamp(33px,9.3vw,41px)!important;line-height:1.01!important}
  .h3{font-size:clamp(25px,7vw,31px)!important}

  /* Menos altura vacía; más ritmo de lectura. */
  .context,.capabilities,.signal,.method,.evidence,.history,.archive,.org-caps,.different,.org-method,.measure,
  .evidence-live,.measurement-b2b,.moments,.people,.living,.method-intro,.science,.translation,.evaluation,.case,
  .case-index-v15,.own-proof,.archive-status,.beliefs,.history-about,.facilitators,.groupup,.story,.case-section,
  .case-method-v14,.voices-v14,.contexts-v15,.military-proof-v15,.method-contexts-v15,.edu-proof-v14,
  .exp-intro,.featured-case,.timeline-lite{
    padding-top:62px!important;
    padding-bottom:62px!important;
  }
  .principle,.education,.formats,.cta,.org-cta,.visual-pause{padding-top:68px!important;padding-bottom:68px!important}

  /* Contexto: dos cifras legibles sin sensación de informe vertical interminable. */
  .context-head{gap:18px!important;margin-bottom:34px!important}
  .context-head .lead{font-size:17px!important}
  .stat{padding:32px 0!important}
  .stat .num{font-size:72px!important;line-height:.84!important}
  .stat p{font-size:17px!important;line-height:1.4;margin:18px 0 14px!important}
  .context-thought{font-size:26px!important;line-height:1.1!important;margin-top:45px!important}

  /* Principio y capacidades */
  .principle-grid{gap:28px!important}
  .principle .lead{font-size:17px!important}
  .method-strip{margin-top:44px!important}
  .caps-grid{gap:34px!important}
  .caps-intro .lead{font-size:17px!important}
  .cap{padding:24px 0!important}
  .cap p{font-size:15.5px!important;line-height:1.45!important}

  /* Dato LinkedIn: en V20 el texto quedaba demasiado grande para 390px. */
  .signal-grid{gap:18px!important}
  .signal-number{font-size:84px!important;line-height:.82!important}
  .signal-copy .h3{font-size:27px!important;line-height:1.04!important;letter-spacing:-.035em!important}
  .signal-thought{font-size:25px!important;line-height:1.1!important;margin-top:38px!important}

  /* Método */
  .method-top{margin-bottom:34px!important}
  .method-card{padding:22px!important;border-radius:18px!important}
  .method-card h3{font-size:25px!important;margin:25px 0 10px!important}
  .method-card p{font-size:14.5px!important;line-height:1.45}
  .science-note{padding:20px!important;border-radius:18px!important}
  .science-note .btn{width:100%;margin-top:16px}

  /* La experiencia visual no necesita ocupar casi una pantalla completa. */
  .experience{min-height:520px!important}
  .exp-copy{padding:70px 0 44px!important}
  .exp-caption{font-size:17px!important}

  /* Caso destacado */
  .evidence-grid{gap:30px!important}
  .evidence-media{aspect-ratio:4/3!important;border-radius:20px!important}
  .evidence-copy .lead{font-size:17px!important}
  .case-stats{gap:16px!important}
  .case-stat b{font-size:30px!important}
  .case-stat span{font-size:11.5px!important;line-height:1.35}

  /* Gallup */
  .colombia{padding:64px 0!important}
  .colombia-grid{gap:24px!important}
  .one-four{font-size:68px!important}
  .colombia-copy p{font-size:16px!important}

  /* Educación */
  .edu-grid{gap:30px!important}
  .edu-art{min-height:300px!important;border-radius:20px!important}
  .edu-copy .lead{font-size:17px!important}

  /* Contextos y archivo */
  .contexts-head-v15{gap:18px!important;margin-bottom:30px!important}
  .contexts-head-v15 p{font-size:16px!important}
  .contexts-grid-v15{grid-template-columns:1fr!important}
  .context-v15{min-height:0!important;padding:22px!important}
  .archive-grid{gap:34px!important}
  .archive-copy .lead{font-size:17px!important}
  .contact-sheet{transform:none!important;gap:8px!important}
  .contact-sheet img,.contact-sheet img:nth-child(n){transform:none!important;border-width:4px!important}

  /* Páginas internas: tarjetas y dos columnas pasan a secuencia clara. */
  .military-proof-grid-v15,.method-contexts-grid-v15,.case-index-grid-v15,.edu-proof-grid-v14,
  .gallery-grid-v14,.results-shell-v14,.measure-grid,.format-grid,.evidence-live-grid,
  .about-grid,.story-grid,.org-hero-grid,.exp-hero-grid{
    grid-template-columns:1fr!important;
  }

  /* Formularios: controles ocupan el ancho útil y sin zoom en iOS. */
  .form-shell,.side-card{padding:18px!important;border-radius:18px!important}
  input,select,textarea{width:100%;font-size:16px!important}
  .opt{width:100%;min-height:52px!important}

  /* CTA final */
  .cta .lead,.org-cta p{font-size:17px!important}
  .cta-actions .btn,.org-cta .btn{width:100%;justify-content:center}
}

@media (max-width:380px){
  .hero .display,.org-hero h1,.about-hero h1,.exp-hero h1,.talk-hero h1,.method-intro h1,.case-title{font-size:38px!important}
  .h2{font-size:32px!important}
  .signal-copy .h3{font-size:25px!important}
  .brand .brand-logo{height:27px!important;max-width:138px!important}
}