:root {
  --bg: #0b0b09;
  --bg-soft: #12120f;
  --surface: #161612;
  --surface-2: #1d1c17;
  --text: #f4f0e7;
  --muted: #aaa59a;
  --line: rgba(255,255,255,.11);
  --accent: #d7b47a;
  --accent-strong: #f0cf96;
  --accent-ink: #17130d;
  --header: rgba(11,11,9,.72);
  --shadow: 0 30px 80px rgba(0,0,0,.28);
  --radius: 28px;
  --font: Inter, "Segoe UI", Tahoma, Arial, sans-serif;
  --ease: cubic-bezier(.2,.75,.25,1);
}

html[data-theme="light"] {
  --bg: #fbfbf8;
  --bg-soft: #f5f5f1;
  --surface: #ffffff;
  --surface-2: #f0f0eb;
  --text: #151515;
  --muted: #686862;
  --line: rgba(21,21,21,.12);
  --accent: #9f713c;
  --accent-strong: #7e552b;
  --accent-ink: #ffffff;
  --header: rgba(255,255,255,.90);
  --shadow: 0 24px 70px rgba(20,20,20,.09);
}

html[data-theme="sand"] {
  --bg: #c9b69c;
  --bg-soft: #bda88b;
  --surface: #d8c8b2;
  --surface-2: #ad9779;
  --text: #231d16;
  --muted: #655847;
  --line: rgba(35,29,22,.16);
  --accent: #6f4b2e;
  --accent-strong: #4f3422;
  --accent-ink: #f8efe2;
  --header: rgba(201,182,156,.82);
  --shadow: 0 30px 80px rgba(59,42,24,.16);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--bg); }
body {
  margin: 0;
  min-width: 320px;
  color: var(--text);
  background:
    radial-gradient(circle at 12% 8%, color-mix(in srgb, var(--accent) 7%, transparent), transparent 28rem),
    var(--bg);
  font-family: var(--font);
  line-height: 1.65;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  transition: background-color .45s var(--ease), color .45s var(--ease);
}

html[data-theme="light"] body { background:#fbfbf8; }

body.menu-open { overflow: hidden; }
a { color: inherit; }
button, input, textarea, select { font: inherit; }
button { color: inherit; }
img { display: block; max-width: 100%; }
::selection { background: var(--accent); color: var(--accent-ink); }

.skip-link {
  position: fixed;
  inset-inline-start: 16px;
  top: -80px;
  z-index: 5000;
  padding: 10px 14px;
  background: var(--accent);
  color: var(--accent-ink);
  border-radius: 8px;
}
.skip-link:focus { top: 12px; }

.shell { width: min(1280px, calc(100% - 48px)); margin-inline: auto; }
.section { padding: clamp(88px, 10vw, 150px) 0; position: relative; }
.kicker {
  margin: 0 0 20px;
  color: var(--accent);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .19em;
  text-transform: uppercase;
}
.section-heading h2 {
  margin: 0;
  max-width: 880px;
  font-size: clamp(38px, 5.5vw, 78px);
  line-height: 1.03;
  letter-spacing: -.045em;
  font-weight: 520;
}
.split-heading {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(280px, .65fr);
  gap: 56px;
  align-items: end;
  margin-bottom: 60px;
}
.split-heading > p {
  margin: 0 0 8px;
  color: var(--muted);
  max-width: 560px;
  font-size: 16px;
}

.scroll-progress {
  position: fixed;
  top: 0;
  inset-inline: 0;
  height: 3px;
  z-index: 5000;
  background: transparent;
  pointer-events: none;
}
.scroll-progress span {
  display: block;
  width: 0;
  height: 100%;
  background: var(--accent);
}

.site-header {
  position: fixed;
  top: 0;
  inset-inline: 0;
  z-index: 2000;
  border-bottom: 1px solid transparent;
  transition: background .35s var(--ease), border-color .35s var(--ease), transform .35s var(--ease);
}
.site-header.is-scrolled {
  background: var(--header);
  border-color: var(--line);
  backdrop-filter: blur(18px) saturate(130%);
  -webkit-backdrop-filter: blur(18px) saturate(130%);
}
.nav-shell {
  height: 92px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
}
.brand {
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  flex: 0 0 auto;
}
.brand-mark {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border: 1px solid var(--accent);
  border-radius: 50%;
  color: var(--accent);
  font-family: Georgia, serif;
  font-size: 21px;
  font-style: italic;
}
.brand-copy { display: grid; line-height: 1.04; }
.brand-copy strong { font-size: 14px; letter-spacing: .22em; font-weight: 700; }
.brand-copy small { margin-top: 5px; color: var(--muted); font-size: 8px; letter-spacing: .19em; }

.desktop-nav {
  display: flex;
  align-items: center;
  gap: clamp(18px, 2vw, 32px);
}
.desktop-nav a {
  position: relative;
  padding: 10px 0;
  text-decoration: none;
  color: var(--muted);
  font-size: 13px;
  transition: color .25s ease;
}
.desktop-nav a::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 3px;
  height: 1px;
  background: var(--accent);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform .3s var(--ease);
}
.desktop-nav a:hover { color: var(--text); }
.desktop-nav a:hover::after { transform: scaleX(1); }

.nav-actions { display: flex; align-items: center; gap: 10px; }
.theme-picker {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 5px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: color-mix(in srgb, var(--surface) 78%, transparent);
}
.theme-dot {
  width: 28px;
  height: 28px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  cursor: pointer;
  opacity: .55;
  transition: opacity .2s ease, transform .2s ease, background .2s ease;
}
.theme-dot:hover, .theme-dot.is-active {
  opacity: 1;
  transform: scale(1.06);
  background: var(--surface-2);
}
.lang-toggle, .menu-toggle {
  border: 1px solid var(--line);
  background: color-mix(in srgb, var(--surface) 72%, transparent);
  cursor: pointer;
}
.lang-toggle {
  min-width: 46px;
  height: 40px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
}
.nav-cta {
  padding: 11px 17px;
  border: 1px solid var(--accent);
  border-radius: 999px;
  color: var(--accent);
  text-decoration: none;
  font-size: 12px;
  font-weight: 700;
  transition: background .25s ease, color .25s ease, transform .25s ease;
}
.nav-cta:hover { background: var(--accent); color: var(--accent-ink); transform: translateY(-2px); }

.menu-toggle { display: none; width: 42px; height: 42px; border-radius: 50%; padding: 0; place-items: center; }
.menu-toggle span { display: block; width: 17px; height: 1px; background: currentColor; margin: 3px auto; transition: transform .25s ease; }
.menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(3.5px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-3.5px) rotate(-45deg); }

.mobile-menu {
  display: none;
  position: fixed;
  inset: 92px 0 0;
  padding: 36px 24px;
  background: var(--bg);
  transform: translateY(-12px);
  opacity: 0;
  pointer-events: none;
  transition: opacity .3s ease, transform .3s ease;
}
.mobile-menu.is-open { opacity: 1; transform: translateY(0); pointer-events: auto; }
.mobile-menu a {
  display: block;
  padding: 18px 0;
  border-bottom: 1px solid var(--line);
  text-decoration: none;
  font-size: clamp(24px, 7vw, 42px);
}

.hero {
  position: relative;
  min-height: 100svh;
  overflow: hidden;
  display: grid;
  align-items: end;
  color: #f5f2eb;
  background: #0a0a08;
}
.hero-media {
  position: absolute;
  inset: -5%;
  background:
    url("https://images.unsplash.com/photo-1600607687939-ce8a6c25118c?auto=format&fit=crop&w=2200&q=90")
    center 48% / cover no-repeat;
  transform: translate3d(0, var(--hero-shift, 0px), 0) scale(1.04);
  will-change: transform;
}
.hero-shade {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(3,3,2,.82) 0%, rgba(3,3,2,.5) 43%, rgba(3,3,2,.18) 74%),
    linear-gradient(0deg, rgba(3,3,2,.82) 0%, transparent 55%);
}
html[dir="ltr"] .hero-shade {
  background:
    linear-gradient(270deg, rgba(3,3,2,.82) 0%, rgba(3,3,2,.5) 43%, rgba(3,3,2,.18) 74%),
    linear-gradient(0deg, rgba(3,3,2,.82) 0%, transparent 55%);
}
.hero-grid {
  position: absolute;
  inset: 0;
  opacity: .24;
  background-image:
    linear-gradient(rgba(255,255,255,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.07) 1px, transparent 1px);
  background-size: 9vw 9vw;
  mask-image: linear-gradient(to bottom, rgba(0,0,0,.25), transparent 72%);
}
.hero-content {
  position: relative;
  z-index: 2;
  padding-top: 170px;
  padding-bottom: clamp(100px, 11vh, 145px);
}
.eyebrow {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 24px;
  color: #d6d0c4;
  font-size: 12px;
  letter-spacing: .11em;
}
.eyebrow-line { width: 40px; height: 1px; background: #d7b47a; }
.hero-title {
  max-width: 1000px;
  margin: 0;
  font-size: clamp(58px, 8.7vw, 138px);
  line-height: .88;
  letter-spacing: -.055em;
  font-weight: 510;
}
.hero-title span, .hero-title em { display: block; }
.hero-title em {
  color: #d7b47a;
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 400;
  font-style: italic;
  letter-spacing: -.035em;
}
.hero-lead {
  max-width: 700px;
  margin: 34px 0 0;
  color: #c5c0b7;
  font-size: clamp(16px, 1.6vw, 20px);
  line-height: 1.8;
}
.hero-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 34px; }
.btn {
  min-height: 52px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 13px 22px;
  border-radius: 999px;
  border: 1px solid transparent;
  text-decoration: none;
  cursor: pointer;
  font-weight: 700;
  font-size: 13px;
  transition: transform .25s var(--ease), background .25s ease, color .25s ease, border-color .25s ease;
}
.btn:hover { transform: translateY(-3px); }
.btn-primary { background: var(--accent); color: var(--accent-ink); }
.hero .btn-primary { background: #d7b47a; color: #17130d; }
.btn-ghost { border-color: rgba(255,255,255,.24); color: #f7f4ed; background: rgba(255,255,255,.05); backdrop-filter: blur(12px); }
.btn-ghost:hover { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.38); }

.hero-meta {
  display: flex;
  gap: clamp(26px, 6vw, 80px);
  margin-top: 64px;
  padding-top: 22px;
  border-top: 1px solid rgba(255,255,255,.18);
  max-width: 850px;
}
.hero-meta div { display: grid; gap: 4px; }
.hero-meta span { color: #99938a; font-size: 10px; letter-spacing: .13em; text-transform: uppercase; }
.hero-meta strong { font-size: 12px; font-weight: 500; color: #e9e5dc; }
.scroll-cue {
  position: absolute;
  z-index: 3;
  inset-inline-end: max(24px, calc((100vw - min(1280px, calc(100vw - 48px))) / 2));
  bottom: 43px;
  color: #d7d1c8;
  text-decoration: none;
  font-size: 10px;
  letter-spacing: .13em;
  display: flex;
  align-items: center;
  gap: 12px;
  transform: rotate(-90deg) translateX(100%);
  transform-origin: right bottom;
}
.scroll-cue i { width: 48px; height: 1px; background: currentColor; position: relative; overflow: hidden; }
.scroll-cue i::after {
  content: "";
  position: absolute;
  width: 20px; height: 100%;
  background: #d7b47a;
  animation: cue 1.8s ease-in-out infinite;
}
@keyframes cue { from { left: -25px; } to { left: 55px; } }

.marquee-band {
  border-block: 1px solid var(--line);
  overflow: hidden;
  padding: 16px 0;
  background: var(--surface);
}
.marquee-track {
  width: max-content;
  display: flex;
  align-items: center;
  gap: 26px;
  white-space: nowrap;
  animation: marquee 26s linear infinite;
  color: var(--muted);
  font-size: 11px;
  letter-spacing: .18em;
}
.marquee-track b { color: var(--accent); font-weight: 400; }
@keyframes marquee { to { transform: translateX(-50%); } }
html[dir="rtl"] .marquee-track { animation-direction: reverse; }

.about-grid {
  display: grid;
  grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
  gap: 80px;
  align-items: start;
}
.about-copy { padding-top: 8px; }
.about-copy p { color: var(--muted); max-width: 760px; }
.about-copy .large-copy {
  margin: 0 0 24px;
  color: var(--text);
  font-size: clamp(23px, 3vw, 38px);
  line-height: 1.45;
  letter-spacing: -.025em;
}
.about-pills { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 34px; }
.about-pills span {
  padding: 10px 14px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  font-size: 12px;
}
.image-statement {
  margin-top: 80px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 18px;
  align-items: stretch;
}
.statement-main {
  margin: 0;
  min-height: 650px;
  overflow: hidden;
  border-radius: var(--radius);
}
.statement-main img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--ease); }
.image-statement:hover .statement-main img { transform: scale(1.025); }
.statement-card {
  position: relative;
  margin: 0;
  padding: 34px;
  border-radius: var(--radius);
  background: var(--accent);
  color: var(--accent-ink);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}
.statement-card > span { position: absolute; top: 28px; inset-inline-start: 30px; font-size: 12px; letter-spacing: .15em; }
.statement-card h3 { margin: 0 0 16px; font-size: 30px; line-height: 1.18; font-weight: 600; letter-spacing: -.03em; }
.statement-card p { margin: 0; opacity: .78; font-size: 14px; }

.services { background: var(--bg-soft); border-block: 1px solid var(--line); }
.services-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.service-card {
  position: relative;
  min-height: 360px;
  overflow: hidden;
  padding: 30px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--surface) 92%, transparent), color-mix(in srgb, var(--surface-2) 50%, transparent));
  box-shadow: 0 0 0 rgba(0,0,0,0);
  transform-style: preserve-3d;
  transition: transform .18s ease, border-color .3s ease, box-shadow .3s ease;
}
.service-card::before {
  content: "";
  position: absolute;
  width: 220px; height: 220px;
  top: var(--glow-y, 50%); left: var(--glow-x, 50%);
  transform: translate(-50%,-50%);
  border-radius: 50%;
  background: radial-gradient(circle, color-mix(in srgb, var(--accent) 14%, transparent), transparent 68%);
  opacity: 0;
  transition: opacity .25s ease;
  pointer-events: none;
}
.service-card:hover { border-color: color-mix(in srgb, var(--accent) 45%, var(--line)); box-shadow: var(--shadow); }
.service-card:hover::before { opacity: 1; }
.service-num { display: block; color: var(--muted); font-size: 10px; letter-spacing: .18em; }
.service-icon { margin: 52px 0 28px; color: var(--accent); font-size: 38px; line-height: 1; }
.service-card h3 { margin: 0; font-size: 21px; line-height: 1.35; font-weight: 560; }
.service-card p { margin: 16px 0 0; color: var(--muted); font-size: 13px; }
.service-tag {
  position: absolute;
  bottom: 25px;
  inset-inline-start: 30px;
  color: var(--muted);
  font-size: 9px;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.process { margin-top: 66px; border-top: 1px solid var(--line); }
.process-step {
  display: grid;
  grid-template-columns: 110px minmax(0,1fr);
  gap: 30px;
  padding: 35px 0;
  border-bottom: 1px solid var(--line);
  transition: padding-inline .3s var(--ease), background .3s ease;
}
.process-step:hover { padding-inline: 18px; background: color-mix(in srgb, var(--surface) 40%, transparent); }
.process-step > span { color: var(--accent); font-size: 12px; letter-spacing: .12em; }
.process-step div { display: grid; grid-template-columns: minmax(180px,.55fr) 1fr; gap: 40px; }
.process-step h3 { margin: 0; font-size: clamp(25px, 3vw, 38px); font-weight: 520; }
.process-step p { margin: 7px 0 0; color: var(--muted); max-width: 650px; }

.gallery { background: var(--surface); }
.gallery-grid {
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  grid-auto-rows: 340px;
  gap: 14px;
}
.gallery-item {
  position: relative;
  margin: 0;
  overflow: hidden;
  border-radius: 22px;
  background: var(--bg-soft);
}
.gallery-item img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--ease), filter .8s ease; }
.gallery-item::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg, rgba(0,0,0,.68), transparent 55%); }
.gallery-item:hover img { transform: scale(1.045); filter: saturate(.86); }
.gallery-tall { grid-row: span 2; }
.gallery-wide { grid-column: span 1; }
.gallery-item figcaption {
  position: absolute;
  z-index: 2;
  inset-inline: 26px;
  bottom: 24px;
  color: #fff;
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 20px;
}
.gallery-item figcaption span { font-size: 20px; font-weight: 560; }
.gallery-item figcaption small { color: rgba(255,255,255,.7); font-size: 9px; letter-spacing: .16em; }

.riyadh-panel { overflow: hidden; }
.riyadh-grid {
  min-height: 590px;
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  border: 1px solid var(--line);
  border-radius: 32px;
  overflow: hidden;
  background: var(--surface);
}
.riyadh-art {
  position: relative;
  overflow: hidden;
  min-height: 520px;
  display: grid;
  place-items: center;
  background:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px),
    var(--bg-soft);
  background-size: 52px 52px;
}
.riyadh-art::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at center, color-mix(in srgb, var(--accent) 24%, transparent), transparent 48%);
}
.riyadh-art > span { position: relative; z-index: 3; color: var(--accent); font-size: 11px; letter-spacing: .16em; text-align: center; }
.riyadh-ring { position: absolute; border: 1px solid var(--accent); border-radius: 50%; opacity: .45; animation: rings 9s ease-in-out infinite; }
.ring-one { width: 300px; height: 300px; }
.ring-two { width: 430px; height: 430px; animation-delay: -4.5s; opacity: .18; }
@keyframes rings { 50% { transform: scale(1.08); opacity: .16; } }
.riyadh-copy { padding: clamp(42px, 7vw, 95px); align-self: center; }
.riyadh-copy h2 { margin: 0 0 24px; font-size: clamp(38px, 5vw, 67px); line-height: 1.05; font-weight: 520; letter-spacing: -.045em; }
.riyadh-copy > p:not(.kicker) { color: var(--muted); max-width: 630px; }
.text-link { display: inline-block; margin-top: 20px; color: var(--accent); text-decoration: none; border-bottom: 1px solid currentColor; padding-bottom: 5px; font-size: 13px; }

.faq-grid { display: grid; grid-template-columns: .72fr 1.28fr; gap: 80px; align-items: start; }
.accordion { border-top: 1px solid var(--line); }
.faq-item { border-bottom: 1px solid var(--line); }
.faq-item summary {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  cursor: pointer;
  padding: 25px 0;
  font-size: 18px;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary b { color: var(--accent); font-size: 25px; font-weight: 300; transition: transform .25s ease; }
.faq-item[open] summary b { transform: rotate(45deg); }
.faq-item p { margin: -5px 0 28px; max-width: 780px; color: var(--muted); }

.contact { background: var(--bg-soft); border-top: 1px solid var(--line); }
.contact-grid { display: grid; grid-template-columns: .78fr 1.22fr; gap: clamp(45px, 8vw, 110px); }
.contact-intro h2 { margin: 0; font-size: clamp(42px, 5.5vw, 76px); line-height: 1.02; letter-spacing: -.05em; font-weight: 520; }
.contact-intro > p:not(.kicker) { color: var(--muted); max-width: 570px; }
.contact-details { display: grid; gap: 10px; margin-top: 45px; }
.contact-details a, .contact-details > div {
  display: grid;
  gap: 3px;
  padding: 18px 0;
  border-top: 1px solid var(--line);
  text-decoration: none;
}
.contact-details small { color: var(--muted); }
.contact-details strong { font-size: 14px; font-weight: 560; overflow-wrap: anywhere; }

.contact-form {
  position: relative;
  padding: clamp(26px, 5vw, 52px);
  border: 1px solid var(--line);
  border-radius: 28px;
  background: var(--surface);
  box-shadow: var(--shadow);
}
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.contact-form label { display: grid; gap: 9px; margin-bottom: 18px; color: var(--muted); font-size: 12px; }
.contact-form input, .contact-form textarea, .contact-form select {
  width: 100%;
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  padding: 13px 0;
  outline: 0;
  color: var(--text);
  background: transparent;
  transition: border-color .2s ease;
}
.contact-form textarea { resize: vertical; min-height: 145px; }
.contact-form select { color-scheme: dark; }
html[data-theme="light"] .contact-form select, html[data-theme="sand"] .contact-form select { color-scheme: light; }
.contact-form input:focus, .contact-form textarea:focus, .contact-form select:focus { border-color: var(--accent); }
.contact-form input:focus-visible, .contact-form textarea:focus-visible, .contact-form select:focus-visible,
button:focus-visible, a:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.hp-field { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.form-footer { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; margin-top: 12px; }
.form-status { margin: 0; color: var(--muted); font-size: 12px; }
.form-status.is-success { color: #78b989; }
.form-status.is-error { color: #d88c78; }
.btn[disabled] { opacity: .58; cursor: wait; transform: none; }

.footer { padding: 55px 0 24px; background: var(--bg); border-top: 1px solid var(--line); }
.footer-top {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 30px;
  align-items: center;
}
.footer-top > p { color: var(--muted); text-align: center; }
.footer-top > a:not(.brand) { text-align: end; color: var(--muted); text-decoration: none; overflow-wrap: anywhere; }
.footer-bottom {
  margin-top: 44px;
  padding-top: 22px;
  border-top: 1px solid var(--line);
  display: flex;
  justify-content: space-between;
  gap: 20px;
  color: var(--muted);
  font-size: 11px;
}
.noscript { position: fixed; bottom: 0; inset-inline: 0; z-index: 5000; padding: 12px; background: #8d2d2d; color: #fff; text-align: center; }

.reveal {
  opacity: 0;
  transform: translateY(32px);
  transition: opacity .8s var(--ease), transform .8s var(--ease);
}
.reveal.is-visible { opacity: 1; transform: translateY(0); }

html[dir="ltr"] .hero-title { letter-spacing: -.065em; }
html[dir="ltr"] .kicker { letter-spacing: .14em; }

@media (max-width: 1120px) {
  .desktop-nav { display: none; }
  .menu-toggle { display: grid; }
  .mobile-menu { display: block; }
  .nav-cta { display: none; }
  .services-grid { grid-template-columns: repeat(2, 1fr); }
  .about-grid, .faq-grid { grid-template-columns: 1fr; gap: 45px; }
}

@media (max-width: 820px) {
  .shell { width: min(100% - 28px, 1280px); }
  .section { padding: 82px 0; }
  .nav-shell { height: 78px; }
  .mobile-menu { inset-block-start: 78px; }
  .theme-picker { display: none; }
  .hero-content { padding-top: 130px; padding-bottom: 92px; }
  .hero-title { font-size: clamp(52px, 16vw, 86px); }
  .hero-meta { flex-direction: column; gap: 14px; margin-top: 45px; }
  .scroll-cue { display: none; }
  .split-heading, .image-statement, .riyadh-grid, .contact-grid { grid-template-columns: 1fr; }
  .split-heading { gap: 26px; margin-bottom: 42px; }
  .image-statement { margin-top: 52px; }
  .statement-main { min-height: 430px; }
  .statement-card { min-height: 300px; }
  .gallery-grid { grid-template-columns: 1fr; grid-auto-rows: 390px; }
  .gallery-tall { grid-row: auto; }
  .riyadh-art { min-height: 390px; }
  .process-step { grid-template-columns: 52px 1fr; }
  .process-step div { grid-template-columns: 1fr; gap: 8px; }
  .footer-top { grid-template-columns: 1fr; }
  .footer-top > p, .footer-top > a:not(.brand) { text-align: start; }
}

@media (max-width: 590px) {
  .brand-copy small { display: none; }
  .brand-mark { width: 36px; height: 36px; }
  .nav-actions { gap: 7px; }
  .lang-toggle { min-width: 42px; height: 38px; }
  .menu-toggle { width: 38px; height: 38px; }
  .hero-grid { background-size: 72px 72px; }
  .hero-lead { font-size: 15px; }
  .hero-actions .btn { width: 100%; }
  .services-grid { grid-template-columns: 1fr; }
  .service-card { min-height: 330px; }
  .form-row { grid-template-columns: 1fr; gap: 0; }
  .contact-form { padding: 25px 20px; }
  .footer-bottom { flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
  .hero-media { transform: none !important; }
}
/* Keep header readable over bright hero photography before scroll. */
.site-header:not(.is-scrolled) .desktop-nav a,
.site-header:not(.is-scrolled) .brand-copy strong,
.site-header:not(.is-scrolled) .brand-copy small { color: rgba(255,255,255,.88); text-shadow:0 1px 14px rgba(0,0,0,.32); }
.site-header:not(.is-scrolled) .desktop-nav.rail,
.site-header:not(.is-scrolled) .theme-picker,
.site-header:not(.is-scrolled) .lang-toggle { background:rgba(13,12,9,.34); border-color:rgba(255,255,255,.16); }
.site-header:not(.is-scrolled) .lang-toggle,
.site-header:not(.is-scrolled) .theme-dot { color:#fff; }

/* ASALAH v4 visual refinement */
:root{--font-ar:"Noto Sans Arabic",Tahoma,Arial,sans-serif;--font-ar-display:"Noto Kufi Arabic","Noto Sans Arabic",Tahoma,sans-serif;--font-en:"Manrope","Segoe UI",Arial,sans-serif;--font:var(--font-ar);--font-display:var(--font-ar-display);--bg:#0d0c0a;--bg-soft:#14120f;--surface:#191612;--surface-2:#211d18;--text:#f5f1e9;--muted:#aaa399;--line:rgba(245,241,233,.12);--accent:#cda56d;--accent-strong:#e4c38f;--accent-ink:#17120c;--header:rgba(13,12,10,.78);--shadow:0 30px 80px rgba(0,0,0,.34)}
html[data-theme=light]{--bg:#fbfbf8;--bg-soft:#f5f5f1;--surface:#ffffff;--surface-2:#eeeeea;--text:#171816;--muted:#6b6d68;--line:rgba(23,24,22,.12);--accent:#a87438;--accent-strong:#805329;--accent-ink:#ffffff;--header:rgba(251,251,248,.90);--shadow:0 24px 68px rgba(24,24,22,.09)}
html[data-theme=sand]{--bg:#d8c5a9;--bg-soft:#cbb493;--surface:#e6d6bf;--surface-2:#bfa27c;--text:#241b13;--muted:#675746;--line:rgba(36,27,19,.15);--accent:#76502e;--accent-strong:#52351f;--accent-ink:#fff6e9;--header:rgba(216,197,169,.9);--shadow:0 28px 72px rgba(67,43,22,.15)}
html[lang=ar] body,html[lang=ar] button,html[lang=ar] input,html[lang=ar] textarea,html[lang=ar] select{font-family:var(--font-ar)}html[lang=en] body,html[lang=en] button,html[lang=en] input,html[lang=en] textarea,html[lang=en] select{font-family:var(--font-en)}html[lang=ar] :is(h1,h2,h3,.brand-copy strong,.nav-cta,.desktop-nav a,.mobile-menu a){font-family:var(--font-ar-display)}html[lang=en] :is(h1,h2,h3,.brand-copy strong,.nav-cta,.desktop-nav a,.mobile-menu a){font-family:var(--font-en)}
.site-header{padding-top:12px}.nav-shell{height:72px;width:min(1380px,calc(100% - 34px));padding:8px 10px 8px 14px;border:1px solid rgba(255,255,255,.12);border-radius:22px;background:rgba(12,11,9,.54);box-shadow:0 14px 48px rgba(0,0,0,.12);backdrop-filter:blur(18px) saturate(135%);-webkit-backdrop-filter:blur(18px) saturate(135%)}.site-header.is-scrolled{background:transparent;border:0;backdrop-filter:none;-webkit-backdrop-filter:none}.site-header.is-scrolled .nav-shell{background:var(--header);border-color:var(--line);box-shadow:0 16px 50px rgba(0,0,0,.14)}.brand{min-width:176px}.brand-mark{width:38px;height:38px}.brand-copy strong{font-size:13px}
.desktop-nav.rail{position:relative;isolation:isolate;display:flex;align-items:stretch;gap:0;padding:4px;border:1px solid rgba(255,255,255,.13);border-radius:999px;background:rgba(5,5,4,.24);overflow:hidden}.desktop-nav.rail .pill{position:absolute;z-index:-1;top:4px;bottom:4px;left:4px;width:0;border-radius:999px;background:rgba(255,255,255,.13);box-shadow:inset 0 1px 0 rgba(255,255,255,.12);transition:left .4s cubic-bezier(.65,0,.35,1),width .4s cubic-bezier(.65,0,.35,1),background .25s ease;pointer-events:none}.desktop-nav.rail a{z-index:1;min-width:86px;padding:9px 15px;border-radius:999px;text-align:center;color:rgba(255,255,255,.78);font-size:12px;font-weight:500;white-space:nowrap}.desktop-nav.rail a::after{display:none}.desktop-nav.rail a:hover,.desktop-nav.rail a.is-active{color:#fff}.site-header.is-scrolled .desktop-nav.rail a{color:var(--muted);text-shadow:none}.site-header.is-scrolled .desktop-nav.rail a:hover,.site-header.is-scrolled .desktop-nav.rail a.is-active{color:var(--text)}
.nav-actions{min-width:286px;justify-content:flex-end}.theme-picker{position:relative;gap:5px;padding:5px 7px;height:42px;overflow:visible}.theme-dot{width:28px;height:28px;display:grid;place-items:center;opacity:.75;transform-origin:bottom center;transition:transform .26s cubic-bezier(.16,1,.3,1),opacity .2s ease,background .2s ease}.theme-swatch{width:13px;height:13px;border-radius:50%;border:1px solid rgba(255,255,255,.34);box-shadow:0 1px 8px rgba(0,0,0,.16)}.theme-swatch-dark{background:#15130f}.theme-swatch-light{background:#f6f6f2;border-color:rgba(0,0,0,.2)}.theme-swatch-sand{background:#c5a77e;border-color:rgba(0,0,0,.12)}.dock button:hover{transform:translateY(-10px) scale(1.28);opacity:1}.dock button:has(+ button:hover),.dock button:hover+button{transform:translateY(-5px) scale(1.11);opacity:.92}.theme-dot.is-active{opacity:1;background:rgba(255,255,255,.12)}.lang-toggle{height:40px;min-width:48px}.nav-cta{padding:10px 16px}
.hero-content{padding-bottom:clamp(86px,10vh,126px)}.hero-title{max-width:1040px;font-size:clamp(54px,7.4vw,118px);line-height:1.02;font-weight:600}.hero-title em{color:#d7b47a;font-family:inherit;font-style:normal;font-weight:500;line-height:1.08}.hero-lead{max-width:760px;margin-top:28px}
.studio-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:34px}.studio-facts article{min-height:92px;padding:17px 18px;display:grid;align-content:center;gap:7px;border:1px solid var(--line);border-radius:18px;background:color-mix(in srgb,var(--surface) 70%,transparent);transition:transform .3s var(--ease),border-color .3s ease}.studio-facts article:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--accent) 42%,var(--line))}.studio-facts span{color:var(--accent);font-size:10px;font-weight:700;letter-spacing:.12em}.studio-facts strong{color:var(--text);font-size:13px;font-weight:600}
.marquee-band{position:relative;z-index:2;padding:17px 0;border-block:1px solid var(--line);background:var(--bg);overflow:hidden}.marquee-track{display:flex;width:max-content;min-width:200%;align-items:center;gap:0;animation:marqueeV4 32s linear infinite;will-change:transform}.marquee-group{flex:0 0 auto;display:flex;align-items:center;gap:clamp(18px,2.4vw,38px);padding-inline-end:clamp(18px,2.4vw,38px);white-space:nowrap;direction:ltr}.marquee-group span{font-family:var(--font-en);font-size:11px;letter-spacing:.18em;color:var(--muted)}.marquee-group b{color:var(--accent);font-size:10px}@keyframes marqueeV4{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}html[dir=rtl] .marquee-track{animation-direction:reverse}
.approach{position:relative;overflow:hidden;background:#0f0e0c;color:#f5f1e9;border-block:1px solid rgba(255,255,255,.08)}html[data-theme=light] .approach,html[data-theme=sand] .approach{background:#17130f}.approach-shell{position:relative;z-index:2}.approach-heading{display:grid;grid-template-columns:.45fr 1fr;align-items:end;gap:40px;margin-bottom:48px}.approach-heading .kicker{margin-bottom:9px}.approach-heading h2{color:#f7f2e9;max-width:780px}.process-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.process-card{position:relative;min-height:370px;padding:26px 24px 28px;display:flex;flex-direction:column;border:1px solid rgba(255,255,255,.12);border-radius:24px;background:linear-gradient(160deg,rgba(255,255,255,.075),rgba(255,255,255,.025));overflow:hidden;transition:transform .38s cubic-bezier(.16,1,.3,1),border-color .3s ease,background .3s ease}.process-card:hover{transform:translateY(-10px);border-color:rgba(205,165,109,.55);background:linear-gradient(160deg,rgba(205,165,109,.14),rgba(255,255,255,.025))}.process-num{color:rgba(255,255,255,.48);font-family:var(--font-en);font-size:11px;letter-spacing:.16em}.process-icon{width:66px;height:66px;display:grid;place-items:center;margin-top:55px;border:1px solid rgba(205,165,109,.32);border-radius:50%;color:#d9b57f;font-family:var(--font-en);font-size:12px;transition:transform .45s cubic-bezier(.16,1,.3,1),background .3s ease}.process-card:hover .process-icon{transform:rotate(-8deg) scale(1.08);background:rgba(205,165,109,.1)}.process-card h3{margin:auto 0 9px;color:#fff;font-size:clamp(25px,2vw,34px);font-weight:600}.process-card p{margin:0;color:rgba(245,241,233,.62);font-size:13px;line-height:1.9}.process-rule{position:absolute;inset-inline:24px;bottom:0;height:2px;transform:scaleX(.24);transform-origin:left;background:#cda56d;transition:transform .45s cubic-bezier(.16,1,.3,1)}.process-card:hover .process-rule{transform:scaleX(1)}
.vector{position:absolute;inset:0;pointer-events:none;opacity:.9}.vector i{position:absolute;width:5px;height:5px;border:1px solid rgba(205,165,109,.7);border-radius:50%;translate:var(--x) var(--y);transition:translate .6s cubic-bezier(.16,1,.3,1)}.vector i.hit{animation:recall 5.6s cubic-bezier(.16,1,.3,1) infinite}.vector i:nth-child(1){left:12%;top:22%;--x:-38px;--y:-18px}.vector i:nth-child(2){left:24%;top:72%;--x:-20px;--y:26px}.vector i:nth-child(3){left:38%;top:17%;--x:18px;--y:-24px}.vector i:nth-child(4){left:51%;top:64%;--x:32px;--y:18px}.vector i:nth-child(5){left:68%;top:23%;--x:44px;--y:-6px}.vector i:nth-child(6){left:82%;top:76%;--x:18px;--y:30px}.vector i:nth-child(7){left:91%;top:35%;--x:-22px;--y:-12px}.vector i:nth-child(8){left:7%;top:84%;--x:20px;--y:14px}.vector i:nth-child(9){left:59%;top:41%;--x:-26px;--y:18px}.vector i:nth-child(10){left:33%;top:46%;--x:14px;--y:-20px}.vector i:nth-child(11){left:76%;top:53%;--x:-16px;--y:16px}.vector i:nth-child(12){left:45%;top:86%;--x:24px;--y:-14px}@keyframes recall{0%,30%{translate:var(--x) var(--y);opacity:.35}52%,78%{translate:calc(var(--x)*.34) calc(var(--y)*.34);opacity:1}100%{translate:var(--x) var(--y);opacity:.35}}
.riyadh-grid{min-height:610px;grid-template-columns:1.2fr .8fr;border-radius:30px;background:var(--surface);box-shadow:var(--shadow)}.riyadh-map{position:relative;min-height:610px;overflow:hidden;background:var(--surface-2)}.riyadh-map iframe{position:absolute;inset:0;width:100%;height:100%;border:0;filter:grayscale(.45) sepia(.16) contrast(.95)}html[data-theme=dark] .riyadh-map iframe{filter:grayscale(.55) sepia(.22) contrast(.9) brightness(.75)}.map-shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,transparent 50%,color-mix(in srgb,var(--surface) 54%,transparent))}html[dir=ltr] .map-shade{background:linear-gradient(270deg,transparent 50%,color-mix(in srgb,var(--surface) 54%,transparent))}.map-badge{position:absolute;inset-inline-start:22px;bottom:22px;display:grid;gap:4px;padding:13px 16px;border:1px solid rgba(255,255,255,.2);border-radius:14px;background:rgba(12,11,9,.7);backdrop-filter:blur(12px);color:#fff}.map-badge span{color:#d8b47b;font:600 10px/1 var(--font-en);letter-spacing:.18em}.map-badge strong{font:500 11px/1.5 var(--font-en)}.riyadh-copy{padding:clamp(42px,5.2vw,78px);position:relative;z-index:2}.riyadh-copy h2{font-size:clamp(36px,4.6vw,62px);line-height:1.14}.flare{position:absolute;z-index:3;left:50%;top:50%;width:180px;height:36px;transform:translate(-50%,-50%);pointer-events:none;mix-blend-mode:screen}.flare b{position:absolute;left:50%;top:17px;width:38px;height:2px;border-radius:99px;background:rgba(255,210,143,.85);box-shadow:0 0 16px rgba(255,196,107,.65);animation:flare-travel 6.4s cubic-bezier(.65,0,.35,1) infinite}.flare i,.flare em{position:absolute;left:50%;top:13px;width:92px;height:10px;border-radius:50%;background:radial-gradient(ellipse,rgba(255,214,155,.45),transparent 70%);animation:flare-bloom 6.4s ease-in-out infinite}.flare em{width:140px;opacity:.4}@keyframes flare-travel{0%{translate:-80px 0}100%{translate:80px 0}}@keyframes flare-bloom{0%,100%{opacity:.15;transform:scaleX(.4)}50%{opacity:1;transform:scaleX(1)}}
.contact{position:relative;overflow:hidden;background:var(--bg-soft)}.contact-grid{position:relative;z-index:2;grid-template-columns:.86fr 1.14fr;align-items:center}.contact-intro h2{font-size:clamp(40px,5vw,68px);line-height:1.14}.contact-orbit{position:absolute;width:520px;height:520px;inset-inline-start:-210px;top:50%;transform:translateY(-50%);opacity:.22;pointer-events:none}.contact-orbit span{position:absolute;inset:0;border:1px solid var(--accent);border-radius:50%;animation:orbitPulse 7s ease-in-out infinite}.contact-orbit span:last-child{inset:86px;animation-delay:-3.5s}@keyframes orbitPulse{50%{transform:scale(1.08);opacity:.28}}.contact-details{grid-template-columns:1fr 1fr;gap:10px;margin-top:34px}.contact-details .contact-detail{min-height:112px;display:flex;align-items:center;gap:14px;padding:16px;border:1px solid var(--line);border-radius:18px;background:color-mix(in srgb,var(--surface) 72%,transparent);text-decoration:none;transition:transform .3s var(--ease),border-color .3s ease}.contact-details .contact-detail:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--accent) 45%,var(--line))}.contact-detail-icon{flex:0 0 auto;width:38px;height:38px;display:grid;place-items:center;border:1px solid color-mix(in srgb,var(--accent) 44%,var(--line));border-radius:50%;color:var(--accent);font:600 14px/1 var(--font-en)}.contact-detail>span:last-child{min-width:0;display:grid;gap:5px}.contact-detail small{color:var(--muted);font-size:10px}.contact-detail strong{color:var(--text);font-size:12px;overflow-wrap:anywhere}
.contact-form{padding:clamp(28px,4vw,48px);border-color:color-mix(in srgb,var(--accent) 20%,var(--line));border-radius:28px;background:color-mix(in srgb,var(--surface) 94%,transparent);box-shadow:0 32px 80px color-mix(in srgb,var(--accent) 8%,rgba(0,0,0,.28))}.form-row{gap:14px}.field{position:relative;min-height:66px;margin-bottom:16px}.contact-form .field>label{position:absolute;z-index:2;inset-inline-start:14px;top:50%;transform:translateY(-50%);margin:0;padding:0 5px;color:var(--muted);background:var(--surface);pointer-events:none;transform-origin:center;transition:transform .2s cubic-bezier(.16,1,.3,1),color .2s,font-size .2s,top .2s ease}.contact-form .field :is(input,textarea,select){width:100%;height:64px;border:1px solid var(--line);border-radius:15px;padding:19px 14px 8px;outline:0;color:var(--text);background:transparent;transition:border-color .22s ease,box-shadow .22s ease}.contact-form .field input:focus,.contact-form .field input:not(:placeholder-shown),.contact-form .field textarea:focus,.contact-form .field textarea:not(:placeholder-shown){border-color:color-mix(in srgb,var(--accent) 62%,var(--line))}.contact-form .field input:focus+label,.contact-form .field input:not(:placeholder-shown)+label,.contact-form .field textarea:focus+label,.contact-form .field textarea:not(:placeholder-shown)+label{top:0;transform:translateY(-50%) scale(.84);color:var(--accent)}.contact-form .field :is(input,textarea,select):focus{box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 10%,transparent)}.contact-form .field-textarea{min-height:154px}.contact-form .field textarea{height:154px;min-height:154px;padding-top:24px;resize:vertical}.contact-form .field-textarea>label{top:32px}.contact-form .field-textarea textarea:focus+label,.contact-form .field-textarea textarea:not(:placeholder-shown)+label{top:0}.contact-form .select-field select{padding-top:24px;color:var(--text)}.contact-form .select-field>label{top:0;transform:translateY(-50%) scale(.84);color:var(--accent)}.contact-form input[type=email]{direction:ltr;text-align:left}.notify{position:fixed;z-index:5000;top:96px;left:50%;min-width:min(420px,calc(100vw - 32px));max-width:calc(100vw - 32px);padding:14px 18px;border:1px solid color-mix(in srgb,var(--accent) 38%,var(--line));border-radius:14px;background:var(--surface);color:var(--text);box-shadow:var(--shadow);text-align:center;transform:translate(-50%,-160%);opacity:0;transition:transform .55s cubic-bezier(.18,1.25,.4,1),opacity .3s}.notify.show{transform:translate(-50%,0);opacity:1}.notify.is-error{border-color:rgba(205,93,77,.52)}
@media(max-width:1180px){.nav-actions{min-width:auto}.desktop-nav.rail a{min-width:76px;padding-inline:12px}.process-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.process-card{min-height:310px}}@media(max-width:1120px){.site-header{padding-top:8px}.nav-shell{width:min(100% - 22px,1380px);height:66px}.brand{min-width:0}.nav-actions{min-width:0}.mobile-menu{inset-block-start:82px;margin-inline:11px;border:1px solid var(--line);border-radius:22px;background:var(--header);backdrop-filter:blur(18px);overflow-y:auto}}@media(max-width:820px){.hero-title{font-size:clamp(48px,14vw,78px);line-height:1.08}.studio-facts{grid-template-columns:1fr}.approach-heading{grid-template-columns:1fr;gap:12px}.riyadh-grid{grid-template-columns:1fr}.riyadh-map{min-height:430px;order:2}.riyadh-copy{order:1}.map-shade{display:none}.contact-grid{grid-template-columns:1fr}.contact-details{grid-template-columns:1fr 1fr}}@media(max-width:590px){.theme-picker{display:none}.hero-content{padding-top:128px;padding-bottom:78px}.hero-title{font-size:clamp(45px,14vw,67px)}.hero-lead{font-size:14px;line-height:1.9}.process-grid{grid-template-columns:1fr}.process-card{min-height:285px}.process-icon{margin-top:34px}.riyadh-map{min-height:360px}.contact-details{grid-template-columns:1fr}.contact-form{padding:24px 16px;border-radius:22px}.form-row{grid-template-columns:1fr;gap:0}.field{margin-bottom:14px}.contact-form .field>label{font-size:11px}.notify{top:82px}}@media(prefers-reduced-motion:reduce){.marquee-track,.vector i.hit,.flare b,.flare i,.flare em,.contact-orbit span{animation:none!important}.dock button:hover,.dock button:has(+ button:hover),.dock button:hover+button{transform:none}}
html[dir="rtl"] .process-rule{transform-origin:right}html[dir="ltr"] .process-rule{transform-origin:left}

/* ASALAH v5 interaction, layout and theme refinement */
html[data-theme=purple]{--bg:#21172a;--bg-soft:#291f32;--surface:#33253e;--surface-2:#432f50;--text:#f7f1fa;--muted:#b9a9c0;--line:rgba(247,241,250,.13);--accent:#c39ad6;--accent-strong:#e0b9ef;--accent-ink:#21172a;--header:rgba(33,23,42,.88);--shadow:0 28px 76px rgba(15,7,20,.34)}
html[data-theme=gray]{--bg:#d9dadd;--bg-soft:#cdd0d3;--surface:#f2f3f4;--surface-2:#b9bdc1;--text:#202225;--muted:#62676c;--line:rgba(32,34,37,.14);--accent:#555c65;--accent-strong:#343a41;--accent-ink:#fff;--header:rgba(231,232,234,.91);--shadow:0 26px 70px rgba(38,42,46,.13)}
.theme-swatch-purple{background:#6f4a7e;border-color:rgba(255,255,255,.22)}
.theme-swatch-gray{background:#9da1a6;border-color:rgba(0,0,0,.18)}

/* Larger reliable click targets and a pill that never intercepts navigation. */
.desktop-nav.rail{isolation:isolate;z-index:1}
.desktop-nav.rail .pill{z-index:0;pointer-events:none}
.desktop-nav.rail a{position:relative;z-index:2;display:grid;place-items:center;min-height:38px;touch-action:manipulation;cursor:pointer;user-select:none}
.desktop-nav.rail a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
section[id]{scroll-margin-top:108px}

/* Replace the old rotated Discover cue with a compact centered scroll control. */
.scroll-cue{inset-inline:auto;left:50%;bottom:25px;transform:translateX(-50%);transform-origin:center;min-height:42px;padding:7px 12px 7px 14px;border:1px solid rgba(255,255,255,.18);border-radius:999px;background:rgba(10,9,8,.32);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:#eee9df;font-size:10px;letter-spacing:.07em;gap:10px;white-space:nowrap;transition:transform .28s var(--ease),background .28s ease,border-color .28s ease}
.scroll-cue:hover{transform:translateX(-50%) translateY(-4px);background:rgba(10,9,8,.5);border-color:rgba(215,180,122,.45)}
.scroll-cue i{width:28px;height:28px;border:1px solid rgba(255,255,255,.2);border-radius:50%;background:transparent;overflow:hidden}
.scroll-cue i::before{content:"↓";position:absolute;inset:0;display:grid;place-items:center;color:#d7b47a;font:600 13px/1 var(--font-en);animation:scrollArrow 1.8s ease-in-out infinite}
.scroll-cue i::after{display:none}
@keyframes scrollArrow{0%,100%{transform:translateY(-2px);opacity:.55}50%{transform:translateY(3px);opacity:1}}

/* Keep the two service-heading lines visually connected instead of split across the page. */
.services .split-heading{display:block;max-width:940px;margin-inline:auto;margin-bottom:54px;text-align:start}
.services .split-heading>div{max-width:900px}
.services .split-heading>p{max-width:680px;margin:18px 0 0;font-size:16px;line-height:2}
html[dir=rtl] .services .split-heading>p{margin-inline-start:auto}
html[dir=ltr] .services .split-heading>p{margin-inline-end:auto}

/* Project actions added by the secure gallery JSON loader. */
.gallery-item figcaption{align-items:flex-end}
.gallery-caption-copy{display:grid;gap:4px;min-width:0}
.gallery-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:7px}
.gallery-actions a{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:7px 10px;border:1px solid rgba(255,255,255,.27);border-radius:999px;background:rgba(12,11,9,.45);color:#fff;text-decoration:none;font-size:10px;backdrop-filter:blur(10px);transition:transform .2s ease,background .2s ease,border-color .2s ease}
.gallery-actions a:hover{transform:translateY(-2px);background:rgba(12,11,9,.7);border-color:rgba(215,180,122,.55)}

/* Contact details: one email, one phone and one Riyadh city card. */
.contact-details{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.contact-detail-phone strong{font-family:var(--font-en);letter-spacing:.035em}

/* Theme controls remain available on mobile inside the opened menu. */
.mobile-themes{display:none;margin-top:22px;padding-top:20px;border-top:1px solid var(--line);gap:8px}
.mobile-themes button{width:42px;height:42px;padding:0;border:1px solid var(--line);border-radius:50%;background:var(--surface);display:grid;place-items:center;color:var(--text)}
.mobile-themes button.is-active{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 10%,transparent)}
.mobile-themes .theme-swatch{width:18px;height:18px}

@media(max-width:1120px){
  .mobile-themes{display:flex}
  .desktop-nav.rail{display:none}
}
@media(max-width:820px){
  .services .split-heading{margin-bottom:38px}
  .contact-details{grid-template-columns:1fr 1fr}
  .contact-details .contact-detail-phone{grid-column:1/-1}
  .gallery-item figcaption{align-items:flex-start;flex-direction:column}
  .gallery-actions{justify-content:flex-start}
}
@media(max-width:590px){
  .contact-details{grid-template-columns:1fr}
  .contact-details .contact-detail-phone{grid-column:auto}
  .mobile-menu{padding-bottom:max(28px,env(safe-area-inset-bottom))}
}
@media(prefers-reduced-motion:reduce){.scroll-cue i::before{animation:none}}
.footer-contact{display:grid;gap:5px;text-align:end}.footer-contact a{color:inherit;text-decoration:none;transition:color .2s ease}.footer-contact a:first-child{font-family:var(--font-en);font-size:15px;font-weight:700;letter-spacing:.04em;color:var(--accent)}.footer-contact a:hover{color:var(--accent)}
@media(max-width:820px){.footer-contact{text-align:start}}
@media(max-width:820px){.contact-details{grid-template-columns:1fr}.contact-details .contact-detail-phone{grid-column:auto}}
.footer-contact span{color:var(--muted);font-size:11px}
/* Contact layout: email + city together, phone as a clear full-width action. */
.contact-details{grid-template-columns:repeat(2,minmax(0,1fr))}
.contact-details .contact-detail-phone{grid-column:1/-1;min-height:88px}
@media(max-width:820px){.contact-details{grid-template-columns:1fr}.contact-details .contact-detail-phone{grid-column:auto}}

/* ASALAH v7 — gallery, mission/vision, moving hero, full theme and mobile polish */
:root{--font-ar:"Tajawal",Tahoma,Arial,sans-serif;--font-ar-display:"Tajawal",Tahoma,Arial,sans-serif;--font-en:"Montserrat","Segoe UI",Arial,sans-serif;--font:var(--font-ar);--font-display:var(--font-ar-display);--hero-overlay:rgba(8,8,7,.56);--hero-overlay-strong:rgba(8,8,7,.78)}
html[lang=ar] body,html[lang=ar] button,html[lang=ar] input,html[lang=ar] textarea,html[lang=ar] select{font-family:var(--font-ar)}html[lang=en] body,html[lang=en] button,html[lang=en] input,html[lang=en] textarea,html[lang=en] select{font-family:var(--font-en)}html[lang=ar] :is(h1,h2,h3,.brand-copy strong,.nav-cta,.desktop-nav a,.mobile-menu a){font-family:var(--font-ar-display);font-weight:600}
html[data-theme=dark]{--hero-overlay:rgba(8,8,7,.56);--hero-overlay-strong:rgba(8,8,7,.78)}html[data-theme=light]{--hero-overlay:rgba(23,18,12,.42);--hero-overlay-strong:rgba(23,18,12,.63)}html[data-theme=sand]{--hero-overlay:rgba(40,29,18,.44);--hero-overlay-strong:rgba(40,29,18,.64)}html[data-theme=purple]{--hero-overlay:rgba(25,12,31,.46);--hero-overlay-strong:rgba(25,12,31,.69)}html[data-theme=gray]{--hero-overlay:rgba(22,25,28,.46);--hero-overlay-strong:rgba(22,25,28,.69)}
body,.section,.marquee-band,.footer,.contact,.riyadh-panel,.gallery,.mission-vision{transition:background-color .45s var(--ease),color .45s var(--ease),border-color .45s var(--ease)}.services,.gallery,.riyadh-panel,.contact{background:var(--bg)}.about,.faq{background:var(--bg-soft)}.marquee-band{background:var(--surface);border-color:var(--line)}.footer{background:var(--surface);border-color:var(--line)}
.hero-media.hero-slideshow{position:absolute;inset:0;overflow:hidden;transform:none;background:#111}.hero-slide{position:absolute;inset:-3%;opacity:0;transform:scale(1.04);transition:opacity 1.25s cubic-bezier(.65,0,.35,1),transform 7.2s ease;will-change:opacity,transform}.hero-slide img{width:100%;height:100%;object-fit:cover;display:block}.hero-slide.is-active{opacity:1;transform:scale(1.12)}.hero-shade{background:linear-gradient(90deg,var(--hero-overlay-strong) 0%,var(--hero-overlay) 50%,rgba(0,0,0,.18) 100%)}html[dir=rtl] .hero-shade{background:linear-gradient(270deg,var(--hero-overlay-strong) 0%,var(--hero-overlay) 50%,rgba(0,0,0,.18) 100%)}.hero-grid{opacity:.28}
.desktop-nav.rail a{min-width:82px;padding-inline:14px}.nav-cta{white-space:nowrap}@media(max-width:1260px){.desktop-nav.rail a{min-width:72px;padding-inline:11px;font-size:11px}.nav-actions{min-width:252px}.brand{min-width:154px}}
.mission-vision{position:relative;overflow:hidden;background:var(--surface);border-block:1px solid var(--line)}.mv-shell{position:relative;z-index:2}.mv-heading{display:grid;grid-template-columns:.4fr 1fr;align-items:end;gap:34px;margin-bottom:46px}.mv-heading .kicker{margin:0 0 9px}.mv-heading h2{max-width:800px}.mv-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.mv-card{position:relative;min-height:360px;padding:34px clamp(26px,4vw,54px);display:flex;flex-direction:column;justify-content:flex-end;border:1px solid var(--line);border-radius:28px;background:linear-gradient(145deg,color-mix(in srgb,var(--surface-2) 74%,transparent),color-mix(in srgb,var(--surface) 92%,transparent));overflow:hidden;box-shadow:0 24px 70px color-mix(in srgb,var(--text) 5%,transparent);transition:transform .45s cubic-bezier(.16,1,.3,1),border-color .35s ease}.mv-card::before{content:"";position:absolute;width:240px;height:240px;border:1px solid color-mix(in srgb,var(--accent) 28%,transparent);border-radius:50%;top:-110px;inset-inline-end:-70px;transition:transform .65s cubic-bezier(.16,1,.3,1)}.mv-card:hover{transform:translateY(-8px);border-color:color-mix(in srgb,var(--accent) 54%,var(--line))}.mv-card:hover::before{transform:scale(1.16) translate(-10px,12px)}.mv-number{position:absolute;top:28px;inset-inline-start:30px;color:var(--accent);font-family:var(--font-en);font-size:11px;letter-spacing:.17em}.mv-card h3{margin:0 0 18px;font-size:clamp(32px,3.2vw,50px);line-height:1.1;color:var(--text)}.mv-card p{margin:0;max-width:640px;color:var(--muted);font-size:clamp(14px,1.2vw,17px);line-height:2.05}.mv-orbit{position:absolute;inset:0;pointer-events:none;opacity:.38}.mv-orbit i{position:absolute;border:1px solid color-mix(in srgb,var(--accent) 26%,transparent);border-radius:50%;width:440px;height:440px;inset-inline-start:-210px;top:-190px;animation:mvFloat 10s ease-in-out infinite}.mv-orbit i:nth-child(2){width:260px;height:260px;inset-inline-start:auto;inset-inline-end:-90px;top:auto;bottom:-110px;animation-delay:-3s}.mv-orbit i:nth-child(3){width:120px;height:120px;inset-inline-start:48%;top:18%;animation-delay:-6s}@keyframes mvFloat{50%{transform:translate3d(18px,14px,0) scale(1.04);opacity:.45}}
.gallery{background:var(--bg);overflow:hidden}.gallery .split-heading{margin-bottom:38px;align-items:end}.pilastro-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:auto;gap:18px}.pilastro-gallery .gallery-item{position:relative;grid-row:auto!important;grid-column:auto!important;min-height:0;aspect-ratio:16/10;border-radius:0;overflow:hidden;background:var(--surface);cursor:zoom-in;box-shadow:none}.pilastro-gallery .gallery-item:nth-child(3n+1){aspect-ratio:4/3}.pilastro-gallery .gallery-item img{width:100%;height:100%;object-fit:cover;transition:transform 1s cubic-bezier(.16,1,.3,1),filter .7s ease}.pilastro-gallery .gallery-item::after{content:"";position:absolute;z-index:1;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.67),rgba(0,0,0,.02) 62%);opacity:.8;transition:opacity .45s ease;pointer-events:none}.pilastro-gallery .gallery-item:hover img{transform:scale(1.055);filter:saturate(.94)}.pilastro-gallery .gallery-item:hover::after{opacity:1}.pilastro-gallery .gallery-item figcaption{position:absolute;z-index:3;inset-inline:0;bottom:0;padding:24px 26px;display:flex;justify-content:space-between;align-items:flex-end;gap:16px;color:#fff;pointer-events:none}.pilastro-gallery .gallery-caption-copy{display:grid;gap:4px}.pilastro-gallery .gallery-caption-copy span,.pilastro-gallery figcaption>span{font-size:clamp(18px,2vw,27px);font-weight:600}.pilastro-gallery .gallery-caption-copy small,.pilastro-gallery figcaption>small{font-family:var(--font-en);font-size:9px;letter-spacing:.16em;color:rgba(255,255,255,.7)}.pilastro-gallery .gallery-actions{pointer-events:auto;position:relative;z-index:4}.pilastro-gallery .gallery-actions a{border-color:rgba(255,255,255,.35);background:rgba(0,0,0,.34)}
.like-btn{position:absolute;z-index:6;top:18px;inset-inline-end:18px;width:44px;height:44px;display:grid;place-items:center;padding:0;border:1px solid rgba(255,255,255,.4);border-radius:50%;background:rgba(12,11,9,.36);color:#fff;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);cursor:pointer;overflow:visible;transition:transform .25s ease,background .25s ease,border-color .25s ease}.like-btn:hover{transform:translateY(-3px);background:rgba(12,11,9,.56)}.like-btn .heart{width:20px;height:20px;fill:transparent;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .3s cubic-bezier(.34,1.56,.64,1),fill .25s ease,stroke .25s ease}.like-btn.pop .heart{transform:scale(1.35)}.like-btn.liked .heart{fill:#FF8A00;stroke:#FF8A00}.particle{position:absolute;left:50%;top:50%;width:5px;height:5px;margin:-2.5px;border-radius:50%;background:#FF8A00;pointer-events:none;animation:fly .6s cubic-bezier(.16,1,.3,1) forwards}@keyframes fly{to{transform:translate(var(--tx),var(--ty)) scale(0);opacity:0}}.statement-main{position:relative}.statement-main .like-btn{top:18px;inset-inline-end:18px}
.gallery-lightbox{width:min(1180px,94vw);max-width:none;height:min(88vh,860px);padding:0;border:0;border-radius:22px;background:#0d0c0a;color:#fff;overflow:hidden;box-shadow:0 36px 120px rgba(0,0,0,.55)}.gallery-lightbox::backdrop{background:rgba(0,0,0,.82);backdrop-filter:blur(7px)}.gallery-lightbox figure{width:100%;height:100%;margin:0;display:grid;grid-template-rows:1fr auto}.gallery-lightbox img{width:100%;height:100%;object-fit:contain;min-height:0}.gallery-lightbox figcaption{padding:12px 64px 16px;text-align:center;color:rgba(255,255,255,.76);font-size:13px}.lightbox-close,.lightbox-nav{position:absolute;z-index:2;display:grid;place-items:center;border:1px solid rgba(255,255,255,.28);background:rgba(0,0,0,.38);color:#fff;backdrop-filter:blur(10px);cursor:pointer}.lightbox-close{top:14px;inset-inline-end:14px;width:42px;height:42px;border-radius:50%;font-size:26px}.lightbox-nav{top:50%;width:48px;height:58px;border-radius:16px;transform:translateY(-50%);font-size:34px}.lightbox-prev{left:14px}.lightbox-next{right:14px}
.contact-intro{align-self:start}.contact-intro>p:last-child{max-width:560px}.contact-grid{align-items:start}.footer-top{grid-template-columns:.8fr .8fr 1.55fr;gap:34px;align-items:start}.footer-contact{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;text-align:start;min-width:0}.footer-contact-item{min-height:82px;padding:14px 15px;border:1px solid var(--line);border-radius:16px;background:color-mix(in srgb,var(--surface-2) 58%,transparent);display:grid;align-content:center;gap:4px;text-decoration:none;color:var(--text);transition:transform .25s ease,border-color .25s ease!important}.footer-contact a:first-child{font:inherit;color:var(--text);letter-spacing:normal}.footer-contact-item:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--accent) 50%,var(--line))}.footer-contact-item small{color:var(--muted);font-size:10px}.footer-contact-item strong{font-size:12px;font-weight:600;overflow-wrap:anywhere}.footer-contact-item[href^="tel"] strong,.footer-contact-item[href^="mailto"] strong{font-family:var(--font-en)}
@media(max-width:1120px){.mv-heading{grid-template-columns:1fr;gap:10px}.mv-grid{grid-template-columns:1fr}.mv-card{min-height:300px}.footer-top{grid-template-columns:1fr}.footer-contact{grid-template-columns:repeat(3,minmax(0,1fr));width:100%}}
@media(max-width:820px){.hero-shade,html[dir=rtl] .hero-shade{background:linear-gradient(0deg,var(--hero-overlay-strong),var(--hero-overlay) 72%,rgba(0,0,0,.18))}.pilastro-gallery{grid-template-columns:1fr;gap:12px}.pilastro-gallery .gallery-item,.pilastro-gallery .gallery-item:nth-child(3n+1){aspect-ratio:4/3}.pilastro-gallery .gallery-item figcaption{padding:18px}.gallery-actions{justify-content:flex-start}.footer-contact{grid-template-columns:1fr 1fr}.footer-contact-item:last-child{grid-column:1/-1}.gallery-lightbox{width:96vw;height:82vh;border-radius:16px}}
@media(max-width:590px){.section{padding:76px 0}.shell{width:min(100% - 28px,1280px)}.mv-card{min-height:0;padding:86px 22px 28px}.mv-card p{font-size:14px;line-height:1.95}.mv-card h3{font-size:34px}.pilastro-gallery .gallery-item,.pilastro-gallery .gallery-item:nth-child(3n+1){aspect-ratio:1/1}.like-btn{top:12px;inset-inline-end:12px;width:40px;height:40px}.footer-contact{grid-template-columns:1fr}.footer-contact-item:last-child{grid-column:auto}.footer-contact-item{min-height:72px}.footer-top{gap:22px}.gallery-lightbox{width:100vw;height:100dvh;max-height:none;border-radius:0}.lightbox-nav{width:42px;height:52px}.lightbox-prev{left:8px}.lightbox-next{right:8px}}
@media(prefers-reduced-motion:reduce){.hero-slide{transition:none;transform:none!important}.mv-orbit i{animation:none}.like-btn .heart{transition:none}.particle{display:none}}

/* V8 interactive character hero */
.hero-character{position:absolute;inset:0;overflow:hidden;background:var(--page-bg,#0b0b09);transform:none!important}
.hero-character-fallback,.hero-character-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 42%;display:block;pointer-events:none;user-select:none}
.hero-character-fallback{transform:translate3d(var(--character-x,0),var(--character-y,0),0) scale(1.035);transition:transform .55s cubic-bezier(.16,1,.3,1);will-change:transform}
.hero-character-video{opacity:0;transition:opacity .45s ease}
.hero-character.video-ready .hero-character-video{opacity:1}
.hero-character.video-ready .hero-character-fallback{opacity:0}
@media(max-width:820px){.hero-character-fallback,.hero-character-video{object-position:center center}.hero-character-fallback{transform:scale(1.02)} }
@media(prefers-reduced-motion:reduce){.hero-character-fallback{transition:none;transform:none!important}.hero-character-video{display:none}}

/* =========================================================
   ASALAH V9 — faster character, unified typography,
   balanced services and cinematic carousel gallery
   ========================================================= */
:root {
  --font-ar: "Tajawal", Tahoma, Arial, sans-serif;
  --font-ar-display: "Tajawal", Tahoma, Arial, sans-serif;
  --font-en: "Montserrat", "Segoe UI", Arial, sans-serif;
  --font: var(--font-ar);
  --font-display: var(--font-ar-display);
}

html[lang="ar"] :is(body,button,input,textarea,select) { font-family: var(--font-ar); }
html[lang="en"] :is(body,button,input,textarea,select) { font-family: var(--font-en); }
html[lang="ar"] :is(h1,h2,h3,h4,.section-heading,.gallery-item-content,.service-card,.mv-card) {
  font-family: var(--font-ar-display);
  letter-spacing: 0;
}
html[lang="en"] :is(h1,h2,h3,h4,.section-heading,.gallery-item-content,.service-card,.mv-card) {
  font-family: var(--font-en);
}
.section-heading h2,
.services .split-heading h2,
.gallery-heading h2 { font-weight: 700; letter-spacing: 0; }

/* Character: keep the complete video frame visible instead of cropping it into a close-up. */
.hero-character {
  isolation: isolate;
  background: #0c0b09;
}
.hero-character::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: -5%;
  background: url("character-fallback.png") center 44% / cover no-repeat;
  filter: blur(18px) saturate(.72) brightness(.6);
  transform: scale(1.08);
  opacity: .88;
}
.hero-character-fallback,
.hero-character-video {
  z-index: 1;
  top: 3%;
  bottom: 0;
  width: min(62vw, 980px);
  height: 94%;
  object-fit: contain;
  object-position: center bottom;
  border-radius: 0;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 9%, #000 88%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0%, #000 9%, #000 88%, transparent 100%);
}
html[dir="rtl"] .hero-character-fallback,
html[dir="rtl"] .hero-character-video { left: 0; right: auto; }
html[dir="ltr"] .hero-character-fallback,
html[dir="ltr"] .hero-character-video { right: 0; left: auto; transform-origin: right center; }
.hero-character-fallback {
  opacity: 1;
  transform: translate3d(var(--character-x,0),var(--character-y,0),0) scale(.96);
}
.hero-character-video {
  opacity: 0;
  transform: scale(.96);
  transition: opacity .24s ease;
  will-change: opacity;
}
.hero-character.video-ready .hero-character-video { opacity: 1; }
.hero-character.video-ready .hero-character-fallback { opacity: 0; }
.hero-character.video-buffered .hero-character-video { filter: saturate(1.02) contrast(1.02); }
.hero-content {
  padding-inline-end: clamp(390px, 43vw, 640px);
}
.hero-title { font-weight: 700; letter-spacing: 0; line-height: 1.02; }
.hero-title em { font-family: inherit; font-style: normal; font-weight: 600; letter-spacing: 0; }

/* Services: title and explanatory copy are one visual unit, then a balanced 3-column grid. */
.services .split-heading {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  max-width: 920px;
  margin: 0 auto 58px;
  text-align: center;
}
.services .split-heading > div { max-width: none; }
.services .split-heading .kicker { margin-bottom: 14px; }
.services .split-heading h2 {
  max-width: 900px;
  margin-inline: auto;
  font-size: clamp(42px, 5vw, 74px);
  line-height: 1.12;
}
.services .split-heading > p,
html[dir="rtl"] .services .split-heading > p,
html[dir="ltr"] .services .split-heading > p {
  max-width: 720px;
  margin: 0 auto;
  color: var(--muted);
  font-size: clamp(14px, 1.15vw, 17px);
  line-height: 1.95;
  text-align: center;
}
.services-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  max-width: 1180px;
  margin-inline: auto;
}
.service-card {
  min-height: 330px;
  padding: 28px;
  border-radius: 26px;
}
.service-card h3 { font-size: clamp(21px, 1.65vw, 27px); font-weight: 700; line-height: 1.45; }
.service-card p { font-size: 13px; line-height: 1.9; }
.service-icon { margin: 42px 0 24px; }
.services-grid .service-card:last-child { grid-column: 2; }

/* Global like count: the heart remains the main visual, the public count sits beside it. */
.like-btn {
  width: auto;
  min-width: 58px;
  height: 44px;
  padding: 0 11px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border-radius: 999px;
}
.like-count {
  min-width: 1ch;
  font-family: var(--font-en);
  font-size: 11px;
  font-weight: 600;
  line-height: 1;
  color: currentColor;
  font-variant-numeric: tabular-nums;
}
.like-btn:disabled { cursor: wait; opacity: .68; }
.like-btn.like-offline::after {
  content: "";
  position: absolute;
  width: 6px;
  height: 6px;
  top: 2px;
  inset-inline-end: 3px;
  border-radius: 50%;
  background: #e7a34b;
}

/* Cinematic gallery based on the supplied HTML/CSS carousel motion. */
.gallery { overflow: hidden; background: var(--bg); }
.gallery-heading {
  max-width: 920px;
  margin: 0 auto 46px;
  text-align: center;
}
.gallery-heading .kicker { margin-bottom: 14px; }
.gallery-heading h2 {
  max-width: 880px;
  margin: 0 auto;
  font-size: clamp(42px, 5.3vw, 76px);
  line-height: 1.08;
}
.gallery-heading > p:last-child {
  max-width: 680px;
  margin: 20px auto 0;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.9;
}
.gallery-carousel {
  position: relative;
  width: min(100%, 1220px);
  height: clamp(520px, 49vw, 650px);
  margin-inline: auto;
  outline: none;
}
.gallery-carousel:focus-visible { outline: 2px solid var(--accent); outline-offset: 8px; border-radius: 34px; }
.gallery-carousel-stage {
  position: absolute;
  inset: 0;
  overflow: hidden;
  border: 1px solid color-mix(in srgb,var(--line) 75%,transparent);
  border-radius: 32px;
  background: var(--surface);
  box-shadow: 0 34px 90px color-mix(in srgb,#000 25%,transparent);
}
.gallery-carousel-stage .gallery-item {
  position: absolute;
  z-index: 3;
  top: 50%;
  left: auto;
  right: auto;
  width: 220px;
  height: 310px;
  margin: 0;
  overflow: hidden;
  transform: translateY(-50%);
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 24px;
  background: #181714;
  box-shadow: 0 22px 55px rgba(0,0,0,.34);
  cursor: pointer;
  transition:
    left .56s cubic-bezier(.16,1,.3,1),
    right .56s cubic-bezier(.16,1,.3,1),
    top .56s cubic-bezier(.16,1,.3,1),
    width .56s cubic-bezier(.16,1,.3,1),
    height .56s cubic-bezier(.16,1,.3,1),
    transform .56s cubic-bezier(.16,1,.3,1),
    border-radius .56s cubic-bezier(.16,1,.3,1),
    opacity .36s ease,
    filter .36s ease,
    box-shadow .36s ease;
}
.gallery-carousel-stage .gallery-item:nth-child(1),
.gallery-carousel-stage .gallery-item:nth-child(2),
.gallery-carousel-stage .gallery-item:only-child {
  z-index: 1;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  transform: none;
  border: 0;
  border-radius: 32px;
  box-shadow: none;
}
.gallery-carousel-stage .gallery-item:nth-child(2),
.gallery-carousel-stage .gallery-item:only-child { z-index: 2; }
html[dir="rtl"] .gallery-carousel-stage .gallery-item:nth-child(3) { left: 5%; }
html[dir="rtl"] .gallery-carousel-stage .gallery-item:nth-child(4) { left: calc(5% + 238px); }
html[dir="rtl"] .gallery-carousel-stage .gallery-item:nth-child(n+5) { left: calc(5% + 476px); opacity: 0; pointer-events: none; }
html[dir="ltr"] .gallery-carousel-stage .gallery-item:nth-child(3) { right: 5%; }
html[dir="ltr"] .gallery-carousel-stage .gallery-item:nth-child(4) { right: calc(5% + 238px); }
html[dir="ltr"] .gallery-carousel-stage .gallery-item:nth-child(n+5) { right: calc(5% + 476px); opacity: 0; pointer-events: none; }
.gallery-carousel-stage .gallery-item > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1.01);
  transition: transform 1s cubic-bezier(.16,1,.3,1), filter .5s ease;
}
.gallery-carousel-stage .gallery-item::after {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(5,5,4,.86) 0%, rgba(5,5,4,.56) 38%, rgba(5,5,4,.08) 70%);
  opacity: .9;
  transition: opacity .4s ease;
}
html[dir="rtl"] .gallery-carousel-stage .gallery-item::after {
  background: linear-gradient(270deg, rgba(5,5,4,.86) 0%, rgba(5,5,4,.56) 38%, rgba(5,5,4,.08) 70%);
}
.gallery-carousel-stage .gallery-item:nth-child(n+3)::after { background: linear-gradient(0deg,rgba(0,0,0,.42),transparent 62%); opacity: .65; }
.gallery-carousel-stage .gallery-item:hover > img { transform: scale(1.055); }
.gallery-carousel-stage .gallery-item:nth-child(2):hover > img,
.gallery-carousel-stage .gallery-item:only-child:hover > img { transform: scale(1.025); }
.gallery-item-content {
  position: absolute;
  z-index: 5;
  top: 50%;
  width: min(430px, 42%);
  padding: 0;
  color: #fff;
  transform: translateY(calc(-50% + 34px));
  opacity: 0;
  pointer-events: none;
  transition: transform .55s cubic-bezier(.16,1,.3,1) .08s, opacity .32s ease .08s;
}
html[dir="rtl"] .gallery-item-content { right: 7%; left: auto; text-align: right; direction: rtl; }
html[dir="ltr"] .gallery-item-content { left: 7%; right: auto; text-align: left; direction: ltr; }
.gallery-carousel-stage .gallery-item:nth-child(2) .gallery-item-content,
.gallery-carousel-stage .gallery-item:only-child .gallery-item-content {
  opacity: 1;
  transform: translateY(-50%);
  pointer-events: auto;
}
.gallery-caption-copy { display: grid; gap: 12px; }
.gallery-caption-copy span {
  font-size: clamp(36px, 4.1vw, 62px);
  line-height: 1.08;
  font-weight: 700;
  text-wrap: balance;
}
.gallery-caption-copy small {
  font-family: var(--font-en);
  color: rgba(255,255,255,.68);
  font-size: 10px;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.gallery-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 26px;
  pointer-events: auto;
}
.gallery-actions a {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 9px 15px;
  border: 1px solid rgba(255,255,255,.34);
  border-radius: 999px;
  background: rgba(0,0,0,.32);
  color: #fff;
  text-decoration: none;
  font-size: 11px;
  backdrop-filter: blur(10px);
  transition: transform .2s ease, background .2s ease, border-color .2s ease;
}
.gallery-actions a:hover { transform: translateY(-2px); background: rgba(0,0,0,.58); border-color: rgba(255,255,255,.6); }
.gallery-carousel-stage .like-btn {
  z-index: 8;
  top: 20px;
  inset-inline-end: 20px;
}
.gallery-carousel-stage .gallery-item:nth-child(n+3) .like-btn { top: 12px; inset-inline-end: 12px; min-width: 52px; height: 38px; padding-inline: 9px; }
.gallery-carousel-controls {
  position: absolute;
  z-index: 12;
  bottom: 22px;
  left: 50%;
  display: flex;
  align-items: center;
  gap: 10px;
  transform: translateX(-50%);
  padding: 6px;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 999px;
  background: rgba(10,9,8,.5);
  color: #fff;
  backdrop-filter: blur(14px);
  box-shadow: 0 15px 34px rgba(0,0,0,.18);
}
.gallery-arrow {
  width: 44px;
  height: 40px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 999px;
  background: rgba(255,255,255,.1);
  color: #fff;
  font-family: var(--font-en);
  font-size: 29px;
  line-height: 1;
  cursor: pointer;
  transition: transform .25s cubic-bezier(.34,1.56,.64,1), background .2s ease, border-color .2s ease;
}
.gallery-arrow:hover { transform: translateY(-3px) scale(1.08); background: rgba(255,255,255,.2); border-color: rgba(255,255,255,.45); }
.gallery-position {
  min-width: 66px;
  text-align: center;
  font-family: var(--font-en);
  font-size: 10px;
  letter-spacing: .12em;
  color: rgba(255,255,255,.76);
}

@media (max-width: 1120px) {
  .hero-content { padding-inline-end: clamp(300px, 40vw, 470px); }
  .hero-character-fallback,.hero-character-video { width: min(58vw, 760px); }
  .services-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .services-grid .service-card:last-child { grid-column: auto; }
  .gallery-carousel-stage .gallery-item { width: 190px; height: 280px; }
  html[dir="rtl"] .gallery-carousel-stage .gallery-item:nth-child(4) { left: calc(5% + 205px); }
  html[dir="ltr"] .gallery-carousel-stage .gallery-item:nth-child(4) { right: calc(5% + 205px); }
}

@media (max-width: 820px) {
  .hero-content { padding-inline-end: 0; padding-top: 125px; }
  .hero-character-fallback,.hero-character-video {
    top: 4%;
    left: 0 !important;
    right: 0 !important;
    width: 100%;
    height: 72%;
    margin-inline: auto;
    opacity: .76;
    -webkit-mask-image: linear-gradient(0deg,transparent 0%,#000 18%,#000 100%);
    mask-image: linear-gradient(0deg,transparent 0%,#000 18%,#000 100%);
  }
  .hero-character.video-ready .hero-character-video { opacity: .78; }
  .hero-shade, html[dir="rtl"] .hero-shade, html[dir="ltr"] .hero-shade {
    background: linear-gradient(0deg,rgba(7,6,5,.94) 4%,rgba(7,6,5,.72) 48%,rgba(7,6,5,.18) 100%);
  }
  .services .split-heading { margin-bottom: 38px; }
  .services .split-heading h2 { font-size: clamp(38px, 9vw, 58px); }
  .services-grid { grid-template-columns: 1fr; max-width: 620px; }
  .service-card { min-height: 290px; }

  .gallery-heading { margin-bottom: 30px; }
  .gallery-carousel { height: min(70vh, 570px); min-height: 490px; }
  .gallery-carousel-stage { border-radius: 24px; }
  .gallery-carousel-stage .gallery-item,
  .gallery-carousel-stage .gallery-item:nth-child(1),
  .gallery-carousel-stage .gallery-item:nth-child(2),
  .gallery-carousel-stage .gallery-item:only-child {
    top: 0;
    left: 0 !important;
    right: 0 !important;
    width: 100%;
    height: 100%;
    transform: none;
    border-radius: 24px;
  }
  .gallery-carousel-stage .gallery-item:nth-child(n+3) { opacity: 0; pointer-events: none; }
  .gallery-carousel-stage .gallery-item::after,
  html[dir="rtl"] .gallery-carousel-stage .gallery-item::after {
    background: linear-gradient(0deg,rgba(4,4,3,.9) 0%,rgba(4,4,3,.38) 52%,rgba(4,4,3,.06) 100%);
  }
  .gallery-item-content,
  html[dir="rtl"] .gallery-item-content,
  html[dir="ltr"] .gallery-item-content {
    top: auto;
    left: 22px;
    right: 22px;
    bottom: 92px;
    width: auto;
    transform: translateY(22px);
    text-align: start;
  }
  .gallery-carousel-stage .gallery-item:nth-child(2) .gallery-item-content,
  .gallery-carousel-stage .gallery-item:only-child .gallery-item-content { transform: none; }
  .gallery-caption-copy span { font-size: clamp(30px, 9vw, 44px); }
  .gallery-actions { margin-top: 18px; }
  .gallery-carousel-controls { bottom: 18px; }
}

@media (max-width: 590px) {
  .hero-character-fallback,.hero-character-video { height: 64%; top: 8%; }
  .hero-title { font-size: clamp(44px, 14vw, 66px); }
  .services .split-heading { text-align: start; }
  .services .split-heading h2,
  .services .split-heading > p,
  html[dir="rtl"] .services .split-heading > p,
  html[dir="ltr"] .services .split-heading > p { text-align: start; margin-inline: 0; }
  .gallery-heading { text-align: start; }
  .gallery-heading h2,
  .gallery-heading > p:last-child { margin-inline: 0; text-align: start; }
  .gallery-carousel { height: 520px; min-height: 0; }
  .gallery-item-content,
  html[dir="rtl"] .gallery-item-content,
  html[dir="ltr"] .gallery-item-content { left: 18px; right: 18px; bottom: 88px; }
  .gallery-caption-copy span { font-size: 32px; }
  .gallery-carousel-stage .like-btn { top: 14px; inset-inline-end: 14px; min-width: 56px; height: 40px; }
  .gallery-arrow { width: 40px; height: 38px; }
}

@media (prefers-reduced-motion: reduce) {
  .gallery-carousel-stage .gallery-item,
  .gallery-item-content,
  .gallery-carousel-stage .gallery-item > img { transition: none !important; }
}


/* ===== ASALAH V10: restored animated hero, polished consultation/footer, admin-driven typography ===== */
:root { --heading-weight: 700; }
html[lang="ar"] :is(h1,h2,h3,.brand-copy strong,.nav-cta,.desktop-nav a,.mobile-menu a){font-family:var(--font-ar-display);font-weight:var(--heading-weight)}
html[lang="en"] :is(h1,h2,h3,.brand-copy strong,.nav-cta,.desktop-nav a,.mobile-menu a){font-family:var(--font-en);font-weight:var(--heading-weight)}

/* Remove every visual dependency on the character experiment. */
.hero-slideshow{position:absolute;inset:0;overflow:hidden;background:var(--bg);transform:none!important}
.hero-slide{position:absolute;inset:-3%;opacity:0;transform:scale(1.045);transition:opacity 1.15s cubic-bezier(.22,1,.36,1);will-change:opacity,transform}
.hero-slide.is-active{opacity:1;z-index:1;animation:heroKenBurns 10.8s ease-in-out both}
.hero-slide img{width:100%;height:100%;display:block;object-fit:cover;object-position:center;filter:saturate(.88) contrast(1.02);transform:translate3d(0,0,0)}
@keyframes heroKenBurns{0%{transform:scale(1.035) translate3d(0,0,0)}100%{transform:scale(1.105) translate3d(-1.2%,.7%,0)}}
html[dir="rtl"] .hero-shade{background:linear-gradient(90deg,rgba(0,0,0,.2) 0%,rgba(0,0,0,.38) 38%,var(--hero-overlay-strong) 100%)}
html[dir="ltr"] .hero-shade{background:linear-gradient(270deg,rgba(0,0,0,.2) 0%,rgba(0,0,0,.38) 38%,var(--hero-overlay-strong) 100%)}
@media(max-width:820px){.hero-slide{inset:0}.hero-slide img{object-position:center}.hero-shade,html[dir="rtl"] .hero-shade,html[dir="ltr"] .hero-shade{background:linear-gradient(0deg,var(--hero-overlay-strong),var(--hero-overlay) 72%,rgba(0,0,0,.24))}}
@media(prefers-reduced-motion:reduce){.hero-slide{transition:none;animation:none!important}.hero-slide:not(.is-active){display:none}}

/* Consultation: stronger hierarchy and a clearer form entry point. */
.contact{background:linear-gradient(135deg,color-mix(in srgb,var(--bg-soft) 94%,var(--accent) 6%),var(--bg));}
.contact-grid{grid-template-columns:minmax(0,.9fr) minmax(520px,1.1fr);gap:clamp(44px,7vw,100px);align-items:center}
.contact-intro{padding-block:18px}.contact-intro h2{max-width:650px;font-size:clamp(46px,5.7vw,78px);line-height:1.08;letter-spacing:-.035em;margin-bottom:24px}.contact-description{max-width:600px;font-size:clamp(15px,1.25vw,18px);line-height:1.95;color:var(--muted)}
.consultation-points{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}.consultation-points span{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border:1px solid var(--line);border-radius:999px;background:color-mix(in srgb,var(--surface) 72%,transparent);color:var(--text);font-size:12px}.consultation-points span::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 12%,transparent)}
.contact-form{position:relative;overflow:hidden;padding:clamp(30px,4vw,50px);border:1px solid color-mix(in srgb,var(--accent) 25%,var(--line));border-radius:30px;background:color-mix(in srgb,var(--surface) 94%,transparent);box-shadow:0 34px 90px color-mix(in srgb,var(--accent) 10%,rgba(0,0,0,.3))}
.contact-form::before{content:"";position:absolute;inset:0 0 auto;height:3px;background:linear-gradient(90deg,transparent,var(--accent),transparent);opacity:.9}.form-heading{display:grid;gap:7px;margin-bottom:26px;padding-bottom:20px;border-bottom:1px solid var(--line)}.form-heading strong{font-size:clamp(20px,2vw,28px);color:var(--text)}.form-heading span{font-size:12px;line-height:1.8;color:var(--muted)}
.form-footer{display:flex;align-items:center;gap:16px;justify-content:space-between}.form-footer .btn{min-width:170px;justify-content:center}.form-status{margin:0;min-height:22px}
@media(max-width:1050px){.contact-grid{grid-template-columns:1fr}.contact-intro h2{max-width:800px}.contact-form{max-width:780px;width:100%}}
@media(max-width:590px){.contact-intro h2{font-size:clamp(40px,12vw,58px)}.consultation-points{gap:7px}.consultation-points span{padding:8px 11px;font-size:11px}.contact-form{padding:24px 16px}.form-footer{align-items:stretch;flex-direction:column}.form-footer .btn{width:100%}}

/* Footer: no city card; concise direct contact + social destinations. */
.footer{padding:72px 0 24px;background:linear-gradient(180deg,var(--surface),var(--bg));border-top:1px solid var(--line)}
.footer-top.footer-v10{display:grid;grid-template-columns:minmax(250px,.9fr) minmax(430px,1.35fr) minmax(220px,.7fr);gap:clamp(28px,4vw,58px);align-items:start;padding-bottom:42px}
.footer-identity{display:grid;gap:18px}.footer-identity>p{margin:0;max-width:330px;color:var(--muted);line-height:1.9;text-align:start}.footer-brand .brand-copy small{letter-spacing:.24em}
.footer-label{margin:0 0 12px;color:var(--muted);font-size:11px;letter-spacing:.08em;text-transform:uppercase}.footer-contact{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;text-align:start;min-width:0}.footer-contact-item{min-height:88px;padding:16px 18px;border:1px solid var(--line);border-radius:18px;background:color-mix(in srgb,var(--surface-2) 58%,transparent);display:grid;align-content:center;gap:6px;text-decoration:none;color:var(--text);transition:transform .25s ease,border-color .25s ease,background .25s ease!important}.footer-contact-item:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--accent) 56%,var(--line));background:color-mix(in srgb,var(--surface-2) 76%,var(--accent) 6%)}.footer-contact-item small{color:var(--muted);font-size:10px}.footer-contact-item strong{font-family:var(--font-en);font-size:clamp(11px,1vw,13px);font-weight:700;overflow-wrap:anywhere;word-break:break-word}
.footer-social{display:grid;gap:8px}.footer-social a{min-height:48px;display:flex;align-items:center;gap:12px;padding:9px 12px;border:1px solid var(--line);border-radius:14px;color:var(--text);text-decoration:none;background:color-mix(in srgb,var(--surface-2) 54%,transparent);transition:transform .25s ease,border-color .25s ease}.footer-social a:hover{transform:translateX(-3px);border-color:color-mix(in srgb,var(--accent) 56%,var(--line))}html[dir="ltr"] .footer-social a:hover{transform:translateX(3px)}.footer-social a[hidden]{display:none}.footer-social span{width:30px;height:30px;display:grid;place-items:center;border:1px solid color-mix(in srgb,var(--accent) 38%,var(--line));border-radius:50%;color:var(--accent);font-family:var(--font-en);font-size:12px}.footer-social b{font-family:var(--font-en);font-size:12px;font-weight:600}
.footer-bottom{padding-top:22px;border-top:1px solid var(--line)}
@media(max-width:1120px){.footer-top.footer-v10{grid-template-columns:1fr 1.4fr}.footer-social-wrap{grid-column:1/-1}.footer-social{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.footer-top.footer-v10{grid-template-columns:1fr}.footer-contact{grid-template-columns:1fr}.footer-social-wrap{grid-column:auto}.footer-social{grid-template-columns:1fr 1fr 1fr}.footer-bottom{gap:10px}}
@media(max-width:480px){.footer-social{grid-template-columns:1fr}.footer-social a{justify-content:center}.footer-contact-item{min-height:74px}}

/* V11 footer refinement: unified contact card + prominent WhatsApp */
.footer-top.footer-v11{
  display:grid;
  grid-template-columns:minmax(260px,.9fr) minmax(420px,1.3fr) minmax(220px,.72fr);
  gap:clamp(24px,3.5vw,52px);
  align-items:start;
  padding-bottom:44px;
}
.footer-v11 .footer-identity{display:grid;gap:18px;align-content:start}
.footer-v11 .footer-identity>p{max-width:360px;margin:0;color:var(--muted);font-size:clamp(14px,1.15vw,18px);line-height:1.9}
.footer-panel-heading{display:grid;gap:5px;margin-bottom:12px}
.footer-panel-heading .footer-label{margin:0}
.footer-panel-heading>span{color:var(--muted);font-size:11px;line-height:1.7}
.footer-contact-panel,.footer-social-wrap{min-width:0}
.footer-contact-unified{
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:22px;
  background:linear-gradient(145deg,color-mix(in srgb,var(--surface-2) 75%,transparent),color-mix(in srgb,var(--surface) 88%,transparent));
  box-shadow:0 18px 46px color-mix(in srgb,#000 8%,transparent);
}
.footer-contact-row{
  position:relative;
  display:grid;
  grid-template-columns:48px minmax(0,1fr) auto;
  align-items:center;
  gap:14px;
  min-height:86px;
  padding:16px 18px;
  color:var(--text);
  text-decoration:none;
  transition:background .25s ease,transform .25s ease;
}
.footer-contact-row + .footer-contact-row{border-top:1px solid var(--line)}
.footer-contact-row:hover{background:color-mix(in srgb,var(--accent) 6%,transparent)}
.footer-contact-icon{
  width:44px;height:44px;display:grid;place-items:center;border-radius:50%;
  border:1px solid color-mix(in srgb,var(--accent) 35%,var(--line));
  color:var(--accent);font:700 14px/1 var(--font-en);
  background:color-mix(in srgb,var(--surface-2) 76%,transparent)
}
.footer-contact-icon svg{width:23px;height:23px;fill:currentColor}
.footer-contact-copy{display:grid;gap:3px;min-width:0}
.footer-contact-copy small{color:var(--muted);font-size:10px}
.footer-contact-copy strong{font-family:var(--font-en);font-size:clamp(13px,1.05vw,16px);font-weight:700;overflow-wrap:anywhere}
.footer-contact-action{padding:9px 13px;border-radius:999px;font-size:10px;font-weight:800;white-space:nowrap}
.footer-contact-arrow{font-size:18px;color:var(--muted);transition:transform .25s ease}
.footer-email:hover .footer-contact-arrow{transform:translate(2px,-2px)}
html[dir="rtl"] .footer-email:hover .footer-contact-arrow{transform:translate(-2px,-2px)}
.footer-whatsapp{
  background:linear-gradient(135deg,color-mix(in srgb,#25d366 13%,transparent),transparent 68%);
}
.footer-whatsapp .whatsapp-icon{
  border-color:color-mix(in srgb,#25d366 58%,var(--line));
  background:color-mix(in srgb,#25d366 13%,var(--surface));
  color:#25d366;
}
.footer-whatsapp .footer-contact-action{background:#25d366;color:#07170d;box-shadow:0 8px 24px rgba(37,211,102,.18)}
.footer-whatsapp:hover{background:linear-gradient(135deg,color-mix(in srgb,#25d366 20%,transparent),color-mix(in srgb,#25d366 4%,transparent) 72%)}
.footer-whatsapp:hover .footer-contact-action{transform:translateY(-1px)}
.footer-v11 .footer-social{display:grid;grid-template-columns:1fr;gap:8px}
.footer-v11 .footer-social a{min-height:54px;border-radius:16px;padding:10px 13px}
.footer-v11 .footer-social span{width:34px;height:34px}
.footer-bottom{align-items:center;padding-top:20px}
@media(max-width:1120px){
  .footer-top.footer-v11{grid-template-columns:1fr 1.15fr}
  .footer-v11 .footer-social-wrap{grid-column:1/-1}
  .footer-v11 .footer-social{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:760px){
  .footer-top.footer-v11{grid-template-columns:1fr;gap:26px}
  .footer-v11 .footer-social-wrap{grid-column:auto}
  .footer-v11 .footer-social{grid-template-columns:repeat(3,minmax(0,1fr))}
  .footer-contact-row{grid-template-columns:44px minmax(0,1fr) auto;min-height:80px;padding:14px}
}
@media(max-width:520px){
  .footer-top.footer-v11{padding-bottom:30px}
  .footer-contact-row{grid-template-columns:42px minmax(0,1fr);gap:11px}
  .footer-contact-action,.footer-contact-arrow{grid-column:2;justify-self:start;margin-top:2px}
  .footer-contact-action{padding:7px 11px}
  .footer-v11 .footer-social{grid-template-columns:1fr}
  .footer-v11 .footer-social a{justify-content:flex-start}
  .footer-bottom{flex-direction:column;align-items:flex-start}
}

/* V12 — official ASALAH logo supplied by the client */
.brand-logo{
  direction:ltr;
  min-width:148px!important;
  gap:8px;
  align-items:center;
}
.brand-logo img,.footer-logo-image{display:block;height:auto;object-fit:contain;transition:filter .25s ease,opacity .25s ease}
.brand-logo-wordmark{width:104px;max-height:36px}
.brand-logo-mark{width:34px;max-height:38px}
.site-header:not(.is-scrolled) .brand-logo img{filter:invert(1) brightness(1.16)}
html[data-theme="dark"] .site-header.is-scrolled .brand-logo img,
html[data-theme="purple"] .site-header.is-scrolled .brand-logo img{filter:invert(1) brightness(1.16)}
html[data-theme="light"] .site-header.is-scrolled .brand-logo img,
html[data-theme="sand"] .site-header.is-scrolled .brand-logo img,
html[data-theme="gray"] .site-header.is-scrolled .brand-logo img{filter:none}
.footer-logo-link{display:inline-flex;min-width:0!important;width:max-content}
.footer-logo-image{width:clamp(150px,12vw,190px);max-height:122px}
html[data-theme="dark"] .footer-logo-image,
html[data-theme="purple"] .footer-logo-image{filter:invert(1) brightness(1.12)}
html[data-theme="light"] .footer-logo-image,
html[data-theme="sand"] .footer-logo-image,
html[data-theme="gray"] .footer-logo-image{filter:none}
@media(max-width:1120px){.brand-logo{min-width:128px!important}.brand-logo-wordmark{width:90px}.brand-logo-mark{width:30px}}
@media(max-width:590px){.brand-logo{min-width:38px!important;gap:0}.brand-logo-wordmark{display:none}.brand-logo-mark{width:36px;max-height:40px}.footer-logo-image{width:158px}}

/* V15 — integrated MENISCUS dock: ordered by page flow, theme-aware and faster */
.desktop-nav.rail.meniscus-nav{
  --meniscus-accent:#25D366;
  position:relative;
  isolation:isolate;
  display:flex;
  align-items:stretch;
  width:min(550px,46vw);
  height:58px;
  padding:0;
  border:0;
  border-radius:30px;
  background:transparent!important;
  overflow:visible;
  box-shadow:none;
}
.desktop-nav.rail.meniscus-nav .nav-fluid-mask{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:0;
  overflow:visible;
  pointer-events:none;
  filter:drop-shadow(0 12px 24px rgba(0,0,0,.14));
}
.desktop-nav.rail.meniscus-nav .nav-fluid-path{
  fill:color-mix(in srgb,var(--surface) 94%,transparent);
  stroke:var(--line);
  stroke-width:1;
  vector-effect:non-scaling-stroke;
  transition:fill .22s ease,stroke .22s ease;
}
html[data-theme="light"] .desktop-nav.rail.meniscus-nav .nav-fluid-path{fill:#fbfbf8}
html[data-theme="light"] .desktop-nav.rail.meniscus-nav .nav-fluid-mask{filter:drop-shadow(0 10px 22px rgba(20,20,20,.10))}
.site-header.is-scrolled .desktop-nav.rail.meniscus-nav .nav-fluid-path{fill:color-mix(in srgb,var(--surface) 97%,transparent)}
.desktop-nav.rail.meniscus-nav .nav-bead{
  position:absolute;
  top:-7px;
  left:0;
  width:38px;
  height:38px;
  border-radius:50%;
  z-index:5;
  display:flex;
  justify-content:center;
  align-items:center;
  color:#0b0b0e;
  background:var(--meniscus-accent);
  box-shadow:0 0 0 5px color-mix(in srgb,var(--meniscus-accent) 14%,transparent),0 8px 18px color-mix(in srgb,var(--meniscus-accent) 35%,transparent);
  cursor:grab;
  touch-action:none;
  user-select:none;
  will-change:transform;
  transition:background-color .18s ease,box-shadow .18s ease;
}
.desktop-nav.rail.meniscus-nav .nav-bead:active{cursor:grabbing}
.desktop-nav.rail.meniscus-nav .nav-bead-icon{width:20px;height:20px;display:grid;place-items:center}
.desktop-nav.rail.meniscus-nav .nav-bead-icon svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.desktop-nav.rail.meniscus-nav .meniscus-tab{
  position:relative;
  z-index:2;
  flex:1 1 0;
  min-width:0;
  min-height:58px;
  padding:18px 4px 6px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
  background:none;
  border:0;
  color:color-mix(in srgb,var(--muted) 82%,transparent);
  text-decoration:none;
  cursor:pointer;
  touch-action:manipulation;
  transition:color .15s ease,transform .15s ease;
}
.desktop-nav.rail.meniscus-nav .meniscus-tab>svg{
  width:19px;
  height:19px;
  flex:none;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
  transition:opacity .14s ease,transform .14s ease,color .14s ease;
}
.desktop-nav.rail.meniscus-nav .meniscus-tab .tab-label{
  display:block;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:9.5px;
  line-height:1;
  font-weight:700;
  opacity:0;
  transform:translateY(3px);
  transition:opacity .14s ease,transform .14s ease,color .14s ease;
}
.desktop-nav.rail.meniscus-nav .meniscus-tab:hover,
.desktop-nav.rail.meniscus-nav .meniscus-tab:focus-visible{color:var(--text);transform:translateY(-1px)}
.desktop-nav.rail.meniscus-nav .meniscus-tab.active .tab-label,
.desktop-nav.rail.meniscus-nav .meniscus-tab.is-active .tab-label,
.desktop-nav.rail.meniscus-nav .meniscus-tab.is-preview .tab-label,
.desktop-nav.rail.meniscus-nav .meniscus-tab:hover .tab-label,
.desktop-nav.rail.meniscus-nav .meniscus-tab:focus-visible .tab-label{
  opacity:1;
  transform:translateY(0);
  color:var(--meniscus-accent);
}
.desktop-nav.rail.meniscus-nav .meniscus-tab.active>svg,
.desktop-nav.rail.meniscus-nav .meniscus-tab.is-active>svg,
.desktop-nav.rail.meniscus-nav .meniscus-tab.is-preview>svg{opacity:0;transform:translateY(-4px) scale(.82)}
.desktop-nav.rail.meniscus-nav .meniscus-tab:focus-visible{outline:2px solid var(--meniscus-accent);outline-offset:2px;border-radius:14px}
.desktop-nav.rail.meniscus-nav .meniscus-tab::after{display:none!important}
@media(max-width:1320px){
  .desktop-nav.rail.meniscus-nav{width:min(490px,42vw);height:56px}
  .desktop-nav.rail.meniscus-nav .meniscus-tab{min-height:56px;padding:17px 2px 5px}
  .desktop-nav.rail.meniscus-nav .meniscus-tab>svg{width:17px;height:17px}
  .desktop-nav.rail.meniscus-nav .meniscus-tab .tab-label{font-size:8.25px}
  .desktop-nav.rail.meniscus-nav .nav-bead{width:36px;height:36px;top:-6px}
}
@media(max-width:1120px){.desktop-nav.rail.meniscus-nav{display:none}}
@media(prefers-reduced-motion:reduce){
  .desktop-nav.rail.meniscus-nav .nav-bead,
  .desktop-nav.rail.meniscus-nav .meniscus-tab,
  .desktop-nav.rail.meniscus-nav .meniscus-tab>svg,
  .desktop-nav.rail.meniscus-nav .meniscus-tab .tab-label{transition:none!important}
}

/* ========================= V16 — About values ========================= */
.about-values{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:clamp(34px,5vw,72px);margin-bottom:clamp(30px,4vw,58px)}
.about-value-card{position:relative;overflow:hidden;min-height:220px;display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(18px,2.6vw,34px);align-items:start;padding:clamp(26px,3.4vw,44px);border:1px solid var(--line);border-radius:28px;background:radial-gradient(circle at 8% 0%,color-mix(in srgb,var(--accent) 10%,transparent),transparent 180px),color-mix(in srgb,var(--surface) 94%,transparent);box-shadow:0 24px 70px color-mix(in srgb,var(--accent) 5%,rgba(0,0,0,.12));transition:transform .38s var(--ease),border-color .38s ease,box-shadow .38s ease}
.about-value-card::after{content:"";position:absolute;width:170px;height:170px;inset-inline-end:-68px;top:-82px;border:1px solid color-mix(in srgb,var(--accent) 25%,transparent);border-radius:50%;transition:transform .55s cubic-bezier(.16,1,.3,1)}
.about-value-card:hover{transform:translateY(-6px);border-color:color-mix(in srgb,var(--accent) 40%,var(--line));box-shadow:0 30px 80px color-mix(in srgb,var(--accent) 10%,rgba(0,0,0,.16))}.about-value-card:hover::after{transform:scale(1.18) translate(-8px,8px)}
.about-value-num{font-family:var(--font-en);font-size:11px;letter-spacing:.16em;color:var(--accent);padding-top:3px}.about-value-card .kicker{margin:0 0 14px;font-size:16px;letter-spacing:0;text-transform:none;color:var(--text)}.about-value-card p:last-child{margin:0;color:var(--muted);font-size:15px;line-height:2;max-width:670px}
@media(max-width:760px){.about-values{grid-template-columns:1fr}.about-value-card{min-height:0}}
@media(max-width:480px){.about-value-card{grid-template-columns:1fr;padding:24px 20px}.about-value-num{padding:0}}

/* V22 — brighter neutral light palette */
html[data-theme="light"]{--bg:#fffefa;--bg-soft:#faf8f2;--surface:#ffffff;--surface-2:#f4f1e9;--text:#171816;--muted:#666861;--line:rgba(23,24,22,.11);--header:rgba(255,254,250,.94)}
html[data-theme="light"] body{background:#fffefa}


/* ===== ASALAH V45: clean online hero + physical circular consultation CTA ===== */
/* Clear an old V8 character-layout reservation so the restored photo hero can use the full shell width. */
.hero-content{padding-inline-end:0!important}
.hero-title-clean{
  max-width:min(1080px,82vw);
  font-size:clamp(48px,5.2vw,82px);
  line-height:1.12;
  letter-spacing:-.022em;
  font-weight:700;
  text-wrap:balance;
}
.hero-title-clean > span,
.hero-title-clean > em{
  display:block;
  width:fit-content;
  max-width:100%;
  padding:0!important;
  margin:0;
  background:transparent!important;
  box-shadow:none!important;
  border:0!important;
  -webkit-box-decoration-break:clone;
  box-decoration-break:clone;
}
html[dir="rtl"] .hero-title-clean > span,
html[dir="rtl"] .hero-title-clean > em{margin-inline-start:auto;text-align:right}
html[dir="ltr"] .hero-title-clean > span,
html[dir="ltr"] .hero-title-clean > em{margin-inline-end:auto;text-align:left}
.hero-title-clean > span{color:#f7f4ed}
.hero-title-clean > em{
  margin-top:.12em;
  color:#d7b47a;
  font-family:inherit;
  font-style:normal;
  font-weight:650;
  letter-spacing:-.012em;
}
.hero-lead-online{
  max-width:760px;
  margin-top:26px;
  white-space:pre-line;
  color:#ded8cd;
  font-size:clamp(15px,1.35vw,19px);
  line-height:1.9;
  text-wrap:pretty;
}

/* Circular physical-control inspired CTA. Built only with local CSS — no remote animation asset. */
.hero-consult-btn{
  --cta-gold:#d7b47a;
  --cta-ink:#15120d;
  position:relative;
  isolation:isolate;
  min-height:66px;
  padding:7px 8px 7px 25px;
  gap:18px;
  overflow:visible;
  border:1px solid rgba(255,255,255,.16);
  background:linear-gradient(135deg,#e2c083 0%,var(--cta-gold) 52%,#c99f61 100%)!important;
  color:var(--cta-ink)!important;
  box-shadow:0 13px 34px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.42),inset 0 -1px 0 rgba(77,50,17,.14);
  transition:transform .38s cubic-bezier(.16,1,.3,1),box-shadow .38s ease,filter .38s ease!important;
}
html[dir="ltr"] .hero-consult-btn{padding:7px 8px 7px 25px}
html[dir="rtl"] .hero-consult-btn{padding:7px 25px 7px 8px}
.hero-consult-btn::before{
  content:"";
  position:absolute;
  inset:1px;
  border-radius:inherit;
  z-index:-1;
  pointer-events:none;
  background:linear-gradient(110deg,rgba(255,255,255,.26),transparent 28%,transparent 68%,rgba(66,43,15,.08));
}
.hero-consult-label{
  position:relative;
  z-index:4;
  white-space:nowrap;
  font-size:13px;
  font-weight:800;
  letter-spacing:0;
}
.consult-knob{
  position:relative;
  width:52px;
  height:52px;
  flex:0 0 52px;
  display:grid;
  place-items:center;
  perspective:180px;
  transform-style:preserve-3d;
  filter:drop-shadow(0 7px 8px rgba(0,0,0,.22));
}
.consult-knob::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:50%;
  background:repeating-conic-gradient(from 0deg,#181614 0 2deg,#66513a 2deg 4deg,#181614 4deg 8deg);
  -webkit-mask:radial-gradient(circle,transparent 0 58%,#000 59% 72%,transparent 73%);
  mask:radial-gradient(circle,transparent 0 58%,#000 59% 72%,transparent 73%);
  opacity:.9;
  animation:consultKnobTicks 7s linear infinite;
}
.consult-knob-base{
  position:absolute;
  inset:7px;
  border-radius:50%;
  background:linear-gradient(160deg,#423526,#171410 54%,#090807);
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 6px 9px rgba(0,0,0,.34),inset 0 1px 2px rgba(255,255,255,.13);
  transform:translateZ(-7px) translateY(4px) scale(.98);
}
.consult-knob-ring{
  position:absolute;
  inset:9px;
  border-radius:50%;
  border:2px solid rgba(222,190,132,.55);
  box-shadow:0 0 0 2px rgba(12,10,8,.72),0 2px 6px rgba(0,0,0,.4),inset 0 0 6px rgba(255,220,160,.16);
  transform:translateZ(-2px) translateY(1px);
  transition:transform .45s cubic-bezier(.16,1,.3,1),opacity .3s ease;
}
.consult-knob-top{
  position:absolute;
  inset:11px;
  border-radius:50%;
  display:grid;
  place-items:center;
  color:#eee7db;
  background:radial-gradient(circle at 34% 28%,#54514c 0 10%,#2b2925 42%,#12110f 76%,#080706 100%);
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 7px 11px rgba(0,0,0,.42),inset 0 1px 1px rgba(255,255,255,.28),inset 0 -2px 5px rgba(0,0,0,.52);
  transform:translateZ(8px) translateY(-2px) rotate(0deg);
  transform-origin:center;
  animation:consultKnobFloat 3.4s ease-in-out infinite;
  transition:transform .48s cubic-bezier(.16,1,.3,1),box-shadow .35s ease,background .35s ease;
  will-change:transform;
}
.consult-knob-top::after{
  content:"";
  position:absolute;
  top:5px;
  right:9px;
  width:9px;
  height:2px;
  border-radius:2px;
  background:#d7b47a;
  box-shadow:0 0 8px rgba(215,180,122,.72);
}
.consult-knob-arrow{
  font-family:var(--font-en);
  font-size:15px;
  font-weight:700;
  line-height:1;
  transform:translateY(-1px);
}
.hero-consult-btn:hover{
  transform:translateY(-3px)!important;
  filter:saturate(1.04) brightness(1.035);
  box-shadow:0 18px 42px rgba(0,0,0,.28),0 0 0 1px rgba(215,180,122,.18),inset 0 1px 0 rgba(255,255,255,.5);
}
.hero-consult-btn:hover .consult-knob::before{animation-duration:1.15s}
.hero-consult-btn:hover .consult-knob-ring{transform:translateZ(-2px) translateY(5px) scale(1.03);opacity:.95}
.hero-consult-btn:hover .consult-knob-top{
  transform:translateZ(16px) translateY(-8px) rotate(32deg) scale(.96);
  animation-play-state:paused;
  background:radial-gradient(circle at 34% 28%,#625f59 0 10%,#322f2b 42%,#151310 76%,#080706 100%);
  box-shadow:0 12px 16px rgba(0,0,0,.46),inset 0 1px 1px rgba(255,255,255,.31),inset 0 -2px 5px rgba(0,0,0,.5);
}
.hero-consult-btn:active{transform:translateY(0) scale(.985)!important}
.hero-consult-btn:active .consult-knob-top{transform:translateZ(1px) translateY(3px) rotate(36deg) scale(.985);transition-duration:.12s}
@keyframes consultKnobTicks{to{transform:rotate(360deg)}}
@keyframes consultKnobFloat{0%,100%{transform:translateZ(8px) translateY(-2px) rotate(0)}50%{transform:translateZ(11px) translateY(-4px) rotate(5deg)}}

@media(max-width:820px){
  .hero-title-clean{max-width:100%;font-size:clamp(42px,10.8vw,62px);line-height:1.14}
  .hero-title-clean > em{margin-top:.16em}
  .hero-lead-online{max-width:640px;font-size:15px;line-height:1.85}
}
@media(max-width:590px){
  .hero-title-clean{font-size:clamp(38px,11.7vw,53px);line-height:1.16}
  .hero-lead-online{font-size:14px;line-height:1.82;margin-top:22px}
  .hero-actions{gap:10px;margin-top:28px}
  .hero-actions .hero-consult-btn{width:100%;min-height:64px;justify-content:space-between;padding-inline:20px 7px}
  html[dir="ltr"] .hero-actions .hero-consult-btn{padding-inline:20px 7px}
  .hero-consult-label{font-size:12.5px}
  .consult-knob{width:50px;height:50px;flex-basis:50px}
}
@media(prefers-reduced-motion:reduce){
  .consult-knob::before,.consult-knob-top{animation:none!important}
  .hero-consult-btn,.consult-knob-ring,.consult-knob-top{transition:none!important}
  .hero-consult-btn:hover .consult-knob-top{transform:translateZ(8px) translateY(-2px)!important}
}

/* =========================================================
   ASALAH V46 — precise build reveal, refined typography,
   compact physical circular CTA, true-white light theme
   ========================================================= */
:root{
  --font-ar:"Tajawal",Tahoma,Arial,sans-serif;
  --font-ar-display:"Tajawal",Tahoma,Arial,sans-serif;
  --font-en:"Manrope","Inter","Segoe UI",Arial,sans-serif;
}

/* Cleaner, calmer hero typography: no highlight blocks and no oversized wrapping. */
.hero-content{
  padding-top:clamp(138px,16vh,176px);
  padding-bottom:clamp(86px,10vh,120px);
}
.hero-title-clean{
  max-width:min(930px,74vw);
  margin:0;
  font-family:var(--font-ar-display);
  font-size:clamp(46px,4.45vw,72px);
  line-height:1.24;
  letter-spacing:0;
  font-weight:700;
  text-wrap:balance;
}
.hero-title-clean>span,.hero-title-clean>em{
  width:auto;
  max-width:100%;
  margin:0!important;
  padding:0!important;
  background:none!important;
  box-shadow:none!important;
  color:#fff;
  text-align:start!important;
}
.hero-title-clean>em{
  margin-top:.12em!important;
  color:#d9b678;
  font-style:normal;
  font-weight:600;
  line-height:1.28;
}
.hero-lead-online{
  max-width:710px;
  margin-top:22px;
  color:rgba(255,255,255,.82);
  font-size:clamp(14px,1.15vw,17px);
  line-height:1.9;
  font-weight:400;
  white-space:pre-line;
  text-wrap:pretty;
}
.eyebrow{margin-bottom:18px;font-size:11px;font-weight:500;letter-spacing:.04em;color:rgba(255,255,255,.76)}

/* Build/reveal motion inspired by the supplied reference: fixed camera, scene materialises in layers. */
.hero-media.hero-build-sequence{background:#0e0e0d;isolation:isolate}
.hero-build-sequence .hero-slide{
  inset:-1.5%;
  z-index:0;
  opacity:0;
  clip-path:inset(0 0 0 0);
  transform:scale(1.035);
  transition:none!important;
  will-change:opacity,transform,clip-path,filter;
}
.hero-build-sequence .hero-slide img{
  width:100%;height:100%;object-fit:cover;display:block;
  filter:saturate(.82) contrast(1.04) brightness(.93);
  transform:translate3d(0,0,0) scale(1.01);
}
.hero-build-sequence .hero-slide.is-leaving{
  z-index:1;
  opacity:1;
  animation:v46Leaving 1.9s cubic-bezier(.22,1,.36,1) both;
}
.hero-build-sequence .hero-slide.is-active{
  z-index:2;
  opacity:1;
  animation:v46BuildReveal 2.05s cubic-bezier(.2,.82,.2,1) both,v46SceneDrift 6.4s cubic-bezier(.22,1,.36,1) both;
}
.hero-build-sequence .hero-slide.is-active::before{
  content:"";
  position:absolute;inset:0;z-index:2;pointer-events:none;
  background:
    repeating-linear-gradient(90deg,transparent 0 9.9%,rgba(255,255,255,.16) 10%,transparent 10.12%),
    repeating-linear-gradient(0deg,transparent 0 12.3%,rgba(255,255,255,.10) 12.5%,transparent 12.7%);
  mix-blend-mode:screen;
  opacity:0;
  animation:v46Blueprint 1.65s ease-out both;
}
.hero-build-sequence .hero-slide.is-active::after{
  content:"";
  position:absolute;z-index:3;top:-5%;bottom:-5%;width:18%;
  inset-inline-start:-22%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.18),rgba(217,182,120,.26),transparent);
  filter:blur(8px);
  transform:skewX(-7deg);
  animation:v46Scan 1.75s .08s cubic-bezier(.4,0,.2,1) both;
  pointer-events:none;
}
.hero-build-lines{position:absolute;inset:0;z-index:4;pointer-events:none;opacity:.42;overflow:hidden}
.hero-build-lines i{position:absolute;width:1px;height:32%;top:12%;background:linear-gradient(transparent,rgba(217,182,120,.8),transparent);animation:v46LineFloat 6.4s ease-in-out infinite}
.hero-build-lines i:nth-child(1){left:22%;animation-delay:-1.8s}.hero-build-lines i:nth-child(2){left:51%;height:48%;top:28%;animation-delay:-4s}.hero-build-lines i:nth-child(3){left:78%;height:26%;top:18%;animation-delay:-5.2s}
@keyframes v46BuildReveal{
  0%{opacity:0;clip-path:inset(14% 48% 14% 48% round 26px);filter:grayscale(.9) brightness(.58) contrast(1.18)}
  12%{opacity:1}
  42%{clip-path:inset(8% 31% 8% 31% round 18px);filter:grayscale(.62) brightness(.72) contrast(1.12)}
  72%{clip-path:inset(2% 8% 2% 8% round 8px);filter:grayscale(.15) brightness(.9) contrast(1.06)}
  100%{opacity:1;clip-path:inset(0);filter:none}
}
@keyframes v46SceneDrift{from{transform:scale(1.035) translate3d(0,0,0)}to{transform:scale(1.065) translate3d(-.35%,.2%,0)}}
@keyframes v46Leaving{from{opacity:1;transform:scale(1.06)}to{opacity:.26;transform:scale(1.075);filter:blur(1px) brightness(.7)}}
@keyframes v46Blueprint{0%,12%{opacity:0}28%{opacity:.58}78%{opacity:.18}100%{opacity:0}}
@keyframes v46Scan{0%{inset-inline-start:-22%;opacity:0}18%{opacity:1}100%{inset-inline-start:112%;opacity:0}}
@keyframes v46LineFloat{0%,100%{transform:translateY(-4%);opacity:.15}50%{transform:translateY(175%);opacity:.6}}

/* Compact physical circular action. No giant pill; circular mechanics stay proportional. */
.hero-actions{align-items:center;gap:12px;margin-top:28px}
.hero-consult-btn{
  --cta-gold:#d8b474;
  --cta-ink:#17130e;
  min-height:58px;
  padding:5px 7px 5px 22px!important;
  gap:15px;
  border-radius:999px;
  background:linear-gradient(135deg,#e2c487,#d8b474 58%,#cda45f)!important;
  border:1px solid rgba(255,255,255,.28);
  box-shadow:0 10px 28px rgba(0,0,0,.2),inset 0 1px 0 rgba(255,255,255,.52);
  overflow:visible;
}
html[dir="rtl"] .hero-consult-btn{padding:5px 22px 5px 7px!important}
.hero-consult-label{font-size:13px;font-weight:700;letter-spacing:0}
.consult-knob{width:48px;height:48px;flex-basis:48px;filter:drop-shadow(0 6px 7px rgba(0,0,0,.24));isolation:isolate}
.consult-knob::before{
  inset:0;
  background:repeating-conic-gradient(from 0deg,#1b1814 0 3deg,#826844 3deg 5deg,#1b1814 5deg 9deg);
  -webkit-mask:radial-gradient(circle,transparent 0 59%,#000 60% 74%,transparent 75%);
  mask:radial-gradient(circle,transparent 0 59%,#000 60% 74%,transparent 75%);
  animation:v46KnobOuter 6.8s linear infinite;
}
.consult-knob-base{inset:7px;background:radial-gradient(circle at 38% 32%,#4c4235,#181511 65%,#080706);transform:translateZ(-5px) translateY(3px)}
.consult-knob-ring{inset:9px;border:1px solid rgba(235,203,145,.76);box-shadow:0 0 0 2px rgba(20,17,13,.62),inset 0 0 8px rgba(255,221,162,.16);animation:v46KnobCounter 9s linear infinite}
.consult-knob-top{
  inset:11px;
  background:radial-gradient(circle at 34% 28%,#66605a 0 7%,#302d29 38%,#151310 74%,#090807 100%);
  animation:v46KnobOrbit 3.2s cubic-bezier(.45,0,.55,1) infinite;
}
.consult-knob-top::after{top:4px;right:8px;width:8px;height:2px;background:#e0bc78}
.consult-knob-arrow{font-size:15px;transition:transform .55s cubic-bezier(.16,1,.3,1)}
.hero-consult-btn::after{
  content:"";position:absolute;inset:2px;border-radius:inherit;pointer-events:none;
  background:linear-gradient(105deg,transparent 20%,rgba(255,255,255,.38) 44%,transparent 60%);
  transform:translateX(-125%);opacity:0;
}
.hero-consult-btn:hover::after{animation:v46ButtonSheen .85s ease both}
.hero-consult-btn:hover{transform:translateY(-2px)!important;box-shadow:0 16px 36px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.58)}
.hero-consult-btn:hover .consult-knob::before{animation-duration:1.15s}
.hero-consult-btn:hover .consult-knob-ring{animation-duration:1.65s;transform:none}
.hero-consult-btn:hover .consult-knob-top{animation:v46KnobEngage .72s cubic-bezier(.16,1,.3,1) both;background:radial-gradient(circle at 34% 28%,#6c6660,#322f2b 42%,#151310 77%,#090807)}
.hero-consult-btn:hover .consult-knob-arrow{transform:rotate(45deg) scale(1.04)}
.hero-consult-btn:active .consult-knob-top{animation:none;transform:translateY(2px) scale(.94)}
@keyframes v46KnobOuter{to{transform:rotate(360deg)}}
@keyframes v46KnobCounter{to{transform:rotate(-360deg)}}
@keyframes v46KnobOrbit{0%,100%{transform:translate(0,-1px) rotate(0)}25%{transform:translate(1.6px,0) rotate(2deg)}50%{transform:translate(0,1.3px) rotate(0)}75%{transform:translate(-1.6px,0) rotate(-2deg)}}
@keyframes v46KnobEngage{0%{transform:translateY(-1px) rotate(0) scale(1)}45%{transform:translateY(-5px) rotate(28deg) scale(.95)}100%{transform:translateY(-3px) rotate(44deg) scale(.97)}}
@keyframes v46ButtonSheen{0%{transform:translateX(-125%);opacity:0}28%{opacity:.9}100%{transform:translateX(125%);opacity:0}}

/* TRUE WHITE THEME: every UI surface is #fff; no beige or dark chrome. */
html[data-theme="light"]{
  --bg:#ffffff;--bg-soft:#ffffff;--surface:#ffffff;--surface-2:#ffffff;
  --text:#171717;--muted:#666666;--line:#e4e4e4;
  --header:rgba(255,255,255,.97);--shadow:0 18px 48px rgba(0,0,0,.07);
  color-scheme:light;
}
html[data-theme="light"],html[data-theme="light"] body{background:#fff!important;color:var(--text)}
html[data-theme="light"] .section,
html[data-theme="light"] .about,
html[data-theme="light"] .services,
html[data-theme="light"] .gallery,
html[data-theme="light"] .faq,
html[data-theme="light"] .contact,
html[data-theme="light"] .footer,
html[data-theme="light"] .marquee-band,
html[data-theme="light"] .mission-vision,
html[data-theme="light"] .approach,
html[data-theme="light"] .riyadh-panel,
html[data-theme="light"] .riyadh-grid{background:#fff!important;color:var(--text)!important}
html[data-theme="light"] :is(.mv-card,.service-card,.process-card,.contact-form,.statement-card,.studio-facts article,.contact-detail,.footer-contact-item,.faq-item,.riyadh-copy){background:#fff!important;color:var(--text)!important;border-color:#e4e4e4!important;box-shadow:0 14px 38px rgba(0,0,0,.055)!important}
html[data-theme="light"] .approach-heading h2,
html[data-theme="light"] .process-card h3,
html[data-theme="light"] .process-card p,
html[data-theme="light"] .process-num{color:var(--text)!important}
html[data-theme="light"] .process-card p{color:var(--muted)!important}
html[data-theme="light"] .process-icon{color:#8a6a3e!important;border-color:#dedede!important;background:#fff!important}
html[data-theme="light"] .site-header .nav-shell,
html[data-theme="light"] .site-header:not(.is-scrolled) .nav-shell,
html[data-theme="light"] .site-header.is-scrolled .nav-shell{background:rgba(255,255,255,.97)!important;border-color:#e4e4e4!important;box-shadow:0 12px 32px rgba(0,0,0,.065)!important}
html[data-theme="light"] .desktop-nav.rail,
html[data-theme="light"] .site-header:not(.is-scrolled) .desktop-nav.rail,
html[data-theme="light"] .theme-picker,
html[data-theme="light"] .site-header:not(.is-scrolled) .theme-picker,
html[data-theme="light"] .lang-toggle,
html[data-theme="light"] .site-header:not(.is-scrolled) .lang-toggle,
html[data-theme="light"] .mobile-menu{background:#fff!important;border-color:#e1e1e1!important;color:#171717!important}
html[data-theme="light"] .desktop-nav.rail a,
html[data-theme="light"] .site-header:not(.is-scrolled) .desktop-nav a,
html[data-theme="light"] .lang-toggle,
html[data-theme="light"] .site-header:not(.is-scrolled) .lang-toggle{color:#262626!important;text-shadow:none!important}
html[data-theme="light"] .desktop-nav.rail a:hover,
html[data-theme="light"] .desktop-nav.rail a.is-active{color:#000!important;background:#f7f7f7!important}
html[data-theme="light"] .nav-fluid-mask,
html[data-theme="light"] .nav-bead{color:#171717}
html[data-theme="light"] .theme-dot.is-active{background:#f4f4f4!important;box-shadow:0 0 0 1px #ddd inset}
html[data-theme="light"] .theme-swatch-light{background:#fff!important;border-color:#bdbdbd!important;box-shadow:none}
html[data-theme="light"] .nav-cta{background:#fff!important;color:#171717!important;border:1px solid #d8d8d8!important}
html[data-theme="light"] .hero-shade,
html[data-theme="light"] html[dir="rtl"] .hero-shade,
html[data-theme="light"] html[dir="ltr"] .hero-shade{background:linear-gradient(90deg,rgba(255,255,255,.14),rgba(255,255,255,.26) 46%,rgba(255,255,255,.68) 100%)!important}
html[dir="rtl"][data-theme="light"] .hero-shade{background:linear-gradient(270deg,rgba(255,255,255,.14),rgba(255,255,255,.26) 46%,rgba(255,255,255,.68) 100%)!important}
html[data-theme="light"] .hero-title-clean>span{color:#171717!important}
html[data-theme="light"] .hero-title-clean>em{color:#7d5f37!important}
html[data-theme="light"] .hero-lead-online,html[data-theme="light"] .eyebrow{color:#333!important}
html[data-theme="light"] .hero-grid{background-image:linear-gradient(rgba(0,0,0,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.055) 1px,transparent 1px)}
html[data-theme="light"] .btn-secondary{background:#fff!important;border-color:#d8d8d8!important;color:#171717!important}
html[data-theme="light"] .hero-consult-btn{background:#fff!important;color:#171717!important;border-color:#d4d4d4!important;box-shadow:0 10px 28px rgba(0,0,0,.10),inset 0 1px 0 #fff!important}
html[data-theme="light"] .hero-consult-btn::before{background:linear-gradient(110deg,rgba(255,255,255,.9),transparent 55%,rgba(0,0,0,.025))}
html[data-theme="light"] .consult-knob::before{background:repeating-conic-gradient(from 0deg,#b5b5b5 0 3deg,#ececec 3deg 5deg,#b5b5b5 5deg 9deg)}
html[data-theme="light"] .consult-knob-base{background:linear-gradient(160deg,#fff,#e9e9e9 62%,#d7d7d7);border-color:#d1d1d1}
html[data-theme="light"] .consult-knob-ring{border-color:#a8a8a8;box-shadow:0 0 0 2px #fff,inset 0 0 7px rgba(0,0,0,.05)}
html[data-theme="light"] .consult-knob-top{color:#1d1d1d;background:radial-gradient(circle at 34% 28%,#fff 0 12%,#f1f1f1 42%,#dfdfdf 78%,#d4d4d4 100%);border-color:#cfcfcf;box-shadow:0 5px 10px rgba(0,0,0,.14),inset 0 1px 1px #fff,inset 0 -2px 4px rgba(0,0,0,.07)}
html[data-theme="light"] .consult-knob-top::after{background:#8a6a3e;box-shadow:none}
html[data-theme="light"] .hero-consult-btn:hover .consult-knob-top{background:radial-gradient(circle at 34% 28%,#fff,#ededed 46%,#dadada 100%)}
html[data-theme="light"] .gallery-lightbox{background:#fff!important;color:#171717!important;box-shadow:0 30px 100px rgba(0,0,0,.18)}
html[data-theme="light"] .gallery-lightbox::backdrop{background:rgba(245,245,245,.92)!important}
html[data-theme="light"] .gallery-lightbox figcaption{color:#444!important}
html[data-theme="light"] :is(.lightbox-close,.lightbox-nav){background:#fff!important;color:#171717!important;border-color:#d8d8d8!important}
html[data-theme="light"] .like-btn{background:rgba(255,255,255,.94)!important;color:#171717!important;border-color:#d6d6d6!important}
html[data-theme="light"] input,html[data-theme="light"] textarea,html[data-theme="light"] select{background:#fff!important;color:#171717!important;border-color:#d8d8d8!important;box-shadow:none!important}
html[data-theme="light"] input:-webkit-autofill,
html[data-theme="light"] textarea:-webkit-autofill,
html[data-theme="light"] select:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px #fff inset!important;-webkit-text-fill-color:#171717!important}

@media(max-width:820px){
  .hero-title-clean{max-width:100%;font-size:clamp(40px,9.4vw,58px);line-height:1.28}
  .hero-lead-online{max-width:620px;font-size:14px;line-height:1.85}
  .hero-build-lines{display:none}
}
@media(max-width:590px){
  .hero-content{padding-top:126px;padding-bottom:72px}
  .hero-title-clean{font-size:clamp(34px,9.9vw,47px);line-height:1.3}
  .hero-title-clean>em{margin-top:.16em!important}
  .hero-lead-online{font-size:13.5px;margin-top:18px}
  .hero-actions{margin-top:24px;display:grid;grid-template-columns:1fr}
  .hero-actions .hero-consult-btn{width:100%;min-height:58px;justify-content:space-between;padding-inline:18px 6px!important}
  .hero-actions .btn-secondary{width:100%}
  .consult-knob{width:46px;height:46px;flex-basis:46px}
  .hero-consult-label{font-size:12.5px}
}
@media(prefers-reduced-motion:reduce){
  .hero-build-sequence .hero-slide{animation:none!important;transition:none!important;clip-path:none!important;transform:none!important}
  .hero-build-sequence .hero-slide:not(.is-active){display:none!important}
  .hero-build-sequence .hero-slide.is-active{opacity:1!important}
  .hero-build-sequence .hero-slide.is-active::before,.hero-build-sequence .hero-slide.is-active::after,.hero-build-lines{display:none!important}
  .consult-knob::before,.consult-knob-ring,.consult-knob-top{animation:none!important}
}
/* V46 light-theme completion: interactive surfaces stay white too. */
html[data-theme="light"] :is(.btn-primary,.gallery-arrow,.carousel-cta,.contact .btn-primary,.footer .btn,.menu-toggle,.mobile-themes button){
  background:#fff!important;color:#171717!important;border-color:#d8d8d8!important;box-shadow:none!important;
}
html[data-theme="light"] .scroll-progress{background:#ededed!important}
html[data-theme="light"] .scroll-progress span{background:#9a7a4f!important}
html[data-theme="light"] .meniscus-nav .nav-bead{background:#fff!important;border-color:#d8d8d8!important;box-shadow:0 6px 14px rgba(0,0,0,.08)!important}
html[data-theme="light"] .meniscus-nav .nav-fluid-mask path{fill:#fff!important;stroke:#e2e2e2!important}
html[data-theme="light"] .mobile-menu a{color:#171717!important;border-color:#e5e5e5!important}
html[data-theme="light"] .contact-orbit span,html[data-theme="light"] .mv-orbit i{border-color:#e5e5e5!important}
html[data-theme="light"] .footer-contact-item small,html[data-theme="light"] .form-heading span,html[data-theme="light"] .contact-description{color:#666!important}

/* ========================= V47 — refined hero, physical circular CTA, true-white completion ========================= */

/* Typography: calmer proportions, predictable line breaks, no banner-like treatment. */
.hero-content{
  position:relative;
  z-index:6;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  min-height:100%;
  padding-top:clamp(150px,18vh,210px);
  padding-bottom:clamp(86px,10vh,120px);
}
.hero-content > :is(.eyebrow,.hero-title-clean,.hero-lead-online,.hero-actions){
  width:min(720px,100%);
}
.hero-title-clean{
  margin:0;
  max-width:720px!important;
  font-size:clamp(46px,5.55vw,82px)!important;
  line-height:1.14!important;
  letter-spacing:-.025em;
  font-weight:600!important;
  text-wrap:balance;
}
html[lang="ar"] .hero-title-clean{
  font-family:"Noto Kufi Arabic","Noto Sans Arabic",Tahoma,Arial,sans-serif!important;
  letter-spacing:-.035em;
}
.hero-title-clean > span,
.hero-title-clean > em{
  display:block;
  width:100%;
  background:none!important;
  box-decoration-break:initial!important;
  -webkit-box-decoration-break:initial!important;
  padding:0!important;
}
.hero-title-clean > em{
  margin-top:.14em!important;
  font-size:.72em;
  line-height:1.28!important;
  font-weight:500!important;
  color:#d8b779;
}
.hero-lead-online{
  max-width:650px!important;
  margin-top:24px!important;
  font-size:15.5px!important;
  line-height:2!important;
  color:rgba(245,241,233,.84);
  white-space:pre-line;
  text-wrap:pretty;
}
.hero-actions{
  width:auto!important;
  max-width:650px!important;
  display:flex;
  align-items:center;
  gap:12px;
  margin-top:26px!important;
}
.hero-actions .btn-secondary,
.hero-actions .btn-ghost{
  min-height:54px;
  padding-inline:22px;
}

/* Smoother architectural reveal: no harsh geometric crop, less visual noise. */
.hero-build-sequence .hero-slide.is-active{
  animation:v47SceneArrive 1.55s cubic-bezier(.2,.82,.2,1) both,v47SceneFloat 5.6s cubic-bezier(.22,1,.36,1) both!important;
}
.hero-build-sequence .hero-slide.is-leaving{
  animation:v47SceneLeave 1.55s cubic-bezier(.22,1,.36,1) both!important;
}
.hero-build-sequence .hero-slide.is-active::before{
  opacity:0!important;
  animation:none!important;
}
.hero-build-sequence .hero-slide.is-active::after{
  width:9%!important;
  inset-inline-start:-14%!important;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.15),rgba(255,255,255,.06),transparent)!important;
  filter:blur(15px)!important;
  animation:v47SoftSweep 1.5s .08s cubic-bezier(.4,0,.2,1) both!important;
}
.hero-build-lines{opacity:.13!important}
.hero-build-lines i{background:linear-gradient(transparent,rgba(255,255,255,.55),transparent)!important;animation-duration:9s!important}
@keyframes v47SceneArrive{
  0%{opacity:0;transform:scale(1.025);filter:blur(9px) saturate(.72) brightness(.82)}
  30%{opacity:.82;filter:blur(3px) saturate(.84) brightness(.9)}
  100%{opacity:1;transform:scale(1.045);filter:none}
}
@keyframes v47SceneFloat{
  from{transform:scale(1.045) translate3d(0,0,0)}
  to{transform:scale(1.075) translate3d(-.32%,.18%,0)}
}
@keyframes v47SceneLeave{
  from{opacity:1;transform:scale(1.07);filter:none}
  to{opacity:0;transform:scale(1.085);filter:blur(4px) saturate(.76) brightness(.76)}
}
@keyframes v47SoftSweep{
  0%{inset-inline-start:-14%;opacity:0}
  16%{opacity:.75}
  100%{inset-inline-start:108%;opacity:0}
}

/* Physical circular control inspired by stacked mechanical discs. */
.hero-consult-btn{
  min-height:60px!important;
  width:max-content!important;
  max-width:100%;
  padding:5px 7px 5px 20px!important;
  gap:15px!important;
  border-radius:999px!important;
  overflow:visible!important;
  transform:translateZ(0);
}
html[dir="rtl"] .hero-consult-btn{padding:5px 20px 5px 7px!important}
.hero-consult-label{
  font-size:13.5px!important;
  font-weight:700!important;
  white-space:nowrap;
}
.consult-knob{
  position:relative;
  width:50px!important;
  height:50px!important;
  flex:0 0 50px!important;
  display:block;
  perspective:620px;
  transform-style:preserve-3d;
  isolation:isolate;
  filter:none!important;
}
.consult-knob > span{
  position:absolute;
  border-radius:50%;
  pointer-events:none;
  will-change:transform;
  transform-style:preserve-3d;
}
.consult-knob-shadow{
  inset:10px 4px 0 4px;
  z-index:0;
  background:rgba(0,0,0,.42);
  filter:blur(7px);
  transform:translateY(8px) scale(.9);
  opacity:.62;
  transition:transform .72s cubic-bezier(.16,1,.3,1),opacity .45s ease;
}
.consult-knob-base{
  inset:3px!important;
  z-index:1;
  background:linear-gradient(180deg,#3b3732 0%,#171512 52%,#080706 100%)!important;
  border:1px solid rgba(255,255,255,.14)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 6px 12px rgba(0,0,0,.32)!important;
  transform:translateZ(0);
  transition:transform .72s cubic-bezier(.16,1,.3,1);
}
.consult-knob-cage{
  inset:7px;
  z-index:2;
  border:2px solid rgba(205,165,109,.52);
  box-shadow:0 0 0 2px rgba(12,10,8,.72),inset 0 0 0 1px rgba(255,255,255,.09);
  background:transparent;
  transform:translateZ(2px);
  transition:transform .72s cubic-bezier(.16,1,.3,1),box-shadow .4s ease;
}
.consult-knob-gear{
  inset:8px;
  z-index:3;
  background:repeating-conic-gradient(from 0deg,#111 0 4deg,#95774e 4deg 6deg,#191713 6deg 10deg);
  -webkit-mask:radial-gradient(circle,transparent 0 58%,#000 59% 75%,transparent 76%);
  mask:radial-gradient(circle,transparent 0 58%,#000 59% 75%,transparent 76%);
  animation:v47GearIdle 10s linear infinite;
  transition:transform .72s cubic-bezier(.16,1,.3,1);
}
.consult-knob-ring{
  inset:10px!important;
  z-index:4;
  border:1px solid rgba(238,205,148,.9)!important;
  background:rgba(20,17,13,.48);
  box-shadow:0 0 0 2px rgba(0,0,0,.52),inset 0 0 10px rgba(219,183,122,.16)!important;
  animation:none!important;
  transform:translateZ(5px);
  transition:transform .72s cubic-bezier(.16,1,.3,1),background .35s ease;
}
.consult-knob-top{
  inset:12px!important;
  z-index:5;
  display:grid;
  place-items:center;
  color:#f6efe4;
  background:radial-gradient(circle at 34% 28%,#625c56 0 8%,#302d29 38%,#151310 72%,#090807 100%)!important;
  border:1px solid rgba(255,255,255,.19)!important;
  box-shadow:0 5px 9px rgba(0,0,0,.4),inset 0 1px 1px rgba(255,255,255,.22),inset 0 -3px 5px rgba(0,0,0,.4)!important;
  animation:v47TopIdle 4.8s ease-in-out infinite!important;
  transform:translateZ(8px);
  transition:transform .72s cubic-bezier(.16,1,.3,1),box-shadow .4s ease,background .4s ease;
}
.consult-knob-top::after{
  content:"";
  position:absolute;
  top:5px;
  width:9px;
  height:2px;
  border-radius:999px;
  background:#e1bd7a;
}
.consult-knob-arrow{
  display:block;
  font-size:15px!important;
  line-height:1;
  transform:translateY(1px);
  transition:transform .72s cubic-bezier(.16,1,.3,1)!important;
}
.hero-consult-btn:hover .consult-knob-shadow{transform:translateY(13px) scale(.76);opacity:.36}
.hero-consult-btn:hover .consult-knob-base{transform:translateY(1px) scale(.98)}
.hero-consult-btn:hover .consult-knob-cage{transform:translateY(-3px) translateZ(10px) rotateZ(-8deg);box-shadow:0 7px 10px rgba(0,0,0,.28),0 0 0 2px rgba(12,10,8,.65)}
.hero-consult-btn:hover .consult-knob-gear{animation-duration:1.5s;transform:translateY(-6px) translateZ(15px) rotateZ(18deg)}
.hero-consult-btn:hover .consult-knob-ring{transform:translateY(-9px) translateZ(22px) scale(.96)!important;background:rgba(35,29,22,.54)}
.hero-consult-btn:hover .consult-knob-top{animation:none!important;transform:translateY(-14px) translateZ(30px) rotateX(10deg) rotateZ(8deg) scale(.95)!important;box-shadow:0 14px 18px rgba(0,0,0,.34),inset 0 1px 1px rgba(255,255,255,.22)!important}
.hero-consult-btn:hover .consult-knob-arrow{transform:translateY(1px) rotate(45deg) scale(1.07)!important}
.hero-consult-btn:active .consult-knob-shadow{transform:translateY(7px) scale(.95);opacity:.72}
.hero-consult-btn:active .consult-knob-cage,
.hero-consult-btn:active .consult-knob-gear,
.hero-consult-btn:active .consult-knob-ring,
.hero-consult-btn:active .consult-knob-top{animation:none!important;transform:translateY(1px) translateZ(0) scale(.93)!important;transition-duration:.12s!important}
@keyframes v47GearIdle{to{transform:rotate(360deg)}}
@keyframes v47TopIdle{0%,100%{transform:translateY(0) translateZ(8px)}50%{transform:translateY(-1.5px) translateZ(10px)}}

/* Light means white: use white surfaces and neutral grayscale, including the hero chrome. */
html[data-theme="light"]{
  --bg:#fff!important;
  --bg-soft:#fff!important;
  --surface:#fff!important;
  --surface-2:#fff!important;
  --header:#fff!important;
  --text:#151515;
  --muted:#676767;
  --line:#dedede!important;
  --accent:#cda56d;
  --accent-strong:#e4c38f;
  --accent-ink:#17120c;
  background:#fff!important;
}
html[data-theme="light"] body{
  background:#fff!important;
  background-image:none!important;
}
html[data-theme="light"] .hero-media img{
  filter:brightness(1.12) saturate(.74) contrast(.88)!important;
}
html[data-theme="light"] .hero-shade{
  background:linear-gradient(90deg,rgba(255,255,255,.50),rgba(255,255,255,.66) 44%,rgba(255,255,255,.91) 100%)!important;
}
html[dir="rtl"][data-theme="light"] .hero-shade{
  background:linear-gradient(270deg,rgba(255,255,255,.50),rgba(255,255,255,.66) 44%,rgba(255,255,255,.91) 100%)!important;
}
html[data-theme="light"] .hero-grid{opacity:.14!important;background-image:linear-gradient(rgba(0,0,0,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.06) 1px,transparent 1px)!important}
html[data-theme="light"] .eyebrow,
html[data-theme="light"] .hero-title-clean > span,
html[data-theme="light"] .hero-title-clean > em,
html[data-theme="light"] .hero-lead-online{color:#171717!important;text-shadow:none!important}
html[data-theme="light"] .eyebrow-line{background:#777!important}
html[data-theme="light"] .site-header .nav-shell,
html[data-theme="light"] .desktop-nav.rail,
html[data-theme="light"] .theme-picker,
html[data-theme="light"] .lang-toggle,
html[data-theme="light"] .mobile-menu,
html[data-theme="light"] .site-header:not(.is-scrolled) .nav-shell,
html[data-theme="light"] .site-header:not(.is-scrolled) .desktop-nav.rail,
html[data-theme="light"] .site-header:not(.is-scrolled) .theme-picker,
html[data-theme="light"] .site-header:not(.is-scrolled) .lang-toggle{
  background:#fff!important;
  color:#171717!important;
  border-color:#dedede!important;
  box-shadow:0 10px 28px rgba(0,0,0,.06)!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
html[data-theme="light"] .desktop-nav.rail .pill{background:#fff!important;border:1px solid #d5d5d5!important;box-shadow:0 4px 12px rgba(0,0,0,.06)!important}
html[data-theme="light"] .site-header:not(.is-scrolled) :is(.desktop-nav a,.lang-toggle,.theme-dot){color:#242424!important;text-shadow:none!important}
html[data-theme="light"] .brand-wordmark,
html[data-theme="light"] .brand-mark{filter:none!important}
html[data-theme="light"] .scroll-cue{background:#fff!important;color:#171717!important;border-color:#d8d8d8!important;box-shadow:0 8px 22px rgba(0,0,0,.07)!important;backdrop-filter:none!important}
html[data-theme="light"] .scroll-cue i{background:#777!important}
html[data-theme="light"] :is(.section,.about,.services,.gallery,.faq,.contact,.footer,.marquee-band,.mission-vision,.approach,.riyadh-panel,.riyadh-grid,.map-badge,.contact-form,.service-card,.process-card,.mv-card,.statement-card,.studio-facts article,.contact-detail,.faq-item,.footer-contact-item){
  background:#fff!important;
  background-image:none!important;
  color:#171717!important;
  border-color:#e1e1e1!important;
}
html[data-theme="light"] :is(.section,.about,.services,.gallery,.faq,.contact,.footer,.marquee-band,.mission-vision,.approach){box-shadow:none!important}
html[data-theme="light"] :is(.kicker,.process-icon,.process-num,.map-badge span,.contact-detail-icon,.studio-facts span){color:#555!important}
html[data-theme="light"] :is(.process-card p,.contact-description,.footer-contact-item small,.form-heading span,.faq-answer,.muted){color:#686868!important}
html[data-theme="light"] .map-badge{box-shadow:0 8px 20px rgba(0,0,0,.08)!important}
html[data-theme="light"] .riyadh-map iframe{filter:grayscale(1) brightness(1.1) contrast(.85)!important}
html[data-theme="light"] .map-shade{background:linear-gradient(90deg,transparent 52%,rgba(255,255,255,.92))!important}
html[dir="ltr"][data-theme="light"] .map-shade{background:linear-gradient(270deg,transparent 52%,rgba(255,255,255,.92))!important}
html[data-theme="light"] :is(.btn,.btn-primary,.btn-secondary,.btn-ghost,.gallery-arrow,.carousel-cta,.nav-cta,.menu-toggle,.mobile-themes button){
  background:#fff!important;
  color:#171717!important;
  border-color:#d5d5d5!important;
  box-shadow:none!important;
}
html[data-theme="light"] :is(.btn,.btn-primary,.btn-secondary,.btn-ghost,.gallery-arrow,.carousel-cta,.nav-cta):hover{background:#fff!important;border-color:#a9a9a9!important;color:#000!important}
html[data-theme="light"] .hero-consult-btn{background:#fff!important;border-color:#d2d2d2!important;box-shadow:0 10px 26px rgba(0,0,0,.08)!important}
html[data-theme="light"] .consult-knob-shadow{background:rgba(0,0,0,.12)!important}
html[data-theme="light"] .consult-knob-base{background:linear-gradient(180deg,#fff,#f3f3f3)!important;border-color:#d0d0d0!important;box-shadow:inset 0 1px 0 #fff,0 5px 11px rgba(0,0,0,.11)!important}
html[data-theme="light"] .consult-knob-cage{border-color:#c6c6c6!important;box-shadow:0 0 0 2px #fff,inset 0 0 0 1px #ececec!important}
html[data-theme="light"] .consult-knob-gear{background:repeating-conic-gradient(from 0deg,#a8a8a8 0 4deg,#ececec 4deg 6deg,#b9b9b9 6deg 10deg)!important}
html[data-theme="light"] .consult-knob-ring{background:#fff!important;border-color:#bdbdbd!important;box-shadow:0 0 0 2px #fff,inset 0 0 7px rgba(0,0,0,.05)!important}
html[data-theme="light"] .consult-knob-top{color:#171717!important;background:radial-gradient(circle at 34% 28%,#fff 0 12%,#f5f5f5 42%,#e8e8e8 78%,#dedede 100%)!important;border-color:#cfcfcf!important;box-shadow:0 5px 10px rgba(0,0,0,.12),inset 0 1px 1px #fff,inset 0 -2px 4px rgba(0,0,0,.06)!important}
html[data-theme="light"] .consult-knob-top::after{background:#555!important}
html[data-theme="light"] :is(input,textarea,select){background:#fff!important;color:#171717!important;border-color:#d7d7d7!important}
html[data-theme="light"] .contact-form .field > label{background:#fff!important;color:#666!important}
html[data-theme="light"] .contact-form .field :is(input,textarea,select):focus{border-color:#999!important;box-shadow:0 0 0 3px rgba(0,0,0,.04)!important}
html[data-theme="light"] .contact-form .field :is(input,textarea):focus + label,
html[data-theme="light"] .contact-form .field :is(input,textarea):not(:placeholder-shown) + label,
html[data-theme="light"] .contact-form .select-field > label{color:#333!important}
html[data-theme="light"] ::selection{background:#222!important;color:#fff!important}

@media(max-width:820px){
  .hero-content{padding-top:132px;padding-bottom:82px}
  .hero-content > :is(.eyebrow,.hero-title-clean,.hero-lead-online,.hero-actions){width:100%}
  .hero-title-clean{font-size:clamp(38px,8.6vw,58px)!important;line-height:1.2!important;max-width:660px!important}
  .hero-title-clean > em{font-size:.76em;line-height:1.34!important}
  .hero-lead-online{font-size:14.5px!important;line-height:1.95!important}
}
@media(max-width:590px){
  .hero-content{padding-top:120px!important;padding-bottom:70px!important}
  .hero-title-clean{font-size:clamp(31px,9vw,43px)!important;line-height:1.24!important;letter-spacing:-.02em!important}
  .hero-title-clean > em{font-size:.76em!important;margin-top:.18em!important}
  .hero-lead-online{font-size:13.5px!important;line-height:1.9!important;margin-top:17px!important}
  .hero-actions{display:grid!important;grid-template-columns:1fr!important;gap:10px!important;width:100%!important;max-width:100%!important}
  .hero-actions .hero-consult-btn{width:100%!important;justify-content:space-between!important}
  .hero-actions :is(.btn-secondary,.btn-ghost){width:100%!important}
  .consult-knob{width:48px!important;height:48px!important;flex-basis:48px!important}
  .hero-consult-label{font-size:12.5px!important}
}
@media(prefers-reduced-motion:reduce){
  .consult-knob-gear,.consult-knob-top{animation:none!important}
  .hero-consult-btn:hover :is(.consult-knob-base,.consult-knob-cage,.consult-knob-gear,.consult-knob-ring,.consult-knob-top,.consult-knob-shadow){transform:none!important}
  .hero-consult-btn:hover .consult-knob-arrow{transform:none!important}
  .hero-build-sequence .hero-slide{animation:none!important;filter:none!important}
}
html[data-theme="light"] body{transition:color .25s ease!important}
html[data-theme="light"] .hero,
html[data-theme="light"] .hero-media,
html[data-theme="light"] .hero-slideshow{background:#fff!important}


/* ========================= V48 — true-white surfaces + preserved effect colors ========================= */
/* White theme keeps its surfaces genuinely white, but accent/effect colors remain active. */
html[data-theme="light"] .desktop-nav.rail.meniscus-nav .nav-fluid-path{
  fill:#fff!important;
  stroke:#dedede!important;
}
html[data-theme="light"] .desktop-nav.rail.meniscus-nav .nav-bead{
  background:var(--meniscus-accent)!important;
  color:#111!important;
  box-shadow:0 0 0 6px color-mix(in srgb,var(--meniscus-accent) 16%,transparent),
             0 9px 22px color-mix(in srgb,var(--meniscus-accent) 36%,transparent)!important;
}
html[data-theme="light"] .desktop-nav.rail.meniscus-nav .meniscus-tab:is(.active,.is-active,.is-preview) .tab-label,
html[data-theme="light"] .desktop-nav.rail.meniscus-nav .meniscus-tab:hover .tab-label,
html[data-theme="light"] .desktop-nav.rail.meniscus-nav .meniscus-tab:focus-visible .tab-label{
  color:var(--meniscus-accent)!important;
}
html[data-theme="light"] .desktop-nav.rail.meniscus-nav .meniscus-tab:focus-visible{
  outline-color:var(--meniscus-accent)!important;
}

/* Restore the identity color selected in Admin across white-theme micro-interactions. */
html[data-theme="light"] :is(.kicker,.process-icon,.process-num,.map-badge span,.contact-detail-icon,.studio-facts span){
  color:var(--accent)!important;
}
html[data-theme="light"] .eyebrow-line,
html[data-theme="light"] .scroll-progress span{
  background:var(--accent)!important;
}
html[data-theme="light"] .scroll-cue i{background:var(--accent)!important}
html[data-theme="light"] :is(button,a):focus-visible{outline-color:var(--accent)!important}
html[data-theme="light"] ::selection{background:var(--accent)!important;color:var(--accent-ink)!important}
html[data-theme="light"] .contact-form .field :is(input,textarea,select):focus{
  border-color:var(--accent)!important;
  box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 14%,transparent)!important;
}

/* Primary actions keep white-theme geometry while using the configured accent. */
html[data-theme="light"] :is(.btn-primary,.contact .btn-primary){
  background:var(--accent)!important;
  color:var(--accent-ink)!important;
  border-color:var(--accent)!important;
  box-shadow:0 8px 22px color-mix(in srgb,var(--accent) 18%,transparent)!important;
}
html[data-theme="light"] .nav-cta{
  background:#fff!important;
  color:color-mix(in srgb,var(--accent) 88%,#111)!important;
  border-color:color-mix(in srgb,var(--accent) 62%,#d5d5d5)!important;
}
html[data-theme="light"] .nav-cta:hover{
  background:var(--accent)!important;
  color:var(--accent-ink)!important;
  border-color:var(--accent)!important;
}

/* Keep the circular physical CTA colorful in light mode while the page itself stays white. */
html[data-theme="light"] .hero-consult-btn{
  --cta-gold:var(--accent);
  --cta-ink:var(--accent-ink);
  background:linear-gradient(135deg,
    color-mix(in srgb,var(--accent) 54%,#fff) 0%,
    var(--accent) 58%,
    color-mix(in srgb,var(--accent) 82%,#8b6736) 100%)!important;
  color:var(--accent-ink)!important;
  border-color:color-mix(in srgb,var(--accent) 50%,#fff)!important;
  box-shadow:0 11px 28px color-mix(in srgb,var(--accent) 20%,rgba(0,0,0,.14)),
             inset 0 1px 0 rgba(255,255,255,.58)!important;
}
html[data-theme="light"] .hero-consult-btn::before{
  background:linear-gradient(110deg,rgba(255,255,255,.4),transparent 31%,transparent 70%,color-mix(in srgb,var(--accent) 20%,transparent))!important;
}
html[data-theme="light"] .consult-knob-shadow{background:rgba(0,0,0,.38)!important}
html[data-theme="light"] .consult-knob-base{
  background:linear-gradient(180deg,#3b3732 0%,#171512 52%,#080706 100%)!important;
  border-color:color-mix(in srgb,var(--accent) 28%,rgba(255,255,255,.18))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 6px 12px rgba(0,0,0,.28)!important;
}
html[data-theme="light"] .consult-knob-cage{
  border-color:color-mix(in srgb,var(--accent) 72%,#fff)!important;
  box-shadow:0 0 0 2px rgba(12,10,8,.72),inset 0 0 0 1px rgba(255,255,255,.09)!important;
}
html[data-theme="light"] .consult-knob-gear{
  background:repeating-conic-gradient(from 0deg,#111 0 4deg,var(--accent) 4deg 6deg,#191713 6deg 10deg)!important;
}
html[data-theme="light"] .consult-knob-ring{
  background:rgba(20,17,13,.48)!important;
  border-color:color-mix(in srgb,var(--accent) 78%,#fff)!important;
  box-shadow:0 0 0 2px rgba(0,0,0,.52),inset 0 0 10px color-mix(in srgb,var(--accent) 22%,transparent)!important;
}
html[data-theme="light"] .consult-knob-top{
  color:#f6efe4!important;
  background:radial-gradient(circle at 34% 28%,#625c56 0 8%,#302d29 38%,#151310 72%,#090807 100%)!important;
  border-color:rgba(255,255,255,.19)!important;
  box-shadow:0 5px 9px rgba(0,0,0,.4),inset 0 1px 1px rgba(255,255,255,.22),inset 0 -3px 5px rgba(0,0,0,.4)!important;
}
html[data-theme="light"] .consult-knob-top::after{background:var(--accent)!important}

/* Theme swatches always keep their identifying colors inside the white toolbar. */
html[data-theme="light"] .theme-swatch-dark{background:#15130f!important}
html[data-theme="light"] .theme-swatch-light{background:#fff!important;border-color:#bbb!important}
html[data-theme="light"] .theme-swatch-sand{background:#c5a77e!important}
html[data-theme="light"] .theme-swatch-purple{background:#6d4f7c!important}
html[data-theme="light"] .theme-swatch-gray{background:#9da0a3!important}
html[data-theme="light"] .theme-dot.is-active{
  background:color-mix(in srgb,var(--accent) 12%,#fff)!important;
  box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 34%,#dedede)!important;
}


/* ========================= V49 — editable content alignment + refined online-only typography ========================= */
[data-content-layout]{--content-place:start;text-align:start}
[data-content-layout][data-align="start"]{text-align:start}
[data-content-layout][data-align="center"]{text-align:center}
[data-content-layout][data-align="end"]{text-align:end}

/* Explicitly deleted admin copy stays deleted without leaving awkward text blocks. */
[data-i18n]:empty{display:none!important}
.hero-title-clean>span:empty,.hero-title-clean>em:empty,.hero-lead-online:empty,
.section-heading h2:empty,.section-heading p:empty,.statement-card h3:empty,.statement-card p:empty,
.contact-intro h2:empty,.contact-description:empty,.about-copy>p:empty,.about-value-card p:empty{display:none!important}

/* Hero placement */
.hero-content[data-align="center"]{align-items:center}
.hero-content[data-align="center"]>:is(.eyebrow,.hero-title-clean,.hero-lead-online,.hero-actions){margin-inline:auto!important;text-align:center!important}
.hero-content[data-align="center"] .hero-title-clean>:is(span,em){text-align:center!important}
.hero-content[data-align="center"] .hero-actions{justify-content:center}
.hero-content[data-align="end"]{align-items:end}
.hero-content[data-align="end"]>:is(.eyebrow,.hero-title-clean,.hero-lead-online,.hero-actions){margin-inline-start:auto!important;margin-inline-end:0!important;text-align:end!important}
.hero-content[data-align="end"] .hero-title-clean>:is(span,em){text-align:end!important}
.hero-content[data-align="end"] .hero-actions{justify-content:flex-end}

/* Generic content groups */
[data-content-layout="about"][data-align="center"] :is(.section-heading,.about-copy),
[data-content-layout="mission"][data-align="center"] .about-value-card,
[data-content-layout="statement"][data-align="center"],
[data-content-layout="gallery"][data-align="center"],
[data-content-layout="contact"][data-align="center"]{text-align:center}
[data-content-layout="about"][data-align="center"] .about-copy>:is(p,.about-pills,.studio-facts),
[data-content-layout="gallery"][data-align="center"]>*,
[data-content-layout="contact"][data-align="center"]>*{margin-inline:auto}
[data-content-layout="mission"][data-align="center"] .about-value-card{align-items:center}
[data-content-layout="statement"][data-align="center"]{align-items:center}

[data-content-layout="about"][data-align="end"] :is(.section-heading,.about-copy),
[data-content-layout="mission"][data-align="end"] .about-value-card,
[data-content-layout="statement"][data-align="end"],
[data-content-layout="gallery"][data-align="end"],
[data-content-layout="contact"][data-align="end"]{text-align:end}
[data-content-layout="gallery"][data-align="end"]>*{margin-inline-start:auto;margin-inline-end:0}

/* Grid headings become balanced when center/end alignment is chosen from Admin. */
.split-heading[data-align="center"]-heading[data-align="center"]{display:block!important;text-align:center!important}
.split-heading[data-align="center"]>:is(div,p)-heading[data-align="center"]>:is(div,p){max-width:820px!important;margin-inline:auto!important}
.split-heading[data-align="end"]-heading[data-align="end"]{text-align:end!important}
.split-heading[data-align="end"]>:is(div,p)-heading[data-align="end"]>:is(div,p){margin-inline-start:auto!important;margin-inline-end:0!important}

/* More disciplined editorial rhythm */
.hero-title-clean{max-width:min(780px,68vw)!important;font-size:clamp(42px,4.6vw,72px)!important;line-height:1.22!important;font-weight:700!important}
.hero-title-clean>em{font-size:.7em!important;line-height:1.4!important}
.hero-lead-online{max-width:660px!important;font-size:clamp(14px,1.05vw,16.5px)!important;line-height:1.95!important}
.about-copy .large-copy{font-size:clamp(25px,2.6vw,42px)!important;line-height:1.75!important;letter-spacing:-.015em!important}
.section-heading h2,.gallery-heading h2-heading h2,.services .split-heading h2{font-size:clamp(36px,4vw,62px)!important;line-height:1.25!important;letter-spacing:-.02em!important}
.contact-intro h2{font-size:clamp(38px,4.5vw,66px)!important;line-height:1.22!important}

@media(max-width:820px){
  .hero-title-clean{max-width:100%!important;font-size:clamp(36px,8vw,54px)!important}
  .about-grid{grid-template-columns:1fr!important;gap:28px!important}
  [data-content-layout="about"] :is(.section-heading,.about-copy){text-align:inherit}
  .split-heading[data-align="end"]-heading[data-align="end"]{text-align:end!important}
}
@media(max-width:590px){
  .hero-title-clean{font-size:clamp(31px,8.7vw,43px)!important;line-height:1.28!important}
  .hero-title-clean>em{font-size:.76em!important}
  .hero-lead-online{font-size:13.5px!important;line-height:1.9!important}
  .section-heading h2,.gallery-heading h2-heading h2,.services .split-heading h2{font-size:clamp(30px,8vw,42px)!important}
  .about-copy .large-copy{font-size:clamp(22px,6vw,30px)!important;line-height:1.75!important}
}

/* V51 — online journey, style quiz, regional presence, free consultations, before/after; legacy commercial-plan CSS removed */
.free-consultation-note{display:inline-flex;align-items:center;gap:9px;margin:16px 0 0;padding:9px 14px;border:1px solid color-mix(in srgb,var(--accent) 42%,var(--line));border-radius:999px;background:color-mix(in srgb,var(--surface) 76%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);font-size:12px;font-weight:800;color:var(--text);box-shadow:0 14px 40px color-mix(in srgb,var(--accent) 9%,transparent)}
.free-consultation-note::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 6px color-mix(in srgb,var(--accent) 12%,transparent)}
.consultation-free-banner{width:fit-content;margin-top:18px;padding:10px 14px;border-radius:14px;background:color-mix(in srgb,var(--accent) 10%,var(--surface));border:1px solid color-mix(in srgb,var(--accent) 24%,var(--line));font-size:12px;font-weight:800;color:var(--text)}

.studio-facts-expanded{grid-template-columns:repeat(2,minmax(0,1fr))}
.experience-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:18px}
.experience-strip article{position:relative;overflow:hidden;min-height:120px;padding:20px;border:1px solid var(--line);border-radius:22px;background:color-mix(in srgb,var(--surface) 94%,transparent);display:flex;flex-direction:column;justify-content:flex-end;gap:6px}
.experience-strip article::after{content:"";position:absolute;width:84px;height:84px;border-radius:50%;border:1px solid color-mix(in srgb,var(--accent) 24%,transparent);inset-inline-end:-36px;top:-38px}
.experience-strip strong{font-family:var(--font-en);font-size:clamp(28px,3.2vw,46px);line-height:1;color:var(--accent)}
.experience-strip span{font-size:11px;font-weight:700;color:var(--muted)}

.journey{position:relative;overflow:hidden;border-block:1px solid var(--line);background:linear-gradient(180deg,color-mix(in srgb,var(--bg-soft) 96%,var(--accent) 4%),var(--bg))}
.journey::before{content:"";position:absolute;width:420px;height:420px;border:1px solid color-mix(in srgb,var(--accent) 18%,transparent);border-radius:50%;inset-inline-end:-210px;top:-230px;pointer-events:none}
.journey-heading{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(260px,.7fr);gap:clamp(24px,5vw,70px);align-items:end;margin-bottom:clamp(34px,5vw,62px)}
.journey-heading>p{margin:0;color:var(--muted);line-height:1.9;max-width:560px}
.journey-track{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;padding:0;margin:0;list-style:none}
.journey-track::before{content:"";position:absolute;top:29px;inset-inline:5% 5%;height:1px;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--accent) 55%,var(--line)),transparent)}
.journey-step{position:relative;z-index:1;padding:0 14px;text-align:start}
.journey-num{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;margin-bottom:24px;background:var(--surface);border:1px solid color-mix(in srgb,var(--accent) 40%,var(--line));box-shadow:0 12px 34px color-mix(in srgb,var(--accent) 8%,transparent);font:800 10px/1 var(--font-en);color:var(--accent)}
.journey-step h3{margin:0 0 10px;font-size:16px;line-height:1.5}
.journey-step p{margin:0;color:var(--muted);font-size:12px;line-height:1.9}

.style-quiz{overflow:hidden;background:var(--bg)}
.style-quiz-grid{display:grid;grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);gap:clamp(28px,6vw,86px);align-items:start}
.style-quiz-copy h2{max-width:720px}
.style-quiz-copy>p:not(.kicker){max-width:640px;color:var(--muted);line-height:2}
.quiz-panel{display:grid;gap:12px;padding:clamp(18px,2vw,26px);border:1px solid var(--line);border-radius:30px;background:color-mix(in srgb,var(--surface) 97%,transparent);box-shadow:0 26px 80px rgba(0,0,0,.08)}
.quiz-group{margin:0;padding:18px;border:1px solid var(--line);border-radius:20px;min-width:0}
.quiz-group legend{padding-inline:8px;font-size:12px;font-weight:800;color:var(--text)}
.quiz-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.quiz-options button{appearance:none;min-height:48px;padding:10px 12px;border:1px solid var(--line);border-radius:14px;background:var(--bg);color:var(--muted);font:700 11px/1.5 inherit;cursor:pointer;transition:transform .2s ease,border-color .2s ease,background .2s ease,color .2s ease}
.quiz-options button:hover,.quiz-options button:focus-visible{transform:translateY(-2px);border-color:color-mix(in srgb,var(--accent) 48%,var(--line));color:var(--text)}
.quiz-options button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.quiz-options button.is-selected{background:color-mix(in srgb,var(--accent) 14%,var(--surface));border-color:var(--accent);color:var(--text);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 20%,transparent)}
.quiz-result{margin-top:28px;padding:22px;border-radius:24px;background:color-mix(in srgb,var(--accent) 8%,var(--surface));border:1px solid color-mix(in srgb,var(--accent) 20%,var(--line));display:grid;gap:10px}
.quiz-result>span{font-size:9px;font-weight:800;letter-spacing:.08em;color:var(--muted)}
.quiz-result>strong{font-size:clamp(22px,2.4vw,34px);line-height:1.25}
.quiz-result>p{margin:0;color:var(--muted);font-size:12px;line-height:1.8}
.quiz-consult{width:fit-content;margin-top:6px}

.locations{border-block:1px solid var(--line);background:radial-gradient(circle at 10% 10%,color-mix(in srgb,var(--accent) 10%,transparent),transparent 32rem),var(--bg-soft)}
.locations-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(28px,6vw,82px);align-items:center}
.locations-intro>p:last-child{color:var(--muted);line-height:2;max-width:620px}
.location-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.location-cards article{position:relative;overflow:hidden;min-height:210px;padding:22px;border:1px solid var(--line);border-radius:26px;background:var(--surface);display:flex;flex-direction:column;justify-content:flex-end;gap:8px;box-shadow:0 18px 55px rgba(0,0,0,.06)}
.location-cards article::before{content:"";position:absolute;width:120px;height:120px;border:1px solid color-mix(in srgb,var(--accent) 22%,transparent);border-radius:50%;top:-58px;inset-inline-end:-48px}
.location-cards article.is-primary{transform:translateY(-14px);border-color:color-mix(in srgb,var(--accent) 48%,var(--line));background:color-mix(in srgb,var(--surface) 94%,var(--accent) 6%)}
.location-cards article>span{position:absolute;top:18px;inset-inline-start:20px;font:700 10px/1 var(--font-en);color:var(--accent)}
.location-cards small{color:var(--muted);font-size:10px;font-weight:700}
.location-cards strong{font-size:15px;line-height:1.7}

.before-after{background:var(--bg)}
.before-after-heading{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(260px,.75fr);gap:clamp(24px,5vw,70px);align-items:end;margin-bottom:36px}
.before-after-heading>p{margin:0;color:var(--muted);line-height:1.9}
.comparison{position:relative;overflow:hidden;aspect-ratio:16/8.5;min-height:360px;border-radius:32px;border:1px solid var(--line);background:var(--surface);box-shadow:0 28px 80px rgba(0,0,0,.12);isolation:isolate}
.comparison-layer{position:absolute;inset:0}
.comparison-layer img{width:100%;height:100%;object-fit:cover;display:block;user-select:none;-webkit-user-drag:none}
.comparison-layer>span{position:absolute;bottom:20px;padding:9px 13px;border-radius:999px;background:color-mix(in srgb,var(--surface) 82%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid color-mix(in srgb,var(--line) 82%,transparent);font-size:10px;font-weight:800;color:var(--text)}
.comparison-after>span{inset-inline-end:20px}
.comparison-before{z-index:2;clip-path:inset(0 50% 0 0)}
.comparison-before>span{inset-inline-start:20px}
.comparison-divider{position:absolute;z-index:4;top:0;bottom:0;left:50%;width:1px;background:rgba(255,255,255,.92);pointer-events:none;transform:translateX(-.5px);box-shadow:0 0 24px rgba(0,0,0,.24)}
.comparison-divider i{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--surface);border:1px solid var(--line);font-style:normal;font-family:var(--font-en);font-weight:800;color:var(--text);box-shadow:0 12px 30px rgba(0,0,0,.18)}
.comparison-range{position:absolute;z-index:5;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0;direction:ltr}

@media(max-width:980px){
  .journey-track{grid-template-columns:1fr;gap:12px}.journey-track::before{top:0;bottom:0;inset-inline-start:28px;inset-inline-end:auto;width:1px;height:auto}.journey-step{display:grid;grid-template-columns:58px 1fr;gap:18px;padding:0}.journey-num{margin:0}.journey-step>div{padding:8px 0 18px}
  .style-quiz-grid,.locations-grid{grid-template-columns:1fr}.location-cards article.is-primary{transform:none}
  .studio-facts-expanded{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
  .journey-heading,.before-after-heading{grid-template-columns:1fr;gap:14px}
  .experience-strip{grid-template-columns:1fr 1fr}.experience-strip article:last-child{grid-column:1/-1}
  .location-cards{grid-template-columns:1fr}.location-cards article{min-height:150px}
  .quiz-options{grid-template-columns:1fr}.quiz-options button{text-align:start}
  .comparison{aspect-ratio:4/3;min-height:320px;border-radius:24px}
  .comparison-layer>span{bottom:14px}.comparison-after>span{inset-inline-end:14px}.comparison-before>span{inset-inline-start:14px}
}
@media(max-width:520px){
  .studio-facts-expanded,.experience-strip{grid-template-columns:1fr}.experience-strip article:last-child{grid-column:auto}
  .experience-strip article{min-height:98px}
  .quiz-panel{border-radius:22px;padding:14px}.quiz-group{padding:15px}
  .comparison{min-height:280px}.comparison-divider i{width:42px;height:42px}
  .free-consultation-note{font-size:11px}
}
@media(prefers-reduced-motion:reduce){.quiz-options button,.location-cards article{transition:none!important}}


/* ===== V53: integrated consultation + design-style quiz ===== */
.contact-grid{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)!important;gap:clamp(26px,4vw,56px)!important;align-items:start!important}
.contact-side{display:grid;gap:22px;align-content:start;min-width:0}
.contact-intro{padding-block:8px}
.contact-intro h2{max-width:680px;font-size:clamp(40px,4.5vw,66px)!important;line-height:1.14!important;margin-bottom:18px}
.contact-description{max-width:720px}
.contact-quiz{padding:clamp(20px,2.5vw,30px);border:1px solid color-mix(in srgb,var(--accent) 16%,var(--line));border-radius:30px;background:color-mix(in srgb,var(--surface) 96%,transparent);box-shadow:0 28px 74px rgba(0,0,0,.08)}
.contact-quiz-head{display:grid;gap:10px;margin-bottom:18px}
.contact-quiz-head .kicker{margin-bottom:0}
.contact-quiz-head h3{margin:0;font-size:clamp(28px,2.6vw,40px);line-height:1.18;letter-spacing:-.03em;color:var(--text)}
.contact-quiz-head p:last-child{margin:0;color:var(--muted);line-height:1.9;max-width:720px}
.contact-quiz-layout{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(280px,.85fr);gap:16px;align-items:stretch}
.contact-quiz .quiz-panel{display:grid;gap:12px;padding:0;border:none;background:transparent;box-shadow:none}
.contact-quiz .quiz-group{padding:18px;border-radius:22px;background:color-mix(in srgb,var(--surface) 92%,transparent)}
.contact-quiz .quiz-group legend{font-size:12px;font-weight:800}
.contact-quiz .quiz-options{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.contact-quiz .quiz-options button{min-height:54px;padding:12px 14px;border-radius:16px;background:color-mix(in srgb,var(--bg) 88%,var(--surface));font-size:12px;font-weight:700;color:var(--text)}
.contact-quiz .quiz-options button.is-selected{background:color-mix(in srgb,var(--accent) 14%,var(--surface));border-color:var(--accent);box-shadow:0 10px 26px color-mix(in srgb,var(--accent) 10%,transparent)}
.contact-quiz-result{margin-top:0!important;min-height:100%;padding:24px;border-radius:24px;display:grid;align-content:start;gap:12px;background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 10%,var(--surface)),color-mix(in srgb,var(--accent) 5%,var(--surface)))}
.contact-quiz-result>span{font-size:10px;letter-spacing:.08em;text-transform:uppercase}
.contact-quiz-result>strong{font-size:clamp(24px,2vw,34px);line-height:1.24}
.contact-quiz-result>p{font-size:13px;line-height:1.85}
.contact-quiz .quiz-consult{width:100%;justify-content:center;margin-top:10px}
.contact-form{align-self:start}
.form-heading strong{font-size:clamp(22px,2vw,30px)}
@media(max-width:1180px){.contact-quiz-layout{grid-template-columns:1fr}.contact-quiz-result{min-height:auto}}
@media(max-width:1050px){.contact-grid{grid-template-columns:1fr!important}.contact-side,.contact-form{max-width:860px;width:100%}}
@media(max-width:590px){.contact-side{gap:16px}.contact-quiz{padding:16px;border-radius:22px}.contact-quiz-head h3{font-size:clamp(24px,8vw,34px)}.contact-quiz .quiz-panel{gap:10px}.contact-quiz .quiz-group{padding:14px;border-radius:18px}.contact-quiz .quiz-options{grid-template-columns:1fr}.contact-quiz .quiz-options button{text-align:start;min-height:48px}.contact-quiz-result{padding:18px}}


/* ===== V54 refinements ===== */
.free-consultation-note{display:inline-flex!important;align-items:center;justify-content:flex-start;width:fit-content!important;max-width:min(100%,620px);padding:11px 16px!important;border-radius:999px!important;white-space:normal;text-wrap:balance;line-height:1.65;font-size:12px!important;font-weight:800!important}
.hero-content .free-consultation-note{margin-top:14px;align-self:flex-start}

.comparison-after img{filter:saturate(1.02) contrast(1.01) brightness(1.02)}
.comparison-before{position:absolute;isolation:isolate}
.comparison-before img{filter:saturate(.62) contrast(.9) brightness(.86) grayscale(.18)}
.comparison-before::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(232,228,223,.16),rgba(125,115,104,.18));pointer-events:none}
.comparison-before::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 18% 22%,rgba(255,255,255,.18),transparent 24%),linear-gradient(180deg,rgba(255,255,255,.04),rgba(0,0,0,.05));pointer-events:none;z-index:1}
.comparison-before > span,.comparison-after > span{z-index:2}

.journey-track{position:relative;isolation:isolate}
.journey-track::before{height:2px;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--accent) 36%,var(--line)) 10%,color-mix(in srgb,var(--accent) 58%,var(--line)) 50%,color-mix(in srgb,var(--accent) 36%,var(--line)) 90%,transparent);box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 8%,transparent)}
.journey-track::after{content:"";position:absolute;top:20px;inset-inline-start:5%;width:18px;height:18px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff 0 24%,color-mix(in srgb,var(--accent) 82%,#fff) 25%,var(--accent) 60%,rgba(255,255,255,.08) 100%);box-shadow:0 0 0 8px color-mix(in srgb,var(--accent) 12%,transparent),0 0 18px color-mix(in srgb,var(--accent) 45%,transparent),0 0 34px color-mix(in srgb,var(--accent) 28%,transparent);transform:translate(-50%,0);animation:journeyGlowFlow 6.6s linear infinite;pointer-events:none;z-index:0}
.journey-step{padding:0 16px}
.journey-step::before{content:"";position:absolute;top:14px;inset-inline-start:26px;width:64px;height:64px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--accent) 12%,transparent),transparent 68%);filter:blur(10px);opacity:.65;pointer-events:none;z-index:-1}
.journey-num{position:relative;overflow:hidden}
.journey-num::after{content:"";position:absolute;inset:6px;border-radius:50%;border:1px solid color-mix(in srgb,var(--accent) 16%,transparent);opacity:.8}
@keyframes journeyGlowFlow{0%{inset-inline-start:5%;opacity:0}8%{opacity:1}50%{opacity:1}92%{opacity:1}100%{inset-inline-start:95%;opacity:.2}}
@media(max-width:880px){.journey-track::after{top:0;left:auto;right:auto;inset-inline-start:20px;transform:translate(-50%,0);animation:journeyGlowFlowVertical 6.6s linear infinite}.journey-step::before{top:0;inset-inline-start:-4px;width:56px;height:56px}.journey-track::before{width:2px;height:auto;top:0;bottom:0;inset-inline-start:28px;inset-inline-end:auto;background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--accent) 36%,var(--line)) 12%,color-mix(in srgb,var(--accent) 58%,var(--line)) 50%,color-mix(in srgb,var(--accent) 36%,var(--line)) 88%,transparent)}@keyframes journeyGlowFlowVertical{0%{top:0;opacity:0}8%{opacity:1}50%{opacity:1}92%{opacity:1}100%{top:calc(100% - 18px);opacity:.2}}}
@media(max-width:590px){.free-consultation-note{font-size:11px!important;padding:10px 13px!important}.hero-content .free-consultation-note{margin-top:12px}.comparison-before::after{background:linear-gradient(180deg,rgba(232,228,223,.12),rgba(125,115,104,.15))}}
@media(prefers-reduced-motion:reduce){.journey-track::after{animation:none!important;opacity:.8}}


/* ===== V55 hero consultation CTA cleanup ===== */
.free-consultation-note{display:none!important}
.hero-actions .hero-consult-btn{max-width:min(100%,680px);padding-inline:26px 10px!important}
.hero-actions .hero-consult-label{display:block;min-width:0;white-space:normal;line-height:1.45;font-size:clamp(18px,1.55vw,22px)}
@media(max-width:820px){.hero-actions .hero-consult-btn{min-height:72px!important}.hero-actions .hero-consult-label{font-size:clamp(16px,4.6vw,19px);line-height:1.4}}


/* ===== V56 visual refinements ===== */
/* FAQ redesign */
.faq{position:relative;overflow:hidden;background:linear-gradient(180deg,var(--bg-soft),color-mix(in srgb,var(--surface) 86%,var(--bg-soft)))}
.faq::before{content:"";position:absolute;width:420px;height:420px;inset-inline-end:-180px;top:-180px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--accent) 10%,transparent),transparent 68%);pointer-events:none}
.faq-grid{grid-template-columns:minmax(280px,.74fr) minmax(0,1.26fr)!important;gap:clamp(28px,5vw,74px)!important;align-items:start!important}
.faq-copy{position:sticky;top:118px;padding:30px;border:1px solid color-mix(in srgb,var(--accent) 18%,var(--line));border-radius:30px;background:color-mix(in srgb,var(--surface) 95%,transparent);box-shadow:0 26px 72px rgba(0,0,0,.08)}
.faq-copy h2{margin-bottom:14px;font-size:clamp(40px,5vw,70px);line-height:1.02;letter-spacing:-.05em}
.faq-intro{margin:0;color:var(--muted);line-height:1.95;max-width:420px}
.faq-list{border-top:none!important;display:grid;gap:14px}
.faq-item{border:1px solid var(--line)!important;border-radius:24px;overflow:hidden;background:color-mix(in srgb,var(--surface) 94%,transparent);box-shadow:0 14px 44px rgba(0,0,0,.04);transition:transform .28s var(--ease),border-color .28s ease,box-shadow .28s ease,background .28s ease}
.faq-item:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--accent) 24%,var(--line));box-shadow:0 20px 52px rgba(0,0,0,.065)}
.faq-item summary{padding:24px 24px 24px 26px!important;font-size:19px!important;font-weight:700;line-height:1.6}
.faq-item summary span{max-width:calc(100% - 70px)}
.faq-item summary b{width:42px;height:42px;display:grid;place-items:center;border-radius:50%;background:color-mix(in srgb,var(--accent) 10%,var(--surface));border:1px solid color-mix(in srgb,var(--accent) 18%,var(--line));font-size:28px!important;font-weight:300!important;flex:0 0 auto}
.faq-item[open]{border-color:color-mix(in srgb,var(--accent) 40%,var(--line));box-shadow:0 26px 58px color-mix(in srgb,var(--accent) 10%,transparent);background:color-mix(in srgb,var(--accent) 3%,var(--surface))}
.faq-item[open] summary b{transform:rotate(45deg);background:color-mix(in srgb,var(--accent) 16%,var(--surface))}
.faq-item p{margin:0;padding:0 26px 24px 26px;max-width:none;font-size:14px;line-height:2;color:var(--muted)}

/* Riyadh primary card with Saudi-green glow */
.location-cards article.is-primary{transform:translateY(-14px);border-color:rgba(0,106,63,.34)!important;background:linear-gradient(180deg,color-mix(in srgb,var(--surface) 92%,rgba(0,106,63,.09)),color-mix(in srgb,var(--surface) 98%,rgba(0,106,63,.02)));box-shadow:0 20px 56px rgba(0,106,63,.16)}
.location-cards article.is-riyadh::after{content:"";position:absolute;inset:auto -10% -24% -10%;height:78%;background:radial-gradient(circle at 50% 50%,rgba(0,106,63,.23),rgba(0,106,63,.09) 36%,transparent 72%);filter:blur(22px);pointer-events:none;animation:saudiGlow 3.4s ease-in-out infinite}
.location-cards article.is-riyadh strong{color:#0a4a2c}
.location-cards article.is-riyadh>span{color:#0a6a3f}
@keyframes saudiGlow{0%,100%{opacity:.55;transform:translateY(6px) scale(.96)}50%{opacity:1;transform:translateY(0) scale(1.04)}}

/* Before / After stronger same-room difference */
.comparison{background:#e9e3db}
.comparison-after img{filter:saturate(1.04) contrast(1.02) brightness(1.03)}
.comparison-before{position:absolute;isolation:isolate;clip-path:inset(0 50% 0 0)}
.comparison-before img{filter:grayscale(.82) saturate(.38) contrast(.82) brightness(.78) sepia(.12) blur(.6px)}
.comparison-before::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(circle at 46% 80%, rgba(231,223,214,.86) 0 72px, transparent 102px),radial-gradient(circle at 60% 75%, rgba(231,223,214,.8) 0 54px, transparent 86px),radial-gradient(circle at 83% 68%, rgba(231,223,214,.78) 0 64px, transparent 96px),radial-gradient(circle at 23% 86%, rgba(231,223,214,.82) 0 78px, transparent 110px),linear-gradient(180deg, rgba(244,241,237,.08), rgba(122,112,100,.18));}
.comparison-before::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,rgba(255,255,255,.08),rgba(197,188,177,.22));mix-blend-mode:normal}
.comparison-before > span,.comparison-after > span{z-index:2}
.comparison-layer>span{font-size:11px!important;padding:10px 14px!important}
.comparison-before>span{background:rgba(241,236,230,.9)!important}
.comparison-after>span{background:rgba(255,255,255,.88)!important}

/* Journey: visible animated green glow */
.journey{position:relative;overflow:hidden;border-block:1px solid var(--line);background:linear-gradient(180deg,color-mix(in srgb,var(--bg-soft) 97%,rgba(0,106,63,.05)),var(--bg))}
.journey::after{content:"";position:absolute;inset-inline:8% 8%;bottom:18%;height:160px;background:radial-gradient(circle at 50% 50%,rgba(0,106,63,.08),transparent 68%);filter:blur(14px);pointer-events:none;opacity:.85}
.journey-track{--journey-index:0;position:relative;isolation:isolate;padding-top:6px}
.journey-track::before{height:4px!important;top:34px!important;border-radius:999px;background:linear-gradient(90deg,rgba(0,106,63,.08),rgba(0,106,63,.36) 12%,rgba(0,106,63,.92) 50%,rgba(0,106,63,.36) 88%,rgba(0,106,63,.08))!important;box-shadow:0 0 0 1px rgba(0,106,63,.1),0 0 24px rgba(0,106,63,.18)!important}
.journey-track::after{top:22px!important;width:24px!important;height:24px!important;background:radial-gradient(circle at 35% 35%,#fff 0 22%,#76f0a8 26%,#0a6a3f 64%,rgba(255,255,255,.08) 100%)!important;box-shadow:0 0 0 10px rgba(0,106,63,.1),0 0 28px rgba(0,106,63,.45),0 0 54px rgba(0,106,63,.28)!important;animation:journeyGlowFlow 5.8s cubic-bezier(.4,0,.2,1) infinite!important;z-index:1!important}
.journey-step{padding:0 18px!important;transition:transform .35s ease,opacity .35s ease}
.journey-step::before{content:"";position:absolute;top:8px;inset-inline-start:16px;width:84px;height:84px;border-radius:50%;background:radial-gradient(circle,rgba(0,106,63,.18),transparent 70%);filter:blur(12px);opacity:.35;pointer-events:none;transition:opacity .35s ease,transform .35s ease}
.journey-num{position:relative;overflow:hidden;border-color:rgba(0,106,63,.3)!important;box-shadow:0 18px 34px rgba(0,106,63,.11)!important;color:#0a6a3f!important}
.journey-num::after{content:"";position:absolute;inset:6px;border-radius:50%;border:1px solid rgba(0,106,63,.16)}
.journey-step.is-active{transform:translateY(-8px)}
.journey-step.is-active::before{opacity:.8;transform:scale(1.12)}
.journey-step.is-active .journey-num{background:linear-gradient(180deg,#ffffff,#eef9f2);border-color:rgba(0,106,63,.62)!important;box-shadow:0 0 0 10px rgba(0,106,63,.1),0 0 30px rgba(0,106,63,.2)!important}
.journey-step.is-active h3{color:#0a4a2c}
.journey-step.is-complete .journey-num{background:linear-gradient(180deg,#f9fffb,#eef9f2);border-color:rgba(0,106,63,.42)!important}
@keyframes journeyGlowFlow{0%{inset-inline-start:5%;opacity:0}8%{opacity:1}50%{opacity:1}92%{opacity:1}100%{inset-inline-start:95%;opacity:.2}}

@media(max-width:1100px){.faq-copy{position:relative;top:auto}.faq-grid{grid-template-columns:1fr!important}.faq-intro{max-width:none}}
@media(max-width:880px){.journey-track::after{top:4px!important;inset-inline-start:28px!important;animation:journeyGlowFlowVertical 5.8s cubic-bezier(.4,0,.2,1) infinite!important}.journey-track::before{width:4px!important;height:auto!important;top:0!important;bottom:0!important;inset-inline-start:29px!important;inset-inline-end:auto!important;background:linear-gradient(180deg,rgba(0,106,63,.08),rgba(0,106,63,.36) 12%,rgba(0,106,63,.92) 50%,rgba(0,106,63,.36) 88%,rgba(0,106,63,.08))!important}.journey-step{display:grid;grid-template-columns:58px 1fr;gap:18px;padding:0!important}.journey-step::before{top:-6px;inset-inline-start:-6px;width:70px;height:70px}.journey-step.is-active{transform:none}@keyframes journeyGlowFlowVertical{0%{top:0;opacity:0}8%{opacity:1}50%{opacity:1}92%{opacity:1}100%{top:calc(100% - 24px);opacity:.2}}}
@media(max-width:680px){.faq-copy{padding:22px;border-radius:22px}.faq-item{border-radius:20px}.faq-item summary{padding:18px 18px 18px 20px!important;font-size:16px!important}.faq-item summary b{width:38px;height:38px;font-size:24px!important}.faq-item p{padding:0 20px 20px}.location-cards article.is-primary{transform:none}.comparison-before::before{background:radial-gradient(circle at 52% 82%, rgba(231,223,214,.86) 0 58px, transparent 86px),radial-gradient(circle at 84% 68%, rgba(231,223,214,.78) 0 54px, transparent 82px),radial-gradient(circle at 24% 86%, rgba(231,223,214,.8) 0 62px, transparent 92px),linear-gradient(180deg, rgba(244,241,237,.08), rgba(122,112,100,.18));}}
@media(prefers-reduced-motion:reduce){.location-cards article.is-riyadh::after,.journey-track::after,.journey-step,.journey-step::before{animation:none!important;transition:none!important}}


/* ===== V57 refinements ===== */

/* Contact section: unified professional box */
.contact{position:relative;overflow:hidden;background:linear-gradient(180deg,color-mix(in srgb,var(--bg-soft) 96%,rgba(212,171,92,.04)),var(--bg))}
.contact::before{content:"";position:absolute;inset-inline-start:-8%;top:-90px;width:340px;height:340px;border-radius:50%;background:radial-gradient(circle,rgba(0,106,63,.10),transparent 68%);filter:blur(6px);pointer-events:none}
.contact-grid{display:grid!important;grid-template-columns:1fr!important;gap:30px!important;padding:clamp(24px,3vw,42px);border:1px solid color-mix(in srgb,var(--accent) 18%,var(--line));border-radius:38px;background:linear-gradient(180deg,color-mix(in srgb,var(--surface) 96%,transparent),color-mix(in srgb,var(--surface) 90%,var(--bg-soft)));box-shadow:0 28px 80px rgba(0,0,0,.08)!important;position:relative;overflow:hidden}
.contact-grid::after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(212,171,92,.04),transparent 28%,rgba(0,106,63,.03) 76%,transparent);pointer-events:none}
.contact-side{display:grid;gap:26px;position:relative;z-index:1}
.contact-intro{padding:0!important;background:none!important;border:none!important;box-shadow:none!important;max-width:none!important}
.contact-intro h2{font-size:clamp(36px,4.4vw,62px)!important;max-width:12ch;margin-bottom:14px}
.contact-description{max-width:900px!important;line-height:1.95}
.consultation-free-banner{display:inline-flex;align-items:center;gap:10px;padding:12px 18px;border-radius:999px;background:color-mix(in srgb,var(--accent) 10%,var(--surface));border:1px solid color-mix(in srgb,var(--accent) 20%,var(--line));font-weight:700}
.contact-flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:6px}
.contact-flow-step{display:flex;gap:16px;align-items:flex-start;padding:18px 18px 20px;border-radius:24px;border:1px solid color-mix(in srgb,var(--accent) 16%,var(--line));background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(249,247,243,.95));box-shadow:0 18px 44px rgba(0,0,0,.045);transition:transform .28s var(--ease),box-shadow .28s ease,border-color .28s ease;position:relative;overflow:hidden}
.contact-flow-step::before{content:"";position:absolute;inset:auto -18% -22% auto;width:140px;height:140px;border-radius:50%;background:radial-gradient(circle,rgba(212,171,92,.12),transparent 70%);pointer-events:none}
.contact-flow-step:hover{transform:translateY(-4px);box-shadow:0 24px 54px rgba(0,0,0,.08);border-color:color-mix(in srgb,var(--accent) 30%,var(--line))}
.contact-flow-step > span{display:grid;place-items:center;width:52px;height:52px;border-radius:18px;background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 20%,#fff),color-mix(in srgb,var(--accent) 6%,#fff));border:1px solid color-mix(in srgb,var(--accent) 28%,var(--line));font-size:13px;font-weight:800;color:var(--text);flex:0 0 auto;box-shadow:inset 0 1px 0 rgba(255,255,255,.7)}
.contact-flow-step strong{display:block;margin-bottom:7px;font-size:18px;line-height:1.45}
.contact-flow-step p{margin:0;color:var(--muted);font-size:14px;line-height:1.9}
.contact-quiz,.contact-form{position:relative;z-index:1;border-radius:30px!important;border:1px solid color-mix(in srgb,var(--accent) 14%,var(--line))!important;background:color-mix(in srgb,var(--surface) 96%,transparent)!important;box-shadow:0 20px 60px rgba(0,0,0,.05)!important}
.contact-quiz{padding:28px!important}
.contact-quiz-head{max-width:900px;margin-bottom:18px}
.contact-quiz-head h3{font-size:clamp(30px,3.6vw,46px)!important;line-height:1.1;margin:10px 0 12px}
.contact-quiz-head p{max-width:820px;line-height:1.9}
.contact-quiz-layout{grid-template-columns:minmax(0,1.28fr) minmax(280px,.72fr)!important;gap:22px!important;align-items:stretch!important}
.quiz-panel{display:grid;gap:16px}
.quiz-group{padding:18px 18px 20px;border-radius:24px;border:1px solid color-mix(in srgb,var(--accent) 12%,var(--line));background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(248,245,239,.9));box-shadow:inset 0 1px 0 rgba(255,255,255,.6)}
.quiz-group legend{padding-inline:10px;font-size:16px;font-weight:700;color:var(--text)}
.quiz-options{gap:12px!important;margin-top:10px}
.quiz-options button{min-height:56px;border-radius:18px!important;font-size:17px!important;font-weight:600!important;padding:14px 18px!important;transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease,background .24s ease!important}
.quiz-options button:hover{transform:translateY(-2px)}
.contact-quiz-result{justify-content:center;min-height:100%;padding:24px 22px!important;background:linear-gradient(180deg,rgba(248,244,237,.98),rgba(242,238,230,.96))!important;border-color:color-mix(in srgb,var(--accent) 22%,var(--line))!important}
.contact-quiz-result::before{content:"";position:absolute;inset:auto -10% -14% auto;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,rgba(212,171,92,.18),transparent 72%);pointer-events:none}
.contact-quiz-result strong{font-size:clamp(28px,3vw,42px)!important;line-height:1.15}
.quiz-consult{margin-top:18px}
.contact-form{padding:28px!important}
.contact-form .form-heading{display:flex;flex-direction:column;gap:10px;padding-bottom:18px;margin-bottom:20px;border-bottom:1px dashed color-mix(in srgb,var(--accent) 18%,var(--line))}
.contact-form .form-heading strong{font-size:28px}
.contact-form .form-heading span{max-width:760px;line-height:1.9;color:var(--muted)}

/* FAQ section comfort improvements */
.faq{background:linear-gradient(180deg,color-mix(in srgb,var(--bg-soft) 94%,transparent),var(--bg))!important}
.faq-grid{grid-template-columns:1fr!important;gap:22px!important}
.faq-copy{position:relative!important;top:auto!important;max-width:none!important;padding:28px 30px 26px!important;border-radius:30px!important;background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(249,246,241,.96))!important;box-shadow:0 24px 68px rgba(0,0,0,.06)!important}
.faq-copy::after{content:"";position:absolute;inset:auto -6% -16% auto;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(212,171,92,.12),transparent 72%)}
.faq-copy h2{font-size:clamp(38px,4.8vw,68px)!important;max-width:9ch;margin-bottom:10px}
.faq-intro{max-width:700px!important;font-size:16px}
.faq-list{max-width:1120px;margin-inline:auto;width:100%;gap:16px!important}
.faq-item{border-radius:22px!important;background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(249,246,241,.96))!important;border:1px solid color-mix(in srgb,var(--accent) 14%,var(--line))!important;box-shadow:0 18px 46px rgba(0,0,0,.045)!important}
.faq-item summary{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:22px 24px!important}
.faq-item summary span{font-size:19px!important;line-height:1.7;color:var(--text)}
.faq-item summary b{background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(244,240,232,.96))!important;box-shadow:0 10px 22px rgba(212,171,92,.14);transition:transform .24s ease,box-shadow .24s ease!important}
.faq-item[open] summary b{box-shadow:0 16px 28px rgba(0,106,63,.16)!important}
.faq-item p{padding:0 24px 22px 24px!important;font-size:15px!important;line-height:2!important}

/* Riyadh highlight */
.location-cards article{overflow:hidden}
.location-cards article.is-riyadh{border-color:rgba(0,106,63,.34)!important;background:linear-gradient(180deg,color-mix(in srgb,var(--surface) 94%,rgba(0,106,63,.05)),color-mix(in srgb,var(--surface) 98%,rgba(0,106,63,.02)))!important;box-shadow:0 22px 58px rgba(0,106,63,.16)!important}
.location-cards article.is-riyadh::before{content:""!important;position:absolute;inset:auto auto -24px -22px;width:170px;height:170px;border-radius:50%;background:radial-gradient(circle,rgba(0,106,63,.18),rgba(0,106,63,.06) 44%,transparent 72%);animation:saudiAura 4.2s ease-in-out infinite}
.location-cards article.is-riyadh::after{content:""!important;position:absolute;inset:auto -10% -30% auto;width:240px;height:200px;background:radial-gradient(circle at 50% 50%,rgba(0,106,63,.24),transparent 68%);filter:blur(16px);animation:saudiGlow 3.4s ease-in-out infinite}
.location-cards article.is-riyadh strong{position:relative;isolation:isolate;color:#0a4a2c!important}
.location-cards article.is-riyadh .ksa-mark{position:absolute;inset:auto 18px 16px auto;font-style:normal;font-size:44px;font-weight:800;line-height:1;color:rgba(0,106,63,.08);letter-spacing:-.04em;pointer-events:none;animation:ksaDrift 5.6s ease-in-out infinite}
.location-cards article.is-riyadh small{position:relative;z-index:1}
@keyframes saudiAura{0%,100%{transform:scale(.94);opacity:.55}50%{transform:scale(1.06);opacity:1}}
@keyframes ksaDrift{0%,100%{transform:translateY(2px)}50%{transform:translateY(-4px)}}

/* Before/After stronger difference with Saudi-inspired after details */
.comparison{position:relative;background:linear-gradient(180deg,#efe8de,#e6ded2)!important;border-radius:34px!important;overflow:hidden}
.comparison::before{content:"";position:absolute;inset:16px;border-radius:26px;border:1px solid rgba(255,255,255,.46);pointer-events:none;z-index:3}
.comparison-after{isolation:isolate}
.comparison-after img{filter:saturate(1.06) contrast(1.02) brightness(1.04)!important}
.comparison-after::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:1;background:
 radial-gradient(circle at 82% 18%, rgba(0,106,63,.16), transparent 20%),
 linear-gradient(180deg, rgba(255,247,232,.02), rgba(255,247,232,.0) 30%, rgba(255,255,255,.08) 100%),
 repeating-linear-gradient(135deg, rgba(212,171,92,.05) 0 8px, transparent 8px 22px);
 mask: linear-gradient(to left, transparent 0 64%, black 76% 100%);
 opacity:.85}
.comparison-after::after{content:"";position:absolute;inset:20px 20px auto auto;width:180px;height:180px;border-radius:40px;pointer-events:none;z-index:1;background:
 radial-gradient(circle at 50% 50%, rgba(0,106,63,.12), transparent 62%),
 linear-gradient(135deg, rgba(212,171,92,.16), transparent 50%);
 border:1px solid rgba(212,171,92,.34); background:
     radial-gradient(circle at 50% 50%, rgba(0,106,63,.12), transparent 60%),
     repeating-radial-gradient(circle at 50% 50%, rgba(212,171,92,.16) 0 2px, transparent 2px 13px); opacity:.55}
.comparison-before{position:absolute;isolation:isolate;clip-path:inset(0 50% 0 0)!important}
.comparison-before img{filter:grayscale(.92) saturate(.26) contrast(.72) brightness(.74) sepia(.22) blur(.8px)!important}
.comparison-before::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:
 linear-gradient(180deg, rgba(243,238,231,.08), rgba(167,150,128,.22)),
 linear-gradient(rgba(227,218,205,.92),rgba(227,218,205,.92)) 52% 78%/30% 17% no-repeat,
 linear-gradient(rgba(233,225,213,.96),rgba(233,225,213,.96)) 73% 83%/10% 11% no-repeat,
 linear-gradient(rgba(239,233,225,.94),rgba(239,233,225,.94)) 86% 65%/12% 10% no-repeat,
 linear-gradient(rgba(232,223,212,.95),rgba(232,223,212,.95)) 55% 62%/20% 8% no-repeat,
 linear-gradient(rgba(239,233,224,.96),rgba(239,233,224,.96)) 77% 48%/16% 9% no-repeat,
 radial-gradient(circle at 84% 72%, rgba(222,213,202,.92) 0 56px, transparent 58px),
 radial-gradient(circle at 58% 82%, rgba(222,213,202,.94) 0 68px, transparent 70px),
 radial-gradient(circle at 28% 91%, rgba(226,216,205,.96) 0 76px, transparent 78px),
 linear-gradient(90deg, rgba(255,255,255,.12), rgba(196,184,170,.26));}
.comparison-before::after{position:absolute;inset:22px auto auto 22px;width:146px;height:42px;padding-top:16px;border-radius:999px;pointer-events:none;z-index:2;color:#6e6458;font-weight:700;font-size:12px;letter-spacing:.02em;text-align:center;background:rgba(247,242,236,.94);box-shadow:0 10px 20px rgba(0,0,0,.05);content:"حالة أولية"}
.comparison-layer > span{z-index:2!important;font-size:12px!important;padding:12px 16px!important;border-radius:999px!important;backdrop-filter:blur(10px)}
.comparison-after > span{background:rgba(255,255,255,.9)!important}
.comparison-before > span{background:rgba(247,242,236,.92)!important}
.comparison-divider{z-index:4!important;box-shadow:0 16px 40px rgba(0,0,0,.12)!important}
.comparison-divider i{font-size:18px!important}

/* Journey: clearer animated five-step cards */
.journey{background:linear-gradient(180deg,color-mix(in srgb,var(--bg-soft) 98%,rgba(0,106,63,.03)),var(--bg))!important;overflow:hidden}
.journey-heading{gap:18px!important;margin-bottom:36px!important}
.journey-track{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px;position:relative;padding-top:76px!important}
.journey-track::before{content:"";position:absolute;inset-inline:8% 8%;top:38px;height:4px;border-radius:999px;background:linear-gradient(90deg,rgba(0,106,63,.08),rgba(0,106,63,.32) 20%,rgba(0,106,63,.1) 100%);box-shadow:0 0 24px rgba(0,106,63,.14)}
.journey-track::after{content:"";position:absolute;top:27px;inset-inline-start:8%;width:26px;height:26px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff 0 24%,#8cf2b5 30%,#0a6a3f 65%,rgba(255,255,255,.08) 100%);box-shadow:0 0 0 10px rgba(0,106,63,.1),0 0 28px rgba(0,106,63,.34),0 0 60px rgba(0,106,63,.22);animation:journeyBeam 6.2s cubic-bezier(.4,0,.2,1) infinite;z-index:2}
.journey-step{position:relative;padding:0!important;min-height:100%;transform:none!important}
.journey-step::before{content:none!important}
.journey-num{position:absolute;top:-66px;inset-inline-start:50%;transform:translateX(-50%);width:58px!important;height:58px!important;border-radius:50%!important;background:linear-gradient(180deg,#fff,#eef9f2)!important;border:1px solid rgba(0,106,63,.28)!important;color:#0a6a3f!important;box-shadow:0 14px 34px rgba(0,106,63,.1)!important;z-index:1}
.journey-step > div{height:100%;padding:22px 20px 24px;border-radius:24px;border:1px solid color-mix(in srgb,var(--accent) 14%,var(--line));background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(248,246,241,.95));box-shadow:0 18px 48px rgba(0,0,0,.045);transition:transform .32s ease,border-color .32s ease,box-shadow .32s ease,background .32s ease;position:relative;overflow:hidden}
.journey-step > div::before{content:"";position:absolute;inset:auto -16% -30% auto;width:150px;height:150px;border-radius:50%;background:radial-gradient(circle,rgba(212,171,92,.14),transparent 70%);pointer-events:none}
.journey-step h3{font-size:22px!important;line-height:1.4;margin-bottom:10px}
.journey-step p{font-size:14px!important;line-height:1.95;color:var(--muted)}
.journey-step.is-active .journey-num{box-shadow:0 0 0 12px rgba(0,106,63,.08),0 0 30px rgba(0,106,63,.28)!important;border-color:rgba(0,106,63,.6)!important}
.journey-step.is-active > div{transform:translateY(-6px);border-color:rgba(0,106,63,.34);box-shadow:0 26px 60px rgba(0,106,63,.14);background:linear-gradient(180deg,rgba(250,255,252,.98),rgba(240,250,244,.94))}
.journey-step.is-complete > div{border-color:rgba(0,106,63,.18)}
@keyframes journeyBeam{0%{inset-inline-start:8%;opacity:0}8%{opacity:1}50%{opacity:1}92%{opacity:1}100%{inset-inline-start:92%;opacity:.2}}

@media (max-width: 1100px){
  .contact-flow{grid-template-columns:1fr}
  .contact-quiz-layout{grid-template-columns:1fr!important}
  .journey-track{grid-template-columns:1fr 1fr!important;gap:22px 18px;padding-top:42px!important}
  .journey-track::before{display:none}
  .journey-track::after{display:none}
  .journey-num{position:relative;top:auto;inset-inline-start:auto;transform:none;margin-bottom:14px}
}
@media (max-width: 880px){
  .contact-grid{padding:22px;border-radius:28px}
  .contact-intro h2{max-width:none}
  .contact-quiz,.contact-form{padding:20px!important;border-radius:24px!important}
  .faq-copy{padding:22px!important;border-radius:24px!important}
  .faq-item summary{padding:18px 20px!important}
  .faq-item summary span{font-size:17px!important}
  .faq-item p{padding:0 20px 18px 20px!important}
  .location-cards article.is-riyadh .ksa-mark{font-size:34px;inset:auto 14px 14px auto}
  .journey-track{grid-template-columns:1fr!important}
  .journey-step > div{padding:18px 18px 20px}
  .journey-step h3{font-size:20px!important}
}
@media (prefers-reduced-motion: reduce){
  .contact-flow-step,.quiz-options button,.faq-item,.journey-step > div{transition:none!important}
  .location-cards article.is-riyadh::before,.location-cards article.is-riyadh::after,.location-cards article.is-riyadh .ksa-mark,.journey-track::after{animation:none!important}
}


/* ===== V58 force refinements ===== */

html body .contact .contact-grid{display:grid!important;grid-template-columns:1fr!important;gap:26px!important;align-items:start!important;padding:clamp(24px,2.8vw,38px)!important;border-radius:40px!important;background:linear-gradient(180deg,rgba(255,255,255,.97),rgba(248,245,239,.98))!important;border:1px solid rgba(212,171,92,.26)!important;box-shadow:0 32px 92px rgba(0,0,0,.08)!important}
html body .contact .contact-side{display:grid!important;gap:24px!important}
html body .contact .contact-intro h2{font-size:clamp(38px,4.6vw,64px)!important;line-height:1.12!important;max-width:12ch!important}
html body .contact .consultation-free-banner{display:inline-flex!important;margin-block:10px 0;padding:12px 18px!important;border-radius:999px!important;background:rgba(212,171,92,.10)!important;border:1px solid rgba(212,171,92,.2)!important;font-weight:700!important}
html body .contact .consultation-points{display:flex!important;flex-wrap:wrap!important;gap:10px!important;margin-top:10px!important}
html body .contact .consultation-points span{padding:10px 14px!important;border-radius:999px!important;background:#fff!important;border:1px solid rgba(212,171,92,.16)!important;box-shadow:0 10px 26px rgba(0,0,0,.035)!important}
html body .contact .contact-flow{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:16px!important}
html body .contact .contact-flow-step{display:flex!important;gap:14px!important;padding:18px!important;border-radius:24px!important;background:linear-gradient(180deg,#fff,#faf7f1)!important;border:1px solid rgba(212,171,92,.18)!important;box-shadow:0 16px 40px rgba(0,0,0,.05)!important}
html body .contact .contact-flow-step > span{width:48px!important;height:48px!important;border-radius:16px!important;display:grid!important;place-items:center!important;background:linear-gradient(180deg,#f5e7c9,#fff)!important;border:1px solid rgba(212,171,92,.28)!important;font-weight:800!important}
html body .contact .contact-flow-step strong{font-size:18px!important}
html body .contact .contact-flow-step p{font-size:14px!important;line-height:1.9!important}
html body .contact #styleQuiz.contact-quiz{padding:30px!important;border-radius:32px!important;border:1px solid rgba(212,171,92,.18)!important;background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(249,247,243,.98))!important;box-shadow:0 22px 60px rgba(0,0,0,.05)!important}
html body .contact .contact-quiz-head h3{font-size:clamp(30px,3.5vw,48px)!important;line-height:1.15!important;margin:10px 0 12px!important}
html body .contact .contact-quiz-layout{display:grid!important;grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr)!important;gap:22px!important;align-items:stretch!important}
html body .contact .quiz-panel{display:grid!important;gap:16px!important}
html body .contact .quiz-group{padding:18px!important;border-radius:24px!important;border:1px solid rgba(212,171,92,.14)!important;background:linear-gradient(180deg,#fff,#f8f4ec)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.7)!important}
html body .contact .quiz-group legend{font-size:16px!important;font-weight:700!important;padding-inline:10px!important}
html body .contact .quiz-options{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:12px!important}
html body .contact .quiz-options button{min-height:58px!important;padding:14px 16px!important;border-radius:18px!important;font-size:17px!important;font-weight:600!important;background:#fff!important;border:1px solid rgba(212,171,92,.16)!important;transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease,background .22s ease!important}
html body .contact .quiz-options button:hover{transform:translateY(-2px)!important;box-shadow:0 14px 28px rgba(212,171,92,.12)!important}
html body .contact .contact-quiz-result{position:relative!important;display:flex!important;flex-direction:column!important;justify-content:center!important;min-height:100%!important;padding:24px!important;border-radius:26px!important;background:linear-gradient(180deg,#f8f3eb,#f0eadf)!important;border:1px solid rgba(212,171,92,.24)!important;box-shadow:0 18px 44px rgba(0,0,0,.04)!important}
html body .contact .contact-quiz-result strong{font-size:clamp(28px,3vw,40px)!important;line-height:1.14!important}
html body .contact .quiz-consult{margin-top:18px!important}
html body .contact .contact-form{padding:30px!important;border-radius:32px!important;border:1px solid rgba(212,171,92,.2)!important;background:linear-gradient(180deg,rgba(255,255,255,.99),rgba(249,247,243,.99))!important;box-shadow:0 20px 58px rgba(0,0,0,.05)!important}
html body .contact .form-step-chip{display:inline-flex!important;align-items:center!important;gap:12px!important;margin-bottom:16px!important;padding:10px 14px!important;border-radius:999px!important;background:rgba(0,106,63,.06)!important;border:1px solid rgba(0,106,63,.18)!important}
html body .contact .form-step-chip span{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#0a6a3f;color:#fff;font-size:12px;font-weight:800}
html body .contact .form-step-chip strong{font-size:14px!important}
html body .contact .form-heading{padding-bottom:18px!important;margin-bottom:20px!important;border-bottom:1px dashed rgba(212,171,92,.24)!important}
html body .contact .form-heading strong{font-size:28px!important}

html body .before-after .comparison{max-width:1260px!important;margin-inline:auto!important;border-radius:34px!important;overflow:hidden!important;border:1px solid rgba(212,171,92,.18)!important;box-shadow:0 28px 82px rgba(0,0,0,.08)!important;background:#ece5da!important}
html body .before-after .comparison-layer img{display:block!important;width:100%!important;height:auto!important;min-height:640px!important;object-fit:cover!important}
html body .before-after .comparison-before{clip-path:inset(0 50% 0 0)!important}
html body .before-after .comparison-before::after{content:"الحالة الأولية"!important;position:absolute!important;top:24px!important;inset-inline-start:24px!important;padding:11px 16px!important;border-radius:999px!important;background:rgba(248,243,236,.92)!important;color:#6c6051!important;font-size:12px!important;font-weight:700!important;letter-spacing:.02em!important;z-index:4!important;box-shadow:0 10px 24px rgba(0,0,0,.06)!important}
html body .before-after .comparison-after::after{content:"طابع عربي سعودي معاصر"!important;position:absolute!important;top:24px!important;inset-inline-end:24px!important;padding:11px 16px!important;border-radius:999px!important;background:rgba(255,255,255,.92)!important;color:#0a4a2c!important;font-size:12px!important;font-weight:700!important;letter-spacing:.02em!important;z-index:4!important;box-shadow:0 10px 24px rgba(0,0,0,.06)!important}

html body .faq .faq-grid{display:grid!important;grid-template-columns:1fr!important;gap:22px!important}
html body .faq .faq-copy{padding:28px 32px!important;border-radius:30px!important;background:linear-gradient(180deg,#fff,#f9f6f0)!important;border:1px solid rgba(212,171,92,.18)!important;box-shadow:0 24px 64px rgba(0,0,0,.06)!important;max-width:1160px!important;margin-inline:auto!important;width:100%!important}
html body .faq .faq-list{display:grid!important;gap:16px!important;max-width:1160px!important;width:100%!important;margin-inline:auto!important}
html body .faq details.faq-item{overflow:hidden!important;border-radius:22px!important;border:1px solid rgba(212,171,92,.18)!important;background:linear-gradient(180deg,#fff,#faf7f2)!important;box-shadow:0 16px 44px rgba(0,0,0,.045)!important}
html body .faq details.faq-item summary{padding:22px 24px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:18px!important;cursor:pointer!important}
html body .faq details.faq-item summary span{font-size:19px!important;line-height:1.7!important;font-weight:600!important}
html body .faq details.faq-item summary b{display:grid!important;place-items:center!important;width:42px!important;height:42px!important;border-radius:50%!important;background:linear-gradient(180deg,#fff,#f3ede2)!important;box-shadow:0 10px 24px rgba(212,171,92,.16)!important;transition:transform .26s ease!important}
html body .faq details.faq-item[open] summary b{transform:rotate(45deg)!important}
html body .faq details.faq-item .faq-answer, html body .faq details.faq-item p{padding:0 24px 24px!important;font-size:15px!important;line-height:2!important;color:var(--muted)!important}

html body .locations .location-cards{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:18px!important}
html body .locations .location-cards article{position:relative!important;min-height:230px!important;padding:26px 24px 22px!important;border-radius:28px!important;background:linear-gradient(180deg,#fff,#faf7f1)!important;border:1px solid rgba(212,171,92,.16)!important;box-shadow:0 18px 48px rgba(0,0,0,.05)!important;overflow:hidden!important}
html body .locations .location-cards article strong{display:block!important;margin-top:42px!important;font-size:34px!important;line-height:1.26!important;position:relative!important;z-index:2!important}
html body .locations .location-cards article small{display:block!important;font-size:12px!important;font-weight:700!important;color:var(--muted)!important;position:relative!important;z-index:2!important}
html body .locations .location-cards article span{position:absolute!important;top:18px!important;inset-inline-end:18px!important;font-size:13px!important;font-weight:800!important;color:var(--accent)!important;z-index:2!important}
html body .locations .location-cards article.is-riyadh{transform:translateY(-8px)!important;border-color:rgba(0,106,63,.36)!important;background:linear-gradient(180deg,rgba(251,255,253,.98),rgba(243,250,246,.98))!important;box-shadow:0 28px 68px rgba(0,106,63,.16)!important}
html body .locations .location-cards article.is-riyadh::before{content:""!important;position:absolute!important;inset:auto auto -30px -34px!important;width:210px!important;height:210px!important;border-radius:50%!important;background:radial-gradient(circle,rgba(0,106,63,.22),rgba(0,106,63,.08) 42%,transparent 72%)!important;filter:blur(2px)!important;animation:saudiPulseV58 3.6s ease-in-out infinite!important}
html body .locations .location-cards article.is-riyadh::after{content:"السعودية"!important;position:absolute!important;inset:auto 22px 22px auto!important;font-size:58px!important;font-weight:900!important;letter-spacing:-.05em!important;color:rgba(0,106,63,.09)!important;animation:saudiWordDriftV58 5.4s ease-in-out infinite!important;z-index:1!important}
html body .locations .location-cards article.is-riyadh strong{color:#0a4a2c!important}
@keyframes saudiPulseV58{0%,100%{transform:scale(.94);opacity:.55}50%{transform:scale(1.08);opacity:1}}
@keyframes saudiWordDriftV58{0%,100%{transform:translateY(3px)}50%{transform:translateY(-5px)}}

html body .journey .journey-heading{margin-bottom:34px!important}
html body .journey .journey-track{position:relative!important;display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:18px!important;padding-top:92px!important;list-style:none!important}
html body .journey .journey-track::before{content:""!important;position:absolute!important;top:45px!important;inset-inline:8% 8%!important;height:4px!important;border-radius:999px!important;background:linear-gradient(90deg,rgba(0,106,63,.08),rgba(0,106,63,.24) 18%,rgba(0,106,63,.12) 100%)!important;box-shadow:0 0 26px rgba(0,106,63,.15)!important}
html body .journey .journey-track::after{content:""!important;position:absolute!important;top:33px!important;inset-inline-start:8%!important;width:26px!important;height:26px!important;border-radius:50%!important;background:radial-gradient(circle at 35% 35%,#fff 0 24%,#86f0b3 30%,#0a6a3f 64%,rgba(255,255,255,.1) 100%)!important;box-shadow:0 0 0 12px rgba(0,106,63,.10),0 0 30px rgba(0,106,63,.30),0 0 62px rgba(0,106,63,.22)!important;animation:journeyBeamV58 6.2s cubic-bezier(.4,0,.2,1) infinite!important;z-index:2!important}
html body .journey .journey-step{position:relative!important;padding:0!important;display:block!important}
html body .journey .journey-step .journey-num{position:absolute!important;top:-64px!important;inset-inline-start:50%!important;transform:translateX(-50%)!important;width:58px!important;height:58px!important;display:grid!important;place-items:center!important;border-radius:50%!important;background:linear-gradient(180deg,#fff,#edf9f2)!important;border:1px solid rgba(0,106,63,.28)!important;color:#0a6a3f!important;font-weight:800!important;box-shadow:0 14px 34px rgba(0,106,63,.11)!important;z-index:1!important}
html body .journey .journey-step > div{min-height:220px!important;height:100%!important;padding:24px 20px 22px!important;border-radius:24px!important;background:linear-gradient(180deg,#fff,#faf7f1)!important;border:1px solid rgba(212,171,92,.18)!important;box-shadow:0 18px 46px rgba(0,0,0,.045)!important;transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease,background .3s ease!important}
html body .journey .journey-step h3{font-size:22px!important;line-height:1.45!important;margin-bottom:12px!important}
html body .journey .journey-step p{font-size:14px!important;line-height:1.95!important;color:var(--muted)!important}
html body .journey .journey-step.is-active .journey-num{box-shadow:0 0 0 12px rgba(0,106,63,.08),0 0 34px rgba(0,106,63,.28)!important;border-color:rgba(0,106,63,.56)!important}
html body .journey .journey-step.is-active > div{transform:translateY(-6px)!important;border-color:rgba(0,106,63,.34)!important;background:linear-gradient(180deg,#fbfffd,#f1f9f4)!important;box-shadow:0 26px 60px rgba(0,106,63,.14)!important}
@keyframes journeyBeamV58{0%{inset-inline-start:8%;opacity:0}8%{opacity:1}50%{opacity:1}92%{opacity:1}100%{inset-inline-start:92%;opacity:.2}}

@media (max-width:1100px){
  html body .contact .contact-flow{grid-template-columns:1fr!important}
  html body .contact .contact-quiz-layout{grid-template-columns:1fr!important}
  html body .locations .location-cards{grid-template-columns:1fr!important}
  html body .journey .journey-track{grid-template-columns:1fr 1fr!important;padding-top:34px!important}
  html body .journey .journey-track::before, html body .journey .journey-track::after{display:none!important}
  html body .journey .journey-step .journey-num{position:relative!important;top:auto!important;inset-inline-start:auto!important;transform:none!important;margin-bottom:14px!important}
}
@media (max-width:760px){
  html body .contact .contact-grid{padding:20px!important;border-radius:28px!important}
  html body .contact .contact-quiz, html body .contact .contact-form{padding:20px!important;border-radius:24px!important}
  html body .contact .quiz-options{grid-template-columns:1fr!important}
  html body .faq .faq-copy{padding:22px!important;border-radius:24px!important}
  html body .faq details.faq-item summary{padding:18px 20px!important}
  html body .faq details.faq-item summary span{font-size:17px!important}
  html body .faq details.faq-item .faq-answer, html body .faq details.faq-item p{padding:0 20px 18px!important}
  html body .journey .journey-track{grid-template-columns:1fr!important}
  html body .journey .journey-step > div{min-height:auto!important}
}


/* ===== V59: visible selections, compact about, adaptive journey, premium locations, secure upload ===== */

/* Make selected quiz choice unmistakable and theme-aware. */
html body .contact .quiz-options button{position:relative;color:var(--text)!important;background:color-mix(in srgb,var(--surface) 96%,var(--bg-soft))!important;border-color:color-mix(in srgb,var(--accent) 18%,var(--line))!important}
html body .contact .quiz-options button.is-selected,
html body .contact .quiz-options button[aria-pressed="true"]{
  color:var(--accent-ink)!important;
  background:linear-gradient(135deg,var(--accent),var(--accent-strong))!important;
  border-color:var(--accent)!important;
  box-shadow:0 12px 30px color-mix(in srgb,var(--accent) 25%,transparent),inset 0 1px 0 rgba(255,255,255,.28)!important;
  transform:translateY(-2px)!important;
}
html body .contact .quiz-options button.is-selected::after,
html body .contact .quiz-options button[aria-pressed="true"]::after{
  content:"✓";position:absolute;top:7px;inset-inline-start:9px;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;
  background:color-mix(in srgb,var(--surface) 86%,transparent);color:var(--text);font-size:12px;font-weight:900;
}
.quiz-saved-note{display:flex;align-items:center;gap:10px;margin-top:18px;padding:12px 14px;border-radius:16px;background:color-mix(in srgb,var(--accent) 9%,var(--surface));border:1px solid color-mix(in srgb,var(--accent) 20%,var(--line));color:var(--muted);font-size:13px;line-height:1.7}
.quiz-saved-note>span:first-child{width:28px;height:28px;display:grid;place-items:center;border-radius:50%;background:var(--accent);color:var(--accent-ink);font-weight:900;flex:0 0 auto}
.contact-quiz-result.is-ready{border-color:color-mix(in srgb,var(--accent) 42%,var(--line))!important;box-shadow:0 20px 50px color-mix(in srgb,var(--accent) 12%,transparent)!important}

/* Optional secure attachment UI. */
.upload-field{margin:4px 0 18px;padding:18px;border-radius:22px;border:1px dashed color-mix(in srgb,var(--accent) 34%,var(--line));background:color-mix(in srgb,var(--surface) 92%,var(--bg-soft));display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px 18px;align-items:center}
.upload-field-copy{display:grid;gap:5px}.upload-field-copy strong{font-size:14px}.upload-field-copy span{font-size:11px;color:var(--muted);line-height:1.7}
.upload-control{position:relative;display:flex;align-items:center;gap:10px;min-height:48px;padding:10px 14px;border-radius:16px;border:1px solid color-mix(in srgb,var(--accent) 24%,var(--line));background:var(--surface);cursor:pointer;transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease}
.upload-control:hover{transform:translateY(-2px);border-color:var(--accent);box-shadow:0 12px 30px color-mix(in srgb,var(--accent) 12%,transparent)}
.upload-control input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.upload-icon{width:30px;height:30px;display:grid;place-items:center;border-radius:50%;background:color-mix(in srgb,var(--accent) 12%,var(--surface));color:var(--accent);font-weight:800}.upload-label{font-size:12px;font-weight:700;max-width:240px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.upload-status{grid-column:1/-1;margin:0;min-height:18px;font-size:11px;color:color-mix(in srgb,var(--accent) 78%,var(--text))}.upload-status.is-error{color:#b42318}

/* About: remove wasted central space and use the width deliberately. */
html body .about .about-grid{display:grid!important;grid-template-columns:1fr!important;gap:22px!important;align-items:start!important;max-width:1280px!important}
html body .about .section-heading{max-width:760px!important}
html body .about .about-copy{padding-top:0!important;display:grid!important;grid-template-columns:minmax(0,1.05fr) minmax(340px,.95fr)!important;grid-template-areas:"intro facts" "body facts" "pills facts" "stats stats";gap:16px 30px!important;align-items:start!important}
html body .about .about-copy .large-copy{grid-area:intro;margin:0!important;max-width:none!important;font-size:clamp(24px,2.5vw,38px)!important;line-height:1.7!important}
html body .about .about-copy>p:not(.large-copy){grid-area:body;margin:0!important;max-width:none!important;font-size:15px!important;line-height:2!important}
html body .about .about-pills{grid-area:pills;margin-top:4px!important;align-self:start!important}
html body .about .studio-facts-expanded{grid-area:facts;margin-top:0!important;display:grid!important;grid-template-columns:1fr!important;gap:10px!important}
html body .about .studio-facts-expanded article{min-height:76px!important;padding:14px 16px!important;border-radius:16px!important;display:grid!important;grid-template-columns:auto minmax(0,1fr)!important;align-items:center!important;gap:14px!important;background:color-mix(in srgb,var(--surface) 96%,var(--bg-soft))!important;border:1px solid color-mix(in srgb,var(--accent) 15%,var(--line))!important;box-shadow:0 10px 28px color-mix(in srgb,var(--accent) 4%,transparent)!important}
html body .about .studio-facts-expanded span{font-size:10px!important;letter-spacing:.06em!important;color:var(--accent)!important;min-width:74px}
html body .about .studio-facts-expanded strong{font-size:13px!important;line-height:1.65!important;text-align:start!important}
html body .about .experience-strip{grid-area:stats;margin-top:6px!important;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:12px!important}
html body .about .experience-strip article{min-height:110px!important;padding:18px!important;background:color-mix(in srgb,var(--surface) 95%,var(--bg-soft))!important;border-color:color-mix(in srgb,var(--accent) 16%,var(--line))!important}
html body .about .experience-strip strong{font-family:var(--font)!important;color:var(--accent)!important}
html body .about .about-values{margin-top:34px!important}

/* Five-step journey: color follows the selected theme, with motion beyond just green. */
html body .journey{--journey-color:var(--accent);--journey-strong:var(--accent-strong);background:linear-gradient(180deg,color-mix(in srgb,var(--bg-soft) 96%,var(--journey-color) 4%),var(--bg))!important}
html body .journey .journey-track::before{background:linear-gradient(90deg,color-mix(in srgb,var(--journey-color) 6%,transparent),color-mix(in srgb,var(--journey-color) 58%,transparent) 45%,color-mix(in srgb,var(--journey-strong) 25%,transparent))!important;box-shadow:0 0 24px color-mix(in srgb,var(--journey-color) 18%,transparent)!important}
html body .journey .journey-track::after{background:radial-gradient(circle at 35% 35%,#fff 0 18%,var(--journey-strong) 24%,var(--journey-color) 65%,transparent 70%)!important;box-shadow:0 0 0 10px color-mix(in srgb,var(--journey-color) 10%,transparent),0 0 28px color-mix(in srgb,var(--journey-color) 38%,transparent),0 0 56px color-mix(in srgb,var(--journey-color) 24%,transparent)!important;animation:journeyBeamV59 7s cubic-bezier(.45,0,.2,1) infinite!important}
html body .journey .journey-num{color:var(--journey-color)!important;border-color:color-mix(in srgb,var(--journey-color) 30%,var(--line))!important;background:linear-gradient(180deg,var(--surface),color-mix(in srgb,var(--surface) 88%,var(--journey-color) 12%))!important}
html body .journey .journey-step>div{background:linear-gradient(160deg,var(--surface),color-mix(in srgb,var(--surface) 92%,var(--journey-color) 8%))!important;border-color:color-mix(in srgb,var(--journey-color) 14%,var(--line))!important;position:relative!important;overflow:hidden!important}
html body .journey .journey-step>div::after{content:"";position:absolute;inset:-40% auto auto -25%;width:160px;height:160px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--journey-color) 15%,transparent),transparent 70%);opacity:.35;transform:translate3d(0,0,0);transition:opacity .35s ease,transform .45s ease}
html body .journey .journey-step.is-active>div{transform:translateY(-7px) scale(1.015)!important;border-color:color-mix(in srgb,var(--journey-color) 44%,var(--line))!important;box-shadow:0 24px 60px color-mix(in srgb,var(--journey-color) 15%,transparent)!important}
html body .journey .journey-step.is-active>div::after{opacity:.9;transform:translate3d(26px,22px,0) scale(1.25)}
html body .journey .journey-step.is-active h3{color:var(--journey-color)!important}
html body .journey .journey-step.is-active .journey-num{box-shadow:0 0 0 12px color-mix(in srgb,var(--journey-color) 9%,transparent),0 0 32px color-mix(in srgb,var(--journey-color) 30%,transparent)!important;border-color:var(--journey-color)!important}
@keyframes journeyBeamV59{0%{inset-inline-start:8%;opacity:0;transform:scale(.7)}8%{opacity:1;transform:scale(1)}48%{transform:scale(1.15)}92%{opacity:1;transform:scale(1)}100%{inset-inline-start:92%;opacity:0;transform:scale(.72)}}

/* Locations: compact premium cards with clearer hierarchy. */
html body .locations .locations-grid{align-items:center!important;gap:clamp(30px,5vw,66px)!important}
html body .locations .location-cards{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:14px!important;align-items:stretch!important}
html body .locations .location-card{position:relative!important;overflow:hidden!important;min-height:210px!important;padding:22px!important;border-radius:26px!important;background:linear-gradient(160deg,var(--surface),color-mix(in srgb,var(--surface) 92%,var(--accent) 8%))!important;border:1px solid color-mix(in srgb,var(--accent) 16%,var(--line))!important;box-shadow:0 18px 48px rgba(0,0,0,.055)!important;transition:transform .32s var(--ease),border-color .32s ease,box-shadow .32s ease!important}
html body .locations .location-card:hover{transform:translateY(-6px)!important;border-color:color-mix(in srgb,var(--accent) 38%,var(--line))!important;box-shadow:0 28px 64px color-mix(in srgb,var(--accent) 10%,rgba(0,0,0,.08))!important}
.location-num{position:absolute!important;top:18px!important;inset-inline-end:18px!important;color:var(--accent)!important;font-size:11px!important;font-weight:800!important}
.location-pin{width:46px;height:46px;border-radius:16px;display:grid;place-items:center;background:color-mix(in srgb,var(--accent) 11%,var(--surface));border:1px solid color-mix(in srgb,var(--accent) 20%,var(--line));position:relative;z-index:3}.location-pin::before{content:"";width:13px;height:13px;border:3px solid var(--accent);border-radius:50% 50% 50% 0;transform:rotate(-45deg)}.location-pin i{display:none}
.location-card-copy{position:relative;z-index:3;display:grid;gap:8px;margin-top:26px}.location-card-copy small{font-size:10px!important;color:var(--accent)!important;font-weight:800!important;letter-spacing:.07em!important}.location-card-copy strong{margin:0!important;font-size:clamp(20px,2vw,28px)!important;line-height:1.45!important}.location-card-copy em{font-style:normal;font-size:11px;color:var(--muted);line-height:1.6}
html body .locations .location-card.is-riyadh{transform:translateY(-8px)!important;border-color:rgba(0,106,63,.34)!important;background:linear-gradient(150deg,color-mix(in srgb,var(--surface) 94%,rgba(0,106,63,.06)),var(--surface))!important;box-shadow:0 28px 70px rgba(0,106,63,.12)!important}
html body .locations .location-card.is-riyadh .location-pin{background:rgba(0,106,63,.08);border-color:rgba(0,106,63,.22)}html body .locations .location-card.is-riyadh .location-pin::before{border-color:#0a6a3f}
html body .locations .location-card.is-riyadh .location-card-copy strong{color:#0a4a2c!important}
.ksa-backdrop{position:absolute;inset:0;pointer-events:none;z-index:1;overflow:hidden}.ksa-backdrop b{position:absolute;inset:auto 10px 10px auto;font-size:54px;line-height:1;font-weight:900;color:rgba(0,106,63,.07);letter-spacing:-.05em;animation:ksaFloatV59 5.5s ease-in-out infinite}.ksa-backdrop i{position:absolute;border-radius:50%;border:1px solid rgba(0,106,63,.14);animation:ksaRingV59 4.6s ease-in-out infinite}.ksa-backdrop i:nth-of-type(1){width:180px;height:180px;inset:-70px -70px auto auto}.ksa-backdrop i:nth-of-type(2){width:110px;height:110px;inset:-30px -30px auto auto;animation-delay:-1.5s}.ksa-backdrop i:nth-of-type(3){width:70px;height:70px;inset:12px 12px auto auto;animation-delay:-3s}
@keyframes ksaFloatV59{0%,100%{transform:translateY(3px);opacity:.7}50%{transform:translateY(-5px);opacity:1}}@keyframes ksaRingV59{0%,100%{transform:scale(.92);opacity:.35}50%{transform:scale(1.07);opacity:.85}}

@media(max-width:1000px){html body .about .about-copy{grid-template-columns:1fr!important;grid-template-areas:"intro" "body" "pills" "facts" "stats"!important}.upload-field{grid-template-columns:1fr!important}.upload-control{width:100%;justify-content:center}.locations-grid{grid-template-columns:1fr!important}.location-cards{max-width:none!important}}
@media(max-width:760px){html body .about .experience-strip{grid-template-columns:1fr!important}html body .about .studio-facts-expanded{grid-template-columns:1fr!important}html body .locations .location-cards{grid-template-columns:1fr!important}.location-card.is-riyadh{transform:none!important}.ksa-backdrop b{font-size:44px}.upload-label{max-width:190px}}
@media(prefers-reduced-motion:reduce){html body .journey .journey-track::after,.ksa-backdrop b,.ksa-backdrop i{animation:none!important}}

/* ===== V60: style imagery, premium service dropdown, prominent upload, redesigned journey ===== */

/* Style-result card with real visual mood instead of text only. */
html body .contact .contact-quiz-result{
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  min-height:340px!important;
  justify-content:flex-end!important;
  background:linear-gradient(180deg,rgba(247,243,235,.96),rgba(239,231,217,.96))!important;
}
html body .contact .contact-quiz-result::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(180deg,rgba(16,15,13,.08) 0%,rgba(16,15,13,.20) 28%,rgba(16,15,13,.48) 58%,rgba(251,248,243,.98) 100%),
    var(--quiz-image, none);
  background-size:cover;
  background-position:center;
  opacity:0;
  transform:scale(1.04);
  transition:opacity .45s ease,transform 1.2s ease;
  z-index:0;
}
html body .contact .contact-quiz-result.is-ready::before{opacity:1;transform:scale(1)}
html body .contact .contact-quiz-result::after{
  content:"";
  position:absolute;
  inset:auto 20px 18px auto;
  width:130px;
  height:130px;
  border-radius:50%;
  background:radial-gradient(circle,color-mix(in srgb,var(--accent) 18%,transparent),transparent 72%);
  z-index:0;
  filter:blur(3px);
}
html body .contact .contact-quiz-result>*{position:relative;z-index:1}
html body .contact .contact-quiz-result span:first-child{
  display:inline-flex!important;
  width:max-content;
  padding:9px 14px;
  border-radius:999px;
  background:rgba(255,255,255,.78);
  border:1px solid rgba(255,255,255,.68);
  backdrop-filter:blur(10px);
  color:#5c5140;
  margin-bottom:14px;
}
html body .contact .contact-quiz-result strong{
  color:#181512!important;
  max-width:11ch;
  text-shadow:0 2px 12px rgba(255,255,255,.16);
}
html body .contact .contact-quiz-result p{
  max-width:32ch;
  color:#3e372d!important;
  line-height:1.9!important;
}
html body .contact .contact-quiz-result.is-ready strong,
html body .contact .contact-quiz-result.is-ready p{
  color:#fffdf8!important;
  text-shadow:0 2px 18px rgba(0,0,0,.34);
}
html body .contact .contact-quiz-result.is-ready .quiz-saved-note{
  background:rgba(255,255,255,.14)!important;
  border-color:rgba(255,255,255,.24)!important;
  color:rgba(255,252,245,.92)!important;
  backdrop-filter:blur(10px);
}
html body .contact .contact-quiz-result.is-ready .quiz-saved-note>span:first-child{
  background:#fff!important;
  color:var(--accent)!important;
}

/* Premium custom service selector. */
.select-field{position:relative}
.select-field select.native-select{
  position:absolute!important;
  opacity:0!important;
  pointer-events:none!important;
  width:1px!important;
  height:1px!important;
  clip-path:inset(50%)!important;
}
.custom-select{position:relative}
.custom-select-trigger{
  width:100%;
  min-height:58px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:16px 18px;
  border-radius:18px;
  border:1px solid color-mix(in srgb,var(--accent) 18%,var(--line));
  background:linear-gradient(180deg,var(--surface),color-mix(in srgb,var(--surface) 94%,var(--bg-soft)));
  box-shadow:0 12px 28px rgba(0,0,0,.035), inset 0 1px 0 rgba(255,255,255,.72);
  color:var(--text);
  font:inherit;
  cursor:pointer;
  transition:border-color .24s ease, box-shadow .24s ease, transform .24s ease;
}
.custom-select-trigger:hover,
.custom-select.is-open .custom-select-trigger{transform:translateY(-2px);border-color:color-mix(in srgb,var(--accent) 36%,var(--line));box-shadow:0 18px 38px color-mix(in srgb,var(--accent) 10%,rgba(0,0,0,.06))}
.custom-select-trigger.is-placeholder .custom-select-text{color:var(--muted)}
.custom-select-text{font-size:14px;font-weight:600;line-height:1.8;text-align:start}
.custom-select-icon{width:32px;height:32px;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--accent) 10%,var(--surface));border:1px solid color-mix(in srgb,var(--accent) 14%,var(--line));flex:0 0 auto}
.custom-select-icon::before{content:"⌄";font-size:16px;color:var(--accent);transform:translateY(-1px);transition:transform .24s ease}
.custom-select.is-open .custom-select-icon::before{transform:rotate(180deg) translateY(1px)}
.custom-select-menu{
  position:absolute;
  inset:calc(100% + 10px) 0 auto 0;
  z-index:20;
  display:grid;
  gap:8px;
  padding:14px;
  border-radius:22px;
  background:rgba(255,255,255,.96);
  border:1px solid color-mix(in srgb,var(--accent) 18%,var(--line));
  box-shadow:0 26px 58px rgba(0,0,0,.12);
  backdrop-filter:blur(14px);
  opacity:0;
  visibility:hidden;
  transform:translateY(8px);
  transition:opacity .22s ease, visibility .22s ease, transform .22s ease;
  max-height:340px;
  overflow:auto;
}
.custom-select.is-open .custom-select-menu{opacity:1;visibility:visible;transform:translateY(0)}
.custom-select-option{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:13px 14px;
  border:1px solid transparent;
  border-radius:16px;
  background:linear-gradient(180deg,rgba(250,248,243,.94),rgba(255,255,255,.98));
  color:var(--text);
  font:inherit;
  font-size:14px;
  font-weight:600;
  line-height:1.75;
  cursor:pointer;
  transition:background .22s ease, border-color .22s ease, transform .22s ease, box-shadow .22s ease;
  text-align:start;
}
.custom-select-option:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--accent) 20%,var(--line));box-shadow:0 10px 24px color-mix(in srgb,var(--accent) 9%,rgba(0,0,0,.04))}
.custom-select-option i{font-style:normal;opacity:0;color:var(--accent);font-weight:900}
.custom-select-option.is-selected{
  border-color:color-mix(in srgb,var(--accent) 34%,var(--line));
  background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 18%,var(--surface)),rgba(255,255,255,.98));
}
.custom-select-option.is-selected i{opacity:1}
.custom-select-option.is-placeholder{color:var(--muted)}

/* Prominent upload area with animated house icon and fully hidden native file input. */
.upload-field{
  grid-template-columns:220px minmax(0,1fr)!important;
  align-items:stretch!important;
  gap:18px 24px!important;
  padding:22px!important;
  border-radius:26px!important;
  border:1px dashed color-mix(in srgb,var(--accent) 32%,var(--line))!important;
  background:linear-gradient(135deg,color-mix(in srgb,var(--surface) 94%,var(--accent) 6%),var(--surface))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.72),0 16px 36px rgba(0,0,0,.035)!important;
}
.upload-control{
  min-height:160px!important;
  border-radius:24px!important;
  justify-content:center!important;
  flex-direction:column!important;
  text-align:center!important;
  gap:14px!important;
  background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(247,243,236,.98))!important;
}
.upload-control input{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  opacity:0!important;
  pointer-events:none!important;
  overflow:hidden!important;
  clip-path:inset(50%)!important;
}
.upload-icon{
  position:relative!important;
  width:74px!important;
  height:74px!important;
  border-radius:22px!important;
  background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 10%,#fff),rgba(255,255,255,.92))!important;
  border:1px solid color-mix(in srgb,var(--accent) 18%,var(--line))!important;
  font-size:0!important;
  box-shadow:0 14px 30px color-mix(in srgb,var(--accent) 10%,rgba(0,0,0,.04));
  animation:uploadHouseFloat 2.8s ease-in-out infinite;
}
.upload-icon::before{
  content:"";
  position:absolute;
  inset:28px 18px 14px;
  border-radius:12px 12px 10px 10px;
  background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 16%,#fff),rgba(255,255,255,.98));
  border:2px solid color-mix(in srgb,var(--accent) 52%,#d8c5a9);
}
.upload-icon::after{
  content:"";
  position:absolute;
  left:18px;
  right:18px;
  top:16px;
  height:26px;
  background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 55%,#f2dcc2),color-mix(in srgb,var(--accent) 86%,#ceb081));
  clip-path:polygon(50% 0, 100% 60%, 88% 60%, 88% 100%, 12% 100%, 12% 60%, 0 60%);
  box-shadow:0 8px 20px color-mix(in srgb,var(--accent) 18%,transparent);
}
.upload-label{max-width:100%!important;font-size:15px!important;line-height:1.6!important;white-space:normal!important}
.upload-field-copy{align-content:center!important;gap:8px!important}
.upload-field-copy strong{font-size:28px!important;line-height:1.3!important}
.upload-field-copy span{font-size:13px!important;line-height:1.9!important}
.upload-field.has-file .upload-control{border-color:var(--accent)!important;box-shadow:0 18px 44px color-mix(in srgb,var(--accent) 14%,transparent)!important}
.upload-field.has-file .upload-icon{animation-duration:1.8s}
.upload-field.has-error .upload-control{border-color:#d92d20!important}
.upload-status{font-size:12px!important}
@keyframes uploadHouseFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}

/* New journey motion language. */
html body .journey .journey-track{
  gap:20px!important;
  padding-top:106px!important;
}
html body .journey .journey-track::before{
  top:48px!important;
  height:8px!important;
  border-radius:999px!important;
  background:
    linear-gradient(90deg,color-mix(in srgb,var(--accent) 10%,transparent),color-mix(in srgb,var(--accent) 44%,transparent) 22%,color-mix(in srgb,var(--accent-strong) 16%,transparent) 100%)!important;
}
html body .journey .journey-track::after{
  top:26px!important;
  width:46px!important;
  height:46px!important;
  border-radius:18px!important;
  background:linear-gradient(180deg,#fff,color-mix(in srgb,var(--surface) 86%,var(--accent) 14%))!important;
  border:1px solid color-mix(in srgb,var(--accent) 30%,var(--line))!important;
  box-shadow:0 12px 28px color-mix(in srgb,var(--accent) 18%,transparent),0 0 0 8px color-mix(in srgb,var(--accent) 8%,transparent)!important;
  animation:journeyDraftToolV60 7.4s cubic-bezier(.45,0,.2,1) infinite!important;
}
html body .journey .journey-track::after{content:"✦"!important;display:grid!important;place-items:center!important;color:var(--accent)!important;font-size:20px!important;font-weight:800!important}
html body .journey .journey-step .journey-num{
  width:64px!important;
  height:64px!important;
  border-radius:22px!important;
  top:-72px!important;
}
html body .journey .journey-step>div{
  min-height:236px!important;
  padding:28px 22px 24px!important;
  border-radius:28px!important;
}
html body .journey .journey-step>div::before{
  content:"";
  position:absolute;
  inset:0 auto auto 0;
  width:100%;
  height:4px;
  background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 8%,transparent),color-mix(in srgb,var(--accent) 52%,transparent),color-mix(in srgb,var(--accent-strong) 8%,transparent));
  opacity:.45;
}
html body .journey .journey-step h3{font-size:24px!important}
html body .journey .journey-step p{font-size:14px!important;line-height:2!important}
html body .journey .journey-step.is-active>div{
  transform:translateY(-9px) rotate(-.2deg) scale(1.01)!important;
  background:linear-gradient(165deg,color-mix(in srgb,var(--surface) 92%,var(--accent) 8%),var(--surface))!important;
}
html body .journey .journey-step.is-complete>div::before{opacity:.8}
@keyframes journeyDraftToolV60{
  0%{inset-inline-start:8%;opacity:0;transform:translateY(8px) rotate(-6deg)}
  10%{opacity:1;transform:translateY(0) rotate(0)}
  45%{transform:translateY(-6px) rotate(5deg)}
  90%{opacity:1;transform:translateY(0) rotate(0)}
  100%{inset-inline-start:92%;opacity:0;transform:translateY(8px) rotate(-6deg)}
}

@media(max-width:1000px){
  .upload-field{grid-template-columns:1fr!important}
  .upload-control{min-height:138px!important}
  .upload-field-copy strong{font-size:24px!important}
}
@media(max-width:760px){
  html body .contact .contact-quiz-result{min-height:300px!important}
  .custom-select-menu{max-height:280px}
  .upload-field-copy strong{font-size:22px!important}
  .upload-field-copy span{font-size:12px!important}
}
@media(prefers-reduced-motion:reduce){
  .upload-icon,
  html body .journey .journey-track::after{animation:none!important}
}

/* V60 theme completion: every selectable theme now carries its own accent so journey/upload/quiz motion changes with the theme. */
html[data-theme="purple"]{
  --bg:#1b1420;
  --bg-soft:#251a2c;
  --surface:#2d2135;
  --surface-2:#382840;
  --text:#f5eef8;
  --muted:#c0afc7;
  --line:rgba(245,238,248,.14);
  --accent:#a985b9;
  --accent-strong:#d0abd9;
  --accent-ink:#1d1223;
  --header:rgba(27,20,32,.88);
}
html[data-theme="gray"]{
  --bg:#e4e5e3;
  --bg-soft:#d9dbd8;
  --surface:#f8f8f6;
  --surface-2:#ced1cd;
  --text:#202321;
  --muted:#626863;
  --line:rgba(32,35,33,.14);
  --accent:#6f7772;
  --accent-strong:#4e5651;
  --accent-ink:#ffffff;
  --header:rgba(244,245,243,.92);
}


/* ===== V61 Creative refresh: Journey + Locations ===== */
.journey{position:relative;overflow:hidden;background:
  radial-gradient(circle at 15% 18%, color-mix(in srgb,var(--accent) 10%, transparent), transparent 24rem),
  radial-gradient(circle at 82% 12%, color-mix(in srgb,var(--accent) 8%, transparent), transparent 18rem),
  linear-gradient(180deg,color-mix(in srgb,var(--bg-soft) 88%, var(--surface)), var(--bg));}
.journey::before,.journey::after{content:"";position:absolute;pointer-events:none;opacity:.42}
.journey::before{inset:26px auto auto 4%;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle, color-mix(in srgb,var(--accent) 12%, transparent), transparent 65%);filter:blur(12px)}
.journey::after{inset:auto 6% 26px auto;width:240px;height:240px;border-radius:36px;border:1px solid color-mix(in srgb,var(--accent) 16%, var(--line));transform:rotate(12deg);background:linear-gradient(180deg, color-mix(in srgb,var(--surface) 36%, transparent), transparent)}
.journey .shell{position:relative;z-index:1}
.journey-heading{align-items:end;gap:22px;padding-bottom:14px}
.journey-heading p{max-width:520px}
.journey-track{counter-reset:journeyStep;display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px!important;position:relative;padding:96px 6px 12px!important;isolation:isolate}
.journey-track::before{content:"";position:absolute;inset-inline:8% 8%;top:42px;height:74px;border-radius:999px;border:1px solid color-mix(in srgb,var(--accent) 16%,var(--line));background:
  linear-gradient(90deg, transparent 0 4%, color-mix(in srgb,var(--accent) 12%, transparent) 18%, transparent 32%, color-mix(in srgb,var(--accent) 14%, transparent) 56%, transparent 74%, color-mix(in srgb,var(--accent) 12%, transparent) 100%),
  linear-gradient(180deg, color-mix(in srgb,var(--surface) 60%, transparent), color-mix(in srgb,var(--bg-soft) 72%, transparent));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55), 0 16px 44px rgba(0,0,0,.04)}
.journey-track::after{content:"✦";position:absolute;top:35px;inset-inline-start:10%;width:34px;height:34px;display:grid;place-items:center;border-radius:16px;background:linear-gradient(180deg, color-mix(in srgb,var(--surface) 92%, #fff), color-mix(in srgb,var(--accent) 16%, var(--surface)));color:var(--accent);font-size:17px;box-shadow:0 12px 34px rgba(0,0,0,.1), 0 0 0 10px color-mix(in srgb,var(--accent) 10%, transparent);animation:journeyCursorDrift 8.5s cubic-bezier(.55,.08,.18,.99) infinite;z-index:3}
.journey-step{position:relative;--step-shift:0px;transform:none!important}
.journey-step:nth-child(1){--step-shift:18px}
.journey-step:nth-child(2){--step-shift:42px}
.journey-step:nth-child(3){--step-shift:4px}
.journey-step:nth-child(4){--step-shift:38px}
.journey-step:nth-child(5){--step-shift:14px}
.journey-step::before{content:none!important}
.journey-step > div{position:relative;height:100%;padding:28px 22px 24px!important;border-radius:30px!important;border:1px solid color-mix(in srgb,var(--accent) 18%,var(--line))!important;background:
  linear-gradient(135deg, color-mix(in srgb,var(--surface) 96%, white), color-mix(in srgb,var(--surface) 86%, var(--bg-soft)) 65%, color-mix(in srgb,var(--accent) 6%, var(--surface)) 100%)!important;
  box-shadow:0 20px 58px rgba(17,16,13,.05), inset 0 1px 0 rgba(255,255,255,.72)!important;overflow:hidden;transform:translateY(var(--step-shift));transition:transform .45s var(--ease),box-shadow .45s ease,border-color .35s ease,background .35s ease}
.journey-step > div::before{content:"";position:absolute;inset:0;background:
  linear-gradient(145deg, transparent 0 68%, color-mix(in srgb,var(--accent) 11%, transparent) 68% 71%, transparent 71%),
  radial-gradient(circle at 86% 82%, color-mix(in srgb,var(--accent) 11%, transparent), transparent 42%),
  linear-gradient(180deg, rgba(255,255,255,.38), transparent 24%);pointer-events:none}
.journey-step > div::after{content:"";position:absolute;inset:16px 16px auto auto;width:54px;height:54px;border-radius:20px;border:1px solid color-mix(in srgb,var(--accent) 18%,var(--line));background:linear-gradient(180deg, color-mix(in srgb,var(--surface) 90%, #fff), color-mix(in srgb,var(--accent) 11%, var(--surface)));box-shadow:inset 0 1px 0 rgba(255,255,255,.65)}
.journey-step:nth-child(1) > div::after{content:"⌂"}
.journey-step:nth-child(2) > div::after{content:"✦"}
.journey-step:nth-child(3) > div::after{content:"▣"}
.journey-step:nth-child(4) > div::after{content:"↺"}
.journey-step:nth-child(5) > div::after{content:"✓"}
.journey-step:nth-child(1) > div::after,.journey-step:nth-child(2) > div::after,.journey-step:nth-child(3) > div::after,.journey-step:nth-child(4) > div::after,.journey-step:nth-child(5) > div::after{display:grid;place-items:center;color:var(--accent);font-size:18px;font-weight:800}
.journey-step .journey-num{position:absolute;top:-20px;inset-inline-start:22px;width:62px;height:62px;border-radius:22px!important;background:linear-gradient(180deg, color-mix(in srgb,var(--surface) 94%, white), color-mix(in srgb,var(--accent) 12%, var(--surface)))!important;border:1px solid color-mix(in srgb,var(--accent) 22%,var(--line))!important;color:var(--accent)!important;box-shadow:0 14px 32px rgba(0,0,0,.06)!important;display:grid;place-items:center;font:800 18px/1 var(--font-en)!important;z-index:2}
.journey-step h3{font-size:23px!important;line-height:1.32;margin:32px 0 10px!important;padding-inline-end:40px}
.journey-step p{font-size:14px!important;line-height:1.95;color:var(--muted)!important}
.journey-step.is-active > div{transform:translateY(calc(var(--step-shift) - 14px)) scale(1.01);border-color:color-mix(in srgb,var(--accent) 44%,var(--line))!important;box-shadow:0 28px 60px rgba(0,0,0,.09), 0 0 0 1px color-mix(in srgb,var(--accent) 14%, transparent)!important;background:linear-gradient(135deg, color-mix(in srgb,var(--surface) 98%, white), color-mix(in srgb,var(--accent) 9%, var(--surface)) 70%, color-mix(in srgb,var(--accent) 16%, var(--surface)) 100%)!important}
.journey-step.is-active .journey-num{transform:translateY(-6px);box-shadow:0 0 0 10px color-mix(in srgb,var(--accent) 12%, transparent), 0 16px 40px rgba(0,0,0,.1)!important;border-color:color-mix(in srgb,var(--accent) 50%,var(--line))!important}
.journey-step.is-complete > div{border-style:solid;opacity:.96}
.journey-step.is-complete .journey-num{color:color-mix(in srgb,var(--accent) 92%, #0d4632)!important}
@keyframes journeyCursorDrift{0%{transform:translate3d(0,0,0) rotate(0deg)}12%{transform:translate3d(85%,10px,0) rotate(16deg)}25%{transform:translate3d(195%,0,0) rotate(-8deg)}37%{transform:translate3d(310%,14px,0) rotate(10deg)}50%{transform:translate3d(435%,-2px,0) rotate(-10deg)}62%{transform:translate3d(560%,16px,0) rotate(12deg)}75%{transform:translate3d(695%,0,0) rotate(-7deg)}87%{transform:translate3d(815%,10px,0) rotate(10deg)}100%{transform:translate3d(875%,0,0) rotate(0deg)}}

.locations{position:relative;overflow:hidden;background:linear-gradient(180deg,var(--bg),color-mix(in srgb,var(--bg-soft) 82%, var(--surface)))}
.locations::before{content:"";position:absolute;inset:54px auto auto -100px;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle, color-mix(in srgb,var(--accent) 11%, transparent), transparent 68%);filter:blur(10px);pointer-events:none}
.locations-grid{display:grid!important;grid-template-columns:minmax(320px,.95fr) minmax(340px,1.05fr)!important;align-items:center;gap:34px!important}
.locations-intro{padding:28px 6px 28px 0}
.locations-intro h2{max-width:12ch}
.locations-intro p:last-child{max-width:54ch}
.location-cards{position:relative;display:grid!important;grid-template-columns:1.15fr .95fr!important;grid-template-rows:repeat(2,minmax(158px,1fr));gap:18px!important;align-items:stretch}
.location-cards::before{content:"";position:absolute;inset:18px 43% 18px auto;width:80px;border-radius:999px;border:1px dashed color-mix(in srgb,var(--accent) 20%,var(--line));opacity:.65;pointer-events:none}
.location-card{position:relative;min-height:188px!important;padding:26px 24px 22px!important;border-radius:30px!important;border:1px solid color-mix(in srgb,var(--accent) 14%,var(--line))!important;background:linear-gradient(180deg, color-mix(in srgb,var(--surface) 97%, white), color-mix(in srgb,var(--surface) 88%, var(--bg-soft)) 100%)!important;box-shadow:0 22px 54px rgba(18,17,14,.05)!important;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;transition:transform .45s var(--ease), box-shadow .45s ease, border-color .35s ease}
.location-card::before{content:"";position:absolute;inset:-40% auto auto -12%;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle, color-mix(in srgb,var(--accent) 10%, transparent), transparent 70%);pointer-events:none}
.location-card::after{content:"";position:absolute;inset:auto 16px 16px auto;width:92px;height:92px;border-radius:26px;border:1px solid color-mix(in srgb,var(--accent) 10%,var(--line));background:linear-gradient(180deg, transparent, color-mix(in srgb,var(--accent) 6%, transparent));pointer-events:none}
.location-card.is-primary{grid-row:1 / span 2;min-height:356px!important;padding-bottom:26px!important;border-color:rgba(0,106,63,.22)!important;background:linear-gradient(160deg, color-mix(in srgb,var(--surface) 94%, white), rgba(214,245,228,.72) 58%, rgba(236,250,242,.95) 100%)!important;box-shadow:0 28px 64px rgba(0,106,63,.12)!important}
.location-card.is-primary::before{inset:auto auto -24px -12%;width:250px;height:250px;background:radial-gradient(circle, rgba(0,106,63,.18), transparent 70%);animation:riyadhAuraShift 6s ease-in-out infinite}
.location-card.is-primary::after{inset:auto 14px 14px auto;width:122px;height:122px;border-radius:32px;border:1px solid rgba(0,106,63,.14);background:linear-gradient(180deg, rgba(255,255,255,.12), rgba(0,106,63,.08))}
.location-card:not(.is-primary):nth-child(2){transform:translateY(20px)}
.location-card:not(.is-primary):nth-child(3){transform:translateY(-16px)}
.location-card.is-spotlight{transform:translateY(-8px) scale(1.015)!important;border-color:color-mix(in srgb,var(--accent) 30%,var(--line))!important;box-shadow:0 30px 60px rgba(18,17,14,.1)!important}
.location-card.is-primary.is-spotlight{box-shadow:0 34px 68px rgba(0,106,63,.18)!important}
.location-num{position:absolute;top:18px;inset-inline-end:20px;display:grid;place-items:center;width:44px;height:44px;border-radius:16px;border:1px solid color-mix(in srgb,var(--accent) 20%,var(--line));background:linear-gradient(180deg, color-mix(in srgb,var(--surface) 92%, white), color-mix(in srgb,var(--accent) 8%, var(--surface)));font:800 15px/1 var(--font-en);color:var(--accent);z-index:3}
.location-pin{position:absolute;top:18px;inset-inline-start:18px;width:52px;height:52px;border-radius:18px;border:1px solid color-mix(in srgb,var(--accent) 18%,var(--line));background:linear-gradient(180deg, color-mix(in srgb,var(--surface) 92%, #fff), color-mix(in srgb,var(--accent) 8%, var(--surface)));display:grid;place-items:center;box-shadow:0 10px 24px rgba(0,0,0,.05)}
.location-pin::before{content:"";position:absolute;inset:11px;border-radius:14px;background:linear-gradient(180deg, color-mix(in srgb,var(--accent) 18%, white), color-mix(in srgb,var(--accent) 10%, transparent))}
.location-pin i{position:relative;width:14px;height:14px;border:2px solid var(--accent);border-radius:50% 50% 50% 0;transform:rotate(-45deg);display:block}
.location-pin i::after{content:"";position:absolute;width:5px;height:5px;border-radius:50%;background:var(--accent);top:2px;left:2px}
.location-card-copy{position:relative;z-index:2;display:grid;gap:10px;max-width:88%}
.location-card-copy small{font-size:12px!important;font-weight:800!important;letter-spacing:.03em;color:var(--muted)!important}
.location-card-copy strong{display:block;margin-top:44px!important;font-size:clamp(30px,2.7vw,46px)!important;line-height:1.14!important;color:var(--text)!important}
.location-card-copy em{font-style:normal;font-size:13px;color:var(--muted);display:inline-flex;align-items:center;gap:8px}
.location-card-copy em::before{content:"";width:28px;height:1px;background:color-mix(in srgb,var(--accent) 32%,var(--line));display:inline-block}
.location-card:not(.is-primary) .location-card-copy strong{font-size:clamp(24px,2vw,36px)!important;max-width:10ch}
.location-card:not(.is-primary) .location-card-copy em{font-size:12px}
.location-card.is-primary .location-card-copy small{color:rgba(8,78,46,.74)!important}
.location-card.is-primary .location-card-copy strong{color:#0b5a38!important;max-width:7ch}
.location-card.is-primary .location-card-copy em{color:rgba(8,78,46,.78)}
.location-card.is-primary .location-card-copy em::before{background:rgba(0,106,63,.3)}
.ksa-backdrop{position:absolute;inset:auto 0 0 auto;width:64%;height:100%;pointer-events:none;opacity:1}
.ksa-backdrop b{position:absolute;bottom:20px;inset-inline-end:22px;font-size:72px;line-height:.9;font-weight:900;color:rgba(0,106,63,.08);letter-spacing:-.05em}
.ksa-backdrop i{position:absolute;border-radius:999px;background:linear-gradient(90deg, rgba(0,106,63,.06), rgba(0,106,63,.18), transparent)}
.ksa-backdrop i:nth-child(2){top:58px;inset-inline-start:14px;width:168px;height:10px;animation:ksaWave 5.4s ease-in-out infinite}
.ksa-backdrop i:nth-child(3){top:92px;inset-inline-start:0;width:132px;height:10px;animation:ksaWave 5.4s ease-in-out infinite -.9s}
.ksa-backdrop i:nth-child(4){bottom:88px;inset-inline-end:18px;width:120px;height:10px;animation:ksaWave 5.4s ease-in-out infinite -1.7s}
@keyframes ksaWave{50%{transform:translateX(-10px);opacity:.92}}
@keyframes riyadhAuraShift{50%{transform:scale(1.07) translateY(-10px);opacity:.9}}

@media(max-width:1100px){
  .journey-track{grid-template-columns:repeat(2,minmax(0,1fr))!important;padding-top:82px!important}
  .journey-track::before{inset-inline:5% 5%}
  .journey-track::after{top:34px;inset-inline-start:7%;animation-duration:7.2s}
  .journey-step:nth-child(1),.journey-step:nth-child(2),.journey-step:nth-child(3),.journey-step:nth-child(4),.journey-step:nth-child(5){--step-shift:0px}
  .journey-step > div,.journey-step.is-active > div{transform:none}
  .locations-grid{grid-template-columns:1fr!important;gap:26px!important}
  .location-cards{grid-template-columns:1fr 1fr!important}
  .location-card.is-primary{grid-column:1/-1;grid-row:auto;min-height:260px!important}
  .location-card:not(.is-primary):nth-child(2),.location-card:not(.is-primary):nth-child(3),.location-card.is-spotlight{transform:none!important}
}
@media(max-width:760px){
  .journey-heading{gap:16px}
  .journey-track{grid-template-columns:1fr!important;gap:18px!important;padding-top:22px!important}
  .journey-track::before,.journey-track::after{display:none!important}
  .journey-step .journey-num{top:18px;inset-inline-start:18px;width:56px;height:56px;font-size:16px!important}
  .journey-step > div{padding:88px 18px 20px!important;transform:none!important}
  .journey-step h3{font-size:20px!important;padding-inline-end:0}
  .location-cards{grid-template-columns:1fr!important}
  .location-cards::before{display:none}
  .location-card,.location-card.is-primary{min-height:220px!important;padding:22px 18px 20px!important}
  .location-card .location-card-copy{max-width:100%}
  .location-card-copy strong,.location-card.is-primary .location-card-copy strong,.location-card:not(.is-primary) .location-card-copy strong{font-size:clamp(26px,7vw,36px)!important;max-width:none}
  .ksa-backdrop b{font-size:54px}
}
@media(prefers-reduced-motion:reduce){
  .journey-track::after,.location-card.is-primary::before,.ksa-backdrop i{animation:none!important}
  .journey-step > div,.location-card{transition:none!important}
}

/* ===== V62 complete redesign: locations + before/after ===== */
html body .locations{
  background:
    radial-gradient(circle at 8% 16%, color-mix(in srgb,var(--accent) 12%, transparent), transparent 24rem),
    linear-gradient(180deg, color-mix(in srgb,var(--bg-soft) 82%, var(--bg)), color-mix(in srgb,var(--surface) 35%, var(--bg)) 100%);
  border-block:1px solid color-mix(in srgb,var(--line) 92%, transparent);
}
html body .locations-shell{
  display:grid;
  grid-template-columns:minmax(0,1.18fr) minmax(300px,.82fr);
  gap:clamp(28px,5vw,76px);
  align-items:center;
}
html body .locations-intro{
  display:grid;
  gap:20px;
  align-content:center;
}
html body .locations-intro h2{max-width:11ch}
html body .locations-intro > p:last-of-type{
  margin:0;
  color:var(--muted);
  line-height:2;
  max-width:58ch;
}
html body .locations-points{
  display:grid;
  gap:14px;
  margin-top:8px;
}
html body .locations-points article{
  display:grid;
  grid-template-columns:50px 1fr;
  gap:14px;
  align-items:start;
  padding:14px 16px;
  border-radius:20px;
  border:1px solid color-mix(in srgb,var(--accent) 12%, var(--line));
  background:linear-gradient(180deg,color-mix(in srgb,var(--surface) 92%, white),color-mix(in srgb,var(--surface) 84%, var(--bg-soft)));
  box-shadow:0 14px 36px rgba(0,0,0,.05);
}
html body .locations-points article span{
  width:40px;height:40px;display:grid;place-items:center;
  border-radius:14px;font:800 14px/1 var(--font);
  color:var(--accent);
  border:1px solid color-mix(in srgb,var(--accent) 18%, var(--line));
  background:linear-gradient(180deg,color-mix(in srgb,var(--surface) 95%, white),color-mix(in srgb,var(--accent) 12%, var(--surface)));
}
html body .locations-points article p{margin:0;color:var(--muted);line-height:1.9}

html body .location-cards{
  position:relative;
  display:grid !important;
  grid-template-columns:minmax(0,1.15fr) minmax(240px,.78fr);
  grid-template-areas:
    "riyadh uae"
    "riyadh syria";
  gap:18px !important;
  align-items:stretch;
  min-height:470px;
}
html body .location-cards::before,
html body .location-cards::after{content:"";position:absolute;pointer-events:none}
html body .location-cards::before{
  inset:14% 33% 14% auto;
  width:1px;
  border-inline-start:1px dashed color-mix(in srgb,var(--accent) 20%, var(--line));
  opacity:.75;
}
html body .location-cards::after{
  inset:auto auto 24px 8%;
  width:140px;height:140px;border-radius:36px;
  border:1px solid color-mix(in srgb,var(--accent) 10%, var(--line));
  background:linear-gradient(180deg, color-mix(in srgb,var(--surface) 42%, transparent), transparent);
  transform:rotate(-11deg);
  opacity:.55;
}
html body .location-card{
  position:relative;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  min-height:218px !important;
  padding:24px !important;
  border-radius:34px !important;
  border:1px solid color-mix(in srgb,var(--accent) 14%, var(--line)) !important;
  background:
    linear-gradient(180deg,color-mix(in srgb,var(--surface) 96%, white),color-mix(in srgb,var(--surface) 82%, var(--bg-soft)) 100%) !important;
  box-shadow:0 24px 58px rgba(0,0,0,.08) !important;
  transition:transform .5s var(--ease), box-shadow .45s ease, border-color .35s ease, background .35s ease;
}
html body .location-card:nth-of-type(1){grid-area:riyadh}
html body .location-card:nth-of-type(2){grid-area:uae}
html body .location-card:nth-of-type(3){grid-area:syria}

html body .location-card,
html body .location-card.is-primary,
html body .location-card:nth-of-type(2),
html body .location-card:nth-of-type(3){transform:none}
html body .location-card::before{
  content:"";
  position:absolute;
  inset:-28% auto auto -10%;
  width:180px;height:180px;border-radius:50%;
  background:radial-gradient(circle,color-mix(in srgb,var(--accent) 12%, transparent),transparent 68%);
}
html body .location-card::after{
  content:"";
  position:absolute;
  inset:16px 16px auto auto;
  width:104px;height:104px;border-radius:30px;
  border:1px solid color-mix(in srgb,var(--accent) 11%, var(--line));
  background:linear-gradient(180deg, rgba(255,255,255,.18), transparent);
  opacity:.9;
}
html body .location-card.is-primary{
  min-height:470px !important;
  background:
    radial-gradient(circle at 78% 22%, color-mix(in srgb,var(--accent) 18%, transparent), transparent 22rem),
    linear-gradient(145deg, color-mix(in srgb,var(--surface) 98%, white), color-mix(in srgb,var(--accent) 8%, var(--surface)) 62%, color-mix(in srgb,var(--surface) 88%, var(--bg-soft)) 100%) !important;
  border-color:color-mix(in srgb,var(--accent) 28%, var(--line)) !important;
}
html body .location-card.is-primary::before{width:260px;height:260px;inset:auto auto -70px -40px;opacity:.9;animation:locationAura 6.8s ease-in-out infinite}
html body .location-card.is-primary::after{width:148px;height:148px;border-radius:40px}
html body .location-card.is-spotlight{
  transform:translateY(-8px) scale(1.018);
  border-color:color-mix(in srgb,var(--accent) 28%, var(--line)) !important;
  box-shadow:0 30px 70px rgba(0,0,0,.12), 0 0 0 1px color-mix(in srgb,var(--accent) 8%, transparent) !important;
}
html body .location-card.is-primary.is-spotlight{transform:translateY(-10px) scale(1.015)}
html body .location-num{
  position:absolute;
  inset:20px 20px auto auto;
  width:46px;height:46px;border-radius:16px;
  display:grid;place-items:center;
  font:800 14px/1 var(--font);
  color:var(--accent);
  border:1px solid color-mix(in srgb,var(--accent) 18%, var(--line));
  background:linear-gradient(180deg,color-mix(in srgb,var(--surface) 96%, white),color-mix(in srgb,var(--accent) 11%, var(--surface)));
  z-index:2;
}
html body .location-pin{
  position:absolute;
  inset:20px auto auto 20px;
  width:54px;height:54px;border-radius:18px;
  display:grid;place-items:center;
  border:1px solid color-mix(in srgb,var(--accent) 16%, var(--line));
  background:linear-gradient(180deg,color-mix(in srgb,var(--surface) 94%, white),color-mix(in srgb,var(--surface) 78%, var(--bg-soft)));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 10px 24px rgba(0,0,0,.05);
  z-index:2;
}
html body .location-pin i{position:relative;width:14px;height:14px;border:2px solid var(--accent);border-radius:50% 50% 50% 0;transform:rotate(-45deg);display:block}
html body .location-pin i::after{content:"";position:absolute;top:2px;left:2px;width:5px;height:5px;border-radius:50%;background:var(--accent)}
html body .location-card-copy{
  position:relative;z-index:2;display:grid;gap:10px;max-width:85%;
  margin-top:auto;
}
html body .location-card-copy small{
  margin-top:64px;
  font-size:12px !important;
  font-weight:800 !important;
  letter-spacing:.03em;
  color:var(--muted) !important;
}
html body .location-card-copy strong{
  display:block;
  font-size:clamp(30px,3vw,46px) !important;
  line-height:1.15 !important;
  color:var(--text) !important;
}
html body .location-card-copy em{
  font-style:normal;
  color:var(--muted);
  display:inline-flex;align-items:center;gap:8px;
}
html body .location-card-copy em::before{
  content:"";width:24px;height:1px;display:inline-block;background:color-mix(in srgb,var(--accent) 30%, var(--line));
}
html body .location-card:not(.is-primary) .location-card-copy strong{font-size:clamp(28px,2.2vw,38px) !important;max-width:10ch}
html body .location-card-meta{
  position:relative;z-index:2;display:flex;flex-wrap:wrap;gap:10px;margin-top:18px;
}
html body .location-card-meta span{
  padding:9px 12px;border-radius:999px;font-size:11px;font-weight:700;
  border:1px solid color-mix(in srgb,var(--accent) 12%, var(--line));
  background:color-mix(in srgb,var(--surface) 90%, transparent);
  color:var(--muted);
}
html body .location-card-wave{
  position:absolute;inset:auto -10% -12% auto;width:72%;height:54%;pointer-events:none;opacity:.85;
  background:
    radial-gradient(circle at 18% 70%, color-mix(in srgb,var(--accent) 15%, transparent), transparent 28%),
    radial-gradient(circle at 42% 65%, color-mix(in srgb,var(--accent) 12%, transparent), transparent 25%),
    radial-gradient(circle at 68% 58%, color-mix(in srgb,var(--accent) 11%, transparent), transparent 22%);
}
html body .location-card-wave::before,
html body .location-card-wave::after{
  content:"";position:absolute;border-radius:999px;inset:auto 0 0 auto;height:9px;
  background:linear-gradient(90deg, transparent, color-mix(in srgb,var(--accent) 24%, transparent), transparent);
  animation:locationLineFloat 4.8s ease-in-out infinite;
}
html body .location-card-wave::before{width:72%;bottom:64px}
html body .location-card-wave::after{width:58%;bottom:34px;animation-delay:-1.8s}

html body .before-after{
  background:
    radial-gradient(circle at 86% 18%, color-mix(in srgb,var(--accent) 12%, transparent), transparent 22rem),
    linear-gradient(180deg, color-mix(in srgb,var(--bg-soft) 68%, var(--bg)), var(--bg));
}
html body .before-after-shell{
  display:grid;
  grid-template-columns:minmax(0,1.06fr) minmax(300px,.94fr);
  gap:clamp(26px,5vw,68px);
  align-items:center;
}
html body .before-after-copy{display:grid;gap:18px;align-content:center}
html body .before-after-copy .kicker{margin-bottom:0}
html body .before-after-copy h2{
  margin:0;
  font-size:clamp(40px,5.3vw,74px);
  line-height:1.05;
  letter-spacing:-.045em;
  font-weight:520;
}
html body .before-after-copy > p{
  margin:0;color:var(--muted);line-height:2;max-width:56ch;
}
html body .ba-notes{display:grid;gap:14px;margin-top:8px}
html body .ba-note{
  padding:18px 20px;
  border-radius:24px;
  border:1px solid color-mix(in srgb,var(--accent) 12%, var(--line));
  background:linear-gradient(180deg, color-mix(in srgb,var(--surface) 95%, white), color-mix(in srgb,var(--surface) 84%, var(--bg-soft)));
  box-shadow:0 16px 40px rgba(0,0,0,.06);
}
html body .ba-note small{display:block;margin-bottom:8px;font-size:11px;font-weight:800;color:var(--accent);letter-spacing:.08em}
html body .ba-note strong{display:block;font-size:20px;line-height:1.3;margin-bottom:8px}
html body .ba-note p{margin:0;color:var(--muted);line-height:1.95}
html body .ba-note.is-after{background:linear-gradient(180deg, color-mix(in srgb,var(--surface) 97%, white), color-mix(in srgb,var(--accent) 6%, var(--surface)))}

html body .before-after-stage{position:relative}
html body .comparison-card{
  position:relative;
  padding:18px;
  border-radius:36px;
  border:1px solid color-mix(in srgb,var(--accent) 14%, var(--line));
  background:linear-gradient(180deg,color-mix(in srgb,var(--surface) 96%, white),color-mix(in srgb,var(--surface) 84%, var(--bg-soft)));
  box-shadow:0 32px 82px rgba(0,0,0,.12);
  overflow:hidden;
}
html body .comparison-card::before{
  content:"";position:absolute;inset:-140px auto auto -70px;width:260px;height:260px;border-radius:50%;
  background:radial-gradient(circle,color-mix(in srgb,var(--accent) 11%, transparent),transparent 70%);
  pointer-events:none;
}
html body .comparison-head,
html body .comparison-foot{position:relative;z-index:2}
html body .comparison-head{
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:16px;
}
html body .comparison-chip-stack{display:flex;flex-wrap:wrap;gap:10px}
html body .comparison-chip{
  padding:9px 14px;border-radius:999px;border:1px solid color-mix(in srgb,var(--accent) 14%, var(--line));
  background:color-mix(in srgb,var(--surface) 92%, transparent);font-size:11px;font-weight:800;color:var(--accent);
}
html body .comparison-meter{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:12px;font-weight:800}
html body .comparison-meter span{display:block;width:84px;height:4px;border-radius:999px;background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 16%, transparent),var(--accent),color-mix(in srgb,var(--accent) 16%, transparent))}
html body .comparison{
  position:relative;
  aspect-ratio:1.16 / 1;
  min-height:480px;
  border-radius:28px;
  border:1px solid color-mix(in srgb,var(--accent) 10%, var(--line));
  background:color-mix(in srgb,var(--surface) 92%, var(--bg-soft));
  overflow:hidden;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45);
}
html body .comparison::before{
  content:"";position:absolute;inset:16px;z-index:3;border-radius:22px;border:1px solid rgba(255,255,255,.18);pointer-events:none;
}
html body .comparison-layer img{height:100%;object-fit:cover}
html body .comparison-after img{filter:saturate(1.02) contrast(1.01) brightness(1.02)}
html body .comparison-before{clip-path:inset(0 50% 0 0)}
html body .comparison-before img{filter:grayscale(.82) saturate(.28) contrast(.86) brightness(.82)}
html body .comparison-before::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(35,29,22,.18));
}
html body .comparison-layer > span{
  z-index:2;bottom:18px;padding:10px 14px;border-radius:999px;font-size:11px;font-weight:800;
  background:color-mix(in srgb,var(--surface) 86%, transparent);border:1px solid color-mix(in srgb,var(--accent) 12%, var(--line));
}
html body .comparison-before > span{inset-inline-start:18px}
html body .comparison-after > span{inset-inline-end:18px}
html body .comparison-divider{
  width:2px;
  background:linear-gradient(180deg,rgba(255,255,255,.18),rgba(255,255,255,.94),rgba(255,255,255,.18));
  box-shadow:0 0 22px rgba(0,0,0,.14);
}
html body .comparison-divider i{
  width:58px;height:58px;border-radius:22px;font-size:18px;
  background:linear-gradient(180deg,color-mix(in srgb,var(--surface) 96%, white),color-mix(in srgb,var(--accent) 9%, var(--surface)));
  border:1px solid color-mix(in srgb,var(--accent) 14%, var(--line));
  box-shadow:0 16px 34px rgba(0,0,0,.18);
}
html body .comparison-foot{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:16px;
}
html body .comparison-foot article{
  padding:16px 18px;border-radius:24px;border:1px solid color-mix(in srgb,var(--accent) 12%, var(--line));
  background:color-mix(in srgb,var(--surface) 90%, transparent);
}
html body .comparison-foot small{display:block;margin-bottom:6px;font-size:11px;font-weight:800;color:var(--accent);letter-spacing:.06em}
html body .comparison-foot strong{display:block;font-size:18px;line-height:1.35;margin-bottom:6px}
html body .comparison-foot p{margin:0;color:var(--muted);line-height:1.85}

@keyframes locationAura{50%{transform:scale(1.08) translateY(-10px);opacity:.82}}
@keyframes locationLineFloat{50%{transform:translateX(-16px);opacity:.92}}

@media (max-width: 1120px){
  html body .locations-shell,
  html body .before-after-shell{grid-template-columns:1fr;gap:32px}
  html body .locations-intro h2{max-width:none}
  html body .location-cards{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-areas:"riyadh riyadh" "uae syria";min-height:auto}
  html body .location-card.is-primary{min-height:320px !important}
}
@media (max-width: 760px){
  html body .location-cards{grid-template-columns:1fr;grid-template-areas:"riyadh" "uae" "syria";gap:16px !important}
  html body .location-cards::before,
  html body .location-cards::after{display:none}
  html body .location-card,
  html body .location-card.is-primary{min-height:220px !important;padding:20px !important;border-radius:28px !important}
  html body .location-card-copy{max-width:100%}
  html body .location-card-copy strong,
  html body .location-card:not(.is-primary) .location-card-copy strong{font-size:clamp(28px,8vw,38px) !important;max-width:none}
  html body .before-after-copy h2{font-size:clamp(36px,11vw,52px)}
  html body .comparison{aspect-ratio:4/4.4;min-height:360px;border-radius:24px}
  html body .comparison-head{margin-bottom:12px}
  html body .comparison-foot{grid-template-columns:1fr}
  html body .locations-points article{grid-template-columns:44px 1fr;padding:12px 14px}
}
@media (prefers-reduced-motion: reduce){
  html body .location-card,
  html body .location-card.is-spotlight,
  html body .location-card.is-primary::before,
  html body .location-card-wave::before,
  html body .location-card-wave::after{animation:none !important;transition:none !important}
}

/* ===== V63 refinement: fix before/after + redesign branches ===== */
html body .locations{
  background:
    radial-gradient(circle at 92% 10%, color-mix(in srgb,var(--accent) 10%, transparent), transparent 28rem),
    linear-gradient(180deg, color-mix(in srgb,var(--bg-soft) 72%, var(--bg)), color-mix(in srgb,var(--surface) 26%, var(--bg)) 100%);
}
html body .locations-shell{
  grid-template-columns:minmax(320px,.92fr) minmax(540px,1.08fr);
  gap:clamp(28px,5vw,72px);
}
html body .locations-intro{
  gap:18px;
  padding-inline-start:clamp(0px,1vw,8px);
}
html body .locations-intro h2{
  max-width:10ch;
  margin:0;
  font-size:clamp(36px,4.2vw,58px);
  line-height:1.15;
}
html body .locations-intro > p:last-of-type{font-size:18px;line-height:2.05}
html body .locations-points{gap:12px;margin-top:4px}
html body .locations-points article{
  grid-template-columns:58px 1fr;
  padding:15px 18px;
  border-radius:22px;
  background:linear-gradient(180deg, color-mix(in srgb,var(--surface) 96%, white), color-mix(in srgb,var(--surface) 86%, var(--bg-soft)));
}
html body .locations-points article span{
  width:44px;height:44px;border-radius:15px;color:var(--accent);
}

html body .location-cards{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr));
  grid-template-areas:none;
  gap:22px!important;
  min-height:auto;
  align-items:end;
}
html body .location-cards::before{
  inset:auto 5% 26px 5%;
  width:auto;height:1px;border:none;
  background:linear-gradient(90deg, transparent, color-mix(in srgb,var(--accent) 16%, var(--line)), transparent);
  opacity:.65;
}
html body .location-cards::after{display:none}
html body .location-card,
html body .location-card:nth-of-type(1),
html body .location-card:nth-of-type(2),
html body .location-card:nth-of-type(3){
  grid-area:auto;
  min-height:326px!important;
  padding:28px 24px 24px!important;
  border-radius:32px!important;
  background:
    linear-gradient(180deg,color-mix(in srgb,var(--surface) 97%, white),color-mix(in srgb,var(--surface) 86%, var(--bg-soft)) 100%)!important;
  box-shadow:0 22px 56px rgba(21,18,14,.07)!important;
  border:1px solid color-mix(in srgb,var(--accent) 14%, var(--line))!important;
}
html body .location-card::before{
  inset:auto auto -64px -36px;
  width:210px;height:210px;
  background:radial-gradient(circle, color-mix(in srgb,var(--accent) 8%, transparent), transparent 72%);
}
html body .location-card::after{
  inset:20px 18px auto auto;
  width:96px;height:96px;border-radius:28px;
  background:linear-gradient(180deg, rgba(255,255,255,.36), rgba(255,255,255,.04));
}
html body .location-card.is-primary{
  min-height:354px!important;
  transform:translateY(-12px)!important;
  background:
    radial-gradient(circle at 18% 100%, color-mix(in srgb,var(--accent) 10%, transparent), transparent 22rem),
    linear-gradient(180deg, color-mix(in srgb,var(--surface) 98%, white), color-mix(in srgb,var(--surface) 90%, var(--bg-soft)) 100%)!important;
  border-color:color-mix(in srgb,var(--accent) 24%, var(--line))!important;
  box-shadow:0 30px 72px rgba(21,18,14,.11)!important;
}
html body .location-card.is-primary::before{
  inset:auto -8% -16% auto;width:250px;height:180px;opacity:.85;
  background:radial-gradient(circle at 50% 50%, color-mix(in srgb,var(--accent) 12%, transparent), transparent 70%);
  animation:locationAuraSoft 6s ease-in-out infinite;
}
html body .location-pin{
  width:52px;height:52px;border-radius:16px;
  background:linear-gradient(180deg, color-mix(in srgb,var(--surface) 96%, white), color-mix(in srgb,var(--surface) 88%, var(--bg-soft)));
}
html body .location-num{inset:20px auto auto 20px}
html body .location-card-copy{
  gap:12px;
  max-width:100%;
}
html body .location-card-copy small{
  margin-top:66px;
  font-size:12px!important;
  color:var(--muted)!important;
}
html body .location-card-copy strong{
  margin:0;
  font-size:clamp(34px,3vw,46px)!important;
  line-height:1.18!important;
  max-width:none!important;
}
html body .location-card.is-primary .location-card-copy strong{color:var(--text)!important}
html body .location-card-copy em{
  font-size:13px;
  color:var(--muted);
}
html body .location-card-meta{margin-top:14px;gap:8px}
html body .location-card-meta span{
  background:color-mix(in srgb,var(--surface) 92%, transparent);
  color:var(--muted);
}
html body .location-card-wave{
  inset:auto 0 0 0;
  width:100%;height:58%;opacity:.72;
  background:
    radial-gradient(circle at 18% 80%, color-mix(in srgb,var(--accent) 10%, transparent), transparent 25%),
    radial-gradient(circle at 48% 68%, color-mix(in srgb,var(--accent) 8%, transparent), transparent 22%),
    radial-gradient(circle at 76% 56%, color-mix(in srgb,var(--accent) 8%, transparent), transparent 20%);
}
html body .location-card-wave::before,
html body .location-card-wave::after{display:none}

html body .before-after{
  background:
    radial-gradient(circle at 14% 18%, color-mix(in srgb,var(--accent) 9%, transparent), transparent 26rem),
    linear-gradient(180deg, color-mix(in srgb,var(--bg-soft) 66%, var(--bg)), var(--bg));
}
html body .before-after-shell{
  grid-template-columns:minmax(300px,.95fr) minmax(520px,1.05fr);
  gap:clamp(26px,5vw,70px);
}
html body .before-after-copy h2{
  font-size:clamp(42px,5vw,78px);
  line-height:1.04;
}
html body .before-after-copy > p{font-size:18px;line-height:2.02}
html body .ba-notes{gap:12px}
html body .ba-note{
  border-radius:22px;
  padding:18px 20px;
  box-shadow:0 14px 34px rgba(16,14,10,.05);
}
html body .comparison-card{
  padding:20px;
  border-radius:34px;
  box-shadow:0 30px 78px rgba(16,14,10,.1);
}
html body .comparison-card::before{display:none}
html body .comparison-head{margin-bottom:14px}
html body .comparison-chip-stack{gap:8px}
html body .comparison-chip{
  color:var(--accent-strong, var(--accent));
  background:linear-gradient(180deg, color-mix(in srgb,var(--surface) 96%, white), color-mix(in srgb,var(--accent) 7%, var(--surface)));
}
html body .comparison-meter{gap:10px}
html body .comparison-meter span{width:72px;background:linear-gradient(90deg, color-mix(in srgb,var(--accent) 10%, transparent), color-mix(in srgb,var(--accent) 44%, white), color-mix(in srgb,var(--accent) 10%, transparent))}
html body .comparison{
  min-height:560px;
  aspect-ratio:1.02 / 1;
  border-radius:26px;
  background:linear-gradient(180deg, color-mix(in srgb,var(--surface) 95%, white), color-mix(in srgb,var(--surface) 88%, var(--bg-soft)));
}
html body .comparison::before{inset:14px;border-radius:20px;opacity:.85}
html body .comparison::after{
  content:"";
  position:absolute;
  inset:auto 16px 16px auto;
  width:118px;height:118px;border-radius:32px;
  border:1px solid color-mix(in srgb,var(--accent) 10%, var(--line));
  background:linear-gradient(180deg, rgba(255,255,255,.26), transparent);
  pointer-events:none;z-index:1;
}
html body .comparison-layer{position:absolute;inset:0}
html body .comparison-layer img{width:100%!important;height:100%!important;min-height:0!important;object-fit:cover!important;display:block}
html body .comparison-before{
  width:50%;
  clip-path:none;
  overflow:hidden;
  border-inline-end:1px solid rgba(255,255,255,.32);
}
html body .comparison-before img{filter:grayscale(.78) saturate(.22) contrast(.88) brightness(.84)}
html body .comparison-before::before{
  content:"";
  position:absolute;inset:0;pointer-events:none;
  background:
    linear-gradient(180deg, rgba(62,54,43,.12), rgba(62,54,43,.22)),
    radial-gradient(circle at 30% 80%, rgba(231,223,214,.88) 0 64px, transparent 88px),
    radial-gradient(circle at 84% 24%, rgba(231,223,214,.72) 0 84px, transparent 112px);
  z-index:1;
}
html body .comparison-before::after{display:none}
html body .comparison-after::before{
  content:"";
  position:absolute;inset:0;pointer-events:none;
  background:
    linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.08)),
    radial-gradient(circle at 78% 78%, color-mix(in srgb,var(--accent) 8%, transparent), transparent 20%);
  z-index:1;
}
html body .comparison-layer > span{
  z-index:2;
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
}
html body .comparison-divider{
  top:14px;bottom:14px;width:2px;
  background:linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.96), rgba(255,255,255,.18));
}
html body .comparison-divider i{
  width:54px;height:54px;border-radius:20px;
  font-size:16px;
}
html body .comparison-foot{gap:10px}
html body .comparison-foot article{
  border-radius:20px;
  background:linear-gradient(180deg, color-mix(in srgb,var(--surface) 96%, white), color-mix(in srgb,var(--surface) 88%, var(--bg-soft)));
}
html body .comparison-range{opacity:0!important;cursor:ew-resize;appearance:none;-webkit-appearance:none}

@keyframes locationAuraSoft{50%{transform:translateY(-8px) scale(1.05);opacity:.9}}

@media (max-width:1120px){
  html body .locations-shell,
  html body .before-after-shell{grid-template-columns:1fr}
  html body .location-cards{grid-template-columns:repeat(3,minmax(0,1fr));}
  html body .location-card.is-primary{transform:none!important;min-height:326px!important}
}
@media (max-width:820px){
  html body .location-cards{grid-template-columns:1fr!important;gap:16px!important}
  html body .location-card,
  html body .location-card.is-primary{min-height:224px!important;transform:none!important}
  html body .comparison{min-height:420px;aspect-ratio:4/4.2}
}

/* ===== V64 redesign: premium locations + cleaner before/after ===== */
html body .locations{
  --hq-accent:#4b6484;
  --hq-accent-2:#728cab;
  --hq-ink:#26384f;
  --hq-soft:#edf3fb;
  --branch-soft:#fcfaf6;
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 82% 18%, rgba(114,140,171,.10), transparent 26rem),
    radial-gradient(circle at 14% 78%, rgba(212,171,92,.10), transparent 28rem),
    linear-gradient(180deg, #fcfbf8 0%, #f7f4ef 100%);
}
html body .locations::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg, transparent 0 8%, rgba(255,255,255,.28) 8% 9%, transparent 9% 91%, rgba(255,255,255,.28) 91% 92%, transparent 92% 100%);
  opacity:.35;
}
html body .locations-shell{
  align-items:center;
  grid-template-columns:minmax(320px,.95fr) minmax(580px,1.05fr)!important;
  gap:clamp(30px,5vw,80px)!important;
}
html body .locations-intro{
  padding-inline-start:0!important;
  gap:18px!important;
}
html body .locations-intro .eyebrow{color:#c79b56!important}
html body .locations-intro h2{
  margin:0!important;
  max-width:8ch!important;
  font-size:clamp(42px,4.8vw,74px)!important;
  line-height:1.08!important;
}
html body .locations-intro > p:last-of-type{
  max-width:33ch;
  font-size:18px!important;
  line-height:2!important;
}
html body .locations-points{
  margin-top:10px!important;
  gap:14px!important;
}
html body .locations-points article{
  grid-template-columns:56px 1fr!important;
  padding:16px 18px!important;
  border-radius:20px!important;
  background:rgba(255,255,255,.72)!important;
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border:1px solid rgba(212,171,92,.12)!important;
  box-shadow:0 12px 30px rgba(22,18,12,.05)!important;
}
html body .locations-points article span{
  width:42px!important;height:42px!important;border-radius:14px!important;
  color:#c79b56!important;
  background:linear-gradient(180deg,#fff,#f8f2e8)!important;
  box-shadow:inset 0 0 0 1px rgba(212,171,92,.16);
}

html body .location-cards{
  position:relative;
  display:grid!important;
  grid-template-columns:1.18fr .98fr .92fr!important;
  align-items:end!important;
  gap:22px!important;
  min-height:unset!important;
}
html body .location-cards::before,
html body .location-cards::after{display:none!important}
html body .location-card,
html body .location-card:nth-of-type(1),
html body .location-card:nth-of-type(2),
html body .location-card:nth-of-type(3){
  position:relative!important;
  min-height:360px!important;
  padding:28px 24px 24px!important;
  border-radius:34px!important;
  overflow:hidden!important;
  border:1px solid rgba(212,171,92,.16)!important;
  background:linear-gradient(180deg,#fffefc 0%, #f8f4ee 100%)!important;
  box-shadow:0 24px 60px rgba(16,12,7,.07)!important;
  transform:none!important;
}
html body .location-card:nth-of-type(2){margin-top:42px}
html body .location-card:nth-of-type(3){margin-top:76px}
html body .location-card::before{
  content:""!important;position:absolute!important;inset:auto auto -42px -26px!important;
  width:180px!important;height:180px!important;border-radius:50%!important;
  background:radial-gradient(circle, rgba(212,171,92,.14), rgba(212,171,92,.03) 48%, transparent 74%)!important;
  animation:locationFloatWarm 8s ease-in-out infinite!important;
}
html body .location-card::after{
  content:""!important;position:absolute!important;inset:18px 18px auto auto!important;
  width:92px!important;height:92px!important;border-radius:28px!important;
  border:1px solid rgba(212,171,92,.12)!important;
  background:linear-gradient(180deg, rgba(255,255,255,.55), rgba(255,255,255,.08))!important;
}
html body .location-card .location-num{
  inset:18px auto auto 18px!important;
  min-width:44px;height:44px;padding-inline:12px;border-radius:14px!important;
  background:linear-gradient(180deg,#fff,#f8f2e8)!important;
  border:1px solid rgba(212,171,92,.16)!important;
  color:#ba8d4d!important;
  font:800 12px/1 var(--font-en)!important;
  box-shadow:none!important;
}
html body .location-card .location-pin{
  width:50px!important;height:50px!important;border-radius:16px!important;
  background:linear-gradient(180deg,#fff,#faf5eb)!important;
  border:1px solid rgba(212,171,92,.18)!important;
  color:#c79b56!important;
  box-shadow:none!important;
  animation:pinBounceSoft 4.4s ease-in-out infinite!important;
}
html body .location-card-copy{gap:12px!important;max-width:100%!important;position:relative;z-index:2}
html body .location-card-copy small{
  margin-top:74px!important;
  font-size:12px!important;
  font-weight:800!important;
  color:#8e8476!important;
}
html body .location-card-copy strong{
  margin-top:0!important;
  font-size:clamp(30px,2.4vw,44px)!important;
  line-height:1.16!important;
  color:#151515!important;
  max-width:none!important;
}
html body .location-card-copy em{
  font-style:normal!important;
  font-size:13px!important;
  color:#7e7469!important;
}
html body .location-card-copy em::before{display:none!important}
html body .location-card-meta{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px!important;position:relative;z-index:2}
html body .location-card-meta span{
  padding:8px 12px!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.72)!important;
  color:#867b6e!important;
  border:1px solid rgba(212,171,92,.12)!important;
}
html body .location-card-wave{
  position:absolute!important;inset:auto 0 0 0!important;height:42%!important;opacity:1!important;
  background:
    radial-gradient(circle at 22% 80%, rgba(212,171,92,.12), transparent 24%),
    linear-gradient(180deg, transparent 0%, rgba(255,255,255,0) 18%, rgba(212,171,92,.06) 100%)!important;
}
html body .location-card-wave::before,
html body .location-card-wave::after{display:none!important}

html body .location-card.is-primary{
  min-height:420px!important;
  margin-top:0!important;
  background:
    radial-gradient(circle at 20% 86%, rgba(114,140,171,.16), transparent 28%),
    linear-gradient(180deg, #fbfdff 0%, #eff5fb 100%)!important;
  border-color:rgba(114,140,171,.22)!important;
  box-shadow:0 30px 74px rgba(58,88,126,.14)!important;
}
html body .location-card.is-primary::before{
  width:220px!important;height:220px!important;inset:auto auto -56px -30px!important;
  background:radial-gradient(circle, rgba(114,140,171,.20), rgba(114,140,171,.06) 48%, transparent 74%)!important;
  animation:locationFloatCool 7s ease-in-out infinite!important;
}
html body .location-card.is-primary::after{
  width:132px!important;height:132px!important;
  border-color:rgba(114,140,171,.16)!important;
  background:linear-gradient(180deg, rgba(255,255,255,.55), rgba(114,140,171,.08))!important;
}
html body .location-card.is-primary .location-pin{
  color:var(--hq-accent)!important;
  border-color:rgba(114,140,171,.22)!important;
  background:linear-gradient(180deg,#ffffff,#eff5fb)!important;
}
html body .location-card.is-primary .location-num{
  color:var(--hq-accent)!important;
  border-color:rgba(114,140,171,.2)!important;
  background:linear-gradient(180deg,#fff,#eff5fb)!important;
}
html body .location-card.is-primary .location-card-copy small{color:#687a8f!important}
html body .location-card.is-primary .location-card-copy strong{color:var(--hq-ink)!important}
html body .location-card.is-primary .location-card-copy em{color:#5e758f!important}
html body .location-card.is-primary .location-card-meta span{
  background:rgba(255,255,255,.68)!important;
  color:#5f7895!important;
  border-color:rgba(114,140,171,.16)!important;
}
html body .location-card.is-primary .location-card-wave{
  background:
    radial-gradient(circle at 24% 74%, rgba(114,140,171,.22), transparent 24%),
    radial-gradient(circle at 78% 64%, rgba(114,140,171,.14), transparent 20%),
    linear-gradient(180deg, transparent 0%, rgba(114,140,171,.03) 30%, rgba(114,140,171,.09) 100%)!important;
}
html body .location-card.is-primary .location-card-wave::before{
  display:block!important;content:"";position:absolute;inset:auto 14px 16px auto;width:180px;height:56px;
  border-radius:999px;background:linear-gradient(90deg, transparent, rgba(114,140,171,.16), transparent);
  filter:blur(10px);animation:hqSweep 5.6s linear infinite;
}
html body .location-card.is-primary .location-card-wave::after{
  display:block!important;content:"";position:absolute;inset:auto 22px 18px auto;width:110px;height:110px;border-radius:50%;
  background:radial-gradient(circle, rgba(114,140,171,.14), transparent 68%);
  animation:hqPulse 4.8s ease-in-out infinite;
}

html body .before-after{
  position:relative;overflow:hidden;
  background:
    radial-gradient(circle at 82% 18%, rgba(114,140,171,.10), transparent 26rem),
    radial-gradient(circle at 12% 78%, rgba(212,171,92,.10), transparent 26rem),
    linear-gradient(180deg, #f9f7f2 0%, #f4f0e8 100%);
}
html body .before-after::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.42;
  background:linear-gradient(90deg, transparent 0 7%, rgba(255,255,255,.35) 7% 8%, transparent 8% 92%, rgba(255,255,255,.35) 92% 93%, transparent 93% 100%);
}
html body .before-after-shell{
  align-items:center;
  grid-template-columns:minmax(320px,.9fr) minmax(560px,1.1fr)!important;
  gap:clamp(30px,5vw,74px)!important;
}
html body .before-after-copy h2{
  font-size:clamp(44px,5.4vw,80px)!important;
  line-height:1.03!important;
  margin:0 0 16px!important;
}
html body .before-after-copy > p{font-size:18px!important;line-height:2!important;max-width:34ch}
html body .ba-notes{gap:14px!important;margin-top:14px!important}
html body .ba-note{
  position:relative;overflow:hidden;
  padding:20px 22px!important;
  border-radius:22px!important;
  background:rgba(255,255,255,.74)!important;
  border:1px solid rgba(212,171,92,.14)!important;
  box-shadow:0 14px 32px rgba(16,12,7,.05)!important;
}
html body .ba-note::before{
  content:"";position:absolute;inset:auto auto 0 0;height:4px;width:100%;
  background:linear-gradient(90deg, rgba(212,171,92,.45), rgba(114,140,171,.35));
}
html body .ba-note.is-after::before{background:linear-gradient(90deg, rgba(114,140,171,.5), rgba(212,171,92,.26))}
html body .ba-note strong{font-size:22px!important}
html body .comparison-card{
  position:relative;overflow:hidden;
  padding:18px 18px 16px!important;
  border-radius:34px!important;
  background:rgba(255,255,255,.76)!important;
  border:1px solid rgba(212,171,92,.14)!important;
  box-shadow:0 28px 70px rgba(18,14,9,.08)!important;
}
html body .comparison-card::before,
html body .comparison-card::after{display:none!important}
html body .comparison-head{margin-bottom:14px!important;gap:10px!important}
html body .comparison-head strong{font-size:13px!important;color:#8f846f!important}
html body .comparison-chip-stack{gap:8px!important}
html body .comparison-chip{
  padding:9px 14px!important;
  border-radius:999px!important;
  background:linear-gradient(180deg,#ffffff,#f6f1e8)!important;
  border:1px solid rgba(212,171,92,.14)!important;
  color:#a37b42!important;
  font-size:11px!important;
}
html body .comparison-meter{display:none!important}
html body .comparison{
  min-height:620px!important;
  aspect-ratio:unset!important;
  border-radius:28px!important;
  background:#ebe4d9!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.48)!important;
}
html body .comparison::before{display:none!important}
html body .comparison::after{
  content:""!important;position:absolute!important;inset:18px!important;border-radius:22px!important;
  border:1px solid rgba(255,255,255,.36)!important;pointer-events:none!important;z-index:3!important;
}
html body .comparison-layer{inset:0!important}
html body .comparison-layer img{
  width:100%!important;height:100%!important;object-fit:cover!important;display:block!important;
}
html body .comparison-before{
  width:50%;overflow:hidden!important;clip-path:none!important;
  border-inline-end:1px solid rgba(255,255,255,.52)!important;
}
html body .comparison-before img{
  filter:grayscale(1) contrast(.92) brightness(.84) saturate(.18)!important;
  transform:scale(1.012)!important;
}
html body .comparison-before::before{
  content:""!important;position:absolute!important;inset:0!important;pointer-events:none!important;z-index:1!important;
  background:
    linear-gradient(180deg, rgba(36,31,25,.12), rgba(60,52,42,.16)),
    linear-gradient(90deg, rgba(244,236,226,.14) 0 1px, transparent 1px 76px),
    linear-gradient(180deg, rgba(244,236,226,.08) 0 1px, transparent 1px 76px)!important;
  background-size:auto, 76px 76px, 76px 76px!important;
}
html body .comparison-before::after{display:none!important}
html body .comparison-after::before{
  content:""!important;position:absolute!important;inset:0!important;pointer-events:none!important;z-index:1!important;
  background:
    radial-gradient(circle at 78% 22%, rgba(255,255,255,.36), transparent 18%),
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.08))!important;
}
html body .comparison-layer > span{
  top:18px!important;bottom:auto!important;padding:9px 14px!important;border-radius:999px!important;
  background:rgba(255,255,255,.78)!important;border:1px solid rgba(255,255,255,.3)!important;
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  color:#6f6457!important;z-index:2!important;
}
html body .comparison-before > span{inset-inline-start:18px!important}
html body .comparison-after > span{inset-inline-end:18px!important}
html body .comparison-divider{
  width:3px!important;top:18px!important;bottom:18px!important;
  background:linear-gradient(180deg, rgba(255,255,255,0), rgba(255,255,255,.96), rgba(255,255,255,0))!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.15)!important;
}
html body .comparison-divider i{
  width:58px!important;height:58px!important;border-radius:22px!important;
  border:1px solid rgba(212,171,92,.14)!important;
  background:linear-gradient(180deg, #ffffff 0%, #f7f1e7 100%)!important;
  color:#88612f!important;
  box-shadow:0 18px 34px rgba(16,12,7,.12)!important;
  animation:handleFloat 3.4s ease-in-out infinite!important;
}
html body .comparison-foot{gap:12px!important;margin-top:14px!important}
html body .comparison-foot article{
  border-radius:18px!important;padding:16px 16px 14px!important;
  background:linear-gradient(180deg,#fff,#f8f4ed)!important;
  border:1px solid rgba(212,171,92,.12)!important;
  box-shadow:none!important;
}
html body .comparison-foot article strong{font-size:22px!important}
html body .comparison-foot article small{font-size:11px!important;color:#b58a50!important}
html body .comparison-range{opacity:0!important;cursor:ew-resize!important}

@keyframes locationFloatWarm{50%{transform:translateY(-10px) scale(1.05);opacity:.9}}
@keyframes locationFloatCool{50%{transform:translateY(-12px) scale(1.06);opacity:.96}}
@keyframes pinBounceSoft{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@keyframes hqPulse{0%,100%{transform:scale(.92);opacity:.65}50%{transform:scale(1.08);opacity:.92}}
@keyframes hqSweep{0%{transform:translateX(70px);opacity:0}20%{opacity:1}50%{transform:translateX(-60px);opacity:.8}100%{transform:translateX(-120px);opacity:0}}
@keyframes handleFloat{0%,100%{transform:translate(-50%,-50%)}50%{transform:translate(-50%,-54%)}}

@media (max-width:1120px){
  html body .locations-shell,
  html body .before-after-shell{grid-template-columns:1fr!important;gap:32px!important}
  html body .location-cards{grid-template-columns:1fr 1fr!important}
  html body .location-card.is-primary{grid-column:1/-1;min-height:320px!important}
  html body .location-card:nth-of-type(2),
  html body .location-card:nth-of-type(3){margin-top:0!important}
}
@media (max-width:740px){
  html body .location-cards{grid-template-columns:1fr!important;gap:16px!important}
  html body .location-card,
  html body .location-card.is-primary{min-height:240px!important;padding:22px 18px 20px!important}
  html body .location-card-copy small{margin-top:62px!important}
  html body .location-card-copy strong{font-size:clamp(28px,8vw,36px)!important}
  html body .comparison{min-height:430px!important}
  html body .comparison-divider i{width:52px!important;height:52px!important}
}
@media (prefers-reduced-motion:reduce){
  html body .location-card::before,
  html body .location-card .location-pin,
  html body .location-card.is-primary .location-card-wave::before,
  html body .location-card.is-primary .location-card-wave::after,
  html body .comparison-divider i{animation:none!important}
}


/* ===== V64.1 cleanup: remove Syria and before/after ===== */
html body .location-cards.is-duo{grid-template-columns:minmax(320px,1.18fr) minmax(260px,.92fr)!important;max-width:860px!important;margin-inline:auto!important}
html body .location-cards.is-duo .location-card:nth-of-type(2){margin-top:48px!important}
@media (max-width:1120px){html body .location-cards.is-duo{grid-template-columns:1fr 1fr!important}html body .location-cards.is-duo .location-card:nth-of-type(2){margin-top:0!important}}
@media (max-width:740px){html body .location-cards.is-duo{grid-template-columns:1fr!important}}


/* ===== V64.2 locations redesign: remove green, refresh copy, new animation ===== */
html body .locations{position:relative;isolation:isolate;overflow:hidden}
html body .locations::before,html body .locations::after{content:"";position:absolute;border-radius:50%;pointer-events:none;z-index:0;filter:blur(8px)}
html body .locations::before{width:420px;height:420px;inset:40px auto auto -120px;background:radial-gradient(circle,rgba(205,165,109,.14),transparent 68%);animation:locBackdropFloat 16s ease-in-out infinite}
html body .locations::after{width:360px;height:360px;inset:auto -80px 30px auto;background:radial-gradient(circle,rgba(214,194,166,.16),transparent 70%);animation:locBackdropFloatAlt 18s ease-in-out infinite}
html body .locations-shell{position:relative;z-index:1;display:grid!important;grid-template-columns:minmax(340px,.9fr) minmax(520px,1.1fr)!important;gap:clamp(28px,4vw,64px)!important;align-items:center!important}
html body .locations-intro{padding:10px 0!important}
html body .locations-intro h2{max-width:12ch!important;font-size:clamp(38px,4.35vw,66px)!important;line-height:1.08!important;letter-spacing:-.02em}
html body .locations-intro > p:last-of-type{max-width:56ch!important;font-size:18px!important;line-height:2!important;color:color-mix(in srgb,var(--text) 62%,var(--muted))!important}
html body .locations-points{display:grid!important;gap:14px!important;margin-top:26px!important}
html body .locations-points article{display:grid!important;grid-template-columns:46px 1fr!important;align-items:center!important;gap:16px!important;padding:16px 18px!important;border-radius:22px!important;border:1px solid rgba(202,169,119,.16)!important;background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(249,244,236,.94))!important;box-shadow:0 14px 38px rgba(50,36,18,.045)!important;overflow:hidden;position:relative}
html body .locations-points article::after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,.18),transparent 54%);pointer-events:none}
html body .locations-points article span{width:46px!important;height:46px!important;display:grid!important;place-items:center!important;border-radius:16px!important;background:linear-gradient(180deg,#f3e6d4,#ead3b2)!important;color:#9a6b39!important;border:1px solid rgba(193,150,89,.22)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.75)!important;font:800 12px/1 var(--font-en)!important}
html body .locations-points article p{margin:0!important;color:var(--muted)!important;line-height:1.9!important}
html body .location-cards.is-duo{position:relative;display:grid!important;grid-template-columns:minmax(300px,1.08fr) minmax(240px,.92fr)!important;grid-template-areas:"riyadh uae"!important;gap:22px!important;align-items:end!important;max-width:860px!important;margin-inline:auto!important}
html body .location-cards.is-duo::before,html body .location-cards.is-duo::after{display:none!important}
html body .location-cards.is-duo .location-card{position:relative!important;overflow:hidden!important;min-height:336px!important;padding:28px 26px 24px!important;border-radius:32px!important;border:1px solid rgba(193,150,89,.18)!important;background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(248,243,235,.96))!important;box-shadow:0 20px 56px rgba(45,33,17,.06), inset 0 1px 0 rgba(255,255,255,.82)!important;transition:transform .48s cubic-bezier(.22,1,.36,1),box-shadow .48s ease,border-color .32s ease!important;animation:locCardFloatSecondary 9s ease-in-out infinite}
html body .location-cards.is-duo .location-card:hover{transform:translateY(-8px)!important;box-shadow:0 28px 70px rgba(45,33,17,.11)!important;border-color:rgba(193,150,89,.32)!important}
html body .location-cards.is-duo .location-card::before{content:""!important;position:absolute!important;inset:-12% auto auto -6%!important;width:210px!important;height:210px!important;border-radius:50%!important;background:radial-gradient(circle,rgba(255,255,255,.9),rgba(255,255,255,0) 70%)!important;opacity:.72!important;animation:locOrbDrift 12s ease-in-out infinite!important}
html body .location-cards.is-duo .location-card::after{content:""!important;position:absolute!important;inset:-10% auto -10% -140%!important;width:55%!important;background:linear-gradient(115deg,transparent 12%,rgba(255,255,255,.02) 26%,rgba(255,255,255,.62) 48%,rgba(255,255,255,.02) 68%,transparent 84%)!important;transform:skewX(-18deg)!important;opacity:.7!important;pointer-events:none!important;animation:locShimmer 7.8s ease-in-out infinite!important}
html body .location-cards.is-duo .location-card:nth-child(2)::after{animation-delay:1.3s!important}
html body .location-cards.is-duo .location-card.is-primary{grid-area:riyadh!important;min-height:388px!important;transform:translateY(-12px)!important;border-color:rgba(189,146,86,.32)!important;background:linear-gradient(180deg,#fffdfa 0%,#f6ebdc 100%)!important;box-shadow:0 30px 84px rgba(87,62,31,.14)!important;animation:locCardFloatPrimary 8.5s ease-in-out infinite!important}
html body .location-cards.is-duo .location-card:not(.is-primary){grid-area:uae!important;min-height:344px!important;margin-top:36px!important;background:linear-gradient(180deg,#fffdfb 0%,#f7f0e7 100%)!important}
html body .location-cards.is-duo .location-card.is-spotlight{border-color:rgba(189,146,86,.4)!important;box-shadow:0 34px 92px rgba(87,62,31,.16)!important}
html body .location-cards.is-duo .location-card.is-primary.is-spotlight{transform:translateY(-18px) scale(1.015)!important}
html body .location-cards.is-duo .location-card:not(.is-primary).is-spotlight{transform:translateY(-10px) scale(1.012)!important;margin-top:26px!important}
html body .location-card .location-pin{position:absolute!important;top:22px!important;inset-inline-start:22px!important;width:52px!important;height:52px!important;display:grid!important;place-items:center!important;border-radius:18px!important;border:1px solid rgba(193,150,89,.24)!important;background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(247,239,225,.92))!important;box-shadow:0 14px 30px rgba(60,43,18,.08)!important;overflow:hidden!important;z-index:3!important}
html body .location-card .location-pin::before{content:"";position:absolute;inset:auto auto -8px -8px;width:28px;height:28px;border-radius:50%;background:rgba(205,165,109,.14)}
html body .location-card .location-pin i{position:relative;width:18px;height:18px;border:2px solid #b57f47;border-radius:50% 50% 50% 0;transform:rotate(-45deg);animation:locPinBounce 3.2s ease-in-out infinite}
html body .location-card .location-pin i::after{content:"";position:absolute;inset:4px;border-radius:50%;background:#c6945b}
html body .location-card > .location-num{position:absolute!important;top:20px!important;inset-inline-end:22px!important;inset-inline-start:auto!important;width:44px!important;height:44px!important;display:grid!important;place-items:center!important;border-radius:14px!important;border:1px solid rgba(193,150,89,.18)!important;background:rgba(255,255,255,.76)!important;color:#a56f38!important;font:800 12px/1 var(--font-en)!important;box-shadow:0 10px 24px rgba(60,43,18,.06)!important;z-index:3!important}
html body .location-card-copy{position:relative!important;z-index:2!important;display:grid!important;gap:10px!important;margin-top:38px!important;max-width:100%!important}
html body .location-card-copy small{font-size:12px!important;font-weight:800!important;letter-spacing:.04em!important;color:#b3824d!important;position:relative!important;z-index:2!important}
html body .location-card-copy strong{display:block!important;margin-top:40px!important;font-size:clamp(30px,2.6vw,44px)!important;line-height:1.18!important;color:#2c2118!important;max-width:8ch!important;position:relative!important;z-index:2!important;text-wrap:balance}
html body .location-card:not(.is-primary) .location-card-copy strong{font-size:clamp(26px,2.2vw,36px)!important;max-width:10ch!important}
html body .location-card-copy em{font-style:normal!important;font-size:13px!important;line-height:1.75!important;color:#7a6b5c!important;display:inline-flex!important;align-items:center!important;gap:8px!important}
html body .location-card-copy em::before{content:""!important;width:30px!important;height:1px!important;background:rgba(193,150,89,.32)!important;display:inline-block!important}
html body .location-card.is-primary .location-card-copy strong{color:#312215!important}
html body .location-card.is-primary .location-card-copy em{color:#7a5f3f!important}
html body .location-card .location-card-meta{position:relative!important;z-index:2!important;display:flex!important;flex-wrap:wrap!important;gap:10px!important;margin-top:auto!important;padding-top:10px!important}
html body .location-card .location-card-meta span{display:inline-flex!important;align-items:center!important;gap:8px!important;padding:10px 14px!important;border-radius:999px!important;border:1px solid rgba(193,150,89,.16)!important;background:rgba(255,255,255,.72)!important;color:#73624e!important;font-size:12px!important;font-weight:700!important;box-shadow:0 8px 20px rgba(54,39,17,.05)!important}
html body .location-card .location-card-meta span::before{content:"";width:7px;height:7px;border-radius:50%;background:linear-gradient(180deg,#cda56d,#a56f38)}
html body .location-card.is-riyadh .location-card-wave{position:absolute!important;inset:auto -24px -34px auto!important;width:220px!important;height:170px!important;border-radius:54% 46% 0 0 / 62% 62% 0 0!important;background:linear-gradient(180deg,rgba(219,194,158,.5),rgba(219,194,158,0));opacity:.62!important;animation:locWaveBreath 8s ease-in-out infinite!important;z-index:1!important}
html body .location-card.is-riyadh .location-card-wave::before,html body .location-card.is-riyadh .location-card-wave::after{content:"";position:absolute;border-radius:inherit;border:1px solid rgba(193,150,89,.24)}
html body .location-card.is-riyadh .location-card-wave::before{inset:18px}
html body .location-card.is-riyadh .location-card-wave::after{inset:38px}
html body .location-card.is-riyadh .ksa-mark{display:none!important}
@keyframes locBackdropFloat{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(26px,-14px,0)}}
@keyframes locBackdropFloatAlt{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(-22px,16px,0)}}
@keyframes locCardFloatPrimary{0%,100%{transform:translateY(-12px)}50%{transform:translateY(-18px)}}
@keyframes locCardFloatSecondary{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes locOrbDrift{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(18px,12px,0) scale(1.06)}}
@keyframes locShimmer{0%,12%{inset-inline-start:-140%;opacity:0}22%{opacity:.78}54%{opacity:.55}70%,100%{inset-inline-start:125%;opacity:0}}
@keyframes locPinBounce{0%,100%{transform:rotate(-45deg) translateY(0)}50%{transform:rotate(-45deg) translateY(-3px)}}
@keyframes locWaveBreath{0%,100%{transform:translateY(0) scale(1);opacity:.5}50%{transform:translateY(-6px) scale(1.03);opacity:.74}}
@media (max-width:1080px){html body .locations-shell{grid-template-columns:1fr!important}html body .locations-intro{order:1!important}html body .location-cards.is-duo{order:2!important;max-width:none!important}html body .locations-intro h2{max-width:none!important}}
@media (max-width:760px){html body .location-cards.is-duo{grid-template-columns:1fr!important;grid-template-areas:"riyadh" "uae"!important;gap:16px!important}html body .location-cards.is-duo .location-card.is-primary,html body .location-cards.is-duo .location-card:not(.is-primary),html body .location-cards.is-duo .location-card.is-primary.is-spotlight,html body .location-cards.is-duo .location-card:not(.is-primary).is-spotlight{min-height:280px!important;margin-top:0!important;transform:none!important}html body .location-card-copy strong,html body .location-card:not(.is-primary) .location-card-copy strong{font-size:clamp(28px,8vw,36px)!important;max-width:none!important}}
@media (prefers-reduced-motion:reduce){html body .locations::before,html body .locations::after,html body .location-cards.is-duo .location-card,html body .location-cards.is-duo .location-card::before,html body .location-cards.is-duo .location-card::after,html body .location-card .location-pin i,html body .location-card.is-riyadh .location-card-wave{animation:none!important;transition:none!important}}


/* ===== V65 journey redesign: warmer palette, cleaner cards, calmer motion ===== */
html body .journey{
  --j-accent:#bc7e52;
  --j-accent-strong:#d8a57c;
  --j-accent-soft:rgba(188,126,82,.12);
  --j-secondary:#64788f;
  --j-secondary-soft:rgba(100,120,143,.14);
  --j-card:#fffdf9;
  --j-ink:#1f2329;
  --j-line:rgba(188,126,82,.18);
  --j-rail:#e9dacb;
  position:relative!important;
  overflow:hidden!important;
  border-block:1px solid var(--line)!important;
  background:
    radial-gradient(circle at 12% 18%, rgba(188,126,82,.10), transparent 22rem),
    radial-gradient(circle at 88% 10%, rgba(100,120,143,.09), transparent 24rem),
    linear-gradient(180deg, color-mix(in srgb,var(--bg-soft) 94%, #fff), color-mix(in srgb,var(--bg) 98%, #fff))!important;
}
html body .journey::before{
  content:""!important;
  position:absolute!important;
  inset-inline:6%!important;
  top:78px!important;
  height:170px!important;
  border-radius:40px!important;
  background:linear-gradient(180deg, rgba(255,255,255,.45), rgba(255,255,255,0))!important;
  border:1px solid rgba(255,255,255,.22)!important;
  pointer-events:none!important;
  opacity:.75!important;
}
html body .journey::after{
  content:""!important;
  position:absolute!important;
  inset-inline-end:-80px!important;
  bottom:-90px!important;
  width:300px!important;
  height:300px!important;
  border-radius:50%!important;
  background:radial-gradient(circle, rgba(100,120,143,.10), transparent 70%)!important;
  filter:blur(8px)!important;
  pointer-events:none!important;
}
html body .journey .journey-heading{
  display:grid!important;
  grid-template-columns:minmax(0,1.25fr) minmax(250px,.75fr)!important;
  gap:28px!important;
  align-items:end!important;
  margin-bottom:30px!important;
}
html body .journey .journey-heading h2{
  margin-bottom:0!important;
  line-height:1.05!important;
}
html body .journey .journey-heading > p{
  margin:0!important;
  max-width:440px!important;
  justify-self:start!important;
  color:var(--muted)!important;
  line-height:2!important;
}
html body .journey .journey-track{
  position:relative!important;
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:24px!important;
  padding:92px 6px 8px!important;
  list-style:none!important;
  counter-reset:journeyStep!important;
  isolation:isolate!important;
}
html body .journey .journey-track::before{
  content:""!important;
  position:absolute!important;
  top:40px!important;
  inset-inline:9% 9%!important;
  height:16px!important;
  border-radius:999px!important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.75), rgba(255,255,255,.28)),
    repeating-linear-gradient(90deg, transparent 0 26px, rgba(188,126,82,.12) 26px 28px)!important;
  border:1px solid rgba(188,126,82,.18)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.75), 0 14px 34px rgba(41,33,24,.06)!important;
}
html body .journey .journey-track::after{
  content:""!important;
  position:absolute!important;
  top:34px!important;
  inset-inline-start:10%!important;
  width:48px!important;
  height:28px!important;
  border-radius:999px!important;
  background:linear-gradient(90deg, var(--j-secondary), var(--j-accent) 72%)!important;
  box-shadow:0 10px 32px rgba(100,120,143,.22), 0 0 0 10px rgba(188,126,82,.07)!important;
  border:1px solid rgba(255,255,255,.35)!important;
  animation:journeyRibbonRun 8s cubic-bezier(.55,.08,.2,.98) infinite!important;
  z-index:2!important;
}
html body .journey .journey-step{
  position:relative!important;
  padding:0!important;
  transition:transform .35s ease!important;
}
html body .journey .journey-step::before{
  content:""!important;
  position:absolute!important;
  inset-inline:14px 14px!important;
  bottom:-16px!important;
  height:46px!important;
  border-radius:50%!important;
  background:radial-gradient(circle, rgba(31,35,41,.10), rgba(31,35,41,0) 72%)!important;
  filter:blur(12px)!important;
  opacity:.45!important;
  pointer-events:none!important;
}
html body .journey .journey-step:nth-child(1){--card-offset:0px}
html body .journey .journey-step:nth-child(2){--card-offset:18px}
html body .journey .journey-step:nth-child(3){--card-offset:4px}
html body .journey .journey-step:nth-child(4){--card-offset:22px}
html body .journey .journey-step:nth-child(5){--card-offset:10px}
html body .journey .journey-step .journey-num{
  position:absolute!important;
  top:-28px!important;
  inset-inline-start:22px!important;
  width:62px!important;
  height:62px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:22px!important;
  background:linear-gradient(180deg, #fff, #f5efe8)!important;
  border:1px solid rgba(188,126,82,.28)!important;
  color:var(--j-accent)!important;
  box-shadow:0 12px 28px rgba(60,44,26,.08)!important;
  font:800 17px/1 var(--font-en)!important;
  letter-spacing:.04em!important;
  z-index:2!important;
  transition:transform .35s ease, box-shadow .35s ease, background .35s ease, color .35s ease!important;
}
html body .journey .journey-step .journey-num::after{
  content:""!important;
  position:absolute!important;
  inset:8px!important;
  border-radius:16px!important;
  border:1px solid rgba(188,126,82,.14)!important;
}
html body .journey .journey-step > div{
  position:relative!important;
  min-height:248px!important;
  height:100%!important;
  padding:34px 24px 24px!important;
  border-radius:30px!important;
  border:1px solid rgba(188,126,82,.16)!important;
  background:
    linear-gradient(145deg, rgba(255,255,255,.96), rgba(250,246,240,.96) 60%, rgba(244,240,235,.92)),
    linear-gradient(180deg, rgba(188,126,82,.04), rgba(100,120,143,.02))!important;
  box-shadow:0 22px 50px rgba(28,24,19,.06)!important;
  overflow:hidden!important;
  transform:translateY(var(--card-offset))!important;
  transition:transform .4s ease, border-color .35s ease, box-shadow .35s ease, background .35s ease!important;
}
html body .journey .journey-step > div::before{
  content:""!important;
  position:absolute!important;
  inset:0 0 auto 0!important;
  height:5px!important;
  background:linear-gradient(90deg, var(--j-secondary), var(--j-accent) 74%)!important;
  opacity:.92!important;
}
html body .journey .journey-step > div::after{
  content:""!important;
  position:absolute!important;
  inset-inline-end:-20px!important;
  top:-26px!important;
  width:120px!important;
  height:120px!important;
  border-radius:32px!important;
  border:1px solid rgba(188,126,82,.10)!important;
  background:radial-gradient(circle at center, rgba(188,126,82,.10), transparent 68%)!important;
  transform:rotate(18deg)!important;
  opacity:.8!important;
}
html body .journey .journey-step h3{
  margin:28px 0 12px!important;
  font-size:22px!important;
  line-height:1.35!important;
  color:var(--j-ink)!important;
}
html body .journey .journey-step p{
  margin:0!important;
  font-size:14px!important;
  line-height:2!important;
  color:var(--muted)!important;
}
html body .journey .journey-step:hover > div{
  transform:translateY(calc(var(--card-offset) - 8px))!important;
  border-color:rgba(188,126,82,.28)!important;
  box-shadow:0 28px 56px rgba(28,24,19,.09)!important;
}
html body .journey .journey-step.is-active > div{
  transform:translateY(calc(var(--card-offset) - 14px))!important;
  background:
    linear-gradient(145deg, rgba(255,255,255,.99), rgba(250,245,238,.99) 54%, rgba(239,241,245,.96)),
    linear-gradient(180deg, rgba(188,126,82,.05), rgba(100,120,143,.05))!important;
  border-color:rgba(100,120,143,.26)!important;
  box-shadow:0 32px 68px rgba(28,24,19,.11), 0 0 0 1px rgba(100,120,143,.05)!important;
  animation:journeyCardFloat 3.2s ease-in-out infinite!important;
}
html body .journey .journey-step.is-active > div::before{
  background:linear-gradient(90deg, var(--j-accent), var(--j-secondary))!important;
}
html body .journey .journey-step.is-active .journey-num{
  transform:translateY(-8px)!important;
  background:linear-gradient(180deg, var(--j-accent), var(--j-accent-strong))!important;
  color:#fff!important;
  border-color:rgba(188,126,82,.62)!important;
  box-shadow:0 0 0 12px rgba(188,126,82,.08), 0 18px 40px rgba(188,126,82,.18)!important;
}
html body .journey .journey-step.is-active h3{
  color:var(--j-accent)!important;
}
html body .journey .journey-step.is-complete .journey-num{
  background:linear-gradient(180deg, #fff, #eef2f7)!important;
  color:var(--j-secondary)!important;
  border-color:rgba(100,120,143,.26)!important;
}
html body .journey .journey-step.is-complete > div{
  border-color:rgba(100,120,143,.18)!important;
}
@keyframes journeyRibbonRun{
  0%{inset-inline-start:10%;opacity:0}
  7%{opacity:1}
  50%{opacity:1}
  93%{opacity:1}
  100%{inset-inline-start:88%;opacity:.16}
}
@keyframes journeyCardFloat{
  0%,100%{transform:translateY(calc(var(--card-offset) - 14px))}
  50%{transform:translateY(calc(var(--card-offset) - 22px))}
}
html[data-theme="dark"] body .journey,
html[data-theme="purple"] body .journey{
  --j-accent:#d0a26f;
  --j-accent-strong:#e4bf96;
  --j-secondary:#8da3be;
  --j-card:#181614;
  --j-ink:#f7f3ed;
  background:
    radial-gradient(circle at 12% 18%, rgba(208,162,111,.11), transparent 22rem),
    radial-gradient(circle at 88% 10%, rgba(141,163,190,.10), transparent 24rem),
    linear-gradient(180deg, color-mix(in srgb,var(--bg-soft) 96%, #161311), color-mix(in srgb,var(--bg) 98%, #12100e))!important;
}
html[data-theme="dark"] body .journey::before,
html[data-theme="purple"] body .journey::before{
  background:linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,0))!important;
  border-color:rgba(255,255,255,.06)!important;
}
html[data-theme="dark"] body .journey .journey-track::before,
html[data-theme="purple"] body .journey .journey-track::before{
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02)),
    repeating-linear-gradient(90deg, transparent 0 26px, rgba(208,162,111,.12) 26px 28px)!important;
  border-color:rgba(208,162,111,.14)!important;
}
html[data-theme="dark"] body .journey .journey-step .journey-num,
html[data-theme="purple"] body .journey .journey-step .journey-num{
  background:linear-gradient(180deg, rgba(26,23,20,.98), rgba(42,35,29,.98))!important;
  color:var(--j-accent)!important;
  border-color:rgba(208,162,111,.24)!important;
  box-shadow:0 12px 28px rgba(0,0,0,.22)!important;
}
html[data-theme="dark"] body .journey .journey-step > div,
html[data-theme="purple"] body .journey .journey-step > div{
  background:
    linear-gradient(145deg, rgba(24,21,18,.98), rgba(31,28,24,.98) 65%, rgba(36,33,30,.98)),
    linear-gradient(180deg, rgba(208,162,111,.04), rgba(141,163,190,.05))!important;
  border-color:rgba(208,162,111,.12)!important;
  box-shadow:0 22px 50px rgba(0,0,0,.20)!important;
}
html[data-theme="dark"] body .journey .journey-step h3,
html[data-theme="purple"] body .journey .journey-step h3{color:var(--j-ink)!important}
html[data-theme="dark"] body .journey .journey-step.is-active > div,
html[data-theme="purple"] body .journey .journey-step.is-active > div{
  background:
    linear-gradient(145deg, rgba(28,25,22,.99), rgba(38,32,27,.99) 50%, rgba(30,38,46,.98)),
    linear-gradient(180deg, rgba(208,162,111,.06), rgba(141,163,190,.05))!important;
  border-color:rgba(141,163,190,.24)!important;
}
@media(max-width:980px){
  html body .journey .journey-heading{grid-template-columns:1fr!important;gap:14px!important}
  html body .journey .journey-heading > p{max-width:none!important}
  html body .journey .journey-track{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:22px!important;padding-top:84px!important}
  html body .journey .journey-track::before{inset-inline:6% 6%!important}
  html body .journey .journey-track::after{top:34px!important;width:42px!important;height:24px!important;animation-duration:7.4s!important}
}
@media(max-width:680px){
  html body .journey::before{display:none!important}
  html body .journey .journey-track{grid-template-columns:1fr!important;gap:18px!important;padding-top:20px!important}
  html body .journey .journey-track::before,
  html body .journey .journey-track::after{display:none!important}
  html body .journey .journey-step{--card-offset:0px!important}
  html body .journey .journey-step .journey-num{top:18px!important;inset-inline-start:18px!important;width:56px!important;height:56px!important;border-radius:18px!important;font-size:16px!important}
  html body .journey .journey-step > div{min-height:auto!important;padding:26px 20px 20px 20px!important;transform:none!important}
  html body .journey .journey-step h3{font-size:20px!important;margin-top:56px!important}
  html body .journey .journey-step.is-active > div,
  html body .journey .journey-step:hover > div{transform:none!important}
  html body .journey .journey-step.is-active > div{animation:none!important}
}
@media(prefers-reduced-motion:reduce){
  html body .journey .journey-track::after,
  html body .journey .journey-step,
  html body .journey .journey-step > div,
  html body .journey .journey-step .journey-num{animation:none!important;transition:none!important}
}


/* ===== V66 full creative restyle: journey + locations ===== */
html body .journey,
html body .locations{
  --v66-ink:#221b17;
  --v66-muted:#756a62;
  --v66-accent:#aa7252;
  --v66-accent-strong:#7f4f33;
  --v66-accent-soft:#ead7c7;
  --v66-secondary:#8fa1ad;
  --v66-secondary-soft:#edf2f4;
  --v66-panel:#fffdfa;
  --v66-panel-soft:#f7f1ea;
  --v66-line:rgba(125,92,69,.16);
}

html body .journey{
  position:relative!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 12% 22%, rgba(170,114,82,.10), transparent 22rem),
    radial-gradient(circle at 88% 18%, rgba(143,161,173,.12), transparent 20rem),
    linear-gradient(180deg, #fcf9f5 0%, #f6f1eb 100%)!important;
}
html body .journey::before,
html body .journey::after{
  content:""!important;
  position:absolute!important;
  pointer-events:none!important;
}
html body .journey::before{
  inset:26px auto auto -90px!important;
  width:240px!important;
  height:240px!important;
  border-radius:40px!important;
  border:1px solid rgba(170,114,82,.12)!important;
  transform:rotate(18deg)!important;
  background:linear-gradient(180deg, rgba(255,255,255,.25), rgba(255,255,255,0))!important;
}
html body .journey::after{
  inset:auto -80px 42px auto!important;
  width:280px!important;
  height:280px!important;
  border-radius:50%!important;
  background:radial-gradient(circle, rgba(143,161,173,.10), transparent 65%)!important;
  filter:blur(6px)!important;
}
html body .journey .shell{position:relative!important;z-index:1!important}
html body .journey .journey-heading{
  display:grid!important;
  grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr)!important;
  gap:26px!important;
  align-items:end!important;
  margin-bottom:40px!important;
}
html body .journey .journey-heading > div{max-width:13ch!important}
html body .journey .journey-heading > p{
  margin:0!important;
  color:var(--v66-muted)!important;
  line-height:2!important;
  max-width:470px!important;
}
html body .journey .journey-track{
  position:relative!important;
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:20px!important;
  list-style:none!important;
  padding:92px 6px 10px!important;
  margin:0!important;
  isolation:isolate!important;
}
html body .journey .journey-track::before{
  content:""!important;
  position:absolute!important;
  top:46px!important;
  inset-inline:8% 8%!important;
  height:2px!important;
  border-radius:999px!important;
  background:linear-gradient(90deg, rgba(170,114,82,.15), rgba(170,114,82,.55) 24%, rgba(143,161,173,.65) 52%, rgba(170,114,82,.55) 76%, rgba(170,114,82,.15))!important;
  box-shadow:0 0 0 8px rgba(255,255,255,.32)!important;
}
html body .journey .journey-track::after{
  content:""!important;
  position:absolute!important;
  top:46px!important;
  inset-inline-start:8%!important;
  width:28px!important;
  height:28px!important;
  border-radius:10px!important;
  transform:translate(-50%,-50%) rotate(45deg)!important;
  background:linear-gradient(135deg, var(--v66-accent), #d49a73 55%, var(--v66-secondary))!important;
  box-shadow:0 0 0 10px rgba(170,114,82,.08), 0 16px 38px rgba(68,52,39,.18)!important;
  animation:v66JourneyGlide 7.8s cubic-bezier(.55,.1,.18,.98) infinite!important;
  z-index:2!important;
}
html body .journey .journey-step{
  position:relative!important;
  padding:0!important;
}
html body .journey .journey-step:nth-child(1){--v66-step-offset:18px}
html body .journey .journey-step:nth-child(2){--v66-step-offset:34px}
html body .journey .journey-step:nth-child(3){--v66-step-offset:8px}
html body .journey .journey-step:nth-child(4){--v66-step-offset:28px}
html body .journey .journey-step:nth-child(5){--v66-step-offset:14px}
html body .journey .journey-step .journey-num{
  position:absolute!important;
  top:-24px!important;
  inset-inline-start:22px!important;
  width:58px!important;
  height:58px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:20px!important;
  background:linear-gradient(180deg, #fff, #f4ebe3)!important;
  border:1px solid rgba(170,114,82,.24)!important;
  color:var(--v66-accent-strong)!important;
  font:800 17px/1 var(--font-en)!important;
  box-shadow:0 16px 30px rgba(63,45,31,.08)!important;
  z-index:3!important;
  transition:transform .35s ease, box-shadow .35s ease, background .35s ease!important;
}
html body .journey .journey-step > div{
  position:relative!important;
  min-height:236px!important;
  height:100%!important;
  padding:30px 22px 22px!important;
  border-radius:30px!important;
  border:1px solid var(--v66-line)!important;
  background:
    linear-gradient(165deg, rgba(255,255,255,.97), rgba(250,245,239,.96) 58%, rgba(244,238,231,.96)),
    linear-gradient(180deg, rgba(170,114,82,.04), rgba(143,161,173,.04))!important;
  box-shadow:0 24px 50px rgba(40,29,20,.06)!important;
  transform:translateY(var(--v66-step-offset))!important;
  overflow:hidden!important;
  transition:transform .42s ease, box-shadow .42s ease, border-color .35s ease, background .35s ease!important;
}
html body .journey .journey-step > div::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  background:
    linear-gradient(135deg, rgba(170,114,82,.10), transparent 34%),
    radial-gradient(circle at 85% 18%, rgba(143,161,173,.14), transparent 23%)!important;
  opacity:.85!important;
}
html body .journey .journey-step > div::after{
  position:absolute!important;
  inset:18px 18px auto auto!important;
  width:52px!important;
  height:52px!important;
  border-radius:18px!important;
  display:grid!important;
  place-items:center!important;
  border:1px solid rgba(170,114,82,.14)!important;
  background:linear-gradient(180deg, rgba(255,255,255,.9), rgba(245,237,228,.9))!important;
  color:var(--v66-accent)!important;
  font-size:18px!important;
  font-weight:800!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.75)!important;
}
html body .journey .journey-step:nth-child(1) > div::after{content:"⌂"!important}
html body .journey .journey-step:nth-child(2) > div::after{content:"✦"!important}
html body .journey .journey-step:nth-child(3) > div::after{content:"▣"!important}
html body .journey .journey-step:nth-child(4) > div::after{content:"↺"!important}
html body .journey .journey-step:nth-child(5) > div::after{content:"✓"!important}
html body .journey .journey-step h3{
  position:relative!important;
  z-index:1!important;
  margin:32px 0 12px!important;
  font-size:22px!important;
  line-height:1.4!important;
  color:var(--v66-ink)!important;
  padding-inline-end:42px!important;
}
html body .journey .journey-step p{
  position:relative!important;
  z-index:1!important;
  margin:0!important;
  color:var(--v66-muted)!important;
  font-size:14px!important;
  line-height:2!important;
}
html body .journey .journey-step:hover > div{
  transform:translateY(calc(var(--v66-step-offset) - 10px))!important;
  box-shadow:0 32px 58px rgba(40,29,20,.10)!important;
}
html body .journey .journey-step.is-active > div{
  transform:translateY(calc(var(--v66-step-offset) - 16px))!important;
  border-color:rgba(170,114,82,.28)!important;
  background:
    linear-gradient(165deg, rgba(255,255,255,.99), rgba(250,244,237,.98) 58%, rgba(239,239,242,.98)),
    linear-gradient(180deg, rgba(170,114,82,.05), rgba(143,161,173,.06))!important;
  box-shadow:0 36px 70px rgba(40,29,20,.12), 0 0 0 1px rgba(170,114,82,.05)!important;
  animation:v66JourneyCardFloat 3.6s ease-in-out infinite!important;
}
html body .journey .journey-step.is-active .journey-num{
  transform:translateY(-8px)!important;
  background:linear-gradient(180deg, var(--v66-accent), var(--v66-accent-strong))!important;
  color:#fff!important;
  box-shadow:0 0 0 10px rgba(170,114,82,.08), 0 18px 36px rgba(170,114,82,.20)!important;
}
html body .journey .journey-step.is-active h3{color:var(--v66-accent-strong)!important}
html body .journey .journey-step.is-complete .journey-num{
  background:linear-gradient(180deg, #fff, var(--v66-secondary-soft))!important;
  border-color:rgba(143,161,173,.26)!important;
  color:#657988!important;
}
html body .journey .journey-step.is-complete > div{opacity:.98!important}
@keyframes v66JourneyGlide{
  0%{inset-inline-start:8%; opacity:0}
  7%{opacity:1}
  50%{opacity:1}
  94%{opacity:1}
  100%{inset-inline-start:92%; opacity:.22}
}
@keyframes v66JourneyCardFloat{
  0%,100%{transform:translateY(calc(var(--v66-step-offset) - 16px))}
  50%{transform:translateY(calc(var(--v66-step-offset) - 24px))}
}

html body .locations{
  position:relative!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 12% 22%, rgba(143,161,173,.10), transparent 24rem),
    radial-gradient(circle at 88% 82%, rgba(170,114,82,.10), transparent 24rem),
    linear-gradient(180deg, #fffdfa 0%, #f7f1ea 100%)!important;
}
html body .locations::before,
html body .locations::after{
  content:""!important;
  position:absolute!important;
  pointer-events:none!important;
}
html body .locations::before{
  inset:52px auto auto -90px!important;
  width:220px!important;
  height:220px!important;
  border-radius:50%!important;
  background:radial-gradient(circle, rgba(170,114,82,.12), transparent 68%)!important;
  filter:blur(8px)!important;
}
html body .locations::after{
  inset:auto -50px 24px auto!important;
  width:260px!important;
  height:260px!important;
  border-radius:36px!important;
  border:1px solid rgba(143,161,173,.14)!important;
  transform:rotate(18deg)!important;
  background:linear-gradient(180deg, rgba(255,255,255,.24), rgba(255,255,255,0))!important;
}
html body .locations .locations-shell{
  position:relative!important;
  z-index:1!important;
  display:grid!important;
  grid-template-columns:minmax(320px,.95fr) minmax(0,1.05fr)!important;
  gap:36px!important;
  align-items:center!important;
}
html body .locations .locations-intro{padding:16px 4px 16px 0!important}
html body .locations .locations-intro h2{
  max-width:11ch!important;
  color:var(--v66-ink)!important;
}
html body .locations .locations-intro > p:last-of-type{
  margin-top:14px!important;
  color:var(--v66-muted)!important;
  line-height:2!important;
  max-width:54ch!important;
}
html body .locations .locations-points{
  display:grid!important;
  gap:12px!important;
  margin-top:22px!important;
}
html body .locations .locations-points article{
  display:grid!important;
  grid-template-columns:44px 1fr!important;
  gap:14px!important;
  align-items:center!important;
  padding:15px 18px!important;
  border-radius:18px!important;
  border:1px solid rgba(125,92,69,.12)!important;
  background:rgba(255,255,255,.68)!important;
  box-shadow:0 12px 26px rgba(40,29,20,.05)!important;
}
html body .locations .locations-points article span{
  width:44px!important;
  height:44px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:14px!important;
  background:linear-gradient(180deg,#fff,var(--v66-accent-soft))!important;
  border:1px solid rgba(170,114,82,.18)!important;
  color:var(--v66-accent-strong)!important;
  font:800 13px/1 var(--font-en)!important;
}
html body .locations .locations-points article p{margin:0!important;color:var(--v66-muted)!important;line-height:1.9!important}

html body .location-cards{
  position:relative!important;
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:20px!important;
  align-items:end!important;
}
html body .location-cards.is-duo::before{
  content:""!important;
  position:absolute!important;
  inset:18% 14% auto 14%!important;
  height:1px!important;
  background:linear-gradient(90deg, rgba(170,114,82,.16), rgba(143,161,173,.3), rgba(170,114,82,.16))!important;
  pointer-events:none!important;
}
html body .location-card{
  position:relative!important;
  min-height:350px!important;
  padding:24px 24px 24px!important;
  border-radius:34px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:space-between!important;
  gap:18px!important;
  border:1px solid var(--v66-line)!important;
  background:
    linear-gradient(160deg, rgba(255,255,255,.98), rgba(249,243,236,.98) 60%, rgba(241,234,225,.98)),
    linear-gradient(180deg, rgba(170,114,82,.04), rgba(143,161,173,.05))!important;
  box-shadow:0 24px 56px rgba(40,29,20,.08)!important;
  overflow:hidden!important;
  transition:transform .42s ease, box-shadow .42s ease, border-color .35s ease, background .35s ease!important;
}
html body .location-card::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  background:
    radial-gradient(circle at 82% 18%, rgba(143,161,173,.12), transparent 24%),
    linear-gradient(135deg, rgba(170,114,82,.06), transparent 36%)!important;
  pointer-events:none!important;
}
html body .location-card::after{
  content:""!important;
  position:absolute!important;
  inset:auto auto 18px -28px!important;
  width:140px!important;
  height:140px!important;
  border-radius:32px!important;
  border:1px solid rgba(170,114,82,.10)!important;
  transform:rotate(18deg)!important;
  opacity:.55!important;
}
html body .location-card.is-primary{transform:translateY(-12px)!important}
html body .location-card:nth-child(2){transform:translateY(18px)!important}
html body .location-card:hover,
html body .location-card.is-spotlight{
  transform:translateY(-20px) scale(1.02)!important;
  border-color:rgba(170,114,82,.26)!important;
  box-shadow:0 34px 74px rgba(40,29,20,.14), 0 0 0 1px rgba(170,114,82,.06)!important;
}
html body .location-card.is-spotlight{
  background:
    linear-gradient(160deg, rgba(255,255,255,1), rgba(251,244,237,.99) 54%, rgba(238,240,242,.98)),
    linear-gradient(180deg, rgba(170,114,82,.05), rgba(143,161,173,.06))!important;
}
html body .location-card.is-spotlight .location-card-wave{
  opacity:1!important;
  animation:v66LocationSweep 6s linear infinite!important;
}
html body .location-pin{
  position:relative!important;
  width:54px!important;
  height:54px!important;
  border-radius:18px!important;
  display:grid!important;
  place-items:center!important;
  background:linear-gradient(180deg, #fff, #f5ece4)!important;
  border:1px solid rgba(170,114,82,.18)!important;
  box-shadow:0 10px 24px rgba(40,29,20,.07)!important;
}
html body .location-pin i{
  width:20px!important;
  height:20px!important;
  border-radius:50% 50% 50% 0!important;
  border:2px solid var(--v66-accent)!important;
  transform:rotate(-45deg)!important;
  position:relative!important;
  display:block!important;
}
html body .location-pin i::after{
  content:""!important;
  position:absolute!important;
  inset:4px!important;
  border-radius:50%!important;
  background:var(--v66-accent)!important;
}
html body .location-num{
  position:absolute!important;
  top:18px!important;
  inset-inline-start:18px!important;
  width:44px!important;
  height:44px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:14px!important;
  background:linear-gradient(180deg,#fff,var(--v66-secondary-soft))!important;
  color:#697a88!important;
  border:1px solid rgba(143,161,173,.16)!important;
  font:800 13px/1 var(--font-en)!important;
  z-index:2!important;
}
html body .location-card-copy,
html body .location-card-meta{position:relative!important;z-index:1!important}
html body .location-card-copy small{
  display:block!important;
  color:var(--v66-muted)!important;
  font-size:13px!important;
  margin-bottom:12px!important;
}
html body .location-card-copy strong{
  display:block!important;
  color:var(--v66-ink)!important;
  font-size:clamp(28px,2vw,40px)!important;
  line-height:1.28!important;
  letter-spacing:-.02em!important;
}
html body .location-card-copy em{
  display:block!important;
  margin-top:14px!important;
  color:var(--v66-accent-strong)!important;
  font-style:normal!important;
  font-size:14px!important;
}
html body .location-card-meta{
  display:flex!important;
  gap:10px!important;
  flex-wrap:wrap!important;
}
html body .location-card-meta span{
  padding:10px 14px!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.65)!important;
  border:1px solid rgba(125,92,69,.12)!important;
  color:var(--v66-muted)!important;
  font-size:12px!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.75)!important;
}
html body .location-card-wave{
  position:absolute!important;
  inset:auto -30% -30% auto!important;
  width:240px!important;
  height:240px!important;
  border-radius:50%!important;
  background:radial-gradient(circle, rgba(170,114,82,.12), rgba(143,161,173,.08) 36%, transparent 66%)!important;
  opacity:.45!important;
  filter:blur(6px)!important;
  pointer-events:none!important;
}
@keyframes v66LocationSweep{
  0%{transform:translate3d(16px,20px,0) scale(.9);opacity:.22}
  35%{transform:translate3d(-6px,-6px,0) scale(1);opacity:.5}
  70%{transform:translate3d(-18px,-14px,0) scale(1.08);opacity:.36}
  100%{transform:translate3d(10px,18px,0) scale(.94);opacity:.22}
}

@media(max-width:980px){
  html body .journey .journey-heading{grid-template-columns:1fr!important;gap:14px!important}
  html body .journey .journey-heading > div,
  html body .journey .journey-heading > p{max-width:none!important}
  html body .journey .journey-track{grid-template-columns:repeat(2,minmax(0,1fr))!important;padding-top:84px!important}
  html body .journey .journey-track::before{inset-inline:6% 6%!important}
  html body .locations .locations-shell{grid-template-columns:1fr!important;gap:26px!important}
  html body .location-cards{order:2!important}
  html body .locations .locations-intro{order:1!important;padding:0!important}
}
@media(max-width:720px){
  html body .journey .journey-track{grid-template-columns:1fr!important;gap:18px!important;padding-top:20px!important}
  html body .journey .journey-track::before,
  html body .journey .journey-track::after{display:none!important}
  html body .journey .journey-step{--v66-step-offset:0px!important}
  html body .journey .journey-step > div,
  html body .journey .journey-step:hover > div,
  html body .journey .journey-step.is-active > div{transform:none!important;min-height:auto!important;animation:none!important}
  html body .journey .journey-step .journey-num{top:18px!important;inset-inline-start:18px!important;width:54px!important;height:54px!important}
  html body .journey .journey-step h3{margin-top:64px!important;font-size:20px!important;padding-inline-end:0!important}
  html body .location-cards{grid-template-columns:1fr!important;gap:16px!important}
  html body .location-cards.is-duo::before{display:none!important}
  html body .location-card,
  html body .location-card.is-primary,
  html body .location-card:nth-child(2),
  html body .location-card:hover,
  html body .location-card.is-spotlight{transform:none!important;min-height:auto!important}
}
@media(prefers-reduced-motion:reduce){
  html body .journey .journey-track::after,
  html body .journey .journey-step > div,
  html body .journey .journey-step .journey-num,
  html body .location-card,
  html body .location-card-wave{animation:none!important;transition:none!important}
}

/* ===== V67 complete presence redesign ===== */
html body .locations{
  --presence-copper:#b47452;
  --presence-copper-dark:#80513b;
  --presence-slate:#677887;
  --presence-slate-dark:#3e4d59;
  --presence-cream:#fbf7f2;
  --presence-line:rgba(88,69,55,.14);
  position:relative!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 9% 18%, rgba(180,116,82,.11), transparent 24rem),
    radial-gradient(circle at 91% 82%, rgba(103,120,135,.10), transparent 24rem),
    linear-gradient(180deg,#fcfaf7 0%,#f5f0ea 100%)!important;
  border-block:1px solid rgba(88,69,55,.08)!important;
}
html body .locations::before,
html body .locations::after{
  content:""!important;
  position:absolute!important;
  pointer-events:none!important;
  opacity:.7!important;
}
html body .locations::before{
  width:230px!important;height:230px!important;
  inset:60px auto auto -90px!important;
  border-radius:48px!important;
  border:1px solid rgba(180,116,82,.12)!important;
  transform:rotate(18deg)!important;
}
html body .locations::after{
  width:300px!important;height:300px!important;
  inset:auto -90px -80px auto!important;
  border-radius:50%!important;
  background:radial-gradient(circle,rgba(103,120,135,.11),transparent 68%)!important;
  filter:blur(8px)!important;
}
html body .presence-shell{
  position:relative!important;
  z-index:1!important;
  display:grid!important;
  gap:40px!important;
}
html body .presence-heading{
  display:grid!important;
  grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr)!important;
  grid-template-areas:
    "kicker kicker"
    "title text"!important;
  gap:10px 42px!important;
  align-items:end!important;
}
html body .presence-heading .kicker{grid-area:kicker!important;margin:0!important}
html body .presence-heading h2{
  grid-area:title!important;
  margin:0!important;
  max-width:13ch!important;
  font-size:clamp(40px,4.5vw,70px)!important;
  line-height:1.08!important;
  letter-spacing:-.03em!important;
  color:#201a17!important;
}
html body .presence-heading > p:last-child{
  grid-area:text!important;
  margin:0!important;
  max-width:52ch!important;
  color:#766d66!important;
  line-height:2!important;
  font-size:17px!important;
}
html body .presence-stage{
  position:relative!important;
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:26px!important;
  padding:34px!important;
  border-radius:38px!important;
  border:1px solid rgba(88,69,55,.10)!important;
  background:rgba(255,255,255,.52)!important;
  box-shadow:0 30px 80px rgba(49,37,29,.07), inset 0 1px 0 rgba(255,255,255,.74)!important;
  backdrop-filter:blur(10px)!important;
  -webkit-backdrop-filter:blur(10px)!important;
  isolation:isolate!important;
}
html body .presence-stage::before{
  content:""!important;
  position:absolute!important;
  inset:18px!important;
  border-radius:28px!important;
  border:1px solid rgba(255,255,255,.52)!important;
  pointer-events:none!important;
}
html body .presence-route{
  position:absolute!important;
  inset:0!important;
  pointer-events:none!important;
  z-index:4!important;
}
html body .presence-route-line{
  position:absolute!important;
  top:50%!important;
  left:45%!important;
  right:45%!important;
  height:2px!important;
  background:linear-gradient(90deg,rgba(180,116,82,.16),rgba(180,116,82,.66),rgba(103,120,135,.66),rgba(103,120,135,.16))!important;
  box-shadow:0 0 0 7px rgba(255,255,255,.28)!important;
}
html body .presence-route-orb{
  position:absolute!important;
  top:calc(50% - 12px)!important;
  left:50%!important;
  width:24px!important;
  height:24px!important;
  border-radius:50%!important;
  background:linear-gradient(135deg,#d79e7b,var(--presence-copper) 46%,var(--presence-slate) 100%)!important;
  box-shadow:0 0 0 10px rgba(180,116,82,.08),0 12px 28px rgba(64,47,37,.18)!important;
  animation:presenceOrbPulse 3.2s ease-in-out infinite!important;
}
html body .presence-node{
  position:relative!important;
  min-height:310px!important;
  padding:28px!important;
  border-radius:32px!important;
  border:1px solid rgba(88,69,55,.12)!important;
  display:grid!important;
  grid-template-columns:1fr auto!important;
  grid-template-rows:auto 1fr auto!important;
  grid-template-areas:
    "head symbol"
    "copy copy"
    "tags tags"!important;
  gap:20px!important;
  overflow:hidden!important;
  transition:transform .5s cubic-bezier(.22,1,.36,1),box-shadow .45s ease,border-color .35s ease!important;
}
html body .presence-node::before{
  content:""!important;
  position:absolute!important;
  inset:auto auto -65px -45px!important;
  width:220px!important;
  height:220px!important;
  border-radius:50%!important;
  filter:blur(4px)!important;
  transition:transform .6s ease,opacity .45s ease!important;
}
html body .presence-node::after{
  content:""!important;
  position:absolute!important;
  inset:-40% -22% auto auto!important;
  width:210px!important;
  height:210px!important;
  border-radius:56px!important;
  transform:rotate(22deg)!important;
  border:1px solid rgba(255,255,255,.35)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.26),rgba(255,255,255,0))!important;
  pointer-events:none!important;
}
html body .presence-saudi{
  background:
    linear-gradient(160deg,rgba(255,255,255,.98),rgba(248,236,226,.98) 64%,rgba(239,222,208,.98))!important;
  box-shadow:0 24px 58px rgba(98,63,43,.10)!important;
}
html body .presence-saudi::before{
  background:radial-gradient(circle,rgba(180,116,82,.22),rgba(180,116,82,.06) 48%,transparent 70%)!important;
}
html body .presence-uae{
  background:
    linear-gradient(160deg,rgba(255,255,255,.98),rgba(238,243,246,.98) 64%,rgba(223,231,237,.98))!important;
  box-shadow:0 24px 58px rgba(61,76,88,.09)!important;
}
html body .presence-uae::before{
  background:radial-gradient(circle,rgba(103,120,135,.20),rgba(103,120,135,.05) 48%,transparent 70%)!important;
}
html body .presence-node.is-active{
  transform:translateY(-10px) scale(1.012)!important;
  box-shadow:0 34px 78px rgba(56,42,33,.14)!important;
}
html body .presence-saudi.is-active{border-color:rgba(180,116,82,.32)!important}
html body .presence-uae.is-active{border-color:rgba(103,120,135,.32)!important}
html body .presence-node.is-active::before{transform:scale(1.08) translateY(-8px)!important}
html body .presence-node-head{
  grid-area:head!important;
  position:relative!important;
  z-index:2!important;
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
}
html body .presence-index{
  width:44px!important;
  height:44px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:14px!important;
  background:rgba(255,255,255,.72)!important;
  border:1px solid rgba(88,69,55,.11)!important;
  color:#6f625a!important;
  font:800 12px/1 var(--font-en)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8)!important;
}
html body .presence-node-head small{
  color:#7a6d65!important;
  font-size:12px!important;
  font-weight:800!important;
  letter-spacing:.03em!important;
}
html body .presence-symbol{
  grid-area:symbol!important;
  position:relative!important;
  z-index:2!important;
  width:68px!important;
  height:68px!important;
  border-radius:22px!important;
  display:grid!important;
  place-items:center!important;
  background:rgba(255,255,255,.68)!important;
  border:1px solid rgba(88,69,55,.10)!important;
  box-shadow:0 14px 28px rgba(55,42,34,.07)!important;
}
html body .presence-symbol i{
  width:20px!important;
  height:20px!important;
  border-radius:50% 50% 50% 0!important;
  border:2px solid currentColor!important;
  transform:rotate(-45deg)!important;
  position:relative!important;
  display:block!important;
}
html body .presence-symbol i::after{
  content:""!important;
  position:absolute!important;
  inset:5px!important;
  border-radius:50%!important;
  background:currentColor!important;
}
html body .presence-symbol b{
  position:absolute!important;
  inset:auto 12px 12px auto!important;
  width:9px!important;
  height:9px!important;
  border-radius:50%!important;
  background:currentColor!important;
  opacity:.28!important;
  animation:presenceDot 2.4s ease-in-out infinite!important;
}
html body .presence-saudi .presence-symbol{color:var(--presence-copper)!important}
html body .presence-uae .presence-symbol{color:var(--presence-slate)!important}
html body .presence-node-copy{
  grid-area:copy!important;
  position:relative!important;
  z-index:2!important;
  align-self:end!important;
  max-width:85%!important;
}
html body .presence-node-copy strong{
  display:block!important;
  font-size:clamp(30px,3vw,46px)!important;
  line-height:1.18!important;
  letter-spacing:-.025em!important;
  color:#211a17!important;
  text-wrap:balance!important;
}
html body .presence-node-copy em{
  display:block!important;
  margin-top:14px!important;
  font-style:normal!important;
  font-size:14px!important;
  color:#746961!important;
}
html body .presence-tags{
  grid-area:tags!important;
  position:relative!important;
  z-index:2!important;
  display:flex!important;
  flex-wrap:wrap!important;
  gap:10px!important;
}
html body .presence-tags span{
  padding:9px 13px!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.62)!important;
  border:1px solid rgba(88,69,55,.10)!important;
  color:#756961!important;
  font-size:11px!important;
  font-weight:700!important;
  letter-spacing:.02em!important;
}
@keyframes presenceOrbPulse{
  0%,100%{transform:scale(.9);opacity:.72;box-shadow:0 0 0 8px rgba(180,116,82,.06),0 12px 28px rgba(64,47,37,.14)}
  50%{transform:scale(1.08);opacity:1;box-shadow:0 0 0 14px rgba(103,120,135,.07),0 16px 36px rgba(64,47,37,.2)}
}
@keyframes presenceDot{
  0%,100%{transform:scale(.7);opacity:.18}
  50%{transform:scale(1.25);opacity:.55}
}
html[data-theme="dark"] body .locations,
html[data-theme="purple"] body .locations{
  background:
    radial-gradient(circle at 9% 18%, rgba(201,143,104,.12), transparent 24rem),
    radial-gradient(circle at 91% 82%, rgba(131,151,166,.11), transparent 24rem),
    linear-gradient(180deg,#171411 0%,#201b17 100%)!important;
}
html[data-theme="dark"] body .presence-heading h2,
html[data-theme="purple"] body .presence-heading h2,
html[data-theme="dark"] body .presence-node-copy strong,
html[data-theme="purple"] body .presence-node-copy strong{color:#f5efe9!important}
html[data-theme="dark"] body .presence-heading > p:last-child,
html[data-theme="purple"] body .presence-heading > p:last-child,
html[data-theme="dark"] body .presence-node-copy em,
html[data-theme="purple"] body .presence-node-copy em,
html[data-theme="dark"] body .presence-node-head small,
html[data-theme="purple"] body .presence-node-head small{color:#b8aea6!important}
html[data-theme="dark"] body .presence-stage,
html[data-theme="purple"] body .presence-stage{background:rgba(255,255,255,.035)!important;border-color:rgba(255,255,255,.07)!important}
html[data-theme="dark"] body .presence-saudi,
html[data-theme="purple"] body .presence-saudi{background:linear-gradient(160deg,#241c17,#35261f 64%,#3d2c24)!important}
html[data-theme="dark"] body .presence-uae,
html[data-theme="purple"] body .presence-uae{background:linear-gradient(160deg,#1b2024,#273038 64%,#303a42)!important}
html[data-theme="dark"] body .presence-index,
html[data-theme="purple"] body .presence-index,
html[data-theme="dark"] body .presence-symbol,
html[data-theme="purple"] body .presence-symbol,
html[data-theme="dark"] body .presence-tags span,
html[data-theme="purple"] body .presence-tags span{background:rgba(255,255,255,.06)!important;border-color:rgba(255,255,255,.08)!important;color:#c9beb5!important}
@media(max-width:900px){
  html body .presence-heading{grid-template-columns:1fr!important;grid-template-areas:"kicker" "title" "text"!important;gap:12px!important}
  html body .presence-heading h2{max-width:none!important}
  html body .presence-heading > p:last-child{max-width:none!important}
  html body .presence-stage{grid-template-columns:1fr!important;padding:22px!important}
  html body .presence-route{display:none!important}
}
@media(max-width:620px){
  html body .presence-stage{padding:16px!important;border-radius:28px!important}
  html body .presence-node{min-height:270px!important;padding:22px!important;border-radius:26px!important;grid-template-columns:1fr auto!important}
  html body .presence-node-copy{max-width:100%!important}
  html body .presence-node-copy strong{font-size:clamp(28px,9vw,38px)!important}
  html body .presence-node.is-active{transform:none!important}
}
@media(prefers-reduced-motion:reduce){
  html body .presence-route-orb,
  html body .presence-symbol b,
  html body .presence-node{animation:none!important;transition:none!important}
}


/* v67 quick text-line fix */

@media (min-width: 1100px){
  html body .journey .journey-heading{
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
  }
  html body .journey .journey-heading > div,
  html body .presence-heading h2{
    max-width:none!important;
  }
  html body .journey .journey-heading h2{
    white-space:nowrap!important;
    font-size:clamp(32px,3.6vw,58px)!important;
    line-height:1.12!important;
  }
  html body .presence-heading{
    grid-template-columns:minmax(0,1fr) auto!important;
    grid-template-areas:"kicker kicker" "text title"!important;
    align-items:center!important;
  }
  html body .presence-heading h2{
    white-space:nowrap!important;
    font-size:clamp(30px,3vw,48px)!important;
    line-height:1.15!important;
  }
  html body .presence-heading > p:last-child{
    max-width:60ch!important;
  }
}
@media (max-width: 1099px){
  html body .journey .journey-heading h2,
  html body .presence-heading h2{
    white-space:normal!important;
  }
}


/* v68 inline title hard-fix */

html body .journey-title-inline,
html body .presence-title-inline{
  display:inline-block!important;
  max-width:none!important;
}
@media (min-width: 1100px){
  html body .journey .journey-heading,
  html body .presence-heading{
    align-items:center!important;
  }
  html body .journey .journey-heading > div,
  html body .presence-heading h2,
  html body .journey-title-inline,
  html body .presence-title-inline{
    max-width:max-content!important;
  }
  html body .journey-title-inline,
  html body .presence-title-inline{
    white-space:nowrap!important;
  }
}
@media (max-width: 1099px){
  html body .journey-title-inline,
  html body .presence-title-inline{
    white-space:normal!important;
  }
}


/* ===== V69 refresh: remove Syria title + new journey palette/motion ===== */

html body .journey{
  --j-accent:#8e6f86;
  --j-accent-strong:#b89aac;
  --j-secondary:#d4ad7d;
  --j-glow:rgba(142,111,134,.16);
  --j-glow-strong:rgba(184,154,172,.24);
  --j-card:#fffdfb;
  --j-line-soft:rgba(142,111,134,.18);
  background:
    radial-gradient(circle at 12% 18%, rgba(212,173,125,.12), transparent 22rem),
    radial-gradient(circle at 88% 10%, rgba(142,111,134,.10), transparent 24rem),
    linear-gradient(180deg, #fcfaf7 0%, #f7f2ee 100%)!important;
}
html body .journey::before{
  inset-inline:5%!important;
  top:72px!important;
  height:180px!important;
  border-radius:44px!important;
  background:linear-gradient(180deg, rgba(255,255,255,.55), rgba(255,255,255,0))!important;
  border:1px solid rgba(142,111,134,.06)!important;
}
html body .journey::after{
  inset-inline-start:-80px!important;
  inset-inline-end:auto!important;
  bottom:-110px!important;
  width:320px!important;
  height:320px!important;
  border-radius:40% 60% 58% 42% / 52% 44% 56% 48%!important;
  background:radial-gradient(circle at 45% 45%, rgba(212,173,125,.14), rgba(142,111,134,.06) 48%, transparent 70%)!important;
  filter:blur(10px)!important;
}
html body .journey .journey-track::before{
  top:42px!important;
  height:8px!important;
  border-radius:999px!important;
  background:linear-gradient(90deg, rgba(212,173,125,.28), rgba(142,111,134,.24), rgba(212,173,125,.28))!important;
  border:none!important;
  box-shadow:0 8px 26px rgba(67,47,52,.06)!important;
}
html body .journey .journey-track::after{
  content:""!important;
  top:26px!important;
  inset-inline-start:8.7%!important;
  width:42px!important;
  height:42px!important;
  border-radius:18px!important;
  background:
    radial-gradient(circle at 35% 35%, rgba(255,255,255,.95), rgba(255,255,255,.35) 28%, transparent 29%),
    linear-gradient(145deg, rgba(212,173,125,.95), rgba(142,111,134,.96))!important;
  border:1px solid rgba(255,255,255,.65)!important;
  box-shadow:0 18px 35px rgba(142,111,134,.18), 0 0 0 10px rgba(142,111,134,.08)!important;
  animation:journeyGemRun 7.8s cubic-bezier(.68,.02,.2,.98) infinite!important;
}
html body .journey .journey-track::after{
  clip-path:polygon(50% 0%,100% 50%,50% 100%,0% 50%)!important;
}
html body .journey .journey-step .journey-num{
  background:linear-gradient(180deg, #fff, #f7f1ec)!important;
  border:1px solid rgba(142,111,134,.22)!important;
  color:var(--j-accent)!important;
  box-shadow:0 12px 28px rgba(52,39,42,.07)!important;
}
html body .journey .journey-step .journey-num::after{
  border-color:rgba(212,173,125,.22)!important;
}
html body .journey .journey-step > div{
  border:1px solid rgba(142,111,134,.12)!important;
  background:
    linear-gradient(145deg, rgba(255,255,255,.98), rgba(250,244,239,.98) 58%, rgba(246,239,235,.96)),
    linear-gradient(180deg, rgba(142,111,134,.03), rgba(212,173,125,.04))!important;
  box-shadow:0 24px 54px rgba(31,22,24,.06)!important;
}
html body .journey .journey-step > div::before{
  height:6px!important;
  background:linear-gradient(90deg, var(--j-accent) 0%, var(--j-secondary) 48%, var(--j-accent-strong) 100%)!important;
}
html body .journey .journey-step > div::after{
  inset-inline-end:-14px!important;
  top:-16px!important;
  width:136px!important;
  height:136px!important;
  border-radius:34px!important;
  border:1px solid rgba(142,111,134,.09)!important;
  background:
    radial-gradient(circle at center, rgba(212,173,125,.16), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.25), rgba(255,255,255,0))!important;
}
html body .journey .journey-step h3{color:#221b21!important}
html body .journey .journey-step:hover > div{
  transform:translateY(calc(var(--card-offset) - 10px))!important;
  border-color:rgba(142,111,134,.24)!important;
  box-shadow:0 28px 62px rgba(31,22,24,.09)!important;
}
html body .journey .journey-step.is-active > div{
  transform:translateY(calc(var(--card-offset) - 16px))!important;
  border-color:rgba(142,111,134,.26)!important;
  box-shadow:0 32px 72px rgba(31,22,24,.12), 0 0 0 1px rgba(212,173,125,.08)!important;
  background:
    linear-gradient(145deg, rgba(255,255,255,.99), rgba(249,241,235,.99) 54%, rgba(245,236,242,.98)),
    linear-gradient(180deg, rgba(142,111,134,.04), rgba(212,173,125,.06))!important;
  animation:journeyCardHoverLift 3.5s ease-in-out infinite!important;
}
html body .journey .journey-step.is-active > div::after{
  animation:journeyHaloPulse 3.5s ease-in-out infinite!important;
}
html body .journey .journey-step.is-active .journey-num{
  transform:translateY(-10px) rotate(-4deg)!important;
  background:linear-gradient(180deg, var(--j-accent), var(--j-accent-strong))!important;
  border-color:rgba(142,111,134,.52)!important;
  color:#fff!important;
  box-shadow:0 0 0 12px rgba(142,111,134,.08), 0 18px 42px rgba(142,111,134,.18)!important;
  animation:journeyBadgeTilt 3.5s ease-in-out infinite!important;
}
html body .journey .journey-step.is-active h3{color:var(--j-accent)!important}
html body .journey .journey-step.is-complete .journey-num{
  background:linear-gradient(180deg, #fff, #f4eef7)!important;
  color:var(--j-accent)!important;
  border-color:rgba(142,111,134,.16)!important;
}
@keyframes journeyGemRun{
  0%{inset-inline-start:8.7%;transform:translateY(0) rotate(0deg) scale(.82);opacity:0}
  8%{opacity:1}
  18%{transform:translateY(-8px) rotate(45deg) scale(1)}
  35%{transform:translateY(6px) rotate(90deg) scale(1.04)}
  52%{transform:translateY(-6px) rotate(135deg) scale(.98)}
  70%{transform:translateY(8px) rotate(180deg) scale(1.04)}
  92%{opacity:1}
  100%{inset-inline-start:89%;transform:translateY(0) rotate(225deg) scale(.82);opacity:.08}
}
@keyframes journeyCardHoverLift{
  0%,100%{transform:translateY(calc(var(--card-offset) - 16px))}
  50%{transform:translateY(calc(var(--card-offset) - 24px))}
}
@keyframes journeyBadgeTilt{
  0%,100%{transform:translateY(-10px) rotate(-4deg)}
  50%{transform:translateY(-14px) rotate(4deg)}
}
@keyframes journeyHaloPulse{
  0%,100%{transform:rotate(18deg) scale(1);opacity:.82}
  50%{transform:rotate(24deg) scale(1.08);opacity:1}
}
@media (max-width:1099px){
  html body .journey .journey-track::after{animation-duration:7s!important}
}
@media (max-width:760px){
  html body .journey .journey-track::before,
  html body .journey .journey-track::after{display:none!important}
  html body .journey .journey-step > div,
  html body .journey .journey-step.is-active > div{transform:none!important;animation:none!important}
  html body .journey .journey-step.is-active .journey-num{transform:none!important;animation:none!important}
}
@media (prefers-reduced-motion:reduce){
  html body .journey .journey-track::after,
  html body .journey .journey-step.is-active > div,
  html body .journey .journey-step.is-active > div::after,
  html body .journey .journey-step.is-active .journey-num{animation:none!important}
}
html body .presence-title-inline{white-space:nowrap!important}
@media (max-width:1099px){html body .presence-title-inline{white-space:normal!important}}


/* ===== V70 definitive desktop title layout fix ===== */

/* Force both section headings to use the full shell width on desktop.
   This intentionally overrides the older narrow grid layouts that caused Arabic titles to stack vertically. */
@media (min-width: 900px){
  html body .journey .journey-heading,
  html body .presence-heading{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    grid-template-columns:none!important;
    grid-template-areas:none!important;
    text-align:right!important;
  }
  html body .journey .journey-heading > div{
    width:100%!important;
    max-width:none!important;
    display:block!important;
  }
  html body .journey .journey-heading .kicker,
  html body .presence-heading .kicker{
    display:block!important;
    margin:0 0 14px!important;
  }
  html body .journey .journey-heading h2,
  html body .journey-title-inline,
  html body .presence-heading h2,
  html body .presence-title-inline{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    white-space:nowrap!important;
    overflow:visible!important;
    text-wrap:nowrap!important;
    word-break:normal!important;
    overflow-wrap:normal!important;
    text-align:right!important;
    line-height:1.18!important;
    letter-spacing:-.02em!important;
  }
  html body .journey .journey-heading h2,
  html body .journey-title-inline{
    font-size:clamp(30px,3.1vw,50px)!important;
  }
  html body .presence-heading h2,
  html body .presence-title-inline{
    font-size:clamp(30px,3vw,48px)!important;
  }
  html body .journey .journey-heading > p,
  html body .presence-heading > p:last-child{
    display:block!important;
    width:min(100%,760px)!important;
    max-width:760px!important;
    margin:18px 0 0 auto!important;
    text-align:right!important;
    line-height:1.95!important;
  }
  html body .journey .journey-heading{margin-bottom:48px!important}
  html body .presence-heading{margin-bottom:4px!important}
}
@media (max-width: 899px){
  html body .journey .journey-heading h2,
  html body .journey-title-inline,
  html body .presence-heading h2,
  html body .presence-title-inline{
    white-space:normal!important;
    text-wrap:balance!important;
  }
}