/* Polar Maxima — premium glassmorphism (site-wide) */

:root {
  --glass-blur: 14px;
  --glass-blur-strong: 22px;
  --glass-surface: rgba(255, 252, 245, 0.62);
  --glass-surface-strong: rgba(255, 252, 245, 0.82);
  --glass-surface-soft: rgba(255, 252, 245, 0.45);
  --glass-border: rgba(var(--rgb-gold), 0.22);
  --glass-border-dark: rgba(var(--rgb-deep), 0.1);
  --glass-highlight: inset 0 1px 0 rgba(255, 255, 255, 0.92);
  --glass-shadow:
    0 4px 24px rgba(var(--rgb-deep), 0.08),
    0 1px 0 rgba(255, 255, 255, 0.6) inset;
  --glass-shadow-lg:
    0 12px 40px rgba(var(--rgb-deep), 0.12),
    0 1px 0 rgba(255, 255, 255, 0.75) inset;
  --glass-dark: rgba(var(--rgb-deep), 0.42);
  --glass-dark-border: rgba(255, 255, 255, 0.22);
  --glass-accent-tint: rgba(var(--rgb-gold), 0.18);
  --glass-cta-tint: rgba(var(--rgb-cta), 0.88);
}

/* Premium ambient page background */
body {
  background-color: var(--color-warm-bg);
  background-image:
    radial-gradient(ellipse 90% 70% at 8% 12%, rgba(var(--rgb-gold), 0.1) 0%, transparent 55%),
    radial-gradient(ellipse 70% 55% at 92% 8%, rgba(var(--rgb-deep), 0.07) 0%, transparent 50%),
    radial-gradient(ellipse 80% 50% at 50% 95%, rgba(235, 227, 208, 0.95) 0%, transparent 60%),
    linear-gradient(168deg, var(--color-surface) 0%, var(--color-warm-bg) 40%, var(--color-warm-bg-alt) 100%);
  background-attachment: fixed;
}

/* Dark hero sections — depth + glass orbs */
.hero,
.page-hero,
.system-hero,
.mini-me-spotlight,
.cta-band,
.section--dark {
  position: relative;
}

.hero::before,
.page-hero::before,
.system-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 55% 45% at 85% 15%, rgba(var(--rgb-gold), 0.2) 0%, transparent 55%),
    radial-gradient(ellipse 40% 35% at 5% 75%, rgba(255, 255, 255, 0.06) 0%, transparent 50%);
  pointer-events: none;
  z-index: 0;
}

.hero > .container,
.page-hero > .container,
.system-hero > .container {
  position: relative;
  z-index: 1;
}

.hero {
  background:
    linear-gradient(145deg, rgba(var(--rgb-deep), 0.97) 0%, rgba(15, 61, 74, 0.95) 40%, rgba(var(--rgb-teal), 0.98) 100%);
}

.page-hero {
  background:
    linear-gradient(165deg, rgba(var(--rgb-deep), 0.96) 0%, rgba(var(--rgb-teal), 0.94) 55%, rgba(26, 107, 122, 0.92) 100%);
}

.section--dark {
  background:
    linear-gradient(165deg, rgba(var(--rgb-deep), 0.94) 0%, rgba(var(--rgb-teal), 0.92) 100%);
}

.section--alt {
  background: rgba(235, 227, 208, 0.5);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

/* —— Buttons (glassy) —— */
.btn {
  position: relative;
  overflow: hidden;
  border-radius: var(--radius-lg);
  backdrop-filter: blur(var(--glass-blur));
  -webkit-backdrop-filter: blur(var(--glass-blur));
  box-shadow: var(--glass-highlight), 0 4px 16px rgba(var(--rgb-deep), 0.08);
  transition:
    background 0.45s cubic-bezier(0.16, 1, 0.3, 1),
    color 0.45s cubic-bezier(0.16, 1, 0.3, 1),
    border-color 0.45s cubic-bezier(0.16, 1, 0.3, 1),
    box-shadow 0.5s cubic-bezier(0.16, 1, 0.3, 1),
    transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.btn::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.35) 0%, transparent 48%);
  pointer-events: none;
  border-radius: inherit;
}

.btn:hover {
  transform: translateY(-2px);
  box-shadow: var(--glass-highlight), 0 8px 28px rgba(var(--rgb-deep), 0.14);
}

.btn:active {
  transform: translateY(0);
}

.btn--primary {
  background: linear-gradient(
    135deg,
    rgba(var(--rgb-cta), 0.95) 0%,
    rgba(var(--rgb-gold), 0.9) 100%
  );
  border-color: rgba(255, 255, 255, 0.4);
  color: #fff;
  box-shadow:
    var(--glass-highlight),
    0 6px 24px rgba(var(--rgb-cta), 0.38);
}

.btn--primary:hover {
  background: linear-gradient(
    135deg,
    rgba(var(--rgb-gold), 0.98) 0%,
    rgba(223, 197, 96, 0.95) 100%
  );
  border-color: rgba(255, 255, 255, 0.55);
  color: #fff;
}

.btn--secondary {
  background: var(--glass-surface-soft);
  border-color: rgba(var(--rgb-deep), 0.22);
  color: var(--color-deep);
}

.btn--secondary:hover {
  background: var(--glass-surface-strong);
  border-color: rgba(var(--rgb-deep), 0.35);
  color: var(--color-deep);
}

.btn--accent {
  background: linear-gradient(
    135deg,
    rgba(var(--rgb-gold), 0.88) 0%,
    rgba(223, 197, 96, 0.82) 100%
  );
  border-color: rgba(255, 255, 255, 0.45);
  color: var(--color-deep);
  box-shadow:
    var(--glass-highlight),
    0 6px 22px rgba(var(--rgb-gold), 0.3);
}

.btn--accent:hover {
  background: linear-gradient(
    135deg,
    rgba(223, 197, 96, 0.95) 0%,
    rgba(var(--rgb-gold), 0.9) 100%
  );
  border-color: rgba(255, 255, 255, 0.55);
}

.btn--ghost-light {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.45);
  color: #fff;
  box-shadow: var(--glass-highlight), 0 4px 20px rgba(0, 0, 0, 0.12);
}

.btn--ghost-light:hover {
  background: rgba(255, 255, 255, 0.22);
  border-color: rgba(255, 255, 255, 0.7);
  color: #fff;
}

/* Buttons on dark bands */
.hero .btn--primary,
.page-hero .btn--primary,
.system-hero .btn--primary,
.section--dark .btn--primary,
.cta-band .btn--primary,
.mini-me-spotlight .btn--primary {
  background: linear-gradient(
    135deg,
    rgba(var(--rgb-cta), 0.92) 0%,
    rgba(var(--rgb-gold), 0.88) 100%
  );
  border-color: rgba(255, 255, 255, 0.35);
}

.hero .btn--secondary,
.page-hero .btn--secondary,
.system-hero .btn--secondary,
.section--dark .btn--secondary,
.cta-band .btn--secondary {
  background: rgba(255, 255, 255, 0.12);
  border-color: rgba(255, 255, 255, 0.4);
  color: #fff;
}

.hero .btn--secondary:hover,
.page-hero .btn--secondary:hover,
.system-hero .btn--secondary:hover,
.section--dark .btn--secondary:hover,
.cta-band .btn--secondary:hover {
  background: rgba(255, 255, 255, 0.24);
  border-color: rgba(255, 255, 255, 0.65);
  color: #fff;
}

/* Header glass */
.site-header {
  background: rgba(250, 248, 245, 0.65);
  backdrop-filter: blur(var(--glass-blur-strong)) saturate(1.2);
  -webkit-backdrop-filter: blur(var(--glass-blur-strong)) saturate(1.2);
  border-bottom: 1px solid var(--glass-border);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
}

.site-header.is-scrolled {
  background: rgba(255, 255, 255, 0.72);
  box-shadow: var(--glass-shadow);
}

.main-nav .btn--primary {
  box-shadow:
    var(--glass-highlight),
    0 4px 18px rgba(var(--rgb-cta), 0.32);
}

@media (max-width: 900px) {
  .main-nav.is-open {
    background: rgba(255, 255, 255, 0.88);
    backdrop-filter: blur(var(--glass-blur-strong));
    -webkit-backdrop-filter: blur(var(--glass-blur-strong));
  }
}

/* Glass surfaces — cards, panels, tiles */
.card,
.compare-block,
.flow-col,
.model-card,
.panel,
.doc-table,
.tech-card,
.stat,
.icon-tile,
.visual-compare__panel,
.pillar--visual,
.process-step,
.home-product-teaser,
.vision-card,
.about-pillar,
.team-card,
.director-card,
.employee-card,
.about-director-card,
.system-pillar,
.system-metric,
.system-assembly__step,
.system-extreme-item,
.system-diagram__canvas,
.system-layer-btn,
.kits-benefit-card,
.kits-process-step,
.kits-infographic,
.house-stat,
.house-gallery__thumb,
.products-subnav,
.system-subnav,
.breadcrumbs,
.partner-form-wrap,
.tag-list li,
.slideshow__btn,
.slideshow__dot,
.model-card--catalog {
  backdrop-filter: blur(var(--glass-blur));
  -webkit-backdrop-filter: blur(var(--glass-blur));
}

.card,
.compare-block,
.model-card,
.tech-card,
.icon-tile,
.about-pillar,
.team-card,
.director-card,
.employee-card,
.about-director-card,
.system-pillar,
.system-metric,
.system-assembly__step,
.system-extreme-item,
.kits-benefit-card,
.kits-process-step,
.house-stat,
.home-product-teaser,
.vision-card {
  background: var(--glass-surface) !important;
  border: 1px solid var(--glass-border) !important;
  box-shadow: var(--glass-shadow) !important;
}

.card:hover,
.model-card:hover,
.about-pillar:hover,
.system-pillar:hover,
.icon-tile:hover,
.home-product-teaser:hover {
  box-shadow: var(--glass-shadow-lg) !important;
}

.compare-block,
.flow-col {
  background: var(--glass-surface-strong) !important;
  border: 1px solid var(--glass-border) !important;
  box-shadow: var(--glass-shadow) !important;
}

.panel--problem {
  background: rgba(255, 245, 242, 0.65) !important;
  border: 1px solid rgba(240, 212, 204, 0.8) !important;
  backdrop-filter: blur(var(--glass-blur));
}

.panel--solution {
  background: rgba(238, 248, 247, 0.65) !important;
  border: 1px solid rgba(184, 224, 220, 0.8) !important;
}

.visual-compare__panel--problem {
  background: rgba(255, 245, 242, 0.55) !important;
  border: 1px solid rgba(240, 212, 204, 0.75) !important;
}

.visual-compare__panel--solution {
  background: rgba(238, 250, 249, 0.55) !important;
  border: 1px solid rgba(184, 224, 220, 0.75) !important;
}

.system-compare__card--old,
.system-compare__card--new {
  backdrop-filter: blur(var(--glass-blur));
  -webkit-backdrop-filter: blur(var(--glass-blur));
  box-shadow: var(--glass-shadow) !important;
}

.system-compare__card--old {
  background: linear-gradient(
    160deg,
    rgba(255, 248, 246, 0.75) 0%,
    rgba(255, 239, 232, 0.65) 100%
  ) !important;
}

.system-compare__card--new {
  background: linear-gradient(
    160deg,
    rgba(238, 250, 249, 0.75) 0%,
    rgba(224, 244, 242, 0.65) 100%
  ) !important;
}

.system-hero__stat {
  background: rgba(255, 255, 255, 0.1) !important;
  border: 1px solid var(--glass-dark-border) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: var(--glass-highlight);
}

.system-diagram__canvas {
  background: linear-gradient(
    180deg,
    rgba(248, 246, 242, 0.85) 0%,
    rgba(238, 245, 244, 0.75) 100%
  ) !important;
  border: 1px solid var(--glass-border) !important;
}

.system-layer-btn {
  background: var(--glass-surface) !important;
}

.system-layer-btn:hover,
.system-layer-btn.is-active {
  background: rgba(var(--rgb-gold), 0.15) !important;
}

.badge,
.hero .badge {
  background: rgba(var(--rgb-gold), 0.2) !important;
  border: 1px solid rgba(var(--rgb-gold), 0.45) !important;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  box-shadow: var(--glass-highlight);
}

.tag-list li {
  background: var(--glass-surface-soft) !important;
  border: 1px solid var(--glass-border) !important;
  box-shadow: 0 2px 8px rgba(var(--rgb-deep), 0.05);
}

/* Forms */
.form input,
.form select,
.form textarea {
  background: var(--glass-surface-strong) !important;
  border: 1px solid rgba(var(--rgb-deep), 0.12) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: var(--glass-highlight);
}

.form input:focus,
.form select:focus,
.form textarea:focus {
  border-color: rgba(var(--rgb-gold), 0.55) !important;
  box-shadow: var(--glass-highlight), 0 0 0 3px rgba(var(--rgb-gold), 0.15);
}

/* Subnavs & breadcrumbs */
.products-subnav,
.system-subnav,
.breadcrumbs {
  background: rgba(255, 255, 255, 0.55) !important;
  backdrop-filter: blur(var(--glass-blur-strong));
  -webkit-backdrop-filter: blur(var(--glass-blur-strong));
  border-bottom: 1px solid var(--glass-border) !important;
}

.products-subnav a:hover,
.system-subnav a:hover {
  background: rgba(255, 255, 255, 0.5);
}

.products-subnav a.is-active,
.system-subnav a.is-active {
  background: rgba(var(--rgb-gold), 0.2) !important;
  border: 1px solid rgba(var(--rgb-gold), 0.25);
}

/* CTA band */
.cta-band {
  background: linear-gradient(
    135deg,
    rgba(var(--rgb-deep), 0.88) 0%,
    rgba(var(--rgb-teal), 0.85) 100%
  ) !important;
  border: 1px solid var(--glass-dark-border);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: var(--glass-shadow-lg);
}

/* Footer — subtle glass top edge */
.site-footer {
  background: linear-gradient(
    180deg,
    rgba(var(--rgb-deep), 0.98) 0%,
    rgba(8, 38, 50, 1) 100%
  );
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

/* Back to top */
.back-to-top {
  background: linear-gradient(
    135deg,
    rgba(var(--rgb-cta), 0.9) 0%,
    rgba(var(--rgb-gold), 0.85) 100%
  );
  border: 1px solid rgba(255, 255, 255, 0.35);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: var(--glass-highlight), 0 8px 24px rgba(var(--rgb-cta), 0.35);
}

/* Slideshow controls */
.slideshow__btn {
  background: var(--glass-surface-strong) !important;
  border: 1px solid var(--glass-border) !important;
  box-shadow: var(--glass-shadow);
}

.slideshow__btn:hover,
.slideshow__btn:focus-visible {
  background: rgba(var(--rgb-gold), 0.25) !important;
}

/* Mini-me tabs */
.mini-me-spotlight__tab {
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid var(--glass-dark-border) !important;
  backdrop-filter: blur(10px);
}

.mini-me-spotlight__tab.is-active {
  background: rgba(var(--rgb-gold), 0.35) !important;
  border-color: rgba(255, 255, 255, 0.35) !important;
  box-shadow: var(--glass-highlight);
}

.mini-me-spotlight__stat {
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid var(--glass-dark-border);
  backdrop-filter: blur(10px);
}

.mini-me-spotlight__actions .btn--primary,
.kits-process-step__num {
  backdrop-filter: blur(var(--glass-blur));
  -webkit-backdrop-filter: blur(var(--glass-blur));
}

.about-director__photo,
.team-card__photo,
.director-card__photo {
  border: 1px solid var(--glass-border);
  box-shadow: var(--glass-shadow);
}

.team-card__linkedin:not(.team-card__linkedin--pending) {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.45),
    0 6px 22px rgba(10, 102, 194, 0.4) !important;
}

.about-mission-icon {
  background: var(--glass-surface) !important;
  border: 1px solid var(--glass-border) !important;
  box-shadow: var(--glass-shadow);
}

.kits-benefit-card__icon,
.kits-infographic__ring {
  box-shadow: var(--glass-highlight);
}

/* Nav dropdown (desktop) */
@media (min-width: 901px) {
  .nav-dropdown {
    background: rgba(255, 255, 255, 0.96) !important;
    backdrop-filter: blur(var(--glass-blur-strong));
    -webkit-backdrop-filter: blur(var(--glass-blur-strong));
    border: 1px solid var(--color-border) !important;
    box-shadow: var(--shadow-lg) !important;
  }

  .nav-dropdown--catalog {
    border-color: var(--color-border) !important;
  }
}

/* Vision cards expanded */
.vision-card.is-expanded {
  background: var(--glass-surface-strong) !important;
  box-shadow: var(--glass-shadow-lg) !important;
}

/* Reduced motion — keep readability */
@media (prefers-reduced-motion: reduce) {
  .btn:hover {
    transform: none;
  }
}

/* Fallback when backdrop-filter unsupported */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .btn--primary {
    background: var(--color-cta);
  }

  .btn--secondary {
    background: var(--color-surface);
  }

  .card,
  .model-card {
    background: var(--color-surface) !important;
  }

  body {
    background: var(--color-warm-bg);
  }
}