/* Fallback only — Vazirmatn (OFL) renders if GE Dinar Two fails to load. @import must stay first. */
/* arabic */
@font-face {
  font-family: 'Vazirmatn';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("/fonts/vazirmatn-arabic.woff2") format('woff2');
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-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-10EC7, U+10EC9-10EEE, U+10EF0-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;
}
/* latin-ext */
@font-face {
  font-family: 'Vazirmatn';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("/fonts/vazirmatn-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, 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;
}
/* latin */
@font-face {
  font-family: 'Vazirmatn';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("/fonts/vazirmatn-latin.woff2") format('woff2');
  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;
}
/* arabic */
@font-face {
  font-family: 'Vazirmatn';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/fonts/vazirmatn-arabic.woff2") format('woff2');
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-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-10EC7, U+10EC9-10EEE, U+10EF0-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;
}
/* latin-ext */
@font-face {
  font-family: 'Vazirmatn';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/fonts/vazirmatn-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, 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;
}
/* latin */
@font-face {
  font-family: 'Vazirmatn';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/fonts/vazirmatn-latin.woff2") format('woff2');
  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;
}


/* Latin: Poppins — confirmed in both brand guideline (4.2) and design system doc. OFL. */
@font-face{font-family:"Poppins";src:url("/fonts/poppins-300.ttf") format("truetype");font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:"Poppins";src:url("/fonts/poppins-300-italic.ttf") format("truetype");font-weight:300;font-style:italic;font-display:swap}
@font-face{font-family:"Poppins";src:url("/fonts/poppins-400.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Poppins";src:url("/fonts/poppins-500.ttf") format("truetype");font-weight:500;font-style:normal;font-display:swap}

/* Digits in Arabic — GE Dinar Two draws Arabic-Indic shapes for 0–9. This
   subset face (Poppins, unicode-range 0–9 + ©) sits FIRST in --font-arabic, so
   numerals and © always render as Latin Poppins digits in Arabic text. */
@font-face{font-family:"Curated Digits";src:url("/fonts/poppins-300.ttf") format("truetype");font-weight:300;font-style:normal;font-display:swap;unicode-range:U+0030-0039,U+00A9}
@font-face{font-family:"Curated Digits";src:url("/fonts/poppins-300-italic.ttf") format("truetype");font-weight:300;font-style:italic;font-display:swap;unicode-range:U+0030-0039,U+00A9}
@font-face{font-family:"Curated Digits";src:url("/fonts/poppins-400.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0030-0039,U+00A9}
@font-face{font-family:"Curated Digits";src:url("/fonts/poppins-500.ttf") format("truetype");font-weight:500;font-style:normal;font-display:swap;unicode-range:U+0030-0039,U+00A9}
@font-face{font-family:"Curated Digits";src:url("/fonts/poppins-500.ttf") format("truetype");font-weight:500;font-style:italic;font-display:swap;unicode-range:U+0030-0039,U+00A9}

/* Arabic: GE Dinar Two — APPROVED by the client (Guideline v1.2 §4.1).
   Only Light 300 + Medium 500 (+ their italics) exist. Never request 400/600/700:
   the browser would synthesize a fake weight. A WEB licence must be confirmed
   before launch — the delivered files are desktop licences. */
@font-face{font-family:"GE Dinar Two";src:url("/fonts/ge-dinar-two-300.otf") format("opentype");font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:"GE Dinar Two";src:url("/fonts/ge-dinar-two-300-italic.otf") format("opentype");font-weight:300;font-style:italic;font-display:swap}
@font-face{font-family:"GE Dinar Two";src:url("/fonts/ge-dinar-two-500.otf") format("opentype");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"GE Dinar Two";src:url("/fonts/ge-dinar-two-500-italic.otf") format("opentype");font-weight:500;font-style:italic;font-display:swap}


:root{
/* Primary palette — official names + HEX from Curated_Design system_V1 p.16,
   verified against the logo artwork. The RGB/HEX lines printed in
   CURATED_Guideline_v1.2 are byte-reversed; these values are the correct ones. */
--rocket-metallic:#878275;   /* Warm Gray 9 C */
--rocket:var(--rocket-metallic); /* short name used by the approved Web Foundations file */
--dark-vanilla:#d4cdb2;      /* Pantone 5807 C */
--beaver:#a18d74;            /* Pantone 7504 C */
--eggshell:#edeadd;          /* Pantone 7527 C */
--pale-silver:#cac7bc;       /* Warm Gray 3 C */

/* Text + background palette (CURATED_Guideline_v1.2 p.23) */
--ink:#241f21;
--bone:#f2f2e8;
--white:#ffffff;

/* PROPOSED, NOT CLIENT-APPROVED. Same hue as Beaver, darkened to pass AA (4.58:1)
   on Eggshell so links and small interactive text have a brand-family colour.
   Carried as --accent in the approved Web Foundations file. */
--beaver-deep:#776650;

/* Tints (Design system p.20) */
--rocket-80:#9f9991;--rocket-60:#b7b3ac;--rocket-40:#cfccc8;--rocket-20:#e7e6e3;
--vanilla-80:#ddd6c0;--vanilla-60:#e5e0d0;--vanilla-40:#eeebdf;--vanilla-20:#f6f5ef;
--beaver-80:#b1a38f;--beaver-60:#c5baab;--beaver-40:#d8d1c7;--beaver-20:#ece8e3;
--eggshell-80:#f1efe5;--eggshell-60:#f4f3eb;--eggshell-40:#f8f7f2;--eggshell-20:#fbfbf8;
--silver-80:#d4d2ca;--silver-60:#dfddd7;--silver-40:#e9e9e5;--silver-20:#f4f4f2;

/* ---- Approved aliases, verbatim from the Curated Web Foundations :root block.
   LIGHT is the primary direction: Bone and white carry the page; the five named
   colours arrive as bands and accents, never as the ground. Do not flip this. ---- */
--ground:var(--bone);
--surface:var(--eggshell);
--surface-2:#ffffff;
--text:var(--ink);
--text-soft:#5d5651;
--text-faint:#7d7570;
--rule:#dcd9cb;
--rule-strong:var(--pale-silver);
--accent:var(--beaver-deep);
--accent-display:var(--beaver);

/* ---- This system's semantic names, derived from the approved aliases above.
   Components read these; the two sets never diverge. ---- */
--surface-page:var(--ground);
--surface-raised:var(--surface);
--surface-warm:var(--dark-vanilla);
--surface-card:var(--surface-2);
--surface-structural:var(--rocket-metallic); /* dark bands, footers */
--surface-inverse:var(--ink);

--text-body:var(--text);               /* AAA on every light ground — never override */
--text-muted:var(--text-soft);
--text-display:var(--rocket-metallic); /* ≥24px medium / ≥32px regular ONLY */
--text-accent:var(--accent-display);   /* ≥24px medium / ≥32px regular ONLY */
--text-on-dark:var(--eggshell);
--text-on-accent:var(--ink);
--text-link:var(--accent);
--text-disabled:var(--text-faint);

--border-hairline:var(--rule);
--border-strong:var(--rule-strong);
--border-on-dark:rgba(237,234,221,.28);

--focus-ring:var(--accent);
}

/* ---- Dark mode is NOT wired to prefers-color-scheme. Light is what a
   first-time visitor gets, on every OS. Dark is opt-in only, below. ---- */

/* Pin light regardless of OS preference — <html data-theme="light">. */
[data-theme="light"]{
--ground:var(--bone);
--surface:var(--eggshell);
--surface-2:#ffffff;
--text:var(--ink);
--text-soft:#5d5651;
--text-faint:#7d7570;
--rule:#dcd9cb;
--rule-strong:var(--pale-silver);
--accent:var(--beaver-deep);
--accent-display:var(--beaver);
--surface-warm:var(--dark-vanilla);
--surface-inverse:var(--ink);
--text-display:var(--rocket-metallic);
}

/* Explicit opt-in for previews and a single dark band on an otherwise light page. */
[data-theme="dark"],.theme-dark{
--ground:var(--ink);
--surface:#2e2829;
--surface-2:#383132;
--text:var(--eggshell);
--text-soft:#b8b1a5;
--text-faint:#948c81;
--rule:#443c3d;
--rule-strong:#554c4d;
--accent:var(--dark-vanilla);
--accent-display:var(--dark-vanilla);
--surface-warm:#3a3335;
--surface-inverse:var(--bone);
--text-display:var(--dark-vanilla);
}

:root{
--font-latin:"Poppins",system-ui,sans-serif;
/* GE Dinar Two — client-approved (Guideline v1.2 §4.1). Vazirmatn is fallback only. */
/* "Curated Digits" (Poppins, 0–9 + © only) leads so Arabic text keeps Latin numerals. */
--font-arabic:"Curated Digits","GE Dinar Two","Vazirmatn",system-ui,sans-serif;
--font-ui:var(--font-latin);

--fw-light:300; /* @kind font */
--fw-regular:400; /* @kind font */
--fw-medium:500; /* @kind font */

/* Role weights — DS V1 pp.19–20 */
--fw-display:var(--fw-medium); /* @kind font */  /* Big heading: Medium, UPPERCASE */
--fw-heading:var(--fw-regular); /* @kind font */ /* h2/h3: Regular, Title case */
--fw-slogan:var(--fw-light); /* @kind font */    /* Slogan/description: Light Italic */
--fw-body:var(--fw-light); /* @kind font */
--fst-slogan:italic; /* @kind font */

/* Scale — Master Stylelist (guideline 4.3) + design system p.19 */
--fs-display:clamp(40px,6.4vw,96px); /* @kind font */
--fs-h1:clamp(32px,4.4vw,60px); /* @kind font */
--fs-h2:clamp(26px,3vw,40px); /* @kind font */
--fs-h3:22px; /* @kind font */
--fs-lead:clamp(18px,1.5vw,24px); /* @kind font */
--fs-body:16px; /* @kind font */
--fs-small:14px; /* @kind font */
--fs-caption:12px; /* @kind font */

--lh-display:1.1; /* @kind font */   /* Big heading LH 110% */
--lh-heading:1.04; /* @kind font */  /* Heading LH 100% (+4% so Poppins descenders clear on wrapped lines) */
--lh-body:1.6; /* @kind font */
--lh-small:1.5; /* @kind font */
--lh-slogan:1.3; /* @kind font */
/* Arabic needs far more air — ascenders/descenders collide below ~1.6. */
--lh-body-ar:1.7; /* @kind font */
--lh-heading-ar:1.35; /* @kind font */

--ls-display:0em; /* @kind font */      /* Big Heading: UPPERCASE, 0% tracking */
--ls-eyebrow:0.22em; /* @kind font */   /* small uppercase labels */
--ls-slogan:-0.02em; /* @kind font */   /* Slogan/Description: lowercase, −2% */
--ls-body:0em; /* @kind font */
}

/* Language scopes. Casing transforms are Latin-only. GE Dinar Two has no
   Regular cut, so Arabic headings step up to Medium. */
[lang="ar"],[dir="rtl"]{
--font-ui:var(--font-arabic);
--fw-heading:var(--fw-medium); /* @kind font */
--lh-body:var(--lh-body-ar); /* @kind font */
--lh-heading:var(--lh-heading-ar); /* @kind font */
--lh-display:1.35; /* @kind font */
--lh-slogan:1.6; /* @kind font */
--ls-display:0; /* @kind font */
--ls-eyebrow:0; /* @kind font */
--ls-slogan:0; /* @kind font */
}
[lang="ar"] .u-upper,[dir="rtl"] .u-upper{text-transform:none;letter-spacing:0}

:root{
--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;
--section-y:clamp(64px,9vw,144px); /* @kind spacing */
--gutter:clamp(20px,5vw,80px); /* @kind spacing */
--measure:66ch; /* @kind spacing */          /* Latin reading measure */
--measure-ar:37em; /* @kind spacing */ /* em, not ch: GE Dinar Two's "0" is very narrow, so ch collapses */
--content-max:1320px;
--grid-cols:12; /* @kind other */          /* print identity uses 5 columns; web uses 12 with the same rhythm */
--radius-none:0;
--radius-sm:2px;         /* the identity is square-cornered; keep radii near zero */
--radius-pill:999px;
--border-thin:1px; /* @kind spacing */
}

/* Signature motif: the 10–15° incline from Curated_Design system_V1 p.22
   ("a 10–15 degree angle to embody gradation and progress"). Web uses 12°.
   In RTL the angle mirrors so it never points against the reading direction.

   HOW THE ANGLE STAYS TRUE. A clip-path polygon resolves its Y coordinates
   against the element's HEIGHT, so a fixed "21.3%" is a real 12° only on a box
   whose height happens to be 0.213 × its width — on anything else the cut comes
   out at the wrong pitch, and two differently-proportioned cuts meeting at a
   section join read as a bend. So the clip rise is expressed in `cqw`
   (a percentage of the container's INLINE SIZE), which makes the pitch exactly
   12° at any height. The clipped element therefore needs a container ancestor:
   use `.cut-host` on its wrapper, or `container-type:inline-size` inline.
   Padding clearance keeps using a plain % — padding percentages already
   resolve against width, so they are correct as written. */
:root{
--angle:12deg; /* @kind other */
--angle-mirror:-12deg; /* @kind other */
--angle-rise:21.26%; /* @kind spacing */   /* tan(12°) of the width — for padding clearance */
--angle-rise-q:21.26cqw; /* @kind spacing */ /* tan(12°) of the container width — for clip-path */
/* Offset of the 12° plane set behind a content photo. Photos are never cut. */
--photo-plane-off:clamp(14px,2vw,28px); /* @kind spacing */
/* SECTION BANDS: the 12° diagonal sits in a short empty strip between sections
   (max 80px tall), so no text, button or card ever crosses a colour boundary.
   At a true 12° an 80px rise runs 80/tan(12°) ≈ 376px, so on wide screens the
   slope occupies the inline-start corner and the rest of the edge is flat.
   Content on the cut side is padded by --band-rise. Needs an inline-size container. */
--band-rise:min(80px,21.26cqw); /* @kind spacing */
--band-run:calc(var(--band-rise) * 4.7046); /* @kind spacing */ /* rise / tan(12°) */
--clip-band-top:polygon(0 var(--band-rise),var(--band-run) 0,100% 0,100% 100%,0 100%); /* @kind other */
--clip-band-bottom:polygon(0 0,100% 0,100% 100%,var(--band-run) 100%,0 calc(100% - var(--band-rise))); /* @kind other */
--clip-cut-top:polygon(0 var(--angle-rise-q),100% 0,100% 100%,0 100%); /* @kind other */
--clip-cut-bottom:polygon(0 0,100% 0,100% calc(100% - var(--angle-rise-q)),0 100%); /* @kind other */
--clip-cut-both:polygon(0 var(--angle-rise-q),100% 0,100% calc(100% - var(--angle-rise-q)),0 100%); /* @kind other */
}
[dir="rtl"]{
--angle:-12deg; /* @kind other */
--clip-band-top:polygon(0 0,calc(100% - var(--band-run)) 0,100% var(--band-rise),100% 100%,0 100%); /* @kind other */
--clip-band-bottom:polygon(0 0,100% 0,100% calc(100% - var(--band-rise)),calc(100% - var(--band-run)) 100%,0 100%); /* @kind other */
--angle-mirror:12deg; /* @kind other */
--clip-cut-top:polygon(0 0,100% var(--angle-rise-q),100% 100%,0 100%); /* @kind other */
--clip-cut-bottom:polygon(0 0,100% 0,100% 100%,0 calc(100% - var(--angle-rise-q))); /* @kind other */
--clip-cut-both:polygon(0 0,100% var(--angle-rise-q),100% calc(100% - var(--angle-rise-q)),0 100%); /* @kind other */
}
/* Establishes the inline-size container the cut measures itself against.
   Every element carrying .cut-top/.cut-bottom/.cut-both needs this on a parent. */
.cut-host{container-type:inline-size}
.cut-top{clip-path:var(--clip-cut-top)}
.cut-bottom{clip-path:var(--clip-cut-bottom)}
.cut-both{clip-path:var(--clip-cut-both)}
/* Hairline at the identity angle — used as a section marker or under eyebrows. */
.rule-angled{width:64px;height:1px;background:var(--border-strong);transform:rotate(var(--angle));transform-origin:left center}

/* GRADIENT + TEXTURE — Curated_Design system_V1 pp.23–26.
   Soft, warm, matte light washes with ONE plane of light crossing the surface
   at the brand angle — daylight falling on a plastered wall, never a colourful
   web gradient. Each token = a soft radial wash + a hard-edged linear plane.
   The plane's edge leans 12° off vertical (gradient line at 102°) and mirrors
   in RTL. Use on heroes, covers, section bands and quote panels; body sections
   stay flat tone. Always pair with --texture-grain. */
:root{
--plane-angle:102deg; /* @kind other */
--gradient-light:
  linear-gradient(var(--plane-angle),rgba(135,130,117,.13) 0%,rgba(135,130,117,.05) 36%,rgba(255,255,255,.34) 36%,rgba(255,255,255,0) 78%),
  radial-gradient(120% 90% at 70% 10%,#f8f7f2 0%,rgba(248,247,242,0) 62%),
  linear-gradient(180deg,var(--bone),var(--eggshell)); /* @kind other */
--gradient-warm:
  linear-gradient(var(--plane-angle),#f7f3e8 0%,var(--vanilla-40) 44%,var(--dark-vanilla) 44%,var(--beaver-80) 100%),
  var(--dark-vanilla); /* @kind other */
--gradient-stone:
  linear-gradient(var(--plane-angle),var(--rocket-60) 0%,var(--rocket-40) 30%,var(--silver-60) 30%,var(--pale-silver) 100%),
  var(--pale-silver); /* @kind other */
/* Paper/plaster grain — very low-opacity fractal noise, tiled. Layer it FIRST. */
--texture-grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .14 0 0 0 0 .12 0 0 0 0 .13 0 0 0 .1 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); /* @kind other */
--surface-plane-light:var(--texture-grain),var(--gradient-light); /* @kind other */
--surface-plane-warm:var(--texture-grain),var(--gradient-warm); /* @kind other */
--surface-plane-stone:var(--texture-grain),var(--gradient-stone); /* @kind other */
}
/* Gradients reference the angle, so they are re-declared under RTL to resolve there. */
[dir="rtl"]{
--plane-angle:258deg; /* @kind other */
--gradient-light:
  linear-gradient(var(--plane-angle),rgba(135,130,117,.13) 0%,rgba(135,130,117,.05) 36%,rgba(255,255,255,.34) 36%,rgba(255,255,255,0) 78%),
  radial-gradient(120% 90% at 30% 10%,#f8f7f2 0%,rgba(248,247,242,0) 62%),
  linear-gradient(180deg,var(--bone),var(--eggshell)); /* @kind other */
--gradient-warm:
  linear-gradient(var(--plane-angle),#f7f3e8 0%,var(--vanilla-40) 44%,var(--dark-vanilla) 44%,var(--beaver-80) 100%),
  var(--dark-vanilla); /* @kind other */
--gradient-stone:
  linear-gradient(var(--plane-angle),var(--rocket-60) 0%,var(--rocket-40) 30%,var(--silver-60) 30%,var(--pale-silver) 100%),
  var(--pale-silver); /* @kind other */
--surface-plane-light:var(--texture-grain),var(--gradient-light); /* @kind other */
--surface-plane-warm:var(--texture-grain),var(--gradient-warm); /* @kind other */
--surface-plane-stone:var(--texture-grain),var(--gradient-stone); /* @kind other */
}
.plane-light{background:var(--surface-plane-light)}
.plane-warm{background:var(--surface-plane-warm)}
.plane-stone{background:var(--surface-plane-stone)}
.grain{background-image:var(--texture-grain)}
/* Photographic light planes from the client's company profile. Mirrored in RTL. */
.bg-photo-light,.bg-photo-warm{background-size:cover;background-position:center;position:relative}
.bg-photo-light{background-image:var(--texture-grain),url("/photos/plane-light.jpg")}
.bg-photo-warm{background-image:var(--texture-grain),url("/photos/plane-warm.jpg")}

/* The identity is print-derived: it separates surfaces with hairlines and tone,
   not with drop shadows. Only two shadows exist, both very soft and warm-tinted. */
:root{
--shadow-none:none;
--shadow-lift:0 1px 2px rgba(36,31,33,.05),0 8px 24px rgba(36,31,33,.06);
--shadow-overlay:0 24px 64px rgba(36,31,33,.16);
--overlay-scrim:linear-gradient(to top,rgba(36,31,33,.72),rgba(36,31,33,0) 62%); /* @kind color */
--overlay-wash:rgba(36,31,33,.28); /* @kind color */
--blur-veil:saturate(120%) blur(14px); /* @kind other */
}

:root{
--ease-out:cubic-bezier(.16,.84,.44,1); /* @kind other */
--ease-in-out:cubic-bezier(.4,0,.2,1); /* @kind other */
--dur-fast:140ms; /* @kind other */
--dur-base:280ms; /* @kind other */
--dur-slow:640ms; /* @kind other */
--reveal-shift:24px; /* @kind spacing */
}
@media (prefers-reduced-motion:reduce){:root{
--dur-fast:0ms; /* @kind other */
--dur-base:0ms; /* @kind other */
--dur-slow:0ms; /* @kind other */
--reveal-shift:0px; /* @kind spacing */
}}

*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--surface-page);color:var(--text-body);font-family:var(--font-ui);font-size:var(--fs-body);font-weight:var(--fw-body);line-height:var(--lh-body);-webkit-font-smoothing:antialiased;text-wrap:pretty}
h1,h2,h3,h4{font-weight:var(--fw-heading);line-height:var(--lh-heading);margin:0}
p{margin:0}
a{color:var(--text-link);text-decoration:none;border-bottom:1px solid var(--border-hairline);transition:border-color var(--dur-fast) var(--ease-out),color var(--dur-fast) var(--ease-out)}
a:hover{color:var(--text-body);border-color:currentColor}
:focus-visible{outline:1px solid var(--focus-ring);outline-offset:3px}
img,svg{display:block;max-width:100%}
.u-upper{text-transform:uppercase;letter-spacing:var(--ls-eyebrow)}
.u-eyebrow{font-size:var(--fs-caption);font-weight:var(--fw-medium);text-transform:uppercase;letter-spacing:var(--ls-eyebrow);color:var(--text-muted)}
[lang="ar"] .u-eyebrow,[dir="rtl"] .u-eyebrow{text-transform:none;letter-spacing:0;font-size:var(--fs-small)}
/* Big heading — Medium, UPPERCASE (Latin only), 0% tracking, LH 110%. */
.u-display{font-weight:var(--fw-display);text-transform:uppercase;letter-spacing:var(--ls-display);line-height:var(--lh-display)}
[lang="ar"] .u-display,[dir="rtl"] .u-display{text-transform:none}
/* Slogan / description — Light Italic, lowercase (Latin only), −2%. */
.u-slogan{font-weight:var(--fw-slogan);font-style:var(--fst-slogan);text-transform:lowercase;letter-spacing:var(--ls-slogan);line-height:var(--lh-slogan)}
[lang="ar"] .u-slogan,[dir="rtl"] .u-slogan{text-transform:none}
/* Latin digits in Arabic: any element that sets its own font-family inside an
   Arabic scope still gets Poppins numerals; tabular figures keep columns aligned. */
[lang="ar"],[dir="rtl"]{font-variant-numeric:lining-nums}
[lang="ar"] input,[lang="ar"] textarea,[lang="ar"] select,[lang="ar"] button,[dir="rtl"] input,[dir="rtl"] textarea,[dir="rtl"] select,[dir="rtl"] button{font-family:var(--font-arabic)}
.u-digits{font-family:"Curated Digits",var(--font-latin);unicode-bidi:isolate;direction:ltr}
.u-measure{max-width:var(--measure)}
[dir="rtl"] .u-measure{max-width:var(--measure-ar)}


html{scroll-behavior:smooth}.curated-office{display:flex;flex-wrap:nowrap;gap:16px}.curated-office>div{flex:var(--ar) 1 0;min-width:0}@media (max-width:899px){.curated-office{flex-wrap:wrap}.curated-office>.is-wide{flex:1 1 100%}.curated-office>.is-tall{flex:1 1 0}}@media (max-width:599px){.curated-office{flex-direction:column}.curated-office>div{flex:none;width:100%}}#root>div>main>*{animation:rise var(--dur-slow) var(--ease-out) backwards}@media (max-width:1100px){.curated-values{--values-cols:2}}@media (max-width:560px){.curated-values{--values-cols:1}}@keyframes rise{from{opacity:0;transform:translateY(var(--reveal-shift))}to{opacity:1;transform:none}}
/* WhatsApp floating button */
.curated-wa{position:fixed;bottom:20px;inset-inline-end:20px;z-index:50;display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:#25D366;color:#fff;border:0;box-shadow:0 6px 18px rgba(0,0,0,.18);transition:transform var(--dur-fast,.15s) ease,box-shadow var(--dur-fast,.15s) ease}
.curated-wa:hover{color:#fff;transform:translateY(-2px);box-shadow:0 10px 24px rgba(0,0,0,.22)}
.curated-wa:focus-visible{outline:2px solid var(--focus-ring,#000);outline-offset:3px}
@media (max-width:599px){.curated-wa{bottom:14px;inset-inline-end:14px;width:52px;height:52px}}
@media print{.curated-wa{display:none}}