/* Tú Martech Luxury Tech Background v3.2
   Fix: background layers are viewport-fixed and clipped; they must not create extra scroll/blank space.
*/

html:has(body.tt-luxury-bg) {
  min-height: 100%;
  background: #070a0a !important;
}

body.tt-luxury-bg {
  --bg-dark: #070a0a;
  --grid-size: 72px;
  --tt-bg-darkness: 0.38;
  --tt-bg-glow-strength: 0.70;
  --tt-bg-grid-strength: 0.70;
  --grid-color: rgba(150, 255, 225, calc(0.075 * var(--tt-bg-grid-strength)));

  min-height: 100%;
  overflow-x: clip;
  background:
    radial-gradient(ellipse 65% 55% at -5% 73%, rgba(18, 194, 158, calc(0.27 * var(--tt-bg-glow-strength))) 0%, transparent 70%),
    radial-gradient(ellipse 55% 45% at 105% 75%, rgba(16, 169, 188, calc(0.22 * var(--tt-bg-glow-strength))) 0%, transparent 72%),
    radial-gradient(ellipse 75% 35% at 55% 112%, rgba(148, 255, 76, calc(0.42 * var(--tt-bg-glow-strength))) 0%, rgba(45, 207, 159, calc(0.18 * var(--tt-bg-glow-strength))) 48%, transparent 78%),
    linear-gradient(180deg, #070909 0%, #090d0c 30%, #0a1311 52%, #0c2520 76%, #17624f 100%) !important;
  background-attachment: fixed !important;
  isolation: isolate;
}

/* FIX: pseudo layers fixed to viewport with negative z-index inside isolated body.
   They no longer sit as normal z-index:0 layers that may extend Divi page height. */
body.tt-luxury-bg::before {
  content: "";
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100vw;
  height: 100dvh;
  z-index: -2;
  pointer-events: none;
  background:
    radial-gradient(ellipse 50% 30% at 40% 88%, rgba(38, 225, 181, calc(0.24 * var(--tt-bg-glow-strength))), transparent 72%),
    radial-gradient(ellipse 44% 28% at 82% 92%, rgba(171, 255, 91, calc(0.15 * var(--tt-bg-glow-strength))), transparent 75%);
  filter: blur(24px);
  opacity: 0.85;
  transform: translateZ(0) scale(1.08);
  transform-origin: center;
  contain: strict;
}

body.tt-luxury-bg::after {
  content: "";
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100vw;
  height: 100dvh;
  z-index: -1;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(0, 0, 0, var(--tt-bg-darkness)), rgba(0, 0, 0, var(--tt-bg-darkness))),
    radial-gradient(ellipse at center, transparent 30%, rgba(0, 0, 0, calc(0.12 + var(--tt-bg-darkness) * 0.25)) 65%, rgba(0, 0, 0, calc(0.62 + var(--tt-bg-darkness) * 0.25)) 125%),
    repeating-linear-gradient(0deg, transparent 0, transparent calc(var(--grid-size) - 1px), var(--grid-color) calc(var(--grid-size) - 1px), var(--grid-color) var(--grid-size)),
    repeating-linear-gradient(90deg, transparent 0, transparent calc(var(--grid-size) - 1px), var(--grid-color) calc(var(--grid-size) - 1px), var(--grid-color) var(--grid-size));
  mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.72) 0%, #000 38%, #000 100%);
  -webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.72) 0%, #000 38%, #000 100%);
  contain: strict;
}

body.tt-luxury-bg-motion::before {
  animation: ttLuxuryAmbientGlow 12s ease-in-out infinite alternate;
}

@keyframes ttLuxuryAmbientGlow {
  0% { opacity: 0.65; transform: translateZ(0) scale(1.06) translate3d(-0.8%, 0.8%, 0); }
  100% { opacity: 1; transform: translateZ(0) scale(1.12) translate3d(1.2%, -0.8%, 0); }
}

/* Divi/WordPress wrappers: transparent but do not force extra height */
body.tt-luxury-bg #page-container,
body.tt-luxury-bg #page,
body.tt-luxury-bg .site,
body.tt-luxury-bg #et-main-area,
body.tt-luxury-bg #main-content,
body.tt-luxury-bg .et-l,
body.tt-luxury-bg .entry-content,
body.tt-luxury-bg .et_builder_inner_content,
body.tt-luxury-bg .et_pb_section:not(.tt-keep-bg) {
  background: transparent !important;
}

body.tt-luxury-bg #page-container,
body.tt-luxury-bg #page,
body.tt-luxury-bg .site,
body.tt-luxury-bg #et-main-area,
body.tt-luxury-bg #main-content,
body.tt-luxury-bg .et-l,
body.tt-luxury-bg .entry-content,
body.tt-luxury-bg .et_builder_inner_content,
body.tt-luxury-bg .et_pb_section,
body.tt-luxury-bg .et_pb_row,
body.tt-luxury-bg .et_pb_module,
body.tt-luxury-bg main,
body.tt-luxury-bg article,
body.tt-luxury-bg header,
body.tt-luxury-bg footer {
  position: relative;
  z-index: 0;
}

.tt-glass,
body.tt-luxury-bg .tt-glass {
  background: rgba(12, 33, 29, 0.52) !important;
  border: 1px solid rgba(118, 255, 211, 0.20) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 12px 40px rgba(0, 0, 0, 0.22) !important;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-radius: 24px;
}

@supports not (height: 100dvh) {
  body.tt-luxury-bg::before,
  body.tt-luxury-bg::after { height: 100vh; }
}

@media (max-width: 768px) {
  body.tt-luxury-bg { --grid-size: 48px; overflow-x: hidden; }
}

@media (prefers-reduced-motion: reduce) {
  body.tt-luxury-bg-motion::before { animation: none !important; }
}