/* ============================================================
   NARDI — направление «АРТЕФАКТ».
   Реализация дизайн-брифа от 16.09.2026.
   Принцип: товар всегда главный, интерфейс — его рамка.
   ============================================================ */

:root{
  /* палитра */
  --limestone:#E8E3DA;   /* известняк — основной фон */
  --graphite:#25282A;    /* графит — текст, заголовки, цены (13:1) */
  --paper:#F7F4EE;       /* бумага — панели, модальные окна */
  --patina:#59605D;      /* патина — вторичный текст (5.5:1) */
  --copper:#A64B32;      /* оксид меди — акцент, ссылки (5:1) */
  --sandstone:#C9BBA5;   /* песчаник — линии, вторичные поверхности */

  /* шрифты */
  --serif:'Cormorant Garamond',Georgia,serif;
  --sans:'IBM Plex Sans',system-ui,-apple-system,sans-serif;

  /* модульная шкала */
  --fs-xs:.75rem;    --fs-s:.875rem;   --fs-m:1rem;      --fs-l:1.125rem;
  --fs-xl:1.375rem;  --fs-2xl:1.75rem; --fs-3xl:2.25rem; --fs-4xl:3rem;
  --fs-5xl:4rem;     --fs-6xl:5.5rem;

  /* вертикальный ритм, базовый модуль 8px */
  --sp-1:8px;  --sp-2:16px; --sp-3:24px; --sp-4:32px;  --sp-5:40px;
  --sp-6:48px; --sp-8:64px; --sp-10:80px; --sp-12:96px; --sp-16:128px;

  --maxw:1440px;
  --gutter:48px;
  --ease:cubic-bezier(.2,.8,.2,1);
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  background:var(--limestone);
  color:var(--graphite);
  font-family:var(--sans);
  font-size:var(--fs-m);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{display:block;max-width:100%;-webkit-user-drag:none;-webkit-touch-callout:none}
[hidden]{display:none!important}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer}
:focus-visible{outline:2px solid var(--copper);outline-offset:3px}

.shell{max-width:var(--maxw);margin:0 auto;padding-inline:var(--gutter)}

/* ---------- типографика ---------- */
h1,h2,h3{font-family:var(--serif);font-weight:500;letter-spacing:-.01em;line-height:1.05}
.h-sec{font-size:var(--fs-3xl)}
.lead{color:var(--patina);font-size:var(--fs-l);max-width:58ch}
.meta{font-size:var(--fs-s);color:var(--patina)}

/* подпись над заголовком — линия и разрядка, как в утверждённом макете */
.kicker{
  display:inline-flex;align-items:center;gap:var(--sp-2);
  font-size:var(--fs-xs);letter-spacing:.18em;text-transform:uppercase;
  color:var(--copper);margin-bottom:var(--sp-3);
}
.kicker::before{content:'';width:40px;height:1px;background:var(--copper)}

/* ---------- кнопки ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:space-between;gap:var(--sp-5);
  padding:18px 24px;border-radius:3px;font-size:var(--fs-m);font-weight:500;
  border:1px solid transparent;transition:background .24s var(--ease),color .24s var(--ease),border-color .24s var(--ease);
}
.btn:active{transform:scale(.985);transition-duration:80ms}
.btn--primary{background:var(--copper);color:var(--paper)}
.btn--primary:hover{background:#8F3F2A}
.btn--line{border-color:var(--sandstone);color:var(--graphite)}
.btn--line:hover{border-color:var(--copper);color:var(--copper)}
.btn[disabled]{opacity:.45;pointer-events:none}
.btn__arrow{flex:none}

.link-arrow{
  display:inline-flex;align-items:center;gap:var(--sp-1);
  color:var(--copper);border-bottom:1px solid currentColor;padding-bottom:2px;
  font-size:var(--fs-m);transition:gap .24s var(--ease);
}
.link-arrow:hover{gap:14px}

/* ---------- шапка ---------- */
.nav{
  position:absolute;top:0;left:0;right:0;z-index:50;
  max-width:var(--maxw);margin:0 auto;
  display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:var(--sp-5);
  padding:var(--sp-3) var(--gutter);
  transition:background .3s var(--ease),box-shadow .3s var(--ease),padding .3s var(--ease);
}
.nav.scrolled{
  position:fixed;background:rgba(232,227,218,.94);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  padding-block:12px;box-shadow:0 1px 0 var(--sandstone);
  max-width:none;
}
.nav.scrolled > *{max-width:var(--maxw)}
.nav__brand{display:flex;align-items:center;gap:var(--sp-2)}
.nav__logo-img{height:34px;width:auto}
.nav__tag{font-size:var(--fs-xs);color:var(--patina);line-height:1.35;border-left:1px solid var(--sandstone);padding-left:var(--sp-2)}
.nav__menu{display:flex;justify-content:center;gap:var(--sp-4);flex-wrap:wrap}
.nav__link{font-size:var(--fs-s);color:var(--graphite);position:relative;padding-block:4px}
.nav__link::after{content:'';position:absolute;left:0;right:100%;bottom:0;height:1px;background:var(--copper);transition:right .24s var(--ease)}
.nav__link:hover::after{right:0}
.nav__right{display:flex;align-items:center;gap:var(--sp-2)}
.nav__cart{position:relative;display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:4px;color:var(--graphite);transition:color .24s}
.nav__cart:hover{color:var(--copper)}
.nav__cart-badge{
  position:absolute;top:2px;right:2px;min-width:18px;height:18px;padding:0 5px;
  display:inline-flex;align-items:center;justify-content:center;
  background:var(--copper);color:var(--paper);border-radius:999px;font-size:11px;font-weight:600;
}
.nav__burger{display:none;flex-direction:column;gap:5px;width:26px;padding:4px}
.nav__burger span{display:block;height:1.5px;background:var(--graphite);transition:.3s var(--ease)}
.nav__burger.open span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.nav__burger.open span:nth-child(2){opacity:0}
.nav__burger.open span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}

.mobile-menu{
  position:fixed;inset:0;z-index:49;background:var(--limestone);
  display:flex;flex-direction:column;justify-content:center;gap:var(--sp-1);padding:var(--sp-12) var(--sp-3) var(--sp-5);
  opacity:0;pointer-events:none;transition:opacity .24s var(--ease);overflow-y:auto;
}
.mobile-menu.open{opacity:1;pointer-events:auto}
.mobile-menu__link{font-family:var(--serif);font-size:var(--fs-4xl);padding:10px 0}
.mobile-menu__link:hover{color:var(--copper)}

/* ---------- ПЕРВЫЙ ЭКРАН ---------- */
/* пропорции первого экрана взяты с макета: широкая полоса, а не полный экран */
.hero{position:relative;min-height:min(780px,92svh);display:grid;align-items:center;overflow:hidden}
.hero__media{
  position:absolute;top:0;right:0;bottom:0;width:58%;
}
.hero__track{width:100%;height:100%}
.hero__slide{width:100%;height:100%;object-fit:cover;object-position:52% 50%}
.hero__slide:first-child{animation:hero-look 1200ms var(--ease) both}
.hero__slide:not(:first-child){display:none}   /* на большом экране кадр один */
.hero__pager{display:none}
/* один медленный взгляд на предмет при открытии страницы, без повтора */
@keyframes hero-look{from{transform:scale(1.01)}to{transform:scale(1)}}
.hero__media::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(90deg,var(--limestone) 0%,rgba(232,227,218,.72) 18%,transparent 52%);
}
/* вуаль под шапкой: тёмная древесина съедала пункты меню и корзину */
.hero__media::before{
  content:'';position:absolute;left:0;right:0;top:0;height:160px;z-index:1;
  background:linear-gradient(180deg,rgba(232,227,218,.96) 0%,rgba(232,227,218,.80) 38%,rgba(232,227,218,.30) 72%,rgba(232,227,218,0) 100%);
}
.hero__in{position:relative;z-index:2;max-width:var(--maxw);margin:0 auto;padding:150px var(--gutter) var(--sp-8);width:100%}
.hero__title{font-size:var(--fs-6xl);line-height:.94;max-width:min(640px,46vw)}
.hero__sub{margin-top:var(--sp-3);max-width:46ch;color:var(--patina);font-size:var(--fs-l)}
.hero__cta{margin-top:var(--sp-5)}
.hero__facts{display:flex;gap:var(--sp-5);flex-wrap:wrap;margin-top:var(--sp-10)}
.hero__fact{display:flex;align-items:center;gap:var(--sp-2);padding-right:var(--sp-5);border-right:1px solid var(--sandstone)}
.hero__fact:last-child{border-right:none}
.hero__fact svg{flex:none;color:var(--copper)}
.hero__fact b{display:block;font-size:var(--fs-m);font-weight:600}
.hero__fact span{font-size:var(--fs-s);color:var(--patina)}
/* ---------- ПУТЬ СОЗДАНИЯ ---------- */
.process{background:var(--paper);padding-block:var(--sp-12)}
.process__in{display:grid;grid-template-columns:minmax(260px,320px) 1fr;gap:var(--sp-8);align-items:start}
.process__text p{margin-top:var(--sp-2);color:var(--patina)}
.process__text .link-arrow{margin-top:var(--sp-3)}
.process__steps{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-3);align-items:start}
.step{position:relative}
.step__shot{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--limestone)}
.step__shot img{width:100%;height:100%;object-fit:cover;transition:transform .24s var(--ease)}
.step:hover .step__shot img{transform:scale(1.025)}
.step__n{display:block;margin-top:var(--sp-2);font-size:var(--fs-s);font-weight:600}
.step p{font-size:var(--fs-s);color:var(--patina);margin-top:4px}
/* стрелка между этапами: здесь это настоящая последовательность */
.step + .step::before{
  content:'';position:absolute;left:calc(var(--sp-3) / -2 - 5px);top:calc(50% - 30px);
  width:0;height:0;border-top:5px solid transparent;border-bottom:5px solid transparent;
  border-left:7px solid var(--copper);
}

/* ---------- СЕКЦИИ ---------- */
.sec{padding-block:var(--sp-16)}
.sec__head{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--sp-5);flex-wrap:wrap;margin-bottom:var(--sp-8)}
.sec__head-main{max-width:62ch}

/* ---------- ВИТРИНА НА ГЛАВНОЙ ----------
   Ровная сетка 3x2. Карточка та же, что в каталоге, — главная и каталог
   должны выглядеть одинаково. Разнобой ширин и пропорций убран:
   из-за него подписи и цены не выстраивались в одну линию. */
.lineup{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-5) var(--sp-3);align-items:start}
.lineup .pcard{grid-column:auto}
.catalog__more{margin-top:var(--sp-8)}

@media(max-width:1279px){
  .lineup{grid-template-columns:1fr 1fr}
}
@media(max-width:767px){
  .lineup{grid-template-columns:1fr}
}

/* ---------- МАСТЕРСКАЯ ---------- */
.craft{display:grid;grid-template-columns:1.15fr .85fr;gap:var(--sp-8);align-items:center}
.craft__macro{aspect-ratio:4/3;overflow:hidden;background:var(--sandstone)}
.craft__macro img{width:100%;height:100%;object-fit:cover}
.craft__list{list-style:none;display:grid;margin-top:var(--sp-4)}
.craft__list li{padding-block:var(--sp-3);border-top:1px solid var(--sandstone)}
.craft__list b{display:block;font-family:var(--serif);font-size:var(--fs-xl);font-weight:500}
.craft__list span{color:var(--patina);font-size:var(--fs-s)}

/* ---------- ДОСТАВКА ---------- */
.delivery{background:var(--paper);padding-block:var(--sp-16)}
.delivery__claim{font-family:var(--serif);font-size:var(--fs-4xl);max-width:16ch}
.delivery__grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-8);align-items:center;margin-top:var(--sp-8)}
.delivery__facts{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-5)}
.delivery__facts b{display:block;font-size:var(--fs-m);font-weight:600;margin-bottom:4px}
.delivery__facts span{font-size:var(--fs-s);color:var(--patina)}
.delivery__pack{aspect-ratio:4/3;overflow:hidden;background:var(--sandstone)}
.delivery__pack img{width:100%;height:100%;object-fit:cover}

/* ---------- ОТЗЫВЫ ----------
   Три карточки в ряд: кадр купленной модели сверху, под ним оценка
   и текст. Столбиком отзывы растягивали страницу на три экрана. */
.revs{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-5) var(--sp-3);
  border-top:1px solid var(--sandstone);padding-top:var(--sp-5)}
.rev{display:flex;flex-direction:column;gap:var(--sp-2)}
.rev__shot{display:block;overflow:hidden;aspect-ratio:4/3;background:var(--sandstone)}
.rev__shot img{width:100%;height:100%;object-fit:cover;transition:transform .24s var(--ease)}
.rev:hover .rev__shot img{transform:scale(1.025)}
.rev__body{display:flex;flex-direction:column;gap:var(--sp-1);align-items:flex-start}
.rev blockquote{font-family:var(--serif);font-size:var(--fs-l);line-height:1.4}
.rev__by{font-size:var(--fs-s);color:var(--graphite);margin-top:auto;padding-top:var(--sp-1)}
.rev__by span{color:var(--patina)}
.stars{color:var(--copper);font-size:var(--fs-s);letter-spacing:2px}

@media(max-width:1279px){
  .revs{grid-template-columns:1fr 1fr}
}
@media(max-width:767px){
  .revs{grid-template-columns:1fr;gap:var(--sp-5)}
  .rev__shot{max-width:320px}
}

/* ---------- ЗАЯВКА: начинается с вопроса, а не с полей ---------- */
.order{padding-block:var(--sp-16)}
/* заголовок идёт одной строкой: ограничение по ширине ломало его в столбик */
.order__q{font-family:var(--serif);font-size:var(--fs-4xl);max-width:none;text-wrap:balance}
.choices{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-3);margin-top:var(--sp-5)}
.choice{
  text-align:left;padding:var(--sp-3);border:1px solid var(--sandstone);border-radius:4px;background:transparent;
  transition:border-color .24s var(--ease),background .24s var(--ease);
}
.choice:hover{border-color:var(--copper)}
.choice[aria-pressed="true"]{border-color:var(--copper);background:rgba(166,75,50,.06)}
.choice b{display:block;font-size:var(--fs-m);font-weight:600}
.choice span{font-size:var(--fs-s);color:var(--patina)}
.order__form{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-2);margin:var(--sp-5) auto 0;max-width:760px;width:100%}
.order__form label{display:flex;flex-direction:column;gap:6px;font-size:var(--fs-s);color:var(--patina)}
.order__full{grid-column:1/-1}
.order__form input,.order__form textarea{
  font-family:var(--sans);font-size:var(--fs-m);color:var(--graphite);
  background:var(--paper);border:1px solid var(--sandstone);border-radius:4px;padding:13px 15px;
  transition:border-color .24s var(--ease);
}
.order__form input:focus,.order__form textarea:focus{outline:2px solid var(--copper);outline-offset:3px;border-color:var(--copper)}
.order__form textarea{min-height:104px;resize:vertical}
.order__note{grid-column:1/-1;font-size:var(--fs-s);color:var(--patina)}
.form-check{display:flex;gap:var(--sp-1);align-items:flex-start;grid-column:1/-1;font-size:var(--fs-s);color:var(--patina)}
.form-check__input{margin-top:4px;accent-color:var(--copper)}
.form-check__label a{color:var(--copper);text-decoration:underline;text-underline-offset:2px}

/* ---------- КОНТАКТЫ И ПОДВАЛ ---------- */
.contacts__grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-8);align-items:stretch}
.contacts__list{list-style:none;display:grid;gap:var(--sp-3);margin-top:var(--sp-4)}
.contacts__list li{display:grid;gap:2px;padding-bottom:var(--sp-3);border-bottom:1px solid var(--sandstone)}
.contacts__list span{font-size:var(--fs-s);color:var(--patina)}
.contacts__list a{font-size:var(--fs-l)}
.contacts__list a:hover{color:var(--copper)}
.contacts__map{min-height:360px;border:1px solid var(--sandstone)}
.contacts__map iframe{width:100%;height:100%;min-height:360px;border:0;display:block}

.footer{border-top:1px solid var(--sandstone);padding-block:var(--sp-8)}
.footer__in{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:var(--sp-8)}
.footer__brand img{height:38px;width:auto}
.footer__brand p{margin-top:var(--sp-2);font-size:var(--fs-s);color:var(--patina)}
.footer__nav{display:grid;gap:10px;font-size:var(--fs-s)}
.footer__nav a:hover{color:var(--copper)}
.footer__legal{font-size:var(--fs-s);color:var(--patina);display:grid;gap:10px}
.footer__copy{margin-top:var(--sp-5);padding-top:var(--sp-3);border-top:1px solid var(--sandstone);font-size:var(--fs-xs);color:var(--patina)}

/* ---------- COOKIE ---------- */
.cookie-banner{
  position:fixed;left:var(--sp-3);right:var(--sp-3);bottom:var(--sp-3);z-index:80;
  display:none;gap:var(--sp-3);align-items:center;justify-content:space-between;flex-wrap:wrap;
  background:var(--paper);border:1px solid var(--sandstone);border-radius:8px;
  padding:var(--sp-3);box-shadow:0 16px 40px rgba(37,40,42,.14);max-width:var(--maxw);margin:0 auto;
}
/* скрипт показывает баннер классом is-visible — в новых стилях
   был прописан только .show, из-за этого полоска не появлялась */
.cookie-banner.is-visible,.cookie-banner.show{display:flex;animation:cookie-in .3s var(--ease) both}
@keyframes cookie-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.cookie-banner__text p{font-size:var(--fs-s);color:var(--patina);max-width:72ch}
.cookie-banner__text a{color:var(--copper);text-decoration:underline}
.cookie-banner__actions{display:flex;gap:var(--sp-1)}
.cookie-banner__btn{padding:10px 18px;font-size:var(--fs-s);gap:0}

/* ---------- КОРЗИНА (разметку создаёт cart.js) ---------- */
.cart-back{position:fixed;inset:0;background:rgba(37,40,42,.42);opacity:0;pointer-events:none;transition:opacity .24s var(--ease);z-index:90}
.cart-back.open{opacity:1;pointer-events:auto}
.cart{
  position:fixed;top:0;right:0;bottom:0;width:min(460px,100%);z-index:91;
  background:var(--limestone);border-left:1px solid var(--sandstone);
  transform:translateX(100%);transition:transform .28s var(--ease);
  display:flex;flex-direction:column;
}
.cart.open{transform:none}
.cart__head{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-3);border-bottom:1px solid var(--sandstone)}
.cart__head h3{font-size:var(--fs-2xl)}
.cart__close{font-size:var(--fs-2xl);line-height:1;padding:4px 8px}
.cart__close:hover{color:var(--copper)}
.cart-form{display:flex;flex-direction:column;min-height:0;flex:1}
.cart__scroll{overflow-y:auto;padding:var(--sp-3);display:grid;gap:var(--sp-3)}
.cart-item{display:grid;grid-template-columns:64px 1fr auto;gap:var(--sp-2);align-items:center;padding-bottom:var(--sp-2);border-bottom:1px solid var(--sandstone)}
.cart-item img{width:64px;height:48px;object-fit:cover}
.cart-item__name{font-size:var(--fs-s);font-weight:500}
.cart-item__price{font-size:var(--fs-s);color:var(--patina)}
.cart-empty{text-align:center;color:var(--patina);padding:var(--sp-5) 0;font-size:var(--fs-s)}
.cart-form__title{font-family:var(--serif);font-size:var(--fs-xl)}
.cart-form__row{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-2)}
.cart-form__group{display:grid;gap:6px}
.cart-form__label{font-size:var(--fs-xs);color:var(--patina)}
.cart-form__label .req{color:var(--copper)}
.cart-form input,.cart-form textarea{
  font-family:var(--sans);font-size:var(--fs-s);color:var(--graphite);
  background:var(--paper);border:1px solid var(--sandstone);border-radius:4px;padding:11px 13px;
}
.cart-form input:focus,.cart-form textarea:focus{outline:2px solid var(--copper);outline-offset:2px}
.cart-radios{display:flex;gap:var(--sp-3)}
.cart-radio{display:inline-flex;align-items:center;gap:6px;font-size:var(--fs-s);cursor:pointer}
.cart-radio input{accent-color:var(--copper)}
.cart__bar{padding:var(--sp-3);border-top:1px solid var(--sandstone);display:grid;gap:var(--sp-2);background:var(--paper)}
.cart-msg{font-size:var(--fs-s);color:var(--copper)}
.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid var(--sandstone);border-radius:4px;transition:.24s}
.icon-btn:hover{border-color:var(--copper);color:var(--copper)}

/* ---------- ПЛАНШЕТ 768–1279 ---------- */
@media(max-width:1279px){
  :root{--gutter:32px;--maxw:1100px}
  .hero__title{font-size:var(--fs-5xl);line-height:.95}
  .hero__media{width:52%}
  .process__in{grid-template-columns:1fr;gap:var(--sp-5)}
  .process__steps{grid-template-columns:1fr 1fr;gap:var(--sp-5)}
  .step + .step::before{display:none}
  .good,.good--wide,.good--tall{grid-column:span 6}
  .good--tall .good__shot{aspect-ratio:4/3}
  .craft,.delivery__grid,.contacts__grid{grid-template-columns:1fr;gap:var(--sp-5)}
  .footer__in{grid-template-columns:1fr 1fr}
}

/* ---------- МОБИЛЬНЫЙ: самостоятельное решение ---------- */
@media(max-width:767px){
  :root{--gutter:20px}
  .nav__menu,.nav__tag{display:none}
  .nav__burger{display:flex}
  .nav{grid-template-columns:auto 1fr auto}
  .hero{min-height:0}
  .hero__media{position:relative;width:100%;height:auto;aspect-ratio:4/3;order:2}
  .hero__media::after{background:linear-gradient(0deg,rgba(232,227,218,.5),transparent 40%)}
  .hero__in{padding:112px var(--gutter) var(--sp-5)}
  .hero__title{font-size:2.75rem;line-height:.98;max-width:none}
  .hero__facts{gap:var(--sp-3);margin-top:var(--sp-5)}
  .hero__fact{padding-right:var(--sp-3)}
  .btn{width:100%}
  .process__steps,.choices,.delivery__facts,.order__form,.cart-form__row{grid-template-columns:1fr}
  .good,.good--wide,.good--tall{grid-column:span 12}
  .footer__in{grid-template-columns:1fr;gap:var(--sp-5)}
  .sec,.delivery,.order{padding-block:var(--sp-10)}
  .process{padding-block:var(--sp-10)}
  .delivery__claim,.order__q{font-size:var(--fs-2xl)}
}

/* ---------- УВАЖЕНИЕ К НАСТРОЙКАМ ---------- */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  html{scroll-behavior:auto}
  .hero__media img{animation:none}
}


/* ============================================================
   КАТАЛОГ — по макету «Каталог оформление»
   Левая колонка с фильтрами, сетка с меняющимся ритмом,
   промо-плитка индивидуального заказа, страницы внизу.
   ============================================================ */
.catalog-page{display:grid;grid-template-columns:240px 1fr;gap:var(--sp-8);padding-top:140px;padding-bottom:var(--sp-12);align-items:start}

/* ---- левая колонка ---- */
.rail{position:sticky;top:96px;display:grid;gap:var(--sp-5)}
.rail__title{font-size:var(--fs-4xl);line-height:1}
.filter__h{font-size:var(--fs-m);font-weight:600;margin-bottom:var(--sp-2)}
.filter + .filter{padding-top:var(--sp-4);border-top:1px solid var(--sandstone)}
.filter__opt{display:flex;align-items:center;gap:10px;padding:5px 0;font-size:var(--fs-s);cursor:pointer}
.filter__opt input{accent-color:var(--copper);width:16px;height:16px;flex:none}
.filter__opt span{color:var(--graphite)}
.filter__opt .n{margin-left:auto;color:var(--patina);font-size:var(--fs-xs)}

.range{display:grid;gap:6px}
.range input[type="range"]{width:100%;accent-color:var(--copper);background:transparent}
.range__val{font-size:var(--fs-s);color:var(--patina)}

.rail__search{position:relative;display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--sandstone);padding-bottom:8px}
.rail__search input{flex:1;border:none;background:transparent;font-family:var(--sans);font-size:var(--fs-s);color:var(--graphite);padding:4px 0}
.rail__search input:focus{outline:none}
.rail__search:focus-within{border-bottom-color:var(--copper)}
.rail__search svg{flex:none;color:var(--patina)}
.rail__clear{display:inline-flex;align-items:center;gap:8px;font-size:var(--fs-s);color:var(--patina)}
.rail__clear:hover{color:var(--copper)}

/* ---- верх каталога ---- */
.cat-top{display:grid;grid-template-columns:1fr auto;gap:var(--sp-5);align-items:start;margin-bottom:var(--sp-5)}
.cat-intro{
  border-left:1px solid var(--sandstone);padding-left:var(--sp-3);
  font-size:var(--fs-s);color:var(--patina);max-width:none;
  display:flex;align-items:baseline;flex-wrap:wrap;gap:0 10px;line-height:1.5;
}
.cat-intro__dot{color:var(--sandstone)}
.cat-intro__tail{flex:1 1 320px;min-width:0}
.cat-intro b{color:var(--graphite);font-weight:600}
.cat-sort{display:flex;align-items:center;gap:10px;border:1px solid var(--sandstone);border-radius:4px;padding:10px 14px;background:var(--paper)}
.cat-sort select{border:none;background:transparent;font-family:var(--sans);font-size:var(--fs-s);color:var(--graphite);cursor:pointer}
.cat-sort select:focus{outline:none}

/* ---- сетка ---- */
.cat-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--sp-3) var(--sp-3)}
.pcard{grid-column:span 3;display:flex;flex-direction:column}
.pcard--xl{grid-column:span 4}
.pcard__shot{position:relative;display:block;overflow:hidden;aspect-ratio:4/3;background:var(--sandstone)}
.pcard__shot img{width:100%;height:100%;object-fit:cover;transition:transform .24s var(--ease)}
.pcard:hover .pcard__shot img{transform:scale(1.025)}
.pcard__shot::after{content:'';position:absolute;inset:0;border:1px solid transparent;transition:border-color .24s var(--ease)}
.pcard:hover .pcard__shot::after{border-color:var(--copper)}
.pcard__video{
  position:absolute;left:12px;bottom:12px;z-index:2;display:inline-flex;align-items:center;gap:8px;
  padding:6px 12px 6px 6px;border-radius:999px;background:rgba(247,244,238,.94);
  font-size:var(--fs-xs);font-weight:500;color:var(--graphite);
}
.pcard__video i{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;background:var(--copper)}
.pcard__video i::before{content:'';width:0;height:0;margin-left:2px;border-top:4px solid transparent;border-bottom:4px solid transparent;border-left:6px solid var(--paper)}
.pcard__body{padding-top:var(--sp-2);display:flex;flex-direction:column;gap:4px;transition:transform .24s var(--ease)}
.pcard:hover .pcard__body{transform:translateX(4px)}
.pcard__name{font-family:var(--serif);font-size:var(--fs-2xl);font-weight:500;line-height:1.1}
.pcard--xl .pcard__name{font-size:var(--fs-3xl)}
.pcard__name a:hover{color:var(--copper)}
.pcard__meta{font-size:var(--fs-xs);color:var(--patina)}
.pcard__foot{display:flex;align-items:baseline;justify-content:space-between;gap:var(--sp-2);margin-top:6px;padding-top:10px;border-top:1px solid var(--sandstone)}
.pcard__price{font-size:var(--fs-l);font-weight:600}
.pcard__more{display:inline-flex;align-items:center;gap:6px;font-size:var(--fs-s);color:var(--patina);transition:color .24s var(--ease),gap .24s var(--ease)}
.pcard:hover .pcard__more{color:var(--copper);gap:10px}

/* ---- промо индивидуального заказа ---- */
.promo{
  grid-column:span 4;display:flex;flex-direction:column;justify-content:flex-end;gap:var(--sp-2);
  position:relative;overflow:hidden;background:var(--graphite);color:var(--paper);
  padding:var(--sp-5) var(--sp-4);min-height:100%;
}
.promo__bg{position:absolute;inset:0;opacity:.5}
.promo__bg::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(37,40,42,.25) 0%,rgba(37,40,42,.88) 62%,rgba(37,40,42,.96) 100%)}
.promo__bg img{width:100%;height:100%;object-fit:cover}
.promo > *:not(.promo__bg){position:relative;z-index:2}
.promo h3{font-family:var(--serif);font-size:var(--fs-3xl);font-weight:500;line-height:1.05;max-width:12ch}
.promo p{font-size:var(--fs-s);color:rgba(247,244,238,.86);max-width:34ch}
.promo .btn{align-self:flex-start;width:auto;gap:var(--sp-3);padding:14px 20px;font-size:var(--fs-s);margin-top:var(--sp-1)}

/* ---- страницы ---- */
.pager{grid-column:1/-1;display:flex;align-items:center;justify-content:center;gap:6px;margin-top:var(--sp-8);flex-wrap:wrap}
.pager button{min-width:36px;height:36px;border-radius:999px;font-size:var(--fs-s);color:var(--graphite);transition:.2s}
.pager button:hover:not(:disabled){color:var(--copper)}
.pager button[aria-current="page"]{background:var(--copper);color:var(--paper)}
.pager button:disabled{opacity:.35;cursor:default}
.pager__dots{color:var(--patina);padding:0 4px}
.cat-count{grid-column:1/-1;text-align:right;font-size:var(--fs-s);color:var(--patina);margin-top:calc(var(--sp-5) * -1)}
.cat-empty{grid-column:1/-1;padding:var(--sp-10) 0;text-align:center;color:var(--patina)}

@media(max-width:1279px){
  .catalog-page{grid-template-columns:200px 1fr;gap:var(--sp-5)}
  .pcard{grid-column:span 4}
  .pcard--xl{grid-column:span 6}
  .promo{grid-column:span 6}
}
@media(max-width:767px){
  .catalog-page{grid-template-columns:1fr;padding-top:112px}
  .rail{position:static}
  .rail__title{font-size:var(--fs-3xl)}
  .cat-top{grid-template-columns:1fr}
  .pcard,.pcard--xl,.promo{grid-column:span 12}
  .cat-count{text-align:left;margin-top:0}
}

.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.nav__link--active{color:var(--copper)}
.nav__link--active::after{right:0;background:var(--copper)}

/* ============================================================
   МАСТЕРСКАЯ — по макету «мастерство»
   Три полосы: резчик и школа, материалы и этапы, кто мы.
   ============================================================ */
.craft-band{display:grid;grid-template-columns:54% 1fr;align-items:stretch}
.craft-shot{position:relative;overflow:hidden;background:var(--sandstone);min-height:420px}
.craft-shot img{width:100%;height:100%;object-fit:cover}
.craft-quote{
  position:absolute;left:var(--sp-5);bottom:var(--sp-8);z-index:2;max-width:16ch;
  font-family:var(--serif);font-style:italic;font-size:var(--fs-l);color:var(--paper);
  text-shadow:0 2px 16px rgba(20,14,10,.75);
}
.craft-text{padding:var(--sp-10) var(--sp-8);display:grid;align-content:center;gap:var(--sp-3)}
.craft-text h2{font-size:var(--fs-4xl);max-width:14ch}
.craft-text p{color:var(--patina);max-width:52ch}
.craft-specs{display:grid;gap:var(--sp-4);align-content:center;padding:var(--sp-10) var(--sp-8) var(--sp-10) 0;border-left:1px solid var(--sandstone);list-style:none}
.craft-specs li{display:grid;grid-template-columns:40px 1fr;gap:var(--sp-2);list-style:none}
.craft-specs svg{color:var(--copper)}
.craft-specs b{display:block;font-size:var(--fs-m);font-weight:600;margin-bottom:2px}
.craft-specs span{font-size:var(--fs-s);color:var(--patina)}

/* полоса 1: фото + текст + характеристики */
.band-1{display:grid;grid-template-columns:54% 1fr auto;align-items:stretch;background:var(--limestone)}
/* :not() обязателен — иначе фоновый слой теряет position:absolute
   и фотография встаёт строкой сетки, а светлый текст ложится на светлый фон */

.flow__steps{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-4);align-items:start;list-style:none}
.flow__step{position:relative}
.flow__shot{aspect-ratio:16/10;overflow:hidden;background:var(--limestone)}
.flow__shot img{width:100%;height:100%;object-fit:cover;transition:transform .24s var(--ease)}
.flow__step:hover .flow__shot img{transform:scale(1.025)}
.flow__step b{display:block;margin-top:var(--sp-2);font-size:var(--fs-s);font-weight:600}
.flow__step p{font-size:var(--fs-s);color:var(--patina);margin-top:4px}
.flow__step + .flow__step::before{
  content:'';position:absolute;left:calc(var(--sp-4) / -2 - 4px);top:24%;
  width:0;height:0;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:7px solid var(--copper);
}
.stat-row{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-5)}
.stat{display:grid;gap:6px;padding-left:var(--sp-3);border-left:1px solid var(--sandstone)}
.stat svg{color:var(--copper)}
.stat b{font-size:var(--fs-s);font-weight:600}
.stat span{font-size:var(--fs-xs);color:var(--patina)}

/* ============================================================
   ДОСТАВКА И ОПЛАТА — по макету «доставка и оплата»
   ============================================================ */
.ship-top{position:relative;display:grid;grid-template-columns:1fr 42%;align-items:stretch;background:var(--limestone)}
/* текст и условия идут двумя колонками: в столбик заголовок ломался
   на пять строк и справа оставалась пустота */
.ship-top__in{
  display:grid;grid-template-columns:minmax(260px,40%) 1fr;gap:var(--sp-8);
  align-items:center;padding:var(--sp-12) var(--sp-8) var(--sp-12) var(--gutter);
}
.ship-top__text{display:grid;gap:var(--sp-3);align-content:center}
.ship-top__text .link-arrow{justify-self:start;margin-top:var(--sp-1)}
.ship-claim{font-family:var(--serif);font-size:var(--fs-4xl);line-height:1.05;max-width:18ch;text-wrap:balance}
.ship-lead{color:var(--patina);max-width:38ch;font-size:var(--fs-s)}
.ship-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-5)}
.ship-facts{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-5) var(--sp-4);list-style:none;align-content:center}
.ship-fact{padding:0 0 0 var(--sp-3);border-left:1px solid var(--sandstone)}
.ship-fact svg{color:var(--copper);margin-bottom:var(--sp-2)}
.ship-fact b{display:block;font-size:var(--fs-s);font-weight:600;margin-bottom:4px}
.ship-fact span{font-size:var(--fs-xs);color:var(--patina)}
.ship-top__shot{overflow:hidden;background:var(--sandstone);min-height:380px}
.ship-top__shot img{width:100%;height:100%;object-fit:cover}

.pack{display:grid;grid-template-columns:25% 1fr;align-items:stretch;background:var(--paper)}
.pack__shot{overflow:hidden;background:var(--sandstone);min-height:240px}
.pack__shot img{width:100%;height:100%;object-fit:cover}
.pack__in{display:grid;grid-template-columns:minmax(240px,28%) 1fr;gap:var(--sp-8);padding:var(--sp-8);align-items:center}
.pack__in h2{font-size:var(--fs-2xl);max-width:16ch}
.pack__in > div > p{font-size:var(--fs-s);color:var(--patina);margin-top:var(--sp-2);max-width:40ch}

.trust{display:grid;grid-template-columns:auto 1fr;gap:var(--sp-8);align-items:center;
  padding:var(--sp-8);background:var(--limestone);border-top:1px solid var(--sandstone)}
.trust h2{font-size:var(--fs-3xl);max-width:14ch}

@media(max-width:1279px){
  .band-1{grid-template-columns:1fr}
  .craft-specs{border-left:none;border-top:1px solid var(--sandstone);padding:var(--sp-5) var(--sp-8);
    grid-template-columns:1fr 1fr;gap:var(--sp-4) var(--sp-5)}
  .craft-specs li{grid-column:auto}
  /* правило схлопывания потерялось вместе с удалёнными полосами мастерской */
  .ship-top,.pack{grid-template-columns:1fr}
  .ship-top__shot,.pack__shot{order:2}
  .ship-top__in{grid-template-columns:1fr;gap:var(--sp-5);padding:var(--sp-8) var(--gutter)}
  .flow__steps{grid-template-columns:1fr 1fr}
  .flow__step + .flow__step::before{display:none}
  .pack__in,.trust{grid-template-columns:1fr;gap:var(--sp-5)}
  .stat-row{grid-template-columns:1fr 1fr}
}
@media(max-width:767px){
  .craft-text,.pack__in,.trust{padding:var(--sp-5) 0}
  .craft-specs{grid-template-columns:1fr;padding:var(--sp-5) 0}
  .craft-text h2,.ship-claim{font-size:var(--fs-2xl)}
  .flow__steps,.stat-row{grid-template-columns:1fr}
  .ship-facts{grid-template-columns:1fr;gap:var(--sp-3)}
  .ship-fact{padding:0 0 0 var(--sp-3)}
  .craft-shot,.ship-top__shot{min-height:260px}
}


/* шаги упаковки: иконки вместо фотографий — снимков реальной
   упаковки пока нет, а чужие коробки с логотипами обещают не то */
.pack-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-4);list-style:none}
.pack-step{display:grid;gap:6px;align-content:start;padding-left:var(--sp-3);border-left:1px solid var(--sandstone)}
.pack-step svg{color:var(--copper)}
.pack-step b{font-size:var(--fs-s);font-weight:600;margin-top:4px}
.pack-step p{font-size:var(--fs-s);color:var(--patina)}
@media(max-width:1279px){.pack-steps{grid-template-columns:1fr 1fr}}
@media(max-width:767px){.pack-steps{grid-template-columns:1fr}}


/* ---------- ТЕЛЕФОН: первый экран по макету ----------
   Фотография во весь кадр, текст поверх неё, светлая шапка.
   На десктопе первый экран остаётся светлым — это разные решения. */
@media(max-width:767px){
  .hero{min-height:100svh;align-items:end}
  .hero__media{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;order:0}
  .hero__track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .hero__track::-webkit-scrollbar{display:none}
  .hero__slide{flex:0 0 100%;scroll-snap-align:center;object-position:60% 50%}
  .hero__slide:not(:first-child){display:block}
  /* затемнение: светлый текст должен читаться на любом кадре */
  .hero__media::after{
    background:linear-gradient(180deg,rgba(20,15,11,.72) 0%,rgba(20,15,11,.45) 38%,rgba(20,15,11,.82) 100%);
  }
  .hero__media::before{display:none}

  .hero__in{padding:132px var(--gutter) var(--sp-10)}
  .hero__title{color:var(--paper);font-size:3.25rem;line-height:1.02;max-width:none}
  .hero__sub{color:rgba(247,244,238,.86);max-width:none}
  .hero .kicker{color:#D98A6A}
  .hero .kicker::before{background:#D98A6A}
  /* кнопка обводкой, как на макете */
  .hero__cta .btn--primary{
    background:transparent;color:var(--paper);border-color:#D98A6A;
    width:100%;justify-content:space-between;
  }
  .hero__cta .btn--primary:hover{background:rgba(217,138,106,.16)}
  /* факты повторяются строкой характеристик сразу под экраном */
  .hero__facts{display:none}

  .hero__pager{
    display:flex;align-items:center;gap:var(--sp-2);z-index:3;
    position:absolute;left:0;right:0;bottom:var(--sp-5);justify-content:center;
    color:rgba(247,244,238,.72);font-size:var(--fs-xs);letter-spacing:.14em;
  }
  .hero__pager i{width:72px;height:1px;background:rgba(247,244,238,.5)}

  /* шапка поверх тёмной фотографии */
  .nav:not(.scrolled) .nav__tag{color:rgba(247,244,238,.8);border-left-color:rgba(247,244,238,.35)}
  .nav:not(.scrolled) .nav__cart{color:var(--paper)}
  .nav:not(.scrolled) .nav__burger span{background:var(--paper)}
}

/* ============================================================
   СТРАНИЦА ТОВАРА — по макету «Товар»
   Слева лента кадров и крупная сцена, в центре покупка,
   справа видео и характеристики.
   ============================================================ */
.prod-page{padding-top:132px;padding-bottom:var(--sp-12)}
.crumbs{display:flex;align-items:center;gap:10px;font-size:var(--fs-s);color:var(--patina);margin-bottom:var(--sp-5)}
.crumbs a:hover{color:var(--copper)}
.crumbs i{font-style:normal;color:var(--sandstone)}
.crumbs span{color:var(--graphite)}

.prod{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.9fr) minmax(260px,.72fr);gap:var(--sp-5);align-items:start}

/* ---- галерея ---- */
.gal{display:grid;grid-template-columns:104px 1fr;gap:var(--sp-2);align-items:start}
.gal__rail{display:flex;flex-direction:column;gap:var(--sp-2);max-height:560px;overflow-y:auto;scrollbar-width:none}
.gal__rail::-webkit-scrollbar{display:none}
.gallery__thumb{position:relative;flex:none;width:104px;aspect-ratio:4/3;overflow:hidden;cursor:pointer;
  border:1px solid transparent;transition:border-color .24s var(--ease),opacity .24s var(--ease);opacity:.72}
.gallery__thumb img{width:100%;height:100%;object-fit:cover}
.gallery__thumb.active,.gallery__thumb:hover{opacity:1;border-color:var(--copper)}
.gallery__thumb--video::after{content:'';position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:28px;height:28px;border-radius:50%;background:rgba(247,244,238,.92)}
.gallery__play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:2;width:0;height:0;
  margin-left:2px;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:8px solid var(--copper)}
.gal__stage{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--sandstone)}
.gal__stage img,.gal__stage video{width:100%;height:100%;object-fit:cover;display:block}
.gal__stage video{object-fit:contain;background:#14100B}
.gal__badge{position:absolute;left:var(--sp-2);bottom:var(--sp-2);z-index:2;display:inline-flex;align-items:center;gap:8px;
  padding:6px 12px 6px 6px;border-radius:999px;background:rgba(247,244,238,.94);font-size:var(--fs-xs);font-weight:500}
.gal__badge i{display:inline-flex;width:20px;height:20px;border-radius:50%;background:var(--copper);position:relative}
.gal__badge i::before{content:'';position:absolute;left:8px;top:6px;width:0;height:0;
  border-top:4px solid transparent;border-bottom:4px solid transparent;border-left:6px solid var(--paper)}
.gal__nav{position:absolute;bottom:var(--sp-2);z-index:2;width:36px;height:36px;border-radius:50%;
  background:rgba(247,244,238,.92);color:var(--graphite);font-size:var(--fs-l);line-height:1;transition:.2s}
.gal__nav:hover{background:var(--paper);color:var(--copper)}
.gal__prev{right:calc(var(--sp-2) + 44px)}
.gal__next{right:var(--sp-2)}

/* ---- покупка ---- */
.pinfo__name{font-family:var(--serif);font-size:var(--fs-5xl);font-weight:500;line-height:1}
.pinfo__price{font-size:var(--fs-3xl);font-weight:600;margin-top:var(--sp-2)}
.pinfo__desc{color:var(--patina);margin-top:var(--sp-3);max-width:42ch;font-size:var(--fs-s)}
.pinfo__desc p + p{margin-top:var(--sp-1)}
.pinfo__specs{list-style:none;display:grid;gap:var(--sp-3);margin-top:var(--sp-5)}
.pinfo__specs li{display:grid;grid-template-columns:34px 1fr;gap:var(--sp-2);align-items:start}
.pinfo__specs svg{color:var(--copper)}
.pinfo__specs b{display:block;font-size:var(--fs-s);font-weight:600}
.pinfo__specs span span{font-size:var(--fs-s);color:var(--patina)}
.pinfo__actions{display:grid;gap:var(--sp-2);margin-top:var(--sp-5)}
.pinfo__actions .btn{width:100%}

/* ---- правая колонка ---- */
.pside{display:grid;gap:var(--sp-3);border:1px solid var(--sandstone);border-radius:4px;padding:var(--sp-3);background:var(--paper)}
.pvideo{position:relative;display:block;width:100%;aspect-ratio:16/10;overflow:hidden;border-radius:2px;background:var(--sandstone)}
.pvideo img{width:100%;height:100%;object-fit:cover}
.pvideo::after{content:'';position:absolute;inset:0;background:rgba(20,15,11,.32)}
.pvideo__play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:2;
  width:52px;height:52px;border-radius:50%;background:rgba(247,244,238,.92);display:block;transition:.2s}
.pvideo__play::before{content:'';position:absolute;left:21px;top:16px;width:0;height:0;
  border-top:10px solid transparent;border-bottom:10px solid transparent;border-left:16px solid var(--copper)}
.pvideo:hover .pvideo__play{transform:translate(-50%,-50%) scale(1.06)}
.pvideo__cap{position:absolute;left:var(--sp-2);bottom:var(--sp-2);z-index:2;color:var(--paper);font-size:var(--fs-s)}
.pspec h2{font-family:var(--serif);font-size:var(--fs-xl);font-weight:500;margin-bottom:var(--sp-2)}
.pspec table{width:100%;border-collapse:collapse;font-size:var(--fs-s)}
.pspec tr{border-bottom:1px solid var(--sandstone)}
.pspec tr:last-child{border-bottom:none}
.pspec th{text-align:left;font-weight:400;color:var(--patina);padding:9px 0}
.pspec td{text-align:right;padding:9px 0}

/* ---- полоса доверия ---- */
.ptrust{display:grid;grid-template-columns:minmax(260px,.9fr) minmax(0,2.2fr) minmax(220px,.75fr);
  gap:var(--sp-3);margin-top:var(--sp-12);align-items:stretch}
.ptrust__card{background:var(--paper);border:1px solid var(--sandstone);border-radius:4px;
  padding:var(--sp-4);display:grid;gap:var(--sp-2);align-content:start}
.ptrust__card svg{color:var(--copper)}
.ptrust__card h2{font-family:var(--serif);font-size:var(--fs-xl);font-weight:500}
.ptrust__card p{font-size:var(--fs-s);color:var(--patina)}
.ptrust__card .btn{justify-self:start;width:auto;padding:12px 18px;font-size:var(--fs-s);gap:var(--sp-2)}
.ptrust__card--place{align-content:center}
.ptrust__steps{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-3);
  padding:var(--sp-4) 0;align-content:center}
.psame{margin-top:var(--sp-12)}

@media(max-width:1279px){
  .prod{grid-template-columns:1fr 1fr}
  .pside{grid-column:1/-1;grid-template-columns:1fr 1fr;align-items:start}
  .ptrust{grid-template-columns:1fr}
  .ptrust__steps{grid-template-columns:1fr 1fr}
}
@media(max-width:767px){
  .prod-page{padding-top:112px}
  .prod{grid-template-columns:1fr;gap:var(--sp-5)}
  .gal{grid-template-columns:1fr}
  .gal__rail{flex-direction:row;max-height:none;overflow-x:auto;order:2}
  .pside{grid-template-columns:1fr}
  .pinfo__name{font-size:var(--fs-3xl)}
  .pinfo__price{font-size:var(--fs-2xl)}
  .ptrust__steps{grid-template-columns:1fr}
  .crumbs{flex-wrap:wrap}
}

/* ---------- ЛУПА (полноэкранный просмотр кадра) ----------
   Разметку создаёт product-page.js, стили жили в старом styles.css —
   после перехода на nardi.css окно открывалось невидимым. */
.lightbox{
  position:fixed;inset:0;z-index:200;display:none;
  align-items:center;justify-content:center;padding:var(--sp-5);
  background:rgba(20,15,11,.94);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
}
.lightbox.open{display:flex}
.lightbox img,.lightbox__video{
  max-width:92vw;max-height:88vh;width:auto;height:auto;object-fit:contain;
  border-radius:2px;box-shadow:0 30px 80px -20px rgba(0,0,0,.8);
}
.lightbox__video{background:#14100B}
.lightbox__close{
  position:absolute;top:18px;right:24px;width:44px;height:44px;line-height:1;
  font-size:2rem;color:var(--sandstone);transition:color .2s;
}
.lightbox__close:hover{color:var(--paper)}
.lightbox__nav{
  position:absolute;top:50%;transform:translateY(-50%);
  width:52px;height:52px;border-radius:50%;font-size:1.9rem;line-height:1;
  display:flex;align-items:center;justify-content:center;
  border:1px solid rgba(247,244,238,.28);background:rgba(20,15,11,.5);color:var(--paper);transition:.2s;
}
.lightbox__nav:hover{border-color:var(--copper);background:rgba(166,75,50,.28)}
.lightbox__prev{left:24px}
.lightbox__next{right:24px}
@media(max-width:767px){
  .lightbox{padding:var(--sp-2)}
  .lightbox__nav{width:44px;height:44px}
  .lightbox__prev{left:10px}
  .lightbox__next{right:10px}
}

/* ---------- ЮРИДИЧЕСКИЕ СТРАНИЦЫ И 404 ----------
   Перенесены со старого styles.css в новую палитру. */
.legal-page{max-width:820px;padding-top:140px;padding-bottom:var(--sp-12)}
.legal__title{font-family:var(--serif);font-size:var(--fs-4xl);font-weight:500;line-height:1.05}
.legal__updated{color:var(--patina);font-size:var(--fs-s);margin:var(--sp-2) 0 var(--sp-5)}
.legal h2{font-family:var(--serif);font-size:var(--fs-2xl);font-weight:500;margin:var(--sp-5) 0 var(--sp-2)}
.legal p{margin-bottom:var(--sp-2);max-width:68ch}
.legal ul{list-style:none;margin:0 0 var(--sp-2)}
.legal ul li{position:relative;padding-left:22px;margin-bottom:8px;max-width:66ch}
.legal ul li::before{content:'';position:absolute;left:4px;top:11px;width:6px;height:6px;border-radius:50%;background:var(--copper)}
.legal a{color:var(--copper);text-decoration:underline;text-underline-offset:2px}
.legal strong{font-weight:600}

.notfound{min-height:70vh;display:flex;flex-direction:column;justify-content:center;padding-top:140px;padding-bottom:var(--sp-12)}
.notfound h1{font-size:var(--fs-5xl);max-width:14ch}
.notfound .lead{margin-top:var(--sp-3)}
.notfound__actions{display:flex;gap:var(--sp-2);flex-wrap:wrap;margin-top:var(--sp-5)}

@media(max-width:767px){
  .legal-page,.notfound{padding-top:112px}
  .legal__title,.notfound h1{font-size:var(--fs-3xl)}
  .notfound__actions .btn{width:100%}
}