/* =========================================================================
   spektr.css — редизайн «C — Спектр» (головна). v1-стилі (style.css) не чіпаємо.
   Палітра, типографіка і «промениста мова» — за docs/REDESIGN-C.md.
   Правила: hover = тільки світло (brightness/колір ≤200ms), без transform;
   без JS все видиме; prefers-reduced-motion → статика.
   ========================================================================= */

:root{
  /* фони */
  --bg-deep:#0c1626; --bg:#12213a; --bg-2:#182a45; --bg-3:#1f3557;
  /* текст */
  --t-head:#f3efe2; --t-body:#e9e6dc; --t-sec:#a7b3c6; --t-meta:#5f6c82;
  /* золото */
  --gold:#d4af37; --gold-hi:#f4e3a1; --gold-lo:#9a5b2f;
  /* спектр напрямів λ01–λ07 */
  --l1:#f4e3a1; --l2:#e8ce7a; --l3:#d4af37; --l4:#c39a2e;
  --l5:#b0812f; --l6:#a06e2c; --l7:#8f5c28;
  --serif:'Cormorant Garamond',Georgia,serif;
  --sans:'Manrope',system-ui,-apple-system,sans-serif;
  --line:rgba(243,239,226,.08);
  --gline:rgba(212,175,55,.22);
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
html:focus-within{scroll-behavior:smooth}
body{
  font-family:var(--sans);
  background-color:var(--bg);
  color:var(--t-body);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
/* Преміум-фон: глибокий navy з м'яким верхнім світлом і ледь помітним зерном.
   Фото — дозовано: лише hero та контакти (масковані), не «шпалери» під усім. */
body::before{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(1300px 800px at 72% -12%, rgba(34,54,88,.85), transparent 62%),
    radial-gradient(1000px 700px at -10% 108%, rgba(26,44,72,.6), transparent 55%),
    linear-gradient(180deg,#15263f 0%,#111f36 58%,#0d1728 100%);
}
body::after{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.05;
  background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");
}
img{max-width:100%;display:block}
a{color:inherit}
::selection{background:rgba(212,175,55,.3);color:#fff8e6}

.ic{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;
    stroke-linecap:round;stroke-linejoin:round;flex:none}

.wrap{max-width:1220px;margin:0 auto;padding:0 clamp(20px,5vw,64px)}

/* --- типографіка ------------------------------------------------------ */
.kicker{font-size:11px;letter-spacing:.38em;text-transform:uppercase;color:var(--gold)}
.sec-head{max-width:780px;margin-bottom:clamp(36px,6vh,58px)}
.sec-title{
  font:600 clamp(34px,4.6vw,58px)/1.08 var(--serif);
  color:var(--t-head);margin-top:18px;
}
h1 em, .sec-title em{
  font-style:italic;
  background:linear-gradient(100deg,#f4e3a1,#d4af37 45%,#9a5b2f);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.lead{margin-top:16px;color:var(--t-sec);font-size:15.5px;line-height:1.75;max-width:62ch}

:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

/* якорі не ховаються під фіксованою шапкою */
section[id],.hero{scroll-margin-top:78px}

/* --- секції: 3 шари (фото → промені → контент) ------------------------ */
section.sec{position:relative;padding:clamp(88px,12vh,140px) 0;overflow:hidden}
/* ритм секцій: базовий тон чергується з глибшим, межі — тонкі золоті лінії */
.sec--deep{background:rgba(9,16,28,.5);
  border-top:1px solid rgba(212,175,55,.1);border-bottom:1px solid rgba(212,175,55,.1)}
.sec .wrap{position:relative;z-index:3}

/* фото лише у hero та контактах; решта секцій — чистий колір */
.layer-photo{display:none}
.ph-hero,.ph-kontakty{
  display:block;position:absolute;left:0;right:0;top:-8%;bottom:-8%;
  background-position:center;background-size:cover;background-repeat:no-repeat;
  pointer-events:none;z-index:0;
}
/* duotone: градієнт у hue секції поверх фото через background-blend */
/* hero: бібліотека праворуч, з плавним розчиненням у фон */
.ph-hero{
  background-image:linear-gradient(115deg,rgba(11,21,38,.62) 28%,rgba(212,175,55,.26)),
    url('/assets/img/bg-hero.jpg');
  background-blend-mode:multiply;opacity:.3;
  -webkit-mask-image:linear-gradient(to left,#000 26%,transparent 80%);
          mask-image:linear-gradient(to left,#000 26%,transparent 80%);
}
/* фонові фото лишаємо тільки на hero і в контактах — решту прибрано */
.ph-napryamy,.ph-protses,.ph-chomu,.ph-faq{display:none}
/* бібліотека: частково, праворуч, з плавним розчиненням у фон */
.ph-protses{
  background-image:linear-gradient(160deg,rgba(11,21,38,.6),rgba(196,154,46,.24)),
    url('/assets/img/bg-hero.jpg');
  background-blend-mode:multiply;opacity:.22;
  -webkit-mask-image:linear-gradient(to left,#000 6%,rgba(0,0,0,.75) 30%,transparent 66%);
          mask-image:linear-gradient(to left,#000 6%,rgba(0,0,0,.75) 30%,transparent 66%);
}
.ph-chomu{
  background-image:linear-gradient(115deg,rgba(11,21,38,.6),rgba(176,129,47,.3)),
    url('https://images.unsplash.com/photo-1589829545856-d10d557cf95f?q=80&w=1600&auto=format&fit=crop');
  background-blend-mode:multiply;opacity:.18;
  -webkit-mask-image:linear-gradient(to right,#000 22%,transparent 74%);
          mask-image:linear-gradient(to right,#000 22%,transparent 74%);
}
/* книжкові полиці: частково, ліворуч, м'який перехід */
.ph-faq{
  background-image:linear-gradient(115deg,rgba(11,21,38,.62),rgba(160,110,44,.26)),
    url('https://images.unsplash.com/photo-1481627834876-b7833e8f5570?q=80&w=1600&auto=format&fit=crop');
  background-blend-mode:multiply;opacity:.2;
  -webkit-mask-image:linear-gradient(to right,#000 10%,rgba(0,0,0,.7) 34%,transparent 68%);
          mask-image:linear-gradient(to right,#000 10%,rgba(0,0,0,.7) 34%,transparent 68%);
}
.ph-kontakty{
  background-image:linear-gradient(140deg,rgba(11,21,38,.68),rgba(143,92,40,.3)),
    url('/assets/img/bg-kontakty.jpg');
  background-blend-mode:multiply;opacity:.13;
  -webkit-mask-image:linear-gradient(to bottom,transparent 2%,#000 30%,#000 72%,transparent 98%);
          mask-image:linear-gradient(to bottom,transparent 2%,#000 30%,#000 72%,transparent 98%);
}

/* діагональні промені-лінії прибрано за проханням замовника */
.rays-svg{display:none}

/* --- похилий промінь-роздільник між секціями --------------------------- */
.beam-div{position:relative;height:72px;overflow:hidden}
.beam-div--deep{background:transparent}
.beam-div svg{position:absolute;inset:0;width:100%;height:100%;display:block}

/* --- шапка -------------------------------------------------------------- */
.site-header{
  position:fixed;top:0;left:0;right:0;z-index:80;
  border-bottom:1px solid transparent;
  transition:background .25s ease,border-color .25s ease;
}
.site-header.scrolled{
  background:rgba(7,13,23,.88);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  border-bottom-color:rgba(212,175,55,.16);
}
.hd-in{display:flex;align-items:center;gap:26px;min-height:74px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand img{width:38px;height:auto}
.brand .bn{font:600 13px/1.2 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--t-head)}
.brand .bn small{display:block;font-size:8.5px;font-weight:500;letter-spacing:.3em;color:var(--t-meta);margin-top:3px}
.hd-nav{display:flex;gap:clamp(14px,2vw,26px);margin-left:auto}
.hd-nav a{
  font:600 11.5px/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;
  color:var(--t-sec);text-decoration:none;padding:6px 0;transition:color .16s ease;
}
.hd-nav a:hover{color:var(--gold-hi)}
.hd-phone{
  display:flex;align-items:center;gap:8px;text-decoration:none;
  font:600 12.5px/1 var(--sans);letter-spacing:.06em;color:var(--t-body);
  transition:color .16s ease;white-space:nowrap;
}
.hd-phone:hover{color:var(--gold-hi)}
.hd-phone .ic{width:16px;height:16px;color:var(--gold)}
.hd-cta{
  font:700 11px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;
  color:var(--gold);border:1px solid rgba(212,175,55,.5);
  padding:12px 18px;text-decoration:none;white-space:nowrap;
  transition:background .18s ease,color .18s ease;
}
.hd-cta:hover{background:rgba(212,175,55,.14)}
.burger{
  display:none;width:44px;height:44px;background:none;border:0;cursor:pointer;
  flex-direction:column;justify-content:center;align-items:center;gap:6px;
}
.burger span{display:block;width:24px;height:2px;background:var(--gold);transition:transform .22s ease,opacity .22s ease}
body.menu-open .burger span:nth-child(1){transform:translateY(8px) rotate(45deg)}
body.menu-open .burger span:nth-child(2){opacity:0}
body.menu-open .burger span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}

/* мобільне меню */
.m-menu{
  position:fixed;inset:0;z-index:70;padding:104px 28px 32px;
  background:rgba(6,11,20,.97);display:flex;flex-direction:column;
  opacity:0;visibility:hidden;transition:opacity .22s ease,visibility .22s ease;
}
body.menu-open .m-menu{opacity:1;visibility:visible}
body.menu-open{overflow:hidden}
.m-menu nav{display:flex;flex-direction:column}
.m-menu nav a{
  font:600 27px/1.25 var(--serif);color:var(--t-head);text-decoration:none;
  padding:13px 0;border-bottom:1px solid var(--line);transition:color .16s ease;
}
.m-menu nav a:hover{color:var(--gold-hi)}
.m-contacts{margin-top:auto;display:flex;flex-direction:column;gap:14px;padding-top:26px}
.m-contacts a{
  display:flex;align-items:center;gap:10px;text-decoration:none;
  font:600 14px/1 var(--sans);color:var(--t-sec);transition:color .16s ease;
}
.m-contacts a:hover{color:var(--gold-hi)}
.m-contacts .ic{color:var(--gold)}

/* --- HERO ---------------------------------------------------------------- */
.hero{
  position:relative;min-height:100svh;display:flex;align-items:center;
  padding:150px 0 100px;overflow:hidden;
  background:radial-gradient(1100px 700px at 30% 40%,rgba(32,52,86,.7) 0%,transparent 62%);
}
.hero-grid{
  display:grid;grid-template-columns:1.06fr .94fr;
  gap:clamp(24px,4vw,60px);align-items:center;width:100%;
}
.hero h1{
  font:600 clamp(42px,5.8vw,78px)/1.05 var(--serif);
  color:var(--t-head);margin:22px 0 20px;
}
.hero-sub{font-size:15.5px;line-height:1.75;color:var(--t-sec);max-width:46ch}
.btn-spectrum{
  display:inline-block;margin-top:36px;
  font:700 12px/1 var(--sans);letter-spacing:.22em;text-transform:uppercase;
  color:#1d1503;background:linear-gradient(100deg,#f0d98c,#d4af37);
  border:0;padding:19px 36px;text-decoration:none;cursor:pointer;
  transition:filter .18s ease;
}
.btn-spectrum:hover{filter:brightness(1.09)}
.btn-spectrum[disabled]{opacity:.45;cursor:not-allowed;filter:none}
.hero-meta{
  margin-top:52px;display:flex;flex-wrap:wrap;gap:14px 30px;
  font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--t-meta);
}
.hero-meta span{display:flex;gap:9px;align-items:center}
.hero-meta .ic{width:15px;height:15px;color:var(--gold-lo)}

/* сцена емблеми: реальна емблема-картинка + кінематографічна поява зі світла */
.emblem-stage{
  position:relative;width:min(48vmin,440px);margin:0 auto;aspect-ratio:1/1;
  display:grid;place-items:center;pointer-events:none;
}
.emblem-stage>*{grid-area:1/1}
.he-img{
  width:86%;height:auto;display:block;position:relative;z-index:3;
  filter:drop-shadow(0 10px 30px rgba(0,0,0,.45)) drop-shadow(0 0 26px rgba(212,175,55,.22));
}
/* золоте сяйво під емблемою */
.he-aura{
  width:100%;height:100%;z-index:1;border-radius:50%;
  background:radial-gradient(closest-side,rgba(212,175,55,.32),rgba(212,175,55,.08) 55%,transparent 72%);
}
/* спалах у центрі */
.he-flash{
  width:60%;height:60%;z-index:2;border-radius:50%;
  background:radial-gradient(closest-side,rgba(255,248,220,.95),rgba(240,217,140,.4) 45%,transparent 72%);
  opacity:0;
}
/* промені світла (генеруються в JS у .he-rays) */
.he-rays{width:220%;height:220%;z-index:2;pointer-events:none}
.he-rays span{
  position:absolute;left:50%;top:50%;transform-origin:0 0;
  width:2px;height:50%;
  background:linear-gradient(to top,rgba(255,248,220,.9),rgba(240,217,140,.35) 55%,transparent);
  opacity:0;filter:blur(.4px);
}
/* блиск, що проходить по емблемі один раз */
.he-shine{
  width:86%;height:86%;z-index:4;pointer-events:none;overflow:hidden;border-radius:14px;opacity:0;
  -webkit-mask-image:radial-gradient(closest-side,#000 68%,transparent 72%);
          mask-image:radial-gradient(closest-side,#000 68%,transparent 72%);
}
.he-shine::before{
  content:"";position:absolute;top:-30%;left:-60%;width:45%;height:160%;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.55),transparent);
  transform:skewX(-18deg);
}
.he-shine.sweep::before{animation:heSweep 1s ease-out forwards}
@keyframes heSweep{from{left:-60%}to{left:170%}}

/* =========================================================================
   Соц-рейл: месенджери й соцмережі на видному місці. Кольори брендові,
   але приглушені; на hover — трохи яскравіше. Праворуч (десктоп) → знизу (моб).
   ========================================================================= */
.social-rail{
  position:fixed;right:16px;top:50%;transform:translateY(-50%);z-index:60;
  display:flex;flex-direction:column;gap:11px;
}
.social-rail a{
  width:44px;height:44px;border-radius:50%;display:grid;place-items:center;
  background:rgba(9,16,28,.55);border:1px solid rgba(243,239,226,.12);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  color:var(--net,#c9b26a);text-decoration:none;
  transition:background .18s ease,border-color .18s ease,transform .18s ease,color .18s ease;
}
.social-rail a .ic{width:21px;height:21px}
.social-rail a:hover{
  background:color-mix(in srgb,var(--net) 22%, rgba(9,16,28,.6));
  border-color:color-mix(in srgb,var(--net) 55%, transparent);
  color:var(--net-hi,var(--net));transform:translateY(-2px);
}
/* приглушені брендові відтінки (не яскраво) */
.social-rail .s-wa{--net:#4e9c78;--net-hi:#25d366}
.social-rail .s-tg{--net:#4f8fc0;--net-hi:#2aabee}
.social-rail .s-vb{--net:#7d6bab;--net-hi:#7360f2}
.social-rail .s-ig{--net:#b07596;--net-hi:#e1306c}
.social-rail .s-tt{--net:#7a8494;--net-hi:#e9edf2}
.social-rail .s-ph{--net:#c9a94a;--net-hi:#f0d98c}
@media (max-width:820px){
  .social-rail{
    right:0;left:0;top:auto;bottom:0;transform:none;flex-direction:row;
    justify-content:center;gap:8px;padding:9px 10px calc(9px + env(safe-area-inset-bottom,0));
    background:rgba(7,13,23,.9);border-top:1px solid rgba(212,175,55,.16);
    -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  }
  .social-rail a{width:42px;height:42px;background:transparent;border:0}
  body{padding-bottom:60px}
}
@media print{.social-rail{display:none}}
/* статичний стан (reduced-motion / вже бачив / без JS): просто емблема + сяйво */
.emblem-stage.static .he-rays,
.emblem-stage.static .he-flash,
.emblem-stage.static .he-shine{display:none}
.emblem-stage.static .he-aura{opacity:1}
.emblem-stage.static .he-img{opacity:1;transform:none;filter:drop-shadow(0 10px 30px rgba(0,0,0,.45)) drop-shadow(0 0 26px rgba(212,175,55,.22))}

.hero-scroll{
  position:absolute;left:50%;bottom:26px;transform:translateX(-50%);z-index:3;
  display:flex;flex-direction:column;align-items:center;gap:10px;text-decoration:none;
  font-size:10px;letter-spacing:.34em;text-transform:uppercase;color:var(--t-meta);
  transition:color .18s ease;
}
.hero-scroll:hover{color:var(--gold)}
.hero-scroll i{width:1px;height:42px;background:linear-gradient(to bottom,rgba(212,175,55,.7),transparent)}

/* --- СПЕКТР НАПРЯМІВ ------------------------------------------------------ */
.beams{display:flex;flex-direction:column;max-width:780px}
.beam{
  display:flex;align-items:flex-start;gap:clamp(14px,2vw,22px);
  padding:17px 12px 17px 0;text-decoration:none;
  transition:filter .18s ease;
}
.beam .ln{
  height:2px;width:clamp(30px,6vw,88px);flex:none;background:currentColor;
  margin-top:8px;box-shadow:0 0 0 rgba(0,0,0,0);transition:box-shadow .18s ease;
}
.beam .bt .nm{
  display:block;font:700 13.5px/1.3 var(--sans);
  letter-spacing:.2em;text-transform:uppercase;
}
.beam .bt .ds{
  display:block;margin-top:7px;font:400 13px/1.55 var(--sans);
  color:var(--t-sec);max-width:52ch;
}
.beam .wl{
  margin-left:auto;flex:none;margin-top:2px;
  font:500 11px/1 var(--sans);letter-spacing:.14em;color:var(--t-meta);
}
.beam:hover{filter:brightness(1.3)}
.beam:hover .ln{box-shadow:0 0 14px currentColor}
.b1{color:var(--l1)} .b2{color:var(--l2)} .b3{color:var(--l3)} .b4{color:var(--l4)}
.b5{color:var(--l5)} .b6{color:var(--l6)} .b7{color:var(--l7)}
/* каскад: кожен наступний промінь заломлюється далі */
.beams .beam:nth-of-type(2){margin-left:clamp(8px,2vw,28px)}
.beams .beam:nth-of-type(3){margin-left:clamp(16px,4vw,56px)}
.beams .beam:nth-of-type(4){margin-left:clamp(24px,6vw,84px)}
.beams .beam:nth-of-type(5){margin-left:clamp(32px,8vw,112px)}
.beams .beam:nth-of-type(6){margin-left:clamp(40px,10vw,140px)}
.beams .beam:nth-of-type(7){margin-left:clamp(48px,12vw,168px)}
.beams-note{margin-top:38px;font-size:14px;line-height:1.7;color:var(--t-sec);max-width:56ch}
.beams-note a{color:var(--gold);text-decoration:underline;text-underline-offset:4px;transition:color .16s ease}
.beams-note a:hover{color:var(--gold-hi)}

/* --- ЯК МИ ПРАЦЮЄМО: заломлення променя ---------------------------------- */
.process{position:relative;margin-top:8px}
.p-beam,.p-beam-m{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.p-beam-m{display:none}
.p-steps{position:relative;display:flex;flex-direction:column}
.p-step{display:grid;grid-template-columns:1fr 96px 1fr;align-items:center;min-height:200px}
.p-node{
  grid-column:2;grid-row:1;justify-self:center;
  width:15px;height:15px;transform:rotate(45deg);
  border:2px solid currentColor;background:var(--bg-deep);
  box-shadow:0 0 18px rgba(212,175,55,.28);
}
.p-card{grid-row:1;max-width:430px;padding:14px 0}
.p-step:nth-child(odd)  .p-card{grid-column:1;justify-self:end;text-align:right}
.p-step:nth-child(even) .p-card{grid-column:3;justify-self:start}
.p-num{font:600 15px/1 var(--sans);letter-spacing:.3em;color:currentColor}
.p-card h3{font:600 25px/1.2 var(--serif);color:var(--t-head);margin:10px 0 9px}
.p-card p{font-size:14.5px;line-height:1.7;color:var(--t-sec)}
.st1{color:var(--l1)} .st2{color:var(--l3)} .st3{color:var(--l5)} .st4{color:var(--l7)}

/* --- ЧОМУ МИ --------------------------------------------------------------- */
.why-grid{
  display:grid;grid-template-columns:repeat(2,1fr);
  gap:clamp(30px,4.5vw,56px) clamp(30px,5vw,76px);max-width:1040px;
}
.why{position:relative;border-top:1px solid rgba(212,175,55,.3);padding-top:24px}
.why .wn{
  position:absolute;top:26px;right:0;
  font:500 11px/1 var(--sans);letter-spacing:.18em;color:var(--t-meta);
}
.why .ic{width:26px;height:26px;color:var(--gold);margin-bottom:16px}
.why h3{font:600 22px/1.25 var(--serif);color:var(--t-head)}
.why p{margin-top:10px;font-size:14.5px;line-height:1.7;color:var(--t-sec);max-width:44ch}

/* --- FAQ -------------------------------------------------------------------- */
.faq{max-width:840px}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{
  display:flex;align-items:baseline;gap:20px;
  padding:22px 4px;cursor:pointer;list-style:none;
}
.faq summary::-webkit-details-marker{display:none}
.fq-n{font:600 16px/1 var(--serif);color:var(--gold);flex:none;letter-spacing:.08em}
.fq-q{
  font:600 16.5px/1.5 var(--sans);color:var(--t-head);
  letter-spacing:.01em;transition:color .16s ease;
}
.faq summary:hover .fq-q{color:var(--gold-hi)}
.faq details[open] .fq-q{color:var(--gold-hi)}
.fq-m{margin-left:auto;flex:none;position:relative;width:14px;height:14px;align-self:center}
.fq-m::before,.fq-m::after{
  content:"";position:absolute;left:0;top:6px;width:14px;height:2px;
  background:var(--gold);transition:transform .2s ease,opacity .2s ease;
}
.fq-m::after{transform:rotate(90deg)}
.faq details[open] .fq-m::after{transform:rotate(0deg);opacity:0}
.fq-a{padding:0 4px 26px 52px;color:var(--t-sec);font-size:15px;line-height:1.75;max-width:66ch}
.faq details[open] .fq-a{animation:fqIn .3s ease}
@keyframes fqIn{from{opacity:0}to{opacity:1}}

/* --- КОНТАКТИ + ФОРМА --------------------------------------------------------- */
.k-grid{
  display:grid;grid-template-columns:1.08fr .92fr;
  gap:clamp(28px,4vw,58px);align-items:start;
}
.form-card{
  background:rgba(13,27,46,.66);border:1px solid var(--gline);
  padding:clamp(22px,3.4vw,36px);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
}
.f-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.f-field{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}
.f-field label{
  font:600 10.5px/1 var(--sans);letter-spacing:.22em;
  text-transform:uppercase;color:var(--t-meta);
}
.f-field .req{color:var(--gold)}
input[type=text],input[type=tel],select,textarea{
  font:400 15px/1.4 var(--sans);color:var(--t-body);
  background:rgba(7,13,23,.55);border:1px solid rgba(243,239,226,.14);
  padding:13px 14px;border-radius:0;outline:none;width:100%;
  transition:border-color .16s ease,box-shadow .16s ease;
}
input:focus,select:focus,textarea:focus{
  border-color:rgba(212,175,55,.65);
  box-shadow:0 0 0 3px rgba(212,175,55,.12);
}
input::placeholder,textarea::placeholder{color:var(--t-meta)}
textarea{min-height:112px;resize:vertical}
select{
  appearance:none;-webkit-appearance:none;padding-right:40px;cursor:pointer;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d4af37' stroke-width='1.6' stroke-linecap='round'%3E%3Cpath d='M6 9l6 7 6-7'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 13px center;background-size:16px;
}
select option{background:var(--bg-2);color:var(--t-body)}
.consent{
  display:flex;gap:10px;align-items:flex-start;
  font-size:13px;line-height:1.55;color:var(--t-sec);margin:6px 0 18px;cursor:pointer;
}
.consent input{width:16px;height:16px;accent-color:var(--gold);margin-top:2px;flex:none;cursor:pointer}
/* honeypot: поза екраном, НЕ display:none */
.hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.btn-block{display:block;width:100%;text-align:center}
.f-status{margin-top:14px;font-size:14px;line-height:1.6;display:none}
.f-status[data-st="busy"]{display:block;color:var(--t-sec)}
.f-status[data-st="ok"]{display:block;color:#9ed99e}
.f-status[data-st="err"]{display:block;color:#f2a6a6}
.wa-fb{
  display:none;margin-top:12px;
  font:700 11.5px/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;
  color:var(--gold);border:1px solid rgba(212,175,55,.5);
  padding:14px 20px;text-decoration:none;text-align:center;
  transition:background .18s ease;
}
.wa-fb.show{display:flex;align-items:center;justify-content:center;gap:10px}
.wa-fb:hover{background:rgba(212,175,55,.14)}
.f-note{
  margin-top:16px;font-size:12px;line-height:1.5;color:var(--t-meta);
  display:flex;gap:8px;align-items:center;
}
.f-note .ic{width:15px;height:15px;color:var(--gold-lo)}

.k-side .k-title{font:600 24px/1.2 var(--serif);color:var(--t-head);margin-bottom:8px}
.k-line{
  display:flex;gap:14px;align-items:center;padding:16px 0;
  border-bottom:1px solid var(--line);text-decoration:none;
}
.k-line .ic{width:20px;height:20px;color:var(--gold)}
.k-line small{
  display:block;font-size:10px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--t-meta);margin-bottom:4px;
}
.k-line b{font:600 15px/1.4 var(--sans);color:var(--t-body);transition:color .16s ease}
a.k-line:hover b{color:var(--gold-hi)}
.k-mess{margin-top:24px;display:flex;gap:10px;flex-wrap:wrap}
.k-mess a{
  display:inline-flex;gap:8px;align-items:center;
  border:1px solid rgba(243,239,226,.16);padding:11px 16px;
  font:600 11px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;
  color:var(--t-sec);text-decoration:none;
  transition:color .16s ease,border-color .16s ease;
}
.k-mess a:hover{color:var(--gold-hi);border-color:rgba(212,175,55,.5)}
.k-mess .ic{width:16px;height:16px}

/* мапа: чиста, у рамці-«паспарту», без фільтрів */
.map-frame{
  margin-top:clamp(34px,5vh,56px);
  border:1px solid rgba(212,175,55,.28);padding:10px;background:rgba(13,27,46,.5);
}
.map-frame iframe{display:block;width:100%;height:min(420px,58vw);border:0}

/* --- підвал --------------------------------------------------------------------- */
.site-footer{background:#050a13;border-top:1px solid rgba(212,175,55,.14);padding:66px 0 34px}
.ft-grid{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:clamp(28px,4vw,48px)}
.ft-brand .brand img{width:44px}
.ft-brand p{margin-top:16px;font-size:13.5px;line-height:1.7;color:var(--t-meta);max-width:36ch}
.ft-col h4{
  font:600 11px/1 var(--sans);letter-spacing:.3em;
  text-transform:uppercase;color:var(--t-meta);margin-bottom:18px;
}
.ft-col a,.ft-col span{
  display:block;padding:6px 0;font-size:14px;line-height:1.5;
  color:var(--t-sec);text-decoration:none;transition:color .15s ease;
}
.ft-col a:hover{color:var(--gold-hi)}
.ft-bottom{
  margin-top:46px;padding-top:22px;border-top:1px solid var(--line);
  display:flex;justify-content:space-between;align-items:center;
  gap:18px;flex-wrap:wrap;font-size:12px;color:var(--t-meta);
}
.ft-soc{display:flex;gap:16px}
.ft-soc a{color:var(--t-meta);transition:color .15s ease;display:flex}
.ft-soc a:hover{color:var(--gold-hi)}

/* --- адаптив ----------------------------------------------------------------------- */
@media (max-width:1080px){
  .hd-phone{display:none}
}
@media (max-width:980px){
  .hd-nav,.hd-cta{display:none}
  .burger{display:flex}
  .hero{padding:120px 0 70px;min-height:0}
  .hero-scroll{display:none}
  .hero-grid{grid-template-columns:1fr;gap:36px}
  .emblem-stage{order:-1;width:min(58vw,300px)}
  .hero h1{margin-top:16px}
  .p-step{grid-template-columns:44px 1fr;min-height:0;padding:24px 0}
  .p-node{grid-column:1;align-self:start;margin-top:8px}
  .p-card,.p-step:nth-child(odd) .p-card,.p-step:nth-child(even) .p-card{
    grid-column:2;justify-self:start;text-align:left;max-width:560px;
  }
  .p-beam{display:none}
  .p-beam-m{display:block;width:44px;right:auto} /* НЕ тягнути на всю ширину: лінія йде зліва по вузлах */
  .k-grid{grid-template-columns:1fr}
}
@media (max-width:760px){
  .why-grid{grid-template-columns:1fr}
  .f-row{grid-template-columns:1fr}
  .beam .wl{display:none}
  .beam .bt .ds{font-size:12.5px}
  .fq-a{padding-left:4px}
  .ft-grid{grid-template-columns:1fr}
  .hero-meta{gap:10px 20px}
}
@media (max-width:420px){
  .beams .beam:nth-of-type(n){margin-left:0}
  .beam .ln{width:24px}
}

/* --- no-js: бургер не працює — ховаємо, навігація доступна через підвал --- */
body.no-js .burger{display:none}

/* =========================================================================
   v2 — «милі деталі»: дрібна ручна робота по всьому сайту
   ========================================================================= */

/* кікери секцій: маленький золотий ромб-іскра перед текстом */
.sec-head .kicker::before{
  content:"";display:inline-block;width:6px;height:6px;margin-right:12px;
  background:linear-gradient(135deg,#f4e3a1,#d4af37);
  transform:rotate(45deg) translateY(-1px);
}

/* картки «Чому ми»: гравірований куточок, номер підсвічується від світла */
.why::before{
  content:"";position:absolute;top:-1px;left:0;width:26px;height:26px;
  border-top:2px solid var(--gold);border-left:2px solid var(--gold);
  opacity:.55;transition:opacity .18s ease,width .25s ease,height .25s ease;
}
.why:hover::before{opacity:1;width:34px;height:34px}
.why:hover .wn{color:var(--gold)}
.why .wn{transition:color .18s ease}

/* λ-чипи напрямів: тонка рамка, при наведенні наповнюються світлом */
.beam .wl{
  border:1px solid rgba(212,175,55,.25);padding:5px 9px;
  transition:background .18s ease,color .18s ease,border-color .18s ease;
}
.beam:hover .wl{
  background:rgba(212,175,55,.14);color:var(--gold-hi);
  border-color:rgba(212,175,55,.5);
}

/* FAQ: під відкритим питанням домальовується тонкий промінь */
.faq summary{position:relative}
.faq summary::after{
  content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;
  background:linear-gradient(90deg,var(--gold),transparent 70%);
  transform:scaleX(0);transform-origin:0 50%;transition:transform .45s ease;
}
.faq details[open] summary::after{transform:scaleX(1)}

/* мапа: куточки-паспарту, як на гравюрній рамці */
.map-frame{position:relative}
.map-frame::before,.map-frame::after{
  content:"";position:absolute;width:22px;height:22px;pointer-events:none;
}
.map-frame::before{top:-1px;left:-1px;border-top:2px solid var(--gold);border-left:2px solid var(--gold)}
.map-frame::after{bottom:-1px;right:-1px;border-bottom:2px solid var(--gold);border-right:2px solid var(--gold)}

/* форма: та ж пара куточків — єдина «рамкова» мова */
.form-card{position:relative}
.form-card::before,.form-card::after{
  content:"";position:absolute;width:22px;height:22px;pointer-events:none;
}
.form-card::before{top:-1px;left:-1px;border-top:2px solid var(--gold);border-left:2px solid var(--gold)}
.form-card::after{bottom:-1px;right:-1px;border-bottom:2px solid var(--gold);border-right:2px solid var(--gold)}

/* підвал: спектральна лінія-веселка з 7 відтінків золота */
.ft-bottom{border-top:0;position:relative;padding-top:23px}
.ft-bottom::before{
  content:"";position:absolute;top:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,var(--l1),var(--l2),var(--l3),var(--l4),var(--l5),var(--l6),var(--l7));
  opacity:.55;
}

/* кроки процесу: вузол-ромб «запалюється», коли крок у фокусі уваги */
.p-step:hover .p-node{box-shadow:0 0 26px currentColor}
.p-node{transition:box-shadow .25s ease}

/* тонкий скролбар у бренд-кольорах (webkit) */
::-webkit-scrollbar{width:11px}
::-webkit-scrollbar-track{background:#070d17}
::-webkit-scrollbar-thumb{background:#2a3a55;border:3px solid #070d17;border-radius:6px}
::-webkit-scrollbar-thumb:hover{background:#9a7b1f}

/* =========================================================================
   v2 — підсторінки напрямів /pravo/*. Кожна сторінка живе у СВОЄМУ відтінку
   спектра: body.subpage задає --pg (свою «довжину хвилі»).
   ========================================================================= */
body.subpage{--pg:var(--gold)}

/* hero сторінки напряму */
.pg-hero{
  position:relative;min-height:74svh;display:flex;align-items:flex-end;
  padding:170px 0 72px;overflow:hidden;
  background:radial-gradient(1000px 620px at 26% 30%,var(--bg-3) 0%,var(--bg) 55%,var(--bg-deep) 100%);
}
.pg-hero .wrap{position:relative;z-index:3;width:100%}
.breadcrumb{
  display:flex;gap:10px;flex-wrap:wrap;
  font:600 10.5px/1 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--t-meta);
}
.breadcrumb a{color:var(--t-meta);text-decoration:none;transition:color .15s ease}
.breadcrumb a:hover{color:var(--gold-hi)}
.breadcrumb .sep{opacity:.5}
/* величезний номер-хвиля напряму — водяний знак */
.pg-num{
  position:absolute;right:clamp(8px,4vw,72px);top:86px;z-index:1;pointer-events:none;
  font:600 clamp(120px,21vw,230px)/1 var(--serif);
  color:transparent;-webkit-text-stroke:1.5px color-mix(in srgb,var(--pg) 34%,transparent);
}
.pg-hero h1{
  font:600 clamp(42px,6vw,74px)/1.05 var(--serif);color:var(--t-head);margin:22px 0 16px;
}
.pg-hero h1 em{
  font-style:italic;
  background:linear-gradient(100deg,#f8ecc4,var(--pg) 60%,color-mix(in srgb,var(--pg) 70%,#5c3a12));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.pg-lead{color:var(--t-sec);font-size:15.5px;line-height:1.75;max-width:56ch}
.pg-cta{margin-top:34px;display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.btn-ghost{
  display:inline-flex;gap:10px;align-items:center;
  font:700 12px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;
  color:var(--gold);border:1px solid rgba(212,175,55,.5);
  padding:18px 28px;text-decoration:none;transition:background .18s ease;
}
.btn-ghost:hover{background:rgba(212,175,55,.12)}
.btn-ghost .ic{width:16px;height:16px}
/* промінь напряму: тонка лінія у hue сторінки під заголовком */
.pg-ray{width:min(300px,42vw);height:2px;margin-top:26px;
  background:linear-gradient(90deg,var(--pg),transparent)}

/* послуги напряму: нумерований каталог */
.pgs{display:grid;grid-template-columns:repeat(2,1fr);
  gap:clamp(26px,4vh,44px) clamp(30px,5vw,72px);max-width:1060px}
.pgs .it{position:relative;border-top:1px solid color-mix(in srgb,var(--pg) 40%,transparent);padding-top:20px}
.pgs .it::before{
  content:"";position:absolute;top:-1px;left:0;width:22px;height:22px;
  border-top:2px solid var(--pg);border-left:2px solid var(--pg);
  opacity:.6;transition:opacity .18s ease,width .25s ease,height .25s ease;
}
.pgs .it:hover::before{opacity:1;width:30px;height:30px}
.pgs .n{font:600 15px/1 var(--serif);letter-spacing:.14em;color:var(--pg)}
.pgs h3{font:600 21px/1.3 var(--serif);color:var(--t-head);margin:9px 0 8px}
.pgs p{font-size:14.5px;line-height:1.7;color:var(--t-sec);max-width:46ch}

/* «Чи знали ви?» — довідковий факт у рамці з лапкою */
.fact-band{
  position:relative;max-width:840px;
  border:1px solid color-mix(in srgb,var(--pg) 35%,transparent);
  background:rgba(13,27,46,.55);padding:clamp(24px,4vw,40px) clamp(24px,4.5vw,48px);
}
.fact-band::before{
  content:"«";position:absolute;top:-8px;left:18px;
  font:600 74px/1 var(--serif);color:var(--pg);opacity:.9;
}
.fact-band::after{
  content:"";position:absolute;bottom:-1px;right:-1px;width:22px;height:22px;
  border-bottom:2px solid var(--pg);border-right:2px solid var(--pg);
}
.fact-band .fk{font-size:11px;letter-spacing:.34em;text-transform:uppercase;color:var(--pg);margin-left:56px}
.fact-band p{margin:14px 0 0 56px;font:500 18px/1.65 var(--serif);color:var(--t-body);font-style:italic}
.fact-band small{display:block;margin:12px 0 0 56px;font-size:11.5px;letter-spacing:.08em;color:var(--t-meta)}

/* як ведемо справи у цьому напрямі: 3 кроки на промені */
.pg-steps{position:relative;display:grid;grid-template-columns:repeat(3,1fr);
  gap:clamp(20px,3vw,40px);max-width:1060px}
.pg-steps::before{
  content:"";position:absolute;top:7px;left:0;right:0;height:1px;
  background:linear-gradient(90deg,var(--pg),color-mix(in srgb,var(--pg) 30%,transparent));
}
.pg-steps .st{position:relative;padding-top:30px}
.pg-steps .st i{
  position:absolute;top:0;left:0;width:15px;height:15px;transform:rotate(45deg);
  border:2px solid var(--pg);background:var(--bg-deep);
  box-shadow:0 0 16px color-mix(in srgb,var(--pg) 40%,transparent);
}
.pg-steps h4{font:600 19px/1.3 var(--serif);color:var(--t-head)}
.pg-steps p{margin-top:8px;font-size:14px;line-height:1.65;color:var(--t-sec)}

/* месенджери на сторінках напрямів */
.pg-mess a,.k-mess-a{
  display:inline-flex;gap:8px;align-items:center;
  border:1px solid rgba(243,239,226,.16);padding:11px 16px;
  font:600 11px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;
  color:var(--t-sec);text-decoration:none;
  transition:color .16s ease,border-color .16s ease;
}
.pg-mess a:hover,.k-mess-a:hover{color:var(--gold-hi);border-color:rgba(212,175,55,.5)}
.pg-mess .ic{width:16px;height:16px}

/* CTA-band сторінки напряму */
.pg-cta-band{text-align:center}
.pg-cta-band h2{font:600 clamp(30px,4vw,48px)/1.15 var(--serif);color:var(--t-head)}
.pg-cta-band h2 em{
  font-style:italic;
  background:linear-gradient(100deg,#f8ecc4,var(--pg));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.pg-cta-band .row{margin-top:32px;display:flex;gap:14px;flex-wrap:wrap;justify-content:center}
.pg-mess{margin-top:26px;display:flex;gap:10px;flex-wrap:wrap;justify-content:center}

/* сусідні напрями: компактні промені */
.nb{display:flex;flex-direction:column;max-width:640px;margin:0 auto}
.nb a{
  display:flex;align-items:center;gap:16px;padding:13px 6px;text-decoration:none;
  transition:filter .18s ease;
}
.nb a .ln{height:2px;width:26px;flex:none;background:currentColor}
.nb a .nm{font:600 12.5px/1.3 var(--sans);letter-spacing:.18em;text-transform:uppercase}
.nb a .ar{margin-left:auto;color:var(--t-meta);transition:color .15s ease}
.nb a:hover{filter:brightness(1.3)}
.nb a:hover .ar{color:currentColor}

@media (max-width:860px){
  .pg-hero{min-height:0;padding:140px 0 56px}
  .pg-num{top:96px;right:10px}
  .pgs{grid-template-columns:1fr}
  .pg-steps{grid-template-columns:1fr;gap:26px}
  .pg-steps::before{top:0;bottom:0;left:7px;right:auto;width:1px;height:auto;
    background:linear-gradient(180deg,var(--pg),color-mix(in srgb,var(--pg) 30%,transparent))}
  .pg-steps .st{padding-top:0;padding-left:32px}
  .fact-band::before{left:10px}
  .fact-band .fk,.fact-band p,.fact-band small{margin-left:34px}
}

/* =========================================================================
   Форма-«справа» v2: рядки документа замість боксів + печатка при успіху
   ========================================================================= */
.form-card{
  background:linear-gradient(135deg,rgba(13,27,46,.5),rgba(7,13,23,.2));
  border:0;border-left:2px solid;padding:clamp(26px,4vw,46px);
  border-image:linear-gradient(180deg,#f0d98c,#9a5b2f) 1;
  position:relative;overflow:hidden;
  -webkit-backdrop-filter:none;backdrop-filter:none;
}
.form-card::before,.form-card::after{content:none} /* старі куточки — геть */
.f2-mark{
  position:absolute;right:-6px;bottom:-64px;pointer-events:none;
  font:600 230px/1 var(--serif);color:rgba(212,175,55,.055);
}
.f2-head{margin-bottom:20px}
.f2-doc{font-size:10.5px;letter-spacing:.34em;text-transform:uppercase;color:var(--gold-lo)}
.f2-head h3{font:600 clamp(22px,2.6vw,28px)/1.25 var(--serif);color:var(--t-head);margin-top:10px}
.f2-head h3 em{
  font-style:italic;
  background:linear-gradient(100deg,#f4e3a1,#d4af37);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.f2-field{display:flex;gap:18px;padding:14px 0 4px}
.f2-n{
  flex:none;width:28px;padding-top:24px;
  font:600 14px/1 var(--serif);letter-spacing:.1em;color:var(--t-meta);
  transition:color .35s ease;
}
.f2-field.ok .f2-n{color:var(--gold)}
.f2-io{flex:1;position:relative;display:flex;flex-direction:column;gap:5px;min-width:0}
.f2-io label{
  font:600 10.5px/1 var(--sans);letter-spacing:.22em;
  text-transform:uppercase;color:var(--t-meta);
}
.f2-io input,.f2-io select,.f2-io textarea{
  background:transparent;border:0;border-bottom:1px solid rgba(243,239,226,.16);
  padding:10px 2px;box-shadow:none;border-radius:0;
}
.f2-io input:focus,.f2-io select:focus,.f2-io textarea:focus{border-color:rgba(243,239,226,.16);box-shadow:none}
.f2-io textarea{min-height:72px}
/* золота лінія малюється при фокусі; у заповненого пункту — лишається тліти */
.f2-line{
  position:absolute;left:0;right:0;bottom:0;height:2px;pointer-events:none;
  background:linear-gradient(90deg,#f0d98c,var(--gold) 55%,transparent);
  transform:scaleX(0);transform-origin:0 50%;
  transition:transform .45s cubic-bezier(.22,1,.36,1),opacity .3s ease;
}
.f2-io:focus-within .f2-line{transform:scaleX(1)}
.f2-field.ok .f2-line{transform:scaleX(1);opacity:.45}
/* кнопка: золото вливається зліва, стріла веде вперед */
.f2-submit{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;
  margin-top:26px;padding:20px 24px;cursor:pointer;position:relative;overflow:hidden;
  background:transparent;border:1px solid rgba(212,175,55,.55);color:var(--gold);
  font:700 12px/1 var(--sans);letter-spacing:.22em;text-transform:uppercase;
  transition:color .25s ease;
}
.f2-submit::before{
  content:"";position:absolute;inset:0;z-index:0;
  background:linear-gradient(100deg,#f0d98c,#d4af37);
  transform:translateX(-101%);transition:transform .4s cubic-bezier(.22,1,.36,1);
}
.f2-submit span,.f2-submit .f2-arr{position:relative;z-index:1}
.f2-submit .f2-arr{display:flex;transition:transform .3s ease}
.f2-submit .ic{width:18px;height:18px}
.f2-submit:hover:not([disabled])::before{transform:translateX(0)}
.f2-submit:hover:not([disabled]){color:#1d1503}
.f2-submit:hover:not([disabled]) .f2-arr{transform:translateX(6px)}
.f2-submit[disabled]{opacity:.4;cursor:not-allowed}
/* печатка «ЗАЯВКУ ПРИЙНЯТО» — штампується поверх форми */
.f2-seal{
  position:absolute;top:50%;left:50%;width:min(200px,52vw);aspect-ratio:1/1;
  margin-top:-27%;transform:translate(-50%,0) rotate(-18deg) scale(1.8);
  color:#d8b64a;opacity:0;pointer-events:none;z-index:5;
  text-transform:uppercase;font-family:var(--sans);font-weight:600;
}
.f2-seal svg{width:100%;height:100%}
.f2-seal.stamp{
  opacity:.92;transform:translate(-50%,0) rotate(-10deg) scale(1);
  animation:stampIn .55s cubic-bezier(.2,1.4,.3,1);
}
@keyframes stampIn{
  0%{opacity:0;transform:translate(-50%,0) rotate(-18deg) scale(1.8)}
  62%{opacity:.95;transform:translate(-50%,0) rotate(-9deg) scale(.95)}
  100%{opacity:.92;transform:translate(-50%,0) rotate(-10deg) scale(1)}
}
@media (max-width:760px){
  .f2-field{gap:12px}
  .f2-mark{font-size:170px;bottom:-46px}
}

/* =========================================================================
   v3 EDITORIAL — за прийомами топових іноземних юрфірм:
   велетенська серифна типографіка, індекс-список, стрічка, statement-підвал
   ========================================================================= */

/* hero: типографіка — головний герой */
.hero-grid{grid-template-columns:1.3fr .7fr}
.hero-h{
  font:600 clamp(46px,7vw,96px)/1.02 var(--serif);
  color:var(--t-head);margin:26px 0 22px;letter-spacing:-.01em;
}
.hero-h em,.hero-h .rl-gold{
  font-style:italic;
  background:linear-gradient(100deg,#f4e3a1,#d4af37 45%,#9a5b2f);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.rl{display:block;overflow:hidden;padding-bottom:.06em;margin-bottom:-.06em}
.rl i{display:block;font-style:normal;will-change:transform}
.emblem-stage{width:min(36vmin,340px)}

/* стрічка-маркіза */
.mq{
  overflow:hidden;position:relative;padding:16px 0;
  border-top:1px solid rgba(212,175,55,.14);
  border-bottom:1px solid rgba(212,175,55,.14);
  background:rgba(6,11,19,.4);
}
.mq-t{display:flex;width:max-content;animation:mqs 38s linear infinite}
.mq:hover .mq-t{animation-play-state:paused}
.mq-t span{
  font:500 15px/1 var(--serif);font-style:italic;letter-spacing:.16em;
  color:rgba(233,230,220,.5);white-space:nowrap;
}
@keyframes mqs{to{transform:translateX(-50%)}}

/* індекс напрямів: зміст юридичного видання */
.dex{border-top:1px solid rgba(243,239,226,.12)}
.dex-row{
  display:grid;grid-template-columns:64px 1.15fr .85fr 44px;
  align-items:baseline;gap:clamp(12px,2vw,28px);
  padding:clamp(20px,3vh,30px) 4px;text-decoration:none;position:relative;
  border-bottom:1px solid rgba(243,239,226,.12);
}
.dex-row::after{
  content:"";position:absolute;left:0;bottom:-1px;height:1px;width:100%;
  background:var(--h);transform:scaleX(0);transform-origin:0 50%;
  transition:transform .5s cubic-bezier(.22,1,.36,1);
}
.dex-row:hover::after{transform:scaleX(1)}
.dex-n{font:600 13px/1 var(--sans);letter-spacing:.2em;color:var(--t-meta);transition:color .2s ease}
.dex-t{
  font:600 clamp(26px,3.4vw,46px)/1.08 var(--serif);color:var(--t-head);
  transition:color .25s ease;
}
.dex-d{
  font:400 12.5px/1.5 var(--sans);letter-spacing:.1em;text-transform:uppercase;
  color:var(--t-meta);transition:color .25s ease;align-self:center;
}
.dex-a{width:22px;height:22px;color:var(--h);opacity:0;transform:translateX(-8px);
  transition:opacity .25s ease,transform .3s ease;align-self:center;justify-self:end}
.dex-row:hover .dex-t{color:var(--h)}
.dex-row:hover .dex-n{color:var(--h)}
.dex-row:hover .dex-d{color:var(--t-sec)}
.dex-row:hover .dex-a{opacity:1;transform:translateX(0)}

/* контакти: розмова зліва — документ справа */
.k2{display:grid;grid-template-columns:.88fr 1.12fr;gap:clamp(30px,5vw,72px);align-items:start}
.k2-int h3{font:600 clamp(30px,3.6vw,46px)/1.12 var(--serif);color:var(--t-head)}
.k2-int h3 em{
  font-style:italic;
  background:linear-gradient(100deg,#f4e3a1,#d4af37);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.k2-int>p{margin:16px 0 30px;font-size:15px;line-height:1.75;color:var(--t-sec);max-width:40ch}
.k2-tel{
  display:inline-block;font:600 clamp(24px,2.6vw,32px)/1.2 var(--serif);
  color:var(--gold);text-decoration:none;margin-bottom:26px;
  border-bottom:1px solid rgba(212,175,55,.35);padding-bottom:6px;
  transition:color .2s ease,border-color .2s ease;
}
.k2-tel:hover{color:var(--gold-hi);border-color:var(--gold-hi)}
.k2-l{display:flex;gap:12px;align-items:center;padding:10px 0;
  font-size:14px;color:var(--t-sec)}
.k2-l .ic{width:18px;height:18px;color:var(--gold-lo)}
.k2-m{margin-top:22px;display:flex;gap:22px;flex-wrap:wrap}
.k2-m a{
  font:600 11.5px/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;
  color:var(--t-sec);text-decoration:none;padding-bottom:5px;position:relative;
  transition:color .2s ease;
}
.k2-m a::after{
  content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;
  background:var(--gold);transform:scaleX(0);transform-origin:0 50%;
  transition:transform .35s ease;
}
.k2-m a:hover{color:var(--gold-hi)}
.k2-m a:hover::after{transform:scaleX(1)}

/* підвал: statement-слово */
.ft-mark{
  font:600 clamp(48px,15vw,215px)/0.95 var(--serif);letter-spacing:.04em;
  text-align:center;color:transparent;
  -webkit-text-stroke:1px rgba(212,175,55,.17);
  user-select:none;pointer-events:none;margin:46px 0 -8px;
}
.site-footer{overflow:hidden} /* statement-слово ніколи не розтягує сторінку */

/* CTA-band підсторінок: сплит замість центрованого стосу (було «криво») */
.pg-cta-band .wrap{
  display:grid;grid-template-columns:1.15fr .85fr;
  gap:clamp(24px,4vw,64px);align-items:center;text-align:left;
}
.pg-cta-band h2{grid-column:1}
.pg-cta-band .row{
  grid-column:2;grid-row:1;margin-top:0;
  flex-direction:column;align-items:stretch;justify-content:center;
}
.pg-cta-band .row .btn-spectrum,.pg-cta-band .row .btn-ghost{text-align:center;justify-content:center}
.pg-cta-band .pg-mess{grid-column:2;justify-content:flex-start;margin-top:0}

@media (max-width:900px){
  .hero-grid{grid-template-columns:1fr}
  .dex-row{grid-template-columns:44px 1fr 34px;grid-template-rows:auto auto}
  .dex-t{grid-column:2}
  .dex-d{grid-column:2;grid-row:2;margin-top:6px}
  .dex-a{grid-column:3;grid-row:1}
  .k2{grid-template-columns:1fr}
  .pg-cta-band .wrap{grid-template-columns:1fr;text-align:left}
  .pg-cta-band .row,.pg-cta-band .pg-mess{grid-column:1}
}

/* сторінка політики + лінк у футері */
.legal{max-width:760px}
.legal h2{font:600 22px/1.3 var(--serif);color:var(--t-head);margin:30px 0 10px}
.legal p{font-size:15px;line-height:1.8;color:var(--t-sec);margin:0 0 12px}
.legal a{color:var(--gold);text-decoration:underline;text-underline-offset:3px}
.legal-upd{font-size:12.5px;color:var(--t-meta);margin-top:26px}
.ft-priv{font-size:12.5px;color:var(--t-meta);text-decoration:underline;text-underline-offset:3px;transition:color .15s ease}
.ft-priv:hover{color:var(--gold-hi)}

/* --- reduced motion: все статичне і видиме --------------------------------------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition:none !important;animation:none !important}
  #evortex,#edust,#efocus,#ewave{display:none !important}
  .mq-t{animation:none !important;transform:none !important}
}
