/* Second design pass: shared fields, navigation, menus and motion. */
:root { --motion-ease: cubic-bezier(.22,1,.36,1); }
[hidden] { display:none !important; }
input:focus,input:focus-visible,select:focus,select:focus-visible { outline:none; }
input { transition:background .3s,border-color .3s,box-shadow .3s; }
input:focus-visible { border-color:#b7b7b1; box-shadow:0 0 0 4px #11111106; }
.header-search input:focus-visible,.sample-search input:focus-visible,.price-inputs input:focus-visible { box-shadow:none;border:0; }
.header-search,.sample-search { position:relative;border:1px solid transparent;border-radius:13px;transition:background .3s,border-color .3s,box-shadow .4s; }
.header-search:focus-within,.sample-search:focus-within { background:#fff;border-color:#d6d6d0;box-shadow:0 5px 25px #00000006,0 0 0 4px #11111103; }
.header-search input,.sample-search input { outline:none!important;border-radius:0;min-width:0;flex:1; }
.header-search { min-height:46px;gap:10px; }
.header-search>button[type=submit],.sample-search>button[type=submit] { width:30px;height:30px;flex-shrink:0;display:grid;place-items:center;border-radius:9px;transition:background .3s; }
.header-search>button[type=submit]:hover,.sample-search>button[type=submit]:hover { background:#efefeb; }
.search-clear { order:0;flex-shrink:0;width:26px;height:30px;display:grid!important;place-items:center;color:#888; }
.search-clear .icon { width:13px;height:13px; }
.search-clear[hidden] { display:none!important; }
.header-search>button[type=submit],.sample-search>button[type=submit] { order:1; }
.search-panel { position:absolute;top:calc(100% + 12px);right:0;width:430px;max-width:calc(100vw - 32px);padding:10px;background:#fff;border:1px solid #eaeae5;box-shadow:0 20px 65px #00000014,0 4px 12px #00000004;border-radius:18px;z-index:25; }
.search-panel-heading { display:flex;justify-content:space-between;gap:15px;align-items:center;padding:12px 10px 16px;font-size:9px;letter-spacing:.08em;color:#86867d; }
.search-panel-heading>span:last-child { letter-spacing:0;font-size:10px; }
.search-result { display:flex;gap:13px;align-items:center;padding:10px;border-radius:12px;transition:background .22s,transform .3s; }
.search-result:hover,.search-result[aria-selected=true] { background:var(--surface); }
.search-result-image { width:53px;height:61px;display:grid;place-items:center;border-radius:8px;background:#f7f7f5;flex-shrink:0;overflow:hidden; }
.search-result-image img { width:95%;height:55px;object-fit:contain;mix-blend-mode:multiply; }
.search-result-name { display:flex;flex-direction:column;gap:5px;min-width:0; }
.search-result-name strong { font-size:13px;font-weight:650;letter-spacing:-.025em; }
.search-result-name small { font-size:10px;color:var(--muted); }
.search-result-price { font-size:11px;font-weight:650;margin-left:auto;white-space:nowrap;display:flex;align-items:center;gap:12px; }
.search-result-price .icon { width:13px;height:13px;color:#888; }
.search-all { padding:14px 13px!important;display:flex!important;align-items:center;justify-content:space-between;width:100%;font-size:11px;margin-top:8px;border-top:1px solid var(--line); }
.search-all .icon { width:16px;height:16px; }
.search-keyboard { display:flex;justify-content:space-between;padding:12px 10px 4px;font-size:9px;color:#99998f; }
.search-empty { padding:25px 12px;text-align:center; }
.search-empty>.icon { display:block;margin:0 auto 15px;color:#aaa; }
.search-empty strong { font-size:14px; }
.search-empty p { font-size:12px;line-height:1.8;margin-top:8px; }
.sample-search { overflow:visible; }
.sample-search .search-panel { right:auto;left:0; }
.specimen { overflow:visible; }
.specimen-controls:focus-within { position:relative;z-index:8; }
.site-header { gap:30px;z-index:20; }
.wordmark { font-size:27px;letter-spacing:-.065em;white-space:nowrap; }
.site-header nav { gap:20px; }
.site-header nav .nav-catalog { display:flex;align-items:center;gap:11px;min-height:44px;padding:0 16px;border-radius:12px;background:#151515;color:#fff;font-size:12px;transition:background .3s,box-shadow .3s,transform .3s; }
.nav-catalog:hover,.nav-catalog[aria-expanded=true] { background:#333!important;box-shadow:0 5px 16px #00000012; }
.nav-catalog:active { transform:scale(.97); }
.nav-catalog>.icon { width:12px;height:12px;margin-left:4px;transition:transform .4s var(--motion-ease); }
.nav-catalog[aria-expanded=true]>.icon { transform:rotate(180deg); }
.catalog-glyph { display:grid;grid-template-columns:repeat(2,4px);gap:3px;transition:transform .5s var(--motion-ease); }
.catalog-glyph i { width:4px;height:4px;border:1px solid currentColor;border-radius:1px; }
.nav-catalog[aria-expanded=true] .catalog-glyph { transform:rotate(90deg); }
.catalog-menu { position:absolute;top:calc(100% - 5px);left:var(--gutter);right:var(--gutter);padding:28px;background:#fff;border:1px solid #e9e9e4;border-radius:20px;box-shadow:0 24px 65px #00000013;z-index:22; }
.menu-intro { display:flex;align-items:flex-end;justify-content:space-between;padding-bottom:25px; }
.menu-intro h2 { font-size:26px;margin-top:12px; }
.menu-intro>a { display:flex;gap:25px;align-items:center;font-size:12px; }
.menu-intro>a .icon { width:17px; }
.menu-categories { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px; }
.menu-categories>a { display:flex;flex-direction:column;position:relative;gap:15px;border-radius:14px;padding:17px;background:var(--surface);transition:background .3s,transform .4s var(--motion-ease);overflow:hidden; }
.menu-categories>a:hover { background:#eeeeea;transform:translateY(-3px); }
.menu-categories img { height:115px;width:100%;object-fit:contain;mix-blend-mode:multiply; }
.menu-categories>a>span { display:flex;flex-direction:column;gap:4px; }
.menu-categories strong { font-size:16px;font-weight:600; }
.menu-categories small { font-size:10px;color:var(--muted); }
.menu-categories>a>.icon { position:absolute;bottom:24px;right:16px;width:15px;height:15px; }
.category-tab { border-radius:12px;transition:background .4s,color .35s,transform .4s var(--motion-ease);min-height:45px; }
.category-tab:active { transform:scale(.96); }
.category-tab.active { box-shadow:0 4px 12px #00000009; }
.catalog-toolbar { position:relative;z-index:8; }
.filter-button { border-radius:12px;gap:10px;min-height:44px; }
.filter-button.active { background:#111;color:white; }
#filter-count:empty { display:none; }
#filter-count:not(:empty) { min-width:19px;height:19px;display:grid;place-items:center;background:#e8e8e3;color:#111;border-radius:6px;font-size:10px; }
.custom-select { position:relative;min-width:175px; }
.select-trigger { display:flex;align-items:center;justify-content:space-between;gap:22px;width:100%;min-height:44px;padding:0 14px;border:1px solid #e8e8e3;border-radius:12px;background:#fff;transition:background .25s,box-shadow .3s;white-space:nowrap;font-size:12px; }
.select-trigger:hover,.select-trigger[aria-expanded=true] { background:#f7f7f4; }
.select-trigger[aria-expanded=true] { box-shadow:0 0 0 4px #11111103; }
.select-trigger>.icon { width:13px;height:13px;color:#888;transition:transform .35s; }
.select-trigger[aria-expanded=true]>.icon { transform:rotate(180deg); }
.select-options { position:absolute;right:0;top:calc(100% + 8px);width:225px;background:#fff;border:1px solid #e7e7e1;box-shadow:0 16px 45px #00000012;border-radius:14px;padding:6px;z-index:10; }
.select-options>button { display:flex;justify-content:space-between;align-items:center;gap:15px;text-align:left;width:100%;min-height:43px;padding:10px 12px;border-radius:9px;font-size:12px;transition:background .2s; }
.select-options>button>.icon { width:15px;height:15px;visibility:hidden; }
.select-options>button[aria-selected=true] { background:#f3f3ef;font-weight:650; }
.select-options>button[aria-selected=true]>.icon { visibility:visible; }
.select-options>button:hover,.select-options>button:focus-visible { background:#f3f3ef;outline:none;box-shadow:inset 0 0 0 1px #d9d9d1; }
.filter-panel { margin-top:18px;padding:0;background:var(--surface);border:1px solid #eaeae5;border-radius:17px;overflow:hidden; }
.filter-content { padding:22px 25px; }
.filter-top { display:flex;align-items:center;justify-content:space-between;margin-bottom:22px;gap:20px; }
.filter-top>.eyebrow { font-size:9px; }
.filter-top .text-button { font-size:11px; }
.filter-top .icon { width:14px;height:14px; }
.filter-fields { display:grid;grid-template-columns:minmax(300px,1fr) 1fr;gap:40px;align-items:start; }
.filter-label { display:block;font-size:12px;font-weight:600;margin-bottom:12px; }
.price-inputs { display:flex;align-items:center;gap:10px; }
.price-inputs>label { display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #e4e4df;border-radius:11px;padding:0 13px;min-height:47px;min-width:0;flex:1;transition:border-color .3s,box-shadow .3s; }
.price-inputs>label:focus-within { border-color:#b5b5aa;box-shadow:0 0 0 4px #11111104; }
.price-inputs>label>span { font-size:12px;color:#92928b; }
.price-inputs input { width:100%;border:0;background:transparent;padding:12px 0;font-size:13px;outline:none; }
.price-dash { color:#aaa; }
.budget-presets { display:flex;gap:8px;margin-top:12px;flex-wrap:wrap; }
.budget-presets button { font-size:10px;border-radius:7px;padding:6px 9px;background:#eaeae5;color:#64645d;transition:background .25s,color .25s; }
.budget-presets button:hover,.budget-presets button.active { background:#deded6;color:#111; }
.filter-pills { display:flex;gap:7px;flex-wrap:wrap; }
.filter-pills button { min-height:46px;padding:0 15px;background:white;border:1px solid #e6e6e0;border-radius:10px;font-size:12px;transition:background .3s,color .3s; }
.filter-pills button[aria-pressed=true] { background:#111;color:white;border-color:#111; }
.field-error:empty { display:none; }
.active-filters { display:flex;gap:8px;flex-wrap:wrap; }
.active-filters:not(:empty) { margin-top:18px; }
.active-filters>button { display:flex;align-items:center;gap:10px;background:#f1f1ed;padding:8px 11px;border-radius:8px;font-size:10px; }
.active-filters .icon { width:12px;height:12px;color:#888; }
.product-details { overflow:hidden; }
.product-details summary .icon { transition:transform .55s var(--motion-ease); }
.product-details[data-expanded=true] summary .icon { transform:rotate(45deg); }
.product-details[data-expanded=false] summary .icon { transform:rotate(0); }
.details-body { padding-bottom:22px; }
.details-body p { font-size:12px;line-height:1.85;color:var(--muted); }
.details-body dl { padding:0!important; }
.product-stage .main-image-button { width:100%;height:100%;padding:45px 30px; }
.product-stage .main-image-button img { width:100%;height:100%;max-width:100%;object-fit:contain; }
.product-stage.alternate-view .main-image-button { padding:12px; }
.product-stage.alternate-view .main-image-button img { width:100%;height:100%;object-fit:contain; }
.product-stage.headphones .main-image-button img { margin:auto;width:72%;height:90%; }
.quantity-control rolling-number { font-size:13px;min-width:20px;justify-content:center;letter-spacing:0; }
.quantity-control.small rolling-number { font-size:12px; }
.cart-count rolling-number { font-size:10px;letter-spacing:0; }
#drawer-count { font-size:14px;letter-spacing:0;color:var(--muted);margin-left:6px; }
.studio-quantity { display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:12px; }
.button,.icon-button,.card-select { transition-duration:.35s; }
.cart-dialog[open] { animation-duration:.6s; }
.studio-seal>span { font-size:95px;letter-spacing:-.09em;padding-right:14px; }
@media(max-width:1320px) { .site-header nav .nav-studio { display:none; } }
@media(max-width:900px) { .site-header{gap:21px}.wordmark{font-size:24px}.header-search{width:250px}.filter-fields{grid-template-columns:1fr;gap:24px}.menu-categories img{height:90px}.menu-categories>a{padding:13px}.menu-categories small{font-size:9px} }
@media(max-width:680px) {
  .site-header{gap:15px}.wordmark{font-size:24px}.site-header nav{margin-left:auto}.site-header nav .nav-catalog{min-height:39px;padding:0 12px;font-size:10px;gap:8px}.nav-catalog>.icon{display:none}.header-search{width:100%;min-height:43px;border-radius:11px}.header-search input{font-size:12px;padding:11px 0}.cart-trigger{margin-left:0}.search-panel{width:100%;max-width:none;left:0;right:0;border-radius:14px;padding:7px;top:calc(100% + 9px)}.search-panel-heading{font-size:8px;padding:10px 8px}.search-panel-heading>span:last-child{font-size:9px}.search-result{padding:8px;gap:10px}.search-result-name strong{font-size:12px}.search-result-name small{font-size:9px}.search-result-image{width:42px;height:52px}.search-result-image img{height:48px}.search-result-price{font-size:10px;gap:4px}.search-result-price>.icon{display:none}.search-keyboard{font-size:8px}.sample-search .search-panel{width:calc(100% + 18px);left:-9px}.catalog-menu{top:70px;left:var(--gutter);right:var(--gutter);padding:18px;border-radius:16px}.menu-intro h2{font-size:22px}.menu-intro{gap:20px;align-items:flex-start;padding-bottom:20px}.menu-intro>a{font-size:9px;gap:9px;white-space:nowrap}.menu-intro .eyebrow{font-size:7px}.menu-categories{grid-template-columns:repeat(2,1fr);gap:9px}.menu-categories img{height:80px}.menu-categories strong{font-size:13px}.menu-categories small{font-size:8px}.menu-categories>a>.icon{width:12px;right:10px;bottom:20px}.category-tab{min-height:43px;font-size:11px}.custom-select{min-width:154px}.select-trigger{min-height:42px;font-size:10px;padding:0 10px;gap:10px}.select-options{width:205px}.select-options>button{font-size:12px}.filter-button{min-height:42px;padding:10px 12px;font-size:11px}.toolbar-left{gap:9px}#results-count{font-size:9px}.filter-content{padding:17px}.filter-top{margin-bottom:20px;gap:10px}.filter-top>.eyebrow{font-size:7px}.filter-top .text-button{font-size:10px}.filter-fields{grid-template-columns:minmax(0,1fr);gap:20px}.filter-label{font-size:11px}.price-inputs{gap:6px}.price-inputs>label{padding:0 9px;gap:7px}.price-inputs input{font-size:13px}.price-inputs>label>span{font-size:10px}.filter-pills{gap:6px}.filter-pills button{font-size:11px;min-height:43px;padding:0 11px}.budget-presets button{font-size:9px}.active-filters>button{font-size:10px}.product-stage .main-image-button{padding:40px 22px}.product-stage.alternate-view .main-image-button{padding:8px}.quantity-control button{width:33px;height:38px}.studio-seal>span{font-size:32px;padding-right:4px}.studio-intro h1{padding-right:62px}
}
@media(max-width:370px){.wordmark{font-size:21px}.site-header{gap:10px}.site-header nav .nav-catalog{padding:0 10px}.catalog-toolbar{gap:7px}.custom-select{min-width:145px}.toolbar-left{gap:6px}#results-count{font-size:8px}.filter-button{gap:5px}.filter-pills button{padding:0 9px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}}
