* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
body {
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  margin: 0;
  padding: 0;
  overflow-x: hidden;
}

/* PlayStation Button Animations */
.glow-red {
  animation: glow-red 2s ease-in-out infinite;
}

.glow-green {
  animation: glow-green 2s ease-in-out infinite;
}

.glow-yellow {
  animation: glow-yellow 2s ease-in-out infinite;
}

.glow-blue {
  animation: glow-blue 2s ease-in-out infinite;
}

@keyframes glow-red {
  0%, 100% { box-shadow: 0 0 15px rgba(239, 68, 68, 0.5); }
  50% { box-shadow: 0 0 30px rgba(239, 68, 68, 0.8); }
}

@keyframes glow-green {
  0%, 100% { box-shadow: 0 0 15px rgba(34, 197, 94, 0.5); }
  50% { box-shadow: 0 0 30px rgba(34, 197, 94, 0.8); }
}

@keyframes glow-yellow {
  0%, 100% { box-shadow: 0 0 15px rgba(234, 179, 8, 0.5); }
  50% { box-shadow: 0 0 30px rgba(234, 179, 8, 0.8); }
}

@keyframes glow-blue {
  0%, 100% { box-shadow: 0 0 15px rgba(59, 130, 246, 0.5); }
  50% { box-shadow: 0 0 30px rgba(59, 130, 246, 0.8); }
}

.path-glow {
  stroke: url(#gradient);
  animation: path-glow 3s linear infinite;
}

@keyframes path-glow {
  0% { stroke-dashoffset: 0; }
  100% { stroke-dashoffset: 20; }
}

/* Content Section Animations */
.glow-text-red {
  text-shadow: 0 0 10px rgba(239, 68, 68, 0.5);
}

.glow-text-green {
  text-shadow: 0 0 10px rgba(34, 197, 94, 0.5);
}

.glow-text-yellow {
  text-shadow: 0 0 10px rgba(234, 179, 8, 0.5);
}

.glow-text-blue {
  text-shadow: 0 0 10px rgba(59, 130, 246, 0.5);
}

.glow-border-red {
  transition: all 0.3s ease;
}

.glow-border-red:hover {
  box-shadow: 0 0 20px rgba(239, 68, 68, 0.6);
  transform: scale(1.05) translateY(-5px);
}

.glow-border-green {
  transition: all 0.3s ease;
}

.glow-border-green:hover {
  box-shadow: 0 0 20px rgba(34, 197, 94, 0.6);
  transform: scale(1.05) translateY(-5px);
}

.glow-border-yellow {
  transition: all 0.3s ease;
}

.glow-border-yellow:hover {
  box-shadow: 0 0 20px rgba(234, 179, 8, 0.6);
  transform: scale(1.05) translateY(-5px);
}

.glow-border-blue {
  transition: all 0.3s ease;
}

.glow-border-blue:hover {
  box-shadow: 0 0 20px rgba(59, 130, 246, 0.6);
  transform: scale(1.05) translateY(-5px);
}
.hamburger {
    cursor: pointer;
}
.hamburger input {
    display: none;
}
.hamburger svg {
    height: 3em;
    transition: transform 600ms cubic-bezier(0.4, 0, 0.2, 1);
}
.line {
    fill: none;
    stroke: white;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 3;
    transition: stroke-dasharray 600ms cubic-bezier(0.4, 0, 0.2, 1),
                stroke-dashoffset 600ms cubic-bezier(0.4, 0, 0.2, 1);
}
.line-top-bottom {
    stroke-dasharray: 12 63;
}
.hamburger input:checked + svg {
    transform: rotate(-45deg);
}
.hamburger input:checked + svg .line-top-bottom {
    stroke-dasharray: 20 300;
    stroke-dashoffset: -32.42;
}

@keyframes gradient {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

.animate-gradient {
    background-size: 400% 400%;
    animation: gradient 15s ease infinite;
}

.logos {
    display: flex;
    gap: 3rem; /* المسافة بين الشعارات */
    will-change: transform;
}

.logo {
    height: 4rem;
    object-fit: contain;
    opacity: 0.7;
    transition: opacity 0.3s;
}

.logo:hover {
    opacity: 1;
}

/* ... existing code ... */
.bg-grid-pattern {
    background-image: linear-gradient(to right, #ffffff0a 1px, transparent 1px),
                      linear-gradient(to bottom, #ffffff0a 1px, transparent 1px);
    background-size: 24px 24px;
}

@keyframes float {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-20px); }
}

.animate-float {
    animation: float 6s ease-in-out infinite;
}

.glow-hover {
    transition: all 0.3s ease;
}

.glow-hover:hover {
    box-shadow: 0 0 30px rgba(239, 68, 68, 0.5);
    transform: translateY(-5px);
}