/* Highlights styling with Artone's full-screen veil and staged link reveal. */
.mobile-menu-primary,.mobile-menu-cases{display:flex;flex-direction:column;gap:17px}
.menu-toggle{display:block;width:16px;height:16px;flex:none;transition:transform 360ms cubic-bezier(.22,1,.36,1)}
.mobile-nav[open] .menu-toggle{transform:rotate(45deg)}

@media(max-width:760px){
 html.mobile-menu-open,html.mobile-menu-open body{overflow:hidden;overscroll-behavior:none}
 html.mobile-menu-open body{position:fixed;top:var(--menu-scroll-top,0px);inset-inline:0}
 body>header.has-menu.menu-visible{z-index:80}
 body>header.has-menu::after{
  content:"";position:fixed;inset:0;z-index:-3;pointer-events:none;
  background:rgba(16,17,15,.72);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
  clip-path:inset(0 0 100% 0);visibility:hidden;
  transition:clip-path 480ms cubic-bezier(.22,1,.36,1) 440ms,visibility 920ms;
 }
 body>header.has-menu.menu-open::after{clip-path:inset(0);visibility:visible;transition-delay:0ms}
 body>header.has-menu .brand,body>header.has-menu .mobile-nav summary{position:relative;z-index:2}
 body>header.has-menu .mobile-nav summary{display:flex;justify-content:center;align-items:center;gap:8px;width:auto;min-width:72px;height:48px;padding:0;color:var(--ink)}
 body>header.has-menu .menu-label{white-space:nowrap}
 body>header.has-menu [aria-expanded="false"] .menu-toggle{transform:rotate(0)}
 body>header.has-menu [aria-expanded="true"] .menu-toggle{transform:rotate(45deg)}
 body>header.has-menu .mobile-nav nav{
  position:fixed;inset:calc(86px + env(safe-area-inset-top,0px)) 0 0;
  display:flex;flex-direction:column;align-items:stretch;gap:32px;
  max-height:none;margin:0;padding:clamp(24px,5dvh,48px) var(--gutter) max(28px,env(safe-area-inset-bottom,0px));
  overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;
  background:transparent;border:0;box-shadow:none;visibility:hidden;pointer-events:none;
  transition:visibility 920ms;
 }
 body>header.has-menu.menu-open .mobile-nav nav{visibility:visible;pointer-events:auto}
 body>header.has-menu .mobile-menu-primary{gap:12px}
 body>header.has-menu .mobile-menu-primary>a{
  width:100%;font-family:Prata,Georgia,serif;font-size:clamp(28px,6.8vw,44px);line-height:1.4;letter-spacing:-.025em;
  transform:translateX(-32px);clip-path:inset(0 100% 0 0);
  transition:transform 320ms ease,clip-path 320ms ease;transition-delay:calc((2 - var(--menu-index,0))*40ms);
 }
 body>header.has-menu.menu-open .mobile-menu-primary>a{transform:translateX(0);clip-path:inset(0);transition-delay:calc(var(--menu-index,0)*65ms + 480ms)}
 body>header.has-menu .mobile-menu-cases{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px 20px;padding-top:26px;border-top:1px solid var(--line)}
 body>header.has-menu .mobile-menu-cases>a{font-size:12px;letter-spacing:.06em;line-height:1.65;min-height:36px;color:var(--muted)}
 body>header.has-menu .mobile-menu-cases,body>header.has-menu .mobile-menu-cta{opacity:0;transform:translateY(12px);filter:blur(3px);transition:opacity 280ms ease,transform 320ms ease,filter 280ms ease}
 body>header.has-menu.menu-open .mobile-menu-cases,body>header.has-menu.menu-open .mobile-menu-cta{opacity:1;transform:translateY(0);filter:blur(0);transition-delay:620ms}
 body>header.has-menu .mobile-menu-cta{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 0 0;border-top:1px solid var(--line);font-size:12px;line-height:1.6;color:var(--warm);margin-top:auto}
 body>header.has-menu.menu-open .mobile-menu-cta{transition-delay:700ms}
 body>header.has-menu .mobile-nav a:hover,body>header.has-menu .mobile-nav a:focus-visible{color:var(--warm)}
 html.mobile-menu-open .consent-banner{visibility:hidden}
 @supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){body>header.has-menu::after{background:rgba(16,17,15,.97)}}
}
@media(max-width:760px) and (max-height:540px){body>header.has-menu .mobile-nav nav{gap:22px;padding-top:20px}body>header.has-menu .mobile-menu-primary{gap:6px}body>header.has-menu .mobile-menu-primary>a{font-size:28px}}
@media(prefers-reduced-motion:reduce){body>header.has-menu::after,body>header.has-menu .mobile-nav nav,body>header.has-menu .mobile-menu-primary>a,body>header.has-menu .mobile-menu-cases,body>header.has-menu .mobile-menu-cta,.menu-toggle{transition:none!important}}
