/* ARLEA shared visual system: calm architectural depth across public pages. */
body.arlea-redesign {
  --ar-system-navy-deep: #07192c;
  --ar-system-navy: #102b47;
  --ar-system-blue-gray: #24425f;
  --ar-system-paper: #f4f5f5;
  --ar-system-ice: #e8edf0;
  --ar-system-dark-line: rgba(226, 232, 236, .18);
  --ar-system-light-line: rgba(25, 43, 66, .16);
  --ar-system-section-space: clamp(96px, 9vw, 152px);
  --ar-system-dark-gradient:
    radial-gradient(ellipse 72% 62% at 84% 18%, rgba(87, 119, 148, .14), transparent 68%),
    linear-gradient(132deg, #07192c 0%, #173552 54%, #0a2138 100%);
  --ar-system-light-gradient:
    radial-gradient(circle at 86% 10%, rgba(94, 118, 140, .09), transparent 32%),
    linear-gradient(145deg, #f7f8f8 0%, #e9edf0 54%, #f6f6f3 100%);
  overflow-x: hidden;
}

body.arlea-redesign main {
  overflow-x: hidden;
}

@supports (overflow: clip) {
  body.arlea-redesign,
  body.arlea-redesign main {
    overflow-x: clip;
  }
}

/* One calm navy language for content-led dark sections. Image-led sections keep
   their photography and receive the same tonal treatment through their overlays. */
body.arlea-redesign .ar-projects,
body.arlea-redesign .ar-model-studio-section,
body.arlea-redesign .ar-about-disciplines,
body.arlea-redesign .ar-cap-services,
body.arlea-redesign .ar-careers-culture,
body.arlea-redesign.ar-projects-page .projects-atlas,
body.arlea-redesign.ar-project-detail-page .project-detail-gallery,
body.arlea-redesign.ar-project-detail-page .project-detail-location,
body.arlea-redesign .ar-business-panel {
  background: var(--ar-system-dark-gradient) !important;
}

body.arlea-redesign .ar-about-place-overlay,
body.arlea-redesign .ar-about-next-overlay,
body.arlea-redesign .ar-cap-next-overlay,
body.arlea-redesign .ar-careers-apply-overlay,
body.arlea-redesign .ar-contact-overlay {
  background:
    linear-gradient(90deg, rgba(6, 21, 36, .96) 0%, rgba(12, 31, 49, .86) 46%, rgba(12, 30, 47, .46) 78%, rgba(6, 19, 32, .34) 100%),
    linear-gradient(0deg, rgba(5, 18, 31, .7), transparent 54%) !important;
}

/* Light sections retain their identity while sharing the same editorial paper. */
body.arlea-redesign .ar-about-intro,
body.arlea-redesign .ar-about-process,
body.arlea-redesign .ar-about-principles,
body.arlea-redesign .ar-cap-intro,
body.arlea-redesign .ar-cap-process,
body.arlea-redesign .ar-careers-intro,
body.arlea-redesign .ar-careers-paths,
body.arlea-redesign .ar-contact-statement,
body.arlea-redesign.ar-projects-page .projects-page-collection,
body.arlea-redesign.ar-project-detail-page .project-detail-overview,
body.arlea-redesign.ar-project-detail-page .project-detail-highlights,
body.arlea-redesign .ar-business-section,
body.arlea-redesign .ar-business-proof {
  background: var(--ar-system-light-gradient) !important;
}

/* Shared editorial rhythm on comparable content sections. */
body.arlea-redesign .ar-about-disciplines,
body.arlea-redesign .ar-cap-services,
body.arlea-redesign .ar-careers-culture,
body.arlea-redesign.ar-projects-page .projects-atlas,
body.arlea-redesign .ar-business-section {
  padding-block: var(--ar-system-section-space);
}

body.arlea-redesign .ar-about-process,
body.arlea-redesign .ar-about-principles,
body.arlea-redesign .ar-cap-process,
body.arlea-redesign .ar-careers-paths,
body.arlea-redesign .ar-business-proof {
  padding-block: clamp(92px, 8.5vw, 146px);
}

/* Brand patterns are atmospheric, large-scale, and kept away from reading areas. */
body.arlea-redesign .ar-about-solid-pattern,
body.arlea-redesign .ar-cap-services-pattern,
body.arlea-redesign .ar-careers-culture-pattern {
  top: 2%;
  right: -10%;
  width: min(50vw, 780px);
  opacity: .04;
  transform: none;
}

body.arlea-redesign .ar-about-place-pattern {
  right: -11%;
  bottom: -20%;
  width: min(49vw, 760px);
  opacity: .055;
  transform: none;
}

body.arlea-redesign .ar-about-hero-pattern,
body.arlea-redesign .ar-cap-hero-pattern,
body.arlea-redesign .ar-business-hero-pattern,
body.arlea-redesign.ar-projects-page .projects-page-hero-grid::after,
body.arlea-redesign.ar-project-detail-page .project-detail-hero::after {
  right: -8%;
  opacity: .06;
  transform: none;
}

/* Home project collection: images lead, while controls remain restrained. */
body.arlea-redesign .ar-projects::before {
  background: none !important;
  opacity: 0 !important;
}

body.arlea-redesign .ar-projects::after {
  left: 62%;
  bottom: -43%;
  width: min(92vw, 1450px);
  opacity: .24;
}

body.arlea-redesign .ar-project-rail {
  gap: clamp(8px, .8vw, 14px) !important;
  padding: 1px;
  background: transparent !important;
}

body.arlea-redesign .ar-project-rail .project-card {
  border: 1px solid rgba(226, 232, 236, .14) !important;
  box-shadow: 0 24px 58px rgba(2, 13, 25, .2) !important;
}

body.arlea-redesign .ar-project-rail .project-card::after {
  background:
    linear-gradient(0deg, rgba(4, 16, 29, .84) 0%, rgba(4, 16, 29, .18) 54%, rgba(4, 16, 29, .08) 100%) !important;
}

body.arlea-redesign .ar-project-arrow {
  border-color: rgba(235, 239, 242, .42);
  background: rgba(6, 23, 39, .68);
  box-shadow: 0 12px 30px rgba(2, 11, 21, .2);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

/* 3D experience: one section-level pattern and a quieter technical grid. */
body.arlea-redesign .ar-model-studio-section::before {
  left: 68%;
  bottom: -34%;
  width: min(88vw, 1380px);
  opacity: .23;
}

body.arlea-redesign .ar-digital-model::before {
  opacity: 0 !important;
}

body.arlea-redesign .ar-model-guide li,
body.arlea-redesign .ar-viewer-shell,
body.arlea-redesign .ar-viewer-sidebar,
body.arlea-redesign .ar-viewer-archive-controls button,
body.arlea-redesign .viewer3d-picker button {
  border-color: var(--ar-system-dark-line) !important;
}

body.arlea-redesign .viewer3d-stage::before {
  background:
    linear-gradient(rgba(255, 255, 255, .025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .025) 1px, transparent 1px),
    radial-gradient(circle at 50% 34%, rgba(255, 255, 255, .1), transparent 46%) !important;
  background-size: 112px 112px, 112px 112px, auto !important;
  opacity: .58;
}

body.arlea-redesign .ar-viewer-shell {
  box-shadow: 0 28px 68px rgba(1, 12, 24, .24) !important;
}

/* Property request: a deliberate light transition and an integrated summary. */
body.arlea-redesign .ar-property-request {
  background: var(--ar-system-light-gradient) !important;
}

body.arlea-redesign .ar-property-request::before {
  opacity: .42;
  -webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, .42), transparent 54%);
  mask-image: linear-gradient(to bottom, rgba(0, 0, 0, .42), transparent 54%);
}

body.arlea-redesign .ar-request-panel {
  border-color: rgba(25, 43, 66, .14);
  background: rgba(248, 249, 249, .95);
  box-shadow: 0 34px 88px rgba(18, 39, 59, .14);
}

body.arlea-redesign .ar-request-summary {
  background:
    radial-gradient(circle at 76% 6%, rgba(88, 119, 147, .18), transparent 35%),
    linear-gradient(155deg, #203b58, #142b43 58%, #0b1d31) !important;
}

body.arlea-redesign .ar-request-summary::after {
  right: -43%;
  bottom: -16%;
  width: 104%;
  opacity: .045;
}

body.arlea-redesign .ar-request-art {
  border-bottom-color: rgba(226, 232, 236, .14);
  background: #18334f;
}

/* Projects index and detail: quieter framing with imagery as the focal point. */
body.arlea-redesign.ar-projects-page .projects-atlas-layout,
body.arlea-redesign.ar-projects-page .projects-atlas-controls,
body.arlea-redesign.ar-projects-page .projects-atlas-list,
body.arlea-redesign.ar-projects-page .projects-atlas-list button {
  border-color: var(--ar-system-dark-line);
}

body.arlea-redesign.ar-projects-page .projects-atlas-layout {
  box-shadow: 0 34px 86px rgba(1, 12, 24, .2);
}

body.arlea-redesign.ar-projects-page .projects-atlas-controls {
  background: rgba(7, 25, 42, .42);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

body.arlea-redesign.ar-projects-page .projects-page-grid {
  gap: clamp(2px, .5vw, 8px);
  background: transparent;
}

body.arlea-redesign.ar-projects-page .projects-page-card {
  box-shadow: 0 24px 58px rgba(10, 26, 42, .12);
}

body.arlea-redesign.ar-projects-page .projects-page-card > a::after {
  background: linear-gradient(180deg, rgba(7, 24, 43, .08) 18%, rgba(7, 24, 43, .88) 100%);
}

body.arlea-redesign.ar-project-detail-page .project-detail-hero-shade {
  background:
    linear-gradient(180deg, rgba(7, 22, 36, .18) 0%, rgba(7, 22, 36, .15) 32%, rgba(7, 22, 36, .9) 100%),
    linear-gradient(90deg, rgba(7, 22, 36, .58), transparent 72%);
}

/* Supporting cards and dividers use the same low-contrast construction lines. */
body.arlea-redesign .ar-about-discipline-grid,
body.arlea-redesign .ar-about-discipline,
body.arlea-redesign .ar-cap-service-grid,
body.arlea-redesign .ar-cap-service,
body.arlea-redesign .ar-careers-values,
body.arlea-redesign .ar-careers-values li {
  border-color: var(--ar-system-dark-line);
}

body.arlea-redesign .ar-about-discipline:hover,
body.arlea-redesign .ar-cap-service:hover {
  background: rgba(255, 255, 255, .035);
}

/* Footer pattern placement complements the shared architectural background. */
body.arlea-redesign .footer.ar-footer::before {
  right: -8%;
  bottom: -22%;
  width: min(51vw, 760px);
  opacity: .05;
}

body.arlea-redesign .ar-footer-grid {
  width: min(calc(100% - clamp(48px, 9vw, 150px)), 1472px);
}

@media (max-width: 1024px) {
  body.arlea-redesign {
    --ar-system-section-space: clamp(84px, 10vw, 118px);
  }

  body.arlea-redesign .ar-about-solid-pattern,
  body.arlea-redesign .ar-cap-services-pattern,
  body.arlea-redesign .ar-careers-culture-pattern,
  body.arlea-redesign .ar-about-place-pattern {
    right: -26%;
    width: min(82vw, 720px);
    opacity: .032;
  }

  body.arlea-redesign .ar-about-hero-pattern,
  body.arlea-redesign .ar-cap-hero-pattern,
  body.arlea-redesign .ar-business-hero-pattern,
  body.arlea-redesign.ar-projects-page .projects-page-hero-grid::after,
  body.arlea-redesign.ar-project-detail-page .project-detail-hero::after {
    right: -24%;
    width: min(80vw, 720px);
    opacity: .045;
  }

  body.arlea-redesign .ar-projects::after,
  body.arlea-redesign .ar-model-studio-section::before {
    left: 67%;
    width: 118vw;
    opacity: .2;
  }

  body.arlea-redesign .ar-request-summary::after {
    right: -18%;
    bottom: -48%;
    width: 68%;
    opacity: .04;
  }
}

@media (max-width: 760px) {
  body.arlea-redesign {
    --ar-system-section-space: clamp(72px, 18vw, 96px);
  }

  body.arlea-redesign .ar-about-process,
  body.arlea-redesign .ar-about-principles,
  body.arlea-redesign .ar-cap-process,
  body.arlea-redesign .ar-careers-paths,
  body.arlea-redesign .ar-business-proof {
    padding-block: clamp(72px, 17vw, 94px);
  }

  body.arlea-redesign .ar-about-solid-pattern,
  body.arlea-redesign .ar-cap-services-pattern,
  body.arlea-redesign .ar-careers-culture-pattern,
  body.arlea-redesign .ar-about-place-pattern {
    right: -42%;
    width: 118vw;
    opacity: .024;
  }

  body.arlea-redesign .ar-projects::after,
  body.arlea-redesign .ar-model-studio-section::before {
    left: 72%;
    bottom: -10%;
    width: 156vw;
    opacity: .15;
  }

  body.arlea-redesign .ar-project-rail .project-card,
  body.arlea-redesign.ar-projects-page .projects-page-card,
  body.arlea-redesign.ar-projects-page .projects-atlas-layout,
  body.arlea-redesign .ar-viewer-shell,
  body.arlea-redesign .ar-request-panel {
    box-shadow: 0 18px 42px rgba(4, 17, 30, .12) !important;
  }

  body.arlea-redesign .ar-footer-grid {
    width: min(calc(100% - 36px), 1472px);
  }

  body.arlea-redesign .footer.ar-footer::before {
    right: -52%;
    bottom: -8%;
    width: 128vw;
    opacity: .02;
  }
}

@media (prefers-contrast: more) {
  body.arlea-redesign {
    --ar-system-dark-line: rgba(238, 242, 245, .38);
    --ar-system-light-line: rgba(25, 43, 66, .3);
  }
}
