/* RETAINED AS REFERENCE ONLY — not loaded at render time. * The live deck uses Marp `default` theme + an inline `style:` block in * the -marp.md frontmatter. This file is kept for future styling work * reference. Do NOT pass via `--theme`; it is not in the render path. */ /* @theme nova-sp */ /* Nova — S&P Global Energy theme for Marp decks. * * Palette: S&P Red (#D6002A), Black (#1B1B1B), White (#FFFFFF), Grey (#F0F0F0). * Font: Akkurat Pro (fallback Helvetica Neue / Arial). * * This theme is a STANDALONE stylesheet (applied via `marp --theme * nova-sp-theme.css`). It does NOT `@import "default"` because Marp's * default theme applies `padding: 56px 64px` (which does not reserve * header/footer space) and other base styles (font, color, list spacing) * that would conflict with the S&P palette. Instead, this theme sets * the padding explicitly: 48px top (reserves header space), 40px bottom * (reserves footer space), 56px sides. This gives precise control over * the padding budget. (GRILL revision 2 — @import rejection documented.) * * v1.22 (REQ-254,255,256): added section padding + overflow handling, * aspect-ratio-aware image rules, title-slide chrome suppression, * paragraph/list/table spacing tightening. */ :root { --sp-red: #D6002A; --sp-black: #1B1B1B; --sp-white: #FFFFFF; --sp-grey: #F0F0F0; --sp-dark-grey: #2E2E2E; } /* Base section — padding reserves header (top) + footer (bottom) space. * REQ-254: zero padding was the root cause of "out of whack" layout. * 48px top reserves header chrome; 40px bottom reserves footer chrome; * 56px sides give breathing room. */ section { font-family: "Akkurat Pro", "Helvetica Neue", "Arial", sans-serif; font-size: 22px; color: var(--sp-black); background: var(--sp-white); padding: 48px 56px 40px; overflow: auto; } /* Headings — S&P Red */ h1 { color: var(--sp-red); font-size: 34px; margin-bottom: 0.3em; } h2 { color: var(--sp-red); font-size: 26px; margin-bottom: 0.2em; } h3 { color: var(--sp-red); font-size: 22px; margin-bottom: 0.2em; } h4 { color: var(--sp-dark-grey); font-size: 20px; margin-bottom: 0.15em; } /* REQ-256: tighten h2 + lead-paragraph spacing (the deck's recurring * `## Slide N — Title` + `**bold lead**` pattern). Default
margins * waste ~44px per slide; this reclaims ~22px. */ section h2 + p { margin-top: 0.2em; } section p { margin: 0.4em 0; } /* Title slides — black background, red top border */ section.title { background: var(--sp-black); color: var(--sp-white); border-top: 8px solid var(--sp-red); } section.title h1 { color: var(--sp-white); } section.title h2 { color: var(--sp-white); } /* REQ-256: suppress header/footer chrome on title slides. The * `` + `` directives * only suppress the page number, not the chrome. This prevents the * header/footer from colliding with title/appendix content. */ section.title header, section.title footer { display: none; } /* Tables — grey header with red underline, explicit white body for readability on any background */ table { font-size: 18px; width: 100%; border-collapse: collapse; background: var(--sp-white); } th { background: var(--sp-grey); border-bottom: 2px solid var(--sp-red); padding: 4px 8px; text-align: left; } td { background: var(--sp-white); color: var(--sp-black); border-bottom: 1px solid var(--sp-grey); padding: 4px 8px; } /* Ensure tables on dark/title slides remain readable: white card with a subtle border */ section.title table, section table { background: var(--sp-white); } section.title td, section td { background: var(--sp-white); color: var(--sp-black); } section.title th, section th { background: var(--sp-grey); color: var(--sp-black); } /* REQ-256: dense tables (≥8 rows) use tighter cell padding so 10-13 row * tables (slides 8, 12, A1) fit. Apply via `table.dense` class in the * marp deck. */ table.dense td, table.dense th { padding: 4px 8px; } table.dense { font-size: 16px; } /* Blockquotes — red left border */ blockquote { border-left: 4px solid var(--sp-red); color: var(--sp-dark-grey); font-size: 20px; padding-left: 12px; } /* Code — dark background */ pre { background: var(--sp-black); color: var(--sp-white); border-radius: 4px; padding: 12px; font-size: 16px; } code { background: var(--sp-grey); color: var(--sp-black); border-radius: 2px; padding: 1px 4px; font-size: 18px; } pre code { background: transparent; color: inherit; } /* REQ-255: aspect-ratio-aware image rules. The blunt `max-height: 320px` * broke `w:` directives on tall images (slide 9) and did nothing for * ultra-wide images (slide 6). The new rule uses `object-fit: contain` * and `max-width: 100%` so images scale within the content area without * ignoring explicit `w:`/`h:` directives. */ img { display: block; margin: 0 auto; max-width: 100%; max-height: 380px; object-fit: contain; } /* Wide diagrams (ultra-wide aspect): tighter max-height so they don't * render as a thin strip. Apply via `![w:1000 class:wide]` — or rely on * the default max-height which is already tighter. */ img.wide { max-height: 280px; } /* Tall diagrams: more vertical room. Apply via `![h:480 class:tall]`. */ img.tall { max-height: 480px; } /* Header/footer — subtle grey */ header { color: var(--sp-dark-grey); border-bottom: 1px solid var(--sp-grey); } footer { color: var(--sp-dark-grey); border-top: 1px solid var(--sp-grey); } /* Maturity badges */ .badge { display: inline-block; padding: 2px 8px; border-radius: 4px; font-size: 14px; font-weight: 600; } .badge.today { background: #c6f6d5; color: #22543d; } .badge.planned { background: #fef3c7; color: #78350f; } /* Pagination — S&P Red progress bar */ .bespoke-progress-parent { background: var(--sp-grey); } .bespoke-progress-bar { background: var(--sp-red) !important; } /* Lists — tighter. REQ-256: add ol styling (match ul). */ ul { margin-top: 0.3em; } ol { margin-top: 0.3em; } li { margin-bottom: 0.2em; } /* Strong — S&P Red for emphasis in lead lines */ strong { color: var(--sp-red); } /* REQ-256: PPTX export fidelity — no scrollbars in exported slides. * The `overflow: auto` above is an authoring-time signal; in print/PPTX * we clamp to `hidden` so the exported slide is clean. */ @media print { section { overflow: hidden; } }