/* ==========================================================
   HAMS | همس — Design tokens (CSS custom properties)
   Brand identity by ARHAFEZ · v1.0 · 2026
   ========================================================== */

/* Fonts — licensed font files are NOT included in this folder.
   Place your licensed .woff2 files in /fonts and keep these names. */
@font-face{font-family:"LT Museum";src:url(fonts/LTMuseum-Light.woff2) format("woff2");font-weight:300;font-display:swap}
@font-face{font-family:"LT Museum";src:url(fonts/LTMuseum-LightItalic.woff2) format("woff2");font-weight:300;font-style:italic;font-display:swap}
@font-face{font-family:"LT Museum";src:url(fonts/LTMuseum-Medium.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"The Year of The Camel";src:url(fonts/TheYearofTheCamel-Light.woff2) format("woff2");unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+FB50-FDFF,U+FE70-FEFF,U+200C-200F;font-weight:300;font-display:swap}
@font-face{font-family:"The Year of The Camel";src:url(fonts/TheYearofTheCamel-Thin.woff2) format("woff2");unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+FB50-FDFF,U+FE70-FEFF,U+200C-200F;font-weight:200;font-display:swap}
@font-face{font-family:"LT Superior";src:url(fonts/LTSuperior-Light.woff2) format("woff2");font-weight:300;font-display:swap}

:root{
  /* Colour */
  --hams-burgundy:#4C1026;     /* Secret Burgundy — primary */
  --hams-burgundy-70:#7A3A52;
  --hams-burgundy-40:#B47C92;  /* decorative only — not for text */
  --hams-blush:#E5BCCC;        /* Soft Blush — secondary */
  --hams-dew:#F9F1F4;          /* Morning Dew — background */
  --hams-night:#2B0814;        /* digital only */
  --hams-line:rgba(76,16,38,.16);

  /* Type */
  --font-ar:"The Year of The Camel","LT Museum","Noto Naskh Arabic",Georgia,serif;
  --font-en:"LT Museum",Georgia,serif;
  --font-label:"LT Superior","LT Museum",sans-serif;
  --fs-display:84px; --fs-h1:56px; --fs-h2:46px; --fs-h3:26px;
  --fs-lead:21px; --fs-body:18px; --fs-small:15px; --fs-label:12px;
  --lh-heading:1.35; --lh-body-ar:1.9; --lh-body-en:1.6;
  --ls-label:.24em;

  /* Space & layout */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px;
  --sp-6:32px; --sp-7:48px; --sp-8:72px; --sp-9:120px;
  --container:1360px; --gutter:56px;

  /* Motion — soft, never bouncy */
  --dur-fast:240ms; --dur-beat:470ms; --dur-slow:940ms;
  --ease-whisper:cubic-bezier(.22,.61,.36,1);
  --ease-in-out:cubic-bezier(.65,0,.35,1);
}
@media (max-width:760px){
  :root{--fs-display:46px; --fs-h1:36px; --fs-h2:32px; --fs-h3:22px;
        --fs-lead:17px; --fs-body:16px; --fs-small:14px; --fs-label:11px; --gutter:20px}
}
@media (prefers-reduced-motion:reduce){
  :root{--dur-fast:0ms; --dur-beat:0ms; --dur-slow:0ms}
}

/* Base */
html[dir="rtl"] body{font-family:var(--font-ar)}
body{background:var(--hams-dew);color:var(--hams-burgundy);font-weight:300;font-size:var(--fs-body);line-height:var(--lh-body-ar)}
.en,[lang="en"]{font-family:var(--font-en);line-height:var(--lh-body-en)}
.label{font-family:var(--font-label);font-size:var(--fs-label);letter-spacing:var(--ls-label);text-transform:uppercase}
h1,h2,h3{font-weight:300;line-height:var(--lh-heading)}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;height:56px;padding:0 38px;
     border:1px solid var(--hams-burgundy);background:transparent;color:var(--hams-burgundy);
     transition:background var(--dur-fast) var(--ease-whisper),color var(--dur-fast) var(--ease-whisper)}
.btn--primary{background:var(--hams-burgundy);color:var(--hams-blush)}
.btn:hover{background:var(--hams-burgundy);color:var(--hams-blush)}
.btn--primary:hover{background:var(--hams-night)}

/* Reveal — "said softly" */
.reveal{opacity:0;transform:translateY(12px);transition:opacity var(--dur-slow) var(--ease-whisper),transform var(--dur-slow) var(--ease-whisper)}
.reveal.is-in{opacity:1;transform:none}
