section { padding: 60px 0; }

.section-title {
            font-family: "Playfair Display", serif;
            font-size: 36px;
            text-align: center;
            margin-bottom: 50px;
            position: relative;
            padding-bottom: 15px;
        }


footer { margin-top: 80px; }


/* --- MINI FAQ НА ВНУТРЕННИХ СТРАНИЦАХ --- */


@media (max-width: 768px) {
            .services-final-cta .faq-preview-link {
                margin-right: 0;
                margin-bottom: 12px;
            }
        }

/* --- КОНЦЕПТ ОБНОВЛЕННОЙ СТРАНИЦЫ УСЛУГ --- */

.services-lead {
            max-width: 860px;
            margin: 0 auto 58px;
            text-align: center;
            color: #444;
            font-size: 1.06rem;
            line-height: 1.78;
        }

.services-compact-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 24px;
            margin: 0 0 70px;
        }

/* Ссылки являются элементами grid, а карточки внутри них должны занимать
   всю высоту строки — иначе карточка с коротким текстом получается ниже
   соседней некликабельной карточки. */
.site-v2 .services-compact-grid > .card-link,
.site-v2 .services-compact-grid > .card-link > .service-compact-card {
            height: 100%;
        }

.service-compact-card {
            background: var(--white);
            border-radius: 10px;
            padding: 28px 28px 26px;
            /* border-top визуально серый (var(--line)), а не золотой — см. .card в index.css */
            border: 1px solid var(--line);
            border-top-width: 4px;
            /* тень тоже была var(--shadow-soft) через !important, а не 0 9px 26px — сохраняем как есть */
            box-shadow: var(--shadow-soft);
            min-height: 188px;
            transition: 0.25s ease;
        }

.service-compact-card:hover {
            transform: translateY(-4px);
        }

.service-compact-card h3 {
            font-family: "Playfair Display", serif;
            color: var(--dark);
            font-size: 1.32rem;
            margin-bottom: 12px;
        }

.service-compact-card p {
            color: #555;
            font-size: 0.96rem;
            line-height: 1.62;
        }

.quiet-panel {
            background: var(--white);
            border-radius: 11px;
            /* тень тоже была var(--shadow-soft) через !important, а не 0 10px 32px — сохраняем как есть */
            box-shadow: var(--shadow-soft);
            padding: 42px;
            margin: 0 0 62px;
            /* граница визуально серая (var(--line)) — см. .card в index.css.
               border-color на невидимых сторонах (style:none) — для идентичности computed style. */
            border-color: var(--line);
            border-top: 3px solid var(--line);
        }

.quiet-panel h2,
        .quiet-panel h3 {
            font-family: "Playfair Display", serif;
            color: var(--dark);
        }

.quiet-panel h2 {
            font-size: 2rem;
            margin-bottom: 16px;
            position: relative;
            padding-top: 4px;
        }

.quiet-panel h2::before {
            content: "";
            display: block;
            width: 44px;
            height: 2px;
            background: var(--gold);
            margin-bottom: 12px;
        }

.quiet-panel h3 {
            font-size: 1.45rem;
            margin-bottom: 12px;
        }

.quiet-panel p {
            color: #555;
            line-height: 1.7;
        }

.retouch-concept-grid {
            display: grid;
            grid-template-columns: 1fr;
            gap: 28px;
            align-items: start;
        }

.retouch-concept-grid > div:first-child {
            max-width: 820px;
        }

.retouch-concept-grid .retouch-grid {
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 24px;
            max-width: 1040px;
            margin: 0 auto;
            width: 100%;
        }

.retouch-concept-grid .comparison-slider {
            aspect-ratio: 4/5;
            box-shadow: 0 8px 22px rgba(0,0,0,0.12);
        }

.production-grid {
            display: grid;
            grid-template-columns: minmax(0, 1fr) minmax(340px, 520px);
            gap: 40px;
            align-items: center;
        }

.production-grid .video-container {
            padding-bottom: 56.25%;
            box-shadow: 0 8px 24px rgba(0,0,0,0.12);
        }

.work-steps {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 22px;
            margin-top: 26px;
        }

.work-step {
            background: #fafafa;
            border: 1px solid rgba(184,151,120,0.22);
            border-top: 3px solid rgba(184,151,120,0.72);
            border-radius: 10px;
            padding: 23px;
        }

.work-step strong {
            display: block;
            color: var(--dark);
            margin-bottom: 7px;
            font-weight: 500;
        }

.work-step span {
            color: #555;
            font-size: 0.92rem;
            line-height: 1.55;
        }

.services-accent-block {
            margin: 70px 0;
            background: var(--dark);
            color: var(--white);
            padding: 45px;
            border-left: 4px solid var(--gold);
            border-top: 1px solid rgba(184,151,120,0.55);
            border-radius: 10px;
            position: relative;
            overflow: hidden;
        }

.services-accent-block::before {
            content: "";
            position: absolute;
            top: -50px;
            right: -50px;
            width: 180px;
            height: 180px;
            border-radius: 50%;
            background: rgba(184,151,120,0.08);
        }

.services-accent-block h3 {
            font-family: "Playfair Display", serif;
            color: var(--gold);
            margin-bottom: 18px;
            font-size: 2rem;
            position: relative;
            z-index: 2;
        }

.services-accent-block p {
            max-width: 950px;
            color: rgba(255,255,255,0.9);
            position: relative;
            z-index: 2;
        }

.services-accent-block .faq-preview-link {
            margin-top: 22px;
            position: relative;
            z-index: 2;
            color: var(--gold);
            border-color: rgba(184,151,120,0.78);
        }

.installation-showcase {
            margin: 0 0 62px;
        }

.installation-intro {
            max-width: 780px;
            margin: 0 auto 34px;
            text-align: center;
            color: #555;
            line-height: 1.7;
        }

.installation-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 24px;
        }

.installation-card {
            background: var(--white);
            border-radius: 11px;
            overflow: hidden;
            /* граница визуально серая (var(--line)) — см. .card в index.css */
            border: 1px solid var(--line);
            box-shadow: 0 9px 26px rgba(0,0,0,0.052);
        }

.installation-card img {
            display: block;
            width: 100%;
            height: 250px;
            object-fit: cover;
        }

.installation-card-content {
            padding: 22px 23px 24px;
        }

.installation-card-content h3 {
            font-family: "Playfair Display", serif;
            color: var(--dark);
            font-size: 1.28rem;
            margin-bottom: 10px;
        }

.installation-card-content p {
            color: #555;
            font-size: 0.94rem;
            line-height: 1.62;
        }

.services-final-cta {
            text-align: center;
            margin: 72px 0 45px;
            padding: 42px 30px;
            background: white;
            border-radius: 12px;
            border-top: 4px solid var(--gold);
            /* тень тоже была var(--shadow-soft) через !important, а не 0 10px 34px — сохраняем как есть */
            box-shadow: var(--shadow-soft);
        }

.services-final-cta h3 {
            font-family: "Playfair Display", serif;
            margin-bottom: 18px;
            font-size: 1.7rem;
            color: var(--dark);
        }

.services-final-cta p {
            max-width: 700px;
            margin: 0 auto 22px;
            color: #555;
            line-height: 1.65;
        }

.services-final-cta .faq-preview-link {
            margin-right: 12px;
        }

@media (max-width: 1024px) {
            .services-compact-grid,
            .work-steps,
            .installation-grid {
                grid-template-columns: repeat(2, 1fr);
            }
            .retouch-concept-grid,
            .production-grid {
                grid-template-columns: 1fr;
            }
        }

@media (max-width: 768px) {
            .services-compact-grid,
            .work-steps,
            .installation-grid,
            .retouch-concept-grid .retouch-grid {
                grid-template-columns: 1fr;
            }
            .service-compact-card {
                min-height: auto;
                padding: 22px;
            }
            .quiet-panel {
                padding: 26px 22px;
            }

            .services-accent-block {
                padding: 35px 25px;
                margin: 50px 0;
            }

            .services-accent-block h3 {
                font-size: 1.7rem;
            }
        }
/* На экранах с многоколоночной сеткой все строки карточек имеют одну высоту.
   На мобильных сохраняется естественная высота, чтобы не появлялись пустоты. */
@media (min-width: 769px) {
            .site-v2 .services-compact-grid {
                grid-auto-rows: 1fr;
            }
        }

/* У соседних секций достаточно нижней границы предыдущего блока:
   верхняя граница следующего иначе образует второй разделитель. */
.site-v2 .quiet-panel + .quiet-panel {
            border-top: 0;
        }
