/* Artlantic performance + portfolio glass guard */
img,
video,
iframe {
  max-width: 100%;
}

body.frame-page:not(.home-page) .uid-gallery .uid-thumb,
body.frame-page:not(.home-page) .uid-gallery .uid-vid-card,
body.frame-page:not(.home-page) .uid-gallery .uid-card {
  background:
    linear-gradient(145deg, rgba(255,255,255,0.14), rgba(255,255,255,0.035)),
    rgba(4,24,34,0.34) !important;
  border: 1px solid rgba(154,232,255,0.24) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.16),
    inset 0 -28px 70px rgba(0,0,0,0.18),
    0 20px 56px rgba(0,0,0,0.28),
    0 0 28px rgba(68,216,255,0.10) !important;
  backdrop-filter: blur(16px) saturate(120%) !important;
  -webkit-backdrop-filter: blur(16px) saturate(120%) !important;
}

@supports (content-visibility: auto) {
  body.frame-page:not(.home-page) .uid-gallery .uid-thumb,
  body.frame-page:not(.home-page) .uid-gallery .uid-vid-card,
  body.frame-page:not(.home-page) .uid-gallery .uid-card,
  body.frame-page.home-page .services,
  body.frame-page.home-page .footer-blog-teasers {
    content-visibility: auto;
    contain-intrinsic-size: 1px 620px;
  }
}

/* Loaded after the main stylesheet on portfolio pages, so keep radius locked here too. */
:root {
  --artlantic-compact-radius: 8px;
}

body .latest-project-device,
body .latest-project-screen,
body .latest-project-screen img,
body .latest-project-card,
body .coverflow-wrap,
body .coverflow-stage,
body .coverflow-card,
body .coverflow-card img,
body .portfolio-carousel img,
body .carousel,
body .carousel *,
body.frame-page:not(.home-page) .uid-gallery .uid-thumb,
body.frame-page:not(.home-page) .uid-gallery .uid-vid-card,
body.frame-page:not(.home-page) .uid-gallery .uid-card,
body.frame-page:not(.home-page) .uid-gallery .uid-card-img-wrap,
body.frame-page:not(.home-page) .uid-gallery .uid-card-img,
body.frame-page:not(.home-page) .uid-gallery img,
body.frame-page:not(.home-page) .uid-gallery video,
body.frame-page:not(.home-page) .uxp-img-wrap,
body.frame-page:not(.home-page) .uxp-img-wrap img,
body.frame-page:not(.home-page) .lightbox,
body.frame-page:not(.home-page) .lightbox-content,
body.frame-page:not(.home-page) .lightbox img {
  border-radius: var(--artlantic-compact-radius) !important;
}

body .latest-project-device::before,
body .latest-project-device::after,
body .coverflow-card::before,
body .coverflow-card::after,
body.frame-page:not(.home-page) .uid-gallery .uid-thumb::before,
body.frame-page:not(.home-page) .uid-gallery .uid-thumb::after,
body.frame-page:not(.home-page) .uid-gallery .uid-vid-card::before,
body.frame-page:not(.home-page) .uid-gallery .uid-vid-card::after,
body.frame-page:not(.home-page) .uid-gallery .uid-card::before,
body.frame-page:not(.home-page) .uid-gallery .uid-card::after,
body.frame-page:not(.home-page) .uxp-img-wrap::before,
body.frame-page:not(.home-page) .uxp-img-wrap::after {
  border-radius: var(--artlantic-compact-radius) !important;
}

/* Final portfolio stability pass: avoid delayed relayout/blink while scrolling. */
html body p,
html body .uid-hero p,
html body .uid-info-block p,
html body .uid-gallery p,
html body .latest-project-copy p,
html body .hero-copy p,
html body .service-card p,
html body .blog-card p,
html body .blog-hero p,
html body .about-intro p,
html body .ct-subtitle,
html body .footer-video-copy p {
  font-weight: 400 !important;
}

html body .latest-project-copy p {
  font-size: 16px !important;
}

html body img,
html body video,
html body .latest-project-device,
html body .latest-project-screen,
html body .latest-project-screen img,
html body .latest-project-card,
html body .latest-project-card img,
html body .coverflow-card,
html body .coverflow-card img,
html body .portfolio-carousel img,
html body .service-card,
html body .service-card img,
html body .uid-gallery .uid-thumb,
html body .uid-gallery .uid-vid-card,
html body .uid-gallery .uid-card,
html body .uid-gallery .uid-card-img-wrap,
html body .uid-gallery .uid-card-img,
html body .uid-gallery img,
html body .uid-gallery video,
html body .uid-thumb,
html body .uid-thumb img,
html body .uid-vid-card,
html body .uid-vid-card img,
html body .uid-video-thumb,
html body .uid-card,
html body .uid-card-img-wrap,
html body .uid-card-img,
html body .uxp-img-wrap,
html body .uxp-img-wrap img,
html body .lightbox img {
  border-radius: 8px !important;
}

html body .latest-project-device::before,
html body .coverflow-card::before,
html body .cf-card::before,
html body .uid-gallery .uid-thumb::before,
html body .uid-gallery .uid-vid-card::before,
html body .uid-gallery .uid-card::before,
html body .uid-thumb::before,
html body .uid-vid-card::before,
html body .uid-card::before,
html body .uid-card-img-wrap::before,
html body .uxp-img-wrap::before {
  content: none !important;
  display: none !important;
}

html body .uid-gallery .uid-thumb,
html body .uid-gallery .uid-vid-card,
html body .uid-gallery .uid-card,
html body .uid-gallery .uxp-img-wrap {
  animation: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  content-visibility: visible !important;
  contain-intrinsic-size: auto !important;
  backface-visibility: hidden !important;
  transform: none !important;

  transform-style: flat !important;
  transition:
    transform 1.05s cubic-bezier(0.18, 1.2, 0.28, 1),
    border-color 0.65s ease,
    box-shadow 0.65s ease !important;
  will-change: transform;
}

html body .uid-gallery .uid-thumb:hover,
html body .uid-gallery .uid-vid-card:hover,
html body .uid-gallery .uid-card:hover,
html body .uid-gallery .uxp-img-wrap:hover {
  transform: none !important;

}

html body .uid-gallery .uid-thumb img,
html body .uid-gallery .uid-vid-card img,
html body .uid-gallery .uid-video-thumb,
html body .uid-gallery .uid-card-img,
html body .uid-gallery .uid-card-img-wrap img,
html body .uid-gallery video,
html body .uxp-img-wrap img {
  animation: none !important;
  opacity: 1 !important;
  display: block !important;
  transform: translate3d(0, 0, 0) scale(1) !important;
  transition: filter 0.65s ease !important;
  backface-visibility: hidden !important;
}

/* Absolute final visual lock: every photo/mockup corner must match the 3px frame. */
html body {
  --artlantic-image-radius: 3px;
}

html body img:not(.brand-logo):not(.logo):not(.site-logo):not(.nav-logo):not(.hamburger-icon):not(.store-icon):not(.whatsapp-icon),
html body picture,
html body video,
html body .uid-thumb,
html body .uid-thumb > img,
html body .uid-thumb img,
html body .uid-vid-card,
html body .uid-vid-card > img,
html body .uid-vid-card img,
html body .uid-video-thumb,
html body .uid-card,
html body .uid-card-img,
html body .uid-card-img-wrap,
html body .uid-card-img-wrap > img,
html body .uid-card-img-wrap img,
html body .uxp-img-wrap,
html body .uxp-img-wrap > img,
html body .webdev-card,
html body .webdev-card img,
html body .process-card,
html body .process-card img,
html body .design-process-card,
html body .design-process-card img,
html body .latest-project-device,
html body .latest-project-device img,
html body .latest-project-screen,
html body .latest-project-screen img,
html body .latest-project-card,
html body .latest-project-card img,
html body .latest-project-track img,
html body .latest-projects-track img,
html body .latest-products-track img,
html body .coverflow-card,
html body .coverflow-card img,
html body .cf-card,
html body .cf-card img,
html body .portfolio-carousel img,
html body .portfolio-card,
html body .portfolio-card img,
html body .project-card,
html body .project-card img,
html body .gallery-card,
html body .gallery-card img,
html body .work-card,
html body .work-card img,
html body .device-frame,
html body .device-frame img,
html body .tablet-frame,
html body .tablet-frame img,
html body .browser-frame,
html body .browser-frame img,
html body .lightbox-content,
html body .lightbox-content img {
  border-radius: var(--artlantic-image-radius) !important;
  overflow: hidden !important;
  clip-path: inset(0 round var(--artlantic-image-radius)) !important;
}

html body .uid-thumb::before,
html body .uid-vid-card::before,
html body .uid-card::before,
html body .uid-card-img-wrap::before,
html body .uxp-img-wrap::before,
html body .webdev-card::before,
html body .process-card::before,
html body .design-process-card::before,
html body .latest-project-device::before,
html body .latest-project-screen::before,
html body .coverflow-card::before,
html body .cf-card::before,
html body .portfolio-card::before,
html body .project-card::before,
html body .gallery-card::before,
html body .work-card::before,
html body .device-frame::before,
html body .tablet-frame::before,
html body .browser-frame::before {
  content: none !important;
  display: none !important;
  opacity: 0 !important;
}

html body .uid-thumb::after,
html body .uid-vid-card::after,
html body .uid-card::after,
html body .uid-card-img-wrap::after,
html body .uxp-img-wrap::after,
html body .webdev-card::after,
html body .process-card::after,
html body .design-process-card::after,
html body .latest-project-device::after,
html body .latest-project-screen::after,
html body .coverflow-card::after,
html body .cf-card::after,
html body .portfolio-card::after,
html body .project-card::after,
html body .gallery-card::after,
html body .work-card::after,
html body .device-frame::after,
html body .tablet-frame::after,
html body .browser-frame::after {
  border-radius: var(--artlantic-image-radius) !important;
  clip-path: inset(0 round var(--artlantic-image-radius)) !important;
}

html body p {
  font-weight: 400 !important;
}

/* Absolute final override: this file is loaded last on every page. */
html body .latest-project-device,
html body .latest-project-device *,
html body .latest-project-screen,
html body .latest-project-screen *,
html body .latest-products-card,
html body .latest-products-card *,
html body .latest-products-track a,
html body .latest-products-track img,
html body .coverflow-card,
html body .coverflow-card *,
html body .cf-card,
html body .cf-card *,
html body .portfolio-carousel,
html body .portfolio-carousel *,
html body .uid-gallery .uid-thumb,
html body .uid-gallery .uid-thumb *,
html body .uid-gallery .uid-vid-card,
html body .uid-gallery .uid-vid-card *,
html body .uid-gallery .uid-card,
html body .uid-gallery .uid-card *,
html body .uid-card-img-wrap,
html body .uid-card-img-wrap *,
html body .uxp-img-wrap,
html body .uxp-img-wrap *,
html body .webdev-card,
html body .webdev-card *,
html body .design-process-card,
html body .design-process-card *,
html body .process-card,
html body .process-card *,
html body .portfolio-card,
html body .portfolio-card *,
html body .project-card,
html body .project-card *,
html body .gallery-card,
html body .gallery-card *,
html body .work-card,
html body .work-card *,
html body .device-frame,
html body .device-frame *,
html body .tablet-frame,
html body .tablet-frame *,
html body .browser-frame,
html body .browser-frame *,
html body .lightbox-content,
html body .lightbox-content * {
  border-radius: 8px !important;
}

html body .latest-project-device::before,
html body .latest-project-screen::before,
html body .latest-products-card::before,
html body .coverflow-card::before,
html body .cf-card::before,
html body .portfolio-carousel::before,
html body .uid-gallery .uid-thumb::before,
html body .uid-gallery .uid-vid-card::before,
html body .uid-gallery .uid-card::before,
html body .uid-card-img-wrap::before,
html body .uxp-img-wrap::before,
html body .webdev-card::before,
html body .design-process-card::before,
html body .process-card::before,
html body .device-frame::before,
html body .tablet-frame::before,
html body .browser-frame::before {
  content: none !important;
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  opacity: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body .latest-project-device::after,
html body .latest-project-screen::after,
html body .coverflow-card::after,
html body .cf-card::after,
html body .uid-gallery .uid-thumb::after,
html body .uid-gallery .uid-vid-card::after,
html body .uid-gallery .uid-card::after,
html body .uid-card-img-wrap::after,
html body .uxp-img-wrap::after,
html body .webdev-card::after,
html body .design-process-card::after,
html body .process-card::after,
html body .device-frame::after,
html body .tablet-frame::after,
html body .browser-frame::after {
  border-radius: 8px !important;
}

html body p,
html body p *,
html body .hero-copy p,
html body .section-intro p,
html body .latest-product-copy,
html body .latest-product-copy *,
html body .uid-hero p,
html body .uxp-hero p,
html body .page-hero p,
html body .portfolio-intro p,
html body .about-copy p,
html body .contact-copy p {
  font-size: 16px;
  font-weight: 400 !important;
}

/* Final visual lock: every portfolio/product/carousel image frame stays sharp at 3px. */
html body .latest-project-device,
html body .latest-project-device *,
html body .latest-project-screen,
html body .latest-project-screen *,
html body .latest-products-card,
html body .latest-products-card *,
html body .latest-products-track a,
html body .latest-products-track img,
html body .coverflow-card,
html body .coverflow-card *,
html body .cf-card,
html body .cf-card *,
html body .portfolio-carousel,
html body .portfolio-carousel *,
html body .uid-gallery .uid-thumb,
html body .uid-gallery .uid-thumb *,
html body .uid-gallery .uid-vid-card,
html body .uid-gallery .uid-vid-card *,
html body .uid-gallery .uid-card,
html body .uid-gallery .uid-card *,
html body .uid-card-img-wrap,
html body .uid-card-img-wrap *,
html body .uxp-img-wrap,
html body .uxp-img-wrap *,
html body .webdev-card,
html body .webdev-card *,
html body .design-process-card,
html body .design-process-card *,
html body .service-card,
html body .service-card *,
html body .project-card,
html body .project-card *,
html body .portfolio-card,
html body .portfolio-card *,
html body .gallery-card,
html body .gallery-card *,
html body .work-card,
html body .work-card *,
html body .device-frame,
html body .device-frame *,
html body .tablet-frame,
html body .tablet-frame *,
html body .browser-frame,
html body .browser-frame *,
html body .lightbox-content,
html body .lightbox-content * {
  border-radius: 8px !important;
}

html body .latest-project-device::before,
html body .latest-project-device::after,
html body .latest-project-screen::before,
html body .latest-project-screen::after,
html body .latest-products-card::before,
html body .latest-products-card::after,
html body .coverflow-card::before,
html body .coverflow-card::after,
html body .cf-card::before,
html body .cf-card::after,
html body .portfolio-carousel::before,
html body .portfolio-carousel::after,
html body .uid-gallery .uid-thumb::before,
html body .uid-gallery .uid-thumb::after,
html body .uid-gallery .uid-vid-card::before,
html body .uid-gallery .uid-vid-card::after,
html body .uid-gallery .uid-card::before,
html body .uid-gallery .uid-card::after,
html body .uid-card-img-wrap::before,
html body .uid-card-img-wrap::after,
html body .uxp-img-wrap::before,
html body .uxp-img-wrap::after,
html body .webdev-card::before,
html body .webdev-card::after,
html body .design-process-card::before,
html body .design-process-card::after,
html body .device-frame::before,
html body .device-frame::after,
html body .tablet-frame::before,
html body .tablet-frame::after,
html body .browser-frame::before,
html body .browser-frame::after {
  content: none !important;
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  opacity: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body p,
html body p *,
html body .hero-copy,
html body .hero-copy *,
html body .section-intro,
html body .section-intro *,
html body .latest-product-copy,
html body .latest-product-copy *,
html body .uid-hero p,
html body .uxp-hero p,
html body .page-hero p,
html body .portfolio-intro p,
html body .about-copy p,
html body .contact-copy p {
  font-weight: 400 !important;
}

/* Hard final pass: portfolio/device images must stay at 8px radius, with no notch line. */
html body :is(
  .uid-thumb,
  .uid-thumb img,
  .uid-vid-card,
  .uid-vid-card img,
  .uid-video-thumb,
  .uid-card,
  .uid-card-img-wrap,
  .uid-card-img-wrap img,
  .uid-card-img,
  .uxp-img-wrap,
  .uxp-img-wrap img,
  .uxp-thumb,
  img.uxp-thumb,
  .webdev-card,
  .webdev-card img,
  .latest-project-device,
  .latest-project-screen,
  .latest-project-screen img,
  .latest-project-card,
  .latest-project-card img,
  .latest-products-card,
  .latest-products-card img,
  .latest-products-track a,
  .latest-products-track img,
  .coverflow-card,
  .coverflow-card img,
  .cf-card,
  .cf-card img,
  .portfolio-carousel,
  .portfolio-carousel img,
  .service-card,
  .service-card img,
  .lightbox-content,
  .lightbox-content img
) {
  border-radius: 8px !important;
}

html body :is(
  .uid-thumb,
  .uid-vid-card,
  .uid-card,
  .uid-card-img-wrap,
  .uxp-img-wrap,
  .webdev-card,
  .latest-project-device,
  .latest-project-screen,
  .latest-project-card,
  .latest-products-card,
  .coverflow-card,
  .cf-card,
  .portfolio-carousel,
  .service-card,
  .lightbox-content
)::before,
html body :is(
  .uid-thumb,
  .uid-vid-card,
  .uid-card,
  .uid-card-img-wrap,
  .uxp-img-wrap,
  .webdev-card,
  .latest-project-device,
  .latest-project-screen,
  .latest-project-card,
  .latest-products-card,
  .coverflow-card,
  .cf-card,
  .portfolio-carousel,
  .service-card,
  .lightbox-content
)::after {
  content: none !important;
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  opacity: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Absolute final radius and notch cleanup. This file is loaded last on every page. */
html body {
  --artlantic-radius-final: 3px;
}

html body img,
html body video,
html body picture,
html body figure,
html body .uid-gallery,
html body .uid-gallery > *,
html body .uid-gallery *:not(svg):not(path):not(.uid-admin-del):not(.uid-lightbox-close),
html body .uid-thumb,
html body .uid-thumb img,
html body .uid-thumb video,
html body .uid-thumb-overlay,
html body .uid-vid-card,
html body .uid-vid-card img,
html body .uid-video-thumb,
html body .uid-card,
html body .uid-card-img-wrap,
html body .uid-card-img-wrap img,
html body .uid-card-img,
html body .webdev-card,
html body .webdev-card img,
html body .uxp-grid,
html body .uxp-grid > *,
html body .uxp-img-wrap,
html body .uxp-img-wrap img,
html body img.uxp-thumb,
html body .uxp-thumb,
html body .uxp-img-overlay,
html body .process-card,
html body .process-card img,
html body .design-process-card,
html body .design-process-card img,
html body .portfolio-card,
html body .portfolio-card img,
html body .portfolio-frame,
html body .portfolio-frame img,
html body .project-card,
html body .project-card img,
html body .project-frame,
html body .project-frame img,
html body .device-frame,
html body .device-frame img,
html body .tablet-frame,
html body .tablet-frame img,
html body .browser-frame,
html body .browser-frame img,
html body .latest-project-device,
html body .latest-project-device img,
html body .latest-project-screen,
html body .latest-project-screen img,
html body .latest-project-card,
html body .latest-project-card img,
html body .latest-projects-track a,
html body .latest-projects-track img,
html body .latest-products-carousel,
html body .latest-products-carousel *,
html body .latest-products-track .latest-project-card,
html body .latest-products-track .latest-project-card img,
html body .coverflow-card,
html body .coverflow-card img,
html body .cf-card,
html body .cf-card img,
html body .portfolio-carousel,
html body .portfolio-carousel *,
html body .portfolio-carousel img,
html body .service-card,
html body .service-card img {
  border-radius: var(--artlantic-radius-final) !important;
}

html body .latest-project-device::before,
html body .latest-project-device::after,
html body .latest-project-screen::before,
html body .latest-project-screen::after,
html body .coverflow-card::before,
html body .coverflow-card::after,
html body .cf-card::before,
html body .cf-card::after,
html body .uid-thumb::before,
html body .uid-thumb::after,
html body .uid-vid-card::before,
html body .uid-vid-card::after,
html body .uid-card::before,
html body .uid-card::after,
html body .uid-card-img-wrap::before,
html body .uid-card-img-wrap::after,
html body .uxp-img-wrap::before,
html body .uxp-img-wrap::after,
html body .portfolio-frame::before,
html body .portfolio-frame::after,
html body .project-frame::before,
html body .project-frame::after,
html body .device-frame::before,
html body .device-frame::after,
html body .tablet-frame::before,
html body .tablet-frame::after,
html body .browser-frame::before,
html body .browser-frame::after {
  content: none !important;
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  opacity: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Final site-wide image lock: small rounding everywhere, no fake device notch. */
html body .latest-project-device,
html body .latest-project-screen,
html body .latest-project-screen img,
html body .latest-project-card,
html body .latest-project-card img,
html body .latest-projects-track a,
html body .latest-projects-track img,
html body .latest-project-track a,
html body .latest-project-track img,
html body .coverflow-card,
html body .coverflow-card img,
html body .cf-card,
html body .cf-card img,
html body .portfolio-carousel img,
html body .portfolio-card,
html body .portfolio-card img,
html body .portfolio-grid img,
html body .work-card,
html body .work-card img,
html body .service-card,
html body .service-card img,
html body .uid-gallery .uid-thumb,
html body .uid-gallery .uid-thumb img,
html body .uid-gallery .uid-vid-card,
html body .uid-gallery .uid-vid-card img,
html body .uid-gallery .uid-video-thumb,
html body .uid-gallery .uid-card,
html body .uid-gallery .uid-card-img-wrap,
html body .uid-gallery .uid-card-img-wrap img,
html body .uid-gallery .uid-card-img,
html body .uid-gallery img,
html body .uid-gallery video,
html body .uid-thumb,
html body .uid-thumb img,
html body .uid-vid-card,
html body .uid-vid-card img,
html body .uid-video-thumb,
html body .uid-card,
html body .uid-card-img-wrap,
html body .uid-card-img-wrap img,
html body .uid-card-img,
html body .uxp-card,
html body .uxp-img-wrap,
html body .uxp-img-wrap img,
html body img.uxp-thumb,
html body .uxp-lightbox-img,
html body .design-process-card,
html body .design-process-card img,
html body .process-card,
html body .process-card img,
html body .lightbox,
html body .lightbox-content,
html body .lightbox img {
  border-radius: 8px !important;
}

html body .latest-project-device::before,
html body .coverflow-card::before,
html body .cf-card::before,
html body .uid-gallery .uid-thumb::before,
html body .uid-gallery .uid-vid-card::before,
html body .uid-gallery .uid-card::before,
html body .uid-thumb::before,
html body .uid-vid-card::before,
html body .uid-card::before,
html body .uid-card-img-wrap::before,
html body .uxp-img-wrap::before,
html body .design-process-card::before,
html body .process-card::before {
  content: none !important;
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  opacity: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}

html body p,
html body .inner-page p,
html body .frame-page p,
html body .page-intro p,
html body .hero-copy p,
html body .uid-page p,
html body .uid-intro p,
html body .uid-card p,
html body .uid-thumb p,
html body .latest-project-copy p,
html body .latest-project-card p,
html body .service-card p,
html body .blog-card p {
  font-weight: 400 !important;
}

html body.frame-page:not(.home-page) .uid-gallery .uid-card .uid-card-img-wrap {
  height: var(--wd-frame-h, 280px) !important;
  overflow: hidden !important;
}

html body.frame-page:not(.home-page) .uid-gallery .uid-card .uid-card-img {
  width: 100% !important;
  height: auto !important;
  min-height: var(--wd-frame-h, 280px) !important;
  object-fit: unset !important;
  object-position: top center !important;
  transform: translate3d(0, 0, 0) !important;
  transition: transform var(--web-scroll-duration, 36s) cubic-bezier(0.25, 0.1, 0.25, 1), filter 0.65s ease !important;
  will-change: transform;
}

html body.frame-page:not(.home-page) .uid-gallery .uid-card:hover .uid-card-img {
  transform: translate3d(0, calc(-1 * var(--web-scroll-distance, 0px)), 0) !important;
}

/* 2026-08-25 EOF lock: flat media everywhere, 3px corners, small zoom only. */
html body .uid-gallery,
html body .uid-gallery *,
html body .uxp-img-wrap,
html body .uxp-img-wrap *,
html body .portfolio-card,
html body .portfolio-card *,
html body .project-card,
html body .project-card *,
html body .gallery-card,
html body .gallery-card *,
html body .work-card,
html body .work-card *,
html body .webdev-card,
html body .webdev-card *,
html body .process-card,
html body .process-card *,
html body .design-process-card,
html body .design-process-card *,
html body .latest-project-card,
html body .latest-project-card *,
html body .services .service-card,
html body .services .service-card *,
html body .coverflow-card,
html body .coverflow-card *,
html body .cf-card,
html body .cf-card * {
  perspective: none !important;
  transform-style: flat !important;
  rotate: 0deg !important;
  --tilt-x: 0deg !important;
  --tilt-y: 0deg !important;
  --rx: 0deg !important;
  --ry: 0deg !important;
}

html body .uid-gallery .uid-thumb,
html body .uid-gallery .uid-vid-card,
html body .uid-gallery .uid-card,
html body .uid-card-img-wrap,
html body .uxp-img-wrap,
html body .portfolio-card,
html body .project-card,
html body .gallery-card,
html body .work-card,
html body .webdev-card,
html body .process-card,
html body .design-process-card,
html body .latest-project-card,
html body .latest-project-device,
html body .latest-project-screen,
html body .services .service-card,
html body .coverflow-card,
html body .cf-card,
html body .uid-gallery .uid-thumb:hover,
html body .uid-gallery .uid-vid-card:hover,
html body .uid-gallery .uid-card:hover,
html body .uid-card-img-wrap:hover,
html body .uxp-img-wrap:hover,
html body .portfolio-card:hover,
html body .project-card:hover,
html body .gallery-card:hover,
html body .work-card:hover,
html body .webdev-card:hover,
html body .process-card:hover,
html body .design-process-card:hover,
html body .latest-project-card:hover,
html body .latest-project-card:hover .latest-project-device,
html body .services .service-card:hover,
html body .coverflow-card:hover,
html body .cf-card:hover {
  transform: none !important;
  border-radius: 8px !important;
  overflow: hidden !important;
}

html body .uid-gallery .uid-thumb img,
html body .uid-gallery .uid-vid-card img,
html body .uid-gallery .uid-video-thumb,
html body .uid-gallery .uid-card-img-wrap img,
html body .uid-gallery .uid-card-img,
html body .uxp-img-wrap img,
html body .latest-project-screen img,
html body .services .service-card img,
html body .portfolio-card img,
html body .project-card img,
html body .gallery-card img,
html body .work-card img,
html body .webdev-card img,
html body .process-card img,
html body .design-process-card img,
html body .coverflow-card img,
html body .cf-card img {
  border-radius: 8px !important;
  transform: translate3d(0, 0, 0) scale(1) !important;
  transform-origin: center center !important;
  transition: transform .36s ease, filter .36s ease, opacity .36s ease !important;
}

html body .uid-gallery .uid-thumb:hover img,
html body .uid-gallery .uid-vid-card:hover img,
html body .uid-gallery .uid-vid-card:hover .uid-video-thumb,
html body .uxp-img-wrap:hover img,
html body .latest-project-card:hover .latest-project-screen img,
html body .services .service-card:hover img,
html body .portfolio-card:hover img,
html body .project-card:hover img,
html body .gallery-card:hover img,
html body .work-card:hover img,
html body .webdev-card:hover img,
html body .process-card:hover img,
html body .design-process-card:hover img,
html body .coverflow-card:hover img,
html body .cf-card:hover img {
  transform: translate3d(0, 0, 0) scale(1.025) !important;
}

html body .uid-gallery .uid-card:hover .uid-card-img {
  transform: translate3d(0, calc(-1 * var(--web-scroll-distance, 0px)), 0) scale(1.01) !important;
}

html body .uid-card-img-wrap::before,
html body .uid-card-img-wrap::after,
html body .uxp-img-wrap::before,
html body .uxp-img-wrap::after,
html body .uid-thumb::before,
html body .uid-thumb::after,
html body .uid-vid-card::before,
html body .uid-vid-card::after,
html body .latest-project-device::before,
html body .latest-project-device::after {
  content: none !important;
  display: none !important;
}

/* 2026-08-25 final EOF lock: UI/portfolio frames use App Design-style center zoom. */
html body.frame-page:not(.web-development-page) .uid-gallery .uid-thumb,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-vid-card {
  transform: translate3d(0, 0, 0) scale(1) !important;
  transform-origin: center center !important;
  overflow: hidden !important;
  border-radius: 8px !important;
  transition: transform .6s ease, filter .6s ease, opacity .6s ease !important;
}

html body.frame-page:not(.web-development-page) .uid-gallery .uid-thumb:hover,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-vid-card:hover {
  transform: translate3d(0, -3px, 0) scale(1.015) !important;
  transform-origin: center center !important;
  overflow: hidden !important;
  border-radius: 8px !important;
}

html body.frame-page:not(.web-development-page) .uid-gallery .uid-thumb img,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-vid-card img,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-video-thumb {
  transform: translate3d(0, 0, 0) scale(1) !important;
  transform-origin: center center !important;
  object-position: center center !important;
  border-radius: 8px !important;
  transition: transform .6s ease, filter .5s ease, opacity .5s ease !important;
}

html body.frame-page:not(.web-development-page) .uid-gallery .uid-thumb:hover img,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-vid-card:hover img,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-vid-card:hover .uid-video-thumb {
  transform: translate3d(0, 0, 0) scale(1.6) !important;
}

html body.web-development-page .uid-gallery .uid-card .uid-card-img {
  transition: transform var(--web-scroll-duration, 36s) cubic-bezier(0.25, 0.1, 0.25, 1), filter .65s ease, opacity .65s ease !important;
}

html body.web-development-page .uid-gallery .uid-card:hover .uid-card-img {
  transform: translate3d(0, calc(-1 * var(--web-scroll-distance, 0px)), 0) scale(1) !important;
}
/* Info-block closing copy aligns with the list text above it. */
html body.frame-page:not(.home-page) .uid-info-block > p {
  width: auto !important;
  max-width: none !important;
  margin-left: 20px !important;
  margin-right: 0 !important;
  text-align: left !important;
}

/* Web Development slow hover preview: up, then back down while hovered. */
@keyframes artlanticWebSlowPan {
  from {
    transform: translate3d(0, 0, 0) scale(1);
  }
  to {
    transform: translate3d(0, calc(-1 * var(--web-scroll-distance, 0px)), 0) scale(1);
  }
}

html body.web-development-page .uid-gallery .uid-card .uid-card-img,
html body.web-development-page .uid-gallery .uid-card .uid-card-img-wrap img {
  animation: none !important;
  transform: translate3d(0, 0, 0) scale(1.55) !important;
  transition: transform 1.4s ease-out, filter .65s ease, opacity .65s ease !important;
}

html body.web-development-page .uid-gallery .uid-card:hover .uid-card-img,
html body.web-development-page .uid-gallery .uid-card .uid-card-img-wrap:hover img {
  animation: artlanticWebSlowPan var(--web-scroll-duration, 36s) ease-in-out 0s infinite alternate !important;
}
/* Site-wide image/frame radius lock. */
html body .latest-project-device,
html body .latest-project-screen,
html body .latest-project-screen img,
html body .latest-project-card,
html body .latest-project-card img,
html body .coverflow-wrap,
html body .coverflow-stage,
html body .coverflow-card,
html body .coverflow-card img,
html body .portfolio-carousel img,
html body .carousel,
html body .carousel *,
html body .uid-gallery .uid-thumb,
html body .uid-gallery .uid-vid-card,
html body .uid-gallery .uid-card,
html body .uid-gallery .uid-card-img-wrap,
html body .uid-gallery .uid-card-img,
html body .uid-gallery img,
html body .uid-gallery video,
html body .uid-thumb,
html body .uid-thumb img,
html body .uid-vid-card,
html body .uid-vid-card img,
html body .uid-video-thumb,
html body .uid-card,
html body .uid-card-img-wrap,
html body .uid-card-img,
html body .uxp-img-wrap,
html body .uxp-img-wrap img,
html body .portfolio-card,
html body .portfolio-card img,
html body .project-card,
html body .project-card img,
html body .gallery-card,
html body .gallery-card img,
html body .work-card,
html body .work-card img,
html body .webdev-card,
html body .webdev-card img,
html body .process-card,
html body .process-card img,
html body .design-process-card,
html body .design-process-card img,
html body [class*="portfolio"],
html body [class*="portfolio"] img,
html body [class*="project"],
html body [class*="project"] img,
html body [class*="gallery"],
html body [class*="gallery"] img,
html body [class*="thumb"],
html body [class*="thumb"] img,
html body [class*="screen"],
html body [class*="screen"] img,
html body [class*="mockup"],
html body [class*="mockup"] img,
html body [class*="tablet"],
html body [class*="tablet"] img,
html body [class*="device"],
html body [class*="device"] img,
html body [class*="media"],
html body [class*="media"] img,
html body [class*="image"],
html body [class*="image"] img,
html body [class*="work"],
html body [class*="work"] img,
html body [class*="process"],
html body [class*="process"] img {
  border-radius: 8px !important;
  clip-path: inset(0 round 8px) !important;
  overflow: hidden !important;
}

html body .latest-project-device::before,
html body .latest-project-device::after,
html body .coverflow-card::before,
html body .coverflow-card::after,
html body .uid-gallery .uid-thumb::before,
html body .uid-gallery .uid-thumb::after,
html body .uid-gallery .uid-vid-card::before,
html body .uid-gallery .uid-vid-card::after,
html body .uid-gallery .uid-card::before,
html body .uid-gallery .uid-card::after,
html body .uid-card-img-wrap::before,
html body .uid-card-img-wrap::after,
html body .uxp-img-wrap::before,
html body .uxp-img-wrap::after,
html body [class*="portfolio"]::before,
html body [class*="portfolio"]::after,
html body [class*="project"]::before,
html body [class*="project"]::after,
html body [class*="gallery"]::before,
html body [class*="gallery"]::after,
html body [class*="thumb"]::before,
html body [class*="thumb"]::after,
html body [class*="screen"]::before,
html body [class*="screen"]::after,
html body [class*="mockup"]::before,
html body [class*="mockup"]::after,
html body [class*="tablet"]::before,
html body [class*="tablet"]::after,
html body [class*="device"]::before,
html body [class*="device"]::after,
html body [class*="media"]::before,
html body [class*="media"]::after,
html body [class*="image"]::before,
html body [class*="image"]::after,
html body [class*="work"]::before,
html body [class*="work"]::after,
html body [class*="process"]::before,
html body [class*="process"]::after {
  border-radius: 8px !important;
}
/* 2026-08-26: final Web Development hover scroll lock copied from website.zip. */
html body.web-development-page .uid-gallery .uid-card,
html body.web-development-page .uid-gallery .uid-card:hover {
  border-radius: 8px !important;
  overflow: hidden !important;
  perspective: none !important;
  transform: translate3d(0, 0, 0) !important;
  transform-style: flat !important;
}

html body.web-development-page .uid-gallery .uid-card .uid-card-img-wrap,
html body.web-development-page .uid-gallery .uid-card .uid-card-img-wrap:hover {
  height: 280px !important;
  overflow: hidden !important;
  position: relative !important;
  cursor: none;
  background: rgba(2, 8, 16, 0.72);
  border-radius: 8px !important;
  line-height: 0;
}

html body.web-development-page .uid-gallery .uid-card .uid-card-img,
html body.web-development-page .uid-gallery .uid-card .uid-card-img-wrap img {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 280px !important;
  object-fit: unset !important;
  object-position: top center !important;
  opacity: 1 !important;
  visibility: visible !important;
  border-radius: 8px !important;
  transform: translate3d(0, 0, 0) !important;
  transform-origin: top center !important;
  transition: transform var(--web-scroll-duration, 7s) cubic-bezier(0.25, 0.1, 0.25, 1) !important;
  will-change: transform;
  backface-visibility: hidden;
}

html body.web-development-page .uid-gallery .uid-card:hover .uid-card-img,
html body.web-development-page .uid-gallery .uid-card .uid-card-img-wrap:hover img {
  transform: translate3d(0, calc(-1 * var(--web-scroll-distance, 0px)), 0) !important;
}

@media (max-width: 700px) {
  html body.web-development-page .uid-gallery .uid-card .uid-card-img-wrap,
  html body.web-development-page .uid-gallery .uid-card .uid-card-img-wrap:hover {
    height: 240px !important;
  }

  html body.web-development-page .uid-gallery .uid-card .uid-card-img,
  html body.web-development-page .uid-gallery .uid-card .uid-card-img-wrap img {
    min-height: 240px !important;
  }
}

/* 2026-08-26: Web Development hover scroll copied from website.zip.
   This block stays last so older portfolio/global hover rules cannot override it. */
html body.web-development-page .uid-gallery .uid-card,
html body.web-development-page .uid-gallery .uid-card:hover {
  border-radius: 8px !important;
  overflow: hidden !important;
  perspective: none !important;
  transform: translate3d(0, 0, 0) !important;
  transform-style: flat !important;
}

html body.web-development-page .uid-gallery .uid-card .uid-card-img-wrap,
html body.web-development-page .uid-gallery .uid-card .uid-card-img-wrap:hover {
  height: 280px !important;
  overflow: hidden !important;
  position: relative !important;
  cursor: none;
  background: rgba(2, 8, 16, 0.72);
  border-radius: 8px !important;
  line-height: 0;
}

html body.web-development-page .uid-gallery .uid-card .uid-card-img,
html body.web-development-page .uid-gallery .uid-card .uid-card-img-wrap img {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 280px !important;
  object-fit: unset !important;
  object-position: top center !important;
  opacity: 1 !important;
  visibility: visible !important;
  border-radius: 8px !important;
  transform: translate3d(0, 0, 0) !important;
  transform-origin: top center !important;
  transition: transform var(--web-scroll-duration, 7s) cubic-bezier(0.25, 0.1, 0.25, 1) !important;
  will-change: transform;
  backface-visibility: hidden;
}

html body.web-development-page .uid-gallery .uid-card:hover .uid-card-img,
html body.web-development-page .uid-gallery .uid-card .uid-card-img-wrap:hover img {
  transform: translate3d(0, calc(-1 * var(--web-scroll-distance, 0px)), 0) !important;
}

@media (max-width: 700px) {
  html body.web-development-page .uid-gallery .uid-card .uid-card-img-wrap,
  html body.web-development-page .uid-gallery .uid-card .uid-card-img-wrap:hover {
    height: 240px !important;
  }

  html body.web-development-page .uid-gallery .uid-card .uid-card-img,
  html body.web-development-page .uid-gallery .uid-card .uid-card-img-wrap img {
    min-height: 240px !important;
  }
}

/* 2026-08-26: Web Development reference hover scroll copied from website.zip.
   Scoped only to this page so other portfolio hover styles stay untouched. */
html body.web-development-page .uid-gallery .uid-card,
html body.web-development-page .uid-gallery .uid-card:hover {
  border-radius: 8px !important;
  overflow: hidden !important;
  perspective: none !important;
  transform: translate3d(0, 0, 0) !important;
  transform-style: flat !important;
}

html body.web-development-page .uid-gallery .uid-card .uid-card-img-wrap,
html body.web-development-page .uid-gallery .uid-card .uid-card-img-wrap:hover {
  height: 280px !important;
  overflow: hidden !important;
  position: relative !important;
  cursor: none;
  background: rgba(2, 8, 16, 0.72);
  border-radius: 8px !important;
  line-height: 0;
}

html body.web-development-page .uid-gallery .uid-card .uid-card-img,
html body.web-development-page .uid-gallery .uid-card .uid-card-img-wrap img {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 280px !important;
  object-fit: unset !important;
  object-position: top center !important;
  opacity: 1 !important;
  visibility: visible !important;
  border-radius: 8px !important;
  transform: translate3d(0, 0, 0) !important;
  transform-origin: top center !important;
  transition: transform var(--web-scroll-duration, 7s) cubic-bezier(0.25, 0.1, 0.25, 1) !important;
  will-change: transform;
  backface-visibility: hidden;
}

html body.web-development-page .uid-gallery .uid-card:hover .uid-card-img,
html body.web-development-page .uid-gallery .uid-card .uid-card-img-wrap:hover img {
  transform: translate3d(0, calc(-1 * var(--web-scroll-distance, 0px)), 0) !important;
}

@media (max-width: 700px) {
  html body.web-development-page .uid-gallery .uid-card .uid-card-img-wrap,
  html body.web-development-page .uid-gallery .uid-card .uid-card-img-wrap:hover {
    height: 240px !important;
  }

  html body.web-development-page .uid-gallery .uid-card .uid-card-img,
  html body.web-development-page .uid-gallery .uid-card .uid-card-img-wrap img {
    min-height: 240px !important;
  }
}

/* 2026-08-26 final EOF lock: no perspective tilt anywhere; portfolio images use only a small centered zoom. */
html body.frame-page .uid-gallery .uid-thumb,
html body.frame-page .uid-gallery .uid-vid-card,
html body.frame-page .uid-gallery .uid-card,
html body.frame-page .uid-gallery .uid-card-img-wrap,
html body.frame-page .uxp-img-wrap,
html body.frame-page .portfolio-card,
html body.frame-page .project-card,
html body.frame-page .gallery-card,
html body.frame-page .work-card,
html body.frame-page .process-card,
html body.frame-page .design-process-card {
  border-radius: 8px !important;
  overflow: hidden !important;
  perspective: none !important;
  transform-style: flat !important;
}

html body.frame-page:not(.web-development-page) .uid-gallery .uid-thumb,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-vid-card,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-card,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-card-img-wrap,
html body.frame-page:not(.web-development-page) .uxp-img-wrap,
html body.frame-page:not(.web-development-page) .portfolio-card,
html body.frame-page:not(.web-development-page) .project-card,
html body.frame-page:not(.web-development-page) .gallery-card,
html body.frame-page:not(.web-development-page) .work-card,
html body.frame-page:not(.web-development-page) .process-card,
html body.frame-page:not(.web-development-page) .design-process-card,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-thumb:hover,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-vid-card:hover,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-card:hover,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-card-img-wrap:hover,
html body.frame-page:not(.web-development-page) .uxp-img-wrap:hover,
html body.frame-page:not(.web-development-page) .portfolio-card:hover,
html body.frame-page:not(.web-development-page) .project-card:hover,
html body.frame-page:not(.web-development-page) .gallery-card:hover,
html body.frame-page:not(.web-development-page) .work-card:hover,
html body.frame-page:not(.web-development-page) .process-card:hover,
html body.frame-page:not(.web-development-page) .design-process-card:hover {
  transform: translate3d(0, 0, 0) scale(1) !important;
  rotate: none !important;
}

html body.frame-page:not(.web-development-page) .uid-gallery .uid-thumb img,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-vid-card img,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-video-thumb,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-card-img,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-card-img-wrap img,
html body.frame-page:not(.web-development-page) .uxp-img-wrap img,
html body.frame-page:not(.web-development-page) .portfolio-card img,
html body.frame-page:not(.web-development-page) .project-card img,
html body.frame-page:not(.web-development-page) .gallery-card img,
html body.frame-page:not(.web-development-page) .work-card img,
html body.frame-page:not(.web-development-page) .process-card img,
html body.frame-page:not(.web-development-page) .design-process-card img {
  border-radius: 8px !important;
  object-position: center center !important;
  transform: translate3d(0, 0, 0) scale(1) !important;
  transform-origin: center center !important;
  transition: transform .48s cubic-bezier(.22, .61, .36, 1), filter .35s ease, opacity .35s ease !important;
  will-change: transform;
}

html body.frame-page:not(.web-development-page) .uid-gallery .uid-thumb:hover img,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-vid-card:hover img,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-vid-card:hover .uid-video-thumb,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-card:hover .uid-card-img,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-card-img-wrap:hover img,
html body.frame-page:not(.web-development-page) .uxp-img-wrap:hover img,
html body.frame-page:not(.web-development-page) .portfolio-card:hover img,
html body.frame-page:not(.web-development-page) .project-card:hover img,
html body.frame-page:not(.web-development-page) .gallery-card:hover img,
html body.frame-page:not(.web-development-page) .work-card:hover img,
html body.frame-page:not(.web-development-page) .process-card:hover img,
html body.frame-page:not(.web-development-page) .design-process-card:hover img {
  transform: translate3d(0, 0, 0) scale(1.045) !important;
}

html body.web-development-page .uid-gallery .uid-card,
html body.web-development-page .uid-gallery .uid-card:hover,
html body.web-development-page .uid-gallery .uid-card-img-wrap,
html body.web-development-page .uid-gallery .uid-card-img-wrap:hover {
  border-radius: 8px !important;
  overflow: hidden !important;
  perspective: none !important;
  transform: translate3d(0, 0, 0) scale(1) !important;
  transform-style: flat !important;
}

html body.web-development-page .uid-gallery .uid-card .uid-card-img {
  border-radius: 8px !important;
  transform: translate3d(0, 0, 0) scale(1) !important;
  transform-origin: center top !important;
  transition: transform var(--web-scroll-duration, 120s) cubic-bezier(.25, .1, .25, 1), filter .65s ease, opacity .65s ease !important;
  will-change: transform;
}

html body.web-development-page .uid-gallery .uid-card:hover .uid-card-img {
  transform: translate3d(0, calc(-1 * var(--web-scroll-distance, 0px)), 0) scale(1) !important;
}

html body.frame-page .uid-gallery .uid-card-img-wrap::before,
html body.frame-page .uid-gallery .uid-card-img-wrap::after,
html body.frame-page .uxp-img-wrap::before,
html body.frame-page .uxp-img-wrap::after,
html body.frame-page .uid-gallery .uid-thumb::before,
html body.frame-page .uid-gallery .uid-thumb::after,
html body.frame-page .uid-gallery .uid-vid-card::before,
html body.frame-page .uid-gallery .uid-vid-card::after,
html body.frame-page .latest-project-device::before,
html body.frame-page .latest-project-device::after,
html body.frame-page .latest-project-screen::before,
html body.frame-page .latest-project-screen::after {
  content: none !important;
  display: none !important;
}

/* 2026-08-26 hard lock: portfolio images use centered zoom, no perspective tilt. */
html body.frame-page .uid-gallery .uid-thumb,
html body.frame-page .uid-gallery .uid-vid-card,
html body.frame-page .uid-gallery .uid-card,
html body.frame-page .uid-gallery .uid-card-img-wrap,
html body.frame-page .uxp-img-wrap,
html body.frame-page .portfolio-card,
html body.frame-page .project-card,
html body.frame-page .gallery-card,
html body.frame-page .work-card,
html body.frame-page .webdev-card,
html body.frame-page .process-card,
html body.frame-page .design-process-card,
html body.frame-page .latest-project-card,
html body.frame-page .latest-project-device,
html body.frame-page .latest-project-screen,
html body.frame-page .coverflow-card,
html body.frame-page .cf-card {
  border-radius: 8px !important;
  overflow: hidden !important;
  perspective: none !important;
  transform-style: flat !important;
  rotate: 0deg !important;
}

html body.frame-page:not(.web-development-page) .uid-gallery .uid-thumb,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-thumb:hover,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-vid-card,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-vid-card:hover,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-card,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-card:hover,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-card-img-wrap,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-card-img-wrap:hover,
html body.frame-page:not(.web-development-page) .uxp-img-wrap,
html body.frame-page:not(.web-development-page) .uxp-img-wrap:hover,
html body.frame-page:not(.web-development-page) .portfolio-card,
html body.frame-page:not(.web-development-page) .portfolio-card:hover,
html body.frame-page:not(.web-development-page) .project-card,
html body.frame-page:not(.web-development-page) .project-card:hover,
html body.frame-page:not(.web-development-page) .gallery-card,
html body.frame-page:not(.web-development-page) .gallery-card:hover,
html body.frame-page:not(.web-development-page) .work-card,
html body.frame-page:not(.web-development-page) .work-card:hover,
html body.frame-page:not(.web-development-page) .process-card,
html body.frame-page:not(.web-development-page) .process-card:hover,
html body.frame-page:not(.web-development-page) .design-process-card,
html body.frame-page:not(.web-development-page) .design-process-card:hover {
  transform: translate3d(0, 0, 0) scale(1) !important;
}

html body.frame-page:not(.web-development-page) .uid-gallery .uid-thumb img,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-vid-card img,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-video-thumb,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-card-img,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-card-img-wrap img,
html body.frame-page:not(.web-development-page) .uxp-img-wrap img,
html body.frame-page:not(.web-development-page) .portfolio-card img,
html body.frame-page:not(.web-development-page) .project-card img,
html body.frame-page:not(.web-development-page) .gallery-card img,
html body.frame-page:not(.web-development-page) .work-card img,
html body.frame-page:not(.web-development-page) .process-card img,
html body.frame-page:not(.web-development-page) .design-process-card img {
  border-radius: 8px !important;
  object-position: center center !important;
  transform: translate3d(0, 0, 0) scale(1) !important;
  transform-origin: center center !important;
  transition: transform .48s cubic-bezier(.22, .61, .36, 1), filter .35s ease, opacity .35s ease !important;
  will-change: transform;
}

html body.frame-page:not(.web-development-page) .uid-gallery .uid-thumb:hover img,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-vid-card:hover img,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-vid-card:hover .uid-video-thumb,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-card:hover .uid-card-img,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-card-img-wrap:hover img,
html body.frame-page:not(.web-development-page) .uxp-img-wrap:hover img,
html body.frame-page:not(.web-development-page) .portfolio-card:hover img,
html body.frame-page:not(.web-development-page) .project-card:hover img,
html body.frame-page:not(.web-development-page) .gallery-card:hover img,
html body.frame-page:not(.web-development-page) .work-card:hover img,
html body.frame-page:not(.web-development-page) .process-card:hover img,
html body.frame-page:not(.web-development-page) .design-process-card:hover img {
  transform: translate3d(0, 0, 0) scale(1.045) !important;
}

html body.web-development-page .uid-gallery .uid-card,
html body.web-development-page .uid-gallery .uid-card:hover,
html body.web-development-page .uid-gallery .uid-card-img-wrap,
html body.web-development-page .uid-gallery .uid-card-img-wrap:hover {
  transform: translate3d(0, 0, 0) scale(1) !important;
  perspective: none !important;
  transform-style: flat !important;
}

html body.web-development-page .uid-gallery .uid-card .uid-card-img {
  border-radius: 8px !important;
  transform: translate3d(0, 0, 0) scale(1) !important;
  transform-origin: center top !important;
  transition: transform var(--web-scroll-duration, 120s) cubic-bezier(.25, .1, .25, 1), filter .65s ease, opacity .65s ease !important;
  will-change: transform;
}

html body.web-development-page .uid-gallery .uid-card:hover .uid-card-img {
  transform: translate3d(0, calc(-1 * var(--web-scroll-distance, 0px)), 0) scale(1) !important;
}

html body.frame-page .uid-gallery .uid-card-img-wrap::before,
html body.frame-page .uid-gallery .uid-card-img-wrap::after,
html body.frame-page .uxp-img-wrap::before,
html body.frame-page .uxp-img-wrap::after,
html body.frame-page .uid-gallery .uid-thumb::before,
html body.frame-page .uid-gallery .uid-thumb::after,
html body.frame-page .uid-gallery .uid-vid-card::before,
html body.frame-page .uid-gallery .uid-vid-card::after,
html body.frame-page .latest-project-device::before,
html body.frame-page .latest-project-device::after,
html body.frame-page .latest-project-screen::before,
html body.frame-page .latest-project-screen::after {
  content: none !important;
  display: none !important;
}

/* Final Web Development speed lock: make long portfolio screenshots scroll slowly on hover. */
html body.web-development-page .uid-gallery .uid-card .uid-card-img,
html body.web-development-page .uid-gallery .uid-card-img-wrap img,
html body.web-development-page .webdev-card img {
  transition: transform var(--web-scroll-duration, 36s) cubic-bezier(0.25, 0.1, 0.25, 1), filter .65s ease, opacity .65s ease !important;
}

html body.web-development-page .uid-gallery .uid-card:hover .uid-card-img,
html body.web-development-page .uid-gallery .uid-card-img-wrap:hover img {
  transform: translate3d(0, calc(-1 * var(--web-scroll-distance, 0px)), 0) scale(1) !important;
}

/* 2026-08-25 final lock: portfolio images zoom from center; the grey frame stays still. */
html body.frame-page:not(.web-development-page) .uid-gallery .uid-thumb,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-thumb:hover,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-vid-card,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-vid-card:hover {
  transform: translate3d(0, 0, 0) scale(1) !important;
  transform-origin: center center !important;
  overflow: hidden !important;
  border-radius: 8px !important;
}

html body.frame-page:not(.web-development-page) .uid-gallery .uid-thumb img,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-vid-card img,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-video-thumb {
  transform: translate3d(0, 0, 0) scale(1) !important;
  transform-origin: center center !important;
  object-position: center center !important;
  border-radius: 8px !important;
  transition: transform .36s ease, filter .36s ease, opacity .36s ease !important;
}

html body.frame-page:not(.web-development-page) .uid-gallery .uid-thumb:hover img,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-vid-card:hover img,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-vid-card:hover .uid-video-thumb {
  transform: translate3d(0, 0, 0) scale(1.6) !important;
}

html body.web-development-page .uid-gallery .uid-card .uid-card-img {
  transition: transform var(--web-scroll-duration, 36s) cubic-bezier(0.25, 0.1, 0.25, 1), filter .65s ease, opacity .65s ease !important;
}

html body.web-development-page .uid-gallery .uid-card:hover .uid-card-img {
  transform: translate3d(0, calc(-1 * var(--web-scroll-distance, 0px)), 0) scale(1) !important;
}

/* UI Design: keep the glass frame fixed and zoom the image from its center. */
html body.frame-page:not(.web-development-page) .uid-gallery .uid-thumb,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-thumb:hover,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-vid-card,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-vid-card:hover {
  transform: translate3d(0, 0, 0) scale(1) !important;
  transform-origin: 50% 50% !important;
  overflow: hidden !important;
  border-radius: 8px !important;
}

html body.frame-page:not(.web-development-page) .uid-gallery .uid-thumb img,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-vid-card img,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-video-thumb {
  transform: translate3d(0, 0, 0) scale(1) !important;
  transform-origin: 50% 50% !important;
  object-position: 50% 50% !important;
  border-radius: 8px !important;
  transition: transform .36s ease, filter .36s ease, opacity .36s ease !important;
}

html body.frame-page:not(.web-development-page) .uid-gallery .uid-thumb:hover img,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-vid-card:hover img,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-vid-card:hover .uid-video-thumb {
  transform: translate3d(0, 0, 0) scale(1.025) !important;
}

/* 2026-08-25 UI/portfolio centered hover zoom: frame stays still, image zooms inside it. */
html body.frame-page:not(.home-page) .uid-gallery .uid-thumb,
html body.frame-page:not(.home-page) .uid-gallery .uid-thumb:hover,
html body.frame-page:not(.home-page) .uid-gallery .uid-vid-card,
html body.frame-page:not(.home-page) .uid-gallery .uid-vid-card:hover {
  transform: translate3d(0, 0, 0) scale(1) !important;
  transform-origin: 50% 50% !important;
  overflow: hidden !important;
  border-radius: 8px !important;
}

html body.frame-page:not(.home-page) .uid-gallery .uid-thumb img,
html body.frame-page:not(.home-page) .uid-gallery .uid-vid-card img,
html body.frame-page:not(.home-page) .uid-gallery .uid-video-thumb {
  transform: translate3d(0, 0, 0) scale(1) !important;
  transform-origin: 50% 50% !important;
  object-position: 50% 50% !important;
  border-radius: 8px !important;
  transition: transform .36s ease, filter .36s ease, opacity .36s ease !important;
}

html body.frame-page:not(.home-page) .uid-gallery .uid-thumb:hover img,
html body.frame-page:not(.home-page) .uid-gallery .uid-vid-card:hover img,
html body.frame-page:not(.home-page) .uid-gallery .uid-vid-card:hover .uid-video-thumb {
  transform: translate3d(0, 0, 0) scale(1.025) !important;
}

/* 2026-08-25 final lock: no perspective tilt anywhere, only a small image zoom. */
html body .uid-gallery,
html body .uid-gallery *,
html body .uxp-img-wrap,
html body .uxp-img-wrap *,
html body .portfolio-card,
html body .portfolio-card *,
html body .project-card,
html body .project-card *,
html body .gallery-card,
html body .gallery-card *,
html body .work-card,
html body .work-card *,
html body .webdev-card,
html body .webdev-card *,
html body .process-card,
html body .process-card *,
html body .design-process-card,
html body .design-process-card *,
html body .latest-project-card,
html body .latest-project-card *,
html body .services .service-card,
html body .services .service-card *,
html body .coverflow-card,
html body .coverflow-card *,
html body .cf-card,
html body .cf-card * {
  perspective: none !important;
  transform-style: flat !important;
  rotate: 0deg !important;
  --tilt-x: 0deg !important;
  --tilt-y: 0deg !important;
  --rx: 0deg !important;
  --ry: 0deg !important;
}

html body .uid-gallery .uid-thumb,
html body .uid-gallery .uid-vid-card,
html body .uid-gallery .uid-card,
html body .uxp-img-wrap,
html body .portfolio-card,
html body .project-card,
html body .gallery-card,
html body .work-card,
html body .webdev-card,
html body .process-card,
html body .design-process-card,
html body .latest-project-card,
html body .latest-project-device,
html body .latest-project-screen,
html body .services .service-card,
html body .coverflow-card,
html body .cf-card,
html body .uid-gallery .uid-thumb:hover,
html body .uid-gallery .uid-vid-card:hover,
html body .uid-gallery .uid-card:hover,
html body .uxp-img-wrap:hover,
html body .portfolio-card:hover,
html body .project-card:hover,
html body .gallery-card:hover,
html body .work-card:hover,
html body .webdev-card:hover,
html body .process-card:hover,
html body .design-process-card:hover,
html body .latest-project-card:hover,
html body .latest-project-card:hover .latest-project-device,
html body .services .service-card:hover,
html body .coverflow-card:hover,
html body .cf-card:hover {
  transform: none !important;
  border-radius: 8px !important;
  overflow: hidden !important;
}

html body .uid-gallery .uid-thumb img,
html body .uid-gallery .uid-vid-card img,
html body .uid-gallery .uid-video-thumb,
html body .uid-gallery .uid-card-img-wrap,
html body .uid-gallery .uid-card-img,
html body .uid-gallery .uid-card-img-wrap img,
html body .uxp-img-wrap img,
html body .latest-project-screen img,
html body .services .service-card img,
html body .portfolio-card img,
html body .project-card img,
html body .gallery-card img,
html body .work-card img,
html body .webdev-card img,
html body .process-card img,
html body .design-process-card img,
html body .coverflow-card img,
html body .cf-card img {
  border-radius: 8px !important;
  transform: translate3d(0, 0, 0) scale(1) !important;
  transform-origin: center center !important;
  transition: transform .36s ease, filter .36s ease, opacity .36s ease !important;
}

html body .uid-gallery .uid-thumb:hover img,
html body .uid-gallery .uid-vid-card:hover img,
html body .uid-gallery .uid-vid-card:hover .uid-video-thumb,
html body .uxp-img-wrap:hover img,
html body .latest-project-card:hover .latest-project-screen img,
html body .services .service-card:hover img,
html body .portfolio-card:hover img,
html body .project-card:hover img,
html body .gallery-card:hover img,
html body .work-card:hover img,
html body .webdev-card:hover img,
html body .process-card:hover img,
html body .design-process-card:hover img,
html body .coverflow-card:hover img,
html body .cf-card:hover img {
  transform: translate3d(0, 0, 0) scale(1.025) !important;
}

html body .uid-gallery .uid-card:hover .uid-card-img {
  transform: translate3d(0, calc(-1 * var(--web-scroll-distance, 0px)), 0) scale(1.01) !important;
}

html body .uid-card-img-wrap::before,
html body .uid-card-img-wrap::after,
html body .uxp-img-wrap::before,
html body .uxp-img-wrap::after,
html body .uid-thumb::before,
html body .uid-thumb::after,
html body .uid-vid-card::before,
html body .uid-vid-card::after,
html body .latest-project-device::before,
html body .latest-project-device::after {
  content: none !important;
  display: none !important;
}

html body p,
html body .hero-copy,
html body .inner-page p,
html body .uid-copy p,
html body .latest-project-card p,
html body .project-card p,
html body .portfolio-card p,
html body .store-product-card p {
  font-weight: 400 !important;
}

/* 2026-08-25 final flat-media override: no perspective tilt anywhere on images/portfolio items. */
html body {
  --artlantic-image-radius: 3px;
  --artlantic-hover-zoom: 1.025;
}

html body .uid-gallery,
html body .uid-gallery *,
html body .uxp-img-wrap,
html body .uxp-img-wrap *,
html body .process-card,
html body .process-card *,
html body .design-process-card,
html body .design-process-card *,
html body .portfolio-card,
html body .portfolio-card *,
html body .project-card,
html body .project-card *,
html body .gallery-card,
html body .gallery-card *,
html body .work-card,
html body .work-card *,
html body .webdev-card,
html body .webdev-card *,
html body .latest-project-card,
html body .latest-project-card *,
html body .latest-project-device,
html body .latest-project-device *,
html body .coverflow-card,
html body .coverflow-card *,
html body .cf-card,
html body .cf-card * {
  perspective: none !important;
  transform-style: flat !important;
  rotate: 0deg !important;
}

html body .uid-gallery .uid-thumb,
html body .uid-gallery .uid-vid-card,
html body .uid-gallery .uid-card,
html body .uid-gallery article,
html body .uid-gallery figure,
html body .uid-gallery [class*="tilt"],
html body .uxp-img-wrap,
html body .process-card,
html body .design-process-card,
html body .portfolio-card,
html body .project-card,
html body .gallery-card,
html body .work-card,
html body .webdev-card,
html body .latest-project-card,
html body .latest-project-device,
html body .coverflow-card,
html body .cf-card,
html body .uid-gallery .uid-thumb:hover,
html body .uid-gallery .uid-vid-card:hover,
html body .uid-gallery .uid-card:hover,
html body .uid-gallery article:hover,
html body .uid-gallery figure:hover,
html body .uid-gallery [class*="tilt"]:hover,
html body .uxp-img-wrap:hover,
html body .process-card:hover,
html body .design-process-card:hover,
html body .portfolio-card:hover,
html body .project-card:hover,
html body .gallery-card:hover,
html body .work-card:hover,
html body .webdev-card:hover,
html body .latest-project-card:hover,
html body .latest-project-card:hover .latest-project-device,
html body .coverflow-card:hover,
html body .cf-card:hover {
  transform: none !important;
}

html body .uid-gallery .uid-thumb,
html body .uid-gallery .uid-vid-card,
html body .uid-gallery .uid-card,
html body .uxp-img-wrap,
html body .process-card,
html body .design-process-card,
html body .portfolio-card,
html body .project-card,
html body .gallery-card,
html body .work-card,
html body .webdev-card,
html body .latest-project-device,
html body .latest-project-screen,
html body .coverflow-card,
html body .cf-card,
html body .uid-gallery .uid-thumb img,
html body .uid-gallery .uid-vid-card img,
html body .uid-gallery .uid-video-thumb,
html body .uid-gallery .uid-card-img,
html body .uxp-img-wrap img.uxp-thumb,
html body .process-card img,
html body .design-process-card img,
html body .portfolio-card img,
html body .project-card img,
html body .gallery-card img,
html body .work-card img,
html body .webdev-card img,
html body .latest-project-screen img,
html body .coverflow-card img,
html body .cf-card img {
  border-radius: var(--artlantic-image-radius) !important;
  clip-path: inset(0 round var(--artlantic-image-radius)) !important;
}

html body .uid-gallery .uid-thumb::before,
html body .uid-gallery .uid-vid-card::before,
html body .uid-gallery .uid-card::before,
html body .uxp-img-wrap::before,
html body .process-card::before,
html body .design-process-card::before,
html body .portfolio-card::before,
html body .project-card::before,
html body .gallery-card::before,
html body .work-card::before,
html body .webdev-card::before,
html body .latest-project-device::before,
html body .latest-project-screen::before,
html body .coverflow-card::before,
html body .cf-card::before {
  content: none !important;
  display: none !important;
}

html body .uid-gallery .uid-thumb img,
html body .uid-gallery .uid-vid-card img,
html body .uid-gallery .uid-video-thumb,
html body .uxp-img-wrap img.uxp-thumb,
html body .process-card img,
html body .design-process-card img,
html body .portfolio-card img,
html body .project-card img,
html body .gallery-card img,
html body .work-card img,
html body .webdev-card img,
html body .latest-project-screen img,
html body .coverflow-card img,
html body .cf-card img {
  transform: translate3d(0, 0, 0) scale(1) !important;
  transform-origin: center center !important;
  transition: transform 420ms ease, opacity 420ms ease, filter 420ms ease !important;
}

html body .uid-gallery .uid-thumb:hover img,
html body .uid-gallery .uid-vid-card:hover img,
html body .uid-gallery .uid-vid-card:hover .uid-video-thumb,
html body .uxp-img-wrap:hover img.uxp-thumb,
html body .process-card:hover img,
html body .design-process-card:hover img,
html body .portfolio-card:hover img,
html body .project-card:hover img,
html body .gallery-card:hover img,
html body .work-card:hover img,
html body .webdev-card:hover img,
html body .latest-project-card:hover .latest-project-screen img,
html body .coverflow-card:hover img,
html body .cf-card:hover img {
  transform: translate3d(0, 0, 0) scale(var(--artlantic-hover-zoom)) !important;
}

html body .uid-gallery .uid-card .uid-card-img {
  transform: translate3d(0, 0, 0) scale(1) !important;
}

html body .uid-gallery .uid-card:hover .uid-card-img {
  transform: translate3d(0, calc(-1 * var(--web-scroll-distance, 0px)), 0) scale(1.01) !important;
}

/* ABSOLUTE LAST OVERRIDE 2026-08-25: remove portfolio perspective tilt everywhere. */
html body .uid-gallery,
html body .uid-gallery *,
html body .uid-gallery > *,
html body .uid-gallery article,
html body .uid-gallery figure,
html body .uid-gallery .uid-item,
html body .uid-gallery .uid-project,
html body .uid-gallery .uid-card-inner,
html body .uid-gallery .portfolio-item,
html body .uid-gallery [class*="tilt"],
html body .uid-gallery .uid-thumb,
html body .uid-gallery .uid-vid-card,
html body .uid-gallery .uid-card,
html body .uxp-img-wrap,
html body .process-card,
html body .design-process-card,
html body .portfolio-card,
html body .project-card,
html body .gallery-card,
html body .work-card,
html body .webdev-card {
  perspective: none !important;
  transform-style: flat !important;
  rotate: 0deg !important;
}

html body .uid-gallery > *,
html body .uid-gallery article,
html body .uid-gallery figure,
html body .uid-gallery .uid-item,
html body .uid-gallery .uid-project,
html body .uid-gallery .uid-card-inner,
html body .uid-gallery .portfolio-item,
html body .uid-gallery [class*="tilt"],
html body .uid-gallery .uid-thumb,
html body .uid-gallery .uid-vid-card,
html body .uid-gallery .uid-card,
html body .uxp-img-wrap,
html body .process-card,
html body .design-process-card,
html body .portfolio-card,
html body .project-card,
html body .gallery-card,
html body .work-card,
html body .webdev-card,
html body .uid-gallery > *:hover,
html body .uid-gallery article:hover,
html body .uid-gallery figure:hover,
html body .uid-gallery .uid-item:hover,
html body .uid-gallery .uid-project:hover,
html body .uid-gallery .uid-card-inner:hover,
html body .uid-gallery .portfolio-item:hover,
html body .uid-gallery [class*="tilt"]:hover,
html body .uid-gallery .uid-thumb:hover,
html body .uid-gallery .uid-vid-card:hover,
html body .uid-gallery .uid-card:hover,
html body .uxp-img-wrap:hover,
html body .process-card:hover,
html body .design-process-card:hover,
html body .portfolio-card:hover,
html body .project-card:hover,
html body .gallery-card:hover,
html body .work-card:hover,
html body .webdev-card:hover {
  transform: none !important;
}

html body .uid-gallery .uid-thumb,
html body .uid-gallery .uid-vid-card,
html body .uid-gallery .uid-card,
html body .uxp-img-wrap,
html body .process-card,
html body .design-process-card,
html body .portfolio-card,
html body .project-card,
html body .gallery-card,
html body .work-card,
html body .webdev-card,
html body .uid-gallery .uid-thumb img,
html body .uid-gallery .uid-vid-card img,
html body .uid-gallery .uid-video-thumb,
html body .uid-gallery .uid-card-img,
html body .uxp-img-wrap img.uxp-thumb,
html body .process-card img,
html body .design-process-card img,
html body .portfolio-card img,
html body .project-card img,
html body .gallery-card img,
html body .work-card img,
html body .webdev-card img {
  border-radius: 8px !important;
}

html body .uid-gallery .uid-thumb img,
html body .uid-gallery .uid-vid-card img,
html body .uid-gallery .uid-video-thumb,
html body .uxp-img-wrap img.uxp-thumb,
html body .process-card img,
html body .design-process-card img,
html body .portfolio-card img,
html body .project-card img,
html body .gallery-card img,
html body .work-card img,
html body .webdev-card img {
  transform: translate3d(0, 0, 0) scale(1) !important;
  transform-origin: center center !important;
}

html body .uid-gallery .uid-thumb:hover img,
html body .uid-gallery .uid-vid-card:hover img,
html body .uid-gallery .uid-vid-card:hover .uid-video-thumb,
html body .uxp-img-wrap:hover img.uxp-thumb,
html body .process-card:hover img,
html body .design-process-card:hover img,
html body .portfolio-card:hover img,
html body .project-card:hover img,
html body .gallery-card:hover img,
html body .work-card:hover img,
html body .webdev-card:hover img {
  transform: translate3d(0, 0, 0) scale(1.025) !important;
}

html body .uid-gallery .uid-card .uid-card-img {
  transform: translate3d(0, 0, 0) !important;
}

html body .uid-gallery .uid-card:hover .uid-card-img {
  transform: translate3d(0, calc(-1 * var(--web-scroll-distance, 0px)), 0) !important;
}

/* FINAL 2026-08-25: portfolio/media images stay flat everywhere. */
html body .uid-gallery,
html body .uid-gallery *,
html body .uid-gallery > *,
html body .uid-gallery article,
html body .uid-gallery figure,
html body .uid-gallery .uid-item,
html body .uid-gallery .uid-project,
html body .uid-gallery .uid-card-inner,
html body .uid-gallery .portfolio-item,
html body .uid-gallery [class*="tilt"],
html body .uid-gallery .uid-thumb,
html body .uid-gallery .uid-vid-card,
html body .uid-gallery .uid-card,
html body .uxp-img-wrap,
html body .process-card,
html body .design-process-card,
html body .portfolio-card,
html body .project-card,
html body .gallery-card,
html body .work-card,
html body .webdev-card {
  perspective: none !important;
  transform-style: flat !important;
  rotate: 0deg !important;
}

html body .uid-gallery > *,
html body .uid-gallery article,
html body .uid-gallery figure,
html body .uid-gallery .uid-item,
html body .uid-gallery .uid-project,
html body .uid-gallery .uid-card-inner,
html body .uid-gallery .portfolio-item,
html body .uid-gallery [class*="tilt"],
html body .uid-gallery .uid-thumb,
html body .uid-gallery .uid-vid-card,
html body .uid-gallery .uid-card,
html body .uxp-img-wrap,
html body .process-card,
html body .design-process-card,
html body .portfolio-card,
html body .project-card,
html body .gallery-card,
html body .work-card,
html body .webdev-card,
html body .uid-gallery > *:hover,
html body .uid-gallery article:hover,
html body .uid-gallery figure:hover,
html body .uid-gallery .uid-item:hover,
html body .uid-gallery .uid-project:hover,
html body .uid-gallery .uid-card-inner:hover,
html body .uid-gallery .portfolio-item:hover,
html body .uid-gallery [class*="tilt"]:hover,
html body .uid-gallery .uid-thumb:hover,
html body .uid-gallery .uid-vid-card:hover,
html body .uid-gallery .uid-card:hover,
html body .uxp-img-wrap:hover,
html body .process-card:hover,
html body .design-process-card:hover,
html body .portfolio-card:hover,
html body .project-card:hover,
html body .gallery-card:hover,
html body .work-card:hover,
html body .webdev-card:hover {
  transform: none !important;
}

html body .uid-gallery .uid-thumb,
html body .uid-gallery .uid-vid-card,
html body .uid-gallery .uid-card,
html body .uxp-img-wrap,
html body .process-card,
html body .design-process-card,
html body .portfolio-card,
html body .project-card,
html body .gallery-card,
html body .work-card,
html body .webdev-card,
html body .uid-gallery .uid-thumb img,
html body .uid-gallery .uid-vid-card img,
html body .uid-gallery .uid-video-thumb,
html body .uid-gallery .uid-card-img,
html body .uxp-img-wrap img.uxp-thumb,
html body .process-card img,
html body .design-process-card img,
html body .portfolio-card img,
html body .project-card img,
html body .gallery-card img,
html body .work-card img,
html body .webdev-card img {
  border-radius: 8px !important;
}

html body .uid-gallery .uid-thumb img,
html body .uid-gallery .uid-vid-card img,
html body .uid-gallery .uid-video-thumb,
html body .uxp-img-wrap img.uxp-thumb,
html body .process-card img,
html body .design-process-card img,
html body .portfolio-card img,
html body .project-card img,
html body .gallery-card img,
html body .work-card img,
html body .webdev-card img {
  transform: translate3d(0, 0, 0) scale(1) !important;
  transform-origin: center center !important;
}

html body .uid-gallery .uid-thumb:hover img,
html body .uid-gallery .uid-vid-card:hover img,
html body .uid-gallery .uid-vid-card:hover .uid-video-thumb,
html body .uxp-img-wrap:hover img.uxp-thumb,
html body .process-card:hover img,
html body .design-process-card:hover img,
html body .portfolio-card:hover img,
html body .project-card:hover img,
html body .gallery-card:hover img,
html body .work-card:hover img,
html body .webdev-card:hover img {
  transform: translate3d(0, 0, 0) scale(1.025) !important;
}

html body .uid-gallery .uid-card .uid-card-img {
  transform: translate3d(0, 0, 0) !important;
}

html body .uid-gallery .uid-card:hover .uid-card-img {
  transform: translate3d(0, calc(-1 * var(--web-scroll-distance, 0px)), 0) !important;
}

/* FINAL OVERRIDE - keep every portfolio/media image flat. */
html body .uid-gallery,
html body .uid-gallery *,
html body .uxp-img-wrap,
html body .uxp-img-wrap *,
html body .process-card,
html body .process-card *,
html body .design-process-card,
html body .design-process-card *,
html body .portfolio-card,
html body .portfolio-card *,
html body .project-card,
html body .project-card *,
html body .gallery-card,
html body .gallery-card *,
html body .work-card,
html body .work-card *,
html body .webdev-card,
html body .webdev-card * {
  perspective: none !important;
  transform-style: flat !important;
  rotate: 0deg !important;
}

html body .uid-gallery > *,
html body .uid-gallery article,
html body .uid-gallery figure,
html body .uid-gallery .uid-item,
html body .uid-gallery .uid-project,
html body .uid-gallery .uid-card-inner,
html body .uid-gallery .portfolio-item,
html body .uid-gallery [class*="tilt"],
html body .uid-gallery .uid-thumb,
html body .uid-gallery .uid-vid-card,
html body .uid-gallery .uid-card,
html body .uxp-img-wrap,
html body .process-card,
html body .design-process-card,
html body .portfolio-card,
html body .project-card,
html body .gallery-card,
html body .work-card,
html body .webdev-card,
html body .uid-gallery > *:hover,
html body .uid-gallery article:hover,
html body .uid-gallery figure:hover,
html body .uid-gallery .uid-item:hover,
html body .uid-gallery .uid-project:hover,
html body .uid-gallery .uid-card-inner:hover,
html body .uid-gallery .portfolio-item:hover,
html body .uid-gallery [class*="tilt"]:hover,
html body .uid-gallery .uid-thumb:hover,
html body .uid-gallery .uid-vid-card:hover,
html body .uid-gallery .uid-card:hover,
html body .uxp-img-wrap:hover,
html body .process-card:hover,
html body .design-process-card:hover,
html body .portfolio-card:hover,
html body .project-card:hover,
html body .gallery-card:hover,
html body .work-card:hover,
html body .webdev-card:hover {
  transform: none !important;
}

html body .uid-gallery .uid-thumb,
html body .uid-gallery .uid-vid-card,
html body .uid-gallery .uid-card,
html body .uxp-img-wrap,
html body .process-card,
html body .design-process-card,
html body .portfolio-card,
html body .project-card,
html body .gallery-card,
html body .work-card,
html body .webdev-card,
html body .uid-gallery .uid-thumb img,
html body .uid-gallery .uid-vid-card img,
html body .uid-gallery .uid-video-thumb,
html body .uxp-img-wrap img.uxp-thumb,
html body .process-card img,
html body .design-process-card img,
html body .portfolio-card img,
html body .project-card img,
html body .gallery-card img,
html body .work-card img,
html body .webdev-card img {
  border-radius: 8px !important;
}

html body .uid-gallery .uid-thumb img,
html body .uid-gallery .uid-vid-card img,
html body .uid-gallery .uid-video-thumb,
html body .uxp-img-wrap img.uxp-thumb,
html body .process-card img,
html body .design-process-card img,
html body .portfolio-card img,
html body .project-card img,
html body .gallery-card img,
html body .work-card img,
html body .webdev-card img {
  transform: translate3d(0, 0, 0) scale(1) !important;
  transform-origin: center center !important;
}

html body .uid-gallery .uid-thumb:hover img,
html body .uid-gallery .uid-vid-card:hover img,
html body .uid-gallery .uid-vid-card:hover .uid-video-thumb,
html body .uxp-img-wrap:hover img.uxp-thumb,
html body .process-card:hover img,
html body .design-process-card:hover img,
html body .portfolio-card:hover img,
html body .project-card:hover img,
html body .gallery-card:hover img,
html body .work-card:hover img,
html body .webdev-card:hover img {
  transform: translate3d(0, 0, 0) scale(1.025) !important;
}

html body .uid-gallery .uid-card .uid-card-img {
  transform: translate3d(0, 0, 0) !important;
}

html body .uid-gallery .uid-card:hover .uid-card-img {
  transform: translate3d(0, calc(-1 * var(--web-scroll-distance, 0px)), 0) !important;
}

/* 2026-08-25 absolute portfolio override: no 3D perspective anywhere in portfolio media. */
html body .uid-gallery,
html body .uid-gallery *,
html body .uxp-img-wrap,
html body .uxp-img-wrap *,
html body .process-card,
html body .process-card *,
html body .design-process-card,
html body .design-process-card *,
html body .portfolio-card,
html body .portfolio-card *,
html body .project-card,
html body .project-card *,
html body .gallery-card,
html body .gallery-card *,
html body .work-card,
html body .work-card *,
html body .webdev-card,
html body .webdev-card * {
  perspective: none !important;
  transform-style: flat !important;
  rotate: 0deg !important;
}

html body .uid-gallery > *,
html body .uid-gallery article,
html body .uid-gallery figure,
html body .uid-gallery .uid-item,
html body .uid-gallery .uid-project,
html body .uid-gallery .uid-card-inner,
html body .uid-gallery .portfolio-item,
html body .uid-gallery [class*="tilt"],
html body .uid-gallery .uid-thumb,
html body .uid-gallery .uid-vid-card,
html body .uid-gallery .uid-card,
html body .uxp-img-wrap,
html body .process-card,
html body .design-process-card,
html body .portfolio-card,
html body .project-card,
html body .gallery-card,
html body .work-card,
html body .webdev-card,
html body .uid-gallery > *:hover,
html body .uid-gallery article:hover,
html body .uid-gallery figure:hover,
html body .uid-gallery .uid-item:hover,
html body .uid-gallery .uid-project:hover,
html body .uid-gallery .uid-card-inner:hover,
html body .uid-gallery .portfolio-item:hover,
html body .uid-gallery [class*="tilt"]:hover,
html body .uid-gallery .uid-thumb:hover,
html body .uid-gallery .uid-vid-card:hover,
html body .uid-gallery .uid-card:hover,
html body .uxp-img-wrap:hover,
html body .process-card:hover,
html body .design-process-card:hover,
html body .portfolio-card:hover,
html body .project-card:hover,
html body .gallery-card:hover,
html body .work-card:hover,
html body .webdev-card:hover {
  transform: none !important;
}

html body .uid-gallery .uid-thumb,
html body .uid-gallery .uid-vid-card,
html body .uid-gallery .uid-card,
html body .uxp-img-wrap,
html body .process-card,
html body .design-process-card,
html body .portfolio-card,
html body .project-card,
html body .gallery-card,
html body .work-card,
html body .webdev-card,
html body .uid-gallery .uid-thumb img,
html body .uid-gallery .uid-vid-card img,
html body .uid-gallery .uid-video-thumb,
html body .uxp-img-wrap img.uxp-thumb,
html body .process-card img,
html body .design-process-card img,
html body .portfolio-card img,
html body .project-card img,
html body .gallery-card img,
html body .work-card img,
html body .webdev-card img {
  border-radius: 8px !important;
}

html body .uid-gallery .uid-thumb img,
html body .uid-gallery .uid-vid-card img,
html body .uid-gallery .uid-video-thumb,
html body .uxp-img-wrap img.uxp-thumb,
html body .process-card img,
html body .design-process-card img,
html body .portfolio-card img,
html body .project-card img,
html body .gallery-card img,
html body .work-card img,
html body .webdev-card img {
  transform: translate3d(0, 0, 0) scale(1) !important;
  transform-origin: center center !important;
}

html body .uid-gallery .uid-thumb:hover img,
html body .uid-gallery .uid-vid-card:hover img,
html body .uid-gallery .uid-vid-card:hover .uid-video-thumb,
html body .uxp-img-wrap:hover img.uxp-thumb,
html body .process-card:hover img,
html body .design-process-card:hover img,
html body .portfolio-card:hover img,
html body .project-card:hover img,
html body .gallery-card:hover img,
html body .work-card:hover img,
html body .webdev-card:hover img {
  transform: translate3d(0, 0, 0) scale(1.025) !important;
}

html body .uid-gallery .uid-card .uid-card-img {
  transform: translate3d(0, 0, 0) !important;
}

html body .uid-gallery .uid-card:hover .uid-card-img {
  transform: translate3d(0, calc(-1 * var(--web-scroll-distance, 0px)), 0) !important;
}

/* Last-loaded portfolio radius guard. */
:root {
  --artlantic-tight-radius: 3px;
}

html body .latest-project-device,
html body .latest-project-screen,
html body .latest-project-screen img,
html body .latest-project-card,
html body .latest-project-card img,
html body .latest-projects-track a,
html body .latest-projects-track img,
html body .coverflow-card,
html body .coverflow-card img,
html body .cf-card,
html body .cf-card img,
html body .portfolio-carousel img,
html body .service-card,
html body .service-card img,
html body .uid-gallery,
html body .uid-gallery .uid-thumb,
html body .uid-gallery .uid-thumb img,
html body .uid-gallery .uid-vid-card,
html body .uid-gallery .uid-vid-card img,
html body .uid-gallery .uid-video-thumb,
html body .uid-gallery .uid-card,
html body .uid-gallery .uid-card-img-wrap,
html body .uid-gallery .uid-card-img-wrap img,
html body .uid-gallery .uid-card-img,
html body .uid-gallery img,
html body .uid-gallery video,
html body .uid-thumb,
html body .uid-thumb img,
html body .uid-vid-card,
html body .uid-vid-card img,
html body .uid-video-thumb,
html body .uid-card,
html body .uid-card-img-wrap,
html body .uid-card-img-wrap img,
html body .uid-card-img,
html body .uxp-img-wrap,
html body .uxp-img-wrap img,
html body img.uxp-thumb,
html body .uxp-lightbox-img,
html body .lightbox,
html body .lightbox-content,
html body .lightbox img {
  border-radius: var(--artlantic-tight-radius) !important;
}

html body .latest-project-device::before,
html body .coverflow-card::before,
html body .cf-card::before,
html body .uid-gallery .uid-thumb::before,
html body .uid-gallery .uid-vid-card::before,
html body .uid-gallery .uid-card::before,
html body .uid-thumb::before,
html body .uid-vid-card::before,
html body .uid-card::before,
html body .uid-card-img-wrap::before,
html body .uxp-img-wrap::before {
  content: none !important;
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  opacity: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}

/* Final override loaded after page-level styles. */
html body p,
html body .uid-hero p,
html body .uid-info-block p,
html body .uid-gallery p,
html body .latest-project-copy p,
html body .latest-project-meta p,
html body .latest-project-card p,
html body .hero-copy p,
html body .service-card p,
html body .blog-card p,
html body .blog-hero p,
html body .about-intro p,
html body .ct-subtitle,
html body .footer-video-copy p {
  font-weight: 400 !important;
}

html body .latest-project-copy p,
html body .latest-project-meta p,
html body .latest-products p,
html body .latest-projects p {
  font-size: 16px !important;
  font-weight: 400 !important;
}

html body .latest-project-device,
html body .latest-project-screen,
html body .latest-project-screen img,
html body .latest-project-card,
html body .latest-project-card img,
html body .coverflow-card,
html body .coverflow-card img,
html body .cf-card,
html body .cf-card img,
html body .portfolio-carousel img,
html body .service-card,
html body .service-card img,
html body .uid-gallery .uid-thumb,
html body .uid-gallery .uid-vid-card,
html body .uid-gallery .uid-card,
html body .uid-gallery .uid-card-img-wrap,
html body .uid-gallery .uid-card-img,
html body .uid-gallery img,
html body .uid-gallery video,
html body .uid-thumb,
html body .uid-thumb img,
html body .uid-vid-card,
html body .uid-vid-card img,
html body .uid-video-thumb,
html body .uid-card,
html body .uid-card-img-wrap,
html body .uid-card-img,
html body .uxp-img-wrap,
html body .uxp-img-wrap img,
html body .lightbox,
html body .lightbox-content,
html body .lightbox img {
  border-radius: 8px !important;
}

html body .latest-project-device::before,
html body .coverflow-card::before,
html body .cf-card::before,
html body .uid-gallery .uid-thumb::before,
html body .uid-gallery .uid-vid-card::before,
html body .uid-gallery .uid-card::before,
html body .uid-thumb::before,
html body .uid-vid-card::before,
html body .uid-card::before,
html body .uid-card-img-wrap::before,
html body .uxp-img-wrap::before {
  content: none !important;
  display: none !important;
  opacity: 0 !important;
}

html body .latest-project-device::after,
html body .coverflow-card::after,
html body .cf-card::after,
html body .uid-gallery .uid-thumb::after,
html body .uid-gallery .uid-vid-card::after,
html body .uid-gallery .uid-card::after,
html body .uid-card-img-wrap::after,
html body .uxp-img-wrap::after {
  border-radius: 8px !important;
}

html body .uid-gallery .uid-thumb,
html body .uid-gallery .uid-vid-card,
html body .uid-gallery .uid-card,
html body .uid-gallery .uxp-img-wrap {
  animation: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  content-visibility: visible !important;
  contain-intrinsic-size: auto !important;
  backface-visibility: hidden !important;
  transform: none !important;

  transform-style: flat !important;
  transition: transform 1.05s cubic-bezier(0.18, 1.2, 0.28, 1), border-color 0.65s ease, box-shadow 0.65s ease !important;
  will-change: transform;
}

html body .uid-gallery .uid-thumb:hover,
html body .uid-gallery .uid-vid-card:hover,
html body .uid-gallery .uid-card:hover,
html body .uid-gallery .uxp-img-wrap:hover {
  transform: none !important;

}

html body .uid-gallery .uid-thumb img,
html body .uid-gallery .uid-vid-card img,
html body .uid-gallery .uid-video-thumb,
html body .uid-gallery .uid-card-img,
html body .uid-gallery .uid-card-img-wrap img,
html body .uid-gallery video,
html body .uxp-img-wrap img {
  animation: none !important;
  opacity: 1 !important;
  display: block !important;
  transform: translate3d(0, 0, 0) scale(1) !important;
  transition: filter 0.65s ease !important;
  backface-visibility: hidden !important;
}

/* 2026-08-25 true EOF lock: force every image/mockup corner to 3px. */
html body {
  --artlantic-image-radius: 3px;
}

html body img:not(.brand-logo):not(.logo):not(.site-logo):not(.nav-logo):not(.hamburger-icon):not(.store-icon):not(.whatsapp-icon),
html body picture,
html body video,
html body .uid-thumb,
html body .uid-thumb > img,
html body .uid-thumb img,
html body .uid-vid-card,
html body .uid-vid-card > img,
html body .uid-vid-card img,
html body .uid-video-thumb,
html body .uid-card,
html body .uid-card-img,
html body .uid-card-img-wrap,
html body .uid-card-img-wrap > img,
html body .uid-card-img-wrap img,
html body .uxp-img-wrap,
html body .uxp-img-wrap > img,
html body .webdev-card,
html body .webdev-card img,
html body .process-card,
html body .process-card img,
html body .design-process-card,
html body .design-process-card img,
html body .latest-project-device,
html body .latest-project-device img,
html body .latest-project-screen,
html body .latest-project-screen img,
html body .latest-project-card,
html body .latest-project-card img,
html body .latest-project-track img,
html body .latest-projects-track img,
html body .latest-products-track img,
html body .coverflow-card,
html body .coverflow-card img,
html body .cf-card,
html body .cf-card img,
html body .portfolio-carousel img,
html body .portfolio-card,
html body .portfolio-card img,
html body .project-card,
html body .project-card img,
html body .gallery-card,
html body .gallery-card img,
html body .work-card,
html body .work-card img,
html body .device-frame,
html body .device-frame img,
html body .tablet-frame,
html body .tablet-frame img,
html body .browser-frame,
html body .browser-frame img,
html body .lightbox-content,
html body .lightbox-content img {
  border-radius: var(--artlantic-image-radius) !important;
  overflow: hidden !important;
  clip-path: inset(0 round var(--artlantic-image-radius)) !important;
}

html body .uid-thumb::before,
html body .uid-vid-card::before,
html body .uid-card::before,
html body .uid-card-img-wrap::before,
html body .uxp-img-wrap::before,
html body .webdev-card::before,
html body .process-card::before,
html body .design-process-card::before,
html body .latest-project-device::before,
html body .latest-project-screen::before,
html body .coverflow-card::before,
html body .cf-card::before,
html body .portfolio-card::before,
html body .project-card::before,
html body .gallery-card::before,
html body .work-card::before,
html body .device-frame::before,
html body .tablet-frame::before,
html body .browser-frame::before {
  content: none !important;
  display: none !important;
  opacity: 0 !important;
}

html body .uid-thumb::after,
html body .uid-vid-card::after,
html body .uid-card::after,
html body .uid-card-img-wrap::after,
html body .uxp-img-wrap::after,
html body .webdev-card::after,
html body .process-card::after,
html body .design-process-card::after,
html body .latest-project-device::after,
html body .latest-project-screen::after,
html body .coverflow-card::after,
html body .cf-card::after,
html body .portfolio-card::after,
html body .project-card::after,
html body .gallery-card::after,
html body .work-card::after,
html body .device-frame::after,
html body .tablet-frame::after,
html body .browser-frame::after {
  border-radius: var(--artlantic-image-radius) !important;
  clip-path: inset(0 round var(--artlantic-image-radius)) !important;
}

html body p {
  font-weight: 400 !important;
}

/* 2026-08-25 absolute image radius sweep: portfolio/media internals too. */
html body [class*="portfolio"] img,
html body [class*="portfolio"] picture,
html body [class*="portfolio"] video,
html body [class*="project"] img,
html body [class*="project"] picture,
html body [class*="project"] video,
html body [class*="gallery"] img,
html body [class*="gallery"] picture,
html body [class*="gallery"] video,
html body [class*="carousel"] img,
html body [class*="carousel"] picture,
html body [class*="carousel"] video,
html body [class*="thumb"] img,
html body [class*="screen"] img,
html body [class*="mockup"] img,
html body [class*="tablet"] img,
html body [class*="device"] img,
html body [class*="card"] img,
html body [class*="media"] img,
html body [class*="image"] img,
html body [class*="work"] img,
html body [class*="process"] img {
  border-radius: 8px !important;
  clip-path: inset(0 round 8px) !important;
}

html body [class*="portfolio"],
html body [class*="project"],
html body [class*="gallery"],
html body [class*="carousel"],
html body [class*="thumb"],
html body [class*="screen"],
html body [class*="mockup"],
html body [class*="tablet"],
html body [class*="device"],
html body [class*="card"],
html body [class*="media"],
html body [class*="image"],
html body [class*="work"],
html body [class*="process"] {
  border-radius: 8px !important;
}

html body [class*="portfolio"]::before,
html body [class*="project"]::before,
html body [class*="gallery"]::before,
html body [class*="carousel"]::before,
html body [class*="thumb"]::before,
html body [class*="screen"]::before,
html body [class*="mockup"]::before,
html body [class*="tablet"]::before,
html body [class*="device"]::before,
html body [class*="card"]::before,
html body [class*="media"]::before,
html body [class*="image"]::before,
html body [class*="work"]::before,
html body [class*="process"]::before {
  content: none !important;
  display: none !important;
}

/* 2026-08-25 final image hover behavior: no perspective tilt, subtle zoom only. */
html body {
  --artlantic-hover-zoom: 1.035;
  --artlantic-hover-speed: 520ms;
}

html body .latest-project-card,
html body .latest-project-device,
html body .uid-gallery .uid-thumb,
html body .uid-gallery .uid-vid-card,
html body .uid-gallery .uid-card,
html body .uxp-img-wrap,
html body .services .service-card,
html body .portfolio-card,
html body .project-card,
html body .gallery-card,
html body .work-card,
html body .webdev-card,
html body .process-card,
html body .design-process-card {
  perspective: none !important;
  transform-style: flat !important;
}

html body .latest-project-card:hover,
html body .latest-project-card:hover .latest-project-device,
html body .latest-project-card--vidoya:hover .latest-project-device,
html body .latest-project-card--dionis:hover .latest-project-device,
html body .latest-project-card--platinum:hover .latest-project-device,
html body .latest-project-card--animated:hover .latest-project-device,
html body .uid-gallery .uid-thumb:hover,
html body .uid-gallery .uid-vid-card:hover,
html body .uid-gallery .uid-card:hover,
html body .uxp-img-wrap:hover,
html body .services .service-card:hover,
html body .portfolio-card:hover,
html body .project-card:hover,
html body .gallery-card:hover,
html body .work-card:hover,
html body .webdev-card:hover,
html body .process-card:hover,
html body .design-process-card:hover {
  perspective: none !important;
  transform: none !important;
  transform-style: flat !important;
}

html body img:not(.brand-logo):not(.logo):not(.site-logo):not(.nav-logo):not(.hamburger-icon):not(.store-icon):not(.whatsapp-icon),
html body .uid-gallery .uid-thumb img,
html body .uid-gallery .uid-vid-card img,
html body .uid-gallery .uid-video-thumb,
html body .uid-gallery .uid-card-img,
html body .uxp-img-wrap img.uxp-thumb,
html body .latest-project-screen img,
html body .services .service-card img,
html body .portfolio-card img,
html body .project-card img,
html body .gallery-card img,
html body .work-card img,
html body .webdev-card img,
html body .process-card img,
html body .design-process-card img,
html body .coverflow-card img,
html body .cf-card img {
  transform-origin: center center !important;
  transition:
    transform var(--artlantic-hover-speed) cubic-bezier(.22,.61,.36,1),
    opacity var(--artlantic-hover-speed) ease,
    filter var(--artlantic-hover-speed) ease !important;
  will-change: transform !important;
}

html body a:hover img:not(.brand-logo):not(.logo):not(.site-logo):not(.nav-logo):not(.hamburger-icon):not(.store-icon):not(.whatsapp-icon),
html body .uid-gallery .uid-thumb:hover img,
html body .uid-gallery .uid-vid-card:hover img,
html body .uid-gallery .uid-vid-card:hover .uid-video-thumb,
html body .uid-gallery .uid-card:hover .uid-card-img,
html body .uxp-img-wrap:hover img.uxp-thumb,
html body .latest-project-card:hover .latest-project-screen img,
html body .services .service-card:hover img,
html body .portfolio-card:hover img,
html body .project-card:hover img,
html body .gallery-card:hover img,
html body .work-card:hover img,
html body .webdev-card:hover img,
html body .process-card:hover img,
html body .design-process-card:hover img,
html body .coverflow-card:hover img,
html body .cf-card:hover img {
  transform: scale(var(--artlantic-hover-zoom)) !important;
}

@media (hover: none), (pointer: coarse), (max-width: 768px) {
  html body a:hover img:not(.brand-logo):not(.logo):not(.site-logo):not(.nav-logo):not(.hamburger-icon):not(.store-icon):not(.whatsapp-icon),
  html body .uid-gallery .uid-thumb:hover img,
  html body .uid-gallery .uid-vid-card:hover img,
  html body .uid-gallery .uid-vid-card:hover .uid-video-thumb,
  html body .uid-gallery .uid-card:hover .uid-card-img,
  html body .uxp-img-wrap:hover img.uxp-thumb,
  html body .latest-project-card:hover .latest-project-screen img,
  html body .services .service-card:hover img,
  html body .portfolio-card:hover img,
  html body .project-card:hover img,
  html body .gallery-card:hover img,
  html body .work-card:hover img,
  html body .webdev-card:hover img,
  html body .process-card:hover img,
  html body .design-process-card:hover img,
  html body .coverflow-card:hover img,
  html body .cf-card:hover img {
    transform: none !important;
  }
}

/* 2026-08-25 hard override: portfolio/media previews must stay flat. */
html body.frame-page:not(.home-page) .uid-gallery,
html body.frame-page:not(.home-page) .uid-gallery *,
html body.frame-page:not(.home-page) .uxp-img-wrap,
html body.frame-page:not(.home-page) .uxp-img-wrap *,
html body.frame-page:not(.home-page) .process-card,
html body.frame-page:not(.home-page) .process-card *,
html body.frame-page:not(.home-page) .design-process-card,
html body.frame-page:not(.home-page) .design-process-card *,
html body.frame-page:not(.home-page) .portfolio-card,
html body.frame-page:not(.home-page) .portfolio-card *,
html body.frame-page:not(.home-page) .project-card,
html body.frame-page:not(.home-page) .project-card *,
html body.frame-page:not(.home-page) .gallery-card,
html body.frame-page:not(.home-page) .gallery-card *,
html body.frame-page:not(.home-page) .work-card,
html body.frame-page:not(.home-page) .work-card *,
html body.frame-page:not(.home-page) .webdev-card,
html body.frame-page:not(.home-page) .webdev-card * {
  perspective: none !important;
  transform-style: flat !important;
  rotate: 0deg !important;
}

html body.frame-page:not(.home-page) .uid-gallery .uid-thumb,
html body.frame-page:not(.home-page) .uid-gallery .uid-vid-card,
html body.frame-page:not(.home-page) .uid-gallery .uid-card,
html body.frame-page:not(.home-page) .uxp-img-wrap,
html body.frame-page:not(.home-page) .process-card,
html body.frame-page:not(.home-page) .design-process-card,
html body.frame-page:not(.home-page) .portfolio-card,
html body.frame-page:not(.home-page) .project-card,
html body.frame-page:not(.home-page) .gallery-card,
html body.frame-page:not(.home-page) .work-card,
html body.frame-page:not(.home-page) .webdev-card,
html body.frame-page:not(.home-page) .uid-gallery .uid-thumb:hover,
html body.frame-page:not(.home-page) .uid-gallery .uid-vid-card:hover,
html body.frame-page:not(.home-page) .uid-gallery .uid-card:hover,
html body.frame-page:not(.home-page) .uxp-img-wrap:hover,
html body.frame-page:not(.home-page) .process-card:hover,
html body.frame-page:not(.home-page) .design-process-card:hover,
html body.frame-page:not(.home-page) .portfolio-card:hover,
html body.frame-page:not(.home-page) .project-card:hover,
html body.frame-page:not(.home-page) .gallery-card:hover,
html body.frame-page:not(.home-page) .work-card:hover,
html body.frame-page:not(.home-page) .webdev-card:hover {
  transform: none !important;
}

html body.frame-page:not(.home-page) .uid-gallery .uid-thumb img,
html body.frame-page:not(.home-page) .uid-gallery .uid-vid-card img,
html body.frame-page:not(.home-page) .uid-gallery .uid-video-thumb,
html body.frame-page:not(.home-page) .uxp-img-wrap img.uxp-thumb,
html body.frame-page:not(.home-page) .process-card img,
html body.frame-page:not(.home-page) .design-process-card img,
html body.frame-page:not(.home-page) .portfolio-card img,
html body.frame-page:not(.home-page) .project-card img,
html body.frame-page:not(.home-page) .gallery-card img,
html body.frame-page:not(.home-page) .work-card img,
html body.frame-page:not(.home-page) .webdev-card img {
  transform: translate3d(0, 0, 0) scale(1) !important;
  transform-origin: center center !important;
}

html body.frame-page:not(.home-page) .uid-gallery .uid-thumb:hover img,
html body.frame-page:not(.home-page) .uid-gallery .uid-vid-card:hover img,
html body.frame-page:not(.home-page) .uid-gallery .uid-vid-card:hover .uid-video-thumb,
html body.frame-page:not(.home-page) .uxp-img-wrap:hover img.uxp-thumb,
html body.frame-page:not(.home-page) .process-card:hover img,
html body.frame-page:not(.home-page) .design-process-card:hover img,
html body.frame-page:not(.home-page) .portfolio-card:hover img,
html body.frame-page:not(.home-page) .project-card:hover img,
html body.frame-page:not(.home-page) .gallery-card:hover img,
html body.frame-page:not(.home-page) .work-card:hover img,
html body.frame-page:not(.home-page) .webdev-card:hover img {
  transform: translate3d(0, 0, 0) scale(1.025) !important;
}

html body.frame-page:not(.home-page) .uid-gallery .uid-card .uid-card-img {
  transform: translate3d(0, 0, 0) !important;
}

html body.frame-page:not(.home-page) .uid-gallery .uid-card:hover .uid-card-img {
  transform: translate3d(0, calc(-1 * var(--web-scroll-distance, 0px)), 0) !important;
}
/* 2026-08-25 absolute EOF lock: remove all portfolio perspective tilt. */
html body .uid-gallery,
html body .uid-gallery *,
html body .uid-thumb,
html body .uid-thumb *,
html body .uid-vid-card,
html body .uid-vid-card *,
html body .uid-card,
html body .uid-card *,
html body .uid-card-img-wrap,
html body .uid-card-img-wrap *,
html body .uxp-img-wrap,
html body .uxp-img-wrap *,
html body .portfolio-card,
html body .portfolio-card *,
html body .project-card,
html body .project-card *,
html body .gallery-card,
html body .gallery-card *,
html body .work-card,
html body .work-card *,
html body .webdev-card,
html body .webdev-card *,
html body .process-card,
html body .process-card *,
html body .design-process-card,
html body .design-process-card *,
html body .latest-project-card,
html body .latest-project-card *,
html body .services .service-card,
html body .services .service-card *,
html body .coverflow-card,
html body .coverflow-card *,
html body .cf-card,
html body .cf-card * {
  perspective: none !important;
  transform-style: flat !important;
  rotate: 0deg !important;
  --tilt-x: 0deg !important;
  --tilt-y: 0deg !important;
  --rx: 0deg !important;
  --ry: 0deg !important;
}

html body .uid-gallery .uid-thumb,
html body .uid-gallery .uid-vid-card,
html body .uid-gallery .uid-card,
html body .uid-card-img-wrap,
html body .uxp-img-wrap,
html body .portfolio-card,
html body .project-card,
html body .gallery-card,
html body .work-card,
html body .webdev-card,
html body .process-card,
html body .design-process-card,
html body .latest-project-card,
html body .latest-project-device,
html body .latest-project-screen,
html body .services .service-card,
html body .coverflow-card,
html body .cf-card,
html body .uid-gallery .uid-thumb:hover,
html body .uid-gallery .uid-vid-card:hover,
html body .uid-gallery .uid-card:hover,
html body .uid-card-img-wrap:hover,
html body .uxp-img-wrap:hover,
html body .portfolio-card:hover,
html body .project-card:hover,
html body .gallery-card:hover,
html body .work-card:hover,
html body .webdev-card:hover,
html body .process-card:hover,
html body .design-process-card:hover,
html body .latest-project-card:hover,
html body .latest-project-card:hover .latest-project-device,
html body .services .service-card:hover,
html body .coverflow-card:hover,
html body .cf-card:hover {
  transform: none !important;
  border-radius: 8px !important;
  overflow: hidden !important;
}

html body .uid-gallery .uid-thumb img,
html body .uid-gallery .uid-vid-card img,
html body .uid-gallery .uid-video-thumb,
html body .uid-gallery .uid-card-img-wrap img,
html body .uid-gallery .uid-card-img,
html body .uxp-img-wrap img,
html body .latest-project-screen img,
html body .services .service-card img,
html body .portfolio-card img,
html body .project-card img,
html body .gallery-card img,
html body .work-card img,
html body .webdev-card img,
html body .process-card img,
html body .design-process-card img,
html body .coverflow-card img,
html body .cf-card img {
  border-radius: 8px !important;
  transform: translate3d(0, 0, 0) scale(1) !important;
  transform-origin: center center !important;
  transition: transform .36s ease, filter .36s ease, opacity .36s ease !important;
}

html body .uid-gallery .uid-thumb:hover img,
html body .uid-gallery .uid-vid-card:hover img,
html body .uid-gallery .uid-vid-card:hover .uid-video-thumb,
html body .uxp-img-wrap:hover img,
html body .latest-project-card:hover .latest-project-screen img,
html body .services .service-card:hover img,
html body .portfolio-card:hover img,
html body .project-card:hover img,
html body .gallery-card:hover img,
html body .work-card:hover img,
html body .webdev-card:hover img,
html body .process-card:hover img,
html body .design-process-card:hover img,
html body .coverflow-card:hover img,
html body .cf-card:hover img {
  transform: translate3d(0, 0, 0) scale(1.025) !important;
}

html body .uid-gallery .uid-card:hover .uid-card-img {
  transform: translate3d(0, calc(-1 * var(--web-scroll-distance, 0px)), 0) scale(1.01) !important;
}

html body .uid-card-img-wrap::before,
html body .uid-card-img-wrap::after,
html body .uxp-img-wrap::before,
html body .uxp-img-wrap::after,
html body .uid-thumb::before,
html body .uid-thumb::after,
html body .uid-vid-card::before,
html body .uid-vid-card::after,
html body .latest-project-device::before,
html body .latest-project-device::after {
  content: none !important;
  display: none !important;
}
/* 2026-08-25 final EOF lock: UI/portfolio frames stay still; images zoom from center. */
html body.frame-page:not(.web-development-page) .uid-gallery .uid-thumb,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-thumb:hover,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-vid-card,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-vid-card:hover {
  transform: translate3d(0, 0, 0) scale(1) !important;
  transform-origin: center center !important;
  overflow: hidden !important;
  border-radius: 8px !important;
}

html body.frame-page:not(.web-development-page) .uid-gallery .uid-thumb img,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-vid-card img,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-video-thumb {
  transform: translate3d(0, 0, 0) scale(1) !important;
  transform-origin: center center !important;
  object-position: center center !important;
  border-radius: 8px !important;
  transition: transform .36s ease, filter .36s ease, opacity .36s ease !important;
}

html body.frame-page:not(.web-development-page) .uid-gallery .uid-thumb:hover img,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-vid-card:hover img,
html body.frame-page:not(.web-development-page) .uid-gallery .uid-vid-card:hover .uid-video-thumb {
  transform: translate3d(0, 0, 0) scale(1.025) !important;
}

html body.web-development-page .uid-gallery .uid-card .uid-card-img {
  transition: transform var(--web-scroll-duration, 36s) cubic-bezier(0.25, 0.1, 0.25, 1), filter .65s ease, opacity .65s ease !important;
}

html body.web-development-page .uid-gallery .uid-card:hover .uid-card-img {
  transform: translate3d(0, calc(-1 * var(--web-scroll-distance, 0px)), 0) scale(1) !important;
}


/* Final info-block closing copy alignment. */
html body.frame-page:not(.home-page) .uid-info-block > p {
  width: auto !important;
  max-width: none !important;
  margin-left: 20px !important;
  margin-right: 0 !important;
  text-align: left !important;
}



/* Final Web Development layout: square website previews with App Design style zoom. */
html body.web-development-page .uid-gallery {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

html body.web-development-page .uid-gallery .uid-card,
html body.web-development-page .uid-gallery .uid-card:hover {
  aspect-ratio: 1 / 1 !important;
  transform: none !important;
}

html body.web-development-page .uid-gallery .uid-card-img-wrap {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  aspect-ratio: 1 / 1 !important;
  width: 100% !important;
  height: 100% !important;
  overflow: hidden !important;
  cursor: pointer !important;
}

html body.web-development-page .uid-gallery .uid-card-footer {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  z-index: 2 !important;
  background: linear-gradient(180deg, rgba(4,14,26,0.15), rgba(4,14,26,0.88)) !important;
  backdrop-filter: blur(8px);
}

html body.web-development-page .uid-gallery .uid-card .uid-card-img,
html body.web-development-page .uid-gallery .uid-card .uid-card-img-wrap img {
  animation: none !important;
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  min-width: 100% !important;
  min-height: 100% !important;
  object-fit: cover !important;
  object-position: top center !important;
  transform: translate3d(0, 0, 0) scale(1) !important;
  transition: transform .36s ease, filter .36s ease, opacity .36s ease !important;
}

html body.web-development-page .uid-gallery .uid-card:hover .uid-card-img,
html body.web-development-page .uid-gallery .uid-card .uid-card-img-wrap:hover img {
  animation: none !important;
  transform: translate3d(0, 0, 0) scale(1.025) !important;
}

@media (max-width: 1100px) {
  html body.web-development-page .uid-gallery {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 700px) {
  html body.web-development-page .uid-gallery {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 440px) {
  html body.web-development-page .uid-gallery {
    grid-template-columns: 1fr !important;
  }
}

/* Absolute last Web Development image cover lock. */
html body.web-development-page .uid-gallery .uid-card .uid-card-img,
html body.web-development-page .uid-gallery .uid-card .uid-card-img-wrap > img,
html body.web-development-page .uid-gallery .uid-card .uid-card-img-wrap img.uid-card-img {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  min-width: 100% !important;
  min-height: 100% !important;
  object-fit: cover !important;
  object-position: top center !important;
  transform: translate3d(0, 0, 0) scale(1) !important;
}

html body.web-development-page .uid-gallery .uid-card:hover .uid-card-img,
html body.web-development-page .uid-gallery .uid-card .uid-card-img-wrap:hover > img,
html body.web-development-page .uid-gallery .uid-card .uid-card-img-wrap:hover img.uid-card-img {
  transform: translate3d(0, 0, 0) scale(1.025) !important;
}

/* Absolute last Web Development red-box image area lock. */
html body.web-development-page .uid-gallery .uid-card,
html body.web-development-page .uid-gallery .uid-card:hover {
  --web-card-inset: 20px;
  --web-card-footer-h: 92px;
  aspect-ratio: 1 / 1 !important;
  transform: none !important;
}

html body.web-development-page .uid-gallery .uid-card .uid-card-img-wrap {
  position: absolute !important;
  inset: var(--web-card-inset) var(--web-card-inset) var(--web-card-footer-h) var(--web-card-inset) !important;
  display: block !important;
  width: auto !important;
  max-width: none !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  aspect-ratio: auto !important;
  overflow: hidden !important;
  background: rgba(2,8,16,0.72) !important;
  z-index: 1 !important;
}

html body.web-development-page .uid-gallery .uid-card .uid-card-img,
html body.web-development-page .uid-gallery .uid-card .uid-card-img-wrap > img,
html body.web-development-page .uid-gallery .uid-card .uid-card-img-wrap img.uid-card-img {
  animation: none !important;
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  min-width: 100% !important;
  min-height: 100% !important;
  object-fit: cover !important;
  object-position: top center !important;
  transform: translate3d(0, 0, 0) scale(1) !important;
  transform-origin: center center !important;
  transition: transform .36s ease, filter .36s ease, opacity .36s ease !important;
}

html body.web-development-page .uid-gallery .uid-card:hover .uid-card-img,
html body.web-development-page .uid-gallery .uid-card .uid-card-img-wrap:hover > img,
html body.web-development-page .uid-gallery .uid-card .uid-card-img-wrap:hover img.uid-card-img {
  animation: none !important;
  transform: translate3d(0, 0, 0) scale(1.025) !important;
}

@media (max-width: 700px) {
  html body.web-development-page .uid-gallery .uid-card,
  html body.web-development-page .uid-gallery .uid-card:hover {
    --web-card-inset: 14px;
    --web-card-footer-h: 82px;
  }
}