/* ============================================================
   Premier Media Tanzania · shared base layer
   Reset + a handful of cross-site utilities. Every site defines
   its own design system on top of this.
   ============================================================ */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
  min-height: 100vh;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
}

img, svg, video, canvas { display: block; max-width: 100%; }
input, button, textarea, select { font: inherit; color: inherit; }
button { background: none; border: none; cursor: pointer; }
a { color: inherit; text-decoration: none; }
ul, ol { list-style: none; }

::selection { background: var(--sel-bg, #111); color: var(--sel-fg, #fff); }

/* ---------- layout ---------- */
.container {
  width: min(var(--container, 1200px), 100% - 3rem);
  margin-inline: auto;
}
@media (max-width: 640px) {
  .container { width: calc(100% - 2.5rem); }
}

/* ---------- reveal-on-scroll (activated by pdt.js) ---------- */
[data-reveal] {
  opacity: 0;
  transform: translateY(28px);
  transition:
    opacity .9s cubic-bezier(.22,1,.36,1),
    transform .9s cubic-bezier(.22,1,.36,1);
  transition-delay: calc(var(--rd, 0) * 90ms);
}
[data-reveal="left"]  { transform: translateX(-40px); }
[data-reveal="right"] { transform: translateX(40px); }
[data-reveal="scale"] { transform: scale(.92); }
[data-reveal].is-in {
  opacity: 1;
  transform: none;
}

/* ---------- marquee ---------- */
.pdt-marquee {
  overflow: clip;
  display: flex;
  user-select: none;
}
.pdt-marquee > .pdt-marquee-track {
  display: flex;
  flex-shrink: 0;
  min-width: 100%;
  align-items: center;
  animation: pdt-marquee var(--marquee-speed, 24s) linear infinite;
}
.pdt-marquee[data-dir="rtl"] > .pdt-marquee-track { animation-direction: reverse; }
@keyframes pdt-marquee {
  to { transform: translateX(-100%); }
}

/* ---------- open mobile menu: global fixes ---------- */
/* Lock page scroll while the menu is open */
body.nav-open { overflow: hidden; }
/* backdrop-filter on the nav turns it into the containing block for the
   position:fixed mobile menu, which then anchors to the 84px nav bar and
   spills over page content. Drop the filter while the menu is open so the
   menu positions against the viewport again. */
body.nav-open .site-nav {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* ---------- misc ---------- */
.visually-hidden {
  position: absolute; width: 1px; height: 1px;
  clip-path: inset(50%); overflow: hidden; white-space: nowrap;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
  [data-reveal] { opacity: 1; transform: none; }
}