/* ============================================================
   MamaRent — Medela. Дизайн-система «тёплая клиника».
   Референсы: Ivory Clinic (тип, воздух) · ReadyRX (тёплые карточки,
   глубокий зелёный) · HealthGuard (сплит-герой, стеклянные карточки)
   · MediPharm (сетка каталога, карточка товара).
   ============================================================ */

/* ---------- 1. Токены ---------- */
:root{
  --paper:#F4F1EA;
  --paper-2:#EFEBE2;
  --card:#FDFCF8;       /* белый с каплей бумаги — чистого #FFF нет */
  --ink:#12161A;
  --ink-2:#3A3F44;
  --muted:#6E6A62;
  --line:#E3DCD0;
  --line-2:#EFEAE0;

  --green:#2F5C80;      /* спокойный синий от логотипа MamaRent (#00ABEA), правка владельца: «синий вместо зелёного» */
  --green-2:#3E6E94;
  --green-soft:#E4EDF4;
  --amber:#FFC709;      /* жёлтый Medela вместо терракоты — след бренда из пака */
  --amber-soft:#FFF5CC;  /* фирменная плашка Medela */
  --blush:#EDE7DC;      /* розовый убран: тёплый нейтраль в тон бумаги */
  --sky-soft:#E4EDF3;
  --danger:#A8412F;

  --r-xs:6px; --r-sm:10px; --r-md:16px; --r-lg:24px; --r-xl:32px;

  /* всё в vw-aware clamp — сайт обязан выглядеть одинаково на 1280 и 1920 */
  --pad:clamp(16px,3.2vw,56px);
  --gap:clamp(12px,1.4vw,24px);
  --sec:clamp(56px,7.4vw,132px);
  --maxw:1560px;

  --t1:clamp(38px,6.6vw,108px);
  --t2:clamp(28px,3.5vw,58px);
  --t3:clamp(20px,2.1vw,34px);
  --t4:clamp(17px,1.35vw,22px);
  --tb:clamp(15px,1.02vw,17px);
  --ts:clamp(13px,0.86vw,14.5px);
  --tx:clamp(10.5px,0.72vw,12px);

  --ease:cubic-bezier(.22,1,.36,1);
  --shadow-s:0 1px 2px rgba(18,22,26,.04),0 6px 18px -12px rgba(18,22,26,.18);
  --shadow-m:0 2px 6px rgba(18,22,26,.05),0 24px 48px -28px rgba(18,22,26,.28);
  --shadow-l:0 40px 90px -40px rgba(18,22,26,.42);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:"Onest","Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,sans-serif;
  font-size:var(--tb);line-height:1.55;font-weight:400;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer;padding:0}
h1,h2,h3,h4,p{margin:0}
ul{margin:0;padding:0;list-style:none}
:focus-visible{outline:2px solid var(--green);outline-offset:3px;border-radius:4px}

.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--pad)}
.sec{padding-block:var(--sec)}
.serif{font-family:"Cormorant Garamond",Georgia,serif;font-style:italic;font-weight:400}
.thin{font-weight:250}
.mono-label{
  font-size:var(--tx);letter-spacing:.18em;text-transform:uppercase;
  font-weight:500;color:var(--muted);
}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- 2. Кнопки ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.6em;
  padding:.92em 1.6em;border-radius:999px;font-size:var(--tb);font-weight:500;
  letter-spacing:-.01em;transition:.4s var(--ease);white-space:nowrap;
  border:1px solid transparent;
}
.btn--ink{background:var(--ink);color:#fff}
.btn--ink:hover{background:var(--green);transform:translateY(-2px);box-shadow:var(--shadow-m)}
.btn--green{background:var(--green);color:#fff}
.btn--green:hover{background:var(--green-2);transform:translateY(-2px);box-shadow:var(--shadow-m)}
.btn--amber{background:var(--amber);color:var(--ink)}
.btn--amber:hover{filter:brightness(.92);transform:translateY(-2px)}
.btn--ghost{border-color:var(--line);background:transparent;color:var(--ink)}
.btn--ghost:hover{border-color:var(--ink);background:#fff}
.btn--white{background:#fff;color:var(--ink);box-shadow:var(--shadow-s)}
.btn--white:hover{transform:translateY(-2px);box-shadow:var(--shadow-m)}
.btn--sm{padding:.6em 1.1em;font-size:var(--ts)}
.btn--wide{width:100%}
.btn[disabled]{opacity:.45;pointer-events:none}
.btn__arrow{
  width:1.65em;height:1.65em;border-radius:50%;display:grid;place-items:center;
  background:rgba(255,255,255,.16);flex:0 0 auto;transition:.4s var(--ease);
}
.btn--ghost .btn__arrow,.btn--white .btn__arrow{background:var(--paper-2)}
.btn:hover .btn__arrow{transform:translateX(3px)}

/* ---------- 3. Шапка ---------- */

.hdr{position:sticky;top:0;z-index:60;background:rgba(244,241,234,.82);backdrop-filter:blur(18px) saturate(1.4);border-bottom:1px solid var(--line-2)}
.hdr__row{display:flex;align-items:center;gap:var(--gap);padding-block:.85rem;max-width:var(--maxw);margin:0 auto;padding-inline:var(--pad)}
.logo{display:flex;align-items:baseline;gap:.5em;flex:0 0 auto;font-weight:600;letter-spacing:-.03em;font-size:clamp(18px,1.45vw,24px)}
.logo__mark{display:inline-block;width:.42em;height:.42em;background:var(--amber);margin-left:.18em;
  border-radius:2px;align-self:center}

.nav{display:flex;gap:clamp(10px,1.25vw,26px);margin-left:clamp(8px,1.6vw,32px);flex-wrap:nowrap}
.nav a{font-size:var(--ts);padding:.45em 0;position:relative;color:var(--ink-2);transition:color .3s}
.nav a::after{content:"";position:absolute;left:0;right:100%;bottom:.1em;height:1px;background:var(--green);transition:right .45s var(--ease)}
.nav a:hover,.nav a.is-on{color:var(--ink)}
.nav a:hover::after,.nav a.is-on::after{right:0}

.hdr__tools{margin-left:auto;display:flex;align-items:center;gap:.5rem}
.iconbtn{width:2.6rem;height:2.6rem;border-radius:999px;display:grid;place-items:center;border:1px solid transparent;transition:.3s var(--ease);position:relative}
.iconbtn:hover{background:#fff;border-color:var(--line);box-shadow:var(--shadow-s)}
.iconbtn svg{width:19px;height:19px;stroke:var(--ink);fill:none;stroke-width:1.5}
.cartbtn{display:inline-flex;align-items:center;gap:.5em;border:1px solid var(--ink);background:var(--ink);
  color:#fff;font:inherit;font-weight:500;font-size:var(--ts);padding:.55em 1em;border-radius:var(--r-xs);cursor:pointer}
.cartbtn:hover{background:var(--green)}
.cartbtn .cart-dot{display:inline-grid;place-items:center;min-width:1.55em;height:1.55em;padding:0 .3em;
  background:var(--amber);color:var(--ink);border-radius:999px;font-size:.82em;font-weight:600;font-style:normal}
.cartbtn .cart-dot.is-on{transform:scale(1)}
.hdr__phone{font-size:var(--ts);font-weight:500;white-space:nowrap;padding-inline:.4rem}
.burger{display:none}

/* поиск */
.searchbar{position:relative;flex:1 1 auto;max-width:min(30vw,380px)}
.searchbar input{
  width:100%;padding:.72em 1em .72em 2.5em;border-radius:999px;border:1px solid var(--line);
  background:#fff;font-size:var(--ts);transition:.3s var(--ease);
}
.searchbar input:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 4px var(--green-soft)}
.searchbar svg{position:absolute;left:.95em;top:50%;transform:translateY(-50%);width:15px;height:15px;stroke:var(--muted);fill:none;stroke-width:1.6}
.suggest{position:absolute;top:calc(100% + 8px);left:0;right:0;background:#fff;border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--shadow-m);overflow:hidden;z-index:80;max-height:60vh;overflow-y:auto}
.suggest a{display:flex;gap:.75rem;align-items:center;padding:.6rem .8rem;border-bottom:1px solid var(--line-2)}
.suggest a:last-child{border:0}
.suggest a:hover{background:var(--paper)}
.suggest img{width:38px;height:38px;object-fit:contain;flex:0 0 auto}
.suggest .s-t{font-size:var(--ts);line-height:1.3}
.suggest .s-p{margin-left:auto;font-weight:600;font-size:var(--ts);white-space:nowrap}

/* ---------- 4. Герой ---------- */
.hero{position:relative;overflow:hidden;padding-top:clamp(24px,3vw,56px)}
#glcanvas{position:absolute;inset:0;width:100%;height:100%;z-index:1;opacity:0;transition:opacity 1.2s ease}
#glcanvas.is-live{opacity:.92}
.hero__fallback{position:absolute;inset:0;z-index:0;background:
  radial-gradient(60% 60% at 18% 22%,rgba(239,220,210,.85),transparent 70%),
  radial-gradient(50% 55% at 82% 12%,rgba(228,237,243,.8),transparent 70%),
  radial-gradient(70% 60% at 60% 95%,rgba(231,238,233,.9),transparent 70%);}
.hero__in{position:relative;z-index:2;display:grid;grid-template-columns:1.06fr .94fr;gap:clamp(20px,3vw,64px);align-items:center;padding-block:clamp(24px,3.4vw,64px) var(--sec)}
.hero h1{font-size:var(--t1);line-height:.96;letter-spacing:-.045em;font-weight:300}
/* маска для строчного въезда: без запаса по вертикали срезает выносные */
.mask{display:block;overflow:hidden;padding-block:.10em .16em;margin-block:-.10em -.16em}
.mask__i{display:block}
.hero h1 b{font-weight:600}
.hero h1 .serif{font-size:1.02em;letter-spacing:-.01em}
.hero__lead{margin-top:clamp(16px,1.6vw,28px);max-width:46ch;color:var(--ink-2);font-size:var(--t4);line-height:1.5}
.hero__cta{display:flex;gap:.7rem;margin-top:clamp(20px,2vw,34px);flex-wrap:wrap}
.hero__strip{display:flex;gap:clamp(14px,2vw,38px);margin-top:clamp(26px,3vw,48px);flex-wrap:wrap;border-top:1px solid var(--line);padding-top:clamp(14px,1.5vw,22px)}
.hero__strip div{min-width:96px}
.hero__strip b{display:block;font-size:clamp(20px,1.9vw,30px);font-weight:600;letter-spacing:-.03em;line-height:1.1}
.hero__strip span{font-size:var(--tx);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}

.hero__media{position:relative}
.hero__photo{border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--shadow-l);aspect-ratio:4/4.35;background:var(--paper-2)}
.hero__photo img{width:100%;height:100%;object-fit:cover;transform:scale(1.06)}
.glass{
  position:absolute;background:var(--card);
  border:1px solid var(--line);border-radius:var(--r-md);padding:1rem 1.15rem;
  box-shadow:0 24px 60px -30px rgba(18,22,26,.5);
}
.hero__price{right:clamp(-8px,-.6vw,0px);bottom:clamp(18px,3vw,44px);min-width:min(64vw,300px)}
.hero__price .mono-label{margin-bottom:.35em}
.hero__price .p{font-size:clamp(26px,2.5vw,40px);font-weight:600;letter-spacing:-.035em;line-height:1}
.hero__price .p small{font-size:.42em;font-weight:400;color:var(--muted);letter-spacing:0}
.hero__price .btn{margin-top:.7rem}
.hero__ragv{left:clamp(-6px,-.5vw,0);top:clamp(16px,2vw,32px);padding:.55rem .8rem;display:flex;align-items:center;gap:.55rem}
.hero__ragv img{height:clamp(26px,2.4vw,38px);width:auto;mix-blend-mode:multiply}
.hero__ragv span{font-size:var(--tx);line-height:1.3;max-width:22ch;color:var(--ink-2)}

/* ---------- 5. Полоса доверия ---------- */
.trust{border-block:1px solid var(--line);background:#fff}
.trust__in{display:grid;grid-template-columns:repeat(4,1fr);max-width:var(--maxw);margin:0 auto}
.trust__i{padding:clamp(18px,2.2vw,34px) clamp(14px,1.6vw,28px);border-left:1px solid var(--line-2)}
.trust__i:first-child{border-left:0}
.trust__i b{display:block;font-size:var(--t4);font-weight:500;letter-spacing:-.02em;margin-bottom:.25em}
.trust__i p{font-size:var(--ts);color:var(--muted);line-height:1.45}

/* ---------- 6. Заголовки секций ---------- */
.sechead{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--gap);margin-bottom:clamp(22px,2.6vw,46px);flex-wrap:wrap}
.sechead h2{font-size:var(--t2);font-weight:300;letter-spacing:-.04em;line-height:1.02;max-width:22ch}
.sechead h2 b{font-weight:600}
.sechead p{color:var(--muted);font-size:var(--ts);max-width:44ch;margin-top:.5em}

/* ---------- 7. Категории ---------- */
.cats{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap)}
.cat{
  position:relative;border-radius:var(--r-lg);overflow:hidden;padding:clamp(16px,1.5vw,26px);
  min-height:clamp(210px,20vw,300px);display:flex;flex-direction:column;justify-content:space-between;
  background:var(--card);border:1px solid var(--line-2);transition:.5s var(--ease);
}
.cat:nth-child(9n+1){background:var(--sky-soft)}
.cat:nth-child(9n+2){background:var(--green-soft)}
.cat:nth-child(9n+3){background:var(--paper-2)}
.cat:nth-child(9n+4){background:var(--amber-soft)}
.cat:nth-child(9n+5){background:var(--blush)}
.cat:nth-child(9n+6){background:var(--sky-soft)}
.cat:nth-child(9n+7){background:var(--paper-2)}
.cat:nth-child(9n+8){background:var(--green-soft)}
.cat:nth-child(9n+9){background:var(--blush)}
.cat:hover{transform:translateY(-5px);box-shadow:var(--shadow-m);border-color:transparent}
/* товар живёт в белом «колодце»: фото Medela белое на белом,
   на цветной плитке оно бы просто исчезло */
.cat__well{
  position:absolute;right:clamp(10px,1vw,18px);bottom:clamp(10px,1vw,18px);
  width:clamp(88px,8.4vw,132px);aspect-ratio:1;background:#fff;border-radius:var(--r-md);
  display:grid;place-items:center;box-shadow:0 12px 28px -18px rgba(18,22,26,.5);
  transition:.55s var(--ease);z-index:1;overflow:hidden;
}
.cat:hover .cat__well{transform:translateY(-4px) rotate(-2deg)}
.cat__well img{width:100%;height:100%;object-fit:contain;padding:10%;transition:.6s var(--ease)}
.cat:hover .cat__well img{transform:scale(1.07)}
.cat__top{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;position:relative;z-index:2}
.cat h3{font-size:var(--t4);font-weight:500;letter-spacing:-.02em;max-width:11ch;line-height:1.15}
.cat p{font-size:var(--ts);color:var(--ink-2);max-width:17ch;position:relative;z-index:2;opacity:.82}
.cat__n{font-size:var(--tx);letter-spacing:.08em;background:rgba(255,255,255,.7);border-radius:999px;padding:.3em .7em;white-space:nowrap;font-weight:500}
.cat__go{width:2rem;height:2rem;border-radius:999px;background:var(--ink);color:#fff;display:grid;place-items:center;position:relative;z-index:2;margin-top:auto;transition:.4s var(--ease)}
.cat:hover .cat__go{background:var(--green);transform:rotate(-45deg)}

/* ---------- 8. Карточка товара в сетке ---------- */
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap)}
.grid--5{grid-template-columns:repeat(5,1fr)}
.pcard{
  background:var(--card);border:1px solid var(--line-2);border-radius:var(--r-md);
  padding:clamp(10px,.85vw,16px);display:flex;flex-direction:column;position:relative;
  transition:.45s var(--ease);
}
.pcard:hover{transform:translateY(-4px);box-shadow:var(--shadow-m);border-color:transparent}
.pcard__ph{position:relative;aspect-ratio:1;border-radius:var(--r-sm);background:#fff;overflow:hidden;margin-bottom:.75rem}
.pcard__ph img{width:100%;height:100%;object-fit:contain;padding:8%;transition:.6s var(--ease)}
.pcard:hover .pcard__ph img{transform:scale(1.06)}
.pcard__badge{position:absolute;top:.5rem;left:.5rem;font-size:var(--tx);background:var(--ink);color:#fff;border-radius:999px;padding:.32em .7em;letter-spacing:.02em;font-weight:500}
.pcard__badge--soft{background:#fff;color:var(--ink);border:1px solid var(--line)}
.pcard__badge--green{background:var(--green)}
.pcard__t{font-size:var(--ts);line-height:1.35;margin-bottom:.35rem;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.pcard__meta{font-size:var(--tx);color:var(--muted);margin-bottom:.6rem}
.pcard__bot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:.5rem}
.pcard__p{font-size:var(--t4);font-weight:600;letter-spacing:-.03em;white-space:nowrap}
.pcard__p small{font-size:.62em;font-weight:400;color:var(--muted)}
.pcard__p--req{font-size:var(--ts);font-weight:500;color:var(--green);letter-spacing:0}
.pcard__add{
  width:2.35rem;height:2.35rem;border-radius:999px;background:var(--ink);color:#fff;
  display:grid;place-items:center;flex:0 0 auto;transition:.35s var(--ease);
}
.pcard__add:hover{background:var(--green);transform:scale(1.09)}
.pcard__add svg{width:16px;height:16px;stroke:#fff;fill:none;stroke-width:1.8}
.pcard__add.is-in{background:var(--green)}

/* ---------- 9. Аренда ---------- */
.rent{background:var(--green);color:#EFF4F0}
.rent .sechead h2,.rent h3{color:#fff}
.rent .sechead p{color:rgba(255,255,255,.62)}
.rentgrid{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--gap)}
.rcard{background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.14);border-radius:var(--r-lg);padding:clamp(14px,1.3vw,22px);display:flex;flex-direction:column;transition:.45s var(--ease)}
.rcard:hover{background:rgba(255,255,255,.1);transform:translateY(-4px)}
.rcard .mono-label{color:rgba(255,255,255,.5)}
.rcard h3{font-size:var(--t4);font-weight:500;letter-spacing:-.02em;margin:.5rem 0 .35rem;line-height:1.15}
.rcard p{font-size:var(--tx);color:rgba(255,255,255,.6);line-height:1.4;margin-bottom:1rem}
.rcard__prices{display:flex;gap:1.1rem;margin-top:auto;padding-top:.9rem;border-top:1px solid rgba(255,255,255,.14)}
.rcard__prices div span{display:block;font-size:var(--tx);color:rgba(255,255,255,.5);letter-spacing:.06em;text-transform:uppercase}
.rcard__prices div b{font-size:clamp(17px,1.5vw,24px);font-weight:600;letter-spacing:-.03em;color:#fff}
.rcard .btn{margin-top:.95rem}
.rentnote{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap);margin-top:clamp(20px,2.4vw,40px)}
.rentnote div{border:1px solid rgba(255,255,255,.14);border-radius:var(--r-md);padding:clamp(13px,1.2vw,20px)}
.rentnote b{display:block;font-size:var(--tb);font-weight:500;color:#fff;margin-bottom:.25em}
.rentnote p{font-size:var(--ts);color:rgba(255,255,255,.62);line-height:1.45}

/* ---------- 10. Полоса-цитата / split-блок ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,72px);align-items:center}
.split--rev .split__txt{order:2}
.split__ph{border-radius:var(--r-xl);overflow:hidden;aspect-ratio:5/4;background:var(--paper-2);box-shadow:var(--shadow-m)}
.split__ph img{width:100%;height:100%;object-fit:cover}
.split h2{font-size:var(--t2);font-weight:300;letter-spacing:-.04em;line-height:1.04;margin-bottom:.5em}
.split h2 b{font-weight:600}
.split p{color:var(--ink-2);max-width:52ch;margin-bottom:1em}
.split ul{display:grid;gap:.55rem;margin-block:1.1rem}
.split li{display:flex;gap:.6rem;font-size:var(--ts);color:var(--ink-2);line-height:1.45}
.split li svg{width:17px;height:17px;flex:0 0 auto;margin-top:.15em;stroke:var(--green);fill:none;stroke-width:1.7}

/* ---------- 11. Тёмные секции ---------- */
.dark{background:var(--ink);color:#EDEAE4}
.dark h2,.dark h3,.dark b{color:#fff}
.dark p{color:rgba(255,255,255,.72)}
.dark .sechead p{color:rgba(255,255,255,.66)}
.dark .split__ph{box-shadow:none}
.dark .split li{color:rgba(255,255,255,.78)}
.dark .split li svg{stroke:#8FD3B4}
.dark .mono-label{color:rgba(255,255,255,.55)}
.dark .table th{color:rgba(255,255,255,.6);border-color:rgba(255,255,255,.2)}
.dark .table td{border-color:rgba(255,255,255,.12)}
.rent .split li,.rent p{color:rgba(255,255,255,.78)}

/* ---------- 12. Страница товара ---------- */
.pdp{display:grid;grid-template-columns:1.08fr .92fr;gap:clamp(20px,3vw,64px);align-items:start}
.pdp__gal{position:sticky;top:calc(1rem + 76px)}
.pdp__main{background:#fff;border:1px solid var(--line-2);border-radius:var(--r-lg);aspect-ratio:1;overflow:hidden;display:grid;place-items:center}
.pdp__main img{width:100%;height:100%;object-fit:contain;padding:6%}
.pdp__thumbs{display:flex;gap:.5rem;margin-top:.6rem;flex-wrap:wrap}
.pdp__thumbs button{width:clamp(56px,5vw,78px);aspect-ratio:1;border:1px solid var(--line);border-radius:var(--r-sm);overflow:hidden;background:#fff;transition:.3s}
.pdp__thumbs button.is-on{border-color:var(--ink)}
.pdp__thumbs img{width:100%;height:100%;object-fit:contain;padding:8%}
.pdp h1{font-size:var(--t3);font-weight:500;letter-spacing:-.035em;line-height:1.12;margin-bottom:.5rem}
.pdp__sku{display:flex;gap:1rem;flex-wrap:wrap;font-size:var(--tx);color:var(--muted);letter-spacing:.05em;text-transform:uppercase;margin-bottom:1.1rem}
.pdp__price{display:flex;align-items:baseline;gap:.8rem;margin-bottom:1rem}
.pdp__price b{font-size:clamp(30px,3vw,52px);font-weight:600;letter-spacing:-.04em;line-height:1}
.pdp__price s{color:var(--muted);font-size:var(--t4)}
.pdp__buy{display:flex;gap:.6rem;flex-wrap:wrap;margin-bottom:1.1rem}
.pdp__qty{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:999px;overflow:hidden;background:#fff}
.pdp__qty button{width:2.6rem;height:2.9rem;display:grid;place-items:center;font-size:18px;transition:.3s}
.pdp__qty button:hover{background:var(--paper)}
.pdp__qty span{min-width:2rem;text-align:center;font-weight:500}
.stock{display:inline-flex;align-items:center;gap:.45em;font-size:var(--ts);color:var(--green);font-weight:500;margin-bottom:1rem}
.stock span{display:inline-flex;align-items:center;gap:.45em}
.stock i{width:7px;height:7px;border-radius:50%;background:var(--green);display:block;box-shadow:0 0 0 3px var(--green-soft);flex:0 0 auto}
.pdp__perks{display:grid;gap:.5rem;border-top:1px solid var(--line);padding-top:1.1rem;margin-top:.4rem}
.pdp__perks li{display:flex;gap:.6rem;font-size:var(--ts);color:var(--ink-2);align-items:flex-start}
.pdp__perks svg{width:16px;height:16px;stroke:var(--green);fill:none;stroke-width:1.7;flex:0 0 auto;margin-top:.16em}
.tabs{display:flex;gap:1.4rem;border-bottom:1px solid var(--line);margin:1.6rem 0 1.1rem}
.tabs button{font-size:var(--ts);padding-bottom:.7rem;color:var(--muted);border-bottom:1.5px solid transparent;transition:.3s}
.tabs button.is-on{color:var(--ink);border-color:var(--ink)}
.tabpane{font-size:var(--ts);color:var(--ink-2);line-height:1.65}
.tabpane dl{display:grid;grid-template-columns:auto 1fr;gap:.5rem 1.2rem}
.tabpane dt{color:var(--muted)}
.tabpane dd{margin:0}

/* ---------- 13. Каталог: фильтры ---------- */
.cat-layout{display:grid;grid-template-columns:clamp(210px,17vw,278px) 1fr;gap:clamp(18px,2.2vw,44px);align-items:start}
.filters{position:sticky;top:calc(1rem + 76px);display:grid;gap:1.3rem}
.fgroup h4{font-size:var(--tx);letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:.7rem;font-weight:500}
.fgroup label{display:flex;align-items:center;gap:.55rem;font-size:var(--ts);padding:.28rem 0;cursor:pointer;color:var(--ink-2);transition:color .25s}
.fgroup label:hover{color:var(--ink)}
.fgroup input{accent-color:var(--green);width:15px;height:15px}
.fgroup label span{margin-left:auto;color:var(--muted);font-size:var(--tx)}
.range{display:flex;gap:.5rem;align-items:center}
.range input{width:100%;padding:.5em .7em;border:1px solid var(--line);border-radius:var(--r-sm);background:#fff;font-size:var(--ts)}
.toolbar{display:flex;align-items:center;gap:var(--gap);margin-bottom:var(--gap);flex-wrap:wrap}
.toolbar .count{font-size:var(--ts);color:var(--muted)}
.toolbar select{margin-left:auto;padding:.55em 2em .55em .9em;border:1px solid var(--line);border-radius:999px;background:#fff url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236E6A62' stroke-width='2'><path d='M6 9l6 6 6-6'/></svg>") no-repeat right .8em center;-webkit-appearance:none;appearance:none;font-size:var(--ts);cursor:pointer}
.chips{display:flex;gap:.4rem;flex-wrap:wrap}
.chip{font-size:var(--ts);border:1px solid var(--line);border-radius:999px;padding:.4em .9em;background:#fff;transition:.3s var(--ease)}
.chip:hover{border-color:var(--ink)}
.chip.is-on{background:var(--ink);color:#fff;border-color:var(--ink)}

/* ---------- 14. Корзина ---------- */
.drawer{position:fixed;inset:0;z-index:100;pointer-events:none}
.drawer__bg{position:absolute;inset:0;background:rgba(18,22,26,.42);opacity:0;transition:opacity .5s var(--ease);backdrop-filter:blur(3px)}
.drawer__panel{
  position:absolute;top:0;right:0;height:100%;width:min(94vw,470px);background:var(--paper);
  transform:translateX(100%);transition:transform .6s var(--ease);display:flex;flex-direction:column;
  box-shadow:var(--shadow-l);
}
.drawer.is-open{pointer-events:auto}
.drawer.is-open .drawer__bg{opacity:1}
.drawer.is-open .drawer__panel{transform:none}
.drawer__hd{display:flex;align-items:center;justify-content:space-between;padding:1.1rem var(--gap);border-bottom:1px solid var(--line)}
.drawer__hd h3{font-size:var(--t4);font-weight:500;letter-spacing:-.02em}
.drawer__body{flex:1;overflow-y:auto;padding:var(--gap)}
.drawer__ft{border-top:1px solid var(--line);padding:var(--gap);background:#fff}
.citem{display:grid;grid-template-columns:66px 1fr auto;gap:.8rem;padding:.75rem 0;border-bottom:1px solid var(--line-2);align-items:center}
.citem img{width:66px;height:66px;object-fit:contain;background:#fff;border-radius:var(--r-sm)}
.citem b{font-size:var(--ts);font-weight:400;line-height:1.35;display:block}
.citem .p{font-weight:600;font-size:var(--ts);margin-top:.2rem;display:block}
.citem .q{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:999px;margin-top:.35rem;background:#fff}
.citem .q button{width:1.8rem;height:1.7rem;display:grid;place-items:center}
.citem .q span{min-width:1.4rem;text-align:center;font-size:var(--ts)}
.citem .x{color:var(--muted);font-size:18px;line-height:1;padding:.3rem}
.citem .x:hover{color:var(--danger)}
.totrow{display:flex;justify-content:space-between;font-size:var(--ts);color:var(--muted);margin-bottom:.4rem}
.totrow.big{font-size:var(--t4);color:var(--ink);font-weight:600;letter-spacing:-.02em;margin-block:.6rem}
.empty{text-align:center;padding:3rem 1rem;color:var(--muted)}
.empty svg{width:52px;height:52px;stroke:var(--line);fill:none;stroke-width:1.2;margin:0 auto 1rem}

/* ---------- 15. Оформление заказа ---------- */
.checkout{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(20px,3vw,56px);align-items:start}
.field{display:grid;gap:.35rem;margin-bottom:.85rem}
.field label{font-size:var(--tx);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.field input,.field textarea,.field select{padding:.85em 1em;border:1px solid var(--line);border-radius:var(--r-sm);background:#fff;font-size:var(--tb);transition:.3s}
.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 4px var(--green-soft)}
.field.row2{grid-template-columns:1fr 1fr;gap:.6rem}
.opt{display:flex;gap:.8rem;align-items:flex-start;border:1px solid var(--line);border-radius:var(--r-md);padding:.9rem 1rem;cursor:pointer;background:#fff;transition:.3s var(--ease);margin-bottom:.5rem}
.opt:hover{border-color:var(--ink-2)}
.opt.is-on{border-color:var(--green);box-shadow:0 0 0 3px var(--green-soft)}
.opt input{margin-top:.25em;accent-color:var(--green)}
.opt b{display:block;font-size:var(--tb);font-weight:500}
.opt p{font-size:var(--tx);color:var(--muted);line-height:1.4}
.opt .pr{margin-left:auto;font-weight:600;white-space:nowrap}
.summary{background:#fff;border:1px solid var(--line-2);border-radius:var(--r-lg);padding:clamp(16px,1.6vw,28px);position:sticky;top:calc(1rem + 76px)}
.step{display:flex;align-items:center;gap:.6rem;margin-bottom:1.1rem}
.step i{width:1.7rem;height:1.7rem;border-radius:999px;background:var(--ink);color:#fff;display:grid;place-items:center;font-size:var(--ts);font-style:normal;font-weight:600;flex:0 0 auto}
.step h3{font-size:var(--t4);font-weight:500;letter-spacing:-.02em}
.demo-note{font-size:var(--tx);color:var(--muted);background:var(--amber-soft);border-radius:var(--r-sm);padding:.7rem .85rem;line-height:1.45;margin-top:.8rem}

/* ---------- 16. Прочее ---------- */
.faq details{border-bottom:1px solid var(--line);padding:clamp(14px,1.3vw,22px) 0}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:1rem;font-size:var(--t4);font-weight:400;letter-spacing:-.02em}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:1.3em;color:var(--muted);transition:transform .4s var(--ease);line-height:1}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq p{margin-top:.8rem;color:var(--ink-2);max-width:78ch;font-size:var(--ts);line-height:1.6}

.hero__facts{border-top:1px solid var(--line);padding-top:1rem;font-size:var(--ts);
  color:var(--muted);max-width:72ch}
.hero__facts b{color:var(--ink-2);font-weight:600}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap)}
.stat{border-top:1px solid var(--line);padding-top:1rem}
.stat b,.stat b span{display:block;font-size:clamp(30px,3.6vw,62px);font-weight:300;letter-spacing:-.05em;line-height:1;color:inherit}
.stat>span{font-size:var(--ts);color:var(--muted);display:block;margin-top:.35em;max-width:24ch;font-weight:400;letter-spacing:0}
.dark .stat{border-color:rgba(255,255,255,.2)}
.dark .stat>span{color:rgba(255,255,255,.58)}

.pickup{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap)}
.pickup div{background:#fff;border:1px solid var(--line-2);border-radius:var(--r-lg);padding:clamp(16px,1.6vw,28px)}
.pickup b{display:block;font-size:var(--t4);font-weight:500;letter-spacing:-.02em;margin-bottom:.3em}
.pickup p{font-size:var(--ts);color:var(--muted)}

.ftr{background:var(--ink);color:rgba(255,255,255,.62);padding-block:clamp(38px,4.4vw,76px) clamp(20px,2vw,34px);font-size:var(--ts)}
.ftr a:hover{color:#fff}
.ftr__top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.3fr;gap:var(--gap);padding-bottom:clamp(24px,2.6vw,44px);border-bottom:1px solid rgba(255,255,255,.14)}
.ftr h4{color:#fff;font-size:var(--ts);font-weight:500;margin-bottom:.9rem;letter-spacing:.02em}
.ftr li{margin-bottom:.45rem}
.ftr__bot{display:flex;justify-content:space-between;gap:var(--gap);padding-top:1.2rem;flex-wrap:wrap;font-size:var(--tx);color:rgba(255,255,255,.42)}
.ftr__pay{margin-top:1rem;background:#fff;border-radius:var(--r-sm);padding:.5rem .7rem;display:inline-block}
.ftr__pay img{height:clamp(22px,2vw,30px);width:auto}
.ftr .logo{color:#fff;margin-bottom:.7rem}

.toast{position:fixed;bottom:calc(1rem + env(safe-area-inset-bottom));left:50%;transform:translate(-50%,140%);background:var(--ink);color:#fff;padding:.85rem 1.3rem;border-radius:999px;font-size:var(--ts);z-index:200;box-shadow:var(--shadow-l);transition:transform .55s var(--ease),opacity .3s;display:flex;gap:.6rem;align-items:center;opacity:0;pointer-events:none}
.toast.is-on{transform:translate(-50%,0);opacity:1}
.toast svg{width:17px;height:17px;stroke:#8FD3B4;fill:none;stroke-width:2}

.crumbs{display:flex;gap:.5rem;font-size:var(--tx);color:var(--muted);margin-bottom:clamp(14px,1.6vw,26px);flex-wrap:wrap;letter-spacing:.04em}
.crumbs a:hover{color:var(--ink)}

.pagehead{padding-top:clamp(20px,2.4vw,44px)}
.pagehead h1{font-size:var(--t2);font-weight:300;letter-spacing:-.045em;line-height:1.02}
.pagehead h1 b{font-weight:600}
.pagehead p{color:var(--muted);max-width:62ch;margin-top:.7em}

.svc{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap)}
.svc article{background:#fff;border:1px solid var(--line-2);border-radius:var(--r-lg);padding:clamp(16px,1.5vw,26px);display:flex;flex-direction:column;transition:.45s var(--ease)}
.svc article:hover{transform:translateY(-4px);box-shadow:var(--shadow-m)}
.svc h3{font-size:var(--t4);font-weight:500;letter-spacing:-.02em;margin:.6rem 0 .4rem}
.svc p{font-size:var(--ts);color:var(--muted);line-height:1.5;margin-bottom:1rem}
.svc .btn{margin-top:auto}
.svc__n{font-family:"Cormorant Garamond",Georgia,serif;font-style:italic;font-size:clamp(30px,2.6vw,44px);color:var(--green);line-height:1}

.table{width:100%;border-collapse:collapse;font-size:var(--ts)}
.table th{text-align:left;font-weight:500;color:var(--muted);font-size:var(--tx);letter-spacing:.12em;text-transform:uppercase;padding:.7rem .8rem;border-bottom:1px solid var(--line)}
.table td{padding:.85rem .8rem;border-bottom:1px solid var(--line-2);vertical-align:top}
.table tr:hover td{background:#fff}
.table .num{font-weight:600;white-space:nowrap;text-align:right}

.notice{border-left:2px solid var(--amber);padding-left:1rem;color:var(--ink-2);font-size:var(--ts);line-height:1.6;max-width:70ch}

/* ---------- 17. Адаптив ---------- */
@media(max-width:1180px){
  .cats,.grid,.trust__in,.stats,.svc{grid-template-columns:repeat(3,1fr)}
  .grid--5,.rentgrid{grid-template-columns:repeat(3,1fr)}
  .searchbar{max-width:34vw}
  .nav{display:none}
}
@media(max-width:900px){
  .hdr__row{flex-wrap:wrap;row-gap:.6rem}
  .searchbar{order:9;flex:1 1 100%;max-width:100%}
  .hero__in,.split,.pdp,.checkout,.cat-layout{grid-template-columns:1fr}
  .split--rev .split__txt{order:0}
  .hero__media{max-width:560px;margin-inline:auto;width:100%}
  .pdp__gal,.filters,.summary{position:static}
  .cats,.grid,.svc,.rentgrid,.grid--5{grid-template-columns:repeat(2,1fr)}
  .trust__in,.stats,.rentnote,.pickup,.ftr__top{grid-template-columns:repeat(2,1fr)}
  .trust__i:nth-child(3){border-left:0}
  .trust__i{border-top:1px solid var(--line-2)}
  .burger{display:grid}
  .searchbar{order:9;max-width:100%;flex-basis:100%}
  .hdr__phone{display:none}
  .filters{display:none}
  .filters.is-open{display:grid;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:1rem}
}
@media(max-width:640px){
  .logo{font-size:17px}
  .logo small{display:none}
  .hero__in{padding-block:clamp(14px,3vw,28px) clamp(36px,9vw,64px)}
  .hero__photo{aspect-ratio:4/3.6}
  .hero__strip div{min-width:70px}
}
@media(max-width:560px){
  .cats,.grid,.svc,.rentgrid,.grid--5,.trust__in,.stats,.rentnote,.pickup,.ftr__top{grid-template-columns:1fr}
  .hero__price{position:static;margin-top:.8rem;width:100%}
  .hero__ragv{position:static;margin-bottom:.8rem;display:inline-flex}
  .field.row2{grid-template-columns:1fr}
  .stats{gap:1.2rem}
}
@media(prefers-reduced-motion:reduce){
  *{animation-duration:.01ms !important;transition-duration:.01ms !important;scroll-behavior:auto !important}
  #glcanvas{display:none}
}