/* =========================================================
   Гомеопат Йосефа — gomeopatyosefa.com
   Палитра построена от фирменного синего логотипа #006FAF
   ========================================================= */

/* ---------- Tokens ---------- */
:root{
  --brand:#006FAF;
  --brand-dk:#065C92;
  --brand-dp:#0B3A55;
  --deep:#0A3651;
  --cream:#F6F3EC;
  --cream-2:#EFE9DE;
  --paper:#FFFFFF;
  --ink:#11242F;
  --muted:#5A6B77;
  --tint:#E7F1F7;
  --tint-2:#F1F7FA;
  --gold:#BE8C43;
  --line:rgba(11,58,85,.13);
  --line-soft:rgba(11,58,85,.08);


  /* --- производные токены: нужны, чтобы работала тёмная тема --- */
  --brand-solid:#006FAF;      /* заливка кнопок и активных элементов */
  --brand-solid-h:#065C92;    /* её наведение */
  --on-solid:#FFFFFF;         /* текст поверх заливки */
  --body-text:#22323C;        /* текст статьи */
  --btn-ghost-bd:rgba(11,58,85,.28);
  --header-bg:rgba(246,243,236,.82);
  --footer-bg:#08293D;
  --deep-grad:linear-gradient(160deg,#0A3651,#0B4A70);
  --arch-bg:linear-gradient(168deg, #DCEDF6 0%, #C9E2F0 42%, #E9F3F7 100%);
  --arch-glow:radial-gradient(circle at 50% 40%, rgba(255,255,255,.7), rgba(255,255,255,0) 62%);
  --err-bg:#FDF3F2;
  --err-bd:#E9C4C0;
  --err-fg:#A9332A;
  --err-line:#D0453B;
  --check-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='11' viewBox='0 0 24 24' fill='none' stroke='%23006FAF' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");

  --r-xl:34px;
  --r-lg:26px;
  --r-md:16px;
  --r-sm:10px;

  --sh-s:0 2px 10px rgba(10,54,81,.06);
  --sh-m:0 16px 40px -18px rgba(10,54,81,.30);
  --sh-l:0 34px 70px -30px rgba(10,54,81,.38);

  --wrap:1200px;
  --gut:clamp(18px, 4vw, 40px);
  --sect:clamp(64px, 8vw, 116px);

  --sans:"Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --serif:"Cormorant Garamond", "Times New Roman", Georgia, serif;

  --header-h:82px;
}

/* ---------- Reset ---------- */
:root{color-scheme:light}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  font-family:var(--sans);
  font-size:17px;
  line-height:1.72;
  color:var(--ink);
  background:var(--cream);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img,svg{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
ul,ol{margin:0;padding:0;list-style:none}
h1,h2,h3,h4,p{margin:0}

html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 16px)}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important}
}

:focus-visible{outline:3px solid var(--brand);outline-offset:3px;border-radius:6px}

/* ---------- Layout helpers ---------- */
.wrap{width:min(100% - var(--gut)*2, var(--wrap));margin-inline:auto}
.section{padding-block:var(--sect);position:relative}
.skip{position:absolute;left:-9999px;top:0;background:var(--brand);color:#fff;padding:12px 20px;z-index:200;border-radius:0 0 10px 0}
.skip:focus{left:0}

/* ---------- Typography ---------- */
.display{
  font-family:var(--serif);
  font-weight:500;
  line-height:1.06;
  letter-spacing:-.015em;
  color:var(--brand-dp);
}
h1.display{font-size:clamp(2.5rem, 1.15rem + 5.1vw, 4.7rem)}
h2.display{font-size:clamp(2rem, 1.25rem + 2.8vw, 3.3rem);line-height:1.1}
h3.display{font-size:clamp(1.35rem, 1.1rem + .9vw, 1.8rem);line-height:1.2}
.display em{font-style:italic;color:var(--brand)}

.eyebrow{
  display:inline-flex;align-items:center;gap:12px;
  font-size:.735rem;font-weight:700;letter-spacing:.19em;text-transform:uppercase;
  color:var(--brand);
}
.eyebrow::before{content:"";width:34px;height:1px;background:currentColor;opacity:.55;flex:none}
.eyebrow--center::after{content:"";width:34px;height:1px;background:currentColor;opacity:.55;flex:none}

.lead{font-size:clamp(1.02rem,.97rem + .25vw,1.16rem);color:var(--muted);line-height:1.75}
.muted{color:var(--muted)}
.head-block{max-width:660px}
.head-block--center{margin-inline:auto;text-align:center}
.head-block .display{margin-top:18px}
.head-block .lead{margin-top:18px}

/* ---------- Buttons ---------- */
.btn{
  --bg:var(--brand-solid); --fg:var(--on-solid); --bd:var(--brand-solid);
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:15px 28px;border:1.5px solid var(--bd);border-radius:999px;
  background:var(--bg);color:var(--fg);
  font-size:.94rem;font-weight:700;letter-spacing:.01em;
  cursor:pointer;text-align:center;
  transition:transform .25s cubic-bezier(.2,.7,.3,1), box-shadow .25s, background .25s, color .25s, border-color .25s;
  box-shadow:0 10px 24px -14px rgba(0,111,175,.9);
}
.btn:hover{transform:translateY(-2px);box-shadow:0 18px 32px -16px rgba(0,111,175,.85)}
.btn:active{transform:translateY(0)}
.btn svg{flex:none}
.btn--ghost{--bg:transparent;--fg:var(--brand-dp);--bd:var(--btn-ghost-bd);box-shadow:none}
.btn--ghost:hover{--bd:var(--brand);--fg:var(--brand);box-shadow:none}
.btn--light{--bg:#fff;--fg:#0B3A55;--bd:#fff}
.btn--onDeep{--bg:transparent;--fg:#fff;--bd:rgba(255,255,255,.4);box-shadow:none}
.btn--onDeep:hover{--bg:rgba(255,255,255,.1);--bd:#fff}
.btn--sm{padding:11px 22px;font-size:.86rem}
.btn--wide{width:100%}

/* ---------- Header ---------- */
.header{
  position:fixed;inset:0 0 auto 0;z-index:100;
  height:var(--header-h);
  display:flex;align-items:center;
  transition:background .3s, box-shadow .3s, height .3s;
}
.header::before{
  content:"";position:absolute;inset:0;
  background:var(--header-bg);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  opacity:0;transition:opacity .3s;
}
.header.is-stuck::before{opacity:1}
.header.is-stuck{box-shadow:0 1px 0 var(--line-soft), 0 10px 30px -24px rgba(10,54,81,.5);height:70px}
.header__in{position:relative;display:flex;align-items:center;gap:clamp(16px,3vw,44px);width:min(100% - var(--gut)*2, 1320px);margin-inline:auto}
.brand{flex:none;display:block}
.brand img{height:clamp(34px,4.4vw,46px);width:auto;transition:height .3s}
.header.is-stuck .brand img{height:34px}

.nav{display:flex;align-items:center;gap:clamp(14px,2vw,30px);margin-inline:auto}
.nav a{
  position:relative;font-size:.92rem;font-weight:600;color:var(--brand-dp);
  padding:6px 2px;transition:color .2s;white-space:nowrap;
}
.nav a::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1.5px;
  background:var(--brand);transform:scaleX(0);transform-origin:left;transition:transform .3s cubic-bezier(.2,.7,.3,1);
}
.nav a:hover{color:var(--brand)}
.nav a:hover::after,.nav a.is-active::after{transform:scaleX(1)}
.nav a.is-active{color:var(--brand)}
.header__cta{flex:none;display:flex;align-items:center;gap:12px}

.burger{
  display:none;flex:none;width:46px;height:46px;border:1px solid var(--line);
  border-radius:50%;background:transparent;cursor:pointer;
  align-items:center;justify-content:center;
}
.burger span{display:block;width:19px;height:1.6px;background:var(--brand-dp);position:relative;transition:background .2s}
.burger span::before,.burger span::after{
  content:"";position:absolute;left:0;width:19px;height:1.6px;background:var(--brand-dp);
  transition:transform .3s cubic-bezier(.2,.7,.3,1), top .2s;
}
.burger span::before{top:-6px}
.burger span::after{top:6px}
.nav-open .burger span{background:transparent}
.nav-open .burger span::before{top:0;transform:rotate(45deg)}
.nav-open .burger span::after{top:0;transform:rotate(-45deg)}

@media (max-width:1000px){
  .nav,.header__cta .btn{display:none}
  .burger{display:flex}
  .header__in{justify-content:space-between}
}

/* mobile drawer */
.drawer{
  position:fixed;inset:0;z-index:99;
  background:var(--cream);
  padding:calc(var(--header-h) + 24px) var(--gut) 40px;
  display:flex;flex-direction:column;gap:6px;
  transform:translateY(-14px);opacity:0;pointer-events:none;
  transition:opacity .3s, transform .35s cubic-bezier(.2,.7,.3,1);
  overflow-y:auto;
}
.nav-open .drawer{opacity:1;transform:none;pointer-events:auto}
.drawer a.drawer__link{
  font-family:var(--serif);font-size:1.85rem;font-weight:500;color:var(--brand-dp);
  padding:11px 0;border-bottom:1px solid var(--line-soft);
}
.drawer .btn{margin-top:26px}
.drawer__socials{margin-top:auto;padding-top:30px}

/* ---------- Socials ---------- */
.socials{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.socials a{
  width:42px;height:42px;border-radius:50%;
  display:grid;place-items:center;
  border:1px solid var(--line);color:var(--brand-dp);
  transition:background .25s, color .25s, border-color .25s, transform .25s;
}
.socials a:hover{background:var(--brand-solid);border-color:var(--brand-solid);color:var(--on-solid);transform:translateY(-3px)}
.socials--onDeep a{border-color:rgba(255,255,255,.28);color:#fff}
.socials--onDeep a:hover{background:#fff;color:var(--deep);border-color:#fff}
.socials__note{font-size:.85rem;color:var(--muted);margin-bottom:12px}

/* ---------- HERO ---------- */
.hero{padding-top:calc(var(--header-h) + clamp(28px,5vw,66px));padding-bottom:0;position:relative;overflow:hidden}
.hero::after{
  content:"";position:absolute;z-index:0;
  width:min(52vw,720px);aspect-ratio:1;right:-14vw;top:-16vw;border-radius:50%;
  background:radial-gradient(circle at 35% 35%, rgba(0,111,175,.13), rgba(0,111,175,0) 68%);
  pointer-events:none;
}
.hero__grid{
  position:relative;z-index:1;
  display:grid;grid-template-columns:1.02fr .98fr;gap:clamp(28px,4vw,64px);align-items:center;
}
.hero__title{margin-top:20px}
.hero__sub{margin-top:22px;max-width:33em}
.hero__trust{
  display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:26px;
  font-size:.87rem;font-weight:600;color:var(--brand-dp);
}
.hero__trust span{display:inline-flex;align-items:center;gap:8px}
.hero__trust svg{color:var(--brand);flex:none}
.hero__actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:32px}
.hero__socials{margin-top:34px}

/* visual */
.hero__visual{position:relative;justify-self:center;width:100%;max-width:520px}
.arch{
  position:relative;
  aspect-ratio:1/1.09;
  border-radius:50% 50% var(--r-xl) var(--r-xl) / 44% 44% 5% 5%;
  background:var(--arch-bg);
  overflow:hidden;
  box-shadow:var(--sh-l);
}
.arch::before{
  content:"";position:absolute;left:50%;bottom:-18%;translate:-50% 0;
  width:112%;aspect-ratio:1;border-radius:50%;
  background:var(--arch-glow);
}
.arch img{
  position:absolute;left:50%;bottom:0;translate:-50% 0;
  width:104%;max-width:none;object-fit:contain;object-position:bottom;
}
.hero__badge{
  position:absolute;left:-4%;bottom:16%;z-index:2;
  display:flex;align-items:center;gap:11px;
  background:var(--paper);padding:12px 18px;border-radius:999px;
  box-shadow:var(--sh-m);
  font-size:.83rem;font-weight:700;color:var(--brand-dp);white-space:nowrap;
}
.hero__badge .dot{width:9px;height:9px;border-radius:50%;background:#3FBF7F;flex:none;box-shadow:0 0 0 4px rgba(63,191,127,.18)}
.hero__ribbon{
  position:absolute;right:-2%;top:11%;z-index:2;
  background:var(--brand-solid);color:var(--on-solid);border-radius:var(--r-md);
  padding:14px 18px;box-shadow:var(--sh-m);text-align:center;
}
.hero__ribbon b{display:block;font-family:var(--serif);font-size:1.9rem;line-height:1;font-weight:600}
.hero__ribbon span{font-size:.68rem;letter-spacing:.13em;text-transform:uppercase;opacity:.85}

/* stats */
.stats{
  position:relative;z-index:2;
  margin-top:clamp(38px,5vw,64px);
  display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(10px,1.4vw,18px);
}
.stat{
  background:var(--paper);border-radius:var(--r-lg);
  padding:clamp(20px,2.4vw,30px);
  border:1px solid var(--line-soft);box-shadow:var(--sh-s);
  transition:transform .35s cubic-bezier(.2,.7,.3,1), box-shadow .35s;
}
.stat:hover{transform:translateY(-4px);box-shadow:var(--sh-m)}
.stat b{
  display:block;font-family:var(--serif);font-weight:600;
  font-size:clamp(2.1rem,1.5rem + 1.9vw,3rem);line-height:1;color:var(--brand);
}
.stat span{display:block;margin-top:10px;font-size:.8rem;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);font-weight:600;line-height:1.5}

@media (max-width:940px){
  .hero__grid{grid-template-columns:1fr;gap:38px}
  .hero__visual{max-width:400px;order:2}
  .hero__copy{order:1}
  .stats{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:430px){
  .hero__ribbon{padding:11px 14px}
  .hero__badge{left:0;font-size:.76rem;padding:10px 14px}
}

/* ---------- Marquee ---------- */
.marquee{background:var(--paper);border-block:1px solid var(--line-soft);padding:26px 0;overflow:hidden;margin-top:clamp(48px,6vw,84px)}
.marquee__label{text-align:center;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);font-weight:700;margin-bottom:18px}
.marquee__track{display:flex;width:max-content;animation:slide 44s linear infinite}
.marquee:hover .marquee__track{animation-play-state:paused}
.marquee__row{display:flex;align-items:center;gap:clamp(28px,4vw,56px);padding-right:clamp(28px,4vw,56px)}
.marquee__item{
  display:flex;align-items:center;gap:12px;white-space:nowrap;
  font-size:clamp(.9rem,.85rem + .2vw,1.02rem);font-weight:600;color:var(--brand-dp);
}
.marquee__item i{width:6px;height:6px;border-radius:50%;background:var(--brand);opacity:.5;flex:none}
@keyframes slide{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.marquee__track{animation:none;flex-wrap:wrap;width:auto;justify-content:center}}

/* ---------- About ---------- */
.about__grid{display:grid;grid-template-columns:1fr 1.02fr;gap:clamp(32px,5vw,72px);align-items:center}
.about__cols{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:36px}
.about__col h4{font-size:.78rem;letter-spacing:.15em;text-transform:uppercase;color:var(--brand);font-weight:800;margin-bottom:12px}
.about__col p{font-size:.95rem;color:var(--muted);margin:0}
.about__col{padding-top:20px;border-top:1px solid var(--line)}
.about__sign{margin-top:34px;display:flex;align-items:center;gap:16px}
.about__sign img{height:46px;width:auto;opacity:.9}
.about__sign p{font-size:.85rem;color:var(--muted);line-height:1.5}

.arches{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(10px,1.4vw,18px)}
.arches figure{margin:0}
.arch-card{
  position:relative;display:block;width:100%;padding:0;border:0;cursor:zoom-in;background:var(--cream-2);
  aspect-ratio:1/1.72;border-radius:999px 999px var(--r-md) var(--r-md);overflow:hidden;
  box-shadow:var(--sh-m);
  transition:transform .4s cubic-bezier(.2,.7,.3,1);
}
.arches figure:nth-child(2) .arch-card{transform:translateY(-26px)}
.arch-card img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.3,1)}
.arch-card:hover img{transform:scale(1.06)}
.arches figure:nth-child(2) .arch-card:hover{transform:translateY(-32px)}
.arch-card:hover{transform:translateY(-6px)}
.arch-card::after{
  content:"";position:absolute;inset:auto 0 0 0;height:42%;
  background:linear-gradient(to top, rgba(10,54,81,.5), transparent);opacity:0;transition:opacity .35s;
}
.arch-card:hover::after{opacity:1}
@media (max-width:940px){
  .about__grid{grid-template-columns:1fr}
  .arches{max-width:520px;margin-inline:auto;width:100%}
}
@media (max-width:560px){.about__cols{grid-template-columns:1fr;gap:20px}}

/* ---------- Diplomas ---------- */
.diplomas{background:var(--paper)}
.dip-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,1.8vw,26px);margin-top:clamp(34px,4vw,52px)}
.dip{
  border:0;padding:0;background:transparent;text-align:left;cursor:zoom-in;
  display:flex;flex-direction:column;gap:14px;
}
.dip__img{
  position:relative;border-radius:var(--r-md);overflow:hidden;background:var(--cream-2);
  aspect-ratio:4/3;border:1px solid var(--line-soft);
  transition:transform .35s cubic-bezier(.2,.7,.3,1), box-shadow .35s;
}
.dip__img img{width:100%;height:100%;object-fit:cover;object-position:top center}
.dip:hover .dip__img{transform:translateY(-5px);box-shadow:var(--sh-m)}
.dip__img i{
  position:absolute;right:10px;bottom:10px;width:32px;height:32px;border-radius:50%;
  background:rgba(255,255,255,.92);display:grid;place-items:center;color:var(--brand);
  opacity:0;transform:scale(.85);transition:.3s;
}
.dip:hover .dip__img i{opacity:1;transform:none}
.dip b{display:block;font-size:.95rem;font-weight:700;color:var(--brand-dp);line-height:1.35}
.dip span{display:block;margin-top:5px;font-size:.83rem;color:var(--muted);line-height:1.5}
@media (max-width:900px){.dip-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:480px){.dip-grid{grid-template-columns:1fr}}

/* ---------- Tabs / Направления ---------- */
.tabs{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:clamp(28px,3.5vw,44px)}
.tab{
  border:1.5px solid var(--line);background:transparent;border-radius:999px;
  padding:12px 26px;font-size:.92rem;font-weight:700;color:var(--brand-dp);cursor:pointer;
  transition:.28s;
}
.tab:hover{border-color:var(--brand);color:var(--brand)}
.tab[aria-selected="true"]{background:var(--brand-solid);border-color:var(--brand-solid);color:var(--on-solid);box-shadow:0 12px 26px -16px rgba(0,111,175,.95)}
.panel[hidden]{display:none}
.panel{margin-top:clamp(26px,3vw,40px)}
.panel__intro{max-width:640px;margin:0 auto clamp(26px,3vw,38px);text-align:center;color:var(--muted)}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.8vw,24px)}
.card{
  background:var(--paper);border:1px solid var(--line-soft);border-radius:var(--r-lg);
  padding:clamp(24px,2.6vw,34px);
  transition:transform .35s cubic-bezier(.2,.7,.3,1), box-shadow .35s, border-color .35s;
}
.card:hover{transform:translateY(-5px);box-shadow:var(--sh-m);border-color:transparent}
.card__ico{
  width:54px;height:54px;border-radius:50%;display:grid;place-items:center;
  background:var(--tint);color:var(--brand);margin-bottom:20px;
}
.card h3{font-family:var(--serif);font-size:1.42rem;font-weight:600;color:var(--brand-dp);line-height:1.25}
.card p{margin-top:12px;font-size:.94rem;color:var(--muted)}
.card ul{margin-top:16px;display:grid;gap:9px}
.card li{position:relative;padding-left:22px;font-size:.9rem;color:var(--muted)}
.card li::before{
  content:"";position:absolute;left:0;top:.62em;width:9px;height:9px;border-radius:50%;
  border:1.6px solid var(--brand);opacity:.65;
}
@media (max-width:900px){.cards{grid-template-columns:1fr 1fr}}
@media (max-width:600px){.cards{grid-template-columns:1fr}}

/* ---------- Process (dark band) ---------- */
.process{
  background:var(--deep);color:#fff;position:relative;overflow:hidden;
}
.process::before{
  content:"";position:absolute;width:60vw;aspect-ratio:1;border-radius:50%;
  left:-18vw;bottom:-32vw;
  background:radial-gradient(circle at 50% 50%, rgba(0,111,175,.42), rgba(0,111,175,0) 66%);
}
.process .display,.process .eyebrow{color:#fff}
.process .eyebrow{color:#8FCDEC}
.process .lead{color:rgba(255,255,255,.72)}
.process__in{position:relative;z-index:1;width:min(100% - var(--gut)*2, var(--wrap));margin-inline:auto}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2vw,28px);margin-top:clamp(38px,4.5vw,60px)}
.step{position:relative;padding-top:34px;border-top:1px solid rgba(255,255,255,.2)}
.step::before{
  content:"";position:absolute;top:-5px;left:0;width:9px;height:9px;border-radius:50%;background:#8FCDEC;
}
.step b{font-family:var(--serif);font-size:2.6rem;font-weight:500;color:rgba(255,255,255,.34);line-height:1;display:block}
.step h4{margin-top:12px;font-size:1.08rem;font-weight:700;color:#fff}
.step p{margin-top:10px;font-size:.92rem;color:rgba(255,255,255,.68);line-height:1.65}
.process__note{
  margin-top:clamp(34px,4vw,52px);padding:clamp(22px,2.6vw,32px);
  border-radius:var(--r-lg);background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);
  display:flex;gap:22px;align-items:flex-start;flex-wrap:wrap;
}
.process__note svg{color:#8FCDEC;flex:none;margin-top:3px}
.process__note p{font-size:.95rem;color:rgba(255,255,255,.78);max-width:70ch}
@media (max-width:900px){.steps{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.steps{grid-template-columns:1fr}}

/* ---------- Cases ---------- */
.cases-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,26px);margin-top:clamp(34px,4vw,52px)}
.case{
  background:var(--paper);border:1px solid var(--line-soft);border-radius:var(--r-lg);
  padding:clamp(24px,2.6vw,34px);display:flex;flex-direction:column;
  transition:transform .35s cubic-bezier(.2,.7,.3,1), box-shadow .35s;
}
.case:hover{transform:translateY(-5px);box-shadow:var(--sh-m)}
.case__tag{
  align-self:flex-start;font-size:.72rem;letter-spacing:.13em;text-transform:uppercase;font-weight:800;
  color:var(--brand);background:var(--tint);padding:7px 14px;border-radius:999px;
}
.case h3{margin-top:18px;font-family:var(--serif);font-size:1.5rem;font-weight:600;color:var(--brand-dp);line-height:1.22}
.case__meta{margin-top:8px;font-size:.83rem;color:var(--muted);font-weight:600}
.case__ba{display:grid;gap:0;margin-top:22px;border-top:1px solid var(--line-soft)}
.case__ba div{padding:16px 0;border-bottom:1px solid var(--line-soft)}
.case__ba dt{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;font-weight:800;color:var(--muted)}
.case__ba dd{margin:6px 0 0;font-size:.93rem;color:var(--ink);line-height:1.6}
.case__ba .is-after dt{color:var(--brand)}
.case__ba .is-after dd{font-weight:600;color:var(--brand-dp)}
.cases__disclaimer{
  margin-top:clamp(24px,3vw,36px);font-size:.85rem;color:var(--muted);
  display:flex;gap:12px;align-items:flex-start;max-width:80ch;
}
.cases__disclaimer svg{flex:none;color:var(--brand);margin-top:3px}
@media (max-width:940px){.cases-grid{grid-template-columns:1fr}}

/* ---------- Formats ---------- */
.formats{background:var(--paper)}
.formats__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2.2vw,28px);margin-top:clamp(34px,4vw,52px)}
.format{
  border:1.5px solid var(--line);border-radius:var(--r-xl);
  padding:clamp(28px,3vw,42px);display:flex;flex-direction:column;
  background:var(--cream);
}
.format--main{background:var(--deep-grad);border-color:transparent;color:#fff;box-shadow:var(--sh-l)}
.format__top{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.format__kind{font-size:.74rem;letter-spacing:.15em;text-transform:uppercase;font-weight:800;color:var(--brand)}
.format--main .format__kind{color:#8FCDEC}
.format__time{font-size:.84rem;font-weight:700;color:var(--muted);display:inline-flex;align-items:center;gap:7px}
.format--main .format__time{color:rgba(255,255,255,.75)}
.format h3{margin-top:14px;font-family:var(--serif);font-size:clamp(1.6rem,1.3rem + 1vw,2.1rem);font-weight:600;color:var(--brand-dp);line-height:1.16}
.format--main h3{color:#fff}
.format > p{margin-top:14px;font-size:.96rem;color:var(--muted)}
.format--main > p{color:rgba(255,255,255,.75)}
.format ul{margin-top:24px;display:grid;gap:12px;flex:1}
.format li{position:relative;padding-left:30px;font-size:.94rem;line-height:1.6}
.format li::before{
  content:"";position:absolute;left:0;top:.28em;width:19px;height:19px;border-radius:50%;
  background:var(--tint);
  background-image:var(--check-icon);
  background-repeat:no-repeat;background-position:center;
}
.format--main li{color:rgba(255,255,255,.86)}
.format--main li::before{background-color:rgba(255,255,255,.16);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='11' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E")}
.format__price{margin-top:26px;padding-top:22px;border-top:1px solid var(--line)}
.format--main .format__price{border-color:rgba(255,255,255,.2)}
.format__price b{font-family:var(--serif);font-size:1.9rem;font-weight:600;color:var(--brand-dp);line-height:1}
.format--main .format__price b{color:#fff}
.format__price span{display:block;margin-top:6px;font-size:.83rem;color:var(--muted)}
.format--main .format__price span{color:rgba(255,255,255,.65)}
.format .btn{margin-top:22px}
@media (max-width:820px){.formats__grid{grid-template-columns:1fr}}

/* ---------- FAQ ---------- */
.faq{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(30px,5vw,72px);align-items:start}
.faq__list{display:grid;gap:12px}
.acc{background:var(--paper);border:1px solid var(--line-soft);border-radius:var(--r-md);overflow:hidden;transition:box-shadow .3s,border-color .3s}
.acc.is-open{box-shadow:var(--sh-m);border-color:transparent}
.acc__q{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:18px;
  padding:22px clamp(18px,2vw,28px);background:transparent;border:0;cursor:pointer;text-align:left;
  font-size:1.02rem;font-weight:700;color:var(--brand-dp);line-height:1.45;
}
.acc__q:hover{color:var(--brand)}
.acc__ico{
  flex:none;width:30px;height:30px;border-radius:50%;border:1.5px solid var(--line);
  display:grid;place-items:center;position:relative;transition:.3s;
}
.acc__ico::before,.acc__ico::after{content:"";position:absolute;background:var(--brand);border-radius:2px;transition:transform .3s cubic-bezier(.2,.7,.3,1)}
.acc__ico::before{width:11px;height:1.7px}
.acc__ico::after{width:1.7px;height:11px}
.acc.is-open .acc__ico{background:var(--brand-solid);border-color:var(--brand-solid)}
.acc.is-open .acc__ico::before{background:var(--on-solid)}
.acc.is-open .acc__ico::after{transform:scaleY(0)}
.acc__a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s cubic-bezier(.2,.7,.3,1)}
.acc.is-open .acc__a{grid-template-rows:1fr}
.acc__a > div{overflow:hidden}
.acc__a p{padding:0 clamp(18px,2vw,28px) 24px;font-size:.95rem;color:var(--muted)}
.acc__a p + p{padding-top:0;margin-top:-10px}
.faq__aside{
  position:sticky;top:calc(var(--header-h) + 24px);
  background:var(--paper);border-radius:var(--r-xl);padding:clamp(26px,3vw,38px);
  border:1px solid var(--line-soft);box-shadow:var(--sh-s);
}
.faq__aside .display{margin-top:16px}
.faq__aside p{margin-top:16px;font-size:.95rem;color:var(--muted)}
.faq__aside .btn{margin-top:24px}
@media (max-width:940px){
  .faq{grid-template-columns:1fr}
  .faq__aside{position:static;order:2}
}

/* ---------- CTA + form ---------- */
.cta{background:var(--deep);color:#fff;position:relative;overflow:hidden}
.cta::before{
  content:"";position:absolute;width:70vw;aspect-ratio:1;border-radius:50%;right:-24vw;top:-34vw;
  background:radial-gradient(circle at 50% 50%, rgba(0,111,175,.5), rgba(0,111,175,0) 65%);
}
.cta__grid{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:clamp(34px,5vw,70px);align-items:center}
.cta .display{color:#fff}
.cta .eyebrow{color:#8FCDEC}
.cta__copy p{margin-top:20px;color:rgba(255,255,255,.74);max-width:38em}
.cta__contacts{margin-top:30px;display:grid;gap:14px}
.cta__contacts a{display:inline-flex;align-items:center;gap:12px;font-weight:600;color:#fff;width:fit-content}
.cta__contacts a:hover{color:#8FCDEC}
.cta__contacts svg{color:#8FCDEC;flex:none}
.cta__socials{margin-top:32px}

.form{background:var(--paper);border-radius:var(--r-xl);padding:clamp(26px,3vw,40px);box-shadow:var(--sh-l);color:var(--ink)}
.form h3{font-family:var(--serif);font-size:1.65rem;font-weight:600;color:var(--brand-dp)}
.form > p{margin-top:8px;font-size:.9rem;color:var(--muted)}
.field{margin-top:18px}
.field label{display:block;font-size:.79rem;letter-spacing:.09em;text-transform:uppercase;font-weight:800;color:var(--muted);margin-bottom:8px}
.field input,.field select,.field textarea{
  width:100%;padding:14px 16px;border:1.5px solid var(--line);border-radius:12px;
  background:var(--cream);font-size:.96rem;transition:border-color .25s, background .25s;
}
.field textarea{resize:vertical;min-height:96px}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--brand);background:#fff}
.field input[aria-invalid="true"],.field textarea[aria-invalid="true"]{border-color:var(--err-line);background:var(--err-bg)}
.field .err{display:none;margin-top:6px;font-size:.8rem;color:#C0392B;font-weight:600}
.field.has-err .err{display:block}
.form .btn{margin-top:24px}
.form__policy{margin-top:14px;font-size:.78rem;color:var(--muted);line-height:1.5}
.form__ok{
  display:none;text-align:center;padding:26px 10px;
}
.form.is-sent .form__ok{display:block}
.form.is-sent .form__body{display:none}
.form__ok svg{margin:0 auto 16px;color:#3FBF7F}
.form__ok b{display:block;font-family:var(--serif);font-size:1.5rem;color:var(--brand-dp);font-weight:600}
.form__ok p{margin-top:10px;font-size:.93rem;color:var(--muted)}
@media (max-width:940px){.cta__grid{grid-template-columns:1fr}}

/* ---------- Footer ---------- */
.footer{background:var(--footer-bg);color:rgba(255,255,255,.66);padding-block:clamp(48px,6vw,70px) 30px;font-size:.92rem}
.footer__top{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:clamp(28px,4vw,58px)}
.footer__logo img{height:44px;width:auto;margin-bottom:20px}
.footer__top p{max-width:34em;line-height:1.7}
.footer h4{font-size:.76rem;letter-spacing:.16em;text-transform:uppercase;color:#fff;font-weight:800;margin-bottom:16px}
.footer nav{display:grid;gap:10px}
.footer nav a:hover,.footer__contacts a:hover{color:#8FCDEC}
.footer__contacts{display:grid;gap:10px}
.footer__socials{margin-top:24px}
.footer__bottom{
  margin-top:clamp(36px,4vw,54px);padding-top:24px;border-top:1px solid rgba(255,255,255,.14);
  display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;font-size:.83rem;
}
.footer__disclaimer{
  margin-top:26px;padding:18px 20px;border-radius:var(--r-md);
  background:rgba(255,255,255,.05);font-size:.82rem;line-height:1.6;max-width:none;
}
@media (max-width:820px){.footer__top{grid-template-columns:1fr;gap:34px}}

/* ---------- Lightbox ---------- */
.lb{
  position:fixed;inset:0;z-index:200;display:none;
  background:rgba(6,32,48,.94);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  padding:clamp(14px,3vw,40px);
}
.lb.is-open{display:grid;grid-template-rows:1fr auto;gap:16px;place-items:center;animation:fade .25s ease both}
@keyframes fade{from{opacity:0}to{opacity:1}}
.lb__img{max-width:min(100%,1100px);max-height:calc(100vh - 150px);object-fit:contain;border-radius:10px;box-shadow:0 40px 90px -30px rgba(0,0,0,.7);background:#fff}
.lb__cap{color:rgba(255,255,255,.85);text-align:center;font-size:.92rem;max-width:60ch;padding-bottom:8px}
.lb__cap b{display:block;color:#fff;font-size:1.02rem;margin-bottom:4px}
.lb__btn{
  position:absolute;top:50%;translate:0 -50%;
  width:52px;height:52px;border-radius:50%;border:1px solid rgba(255,255,255,.3);
  background:rgba(255,255,255,.08);color:#fff;display:grid;place-items:center;cursor:pointer;transition:.25s;
}
.lb__btn:hover{background:#fff;color:var(--deep)}
.lb__prev{left:clamp(10px,2vw,28px)}
.lb__next{right:clamp(10px,2vw,28px)}
.lb__close{
  position:absolute;top:clamp(12px,2vw,26px);right:clamp(12px,2vw,26px);translate:none;
  width:48px;height:48px;
}
@media (max-width:640px){
  .lb__btn{width:42px;height:42px}
  .lb__prev{left:6px}.lb__next{right:6px}
}
body.lb-open,body.nav-open{overflow:hidden}

/* ---------- Reveal ---------- */
[data-reveal]{opacity:0;transform:translateY(26px);transition:opacity .7s cubic-bezier(.2,.7,.3,1), transform .7s cubic-bezier(.2,.7,.3,1)}
[data-reveal].is-in{opacity:1;transform:none}
[data-reveal][data-delay="1"]{transition-delay:.09s}
[data-reveal][data-delay="2"]{transition-delay:.18s}
[data-reveal][data-delay="3"]{transition-delay:.27s}
[data-reveal][data-delay="4"]{transition-delay:.36s}
@media (prefers-reduced-motion:reduce){[data-reveal]{opacity:1;transform:none}}

/* ---------- Back to top ---------- */
.totop{
  position:fixed;right:clamp(14px,2.5vw,28px);bottom:clamp(14px,2.5vw,28px);z-index:90;
  width:50px;height:50px;border-radius:50%;border:0;cursor:pointer;
  background:var(--brand-solid);color:var(--on-solid);display:grid;place-items:center;
  box-shadow:var(--sh-m);opacity:0;pointer-events:none;transform:translateY(12px);transition:.35s;
}
.totop.is-on{opacity:1;pointer-events:auto;transform:none}
.totop:hover{background:var(--brand-solid-h)}

/* =========================================================
   WORDPRESS: блог, внутренние страницы, служебные классы
   ========================================================= */

/* ---------- Служебное ---------- */
.screen-reader-text{
  position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;
}
.gy-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.admin-bar .header{top:32px}
@media (max-width:782px){.admin-bar .header{top:46px}}
.section--tight{padding-block:clamp(44px,5vw,76px)}

.admin-hint{
  display:flex;gap:12px;align-items:flex-start;
  margin:0 0 clamp(24px,3vw,36px);padding:16px 20px;
  border:1px dashed var(--brand);border-radius:var(--r-md);
  background:var(--tint);font-size:.88rem;color:var(--brand-dp);
}
.admin-hint svg{flex:none;margin-top:3px;color:var(--brand)}
.admin-hint a{color:var(--brand);font-weight:700;text-decoration:underline}

.form__error{
  margin:16px 0 0;padding:12px 16px;border-radius:10px;
  background:var(--err-bg);border:1px solid var(--err-bd);color:var(--err-fg);font-size:.88rem;font-weight:600;
}
.cta__geo{display:inline-flex;align-items:center;gap:12px;color:rgba(255,255,255,.75);font-weight:600}
.cta__geo svg{color:#8FCDEC;flex:none}

/* ---------- Переключатель языков ---------- */
.langs{display:flex;align-items:center;gap:2px;flex:none}
.lang{
  padding:6px 10px;border-radius:999px;font-size:.78rem;font-weight:800;letter-spacing:.05em;
  color:var(--muted);transition:.25s;
}
.lang:hover{color:var(--brand);background:var(--tint)}
.lang.is-current{color:#fff;background:var(--brand)}
@media (max-width:1000px){.langs{margin-left:auto;margin-right:6px}}

/* ---------- Шапка внутренней страницы ---------- */
.page-hero{
  padding-top:calc(var(--header-h) + clamp(38px,6vw,84px));
  padding-bottom:clamp(28px,4vw,52px);
  position:relative;overflow:hidden;
}
.page-hero::after{
  content:"";position:absolute;z-index:0;pointer-events:none;
  width:min(56vw,760px);aspect-ratio:1;right:-16vw;top:-22vw;border-radius:50%;
  background:radial-gradient(circle at 40% 40%, rgba(0,111,175,.12), rgba(0,111,175,0) 68%);
}
.page-hero .wrap{position:relative;z-index:1;max-width:min(100% - var(--gut)*2, 860px)}
.page-hero .display{margin-top:16px}
.page-hero .lead{margin-top:18px}
.single__meta{display:flex;flex-wrap:wrap;gap:10px;align-items:center;font-size:.85rem;color:var(--muted);font-weight:600}
.single__meta a{color:var(--brand)}
.single__meta a:hover{text-decoration:underline}

.single__cover{margin-bottom:clamp(10px,2vw,24px)}
.single__cover img{width:100%;height:auto;border-radius:var(--r-lg);box-shadow:var(--sh-m)}

/* ---------- Сетка записи ---------- */
.single__grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:clamp(30px,4vw,64px);align-items:start}
.single__aside{position:sticky;top:calc(var(--header-h) + 24px)}
.promo{
  background:var(--deep-grad);color:#fff;
  border-radius:var(--r-xl);padding:clamp(24px,2.6vw,32px);box-shadow:var(--sh-m);
}
.promo .eyebrow{color:#8FCDEC}
.promo .display{color:#fff;font-size:1.6rem;margin-top:12px}
.promo p{margin-top:12px;font-size:.92rem;color:rgba(255,255,255,.74)}
.promo .btn{margin-top:20px;--bg:#fff;--fg:#0B3A55;--bd:#fff}
.promo .socials{margin-top:20px}
.promo .socials a{border-color:rgba(255,255,255,.28);color:#fff}
.promo .socials a:hover{background:#fff;color:var(--deep);border-color:#fff}
@media (max-width:960px){
  .single__grid{grid-template-columns:1fr}
  .single__aside{position:static}
}

/* ---------- Типографика статьи ---------- */
.article__body{max-width:72ch;font-size:1.05rem;line-height:1.8;color:var(--body-text)}
.article__body--page{margin-inline:auto}
.article__body > * + *{margin-top:1.15em}
.article__body h2,.article__body h3,.article__body h4{
  font-family:var(--serif);color:var(--brand-dp);font-weight:600;line-height:1.2;
  margin-top:1.9em;margin-bottom:.55em;
}
.article__body h2{font-size:clamp(1.65rem,1.3rem + 1.1vw,2.2rem)}
.article__body h3{font-size:clamp(1.35rem,1.15rem + .7vw,1.7rem)}
.article__body h4{font-size:1.2rem;font-family:var(--sans);font-weight:800}
.article__body a{color:var(--brand);text-decoration:underline;text-underline-offset:3px}
.article__body a:hover{color:var(--brand-dk)}
.article__body strong{font-weight:700;color:var(--ink)}
.article__body ul,.article__body ol{padding-left:0;display:grid;gap:.6em}
.article__body ul li{position:relative;padding-left:26px;list-style:none}
.article__body ul li::before{
  content:"";position:absolute;left:2px;top:.62em;width:8px;height:8px;border-radius:50%;
  border:1.6px solid var(--brand);
}
.article__body ol{counter-reset:gy;padding-left:0}
.article__body ol li{position:relative;padding-left:34px;list-style:none;counter-increment:gy}
.article__body ol li::before{
  content:counter(gy);position:absolute;left:0;top:.05em;
  width:23px;height:23px;border-radius:50%;background:var(--tint);color:var(--brand);
  font-size:.76rem;font-weight:800;display:grid;place-items:center;font-family:var(--sans);
}
.article__body blockquote{
  margin-inline:0;padding:clamp(18px,2.4vw,28px) clamp(20px,2.6vw,32px);
  background:var(--paper);border-left:3px solid var(--brand);border-radius:0 var(--r-md) var(--r-md) 0;
  font-family:var(--serif);font-size:1.25rem;line-height:1.5;color:var(--brand-dp);box-shadow:var(--sh-s);
}
.article__body blockquote p{margin:0}
.article__body blockquote cite{display:block;margin-top:12px;font-family:var(--sans);font-size:.85rem;color:var(--muted);font-style:normal}
.article__body img,.article__body figure img{border-radius:var(--r-md);box-shadow:var(--sh-s)}
.article__body figure{margin-inline:0}
.article__body figcaption,.wp-caption-text{margin-top:10px;font-size:.85rem;color:var(--muted);text-align:center}
.article__body hr{border:0;height:1px;background:var(--line);margin-block:2.4em}
.article__body code{background:var(--cream-2);padding:.15em .45em;border-radius:6px;font-size:.9em}
.article__body pre{background:var(--deep);color:#DCE9F1;padding:20px;border-radius:var(--r-md);overflow-x:auto;font-size:.88rem}
.article__body pre code{background:none;padding:0;color:inherit}
.article__body table{width:100%;border-collapse:collapse;font-size:.94rem;display:block;overflow-x:auto}
.article__body th,.article__body td{padding:12px 14px;border-bottom:1px solid var(--line);text-align:left}
.article__body th{font-weight:800;color:var(--brand-dp);background:var(--tint-2)}
.article__body .alignwide{width:min(100vw - var(--gut)*2, 1000px);margin-inline:calc(50% - min(50vw - var(--gut), 500px))}
.article__body .alignfull{width:100vw;margin-inline:calc(50% - 50vw);border-radius:0}
.article__body .alignfull img{border-radius:0}
.article__body .aligncenter{margin-inline:auto;text-align:center}

.tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:2.4em;padding-top:1.6em;border-top:1px solid var(--line)}
.tags a{
  font-size:.82rem;font-weight:600;color:var(--brand-dp);
  padding:7px 14px;border-radius:999px;background:var(--paper);border:1px solid var(--line);
}
.tags a:hover{background:var(--brand);color:#fff;border-color:var(--brand)}

.page-links{margin-top:2em;display:flex;gap:8px;align-items:center;font-weight:700}
.page-links a{padding:6px 12px;border-radius:8px;background:var(--paper);border:1px solid var(--line)}

/* ---------- Сетка карточек записей ---------- */
.posts-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,26px)}
.blog-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:clamp(30px,4vw,60px);align-items:start}
.blog-layout--full{grid-template-columns:1fr}
.blog-layout .posts-grid{grid-template-columns:repeat(2,1fr)}
.blog-layout--full .posts-grid{grid-template-columns:repeat(3,1fr)}
@media (max-width:1000px){
  .blog-layout{grid-template-columns:1fr}
  .blog-layout .posts-grid,.blog-layout--full .posts-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:680px){
  .posts-grid,.blog-layout .posts-grid,.blog-layout--full .posts-grid{grid-template-columns:1fr}
}

.post-card{
  background:var(--paper);border:1px solid var(--line-soft);border-radius:var(--r-lg);
  overflow:hidden;display:flex;flex-direction:column;
  transition:transform .35s cubic-bezier(.2,.7,.3,1), box-shadow .35s;
}
.post-card:hover{transform:translateY(-5px);box-shadow:var(--sh-m)}
.post-card__media{display:block;aspect-ratio:16/10;background:var(--tint);overflow:hidden}
.post-card__media img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.3,1)}
.post-card:hover .post-card__media img{transform:scale(1.05)}
.post-card__ph{width:100%;height:100%;display:grid;place-items:center;color:var(--brand);opacity:.35}
.post-card__body{padding:clamp(20px,2.2vw,28px);display:flex;flex-direction:column;flex:1}
.post-card__meta{display:flex;flex-wrap:wrap;gap:7px;font-size:.78rem;color:var(--muted);font-weight:600}
.post-card h3{margin-top:12px;font-family:var(--serif);font-size:1.35rem;font-weight:600;line-height:1.25;color:var(--brand-dp)}
.post-card h3 a:hover{color:var(--brand)}
.post-card p{margin-top:10px;font-size:.93rem;color:var(--muted);flex:1}
.post-card__more{
  margin-top:18px;display:inline-flex;align-items:center;gap:8px;
  font-size:.85rem;font-weight:800;color:var(--brand);
}
.post-card:hover .post-card__more svg{transform:translateX(4px)}
.post-card__more svg{transition:transform .3s cubic-bezier(.2,.7,.3,1)}

.blog-home__more{margin-top:clamp(28px,3.4vw,44px);text-align:center}
.related{background:var(--paper)}
.related .display{margin-bottom:clamp(24px,3vw,38px)}

/* ---------- Сайдбар и виджеты ---------- */
.sidebar{position:sticky;top:calc(var(--header-h) + 24px);display:grid;gap:18px}
.widget{
  background:var(--paper);border:1px solid var(--line-soft);border-radius:var(--r-lg);
  padding:clamp(20px,2.2vw,28px);font-size:.93rem;
}
.widget__title{
  font-size:.76rem;letter-spacing:.15em;text-transform:uppercase;font-weight:800;
  color:var(--brand);margin-bottom:14px;
}
.widget ul{display:grid;gap:10px}
.widget a{color:var(--brand-dp)}
.widget li a:hover{color:var(--brand)}
@media (max-width:1000px){.sidebar{position:static}}

/* ---------- Поиск ---------- */
.searchform{display:flex;gap:8px;max-width:440px}
.searchform input{
  flex:1;padding:13px 16px;border:1.5px solid var(--line);border-radius:999px;
  background:var(--paper);font-size:.95rem;
}
.searchform input:focus{outline:none;border-color:var(--brand)}
.searchform button{
  flex:none;width:48px;height:48px;border-radius:50%;border:0;cursor:pointer;
  background:var(--brand-solid);color:var(--on-solid);display:grid;place-items:center;transition:.25s;
}
.searchform button:hover{background:var(--brand-solid-h)}

.empty{text-align:center;padding-block:clamp(20px,4vw,50px)}
.empty .searchform{margin:26px auto 0}
.empty .muted{margin-top:10px}

/* ---------- Пагинация ---------- */
.pagination{margin-top:clamp(34px,4vw,52px)}
.pagination .nav-links{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;align-items:center}
.page-numbers{
  min-width:44px;height:44px;padding:0 14px;border-radius:999px;
  display:inline-flex;align-items:center;justify-content:center;
  background:var(--paper);border:1px solid var(--line);
  font-size:.9rem;font-weight:700;color:var(--brand-dp);transition:.25s;
}
.page-numbers:hover{border-color:var(--brand);color:var(--brand)}
.page-numbers.current{background:var(--brand-solid);border-color:var(--brand-solid);color:var(--on-solid)}
.page-numbers.dots{background:none;border:0}

/* ---------- Комментарии ---------- */
.comments-wrap{max-width:72ch;margin-inline:auto}
.comments__title{font-size:1.6rem;margin-bottom:24px}
.comment-list{display:grid;gap:20px;margin-bottom:44px}
.comment-list ol.children{margin-top:20px;padding-left:clamp(16px,3vw,40px);display:grid;gap:20px}
.comment-body{
  background:var(--paper);border:1px solid var(--line-soft);border-radius:var(--r-lg);
  padding:clamp(20px,2.2vw,28px);
}
.comment-meta{display:flex;align-items:center;gap:12px;margin-bottom:12px;font-size:.85rem;color:var(--muted)}
.comment-author{display:flex;align-items:center;gap:12px;font-weight:700;color:var(--brand-dp)}
.comment-author img{border-radius:50%}
.comment-content{font-size:.96rem}
.comment-content p + p{margin-top:.9em}
.reply{margin-top:12px}
.comment-reply-link{font-size:.83rem;font-weight:800;color:var(--brand)}
.comment-form{display:grid;gap:16px}
.comment-form label{display:block;font-size:.79rem;letter-spacing:.09em;text-transform:uppercase;font-weight:800;color:var(--muted);margin-bottom:8px}
.comment-form input[type="text"],.comment-form input[type="email"],.comment-form input[type="url"],.comment-form textarea{
  width:100%;padding:14px 16px;border:1.5px solid var(--line);border-radius:12px;
  background:var(--paper);font-size:.96rem;
}
.comment-form textarea{min-height:120px;resize:vertical}
.comment-form input:focus,.comment-form textarea:focus{outline:none;border-color:var(--brand)}
.comment-form .form-submit{margin:0}
.comment-form-cookies-consent{display:flex;align-items:center;gap:10px}
.comment-form-cookies-consent label{margin:0;text-transform:none;letter-spacing:0;font-size:.85rem;font-weight:500;color:var(--muted)}

/* ---------- Цвета палитры в редакторе блоков ---------- */
.has-gy-brand-color{color:var(--brand)!important}
.has-gy-deep-color{color:var(--deep)!important}
.has-gy-brand-background-color{background-color:var(--brand)!important}
.has-gy-deep-background-color{background-color:var(--deep)!important}
.has-gy-cream-background-color{background-color:var(--cream)!important}
.has-gy-white-background-color{background-color:var(--paper)!important}


/* =========================================================
   ВИДЖЕТ ЗАПИСИ СТОРОННЕГО ПЛАГИНА (Bookly, Amelia, SSA)

   Такие плагины рисуют форму своими стилями, рассчитанными на светлый
   фон. В тёмной теме их текст и выпадающие списки становятся нечитаемыми,
   а перекрывать все их внутренние классы вслепую ненадёжно — у плагина
   есть ещё календарь, слоты времени и шаг оплаты.

   Поэтому карточка с виджетом остаётся светлой в обеих темах:
   плагин рисуется ровно так, как задумывали его авторы, а на тёмной
   странице это читается как обычная светлая форма-карточка.
   ========================================================= */

.form--widget{ color-scheme:light }
.booking-widget{ margin-top:20px }

/* Поля ввода: задаём цвет явно, чтобы текст не сливался с фоном
   независимо от системной темы пользователя. */
.booking-widget select,
.booking-widget input[type="text"],
.booking-widget input[type="email"],
.booking-widget input[type="tel"],
.booking-widget input[type="number"],
.booking-widget input[type="search"],
.booking-widget textarea{
  color:#22323C;
  background-color:#FFFFFF;
}
.booking-widget option{ color:#22323C; background-color:#FFFFFF }

@media (prefers-color-scheme: dark){
  .form--widget{
    background:#F4F1EA;
    color:#22323C;
  }
  .form--widget h3{ color:#0B3A55 }
  .form--widget > p{ color:#5A6B77 }
}

/* ---------- Переключатель светлой и тёмной темы ---------- */
.theme-toggle{
  flex:none;width:42px;height:42px;border-radius:50%;
  border:1px solid var(--line);background:transparent;color:var(--brand-dp);
  display:grid;place-items:center;cursor:pointer;
  transition:background .25s, color .25s, border-color .25s;
}
.theme-toggle:hover{background:var(--tint);color:var(--brand);border-color:var(--brand)}
.theme-toggle svg{display:block}
/* В светлой теме предлагаем перейти в тёмную — показываем луну */
.theme-toggle .i-sun{display:none}
.theme-toggle .i-moon{display:block}
@media (max-width:1000px){.theme-toggle{width:38px;height:38px}}

/* =========================================================
   КАЛЕНДАРЬ ЗАПИСИ

   Живёт внутри .form--widget, а та всегда светлая — в обеих
   темах. Поэтому цвета здесь заданы явными значениями
   светлой палитры, а не переменными: иначе в тёмной теме
   текст стал бы светлым на светлом.
   ========================================================= */

.cal{ margin-top:20px; color:#22323C }

/* ---------- Выбор формата ---------- */
.cal__services{display:grid;gap:10px;margin-bottom:20px}
@media (min-width:520px){.cal__services{grid-template-columns:1fr 1fr}}
.cal__service{
  text-align:left;padding:14px 16px;border-radius:14px;cursor:pointer;
  border:1.5px solid rgba(11,58,85,.16);background:#FFFFFF;
  transition:border-color .25s, background .25s, transform .25s;
}
.cal__service:hover{border-color:#006FAF;transform:translateY(-1px)}
.cal__service.is-on{border-color:#006FAF;background:#E7F1F7}
.cal__service b{display:block;font-size:.98rem;font-weight:700;color:#0B3A55;line-height:1.3}
.cal__service span{display:block;margin-top:4px;font-size:.83rem;color:#5A6B77}

/* ---------- Часовой пояс ---------- */
.cal__tz{
  display:flex;align-items:center;gap:9px;margin:0 0 16px;
  font-size:.83rem;color:#5A6B77;
}
.cal__tz svg{color:#006FAF;flex:none}
.cal__tz b{color:#0B3A55;font-weight:700}

/* ---------- Месяц ---------- */
.cal__nav{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.cal__title{font-size:1.02rem;font-weight:700;color:#0B3A55}
.cal__arrow{
  width:38px;height:38px;border-radius:50%;flex:none;cursor:pointer;
  border:1px solid rgba(11,58,85,.16);background:#FFFFFF;color:#0B3A55;
  display:grid;place-items:center;transition:.25s;
}
.cal__arrow:hover{border-color:#006FAF;color:#006FAF}

.cal__week,
.cal__grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.cal__week{margin-bottom:6px}
.cal__week span{
  text-align:center;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;
  font-weight:800;color:#93A2AC;
}

.cal__day{
  aspect-ratio:1;border-radius:12px;border:1.5px solid transparent;cursor:pointer;
  background:#F1F4F6;color:#8A9AA6;font-size:.92rem;font-weight:600;
  display:grid;place-items:center;padding:0;
  transition:background .2s, color .2s, border-color .2s, transform .2s;
}
.cal__day.is-empty{background:none;pointer-events:none}
.cal__day.is-off{opacity:.55;cursor:default}
.cal__day.is-loading{background:#EDF1F4;color:transparent;animation:calPulse 1.2s ease-in-out infinite}
.cal__day.is-free{background:#E7F1F7;color:#0B3A55;font-weight:700}
.cal__day.is-free:hover{background:#CFE5F1;transform:translateY(-2px)}
.cal__day.is-today{border-color:rgba(0,111,175,.45)}
.cal__day.is-on{background:#006FAF;color:#FFFFFF;border-color:#006FAF}
@keyframes calPulse{0%,100%{opacity:.55}50%{opacity:.9}}

.cal__hint{margin:14px 0 0;font-size:.83rem;color:#5A6B77;text-align:center}

/* ---------- Слоты ---------- */
.cal__slots{margin-top:22px;padding-top:20px;border-top:1px solid rgba(11,58,85,.12)}
.cal__slots-title{
  margin:0 0 12px;font-size:.76rem;letter-spacing:.09em;text-transform:uppercase;
  font-weight:800;color:#5A6B77;
}
.cal__slots-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:8px}
.cal__slot{
  padding:11px 8px;border-radius:999px;cursor:pointer;
  border:1.5px solid rgba(11,58,85,.16);background:#FFFFFF;
  font-size:.92rem;font-weight:700;color:#0B3A55;
  transition:.22s;
}
.cal__slot:hover{border-color:#006FAF;color:#006FAF;transform:translateY(-2px)}
.cal__slot.is-on{background:#006FAF;border-color:#006FAF;color:#FFFFFF}

/* ---------- Форма ---------- */
.cal__form{margin-top:24px;padding-top:20px;border-top:1px solid rgba(11,58,85,.12)}
.cal__chosen{
  margin:0 0 16px;padding:12px 16px;border-radius:12px;
  background:#E7F1F7;font-size:.9rem;font-weight:700;color:#0B3A55;
}
.cal__form .field label{color:#5A6B77}
.cal__form .field input,
.cal__form .field textarea{background:#F6F3EC;color:#22323C;border-color:rgba(11,58,85,.16)}
.cal__note{display:block;margin-top:6px;font-size:.79rem;color:#5A6B77}
.cal__form .form__policy{color:#5A6B77}

/* ---------- Ошибка и результат ---------- */
.cal__error{
  margin:16px 0 0;padding:12px 16px;border-radius:10px;
  background:#FDF3F2;border:1px solid #E9C4C0;color:#A9332A;
  font-size:.88rem;font-weight:600;
}
.cal__done{text-align:center;padding:18px 6px}
.cal__done svg{margin:0 auto 14px;color:#3FBF7F}
.cal__done b{display:block;font-family:var(--serif);font-size:1.5rem;font-weight:600;color:#0B3A55}
.cal__done p{margin-top:10px;font-size:.93rem;color:#5A6B77}
.cal__done .btn{margin-top:20px}

/* ---------- Страница управления записью ---------- */
.booking-card{
  max-width:720px;margin-inline:auto;
  background:var(--paper);border:1px solid var(--line-soft);border-radius:var(--r-xl);
  padding:clamp(24px,3vw,40px);box-shadow:var(--sh-s);
}
.booking-card__list{display:grid;gap:0;margin:0}
.booking-card__list > div{
  display:grid;grid-template-columns:150px 1fr;gap:16px;
  padding:14px 0;border-bottom:1px solid var(--line-soft);
}
.booking-card__list dt{
  font-size:.74rem;letter-spacing:.09em;text-transform:uppercase;
  font-weight:800;color:var(--muted);
}
.booking-card__list dd{margin:0;font-size:.96rem;color:var(--ink)}
.booking-card__actions{margin-top:24px;display:flex;gap:12px;flex-wrap:wrap}
.booking-card__reschedule{margin-top:34px;padding-top:28px;border-top:1px solid var(--line)}
.booking-card__reschedule .display{font-size:1.5rem}
.booking-card__reschedule .muted{margin-top:8px;font-size:.9rem}
.booking-card__reschedule .cal{
  margin-top:22px;padding:clamp(18px,2.4vw,26px);
  background:#F4F1EA;border-radius:var(--r-lg);color-scheme:light;
}
@media (max-width:560px){
  .booking-card__list > div{grid-template-columns:1fr;gap:4px}
}

/* =========================================================
   ТЁМНАЯ ТЕМА

   Работает в двух режимах:
   1. Сама, по системной настройке пользователя.
   2. По кнопке в шапке — она ставит на <html> атрибут
      data-theme="dark" или "light" и запоминает выбор.

   Ручной выбор сильнее системного: :not([data-theme="light"])
   отключает автоматику, если человек явно выбрал светлую тему.

   ВАЖНО: два набора правил ниже должны совпадать. Меняете
   значение в одном — поменяйте и во втором.
   ========================================================= */

/* --- 1. По системной настройке (если ручной выбор не сделан) --- */
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;

    --brand:#5AB0E0;          /* акцент для текста и иконок — светлее, чтобы читался */
    --brand-dk:#86C8EA;
    --brand-dp:#E6F1F8;       /* заголовки */
    --brand-solid:#0F7CBC;    /* заливка кнопок: белый текст на ней даёт контраст 4.5:1 */
    --brand-solid-h:#1690D6;
    --on-solid:#FFFFFF;

    --deep:#133648;           /* тёмные полосы — светлее фона, иначе полоса не читается */
    --deep-grad:linear-gradient(160deg,#13303F,#134A6B);

    --cream:#0B1922;          /* фон страницы: сине-чёрный, не чистый чёрный */
    --cream-2:#152833;
    --paper:#122530;          /* карточки */

    --ink:#DEE8EF;
    --body-text:#C6D4DE;
    --muted:#93A6B4;

    --tint:#16303F;
    --tint-2:#132936;

    --line:rgba(255,255,255,.15);
    --line-soft:rgba(255,255,255,.08);
    --btn-ghost-bd:rgba(255,255,255,.28);

    --header-bg:rgba(11,25,34,.86);
    --footer-bg:#071620;

    /* Портрет вырезан с белого фона и по кромке светлее середины.
       На тёмной подложке появился бы белый ореол, поэтому арка
       остаётся светлой — только приглушённой, чтобы не слепила. */
    --arch-bg:linear-gradient(168deg, #C3DCEA 0%, #A8CBE0 42%, #D2E7F2 100%);
    --arch-glow:radial-gradient(circle at 50% 40%, rgba(255,255,255,.45), rgba(255,255,255,0) 62%);

    --err-bg:#2A1614;
    --err-bd:#5E2B26;
    --err-fg:#F0A8A0;
    --err-line:#C9564C;

    --check-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='11' viewBox='0 0 24 24' fill='none' stroke='%235AB0E0' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");

    /* На тёмном фоне мягкие тени не видны — делаем их плотнее */
    --sh-s:0 2px 10px rgba(0,0,0,.5);
    --sh-m:0 16px 40px -18px rgba(0,0,0,.75);
    --sh-l:0 34px 70px -30px rgba(0,0,0,.85);
  }

  /* Логотип синий на прозрачном фоне — на тёмном он тускнеет, осветляем */
  :root:not([data-theme="light"]) .brand img,
  :root:not([data-theme="light"]) .about__sign img{filter:brightness(1.55) saturate(.92)}

  /* Сканы дипломов — светлые листы бумаги, слегка приглушаем */
  :root:not([data-theme="light"]) .dip__img img,
  :root:not([data-theme="light"]) .arch-card img{filter:brightness(.9)}

  :root:not([data-theme="light"]) .dip:hover .dip__img img,
  :root:not([data-theme="light"]) .arch-card:hover img{filter:none}

  /* Подсветки в тёмных полосах на тёмном фоне усиливаем */
  :root:not([data-theme="light"]) .process::before{background:radial-gradient(circle at 50% 50%, rgba(0,111,175,.55), rgba(0,111,175,0) 66%)}

  :root:not([data-theme="light"]) .cta::before{background:radial-gradient(circle at 50% 50%, rgba(0,111,175,.6), rgba(0,111,175,0) 65%)}

  /* Иконка в переключателе: в тёмной теме показываем солнце */
  :root:not([data-theme="light"]) .theme-toggle .i-sun{display:block}

  :root:not([data-theme="light"]) .theme-toggle .i-moon{display:none}
}

/* --- 2. По кнопке в шапке --- */
:root[data-theme="dark"]{
    color-scheme:dark;

    --brand:#5AB0E0;          /* акцент для текста и иконок — светлее, чтобы читался */
    --brand-dk:#86C8EA;
    --brand-dp:#E6F1F8;       /* заголовки */
    --brand-solid:#0F7CBC;    /* заливка кнопок: белый текст на ней даёт контраст 4.5:1 */
    --brand-solid-h:#1690D6;
    --on-solid:#FFFFFF;

    --deep:#133648;           /* тёмные полосы — светлее фона, иначе полоса не читается */
    --deep-grad:linear-gradient(160deg,#13303F,#134A6B);

    --cream:#0B1922;          /* фон страницы: сине-чёрный, не чистый чёрный */
    --cream-2:#152833;
    --paper:#122530;          /* карточки */

    --ink:#DEE8EF;
    --body-text:#C6D4DE;
    --muted:#93A6B4;

    --tint:#16303F;
    --tint-2:#132936;

    --line:rgba(255,255,255,.15);
    --line-soft:rgba(255,255,255,.08);
    --btn-ghost-bd:rgba(255,255,255,.28);

    --header-bg:rgba(11,25,34,.86);
    --footer-bg:#071620;

    /* Портрет вырезан с белого фона и по кромке светлее середины.
       На тёмной подложке появился бы белый ореол, поэтому арка
       остаётся светлой — только приглушённой, чтобы не слепила. */
    --arch-bg:linear-gradient(168deg, #C3DCEA 0%, #A8CBE0 42%, #D2E7F2 100%);
    --arch-glow:radial-gradient(circle at 50% 40%, rgba(255,255,255,.45), rgba(255,255,255,0) 62%);

    --err-bg:#2A1614;
    --err-bd:#5E2B26;
    --err-fg:#F0A8A0;
    --err-line:#C9564C;

    --check-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='11' viewBox='0 0 24 24' fill='none' stroke='%235AB0E0' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");

    /* На тёмном фоне мягкие тени не видны — делаем их плотнее */
    --sh-s:0 2px 10px rgba(0,0,0,.5);
    --sh-m:0 16px 40px -18px rgba(0,0,0,.75);
    --sh-l:0 34px 70px -30px rgba(0,0,0,.85);
}

/* Логотип синий на прозрачном фоне — на тёмном он тускнеет, осветляем */
:root[data-theme="dark"] .brand img,
:root[data-theme="dark"] .about__sign img{filter:brightness(1.55) saturate(.92)}

/* Сканы дипломов — светлые листы бумаги, слегка приглушаем */
:root[data-theme="dark"] .dip__img img,
:root[data-theme="dark"] .arch-card img{filter:brightness(.9)}

:root[data-theme="dark"] .dip:hover .dip__img img,
:root[data-theme="dark"] .arch-card:hover img{filter:none}

/* Подсветки в тёмных полосах на тёмном фоне усиливаем */
:root[data-theme="dark"] .process::before{background:radial-gradient(circle at 50% 50%, rgba(0,111,175,.55), rgba(0,111,175,0) 66%)}

:root[data-theme="dark"] .cta::before{background:radial-gradient(circle at 50% 50%, rgba(0,111,175,.6), rgba(0,111,175,0) 65%)}

/* Иконка в переключателе: в тёмной теме показываем солнце */
:root[data-theme="dark"] .theme-toggle .i-sun{display:block}

:root[data-theme="dark"] .theme-toggle .i-moon{display:none}

/* --- Светлая тема, выбранная вручную при тёмной системе --- */
:root[data-theme="light"]{ color-scheme:light }