/* Shared public shell. A single menu tree stays in the document across breakpoints. */
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.site-header.site-shell { display:grid; grid-template-columns:auto minmax(0,1fr) auto; column-gap:24px; row-gap:12px; }
.site-shell > .site-brand { grid-column:1; grid-row:1; justify-self:start; width:fit-content; }
.site-navigation { display:contents; }
.site-shell .site-utilities { grid-column:2; grid-row:1; justify-content:flex-end; }
.site-shell .site-nav { grid-column:1/-1; grid-row:2; }
.site-icon-control { display:inline-flex; align-items:center; justify-content:center; flex:none; gap:8px; min-width:44px; min-height:44px; padding:10px; color:var(--ink); background:transparent; border:1px solid transparent; border-radius:4px; text-decoration:none; cursor:pointer; }
.site-icon { display:block; flex:none; width:24px; height:24px; }
.site-cart { grid-column:3; grid-row:1; font-size:.875rem; }
.mobile-menu-toggle, .mobile-drawer-heading, .mobile-menu-backdrop { display:none; }
.product-description { margin-top:28px; border-top:1px solid var(--line); padding-top:24px; }
.product-description h2 { font-size:1.65rem; }
.product-description .description { margin-bottom:12px; }

@media(max-width:999px) {
  .storefront-page .site-header.site-shell, .portal-page .site-header.site-shell {
    position:sticky; top:0; z-index:100; width:100%; min-height:72px; margin:0; padding:8px max(12px,env(safe-area-inset-left)) 8px max(12px,env(safe-area-inset-right));
    grid-template-columns:44px minmax(0,1fr) 44px; gap:8px; background:var(--cream); border-bottom:1px solid var(--line);
  }
  .site-shell > .site-brand { grid-column:2; grid-row:1; justify-self:center; font-size:clamp(1.2rem,4.5vw,1.55rem); letter-spacing:.2em; }
  .site-shell > .site-brand span { margin-top:5px; font-size:.55rem; }
  .site-cart { grid-column:3; grid-row:1; padding:10px; }
  .cart-label { position:absolute; width:1px; height:1px; margin:-1px; clip-path:inset(50%); overflow:hidden; }
  .site-shell .site-navigation { grid-column:1/-1; grid-row:2; display:block; min-width:0; }
  .site-shell .site-utilities { display:flex; flex-wrap:wrap; gap:8px 16px; justify-content:flex-start; padding:12px 0; }
  .site-shell .site-nav { display:flex; flex-direction:column; align-items:stretch; gap:8px; }
  /* Without script, navigation remains usable in the normal page flow. */
  .site-shell[data-mobile-navigation-ready] .mobile-menu-toggle { display:inline-flex; grid-column:1; grid-row:1; }
  .site-shell[data-mobile-navigation-ready] .site-navigation {
    display:none; position:fixed; inset:0 auto 0 0; z-index:102; width:min(88vw,360px); height:100vh; height:100dvh;
    padding:16px 20px max(24px,env(safe-area-inset-bottom)); background:var(--surface); overflow-y:auto; overscroll-behavior:contain; box-shadow:12px 0 32px #24252220;
  }
  .site-shell[data-mobile-menu-open] .site-navigation { display:block; }
  .site-shell[data-mobile-menu-open] .mobile-menu-backdrop:not([hidden]) { display:block; position:fixed; inset:0; z-index:101; background:#17171366; touch-action:none; }
  .site-shell[data-mobile-navigation-ready] .mobile-drawer-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; padding-bottom:12px; border-bottom:1px solid var(--line); margin-bottom:12px; }
  .mobile-drawer-heading p { margin:0; font:500 1.65rem/1.15 var(--editorial); }
  .site-shell .site-utilities { display:grid; grid-template-columns:1fr 1fr; gap:8px; border-bottom:1px solid var(--line); margin-bottom:16px; padding:0 0 16px; }
  .site-shell .site-utilities a { min-height:44px; justify-content:flex-start; padding:8px 4px; font-size:.875rem; }
  .site-shell .site-utilities .signup-link { grid-column:1/-1; justify-content:center; border:1px solid var(--ink); color:var(--surface); background:var(--ink); border-radius:4px; }
  .site-shell .site-nav > a { padding:10px 12px; border-bottom:1px solid var(--line); }
  .site-shell .nav-root > summary { font-size:1rem; border:0; border-bottom:1px solid var(--line); padding:14px 4px; border-radius:0; }
  .site-shell .nav-root > .nav-panel { border:0; box-shadow:none; border-radius:0; padding:4px 0 12px; margin:0; }
  .site-shell .nav-branch > summary { padding:12px 4px; font-size:.9375rem; }
  .site-shell .nav-branch > .nav-panel { padding:4px 0 8px 12px; }
  .site-shell .nav-links { grid-template-columns:minmax(0,1fr); gap:0; }
  .site-shell .site-nav .nav-links a { padding:12px 4px; border-bottom:1px solid var(--line); }
  .site-shell .nav-description { padding:8px 4px; }
  .site-shell .nav-view-all { padding:12px 4px; }
  .skip { z-index:120; }
  :where(main,main [id]) { scroll-margin-top:88px; }
}

@media(max-width:640px) {
  input, select, textarea { font-size:1rem; }
  .storefront-page main, .portal-page main { padding-bottom:32px; }
  .portal-intro { padding-block:24px 12px; }
  .portal-intro h1 { font-size:2.25rem; }
  .portal-lead { margin-bottom:16px; }
  .form-card { margin-block:16px; padding:20px; }
  .form-card h2 { font-size:1.75rem; }
  .form-alternative { margin-top:16px; }
  .form-card .search { margin-top:20px; }
  .catalog-intro .intro { padding-top:20px; }
  .catalog-intro h1 { font-size:2rem; }
  .catalog-intro .eyebrow { margin-bottom:8px; }
  .catalog-shortcuts { gap:8px 16px; }
  .catalog-search { margin-top:16px; }
  .listing-filters { margin-block:8px 20px; }
  .listing-filters > summary { display:flex; align-items:center; min-height:44px; font-weight:700; }
  .catalog-filters { padding:16px; gap:12px; }
  .filter-field { flex-basis:100%; }
  .catalog-filters button { width:100%; }
  .storefront-page .grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px 12px; }
  .card h2 { font-size:1.2rem; line-height:1.15; }
  .card .eyebrow { margin-top:12px; margin-bottom:6px; }
  .card .detail-link { font-size:.8125rem; align-items:center; gap:8px; }
  .product > .photo { height:min(78vw,300px); max-height:300px; aspect-ratio:auto; }
  .product h1 { font-size:clamp(1.8rem,7.2vw,2.4rem); margin-bottom:12px; }
  .product-copy > .eyebrow { margin-bottom:8px; }
  .product .fragrance-headline { margin-bottom:16px; font-size:1rem; }
  .version-selection { margin-top:20px; }
  .version-selection h2 { font-size:1.7rem; margin-bottom:12px; }
  .volume-options { grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:10px; }
  .volume-option { padding:12px; min-height:80px; }
  .cart-purchase { gap:12px; align-items:end; }
  .cart-purchase button { min-height:52px; padding-inline:12px; }
  .product-description { margin-top:24px; padding-top:20px; }
  .back { margin-block:12px; }
  .fragrance-profile, .fragrance-notes { margin-top:24px; }
  .welcome-banner { width:calc(100% - 32px); margin-inline:auto; padding:12px 16px; }
  .welcome-banner a { min-height:44px; }
  .site-footer { gap:20px; padding-block:24px; }
  .footer-links { display:flex; flex-direction:column; align-items:flex-start; gap:4px; }
  .footer-links a { min-height:44px; }
}
