

/* Start:/bitrix/templates/.default/components/bitrix/news/itb_article1_new_style/bitrix/news.detail/.default/style.css?179061990434534*/
/*
 * ITB News Detail / Article — v2 integration-safe
 * Purpose:
 * - one canonical outer shell
 * - no nested 1320px containers inside article
 * - safe inside bitrix:news.detail
 * - no 100vw padding hacks inside article sections
 */

.itb-news-detail-shell,
.itb-news-article {
  --article-text: var(--itb-color-text, #161616);
  --article-muted: var(--itb-color-muted, #6f6f6f);
  --article-accent: var(--itb-color-accent, #dc3545);
  --article-accent-hover: var(--itb-color-accent-hover, #c20f13);
  --article-border: var(--itb-color-border, #e5e5e5);
  --article-surface: var(--itb-color-surface, #fff);
  --article-tint: var(--itb-color-surface-tint, #f7f8fa);
  --article-accent-surface: var(--itb-color-accent-surface, rgba(220, 53, 69, .06));
  --article-radius: var(--itb-radius-md, 12px);
  --article-motion: var(--itb-motion-fast, .16s ease);
  color: var(--article-text);
}

.itb-news-detail-shell *,
.itb-news-detail-shell *::before,
.itb-news-detail-shell *::after,
.itb-news-article *,
.itb-news-article *::before,
.itb-news-article *::after {
  box-sizing: border-box;
}

/* =========================================================
   1. ONE OUTER OWNER OF PAGE GEOMETRY
   ========================================================= */

.itb-news-detail-shell {
  width: min(
    var(--itb-container, 1320px),
    calc(100% - (2 * var(--itb-gutter, clamp(20px, 4.5vw, 65px))))
  );
  margin-inline: auto;
}

/*
 * Use ONLY if the Bitrix component cannot be moved out of an old centered
 * Bootstrap .container/.col wrapper. A structural template fix is preferable.
 */
.itb-news-detail-shell--breakout {
  width: min(
    var(--itb-container, 1320px),
    calc(100vw - (2 * var(--itb-gutter, clamp(20px, 4.5vw, 65px))))
  );
  max-width: none;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  margin-inline: 0;
}

.itb-news-article {
  width: 100%;
  max-width: none;
  margin: 0;
}

/* IMPORTANT: article sections no longer own a second container */
.itb-news-article__intro,
.itb-news-article__facts,
.itb-news-article__section,
.itb-news-article__cta {
  width: 100%;
  max-width: none;
  margin-inline: 0;
}

/* =========================================================
   2. NEWS DETAIL HERO / META
   ========================================================= */

.itb-news-detail__head {
  padding: clamp(42px, 6vw, 76px) 0 clamp(28px, 4vw, 48px);
}

.itb-news-detail__section-label,
.itb-news-article__eyebrow {
  margin-bottom: 14px;
  color: var(--article-muted);
  font-size: var(--itb-eyebrow-size, .74rem);
  font-weight: var(--itb-eyebrow-weight, 700);
  line-height: var(--itb-eyebrow-line-height, 1.6);
  letter-spacing: var(--itb-eyebrow-tracking, .08em);
  text-transform: uppercase;
}

.itb-news-detail__title {
  max-width: 1000px;
  margin: 0 0 22px;
  color: var(--article-text);
  font-size: clamp(40px, 5vw, 60px);
  font-weight: 500;
  line-height: 1.02;
  letter-spacing: -.035em;
}

.itb-news-detail__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  align-items: center;
  margin: 0 0 22px;
  color: var(--article-muted);
  font-size: 14px;
  line-height: 1.5;
}

.itb-news-detail__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 28px;
  padding: 0;
  list-style: none;
}

.itb-news-detail__tags li,
.itb-news-detail__tags li::marker {
  list-style: none;
  content: none;
}

.itb-news-detail__tags a {
  display: inline-flex;
  min-height: 30px;
  align-items: center;
  padding: 5px 10px;
  border: 1px solid var(--article-border);
  border-radius: 999px;
  background: var(--article-surface);
  color: #393939 !important;
  font-size: 12.5px;
  font-weight: 400;
  line-height: 1.3;
  text-decoration: none !important;
  transition:
    color var(--article-motion),
    border-color var(--article-motion),
    background-color var(--article-motion);
}

.itb-news-detail__tags a:hover {
  color: var(--article-accent) !important;
  border-color: rgba(220, 53, 69, .34);
  background: var(--article-accent-surface);
}

.itb-news-detail__cover {
  width: 100%;
  margin: 0 0 clamp(40px, 6vw, 72px);
  overflow: hidden;
  border: 1px solid var(--article-border);
  border-radius: var(--article-radius);
  background: var(--article-tint);
}

.itb-news-detail__cover img,
.itb-news-detail__cover picture,
.itb-news-detail__cover video {
  display: block;
  width: 100%;
  height: auto;
}

/* =========================================================
   3. ARTICLE TYPOGRAPHY
   ========================================================= */

.itb-news-article h2,
.itb-news-article h3,
.itb-news-article p {
  margin-top: 0;
}

.itb-news-article h2 {
  margin-bottom: 20px;
  color: var(--article-text);
  font-size: clamp(32px, 4vw, 50px);
  font-weight: 500;
  line-height: 1.06;
  letter-spacing: -.025em;
}

.itb-news-article h3 {
  margin-bottom: 10px;
  color: var(--article-text);
  font-size: clamp(20px, 2vw, 25px);
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -.012em;
}

.itb-news-article p {
  margin-bottom: 18px;
  font-size: 16px;
  line-height: 1.62;
}

.itb-news-article__measure,
.itb-news-article__section-head {
  max-width: var(--itb-content, 820px);
}

.itb-news-article__measure > p,
.itb-news-article__copy > p,
.itb-news-article__section-head > p,
.itb-news-article__cta-copy > p {
  max-width: var(--itb-reading, 720px);
}

.itb-news-article__lead-title {
  max-width: 820px;
}

.itb-news-article__lead {
  max-width: 780px !important;
  margin-bottom: 24px !important;
  color: #393939;
  font-size: clamp(19px, 2.1vw, 24px) !important;
  line-height: 1.45 !important;
}

/* =========================================================
   4. INTRO / ACTIONS
   ========================================================= */

.itb-news-article__intro {
  padding: 0 0 clamp(48px, 6vw, 78px);
}

.itb-news-article__actions,
.itb-news-article__cta-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px;
  margin-top: 30px;
}

.itb-news-article__button {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  padding: 10px 18px;
  border: 1px solid transparent;
  border-radius: 8px;
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.25;
  text-decoration: none !important;
  transition:
    color var(--article-motion),
    background-color var(--article-motion),
    border-color var(--article-motion),
    transform var(--article-motion);
}

.itb-news-article__button--primary {
  border-color: var(--article-accent);
  background: var(--article-accent);
  color: #fff !important;
}

.itb-news-article__button--primary:hover {
  border-color: var(--article-accent-hover);
  background: var(--article-accent-hover);
  color: #fff !important;
}

.itb-news-article__button--secondary {
  border-color: var(--article-border);
  background: transparent;
  color: var(--article-text) !important;
}

.itb-news-article__button--secondary:hover {
  border-color: #c9c9c9;
  background: #fff;
}

.itb-news-article__action-link {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: var(--article-text) !important;
  font-size: var(--itb-link-size-compact, 14px);
  font-weight: 500;
  text-decoration: none !important;
  transition: color var(--article-motion);
}

.itb-news-article__action-link span {
  transition: transform var(--article-motion);
}

.itb-news-article__action-link:hover {
  color: var(--article-accent) !important;
}

.itb-news-article__action-link:hover span {
  transform: translateX(3px);
}

.itb-news-detail-shell :focus-visible,
.itb-news-article :focus-visible {
  outline: 2px solid var(--article-accent);
  outline-offset: 3px;
}

/* =========================================================
   5. FACTS
   ========================================================= */

.itb-news-article__facts {
  padding: 0 0 clamp(64px, 8vw, 104px);
}

.itb-news-article__facts-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid var(--article-border);
  border-bottom: 0;
}

.itb-news-article__fact {
  min-width: 0;
  padding: 24px 24px 26px 0;
}

.itb-news-article__fact + .itb-news-article__fact {
  padding-left: 24px;
  border-left: 1px solid var(--article-border);
}

.itb-news-article__fact strong,
.itb-news-article__fact span {
  display: block;
}

.itb-news-article__fact strong {
  margin-bottom: 6px;
  font-size: clamp(19px, 2.1vw, 27px);
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: -.025em;
}

.itb-news-article__fact span {
  color: var(--article-muted);
  font-size: 14px;
  line-height: 1.45;
}

/* =========================================================
   6. COMMON SECTIONS
   ========================================================= */

.itb-news-article__section {
  position: relative;
  padding: clamp(48px, 6vw, 76px) 0 clamp(64px, 8vw, 108px);
  border: 0 !important;
}

/*
 * IMPORTANT:
 * Do not put border-top directly on every section.
 * A border on the next section visually sticks to the bottom edge of the
 * previous block (especially after tinted AI/scenario surfaces).
 *
 * Instead, flat editorial sections receive an inset separator INSIDE their
 * own top whitespace. This makes the line belong visually to the current
 * section rather than to the previous one.
 */
.news-detail.itb-news-detail-shell
.itb-news-article__section:not(.itb-news-article__ai):not(.itb-news-article__scenario)::before {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  margin: 0 0 clamp(42px, 5vw, 64px);
  background: var(--article-border, #e5e5e5);
}

/*
 * The first regular section after the article intro/facts can use the same
 * separator rhythm. Special surfaces do not get separators at all.
 */
.news-detail.itb-news-detail-shell
.itb-news-article__section.itb-news-article__ai::before,
.news-detail.itb-news-detail-shell
.itb-news-article__section.itb-news-article__scenario::before {
  content: none !important;
}

/* Balanced spacing for tinted special surfaces (no separator pseudo-element). */
.news-detail.itb-news-detail-shell .itb-news-article__section.itb-news-article__ai,
.news-detail.itb-news-detail-shell .itb-news-article__section.itb-news-article__scenario {
  padding-top: clamp(54px, 7vw, 84px);
  padding-bottom: clamp(54px, 7vw, 84px);
}

/* No separator immediately after a tinted surface: this was the "line glued below" bug. */
.news-detail.itb-news-detail-shell
.itb-news-article__ai + .itb-news-article__section::before,
.news-detail.itb-news-detail-shell
.itb-news-article__scenario + .itb-news-article__section::before {
  content: none !important;
}

.itb-news-article__split {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(280px, .75fr);
  gap: clamp(36px, 6vw, 86px);
  align-items: start;
}

.itb-news-article__split--wide-copy {
  grid-template-columns: minmax(0, 1.7fr) minmax(280px, .65fr);
}

.itb-news-article__aside {
  padding: 26px 0 4px 26px;
  border-left: 2px solid var(--article-border);
}

.itb-news-article__aside--accent {
  border-left-color: var(--article-accent);
}

.itb-news-article__aside-title {
  margin-bottom: 12px !important;
  font-size: clamp(20px, 2vw, 27px) !important;
  font-weight: 500;
  line-height: 1.35 !important;
  letter-spacing: -.018em;
}

.itb-news-article__aside p:last-child {
  margin-bottom: 0;
  color: var(--article-muted);
}

/* =========================================================
   7. FEATURE GRID
   ========================================================= */

.itb-news-article__feature-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: clamp(34px, 5vw, 58px);
  border-top: 1px solid var(--article-border);
}

.itb-news-article__feature {
  padding: 30px 28px 30px 0;
  border-bottom: 1px solid var(--article-border);
}

.itb-news-article__feature:nth-child(3n + 2),
.itb-news-article__feature:nth-child(3n + 3) {
  padding-left: 28px;
  border-left: 1px solid var(--article-border);
}

.itb-news-article__feature-index,
.itb-news-article__practice-grid > div > span,
.itb-news-article__audience > div > span {
  display: block;
  margin-bottom: 20px;
  color: var(--article-muted);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .08em;
}

.itb-news-article__feature p,
.itb-news-article__practice-grid p,
.itb-news-article__audience p {
  margin-bottom: 0;
  color: #393939;
  font-size: 15px;
  line-height: 1.58;
}

/* =========================================================
   8. SCENARIO
   ========================================================= */

/*
 * v2: scenario stays INSIDE the one canonical shell.
 * No 100vw / viewport-based inner padding here.
 */
.itb-news-article__scenario {
  padding-left: clamp(20px, 3vw, 42px);
  padding-right: clamp(20px, 3vw, 42px);
  background: var(--article-tint);
  border: 0 !important;
  border-radius: var(--article-radius);
  box-shadow: none !important;
}

.itb-news-article__flow {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  margin: clamp(38px, 5vw, 58px) 0 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--article-border);
  border-bottom: 1px solid var(--article-border);
}

.itb-news-article__flow li,
.itb-news-article__flow li::marker {
  list-style: none;
}

.itb-news-article__flow li::marker {
  content: none;
}

.itb-news-article__flow li {
  min-width: 0;
  padding: 26px 22px 28px 0;
}

.itb-news-article__flow li + li {
  padding-left: 22px;
  border-left: 1px solid var(--article-border);
}

.itb-news-article__flow-number {
  display: block;
  margin-bottom: 28px;
  color: var(--article-accent);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .08em;
}

.itb-news-article__flow strong,
.itb-news-article__flow small {
  display: block;
}

.itb-news-article__flow strong {
  margin-bottom: 7px;
  font-size: 15px;
  line-height: 1.35;
}

.itb-news-article__flow small {
  color: var(--article-muted);
  font-size: 13px;
  line-height: 1.45;
}

/* =========================================================
   9. MODULES
   ========================================================= */

.itb-news-article__modules {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: clamp(36px, 6vw, 86px);
  margin: 38px 0 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--article-border);
}

.itb-news-article__modules li,
.itb-news-article__modules li::marker {
  list-style: none;
}

.itb-news-article__modules li::marker {
  content: none;
}

.itb-news-article__modules li {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr);
  align-items: baseline;
  gap: 10px;
  padding: 17px 0;
  border-bottom: 1px solid var(--article-border);
}

.itb-news-article__modules span {
  color: var(--article-muted);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .06em;
}

.itb-news-article__modules strong {
  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
}

/* =========================================================
   10. PRACTICE / AUDIENCE
   ========================================================= */

.itb-news-article__practice-grid,
.itb-news-article__audience {
  display: grid;
  margin-top: clamp(34px, 5vw, 58px);
  border-top: 1px solid var(--article-border);
  border-bottom: 1px solid var(--article-border);
}

.itb-news-article__practice-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.itb-news-article__audience {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.itb-news-article__practice-grid > div,
.itb-news-article__audience > div {
  padding: 26px 26px 30px 0;
}

.itb-news-article__practice-grid > div + div,
.itb-news-article__audience > div + div {
  padding-left: 26px;
  border-left: 1px solid var(--article-border);
}

/* =========================================================
   11. LEARNING CHECKLIST
   ========================================================= */

/*
 * Legacy-safe checklist.
 * The global site has Font Awesome ::marker rules, therefore this component
 * explicitly removes native/global markers and draws only its own check icon.
 */
.news-detail.itb-news-detail-shell .itb-news-article__checklist {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: clamp(36px, 6vw, 86px);
  margin: 38px 0 0;
  padding: 0 !important;
  list-style: none !important;
  border-top: 1px solid var(--article-border);
}

.news-detail.itb-news-detail-shell .itb-news-article__checklist > li {
  position: relative;
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  margin: 0 !important;
  padding: 17px 0 !important;
  list-style: none !important;
  border-bottom: 1px solid var(--article-border);
  color: var(--article-text);
  font-size: 15px;
  line-height: 1.5;
}

/* Remove ALL native / legacy markers, including global Font Awesome marker rules. */
.news-detail.itb-news-detail-shell .itb-news-article__checklist > li::marker {
  content: none !important;
  font-family: inherit !important;
  font-size: 0 !important;
}

/* Own semantic checkmark. It participates in the grid instead of absolute positioning. */
.news-detail.itb-news-detail-shell .itb-news-article__checklist > li::before {
  content: "✓" !important;
  position: static !important;
  display: block;
  width: 18px;
  color: var(--article-accent);
  font-family: inherit !important;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.5;
}

/* Prevent a "stuck" line at the very bottom of the two-column checklist. */
.news-detail.itb-news-detail-shell .itb-news-article__checklist > li:nth-last-child(-n + 2) {
  border-bottom: 0;
}

/* =========================================================
   12. AI
   ========================================================= */

.itb-news-article__ai {
  /*
   * Special editorial surface.
   * No outer border: legacy/global section borders created a visible line
   * glued to the bottom edge of this block.
   */
  padding-left: clamp(20px, 3vw, 42px);
  padding-right: clamp(20px, 3vw, 42px);
  background: var(--article-accent-surface);
  border: 0 !important;
  border-radius: var(--article-radius);
  box-shadow: none !important;
}

/* =========================================================
   13. FINAL CTA
   ========================================================= */

.itb-news-article__cta {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, .65fr);
  gap: clamp(36px, 6vw, 86px);
  align-items: end;
  margin-top: clamp(20px, 4vw, 48px);
  margin-bottom: clamp(56px, 8vw, 104px);
  padding-top: clamp(54px, 7vw, 84px);
  padding-bottom: clamp(54px, 7vw, 84px);
  border-top: 1px solid var(--article-border);
  border-bottom: 1px solid var(--article-border);
}

.itb-news-article__cta-actions {
  flex-direction: column;
  align-items: stretch;
  margin-top: 0;
}

.itb-news-article__cta-actions .itb-news-article__button {
  width: 100%;
}

/* =========================================================
   14. TABLET
   ========================================================= */

@media (max-width: 1023px) {
  .itb-news-article__facts-grid,
  .itb-news-article__feature-grid,
  .itb-news-article__practice-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .itb-news-article__fact:nth-child(3) {
    padding-left: 0;
    border-left: 0;
    border-top: 1px solid var(--article-border);
  }

  .itb-news-article__fact:nth-child(4) {
    border-top: 1px solid var(--article-border);
  }

  .itb-news-article__feature:nth-child(3n + 2),
  .itb-news-article__feature:nth-child(3n + 3) {
    padding-left: 0;
    border-left: 0;
  }

  .itb-news-article__feature:nth-child(even) {
    padding-left: 26px;
    border-left: 1px solid var(--article-border);
  }

  .itb-news-article__flow {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .itb-news-article__flow li:nth-child(4) {
    padding-left: 0;
    border-left: 0;
    border-top: 1px solid var(--article-border);
  }

  .itb-news-article__flow li:nth-child(5),
  .itb-news-article__flow li:nth-child(6) {
    border-top: 1px solid var(--article-border);
  }

  .itb-news-article__cta {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .itb-news-article__cta-actions {
    max-width: 420px;
  }
}

/* =========================================================
   15. MOBILE
   ========================================================= */

@media (max-width: 767px) {
  .news-detail.itb-news-detail-shell
  .itb-news-article__section:not(.itb-news-article__ai):not(.itb-news-article__scenario)::before {
    margin-bottom: 34px;
  }

  .itb-news-detail-shell {
    width: calc(100% - 40px);
  }

  .itb-news-detail-shell--breakout {
    width: calc(100vw - 40px);
  }

  .itb-news-detail__head {
    padding-top: 34px;
  }

  .itb-news-detail__title {
    font-size: clamp(34px, 10vw, 44px);
    letter-spacing: -.03em;
  }

  .itb-news-article h2 {
    font-size: clamp(29px, 9vw, 38px);
  }

  .itb-news-article__split,
  .itb-news-article__split--wide-copy {
    grid-template-columns: 1fr;
    gap: 34px;
  }

  .itb-news-article__aside {
    padding: 22px 0 0;
    border-top: 2px solid var(--article-border);
    border-left: 0;
  }

  .itb-news-article__aside--accent {
    border-top-color: var(--article-accent);
  }

  .itb-news-article__facts-grid,
  .itb-news-article__feature-grid,
  .itb-news-article__practice-grid,
  .itb-news-article__audience,
  .itb-news-article__modules,
  .itb-news-article__checklist,
  .itb-news-article__flow {
    grid-template-columns: 1fr;
  }

  .itb-news-article__fact,
  .itb-news-article__fact + .itb-news-article__fact,
  .itb-news-article__fact:nth-child(3),
  .itb-news-article__fact:nth-child(4) {
    padding: 18px 0;
    border-left: 0;
    border-top: 1px solid var(--article-border);
  }

  .itb-news-article__facts-grid .itb-news-article__fact:first-child {
    border-top: 0;
  }

  .itb-news-article__feature,
  .itb-news-article__feature:nth-child(3n + 2),
  .itb-news-article__feature:nth-child(3n + 3),
  .itb-news-article__feature:nth-child(even) {
    padding: 24px 0;
    border-left: 0;
  }

  .itb-news-article__flow li,
  .itb-news-article__flow li + li,
  .itb-news-article__flow li:nth-child(4) {
    padding: 22px 0;
    border-left: 0;
    border-top: 1px solid var(--article-border);
  }

  .itb-news-article__flow li:first-child {
    border-top: 0;
  }

  .itb-news-article__flow-number {
    margin-bottom: 12px;
  }

  .itb-news-article__practice-grid > div,
  .itb-news-article__practice-grid > div + div,
  .itb-news-article__audience > div,
  .itb-news-article__audience > div + div {
    padding: 24px 0;
    border-left: 0;
    border-top: 1px solid var(--article-border);
  }

  .itb-news-article__practice-grid > div:first-child,
  .itb-news-article__audience > div:first-child {
    border-top: 0;
  }

  .itb-news-article__actions {
    align-items: flex-start;
  }

  .itb-news-article__cta-actions {
    max-width: none;
  }

  .itb-news-article__scenario,
  .itb-news-article__ai {
    padding-left: 20px;
    padding-right: 20px;
  }
}

/* =========================================================
   16. REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
  .itb-news-detail-shell *,
  .itb-news-detail-shell *::before,
  .itb-news-detail-shell *::after,
  .itb-news-article *,
  .itb-news-article *::before,
  .itb-news-article *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}

/* ADD TO news.detail/style.css AFTER itb-news-article v2 */

/* Preview / lead */
.itb-news-detail__lead {
  max-width: var(--itb-content, 820px);
  margin: 0 0 30px;
  color: #393939;
  font-size: clamp(18px, 2vw, 22px);
  line-height: 1.5;
}

/* Picture author */
.itb-news-detail__cover-caption {
  padding: 10px 14px;
  border-top: 1px solid var(--article-border, #e5e5e5);
  color: var(--article-muted, #6f6f6f);
  font-size: 12px;
  line-height: 1.45;
}

/* Share */
.itb-news-detail__share {
  margin-top: 22px;
}

/* Detail body */
.itb-news-detail__body {
  width: 100%;
}

/* Paged article */
.itb-news-detail__pager {
  margin: 24px 0;
}

/* Optional element properties */
.itb-news-detail__properties {
  display: grid;
  gap: 0;
  margin: clamp(42px, 6vw, 72px) 0 0;
  border-top: 1px solid var(--article-border, #e5e5e5);
}

.itb-news-detail__property {
  display: grid;
  grid-template-columns: minmax(180px, .35fr) minmax(0, 1fr);
  gap: 24px;
  padding: 15px 0;
  border-bottom: 1px solid var(--article-border, #e5e5e5);
  font-size: 14px;
  line-height: 1.5;
}

.itb-news-detail__property strong {
  font-weight: 600;
}

.itb-news-detail__property span {
  color: var(--article-muted, #6f6f6f);
}

/* Existing social-groups advertising component */
.itb-news-detail__social-banner {
  margin-top: clamp(42px, 6vw, 72px);
}

/* Previous / next */
.itb-news-detail__navigation {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(24px, 4vw, 48px);
  margin: clamp(54px, 7vw, 92px) 0 clamp(54px, 7vw, 92px);
  padding-top: 28px;
  border-top: 1px solid var(--article-border, #e5e5e5);
}

.itb-news-detail__navigation-item {
  min-width: 0;
}

.itb-news-detail__navigation-item--next {
  text-align: right;
}

.itb-news-detail__navigation-item .itb-news-article__action-link {
  width: 100%;
  align-items: flex-start;
}

.itb-news-detail__navigation-item--next .itb-news-article__action-link {
  justify-content: flex-end;
}

.itb-news-detail__navigation-copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 5px;
}

.itb-news-detail__navigation-copy small {
  color: var(--article-muted, #6f6f6f);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.3;
}

.itb-news-detail__navigation-copy strong {
  color: inherit;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
}

/*
 * Protect the new detail component from the old global
 * "text-align: justify" behavior.
 */
.news-detail.itb-news-detail-shell {
  text-align: left;
}

@media (max-width: 767px) {
  .itb-news-detail__property {
    grid-template-columns: 1fr;
    gap: 5px;
  }

  .itb-news-detail__navigation {
    grid-template-columns: 1fr;
  }

  .itb-news-detail__navigation-item--next {
    text-align: left;
  }

  .itb-news-detail__navigation-item--next .itb-news-article__action-link {
    justify-content: flex-start;
  }
}

/*
 * HOTFIX for bitrix:news.detail new editorial layout
 * Append AFTER the current news.detail/style.css
 * Purpose: neutralize legacy list markers without touching the rest of the site.
 */

/* 1) Tags */
.news-detail.itb-news-detail-shell .itb-news-detail__tags,
.news-detail.itb-news-detail-shell .itb-news-detail__tags > li {
    list-style: none !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
}

.news-detail.itb-news-detail-shell .itb-news-detail__tags > li::marker {
    content: none !important;
    font-family: inherit !important;
    font-size: 0 !important;
}

/* 2) Scenario flow */
.news-detail.itb-news-detail-shell .itb-news-article__flow,
.news-detail.itb-news-detail-shell .itb-news-article__flow > li {
    list-style: none !important;
}

.news-detail.itb-news-detail-shell .itb-news-article__flow > li::marker {
    content: none !important;
    font-family: inherit !important;
    font-size: 0 !important;
}

/* 3) Course modules */
.news-detail.itb-news-detail-shell .itb-news-article__modules,
.news-detail.itb-news-detail-shell .itb-news-article__modules > li {
    list-style: none !important;
}

.news-detail.itb-news-detail-shell .itb-news-article__modules > li::marker {
    content: none !important;
    font-family: inherit !important;
    font-size: 0 !important;
}

/* 4) Learning checklist — keep our own ✓ from ::before, remove only browser/global marker */
.news-detail.itb-news-detail-shell .itb-news-article__checklist,
.news-detail.itb-news-detail-shell .itb-news-article__checklist > li {
    list-style: none !important;
}

.news-detail.itb-news-detail-shell .itb-news-article__checklist > li::marker {
    content: none !important;
    font-family: inherit !important;
    font-size: 0 !important;
}

/* 5) Defensive reset for any future semantic lists inside the redesigned article.
   This intentionally affects ONLY ::marker and does not remove custom ::before icons. */
.news-detail.itb-news-detail-shell .itb-news-article ul > li::marker,
.news-detail.itb-news-detail-shell .itb-news-article ol > li::marker {
    content: none !important;
    font-family: inherit !important;
    font-size: 0 !important;
}

/* 6) Keep all redesigned article/list text aligned normally even if legacy news CSS says justify */
.news-detail.itb-news-detail-shell,
.news-detail.itb-news-detail-shell .itb-news-article,
.news-detail.itb-news-detail-shell .itb-news-article li {
    text-align: left;
}

/* =========================================================
   17. LEGACY ISOLATION / ASIDE HOTFIX
   ========================================================= */

/*
 * Legacy site styles may leak background/color into semantic <aside> blocks.
 * Keep the new editorial aside intentionally flat and neutral.
 */
.news-detail.itb-news-detail-shell .itb-news-article__aside {
  background: transparent !important;
  background-color: transparent !important;
  color: var(--article-text, #161616) !important;

  border-top: 0;
  border-right: 0;
  border-bottom: 0;
  border-left: 2px solid var(--article-border, #e5e5e5);

  border-radius: 0 !important;
  box-shadow: none !important;

  padding: 26px 0 4px 26px;
}

.news-detail.itb-news-detail-shell
.itb-news-article__aside
.itb-news-article__eyebrow {
  color: var(--article-muted, #6f6f6f) !important;
  background: transparent !important;
  background-color: transparent !important;
}

.news-detail.itb-news-detail-shell
.itb-news-article__aside-title {
  color: var(--article-text, #161616) !important;
  background: transparent !important;
  background-color: transparent !important;
}

.news-detail.itb-news-detail-shell
.itb-news-article__aside p {
  background: transparent !important;
  background-color: transparent !important;
}

.news-detail.itb-news-detail-shell
.itb-news-article__aside p:last-child {
  color: var(--article-muted, #6f6f6f) !important;
}

.news-detail.itb-news-detail-shell
.itb-news-article__aside--accent {
  border-left-color: var(--article-accent, #dc3545);
}

/*
 * Defensive background reset for typography inside the redesigned article.
 * Do not force a universal text color here, so muted/accent states keep working.
 */
.news-detail.itb-news-detail-shell .itb-news-article,
.news-detail.itb-news-detail-shell .itb-news-article p,
.news-detail.itb-news-detail-shell .itb-news-article h2,
.news-detail.itb-news-detail-shell .itb-news-article h3,
.news-detail.itb-news-detail-shell .itb-news-article strong,
.news-detail.itb-news-detail-shell .itb-news-article small {
  background-color: transparent;
}

/* Re-assert intentional section surfaces after the defensive reset */
.news-detail.itb-news-detail-shell .itb-news-article__scenario {
  background: var(--article-tint, #f7f8fa);
}

.news-detail.itb-news-detail-shell .itb-news-article__ai {
  background: var(--article-accent-surface, rgba(220, 53, 69, .06));
}

@media (max-width: 767px) {
  .news-detail.itb-news-detail-shell .itb-news-article__aside {
    padding: 22px 0 0;
    border-left: 0;
    border-top: 2px solid var(--article-border, #e5e5e5);
  }

  .news-detail.itb-news-detail-shell
  .itb-news-article__aside--accent {
    border-top-color: var(--article-accent, #dc3545);
  }
}



/* =========================================================
   PRESS ARTICLE — ONLY ADDITIONS TO THE CANONICAL NEWS CSS
   The article HTML already uses .itb-news-article__* classes.
   Do not load the old standalone itb-content-article CSS together
   with this file — it has different geometry and negative margins.
   ========================================================= */

/* The extra class is semantic only. Geometry is owned by
   .news-detail.itb-news-detail-shell exactly as on /about/news/. */
.news-detail.itb-news-detail-shell .itb-content-article {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0;
  font-family: inherit;
  text-align: left;
}

/* The restored press template used inline justify before.
   The wrapper class replacement removes it, but keep this defensive rule. */
.news-detail.itb-news-detail-shell,
.news-detail.itb-news-detail-shell p,
.news-detail.itb-news-detail-shell li {
  text-align: left;
}

/* Embedded Workshop / article video. */
.news-detail.itb-news-detail-shell .itb-content-article__video {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  margin-top: clamp(28px, 4vw, 48px);
  background: #111;
  border: 1px solid var(--article-border, #e5e5e5);
  border-radius: var(--article-radius, 12px);
}

.news-detail.itb-news-detail-shell .itb-content-article__video iframe {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}

/* Legacy press header elements are kept because the working Bitrix
   template must remain intact. These rules only align their rhythm. */
.news-detail.itb-news-detail-shell > .detail_picture {
  display: block;
  width: 100%;
  height: auto;
}

.news-detail.itb-news-detail-shell > h2 {
  max-width: 1000px;
  margin: clamp(26px, 4vw, 48px) 0 22px;
  color: var(--article-text, #161616);
  font-size: clamp(40px, 5vw, 60px);
  font-weight: 500;
  line-height: 1.02;
  letter-spacing: -.035em;
}

.news-detail.itb-news-detail-shell .news-date-time {
  color: var(--article-muted, #6f6f6f);
  font-size: 14px;
  line-height: 1.5;
}

/* IMPORTANT:
   Neutralize the old standalone article rules if that stylesheet happens
   to remain cached for one request. These selectors specifically remove
   the two width-expanding negative margins that made press look wider. */
.news-detail.itb-news-detail-shell
.itb-content-article .itb-news-article__scenario,
.news-detail.itb-news-detail-shell
.itb-content-article .itb-news-article__ai {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Same mobile geometry as canonical news detail. */
@media (max-width: 767px) {
  .news-detail.itb-news-detail-shell .itb-content-article__video {
    border-radius: 8px;
  }
}

/* End */


/* Start:/bitrix/templates/.default/components/bitrix/main.share/.default/style.min.css?15760092981293*/
a.share-switch{display:block;width:20px;height:20px;background:scroll transparent url('/bitrix/templates/.default/components/bitrix/main.share/.default/images/share.gif') center center no-repeat}.share-window-parent{position:relative}table.bookmarks-table{padding:0;height:19px;// height:18px}.share-dialog{z-index:1000;position:absolute;top:0}.share-dialog-left{left:18px}.share-dialog-right{right:18px}.share-dialog-inner-left{background:scroll transparent url('/bitrix/templates/.default/components/bitrix/main.share/.default/images/background.gif') right center no-repeat;padding:0 1px 1px 4px;// padding:1px 1px 1px 4px}.share-dialog-inner-right{background:scroll transparent url('/bitrix/templates/.default/components/bitrix/main.share/.default/images/background-right.gif') left center no-repeat;padding:0 4px 1px 1px;// padding:1px 4px 1px 1px}td.bookmarks{padding-left:2px!important;padding-right:2px!important;padding-top:1px!important;padding-bottom:0!important;border:none!important}.bookmarks a{background:none no-repeat scroll center center transparent;display:block;width:16px;height:16px;overflow:hidden}.bookmarks a.vk{background-image:url('/bitrix/templates/.default/components/bitrix/main.share/.default/images/vk.gif')}.bookmarks a.facebook{background-image:url('/bitrix/templates/.default/components/bitrix/main.share/.default/images/facebook.gif')}.bookmarks a.twitter{background-image:url('/bitrix/templates/.default/components/bitrix/main.share/.default/images/twitter.gif')}.bookmarks a.delicious{background-image:url('/bitrix/templates/.default/components/bitrix/main.share/.default/images/delicious.gif')}.bookmarks a.lj{background-image:url('/bitrix/templates/.default/components/bitrix/main.share/.default/images/lj.gif')}.bookmarks a.mailru{background-image:url('/bitrix/templates/.default/components/bitrix/main.share/.default/images/mailru.gif')}
/* End */
/* /bitrix/templates/.default/components/bitrix/news/itb_article1_new_style/bitrix/news.detail/.default/style.css?179061990434534 */
/* /bitrix/templates/.default/components/bitrix/main.share/.default/style.min.css?15760092981293 */
