/* ============================================================
   CPARK — Палата профессиональных бухгалтеров РК
   Landing page, built from Figma node 1835:1328
   ============================================================ */

/* Manrope is self-hosted now — see fonts.css. The Google Fonts @import
   that stood here was a network dependency on every page load. */

/* ---------- tokens ---------- */
:root{
  --ink:        #1F2A3B;
  --ink-soft:   #7B8091;
  --bg-soft:    #F2F5F9;
  --border:     #E7EAF2;

  --teal:       #26B7A6;
  --red:        #F24262;
  --orange:     #F49C2A;
  --yellow:     #FFED00;

  --tint-pink:  #FFE4E8;
  --tint-cream: #FDF3C7;
  --tint-mint:  #CFFBF1;

  --r:      20px;   /* card radius   */
  --r-sm:   12px;
  --gap:    20px;   /* grid gutter   */
  --pad:    40px;   /* card padding  */
  --pad-lg: 80px;   /* широкие карточки: .wide / .attest / .course */
  --w:      1260px; /* content width */

  --font: 'Manrope', 'Nunito Sans', -apple-system, 'Segoe UI', Roboto, system-ui, sans-serif;
}

/* ---------- reset ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  margin:0;
  font-family:var(--font);
  font-size:16px;
  line-height:1.45;
  color:var(--ink);
  background:#fff;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
h2,h3,h4,p,ul{ margin:0; }
ul{ padding:0; list-style:none; }
button{ font:inherit; color:inherit; border:0; background:none; cursor:pointer; }

/* ---------- layout ---------- */
.container{
  width:100%;
  max-width:calc(var(--w) + 60px);
  margin-inline:auto;
  padding-inline:30px;
}
.container--wide{ max-width:1380px; }

.section        { padding-block:40px; }
.section--tight { padding-block:12px; }
/* Секция, из которой арт намеренно вылезает за край экрана (плашки .slab).
   Режем по краю вьюпорта — как в макете, где они обрезаны краем канваса.
   clip вместо hidden: не создаёт скролл-контейнер, поэтому якорь #about и
   position:sticky внутри продолжают работать. hidden — фолбэк для Safari <16. */
.section--bleed { overflow:hidden; overflow:clip; }
.section:first-of-type{ padding-top:44px; }

.grid      { display:grid; gap:var(--gap); }
.grid--2   { grid-template-columns:repeat(2,1fr); }
.grid--3   { grid-template-columns:repeat(3,1fr); }

.center{ display:flex; justify-content:center; margin-top:36px; }

.rowhead{
  display:flex; align-items:center; justify-content:space-between;
  gap:20px; margin-bottom:28px;
}

/* ---------- typography ---------- */
.h2{
  font-size:44px;
  font-weight:800;
  line-height:1.1;
  letter-spacing:-.01em;
  margin-bottom:28px;
}
.h2--center{ text-align:center; }
.h2--xl{ font-size:48px; }

/* ---------- atoms ---------- */
.badge{
  display:inline-block;
  padding:9px 18px;
  border-radius:999px;
  background:#fff;
  font-size:14px;
  font-weight:500;
}

/* ⚠ .btn есть и в engine.css (родной DLE): синий фон, белый текст, тень и
   свои padding/radius. Он подключается раньше нашего файла, поэтому всё,
   что мы не переопределим явно, протекает наружу. Гасим поимённо. */
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  min-height:52px;            /* замер по макету: тёмная 154×52, с обводкой 193×52 */
  padding:0 30px;
  border:0;
  border-radius:10px;
  background:none;
  text-shadow:none;
  box-shadow:none;
  font-size:15px; font-weight:500;
  transition:opacity .18s, background .18s, color .18s;
}
/* ⚠ Модификаторы пишем через .btn.btn--x, а не просто .btn--x.
   Причина: внутри статьи действует .dle-content a{color:var(--teal)} —
   это (0,1,1) и оно перебивает одноклассовый .btn--teal (0,1,0),
   из-за чего надпись на кнопке становилась бирюзовой на бирюзовом.
   .btn.btn--teal даёт (0,2,0) и выигрывает без !important. */
/* базовый цвет тоже поднимаем до двух классов (.btn.btn), иначе внутри
   статьи его перебьёт .dle-content a. Модификаторы идут ниже и при равной
   специфичности выигрывают по порядку. */
.btn.btn{ color:inherit; }
.btn.btn--dark   { background:var(--ink); color:#fff; }
/* фон повторяем и в :hover — иначе сработает .btn:hover из engine.css */
.btn.btn--dark:hover{ background:var(--ink); color:#fff; opacity:.88; }
.btn.btn--teal   { background:var(--teal); color:#fff; }
.btn.btn--teal:hover{ background:var(--teal); color:#fff; opacity:.88; }
.btn.btn--outline{ border:1.5px solid var(--ink); color:var(--ink); }
.btn.btn--outline:hover{ background:var(--ink); color:#fff; }

/* square arrow button */
.arrow-btn{
  position:relative; z-index:2;
  display:block; width:50px; height:50px;
  border:1.5px solid var(--ink);
  border-radius:10px;
  transition:background .18s;
}
.arrow-btn::after{
  content:''; position:absolute; inset:0; margin:auto;
  width:16px; height:16px;
  background:currentColor;
  -webkit-mask:var(--arrow) center/contain no-repeat;
          mask:var(--arrow) center/contain no-repeat;
}
:root{
  --arrow:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><line x1='4' y1='12' x2='19' y2='12'/><polyline points='13 6 19 12 13 18'/></svg>");
}
.arrow-btn:hover{ background:rgba(31,42,59,.07); }
.arrow-btn--light{ border-color:#fff; color:#fff; }
.arrow-btn--light:hover{ background:rgba(255,255,255,.18); }

/* circular carousel control */
.circ{
  width:52px; height:52px; border-radius:50%;
  background:#fff;
  display:grid; place-items:center;
  transition:box-shadow .18s;
}
.circ:hover{ box-shadow:0 3px 14px rgba(31,42,59,.14); }
.circ::after{
  content:''; width:13px; height:13px;
  background:var(--ink);
  -webkit-mask:var(--chev) center/contain no-repeat;
          mask:var(--chev) center/contain no-repeat;
}
:root{
  --chev:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'><polyline points='9 5 16 12 9 19'/></svg>");
}
[data-prev]::after{ transform:rotate(180deg); }

.more{
  display:inline-flex; align-items:center; gap:9px;
  position:relative; z-index:2;
  font-size:15px; font-weight:500;
}
.more::after{
  content:''; width:15px; height:15px;
  background:currentColor;
  -webkit-mask:var(--arrow) center/contain no-repeat;
          mask:var(--arrow) center/contain no-repeat;
}
.more--light{ color:#fff; }

/* decorative line glyphs */
.deco{
  position:absolute; z-index:2;
  font-size:26px; color:var(--ink);
  opacity:.85; pointer-events:none; user-select:none;
}
.deco--hash  { top:26%;  right:16%; font-size:30px; font-weight:700; }
.deco--star  { top:8%;   right:12%; font-size:34px; }
.deco--chev  { top:26%;  left:8%;   font-size:30px; }
.deco--lines { top:34%;  left:18%;  letter-spacing:-3px; transform:rotate(12deg); }
.deco--corner{ top:22%;  left:24%;  font-size:30px; }
.deco--waves { bottom:16%; left:44%; color:#fff; letter-spacing:-4px; transform:rotate(90deg); }
.deco--slashes{ top:26%; right:26%; color:#fff; letter-spacing:-3px; }
.deco--users { top:38%;  left:52%;  font-size:24px; }

/* ============================================================
   СЕРТИФИКАЦИЯ
   ============================================================ */
.cert{
  position:relative; overflow:hidden;
  min-height:560px;
  padding:40px var(--pad) 0;
  border-radius:var(--r);
  background:var(--bg-soft);
  text-align:center;
  display:flex; flex-direction:column; align-items:center;
}
.cert__title{
  margin-top:22px;
  font-size:28px; font-weight:800; line-height:1.22;
}
/* Карточка целиком — ссылка (в макете отдельной кнопки нет, кликается вся
   плашка). Именно <a>, а не прозрачный слой поверх: так работает фокус с
   клавиатуры, и ссылка одна, а не «карточка + невидимая ссылка». */
.cert{ color:inherit; text-decoration:none; }
.cert__art{ transition:transform .35s ease; }
.cert:hover .cert__art{ transform:scale(1.02); }
.cert:focus-visible{ outline:2px solid var(--teal); outline-offset:3px; }
/* Арт — один файл на карточку, включая деко-глифы. Картинка занимает
   всю карточку вместе с фоном, текст лежит поверх. */
.cert__art{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
}
.cert .badge,
.cert__title{ position:relative; z-index:1; }

/* ============================================================
   ШИРОКАЯ КАРТОЧКА (Главбух-интенсив / Аттестат аудитора)
   ============================================================ */
.wide{
  position:relative; overflow:hidden;
  display:flex;
  min-height:400px;
  border-radius:var(--r);
}
.wide--soft{ background:var(--bg-soft); }
.wide--mint{ background:var(--tint-mint); }

.wide__body{
  position:relative; z-index:1;
  width:50%;
  padding:var(--pad-lg);
  display:flex; flex-direction:column; align-items:flex-start;
}
.wide__title{
  margin-top:20px;
  font-size:34px; font-weight:800; line-height:1.15;
}
.wide__body .arrow-btn{ margin-top:auto; }

.wide__art{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
}

/* ============================================================
   АТТЕСТАЦИЯ — 2 карточки
   ============================================================ */
.attest{
  position:relative; overflow:hidden;
  min-height:400px;
  padding:var(--pad-lg);
  border-radius:var(--r);
  display:flex; flex-direction:column; align-items:flex-start;
}
.attest--pink { background:var(--tint-pink); }
.attest--cream{ background:var(--tint-cream); }
.attest__title{
  margin-top:20px;
  font-size:30px; font-weight:800;
}
.attest .arrow-btn{ margin-top:auto; }

.attest__art{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
}
.attest .badge,
.attest__title,
.attest .arrow-btn{ position:relative; z-index:1; }

/* ============================================================
   О КОМПАНИИ
   ============================================================ */
.about{
  display:grid; grid-template-columns:1fr 1fr;
  gap:60px; align-items:center;
  padding-block:40px;
}
.about__text p{ max-width:470px; color:var(--ink); }
.about__lead{ margin-top:26px !important; }
.principles{ margin-top:6px; font-size:19px; font-weight:800; }
.principles__item--orange{ color:var(--orange); }
.principles__item--red   { color:var(--red); }
.principles__item--teal  { color:var(--teal); }

.about__stack{
  position:relative; height:330px;
  /* .slab уезжает на 30 % вправо; обрезает .section--bleed на предке,
     а не этот блок — иначе плашки оборвались бы по колонке сетки,
     а не по краю экрана. */
}
.slab{
  position:absolute; left:0; right:-30%;
  height:104px;
  border-radius:34px 20px 20px 34px;
  border:1.5px solid var(--ink);
  transform:skewX(-13deg);
}
.slab--orange{ top:0;    background:var(--orange); }
.slab--red   { top:118px;background:var(--red); }
.slab--teal  { top:236px;background:var(--teal); }

/* ============================================================
   ПАНЕЛЬ + КАРУСЕЛИ
   ============================================================ */
.panel{
  border-radius:21px;
  background:var(--bg-soft);
  padding:44px 0 40px;
  overflow:hidden;
}
.panel .h2{ margin-bottom:34px; }

.rail{
  display:flex; gap:22px;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  padding-inline:36px;
  padding-bottom:6px;
  scrollbar-width:none;
}
.rail::-webkit-scrollbar{ display:none; }
.rail > *{ scroll-snap-align:start; flex:0 0 406px; }

.panel__foot{
  display:flex; align-items:center; justify-content:space-between;
  padding:32px 36px 0;
}
.panel__foot .btn{ margin-inline:auto; }

/* карточка семинара */
.scard{
  min-height:220px;
  padding:26px;
  border-radius:19px;
  background:#fff;
  border:1.5px solid var(--ink);
  display:flex; flex-direction:column;
}
.scard__meta{
  display:flex; justify-content:space-between; gap:14px;
  font-size:14px; color:var(--ink);
}
.scard__title{
  margin-top:18px;
  font-size:21px; font-weight:800; line-height:1.28;
}
.date b { color:var(--red); font-weight:800; }
.date--teal b{ color:var(--teal); }
.hours b{ color:var(--teal); font-weight:800; }
.time   { color:var(--teal); font-weight:800; font-size:15px; }

/* карточка вебинара */
.wcard{
  min-height:252px;
  padding:24px;
  border-radius:19px;
  background:#fff;
  border:1.5px solid transparent;
  display:flex; flex-direction:column;
}
.wcard--teal{ border-color:var(--teal); }
.wcard--red { border-color:var(--red); }
.pills{ display:flex; gap:10px; flex-wrap:wrap; }
.pill{
  padding:7px 15px; border-radius:999px;
  font-size:13px; font-weight:500; color:#fff;
}
.pill--teal{ background:var(--teal); }
.pill--red { background:var(--red); }
.wcard__title{
  margin-top:20px;
  font-size:19px; font-weight:800; line-height:1.3;
}
.wcard__foot{
  margin-top:auto; padding-top:18px;
  display:flex; justify-content:space-between; gap:14px;
  font-size:14px;
}

/* ============================================================
   КУРСЫ
   ============================================================ */
.course{
  position:relative; overflow:hidden;
  min-height:400px;
  padding:var(--pad-lg);
  border-radius:var(--r);
  color:#fff;
  display:flex; flex-direction:column; align-items:flex-start;
}
.course--teal{ background:var(--teal); }
.course--red { background:var(--red); }
.course__title{
  font-size:30px; font-weight:800; line-height:1.18;
  max-width:64%;
}
.course .arrow-btn{ margin-top:auto; }
.course__art{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
}
.course__title,
.course .arrow-btn{ position:relative; z-index:1; }

/* ============================================================
   ПАРТНЕР TAX24
   ============================================================ */
.partner{
  position:relative; overflow:hidden;
  display:flex;
  min-height:460px;
  max-width:1120px; margin-inline:auto;
  border-radius:var(--r);
  background:var(--bg-soft);
}
/* Замеры по макету (карточка 1120×460): контент от левого края 120,
   логотип 269×60, абзац 406 в ширину, кнопка 193×52,
   зазоры 26 и 25, по вертикали блок отцентрован (100 сверху и снизу). */
.partner__body{
  position:relative; z-index:1;
  width:53.57%;
  padding:56px var(--pad) 56px 120px;
  display:flex; flex-direction:column; align-items:flex-start;
  justify-content:center; gap:26px;
}
.partner__logo{ width:270px; }
.partner__body p{ max-width:410px; }
/* PNG, а не JPEG: левый край картинки стыкуется с CSS-фоном карточки,
   и джипеговский сдвиг цвета дал бы заметный шов. */
.partner__art{
  position:absolute; right:0; top:0;
  width:46.43%; height:100%;
  object-fit:cover;
}

/* ============================================================
   ТАБЫ + БЕНТО
   ============================================================ */
.tabs{ margin-top:6px; }
.tabs > input{ position:absolute; opacity:0; pointer-events:none; }
/* Переключатель «физ./юр. лица». Тёмная плашка не перекрашивается,
   а едет: это ::before, который сдвигается на 100 % своей ширины.
   Сетка 1fr 1fr нужна, чтобы обе половины были строго равны — иначе
   сдвиг на 100 % не совпал бы со второй меткой (надписи разной длины). */
.tabs__switch{
  position:relative;
  width:max-content; margin:0 auto 34px;
  display:grid; grid-template-columns:1fr 1fr;
  border-radius:11px;
  background:#fff;
  box-shadow:0 0 0 1px var(--border);
  overflow:hidden;
}
.tabs__switch::before{
  content:'';
  position:absolute; z-index:0;
  top:0; bottom:0; left:0;
  width:50%;
  border-radius:11px;
  background:var(--ink);
  transition:transform .34s cubic-bezier(.4,0,.2,1);
}
.tabs__switch label{
  position:relative; z-index:1;
  padding:19px 32px;
  text-align:center; white-space:nowrap;
  font-size:15px; font-weight:500;
  cursor:pointer;
  transition:color .22s ease;
}
#aud-ur:checked ~ .tabs__switch::before{ transform:translateX(100%); }
#aud-fiz:checked ~ .tabs__switch label[for="aud-fiz"],
#aud-ur:checked  ~ .tabs__switch label[for="aud-ur"]{ color:#fff; }

@media (prefers-reduced-motion:reduce){
  .tabs__switch::before{ transition:none; }
}
/* Всё, что зависит от переключателя «физ./юр. лица», помечено .only-fiz
   или .only-ur, лишнее скрывается. Так работают и подпись со ссылкой в
   плитке «Членство», и подмена нижнего ряда бенто (две плитки -> одна).
   Радиокнопки — соседи .bento, поэтому работает «~». */
#aud-fiz:checked ~ .bento .only-ur,
#aud-ur:checked  ~ .bento .only-fiz{ display:none; }

/* Замеры по макету: блок делится 50/50 — левая колонка 620 («Членство»),
   правая 620. Внутри правой нижний ряд — две плитки по 300.
   Поэтому сетка на ЧЕТЫРЕ колонки по 300: 300+20+300 = 620 в каждой
   половине. На трёх колонках «Членство» выходило 407 вместо 620. */
.bento{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  grid-template-rows:214px 214px;
  gap:var(--gap);
}
.tile{
  position:relative; overflow:hidden;
  padding:var(--pad);
  border-radius:var(--r);
  display:flex; flex-direction:column; align-items:flex-start;
}
.tile--tall  { grid-column:span 2; grid-row:span 2; }   /* левая половина, 620×448 */
.tile--orange{ background:var(--orange); color:#fff; }
.tile--soft  { background:var(--bg-soft); grid-column:span 2; }  /* правая половина, верхний ряд */
.tile--pink  { background:var(--tint-pink); }
.tile--mint  { background:var(--tint-mint); }
.tile--teal  { background:var(--teal); color:#fff; }
.tile--wide  { grid-column:span 2; }   /* вместо двух плиток по 300 */
.tile--wide .tile__art{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover; object-position:right center;
}
.tile--wide .tile__title,
.tile--wide .more{ position:relative; z-index:2; }
.tile__title{
  font-size:27px; font-weight:800; line-height:1.2;
}
.tile__title--red { color:var(--red); }
.tile__title--teal{ color:var(--teal); }
.tile__hint{
  margin-top:12px;
  font-size:15px; line-height:1.35;
  opacity:.85;
}
.tile .more{ margin-top:auto; }
.tile--tall .more{ margin-top:14px; }
.tile__art{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
}
/* арт плитки лежит на inset:0, поэтому весь текст поднимаем над ним */
.tile--tall .tile__title,
.tile--tall .tile__hint,
.tile--tall .more{ position:relative; z-index:2; }

/* ============================================================
   FOOTER
   ============================================================ */
.footer{
  margin-top:60px;
  padding-block:64px 80px;
  background:var(--bg-soft);
}
.footer__inner{
  display:grid;
  grid-template-columns:1.5fr 1fr 1fr 1.2fr;
  gap:40px;
}
.footer__brand img{ width:320px; }
.footer__col{ display:flex; flex-direction:column; gap:18px; font-size:15px; }
.footer__col a:hover{ color:var(--teal); }
.footer__label{ font-size:15px; color:var(--ink-soft); margin-bottom:14px; }
.footer__label--soc{ margin-top:34px; }
.socials{ display:flex; gap:14px; }
.socials a{
  width:52px; height:52px; border-radius:50%;
  background:var(--ink); color:#fff;
  display:grid; place-items:center;
  transition:opacity .18s;
}
.socials a:hover{ opacity:.85; }
.socials svg{ width:24px; height:24px; }

/* ============================================================
   HEADER
   ============================================================ */
.header{
  position:sticky; top:0; z-index:50;
  background:#fff;
  border-bottom:1px solid var(--border);
}
.header__inner{
  display:flex; align-items:center; justify-content:space-between;
  min-height:80px; gap:24px;
}
.header__logo img{ width:275px; }
.nav{ display:flex; gap:44px; font-size:15px; }
.nav a{ transition:color .18s; }
.nav a:hover{ color:var(--teal); }

.burger{ display:none; width:30px; height:20px; flex-direction:column; justify-content:space-between; }
.burger span{ display:block; height:2px; background:var(--ink); border-radius:2px; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1180px){
  .h2{ font-size:38px; }
  .h2--xl{ font-size:40px; }
  .footer__inner{ grid-template-columns:1fr 1fr; }
  .footer__brand{ grid-column:1 / -1; }
}

@media (max-width:960px){
  :root{ --pad:32px; }
  .nav{ display:none; }
  .burger{ display:flex; }
  body.nav-open .nav{
    display:flex; position:absolute; inset:80px 0 auto;
    flex-direction:column; gap:0;
    background:#fff; padding:10px 30px 24px;
    border-bottom:1px solid var(--border);
  }
  body.nav-open .nav a{ padding:14px 0; }

  .grid--3{ grid-template-columns:1fr; }
  .cert{ min-height:520px; }
  .about{ grid-template-columns:1fr; gap:36px; }
  .about__stack{ height:280px; }
  .slab{ right:0; }

  /* Арт этих карточек — единая картинка под широкую карточку.
     В узкую колонку она не кадрируется осмысленно, поэтому прячем;
     под ней остаётся тот же плоский фон, что и в дизайне. */
  .wide{ min-height:0; }
  .wide__body,
  .partner__body{ width:100%; }
  .partner__body{ padding:40px var(--pad); }
  .wide__body,
  .attest,
  .course{ padding:var(--pad); }
  .wide__art,
  .partner__art,
  .attest__art,
  .course__art,
  .tile__art{ display:none; }

  .bento{ grid-template-columns:1fr 1fr; grid-template-rows:auto; }
  .bento{ grid-template-columns:1fr 1fr; grid-template-rows:auto; }
  .tile--tall{ grid-row:auto; grid-column:span 2; min-height:400px; }
  .tile--soft{ grid-column:span 2; min-height:180px; }
  .tile--pink,.tile--mint{ grid-column:span 1; min-height:180px; }
  .tile--wide{ grid-column:span 2; min-height:214px; }

  .rail{ padding-inline:24px; }
  .rail > *{ flex-basis:340px; }
  .panel__foot{ padding-inline:24px; }
}

@media (max-width:720px){
  .container{ padding-inline:20px; }
  .h2{ font-size:30px; }
  .h2--xl{ font-size:32px; }
  .grid--2{ grid-template-columns:1fr; }
  .course__title{ max-width:100%; }
  .tabs__switch label{ padding:15px 20px; font-size:14px; }
  .rail > *{ flex-basis:280px; }
  .panel__foot{ flex-wrap:wrap; gap:16px; }
  .footer__inner{ grid-template-columns:1fr; }
  .footer__brand img{ width:260px; }
}

@media (max-width:520px){
  .bento{ grid-template-columns:1fr; }
  .tile--tall,.tile--soft,.tile--wide{ grid-column:span 1; }
}

/* ============================================================
   DLE integration
   Styles for engine-generated output: {speedbar}, {info},
   {content}, page titles, pagination, forms.
   ============================================================ */

/* active state on the header nav ([available=...] in main.tpl) */
.nav a.is-active{ color:var(--teal); font-weight:600; }

/* breadcrumbs — speedbar.tpl
   В дизайне ссылки и разделители серые, а текущая страница тёмная.
   Движок отдаёт текущую страницу простым текстом, без <a>, поэтому
   цвет самого блока = --ink, а серый висит на ссылках. */
.speedbar{
  margin-bottom:22px;
  font-size:14px;
  color:var(--ink);
}
.speedbar a{ color:var(--ink-soft); transition:color .18s; }
.speedbar a:hover{ color:var(--teal); }

/* page title block — [page-title] */
.page-head{ margin-bottom:30px; }
.page-head .h2{ margin-bottom:12px; }

/* ── main content area ── */
.dle-content{ font-size:16px; line-height:1.6; }
.dle-content h1,
.dle-content h2,
.dle-content h3,
.dle-content h4{
  font-weight:800; line-height:1.2;
  margin:32px 0 14px;
}
.dle-content h1{ font-size:38px; }
.dle-content h2{ font-size:30px; }
.dle-content h3{ font-size:24px; }
.dle-content h4{ font-size:19px; }
.dle-content p{ margin:0 0 16px; }
.dle-content a{ color:var(--teal); }
.dle-content a:hover{ text-decoration:underline; }
.dle-content img{ max-width:100%; height:auto; border-radius:var(--r-sm); }
.dle-content ul,
.dle-content ol{ margin:0 0 16px; padding-left:22px; }
.dle-content ul{ list-style:disc; }
.dle-content ol{ list-style:decimal; }
.dle-content li{ margin-bottom:7px; }
.dle-content blockquote{
  margin:20px 0; padding:18px 24px;
  background:var(--bg-soft);
  border-left:3px solid var(--teal);
  border-radius:0 var(--r-sm) var(--r-sm) 0;
}
.dle-content hr{
  border:0; border-top:1px solid var(--border);
  margin:30px 0;
}
.dle-content table{
  width:100%; border-collapse:collapse; margin:0 0 20px;
  font-size:15px;
}
.dle-content th,
.dle-content td{
  padding:12px 14px;
  border:1px solid var(--border);
  text-align:left;
}
.dle-content th{ background:var(--bg-soft); font-weight:700; }

/* ── DLE service blocks ({info}, errors, notices) ── */
.dle-content .berrors,
.berrors,
#dle-info,
.dle-info{
  padding:18px 22px;
  margin-bottom:22px;
  border-radius:var(--r-sm);
  background:var(--tint-pink);
  color:var(--ink);
  font-size:15px;
}

/* ── pagination — {navigation} ── */
.pagi-nav,
.basenav,
.navigation{
  display:flex; flex-wrap:wrap; gap:8px;
  justify-content:center;
  margin:34px 0 0;
}
.navigation a,
.navigation span,
.pagi-nav a,
.pagi-nav span{
  min-width:44px; height:44px;
  padding:0 12px;
  display:inline-flex; align-items:center; justify-content:center;
  border-radius:10px;
  background:var(--bg-soft);
  font-size:15px; font-weight:600;
  transition:background .18s,color .18s;
}
.navigation a:hover,
.pagi-nav a:hover{ background:var(--border); }
.navigation span,
.pagi-nav span{ background:var(--ink); color:#fff; }

/* ── forms (feedback, search, login) ── */
.dle-content input[type=text],
.dle-content input[type=email],
.dle-content input[type=password],
.dle-content input[type=search],
.dle-content select,
.dle-content textarea{
  width:100%;
  padding:14px 16px;
  margin-bottom:14px;
  border:1.5px solid var(--border);
  border-radius:10px;
  font:inherit; font-size:15px;
  color:var(--ink);
  background:#fff;
  transition:border-color .18s;
}
.dle-content input:focus,
.dle-content select:focus,
.dle-content textarea:focus{
  outline:none; border-color:var(--teal);
}
.dle-content textarea{ min-height:150px; resize:vertical; }
.dle-content button,
.dle-content input[type=submit],
.dle-content .bbcodes{
  display:inline-flex; align-items:center; justify-content:center;
  padding:15px 30px;
  border-radius:10px;
  background:var(--ink); color:#fff;
  font:inherit; font-size:15px; font-weight:500;
  cursor:pointer;
  transition:opacity .18s;
}
.dle-content button:hover,
.dle-content input[type=submit]:hover,
.dle-content .bbcodes:hover{ opacity:.88; }

/* ============================================================
   Новости — карточка (shortstory.tpl) и карусель
   ============================================================ */

.news-carousel{ position:relative; }

.rail--news{ padding-inline:0; }
.rail--news > *{ flex:0 0 248px; }

.panel__foot--news{ padding:34px 0 0; }

/* ── карточка ── */
.ncard{
  position:relative;
  border-radius:var(--r);
  background:var(--bg-soft);
  overflow:hidden;
  display:flex; flex-direction:column;
}
.ncard--fixed{ box-shadow:inset 0 0 0 2px var(--teal); }

/* Обложка: доп. поле «image» (тип «изображение»).
   Поле не заполнено — остаётся серая заглушка. */
.ncard__cover{
  display:block;
  height:150px;
  overflow:hidden;
  background:var(--border);
  border-radius:var(--r);
}
.ncard__cover img{
  display:block;
  width:100%; height:150px;
  object-fit:cover;
  border-radius:var(--r);
  transition:transform .35s ease;
}
.ncard:hover .ncard__cover img{ transform:scale(1.04); }

.ncard__body{ padding:18px 20px 24px; }
.ncard__meta{
  font-size:13px; color:var(--ink);
}
.ncard__title{
  margin-top:10px;
  font-size:15px; font-weight:800; line-height:1.35;
}
.ncard__title a{ transition:color .18s; }
.ncard__title a:hover{ color:var(--teal); }

@media (max-width:720px){
  .rail--news > *{ flex-basis:220px; }
  .panel__foot--news{ flex-wrap:wrap; gap:16px; }
}

/* ============================================================
   СТРАНИЦА НОВОСТИ — fullstory.tpl
   По макету: обложка 1260×400 во всю ширину, дальше колонка
   текста шириной 850, отцентрованная. Живёт внутри .dle-content,
   поэтому конкурирующие селекторы пишем с этим префиксом.
   ============================================================ */
.fullstory__cover{ margin:0 0 34px; }
.dle-content .fullstory__cover img{
  display:block;
  width:100%; height:400px;
  object-fit:cover;
  border-radius:var(--r);
}
.fullstory__inner{ max-width:850px; margin:0 auto; }

.fullstory__back{
  display:inline-flex; align-items:center; gap:12px;
  font-size:16px;
}
.fullstory__back::before{
  content:''; width:17px; height:17px;
  background:currentColor;
  -webkit-mask:var(--arrow) center/contain no-repeat;
          mask:var(--arrow) center/contain no-repeat;
  transform:rotate(180deg);
}
.dle-content .fullstory__back{ color:var(--ink); }
.dle-content .fullstory__back:hover{ color:var(--teal); text-decoration:none; }

.dle-content .fullstory__title{
  margin:30px 0 14px;
  font-size:40px; font-weight:800; line-height:1.15; letter-spacing:-.01em;
}
.fullstory__date{ margin-bottom:34px; font-size:16px; color:var(--ink-soft); }

.fullstory__tags{ margin-top:34px; font-size:14px; color:var(--ink-soft); }
.fullstory__tags-label{ margin-right:4px; }
.fullstory__tags a{ color:var(--teal); }

/* поделиться */
.share{ margin-top:50px; text-align:center; }
.share__label{ font-size:16px; color:var(--ink-soft); }
.share__row{ display:flex; justify-content:center; gap:14px; margin-top:16px; }
.dle-content .share__btn{
  width:50px; height:50px; border-radius:50%;
  background:var(--bg-soft); color:var(--ink);
  display:grid; place-items:center;
  transition:background .18s,color .18s;
}
.dle-content .share__btn:hover{ background:var(--ink); color:#fff; text-decoration:none; }
.share__btn svg{ width:20px; height:20px; }
.dle-content .share__btn.is-copied{ background:var(--teal); color:#fff; }

/* пред./след. новость */
.fnav{
  display:flex; justify-content:space-between; gap:20px;
  margin-top:44px;
}
.fnav:empty{ display:none; }
.dle-content .fnav__link{
  display:inline-flex; align-items:center; gap:12px;
  font-size:16px; color:var(--ink);
}
.dle-content .fnav__link:hover{ color:var(--teal); text-decoration:none; }
.fnav__link::before,
.fnav__link::after{
  content:''; width:17px; height:17px;
  background:currentColor;
  -webkit-mask:var(--arrow) center/contain no-repeat;
          mask:var(--arrow) center/contain no-repeat;
}
.fnav__link--prev::after{ display:none; }
.fnav__link--prev::before{ transform:rotate(180deg); }
.fnav__link--next::before{ display:none; }
/* если предыдущей новости нет — следующая прижимается вправо */
.fnav__link--next:only-child{ margin-left:auto; }

/* подписка */
.subscribe{
  position:relative; overflow:hidden;
  max-width:852px; margin:70px auto 0;
  min-height:340px;
  border-radius:var(--r);
  background:var(--bg-soft);
  display:flex; align-items:center;
}
.subscribe__art{
  position:absolute; right:0; top:0;
  width:50%; height:100%;
  object-fit:cover; object-position:left center;
}
.subscribe__body{
  position:relative; z-index:1;
  width:100%;
  padding:40px 52% 40px 9.4%;
}
.dle-content .subscribe__title{
  margin:0 0 12px;
  font-size:34px; font-weight:800; line-height:1.18;
}
.subscribe__lead{ margin-bottom:30px; font-size:17px; }

@media (max-width:720px){
  .dle-content .fullstory__cover img{ height:220px; }
  .dle-content .fullstory__title{ font-size:26px; }
  .subscribe__art{ display:none; }
  .subscribe__body{ padding:34px 30px; }
  .dle-content .subscribe__title{ font-size:26px; }
  .fnav{ flex-direction:column; gap:14px; }
}

/* ============================================================
   ВСЕ СЕРТИФИКАЦИИ — categories/all-certifications.tpl

   Геометрия снята не с PNG, а из SVG-экспорта: карточка 1260×400,
   промежуток 20, радиус 20. Арт — одна картинка на карточку, собранная
   из того же SVG (см. CLAUDE.md), поэтому проценты позиционирования
   больше не нужны: картинка кроет карточку целиком.
   ============================================================ */
.clist{ display:flex; flex-direction:column; gap:var(--gap); }

.ccard{
  position:relative; overflow:hidden;
  min-height:400px;
  border-radius:var(--r);
  background:var(--bg-soft);
  display:flex; align-items:center;
}
.ccard--pink { background:var(--tint-pink); }
.ccard--cream{ background:var(--tint-cream); }
.ccard--mint { background:var(--tint-mint); }

/* Текстовая колонка. В дизайне текст начинается на 670 px при арте
   слева и на 80 px при арте справа — от левого края карточки это
   46.03 % и 6.35 %. */
.ccard__body{
  position:relative; z-index:1;
  width:100%;
  padding-block:40px;
  display:flex; flex-direction:column; align-items:flex-start;
}
.ccard--art-left  .ccard__body{ padding-left:46.03%; padding-right:6.35%; }
.ccard--art-right .ccard__body{ padding-left:6.35%;  padding-right:46.03%; }

.ccard__body .badge{ padding:6px 18px; }      /* 33 px, а не 38 как на главной */
.ccard__title{
  margin:26px 0 34px;
  font-size:30px; font-weight:800; line-height:1.17;
}

/* Арт — один файл на карточку (images/certifications/), фигуры,
   тонкие линии и деко-глифы уже впечатаны. Картинка кроет карточку
   целиком вместе с фоном, текст лежит поверх. */
.ccard__art{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
}

/* Арт нарисован под карточку 1260×400 и в узкую колонку не кадрируется —
   прячем, под ним остаётся тот же плоский фон, что и в макете. */
@media (max-width:900px){
  .ccard{ min-height:0; }
  .ccard__art{ display:none; }
  .ccard--art-left  .ccard__body,
  .ccard--art-right .ccard__body{ padding:34px 30px; }
  .ccard__title{ font-size:24px; margin:20px 0 26px; }
}

/* ============================================================
   СЕРТИФИКАЦИЯ «ПРОФ. БУХГАЛТЕР РК» — categories/pro-buh.tpl
   Замеры из design/certification-pro-buh/ (SVG, не PNG):
   шапка 1260×480, показатели 406.7×128, «аудитория» 1260×420,
   дисциплины 408×400 (плашка с ценой 344×94, radius 10),
   иконки 64×64 radius 16, карточки партнёров 408×172.
   ============================================================ */

/* ── шапка страницы ── */
.phero{
  position:relative; overflow:hidden;
  min-height:480px;
  border-radius:var(--r);
  background:var(--bg-soft);
  display:flex; align-items:center;
}
.phero__art{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
}
.phero__body{
  position:relative; z-index:1;
  width:100%;
  padding:40px 6.35% 40px 46.03%;   /* текст с 580 px, как в макете */
  display:flex; flex-direction:column; align-items:flex-start;
}
.phero__title{
  margin:26px 0 34px;
  font-size:42px; font-weight:800; line-height:1.16; letter-spacing:-.01em;
}

/* ── три показателя ── */
.pstats{
  margin-top:var(--gap);
  display:grid; grid-template-columns:repeat(3,1fr); gap:var(--gap);
}
.pstat{
  min-height:128px;
  padding:26px 30px;
  border-radius:var(--r);
  background:var(--bg-soft);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px;
  text-align:center;
}
.pstat b   { font-size:23px; font-weight:800; }
.pstat span{ font-size:15px; color:var(--ink-soft); }

/* ── полоса вкладок ── */
.ptabs{ margin-top:44px; }
.ptabs > input{ position:absolute; opacity:0; pointer-events:none; }
.ptabs__bar{ border-bottom:1px solid var(--border); }
.ptabs__bar-inner{ display:flex; gap:34px; }
.ptabs__bar label{
  position:relative;
  padding:14px 0 18px;
  font-size:16px; color:var(--ink-soft);
  cursor:pointer; white-space:nowrap;
  transition:color .18s;
}
.ptabs__bar label:hover{ color:var(--ink); }
.ptabs__bar label::after{
  content:''; position:absolute; left:0; right:0; bottom:-1px;
  height:4px; border-radius:4px 4px 0 0;
  background:transparent;
  transition:background .18s;
}
#pb-about:checked ~ .ptabs__bar label[for="pb-about"],
#pb-req:checked   ~ .ptabs__bar label[for="pb-req"],
#pb-exams:checked ~ .ptabs__bar label[for="pb-exams"],
#pb-faq:checked   ~ .ptabs__bar label[for="pb-faq"]{ color:var(--teal); }
#pb-about:checked ~ .ptabs__bar label[for="pb-about"]::after,
#pb-req:checked   ~ .ptabs__bar label[for="pb-req"]::after,
#pb-exams:checked ~ .ptabs__bar label[for="pb-exams"]::after,
#pb-faq:checked   ~ .ptabs__bar label[for="pb-faq"]::after{ background:var(--teal); }

/* ── панели ── */
.ptab{ display:none; padding-block:60px 40px; }
#pb-about:checked ~ .ptab--about,
#pb-req:checked   ~ .ptab--req,
#pb-exams:checked ~ .ptab--exams,
#pb-faq:checked   ~ .ptab--faq{ display:block; }

.ptab__lead{ max-width:960px; margin-inline:auto; }
/* надзаголовок уровня у CPA */
.ptab__over{
  text-align:center; margin-bottom:14px;
  font-size:30px; font-weight:800; color:var(--ink-soft);
}
.ptab__h2{ margin-top:80px; }

/* ── текстовый блок ── */
.prose{ max-width:860px; margin:0 auto; font-size:16px; line-height:1.5; }
.prose p{ margin:0 0 20px; }
.prose ul,
.prose ol{ margin:0 0 20px; padding-left:22px; }
.prose ul{ list-style:disc; }
.prose ol{ list-style:decimal; }
.prose li{ margin-bottom:6px; }
.prose--center{ text-align:center; max-width:840px; }
.prose a{ color:var(--teal); }
.prose a:hover{ text-decoration:underline; }

/* ── преимущества ── */
/* Сетка на 6 колонок: в макете центры иконок первого ряда — 340/720/1100,
   второго — 530/910, то есть ровно по полуколонке. На трёх колонках вторая
   строка не встаёт: явные grid-column пересекались бы, и элемент уезжал
   на третий ряд. */
.feats{
  display:grid; grid-template-columns:repeat(6,1fr); gap:56px 0;
  justify-items:center; text-align:center;
  max-width:1140px; margin:0 auto;
}
.feats > *{ grid-column:span 2; }
.feats > :nth-child(4){ grid-column:2 / span 2; }
.feats > :nth-child(5){ grid-column:4 / span 2; }
.feat{ max-width:300px; }
.feat__ico{ width:64px; height:64px; margin:0 auto 22px; }
.feat__title{ font-size:19px; font-weight:800; margin-bottom:10px; }
.feat p{ font-size:15px; line-height:1.35; }

/* ── целевая аудитория ── */
.audience{
  position:relative; overflow:hidden;
  margin-top:80px;
  min-height:420px;
  border-radius:var(--r);
  background:var(--bg-soft);
  display:flex; align-items:center;
}
.audience__art{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
}
.audience__body{
  position:relative; z-index:1;
  width:100%;
  padding:50px 46% 50px 7.14%;
}
.audience__title{ font-size:36px; font-weight:800; margin-bottom:20px; }
.audience__list li{
  position:relative;
  padding-left:22px; margin-bottom:10px;
  font-size:17px;
}
.audience--tall{ min-height:480px; }
.audience__list--sm li{ font-size:15px; line-height:1.4; }
.audience__list li::before{
  content:''; position:absolute; left:4px; top:11px;
  width:5px; height:5px; border-radius:50%;
  background:var(--ink);
}

/* ── дисциплины ── */
.disc{
  margin-top:80px;
  display:grid; grid-template-columns:repeat(3,1fr); gap:var(--gap);
}
/* у ДипИФР карточек четыре и сетка в две колонки */
.disc--2{ grid-template-columns:repeat(2,1fr); }
/* у CPA в последнем ряду остаётся 1-2 карточки — в макете они по центру,
   поэтому не grid (он прижал бы влево), а flex с переносом */
.disc--center{
  display:flex; flex-wrap:wrap; justify-content:center;
}
.disc--center > .disc__card{
  width:calc((100% - 2 * var(--gap)) / 3);
  min-width:300px;
}
.disc__card{
  min-height:400px;
  padding:32px;
  border-radius:var(--r);
  background:var(--bg-soft);
  display:flex; flex-direction:column;
}
.disc__hours{ font-size:15px; color:var(--ink); }
.disc__hours b{ color:var(--teal); font-weight:800; }
.disc__title{
  margin-top:18px;
  font-size:18px; font-weight:800; line-height:1.3;
}
.disc__price{
  margin-top:auto;
  padding:16px 20px;
  border-radius:10px;
  background:#fff;
  font-size:14px;
}
.disc__price > div{
  display:flex; align-items:baseline; justify-content:space-between; gap:14px;
}
.disc__price > div + div{ margin-top:8px; }
.disc__price dt{ color:var(--ink); }
.disc__price dd{ margin:0; font-weight:800; white-space:nowrap; }
.disc__foot{ display:flex; gap:10px; margin-top:20px; }
.disc__foot .btn{ min-height:52px; padding:0 22px; font-size:15px; }

/* ── партнёры ── */
.plogos{ display:flex; justify-content:center; gap:var(--gap); }
.plogo{
  width:408px; min-height:172px;
  border-radius:var(--r);
  background:var(--bg-soft);
  display:grid; place-items:center;
}
.plogo img{ max-width:60%; height:auto; }

/* ── «заголовок слева / текст справа» (Требования, Экзамены) ── */
.split{
  display:grid; grid-template-columns:47% 1fr; gap:50px;
  padding-block:56px;
}
.split + .split{ border-top:1px solid var(--border); }
.split__title{
  font-size:26px; font-weight:800; line-height:1.25;
}
.split__sub{
  display:block; margin-top:6px;
  font-size:19px; font-weight:500; color:var(--ink-soft);
}
.split__body{ font-size:16px; line-height:1.5; }
.split__body p{ margin:0 0 18px; }
.split__body ol,
.split__body ul{ margin:0 0 18px; padding-left:22px; }
.split__body ol{ list-style:decimal; }
.split__body ul{ list-style:disc; }
.split__body li{ margin-bottom:8px; }

/* ── аккордеон вопросов ── */
.faq{ display:flex; flex-direction:column; gap:16px; }
.faq__item{
  border:1px solid var(--border);
  border-radius:14px;
  background:#fff;
}
.faq__item summary{
  list-style:none; cursor:pointer;
  padding:22px 60px 22px 22px;
  position:relative;
  font-size:17px; font-weight:800;
}
.faq__item summary::-webkit-details-marker{ display:none; }
.faq__item summary::after{
  content:''; position:absolute; right:24px; top:50%;
  width:13px; height:13px; margin-top:-8px;
  background:var(--ink);
  -webkit-mask:var(--chev) center/contain no-repeat;
          mask:var(--chev) center/contain no-repeat;
  transform:rotate(90deg);
  transition:transform .2s;
}
.faq__item[open] summary::after{ transform:rotate(-90deg); }
.faq__answer{ padding:0 22px 22px; font-size:16px; line-height:1.5; }

@media (max-width:980px){
  .phero__body,
  .phero--art-right .phero__body{ padding:36px 30px; }
  .phero__art{ display:none; }
  .pstats--2{ grid-template-columns:1fr; }
  .program{ padding:34px 30px 40px; }
  .program .split{ grid-template-columns:1fr; gap:16px; }
  .panelcard{ padding:34px 30px 40px; }
  .lect{ grid-template-columns:1fr; gap:26px; }
  .lect__person{ flex-direction:column; gap:16px; }
  .kits{ grid-template-columns:1fr; }
  .kit__card{ padding:34px 30px 40px; }
  .kit__price{ padding:20px 30px; font-size:21px; }
  .kit__title{ font-size:26px; }
  .kitfoot{ grid-template-columns:1fr; }
  .upgrade{ padding:34px 30px; }
  .upgrade__title{ font-size:26px; }
  .phero__title{ font-size:30px; }
  .pstats{ grid-template-columns:1fr; }
  .feats{ grid-template-columns:repeat(2,1fr); gap:40px 20px; }
  .feats > *,
  .feats > :nth-child(4),
  .feats > :nth-child(5){ grid-column:auto; }
  .audience__art{ display:none; }
  .audience__body{ padding:36px 30px; }
  .audience{ min-height:0; }
  .disc,
  .disc--2{ grid-template-columns:1fr 1fr; }
  .disc--center > .disc__card{ width:calc((100% - var(--gap)) / 2); }
  .ptab__over{ font-size:22px; }
  .split{ grid-template-columns:1fr; gap:20px; padding-block:40px; }
  .plogos{ flex-wrap:wrap; }
}

@media (max-width:720px){
  .ptabs__bar-inner{ gap:22px; overflow-x:auto; }
  .feats{ grid-template-columns:1fr; }
  .feats > *{ grid-column:auto; }
  .disc{ grid-template-columns:1fr; }
  .disc--center > .disc__card{ width:100%; }
  .plogo{ width:100%; }
}

/* ============================================================
   ОСТАЛЬНЫЕ СТРАНИЦЫ СЕРТИФИКАЦИЙ (ID 11-16)
   Разметка та же, что у pro-buh: шапка, показатели, вкладки.
   Ниже — только то, чего не было: арт справа, ряд из двух
   показателей, карточка «Программа курса» и селекторы вкладок
   (у каждой страницы свой префикс имён, иначе радиокнопки
   разных страниц конфликтовали бы).
   ============================================================ */
.phero--art-right .phero__body{ padding:40px 46% 40px 6.35%; }
.pstats--2{ grid-template-columns:repeat(2,1fr); }
/* ряд из трёх иконок без второй строки */
.feats--3{ grid-template-columns:repeat(3,1fr); }
.feats--3 > *{ grid-column:auto; }

/* карточка-панель со списком (Цель сертификации и т.п.) */
.panelcard{
  margin-top:80px;
  padding:50px 90px 60px;
  border-radius:var(--r);
  background:var(--bg-soft);
}
.panelcard__title{ font-size:36px; font-weight:800; margin-bottom:24px; }
.bullets li{
  position:relative; padding-left:22px; margin-bottom:12px;
  font-size:16px; line-height:1.45;
}
.bullets li::before{
  content:''; position:absolute; left:4px; top:10px;
  width:5px; height:5px; border-radius:50%; background:var(--ink);
}

/* лектор + расписание */
.lect{
  margin-top:70px;
  display:grid; grid-template-columns:1fr 300px 300px; gap:30px;
}
.lect__label{ font-size:15px; color:var(--ink-soft); margin-bottom:18px; }
.lect__person{ display:flex; gap:26px; align-items:flex-start; }
.lect__photo{ width:225px; height:auto; flex:none; }
.lect__name{ font-size:26px; font-weight:800; line-height:1.2; margin-bottom:12px; }
.lect__cred{ font-size:13px; line-height:1.4; color:var(--ink); margin-bottom:14px; max-width:390px; }
.lect__big{ font-size:26px; font-weight:800; }
.lect__sub{ margin-top:8px; font-size:15px; color:var(--ink-soft); }

/* скриншот сертификата */
.certshot img{ max-width:505px; width:100%; height:auto; border-radius:var(--r-sm); }

/* два комплекта (ИПБ): цветная карточка + плашка с ценой под ней */
.kits{
  margin-top:80px;
  display:grid; grid-template-columns:repeat(2,1fr); gap:var(--gap);
  align-items:start;
}
.kit{ display:flex; flex-direction:column; gap:var(--gap); }
.kit__card{
  flex:1;
  padding:50px 80px 60px;
  border-radius:var(--r);
  display:flex; flex-direction:column; align-items:flex-start;
}
.kit__title{ font-size:34px; font-weight:800; line-height:1.15; margin-bottom:26px; }
.kit__card .bullets li{ font-size:16px; }
.kit__card .more{ margin-top:24px; font-size:15px; }
.kit__price{
  padding:26px 80px;
  border-radius:var(--r);
  font-size:26px; font-weight:800;
}
.kit--mint  .kit__card,
.kit--mint  .kit__price{ background:var(--tint-mint); }
.kit--mint  .kit__title{ color:var(--teal); }
.kit--cream .kit__card,
.kit--cream .kit__price{ background:var(--tint-cream); }
.kit--cream .kit__title{ color:var(--orange); }

/* карточка дисциплины + «Повышение квалификации» в одну строку */
.kitfoot{
  margin-top:var(--gap);
  display:grid; grid-template-columns:408px 1fr; gap:var(--gap);
  align-items:stretch;
}
.upgrade{
  padding:50px 60px;
  border-radius:var(--r);
  background:var(--tint-pink);
  display:flex; flex-direction:column; justify-content:center;
  text-align:center;
}
.upgrade__title{ font-size:36px; font-weight:800; margin-bottom:20px; }
.upgrade p{ font-size:17px; line-height:1.45; }

/* «Программа курса» — карточка со списком тем */
.program{
  padding:50px 90px 60px;
  border-radius:var(--r);
  background:var(--bg-soft);
}
.program__title{ font-size:36px; font-weight:800; margin-bottom:10px; }
.program .split{ grid-template-columns:44% 1fr; gap:40px; padding-block:34px; }
.program .split__title{ font-size:22px; }
.program .split__body{ font-size:15px; line-height:1.4; color:var(--ink); }
.program .split:first-of-type{ border-top:0; }
.program__total .split__title{ font-size:26px; }
.program__total .split__body b{ font-size:26px; font-weight:800; }
.program__note{ margin-top:30px; text-align:center; font-size:16px; }
.program__note a{ color:var(--teal); text-decoration:underline; }

/* tax-consultant */
#taxconsultant-about:checked ~ .ptabs__bar label[for="taxconsultant-about"],
#taxconsultant-prog:checked ~ .ptabs__bar label[for="taxconsultant-prog"],
#taxconsultant-faq:checked ~ .ptabs__bar label[for="taxconsultant-faq"]{ color:var(--teal); }
#taxconsultant-about:checked ~ .ptabs__bar label[for="taxconsultant-about"]::after,
#taxconsultant-prog:checked ~ .ptabs__bar label[for="taxconsultant-prog"]::after,
#taxconsultant-faq:checked ~ .ptabs__bar label[for="taxconsultant-faq"]::after{ background:var(--teal); }
#taxconsultant-about:checked ~ .ptab--taxconsultant-about,
#taxconsultant-prog:checked ~ .ptab--taxconsultant-prog,
#taxconsultant-faq:checked ~ .ptab--taxconsultant-faq{ display:block; }

/* ipb */
#ipb-about:checked ~ .ptabs__bar label[for="ipb-about"],
#ipb-buh:checked ~ .ptabs__bar label[for="ipb-buh"],
#ipb-chief:checked ~ .ptabs__bar label[for="ipb-chief"],
#ipb-faq:checked ~ .ptabs__bar label[for="ipb-faq"]{ color:var(--teal); }
#ipb-about:checked ~ .ptabs__bar label[for="ipb-about"]::after,
#ipb-buh:checked ~ .ptabs__bar label[for="ipb-buh"]::after,
#ipb-chief:checked ~ .ptabs__bar label[for="ipb-chief"]::after,
#ipb-faq:checked ~ .ptabs__bar label[for="ipb-faq"]::after{ background:var(--teal); }
#ipb-about:checked ~ .ptab--ipb-about,
#ipb-buh:checked ~ .ptab--ipb-buh,
#ipb-chief:checked ~ .ptab--ipb-chief,
#ipb-faq:checked ~ .ptab--ipb-faq{ display:block; }

/* dipifr */
#dipifr-about:checked ~ .ptabs__bar label[for="dipifr-about"],
#dipifr-prog:checked ~ .ptabs__bar label[for="dipifr-prog"],
#dipifr-faq:checked ~ .ptabs__bar label[for="dipifr-faq"]{ color:var(--teal); }
#dipifr-about:checked ~ .ptabs__bar label[for="dipifr-about"]::after,
#dipifr-prog:checked ~ .ptabs__bar label[for="dipifr-prog"]::after,
#dipifr-faq:checked ~ .ptabs__bar label[for="dipifr-faq"]::after{ background:var(--teal); }
#dipifr-about:checked ~ .ptab--dipifr-about,
#dipifr-prog:checked ~ .ptab--dipifr-prog,
#dipifr-faq:checked ~ .ptab--dipifr-faq{ display:block; }

/* glavbuh */
#glavbuh-about:checked ~ .ptabs__bar label[for="glavbuh-about"],
#glavbuh-prog:checked ~ .ptabs__bar label[for="glavbuh-prog"],
#glavbuh-faq:checked ~ .ptabs__bar label[for="glavbuh-faq"]{ color:var(--teal); }
#glavbuh-about:checked ~ .ptabs__bar label[for="glavbuh-about"]::after,
#glavbuh-prog:checked ~ .ptabs__bar label[for="glavbuh-prog"]::after,
#glavbuh-faq:checked ~ .ptabs__bar label[for="glavbuh-faq"]::after{ background:var(--teal); }
#glavbuh-about:checked ~ .ptab--glavbuh-about,
#glavbuh-prog:checked ~ .ptab--glavbuh-prog,
#glavbuh-faq:checked ~ .ptab--glavbuh-faq{ display:block; }

/* auditor */
#auditor-about:checked ~ .ptabs__bar label[for="auditor-about"],
#auditor-prog:checked ~ .ptabs__bar label[for="auditor-prog"],
#auditor-faq:checked ~ .ptabs__bar label[for="auditor-faq"]{ color:var(--teal); }
#auditor-about:checked ~ .ptabs__bar label[for="auditor-about"]::after,
#auditor-prog:checked ~ .ptabs__bar label[for="auditor-prog"]::after,
#auditor-faq:checked ~ .ptabs__bar label[for="auditor-faq"]::after{ background:var(--teal); }
#auditor-about:checked ~ .ptab--auditor-about,
#auditor-prog:checked ~ .ptab--auditor-prog,
#auditor-faq:checked ~ .ptab--auditor-faq{ display:block; }

/* cpa-eurasia */
#cpaeurasia-about:checked ~ .ptabs__bar label[for="cpaeurasia-about"],
#cpaeurasia-l1:checked ~ .ptabs__bar label[for="cpaeurasia-l1"],
#cpaeurasia-l2:checked ~ .ptabs__bar label[for="cpaeurasia-l2"],
#cpaeurasia-l3:checked ~ .ptabs__bar label[for="cpaeurasia-l3"],
#cpaeurasia-faq:checked ~ .ptabs__bar label[for="cpaeurasia-faq"]{ color:var(--teal); }
#cpaeurasia-about:checked ~ .ptabs__bar label[for="cpaeurasia-about"]::after,
#cpaeurasia-l1:checked ~ .ptabs__bar label[for="cpaeurasia-l1"]::after,
#cpaeurasia-l2:checked ~ .ptabs__bar label[for="cpaeurasia-l2"]::after,
#cpaeurasia-l3:checked ~ .ptabs__bar label[for="cpaeurasia-l3"]::after,
#cpaeurasia-faq:checked ~ .ptabs__bar label[for="cpaeurasia-faq"]::after{ background:var(--teal); }
#cpaeurasia-about:checked ~ .ptab--cpaeurasia-about,
#cpaeurasia-l1:checked ~ .ptab--cpaeurasia-l1,
#cpaeurasia-l2:checked ~ .ptab--cpaeurasia-l2,
#cpaeurasia-l3:checked ~ .ptab--cpaeurasia-l3,
#cpaeurasia-faq:checked ~ .ptab--cpaeurasia-faq{ display:block; }

/* ============================================================
   СПИСКИ КУРСОВ — categories/courses-basic|advanced.tpl
   Замеры из design/courses/: шапка 1260×480, карточка 1260×400,
   промежуток 20, радиус 20. Арт карточки — правая половина,
   текста в ней нет, поэтому склейка без версии «без текста».
   ============================================================ */
.chero{
  position:relative; overflow:hidden;
  min-height:480px;
  border-radius:var(--r);
  display:flex; align-items:center;
  color:#fff;
}
.chero--teal{ background:var(--teal); }
.chero--red { background:var(--red); }
.chero__art{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
}
.chero__body{
  position:relative; z-index:1;
  width:100%;
  padding:40px 46% 40px 6.35%;
}
.chero__title{
  font-size:42px; font-weight:800; line-height:1.15; letter-spacing:-.01em;
  margin-bottom:26px;
}
.chero__lead{ font-size:19px; font-weight:800; line-height:1.4; max-width:580px; }

/* карточка курса */
.clist--courses{ margin-top:var(--gap); }
.ccourse{
  position:relative; overflow:hidden;
  min-height:400px;
  border-radius:var(--r);
  display:flex; align-items:center;
}
.ccourse--cream{ background:var(--tint-cream); }
.ccourse--mint { background:var(--tint-mint); }
.ccourse--pink { background:var(--tint-pink); }
/* арт занимает правую половину — в макете он начинается на 760 px */
.ccourse__art{
  position:absolute; right:0; top:0;
  width:46.83%; height:100%;
  object-fit:cover;
}
.ccourse__body{
  position:relative; z-index:1;
  width:100%;
  padding:40px 48% 40px 6.35%;
  display:flex; flex-direction:column; align-items:flex-start;
}
.ccourse__title{
  margin:26px 0 34px;
  font-size:26px; font-weight:800; line-height:1.25;
}

@media (max-width:980px){
  .chero{ min-height:0; }
  .chero__art,
  .ccourse__art{ display:none; }
  .chero__body{ padding:36px 30px; }
  .chero__title{ font-size:30px; }
  .ccourse{ min-height:0; }
  .ccourse__body{ padding:34px 30px; }
  .ccourse__title{ font-size:22px; }
}

/* ============================================================
   СТРАНИЦА КУРСА — categories/course-*.tpl
   Шапка 1260×460, три плашки 407×128, дальше вкладки.
   В этом экспорте заголовок шапки — растр внутри SVG, отделить
   его от арта нельзя, поэтому берём только правую часть (арт),
   а фон и текст остаются на CSS.
   ============================================================ */
.chero--course{ min-height:460px; }
.chero--course .chero__body{
  padding:40px 48% 40px 6.35%;
  display:flex; flex-direction:column; align-items:flex-start;
}
.chero__title--dark{ color:var(--ink); }
.chero__art--side{
  left:auto; right:0;
  width:48.41%;
}
.chero--cream{ background:var(--tint-cream); }
.chero--mint { background:var(--tint-mint); }
.chero--pink { background:var(--tint-pink); }

.cbtns{ display:flex; flex-wrap:wrap; gap:0; }
.cbtns .btn{ border-radius:10px 0 0 10px; }
.cbtns .btn + .btn{ border-radius:0 10px 10px 0; }
.btn.btn--orange{ background:var(--orange); color:#fff; }
.btn.btn--orange:hover{ background:var(--orange); color:#fff; opacity:.88; }

.pstat--logo{ padding:20px; }
.pstat--logo img{ max-width:204px; height:auto; }

/* «В стоимость входит» — две иконки по центру */
.feats--2{ grid-template-columns:repeat(2,1fr); max-width:760px; }
.feats--2 > *{ grid-column:auto; }

/* нумерованная программа курса */
.prognum{ margin:0; padding-left:26px; list-style:decimal; font-size:16px; line-height:1.45; }
.prognum li{ margin-bottom:8px; }
.prognum__sub{ margin-top:8px; padding-left:26px; }

/* фото лектора в курсе — рамка светлее, чем на сертификациях */
.lect__photo--course{ width:230px; }

/* вкладки страниц курсов */
#coursestart-about:checked ~ .ptabs__bar label[for="coursestart-about"],
#coursestart-m1:checked ~ .ptabs__bar label[for="coursestart-m1"],
#coursestart-m2:checked ~ .ptabs__bar label[for="coursestart-m2"],
#coursestart-faq:checked ~ .ptabs__bar label[for="coursestart-faq"],
#courseexcel-about:checked ~ .ptabs__bar label[for="courseexcel-about"],
#courseexcel-prog:checked ~ .ptabs__bar label[for="courseexcel-prog"],
#courseexcel-faq:checked ~ .ptabs__bar label[for="courseexcel-faq"],
#courselaw-about:checked ~ .ptabs__bar label[for="courselaw-about"],
#courselaw-prog:checked ~ .ptabs__bar label[for="courselaw-prog"],
#courselaw-faq:checked ~ .ptabs__bar label[for="courselaw-faq"],
#courseifrs-about:checked ~ .ptabs__bar label[for="courseifrs-about"],
#courseifrs-prog:checked ~ .ptabs__bar label[for="courseifrs-prog"],
#courseifrs-faq:checked ~ .ptabs__bar label[for="courseifrs-faq"],
#coursetax-about:checked ~ .ptabs__bar label[for="coursetax-about"],
#coursetax-prog:checked ~ .ptabs__bar label[for="coursetax-prog"],
#coursetax-faq:checked ~ .ptabs__bar label[for="coursetax-faq"],
#courseethics-about:checked ~ .ptabs__bar label[for="courseethics-about"],
#courseethics-prog:checked ~ .ptabs__bar label[for="courseethics-prog"],
#courseethics-faq:checked ~ .ptabs__bar label[for="courseethics-faq"],
#coursefinmgmt-about:checked ~ .ptabs__bar label[for="coursefinmgmt-about"],
#coursefinmgmt-prog:checked ~ .ptabs__bar label[for="coursefinmgmt-prog"],
#coursefinmgmt-faq:checked ~ .ptabs__bar label[for="coursefinmgmt-faq"],
#coursemgmtacc-about:checked ~ .ptabs__bar label[for="coursemgmtacc-about"],
#coursemgmtacc-prog:checked ~ .ptabs__bar label[for="coursemgmtacc-prog"],
#coursemgmtacc-faq:checked ~ .ptabs__bar label[for="coursemgmtacc-faq"],
#coursefindir-about:checked ~ .ptabs__bar label[for="coursefindir-about"],
#coursefindir-prog:checked ~ .ptabs__bar label[for="coursefindir-prog"],
#coursefindir-faq:checked ~ .ptabs__bar label[for="coursefindir-faq"]{ color:var(--teal); }
#coursestart-about:checked ~ .ptabs__bar label[for="coursestart-about"]::after,
#coursestart-m1:checked ~ .ptabs__bar label[for="coursestart-m1"]::after,
#coursestart-m2:checked ~ .ptabs__bar label[for="coursestart-m2"]::after,
#coursestart-faq:checked ~ .ptabs__bar label[for="coursestart-faq"]::after,
#courseexcel-about:checked ~ .ptabs__bar label[for="courseexcel-about"]::after,
#courseexcel-prog:checked ~ .ptabs__bar label[for="courseexcel-prog"]::after,
#courseexcel-faq:checked ~ .ptabs__bar label[for="courseexcel-faq"]::after,
#courselaw-about:checked ~ .ptabs__bar label[for="courselaw-about"]::after,
#courselaw-prog:checked ~ .ptabs__bar label[for="courselaw-prog"]::after,
#courselaw-faq:checked ~ .ptabs__bar label[for="courselaw-faq"]::after,
#courseifrs-about:checked ~ .ptabs__bar label[for="courseifrs-about"]::after,
#courseifrs-prog:checked ~ .ptabs__bar label[for="courseifrs-prog"]::after,
#courseifrs-faq:checked ~ .ptabs__bar label[for="courseifrs-faq"]::after,
#coursetax-about:checked ~ .ptabs__bar label[for="coursetax-about"]::after,
#coursetax-prog:checked ~ .ptabs__bar label[for="coursetax-prog"]::after,
#coursetax-faq:checked ~ .ptabs__bar label[for="coursetax-faq"]::after,
#courseethics-about:checked ~ .ptabs__bar label[for="courseethics-about"]::after,
#courseethics-prog:checked ~ .ptabs__bar label[for="courseethics-prog"]::after,
#courseethics-faq:checked ~ .ptabs__bar label[for="courseethics-faq"]::after,
#coursefinmgmt-about:checked ~ .ptabs__bar label[for="coursefinmgmt-about"]::after,
#coursefinmgmt-prog:checked ~ .ptabs__bar label[for="coursefinmgmt-prog"]::after,
#coursefinmgmt-faq:checked ~ .ptabs__bar label[for="coursefinmgmt-faq"]::after,
#coursemgmtacc-about:checked ~ .ptabs__bar label[for="coursemgmtacc-about"]::after,
#coursemgmtacc-prog:checked ~ .ptabs__bar label[for="coursemgmtacc-prog"]::after,
#coursemgmtacc-faq:checked ~ .ptabs__bar label[for="coursemgmtacc-faq"]::after,
#coursefindir-about:checked ~ .ptabs__bar label[for="coursefindir-about"]::after,
#coursefindir-prog:checked ~ .ptabs__bar label[for="coursefindir-prog"]::after,
#coursefindir-faq:checked ~ .ptabs__bar label[for="coursefindir-faq"]::after{ background:var(--teal); }
#coursestart-about:checked ~ .ptab--coursestart-about,
#coursestart-m1:checked ~ .ptab--coursestart-m1,
#coursestart-m2:checked ~ .ptab--coursestart-m2,
#coursestart-faq:checked ~ .ptab--coursestart-faq,
#courseexcel-about:checked ~ .ptab--courseexcel-about,
#courseexcel-prog:checked ~ .ptab--courseexcel-prog,
#courseexcel-faq:checked ~ .ptab--courseexcel-faq,
#courselaw-about:checked ~ .ptab--courselaw-about,
#courselaw-prog:checked ~ .ptab--courselaw-prog,
#courselaw-faq:checked ~ .ptab--courselaw-faq,
#courseifrs-about:checked ~ .ptab--courseifrs-about,
#courseifrs-prog:checked ~ .ptab--courseifrs-prog,
#courseifrs-faq:checked ~ .ptab--courseifrs-faq,
#coursetax-about:checked ~ .ptab--coursetax-about,
#coursetax-prog:checked ~ .ptab--coursetax-prog,
#coursetax-faq:checked ~ .ptab--coursetax-faq,
#courseethics-about:checked ~ .ptab--courseethics-about,
#courseethics-prog:checked ~ .ptab--courseethics-prog,
#courseethics-faq:checked ~ .ptab--courseethics-faq,
#coursefinmgmt-about:checked ~ .ptab--coursefinmgmt-about,
#coursefinmgmt-prog:checked ~ .ptab--coursefinmgmt-prog,
#coursefinmgmt-faq:checked ~ .ptab--coursefinmgmt-faq,
#coursemgmtacc-about:checked ~ .ptab--coursemgmtacc-about,
#coursemgmtacc-prog:checked ~ .ptab--coursemgmtacc-prog,
#coursemgmtacc-faq:checked ~ .ptab--coursemgmtacc-faq,
#coursefindir-about:checked ~ .ptab--coursefindir-about,
#coursefindir-prog:checked ~ .ptab--coursefindir-prog,
#coursefindir-faq:checked ~ .ptab--coursefindir-faq{ display:block; }

/* ============================================================
   ЧЛЕНСТВО В ПОБ «ППБ РК» — categories/join.tpl
   Замеры из design/join/: шапка 1260×480 (арт слева, заголовок
   справа), плашки 406.7×128, иконки 63×64 radius 16,
   карточки стоимости 738 в ширину.
   ============================================================ */
.jhero{
  position:relative; overflow:hidden;
  min-height:480px;
  border-radius:var(--r);
  background:var(--orange);
  display:flex; align-items:center;
  color:#fff;
}
.jhero__art{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
}
.jhero__body{
  position:relative; z-index:1;
  width:100%;
  padding:40px 6.35% 40px 48%;
}
.jhero__title{
  font-size:42px; font-weight:800; line-height:1.16; letter-spacing:-.01em;
}
.jhero__sub{ margin-top:30px; font-size:26px; font-weight:800; }

/* нумерация в заголовке колонки */
.split__num{ display:inline-block; margin-right:8px; }

/* стоимость выпуска сертификатов */
.certcost{
  max-width:738px; margin:0 auto;
  display:flex; flex-direction:column; gap:var(--gap);
}
.certcost__row{
  padding:34px 70px;
  border-radius:var(--r);
  background:var(--bg-soft);
  display:flex; align-items:center; gap:60px;
}
.certcost__logo{ width:213px; height:auto; flex:none; }
.certcost__list{ margin:0; font-size:17px; }
.certcost__list > div{ display:flex; gap:14px; margin-bottom:8px; }
.certcost__list dt{ min-width:110px; color:var(--ink); }
.certcost__list dd{ margin:0; font-weight:800; white-space:nowrap; }

/* вступительный взнос */
.fee{
  margin-top:80px;
  display:grid; grid-template-columns:1fr 1fr; gap:60px;
  align-items:center;
}
.fee__art{ width:100%; max-width:385px; height:auto; margin-inline:auto; }
.fee__title{ font-size:36px; font-weight:800; line-height:1.2; margin-bottom:30px; }
.fee__list{ margin:0 0 10px; font-size:17px; }
.fee__list > div{ display:flex; gap:20px; margin-bottom:4px; }
.fee__list dt{ min-width:190px; }
.fee__list dd{ margin:0; font-weight:800; white-space:nowrap; }
.fee__list--total{ margin-top:18px; font-size:19px; }
.fee__pay{
  margin-top:34px;
  display:flex; align-items:center; gap:34px; flex-wrap:wrap;
}
.fee__pay p{ font-size:14px; line-height:1.35; }
.btn.btn--red{ background:var(--red); color:#fff; }
.btn.btn--red:hover{ background:var(--red); color:#fff; opacity:.88; }

/* панель с реквизитами: текст слева, кнопка справа */
.panelcard--split{
  display:flex; align-items:center; justify-content:space-between; gap:60px;
  padding:40px 90px;
}
.panelcard--split p{ margin-bottom:16px; font-size:17px; line-height:1.45; }
.panelcard--split p:last-child{ margin-bottom:0; }
.panelcard--split .btn{ flex:none; }

@media (max-width:980px){
  .jhero{ min-height:0; }
  .jhero__art{ display:none; }
  .jhero__body{ padding:36px 30px; }
  .jhero__title{ font-size:30px; }
  .jhero__sub{ font-size:21px; margin-top:20px; }
  .certcost__row{ padding:28px 30px; flex-direction:column; align-items:flex-start; gap:20px; }
  .fee{ grid-template-columns:1fr; gap:30px; }
  .fee__title{ font-size:26px; }
  .panelcard--split{ flex-direction:column; align-items:flex-start; gap:24px; padding:34px 30px; }
}

/* ============================================================
   ЧЛЕНСТВО ДЛЯ ЮРЛИЦ — categories/join-company.tpl
   Иконки преимуществ 63×63 radius 16 на светло-розовом,
   галочки тарифов 58×58 radius 16, три плана в ряд.
   ============================================================ */
#jc-join:checked ~ .ptabs__bar label[for="jc-join"],
#jc-list:checked ~ .ptabs__bar label[for="jc-list"]{ color:var(--teal); }
#jc-join:checked ~ .ptabs__bar label[for="jc-join"]::after,
#jc-list:checked ~ .ptabs__bar label[for="jc-list"]::after{ background:var(--teal); }
#jc-join:checked ~ .ptab--jc-join,
#jc-list:checked ~ .ptab--jc-list{ display:block; }

.panelcard--narrow{ max-width:830px; margin-inline:auto; }
.panelcard__note{ margin-top:22px; font-size:14px; line-height:1.5; }
.panelcard__note a{ color:var(--teal); }

/* тарифные планы */
.plans{
  display:grid; grid-template-columns:repeat(3,1fr); gap:40px;
  max-width:1140px; margin:0 auto;
}
.plan__name{ font-size:30px; font-weight:800; }
.plan__for{ margin-top:6px; font-size:15px; color:var(--ink); }
.plan__list{ margin-top:26px; }
.plan__list li{
  display:flex; align-items:flex-start; gap:18px;
  margin-bottom:16px;
  font-size:15px; line-height:1.35;
}
.plan__list img{ width:58px; height:58px; flex:none; }
.plan__mrp  { margin-top:24px; font-size:15px; }
.plan__price{ margin-top:4px; font-size:30px; font-weight:800; }

/* поиск по списку членов */
.msearch{ display:flex; gap:20px; margin-bottom:40px; }
.msearch__input{
  flex:1;
  padding:0 30px; min-height:66px;
  border:0; border-radius:14px;
  background:var(--bg-soft);
  font:inherit; font-weight:800; color:var(--ink);
}
.msearch__input::placeholder{ color:var(--ink-soft); font-weight:800; }
.msearch__input:focus{ outline:2px solid var(--teal); outline-offset:-2px; }
.btn.btn--teal-outline{ border-color:var(--teal); color:var(--teal); }
.btn.btn--teal-outline:hover{ background:var(--teal); color:#fff; }

/* таблица ассоциированных членов */
.mtable{
  border:1px solid var(--border);
  border-radius:var(--r);
  padding:10px 40px 30px;
  overflow-x:auto;
}
.mtable table{ width:100%; border-collapse:collapse; }
.mtable th{
  padding:24px 0 16px;
  text-align:left; font-weight:500; font-size:15px; color:var(--ink-soft);
  border-bottom:1px solid var(--border);
}
.mtable td{
  padding:20px 0;
  font-size:16px;
  border-bottom:1px solid var(--border);
}
.mtable tr:last-child td{ border-bottom:0; }
.mtable th + th, .mtable td + td{ padding-left:30px; width:210px; }

@media (max-width:980px){
  .plans{ grid-template-columns:1fr; gap:34px; max-width:420px; }
  .msearch{ flex-direction:column; }
  .mtable{ padding:10px 20px 20px; }
}

/* ============================================================
   АККРЕДИТАЦИЯ УЦ — categories/accreditation.tpl
   ============================================================ */
#acc-about:checked ~ .ptabs__bar label[for="acc-about"],
#acc-req:checked   ~ .ptabs__bar label[for="acc-req"],
#acc-order:checked ~ .ptabs__bar label[for="acc-order"],
#acc-list:checked  ~ .ptabs__bar label[for="acc-list"]{ color:var(--teal); }
#acc-about:checked ~ .ptabs__bar label[for="acc-about"]::after,
#acc-req:checked   ~ .ptabs__bar label[for="acc-req"]::after,
#acc-order:checked ~ .ptabs__bar label[for="acc-order"]::after,
#acc-list:checked  ~ .ptabs__bar label[for="acc-list"]::after{ background:var(--teal); }
#ct-info:checked    ~ .ptabs__bar label[for="ct-info"],
#ct-offices:checked ~ .ptabs__bar label[for="ct-offices"],
#ct-team:checked    ~ .ptabs__bar label[for="ct-team"]{ color:var(--teal); }
#ct-info:checked    ~ .ptabs__bar label[for="ct-info"]::after,
#ct-offices:checked ~ .ptabs__bar label[for="ct-offices"]::after,
#ct-team:checked    ~ .ptabs__bar label[for="ct-team"]::after{ background:var(--teal); }
#ct-info:checked    ~ .ptab--ct-info,
#ct-offices:checked ~ .ptab--ct-offices,
#ct-team:checked    ~ .ptab--ct-team{ display:block; }

#acc-about:checked ~ .ptab--acc-about,
#acc-req:checked   ~ .ptab--acc-req,
#acc-order:checked ~ .ptab--acc-order,
#acc-list:checked  ~ .ptab--acc-list{ display:block; }

/* «категории A:» в заголовке колонки — красным */
.split__cat{ color:var(--red); }
/* подзаголовки категорий в «Порядке проведения» */
.acat{ margin:26px 0 12px; font-size:17px; font-weight:800; }
.acat--red{ color:var(--red); }
.acat:first-child{ margin-top:0; }

/* стоимость аккредитации */
.acost{
  margin-top:70px;
  padding:50px 60px;
  border-radius:var(--r);
  background:var(--bg-soft);
  display:grid; grid-template-columns:290px 1fr 1fr; gap:50px;
  align-items:center;
}
.acost__art{ width:100%; height:auto; }
.acost__title{ font-size:28px; font-weight:800; line-height:1.2; margin-bottom:26px; }
.acost__list{ margin:0; font-size:17px; }
.acost__list > div{ display:flex; gap:20px; margin-bottom:14px; }
.acost__list dt{ min-width:140px; }
.acost__list dd{ margin:0; font-weight:800; white-space:nowrap; }
.acost__side p{ margin-bottom:18px; font-size:16px; line-height:1.45; }
.acost__side p:last-child{ margin-bottom:0; }

/* «один звонок» */
.acall{ margin-top:70px; text-align:center; }
.acall__text{ font-size:24px; font-weight:800; }
.acall__phone{
  display:inline-block; margin-top:16px;
  font-size:30px; font-weight:800; color:var(--teal);
}
.acall__phone:hover{ text-decoration:underline; }

/* реестр УЦ — четыре колонки */
.mtable--4 th + th, .mtable--4 td + td{ width:170px; }

@media (max-width:980px){
  .acost{ grid-template-columns:1fr; gap:30px; padding:34px 30px; }
  .acost__art{ max-width:260px; margin-inline:auto; }
  .acall__text{ font-size:19px; }
  .acall__phone{ font-size:24px; }
}

/* ============================================================
   СПИСОК НОВОСТЕЙ — modules/layout-news.tpl
   Замеры по макету: подпись слева занимает 201 px, дальше
   четыре карточки по 250 с промежутком 20 (итого 1060).
   ============================================================ */
.nlist__h1{ margin-bottom:44px; }
.nlist{
  display:grid; grid-template-columns:201px 1fr; gap:0 40px;
  align-items:start;
}
.nlist__label{
  font-size:19px; font-weight:800; line-height:1.3;
  padding-top:4px;
}
.nlist__grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:var(--gap);
}
/* карточка в сетке, а не в карусели: ширину задаёт колонка */
.nlist__grid > *{ width:auto; }
.nlist__foot{ display:flex; justify-content:center; margin-top:50px; }
.nlist__foot .navigation{ margin:0; }

@media (max-width:1100px){ .nlist__grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:980px){
  .nlist{ grid-template-columns:1fr; gap:20px; }
  .nlist__grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:560px){ .nlist__grid{ grid-template-columns:1fr; } }

/* ============================================================
   ПОЛЕЗНЫЕ ССЫЛКИ — categories/links.tpl
   Строится на .split: слева иконка с названием, справа список.
   ============================================================ */
.lrow__head{ display:flex; align-items:center; gap:22px; }
.lrow__ico{ width:64px; height:64px; flex:none; }
/* .llist лежит внутри .split__body, а там ul получает list-style:disc —
   отсюда была вторая, чёрная точка. Гасим маркер с той же специфичностью
   через .split__body (0,2,0), своя бирюзовая точка рисуется в ::before. */
.split__body .llist,
.llist{ list-style:none; padding-left:0; margin:0; }
.llist li{
  position:relative; padding-left:20px; margin-bottom:12px;
  font-size:17px; line-height:1.35;
}
.llist li::before{
  content:''; position:absolute; left:2px; top:11px;
  width:5px; height:5px; border-radius:50%;
  background:var(--teal);
}
.llist a{ color:var(--teal); }
.llist a:hover{ text-decoration:underline; }

@media (max-width:980px){
  .lrow__ico{ width:52px; height:52px; }
  .lrow__head{ gap:16px; }
}

/* ============================================================
   КОНТАКТЫ — categories/contacts.tpl
   Карточка: рамка 1 px, радиус 20, строки «подпись/значение»
   через тонкие линии. Подпись слева ~47 %, значение справа.
   ============================================================ */
.contacts__h1{ margin-bottom:34px; }
/* на этой странице заголовок стоит над полосой вкладок вплотную */
.ptabs--flush{ margin-top:0; }

.ccard2{
  border:1px solid var(--border);
  border-radius:var(--r);
  padding:10px 40px 26px;
}
.ccard2 + .ccard2{ margin-top:var(--gap); }
.ccard2__title{
  padding:24px 0 20px;
  font-size:19px; font-weight:800;
  border-bottom:1px solid var(--border);
}
.ccard2__list{ margin:0; }
.crow{
  display:grid; grid-template-columns:47% 1fr; gap:20px;
  padding:20px 0;
  border-bottom:1px solid var(--border);
  font-size:16px; line-height:1.4;
}
.crow:last-child{ border-bottom:0; }
.crow dt{ color:var(--ink); }
.crow dd{ margin:0; }
.crow a{ color:var(--teal); }
.crow a:hover{ text-decoration:underline; }
.crow__note{ display:block; margin-top:4px; font-size:15px; color:var(--ink-soft); }

/* карта проезда */
.cmap{
  position:relative; display:block;
  max-width:798px; margin:0 auto;
  border-radius:var(--r); overflow:hidden;
}
.cmap img{ width:100%; height:auto; display:block; }
.cmap__btn{
  position:absolute; left:0; bottom:0;
  padding:14px 22px;
  border-radius:0 12px 0 var(--r);
  background:#fff;
  font-size:15px; color:var(--ink);
  box-shadow:0 1px 6px rgba(31,42,59,.14);
}
.cmap:hover .cmap__btn{ background:var(--ink); color:#fff; }

/* команда */
.team__wide{
  display:flex; align-items:center; gap:60px;
  padding:34px 60px;
  border-radius:var(--r);
  background:var(--bg-soft);
}
.team__wide + .team__wide{ margin-top:var(--gap); }
.team__grid{
  margin-top:var(--gap);
  display:grid; grid-template-columns:repeat(4,1fr); gap:var(--gap);
}
.team__cell{
  padding:34px 38px;
  border-radius:var(--r);
  background:var(--bg-soft);
}
.team__ava{ width:222px; height:auto; flex:none; }
.team__cell .team__ava{ width:100%; max-width:222px; }
.team__cell .team__body{ margin-top:20px; }
.team__name{ font-size:21px; font-weight:800; }
.team__cell .team__name{ font-size:17px; }
.team__role{ margin-top:10px; font-size:16px; line-height:1.35; }
.team__cell .team__role{ font-size:15px; }
.team__contact{ margin-top:16px; font-size:16px; line-height:1.45; }
.team__cell .team__contact{ font-size:15px; }
.team__contact a{ color:var(--teal); }
.team__contact a:hover{ text-decoration:underline; }

@media (max-width:980px){
  .ccard2{ padding:10px 24px 20px; }
  .crow{ grid-template-columns:1fr; gap:6px; }
  .team__wide{ flex-direction:column; align-items:flex-start; gap:24px; padding:28px 30px; }
  .team__grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:560px){ .team__grid{ grid-template-columns:1fr; } }

/* ============================================================
   ВАКАНСИИ — categories/vacancy.tpl
   ============================================================ */
.vhero__cta{ margin-top:38px; font-size:34px; font-weight:800; }
/* цветные заголовки колонок */
.split__title--red { color:var(--red); }
.split__title--teal{ color:var(--teal); }
/* карточка с адресом: текст по центру блока, но выключка влево */
.panelcard--center{
  margin-top:70px;
  padding:60px 90px;
}
.panelcard--center > *{ max-width:700px; margin-inline:auto; }
.panelcard--center p{ font-size:16px; line-height:1.5; }
.vsend{
  margin-top:26px;
  font-size:24px; font-weight:800;
}
.vsend a{ color:var(--teal); }
.vsend a:hover{ text-decoration:underline; }

@media (max-width:980px){
  .vhero__cta{ font-size:24px; margin-top:24px; }
  .panelcard--center{ padding:34px 30px; }
  .vsend{ font-size:19px; }
}

/* ============================================================
   О КОМПАНИИ — categories/about.tpl
   Карточки логотипов 408×172, документы в колонке справа,
   структура — раскрывающиеся строки на details.
   ============================================================ */
#ab-hist:checked   ~ .ptabs__bar label[for="ab-hist"],
#ab-struct:checked ~ .ptabs__bar label[for="ab-struct"],
#ab-part:checked   ~ .ptabs__bar label[for="ab-part"],
#ab-lect:checked   ~ .ptabs__bar label[for="ab-lect"]{ color:var(--teal); }
#ab-hist:checked   ~ .ptabs__bar label[for="ab-hist"]::after,
#ab-struct:checked ~ .ptabs__bar label[for="ab-struct"]::after,
#ab-part:checked   ~ .ptabs__bar label[for="ab-part"]::after,
#ab-lect:checked   ~ .ptabs__bar label[for="ab-lect"]::after{ background:var(--teal); }
#ab-hist:checked   ~ .ptab--ab-hist,
#ab-struct:checked ~ .ptab--ab-struct,
#ab-part:checked   ~ .ptab--ab-part,
#ab-lect:checked   ~ .ptab--ab-lect{ display:block; }

/* нормативные документы */
.docs{ display:flex; flex-direction:column; gap:var(--gap); }
.doc{
  padding:22px 26px;
  border-radius:14px;
  background:var(--bg-soft);
}
.doc__ext{
  display:inline-block; padding:3px 10px;
  border-radius:6px; background:var(--red);
  font-size:12px; font-weight:800; color:#fff;
}
.doc__title{ margin:12px 0 8px; font-size:19px; font-weight:800; }

/* две широкие кнопки-плашки */
.abcta{ margin-top:60px; }
.abcta__card{
  display:flex; align-items:center; justify-content:center;
  min-height:88px; padding:20px 40px;
  border-radius:var(--r);
  text-align:center; font-size:19px; font-weight:800; line-height:1.3;
  transition:opacity .18s;
}
.abcta__card:hover{ opacity:.85; }
.abcta__card--cream{ background:var(--tint-cream); color:var(--orange); }
.abcta__card--mint { background:var(--tint-mint);  color:var(--teal); }

/* структура */
.struct{ display:flex; flex-direction:column; gap:var(--gap); }
.struct__row{
  border:1px solid var(--border);
  border-radius:14px;
  padding:22px 30px;
}
.struct__row > summary,
.struct__row:not(details){
  display:grid; grid-template-columns:47% 1fr; gap:20px;
  align-items:center;
}
.struct__row > summary{ list-style:none; cursor:pointer; position:relative; padding-right:40px; }
.struct__row > summary::-webkit-details-marker{ display:none; }
.struct__row > summary::after{
  content:''; position:absolute; right:0; top:50%;
  width:13px; height:13px; margin-top:-6px;
  background:var(--ink);
  -webkit-mask:var(--chev) center/contain no-repeat;
          mask:var(--chev) center/contain no-repeat;
  transform:rotate(90deg); transition:transform .2s;
}
.struct__row[open] > summary::after{ transform:rotate(-90deg); }
.struct__key{ font-size:19px; font-weight:800; }
.struct__val{ font-size:17px; }
.struct__more{ padding-top:18px; font-size:16px; line-height:1.5; }

/* партнёры */
.abhead{ margin-bottom:34px; font-size:36px; }
.abhead--gap{ margin-top:70px; }
.prow{
  display:grid; grid-template-columns:408px 1fr; gap:60px;
  align-items:center;
  margin-bottom:var(--gap);
}
.prow__logo{
  min-height:172px; border-radius:var(--r); background:var(--bg-soft);
  display:grid; place-items:center; padding:20px;
}
.prow__logo img{ max-width:75%; height:auto; }
.prow__title{ font-size:24px; font-weight:800; line-height:1.3; margin-bottom:14px; }

/* лекторы */
.lect2lead{ margin-bottom:50px; }
.lect2grid{ display:grid; grid-template-columns:1fr 1fr; gap:44px 40px; }
.lect2{ display:flex; gap:30px; align-items:flex-start; }
.lect2__ava{ width:140px; height:auto; flex:none; }
.lect2__name{ font-size:21px; font-weight:800; line-height:1.2; }
.lect2__cred{ margin:12px 0 14px; font-size:13px; line-height:1.45; }

@media (max-width:980px){
  .prow{ grid-template-columns:1fr; gap:20px; }
  .prow__logo{ min-height:140px; }
  .lect2grid{ grid-template-columns:1fr; gap:30px; }
  .struct__row > summary,
  .struct__row:not(details){ grid-template-columns:1fr; gap:6px; }
  .abhead{ font-size:26px; }
}

/* ============================================================
   СТРАНИЦА ЛЕКТОРА — categories/lecturer-*.tpl
   Шапка 1260×460, портрет справа; дальше блоки split,
   цитата и список мероприятий.
   ============================================================ */
.lhero{
  min-height:460px;
  border-radius:var(--r);
  background:var(--bg-soft);
  display:grid; grid-template-columns:1fr 435px; gap:40px;
  align-items:center;
  padding:40px 6.35%;
}
.lhero__name{ font-size:40px; font-weight:800; line-height:1.15; letter-spacing:-.01em; }
.lhero__cred{ margin-top:22px; font-size:16px; line-height:1.5; max-width:580px; }
.lhero__ava{ width:100%; height:auto; }

/* цитата */
.lquote{
  position:relative;
  margin:80px 0 0;
  padding:50px 90px;
  border-radius:var(--r);
  background:var(--bg-soft);
}
.lquote blockquote{
  margin:0;
  font-size:19px; font-weight:800; line-height:1.5;
  max-width:760px;
}
.lquote::before,
.lquote::after{
  content:'”';
  position:absolute;
  font-size:150px; line-height:1; font-weight:800;
  color:var(--teal);
}
.lquote::before{ right:40px; top:-46px; }
.lquote::after{ left:24px; bottom:-72px; }

/* мероприятия лектора */
.levents{ margin-top:34px; }
.levent{
  display:flex; align-items:center; justify-content:space-between; gap:30px;
  padding:24px 0;
  border-bottom:1px solid var(--border);
  font-size:19px; font-weight:800; line-height:1.35;
}
.levent:first-child{ border-top:1px solid var(--border); }
.levent__more{
  display:inline-flex; align-items:center; gap:9px;
  flex:none;
  font-size:15px; font-weight:500; color:var(--teal);
}
.levent__more::after{
  content:''; width:15px; height:15px;
  background:currentColor;
  -webkit-mask:var(--arrow) center/contain no-repeat;
          mask:var(--arrow) center/contain no-repeat;
}
.levent:hover .levent__more{ text-decoration:underline; }

@media (max-width:980px){
  .lhero{ grid-template-columns:1fr; gap:26px; padding:34px 30px; min-height:0; }
  .lhero__name{ font-size:28px; }
  .lhero__ava{ max-width:360px; }
  .lquote{ padding:34px 30px; }
  .lquote::before{ right:20px; top:-34px; font-size:100px; }
  .lquote::after{ left:14px; bottom:-52px; font-size:100px; }
  .levent{ flex-direction:column; align-items:flex-start; gap:10px; font-size:17px; }
}