/* ============================================================
   HAYYEK — Design tokens
   DGA-disciplined system, Hayyek-warm identity.
   Paths are relative to THIS file (assets/css/) so they work
   from any page depth.
   ============================================================ */

/* ---- Fonts (self-hosted Thmanyah) ---- */
@font-face{font-family:'Thmanyah Sans';src:url('../fonts/thmanyahsans-Light.woff2') format('woff2');font-weight:300;font-display:swap}
@font-face{font-family:'Thmanyah Sans';src:url('../fonts/thmanyahsans-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Thmanyah Sans';src:url('../fonts/thmanyahsans-Medium.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Thmanyah Sans';src:url('../fonts/thmanyahsans-Bold.woff2') format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'Thmanyah Sans';src:url('../fonts/thmanyahsans-Black.woff2') format('woff2');font-weight:900;font-display:swap}

@font-face{font-family:'Thmanyah Display';src:url('../fonts/thmanyahserifdisplay-Light.woff2') format('woff2');font-weight:300;font-display:swap}
@font-face{font-family:'Thmanyah Display';src:url('../fonts/thmanyahserifdisplay-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Thmanyah Display';src:url('../fonts/thmanyahserifdisplay-Medium.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Thmanyah Display';src:url('../fonts/thmanyahserifdisplay-Bold.woff2') format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'Thmanyah Display';src:url('../fonts/thmanyahserifdisplay-Black.woff2') format('woff2');font-weight:900;font-display:swap}

@font-face{font-family:'Thmanyah Text';src:url('../fonts/thmanyahseriftext-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Thmanyah Text';src:url('../fonts/thmanyahseriftext-Medium.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Thmanyah Text';src:url('../fonts/thmanyahseriftext-Bold.woff2') format('woff2');font-weight:700;font-display:swap}

:root{
  /* Brand greens (primary) */
  --green:#0F6131; --green-tint:#1E7D4F; --green-deep:#0A4422; --green-darker:#073018;
  --green-soft:#E8F1EB; --green-mist:#F2F7F3;

  /* Cream / paper system */
  --paper:#FBF7EC; --paper-warm:#F6EFDD; --cream:#F1E9D3;
  --line:#E5DCC4; --line-soft:#EFE8D4;

  /* Gold accents */
  --gold:#C9A24B; --gold-light:#DDB868; --gold-soft:#F0E4C7;

  /* Ink */
  --ink:#141414; --ink-soft:#4A4A4A; --ink-muted:#8C8275;

  /* Functional (for badges / states) */
  --success:#0F6131; --danger:#AF1E2D; --warning:#C9A24B; --info:#2D6E8E;

  /* Type families */
  --sans:'Thmanyah Sans',system-ui,-apple-system,"Segoe UI",sans-serif;
  --display:'Thmanyah Display','Thmanyah Sans',serif;
  --editorial:'Thmanyah Text','Thmanyah Display',serif;
  --mono:ui-monospace,'SF Mono',Menlo,Monaco,Consolas,"Liberation Mono",monospace;

  /* Spacing — 8pt scale */
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:24px;
  --s-6:32px; --s-7:48px; --s-8:64px; --s-9:96px; --s-10:128px;

  /* Radii */
  --r-sm:12px; --r-md:18px; --r-lg:28px; --r-pill:999px;

  /* Layout */
  --max:1240px; --max-prose:760px; --pad:clamp(20px,5vw,88px);
  --section-y:clamp(72px,12vh,150px);

  /* Motion */
  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);

  /* Accessibility — visible focus ring (Hayyek's gold take on DGA's yellow) */
  --focus-ring:0 0 0 3px var(--paper),0 0 0 6px var(--gold);
}

/* ---- Reset & base ---- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:var(--sans);
  color:var(--ink);
  background:var(--paper);
  line-height:1.75;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration:none;transition:color .25s var(--ease)}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
ul{list-style:none}
:focus-visible{outline:none;box-shadow:var(--focus-ring);border-radius:6px}

/* Skip link (a11y) */
.skip-link{
  position:absolute; right:16px; top:-60px;
  background:var(--ink); color:#fff;
  padding:10px 18px; border-radius:var(--r-pill);
  font-size:14px; font-weight:600; z-index:1000;
  transition:top .2s var(--ease);
}
.skip-link:focus{top:16px}

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