/* Website presentation only; authored source and PDF stay at their design size. */
@media screen {
  story-stage { --story-gutter:clamp(24px,5vw,96px); }
  story-stage > section[data-label="02 The Mission"] > img[src$="assets/textures/africa-dots.png"] {
    opacity:.5 !important;
    filter:blur(2.4px) !important;
  }
  story-stage > section[data-label="02 The Mission"] > .africa-map-background-video {
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    opacity:.5;
    filter:blur(2.4px) saturate(.78) contrast(.94);
    mix-blend-mode:multiply;
    pointer-events:none;
  }
  story-stage > section[data-label="02 The Mission"].has-africa-map-motion > img[src$="assets/textures/africa-dots.png"] {
    opacity:0 !important;
  }
  @media (min-width:701px), (orientation:landscape) {
    story-stage > section[data-story-photo] { overflow:visible !important; }
    story-stage > section[data-story-photo] > .story-backdrop,
    story-stage > section[data-story-photo] > video {
      inset:auto !important; left:var(--backdrop-left) !important; top:var(--backdrop-top) !important;
      width:var(--backdrop-width) !important; height:var(--backdrop-height) !important;
    }
  }
  story-stage > section[data-label="01 Cover"] {
    display:grid;
    grid-template-rows:auto 1fr auto;
    gap:24px;
    padding:clamp(28px,5vh,64px) var(--story-gutter) calc(var(--nav-height,78px) + 26px);
  }
  story-stage > section[data-label="01 Cover"] > img[alt=""],
  story-stage > section[data-label="01 Cover"] > video {
    object-position:left center !important;
  }
  story-stage > section[data-label="01 Cover"] > img[alt="Black Gold: New Ground"] {
    position:relative !important; top:auto !important; left:auto !important;
    height:clamp(62px,10vh,120px) !important; width:auto; max-width:60vw; object-fit:contain; object-position:left;
    grid-row:1; align-self:start;
  }
  story-stage > section[data-label="01 Cover"] > div:has(>h1) {
    position:relative !important; left:auto !important; bottom:auto !important;
    align-self:center; grid-row:2; width:100%; max-width:1120px !important;
  }
  story-stage > section[data-label="01 Cover"] h1 {
    font-size:clamp(44px,6.3vw,112px) !important; line-height:.98 !important; max-width:14ch;
    text-wrap:balance;
  }
  story-stage > section[data-label="01 Cover"] p {
    font-size:clamp(21px,2.2vw,36px) !important; max-width:38ch !important;
    margin-top:24px !important; text-wrap:pretty;
  }
  story-stage > section[data-label="01 Cover"] > div:last-child {
    position:relative !important; left:auto !important; right:auto !important; bottom:auto !important;
    grid-row:3; flex-wrap:wrap; gap:16px 32px; font-size:clamp(10px,1.1vw,18px) !important; line-height:1.5 !important;
  }
  @media (max-width:700px) {
    story-stage > section[data-label="01 Cover"] { gap:20px; }
    story-stage > section[data-label="01 Cover"] h1 { font-size:clamp(36px,9vw,58px) !important; }
    story-stage > section[data-label="01 Cover"] p { font-size:23px !important; line-height:1.25 !important; }
    story-stage > section[data-label="01 Cover"] > div:last-child { flex-direction:column; align-items:flex-start !important; gap:8px; max-width:36ch; }
  }
  @media (max-height:600px) {
    story-stage > section[data-label="01 Cover"] { gap:12px; padding-top:20px; padding-bottom:calc(var(--nav-height,70px) + 12px); }
    story-stage > section[data-label="01 Cover"] > img[alt="Black Gold: New Ground"] { height:48px !important; }
    story-stage > section[data-label="01 Cover"] h1 { font-size:clamp(30px,7vh,54px) !important; max-width:25ch; }
    story-stage > section[data-label="01 Cover"] p { font-size:clamp(17px,3.6vh,22px) !important; margin-top:12px !important; max-width:52ch !important; }
    story-stage > section[data-label="01 Cover"] > div:has(>h1) > div { margin-bottom:12px !important; }
    story-stage > section[data-label="01 Cover"] > div:last-child { font-size:9px !important; gap:6px 16px; }
  }
  @media (max-width:700px) and (orientation:portrait) {
    story-stage > section:not([data-label="01 Cover"]) {
      display:flex; flex-direction:column; gap:28px; padding:28px 24px 36px;
      overflow:hidden !important; font-size:16px;
    }
    story-stage > section:not([data-label="01 Cover"]) * { box-sizing:border-box; }
    story-stage .story-block {
      position:relative !important; inset:auto !important; width:100% !important; max-width:100% !important;
      height:auto !important; flex:none;
    }
    story-stage .story-type { font-size:var(--mobile-font) !important; }
    story-stage .story-block h2, story-stage h2.story-block { font-size:32px !important; line-height:1.08 !important; overflow-wrap:anywhere; }
    story-stage .story-block p { line-height:1.4 !important; }
    story-stage .story-backdrop { position:absolute !important; inset:0 !important; width:100% !important; height:100% !important; object-fit:cover; }
    story-stage .story-header { margin-bottom:8px; }
    story-stage .story-header img { height:42px !important; width:auto; }
    story-stage .story-grid { grid-template-columns:1fr !important; grid-template-rows:auto !important; gap:20px !important; }
    story-stage .story-grid > div { min-width:0; min-height:0 !important; max-width:100%; }
    story-stage .story-grid > .story-card { padding:24px !important; }
    story-stage .story-block.story-flex { flex-wrap:wrap; gap:16px !important; }
    story-stage .story-rule { display:none; }
    story-stage .story-image-panel { min-height:340px; padding:24px !important; display:flex; align-items:flex-end; }
    story-stage .story-image-panel > img { position:absolute; inset:0; width:100% !important; height:100% !important; object-fit:cover; }
    story-stage .story-image-panel > div:not([style*="inset:"]) { position:relative !important; inset:auto !important; }
    story-stage section[data-label^="11 "] .story-grid img { max-width:100%; height:320px !important; object-fit:cover; }
    story-stage section[data-label^="12 "] .story-grid > .story-grid { grid-template-columns:70px 1fr !important; }
    story-stage section[data-label^="13 "] .story-block.story-flex > span:first-child { font-size:64px !important; }
    story-stage section[data-label^="14 "] .story-grid > div { padding:16px 0 !important; border-right:0 !important; }
    story-stage section[data-label^="14 "] .story-grid > .story-grid { gap:12px !important; border-bottom:1px solid rgba(11,11,10,.15); }
    story-stage .story-horizontal { display:block !important; overflow-x:auto; padding-bottom:10px; }
    story-stage .story-horizontal > .story-block { width:700px !important; min-width:700px; max-width:none !important; }
    story-stage .story-horizontal .story-grid { grid-template-columns:var(--mobile-columns) !important; gap:16px !important; }
    story-stage section[data-label^="15 "] > .story-block > .story-grid { grid-template-columns:1fr 1fr !important; gap:12px !important; }
    story-stage section[data-label^="16 "] .story-horizontal > .story-grid { grid-template-columns:160px repeat(3,1fr) !important; gap:8px !important; }
    story-stage section[data-label^="16 "] > .story-card { padding:28px !important; }
    story-stage section[data-label^="17 "] .story-horizontal > .story-grid { grid-template-columns:140px 1fr 1.4fr !important; gap:0 20px !important; }
    story-stage section[data-label^="17 "] .story-horizontal .story-grid > div { width:auto !important; }
    story-stage section[data-label^="19 "] .story-grid .story-grid { grid-template-columns:auto 1fr !important; }
    story-stage section[data-label^="21 "] > .story-block:last-child { align-items:flex-start !important; }
    story-stage section[data-label^="21 "] > .story-block:last-child > div { text-align:left !important; }
  }
}