/* ============================================================ PREMIUM AMBER THEME (data-theme="premium" on ) Colour system: mockup new_frontend/ amber series Design language: mockup ver_2_only_for_core_design/ Primary accent: #D4700A — rich deep amber, 7:1 on #050606 (WCAG AA ✓) ============================================================ */ /* ── Theme toggle button in premium mode ── */ [data-theme="premium"] .theme-toggle-btn { border-color: rgba(212,112,10,.38); color: #D4700A; } [data-theme="premium"] .theme-toggle-btn:hover { background: rgba(212,112,10,.10); color: #E8841A; border-color: #D4700A; } /* ── CSS custom-property overrides ── */ [data-theme="premium"] { --bg: #050606; --bg-alt: #080909; --bg-dark: #050606; --bg-dark-2: #080909; --bg-dark-3: #0d0c0a; --card: #0d0c0a; --card-2: #0d0c0a; --card-dark: #090a09; --black: #F3F1EA; --dark: #050606; --dark-2: #080909; --dark-3: #0d0c0a; --border: rgba(212,112,10,.18); --border-2: rgba(212,112,10,.38); --accent: #D4700A; --accent-hover: #E8841A; --accent-glow: rgba(212,112,10,.22); --gold: #F5A850; --gold-light: #FFD090; --navy: #050606; --blue: #D4700A; --blue-bright: #E8841A; --blue-glow: rgba(212,112,10,.22); --emerald: #D4700A; --emerald-glow: rgba(212,112,10,.22); --purple: #E8841A; --white: #F3F1EA; --text-1: #F3F1EA; --text-2: #AAA69C; --text-3: #716D65; --light-bg: #080909; --light-card: #0d0c0a; --light-text: #F3F1EA; --light-text2: rgba(243,241,234,.74); --light-border: rgba(212,112,10,.14); --shadow-sm: 0 1px 3px rgba(0,0,0,.55), 0 0 8px rgba(212,112,10,.03); --shadow: 0 4px 20px rgba(0,0,0,.62), 0 0 20px rgba(212,112,10,.05); --shadow-lg: 0 16px 56px rgba(0,0,0,.72), 0 0 40px rgba(212,112,10,.08); --shadow-blue: 0 8px 32px rgba(212,112,10,.22); --shadow-em: 0 8px 32px rgba(212,112,10,.22); --ctx-h: #F3F1EA; --ctx-body: rgba(243,241,234,.76); --ctx-muted: rgba(200,195,185,.48); --ctx-border: rgba(212,112,10,.12); --ctx-faq-bg: rgba(212,112,10,.06); } /* ── Body ── */ [data-theme="premium"] body { background: #050606; color: #F3F1EA; } /* Ambient amber top-glow + warm gradient */ [data-theme="premium"] body::before { content: ""; position: fixed; inset: 0; z-index: -5; pointer-events: none; background: radial-gradient(circle at 50% 4%, rgba(212,112,10,.07), transparent 30%), linear-gradient(180deg, #050606 0%, #080909 55%, #050606 100%); } /* Subtle amber dot-grid — fades out toward bottom */ [data-theme="premium"] body::after { content: ""; position: fixed; inset: 0; z-index: -4; pointer-events: none; background-image: linear-gradient(rgba(212,112,10,.022) 1px, transparent 1px), linear-gradient(90deg, rgba(212,112,10,.022) 1px, transparent 1px); background-size: 64px 64px; mask-image: linear-gradient(#000, transparent 88%); } /* ── Nav ── */ [data-theme="premium"] #nav { background: rgba(5,6,6,.88); border-bottom: 1px solid rgba(212,112,10,.12); } [data-theme="premium"] #nav.scrolled { background: rgba(5,6,6,.97); border-color: rgba(212,112,10,.20); } [data-theme="premium"] .nav-links > li > a { color: rgba(243,241,234,.65); } [data-theme="premium"] .nav-links > li > a:hover, [data-theme="premium"] .nav-links > li > a.active { color: #D4700A; } [data-theme="premium"] .nav-dropdown { background: #0d0c0a; border-color: rgba(212,112,10,.14); box-shadow: 0 16px 48px rgba(0,0,0,.82), 0 0 32px rgba(212,112,10,.06); } [data-theme="premium"] .nav-dropdown a { color: rgba(243,241,234,.70); border-bottom-color: rgba(212,112,10,.07); } [data-theme="premium"] .nav-dropdown a:hover { background: rgba(212,112,10,.06); color: #E8841A; } [data-theme="premium"] .nav-toggle span { background: rgba(243,241,234,.80); } [data-theme="premium"] .nav-logo-name { color: #F3F1EA; } [data-theme="premium"] .nav-logo-mark { background: linear-gradient(145deg, #F5A850, #D4700A); color: #160d03; } /* ── Mobile nav ── */ [data-theme="premium"] .nav-mobile { background: #090908; border-top: 1px solid rgba(212,112,10,.12); } [data-theme="premium"] .nav-mobile a { color: rgba(243,241,234,.76); border-bottom-color: rgba(212,112,10,.07); } [data-theme="premium"] .nav-mobile a:hover { color: #E8841A; } [data-theme="premium"] .nav-mobile-group-title { color: rgba(212,112,10,.58); } /* ── APEX CORE: full-hero WebGL canvas background ── */ [data-theme="premium"] #apex-core-canvas { display: block; position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; pointer-events: auto; } /* ── Hero: 3-column layout matching mockup (copy | HUD space | cards) ── */ [data-theme="premium"] .hero-layout { grid-template-columns: 1.02fr 0.92fr 0.82fr; gap: 28px; align-items: center; padding: 118px 0 48px; min-height: 700px; } [data-theme="premium"] .hero .container { position: relative; z-index: 2; } [data-theme="premium"] .hero-content { position: relative; z-index: 4; } /* ── h1: DM Sans bold sans-serif, matching mockup ── */ [data-theme="premium"] .hero h1 { font-family: 'DM Sans', 'Inter', 'Segoe UI', Arial, sans-serif; font-size: clamp(54px, 5.2vw, 84px); line-height: 0.98; letter-spacing: -0.052em; font-weight: 800; color: #F3F1EA; } [data-theme="premium"] .hero h1 span { display: block; } /* ── HUD label middle column ── */ [data-theme="premium"] .hero-core-stage { position: relative; min-height: 620px; z-index: 4; display: block; align-self: stretch; } /* HUD readout boxes */ [data-theme="premium"] .hud { position: absolute; z-index: 5; padding: 8px 10px; background: rgba(3,14,16,.72); border: 1px solid rgba(255,151,35,.25); font-size: 9px; letter-spacing: .11em; color: #7b8e8b; backdrop-filter: blur(8px); font-family: 'DM Sans', 'Inter', monospace; font-weight: 700; text-transform: uppercase; } [data-theme="premium"] .hud b { color: #ff9f2f; margin-right: 7px; } [data-theme="premium"] .hud span { color: #F3F1EA; } [data-theme="premium"] .hud-1 { left: 3%; top: 24%; } [data-theme="premium"] .hud-2 { right: 1%; top: 39%; } [data-theme="premium"] .hud-3 { left: 9%; bottom: 20%; } /* Floating label tags */ [data-theme="premium"] .hud-label { position: absolute; color: rgba(255,166,65,.48); font-size: 8px; letter-spacing: .2em; font-family: 'DM Sans', 'Inter', monospace; font-weight: 800; text-transform: uppercase; } [data-theme="premium"] .label-1 { right: 10%; top: 21%; } [data-theme="premium"] .label-2 { left: 1%; top: 44%; } /* ── Right column: styled as numbered card stack (01-05) matching mockup ── */ [data-theme="premium"] .hero-visual { position: relative; z-index: 4; } [data-theme="premium"] .hero-visual .arch-diagram { display: grid; gap: 12px; counter-reset: sys-num; } [data-theme="premium"] .hero-visual .arch-connector { display: none; } [data-theme="premium"] .hero-visual .arch-card { display: grid; grid-template-columns: 46px 1fr auto; gap: 13px; align-items: center; padding: 17px 16px; border-radius: 15px; border: 1px solid rgba(255,151,35,.20); background: linear-gradient(180deg, rgba(255,255,255,.017), rgba(255,255,255,.003)), rgba(4,15,17,.78); backdrop-filter: blur(12px); transition: .35s; position: relative; overflow: hidden; counter-increment: sys-num; } [data-theme="premium"] .hero-visual .arch-card::before { content: ""; position: absolute; inset: 0; background: linear-gradient(105deg, transparent, rgba(255,159,47,.08), transparent); transform: translateX(-120%); transition: .8s; } [data-theme="premium"] .hero-visual .arch-card.active::before, [data-theme="premium"] .hero-visual .arch-card:hover::before { transform: translateX(120%); } [data-theme="premium"] .hero-visual .arch-card.active { border-color: rgba(255,151,35,.52); box-shadow: 0 0 25px rgba(242,138,24,.08), inset 0 0 24px rgba(242,138,24,.025); } [data-theme="premium"] .hero-visual .arch-icon, [data-theme="premium"] .hero-visual .arch-icon.blue, [data-theme="premium"] .hero-visual .arch-icon.emerald, [data-theme="premium"] .hero-visual .arch-icon.purple, [data-theme="premium"] .hero-visual .arch-icon.gold { width: 46px; height: 46px; min-width: 46px; border-radius: 12px; background: rgba(242,138,24,.08); display: grid; place-items: center; color: #ff9f2f; font-size: 12px; font-weight: 800; font-family: 'DM Sans', 'Inter', sans-serif; } [data-theme="premium"] .hero-visual .arch-info { overflow: hidden; } [data-theme="premium"] .hero-visual .arch-title { font-size: 14px; font-weight: 600; color: #F3F1EA; margin: 0 0 4px; font-family: 'DM Sans', 'Inter', sans-serif; white-space: normal; line-height: 1.3; } [data-theme="premium"] .hero-visual .arch-desc { font-size: 11px; color: #7c766d; margin: 0; font-family: 'DM Sans', 'Inter', sans-serif; } /* Number badge: replace text with CSS counter 01-05 */ [data-theme="premium"] .hero-visual .badge, [data-theme="premium"] .hero-visual .badge-blue, [data-theme="premium"] .hero-visual .badge-green, [data-theme="premium"] .hero-visual .badge-gold, [data-theme="premium"] .hero-visual .badge-purple { font-size: 0; background: none; border: none; box-shadow: none; padding: 0; min-width: 0; border-radius: 0; flex-shrink: 0; } [data-theme="premium"] .hero-visual .badge::before, [data-theme="premium"] .hero-visual .badge-blue::before, [data-theme="premium"] .hero-visual .badge-green::before, [data-theme="premium"] .hero-visual .badge-gold::before, [data-theme="premium"] .hero-visual .badge-purple::before { content: "0" counter(sys-num); font-size: 11px; font-weight: 800; color: #ff9f2f; letter-spacing: 0; font-family: 'DM Sans', 'Inter', sans-serif; display: block; } /* ── Responsive: tablet — 2 columns, hide HUD space ── */ @media (max-width: 1100px) { [data-theme="premium"] .hero-layout { grid-template-columns: 1fr 0.82fr; gap: 2rem; padding: 100px 0 40px; min-height: auto; } [data-theme="premium"] .hero-core-stage { display: none; } [data-theme="premium"] .hero-visual { display: block; } [data-theme="premium"] #apex-core-canvas { display: block; } } /* ── Responsive: mobile — 1 column, hide canvas ── */ @media (max-width: 860px) { [data-theme="premium"] .hero-layout { grid-template-columns: 1fr; gap: 2.5rem; padding: 80px 0 40px; min-height: auto; } [data-theme="premium"] .hero-core-stage { display: none; } [data-theme="premium"] .hero-visual { display: block; } [data-theme="premium"] #apex-core-canvas { display: none !important; } } /* ── Hero ── */ [data-theme="premium"] .hero { background: #050606; } [data-theme="premium"] .hero-grid-bg { background-image: linear-gradient(rgba(212,112,10,.038) 1px, transparent 1px), linear-gradient(90deg, rgba(212,112,10,.038) 1px, transparent 1px); background-size: 56px 56px; opacity: .25; } /* ── Sections ── */ [data-theme="premium"] .section-dark { background: #080909; } [data-theme="premium"] .section-darker { background: #050606; } [data-theme="premium"] .section-card { background: #080909; } [data-theme="premium"] .section-light { background: #0d0c0a; color: #F3F1EA; --light-text: #F3F1EA; --light-text2: rgba(243,241,234,.74); } [data-theme="premium"] .section-light h1, [data-theme="premium"] .section-light h2, [data-theme="premium"] .section-light h3, [data-theme="premium"] .section-light h4, [data-theme="premium"] .section-light h5, [data-theme="premium"] .section-light h6 { color: #F3F1EA; } [data-theme="premium"] .section-light p { color: rgba(243,241,234,.74); } [data-theme="premium"] .section-light li { color: rgba(243,241,234,.74); } [data-theme="premium"] .section-light strong { color: #F3F1EA; } [data-theme="premium"] .section-light label { color: rgba(243,241,234,.68); } /* ── Context tokens for all dark/warm sections ── */ [data-theme="premium"] .section-dark, [data-theme="premium"] .section-darker, [data-theme="premium"] .section-card, [data-theme="premium"] .hero, [data-theme="premium"] .page-hero, [data-theme="premium"] .cta-banner, [data-theme="premium"] footer, [data-theme="premium"] .cs-header { --ctx-h: #F3F1EA; --ctx-body: rgba(243,241,234,.76); --ctx-muted: rgba(200,195,185,.48); --ctx-border: rgba(212,112,10,.12); --ctx-faq-bg: rgba(212,112,10,.06); } /* ── Eyebrows ── */ [data-theme="premium"] .section-eyebrow { color: #D4700A; } [data-theme="premium"] .section-eyebrow::before { background: #D4700A; } /* ── Buttons ── */ [data-theme="premium"] .btn-primary, [data-theme="premium"] .btn-emerald { background: linear-gradient(135deg, #F5A850, #D4700A); color: #160d03; border-color: transparent; font-weight: 700; box-shadow: 0 8px 28px rgba(212,112,10,.26); } [data-theme="premium"] .btn-primary:hover, [data-theme="premium"] .btn-emerald:hover { background: linear-gradient(135deg, #FFD090, #E8841A); box-shadow: 0 12px 36px rgba(212,112,10,.40); } [data-theme="premium"] .btn-outline { color: rgba(243,241,234,.82); border-color: rgba(243,241,234,.22); } [data-theme="premium"] .btn-outline:hover { border-color: #D4700A; color: #D4700A; } [data-theme="premium"] .btn-outline-blue { color: #D4700A; border-color: rgba(212,112,10,.35); } [data-theme="premium"] .btn-outline-blue:hover { background: rgba(212,112,10,.08); color: #E8841A; border-color: #D4700A; } [data-theme="premium"] .btn-ghost { background: rgba(212,112,10,.06); border-color: rgba(212,112,10,.18); color: #F3F1EA; } [data-theme="premium"] .btn-ghost:hover { background: rgba(212,112,10,.12); } /* ── Cards ── */ [data-theme="premium"] .card, [data-theme="premium"] .card-light { background: linear-gradient(180deg, rgba(255,255,255,.022), rgba(255,255,255,.004)), rgba(13,12,10,.82); border-color: rgba(212,112,10,.14); box-shadow: 0 4px 20px rgba(0,0,0,.45); } [data-theme="premium"] .card:hover, [data-theme="premium"] .card-light:hover { border-color: rgba(212,112,10,.30); box-shadow: 0 16px 48px rgba(0,0,0,.62), 0 0 24px rgba(212,112,10,.08); } [data-theme="premium"] .card-glass { background: rgba(212,112,10,.04); border-color: rgba(212,112,10,.14); } [data-theme="premium"] .card-glass:hover { background: rgba(212,112,10,.08); border-color: rgba(212,112,10,.28); } /* ── Context token reset — all cards also dark in premium ── */ [data-theme="premium"] .card, [data-theme="premium"] .card-light, [data-theme="premium"] .arch-card, [data-theme="premium"] .service-card, [data-theme="premium"] .industry-card, [data-theme="premium"] .cs-body, [data-theme="premium"] .cs-big-metric, [data-theme="premium"] .cs-card, [data-theme="premium"] .bcc-card, [data-theme="premium"] .feature-panel, [data-theme="premium"] .testimonial-card, [data-theme="premium"] .blog-card, [data-theme="premium"] .region-card, [data-theme="premium"] .process-step, [data-theme="premium"] .award-card, [data-theme="premium"] .resource-card, [data-theme="premium"] .contact-info-item, [data-theme="premium"] .tool-chip, [data-theme="premium"] .comparison-table-wrap { --ctx-h: #F3F1EA; --ctx-body: rgba(243,241,234,.72); --ctx-muted: rgba(200,195,185,.44); --ctx-border: rgba(212,112,10,.12); --ctx-faq-bg: rgba(212,112,10,.06); } /* ── Service / Industry / Arch / other white-card components → dark amber ── */ [data-theme="premium"] .service-card, [data-theme="premium"] .industry-card, [data-theme="premium"] .arch-card, [data-theme="premium"] .feature-panel, [data-theme="premium"] .award-card, [data-theme="premium"] .resource-card, [data-theme="premium"] .testimonial-card, [data-theme="premium"] .blog-card, [data-theme="premium"] .region-card, [data-theme="premium"] .process-step, [data-theme="premium"] .contact-info-item { background: linear-gradient(180deg, rgba(255,255,255,.018), rgba(255,255,255,.003)), rgba(13,12,10,.82); border: 1px solid rgba(212,112,10,.12); } [data-theme="premium"] .service-card:hover, [data-theme="premium"] .industry-card:hover, [data-theme="premium"] .arch-card:hover, [data-theme="premium"] .blog-card:hover, [data-theme="premium"] .region-card:hover { border-color: rgba(212,112,10,.28); box-shadow: 0 0 24px rgba(212,112,10,.08); } [data-theme="premium"] .service-icon, [data-theme="premium"] .arch-icon, [data-theme="premium"] .contact-icon, [data-theme="premium"] .industry-icon { background: rgba(212,112,10,.09); color: #D4700A; } /* ── Process step numbers ── */ [data-theme="premium"] .process-step-num { background: rgba(212,112,10,.10); color: #D4700A; } /* ── Tool chips ── */ [data-theme="premium"] .tool-chip { background: rgba(212,112,10,.06); border: 1px solid rgba(212,112,10,.16); color: rgba(243,241,234,.82); } [data-theme="premium"] .tool-chip:hover { background: rgba(212,112,10,.12); border-color: rgba(212,112,10,.32); color: #E8841A; } /* ── Trust bar ── */ [data-theme="premium"] .trust-bar { background: #080909; border-top: 1px solid rgba(212,112,10,.08); border-bottom: 1px solid rgba(212,112,10,.08); } [data-theme="premium"] .trust-logo { color: rgba(243,241,234,.28); } [data-theme="premium"] .trust-logo:hover { color: rgba(243,241,234,.65); } /* ── Hero stat numbers ── */ [data-theme="premium"] .hero-stat-num, [data-theme="premium"] .metric-num { color: #D4700A; } /* ── Text utilities ── */ [data-theme="premium"] .text-gradient { background: linear-gradient(135deg, #F5A850 0%, #D4700A 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; } [data-theme="premium"] .text-gradient-gold { background: linear-gradient(135deg, #FFD090 0%, #D4700A 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; } [data-theme="premium"] .text-emerald { color: #D4700A; } [data-theme="premium"] .text-blue { color: #E8841A; } [data-theme="premium"] .text-accent { color: #D4700A; } /* ── FAQ ── */ [data-theme="premium"] .faq-item { border-color: rgba(212,112,10,.10); } [data-theme="premium"] .faq-question { color: rgba(243,241,234,.82); } [data-theme="premium"] .faq-question:hover { color: #D4700A; } [data-theme="premium"] .faq-item.open .faq-question { color: #D4700A; } [data-theme="premium"] .faq-icon { background: rgba(212,112,10,.08); color: #D4700A; } [data-theme="premium"] .faq-answer { color: rgba(243,241,234,.62); } /* ── CTA Banner ── */ [data-theme="premium"] .cta-banner { background: linear-gradient(135deg, #080909 0%, #0d0c0a 100%); border-top: 1px solid rgba(212,112,10,.12); border-bottom: 1px solid rgba(212,112,10,.12); } /* ── Case studies ── */ [data-theme="premium"] .cs-body, [data-theme="premium"] .cs-big-metric { background: linear-gradient(180deg, rgba(255,255,255,.018), rgba(255,255,255,.003)), rgba(13,12,10,.82); border-color: rgba(212,112,10,.10); } [data-theme="premium"] .cs-big-metric-num { color: #D4700A; } [data-theme="premium"] .cs-header { background: linear-gradient(135deg, #080909 0%, #0d0c0a 100%); border-color: rgba(212,112,10,.12); } [data-theme="premium"] .cs-card, [data-theme="premium"] .bcc-card { background: linear-gradient(180deg, rgba(255,255,255,.018), rgba(255,255,255,.003)), rgba(13,12,10,.82); border-color: rgba(212,112,10,.10); } [data-theme="premium"] .cs-card:hover, [data-theme="premium"] .bcc-card:hover { border-color: rgba(212,112,10,.24); } /* ── Forms ── */ [data-theme="premium"] input, [data-theme="premium"] textarea, [data-theme="premium"] select { background: #0d0c0a; border-color: rgba(212,112,10,.18); color: #F3F1EA; } [data-theme="premium"] input::placeholder, [data-theme="premium"] textarea::placeholder { color: rgba(200,195,185,.35); } [data-theme="premium"] input:focus, [data-theme="premium"] textarea:focus, [data-theme="premium"] select:focus { border-color: #D4700A; box-shadow: 0 0 0 3px rgba(212,112,10,.12); } [data-theme="premium"] label { color: rgba(243,241,234,.68); } /* ── Footer ── */ [data-theme="premium"] footer { background: #030404; border-top: 1px solid rgba(212,112,10,.10); } [data-theme="premium"] .footer-social { background: rgba(212,112,10,.06); border-color: rgba(212,112,10,.18); color: rgba(243,241,234,.60); } [data-theme="premium"] .footer-social:hover { background: rgba(212,112,10,.12); color: #E8841A; border-color: #D4700A; } [data-theme="premium"] .footer-bottom { border-top-color: rgba(212,112,10,.08); } /* ── Scroll-top btn ── */ [data-theme="premium"] .scroll-top-btn { background: rgba(212,112,10,.10); color: #D4700A; border: 1px solid rgba(212,112,10,.25); } [data-theme="premium"] .scroll-top-btn:hover { background: rgba(212,112,10,.20); } /* ── Divider ── */ [data-theme="premium"] .divider { background: rgba(212,112,10,.12); } /* ── Page hero ── */ [data-theme="premium"] .page-hero { background: linear-gradient(160deg, #050606 0%, #080909 100%); border-bottom: 1px solid rgba(212,112,10,.10); } /* ── Scrollbar ── */ [data-theme="premium"] ::-webkit-scrollbar { width: 8px; } [data-theme="premium"] ::-webkit-scrollbar-track { background: #050606; } [data-theme="premium"] ::-webkit-scrollbar-thumb { background: rgba(212,112,10,.25); border-radius: 4px; } [data-theme="premium"] ::-webkit-scrollbar-thumb:hover { background: rgba(212,112,10,.45); } /* ── Blog date ── */ [data-theme="premium"] .blog-date { color: rgba(200,195,185,.50); } /* ── Tables in prose ── */ [data-theme="premium"] .blog-generic-prose th, [data-theme="premium"] .prose th { background: rgba(212,112,10,.07); border-bottom-color: rgba(212,112,10,.22); } [data-theme="premium"] .blog-generic-prose td, [data-theme="premium"] .prose td { border-bottom-color: rgba(212,112,10,.09); } [data-theme="premium"] .blog-generic-prose tbody tr:hover, [data-theme="premium"] .prose tbody tr:hover { background: rgba(212,112,10,.03); } /* ── Callout box ── */ [data-theme="premium"] .callout { background: rgba(212,112,10,.05); border-left-color: #D4700A; } [data-theme="premium"] .callout p, [data-theme="premium"] .callout li { color: rgba(243,241,234,.78); } /* ── HR ── */ [data-theme="premium"] .hr { background: rgba(212,112,10,.14); } /* ── Breadcrumb ── */ [data-theme="premium"] .page-hero-breadcrumb span { color: rgba(200,195,185,.44); } [data-theme="premium"] .page-hero-breadcrumb a { color: rgba(243,241,234,.62); } [data-theme="premium"] .page-hero-breadcrumb a:hover { color: #D4700A; } /* ── Badges ── */ [data-theme="premium"] .badge-green { background: rgba(212,112,10,.12); color: #E8841A; border: 1px solid rgba(212,112,10,.28); } [data-theme="premium"] .badge-blue { background: rgba(212,112,10,.08); color: #F5A850; border: 1px solid rgba(212,112,10,.22); } [data-theme="premium"] .badge-gold { background: rgba(212,112,10,.10); color: #F5A850; border: 1px solid rgba(212,112,10,.25); } [data-theme="premium"] .badge-purple { background: rgba(212,112,10,.08); color: #F5A850; border: 1px solid rgba(212,112,10,.22); } /* ── Note / caption ── */ [data-theme="premium"] .note { color: rgba(200,195,185,.48); } /* ── Blockquote ── */ [data-theme="premium"] blockquote { border-left-color: rgba(212,112,10,.40); background: rgba(212,112,10,.04); color: rgba(243,241,234,.74); } /* ── Tags ── */ [data-theme="premium"] .tag { color: rgba(243,241,234,.68); border-color: rgba(212,112,10,.20); } /* ── Timeline ── */ [data-theme="premium"] .timeline-item h4 { color: #F3F1EA; } [data-theme="premium"] .timeline-item p { color: rgba(243,241,234,.68); } /* ── Nav utility group ── */ [data-theme="premium"] .nav-links > li.nav-util > a { color: rgba(243,241,234,.44); } [data-theme="premium"] .nav-links > li.nav-util > a:hover, [data-theme="premium"] .nav-links > li.nav-util > a.active { color: #D4700A; } [data-theme="premium"] .nav-links > li.nav-hire > a, [data-theme="premium"] .nav-links > li.nav-hire > a:hover, [data-theme="premium"] .nav-links > li.nav-hire > a.active { color: #D4700A; } [data-theme="premium"] .nav-hire-cta, [data-theme="premium"] .nav-hire-cta:hover { color: #D4700A; } [data-theme="premium"] li.nav-divider::after { background: rgba(212,112,10,.18); } /* ── Comparison table ── */ [data-theme="premium"] .comparison-table-wrap { background: linear-gradient(180deg, rgba(255,255,255,.018), rgba(255,255,255,.003)), rgba(13,12,10,.82); border-color: rgba(212,112,10,.10); } [data-theme="premium"] .comparison-table th { color: #F3F1EA; background: rgba(212,112,10,.05); border-bottom-color: rgba(212,112,10,.14); } [data-theme="premium"] .comparison-table td { color: rgba(243,241,234,.72); border-bottom-color: rgba(212,112,10,.07); }