/* ══════════════════════════════════════════════════════════
   Ômi — дизайн-система сайта
   Палитра и типографика — из дизайна Ômi (Claude Design)
   ══════════════════════════════════════════════════════════ */

/* ─── локальный запасной шрифт ─────────────────────────── */
@font-face{ font-family:'RalewayLocal'; src:url('../fonts/Raleway-Regular.woff2') format('woff2'); font-weight:400; font-display:swap; }
@font-face{ font-family:'RalewayLocal'; src:url('../fonts/Raleway-Medium.woff2') format('woff2'); font-weight:500; font-display:swap; }
@font-face{ font-family:'RalewayLocal'; src:url('../fonts/Raleway-SemiBold.woff2') format('woff2'); font-weight:600; font-display:swap; }
@font-face{ font-family:'RalewayLocal'; src:url('../fonts/Raleway-Bold.woff2') format('woff2'); font-weight:700; font-display:swap; }

:root{
  --cd:'Clash Display','RalewayLocal','Inter',sans-serif;
  --cg:'Cabinet Grotesk','RalewayLocal','Inter',sans-serif;
  --green:#CBD89F;
  --green-soft:#D8DEC2;
  --lime:#E7E2C8;
  --gold:#C9A24B;
  --brown:#5A5236;
  --dark:#1A1E11;
  --dark-2:#2A301B;
  --cream:#F2EFE3;
  --cream-2:#E7E2CE;
  --ink:#15170E;
  --line:#DBD6C4;
  --wa:#25D366;
  --kaspi:#F14635;
  --err:#B2452F;
  --tint:#4d5a2b;
  --ease-soft:cubic-bezier(.32,.72,0,1);
  --ease-out:cubic-bezier(.22,1,.36,1);
  --ease-snap:cubic-bezier(.4,0,.2,1);
}

*{ box-sizing:border-box; margin:0; padding:0; }
[hidden]{ display:none!important; }
html{ scroll-behavior:smooth; }
body{ background:var(--cream); color:var(--ink); font-family:var(--cg); overflow-x:hidden; -webkit-font-smoothing:antialiased; }
body.no-scroll{ overflow:hidden; }
a{ color:inherit; text-decoration:none; }
img{ display:block; max-width:100%; }
button,input,select,textarea{ font:inherit; color:inherit; }
:focus-visible{ outline:2px solid var(--brown); outline-offset:3px; }

.wrap{ max-width:1480px; margin:0 auto; padding:0 40px; }
@media(max-width:720px){ .wrap{ padding:0 22px; } }

/* ══════ ТИПОГРАФИКА / УТИЛИТЫ ═════════════════════════ */
.eyebrow{ font-family:var(--cg); font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--brown); }
.kpill{ display:inline-block; background:var(--ink); color:#fff; border-radius:999px;
  padding:8px 18px; font-family:var(--cd); font-weight:500; font-size:12px; letter-spacing:.12em; text-transform:uppercase; }
.kpill.on-dark{ background:var(--green); color:var(--ink); }
.chip{ display:inline-block; border:1px solid var(--line); border-radius:999px; padding:6px 14px;
  font-size:13px; letter-spacing:.02em; color:var(--brown); margin:0 6px 6px 0; }

/* ─── кнопки ───────────────────────────────────────────── */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:10px; cursor:pointer;
  border:1px solid transparent; border-radius:999px; padding:15px 30px; font-family:var(--cd); font-weight:500;
  font-size:14px; letter-spacing:.04em; text-transform:uppercase; transition:transform 240ms var(--ease-snap),background 240ms,color 240ms,border-color 240ms; }
.btn:hover{ transform:translateY(-2px); }
.btn:active{ transform:translateY(0); }
.btn-dark{ background:var(--ink); color:var(--cream); }
.btn-dark:hover{ background:#000; }
.btn-light{ background:var(--lime); color:var(--ink); }
.btn-ghost{ background:transparent; color:var(--ink); border-color:var(--ink); }
.btn-ghost:hover{ background:var(--ink); color:var(--cream); }
.btn-ghost.on-dark{ color:#fff; border-color:rgba(242,239,227,.6); background:rgba(20,26,10,.3); backdrop-filter:blur(8px); }
.btn-ghost.on-dark:hover{ background:var(--green); color:var(--ink); border-color:var(--green); }
.btn-wa{ background:var(--wa); color:#04310f; }
.btn-full{ width:100%; }
.btn[disabled]{ opacity:.45; pointer-events:none; }
.btn-link{ background:none; border:0; cursor:pointer; font-family:var(--cg); font-size:13px;
  letter-spacing:.06em; text-transform:uppercase; color:var(--brown); text-decoration:underline; text-underline-offset:4px; }
.btn-link:hover{ color:var(--ink); }

/* ══════ ШАПКА ═════════════════════════════════════════ */
.hdr{ position:fixed; inset:16px 0 auto; z-index:60; padding:0 clamp(14px,3.2vw,44px); pointer-events:none; }
.hdr-in{ pointer-events:auto; max-width:1480px; margin:0 auto; display:flex; align-items:center; gap:18px;
  background:var(--lime); color:var(--ink); border-radius:12px; padding:11px 12px 11px 18px;
  transition:box-shadow 300ms var(--ease-out), background 300ms; }
.hdr.stuck .hdr-in{ box-shadow:0 10px 34px rgba(20,24,10,.16); background:#EFEBD6; }
.hdr-brand{ font-family:var(--cd); font-weight:600; font-size:19px; letter-spacing:.01em; }
.hdr-nav{ display:flex; align-items:center; gap:clamp(14px,1.8vw,30px); margin-left:auto; }
.hdr-nav a{ font-family:var(--cg); font-size:14px; letter-spacing:.02em; color:var(--ink); opacity:.78;
  padding:6px 0; border-bottom:1px solid transparent; transition:opacity 200ms,border-color 200ms; }
.hdr-nav a:hover{ opacity:1; }
.hdr-nav a.on{ opacity:1; border-color:var(--ink); }
.hdr-act{ display:flex; align-items:center; gap:8px; }

.lang{ position:relative; }
.lang-btn{ display:inline-flex; align-items:center; gap:6px; background:transparent; border:1px solid rgba(21,23,14,.22);
  border-radius:999px; padding:8px 12px; font-size:12px; letter-spacing:.08em; cursor:pointer; }
.lang-btn .chev{ width:0; height:0; border:4px solid transparent; border-top-color:var(--ink); margin-top:3px; }
.lang-menu{ position:absolute; top:calc(100% + 8px); right:0; background:#fff; border-radius:10px; padding:6px;
  box-shadow:0 14px 34px rgba(20,24,10,.18); display:none; min-width:86px; }
.lang.open .lang-menu{ display:block; }
.lang-menu button{ display:block; width:100%; text-align:left; background:none; border:0; cursor:pointer;
  padding:8px 12px; border-radius:7px; font-size:13px; letter-spacing:.06em; }
.lang-menu button:hover{ background:var(--cream-2); }
.lang-menu button.on{ background:var(--ink); color:#fff; }

.cart-toggle{ position:relative; display:inline-flex; align-items:center; justify-content:center;
  width:40px; height:40px; background:var(--ink); color:var(--lime); border:0; border-radius:999px; cursor:pointer;
  transition:transform 240ms var(--ease-snap); }
.cart-toggle:hover{ transform:translateY(-2px); }
.cart-toggle svg{ width:19px; height:19px; }
.cart-toggle .badge{ position:absolute; top:-4px; right:-4px; min-width:19px; height:19px; padding:0 5px;
  display:none; align-items:center; justify-content:center; background:var(--gold); color:#fff;
  border-radius:999px; font-size:11px; font-weight:700; font-family:var(--cg); }
.cart-toggle .badge.on{ display:inline-flex; }

.burger{ display:none; flex-direction:column; gap:4px; width:40px; height:40px; align-items:center; justify-content:center;
  background:transparent; border:1px solid rgba(21,23,14,.22); border-radius:999px; cursor:pointer; }
.burger i{ display:block; width:17px; height:1.6px; background:var(--ink); transition:transform 260ms var(--ease-snap), opacity 200ms; }
.burger.open i:nth-child(1){ transform:translateY(5.6px) rotate(45deg); }
.burger.open i:nth-child(2){ opacity:0; }
.burger.open i:nth-child(3){ transform:translateY(-5.6px) rotate(-45deg); }

@media(max-width:900px){
  .burger{ display:flex; }
  .hdr-nav{ position:absolute; top:calc(100% + 8px); left:0; right:0; flex-direction:column; align-items:stretch;
    gap:0; background:var(--lime); border-radius:12px; padding:8px; box-shadow:0 14px 34px rgba(20,24,10,.18); display:none; }
  .hdr-nav.open{ display:flex; }
  .hdr-nav a{ padding:14px 12px; border-bottom:1px solid rgba(21,23,14,.08); opacity:1; font-size:15px; }
  .hdr-nav a:last-child{ border-bottom:0; }
  .hdr-in{ position:relative; }
}

/* отступ под фиксированной шапкой на внутренних страницах */
.page{ padding-top:clamp(96px,11vw,132px); }

/* ══════ HERO ══════════════════════════════════════════ */
.hero{ position:relative; height:100svh; min-height:640px; overflow:hidden; color:#fff; }
.hero-bg{ position:absolute; inset:0; overflow:hidden; }
.hero-bg .photo{ width:100%; height:100%; object-fit:cover; object-position:60% 40%;
  filter:grayscale(1) contrast(1.08) brightness(.92); transform:scale(1.06); animation:heroZoom 18s var(--ease-out) forwards; }
@keyframes heroZoom{ to{ transform:scale(1); } }
.hero-bg .tint{ position:absolute; inset:0; background:var(--tint); mix-blend-mode:color; }
.hero-bg .tint2{ position:absolute; inset:0; background:linear-gradient(180deg,#7d8f3e,#222b10); mix-blend-mode:overlay; opacity:.55; }
.hero-bg .dots{ position:absolute; inset:-2px; background-image:radial-gradient(circle,rgba(10,16,4,.62) .9px,transparent 1.5px); background-size:4px 4px; mix-blend-mode:multiply; opacity:.6; }
.hero-bg .shade{ position:absolute; inset:0; background:linear-gradient(180deg,rgba(24,30,12,.55) 0%,rgba(24,30,12,.18) 32%,rgba(20,26,10,.3) 60%,rgba(16,22,8,.78) 100%); }
.hero-in{ position:relative; height:100%; z-index:2; }

.paradis{ position:absolute; top:clamp(15%,17vh,19%); right:clamp(22px,3.2vw,48px);
  font-family:var(--cd); font-weight:400; font-size:clamp(30px,4.4vw,76px); letter-spacing:.01em; line-height:.95;
  text-align:right; text-transform:uppercase; color:var(--green); }
.paradis > span{ display:inline-block; overflow:hidden; padding:.06em .05em .12em; margin:-.06em -.05em -.12em; }
.paradis > span > b{ display:inline-block; font-weight:500; }

.hero-rule{ position:absolute; left:0; right:0; top:clamp(42%,46vh,47%); padding:0 clamp(22px,3.2vw,48px); }
.hero-rule .row{ display:flex; justify-content:space-between; align-items:flex-end; padding-bottom:12px; border-bottom:1px solid rgba(255,255,255,.45); }
.hero-rule .lab{ font-family:var(--cg); font-size:13px; font-weight:500; letter-spacing:.02em; color:#fff; }
.hero-rule .lab.c{ flex:1; text-align:center; }
.hero-rule .lab.r{ text-align:right; }
@media(max-width:560px){ .hero-rule .lab{ font-size:11px; } }

.hero-cta{ position:absolute; left:0; right:0; top:calc(clamp(42%,46vh,47%) + 46px); padding:0 clamp(22px,3.2vw,48px);
  display:flex; gap:12px; flex-wrap:wrap; }

.hero-word{ position:absolute; left:0; right:0; bottom:clamp(14px,2.2vw,30px); padding:0 clamp(18px,2.6vw,40px); }
.hero-word .big{ font-family:var(--cd); font-weight:600; font-size:clamp(50px,13.6vw,220px); letter-spacing:-.02em; line-height:.82; color:#fff; white-space:nowrap; display:block; text-align:center; }
.hero-word .mask{ display:block; overflow:hidden; padding:.12em 0 .08em; margin:-.12em 0 -.08em; }
.hero-word .mask > span{ display:inline-block; }
@keyframes maskUp{ from{ transform:translateY(130%); } to{ transform:translateY(0); } }
@keyframes dropIn{ from{ opacity:0; transform:translateY(-12px); } to{ opacity:1; transform:none; } }

.scrollcue{ position:absolute; left:50%; bottom:10px; transform:translateX(-50%); font-family:var(--cg); font-size:11px;
  letter-spacing:.12em; color:rgba(255,255,255,.7); text-transform:uppercase; display:flex; gap:8px; align-items:center; z-index:3; }

.hero.play .paradis > span > b{ animation:maskUp 1000ms var(--ease-soft) 300ms backwards; }
.hero.play .hero-word .mask > span{ animation:maskUp 1100ms var(--ease-soft) 200ms backwards; }
.hero.play .scrollcue{ animation:dropIn 900ms var(--ease-out) 900ms backwards; }
.hero.play .hero-cta{ animation:dropIn 900ms var(--ease-out) 700ms backwards; }

/* ══════ БЕГУЩАЯ СТРОКА ════════════════════════════════ */
.ticker{ background:var(--green); color:var(--ink); overflow:hidden; padding:18px 0; }
.ticker-track{ display:flex; width:max-content; animation:scroll 24s linear infinite; }
.ticker:hover .ticker-track{ animation-play-state:paused; }
.tk-block{ display:flex; }
.ticker .item{ display:inline-flex; align-items:center; gap:46px; padding-right:46px; font-family:var(--cd); font-weight:500;
  font-size:clamp(15px,1.5vw,20px); text-transform:uppercase; letter-spacing:.04em; white-space:nowrap; }
@keyframes scroll{ to{ transform:translateX(-50%); } }

/* ══════ ИНТРО ═════════════════════════════════════════ */
.intro{ background:var(--cream); padding:clamp(72px,10vw,150px) 0; }
.intro-head{ text-align:center; max-width:1000px; margin:0 auto clamp(48px,7vw,96px); }
.intro-head h2{ font-family:var(--cd); font-weight:500; font-size:clamp(28px,4.6vw,64px); letter-spacing:-.01em; line-height:1.02; text-transform:uppercase; }
.intro-head p{ font-family:var(--cg); font-size:clamp(16px,1.6vw,20px); color:#333; margin-top:18px; }
.books{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(20px,4vw,64px); max-width:1120px; margin:0 auto; }
@media(max-width:760px){ .books{ grid-template-columns:1fr; gap:40px; } }
.book{ perspective:1400px; }
.book-inner{ position:relative; aspect-ratio:4/5; transform-style:preserve-3d; }
.book-paper{ position:absolute; inset:0; border-radius:6px; background:linear-gradient(239deg,#fff,#e0e0e0);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; text-align:center; padding:24px; }
.book-paper .lbl{ font-family:var(--cd); font-weight:600; font-size:clamp(15px,1.4vw,19px); text-transform:uppercase; letter-spacing:.06em; }
.book-paper .desc{ font-family:var(--cg); font-style:italic; font-size:14px; color:#555; opacity:.6; }
.book-cover{ position:absolute; inset:0; border-radius:6px; overflow:hidden; transform-origin:left center;
  transition:transform 900ms var(--ease-soft); box-shadow:0 18px 40px rgba(0,0,0,.16); }
.book:hover .book-cover{ transform:rotateY(-32deg); }
.book-cover img{ width:100%; height:100%; object-fit:cover; }
.book-cover .lights{ position:absolute; inset:0; background:linear-gradient(90deg,rgba(72,63,54,.5) 0%,rgba(255,255,255,.9) 24%,rgba(72,63,54,.4) 40%,rgba(255,255,255,.7) 48%,rgba(255,255,255,0) 100%); opacity:.2; mix-blend-mode:screen; }
.book-cap{ display:flex; flex-direction:column; align-items:center; gap:4px; margin-top:18px; text-align:center; }
.book-cap .lbl{ font-family:var(--cd); font-weight:600; font-size:14px; text-transform:uppercase; letter-spacing:.08em; }
.book-cap .desc{ font-family:var(--cg); font-style:italic; font-size:14px; color:#666; }
.intro-bottom{ display:flex; align-items:center; justify-content:center; gap:clamp(20px,4vw,56px); margin-top:clamp(48px,7vw,90px); }
.intro-bottom p{ font-family:var(--cg); font-size:clamp(16px,1.6vw,20px); color:#333; white-space:nowrap; }
.intro-bottom .divider{ width:clamp(80px,16vw,260px); height:1px; background:#cdc8bb; }

/* ══════ КАТАЛОГ / КАРТОЧКИ ════════════════════════════ */
.featured{ background:var(--cream); padding:clamp(72px,10vw,150px) 0 clamp(60px,8vw,110px); }
.feat-head{ display:flex; align-items:baseline; justify-content:space-between; gap:20px; margin-bottom:clamp(28px,4vw,48px); flex-wrap:wrap; }
.feat-title{ font-family:var(--cd); font-weight:600; font-size:clamp(20px,2vw,28px); color:var(--brown); text-transform:uppercase; letter-spacing:.02em; }
.feat-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(16px,2vw,28px); }
.feat-grid[data-related]{ grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); }
@media(max-width:860px){ .feat-grid{ grid-template-columns:1fr; gap:36px; } }

.prod{ display:block; }
.prod-img{ position:relative; border-radius:8px; overflow:hidden; aspect-ratio:3/2; background:var(--cream-2); }
.prod-img img{ width:100%; height:100%; object-fit:cover; transition:transform 1200ms var(--ease-soft); }
.prod:hover .prod-img img{ transform:scale(1.04); }
.prod-badge{ position:absolute; top:14px; left:14px; background:#fff; color:var(--ink); border-radius:999px; padding:6px 12px;
  font-family:var(--cd); font-weight:600; font-size:13px; letter-spacing:.02em; }
.prod-badge.gold{ background:var(--gold); color:#fff; }
.prod-meta{ display:flex; justify-content:space-between; align-items:baseline; gap:14px; margin-top:16px; }
.prod-meta .nm{ font-family:var(--cg); font-size:clamp(16px,1.5vw,19px); color:var(--ink); }
.prod-meta .pr{ font-family:var(--cg); font-size:clamp(16px,1.5vw,19px); color:var(--ink); white-space:nowrap; }

/* карточка каталога с покупкой */
.card{ display:flex; flex-direction:column; background:transparent; }
.card .prod-img{ aspect-ratio:4/5; }
.card-body{ display:flex; flex-direction:column; flex:1; padding-top:18px; }
.card-tag{ font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--brown); }
.card-name{ font-family:var(--cd); font-weight:500; font-size:clamp(20px,2.1vw,26px); letter-spacing:-.01em; margin-top:8px; }
.card-name a:hover{ text-decoration:underline; text-underline-offset:4px; }
.card-desc{ font-size:15px; line-height:1.5; color:#4a4a3d; margin-top:10px; }
.card-actives{ margin-top:14px; }
.card-foot{ display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; margin-top:auto; padding-top:18px; }
.card-price{ font-family:var(--cd); font-weight:600; font-size:clamp(19px,2vw,24px); }
.card-price small{ display:block; font-family:var(--cg); font-weight:400; font-size:12px; color:var(--brown); letter-spacing:.06em; }
.card-btns{ display:flex; gap:8px; }
.card .btn{ padding:13px 22px; font-size:13px; }
@media(max-width:1100px){
  .card-foot{ flex-direction:column; align-items:stretch; }
  .card-btns{ width:100%; }
  .card-btns .btn{ flex:1; padding:13px 14px; }
}

/* набор */
.set{ margin-top:clamp(40px,6vw,72px); display:grid; grid-template-columns:1.1fr 1fr; gap:clamp(20px,4vw,56px);
  align-items:center; background:var(--dark); color:var(--green); border-radius:10px; padding:clamp(26px,4vw,54px); }
@media(max-width:860px){ .set{ grid-template-columns:1fr; } }
.set h3{ font-family:var(--cd); font-weight:500; font-size:clamp(26px,3.4vw,44px); letter-spacing:-.01em; }
.set p{ margin-top:14px; color:var(--green-soft); font-size:16px; line-height:1.55; max-width:44ch; }
.set-foot{ display:flex; align-items:center; gap:20px; flex-wrap:wrap; margin-top:26px; }
.set-price{ font-family:var(--cd); font-weight:600; font-size:clamp(22px,2.4vw,30px); }
.set-imgs{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.set-imgs img{ width:100%; aspect-ratio:3/4; object-fit:cover; border-radius:6px; }

/* ══════ РИТУАЛ УХОДА ══════════════════════════════════ */
.feat-sub{ font-family:var(--cg); font-size:14px; letter-spacing:.02em; color:var(--brown); }
.ritual{ background:var(--cream); padding:0 0 clamp(60px,8vw,110px); }
.rsteps{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(16px,2vw,28px); }
@media(max-width:860px){ .rsteps{ grid-template-columns:1fr; gap:28px; } }
.rstep-img{ position:relative; border-radius:8px; overflow:hidden; aspect-ratio:1; background:var(--cream-2); }
.rstep-img img{ width:100%; height:100%; object-fit:cover; transition:transform 1200ms var(--ease-soft); }
.rstep:hover .rstep-img img{ transform:scale(1.04); }
.rstep-n{ position:absolute; top:14px; left:14px; background:var(--ink); color:var(--lime); border-radius:999px;
  padding:6px 13px; font-family:var(--cd); font-weight:600; font-size:12px; letter-spacing:.1em; }
.rstep figcaption{ display:block; margin-top:16px; }
.rstep figcaption b{ display:block; font-family:var(--cd); font-weight:500; font-size:clamp(17px,1.7vw,21px); letter-spacing:-.01em; }
.rstep figcaption span{ display:block; margin-top:8px; font-size:15px; line-height:1.55; color:#4a4a3d; max-width:38ch; }

/* ══════ ГАЛЕРЕЯ ═══════════════════════════════════════ */
.gallery{ background:var(--dark); color:var(--green); padding:clamp(28px,3.2vw,44px) 0 0; }
.gallery .wrap{ max-width:1240px; }
.gal-head{ display:flex; align-items:flex-end; gap:clamp(18px,2.6vw,40px); margin-bottom:clamp(10px,1.2vw,16px); flex-wrap:wrap; }
.gal-head .lead{ font-family:var(--cd); font-weight:500; font-size:clamp(18px,1.9vw,26px); line-height:1.22;
  color:var(--green-soft); max-width:42ch; padding-bottom:10px; }
.gal-rule{ flex:1 1 40px; min-width:40px; height:1px; background:rgba(203,216,159,.28); margin-bottom:28px; }
.gal-head .eleg{ display:flex; align-items:baseline; gap:18px; }
@media(max-width:760px){
  .gal-rule{ display:none; }
  .gal-head{ gap:14px; }
  .gal-head .lead{ padding-bottom:0; }
}
.gal-head .eleg h3{ font-family:var(--cd); font-weight:500; font-style:italic; font-size:clamp(38px,6.2vw,88px); letter-spacing:-.02em; color:var(--green); line-height:1.06; }
.gal-head .eleg .num{ font-family:var(--cg); font-size:14px; color:var(--green); }
/* плотная мозаика 4×4 — единое полотно, без зазоров и пустых ячеек */
.gal-grid{ display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:clamp(88px,8.8vw,138px);
  gap:0; border-radius:8px; overflow:hidden; }
.gal-grid figure{ overflow:hidden; position:relative; }
.gal-grid figure img{ width:100%; height:100%; object-fit:cover; }
.g-a{ grid-column:1/3; grid-row:1/3; }
.g-b{ grid-column:3;   grid-row:1; }
.g-c{ grid-column:4;   grid-row:1; }
.g-d{ grid-column:3/5; grid-row:2; }
.g-e{ grid-column:1;   grid-row:3; }
.g-f{ grid-column:2;   grid-row:3/5; }
.g-g{ grid-column:3/5; grid-row:3/5; }
.g-h{ grid-column:1;   grid-row:4; }
@media(max-width:760px){
  /* на мобильном — ровная сетка 2×4 без пустых ячеек */
  .gal-grid{ grid-template-columns:repeat(2,1fr); grid-auto-rows:38vw; }
  .gal-grid figure{ grid-column:auto!important; grid-row:auto!important; }
}

/* ══════ WORD-STACK ════════════════════════════════════ */
.forming{ background:var(--dark); color:var(--green); padding:clamp(14px,1.6vw,24px) 0 0; position:relative; overflow:hidden; }
.forming .wrap{ max-width:1240px; }
.form-stack{ display:flex; flex-direction:column; gap:clamp(2px,.4vw,6px); }
.form-row{ display:flex; justify-content:flex-end; align-items:baseline; gap:clamp(16px,2.6vw,48px); flex-wrap:wrap; }
.form-row .w{ font-family:var(--cd); font-weight:500; font-size:clamp(34px,7.4vw,132px); letter-spacing:-.03em; line-height:1.08; color:var(--green); white-space:nowrap; }
.form-row .w.it{ font-style:italic; }
.ticker-strip{ margin-top:clamp(18px,2.4vw,36px); overflow:hidden; }
.strip-track{ display:flex; width:max-content; animation:scroll 30s linear infinite; }
.strip-track img{ height:clamp(70px,9vw,150px); width:auto; display:block; }

/* ══════ СОСТАВ / СПИСКИ ═══════════════════════════════ */
.brands{ background:var(--cream); padding:clamp(40px,6vw,90px) 0 clamp(76px,10vw,150px); }
.brands-title{ font-family:var(--cd); font-weight:600; font-size:clamp(20px,2vw,28px); color:var(--brown); text-transform:uppercase; letter-spacing:.02em; margin-bottom:8px; }
.brand-row{ display:flex; align-items:center; justify-content:space-between; gap:20px; padding:clamp(18px,2.4vw,30px) 0;
  border-top:1px solid var(--cream-2); transition:padding-left var(--ease-soft) 380ms; }
.brands .brand-row:last-child{ border-bottom:1px solid var(--cream-2); }
.brand-row:hover{ padding-left:12px; }
.brand-row .nm{ font-family:var(--cd); font-weight:500; font-size:clamp(26px,4vw,54px); letter-spacing:-.02em; color:var(--ink); }
.brand-row .det{ display:flex; align-items:baseline; gap:clamp(20px,5vw,90px); font-family:var(--cg); font-size:clamp(13px,1.3vw,16px); color:var(--brown); }
@media(max-width:620px){ .brand-row .det{ gap:18px; } .brand-row .det .type{ display:none; } }

/* ══════ ФУТЕР ═════════════════════════════════════════ */
.foot{ background:var(--dark); color:var(--green-soft); padding:clamp(56px,8vw,100px) 0 0; overflow:hidden; }
.foot-top{ display:grid; grid-template-columns:1.4fr 1fr; gap:48px; padding-bottom:clamp(44px,7vw,84px); border-bottom:1px solid var(--dark-2); }
@media(max-width:860px){ .foot-top{ grid-template-columns:1fr; gap:36px; } }
.foot-statement{ font-family:var(--cd); font-weight:500; font-size:clamp(20px,2.6vw,32px); line-height:1.25; letter-spacing:-.01em; max-width:24ch; color:var(--green); }
.foot-cols{ display:grid; grid-template-columns:1fr 1fr; gap:30px; align-content:start; }
.foot-col .k{ font-family:var(--cg); font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:rgba(215,226,193,.5); margin-bottom:9px; }
.foot-col .v{ font-family:var(--cg); font-size:15px; color:rgba(215,226,193,.92); line-height:1.5; }
.foot-col .v a{ color:rgba(215,226,193,.92); border-bottom:1px solid rgba(215,226,193,.3); padding-bottom:2px; transition:border-color 220ms; }
.foot-col .v a:hover{ border-color:var(--green); }
.foot-mid{ display:flex; justify-content:space-between; align-items:center; gap:18px; flex-wrap:wrap; padding:22px 0; border-bottom:1px solid var(--dark-2); }
.foot-mid .links{ display:flex; gap:26px; flex-wrap:wrap; }
.foot-mid a, .foot-mid span{ font-family:var(--cg); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:rgba(215,226,193,.6); }
.foot-mid a:hover{ color:var(--green); }
.foot-word{ font-family:var(--cd); font-weight:600; letter-spacing:-.02em; color:var(--green); font-size:clamp(58px,17vw,250px); line-height:.9; text-align:center; padding:clamp(28px,4vw,56px) 0 clamp(10px,2vw,26px); white-space:nowrap; }

/* ══════ ПЛАВАЮЩИЙ WHATSAPP ════════════════════════════ */
.wa-float{ position:fixed; right:20px; bottom:20px; z-index:55; width:52px; height:52px; border-radius:50%;
  background:var(--wa); color:#fff; display:flex; align-items:center; justify-content:center;
  box-shadow:0 12px 28px rgba(11,60,25,.28); transition:transform 240ms var(--ease-snap); }
.wa-float:hover{ transform:scale(1.07); }
.wa-float svg{ width:26px; height:26px; }
@media(max-width:720px){ .wa-float{ right:14px; bottom:14px; width:48px; height:48px; } }

/* ══════ ШАПКИ ВНУТРЕННИХ СТРАНИЦ ══════════════════════ */
.phead{ padding:clamp(24px,4vw,56px) 0 clamp(32px,5vw,64px); border-bottom:1px solid var(--line); }
.phead h1{ font-family:var(--cd); font-weight:500; font-size:clamp(34px,6vw,86px); line-height:1; letter-spacing:-.02em; text-transform:uppercase; margin-top:14px; }
.phead .sub{ margin-top:18px; font-size:clamp(15px,1.6vw,19px); color:#4a4a3d; max-width:52ch; }
.crumbs{ display:flex; gap:8px; align-items:center; font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--brown); }
.crumbs a:hover{ color:var(--ink); }
.crumbs span{ opacity:.5; }

/* ══════ СТРАНИЦА ТОВАРА ═══════════════════════════════ */
.pdp{ padding:clamp(28px,4vw,56px) 0 clamp(60px,8vw,110px); }
.pdp-grid{ display:grid; grid-template-columns:1.05fr 1fr; gap:clamp(28px,4.4vw,72px); margin-top:clamp(22px,3vw,40px); }
@media(max-width:960px){ .pdp-grid{ grid-template-columns:1fr; } }
.pdp-media{ position:sticky; top:120px; align-self:start; }
@media(max-width:960px){ .pdp-media{ position:static; } }
.pdp-main{ border-radius:10px; overflow:hidden; background:var(--cream-2); aspect-ratio:4/5; }
.pdp-main img{ width:100%; height:100%; object-fit:cover; }
.pdp-thumbs{ display:flex; flex-wrap:wrap; gap:10px; margin-top:12px; }
.pdp-thumb{ width:78px; aspect-ratio:1; border-radius:7px; overflow:hidden; border:1px solid transparent; cursor:pointer; background:none; padding:0;
  opacity:.72; transition:opacity 220ms, border-color 220ms; }
.pdp-thumb:hover{ opacity:1; }
.pdp-thumb.on{ opacity:1; }
.pdp-thumb img{ width:100%; height:100%; object-fit:cover; }
.pdp-thumb.on{ border-color:var(--ink); }

.pdp-tag{ margin-bottom:16px; }
.pdp h1{ font-family:var(--cd); font-weight:500; font-size:clamp(30px,4.4vw,58px); line-height:1.02; letter-spacing:-.02em; }
.pdp-latin{ display:block; font-family:var(--cg); font-size:14px; letter-spacing:.18em; text-transform:uppercase; color:var(--brown); margin-top:12px; }
.pdp-claim{ margin-top:16px; font-size:clamp(16px,1.7vw,20px); color:#3d3d31; }
.pdp-price{ display:flex; align-items:baseline; gap:14px; margin-top:26px; }
.pdp-price .val{ font-family:var(--cd); font-weight:600; font-size:clamp(26px,3vw,38px); }
.pdp-price .vol{ font-size:14px; letter-spacing:.08em; text-transform:uppercase; color:var(--brown); }
.pdp-desc{ margin-top:22px; font-size:16px; line-height:1.65; color:#3d3d31; }
.pdp-benefits{ list-style:none; display:grid; grid-template-columns:1fr 1fr; gap:10px 20px; margin-top:24px; }
@media(max-width:520px){ .pdp-benefits{ grid-template-columns:1fr; } }
.pdp-benefits li{ position:relative; padding-left:20px; font-size:15px; color:#3d3d31; }
.pdp-benefits li::before{ content:'·'; position:absolute; left:4px; top:-2px; font-size:22px; color:var(--gold); }
.pdp-buy{ display:flex; gap:12px; align-items:center; flex-wrap:wrap; margin-top:30px; padding:22px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.pdp-buy .btn{ flex:1; min-width:200px; }
.pdp-marks{ display:grid; grid-template-columns:1fr 1fr; gap:12px 20px; margin-top:24px; }
@media(max-width:520px){ .pdp-marks{ grid-template-columns:1fr; } }
.mark{ display:flex; align-items:center; gap:10px; font-size:14px; color:var(--brown); }
.mark-i{ display:inline-flex; align-items:center; justify-content:center; width:30px; height:30px; flex:0 0 auto;
  border-radius:50%; background:var(--cream-2); color:var(--ink); font-size:14px; }

/* аккордеон */
.acc{ margin-top:34px; }
.acc-item{ border-top:1px solid var(--line); }
.acc-item:last-child{ border-bottom:1px solid var(--line); }
.acc-head{ display:flex; align-items:center; justify-content:space-between; gap:16px; width:100%; background:none; border:0;
  cursor:pointer; padding:20px 0; text-align:left; font-family:var(--cd); font-weight:500; font-size:17px; letter-spacing:.01em; }
.acc-head::after{ content:'+'; font-size:20px; color:var(--brown); transition:transform 300ms var(--ease-snap); }
.acc-item.open .acc-head::after{ transform:rotate(45deg); }
.acc-body{ display:none; padding:0 0 22px; font-size:15px; line-height:1.65; color:#3d3d31; }
.acc-item.open .acc-body{ display:block; }
.acc-body .ing{ font-size:13.5px; line-height:1.7; color:#4a4a3d; word-break:break-word; }
.specs{ list-style:none; display:grid; gap:10px; }
.specs li{ display:flex; justify-content:space-between; gap:18px; border-bottom:1px dashed var(--line); padding-bottom:8px; font-size:14.5px; }
.specs li b{ font-weight:500; color:var(--brown); }

/* ══════ КОРЗИНА: ВЫДВИЖНАЯ ════════════════════════════ */
.drawer{ position:fixed; inset:0; z-index:80; visibility:hidden; }
.drawer.on{ visibility:visible; }
.drawer-scrim{ position:absolute; inset:0; background:rgba(18,22,10,.45); opacity:0; transition:opacity 380ms var(--ease-out); }
.drawer.on .drawer-scrim{ opacity:1; }
.drawer-panel{ position:absolute; top:0; right:0; height:100%; width:min(430px,100%); background:var(--cream);
  display:flex; flex-direction:column; transform:translateX(102%); transition:transform 460ms var(--ease-soft);
  box-shadow:-20px 0 60px rgba(20,24,10,.2); }
.drawer.on .drawer-panel{ transform:none; }
.drawer-head{ display:flex; align-items:center; justify-content:space-between; padding:22px 24px;
  border-bottom:1px solid var(--line); font-family:var(--cd); font-weight:600; font-size:16px; letter-spacing:.1em; text-transform:uppercase; }
.drawer-x{ background:none; border:0; cursor:pointer; font-size:17px; line-height:1; padding:6px; }
.drawer-body{ flex:1; overflow-y:auto; padding:8px 24px 24px; }
.drawer-foot{ border-top:1px solid var(--line); padding:20px 24px 24px; display:grid; gap:12px; justify-items:center; }
.drawer-total{ display:flex; justify-content:space-between; width:100%; font-size:15px; }
.drawer-total b{ font-family:var(--cd); font-weight:600; font-size:19px; }

.citem{ display:grid; grid-template-columns:74px 1fr auto; gap:14px; padding:18px 0; border-bottom:1px solid var(--line); align-items:start; }
.citem-img{ border-radius:6px; overflow:hidden; background:var(--cream-2); aspect-ratio:1; }
.citem-img img{ width:100%; height:100%; object-fit:cover; }
.citem-name{ font-family:var(--cd); font-weight:500; font-size:15px; display:block; }
.citem-vol{ display:block; font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:var(--brown); margin-top:4px; }
.citem-row{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:12px; }
.citem-sum{ font-family:var(--cd); font-weight:600; font-size:15px; white-space:nowrap; }
.citem-x{ background:none; border:0; cursor:pointer; color:var(--brown); font-size:13px; padding:2px 4px; }
.citem-x:hover{ color:var(--err); }

.cart-empty{ text-align:center; padding:52px 10px; display:grid; gap:12px; justify-items:center; }
.cart-empty-mark{ font-family:var(--cd); font-size:44px; color:var(--line); }
.cart-empty-t{ font-family:var(--cd); font-weight:500; font-size:20px; }
.cart-empty-s{ font-size:14.5px; color:var(--brown); max-width:32ch; line-height:1.55; }
.cart-empty .btn{ margin-top:8px; }

/* степпер */
.stepper{ display:inline-flex; align-items:center; border:1px solid var(--line); border-radius:999px; background:#fff; }
.stepper button{ width:32px; height:32px; background:none; border:0; cursor:pointer; font-size:16px; line-height:1; color:var(--ink); }
.stepper button:hover{ color:var(--gold); }
.stepper input{ width:34px; text-align:center; border:0; background:none; font-size:14px; }
.stepper-lg button{ width:42px; height:46px; font-size:19px; }
.stepper-lg input{ width:42px; font-size:16px; }

/* тост */
.toast{ position:fixed; left:50%; bottom:26px; transform:translate(-50%,20px); z-index:90; background:var(--ink); color:var(--cream);
  padding:14px 22px; border-radius:999px; font-size:14px; box-shadow:0 16px 40px rgba(20,24,10,.3);
  opacity:0; pointer-events:none; transition:opacity 300ms,transform 300ms var(--ease-out); max-width:calc(100% - 32px); text-align:center; }
.toast.on{ opacity:1; transform:translate(-50%,0); }

/* ══════ СТРАНИЦА КОРЗИНЫ ══════════════════════════════ */
.cartpage{ padding:clamp(24px,3vw,44px) 0 clamp(60px,8vw,110px); }
.cart-grid{ display:grid; grid-template-columns:1.35fr 1fr; gap:clamp(24px,3.4vw,56px); align-items:start; margin-top:clamp(24px,3vw,44px); }
@media(max-width:980px){ .cart-grid{ grid-template-columns:1fr; } }

.line{ display:grid; grid-template-columns:96px 1fr auto auto auto; gap:16px; align-items:center;
  padding:20px 0; border-bottom:1px solid var(--line); }
.line-img{ border-radius:7px; overflow:hidden; background:var(--cream-2); aspect-ratio:1; }
.line-img img{ width:100%; height:100%; object-fit:cover; }
.line-name{ font-family:var(--cd); font-weight:500; font-size:17px; }
.line-sub{ display:block; font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:var(--brown); margin-top:5px; }
.line-unit{ display:block; font-size:14px; color:#4a4a3d; margin-top:6px; }
.line-sum{ font-family:var(--cd); font-weight:600; font-size:17px; min-width:96px; text-align:right; }
.line-x{ background:none; border:0; cursor:pointer; color:var(--brown); padding:4px; }
.line-x:hover{ color:var(--err); }
@media(max-width:680px){
  .line{ grid-template-columns:80px 1fr auto; grid-template-areas:'img info x' 'img step sum'; row-gap:12px; }
  .line-img{ grid-area:img; }
  .line-info{ grid-area:info; }
  .line .stepper{ grid-area:step; }
  .line-sum{ grid-area:sum; min-width:0; }
  .line-x{ grid-area:x; align-self:start; }
}

.cart-actions{ display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; padding-top:20px; }

.summary{ background:#fff; border:1px solid var(--line); border-radius:10px; padding:clamp(20px,2.4vw,30px); position:sticky; top:120px; }
@media(max-width:980px){ .summary{ position:static; } }
.summary h2{ font-family:var(--cd); font-weight:600; font-size:15px; letter-spacing:.12em; text-transform:uppercase; margin-bottom:18px; }
.sum-row{ display:flex; justify-content:space-between; gap:16px; padding:9px 0; font-size:15px; color:#3d3d31; }
.sum-row.total{ border-top:1px solid var(--line); margin-top:10px; padding-top:16px; font-family:var(--cd); font-weight:600; font-size:21px; color:var(--ink); }
.sum-note{ font-size:13px; line-height:1.5; color:var(--brown); margin-top:14px; }

/* форма */
.form{ display:grid; gap:22px; margin-top:26px; }
.form-block{ display:grid; gap:12px; }
.form-legend{ font-family:var(--cd); font-weight:600; font-size:13px; letter-spacing:.12em; text-transform:uppercase; color:var(--brown); }
.field{ display:grid; gap:6px; }
.field label{ font-size:13px; letter-spacing:.04em; color:var(--brown); }
.field input, .field textarea{ width:100%; background:#fff; border:1px solid var(--line); border-radius:8px;
  padding:13px 14px; font-size:15px; transition:border-color 200ms; }
.field input:focus, .field textarea:focus{ border-color:var(--brown); outline:none; }
.field textarea{ min-height:92px; resize:vertical; }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
@media(max-width:560px){ .field-row{ grid-template-columns:1fr; } }

.opts{ display:grid; gap:10px; }
.opt{ display:flex; align-items:flex-start; gap:12px; border:1px solid var(--line); border-radius:9px; padding:14px; cursor:pointer;
  background:#fff; transition:border-color 200ms, background 200ms; }
.opt:hover{ border-color:var(--brown); }
.opt input{ margin-top:3px; accent-color:var(--ink); }
.opt-t{ display:block; font-size:15px; }
.opt-d{ display:block; font-size:13px; color:var(--brown); margin-top:3px; }
.opt-p{ margin-left:auto; font-family:var(--cd); font-weight:600; font-size:14px; white-space:nowrap; }
.opt:has(input:checked){ border-color:var(--ink); background:var(--cream); }

.form-error{ background:#fbeae5; border:1px solid #e6bfb2; color:var(--err); border-radius:8px; padding:12px 14px; font-size:14px; }
.form-hint{ font-size:13px; color:var(--brown); line-height:1.5; }

/* ══════ ССЫЛКИ НА KASPI ═══════════════════════════════ */
.kaspi-links{ display:grid; gap:10px; margin-top:clamp(28px,3.6vw,44px); max-width:780px; }
.kaspi-link{ display:flex; align-items:center; gap:16px; background:#fff; border:1px solid var(--line);
  border-radius:10px; padding:12px 18px 12px 12px; transition:border-color 220ms, transform 220ms var(--ease-snap); }
.kaspi-link:hover{ border-color:var(--ink); transform:translateY(-2px); }
.kaspi-link img{ width:58px; height:58px; flex:0 0 auto; object-fit:cover; border-radius:8px; background:var(--cream-2); }
.kaspi-link b{ display:block; font-family:var(--cd); font-weight:500; font-size:17px; letter-spacing:-.01em; }
.kaspi-link i{ display:block; font-style:normal; font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--brown); margin-top:5px; }
.kaspi-go{ margin-left:auto; font-family:var(--cd); font-weight:600; font-size:13px; letter-spacing:.06em;
  text-transform:uppercase; color:var(--kaspi); white-space:nowrap; }
@media(max-width:560px){
  .kaspi-link{ flex-wrap:wrap; }
  .kaspi-go{ margin-left:74px; }
}

/* ══════ СПАСИБО ═══════════════════════════════════════ */
.thanks{ padding:clamp(40px,6vw,90px) 0 clamp(70px,9vw,130px); }
.thanks-card{ max-width:660px; margin:0 auto; background:#fff; border:1px solid var(--line); border-radius:12px; padding:clamp(26px,4vw,52px); text-align:center; }
.thanks-mark{ font-family:var(--cd); font-size:52px; color:var(--gold); line-height:1; }
.thanks h1{ font-family:var(--cd); font-weight:500; font-size:clamp(26px,3.4vw,42px); margin-top:14px; letter-spacing:-.01em; }
.thanks p{ margin-top:14px; color:#3d3d31; font-size:16px; line-height:1.6; }
.thanks-num{ display:inline-flex; flex-direction:column; gap:4px; margin-top:24px; background:var(--cream); border-radius:9px; padding:14px 24px; }
.thanks-num span{ font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--brown); }
.thanks-num b{ font-family:var(--cd); font-weight:600; font-size:20px; letter-spacing:.04em; }
.thanks-list{ list-style:none; text-align:left; margin-top:26px; border-top:1px solid var(--line); }
.thanks-list li{ display:flex; justify-content:space-between; gap:16px; padding:12px 0; border-bottom:1px solid var(--line); font-size:15px; }
.thanks-total{ display:flex; justify-content:space-between; gap:16px; padding-top:16px; font-family:var(--cd); font-weight:600; font-size:20px; }
.thanks-btns{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-top:28px; }

/* ══════ КОНТЕНТНЫЕ БЛОКИ (о бренде / доставка / контакты) ══ */
.section{ padding:clamp(48px,7vw,110px) 0; }
.section.tight{ padding:clamp(32px,4.4vw,64px) 0; }
.lead{ font-family:var(--cd); font-weight:500; font-size:clamp(22px,2.8vw,34px); line-height:1.25; letter-spacing:-.01em; max-width:30ch; }
.prose{ display:grid; gap:18px; max-width:64ch; font-size:16px; line-height:1.7; color:#3d3d31; }
.two-col{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(24px,4vw,72px); align-items:start; }
@media(max-width:860px){ .two-col{ grid-template-columns:1fr; } }
.values{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(14px,2vw,24px); margin-top:clamp(30px,4vw,54px); }
@media(max-width:900px){ .values{ grid-template-columns:1fr 1fr; } }
@media(max-width:520px){ .values{ grid-template-columns:1fr; } }
.value{ background:#fff; border:1px solid var(--line); border-radius:10px; padding:22px; }
.value .i{ font-family:var(--cd); font-size:24px; color:var(--gold); }
.value h3{ font-family:var(--cd); font-weight:500; font-size:18px; margin-top:12px; }
.value p{ font-size:14.5px; line-height:1.55; color:var(--brown); margin-top:8px; }

.cards-2{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(16px,2.4vw,28px); }
@media(max-width:860px){ .cards-2{ grid-template-columns:1fr; } }
.panel{ background:#fff; border:1px solid var(--line); border-radius:10px; padding:clamp(22px,3vw,34px); }
.panel h2{ font-family:var(--cd); font-weight:600; font-size:14px; letter-spacing:.12em; text-transform:uppercase; color:var(--brown); margin-bottom:18px; }
.dl{ list-style:none; display:grid; gap:14px; }
.dl li{ display:grid; grid-template-columns:150px 1fr; gap:16px; align-items:baseline; padding-bottom:14px; border-bottom:1px solid var(--line); }
.dl li:last-child{ border-bottom:0; padding-bottom:0; }
.dl b{ font-weight:500; font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--brown); }
.dl a:hover{ text-decoration:underline; text-underline-offset:4px; }
@media(max-width:520px){ .dl li{ grid-template-columns:1fr; gap:4px; } }

.steps{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(14px,2vw,24px); counter-reset:s; }
@media(max-width:900px){ .steps{ grid-template-columns:1fr 1fr; } }
@media(max-width:520px){ .steps{ grid-template-columns:1fr; } }
.step{ border-top:1px solid var(--ink); padding-top:16px; }
.step .n{ font-family:var(--cd); font-weight:600; font-size:13px; letter-spacing:.1em; color:var(--gold); }
.step h3{ font-family:var(--cd); font-weight:500; font-size:18px; margin-top:10px; }
.step p{ font-size:14.5px; line-height:1.55; color:var(--brown); margin-top:8px; }

/* ══════ АНИМАЦИИ ПОЯВЛЕНИЯ ════════════════════════════ */
.up{ opacity:0; transform:translateY(24px); transition:opacity 700ms var(--ease-out), transform 800ms var(--ease-soft); }
.up.in{ opacity:1; transform:none; }
.clip{ clip-path:inset(100% 0 0 0); transition:clip-path 1100ms var(--ease-soft); }
.clip.in{ clip-path:inset(0 0 0 0); }
/* Маска обрезает по content-box, поэтому даём запас под выносные элементы
   букв (у, y, Ц, Щ) и компенсируем его отрицательным margin — высота блока
   не меняется, но буквы больше не срезаются. */
.smask{ display:inline-block; overflow:hidden; padding:.08em .07em .1em; margin:-.08em -.07em -.1em; }
.smask > span{ display:inline-block; transform:translateY(130%); transition:transform 950ms var(--ease-soft); }
.smask.in > span{ transform:none; }

@media(prefers-reduced-motion:reduce){
  *{ animation:none!important; transition:none!important; }
  .up,.clip,.smask>span,.paradis b,.hero-word .mask>span{ opacity:1!important; transform:none!important; clip-path:none!important; }
  .drawer-panel{ transform:none!important; }
}