/* Mireora performance layer
   Keeps the visual hierarchy while avoiding GPU-heavy effects that caused
   scroll and form interaction lag on mid-range laptops and mobile devices. */

html {
  scroll-behavior: auto !important;
}

body {
  text-rendering: auto;
}

/* A fixed full-screen radial layer repaints during every scroll frame. */
body::after {
  display: none !important;
}

/* Replace real-time glass blur with visually similar translucent surfaces. */
.site-header,
.site-header.scrolled {
  background: linear-gradient(135deg, rgba(16, 13, 23, .97), rgba(9, 8, 13, .96)) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow: 0 12px 34px rgba(0, 0, 0, .22), inset 0 1px rgba(255, 255, 255, .035) !important;
  transition-property: border-color, background-color, transform !important;
}

.desktop-nav,
.header-action,
.menu-toggle,
.mobile-menu,
.visual-chip,
.dialog-close,
.choice-actions,
.submit-panel,
.configurator-price,
.inquiry-dialog::backdrop {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

.desktop-nav,
.header-action,
.menu-toggle {
  background: rgba(23, 19, 32, .94) !important;
}

.mobile-menu {
  background: rgba(7, 7, 10, .985) !important;
}

.visual-chip {
  background: rgba(13, 11, 18, .94) !important;
}

.dialog-close {
  background: rgba(15, 12, 21, .98) !important;
  box-shadow: 0 8px 22px rgba(0, 0, 0, .22), inset 0 1px rgba(255, 255, 255, .05) !important;
}

.choice-actions,
.submit-panel {
  background: linear-gradient(135deg, rgba(37, 25, 62, .985), rgba(10, 9, 14, .985)) !important;
  box-shadow: 0 -10px 28px rgba(0, 0, 0, .20), inset 0 1px rgba(255, 255, 255, .035) !important;
}

.configurator-price {
  background: rgba(10, 8, 14, .96) !important;
}

.inquiry-dialog::backdrop {
  background: rgba(2, 2, 5, .94) !important;
}

/* Stop continuous decorative animations. They were the main source of
   persistent GPU work even while the page was idle. */
.ambient-orb,
.ambient-noise,
.interface-status i,
.visual-orbit,
.studio-mark span,
.cta-orbit::before,
.cta-orbit::after,
.inquiry-dialog[open] {
  animation: none !important;
}

.ambient-noise {
  display: none !important;
}

/* Keep decorative lines and circles static instead of removing them. */
.visual-orbit,
.studio-mark span,
.cta-orbit::before,
.cta-orbit::after {
  will-change: auto !important;
}

/* Avoid expensive blur filters on large paint areas. */
.ambient-orb,
.hero-visual::before,
.service-glow {
  filter: none !important;
}

.ambient-orb {
  opacity: .15 !important;
}

/* Large shadows are expensive during scroll and hover. */
.visual-card {
  will-change: auto !important;
  box-shadow: 0 20px 54px rgba(0, 0, 0, .38), 0 0 28px rgba(103, 61, 211, .07) !important;
}

.product-card,
.design-service,
.process-card,
.studio-note,
.final-cta,
.product-configurator,
.inquiry-dialog {
  box-shadow: 0 16px 48px rgba(0, 0, 0, .20), inset 0 1px rgba(255, 255, 255, .035) !important;
}

.product-card:hover,
.process-card:hover {
  box-shadow: 0 20px 54px rgba(0, 0, 0, .24) !important;
}

/* Skip painting below-the-fold sections until they approach the viewport. */
.collection,
.design-service,
.process,
.studio-note,
.final-cta,
.site-footer {
  content-visibility: auto;
  contain-intrinsic-size: 1px 850px;
}

.product-card,
.process-card,
.choice-card,
.config-field,
.form-section {
  contain: layout paint style;
}

.product-card-media,
.configurator-product-media,
.design-visual figure {
  contain: paint;
}


.choice-card,
.option-card,
.config-field,
.form-section,
.modern-field input,
.modern-field textarea,
.upload-card {
  box-shadow: none !important;
}

/* Prevent unnecessary transitions from touching shadow/filter properties. */
.product-card,
.process-card,
.visual-card,
.button,
.header-action,
.dialog-close,
.choice-card,
.option-card {
  transition-property: transform, border-color, background-color, color, opacity !important;
}

/* Make image decoding/layout predictable and keep off-screen images cheap. */
img {
  height: auto;
}


/* Mobile hardware benefits from an even lighter decorative layer. */
@media (max-width: 900px), (pointer: coarse) {
  .visual-guide,
  .visual-object,
  .cta-orbit::before,
  .cta-orbit::after {
    display: none !important;
  }

  .visual-orbit {
    opacity: .28 !important;
  }

  .visual-card,
  .product-card,
  .design-service,
  .process-card,
  .studio-note,
  .final-cta,
  .product-configurator,
  .inquiry-dialog {
    box-shadow: 0 10px 30px rgba(0, 0, 0, .18), inset 0 1px rgba(255, 255, 255, .025) !important;
  }

  .button,
  .header-action,
  .dialog-close,
  .product-card,
  .process-card,
  .choice-card,
  .option-card {
    transition-duration: .14s !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
}