/* === ALMAX HOME START === */
/*
 * Алмакс – главная страница. Работает поверх almax-base.css.
 * Версия 1.0 · 2026-09-26
 */

/* ---------------------------------------------------------------
   1. ПЕРВЫЙ ЭКРАН
   --------------------------------------------------------------- */
.ax .ax-hero {
  --ax-mark: clamp(18.75rem, 9.438rem + 38.2vw, 40rem);
  overflow: hidden;
  padding-block: clamp(3rem, 1.9rem + 4.5vw, 6rem) clamp(2.75rem, 2rem + 3vw, 5rem);
}
.ax .ax-hero::after {
  content: "";
  position: absolute;
  top: clamp(1.25rem, 3vw, 2.25rem);
  right: calc(var(--ax-mark) * -.27);
  width: var(--ax-mark);
  height: var(--ax-mark);
  background: var(--ax-kraft);
  opacity: .2;
  pointer-events: none;
  -webkit-mask: url(img/almax-mark.svg) center / contain no-repeat;
          mask: url(img/almax-mark.svg) center / contain no-repeat;
}
.ax .ax-hero .ax-wrap { position: relative; z-index: 1; }
.ax .ax-hero__main { max-width: 740px; }
/* Метки реза «встают на место» один раз при загрузке. Текст виден сразу. */
.ax .ax-hero__main.ax-crop::before { animation: ax-crop-in .8s var(--ax-ease) .15s both; }
@keyframes ax-crop-in {
  from { opacity: 0; transform: scale(1.06); }
  to   { opacity: 1; transform: none; }
}
/* Растр (полутоновые точки) в правом верхнем углу – уходит за край экрана.
   Тот же растр – в финальном блоке. На телефоне не выводится. */
.ax .ax-hero:has(.ax-sheet)::after {
  top: 0;
  right: 0;
  width: min(48vw, 860px);
  height: min(78%, 640px);
  background: var(--ax-orange);
  opacity: .55;
  -webkit-mask: url(img/ax-halftone.svg) right top / cover no-repeat;
          mask: url(img/ax-halftone.svg) right top / cover no-repeat;
}
.ax .ax-hero__top {
  --ax-sheet-w: clamp(320px, 25vw, 430px);       /* ширина листа с работами */
  --ax-hero-gap: clamp(2.5rem, 1rem + 3vw, 3.5rem);
  /* Ширина колонки текста, посчитанная от ширины окна:
     содержимое страницы − лист − промежуток */
  --ax-hero-col: calc(min(100vw - 2 * var(--ax-gutter), var(--ax-max)) - var(--ax-sheet-w) - var(--ax-hero-gap));
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, var(--ax-sheet-w));
  gap: var(--ax-hero-gap);
  align-items: center;
}
.ax .ax-hero__top .ax-hero__main { max-width: none; }
/* Заголовок подстраивается под колонку: «типография полного цикла» – одной строкой.
   7 % ширины колонки (7 %, а не 7,2 % – запас на полосу прокрутки, которую 100vw включает).
   Считается от ширины окна, а не от размера колонки (cqi): один шаг расчёта вместо двух.
   Не меньше 42 px, чтобы на планшете заголовок не стал мельче H2 – тогда строка переносится. */
.ax .ax-hero__top h1 { font-size: max(min(var(--ax-fs-h1), calc(var(--ax-hero-col) * .07)), min(var(--ax-fs-h1), 2.625rem)); }
.ax .ax-hero__own { margin-top: .5rem; font-size: var(--ax-fs-lead-lg); line-height: 1.5; }

/* Лист с работами: кремовый лист, шесть белых оттисков, подпись.
   При наведении оттиск приподнимается, по краю слева направо проходит рамка
   и вместе с ней выезжает подпись с названием раздела. */
.ax .ax-sheet {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin: 0;
  padding: 18px 18px 14px;
  background: var(--ax-cream);
  box-shadow: 0 22px 44px -22px rgba(77, 60, 45, .45);
}
.ax .ax-sheet__item {
  position: relative;
  display: block;
  padding: 0;
  background: none;
  transition: transform .3s var(--ax-ease), box-shadow .3s;
}
.ax .ax-sheet__item img { width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; }
.ax .ax-sheet__item::after {
  content: "";
  position: absolute;
  inset: 0;
  border: 2px solid var(--ax-orange);
  pointer-events: none;
  clip-path: inset(0 100% 0 0);
  transition: clip-path .45s var(--ax-ease);
}
.ax .ax-sheet__name {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  padding: .5em .6em;
  background: var(--ax-orange);
  color: #fff;
  font: 700 .8125rem/1.2 var(--ax-font-label);
  letter-spacing: .05em;
  text-transform: uppercase;
  text-align: center;
  clip-path: inset(0 100% 0 0);
  transition: clip-path .45s var(--ax-ease);
}
.ax .ax-sheet__item:is(:hover, :focus-visible) { color: inherit; transform: translateY(-4px); box-shadow: 0 12px 20px -12px rgba(77, 60, 45, .5); }
.ax .ax-sheet__item:is(:hover, :focus-visible)::after,
.ax .ax-sheet__item:is(:hover, :focus-visible) .ax-sheet__name { clip-path: inset(0); }
/* Без наведения (телефон, планшет) подпись видна всегда – спокойной светлой полоской */
@media (hover: none) {
  .ax .ax-sheet__name { clip-path: none; background: rgba(255, 246, 238, .92); color: var(--ax-ink); font-size: .6875rem; }
}
.ax .ax-sheet figcaption {
  grid-column: 1 / -1;
  margin-top: 2px;
  font: 700 .8125rem/1.35 var(--ax-font-label);
  letter-spacing: .06em;
  text-transform: uppercase;
  text-align: center;
  opacity: .75;
}
@media (max-width: 900px) {
  .ax .ax-hero:has(.ax-sheet)::after { content: none; }
  .ax .ax-hero__top { --ax-hero-col: min(100vw - 2 * var(--ax-gutter), var(--ax-max)); grid-template-columns: minmax(0, 1fr); }
  .ax .ax-sheet { max-width: 440px; }
}
/* На телефоне – 4 работы из 6, чтобы лист не растягивал первый экран */
@media (max-width: 640px) {
  .ax .ax-sheet__item:nth-of-type(4),
  .ax .ax-sheet__item:nth-of-type(5) { display: none; }
}
.ax .ax-hero__lead { margin-top: clamp(1.25rem, 1rem + .9vw, 1.75rem); font-size: var(--ax-fs-lead-lg); line-height: 1.5; }
.ax .ax-hero__geo { margin-top: .75rem; }
.ax .ax-hero .ax-btn-pair { margin-top: clamp(1.75rem, 1.5rem + 1vw, 2.25rem); }

.ax .ax-facts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 32px;
  margin-top: clamp(2.5rem, .7475rem + 7.191vw, 6.5rem);
}
/* Направления – ссылки-блоки с уголком реза (almax-base.css); при наведении окрашивается название */
.ax .ax-facts a {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-rows: auto 1fr;
  column-gap: 12px;
  height: 100%;
  padding: 14px 0 0;
  border-top: 2px solid var(--ax-ink);
  background: none;
  font-size: var(--ax-fs-small);
  line-height: 1.5;
}
.ax .ax-facts strong { grid-column: 1 / -1; margin-bottom: 6px; font: 700 clamp(1rem, .9rem + .35vw, 1.1875rem)/1.3 var(--ax-font-head); transition: color .2s; }
.ax .ax-facts span { grid-column: 1; grid-row: 2; }
.ax .ax-facts a::after { grid-column: 2; grid-row: 2; }
.ax .ax-facts a:is(:hover, :focus-visible) { color: inherit; }
.ax .ax-facts a:is(:hover, :focus-visible) strong { color: var(--ax-link); }
@media (max-width: 900px) { .ax .ax-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 16px; } }

/* ---------------------------------------------------------------
   2. КАРТОННАЯ УПАКОВКА
   --------------------------------------------------------------- */
.ax .ax-intro-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: clamp(1.25rem, -2rem + 8vw, 4.5rem);
  align-items: start;
  margin-top: 1.1em;
}
.ax .ax-intro-row .ax-intro { margin-top: 0; }
.ax .ax-pack .ax-cards { margin-top: clamp(2rem, 1.4rem + 2.4vw, 3.5rem); }
.ax .ax-pack .ax-tiles { margin-top: clamp(2rem, 1.7rem + 1.2vw, 3rem); }
@media (max-width: 800px) { .ax .ax-intro-row { grid-template-columns: 1fr; } }

/* Широкая карточка «Шуберы и обечайки» */
.ax .ax-wide {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(1rem, -.5rem + 5vw, 3.5rem);
  align-items: center;
  margin-top: clamp(2.25rem, 1.6rem + 2.6vw, 4rem);
  padding: clamp(1.125rem, .8rem + 1.4vw, 2rem);
  background: var(--ax-cream);
}
.ax .ax-wide .ax-media { aspect-ratio: 4 / 3; background: var(--ax-paper); }
.ax .ax-wide h3 { font-size: clamp(1.562rem, 1.316rem + 1.011vw, 2.125rem); line-height: 1.15; }
/* Ссылки-заголовки: в покое без линии, при наведении проходит сплошная */
.ax .ax-wide h3 a { background-size: 0 2px, 0 2px; }
.ax .ax-wide h3 a:is(:hover, :focus-visible) { background-size: 100% 2px, 0 2px; }
.ax .ax-wide p { margin-top: 1rem; font-size: var(--ax-fs-lead); line-height: 1.6; }
.ax .ax-inline-links { display: flex; flex-wrap: wrap; margin-top: 1.1rem; font: 700 clamp(1.062rem, 1rem + .25vw, 1.1875rem)/1.5 var(--ax-font-label); }
.ax .ax-inline-links li:not(:last-child)::after { content: "/"; margin-inline: .5em; }
@media (max-width: 800px) { .ax .ax-wide { grid-template-columns: 1fr; } }

.ax .ax-pack .ax-links { margin-top: clamp(1.75rem, 1.5rem + 1vw, 2.5rem); }

/* ---------------------------------------------------------------
   3. СЕЗОН
   --------------------------------------------------------------- */
.ax .ax-season .ax-cards { margin-top: clamp(1.75rem, 1.3rem + 1.8vw, 3rem); }
/* Блог: линия ссылок и уголки – голубые */
.ax .ax-reading { --ax-link: var(--ax-blue); }
.ax .ax-reading {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr);
  gap: 12px 48px;
  margin-top: clamp(2.5rem, 1.9rem + 2.4vw, 4rem);
  padding-top: 1.5rem;
  border-top: 2px solid var(--ax-blue);
}
.ax .ax-reading__title h3 { font-size: var(--ax-fs-h3); }
.ax .ax-reading__title p {
  margin-top: .5rem;
  font: 700 .9375rem/1.2 var(--ax-font-label);
  letter-spacing: .08em;
  text-transform: uppercase;
}
.ax .ax-reading ul { display: flex; flex-direction: column; }
.ax .ax-reading li + li { border-top: 1px solid var(--ax-rule-soft); }
.ax .ax-reading a {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 0;
  font-size: var(--ax-fs-lead);
  line-height: 1.45;
  background: none;
  transition: color .2s;
}
.ax .ax-reading li:first-child a { padding-top: 4px; }
/* Уголок реза – из almax-base.css; здесь только выравнивание по строке */
.ax .ax-reading a::after { margin-bottom: .45em; }
@media (max-width: 800px) { .ax .ax-reading { grid-template-columns: 1fr; } }

/* ---------------------------------------------------------------
   4. НЕ ТОЛЬКО УПАКОВКА
   --------------------------------------------------------------- */
/* «Печатный лист»: ячейки разделены штриховыми линиями реза, вся ячейка – ссылка.
   Телефон – список; от 640 px – 2 колонки; от 1200 px – 4 × 2.
   Высота ячейки – по содержимому; спецпредложение вынесено на поле листа под сеткой. */
.ax .ax-index { display: grid; grid-template-columns: minmax(0, 1fr); margin-top: 2.25rem; border-bottom: var(--ax-die); }
.ax .ax-index li { position: relative; padding: 16px 0 18px; border-top: var(--ax-die); }
.ax .ax-index__cell { container-type: inline-size; transition: background-color .25s; }
.ax .ax-index h3 { font-size: clamp(1.125rem, 8.4cqi, 1.375rem); line-height: 1.25; overflow-wrap: break-word; }
.ax .ax-index h3 a { padding: 0; background: none; color: inherit; text-decoration: none; transition: color .2s; }
/* Ссылка заголовка растянута на всю ячейку */
.ax .ax-index h3 a::before { content: ""; position: absolute; z-index: 1; inset: 0; }
/* Уголок реза – в правом нижнем углу ячейки; текст состава оставляет ему место справа */
.ax .ax-index h3 a::after {
  content: "";
  position: absolute;
  right: 4px;
  bottom: 24px;
  width: 11px;
  height: 11px;
  border-right: 2px solid var(--ax-kraft);
  border-bottom: 2px solid var(--ax-kraft);
  transition: transform .2s var(--ax-ease), border-color .2s;
}
.ax .ax-index__cell p { margin-top: 6px; padding-right: 28px; font-size: var(--ax-fs-small); line-height: 1.55; }
.ax .ax-index__cell:is(:hover, :focus-within) h3 a { color: var(--ax-link); }
.ax .ax-index__cell:is(:hover, :focus-within) h3 a::after { transform: translate(3px, 3px); border-color: var(--ax-link); }
/* Поле листа: спецпредложение одной строкой под сеткой */
.ax .ax-index__offer { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; font-style: italic; font-size: var(--ax-fs-small); line-height: 1.5; }
.ax .ax-index__offer .ax-stamp { flex: 0 0 auto; font-style: normal; font-size: .875rem; }
@media (min-width: 640px) {
  .ax .ax-index { grid-template-columns: repeat(2, minmax(0, 1fr)); border-bottom: 0; border-top: var(--ax-die); border-left: var(--ax-die); }
  .ax .ax-index li { padding: 24px 22px 26px 24px; border-top: 0; border-right: var(--ax-die); border-bottom: var(--ax-die); }
  .ax .ax-index h3 a::after { right: 20px; bottom: 22px; }
  .ax .ax-index__all { background: var(--ax-cream); }   /* выход во весь каталог – закрывает лист */
  .ax .ax-index li.ax-index__offer { grid-column: 1 / -1; padding-block: 14px 15px; }
  /* Прорезка: по штриховому контуру ячейки проходит сплошная линия */
  .ax .ax-index__cell::after {
    content: "";
    position: absolute;
    z-index: 3;
    inset: -1.5px;
    border: 2px solid var(--ax-link);
    pointer-events: none;
    clip-path: inset(0 100% 0 0);
    transition: clip-path .5s var(--ax-ease);
  }
  .ax .ax-index__cell:is(:hover, :focus-within) { background: var(--ax-cream); }
  .ax .ax-index__cell:is(:hover, :focus-within)::after { clip-path: inset(0); }
}
@media (min-width: 1200px) {
  .ax .ax-index { grid-template-columns: repeat(4, minmax(0, 1fr)); grid-template-rows: 1fr 1fr auto; }   /* два ряда ячеек одной высоты + поле */
}

/* ---------------------------------------------------------------
   5. ПОЛНЫЙ ЦИКЛ – лист, разрезанный пунктиром на четыре части
   --------------------------------------------------------------- */
/* Этапы в порядке производства: до печати – печать (цифровая, под ней офсетная) – после печати.
   Над карточками общая линия; у каждого этапа подпись и засечка на границе колонки. */
.ax .ax-services {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: auto 1fr;
  margin-top: clamp(1.75rem, 1.2rem + 2.2vw, 3rem);
  border-top: 2px solid var(--ax-ink);
}
.ax .ax-service { position: relative; padding: 56px 28px 0; }
.ax .ax-service:nth-child(1) { grid-column: 1; grid-row: 1 / 3; border-left: var(--ax-die); }
.ax .ax-service:nth-child(2) { grid-column: 2; grid-row: 1; padding-bottom: 28px; border-inline: var(--ax-die); }
.ax .ax-service:nth-child(3) { grid-column: 2; grid-row: 2; padding-top: 28px; border-inline: var(--ax-die); }
.ax .ax-service:nth-child(3)::after { content: ""; position: absolute; top: 0; left: 28px; right: 28px; border-top: var(--ax-die); }
.ax .ax-service:nth-child(4) { grid-column: 3; grid-row: 1 / 3; border-right: var(--ax-die); }
.ax .ax-service:is(:nth-child(1), :nth-child(4)) { display: flex; flex-direction: column; align-items: flex-start; }
.ax .ax-service__stage {
  position: absolute;
  top: 0;
  left: -1.5px;               /* засечка встаёт на штриховую границу колонки */
  padding: 14px 0 6px 12px;
  border-left: 2px solid var(--ax-ink);
  font: 700 .9375rem/1 var(--ax-font-label);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--ax-ink);
}
.ax .ax-service h3 { font-size: clamp(1.25rem, 1.1rem + .5vw, 1.5rem); line-height: 1.2; color: var(--ax-kraft); }
.ax .ax-service .ax-kicker { margin-top: .35rem; font-size: var(--ax-fs-lead); line-height: 1.45; }
.ax .ax-service p:not(.ax-kicker, .ax-service__stage) { margin-top: .9rem; font-size: var(--ax-fs-small); line-height: 1.6; }
.ax .ax-service .ax-more { display: inline-block; margin-top: .9rem; font-size: var(--ax-fs-small); }
/* Фото этапа под карточкой – в колонках «До печати» и «После печати» */
.ax .ax-service__photo { align-self: stretch; margin-top: auto; aspect-ratio: 3 / 2; }
.ax .ax-service .ax-more { margin-bottom: 1.75rem; }
.ax .ax-service:nth-child(3) .ax-more, .ax .ax-service:not(:has(.ax-service__photo)) .ax-more { margin-bottom: 0; }
@media (max-width: 900px) {
  .ax .ax-services { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; }
  .ax .ax-service:nth-child(n) { grid-column: 1; grid-row: auto; padding: 52px 0 28px; border: 0; }
  .ax .ax-service:nth-child(n + 2) { border-top: 2px solid var(--ax-ink); }
  .ax .ax-service:nth-child(3) { padding-top: 28px; border-top: var(--ax-die); }
  .ax .ax-service:nth-child(3)::after { content: none; }
  .ax .ax-service:nth-child(4) { padding-bottom: 0; }
  .ax .ax-service__stage { left: 0; }
  .ax .ax-service__photo { margin-top: 0; }
}

/* ---------------------------------------------------------------
   6. НАДЁЖНОСТЬ
   --------------------------------------------------------------- */
/* Фото цеха: во всю ширину, штанцевая рамка как у карточек; на телефоне – кадр 4:3 */
.ax .ax-shop { margin: 0 0 clamp(1.75rem, 1.3rem + 1.8vw, 3rem); }
.ax .ax-shop .ax-media { aspect-ratio: 1600 / 664; }
.ax .ax-shop img { width: 100%; height: 100%; object-fit: cover; }
.ax .ax-shop figcaption { margin-top: .7rem; font-style: italic; font-size: var(--ax-fs-small); }
@media (max-width: 640px) { .ax .ax-shop .ax-media { aspect-ratio: 4 / 3; } }
.ax .ax-reliability .ax-intro { margin-bottom: clamp(1.75rem, 1.3rem + 1.8vw, 3rem); }
.ax .ax-reasons { border-bottom: var(--ax-die); }
.ax .ax-reasons li {
  display: grid;
  grid-template-columns: 340px minmax(0, 1fr);
  gap: 12px 48px;
  padding: 32px 0;
  border-top: var(--ax-die);
}
.ax .ax-reasons p { font-size: var(--ax-fs-body); line-height: 1.6; }
.ax .ax-reasons h3 { font-size: var(--ax-fs-card); line-height: 1.3; }
@media (max-width: 1024px) { .ax .ax-reasons li { grid-template-columns: minmax(0, 1fr); padding: 24px 0; } }

/* ---------------------------------------------------------------
   7. ЦИТАТА – отдельная секция, компонент .ax-quote из базы
   --------------------------------------------------------------- */

/* ---------------------------------------------------------------
   8. С ЧЕГО НАЧАТЬ
   --------------------------------------------------------------- */
.ax .ax-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin-top: clamp(1.75rem, 1.3rem + 1.8vw, 2.75rem); }
.ax .ax-option { padding: clamp(1.25rem, .95rem + 1.2vw, 2rem) clamp(1.25rem, .8rem + 1.8vw, 2.125rem); background: var(--ax-cream); border: var(--ax-die); }
.ax .ax-section--cream .ax-option { background: var(--ax-paper); }
.ax .ax-option h3 { font-size: var(--ax-fs-card); line-height: 1.3; }
.ax .ax-option :is(p, .ax-more) { margin-left: calc(var(--ax-fs-card) * 1.6); }
.ax .ax-option p { margin-top: .75rem; font-size: var(--ax-fs-small); line-height: 1.6; }
.ax .ax-option .ax-more { display: inline-block; margin-top: .75rem; font-size: var(--ax-fs-small); }
.ax .ax-start__after { max-width: 54rem; margin-top: clamp(1.75rem, 1.3rem + 1.8vw, 2.75rem); line-height: 1.65; }
.ax .ax-start .ax-links { margin-top: 1.5rem; padding-top: 1.25rem; border-top: 1px solid var(--ax-rule); }
@media (max-width: 800px) { .ax .ax-options { grid-template-columns: 1fr; gap: 14px; } }

/* ---------------------------------------------------------------
   9. ВОПРОСЫ И ОТВЕТЫ
   --------------------------------------------------------------- */
.ax .ax-faq-layout { display: grid; grid-template-columns: 320px minmax(0, 1fr); gap: 20px 64px; }
.ax .ax-faq-layout .ax-faq { margin-top: 8px; }
.ax .ax-faq-ask { margin-top: 1.75rem; }
/* Ссылки – отдельными строками; на сенсорных экранах с запасом для пальца */
.ax .ax-faq-ask a { display: block; width: fit-content; margin-top: .5rem; font-weight: 700; }
@media (hover: none), (max-width: 1024px) {
  .ax .ax-faq-ask a { margin-top: .6rem; padding-block: .55rem .3rem; font-size: var(--ax-fs-body); }
}
@media (max-width: 1024px) { .ax .ax-faq-ask { max-width: 26rem; } }
@media (max-width: 1024px) { .ax .ax-faq-layout { grid-template-columns: 1fr; } }

/* ---------------------------------------------------------------
   10. КЛИЕНТЫ
   --------------------------------------------------------------- */
.ax .ax-clients h2 { font-size: clamp(1.625rem, 1.242rem + 1.573vw, 2.5rem); }
.ax .ax-marquee { container-type: inline-size; margin-top: clamp(1.5rem, 1.2rem + 1.2vw, 2.25rem); }
.ax .ax-logos { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 20px; }
.ax .ax-logos li {
  display: flex;
  align-items: center;
  justify-content: center;
  height: clamp(84px, 76px + 1.8vw, 108px);
  padding: 6px 10px;
  border: 1.5px dashed rgba(153, 119, 89, .6);
}
.ax .ax-logos img { width: auto; max-width: 100%; max-height: 100%; object-fit: contain; }
@media (max-width: 900px) { .ax .ax-logos { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; } }
@media (max-width: 480px) { .ax .ax-logos { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Лента запускается скриптом: он дублирует логотипы и добавляет класс is-running.
   Без скрипта и при «уменьшении движения» в системе – статичная сетка выше. */
.ax .ax-marquee.is-running {
  --ax-logo-gap: 20px;
  --ax-logo-cols: 4;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent);
          mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent);
}
.ax .ax-marquee.is-running .ax-logos {
  display: flex;
  gap: 0;
  width: max-content;
  animation: ax-marquee var(--ax-marquee-time, 64s) linear infinite;
}
.ax .ax-marquee.is-running .ax-logos li {
  flex: 0 0 auto;
  width: calc((100cqi - (var(--ax-logo-cols) - 1) * var(--ax-logo-gap)) / var(--ax-logo-cols));
  margin-right: var(--ax-logo-gap);
}
.ax .ax-marquee.is-running:hover .ax-logos,
.ax .ax-marquee.is-running:focus-within .ax-logos { animation-play-state: paused; }
@media (max-width: 900px) { .ax .ax-marquee.is-running { --ax-logo-cols: 3; --ax-logo-gap: 14px; } }
@media (max-width: 480px) { .ax .ax-marquee.is-running { --ax-logo-cols: 2; } }
@keyframes ax-marquee { to { transform: translateX(-50%); } }

/* ---------------------------------------------------------------
   11. ОТЗЫВЫ
   --------------------------------------------------------------- */
.ax .ax-reviews__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; }
.ax .ax-reviews .ax-scroller { margin-top: clamp(1.5rem, 1.2rem + 1.2vw, 2.25rem); }
.ax .ax-review { display: flex; flex-direction: column; margin: 0; padding: clamp(1.375rem, 1.1rem + 1vw, 2rem) clamp(1.25rem, .95rem + 1.2vw, 2.125rem); background: var(--ax-paper); }
.ax .ax-review blockquote { flex: 1 1 auto; font-style: italic; font-size: clamp(1.0625rem, 1rem + .25vw, 1.1875rem); line-height: 1.6; }
.ax .ax-review figcaption { display: flex; align-items: center; gap: 16px; margin-top: 1.5rem; padding-top: 1.1rem; border-top: var(--ax-die); font-size: var(--ax-fs-small); line-height: 1.45; }
.ax .ax-review figcaption { gap: 20px; }
.ax .ax-review figcaption img { flex: 0 0 auto; width: auto; max-width: 120px; height: 64px; object-fit: contain; }
@media (max-width: 640px) { .ax .ax-reviews .ax-scroll-nav { display: none; } }

/* ---------------------------------------------------------------
   12. БЛОГ («Вам может быть интересно») – карточки выводит шорткод [ax_blog]
   --------------------------------------------------------------- */
.ax .ax-blog .ax-intro { font-style: italic; }
.ax .ax-posts { margin-top: clamp(1.75rem, 1.3rem + 1.8vw, 2.75rem); }
.ax .ax-post .ax-media { aspect-ratio: 1200 / 630; }   /* обложки статей 1200×630 – помещаются целиком */
.ax .ax-post .ax-media::after { content: none; }
/* Прорезка рамки по краю обложки: голубая линия блога, картинку не перекрывает */
.ax .ax-post .ax-media::before { inset: 0; border-width: 3px; border-radius: 0; }
.ax .ax-post h3 { margin-top: .5rem; padding-top: .75rem; border-top: 2px solid var(--ax-blue); font-size: clamp(1.0625rem, 1rem + .25vw, 1.1875rem); line-height: 1.3; }


/* ---------------------------------------------------------------
   13. ФИНАЛЬНЫЙ БЛОК – тёмный, с метками реза как на первом экране
   --------------------------------------------------------------- */
.ax .ax-final {
  --ax-mark: clamp(18.75rem, 9.438rem + 33.7vw, 37.5rem);
  --ax-icon-on-dark: #C9AE93;   /* значки на тёмном – как в подвале сайта (--ax-kraft-light) */
  overflow: hidden;
  padding-block: clamp(4rem, 2.8rem + 4.9vw, 7rem) 0;
  /* Цветная полоса по верхнему краю – как у подвала на остальных страницах */
  background:
    linear-gradient(90deg, var(--ax-magenta) 0 20%, var(--ax-yellow) 0 40%, var(--ax-kraft) 0 60%, var(--ax-orange) 0 80%, var(--ax-blue) 0)
      0 0 / 50% 5px repeat-x,
    var(--ax-ink);
}
.ax .ax-final::after {
  content: "";
  position: absolute;
  top: 5px;
  right: 0;
  width: min(46vw, 760px);
  height: min(55%, 560px);
  background: var(--ax-cream);
  opacity: .16;
  pointer-events: none;
  -webkit-mask: url(img/ax-halftone.svg) right top / cover no-repeat;
          mask: url(img/ax-halftone.svg) right top / cover no-repeat;
}
@media (max-width: 900px) { .ax .ax-final::after { content: none; } }
.ax .ax-final .ax-wrap { position: relative; z-index: 1; }

/* Верх: призыв слева, письмо руководителю – справа, на уровне кнопок */
.ax .ax-final__main { max-width: 800px; }
.ax .ax-final h2 { font-size: clamp(1.875rem, 1.327rem + 2.247vw, 3.125rem); }
.ax .ax-final__sub { margin-top: 1.5rem; font-style: italic; font-size: var(--ax-fs-lead-lg); line-height: 1.5; }
.ax .ax-final__cta { margin-top: 1.75rem; font-size: var(--ax-fs-lead); }
.ax .ax-final .ax-btn-pair { margin-top: 1.75rem; }

/* Перфорация во всю ширину – как в подвале между «Расчётом» и контактами */
.ax .ax-final__perf {
  height: 2px;
  margin-top: clamp(3.5rem, 2.5rem + 4vw, 6rem);
  background: repeating-linear-gradient(90deg, rgba(255, 252, 249, .28) 0 6px, transparent 6px 12px);
}

/* Контакты – вид как в подвале сайта: подписи, значки, телефоны и почта крупно */
/* Пять колонок: адреса · визит · телефоны · почта · соцсети.
   Телефоны, почта и соцсети – по ширине содержимого, адреса и визит делят остаток. */
.ax .ax-fcontacts {
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr) auto auto auto;   /* адреса – самая широкая колонка */
  align-items: start;
  gap: 28px clamp(28px, 1rem + 1.5vw, 48px);
  padding-block: 2.25rem 2rem;
}
.ax .ax-fcontacts__col { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; min-width: 0; }
.ax .ax-fcontacts__col--addr .ax-fc + .ax-fcontacts__h { margin-top: 14px; }
.ax .ax-fcontacts__h {
  margin-bottom: 4px;
  font: 700 1rem/1.2 var(--ax-font-label);
  letter-spacing: .07em;
  text-transform: uppercase;
  color: var(--ax-icon-on-dark);
}
/* Строка контакта: значок + текст. Значки – маски (без файлов), цвет – крафт на тёмном */
.ax .ax-fc { display: inline-flex; align-items: flex-start; gap: 10px; font-size: 1.0625rem; line-height: 1.4; }
.ax .ax-fc::before {
  content: "";
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  margin-top: 2px;
  background: var(--ax-icon-on-dark);
  -webkit-mask: var(--ax-i) center / contain no-repeat;
          mask: var(--ax-i) center / contain no-repeat;
}
.ax .ax-fc--tel {
  --ax-i: var(--ax-icon-phone);
  align-items: center;
  font: 700 clamp(1.1875rem, .9rem + .4vw, 1.3125rem)/1.2 var(--ax-font-head);   /* 19 → 21 px (как в подвале) */
  letter-spacing: .01em;
  white-space: nowrap;
  background-size: 0 2px, 0 2px;
}
.ax .ax-fc--tel:is(:hover, :focus-visible) { background-size: 100% 2px, 0 2px; }
.ax .ax-fc--tel::before { margin-top: 0; }
.ax .ax-fc--mobile { --ax-i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='6.5' y='2' width='11' height='20' rx='2'/%3E%3Cpath d='M11 18h2'/%3E%3C/svg%3E"); }
.ax .ax-fc--mail {
  --ax-i: var(--ax-icon-mail);
  align-items: center;
  gap: 8px;
  font: 700 clamp(1.0625rem, .8rem + .4vw, 1.1875rem)/1.2 var(--ax-font-head);   /* 17 → 19 px – на ступень меньше телефонов */
  white-space: nowrap;
}
.ax .ax-fc--mail::before { margin: 0 2px 0 0; }
.ax .ax-fc--time { --ax-i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E"); }
.ax .ax-fc--pin  { --ax-i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-7-6.2-7-11.2a7 7 0 0 1 14 0C19 14.8 12 21 12 21z'/%3E%3Ccircle cx='12' cy='9.8' r='2.6'/%3E%3C/svg%3E"); }

/* Кнопка копирования почты (скрипт – almax-home.js) */
.ax .ax-copy {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: var(--ax-radius);
  background: transparent;
  color: var(--ax-icon-on-dark);
  cursor: pointer;
}
.ax .ax-copy::before {
  content: "";
  width: 17px;
  height: 17px;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='9' width='11' height='11' rx='2'/%3E%3Cpath d='M5 15V6a2 2 0 0 1 2-2h9'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='9' width='11' height='11' rx='2'/%3E%3Cpath d='M5 15V6a2 2 0 0 1 2-2h9'/%3E%3C/svg%3E") center / contain no-repeat;
}
.ax .ax-copy:hover { background: rgba(255, 252, 249, .1); color: var(--ax-paper); }
.ax .ax-copy[data-tip]::after {
  content: attr(data-tip);
  position: absolute;
  top: calc(100% + 6px);
  left: 50%;
  transform: translateX(-50%);
  padding: 4px 8px;
  border-radius: var(--ax-radius);
  background: var(--ax-paper);
  color: var(--ax-ink);
  font: 700 .8125rem/1.3 var(--ax-font-text);
  white-space: nowrap;
  box-shadow: 0 4px 12px rgba(0, 0, 0, .25);
  pointer-events: none;
}

/* Напоминание о визите – своя колонка рядом с адресами */
.ax .ax-visit {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 14px;
  border: 1.5px dashed rgba(255, 130, 40, .75);
  font-style: italic;
  font-size: var(--ax-fs-small);
  line-height: 1.45;
}
.ax .ax-visit::before {
  content: "";
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  margin-top: 1px;
  background: var(--ax-orange);
  -webkit-mask: var(--ax-icon-phone) center / contain no-repeat;
          mask: var(--ax-icon-phone) center / contain no-repeat;
}

/* Обратная связь – отдельная строка под контактами, за штриховой линией:
   слева подпись и пояснение, справа контурная кнопка «Написать письмо руководителю» */
.ax .ax-feedback {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px 48px;
  padding-block: 1.75rem clamp(2.25rem, 1.8rem + 1.6vw, 3rem);
  border-top: 1.5px dashed rgba(255, 252, 249, .28);
}
.ax .ax-feedback__text { max-width: 44rem; }
@media (min-width: 1200px) { .ax .ax-feedback__text { max-width: none; } }   /* на широком экране пояснение – в одну строку */
.ax .ax-feedback__text p:not(.ax-fcontacts__h) { margin-top: 6px; font-size: var(--ax-fs-small); line-height: 1.55; color: rgba(255, 246, 238, .85); }
.ax .ax-feedback .ax-btn { flex: 0 0 auto; }

/* Соцсети – кнопки, как в подвале; одна под другой, одной ширины (по самой широкой).
   Свой класс ax-fsoc: у подвала сайта есть ax-soc со своей раскладкой (almax-header.css) */
.ax .ax-fsoc { display: inline-grid; grid-template-columns: minmax(0, 1fr); grid-auto-flow: row; gap: 10px; }
.ax .ax-fsoc a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 44px;
  padding: 0 14px;
  border: 1px solid rgba(255, 252, 249, .18);
  border-radius: var(--ax-radius);
  background: rgba(255, 252, 249, .08);
  font-weight: 700;
  font-size: .9375rem;
  transition: background-color .2s, border-color .2s;
}
.ax .ax-fsoc a:is(:hover, :focus-visible) { background: var(--ax-kraft); border-color: var(--ax-kraft); }
.ax .ax-fsoc__vk::before {
  content: "VK";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border: 1.8px solid currentColor;
  border-radius: 5px;
  font: 700 .6875rem/1 var(--ax-font-label);
}
.ax .ax-fsoc__yt::before {
  content: "";
  width: 20px;
  height: 20px;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='2.5' y='5' width='19' height='14' rx='3.5' fill='none' stroke='%23000' stroke-width='1.8'/%3E%3Cpath d='M10 9.3v5.4l4.6-2.7z'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='2.5' y='5' width='19' height='14' rx='3.5' fill='none' stroke='%23000' stroke-width='1.8'/%3E%3Cpath d='M10 9.3v5.4l4.6-2.7z'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Последний экран целиком тёмный: при прокрутке до конца – шапка, цветная полоса,
   финальный блок, нижняя строка подвала. Высота блока – не меньше «окно − шапка − строка подвала».
   Лишнее место делится поровну выше и ниже призыва; контакты остаются внизу.
   --ax-bar-h-stuck и --ax-adminbar задаёт almax-header.css (здесь – запасные значения).
   --ax-final-ft – высота нижней строки подвала на главной (.ax-ft--home .ax-fbot); если на сайте
   при прокрутке до конца полоса уходит под шапку или видна светлая щель – поправить это число. */
@media (min-width: 1101px) {
  .ax .ax-final {
    --ax-final-hd: calc(var(--ax-bar-h-stuck, 64px) + var(--ax-adminbar, 0px));
    --ax-final-ft: 66px;
    display: flex;
    flex-direction: column;
    min-height: calc(100vh - var(--ax-final-hd) - var(--ax-final-ft));
    min-height: calc(100svh - var(--ax-final-hd) - var(--ax-final-ft));
  }
  .ax .ax-final > .ax-wrap { width: 100%; }
  .ax .ax-final > .ax-wrap:first-child { margin-block: auto; }
}

/* Ноутбуки и мониторы до 1840 px (колонка до 1250 px): пять колонок тесно – четыре, «Визит» встаёт под адресами */
@media (min-width: 1101px) and (max-width: 1839.98px) {
  .ax .ax-fcontacts { grid-template-columns: minmax(0, 1fr) auto auto auto; }
  .ax .ax-fcontacts__col--visit { grid-column: 1; grid-row: 2; }
}
@media (max-width: 1100px) {
  .ax .ax-fcontacts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .ax .ax-final { background-size: 50% 4px, auto; }
  .ax .ax-feedback { flex-direction: column; align-items: stretch; }
  .ax .ax-fcontacts { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .ax .ax-fsoc { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); width: 100%; }
}
/* ---------------------------------------------------------------
   НИЗКОЕ ОКНО (компьютер, высота окна до 1100 px): первый экран сжимается по вертикали,
   чтобы под шапкой помещались лист с работами и строка направлений. Размер фото не меняется –
   уменьшаются только отступы.
   --------------------------------------------------------------- */
@media (min-width: 901px) and (max-height: 1100px) {
  .ax .ax-hero { padding-block: clamp(1.5rem, 3.5vh, 6rem) clamp(1.5rem, 4vh, 5rem); }
  .ax .ax-facts { margin-top: clamp(1.75rem, 4vh, 6.5rem); }
  .ax .ax-hero__top { --ax-sheet-w: clamp(310px, 25vw - 10px, 418px); }
  .ax .ax-sheet { gap: 10px; padding: 12px 12px 10px; }
  .ax .ax-sheet figcaption { margin-top: 0; }
  /* Финальный блок: при прокрутке до конца под шапкой видны цветная полоса,
     призыв, контакты и нижняя строка подвала. Шрифты не меняются – только отступы.
     Сверху и до перфорации остаётся место под метки реза (48 px) */
  .ax .ax-final { padding-top: clamp(4.5rem, 7vh, 7rem); }
  .ax .ax-final__perf { margin-top: clamp(4rem, 6.5vh, 6rem); }
  .ax .ax-fcontacts { padding-block: 1.75rem 1.5rem; }
  .ax .ax-feedback { padding-block: 1.25rem 1.75rem; }
}

/* ---------------------------------------------------------------
   ШИРОКИЕ ЭКРАНЫ (от 1760 px): колонка шире 1200 px, и текст не должен «висеть» слева.
   Заголовок раздела – слева, вступление – справа от него; длинный абзац – в две колонки.
   --------------------------------------------------------------- */
@media (min-width: 1760px) {
  .ax .ax-wrap:has(> h2 + .ax-intro) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(3rem, 5vw, 6rem); }
  .ax .ax-wrap:has(> h2 + .ax-intro) > * { grid-column: 1 / -1; }
  .ax .ax-wrap:has(> h2 + .ax-intro) > h2 { grid-column: 1; }
  .ax .ax-wrap:has(> h2 + .ax-intro) > h2 + .ax-intro { grid-column: 2; align-self: end; margin-top: 0; max-width: 44rem; }
  .ax .ax-start__after { max-width: none; column-count: 2; column-gap: clamp(3rem, 5vw, 6rem); }
  .ax .ax-quote blockquote { max-width: none; }
  .ax .ax-reliability .ax-wrap > h2 { margin-bottom: clamp(1.75rem, 1.3rem + 1.8vw, 3rem); }
}
/* === ALMAX HOME END === */