:root{
  --font-head:'Playfair Display',serif;
  --font-body:'Inter',sans-serif;
  --ink:#0e0d0c;
  --ink-soft:#1a1815;
  --paper:#f6f2ea;
  --paper-dim:#ece5d6;
  --wine:#5c1a24;
  --wine-bright:#7c2a37;
  --gold:#b08d57;
  --gold-soft:#c9ad82;
  --grey:#8a8478;
  --line: rgba(246,242,234,0.14);
  --line-dark: rgba(14,13,12,0.12);
  --max: 1280px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;overflow-x:hidden;width:100%;}
body{
  margin:0;
  background:var(--ink);
  color:var(--paper);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  width:100%;
}

::selection{background:var(--wine);color:var(--paper);}

a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}

h1,h2,h3,h4{
  font-family:var(--font-head);
  font-weight:500;
  margin:0;
  letter-spacing:-0.01em;
}

.wrap{max-width:var(--max);margin:0 auto;padding:0 40px;}

/* ===== Top bar (телефон + режим работы) ===== */
.top-bar{
  background:var(--wine);color:var(--paper);
  font-size:12.5px;
}
.top-bar-inner{
  max-width:var(--max);margin:0 auto;padding:0 40px;
  height:38px;display:flex;align-items:center;justify-content:space-between;
  gap:16px;
}
.top-bar-phone{color:var(--paper);letter-spacing:0.02em;font-weight:500;}
.top-bar-phone:hover{color:var(--gold-soft);}
.top-bar-hours{color:rgba(246,242,234,0.78);}
@media (max-width: 640px){
  .top-bar-inner{
    padding:8px 20px;
    height:auto;
    flex-direction:column;
    align-items:flex-start;
    gap:2px;
  }
  .top-bar-hours{
    display:block;
    font-size:11px;
    line-height:1.3;
  }
}

/* ===== Header ===== */
.site-header{
  position:sticky;top:0;z-index:100;
  background:rgba(14,13,12,0.92);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
  transition:height .3s ease;
}
.header-inner{
  max-width:var(--max);margin:0 auto;padding:0 40px;
  display:flex;align-items:center;justify-content:space-between;
  height:78px;
  transition:height .3s ease;
}
.site-header.is-scrolled .header-inner{height:58px;}
.site-header.is-scrolled .logo{font-size:19px;}
.logo{
  font-family:var(--font-head);
  font-size:22px;
  letter-spacing:0.04em;
  font-weight:500;
  transition:font-size .3s ease;
}
.logo span{color:var(--gold-soft);font-style:italic;}
.main-nav{display:flex;gap:36px;}
.main-nav a{
  font-size:14px;
  color:var(--paper);
  opacity:0.75;
  transition:opacity .2s ease;
  position:relative;
  padding-bottom:2px;
}
.main-nav a::after{
  content:'';position:absolute;left:0;right:0;bottom:-24px;height:1px;
  background:var(--gold);
  transform:scaleX(0);transform-origin:left;
  transition:transform .35s cubic-bezier(.22,.61,.36,1);
}
.main-nav a:hover{opacity:1;}
.main-nav a:hover::after{transform:scaleX(1);}
.main-nav a.active{opacity:1;}
.main-nav a.active::after{transform:scaleX(1);}
.header-actions{display:flex;align-items:center;gap:22px;}
.icon-btn{
  width:38px;height:38px;border-radius:50%;
  border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;
  font-size:14px;
  cursor:pointer;
  background:transparent;
  color:var(--paper);
  transition:border-color .2s ease, background .2s ease;
}
.icon-btn:hover{border-color:var(--gold);}
@keyframes cartBump{
  0%{transform:scale(1);}
  35%{transform:scale(1.22);}
  60%{transform:scale(0.94);}
  100%{transform:scale(1);}
}
.icon-btn.is-bumped{animation:cartBump .45s cubic-bezier(.22,.61,.36,1);}
.cart-count{
  position:relative;
}
.cart-count::after{
  content:attr(data-count);
  position:absolute;top:-4px;right:-4px;
  background:var(--wine);color:var(--paper);
  font-size:10px;width:16px;height:16px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-body);
}
.cart-count[data-count="0"]::after,
.cart-count[data-count=""]::after{
  display:none;
}
.burger{
  display:none;
  width:38px;height:38px;
  border-radius:50%;
  border:1px solid var(--line);
  background:transparent;
  cursor:pointer;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:4px;
}
.burger span{
  display:block;width:16px;height:1px;background:var(--paper);
  transition:transform .25s ease, opacity .25s ease;
}
.burger.open span:nth-child(1){transform:translateY(5px) rotate(45deg);}
.burger.open span:nth-child(2){opacity:0;}
.burger.open span:nth-child(3){transform:translateY(-5px) rotate(-45deg);}

.mobile-nav{
  display:none;
  flex-direction:column;
  background:var(--ink);
  border-bottom:1px solid var(--line);
  padding:8px 40px 24px;
  /* Раньше меню стояло в обычном потоке документа сразу после шапки:
     если пользователь успевал прокрутить страницу вниз (например, листая
     каталог) до открытия бургера, меню оказывалось выше текущей области
     просмотра и было невидимым, хотя технически было "открыто".
     Фиксируем меню под шапкой, чтобы оно всегда появлялось поверх
     контента независимо от прокрутки. */
  position:fixed;
  top:78px;
  left:0;
  right:0;
  z-index:99;
  max-height:calc(100vh - 78px);
  overflow-y:auto;
  box-shadow:0 16px 32px rgba(0,0,0,0.35);
}
.mobile-nav.open{display:flex;}
.mobile-nav a{
  padding:14px 0;
  font-size:15px;
  color:var(--paper);
  border-bottom:1px solid var(--line);
}
.mobile-nav a:last-child{border-bottom:none;}
.mobile-nav a.active{color:var(--gold-soft);}

@media (max-width: 900px){
  .main-nav{display:none;}
  .burger{display:flex;}
  .header-inner{padding:0 20px;}
  .header-actions{gap:12px;}
}
@media (max-width: 900px){
  .mobile-nav{padding:8px 20px 24px;}
}

/* ===== Buttons ===== */
.btn{
  display:inline-flex;align-items:center;gap:10px;
  padding:15px 30px;
  border:1px solid var(--gold);
  color:var(--paper);
  font-size:13px;
  letter-spacing:0.06em;
  cursor:pointer;
  background:transparent;
  transition:background .25s ease, color .25s ease;
  font-family:var(--font-body);
}
.btn:hover{background:var(--gold);color:var(--ink);}
.btn-solid{
  background:var(--wine);
  border:1px solid var(--wine);
}
.btn-solid:hover{background:var(--wine-bright);border-color:var(--wine-bright);color:var(--paper);}
.btn-light{
  border:1px solid var(--ink);
  color:var(--ink);
}
.btn-light:hover{background:var(--ink);color:var(--paper);}
.btn-block{width:100%;justify-content:center;}

/* ===== Hero ===== */
.hero{
  position:relative;
  min-height:92vh;
  display:flex;
  align-items:center;
  overflow:hidden;
  border-bottom:1px solid var(--line);
  background:var(--ink);
}
.hero::before{display:none;}
.hero-grid{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(0, 0.86fr) minmax(0, 1.14fr);
  gap:42px;
  align-items:center;
  width:100%;
}
.hero-copy{
  max-width:500px;
  width:100%;
}
.hero-eyebrow{
  color:var(--gold-soft);
  font-size:13px;
  letter-spacing:0.14em;
  margin-bottom:28px;
  display:block;
}
.hero h1{
  font-size:clamp(42px,4.9vw,72px);
  line-height:0.97;
  color:var(--paper);
  font-style:italic; /* заголовок главного экрана целиком курсивом */
  margin:0;
}
.hero h1 .hero-line{
  display:block;
  white-space:nowrap;
}
.hero h1 em{
  font-style:italic;
  color:var(--gold-soft);
}
.hero p{
  max-width:430px;
  color:rgba(246,242,234,0.7);
  font-size:17px;
  margin-top:26px;
}
.hero-actions{
  display:flex;
  gap:18px;
  margin-top:44px;
  flex-wrap:wrap;
}
/* Без перекрытия заголовка: изображение остаётся внутри своей колонки. */
.hero-visual{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  min-width:0;
  width:100%;
  min-height:600px;
  height:auto;
  overflow:visible;
  isolation:isolate;
}
/* Мягкий переход только слева: от текста к фото. */
.hero-visual::before{
  content:'';
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:32%;
  background:linear-gradient(90deg, var(--ink) 0%, rgba(14,13,12,0.96) 18%, rgba(14,13,12,0.76) 44%, rgba(14,13,12,0.34) 74%, transparent 100%);
  z-index:2;
  pointer-events:none;
}
.hero-photo--scene{
  position:relative;
  display:block;
  width:108%;
  max-width:none;
  height:auto;
  object-fit:contain;
  flex:0 1 auto;
}
@media (max-width:1100px) and (min-width:901px){
  .hero-grid{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:26px;}
  .hero-copy{max-width:440px;}
  .hero h1{font-size:clamp(38px,4.5vw,60px);}
  .hero-visual{min-height:480px;}
  .hero-photo--scene{width:104%;}
}
.hero-bottle{
  width:220px;
  height:460px;
  background:linear-gradient(180deg, rgba(176,141,87,0.25), rgba(92,26,36,0.55));
  border:1px solid var(--line);
  border-radius:6px 6px 22px 22px;
  position:relative;
  box-shadow:0 60px 120px -40px rgba(0,0,0,0.7);
}
.hero-bottle::before{
  content:'';
  position:absolute;top:-46px;left:50%;transform:translateX(-50%);
  width:74px;height:56px;
  background:var(--gold);
  border-radius:4px 4px 0 0;
}
.hero-bottle::after{
  content:'ATTAR';
  position:absolute;bottom:60px;left:0;right:0;
  text-align:center;
  font-family:var(--font-head);
  font-style:italic;
  font-size:15px;
  letter-spacing:0.08em;
  color:var(--paper);
}
.hero-ring{
  position:absolute;
  width:520px;height:520px;
  border:1px solid rgba(176,141,87,0.25);
  border-radius:50%;
}
.hero-scroll{
  position:absolute;bottom:36px;left:40px;
  display:flex;align-items:center;gap:12px;
  font-size:12px;color:rgba(246,242,234,0.5);
  letter-spacing:0.08em;
}
.hero-scroll::before{
  content:'';width:28px;height:1px;background:rgba(246,242,234,0.5);
}

@media (max-width: 900px){
  .hero-grid{grid-template-columns:minmax(0,1fr);gap:14px;}
  .hero-copy{max-width:100%;}
  .hero h1{font-size:clamp(34px,10vw,56px);}
  .hero-visual{min-height:0;height:auto;margin-top:22px;overflow:visible;}
  .hero-visual::before{width:30%;background:linear-gradient(90deg, var(--ink) 0%, rgba(14,13,12,0.9) 18%, rgba(14,13,12,0.52) 62%, transparent 100%);}
  .hero-photo--scene{width:100%;max-width:100%;height:auto;}
  .hero-bottle{width:150px;height:300px;}
  .hero-ring{width:320px;height:320px;}
}

/* ===== Section basics ===== */
.section{padding:140px 0;}

/* ===== Scroll-reveal ===== */
[data-reveal]{
  opacity:0;transform:translateY(24px);
  transition:opacity .7s cubic-bezier(.22,.61,.36,1), transform .7s cubic-bezier(.22,.61,.36,1);
}
[data-reveal].is-visible{opacity:1;transform:none;}
@media (prefers-reduced-motion: reduce){
  [data-reveal]{opacity:1;transform:none;transition:none;}
  .card-bottle, .card-img img{transition:none;}
}
.section-tight{padding:70px 0;}
.section-light{background:var(--paper);color:var(--ink);}
.section-head{
  display:flex;justify-content:space-between;align-items:flex-end;
  margin-bottom:56px;
  gap:24px;
}
.section-head h2{font-size:clamp(30px,3.4vw,44px);}
.section-head p{color:var(--grey);max-width:360px;font-size:15px;}
.section-light .section-head p{color:#6b6459;}

/* ===== Category strip ===== */
.cat-strip{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:1px;
  background:var(--line);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.cat-card{
  background:var(--ink);
  padding:48px 36px;
  transition:background .25s ease;
  position:relative;
  min-height:220px;
  display:flex;flex-direction:column;justify-content:space-between;
}
.cat-card:hover{background:var(--ink-soft);}
.cat-card.has-image{isolation:isolate;overflow:hidden;min-height:300px;}
.cat-card.has-image::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(14,13,12,0.2),rgba(14,13,12,0.85)),var(--cat-img) center/cover;transition:transform .5s ease;}
.cat-card.has-image:hover::before{transform:scale(1.05);}
.cat-card .num{color:var(--grey);font-size:13px;}
.cat-card h3{font-size:26px;margin-top:auto;}
.cat-card .go{
  margin-top:18px;color:var(--gold-soft);font-size:13px;
  display:flex;align-items:center;gap:8px;
}

@media (max-width: 900px){
  .cat-strip{grid-template-columns:repeat(2,1fr);}
}

/* ===== Product grid ===== */
.grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:2px;
  background:var(--line-dark);
}
.section-light .grid{background:var(--line-dark);}
.card{
  background:var(--paper);
  padding:0;
  position:relative;
  display:flex;flex-direction:column;
}
.card-img{
  aspect-ratio:3/4;
  background:linear-gradient(160deg, var(--paper-dim), #ded4bf);
  position:relative;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
}
.card-bottle{
  width:64px;height:150px;
  background:linear-gradient(180deg, rgba(176,141,87,0.5), rgba(92,26,36,0.35));
  border-radius:3px 3px 12px 12px;
  position:relative;
  transition:transform .5s cubic-bezier(.22,.61,.36,1);
}
.card:hover .card-bottle{transform:scale(1.06) translateY(-4px);}

/* Блок "Вам может понравиться" на странице товара — фото меньше, чем в каталоге */
.related-products{padding:20px 0 100px;}
.related-products h2{font-size:clamp(26px,3vw,36px);text-align:center;margin-bottom:32px;}
.grid-related{
  grid-template-columns:repeat(auto-fit,minmax(180px,230px));justify-content:center;
  gap:16px;max-width:980px;margin:0 auto;background:none;
}
.grid-related .card-img{aspect-ratio:1/1;width:100%;}
.grid-related .card-img img{object-fit:contain;padding:10px;box-sizing:border-box;mix-blend-mode:multiply;}
.grid-related .card-bottle{width:44px;height:100px;}
.grid-related .card-body{padding:14px 12px 18px;}
.grid-related .card-body h3{font-size:15px;}
.grid-related .card-cat{font-size:10px;}
.grid-related .card-body .desc{font-size:12px;}
@media (max-width:720px){
  .grid-related{grid-template-columns:repeat(2,1fr);}
}
.card-img img{
  width:100%;height:100%;object-fit:cover;
  transition:transform .6s cubic-bezier(.22,.61,.36,1);
}
.card:hover .card-img img{transform:scale(1.06);}
.card-bottle::before{
  content:'';position:absolute;top:-14px;left:50%;transform:translateX(-50%);
  width:22px;height:16px;background:var(--gold);border-radius:2px 2px 0 0;
}
.tag{
  position:absolute;top:14px;left:14px;
  background:var(--wine);color:var(--paper);
  font-size:11px;letter-spacing:0.05em;
  padding:5px 10px;
}
.tag.tag-sale{background:var(--ink);color:var(--gold-soft);}
.card-body{
  padding:22px 22px 26px;
  border-top:1px solid var(--line-dark);
  flex:1;display:flex;flex-direction:column;
}
.card-cat{font-size:11px;color:var(--grey);letter-spacing:0.06em;margin-bottom:8px;display:block;}
.card-body h3{font-size:19px;color:var(--ink);}
.card-rating{margin-top:6px;font-size:12px;color:var(--grey);display:flex;align-items:center;gap:5px;}
.stars{color:var(--gold);letter-spacing:1px;font-size:12px;}
.rating-num{color:var(--ink);font-weight:500;}
.rating-count{color:var(--grey);}
.card-body .desc{
  font-size:13px;line-height:1.5;color:#6b6459;margin-top:6px;min-height:3em;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.card-price{
  display:flex;justify-content:space-between;align-items:center;
  margin-top:auto;padding-top:16px;
}
.price{font-size:15px;color:var(--ink);}
.price .old{
  text-decoration:line-through;color:#a39c8c;font-size:12px;margin-right:8px;
}
.card-add{
  width:34px;height:34px;border-radius:50%;
  border:1px solid var(--ink);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;background:transparent;color:var(--ink);
  font-size:16px;
  transition:background .2s ease,color .2s ease;
}
.card-add:hover{background:var(--wine);border-color:var(--wine);color:var(--paper);}
/* Невидимая расширенная зона нажатия: минимум 44×44 px для пальца, вид кнопки не меняется */
.card-add{position:relative;}
.card-add::after{content:'';position:absolute;top:-8px;right:-8px;bottom:-8px;left:-8px;}

@media (max-width: 1100px){
  .grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width: 560px){
  .grid{grid-template-columns:repeat(2,1fr);gap:1px;}
  .card-body{padding:14px 12px 18px;}
  .card-body h3{font-size:15px;}
  .card-cat{font-size:10px;}
  .card-body .desc{font-size:11px;min-height:auto;}
  .price{font-size:13px;}
  .card-add{width:28px;height:28px;font-size:14px;}

  .filters{
    flex-wrap:nowrap;
    overflow-x:auto;
    padding:16px 0;
    gap:8px;
    -ms-overflow-style:none;
    scrollbar-width:none;
  }
  .filters::-webkit-scrollbar{display:none;}
  .filter-pill{
    flex-shrink:0;
    padding:8px 14px;
    font-size:12px;
    white-space:nowrap;
  }
}

/* ===== Manifesto / split section ===== */
.split{
  display:grid;grid-template-columns:0.92fr 1.08fr;
  gap:56px;align-items:center;
}
.split-visual{
  aspect-ratio:4/5;
  background:radial-gradient(ellipse at 30% 20%, rgba(176,141,87,0.35), transparent 60%), var(--ink-soft);
  border:1px solid var(--line);
  position:relative;
}
.split-visual.has-image{background:none;overflow:hidden;}
.split-visual.has-image img{display:block;width:100%;height:100%;object-fit:cover;}
.split-visual--about{
  background:none;
  border:0;
  aspect-ratio:auto;
}
.split-visual--about.has-image{
  overflow:visible;
  min-height:520px;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  padding:18px 0 18px 18px;
  isolation:isolate;
}
.split-visual--about.has-image::before{
  content:'';
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, var(--ink) 0%, rgba(14,13,12,0.94) 10%, rgba(14,13,12,0.72) 20%, rgba(14,13,12,0.28) 34%, rgba(14,13,12,0.04) 50%, transparent 66%),
    radial-gradient(circle at 72% 35%, rgba(176,141,87,0.18), transparent 46%);
  pointer-events:none;
  z-index:2;
}
.split-visual--about.has-image img,
.split-visual--about .split-photo-about{
  width:100%;
  height:auto;
  max-width:740px;
  object-fit:contain;
  position:relative;
  z-index:1;
  filter:drop-shadow(0 34px 80px rgba(0,0,0,0.35));
}
.split .kicker{
  color:var(--gold-soft);font-size:13px;letter-spacing:0.12em;margin-bottom:20px;display:block;
}
.split h2{font-size:clamp(28px,3vw,40px);line-height:1.15;}
.split p{color:rgba(246,242,234,0.68);margin-top:22px;max-width:480px;}
.section-light .split p{color:#6b6459;}

@media (max-width: 900px){
  .split{grid-template-columns:1fr;gap:40px;}
  .split-visual--about.has-image{min-height:auto;padding:8px 0 0;}
  .split-visual--about.has-image::before{
    background:
      linear-gradient(180deg, rgba(14,13,12,0.12) 0%, rgba(14,13,12,0.02) 28%, transparent 50%),
      radial-gradient(circle at 50% 18%, rgba(176,141,87,0.15), transparent 46%);
  }
}

/* ===== Stats ===== */
.stats{
  display:grid;grid-template-columns:repeat(4,1fr);
  border-top:1px solid var(--line-dark);border-bottom:1px solid var(--line-dark);
}
.stat{padding:44px 32px;border-right:1px solid var(--line-dark);}
.stat:last-child{border-right:none;}
.stat .n{font-family:var(--font-head);font-size:40px;color:var(--wine);}
.stat .l{font-size:13px;color:#6b6459;margin-top:8px;}

@media (max-width: 900px){
  .stats{grid-template-columns:repeat(2,1fr);}
  .stat{border-bottom:1px solid var(--line-dark);}
}

/* ===== Testimonials / instagram-style ===== */
.people{
  display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);
}
.people-card{
  background:var(--ink);
  aspect-ratio:1;
  display:flex;align-items:flex-end;padding:20px;
  background-image:radial-gradient(ellipse at 30% 20%, rgba(92,26,36,0.3), transparent 70%);
  font-size:13px;color:var(--gold-soft);
}

@media (max-width: 900px){
  .people{grid-template-columns:repeat(2,1fr);}
}

/* ===== Footer ===== */
.site-footer{
  background:var(--ink);
  border-top:1px solid var(--line);
  padding:80px 0 30px;
}
.footer-grid{
  display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;
  gap:40px;
  padding-bottom:60px;
  border-bottom:1px solid var(--line);
}
.footer-col h4{
  font-family:var(--font-body);font-size:13px;letter-spacing:0.08em;
  color:var(--gold-soft);margin-bottom:20px;font-weight:600;
}
.footer-col a, .footer-col p{
  display:block;font-size:14px;color:rgba(246,242,234,0.65);margin-bottom:12px;
}
.footer-col a:hover{color:var(--paper);}
.footer-bottom{
  display:flex;justify-content:space-between;align-items:center;
  padding-top:28px;font-size:13px;color:rgba(246,242,234,0.4);
  flex-wrap:wrap;gap:14px;
}

@media (max-width: 900px){
  .footer-grid{grid-template-columns:1fr 1fr;}
}

/* ===== Breadcrumbs / page headers ===== */
.page-head{
  padding:60px 0 50px;
  border-bottom:1px solid var(--line-dark);
}
.page-head.on-dark{border-bottom:1px solid var(--line);}
.crumbs{font-size:13px;color:var(--grey);margin-bottom:18px;}
.crumbs a{color:var(--grey);}
.crumbs a:hover{color:var(--wine);}
.page-head h1{font-size:clamp(32px,4vw,52px);}

/* ===== Catalog search ===== */
.catalog-search{
  padding-top:28px;
}
.catalog-search input[type="search"]{
  width:100%;
  background:transparent;
  border:1px solid var(--line-dark);
  padding:13px 18px;
  font-family:var(--font-body);
  font-size:14px;
  color:var(--paper);
}
.catalog-search input[type="search"]::placeholder{
  color:#9a9284;
}
.catalog-search input[type="search"]:focus{
  outline:none;
  border-color:var(--gold);
}
.catalog-search input[type="search"]::-webkit-search-cancel-button{
  cursor:pointer;
}

/* ===== Filters bar ===== */
.filters{
  display:flex;gap:14px;flex-wrap:wrap;
  padding:28px 0;
  border-bottom:1px solid var(--line-dark);
  margin-bottom:2px;
}
.filter-pill{
  padding:9px 18px;
  border:1px solid var(--line-dark);
  font-size:13px;color:#6b6459;
  cursor:pointer;
  background:transparent;
  transition:all .2s ease;
}
.filter-pill.active, .filter-pill:hover{
  border-color:var(--wine);color:var(--wine);
}

/* ===== Product page ===== */
.product-view{
  display:grid;grid-template-columns:1fr 1fr;gap:80px;
  padding:70px 0 100px;
}
.product-gallery{position:sticky;top:100px;align-self:start;}
.product-main-img{
  /* Контейнер подстраивается под фото: раньше фиксированные пропорции 3/4 и тёмный фон
     давали тёмный прямоугольник сверху и снизу от квадратного фото. */
  display:block;line-height:0;
  margin-bottom:16px;
}
.product-main-img img{display:block;width:100%;height:auto!important;object-fit:contain;}
/* Если фото нет — показываем заглушку-флакон в прежней рамке */
.product-main-img:not(:has(img)){
  aspect-ratio:3/4;
  background:radial-gradient(ellipse at 30% 25%, rgba(176,141,87,0.3), transparent 65%), var(--ink-soft);
  display:flex;align-items:center;justify-content:center;
}
.product-thumbs{display:flex;gap:12px;}
.product-thumb{
  width:76px;height:96px;
  background:var(--paper-dim);
  border:1px solid var(--line-dark);
  cursor:pointer;
  overflow:hidden;
  transition:border-color .15s ease, opacity .15s ease;
  opacity:0.65;
}
.product-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.product-thumb:hover{opacity:0.9;}
.product-thumb.active{border-color:var(--gold);opacity:1;}
.product-info .brand-tag{
  color:var(--gold-soft);font-size:13px;letter-spacing:0.1em;
}
.product-info h1{font-size:clamp(30px,3.6vw,44px);margin-top:14px;}
.product-info .rating{
  display:flex;align-items:center;gap:8px;margin-top:14px;
  font-size:13px;color:var(--grey);
}
.product-info .p-price{
  font-family:var(--font-head);font-size:32px;color:var(--paper);margin-top:24px;
}
.product-info .p-desc{
  color:rgba(246,242,234,0.68);margin-top:22px;max-width:460px;font-size:15px;
}
.vol-options{display:flex;gap:12px;margin-top:28px;}
.vol-pill{
  padding:12px 20px;border:1px solid var(--line);font-size:14px;cursor:pointer;
  transition:all .2s ease;
}
.vol-pill.active{border-color:var(--gold);color:var(--gold-soft);}
.product-cta{display:flex;gap:16px;margin-top:36px;}
.qty{
  display:flex;align-items:center;border:1px solid var(--line);
}
.qty button{
  width:44px;height:52px;background:none;border:none;color:var(--paper);
  font-size:16px;cursor:pointer;
}
.qty span{width:36px;text-align:center;font-size:14px;}
.accordion{margin-top:50px;border-top:1px solid var(--line);}
.accordion-item{border-bottom:1px solid var(--line);}
.accordion-item summary{
  padding:20px 0;cursor:pointer;font-size:15px;
  display:flex;justify-content:space-between;align-items:center;
  list-style:none;
}
.accordion-item summary::-webkit-details-marker{display:none;}
.accordion-item summary::after{content:'+';font-size:18px;color:var(--gold-soft);}
.accordion-item[open] summary::after{content:'–';}
.accordion-item .a-body{padding-bottom:22px;color:rgba(246,242,234,0.65);font-size:14px;max-width:460px;}
.notes-pyramid{display:flex;flex-direction:column;gap:14px;margin-top:12px;}
.note-row{display:flex;align-items:center;gap:16px;}
.note-row .note-label{width:90px;font-size:12px;color:var(--grey);letter-spacing:0.06em;}
.note-row .note-val{font-size:14px;color:rgba(246,242,234,0.75);}

@media (max-width: 900px){
  .product-view{grid-template-columns:1fr;gap:40px;}
  .product-gallery{position:static;}
}

/* ===== About page timeline ===== */
.timeline{margin-top:20px;}
.t-row{
  display:grid;grid-template-columns:120px 1fr;gap:32px;
  padding:34px 0;border-top:1px solid var(--line-dark);
}
.t-row:last-child{border-bottom:1px solid var(--line-dark);}
.t-year{font-family:var(--font-head);font-size:22px;color:var(--wine);}
.t-text h4{font-size:18px;color:var(--ink);margin-bottom:8px;}
.t-text p{font-size:14px;color:#6b6459;max-width:520px;}

/* ===== Contact page ===== */
.contact-grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:70px;
  padding:70px 0 100px;
}
.contact-grid>*{min-width:0;}
.contact-info .row{
  padding:24px 0;border-top:1px solid var(--line);
}
.contact-info .row:last-child{border-bottom:1px solid var(--line);}
.contact-info .row h4{font-size:13px;color:var(--gold-soft);letter-spacing:0.08em;margin-bottom:8px;}
.contact-info .row p{color:rgba(246,242,234,0.75);font-size:15px;margin:0;overflow-wrap:anywhere;}
.form-field{margin-bottom:20px;}
.form-field label{
  display:block;font-size:12px;color:var(--grey);margin-bottom:8px;letter-spacing:0.05em;
}
.form-field input, .form-field textarea{
  width:100%;background:transparent;border:none;border-bottom:1px solid var(--line);
  padding:12px 0;color:var(--paper);font-family:var(--font-body);font-size:15px;
  box-sizing:border-box;-webkit-appearance:none;appearance:none;border-radius:0;
}
.form-field input:focus, .form-field textarea:focus{
  outline:none;border-bottom-color:var(--gold);
}
/* Chrome/Safari подсвечивают автозаполненные поля своим жёлтым фоном и родным
   бордером поверх нашей стилизации (отсюда и лишняя линия у края поля).
   Перекрашиваем автозаполнение в цвет темы, а не отключаем — так безопаснее и понятнее для пользователя. */
.form-field input:-webkit-autofill,
.form-field input:-webkit-autofill:hover,
.form-field input:-webkit-autofill:focus{
  -webkit-text-fill-color:var(--paper);
  -webkit-box-shadow:0 0 0 1000px var(--ink) inset;
  box-shadow:0 0 0 1000px var(--ink) inset;
  caret-color:var(--paper);
  transition:background-color 9999s ease-in-out 0s;
}
.map-block{
  position:relative;aspect-ratio:16/9;max-width:100%;overflow:hidden;
  background:linear-gradient(160deg, var(--ink-soft), var(--ink));
  border:1px solid var(--line);
  color:var(--grey);font-size:14px;margin-top:40px;
}
.map-block iframe{position:absolute;inset:0;z-index:1;width:100%;height:100%;border:0;display:block;}
.map-fallback{position:absolute;inset:0;z-index:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:20px;}
.map-link{margin-top:12px;font-size:13px;}
.map-link a{color:var(--gold-soft);text-decoration:underline;text-underline-offset:3px;}

/* ===== Delivery page ===== */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line-dark);margin-top:20px;}
.step{background:var(--paper);padding:40px 32px;}
.step .n{font-family:var(--font-head);font-size:36px;color:var(--wine);}
.step h4{margin-top:18px;font-size:18px;color:var(--ink);}
.step p{font-size:14px;color:#6b6459;margin-top:10px;}
.pay-methods{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:30px;}
.pay-method{
  border:1px solid var(--line-dark);padding:26px;text-align:center;font-size:14px;color:#6b6459;
}

@media (max-width: 900px){
  .steps{grid-template-columns:1fr;}
  .pay-methods{grid-template-columns:repeat(2,1fr);}
  .contact-grid{grid-template-columns:minmax(0,1fr);gap:40px;padding:40px 0 64px;}
  .map-block{aspect-ratio:4/3;margin-top:28px;}
}

/* Table styling for FAQ / delivery.
   По умолчанию таблица стоит на тёмной секции — текст светлый.
   Раньше здесь был тёмный цвет (#4d473d), рассчитанный на светлый фон,
   из-за чего таблица "Способы доставки" была почти нечитаема. */
table{width:100%;border-collapse:collapse;margin-top:24px;}
table th, table td{
  text-align:left;padding:16px 0;border-bottom:1px solid var(--line);
  font-size:14px;color:rgba(246,242,234,0.88);
}
table th{color:var(--gold-soft);font-weight:500;font-size:13px;letter-spacing:0.04em;}

/* Если таблица когда-нибудь окажется на светлой секции — возвращаем тёмный текст. */
.section-light table th, .section-light table td{
  border-bottom:1px solid var(--line-dark);
  color:#4d473d;
}
.section-light table th{color:var(--grey);}

/* ===== Форма подписки на рассылку ===== */
.newsletter{
  background:var(--ink-soft);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  padding:64px 0;
}
.newsletter-inner{
  display:flex;justify-content:space-between;align-items:center;gap:40px;flex-wrap:wrap;
}
.newsletter-text h3{font-size:26px;}
.newsletter-text p{color:rgba(246,242,234,0.65);font-size:14px;margin-top:8px;max-width:420px;}
.newsletter-form{
  display:flex;gap:12px;flex-wrap:wrap;
  flex:1;max-width:480px;
}
.newsletter-form input[type="email"]{
  flex:1;min-width:220px;
  background:transparent;border:1px solid var(--line);
  padding:14px 18px;color:var(--paper);font-family:var(--font-body);font-size:14px;
}
.newsletter-form input[type="email"]:focus{outline:none;border-color:var(--gold);}
.newsletter-consent{
  width:100%;display:flex;align-items:flex-start;gap:10px;margin-top:14px;
  font-size:12px;color:rgba(246,242,234,0.55);
}
.newsletter-consent input{margin-top:3px;}
.newsletter-consent a{color:var(--gold-soft);text-decoration:underline;text-underline-offset:2px;}
.newsletter-status{
  width:100%;font-size:13px;margin-top:10px;display:none;
}
.newsletter-status.success{color:var(--gold-soft);display:block;}
.newsletter-status.error{color:#e08694;display:block;}

/* Honeypot-поле — невидимо для людей, но видно ботам-автозаполнителям */
.hp-field{
  position:absolute !important;
  left:-9999px !important;
  width:1px;height:1px;overflow:hidden;
  opacity:0;
}

@media (max-width: 900px){
  .newsletter-inner{flex-direction:column;align-items:flex-start;}
  .newsletter-form{max-width:100%;width:100%;}
  .newsletter-form input[type="email"]{width:100%;}
  .newsletter-form button{width:100%;justify-content:center;}
}

/* utility */
.mt-0{margin-top:0;}
.center{text-align:center;}
.small-note{font-size:12px;color:var(--grey);margin-top:14px;}

/* ===== Пагинация каталога ===== */
.pagination{
  display:flex;justify-content:center;gap:10px;
  padding:50px 0 70px;
  flex-wrap:wrap;
}
.page-btn{
  width:40px;height:40px;
  border:1px solid var(--line);
  background:transparent;color:var(--paper);
  font-size:14px;cursor:pointer;
  transition:all .2s ease;
}
.page-btn:hover{border-color:var(--gold);}
.page-btn.active{
  background:var(--wine);border-color:var(--wine);color:var(--paper);
}

/* ===================================================== */
/* ===== Общая мобильная адаптация (v2) ===== */
/* ===================================================== */

@media (max-width: 900px){
  .wrap{padding:0 20px;}
  .section{padding:48px 0;}
  .section-tight{padding:32px 0;}
  .section-head{flex-direction:column;align-items:flex-start;gap:14px;margin-bottom:28px;}
  .section-head p{max-width:100%;}

  .page-head{padding:28px 0 24px;}

  .cat-strip{grid-template-columns:repeat(2,1fr);}
  .cat-card{min-height:auto;padding:30px 20px;}

  .people{grid-template-columns:1fr 1fr;}

  .hero{min-height:auto;padding:60px 0 40px;}
  .hero-actions{flex-direction:column;align-items:stretch;gap:12px;}
  .hero-actions .btn{justify-content:center;}
  .hero-scroll{display:none;}

  .timeline .t-row{grid-template-columns:1fr;gap:8px;}

  .stats{grid-template-columns:1fr 1fr;}

  .footer-bottom{flex-direction:column;align-items:flex-start;}
}

@media (max-width: 600px){
  .header-inner{height:64px;}
  .mobile-nav{top:64px;max-height:calc(100vh - 64px);}
  .logo{font-size:18px;}
  .icon-btn{width:34px;height:34px;}

  h1{font-size:clamp(28px,7vw,40px) !important;}
  .hero h1{font-size:clamp(34px,9vw,48px);}
  .hero p{font-size:15px;}

  .people{grid-template-columns:1fr;}
  .stats{grid-template-columns:1fr;}
  .stat{border-right:none;border-bottom:1px solid var(--line-dark);}

  .btn{padding:14px 22px;font-size:12.5px;}

  table{font-size:13px;}
  table th, table td{padding:12px 0;}
}

/* Товарная страница и её sticky-галерея на мобильных */
@media (max-width: 900px){
  .product-view{padding:40px 0 60px;gap:32px;}
}

/* Корзина и оформление заказа — дополнительные мобильные штрихи */
@media (max-width: 800px){
  .cart-summary, .order-summary{position:static;}
}
@media (max-width: 500px){
  .cart-item-price{min-width:auto;font-size:14px;}
  .checkout-form h2{font-size:22px;}
  .vol-options{flex-direction:column;}
  .vol-pill{text-align:center;}
  .product-cta{flex-direction:column;}
  .qty{justify-content:center;}
  .radio-group{flex-direction:column;}
  .radio-pill{text-align:center;}
}

/* ===== Уведомление о добавлении в корзину (toast) ===== */
#cart-toast{
  position:fixed;
  left:50%;
  bottom:28px;
  transform:translate(-50%, 20px);
  background:var(--ink-soft);
  color:var(--paper);
  border:1px solid var(--line);
  border-radius:12px;
  padding:14px 20px;
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:12px;
  font-size:14px;
  box-shadow:0 16px 40px rgba(0,0,0,0.4);
  z-index:200;
  opacity:0;
  pointer-events:none;
  transition:opacity .25s ease, transform .25s ease;
  width:max-content;
  max-width:calc(100vw - 32px);
}
#cart-toast.show{
  opacity:1;
  transform:translate(-50%, 0);
  pointer-events:auto;
}
#cart-toast .toast-check{
  width:22px;height:22px;border-radius:50%;
  background:var(--wine);
  color:var(--paper);
  flex:none;
  display:flex;align-items:center;justify-content:center;
  font-size:12px;
}
#cart-toast .toast-text{flex:1 1 auto;min-width:0;}
#cart-toast .toast-text b{color:var(--gold-soft);font-weight:500;}
#cart-toast .toast-link{
  color:var(--gold-soft);
  border-bottom:1px solid var(--gold-soft);
  white-space:nowrap;
  flex:none;
}
@media (max-width:640px){
  #cart-toast{
    left:16px;right:16px;bottom:16px;
    transform:translateY(20px);
    width:auto;max-width:none;
    row-gap:10px;
    font-size:13px;
  }
  #cart-toast.show{transform:translateY(0);}
  #cart-toast .toast-text{flex:1 1 auto;min-width:120px;}
  #cart-toast .toast-link{flex:0 0 100%;text-align:right;}
}


/* ===== Фильтры каталога на мобильном: горизонтальная прокрутка вместо переноса =====
   Стоит в конце файла, чтобы не перебивалось базовым .filters{flex-wrap:wrap} выше по каскаду. */
@media (max-width: 560px){
  .filters{
    flex-wrap:nowrap;
    overflow-x:auto;
    -ms-overflow-style:none;
    scrollbar-width:none;
  }
  .filters::-webkit-scrollbar{display:none;}
  .filter-pill{flex-shrink:0;white-space:nowrap;}
}

/* Низкий экран (телефон в горизонтальном режиме): подсказка «Пролистайте вниз» наезжала на кнопки */
@media (max-height: 640px){ .hero-scroll{display:none;} }
@media (max-width: 380px){ .cat-strip{grid-template-columns:1fr;} }

/* ---------- Страницы из блоков WordPress (Главная, Доставка и оплата) ---------- */
.stats-wrap{display:contents;} /* старая разметка до версии 3.0 */
/* Полоса с цифрами: линии на секции, четыре колонки на внутреннем блоке */
.stats-band{border-top:1px solid var(--line-dark);border-bottom:1px solid var(--line-dark);}
.stats-band .stats{display:grid!important;grid-template-columns:repeat(4,1fr);max-width:none;margin:0;padding:0;border:0;}
.stats-band .stat{margin:0;}
@media (max-width:900px){.stats-band .stats{grid-template-columns:repeat(2,1fr);}}
@media (max-width:520px){.stats-band .stats{grid-template-columns:1fr;}}
/* Выше специфичность, чем у .wrap в shop.css (там margin:0 auto), иначе отступ над кнопкой пропадает */
.wrap.home-all{margin-top:56px;}
@media (max-width:900px){.wrap.home-all{margin-top:40px;}}
.center .wp-block-buttons{justify-content:center;}
.wp-block-button .wp-block-button__link{
  display:inline-flex;align-items:center;gap:10px;
  padding:15px 30px;border:1px solid var(--gold);border-radius:0;box-shadow:none;
  background:transparent;color:var(--paper);
  font-family:var(--font-body);font-size:13px;line-height:1.2;letter-spacing:0.06em;text-decoration:none;
  transition:background .25s ease, color .25s ease;
}
.wp-block-button .wp-block-button__link:hover{background:var(--gold);color:var(--ink);}
.wp-block-button.btn-light .wp-block-button__link{border-color:var(--ink);color:var(--ink);}
.wp-block-button.btn-light .wp-block-button__link:hover{background:var(--ink);color:var(--paper);}
.wp-block-table{margin:0;}
.wp-block-table td,.wp-block-table th{border:0;border-bottom:1px solid var(--line);padding:16px 0;}
.wp-block-table thead{border-bottom:0;}
.stats-band .stat br,.stats-band p:empty{display:none;}

/* Полоса с цифрами: ряд по центру, текст в ячейках по центру */
.stats-row{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));max-width:var(--max);margin:0 auto;padding:0 40px;}
.stats-row .stat{padding:56px 24px;text-align:center;float:none;width:auto;margin:0;}
.stats-row .stat .n{font-size:clamp(36px,3.4vw,48px);line-height:1.1;}
.stats-row .stat .l{margin-top:10px;}
@media (max-width:900px){.stats-row{padding:0 20px;}.stats-row .stat{padding:36px 16px;}}

/* Реквизиты внизу «Контактов» */
.requisites{padding:0 40px 72px;}
.requisites::before{content:'';display:block;border-top:1px solid var(--line);margin-bottom:28px;}
.requisites p{margin:0 0 6px;font-size:14px;color:var(--grey);letter-spacing:0.02em;}

/* Объём в карточке товара вместо нот */
.card-body .desc.card-volume{font-size:14px;letter-spacing:0.04em;color:#6b6459;min-height:0;}



/* Merged homepage final alignment (ported from hero branch) */
/* v3.1: fixed two-line hero. No overlap between the headline and the photo. */
@media (min-width: 901px) {
  .hero {
    min-height: 700px;
    padding: 44px 0 48px;
    align-items: center;
  }
  .hero-grid {
    grid-template-columns: minmax(0, 0.97fr) minmax(0, 1.03fr);
    gap: 34px;
    align-items: center;
  }
  .hero-copy {
    min-width: 0;
    max-width: none;
    align-self: center;
    position: relative;
    z-index: 3;
  }
  .hero h1 {
    font-size: clamp(36px, 4.2vw, 64px);
    line-height: 1.025;
    letter-spacing: -0.025em;
  }
  .hero h1 .hero-line {
    display: block;
    white-space: nowrap;
  }
  .hero-visual {
    min-width: 0;
    width: calc(100% + clamp(20px, 5vw, 100px));
    margin-right: calc(-1 * clamp(20px, 5vw, 100px));
    min-height: 580px;
    justify-content: flex-start;
    align-self: center;
  }
  .hero-visual .hero-photo--scene {
    width: 100%;
    max-width: none;
    height: auto;
    flex: 0 0 auto;
  }
  .hero-visual::before {
    width: 33%;
    background: linear-gradient(90deg, var(--ink) 0%, rgba(14,13,12,.94) 20%, rgba(14,13,12,.69) 49%, rgba(14,13,12,.24) 78%, transparent 100%);
  }
}
@media (min-width: 901px) and (max-width: 1100px) {
  .hero {min-height: 600px; padding-top: 36px;}
  .hero-grid {grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:25px;}
  .hero h1 {font-size: clamp(36px, 4.05vw, 48px);}
  .hero-visual {min-height: 480px;}
}
@media (max-width: 900px) {
  .hero h1 {font-size: clamp(30px, 7.3vw, 54px);}
  .hero h1 .hero-line {white-space: nowrap;}
  .hero-visual {margin-right:0; width:100%;}
}

/* Mobile: keep the requested two lines without horizontal overflow. */
@media (max-width: 600px) {
  .hero h1 { font-size: clamp(25px, 7.1vw, 42px); letter-spacing:-0.035em; }
  .hero h1 .hero-line { white-space:nowrap; }
}