/* --------------------------------------------------------------------------
   Compatibility Fallbacks
   - clamp/min/max fallback: use preferred viewport value
   - backdrop-filter fallback: strengthen solid backgrounds
   - inset fallback: rewrite core overlay positioning
   - aspect-ratio fallback: restore critical container height
   Maintenance notes:
   - Edit this file only when a change touches compatibility-sensitive CSS.
   - If you change a component that uses clamp(), aspect-ratio, backdrop-filter,
     or inset for critical layout/positioning, verify whether the fallback here
     still matches the component.
   - Normal visual tweaks such as colors, typography, spacing, and animation
     timing usually belong in the original page/common stylesheet, not here.
   -------------------------------------------------------------------------- */

@supports not (width: clamp(1px, 2px, 3px)) {
  .floating-ad-shell {
    width: 12vw;
    min-width: 8.5rem;
    max-width: 12.5rem;
  }

  .floating-ad-link {
    height: 12vw;
    min-height: 8.5rem;
    max-height: 12.5rem;
  }

  .back-to-top-btn {
    right: 2.2vw;
    bottom: 2.4vw;
    width: 3.2vw;
    min-width: 2.875rem;
    max-width: 3.5rem;
    height: 3.2vw;
    min-height: 2.875rem;
    max-height: 3.5rem;
  }

  @media (min-width: 1024px) {
    .site-nav {
      margin-right: 2.8vw;
      margin-left: 4.8vw;
    }

    .site-nav-list {
      gap: 1.6vw;
    }
  }

  .inner-page-breadcrumb-shell {
    padding-left: 2.4vw;
    padding-right: 2.4vw;
  }

  .inner-page-channel-nav {
    gap: 3vw;
  }

  .about-page-intro-media-gradient {
    width: 22vw;
  }

  .about-page-intro-inner,
  .about-page-values-inner {
    padding-left: 2.4vw;
    padding-right: 2.4vw;
  }

  .about-page-intro-inner {
    min-height: 45vw;
    padding-top: 5.2vw;
    padding-bottom: 4.2vw;
  }

  .about-page-title {
    font-size: 2.5vw;
  }

  .about-page-text {
    margin-top: 2.4vw;
    font-size: 1.05vw;
  }

  .about-page-stats {
    gap: 2vw;
    margin-top: 3vw;
  }

  .about-page-stat-number {
    font-size: 2.9vw;
  }

  .about-page-stat-label {
    font-size: 0.95vw;
  }

  .about-page-values-section {
    padding: 5vw 0 6vw;
  }

  .about-page-values-grid {
    gap: 2.1vw;
  }

  .about-page-value-card {
    min-height: 34vw;
  }

  .about-page-value-static-title,
  .about-page-value-title {
    font-size: 2.4vw;
  }

  .about-page-value-desc {
    font-size: 1.875vw;
  }

  .digital-energy-section {
    padding: 5vw 0 7vw;
  }

  .digital-energy-title {
    font-size: 2.2vw;
  }

  .digital-energy-title::after {
    width: 4.6vw;
    min-width: 3.25rem;
    max-width: 4.8rem;
  }

  .digital-energy-grid {
    gap: 2.2vw;
  }

  .innovation-collaboration-section {
    padding: 5vw 0 7vw;
  }

  .innovation-collaboration-header {
    margin-bottom: 2.8vw;
  }

  .innovation-collaboration-title {
    font-size: 2.2vw;
  }

  .innovation-collaboration-title::after {
    width: 4.6vw;
    min-width: 3.25rem;
    max-width: 4.8rem;
  }

  .innovation-collaboration-grid {
    column-gap: 1.8vw;
    row-gap: 3vw;
  }

  .industry-products-nav {
    padding: 4vw 2.4vw 6vw;
  }

  .industry-products-panel {
    min-height: 42vw;
    margin-top: 3.2vw;
  }

  .industry-products-panel-copy {
    padding-top: 2vw;
  }

  .industry-products-panel-title {
    font-size: 2.7vw;
  }

  .industry-products-panel-desc,
  .industry-products-tab-label {
    font-size: 1.1vw;
  }

  .party-building-section {
    padding-top: 4vw;
  }

  .party-building-section--last {
    padding-bottom: 6vw;
  }

  .party-building-section-heading {
    margin-bottom: 2vw;
  }

  .party-building-section-title::after {
    width: 4.2vw;
    min-width: 3rem;
    max-width: 4.2rem;
  }

  .party-building-brand-panel-copy {
    padding: 3vw;
  }

  .party-building-brand-panel-slogan {
    font-size: 1.35vw;
  }
}

@supports not ((-webkit-backdrop-filter: blur(2px)) or (backdrop-filter: blur(2px))) {
  .hero-carousel-arrow {
    background: rgba(5, 25, 54, 0.72);
    border-color: rgba(255, 255, 255, 0.36);
  }

  .hero-carousel-dots {
    background: rgba(5, 25, 54, 0.78);
    border-color: rgba(255, 255, 255, 0.2);
  }

  .sec-tech-card-collapsed-title .sec-tech-card-collapsed-link {
    background: rgba(255, 255, 255, 0.9);
    border-color: rgba(255, 255, 255, 0.92);
    color: #0a2344;
  }

  .party-building-feature-controls {
    background: rgba(34, 20, 17, 0.82);
  }
}

@supports not (inset: 0) {
  .img-overlay::after,
  .fullscreen-image-popup,
  .inner-page-hero::after,
  .hero-parallax-bg,
  .hero-parallax-bg::after,
  .hero-carousel-stage,
  .hero-carousel-slide,
  .hero-carousel-picture,
  .hero-bg-fallback,
  .hero-bg-video,
  .about-page-intro-section::before,
  .about-page-intro-media::before,
  .about-page-value-image,
  .industry-products-panel-slide,
  .industry-products-panel-visual::after,
  .party-building-feature-slide {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
  }

  .about-page-intro-section::after,
  .about-page-value-overlay,
  .digital-energy-card-caption {
    top: auto;
    right: 0;
    bottom: 0;
    left: 0;
  }

  .about-page-intro-media {
    top: 0;
    right: 0;
    bottom: 0;
    left: auto;
  }

  .about-page-intro-media-gradient {
    top: 0;
    right: auto;
    bottom: 0;
    left: 0;
  }
}

@supports not (aspect-ratio: 1 / 1) {
  .floating-ad-link {
    height: 12vw;
    min-height: 8.5rem;
    max-height: 12.5rem;
  }

  .digital-energy-card-media {
    height: 0;
    padding-top: 66.4102564%;
  }

  .digital-energy-card-image {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    height: 100%;
  }

  .innovation-collaboration-card-media {
    height: 0;
    padding-top: 66.4031621%;
  }

  .innovation-collaboration-card-image {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    height: 100%;
  }

  .footer-media-qr-placeholder {
    min-height: 6rem;
  }

  .footer-media-qr-modal-placeholder {
    height: 18.5rem;
  }

  .party-building-content-texture {
    height: 0;
    padding-top: 78.1666667%;
  }

  .party-building-feature-figure {
    height: 0;
    padding-top: 62.0731707%;
  }

  .party-building-feature-carousel {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
  }

  .party-building-feature-image {
    height: 100%;
  }
}