/*! 🌼 daisyUI 5.5.20 */
/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */
@layer properties {
  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
    *, :before, :after, ::backdrop {
      --tw-rotate-x: initial;
      --tw-rotate-y: initial;
      --tw-rotate-z: initial;
      --tw-skew-x: initial;
      --tw-skew-y: initial;
      --tw-border-style: solid;
      --tw-leading: initial;
      --tw-font-weight: initial;
      --tw-tracking: initial;
    }
  }
}

@font-face {
  font-family: Amiri;
  src: url("fonts/Amiri-Regular-arabic.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  unicode-range: U+6??, U+750-77F, U+870-88E, U+890-891, U+897-8E1, U+8E3-8FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC;
}

@font-face {
  font-family: Amiri;
  src: url("fonts/Amiri-Regular-latin.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Amiri;
  src: url("fonts/Amiri-Bold-arabic.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+6??, U+750-77F, U+870-88E, U+890-891, U+897-8E1, U+8E3-8FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC;
}

@font-face {
  font-family: Cormorant Garamond;
  src: url("fonts/CormorantGaramond-Variable-latin.woff2") format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Cormorant Garamond;
  src: url("fonts/CormorantGaramond-Variable-latin-ext.woff2") format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: Cormorant Garamond;
  src: url("fonts/CormorantGaramond-Italic-Variable-latin.woff2") format("woff2");
  font-weight: 400 700;
  font-style: italic;
  font-display: swap;
  unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Cormorant Garamond;
  src: url("fonts/CormorantGaramond-Italic-Variable-latin-ext.woff2") format("woff2");
  font-weight: 400 700;
  font-style: italic;
  font-display: swap;
  unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: Bouazzi Maghribi;
  src: url("fonts/BouazziMaghribi-Regular.woff2") format("woff2"), url("fonts/BouazziMaghribi-Regular.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  --mtn-green: #1d4030;
  --mtn-green-deep: #173324;
  --mtn-cream: #f7f2e8;
  --mtn-cream-raised: #fdfbf6;
  --mtn-cream-inner: #f0e9db;
  --mtn-seal-cream: #f3ebda;
  --mtn-gilt: #b39169;
  --mtn-gilt-light: #d8bd93;
  --mtn-gilt-pale: #ecdfc6;
  --mtn-green-ink: #12291d;
  --mtn-gilt-ink: #6b4c22;
  --mtn-ink-muted: #342d22;
  --mtn-hairline: #d8c9a6;
  --mtn-link: #6b4c22;
  --mtn-link-hover: #8a6532;
  --mtn-placeholder: #7a6d56;
  --color-ink: var(--mtn-green-ink);
  --color-ink-muted: var(--mtn-ink-muted);
  --color-surface: var(--mtn-cream);
  --color-surface-raised: var(--mtn-cream-raised);
  --color-surface-inset: var(--mtn-cream-inner);
  --color-accent: var(--mtn-gilt);
  --color-accent-text: var(--mtn-gilt-ink);
  --color-accent-soft: #b3916924;
  --color-accent-strong: var(--mtn-green);
  --color-line: var(--mtn-hairline);
  --color-on-dark: var(--mtn-cream-raised);
  --color-muted-on-dark: var(--mtn-gilt-pale);
  --color-accent-on-dark: var(--mtn-gilt-light);
  --color-link: var(--mtn-link);
  --color-link-hover: var(--mtn-link-hover);
  --color-placeholder: var(--mtn-placeholder);
  --color-gilt-ink: var(--mtn-link);
}

@supports (color: color-mix(in lab, red, red)) {
  :root {
    --color-gilt-ink: color-mix(in srgb, var(--mtn-link) 72%, var(--color-ink));
  }
}

:root {
  --color-text-faint: var(--color-ink-muted);
}

@supports (color: color-mix(in lab, red, red)) {
  :root {
    --color-text-faint: color-mix(in srgb, var(--color-ink-muted) 80%, var(--color-surface));
  }
}

:root {
  --color-bead: var(--mtn-link);
  --color-gilt-wash: var(--color-accent-soft);
}

@supports (color: color-mix(in lab, red, red)) {
  :root {
    --color-gilt-wash: color-mix(in srgb, var(--color-accent-soft) 40%, transparent);
  }
}

:root {
  --madder: #9d2f30;
  --sage: #2a6f46;
  --azure: #2d5f8a;
  --answer-correct: var(--sage);
  --answer-correct-bg: #dcecdf;
  --answer-wrong: var(--madder);
  --answer-wrong-bg: #f6dedb;
  --r-fil: var(--azure);
  --r-fail: #806600;
  --r-maful: var(--madder);
  --r-mubtada: #5f183c;
  --r-khabar: #7150c4;
  --r-mudaf: #a2500f;
  --r-harf: #212660;
  --r-majrur: #187374;
  --r-sifah: var(--sage);
  --r-ismkana: var(--r-mubtada);
  --r-khabarkana: var(--r-khabar);
  --r-filnaqis: var(--r-fil);
  --r-mudafdamir: var(--r-mudaf);
  --r-isminna: var(--r-mubtada);
  --r-khabarinna: var(--r-khabar);
  --r-mudari: var(--r-fil);
  --case-mark: #c2185b;
  --affix-stem: var(--color-ink);
  --affix-prefix: #1f5f7a;
  --affix-ending: var(--madder);
  --affix-wasl: #7a4a12;
  --font-display: "Cormorant Garamond", "Cormorant", "Amiri", Georgia, "Times New Roman", serif;
  --font-body: "Cormorant Garamond", "Cormorant", "Amiri", Georgia, "Times New Roman", serif;
  --font-arabic: "Amiri", "Scheherazade New", "Noto Naskh Arabic", "Traditional Arabic", "Geeza Pro", serif;
  --vocalized-line-height: 1.6;
  --tracking-eyebrow: .28em;
  --tracking-kicker: .2em;
  --tracking-wordmark: .3em;
  --tracking-nav: .14em;
  --text-caption: 15px;
  --text-label: 16px;
  --text-small: 18px;
  --text-body: 21px;
  --text-lede: 24px;
  --text-title-sm: 28px;
  --text-quote: 30px;
  --text-title-md: 38px;
  --text-display: 46px;
  --text-title-lg: 52px;
  --text-button: 17px;
  --text-eyebrow: .75rem;
  --leading-panel: 1.6;
  --radius: 3px;
  --radius-pill: 999px;
  --hairline: 1px;
  --shadow-card: 0 18px 40px -30px #1d40308c;
  --shadow-pop: 0 14px 34px -20px #1d403080;
  --sign-in-apple-fill: #000;
  --sign-in-apple-label: #fff;
}

@layer theme {
  :root, :host {
    --spacing: .25rem;
    --container-2xl: 42rem;
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
  }
}

@layer base {
  * {
    box-sizing: border-box;
  }

  html {
    -webkit-text-size-adjust: 100%;
  }

  body {
    background: var(--color-surface);
    color: var(--color-ink-muted);
    font-family: var(--font-site-body);
    font-size: var(--text-body);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizelegibility;
    flex-direction: column;
    min-height: 100vh;
    margin: 0;
    line-height: 1.7;
    display: flex;
  }

  @media (max-width: 640px) {
    body {
      font-size: var(--text-small);
    }
  }

  main {
    flex: 1 0 auto;
  }

  h1, h2, h3, h4 {
    font-family: var(--font-body);
    color: var(--color-ink);
    margin: 0;
    font-weight: 600;
    line-height: 1.15;
  }

  p {
    margin: 0 0 1.1rem;
  }

  a {
    color: var(--color-link);
    text-decoration: none;
    transition: color .2s;
  }

  a:hover {
    color: var(--color-link-hover);
  }

  @media (prefers-reduced-motion: reduce) {
    *, :before, :after {
      transition: none !important;
      animation: none !important;
    }
  }

  .skip-link {
    z-index: 100;
    background: var(--color-surface-raised);
    border: 1px solid var(--color-accent);
    color: var(--color-ink);
    padding: .6rem 1rem;
    font-weight: 600;
    position: absolute;
    top: -10rem;
    left: 1rem;
  }

  .skip-link:focus {
    top: 1rem;
  }
}

@layer components {
  .eyebrow {
    font-family: var(--font-body);
    font-size: var(--text-label);
    letter-spacing: var(--tracking-eyebrow);
    text-transform: uppercase;
    color: var(--color-accent-text);
    margin: 0;
    font-weight: 600;
  }

  .eyebrow-rule {
    color: var(--color-accent-text);
    align-items: center;
    gap: .9rem;
    display: inline-flex;
  }

  .eyebrow-rule:before, .eyebrow-rule:after {
    content: "";
    background: var(--color-accent);
    opacity: .8;
    width: 2.2rem;
    height: 1px;
  }

  .nav {
    --nav-height: 4.6rem;
    z-index: 50;
    background: var(--color-surface-raised);
    border-bottom: 1px solid var(--color-line);
    position: sticky;
    top: 0;
  }

  .nav-inner {
    max-width: 68rem;
    height: var(--nav-height);
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    margin: 0 auto;
    padding: 0 1.5rem;
    display: flex;
  }

  .brand {
    align-items: center;
    gap: .7rem;
    display: inline-flex;
  }

  .brand-mark {
    background: var(--color-accent-strong);
    border-radius: 50%;
    flex: none;
    justify-content: center;
    align-items: center;
    width: 42px;
    height: 42px;
    display: flex;
  }

  .brand-word {
    font-family: var(--font-body);
    font-size: var(--text-title-sm);
    letter-spacing: var(--tracking-wordmark);
    color: var(--color-ink);
    margin-right: calc(-1 * var(--tracking-wordmark));
    font-weight: 600;
    line-height: 1;
  }

  .nav-links {
    font-size: var(--text-label);
    letter-spacing: var(--tracking-nav);
    text-transform: uppercase;
    align-items: center;
    gap: 1.55rem;
    font-weight: 600;
    display: flex;
  }

  .nav-links a {
    color: var(--color-ink-muted);
  }

  .nav-links a:hover, .nav-links a.active {
    color: var(--color-ink);
  }

  .nav-links a.active:after {
    content: "";
    background: var(--color-accent);
    height: 1px;
    margin-top: 3px;
    display: block;
  }

  .nav-dropdown {
    position: relative;
  }

  .nav-dropdown-toggle {
    color: var(--color-ink-muted);
    cursor: pointer;
    font: inherit;
    letter-spacing: inherit;
    text-transform: inherit;
    anchor-name: --about-toggle;
    background: none;
    border: none;
    align-items: center;
    gap: .35rem;
    padding: 0;
    display: inline-flex;
  }

  .nav-dropdown-toggle:hover, .nav-dropdown:focus-within .nav-dropdown-toggle, .nav-dropdown-toggle.active {
    color: var(--color-ink);
  }

  .caret {
    font-size: .7em;
  }

  .nav-dropdown-menu {
    min-width: 12rem;
    color: inherit;
    background: var(--color-surface-raised);
    border: 1px solid var(--color-line);
    box-shadow: var(--shadow-pop);
    opacity: 0;
    visibility: hidden;
    border-radius: 3px;
    margin: .7rem 0 0;
    padding: .35rem;
    transition: opacity .18s, transform .18s, visibility .18s;
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%) translateY(-4px);
  }

  .nav-dropdown-menu:popover-open {
    opacity: 1;
    visibility: visible;
    margin: 0;
    position: fixed;
    inset: auto;
    transform: none;
  }

  @supports not (anchor-name: --a) {
    .nav-dropdown-menu:popover-open {
      top: calc(var(--nav-height) + .4rem);
      right: max(1.5rem, 50vw - 32.5rem);
    }

    @media (max-width: 440px) {
      .nav-dropdown-menu:popover-open {
        left: 50%;
        right: auto;
        transform: translateX(-50%);
      }
    }
  }

  @supports (anchor-name: --a) {
    .nav-dropdown-menu:popover-open {
      position-anchor: --about-toggle;
      top: anchor(bottom);
      left: anchor(center);
      margin-top: .7rem;
      right: auto;
      transform: translateX(-50%);
    }
  }

  @supports not selector(:popover-open) {
    .nav-dropdown:hover .nav-dropdown-menu, .nav-dropdown:focus-within .nav-dropdown-menu {
      opacity: 1;
      visibility: visible;
      transform: translateX(-50%) translateY(0);
    }

    .nav-dropdown-menu:before {
      content: "";
      height: .8rem;
      position: absolute;
      bottom: 100%;
      left: 0;
      right: 0;
    }
  }

  .nav-dropdown-menu a {
    font-size: var(--text-label);
    letter-spacing: .12em;
    color: var(--color-ink-muted);
    border-radius: 2px;
    padding: .5rem .8rem;
    display: block;
  }

  .nav-dropdown-menu a:hover {
    background: var(--color-surface-inset);
    color: var(--color-ink);
  }

  @media (max-width: 640px) {
    .nav {
      --nav-height: 4rem;
    }

    .nav-links {
      font-size: var(--text-caption);
      letter-spacing: .1em;
      gap: 1rem;
    }

    .brand-word {
      font-size: var(--text-lede);
    }
  }

  @media (max-width: 440px) {
    .nav {
      --nav-height: 6.1rem;
    }

    .nav-inner {
      flex-wrap: wrap;
      justify-content: center;
      row-gap: .5rem;
      height: auto;
      padding: .7rem 1rem;
    }

    .nav-links {
      flex-wrap: wrap;
      justify-content: center;
    }
  }

  .plate {
    background: var(--color-surface-raised);
    border: 1px solid var(--color-accent);
    outline: 1px solid var(--color-accent);
    outline-offset: 5px;
    border-radius: 2px;
    margin: 0 auto;
  }

  .page-header {
    text-align: center;
    border-bottom: 1px solid var(--color-line);
    background: radial-gradient(120% 90% at 50% 0%, var(--color-accent), transparent 60%);
    padding: 4rem 1.5rem 3.4rem;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .page-header {
      background: radial-gradient(120% 90% at 50% 0%, color-mix(in srgb, var(--color-accent) 9%, transparent), transparent 60%);
    }
  }

  .page-header .eyebrow-rule {
    margin-bottom: 1.1rem;
  }

  .page-title {
    font-family: var(--font-body);
    font-size: var(--text-title-lg);
    letter-spacing: .02em;
  }

  @media (max-width: 640px) {
    .page-title {
      font-size: var(--text-title-md);
    }
  }

  .page-lede {
    max-width: 38rem;
    color: var(--color-ink-muted);
    font-style: italic;
    font-size: var(--text-lede);
    margin: .9rem auto 0;
  }

  .section {
    padding: 4.5rem 1.5rem;
  }

  .site-prose h2 {
    font-size: var(--text-title-md);
    margin-bottom: 1rem;
  }

  .site-prose p {
    color: var(--color-ink-muted);
  }

  .site-prose .eyebrow {
    color: var(--color-accent-text);
    margin-bottom: 1.1rem;
  }

  .site-footer {
    background: var(--color-accent-strong);
    color: var(--color-muted-on-dark);
    text-align: center;
    border-top: 3px solid var(--color-accent);
    flex-shrink: 0;
    padding: 3rem 1.5rem;
  }

  .footer-lockup {
    align-items: center;
    gap: .7rem;
    margin-bottom: 1rem;
    display: inline-flex;
  }

  .footer-word {
    font-family: var(--font-body);
    font-size: var(--text-lede);
    letter-spacing: .2em;
    color: var(--color-surface-raised);
    margin-right: -.2em;
    font-weight: 600;
  }

  .footer-ar {
    font-family: var(--arabic);
    font-size: var(--text-lede);
    color: var(--color-accent-on-dark);
    line-height: 1;
    position: relative;
    top: -.28em;
  }

  .footer-note {
    font-size: var(--text-caption);
    letter-spacing: .1em;
    color: var(--color-muted-on-dark);
    margin: 0;
  }

  .footer-note a {
    color: inherit;
    text-underline-offset: 2px;
    text-decoration: underline;
  }

  .footer-divider {
    background: var(--color-accent);
    opacity: .5;
    width: 4rem;
    height: 1px;
    margin: 0 auto 1.1rem;
  }

  .store-badges {
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    margin-top: 1rem;
    display: flex;
  }

  .store-badges a {
    line-height: 0;
    display: block;
  }

  .store-badges img {
    width: auto;
    max-width: none;
    display: block;
  }

  .store-badge-apple {
    height: 48px;
    margin: 12px;
  }

  .store-badge-google {
    height: 72px;
    margin: 1px;
  }
}

@layer utilities {
  @layer daisyui.l1.l2.l3 {
    :where(.btn) {
      width: unset;
    }

    .btn {
      cursor: pointer;
      text-align: center;
      vertical-align: middle;
      outline-offset: 2px;
      webkit-user-select: none;
      -webkit-user-select: none;
      user-select: none;
      padding-inline: var(--btn-p);
      color: var(--btn-fg);
      --tw-prose-links: var(--btn-fg);
      height: var(--size);
      font-size: var(--fontsize, .875rem);
      outline-color: var(--btn-color, var(--color-base-content));
      background-color: var(--btn-bg);
      background-size: auto, calc(var(--noise) * 100%);
      background-image: none, var(--btn-noise);
      border-width: var(--border);
      border-style: solid;
      border-color: var(--btn-border);
      text-shadow: 0 .5px oklch(100% 0 0 / calc(var(--depth) * .15));
      touch-action: manipulation;
      box-shadow: 0 .5px 0 .5px oklch(100% 0 0 / calc(var(--depth) * 6%)) inset, var(--btn-shadow);
      --size: calc(var(--size-field, .25rem) * 10);
      --btn-bg: var(--btn-color, var(--color-base-200));
      --btn-fg: var(--color-base-content);
      --btn-p: 1rem;
      --btn-border: var(--btn-bg);
      border-start-start-radius: var(--join-ss, var(--radius-field));
      border-start-end-radius: var(--join-se, var(--radius-field));
      border-end-end-radius: var(--join-ee, var(--radius-field));
      border-end-start-radius: var(--join-es, var(--radius-field));
      flex-wrap: nowrap;
      flex-shrink: 0;
      justify-content: center;
      align-items: center;
      gap: .375rem;
      font-weight: 600;
      transition-property: color, background-color, border-color, box-shadow;
      transition-duration: .2s;
      transition-timing-function: cubic-bezier(0, 0, .2, 1);
      display: inline-flex;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .btn {
        --btn-border: color-mix(in oklab, var(--btn-bg), #000 calc(var(--depth) * 5%));
      }
    }

    .btn {
      --btn-shadow: 0 3px 2px -2px var(--btn-bg),
      0 4px 3px -2px var(--btn-bg);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .btn {
        --btn-shadow: 0 3px 2px -2px color-mix(in oklab, var(--btn-bg) calc(var(--depth) * 30%), #0000),
      0 4px 3px -2px color-mix(in oklab, var(--btn-bg) calc(var(--depth) * 30%), #0000);
      }
    }

    .btn {
      --btn-noise: var(--fx-noise);
    }

    @media (hover: hover) {
      .btn:hover {
        --btn-bg: var(--btn-color, var(--color-base-200));
      }

      @supports (color: color-mix(in lab, red, red)) {
        .btn:hover {
          --btn-bg: color-mix(in oklab, var(--btn-color, var(--color-base-200)), #000 7%);
        }
      }
    }

    .btn:focus-visible, .btn:has(:focus-visible) {
      isolation: isolate;
      outline-width: 2px;
      outline-style: solid;
    }

    .btn:active:not(.btn-active) {
      --btn-bg: var(--btn-color, var(--color-base-200));
      translate: 0 .5px;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .btn:active:not(.btn-active) {
        --btn-bg: color-mix(in oklab, var(--btn-color, var(--color-base-200)), #000 5%);
      }
    }

    .btn:active:not(.btn-active) {
      --btn-border: var(--btn-color, var(--color-base-200));
    }

    @supports (color: color-mix(in lab, red, red)) {
      .btn:active:not(.btn-active) {
        --btn-border: color-mix(in oklab, var(--btn-color, var(--color-base-200)), #000 7%);
      }
    }

    .btn:active:not(.btn-active) {
      --btn-shadow: 0 0 0 0 oklch(0% 0 0 / 0), 0 0 0 0 oklch(0% 0 0 / 0);
    }

    .btn:is(input[type="checkbox"], input[type="radio"]) {
      appearance: none;
    }

    .btn:is(input[type="checkbox"], input[type="radio"])[aria-label]:after {
      --tw-content: attr(aria-label);
      content: var(--tw-content);
    }

    .btn:where(input:checked:not(.filter .btn)) {
      --btn-color: var(--color-primary);
      --btn-fg: var(--color-primary-content);
      isolation: isolate;
    }

    .btn-primary {
      --btn-color: var(--color-primary);
      --btn-fg: var(--color-primary-content);
    }

    .btn-secondary {
      --btn-color: var(--color-secondary);
      --btn-fg: var(--color-secondary-content);
    }
  }

  .prose :where(a.btn:not(.btn-link)):not(:where([class~="not-prose"], [class~="not-prose"] *)) {
    text-decoration-line: none;
  }

  @layer daisyui.l1.l2 {
    .btn:disabled:not(.btn-link, .btn-ghost) {
      background-color: var(--color-base-content);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .btn:disabled:not(.btn-link, .btn-ghost) {
        background-color: color-mix(in oklab, var(--color-base-content) 10%, transparent);
      }
    }

    .btn:disabled:not(.btn-link, .btn-ghost) {
      box-shadow: none;
    }

    .btn:disabled {
      pointer-events: none;
      --btn-border: #0000;
      --btn-noise: none;
      --btn-fg: var(--color-base-content);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .btn:disabled {
        --btn-fg: color-mix(in oklch, var(--color-base-content) 20%, #0000);
      }
    }

    .btn[disabled]:not(.btn-link, .btn-ghost) {
      background-color: var(--color-base-content);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .btn[disabled]:not(.btn-link, .btn-ghost) {
        background-color: color-mix(in oklab, var(--color-base-content) 10%, transparent);
      }
    }

    .btn[disabled]:not(.btn-link, .btn-ghost) {
      box-shadow: none;
    }

    .btn[disabled] {
      pointer-events: none;
      --btn-border: #0000;
      --btn-noise: none;
      --btn-fg: var(--color-base-content);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .btn[disabled] {
        --btn-fg: color-mix(in oklch, var(--color-base-content) 20%, #0000);
      }
    }
  }

  .collapse {
    visibility: collapse;
  }

  .fixed {
    position: fixed;
  }

  .m-0 {
    margin: calc(var(--spacing) * 0);
  }

  .mx-0 {
    margin-inline: calc(var(--spacing) * 0);
  }

  .mx-auto {
    margin-inline: auto;
  }

  .my-8 {
    margin-block: calc(var(--spacing) * 8);
  }

  .mt-2 {
    margin-top: calc(var(--spacing) * 2);
  }

  .mt-4 {
    margin-top: calc(var(--spacing) * 4);
  }

  .mt-8 {
    margin-top: calc(var(--spacing) * 8);
  }

  .mt-\[\.6rem\] {
    margin-top: .6rem;
  }

  .mr-\[calc\(-1\*var\(--tracking-wordmark\)\)\] {
    margin-right: calc(-1 * var(--tracking-wordmark));
  }

  .mb-0 {
    margin-bottom: calc(var(--spacing) * 0);
  }

  .mb-3 {
    margin-bottom: calc(var(--spacing) * 3);
  }

  .mb-4 {
    margin-bottom: calc(var(--spacing) * 4);
  }

  .mb-\[\.1rem\] {
    margin-bottom: .1rem;
  }

  .mb-\[\.2rem\] {
    margin-bottom: .2rem;
  }

  .mb-\[\.6rem\] {
    margin-bottom: .6rem;
  }

  .mb-\[1\.3rem\] {
    margin-bottom: 1.3rem;
  }

  .mb-\[1\.4rem\] {
    margin-bottom: 1.4rem;
  }

  .mb-\[1\.8rem\] {
    margin-bottom: 1.8rem;
  }

  .mb-\[1\.9rem\] {
    margin-bottom: 1.9rem;
  }

  .block {
    display: block;
  }

  .flex {
    display: flex;
  }

  .inline-flex {
    display: inline-flex;
  }

  .max-w-2xl {
    max-width: var(--container-2xl);
  }

  .max-w-\[28rem\] {
    max-width: 28rem;
  }

  .max-w-\[44rem\] {
    max-width: 44rem;
  }

  .flex-\[1_1_20rem\] {
    flex: 20rem;
  }

  .flex-none {
    flex: none;
  }

  .transform {
    transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
  }

  .flex-wrap {
    flex-wrap: wrap;
  }

  .items-center {
    align-items: center;
  }

  .items-start {
    align-items: flex-start;
  }

  .justify-center {
    justify-content: center;
  }

  .gap-10 {
    gap: calc(var(--spacing) * 10);
  }

  .gap-\[\.4rem\] {
    gap: .4rem;
  }

  .gap-\[\.8rem\] {
    gap: .8rem;
  }

  .border-l-2 {
    border-left-style: var(--tw-border-style);
    border-left-width: 2px;
  }

  .border-l-accent {
    border-left-color: var(--color-accent);
  }

  .fill-\(--mtn-gilt\) {
    fill: var(--mtn-gilt);
  }

  .fill-\(--mtn-gilt-light\) {
    fill: var(--mtn-gilt-light);
  }

  .fill-\(--mtn-gilt-pale\) {
    fill: var(--mtn-gilt-pale);
  }

  .fill-\(--mtn-green\) {
    fill: var(--mtn-green);
  }

  .fill-\(--mtn-seal-cream\) {
    fill: var(--mtn-seal-cream);
  }

  .stroke-\(--mtn-gilt\) {
    stroke: var(--mtn-gilt);
  }

  .stroke-\(--mtn-gilt-light\) {
    stroke: var(--mtn-gilt-light);
  }

  .stroke-\(--mtn-green\) {
    stroke: var(--mtn-green);
  }

  .px-6 {
    padding-inline: calc(var(--spacing) * 6);
  }

  .px-8 {
    padding-inline: calc(var(--spacing) * 8);
  }

  .py-8 {
    padding-block: calc(var(--spacing) * 8);
  }

  .py-\[\.3rem\] {
    padding-block: .3rem;
  }

  .pt-12 {
    padding-top: calc(var(--spacing) * 12);
  }

  .pt-18 {
    padding-top: calc(var(--spacing) * 18);
  }

  .pt-\[2\.6rem\] {
    padding-top: 2.6rem;
  }

  .pr-0 {
    padding-right: calc(var(--spacing) * 0);
  }

  .pb-16 {
    padding-bottom: calc(var(--spacing) * 16);
  }

  .pb-\[2\.4rem\] {
    padding-bottom: 2.4rem;
  }

  .pb-\[3\.2rem\] {
    padding-bottom: 3.2rem;
  }

  .pl-\[1\.6rem\] {
    padding-left: 1.6rem;
  }

  .text-center {
    text-align: center;
  }

  .font-\(family-name\:--font-site-body\) {
    font-family: var(--font-site-body);
  }

  .font-arabic {
    font-family: var(--arabic);
  }

  .font-serif {
    font-family: var(--font-body);
  }

  .\[font-size\:inherit\] {
    font-size: inherit;
  }

  .text-\[1\.5em\] {
    font-size: 1.5em;
  }

  .text-\[3rem\] {
    font-size: 3rem;
  }

  .text-\[19px\] {
    font-size: 19px;
  }

  .text-display {
    font-size: var(--text-display);
  }

  .text-label {
    font-size: var(--text-label);
  }

  .text-quote {
    font-size: var(--text-quote);
  }

  .text-small {
    font-size: var(--text-small);
  }

  .text-title-md {
    font-size: var(--text-title-md);
  }

  .text-title-sm {
    font-size: var(--text-title-sm);
  }

  .leading-\[1\.4\] {
    --tw-leading: 1.4;
    line-height: 1.4;
  }

  .leading-\[1\.7\] {
    --tw-leading: 1.7;
    line-height: 1.7;
  }

  .leading-\[1\.15\] {
    --tw-leading: 1.15;
    line-height: 1.15;
  }

  .leading-none {
    --tw-leading: 1;
    line-height: 1;
  }

  .font-bold {
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }

  .font-medium {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }

  .font-normal {
    --tw-font-weight: var(--font-weight-normal);
    font-weight: var(--font-weight-normal);
  }

  .font-semibold {
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
  }

  .tracking-\[\.16em\] {
    --tw-tracking: .16em;
    letter-spacing: .16em;
  }

  .tracking-\[\.28em\] {
    --tw-tracking: .28em;
    letter-spacing: .28em;
  }

  .tracking-eyebrow {
    --tw-tracking: var(--tracking-eyebrow);
    letter-spacing: var(--tracking-eyebrow);
  }

  .tracking-kicker {
    --tw-tracking: var(--tracking-kicker);
    letter-spacing: var(--tracking-kicker);
  }

  .tracking-wordmark {
    --tw-tracking: var(--tracking-wordmark);
    letter-spacing: var(--tracking-wordmark);
  }

  .text-accent-text {
    color: var(--color-accent-text);
  }

  .text-ink {
    color: var(--color-ink);
  }

  .text-ink-muted {
    color: var(--color-ink-muted);
  }

  .uppercase {
    text-transform: uppercase;
  }

  .italic {
    font-style: italic;
  }

  @layer daisyui.l1 {
    .btn-outline:not(.btn-active, :hover, :active:focus, :focus-visible, input:checked:not(.filter .btn), :disabled, [disabled], .btn-disabled) {
      --btn-shadow: "";
      --btn-bg: #0000;
      --btn-fg: var(--btn-color);
      --btn-border: var(--btn-color);
      --btn-noise: none;
    }

    @media (hover: none) {
      .btn-outline:not(.btn-active, :active, :focus-visible, input:checked:not(.filter .btn)):hover {
        --btn-shadow: "";
        --btn-bg: #0000;
        --btn-fg: var(--btn-color);
        --btn-border: var(--btn-color);
        --btn-noise: none;
      }
    }
  }

  .\[background\:radial-gradient\(120\%_90\%_at_50\%_0\%\,color-mix\(in_srgb\,var\(--color-accent\)_10\%\,transparent\)\,transparent_60\%\)\,var\(--color-surface\)\] {
    background: radial-gradient(120% 90% at 50% 0%,var(--color-accent),transparent 60%),var(--color-surface);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .\[background\:radial-gradient\(120\%_90\%_at_50\%_0\%\,color-mix\(in_srgb\,var\(--color-accent\)_10\%\,transparent\)\,transparent_60\%\)\,var\(--color-surface\)\] {
      background: radial-gradient(120% 90% at 50% 0%,color-mix(in srgb,var(--color-accent) 10%,transparent),transparent 60%),var(--color-surface);
    }
  }

  @media (max-width: 640px) {
    .site-phone\:gap-6 {
      gap: calc(var(--spacing) * 6);
    }

    .site-phone\:px-\[1\.2rem\] {
      padding-inline: 1.2rem;
    }

    .site-phone\:pt-\[2\.2rem\] {
      padding-top: 2.2rem;
    }

    .site-phone\:pb-\[2\.4rem\] {
      padding-bottom: 2.4rem;
    }

    .site-phone\:text-title-md {
      font-size: var(--text-title-md);
    }
  }
}

:root, [data-theme="mutun"] {
  color-scheme: light;
  --color-base-100: var(--color-surface);
  --color-base-200: var(--color-surface-inset);
  --color-base-300: var(--color-line);
  --color-base-content: var(--color-ink);
  --color-primary: var(--mtn-green);
  --color-primary-content: var(--color-on-dark);
  --color-secondary: var(--mtn-gilt-ink);
  --color-secondary-content: var(--color-on-dark);
  --color-accent: var(--mtn-gilt);
  --color-accent-content: var(--color-ink);
  --color-neutral: var(--mtn-green-deep);
  --color-neutral-content: var(--color-muted-on-dark);
  --color-success: var(--answer-correct);
  --color-success-content: var(--color-on-dark);
  --color-error: var(--answer-wrong);
  --color-error-content: var(--color-on-dark);
  --color-info: var(--azure);
  --color-info-content: var(--color-on-dark);
  --color-warning: var(--mtn-link-hover);
  --color-warning-content: var(--color-on-dark);
  --radius-selector: var(--radius);
  --radius-field: var(--radius);
  --radius-box: var(--radius);
  --size-selector: .25rem;
  --size-field: .25rem;
  --border: var(--hairline);
  --depth: 0;
  --noise: 0;
}

:root {
  --arabic: "Bouazzi Maghribi", "Amiri", serif;
}

@font-face {
  font-family: EB Garamond;
  src: url("fonts/EBGaramond-Variable-latin.woff2") format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: EB Garamond;
  src: url("fonts/EBGaramond-Variable-latin-ext.woff2") format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: EB Garamond;
  src: url("fonts/EBGaramond-Italic-Variable-latin.woff2") format("woff2");
  font-weight: 400 700;
  font-style: italic;
  font-display: swap;
  unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: EB Garamond;
  src: url("fonts/EBGaramond-Italic-Variable-latin-ext.woff2") format("woff2");
  font-weight: 400 700;
  font-style: italic;
  font-display: swap;
  unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
  --font-site-body: "EB Garamond", var(--font-body);
  --text-body: 20px;
}

.btn {
  border-radius: var(--radius);
  cursor: pointer;
  height: auto;
  min-height: 44px;
  padding: 15px;
  font-family: inherit;
  font-size: 15px;
  font-weight: 700;
  line-height: normal;
}

.btn:hover:not(:disabled, [aria-disabled="true"]), .btn:focus-visible:not(:disabled, [aria-disabled="true"]) {
  --btn-bg: var(--btn-color, var(--color-surface-inset));
  filter: brightness(1.08);
  border-color: var(--color-ink);
}

.btn.btn-primary:hover:not(:disabled, [aria-disabled="true"]), .btn.btn-primary:focus-visible:not(:disabled, [aria-disabled="true"]) {
  background-color: var(--mtn-green-deep);
  border-color: var(--color-accent);
  filter: none;
}

.btn:focus-visible {
  outline: 2px solid var(--color-ink);
  outline-offset: 2px;
}

.btn:disabled, .btn[disabled], .btn[aria-disabled="true"] {
  opacity: .5;
  cursor: default;
  filter: none;
  box-shadow: none;
  background-color: var(--btn-color, var(--color-surface-inset));
  color: var(--color-on-dark);
  border-color: var(--btn-color, var(--color-surface-inset));
}

.btn.btn-outline.btn-secondary {
  color: var(--color-ink);
  border-color: var(--mtn-gilt-ink);
  background: none;
}

.btn.btn-outline.btn-secondary:hover:not(:disabled, [aria-disabled="true"]), .btn.btn-outline.btn-secondary:focus-visible:not(:disabled, [aria-disabled="true"]) {
  background: var(--color-accent-soft);
  color: var(--color-ink);
  border-color: var(--color-ink);
  filter: none;
}

.btn.site-cta {
  font-size: var(--text-button);
  letter-spacing: .12em;
  text-transform: uppercase;
  padding: .72rem 1.5rem;
  font-weight: 600;
  line-height: 1.4;
}

@property --tw-rotate-x {
  syntax: "*";
  inherits: false
}

@property --tw-rotate-y {
  syntax: "*";
  inherits: false
}

@property --tw-rotate-z {
  syntax: "*";
  inherits: false
}

@property --tw-skew-x {
  syntax: "*";
  inherits: false
}

@property --tw-skew-y {
  syntax: "*";
  inherits: false
}

@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}

@property --tw-leading {
  syntax: "*";
  inherits: false
}

@property --tw-font-weight {
  syntax: "*";
  inherits: false
}

@property --tw-tracking {
  syntax: "*";
  inherits: false
}