/* ==========================================================================
   ЭЛИТМОДУЛЬ — только мобильный вид (Figma «Телефон» 375px)
   Подключается отдельно: max-width 480px. Десктоп не затрагивается.
   ========================================================================== */

@media (max-width: 480px) {
  :root {
    --header-h: 50px;
    --mobile-gutter: 18px;
    --mobile-edge-bleed: calc((100vw - min(var(--mobile-content), 100vw - 2 * var(--mobile-gutter))) / 2);
    --mobile-content: 340px;
    --radius-mobile: 25px;
    --mobile-section-gap: 50px;
    --review-play-size: 43px;
    --review-play-icon: 14px;
    --review-play-triangle-h: 7px;
    --review-play-triangle-w: 12px;
  }

  body { font-size: 14px; }

  /* Короткие подстраницы: main растягивается по flex, фон — cream, не white */
  body:not(.home) {
    background: var(--cream);
  }

  body:not(.home) .site-main {
    background: var(--cream);
    flex: 1 0 auto;
  }

  .container {
    width: calc(100% - 36px);
    max-width: none;
  }

  .section { padding: 0; }

  /* Figma «Телефон»: 50px между блоками */
  .hero + .section,
  .section + .section,
  .section + .quote-band,
  .quote-band + .section,
  .section + .story-band,
  .story-band + .section,
  .section + .advantages-band,
  .advantages-band + .section {
    margin-top: var(--mobile-section-gap);
  }

  .sec-head { margin-bottom: 25px; }
  .sec-head__title {
    font-size: 64px;
    line-height: 1;
    letter-spacing: -.02em;
  }
  .section--overview .sec-head__title {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    box-sizing: border-box;
    padding-inline: var(--mobile-gutter);
    font-size: 96px;
    padding-bottom: 8px;
    white-space: nowrap;
  }
  .section--overview .sec-head__subtitle:not(.sec-head__subtitle--composite) {
    display: block;
    padding-left: 0;
    margin-top: 14px;
    margin-left: auto;
    margin-right: 0;
    width: 184px;
    max-width: calc(100% - var(--mobile-gutter));
    text-align: right;
    white-space: nowrap;
    box-sizing: border-box;
  }
  .section--blog .sec-head__title { font-size: 96px; }
  .section--contacts .sec-head__title { font-size: 48px; }
  .section--credits .sec-head__title {
    display: block;
    width: 100%;
    white-space: nowrap;
    text-align: center;
  }
  .section--projects .sec-head__title { white-space: nowrap; }
  .sec-head__subtitle {
    font-size: 20px;
    padding-left: 0;
    margin-top: 4px;
  }

  .sec-head--subpage { margin-bottom: 18px; }
  .sec-head--subpage .sec-head__title {
    font-size: 48px;
    line-height: 0.92;
    letter-spacing: -.02em;
  }
  .sec-head--subpage .sec-head__subtitle {
    font-size: 16px;
    margin-top: 4px;
  }

  .article__section-head,
  .types-page__section-head,
  .detail-page__section-head {
    width: calc(100% - 36px);
    max-width: none;
    margin-inline: auto;
    padding-left: var(--mobile-gutter);
    box-sizing: border-box;
  }

  .article__section-head .article__back,
  .types-page__section-head .article__back,
  .detail-page__section-head .article__back,
  .section--blog-archive .article__back,
  .section--gallery-archive .article__back,
  .section--reviews-archive .article__back {
    position: static;
    margin: 0 0 10px;
    font-size: 12px;
    font-weight: 400;
    color: var(--gray);
    text-decoration: none;
  }

  .sec-head__subtitle-mobile { display: inline; }
  .sec-head__subtitle-desktop { display: none; }

  .sec-head__subtitle--composite .sec-head__subtitle-mobile {
    display: block;
    width: 100%;
  }

  body.home .sec-head__subtitle--composite .sub-composite__svg svg,
  .sec-head__subtitle--composite .sub-composite__svg svg {
    width: calc(var(--sub-figma-w) * 20px / var(--sub-figma-fs));
  }

  /* Flat SVG composite — column + ink alignment at end of file */
  .sec-head__subtitle.sec-head__subtitle--composite {
    white-space: normal;
  }

  /* Subtitle leaf marks — positions via subtitle-leaves.js */
  .sub-leaves__mark .sub-leaves__mark-img--desktop { display: none; }
  .sub-leaves__mark .sub-leaves__mark-img--mobile { display: block; }

  .btn {
    font-size: 14px;
    padding: 12px 18px;
  }

  /* ----- Header / nav overlay ----- */
  body.nav-open { overflow: hidden; }

  body.nav-open::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 198;
    background: rgba(0, 0, 0, 0.55);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.48s ease, visibility 0.48s ease;
  }

  body.nav-open.nav-backdrop--ready::before {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  .site-header {
    padding-top: 0;
    z-index: 201;
    transition: opacity 0.4s ease;
  }

  .nav {
    min-height: var(--header-h);
    padding-block: 0;
    border-radius: 15px;
    transition: background-color 0.48s ease, border-radius 0.48s ease;
  }

  .brand {
    --brand-mark-size: 28px;
    transition: opacity 0.48s ease, visibility 0.48s ease;
  }
  .brand__name {
    font-family: var(--font-logo);
    font-weight: 400;
    text-transform: uppercase;
    font-size: 13px;
    letter-spacing: .1em;
  }

  .brand__line {
    line-height: calc(var(--brand-mark-size) / 2);
  }

  .nav__phone {
    font-size: 12px;
    transition: opacity 0.48s ease, visibility 0.48s ease, max-width 0.48s ease, margin 0.48s ease;
  }

  .nav:not(.is-open):not(.is-nav-animating) .nav__inner > .brand {
    position: static;
    --brand-mark-size: 28px;
    margin: 0;
    opacity: 1;
    visibility: visible;
  }

  .nav:not(.is-open):not(.is-nav-animating) .nav__inner > .brand > .brand__name {
    font-family: var(--font-logo);
    font-weight: 400;
    text-transform: uppercase;
    font-size: 13px;
    letter-spacing: .1em;
    transform: translateY(0.08em);
  }

  .nav:not(.is-open):not(.is-nav-animating):not(.is-header-fading) .nav__inner {
    transform: none !important;
  }

  .nav:not(.is-open):not(.is-nav-animating):not(.is-header-fading) .nav__phone {
    opacity: 1;
    visibility: visible;
    max-width: none;
    margin: 0;
    overflow: visible;
    pointer-events: auto;
  }

  /* Шапка: fade только телефон, логотип — в панели */
  .nav.is-header-fading {
    background-color: transparent;
    border-radius: 0;
    transition: background-color 0.48s ease, border-radius 0.48s ease;
  }

  .nav.is-header-fading .nav__phone {
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.48s ease, visibility 0.48s ease;
  }

  /* Логотип — только внутри выезжающей панели, не в шапке поверх */
  .nav.is-open .nav__inner > .brand,
  .nav.is-nav-animating .nav__inner > .brand,
  .nav.is-open.is-nav-animating .nav__inner > .brand {
    --brand-mark-size: 60px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    position: absolute;
    top: 30px;
    left: 34px;
    right: auto;
    z-index: 2;
    margin: 0;
    opacity: 1;
    visibility: visible;
    transition: none;
  }

  .nav.is-open .nav__inner > .brand > .brand__name,
  .nav.is-nav-animating .nav__inner > .brand > .brand__name,
  .nav.is-open.is-nav-animating .nav__inner > .brand > .brand__name {
    font-family: var(--font-logo);
    font-weight: 400;
    text-transform: uppercase;
    font-size: 28px;
    letter-spacing: .08em;
    height: var(--brand-mark-size);
    /* Домик тяжёлый снизу — лёгкий оптический сдвиг вниз к центру масс */
    transform: translateY(2px);
  }

  .nav.is-open .nav__inner > .brand > .brand__name > .brand__line,
  .nav.is-nav-animating .nav__inner > .brand > .brand__name > .brand__line,
  .nav.is-open.is-nav-animating .nav__inner > .brand > .brand__name > .brand__line {
    line-height: 24px;
  }

  .nav.is-opening,
  .nav.is-open,
  .nav.is-closing,
  .nav.is-nav-animating {
    position: relative;
    z-index: 201;
    width: 100%;
    min-height: var(--header-h);
    border-radius: 0;
    padding-block: 0;
    overflow: visible;
    background-color: transparent;
  }

  .nav.is-opening .nav__side--left,
  .nav.is-open .nav__side--left,
  .nav.is-closing .nav__side--left { display: none; }

  .nav.is-opening .nav__side--right,
  .nav.is-open .nav__side--right,
  .nav.is-closing .nav__side--right {
    position: relative;
    z-index: 203;
    margin-left: auto;
    padding: 0;
    padding-right: clamp(16px, 4vw, 24px);
    gap: 0;
    width: auto;
  }

  .nav.is-opening .nav__phone,
  .nav.is-open .nav__phone,
  .nav.is-closing .nav__phone {
    opacity: 0;
    visibility: hidden;
    max-width: 0;
    margin: 0;
    overflow: hidden;
    pointer-events: none;
  }

  .nav.is-opening .nav__toggle span:nth-child(1),
  .nav.is-open .nav__toggle span:nth-child(1),
  .nav.is-closing .nav__toggle span:nth-child(1),
  .nav.is-nav-animating .nav__toggle span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
  }

  .nav.is-opening .nav__toggle span:nth-child(2),
  .nav.is-open .nav__toggle span:nth-child(2),
  .nav.is-closing .nav__toggle span:nth-child(2),
  .nav.is-nav-animating .nav__toggle span:nth-child(2) { opacity: 0; }

  .nav.is-opening .nav__toggle span:nth-child(3),
  .nav.is-open .nav__toggle span:nth-child(3),
  .nav.is-closing .nav__toggle span:nth-child(3),
  .nav.is-nav-animating .nav__toggle span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
  }

  .nav.is-opening .nav__inner,
  .nav.is-open .nav__inner,
  .nav.is-closing .nav__inner,
  .nav.is-nav-animating .nav__inner {
    position: fixed;
    top: 0;
    right: 0;
    left: auto;
    bottom: 0;
    width: calc(100% - 56px);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    max-width: none;
    height: 100dvh;
    min-height: 0;
    padding: 80px 20px 28px 16px;
    gap: 0;
    background: var(--green);
    border-radius: 20px 0 0 20px;
    overflow-y: auto;
    z-index: 200;
    will-change: transform;
    backface-visibility: hidden;
  }

  .nav.is-nav-animating .nav__inner {
    transition: none;
  }

  .nav.is-opening .nav__menu,
  .nav.is-open .nav__menu,
  .nav.is-closing .nav__menu {
    position: static;
    inset: auto;
    flex: 1 1 auto;
    display: flex !important;
    flex-direction: column;
    width: 100%;
    height: auto;
    min-height: 0;
    max-height: none;
    z-index: 1;
    border-radius: 0;
    padding: 0;
    margin-top: 40px;
    overflow: visible;
    background: transparent;
  }

  .nav.is-opening .nav__menu ul,
  .nav.is-open .nav__menu ul,
  .nav.is-closing .nav__menu ul {
    flex: 0 0 auto;
    gap: 8px;
    padding-left: 0;
    margin-left: 0;
    list-style: none;
  }

  .nav.is-opening .nav__item--mobile-only,
  .nav.is-open .nav__item--mobile-only,
  .nav.is-closing .nav__item--mobile-only,
  .nav.is-opening .nav__menu-footer,
  .nav.is-open .nav__menu-footer,
  .nav.is-closing .nav__menu-footer { display: block; }

  .nav.is-opening .nav__item--mobile-hide,
  .nav.is-open .nav__item--mobile-hide,
  .nav.is-closing .nav__item--mobile-hide { display: none; }

  .nav.is-opening .nav__menu a,
  .nav.is-open .nav__menu a,
  .nav.is-closing .nav__menu a {
    font-size: 18px;
    font-weight: 700;
    padding: 10px 0;
    border-radius: 0;
    background: transparent;
    color: var(--white);
    text-decoration: none;
  }

  .nav.is-opening .nav__menu a:hover,
  .nav.is-open .nav__menu a:hover,
  .nav.is-closing .nav__menu a:hover { background: transparent; }

  .nav.is-opening .nav__menu a.is-active,
  .nav.is-open .nav__menu a.is-active,
  .nav.is-closing .nav__menu a.is-active {
    background: transparent;
    color: var(--white);
    padding: 10px 0;
    text-decoration: underline;
    text-underline-offset: 4px;
    text-decoration-thickness: 2px;
  }

  .nav__menu-footer {
    margin-top: auto;
    padding-top: 20px;
  }

  .nav__tagline {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.25;
    color: var(--white);
    max-width: 229px;
  }

  .nav__menu-socials {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 24px;
  }

  .nav.is-opening .nav__menu-socials .soc,
  .nav.is-open .nav__menu-socials .soc,
  .nav.is-closing .nav__menu-socials .soc,
  .nav__menu-socials .soc {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    width: 44px;
    height: 44px;
    background: transparent;
    border: 2px solid #fff;
    border-radius: 50% !important;
    color: var(--white);
  }

  .nav.is-opening .nav__menu-socials .soc svg,
  .nav.is-open .nav__menu-socials .soc svg,
  .nav.is-closing .nav__menu-socials .soc svg,
  .nav__menu-socials .soc svg {
    width: 24px;
    height: 24px;
    display: block;
    flex-shrink: 0;
  }

  .nav__menu-socials .soc:hover {
    background: transparent;
    opacity: .92;
    transform: none;
  }

  .nav__menu-phone {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 100%;
    min-height: 51px;
    margin-top: 16px;
    padding: 14px 24px;
    border: 1.5px solid var(--white);
    border-radius: 100px !important;
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: 700;
    color: var(--white);
    text-align: center;
    text-decoration: none;
  }

  .nav__menu-phone:hover { background: rgba(255, 255, 255, .1); }

  /* Шапка плавно возвращается после закрытия меню */
  .nav.is-header-revealing {
    background-color: var(--green);
    border-radius: 15px;
    transition: background-color 0.48s ease, border-radius 0.48s ease;
  }

  .nav.is-header-revealing .brand,
  .nav.is-header-revealing .nav__phone {
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.48s ease, visibility 0.48s ease;
  }

  @media (prefers-reduced-motion: reduce) {
    body.nav-open::before,
    .nav,
    .nav__inner,
    .brand,
    .nav__phone {
      transition-duration: 0.01ms !important;
    }
  }

  /* ----- Modals ----- */
  .modal {
    place-items: start center;
    padding: 16px;
    padding-top: max(20px, 10vh, env(safe-area-inset-top));
  }

  .modal__dialog {
    padding: 28px 22px 32px;
    border-radius: 25px;
    max-height: calc(100dvh - 32px);
  }

  .modal__close {
    top: 12px;
    right: 14px;
    font-size: 28px;
    color: var(--gray);
  }

  .modal--lead .modal__dialog {
    max-width: var(--mobile-content);
    background: #eeeeee;
    text-align: center;
  }

  .modal--lead .modal__title {
    font-weight: 700;
    font-size: 22px;
    line-height: 1.2;
    color: var(--green);
    margin-bottom: 8px;
  }

  .modal--lead .modal__text {
    font-size: 12px;
    line-height: 1.45;
    margin-top: 12px;
  }

  .modal--lead .modal__text--desc {
    font-size: 12px;
    color: var(--ink);
    margin-top: 8px;
  }

  .modal--lead .lead-form {
    margin-top: 16px;
    text-align: left;
  }

  .modal--lead .lead-form__field--phone {
    display: flex;
    align-items: baseline;
    gap: 8px;
    border-bottom: 2px solid rgba(0, 0, 0, .85);
  }

  .modal--lead .lead-form__field--phone input {
    flex: 1 1 auto;
    min-width: 0;
    border-bottom: 0;
    padding: 10px 0;
    font-size: 14px;
    line-height: 1.35;
    font-weight: 400;
  }

  .modal--lead .lead-form__field--phone input::placeholder {
    font-size: 14px;
    opacity: 1;
  }

  .modal--lead .lead-form__field:not(.lead-form__field--phone) input {
    font-size: 14px;
    padding: 10px 0;
    border-bottom: 2px solid rgba(0, 0, 0, .85);
    text-align: left;
  }

  .modal--lead .lead-form__country {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    flex: 0 0 auto;
    font-size: 14px;
    font-weight: 400;
    color: var(--ink);
    line-height: 1.35;
    padding: 11px 6px 9px 2px;
    border-bottom: 0;
    background: transparent;
    border-radius: 0;
    appearance: none;
    -webkit-appearance: none;
    outline: none;
    cursor: pointer;
  }

  .modal--lead .lead-form__note {
    font-size: 11px;
    margin-top: 4px;
  }

  .modal--lead .lead-form__consent {
    font-size: 11px;
    gap: 8px;
    margin-top: 10px;
  }

  .modal--lead .lead-form__consent input[type="checkbox"] {
    flex: 0 0 16px;
    width: 16px;
    height: 16px;
    margin-top: 2px;
  }

  .modal--lead .lead-form__submit {
    width: 100%;
    min-width: 0;
    max-width: none;
    min-height: 40px;
    margin-top: 14px;
    font-size: 12px;
    font-weight: 400;
    padding: 8px 16px;
  }

  .modal--lead .lead-form__result {
    font-size: 11px;
    line-height: 1.4;
    margin-top: 10px;
    color: var(--ink);
    min-height: 2.5em;
  }

  .modal--lead .lead-form__result:empty {
    min-height: 2.5em;
  }

  .contacts__form .lead-form__result,
  .lead-form__result {
    min-height: 2.5em;
    line-height: 1.4;
  }

  .modal--thanks {
    place-items: center;
    padding-top: 20px;
  }

  .modal--thanks .modal__dialog {
    max-width: var(--mobile-content);
    text-align: center;
    padding: 32px 24px 28px;
    background: var(--white);
  }

  .modal--thanks .modal__check,
  .modal--thanks .btn { display: none; }

  .modal--thanks .modal__title {
    font-weight: 700;
    font-size: 22px;
    line-height: 1.2;
    color: var(--green);
  }

  .modal--thanks .modal__text {
    font-size: 12px;
    line-height: 1.45;
    color: var(--ink);
    margin-top: 10px;
  }

  /* ----- Hero ----- */
  .hero {
    height: 835px;
    min-height: 835px;
    max-height: 835px;
    overflow: hidden;
    align-items: flex-start;
  }

  .hero__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 140px;
    padding-bottom: 0;
    gap: 12px;
  }

  .hero__headline { order: 1; }
  .hero__tagline {
    order: 2;
    display: contents;
  }
  .hero__aside {
    order: 3;
    gap: 12px;
    margin-top: 40px;
    align-self: stretch;
    width: 100%;
  }
  .hero__tagline p { order: 3; margin-bottom: 40px; }
  .hero__cta { order: 2; margin-top: 0; }

  .hero__headline {
    align-self: center;
    width: 100%;
    max-width: var(--mobile-content);
    margin-inline: auto;
    min-height: 200px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    text-align: center;
    padding-bottom: 4px;
  }

  .hero__title {
    font-size: 32px;
    line-height: 1.12;
    font-weight: 600;
    max-width: var(--mobile-content);
    text-align: center;
  }

  .hero__subtitle {
    font-family: var(--font-head);
    font-size: 14px;
    margin-top: 10px;
    font-weight: 600;
    text-align: center;
  }

  .hero__tagline p {
    align-self: center;
    width: 100%;
    max-width: var(--mobile-content);
    margin-inline: auto;
    font-size: 12px;
    line-height: 1.45;
    font-weight: 400;
    text-align: center;
  }

  .hero__desc p {
    font-size: 10px;
    line-height: 1.45;
    padding: 14px 16px;
    border-radius: 15px;
  }

  .hero__cta {
    align-self: center;
    width: 100%;
    max-width: var(--mobile-content);
    margin-inline: auto;
    min-height: 50px;
    font-size: 14px;
    font-weight: 400;
    padding-block: 14px;
    border-radius: var(--radius-pill);
    margin-top: -6px;
  }

  .hero__stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-top: 22px;
  }

  .stat {
    min-height: 118px;
    padding: 16px 10px 12px;
    border-radius: 15px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    text-align: left;
    overflow: visible;
  }

  .stat__icon {
    width: 28px;
    height: 28px;
    position: absolute;
    top: -14px;
    left: 20px;
    transform: none;
    margin-bottom: 0;
    z-index: 2;
  }

  .stat__icon svg { width: 14px; height: 14px; }

  .stat__num {
    display: block;
    font-size: 24px;
    margin-top: 8px;
    text-align: left;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
  }

  .stat__label {
    display: block;
    font-size: 10px;
    margin-top: 6px;
    line-height: 1.2;
    width: 100%;
    max-width: none;
    margin-inline: 0;
    align-self: stretch;
    text-align: left;
    flex: 0 0 auto;
  }

  .hero__stats .stat:nth-child(2) .stat__label {
    font-size: 10px;
    line-height: 1.15;
  }

  /* ----- Credits ----- */
  .section--credits {
    padding-bottom: 0;
  }

  .section--credits .sec-head { padding-inline: 0; margin-bottom: 31px; }
  .section--credits .sec-head__subtitle {
    max-width: var(--mobile-content);
    margin-inline: auto;
    text-align: left;
  }

  .credits__grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .credits__divider {
    display: block !important;
    width: 100%;
    height: 80px;
    background-image: url('../icons/connector-credits-h.svg?v=0213');
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: center;
  }
  .credits__divider img { display: none !important; }

  .credit-card {
    display: flex;
    flex-direction: column;
    border-radius: var(--radius-mobile);
    max-width: var(--mobile-content);
    margin-inline: auto;
    overflow: hidden;
  }

  .credit-card:first-of-type { height: 473px; }
  .credit-card:last-of-type { height: 493px; }

  .credit-card__media { aspect-ratio: 340 / 224; flex-shrink: 0; }

  .credit-card__overlay {
    left: 16px;
    right: 16px;
    bottom: 16px;
  }

  /* Card 2: top-right overlay — Figma mobile ~20px from image right (595→340 scale) */
  .credit-card__overlay--top-right {
    top: 17px;
    right: 20px;
    bottom: auto;
    left: auto;
    max-width: calc(100% - 40px);
  }

  .credit-card__over-top { font-size: 12px; }
  .credit-card__over-brand { font-size: 24px; }

  .credit-card__body {
    padding: 12px 16px 16px;
    flex: 1;
    min-height: 0;
    justify-content: space-between;
    gap: 0;
  }

  .credit-card__title {
    font-size: 14px;
    font-weight: 700;
    line-height: 1.25;
    flex-shrink: 0;
  }
  .credit-card__title { text-align: center; }

  .credit-card__desc {
    font-size: 12px;
    color: var(--gray);
    margin: 0;
    line-height: 1.35;
    flex-shrink: 0;
    text-align: justify;
    hyphens: auto;
  }

  .credit-card__conditions {
    grid-template-columns: 76fr 153fr 210fr;
    column-gap: 6px;
    text-align: center;
    flex-shrink: 0;
  }

  .credit-card__cond-value { font-size: 12px; }
  .credit-card__cond-label { font-size: 12px; }

  .credit-card__actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    width: 100%;
    max-width: var(--mobile-content);
    margin-top: 0;
    padding-top: 0;
    flex-shrink: 0;
  }

  .credit-card__actions .btn {
    max-width: 150px;
    min-width: 0;
    min-height: 35px;
    font-size: 12px;
    font-weight: 700;
    padding: 10px 12px;
    border-radius: var(--radius-pill);
  }

  /* ----- Projects ----- */
  .section--projects {
    --pcard: min(280px, 74.67vw);
    background: var(--white);
    height: auto;
    max-height: none;
    padding-bottom: 0;
    overflow: hidden;
  }

  .section--projects + .quote-band {
    margin-top: 0;
  }

  /* Homepage CTA → next block: gap on button bottom, not between cards and button */
  #blog.section--blog + #gallery.section--gallery,
  #gallery.section--gallery + .advantages-band,
  #reviews.section--reviews + #credits.section--credits {
    margin-top: 0;
  }

  .section--projects .container,
  .projects__viewport {
    background: var(--white);
  }

  .projects__track {
    --pcard: min(280px, 74.67vw);
    gap: 22px;
    padding-block: 16px 0;
    padding-inline: calc(50% - var(--pcard) / 2);
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
  }

  /* Во время программной анимации (стрелки/точки) снап мешает плавности — отключаем,
     для свайпа пальцем снап остаётся. */
  .projects__track.carousel-animating,
  .projects__track.carousel-jumping {
    scroll-snap-type: none;
  }

  .project-card {
    flex: 0 0 var(--pcard);
    width: var(--pcard);
    max-width: var(--pcard);
    height: calc(var(--pcard) * 700 / 860);
    aspect-ratio: auto;
    border-radius: var(--radius-mobile);
    overflow: hidden;
    transform: none;
    scroll-snap-align: center;
    z-index: 1;
  }

  .project-card.is-active {
    transform: none;
    z-index: 2;
  }

  .project-card.is-active + .project-card {
    transform: translateX(-6px);
  }

  .project-card:has(+ .project-card.is-active) {
    transform: translateX(6px);
  }

  .project-card__inner { padding: 22px 24px 24px; }
  .project-card__name { font-size: 24px; font-weight: 400; }
  .project-card__foot { gap: 1px; }
  .project-card__tagline { font-size: 24px; font-weight: 500; line-height: 1; margin: 0; }
  .project-card__meta { font-size: 13px; line-height: 1.1; margin: 0; }
  .project-card__meta .area-sup { font-size: 0.6em; }
  .project-card__btn {
    font-size: 10px;
    padding: 8px 15px;
    margin-top: 18px;
    min-height: 34px;
    max-width: 150px;
  }

  .projects__nav {
    margin-top: 28px;
    margin-bottom: var(--mobile-section-gap);
  }

  .projects__nav .carousel-btn {
    width: 120px;
    min-width: 120px;
    height: 40px;
    font-size: 14px;
  }

  .projects__nav-sep {
    height: 28px;
    margin: 0 10px;
  }

  .projects__dots { display: none; }

  /* ----- Quote bands ----- */
  .quote-band {
    aspect-ratio: auto;
    height: 437px;
    min-height: 437px;
    max-height: 437px;
    overflow: hidden;
  }

  .quote-band__inner {
    position: relative;
    min-height: 437px;
    height: 437px;
    padding: 40px var(--mobile-gutter) 72px;
    box-sizing: border-box;
  }

  .quote-band__headline { font-size: 20px; line-height: 1.25; }
  .quote-band__sub { font-size: 16px; margin-left: 0; margin-top: 8px; }

  .quote-band--happy .quote-band__headline {
    font-family: var(--font-subtitle);
    font-weight: 400;
    letter-spacing: 0.05em;
  }

  .quote-band--happy .quote-band__sub {
    font-family: var(--font-subtitle);
    font-weight: 400;
    font-size: 14px;
    letter-spacing: 0.05em;
    margin-left: 0;
    margin-top: 8px;
  }

  .quote-band--happy .quote-band__inner { padding-top: 48px; }

  .quote-band__brand {
    --brand-mark-size: 24px;
    position: absolute;
    left: var(--mobile-gutter);
    bottom: 24px;
    font-family: "Alegreya", Georgia, serif;
    font-size: 12px;
    letter-spacing: .08em;
    text-transform: none;
    gap: 8px;
    opacity: .55;
  }

  .quote-band__brand svg {
    width: var(--brand-mark-size);
    height: var(--brand-mark-size);
  }

  .quote-band--happy .quote-band__brand {
    position: static;
    margin-top: auto;
    align-self: flex-start;
    left: auto;
    bottom: auto;
    opacity: .35;
    gap: 10px;
    --brand-mark-size: 36px;
    font-family: var(--font-body);
    font-weight: 500;
    font-size: 18px;
    letter-spacing: .04em;
    text-transform: uppercase;
  }

  .quote-band--happy .quote-band__brand svg {
    width: var(--brand-mark-size);
    height: var(--brand-mark-size);
  }

  .story-band {
    position: relative;
    aspect-ratio: auto;
    height: 437px;
    min-height: 437px;
    max-height: 437px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 56px 0 24px;
    overflow: hidden;
    box-sizing: border-box;
  }

  .story-band__bg {
    position: absolute;
    inset: 0;
  }

  .story-band__brand {
    --brand-mark-size: 28px;
    position: absolute;
    top: 20px;
    right: var(--mobile-gutter);
    z-index: 2;
    font-size: 14px;
    gap: 8px;
    opacity: .42;
  }

  .story-band__logo {
    width: var(--brand-mark-size);
    height: var(--brand-mark-size);
  }

  .story-band__panel {
    position: relative;
    z-index: 1;
    margin-inline: 0;
    overflow: hidden;
    background: rgba(0, 0, 0, .2);
    backdrop-filter: blur(1px);
    -webkit-backdrop-filter: blur(1px);
    box-sizing: border-box;
  }

  .story-band__panel--top {
    position: absolute;
    left: 0;
    right: auto;
    top: 68px;
    width: 100%;
    max-width: none;
    margin: 0;
    margin-top: 0;
    padding: 23px 18px 20px 23px;
    border-radius: 0;
  }

  .story-band__panel--top p {
    width: 100%;
    max-width: none;
    margin-left: 0;
    padding-left: 14px;
    border-left: 2px solid var(--white);
    font-size: 9px;
    line-height: 1.45;
    box-sizing: border-box;
  }

  .story-band__panel--bottom {
    position: absolute;
    left: auto;
    right: 0;
    top: auto;
    bottom: 60px;
    width: 76.53%;
    max-width: none;
    margin: 0;
    padding: 21px 18px 20px 23px;
    border-top-left-radius: var(--radius-mobile);
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: var(--radius-mobile);
    align-self: auto;
  }

  .story-band__panel-body {
    width: 100%;
    max-width: none;
    padding-left: 14px;
    border-left: 2px solid var(--white);
    box-sizing: border-box;
  }

  .story-band__panel-body p { font-size: 9px; line-height: 1.45; }
  .story-band__author { font-size: 8px; margin-top: 16px; }
  .story-band__author strong { font-size: 8px; font-weight: 700; }
  .story-band__author span { font-size: 8px; }
  .story-band__brand { font-size: 12px; }

  /* ----- Quality ----- */
  .section--quality {
    height: auto;
    max-height: none;
    overflow: hidden;
  }

  .section--quality .sec-head { margin-bottom: 31px; }

  .quality__rows { gap: 50px; margin-top: 0; }

  .quality-row,
  .quality-row--reverse {
    grid-template-rows: auto auto auto;
    padding-inline: 0;
    max-width: none;
    gap: 15px;
  }

  .quality-slider,
  .quality-row--reverse .quality-slider {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
    height: 200px;
    min-height: 200px;
    border-radius: var(--radius-mobile);
  }

  .quality-slider__label {
    top: 10px;
    left: 18px;
    right: auto;
    max-width: calc(100% - 36px);
    font-size: 13px;
    font-weight: 700;
    text-align: left;
  }

  .quality-row__features,
  .quality-row--reverse .quality-row__features {
    grid-row: 3;
    padding-inline: var(--mobile-gutter);
    gap: 16px;
    height: auto;
  }

  .qfeature__title {
    font-size: 14px;
    font-weight: 700;
    color: var(--green);
  }
  .qfeature__desc { font-size: 12px; color: var(--gray); margin-top: 6px; line-height: 1.45; text-align: justify; hyphens: auto; }

  .quality-row__nav,
  .quality-row--reverse .quality-row__nav {
    grid-row: 2;
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    padding-inline: var(--mobile-gutter);
    margin-top: -5px;
    margin-bottom: 2px;
    gap: 10px;
  }

  .quality-arrow,
  .quality-row__nav-btn {
    width: 60px;
    height: 20px;
    min-height: 20px;
  }

  .quality-slider .g-slider__dot {
    width: 6px;
    height: 6px;
  }

  .quality-slider .g-slider__dot.is-active {
    width: 8px;
    height: 8px;
  }

  /* ----- Overview — Figma «Обзор» 375×742, «Карточка» 375×175 ----- */
  .section--overview {
    min-height: 790px;
    overflow-x: clip;
    overflow-y: visible;
    box-sizing: border-box;
  }

  .section--overview .container {
    overflow: visible;
  }

  .section--overview .sec-head {
    margin-bottom: 25px;
    overflow: visible;
  }

  .overview__list {
    display: flex;
    flex-direction: column;
    width: 100vw;
    max-width: 100vw;
    margin-inline: calc(50% - 50vw);
    padding-inline: 0;
    gap: 25px;
    overflow-x: visible;
    scroll-snap-type: none;
  }

  .overview__list::-webkit-scrollbar { display: none; }

  .overview__list > * {
    flex: none;
    scroll-snap-align: unset;
    width: 100%;
  }

  .ov-gap { display: none; }

  .section--overview .ov-card {
    position: relative;
    display: block;
    width: 100%;
    max-width: none;
    height: 200px;
    min-height: 200px;
    max-height: 200px;
    border-radius: var(--radius-mobile);
    overflow: hidden;
    margin-inline: 0;
  }

  .section--overview .ov-card__media {
    position: absolute;
    inset: 0;
    min-height: 0;
    height: auto;
    aspect-ratio: auto;
    overflow: hidden;
    border-radius: 0;
  }

  .section--overview .ov-card__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }

  .section--overview .ov-card__panel {
    position: absolute;
    top: 0;
    bottom: 0;
    height: auto;
    right: 0;
    width: 197px;
    padding: 16px 18px;
    justify-content: center;
    align-items: flex-start;
    border-radius: var(--radius-mobile);
    box-sizing: border-box;
    z-index: 1;
  }

  .section--overview .ov-card--reverse .ov-card__panel {
    right: auto;
    left: 0;
    width: 198px;
    padding: 16px 18px;
    border-radius: var(--radius-mobile);
  }

  .ov-card__copy {
    width: 100%;
    max-width: none;
    margin-inline: 0;
    align-self: stretch;
  }

  .ov-card__title {
    display: block;
    width: 100%;
    box-sizing: border-box;
    font-size: 12px;
    font-family: var(--font-head);
    font-weight: 700;
    line-height: normal;
    letter-spacing: 0;
    padding-bottom: 4px;
    border-bottom-width: 1px;
    text-align: left;
    white-space: nowrap;
  }

  .ov-card__text {
    font-size: 8px;
    line-height: 1.35;
    margin-top: 6px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    overflow: hidden;
    width: 100%;
    box-sizing: border-box;
    text-align: justify;
    hyphens: auto;
  }

  .ov-card__btn {
    align-self: center;
    margin-top: 10px;
    min-width: 0;
    width: min(130px, 100%);
    max-width: 100%;
    min-height: 30px;
    padding: 8px 12px;
    font-size: 8px;
    font-weight: 700;
    border-radius: var(--radius-mobile);
  }

  /* ----- Blog (главная — auto height; архив — полный список) ----- */
  #blog.section--blog {
    height: auto;
    max-height: none;
    overflow: visible;
    padding-bottom: 0;
    box-sizing: border-box;
  }

  .section--blog-archive {
    height: auto;
    max-height: none;
    overflow: visible;
    padding-top: calc(var(--header-h) + 24px);
    padding-bottom: 50px;
  }

  .section--blog-archive .blog__more,
  .section--reviews-archive .reviews__more {
    margin-top: 25px;
    margin-bottom: 0;
  }

  .section--blog-archive .blog__more .btn {
    width: 180px;
    min-width: 180px;
    min-height: 40px;
    padding: 10px 16px;
    font-size: 11px;
  }

  #blog.section--blog .sec-head,
  .section--blog-archive .sec-head {
    margin-bottom: 10px;
    text-align: center;
  }

  #blog.section--blog .sec-head__title,
  .section--blog-archive .sec-head__title {
    width: 100%;
    text-align: center;
    margin-inline: auto;
  }

  /* blog subtitle composite alignment — see end of file */

  .blog__grid {
    gap: 25px;
    max-width: var(--mobile-content);
    margin-inline: auto;
  }

  .blog-card {
    width: 100%;
    max-width: var(--mobile-content);
    height: 200px !important;
    min-height: 0 !important;
    max-height: 200px;
    aspect-ratio: auto;
    border-radius: var(--radius-mobile);
  }

  .blog-card__panel {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 76px;
    max-height: 76px;
    padding: 8px 42px 10px 10px;
    background: rgba(0, 0, 0, .55);
    box-sizing: border-box;
  }

  .blog-card__title {
    flex-shrink: 0;
    font-size: 9px;
    line-height: 1.2;
    font-weight: 700;
  }

  .blog-card__excerpt {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    flex: 1 1 auto;
    min-height: 0;
    font-size: 7px;
    margin-top: 5px;
    line-height: 1.3;
    text-align: justify;
    hyphens: auto;
  }

  .blog-card__date {
    flex-shrink: 0;
    margin-top: auto;
    margin-bottom: 0;
    font-size: 6px;
  }

  .blog-card__arrow {
    display: grid;
    place-items: center;
    position: absolute;
    z-index: 3;
    top: auto;
    bottom: calc(76px / 2);
    right: 14px;
    transform: translateY(50%);
    width: auto;
    height: auto;
    opacity: 1;
  }

  .blog-card:hover .blog-card__arrow {
    transform: translateY(50%) translateX(4px);
  }

  .blog-card__arrow svg { width: 24px; height: auto; }

  #blog .blog__more,
  #gallery .gallery__footer,
  #reviews .reviews__more {
    margin-top: 25px;
    margin-bottom: var(--mobile-section-gap);
  }

  .blog__all-btn-label--mobile { display: inline; }
  .blog__all-btn-label--desktop { display: none; }

  .gallery__all-btn-label--mobile { display: inline; }
  .gallery__all-btn-label--desktop { display: none; }

  #blog .blog__more .btn {
    width: 180px;
    min-height: 40px;
    font-size: 11px;
    padding: 10px 16px;
  }


  /* ----- Gallery (главная — мозаика Figma «Телефон») ----- */
  #gallery.section--gallery {
    --gallery-band-h: 160px;
    --gallery-tail-h: 160px;
    background: var(--white);
    height: auto;
    max-height: none;
    overflow: visible;
    padding-bottom: 0;
    box-sizing: border-box;
  }

  #gallery .container {
    overflow: visible;
  }

  #gallery .g-item--g07,
  #gallery .g-item--g08,
  #gallery .g-item--g09,
  #gallery .g-item--g12 { display: none !important; }

  #gallery .gallery__grid {
    display: grid !important;
    grid-template-columns: 170px 150px !important;
    grid-auto-rows: 170px !important;
    gap: 20px;
    max-width: var(--mobile-content);
    margin-inline: auto;
    padding-inline: 0;
  }

  #gallery .g-item:not(.g-quote) {
    border-radius: var(--radius-mobile);
    min-height: 0 !important;
    height: 170px !important;
    margin: 0 !important;
    padding: 0 !important;
    align-self: stretch;
  }

  #gallery .g-item.g-quote {
    max-width: none;
    overflow: hidden;
    box-sizing: border-box;
  }

  /* Right bleed: green g03 — square off the bleeding (right) corners */
  #gallery .g-item--g03.g-quote {
    margin-right: calc(-1 * var(--mobile-edge-bleed)) !important;
    margin-left: 0 !important;
    width: calc(100% + var(--mobile-edge-bleed));
    padding: 14px calc(16px + var(--mobile-edge-bleed)) 14px 16px !important;
    border-radius: var(--radius-mobile) 0 0 var(--radius-mobile);
  }

  /* Right bleed: outline g10 (+2px for border) — square off the bleeding (right) corners */
  #gallery .g-item--g10.g-quote {
    margin-right: calc(-1 * (var(--mobile-edge-bleed) + 2px)) !important;
    margin-left: 0 !important;
    width: calc(100% + var(--mobile-edge-bleed) + 2px);
    padding: 14px calc(16px + var(--mobile-edge-bleed) + 2px) 14px 16px !important;
    border-radius: var(--radius-mobile) 0 0 var(--radius-mobile);
  }

  /* Left bleed: black g04 */
  #gallery .g-item--g04.g-quote {
    margin-left: calc(-1 * var(--mobile-edge-bleed)) !important;
    margin-right: 0 !important;
    width: calc(100% + var(--mobile-edge-bleed));
    padding: 14px 16px 14px calc(16px + var(--mobile-edge-bleed)) !important;
    border-radius: 0 var(--radius-mobile) var(--radius-mobile) 0;
  }

  #gallery .g-item[class*="g-item--g"]:not(.g-quote) {
    aspect-ratio: auto !important;
    width: auto;
    min-height: 170px !important;
    padding-right: 0 !important;
  }

  /* Порядок ячеек как в макете 375px (не DOM-порядок) */
  #gallery .g-item--g01 { grid-row: 1 !important; grid-column: 1 !important; }
  #gallery .g-item--g03 { grid-row: 1 !important; grid-column: 2 !important; }
  #gallery .g-item--g05 { grid-row: 2 !important; grid-column: 1 / -1 !important; }
  #gallery .g-item--g04 { grid-row: 3 !important; grid-column: 1 !important; }
  #gallery .g-item--g02 { grid-row: 3 !important; grid-column: 2 !important; }
  #gallery .g-item--g06 { grid-row: 4 !important; grid-column: 1 / -1 !important; }
  #gallery .g-item--g11 { grid-row: 5 !important; grid-column: 1 !important; }
  #gallery .g-item--g10 { grid-row: 5 !important; grid-column: 2 !important; }
  #gallery .g-item--g07 { grid-row: 6 / span 2 !important; grid-column: 1 / -1 !important; height: auto !important; min-height: 340px !important; }
  #gallery .g-item--g08 { grid-row: 8 !important; grid-column: 1 / -1 !important; height: auto !important; min-height: 0 !important; }
  #gallery .g-item--g09 { grid-row: 9 !important; grid-column: 1 / -1 !important; }
  #gallery .g-item--g12 { grid-row: 10 !important; grid-column: 1 / -1 !important; }

  #gallery .g-item--g08 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    background: transparent;
  }

  #gallery .g-item--g08 .g-stack__item {
    min-height: 160px;
    height: 160px;
    border-radius: var(--radius-mobile);
  }

  #gallery .g-quote {
    min-height: 170px !important;
    height: 170px !important;
    align-self: stretch;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
  }

  #gallery .g-quote p { font-size: 12px; line-height: 1.35; margin: 0; }
  #gallery .g-quote cite { font-size: 6px; margin-top: auto; padding-top: 8px; }

  #gallery .g-item--g03.g-quote {
    position: relative;
    justify-content: flex-start;
  }

  #gallery .g-item--g03.g-quote cite {
    position: absolute;
    right: 18px;
    bottom: 18px;
    left: auto;
    margin-top: 0;
    padding-top: 0;
    text-align: right;
  }

  #gallery .g-item--g10.g-quote {
    justify-content: flex-end;
  }

  #gallery .g-item--g10.g-quote cite {
    align-self: flex-start;
    text-align: left;
    margin-top: 6px;
  }

  #gallery .g-item--g07.g-quote {
    justify-content: center;
    align-items: center;
    text-align: center;
  }

  #gallery .g-item--g07.g-quote p {
    font-size: 10px;
    line-height: 1.45;
    text-align: center;
    max-width: 92%;
  }

  #gallery .g-quote--black {
    justify-content: center;
    text-align: center;
  }

  #gallery .g-quote--black p { font-size: 12px; line-height: 1.35; }

  #gallery .g-quote--outline p { font-size: 12px; line-height: 1.3; }

  #gallery .g-slider__nav,
  #gallery .g-slider__dots { display: flex; }

  /* Slider nav: overlay on photo (same as desktop), never below the cell */
  #gallery .g-item.g-slider {
    position: relative;
    overflow: hidden;
  }

  #gallery .g-slider__nav {
    top: 50%;
    bottom: auto;
    transform: translateY(-50%);
    z-index: 4;
  }

  #gallery .g-slider__nav--prev { left: 12px; }
  #gallery .g-slider__nav--next { right: 12px; }

  #gallery .g-slider__dots {
    bottom: 14px;
    gap: 6px;
  }

  #gallery .g-slider__dots .g-slider__dot {
    width: 5px;
    height: 5px;
  }

  #gallery .g-slider__dots .g-slider__dot.is-active {
    width: 7px;
    height: 7px;
  }

  #gallery .g-slider .quality-arrow {
    width: 42px;
    height: 18px;
    background: rgba(255, 255, 255, .72);
    border-color: rgba(255, 255, 255, .95);
    color: var(--ink);
  }

  #gallery .gallery__more .btn,
  #gallery .gallery__footer .btn {
    width: 210px;
    min-height: 48px;
    font-size: 13px;
    padding: 12px 20px;
  }

  #gallery .gallery__footer {
    text-align: center;
  }

  #gallery .gallery__footer .btn {
    display: inline-flex;
    margin-inline: auto;
  }

  .gallery__all-btn-label--mobile { display: inline; }
  .gallery__all-btn-label--desktop { display: none; }

  /* ----- Advantages (Преимущества) — Figma «Телефон» only ----- */
  .advantages-band {
    display: block;
    position: relative;
    width: 100vw;
    max-width: 100%;
    margin-left: calc(50% - 50vw);
    background:
      linear-gradient(180deg, rgba(0, 0, 0, .08) 0%, rgba(0, 0, 0, .28) 100%),
      url('../img/story-bg.jpg') center / cover no-repeat;
    height: 500px;
    min-height: 500px;
    max-height: 500px;
    padding: 0;
    box-sizing: border-box;
    overflow: hidden;
  }

  .advantages-band__steps { display: none; }

  .advantages-band__inner {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: none;
    height: 500px;
    margin-inline: 0;
    padding: 0;
  }

  .advantages-band .adv-block {
    position: absolute;
    margin: 0;
    max-width: none;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: 6px;
    min-height: 96px;
    padding: 10px 12px;
    background: rgba(0, 0, 0, .26);
    border-radius: 0;
    box-sizing: border-box;
  }

  .advantages-band .adv-block--left {
    left: 0;
    width: calc(50% + 2px);
    padding-left: calc(var(--mobile-gutter) + 10px);
    border-radius: 0 var(--radius-mobile) var(--radius-mobile) 0;
  }

  .advantages-band .adv-block--right {
    right: 0;
    left: auto;
    width: calc(50% + 2px);
    padding-right: calc(var(--mobile-gutter) + 10px);
    border-radius: var(--radius-mobile) 0 0 var(--radius-mobile);
  }

  .advantages-band .adv-block__accent {
    position: absolute;
    top: 10px;
    bottom: 10px;
    width: 1px;
    background: rgba(255, 255, 255, .75);
  }

  .advantages-band .adv-block--left .adv-block__accent { left: calc(var(--mobile-gutter) + 2px); }
  .advantages-band .adv-block--right .adv-block__accent {
    right: calc(var(--mobile-gutter) + 2px);
    left: auto;
  }

  .advantages-band .adv-block__title {
    font-size: 12px;
    font-weight: 700;
    line-height: 1.25;
    color: #fff;
    margin: 0;
    flex: 0 0 auto;
  }

  .advantages-band .adv-block__text {
    font-size: 8px;
    line-height: 1.45;
    color: #fff;
    margin: 0;
    opacity: .95;
    flex: 0 0 auto;
    align-self: stretch;
    text-align: justify;
    hyphens: auto;
  }

  .advantages-band .adv-block--left .adv-block__title,
  .advantages-band .adv-block--left .adv-block__text { padding-left: 10px; }

  .advantages-band .adv-block--right .adv-block__title {
    padding-right: 10px;
    text-align: right;
    font-size: 11px;
  }

  .advantages-band .adv-block--right .adv-block__text {
    padding-right: 10px;
    text-align: right;
    hyphens: none;
  }

  /* Позиции advantages 375×500 */
  .advantages-band .adv-block--1 { top: 10px; }
  .advantages-band .adv-block--2 { top: 112px; }
  .advantages-band .adv-block--3 { top: 228px; }
  .advantages-band .adv-block--4 { top: 348px; }

  .advantages-band__cta {
    display: none;
  }

  /* ----- Gallery archive (отдельная страница — только фото) ----- */
  body.post-type-archive-elit_gallery:not(.home) .site-main {
    background: var(--white);
  }

  .section--gallery-archive {
    background: var(--white);
    height: auto;
    max-height: none;
    overflow: visible;
    box-sizing: border-box;
    position: relative;
    padding: calc(var(--header-h) + 18px) 0 calc(50px + var(--radius-mobile));
  }

  .section--gallery-archive::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: var(--radius-mobile);
    background: var(--white);
    z-index: 1;
  }

  .section--gallery-archive .sec-head {
    margin-bottom: 25px;
    padding-left: 23px;
  }

  .section--gallery-archive .sec-head__subtitle {
    padding-left: 0;
  }

  .section--gallery-archive > .container {
    width: calc(100% - 36px);
    max-width: none;
  }

  /* Archive: sequential 2-col flow — no bento row bands (avoids phantom gaps) */
  .section--gallery-archive .gallery__grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    grid-template-rows: none !important;
    grid-auto-rows: auto !important;
    grid-auto-flow: row !important;
    gap: 15px;
    max-width: var(--mobile-content);
    margin-inline: auto;
    padding-inline: 0;
  }

  .section--gallery-archive .g-item.g-photo,
  .section--gallery-archive .g-item[class*="g-item--g"] {
    grid-row: auto !important;
    grid-column: auto !important;
    border-radius: var(--radius-mobile);
    margin: 0 !important;
    padding: 0 !important;
    width: 100%;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 1 / 1;
    align-self: stretch;
  }

  .section--gallery-archive .g-item.g-photo:nth-child(3n) {
    grid-column: 1 / -1 !important;
    aspect-ratio: 335 / 200;
  }

  .section--gallery-archive .gallery-archive__pagination {
    margin-top: 40px;
    text-align: center;
  }

  .gallery-archive__empty,
  .types-page__empty,
  .reviews-archive__empty {
    max-width: var(--mobile-content);
    margin: 24px auto 0;
    font-size: 12px;
    line-height: 1.45;
    color: var(--gray);
    text-align: center;
  }

  /* ----- Gallery lightbox (полноэкранный просмотр) ----- */
  .modal--gallery-lightbox:not([hidden]) {
    padding: 0 !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
  }

  .modal--gallery-lightbox[hidden] {
    display: none !important;
  }

  .modal--gallery-lightbox .modal__backdrop {
    background: #000;
  }

  .gallery-lightbox__stage {
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100dvh;
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .gallery-lightbox__img {
    max-width: 100%;
    max-height: 100dvh;
    width: auto;
    height: auto;
    object-fit: contain;
  }

  .gallery-lightbox__brand {
    --brand-mark-size: 20px;
    position: fixed;
    top: 16px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1003;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #fff;
    font-size: 11px;
    pointer-events: none;
  }

  .gallery-lightbox__brand-mark {
    width: var(--brand-mark-size);
    height: var(--brand-mark-size);
  }

  .gallery-lightbox__brand-name {
    font-family: "Alegreya", Georgia, serif;
    letter-spacing: .04em;
  }

  .gallery-lightbox__close {
    position: fixed;
    top: 12px;
    right: 12px;
    z-index: 1003;
    width: 44px;
    height: 44px;
    font-size: 28px;
    background: rgba(255, 255, 255, .16);
  }

  /* ----- Reviews (главная — один отзыв, фото + панель) ----- */
  #reviews .reviews__connector,
  #reviews .review-tile--c,
  #reviews .review-tile--d {
    display: none !important;
  }

  #reviews.section--reviews {
    padding-top: 0;
    padding-bottom: 0;
    height: auto;
    min-height: 0;
    max-height: none;
    overflow: visible;
    box-sizing: border-box;
  }

  #reviews .sec-head {
    margin-bottom: 25px;
    text-align: center;
  }

  #reviews.section--reviews .sec-head__title {
    width: 100%;
    text-align: center;
    margin-inline: auto;
  }

  #reviews .sec-head__subtitle { font-size: 20px; }

  /* reviews subtitle composite alignment — see end of file */

  #reviews .reviews__mosaic {
    display: flex;
    flex-direction: column;
    aspect-ratio: auto;
    max-width: var(--mobile-content);
    margin-inline: auto;
    gap: 15px;
  }

  .review-tile {
    position: static;
    width: 100%;
    height: auto;
    border-radius: 0;
  }

  .review-tile--b { order: 1; }
  .review-tile--a { order: 2; }
  #reviews .reviews__more {
    order: 3;
    position: static;
    transform: none;
    display: flex;
    justify-content: center;
  }

  .review-tile--a,
  .review-tile--b,
  .review-tile--c,
  .review-tile--d {
    left: auto;
    top: auto;
  }

  #reviews .review-tile--a,
  #reviews .review-tile--b {
    border-radius: var(--radius-mobile);
    overflow: hidden;
  }

  .review-tile__panel {
    min-height: 267px;
    padding: 20px 18px 16px;
    border-radius: var(--radius-mobile);
  }

  .review-tile__head {
    gap: 10px;
  }

  .review-tile__avatar {
    width: 36px;
    height: 36px;
    font-size: 14px;
  }

  .review-tile__avatar--photo {
    font-size: 0;
  }

  .review-tile__name { font-size: 14px; font-weight: 700; line-height: 1.2; }
  .review-tile__city { font-size: 10px; }
  .review-tile__quote { font-size: 12px; margin-top: 12px; line-height: 1.45; text-align: justify; hyphens: auto; }

  #reviews .review-tile__foot {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px 12px;
    padding-top: 12px;
  }

  #reviews .review-tile__note {
    font-size: 8px;
    margin-top: 0;
    line-height: 1.25;
    max-width: none;
    grid-column: 1;
  }

  #reviews .review-tile__btn {
    display: inline-flex;
    padding: 10px 20px;
    font-size: 12px;
    font-weight: 700;
    margin-bottom: 0;
    align-self: center;
    justify-self: end;
    flex-shrink: 0;
    white-space: nowrap;
  }

  .review-tile__media {
    min-height: 200px;
    aspect-ratio: 340 / 200;
    border-radius: var(--radius-mobile);
  }

  .review-tile__play {
    width: var(--review-play-size);
    height: var(--review-play-size);
  }

  .review-tile__play svg {
    width: var(--review-play-icon);
    height: var(--review-play-icon);
  }

  .reviews__all-btn {
    width: 180px;
    min-width: 180px;
    max-width: 180px;
    padding-block: 10px;
    font-size: 12px;
  }

  /* ----- Blog article / review story (modal panel) ----- */
  .article {
    padding: calc(var(--header-h) + 12px) 0 60px;
    background: var(--cream);
  }

  .article > .container.article__container {
    width: calc(100% - 36px);
    max-width: none;
    margin-inline: auto;
    padding: 20px var(--mobile-gutter) 28px;
    background: #eee;
    border-radius: var(--radius-mobile);
    position: relative;
  }

  .article__back {
    position: absolute;
    top: 14px;
    left: var(--mobile-gutter);
    right: auto;
    margin: 0;
    width: auto;
    height: auto;
    font-size: 12px;
    font-weight: 400;
    color: var(--gray);
    display: inline-flex;
    align-items: center;
    gap: 4px;
    text-decoration: none;
    z-index: 2;
    white-space: nowrap;
  }

  .article__back::before {
    content: none;
  }

  .article__title {
    font-family: var(--font-body);
    font-size: 16px;
    font-weight: 700;
    line-height: 1.35;
    color: var(--green);
    padding-right: 0;
    padding-top: 0;
  }

  .article:not(.article--review) .article__title {
    font-family: "Playfair Display", Georgia, serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.25;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(0, 0, 0, .15);
  }

  .article:not(.article--review) .article__body {
    max-height: none;
    overflow: visible;
  }

  .article__date { display: none; }

  .article__cover {
    margin: 16px 0;
    border-radius: var(--radius-mobile);
    overflow: hidden;
  }

  .article__cover img {
    width: 100%;
    height: auto;
    border-radius: var(--radius-mobile);
  }

  .article__body {
    font-size: 14px;
    line-height: 1.55;
    color: var(--ink);
  }

  .article__body p { margin: 0 0 1em; }

  .article__body strong,
  .article__body b {
    color: var(--green);
    font-weight: 700;
  }

  .article__body h2,
  .article__body h3 {
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: 700;
    color: var(--green);
    margin: 1.2em 0 .5em;
    line-height: 1.35;
  }

  .article__body img {
    border-radius: var(--radius-mobile);
    margin: 16px 0;
  }

  .article__body ul,
  .article__body ol {
    margin: 0 0 1em;
    padding-left: 1.15em;
  }

  .article__body ul { list-style: disc; }
  .article__body ol { list-style: decimal; }

  .article__body li {
    margin-bottom: .45em;
    font-size: 14px;
    line-height: 1.55;
  }

  .article__body a {
    color: var(--green);
    font-weight: 400;
    text-decoration: underline;
    text-underline-offset: 2px;
  }

  .article__body blockquote {
    margin: 1em 0;
    padding-left: 12px;
    border-left: 2px solid var(--green);
    font-size: 13px;
    line-height: 1.5;
    color: var(--gray);
  }

  .article__body table {
    width: 100%;
    font-size: 12px;
    border-collapse: collapse;
    margin: 1em 0;
  }

  .article__body th,
  .article__body td {
    border: 1px solid rgba(0, 0, 0, .12);
    padding: 6px 8px;
    text-align: left;
  }

  .article__cta { margin-top: 24px; }

  .article__cta .btn {
    width: 100%;
    max-width: var(--mobile-content);
    min-height: 40px;
    font-size: 12px;
    padding: 10px 16px;
  }

  /* Review story single */
  .article--review .review-page__head {
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
    margin-bottom: 0;
    padding-right: 0;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(0, 0, 0, .15);
  }

  .article--review .review-page__head .review__avatar { display: none; }

  .article--review .review-page__head .article__title {
    padding-right: 0;
    padding-bottom: 0;
    border-bottom: 0;
  }

  .review-page__city {
    font-size: 12px;
    color: var(--gray);
    margin-top: 4px;
    line-height: 1.3;
  }

  .article--review .article__cover {
    position: relative;
    margin: 16px 0 12px;
  }

  .article--review .article__cover::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: var(--review-play-size);
    height: var(--review-play-size);
    border-radius: 50%;
    background: rgba(255, 255, 255, .35);
    backdrop-filter: blur(3px);
    pointer-events: none;
    z-index: 1;
  }

  .article--review .article__cover::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-38%, -50%);
    border-style: solid;
    border-width: var(--review-play-triangle-h) 0 var(--review-play-triangle-h) var(--review-play-triangle-w);
    border-color: transparent transparent transparent var(--white);
    pointer-events: none;
    z-index: 2;
  }

  .article--review .article__body {
    font-size: 14px;
    margin-top: 0;
    max-height: 42vh;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding-right: 4px;
  }

  .article--review .article__body > p:first-child {
    font-weight: 700;
    color: var(--green);
  }

  .article--review .review__note { display: none; }

  /* Reviews archive list cards */
  .section--reviews-archive {
    height: auto;
    max-height: none;
    overflow: visible;
    padding-top: calc(var(--header-h) + 24px);
    padding-bottom: 50px;
  }

  .section--reviews-archive .sec-head__subtitle { font-size: 16px; }

  .section--reviews-archive .reviews__list {
    max-width: var(--mobile-content);
    margin-inline: auto;
    gap: 15px;
  }

  .section--reviews-archive .review {
    grid-template-columns: 1fr;
    gap: 0;
    border-radius: var(--radius-mobile);
    overflow: hidden;
    display: flex;
    flex-direction: column;
  }

  /* Все карточки: фото сверху, панель снизу */
  .section--reviews-archive .review .review__media { order: 1; }
  .section--reviews-archive .review .review__panel { order: 2; }

  .section--reviews-archive .review .review__media {
    border-radius: var(--radius-mobile) var(--radius-mobile) 0 0;
  }

  .section--reviews-archive .review .review__panel {
    border-radius: 0 0 var(--radius-mobile) var(--radius-mobile);
  }

  .section--reviews-archive .review__panel {
    min-height: 0;
    padding: 20px var(--mobile-gutter) 16px;
  }

  .section--reviews-archive .review__name {
    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;
  }

  .section--reviews-archive .review__city {
    font-size: 10px;
    opacity: .85;
    margin-top: 2px;
  }

  .section--reviews-archive .review__quote {
    font-size: 12px;
    line-height: 1.45;
    margin-top: 12px;
    opacity: .75;
  }

  .section--reviews-archive .review__quote {
    flex: 1 1 auto;
  }

  .section--reviews-archive .review__note {
    font-size: 8px;
    line-height: 1.25;
    margin-top: 0;
    padding-top: 0;
    opacity: .75;
  }

  .section--reviews-archive .review__head {
    gap: 10px;
  }

  .section--reviews-archive .review__foot {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px 12px;
    margin-top: auto;
    padding-top: 12px;
  }

  .section--reviews-archive .review__note {
    grid-column: 1;
    max-width: none;
  }

  .section--reviews-archive .review__btn {
    display: inline-flex;
    padding: 10px 20px;
    font-size: 12px;
    font-weight: 700;
    margin-bottom: 0;
    align-self: center;
    justify-self: end;
    flex-shrink: 0;
    white-space: nowrap;
  }

  .section--reviews-archive .review__avatar {
    width: 36px;
    height: 36px;
    font-size: 14px;
  }

  .section--reviews-archive .review__media {
    position: relative;
    min-height: 200px;
    aspect-ratio: 340 / 200;
  }

  .section--reviews-archive .review__media::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: var(--review-play-size);
    height: var(--review-play-size);
    border-radius: 50%;
    background: rgba(255, 255, 255, .35);
    backdrop-filter: blur(3px);
    pointer-events: none;
    z-index: 1;
  }

  .section--reviews-archive .review__media::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-38%, -50%);
    border-style: solid;
    border-width: var(--review-play-triangle-h) 0 var(--review-play-triangle-h) var(--review-play-triangle-w);
    border-color: transparent transparent transparent var(--white);
    pointer-events: none;
    z-index: 2;
  }

  .section--reviews-archive .reviews__more {
    position: static;
    transform: none;
    text-align: center;
  }

  .section--reviews-archive .reviews__more .btn {
    width: 180px;
    min-height: 40px;
    font-size: 12px;
    padding: 10px 16px;
  }

  /* ----- ТИПЫ ДОМОВ / Планировка (pages 3–4, 10–14, 45, 55, 67) ----- */
  .types-page,
  .detail-page {
    padding: calc(var(--header-h) + 16px) 0 60px;
    min-height: 0;
    background: #fff;
  }

  /* SEO-блок: на мобилке .types-page белая — даём секции тот же белый фон,
     чтобы не было шва «белый → кремовый». И возвращаем нижний отступ
     (его обнуляет .section{padding:0}), чтобы футер (margin-top:-25px) не наезжал. */
  .section--project-seo {
    background: #fff;
    padding-bottom: clamp(48px, 12vw, 72px);
  }

  .variant-intro {
    position: relative;
    width: calc(100% - 36px);
    max-width: var(--mobile-content);
    margin: 0 auto 24px;
  }

  .variant-intro__back {
    position: absolute;
    top: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    font-size: 28px;
    line-height: 1;
    color: var(--ink);
    text-decoration: none;
    z-index: 2;
  }

  .variant-intro__head {
    padding-right: 40px;
  }

  .variant-intro__eyebrow {
    font-size: 16px;
    font-weight: 700;
    color: var(--ink);
    margin: 0 0 8px;
  }

  .variant-intro__title {
    font-family: var(--font-head);
    font-size: 28px;
    font-weight: 400;
    line-height: 1.1;
    color: var(--green);
    margin: 0;
  }

  .variant-intro__rule {
    border: 0;
    border-top: 1px solid #000;
    margin: 12px 0 0;
  }

  .variant-intro__banner {
    margin: 16px calc(-1 * var(--mobile-gutter)) 0;
    padding: 16px var(--mobile-gutter);
    background: var(--green);
    color: var(--white);
  }

  .variant-intro__banner p {
    margin: 0;
    font-size: 11px;
    line-height: 1.45;
  }

  .variant-intro__hero {
    position: relative;
    margin: 0 calc(-1 * var(--mobile-gutter));
  }

  .variant-intro__hero img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 0;
  }

  .variant-intro__badge {
    position: absolute;
    right: 12px;
    bottom: 12px;
    padding: 6px 14px;
    border-radius: 999px;
    background: rgba(0, 0, 0, .55);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
  }

  .types-page__panel {
    width: calc(100% - 36px);
    max-width: var(--mobile-content);
    margin-inline: auto;
    border-radius: var(--radius-mobile);
    padding: 24px var(--mobile-gutter) 32px;
    background: #eee;
  }

  .detail-page__panel {
    width: 100%;
    max-width: none;
    margin-inline: 0;
    border-radius: 0;
    padding: 0 var(--mobile-gutter) 32px;
    background: transparent;
  }

  .detail-page__top { display: none; }

  .types-page__top,
  .detail-page__top {
    position: relative;
    text-align: center;
    margin-bottom: 28px;
  }

  .types-page__back,
  .detail-page__back {
    position: static;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    font-weight: 400;
    color: var(--gray);
    text-decoration: none;
    margin-bottom: 8px;
  }

  .types-page__title {
    font-size: 28px;
    letter-spacing: .22em;
    line-height: 1.1;
    text-align: center;
  }

  .types-page__list {
    display: flex;
    flex-direction: column;
    gap: 0;
  }

  .types-page .variant-row:not(:last-child) {
    padding-bottom: 28px;
    margin-bottom: 28px;
    border-bottom: 1px solid rgba(0, 0, 0, .18);
  }

  .variant-row,
  .variant-row--reverse {
    display: flex;
    flex-direction: column;
    gap: 20px;
  }

  /* ТИПЫ ДОМОВ: на мобилке фото всегда сверху (без stagger reverse) */
  .types-page .variant-row__media,
  .types-page .variant-row--reverse .variant-row__media {
    order: 1;
  }

  .types-page .variant-row__info,
  .types-page .variant-row--reverse .variant-row__info {
    order: 2;
  }

  .variant-row__name {
    font-family: var(--font-head);
    font-size: 22px;
    font-weight: 400;
    margin-bottom: 16px;
  }

  .types-page .variant-specs {
    margin: 0 0 16px;
  }

  .types-page .variant-specs__row {
    flex-direction: row;
    justify-content: space-between;
    align-items: baseline;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid rgba(0, 0, 0, .12);
  }

  .types-page .variant-specs__row dt { color: var(--gray); }
  .types-page .variant-specs__row dd {
    margin: 0;
    text-align: right;
    color: var(--ink);
  }

  .variant-specs {
    margin: 0;
    font-size: 12px;
  }

  .variant-specs__row {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    padding: 10px 0;
    font-size: 12px;
    border-bottom: 1px solid rgba(0, 0, 0, .12);
  }

  .variant-specs__row dt { color: var(--gray); }
  .variant-specs__row dd {
    font-size: 12px;
    margin: 0;
    text-align: left;
  }

  .variant-row__desc {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 8px 12px;
    align-items: start;
    padding-top: 10px;
    border-top: 1px solid rgba(0, 0, 0, .12);
    margin: 0 0 20px;
  }

  .variant-row__desc-label {
    font-size: 12px;
    margin-bottom: 0;
  }

  .variant-row__desc p {
    font-size: 12px;
    line-height: 1.45;
    text-align: justify;
    hyphens: auto;
    margin: 0;
  }

  .variant-row__btn {
    width: 100%;
    max-width: none;
    min-height: 44px;
    padding: 12px 20px;
    font-size: 14px;
    border-radius: var(--radius-pill);
    background: rgba(255, 255, 255, .35);
  }

  .variant-row__media {
    width: 100%;
    cursor: pointer;
  }

  .variant-slider {
    aspect-ratio: 340 / 255;
    min-height: 0;
    width: 100%;
    border-radius: var(--radius-mobile);
  }

  .variant-slider__nav {
    width: 36px;
    height: 36px;
  }

  .variant-slider__icon {
    width: 16px;
  }

  .variant-slider .g-slider__dots {
    display: flex;
    bottom: 12px;
    gap: 6px;
  }

  .variant-slider .g-slider__dot {
    width: 7px;
    height: 7px;
  }

  .modal--variant-card {
    padding: 0;
    place-items: stretch;
  }

  .modal--variant-card .modal__dialog {
    width: 100%;
    max-width: none;
    min-height: 100dvh;
    max-height: none;
    border-radius: 0;
    background: #eeeeee;
    padding: 54px var(--mobile-gutter) 28px;
    overflow-y: auto;
  }

  .modal--variant-card .modal__close {
    top: 12px;
    right: 14px;
    font-size: 28px;
  }

  .variant-card__slider {
    aspect-ratio: 340 / 255;
    min-height: 0;
    margin-bottom: 20px;
    border-radius: var(--radius-mobile);
    cursor: default;
  }

  .variant-card__name {
    font-family: var(--font-head);
    font-size: 22px;
    font-weight: 400;
    color: var(--green);
    margin: 0 0 16px;
  }

  .variant-card__specs { margin-bottom: 0; }

  .modal--variant-card .variant-specs__row {
    flex-direction: row;
    justify-content: space-between;
    align-items: baseline;
    gap: 12px;
  }

  .modal--variant-card .variant-specs__row dt { color: var(--gray); }
  .modal--variant-card .variant-specs__row dd {
    margin: 0;
    text-align: right;
    color: var(--ink);
  }

  .variant-card__desc { margin-bottom: 20px; }
  .variant-card__detail-btn { margin-bottom: 16px; }

  .variant-card__nav {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
  }

  .variant-card__nav-btn {
    min-height: 44px;
    padding: 12px 16px;
    border: 1px solid rgba(0, 0, 0, .35);
    border-radius: var(--radius-pill);
    background: rgba(255, 255, 255, .35);
    font-family: var(--font-head);
    font-size: 14px;
    font-weight: 500;
    color: var(--ink);
    cursor: pointer;
  }

  .modal--variant-detail {
    padding: 0;
    place-items: stretch;
  }

  .modal--variant-detail .modal__dialog {
    width: 100%;
    max-width: none;
    height: 100dvh;
    max-height: none;
    border-radius: 0;
    background: #eeeeee;
    padding: 48px var(--mobile-gutter) 24px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
  }

  .modal--variant-detail .modal__close {
    top: 12px;
    right: 14px;
    font-size: 28px;
  }

  .modal--variant-detail .variant-detail__head {
    flex: 0 0 auto;
    padding-right: 32px;
    margin-bottom: 16px;
    padding-bottom: 0;
    border-bottom: 0;
  }

  .variant-detail__subtitle {
    display: none;
  }

  .variant-detail__title {
    font-family: var(--font-body);
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 0;
    color: var(--ink);
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(0, 0, 0, .15);
    margin-bottom: 0;
  }

  .variant-detail__body {
    flex: 1 1 auto;
    max-height: none;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    font-size: 12px;
    line-height: 1.55;
    padding-right: 2px;
  }

  .variant-detail__body p,
  .variant-detail__body li { font-size: 12px; }

  .variant-detail__body h2,
  .variant-detail__body h3,
  .variant-detail__body strong,
  .variant-detail__body b {
    font-size: 12px;
    font-weight: 700;
    color: var(--green);
  }

  .variant-detail__body img {
    display: block;
    width: 100%;
    height: auto;
    margin: 12px 0;
    border-radius: var(--radius-mobile);
  }

  .variant-detail__body li { margin-bottom: .75em; }

  .variant-detail__body ol {
    padding-left: 1.15em;
    margin: 0 0 1em;
    list-style: decimal;
  }

  .variant-detail__body ol li {
    padding-left: 4px;
    margin-bottom: 1em;
  }

  .variant-detail__body ol li::marker {
    font-weight: 700;
    color: var(--green);
  }

  .detail-page__title {
    font-family: var(--font-head);
    font-size: 22px;
    font-weight: 400;
    color: var(--green);
    margin: 4px 0 0;
  }

  .variant-plan__eyebrow {
    margin: 0;
    font-size: 12px;
    color: var(--gray);
  }

  .variant-plan__heading,
  .variant-photos__heading {
    margin: 0 0 20px;
    font-family: var(--font-head);
    font-size: 18px;
    font-weight: 700;
    text-align: center;
    color: var(--ink);
  }

  .variant-plan__layout {
    display: grid;
    grid-template-columns: 122px minmax(0, 1fr);
    gap: 8px 10px;
    align-items: start;
  }

  .variant-plan__figure {
    margin: 0;
    grid-column: 1;
    grid-row: 1 / span 2;
    min-width: 0;
  }

  .variant-plan__img {
    width: 100%;
    height: auto;
    border-radius: 0;
    display: block;
  }

  .variant-plan__side {
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
  }

  .variant-plan__specs {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 6px 8px;
    margin: 0;
  }

  .variant-plan__spec {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
  }

  .variant-plan__spec dt {
    font-size: 10px;
    font-weight: 700;
    color: var(--green);
    line-height: 1.25;
  }

  .variant-plan__spec dd {
    margin: 0;
    font-size: 10px;
    color: var(--ink);
    line-height: 1.35;
  }

  .variant-plan__desc {
    grid-column: 2;
    grid-row: 2;
    margin: 0;
    padding: 10px 12px;
    border-radius: 0;
    background: var(--green);
    color: var(--white);
    min-width: 0;
  }

  .variant-plan__desc p {
    margin: 0;
    font-size: 11px;
    line-height: 1.45;
    text-align: justify;
    hyphens: auto;
  }

  .variant-photos { margin-top: 36px; }

  .variant-photos__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 15px;
  }

  .variant-photos__item {
    aspect-ratio: 1;
    min-height: 0;
    border-radius: var(--radius-mobile);
    background-size: 100% 100%;
    background-position: center;
    background-repeat: no-repeat;
    overflow: hidden;
  }

  /* ----- Contacts ----- */
  .section--contacts {
    height: auto;
    max-height: none;
    overflow: visible;
    box-sizing: border-box;
    padding-bottom: var(--radius-mobile);
    position: relative;
  }

  /* Белая «подложка» под скруглённый верх подвала */
  .section--contacts::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: var(--radius-mobile);
    background: var(--white);
    z-index: 1;
  }

  .section--contacts .sec-head {
    margin-bottom: 37px;
    text-align: center;
  }

  .section--contacts .sec-head__title { text-align: center; }

  .section--contacts .sec-head__subtitle {
    margin-top: 0;
  }

  .contacts__panel {
    background: var(--white);
    border-radius: var(--radius-mobile) var(--radius-mobile) 0 0;
    height: auto;
    max-height: none;
    padding: 12px 0 calc(16px + var(--radius-mobile));
    margin-top: 0;
    margin-bottom: 0;
    box-sizing: border-box;
    overflow: hidden;
    position: relative;
    z-index: 2;
  }

  .section--contacts .sec-head__subtitle:not(.sec-head__subtitle--composite) {
    display: block;
    padding-left: 0;
    margin-left: auto;
    margin-right: 0;
    width: 258px;
    max-width: calc(100% - var(--mobile-gutter));
    text-align: right;
    white-space: nowrap;
    font-size: 20px;
    letter-spacing: 0;
    overflow: visible;
    box-sizing: border-box;
  }

  .section--contacts .sec-head__subtitle--leaves {
    letter-spacing: 0;
    line-height: 1.25;
  }

  .contacts__card {
    grid-template-columns: 1fr;
    gap: 0;
    height: auto;
  }

  .contacts__info {
    flex: 0 0 auto;
  }

  .contacts__map {
    height: 185px;
    border-radius: var(--radius-mobile);
    margin-inline: var(--mobile-gutter);
    margin-bottom: 18px;
    overflow: hidden;
    background: #e8e8e8;
  }

  .contacts__map-embed {
    border-radius: inherit;
  }

  .contacts__list {
    padding-inline: var(--mobile-gutter);
  }

  .contacts__list li {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding-top: 10px;
    margin-top: 10px;
    border-top-color: var(--green);
  }

  .contacts__list li:first-child {
    border-top: 0;
    margin-top: 0;
    padding-top: 0;
  }

  .contacts__list li:last-child {
    border-bottom: 2px solid var(--green);
    padding-bottom: 10px;
  }

  .contacts__item--hours .contacts__value {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    justify-content: flex-end;
  }

  .contacts__hours-sep {
    display: inline-block;
    width: 1px;
    height: 11px;
    background: var(--green);
    opacity: .45;
  }

  .contacts__label,
  .contacts__value { font-size: 11px; line-height: 1.3; }

  .contacts__list a.contacts__value {
    font-size: 10px;
    line-height: 1.3;
  }

  .contacts__value { text-align: left; }

  .contacts__socials { display: none; }

  .contacts__socials .soc {
    width: 38px;
    height: 38px;
    background: var(--green);
    color: var(--white);
  }

  .contacts__socials .soc:hover {
    background: var(--green-dark, #1f3529);
    transform: none;
  }

  .contacts__form {
    padding-inline: var(--mobile-gutter);
    padding-top: 36px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .contacts__form .lead-form {
    width: 100%;
    text-align: left;
  }

  .contacts__form .lead-form__note {
    text-align: left;
  }

  .contacts__form .lead-form__consent {
    text-align: left;
    justify-content: flex-start;
  }

  .contacts__form .lead-form__submit {
    margin-inline: auto;
    margin-top: 18px;
  }

  .lead__title {
    font-size: 14px;
    line-height: 1.2;
    color: var(--green);
    margin: 0 0 10px;
  }

  .lead__lead {
    font-size: 10px;
    line-height: 1.35;
    margin: 0 0 10px;
  }

  .lead__desc {
    font-size: 10px;
    line-height: 1.35;
    margin: 0 0 10px;
  }

  .contacts__form .lead__desc {
    margin-top: 10px;
    margin-bottom: 10px;
  }

  .lead-form__field { margin-bottom: 6px; }

  .lead-form__field:not(.lead-form__field--phone) input { font-size: 10px; padding: 6px 2px; border-bottom: 2px solid rgba(0, 0, 0, .85); }

  .contacts__form .lead-form__field--phone {
    display: flex;
    align-items: center;
    gap: 6px;
    border-bottom: 2px solid rgba(0, 0, 0, .85);
    padding: 0;
  }

  .contacts__form .lead-form__country {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    flex: 0 0 auto;
    font-size: 10px;
    font-weight: 400;
    line-height: 1.35;
    padding: 6px 6px 6px 2px;
    border-bottom: 0;
    appearance: none;
    -webkit-appearance: none;
    outline: none;
    background: transparent;
    cursor: pointer;
  }

  .contacts__form .lead-form__field--phone input {
    flex: 1 1 auto;
    min-width: 0;
    border-bottom: 0;
    padding: 6px 2px;
    font-size: 10px;
    line-height: 1.35;
    font-weight: 400;
  }

  .contacts__form .lead-form__field--phone input::placeholder {
    font-size: 10px;
    opacity: 1;
  }

  .lead-form__note {
    font-size: 9px;
    margin: 6px 0 8px;
  }

  .lead-form__consent {
    font-size: 9px;
    line-height: 1.25;
    gap: 8px;
    margin-bottom: 0;
  }

  .lead-form__submit {
    width: 180px;
    min-width: 180px;
    min-height: 40px;
    font-size: 12px;
    padding: 10px 16px;
    display: block;
    margin: 14px auto 0;
  }

  /* ----- Footer ----- */
  .footer__nav-bar { display: none; }

  body.home .section--contacts {
    background: var(--white);
  }

  .site-footer {
    background: var(--cream);
    border-radius: var(--radius-mobile) var(--radius-mobile) 0 0;
    padding: 0;
    margin-top: calc(-1 * var(--radius-mobile));
    position: relative;
    z-index: 3;
    overflow: hidden;
  }

  body.home .site-footer {
    background: var(--cream);
    margin-top: calc(-1 * var(--radius-mobile));
    height: auto;
    max-height: none;
    overflow: hidden;
  }

  body.home .footer__body {
    background: var(--green);
    border-radius: var(--radius-mobile) var(--radius-mobile) 0 0;
  }

  .footer__body {
    padding: 0;
    background: var(--green);
    border-radius: var(--radius-mobile) var(--radius-mobile) 0 0;
    overflow: hidden;
  }

  .footer__meta { display: none; }

  .footer__mobile-strip {
    display: grid;
    grid-template-columns: 1fr 92px 1fr;
    gap: 2px 8px;
    padding: 5px var(--mobile-gutter);
    min-height: 59px;
    height: 59px;
    max-height: 59px;
    overflow: hidden;
    font-size: 4px;
    line-height: 1.15;
    color: #fff;
    background: var(--green);
    box-sizing: border-box;
    align-content: center;
  }

  .footer__mobile-col {
    overflow: hidden;
    max-height: 49px;
  }

  .footer__mobile-col p {
    margin: 0;
    color: #fff;
  }

  .footer__mobile-co {
    text-transform: none;
  }

  .footer__mobile-col--legal {
    text-align: right;
  }

  .footer__mobile-col a {
    color: #fff;
    text-decoration: none;
  }

  .footer__mobile-desc { margin-top: 1px !important; }
  .footer__mobile-unp { margin-top: 1px !important; }

  /* Shared content column — sec-head must match centered grid/cards (376–480px drift fix) */
  .section--credits .sec-head,
  .section--credits .credits__grid,
  #blog.section--blog .sec-head,
  #blog.section--blog .blog__grid,
  .section--blog-archive .sec-head,
  .section--blog-archive .blog__grid,
  #gallery.section--gallery .sec-head,
  #gallery .gallery__grid,
  .section--gallery-archive .gallery__grid,
  #reviews .sec-head,
  #reviews .reviews__mosaic {
    width: var(--mobile-content);
    max-width: 100%;
    margin-inline: auto;
    box-sizing: border-box;
  }

  /* Composite SVG subtitles — align visual ink to section card edges.
     --sub-ink-left / --sub-ink-right = viewBox ink padding (vbW−maxX may be negative). */
  .section--credits .sec-head__subtitle.sec-head__subtitle--composite,
  .section--quality .sec-head__subtitle.sec-head__subtitle--composite,
  #blog.section--blog .sec-head__subtitle.sec-head__subtitle--composite,
  .section--blog-archive .sec-head__subtitle.sec-head__subtitle--composite,
  .article__section-head .sec-head__subtitle.sec-head__subtitle--composite,
  .section--reviews-archive .sec-head__subtitle.sec-head__subtitle--composite,
  #reviews .sec-head__subtitle.sec-head__subtitle--composite {
    display: block;
    width: 100%;
    max-width: var(--mobile-content);
    margin-left: 0;
    margin-right: auto;
    text-align: left;
    box-sizing: border-box;
  }

  .section--projects .sec-head__subtitle.sec-head__subtitle--composite,
  .section--overview .sec-head__subtitle.sec-head__subtitle--composite,
  #gallery.section--gallery .sec-head__subtitle.sec-head__subtitle--composite,
  .section--gallery-archive .sec-head__subtitle.sec-head__subtitle--composite,
  .types-page__section-head .sec-head__subtitle.sec-head__subtitle--composite,
  .detail-page__section-head .sec-head__subtitle.sec-head__subtitle--composite,
  .section--contacts .sec-head__subtitle.sec-head__subtitle--composite {
    display: block;
    width: 100%;
    max-width: var(--mobile-content);
    margin-left: auto;
    margin-right: 0;
    text-align: right;
    box-sizing: border-box;
  }

  /* Projects carousel card is narrower + viewport-centered — match active card box */
  .section--projects .sec-head__subtitle.sec-head__subtitle--composite {
    max-width: var(--pcard);
    margin-left: auto;
    margin-right: calc((100% - min(var(--pcard), 100%)) / 2);
  }

  .section--credits .sec-head__subtitle--composite .sec-head__subtitle-mobile,
  .section--quality .sec-head__subtitle--composite .sec-head__subtitle-mobile,
  #blog.section--blog .sec-head__subtitle--composite .sec-head__subtitle-mobile,
  .section--blog-archive .sec-head__subtitle--composite .sec-head__subtitle-mobile,
  .article__section-head .sec-head__subtitle--composite .sec-head__subtitle-mobile,
  .section--reviews-archive .sec-head__subtitle--composite .sec-head__subtitle-mobile,
  #reviews .sec-head__subtitle--composite .sec-head__subtitle-mobile {
    display: flex;
    justify-content: flex-start;
    width: 100%;
  }

  .section--projects .sec-head__subtitle--composite .sec-head__subtitle-mobile,
  .section--overview .sec-head__subtitle--composite .sec-head__subtitle-mobile,
  #gallery.section--gallery .sec-head__subtitle--composite .sec-head__subtitle-mobile,
  .section--gallery-archive .sec-head__subtitle--composite .sec-head__subtitle-mobile,
  .types-page__section-head .sec-head__subtitle--composite .sec-head__subtitle-mobile,
  .detail-page__section-head .sec-head__subtitle--composite .sec-head__subtitle-mobile,
  .section--contacts .sec-head__subtitle--composite .sec-head__subtitle-mobile {
    display: flex;
    justify-content: flex-end;
    width: 100%;
  }

  .section--credits .sec-head__subtitle--composite .sub-composite__svg,
  .section--quality .sec-head__subtitle--composite .sub-composite__svg,
  #blog.section--blog .sec-head__subtitle--composite .sub-composite__svg,
  .section--blog-archive .sec-head__subtitle--composite .sub-composite__svg,
  .article__section-head .sec-head__subtitle--composite .sub-composite__svg,
  .section--reviews-archive .sec-head__subtitle--composite .sub-composite__svg,
  #reviews .sec-head__subtitle--composite .sub-composite__svg,
  .section--projects .sec-head__subtitle--composite .sub-composite__svg,
  .types-page__section-head .sec-head__subtitle--composite .sub-composite__svg,
  .detail-page__section-head .sec-head__subtitle--composite .sub-composite__svg,
  .section--overview .sec-head__subtitle--composite .sub-composite__svg,
  #gallery.section--gallery .sec-head__subtitle--composite .sub-composite__svg,
  .section--gallery-archive .sec-head__subtitle--composite .sub-composite__svg,
  .section--contacts .sec-head__subtitle--composite .sub-composite__svg {
    display: block;
    width: fit-content;
    flex: 0 0 auto;
    overflow: hidden;
  }

  /* Per-SVG viewBox ink insets (from getBBox on mobile SVG assets) */
  .section--credits .sec-head__subtitle--composite .sub-composite__svg--mobile {
    --sub-ink-left: 0.71;
  }

  .section--quality .sec-head__subtitle--composite .sub-composite__svg--mobile {
    --sub-ink-left: 2.25;
  }

  #blog.section--blog .sec-head__subtitle--composite .sub-composite__svg--mobile,
  .section--blog-archive .sec-head__subtitle--composite .sub-composite__svg--mobile,
  .article__section-head .sec-head__subtitle--composite .sub-composite__svg--mobile {
    --sub-ink-left: 0.32;
  }

  #reviews .sec-head__subtitle--composite .sub-composite__svg--mobile,
  .section--reviews-archive .sec-head__subtitle--composite .sub-composite__svg--mobile {
    --sub-ink-left: 1.12;
  }

  .section--credits .sec-head__subtitle--composite .sub-composite__svg--mobile svg,
  .section--quality .sec-head__subtitle--composite .sub-composite__svg--mobile svg,
  #blog.section--blog .sec-head__subtitle--composite .sub-composite__svg--mobile svg,
  .section--blog-archive .sec-head__subtitle--composite .sub-composite__svg--mobile svg,
  .article__section-head .sec-head__subtitle--composite .sub-composite__svg--mobile svg,
  #reviews .sec-head__subtitle--composite .sub-composite__svg--mobile svg,
  .section--reviews-archive .sec-head__subtitle--composite .sub-composite__svg--mobile svg {
    margin-left: calc(-1 * var(--sub-ink-left) * 20px / var(--sub-figma-fs));
  }

  .section--projects .sec-head__subtitle--composite .sub-composite__svg--mobile,
  .types-page__section-head .sec-head__subtitle--composite .sub-composite__svg--mobile,
  .detail-page__section-head .sec-head__subtitle--composite .sub-composite__svg--mobile {
    --sub-ink-right: 0.68;
  }

  .section--overview .sec-head__subtitle--composite .sub-composite__svg--mobile {
    --sub-ink-right: 1.39;
  }

  #gallery.section--gallery .sec-head__subtitle--composite .sub-composite__svg--mobile,
  .section--gallery-archive .sec-head__subtitle--composite .sub-composite__svg--mobile {
    --sub-ink-right: 1.86;
  }

  .section--contacts .sec-head__subtitle--composite .sub-composite__svg--mobile {
    --sub-ink-right: -3.39;
  }

  .section--projects .sec-head__subtitle--composite .sub-composite__svg--mobile svg,
  .section--overview .sec-head__subtitle--composite .sub-composite__svg--mobile svg,
  #gallery.section--gallery .sec-head__subtitle--composite .sub-composite__svg--mobile svg,
  .section--gallery-archive .sec-head__subtitle--composite .sub-composite__svg--mobile svg,
  .section--contacts .sec-head__subtitle--composite .sub-composite__svg--mobile svg {
    margin-right: calc(-1 * var(--sub-ink-right) * 20px / var(--sub-figma-fs));
  }

  .section--gallery-archive .sec-head__subtitle--composite .sub-composite__svg {
    overflow: visible;
  }
}

/* FAQ — заголовок по центру на телефоне */
body.home .section--faq .sec-head__title,
body.home .section--faq .sec-head__subtitle {
  text-align: center;
}

/* FAQ — компактнее на телефоне */
.faq__list { gap: 12px; margin-top: 22px; }
.faq__q {
  gap: 14px;
  padding: 16px 18px;
  font-size: 17px;
  line-height: 1.3;
}
.faq__icon { width: 22px; height: 22px; }
.faq__a {
  padding: 0 18px 16px;
  font-size: 15px;
  line-height: 1.55;
}
