/* LABBAYK campaign palette. This final stylesheet changes color only.
   HDF's source brand tokens and the supplied logo/photo assets stay intact. */
:root {
  --campaign-charcoal: #171717;
  --campaign-charcoal-rgb: 23, 23, 23;
  --campaign-ivory: #F7F5F0;
  --campaign-ivory-rgb: 247, 245, 240;
  --hdf-blue: #2564AA;
  --hdf-blue-rgb: 37, 100, 170;
  --hdf-yellow: #FED545;
  --hdf-white: #FFFFFF;
  --campaign-muted-dark: #BDBDBD;
  --campaign-muted-light: #555555;
  --campaign-rule-dark: rgba(255, 255, 255, .18);
  --campaign-rule-light: rgba(23, 23, 23, .18);
  --action-hover: #205893;
  --action-active: #1C4E83;
  --action-tint: rgba(var(--hdf-blue-rgb), .07);
  --ivory: var(--campaign-ivory);
  --paper: var(--campaign-ivory);
  --ink: var(--campaign-charcoal);
  --blue: var(--hdf-blue);
  /* Compatibility alias for surviving editorial selectors, never a gold tone. */
  --gold: var(--hdf-yellow);
  --muted: var(--campaign-muted-light);
  --line: var(--campaign-rule-light);
  --call-charcoal: var(--campaign-charcoal);
  --call-midnight: var(--campaign-charcoal);
  --call-ivory: var(--hdf-white);
}

body { background: var(--campaign-charcoal); color: var(--campaign-charcoal); }
::selection { background: var(--hdf-yellow); color: var(--campaign-charcoal); }
.call-surface { background: var(--campaign-charcoal); }
.call-stage, .sight-stage, #first-sight, #amanah.editorial-amanah {
  background: var(--campaign-charcoal);
  color: var(--hdf-white);
}
.call-dates, .call-travelers h2, .call-promise, .call-promise > span,
.arrival-caption, .arrival-description, .arrival-credit,
#first-sight .sight-copy, #first-sight .sight-copy h2,
#first-sight .sight-second, #first-sight .photo-location,
#first-sight .photo-credit { color: var(--hdf-white); }
.call-dates span, .call-travelers-note, .call-interface { color: var(--campaign-muted-dark); }
.call-kicker, .call-beat-name, #first-sight .sight-copy .eyebrow,
#first-sight .location-mark { color: var(--hdf-yellow); }
.header-title { opacity: .82; }

/* White is the reading color. Yellow marks a chapter, never a wall of copy. */
#amanah .amanah-intro .eyebrow, #amanah .care-number,
#amanah .return-note time { color: var(--hdf-yellow); }
#amanah .amanah-intro h2, #amanah .amanah-intro h2 span,
#amanah .amanah-details h3, #amanah .return-note p { color: var(--hdf-white); }
#amanah .amanah-intro > p:last-child, #amanah .amanah-details p { color: var(--campaign-muted-dark); }
#amanah .amanah-commitment {
  border-color: var(--campaign-rule-dark);
  /* The restrained reveal keeps the resting text legible while it approaches. */
  opacity: calc(.9 + .1 * var(--care-progress));
}
#amanah .return-note { border-left-color: var(--hdf-yellow); }

/* Geographic depth in charcoal. Only the cartographic data layer receives
   this restrained contrast treatment; photographs and logos are untouched. */
#journey.map-chapter, #journey .map-stage { background: var(--campaign-charcoal); color: var(--hdf-white); }
.map-terrain { filter: grayscale(1) brightness(1.5); mix-blend-mode: normal; opacity: .85; }
.map-edge-shade {
  background: linear-gradient(90deg, var(--campaign-charcoal) 0%, rgba(var(--campaign-charcoal-rgb), .88) 9%, rgba(var(--campaign-charcoal-rgb), .36) 27%, transparent 46%),
    linear-gradient(180deg, var(--campaign-charcoal) 0%, transparent 19%, transparent 78%, var(--campaign-charcoal) 100%);
}
.map-route-base { stroke: var(--hdf-white); stroke-opacity: .25; }
.map-route-progress { stroke: var(--hdf-yellow); }
.map-route circle { fill: var(--campaign-charcoal); stroke: var(--hdf-yellow); stroke-opacity: .75; }
.map-route .map-marker-core { fill: var(--hdf-yellow); }
.map-location { color: var(--hdf-white); text-shadow: 0 2px 10px var(--campaign-charcoal); }
.map-location-date { color: var(--hdf-yellow); }
#journey .map-introduction h2, .map-arrival-line { color: var(--hdf-white); }
.map-introduction > p:last-child { color: var(--campaign-muted-dark); }
.map-departure-shade { background: var(--campaign-charcoal); }

/* The final memory, figures, FAQ and footer share one quiet paper surface. */
.opportunity, .editorial-opportunity, .site-footer { background: var(--campaign-ivory); color: var(--campaign-charcoal); }
.editorial-opportunity .giving-copy h2,
.editorial-opportunity .giving-copy h2 > .giving-headline-line,
.editorial-opportunity .giving-amount,
.editorial-opportunity .giving-description,
.editorial-opportunity .campaign-figures strong,
.editorial-opportunity .campaign-figures > div > span,
.editorial-opportunity .faq-heading h2,
.editorial-opportunity .program-details summary,
.editorial-opportunity .program-details details p strong,
.editorial-opportunity .editorial-closing { color: var(--campaign-charcoal); }
.editorial-opportunity .opportunity-date,
.editorial-opportunity .contribution-note,
.editorial-opportunity .campaign-state,
.editorial-opportunity .campaign-figures small,
.editorial-opportunity .faq-heading > p:last-child,
.editorial-opportunity .program-details details p,
.editorial-opportunity .print-caption-date { color: var(--campaign-muted-light); }
.editorial-opportunity .opportunity-top .eyebrow,
.editorial-opportunity .faq-heading .eyebrow,
.editorial-opportunity .print-location-pin,
.editorial-opportunity .program-details summary > span,
.editorial-opportunity .contribute-button,
.site-footer a { color: var(--hdf-blue); }
.editorial-opportunity .campaign-figures,
.editorial-opportunity .program-details details,
.editorial-opportunity .editorial-closing { border-color: var(--campaign-rule-light); }
.editorial-opportunity .editorial-photo-print { background: var(--hdf-white); border-color: rgba(var(--campaign-charcoal-rgb), .09); }
.editorial-opportunity .editorial-photo-print figcaption { color: var(--campaign-charcoal); }

/* A blue fill identifies the primary action in every theme, including the
   small persistent header action. Text labels and arrow shapes remain intact. */
.donate-button, .site-header .donate-button,
.site-header.light .donate-button,
.editorial-opportunity .giving-actions .donate-button,
.editorial-opportunity .editorial-closing .donate-button {
  background: var(--hdf-blue);
  border-color: var(--hdf-blue);
  color: var(--hdf-white);
  box-shadow: none;
}
.site-header .donate-button::before { border-color: transparent; }
.site-header:not(.light) .donate-button::before { border-color: var(--campaign-muted-dark); }
.donate-button:hover, .site-header .donate-button:hover,
.site-header.light .donate-button:hover,
.editorial-opportunity .giving-actions .donate-button:hover,
.editorial-opportunity .editorial-closing .donate-button:hover {
  background: var(--action-hover); color: var(--hdf-white); box-shadow: none;
}
.donate-button:active, .site-header .donate-button:active,
.editorial-opportunity .giving-actions .donate-button:active,
.editorial-opportunity .editorial-closing .donate-button:active { background: var(--action-active); }
.site-header { color: var(--hdf-white); }
.site-header.scrolled:not(.light) { background: rgba(var(--campaign-charcoal-rgb), .96); }
.site-header.light { color: var(--campaign-charcoal); background: rgba(var(--campaign-ivory-rgb), .98); }
html:not(.js) .site-header { background: var(--campaign-charcoal); }
.site-header .text-button:hover, .site-header .text-button[aria-expanded="true"] { color: var(--hdf-yellow); }
.site-header.light .text-button:hover, .site-header.light .text-button[aria-expanded="true"] { color: var(--hdf-blue); }
.site-header .text-button:hover > span:last-child { text-decoration: underline; text-underline-offset: 5px; }
.contribute-button:hover, .site-footer a:hover, .chapters-dialog nav > a:hover { text-decoration: underline; text-underline-offset: 5px; }

/* Stable contrast replaces blend-mode-dependent dots over arbitrary photos.
   Their existing scale change and the current-step attribute also convey state. */
.chapter-dots { mix-blend-mode: normal; color: var(--hdf-white); }
.chapter-dots a::after { background: var(--hdf-white); opacity: 1; box-shadow: 0 0 0 2px var(--campaign-charcoal); }
.chapter-dots a[aria-current]::after { background: var(--hdf-yellow); }
body:has(.site-header.light) .chapter-dots a[aria-current]::after { background: var(--hdf-blue); box-shadow: 0 0 0 2px var(--hdf-white); }
.chapter-dots a span { color: var(--hdf-white); background: var(--campaign-charcoal); padding: 4px 8px; border-radius: 2px; }
.journey-controls { color: var(--hdf-white); background: rgba(var(--campaign-charcoal-rgb), .96); }
.journey-controls button[aria-pressed="true"] { color: var(--hdf-yellow); }
.reading-progress { background: var(--campaign-charcoal); }
#reading-progress { background: var(--hdf-yellow); }
.skip-link { background: var(--hdf-blue); color: var(--hdf-white); }

dialog { background: var(--hdf-white); color: var(--campaign-charcoal); }
dialog::backdrop { background: rgba(var(--campaign-charcoal-rgb), .72); }
.chapters-dialog nav > a { border-color: var(--campaign-rule-light); }
.chapters-dialog nav > a:hover, .dialog-details { color: var(--hdf-blue); }
.gift-options button { color: var(--campaign-charcoal); border-color: var(--hdf-blue); }
.gift-options button[aria-pressed="true"] { background: var(--action-tint); border-color: var(--hdf-blue); color: var(--hdf-blue); box-shadow: inset 0 0 0 1px var(--hdf-blue); }
.donation-dialog .large:disabled { background: rgba(var(--campaign-charcoal-rgb), .08); color: var(--campaign-muted-light); border-color: transparent; box-shadow: none; }
.dialog-close:hover { color: var(--hdf-blue); }

button:focus-visible, a:focus-visible, summary:focus-visible { outline-color: var(--hdf-yellow); }
.opportunity button:focus-visible, .opportunity a:focus-visible, .opportunity summary:focus-visible,
.site-header.light button:focus-visible, .site-header.light a:focus-visible,
.site-footer a:focus-visible, dialog button:focus-visible, dialog a:focus-visible,
dialog input:focus-visible, .map-footer > a:focus-visible { outline-color: var(--hdf-blue); }
.chapter-dots a:focus-visible { outline-color: var(--hdf-white); box-shadow: 0 0 0 4px var(--campaign-charcoal); }

@media (max-width: 700px) {
  .map-edge-shade {
    background: linear-gradient(180deg, var(--campaign-charcoal) 0%, rgba(var(--campaign-charcoal-rgb), .78) 15%, transparent 35%, transparent 78%, var(--campaign-charcoal) 100%),
      linear-gradient(90deg, rgba(var(--campaign-charcoal-rgb), .25), transparent 45%, rgba(var(--campaign-charcoal-rgb), .12));
  }
}
@media print {
  body, #amanah.editorial-amanah { background: var(--hdf-white); color: var(--campaign-charcoal); }
  #amanah .amanah-intro h2, #amanah .amanah-intro h2 span, #amanah .amanah-intro .eyebrow,
  #amanah .amanah-intro > p:last-child, #amanah .care-number, #amanah .amanah-details h3,
  #amanah .amanah-details p, #amanah .return-note time, #amanah .return-note p { color: var(--campaign-charcoal); }
  #amanah .amanah-commitment { opacity: 1; }
  #amanah .return-note { border-left-color: var(--campaign-charcoal); }
}
