/* Targeted mobile coherence fixes for the Impact Logic page only. */
@media (max-width:820px), (max-width:920px) and (orientation:landscape) and (max-height:600px){
  html body .impact-machine-sticky{
    min-height:0 !important;
  }

  html body .impact-stage{
    min-height:min(620px, calc(100svh - var(--ic-mobile-nav,76px) - 36px)) !important;
    gap:16px !important;
    padding-top:18px !important;
    padding-bottom:24px !important;
  }

  html body .impact-stage-word h3{
    max-width:100% !important;
    overflow:visible !important;
    overflow-wrap:normal !important;
    word-break:normal !important;
    hyphens:none !important;
    white-space:nowrap !important;
    line-height:.9 !important;
    letter-spacing:-.068em !important;
  }

  html body .impact-stage-word p{
    max-width:32ch !important;
    margin-top:14px !important;
    font-size:clamp(18px,5.15vw,22px) !important;
    line-height:1.12 !important;
    letter-spacing:-.025em !important;
  }

  html body .impact-orbit-nav{
    width:calc(100% + 36px) !important;
    max-width:calc(560px + 36px) !important;
    margin-right:-18px !important;
    margin-left:-18px !important;
    padding:2px 72px 6px 18px !important;
    box-sizing:border-box !important;
    scroll-padding-inline:18px !important;
    scroll-snap-type:none !important;
    overscroll-behavior-x:contain !important;
    -webkit-overflow-scrolling:touch !important;
    mask-image:linear-gradient(to right,#000 0,#000 calc(100% - 16px),transparent 100%) !important;
    -webkit-mask-image:linear-gradient(to right,#000 0,#000 calc(100% - 16px),transparent 100%) !important;
  }

  html body .impact-orbit-nav.is-at-start{
    mask-image:linear-gradient(to right,#000 0,#000 calc(100% - 16px),transparent 100%) !important;
    -webkit-mask-image:linear-gradient(to right,#000 0,#000 calc(100% - 16px),transparent 100%) !important;
  }

  html body .impact-orbit-nav.is-at-end{
    mask-image:none !important;
    -webkit-mask-image:none !important;
  }

  html body .impact-orbit-nav.is-at-start.is-at-end{
    mask-image:none !important;
    -webkit-mask-image:none !important;
  }

  html body .impact-orbit-nav button,
  html body .impact-orbit-nav button:nth-child(n){
    min-height:44px !important;
    scroll-snap-align:none !important;
  }
}

@media (max-width:370px) and (orientation:portrait){
  html body .impact-stage{
    gap:14px !important;
    padding-top:14px !important;
    padding-bottom:20px !important;
  }
  html body .impact-stage-word p{
    margin-top:12px !important;
    font-size:18px !important;
  }
}

@media (max-width:920px) and (orientation:landscape) and (max-height:600px){
  html body .impact-stage{
    min-height:calc(100svh - var(--ic-mobile-nav,64px)) !important;
    padding-top:12px !important;
    padding-bottom:12px !important;
  }
  html body .impact-stage-word h3{
    line-height:.88 !important;
  }
  html body .impact-orbit-nav{
    width:100% !important;
    max-width:none !important;
    margin-right:0 !important;
    margin-left:0 !important;
    padding-right:28px !important;
    padding-left:0 !important;
  }
}

/* =========================================================
   FINAL COHERENCE FIX — 2026-07-27
   Desktop title containment, unified mobile menu and B&W media.
   ========================================================= */

/* Never let the active impact title push the page horizontally. */
html body .impact-stage,
html body .impact-stage-word{
  min-width:0 !important;
  max-width:100% !important;
}

html body .impact-stage-word h3{
  max-width:100% !important;
  color:#111111 !important;
  overflow:visible !important;
  word-break:normal !important;
  hyphens:none !important;
  text-wrap:balance !important;
}

/* The documentary art direction remains black and white on every device. */
html body .impact-stage-visuals .stage-img,
html body .impact-stage-visuals .stage-img.is-active,
html body .history-photo img,
html body #panelImage{
  filter:grayscale(100%) contrast(1.20) brightness(.86) !important;
  -webkit-filter:grayscale(100%) contrast(1.20) brightness(.86) !important;
  mix-blend-mode:normal !important;
}

@media (min-width:981px){
  html body .impact-stage{
    grid-template-columns:minmax(380px,.92fr) minmax(0,1fr) !important;
    gap:clamp(42px,5.4vw,88px) !important;
    overflow:hidden !important;
  }

  html body .impact-stage-word{
    width:100% !important;
    max-width:720px !important;
    overflow:visible !important;
  }

  html body .impact-stage-word h3{
    font-size:clamp(64px,7.25vw,118px) !important;
    line-height:.82 !important;
    letter-spacing:-.085em !important;
    white-space:normal !important;
  }

  html body .impact-stage-word p{
    max-width:680px !important;
    font-size:clamp(27px,3.15vw,52px) !important;
    line-height:1.03 !important;
    letter-spacing:-.06em !important;
  }
}

/* Mobile header and menu: same clear structure as the main site. */
@media (max-width:900px){
  :root{--ic-impact-mobile-nav:76px;}

  html body header.nav,
  html body header.nav.ic-unified-nav{
    position:sticky !important;
    top:0 !important;
    z-index:2147482500 !important;
    display:grid !important;
    grid-template-columns:44px minmax(0,1fr) 44px !important;
    align-items:center !important;
    gap:10px !important;
    width:100% !important;
    height:var(--ic-impact-mobile-nav) !important;
    min-height:var(--ic-impact-mobile-nav) !important;
    max-height:var(--ic-impact-mobile-nav) !important;
    padding:10px 12px !important;
    overflow:visible !important;
    background:#73c2fb !important;
    border-bottom:1px solid rgba(17,17,17,.16) !important;
    box-shadow:none !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
  }

  html body header.nav .links-left,
  html body header.nav.ic-unified-nav .links-left,
  html body header.nav .links-right,
  html body header.nav.ic-unified-nav .links-right{
    position:static !important;
    display:flex !important;
    align-items:center !important;
    width:44px !important;
    min-width:44px !important;
    height:44px !important;
    margin:0 !important;
    padding:0 !important;
  }

  html body header.nav .links-left,
  html body header.nav.ic-unified-nav .links-left{
    grid-column:1 !important;
    justify-self:start !important;
  }

  html body header.nav .links-right,
  html body header.nav.ic-unified-nav .links-right{
    grid-column:3 !important;
    justify-self:end !important;
  }

  html body header.nav .menu-wrap,
  html body header.nav.ic-unified-nav .menu-wrap{
    position:static !important;
    width:44px !important;
    height:44px !important;
  }

  html body header.nav .menu-toggle,
  html body header.nav.ic-unified-nav .menu-toggle,
  html body header.nav .news-tool-trigger,
  html body header.nav.ic-unified-nav .news-tool-trigger{
    position:static !important;
    display:grid !important;
    place-items:center !important;
    width:44px !important;
    min-width:44px !important;
    max-width:44px !important;
    height:44px !important;
    min-height:44px !important;
    max-height:44px !important;
    margin:0 !important;
    padding:0 !important;
    border:1px solid rgba(17,17,17,.35) !important;
    border-radius:14px !important;
    background:transparent !important;
    color:#111111 !important;
    box-shadow:none !important;
    transform:none !important;
  }

  html body header.nav .menu-toggle > span:not(.menu-lines),
  html body header.nav.ic-unified-nav .menu-toggle > span:not(.menu-lines){
    display:none !important;
  }

  html body header.nav .brand.navbar-brand-inline,
  html body header.nav.ic-unified-nav .brand.navbar-brand-inline{
    position:static !important;
    grid-column:2 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    justify-self:stretch !important;
    gap:7px !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    height:44px !important;
    margin:0 !important;
    padding:0 !important;
    overflow:hidden !important;
    transform:none !important;
  }

  html body header.nav .brand.navbar-brand-inline .navbar-symbol-img,
  html body header.nav.ic-unified-nav .brand.navbar-brand-inline .navbar-symbol-img{
    flex:0 0 34px !important;
    width:34px !important;
    min-width:34px !important;
    max-width:34px !important;
    height:34px !important;
    min-height:34px !important;
    max-height:34px !important;
    margin:0 !important;
    object-fit:contain !important;
  }

  html body header.nav .brand.navbar-brand-inline .navbar-wordmark,
  html body header.nav.ic-unified-nav .brand.navbar-brand-inline .navbar-wordmark{
    display:block !important;
    min-width:0 !important;
    max-width:100% !important;
    overflow:hidden !important;
    color:#151515 !important;
    -webkit-text-fill-color:#151515 !important;
    font-size:clamp(18px,5.1vw,25px) !important;
    font-weight:650 !important;
    line-height:1 !important;
    letter-spacing:-.055em !important;
    white-space:nowrap !important;
  }

  html body header.nav .links-right .pill,
  html body header.nav.ic-unified-nav .links-right .pill{
    display:none !important;
  }

  /* Exact dark dropdown language of the main site. */
  html body header.nav .section-menu,
  html body header.nav.ic-unified-nav .section-menu{
    position:fixed !important;
    top:88px !important;
    right:12px !important;
    bottom:auto !important;
    left:12px !important;
    z-index:2147482600 !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:4px !important;
    width:auto !important;
    min-width:0 !important;
    max-width:none !important;
    min-height:304px !important;
    max-height:calc(100dvh - 104px) !important;
    padding:14px 14px 72px !important;
    overflow:auto !important;
    border:1px solid rgba(255,255,255,.14) !important;
    border-radius:20px !important;
    background:rgba(8,8,8,.96) !important;
    color:#ffffff !important;
    box-shadow:0 28px 80px rgba(0,0,0,.44) !important;
    backdrop-filter:blur(20px) !important;
    -webkit-backdrop-filter:blur(20px) !important;
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
    transform:translateY(-8px) scale(.985) !important;
    transform-origin:top center !important;
    transition:opacity .25s ease,visibility .25s ease,transform .45s cubic-bezier(.16,1,.3,1) !important;
  }

  html body.menu-open header.nav .section-menu,
  html body.menu-open header.nav.ic-unified-nav .section-menu{
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transform:none !important;
  }

  html body header.nav .section-menu .pill,
  html body header.nav.ic-unified-nav .section-menu .pill{
    position:relative !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    width:100% !important;
    min-height:48px !important;
    padding:0 44px 0 16px !important;
    border:0 !important;
    border-radius:13px !important;
    background:transparent !important;
    color:#ffffff !important;
    -webkit-text-fill-color:#ffffff !important;
    font-size:14px !important;
    line-height:1 !important;
    letter-spacing:.075em !important;
    text-transform:uppercase !important;
  }

  html body header.nav .section-menu .pill::after,
  html body header.nav.ic-unified-nav .section-menu .pill::after{
    content:"↗" !important;
    position:absolute !important;
    right:16px !important;
    top:50% !important;
    display:block !important;
    color:#ccff00 !important;
    opacity:.78 !important;
    transform:translateY(-50%) !important;
  }

  html body header.nav .section-menu .pill:hover,
  html body header.nav .section-menu .pill:focus-visible,
  html body header.nav .section-menu .pill[aria-current="page"],
  html body header.nav.ic-unified-nav .section-menu .pill:hover,
  html body header.nav.ic-unified-nav .section-menu .pill:focus-visible,
  html body header.nav.ic-unified-nav .section-menu .pill[aria-current="page"]{
    background:#ccff00 !important;
    color:#050505 !important;
    -webkit-text-fill-color:#050505 !important;
  }

  html body header.nav .section-menu .pill:hover *,
  html body header.nav .section-menu .pill:focus-visible *,
  html body header.nav .section-menu .pill[aria-current="page"] *,
  html body header.nav.ic-unified-nav .section-menu .pill:hover *,
  html body header.nav.ic-unified-nav .section-menu .pill:focus-visible *,
  html body header.nav.ic-unified-nav .section-menu .pill[aria-current="page"] *{
    color:#050505 !important;
    -webkit-text-fill-color:#050505 !important;
  }

  /* The switcher remains attached to the header in the DOM, but sits inside
     the open menu visually. This avoids conflicts with the shared menu script. */
  html body header.nav .ic-lang-switcher,
  html body header.nav .language-picker,
  html body header.nav.ic-unified-nav .ic-lang-switcher,
  html body header.nav.ic-unified-nav .language-picker{
    position:fixed !important;
    top:322px !important;
    right:28px !important;
    left:28px !important;
    z-index:2147482700 !important;
    display:grid !important;
    grid-template-columns:repeat(3,1fr) !important;
    width:auto !important;
    height:44px !important;
    margin:0 !important;
    padding:4px !important;
    gap:4px !important;
    border:1px solid rgba(255,255,255,.22) !important;
    border-radius:14px !important;
    background:#151515 !important;
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
    transform:translateY(-5px) !important;
    transition:opacity .2s ease,visibility .2s ease,transform .35s cubic-bezier(.16,1,.3,1) !important;
  }

  html body.menu-open header.nav .ic-lang-switcher,
  html body.menu-open header.nav .language-picker,
  html body.menu-open header.nav.ic-unified-nav .ic-lang-switcher,
  html body.menu-open header.nav.ic-unified-nav .language-picker{
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transform:none !important;
  }

  html body header.nav .ic-lang-switcher button,
  html body header.nav .language-picker button,
  html body header.nav.ic-unified-nav .ic-lang-switcher button,
  html body header.nav.ic-unified-nav .language-picker button{
    width:100% !important;
    min-height:34px !important;
    margin:0 !important;
    padding:0 8px !important;
    border:0 !important;
    border-radius:10px !important;
    background:transparent !important;
    color:#ffffff !important;
    -webkit-text-fill-color:#ffffff !important;
    font-size:12px !important;
    line-height:1 !important;
  }

  html body header.nav .ic-lang-switcher button.is-active,
  html body header.nav .ic-lang-switcher button.active,
  html body header.nav .language-picker button[aria-pressed="true"],
  html body header.nav.ic-unified-nav .ic-lang-switcher button.is-active,
  html body header.nav.ic-unified-nav .ic-lang-switcher button.active,
  html body header.nav.ic-unified-nav .language-picker button[aria-pressed="true"]{
    background:#ccff00 !important;
    color:#050505 !important;
    -webkit-text-fill-color:#050505 !important;
  }

  html body.menu-open header.nav .menu-toggle,
  html body.news-panel-open header.nav .news-tool-trigger,
  html body.menu-open header.nav.ic-unified-nav .menu-toggle,
  html body.news-panel-open header.nav.ic-unified-nav .news-tool-trigger{
    background:#ccff00 !important;
    border-color:#ccff00 !important;
    color:#050505 !important;
  }

  html body .impact-stage-word h3{
    max-width:100% !important;
    white-space:nowrap !important;
    line-height:.9 !important;
    letter-spacing:-.065em !important;
  }
}

@media (max-width:420px){
  html body header.nav .brand.navbar-brand-inline .navbar-wordmark,
  html body header.nav.ic-unified-nav .brand.navbar-brand-inline .navbar-wordmark{
    font-size:18px !important;
  }
}
