@font-face{font-family:"IBM Plex Sans";src:url("../fonts/IBMPlexSans-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Sans";src:url("../fonts/IBMPlexSans-500.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Sans";src:url("../fonts/IBMPlexSans-600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url("../fonts/IBMPlexMono-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url("../fonts/IBMPlexMono-500.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Chakra Petch";src:url("../fonts/chakra-petch-latin-400-normal.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Chakra Petch";src:url("../fonts/chakra-petch-latin-500-normal.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Chakra Petch";src:url("../fonts/chakra-petch-latin-600-normal.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Chakra Petch";src:url("../fonts/chakra-petch-latin-700-normal.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Kufam";src:url("../fonts/kufam-arabic-400-normal.woff2") format("woff2");font-weight:400;font-style:normal;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,U+102E0-102FB,U+10E60-10E7E,U+10EC2-10EC4,U+10EFC-10EFF,U+1EE00-1EE03,U+1EE05-1EE1F,U+1EE21-1EE22,U+1EE24,U+1EE27,U+1EE29-1EE32,U+1EE34-1EE37,U+1EE39,U+1EE3B,U+1EE42,U+1EE47,U+1EE49,U+1EE4B,U+1EE4D-1EE4F,U+1EE51-1EE52,U+1EE54,U+1EE57,U+1EE59,U+1EE5B,U+1EE5D,U+1EE5F,U+1EE61-1EE62,U+1EE64,U+1EE67-1EE6A,U+1EE6C-1EE72,U+1EE74-1EE77,U+1EE79-1EE7C,U+1EE7E,U+1EE80-1EE89,U+1EE8B-1EE9B,U+1EEA1-1EEA3,U+1EEA5-1EEA9,U+1EEAB-1EEBB,U+1EEF0-1EEF1}
@font-face{font-family:"Kufam";src:url("../fonts/kufam-arabic-500-normal.woff2") format("woff2");font-weight:500;font-style:normal;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,U+102E0-102FB,U+10E60-10E7E,U+10EC2-10EC4,U+10EFC-10EFF,U+1EE00-1EE03,U+1EE05-1EE1F,U+1EE21-1EE22,U+1EE24,U+1EE27,U+1EE29-1EE32,U+1EE34-1EE37,U+1EE39,U+1EE3B,U+1EE42,U+1EE47,U+1EE49,U+1EE4B,U+1EE4D-1EE4F,U+1EE51-1EE52,U+1EE54,U+1EE57,U+1EE59,U+1EE5B,U+1EE5D,U+1EE5F,U+1EE61-1EE62,U+1EE64,U+1EE67-1EE6A,U+1EE6C-1EE72,U+1EE74-1EE77,U+1EE79-1EE7C,U+1EE7E,U+1EE80-1EE89,U+1EE8B-1EE9B,U+1EEA1-1EEA3,U+1EEA5-1EEA9,U+1EEAB-1EEBB,U+1EEF0-1EEF1}
@font-face{font-family:"Kufam";src:url("../fonts/kufam-arabic-600-normal.woff2") format("woff2");font-weight:600;font-style:normal;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,U+102E0-102FB,U+10E60-10E7E,U+10EC2-10EC4,U+10EFC-10EFF,U+1EE00-1EE03,U+1EE05-1EE1F,U+1EE21-1EE22,U+1EE24,U+1EE27,U+1EE29-1EE32,U+1EE34-1EE37,U+1EE39,U+1EE3B,U+1EE42,U+1EE47,U+1EE49,U+1EE4B,U+1EE4D-1EE4F,U+1EE51-1EE52,U+1EE54,U+1EE57,U+1EE59,U+1EE5B,U+1EE5D,U+1EE5F,U+1EE61-1EE62,U+1EE64,U+1EE67-1EE6A,U+1EE6C-1EE72,U+1EE74-1EE77,U+1EE79-1EE7C,U+1EE7E,U+1EE80-1EE89,U+1EE8B-1EE9B,U+1EEA1-1EEA3,U+1EEA5-1EEA9,U+1EEAB-1EEBB,U+1EEF0-1EEF1}
@font-face{font-family:"Kufam";src:url("../fonts/kufam-arabic-700-normal.woff2") format("woff2");font-weight:700;font-style:normal;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,U+102E0-102FB,U+10E60-10E7E,U+10EC2-10EC4,U+10EFC-10EFF,U+1EE00-1EE03,U+1EE05-1EE1F,U+1EE21-1EE22,U+1EE24,U+1EE27,U+1EE29-1EE32,U+1EE34-1EE37,U+1EE39,U+1EE3B,U+1EE42,U+1EE47,U+1EE49,U+1EE4B,U+1EE4D-1EE4F,U+1EE51-1EE52,U+1EE54,U+1EE57,U+1EE59,U+1EE5B,U+1EE5D,U+1EE5F,U+1EE61-1EE62,U+1EE64,U+1EE67-1EE6A,U+1EE6C-1EE72,U+1EE74-1EE77,U+1EE79-1EE7C,U+1EE7E,U+1EE80-1EE89,U+1EE8B-1EE9B,U+1EEA1-1EEA3,U+1EEA5-1EEA9,U+1EEAB-1EEBB,U+1EEF0-1EEF1}
@font-face{font-family:"IBM Plex Sans Arabic";src:url("../fonts/IBMPlexSansArabic-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Sans Arabic";src:url("../fonts/IBMPlexSansArabic-600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Sans Arabic";src:url("../fonts/IBMPlexSansArabic-700.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}

:root{
  --brand-navy:#0a0a3c; --brand-indigo:#3a4a93; --brand-indigo-light:#526abe;
  --brand-cream:#fff5c3; --brand-cyan:#0ff0fc;
  --surface-base:#0a0a3c; --surface-raised:rgba(16,18,74,.78); --surface-overlay:rgba(30,38,104,.82);
  --surface-cream:#fff5c3; --surface-indigo:#3a4a93;
  --ink-primary:#f4f1e4; --ink-secondary:#fff5c3; --ink-muted:#b8bfe0;
  --ink-on-cream:#0a0a3c; --ink-on-indigo:#fff5c3;
  --line-subtle:rgba(82,106,190,.32); --line-strong:#526abe;
  --action-fill:#fff5c3; --action-ink:#0a0a3c; --action-fill-hover:#f2e6a8;
  --link:#0ff0fc; --link-hover:#9df7ff; --focus-ring:#0ff0fc;
  --status-success:#4ad9a4; --status-warning:#ffc857; --status-danger:#ff8a94;

  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:24px;
  --space-6:32px; --space-7:48px; --space-8:64px; --space-9:96px; --space-10:128px;

  --radius-xs:4px; --radius-sm:6px; --radius-md:10px; --radius-lg:16px;
  --radius-xl:24px; --radius-tile:28px; --radius-pill:999px;

  --shadow-sm:0 1px 2px rgba(4,6,22,.7);
  --shadow-md:0 8px 24px rgba(4,6,22,.8);
  --shadow-focus:0 0 0 4px rgba(15,240,252,.3);

  --font-sans:"IBM Plex Sans",system-ui,sans-serif;
  --font-mono:"IBM Plex Mono",ui-monospace,monospace;
  --font-display:"Chakra Petch","IBM Plex Sans",system-ui,sans-serif;
  --font-arabic:"IBM Plex Sans Arabic","IBM Plex Sans",sans-serif;
  --font-kufi:"Kufam","Chakra Petch",sans-serif;

  --wrap:1160px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}}
body{margin:0;background:var(--surface-base);color:var(--ink-primary);
  font-family:var(--font-sans);font-size:16px;line-height:1.7;
  -webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--link);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--link-hover)}
h1,h2,h3,h4{margin:0;font-weight:600;line-height:1.2;letter-spacing:-.015em}
p{margin:0}
ul{margin:0;padding:0;list-style:none}
:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;box-shadow:var(--shadow-focus);border-radius:var(--radius-xs)}

.eyebrow{font-family:var(--font-mono);font-size:12px;line-height:16px;font-weight:500;
  letter-spacing:.14em;text-transform:uppercase;color:var(--ink-muted);margin:0 0 var(--space-4)}
.eyebrow--link{color:var(--link)}
h1.eyebrow--h1{font-family:var(--font-mono);font-size:12px;line-height:16px;font-weight:500;
  letter-spacing:.14em;text-transform:uppercase;color:var(--ink-muted);margin:0}
html[lang="ar"] h1.eyebrow--h1{font-family:var(--font-arabic);letter-spacing:0;
  text-transform:none;font-weight:600;font-size:13px}
.display-xl{font-size:clamp(38px,6.4vw,64px);line-height:1.04;letter-spacing:-.03em}
.display-lg{font-size:clamp(30px,4.6vw,48px);line-height:1.08;letter-spacing:-.022em}
.h2{font-size:clamp(24px,3vw,28px);line-height:1.25;letter-spacing:-.01em}
.h3{font-size:20px;line-height:28px}
.lede{font-size:clamp(17px,2vw,18px);line-height:1.7;color:var(--ink-secondary)}
.muted{color:var(--ink-muted)}
.small{font-size:14px;line-height:22px;color:var(--ink-secondary)}
.caption{font-size:13px;line-height:20px;color:var(--ink-muted)}
.mono{font-family:var(--font-mono)}

.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--space-4)}
@media (min-width:720px){.wrap{padding-inline:var(--space-6)}}
.section{padding-block:var(--space-9)}
@media (min-width:900px){.section{padding-block:var(--space-10)}}
.section--tight{padding-block:var(--space-8)}
.section--flush{padding-block-end:var(--space-6)}
.rule{border:0;border-top:1px solid var(--line-subtle);margin:0}
.stack>*+*{margin-block-start:var(--space-4)}
.skip{position:absolute;inset-inline-start:-9999px}
.skip:focus{position:fixed;inset-block-start:var(--space-3);inset-inline-start:var(--space-3);
  inset-inline-end:auto;z-index:50;background:var(--action-fill);color:var(--action-ink);
  padding:var(--space-3) var(--space-5);border-radius:var(--radius-md)}

.site-header{position:sticky;inset-block-start:0;z-index:40;background:rgba(10,10,60,.82);
  backdrop-filter:blur(10px);border-block-end:1px solid var(--line-subtle)}
.site-header__in{display:flex;align-items:center;gap:var(--space-5);
  min-height:68px;justify-content:space-between}
.brand{display:flex;align-items:center;gap:var(--space-3);text-decoration:none;color:var(--ink-primary)}
.brand img{width:36px;height:36px;border-radius:var(--radius-md)}
.brand span{font-weight:600;font-size:16px;letter-spacing:-.01em;white-space:nowrap}
.nav{display:flex;align-items:center;gap:var(--space-5)}
.nav a{font-family:var(--font-mono);font-size:13px;letter-spacing:.02em;
  color:var(--ink-secondary);text-decoration:none}
.nav a:hover,.nav a[aria-current="page"]{color:var(--ink-primary)}
.nav a[aria-current="page"]{text-decoration:underline;text-underline-offset:6px;
  text-decoration-color:var(--link)}
.nav__lang{border-inline-start:1px solid var(--line-subtle);padding-inline-start:var(--space-5)}
@media (max-width:719px){
  .site-header__in{flex-wrap:wrap;gap:var(--space-3);padding-block:var(--space-3);min-height:0}
  .nav{width:100%;gap:var(--space-4);flex-wrap:wrap;font-size:13px}
  .nav__lang{border:0;padding-inline-start:0;margin-inline-start:auto}
  .brand span{font-size:15px}
}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);
  font-family:var(--font-mono);font-size:13px;line-height:18px;font-weight:500;letter-spacing:.02em;
  padding:var(--space-3) var(--space-5);border-radius:var(--radius-md);
  border:1px solid transparent;cursor:pointer;text-decoration:none;background:none;
  transition:background-color .15s ease,color .15s ease}
.btn--primary{background:var(--action-fill);color:var(--action-ink)}
.btn--primary:hover{background:var(--action-fill-hover);color:var(--action-ink)}
.btn--secondary{border-color:var(--line-strong);color:var(--ink-primary)}
.btn--secondary:hover{background:var(--surface-overlay);color:var(--ink-primary)}
.btn--block{width:100%}
.btn-row{display:flex;flex-wrap:wrap;gap:var(--space-4)}

.hero{padding-block:var(--space-9) var(--space-9);position:relative;overflow:hidden}
@media (min-width:900px){.hero{padding-block:var(--space-10) var(--space-10)}}
.hero__in{display:grid;gap:var(--space-8);align-items:center}
@media (min-width:980px){.hero__in{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}}
.hero h1{margin-block-end:var(--space-5);max-width:16ch}
.hero .lede{max-width:52ch;margin-block-end:var(--space-6)}
.hero__art{display:none}
@media (min-width:980px){.hero__art{display:block}}
.hero__art svg{width:100%;height:auto;display:block}

.grid{display:grid;gap:var(--space-5)}
@media (min-width:700px){.grid--3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1000px){.grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}}
.card{background:var(--surface-raised);border:1px solid var(--line-subtle);
  border-radius:var(--radius-lg);padding:var(--space-6)}
.card h3{margin-block-end:var(--space-3)}
.card p{color:var(--ink-secondary)}
.card__tag{font-family:var(--font-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--link);display:block;margin-block-end:var(--space-4)}
.card__list{margin-block-start:var(--space-5)}
.card__list li{font-size:14px;line-height:22px;color:var(--ink-secondary);
  padding-block:var(--space-3);border-block-start:1px solid var(--line-subtle)}

.steps{counter-reset:s;display:grid;gap:var(--space-5)}
@media (min-width:760px){.steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1060px){.steps{grid-template-columns:repeat(4,minmax(0,1fr))}}
.step{counter-increment:s;padding-block-start:var(--space-5);border-block-start:2px solid var(--brand-indigo)}
.step::before{content:counter(s,decimal-leading-zero);display:block;font-family:var(--font-mono);
  font-size:12px;letter-spacing:.14em;color:var(--link);margin-block-end:var(--space-3)}
.step h3{font-size:17px;line-height:24px;margin-block-end:var(--space-2)}
.step p{font-size:14px;line-height:22px;color:var(--ink-secondary)}

.tiers{display:flex;flex-wrap:wrap;gap:var(--space-5);justify-content:center}
.tier{background:var(--surface-raised);border:1px solid var(--line-subtle);
  border-radius:var(--radius-lg);padding:var(--space-6);
  flex:1 1 280px;max-width:360px;display:flex;flex-direction:column}
@media (min-width:1000px){.tier{flex:0 1 340px;max-width:340px}}
.tier--rec{background:var(--surface-cream);border-color:var(--brand-cream);color:var(--ink-on-cream)}
.tier__flag{font-family:var(--font-mono);font-size:12px;line-height:16px;font-weight:500;
  letter-spacing:.14em;text-transform:uppercase;color:var(--ink-muted);margin-block-end:var(--space-3)}
.tier--rec .tier__flag{color:var(--ink-on-cream);opacity:.72}
.tier h3{margin-block-end:var(--space-4)}
.tier--rec h3{color:var(--ink-on-cream)}
.tier__amount{font-size:44px;line-height:1.05;font-weight:600;letter-spacing:-.022em}
.tier__unit{font-family:var(--font-mono);font-size:13px;font-weight:500;
  color:var(--ink-muted);margin-inline-start:var(--space-2)}
.tier--rec .tier__unit{color:var(--ink-on-cream);opacity:.72}
.tier__fine{font-size:13px;line-height:20px;color:var(--ink-muted);
  margin-block:var(--space-2) var(--space-5)}
.tier--rec .tier__fine{color:var(--ink-on-cream);opacity:.78}
.tier ul{margin-block-end:var(--space-5);flex:1}
.tier li{font-size:14px;line-height:22px;color:var(--ink-secondary);
  padding-block:var(--space-3);border-block-start:1px solid var(--line-subtle)}
.tier--rec li{color:var(--ink-on-cream);border-block-start-color:rgba(16,20,69,.16)}
.tier--rec .btn--primary{background:var(--brand-navy);color:var(--ink-on-indigo)}
.tier--rec .btn--primary:hover{background:#1c225d;color:var(--ink-on-indigo)}

.notes{display:grid;gap:var(--space-5)}
@media (min-width:820px){.notes{grid-template-columns:repeat(3,minmax(0,1fr))}}
.note{border-inline-start:2px solid var(--brand-indigo);padding-inline-start:var(--space-5)}
.note h3{font-size:16px;line-height:24px;margin-block-end:var(--space-2)}
.note p{font-size:14px;line-height:22px;color:var(--ink-secondary)}

.projects{display:grid;gap:var(--space-6)}
.project{display:grid;gap:var(--space-5);padding-block:var(--space-7);
  border-block-start:1px solid var(--line-subtle)}
@media (min-width:860px){.project{grid-template-columns:minmax(0,7fr) minmax(0,5fr);
  gap:var(--space-8);align-items:start}}
.project__meta{font-family:var(--font-mono);font-size:12px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink-muted);margin-block-end:var(--space-3)}
.project h3{margin-block-end:var(--space-3)}
.project p{color:var(--ink-secondary)}
.chips{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-block-start:var(--space-5)}
.chip{font-family:var(--font-mono);font-size:12px;line-height:16px;
  padding:var(--space-2) var(--space-3);border-radius:var(--radius-pill);
  background:var(--surface-overlay);color:var(--ink-secondary);border:1px solid var(--line-subtle)}
.shot{background:var(--surface-overlay);border:1px solid var(--line-subtle);
  border-radius:var(--radius-lg);aspect-ratio:16/10;display:flex;align-items:center;
  justify-content:center;color:var(--ink-muted);font-family:var(--font-mono);font-size:12px;
  letter-spacing:.12em;text-transform:uppercase;text-align:center;padding:var(--space-5)}

.contact{background:var(--surface-raised);border:1px solid var(--line-subtle);
  border-radius:var(--radius-xl);padding:var(--space-7) var(--space-6)}
@media (min-width:860px){.contact{padding:var(--space-8)}}
.contact h2{margin-block-end:var(--space-4)}
.contact .lede{max-width:56ch;margin-block-end:var(--space-6)}
.contact__lines{margin-block-start:var(--space-6);display:grid;gap:var(--space-3)}
.contact__mail{font-size:clamp(17px,2.2vw,20px);letter-spacing:-.01em;text-decoration:none;
  border-block-end:1px solid var(--line-strong);padding-block-end:2px}
.contact__mail:hover{border-block-end-color:var(--link-hover)}
.contact__lines p{margin:0}
.contact__lines bdi{direction:inherit;unicode-bidi:isolate;display:block}
.contact__lines a{font-family:var(--font-mono);font-size:16px;text-decoration:none}
.contact__lines a:hover{text-decoration:underline}

.site-footer{border-block-start:1px solid var(--line-subtle);padding-block:var(--space-7);
  margin-block-start:var(--space-8)}
.site-footer__in{display:flex;flex-wrap:wrap;gap:var(--space-5);
  justify-content:space-between;align-items:center}
.site-footer p{font-size:13px;line-height:20px;color:var(--ink-muted)}
.site-footer nav{display:flex;flex-wrap:wrap;gap:var(--space-5)}
.site-footer nav a{font-family:var(--font-mono);font-size:13px;color:var(--ink-secondary);
  text-decoration:none}
.site-footer nav a:hover{color:var(--ink-primary)}

html[lang="ar"] body{font-family:var(--font-arabic);line-height:2}
html[lang="ar"] h1,html[lang="ar"] h2,html[lang="ar"] h3,html[lang="ar"] h4,
html[lang="ar"] .display-xl,html[lang="ar"] .display-lg,html[lang="ar"] .h2,html[lang="ar"] .h3{
  font-family:var(--font-kufi);font-weight:700;letter-spacing:0}
html[lang="ar"] .display-xl{font-size:clamp(30px,5vw,44px);line-height:1.4}
html[lang="ar"] .display-lg{font-size:clamp(25px,3.8vw,38px);line-height:1.45}
html[lang="ar"] .h2{font-size:clamp(20px,2.6vw,23px);line-height:1.6}
html[lang="ar"] .h3,html[lang="ar"] .card h3,html[lang="ar"] .tier h3{font-size:19px;line-height:1.7}
html[lang="ar"] .lede{font-size:clamp(16px,1.9vw,18px);line-height:1.95}
html[lang="ar"] .small,html[lang="ar"] .card__list li,html[lang="ar"] .tier li,
html[lang="ar"] .step p,html[lang="ar"] .note p{line-height:1.95}
html[lang="ar"] .caption,html[lang="ar"] .tier__fine{line-height:1.85}
html[lang="ar"] .eyebrow,html[lang="ar"] .card__tag,html[lang="ar"] .project__meta,
html[lang="ar"] .tier__flag{font-family:var(--font-arabic);letter-spacing:0;text-transform:none;
  font-weight:600;font-size:13px}
html[lang="ar"] .nav a,html[lang="ar"] .site-footer nav a,html[lang="ar"] .btn,
html[lang="ar"] .chip{font-family:var(--font-arabic);letter-spacing:0;font-size:14px}
html[lang="ar"] .tier__amount{font-family:var(--font-sans)}
html[lang="ar"] .tier__unit,html[lang="ar"] .contact__lines a{font-family:var(--font-mono)}
html[lang="ar"] .hero h1{max-width:18ch}
html[lang="ar"] .step::before{font-family:var(--font-mono)}
html[lang="ar"] .shot{font-family:var(--font-arabic);letter-spacing:0;text-transform:none}

.picker{display:none;flex-wrap:wrap;gap:var(--space-2);margin-block-end:var(--space-8);
  border-block-end:1px solid var(--line-subtle);padding-block-end:var(--space-4)}
.picker button{font-family:var(--font-mono);font-size:13px;line-height:18px;font-weight:500;
  letter-spacing:.02em;padding:var(--space-3) var(--space-5);border-radius:var(--radius-pill);
  border:1px solid var(--line-strong);background:none;color:var(--ink-secondary);cursor:pointer;
  transition:background-color .15s ease,color .15s ease,border-color .15s ease}
.picker button:hover{background:var(--surface-overlay);color:var(--ink-primary)}
.picker button[aria-selected="true"]{background:var(--action-fill);color:var(--action-ink);
  border-color:var(--action-fill)}
.js .picker{display:flex}
.panel[hidden]{display:none}
.panel__head{margin-block-end:var(--space-7);max-width:56ch}
.panel__head h2{margin-block-end:var(--space-4)}
.panel__head p{color:var(--ink-secondary)}

.panel__head h2 .panel__only{display:none}
.js .panel__head h2 .panel__only{display:none}

.rates{display:grid;gap:var(--space-5);margin-block-end:var(--space-7)}
@media (min-width:760px){.rates{grid-template-columns:repeat(2,minmax(0,1fr))}}
.rate{background:var(--surface-raised);border:1px solid var(--line-subtle);
  border-radius:var(--radius-lg);padding:var(--space-6)}
.rate__label{font-family:var(--font-mono);font-size:12px;line-height:16px;font-weight:500;
  letter-spacing:.14em;text-transform:uppercase;color:var(--ink-muted);margin-block-end:var(--space-3)}
.rate__amount{font-size:40px;line-height:1.05;font-weight:600;letter-spacing:-.022em}
.rate__amount--unset{color:var(--ink-muted);font-family:var(--font-mono);font-size:26px;
  letter-spacing:.06em}
.rate__unit{font-family:var(--font-mono);font-size:13px;font-weight:500;color:var(--ink-muted);
  margin-inline-start:var(--space-2)}
.rate p.rate__note{font-size:14px;line-height:22px;color:var(--ink-secondary);
  margin-block-start:var(--space-4)}
.drivers li{font-size:14px;line-height:22px;color:var(--ink-secondary);
  padding-block:var(--space-3);border-block-start:1px solid var(--line-subtle)}
.callout{background:var(--surface-cream);color:var(--ink-on-cream);border-radius:var(--radius-lg);
  padding:var(--space-6);margin-block-start:var(--space-6)}
.callout h3{margin-block-end:var(--space-3);color:var(--ink-on-cream)}
.callout p{color:var(--ink-on-cream);opacity:.85;font-size:15px;line-height:24px}
html[lang="ar"] .picker button{font-family:var(--font-arabic);letter-spacing:0;font-size:14px}
html[lang="ar"] .rate__label{font-family:var(--font-arabic);letter-spacing:0;text-transform:none;
  font-weight:600;font-size:13px}
html[lang="ar"] .rate__amount{font-family:var(--font-sans)}

.nav__links{display:flex;align-items:center;gap:var(--space-5)}
.nav__tools{display:flex;align-items:center;gap:var(--space-2);
  margin-inline-start:var(--space-5);padding-inline-start:var(--space-5);
  border-inline-start:1px solid var(--line-subtle)}
.dd{position:relative}
.dd__btn{display:none;align-items:center;gap:var(--space-2);
  font-family:var(--font-mono);font-size:12px;line-height:16px;font-weight:500;letter-spacing:.02em;
  padding:6px 10px;border-radius:var(--radius-pill);border:1px solid var(--line-subtle);
  background:none;color:var(--ink-secondary);cursor:pointer;
  transition:border-color .15s ease,color .15s ease,background-color .15s ease}
.js .dd__btn{display:inline-flex}
.dd__btn:hover{border-color:var(--line-strong);color:var(--ink-primary)}
.dd__btn[aria-expanded="true"]{border-color:var(--line-strong);color:var(--ink-primary);
  background:var(--surface-overlay)}
.dd__flag{width:21px;height:16px;border-radius:2px;display:block;flex:none;
  box-shadow:0 0 0 1px rgba(244,241,228,.2)}
.dd__label{white-space:nowrap}
.dd__caret{opacity:.75;flex:none;transition:transform .15s ease}
.dd__btn[aria-expanded="true"] .dd__caret{transform:rotate(180deg)}

.dd__menu{display:flex;align-items:center;gap:var(--space-4);list-style:none;margin:0;padding:0}
.dd--cur .dd__menu{display:none}
.js .dd__menu{position:absolute;inset-block-start:calc(100% + 8px);inset-inline-end:0;
  display:none;flex-direction:column;align-items:stretch;gap:2px;min-width:190px;z-index:60;
  background:var(--surface-raised);border:1px solid var(--line-strong);
  border-radius:var(--radius-md);box-shadow:var(--shadow-md);padding:var(--space-2)}
.js .dd__menu[data-open]{display:flex}
.dd__menu li{display:block}
.dd__menu a,.dd__menu button{display:flex;align-items:center;gap:var(--space-3);width:100%;
  font-family:var(--font-mono);font-size:13px;line-height:18px;text-decoration:none;
  color:var(--ink-secondary);padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);
  border:0;background:none;cursor:pointer;text-align:start}
.dd__menu a:hover,.dd__menu button:hover{background:var(--surface-overlay);color:var(--ink-primary)}
.dd__menu [aria-current="true"]{color:var(--ink-primary)}
.js .dd__menu [aria-current="true"]::after{content:"";width:6px;height:6px;border-radius:50%;
  background:var(--link);margin-inline-start:auto;flex:none}
.dd__sym{color:var(--ink-muted);margin-inline-start:auto}
.js .dd__menu [aria-current="true"] .dd__sym{margin-inline-start:auto}
@media (max-width:719px){
  .nav__tools{margin-inline-start:auto;padding-inline-start:0;border:0}
  .nav__links{gap:var(--space-4)}
  .dd__btn .dd__label{display:none}
  .dd--cur .dd__btn .dd__label{display:inline}
}
html[lang="ar"] .dd__btn,html[lang="ar"] .dd__menu a,html[lang="ar"] .dd__menu button{
  font-family:var(--font-arabic);letter-spacing:0;font-size:13px}
html[lang="ar"] .dd--cur .dd__btn,html[lang="ar"] .dd--cur .dd__menu button{font-family:var(--font-mono)}
.setup-inline{font-variant-numeric:tabular-nums}
.rate__unit{font-family:var(--font-mono);font-size:13px;font-weight:500;color:var(--ink-muted);margin-inline-start:var(--space-2)}
html[lang="ar"] .rate__unit,html[lang="ar"] .tier__unit{font-family:var(--font-mono)}

.sprite{position:absolute;width:0;height:0;overflow:hidden}
.riyal{height:.78em;width:auto;display:inline-block;vertical-align:-.02em;fill:currentColor}
.tier__unit .riyal,.rate__unit .riyal{height:1.5em;vertical-align:-.16em}
.dd__sym .riyal{height:1em;vertical-align:-.1em}
.unit-inline .riyal{height:.92em;vertical-align:-.06em}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0}

.workgroup + .workgroup{margin-block-start:var(--space-9)}
.workgroup__head{display:flex;align-items:baseline;gap:var(--space-4);
  padding-block-end:var(--space-4);border-block-end:2px solid var(--brand-indigo)}
.workgroup__head h2{margin:0}
.workgroup__count{font-family:var(--font-mono);font-size:12px;line-height:16px;font-weight:500;
  letter-spacing:.14em;color:var(--ink-muted);margin-inline-start:auto}
.workgroup .project:first-child{border-block-start:0;padding-block-start:var(--space-6)}
.project__link{color:inherit;text-decoration:none;display:inline-flex;align-items:baseline;
  gap:var(--space-3);border-block-end:2px solid transparent;transition:border-color .15s ease,color .15s ease}
.project__link:hover{color:var(--link-hover);border-block-end-color:var(--link)}
.project__out{flex:none;align-self:center;opacity:.85}

.project__link{color:inherit;text-decoration:none;display:inline-flex;align-items:baseline;
  gap:var(--space-3);border-block-end:2px solid transparent;
  transition:border-color .15s ease,color .15s ease}
.project__link:hover{color:var(--link-hover);border-block-end-color:var(--link)}
.project__out{flex:none;align-self:center;opacity:.85}

.tier__tag{font-size:14px;line-height:22px;color:var(--ink-secondary);margin:calc(var(--space-2) * -1) 0 var(--space-4)}
.tier--rec .tier__tag{color:var(--ink-on-cream);opacity:.85}
.tier__fine{margin-block-end:var(--space-4)}
.tier__costs{margin:0 0 var(--space-5);display:grid;gap:var(--space-2);
  padding:var(--space-3) var(--space-4);border-radius:var(--radius-sm);background:var(--surface-overlay)}
.tier__costs div{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;
  column-gap:var(--space-3);row-gap:0;font-size:13px;line-height:20px}
.tier__costs dt{color:var(--ink-muted);white-space:nowrap}

.tier__costs dd{margin:0 0 0 auto;margin-inline-start:auto;color:var(--ink-primary);font-weight:500;text-align:end}
.tier--rec .tier__costs{background:rgba(16,20,69,.07)}
.tier--rec .tier__costs dt{color:rgba(10,10,60,.74)}
.tier--rec .tier__costs dd{color:var(--ink-on-cream)}
.plan-notes{margin-block-start:var(--space-8)}
.plan-notes .notes{margin-block-end:var(--space-5)}
.notes--4{grid-template-columns:1fr}
@media (min-width:760px){.notes--4{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-6) var(--space-7)}}

.rate__range{display:flex;flex-wrap:wrap;align-items:baseline}
.rate__to{font-size:15px;font-weight:500;color:var(--ink-muted);margin-inline:var(--space-3)}
html[lang="ar"] .tier__tag{line-height:1.9}
html[lang="ar"] .tier__costs div{font-size:13px}
html[lang="ar"] .plan-notes .eyebrow{font-family:var(--font-arabic);letter-spacing:0;text-transform:none;font-weight:600;font-size:13px}

.tier__costs .tier__start{padding-block-start:var(--space-2);border-block-start:1px solid var(--line-subtle)}
.tier__costs .tier__start dd{font-size:15px;font-weight:600}
.tier--rec .tier__costs .tier__start{border-block-start-color:rgba(16,20,69,.16)}
.notes--2{grid-template-columns:1fr}
@media (min-width:760px){.notes--2{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-7)}}

.pay>*:not(.page-art){max-width:760px}
.pay__cards{display:grid;gap:var(--space-4)}
@media (min-width:640px){.pay__cards{grid-template-columns:1fr 1fr}}
.pay__card{display:flex;align-items:flex-start;gap:var(--space-4);background:var(--surface-raised);
  border:1px solid var(--line-subtle);border-radius:var(--radius-lg);padding:var(--space-5)}
.pay__icon{width:28px;height:28px;flex:none;color:var(--link);margin-block-start:2px}
.pay__text{display:grid;gap:var(--space-1);min-width:0}
.pay__tag{font-family:var(--font-mono);font-size:11px;line-height:16px;font-weight:500;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink-muted);margin:0}
.pay__name{font-size:19px;line-height:26px;font-weight:600;color:var(--ink-primary);margin:0}
.pay__body{font-size:14px;line-height:22px;color:var(--ink-secondary);margin:var(--space-1) 0 0}
.pay__note{margin-block-start:var(--space-5)}
html[lang="ar"] .pay__tag{font-family:var(--font-arabic);letter-spacing:0;text-transform:none;font-weight:600;font-size:12px}
html[lang="ar"] .pay__name{font-family:var(--font-kufi)}
html[lang="ar"] .pay__body{line-height:1.95}

.about>*{max-width:860px}
.about__h1{max-width:20ch}
.about__block{padding-block:var(--space-7);border-block-start:1px solid var(--line-subtle)}
.about__block:first-child{border-block-start:0;padding-block-start:0}
.about__block .eyebrow{margin-block-end:var(--space-5)}
.about__story p{font-size:clamp(17px,2vw,19px);line-height:1.75;color:var(--ink-secondary);max-width:62ch}
.about__story p+p{margin-block-start:var(--space-4)}
.about__vision{font-size:clamp(22px,3vw,28px);line-height:1.4;font-weight:600;letter-spacing:-.01em;
  color:var(--ink-primary);max-width:30ch;padding-inline-start:var(--space-5);
  border-inline-start:3px solid var(--brand-cream)}
html[lang="ar"] .about__block .eyebrow{font-family:var(--font-arabic);letter-spacing:0;text-transform:none;font-weight:600;font-size:13px}
html[lang="ar"] .about__story p{line-height:2}
html[lang="ar"] .about__vision{font-family:var(--font-kufi);font-weight:700;line-height:1.7;letter-spacing:0}
.shot--img{padding:0;margin:0;overflow:hidden;display:block;box-shadow:0 12px 32px rgba(0,0,0,.28)}
.shot--img img{display:block;width:100%;height:100%;object-fit:cover;object-position:top center}

h1,h2,h3,h4,.display-xl,.display-lg,.h2,.h3,
.brand span,.nav a,.site-footer,.site-footer nav a{font-family:var(--font-display)}
html[lang="ar"] h1,html[lang="ar"] h2,html[lang="ar"] h3,html[lang="ar"] h4,
html[lang="ar"] .display-xl,html[lang="ar"] .display-lg,html[lang="ar"] .h2,html[lang="ar"] .h3,
html[lang="ar"] .brand span,html[lang="ar"] .nav a,html[lang="ar"] .site-footer,
html[lang="ar"] .site-footer nav a{font-family:var(--font-kufi)}

h1.eyebrow,h2.eyebrow,h3.eyebrow{font-family:var(--font-mono)}
html[lang="ar"] h1.eyebrow,html[lang="ar"] h2.eyebrow,html[lang="ar"] h3.eyebrow{font-family:var(--font-arabic)}

body{background:#0a0a3c;position:relative;isolation:isolate}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(70vmax 55vmax at 100% 0%,rgba(82,106,190,.45),transparent 70%),
    radial-gradient(60vmax 50vmax at 0% 100%,rgba(82,106,190,.30),transparent 70%),
    linear-gradient(160deg,#0a0a3c 0%,#10155a 55%,#0a0a3c 100%)}
p{color:var(--ink-secondary)}
.tier--rec p{color:var(--ink-on-cream)}
.js .dd__menu{background:#12145a}

.tip{position:relative;cursor:help;text-decoration:underline dotted;
  text-decoration-color:rgba(255,245,195,.6);text-decoration-thickness:1.5px;text-underline-offset:4px;
  border-radius:3px;outline-offset:3px}
.tip:focus-visible{outline:2px solid var(--focus-ring)}
.tier--rec .tip{text-decoration-color:rgba(10,10,60,.5)}
.tip__b{position:absolute;left:50%;bottom:calc(100% + 12px);z-index:70;
  width:max-content;max-width:min(280px,78vw);padding:10px 14px;border-radius:12px;
  background:#fff5c3;color:#0a0a3c;box-shadow:0 14px 34px rgba(4,5,30,.55),0 0 0 1px rgba(82,106,190,.35);
  font:500 13px/1.55 var(--font-sans);letter-spacing:0;text-transform:none;text-align:start;white-space:normal;
  opacity:0;visibility:hidden;pointer-events:none;
  transform:translate(calc(-50% + var(--tip-x,0px)),6px) scale(.97);transform-origin:50% 100%;
  transition:opacity .16s ease,transform .2s cubic-bezier(.2,.8,.2,1),visibility 0s linear .2s}

.tip__b::after{content:"";position:absolute;top:100%;left:calc(50% - var(--tip-x,0px));
  margin-left:-7px;border:7px solid transparent;border-top-color:#fff5c3}

.tip__b::before{content:"";position:absolute;left:0;right:0;top:100%;height:14px}
.tip:hover>.tip__b,.tip:focus-visible>.tip__b,.tip[data-open]>.tip__b{
  opacity:1;visibility:visible;pointer-events:auto;
  transform:translate(calc(-50% + var(--tip-x,0px)),0) scale(1);transition-delay:0s}
.tip[data-hide]>.tip__b{opacity:0;visibility:hidden;pointer-events:none}

.tip[data-below]>.tip__b{bottom:auto;top:calc(100% + 12px);transform-origin:50% 0}
.tip[data-below]>.tip__b::after{top:auto;bottom:100%;border-top-color:transparent;border-bottom-color:#fff5c3}
.tip[data-below]>.tip__b::before{top:auto;bottom:100%}

.tier--rec .tip__b{background:#0a0a3c;color:#fff5c3}
.tier--rec .tip__b::after{border-top-color:#0a0a3c}
.tier--rec .tip[data-below]>.tip__b::after{border-top-color:transparent;border-bottom-color:#0a0a3c}
html[lang="ar"] .tip__b{font-family:var(--font-arabic);font-size:13.5px;line-height:1.85}
.chip .tip{text-decoration-color:rgba(255,245,195,.45)}

@media (prefers-reduced-motion:no-preference){

  .card,.tier,.rate,.note,.pay__card,.contact{transition:transform .28s cubic-bezier(.2,.8,.2,1),
    border-color .28s ease,box-shadow .28s ease}
  .card:hover,.tier:hover,.rate:hover,.pay__card:hover{transform:translateY(-4px);
    border-color:var(--line-strong);box-shadow:0 18px 40px rgba(4,5,30,.5),0 0 0 1px rgba(82,106,190,.25)}
  .tier--rec:hover{box-shadow:0 18px 44px rgba(255,245,195,.14),0 0 0 1px rgba(255,245,195,.5)}
  .btn{transition:transform .2s cubic-bezier(.2,.8,.2,1),background-color .2s ease,box-shadow .2s ease,color .2s ease}
  .btn:hover{transform:translateY(-2px)}
  .btn--primary:hover{box-shadow:0 10px 26px rgba(255,245,195,.22)}
  .btn:active{transform:translateY(0)}
  .shot--img img{transition:transform .7s cubic-bezier(.2,.8,.2,1)}
  .project:hover .shot--img img{transform:scale(1.035)}
  .shot--img{transition:box-shadow .4s ease,border-color .4s ease}
  .project:hover .shot--img{border-color:var(--line-strong);box-shadow:0 20px 44px rgba(4,5,30,.55)}

  .nav a:not([aria-current="page"]):not(.nav__cta){background:linear-gradient(currentColor,currentColor) no-repeat;
    background-size:0 1px;background-position:0 100%;transition:background-size .25s ease,color .2s ease}
  html[dir="rtl"] .nav a:not([aria-current="page"]):not(.nav__cta){background-position:100% 100%}
  .nav a:not([aria-current="page"]):not(.nav__cta):hover{background-size:100% 1px}

  .motion body::before{inset:-12%;animation:bg-drift 38s ease-in-out infinite alternate}
  @keyframes bg-drift{0%{transform:translate3d(0,0,0)}100%{transform:translate3d(-4%,3%,0) scale(1.04)}}

  .motion .rv{opacity:0;transform:translateY(18px);
    transition:opacity .6s ease var(--rv-d,0ms),transform .7s cubic-bezier(.2,.8,.2,1) var(--rv-d,0ms)}
  .motion .rv.is-in{opacity:1;transform:none}

  .motion .art rect{transform-box:fill-box;transform-origin:center;
    animation:tile-in .55s cubic-bezier(.2,.9,.3,1.25) both;animation-delay:calc(var(--i,0) * 35ms + 150ms)}
  @keyframes tile-in{from{opacity:0;transform:scale(.4)}to{opacity:1;transform:none}}
  .motion .art rect[fill="#0ff0fc"]{animation:tile-in .55s cubic-bezier(.2,.9,.3,1.25) both,
    breathe 3.2s ease-in-out infinite alternate;animation-delay:calc(var(--i,0) * 35ms + 150ms),1.2s}
  @keyframes breathe{from{opacity:1}to{opacity:.55}}
  .motion .art rect[fill="#fff5c3"]{animation:tile-in .55s cubic-bezier(.2,.9,.3,1.25) both,
    float 5s ease-in-out infinite alternate;animation-delay:calc(var(--i,0) * 35ms + 150ms),1.2s}
  @keyframes float{from{transform:translateY(0)}to{transform:translateY(-5px)}}

  .motion .panel:not([hidden]){animation:panel-in .38s cubic-bezier(.2,.8,.2,1) both}
  @keyframes panel-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

  .motion [data-price].tick{animation:tick .42s cubic-bezier(.2,.8,.2,1)}
  @keyframes tick{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
  [data-price]{display:inline-block}

  .js .dd__menu[data-open]{animation:menu-in .18s ease-out both}
  @keyframes menu-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
}

html,body{overflow-x:clip}
.tip{white-space:nowrap}

.a11y__fab{position:fixed;inset-block-end:18px;inset-inline-end:18px;z-index:90;
  width:56px;height:56px;border-radius:50%;display:grid;place-items:center;cursor:pointer;
  background:var(--brand-cream);color:#0a0a3c;border:2px solid #0a0a3c;
  box-shadow:0 10px 28px rgba(4,5,30,.55),0 0 0 1px rgba(255,245,195,.4)}
.a11y__fab:hover{background:#fffbe3}
.a11y__fab:focus-visible,.a11y button:focus-visible,.a11y a:focus-visible{outline:3px solid var(--focus-ring);outline-offset:3px}
.a11y__fab[aria-expanded="true"]{background:var(--focus-ring)}
.a11y__panel{position:fixed;inset-block-end:86px;inset-inline-end:18px;z-index:91;
  width:min(372px,calc(100vw - 36px));max-height:calc(100dvh - 110px);overflow:auto;overscroll-behavior:contain;
  padding:var(--space-5);border-radius:var(--radius-lg);
  background:#0e1050;border:1px solid var(--line-strong);color:var(--ink-primary);
  box-shadow:0 24px 60px rgba(2,3,20,.7);font-family:var(--font-sans)}
.a11y__panel[hidden]{display:none}
.a11y__head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);margin-block-end:var(--space-4)}
.a11y__title{font:600 18px/1.3 var(--font-display);margin:0;color:var(--ink-primary)}
.a11y__close{width:44px;height:44px;display:grid;place-items:center;border-radius:50%;cursor:pointer;
  background:transparent;border:1px solid var(--line-strong);color:var(--ink-primary)}
.a11y__close:hover{background:var(--surface-overlay)}
.a11y__size{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);
  padding:var(--space-3);border-radius:var(--radius-md);background:rgba(82,106,190,.14);margin-block-end:var(--space-4)}
.a11y__label{font-size:14px;font-weight:600;color:var(--ink-primary)}
.a11y__stepper{display:flex;gap:6px}
.a11y__stepper button{min-width:44px;height:44px;padding:0 10px;border-radius:10px;cursor:pointer;
  background:#0a0a3c;border:1px solid var(--line-strong);color:var(--ink-primary);font:600 15px/1 var(--font-sans)}
.a11y__stepper button:hover:not(:disabled){background:var(--surface-overlay)}
.a11y__stepper button:disabled{opacity:.45;cursor:not-allowed}
.a11y__pct output{font:500 13px/1 var(--font-mono)}
.a11y__grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.a11y__opt{display:flex;flex-direction:column;align-items:flex-start;gap:8px;min-height:76px;padding:12px;
  border-radius:12px;cursor:pointer;text-align:start;background:#0a0a3c;border:1px solid var(--line-subtle);
  color:var(--ink-primary);font:500 14px/1.3 var(--font-sans);position:relative}
.a11y__opt:hover{border-color:var(--line-strong);background:#141862}
.a11y__opt[aria-pressed="true"]{background:var(--brand-cream);color:#0a0a3c;border-color:var(--brand-cream)}
.a11y__opt[aria-pressed="true"]::after{content:"";position:absolute;inset-block-start:10px;inset-inline-end:10px;
  width:10px;height:10px;border-radius:50%;background:#0a0a3c}
.a11y__reset{width:100%;margin-block-start:var(--space-4);min-height:44px;border-radius:10px;cursor:pointer;
  background:transparent;border:1px solid var(--line-strong);color:var(--ink-primary);font:600 14px/1 var(--font-sans)}
.a11y__reset:hover{background:var(--surface-overlay)}
.a11y__note{margin:var(--space-4) 0 0;font-size:12.5px;line-height:1.6;color:var(--ink-muted)}
.a11y__note a{color:var(--link)}
html[lang="ar"] .a11y__panel,html[lang="ar"] .a11y__opt,html[lang="ar"] .a11y__reset,
html[lang="ar"] .a11y__label{font-family:var(--font-arabic)}
html[lang="ar"] .a11y__title{font-family:var(--font-kufi)}
.a11y__guide{display:none}
@media (prefers-reduced-motion:no-preference){
  .a11y__panel:not([hidden]){animation:menu-in .2s ease-out both}
  .a11y__fab{transition:transform .2s ease,background-color .2s ease}
  .a11y__fab:hover{transform:scale(1.06)}
}
@media print{.a11y{display:none}}

.a11y-zoomed body{zoom:var(--a11y-zoom,1)}

.a11y-contrast{--surface-base:#000;--surface-raised:#000;--surface-overlay:#000;--surface-cream:#000;
  --ink-primary:#fff;--ink-secondary:#fff;--ink-muted:#fff;--ink-on-cream:#fff;
  --line-subtle:#fff;--line-strong:#fff;--link:#ffe600;--link-hover:#ffe600;--focus-ring:#ffe600;
  --action-fill:#ffe600;--action-fill-hover:#fff;--action-ink:#000}
.a11y-contrast body{background:#000}
.a11y-contrast body::before{display:none}
.a11y-contrast .site-header{background:#000;backdrop-filter:none;-webkit-backdrop-filter:none;border-color:#fff}
.a11y-contrast .tier--rec{background:#000;border:2px solid #ffe600}
.a11y-contrast .tier--rec *,.a11y-contrast .tier--rec .tier__costs dt{color:#fff;opacity:1}
.a11y-contrast .tier--rec .tier__costs{background:#000;border:1px solid #fff}
.a11y-contrast .tier--rec .btn--primary{background:#ffe600;color:#000}
.a11y-contrast .card,.a11y-contrast .tier,.a11y-contrast .rate,.a11y-contrast .note,.a11y-contrast .pay__card,
.a11y-contrast .chip,.a11y-contrast .shot,.a11y-contrast .tier__costs{border-color:#fff}
.a11y-contrast .js .dd__menu,.a11y-contrast.js .dd__menu{background:#000;border-color:#fff}
.a11y-contrast .tip__b{background:#fff;color:#000}
.a11y-contrast .tip__b::after{border-top-color:#fff}
.a11y-contrast .tip{text-decoration-color:#ffe600}
.a11y-contrast .a11y__panel{background:#000;border:2px solid #fff}
.a11y-contrast .a11y__opt,.a11y-contrast .a11y__stepper button{background:#000;border-color:#fff}
.a11y-contrast .a11y__opt[aria-pressed="true"]{background:#ffe600;color:#000;border-color:#ffe600}
.a11y-contrast .a11y__fab{background:#ffe600;border-color:#000}
.a11y-contrast .art{filter:grayscale(1) contrast(1.4)}

.a11y-font{--font-display:"IBM Plex Sans",system-ui,sans-serif;--font-mono:"IBM Plex Sans",system-ui,sans-serif;
  --font-kufi:"IBM Plex Sans Arabic","IBM Plex Sans",sans-serif}
.a11y-font *{text-transform:none!important}
.a11y-font .eyebrow,.a11y-font .chip,.a11y-font .nav a,.a11y-font .btn,.a11y-font .project__meta,
.a11y-font .tier__flag,.a11y-font .card__tag{letter-spacing:.01em!important}

.a11y-spacing body *{line-height:1.9!important;word-spacing:.16em!important}
html[lang="en"].a11y-spacing body *{letter-spacing:.12em!important}
.a11y-spacing p{margin-block-end:1.4em}
.a11y-spacing .tip{white-space:normal}

.a11y-links a:not(.btn):not(.brand){text-decoration:underline!important;text-decoration-thickness:2px!important;
  text-underline-offset:4px!important}
.a11y-links .btn{outline:2px solid currentColor;outline-offset:3px}
.a11y-links .tip{text-decoration-style:solid!important}

.a11y-still *,.a11y-still *::before,.a11y-still *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
.a11y-still .rv{opacity:1!important;transform:none!important}
.a11y-still{scroll-behavior:auto}

.a11y-cursor,.a11y-cursor *{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 48 48'%3E%3Cpath d='M8 4l30 18-13 3.5L19 40z' fill='%23fff5c3' stroke='%230a0a3c' stroke-width='3' stroke-linejoin='round'/%3E%3C/svg%3E") 8 4,auto!important}
.a11y-cursor a,.a11y-cursor button,.a11y-cursor [role="tab"],.a11y-cursor .tip,.a11y-cursor a *,.a11y-cursor button *{
  cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 48 48'%3E%3Cpath d='M8 4l30 18-13 3.5L19 40z' fill='%230ff0fc' stroke='%230a0a3c' stroke-width='3' stroke-linejoin='round'/%3E%3C/svg%3E") 8 4,pointer!important}

.a11y-guide .a11y__guide{display:block;position:fixed;inset-inline:0;top:-22px;height:44px;z-index:85;pointer-events:none;
  background:rgba(255,245,195,.10);border-block:2px solid rgba(255,245,195,.85);
  box-shadow:0 0 0 100vmax rgba(0,0,0,.38)}
.a11y-contrast.a11y-guide .a11y__guide{border-color:#ffe600;background:transparent;box-shadow:0 0 0 100vmax rgba(0,0,0,.55)}

.a11y-gray main,.a11y-gray .site-header,.a11y-gray .site-footer{filter:grayscale(1)}

.legal>*{max-width:780px}
.legal__h1{margin-block-end:var(--space-3)}
.legal__date{font-family:var(--font-mono);font-size:12.5px;letter-spacing:.06em;color:var(--ink-muted);margin-block-end:var(--space-6)}
html[lang="ar"] .legal__date{font-family:var(--font-arabic);letter-spacing:0}
.legal__intro{margin-block-end:var(--space-7)}
.legal__sec{padding-block:var(--space-6);border-block-start:1px solid var(--line-subtle)}
.legal__sec h2{margin-block-end:var(--space-4)}
.legal__sec p,.legal__sec li{max-width:68ch;line-height:1.75}
.legal__sec p+p{margin-block-start:var(--space-3)}
.legal__sec ul{margin:0;padding-inline-start:1.2em;display:grid;gap:var(--space-3)}
.legal__sec li{color:var(--ink-secondary)}
.legal__sec li::marker{color:var(--brand-cyan)}
.legal__sec strong{color:var(--ink-primary);font-weight:600}
.legal a{color:var(--link)}
html[lang="ar"] .legal__sec p,html[lang="ar"] .legal__sec li{line-height:2}

.nf{min-height:calc(100dvh - 260px);display:grid;align-content:center}
.nf__code{font:700 clamp(88px,18vw,180px)/.9 var(--font-display);letter-spacing:-.04em;
  background:linear-gradient(135deg,#fff5c3 0%,#fff5c3 40%,#526abe 100%);-webkit-background-clip:text;background-clip:text;
  color:transparent;margin-block-end:var(--space-5)}
.nf h1{margin-block-end:var(--space-4);max-width:18ch}
.nf .lede{max-width:52ch;margin-block-end:var(--space-6)}
.nf__links{display:flex;flex-wrap:wrap;gap:var(--space-3)}
.nf__alt{margin-block-start:var(--space-7);padding-block-start:var(--space-5);border-block-start:1px solid var(--line-subtle);
  font-size:14px;color:var(--ink-muted)}
.nf__alt a{color:var(--link)}
.a11y-contrast .nf__code{background:none;color:#fff}
@media (prefers-reduced-motion:no-preference){
  .motion .nf__code{animation:nf-glitch 5s steps(1) infinite}
  @keyframes nf-glitch{0%,92%,100%{transform:none;text-shadow:none}
    93%{transform:translateX(3px);text-shadow:-3px 0 rgba(15,240,252,.7)}
    95%{transform:translateX(-2px);text-shadow:3px 0 rgba(82,106,190,.8)}
    97%{transform:none}}
}
.nf__alt--plain{border:0;margin-block-start:var(--space-3);padding-block-start:0}

.u-mw64{max-width:64ch}.u-mw24{max-width:24ch}.u-mw28{max-width:28ch}.u-mw22{max-width:22ch}
.u-mt3{margin-block-start:var(--space-3)}.u-mt5{margin-block-start:var(--space-5)}
.u-mb4{margin-block-end:var(--space-4)}.u-mb5{margin-block-end:var(--space-5)}.u-mb7{margin-block-end:var(--space-7)}
.legal__toc{margin-block-end:var(--space-6);padding:var(--space-5);border:1px solid var(--line-subtle);border-radius:var(--radius-lg);background:var(--surface-raised)}
.legal__toc .eyebrow{margin-block-end:var(--space-4)}
.legal__toc ol{margin:0;padding-inline-start:1.6em;columns:2 240px;column-gap:var(--space-6)}
.legal__toc li{break-inside:avoid;padding-block:3px;font-size:14.5px;color:var(--ink-muted)}
.legal__toc a{color:var(--ink-secondary);text-decoration:none}
.legal__toc a:hover{color:var(--link);text-decoration:underline}
.legal__n{color:var(--ink-muted);font-weight:500;margin-inline-end:.15em}
.legal__sec{scroll-margin-top:90px}
.legal__todo{display:inline-block;padding:1px 8px;border-radius:6px;background:rgba(255,200,87,.16);
  border:1px dashed var(--status-warning);color:var(--status-warning);font-size:.92em}
html[lang="ar"] .legal__toc li{font-size:15px}

.start>*{max-width:900px}
.start__h1{margin-block-end:var(--space-4)}
.start__lede{max-width:62ch}
.start__h2{margin-block-end:var(--space-6)}
.brief-guide{list-style:none;margin:0;padding:0;counter-reset:g;display:grid;gap:var(--space-4)}
@media (min-width:760px){.brief-guide{grid-template-columns:1fr 1fr}}
.brief-guide__item{counter-increment:g;position:relative;padding:var(--space-5);padding-inline-start:64px;
  background:var(--surface-raised);border:1px solid var(--line-subtle);border-radius:var(--radius-lg)}
.brief-guide__item::before{content:counter(g);position:absolute;inset-block-start:var(--space-5);inset-inline-start:var(--space-5);
  width:28px;height:28px;border-radius:50%;display:grid;place-items:center;
  background:var(--brand-cream);color:#0a0a3c;font:600 13px/1 var(--font-mono)}
.brief-guide__item h3{font-size:17px;line-height:24px;margin-block-end:var(--space-2)}
.brief-guide__item p{font-size:14.5px;line-height:1.65}
.brief{padding:var(--space-6);border-radius:var(--radius-xl);border:1px solid var(--line-strong);
  background:linear-gradient(160deg,rgba(82,106,190,.22),rgba(10,10,60,.6))}
.brief__head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:var(--space-4);margin-block-end:var(--space-5)}
.brief__head h2{margin-block-end:var(--space-2)}
.brief__text{margin:0;padding:var(--space-5);border-radius:var(--radius-md);background:#07072e;border:1px solid var(--line-subtle);
  color:var(--ink-primary);font:400 14px/1.9 var(--font-mono);white-space:pre-wrap;overflow-wrap:anywhere}
html[lang="ar"] .brief__text{font-family:var(--font-arabic);font-size:15px;line-height:2.1}
.brief__text:focus-visible{outline:2px solid var(--focus-ring);outline-offset:3px}
.brief__note{margin-block-start:var(--space-4);font-size:14px;color:var(--ink-muted)}
.steps--3{grid-template-columns:1fr}
@media (min-width:760px){.steps--3{grid-template-columns:repeat(3,1fr)}}
.send .send__mail{margin-block:var(--space-3) var(--space-4);font:600 clamp(22px,4vw,34px)/1.2 var(--font-mono)}
.send .send__mail a{color:var(--link);text-decoration:none;overflow-wrap:anywhere}
.send .send__mail a:hover{text-decoration:underline}
.send .btn-row{margin-block-start:var(--space-5)}
.send__fallback{margin-block-start:var(--space-4)}
.btn.is-copied{border-color:var(--status-success);color:var(--status-success)}
.contact__brief{margin-block-start:var(--space-5)}
.a11y-contrast .brief,.a11y-contrast .brief__text{background:#000;border-color:#fff}
.a11y-contrast .brief-guide__item::before{background:#ffe600;color:#000}
ol.steps{list-style:none;padding:0;margin:0}
.btn.btn--primary.is-copied{background:var(--status-success);border-color:var(--status-success);color:#0a0a3c}

.nav a.nav__cta{display:inline-flex;align-items:center;min-height:34px;padding:0 14px;border-radius:var(--radius-pill);
  background:var(--action-fill);color:var(--action-ink);font-weight:600;font-size:12.5px;white-space:nowrap;
  text-decoration:none;margin-inline-end:var(--space-2)}
.nav a.nav__cta:hover{background:var(--action-fill-hover);color:var(--action-ink)}
.nav .nav__cta[aria-current="page"]{text-decoration:none;box-shadow:0 0 0 2px var(--link)}
.nav .nav__cta:focus-visible{outline:2px solid var(--focus-ring);outline-offset:3px}
html[lang="ar"] .nav .nav__cta{font-family:var(--font-kufi);font-size:13px;letter-spacing:0}
@media (prefers-reduced-motion:no-preference){.nav .nav__cta{transition:transform .2s ease,background-color .2s ease}.nav .nav__cta:hover{transform:translateY(-1px)}}
.a11y-contrast .nav .nav__cta{background:#ffe600;color:#000}
.brief__text--filled{box-shadow:0 0 0 1px var(--status-success) inset}
.step p a{color:var(--link)}

.site-footer{padding-block-end:calc(var(--space-7) + 84px)}

.has-art{position:relative}
.page-art{display:none;position:absolute;inset-inline-end:0;pointer-events:none;z-index:0}
.page-art svg{display:block;width:100%;height:auto}
@media (min-width:1200px){.page-art{display:block}}
.page-art--about{inset-block-start:-8px;width:270px}
.page-art--work{inset-block-start:-24px;width:380px}
.page-art--pricing{inset-block-start:-64px;width:250px}
.page-art--pay{inset-block-start:10px;width:330px}
.page-art--start{inset-block-start:40px;width:230px}
.page-art--privacy{inset-block-start:0;width:250px}
.page-art--terms{inset-block-start:0;width:260px}
.page-art--404{inset-block-start:50%;transform:translateY(-50%);width:440px}

html[dir="rtl"] .page-art svg{transform:scaleX(-1)}

.strip{display:none;max-width:480px;margin-block:var(--space-2) var(--space-6)}
.strip svg{display:block;width:100%;height:auto}
@media (max-width:1199px){.strip:not(.strip--home){display:block}}
@media (max-width:979px){.strip--home{display:block}}
.strip-wrap>.strip{margin-block:0}
.strip-wrap{padding-block:var(--space-2)}
html[dir="rtl"] .strip svg{transform:scaleX(-1)}
.page-art+.about__block{border-block-start:0;padding-block-start:0}

.pricing-intro{padding-block-end:0}
.pricing-body{padding-block-start:var(--space-6)}
@media (max-width:1199px){.pricing-intro+.strip-wrap{padding-block:var(--space-5) 0}}

.picker .tab--ideas{border-style:dashed;border-color:var(--brand-cyan);color:var(--brand-cyan)}
.picker .tab--ideas[aria-selected="true"]{background:var(--brand-cyan);border-color:var(--brand-cyan);border-style:solid;color:var(--brand-navy)}
.ideas__group{margin-block-end:var(--space-7)}
.ideas__group>.h3{display:flex;align-items:center;gap:var(--space-3);margin-block-end:var(--space-4);padding-block-end:var(--space-3);border-block-end:1px solid var(--line-subtle)}
.ideas__row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-5)}
.idea{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);grid-template-rows:auto auto 1fr auto;column-gap:var(--space-5);row-gap:var(--space-2);
  background:var(--surface-raised);border:1px solid var(--line-subtle);border-radius:var(--radius-lg);padding:var(--space-4);transition:border-color .2s ease,transform .2s ease;align-items:start}
.idea:hover{border-color:var(--line-strong)}
.idea__thumb{grid-row:1/-1;position:relative;display:block;align-self:stretch;width:100%;min-height:clamp(160px,24dvh,230px);border-radius:var(--radius-md);overflow:hidden;background:#fff;border:1px solid var(--line-subtle)}
.idea__thumb img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:top center;transition:transform .4s ease}

.idea:hover .idea__thumb img{transform:scale(1.03)}
.idea__h{font-family:var(--font-display);font-size:19px;line-height:26px;font-weight:600}
html[lang="ar"] .idea__h{font-family:var(--font-kufi);font-size:18px;line-height:1.6}
.idea__h a{color:var(--ink-primary);text-decoration:none}
.idea__h a:hover{color:var(--link)}
.idea__p{font-size:13px;line-height:20px;color:var(--ink-secondary)}
.idea__price{font-size:14px;color:var(--ink-primary);align-self:end}
.idea .btn{grid-column:2;padding-block:10px;font-size:13px}
.idea__price .riyal{width:.9em;height:1em;vertical-align:-.1em}
.idea__lab,.idea__q{font-family:var(--font-mono);font-size:12px;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-muted)}
html[lang="ar"] .idea__lab,html[lang="ar"] .idea__q{font-family:var(--font-arabic);letter-spacing:0;text-transform:none;font-size:13px}
@media (max-width:1100px){.ideas__row{grid-template-columns:1fr}}
@media (max-width:620px){.idea{grid-template-columns:1fr;grid-template-rows:none}.idea__thumb{grid-row:auto;min-height:0;aspect-ratio:16/10;margin-block-end:var(--space-2)}.idea .btn{grid-column:auto}}
@media (prefers-reduced-motion:no-preference){.idea:hover{transform:translateY(-2px)}}
.project__cta{margin-block-start:var(--space-5)}
.shot__link{display:block}