/* ============================================================
   Yaqazah — Base (fonts, reset, typography)
   ============================================================ */

/* ===== Fonts ===== */
@font-face {
  font-family: "Thmanyah Serif Display";
  src: url("../fonts/main-font/woff2/thmanyahserifdisplay-Light.woff2") format("woff2"),
       url("../fonts/main-font/otf/thmanyahserifdisplay-Light.otf") format("opentype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0600-06FF, U+0750-077F, U+FB50-FDFF, U+FE70-FEFF, U+0000-00FF;
}
@font-face {
  font-family: "Thmanyah Serif Display";
  src: url("../fonts/main-font/woff2/thmanyahserifdisplay-Regular.woff2") format("woff2"),
       url("../fonts/main-font/otf/thmanyahserifdisplay-Regular.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0600-06FF, U+0750-077F, U+FB50-FDFF, U+FE70-FEFF, U+0000-00FF;
}
@font-face {
  font-family: "Thmanyah Serif Display";
  src: url("../fonts/main-font/woff2/thmanyahserifdisplay-Medium.woff2") format("woff2"),
       url("../fonts/main-font/otf/thmanyahserifdisplay-Medium.otf") format("opentype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Thmanyah Serif Display";
  src: url("../fonts/main-font/woff2/thmanyahserifdisplay-Bold.woff2") format("woff2"),
       url("../fonts/main-font/otf/thmanyahserifdisplay-Bold.otf") format("opentype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Thmanyah Serif Display";
  src: url("../fonts/main-font/woff2/thmanyahserifdisplay-Black.woff2") format("woff2"),
       url("../fonts/main-font/otf/thmanyahserifdisplay-Black.otf") format("opentype");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Thmanyah Sans";
  src: url("../fonts/sec-font/woff2/thmanyahsans-Light.woff2") format("woff2"),
       url("../fonts/sec-font/otf/thmanyahsans-Light.otf") format("opentype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Thmanyah Sans";
  src: url("../fonts/sec-font/woff2/thmanyahsans-Regular.woff2") format("woff2"),
       url("../fonts/sec-font/otf/thmanyahsans-Regular.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Thmanyah Sans";
  src: url("../fonts/sec-font/woff2/thmanyahsans-Medium.woff2") format("woff2"),
       url("../fonts/sec-font/otf/thmanyahsans-Medium.otf") format("opentype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Thmanyah Sans";
  src: url("../fonts/sec-font/woff2/thmanyahsans-Bold.woff2") format("woff2"),
       url("../fonts/sec-font/otf/thmanyahsans-Bold.otf") format("opentype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Thmanyah Sans";
  src: url("../fonts/sec-font/woff2/thmanyahsans-Black.woff2") format("woff2"),
       url("../fonts/sec-font/otf/thmanyahsans-Black.otf") format("opentype");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

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

html {
  direction: rtl;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: "liga", "kern";
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--header-h) + 12px);
  background: var(--bg);
}

body {
  font-family: var(--font-body);
  font-size: var(--fs-base);
  line-height: var(--lh-normal);
  color: var(--text);
  background: var(--bg);
  min-height: 100dvh;
  overflow-x: hidden;
  /* paper-like noise texture for depth */
  background-image:
    radial-gradient(circle at 25% 25%, rgba(122,154,122,.06) 0, transparent 30%),
    radial-gradient(circle at 80% 60%, rgba(232,160,92,.05) 0, transparent 35%);
}

img, picture, svg, video {
  display: block;
  max-width: 100%;
  height: auto;
}

input, button, textarea, select {
  font: inherit;
  color: inherit;
}

button { background: none; border: none; cursor: pointer; }

a {
  color: var(--link);
  text-decoration: none;
  transition: color var(--dur-1) var(--ease);
}
a:hover { color: var(--link-hover); }

ul, ol { list-style: none; }

/* ===== Typography ===== */
h1, h2, h3, h4, h5 {
  font-family: var(--font-display);
  font-weight: var(--fw-bold);
  line-height: var(--lh-tight);
  color: var(--text);
  letter-spacing: -.01em;
}

h1 { font-size: var(--fs-4xl); }
h2 { font-size: var(--fs-3xl); }
h3 { font-size: var(--fs-2xl); }
h4 { font-size: var(--fs-xl); }
h5 { font-size: var(--fs-lg); }

p { line-height: var(--lh-normal); }

::selection {
  background: var(--c-sun);
  color: var(--c-forest-deep);
}

/* Scrollbar (subtle) */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: var(--c-cream-2); }
::-webkit-scrollbar-thumb { background: var(--c-sage); border-radius: var(--radius-pill); }
::-webkit-scrollbar-thumb:hover { background: var(--c-forest); }

/* Reduce-motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
}

/* Focus ring */
:focus-visible {
  outline: 3px solid var(--c-sun);
  outline-offset: 2px;
  border-radius: 4px;
}

/* Generic content (rendered Quill HTML) */
.prose {
  font-size: var(--fs-md);
  line-height: var(--lh-prose);
  color: var(--text);
  word-wrap: break-word;
  overflow-wrap: anywhere;
}
.prose > * + * { margin-top: 1.2em; }
.prose h2, .prose h3, .prose h4 {
  font-family: var(--font-display);
  margin-top: 2em;
  color: var(--c-forest-deep);
}
.prose h2 { font-size: var(--fs-2xl); }
.prose h3 { font-size: var(--fs-xl); }
.prose h4 { font-size: var(--fs-lg); }
.prose p { line-height: var(--lh-prose); }
.prose a {
  color: var(--c-forest);
  text-decoration: underline;
  text-decoration-color: var(--c-sun);
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
}
.prose a:hover {
  color: var(--c-sun-deep);
  text-decoration-color: var(--c-sun-deep);
}
.prose blockquote {
  border-inline-start: 4px solid var(--c-sun);
  background: var(--c-cream-2);
  padding: 1.2em 1.6em;
  border-radius: var(--radius-sm);
  font-family: var(--font-display);
  font-size: var(--fs-lg);
  color: var(--c-forest-deep);
  font-style: italic;
}
.prose ul, .prose ol { padding-inline-start: 1.6em; }
.prose ul li { list-style: disc; margin-bottom: .5em; }
.prose ol li { list-style: arabic-indic; margin-bottom: .5em; }
.prose img {
  border-radius: var(--radius);
  margin: 1.6em 0;
  box-shadow: var(--shadow-2);
}
.prose figure { margin: 2em 0; }
.prose figcaption {
  font-size: var(--fs-sm);
  color: var(--text-muted);
  text-align: center;
  margin-top: .8em;
  font-style: italic;
}
.prose pre, .prose code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  background: var(--c-cream-3);
  padding: .15em .4em;
  border-radius: var(--radius-xs);
  font-size: .9em;
}
.prose pre { padding: 1em 1.2em; overflow-x: auto; direction: ltr; text-align: left; }
.prose hr {
  border: none;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--c-sand), transparent);
  margin: 2.5em 0;
}

/* Drop cap (article first paragraph) */
.prose.drop-cap > p:first-of-type::first-letter {
  font-family: var(--font-display);
  font-weight: var(--fw-black);
  font-size: 4.6em;
  line-height: .9;
  float: right;
  margin: .05em 0 0 .12em;
  color: var(--c-forest);
  padding: 0 .1em;
}

/* Hidden on screen — only visible when printing (overridden in print.css) */
.print-footer { display: none; }