:root{
  --linen:#F2EDE4; --linen-deep:#E8E2D6; --linen-ghost:#FAF7F2;
  --wine:#3D1520; --wine-soft:#56202F; --brass:#B98A4E;
  --ink:#2C2124; --ink-muted:#736663; --hairline:#D8D0C2;
  --ease:cubic-bezier(.22,.61,.36,1); --dur:240ms;
  --gutter:clamp(20px,5vw,64px); --section:clamp(56px,9vw,112px);
  --header-h:64px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--linen);color:var(--ink);
  font-family:'Manrope',system-ui,sans-serif;font-size:16px;line-height:1.7;
  -webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
button{font:inherit;color:inherit}
.wrap{max-width:1160px;margin:0 auto;padding:0 var(--gutter)}
[hidden]{display:none !important}

/* ——— типографика ——— */
.d-xl,.d-l,.d-m,.d-s{font-family:'Playfair Display',Georgia,serif;font-weight:400;margin:0;line-height:1.12}
.d-xl{font-size:clamp(1.95rem,7.4vw,4.25rem);letter-spacing:.01em}
.d-l{font-size:clamp(1.55rem,5.2vw,2.75rem);letter-spacing:.012em}
.d-m{font-size:clamp(1.22rem,3.6vw,1.9rem);letter-spacing:.014em}
.d-s{font-size:1.0625rem;letter-spacing:.016em;line-height:1.3}
.b-l{font-size:clamp(.9375rem,2.2vw,1.0625rem);line-height:1.72;margin:0}
.b{font-size:1rem;line-height:1.7;margin:0}
.b-s{font-size:.875rem;line-height:1.65;margin:0}
.muted{color:var(--ink-muted)}
.prose{max-width:60ch}

/* ——— СИГНАТУРА ——— */
.eyebrow{display:flex;align-items:center;gap:14px;font-size:.6875rem;font-weight:600;
  letter-spacing:.2em;text-transform:uppercase;color:var(--brass);margin:0 0 20px}
.eyebrow::after{content:"";height:1px;background:var(--brass);flex:0 0 28px}
.eyebrow.both::before{content:"";height:1px;background:var(--brass);flex:0 0 28px}
.rule{height:1px;background:var(--brass);border:0;margin:0}
.rule-faint{height:1px;background:var(--hairline);border:0;margin:0}

/* ——— кнопки ——— */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;
  font-size:.8125rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  padding:16px 32px;border-radius:0;border:1px solid transparent;cursor:pointer;
  text-decoration:none;text-align:center;
  transition:background-color var(--dur) var(--ease),color var(--dur) var(--ease),border-color var(--dur) var(--ease)}
.btn-primary{background:var(--wine);color:var(--linen-ghost);border-color:var(--wine)}
.btn-primary:hover{background:var(--wine-soft);border-color:var(--wine-soft)}
.btn-secondary{background:transparent;color:var(--wine);border-color:var(--wine)}
.btn-secondary:hover{background:var(--wine);color:var(--linen-ghost)}
.btn-quiet{background:none;border:0;border-bottom:1px solid var(--ink);padding:14px 0;color:var(--ink)}
.btn-quiet:hover{color:var(--wine);border-bottom-color:var(--wine)}
.btn-block{width:100%}
.btn[disabled]{background:var(--linen-deep);color:#A79C97;border-color:var(--hairline);cursor:not-allowed}
.btn.on-dark.btn-secondary{color:var(--linen-ghost);border-color:rgba(250,247,242,.5)}
.btn.on-dark.btn-secondary:hover{background:var(--linen-ghost);color:var(--wine);border-color:var(--linen-ghost)}
:focus-visible{outline:2px solid var(--wine);outline-offset:3px}

/* ——— шапка ——— */
.header{position:sticky;top:0;z-index:60;background:var(--linen);border-bottom:1px solid var(--hairline)}
.header-in{height:var(--header-h);display:flex;align-items:center;justify-content:space-between;gap:16px}
.hdr-left,.hdr-right{display:flex;align-items:center;gap:clamp(12px,2.4vw,26px)}
.hdr-btn{background:none;border:0;cursor:pointer;padding:8px 0;
  font-size:.75rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  display:flex;align-items:center;gap:9px;transition:color var(--dur) var(--ease)}
.hdr-btn:hover{color:var(--wine)}
.burger{width:15px;height:9px;position:relative;flex:0 0 auto}
.burger span{position:absolute;left:0;width:100%;height:1px;background:currentColor}
.burger span:nth-child(1){top:0}.burger span:nth-child(2){top:4px}.burger span:nth-child(3){top:8px}
.brand{font-family:'Playfair Display',serif;font-size:clamp(1.05rem,2.6vw,1.3rem);
  letter-spacing:.3em;text-transform:uppercase;color:var(--wine);text-decoration:none;
  display:flex;align-items:center;gap:14px;white-space:nowrap}
.brand::before,.brand::after{content:"";height:1px;width:clamp(12px,3vw,34px);background:var(--brass)}
.cart-count{font-family:'Manrope';font-size:.6875rem;min-width:18px;height:18px;
  display:inline-flex;align-items:center;justify-content:center;background:var(--wine);
  color:var(--linen-ghost);border-radius:50%;letter-spacing:0}

/* ——— шторка каталога ——— */
.scrim{position:fixed;inset:0;background:rgba(44,33,36,.42);z-index:80;
  opacity:0;pointer-events:none;transition:opacity var(--dur) var(--ease)}
.scrim.open{opacity:1;pointer-events:auto}
.drawer{position:fixed;top:0;left:0;bottom:0;width:min(400px,88vw);background:var(--linen);
  z-index:90;transform:translateX(-100%);transition:transform 320ms var(--ease);
  display:flex;flex-direction:column;overflow-y:auto}
.drawer.open{transform:none}
.drawer-head{display:flex;align-items:center;justify-content:space-between;
  padding:0 26px;height:var(--header-h);border-bottom:1px solid var(--hairline);flex:0 0 auto}
.drawer-title{font-size:.6875rem;letter-spacing:.2em;text-transform:uppercase;color:var(--brass)}
.drawer-home{background:none;border:0;cursor:pointer;padding:8px 0;display:flex;align-items:center;gap:11px;
  font-size:.6875rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--ink);
  transition:color var(--dur) var(--ease)}
.drawer-home:hover{color:var(--wine)}
.drawer-home .arrow{width:16px;height:7px;position:relative;flex:0 0 auto}
.drawer-home .arrow::before{content:"";position:absolute;left:0;top:3px;width:16px;height:1px;background:currentColor}
.drawer-home .arrow::after{content:"";position:absolute;left:0;top:.5px;width:6px;height:6px;
  border-left:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(45deg)}
.x{background:none;border:0;cursor:pointer;width:26px;height:26px;position:relative}
.x::before,.x::after{content:"";position:absolute;left:3px;top:12px;width:20px;height:1px;background:var(--ink)}
.x::before{transform:rotate(45deg)}.x::after{transform:rotate(-45deg)}
.drawer-body{padding:16px 0 40px}
.dnav{list-style:none;margin:0;padding:0}
.dnav > li{border-bottom:1px solid var(--hairline)}
.dnav > li:first-child{border-top:1px solid var(--hairline)}
.dnav-btn{width:100%;background:none;border:0;cursor:pointer;text-align:left;
  padding:19px 26px;display:flex;align-items:center;justify-content:space-between;gap:14px;
  font-family:'Playfair Display',serif;font-size:1.15rem;letter-spacing:.014em;
  transition:color var(--dur) var(--ease)}
.dnav-btn:hover{color:var(--wine)}
.chev{width:7px;height:7px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;
  transform:rotate(-45deg);flex:0 0 auto;transition:transform var(--dur) var(--ease)}
.dnav-btn[aria-expanded="true"] .chev{transform:rotate(45deg)}
.sublist{list-style:none;margin:0;padding:0 26px 20px;display:grid;gap:2px}
.sublist a{display:flex;align-items:center;gap:11px;padding:8px 0;text-decoration:none;
  font-size:.9375rem;color:var(--ink-muted);transition:color var(--dur) var(--ease)}
.sublist a:hover{color:var(--wine)}
.dot{width:14px;height:14px;border-radius:50%;border:1px solid rgba(0,0,0,.16);flex:0 0 auto}
.drawer-foot{padding:26px;border-top:1px solid var(--hairline);display:grid;gap:14px}
.drawer-foot a{font-size:.8125rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink-muted);text-decoration:none;transition:color var(--dur) var(--ease)}
.drawer-foot a:hover{color:var(--wine)}
.drawer-foot-sep{height:1px;background:var(--hairline);margin:6px 0}

/* ——— плейсхолдер изображения ——— */
.ph{position:relative;aspect-ratio:9/16;background:var(--linen-deep);display:flex;border-radius: 12px;
  flex-direction:column;align-items:center;justify-content:center;text-align:center;
  padding:24px;overflow:hidden}
.ph::after{content:"";position:absolute;inset:12px;border:1px solid var(--brass);opacity:.4}
.ph-name{font-family:'Playfair Display',serif;font-size:1rem;line-height:1.3;letter-spacing:.02em}
.ph-color{font-size:.6875rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-muted);margin-top:10px}
.ph-dot{width:24px;height:24px;border-radius:50%;margin-top:16px;border:1px solid rgba(0,0,0,.14)}
.ph.wide{aspect-ratio:3/2}
.ph.tall{aspect-ratio:2/3}

/* ——— hero: один кадр, без прокрутки ——— */
body.home-lock{overflow:hidden}
.hero{position:relative;height:calc(100vh - var(--header-h));height:calc(100dvh - var(--header-h));
  display:flex;align-items:flex-end;overflow:hidden;background:var(--linen-deep)}
.hero-photo{position:absolute;inset:0;z-index:1;
  background:linear-gradient(158deg,#EFE9DE 0%,#E2DACA 46%,#CFC3AD 100%);
  display:flex;align-items:center;justify-content:center}
.hero-photo::after{content:"";position:absolute;inset:clamp(14px,2.4vw,30px);
  border:1px solid var(--brass);opacity:.34}
.photo-slot{font-family:'Playfair Display',serif;font-size:.9375rem;line-height:1.6;
  letter-spacing:.02em;color:rgba(44,33,36,.34);text-align:center}
.hero-scrim{position:absolute;left:0;right:0;bottom:0;height:68%;z-index:2;
  background:linear-gradient(to top,rgba(242,237,228,.94) 0%,rgba(242,237,228,.6) 42%,rgba(242,237,228,0) 100%)}
.hero-in{position:relative;z-index:3;width:100%;padding:0 0 clamp(38px,6vw,76px)}
.hero h1{max-width:17ch;margin:0}
.hero .btn{margin-top:clamp(26px,3.4vw,38px)}

/* ——— секции ——— */
.sec{padding:var(--section) 0}
.sec-head{margin-bottom:clamp(28px,4vw,44px)}
.sec-head .rule{margin-top:20px}

/* товары */
.grid-p{display:grid;gap:clamp(16px,2.6vw,30px);grid-template-columns:repeat(auto-fill,minmax(198px,1fr))}
.card{text-decoration:none;display:block}
.card .ph{transition:opacity var(--dur) var(--ease)}
.card:hover .ph{opacity:.87}
.card-meta{padding-top:15px}
.card-name{font-size:.9375rem;line-height:1.45}
.card-price{font-family:'Playfair Display',serif;font-size:1.0625rem;margin-top:5px}

/* ——— каталог: фильтры ——— */
.cat-top{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;
  gap:22px;margin-bottom:32px}
.filters{display:flex;flex-wrap:wrap;gap:26px;align-items:center;
  padding:18px 0;border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline);margin-bottom:34px}
.fgroup{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.flabel{font-size:.6875rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-muted)}
.chip{background:none;border:1px solid var(--hairline);padding:7px 14px;cursor:pointer;
  font-size:.8125rem;transition:all var(--dur) var(--ease)}
.chip:hover{border-color:var(--ink-muted)}
.chip.on{background:var(--wine);border-color:var(--wine);color:var(--linen-ghost)}
.swatch-btn{width:26px;height:26px;border-radius:50%;border:1px solid rgba(0,0,0,.16);
  cursor:pointer;padding:0;position:relative;transition:transform var(--dur) var(--ease)}
.swatch-btn:hover{transform:scale(1.09)}
.swatch-btn.on::after{content:"";position:absolute;inset:-5px;border:1px solid var(--wine);border-radius:50%}
.f-reset{background:none;border:0;cursor:pointer;font-size:.8125rem;color:var(--ink-muted);
  text-decoration:underline;text-underline-offset:3px}
.f-reset:hover{color:var(--wine)}
.empty{padding:60px 0;text-align:center;color:var(--ink-muted)}

/* ——— карточка товара ——— */
.pdp{display:grid;gap:clamp(28px,5vw,66px);padding-top:clamp(26px,4vw,48px)}
@media(min-width:900px){.pdp{grid-template-columns:1.08fr .92fr;align-items:start}}
.gallery{display:grid;gap:12px}
.gal-main .ph{aspect-ratio:9/16}
.gal-thumbs{display:flex;gap:10px}
.gal-thumbs button{flex:1;background:none;border:1px solid transparent;cursor:pointer;padding:0;
  transition:border-color var(--dur) var(--ease)}
.gal-thumbs button.on{border-color:var(--wine)}
.gal-thumbs .ph{aspect-ratio:9/16}
.gal-thumbs .ph::after{inset:6px}
.gal-thumbs .ph-name{font-size:.6875rem}
.gal-thumbs .ph-color,.gal-thumbs .ph-dot{display:none}
@media(min-width:900px){.pdp-info{position:sticky;top:calc(var(--header-h) + 26px)}}
.crumbs{font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-muted);margin-bottom:18px}
.crumbs a{text-decoration:none}
.crumbs a:hover{color:var(--wine)}
.pdp-price{font-family:'Playfair Display',serif;font-size:1.6rem;margin:20px 0 0}
.pdp-desc{margin-top:16px;color:var(--ink-muted);max-width:46ch}
.picker{margin-top:30px}
.picker-head{display:flex;align-items:baseline;justify-content:space-between;gap:14px;margin-bottom:13px}
.picker-head .flabel{color:var(--ink)}
.picker-val{font-size:.8125rem;color:var(--ink-muted)}
.colors{display:flex;gap:14px;flex-wrap:wrap}
.colors a{width:32px;height:32px;border-radius:50%;border:1px solid rgba(0,0,0,.16);
  position:relative;transition:transform var(--dur) var(--ease)}
.colors a:hover{transform:scale(1.08)}
.colors a.on::after{content:"";position:absolute;inset:-5px;border:1px solid var(--wine);border-radius:50%}
.sizes-row{display:flex;gap:10px;flex-wrap:wrap}
.size-btn{min-width:56px;padding:13px 8px;background:none;border:1px solid var(--hairline);
  cursor:pointer;font-size:.9375rem;transition:all var(--dur) var(--ease)}
.size-btn:hover:not(:disabled){border-color:var(--ink)}
.size-btn.on{background:var(--wine);border-color:var(--wine);color:var(--linen-ghost)}
.size-btn:disabled{color:#B3A9A4;cursor:not-allowed;position:relative;overflow:hidden}
.size-btn:disabled::after{content:"";position:absolute;left:-10%;right:-10%;top:50%;
  height:1px;background:var(--hairline);transform:rotate(-16deg)}
.size-help{background:none;border:0;padding:0;cursor:pointer;font-size:.8125rem;
  color:var(--ink-muted);text-decoration:underline;text-underline-offset:3px}
.size-help:hover{color:var(--wine)}
.pdp-cta{margin-top:30px}
.stock-note{font-size:.8125rem;color:var(--ink-muted);margin-top:12px}

/* аккордеон */
.acc{margin-top:40px;border-top:1px solid var(--hairline)}
.acc details{border-bottom:1px solid var(--hairline)}
.acc summary{list-style:none;cursor:pointer;padding:19px 0;display:flex;align-items:center;
  justify-content:space-between;gap:18px;font-size:.9375rem;transition:color var(--dur) var(--ease)}
.acc summary::-webkit-details-marker{display:none}
.acc summary:hover{color:var(--wine)}
.sign{flex:0 0 auto;position:relative;width:12px;height:12px}
.sign::before,.sign::after{content:"";position:absolute;background:currentColor;
  transition:transform var(--dur) var(--ease),opacity var(--dur) var(--ease)}
.sign::before{left:0;top:5.5px;width:12px;height:1px}
.sign::after{left:5.5px;top:0;width:1px;height:12px}
details[open] > summary .sign::after{transform:scaleY(0);opacity:0}
.acc-body{padding:0 0 24px;max-width:52ch;color:var(--ink-muted)}
.acc-body p{margin:0 0 11px}.acc-body p:last-child{margin-bottom:0}
.acc-body table{width:100%;border-collapse:collapse;font-size:.875rem;margin-top:4px}
.acc-body th,.acc-body td{border-bottom:1px solid var(--hairline);padding:11px 8px;text-align:center}
.acc-body th:first-child,.acc-body td:first-child{text-align:left;font-weight:400;color:var(--ink-muted)}
.acc-body thead th{font-family:'Playfair Display',serif;font-size:1rem;color:var(--ink);
  border-bottom:1px solid var(--brass)}
.tg-link{display:inline-flex;align-items:center;gap:9px;color:var(--wine);
  text-decoration:none;border-bottom:1px solid var(--wine);padding-bottom:2px}

/* ——— корзина ——— */
.cart-grid{display:grid;gap:clamp(28px,4vw,56px);padding-top:clamp(20px,3vw,36px)}
@media(min-width:860px){.cart-grid{grid-template-columns:1.5fr .85fr;align-items:start}}
.cart-line{display:grid;grid-template-columns:88px 1fr auto;gap:18px;
  padding:22px 0;border-bottom:1px solid var(--hairline);align-items:start}
.cart-line:first-child{border-top:1px solid var(--hairline)}
.cart-line .ph{aspect-ratio:9/16;border-radius:12px}
.cart-line .ph::after{inset:6px}
.cart-line .ph-name{font-size:.5625rem}
.cart-line .ph-color,.cart-line .ph-dot{display:none}
.cl-name{font-size:.9375rem;line-height:1.4}
.cl-meta{font-size:.8125rem;color:var(--ink-muted);margin-top:6px}
.cl-right{text-align:right;display:grid;gap:10px;justify-items:end}
.cl-price{font-family:'Playfair Display',serif;font-size:1.0625rem}
.qty{display:flex;align-items:center;border:1px solid var(--hairline)}
.qty button{background:none;border:0;width:32px;height:32px;cursor:pointer;font-size:1rem;
  transition:background var(--dur) var(--ease)}
.qty button:hover{background:var(--linen-deep)}
.qty span{min-width:30px;text-align:center;font-size:.875rem}
.cl-remove{background:none;border:0;cursor:pointer;font-size:.75rem;color:var(--ink-muted);
  text-decoration:underline;text-underline-offset:3px}
.cl-remove:hover{color:var(--wine)}
.summary{background:var(--linen-deep);padding:clamp(24px,3vw,32px)}
.sum-row{display:flex;justify-content:space-between;gap:16px;padding:11px 0;font-size:.9375rem}
.sum-row.total{border-top:1px solid var(--hairline);margin-top:10px;padding-top:18px;align-items:baseline}
.sum-row.total .val{font-family:'Playfair Display',serif;font-size:1.4rem}
.summary .btn{margin-top:22px}
.sum-note{font-size:.75rem;color:var(--ink-muted);margin-top:14px;line-height:1.55}

/* ——— чекаут ——— */
.co-grid{display:grid;gap:clamp(28px,4vw,56px);padding-top:clamp(20px,3vw,36px)}
@media(min-width:860px){.co-grid{grid-template-columns:1.35fr .85fr;align-items:start}}
.field{display:grid;gap:7px;margin-bottom:18px}
.field label{font-size:.6875rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-muted)}
.field input,.field textarea,.field select{
  background:var(--linen-ghost);border:1px solid var(--hairline);border-radius:0;
  padding:14px 15px;font:inherit;font-size:.9375rem;color:var(--ink);
  transition:border-color var(--dur) var(--ease)}
.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--wine);outline:none}
.field-row{display:grid;gap:18px}
@media(min-width:600px){.field-row{grid-template-columns:1fr 1fr}}
.co-step{margin-bottom:38px}
.co-step-head{display:flex;align-items:baseline;gap:14px;margin-bottom:22px}
.co-step-num{font-family:'Playfair Display',serif;font-size:1.3rem;color:var(--brass)}
.radio-list{display:grid;gap:10px}
.radio{display:flex;gap:14px;align-items:flex-start;border:1px solid var(--hairline);
  padding:17px 18px;cursor:pointer;transition:border-color var(--dur) var(--ease)}
.radio:hover{border-color:var(--ink-muted)}
.radio.on{border-color:var(--wine)}
.radio input{margin:4px 0 0;accent-color:var(--wine)}
.radio .rt{font-size:.9375rem}
.radio .rs{font-size:.8125rem;color:var(--ink-muted);margin-top:4px}
.radio .rp{margin-left:auto;font-family:'Playfair Display',serif;font-size:1rem;white-space:nowrap}
.consent{display:flex;gap:12px;align-items:flex-start;font-size:.8125rem;
  color:var(--ink-muted);line-height:1.6;margin-top:22px}
.consent input{margin:3px 0 0;accent-color:var(--wine)}
.consent a{color:var(--ink)}

/* ——— образы ——— */
.looks{display:grid;gap:clamp(30px,5vw,64px)}
.look{display:grid;gap:clamp(20px,3vw,38px)}
@media(min-width:820px){.look{grid-template-columns:1.05fr .95fr;align-items:center}
  .look:nth-child(even) .look-media{order:2}}
.look-media .ph{aspect-ratio:9/16;border-radius:12px}
.look-body .d-l{margin-bottom:14px}
.look-items{display:grid;gap:12px;margin-top:26px;border-top:1px solid var(--hairline)}
.look-item{display:flex;align-items:center;gap:16px;padding:14px 0;
  border-bottom:1px solid var(--hairline);text-decoration:none}
.look-item .ph{width:52px;aspect-ratio:9/16;flex:0 0 auto;border-radius:12px}
.look-item .ph::after{inset:4px}
.look-item .ph-name,.look-item .ph-color{display:none}
.look-item .ph-dot{margin:0;width:18px;height:18px}
.look-item .li-name{font-size:.9375rem;flex:1}
.look-item .li-price{font-family:'Playfair Display',serif;font-size:1rem}
.look-item:hover .li-name{color:var(--wine)}
.look-total{display:flex;justify-content:space-between;align-items:baseline;
  gap:16px;margin-top:20px;font-size:.9375rem}
.look-total b{font-family:'Playfair Display',serif;font-size:1.3rem;font-weight:400}

/* ——— статические страницы ——— */
.static{padding-top:clamp(20px,3vw,36px);max-width:66ch}
.static h2{font-family:'Playfair Display',serif;font-weight:400;font-size:1.35rem;
  margin:38px 0 12px;letter-spacing:.014em}
.static p{margin:0 0 14px;color:var(--ink-muted)}
.static ul{margin:0 0 14px;padding-left:22px;color:var(--ink-muted)}
.static li{margin-bottom:7px}
.todo{display:inline-block;font-size:.625rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--brass);border:1px solid var(--brass);padding:3px 8px;margin-bottom:20px}

/* ——— подвал ——— */
.footer{background:var(--wine);color:var(--linen-ghost);margin-top:var(--section)}
.footer-in{padding:clamp(44px,6vw,72px) 0 30px;display:grid;gap:clamp(28px,4vw,44px)}
@media(min-width:760px){.footer-cols{grid-template-columns:1.3fr 1fr 1fr 1fr}}
.footer-cols{display:grid;gap:clamp(24px,3vw,36px)}
.footer h4{font-size:.6875rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--brass);margin:0 0 16px;font-weight:600}
.footer ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.footer a{color:rgba(250,247,242,.78);text-decoration:none;font-size:.875rem;
  transition:color var(--dur) var(--ease)}
.footer a:hover{color:var(--linen-ghost)}
.footer .brand{color:var(--linen-ghost);margin-bottom:16px}
.footer .brand::before,.footer .brand::after{background:var(--brass)}
.footer-note{font-size:.8125rem;color:rgba(250,247,242,.6);max-width:34ch;line-height:1.6}
.footer-bottom{border-top:1px solid rgba(250,247,242,.16);padding-top:24px;
  display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between;
  font-size:.75rem;color:rgba(250,247,242,.55)}

/* ——— cookie-полоса (неблокирующая) ——— */
.cookie{position:fixed;left:0;right:0;bottom:0;z-index:70;background:var(--linen-ghost);
  border-top:1px solid var(--hairline);padding:16px var(--gutter);
  display:flex;align-items:center;gap:20px;flex-wrap:wrap;justify-content:center;
  font-size:.8125rem;color:var(--ink-muted);
  transform:translateY(100%);transition:transform 380ms var(--ease)}
.cookie.show{transform:none}
.cookie button{background:none;border:1px solid var(--wine);color:var(--wine);
  padding:8px 20px;cursor:pointer;font-size:.6875rem;letter-spacing:.14em;
  text-transform:uppercase;font-weight:600;transition:all var(--dur) var(--ease)}
.cookie button:hover{background:var(--wine);color:var(--linen-ghost)}

/* ——— тост ——— */
.toast{position:fixed;left:50%;bottom:34px;transform:translate(-50%,140%);z-index:100;
  background:var(--wine);color:var(--linen-ghost);padding:15px 26px;font-size:.875rem;
  display:flex;align-items:center;gap:18px;transition:transform 320ms var(--ease)}
.toast.show{transform:translate(-50%,0)}
.toast a{color:var(--linen-ghost);text-decoration:underline;text-underline-offset:3px;
  font-size:.75rem;letter-spacing:.1em;text-transform:uppercase}

/* ============================================================
   МОБИЛЬНАЯ ВЕРСИЯ
   ============================================================ */
@media(max-width:640px){
  :root{--gutter:18px;--section:clamp(40px,10vw,68px);--header-h:56px}

  /* шапка: сжимаем трекинг, иначе три блока не встают в строку */
  .hdr-btn{font-size:.625rem;letter-spacing:.1em;gap:7px}
  .brand{font-size:.9375rem;letter-spacing:.2em;gap:9px}
  .brand::before,.brand::after{width:9px}
  .cart-count{min-width:16px;height:16px;font-size:.625rem}

  /* главный экран */
  .hero h1{max-width:15ch}
  .hero-in{padding-bottom:clamp(30px,7vw,44px)}
  .photo-slot{font-size:.8125rem}

  /* каталог: две карточки в ряд — как в мобильных магазинах одежды */
  .grid-p{grid-template-columns:repeat(2,1fr);gap:12px}
  .card-meta{padding-top:11px}
  .card-name{font-size:.8125rem;line-height:1.4}
  .card-price{font-size:.9375rem}
  .ph{padding:14px}
  .ph::after{inset:9px}
  .ph-name{font-size:.8125rem}
  .ph-color{font-size:.5625rem;letter-spacing:.1em;margin-top:7px}
  .ph-dot{width:17px;height:17px;margin-top:10px}

  .cat-top{gap:12px;margin-bottom:22px}
  .filters{gap:18px;padding:15px 0;margin-bottom:26px}

  /* кнопки: чуть компактнее, но палец попадает */
  .btn{padding:15px 24px;font-size:.75rem;letter-spacing:.1em}

  /* карточка товара */
  .pdp{gap:26px}
  .pdp-price{font-size:1.35rem}
  .pdp-desc{max-width:none}
  .gal-thumbs{gap:8px}
  .size-btn{min-width:0;flex:1;padding:13px 4px}
  .sizes-row{gap:8px}
  .acc{margin-top:30px}
  .acc-body{max-width:none}
  .acc-body table{font-size:.75rem}
  .acc-body th,.acc-body td{padding:9px 3px}

  /* корзина: цена и счётчик уезжают под название */
  .cart-line{grid-template-columns:62px 1fr;gap:14px}
  .cart-line .ph{padding:6px}
  .cl-right{grid-column:2;justify-items:start;text-align:left;
    flex-direction:row;display:flex;align-items:center;gap:18px;margin-top:12px}

  /* lookbook */
  .look-item .ph{width:42px}
  .look-item .li-name{font-size:.875rem}

  /* шторка */
  .drawer{width:min(338px,87vw)}
  .dnav-btn{font-size:1.0625rem;padding:17px 20px}
  .sublist{padding:0 20px 16px}
  .drawer-head,.drawer-foot{padding-left:20px;padding-right:20px}

  /* статика и длинные тексты */
  .static h2{font-size:1.15rem;margin:28px 0 10px}

  /* cookie-полоса не должна занимать пол-экрана */
  .cookie{font-size:.75rem;gap:12px;padding:13px 18px;text-align:center}
  .cookie button{padding:8px 16px}

  .toast{left:14px;right:14px;bottom:14px;transform:translateY(140%);
    justify-content:space-between;padding:14px 18px}
  .toast.show{transform:translateY(0)}
}

@media(max-width:380px){
  .hdr-btn{font-size:.5625rem;letter-spacing:.06em}
  .brand{font-size:.875rem;letter-spacing:.16em}
  .grid-p{gap:10px}
}

/* reveal */
.reveal{opacity:0;transform:translateY(8px)}
.reveal.in{opacity:1;transform:none;transition:opacity 520ms var(--ease),transform 520ms var(--ease)}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{animation-duration:.01ms !important;transition-duration:.01ms !important}
  .reveal{opacity:1;transform:none}
}

/* ============================================================
   МОБИЛЬНАЯ ВЕРСИЯ (ПОЛНАЯ ПРОРАБОТКА)
   ============================================================ */

/* Фикс опечатки в файле: исправлена лишняя скобка над cdek-map */
#cdek-map {
  width: 100%;
  height: 400px;
  min-height: 320px;
  border: 1px solid var(--hairline);
}

@media (max-width: 640px) {
  :root {
    --gutter: 16px;
    --section: clamp(36px, 8vw, 56px);
    --header-h: 56px;
  }

  /* --- Шапка и Навигация --- */
  .hdr-btn {
    font-size: 0.6875rem;
    letter-spacing: 0.08em;
    gap: 6px;
    padding: 6px 0;
  }
  
  .brand {
    font-size: 0.9375rem;
    letter-spacing: 0.18em;
    gap: 8px;
  }
  .brand::before, 
  .brand::after {
    width: 10px;
  }

  .cart-count {
    min-width: 16px;
    height: 16px;
    font-size: 0.625rem;
  }

  /* --- Шторка (Drawer) --- */
  .drawer {
    width: 88vw;
  }
  .drawer-head {
    padding: 0 18px;
  }
  .dnav-btn {
    font-size: 1rem;
    padding: 16px 18px;
  }
  .sublist {
    padding: 0 18px 14px;
  }
  .drawer-foot {
    padding: 20px 18px;
  }

  /* --- Главный экран (Hero) --- */
  .hero-in {
    padding-bottom: 32px;
  }
  .hero h1 {
    max-width: 100%;
  }

  /* --- Фильтры Каталога --- */
  .cat-top {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 16px;
  }
  .filters {
    gap: 12px;
    padding: 12px 0;
    margin-bottom: 20px;
    overflow-x: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
  }
  .fgroup {
    flex-wrap: nowrap;
  }

  /* --- Сетка товаров (2 в ряд) --- */
  .grid-p {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }
  .card-meta {
    padding-top: 8px;
  }
  .card-name {
    font-size: 0.8125rem;
    line-height: 1.35;
  }
  .card-price {
    font-size: 0.875rem;
    margin-top: 3px;
  }

  /* Плейсхолдеры картинок */
  .ph {
    padding: 12px;
  }
  .ph::after {
    inset: 6px;
  }
  .ph-name {
    font-size: 0.75rem;
  }
  .ph-color {
    font-size: 0.5625rem;
    margin-top: 4px;
  }
  .ph-dot {
    width: 14px;
    height: 14px;
    margin-top: 8px;
  }

  /* --- Страница товара (PDP) --- */
  .pdp {
    gap: 20px;
    padding-top: 16px;
  }
  .pdp-price {
    font-size: 1.25rem;
    margin-top: 10px;
  }
  .pdp-desc {
    font-size: 0.875rem;
  }
  .sizes-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(48px, 1fr));
    gap: 8px;
  }
  .size-btn {
    min-width: auto;
    padding: 10px 4px;
    font-size: 0.875rem;
  }
  .gal-thumbs {
    gap: 6px;
  }

  /* --- Корзина (Cart) --- */
  .cart-grid {
    gap: 24px;
  }
  .cart-line {
    grid-template-columns: 70px 1fr;
    gap: 12px;
    padding: 16px 0;
  }
  .cl-right {
    grid-column: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    margin-top: 8px;
  }
  .cl-price {
    font-size: 0.9375rem;
  }

  /* --- Оформление заказа (Checkout) --- */
  .co-grid {
    gap: 28px;
    padding-top: 16px;
  }
  .field-row {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .radio {
    padding: 12px 14px;
  }
  .radio .rp {
    font-size: 0.875rem;
  }

  /* --- Модуль СДЭК Карта --- */
  #cdek-map {
    height: 320px;
  }

  /* --- Подвал (Footer) --- */
  .footer-in {
    padding: 36px 0 24px;
  }
  .footer-cols {
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .footer-bottom {
    flex-direction: column;
    gap: 8px;
    text-align: center;
  }

  /* --- Всплывающие уведомления --- */
  .toast {
    left: 12px;
    right: 12px;
    bottom: 12px;
    width: calc(100% - 24px);
    padding: 12px 16px;
    font-size: 0.8125rem;
  }

  .cookie {
    flex-direction: column;
    padding: 12px 16px;
    gap: 8px;
    text-align: center;
  }
  .cookie button {
    width: 100%;
  }
}

@media (max-width: 360px) {
  .hdr-left, .hdr-right {
    gap: 8px;
  }
  .brand {
    font-size: 0.8125rem;
  }
  .grid-p {
    gap: 8px;
  }
}

/* ============================================================
   БАЗОВЫЙ КОНТЕЙНЕР (Глобальный отступ от краев экрана)
   ============================================================ */

/* Задаем безопасные боковые отступы по умолчанию */
.wrap {
  width: 100%;
  max-width: 1320px; /* или ваш max-width */
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;  /* Отступ слева */
  padding-right: 20px; /* Отступ справа */
  box-sizing: border-box;
}

/* На мобильных устройствах чуть уменьшаем отступ, чтобы оставить больше места контенту */
@media (max-width: 640px) {
  .wrap {
    padding-left: 16px;
    padding-right: 16px;
  }
}

/* Кнопка «Назад» */
.back-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: none;
  border: none;
  font-family: inherit;
  font-size: 0.95rem;
  color: var(--muted, #736663);
  cursor: pointer;
  padding: 8px 0;
  margin-bottom: 16px;
  transition: color 0.2s ease, transform 0.2s ease;
}

.back-btn:hover {
  color: var(--ink, #1a1a1a);
  transform: translateX(-4px); /* Лёгкий сдвиг стрелочки влево при наведении */
}

/* Контейнер PDP с анимацией плавной анимации */
.pdp-wrap {
  animation: pdpFadeIn 0.35s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  will-change: transform, opacity;
}

/* Анимация при закрытии */
.pdp-wrap.pdp-closing {
  animation: pdpFadeOut 0.3s cubic-bezier(0.7, 0, 0.84, 0) forwards;
}

/* Ключевые кадры анимаций */
@keyframes pdpFadeIn {
  from {
    opacity: 0;
    transform: translateY(12px) scale(0.99);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes pdpFadeOut {
  from {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
  to {
    opacity: 0;
    transform: translateY(16px) scale(0.98);
  }
}

.card-gallery {
  aspect-ratio: 9 / 16;
  border-radius: 12px; /* Закругление краев */
  overflow: hidden;    /* Обрезает внутренние слайды по радиусу */
}

/* Настройки прокрутки и снайпинга (scroll-snap) */
.card-gallery-track {
  display: flex;
  width: 100%;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  
  /* Скрываем полосу прокрутки */
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* IE/Edge */
}

.card-gallery-track::-webkit-scrollbar {
  display: none; /* Chrome/Safari/Opera */
}

/* Каждая картинка-слайд ровно на 100% ширины родителя */
.card-gallery-slide {
  flex: 0 0 100%;
  width: 100%;
  aspect-ratio: 4 / 5;
  scroll-snap-align: center;
  scroll-snap-stop: always; /* Строго задерживает свайп на текущем слайде */
}

.card-gallery-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 12px;
}

/* Десктопные зоны ховера и точки-индикаторы */
.card-hover-zones {
  position: absolute;
  inset: 0;
  display: flex;
  z-index: 2;
}

.card-hover-zone {
  flex: 1;
  height: 100%;
}

@media (pointer: coarse) {
  /* Отключаем плашки наведения на сенсорных устройствах, чтобы они не мешали свайпу */
  .card-hover-zones {
    display: none;
  }
}

/* Контейнер индикаторов с фоновой тенью */
.card-dots {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 4px;                  /* Расстояние между полосками */
  padding: 18px 12px 10px;   /* Отступ снизу и по бокам */
  z-index: 3;
  pointer-events: none;
  
  /* Легкий градиент (тень) снизу вверх, чтобы полоски не терялись на светлом фоне */
  background: linear-gradient(to top, rgba(0, 0, 0, 0.15) 0%, rgba(0, 0, 0, 0) 100%);
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
}

/* Элемент полоски (по умолчанию неактивный — серый/полупрозрачный) */
.card-dot {
  flex: 1;                   /* Полоски автоматически делят ширину карточки поровну */
  max-width: 40px;           /* Максимальная ширина одной полоски */
  height: 2px;               /* Толщина полоски */
  border-radius: 2px;        /* Легкое закругление краев у полоски */
  background: rgba(255, 255, 255, 0.35); /* Полупрозрачный серый/белый */
  transition: background-color var(--dur) var(--ease), opacity var(--dur) var(--ease);
}

/* Активная полоска — яркая (светло-белая) */
.card-dot.active {
  background: #FFFFFF;
  opacity: 0.95;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.3); /* Дополнительная легкая тень самой полоске */
}

/* Изображения и контейнеры карточек */
.card .ph, 
.card-gallery {
  aspect-ratio: 9 / 16 !important; /* Устанавливаем соотношение сторон 9:16 */
  border-radius: 12px;             /* Закругление краев (подберите радиус, например 8px, 12px или 16px) */
  overflow: hidden;                /* Чтобы картинка внутри контейнера не вылезала за закругленные края */
  object-fit: cover;               /* Гарантирует аккуратное заполнение без искажения картинки */
}

.card-gallery {
  aspect-ratio: 9 / 16 !important;
  border-radius: 12px;
  overflow: hidden;
  position: relative;
  width: 100%;
}

.card-gallery-track {
  display: flex;
  width: 100%;
  height: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  
  /* Блокирует передачу скролла родителю (каталогу/странице) */
  overscroll-behavior-x: contain;
  
  /* Скрытие полосы прокрутки */
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.card-gallery-track::-webkit-scrollbar {
  display: none;
}

.card-gallery-slide {
  flex: 0 0 100%;
  width: 100%;
  height: 100%;
  aspect-ratio: 9 / 16 !important; /* Исправлено: заменено с 4/5 на 9/16 */
  scroll-snap-align: center;
  scroll-snap-stop: always;
}

.card-gallery-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 12px;
}