/**
 * CoreProIT brand color system, derived from the official blue and orange logo.
 * Components consume semantic tokens rather than introducing independent colors.
 */
:root {
    --cp-blue: #0257c2;
    --cp-blue-dark: #03439b;
    --cp-blue-deep: #062a55;
    --cp-blue-light: #4c91e8;
    --cp-orange: #fb6c06;
    --cp-orange-dark: #c94d00;
    --cp-orange-light: #fff0e5;
    --cp-navy: #061a33;
    --cp-navy-soft: #0b2441;
    --cp-primary: var(--cp-blue);
    --cp-primary-hover: var(--cp-blue-dark);
    --cp-secondary: var(--cp-orange);
    --cp-accent: var(--cp-orange);
    --cp-accent-soft: var(--cp-orange-light);
    --cp-text: #10243d;
    --cp-text-muted: #53667a;
    --cp-text-on-dark: #ffffff;
    --cp-text-muted-on-dark: #bdcada;
    --cp-border: #d6e1ec;
    --cp-border-dark: #263b55;
    --cp-border-on-dark: rgba(255, 255, 255, .48);
    --cp-surface: #ffffff;
    --cp-surface-soft: #f3f7fb;
    --cp-surface-blue: #e9f2ff;
    --cp-surface-orange: var(--cp-orange-light);
    --cp-focus: var(--cp-blue);
    --cp-shadow-brand: rgba(2, 87, 194, .24);
    --cp-blue-rgb: 2, 87, 194;
    --cp-orange-rgb: 251, 108, 6;
    --cp-navy-rgb: 6, 26, 51;

    /* Shared layout and typography foundations. */
    --cp-font-sans: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --cp-container: 1180px;
    --cp-container-wide: 1280px;
    --cp-container-max: 1400px;
    --cp-gutter: 24px;
    --cp-gutter-tablet: 20px;
    --cp-gutter-mobile: 16px;
    --cp-gutter-fluid: clamp(24px, 3.333vw, 64px);
    --cp-font-weight-body: 400;
    --cp-font-weight-medium: 650;
    --cp-font-weight-heading: 750;
    --cp-font-weight-bold: 800;
    --cp-section-space-compact: clamp(56px, 7vw, 80px);
    --cp-section-space-standard: clamp(68px, 8vw, 108px);
    --cp-section-space-spacious: clamp(76px, 9vw, 120px);
    --cp-button-height-compact: 44px;
    --cp-button-height: 52px;
    --cp-button-height-prominent: 56px;
}

.cp-home a:focus-visible,
.cp-home button:focus-visible,
.cp-services a:focus-visible,
.cp-services button:focus-visible,
.cp-about a:focus-visible,
.cp-about button:focus-visible {
    outline: 3px solid var(--cp-focus);
    outline-offset: 3px;
}
/* Keep all custom CoreProIT templates independent from Astra typography defaults. */
.cp-home,
.cp-services,
.cp-about,
.cp-detail,
.cp-pricing,
.cp-contact {
    font-family: var(--cp-font-sans);
}