:root {
  --ossn-blue:        #1B4FD8;
  --ossn-dark:        #0F2557;
  --ossn-text:        #111827;
  --ossn-text-2:      #374151;
  --ossn-muted:       #6B7280;
  --ossn-light:       #9CA3AF;
  --ossn-bg:          #F7F8FA;
  --ossn-white:       #FFFFFF;
  --ossn-border:      #E5E7EB;
  --ossn-footer-bg:   #1A1D23;
  --ossn-font:        'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  --ossn-radius:      8px;
  --ossn-transition:  0.18s ease;
}

/* ============================================================
   T123 БЛОКИ (Hero, About, CTA, Trust Bar, CTA Membership)
   Назначить классы блокам в настройках Tilda.
   Установить ширину блока: "Весь экран"
   ============================================================ */
.ossn-hero-section .t-container,
.ossn-about-section .t-container,
.ossn-cta-section .t-container,
.ossn-cta-membership-section .t-container,
.ossn-trustbar-section .t-container {
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  width: 100% !important;
}

.ossn-hero-section,
.ossn-about-section,
.ossn-cta-section,
.ossn-cta-membership-section,
.ossn-trustbar-section {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* ============================================================
   1. HEADER — ossn-header
   Назначить класс меню-блоку в Tilda
   ============================================================ */
.ossn-header {
  background: var(--ossn-white) !important;
  border-bottom: 1px solid var(--ossn-border) !important;
}

/* Логотип / название */
.ossn-header .t-logo__title,
.ossn-header .t-logo a,
.ossn-header .t-logo__wrapper span {
  font-family: var(--ossn-font) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: var(--ossn-dark) !important;
  letter-spacing: -0.02em !important;
  text-decoration: none !important;
}

/* Пункты меню */
.ossn-header .t-menu__linkcontainer a,
.ossn-header .t-menu__list a,
.ossn-header .t-menu__list-item a {
  font-family: var(--ossn-font) !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  color: var(--ossn-text-2) !important;
  text-decoration: none !important;
  transition: color var(--ossn-transition) !important;
}

.ossn-header .t-menu__linkcontainer a:hover,
.ossn-header .t-menu__list a:hover {
  color: var(--ossn-blue) !important;
}

/* Активный пункт меню */
.ossn-header .t-menu__list-item.t-menu__list-item_active a,
.ossn-header .t-menu__list-item.active a {
  color: var(--ossn-blue) !important;
}

/* Кнопка в хедере */
.ossn-header .t-btn,
.ossn-header .t-menu__btn,
.ossn-header .t-button {
  background: var(--ossn-blue) !important;
  color: var(--ossn-white) !important;
  border: none !important;
  border-radius: 6px !important;
  padding: 10px 20px !important;
  font-family: var(--ossn-font) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  transition: background var(--ossn-transition) !important;
  box-shadow: none !important;
}

.ossn-header .t-btn:hover,
.ossn-header .t-menu__btn:hover {
  background: var(--ossn-dark) !important;
}

/* ============================================================
   2. EVENTS — ossn-events
   Назначить класс блоку с карточками мероприятий
   Рекомендуемый блок: Articles/Cards с 3 колонками

   ПРИМЕЧАНИЕ: классы карточек (.t-cards__item, .t-card и т.д.)
   зависят от типа блока Tilda. После публикации — inspect
   и скорректировать селекторы по необходимости.
   ============================================================ */
.ossn-events {
  background: var(--ossn-bg) !important;
  padding-top: 80px !important;
  padding-bottom: 80px !important;
}

/* Заголовок секции */
.ossn-events .t-title,
.ossn-events .t-section__title,
.ossn-events [class*="__title"]:not([class*="card"]):not([class*="news"]) {
  font-family: var(--ossn-font) !important;
  font-size: 32px !important;
  font-weight: 800 !important;
  color: var(--ossn-text) !important;
  letter-spacing: -0.025em !important;
  line-height: 1.2 !important;
  margin-bottom: 40px !important;
}

/* Подзаголовок секции */
.ossn-events .t-descr,
.ossn-events .t-section__descr {
  font-family: var(--ossn-font) !important;
  font-size: 16px !important;
  color: var(--ossn-muted) !important;
  line-height: 1.6 !important;
  margin-bottom: 40px !important;
}

/* ---- Карточки (BL31-style / Cards) ---- */
.ossn-events .t-cards__col,
.ossn-events .t-col {
  padding: 8px !important;
  box-sizing: border-box !important;
}

/* Карточка: без padding — внутренние элементы управляют отступами */
.ossn-events .t-card,
.ossn-events .t-cards__item,
.ossn-events .t-cards__col > div {
  background: var(--ossn-white) !important;
  border: 1px solid var(--ossn-border) !important;
  border-radius: var(--ossn-radius) !important;
  padding: 0 !important;
  height: 100% !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  transition: box-shadow var(--ossn-transition), transform var(--ossn-transition) !important;
}

.ossn-events .t-card:hover,
.ossn-events .t-cards__item:hover {
  box-shadow: 0 6px 24px rgba(27, 79, 216, 0.12) !important;
  transform: translateY(-2px) !important;
}

/* ---- Тег / дата — цветной блок-шапка карточки (как в Figma) ----
   В поле "Тег" вводить дату: "24–26 апр", "15 мая" и т.д.
   CSS превращает тег в синий заголовочный блок. Работает когда
   у карточки нет Cover-изображения (тег — первый элемент).
   После публикации проверить порядок рендеринга через F12.
   ---------------------------------------------------------------- */
.ossn-events .t-card__tag,
.ossn-events .t-cards__tag,
.ossn-events .t-card__date,
.ossn-events [class*="__tag"] {
  font-family: var(--ossn-font) !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  color: var(--ossn-white) !important;
  background: var(--ossn-blue) !important;
  letter-spacing: -0.03em !important;
  text-transform: none !important;
  padding: 16px 20px 12px !important;
  margin: 0 !important;
  display: block !important;
  line-height: 1.1 !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Заголовок карточки */
.ossn-events .t-card__title,
.ossn-events .t-cards__title,
.ossn-events [class*="__title"][class*="card"] {
  font-family: var(--ossn-font) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: var(--ossn-text) !important;
  line-height: 1.4 !important;
  letter-spacing: -0.01em !important;
  padding: 16px 20px 8px !important;
  margin: 0 !important;
  flex-grow: 0 !important;
}

/* Описание карточки */
.ossn-events .t-card__descr,
.ossn-events .t-cards__descr,
.ossn-events [class*="__descr"][class*="card"] {
  font-family: var(--ossn-font) !important;
  font-size: 14px !important;
  color: var(--ossn-muted) !important;
  line-height: 1.6 !important;
  padding: 0 20px !important;
  flex-grow: 1 !important;
}

/* Ссылка "Подробнее" */
.ossn-events .t-card__link,
.ossn-events .t-cards__link,
.ossn-events .t-btn,
.ossn-events [class*="__link"] {
  font-family: var(--ossn-font) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--ossn-blue) !important;
  text-decoration: none !important;
  background: transparent !important;
  border: none !important;
  padding: 14px 20px 18px !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  box-shadow: none !important;
  transition: color var(--ossn-transition), gap var(--ossn-transition) !important;
}

.ossn-events .t-card__link:hover,
.ossn-events .t-cards__link:hover,
.ossn-events .t-btn:hover {
  color: var(--ossn-dark) !important;
  gap: 8px !important;
}

/* ============================================================
   3. EDUCATION — ossn-education
   Назначить класс блоку с карточками образования
   Рекомендуемый блок: Features / BL31 с иконками
   ============================================================ */
.ossn-education {
  background: var(--ossn-white) !important;
  padding-top: 80px !important;
  padding-bottom: 80px !important;
}

.ossn-education .t-title,
.ossn-education .t-section__title {
  font-family: var(--ossn-font) !important;
  font-size: 32px !important;
  font-weight: 800 !important;
  color: var(--ossn-text) !important;
  letter-spacing: -0.025em !important;
  line-height: 1.2 !important;
  margin-bottom: 40px !important;
}

.ossn-education .t-descr,
.ossn-education .t-section__descr {
  font-family: var(--ossn-font) !important;
  font-size: 16px !important;
  color: var(--ossn-muted) !important;
  line-height: 1.6 !important;
  margin-bottom: 40px !important;
}

.ossn-education .t-card,
.ossn-education .t-cards__item,
.ossn-education .t-cards__col > div {
  background: var(--ossn-white) !important;
  border: 1px solid var(--ossn-border) !important;
  border-radius: var(--ossn-radius) !important;
  padding: 28px 24px !important;
  transition: border-color var(--ossn-transition), box-shadow var(--ossn-transition) !important;
}

.ossn-education .t-card:hover,
.ossn-education .t-cards__item:hover {
  border-color: var(--ossn-blue) !important;
  box-shadow: 0 2px 16px rgba(27, 79, 216, 0.08) !important;
}

/* Иконка */
.ossn-education .t-card__icon,
.ossn-education .t-cards__icon,
.ossn-education .t-cards__icon-block,
.ossn-education [class*="__icon"] {
  width: 44px !important;
  height: 44px !important;
  margin-bottom: 18px !important;
  color: var(--ossn-blue) !important;
}

/* Если Tilda использует img для иконки */
.ossn-education [class*="__icon"] img {
  width: 44px !important;
  height: 44px !important;
  object-fit: contain !important;
  filter: none !important;
}

.ossn-education .t-card__title,
.ossn-education .t-cards__title {
  font-family: var(--ossn-font) !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  color: var(--ossn-text) !important;
  line-height: 1.4 !important;
  margin-bottom: 8px !important;
}

.ossn-education .t-card__descr,
.ossn-education .t-cards__descr {
  font-family: var(--ossn-font) !important;
  font-size: 15px !important;
  color: var(--ossn-muted) !important;
  line-height: 1.65 !important;
}

.ossn-education .t-card__link,
.ossn-education .t-cards__link,
.ossn-education .t-btn {
  font-family: var(--ossn-font) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--ossn-blue) !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  box-shadow: none !important;
  text-decoration: none !important;
  margin-top: 14px !important;
}

/* ============================================================
   4. NEWS — ossn-news
   Назначить класс блоку с новостями
   Рекомендуемый блок: Articles / Blog карточки с датой
   ============================================================ */
.ossn-news {
  background: var(--ossn-bg) !important;
  padding-top: 80px !important;
  padding-bottom: 80px !important;
}

.ossn-news .t-title,
.ossn-news .t-section__title {
  font-family: var(--ossn-font) !important;
  font-size: 32px !important;
  font-weight: 800 !important;
  color: var(--ossn-text) !important;
  letter-spacing: -0.025em !important;
  line-height: 1.2 !important;
  margin-bottom: 40px !important;
}

/* Карточки новостей */
.ossn-news .t-card,
.ossn-news .t-cards__item,
.ossn-news .t-news__item,
.ossn-news .t-records__item {
  background: var(--ossn-white) !important;
  border: 1px solid var(--ossn-border) !important;
  border-radius: var(--ossn-radius) !important;
  overflow: hidden !important;
  transition: box-shadow var(--ossn-transition) !important;
}

.ossn-news .t-card:hover,
.ossn-news .t-news__item:hover {
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08) !important;
}

/* Изображение карточки новости */
.ossn-news .t-card__cover,
.ossn-news .t-news__cover,
.ossn-news [class*="__cover"] img {
  width: 100% !important;
  height: 200px !important;
  object-fit: cover !important;
}

/* Тело карточки */
.ossn-news .t-card__body,
.ossn-news .t-news__bottom,
.ossn-news [class*="__bottom"] {
  padding: 20px !important;
}

/* Дата */
.ossn-news .t-card__date,
.ossn-news .t-card__tag,
.ossn-news .t-news__date,
.ossn-news .t-news__tag,
.ossn-news [class*="__date"],
.ossn-news [class*="__tag"] {
  font-family: var(--ossn-font) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: var(--ossn-muted) !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  margin-bottom: 8px !important;
  display: block !important;
}

/* Заголовок новости */
.ossn-news .t-card__title,
.ossn-news .t-news__title,
.ossn-news [class*="__title"][class*="news"] {
  font-family: var(--ossn-font) !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  color: var(--ossn-text) !important;
  line-height: 1.45 !important;
  letter-spacing: -0.01em !important;
  margin-bottom: 8px !important;
}

/* Описание */
.ossn-news .t-card__descr,
.ossn-news .t-news__descr,
.ossn-news [class*="__descr"][class*="news"] {
  font-family: var(--ossn-font) !important;
  font-size: 15px !important;
  color: var(--ossn-muted) !important;
  line-height: 1.65 !important;
}

/* Ссылка */
.ossn-news .t-card__link,
.ossn-news .t-news__link,
.ossn-news .t-btn {
  font-family: var(--ossn-font) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--ossn-blue) !important;
  text-decoration: none !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  box-shadow: none !important;
  margin-top: 14px !important;
  display: inline-block !important;
}

/* ============================================================
   5. PARTNERS — ossn-partners
   Назначить класс блоку с логотипами
   Рекомендуемый блок: Partners / Logos / Gallery
   ============================================================ */
.ossn-partners {
  background: var(--ossn-white) !important;
  padding-top: 56px !important;
  padding-bottom: 56px !important;
  border-top: 1px solid var(--ossn-border) !important;
  border-bottom: 1px solid var(--ossn-border) !important;
}

.ossn-partners .t-title,
.ossn-partners .t-section__title {
  font-family: var(--ossn-font) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: var(--ossn-light) !important;
  text-align: center !important;
  margin-bottom: 36px !important;
}

/* Логотипы — монохром с hover */
.ossn-partners img,
.ossn-partners .t-gallery__item img,
.ossn-partners .t-partners__item img,
.ossn-partners [class*="__item"] img {
  filter: grayscale(100%) !important;
  opacity: 0.45 !important;
  max-height: 52px !important;
  width: auto !important;
  object-fit: contain !important;
  transition: opacity var(--ossn-transition), filter var(--ossn-transition) !important;
}

.ossn-partners img:hover,
.ossn-partners .t-gallery__item img:hover,
.ossn-partners .t-partners__item img:hover {
  filter: grayscale(0%) !important;
  opacity: 0.85 !important;
}

/* ============================================================
   6. FOOTER — ossn-footer
   Назначить класс footer-блоку
   ============================================================ */
.ossn-footer {
  background: var(--ossn-footer-bg) !important;
}

.ossn-footer,
.ossn-footer * {
  font-family: var(--ossn-font) !important;
}

/* Убрать встроенную верхнюю линию Tilda */
.ossn-footer .t-footer__container,
.ossn-footer .t-footer,
.ossn-footer .t-container {
  border-top: none !important;
  background: transparent !important;
}

/* Заголовки колонок */
.ossn-footer .t-footer__section-title,
.ossn-footer .t-footer__title,
.ossn-footer [class*="footer"][class*="title"] {
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: var(--ossn-white) !important;
  margin-bottom: 16px !important;
}

/* Навигационные ссылки */
.ossn-footer a,
.ossn-footer .t-footer__menu a,
.ossn-footer .t-menu__linkcontainer a {
  color: var(--ossn-light) !important;
  text-decoration: none !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  transition: color var(--ossn-transition) !important;
}

.ossn-footer a:hover {
  color: var(--ossn-white) !important;
}

/* Копирайт */
.ossn-footer .t-footer__copyright,
.ossn-footer [class*="copyright"],
.ossn-footer .t-footer__bottom {
  color: #4B5563 !important;
  font-size: 13px !important;
  border-top: 1px solid rgba(255,255,255,0.07) !important;
  padding-top: 20px !important;
  margin-top: 24px !important;
}

/* ============================================================
   7. ТИПОГРАФИКА ДЛЯ СТАНДАРТНЫХ СЕКЦИЙ
   ============================================================ */

/* Общий контейнер всех ossn-блоков */
[class*="ossn-"] .t-container,
[class*="ossn-"] .t-section__container {
  max-width: 1200px !important;
  box-sizing: border-box !important;
}

/* Кнопки "Показать все" в секциях */
.ossn-events .t-btn_md,
.ossn-news .t-btn_md,
.ossn-education .t-btn_md {
  font-family: var(--ossn-font) !important;
  background: transparent !important;
  color: var(--ossn-blue) !important;
  border: 2px solid var(--ossn-border) !important;
  border-radius: 6px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  padding: 11px 24px !important;
  box-shadow: none !important;
  transition: border-color var(--ossn-transition), color var(--ossn-transition) !important;
}

.ossn-events .t-btn_md:hover,
.ossn-news .t-btn_md:hover,
.ossn-education .t-btn_md:hover {
  border-color: var(--ossn-blue) !important;
}

/* ============================================================
   8. АДАПТИВ
   ============================================================ */

/* Tablet ≤ 960px */
@media (max-width: 960px) {
  .ossn-events,
  .ossn-education,
  .ossn-news {
    padding-top: 64px !important;
    padding-bottom: 64px !important;
  }

  .ossn-events .t-title,
  .ossn-education .t-title,
  .ossn-news .t-title,
  .ossn-events .t-section__title,
  .ossn-education .t-section__title,
  .ossn-news .t-section__title {
    font-size: 26px !important;
  }
}

/* Mobile ≤ 640px */
@media (max-width: 640px) {
  .ossn-events,
  .ossn-education,
  .ossn-news {
    padding-top: 48px !important;
    padding-bottom: 48px !important;
  }

  .ossn-events .t-title,
  .ossn-education .t-title,
  .ossn-news .t-title {
    font-size: 24px !important;
    margin-bottom: 28px !important;
  }

  .ossn-partners {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
  }

  /* Карточки на мобильном — нормальные отступы между */
  .ossn-events .t-cards__col,
  .ossn-education .t-cards__col,
  .ossn-news .t-cards__col,
  .ossn-events .t-col,
  .ossn-education .t-col,
  .ossn-news .t-col {
    padding: 6px 0 !important;
  }
}
</style>