/* Burkhart Atelier: smoke glass, champagne highlights, original performance layout. */
:root {
  --be-glass-edge: rgba(255,255,255,.24);
  --be-glass-shadow: 0 16px 40px -20px #0008, inset 0 1px 0 #ffffff38, inset 0 -1px 0 #ffffff0a;
  --be-glass-ease: cubic-bezier(.22,1,.36,1);
}
::selection { background:#c4a44b; color:#111; }
body { overflow-x:clip; }

/* The floating frame stays in the document flow; only the home hero sits behind it. */
.site-header {
  top:12px;
  width:min(1440px,calc(100% - 48px));
  margin:12px auto;
  border:1px solid var(--be-glass-edge);
  border-radius:20px;
  background:linear-gradient(125deg,#333833,#171c1a 50%,#30332c);
  box-shadow:var(--be-glass-shadow);
  isolation:isolate;
}
.site-header::before {
  content:""; position:absolute; top:-1px; left:8%; right:8%; height:1px;
  background:linear-gradient(90deg,transparent,#ffffffa0 30%,#e7cd83a0 65%,transparent);
  pointer-events:none;
}
.header-inner { width:100%; height:76px; padding-inline:22px; gap:18px; }
.desktop-nav { gap:4px; }
.nav-link {
  height:44px; padding:0 12px; border:1px solid transparent; border-radius:12px;
  font-size:10px; letter-spacing:.055em;
  transition:background .25s,border-color .25s,box-shadow .25s,color .25s,transform .35s var(--be-glass-ease);
}
.nav-link::after {
  left:16px; right:16px; bottom:5px; width:auto; height:1px;
  background:linear-gradient(90deg,transparent,var(--gold-light),transparent);
  opacity:0; transform:scaleX(.4); transition:opacity .25s,transform .35s var(--be-glass-ease);
}
.nav-link:hover::after,.nav-link.active::after { width:auto; opacity:1; transform:scaleX(1); }
.nav-link.active {
  color:#f5df9e; border-color:#e7cd833b;
  background:linear-gradient(135deg,#e7cd8324,#e7cd8309);
  box-shadow:inset 0 1px 0 #ffffff20,0 4px 16px #00000012;
}
.nav-link span { transition:transform .25s var(--be-glass-ease); }
.header-actions { gap:6px; }
.header-actions .icon-btn {
  width:44px; min-width:44px; height:44px; border-radius:13px;
  border:1px solid #ffffff22;
  background:linear-gradient(145deg,#ffffff12,#ffffff03);
  box-shadow:inset 0 1px 0 #ffffff16,0 3px 10px #0000000c;
  transition:background .25s,border-color .25s,color .25s,transform .25s var(--be-glass-ease);
}
.cart-count { top:-4px; right:-4px; border:2px solid #363a31; min-width:20px; height:20px; background:linear-gradient(135deg,#f1dfa5,#c4a44b); }
.site-header:has(.mobile-nav:not([hidden])) { background:#202622; }
.mobile-nav { border-radius:0 0 20px 20px; }
body:has(.hero) .site-header { margin-bottom:-90px; }
body:has(.hero) .hero { height:auto; min-height:680px; }
body:has(.hero) .hero-content { padding-top:176px; }

/* Glass controls share the same polished edge, without changing purchase hierarchy. */
.btn {
  border-radius:12px;
  box-shadow:inset 0 1px 0 #ffffff45,0 5px 16px #1013130c;
  transition:transform .3s var(--be-glass-ease),box-shadow .3s,border-color .3s,background .3s;
}
.btn-gold {
  color:#252215; border-color:#d8bc6c;
  background:linear-gradient(160deg,#f0dfa8 0%,#d7b961 48%,#c4a44b 100%);
  box-shadow:inset 0 1px 0 #fff9,inset 0 -1px 0 #88702c33,0 8px 24px #c4a44b24;
}
.btn-dark { background:linear-gradient(145deg,#3a4039,#1b201d); border-color:#484e44; }
.btn-outline { background:linear-gradient(135deg,#ffffff1f,#ffffff08); border-color:#ffffff50; }
.btn-outline,.category-arrow,.favorite-btn {
  -webkit-backdrop-filter:blur(14px) saturate(140%);
  backdrop-filter:blur(14px) saturate(140%);
}
.vehicle-finder {
  border-radius:18px; border-color:#ffffff40;
  background:linear-gradient(125deg,#3b4038,#202620);
  box-shadow:var(--be-glass-shadow),0 1px 0 #c4a44b35;
}
.finder-copy p,.finder-copy span,.finder-controls label { color:#d3d7ce; }
.finder-controls select {
  border-radius:10px; background:linear-gradient(135deg,#ffffff16,#ffffff06);
  border-color:#ffffff32; box-shadow:inset 0 1px 0 #ffffff12; min-height:46px;
}

/* Keep photographs clean; frame the surrounding interaction with soft glass. */
.product-media,.main-product-image { border-radius:16px; border-color:#dedfd7; box-shadow:0 8px 26px -20px #1e281f50,inset 0 1px 0 #fff; }
.product-media { transition:border-color .3s,box-shadow .3s; }
.product-badge { border-radius:6px; background:#f6f6efed; }
.favorite-btn { width:40px; height:40px; border:1px solid #fff; box-shadow:0 4px 14px #1b241b14,inset 0 1px 0 #fff; }
.product-action { border-radius:10px; box-shadow:inset 0 1px 0 #ffffff99; }
.category-card,.journal-photo { border-radius:16px; }
.category-arrow { border-color:#ffffff5c; box-shadow:inset 0 1px 0 #ffffff40,0 5px 15px #0002; }
.filter-advice,.empty-state {
  border-radius:14px; border-color:#fff;
  background:linear-gradient(135deg,#fffffff2,#f1f1e5cf);
  box-shadow:0 8px 28px -20px #313c2d55,inset 0 1px 0 #fff;
}
.filter-button { border-radius:8px; }
.filter-button.active { background:linear-gradient(130deg,#f3ecd5,#e8e1c7); box-shadow:inset 0 1px 0 #fff9; color:#5f4b16; }
.filter-chip,.shop-toolbar select,.search-field input,.filter-group select,.quantity,.product-summary select,.thumbnails button {
  border-radius:10px; border-color:#d3d8cb;
  box-shadow:inset 0 1px 0 #fff,0 3px 12px #24331c05;
}
.shop-toolbar { padding:16px; border:1px solid #fff; border-radius:16px; background:linear-gradient(125deg,#ffffffbd,#f6f5eb70); box-shadow:inset 0 1px 0 #fff,0 8px 28px -23px #28352350; }
.shop-toolbar select,.filter-group select { min-height:44px; }
.search-field input { background:linear-gradient(135deg,#fffffff5,#ffffff9c); }
.filter-chip { background:linear-gradient(135deg,#ffffffdf,#eeeedea6); }
.quantity button { min-width:40px; }
.thumbnails button.active { box-shadow:0 0 0 3px #c4a44b1a; }
.detail-service { padding:16px; border:1px solid #fff; border-radius:14px; background:linear-gradient(135deg,#ffffffd9,#ffffff66); }
.detail-service > div,.detail-service > a { color:#58604f; }

/* Frosted sheets retain an opaque fallback and readable text. */
dialog {
  border-radius:22px; border-color:#ffffffb3;
  background:#f4f5ef; box-shadow:0 35px 110px #0006,inset 0 1px 0 #fff;
}
dialog::backdrop { background:#0c141780; -webkit-backdrop-filter:blur(9px); backdrop-filter:blur(9px); }
.dialog-head { background:linear-gradient(135deg,#ffffffb3,#f1eddd66); border-bottom-color:#d7dacf; }
.dialog-head .icon-btn { background:#ffffffa6; border:1px solid #fff; }
.dialog-head .icon-btn:hover { color:#51441e; background:#f3ead1; }
.toast { border-radius:14px; border:1px solid #ffffff38; box-shadow:var(--be-glass-shadow); }
footer { border-top:1px solid #c4a44b33; }

@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
  .site-header {
    background:linear-gradient(125deg,rgba(54,60,53,.83),rgba(18,24,22,.76) 50%,rgba(45,48,39,.82));
    -webkit-backdrop-filter:blur(28px) saturate(160%);
    backdrop-filter:blur(28px) saturate(160%);
  }
  .vehicle-finder {
    background:linear-gradient(125deg,rgba(51,57,48,.85),rgba(21,29,23,.8));
    -webkit-backdrop-filter:blur(24px) saturate(150%);
    backdrop-filter:blur(24px) saturate(150%);
  }
  dialog { background:linear-gradient(135deg,#ffffffef,#f1f3e8e8); -webkit-backdrop-filter:blur(28px) saturate(140%); backdrop-filter:blur(28px) saturate(140%); }
}
@media (hover:hover) and (pointer:fine) {
  .nav-link:hover { color:#fff0c3; border-color:#ffffff30; background:linear-gradient(135deg,#ffffff1f,#ffffff08); box-shadow:inset 0 1px 0 #ffffff26; transform:translateY(-1px); }
  .nav-link:hover span { transform:translate(2px,-2px); }
  .header-actions .icon-btn:hover { color:#f5df9e; border-color:#e7cd8370; background:linear-gradient(145deg,#e7cd832c,#ffffff08); transform:translateY(-2px); }
  .btn-gold:hover { background:linear-gradient(160deg,#f7e9bd,#e4c778 55%,#d1af51); box-shadow:inset 0 1px 0 #fffc,0 10px 30px #c4a44b40; }
  .btn-dark:hover { background:linear-gradient(145deg,#4c5449,#272d28); box-shadow:inset 0 1px 0 #ffffff45,0 8px 20px #10131320; }
  .product-card:hover .product-media { border-color:#c4a44b70; box-shadow:0 14px 32px -22px #3c43245c; }
}
/* Clear focus rings on both light and dark glass. */
:where(main,dialog) :focus-visible { outline:2px solid #79601d; outline-offset:4px; }
.product-media > a:focus-visible { outline-offset:-4px; border-radius:inherit; }
.site-header :focus-visible,.hero :focus-visible,.vehicle-finder :focus-visible { outline:2px solid #f0d789; outline-offset:3px; }

@media (max-width:1080px) {
  .desktop-nav { display:none; }
  .mobile-toggle { display:inline-flex; }
  .header-inner { height:72px; padding-inline:18px; }
  .mobile-nav:not([hidden]) {
    display:flex; flex-direction:column; gap:4px; padding:12px 16px 18px;
    background:linear-gradient(145deg,#ffffff05,#c4a44b05);
    border-top:1px solid #ffffff24; max-height:calc(100dvh - 132px);
    overflow-y:auto; overscroll-behavior:contain;
  }
  .mobile-nav a {
    display:flex; align-items:center; min-height:46px; padding:12px 15px;
    border:1px solid #ffffff0f; border-radius:10px; color:#f1f1e9;
    background:linear-gradient(135deg,#ffffff0c,#ffffff03);
    font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.08em;
  }
  .mobile-nav a:hover,.mobile-nav a:focus-visible { background:#ffffff17; color:#f5df9e; }
  body:has(.hero) .site-header { margin-bottom:-86px; }
  body:has(.hero) .hero-content { padding-top:164px; }
}
@media (max-width:600px) {
  .site-header { top:8px; width:calc(100% - 16px); margin-block:8px; border-radius:16px; }
  .header-inner { height:68px; padding-inline:10px; gap:8px; }
  .site-header .logo { min-width:0; width:clamp(96px,calc(100vw - 224px),152px); }
  .header-actions { gap:0; }
  .header-actions .icon-btn { border-radius:11px; width:44px; min-width:44px; height:44px; padding:11px; }
  .header-actions .icon-btn + .icon-btn { border-left-color:transparent; }
  .cart-count { top:-1px; right:0; }
  .mobile-nav { border-radius:0 0 16px 16px; }
  .mobile-nav:not([hidden]) { padding:10px; max-height:calc(100dvh - 116px); }
  body:has(.hero) .site-header { margin-bottom:-78px; }
  body:has(.hero) .hero-content { padding-top:140px; }
  .vehicle-finder { border-radius:16px; }
  .product-media,.category-card,.journal-photo { border-radius:12px; }
  .favorite-btn { width:40px; height:40px; top:8px; right:8px; }
  dialog { border-radius:18px; }
}
@media (max-width:360px) {
  .header-inner { padding-inline:6px; gap:6px; }
  .site-header .logo { width:88px; }
}
@media (prefers-reduced-transparency:reduce) {
  .site-header,.site-header:has(.mobile-nav:not([hidden])),.vehicle-finder { background:#222923; backdrop-filter:none; -webkit-backdrop-filter:none; }
  dialog { background:#f4f5ef; backdrop-filter:none; -webkit-backdrop-filter:none; }
  dialog::backdrop { background:#101713c9; backdrop-filter:none; -webkit-backdrop-filter:none; }
}
@media (prefers-reduced-motion:reduce) {
  .nav-link:hover,.header-actions .icon-btn:hover,.btn:hover { transform:none; }
}
@media print {
  body:has(.hero) .site-header { margin:0; }
  .product-media { box-shadow:none; }
}