/* Shared spacing between major website sections */
:root {
  --site-section-space: 72px;
  --site-divider-color: rgba(199, 169, 119, 0.28);
  --site-divider-width: min(calc(100% - 120px), 1440px);
  --site-section-background: #10110f;
}

/* One separator, with equal space above and below */
.site-section-divider {
  display: block;
  width: 100%;
  margin: 0;
  padding: var(--site-section-space) 0;
  border: 0;
  background: var(--site-section-background);
  box-sizing: border-box;
}

.site-section-divider::before {
  content: "";
  display: block;
  width: var(--site-divider-width);
  height: 1px;
  margin-inline: auto;
  background: var(--site-divider-color);
}

@media (max-width: 950px) {
  :root {
    --site-divider-width: calc(100% - 64px);
  }
}

@media (max-width: 650px) {
  :root {
    --site-section-space: 40px;
    --site-divider-width: calc(100% - 40px);
  }
}
/* Home: profile → Abu Dhabi */
body #profile.personal-profile {
  padding-bottom: 0;
}

body #abu-dhabi.abu-dhabi-section {
  border-top: 0;
}
/* HOME — shared section dividers */

/* The dividers provide spacing around the dark sections */
body.site-layout-home #profile.personal-profile,
body.site-layout-home #consultation.consultation-section {
  padding-top: 0;
  padding-bottom: 0;
  border-top: 0;
  border-bottom: 0;
}

/* Remove the old outer lines from the ivory sections.
   Keep their internal spacing and background. */
body.site-layout-home #abu-dhabi.abu-dhabi-section,
body.site-layout-home #methodology.abu-dhabi-section {
  border-top: 0;
  border-bottom: 0;
}

/* Preserve the entire animated scene */
body.site-layout-home #building-value.building-sketch-section {
  border-top: 0;
  border-bottom: 0;
}

/* The new divider replaces the footer's old top line and gap */
body.site-layout-home #contact.site-footer {
  border-top: 0;
  padding-top: 0;
}
/* DESTINATIONS — shared section dividers */

/* Remove the old decorative separators */
body.site-layout-destinations .hero-bottom[aria-hidden="true"],
body.site-layout-destinations .destinations-footer[aria-hidden="true"] {
  display: none;
}

/* Let the shared dividers provide the outer spacing */
body.site-layout-destinations #destinations.destinations-section,
body.site-layout-destinations #consultation.consultation-section {
  padding-top: 0;
  padding-bottom: 0;
  border-top: 0;
  border-bottom: 0;
}

/* Replace the footer's old top line and spacing */
body.site-layout-destinations #contact.site-footer {
  padding-top: 0;
  border-top: 0;
}
/* AL RAHA — shared section dividers */

/* The shared dividers provide consultation spacing */
body.site-layout-raha #consultation {
  padding-top: 0;
  padding-bottom: 0;
  border-top: 0;
  border-bottom: 0;
}

body.site-layout-raha #consultation .consultation-divider {
  padding-top: 0;
  border-top: 0;
}

/* Replace the footer's old top line and spacing */
body.site-layout-raha #contact.site-footer {
  padding-top: 0;
  border-top: 0;
}
/* MASDAR — shared section dividers */

body.site-layout-masdar #consultation {
  padding-top: 0;
  padding-bottom: 0;
  border-top: 0;
  border-bottom: 0;
}

body.site-layout-masdar #consultation .consultation-divider {
  padding-top: 0;
  border-top: 0;
}

body.site-layout-masdar #contact.site-footer {
  padding-top: 0;
  border-top: 0;
}
/* HUDAYRIYAT — shared section dividers */

body.site-layout-hudayriyat #consultation {
  padding-top: 0;
  padding-bottom: 0;
  border-top: 0;
  border-bottom: 0;
}

body.site-layout-hudayriyat #consultation .consultation-divider {
  padding-top: 0;
  border-top: 0;
}

body.site-layout-hudayriyat #contact.site-footer {
  padding-top: 0;
  border-top: 0;
}
/* SAADIYAT — shared section dividers */

/* Space after the hero comes from the shared divider */
body.site-layout-saadiyat #explore-saadiyat {
  padding-top: 0;
}

/* Space after the interactive map */
body.site-layout-saadiyat .saadiyat-interactive-map {
  padding-bottom: 0;
}

/* Remove old outer spacing from the following sections */
body.site-layout-saadiyat .cultural-journey,
body.site-layout-saadiyat .saadiyat-lifestyle,
body.site-layout-saadiyat #consultation {
  padding-top: 0;
  padding-bottom: 0;
  border-top: 0;
  border-bottom: 0;
}

/* Replace the old lines and spacing inside section wrappers */
body.site-layout-saadiyat .cultural-journey > .container,
body.site-layout-saadiyat .saadiyat-lifestyle > .container,
body.site-layout-saadiyat #consultation .consultation-divider {
  padding-top: 0;
  border-top: 0;
}

/* The new divider provides space after the closing text */
body.site-layout-saadiyat .saadiyat-lifestyle-closing {
  padding-bottom: 0;
}

/* Footer */
body.site-layout-saadiyat #contact.site-footer {
  padding-top: 0;
  border-top: 0;
}
/* NEW LAUNCHES — shared section dividers */

/* Shared dividers provide the spacing between projects */
body.site-layout-launches .launch-project {
  padding-top: 0;
  padding-bottom: 0;
}

/* The last divider provides the footer's top spacing */
body.site-layout-launches #contact.site-footer {
  padding-top: 0;
  border-top: 0;
}
/* PROPERTY TOOLS — shared section dividers */
/* Keep the architectural background visible through the dividers */
body.site-layout-tools .site-section-divider {
  background: transparent;
}

/* Replace the old gap after the introduction */
body.site-layout-tools .tools-hero {
  padding-bottom: 0;
}

/* Shared dividers provide the directory's outer spacing */
body.site-layout-tools .tools-directory {
  padding-top: 0;
  padding-bottom: 0;
}

/* Remove the extra line beneath the directory heading */
body.site-layout-tools .tools-directory-header {
  border-bottom: 0;
}

/* Replace the footer's old line, shadow and upper gap */
body.site-layout-tools #contact.site-footer {
  padding-top: 0;
  border-top: 0;
  box-shadow: none;
}
/* INVESTMENT CALCULATOR — keep its architectural background continuous */
body.site-layout-calculator .site-section-divider {
  background: transparent;
  --site-divider-width: 100%;
}
body.site-layout-calculator .page-introduction {
  padding-bottom: 0;
}
/* INVESTMENT FINDER */
body.site-layout-finder .site-section-divider {
  background: transparent;
}

body.site-layout-finder .tools-hero {
  padding-bottom: 0;
}

body.site-layout-finder .finder-section {
  padding-top: 0;
}
/* Finder: spacing above the full footer */
body.site-layout-finder .finder-section {
  padding-bottom: 0;
}

body.site-layout-finder #contact.site-footer {
  padding-top: 0;
  border-top: 0;
  box-shadow: none;
}
/* Calculator: architectural background continues through the footer divider */
body.site-layout-calculator .site-section-divider {
  background: transparent;
}

body.site-layout-calculator #contact.site-footer {
  padding-top: 0;
  border-top: 0;
  box-shadow: none;
}
/* PORTFOLIO MANAGER */
body.site-layout-portfolio .site-section-divider {
  background: transparent;
}

body.site-layout-portfolio .tools-hero {
  padding-bottom: 0;
}
/* PORTFOLIO MANAGER */
body.site-layout-portfolio .site-section-divider {
  background: transparent;
}

body.site-layout-portfolio .tools-hero {
  padding-bottom: 0;
}

body.site-layout-portfolio .tools-directory {
  padding-bottom: 0;
}

body.site-layout-portfolio #contact.site-footer {
  padding-top: 0;
  border-top: 0;
  box-shadow: none;
}
/* YAS ISLAND — shared section spacing */
body.site-layout-yas .yas-value-section {
  padding-top: 0;
  padding-bottom: 0;
}

body.site-layout-yas .yas-map-section {
  padding-top: 0;
  padding-bottom: 0;
  border-top: 0;
}

body.site-layout-yas .yas-map-section::before {
  content: none;
}

body.site-layout-yas #consultation.consultation-section {
  padding-top: 0;
  padding-bottom: 0;
}

body.site-layout-yas #consultation .consultation-divider {
  padding-top: 0;
  border-top: 0;
}

body.site-layout-yas #contact.site-footer {
  padding-top: 0;
  border-top: 0;
  box-shadow: none;
}
/* AL REEM — shared section spacing */
body.site-layout-reem #reem-map.reem-map-section {
  padding-top: 0;
  padding-bottom: 0;
  border-top: 0;
}

body.site-layout-reem #reem-island-living {
  border-top: 0;
  border-bottom: 0;
}

body.site-layout-reem #consultation.consultation-section {
  padding-top: 0;
  padding-bottom: 0;
}

body.site-layout-reem #consultation .consultation-divider {
  padding-top: 0;
  border-top: 0;
}

body.site-layout-reem #contact.site-footer {
  padding-top: 0;
  border-top: 0;
  box-shadow: none;
}
/* Solid background for tools, account and privacy */
body.tools-premium:is(
  .site-layout-tools,
  .site-layout-calculator,
  .site-layout-finder,
  .site-layout-portfolio
),
body.site-layout-account,
body.site-layout-privacy {
  background: #151613;
}

/* Remove the architectural panels and light streaks */
body.tools-premium:is(
  .site-layout-tools,
  .site-layout-calculator,
  .site-layout-finder,
  .site-layout-portfolio
)::before,
body.tools-premium:is(
  .site-layout-tools,
  .site-layout-calculator,
  .site-layout-finder,
  .site-layout-portfolio
)::after,
body.site-layout-privacy::before {
  content: none;
}

/* Keep section spacing and the subtle gold divider */
body.tools-premium:is(
  .site-layout-tools,
  .site-layout-calculator,
  .site-layout-finder,
  .site-layout-portfolio
) .site-section-divider {
  background: #151613;
}

/* Solid footer without architectural lines */
body.tools-premium:is(
  .site-layout-tools,
  .site-layout-calculator,
  .site-layout-finder,
  .site-layout-portfolio
) #contact.site-footer,
body.site-layout-account #contact.site-footer,
body.site-layout-privacy #contact.privacy-footer {
  background: #10110f;
  box-shadow: none;
}

body.tools-premium:is(
  .site-layout-tools,
  .site-layout-calculator,
  .site-layout-finder,
  .site-layout-portfolio
) #contact.site-footer::before,
body.site-layout-privacy #contact.privacy-footer::before {
  content: none;
}
/* Tool footers — match the Home footer colors */
body.tools-premium:is(
  .site-layout-tools,
  .site-layout-calculator,
  .site-layout-finder,
  .site-layout-portfolio
) #contact.site-footer {
  background: #080907;
  border-top: 0;
  box-shadow: none;
}

body.tools-premium:is(
  .site-layout-tools,
  .site-layout-calculator,
  .site-layout-finder,
  .site-layout-portfolio
) #contact .footer-label,
body.tools-premium:is(
  .site-layout-tools,
  .site-layout-calculator,
  .site-layout-finder,
  .site-layout-portfolio
) #contact .footer-copyright {
  color: rgba(246, 242, 235, 0.48);
}

body.tools-premium:is(
  .site-layout-tools,
  .site-layout-calculator,
  .site-layout-finder,
  .site-layout-portfolio
) #contact .footer-value {
  color: rgba(246, 242, 235, 0.9);
}

body.tools-premium:is(
  .site-layout-tools,
  .site-layout-calculator,
  .site-layout-finder,
  .site-layout-portfolio
) #contact .footer-divider {
  background: rgba(255, 255, 255, 0.18);
}

body.tools-premium:is(
  .site-layout-tools,
  .site-layout-calculator,
  .site-layout-finder,
  .site-layout-portfolio
) #contact .footer-navigation a {
  color: rgba(246, 242, 235, 0.55);
}

body.tools-premium:is(
  .site-layout-tools,
  .site-layout-calculator,
  .site-layout-finder,
  .site-layout-portfolio
) #contact .footer-disclaimer {
  color: rgba(246, 242, 235, 0.28);
}

body.tools-premium:is(
  .site-layout-tools,
  .site-layout-calculator,
  .site-layout-finder,
  .site-layout-portfolio
) #contact .footer-navigation a:hover,
body.tools-premium:is(
  .site-layout-tools,
  .site-layout-calculator,
  .site-layout-finder,
  .site-layout-portfolio
) #contact .footer-value a:hover {
  color: #c7a977;
}
/* TABLET & SMALL LAPTOP — SHARED RESPONSIVE FIX */

@media screen and (min-width: 651px) and (max-width: 1399px) {

  /* HEADER */

  body[class*="site-layout-"] .navigation {
    position: relative;
    gap: 24px;
    flex-wrap: nowrap;
  }

  body[class*="site-layout-"] .navigation > .brand,
  body[class*="site-layout-"] .navigation > div,
  body[class*="site-layout-"] .navigation .navigation-button {
    flex-shrink: 0;
  }

  body[class*="site-layout-"] .navigation .brand-name,
  body[class*="site-layout-"] .navigation .brand-title,
  body[class*="site-layout-"] .navigation .navigation-button {
    white-space: nowrap;
  }

  body[class*="site-layout-"] .navigation .mobile-menu-button {
    display: flex;
    order: 2;
    flex-shrink: 0;
    width: 44px;
    height: 44px;
  }

  /* DROPDOWN NAVIGATION */

  body[class*="site-layout-"] .navigation .navigation-links {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    bottom: auto;
    left: auto;
    z-index: 1000;

    display: flex;
    width: min(320px, calc(100vw - 64px));

    max-height: calc(100vh - 128px);
    max-height: calc(100svh - 128px);

    margin: 0;
    padding: 12px;
    box-sizing: border-box;

    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0;

    overflow-y: auto;
    overscroll-behavior: contain;

    background: #121310;
    border: 1px solid rgba(246, 242, 235, 0.14);
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.35);

    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(-8px);

    transition:
      opacity 200ms ease,
      visibility 200ms ease,
      transform 200ms ease;
  }

  body[class*="site-layout-"] .navigation .navigation-links a {
    display: block;
    min-width: 0;
    min-height: 44px;

    margin: 0;
    padding: 14px 12px;
    box-sizing: border-box;
    flex-shrink: 0;

    border-bottom: 1px solid rgba(246, 242, 235, 0.08);

    font-size: 13px;
    line-height: 1.4;
    white-space: normal;
    overflow-wrap: break-word;
  }

  body[class*="site-layout-"] .navigation .navigation-links a[hidden] {
    display: none !important;
  }

  body[class*="site-layout-"] .navigation .navigation-links a:last-child {
    border-bottom: 0;
  }

  body[class*="site-layout-"] .navigation .navigation-links.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
  }

  body[class*="site-layout-"] .navigation .mobile-menu-button:focus-visible,
  body[class*="site-layout-"] .navigation .navigation-links a:focus-visible {
    outline: 2px solid #c7a977;
    outline-offset: 3px;
  }

  /* HOME — BUILDING SCENE */

  body.site-layout-home #building-value.building-sketch-section {
    --sketch-height: min(820px, 80vh, 72vw);
    --sketch-height: min(820px, 80svh, 72vw);

    min-height: 0;
  }

  body.site-layout-home #building-value .building-sketch-stage {
    height: var(--sketch-height);
    min-height: 0;
    padding: 0;
  }

  body.site-layout-home #building-value .building-sketch-reveal {
    display: flex;
    width: 100%;
    height: 100%;

    align-items: center;
    justify-content: center;

    transform: none;
  }

  body.site-layout-home #building-value .building-sketch-image {
    width: auto;
    height: auto;
    max-width: 96%;
    max-height: 96%;
    object-fit: contain;
  }

  body.site-layout-home #building-value .city-sketch-half {
    bottom: 0;
    width: 50%;
    height: 100%;
  }

  body.site-layout-home #building-value .city-sketch-left {
    left: 0;
  }

  body.site-layout-home #building-value .city-sketch-right {
    right: 0;
  }

  body.site-layout-home #building-value .city-sketch-half img {
    bottom: 0;
    width: 200%;
    height: auto;
    max-width: none;
    object-fit: contain;

    transform:
      translateY(calc(22% - var(--sketch-height) * 0.07));

    transform-origin: center bottom;
  }
}

/* REDUCED MOTION */

@media screen
  and (min-width: 651px)
  and (max-width: 1399px)
  and (prefers-reduced-motion: reduce) {

  body[class*="site-layout-"] .navigation .navigation-links {
    transition: none;
  }
}
/* BUILDING SCENE — LARGE SCREENS */

@media screen and (min-width: 1400px) {

  body.site-layout-home #building-value.building-sketch-section {
    --sketch-height: min(820px, 80vh, 72vw);
    --sketch-height: min(820px, 80svh, 72vw);

    min-height: 0;
  }

  body.site-layout-home #building-value .building-sketch-stage {
    height: var(--sketch-height);
    min-height: 0;
    padding: 0;
  }

  body.site-layout-home #building-value .building-sketch-reveal {
    display: flex;
    width: 100%;
    height: 100%;

    align-items: center;
    justify-content: center;

    transform: none;
  }

  body.site-layout-home #building-value .building-sketch-image {
    width: auto;
    height: auto;
    max-width: 96%;
    max-height: 96%;
    object-fit: contain;
  }

  body.site-layout-home #building-value .city-sketch-half {
    bottom: 0;
    width: 50%;
    height: 100%;
  }

  body.site-layout-home #building-value .city-sketch-left {
    left: 0;
  }

  body.site-layout-home #building-value .city-sketch-right {
    right: 0;
  }

  body.site-layout-home #building-value .city-sketch-half img {
    bottom: 0;
    width: 200%;
    height: auto;
    max-width: none;
    object-fit: contain;

    transform:
      translateY(calc(22% - var(--sketch-height) * 0.07));

    transform-origin: center bottom;
  }
}