/*! NBC Mobile Release Hardening · v7.019
    Final mobile ownership for header geometry + genuine viewport bleed corrections.
    Scope: <=760px only. Desktop/tablet 761+ untouched. */
@media (max-width:760px){
  /* One header axis, independent of historical page-family bundles. */
  html body[data-mobile-art="v7"] .site-header > .wrap.nav,
  html body[data-mobile-art="v7"] .site-header .nav{
    width:100%!important;
    max-width:none!important;
    height:var(--m7-header-h,64px)!important;
    min-height:var(--m7-header-h,64px)!important;
    margin:0!important;
    padding-left:var(--m7-inline-start,20px)!important;
    padding-right:var(--m7-inline-end,20px)!important;
    display:grid!important;
    grid-template-columns:96px minmax(0,1fr) auto 44px!important;
    grid-template-rows:var(--m7-header-h,64px)!important;
    align-items:center!important;
    column-gap:8px!important;
    row-gap:0!important;
    box-sizing:border-box!important;
  }
  html body[data-mobile-art="v7"] .site-header .brand{
    grid-column:1!important;
    grid-row:1!important;
    width:96px!important;
    min-width:0!important;
    align-self:center!important;
    margin:0!important;
  }
  html body[data-mobile-art="v7"] .site-header .nav > .nbc-mobile-context{
    grid-column:2!important;
    grid-row:1!important;
    min-width:0!important;
    max-width:100%!important;
    align-self:center!important;
  }
  html body[data-mobile-art="v7"] .site-header .nav > .nbc-mobile-header-cta{
    grid-column:3!important;
    grid-row:1!important;
    align-self:center!important;
    justify-self:end!important;
    min-height:44px!important;
    margin:0!important;
  }
  /* The nav element must not consume a grid track while the menu is closed. */
  html body[data-mobile-art="v7"] .site-header nav{
    grid-column:4!important;
    grid-row:1!important;
    justify-self:end!important;
    align-self:center!important;
    width:0!important;
    min-width:0!important;
    height:0!important;
    min-height:0!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
  }
  /* One toggle geometry across every page family. Runtime text stays semantic,
     pseudo-lines own the visible hamburger/X. */
  html body[data-mobile-art="v7"] .site-header .burger{
    grid-column:4!important;
    grid-row:1!important;
    justify-self:end!important;
    align-self:center!important;
    position:relative!important;
    inset:auto!important;
    transform:none!important;
    width:44px!important;
    height:44px!important;
    min-width:44px!important;
    min-height:44px!important;
    margin:0!important;
    padding:0!important;
    border:1px solid rgba(229,241,232,.18)!important;
    border-radius:12px!important;
    background:rgba(255,255,255,.025)!important;
    color:transparent!important;
    -webkit-text-fill-color:transparent!important;
    font-size:0!important;
    line-height:0!important;
    text-indent:-9999px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    z-index:1002!important;
  }
  html body[data-mobile-art="v7"] .site-header .burger::before,
  html body[data-mobile-art="v7"] .site-header .burger::after{
    content:""!important;
    position:absolute!important;
    left:50%!important;
    top:50%!important;
    width:18px!important;
    height:1.5px!important;
    margin:0!important;
    border:0!important;
    border-radius:2px!important;
    background:var(--m7-text,#f5f2ed)!important;
    box-shadow:none!important;
    transform-origin:center!important;
  }
  html body[data-mobile-art="v7"] .site-header .burger::before{
    transform:translate(-50%,-4px)!important;
  }
  html body[data-mobile-art="v7"] .site-header .burger::after{
    transform:translate(-50%,4px)!important;
  }
  html body[data-mobile-art="v7"].menu-open .site-header .burger::before,
  html body[data-mobile-art="v7"] .site-header .burger[aria-expanded="true"]::before{
    transform:translate(-50%,0) rotate(45deg)!important;
  }
  html body[data-mobile-art="v7"].menu-open .site-header .burger::after,
  html body[data-mobile-art="v7"] .site-header .burger[aria-expanded="true"]::after{
    transform:translate(-50%,0) rotate(-45deg)!important;
  }
  html body[data-mobile-art="v7"].menu-open .site-header .burger{
    background:#09140e!important;
    border-color:rgba(229,241,232,.22)!important;
  }
  /* Full-screen menu inherits the same viewport gutters as the closed header. */
  html body[data-mobile-art="v7"] .site-header nav #menu.open{
    left:0!important;
    right:0!important;
    width:100vw!important;
    max-width:100vw!important;
    padding-left:var(--m7-inline-start,20px)!important;
    padding-right:var(--m7-inline-end,20px)!important;
    box-sizing:border-box!important;
  }
  /* Genuine mobile geometry defect: the Barometer stage previously bled ~4px
     beyond the viewport because a legacy negative margin exceeded its parent gutter. */
  html body.page-barometer[data-mobile-art="v7"] .baro-stage{
    width:100vw!important;
    max-width:100vw!important;
    margin-left:calc(50% - 50vw)!important;
    margin-right:calc(50% - 50vw)!important;
  }
}

@media (max-width:350px){
  html body[data-mobile-art="v7"] .site-header > .wrap.nav,
  html body[data-mobile-art="v7"] .site-header .nav{
    grid-template-columns:88px minmax(0,1fr) auto 44px!important;
    column-gap:6px!important;
  }
  html body[data-mobile-art="v7"] .site-header .brand{width:88px!important;}
}

/* Homepage legacy bundles place some !important header chrome in the earliest
   nbc.normal layer. Mirror the critical geometry there so one owner still wins. */
@layer nbc.normal{
  @media (max-width:760px){
    html body[data-mobile-art="v7"] .site-header > .wrap.nav,
    html body[data-mobile-art="v7"] .site-header .nav{
      width:100%!important;max-width:none!important;margin:0!important;
      padding-left:var(--m7-inline-start,20px)!important;padding-right:var(--m7-inline-end,20px)!important;
      grid-template-columns:96px minmax(0,1fr) auto 44px!important;grid-template-rows:var(--m7-header-h,64px)!important;
      column-gap:8px!important;row-gap:0!important;
    }
    html body[data-mobile-art="v7"] .site-header nav{
      grid-column:4!important;grid-row:1!important;width:0!important;min-width:0!important;height:0!important;min-height:0!important;
      margin:0!important;padding:0!important;overflow:visible!important;justify-self:end!important;align-self:center!important;
    }
    html body[data-mobile-art="v7"] .site-header .burger{
      grid-column:4!important;grid-row:1!important;justify-self:end!important;align-self:center!important;
      width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;
      margin:0!important;padding:0!important;border-radius:12px!important;
      border:1px solid rgba(229,241,232,.18)!important;background:rgba(255,255,255,.025)!important;
      color:transparent!important;-webkit-text-fill-color:transparent!important;font-size:0!important;line-height:0!important;
      text-indent:-9999px!important;white-space:nowrap!important;overflow:hidden!important;position:relative!important;inset:auto!important;transform:none!important;
    }
    html body[data-mobile-art="v7"] .site-header nav #menu.open{
      left:0!important;right:0!important;width:100vw!important;max-width:100vw!important;
      padding-left:var(--m7-inline-start,20px)!important;padding-right:var(--m7-inline-end,20px)!important;box-sizing:border-box!important;
    }
  }
}

/* 761–1080px: remove the historical hybrid state (mobile CTA + desktop-ish menu).
   Tablet keeps the desktop outer gutter but receives one coherent navigation surface. */
@media (min-width:761px) and (max-width:1080px){
  html body[data-mobile-art="v7"] .site-header .nbc-mobile-context,
  html body[data-mobile-art="v7"] .site-header .nbc-mobile-header-cta{
    display:none!important;
    visibility:hidden!important;
    opacity:0!important;
    pointer-events:none!important;
  }
  html body[data-mobile-art="v7"] .site-header .burger{
    display:grid!important;
    place-items:center!important;
    width:44px!important;
    height:44px!important;
    min-width:44px!important;
    min-height:44px!important;
    margin:0!important;
    padding:0!important;
    border:1px solid rgba(229,241,232,.18)!important;
    border-radius:12px!important;
    background:rgba(255,255,255,.025)!important;
    color:transparent!important;
    -webkit-text-fill-color:transparent!important;
    font-size:0!important;
    line-height:0!important;
    text-indent:-9999px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    position:relative!important;
    z-index:1002!important;
  }
  html body[data-mobile-art="v7"] .site-header .burger::before,
  html body[data-mobile-art="v7"] .site-header .burger::after{
    content:""!important;position:absolute!important;left:50%!important;top:50%!important;
    width:18px!important;height:1.5px!important;border:0!important;border-radius:2px!important;
    background:#f5f2ed!important;box-shadow:none!important;transform-origin:center!important;
  }
  html body[data-mobile-art="v7"] .site-header .burger::before{transform:translate(-50%,-4px)!important;}
  html body[data-mobile-art="v7"] .site-header .burger::after{transform:translate(-50%,4px)!important;}
  html body[data-mobile-art="v7"].menu-open .site-header .burger::before,
  html body[data-mobile-art="v7"] .site-header .burger[aria-expanded="true"]::before{transform:translate(-50%,0) rotate(45deg)!important;}
  html body[data-mobile-art="v7"].menu-open .site-header .burger::after,
  html body[data-mobile-art="v7"] .site-header .burger[aria-expanded="true"]::after{transform:translate(-50%,0) rotate(-45deg)!important;}
  html body[data-mobile-art="v7"].menu-open .site-header .burger{background:#09140e!important;border-color:rgba(229,241,232,.22)!important;}

  html body[data-mobile-art="v7"] .site-header nav #menu.open{
    position:fixed!important;
    inset:0!important;
    z-index:88!important;
    width:100vw!important;
    max-width:100vw!important;
    height:100dvh!important;
    min-height:100svh!important;
    max-height:100dvh!important;
    margin:0!important;
    padding:calc(72px + 30px) clamp(32px,4vw,48px) calc(30px + env(safe-area-inset-bottom,0px))!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:0!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    background:radial-gradient(70% 42% at 84% 8%,rgba(78,171,105,.09),transparent 72%),#06130d!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
  }
  html body[data-mobile-art="v7"] .site-header nav #menu.open > .nbc-premium-menu-intro{display:none!important;}
  html body[data-mobile-art="v7"] .site-header nav #menu.open > li:not(.nbc-premium-menu-intro){
    width:min(680px,100%)!important;
    margin:0 auto!important;
    padding:0!important;
    border-top:0!important;
    border-bottom:1px solid rgba(229,241,232,.12)!important;
  }
  html body[data-mobile-art="v7"] .site-header nav #menu.open > li > a,
  html body[data-mobile-art="v7"] .site-header nav #menu.open .nav-summary{
    width:100%!important;
    min-height:58px!important;
    padding:14px 0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    color:#f5f2ed!important;
    font-size:clamp(22px,3.2vw,28px)!important;
    line-height:1.06!important;
    font-weight:700!important;
    text-align:left!important;
    background:none!important;
    border:0!important;
  }
  html body[data-mobile-art="v7"] .site-header nav #menu.open .nav-sub{
    position:static!important;width:100%!important;margin:0!important;padding:0 0 14px!important;
    background:none!important;border:0!important;box-shadow:none!important;
  }
  html body[data-mobile-art="v7"] .site-header nav #menu.open .nav-sub a{
    min-height:44px!important;padding:8px 0 8px 14px!important;display:flex!important;align-items:center!important;
    color:rgba(229,241,232,.68)!important;font-size:15px!important;
  }
  html body[data-mobile-art="v7"] .site-header nav #menu.open .nav-cta{
    min-height:54px!important;margin:18px 0 0!important;border-radius:14px!important;
    background:#f1eee5!important;color:#0b1710!important;justify-content:center!important;font-size:15px!important;
  }
}

/* Navigation overlay must sit above page-family rails/stages and menu CTA must
   have one label only; several tablet bundles add decorative pseudo-copy. */
@media (max-width:1080px){
  html body[data-mobile-art="v7"] .site-header{z-index:1000!important;}
  html body[data-mobile-art="v7"] .site-header nav #menu.open .nav-cta::before,
  html body[data-mobile-art="v7"] .site-header nav #menu.open .nav-cta::after{
    content:none!important;
    display:none!important;
  }
}