*,*::before,*::after{box-sizing:border-box}
:root{
  --ink:#f6f2e9;            /* кремовый текст */
  --ink-2:#d8d2c4;
  --dim:#a79f90;
  --bg:#0b0a08;             /* тёплый уголь */
  --bg-2:#100e0b;
  --bg-3:#15120e;
  --brass:#c39a4f;          /* латунь */
  --brass-lt:#e3cb9b;
  --brass-dk:#7a6034;
  --hair:rgba(226,213,186,.2);
  --hair-2:rgba(226,213,186,.07);
  --pad:clamp(20px,5.5vw,96px);
  --maxw:1360px;
  --lift:0 28px 56px -34px rgba(0,0,0,.95), 0 5px 14px -10px rgba(0,0,0,.7);
  --edge:inset 0 1px 0 rgba(255,247,230,.06);
  /* стекло: заметно светлее подложки, с золотым ободком и тёплым свечением — не просто блюр */
  --glass-bg:linear-gradient(155deg,rgba(255,255,255,.26) 0%,rgba(255,255,255,.07) 42%,rgba(255,255,255,.13) 100%);
  --glass-brd:rgba(255,241,214,.5);
  --glass-shadow:inset 0 1.5px 0 rgba(255,255,255,.65),inset 0 -1px 0 rgba(0,0,0,.4),
    0 26px 50px -18px rgba(0,0,0,.92),0 2px 0 rgba(0,0,0,.5),
    0 0 0 1px rgba(0,0,0,.5),0 0 38px -6px rgba(195,154,79,.4);
  --glass-blur:blur(22px) saturate(210%);
}
/* ---------- стекло: переиспользуемый премиальный эффект ---------- */
.glass{background:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
  border:1.5px solid var(--glass-brd);box-shadow:var(--glass-shadow);border-radius:14px}
/* яркий диагональный блик — как настоящее преломление света в стекле */
.glass,.filter,.chat,.matter__cta,.lang,.why__ico,.btn--quiet,.badge,.hero .eyebrow,
.plate__mat,.card-visit__side,.lightbox__close,.lightbox__nav,.gal-btn,
.matter,.portrait__mat,.why__list li,.track li{position:relative;overflow:hidden;isolation:isolate}
.glass::before,.filter::before,.chat::before,.matter__cta::before,.lang::before,.why__ico::before,
.btn--quiet::before,.badge::before,.hero .eyebrow::before,.plate__mat::before,.card-visit__side::before,
.lightbox__close::before,.lightbox__nav::before,.gal-btn::before2,
.matter::before,.portrait__mat::before,.why__list li::before,.track li::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(115deg,rgba(255,255,255,.35) 0%,transparent 22%,transparent 78%,rgba(255,255,255,.12) 100%)}
.glass::after,.filter::after,.chat::after,.matter__cta::after,.why__ico::after,.btn--quiet::after,
.badge::after,.hero .eyebrow::after,.plate__mat::after2,.card-visit__side::after,
.lightbox__close::after,.lightbox__nav::after,.matter::after2,.portrait__mat::after,.why__list li::after,
.track li::after{
  content:"";position:absolute;left:1px;right:1px;top:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.85) 50%,transparent);pointer-events:none}
html{-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
section[id]{scroll-margin-top:96px}
body{
  margin:0;color:var(--ink);background:#0b0a08;
  font-family:Inter,-apple-system,system-ui,sans-serif;font-weight:300;
  font-size:clamp(15px,1.02vw,16.5px);line-height:1.7;overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block}
/* фон отдельным закреплённым слоем: рисуется один раз, при прокрутке не пересчитывается */
body::before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;
  background:
    radial-gradient(1200px 700px at 82% -6%, rgba(176,141,87,.13), transparent 60%),
    radial-gradient(900px 800px at -6% 30%, rgba(120,105,80,.08), transparent 62%),
    linear-gradient(180deg,#0b0a08,#0d0b09 45%,#080706)}
a{color:inherit}
h1,h2,h3{font-family:"Playfair Display",Georgia,serif;font-weight:500;margin:0;letter-spacing:-.008em;
  text-shadow:
    0 -1px 0 rgba(255,252,246,.3),
    0 2px 0 rgba(0,0,0,.75),
    0 4px 6px rgba(0,0,0,.5)}

em{font-style:normal;color:var(--brass-lt)}
.micro{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--dim);font-weight:400;margin:0}
.eyebrow{font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--brass);margin:0;font-weight:400}

/* плёнка и виньетка */
.grain{
  position:fixed;inset:0;z-index:95;pointer-events:none;opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23n)' opacity='.4'/%3E%3C/svg%3E");
}
.vignette{position:fixed;inset:0;z-index:94;pointer-events:none;
  background:radial-gradient(140% 110% at 50% 45%, transparent 62%, rgba(0,0,0,.38) 100%)}

/* монограмма */




/* ---------- шапка ---------- */
/* грід у 4 колонки: лого | центр (навігація) | мова | бургер — навігація завжди рівновіддалена від лого і перемикача мови */
.nav{position:fixed;inset:0 0 auto 0;z-index:60;display:grid;
  grid-template-columns:auto 1fr auto auto;align-items:center;column-gap:26px;
  padding:13px var(--pad);border-bottom:1px solid transparent;
  transition:background .5s,border-color .5s,padding .5s,box-shadow .5s}
.nav.is-stuck{background:linear-gradient(180deg,rgba(11,10,8,.72),rgba(11,10,8,.42));
  backdrop-filter:blur(14px) saturate(120%);-webkit-backdrop-filter:blur(14px) saturate(120%);
  border-bottom-color:var(--hair);padding:9px var(--pad);
  box-shadow:0 18px 40px -34px #000}
.nav__logo{grid-column:1;display:flex;align-items:center;gap:13px;text-decoration:none}
.nav__links{grid-column:2;justify-self:center;display:flex;gap:30px;align-items:center}
.nav__links a{position:relative;display:flex;align-items:baseline;gap:8px;text-decoration:none;
  font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2);transition:color .3s}
.nav__links .idx{font-size:11px;color:var(--brass);letter-spacing:.1em;opacity:.75}
.nav__links a::after{content:"";position:absolute;left:0;right:100%;bottom:-6px;height:1px;
  background:linear-gradient(90deg,var(--brass),transparent);transition:right .45s cubic-bezier(.16,1,.3,1)}
.nav__links a:hover{color:var(--ink)}
.nav__links a:hover::after{right:0}
.nav__burger{grid-column:4;display:none;background:none;border:0;padding:10px;cursor:pointer}
.nav__close{display:none}
.nav__burger span{display:block;width:24px;height:1px;background:var(--ink);margin:6px 0;transition:transform .35s}

/* ---------- кнопки ---------- */
.btn{position:relative;display:inline-block;overflow:hidden;text-decoration:none;cursor:pointer;border:0;
  padding:17px 34px;color:#17120b;border-radius:999px;
  background:linear-gradient(155deg,#fff3d6 0%,var(--brass-lt) 22%,var(--brass) 55%,var(--brass-dk) 100%);
  font:600 11px/1 Inter,sans-serif;letter-spacing:.22em;text-transform:uppercase;
  box-shadow:inset 0 1.5px 0 rgba(255,252,240,.75),inset 0 -2px 4px rgba(60,42,10,.35),
    0 4px 0 rgba(70,50,14,.55),0 26px 46px -20px rgba(176,141,87,.95),0 0 32px -8px rgba(227,203,155,.5);
  transition:transform .4s cubic-bezier(.16,1,.3,1),box-shadow .4s}
.btn::after{content:"";position:absolute;top:0;bottom:0;left:-60%;width:38%;transform:skewX(-18deg);
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.6),transparent);transition:left .8s cubic-bezier(.16,1,.3,1)}
.btn:hover{transform:translateY(-3px);box-shadow:inset 0 1.5px 0 rgba(255,252,240,.8),inset 0 -2px 4px rgba(60,42,10,.35),
    0 4px 0 rgba(70,50,14,.55),0 34px 58px -20px rgba(176,141,87,1),0 0 42px -6px rgba(227,203,155,.65)}
.btn:hover::after{left:130%}
.btn--quiet{color:var(--ink);background:var(--glass-bg);backdrop-filter:blur(20px) saturate(200%);
  -webkit-backdrop-filter:blur(20px) saturate(200%);border:1.5px solid var(--glass-brd);box-shadow:var(--glass-shadow)}
.btn--quiet:hover{border-color:rgba(227,203,155,.5);color:var(--brass-lt)}

/* ---------- герой ---------- */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;
  padding:120px var(--pad) 150px;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;
  background:
    radial-gradient(60% 55% at 20% 45%, rgba(176,141,87,.10), transparent 62%);
  pointer-events:none}
.hero__inner{position:relative;width:100%;max-width:var(--maxw);margin:0 auto;
  display:grid;grid-template-columns:minmax(0,54%);align-items:center}
.hero__panel{max-width:640px}
.js .hero__panel{animation:riseIn 1.1s cubic-bezier(.16,1,.3,1) both}

/* весы — водяной знак */



/* фото фоном в правой половине: без рамки, край растворяется в фоне */
.hero__media{position:absolute;top:clamp(56px,7vh,86px);bottom:0;right:0;width:min(60%,900px);overflow:hidden;pointer-events:none;
  transform:translateZ(0);
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 26%);
  mask-image:linear-gradient(90deg,transparent 0%,#000 26%)}
.hero__media img{width:100%;height:100%;object-fit:cover;object-position:52% 30%;will-change:transform;
}
.hero__media::after{content:"";position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(8,7,6,.92) 0%,rgba(8,7,6,.34) 22%,rgba(8,7,6,.12) 42%),
    linear-gradient(180deg,rgba(8,7,6,.6) 0%,rgba(8,7,6,.14) 26%,rgba(8,7,6,.72) 100%)}
.hero__rail{position:absolute;left:14px;top:50%;transform:rotate(180deg) translateY(50%);
  writing-mode:vertical-rl;font-size:10.5px;letter-spacing:.34em;text-transform:uppercase;color:var(--dim);margin:0}
.hero__title{font-size:clamp(30px,4vw,60px);line-height:1.12;margin:18px 0 0;font-weight:500;max-width:14ch}
.tline{display:block}
.hero__title em{display:block;font-style:normal}
.rule{display:flex;align-items:center;gap:16px;margin:24px 0 20px;max-width:320px}
.rule i{flex:1;height:1px;background:linear-gradient(90deg,transparent,var(--hair),transparent)}
.rule__mark{width:22px;height:22px;fill:none;stroke:var(--brass);stroke-width:1.1;
  stroke-linecap:round;stroke-linejoin:round;opacity:.9}
.hero__lead{max-width:46ch;color:#cfc7b8;font-size:clamp(15.5px,1.2vw,18px);line-height:1.6;margin:0 0 22px}
/* обёртка сжимает плашку и кнопки до одной, максимально узкой ширины (по более широкой строке) */
.hero__cta{display:inline-grid;grid-template-columns:auto;row-gap:16px;max-width:100%}
.hero__actions{display:flex;gap:16px;min-width:0}
.hero__actions .btn{flex:1 1 0;min-width:0;text-align:center;white-space:nowrap}
@media (max-width:640px){
  /* на узких екранах — колонкою, кнопки компактні САМЕ по ширині (auto), не на всю ширину екрана */
  .hero__cta{display:flex;flex-direction:column;align-items:flex-start;gap:12px;width:100%}
  .hero__actions{flex-direction:column;align-items:flex-start;gap:10px}
  .hero__actions .btn{white-space:normal;width:auto;flex:none;padding:15px 26px;font-size:11px}
  .badge{padding:9px 15px;font-size:11.5px}
}
.hero__ledger{position:absolute;left:0;right:0;bottom:0;display:grid;grid-template-columns:repeat(4,1fr);
  gap:1px;background:var(--hair-2);border-top:1px solid var(--hair)}
.js .hero__ledger{animation:riseIn 1.1s .35s cubic-bezier(.16,1,.3,1) both}
.hero__ledger div{display:flex;align-items:baseline;gap:11px;padding:13px var(--pad);
  background:linear-gradient(180deg,rgba(18,15,12,.94),rgba(8,7,6,.985));
  box-shadow:var(--edge)}
.hero__ledger b{font-family:"Playfair Display",Georgia,serif;font-size:26px;font-weight:500;color:var(--brass-lt);
  text-shadow:0 1px 0 rgba(255,246,228,.12),0 -1px 0 rgba(0,0,0,.6),0 12px 24px rgba(0,0,0,.7)}
.hero__ledger span{font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:var(--dim)}
@keyframes riseIn{from{opacity:0;transform:translateY(30px)}}

/* ---------- каркас секций ---------- */
.section{position:relative;max-width:var(--maxw);margin:0 auto;padding:clamp(42px,6.5vh,90px) var(--pad)}
.shead{display:flex;align-items:baseline;gap:22px;margin-bottom:clamp(18px,2.6vh,32px);
  padding-bottom:14px;border-bottom:1px solid var(--hair)}
.shead__num{font:500 clamp(24px,2.4vw,34px)/1 "Playfair Display",Georgia,serif;
  color:var(--brass);letter-spacing:.06em}
.shead .eyebrow{font-size:clamp(17px,1.55vw,22px);letter-spacing:.2em;color:var(--brass-lt);
  text-shadow:0 -1px 0 rgba(255,250,232,.3),0 2px 0 rgba(0,0,0,.75),0 6px 10px rgba(0,0,0,.5)}

/* главная титульная строка сайта — назва компанії, скляна пігулка під шапкою */
.hero .eyebrow{display:inline-block;margin:0;font-family:Inter,-apple-system,system-ui,sans-serif;
  font-weight:700;font-size:clamp(11px,1.55vw,16px);letter-spacing:.1em;white-space:nowrap;
  color:#eef7f3;padding:13px 28px;border-radius:999px;
  background:linear-gradient(160deg,rgba(255,255,255,.1),rgba(255,255,255,.015));
  backdrop-filter:blur(16px) saturate(160%);-webkit-backdrop-filter:blur(16px) saturate(160%);
  border:1px solid rgba(206,244,230,.2);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 18px 34px -20px rgba(0,0,0,.8),0 0 26px rgba(140,220,200,.1);
  text-shadow:0 1px 0 rgba(255,255,255,.2),0 2px 8px rgba(0,0,0,.55)}
@media (max-width:640px){
  .hero .eyebrow{font-size:clamp(8.5px,3vw,13px);letter-spacing:.02em;padding:9px 14px}
}

/* титульна стрічка компанії — вплотну під фіксованою шапкою */
.hero__kicker{position:absolute;top:0;left:0;right:0;z-index:3;display:flex;justify-content:center;
  padding:clamp(58px,7.5vh,74px) var(--pad) 12px;
  background:linear-gradient(180deg,rgba(8,7,6,.5) 0%,rgba(8,7,6,.18) 65%,transparent 100%)}
@media (max-width:720px){
  .hero__kicker{padding:clamp(50px,6.5vh,60px) var(--pad) 10px}
}
.display{font-size:clamp(26px,4vw,51px);line-height:1.1;max-width:18ch}
.display--wide{max-width:22ch;margin-bottom:clamp(20px,3vh,34px)}
.lead{font-size:clamp(17px,1.35vw,20px);line-height:1.62;color:#cfc7b8}

/* ---------- про адвоката ---------- */
.about__grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:clamp(34px,6vw,110px);align-items:start}
.portrait{margin:0}
.portrait__mat{display:block;padding:clamp(14px,1.6vw,22px);border-radius:14px;
  background:linear-gradient(160deg,rgba(255,255,255,.05),rgba(255,255,255,.005)),linear-gradient(180deg,#141109,#0c0a08);
  backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
  border:1.5px solid var(--glass-brd);box-shadow:var(--glass-shadow)}
.portrait img{transition:opacity .5s}

.portrait figcaption{margin-top:16px;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--dim)}
.about__text p{color:var(--ink-2);max-width:62ch}
.about__text .display{margin-bottom:26px}
.creed{list-style:none;margin:38px 0 0;padding:0;border-top:1px solid var(--hair)}
.creed li{display:grid;grid-template-columns:220px 1fr;gap:20px;padding:20px 0;border-bottom:1px solid var(--hair);
  color:var(--ink-2);transition:background .4s,padding-left .4s}
.creed li:hover{background:linear-gradient(90deg,rgba(176,141,87,.05),transparent);padding-left:12px}
.creed b{font-weight:500;font-family:"Playfair Display",Georgia,serif;font-size:20px;color:var(--ink)}

/* ---------- практика: компактна сітка скляних карток ---------- */
.matters{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.matter{display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-width:0;
  padding:20px 22px;border-radius:14px;
  background:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
  border:1.5px solid var(--glass-brd);box-shadow:var(--glass-shadow);
  transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s}
.matter:hover{transform:translateY(-4px)}
.matter__no{font:400 11px/1.6 Inter,sans-serif;letter-spacing:.22em;color:var(--brass)}
.matter h3{font-size:clamp(16px,1.25vw,19px);line-height:1.22}
.matter p{margin:0;color:var(--ink-2);font-size:12.5px;line-height:1.5;max-width:none}
.matter__cta{margin-top:auto;padding-top:14px}

/* ---------- документы: музейная галерея ---------- */
.cred__head{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,5vw,90px);align-items:end;margin-bottom:34px}
.cred__note p{color:var(--ink-2);margin:0 0 12px;max-width:52ch}
.filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:clamp(28px,4vh,48px)}
.filter{background:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
  border:1.5px solid var(--glass-brd);color:var(--ink-2);cursor:pointer;box-shadow:var(--glass-shadow);border-radius:999px;
  padding:10px 20px;font:400 11px/1 Inter,sans-serif;letter-spacing:.18em;text-transform:uppercase;
  transition:border-color .35s,color .35s,background .35s,transform .35s}
.filter:hover{border-color:rgba(227,203,155,.55);color:var(--brass-lt);transform:translateY(-2px)}
.filter.is-on{background:linear-gradient(155deg,var(--brass-lt),var(--brass) 55%,var(--brass-dk));
  color:#17120b;border-color:transparent;box-shadow:var(--edge)}

.plate{margin:0;transition:opacity .4s,transform .4s}
.plate[hidden]{display:none}
.plate__btn{display:block;width:100%;padding:0;border:0;background:none;cursor:pointer;color:inherit;font:inherit}
.plate__mat{display:block;padding:clamp(14px,1.5vw,22px);
  background:linear-gradient(160deg,rgba(255,255,255,.05),rgba(255,255,255,.005)),
    linear-gradient(180deg,#16130d 0%,#0d0b08 100%);
  backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
  border:1.5px solid var(--glass-brd);
  box-shadow:var(--edge),0 26px 50px -34px rgba(0,0,0,1);
  transition:border-color .45s,transform .55s cubic-bezier(.16,1,.3,1),box-shadow .55s}
.plate img{width:100%;aspect-ratio:1/1.32;object-fit:contain;
  box-shadow:0 14px 28px -18px rgba(0,0,0,.9)}
.plate__btn:hover .plate__mat,.plate__btn:focus-visible .plate__mat{
  border-color:rgba(176,141,87,.55);transform:translateY(-6px);
  box-shadow:var(--edge),0 40px 70px -34px rgba(0,0,0,1),0 0 0 1px rgba(176,141,87,.14)}

.plate__cap{display:grid;gap:5px;padding:16px 2px 0}
.plate__yr{font-size:11px;letter-spacing:.2em;color:var(--brass)}
.plate__ttl{font-family:"Playfair Display",Georgia,serif;font-size:19px;font-weight:500;line-height:1.25}
.plate__desc{font-size:12.5px;line-height:1.5;color:var(--dim)}

/* ---------- публикации: компактное оглавление в две колонки ---------- */
.index{list-style:none;counter-reset:pub;margin:0;padding:0;border-top:1px solid var(--hair);
  columns:2;column-gap:clamp(28px,4vw,56px)}
.index li{counter-increment:pub;display:grid;grid-template-columns:34px 1fr;gap:12px;align-items:baseline;
  padding:13px 0;border-bottom:1px solid var(--hair);break-inside:avoid;transition:padding-left .4s,background .4s}
.index li::before{content:counter(pub,decimal-leading-zero);font:400 11px/2 Inter,sans-serif;
  letter-spacing:.16em;color:var(--brass)}
.index li:hover{padding-left:10px;background:linear-gradient(90deg,rgba(176,141,87,.05),transparent 60%)}
.index__t{grid-column:2;display:block;font-family:"Playfair Display",Georgia,serif;font-weight:500;font-size:clamp(15px,1.15vw,17px);line-height:1.3}
.index__d{grid-column:2;display:block;margin-top:4px;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}
@media (max-width:720px){.index{columns:1}}

/* ---------- цитата ---------- */
.quote{position:relative;padding:clamp(46px,7.5vh,95px) var(--pad);overflow:hidden;
  background:linear-gradient(180deg,#100e0a,#0a0907);border-block:1.5px solid var(--glass-brd);box-shadow:var(--edge)}
.quote::before{content:"\201C";position:absolute;top:-.3em;left:50%;transform:translateX(-50%);
  font-family:"Playfair Display",Georgia,serif;font-size:clamp(300px,44vw,620px);line-height:1;
  color:rgba(176,141,87,.055);pointer-events:none}
.quote blockquote{position:relative;max-width:1040px;margin:0 auto;text-align:center}
.quote p{font-family:"Playfair Display",Georgia,serif;
  font-size:clamp(25px,3.7vw,52px);line-height:1.26;margin:0 0 26px}
.quote cite{font-style:normal;font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--brass)}

/* ---------- процес: скляні картки, як напрями/чому ми ---------- */
.track{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.track li{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:6px;
  padding:20px 22px;border-radius:14px;
  background:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
  border:1.5px solid var(--glass-brd);box-shadow:var(--glass-shadow);
  transition:transform .35s cubic-bezier(.16,1,.3,1)}
.track li:hover{transform:translateY(-4px)}
.track__dot{display:none}
.track__no{display:block;font-size:11px;letter-spacing:.2em;color:var(--brass);margin-bottom:2px}
.track h3{font-size:clamp(16px,1.25vw,19px);margin-bottom:2px;line-height:1.22}
.track p{margin:0;color:var(--ink-2);font-size:12.5px;line-height:1.5}

/* ---------- контакты: визитка ---------- */
.card-visit{display:grid;grid-template-columns:.62fr 1.38fr;border-radius:14px;overflow:hidden;
  border:1.5px solid var(--glass-brd);box-shadow:var(--lift);background:var(--glass-brd);gap:1px}
.card-visit__side{padding:clamp(20px,2.6vw,32px);
  background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,.01)),linear-gradient(160deg,#16120c,#0c0a08);
  backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);box-shadow:var(--edge);
  display:flex;flex-direction:column;justify-content:center;gap:12px}

.card-visit__name{font-family:"Playfair Display",Georgia,serif;font-weight:500;font-size:clamp(22px,2.2vw,30px);
  line-height:1.1;margin:0}
.card-visit__main{padding:clamp(20px,2.6vw,36px);
  background:linear-gradient(180deg,rgba(255,247,230,.03),transparent 55%),var(--bg-2);box-shadow:var(--edge)}
.card-visit__main .display{margin-bottom:10px;font-size:clamp(20px,2.6vw,32px)}
.card-visit__main .lead{max-width:46ch;margin:0 0 18px;font-size:clamp(14px,1.1vw,16px)}
.lines{list-style:none;margin:0;padding:0;border-top:1px solid var(--hair)}
.lines li{border-bottom:1px solid var(--hair)}
.lines a,.lines__static{display:flex;align-items:baseline;gap:20px;padding:13px 0;text-decoration:none;
  transition:padding-left .4s,background .4s}
.lines a:hover{padding-left:12px;background:linear-gradient(90deg,rgba(176,141,87,.06),transparent 60%)}
.lines__k{min-width:104px;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--brass)}
.lines__v{font-family:"Playfair Display",Georgia,serif;font-size:20px;font-weight:500;color:var(--ink)}
.lines a .lines__v{transition:color .35s}
.lines a:hover .lines__v{color:var(--brass-lt)}



.footer{display:flex;flex-wrap:wrap;gap:12px 32px;justify-content:space-between;
  padding:30px var(--pad);border-top:1px solid var(--hair)}
.footer__legal{width:100%;order:3}
.footer__legal a{color:var(--dim);text-decoration:none;transition:color .3s}
.footer__legal a:hover{color:var(--brass-lt)}

/* ---------- лайтбокс ---------- */
.lightbox{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;
  gap:clamp(8px,2vw,30px);padding:clamp(16px,4vw,60px);
  background:radial-gradient(120% 90% at 50% 40%, #0e0c09, #040403);
  animation:fadeIn .35s ease}
.lightbox[hidden]{display:none}
@keyframes fadeIn{from{opacity:0}}
.lightbox img{max-width:min(86vw,880px);max-height:64vh;object-fit:contain;
  padding:18px;background:linear-gradient(180deg,#16130d,#0d0b08);
  box-shadow:0 60px 130px rgba(0,0,0,.9),0 0 0 1px rgba(226,213,186,.1)}
.lightbox__close,.lightbox__nav{color:var(--ink);cursor:pointer;width:50px;height:50px;
  font-size:24px;line-height:1;flex:0 0 50px;border-radius:50%;
  background:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
  border:1.5px solid var(--glass-brd);box-shadow:var(--glass-shadow);
  transition:border-color .3s,color .3s,transform .3s}
.lightbox__close:hover,.lightbox__nav:hover{border-color:rgba(227,203,155,.55);color:var(--brass-lt);transform:translateY(-2px)}
.lightbox__close{position:absolute;top:clamp(14px,3vw,34px);right:clamp(14px,3vw,34px)}
.lightbox__cap{position:absolute;left:0;right:0;bottom:0;text-align:center;padding:26px 20px 30px;
  background:linear-gradient(180deg,transparent,rgba(6,5,4,.94) 45%)}
.lightbox__title{font-family:"Playfair Display",Georgia,serif;font-size:23px;font-weight:500;margin:0 0 8px}
.lightbox__desc{max-width:70ch;margin:0 auto}

/* ---------- появление ---------- */
.js .reveal{opacity:0;transform:translateY(30px);transition:opacity 1s cubic-bezier(.16,1,.3,1),transform 1s cubic-bezier(.16,1,.3,1)}
.js .reveal.is-in{opacity:1;transform:none}
a:focus-visible,button:focus-visible{outline:1px solid var(--brass);outline-offset:4px}

/* ---------- адаптив ---------- */
@media (max-width:1200px){
  .nav__links{gap:20px}
  .nav__links a{font-size:10px;letter-spacing:.12em}
  .nav__links .idx{display:none}
}
@media (max-width:1040px){
  .about__grid,.cred__head,.card-visit{grid-template-columns:1fr}
  .track{grid-template-columns:repeat(2,1fr)}
  .matters{grid-template-columns:repeat(2,1fr)}
  .hero__ledger{grid-template-columns:repeat(2,1fr)}
  .hero__rail{display:none}
}
@media (max-width:720px){
  .hero__ledger{grid-template-columns:1fr 1fr}
  .hero__ledger div{padding:14px var(--pad)}
  .hero__ledger b{font-size:24px}
  .creed li{grid-template-columns:1fr;gap:4px}
  .track{grid-template-columns:1fr}
  .gallery{grid-template-columns:repeat(2,1fr)}
  .lightbox__nav{position:absolute;bottom:calc(clamp(14px,3vw,34px) + 78px)}
  .lightbox__nav--prev{left:20px}
  .lightbox__nav--next{right:20px}
  .lines a,.lines__static{flex-direction:column;gap:4px}
  .lines__k{min-width:0}
}
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms!important;transition-duration:.01ms!important}
  .reveal{opacity:1;transform:none}
}

@media (max-height:760px) and (min-width:721px){
  .hero__title{font-size:clamp(30px,4.2vw,54px)}
  .hero__lead{font-size:16px;margin-bottom:26px}
  .rule{margin:20px 0 18px}
  .hero__ledger div{padding:14px var(--pad)}
  .hero__ledger b{font-size:24px}
}

/* ---------- полоса прочитанного ---------- */
.progress{position:fixed;top:0;left:0;right:0;height:2px;z-index:99;pointer-events:none;
  background:rgba(226,213,186,.06)}
.progress i{display:block;height:100%;width:100%;transform:scaleX(0);transform-origin:0 50%;
  background:linear-gradient(90deg,var(--brass-dk),var(--brass) 45%,var(--brass-lt));
  box-shadow:0 0 18px rgba(176,141,87,.6)}

/* ---------- объём: плиты и стекло ---------- */
.matter{position:relative}
.matter::after{content:"";position:absolute;left:0;right:0;top:0;bottom:0;pointer-events:none;opacity:0;
  background:linear-gradient(180deg,rgba(255,246,228,.05),transparent 60%);
  box-shadow:var(--edge),0 30px 60px -40px rgba(0,0,0,1);transition:opacity .45s}
.matter:hover::after{opacity:1}

.plate__mat{transform-style:preserve-3d}
.plate__btn:hover .plate__mat{will-change:transform}
.plate__mat::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;
  background:linear-gradient(115deg,transparent 35%,rgba(255,246,228,.14) 50%,transparent 65%);
  transition:opacity .5s}
.plate__btn:hover .plate__mat::after{opacity:1}
.plate__btn{perspective:900px}

.card-visit{position:relative}
.card-visit::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(150deg,rgba(255,246,228,.06),transparent 42%)}

/* печать */




/* лавр в цитате */



/* курсор-кольцо (только мышь) */
@media (hover:hover) and (pointer:fine){
  .cursor{position:fixed;top:0;left:0;width:24px;height:24px;margin:0;
    border:1px solid rgba(226,213,186,.6);border-radius:50%;z-index:98;pointer-events:none;
    will-change:transform;box-shadow:0 0 0 1px rgba(0,0,0,.35)}
  .cursor::after{content:"";position:absolute;inset:-1px;border-radius:50%;
    border:1px solid transparent;transition:inset .25s cubic-bezier(.16,1,.3,1),border-color .25s}
  .cursor.is-hot::after{inset:-13px;border-color:rgba(226,213,186,.5)}
  .cursor.is-down::after{inset:-6px;border-color:var(--brass-lt)}
}

@media (max-width:1500px){.hero__rail{display:none}}
@media (max-width:1040px){
  .hero__inner{grid-template-columns:1fr}

  
}
@media (max-width:1080px){
  /* компактна панель праворуч; ховаємо через right, а не transform — на iOS Safari
     position:fixed+transform у нативному вью інколи лишає видимий шов при закритому стані */
  .nav__links{grid-column:1/-1;justify-self:stretch;
    position:fixed;top:0;right:-250px;bottom:auto;left:auto;width:220px;max-width:72vw;
    max-height:calc(100svh - 24px);overflow-y:auto;z-index:3;border-radius:0 0 0 16px;
    background:linear-gradient(165deg,rgba(255,255,255,.06),rgba(255,255,255,.005)),linear-gradient(180deg,#131110,#0a0908);
    backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);
    border-left:1.5px solid var(--glass-brd);border-bottom:1.5px solid var(--glass-brd);
    box-shadow:-16px 20px 40px -18px rgba(0,0,0,.7);
    flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:2px;
    padding:20px 24px 24px;
    transition:right .4s cubic-bezier(.16,1,.3,1)}
  .nav.is-open .nav__links{right:0}
  .nav__links a{font-size:13.5px;letter-spacing:.1em;padding:9px 0;width:100%}
  /* хрестик закриття — завжди лежить у самій панелі, бургер під нею не дістати */
  .nav__close{display:block;align-self:flex-end;margin-bottom:22px;
    background:none;border:0;color:var(--ink-2);font-size:20px;line-height:1;padding:6px;cursor:pointer}
  .nav__close:hover{color:var(--brass-lt)}
  .nav__burger{display:block;position:relative;z-index:2}
  .nav__logo{position:relative;z-index:2}
  .nav.is-open .nav__burger span:first-child{transform:translateY(3.5px) rotate(45deg)}
  .nav.is-open .nav__burger span:last-child{transform:translateY(-3.5px) rotate(-45deg)}
  .nav.is-open .lang{position:relative;z-index:2}
  /* затемнення решти екрана — тап поза панеллю закриває меню */
  .nav__backdrop{position:fixed;inset:0;z-index:1;background:rgba(6,5,4,.6);
    opacity:0;pointer-events:none;transition:opacity .4s}
  .nav.is-open .nav__backdrop{opacity:1;pointer-events:auto}
}
@media (max-width:720px){
  .hero{padding:110px var(--pad) 200px}

  
}

/* ---------- переключатель мови ---------- */
.lang{grid-column:3;display:flex;gap:2px;padding:2px;border-radius:999px;background:var(--glass-bg);
  backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
  border:1.5px solid var(--glass-brd);box-shadow:var(--glass-shadow)}
.lang button{border-radius:999px;
  background:transparent;border:0;cursor:pointer;color:var(--dim);
  font:400 11px/1 Inter,sans-serif;letter-spacing:.14em;padding:8px 11px;
  transition:color .3s,background .3s}
.lang button:hover{color:var(--ink)}
.lang button.is-on{
  color:#17120b;
  background:linear-gradient(155deg,var(--brass-lt),var(--brass) 55%,var(--brass-dk));
  box-shadow:var(--edge)}
@media (max-width:1200px){.lang button{padding:7px 9px;font-size:10.5px}}
@media (max-width:720px){
  .nav.is-open .lang{position:relative;z-index:2}
}

/* ---------- разгрузка отрисовки ---------- */
/* браузер не рисует то, что сейчас за экраном; размер подсказан заранее, чтобы полоса прокрутки не прыгала */

.plate{contain:layout paint}

@media (max-width:720px){
  .nav{column-gap:12px}
  .lang button{padding:7px 8px;font-size:10.5px;letter-spacing:.08em}
}

/* ---------- мессенджеры: компактный ряд ---------- */
.chats{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:18px}
.chat{
  display:inline-flex;align-items:center;gap:9px;text-decoration:none;
  padding:11px 16px;color:var(--ink-2);border-radius:999px;
  background:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
  border:1.5px solid var(--glass-brd);box-shadow:var(--glass-shadow);
  font-size:12px;letter-spacing:.1em;
  transition:border-color .35s,color .35s,transform .35s cubic-bezier(.16,1,.3,1);
}
.chat svg{width:17px;height:17px;flex:0 0 17px;fill:none;stroke:var(--brass);stroke-width:1.3;
  stroke-linecap:round;stroke-linejoin:round;transition:stroke .35s}
.chat:hover{border-color:rgba(176,141,87,.55);color:var(--ink);transform:translateY(-2px)}
.chat:hover svg{stroke:var(--brass-lt)}


@media (max-width:560px){
  .chats{gap:8px}
  .chat{padding:10px 13px;font-size:11.5px}

}

@media (max-width:1040px){
  /* фото занимает верх экрана, текст идёт под ним обычным потоком (без 100svh + flex-end трюка) */
  .hero{align-items:flex-start;min-height:0;padding-top:0;padding-bottom:96px}
  .hero__inner{grid-template-columns:minmax(0,100%);
    margin-top:calc(clamp(86px,11vh,120px) + min(52svh,520px) + 28px)}
  .hero__media{width:100%;top:clamp(86px,11vh,120px);bottom:auto;height:min(52svh,520px);
    -webkit-mask-image:linear-gradient(180deg,#000 52%,transparent 96%);
    mask-image:linear-gradient(180deg,#000 52%,transparent 96%)}
  .hero__media img{object-position:50% 26%}
  .hero__media::after{background:
    linear-gradient(180deg,rgba(8,7,6,.5) 0%,transparent 26%,rgba(8,7,6,.85) 88%)}
  .hero__panel{padding-top:0}
}

/* ---------- акцент дистанционной работы ---------- */
.badge{display:flex;align-items:center;gap:11px;margin:0;max-width:100%;white-space:normal;
  padding:11px 18px;color:var(--brass-lt);border-radius:999px;
  background:var(--glass-bg);backdrop-filter:blur(20px) saturate(200%);-webkit-backdrop-filter:blur(20px) saturate(200%);
  border:1.5px solid var(--glass-brd);font-size:12.5px;letter-spacing:.06em;box-shadow:var(--glass-shadow)}
@media (min-width:641px){.badge{white-space:nowrap}}
.badge__dot{width:7px;height:7px;flex:0 0 7px;border-radius:50%;background:var(--brass-lt);
  box-shadow:0 0 0 4px rgba(184,146,74,.18)}

/* ---------- направления ---------- */
.practice__head{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,72px);
  align-items:end;margin-bottom:clamp(28px,4vh,52px)}
.practice__head p{color:var(--ink-2);margin:0;max-width:56ch}
.practice__head .display{margin-bottom:0}
.matter__body{min-width:0;display:flex;flex-direction:column;gap:6px}
.matter__tag{display:inline-block;margin:2px 0 0;padding:4px 10px;
  font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:#17120b;
  background:linear-gradient(155deg,var(--brass-lt),var(--brass) 60%,var(--brass-dk))}
.matter--key{background:linear-gradient(160deg,rgba(255,255,255,.1),rgba(184,146,74,.08)),var(--glass-bg);
  border-color:rgba(227,203,155,.6)}
.matter--key h3{color:var(--brass-lt)}
.matter__cta{white-space:nowrap;text-decoration:none;border-radius:999px;
  padding:9px 16px;color:var(--ink-2);background:var(--glass-bg);
  backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
  border:1.5px solid var(--glass-brd);box-shadow:var(--glass-shadow);
  font-size:10px;letter-spacing:.16em;text-transform:uppercase;
  transition:border-color .35s,color .35s,transform .35s cubic-bezier(.16,1,.3,1)}
.matter__cta:hover{border-color:rgba(227,203,155,.55);color:var(--brass-lt);transform:translateY(-2px)}

/* ---------- почему мы ---------- */
.why__list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.why__list li{display:flex;flex-direction:column;align-items:flex-start;gap:6px;
  padding:20px 22px;border-radius:14px;
  background:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
  border:1.5px solid var(--glass-brd);box-shadow:var(--glass-shadow);
  transition:transform .35s cubic-bezier(.16,1,.3,1)}
.why__list li:hover{transform:translateY(-4px)}
.why__ico{display:grid;place-items:center;width:40px;height:40px;margin-bottom:6px;border-radius:11px;
  background:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
  border:1.5px solid var(--glass-brd);box-shadow:var(--glass-shadow)}
.why__ico svg{width:18px;height:18px;fill:none;stroke:var(--brass);stroke-width:1.3;
  stroke-linecap:round;stroke-linejoin:round}
.why__list h3{font-size:clamp(16px,1.25vw,19px);margin-bottom:0;line-height:1.22}
.why__list p{margin:0;color:var(--ink-2);font-size:12.5px;line-height:1.5}

/* ---------- форма заявки ---------- */









.chats__label{margin:0 0 12px}

/* ---------- плавающая кнопка заявки ---------- */




@media (max-width:1040px){
  .practice__head{grid-template-columns:1fr}
  .why__list{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:640px){
  .why__list{grid-template-columns:1fr}
  .matters{grid-template-columns:1fr}
}

/* ---------- объёмная типографика ---------- */
/* светлый текст с переливом: сверху тёплый кремовый, книзу глубже — усиленный рельеф */
.display,.hero__title .tline:not(em){
  background:linear-gradient(178deg,#ffffff 0%,#fdfaf3 55%,#eee6d2 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  -webkit-text-fill-color:transparent;
  text-shadow:none;
  filter:
    drop-shadow(0 -1.5px 0 rgba(255,253,248,.6))   /* тонкая грань сверху */
    drop-shadow(0 3px 0 rgba(0,0,0,.88))           /* уступ снизу — рельеф без свечения */
    drop-shadow(0 8px 14px rgba(0,0,0,.65));
}
/* золотые строки — металлический перелив с бликом, глубже и контрастнее */
.hero__title em,.display em{
  background:linear-gradient(176deg,#fff9ec 0%,#f9ecc8 32%,#e9cc95 68%,#c9a768 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  -webkit-text-fill-color:transparent;
  text-shadow:none;
  filter:
    drop-shadow(0 -1.5px 0 rgba(255,249,232,.65))
    drop-shadow(0 3px 0 rgba(30,20,6,.92))
    drop-shadow(0 8px 14px rgba(0,0,0,.6));
}
/* мелкие золотые надписи — с тонкой тёмной обводкой, чтобы читались на фото */
.eyebrow,.shead__num,.matter__no,.plate__yr,.track__no,.lines__k,.hero__ledger span{
  text-shadow:0 1px 0 rgba(0,0,0,.7),0 2px 6px rgba(0,0,0,.5)}
.hero__ledger b{
  background:linear-gradient(176deg,#f9ecc8,var(--brass-lt) 40%,var(--brass) 78%,#77592a);
  -webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 -1px 0 rgba(255,249,232,.4)) drop-shadow(0 2px 0 rgba(0,0,0,.65))}
/* лид и абзацы — лёгкая посадка на фон */
.hero__lead,.lead{text-shadow:0 1px 3px rgba(0,0,0,.65)}
.matters h3,.why__list h3,.track h3,.plate__ttl,.index__t{
  text-shadow:0 -1.5px 0 rgba(255,252,246,.4),0 3px 0 rgba(0,0,0,.85),0 8px 14px rgba(0,0,0,.6)}
/* объёмные лейблы навигации и мелких надписей — не сливаются с фоном/фото */
.nav__links a,.micro,.dim,.hours__note,.footer,.card-visit__addr,
.lines__v,.chat,.matter__cta,.filter,.badge,.plate__desc,.why__list p,.matter p,.about__text p,
.track p,.index__d,.quote cite,.creed b,.creed span,.card-visit__name,.card-visit__side *,
.gal-btn,.lang button{text-shadow:0 1px 3px rgba(0,0,0,.55)}
.quote p{text-shadow:0 -1px 0 rgba(255,252,246,.3),0 3px 0 rgba(0,0,0,.8),0 10px 18px rgba(0,0,0,.6)}

/* ---------- мобільна різкість: менше блюру й розмитих тіней — на маленькому екрані вони читаються як "мило" ---------- */
@media (max-width:720px){
  :root{
    --glass-blur:blur(10px) saturate(180%);
    --glass-shadow:inset 0 1.5px 0 rgba(255,255,255,.65),inset 0 -1px 0 rgba(0,0,0,.4),
      0 14px 26px -14px rgba(0,0,0,.9),0 2px 0 rgba(0,0,0,.5),0 0 0 1px rgba(0,0,0,.5);
  }
  .display,.hero__title .tline:not(em){
    filter:drop-shadow(0 -1px 0 rgba(255,253,248,.6)) drop-shadow(0 2px 0 rgba(0,0,0,.88)) drop-shadow(0 3px 4px rgba(0,0,0,.55))}
  .hero__title em,.display em{
    filter:drop-shadow(0 -1px 0 rgba(255,249,232,.65)) drop-shadow(0 2px 0 rgba(30,20,6,.92)) drop-shadow(0 3px 4px rgba(0,0,0,.5))}
  .matters h3,.why__list h3,.track h3,.plate__ttl,.index__t{
    text-shadow:0 -1px 0 rgba(255,252,246,.4),0 2px 0 rgba(0,0,0,.85),0 3px 4px rgba(0,0,0,.5)}
  .quote p{text-shadow:0 -1px 0 rgba(255,252,246,.3),0 2px 0 rgba(0,0,0,.8),0 4px 6px rgba(0,0,0,.5)}
}

/* ---------- адрес в визитке ---------- */
.card-visit__addr{display:flex;align-items:flex-start;gap:9px;margin:14px 0 0;
  font-size:13px;line-height:1.45;color:var(--ink-2);max-width:24ch}
.card-visit__addr svg{width:16px;height:16px;flex:0 0 16px;margin-top:2px;fill:none;
  stroke:var(--brass);stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}

/* ---------- свёрнутая галерея документов ---------- */
.gallery-toggle{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin-bottom:16px}
.gal-btn{
  display:inline-flex;align-items:center;gap:10px;cursor:pointer;border-radius:999px;
  padding:12px 22px;color:var(--brass-lt);
  background:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
  border:1.5px solid var(--glass-brd);
  font:400 11px/1 Inter,sans-serif;letter-spacing:.2em;text-transform:uppercase;
  box-shadow:var(--glass-shadow);transition:border-color .35s,color .35s,transform .35s cubic-bezier(.16,1,.3,1)}
.gal-btn::before{content:"";width:8px;height:8px;border-right:1px solid currentColor;
  border-bottom:1px solid currentColor;transform:rotate(45deg) translate(-2px,-2px);transition:transform .35s}
.gal-btn[aria-expanded="true"]::before{transform:rotate(-135deg) translate(-3px,-3px)}
.gal-btn:hover{border-color:var(--brass-lt);color:#fff6e2;transform:translateY(-2px)}

/* свёрнутый вид: вместо сетки миниатюр — компактные строки с названиями */
.gallery{display:block;border-top:1px solid var(--hair)}
.gallery .plate{border-bottom:1px solid var(--hair)}
.gallery .plate__btn{
  display:grid;grid-template-columns:74px minmax(0,1fr) auto;gap:18px;align-items:center;
  width:100%;padding:14px 6px;text-align:left;transition:background .35s,padding-left .35s}
.gallery .plate__btn:hover{background:linear-gradient(90deg,rgba(184,146,74,.07),transparent 60%);padding-left:14px}
.gallery .plate__mat{display:none}
.gallery .plate__cap{display:contents}
.gallery .plate__yr{font-size:11px;letter-spacing:.16em;color:var(--brass)}
.gallery .plate__ttl{font-size:clamp(15px,1.3vw,18px);line-height:1.3;
  font-family:"Playfair Display",Georgia,serif;color:var(--ink)}
.gallery .plate__btn:hover .plate__ttl{color:var(--brass-lt)}
.gallery .plate__desc{display:none}
.gallery .plate figcaption{display:none}
/* стрелка-указатель в конце строки */
.gallery .plate__btn::after{content:"→";color:var(--brass);font-size:14px;opacity:0;transition:opacity .35s,transform .35s}
.gallery .plate__btn:hover::after{opacity:1;transform:translateX(3px)}

@media (max-width:640px){
  .gallery .plate__btn{grid-template-columns:60px minmax(0,1fr);gap:12px}
  .gallery .plate__btn::after{display:none}
}

/* телефон: подтверждение копирования на компьютере */
.chat--phone.is-copied{border-color:var(--brass-lt);color:var(--brass-lt)}
.chat--phone.is-copied svg{stroke:var(--brass-lt)}

/* стрелка кнопки: вниз, когда список скрыт */
.gal-btn[aria-expanded="false"]::before{transform:rotate(45deg) translate(-2px,-2px)}

/* display в правилах выше сильнее атрибута hidden — возвращаем ему силу */
[hidden]{display:none!important}

/* ---------- график работы ---------- */
.hours{margin-top:16px;padding-top:14px;border-top:1px solid var(--hair)}
.hours__val{display:flex;align-items:center;gap:10px;margin:12px 0 10px;
  font-family:"Playfair Display",Georgia,serif;font-size:clamp(19px,1.7vw,23px);color:var(--ink)}
.hours__val svg{width:18px;height:18px;flex:0 0 18px;fill:none;stroke:var(--brass);
  stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
.hours__note{margin:0;color:var(--ink-2);font-size:14px;line-height:1.55;max-width:56ch}

/* ---------- лента фактов: компактнее, особенно на телефоне ---------- */
.hero__ledger div{padding:11px clamp(14px,3vw,var(--pad));gap:9px;align-items:center}
.hero__ledger b{font-size:clamp(19px,1.7vw,25px);line-height:1}
.hero__ledger span{font-size:11px;letter-spacing:.09em;line-height:1.25}

@media (max-width:1040px){
  /* четыре факта в одну строку с горизонтальной прокруткой — не съедает высоту экрана */
  .hero__ledger{display:flex;overflow-x:auto;scroll-snap-type:x proximity;
    -webkit-overflow-scrolling:touch;scrollbar-width:none}
  .hero__ledger::-webkit-scrollbar{display:none}
  .hero__ledger div{flex:0 0 auto;scroll-snap-align:start;padding:10px 16px;
    border-right:1px solid var(--hair-2)}
  .hero__ledger div:last-child{border-right:0}
  .hero__ledger b{font-size:18px}
  .hero__ledger span{font-size:11px;letter-spacing:.06em;max-width:15ch}
}
@media (max-width:560px){
  .hero__ledger div{padding:9px 13px}
  .hero__ledger b{font-size:17px}
}

/* адрес — ссылка на карты */
a.card-visit__addr{text-decoration:none;transition:color .3s}
a.card-visit__addr:hover{color:var(--brass-lt)}
a.card-visit__addr:hover svg{stroke:var(--brass-lt)}

/* ---------- орнаментальный разделитель над цитатой ---------- */
.ornament{position:relative;display:block;width:min(240px,60%);margin:0 auto clamp(22px,3vh,38px)}
.ornament svg{width:100%;height:auto;display:block;
  fill:none;stroke:var(--brass);stroke-width:1.1;stroke-linecap:round;stroke-linejoin:round;
  opacity:.75}
.ornament svg circle{fill:var(--brass);stroke:none}

/* ---------- фирменный логотип (реальный файл) ---------- */
.mark{display:block;height:auto}
.mark--nav{width:44px;flex:0 0 44px}
.mark--card{width:min(150px,55%);height:auto;margin:0 auto}
/* водяной знак на первом экране — крупный, за текстом */
.scales{position:absolute;left:18%;top:47%;transform:translate(-38%,-50%);
  width:min(62vh,600px);height:auto;opacity:.09;pointer-events:none}
.seal{display:block;width:120px;height:auto;margin:0 0 24px;opacity:.85}

@media (max-width:1040px){
  .scales{left:auto;right:-6%;top:auto;bottom:12%;transform:none;width:min(58vw,340px);opacity:.07}
}
@media (max-width:560px){
  .mark--nav{width:38px;flex:0 0 38px}
  .mark--card{width:min(200px,66%)}
  .scales{width:min(64vw,280px);opacity:.06;bottom:16%}
}