/* ===========================
   Brand palette
=========================== */
:root{
  --ivory:#FAF8F3;
  --gold:#C5A15E;
  --gold-darker:#A3864C;
  --ink:#3A2C1A;
  --ink-2:#4A3B2B;
  --white:#FFFFFF;
}

/* ===========================
   Base
=========================== */
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji","Segoe UI Emoji";
  color:var(--ink);
  background:var(--ivory);
  line-height:1.4;
}

/* ===========================
   HERO
=========================== */
.hero{
  position:relative;
  min-height:100svh;
  display:grid; place-items:center;
  text-align:center;
  overflow:hidden;
  background:var(--ivory);
}
.hero__backdrop{
  position:absolute; inset:0;
  background:url("../img/hero-silk.jpg") center/cover no-repeat;
  filter:saturate(105%) contrast(102%);
  transform:scale(1.02);
}
.hero::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(250,248,243,.65) 0%, rgba(250,248,243,.35) 35%, rgba(250,248,243,.2) 100%);
}
.hero__inner{ position:relative; z-index:2; width:min(92vw,920px); padding:clamp(16px,3vw,32px); }
.hero__logo{ width:min(56vw,420px); height:auto; display:block; margin:0 auto clamp(16px,3.5vw,28px); }
.hero__title{ margin:0 0 .4em; font-weight:600; font-size:clamp(22px,4.2vw,40px); letter-spacing:.01em; }
.hero__subtitle{ margin:0 auto clamp(18px,4vw,28px); color:var(--ink-2); font-size:clamp(15px,2.4vw,20px); max-width:46ch; }
.hero__cta{ display:flex; gap:12px; flex-wrap:wrap; justify-content:center; }

/* ===========================
   Buttons
=========================== */
.btn{
  appearance:none; border:none; cursor:pointer; text-decoration:none;
  font-weight:600; letter-spacing:.02em;
  padding:12px 20px;
  border-radius:999px;
  transition:all .2s ease;
  font-size:clamp(14px,2.2vw,16px);
  background:var(--white); color:var(--ink);
}
.btn:hover{ transform:translateY(-1px); }
.btn--gold{ background:var(--gold); color:var(--white); }
.btn--gold:hover{ background:var(--gold-darker); }
.btn--outline, .btn.outline{
  background:var(--white); color:var(--ink); border:2px solid var(--gold);
}
.btn--outline:hover, .btn.outline:hover{ background:rgba(197,161,94,.08); }

/* ===========================
   Lang switcher
=========================== */
.lang-switcher{
  position:fixed; top:18px; right:28px; z-index:9999;
  font-size:14px; color:#caa65a; user-select:none;
}
.lang-switcher .lang-btn{ cursor:pointer; margin:0 4px; color:#caa65a; font-weight:500; transition:color .2s, opacity .2s; }
.lang-switcher .lang-btn:hover{ color:#a78940; }
.lang-switcher .lang-btn.is-active{ text-decoration:underline; font-weight:600; }

/* ===========================
   Hero menu
=========================== */
.hero__menu--right{ position:absolute; top:76px; right:28px; z-index:4; }
.hero__menu--right ul{ list-style:none; margin:0; padding:0; display:flex; gap:28px; }
.hero__menu--right a{ text-decoration:none; font-size:16px; color:var(--gold); font-weight:500; letter-spacing:.01em; transition:color .2s; }
.hero__menu--right a:hover{ color:var(--gold-darker); }
@media (max-width:900px){
  .hero__menu--right{ position:static; margin:12px 0 8px; text-align:center; }
  .hero__menu--right ul{ justify-content:center; gap:24px; }
}

/* ===========================
   Facts list
=========================== */
.facts{ background:var(--ivory); }
.facts__wrap{ max-width:1100px; margin:0 auto; padding:clamp(28px,6vw,64px) 20px; }
.facts__list{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:14px 18px; padding:0; margin:0; list-style:none; }
.facts__list li{ padding-left:24px; position:relative; font-size:clamp(14px,2vw,16px); color:var(--ink-2); }
.facts__list li::before{ content:"•"; position:absolute; left:8px; top:0; color:var(--gold); font-weight:700; }

/* ===========================
   Duvet slider
=========================== */
.slider{
  position:relative;
  max-width:980px;
  margin:0 auto 16px;
  border-radius:18px;
  overflow:hidden;
  background:#11111110;
}
.slider__track{ display:flex; transition:transform .6s ease; min-height:320px; }
.slider .slide{ flex:0 0 100%; width:100%; display:block; object-fit:cover; }
.slider__prev,.slider__next{
  position:absolute; top:50%; transform:translateY(-50%);
  width:44px; height:44px; border:none; border-radius:999px; cursor:pointer;
  background:rgba(0,0,0,.25); backdrop-filter:saturate(120%) blur(2px);
}
.slider__prev{ left:8px } .slider__next{ right:8px }
.slider__prev:hover,.slider__next:hover{ background:rgba(0,0,0,.35) }
.slider__dots{ position:absolute; left:0; right:0; bottom:10px; display:flex; gap:8px; justify-content:center; }
.slider__dots button{ width:8px; height:8px; border-radius:999px; border:none; background:rgba(0,0,0,.25); cursor:pointer; }
.slider__dots button.is-active{ background:var(--gold,#C5A15E); }
@media (max-width:900px){ .slider{ border-radius:12px } .slider__track{ min-height:260px } }

/* ===========================
   Catalog sliders (.js-slider)
=========================== */
.js-slider{
  --slider-h:420px;
  position:relative;
  overflow:hidden;
  border-radius:16px;
  max-width:980px;
  margin:0 auto 24px;
}
.js-slider .slider__track{
  display:flex;
  height:var(--slider-h);
  transition:transform .4s ease;
}
.js-slider .slide{
  flex:0 0 100%;
  width:100%;
  height:var(--slider-h);
  object-fit:cover;
  object-position:center;
  border-radius:16px;
  display:block;
}
.js-slider video.slide{ background:#000; }

/* ===========================
   Доп. режим: без обрезки
=========================== */
.js-slider.contain .slide{ object-fit:contain; background:#000; }

/* ===========================
   Pillows slider (контейнер 900px)
=========================== */
#pillows .js-slider{
  --slider-h:340px;   /* пониже, чем у одеяла */
  max-width:980px;    /* одинаково по ширине с одеялом */
  margin:0 auto 24px;
}

#pillows .js-slider .slide{ object-fit:contain; background:#000; }

/* Мобильная адаптация */
@media (max-width:640px){
  .js-slider{ --slider-h:260px; }
  #pillows .js-slider{ --slider-h:220px; }
}

/* ===========================
   USP block
=========================== */
.catalog-usp{
  margin:40px 0; padding:20px;
  background:#fdfbf8;
  border-left:4px solid #d4af37;
  border-radius:8px;
}
.catalog-usp h3, .catalog-usp h4{ color:#3a2a1a; margin-bottom:12px; }
.catalog-usp ul{ list-style:disc; margin-left:20px; line-height:1.6; }

/* ===========================
   Care page panes
=========================== */
.pane{ display:none; }
#ru:target ~ .panes #ru-pane,
#kz:target ~ .panes #kz-pane,
#en:target ~ .panes #en-pane{ display:block; }
body:not(:target) .panes #ru-pane{ display:block; }

/* ===========================
   Mobile zoom
=========================== */
.zoom-backdrop{ position:fixed; inset:0; background:rgba(0,0,0,.92); z-index:9998; }
.zoom-fullscreen{
  position:fixed !important; inset:0 !important; z-index:9999 !important;
  width:100dvw !important; height:100dvh !important;
  object-fit:contain !important; object-position:center center !important;
  background:transparent; margin:0 !important; border-radius:0 !important;
  touch-action:none; transform:translateZ(0); will-change:transform;
  transition:transform .18s ease, opacity .18s ease;
}
.zoom-dragging{ transition:none !important; }

/* ===========================
   Hygiene
=========================== */
li:empty{ display:none }

/* ===== Pillows slider: как у одеяла, без чёрных полей ===== */
#pillows #pillows-slider{ max-width:980px; margin:0 auto 16px; border-radius:18px; }
#pillows #pillows-slider .slider__track{ min-height:320px; }
#pillows #pillows-slider .slide{ object-fit:cover; background:transparent; }

/* Стрелки точно видимы */
#pillows .slider__prev, #pillows .slider__next{ display:block; }

@media (max-width:900px){
  #pillows #pillows-slider .slider__track{ min-height:260px; }
}

/* Иконки-«галочки» для стрелок (если глобального блока нет) */
#pillows .slider__prev::before,
#pillows .slider__next::before{
  content:"";
  display:block;
  width:10px; height:10px;
  border:2px solid #fff;
  border-top:none; border-right:none;
  transform:rotate(45deg);
  margin:16px auto;
}
#pillows .slider__next::before{ transform:rotate(-135deg); }

/* Чуть поднимем слой и сделаем фон, чтобы их точно было видно */
#pillows .slider__prev, #pillows .slider__next{
  z-index:3;
  background:rgba(0,0,0,.35);
}

.footer-social{
  display:flex; gap:14px; justify-content:center; align-items:center;
}
.footer-social a{
  width:44px; height:44px; border-radius:999px;
  display:inline-flex; align-items:center; justify-content:center;
  color:#fff;                     /* сами глифы — белые */
  box-shadow: 0 1px 2px rgba(0,0,0,.08), 0 0 0 1px rgba(0,0,0,.04) inset;
  transform: translateY(0);
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.footer-social a svg{ display:block; }

/* hover/active */
.footer-social a:hover{ transform: translateY(-1px); filter: brightness(1.03); }
.footer-social a:active{ transform: translateY(0); filter: brightness(.98); }

/* фирменные фоны */
.footer-social a.ig{
  /* популярный градиент Instagram */
  background:
    radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
}
.footer-social a.fb{ background:#1877F2; }
.footer-social a.tg{ background:#27A7E5; }

/* адаптация под тёмную тему, если используешь body.theme-dark */
body.theme-dark .footer-social a{
  box-shadow: 0 1px 2px rgba(0,0,0,.5), 0 0 0 1px rgba(255,255,255,.06) inset;
}

/* Скрываем «Предзаказ» по всему сайту */
[data-i18n="badge_preorder"],
.btn-preorder,
.preorder,
.js-preorder { 
  display: none !important;
}

<style>
/* ===== Footer: соц-иконки (десктоп + мобайл) — финал ===== */
.site-footer .footer-social{
  display:flex; gap:14px; justify-content:center; align-items:center;
  font-size:0; /* скрыть случайные текстовые узлы */
}
.site-footer .footer-social a{
  width:44px; height:44px; border-radius:999px;
  display:inline-flex; align-items:center; justify-content:center;
  border:none; text-decoration:none;
  box-shadow: 0 1px 2px rgba(0,0,0,.08), 0 0 0 1px rgba(0,0,0,.04) inset;
  transition: transform .18s ease, filter .18s ease;
  line-height:0;
}
.site-footer .footer-social a:hover{ transform: translateY(-1px); filter: brightness(1.03); }
.site-footer .footer-social a:active{ transform:none; filter: brightness(.98); }

/* Фоны кнопок */
.site-footer .footer-social a.ig{
  background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
}
.site-footer .footer-social a.fb{ background:#1877F2; }
.site-footer .footer-social a.tg{ background:#27A7E5; }

/* Белые глифы, без «точек» и псевдоэлементов */
.site-footer .footer-social a,
.site-footer .footer-social a *{ color:#fff !important; stroke:#fff !important; }
.site-footer .footer-social a svg{ display:block; }
.site-footer .footer-social a svg path{ fill:#fff !important; }           /* FB/TG */
.site-footer .footer-social a.ig svg rect,
.site-footer .footer-social a.ig svg circle{ fill:none !important; }      /* IG контуры */
.site-footer .footer-social a.ig svg circle:last-of-type{ fill:#fff !important; } /* IG блик */
.site-footer .footer-social a::before,
.site-footer .footer-social a::after{ content:none !important; }

/* Мобайл: больше и толще для читабельности */
@media (max-width: 480px){
  .site-footer .footer-social a{ width:48px; height:48px; }
  .site-footer .footer-social a svg{ width:22px; height:22px; filter: drop-shadow(0 0 1px rgba(0,0,0,.35)); }
  .site-footer .footer-social a.ig svg rect,
  .site-footer .footer-social a.ig svg circle{ stroke-width:2.4 !important; }
}
</style>