/* Direct compact-header starting state for non-Home pages.
   header.css owns the shared visual treatment; this companion only resolves
   the initial state that Home reaches through its Hero transition. */

body[data-page]:not([data-page="home"]) .header-shield{
  opacity:1;
}

body[data-page]:not([data-page="home"]) .logo-beam-wrap{
  top:42px;
  left:max(24px,2.6vw);
  width:min(300px,43vw);
  transform:translate3d(0,0,0);
  opacity:1;
  clip-path:inset(0 0 0 0);
  -webkit-clip-path:inset(0 0 0 0);
}

body[data-page]:not([data-page="home"]) .logo-wrap{
  top:calc(42px + min(1.225px,.17551vw));
  left:max(24px,2.6vw);
  width:min(300px,43vw);
  transform:translate3d(0,0,0);
}

/* CHANGE A RUNNING SYSTEM. is part of the CHARUS logo lockup. Home already
   carries the same claim through its Hero-to-compact transition; direct
   compact pages render the identical compact end-state relationship here. */
body[data-page]:not([data-page="home"]) .logo-wrap::after{
  content:"";
  position:absolute;
  left:16.4897959184%;
  top:94%;
  width:81.0612244898%;
  aspect-ratio:993 / 103;
  background:url("../images/hero-claim.png") center / 100% 100% no-repeat;
  pointer-events:none;
}
html[data-theme="dark"] body[data-page]:not([data-page="home"]) .logo-wrap::after{
  filter:invert(1);
}

body[data-page]:not([data-page="home"]) .nav-link{
  opacity:1;
  transform:none;
  pointer-events:auto;
}

/* Non-Home routes are the only routes with an active navigation item. Keep
   that state on the shared brand colour without changing glyph weight. When
   another navigation target is explored, the current item retains only 40%
   of the accent so attention follows the interaction and returns smoothly. */
body[data-page]:not([data-page="home"]) :is(.nav-link,.mobile-menu-link,.mobile-contact-link)[aria-current="page"]{
  color:var(--accent);
  font-weight:400;
  -webkit-text-stroke:0;
  paint-order:normal;
}
/* The current route is a status, not a second hover destination. Preserve
   keyboard focus indication, but do not apply the normal hover/focus lift or
   mobile flyout hover surface to the current-page label itself. */
body[data-page]:not([data-page="home"]) .nav-link[aria-current="page"]:is(:hover,:focus-visible),
body[data-page]:not([data-page="home"]) .mobile-contact-link[aria-current="page"]:is(:hover,:focus-visible){
  color:var(--accent);
  transform:none !important;
}
body[data-page]:not([data-page="home"]) .mobile-menu-link[aria-current="page"]:is(:hover,:focus-visible){
  color:var(--accent);
  background:transparent;
  transform:none;
}
body[data-page]:not([data-page="home"]) .nav__links:has(.nav-link:not([aria-current="page"]):focus-visible) .nav-link[aria-current="page"],
body[data-page]:not([data-page="home"]):has(.mobile-menu-panel .mobile-menu-link:not([aria-current="page"]):focus-visible) .mobile-contact-link[aria-current="page"],
body[data-page]:not([data-page="home"]) .mobile-menu-panel:has(.mobile-menu-link:not([aria-current="page"]):focus-visible) .mobile-menu-link[aria-current="page"],
body[data-page]:not([data-page="home"]):has(.mobile-contact-link:not([aria-current="page"]):focus-visible) .mobile-menu-link[aria-current="page"]{
  color:color-mix(in srgb,var(--accent) 40%,var(--bg));
}
@media(hover:hover) and (pointer:fine){
  body[data-page]:not([data-page="home"]) .nav__links:has(.nav-link:not([aria-current="page"]):hover) .nav-link[aria-current="page"],
  body[data-page]:not([data-page="home"]):has(.mobile-menu-panel .mobile-menu-link:not([aria-current="page"]):hover) .mobile-contact-link[aria-current="page"],
  body[data-page]:not([data-page="home"]) .mobile-menu-panel:has(.mobile-menu-link:not([aria-current="page"]):hover) .mobile-menu-link[aria-current="page"],
  body[data-page]:not([data-page="home"]):has(.mobile-contact-link:not([aria-current="page"]):hover) .mobile-menu-link[aria-current="page"]{
    color:color-mix(in srgb,var(--accent) 40%,var(--bg));
  }
}

body[data-page]:not([data-page="home"]) .language-switch{
  opacity:1;
  transform:none;
  pointer-events:auto;
}

body[data-page]:not([data-page="home"]) .theme-toggle{
  opacity:1;
}

@media(max-width:920px){
  body[data-page]:not([data-page="home"]){
    --compact-header-top:max(20px,calc(env(safe-area-inset-top) + 8px));
    --compact-logo-block:min(53.71px,8.95102vw);
    --compact-shield-solid:calc(var(--compact-header-top) + var(--compact-logo-block) + 18px);
    --compact-shield-dense:calc(var(--compact-shield-solid) + 8px);
    --compact-shield-soft:calc(var(--compact-shield-dense) + 10px);
    --compact-shield-end:calc(var(--compact-shield-soft) + 10px);
  }

  body[data-page]:not([data-page="home"]) .header-shield{
    height:var(--compact-shield-end);
    background:linear-gradient(
      to bottom,
      var(--shield-surface) 0,
      var(--shield-surface) var(--compact-shield-solid),
      color-mix(in srgb,var(--shield-surface) 94%,transparent) var(--compact-shield-dense),
      color-mix(in srgb,var(--shield-surface) 58%,transparent) var(--compact-shield-soft),
      transparent var(--compact-shield-end)
    );
  }

  body[data-page]:not([data-page="home"]) .logo-beam-wrap{
    top:var(--compact-header-top);
    left:max(24px,2.6vw,calc(env(safe-area-inset-left) + 10px));
    width:min(258px,43vw);
  }

  body[data-page]:not([data-page="home"]) .logo-wrap{
    top:calc(var(--compact-header-top) + min(1.054px,.17551vw));
    left:max(24px,2.6vw,calc(env(safe-area-inset-left) + 10px));
    width:min(258px,43vw);
  }

  body[data-page]:not([data-page="home"]) .nav{
    top:max(8px,calc(env(safe-area-inset-top) + 4px));
  }

  body[data-page]:not([data-page="home"]) .mobile-menu-toggle,
  body[data-page]:not([data-page="home"]) .mobile-contact-link{
    opacity:1;
    pointer-events:auto;
  }
}