@import 'zeroing.scss';

/* Базовые стили для всей страницы */
body {
background: rgb(246, 240, 230);
margin: 0;
padding: 0;
}

/* ==========================================================================
   PAGE-WRAPPER
   Глобальная обертка всего контента
   ========================================================================== */
.page-wrapper {
font-family: 'Inter', -apple-system, Helvetica, Arial, sans-serif;
color: rgb(43, 36, 31);
background: rgb(246, 240, 230);
line-height: 1.55;
margin: 10px;
border: 1px solid rgb(221, 211, 194);
position: relative;
min-height: calc(100vh - 20px);
}

@media (max-width: 768px) {
.page-wrapper {
margin: 0;
border: none;
min-height: 100vh;
  }
}

/* ==========================================================================
   HEADER-STICKY
   ========================================================================== */
.header-sticky {
position: sticky;
top: 0;
z-index: 50;
background: rgb(246, 240, 230);
border-bottom: 1px solid rgb(221, 211, 194);
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* HEADER-STICKY__CONTAINER (Контейнер для выравнивания контента по центру) */
.header-container {
max-width: 1180px;
margin: 0 auto;
padding: 16px 40px 0;
display: flex;
align-items: center;
justify-content: space-between;
gap: 20px;
flex-wrap: wrap;
}

/* USER-PROFILE */
.user-profile {
display: flex;
align-items: center;
gap: 12px;
}

.user-profile__avatar {
width: 42px;
height: 42px;
border-radius: 50%;
border: 1.5px solid rgb(38, 34, 32);
color: rgb(38, 34, 32);
display: flex;
align-items: center;
justify-content: center;
font-family: "Playfair Display", Georgia, serif;
font-size: 15px;
flex-shrink: 0;
}

.user-profile__name {
font-size: 14px;
font-weight: 600;
color: rgb(38, 34, 32);
line-height: 1.3;
white-space: nowrap;
}

.user-profile__name-short {
display: none;
}

.user-profile__role {
font-size: 11px;
color: rgb(138, 131, 113);
}

@media (max-width: 768px) {
.header-container {
padding: 14px 16px;
justify-content: flex-start;
flex-wrap: nowrap;
gap: 12px;
  }
.user-profile {
min-width: 0;
  }
}

@media (max-width: 480px) {
.user-profile__name-full {
display: none;
  }
.user-profile__name-short {
display: inline;
  }
.user-profile {
gap: 8px;
  }
}

/* ==========================================================================
   BURGER-MENU
   Кнопка свернутого списка
   ========================================================================== */
.burger-menu {
display: none;
flex-direction: column;
gap: 4px;
width: 40px;
height: 40px;
border-radius: 10px;
border: 1px solid rgb(221, 210, 186);
background: #fff;
align-items: center;
justify-content: center;
cursor: pointer;
flex-shrink: 0;
}

.burger-menu__line {
width: 16px;
height: 2px;
background: rgb(38, 34, 32);
border-radius: 2px;
}

@media (max-width: 768px) {
.burger-menu {
display: flex;
  }
}

/* ==========================================================================
   HEADER-ACTIONS
   Блок с кнопками-ссылками
   ========================================================================== */
.header-actions {
display: flex;
gap: 10px;
}

.header-actions__link {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 11px 18px;
border-radius: 7px;
font-size: 13px;
font-weight: 600;
white-space: nowrap;
text-decoration: none;
transition: opacity 0.2s ease;
}

.header-actions__icon {
display: none;
}

.header-actions__text {
display: inline;
}

.header-actions__link--telegram {
background-color: rgb(38, 34, 32);
color: rgb(255, 255, 255);
}

.header-actions__link--max {
background-color: transparent;
border: 1.5px solid rgb(38, 34, 32);
color: rgb(38, 34, 32);
}

@media (max-width: 768px) {
.header-actions {
margin-left: auto;
gap: 8px;
  }

.header-actions__link {
width: 40px;
height: 40px;
padding: 0;
border-radius: 10px;
  }

.header-actions__text {
display: none;
  }

.header-actions__icon {
display: flex;
align-items: center;
justify-content: center;
  }

.header-actions__link--max .header-actions__icon {
color: #0047FF;
text-decoration: underline;
font-size: 16px;
  }
}

/* ==========================================================================
   NAV-MENU
   ========================================================================== */
.nav-menu {
max-width: 1180px;
margin: 0 auto;
padding: 0 40px;
}

.nav-menu__inner {
display: flex;
gap: 6px;
position: relative;
padding-bottom: 2px;
}

.nav-menu__item {
display: inline-block; /* Обязательно для ссылок <a> */
text-decoration: none; /* Убираем стандартное подчеркивание ссылок */
padding: 12px 16px;
font-size: 13px;
background: none;
border: none;
color: rgb(107, 101, 88);
font-weight: 400;
cursor: pointer;
white-space: nowrap;
transition: color 0.3s ease;
position: relative;
z-index: 2;
}

.nav-menu__item--active,
.nav-menu__item:hover {
color: rgb(38, 34, 32);
}

.nav-menu__underline {
position: absolute;
bottom: 0;
height: 2px;
background: rgb(156, 130, 104);
transition: all 0.3s ease-out;
pointer-events: none;
left: 0;
width: 0;
z-index: 1;
}

@media (max-width: 768px) {
.nav-menu { display: none; }
}

/* ==========================================================================
   MOBILE-SIDE
   Боковое меню, появляющееся при нажатии на бургер
   ========================================================================== */
.mobile-side {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1000;
visibility: hidden;
pointer-events: none;
}

.mobile-side--open {
visibility: visible;
pointer-events: auto;
}

.mobile-side__backdrop {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(38, 34, 32, 0.2);
opacity: 0;
transition: opacity 0.3s ease;
}

.mobile-side--open .mobile-side__backdrop {
opacity: 1;
}

.mobile-side__content {
position: absolute;
top: 0;
right: -270px;
bottom: 0;
width: 270px;
background: rgb(251, 247, 238);
box-shadow: rgba(38, 34, 32, 0.2) -8px 0px 30px;
display: flex;
flex-direction: column;
padding: 20px;
transition: right 0.3s ease;
}

.mobile-side--open .mobile-side__content {
right: 0;
}

.mobile-side__header {
display: flex;
justify-content: flex-end;
margin-bottom: 24px;
}

.mobile-side__close {
width: 34px;
height: 34px;
border-radius: 9px;
border: 1px solid rgb(221, 210, 186);
background: rgb(255, 255, 255);
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
}

.mobile-side__link {
display: block;
padding: 13px 4px;
font-size: 16px;
color: rgb(74, 64, 56);
border-bottom: 1px solid rgb(238, 227, 208);
text-decoration: none;
font-weight: 400;
}

.mobile-side__link--active {
font-weight: 600;
color: rgb(38, 34, 32);
}

/* ==========================================================================
   HERO-MAIN (data-dc-tpl="21-31")
   Главный экран (Hero-секция)
   ========================================================================== */
.hero-main {
width: 100%;
}

.hero-main__container {
max-width: 1180px;
margin: 0 auto;
padding: 40px 40px 0;
display: grid;
grid-template-columns: 1.05fr 0.95fr;
gap: 64px;
align-items: start;
}

@media (max-width: 1024px) {
.hero-main__container { gap: 40px; }
}

@media (max-width: 768px) {
.hero-main__container {
grid-template-columns: 1fr;
padding: 32px 16px 0;
gap: 32px;
  }
}

/* HERO-MAIN__CONTENT (Текст и кнопки) */
.hero-main__title {
font-family: "Playfair Display", Georgia, serif;
font-weight: 600;
font-size: 46px;
line-height: 1.16;
color: rgb(38, 34, 32);
margin: -8px 0 18px;
}

.hero-main__badge {
text-transform: uppercase;
letter-spacing: 0.14em;
font-size: 13px;
color: rgb(156, 130, 104);
font-weight: 700;
margin-bottom: 24px;
}

/* HERO-MAIN__ACTIONS */
.hero-main__actions {
display: flex;
gap: 12px;
flex-wrap: wrap;
margin-bottom: 12px;
}

.hero-main__btn {
display: inline-flex;
align-items: center;
padding: 15px 26px;
border-radius: 7px;
font-size: 14px;
font-weight: 600;
text-decoration: none;
transition: opacity 0.2s;
}

.hero-main__btn--primary {
background: rgb(38, 34, 32);
color: #fff;
}

.hero-main__btn--outline {
background: transparent;
border: 1.5px solid rgb(38, 34, 32);
color: rgb(38, 34, 32);
}

.hero-main__note {
font-size: 12.5px;
color: rgb(156, 130, 104);
margin: 0 0 28px;
}

.hero-main__desc {
font-size: 16px;
color: rgb(59, 55, 41);
max-width: 480px;
margin: 0;
line-height: 1.5;
}

@media (max-width: 1024px) {
.hero-main__title { font-size: 38px; }
}

@media (max-width: 768px) {
.hero-main__title { font-size: 32px; margin-top: 0; }
.hero-main__content { order: 2; }
}

@media (max-width: 480px) {
.hero-main__btn { width: 100%; justify-content: center; }
}

/* HERO-MAIN__IMAGE-BOX (Фотография) */
.hero-main__image-box {
aspect-ratio: 4 / 5;
border-radius: 14px;
position: relative;
overflow: hidden;
background: rgb(221, 211, 194);
}

.hero-main__img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center top;
display: block;
}

@media (max-width: 768px) {
.hero-main__image-box {
order: 1;
max-width: 450px;
margin: 0 auto;
  }
}

/* ==========================================================================
   STATS-SECTION (Общий контейнер блока)
   ========================================================================== */
.stats-section {
width: 100%;
}

/* STATS-GRID (Сетка с цифрами) */
.stats-grid {
max-width: 1180px;
margin: 56px auto 0;
padding: 0 40px;
}

.stats-grid__container {
display: grid;
grid-template-columns: repeat(4, 1fr);
background: rgb(239, 233, 221);
border-radius: 12px;
overflow: hidden;
}

.stats-grid__item {
padding: 26px 30px;
border-right: 1px solid rgb(221, 211, 194);
}

.stats-grid__item:last-child {
border-right: none;
}

.stats-grid__number {
font-family: "Playfair Display", Georgia, serif;
font-size: 28px;
color: rgb(38, 34, 32);
font-weight: 600;
}

.stats-grid__label {
font-size: 12.5px;
color: rgb(107, 101, 88);
margin-top: 4px;
}

@media (max-width: 1024px) {
.stats-grid__item { padding: 20px; }
.stats-grid__number { font-size: 24px; }
}

@media (max-width: 768px) {
.stats-grid { padding: 0 16px; margin-top: 40px; }
.stats-grid__container { grid-template-columns: repeat(2, 1fr); }
.stats-grid__item:nth-child(2) { border-right: none; }
.stats-grid__item:nth-child(1),
.stats-grid__item:nth-child(2) { border-bottom: 1px solid rgb(221, 211, 194); }
}

@media (max-width: 480px) {
.stats-grid__container { grid-template-columns: 1fr; }
.stats-grid__item { border-right: none; border-bottom: 1px solid rgb(221, 211, 194); }
.stats-grid__item:last-child { border-bottom: none; }
}

/* CREDENTIALS-LINE (Строка регалий) */
.credentials-line {
max-width: 1180px;
margin: 0 auto;
padding: 34px 40px 0;
}

.credentials-line__container {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
row-gap: 10px;
font-size: 12.5px;
font-weight: 600;
color: rgb(38, 34, 32);
text-align: center;
}

.credentials-line__divider {
color: rgb(185, 171, 142);
margin: 0 10px;
}

@media (max-width: 768px) {
.credentials-line { padding: 24px 16px 0; }
.credentials-line__container { font-size: 11.5px; }
}

@media (max-width: 480px) {
.credentials-line__divider { display: none; }
.credentials-line__item { width: 100%; padding-bottom: 8px; }
.credentials-line__item:last-child { padding-bottom: 0; }
}

/* ==========================================================================
   RISK-TIMELINE (data-dc-tpl="57-73")
   Блок шкалы нарастания рисков
   ========================================================================== */
.risk-timeline {
background: rgb(38, 34, 32);
margin-top: 52px;
padding: 52px 0;
}

.risk-timeline__container {
max-width: 1180px;
margin: 0 auto;
padding: 0 40px;
color: rgb(242, 235, 221);
}

@media (max-width: 768px) {
.risk-timeline { padding: 40px 0; margin-top: 40px; }
.risk-timeline__container { padding: 0 16px; }
}

/* RISK-TIMELINE__HEADER (Тексты) */
.risk-timeline__title {
font-family: "Playfair Display", Georgia, serif;
font-weight: 600;
font-size: 27px;
max-width: 640px;
margin: 0 0 14px;
color: rgb(242, 235, 221);
line-height: 1.3;
}

.risk-timeline__text {
font-size: 14px;
color: rgb(207, 198, 186);
max-width: 600px;
margin: 0 0 8px;
line-height: 1.5;
}

.risk-timeline__text--highlight {
color: rgb(201, 173, 143);
font-weight: 600;
max-width: 620px;
margin: 0;
}

@media (max-width: 768px) {
.risk-timeline__title { font-size: 22px; }
}

/* RISK-TIMELINE__STEPS (Визуальная шкала) */
.risk-timeline__steps {
display: flex;
justify-content: space-between;
margin-top: 34px;
position: relative;
}

.risk-timeline__line {
position: absolute;
top: 9px;
left: 8%;
right: 8%;
height: 1px;
background: rgb(74, 66, 58);
z-index: 0;
}

.risk-timeline__step {
position: relative;
text-align: center;
font-size: 11px;
color: rgb(176, 168, 154);
width: 16%;
z-index: 1;
}

.risk-timeline__dot {
width: 9px;
height: 9px;
border-radius: 50%;
background: rgb(143, 132, 119);
margin: 0 auto 10px;
position: relative;
}

.risk-timeline__step--active {
color: rgb(201, 173, 143);
font-weight: 600;
}

.risk-timeline__step--active .risk-timeline__dot {
width: 13px;
height: 13px;
background: rgb(156, 130, 104);
margin-top: -2px;
margin-bottom: 8px;
}

@media (max-width: 1024px) {
.risk-timeline__step { font-size: 10px; }
}

@media (max-width: 768px) {
.risk-timeline__steps {
flex-direction: column;
gap: 20px;
margin-top: 40px;
  }
.risk-timeline__line {
left: 4px;
top: 5px;
bottom: 5px;
width: 1px;
height: auto;
right: auto;
  }
.risk-timeline__step {
width: 100%;
text-align: left;
padding-left: 30px;
display: flex;
align-items: center;
  }
.risk-timeline__dot {
position: absolute;
left: 0;
margin: 0;
  }

.risk-timeline__step--active .risk-timeline__dot {
left: -2px;
  }
}

/* ==========================================================================
   HOME-CONTENT (Глобальный контейнер)
   ========================================================================== */
.home-content__container {
max-width: 1180px;
margin: 0 auto;
padding: 0 40px;
}
@media (max-width: 768px) { .home-content__container { padding: 0 16px; } }

/* HOME-DIAGNOSTICS */
.home-diagnostics { padding: 64px 0; }
.home-diagnostics__main { display: grid; grid-template-columns: 1.2fr 0.8fr; gap: 44px; align-items: center; }

.home-diagnostics__badge { text-transform: uppercase; letter-spacing: 0.1em; font-size: 12px; color: rgb(156, 130, 104); font-weight: 700; display: block; }
.home-diagnostics__title { font-family: "Playfair Display", serif; font-weight: 600; font-size: 28px; color: rgb(38, 34, 32); margin: 12px 0 14px; }
.home-diagnostics__desc { color: rgb(107, 101, 88); font-size: 14px; max-width: 480px; margin-bottom: 22px; }
.home-diagnostics__btn { display: inline-flex; align-items: center; padding: 13px 22px; border-radius: 7px; background: rgb(38, 34, 32); color: #fff; font-size: 13.5px; font-weight: 600; text-decoration: none; }

/* HOME-DIAGNOSTICS__AREAS */
.home-diagnostics__areas { background: #fff; border: 1px solid rgb(210, 196, 168); border-radius: 12px; padding: 26px; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; box-shadow: 0 2px 8px rgba(38,34,32,0.05); }
.home-diagnostics__area-item { background: rgb(239, 233, 221); border-radius: 8px; padding: 14px 12px; font-size: 12px; color: rgb(38, 34, 32); text-align: center; }

/* HOME-DIAGNOSTICS__LIST */
.home-diagnostics__list { list-style: none; max-width: 440px; margin-top: 28px; padding: 0; }
.home-diagnostics__list-item { font-size: 13.5px; padding: 9px 0; border-bottom: 1px solid rgb(221, 211, 194); }
.home-diagnostics__list-item:last-child { border-bottom: none; }
.home-diagnostics__list-item span { color: rgb(156, 130, 104); font-weight: 700; margin-right: 8px; }

@media (max-width: 768px) {
.home-diagnostics__main { grid-template-columns: 1fr; gap: 32px; }
.home-diagnostics { padding: 48px 0; }
}

/* HOME-REASONS */
.home-reasons { padding-bottom: 64px; }
.home-reasons__title { font-family: "Playfair Display", serif; font-weight: 600; font-size: 28px; color: rgb(38, 34, 32); text-align: center; margin-bottom: 32px; }
.home-reasons__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }

.home-reasons__card { background: #fff; border: 1px solid rgb(210, 196, 168); border-radius: 12px; padding: 20px 18px; box-shadow: 0 2px 8px rgba(38,34,32,0.05); }
.home-reasons__card-title { display: block; font-size: 14px; color: rgb(38, 34, 32); margin-bottom: 6px; }
.home-reasons__card-text { font-size: 12.5px; color: rgb(107, 101, 88); line-height: 1.4; }

@media (max-width: 1024px) { .home-reasons__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 768px) { .home-reasons__grid { grid-template-columns: 1fr; } }

/* HOME-WORK-MINI */
.home-work-mini { padding-bottom: 64px; }
.home-work-mini__title { font-family: "Playfair Display", serif; font-weight: 600; font-size: 28px; color: rgb(38, 34, 32); text-align: center; margin-bottom: 32px; }
.home-work-mini__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }

.home-work-mini__step { background: #fff; border: 1px solid rgb(221, 211, 194); border-radius: 12px; padding: 20px; }
.home-work-mini__num { width: 28px; height: 28px; border-radius: 50%; background: rgb(38, 34, 32); color: rgb(242, 235, 221); display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 600; margin-bottom: 14px; }
.home-work-mini__step-title { display: block; color: rgb(38, 34, 32); font-size: 14px; margin-bottom: 5px; }
.home-work-mini__step-text { color: rgb(107, 101, 88); font-size: 12.5px; line-height: 1.4; }

@media (max-width: 1024px) { .home-work-mini__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 768px) { .home-work-mini__grid { grid-template-columns: 1fr; } }

/* HOME-SERVICES-SUMMARY */
.home-services-summary { padding-bottom: 64px; }
.home-services-summary__header { text-align: center; max-width: 560px; margin: 0 auto 30px; }
.home-services-summary__title { font-family: "Playfair Display", serif; font-size: 28px; font-weight: 600; margin-bottom: 10px; }
.home-services-summary__note { color: rgb(107, 101, 88); font-size: 14px; }

.home-services-summary__label { font-size: 12px; text-transform: uppercase; letter-spacing: 0.08em; color: rgb(156, 130, 104); font-weight: 700; margin-bottom: 14px; }
.home-services-summary__grid-main { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }

.home-services-summary__card { background: #fff; border: 1px solid rgb(210, 196, 168); border-radius: 10px; padding: 18px; box-shadow: 0 2px 8px rgba(38,34,32,0.05); }
.home-services-summary__card-name { display: block; font-size: 13.5px; color: rgb(38, 34, 32); margin-bottom: 5px; }
.home-services-summary__card-desc { color: rgb(107, 101, 88); font-size: 12.5px; line-height: 1.4; }

/* HOME-SERVICES-SUMMARY__DARK-BOX */
.home-services-summary__dark-box { background: rgb(239, 233, 221); border-radius: 14px; padding: 32px 34px; margin-top: 44px; }
.home-services-summary__grid-dark { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }

.home-services-summary__footer { margin-top: 36px; display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.home-services-summary__btn { display: inline-flex; align-items: center; padding: 13px 22px; border-radius: 7px; font-size: 13.5px; font-weight: 600; text-decoration: none; }
.home-services-summary__btn--dark { background: rgb(38, 34, 32); color: #fff; }
.home-services-summary__btn--outline { border: 1.5px solid rgb(38, 34, 32); color: rgb(38, 34, 32); }
.home-services-summary__footer-text { font-size: 12.5px; color: rgb(107, 101, 88); }

@media (max-width: 1024px) {
.home-services-summary__grid-main { grid-template-columns: repeat(2, 1fr); }
.home-services-summary__grid-dark { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
.home-services-summary__grid-main, .home-services-summary__grid-dark { grid-template-columns: 1fr; }
.home-services-summary__dark-box { padding: 24px 16px; }
.home-services-summary__btn { width: 100%; justify-content: center; }
}

/* ==========================================================================
   ⚠ МЁРТВЫЙ КОД — .features-bar нигде не используется в HTML.
   Похоже, это черновик, из которого потом вырос PRINCIPLES-BAR ниже.
   Проверьте и удалите, если не используется в других шаблонах.
   ========================================================================== */
.features-bar {
width: 100%;
margin-top: 48px;
}

.features-bar__container {
max-width: 1180px;
margin: 0 auto;
padding: 0 40px;
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 16px;
}

@media (max-width: 1024px) {
.features-bar__container {
grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 768px) {
.features-bar__container {
padding: 0 16px;
grid-template-columns: 1fr;
gap: 12px;
  }
}

/* ==========================================================================
   PRINCIPLES-BAR (data-dc-tpl="181")
   Общий контейнер с фоном и границами
   ========================================================================== */
.principles-bar {
background: rgb(239, 233, 221);
border-top: 1px solid rgb(221, 211, 194);
border-bottom: 1px solid rgb(221, 211, 194);
width: 100%;
}

@media (max-width: 768px) {
.principles-bar { border: none; background: transparent; }
}

/* PRINCIPLES-BAR__CONTAINER (tpl 182) */
.principles-bar__container {
max-width: 1180px;
margin: 0 auto;
display: grid;
grid-template-columns: repeat(4, 1fr);
}

@media (max-width: 1024px) {
.principles-bar__container {
grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
.principles-bar__container {
grid-template-columns: 1fr;
padding: 0 16px;
gap: 12px;
  }
}

/* PRINCIPLES-BAR__ITEM (tpl 183, 186, 189, 192) */
.principles-bar__item {
padding: 34px 26px;
border-left: 1px solid rgb(221, 211, 194);
}

.principles-bar__item:first-child {
border-left: none;
}

.principles-bar__title {
display: block;
font-size: 14px;
margin-bottom: 8px;
color: rgb(38, 34, 32);
line-height: 1.3;
}

.principles-bar__text {
font-size: 12.5px;
color: rgb(107, 101, 88);
line-height: 1.5;
}

@media (max-width: 1024px) {
.principles-bar__item { border: 1px solid rgb(221, 211, 194); background: rgb(239, 233, 221); }
}

@media (max-width: 768px) {
.principles-bar__item {
padding: 24px 20px;
border-left: 1px solid rgb(221, 211, 194);
border-radius: 0;
background: rgb(239, 233, 221);
  }
}

/* ==========================================================================
   HOME-CASES (Общий контейнер)
   ========================================================================== */
.home-cases { padding: 64px 0; }
.home-cases__container { max-width: 1180px; margin: 0 auto; padding: 0 40px; }
.home-cases__title { font-family: "Playfair Display", serif; font-size: 28px; font-weight: 600; text-align: center; margin-bottom: 32px; color: rgb(38, 34, 32); }

.home-cases__grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 20px;
}

@media (max-width: 1024px) { .home-cases__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 768px) {
.home-cases__grid { grid-template-columns: 1fr; }
.home-cases__container { padding: 0 16px; }
}

/* CASE-CARD (Компонент карточки) */
.case-card {
display: flex;
flex-direction: column;
border-radius: 12px;
overflow: hidden;
border: 1px solid rgb(210, 196, 168);
text-decoration: none !important;
color: inherit !important;
box-shadow: 0 2px 8px rgba(38, 34, 32, 0.05);
transition: transform 0.2s;
}

.case-card:hover { transform: translateY(-5px); }

.case-card__top {
padding: 16px 20px;
display: flex;
justify-content: space-between;
align-items: center;
}

.case-card__bottom {
padding: 20px;
background: #fff;
flex-grow: 1;
}

.case-card__label { font-size: 10px; text-transform: uppercase; font-weight: 700; letter-spacing: 0.05em; }
.case-card__status { font-size: 11px; padding: 4px 10px; border-radius: 20px; font-weight: 600; }
.case-card__title { display: block; font-size: 15px; line-height: 1.4; margin-bottom: 8px; color: rgb(38, 34, 32); }
.case-card__desc { font-size: 12.5px; color: rgb(107, 101, 88); margin: 0; line-height: 1.5; }

/* CASE-CARD — модификаторы цвета */
.case-card--dark .case-card__top {
background: rgb(38, 34, 32);
}
.case-card--dark .case-card__label { color: rgb(201, 173, 143); }
.case-card--dark .case-card__status { background: rgba(255,255,255,0.1); color: #fff; }

.case-card--light .case-card__top {
background: rgb(239, 233, 221);
}
.case-card--light .case-card__label { color: rgb(156, 130, 104); }
.case-card--light .case-card__status { background: #fff; color: rgb(156, 130, 104); }

@media (max-width: 480px) {
.case-card__top { padding: 12px 16px; }
.case-card__bottom { padding: 16px; }
.case-card__title { font-size: 14px; }
}

/* ==========================================================================
   1-14. RESOURCES-SECTION (data-dc-tpl="229")
   ========================================================================== */
.resources-section {
  max-width: 1180px;
  margin: 56px auto 0;
  padding: 0 40px;
}

@media (max-width: 1024px) {
  .resources-section { margin-top: 48px; }
}
@media (max-width: 768px) {
  .resources-section { padding: 0 16px; margin-top: 40px; }
}

/* ==========================================================================
   1-14-1. RESOURCES-SECTION__TITLE (tpl 230)
   ========================================================================== */
.resources-section__title {
  font-family: "Playfair Display", Georgia, serif;
  font-weight: 600;
  font-size: 25px;
  color: rgb(38, 34, 32);
  margin: 0 0 20px;
}

@media (max-width: 768px) {
  .resources-section__title { font-size: 22px; text-align: center; }
}

/* ==========================================================================
   1-14-2. RESOURCES-GRID (tpl 231) - ОБНОВЛЕНО НА 3 КОЛОНКИ
   ========================================================================== */
.resources-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr); /* 3 колонки на десктопе */
  gap: 20px;
}

@media (max-width: 1180px) {
  .resources-grid { gap: 16px; }
}

@media (max-width: 1024px) {
  .resources-grid { 
    grid-template-columns: repeat(2, 1fr); /* 2 колонки на планшетах */
  }
}

@media (max-width: 768px) {
  .resources-grid { 
    grid-template-columns: 1fr; /* 1 колонка на мобильных */
  }
}

/* ==========================================================================
   1-14-3. RESOURCE-CARD (tpl 232, 238, 244)
   ========================================================================== */
.resource-card {
  display: flex;
  gap: 18px;
  border: 1px solid rgb(210, 196, 168);
  border-radius: 12px;
  padding: 22px;
  background: rgb(255, 255, 255);
  box-shadow: 0 2px 8px rgba(38, 34, 32, 0.05);
}

.resource-card__cover {
  width: 84px;
  height: 112px;
  flex: 0 0 auto;
  border-radius: 6px;
}

/* ==========================================================================
   1-14-3. RESOURCE-CARD (Элемент карточки с изображением)
   ========================================================================== */
.resource-card {
  display: flex;
  gap: 18px;
  border: 1px solid rgb(210, 196, 168);
  border-radius: 12px;
  padding: 22px;
  background: rgb(255, 255, 255);
  box-shadow: 0 2px 8px rgba(38, 34, 32, 0.05);
}

/* Контейнер для картинки (обложка) */
.resource-card__cover {
  width: 84px;
  height: 112px;
  flex: 0 0 auto;
  border-radius: 6px;
  overflow: hidden; /* Чтобы картинка не вылезала за скругления */
  background: rgb(239, 233, 221); /* Фоновый цвет, если картинка не прогрузится */
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Стили для самой картинки внутри обложки */
.resource-card__cover-img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* Картинка заполнит весь прямоугольник без искажений */
  display: block;
}

/* Модификатор для книги (если нужно оставить градиент фоном) */
.resource-card__cover--book {
  background: linear-gradient(135deg, rgb(43, 36, 31), rgb(69, 58, 48));
}

.resource-card__info {
  display: flex;
  flex-direction: column;
}

.resource-card__name {
  display: block;
  font-size: 14.5px;
  color: rgb(38, 34, 32);
  margin-bottom: 6px;
  line-height: 1.3;
}

.resource-card__text {
  font-size: 12.5px;
  color: rgb(107, 101, 88);
  display: block;
  margin-bottom: 14px;
  line-height: 1.4;
}

.resource-card__link {
  font-size: 12.5px;
  font-weight: 600;
  color: rgb(156, 130, 104);
  text-decoration: none;
  margin-top: auto;
}

/* @media */

@media (max-width: 480px) {
  .resource-card { 
    padding: 16px; 
    gap: 14px; 
  }
  /* Уменьшаем обложку на самых маленьких экранах */
  .resource-card__cover { 
    width: 64px; 
    height: 86px; 
  }
}




/* Модификатор: Обложка книги */
.resource-card__cover--book {
  background: linear-gradient(135deg, rgb(43, 36, 31), rgb(69, 58, 48));
}

/* Модификатор: Обложки со стрелками (TG и MAX) */
.resource-card__cover--arrow {
  background: rgb(239, 233, 221);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 26px;
  color: rgb(156, 130, 104);
}

.resource-card__info {
  display: flex;
  flex-direction: column;
}

.resource-card__name {
  display: block;
  font-size: 14.5px;
  color: rgb(38, 34, 32);
  margin-bottom: 6px;
  line-height: 1.3;
}

.resource-card__text {
  font-size: 12.5px;
  color: rgb(107, 101, 88);
  display: block;
  margin-bottom: 14px;
  line-height: 1.4;
}

.resource-card__link {
  font-size: 12.5px;
  font-weight: 600;
  color: rgb(156, 130, 104);
  text-decoration: none;
  margin-top: auto; /* Прижимает ссылку к низу карточки */
}

.resource-card__link:hover {
  text-decoration: underline;
}

/* Адаптив для контента карточек */
@media (max-width: 480px) {
  .resource-card { padding: 16px; gap: 14px; }
  .resource-card__cover { width: 70px; height: 94px; }
  .resource-card__name { font-size: 13.5px; }
}


/* ==========================================================================
   PAGE-HEADER
   Блок заголовка страницы под шапкой
   ========================================================================== */
.page-header {
background: rgb(239, 233, 221);
border-bottom: 1px solid rgb(221, 211, 194);
padding: 36px 0;
}

.page-header__container {
max-width: 1180px;
margin: 0 auto;
padding: 0 40px;
}

.page-header__breadcrumbs {
font-size: 12px;
color: rgb(107, 101, 88);
margin-bottom: 10px;
}

.page-header__title {
font-family: "Playfair Display", Georgia, serif;
font-weight: 600;
font-size: 30px;
color: rgb(38, 34, 32);
margin: 0;
}

.page-header__description {
color: rgb(107, 101, 88);
font-size: 14px;
max-width: 600px;
margin: 10px 0 0;
line-height: 1.5;
}

@media (max-width: 768px) {
.page-header { padding: 24px 0; }
.page-header__container { padding: 0 16px; }
.page-header__title { font-size: 26px; }
}
@media (max-width: 480px) {
.page-header__title { font-size: 24px; }
.page-header__description { font-size: 13px; }
}


/* ==========================================================================
   ABOUT-CONTENT (Общий контейнер)
   ========================================================================== */
.about-content {
max-width: 1180px;
margin: 0 auto;
padding: 48px 40px;
}

@media (max-width: 768px) {
.about-content { padding: 32px 16px; }
}

/* ABOUT-GRID (Верхняя сетка: Текст + Фото) */
.about-grid {
display: grid;
grid-template-columns: 1.2fr 0.8fr;
gap: 44px;
align-items: start;
}

.about-grid__intro {
font-size: 15px;
color: rgb(43, 36, 31);
margin-bottom: 22px;
}

.about-grid__subtitle {
font-family: "Playfair Display", Georgia, serif;
font-weight: 600;
font-size: 19px;
color: rgb(38, 34, 32);
margin-bottom: 10px;
}

.about-grid__list {
list-style: none;
padding: 0;
display: flex;
flex-direction: column;
gap: 11px;
}

.about-grid__item {
font-size: 13.5px;
padding-left: 18px;
position: relative;
line-height: 1.4;
}

.about-grid__bullet {
position: absolute;
left: 0;
color: rgb(156, 130, 104);
font-weight: 700;
}

.about-grid__photo-box {
aspect-ratio: 4/5;
border-radius: 12px;
overflow: hidden;
background: rgb(221, 211, 194);
}

.about-grid__img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center top;
}

@media (max-width: 1024px) {
.about-grid { gap: 30px; }
}
@media (max-width: 768px) {
.about-grid {
grid-template-columns: 1fr;
gap: 32px;
  }
.about-grid__photo-box {
order: -1;
max-width: 400px;
margin: 0 auto;
  }
}

/* ABOUT-QUOTE (Блок-цитата) */
.about-quote {
background: rgb(38, 34, 32);
color: rgb(242, 235, 221);
border-radius: 12px;
padding: 30px 34px;
margin: 36px 0;
font-family: "Playfair Display", Georgia, serif;
font-size: 16px;
line-height: 1.65;
}

@media (max-width: 768px) {
.about-quote { padding: 24px; font-size: 15px; }
}

/* ABOUT-CARDS (Сетка карточек) */
.about-cards {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 16px;
}

.about-cards__item {
background: rgb(255, 255, 255);
border: 1px solid rgb(210, 196, 168);
border-radius: 10px;
padding: 18px;
box-shadow: rgba(38, 34, 32, 0.05) 0px 2px 8px;
}

.about-cards__label {
display: block;
color: rgb(38, 34, 32);
font-size: 13.5px;
margin-bottom: 5px;
}

.about-cards__value {
font-size: 12.5px;
color: rgb(107, 101, 88);
}

@media (max-width: 768px) {
.about-cards { grid-template-columns: 1fr; }
}

/* ABOUT-ACTIONS (Кнопки действий) */
.about-actions {
margin-top: 30px;
display: flex;
gap: 12px;
flex-wrap: wrap;
}

.about-actions__btn {
display: inline-flex;
align-items: center;
padding: 13px 22px;
border-radius: 7px;
font-size: 13.5px;
font-weight: 600;
text-decoration: none;
transition: opacity 0.2s;
}

.about-actions__btn--primary {
background: rgb(38, 34, 32);
color: rgb(255, 255, 255);
}

.about-actions__btn--outline {
background: transparent;
border: 1.5px solid rgb(38, 34, 32);
color: rgb(38, 34, 32);
}

@media (max-width: 480px) {
.about-actions { flex-direction: column; }
.about-actions__btn { justify-content: center; }
}


/* ==========================================================================
   MAIN-FOOTER
   Общий контейнер подвала
   ========================================================================== */
.main-footer {
background: rgb(38, 34, 32);
color: rgb(190, 179, 164);
padding: 36px 0 24px;
font-size: 12.5px;
}

@media (max-width: 768px) {
.main-footer { padding: 32px 0 20px; }
}

/* MAIN-FOOTER__TOP */
.main-footer__top {
max-width: 1180px;
margin: 0 auto 16px;
padding: 0 40px 24px;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
gap: 24px;
border-bottom: 1px solid rgb(58, 51, 44);
}

.main-footer__info {
display: flex;
flex-direction: column;
gap: 10px;
min-width: 220px;
}

.main-footer__name {
color: rgb(242, 235, 221);
font-family: "Playfair Display", Georgia, serif;
font-size: 15px;
}

.main-footer__role,
.main-footer__socials {
color: rgb(207, 198, 186);
line-height: 1.4;
}

@media (max-width: 768px) {
.main-footer__top { padding: 0 16px 24px; gap: 30px; }
}
@media (max-width: 480px) {
.main-footer__info { min-width: 100%; }
}

/* MAIN-FOOTER__NAV */
.main-footer__nav {
display: flex;
flex-direction: column;
gap: 8px;
min-width: 160px;
}

.main-footer__title {
color: rgb(242, 235, 221);
margin-bottom: 4px;
}

.main-footer__link {
color: rgb(207, 198, 186);
text-decoration: none;
transition: color 0.2s;
}

.main-footer__link:hover {
color: rgb(242, 235, 221);
}

.main-footer__link--highlight {
color: rgb(201, 173, 143);
}

@media (max-width: 768px) {
.main-footer__nav { min-width: calc(50% - 15px); }
}
@media (max-width: 480px) {
.main-footer__nav { min-width: 100%; }
}

/* MAIN-FOOTER__BOTTOM (Копирайт) */
.main-footer__bottom {
max-width: 1180px;
margin: 0 auto;
padding: 0 40px;
}

.main-footer__copyright {
opacity: 0.8;
}

@media (max-width: 768px) {
.main-footer__bottom { padding: 0 16px; }
}
@media (max-width: 480px) {
.main-footer__bottom { text-align: center; }
}


/* ==========================================================================
   COOKIE-BAR (data-dc-tpl="16-22")
   Всплывающая плашка согласия с использованием cookie
   ========================================================================== */
.cookie-bar {
position: fixed; /* Фиксируем относительно экрана, а не страницы */
left: 0;
right: 0;
bottom: 0;
background: rgb(38, 34, 32);
padding: 22px 32px;
z-index: 2000; /* Самый высокий приоритет */
border-top: 1px solid rgb(58, 51, 44);
/* Изначально скрыт для JS анимации */
display: none;
animation: slideUp 0.4s ease-out;
}

/* Анимация появления */
@keyframes slideUp {
  from { transform: translateY(100%); }
  to { transform: translateY(0); }
}

.cookie-bar__container {
max-width: 1180px;
margin: 0 auto;
display: flex;
align-items: center;
justify-content: space-between;
gap: 24px;
}

.cookie-bar__text {
font-size: 14px;
line-height: 1.6;
color: rgb(242, 235, 221);
max-width: 640px;
}

.cookie-bar__link {
color: inherit;
text-decoration: underline;
}

.cookie-bar__actions {
display: flex;
gap: 12px;
flex-shrink: 0;
}

.cookie-bar__btn {
padding: 11px 22px;
border-radius: 8px;
font-weight: 600;
font-size: 14px;
white-space: nowrap;
cursor: pointer;
border: none;
transition: opacity 0.2s;
}

.cookie-bar__btn:hover {
opacity: 0.9;
}

.cookie-bar__btn--decline {
background: transparent;
color: rgb(242, 235, 221);
border: 1.5px solid rgb(201, 173, 143);
padding: 10px 20px; /* Компенсация границы */
}

.cookie-bar__btn--accept {
background: rgb(242, 235, 221);
color: rgb(38, 34, 32);
}

@media (max-width: 1180px) {}
@media (max-width: 1024px) {}

@media (max-width: 768px) {
.cookie-bar {
padding: 20px 16px;
  }
.cookie-bar__container {
flex-direction: column;
align-items: flex-start;
gap: 16px;
  }
.cookie-bar__actions {
width: 100%;
  }
.cookie-bar__btn {
flex: 1; /* Кнопки на мобильных одинаковой ширины */
text-align: center;
  }
}

@media (max-width: 480px) {
.cookie-bar__text {
font-size: 13px;
  }
}


/* ==========================================================================
   1-15. CTA-BAR (data-dc-tpl="240")
   Полоса призыва к действию (CTA)
   ========================================================================== */
.cta-bar {
  background: rgb(239, 233, 221);
  border-top: 1px solid rgb(221, 211, 194);
  border-bottom: 1px solid rgb(221, 211, 194);
  padding: 34px 0;
  width: 100%;
}

@media (max-width: 1180px) {}
@media (max-width: 1024px) {}
@media (max-width: 768px) {
  .cta-bar { padding: 40px 0; }
}
@media (max-width: 480px) {}

/* ==========================================================================
   1-15-1. CTA-BAR__CONTAINER (tpl 241)
   ========================================================================== */
.cta-bar__container {
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 40px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 20px;
}

@media (max-width: 768px) {
  .cta-bar__container { 
    padding: 0 16px; 
    flex-direction: column; 
    text-align: center;
    align-items: center;
  }
}

/* ==========================================================================
   1-15-2. CTA-BAR__INFO (Тексты)
   ========================================================================== */
.cta-bar__title {
  font-family: "Playfair Display", Georgia, serif;
  font-weight: 600;
  font-size: 19px;
  color: rgb(38, 34, 32);
  margin: 0 0 5px;
}

.cta-bar__text {
  font-size: 13px;
  color: rgb(107, 101, 88);
  margin: 0;
  max-width: 500px;
}

/* ==========================================================================
   1-15-3. CTA-BAR__ACTIONS (Кнопки и информация)
   ========================================================================== */
.cta-bar__actions {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
}

.cta-bar__btn {
  display: inline-flex;
  align-items: center;
  padding: 13px 22px;
  border-radius: 7px;
  font-size: 13.5px;
  font-weight: 600;
  text-decoration: none;
  transition: opacity 0.2s;
}

.cta-bar__btn--primary {
  background: rgb(38, 34, 32);
  color: #fff;
}

.cta-bar__btn--outline {
  background: transparent;
  border: 1.5px solid rgb(38, 34, 32);
  color: rgb(38, 34, 32);
}

.cta-bar__location {
  font-size: 12px;
  color: rgb(107, 101, 88);
  line-height: 1.4;
}

/* Адаптив для кнопок */
@media (max-width: 768px) {
  .cta-bar__actions { 
    justify-content: center; 
    flex-direction: column; 
    gap: 12px;
    width: 100%;
  }
  
  .cta-bar__location { margin-top: 8px; }
}

@media (max-width: 480px) {
  .cta-bar__btn { width: 100%; justify-content: center; }
}