/* Catalog showcase page (catalog.html). Loads after akvora-theme.css and
   reuses its night palette, shelf, product cards and chips. */
.page-catalog{background:#0a1830;color:#fff}
.page-catalog .site-header{position:sticky;top:0;z-index:40} /* above the sticky search (20) and product cards */
.page-catalog .desktop-nav a{display:inline-flex;align-items:center;padding:14px 0;font-family:var(--sans);font-size:13px;font-weight:500;letter-spacing:.03em;color:var(--w80);text-decoration:none;transition:color .2s}
.page-catalog .desktop-nav a:hover,.page-catalog .desktop-nav a[aria-current]{color:#fff}
.page-catalog .desktop-nav a[aria-current]{text-decoration:underline;text-underline-offset:8px;text-decoration-color:rgba(138,184,255,.7)}
.catalog-page{padding-top:28px}
.cp-wrap{max-width:1240px;margin:0 auto;padding:0 24px}

.shelf-item[aria-current]{color:#fff}
.shelf-item[aria-current] .shelf-stage::before{opacity:1}
.shelf-item[aria-current] .shelf-stage img{transform:translateY(-6px);filter:drop-shadow(0 14px 14px rgba(0,6,16,.5)) brightness(1.05)}
.shelf-item[aria-current] .shelf-name::after{opacity:1}
/* links on the home shelf */
a.shelf-item{text-decoration:none}
.shelf-all{display:flex;justify-content:center;margin-top:30px}

.cp-showcase{padding:44px 0 40px;scroll-margin-top:80px}
.cp-crumbs{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:18px;font-size:13px;color:rgba(255,255,255,.45)}
.cp-crumbs a{color:rgba(255,255,255,.6);text-decoration:none}
.cp-crumbs a:hover{color:#fff}
.cp-crumbs #cp-crumb{color:#fff}
.cp-head{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;margin-bottom:26px}
.cp-head h1{margin:0;font:500 clamp(40px,5vw,64px)/1.02 var(--display,'Cormorant Garamond',serif);color:#fff}
.cp-head h1:focus{outline:none}
.cp-lead{max-width:620px;margin:14px 0 0;color:rgba(255,255,255,.62);font-size:16px;line-height:1.6}
.cp-count{flex:none;margin:0;font:500 11px var(--sans);letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.5)}
.cp-filters{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;padding:16px 0;margin-bottom:28px;border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08)}
.cp-filters:empty{display:none}
/* Раздел или поиск в адресе (класс ставит строка в <head> catalog.html до первой отрисовки): пока фильтры не пришли,
   их место занято пустой полосой той же высоты — иначе товары при появлении фильтров уезжают вниз (CLS).
   Высоты замерены по ширине экрана (бренды переносятся на 2–4 строки). */
.cp-has-list .cp-filters:empty{display:block;box-sizing:border-box;min-height:168px}
@media(max-width:1023px){.cp-has-list .cp-filters:empty{min-height:218px}}
@media(max-width:599px){.cp-has-list .cp-filters:empty{min-height:264px}}
@media(max-width:480px){.cp-has-list .cp-filters:empty{min-height:310px}}
@media(max-width:360px){.cp-has-list .cp-filters:empty{min-height:346px}}
.cp-filters .chip-btn{min-height:38px;padding:0 16px;font-size:13.5px}
.cp-filters .chip-btn[aria-pressed=true]{border-color:rgba(160,198,255,.8);background:linear-gradient(180deg,rgba(160,198,255,.32),rgba(127,176,247,.2));color:#fff}
.cp-toggle{display:inline-flex;align-items:center;gap:10px;font-size:14px;color:rgba(255,255,255,.75);cursor:pointer}
.cp-toggle input{width:18px;height:18px;accent-color:#8ab8ff}

/* product grid */
.product-row--grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:34px 22px;overflow:visible;padding:0}
.product-row--grid .product-card{width:100%}
.product-row--grid .product-photo{border-radius:22px}
.product-row--grid .product-photo img{padding:22px}
.product-row--grid .product-name{font-size:15px}
@media(max-width:1100px){.product-row--grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.product-row--grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 14px}}

.cp-empty{display:flex;flex-direction:column;align-items:center;gap:12px;max-width:560px;margin:10px auto 0;padding:40px 24px;text-align:center}
.cp-empty img{height:130px;width:auto;margin-bottom:6px;filter:drop-shadow(0 10px 14px rgba(0,6,16,.6));-webkit-box-reflect:below 1px linear-gradient(transparent 70%,rgba(255,255,255,.12))}
.cp-empty h2{margin:6px 0 0;font:500 32px/1.1 var(--display,'Cormorant Garamond',serif);color:#fff}
.cp-empty p{margin:0 0 10px;color:rgba(255,255,255,.62);line-height:1.6}
.cp-none{color:rgba(255,255,255,.65)}

.cp-more{display:grid;grid-template-columns:1fr;gap:48px;margin-top:64px;padding-top:40px;border-top:1px solid rgba(255,255,255,.08)}
.cp-more:empty{display:none}
.cp-more .shelf-subs{justify-content:flex-start;margin:14px 0 0}
.cp-more .cat-tips{margin-top:14px}
.cp-help{padding:20px 0 96px}
.cp-help .catalog-help{max-width:1192px}

@media(max-width:900px){
 .cp-head{flex-direction:column;align-items:flex-start;gap:12px}
 .cp-more{grid-template-columns:1fr;gap:32px}
}
@media(max-width:560px){
 .cp-wrap{padding:0 16px}
 .cp-showcase{padding-top:28px}
}

.cp-filters{justify-content:flex-start}.cp-filters .cp-toggle{margin-left:auto}

/* help block centred like on the home page */
.cp-help .catalog-help{flex-direction:column;align-items:center;justify-content:center;gap:20px;text-align:center}
.cp-help .catalog-help .help-copy{align-items:center;max-width:620px}
/* Overview: products grouped by category, four per group */
.cp-group{margin-bottom:56px}
.cp-group-head{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin-bottom:22px;padding-bottom:14px;border-bottom:1px solid rgba(255,255,255,.08)}
.cp-group-head h2{margin:0;font:500 32px/1.1 var(--display,'Cormorant Garamond',serif);color:#fff}
.cp-group-head a{display:inline-flex;align-items:center;gap:8px;color:#a6c8ff;font:500 14px var(--sans);text-decoration:none;white-space:nowrap}
.cp-group-head a svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;transition:transform .25s}
.cp-group-head a:hover svg{transform:translateX(4px)}
@media(max-width:560px){.cp-group-head h2{font-size:26px}}
.cp-sort{display:inline-flex;align-items:center;gap:10px;margin-left:auto;font-size:14px;color:rgba(255,255,255,.6)}.cp-sort select{min-height:38px;padding:0 34px 0 14px;border:1px solid rgba(255,255,255,.16);border-radius:999px;background:rgba(255,255,255,.04) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.6'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center/14px;color:#fff;font:400 13.5px var(--sans);-webkit-appearance:none;appearance:none;cursor:pointer}.cp-sort select option{color:#0a1a30}.cp-filters .cp-toggle+.cp-sort{margin-left:18px}

.cp-filters{row-gap:12px}.cp-filters .cp-sort{order:9;margin-left:0}.cp-filters .cp-toggle{order:10}
.cp-sort span{display:none}

.cp-filters .cp-toggle{margin-left:18px!important}

/* same content edge as the header */
.cp-wrap{max-width:1360px;padding:0 max(16px,calc(4vw - 40px))}
.cp-help .catalog-help{max-width:1360px}

.cp-filters .cp-toggle:first-child{margin-left:0!important}

/* Phones: all five categories visible at once — no hidden sideways scroll */
@media(max-width:560px){
 .cp-showcase{padding-top:18px}
}

/* Sticky search under the fixed header (height set by catalog-page-v1.js as --cp-header) */
.cp-search{position:sticky;top:var(--cp-header,72px);z-index:20;margin:0 -24px 10px;padding:6px 24px 10px;background:linear-gradient(180deg,rgba(10,24,48,.97) 70%,rgba(10,24,48,.85));backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.cp-search .smart-search{margin:0}
.chip-btn small{margin-left:6px;opacity:.55;font-size:.85em}
.cp-special{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin:0 0 22px}
.cp-special h2{margin:0;font:500 24px/1.2 var(--sans);color:#fff}
.cp-load{display:flex;justify-content:center;margin:28px 0 8px}

/* Loader (busy() in catalog-page-v1.js): skeleton cards while the shelf is empty, then a progress line + dimmed cards */
.cp-skeleton li{display:flex;flex-direction:column;gap:10px}
.cp-skeleton .sk-photo,.cp-skeleton .sk-line{display:block;border-radius:8px;background:linear-gradient(100deg,rgba(255,255,255,.05) 30%,rgba(160,198,255,.14) 50%,rgba(255,255,255,.05) 70%) 0 0/300% 100%;animation:sk-shimmer 1.4s linear infinite}
.cp-skeleton .sk-photo{aspect-ratio:1;border-radius:22px;margin-bottom:6px}
.cp-skeleton .sk-line{height:13px;width:92%}
.cp-skeleton .sk-brand{width:34%;height:9px}
.cp-skeleton .sk-short{width:64%}
.cp-skeleton .sk-price{width:42%;height:18px;margin-top:4px}
.cp-skeleton li:nth-child(4n+2) .sk-line,.cp-skeleton li:nth-child(4n+2) .sk-photo{animation-delay:.12s}
.cp-skeleton li:nth-child(4n+3) .sk-line,.cp-skeleton li:nth-child(4n+3) .sk-photo{animation-delay:.24s}
.cp-skeleton li:nth-child(4n+4) .sk-line,.cp-skeleton li:nth-child(4n+4) .sk-photo{animation-delay:.36s}
@keyframes sk-shimmer{from{background-position:100% 0}to{background-position:-200% 0}}
#cp-grid{transition:opacity .2s}
.cp-showcase.is-loading #cp-grid:not(:has(.cp-skeleton)){opacity:.45;pointer-events:none}
.cp-search::after{content:"";position:absolute;left:24px;right:24px;bottom:4px;height:2px;border-radius:2px;opacity:0;background:linear-gradient(90deg,transparent,rgba(138,184,255,.95),transparent) 0 0/40% 100% no-repeat;transition:opacity .2s}
.cp-showcase.is-loading .cp-search::after{opacity:1;animation:cp-progress 1.1s ease-in-out infinite}
@keyframes cp-progress{from{background-position:-40% 0}to{background-position:140% 0}}
@media (prefers-reduced-motion:reduce){.cp-skeleton .sk-photo,.cp-skeleton .sk-line,.cp-showcase.is-loading .cp-search::after{animation:none}}

/* Sidebar: sections and subsections (renderSide in catalog-page-v1.js) */
.cp-layout{display:grid;grid-template-columns:272px minmax(0,1fr);gap:36px;align-items:start}
.cp-main{min-width:0}
.cp-main .cp-search{margin:0 0 10px;padding:6px 0 10px}
.cp-main .cp-search::after{left:0;right:0}
.cp-side{position:sticky;top:calc(var(--cp-header,72px) + 16px);max-height:calc(100dvh - var(--cp-header,72px) - 32px);overflow:auto;padding:14px 10px 12px;border:1px solid rgba(138,184,255,.14);border-radius:22px;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.015));box-shadow:inset 0 1px 0 rgba(255,255,255,.05);scrollbar-width:thin;scrollbar-color:rgba(138,184,255,.25) transparent}
.cp-side-head{display:flex;align-items:center;justify-content:space-between;padding:2px 10px 10px}
.cp-side-title{font:500 11px var(--sans);letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.5)}
.cp-side-close{display:none;width:36px;height:36px;border:0;border-radius:10px;background:rgba(255,255,255,.06);color:#fff;cursor:pointer}
.cp-side-close svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6}
.cp-side-list,.cp-side-subs{margin:0;padding:0;list-style:none}
.cp-side-list>li+li{margin-top:2px}
.cp-side-cat{display:grid;grid-template-columns:36px minmax(0,1fr) auto;align-items:center;gap:12px;padding:7px 10px;border-radius:14px;color:rgba(255,255,255,.78);font:400 14.5px/1.25 var(--sans);text-decoration:none;transition:background .18s,color .18s,box-shadow .18s}
.cp-side-cat:hover{background:rgba(255,255,255,.05);color:#fff}
.cp-side-cat:focus-visible{outline:none;box-shadow:inset 0 0 0 1px rgba(160,198,255,.7)}
.cp-side-cat[aria-current]{background:linear-gradient(180deg,rgba(160,198,255,.2),rgba(127,176,247,.1));color:#fff;box-shadow:inset 0 0 0 1px rgba(160,198,255,.3)}
.cp-side-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cp-side-n{font:500 12px var(--sans);font-variant-numeric:tabular-nums;color:rgba(255,255,255,.42)}
.cp-side-cat[aria-current] .cp-side-n{color:rgba(196,220,255,.85)}
.cp-side-ico{display:grid;place-items:center;width:36px;height:36px;overflow:hidden;border-radius:11px;background:linear-gradient(180deg,#f3f6fa,#e3eaf2)}
.cp-side-ico img{width:100%;height:100%;object-fit:contain;padding:3px}
.cp-side-ico.is-art{background:radial-gradient(circle at 50% 70%,rgba(47,182,216,.28),rgba(10,24,48,0) 70%)}
.cp-side-ico.is-art img{padding:1px;filter:drop-shadow(0 4px 6px rgba(0,6,16,.5))}
.cp-side-ico.is-all{background:rgba(255,255,255,.06)}
.cp-side-ico.is-all svg{width:18px;height:18px;fill:none;stroke:rgba(196,220,255,.9);stroke-width:1.5}
.cp-side-subs{position:relative;margin:4px 0 10px 27px;padding-left:14px;border-left:1px solid rgba(138,184,255,.2)}
.cp-side-subs button{display:flex;align-items:baseline;justify-content:space-between;gap:10px;width:100%;padding:6px 10px;border:0;border-radius:9px;background:none;color:rgba(255,255,255,.62);font:400 13.5px/1.3 var(--sans);text-align:left;cursor:pointer;transition:background .15s,color .15s}
.cp-side-subs button:hover{background:rgba(255,255,255,.05);color:#fff}
.cp-side-subs button:focus-visible{outline:none;box-shadow:inset 0 0 0 1px rgba(160,198,255,.7)}
.cp-side-subs button[aria-pressed=true]{background:rgba(160,198,255,.12);color:#fff}
.cp-side-subs button[aria-pressed=true]::before{content:"";position:absolute;left:-3px;width:5px;height:5px;margin-top:6px;border-radius:50%;background:#8ab8ff;box-shadow:0 0 8px rgba(138,184,255,.8)}
.cp-side-subs small{flex:none;font-size:11.5px;font-variant-numeric:tabular-nums;color:rgba(255,255,255,.38)}
.cp-side-open{display:none}
.cp-side-open svg{width:16px;height:16px;margin-right:8px;fill:none;stroke:currentColor;stroke-width:1.6}
.cp-side-backdrop{display:none}
@media (max-width:1023px){
 .cp-layout{grid-template-columns:1fr;gap:0}
 .cp-side-open{display:inline-flex}
 .cp-side{position:fixed;z-index:210;top:0;bottom:0;left:0;width:min(340px,86vw);max-height:none;padding:calc(14px + env(safe-area-inset-top,0px)) 10px 20px;border-radius:0 24px 24px 0;background:linear-gradient(180deg,#0e2242,#0a1830);transform:translateX(-104%);transition:transform .32s cubic-bezier(.16,1,.3,1),visibility 0s .32s;visibility:hidden}
 .cp-side-is-open .cp-side{transform:none;visibility:visible;transition:transform .32s cubic-bezier(.16,1,.3,1);box-shadow:30px 0 80px rgba(0,6,16,.6)}
 .cp-side-close{display:grid;place-items:center}
 .cp-side-backdrop{display:block;position:fixed;inset:0;z-index:209;background:rgba(0,6,16,.6);opacity:0;pointer-events:none;transition:opacity .25s}
 .cp-side-is-open .cp-side-backdrop{opacity:1;pointer-events:auto}
 /* секции страницы — свой слой (main>section z-index:2 в теме): пока панель открыта, витрину поднимаем над шапкой */
 .cp-side-is-open .cp-showcase{z-index:220}
}
@media (prefers-reduced-motion:reduce){.cp-side{transition:none}}

/* Compact top: navigation lives in the sidebar, so the head is a slim title row, not a hero */
.catalog-page{padding-top:8px}
.cp-showcase,.cp-showcase{padding:18px 0 40px}
.cp-crumbs{margin-bottom:8px}
.cp-head{margin-bottom:16px;gap:24px}
.cp-head h1{font-size:clamp(30px,3.2vw,44px);line-height:1.05}
.cp-lead{margin-top:6px;font-size:15px;line-height:1.5}
@media(max-width:560px){.cp-showcase{padding-top:12px}.cp-head h1{font-size:30px}}
/* brands: one row + «Ещё N» */
.chip-btn.cp-more-brands{border-style:dashed;color:rgba(196,220,255,.85)}
.cp-side-ico.is-cut{background:radial-gradient(circle at 50% 70%,rgba(86,160,235,.32),rgba(14,35,64,1) 75%)}
.cp-side-ico.is-cut img{filter:drop-shadow(0 3px 4px rgba(0,6,16,.5))}