:root { --header-height: 67px; }
html { scroll-padding-top: calc(var(--header-height) + 10px); scroll-behavior: auto; }
body { padding-top: var(--header-height); }
.site-header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 30;
  box-shadow: 0 2px 12px #152b2417;
}
.site-header .nav-inner { min-height: 0; height: calc(var(--header-height) - 1px); }
.site-header #studio-btn { display: none; }
.site-header .saved-nav { border-radius: 999px; }
.site-header nav a { white-space: nowrap; padding-block: 8px; }
.site-header nav a[aria-current] { color: var(--gold); text-decoration: underline; text-underline-offset: 5px; }
.skip:focus { z-index: 40; }
.category-band { background: var(--night); }
@media (min-width: 861px) {
  body:has(#discover[hidden]) .category-band { display: none; }
  #discover { scroll-margin-top: 58px; }
}
#category-strip { padding-block: 8px 10px; }
.dis-categories {
  flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none;
  overscroll-behavior-x: contain; padding: 3px 1px;
}
.dis-categories::-webkit-scrollbar, .site-header nav::-webkit-scrollbar { display: none; }
dialog { overscroll-behavior: contain; }
body:has(dialog[open]) { overflow: hidden; }
dialog#order {
  width: min(580px, 94vw); border: 1px solid var(--dark-rule); border-radius: 24px;
  padding: clamp(20px, 3vw, 32px);
}
dialog#order:not([open]), #delivery-settings[hidden], #clear-location[hidden] { display: none; }
dialog#order .concierge-hero { display: block; padding: 0; }
dialog#order .quick-panel h1 { font-size: clamp(32px, 6vw, 45px); margin: 5px 45px 16px 0; }
.cabinet-close {
  float: right; position: sticky; top: 0; z-index: 2; width: 38px; height: 38px;
  display: grid; place-items: center; border: 1px solid var(--dark-rule); border-radius: 50%;
  background: var(--night); color: var(--on-dark); font: 25px/1 var(--sans);
}
.cabinet-actions, .cabinet-services { display: flex; flex-wrap: wrap; gap: 7px; align-items: center; }
.cabinet-actions :is(a, button), #delivery-settings button[type=submit] { padding: 8px 15px; border-radius: 999px; }
#delivery-settings { margin-top: 20px; border-top: 1px solid var(--dark-rule); padding-top: 16px; }
#delivery-settings fieldset { margin: 0 0 16px; padding: 0; border: 0; }
#delivery-settings legend, .address-label { display: block; font-weight: 600; margin: 0 0 7px; }
.pay-options { display: flex; gap: 6px; }
.pay-options label { cursor: pointer; position: relative; }
.pay-options input { position: absolute; opacity: 0; }
.pay-options span {
  display: block; border-radius: 999px; border: 1px solid var(--dark-rule);
  padding: 9px 15px; font-size: 14px;
}
.pay-options input:checked + span { background: var(--gold); color: var(--night); border-color: var(--gold); }
.pay-options input:focus-visible + span { outline: 2px solid var(--gold); outline-offset: 2px; }
#delivery-address { width: 100%; border: 1px solid var(--dark-rule); border-radius: 12px; background: var(--paper); color: var(--night); padding: 11px 13px; }
.geo-row { display: flex; gap: 10px; flex-wrap: wrap; margin-block: 5px; }
.geo-row button, .cabinet-services a { color: var(--gold); font-size: 13px; padding: 8px 0; }
#delivery-status { margin: 4px 0 8px; color: var(--on-dark); font-size: 13px; }
#delivery-status:empty { display: none; }
.cabinet-services { gap: 18px; margin-top: 15px; border-top: 1px solid var(--dark-rule); padding-top: 6px; }
@media (max-width: 860px) {
  :root { --header-height: 58px; }
  .site-header .nav-inner { display:flex; align-items:center; justify-content:space-between; padding:0; }
  .site-header .brand { gap: 5px; }
  .site-header .brand span { font-size: 29px; }
  .site-header .brand svg { width: 27px; height: 27px; }
  .site-header .nav-actions { display:flex; align-items:center; gap:2px; }
  .site-header .saved-nav { display:inline-flex; align-items:center; justify-content:center; min-width:42px; height:44px; padding-inline:8px; border:0; }
  .site-header .saved-nav svg { width:21px; height:21px; }
  .site-header nav { display:none; }
  #category-strip nav { display:flex; flex:none; gap:6px; align-items:center; }
  #category-strip nav a {
    display:inline-flex; align-items:center; min-height:40px; padding:5px 13px;
    border-radius:999px; border:1px solid var(--dark-rule); white-space:nowrap; font:500 12px/1.3 var(--sans);
  }
  #category-strip nav a[aria-current] { color:var(--night); background:var(--gold); border-color:var(--gold); }
  body:has(#discover[hidden]) #category-strip .dis-chip,
  body:has(#discover:not([hidden])) #category-strip nav a[href="#discover"] { display:none; }
  #category-strip { padding-block: 4px 7px; }
  main > section[id] { scroll-margin-top: 52px; }
  #discovery-feed { width:calc(100% - 16px); padding-top:8px; }
  dialog[open] {
    top: var(--header-height); max-height: calc(100dvh - var(--header-height) - 12px);
  }
  dialog::backdrop { top: var(--header-height); }
  dialog#order { margin: auto auto max(5px, env(safe-area-inset-bottom)); }
}
@media (max-width: 370px) {
  .site-header .nav-inner .saved-nav { padding-inline: 6px; }
}

main > section[hidden] { display:none !important; }
main > section:focus { outline:none; }
.catalog-filter-panel { margin: 8px 0 15px; }
.catalog-filter-panel summary { cursor:pointer; font-size:14px; width:max-content; padding:8px 0; color:var(--wine); }
.catalog-filter-panel:not([open]) { border-bottom:1px solid var(--rule); }
.footer-links { display:flex; align-items:center; gap:18px; font-size:12px; }
.footer-links button { color:inherit; font:inherit; padding:0; }
@media(max-width:560px) { .footer-links { gap:12px; } .back-top { font-size:11px; } }
