/* =========================================================
   ARCADIUM V1.0.52 — HOME SHARED / FIGMA CLIENT EDGE SHADOWS
   Loaded on Home for both Arabic and English.
   Visual source: Figma Clients frame 672:1428 with page-sibling ellipses
   672:1452 / 672:1453.
========================================================= */

/* The old page-wide pseudo glows are not part of the approved Clients design.
   Keep them removed so only the two exact Figma edge-shadow SVG images exist. */
body.home-page #main-content.page-edge-glows::before,
body.home-page #main-content.page-edge-glows::after,
body.home-page main.page-edge-glows::before,
body.home-page main.page-edge-glows::after {
  content: none !important;
  display: none !important;
}

@media (min-width: 992px) {
  body.home-page .clients-section {
    /* Figma: client row is exactly 1176px at 1440, x=132. On smaller
       desktop widths it keeps the same 40px physical minimum gutter. */
    --arc-clients-row-width: min(calc(100vw - 80px), 1176px);
    --arc-clients-row-edge: calc((100vw - var(--arc-clients-row-width)) / 2);
    /* Between 992 and 1256 the 1176px row itself scales to viewport-80.
       Scale the exported blur box by the same ratio; from 1256 upward the
       row and shadow stay at their exact Figma sizes. */
    --arc-clients-shadow-w: clamp(135.9px, calc(14.89796vw - 11.918px), 175.2px);
    --arc-clients-shadow-h: clamp(304.9px, calc(33.43537vw - 26.748px), 393.2px);
    --arc-clients-shadow-left-overhang: clamp(87.3px, calc(9.57483vw - 7.660px), 112.6px);
    --arc-clients-shadow-right-overhang: clamp(88.9px, calc(9.74490vw - 7.796px), 114.6px);
    --arc-clients-shadow-left-top: clamp(38.3px, calc(4.20068vw - 3.361px), 49.4px);
    --arc-clients-shadow-right-top: clamp(57.3px, calc(6.28401vw - 5.027px), 73.9px);
    position: relative !important;
    isolation: isolate;
    overflow: visible !important;
  }

  /* Use the real <img src="edge-shadow.svg"> bytes only. Do not synthesize a
     second box-shadow/background/pseudo glow on top of them. */
  body.home-page .clients-section .section-edge-glow {
    position: absolute !important;
    z-index: 5 !important;
    display: block !important;
    visibility: visible !important;
    width: var(--arc-clients-shadow-w) !important;
    height: var(--arc-clients-shadow-h) !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 1 !important;
    background: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    filter: none !important;
    -webkit-clip-path: none !important;
    clip-path: none !important;
    object-fit: fill !important;
    pointer-events: none !important;
    user-select: none !important;
  }

  body.home-page .clients-section .section-edge-glow::before,
  body.home-page .clients-section .section-edge-glow::after,
  body.home-page .clients-section::before,
  body.home-page .clients-section::after,
  body.home-page .clients-row::before,
  body.home-page .clients-row::after {
    content: none !important;
    display: none !important;
  }

  /* Exact 1440 Figma export-box geometry, derived from the 90x308 ellipse
     bounds + the SVG's 42.6px Gaussian-blur expansion:
       left full export  = 19.4px, top = 49.4px
       right full export = 17.4px, top = 73.9px
     Anchor those offsets to the actual responsive row edge instead of the
     viewport, so 1200/1100/1024/992 preserve the same physical relationship. */
  body.home-page .section-edge-glow--clients-left {
    top: var(--arc-clients-shadow-left-top) !important;
    right: auto !important;
    left: calc(var(--arc-clients-row-edge) - var(--arc-clients-shadow-left-overhang)) !important;
  }

  body.home-page .section-edge-glow--clients-right {
    top: var(--arc-clients-shadow-right-top) !important;
    right: calc(var(--arc-clients-row-edge) - var(--arc-clients-shadow-right-overhang)) !important;
    left: auto !important;
  }

  body.home-page .clients-section > :not(.section-edge-glow) {
    position: relative;
    z-index: 3 !important;
  }

  /* The edge fade is the only shadow treatment on these four cards. */
  body.home-page .clients-slider .client-card,
  body.home-page .clients-slider .client-card:hover,
  body.home-page .clients-slider .client-card:focus-within {
    box-shadow: none !important;
  }
}

@media (max-width: 991.98px) {
  body.home-page .clients-section .section-edge-glow {
    display: none !important;
  }
}

/* =========================================================
   ARCADIUM V1.0.54 — CLIENT SHADOW PAINT BOUNDARY
   Keep the exact client edge-shadow SVGs, but never let their long blurred
   export paint over the following Works cards. Works owns the later paint layer.
========================================================= */
@media (min-width: 992px) {
  body.home-page .clients-section .section-edge-glow {
    z-index: 1 !important;
  }
  body.home-page .clients-section > :not(.section-edge-glow) {
    z-index: 3 !important;
  }
  body.home-page .works-section,
  body.home-page .works-stage > .works-section {
    position: relative !important;
    z-index: 8 !important;
    isolation: isolate !important;
    background: #130f28 !important;
  }
}

/* =========================================================
   ARCADIUM V1.0.70 — HOME WORKS COMPACT-DESKTOP CENTERING
   The rigid 1247px Works canvas is scaled as one unit. In Arabic the stage
   inherited RTL, which changes relative left-offset resolution and pushed the
   transformed canvas physically left. Keep the stage's positioning coordinate
   system LTR for both languages; English still mirrors the four columns in its
   own audited layer. Also remove the legacy 80px-gutter max clamp so V1.0.69's
   canonical compact rail is the only outer width owner.
========================================================= */
@media (min-width: 1024px) and (max-width: 1280px) {
  body.home-page .works-stage {
    max-width: var(--arc-compact-desktop-rail) !important;
    direction: ltr !important;
  }
}

/* =========================================================
   ARCADIUM V1.0.71 — TRUSTED CLIENTS FIGMA EDGE SHADOW RESTORE
   Figma stacking order: Clients frame 672:1428, then shadow siblings
   672:1452 / 672:1453, then Works. The shadows therefore paint ABOVE the
   client cards, not behind them. V1.0.54 had inverted that local z-order while
   protecting Works and visually removed the intended edge fade.
========================================================= */
@media (min-width: 992px) {
  body.home-page .clients-section .section-edge-glow {
    z-index: 4 !important;
  }
  body.home-page .clients-section > :not(.section-edge-glow) {
    z-index: 3 !important;
  }
  /* Works remains the next independent paint layer and therefore stays above
     the long blurred export box even though the client fade overlays cards. */
  body.home-page .works-section,
  body.home-page .works-stage > .works-section {
    z-index: 8 !important;
  }
}

/* V1.0.69 changed the real client rail to the canonical compact 1110px rail.
   Scale the exact 175.2×393.2 Figma shadow export from that ACTUAL row width,
   not the superseded viewport-80 row, and preserve the original ~61px card
   overlap on both physical edges. */
@media (min-width: 1024px) and (max-width: 1280px) {
  body.home-page .clients-section {
    --arc-clients-row-width: var(--arc-compact-desktop-rail, min(1110px, calc(100vw - 48px)));
    --arc-clients-row-edge: calc((100vw - var(--arc-clients-row-width)) / 2);
    --arc-clients-shadow-w: clamp(145.404px, calc(14.897959vw - 7.151px), 165.367px);
    --arc-clients-shadow-h: clamp(326.329px, calc(33.435374vw - 16.049px), 371.133px);
    --arc-clients-shadow-left-overhang: clamp(93.450px, calc(9.574830vw - 4.596px), 106.281px);
    --arc-clients-shadow-right-overhang: clamp(95.110px, calc(9.744898vw - 4.678px), 108.168px);
    --arc-clients-shadow-left-top: clamp(40.999px, calc(4.200680vw - 2.016px), 46.628px);
    --arc-clients-shadow-right-top: clamp(61.332px, calc(6.284014vw - 3.016px), 69.753px);
  }
}
