/* v57 comprehensive preview corrections — loaded last */
:root {
  --v57-ink: #3e3822;
  --v57-paper: #fffaf2;
  --v57-sand: #ead7bc;
  --v57-line: rgb(62 56 34 / 16%);
}

html,
body { overflow-x: clip; }

.kicker,
html[dir='ltr'] .kicker { color: var(--v57-ink) !important; }

/* Bilingual hero: cancel accumulated directional transforms and clipping. */
.hero.section-shell {
  width: min(100% - 7vw, 1480px) !important;
  max-width: 1480px !important;
  margin-inline: auto !important;
  padding-inline: clamp(1.5rem, 4vw, 4rem) !important;
  grid-template-columns: minmax(0, .93fr) minmax(0, 1.07fr) !important;
  column-gap: clamp(1.5rem, 4vw, 5rem) !important;
}
.hero-copy,
html[dir='ltr'] .hero-copy,
html[dir='rtl'] .hero-copy {
  width: 100% !important;
  max-width: 44rem !important;
  margin: 0 !important;
  padding: 0 !important;
  translate: none !important;
  transform: none !important;
  inset: auto !important;
  min-width: 0 !important;
}
html[dir='ltr'] .hero-copy { text-align: left !important; }
html[dir='rtl'] .hero-copy { text-align: right !important; }
.hero h1,
html[dir='ltr'] .hero h1,
html[dir='rtl'] .hero h1 {
  max-width: 100% !important;
  white-space: normal !important;
  overflow-wrap: normal !important;
}
.hero-art,
html[dir='ltr'] .hero-art,
html[dir='rtl'] .hero-art {
  width: 100% !important;
  max-width: 48rem !important;
  margin: 0 !important;
  translate: none !important;
  inset: auto !important;
}
.hero-art img,
html[dir='ltr'] .hero-art img,
html[dir='rtl'] .hero-art img {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  translate: none !important;
}

/* Gate rows keep approved content while reducing repetition and clipping. */

/* v78: controls removed — flat full-width strip, no bottom reserve */

/* Detail pages: denser editorial cards, balanced fifth service, stronger CTA. */
.premium-detail-list { padding-block-start: 0 !important; }
.detail-card-grid { align-items: stretch; }
.detail-card {
  min-height: 0 !important;
  padding: clamp(1.25rem, 2.2vw, 2rem) !important;
}
.detail-card h3 { margin-block: .8rem .45rem !important; }
.detail-card p { margin: 0 !important; }
@media (min-width: 901px) {
  .detail-card-grid:has(> :nth-child(5):last-child) {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  }
  .detail-card-grid:has(> :nth-child(5):last-child) > .detail-card { grid-column: span 2; }
  .detail-card-grid:has(> :nth-child(5):last-child) > .detail-card:nth-child(4) { grid-column: 2 / span 2; }
  .detail-card-grid:has(> :nth-child(5):last-child) > .detail-card:nth-child(5) { grid-column: 4 / span 2; }
}
.detail-cta {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 2rem;
  margin-block: clamp(2rem, 5vw, 5rem) !important;
  padding: clamp(1.5rem, 4vw, 3.5rem) !important;
  border: 1px solid var(--v57-line);
  border-radius: clamp(1.4rem, 3vw, 2.4rem);
  background: rgb(255 250 242 / 88%);
}
.detail-cta h2 { margin: .25rem 0 .45rem; }
.detail-cta p { margin: 0; max-width: 48rem; }
.detail-cta .btn { white-space: nowrap; }

.credentials-section { padding-block-start: 0 !important; }
.credentials-panel {
  display: grid;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
  border: 1px solid var(--v57-line);
  border-radius: clamp(1.5rem, 3vw, 2.5rem);
  overflow: hidden;
  background: rgb(255 250 242 / 90%);
  box-shadow: 0 1.25rem 4rem rgb(62 56 34 / 6%);
}
.credentials-panel > div { padding: clamp(1.5rem, 4vw, 3.5rem); }
.credentials-panel > div + div { border-inline-start: 1px solid var(--v57-line); }
.credentials-panel h2 { margin: .35rem 0 1.25rem; }
.credentials-panel ul { display: grid; gap: .7rem; margin: 0; padding: 0; list-style: none; }
.credentials-panel li {
  position: relative;
  padding: .85rem 1rem;
  border: 1px solid var(--v57-line);
  border-radius: 1rem;
  background: rgb(234 215 188 / 18%);
}
.credentials-panel li::before { content: '✓'; margin-inline-end: .6rem; color: var(--v57-ink); font-weight: 800; }

.policy-page { max-width: 58rem !important; padding-block: clamp(4rem, 9vw, 8rem) !important; }
.policy-page h1 { margin-block: .25rem 1.5rem; }
.policy-page h2 { margin-block: 2.2rem .5rem; }
.policy-page p { max-width: 52rem; }

.not-found {
  min-height: 100svh;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 1rem;
  padding: 2rem;
  text-align: center;
  background: #f7ead8;
}
.not-found img { width: min(14rem, 65vw); height: auto; }
.not-found h1,
.not-found p { margin: 0; }

/* Mobile menu is a solid, isolated surface over a real backdrop. */

.footer-privacy { margin-block: 1rem; }
.footer-privacy a { color: inherit; text-decoration: underline; text-underline-offset: .2em; }
.form-note a { color: inherit; text-decoration: underline; }

@media (max-width: 900px) {
  .hero.section-shell {
    width: min(100% - 2rem, 46rem) !important;
    grid-template-columns: 1fr !important;
    padding: clamp(1.6rem, 5vw, 2.5rem) !important;
  }
  .hero-copy,
  html[dir='ltr'] .hero-copy,
  html[dir='rtl'] .hero-copy { grid-column: 1 !important; grid-row: 1 !important; }
  .hero-art,
  html[dir='ltr'] .hero-art,
  html[dir='rtl'] .hero-art { grid-column: 1 !important; grid-row: 2 !important; }
  .detail-cta { grid-template-columns: 1fr; }
  .detail-cta .btn { width: fit-content; }
  .credentials-panel { grid-template-columns: 1fr; }
  .credentials-panel > div + div { border-inline-start: 0; border-block-start: 1px solid var(--v57-line); }
}

@media (max-width: 768px) {
  .hero.section-shell {
    display: flex !important;
    flex-direction: column !important;
    width: calc(100% - 1.5rem) !important;
    min-height: 0 !important;
    margin-block-start: .6rem !important;
    border-radius: 1.75rem !important;
  }
  .hero h1,
  html[dir='ltr'] .hero h1,
  html[dir='rtl'] .hero h1 { font-size: clamp(1.35rem, 6vw, 1.75rem) !important; }
  .hero-actions { width: 100% !important; gap: .7rem !important; }
  .hero-actions .btn { width: min(100%, 17rem) !important; max-width: 17rem !important; }
  .hero-art,
  .hero-art img,
  html[dir='ltr'] .hero-art,
  html[dir='ltr'] .hero-art img {
    width: 100% !important;
    height: auto !important;
    max-height: 18rem !important;
    object-fit: contain !important;
  }
  .hero-art,
  html[dir='ltr'] .hero-art,
  html[dir='rtl'] .hero-art {
    position: relative !important;
    order: 2 !important;
    inset: auto !important;
    justify-self: stretch !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-inline: auto !important;
    transform: none !important;
    min-height: 11rem !important;
    overflow: visible !important;
  }
  .hero-art img,
  html[dir='ltr'] .hero-art img,
  html[dir='rtl'] .hero-art img { transform: none !important; }

  .detail-card-grid { grid-template-columns: 1fr !important; gap: .75rem !important; }
  .detail-card { padding: 1.15rem !important; border-radius: 1.25rem !important; }
  .detail-card .number { margin-bottom: .35rem !important; }
  .detail-cta { gap: 1.2rem; padding: 1.4rem !important; }
  .credentials-panel > div { padding: 1.35rem; }

  footer .footer-grid { grid-template-columns: 1fr 1fr !important; gap: 1.4rem 1rem !important; }
  footer .footer-brand { grid-column: 1 / -1; }
  footer .footer-contact { grid-column: 1 / -1; }
  footer .footer-brand p { max-width: 30rem; }

  .planner-options {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .planner-chip { width: 100% !important; min-width: 0 !important; white-space: normal !important; }
}

@media (max-width: 340px) {
  footer .footer-grid { grid-template-columns: 1fr !important; }
  footer .footer-brand,
  footer .footer-contact { grid-column: auto; }
  .planner-options { grid-template-columns: 1fr !important; }
}

/* User-approved originals: display the supplied JPG pixels without recoloring or blending. */
.hero-art img[src$="-source.jpg"],
.premium-detail-hero .detail-art img[src$="-source.jpg"] {
  filter: none !important;
  mix-blend-mode: normal !important;
  opacity: 1 !important;
  object-fit: contain !important;
  background: transparent !important;
}

/* v66: transparent line-art derivatives — no pasted JPG background. */
.hero-art img[src$="-transparent-drawing-tight.webp"],
.premium-detail-hero .detail-art img[src$="-transparent-drawing-tight.webp"] {
  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  filter: none !important;
  mix-blend-mode: normal !important;
  opacity: 1 !important;
  object-fit: contain !important;
}

.hero-art img[src$="-transparent-drawing-tight.webp"] {
  width: min(100%, 44rem) !important;
  height: auto !important;
}

.premium-detail-hero .detail-art img[src$="-transparent-drawing-tight.webp"] {
  max-width: 38rem !important;
  height: clamp(17rem, 28vw, 24.5rem) !important;
}

/* Keep final hero artwork clear of the headline/copy. */
html[dir='rtl'] .hero.section-shell .hero-art { grid-column: 1 !important; justify-self: start !important; max-width: 40rem !important; }
html[dir='rtl'] .hero.section-shell .hero-copy { grid-column: 2 !important; justify-self: end !important; position: relative !important; z-index: 3 !important; }
html[dir='ltr'] .hero.section-shell .hero-art { grid-column: 2 !important; justify-self: end !important; max-width: 40rem !important; }
html[dir='ltr'] .hero.section-shell .hero-copy { grid-column: 1 !important; justify-self: start !important; position: relative !important; z-index: 3 !important; }

/* Transparent hero art in a real two-column layout; no text/image overlap. */
.hero.section-shell:has(.hero-art img[src$="-transparent-drawing-tight.webp"]) {
  display: grid !important;
  grid-template-columns: minmax(18rem, .82fr) minmax(24rem, 1.18fr) !important;
  align-items: center !important;
  gap: clamp(2rem, 4vw, 4.5rem) !important;
  min-height: auto !important;
  padding-block: clamp(4.5rem, 6vw, 6rem) !important;
  overflow: visible !important;
}
html[dir='rtl'] .hero.section-shell:has(.hero-art img[src$="-transparent-drawing-tight.webp"]) .hero-copy,
html[dir='ltr'] .hero.section-shell:has(.hero-art img[src$="-transparent-drawing-tight.webp"]) .hero-copy {
  grid-column: 1 !important;
  grid-row: 1 !important;
  width: 100% !important;
  max-width: 34rem !important;
  margin: 0 !important;
  position: relative !important;
  z-index: 3 !important;
}
html[dir='rtl'] .hero.section-shell:has(.hero-art img[src$="-transparent-drawing-tight.webp"]) .hero-art,
html[dir='ltr'] .hero.section-shell:has(.hero-art img[src$="-transparent-drawing-tight.webp"]) .hero-art {
  grid-column: 2 !important;
  grid-row: 1 !important;
  position: relative !important;
  inset: auto !important;
  width: 100% !important;
  height: auto !important;
  max-width: none !important;
  margin: 0 !important;
  justify-self: stretch !important;
}
html[dir='rtl'] .hero.section-shell:has(.hero-art img[src$="-transparent-drawing-tight.webp"]) .hero-art img,
html[dir='ltr'] .hero.section-shell:has(.hero-art img[src$="-transparent-drawing-tight.webp"]) .hero-art img {
  width: 100% !important;
  height: auto !important;
}
@media (max-width: 900px) {
  .hero.section-shell:has(.hero-art img[src$="-transparent-drawing-tight.webp"]) {
    grid-template-columns: 1fr !important;
    gap: 1.25rem !important;
    padding-block: 2.75rem 1.5rem !important;
  }
  html[dir] .hero.section-shell:has(.hero-art img[src$="-transparent-drawing-tight.webp"]) .hero-copy,
  html[dir] .hero.section-shell:has(.hero-art img[src$="-transparent-drawing-tight.webp"]) .hero-art {
    grid-column: 1 !important;
    grid-row: auto !important;
    width: 100% !important;
    max-width: none !important;
    justify-self: center !important;
  }
}

/* v67: hero artwork becomes the wide signature visual; homepage gateways stay text-only. */
body {
  background:
    radial-gradient(circle at 72% 4%, rgba(234, 215, 188, .62), transparent 24rem),
    radial-gradient(circle at 18% 12%, rgba(255, 249, 239, .88), transparent 22rem),
    linear-gradient(180deg, #fffaf2 0%, #faf0e4 38%, #f7eadc 100%) !important;
}

.hero.section-shell:has(.hero-art img[src$="-transparent-drawing-tight.webp"]) {
  display: block !important;
  padding-top: clamp(4.25rem, 6vw, 6rem) !important;
  padding-bottom: clamp(1.75rem, 3vw, 2.75rem) !important;
  overflow: visible !important;
  background:
    linear-gradient(135deg, rgba(255, 252, 246, .96), rgba(250, 240, 228, .72)),
    radial-gradient(circle at 50% 62%, rgba(234, 215, 188, .72), transparent 34rem) !important;
}

.hero.section-shell:has(.hero-art img[src$="-transparent-drawing-tight.webp"])::after {
  content: "";
  position: absolute;
  inset: auto 4% 4% 4%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(62, 56, 34, .22), transparent);
  pointer-events: none;
}

html[dir] .hero.section-shell:has(.hero-art img[src$="-transparent-drawing-tight.webp"]) .hero-copy {
  width: min(100%, 58rem) !important;
  max-width: 58rem !important;
  margin-inline: auto !important;
  text-align: center !important;
}

.hero.section-shell:has(.hero-art img[src$="-transparent-drawing-tight.webp"]) .hero-copy h1 {
  text-wrap: balance;
  text-shadow: 0 .16rem .5rem rgba(234, 215, 188, .52);
}

html[dir] .hero.section-shell:has(.hero-art img[src$="-transparent-drawing-tight.webp"]) .hero-art {
  position: relative !important;
  inset: auto !important;
  width: calc(100vw - 15px) !important;
  max-width: none !important;
  height: auto !important;
  margin: clamp(1.45rem, 2.2vw, 2.25rem) calc(50% - 50vw + 7.5px) 0 !important;
  transform: none !important;
}

@media (max-width: 768px) {
  html[dir] .hero.section-shell:has(.hero-art img[src$="-transparent-drawing-tight.webp"]) .hero-art {
    width: 100vw !important;
    margin-inline: calc(50% - 50vw) !important;
  }
}

.hero.section-shell:has(.hero-art img[src$="-transparent-drawing-tight.webp"]) .hero-art img {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  margin-inline: auto !important;
  filter: drop-shadow(0 1.5rem 2.75rem rgba(62, 56, 34, .12)) !important;
}

.hero.section-shell .hero-actions {
  display: none !important;
}

.section,
.planner-panel,
.credentials-panel,
.credentials-pane,
.footer-inner {
  box-shadow: 0 1rem 2.65rem rgba(62, 56, 34, .07), inset 0 1px 0 rgba(255, 255, 255, .7);
}

@media (max-width: 768px) {
  html[dir] .hero.section-shell:has(.hero-art img[src$="-transparent-drawing-tight.webp"]) .hero-copy {
    text-align: start !important;
  }
  html[dir] .hero.section-shell:has(.hero-art img[src$="-transparent-drawing-tight.webp"]) .hero-art {
    width: 100vw !important;
    margin-inline: calc(50% - 50vw) !important;
  }
}

/* v68: title first, artwork below; homepage section copy sits directly on the page background. */
.hero.section-shell:has(.hero-art img[src$="-transparent-drawing-tight.webp"]) {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: clamp(1.15rem, 2.2vw, 2rem) !important;
}

html[dir] .hero.section-shell:has(.hero-art img[src$="-transparent-drawing-tight.webp"]) .hero-copy {
  order: 1 !important;
}

html[dir] .hero.section-shell:has(.hero-art img[src$="-transparent-drawing-tight.webp"]) .hero-art {
  order: 2 !important;
  margin-top: 0 !important;
}

/* v69: remove visible frames/edges; keep one continuous wavy premium background. */
html,
body {
  background:
    radial-gradient(ellipse at 82% 2%, rgba(234, 215, 188, .62), transparent 28rem),
    radial-gradient(ellipse at 12% 18%, rgba(255, 250, 242, .92), transparent 24rem),
    radial-gradient(ellipse at 74% 52%, rgba(238, 221, 198, .48), transparent 30rem),
    linear-gradient(160deg, #fffaf2 0%, #faf0e4 36%, #f3e4d3 68%, #fbf3e9 100%) !important;
  background-attachment: fixed !important;
}

.hero,
.hero.section-shell,
.section,
.section-shell,
.planner-panel,
.credentials-panel,
.credentials-pane {
  border: 0 !important;
  border-top: 0 !important;
  border-bottom: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

.hero.section-shell:has(.hero-art img[src$="-transparent-drawing-tight.webp"]) {
  background: transparent !important;
}

.hero.section-shell:has(.hero-art img[src$="-transparent-drawing-tight.webp"])::after {
  display: none !important;
}

/* v69.1: remove remaining hairline rails and make the wave field continuous, not white blocks. */
html,
body,
main,
.home-planner {
  background:
    radial-gradient(ellipse at 78% 8%, rgba(234, 215, 188, .66), transparent 30rem),
    radial-gradient(ellipse at 16% 28%, rgba(255, 248, 236, .9), transparent 26rem),
    radial-gradient(ellipse at 70% 66%, rgba(238, 221, 198, .52), transparent 34rem),
    linear-gradient(165deg, #fff8ed 0%, #f8ead8 42%, #fff7ed 72%, #f5e5d1 100%) !important;
}

main,
.home-planner {
  background-attachment: fixed !important;
}

.hero::before,
.hero::after,
.section::before,
.section::after {
  border: 0 !important;
  box-shadow: none !important;
}

.premium-detail-hero .detail-copy {
  border: 0 !important;
  border-inline: 0 !important;
  border-inline-start: 0 !important;
  border-inline-end: 0 !important;
  padding-inline-start: 0 !important;
  padding-inline-end: 0 !important;
}

.read-more {
  border: 0 !important;
  text-decoration: none !important;
}

/* v72: the old opaque section backgrounds were covering the background design.
   Keep content transparent and make the warm wave/gloss field the actual page surface. */
html,
body {
  min-height: 100%;
  background-color: #f6e6d1 !important;
  background-image:
    radial-gradient(ellipse 52rem 34rem at 78% 8%, rgba(234, 215, 188, .96) 0%, rgba(234, 215, 188, .34) 38%, transparent 72%),
    radial-gradient(ellipse 46rem 30rem at 12% 24%, rgba(255, 249, 238, .98) 0%, rgba(248, 228, 202, .52) 42%, transparent 78%),
    radial-gradient(ellipse 58rem 38rem at 84% 62%, rgba(214, 184, 145, .50) 0%, rgba(214, 184, 145, .20) 40%, transparent 76%),
    linear-gradient(138deg, transparent 0 34%, rgba(255,255,255,.44) 43%, transparent 56%),
    linear-gradient(24deg, transparent 0 46%, rgba(62,56,34,.070) 53%, transparent 68%),
    linear-gradient(165deg, #fff8ed 0%, #f2d9bb 43%, #fff1df 69%, #e7ceb0 100%) !important;
  background-attachment: fixed !important;
  background-size: cover, cover, cover, 100% 100%, 100% 100%, cover !important;
}

main,
.section,
.section-shell,
.hero,
.hero.section-shell,
.home-planner,
.premium-detail-hero {
  background: transparent !important;
  background-image: none !important;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0 !important;
  pointer-events: none;
  opacity: .92 !important;
  background:
    repeating-linear-gradient(128deg, transparent 0 8rem, rgba(255,255,255,.18) 10rem, transparent 18rem),
    radial-gradient(ellipse at 68% 18%, rgba(255,255,255,.40), transparent 32rem),
    radial-gradient(ellipse at 18% 72%, rgba(176,152,110,.13), transparent 34rem) !important;
  mix-blend-mode: soft-light !important;
}

body::after {
  content: "";
  position: fixed;
  inset: -12% -8%;
  z-index: 0 !important;
  pointer-events: none;
  opacity: .42 !important;
  background:
    linear-gradient(112deg, transparent 0 39%, rgba(255,255,255,.58) 48%, transparent 61%),
    linear-gradient(28deg, transparent 0 45%, rgba(62,56,34,.075) 52%, transparent 65%) !important;
  filter: blur(.2px);
  mix-blend-mode: soft-light !important;
}

body {
  isolation: isolate;
}

main,
.site-footer,
footer {
  position: relative;
  z-index: 1;
}

/* v73: more breathing room between homepage copy blocks; planner sits on the same background, not inside a box. */

.home-planner,
.home-planner.section,
.home-planner .planner-shell,
.home-planner .planner-step,
.planner-shell,
.planner-step {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

.home-planner {
  padding-block: clamp(3rem, 6vw, 6rem) !important;
}

.planner-shell {
  padding: clamp(1rem, 2vw, 1.8rem) 0 !important;
  overflow: visible !important;
}

.planner-shell::before,
.planner-step::before,
.planner-step::after {
  display: none !important;
}

.planner-step {
  padding: clamp(.65rem, 1.5vw, 1.05rem) 0 !important;
}

.home-planner .planner-eyebrow,
.planner-eyebrow {
  color: var(--muted) !important;
}

/* v74: one transparent glass text panel for the requirement planner + cleaner footer after privacy removal. */
.home-planner .concept-heading {
  margin-bottom: clamp(1.1rem, 2.4vw, 1.8rem) !important;
}

.home-planner .concept-heading h2 {
  max-width: 42rem !important;
}

.home-planner .planner-shell {
  display: grid !important;
  grid-template-columns: minmax(0, 1.28fr) minmax(18rem, .72fr) !important;
  gap: clamp(1rem, 2.1vw, 1.7rem) !important;
  padding: clamp(1.35rem, 2.7vw, 2.35rem) !important;
  border: 1px solid rgba(62, 56, 34, .14) !important;
  border-radius: clamp(1.45rem, 3vw, 2.1rem) !important;
  background:
    linear-gradient(135deg, rgba(255, 250, 242, .50), rgba(234, 215, 188, .20)) !important;
  background-color: transparent !important;
  box-shadow:
    0 1.4rem 4rem rgba(62, 56, 34, .075),
    inset 0 1px 0 rgba(255, 255, 255, .55) !important;
  -webkit-backdrop-filter: blur(8px) saturate(1.08) !important;
  backdrop-filter: blur(8px) saturate(1.08) !important;
}

.home-planner .planner-controls {
  gap: clamp(.95rem, 2vw, 1.35rem) !important;
}

.home-planner .planner-step {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.home-planner .planner-step {
  padding: 0 !important;
}

.home-planner .planner-step legend {
  margin-bottom: .65rem !important;
  color: #3e3822 !important;
}

.footer-privacy {
  display: none !important;
}

.site-footer {
  padding-block: clamp(3rem, 5vw, 4.5rem) 1.4rem !important;
}

@media (min-width: 1051px) {
  .footer-grid {
    grid-template-columns: 1.5fr 1fr 1fr !important;
    gap: clamp(1.6rem, 3vw, 2.75rem) !important;
    align-items: start !important;
  }
}

/* v76: contact column button opens the project modal (replaces the removed "طلب تواصل" link). */
.footer-col .footer-contact-btn {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  width: fit-content;
  margin: 0 0 8px !important;
  padding: .55rem 1.05rem;
  border: 1px solid rgba(234, 215, 188, .36);
  border-radius: 999px;
  color: #ead7bc !important;
  background: rgba(234, 215, 188, .07);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
  transition: background 160ms ease, color 160ms ease, border-color 160ms ease, transform 160ms ease;
}

.footer-col .footer-contact-btn:hover {
  background: #ead7bc;
  border-color: #ead7bc;
  color: #3e3822 !important;
  transform: translateY(-1px);
}


.footer-bottom {
  margin-top: clamp(1.6rem, 3vw, 2.4rem) !important;
  padding-top: 1rem !important;
  border-top: 1px solid rgba(62, 56, 34, .13) !important;
  display: flex !important;
  justify-content: space-between !important;
  gap: 1rem !important;
}

@media (max-width: 900px) {
  .home-planner .planner-shell {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 520px) {
  .footer-bottom {
    flex-direction: column !important;
  }
}

/* v75: tighter planner heading rhythm, flatter horizontal choices, and premium mobile hamburger. */
.home-planner .concept-heading {
  display: block !important;
  margin-bottom: clamp(1.35rem, 2.6vw, 2rem) !important;
}

.home-planner .concept-heading .kicker {
  margin-bottom: .35rem !important;
}

.home-planner .concept-heading h2 {
  margin-top: 0 !important;
}

.home-planner .planner-shell {
  grid-template-columns: 1fr !important;
  gap: clamp(1.1rem, 2.1vw, 1.65rem) !important;
  padding: clamp(1.15rem, 2.3vw, 1.85rem) !important;
}

.home-planner .planner-controls {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: clamp(.8rem, 1.6vw, 1.15rem) !important;
}

.home-planner .planner-step {
  display: block !important;
  width: 100% !important;
  padding-block: .2rem !important;
  clear: both !important;
}

.home-planner .planner-step legend {
  float: inline-start !important;
  width: clamp(8.5rem, 15vw, 11rem) !important;
  margin: .25rem 0 0 !important;
  padding: 0 !important;
  line-height: 1.5 !important;
}

.home-planner .planner-options {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: .5rem !important;
  margin-top: 0 !important;
  margin-inline-start: clamp(9.2rem, 16.5vw, 12rem) !important;
  width: auto !important;
}

.home-planner .planner-chip {
  width: auto !important;
  min-height: 2.25rem !important;
  padding: .42rem .8rem !important;
  font-size: clamp(.72rem, .95vw, .82rem) !important;
  white-space: nowrap !important;
}

@media (max-width: 760px) {
  .home-planner .planner-step {
    grid-template-columns: 1fr !important;
  }

  .home-planner .planner-step legend {
    float: none !important;
    width: auto !important;
    margin-bottom: .55rem !important;
  }

  .home-planner .planner-options {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    margin-inline-start: 0 !important;
  }

  .home-planner .planner-chip {
    width: 100% !important;
    white-space: normal !important;
  }
}

/* v76: disabled "داكن" (dark mode) slot in the mobile menu — present but not activated, no dark theme built. */


/* ===== v78: header/footer/ticker refinements ===== */

/* English button: beige text on olive (readability fix) */

/* Footer location line under brand tagline */
.footer-brand .footer-location {
  margin-top: .5rem;
  color: rgba(234, 215, 188, .72);
  font-size: 13.5px;
  line-height: 1.6;
}

/* Social icons: full-width, evenly spread across the page, light divider under */
.footer-social {
  width: 100% !important;
  max-width: 100% !important;
  margin-inline: 0 !important;
  padding: 1.15rem clamp(1.5rem, 5vw, 4rem) !important;
  border-bottom: 1px solid rgba(234, 215, 188, .18) !important;
}
.social-icons {
  width: min(28rem, 100%) !important;
  max-width: 28rem !important;
  margin-inline: auto !important;
  justify-content: space-between !important;
  gap: 1rem !important;
}

/* Footer bottom: full-width, copyright right + slogan left */
.footer-bottom {
  width: 100% !important;
  max-width: 100% !important;
  margin-inline: 0 !important;
  padding: .9rem clamp(1.5rem, 5vw, 4rem) !important;
  border-top: 0 !important;
}

/* Execution ticker: full-width thin auto strip, title + sentence balanced */


/* v78b: neutralize legacy ticker card borders/padding/gap — flat strip */


/* ===== v80: footer balance + creative crossfade ticker ===== */

/* Footer bottom: content-width (aligned with columns), company right + address left */
.footer-bottom {
  width: min(1160px, calc(100% - 120px)) !important;
  max-width: 1200px !important;
  margin-inline: auto !important;
  padding: 1rem 0 !important;
  border-top: 0 !important;
}
@media (min-width: 1051px) {
  .footer-bottom { width: min(1200px, calc(100% - clamp(5rem, 8vw, 7.5rem))) !important; }
}

/* Brand tagline: clean right-aligned formatting, no stray gaps */
.footer-brand p {
  max-width: 360px !important;
  text-align: start !important;
  text-indent: 0 !important;
  padding-inline-start: 0 !important;
  margin-top: 12px !important;
  line-height: 1.8 !important;
}

/* Ticker: crossfade headlines + segmented progress rail (creative, compact) */


/* ===== v81: thin footer line + robust grid crossfade + self-drawing progress ===== */

/* Footer bottom: thin single line, company right + address left */
.footer-bottom {
  display: flex !important;
  flex-wrap: nowrap !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  width: min(1160px, calc(100% - 120px)) !important;
  max-width: 1200px !important;
  margin-inline: auto !important;
  margin-top: .4rem !important;
  padding: .55rem 0 !important;
  border-top: 0 !important;
  color: rgba(234, 215, 188, .72) !important;
  font-size: 12px !important;
  line-height: 1.4 !important;
}
.footer-bottom span { white-space: nowrap !important; }
@media (min-width: 1051px) {
  .footer-bottom { width: min(1200px, calc(100% - clamp(5rem, 8vw, 7.5rem))) !important; }
}
@media (max-width: 520px) {
  .footer-bottom {
    flex-direction: row !important;
    width: calc(100% - 2rem) !important;
    padding: .5rem 0 !important;
    gap: 8px !important;
    font-size: 11px !important;
  }
}

/* Ticker: robust grid-stacked crossfade (text always visible) */

/* Self-drawing blueprint progress line */


/* ===== v82: premium carousel ticker with glass sheen + clean text ===== */


/* ===== v83: living blueprint — grid crossfade + SVG draw + CAD counter ===== */
/* blueprint grid background (4% opacity) */
/* subtle sheen */

/* copy row: counter + crossfade track */
@keyframes tickerNumTick {
  0% { transform: translateY(-7px); opacity: 0; }
  100% { transform: translateY(0); opacity: 1; }
}

/* crossfade track */

/* blueprint line + nodes */
@keyframes tickerNodePulse {
  0% { box-shadow: 0 0 0 0 rgba(234, 215, 188, .5); }
  70% { box-shadow: 0 0 0 8px rgba(234, 215, 188, 0); }
  100% { box-shadow: 0 0 0 0 rgba(234, 215, 188, 0); }
}


/* ===== v84: minimalist — transparent section, full-bleed thin progress line, centered text ===== */

/* full-bleed thin progress bar (1.5px, like a CAD ruling) */

/* centered copy below the line */


/* ===== v85: thin glossy olive strip (RTL, autoplay) ===== */
/* static gloss sheen */
/* animated gloss sweep (shine) */
@keyframes tickerGloss {
  0% { transform: translateX(-130%) skewX(-18deg); }
  55%, 100% { transform: translateX(340%) skewX(-18deg); }
}

/* crossfade track (RTL, title on the right) */

/* progress dots */


/* ===== v86: bigger one-line titles, tighter strip (no empty space) ===== */


/* ===== v87: remove leftover mobile min-height + match site text size ===== */


/* ===== v88: final ticker + footer headings (clean, single definition) ===== */
/* static gloss sheen (always visible) */
/* animated gloss sweep (visible shine) */
@keyframes tickerGloss {
  0% { transform: translateX(-140%) skewX(-18deg); }
  60%, 100% { transform: translateX(320%) skewX(-18deg); }
}

/* footer headings: match site heading weight */
.footer-col h3 {
  font-weight: 700 !important;
  font-size: 1.125rem !important;
  letter-spacing: 0 !important;
}


/* ===== v89: execution journey as a text box + footer headings match footer text ===== */

/* permanent glass sheen — always visible, never disappears */
/* drop the animated sweep (it was disappearing between slides) */

/* footer headings follow the footer text format (not bold/heading style) */
.footer-col h3 {
  font-weight: 400 !important;
  font-size: 14px !important;
  letter-spacing: 0 !important;
}


/* ===== v90: modal select fields + other-input (planner → 4 dropdowns) ===== */


/* ===== v91: footer slogan indent, planner chip grid, privacy h2 hierarchy ===== */

/* Footer slogan: move it to its own row (below the nav columns) so it does NOT collide
   with the روابط رئيسية links, and align its RTL start with that column's start. */
@media (min-width: 901px) {
  .footer-brand {
    display: contents;
  }
  .footer-brand .footer-logo {
    grid-column: 1;
    grid-row: 1;
    justify-self: start; /* right in RTL */
  }
  .footer-brand p {
    grid-column: 2 / -1;
    grid-row: 2;
    max-width: none !important;
  }
}

/* Planner options: equal 2-column grid on desktop so every question's chips
   align to the same start/end edges (was flex-wrap → ragged left edge). */
@media (min-width: 769px) {
  .home-planner .planner-options {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .home-planner .planner-chip {
    width: 100% !important;
    white-space: normal !important;
  }
}

/* Privacy page: keep h2 subsections clearly smaller/lighter than the page title,
   and separate them from the preceding paragraph (main > .section h2 zeroes top margin). */
.section.policy-page h2 {
  font-size: 1.3rem !important;
  font-weight: 600 !important;
  line-height: 1.5 !important;
  margin-top: 1.9rem !important;
  margin-bottom: 0.85rem !important;
}

/* Mobile footer: keep the tagline start-aligned (right in RTL) with the link columns —
   same start point as "روابط رئيسية" and the section text, never centered. */
@media (max-width: 900px) {
  footer .footer-brand {
    width: 100% !important;
    max-width: 100% !important;
    justify-self: stretch !important;
    margin-inline: 0 !important;
    align-items: flex-start !important;
    text-align: start !important;
  }
  footer .footer-brand .footer-logo {
    align-self: flex-start !important;
    text-align: start !important;
  }
  footer .footer-brand p {
    width: 100% !important;
    max-width: 100% !important;
    align-self: stretch !important;
    margin-inline: 0 !important;
    text-align: start !important;
  }
}

/* v99: supplied section artwork is rendered as olive transparent line art on the site paper. */
.detail-art > img[src$="-transparent-line-art.svg"],
.detail-art > img[src$="-native-line-art.svg"],
.detail-art > img[src$="-approved-transparent.png"],
.detail-art > img[src$="-clean-line-art.png"] {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  filter: none !important;
  mix-blend-mode: normal !important;
  opacity: 1 !important;
  object-fit: contain !important;
}

/* v102 — unified headings, editorial About copy, mirrored English art and centered footer mark. */
:root { --mer-title: clamp(1.28rem, 2.55vw, 2.3rem); --mer-title-line: 1.18; }
main h1:not(.slide-title),
main h2,
main > .section > h2,
main > section > .section-heading h2,
main > section > header h2 {
  font-size: var(--mer-title) !important;
  line-height: var(--mer-title-line) !important;
  white-space: nowrap !important;
  max-inline-size: 100% !important;
  overflow: visible !important;
}
.about-narrative { padding-block-start: clamp(1.5rem, 3vw, 3rem) !important; }
.about-prose { max-width: 76ch; margin-inline: auto; display: grid; gap: 1.05rem; color: var(--muted); font-size: clamp(1rem, 1.15vw, 1.1rem); line-height: 2; text-align: start; }
.about-prose p { margin: 0; }
.site-footer .footer-logo { display: flex !important; justify-content: center !important; align-items: center; width: 100%; }
.site-footer .footer-logo-img { width: clamp(136px, 10vw, 166px) !important; height: auto !important; }
.site-footer .footer-brand { text-align: center; }
/* English remains naturally LTR: copy starts on its left edge and supplied art is not mirrored. */
html[lang="en"] .premium-detail-hero,
html[lang="en"] .premium-detail-hero .detail-copy { direction: ltr !important; text-align: start !important; }
html[lang="en"] .premium-detail-hero .detail-copy { padding-inline-start: 0 !important; padding-inline-end: clamp(1.2rem, 2.4vw, 2rem) !important; border-inline-start: 0 !important; border-inline-end: 1px solid rgb(62 56 34 / 20%) !important; }
/* Remove the faint fixed overlay that made the header edge read as a second layer. */
body::before { opacity: 0 !important; }
/* About: retain the drawing while bringing the approved narrative closer to the title. */
.premium-detail-hero:has(+ .about-narrative) { padding-block: clamp(2rem, 4vw, 3.25rem) !important; }
.premium-detail-hero:has(+ .about-narrative) .detail-art { min-height: clamp(14rem, 22vw, 18rem) !important; }
.about-narrative { padding-block-start: clamp(.8rem, 1.4vw, 1.35rem) !important; }
.site-footer .footer-logo-img { width: clamp(210px, 15vw, 250px) !important; }
@media (max-width: 480px) {
  :root { --mer-title: clamp(1.08rem, 5vw, 1.28rem); }
  .about-prose { line-height: 1.9; }
  footer .footer-brand,
  footer .footer-brand .footer-logo { align-items: center !important; align-self: center !important; text-align: center !important; }
}

/* Dark-preview visual language: beige ink for all linework, symbols and structural rules. */
html[data-theme="dark"] {
  --ink: #ead7bc !important;
  --muted: rgb(234 215 188 / 78%) !important;
  --line: rgb(234 215 188 / 28%) !important;
  --building-line: #ead7bc !important;
  --paper: #302b1b !important;
  --paper-deep: #3e3822 !important;
  --sand: #4b4329 !important;
  --footer: #221e12 !important;
}
html[data-theme="dark"] body { background: linear-gradient(160deg, #252115 0%, #3e3822 48%, #292416 100%) !important; color: #ead7bc !important; }
html[data-theme="dark"] .home-planner,
html[data-theme="dark"] .planner-shell { background-color: transparent !important; }
html[data-theme="dark"] .planner-shell,
html[data-theme="dark"] .planner-step { border-color: rgb(234 215 188 / 22%) !important; }

html[data-theme="dark"] .building-draw {
  color: #ead7bc !important;
  opacity: .52 !important;
}
html[data-theme="dark"] main :is(h1, h2, h3, p, a, strong, label, legend), html[data-theme="dark"] .num-value, html[data-theme="dark"] .kicker {
  color: #ead7bc !important;
}
html[data-theme="dark"] .hero-sub,
html[data-theme="dark"] .planner-step,
html[data-theme="dark"] .planner-step button { color: rgb(234 215 188 / 88%) !important; }
html[data-theme="dark"] .building-svg,
html[data-theme="dark"] .num-icon,
html[data-theme="dark"] .num-separator,
html[data-theme="dark"] .number,
html[data-theme="dark"] .section-mark {
  color: #ead7bc !important;
  border-color: rgb(234 215 188 / 55%) !important;
}
html[data-theme="dark"] .building-svg *,
html[data-theme="dark"] .num-icon *,
html[data-theme="dark"] .section-mark * { stroke: #ead7bc !important; }
html[data-theme="dark"] .hero-art img,
html[data-theme="dark"] .premium-detail-hero .detail-art img,
html[data-theme="dark"] .certs-art img {
  filter: brightness(0) saturate(100%) invert(86%) sepia(17%) saturate(706%) hue-rotate(351deg) brightness(99%) contrast(87%) !important;
  opacity: .94 !important;
}

/* Dark-home rebuild: one opaque, high-contrast system — no transparent section panels. */
html[data-theme="dark"] .hero {
  --art-image: url('../assets/hero-saudi-integrated-complex-transparent-drawing-tight.webp') !important;
  background-image: var(--art-image) !important;
  background-repeat: no-repeat !important;
  background-position: 13% 78% !important;
  background-size: min(62vw, 760px) auto !important;
}
html[data-theme="dark"] .hero-art { display: none !important; }
html[data-theme="dark"] .read-more,
html[data-theme="dark"] .read-more::after { color: #ead7bc !important; border-bottom-color: rgb(234 215 188 / 62%) !important; }
html[data-theme="dark"] .home-planner,
html[data-theme="dark"] .home-planner .planner-shell { background: #302b1b !important; border-color: rgb(234 215 188 / 36%) !important; }
html[data-theme="dark"] .home-planner .planner-step { background: #3e3822 !important; border-color: rgb(234 215 188 / 30%) !important; }
html[data-theme="dark"] .home-planner .planner-step :is(legend, button, label, span) { color: #ead7bc !important; }
html[data-theme="dark"] .home-planner .planner-chip { background: #49432a !important; border-color: rgb(234 215 188 / 38%) !important; }
html[data-theme="dark"] .home-planner .planner-chip:is(:hover, .is-selected, [aria-pressed="true"]) { background: #ead7bc !important; color: #302b1b !important; }
html[data-theme="dark"] .home-planner .planner-chip:is(:hover, .is-selected, [aria-pressed="true"]) * { color: #302b1b !important; }

/* v106: expandable homepage gateway cards */

/* v107/v108: full-section expandable gateway trial with artwork and numbering */

/* v109: homepage gateway numbers use the original number component: one icon per section + soft separator + number */


/* v111: execution ticker arrows — small, transparent, inside the existing strip */
/* Guard against the previous bad insertion ever affecting the planner. */

/* v112 preview: mobile background-art visibility + light isolation for expanded gates */

@media (max-width: 768px) {
  .building-draw {
    opacity: .34 !important;
    pointer-events: none !important;
  }

  /* Closed gates stay open to the background; only the expanded gate gets a soft veil. */

  /* Keep the requirement planner as its own single panel, not a gate card. */
  .home-planner .planner-shell {
    position: relative !important;
    z-index: 2 !important;
  }
}

/* v113 preview: execution controls under the progress dots + minimal mobile veil */
@media (max-width: 768px) {

  /* Remove the veil from the whole gate; place the lighter blur only behind art and copy. */

  /* Barely perceptible separation for copy over the moving facade. */
}

/* v114 preview: precise mobile frames for artwork and individual text boxes */
@media (max-width: 768px) {
  #planner-title,
  .home-planner .concept-heading h2 {
    white-space: nowrap !important;
  }
}

/* v115 preview: final mobile geometry pass */
@media (max-width: 768px) {
  #planner-title,
  .home-planner .concept-heading h2 {
    white-space: nowrap !important;
    font-size: clamp(1rem, 4.4vw, 1.32rem) !important;
    line-height: 1.25 !important;
  }
}

/* v116 preview: site-colored glass surfaces with restrained gradient edges */

/* v117 preview: restore readable one-line heading scale */
@media (max-width: 768px) {
  #planner-title,
  .home-planner .concept-heading h2 {
    font-size: clamp(1.14rem, 5vw, 1.45rem) !important;
    line-height: 1.22 !important;
    letter-spacing: 0 !important;
  }
}

/* v118 preview: hero-scale headings + planner-matched transparent surfaces */
@media (max-width: 768px) {
  #planner-title,
  .home-planner .concept-heading h2 {
    font-size: clamp(1.35rem, 6vw, 1.75rem) !important;
    line-height: 1.2 !important;
    letter-spacing: 0 !important;
    white-space: nowrap !important;
  }
}

/* v121 preview: balanced shared mobile heading scale */
@media (max-width: 768px) {
  .hero h1,
  html[dir='ltr'] .hero h1,
  html[dir='rtl'] .hero h1,
  #planner-title,
  .home-planner .concept-heading h2 {
    font-size: clamp(1.1rem, 5.15vw, 1.55rem) !important;
    line-height: 1.22 !important;
    letter-spacing: 0 !important;
  }
}

/* v122 preview: English expanded copy LTR + remove sector/certificate divider */
html:has(.detail-art img[src*='certificates']) .premium-detail-hero,
html:has(.detail-art img[src*='sector-architectural']) .premium-detail-hero {
  border-bottom: 0 !important;
}

/* v123 preview: balanced translucent surfaces and complete English LTR pass */
@media (max-width: 768px) {
  .home-planner .planner-shell {
    background:
      linear-gradient(135deg, rgba(255, 250, 242, .36), rgba(234, 215, 188, .26)) padding-box,
      linear-gradient(135deg, rgb(62 56 34 / 16%), rgb(234 215 188 / 14%), rgb(62 56 34 / 7%)) border-box !important;
    border: 1px solid transparent !important;
    backdrop-filter: blur(2.5px) saturate(1.03) !important;
    -webkit-backdrop-filter: blur(2.5px) saturate(1.03) !important;
  }
}
html[lang='en'] :where(h1, h2, h3, h4, p, li, strong, span, .kicker, .section-lead, legend, label, dt, dd, a) {
  direction: ltr !important;
  text-align: left !important;
  text-align-last: left !important;
}
html[lang='en'] .site-footer :where(.footer-grid, .footer-brand, .footer-col, .footer-social, .footer-bottom) {
  direction: ltr !important;
  text-align: left !important;
}

/* v124 preview: center the final English planner summary like Arabic */

/* v125 preview: force the final English planner block into a true centered stack */

/* Hero olive typography */
.hero.section-shell .hero-copy > .kicker,
.hero.section-shell .hero-copy > #hero-title,
.hero.section-shell .hero-copy > .hero-sub {
  color: #4f4c39 !important;
}


/* Clean Orascom-style home carousel */

/* v59: Orascom composition — image-proportioned full-bleed hero, bare over-image copy. */

/* v60: restore Orascom-scale viewport hero; asset dimensions remain 3840x2160. */

/* v66: clean fixed hero hierarchy — header, slogan, main title, project title, CTA. */

/* v69: mobile-safe type scale and Arabic controls. */

/* v70: smoother project transitions and touch swipe support. */

/* v71: arrow-only controls, single-line title, full-screen menu, and refined motion. */
/* v72: site-matched heading scale, plain arrows, and Orascom-style full-screen menu. */

/* Keep the legacy menu composition full-width on small screens. */

/* Final mobile drawer state: lock the page, cover the visual viewport, and keep the controls above it. */

/* Final ERA-style mobile menu: one full hero-sized sheet, entering slowly from the physical left edge. */

/* Branded first-paint loader: remains until critical fonts and images are ready. */
.site-loader { position:fixed; inset:0; z-index:3000; display:grid; place-items:center; background:#3e3822; color:#ead7bc; opacity:1; visibility:visible; transition:opacity .55s ease, visibility 0s linear .55s; }
.site-loader.is-hidden { opacity:0; visibility:hidden; pointer-events:none; }
.site-loader-mark { display:grid; justify-items:center; gap:.8rem; font-size:1rem; letter-spacing:.06em; text-align:center; }
.site-loader-mark img { display:block; width:min(15rem,58vw); height:auto; object-fit:contain; }
.site-loader-mark span { font-weight:600; }
@media (prefers-reduced-motion: reduce) { .site-loader { transition-duration:.2s; } }

/* v114: the page itself is the only beige surface below the browser chrome. */

/* v115: restore the approved drawer composition; only deepen the logo ink. */

/* v117: give the language control the same readable surface as the menu logo. */

/* v118: keep the drawer controls on the exact header grid positions. */

/* v120: match the closed header's logo box and remove language translucency. */

/* v122: desktop hero uses the viewport, while the mobile portrait composition stays intact. */
/* Shared component ownership: replaces the retired, conflicting component rules. */
.hero-slider { position:relative; isolation:isolate; width:100%; height:100svh; min-height:540px; overflow:hidden; background:#0e1b17; color:#fffaf2; touch-action:pan-y; }
.hero-slider .swiper-wrapper,.hero-slider .swiper-slide,.hero-slider .slide-bg { position:absolute; inset:0; width:100%; height:100%; margin:0; }
.hero-slider .swiper-slide { visibility:hidden; }
.hero-slider .swiper-slide.is-active,.hero-slider .swiper-slide.is-moving { visibility:visible; }
.hero-slider .slide-img { display:block; width:100%; height:100%; max-width:none; max-height:none; object-fit:cover; filter:none; transform:none; }
.hero-slider .slide-img[src*='mina-camps'] { object-position:50% 65%; }
.hero-slider .slide-img[src*='arafat-camps'] { object-position:50% 46%; }
.hero-slider .slide-img[src*='construction-works'] { object-position:50% 35%; }
.slide-overlay { position:absolute; inset:0; background:linear-gradient(to left,rgb(14 27 23 / .78),transparent 85%); }
html[lang='en'] .slide-overlay { background:linear-gradient(to right,rgb(14 27 23 / .78),transparent 85%); }
.slide-content-container { position:absolute; inset:0; z-index:3; display:flex; align-items:center; padding:120px 7% 110px; pointer-events:none; }
.slide-content { width:min(660px,80%); min-width:0; text-align:start; }
.hero-slider .hero-slogan { font-size:clamp(.95rem,1.5vw,1.25rem); line-height:1.7; margin:0 0 1rem; color:#ead7bc; }
.hero-slider .slide-title { color:#fffaf2; font-size:clamp(2rem,3.7vw,3.4rem); line-height:1.3; white-space:normal; overflow-wrap:normal; max-width:100%; margin:0 0 1rem; }
.slide-project-title { font-size:clamp(1.1rem,1.8vw,1.5rem); color:#fffaf2; line-height:1.6; margin:0 0 1rem; }
.slide-cta { display:inline-flex; min-height:44px; padding:.65rem 1.2rem; align-items:center; border:1px solid #ead7bc; color:#fffaf2; pointer-events:auto; }
.slider-controls-rail { position:absolute; z-index:4; bottom:30px; left:50%; right:auto; transform:translateX(-50%); display:flex; align-items:center; gap:14px; direction:ltr; }
.nav-btn { width:44px; height:44px; border:0; background:transparent; color:#ead7bc; font-size:0; cursor:pointer; }
.nav-btn::before { font-size:32px; }
.next-btn::before { content:'‹'; }
.prev-btn::before { content:'›'; }
.progress-bar { width:90px; height:2px; background:rgb(234 215 188 / .3); }
.progress-fill { height:100%; width:33.333%; margin-left:auto; background:#ead7bc; transition:width .3s; }
.slider-fraction { display:none !important; }
.site-header { --header-pad:clamp(20px,3vw,44px); position:absolute; inset:0 0 auto; z-index:1100; width:100%; display:flex; align-items:center; justify-content:space-between; gap:20px; height:100px; padding:18px var(--header-pad); background:linear-gradient(to bottom,rgb(14 27 23 / .75),transparent); }
.site-header .logo { display:flex; flex:0 0 144px; align-items:center; width:144px; height:64px; z-index:2; }
.site-header .header-logo-img { display:block; width:144px; height:auto; max-height:none; transform:none; filter:none; }
.site-header .desktop-nav { display:none; }
.header-actions { display:flex; align-items:center; gap:12px; }
.language-btn,.theme-toggle { display:inline-flex; align-items:center; justify-content:center; min-height:44px; color:#ead7bc; background:transparent; border:1px solid rgb(234 215 188 / .5); border-radius:24px; padding:6px 12px; font-size:.75rem; }
.theme-toggle { width:44px; padding:0; }
.nav-toggle { display:flex; flex-direction:column; justify-content:center; align-items:center; gap:5px; width:44px; height:44px; background:none; border:0; padding:0; }
.nav-toggle span { display:block; width:26px; height:2px; background:#fffaf2; }
.nav-toggle::before,.nav-toggle::after { content:none; }
.mobile-menu { position:fixed; inset:0; width:100%; height:100dvh; padding:112px max(24px,8%) 24px; display:flex; flex-direction:column; justify-content:safe center; align-items:stretch; gap:10px; background:#f7ead8; color:#3e3822; overflow-y:auto; overscroll-behavior:contain; visibility:hidden; transform:translateX(-100%); transition:transform .55s ease,visibility 0s .55s; }
.mobile-menu > a { color:#3e3822; text-align:start; font-size:clamp(1.1rem,2vw,1.5rem); line-height:1.4; min-height:44px; padding:7px 0; }
.menu-language-label { color:#3e3822; font-size:.8rem; margin-top:12px; }
.menu-language-switch { display:flex; width:190px; padding:2px; background:#fffaf2; border:1px solid #c9b99b; border-radius:24px; }
.menu-language-switch a { flex:1; display:grid; place-items:center; min-height:40px; font-size:.8rem; color:#3e3822; border-radius:22px; }
.menu-language-switch a[aria-current] { background:#3e3822; color:#f7ead8; }
.menu-close { position:absolute; top:28px; inset-inline-end:var(--header-pad); width:44px; height:44px; padding:0; border:0; border-radius:50%; background:#3e3822; color:#f7ead8; font:32px/1 Arial,sans-serif; }
body.menu-open .mobile-menu { visibility:visible; transform:none; transition-delay:0s; }
body.menu-open .site-header .header-logo-img { filter:brightness(.24) sepia(.25) saturate(1.35); }
body.menu-open .nav-toggle { visibility:hidden; }
body.menu-open .site-header .language-btn,body.menu-open .site-header .theme-toggle { visibility:hidden; }
html.menu-open,body.menu-open,body.modal-open { overflow:hidden; }
body.menu-open::after { content:none; }
a:focus-visible,button:focus-visible { outline:2px solid currentColor; outline-offset:4px; }
a:hover,.nav-btn:hover { text-decoration:underline; text-underline-offset:5px; }
.home-gate-grid { display:grid; grid-template-columns:1fr; gap:0; padding-block:2rem; }
.home-gate { display:block; min-width:0; padding:2rem 0; scroll-margin-top:24px; }
.home-gate > div { min-width:0; }
.home-gate .kicker { text-align:start; color:var(--muted); margin:0 0 .5rem; font-size:.8rem; }
.home-gate h2 { text-align:start; white-space:normal; font-size:clamp(1.35rem,2.1vw,2rem); line-height:1.55; margin:0 0 .5rem; color:var(--ink); }
.gate-empty { display:none; }
.gate-expandable[hidden] { display:none; }
.gate-expandable { margin-top:1.5rem; }
.gate-expanded-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(1.5rem,4vw,4rem); align-items:start; }
.gate-expanded-visual { margin:0; min-width:0; padding:0; }
.gate-expanded-visual img { display:block; width:100%; height:auto; max-height:none; object-fit:contain; transform:none; filter:none; }
.gate-expanded-copy { min-width:0; text-align:start; }
.home-gate p:not(.kicker) { display:block; max-width:none; height:auto; max-height:none; overflow:visible; text-overflow:clip; -webkit-line-clamp:unset; white-space:normal; text-align:start; text-align-last:auto; line-height:1.9; color:var(--ink); margin:0 0 1rem; font-size:1rem; }
.gate-mini-grid,.gate-credentials { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.gate-mini-grid article,.gate-credentials > div { min-width:0; padding:1rem; border:1px solid var(--line); border-radius:12px; background:color-mix(in srgb,var(--paper) 65%,transparent); }
.gate-mini-grid article:last-child:nth-child(odd) { grid-column:1/-1; }
.gate-mini-grid strong,.gate-credentials h3 { display:block; margin-bottom:.6rem; color:var(--ink); }
.gate-credentials ul { padding-inline-start:1.3rem; margin:0; line-height:1.9; }
.gate-item-number { margin-bottom:.8rem; }
.gate-toggle { display:inline-flex; align-items:center; min-height:44px; margin:0; padding:.4rem 0; border:0; border-bottom:1px solid currentColor; background:none; color:var(--ink); font:inherit; cursor:pointer; }
.gate-toggle::after { content:'↓'; margin-inline-start:8px; }
.gate-toggle[aria-expanded='true']::after { content:'↑'; }
.gate-toggle [data-toggle-less],.gate-toggle[aria-expanded='true'] [data-toggle-more] { display:none; }
.gate-toggle[aria-expanded='true'] [data-toggle-less] { display:inline; }
.execution-ticker { position:relative; display:grid; gap:8px; padding:1.2rem clamp(1rem,3vw,3rem) .65rem; margin:2rem auto; width:calc(100% - 2 * clamp(20px,5vw,78px)); max-width:1400px; border-radius:15px; background:linear-gradient(145deg,#3e3822,#2c2718); color:#ead7bc; isolation:isolate; touch-action:pan-y; }
.execution-ticker::before { content:''; position:absolute; inset:0; border-radius:inherit; pointer-events:none; background:linear-gradient(120deg,transparent 15%,rgb(255 255 255 / .1) 35%,transparent 70%); }
.ticker-track { display:grid; min-width:0; }
.ticker-track article { grid-area:1/1; display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:1rem; align-items:center; min-width:0; opacity:0; visibility:hidden; transition:opacity .3s; }
.ticker-track article.is-active { opacity:1; visibility:visible; }
.ticker-track article > span { display:none; }
.ticker-track strong { font-size:clamp(1.2rem,2vw,1.7rem); line-height:1.6; color:#ead7bc; }
.ticker-track p { display:block; color:#ead7bc; font-size:.95rem; line-height:1.85; margin:0; white-space:normal; overflow:visible; }
.ticker-controls { display:flex; justify-content:center; align-items:center; gap:12px; min-height:44px; }
.ticker-arrow { display:grid; place-items:center; width:44px; height:44px; padding:0; border:0; background:transparent; color:rgb(234 215 188 / .7); }
.ticker-arrow svg { width:10px; height:16px; }
html[dir='rtl'] .ticker-arrow svg { transform:scaleX(-1); }
.ticker-progress { width:min(180px,38vw); height:2px; background:rgb(234 215 188 / .3); overflow:hidden; }
.ticker-progress-fill { height:100%; width:20%; margin-left:auto; background:#ead7bc; transition:width .3s ease; }
.planner-summary { display:grid; grid-template-columns:1fr; gap:1.25rem; min-width:0; padding:1.5rem 0 0; color:var(--ink); text-align:start; }
.summary-head h3 { font-size:1.25rem; margin:.5rem 0; color:var(--ink); }
.planner-summary .planner-eyebrow { color:var(--muted); }
.planner-summary dl { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem 2rem; margin:0; }
.planner-summary dl > div { display:grid; grid-template-columns:minmax(6rem,.7fr) minmax(0,1fr); gap:1rem; min-width:0; border-bottom:1px solid var(--line); padding:.65rem 0; }
.planner-summary dt,.planner-summary dd { margin:0; min-width:0; white-space:normal; overflow-wrap:anywhere; text-align:start; line-height:1.7; }
.planner-summary dt { color:var(--muted); font-size:.85rem; }
.planner-summary dd { color:var(--ink); font-size:.95rem; }
.planner-submit { grid-column:1/-1; justify-self:start; width:auto; max-width:100%; min-width:0; min-height:44px; padding:.9rem 1.5rem; white-space:normal; text-align:center; background:#3e3822; color:#ead7bc; border:1px solid #746849; border-radius:24px; }
.planner-other { display:block; grid-column:1/-1; width:100%; margin-top:.75rem; color:var(--ink); font-size:.85rem; }
.planner-other input { width:100%; margin-top:.5rem; }
.planner-other[hidden] { display:none; }
.modal[hidden] { display:none; }
.modal { position:fixed; inset:0; z-index:2200; display:grid; place-items:center; padding:16px; background:rgb(0 0 0 / .55); }
.modal-backdrop { position:absolute; inset:0; background:transparent; }
.modal-card,.modal-card.modal-card-v2 { position:relative; width:min(720px,100%); height:auto; min-height:0; max-height:calc(100dvh - 32px); border-radius:18px; border:1px solid var(--line); padding:0; background:var(--paper); color:var(--ink); overflow:auto; overscroll-behavior:contain; }
.modal-close { position:sticky; top:8px; z-index:5; display:block; margin:8px 8px -44px auto; width:44px; height:44px; border:1px solid var(--line); border-radius:50%; background:var(--paper); color:var(--ink); font-size:26px; }
html[dir='rtl'] .modal-close { margin:8px auto -44px 8px; }
.modal-layout { display:block; height:auto; min-height:0; }
.modal-intro { padding:24px 24px 0; background:none; min-height:0; }
.modal-intro h2 { color:var(--ink); font-size:1.45rem; line-height:1.5; margin:0; padding-inline-end:40px; }
.modal-intro > :not(h2) { display:none; }
.modal-form-panel { padding:20px 24px 24px; background:none; overflow:visible; }
.modal-card label { color:var(--ink); font-size:.9rem; }
.modal-card input,.modal-card select,.modal-card textarea { width:100%; min-width:0; min-height:46px; border:1px solid var(--line); background:var(--paper); color:var(--ink); padding:10px 12px; border-radius:8px; font:inherit; }
.modal-card [hidden] { display:none; }
.modal-card input:focus,.modal-card select:focus,.modal-card textarea:focus { outline:2px solid var(--focus); outline-offset:2px; }
.modal-submit { min-height:46px; white-space:normal; background:#3e3822; color:#ead7bc; border:1px solid #746849; }
.modal-card .form-status { color:var(--ink); line-height:1.7; overflow-wrap:anywhere; }
@media (max-width:900px) { .gate-expanded-layout { grid-template-columns:1fr; gap:1.5rem; } .gate-expanded-visual { max-width:600px; width:100%; margin-inline:auto; } .planner-summary dl { grid-template-columns:1fr; } }
@media (max-width:600px) {
 .hero-slider { height:max(620px,90svh); min-height:620px; }
 .hero-slider .slide-img[src*='mina-camps'] { object-position:50% 58%; }
 .hero-slider .slide-img[src*='arafat-camps'] { object-position:52% 48%; }
 .hero-slider .slide-img[src*='construction-works'] { object-position:47% 60%; }
 .slide-content-container { padding:112px 24px 105px; align-items:center; }
 .slide-content { width:100%; }
 .hero-slider .slide-title { font-size:1.75rem; line-height:1.5; }
 .site-header { height:92px; gap:8px; padding:14px 20px; }
 .site-header .logo { flex-basis:120px; width:120px; }
 .site-header .header-logo-img { width:120px; }
 .header-actions { gap:8px; }
 .language-btn { padding:5px 8px; }
 .menu-close { top:24px; }
 .home-gate { padding:1.5rem 0; }
 .home-gate p:not(.kicker) { font-size:.95rem; line-height:1.95; }
 .gate-mini-grid,.gate-credentials { grid-template-columns:1fr; }
 .ticker-track article { grid-template-columns:1fr; gap:.4rem; text-align:start; }
 .ticker-track strong { font-size:1.4rem; }
 .planner-summary dl > div { grid-template-columns:1fr; gap:.25rem; }
 .planner-submit { width:100%; }
 .modal { padding:8px; }
 .modal-card,.modal-card.modal-card-v2 { max-height:calc(100dvh - 16px); }
 .modal-form-panel { padding:16px; }
 .modal-intro { padding:20px 16px 0; }
 .form-pair { grid-template-columns:1fr; }
}
@media (min-width:601px) and (max-height:650px) { .hero-slider { min-height:480px; } .slide-content-container { padding-block:100px 88px; } .hero-slider .slide-title { font-size:2.2rem; } .hero-slider .hero-slogan,.slide-project-title { margin-bottom:.6rem; } }
@media (prefers-reduced-motion:reduce) { .mobile-menu,.progress-fill,.ticker-track article { transition:none; } }
