/*
  VULOIR brand tokens (visual proof).
  Everything client-specific in the styling lives here: swap fonts, colours
  and wordmark treatment for a new brand without touching layout CSS.
*/

@font-face {
  font-family: "Bodoni Moda";
  src: url("../assets/fonts/BodoniModa-VF.ttf") format("truetype");
  font-weight: 400 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Bodoni Moda";
  src: url("../assets/fonts/BodoniModa-Italic-VF.ttf") format("truetype");
  font-weight: 400 900;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Instrument Sans";
  src: url("../assets/fonts/InstrumentSans-VF.ttf") format("truetype");
  font-weight: 400 700;
  font-stretch: 75% 100%;
  font-style: normal;
  font-display: swap;
}

/*
  Arabic companions (OFL, files + licences in assets/fonts): Amiri pairs with the
  Bodoni display face, IBM Plex Sans Arabic with Instrument Sans. unicode-range
  limits them to Arabic characters, so browsers download them only when Arabic
  text is on the page; Latin words keep the brand faces.
*/
@font-face {
  font-family: "Amiri";
  src: url("../assets/fonts/Amiri-Regular.ttf") format("truetype");
  font-weight: 400 500; font-style: normal; font-display: swap;
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-08FF, U+FB50-FDFF, U+FE70-FEFF, U+200C-200F, U+2066-2069;
}
@font-face {
  font-family: "IBM Plex Sans Arabic";
  src: url("../assets/fonts/IBMPlexSansArabic-Regular.ttf") format("truetype");
  font-weight: 400; font-style: normal; font-display: swap;
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-08FF, U+FB50-FDFF, U+FE70-FEFF, U+200C-200F, U+2066-2069;
}
@font-face {
  font-family: "IBM Plex Sans Arabic";
  src: url("../assets/fonts/IBMPlexSansArabic-Medium.ttf") format("truetype");
  font-weight: 500; font-style: normal; font-display: swap;
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-08FF, U+FB50-FDFF, U+FE70-FEFF, U+200C-200F, U+2066-2069;
}
@font-face {
  font-family: "IBM Plex Sans Arabic";
  src: url("../assets/fonts/IBMPlexSansArabic-SemiBold.ttf") format("truetype");
  font-weight: 600 700; font-style: normal; font-display: swap;
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-08FF, U+FB50-FDFF, U+FE70-FEFF, U+200C-200F, U+2066-2069;
}

:root {
  /* Palette */
  --c-bg: #141210;          /* warm charcoal */
  --c-bg-deep: #0b0a09;
  --c-stage: #0f0d0b;      /* hero background, matched to the render's edge colour */
  --c-surface: #1c1a17;
  --c-text: #ece6db;        /* warm off-white */
  --c-text-muted: #a39c90;  /* ~6.5:1 on --c-bg */
  --c-accent: #c8b27e;      /* champagne: hairlines, one word, focus */
  --c-line: rgba(236, 230, 219, 0.14);

  /* Type */
  --f-display: "Bodoni Moda", "Didot", "Bodoni 72", Georgia, serif;
  --f-sans: "Instrument Sans", "Helvetica Neue", Arial, sans-serif;

  /* Wordmark: tracking and the half-lit O */
  --wm-tracking: 0.32em;
  --wm-o-lit: var(--c-text);
  --wm-o-shadow: rgba(236, 230, 219, 0.26);

  /* Rhythm */
  --gutter: clamp(20px, 4.2vw, 64px);
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
}