@font-face {font-family: "Palestine Archive Latin";src:url("fonts/NotoSans-Regular.woff2") format("woff2");font-weight:400;font-display:swap;}
@font-face {font-family: "Palestine Archive Latin";src:url("fonts/NotoSans-Bold.woff2") format("woff2");font-weight:700;font-display:swap;}
/* Palestine Archive v1. Scoped component classes; merge tokens into the existing UI. */
@font-face {
  font-family: "Palestine Archive Sans";
  src: url("fonts/NotoSansArabic-Regular.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Palestine Archive Sans";
  src: url("fonts/NotoSansArabic-Bold.woff2") format("woff2");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}
:root {
  --pa-ink: #173D32;
  --pa-paper: #F5F0E7;
  --pa-terracotta: #B64735;
  --pa-olive: #88936B;
  --pa-bg: #F5F0E7;
  --pa-surface: #FFFFFF;
  --pa-text: #173D32;
  --pa-muted: #52675E;
  --pa-border: #DADFD5;
  --pa-focus: #B64735;
  --pa-button-bg: #173D32;
  --pa-button-fg: #FFFFFF;
  --pa-button-hover: #235744;
  --pa-radius: 12px;
  --pa-font: "Palestine Archive Sans", "Palestine Archive Latin", "Noto Sans Arabic", system-ui, sans-serif;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --pa-bg: #102A23;
    --pa-surface: #173D32;
    --pa-text: #F5F0E7;
    --pa-muted: #C5CEBD;
    --pa-border: #456455;
    --pa-focus: #E2BF83;
    --pa-button-bg: #F5F0E7;
    --pa-button-fg: #173D32;
    --pa-button-hover: #E7E9DD;
  }
}
:root[data-theme="dark"] {
  --pa-bg: #102A23;
  --pa-surface: #173D32;
  --pa-text: #F5F0E7;
  --pa-muted: #C5CEBD;
  --pa-border: #456455;
  --pa-focus: #E2BF83;
    --pa-button-bg: #F5F0E7;
    --pa-button-fg: #173D32;
    --pa-button-hover: #E7E9DD;
}
.pa-theme {
  font-family: var(--pa-font);
  color: var(--pa-text);
  background: var(--pa-bg);
  line-height: 1.85;
  text-align: start;
  font-synthesis: none;
}
.pa-theme :where(button, input, select, textarea) { font: inherit; }
.pa-theme :where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid var(--pa-focus);
  outline-offset: 4px;
}
.pa-theme :where(a) { color: inherit; text-underline-offset: 0.2em; }
.pa-theme :where(h1, h2, h3) { line-height: 1.5; text-wrap: balance; }
.pa-logo { display: block; width: min(100%, 22.5rem); height: auto; object-fit: contain; }
.pa-card { background: var(--pa-surface); border: 1px solid var(--pa-border); border-radius: var(--pa-radius); padding: clamp(1rem, 2.5vw, 2rem); }
.pa-muted { color: var(--pa-muted); }
.pa-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  min-height: 48px;
  padding: 0.6rem 1.4rem;
  border: 1px solid transparent;
  border-radius: var(--pa-radius);
  background: var(--pa-button-bg);
  color: var(--pa-button-fg);
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
}
.pa-button:hover { background: var(--pa-button-hover); }
.pa-button--accent { background: var(--pa-terracotta); color: #FFFFFF; }
.pa-button--accent:hover { background: #963A2B; }
.pa-button:disabled { opacity: 0.55; cursor: default; }
.pa-ltr { direction: ltr; unicode-bidi: isolate; }
.pa-hero-art { display: block; width: 100%; height: auto; }
@media (prefers-reduced-motion: reduce) {
  .pa-theme *, .pa-theme *::before, .pa-theme *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
}
