/*
 * Country cluster brand-surface layer.
 * Loaded only on the 15 USA, UK and UAE content pages.
 * The dark neutral base protects readability; coral/orange tints provide the
 * Swap Design identity without turning body copy into low-contrast bright fills.
 */
body[data-sd-page="usa-content"],
body[data-sd-page="uk-content"],
body[data-sd-page="uae-content"] {
    --navy-dark: #0d0809;
    --navy: #1a0c0e;
    --navy-mid: #29130f;
}

/* Shared token surfaces: warm brand-derived darks instead of blue/navy fills. */
body[data-sd-page="usa-content"] .sd-usa-page,
body[data-sd-page="uk-content"] .sd-uk-page,
body[data-sd-page="uae-content"] .sd-uae-page {
    background-color: #0d0809;
}

/* USA country visual panels and story cards. */
body[data-sd-page="usa-content"] .sd-usa-intro-visual,
body[data-sd-page="usa-content"] .sd-usa-conversion-panel,
body[data-sd-page="usa-content"] .sd-usa-visual-window {
    background: radial-gradient(circle at 78% 18%, rgba(255, 118, 62, .18), transparent 32%), linear-gradient(145deg, #29130f, #0d0809);
}
body[data-sd-page="usa-content"] .sd-usa-story-card {
    background: linear-gradient(145deg, rgba(255, 62, 62, .12), rgba(255, 118, 62, .08)), #0d0809;
}
body[data-sd-page="usa-content"] .sd-usa-deliverable,
body[data-sd-page="usa-content"] .sd-usa-related-card {
    background: linear-gradient(155deg, rgba(255, 118, 62, .11), rgba(255, 62, 62, .06)), #0d0809;
}

/* UK project visual and its prior cool-toned variant rails. */
body[data-sd-page="uk-content"] .sd-uk-project-panel {
    background: radial-gradient(circle at 88% 12%, rgba(255, 118, 62, .16), transparent 34%), linear-gradient(145deg, #29130f, #0d0809);
}
body[data-sd-page="uk-content"] .sd-uk-project-panel--choose::before,
body[data-sd-page="uk-content"] .sd-uk-project-panel--scope::before,
body[data-sd-page="uk-content"] .sd-uk-project-panel--maintenance::before,
body[data-sd-page="uk-content"] .sd-uk-project-panel--redesign::before {
    background: var(--gradient-primary);
}

/* UAE surfaces: replace blue-mid values while preserving the UAE-only content system. */
body[data-sd-page="uae-content"] .sd-uae-page {
    --uae-ink: #0d0809;
    --uae-surface: #29130f;
    --uae-surface-2: #351912;
}
body[data-sd-page="uae-content"] .sd-uae-story-card,
body[data-sd-page="uae-content"] .sd-uae-signal,
body[data-sd-page="uae-content"] .sd-uae-deliverable {
    background: linear-gradient(145deg, rgba(255, 62, 62, .12), rgba(255, 118, 62, .08)), #0d0809;
}