/* ════════════════════════════════════════════════════════ WACKT CASE-LIGHT — champagne glass skin for case studies Loads LAST in (after inline styles) so it wins. Heroes stay cinematic (dark image + white type). ════════════════════════════════════════════════════════ */ :root { --signal-a: #AC945F; /* champagne */ --signal-b: #878E98; /* silver */ --signal-grad: linear-gradient(115deg, #C9B384, #AC945F); --ink: #0B0C10; --ink-60: rgba(11, 12, 16, 0.62); --ink-40: rgba(11, 12, 16, 0.42); --line: rgba(11, 12, 16, 0.09); } body { background: #FAFAFC !important; color: var(--ink) !important; } ::selection { background: #AC945F; color: #fff; } /* header: light glass; white logo shown dark via invert */ .global-header { background: rgba(250, 250, 252, 0.72) !important; -webkit-backdrop-filter: blur(20px) saturate(1.3); backdrop-filter: blur(20px) saturate(1.3); border-bottom: 1px solid var(--line) !important; } .global-header .header-logo-img { filter: invert(1); } .desktop-nav a:not(.btn) { color: var(--ink-60) !important; } .desktop-nav a:not(.btn):hover { color: var(--ink) !important; } .desktop-nav .btn-outline { color: var(--ink) !important; border-color: rgba(11, 12, 16, 0.25) !important; } .desktop-nav .btn-outline:hover { border-color: #AC945F !important; color: #AC945F !important; } /* hero stays dark-over-image; just re-tint accents */ .project-hero .project-tag { color: #D9C7A0 !important; } /* content on light */ .back-link { color: #AC945F !important; } .back-link:hover { color: var(--ink) !important; } .section-rule { background: var(--line) !important; } .meta-row { border-color: var(--line) !important; background: rgba(240, 242, 246, 0.5); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); } .meta-row .meta-item { border-color: var(--line) !important; } .meta-label { color: var(--ink-40) !important; } .meta-value { color: var(--ink) !important; } .lead-block .big { color: var(--ink) !important; } .lead-block .sub { color: var(--ink-60) !important; } /* alternating flow */ .case-copy h2 { color: var(--ink); } .case-copy p { color: var(--ink-60); } .case-copy .c-num { color: #AC945F; } .case-copy .c-num::before { background: var(--signal-grad); } .case-copy .c-links a { border-color: rgba(172, 148, 95, 0.45); color: #8A7443; } .case-copy .c-links a:hover { background: var(--signal-grad); color: #14161B; } .case-media { border-color: rgba(255, 255, 255, 0.7); box-shadow: 0 24px 60px -24px rgba(11, 12, 16, 0.3); } /* glass panels on light */ .scope-note, .audio-player-section { background: rgba(240, 242, 246, 0.55) !important; -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); border: 1px solid rgba(255, 255, 255, 0.7) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8), 0 8px 26px -16px rgba(11, 12, 16, 0.14); } .scope-note h5, .audio-player-section h3 { color: #AC945F !important; } .scope-note p { color: var(--ink-60) !important; } .audio-track h4 { color: var(--ink-40) !important; } .custom-audio { filter: none !important; opacity: 1 !important; } /* campaign blocks (jarir) */ .campaign-badge { background: rgba(172, 148, 95, 0.1) !important; border-color: rgba(172, 148, 95, 0.3) !important; } .campaign-badge span { color: #8A7443 !important; } .campaign-dot { background: #AC945F !important; } .campaign-title { color: var(--ink) !important; } .campaign-desc { color: var(--ink-60) !important; } .audio-section-title { color: var(--ink-40) !important; } .audio-placeholder-note { color: rgba(172, 148, 95, 0.7) !important; } /* project titles inside hero remain white; em keeps gradient */ .project-title em { background: linear-gradient(100deg, #E8DCC0, #D9C7A0) !important; -webkit-background-clip: text !important; background-clip: text !important; -webkit-text-fill-color: transparent !important; } /* footer */ .global-footer { background: #FAFAFC !important; border-top: 1px solid var(--line) !important; } .global-footer p { color: var(--ink-40) !important; } /* premium.js glows: soften for light bg */ .tungsten-glow { opacity: 0.35; } /* lightbox stays dark (correct for viewing) */