/* Omni-Science Media — Page Styles */

/* Page accent overrides */
body.media-page { --accentA: var(--media-accent-1); --accentB: var(--media-accent-2); }

/* Header motif: pulse + crosshair hints */
body.media-page header {
    background:
        radial-gradient(1000px 420px at 50% -10%, rgba(215,255,0,.18), transparent 60%),
        radial-gradient(820px 360px at 100% 10%, rgba(57,255,20,.16), transparent 58%),
        linear-gradient(#0b0b0e, #0a0a0c);
    position: relative;
}
body.media-page header::after {
    content: "";
    position: absolute; inset: 0;
    pointer-events: none;
    background:
        radial-gradient(1px 1px at 50% 60%, rgba(215,255,0,.6), transparent 60%),
        radial-gradient(220px 220px at 50% 60%, rgba(215,255,0,.06), transparent 65%),
        linear-gradient(transparent 49.5%, rgba(215,255,0,.12) 50%, transparent 50.5%),
        linear-gradient(90deg, transparent 49.5%, rgba(215,255,0,.12) 50%, transparent 50.5%);
    mask: radial-gradient(60% 60% at 50% 60%, black, transparent);
}

/* Focus panel */
body.media-page main section#focus {
    background: rgba(255,255,255,.02);
    border: 1px solid var(--stroke);
    border-radius: 16px;
    padding: 20px;
}

/* Accent pills & tags */
.pill {
    display: inline-block;
    padding: 6px 10px;
    border-radius: 999px;
    border: 1px solid var(--stroke);
    background: rgba(255,255,255,.04);
    color: #d6d6d6;
    font-size: 12px;
    letter-spacing: .3px;
}

/* CTA emphasis using optional infrared accent */
.cta-hot { border-color: var(--accentHot); background: linear-gradient(90deg, rgba(255,45,85,.18), rgba(255,45,85,.10)); }

/* Match card style with the media brand color palette */
.card {
    background: linear-gradient(180deg, rgba(18,18,22,.92), rgba(12,12,14,.92)) padding-box,
                linear-gradient(90deg, color-mix(in sRGB, var(--media-accent-2) 38%, transparent), color-mix(in sRGB, var(--media-accent-1) 38%, transparent)) border-box;
    border: 1px solid transparent;
    box-shadow: 0 10px 30px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.02);
}

/* Emphasize headings and links with media gradient */
.card h3, .card h4 { letter-spacing: -.01em; }
.card .link { background: linear-gradient(90deg, var(--media-accent-2), var(--media-accent-1)); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }

}