:root {
    --container-max: 1320px;
    --page-bg: rgba(255, 241, 231, 1);
    --orange: #F47A1F;
    --orange-light: #ff9637;
    --white: #FFFFFF;
    --black: #000000;
    --dark: #1c1c1a;
    --dark-grey: #2E2E2E;
    --grey: #878787;
    --cream: rgba(255, 241, 231, 1);
    --cream-dark: #f0e8de;
    --text-light: #f5f5f2;
    --text-muted: #a39e96;
    --dark-card: #2a2825;
    --dark-card2: #35322e;
    --fs-h1: 50px;
    --fs-h2: 32px;
    --radius: 16px;
    --radius-lg: 24px;
    --page-gutter: 6px;

    /* Размер надписи «ДОВЕРИЕ» в большой карточке клиентов — меняйте только это значение */
    --client-epigraph-font-size: 108px;

    /* Иконка Arrow 2.svg: круг и стрелка (как в .btn-more), масштаб 420px → 1440px */
    --btn-more-icon-circle: clamp(37px, calc(37px + 3 * (100vw - 420px) / 1020), 40px);
    --btn-more-icon-arrow: clamp(14px, calc(14px + 3 * (100vw - 420px) / 1020), 17px);

    /* Плавное масштабирование кнопок: 420px (min) → 1440px (max) */
    --btn-primary-height: clamp(45px, calc(45px + 10 * (100vw - 420px) / 1020), 55px);
    --btn-primary-font-size: clamp(16px, calc(16px + 2 * (100vw - 420px) / 1020), 18px);
    --btn-primary-radius: clamp(40px, calc(40px + 60 * (100vw - 420px) / 1020), 100px);
    --btn-primary-padding-x: clamp(25px, calc(25px + 5 * (100vw - 420px) / 1020), 30px);

    --btn-more-height: clamp(44px, calc(44px + 11 * (100vw - 420px) / 1020), 55px);
    --btn-more-font-size: clamp(14px, calc(14px + 4 * (100vw - 420px) / 1020), 18px);
    --btn-more-radius: clamp(40px, calc(40px + 60 * (100vw - 420px) / 1020), 100px);
    --btn-more-padding-top: clamp(5px, calc(5px + 10 * (100vw - 420px) / 1020), 15px);
    --btn-more-padding-right: clamp(5px, calc(5px + 25 * (100vw - 420px) / 1020), 30px);
    --btn-more-padding-bottom: clamp(5px, calc(5px + 10 * (100vw - 420px) / 1020), 15px);
    --btn-more-padding-left: clamp(15px, calc(15px + 15 * (100vw - 420px) / 1020), 30px);
    --btn-more-gap: clamp(11px, calc(13px - 2 * (100vw - 420px) / 1020), 13px);

    /* Цвет нумерации 2-й и 4-й карточек услуг (мобилка, оранжевый фон) */
    --service-card-num-accent: rgba(255, 255, 255, 0.1);
}

@media (max-width: 768px) {
    :root {
        --container-max: 100%;
        --page-gutter: 15px;
    }
}
