/* =========================================================
   2026-09-16 — TABLET PORTRAIT HEADER MATCH
   Makes every tablet-portrait site header visually match the
   approved Services-page header style as closely as possible.
   Desktop, mobile, and tablet landscape remain unchanged.
   ========================================================= */
@media screen and (min-width:761px) and (max-width:1366px) and (orientation:portrait){
  body > .desktop-standard-header,
  html:has(body > .desktop-standard-header) body > .desktop-standard-header{
    display:flex !important;
    position:fixed !important;
    inset:0 0 auto 0 !important;
    z-index:100000 !important;
    width:100vw !important;
    height:76px !important;
    min-height:76px !important;
    margin:0 !important;
    padding:0 !important;
    background:#050505 !important;
    align-items:center !important;
    justify-content:center !important;
    border:0 !important;
    box-shadow:none !important;
  }

  body > .desktop-standard-header .desktop-standard-logo{
    position:absolute !important;
    left:26px !important;
    top:10px !important;
    width:205px !important;
    height:54px !important;
    overflow:hidden !important;
    pointer-events:none !important;
    user-select:none !important;
  }

  body > .desktop-standard-header .desktop-standard-logo img{
    display:block !important;
    width:100% !important;
    height:54px !important;
    object-fit:contain !important;
    object-position:left center !important;
    filter:none !important;
  }

  body > .desktop-standard-header .desktop-standard-nav{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:clamp(34px,4.5vw,58px) !important;
    height:76px !important;
    margin:0 auto !important;
    padding:0 14px 0 220px !important;
  }

  body > .desktop-standard-header .desktop-standard-nav a{
    position:relative !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    height:76px !important;
    color:#ffffff !important;
    text-decoration:none !important;
    text-transform:uppercase !important;
    font-family:Arial,Helvetica,sans-serif !important;
    font-size:clamp(13px,1.85vw,17px) !important;
    font-weight:500 !important;
    line-height:76px !important;
    letter-spacing:.06em !important;
    white-space:nowrap !important;
    background:none !important;
    -webkit-background-clip:border-box !important;
    background-clip:border-box !important;
    -webkit-text-fill-color:#ffffff !important;
    text-shadow:none !important;
  }

  body > .desktop-standard-header .desktop-standard-nav a::after,
  body > .desktop-standard-header .desktop-standard-nav a.active::after,
  body > .desktop-standard-header .desktop-standard-nav a:hover::after{
    content:"" !important;
    display:block !important;
    position:absolute !important;
    left:0 !important;
    right:0 !important;
    bottom:14px !important;
    height:2px !important;
    border-radius:2px !important;
    background:#ffffff !important;
    transform:scaleX(0) !important;
    transition:transform .18s ease !important;
  }

  body > .desktop-standard-header .desktop-standard-nav a.active::after,
  body > .desktop-standard-header .desktop-standard-nav a[aria-current="page"]::after{
    transform:scaleX(1) !important;
  }

  body > .desktop-standard-header .desktop-standard-nav a:hover::after,
  body > .desktop-standard-header .desktop-standard-nav a:focus-visible::after{
    transform:scaleX(1) !important;
  }

  /* keep primary desktop/tablet canvases tucked below the fixed portrait header */
  body:not(.services-page) > .desktop-home,
  body:not(.services-page) > .contact-screen,
  body:not(.services-page) > .tablet-contact-live,
  body:not(.services-page) > .desktop-art.about-exact-stage,
  body:not(.services-page) > .desktop-art,
  body:not(.services-page) > .desktop-standard-main,
  body:not(.services-page) > main.desktop-art{
    top:76px !important;
  }
}


/* =========================================================
   2026-09-29 — TABLET ACTIVE NAV UNDERLINE RESTORE
   Ensure every tablet page header shows the active-page line
   beneath the current navigation item. Phone and desktop stay
   unchanged.
   ========================================================= */
@media screen and (min-width:761px) and (max-width:1366px){
  body > .desktop-standard-header .desktop-standard-nav a,
  body > .desktop-unified-header .desktop-unified-nav a{
    position:relative !important;
  }

  body > .desktop-standard-header .desktop-standard-nav a::after,
  body > .desktop-standard-header .desktop-standard-nav a.active::after,
  body > .desktop-standard-header .desktop-standard-nav a:hover::after,
  body > .desktop-unified-header .desktop-unified-nav a::after,
  body > .desktop-unified-header .desktop-unified-nav a:hover::after{
    content:"" !important;
    display:block !important;
    position:absolute !important;
    left:0 !important;
    right:0 !important;
    bottom:14px !important;
    height:2px !important;
    border-radius:2px !important;
    background:#ffffff !important;
    transform:scaleX(0) !important;
    transition:transform .18s ease !important;
  }

  body > .desktop-standard-header .desktop-standard-nav a.active::after,
  body > .desktop-standard-header .desktop-standard-nav a[aria-current="page"]::after,
  body.home-page > .desktop-unified-header .desktop-unified-nav a[data-page="home"]::after,
  body.services-page > .desktop-unified-header .desktop-unified-nav a[data-page="services"]::after,
  body.works-page > .desktop-unified-header .desktop-unified-nav a[data-page="works"]::after,
  body.about-page > .desktop-unified-header .desktop-unified-nav a[data-page="about"]::after,
  body.contact-page > .desktop-unified-header .desktop-unified-nav a[data-page="contact"]::after,
  body.page-404 > .desktop-unified-header .desktop-unified-nav a[data-page]::after{
    transform:scaleX(1) !important;
  }

  body > .desktop-standard-header .desktop-standard-nav a:hover::after,
  body > .desktop-standard-header .desktop-standard-nav a:focus-visible::after,
  body > .desktop-unified-header .desktop-unified-nav a:hover::after,
  body > .desktop-unified-header .desktop-unified-nav a:focus-visible::after{
    transform:scaleX(1) !important;
  }
}