/* ==========================================================================
   SolarHouse — косметическое обновление дизайна (2026)
   Слой поверх css/app.css и css/style_new.css: подключается последним и
   только уточняет существующие классы, разметку не меняет. Убрать файл из
   includes/head.php — сайт вернётся к прежнему виду.
   ========================================================================== */

:root {
    --sh-green: #4a7144;
    --sh-green-dark: #2f4a2b;
    --sh-green-deep: #20311e;
    --sh-green-soft: #eef3ec;
    --sh-sun: #e9a23b;
    --sh-sun-soft: #fdf5e9;
    --sh-ink: #1d2a1b;
    --sh-text: #3a4438;
    --sh-muted: #6b7568;
    --sh-line: #e3e8e1;
    --sh-radius: 12px;
    --sh-radius-sm: 8px;
    --sh-shadow: 0 1px 2px rgba(29, 42, 27, .06), 0 6px 20px rgba(29, 42, 27, .08);
    --sh-shadow-hover: 0 2px 4px rgba(29, 42, 27, .08), 0 14px 34px rgba(29, 42, 27, .14);
    --sh-ease: cubic-bezier(.2, .7, .2, 1);
}

/* --- Основа ------------------------------------------------------------- */

body {
    color: var(--sh-text);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

::selection { background: var(--sh-green); color: #fff; }

h1, h2, h3, .alpha, .beta, .gamma, .delta {
    color: var(--sh-ink);
    letter-spacing: -.01em;
}

/* Заголовки секций — с солнечной чертой под текстом */
.gamma[style*="text-align: center"]::after,
h2.gamma.text-center::after {
    content: "";
    display: block;
    width: 56px;
    height: 4px;
    margin: 14px auto 0;
    border-radius: 2px;
    background: var(--sh-sun);
}

a { transition: color .2s ease; }

:focus-visible {
    outline: 3px solid rgba(233, 162, 59, .7) !important;
    outline-offset: 2px;
}

/* --- Шапка -------------------------------------------------------------- */

.header {
    position: relative;
    z-index: 50;
    background: #fff;
    box-shadow: 0 1px 0 var(--sh-line), 0 4px 18px rgba(29, 42, 27, .05);
}

.header-logo-link {
    display: block;
    width: 204px;
}
.header-logo-link img {
    display: block;
    width: 100%;
    height: auto;
}
@media (max-width: 991px) {
    .header-logo-link { width: 150px; }
}
@media (max-width: 575px) {
    .header-logo-link { width: 108px; }
    .header-flex { min-height: 68px; align-items: center; }
    .menu-list-phone .list-phone { font-size: 16px; letter-spacing: 0; }
}

.menu-list-link,
.menu-list-link.my-link {
    color: var(--sh-ink);
    letter-spacing: .04em;
    font-size: 14px;
}
.menu-list-item:hover .menu-list-link.my-link,
.menu-list-item.is-active .menu-list-link.my-link,
.menu-list-link:hover {
    color: var(--sh-green);
}
.menu-list-link.active,
.menu-list-link.active:hover,
.menu-list-item:hover .menu-list-link.my-link.active,
.menu-list-item.is-active .menu-list-link.my-link.active {
    color: var(--sh-green);
}
@media (min-width: 992px) {
    .nav-collapse .menu-list > .menu-list-item > .menu-list-link::before,
    .nav-collapse .menu-list > .menu-list-item > .my-list-item > .menu-list-link::before {
        content: "";
        position: absolute;
        left: 12px;
        right: 20px;
        bottom: 10px;
        height: 2px;
        border-radius: 1px;
        background: var(--sh-sun);
        transform: scaleX(0);
        transform-origin: left;
        transition: transform .25s var(--sh-ease);
    }
    .nav-collapse .menu-list > .menu-list-item:hover > .menu-list-link::before,
    .nav-collapse .menu-list > .menu-list-item:hover > .my-list-item > .menu-list-link::before,
    .nav-collapse .menu-list > .menu-list-item > .menu-list-link.active::before {
        transform: scaleX(1);
    }
}

.icon-arrow polyline { stroke: currentColor; stroke-width: 1.6px; }

/* Выпадающие подменю */
.panels__list {
    padding: 8px;
    border: 1px solid var(--sh-line);
    border-radius: var(--sh-radius);
    background: rgba(255, 255, 255, .98);
    box-shadow: var(--sh-shadow-hover);
}
.panels__list .menu-list-item { display: block; }
.panels__list .menu-list-link {
    display: block;
    padding: 10px 12px;
    border-radius: var(--sh-radius-sm);
    text-transform: none;
    font-weight: 500;
    letter-spacing: 0;
    font-size: 15px;
}
.panels__list .menu-list-link:hover,
.my-list-item .menu-list-link.my-link:hover {
    color: var(--sh-green);
    background: var(--sh-green-soft);
}
.panels__list .menu-list-link::before { display: none; }

/* Телефон и мессенджеры */
.list-phone {
    color: var(--sh-ink) !important;
    font-weight: 700;
    letter-spacing: .01em;
}
.list-phone:hover { color: var(--sh-green) !important; }
.messenger__list .social__link_mobile a {
    border-radius: 7px;
    overflow: hidden;
    transition: transform .2s var(--sh-ease), box-shadow .2s ease;
}
.messenger__list .social__link_mobile a:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 10px rgba(29, 42, 27, .18);
}

/* --- Кнопки ------------------------------------------------------------- */

.btn {
    border-radius: 999px;
    padding: 1.15em 2em 1.05em;
    letter-spacing: .08em;
    transition: background-color .2s ease, color .2s ease, box-shadow .2s ease, transform .2s var(--sh-ease);
}
.btn:hover { transform: translateY(-1px); }
@media (max-width: 575px) {
    .btn { border-radius: 14px; }
}
.btn:active { transform: translateY(0); }

.btn-green-fill,
.btn-green-fill:active,
.btn-green-fill:focus,
.btn-green-fill:visited {
    background: var(--sh-green);
    color: #fff;
    box-shadow: 0 6px 16px rgba(74, 113, 68, .28);
}
.btn-green-fill:hover {
    background: var(--sh-green-dark);
    color: #fff;
    box-shadow: 0 10px 22px rgba(47, 74, 43, .32);
}

.btn-white-fill,
.btn-white-fill:active,
.btn-white-fill:focus,
.btn-white-fill:visited {
    background: #fff;
    color: var(--sh-green-dark);
    box-shadow: 0 6px 18px rgba(0, 0, 0, .14);
}
.btn-white-fill:hover {
    background: var(--sh-sun);
    color: var(--sh-ink);
}

/* --- Формы -------------------------------------------------------------- */

.form-input,
.form-textarea,
.form-control,
.my__form-control {
    border: 1px solid var(--sh-line);
    border-radius: var(--sh-radius-sm);
    transition: border-color .2s ease, box-shadow .2s ease;
}
.form-input:focus,
.form-textarea:focus,
.form-control:focus,
.my__form-control:focus {
    border-color: var(--sh-green);
    box-shadow: 0 0 0 4px rgba(74, 113, 68, .15);
    outline: none;
}

/* Зелёный блок «Начни свой проект…» и другие плашки на зелёном фоне */
.bg-green-normal.padding-content-2-3 {
    border-radius: 16px;
    box-shadow: 0 18px 44px rgba(47, 74, 43, .28);
}

/* --- Карточки «Дома из соломы» / «Солнечная энергетика» ------------------- */

.project-image-block {
    border-radius: var(--sh-radius);
    box-shadow: var(--sh-shadow);
    transition: box-shadow .3s ease, transform .3s var(--sh-ease);
    isolation: isolate;
}
.project-content:hover .project-image-block,
.project-image-block:hover {
    opacity: 1;
    transform: translateY(-4px);
    box-shadow: var(--sh-shadow-hover);
}
.project-image-block img {
    transition: transform .6s var(--sh-ease);
}
.project-image-block::after {
    height: 70%;
    background-image: linear-gradient(180deg, rgba(20, 31, 18, 0) 0%, rgba(20, 31, 18, .55) 45%, rgba(20, 31, 18, .9) 100%);
}
.project-title-block { padding: 0 1.5rem 1.4rem; }
.project-title-block .project-name {
    max-height: none;
    color: #fff;
    line-height: 1.15;
}
.project-place {
    margin-top: 6px;
    opacity: .85;
    font-size: 16px;
    line-height: 1.35;
}

/* Слайдер готовых проектов */
.img-flex-main-project-slider {
    border-radius: var(--sh-radius);
}

/* --- «Как это работает» -------------------------------------------------- */

.how-it-work-number .box {
    border-radius: 50%;
    color: var(--sh-green-dark);
    font-weight: 700;
}
.how-it-work-item::after { background-color: rgba(233, 162, 59, .35); }

/* Иконки и номера шагов на светлом фоне */
.box.bg-brown-light {
    border-radius: 50%;
    background: var(--sh-sun-soft);
    box-shadow: inset 0 0 0 1px rgba(233, 162, 59, .35);
}

/* --- Отзывы -------------------------------------------------------------- */

.testimonial-image-block {
    border-radius: var(--sh-radius);
    overflow: hidden;
}

/* --- Изображения в статьях ----------------------------------------------- */

.blog-post-content img,
.content img.img-responsive {
    border-radius: var(--sh-radius-sm);
}

/* --- Подвал -------------------------------------------------------------- */

#footer {
    background-color: var(--sh-green-deep);
    border: 0;
    border-top: 4px solid var(--sh-sun);
}
#footer-widgets .widget { color: #b9c4b6; }
#footer-widgets .widget .widget-title > span::after { background-color: var(--sh-sun); }
.logo__footer {
    width: 168px;
    height: auto;
}
.footer-link,
.footer-list-link {
    transition: color .2s ease, opacity .2s ease;
}
.footer-link:hover,
.footer-list-link:hover {
    color: var(--sh-sun);
}

/* --- Уважение к настройке «меньше движения» ------------------------------ */

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
    }
    .btn:hover, .project-image-block:hover { transform: none; }
}