@font-face {
  font-family: "Vazirmatn Variable";
  src: url("/fonts/vazirmatn-arabic.woff2") format("woff2-variations");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC;
}
@font-face {
  font-family: "Vazirmatn Variable";
  src: url("/fonts/vazirmatn-latin.woff2") format("woff2-variations");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
:root {
  color-scheme: light;
  --ink: #211c19;
  --muted: #766a63;
  --orange: #ed6d1c;
  --orange-deep: #d7570e;
  --green: #31805c;
  font-family: "Vazirmatn Variable", Vazirmatn, Tahoma, Arial, sans-serif;
  font-synthesis: none;
}
* { box-sizing: border-box; }
html, body { min-height: 100%; }
body {
  margin: 0;
  background: #ddd4cd;
  color: var(--ink);
  font-weight: 450;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
button, input { font: inherit; }
button:disabled { cursor: wait; opacity: .72; }
.landing {
  position: relative;
  isolation: isolate;
  min-height: 100svh;
  overflow: hidden;
  padding: clamp(.8rem, 2vw, 1.4rem);
}
.hero-video, .wash, .grain {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.hero-video {
  z-index: -5;
  object-fit: cover;
  object-position: center;
  filter: saturate(.72) contrast(.94) brightness(.94);
  transition: filter 1s ease;
}
.wash {
  z-index: -4;
  background:
    radial-gradient(circle at 68% 46%, rgba(248, 243, 237, .64) 0, rgba(248, 243, 237, .38) 32%, rgba(238, 230, 223, .08) 68%),
    linear-gradient(120deg, rgba(31, 24, 21, .13), rgba(255, 255, 255, .04) 48%, rgba(244, 238, 232, .16));
  transition: opacity .9s ease;
}
.grain {
  z-index: -3;
  opacity: .1;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.88' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.18'/%3E%3C/svg%3E");
  mix-blend-mode: multiply;
  transition: opacity .9s ease;
}
.site-shell {
  position: relative;
  width: min(90rem, 100%);
  min-height: calc(100svh - clamp(1.6rem, 4vw, 2.8rem));
  margin: 0 auto;
  padding: clamp(1.25rem, 3vw, 2.2rem);
  display: grid;
  grid-template-rows: auto 1fr auto;
  border: 1px solid rgba(255, 255, 255, .66);
  border-radius: clamp(1.5rem, 3vw, 2.4rem);
  background: rgba(250, 247, 243, .06);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .36), 0 1.5rem 5rem rgba(52, 37, 29, .1);
  transition: opacity .85s ease, transform .85s cubic-bezier(.2, .8, .2, 1), visibility 0s linear .85s;
}
.landing.is-revealed .site-shell { visibility: hidden; opacity: 0; transform: scale(.985); pointer-events: none; }
.landing.is-revealed .wash,
.landing.is-revealed .grain { opacity: 0; }
.landing.is-revealed .hero-video { filter: none; }
.site-header, .site-footer { display: flex; align-items: center; justify-content: space-between; }
.site-header { position: relative; z-index: 20; }
.brand {
  display: inline-flex;
  align-items: center;
  gap: .65rem;
  color: var(--ink);
  font-size: 1rem;
  font-weight: 780;
  text-decoration: none;
}
.brand-mark {
  width: .82rem;
  height: .82rem;
  border-radius: 72% 28% 66% 34%;
  background: var(--orange);
  box-shadow: 0 0 0 5px rgba(237, 109, 28, .12);
  transform: rotate(45deg);
}
.academy-links { position: relative; }
.academy-links summary {
  display: inline-flex;
  align-items: center;
  gap: .58rem;
  padding: .38rem .46rem .38rem .62rem;
  border: 1px solid rgba(255, 255, 255, .46);
  border-radius: 999px;
  background: rgba(249, 245, 240, .32);
  color: rgba(33, 28, 25, .72);
  cursor: pointer;
  list-style: none;
  font-size: .7rem;
  font-weight: 640;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition: background .2s ease, border-color .2s ease, color .2s ease;
}
.academy-links summary::-webkit-details-marker { display: none; }
.academy-links summary:hover,
.academy-links summary:focus-visible,
.academy-links[open] summary {
  border-color: rgba(237, 109, 28, .24);
  background: rgba(249, 245, 240, .76);
  color: var(--ink);
  outline: none;
}
.academy-emblem {
  width: 1.85rem;
  height: 1.85rem;
  display: grid;
  place-items: center;
  overflow: hidden;
  padding: .16rem;
  border-radius: .62rem;
  background: #fff;
  box-shadow: 0 .35rem .9rem rgba(33, 28, 25, .14);
}
.academy-emblem img { width: 100%; height: 100%; display: block; object-fit: contain; }
.academy-emblem--large { width: 2.75rem; height: 2.75rem; flex: 0 0 2.75rem; padding: .22rem; border-radius: .86rem; }
.academy-summary-copy { display: grid; gap: 0; text-align: right; line-height: 1.2; }
.academy-summary-copy small { color: #91847d; font-size: .5rem; font-weight: 580; }
.academy-summary-copy strong { font-size: .67rem; font-weight: 750; }
.academy-links summary > i {
  width: 1.3rem;
  height: 1.3rem;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(237, 109, 28, .08);
  color: var(--orange-deep);
  font-size: .85rem;
  font-style: normal;
  transition: transform .25s ease, background .25s ease;
}
.academy-links[open] summary > i { background: rgba(237, 109, 28, .14); transform: rotate(45deg); }
.academy-popover {
  position: absolute;
  top: calc(100% + .65rem);
  left: 0;
  width: min(31rem, calc(100vw - 3.5rem));
  padding: .9rem;
  border: 1px solid rgba(255, 255, 255, .78);
  border-radius: 1.4rem;
  background: rgba(249, 245, 240, .92);
  box-shadow: 0 1.4rem 4rem rgba(48, 33, 25, .2), inset 0 1px 0 #fff;
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  animation: popover-in .18s ease-out both;
}
.popover-heading {
  display: flex;
  align-items: center;
  gap: .72rem;
  margin-bottom: .7rem;
  padding: .28rem .3rem .85rem;
  border-bottom: 1px solid rgba(70, 52, 42, .08);
}
.popover-heading > span:last-child { display: grid; gap: .08rem; }
.popover-heading small { display: block; color: #8d7f77; font-size: .55rem; font-weight: 620; }
.popover-heading strong { color: #342c28; font-size: .9rem; font-weight: 790; }
.popover-heading em { color: #9a8c84; font-size: .52rem; font-style: normal; font-weight: 520; }
.academy-popover nav { display: block; }
.platform-group-title {
  margin: .25rem .35rem .4rem;
  color: #94867e;
  font-size: .57rem;
  font-weight: 680;
}
.platform-group-title:not(:first-child) { margin-top: .75rem; }
.platform-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
.academy-popover a {
  position: relative;
  min-height: 6rem;
  display: flex;
  align-items: center;
  gap: .72rem;
  overflow: hidden;
  padding: .6rem;
  border: 1px solid rgba(61, 47, 40, .08);
  border-radius: 1rem;
  background: rgba(255, 255, 255, .52);
  color: #514640;
  font-size: .65rem;
  font-weight: 610;
  text-decoration: none;
  transition: border-color .18s ease, background .18s ease, color .18s ease, transform .18s ease;
}
.academy-popover a:hover,
.academy-popover a:focus-visible {
  border-color: rgba(237, 109, 28, .24);
  background: #fff;
  color: var(--orange-deep);
  outline: none;
  transform: translateY(-2px);
}
.platform-mark {
  flex: 0 0 4.55rem;
  width: 4.55rem;
  height: 4.55rem;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(237, 109, 28, .18);
  border-radius: .88rem;
  background: #211813;
  box-shadow: 0 .55rem 1.2rem rgba(41, 27, 20, .14);
  transition: transform .22s cubic-bezier(.2, .8, .2, 1), box-shadow .22s ease;
}
.platform-mark img { width: 100%; height: 100%; display: block; object-fit: cover; }
.academy-popover a:hover .platform-mark { box-shadow: 0 .8rem 1.5rem rgba(41, 27, 20, .2); transform: rotate(-2deg) scale(1.035); }
.academy-popover a span { min-width: 0; flex: 1; display: grid; gap: .08rem; }
.academy-popover a strong { color: #433a35; font-size: .66rem; font-weight: 720; }
.academy-popover a small { direction: ltr; overflow: hidden; color: #94877f; font-size: .5rem; font-weight: 520; text-overflow: ellipsis; white-space: nowrap; }
.academy-popover a i { direction: ltr; color: #a2958d; font-size: .76rem; font-style: normal; transition: color .18s ease, transform .18s ease; }
.academy-popover a:hover i { color: var(--orange); transform: translate(2px, -2px); }
.support-link {
  min-height: 3.7rem !important;
  margin-top: .65rem;
  border-color: rgba(237, 109, 28, .16) !important;
  background: rgba(237, 109, 28, .07) !important;
}
.support-link > span { direction: rtl; }
.support-link strong { color: var(--orange-deep) !important; font-size: .78rem !important; letter-spacing: .04em; }
.support-link > i { width: 2rem; height: 2rem; display: grid; place-items: center; border-radius: .65rem; background: var(--orange); color: #fff !important; font-size: .72rem !important; }
.hero-card {
  position: relative;
  align-self: center;
  justify-self: center;
  width: min(62rem, 94%);
  display: grid;
  grid-template-columns: .92fr 1.08fr;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .76);
  border-radius: 2rem;
  background: rgba(249, 245, 240, .68);
  box-shadow: 0 2.2rem 6rem rgba(64, 43, 31, .14), inset 0 1px 0 rgba(255, 255, 255, .68);
  backdrop-filter: blur(16px) saturate(1.06);
  -webkit-backdrop-filter: blur(16px) saturate(1.06);
}
.hero-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 3px;
  background: linear-gradient(90deg, transparent 12%, var(--orange) 52%, transparent 88%);
  opacity: .72;
}
.hero-copy, .waitlist { min-width: 0; padding: clamp(2rem, 5vw, 4.5rem); }
.hero-copy { display: flex; flex-direction: column; justify-content: center; }
.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: .48rem;
  margin: 0 0 1.15rem;
  color: var(--orange-deep);
  font-size: .72rem;
  font-weight: 730;
}
.eyebrow span { width: 1.4rem; height: 1px; background: currentColor; }
h1 {
  margin: 0;
  font-size: clamp(2.65rem, 5.5vw, 4.65rem);
  line-height: 1.15;
  font-weight: 720;
  letter-spacing: -.025em;
  text-wrap: balance;
}
h1 em { color: var(--orange); font-style: normal; font-weight: 850; }
.lead { margin: 1.15rem 0 0; color: var(--muted); font-size: .98rem; font-weight: 490; }
.waitlist {
  position: relative;
  align-self: stretch;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-inline-start: 1px solid rgba(68, 52, 44, .1);
  background: rgba(255, 255, 255, .08);
}
.entry-fields { width: 100%; }
.field-label { display: block; margin-bottom: .7rem; color: #4f4540; font-size: .76rem; font-weight: 680; }
.phone-entry {
  position: relative;
  direction: ltr;
  width: 100%;
  padding: .58rem;
  border: 1px solid rgba(69, 53, 45, .12);
  border-radius: 1.15rem;
  background: rgba(255, 255, 255, .5);
  box-shadow: 0 .8rem 2rem rgba(65, 44, 33, .06), inset 0 1px 0 rgba(255, 255, 255, .72);
  cursor: text;
  transition: border-color .25s ease, box-shadow .25s ease, background .25s ease;
}
.phone-entry.is-focused { border-color: rgba(237, 109, 28, .32); background: rgba(255, 255, 255, .66); box-shadow: 0 0 0 4px rgba(237, 109, 28, .07), 0 1rem 2.5rem rgba(65, 44, 33, .08); }
.phone-digits { direction: ltr; display: grid; grid-template-columns: repeat(11, minmax(0, 1fr)); gap: .28rem; }
.phone-digits span {
  height: 3.1rem;
  display: grid;
  place-items: center;
  border: 1px solid rgba(79, 65, 58, .12);
  border-radius: .62rem;
  background: rgba(116, 103, 96, .08);
  color: #655952;
  font-size: .92rem;
  font-weight: 720;
  font-variant-numeric: tabular-nums;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .38);
  transition: color .22s ease, background .22s ease, border-color .22s ease, box-shadow .22s ease, transform .22s cubic-bezier(.2, .9, .2, 1.35);
}
.phone-digits span.is-active { border-color: rgba(237, 109, 28, .28); background: rgba(255, 255, 255, .45); }
.phone-entry.is-focused .phone-digits span.is-active { box-shadow: 0 0 0 3px rgba(237, 109, 28, .08); animation: active-digit 1.4s ease-in-out infinite; }
.phone-digits span.is-filled {
  border-color: rgba(218, 157, 35, .5);
  background: rgba(242, 183, 55, .2);
  color: #805b11;
  box-shadow: 0 0 0 2px rgba(218, 157, 35, .06), inset 0 1px 0 rgba(255, 255, 255, .58);
  transform: translateY(-2px);
  animation: digit-in .24s cubic-bezier(.2, .9, .2, 1.4) both;
}
.phone-entry.is-complete .phone-digits span.is-filled,
.phone-entry.is-saving .phone-digits span.is-filled { border-color: rgba(49, 128, 92, .42); background: rgba(49, 128, 92, .14); color: #246b4b; box-shadow: 0 0 0 2px rgba(49, 128, 92, .06), 0 0 1rem rgba(49, 128, 92, .08); }
.phone-entry.is-invalid .phone-digits span:first-child,
.phone-entry.is-invalid .phone-digits span:nth-child(2) { border-color: rgba(190, 66, 46, .45); background: rgba(190, 66, 46, .09); color: #9a3b2c; }
.phone-input {
  position: absolute;
  z-index: 3;
  inset: 0;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: transparent;
  caret-color: transparent;
  cursor: text;
  opacity: .01;
}
.form-note, .form-status { min-height: 1.25rem; margin: .65rem .2rem 0; font-size: .66rem; line-height: 1.7; }
.form-note { display: flex; align-items: center; gap: .4rem; color: #81746d; }
.form-note span { width: .36rem; height: .36rem; border-radius: 50%; background: var(--orange); box-shadow: 0 0 0 4px rgba(237, 109, 28, .08); }
.form-status { margin-top: .05rem; color: var(--orange-deep); font-weight: 650; }
.success-message {
  position: absolute;
  z-index: 30;
  left: 50%;
  bottom: max(1.5rem, env(safe-area-inset-bottom));
  width: min(34rem, calc(100% - 2rem));
  display: flex;
  align-items: center;
  gap: .95rem;
  padding: .9rem 1rem;
  border: 1px solid rgba(255, 255, 255, .62);
  border-radius: 1.25rem;
  background: rgba(248, 244, 239, .82);
  box-shadow: 0 1.25rem 3.5rem rgba(40, 28, 22, .18), inset 0 1px 0 rgba(255, 255, 255, .72);
  text-align: right;
  backdrop-filter: blur(18px) saturate(1.08);
  -webkit-backdrop-filter: blur(18px) saturate(1.08);
  animation: success-in .55s cubic-bezier(.2, .85, .2, 1) both;
  transition: opacity .55s ease, transform .55s ease;
}
.success-message[hidden] { display: none !important; }
.success-message.is-leaving { opacity: 0; transform: translate(-50%, 16px); pointer-events: none; }
.success-message > span:last-child { display: grid; gap: .06rem; }
.success-message small { color: var(--green); font-size: .58rem; font-weight: 720; }
.success-message strong { font-size: clamp(.92rem, 2vw, 1.08rem); line-height: 1.55; font-weight: 810; text-wrap: balance; }
.success-message p { margin: 0; color: var(--orange-deep); font-size: .72rem; font-weight: 720; }
.success-orbit {
  position: relative;
  flex: 0 0 2.75rem;
  width: 2.75rem;
  height: 2.75rem;
  border: 1px solid rgba(49, 128, 92, .22);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(49, 128, 92, .2) 0 16%, rgba(49, 128, 92, .05) 17% 100%);
  box-shadow: 0 0 0 8px rgba(49, 128, 92, .04), 0 0 2rem rgba(49, 128, 92, .12);
}
.success-orbit::before, .success-orbit::after { content: ""; position: absolute; inset: 50% auto auto 50%; border-radius: 50%; transform: translate(-50%, -50%); }
.success-orbit::before { width: .65rem; height: .65rem; background: var(--green); box-shadow: 0 0 1rem rgba(49, 128, 92, .5); }
.success-orbit::after { width: 1.8rem; height: 1.8rem; border: 1px dashed rgba(49, 128, 92, .28); animation: orbit-spin 4s linear infinite; }
.success-orbit i { position: absolute; z-index: 2; top: .34rem; left: 50%; width: .34rem; height: .34rem; border-radius: 50%; background: var(--orange); box-shadow: 0 0 .7rem rgba(237, 109, 28, .6); transform: translateX(-50%); }
.site-footer { direction: ltr; justify-content: flex-start; gap: .55rem; color: rgba(33, 28, 25, .56); font-size: .62rem; font-weight: 650; letter-spacing: .08em; }
.site-footer i { width: 1.6rem; height: 1px; background: rgba(33, 28, 25, .28); }
.site-footer a { margin-left: auto; color: inherit; font-weight: 760; letter-spacing: 0; text-decoration: none; }
.honeypot { position: absolute !important; inset-inline-start: -10000px !important; width: 1px !important; height: 1px !important; opacity: 0 !important; }
@keyframes popover-in {
  from { opacity: 0; transform: translateY(-5px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes active-digit {
  50% { border-color: rgba(237, 109, 28, .55); box-shadow: 0 0 0 4px rgba(237, 109, 28, .1); }
}
@keyframes digit-in {
  from { opacity: .4; transform: translateY(2px) scale(.86); }
  to { opacity: 1; transform: translateY(-2px) scale(1); }
}
@keyframes success-in {
  from { opacity: 0; transform: translate(-50%, 12px) scale(.96); }
  to { opacity: 1; transform: translate(-50%, 0) scale(1); }
}
@keyframes orbit-spin { to { transform: translate(-50%, -50%) rotate(360deg); } }
@media (max-width: 820px) {
  .hero-card { width: min(35rem, 100%); grid-template-columns: 1fr; }
  .hero-copy, .waitlist { padding: clamp(1.6rem, 7vw, 2.5rem); }
  .hero-copy { padding-bottom: 1.35rem; }
  .waitlist { padding-top: 1.35rem; border-inline-start: 0; border-top: 1px solid rgba(68, 52, 44, .1); }
  h1 { font-size: clamp(2.4rem, 10vw, 3.5rem); }
}
@media (max-width: 520px) {
  .landing { padding: .55rem; }
  .site-shell { min-height: calc(100svh - 1.1rem); padding: 1rem; border-radius: 1.35rem; }
  .academy-links summary { padding: .5rem .62rem; font-size: .63rem; }
  .academy-popover { left: -.25rem; max-height: calc(100svh - 5rem); overflow-y: auto; }
  .platform-grid { grid-template-columns: 1fr; }
  .academy-popover a { min-height: 4.8rem; }
  .platform-mark { flex-basis: 3.65rem; width: 3.65rem; height: 3.65rem; border-radius: .75rem; }
  .hero-card { border-radius: 1.5rem; }
  .hero-copy, .waitlist { padding-inline: 1.2rem; }
  .phone-entry { padding: .42rem; border-radius: .95rem; }
  .phone-digits { gap: .16rem; }
  .phone-digits span { height: 2.55rem; border-radius: .48rem; font-size: .78rem; }
}
@media (max-width: 370px) {
  .phone-digits { gap: .1rem; }
  .phone-digits span { height: 2.25rem; border-radius: .4rem; font-size: .7rem; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}
