 * {
     margin: 0;
     padding: 0;
     box-sizing: border-box;
 }

 body {
     font-family: 'Arial', sans-serif;
     background: #080808;
     color: #fff;
     overflow-x: hidden;
	 
 }

 .waveform-bg {
     position: fixed;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     z-index: 0;
     opacity: 0.15;
 }

 .wave-bar {
     position: absolute;
     bottom: 0;
     width: 4px;
     background: linear-gradient(to top, #ff6600, #ff9900);
     animation: wave 1.5s ease-in-out infinite;
     transform-origin: bottom;
 }

 @keyframes wave {

     0%,
     100% {
         transform: scaleY(0.3);
     }

     50% {
         transform: scaleY(1);
     }
 }

 .hero {
     position: relative;
     height: 100vh;
     display: flex;
     align-items: center;
     justify-content: center;
     overflow: hidden;
 }

 .hero-split {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background-size: cover;
     background-position: center;
     clip-path: polygon(0 0, 100% 0, 100% 85%, 0 100%);
 }

 .hero-content {
     position: relative;
     z-index: 10;
     text-align: center;
     padding: 20px;
 }

 .dj-text {
     font-size: clamp(60px, 15vw, 160px);
     font-weight: 900;
     letter-spacing: 15px;
     position: relative;
     display: inline-block;
     margin-bottom: 10px;
 }

 .dj-text span {
     display: inline-block;
     background: linear-gradient(45deg, #ff6600, #ff9900, #ffcc00);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     background-clip: text;
     animation: letterPulse 2s ease-in-out infinite;
 }

 .dj-text span:nth-child(1) {
     animation-delay: 0s;
 }

 .dj-text span:nth-child(2) {
     animation-delay: 0.1s;
 }

 .dj-text span:nth-child(3) {
     animation-delay: 0.2s;
 }

 .dj-text span:nth-child(4) {
     animation-delay: 0.3s;
 }

 .dj-text span:nth-child(5) {
     animation-delay: 0.4s;
 }

 .dj-text span:nth-child(6) {
     animation-delay: 0.5s;
 }

 .dj-text span:nth-child(7) {
     animation-delay: 0.6s;
 }

 .dj-text span:nth-child(8) {
     animation-delay: 0.7s;
 } 

 @keyframes letterPulse {

     0%,
     100% {
         transform: scale(1);
         filter: brightness(1);
     }

     50% {
         transform: scale(0.93);
         filter: brightness(1.5);
     }
 }

 .hero-subtitle {
     font-size: clamp(16px, 2.5vw, 22px);
     margin: 20px auto 10px;
     color: #ddd;
     font-weight: 400;
     letter-spacing: 1px;
     max-width: 800px;
     line-height: 1.6;
 }

 .hero-locations {
     font-size: clamp(14px, 2vw, 18px);
     margin: 0 auto 40px;
     color: #aaa;
     font-weight: 300;
     max-width: 700px;
     line-height: 1.8;
 }

 .hero-locations strong {
     color: #ff9900;
     display: block;
     margin-bottom: 8px;
 }

 .cta-group {
     display: flex;
     gap: 30px;
     justify-content: center;
     flex-wrap: wrap;
 }

 .cta-btn {
     position: relative;
     padding: 20px 45px;
     font-size: 18px;
     font-weight: bold;
     text-decoration: none;
     color: #fff;
     background: transparent;
     border: 3px solid #ff6600;
     clip-path: polygon(10% 0%, 100% 0%, 90% 100%, 0% 100%);
     transition: all 0.3s ease;
     cursor: pointer;
 }

 .cta-btn:hover {
     background: #ff6600;
     transform: translateY(-5px) scale(1.05);
     box-shadow: 0 10px 30px rgba(255, 102, 0, 0.5);
 }

 .cta-btn.primary {
     background: linear-gradient(135deg, #ff6600, #ff9900);
     border: none;
     color: #000;
 }

 .cta-btn.primary:hover {
     background: linear-gradient(135deg, #ff9900, #ffcc00);
 }

 .cta-group-down {
     display: flex;
     gap: 25px;
     justify-content: center;
     flex-wrap: wrap;
 }

 .cta-btn-down {
     position: relative;
     padding: 10px 20px;
     font-size: 18px;
     font-weight: bold;
	 text-align: center;
     text-decoration: none;
     color: #fff;
     background: transparent;
     border: 3px solid #ff6600;
     clip-path: polygon(10% 0%, 100% 0%, 90% 100%, 0% 100%);
     transition: all 0.3s ease;
     cursor: pointer;
 }

 .cta-btn-down:hover {
     background: #ff6600;
     transform: translateY(-5px) scale(1.05);
     box-shadow: 0 10px 30px rgba(255, 102, 0, 0.5);
 }

 .cta-btn.primary-down {
     background: linear-gradient(135deg, #ff6600, #ff9900);
     border: none;
	 text-align: center;
	 padding: 10px 20px;
     color: #000;
 }

 .cta-btn.primary-down:hover {
     background: linear-gradient(135deg, #ff9900, #ffcc00);
 }

.marquee-section {
    overflow: hidden;
    position: relative;
    width: 100%;
	     padding: 40px 0;
     background: linear-gradient(90deg,
             transparent 0%,
             rgba(255, 102, 0, 0.05) 50%,
             transparent 100%);
     border-top: 2px solid rgba(255, 102, 0, 0.3);
     border-bottom: 2px solid rgba(255, 102, 0, 0.3);
}

.marquee-wrapper {
    display: flex;
    width: max-content;
}

.marquee {
    display: flex;
    white-space: nowrap;
    position: relative;
}

.marquee span {
    font-size: clamp(40px, 8vw, 80px);
    font-weight: 900;
    color: rgba(255, 102, 0, 0.2);
    padding: 0 50px;
    text-transform: uppercase;
    flex-shrink: 0;
}

/*
 .marquee-section {
     padding: 80px 0;
     overflow: hidden;
     background: linear-gradient(90deg,
             transparent 0%,
             rgba(255, 102, 0, 0.05) 50%,
             transparent 100%);
     border-top: 2px solid rgba(255, 102, 0, 0.3);
     border-bottom: 2px solid rgba(255, 102, 0, 0.3);
 }

.marquee-wrapper {
	display: flex;
	will-change: transform;
	animation: scroll 60s linear infinite;
	/*width: fit-content;*//*
}

 .marquee {
     display: flex;
	 flex-shrink: 0;
     /*animation: scroll 30s linear infinite;*//*
     white-space: nowrap;
 }

 .marquee span {
     font-size: clamp(40px, 8vw, 80px);
     font-weight: 900;
     color: rgba(255, 102, 0, 0.2);
     padding: 0 50px;
     text-transform: uppercase;
 }

 @keyframes scroll {
     0% {
         transform: translateX(0);
     }

     100% {
         transform: translateX(-50%);
     }
 }
 */

 .about-section {
     position: relative;
     padding: 150px 20px;
     background: #0a0a0a;
 }

 .about-container {
     max-width: 1400px;
     margin: 0 auto;
     display: grid;
     grid-template-columns: 400px 1fr;
     gap: 80px;
     align-items: start;
 }

 .about-left {
     position: relative;
 }

 .about-image {
     width: 100%;
     height: 600px;
     background-size: cover;
     background-position: center;
     clip-path: polygon(0 0, 100% 5%, 100% 100%, 0 95%);
     border: 3px solid rgba(255, 102, 0, 0.3);
     margin-bottom: 40px;
     transition: all 0.4s ease;
 }

 .about-image:hover {
     transform: scale(1.02);
     border-color: #ff6600;
     clip-path: polygon(0 5%, 100% 0, 100% 95%, 0 100%);
 }

 .about-title {
     font-size: clamp(40px, 6vw, 52px);
     font-weight: 900;
     line-height: 1.3;
     margin-bottom: 40px;
     background: linear-gradient(135deg, #fff, #ff9900);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     background-clip: text;
 }

 .about-accent {
     position: absolute;
     top: -30px;
     left: -30px;
     font-size: 200px;
     font-weight: 900;
     color: rgba(255, 102, 0, 0.05);
     z-index: 0;
     line-height: 1;
 }

 .about-right {
     font-size: 17px;
     line-height: 1.9;
     color: #ccc;
 }

 .about-right p {
     margin-bottom: 25px;
 }

 .about-highlight {
     background: linear-gradient(135deg, rgba(255, 102, 0, 0.1), rgba(255, 153, 0, 0.05));
     padding: 30px;
     margin: 40px 0;
     border-left: 5px solid #ff6600;
     font-weight: 600;
     color: #fff;
 }

 .service-promise {
     margin-top: 50px;
 }

 .service-promise h3 {
     color: #ff6600;
     font-size: 28px;
     margin-bottom: 25px;
     text-transform: uppercase;
     letter-spacing: 2px;
 }

 .service-item {
     margin-bottom: 25px;
     padding-left: 40px;
     position: relative;
 }

 .service-item::before {
     content: '▸';
     position: absolute;
     left: 0;
     color: #ff6600;
     font-size: 30px;
     line-height: 1;
 }

 .service-item strong {
     color: #ff9900;
 }

 .about-footer {
     margin-top: 60px;
     text-align: center;
     font-size: 32px;
     font-weight: 900;
     text-transform: uppercase;
     letter-spacing: 3px;
     background: linear-gradient(135deg, #ff6600, #ff9900, #ffcc00);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     background-clip: text;
     line-height: 1.5;
 }

 .events-section {
     padding: 150px 20px;
     background: linear-gradient(180deg, #0a0a0a 0%, #120a05 50%, #0a0a0a 100%);
     position: relative;
 }

 .events-section::before {
     content: 'EVENTS';
     position: absolute;
     top: 50px;
     left: 50%;
     transform: translateX(-50%);
     font-size: clamp(60px, 15vw, 150px);
     font-weight: 900;
     color: rgba(255, 102, 0, 0.03);
     letter-spacing: 20px;
     z-index: 0;
 }

 .events-title {
     text-align: center;
     font-size: clamp(40px, 8vw, 80px);
     font-weight: 900;
     margin-bottom: 100px;
     color: #ff6600;
     text-transform: uppercase;
     letter-spacing: 5px;
     position: relative;
     z-index: 1;
 }

 .events-container {
     max-width: 1200px;
     margin: 0 auto;
     display: grid;
     gap: 60px;
     position: relative;
     z-index: 1;
 }

 .event {
     display: grid;
     grid-template-columns: 200px 1fr;
     gap: 40px;
     padding: 50px;
     background: linear-gradient(135deg, rgba(20, 10, 5, 0.8), rgba(10, 10, 10, 0.9));
     border: 2px solid rgba(255, 102, 0, 0.2);
     position: relative;
     transition: all 0.4s ease;
 }

 .event::before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     width: 5px;
     height: 100%;
     background: linear-gradient(to bottom, #ff6600, #ff9900);
     transform: scaleY(0);
     transform-origin: top;
     transition: transform 0.4s ease;
 }

 .event:hover::before {
     transform: scaleY(1);
 }

 .event:hover {
     transform: translateX(20px);
     border-color: #ff6600;
     background: linear-gradient(135deg, rgba(30, 15, 5, 0.9), rgba(15, 10, 10, 0.95));
 }

 .event:nth-child(even) {
     grid-template-columns: 1fr 200px;
 }

 .event:nth-child(even) .event-date {
     order: 2;
 }

 .event:nth-child(even) .event-info {
     order: 1;
     text-align: right;
 }

 .event:nth-child(even) .event-location {
     justify-content: flex-end;
 }

 .event-date {
     font-size: 50px;
     font-weight: 900;
     color: #ff6600;
     line-height: 1;
     display: flex;
     flex-direction: column;
     justify-content: center;
 }

 .event-date small {
     font-size: 20px;
     color: #999;
     margin-top: 10px;
     font-weight: 400;
 }

 .event-info h3 {
     font-size: 32px;
     margin-bottom: 15px;
     color: #fff;
 }

 .event-info p {
     color: #aaa;
     font-size: 16px;
     margin-bottom: 10px;
     line-height: 1.6;
 }

 .event-info a {
     color: #ff9900;
     text-decoration: none;
     font-weight: bold;
     transition: color 0.3s ease;
 }

 .event-info a:hover {
     color: #ffcc00;
 }

 .event-location {
     margin-top: 20px;
     padding-top: 20px;
     border-top: 1px solid rgba(255, 102, 0, 0.2);
     display: flex;
     align-items: center;
     gap: 10px;
     color: #bbb;
     font-size: 15px;
 }

 .event-location::before {
     content: '📍';
     font-size: 18px;
 }

 .fab-container {
     position: fixed;
     bottom: 40px;
     right: 40px;
     display: flex;
     flex-direction: column;
     gap: 20px;
     z-index: 1000;
 }

 .fab {
     width: 70px;
     height: 70px;
     border-radius: 50%;
     background: linear-gradient(135deg, #ff6600, #ff9900);
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 30px;
     text-decoration: none;
     box-shadow: 0 10px 30px rgba(255, 102, 0, 0.4);
     transition: all 0.3s ease;
     animation: fabPulse 2s ease-in-out infinite;
 }

 .fab:hover {
     transform: scale(1.2) rotate(10deg);
     box-shadow: 0 15px 40px rgba(255, 102, 0, 0.6);
 }

 @keyframes fabPulse {

     0%,
     100% {
         box-shadow: 0 10px 30px rgba(255, 102, 0, 0.4);
     }

     50% {
         box-shadow: 0 10px 40px rgba(255, 102, 0, 0.7);
     }
 }

 footer {
     padding: 60px 20px;
     text-align: center;
     background: #000;
     border-top: 1px solid rgba(255, 102, 0, 0.2);
 }

 footer p {
     color: #666;
     font-size: 14px;
 }

 .partners-section {
     padding: 120px 20px;
     background: #0a0a0a;
     position: relative;
     overflow: hidden;
 }

 .partners-section::before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 2px;
     background: linear-gradient(90deg, transparent, #ff6600, transparent);
 }

 .partners-title {
     text-align: center;
     font-size: clamp(35px, 6vw, 60px);
     font-weight: 900;
     margin-bottom: 80px;
     color: #ff6600;
     text-transform: uppercase;
     letter-spacing: 5px;
 }

 .partners-container {
     max-width: 800px;
     margin: 0 auto;
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
     gap: 50px;
 }

 .partner-card {
     text-decoration: none;
     display: flex;
     flex-direction: column;
     align-items: center;
     gap: 25px;
     padding: 40px;
     background: linear-gradient(135deg, rgba(255, 102, 0, 0.05), rgba(255, 153, 0, 0.02));
     border: 2px solid rgba(255, 102, 0, 0.2);
     clip-path: polygon(15% 0%, 100% 0%, 85% 100%, 0% 100%);
     transition: all 0.4s ease;
     position: relative;
 }

 .partner-card::before {
     content: '';
     position: absolute;
     inset: 0;
     background: linear-gradient(135deg, rgba(255, 102, 0, 0.1), transparent);
     opacity: 0;
     transition: opacity 0.4s ease;
 }

 .partner-card:hover {
     transform: translateY(-10px) scale(1.05);
     border-color: #ff6600;
     background: linear-gradient(135deg, rgba(255, 102, 0, 0.1), rgba(255, 153, 0, 0.05));
 }

 .partner-card:hover::before {
     opacity: 1;
 }

 .partner-image {
     width: 150px;
     height: 150px;
	 /*     background-size: cover;*/
     background-size: 150px,150px;
	 background-repeat: no-repeat;
     background-position: center;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     border: 3px solid #ff6600;
     transition: all 0.4s ease;
     position: relative;
     z-index: 1;
 }

 .partner-card:hover .partner-image {
     transform: rotate(360deg);
     border-color: #ff9900;
 }

 .partner-label {
     font-size: 22px;
     font-weight: 700;
     color: #fff;
     text-transform: uppercase;
     letter-spacing: 2px;
     position: relative;
     z-index: 1;
 }

 .partner-label-raben {
     font-size: 22px;
	 left: -2%;
	 text-align: center ;
     font-weight: 700;
     color: #fff;
     text-transform: uppercase;
     letter-spacing: 1px;
     position: relative;
     z-index: 1;
 }

 .contact-section {
     padding: 150px 20px 120px;
     background: linear-gradient(180deg, #0a0a0a 0%, #150a05 100%);
     position: relative;
 }

 .contact-section::before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background:
         radial-gradient(circle at 30% 50%, rgba(255, 102, 0, 0.1), transparent 40%),
         radial-gradient(circle at 70% 80%, rgba(255, 153, 0, 0.08), transparent 40%);
     z-index: 0;
 }

 .contact-title {
     text-align: center;
     font-size: clamp(50px, 10vw, 100px);
     font-weight: 900;
     margin-bottom: 80px;
     background: linear-gradient(135deg, #ff6600, #ff9900, #ffcc00);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     background-clip: text;
     text-transform: uppercase;
     letter-spacing: 5px;
     position: relative;
     z-index: 1;
 }

 .contact-grid {
     max-width: 1100px;
     margin: 0 auto;
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
     gap: 40px;
     position: relative;
     z-index: 1;
 }

 .contact-card {
     text-decoration: none;
     padding: 60px 40px;
     background: rgba(10, 10, 10, 0.8);
     border: 3px solid rgba(255, 102, 0, 0.3);
     display: flex;
     flex-direction: column;
     align-items: center;
     gap: 20px;
     transition: all 0.4s ease;
     position: relative;
     overflow: hidden;
 }

 .email-card {
     clip-path: polygon(0 0, 100% 0, 100% 85%, 0 100%);
 }

 .insta-card {
     clip-path: polygon(0 15%, 100% 0, 100% 100%, 0 85%);
 }

 .tiktok-card {
     clip-path: polygon(0 0, 100% 15%, 100% 100%, 0 85%);
 }

 .contact-card::before {
     content: '';
     position: absolute;
     top: -50%;
     left: -50%;
     width: 200%;
     height: 200%;
     background: linear-gradient(135deg, transparent, rgba(255, 102, 0, 0.2), transparent);
     transform: rotate(45deg);
     transition: all 0.6s ease;
 }

 .contact-card:hover::before {
     left: 100%;
 }

 .contact-card:hover {
     transform: translateY(-15px) scale(1.05);
     border-color: #ff6600;
     box-shadow: 0 20px 50px rgba(255, 102, 0, 0.4);
 }

 .contact-icon {
     font-size: 70px;
     transition: transform 0.4s ease;
 }

 .contact-card:hover .contact-icon {
     transform: scale(1.2) rotate(10deg);
 }

 .contact-label {
     font-size: 24px;
     font-weight: 700;
     color: #ff9900;
     text-transform: uppercase;
     letter-spacing: 2px;
 }

 .contact-handle {
     font-size: 18px;
     color: #bbb;
     font-weight: 500;
 }

/* 🔥 Bildwechsel-Overlay (Fade-Layer) */
.fade-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  opacity: 0;
  transition: opacity 3s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 2;
  pointer-events: none;
}

/*🔳 Bildcontainer vorbereiten */
.heroImage {
  position: relative;
  overflow: hidden;
}




#heroImage {
  transition: background-image 1s ease-in-out, opacity 2s ease-in-out;
}

#aboutImage {
  position: relative;
  overflow: hidden;
  background-size: cover;
  background-position: center;
}

/* 📸 About-Image im 4:5-Verhältnis responsiv halten */
.about-image {
  aspect-ratio: 4 / 5; /* modern browsers */
  width: 100%;
  max-height: 600px; /* optional – falls du eine Obergrenze willst */
  border: 3px solid rgba(255, 102, 0, 0.3);
  background-size: cover;
  background-position: center;
  clip-path: polygon(0 0, 100% 5%, 100% 100%, 0 95%);
  transition: all 0.4s ease;
}

.about-image:hover {
  transform: scale(1.02);
  border-color: #ff6600;
  clip-path: polygon(0 5%, 100% 0, 100% 95%, 0 100%);
}


 @media (max-width: 968px) {
     .about-container {
         grid-template-columns: 1fr;
         gap: 50px;
     }

     .about-image {
         height: 800px;
		 aspect-ratio: auto;
     }

	.dj-text {
		font-size: clamp(40px, 10vw, 130px);
		letter-spacing: 10px;
		position: relative;
		display: inline-block;
		margin-bottom: 5px;
	}


     .event,
     .event:nth-child(even) {
         grid-template-columns: 1fr;
     }

     .event:nth-child(even) .event-info {
         text-align: left;
     }

     .event:nth-child(even) .event-location {
         justify-content: flex-start;
     }

     .event-date {
         order: 1 !important;
     }

     .event-info {
         order: 2 !important;
     }

     .cta-group {
         flex-direction: column;
         align-items: center;
     }

     .cta-btn {
         width: 100%;
         max-width: 300px;
     }

     .cta-group-down {
         flex-direction: column;
         align-items: center;
     }

     .cta-btn-down {
         width: 100%;
         max-width: 300px;
     }

     .fab-container {
         right: 20px;
         bottom: 20px;
     }

     .fab {
         width: 60px;
         height: 60px;
         font-size: 24px;
     }

     .stats-container {
         flex-direction: column;
         gap: 40px;
     }

     .stat-divider {
         display: none;
     }
	 	  .contact-grid {
     gap: 8px !important;
 }
 
 .partners-title {
     font-weight: 900;
     margin-bottom: 80px;
     color: #ff6600;
     text-transform: uppercase;
     letter-spacing: 5px;
 }
 .partner-label {
     font-size: 14px;
     font-weight: 550;
     color: #fff;
     text-transform: uppercase;
     letter-spacing: 0px;
     z-index: 1;
 }
  .partner-label-raben {
     font-size: 14px;
     font-weight: 550;
	 text-align: center ;
     letter-spacing: 1px;
     z-index: 1;
	 left: -5% !important; 
 }
 .partners-container {
     max-width: 800px;
     margin: 0 auto;
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
     gap: 20px;
 }

 .partner-card {
     text-decoration: none;
     align-items: center;
     gap: 5px !important;
     padding: 10px !important;
     position: relative;
 }


	 } 


 @media (max-width: 468px) {
	  .contact-grid {
     gap: 1px !important;
	  }
 .partners-title {
     font-weight: 900;
     margin-bottom: 20px;
     color: #ff6600;
     text-transform: uppercase;
     letter-spacing: 5px;
 }
 .partner-label {
     font-size: 14px;
     font-weight: 550;
     color: #fff;
     text-transform: uppercase;
     letter-spacing: 0px;
     z-index: 1;
 }
  .partner-label-raben {
     font-size: 14px;
     font-weight: 550;
	 text-align: center ;
     letter-spacing: 2px;
     z-index: 1;
	 right: 2% !important; 
 }
 .partners-container {
     max-width: 400px;
     margin: 0 auto;
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
     gap: 20px;
 }

 .partner-card {
     text-decoration: none;
     align-items: center;
     gap: 5px !important;
     padding: 10px !important;
     position: relative;
 }
 }

 .stats-section {
     padding: 100px 20px;
     background: linear-gradient(135deg, #0a0a0a, #150808, #0a0a0a);
     position: relative;
 }

 .stats-section::before,
 .stats-section::after {
     content: '';
     position: absolute;
     left: 0;
     width: 100%;
     height: 1px;
     background: linear-gradient(90deg, transparent, #ff6600, transparent);
 }

 .stats-section::before {
     top: 0;
 }

 .stats-section::after {
     bottom: 0;
 }

 .stats-container {
     max-width: 1200px;
     margin: 0 auto;
     display: flex;
     justify-content: space-around;
     align-items: center;
     gap: 60px;
 }

 .stat-item {
     text-align: center;
     flex: 1;
 }

 .stat-number {
     font-size: clamp(50px, 8vw, 90px);
     font-weight: 900;
     background: linear-gradient(135deg, #ff6600, #ff9900, #ffcc00);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     background-clip: text;
     margin-bottom: 15px;
     line-height: 1;
 }

 .stat-label {
     font-size: clamp(14px, 2vw, 18px);
     color: #aaa;
     text-transform: uppercase;
     letter-spacing: 2px;
     font-weight: 600;
 }

 .stat-divider {
     font-size: 40px;
     color: rgba(255, 102, 0, 0.3);
     animation: rotateStar 4s linear infinite;
 }

 @keyframes rotateStar {
     from {
         transform: rotate(0deg);
     }

     to {
         transform: rotate(360deg);
     }
 }

 .reveal {
     opacity: 0;
     transform: translateY(50px);
     transition: all 0.8s ease;
 }

 .reveal.active {
     opacity: 1;
     transform: translateY(0);
 }
 
 