:root {
  --ink:#17201e;
  --paper:#f3eee3;
  --sand:#d6b77f;
  --palm:#31584c;
  --clay:#a75238;
  --gulf:#163f55;
  --pearl:#fffaf0;
  --muted:#655f54;
  --line:rgba(23,32,30,.2);
  --display: Georgia, "Times New Roman", serif;
  --body: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}

* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--body); line-height:1.6; overflow-x:clip; }
img { display:block; width:100%; height:auto; }
a { color:inherit; text-underline-offset:.22em; }
a:focus-visible,button:focus-visible { outline:.2rem solid var(--pearl); outline-offset:.15rem; box-shadow:0 0 0 .5rem var(--ink); }
.skip-link { position:fixed; inset-block-start:.75rem; inset-inline-start:.75rem; z-index:20; transform:translateY(-180%); background:var(--pearl); color:var(--ink); padding:.7rem 1rem; min-height:2.75rem; }
.skip-link:focus { transform:none; }
.site-header { min-height:4.5rem; padding:.85rem clamp(1rem,4vw,4.5rem); display:flex; align-items:center; justify-content:space-between; gap:1.5rem; border-block-end:1px solid var(--line); background:rgba(243,238,227,.96); position:sticky; inset-block-start:0; z-index:10; }
.brand { min-height:2.75rem; display:inline-flex; align-items:center; gap:.65rem; font-family:var(--display); font-size:1.15rem; font-weight:700; text-decoration:none; }
.brand span { color:var(--muted); font-family:var(--body); font-size:.72rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.site-header nav { display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end; gap:.3rem 1.25rem; }
.site-header nav a { min-height:2.75rem; display:inline-flex; align-items:center; font-size:.83rem; font-weight:700; text-decoration:none; }
.hero { min-height:calc(100svh - 4.5rem); display:grid; align-content:center; padding:clamp(4rem,10vw,9rem) clamp(1rem,8vw,9rem); position:relative; isolation:isolate; background:var(--ink); color:var(--pearl); overflow:hidden; }
.hero::before,.hero::after { content:""; position:absolute; z-index:-1; border-radius:50%; border:1px solid rgba(255,250,240,.2); }
.hero::before { width:min(56vw,48rem); aspect-ratio:1; inset-block-start:-22vw; inset-inline-end:-8vw; }
.hero::after { width:min(30vw,24rem); aspect-ratio:1; inset-block-end:-10rem; inset-inline-start:15%; background:rgba(49,88,76,.22); }
.eyebrow { margin:0 0 1rem; color:#a9c9b9; font-size:.73rem; font-weight:800; letter-spacing:.18em; text-transform:uppercase; }
h1,h2,h3,p { margin-block-start:0; }
h1,h2,h3 { font-family:var(--display); line-height:1.02; }
h1 { max-width:12ch; margin-block-end:1.5rem; font-size:clamp(3.3rem,9vw,8.5rem); font-weight:400; letter-spacing:-.045em; }
.hero-copy { max-width:42rem; margin-block-end:1rem; font-size:clamp(1.15rem,2vw,1.55rem); }
.portfolio-disclosure { max-width:42rem; margin:-1.5rem 0 2.5rem; padding-top:1rem; border-top:1px solid var(--line); color:var(--muted); font-size:.84rem; }
.button { min-height:2.75rem; width:max-content; display:inline-flex; align-items:center; justify-content:center; margin-block-start:1.35rem; padding:.7rem 1.1rem; border:1px solid currentColor; background:var(--pearl); color:var(--ink); font-weight:800; text-decoration:none; }
.section { padding:clamp(4rem,8vw,8rem) clamp(1rem,6vw,7rem); scroll-margin-top:6rem; }
.section-heading { max-width:62rem; margin-block-end:clamp(2rem,5vw,4.5rem); }
.section h2 { max-width:15ch; margin-block-end:0; font-size:clamp(2.4rem,6vw,5.8rem); font-weight:400; letter-spacing:-.035em; }
.case-grid { display:grid; gap:clamp(2rem,5vw,5rem); }
.case-card { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(18rem,.65fr); min-height:31rem; background:var(--pearl); border:1px solid var(--line); }
.case-card:nth-child(even) { grid-template-columns:minmax(18rem,.65fr) minmax(0,1.35fr); }
.case-card:nth-child(even) img { grid-column:2; }
.case-card:nth-child(even) .case-copy { grid-row:1; grid-column:1; }
.case-card img { height:100%; min-height:31rem; object-fit:cover; }
.case-copy { padding:clamp(1.6rem,4vw,4rem); display:flex; flex-direction:column; justify-content:center; }
.case-location { margin-block-end:1rem; color:var(--muted); font-size:.72rem; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
.case-copy h3 { margin-block-end:1.25rem; font-size:clamp(2.4rem,5vw,5rem); font-weight:400; }
.case-copy p { max-width:36rem; }
.case-copy a { min-height:2.75rem; width:max-content; display:inline-flex; align-items:center; margin-block-start:.5rem; font-weight:800; }
.case-card--dubai { border-block-start:.5rem solid var(--palm); }
.case-card--riyadh { border-block-start:.5rem solid var(--clay); }
.case-card--doha { border-block-start:.5rem solid var(--gulf); }
.approach { background:#ded3bf; }
.approach .eyebrow { color:#315148; }
.approach-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-block:1px solid rgba(23,32,30,.35); }
.approach-grid article { padding:2rem; border-inline-end:1px solid rgba(23,32,30,.35); }
.approach-grid article:last-child { border-inline-end:0; }
.approach-grid span { display:block; margin-block-end:3rem; font-weight:800; }
.approach-grid h3 { font-size:clamp(1.7rem,3vw,2.7rem); font-weight:400; }
.approach-note { max-width:52rem; margin:3rem 0 0 auto; font-size:.95rem; }
.contact { background:var(--gulf); color:var(--pearl); }
.contact h2 { max-width:13ch; }
.contact > p:not(.eyebrow) { max-width:45rem; font-size:1.1rem; }
.contact-actions { display:flex; flex-wrap:wrap; align-items:center; gap:1rem 1.5rem; }
.contact-actions > a { min-height:2.75rem; display:inline-flex; align-items:center; }
.button--light { margin:0; background:var(--pearl); color:var(--gulf); }
footer { display:flex; flex-wrap:wrap; justify-content:space-between; gap:1rem; padding:1.4rem clamp(1rem,6vw,7rem); background:var(--ink); color:#d7d1c5; font-size:.76rem; }

[dir="rtl"] .site-header,.site-header:dir(rtl) { text-align:start; }
[dir="rtl"] .case-card:nth-child(even) img { grid-column:2; }

@media (max-width: 48rem) {
  .site-header { position:relative; align-items:flex-start; flex-direction:column; gap:.15rem; }
  .site-header nav { justify-content:flex-start; }
  .hero { min-height:auto; padding-block:5rem; }
  h1 { font-size:clamp(3rem,17vw,5.3rem); }
  .case-card,.case-card:nth-child(even) { grid-template-columns:1fr; min-height:0; }
  .case-card:nth-child(even) img,.case-card:nth-child(even) .case-copy { grid-column:1; grid-row:auto; }
  .case-card img { min-height:16rem; max-height:28rem; }
  .approach-grid { grid-template-columns:1fr; }
  .approach-grid article { border-inline-end:0; border-block-end:1px solid rgba(23,32,30,.35); }
  .approach-grid article:last-child { border-block-end:0; }
  .approach-grid span { margin-block-end:1rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
}
