/**
 * Стили собственных секций AB. Цвета и отступы берут токены темы.
 */

.site-front,
.ab-content {
  width: 100%;
  max-width: none;
}

body.home.page .site-main {
  padding: 0;
}

/* Обычные блоки в потоке Gutenberg: контейнер темы.
   AB-секции сами задают ширину (по умолчанию на всю ширину потока). */
.ab-content > *:not(.alignwide):not(.alignfull):not(.ab-hero):not(.ab-posts):not(.ab-section):not(.ab-banner),
.site-front > *:not(.alignwide):not(.alignfull):not(.ab-hero):not(.ab-posts):not(.ab-section):not(.ab-banner) {
  width: min(100% - (var(--ab-pad-x) * 2), var(--ab-container-width));
  max-width: 100%;
  margin-inline: auto;
}

.ab-content > .alignwide,
.site-front > .alignwide {
  width: min(100% - (var(--ab-pad-x) * 2), var(--ab-wide-width));
  max-width: 100%;
  margin-inline: auto;
}

/* Фон секции на всю ширину родителя (viewport у landing). Без 100vw — без горизонтального скролла. */
.ab-content > .alignfull,
.site-front > .alignfull {
  width: 100%;
  max-width: none;
  margin-inline: 0;
}

.ab-hero,
.ab-posts,
.ab-section,
.ab-banner {
  width: 100%;
  max-width: none;
}

/* Wide секции — уже контейнера темы, но не на весь viewport. */
.ab-content > .ab-hero.alignwide,
.site-front > .ab-hero.alignwide {
  width: min(100% - (var(--ab-pad-x) * 2), var(--ab-wide-width));
  max-width: 100%;
  margin-inline: auto;
}

/* Full width — явно на всю ширину потока Gutenberg. */
.ab-content > .ab-hero.alignfull,
.site-front > .ab-hero.alignfull {
  width: 100%;
  max-width: none;
  margin-inline: 0;
}

.ab-posts__inner,
.ab-section--width-container > .ab-section__inner {
  width: min(100% - (var(--ab-pad-x) * 2), var(--ab-container-width));
  margin-inline: auto;
}

.ab-section--width-wide > .ab-section__inner {
  width: min(100% - (var(--ab-pad-x) * 2), var(--ab-wide-width));
  margin-inline: auto;
}

.ab-section--width-full > .ab-section__inner {
  width: 100%;
  padding-inline: var(--ab-pad-x);
}

/* Hero */

.ab-hero {
  position: relative;
  isolation: isolate;
  padding-block: 50px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}

.ab-hero:not(.has-background) {
  background-color: var(--ab-color-background);
}

.ab-hero--has-overlay::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-color: var(--ab-hero-overlay-color, #000);
  opacity: var(--ab-hero-overlay-opacity, 0.4);
}

.ab-hero__inner {
  position: relative;
  z-index: 1;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 40px;
  box-sizing: border-box;
  width: min(100%, var(--ab-container-width));
  max-width: 100%;
  margin-inline: auto;
  padding-inline: var(--ab-pad-x);
}

.ab-hero--content-theme > .ab-hero__inner {
  width: min(100%, var(--wp--style--global--content-size, var(--ab-container-width)));
}

.ab-hero--content-narrow > .ab-hero__inner {
  width: min(100%, var(--ab-narrow-width));
}

.ab-hero--content-container > .ab-hero__inner {
  width: min(100%, var(--ab-container-width));
}

.ab-hero--content-wide > .ab-hero__inner {
  width: min(100%, var(--ab-wide-width));
}

.ab-hero--content-full > .ab-hero__inner {
  width: 100%;
}

.ab-hero--content-custom > .ab-hero__inner {
  width: min(100%, var(--ab-hero-inner-max, var(--ab-container-width)));
}

.ab-hero--height-min,
.ab-hero--height-fullscreen {
  display: flex;
  flex-direction: column;
}

.ab-hero--height-min.ab-hero--valign-top,
.ab-hero--height-fullscreen.ab-hero--valign-top {
  justify-content: flex-start;
}

.ab-hero--height-min.ab-hero--valign-center,
.ab-hero--height-fullscreen.ab-hero--valign-center {
  justify-content: center;
}

.ab-hero--height-min.ab-hero--valign-bottom,
.ab-hero--height-fullscreen.ab-hero--valign-bottom {
  justify-content: flex-end;
}

.ab-hero--valign-top .ab-hero__inner {
  align-items: flex-start;
}

.ab-hero--valign-center .ab-hero__inner {
  align-items: center;
}

.ab-hero--valign-bottom .ab-hero__inner {
  align-items: flex-end;
}

.ab-hero--image-left .ab-hero__inner {
  flex-direction: row-reverse;
}

.ab-hero--image-none .ab-hero__content,
.ab-hero--image-overlay .ab-hero__content {
  width: 100%;
  flex: 1 1 100%;
}

.ab-hero--image-overlay.ab-hero--valign-top .ab-hero__inner,
.ab-hero--image-overlay.ab-hero--valign-center .ab-hero__inner,
.ab-hero--image-overlay.ab-hero--valign-bottom .ab-hero__inner {
  display: flex;
}

.ab-hero--align-center .ab-hero__content {
  text-align: center;
}

.ab-hero--align-right .ab-hero__content {
  text-align: right;
}

.ab-hero__content,
.ab-hero__media {
  flex: 1 1 280px;
  min-width: 0;
}

.ab-hero--media-small .ab-hero__media {
  flex: 0 1 28%;
}

.ab-hero--media-medium .ab-hero__media {
  flex: 0 1 42%;
}

.ab-hero--media-large .ab-hero__media {
  flex: 0 1 52%;
}

.ab-hero--media-valign-top .ab-hero__media {
  align-self: flex-start;
}

.ab-hero--media-valign-center .ab-hero__media {
  align-self: center;
}

.ab-hero--media-valign-bottom .ab-hero__media {
  align-self: flex-end;
}

.ab-hero__kicker {
  margin: 0 0 12px;
  color: var(--ab-color-burgundy);
  font-family: var(--ab-font-heading);
  font-size: clamp(0.95rem, 0.4vw + 0.85rem, 1.25rem);
  font-weight: 600;
  max-width: 100%;
  overflow-wrap: anywhere;
}

.ab-hero.has-text-color .ab-hero__kicker,
.ab-hero.has-text-color .ab-hero__title,
.ab-hero.has-text-color .ab-hero__text {
  color: inherit;
}

.ab-hero__title {
  margin: 0 0 16px;
  font-size: clamp(1.75rem, 4vw, 2.75rem);
  max-width: 100%;
  overflow-wrap: anywhere;
}

.ab-hero__text {
  margin: 0 0 24px;
  max-width: 100%;
  overflow-wrap: anywhere;
}

.ab-hero__text p:first-child {
  margin-top: 0;
}

.ab-hero__text p:last-child {
  margin-bottom: 0;
}

/* Отдельные цвета элементов (если заданы) */
.ab-hero.ab-hero--has-kicker-color .ab-hero__kicker {
  color: var(--ab-hero-kicker-color);
}

.ab-hero.ab-hero--has-heading-color .ab-hero__title {
  color: var(--ab-hero-heading-color);
}

.ab-hero.ab-hero--has-body-color .ab-hero__text {
  color: var(--ab-hero-body-color);
}

/* Типографика элементов */
.ab-hero--has-kicker-ff .ab-hero__kicker {
  font-family: var(--ab-hero-kicker-ff);
}

.ab-hero--has-kicker-fs .ab-hero__kicker {
  /* Desktop: заданный размер; на узком экране — не шире ~11.5vw. */
  font-size: min(var(--ab-hero-kicker-fs), 11.5vw);
}

.ab-hero--has-kicker-fw .ab-hero__kicker {
  font-weight: var(--ab-hero-kicker-fw);
}

.ab-hero--has-kicker-lh .ab-hero__kicker {
  line-height: var(--ab-hero-kicker-lh);
}

.ab-hero--has-kicker-ls .ab-hero__kicker {
  letter-spacing: var(--ab-hero-kicker-ls);
}

.ab-hero--has-kicker-shadow .ab-hero__kicker {
  text-shadow: var(--ab-hero-kicker-shadow);
}

.ab-hero--has-heading-ff .ab-hero__title {
  font-family: var(--ab-hero-heading-ff);
}

.ab-hero--has-heading-fs .ab-hero__title {
  font-size: min(var(--ab-hero-heading-fs), 11.5vw);
}

.ab-hero--has-heading-fw .ab-hero__title {
  font-weight: var(--ab-hero-heading-fw);
}

.ab-hero--has-heading-lh .ab-hero__title {
  line-height: var(--ab-hero-heading-lh);
}

.ab-hero--has-heading-ls .ab-hero__title {
  letter-spacing: var(--ab-hero-heading-ls);
}

.ab-hero--has-heading-shadow .ab-hero__title {
  text-shadow: var(--ab-hero-heading-shadow);
}

.ab-hero--has-text-ff .ab-hero__text {
  font-family: var(--ab-hero-text-ff);
}

.ab-hero--has-text-fs .ab-hero__text {
  font-size: min(var(--ab-hero-text-fs), 11.5vw);
}

.ab-hero--has-text-fw .ab-hero__text {
  font-weight: var(--ab-hero-text-fw);
}

.ab-hero--has-text-lh .ab-hero__text {
  line-height: var(--ab-hero-text-lh);
}

.ab-hero--has-text-shadow .ab-hero__text {
  text-shadow: var(--ab-hero-text-shadow);
}

.ab-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 16px;
}

.ab-hero--align-center .ab-hero__actions {
  justify-content: center;
}

.ab-hero--align-right .ab-hero__actions {
  justify-content: flex-end;
}

.ab-hero__button {
  display: inline-block;
  padding: 14px 24px;
  border-radius: 3px;
  font-family: var(--ab-font-text);
  font-size: 18px;
  font-weight: 400;
  line-height: 1.2;
  text-decoration: none;
  max-width: 100%;
  box-sizing: border-box;
}

.ab-hero__button--primary {
  color: var(--ab-color-highlight);
  background: var(--ab-color-burgundy);
}

.ab-hero__button--primary:hover,
.ab-hero__button--primary:focus-visible {
  color: var(--ab-color-burgundy);
  background: var(--ab-color-highlight);
}

.ab-hero__button--secondary {
  color: var(--ab-color-burgundy);
  background: transparent;
  box-shadow: inset 0 0 0 1px var(--ab-color-burgundy);
}

.ab-hero__button--secondary:hover,
.ab-hero__button--secondary:focus-visible {
  color: var(--ab-color-heading);
  background: var(--ab-color-highlight);
  box-shadow: none;
}

.ab-hero__button--outline {
  color: currentColor;
  background: transparent;
  box-shadow: inset 0 0 0 1px currentColor;
}

.ab-hero__button--outline:hover,
.ab-hero__button--outline:focus-visible {
  color: var(--ab-color-burgundy);
  background: var(--ab-color-highlight);
  box-shadow: none;
}

.ab-hero__button--text {
  padding-inline: 4px;
  color: currentColor;
  background: transparent;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ab-hero__button--text:hover,
.ab-hero__button--text:focus-visible {
  color: var(--ab-color-burgundy);
}

.ab-hero__image {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  border-radius: var(--ab-radius-md);
  object-fit: cover;
}

.ab-hero--radius-none .ab-hero__image {
  border-radius: 0;
}

.ab-hero--radius-sm .ab-hero__image {
  border-radius: var(--ab-radius-sm);
}

.ab-hero--radius-md .ab-hero__image {
  border-radius: var(--ab-radius-md);
}

.ab-hero--radius-lg .ab-hero__image {
  border-radius: var(--ab-radius-lg);
}

.ab-hero--fit-cover .ab-hero__image {
  object-fit: cover;
}

.ab-hero--fit-contain .ab-hero__image {
  object-fit: contain;
}

.ab-hero__placeholder,
.ab-banner__placeholder {
  padding: 40px 20px;
  color: var(--ab-color-text);
  background: #f6f6f6;
  border: 1px dashed var(--ab-color-border);
  border-radius: var(--ab-radius-md);
  text-align: center;
}


/* Banner */

.ab-banner {
  padding-block: 20px;
}

.ab-banner--align-left {
  text-align: left;
}

.ab-banner--align-center {
  text-align: center;
}

.ab-banner--align-right {
  text-align: right;
}

.ab-banner__link,
.ab-banner__image {
  display: inline-block;
  max-width: 100%;
}

.ab-banner__image {
  height: auto;
  border-radius: var(--ab-radius-sm);
}

/* Posts */

.ab-posts {
  padding-block: 50px;
}

.ab-posts__heading {
  margin: 0 0 32px;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: -0.5px;
}

.ab-posts__grid {
  display: grid;
  gap: 20px;
  grid-template-columns: 1fr;
}

.ab-posts--cols-2 .ab-posts__grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ab-posts--cols-3 .ab-posts__grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.ab-posts__card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 20px;
  background: var(--ab-color-background);
  border-radius: var(--ab-radius-lg);
  box-shadow: 0 4px 44px 0 rgba(0, 0, 0, 0.1);
}

.ab-posts__media {
  display: block;
  margin-bottom: 16px;
  overflow: hidden;
  border-radius: var(--ab-radius-md);
}

.ab-posts__image {
  display: block;
  width: 100%;
  height: auto;
}

.ab-posts__title {
  margin: 0 0 8px;
  font-size: 20px;
}

.ab-posts__title a {
  color: var(--ab-color-heading);
}

.ab-posts__title a:hover,
.ab-posts__title a:focus-visible {
  color: var(--ab-color-burgundy);
}

.ab-posts__meta {
  margin: 0 0 10px;
  color: var(--ab-color-text);
  font-size: 14px;
}

.ab-posts__excerpt {
  color: var(--ab-color-text);
  font-size: 16px;
}

.ab-posts__empty,
.ab-posts__more {
  margin: 24px 0 0;
  text-align: center;
}

.ab-posts__more-link {
  display: inline-block;
  padding: 12px 24px;
  color: var(--ab-color-highlight);
  background: var(--ab-color-burgundy);
  border-radius: 3px;
}

.ab-posts__more-link:hover,
.ab-posts__more-link:focus-visible {
  color: var(--ab-color-burgundy);
  background: var(--ab-color-highlight);
}

/* Section */

.ab-section--pad-compact {
  padding-block: 20px;
}

.ab-section--pad-regular {
  padding-block: 40px;
}

.ab-section--pad-spacious {
  padding-block: 50px;
}

.ab-section--bg-muted {
  background: #f6f6f6;
}

.ab-section--bg-burgundy {
  color: var(--ab-color-white);
  background: var(--ab-color-burgundy);
}

.ab-section--bg-burgundy h1,
.ab-section--bg-burgundy h2,
.ab-section--bg-burgundy h3,
.ab-section--bg-burgundy a {
  color: var(--ab-color-white);
}

.ab-section--bg-utility {
  color: var(--ab-color-white);
  background: var(--ab-color-utility);
}

.ab-section--bg-utility h1,
.ab-section--bg-utility h2,
.ab-section--bg-utility h3,
.ab-section--bg-utility a {
  color: var(--ab-color-white);
}

.ab-section .wp-block-buttons {
  margin-top: 16px;
}

@media (max-width: 1024px) {
  .ab-posts--cols-3 .ab-posts__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  .ab-hero {
    padding-block: 32px;
  }

  .ab-hero__inner,
  .ab-hero--image-left .ab-hero__inner {
    flex-direction: column;
  }

  .ab-hero--media-small .ab-hero__media,
  .ab-hero--media-medium .ab-hero__media,
  .ab-hero--media-large .ab-hero__media {
    flex: 1 1 auto;
    width: 100%;
    max-width: 100%;
  }

  .ab-hero__actions {
    justify-content: stretch;
  }

  .ab-hero__button {
    text-align: center;
  }

  .ab-posts--cols-2 .ab-posts__grid,
  .ab-posts--cols-3 .ab-posts__grid {
    grid-template-columns: 1fr;
  }
}