@import url("https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,600&family=Public+Sans:wght@400;500;600;700&display=swap");

.item-detail[data-id-root][data-id-variant="editorial"] {
    --id-page-background:
        radial-gradient(circle at top left, rgba(187, 123, 56, 0.12), transparent 28rem),
        radial-gradient(circle at top right, rgba(49, 95, 139, 0.14), transparent 28rem),
        transparent;
    --id-hero-background:
        linear-gradient(135deg, rgba(12, 18, 24, 0.96), rgba(19, 38, 55, 0.9)),
        linear-gradient(135deg, #0f2740, #315f8b 58%, #1d8f78);
    --id-hero-media-background: #ffffff;
    --id-hero-media-overlay: linear-gradient(180deg, transparent, rgba(0, 0, 0, 0.48));
    --id-kicker-color: rgba(255, 255, 255, 0.72);
    --id-lead-color: rgba(255, 255, 255, 0.84);
    --id-chip-background: rgba(255, 255, 255, 0.1);
    --id-chip-border-color: rgba(255, 255, 255, 0.12);
    --id-highlight-border-color: rgba(255, 255, 255, 0.12);
    --id-highlight-grid-background: rgba(255, 255, 255, 0.1);
    --id-highlight-background: rgba(255, 255, 255, 0.04);
    --id-highlight-backdrop-filter: blur(12px);
    --id-highlight-label-color: rgba(255, 255, 255, 0.64);
    --id-highlight-value-color: var(--text-inverse);
    --id-hero-placeholder-label-border-color: rgba(255, 255, 255, 0.14);
    --id-hero-placeholder-label-background: rgba(255, 255, 255, 0.08);
    --id-hero-placeholder-label-color: rgba(255, 255, 255, 0.76);
    --id-hero-placeholder-copy-color: rgba(255, 255, 255, 0.7);
    --id-info-banner-border-color: rgba(180, 106, 31, 0.22);
    --id-spec-row-background: rgba(255, 255, 255, 0.38);
    --id-spec-row-alt-background: rgba(49, 95, 139, 0.06);
    --id-spec-header-color: #183a59;
    --id-spec-value-color: #0b5b4d;
    --id-spec-value-background: transparent;
    --id-spec-value-border-color: transparent;
    --id-spec-value-radius: 0;
    --id-spec-value-padding: 0;
    --id-spec-unit-color: #2e6d62;
}
