/* =====================================================================
   BOGOMOL — fine jewelry
   Светлый ателье-минимализм: кость, тёплый графит, золото.
   ===================================================================== */

/* ---------- 1. ТОКЕНЫ ---------- */
:root{
  --bone:      #F2EEE7;
  --bone-deep: #E7E1D6;
  --paper:     #FBF9F6;
  --plate:     #E4DED2;

  --ink:   #17140F;
  --ink-2: #4C443A;
  --mute:  #8E8477;
  --hair:  rgba(23,20,15,.13);
  --hair-2:rgba(23,20,15,.07);

  --gold:      #A97E3D;
  --gold-lt:   #DCBB7A;
  --gold-soft: rgba(169,126,61,.30);

  /* Ровно под чёрный фон JPG-логотипов (#0F0F0F и #161616),
     чтобы их подложка не читалась прямоугольником. Не менять без пересъёмки лого. */
  --dark:   #131313;
  --dark-2: #1B1B1A;

  --ff-d: "Cormorant Garamond", "Times New Roman", serif;
  --ff-t: "Manrope", -apple-system, "Segoe UI", Roboto, sans-serif;

  --pad: clamp(20px, 5vw, 84px);
  --ease: cubic-bezier(.22,.61,.36,1);
  --ease-io: cubic-bezier(.65,.02,.28,1);
}

/* ---------- 2. БАЗА ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{
  margin:0;
  background:var(--bone);
  color:var(--ink);
  font-family:var(--ff-t);
  font-weight:300;
  font-size:clamp(15px,1.02vw,17px);
  line-height:1.72;
  letter-spacing:.005em;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
body.is-locked{ overflow:hidden; }
img{ display:block; max-width:100%; }
h1,h2,h3{ margin:0; font-family:var(--ff-d); font-weight:300; letter-spacing:-.01em; line-height:1.02; }
p{ margin:0; }
a{ color:inherit; text-decoration:none; }
button,input,select,textarea{ font:inherit; color:inherit; }
button{ background:none; border:0; padding:0; cursor:pointer; }
::selection{ background:var(--gold); color:#fff; }

/* тонкая полоса прокрутки */
::-webkit-scrollbar{ width:9px; }
::-webkit-scrollbar-track{ background:var(--bone-deep); }
::-webkit-scrollbar-thumb{ background:var(--gold-soft); }
::-webkit-scrollbar-thumb:hover{ background:var(--gold); }

/* ---------- 3. КУРСОР ---------- */
.cursor{ position:fixed; top:0; left:0; z-index:9999; pointer-events:none; mix-blend-mode:normal; opacity:0; }
.cursor.is-on{ opacity:1; transition:opacity .4s; }
.cursor__dot,.cursor__ring{
  position:absolute; top:0; left:0; border-radius:50%;
  transform:translate(-50%,-50%);
}
.cursor__dot{ width:5px; height:5px; background:var(--gold); }
.cursor__ring{
  width:38px; height:38px; border:1px solid var(--gold-soft);
  transition:width .4s var(--ease), height .4s var(--ease),
             border-color .4s, background-color .4s, opacity .3s;
}
.cursor__label{
  position:absolute; top:0; left:0;
  transform:translate(-50%,-50%);
  font-size:9.5px; letter-spacing:.22em; text-transform:uppercase;
  color:var(--bone); white-space:nowrap; opacity:0;
  transition:opacity .3s;
}
.cursor.is-lg .cursor__ring{ width:96px; height:96px; background:var(--gold); border-color:var(--gold); }
.cursor.is-lg .cursor__dot{ opacity:0; }
.cursor.is-lg .cursor__label{ opacity:1; }
.cursor.is-sm .cursor__ring{ width:60px; height:60px; background:rgba(169,126,61,.10); }
@media (hover:none),(pointer:coarse){ .cursor{ display:none } }

/* ---------- 5. ПРЕЛОАДЕР ---------- */
.loader{
  position:fixed; inset:0; z-index:9997;
  background:var(--bone);
  display:grid; place-items:center;
  transition:transform 1.05s var(--ease-io) .3s;
}
.loader.is-done{ transform:translateY(-101%); pointer-events:none; }
.loader.is-done .loader__inner{ opacity:0; transform:translateY(-16px); transition:opacity .45s, transform .75s var(--ease); }
.loader.is-gone{ visibility:hidden; }
body:not(.is-ready){ overflow:hidden; }
.loader__inner{ display:grid; justify-items:center; gap:22px; position:relative; z-index:2; }
.mantis--load{ width:clamp(76px,10vw,116px); height:auto; }
.loader__word{ display:flex; gap:.42em; font-family:var(--ff-d); font-size:clamp(15px,1.5vw,20px); letter-spacing:.42em; text-indent:.42em; color:var(--ink); }
.loader__word span{ display:inline-block; opacity:0; transform:translateY(12px); animation:lw .7s var(--ease) forwards; }
.loader__word span:nth-child(1){ animation-delay:.55s }
.loader__word span:nth-child(2){ animation-delay:.63s }
.loader__word span:nth-child(3){ animation-delay:.71s }
.loader__word span:nth-child(4){ animation-delay:.79s }
.loader__word span:nth-child(5){ animation-delay:.87s }
.loader__word span:nth-child(6){ animation-delay:.95s }
.loader__word span:nth-child(7){ animation-delay:1.03s }
@keyframes lw{ to{ opacity:1; transform:none } }
.loader__bar{ width:132px; height:1px; background:var(--hair); overflow:hidden; }
.loader__bar i{ display:block; height:100%; width:100%; background:var(--gold); transform:scaleX(0); transform-origin:left; animation:lb 1.6s var(--ease-io) forwards; }
@keyframes lb{ to{ transform:scaleX(1) } }

/* Отрисовка контура богомола.
   stroke-width / stroke-dasharray / stroke-dashoffset — наследуемые SVG-свойства,
   поэтому задаются здесь, на внешнем <svg>, и проходят внутрь <use>.
   Толщина в юнитах viewBox (400×640): подбирается под размер каждой копии. */
.mantis, .hero__mantis{ stroke-dasharray:900; stroke-dashoffset:900; }
.mantis--load{ stroke-width:5.5; animation:draw 2.05s var(--ease) forwards; }
.hero__mantis{ stroke-width:1.7; }
.hdr__mark{ stroke-width:22; }
@keyframes draw{ to{ stroke-dashoffset:0 } }

/* ---------- 6. ШАПКА ---------- */
.hdr{
  position:fixed; top:0; left:0; right:0; z-index:900;
  display:flex; align-items:center; justify-content:space-between;
  gap:24px; padding:22px var(--pad);
  transition:padding .5s var(--ease), background-color .5s, box-shadow .5s, border-color .5s;
  border-bottom:1px solid transparent;
}
.hdr.is-stuck{
  padding:13px var(--pad);
  background:rgba(242,238,231,.82);
  backdrop-filter:blur(16px) saturate(1.4);
  -webkit-backdrop-filter:blur(16px) saturate(1.4);
  border-bottom-color:var(--hair-2);
}
.hdr.is-hidden{ transform:translateY(-102%); }
.hdr{ transition:transform .55s var(--ease), padding .5s var(--ease), background-color .5s, border-color .5s; }

.hdr__brand{ display:flex; align-items:center; gap:11px; }
.hdr__mark{ width:20px; height:32px; stroke-dasharray:none; stroke-dashoffset:0; transition:transform .6s var(--ease); }
.hdr__brand:hover .hdr__mark{ transform:translateY(-3px) rotate(-4deg); }
.hdr__word{ font-family:var(--ff-d); font-size:18px; letter-spacing:.30em; text-indent:.30em; text-transform:uppercase; }

.hdr__nav{ display:flex; gap:clamp(20px,2.4vw,42px); }
.hdr__nav a{
  position:relative; font-size:11px; letter-spacing:.20em; text-transform:uppercase;
  color:var(--ink-2); padding:5px 0;
}
.hdr__nav a::after{
  content:""; position:absolute; left:0; bottom:0; width:100%; height:1px;
  background:var(--gold); transform:scaleX(0); transform-origin:right;
  transition:transform .5s var(--ease);
}
.hdr__nav a:hover{ color:var(--ink); }
.hdr__nav a:hover::after{ transform:scaleX(1); transform-origin:left; }

.hdr__right{ display:flex; align-items:center; gap:18px; }
.lang{ display:flex; align-items:center; gap:8px; }
.lang button{ font-size:10.5px; letter-spacing:.16em; color:var(--mute); transition:color .35s; }
.lang button.is-on{ color:var(--ink); }
.lang i{ width:1px; height:11px; background:var(--hair); display:block; }

.burger{ display:none; width:26px; height:14px; position:relative; }
.burger i{ position:absolute; left:0; width:100%; height:1px; background:var(--ink); transition:transform .5s var(--ease), opacity .3s; }
.burger i:nth-child(1){ top:2px } .burger i:nth-child(2){ bottom:2px }
.burger.is-x i:nth-child(1){ transform:translateY(4px) rotate(45deg) }
.burger.is-x i:nth-child(2){ transform:translateY(-6px) rotate(-45deg) }

.menu{
  position:fixed; inset:0; z-index:850; background:var(--bone);
  display:grid; place-items:center; pointer-events:none;
  clip-path:inset(0 0 100% 0); transition:clip-path .8s var(--ease-io);
}
.menu.is-open{ clip-path:inset(0 0 0 0); pointer-events:auto; }
.menu nav{ display:grid; gap:14px; text-align:center; }
.menu nav a{
  font-family:var(--ff-d); font-size:clamp(34px,8vw,58px);
  opacity:0; transform:translateY(22px); transition:opacity .6s var(--ease), transform .6s var(--ease), color .3s;
}
.menu.is-open nav a{ opacity:1; transform:none; }
.menu.is-open nav a:nth-child(1){ transition-delay:.16s }
.menu.is-open nav a:nth-child(2){ transition-delay:.23s }
.menu.is-open nav a:nth-child(3){ transition-delay:.30s }
.menu.is-open nav a:nth-child(4){ transition-delay:.37s }
.menu nav a:hover{ color:var(--gold); font-style:italic; }

/* ---------- 7. ГЕРОЙ ---------- */
.hero{
  position:relative; min-height:100svh;
  display:grid; align-items:center;
  padding:120px var(--pad) 96px;
  overflow:hidden;
}
.hero__glow{
  position:absolute; left:50%; top:44%; width:min(120vw,1250px); aspect-ratio:1;
  transform:translate(-50%,-50%);
  background:radial-gradient(circle, rgba(255,253,248,.95) 0%, rgba(250,246,238,.55) 38%, rgba(242,238,231,0) 70%);
  pointer-events:none;
}
.hero__mantis{
  position:absolute; left:50%; top:50%;
  width:min(74vh,560px); height:auto;
  transform:translate(-50%,-50%);
  opacity:0; pointer-events:none;
  filter:drop-shadow(0 22px 46px rgba(120,86,34,.16));
}
body.is-ready .hero__mantis{
  opacity:.19;
  animation:draw 2.6s var(--ease) .25s forwards, float 13s ease-in-out 2.4s infinite;
  transition:opacity 1.4s var(--ease) .2s;
}
@keyframes float{
  0%,100%{ transform:translate(-50%,-50%) }
  50%{ transform:translate(-50%,calc(-50% - 16px)) }
}

.hero__in{ position:relative; z-index:2; max-width:1080px; margin:0 auto; text-align:center; }
.eyebrow{
  font-size:10.5px; letter-spacing:.34em; text-transform:uppercase; color:var(--mute);
  margin-bottom:clamp(20px,3vh,34px);
}
.hero__title{
  font-size:clamp(58px,15.5vw,240px);
  line-height:.86; letter-spacing:-.035em; text-transform:uppercase;
  margin:0 0 clamp(18px,3vh,30px);
}
.hero__title .ln{ display:block; overflow:hidden; padding-bottom:.06em; }
.hero__title i{
  display:block; font-style:normal;
  background:linear-gradient(96deg,#3A3128 0%,#17140F 18%,#8A6C3E 44%,#C9A055 52%,#17140F 62%,#3A3128 100%);
  background-size:220% 100%;
  -webkit-background-clip:text; background-clip:text;
  color:transparent;
  transform:translateY(105%);
  animation:sheen 9s linear 3s infinite;
}
body.is-ready .hero__title i{ transform:none; transition:transform 1.35s var(--ease-io) .15s; }
@keyframes sheen{ 0%{ background-position:0% 0 } 100%{ background-position:-220% 0 } }

.hero__sub{
  font-size:11px; letter-spacing:.30em; text-transform:uppercase; color:var(--gold);
  margin-bottom:clamp(18px,2.6vh,26px);
}
.hero__lead{
  max-width:50ch; margin:0 auto; color:var(--ink-2);
  font-size:clamp(14.5px,1.15vw,17.5px);
}
.hero__cta{ display:flex; flex-wrap:wrap; gap:14px; justify-content:center; margin-top:clamp(28px,4.4vh,46px); }

.hero__scroll{
  position:absolute; left:50%; bottom:26px; transform:translateX(-50%);
  display:grid; justify-items:center; gap:10px; z-index:2;
}
.hero__scroll span{ font-size:9px; letter-spacing:.28em; text-transform:uppercase; color:var(--mute); }
.hero__scroll i{ width:1px; height:52px; background:linear-gradient(var(--gold),transparent); position:relative; overflow:hidden; }
.hero__scroll i::after{
  content:""; position:absolute; left:0; width:100%; height:16px; background:var(--ink);
  animation:sc 2.1s var(--ease-io) infinite;
}
@keyframes sc{ 0%{ top:-16px } 60%,100%{ top:52px } }

/* ---------- 8. КНОПКИ ---------- */
.btn{
  position:relative; display:inline-flex; align-items:center; justify-content:center;
  padding:15px 34px; font-size:10.5px; letter-spacing:.20em; text-transform:uppercase;
  border:1px solid var(--ink); overflow:hidden; isolation:isolate;
  transition:color .5s var(--ease), border-color .5s;
}
.btn::before{
  content:""; position:absolute; inset:0; z-index:-1; background:var(--ink);
  transform:scaleY(1); transform-origin:bottom; transition:transform .55s var(--ease-io);
}
.btn--fill{ color:var(--bone); }
.btn--fill:hover{ color:var(--ink); }
.btn--fill:hover::before{ transform:scaleY(0); transform-origin:top; }
.btn--line{ color:var(--ink); border-color:var(--hair); }
.btn--line::before{ transform:scaleY(0); transform-origin:top; }
.btn--line:hover{ color:var(--bone); border-color:var(--ink); }
.btn--line:hover::before{ transform:scaleY(1); transform-origin:bottom; }

/* ---------- 9. МАНИФЕСТ ---------- */
.manifesto{ padding:clamp(90px,15vh,190px) var(--pad); text-align:center; }
.split{
  font-family:var(--ff-d); font-weight:300;
  font-size:clamp(24px,4.1vw,58px); line-height:1.22; letter-spacing:-.015em;
  max-width:20ch; margin:0 auto;
}
.split .w{ display:inline-block; overflow:hidden; vertical-align:top; }
.split .w > i{ display:inline-block; font-style:normal; transform:translateY(105%); transition:transform .95s var(--ease-io); }
.split.is-in .w > i{ transform:none; }
.rule{ width:1px; height:0; background:var(--gold-soft); margin:clamp(34px,6vh,64px) auto 0; transition:height 1.1s var(--ease-io) .2s; }
.rule.is-in{ height:clamp(56px,9vh,110px); }

.manifesto__body{
  max-width:920px; margin:clamp(38px,6vh,72px) auto 0;
  display:grid; grid-template-columns:1fr 1fr; gap:clamp(26px,4vw,66px);
  text-align:left;
}
.manifesto__body p{ color:var(--ink-2); font-size:clamp(14px,1.05vw,16.5px); }
.manifesto__body p::first-letter{ font-family:var(--ff-d); font-size:1.15em; }
.manifesto__sign{
  margin-top:clamp(34px,5vh,58px);
  font-size:10px; letter-spacing:.30em; text-transform:uppercase; color:var(--gold);
}

/* ---------- 10. СЕКЦИИ ---------- */
section[id]{ scroll-margin-top:86px; }
.sec{ padding:clamp(64px,10vh,130px) var(--pad); }
.sec__head{ max-width:1500px; margin:0 auto clamp(48px,8vh,96px); }
.sec__num{
  display:block; font-size:10px; letter-spacing:.30em; color:var(--gold);
  margin-bottom:16px;
}
.sec__title{ font-size:clamp(38px,6.4vw,104px); letter-spacing:-.03em; margin-bottom:20px; }
.sec__note{ max-width:44ch; color:var(--ink-2); font-size:clamp(14px,1.05vw,16.5px); }

/* ---------- 11. СЕТКА КОЛЛЕКЦИИ ---------- */
.grid{
  max-width:1500px; margin:0 auto;
  display:grid; grid-template-columns:repeat(12,1fr);
  column-gap:clamp(16px,2.6vw,44px); row-gap:clamp(48px,9vh,120px);
}
.card{ position:relative; align-self:start; }
.card:nth-child(1){ grid-column:1/5 }
.card:nth-child(2){ grid-column:6/9;   margin-top:clamp(24px,16vh,170px) }
.card:nth-child(3){ grid-column:10/13; margin-top:clamp(10px,5vh,60px) }
.card:nth-child(4){ grid-column:2/6 }
.card:nth-child(5){ grid-column:8/11;  margin-top:clamp(24px,12vh,140px) }

/* Кадры выведены в чистый белый на этапе обработки файлов, поэтому карточка —
   белое паспарту на костяной странице. Тень и волосяная рамка нужны, чтобы
   белое на светлом читалось как лист, а не как дырка в фоне. */
.card__frame{
  position:relative; overflow:hidden; background:#fff;
  aspect-ratio:9/16;   /* родная пропорция съёмки — кадры не режутся */
  clip-path:inset(0 0 100% 0);
  transition:clip-path 1.15s var(--ease-io), box-shadow .7s var(--ease);
  box-shadow:0 0 0 1px rgba(23,20,15,.05), 0 20px 44px -28px rgba(70,54,30,.30);
}
.card.is-in .card__frame{ clip-path:inset(0 0 0 0); }
.card:hover .card__frame{
  box-shadow:0 0 0 1px rgba(169,126,61,.22), 0 34px 64px -30px rgba(70,54,30,.42);
}
/* scale(1.05) — запас под параллакс, чтобы края кадра не оголялись */
.card__frame img{
  width:100%; height:100%; object-fit:cover;
  transform:scale(1.05);
  transition:transform 1.5s var(--ease), filter 1s;
  filter:contrast(1.02);
}
.card:hover .card__frame img{ transform:scale(1.11); filter:contrast(1.05); }

.card__meta{
  display:grid; grid-template-columns:auto 1fr; align-items:baseline;
  column-gap:14px; row-gap:2px; margin-top:20px;
  padding-top:16px; border-top:1px solid var(--hair-2);
  transition:border-color .5s;
}
.card:hover .card__meta{ border-top-color:var(--gold-soft); }
.card__n{ font-size:10px; letter-spacing:.22em; color:var(--gold); grid-row:1/3; }
.card__meta h3{ font-size:clamp(21px,1.85vw,30px); transition:color .4s; }
.card:hover .card__meta h3{ color:var(--gold); font-style:italic; }
.card__mat{ font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--mute); }

/* ---------- 12. МАТЕРИАЛЫ ---------- */
.sec--mat{ background:var(--bone-deep); }
.mats{
  max-width:1500px; margin:0 auto;
  display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(30px,4.5vw,84px);
}
.mat{ border-top:1px solid var(--hair); padding-top:26px; }
.mat__n{ display:block; font-family:var(--ff-d); font-size:13px; letter-spacing:.24em; color:var(--gold); margin-bottom:22px; }
.mat h3{ font-size:clamp(26px,2.7vw,42px); margin-bottom:14px; }
.mat p{ color:var(--ink-2); font-size:clamp(13.8px,1vw,15.8px); }

/* ---------- 13. МАСТЕРСКАЯ (тёмная) ---------- */
.atelier{
  background:var(--dark); color:#E9E2D5;
  display:grid; grid-template-columns:1.05fr 1fr;
  align-items:center; gap:clamp(34px,6vw,110px);
  padding:clamp(70px,12vh,150px) var(--pad);
}
.atelier__img{ overflow:hidden; clip-path:inset(0 0 100% 0); transition:clip-path 1.2s var(--ease-io); }
.atelier__img.is-in{ clip-path:inset(0 0 0 0); }
/* Радиальная маска растворяет чёрную подложку JPG в фоне секции:
   иначе снимок логотипа читается прямоугольником другого оттенка. */
.atelier__img img{
  width:100%; height:auto; transform:scale(1.03); transition:transform 1.6s var(--ease);
  -webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 50%, #000 74%, transparent 100%);
          mask-image:radial-gradient(ellipse 50% 50% at 50% 50%, #000 74%, transparent 100%);
}
.atelier:hover .atelier__img img{ transform:scale(1.08); }
.atelier__txt{ max-width:56ch; }
.atelier .sec__num{ color:var(--gold-lt); }
.atelier .sec__title{ color:#F4EEE2; margin-bottom:26px; }
.atelier p{ color:rgba(233,226,213,.66); margin-bottom:18px; font-size:clamp(14px,1.03vw,16.5px); }

.facts{ display:flex; flex-wrap:wrap; gap:clamp(24px,3.4vw,58px); margin-top:38px; padding-top:28px; border-top:1px solid rgba(220,187,122,.20); }
.facts div{ display:grid; gap:5px; }
.facts b{ font-family:var(--ff-d); font-weight:300; font-size:clamp(30px,3.1vw,46px); color:var(--gold-lt); line-height:1; }
.facts span{ font-size:9.5px; letter-spacing:.20em; text-transform:uppercase; color:rgba(233,226,213,.44); }

/* ---------- 14. ФОРМА ---------- */
.sec--contact{ padding-bottom:clamp(70px,11vh,140px); }
.form{
  max-width:780px;
  display:grid; grid-template-columns:1fr 1fr; gap:26px clamp(20px,3vw,44px);
}
.fld{ display:grid; gap:9px; }
.fld--full{ grid-column:1/-1; }
.fld > span{ font-size:9.5px; letter-spacing:.22em; text-transform:uppercase; color:var(--mute); }
.fld input,.fld select,.fld textarea{
  width:100%; background:transparent; border:0; border-bottom:1px solid var(--hair);
  padding:11px 2px; font-size:15.5px; font-weight:300;
  transition:border-color .45s var(--ease);
  border-radius:0; -webkit-appearance:none; appearance:none;
}
.fld select{ background-image:linear-gradient(45deg,transparent 50%,var(--mute) 50%),linear-gradient(135deg,var(--mute) 50%,transparent 50%); background-position:right 8px center,right 3px center; background-size:5px 5px,5px 5px; background-repeat:no-repeat; cursor:pointer; }
.fld textarea{ resize:vertical; min-height:96px; line-height:1.65; }
.fld input:focus,.fld select:focus,.fld textarea:focus{ outline:none; border-bottom-color:var(--gold); }
.fld input::placeholder,.fld textarea::placeholder{ color:rgba(142,132,119,.62); }
.fld.is-bad input,.fld.is-bad textarea{ border-bottom-color:#B4553C; }
.form .btn{ grid-column:1/-1; justify-self:start; margin-top:8px; }
.form__hint{ grid-column:1/-1; font-size:11px; color:var(--mute); letter-spacing:.04em; }

.direct{
  max-width:780px; margin:clamp(48px,7vh,80px) 0 0;
  display:flex; flex-wrap:wrap; gap:10px 34px; align-items:center;
  padding-top:30px; border-top:1px solid var(--hair-2);
}
.direct__a{ position:relative; font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-2); padding:4px 0; }
.direct__a::after{ content:""; position:absolute; left:0; bottom:0; width:100%; height:1px; background:var(--gold); transform:scaleX(0); transform-origin:right; transition:transform .5s var(--ease); }
.direct__a:hover{ color:var(--gold); }
.direct__a:hover::after{ transform:scaleX(1); transform-origin:left; }

/* ---------- 15. ПОДВАЛ ---------- */
.ftr{
  background:var(--dark); color:rgba(233,226,213,.6);
  padding:clamp(56px,9vh,110px) var(--pad) 30px;
  display:grid; justify-items:center; gap:22px; text-align:center;
}
/* Подвал собран вектором, а не JPG: у растрового лого чёрная подложка,
   которая на любом фоне читается прямоугольником. */
.ftr__brand{ display:grid; justify-items:center; gap:15px; }
.ftr__mark{ width:62px; height:99px; stroke-width:7; stroke-dasharray:none; stroke-dashoffset:0; transition:transform .7s var(--ease); }
.ftr__brand:hover .ftr__mark{ transform:translateY(-5px); }
.ftr__word{ font-family:var(--ff-d); font-size:clamp(23px,2.6vw,34px); letter-spacing:.34em; text-indent:.34em; text-transform:uppercase; color:#F1EADD; line-height:1; }
.ftr__sub{ font-size:9px; letter-spacing:.44em; text-indent:.44em; text-transform:uppercase; color:var(--gold-lt); }
.ftr__line{ font-size:11px; letter-spacing:.20em; text-transform:uppercase; max-width:44ch; margin-top:6px; }
.ftr__bot{
  width:100%; max-width:1500px; margin-top:26px; padding-top:22px;
  border-top:1px solid rgba(233,226,213,.12);
  display:flex; justify-content:space-between; gap:16px;
  font-size:10.5px; letter-spacing:.16em; text-transform:uppercase;
}
.ftr__bot a{ transition:color .35s; }
.ftr__bot a:hover{ color:var(--gold-lt); }

/* ---------- 16. ЛАЙТБОКС ---------- */
.lb{
  position:fixed; inset:0; z-index:950;
  background:rgba(17,17,17,.992);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  opacity:0; visibility:hidden; transition:opacity .6s var(--ease), visibility .6s;
}
.lb.is-open{ opacity:1; visibility:visible; }
.lb__in{
  height:100%; display:grid; grid-template-columns:1fr 1fr;
  align-items:center; gap:clamp(24px,5vw,90px);
  padding:clamp(56px,8vh,90px) clamp(56px,8vw,140px);
  max-width:1400px; margin:0 auto;
}
.lb__fig{ margin:0; height:100%; display:grid; place-items:center; }
.lb__fig img{
  max-height:78vh; width:auto; max-width:100%; object-fit:contain;
  filter:contrast(1.02);   /* тот же тон, что в сетке */
  opacity:0; transform:scale(.965); transition:opacity .7s var(--ease) .12s, transform 1s var(--ease) .12s;
}
.lb.is-open .lb__fig img{ opacity:1; transform:none; }
.lb__txt{ color:#E9E2D5; display:grid; gap:16px; justify-items:start; max-width:44ch; }
.lb__txt > *{ opacity:0; transform:translateY(16px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.lb.is-open .lb__txt > *{ opacity:1; transform:none; }
.lb.is-open .lb__txt > *:nth-child(1){ transition-delay:.20s }
.lb.is-open .lb__txt > *:nth-child(2){ transition-delay:.26s }
.lb.is-open .lb__txt > *:nth-child(3){ transition-delay:.32s }
.lb.is-open .lb__txt > *:nth-child(4){ transition-delay:.38s }
.lb.is-open .lb__txt > *:nth-child(5){ transition-delay:.44s }
.lb__n{ font-size:10px; letter-spacing:.28em; color:var(--gold-lt); }
.lb__txt h3{ font-size:clamp(32px,4vw,60px); color:#F4EEE2; }
.lb__txt p{ color:rgba(233,226,213,.62); }
.lb__spec{ margin:6px 0 4px; display:grid; gap:10px; width:100%; }
.lb__spec div{ display:flex; justify-content:space-between; gap:20px; padding-bottom:9px; border-bottom:1px solid rgba(233,226,213,.11); }
.lb__spec dt{ font-size:9.5px; letter-spacing:.20em; text-transform:uppercase; color:rgba(233,226,213,.40); }
.lb__spec dd{ margin:0; font-size:13px; color:rgba(233,226,213,.86); text-align:right; }
.lb .btn--line{ color:#E9E2D5; border-color:rgba(233,226,213,.28); }
.lb .btn--line::before{ background:var(--gold-lt); }
.lb .btn--line:hover{ color:var(--dark); border-color:var(--gold-lt); }

.lb__close{ position:absolute; top:26px; right:26px; width:42px; height:42px; z-index:3; }
.lb__close::before,.lb__close::after{
  content:""; position:absolute; top:50%; left:9px; width:24px; height:1px; background:#E9E2D5;
  transition:background-color .3s, transform .5s var(--ease);
}
.lb__close::before{ transform:rotate(45deg) } .lb__close::after{ transform:rotate(-45deg) }
.lb__close:hover::before{ transform:rotate(135deg); background:var(--gold-lt) }
.lb__close:hover::after{ transform:rotate(45deg); background:var(--gold-lt) }

.lb__nav{ position:absolute; top:50%; transform:translateY(-50%); width:54px; height:54px; z-index:3; }
.lb__nav--prev{ left:12px } .lb__nav--next{ right:12px }
.lb__nav::before{
  content:""; position:absolute; top:50%; left:50%; width:11px; height:11px;
  border-left:1px solid rgba(233,226,213,.55); border-bottom:1px solid rgba(233,226,213,.55);
  transition:border-color .3s, translate .4s var(--ease);
}
.lb__nav--prev::before{ transform:translate(-40%,-50%) rotate(45deg) }
.lb__nav--next::before{ transform:translate(-60%,-50%) rotate(-135deg) }
.lb__nav:hover::before{ border-color:var(--gold-lt) }
.lb__nav--prev:hover::before{ translate:-6px 0 }
.lb__nav--next:hover::before{ translate:6px 0 }

/* ---------- 17. ПОЯВЛЕНИЕ ПРИ СКРОЛЛЕ ---------- */
.rv{ opacity:0; transform:translateY(26px); transition:opacity .95s var(--ease), transform 1.05s var(--ease-io); }
.rv.is-in{ opacity:1; transform:none; }

/* ---------- 18. АДАПТИВ ---------- */
@media (max-width:1080px){
  .hdr__nav{ display:none; }
  .burger{ display:block; }
  .atelier{ grid-template-columns:1fr; }
  .atelier__img{ max-width:420px; }
  .mats{ grid-template-columns:1fr; gap:34px; }
  .mat{ padding-top:20px; }
  .lb__in{ grid-template-columns:1fr; align-content:center; padding:78px 26px 40px; gap:26px; }
  .lb__fig img{ max-height:44vh; }
  .lb__txt{ justify-self:center; text-align:center; justify-items:center; }
  .lb__spec dd{ text-align:right }
  .lb__nav{ top:auto; bottom:18px; transform:none; }
}
@media (max-width:820px){
  .grid{ grid-template-columns:repeat(6,1fr); row-gap:56px; }
  .card:nth-child(1){ grid-column:1/5; margin-top:0 }
  .card:nth-child(2){ grid-column:4/7; margin-top:46px }
  .card:nth-child(3){ grid-column:1/4; margin-top:0 }
  .card:nth-child(4){ grid-column:3/7; margin-top:30px }
  .card:nth-child(5){ grid-column:1/5; margin-top:0 }
  .form{ grid-template-columns:1fr; }
  .manifesto__body{ grid-template-columns:1fr; gap:20px; }
  .hero{ padding-top:100px; }
  .ftr__bot{ flex-direction:column; align-items:center; gap:10px; }
}
@media (max-width:560px){
  .grid{ grid-template-columns:1fr; row-gap:44px; }
  .card:nth-child(n){ grid-column:1/-1; margin-top:0 }
  .hero__mantis{ width:min(60vh,300px) }
  .direct{ gap:8px 22px; }
}

/* ---------- 19. ДОСТУПНОСТЬ ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
  .rv,.split .w > i,.hero__title i{ opacity:1 !important; transform:none !important; }
  .card__frame,.atelier__img,.loader::after{ clip-path:none !important; }
  .mantis{ stroke-dashoffset:0 !important; }
  .grain{ animation:none; }
}
:focus-visible{ outline:1px solid var(--gold); outline-offset:3px; }
