@font-face{font-family:Onest;src:url("assets/fonts/Onest-Latin-Variable.woff2") format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+0000-024F,U+2000-206F,U+20A0-20CF}
@font-face{font-family:Onest;src:url("assets/fonts/Onest-Cyrillic-Variable.woff2") format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+0400-052F,U+2DE0-2DFF,U+A640-A69F}

:root{
  --blue:#434865;
  --ink:#2e3147;
  --muted:#717384;
  --cream:#f4f0e6;
  --sky:#9fb6df;
  --peach:#eab6a8;
  --pink:#ecb0b5;
  --paper:#fff;
  --visual:#f3f3f3;
  --line:#dedfe4;
  --content:min(1400px,calc(100vw - clamp(48px,10vw,160px)));
}

.price-ruble{font-family:inherit;font-size:1em;font-style:inherit;font-weight:500;letter-spacing:inherit;line-height:inherit;vertical-align:baseline;-webkit-text-stroke:.15px currentColor}

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:110px;scrollbar-gutter:stable}
body{margin:0;background:#fff;color:var(--ink);font:400 15px/1.5 Onest,Arial,sans-serif}
body.is-locked{overflow:hidden}
a{color:inherit;text-decoration:none}
button,input,select{font:inherit;color:inherit}
button{border:0;background:none;padding:0;cursor:pointer}
button:disabled{cursor:default;opacity:.35}
img{display:block;max-width:100%}
svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
h1,h2,h3,p{margin:0}
h1,h2,h3{font-weight:500}
fieldset{border:0;padding:0;margin:0}
[hidden]{display:none!important}
.shell{width:var(--content);margin-inline:auto}
.svg-library{position:absolute;width:0;height:0;overflow:hidden}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:fixed;z-index:1000;top:-60px;left:20px;background:#fff;padding:12px 18px}.skip:focus{top:12px}

/* The same service strip and navigation language as the homepage. */
.service{position:sticky;z-index:60;top:0;height:32px;display:grid;grid-template-columns:36px minmax(0,620px) 36px;align-items:center;justify-content:center;column-gap:32px;padding-inline:12px;background:var(--blue);color:#fff;font-size:12px;text-align:center}
.service button{display:grid;place-items:center;width:36px;height:26px;color:#fff}
.service svg{width:15px;height:15px}

.catalog-header{position:sticky;top:32px;z-index:50;height:76px;background:#fff;border-bottom:1px solid var(--line);transition:height .25s}
.catalog-header.scrolled{height:64px}
.header-inner{height:100%;display:grid;grid-template-columns:1fr auto 1fr;align-items:center}
.brand-logo{width:128px;justify-self:start}
.brand-logo img{width:100%}
.desktop-nav{display:flex;align-items:center;justify-content:center;gap:30px;font-size:14px}
.desktop-nav a{position:relative;padding:10px 0}
.desktop-nav a:after{content:"";position:absolute;left:0;right:100%;bottom:5px;height:1px;background:var(--blue);transition:right .18s}
.desktop-nav a:hover:after,.desktop-nav a.is-active:after{right:0}
.header-actions{justify-self:end;display:flex;align-items:center;gap:5px}
.login-button{display:flex;min-height:40px;align-items:center;justify-content:center;gap:10px;padding:0 10px;color:var(--blue);font-size:14px;font-weight:400;white-space:nowrap}
.login-button svg{width:19px;height:19px}
.login-button:hover,.login-button:focus-visible{text-decoration:underline;text-underline-offset:5px}
.header-icon,.menu-toggle{position:relative;width:36px;height:36px;display:grid;place-items:center;color:var(--blue)}
.header-icon svg{width:19px;height:19px}
.favorites-button.is-active svg{fill:var(--blue);stroke:var(--blue)}
.cart-count{position:absolute;right:-6px;top:-2px;display:grid;min-width:18px;height:18px;place-items:center;padding:0 5px;border-radius:999px;background:var(--blue);color:#fff;font-size:10px;font-weight:600;line-height:1;text-align:center}
.cart-count[hidden]{display:none}
.menu-toggle{display:none}.menu-toggle svg{width:20px;height:20px}
.mobile-nav{display:none}

/* Full-width catalogue banner using the generated light-blue striped artwork. */
.catalog-intro{min-height:250px;padding:0;background:#bfd2e8 url("assets/media/catalog-banner-blue-stripes-v1.png") center/cover no-repeat;color:var(--blue)}
.catalog-intro-inner{display:flex;min-height:250px;align-items:center}
.catalog-intro-grid{display:grid;width:100%;grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);gap:80px;align-items:start}
.catalog-intro h1{color:var(--blue);font-size:clamp(42px,4vw,62px);font-weight:500;line-height:1.02;letter-spacing:-.045em}
.catalog-intro-copy{width:100%;max-width:440px;margin-top:0;justify-self:end;text-align:right}
.catalog-intro-copy p{margin-bottom:16px;color:var(--ink);font-size:15px;line-height:1.55}
.total-fragrances{font-size:14px;color:var(--blue)}

.catalog-shell{padding-bottom:150px}
.catalog-categories{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin-top:32px;background:transparent}
.catalog-categories[hidden]{display:none!important}
.catalog-category{display:flex;min-width:0;min-height:54px;align-items:center;justify-content:space-between;gap:10px;padding:10px 16px;border:1px solid var(--line);background:#fff;color:var(--ink);font-size:14px;text-align:left;transition:background-color .18s,color .18s}
.catalog-category:hover,.catalog-category:focus-visible{background:#edf2f8;outline:0}
.catalog-category.is-active{background:var(--catalog-action,#373863);color:#fff}
.catalog-category small{flex:0 0 auto;color:inherit;font-size:11px;opacity:.7}
.catalog-toolbar{display:grid;grid-template-columns:minmax(300px,1fr) auto;align-items:center;gap:48px;min-height:94px;margin:0;padding:22px 0 18px;background:#fff;color:var(--ink)}
.catalog-search{display:flex;width:min(560px,100%);height:50px;align-items:center;gap:12px;padding:0 16px;border:1px solid rgba(67,72,101,.46);background:#fff;color:var(--blue);transition:border-color .18s}
.catalog-search:focus-within{border-color:var(--blue)}
.catalog-search svg{width:18px;height:18px;flex:0 0 auto}
.catalog-search-caption{color:var(--ink);font-size:14px;line-height:1.2;letter-spacing:normal;text-transform:none;white-space:nowrap}
.catalog-search input{width:100%;height:100%;border:0;outline:0;background:transparent;color:var(--ink);font-size:14px}
.catalog-search input::placeholder{color:#687087}
.sort-control{position:relative;display:flex;width:310px;height:50px;align-items:center;gap:22px;padding:0 0 0 18px;border:1px solid rgba(67,72,101,.46);background:#fff;font-size:14px;transition:border-color .18s}
.sort-control:focus-within,.sort-control:hover{border-color:var(--blue)}
.sort-label{color:var(--ink);font-size:14px;line-height:1.2;letter-spacing:normal;white-space:nowrap}
.sort-trigger{display:flex;flex:1;height:100%;min-width:0;align-items:center;justify-content:space-between;gap:18px;padding:0 18px 0 0;border:0;background:transparent;color:var(--blue);font-size:14px;text-align:left;cursor:pointer}
.sort-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sort-chevron{width:17px;height:17px;flex:0 0 auto;transition:transform .18s}
.sort-control.is-open .sort-chevron{transform:rotate(180deg)}
.sort-menu{position:absolute;z-index:25;top:calc(100% + 6px);right:-1px;width:205px;padding:7px;border:1px solid rgba(67,72,101,.46);background:#fff;box-shadow:0 12px 28px rgba(24,31,58,.14)}
.sort-menu[hidden]{display:none}
.sort-menu button{display:block;width:100%;padding:10px 12px;border:0;background:#fff;color:var(--ink);font-size:14px;line-height:1.25;text-align:left;cursor:pointer}
.sort-menu button:hover,.sort-menu button:focus-visible,.sort-menu button[aria-selected="true"]{background:#e8eef8;color:var(--blue);outline:0}
.filter-toggle{display:none;height:44px;border:0;padding:0 18px;align-items:center;gap:8px;color:var(--blue);font-size:13px}
.filter-count{min-width:18px;height:18px;background:var(--blue);color:#fff;font-size:10px;place-items:center}.filter-count:not([hidden]){display:grid}
.active-filters{display:flex;height:52px;align-items:flex-start;gap:8px;padding-top:12px;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scrollbar-color:rgba(67,72,101,.28) transparent}
.active-filters[hidden],.filter-toggle[hidden]{display:none!important}
.active-filters:empty{display:flex}
.active-chip{display:flex;min-height:32px;flex:0 0 auto;align-items:center;gap:10px;padding:6px 10px;background:#e8eef8;color:var(--blue);font-size:12px}.active-chip svg{width:15px;height:15px}

.catalog-layout{display:grid;grid-template-columns:240px minmax(0,1fr);gap:14px;padding-top:24px;align-items:start}
.filter-panel{position:sticky;top:104px;height:var(--filter-panel-height,calc(100dvh - 120px));padding-right:12px;overflow-y:scroll;scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:rgba(67,72,101,.42) rgba(67,72,101,.07)}
.filter-panel::-webkit-scrollbar{width:5px}
.filter-panel::-webkit-scrollbar-thumb{background:rgba(67,72,101,.42)}
.filter-panel::-webkit-scrollbar-track{background:rgba(67,72,101,.07)}
.filter-panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.filter-panel-head h2{font-size:24px;font-weight:500;line-height:1.1;color:var(--blue)}
.filter-close{display:none}.filter-close svg{width:22px;height:22px}
.filter-group{border-bottom:1px solid var(--line);padding:20px 0}
.filter-group legend,.filter-group summary{width:100%;list-style:none;color:var(--ink);font-size:20px;font-weight:500;line-height:1.3;cursor:pointer}
.filter-group summary{display:flex;align-items:center;justify-content:space-between}
.filter-group summary::-webkit-details-marker{display:none}
.filter-group summary svg{width:16px;height:16px;transition:transform .18s}.filter-group[open] summary svg{transform:rotate(180deg)}
.filter-options{display:grid;gap:11px;padding-top:17px}
.filter-options label,.filter-gender label{display:flex;align-items:center;gap:10px;color:var(--ink);font-size:14px;font-weight:400;cursor:pointer}
.filter-options input,.filter-gender input{appearance:none;width:16px;height:16px;margin:0;border:1px solid rgba(67,72,101,.45);display:grid;place-items:center;flex:0 0 auto}
.filter-options input:checked,.filter-gender input:checked{background:var(--blue);border-color:var(--blue);box-shadow:inset 0 0 0 4px #fff}
.filter-gender{display:grid;grid-template-columns:1fr 1fr;gap:11px}.filter-gender legend{grid-column:1/-1;margin-bottom:5px}.filter-gender input{border-radius:50%}
.filter-panel-actions{display:flex;flex-direction:column;gap:12px;padding-top:20px}
.reset-filters{align-self:flex-start;border-bottom:1px solid var(--blue);color:var(--ink);font-size:14px;font-weight:400}
.apply-filters{display:none;min-height:44px;background:var(--blue);color:#fff;font-size:14px;font-weight:400}

.results-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:26px}
.results-heading h2{color:var(--blue);font-size:38px;font-weight:500;line-height:1.05;letter-spacing:-.04em}
.result-count{color:var(--muted);font-size:14px}
.fragrance-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.fragrance-card{display:flex;min-width:0;flex-direction:column;border:1px solid #e6e2df;background:#fff}
.fragrance-media-shell{position:relative;background:var(--visual);overflow:hidden}
.fragrance-media{display:flex;height:410px;align-items:center;justify-content:center;padding:58px 34px 32px;background:var(--visual);color:inherit}
.fragrance-media:before{display:none}
.fragrance-media img{width:100%;height:100%;max-height:305px;object-fit:contain;filter:drop-shadow(0 18px 12px rgba(37,32,28,.1));transition:none}
.fragrance-card:hover .fragrance-media img{transform:none}
.catalog-product-card .fragrance-media img{max-width:86%;max-height:292px}
.catalog-product-card .fragrance-badge{max-width:calc(100% - 62px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fragrance-placeholder{display:flex;height:100%;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center}.fragrance-placeholder img{width:130px;height:auto}.fragrance-placeholder strong{font-size:16px}.fragrance-placeholder span{font-size:12px;color:var(--muted)}
.fragrance-badge{position:absolute;z-index:2;left:14px;top:14px;padding:7px 10px;background:#f4f3f1;color:var(--blue);font-size:10px;font-weight:600;line-height:1;letter-spacing:.07em;text-transform:uppercase}
.favorite-toggle{position:absolute;z-index:3;right:10px;top:9px;width:36px;height:36px;display:grid;place-items:center;border-radius:50%;background:rgba(255,255,255,.88);color:var(--blue)}
.favorite-toggle svg{width:18px;height:18px}.favorite-toggle.is-active svg{fill:var(--blue);stroke:var(--blue)}
.fragrance-info{display:flex;flex:1;flex-direction:column;min-height:164px;padding:18px 20px;color:var(--blue)}
.fragrance-title-row{display:block}
.fragrance-title-row h3{font-size:18px;font-weight:600;line-height:1.2}
.fragrance-title-row h3 a{display:inline-block}
.fragrance-title-row>strong{display:none}
.fragrance-original{margin:7px 0 18px;color:#687087;font-size:14px;font-weight:400;line-height:1.4}
.fragrance-notes{display:none}
.card-actions{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:auto;padding-top:16px;border-top:1px solid rgba(67,72,101,.22);opacity:1}
.details-button{display:none}
.card-price{font-size:15px;font-weight:600;white-space:nowrap}
.add-button{display:flex;align-items:center;justify-content:center;width:auto;min-width:128px;height:42px;padding:0 14px;border:1px solid var(--blue);background:var(--blue);color:#fff;font-size:14px;font-weight:400;line-height:1;text-align:center;transition:background .18s,color .18s}
.add-button:hover,.add-button:focus-visible{background:#fff;color:var(--blue)}
.load-more{display:block;min-width:168px;height:46px;margin:52px auto 0;border:1px solid var(--blue);background:#fff;color:var(--blue);font-size:14px}.load-more:hover{background:var(--blue);color:#fff}
.catalog-empty{padding:80px 24px;background:var(--cream);text-align:center}.catalog-empty h3{margin-bottom:10px;font-size:30px}.catalog-empty p{margin-bottom:24px;color:var(--muted)}.button-outline{height:44px;padding:0 18px;border:1px solid var(--blue)}

/* Homepage footer, repeated deliberately until the shared component is extracted. */
.catalog-footer{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:35px;margin-top:0;padding-top:0;padding-bottom:23px;color:var(--ink)}
.footer-logo img{width:155px}
.catalog-footer h3{margin:0 0 15px;font-size:15px;font-weight:500}
.catalog-footer>div>a,.catalog-footer>div>button{display:block;margin:12px 0;padding:0;color:var(--muted);font-size:14px;text-align:left}
.catalog-footer>div>a:hover,.catalog-footer>div>button:hover{text-decoration:underline;text-underline-offset:4px}
.footer-bottom{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:25px;padding-top:22px;border-top:1px solid var(--line);color:var(--muted);font-size:12px}
.footer-bottom button{margin:0!important;font-size:12px!important}

.drawer-backdrop{position:fixed;z-index:70;inset:0;background:rgba(35,38,57,.3);backdrop-filter:blur(4px);opacity:0;visibility:hidden;transition:.2s}.drawer-backdrop.is-open,.drawer-backdrop.is-filter-open{opacity:1;visibility:visible}
.cart-drawer{position:fixed;z-index:80;right:0;top:0;bottom:0;width:min(460px,100%);display:flex;flex-direction:column;padding:38px;background:#fff;transform:translateX(100%);transition:transform .25s}.cart-drawer.is-open{transform:none}
.drawer-head,.dialog-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding-bottom:22px;border-bottom:1px solid var(--line)}
.drawer-head h2,.dialog-head h2{color:var(--blue);font-size:34px;font-weight:500;line-height:1.05}
.drawer-close{display:grid;width:36px;height:36px;place-items:center}.drawer-close svg{width:21px;height:21px}
.cart-items{flex:1;overflow:auto}.cart-empty{height:100%;display:grid;place-items:center;color:var(--muted);text-align:center}.cart-empty small{font-size:12px}
.cart-item{display:grid;grid-template-columns:76px 1fr auto;gap:14px;align-items:center;padding:16px 0;border-bottom:1px solid var(--line)}.cart-item img{width:76px;height:94px;padding:8px;background:var(--visual);object-fit:contain}.cart-item h3{font-size:14px;font-weight:500}.cart-item p{margin-top:5px;color:var(--muted);font-size:12px}.cart-remove{display:grid;width:34px;height:34px;place-items:center}.cart-remove svg{width:18px;height:18px}
.cart-footer{padding-top:22px;border-top:1px solid var(--line)}.cart-footer>div{display:flex;justify-content:space-between;margin-bottom:18px}.cart-footer>button{width:100%;height:48px;background:var(--blue);color:#fff}

.volume-dialog,.info-dialog{width:min(480px,calc(100% - 32px));max-height:calc(100dvh - 32px);padding:30px;border:0;background:#fff;color:var(--blue);box-shadow:0 28px 90px rgba(31,35,57,.2)}
.volume-dialog::backdrop,.info-dialog::backdrop{background:rgba(35,38,57,.35);backdrop-filter:blur(4px)}
.dialog-head{align-items:center}.dialog-head button{width:36px;height:36px;display:grid;place-items:center}.dialog-head svg{width:18px;height:18px}
.volume-content,.info-content{padding-top:24px}.info-content{display:grid;gap:14px;color:var(--muted);line-height:1.65}
.volume-product{display:grid;grid-template-columns:92px 1fr;gap:18px;align-items:center;padding-bottom:22px;border-bottom:1px solid var(--line)}.volume-product img{width:92px;height:118px;padding:8px;background:var(--visual);object-fit:contain}.volume-product h3{margin-bottom:7px;font-size:18px;line-height:1.25}.volume-product p{color:var(--muted);font-size:12px}
.volume-label{margin:22px 0 12px;font-size:13px;font-weight:600}
.volume-options{display:grid;gap:10px}.volume-option{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:72px;padding:13px 16px;border:1px solid rgba(67,72,101,.25);background:#e8eef8;text-align:left}.volume-option:hover{border-color:var(--blue);background:#fff}.volume-option span{display:grid;gap:4px}.volume-option strong{font-size:16px}.volume-option small{color:var(--muted);font-size:11px}.volume-option b{font-size:16px;font-weight:600}
.cookie{position:fixed;z-index:90;left:18px;bottom:18px;display:flex;align-items:center;gap:25px;padding:17px 20px;border:1px solid var(--line);background:#fff;box-shadow:0 8px 30px rgba(48,37,31,.08)}.cookie p{font-size:12px}.cookie button{height:38px;padding:0 17px;background:var(--blue);color:#fff;font-size:12px}
.toast{position:fixed;z-index:100;left:50%;bottom:26px;max-width:90vw;padding:12px 18px;background:var(--blue);color:#fff;font-size:12px;opacity:0;visibility:hidden;transform:translate(-50%,20px);transition:.2s}.toast.is-visible{opacity:1;visibility:visible;transform:translate(-50%,0)}

.account-dialog{margin:0 0 0 auto;width:min(480px,100%);height:100dvh;max-width:100%;max-height:100dvh;padding:30px;border:0;background:#fff;color:var(--ink)}
.account-dialog[open]{display:flex;flex-direction:column;animation:account-dialog-in .28s cubic-bezier(.22,.8,.28,1) both}
.account-dialog::backdrop{background:rgba(35,38,57,.35);backdrop-filter:blur(4px)}
.account-dialog-head{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-bottom:25px;border-bottom:1px solid var(--line)}
.account-dialog-head h2{color:var(--blue);font-size:30px;font-weight:500}
.account-dialog-head button{display:grid;width:36px;height:36px;place-items:center}
.account-dialog-head svg{width:20px;height:20px}
.account-dialog-body{min-height:0;flex:1}
.auth-panel{min-height:100%;display:flex;flex-direction:column}
.auth-content{width:100%;max-width:350px;margin:auto;text-align:center;padding:48px 0 35px}
.auth-kicker{margin:0 0 16px;color:var(--muted);font-size:14px;font-weight:400;line-height:1.5;letter-spacing:normal}
.auth-title{color:var(--ink);font-size:34px;font-weight:500;line-height:1.05;letter-spacing:-.02em}
.auth-subtitle{margin:20px 0 44px;color:var(--muted);font-size:14px;line-height:1.3;letter-spacing:normal}
.auth-method-label{margin-bottom:17px;font-size:14px;line-height:1.3}
.auth-providers{display:flex;justify-content:center;gap:36px}
.auth-provider{display:flex;min-width:76px;flex-direction:column;align-items:center;gap:10px;font-size:14px}
.auth-provider>span{display:grid;width:64px;height:64px;place-items:center;transition:transform .2s,box-shadow .2s}
.auth-provider:hover>span{transform:translateY(-3px);box-shadow:0 10px 24px rgba(48,42,43,.09)}
.auth-provider img{width:64px;height:64px}
.auth-provider b{font-size:14px;font-weight:400}
.auth-divider{display:flex;align-items:center;gap:13px;margin:34px 0 24px;color:var(--muted);font-size:14px}
.auth-divider::before,.auth-divider::after{content:"";height:1px;flex:1;background:var(--line)}
.auth-phone-button{width:100%;min-height:50px;padding:13px 18px;border:1px solid var(--ink);background:#fff;color:var(--ink);font-size:14px;transition:background .2s,color .2s}
.auth-phone-button:hover,.auth-phone-button:focus-visible{background:var(--ink);color:#fff}
.auth-legal{margin:auto 0 0;color:#aaa19b;font-size:11px;line-height:1.55}
.auth-legal button{display:inline;color:inherit;text-decoration:underline;text-underline-offset:2px}
.auth-panel--phone .auth-content{text-align:left}
.auth-back{margin-bottom:45px;color:var(--muted);font-size:14px}
.auth-panel--phone .auth-subtitle{margin-bottom:34px}
.auth-panel--phone label{display:block;margin-bottom:9px;font-size:14px}
.auth-panel--phone input{width:100%;height:54px;margin-bottom:12px;padding:12px;border:1px solid #bfb8b3;outline:none;font-size:19px}
.auth-panel--phone input:focus{border-color:var(--ink)}
.auth-panel--phone .auth-phone-button{background:var(--ink);color:#fff}
#auth-phone-status{margin:14px 0 0;color:var(--muted);font-size:14px}
.auth-inline-status,#auth-code-status{min-height:20px;margin:14px 0 0;color:var(--muted);font-size:14px;line-height:1.4}
.auth-code-input{font-size:24px!important;font-variant-numeric:tabular-nums;letter-spacing:.24em;text-align:center}
.auth-phone-button:disabled{border-color:#c5c8d0;background:#c5c8d0;color:#fff;cursor:not-allowed}
.auth-phone-button:disabled:hover{border-color:#c5c8d0;background:#c5c8d0;color:#fff}
@keyframes account-dialog-in{from{transform:translateX(100%)}to{transform:translateX(0)}}

@media(max-width:1280px){
  .catalog-categories{grid-template-columns:repeat(3,minmax(0,1fr))}
  .catalog-layout{grid-template-columns:225px minmax(0,1fr);gap:6px}
  .fragrance-media{height:370px}
}

@media(max-width:900px){
  :root{--content:calc(100vw - 64px)}
  .catalog-header{height:76px}.desktop-nav{display:none}.brand-logo{width:112px}.menu-toggle{display:grid}
  .catalog-header.scrolled{height:64px}.catalog-header.scrolled .mobile-nav{top:64px}
  .mobile-nav{position:absolute;top:76px;left:0;right:0;display:flex;flex-direction:column;gap:18px;padding:25px 32px;border-bottom:1px solid var(--line);background:#fff;font-size:14px;opacity:0;visibility:hidden;transform:translateY(-8px);transition:.18s}.mobile-nav.is-open{opacity:1;visibility:visible;transform:none}
  .catalog-intro,.catalog-intro-inner{min-height:230px}.catalog-intro-grid{grid-template-columns:1fr;gap:20px}.catalog-intro-copy{max-width:520px;justify-self:start;text-align:left}.catalog-intro-copy p{margin-bottom:15px}
  .catalog-toolbar{grid-template-columns:1fr auto auto}.filter-toggle{display:flex}
  .catalog-layout{display:block;padding-top:34px}.filter-panel{position:fixed;z-index:90;left:0;top:0;bottom:0;width:min(390px,100%);height:auto;padding:30px;background:#fff;overflow:auto;transform:translateX(-100%);transition:transform .25s}.filter-panel.is-open{transform:none}.filter-close{display:block}.filter-panel-actions{position:sticky;bottom:-30px;flex-direction:row;padding:18px 0 30px;background:#fff}.filter-panel-actions>*{flex:1}.apply-filters{display:block}.reset-filters{align-self:center}
  .fragrance-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.fragrance-media{height:300px}.fragrance-info{padding:16px}.card-actions{display:block}.card-price{display:block;margin-bottom:11px}.add-button{width:100%}
  .catalog-footer{grid-template-columns:1fr 1fr 1fr}.footer-logo{grid-column:1/-1}
}

@media(max-width:800px){
  .service{grid-template-columns:36px minmax(0,1fr) 36px;column-gap:8px}
}

@media(max-width:700px){
  :root{--content:calc(100vw - 40px)}
  body{font-size:14px}.service{grid-template-columns:36px minmax(0,1fr) 36px;column-gap:8px;font-size:10px}.service span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.service button{width:36px}
  .catalog-header{height:70px}.mobile-nav{top:70px}
  .header-actions{gap:1px}.login-button{width:32px;min-height:36px;padding:0}.login-button span,.favorites-button{display:none}.header-icon,.menu-toggle{width:32px}.cart-count{right:-4px;top:-2px}
  .catalog-intro,.catalog-intro-inner{min-height:235px}.catalog-intro h1{font-size:38px}.catalog-intro-copy p{font-size:14px}
  .catalog-shell{padding-bottom:90px}.catalog-categories{display:flex;gap:8px;margin-top:18px;overflow-x:auto;scrollbar-width:none}.catalog-categories::-webkit-scrollbar{display:none}.catalog-category{min-width:178px;min-height:50px;flex:0 0 178px;padding:9px 13px}.catalog-toolbar{grid-template-columns:1fr auto;gap:12px;padding-top:18px}.catalog-search{grid-column:1/-1;width:100%}.filter-toggle{height:46px;padding-left:0}.sort-control{width:auto;min-width:240px;height:46px;padding-left:14px;gap:10px}.sort-trigger{padding-right:14px}.sort-menu{right:-1px;width:calc(100% + 2px)}.active-filters{overflow:auto;flex-wrap:nowrap}.active-chip{white-space:nowrap}
  .results-heading{margin-bottom:20px}.results-heading h2{font-size:30px}.result-count{font-size:14px}
  .fragrance-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.fragrance-media{height:220px;padding:44px 16px 22px}.fragrance-media img{max-height:160px}.fragrance-badge{left:9px;top:9px;padding:6px 7px;font-size:8px}.favorite-toggle{right:5px;top:4px;width:32px;height:32px}.favorite-toggle svg{width:16px;height:16px}
  .fragrance-info{min-height:158px;padding:14px 12px 12px}.fragrance-title-row h3{font-size:15px}.fragrance-original{margin-top:7px;font-size:12px}.card-actions{padding-top:12px}.card-price{margin-bottom:10px;font-size:13px}.add-button{height:38px;font-size:12px}
  .catalog-footer{grid-template-columns:1fr 1fr;gap:35px;padding-bottom:20px}.footer-logo{grid-column:1/-1}.catalog-footer h3{font-size:14px}.catalog-footer>div>a,.catalog-footer>div>button{font-size:13px}.footer-bottom{align-items:flex-start;flex-direction:column;font-size:11px}.footer-bottom button{font-size:11px!important}
  .cart-drawer{padding:28px 22px}.volume-dialog,.info-dialog{padding:24px}.drawer-head h2,.dialog-head h2{font-size:29px}.account-dialog{padding:22px}.auth-content{padding:30px 0 25px}.auth-title{font-size:32px}.auth-subtitle{margin-bottom:35px}.auth-providers{gap:28px}.auth-provider>span,.auth-provider img{width:58px;height:58px}
  .cookie{left:10px;right:10px;bottom:10px;justify-content:space-between;gap:12px;padding:13px 15px}.cookie p{font-size:11px}
}

@media(max-width:420px){
  .service{grid-template-columns:36px minmax(0,1fr) 36px;font-size:10px}.service button{width:36px}.catalog-intro h1{font-size:34px}.results-heading{align-items:flex-start;flex-direction:column;gap:6px}.fragrance-info{min-height:168px}.catalog-footer{grid-template-columns:1fr}
}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}

/* Use restrained tracking while preserving Onest Variable's character. */
h1,h2,h3{letter-spacing:-.02em!important}

/* Full-height filter drawer: the catalogue stays clean until filters are requested. */
.catalog-toolbar{grid-template-columns:minmax(300px,1fr) 310px}
.filter-toggle{display:flex;align-items:center;justify-content:center;gap:9px;padding:4px 0;border:0;background:transparent;color:var(--blue);font-size:14px;font-weight:400}
.active-filters.is-placeholder{visibility:hidden;pointer-events:none}
.active-filters.is-placeholder{visibility:hidden;pointer-events:none}
.filter-toggle:hover,.filter-toggle:focus-visible{text-decoration:underline;text-underline-offset:5px}
.filter-toggle>svg{width:18px;height:18px}
.filter-count{min-width:20px;height:20px;padding:0 5px;font-size:11px;line-height:20px}
.results-heading-main{display:flex;min-height:44px;align-items:center;gap:34px}
.selection-result-actions{display:flex;align-items:center;gap:24px;margin:20px 0 28px}
.selection-result-actions[hidden]{display:none}
.selection-return-action{display:inline-flex;min-height:44px;align-items:center;justify-content:center;gap:12px;padding:0 18px;border:1px solid var(--blue);color:var(--blue);font-size:14px;transition:background-color .18s,color .18s}
.selection-return-action:hover,.selection-return-action:focus-visible{background:var(--blue);color:#fff}
.selection-return-action svg{width:19px;height:16px;stroke-width:1.35}
.selection-restart-action{padding:10px 0;border-bottom:1px solid var(--blue);color:var(--blue);font-size:14px}
.catalog-layout{display:block;padding-top:24px}
.filter-panel{position:fixed;z-index:90;left:0;top:0;bottom:0;width:min(480px,100%);height:100dvh;max-height:none;padding:0;background:#fff;overflow:hidden;visibility:hidden;pointer-events:none;transform:translateX(-100%);transition:transform .28s cubic-bezier(.22,.8,.28,1),visibility .28s;display:flex;flex-direction:column;scrollbar-gutter:auto}
.filter-panel.is-open{visibility:visible;pointer-events:auto;transform:none}
.filter-panel-head{flex:0 0 auto;align-items:center;margin:0;padding:27px 32px 22px;border-bottom:1px solid var(--line)}
.filter-panel-head h2{font-size:30px;font-weight:500;line-height:1.1}
.filter-close{display:grid;width:36px;height:36px;place-items:center}
.filter-close svg{width:20px;height:20px}
.filter-panel-scroll{min-height:0;flex:1;padding:18px 32px 24px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:rgba(67,72,101,.36) transparent}
.filter-panel-scroll::-webkit-scrollbar{width:5px}
.filter-panel-scroll::-webkit-scrollbar-thumb{background:rgba(67,72,101,.36)}
.filter-panel-scroll::-webkit-scrollbar-track{background:transparent}
.filter-panel-actions{position:static;bottom:auto;display:grid;flex:0 0 auto;gap:12px;padding:18px 32px 28px;border-top:1px solid var(--line);background:#fff}
.filter-panel-actions>*{width:100%;flex:none}
.filter-panel-actions .apply-filters{display:block;order:1;min-height:50px;background:var(--blue);color:#fff;font-size:14px;font-weight:400}
.filter-panel-actions .apply-filters:hover,.filter-panel-actions .apply-filters:focus-visible{background:#fff;color:var(--blue);box-shadow:none}
.filter-panel-actions .reset-filters{order:2;justify-self:center;width:auto;align-self:center;border-bottom:1px solid var(--blue);font-size:14px}
.cart-drawer{width:min(480px,100%)}

@media(max-width:700px){
  .catalog-toolbar{grid-template-columns:1fr}
  .results-heading{align-items:center}
  .results-heading-main{min-height:46px;gap:18px}
  .selection-result-actions{align-items:flex-start;flex-direction:column;gap:8px;margin:16px 0 24px}
  .filter-panel-head{padding:22px 22px 18px}
  .filter-panel-scroll{padding:18px 22px 20px}
  .filter-panel-actions{padding:16px 22px 22px}
}

@media(max-width:420px){
  .results-heading{align-items:flex-start}
  .results-heading-main{gap:14px}
}

/* Unified product surfaces, cart state and volume typography. */
.cart-count{right:0;top:0;min-width:16px;height:16px;padding:0 4px;font-size:9px;font-weight:600}
.cart-drawer{width:min(480px,100%);padding:30px}
.drawer-head{padding-bottom:25px}
.drawer-head h2{font-size:30px}
.cart-items{min-height:0;padding-top:0;overflow:auto}
.cart-row{display:grid;grid-template-columns:65px minmax(0,1fr) 28px;gap:18px;align-items:center;padding:16px 0;border-bottom:1px solid var(--line)}
.cart-row img{width:65px;height:85px;object-fit:contain}
.cart-row h3{font-size:14px;font-weight:500;line-height:1.35}
.cart-row p{margin:5px 0;color:var(--muted);font-size:14px}
.cart-row>button{display:grid;width:28px;height:36px;place-items:center}
.cart-row>button svg,.cart-quantity button svg{width:16px;height:16px}
.cart-quantity{display:flex;align-items:center;gap:10px}
.cart-quantity button{display:grid;width:18px;height:24px;place-items:center}
.cart-quantity span{font-size:14px}
.cart-total{display:flex;justify-content:space-between;padding:24px 0;font-size:14px}
.cart-note{margin:0 0 24px;color:var(--ink);font-size:14px;line-height:1.55}
.cart-items>.cart-continue{display:flex;width:100%;margin-top:0}
.cart-footer{display:none!important}
.cart-empty-content{display:flex;align-items:center;flex-direction:column}
.cart-empty p,.cart-empty small{display:block;margin:0;color:var(--muted);font-size:14px;font-weight:400;line-height:1.5}
.cart-empty small{margin-top:5px}
.cart-continue{display:inline-flex;min-height:46px;align-items:center;justify-content:center;gap:20px;margin-top:24px;padding:0 20px;border:1px solid var(--blue);background:#fff;color:var(--blue);font-size:14px;font-weight:400}
.cart-continue svg{width:20px;height:15px;flex:none;stroke-width:1.35}
.cart-item p,.cart-footer,.cart-footer>button{font-size:14px}
.volume-product p,.volume-label,.volume-option strong,.volume-option small,.volume-option b{font-size:14px}
.volume-option{gap:18px}
.volume-option b{display:inline-flex;flex:0 0 auto;align-items:baseline;white-space:nowrap}

@media(max-width:700px){
  .cart-count{right:0;top:0}
  .cart-drawer{padding:28px 22px}
}

/* Catalogue keeps its strict geometry; only the account action colour is shared. */
.catalog-page{--catalog-action:#373863}
.catalog-page .add-button,
.catalog-page .apply-filters,
.catalog-page .load-more,
.catalog-page .button-outline,
.catalog-page .selection-return-action{border-color:var(--catalog-action);background:var(--catalog-action);color:#fff}
.catalog-page .add-button:hover,
.catalog-page .add-button:focus-visible,
.catalog-page .apply-filters:hover,
.catalog-page .apply-filters:focus-visible,
.catalog-page .load-more:hover,
.catalog-page .load-more:focus-visible,
.catalog-page .button-outline:hover,
.catalog-page .button-outline:focus-visible,
.catalog-page .selection-return-action:hover,
.catalog-page .selection-return-action:focus-visible{background:#fff;color:var(--catalog-action);box-shadow:none}
.catalog-page .filter-count{background:var(--catalog-action)}
