/* ═══════════════════════════════════════════════════════
   DATACENTER PROXIES PRICING - Page-specific styles
   modern teal/cyan theme. Supplements
   pricing.css + modules/pricing.css. All overrides are
   scoped to .dc-pr so the shared pricing chrome stays
   type-agnostic.
   ═══════════════════════════════════════════════════════ */

/* ─── Page wrapper ─── */
.dc-pr {
    font-family: 'Mulish', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    /* Gibson-like display font for every heading + the pricing module */
    --db-font-display: 'Mulish', 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}

/* ─── Navy bands - match the product page hero gradient ─── */
.dc-pr .db-pricing-hero,
.dc-pr .db-pricing-cta {
    background: linear-gradient(168deg, #07142b 0%, #091B36 46%, #0d264c 100%);
}

/* Brand glow tint for the hero + CTA radial wash */
.dc-pr .db-pricing-hero__bg::before {
    background: radial-gradient(circle, rgba(11, 140, 174, 0.22) 0%, rgba(6, 182, 212, 0.05) 45%, transparent 70%);
}
.dc-pr .db-pricing-cta::before {
    background: radial-gradient(ellipse at center, rgba(11, 140, 174, 0.2) 0%, transparent 68%);
}

/* Hero accent word - teal → cyan, consistent with the product hero */
.dc-pr .db-pricing-hero h1 span {
    background: linear-gradient(100deg, #67E8F9 0%, #0B8CAE 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* ─── Reduced motion ─── */
@media (prefers-reduced-motion: reduce) {
    .dc-pr .db-pricing-hero__breadcrumb a {
        transition: none !important;
    }
}