/* ============================================================ MCEMA v2 — shared Civic Operations Bulletin design system Applied to pages with Loaded via ============================================================ */ /* ============================================================ SHARED HEADER STRIPS — overrides theme.css styling for #ema-banner (dynamic threat marquee) and #ema-nav (top nav) on any v2-classed body. Specificity wins via body-class prefix. ============================================================ */ .mcema-v2 #ema-banner, .home-v2 #ema-banner, .staff-v2 #ema-banner, .about-v2 #ema-banner, .res-v2 #ema-banner, .gi-v2 #ema-banner, .contacts-v2 #ema-banner, .eop-v2 #ema-banner { background: #11161b; border-bottom: 1px solid #2a313a; font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: 11.5px; letter-spacing: 0.08em; color: #b5bec9; height: 32px; } .mcema-v2 #ema-banner .label, .home-v2 #ema-banner .label, .staff-v2 #ema-banner .label, .about-v2 #ema-banner .label, .res-v2 #ema-banner .label, .gi-v2 #ema-banner .label, .contacts-v2 #ema-banner .label, .eop-v2 #ema-banner .label { background: #161c23; border-right: 1px solid #2a313a; font-weight: 700; letter-spacing: 0.2em; font-size: 10.5px; padding: 0 16px; text-transform: uppercase; } .mcema-v2 #ema-banner.threat-normal .label, .home-v2 #ema-banner.threat-normal .label, .staff-v2 #ema-banner.threat-normal .label, .about-v2 #ema-banner.threat-normal .label, .res-v2 #ema-banner.threat-normal .label, .gi-v2 #ema-banner.threat-normal .label, .contacts-v2 #ema-banner.threat-normal .label, .eop-v2 #ema-banner.threat-normal .label { color: #6cd28a; background: rgba(108,210,138,0.10); } .mcema-v2 #ema-banner.threat-advisory .label, .home-v2 #ema-banner.threat-advisory .label, .staff-v2 #ema-banner.threat-advisory .label, .about-v2 #ema-banner.threat-advisory .label, .res-v2 #ema-banner.threat-advisory .label, .gi-v2 #ema-banner.threat-advisory .label, .contacts-v2 #ema-banner.threat-advisory .label, .eop-v2 #ema-banner.threat-advisory .label { color: #f6c560; background: rgba(246,168,0,0.12); } .mcema-v2 #ema-banner.threat-watch .label, .home-v2 #ema-banner.threat-watch .label, .staff-v2 #ema-banner.threat-watch .label, .about-v2 #ema-banner.threat-watch .label, .res-v2 #ema-banner.threat-watch .label, .gi-v2 #ema-banner.threat-watch .label, .contacts-v2 #ema-banner.threat-watch .label, .eop-v2 #ema-banner.threat-watch .label { color: #f6a800; background: rgba(246,168,0,0.14); } .mcema-v2 #ema-banner.threat-elevated .label, .home-v2 #ema-banner.threat-elevated .label, .staff-v2 #ema-banner.threat-elevated .label, .about-v2 #ema-banner.threat-elevated .label, .res-v2 #ema-banner.threat-elevated .label, .gi-v2 #ema-banner.threat-elevated .label, .contacts-v2 #ema-banner.threat-elevated .label, .eop-v2 #ema-banner.threat-elevated .label { color: #b73a32; background: rgba(183,58,50,0.14); } /* Unified top nav — refined v2 treatment */ .mcema-v2 #ema-nav, .home-v2 #ema-nav, .staff-v2 #ema-nav, .about-v2 #ema-nav, .res-v2 #ema-nav, .gi-v2 #ema-nav, .contacts-v2 #ema-nav, .eop-v2 #ema-nav { background: #11161b; border-bottom: 1px solid #2a313a; box-shadow: none; padding: 10px 22px; min-height: 60px; } .mcema-v2 #ema-nav::after, .home-v2 #ema-nav::after, .staff-v2 #ema-nav::after, .about-v2 #ema-nav::after, .res-v2 #ema-nav::after, .gi-v2 #ema-nav::after, .contacts-v2 #ema-nav::after, .eop-v2 #ema-nav::after { background: linear-gradient(90deg, transparent, #d4a64a 30%, #f6c560 50%, #d4a64a 70%, transparent); opacity: 0.45; } .mcema-v2 #ema-nav .brand .seal, .home-v2 #ema-nav .brand .seal, .staff-v2 #ema-nav .brand .seal, .about-v2 #ema-nav .brand .seal, .res-v2 #ema-nav .brand .seal, .gi-v2 #ema-nav .brand .seal, .contacts-v2 #ema-nav .brand .seal, .eop-v2 #ema-nav .brand .seal { box-shadow: 0 0 0 1px #d4a64a, 0 0 14px rgba(212,166,74,0.18); } .mcema-v2 #ema-nav .brand .title, .home-v2 #ema-nav .brand .title, .staff-v2 #ema-nav .brand .title, .about-v2 #ema-nav .brand .title, .res-v2 #ema-nav .brand .title, .gi-v2 #ema-nav .brand .title, .contacts-v2 #ema-nav .brand .title, .eop-v2 #ema-nav .brand .title { font-family: 'Fraunces', Georgia, serif; font-weight: 700; font-size: 16px; color: #f1eae0; letter-spacing: -0.005em; line-height: 1.2; } .mcema-v2 #ema-nav .brand .sub, .home-v2 #ema-nav .brand .sub, .staff-v2 #ema-nav .brand .sub, .about-v2 #ema-nav .brand .sub, .res-v2 #ema-nav .brand .sub, .gi-v2 #ema-nav .brand .sub, .contacts-v2 #ema-nav .brand .sub, .eop-v2 #ema-nav .brand .sub { font-family: 'JetBrains Mono', monospace; font-size: 9.5px; letter-spacing: 0.24em; color: #d4a64a; text-transform: uppercase; margin-top: 4px; } .mcema-v2 #ema-nav .links a, .home-v2 #ema-nav .links a, .staff-v2 #ema-nav .links a, .about-v2 #ema-nav .links a, .res-v2 #ema-nav .links a, .gi-v2 #ema-nav .links a, .contacts-v2 #ema-nav .links a, .eop-v2 #ema-nav .links a { font-family: 'JetBrains Mono', monospace; font-size: 10.5px; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; color: #b5bec9; background: transparent; border: 1px solid #2a313a; border-radius: 0; padding: 6px 11px; } .mcema-v2 #ema-nav .links a:hover, .home-v2 #ema-nav .links a:hover, .staff-v2 #ema-nav .links a:hover, .about-v2 #ema-nav .links a:hover, .res-v2 #ema-nav .links a:hover, .gi-v2 #ema-nav .links a:hover, .contacts-v2 #ema-nav .links a:hover, .eop-v2 #ema-nav .links a:hover { color: #f1eae0; border-color: #d4a64a; background: rgba(212,166,74,0.06); } .mcema-v2 #ema-nav .links a.active, .home-v2 #ema-nav .links a.active, .staff-v2 #ema-nav .links a.active, .about-v2 #ema-nav .links a.active, .res-v2 #ema-nav .links a.active, .gi-v2 #ema-nav .links a.active, .contacts-v2 #ema-nav .links a.active, .eop-v2 #ema-nav .links a.active { color: #d4a64a; border-color: #d4a64a; background: rgba(212,166,74,0.08); } .mcema-v2 #ema-theme-toggle, .home-v2 #ema-theme-toggle, .staff-v2 #ema-theme-toggle, .about-v2 #ema-theme-toggle, .res-v2 #ema-theme-toggle, .gi-v2 #ema-theme-toggle, .contacts-v2 #ema-theme-toggle, .eop-v2 #ema-theme-toggle { background: transparent; border: 1px solid #2a313a; color: #b5bec9; font-family: 'JetBrains Mono', monospace; font-size: 10.5px; letter-spacing: 0.16em; text-transform: uppercase; padding: 6px 11px; border-radius: 0; } .mcema-v2 #ema-theme-toggle:hover, .home-v2 #ema-theme-toggle:hover, .staff-v2 #ema-theme-toggle:hover, .about-v2 #ema-theme-toggle:hover, .res-v2 #ema-theme-toggle:hover, .gi-v2 #ema-theme-toggle:hover, .contacts-v2 #ema-theme-toggle:hover, .eop-v2 #ema-theme-toggle:hover { color: #d4a64a; border-color: #d4a64a; background: rgba(212,166,74,0.06); } /* Tighten the static classif strip so it reads as the seam below the nav rather than a third independent header. */ .mcema-v2 .classif, .home-v2 .classif, .staff-v2 .classif, .about-v2 .classif, .res-v2 .classif, .gi-v2 .classif, .contacts-v2 .classif, .eop-v2 .classif { padding-top: 8px; padding-bottom: 8px; } .mcema-v2 { --hv-ink: #0b0d10; --hv-ink-1: #11161b; --hv-ink-2: #161c23; --hv-ink-3: #1f262e; --hv-rule: #2a313a; --hv-cream: #f1eae0; --hv-cream-2: #e7ddc8; --hv-seal-gold: #d4a64a; --hv-seal-bright:#f6c560; --hv-olive: #6f8244; --hv-olive-deep: #4a5a2b; --hv-amber: #f6a800; --hv-hit: #b73a32; --hv-hit-deep: #7a1f1a; --hv-info: #6ba9d6; --hv-info-deep: #2a4a66; --hv-purple: #b388e8; --hv-ok: #6cd28a; --hv-steel: #8a96a4; --hv-steel-1: #b5bec9; --hv-font-display: 'Fraunces', 'Source Serif Pro', Georgia, serif; --hv-font-stamp: 'Special Elite', 'Courier New', monospace; --hv-font-mono: 'JetBrains Mono', ui-monospace, monospace; --hv-font-sans: 'IBM Plex Sans', -apple-system, system-ui, sans-serif; --hv-pad: clamp(20px, 4vw, 56px); font-family: var(--hv-font-sans); background: var(--hv-ink); color: var(--hv-cream); line-height: 1.6; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; background-image: radial-gradient(ellipse at top, rgba(212,166,74,0.04), transparent 55%), url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 220 220' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .92 0 0 0 0 .85 0 0 0 0 .73 0 0 0 .04 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); background-size: 100% 100%, 220px 220px; background-attachment: fixed, fixed; } .mcema-v2 ::selection { background: var(--hv-seal-gold); color: var(--hv-ink); } .mcema-v2 a { color: inherit; text-decoration: none; } /* CLASSIFICATION BANNER */ .mcema-v2 .classif { background: var(--hv-ink-1); border-bottom: 1px solid var(--hv-seal-gold); font-family: var(--hv-font-mono); font-size: 10.5px; font-weight: 600; letter-spacing: 0.3em; color: var(--hv-seal-gold); text-align: center; padding: 7px 12px 6px; text-transform: uppercase; } .mcema-v2 .classif::before, .mcema-v2 .classif::after { content: "▮ ▮ ▮"; padding: 0 14px; opacity: .55; } .mcema-v2 .classif b { color: var(--hv-cream); padding: 0 10px; letter-spacing: 0.35em; } /* MAIN */ .mcema-v2 main { max-width: 1200px; margin: 0 auto; padding: 0 var(--hv-pad) 80px; } /* HERO */ .mcema-v2 .hero-block { position: relative; padding: clamp(48px, 6vw, 90px) 0 24px; overflow: hidden; } .mcema-v2 .hero-watermark { position: absolute; right: clamp(-80px,-6vw,-40px); top: 50%; transform: translateY(-50%); width: clamp(320px,44vw,520px); height: clamp(320px,44vw,520px); background: url("/assets/seal-512.png") center/contain no-repeat; opacity: 0.07; pointer-events: none; z-index: 0; } .mcema-v2 .hero-inner { position: relative; z-index: 1; max-width: 880px; } .mcema-v2 .doc-num { font-family: var(--hv-font-mono); font-size: 10.5px; font-weight: 600; letter-spacing: 0.36em; text-transform: uppercase; color: var(--hv-seal-gold); margin-bottom: 14px; display: inline-flex; align-items: center; gap: 14px; } .mcema-v2 .doc-num::before { content: ""; display: inline-block; width: 32px; height: 1px; background: var(--hv-seal-gold); } /* H1 */ .mcema-v2 h1 { font-family: var(--hv-font-display); font-weight: 800; font-size: clamp(40px, 6.5vw, 84px); line-height: 0.96; letter-spacing: -0.025em; color: var(--hv-cream); margin: 0 0 18px; } .mcema-v2 h1 .accent { font-family: var(--hv-font-display); font-style: italic; font-weight: 500; color: var(--hv-seal-gold); } /* LEDE */ .mcema-v2 .lede { font-size: clamp(15px, 1.4vw, 17px); line-height: 1.6; color: var(--hv-steel-1); max-width: 72ch; margin: 0 0 22px; } .mcema-v2 .lede strong { color: var(--hv-cream); } .mcema-v2 .lede a { color: var(--hv-seal-gold); border-bottom: 1px dotted; } .mcema-v2 .lede em { color: var(--hv-cream-2); } /* META STRIP */ .mcema-v2 .meta-strip { background: transparent; border: 0; border-top: 1px solid var(--hv-rule); border-bottom: 1px solid var(--hv-rule); border-radius: 0; padding: 14px 0; font-family: var(--hv-font-mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.18em; color: var(--hv-steel-1); display: flex; flex-wrap: wrap; gap: 14px 32px; } .mcema-v2 .meta-strip strong { color: var(--hv-seal-gold); padding-right: 6px; } /* SECTION NAV (sticky) */ .mcema-v2 .section-nav { position: sticky; top: 0; z-index: 500; background: var(--hv-ink-1); border: 1px solid var(--hv-rule); border-radius: 0; padding: 10px 14px; margin: 24px 0 32px; font-family: var(--hv-font-mono); font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; display: flex; flex-wrap: wrap; gap: 6px; } .mcema-v2 .section-nav a { color: var(--hv-steel-1); background: var(--hv-ink-2); border: 1px solid var(--hv-rule); border-radius: 0; padding: 5px 10px; text-decoration: none; } .mcema-v2 .section-nav a:hover { color: var(--hv-seal-bright); border-color: var(--hv-seal-gold); } /* H2 / H3 */ .mcema-v2 h2 { font-family: var(--hv-font-mono); font-size: 10.5px; font-weight: 700; color: var(--hv-seal-gold); text-transform: uppercase; letter-spacing: 0.32em; margin: clamp(40px,5vw,64px) 0 14px; padding: 0 0 10px; border: 0; border-bottom: 1px dashed var(--hv-rule); display: flex; align-items: baseline; gap: 14px; scroll-margin-top: 80px; } .mcema-v2 h2::before { content: "▮"; color: var(--hv-seal-gold); font-size: 12px; } .mcema-v2 h2 .label { font-family: var(--hv-font-display); font-size: clamp(22px,3vw,30px); font-weight: 700; color: var(--hv-cream); text-transform: none; letter-spacing: -0.005em; line-height: 1.15; } .mcema-v2 h3 { font-family: var(--hv-font-mono); font-size: 11px; font-weight: 700; color: var(--hv-seal-gold); text-transform: uppercase; letter-spacing: 0.24em; margin: 28px 0 10px; } /* PROSE */ .mcema-v2 p, .mcema-v2 li { color: var(--hv-steel-1); font-size: 14.5px; line-height: 1.65; } .mcema-v2 p strong, .mcema-v2 li strong { color: var(--hv-cream); } .mcema-v2 p a, .mcema-v2 li a { color: var(--hv-seal-gold); border-bottom: 1px dotted; } .mcema-v2 p a:hover, .mcema-v2 li a:hover { color: var(--hv-seal-bright); } .mcema-v2 ul, .mcema-v2 ol { margin: 0 0 14px 22px; } .mcema-v2 code { background: var(--hv-ink-2); padding: 1px 5px; border-radius: 2px; font-family: var(--hv-font-mono); font-size: 11.5px; color: var(--hv-seal-gold); } /* CALLOUT NOTES (placeholder / info / gated / banner / startup / gaps) */ .mcema-v2 .placeholder-note, .mcema-v2 .info-note, .mcema-v2 .gated-note, .mcema-v2 .gated-banner, .mcema-v2 .startup-note, .mcema-v2 .gaps-note, .mcema-v2 .callout { background: linear-gradient(90deg, rgba(246,168,0,0.08), rgba(11,13,16,0.4) 70%); border: 1px solid var(--hv-rule); border-left: 4px solid var(--hv-amber); padding: 14px 18px; margin: 16px 0; font-size: 13px; color: var(--hv-steel-1); line-height: 1.6; border-radius: 0; } .mcema-v2 .placeholder-note strong, .mcema-v2 .gaps-note strong { color: var(--hv-cream); } .mcema-v2 .info-note { background: linear-gradient(90deg, rgba(107,169,214,0.10), rgba(11,13,16,0.4) 70%); border-left-color: var(--hv-info); } .mcema-v2 .info-note strong { color: var(--hv-info); } .mcema-v2 .gated-note, .mcema-v2 .gated-banner { background: linear-gradient(90deg, rgba(179,136,232,0.10), rgba(11,13,16,0.4) 70%); border-left-color: var(--hv-purple); } .mcema-v2 .gated-note strong, .mcema-v2 .gated-banner strong { color: var(--hv-purple); } .mcema-v2 .startup-note { background: linear-gradient(90deg, rgba(107,169,214,0.10), rgba(11,13,16,0.4) 70%); border-left-color: var(--hv-info); } .mcema-v2 .startup-note strong { color: var(--hv-info); } .mcema-v2 .gated-banner code, .mcema-v2 .gated-note code, .mcema-v2 .gaps-note code { background: var(--hv-ink-2); color: var(--hv-seal-gold); } /* COLOR CALLOUT VARIANTS (used on capabilities page) */ .mcema-v2 .callout.gold { border-left-color: var(--hv-seal-gold); background: linear-gradient(90deg, rgba(212,166,74,0.10), rgba(11,13,16,0.4) 70%); } .mcema-v2 .callout.green { border-left-color: var(--hv-ok); background: linear-gradient(90deg, rgba(108,210,138,0.08), rgba(11,13,16,0.4) 70%); } .mcema-v2 .callout.blue { border-left-color: var(--hv-info); background: linear-gradient(90deg, rgba(107,169,214,0.10), rgba(11,13,16,0.4) 70%); } .mcema-v2 .callout.red { border-left-color: var(--hv-hit); background: linear-gradient(90deg, rgba(183,58,50,0.12), rgba(11,13,16,0.4) 70%); } .mcema-v2 .callout.purple { border-left-color: var(--hv-purple); background: linear-gradient(90deg, rgba(179,136,232,0.10), rgba(11,13,16,0.4) 70%); } .mcema-v2 .callout.orange { border-left-color: var(--hv-amber); background: linear-gradient(90deg, rgba(246,168,0,0.10), rgba(11,13,16,0.4) 70%); } .mcema-v2 .callout strong.tag { font-family: var(--hv-font-mono); font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.24em; display: block; margin-bottom: 8px; } .mcema-v2 .callout.gold strong.tag { color: var(--hv-seal-gold); } .mcema-v2 .callout.green strong.tag { color: var(--hv-ok); } .mcema-v2 .callout.blue strong.tag { color: var(--hv-info); } .mcema-v2 .callout.red strong.tag { color: var(--hv-hit); } .mcema-v2 .callout.purple strong.tag { color: var(--hv-purple); } .mcema-v2 .callout.orange strong.tag { color: var(--hv-amber); } .mcema-v2 .callout ul { margin: 8px 0 0 18px; } .mcema-v2 .callout li { margin-bottom: 4px; } /* BADGES (unified retrofit) */ .mcema-v2 .badge { display: inline-block; font-family: var(--hv-font-mono); font-size: 9px; font-weight: 700; padding: 2px 7px; text-transform: uppercase; letter-spacing: 0.16em; margin-right: 5px; border: 1px solid var(--hv-rule); background: var(--hv-ink-2); color: var(--hv-steel-1); border-radius: 0; } .mcema-v2 .badge.tf, .mcema-v2 .badge-status.st-open { background: rgba(183,58,50,0.18); color: var(--hv-hit); border-color: var(--hv-hit); } .mcema-v2 .badge.s24, .mcema-v2 .badge.fed { background: rgba(107,169,214,0.15); color: var(--hv-info); border-color: var(--hv-info); } .mcema-v2 .badge.gated { background: rgba(179,136,232,0.15); color: var(--hv-purple); border-color: var(--hv-purple); } .mcema-v2 .badge.placeholder { background: rgba(246,168,0,0.15); color: var(--hv-amber); border-color: var(--hv-amber); } /* Status badges (action tracker) */ .mcema-v2 .badge-status { display: inline-block; font-family: var(--hv-font-mono); font-size: 9.5px; font-weight: 700; padding: 2px 7px; text-transform: uppercase; letter-spacing: 0.16em; border: 1px solid var(--hv-rule); background: var(--hv-ink-2); color: var(--hv-steel-1); border-radius: 0; } .mcema-v2 .st-progress { background: rgba(246,168,0,0.16); color: var(--hv-amber); border-color: var(--hv-amber); } .mcema-v2 .st-pending { background: rgba(212,166,74,0.16); color: var(--hv-seal-gold); border-color: var(--hv-seal-gold); } .mcema-v2 .st-blocked { background: rgba(179,136,232,0.16); color: var(--hv-purple); border-color: var(--hv-purple); } .mcema-v2 .st-done { background: rgba(108,210,138,0.16); color: var(--hv-ok); border-color: var(--hv-ok); } /* TABLES (matrix / tracker) */ .mcema-v2 .matrix-table-wrap { overflow-x: auto; margin: 14px 0; } .mcema-v2 table.matrix, .mcema-v2 table.tracker { width: 100%; border-collapse: collapse; background: var(--hv-ink-1); font-size: 12.5px; color: var(--hv-steel-1); } .mcema-v2 table.matrix thead tr, .mcema-v2 table.tracker thead tr { background: var(--hv-ink-2); } .mcema-v2 table.matrix th, .mcema-v2 table.tracker th { font-family: var(--hv-font-mono); font-size: 10.5px; font-weight: 700; color: var(--hv-seal-gold); text-transform: uppercase; letter-spacing: 0.12em; padding: 8px 10px; border: 1px solid var(--hv-rule); text-align: left; } .mcema-v2 table.matrix td, .mcema-v2 table.tracker td { padding: 8px 10px; border: 1px solid var(--hv-rule); line-height: 1.5; vertical-align: top; } .mcema-v2 table.matrix td strong, .mcema-v2 table.tracker td strong { color: var(--hv-cream); } .mcema-v2 td.priority { font-family: var(--hv-font-mono); font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.12em; text-align: center; } .mcema-v2 .pri-critical { background: rgba(183,58,50,0.12); color: var(--hv-hit); } .mcema-v2 .pri-high { background: rgba(246,168,0,0.12); color: var(--hv-amber); } .mcema-v2 .pri-medium { background: rgba(212,166,74,0.12); color: var(--hv-seal-gold); } .mcema-v2 .pri-low { background: rgba(107,169,214,0.10); color: var(--hv-info); } /* ROSTER (reuse from contacts) */ .mcema-v2 .roster, .mcema-v2 .roster-grid { background: var(--hv-ink-1); border: 1px solid var(--hv-rule); border-radius: 0; margin-bottom: 14px; } .mcema-v2 .roster-row { display: grid; grid-template-columns: 1fr 1fr 280px; gap: 18px; padding: 14px 18px; border-bottom: 1px solid var(--hv-rule); border-left: 3px solid transparent; align-items: center; transition: background .12s, border-left-color .12s; } .mcema-v2 .roster-row:hover { background: rgba(212,166,74,0.03); border-left-color: var(--hv-seal-gold); } .mcema-v2 .roster-row:last-child { border-bottom: none; } .mcema-v2 .roster-row.header { background: var(--hv-ink-2); font-family: var(--hv-font-mono); font-size: 9.5px; color: var(--hv-steel); text-transform: uppercase; letter-spacing: 0.2em; padding: 9px 18px; border-left: 0; } .mcema-v2 .roster-row.urgent { background: linear-gradient(90deg, rgba(183,58,50,0.10), transparent 60%); border-left: 4px solid var(--hv-hit); } .mcema-v2 .roster-row .name { font-family: var(--hv-font-display); font-size: 16px; font-weight: 600; color: var(--hv-cream); line-height: 1.3; } .mcema-v2 .roster-row .name .role { display: block; font-family: var(--hv-font-mono); font-size: 10px; color: var(--hv-steel); text-transform: uppercase; letter-spacing: 0.14em; font-weight: 500; margin-top: 3px; } .mcema-v2 .roster-row .contact { font-family: var(--hv-font-mono); font-size: 13px; color: var(--hv-cream); } .mcema-v2 .roster-row .contact a { color: var(--hv-seal-gold); border-bottom: 1px dotted transparent; } .mcema-v2 .roster-row .contact a:hover { color: var(--hv-seal-bright); border-bottom-color: var(--hv-seal-gold); } .mcema-v2 .roster-row .contact .secondary { display: block; font-size: 11px; color: var(--hv-steel); margin-top: 4px; } .mcema-v2 .roster-row .notes { font-size: 12.5px; color: var(--hv-steel-1); line-height: 1.55; } .mcema-v2 .roster-row .notes strong { color: var(--hv-cream); } .mcema-v2 .roster-row .notes a { color: var(--hv-seal-gold); border-bottom: 1px dotted; } /* ANNEX CARDS */ .mcema-v2 .annex-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); gap: 14px; margin: 14px 0 18px; } .mcema-v2 .annex-card { background: var(--hv-ink-1); border: 1px solid var(--hv-rule); border-left: 4px solid var(--hv-seal-gold); border-radius: 0; padding: 16px 18px; display: flex; flex-direction: column; gap: 8px; transition: transform .12s, box-shadow .15s; } .mcema-v2 .annex-card:hover { transform: translateY(-2px); box-shadow: 0 18px 36px -22px rgba(0,0,0,0.9); } .mcema-v2 .annex-card.combo { border-left-color: var(--hv-info); } .mcema-v2 .annex-num { font-family: var(--hv-font-mono); font-size: 10px; font-weight: 700; color: var(--hv-seal-gold); text-transform: uppercase; letter-spacing: 0.2em; } .mcema-v2 .annex-title { font-family: var(--hv-font-display); font-size: 17px; font-weight: 600; color: var(--hv-cream); line-height: 1.25; letter-spacing: -0.005em; } .mcema-v2 .annex-desc { font-size: 13px; color: var(--hv-steel-1); line-height: 1.55; flex: 1; } .mcema-v2 .annex-meta { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 4px; padding-top: 10px; border-top: 1px dashed var(--hv-rule); } .mcema-v2 .annex-fmt { font-family: var(--hv-font-mono); font-size: 9px; font-weight: 700; padding: 2px 7px; text-transform: uppercase; letter-spacing: 0.16em; border: 1px solid var(--hv-rule); border-radius: 0; } .mcema-v2 .annex-fmt.docx { background: rgba(107,169,214,0.15); color: var(--hv-info); border-color: var(--hv-info); } .mcema-v2 .annex-fmt.xlsx { background: rgba(108,210,138,0.15); color: var(--hv-ok); border-color: var(--hv-ok); } .mcema-v2 .annex-size { font-family: var(--hv-font-mono); font-size: 10px; color: var(--hv-steel); } .mcema-v2 .annex-dl { display: inline-block; font-family: var(--hv-font-mono); font-size: 11px; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: var(--hv-seal-gold); padding: 6px 12px; border: 1px solid var(--hv-seal-gold); border-radius: 0; background: rgba(212,166,74,0.06); } .mcema-v2 .annex-dl:hover { background: var(--hv-seal-gold); color: var(--hv-ink); } .mcema-v2 .master-card { background: linear-gradient(90deg, rgba(212,166,74,0.08), var(--hv-ink-1) 70%); border: 1px solid var(--hv-rule); border-left: 4px solid var(--hv-seal-gold); border-radius: 0; padding: 18px 22px; margin: 14px 0; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; } .mcema-v2 .master-card .master-info { flex: 1; min-width: 280px; } .mcema-v2 .master-card .master-title { font-family: var(--hv-font-display); font-size: 18px; font-weight: 700; color: var(--hv-cream); margin-bottom: 6px; } .mcema-v2 .master-card .master-desc { font-size: 13px; color: var(--hv-steel-1); line-height: 1.55; } /* GRANT CARDS */ .mcema-v2 .grant-grid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); margin: 14px 0; } .mcema-v2 .grant-card { background: var(--hv-ink-1); border: 1px solid var(--hv-rule); border-left: 4px solid var(--hv-seal-gold); border-radius: 0; padding: 16px 18px; display: flex; flex-direction: column; gap: 8px; transition: transform .12s, box-shadow .15s; } .mcema-v2 .grant-card:hover { transform: translateY(-2px); box-shadow: 0 18px 36px -22px rgba(0,0,0,0.9); } .mcema-v2 .grant-card .tags-row { display: flex; gap: 5px; flex-wrap: wrap; } .mcema-v2 .grant-card .grant-tag { font-family: var(--hv-font-mono); font-size: 9px; font-weight: 700; padding: 2px 7px; text-transform: uppercase; letter-spacing: 0.16em; align-self: flex-start; border: 1px solid var(--hv-rule); background: var(--hv-ink-2); color: var(--hv-steel-1); border-radius: 0; } .mcema-v2 .grant-card .grant-tag.fire { color: var(--hv-hit); border-color: var(--hv-hit); } .mcema-v2 .grant-card .grant-tag.ema { color: var(--hv-info); border-color: var(--hv-info); } .mcema-v2 .grant-card .grant-tag.cyber { color: var(--hv-purple); border-color: var(--hv-purple); } .mcema-v2 .grant-card .grant-tag.health { color: var(--hv-ok); border-color: var(--hv-ok); } .mcema-v2 .grant-card .grant-tag.le { color: var(--hv-amber); border-color: var(--hv-amber); } .mcema-v2 .grant-card .grant-tag.gen { color: var(--hv-steel-1); } .mcema-v2 .grant-card .grant-tag.\39 11 { color: var(--hv-seal-gold); border-color: var(--hv-seal-gold); } .mcema-v2 .grant-card .grant-tag.infra { color: var(--hv-info); border-color: var(--hv-info); } .mcema-v2 .grant-card .grant-tag.fed { color: var(--hv-hit); background: rgba(183,58,50,0.08); } .mcema-v2 .grant-card .grant-tag.state { color: var(--hv-info); background: rgba(107,169,214,0.08); } .mcema-v2 .grant-card .grant-tag.private{ color: var(--hv-purple); background: rgba(179,136,232,0.08); } .mcema-v2 .grant-card .grant-name { font-family: var(--hv-font-display); font-size: 16px; font-weight: 600; color: var(--hv-cream); line-height: 1.28; letter-spacing: -0.005em; } .mcema-v2 .grant-card .grant-agency { font-family: var(--hv-font-mono); font-size: 10px; color: var(--hv-steel); text-transform: uppercase; letter-spacing: 0.16em; } .mcema-v2 .grant-card .grant-desc { font-size: 13px; color: var(--hv-steel-1); line-height: 1.55; flex: 1; } .mcema-v2 .grant-card .grant-detail { font-family: var(--hv-font-mono); font-size: 11px; color: var(--hv-steel); margin-top: 4px; } .mcema-v2 .grant-card .grant-detail .lbl { color: var(--hv-seal-gold); font-weight: 700; } .mcema-v2 .grant-card .grant-link { display: inline-block; font-family: var(--hv-font-mono); font-size: 11px; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: var(--hv-seal-gold); padding: 6px 12px; border: 1px solid var(--hv-seal-gold); border-radius: 0; background: rgba(212,166,74,0.06); margin-top: 4px; align-self: flex-start; } .mcema-v2 .grant-card .grant-link:hover { background: var(--hv-seal-gold); color: var(--hv-ink); } /* ORG / COMPANY / LIAISON / RANK / VEH / ESF (eop reuse) */ .mcema-v2 .level-card { background: var(--hv-ink-1); border: 1px solid var(--hv-rule); border-radius: 0; border-left: 4px solid var(--hv-seal-gold); padding: 16px 18px; } .mcema-v2 .level-card .num { font-family: var(--hv-font-mono); font-size: 28px; color: var(--hv-seal-gold); } .mcema-v2 .level-card .lvl-name { font-family: var(--hv-font-mono); color: var(--hv-steel); text-transform: uppercase; letter-spacing: 0.2em; font-size: 10.5px; margin: 6px 0 10px; } .mcema-v2 .level-card .lvl-desc { font-size: 12.5px; color: var(--hv-steel-1); line-height: 1.55; } .mcema-v2 .level-card.lvl-3 { border-left-color: var(--hv-info); } .mcema-v2 .level-card.lvl-2 { border-left-color: var(--hv-amber); } .mcema-v2 .level-card.lvl-1 { border-left-color: var(--hv-hit); } .mcema-v2 .org-card { background: var(--hv-ink-1); border: 1px solid var(--hv-rule); border-radius: 0; padding: 14px 16px; } .mcema-v2 .org-card .role { font-family: var(--hv-font-mono); color: var(--hv-seal-gold); text-transform: uppercase; letter-spacing: 0.18em; font-size: 9.5px; } .mcema-v2 .org-card .name { font-family: var(--hv-font-display); font-weight: 600; color: var(--hv-cream); font-size: 15px; } .mcema-v2 .org-card .name.vacant { color: var(--hv-amber); font-style: italic; font-weight: 500; } .mcema-v2 .ref-list { background: var(--hv-ink-1); border: 1px solid var(--hv-rule); border-left: 4px solid var(--hv-seal-gold); border-radius: 0; padding: 14px 18px; } .mcema-v2 .ref-list a { color: var(--hv-seal-gold); border-bottom: 1px dotted; } /* FOOTER */ .mcema-v2 footer.bulletin { margin-top: clamp(50px, 6vw, 80px); border-top: 4px solid var(--hv-seal-gold); background: var(--hv-ink-1); padding: 36px var(--hv-pad) 28px; } .mcema-v2 .foot-inner { max-width: 1200px; margin: 0 auto; display: grid; gap: 22px; grid-template-columns: 1fr; } @media (min-width: 840px) { .mcema-v2 .foot-inner { grid-template-columns: auto 1fr auto; align-items: start; } } .mcema-v2 .foot-seal { width: 64px; height: 64px; background: url("/assets/seal-192.png") center/contain no-repeat; opacity: .85; } .mcema-v2 .foot-body { font-family: var(--hv-font-mono); font-size: 11px; line-height: 1.7; color: var(--hv-steel-1); letter-spacing: 0.06em; } .mcema-v2 .foot-body .agency { font-family: var(--hv-font-display); font-weight: 700; font-size: 16px; color: var(--hv-cream); letter-spacing: 0; margin-bottom: 6px; display: block; } .mcema-v2 .foot-body a { color: var(--hv-seal-gold); border-bottom: 1px dotted; } .mcema-v2 .foot-links { display: flex; flex-direction: column; gap: 6px; font-family: var(--hv-font-mono); font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase; } .mcema-v2 .foot-links a { color: var(--hv-steel-1); } .mcema-v2 .foot-links a:hover { color: var(--hv-cream); } .mcema-v2 .last-reviewed { font-family: var(--hv-font-mono); font-size: 10.5px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--hv-steel); margin-top: 24px; } .mcema-v2 .print-note { font-family: var(--hv-font-mono); font-size: 10.5px; color: var(--hv-steel); letter-spacing: 0.06em; margin: 18px 0; font-style: normal; } /* MOBILE / PRINT */ @media (max-width: 768px) { .mcema-v2 .roster-row { grid-template-columns: 1fr; gap: 8px; } .mcema-v2 .roster-row.header { display: none; } } @media print { .mcema-v2 .classif, .mcema-v2 footer.bulletin, .mcema-v2 .hero-watermark, .mcema-v2 .section-nav { display: none !important; } .mcema-v2 { background: white; color: black; } .mcema-v2 .annex-card, .mcema-v2 .grant-card, .mcema-v2 table.matrix, .mcema-v2 table.tracker { page-break-inside: avoid; } }