/* Homepage-only scene spacing and article depth polish. */
#home-projects,
#home-products,
#home-clients,
#home-articles {
  min-height: 80vh;
  min-height: clamp(620px, 80svh, 920px);
  box-sizing: border-box;
  display: flex;
  align-items: center;
}

#home-projects > .home-projects-showcase__container,
#home-products > .home-products-showcase__container,
#home-clients > .home-clients__container,
#home-articles > .home-blog-modern__container {
  width: min(94%, 1460px);
}

.home-blog-modern--3d {
  position: relative;
  overflow: hidden;
  perspective: 1200px;
  perspective-origin: 50% 44%;
  isolation: isolate;
}

.home-blog-modern--3d::before {
  content: "";
  position: absolute;
  z-index: -1;
  width: min(42vw, 620px);
  aspect-ratio: 1;
  inset-inline-end: -15%;
  top: 8%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(230, 169, 6, .09), rgba(230, 169, 6, 0) 69%);
  pointer-events: none;
}

.home-blog-modern--3d .home-blog-modern__grid {
  perspective: 1150px;
  transform-style: preserve-3d;
}

.home-blog-card.home-blog-card--3d {
  --article-rx: 0deg;
  --article-ry: 0deg;
  --article-lift: 0px;
  --article-sheen-x: 50%;
  --article-sheen-y: 36%;
  position: relative;
  overflow: hidden;
  transform-style: preserve-3d;
  transform: translate3d(0, var(--article-lift), 0) rotateX(var(--article-rx)) rotateY(var(--article-ry));
  transform-origin: 50% 55%;
  will-change: transform;
  backface-visibility: hidden;
  transition: transform .48s cubic-bezier(.2, .75, .2, 1),
              border-color .32s ease,
              box-shadow .42s ease;
}

.home-blog-card--3d::before {
  content: "";
  position: absolute;
  z-index: 4;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(circle at var(--article-sheen-x) var(--article-sheen-y), rgba(255, 255, 255, .28), rgba(255, 255, 255, 0) 36%);
  opacity: 0;
  pointer-events: none;
  mix-blend-mode: screen;
  transition: opacity .32s ease;
}

.home-blog-card--3d::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 18% 8% -12%;
  border-radius: 18px;
  background: rgba(21, 36, 48, .22);
  filter: blur(24px);
  opacity: 0;
  transform: translateZ(-34px);
  pointer-events: none;
  transition: opacity .38s ease;
}

.home-blog-card--3d .home-blog-card__media {
  transform: translateZ(18px) scale(.995);
  transform-style: preserve-3d;
  backface-visibility: hidden;
  transition: transform .48s cubic-bezier(.2, .75, .2, 1);
}

.home-blog-card--3d .home-blog-card__body {
  position: relative;
  z-index: 2;
  transform: translateZ(10px);
  backface-visibility: hidden;
  transition: transform .48s cubic-bezier(.2, .75, .2, 1);
}

.home-blog-card.home-blog-card--3d.is-article-active {
  --article-lift: -8px;
  border-color: rgba(230, 169, 6, .42);
  box-shadow: 0 24px 48px rgba(12, 35, 53, .16), 0 5px 16px rgba(230, 169, 6, .07);
}

.home-blog-card--3d.is-article-active::before,
.home-blog-card--3d.is-article-active::after {
  opacity: 1;
}

.home-blog-card--3d.is-article-active .home-blog-card__media {
  transform: translateZ(30px) scale(1.01);
}

.home-blog-card--3d.is-article-active .home-blog-card__body {
  transform: translateZ(18px);
}

@media (max-width: 767px), (max-width: 920px) and (pointer: coarse) {
  #home-projects,
  #home-products,
  #home-clients,
  #home-articles {
    min-height: 76vh;
    min-height: 76svh;
    display: block;
  }

  .home-blog-modern--3d {
    perspective: none;
  }

  .home-blog-modern--3d .home-blog-modern__grid {
    perspective: none;
    transform-style: flat;
  }

  .home-blog-card.home-blog-card--3d,
  .home-blog-card--3d .home-blog-card__media,
  .home-blog-card--3d .home-blog-card__body {
    transform: none;
    transform-style: flat;
    will-change: auto;
  }

  .home-clients__swiper .home-client-card__logo {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  html.home-mobile-motion-2d .home-mobile-reveal > .home-about-showcase__shell,
  html.home-mobile-motion-2d .home-mobile-reveal > .home-projects-showcase__container,
  html.home-mobile-motion-2d .home-mobile-reveal > .home-products-showcase__container,
  html.home-mobile-motion-2d .home-mobile-reveal > .home-clients__container,
  html.home-mobile-motion-2d .home-mobile-reveal > .home-blog-modern__container {
    opacity: 0;
    transform: translateY(24px) scale(.992);
    transition: opacity .46s ease-out,
                transform .58s cubic-bezier(.22, .72, .24, 1);
  }

  html.home-mobile-motion-2d .home-mobile-reveal.is-mobile-inview > .home-about-showcase__shell,
  html.home-mobile-motion-2d .home-mobile-reveal.is-mobile-inview > .home-projects-showcase__container,
  html.home-mobile-motion-2d .home-mobile-reveal.is-mobile-inview > .home-products-showcase__container,
  html.home-mobile-motion-2d .home-mobile-reveal.is-mobile-inview > .home-clients__container,
  html.home-mobile-motion-2d .home-mobile-reveal.is-mobile-inview > .home-blog-modern__container {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@media (hover: none), (pointer: coarse) {
  .home-blog-card--3d,
  .home-blog-card--3d .home-blog-card__media,
  .home-blog-card--3d .home-blog-card__body {
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .home-blog-card--3d,
  .home-blog-card--3d::before,
  .home-blog-card--3d::after,
  .home-blog-card--3d .home-blog-card__media,
  .home-blog-card--3d .home-blog-card__body,
  html.home-mobile-motion-2d .home-mobile-reveal > .home-about-showcase__shell,
  html.home-mobile-motion-2d .home-mobile-reveal > .home-projects-showcase__container,
  html.home-mobile-motion-2d .home-mobile-reveal > .home-products-showcase__container,
  html.home-mobile-motion-2d .home-mobile-reveal > .home-clients__container,
  html.home-mobile-motion-2d .home-mobile-reveal > .home-blog-modern__container {
    opacity: 1 !important;
    transition: none !important;
    transform: none !important;
  }
}

/* Clients: make the whole circular frame white and center each PNG logo safely with contain. */
#home-clients .home-client-card__logo {
  background: #ffffff;
  border-color: rgba(255, 255, 255, .92);
  box-shadow: 0 18px 42px rgba(0, 0, 0, .20), inset 0 1px 0 rgba(255, 255, 255, .96);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

#home-clients .home-client-card__logo::before {
  inset: 8px;
  border-color: rgba(10, 33, 49, .08);
}

#home-clients .home-client-card__logo::after {
  display: none;
}

#home-clients .home-client-card__plate {
  width: calc(100% - 18px);
  height: calc(100% - 18px);
  padding: 18px;
  border: 0;
  border-radius: 50%;
  background: transparent;
  box-shadow: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

#home-clients .home-client-card__plate img {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  object-position: center;
}

@media (max-width: 991px) {
  #home-clients .home-client-card__plate {
    width: calc(100% - 16px);
    height: calc(100% - 16px);
    padding: 16px;
  }
}

@media (max-width: 600px) {
  #home-clients .home-client-card__plate {
    width: calc(100% - 14px);
    height: calc(100% - 14px);
    padding: 14px;
  }
}

@media (max-width: 360px) {
  #home-clients .home-client-card__plate {
    width: calc(100% - 12px);
    height: calc(100% - 12px);
    padding: 12px;
  }
}
