/* ============================================================
   ГОЛОВА В ПОРЯДКЕ — Head SPA · Красноярск
   Дизайн-система: светлый средиземноморский премиум
   ============================================================ */

:root{
  /* — Палитра — */
  --cream:      #f4efe6;   /* основной фон */
  --cream-2:    #ece4d6;   /* секции-подложки */
  --cream-3:    #e3d8c6;   /* карточки/плейсхолдеры */
  --ink:        #2b2a26;   /* основной текст, тёплый чёрный */
  --ink-soft:   #5c574e;   /* вторичный текст */
  --green:      #3a4a42;   /* глубокий зелёный — primary */
  --green-deep: #2a352f;   /* тёмная заливка секций */
  --sage:       #9aae9a;   /* шалфей — мягкий акцент */
  --terra:      #c08a5e;   /* терракота — тёплый акцент / CTA */
  --terra-deep: #a9744a;
  --line:       rgba(43,42,38,.14);
  --line-soft:  rgba(43,42,38,.08);

  /* — Шрифты — */
  --serif: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --sans:  "Manrope", system-ui, -apple-system, sans-serif;
  --mono:  "Courier New", ui-monospace, monospace;

  /* — Геометрия — */
  --maxw: 1280px;
  --pad: clamp(20px, 5vw, 88px);
  --r: 4px;
  --r-lg: 10px;

  --ease: cubic-bezier(.22,.61,.36,1);
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
body{
  margin:0;
  background:var(--cream);
  color:var(--ink);
  font-family:var(--sans);
  font-size:17px;
  line-height:1.6;
  font-weight:400;
  overflow-x:hidden;
}
img{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; cursor:pointer; border:none; background:none; color:inherit; }

/* — Типографика — */
h1,h2,h3,h4{ font-family:var(--serif); font-weight:500; line-height:1.04; margin:0; letter-spacing:-.01em; }
.display{ font-size:clamp(32px, 4.6vw, 74px); font-weight:500; letter-spacing:-.02em; }
.h-xl{ font-size:clamp(38px, 6vw, 84px); }
.h-lg{ font-size:clamp(32px, 4.6vw, 60px); }
.h-md{ font-size:clamp(26px, 3.2vw, 40px); }
.serif-it{ font-family:var(--serif); font-style:italic; }

.kicker{
  font-family:var(--sans);
  font-size:12.5px; font-weight:600;
  letter-spacing:.26em; text-transform:uppercase;
  color:var(--terra-deep);
}
.kicker.on-dark{ color:var(--terra); }
.lede{ font-size:clamp(18px,2vw,21px); line-height:1.62; color:var(--ink-soft); }

/* — Сетка — */
.wrap{ max-width:var(--maxw); margin:0 auto; padding-inline:var(--pad); }
.section{ padding-block:clamp(72px,9vw,140px); position:relative; }

/* — Кнопки — */
.btn{
  display:inline-flex; align-items:center; gap:.7em;
  font-family:var(--sans); font-weight:600; font-size:15px;
  letter-spacing:.02em;
  padding:16px 30px; border-radius:100px;
  transition:transform .35s var(--ease), background .35s var(--ease), color .35s var(--ease), box-shadow .35s var(--ease);
  white-space:nowrap;
}
.btn:active{ transform:translateY(1px); }
.btn--primary{ background:var(--green); color:var(--cream); }
.btn--primary:hover{ background:var(--green-deep); box-shadow:0 14px 30px -14px rgba(42,53,47,.7); }
.btn--terra{ background:var(--terra); color:#fff; }
.btn--terra:hover{ background:var(--terra-deep); box-shadow:0 14px 30px -14px rgba(169,116,74,.75); }
.btn--ghost{ border:1.5px solid var(--line); color:var(--ink); }
.btn--ghost:hover{ border-color:var(--ink); background:var(--ink); color:var(--cream); }
.btn--light{ background:var(--cream); color:var(--ink); }
.btn--light:hover{ background:#fff; box-shadow:0 14px 30px -16px rgba(0,0,0,.5); }
.btn--outline-light{ border:1.5px solid rgba(244,239,230,.4); color:var(--cream); }
.btn--outline-light:hover{ background:var(--cream); color:var(--green-deep); border-color:var(--cream); }
.btn .arr{ transition:transform .35s var(--ease); }
.btn:hover .arr{ transform:translateX(4px); }

/* — Плейсхолдеры изображений — */
.ph{
  position:relative;
  background-color:var(--cream-3);
  background-image:repeating-linear-gradient(45deg,
     rgba(58,74,66,.07) 0 2px, transparent 2px 11px);
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  display:flex; align-items:center; justify-content:center;
  overflow:hidden;
  color:var(--ink-soft);
}
.ph--dark{
  background-color:#1f2722;
  background-image:repeating-linear-gradient(45deg,
     rgba(255,255,255,.05) 0 2px, transparent 2px 11px);
  border-color:rgba(255,255,255,.12);
  color:rgba(244,239,230,.62);
}
.ph__tag{
  font-family:var(--mono); font-size:11.5px; letter-spacing:.04em;
  text-transform:uppercase;
  padding:7px 13px; border:1px solid currentColor; border-radius:100px;
  max-width:80%; text-align:center; line-height:1.4;
  background:rgba(244,239,230,.55);
}
.ph--dark .ph__tag{ background:rgba(31,39,34,.5); }

/* ============================================================
   HEADER
   ============================================================ */
.header{
  position:fixed; inset:0 0 auto 0; z-index:80;
  transition:background .4s var(--ease), box-shadow .4s var(--ease), padding .4s var(--ease);
  padding-block:18px;
}
.header__bar{
  display:flex; align-items:center; gap:28px;
  max-width:1440px; margin:0 auto; padding-inline:clamp(16px,4vw,48px);
}
.header.scrolled{
  background:rgba(244,239,230,.86);
  backdrop-filter:saturate(140%) blur(14px);
  box-shadow:0 1px 0 var(--line-soft);
  padding-block:11px;
}
.logo{ display:flex; align-items:center; gap:13px; flex-shrink:0; }
.logo img{ height:46px; width:auto; transition:height .4s var(--ease); }
.header.scrolled .logo img{ height:38px; }
.logo__mark{ width:38px; height:38px; border-radius:50%; background:var(--ink); flex-shrink:0;
  transition:background .4s var(--ease); }
.logo__txt{ font-family:var(--serif); font-weight:600; font-size:19px; line-height:.98; letter-spacing:.01em; }
.logo__txt small{ display:block; font-family:var(--sans); font-weight:600; font-size:9px; letter-spacing:.42em; color:var(--ink-soft); margin-top:3px; }

.nav{ display:flex; gap:26px; margin-inline:auto; }
.nav a{
  font-size:13.5px; font-weight:600; letter-spacing:.02em;
  color:var(--ink); position:relative; padding-block:6px; opacity:.82;
  transition:opacity .25s;
}
.nav a::after{ content:""; position:absolute; left:0; right:100%; bottom:0; height:1.5px; background:var(--terra);
  transition:right .3s var(--ease); }
.nav a:hover{ opacity:1; }
.nav a:hover::after{ right:0; }

.header__right{ display:flex; align-items:center; gap:18px; flex-shrink:0; }
.header__city{ display:flex; align-items:center; gap:6px; font-size:13.5px; font-weight:600; color:var(--ink-soft); }
.header__city svg{ width:14px; height:14px; }
.header__phone{ font-size:14.5px; font-weight:700; letter-spacing:.01em; white-space:nowrap; }
.socials{ display:flex; gap:9px; }
.soc{
  width:34px; height:34px; border-radius:50%; border:1px solid var(--line);
  display:grid; place-items:center; transition:.3s var(--ease);
}
.soc svg{ width:16px; height:16px; }
.soc:hover{ background:var(--ink); color:var(--cream); border-color:var(--ink); transform:translateY(-2px); }

.burger{ display:none; margin-left:auto; width:42px; height:42px; border-radius:50%; border:1px solid var(--line);
  flex-direction:column; align-items:center; justify-content:center; gap:4px; }
.burger span{ width:18px; height:1.6px; background:var(--ink); transition:.3s var(--ease); }

/* — Header contrast: light over dark hero, dark when scrolled — */
.header .logo img{ filter:invert(1) brightness(1.6); transition:filter .4s var(--ease); }
.header .nav a{ color:var(--cream); opacity:.9; }
.header .header__city{ color:rgba(244,239,230,.85); }
.header .header__phone{ color:var(--cream); }
.header .soc{ border-color:rgba(244,239,230,.38); color:var(--cream); }
.header .soc:hover{ background:var(--cream); color:var(--green-deep); border-color:var(--cream); }
.header .burger{ border-color:rgba(244,239,230,.4); }
.header .burger span{ background:var(--cream); }

.header.scrolled .logo img{ filter:none; }
.header.scrolled .nav a{ color:var(--ink); }
.header.scrolled .header__city{ color:var(--ink-soft); }
.header.scrolled .header__phone{ color:var(--ink); }
.header.scrolled .soc{ border-color:var(--line); color:var(--ink); }
.header.scrolled .soc:hover{ background:var(--ink); color:var(--cream); border-color:var(--ink); }
.header.scrolled .burger{ border-color:var(--line); }
.header.scrolled .burger span{ background:var(--ink); }

/* ============================================================
   HERO
   ============================================================ */
.hero{ position:relative; min-height:100svh; display:flex; flex-direction:column;
  color:var(--cream); background:var(--green-deep); overflow:hidden; }
.hero__video{ position:absolute; inset:0; z-index:0; }
.hero__video .ph{ width:100%; height:100%; border:none; border-radius:0;
  align-items:flex-end; justify-content:flex-start; padding:0 var(--pad) 104px; }
.hero__video::after{ content:""; position:absolute; inset:0;
  background:
    radial-gradient(120% 90% at 50% 0%, rgba(42,53,47,.35), transparent 55%),
    linear-gradient(180deg, rgba(26,33,29,.62) 0%, rgba(26,33,29,.35) 38%, rgba(26,33,29,.72) 100%);
}
.hero__play{
  position:absolute; inset:0; z-index:2; margin:auto;
  width:96px; height:96px; border-radius:50%;
  border:1.5px solid rgba(244,239,230,.5);
  display:grid; place-items:center; color:var(--cream);
  background:rgba(31,39,34,.25); backdrop-filter:blur(3px);
  align-self:center; justify-self:center;
  transition:.4s var(--ease); opacity:.0; pointer-events:none;
}
.hero__inner{ position:relative; z-index:3; flex:1; display:flex; flex-direction:column;
  justify-content:center; align-items:center; text-align:center;
  padding:clamp(120px,16vh,200px) var(--pad) 40px; }
.hero__kicker{ margin-bottom:26px; opacity:0; animation:heroFade .9s var(--ease) .1s forwards; }
.hero__slogan{ max-width:min(96vw, 1240px); margin:0 auto; line-height:1.08; text-wrap:balance;
  text-shadow:0 2px 40px rgba(0,0,0,.3); }
.hero__slogan .line{ display:block; opacity:0; animation:heroRise 1s var(--ease) forwards; }
.hero__slogan .line:nth-child(1){ animation-delay:.16s; }
.hero__slogan .line:nth-child(2){ animation-delay:.30s; }
.hero__cta{ margin-top:40px; display:flex; gap:14px; flex-wrap:wrap; justify-content:center; opacity:0; animation:heroFade .9s var(--ease) .46s forwards; }
@keyframes heroRise{ from{ opacity:0; transform:translateY(38px); } to{ opacity:1; transform:none; } }
@keyframes heroFade{ from{ opacity:0; } to{ opacity:1; } }

.hero__offer{
  position:relative; z-index:3;
  border-top:1px solid rgba(244,239,230,.18);
  background:rgba(26,33,29,.4); backdrop-filter:blur(6px);
}
.hero__offer-in{ display:flex; align-items:center; gap:20px; flex-wrap:wrap;
  padding:18px var(--pad); max-width:var(--maxw); margin:0 auto; }
.hero__offer .badge{ font-family:var(--mono); font-size:11px; letter-spacing:.18em; text-transform:uppercase;
  color:var(--terra); border:1px solid rgba(192,138,94,.5); padding:6px 12px; border-radius:100px; }
.hero__offer p{ margin:0; font-size:15px; color:rgba(244,239,230,.9); }
.hero__offer p b{ color:#fff; font-weight:700; }
.hero__scroll{ margin-left:auto; display:flex; align-items:center; gap:9px; font-size:12px; letter-spacing:.18em;
  text-transform:uppercase; color:rgba(244,239,230,.6); }
.hero__scroll .mouse{ width:20px; height:32px; border:1.5px solid rgba(244,239,230,.5); border-radius:12px; position:relative; }
.hero__scroll .mouse::after{ content:""; position:absolute; left:50%; top:6px; width:3px; height:6px; border-radius:2px;
  background:rgba(244,239,230,.8); transform:translateX(-50%); animation:scrolldot 1.8s var(--ease) infinite; }
@keyframes scrolldot{ 0%{opacity:0; transform:translate(-50%,0)} 35%{opacity:1} 70%{opacity:0; transform:translate(-50%,9px)} 100%{opacity:0} }

/* ============================================================
   ABOUT
   ============================================================ */
.about{ position:relative; color:var(--cream); overflow:hidden; }
.about__bg{ position:absolute; inset:0; z-index:0; }
.about__bg .ph{ width:100%; height:100%; border-radius:0; border:none;
  align-items:flex-start; justify-content:flex-end; padding:120px clamp(20px,5vw,88px); }
.about__bg::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(42,53,47,.78), rgba(42,53,47,.62)); }
.about__in{ position:relative; z-index:2; padding-block:clamp(90px,12vw,160px); }
.about__lead{ max-width:20ch; margin-bottom:14px; }
.about__sub{ max-width:46ch; color:rgba(244,239,230,.82); font-size:clamp(17px,1.7vw,19px); }
.about__grid{ margin-top:clamp(48px,6vw,72px); display:grid; grid-template-columns:340px 1fr; gap:clamp(36px,5vw,72px); align-items:start; }
.about__cta{ position:sticky; top:120px; }
.coupon{
  border:1px dashed rgba(244,239,230,.45); border-radius:var(--r-lg);
  padding:30px 28px; background:rgba(26,33,29,.35); backdrop-filter:blur(4px);
}
.coupon__big{ font-family:var(--serif); font-size:58px; line-height:1; color:var(--terra); }
.coupon p{ margin:.4em 0 1.4em; font-size:15px; color:rgba(244,239,230,.85); }
.problems{ list-style:none; margin:0; padding:0; display:grid; gap:2px; }
.problem{ display:flex; gap:22px; padding:24px 4px; border-top:1px solid rgba(244,239,230,.16); }
.problem:last-child{ border-bottom:1px solid rgba(244,239,230,.16); }
.problem__no{ font-family:var(--serif); font-size:24px; color:var(--sage); min-width:42px; font-style:italic; }
.problem__txt{ font-size:17px; line-height:1.55; color:rgba(244,239,230,.92); }
.problem__txt b{ color:#fff; font-weight:600; }

/* ============================================================
   SECTION HEADINGS
   ============================================================ */
.sec-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:32px; flex-wrap:wrap;
  margin-bottom:clamp(40px,5vw,68px); }
.sec-head__l{ max-width:34ch; }
.sec-head .kicker{ display:block; margin-bottom:16px; }
.sec-head p{ margin:14px 0 0; max-width:42ch; }

/* ============================================================
   MASTER
   ============================================================ */
.master{ background:var(--cream); }
.master__grid{ display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(32px,5vw,76px); align-items:center; }
.master__photo{ aspect-ratio:4/5; border-radius:var(--r-lg); }
.master__role{ font-size:15px; color:var(--terra-deep); font-weight:600; letter-spacing:.01em; margin:8px 0 26px; }
.master__txt p{ font-size:clamp(16px,1.6vw,18px); line-height:1.64; color:var(--ink-soft); margin:0 0 16px; max-width:54ch; }
.master__quote{ font-family:var(--serif); font-style:italic; font-size:clamp(22px,2.4vw,30px); line-height:1.32; color:var(--ink); border-left:2px solid var(--terra); padding-left:24px; margin:26px 0; max-width:40ch; }
.master__chips{ display:flex; flex-wrap:wrap; gap:10px; margin:26px 0 32px; }
.master__chips span{ font-size:13px; font-weight:600; letter-spacing:.02em; padding:9px 16px; border:1px solid var(--line); border-radius:100px; color:var(--ink); }
@media(max-width:880px){ .master__grid{ grid-template-columns:1fr; } .master__photo{ max-width:400px; } }

/* ============================================================
   SERVICES (accordion)
   ============================================================ */
.services{ background:var(--cream-2); }
.cat{ border-top:1px solid var(--line); }
.cat:last-child{ border-bottom:1px solid var(--line); }
.cat__head{ display:grid; grid-template-columns:auto 1fr auto; gap:24px; align-items:center;
  padding:clamp(26px,3vw,40px) 0; cursor:pointer; }
.cat__no{ font-family:var(--serif); font-style:italic; font-size:clamp(22px,2.4vw,30px); color:var(--terra-deep); }
.cat__title{ font-family:var(--serif); font-size:clamp(28px,3.6vw,48px); font-weight:500; line-height:1; }
.cat__desc{ font-size:14.5px; color:var(--ink-soft); max-width:34ch; }
.cat__toggle{ width:48px; height:48px; border-radius:50%; border:1px solid var(--line);
  display:grid; place-items:center; transition:.35s var(--ease); flex-shrink:0; }
.cat__toggle::before,.cat__toggle::after{ content:""; position:absolute; width:15px; height:1.6px; background:var(--ink); transition:.35s var(--ease); }
.cat__toggle{ position:relative; }
.cat__toggle::after{ transform:rotate(90deg); }
.cat.open .cat__toggle{ background:var(--green); border-color:var(--green); }
.cat.open .cat__toggle::before,.cat.open .cat__toggle::after{ background:var(--cream); }
.cat.open .cat__toggle::after{ transform:rotate(0deg); }
.cat__body{ display:grid; grid-template-rows:0fr; transition:grid-template-rows .5s var(--ease); }
.cat__body>div{ overflow:hidden; }
.cat.open .cat__body{ grid-template-rows:1fr; }
.cat__list{ padding-bottom:24px; display:grid; gap:0; }

/* program item */
.prog{ border-top:1px solid var(--line-soft); }
.prog__head{ display:grid; grid-template-columns:1fr auto auto; gap:20px; align-items:baseline;
  padding:22px 0; cursor:pointer; }
.prog__name{ font-family:var(--serif); font-size:clamp(20px,2.1vw,27px); font-weight:500; line-height:1.12; }
.prog__name .tag{ display:inline-block; font-family:var(--sans); font-size:10px; font-weight:700; letter-spacing:.12em;
  text-transform:uppercase; color:var(--terra-deep); border:1px solid rgba(169,116,74,.4); border-radius:100px;
  padding:3px 9px; margin-left:10px; vertical-align:middle; }
.prog__dur{ font-size:13.5px; color:var(--ink-soft); white-space:nowrap; font-variant-numeric:tabular-nums; }
.prog__price{ font-family:var(--serif); font-size:clamp(18px,1.8vw,23px); white-space:nowrap; font-variant-numeric:tabular-nums; }
.prog__price.muted{ color:var(--ink-soft); font-size:15px; font-style:italic; }
.prog__body{ display:grid; grid-template-rows:0fr; transition:grid-template-rows .45s var(--ease); }
.prog__body>div{ overflow:hidden; }
.prog.open .prog__body{ grid-template-rows:1fr; }
.prog__inner{ padding:2px 0 28px; display:grid; grid-template-columns:1.3fr 1fr; gap:38px; }
.prog__desc{ font-size:15.5px; line-height:1.62; color:var(--ink-soft); }
.prog__steps{ list-style:none; margin:16px 0 0; padding:0; counter-reset:step; column-gap:32px; }
.prog__steps li{ position:relative; padding:7px 0 7px 30px; font-size:14.5px; line-height:1.45;
  border-top:1px solid var(--line-soft); counter-increment:step; }
.prog__steps li::before{ content:counter(step); position:absolute; left:0; top:7px; font-family:var(--serif);
  font-style:italic; color:var(--terra-deep); font-size:14px; }
.prog__aside{ }
.prog__photo{ aspect-ratio:4/5; }
.prog__book{ margin-top:18px; width:100%; justify-content:center; }

/* ============================================================
   PRODUCTS
   ============================================================ */
.products{ background:var(--cream); }
.prod-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(14px,1.6vw,24px); }
.prod{ }
.prod__img{ aspect-ratio:3/4; margin-bottom:16px; transition:transform .5s var(--ease); }
.prod:hover .prod__img{ transform:translateY(-6px); }
.prod__brand{ font-size:11px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--terra-deep); }
.prod__name{ font-family:var(--serif); font-size:21px; margin:6px 0 4px; line-height:1.12; }
.prod__price{ font-size:14.5px; color:var(--ink-soft); }

/* ============================================================
   CERTIFICATES
   ============================================================ */
.certs{ background:var(--green-deep); color:var(--cream); }
.certs__grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(32px,5vw,72px); align-items:center; }
.certs__photo{ aspect-ratio:5/4; }
.certs__txt h2{ margin-bottom:24px; }
.certs__txt .lede{ color:rgba(244,239,230,.84); }
.certs__sign{ font-family:var(--serif); font-style:italic; font-size:clamp(26px,3vw,38px); line-height:1.2; margin:0 0 30px; color:var(--cream); }

/* ============================================================
   CASES (before / after)
   ============================================================ */
.cases__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(20px,2.4vw,34px); }
.case__pair{ display:grid; grid-template-columns:1fr 1fr; gap:6px; }
.case__pair .ph{ aspect-ratio:3/4; border-radius:6px; }
.case__pair .ph .ph__tag{ font-size:10px; padding:5px 9px; }
.case__lbl{ display:flex; gap:8px; margin:14px 0 6px; }
.case__lbl span{ font-family:var(--mono); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase;
  border:1px solid var(--line); border-radius:100px; padding:3px 10px; color:var(--ink-soft); }
.case__title{ font-family:var(--serif); font-size:24px; line-height:1.1; margin:8px 0 6px; }
.case__note{ font-size:14.5px; color:var(--ink-soft); }

/* ============================================================
   REVIEWS (carousel)
   ============================================================ */
.reviews{ background:var(--cream-2); overflow:hidden; }
.rev-top{ display:flex; align-items:flex-end; justify-content:space-between; gap:24px; flex-wrap:wrap; margin-bottom:46px; }
.rev-rate{ display:flex; align-items:center; gap:14px; }
.rev-rate .num{ font-family:var(--serif); font-size:54px; line-height:1; }
.rev-rate .stars{ color:var(--terra); font-size:17px; letter-spacing:2px; }
.rev-rate .src{ font-size:13px; color:var(--ink-soft); }
.rev-viewport{ overflow:hidden; }
.rev-track{ display:flex; gap:24px; transition:transform .6s var(--ease); will-change:transform; }
.rev-card{ flex:0 0 clamp(280px,30vw,400px); background:var(--cream); border:1px solid var(--line);
  border-radius:var(--r-lg); padding:34px 32px; display:flex; flex-direction:column; gap:18px; }
.rev-card .stars{ color:var(--terra); letter-spacing:2px; font-size:15px; }
.rev-card__txt{ font-family:var(--serif); font-size:21px; line-height:1.4; font-weight:500; flex:1; }
.rev-card__by{ display:flex; align-items:center; gap:12px; }
.rev-card__av{ width:42px; height:42px; border-radius:50%; background:var(--sage); display:grid; place-items:center;
  font-family:var(--serif); font-size:18px; color:var(--green-deep); }
.rev-card__by b{ display:block; font-family:var(--sans); font-size:14.5px; font-weight:700; }
.rev-card__by span{ font-size:12.5px; color:var(--ink-soft); }
.rev-nav{ display:flex; gap:10px; }
.rev-arrow{ width:52px; height:52px; border-radius:50%; border:1px solid var(--line); display:grid; place-items:center;
  transition:.3s var(--ease); }
.rev-arrow:hover{ background:var(--ink); color:var(--cream); border-color:var(--ink); }
.rev-arrow:disabled{ opacity:.3; cursor:default; }
.rev-arrow:disabled:hover{ background:none; color:var(--ink); border-color:var(--line); }

/* ============================================================
   FAQ
   ============================================================ */
.faq{ background:var(--cream); }
.faq__grid{ display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(36px,6vw,90px); align-items:start; }
.faq__list{ }
.qa{ border-top:1px solid var(--line); }
.qa:last-child{ border-bottom:1px solid var(--line); }
.qa__q{ display:flex; gap:20px; align-items:center; justify-content:space-between; padding:26px 0; cursor:pointer; }
.qa__q h3{ font-family:var(--serif); font-size:clamp(20px,2vw,26px); font-weight:500; line-height:1.2; }
.qa__ic{ width:30px; height:30px; flex-shrink:0; position:relative; }
.qa__ic::before,.qa__ic::after{ content:""; position:absolute; top:50%; left:50%; width:14px; height:1.6px;
  background:var(--ink); transform:translate(-50%,-50%); transition:.35s var(--ease); }
.qa__ic::after{ transform:translate(-50%,-50%) rotate(90deg); }
.qa.open .qa__ic::after{ transform:translate(-50%,-50%) rotate(0); opacity:0; }
.qa__a{ display:grid; grid-template-rows:0fr; transition:grid-template-rows .45s var(--ease); }
.qa__a>div{ overflow:hidden; }
.qa.open .qa__a{ grid-template-rows:1fr; }
.qa__a p{ margin:0 0 26px; max-width:54ch; color:var(--ink-soft); font-size:16px; line-height:1.6; }

/* ============================================================
   CONTACTS
   ============================================================ */
.contacts{ background:var(--green-deep); color:var(--cream); }
.contacts__grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(36px,5vw,72px); align-items:stretch; }
.contacts__map{ min-height:420px; border-radius:var(--r-lg); overflow:hidden; }
.contacts__map .ph{ width:100%; height:100%; }
.cinfo{ display:flex; flex-direction:column; gap:34px; }
.cinfo__row{ }
.cinfo__row .lab{ font-family:var(--mono); font-size:11px; letter-spacing:.18em; text-transform:uppercase;
  color:var(--sage); margin-bottom:10px; }
.cinfo__row .val{ font-family:var(--serif); font-size:clamp(22px,2.4vw,30px); line-height:1.25; }
.cinfo__row .val.sm{ font-size:18px; font-family:var(--sans); font-weight:500; line-height:1.6; }
.cinfo__row .val a:hover{ color:var(--terra); }
.cinfo__socials{ display:flex; gap:12px; }
.cinfo__socials .soc{ border-color:rgba(244,239,230,.3); width:48px; height:48px; }
.cinfo__socials .soc svg{ width:20px; height:20px; }
.cinfo__socials .soc:hover{ background:var(--cream); color:var(--green-deep); border-color:var(--cream); }

/* ============================================================
   FOOTER
   ============================================================ */
.footer{ background:var(--ink); color:rgba(244,239,230,.66); padding-block:64px 38px; }
.footer__top{ display:grid; grid-template-columns:1.5fr 1fr 1.3fr 1.2fr; gap:clamp(28px,4vw,64px); padding-bottom:48px; border-bottom:1px solid rgba(244,239,230,.12); }
.footer__brand .logo{ margin-bottom:20px; }
.footer__tag{ font-size:14.5px; line-height:1.6; max-width:34ch; margin:0 0 22px; color:rgba(244,239,230,.6); }
.footer__soc{ display:flex; gap:10px; }
.footer__soc .soc{ border-color:rgba(244,239,230,.28); color:var(--cream); width:38px; height:38px; }
.footer__soc .soc:hover{ background:var(--cream); color:var(--ink); border-color:var(--cream); }
.footer__col{ display:flex; flex-direction:column; gap:16px; align-items:flex-start; }
.footer__h{ font-family:var(--mono); font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--sage); margin-bottom:6px; }
.footer__col a{ font-size:14.5px; line-height:1.3; color:rgba(244,239,230,.72); transition:color .25s, padding .25s; text-align:left; }
.footer__col a:hover{ color:var(--cream); }
.footer__col a[data-doc]{ cursor:pointer; }
.footer__legal{ font-size:13.5px; line-height:1.7; color:rgba(244,239,230,.6); margin:0; font-variant-numeric:tabular-nums; }
.footer__bottom{ display:flex; align-items:center; justify-content:space-between; gap:18px 28px; flex-wrap:wrap; padding-top:30px; }
.footer__meta{ font-size:13px; color:rgba(244,239,230,.5); }
.footer__mini{ display:flex; gap:22px; flex-wrap:wrap; }
.footer__mini a{ font-size:12.5px; color:rgba(244,239,230,.55); cursor:pointer; transition:color .25s; }
.footer__mini a:hover{ color:var(--cream); }
.footer__note{ font-size:12px; color:rgba(244,239,230,.42); margin:18px 0 0; max-width:90ch; line-height:1.6; }

/* — doc modal body — */
.modal__doc{ display:none; }
.modal.is-doc .modal__form,.modal.is-doc .modal__ok{ display:none; }
.modal.is-doc .modal__doc{ display:block; }
.doc-body{ max-height:62vh; overflow:auto; margin-top:18px; padding-right:14px; }
.doc-body h4{ font-family:var(--sans); font-size:14px; font-weight:700; letter-spacing:.01em; margin:22px 0 8px; color:var(--ink); }
.doc-body h4:first-child{ margin-top:0; }
.doc-body p,.doc-body li{ font-size:14.5px; line-height:1.62; color:var(--ink-soft); margin:0 0 10px; }
.doc-body ul{ margin:0 0 12px; padding-left:20px; }
.doc-body .ph-fill{ color:var(--terra-deep); font-weight:600; }
.doc-body .doc-note{ background:var(--cream-2); border:1px dashed var(--line); border-radius:8px; padding:12px 14px; font-size:13px; color:var(--ink-soft); }
.doc-meta{ font-family:var(--mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-soft); margin-top:6px; }

/* — cookie banner — */
.cookie{ position:fixed; left:0; right:0; bottom:0; z-index:150; transform:translateY(120%);
  transition:transform .55s var(--ease); padding:16px clamp(16px,4vw,40px); pointer-events:none; }
.cookie.show{ transform:none; pointer-events:auto; }
.cookie__in{ max-width:var(--maxw); margin:0 auto; background:var(--green-deep); color:var(--cream);
  border:1px solid rgba(244,239,230,.16); border-radius:14px; box-shadow:0 24px 60px -24px rgba(0,0,0,.6);
  padding:20px clamp(20px,3vw,30px); display:flex; align-items:center; gap:24px; flex-wrap:wrap; }
.cookie__txt{ flex:1; min-width:240px; font-size:14px; line-height:1.55; color:rgba(244,239,230,.86); }
.cookie__txt a{ color:var(--terra); text-decoration:underline; text-underline-offset:3px; cursor:pointer; }
.cookie__actions{ display:flex; gap:12px; flex-shrink:0; }
.cookie .btn{ padding:13px 26px; font-size:14px; }

@media (max-width:880px){
  .footer__top{ grid-template-columns:1fr 1fr; }
  .footer__brand{ grid-column:1/-1; }
}
@media (max-width:560px){
  .footer__top{ grid-template-columns:1fr; gap:30px; }
  .cookie__in{ flex-direction:column; align-items:flex-start; gap:16px; }
  .cookie__actions{ width:100%; }
  .cookie .btn{ flex:1; justify-content:center; }
}

/* ============================================================
   MODAL
   ============================================================ */
.modal{ position:fixed; inset:0; z-index:200; display:none; }
.modal.open{ display:block; }
.modal__bd{ position:absolute; inset:0; background:rgba(26,33,29,.6); backdrop-filter:blur(6px); opacity:0;
  transition:opacity .4s var(--ease); }
.modal.open .modal__bd{ opacity:1; }
.modal__panel{ position:absolute; top:50%; left:50%; width:min(560px,92vw); max-height:92vh; overflow:auto;
  transform:translate(-50%,-46%); background:var(--cream); border-radius:14px; padding:clamp(30px,4vw,52px);
  opacity:0; transition:opacity .4s var(--ease), transform .5s var(--ease); }
.modal.open .modal__panel{ opacity:1; transform:translate(-50%,-50%); }
.modal__close{ position:absolute; top:18px; right:18px; width:42px; height:42px; border-radius:50%;
  border:1px solid var(--line); display:grid; place-items:center; transition:.3s var(--ease); }
.modal__close:hover{ background:var(--ink); color:var(--cream); border-color:var(--ink); }
.modal h3{ font-size:clamp(28px,3.4vw,40px); margin-bottom:8px; }
.modal .kicker{ display:block; margin-bottom:14px; }
.modal p.sub{ color:var(--ink-soft); margin:0 0 26px; font-size:15.5px; }
.field{ margin-bottom:16px; }
.field label{ display:block; font-size:12.5px; font-weight:600; letter-spacing:.04em; margin-bottom:7px; color:var(--ink-soft); }
.field input,.field select,.field textarea{
  width:100%; font-family:var(--sans); font-size:15.5px; color:var(--ink);
  padding:14px 16px; border:1px solid var(--line); border-radius:8px; background:#fff;
  transition:border .25s; }
.field input:focus,.field select:focus,.field textarea:focus{ outline:none; border-color:var(--green); }
.field textarea{ resize:vertical; min-height:80px; }
.field--row{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.modal .btn--terra{ width:100%; justify-content:center; margin-top:6px; }
.modal__ok{ text-align:center; padding:30px 0; display:none; }
.modal__ok .ico{ width:72px; height:72px; border-radius:50%; background:var(--sage); margin:0 auto 22px;
  display:grid; place-items:center; color:var(--green-deep); }
.modal.done .modal__form{ display:none; }
.modal.done .modal__ok{ display:block; }
.modal small.priv{ display:block; margin-top:14px; font-size:12px; color:var(--ink-soft); text-align:center; }

/* ============================================================
   SCROLL REVEAL
   ============================================================ */
.reveal{ opacity:0; transform:translateY(28px); transition:opacity .9s var(--ease), transform .9s var(--ease); }
.reveal.in{ opacity:1; transform:none; }
.reveal.d1{ transition-delay:.08s; } .reveal.d2{ transition-delay:.16s; }
.reveal.d3{ transition-delay:.24s; } .reveal.d4{ transition-delay:.32s; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
.mobile-nav{ display:none; }
@media (max-width:1080px){
  .nav, .header__city, .header__phone, .socials{ display:none; }
  .burger{ display:flex; }
  .about__grid{ grid-template-columns:1fr; }
  .about__cta{ position:static; }
  .prod-grid{ grid-template-columns:repeat(2,1fr); }
  .certs__grid,.faq__grid,.contacts__grid,.prog__inner{ grid-template-columns:1fr; }
  .cases__grid{ grid-template-columns:1fr; max-width:480px; }
}
@media (max-width:680px){
  body{ font-size:16px; }
  .prog__head{ grid-template-columns:1fr auto; }
  .prog__dur{ grid-column:1; }
  .field--row{ grid-template-columns:1fr; }
  .prod-grid{ grid-template-columns:1fr 1fr; }
  .hero__offer-in{ gap:12px; } .hero__scroll{ display:none; }
  .cat__head{ grid-template-columns:auto 1fr auto; }
  .cat__desc{ display:none; }
}

/* mobile nav drawer */
.mnav{ position:fixed; inset:0; z-index:120; background:var(--green-deep); color:var(--cream);
  transform:translateY(-100%); visibility:hidden; transition:transform .5s var(--ease), visibility .5s var(--ease); display:flex; flex-direction:column;
  padding:88px var(--pad) 40px; }
.mnav.open{ transform:none; visibility:visible; }
.mnav a{ font-family:var(--serif); font-size:34px; padding:14px 0; border-bottom:1px solid rgba(244,239,230,.15); }
.mnav__close{ position:absolute; top:24px; right:24px; width:46px; height:46px; border-radius:50%;
  border:1px solid rgba(244,239,230,.3); display:grid; place-items:center; }
.mnav__foot{ margin-top:auto; padding-top:30px; display:flex; flex-direction:column; gap:14px; }
.mnav__foot .header__phone{ display:block; font-size:22px; }