/*
Theme Name: Anansesɛm
Theme URI: https://anansesem.com
Author: Elvis Damptey
Author URI: https://anansesem.com
Description: Custom editorial theme for Anansesɛm, an independent publication on African cinema. Bold Editorial identity: Lato Black headlines, ink/paper base, Cinema Red and Reel Gold as single-accent-at-a-time highlights.
Version: 1.0.0
Requires at least: 6.4
Requires PHP: 8.0
Tested up to: 7.0
Text Domain: anansesem
*/

/* ==========================================================================
   Design tokens — values are the locked brand spec, do not improvise new ones.
   ========================================================================== */
:root {
  --ase-ink: #0A0A0A;
  --ase-paper: #F5F2EC;
  --ase-red: #C81E1E;
  --ase-gold: #C9971C;
  --ase-grey-light: #C9C4B8;
  --ase-grey-dark: #5B5B5B;

  --ase-bg: var(--ase-paper);
  --ase-fg: var(--ase-ink);
  --ase-bg-inverse: var(--ase-ink);
  --ase-fg-inverse: var(--ase-paper);
  --ase-card-bg: #ffffff;
  --ase-rule: var(--ase-grey-light);

  --ase-font-display: 'Lato', Arial, Helvetica, sans-serif;
  --ase-font-body: 'Lato', Arial, Helvetica, sans-serif;

  --ase-measure: 68ch;
  --ase-gutter: clamp(20px, 4vw, 56px);
  --ase-container: 1240px;
}

:root[data-theme="dark"] {
  --ase-bg: var(--ase-ink);
  --ase-fg: var(--ase-paper);
  --ase-bg-inverse: var(--ase-paper);
  --ase-fg-inverse: var(--ase-ink);
  --ase-card-bg: #161615;
  --ase-rule: #38362c;
}

/* ==========================================================================
   Reset
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--ase-bg);
  color: var(--ase-fg);
  font-family: var(--ase-font-body);
  font-size: 17px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
img, svg { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button, input, textarea { font-family: inherit; color: inherit; }
ul[class], ol[class] { list-style: none; margin: 0; padding: 0; }
:focus-visible { outline: 2px solid var(--ase-red); outline-offset: 3px; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}

.screen-reader-text {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(1px,1px,1px,1px); white-space: nowrap;
}
