/* 20% Size Reduction for Desktop Mode Only (screens wider than 768px) */

/* Desktop Navigation and Button Elements - 20% Reduction */
@media (min-width: 769px) {
  .navbar {
    padding: 16px 32px !important; /* Reduced from 20px 40px */
    margin: 16px 32px !important; /* Reduced from 20px 40px */
    border-radius: 16px !important; /* Reduced from 20px */
  }

  /* Book Button - 20% Reduction */
  .btn-book {
    padding: 11.2px 22.4px !important; /* Reduced from 14px 28px */
    font-size: 0.72rem !important; /* Reduced from 0.9rem */
    border-radius: 20px !important; /* Reduced from 25px */
  }

  /* Navigation Links - 20% Reduction */
  .nav-links {
    gap: 24px !important; /* Reduced from 30px */
  }

  .nav-links a {
    font-size: 0.72rem !important; /* Reduced from 0.9rem */
    padding: 6.4px 12.8px !important; /* Reduced from 8px 16px */
    border-radius: 9.6px !important; /* Reduced from 12px */
    letter-spacing: 1.2px !important; /* Reduced from 1.5px */
  }

  /* Logo Sizes - 20% Reduction */
  .logo img,
  .navbar img[src*="Logo.png"] {
    height: 40px !important; /* Reduced from 50px */
  }

  .hero-logo {
    height: 120px !important; /* Reduced from 150px */
  }

  .medium-logo {
    height: 96px !important; /* Reduced from 120px */
  }

  /* Hero Content - 20% Reduction */
  .hero-content h1 {
    font-size: 3.2rem !important; /* Reduced from 4rem */
    letter-spacing: 3.2px !important; /* Reduced from 4px */
  }

  .hero-content p {
    font-size: 0.96rem !important; /* Reduced from 1.2rem */
    letter-spacing: 1.6px !important; /* Reduced from 2px */
  }

  /* Hero Menu Button - 20% Reduction */
  .hero-menu-btn {
    padding: 20px 48px !important; /* Reduced from 25px 60px */
    font-size: 0.88rem !important; /* Reduced from 1.1rem */
    letter-spacing: 1.6px !important; /* Reduced from 2px */
    margin-top: 24px !important; /* Reduced from 30px */
    min-width: 160px !important; /* Reduced from 200px */
    gap: 6.4px !important; /* Reduced from 8px */
  }

  .hero-menu-btn .arrow-icon {
    font-size: 2.8rem !important; /* Reduced from 3.5rem */
  }

  .hero-menu-btn .btn-text {
    font-size: 0.64rem !important; /* Reduced from 0.8rem */
    letter-spacing: 1.6px !important; /* Reduced from 2px */
  }

  /* Language Selector - 20% Reduction */
  .language-btn {
    padding: 0.48rem 0.96rem !important; /* Reduced from 0.6rem 1.2rem */
    font-size: 0.72rem !important; /* Reduced from 0.9rem */
    border-radius: 20px !important; /* Reduced from 25px */
    gap: 0.64rem !important; /* Reduced from 0.8rem */
    transform: translateY(-23px) !important; /* Move button up by 23px (8px + 15px) */
  }

  .language-menu {
    padding: 0.64rem !important; /* Reduced from 0.8rem */
    border-radius: 9.6px !important; /* Reduced from 12px */
    min-width: 112px !important; /* Reduced from 140px */
  }

  .language-option {
    padding: 0.8rem 1.2rem !important; /* Reduced from 1rem 1.2rem */
    border-radius: 8px !important; /* Reduced from 10px */
    gap: 0.8rem !important; /* Reduced from 1rem */
    font-size: 0.88rem !important; /* Reduced from 1.1rem */
  }

  /* Mobile Language Button - 30% Reduction (20% + 10% additional) */
  .mobile-language-btn {
    padding: 0.35rem 0.7rem !important; /* Reduced from 0.5rem 1rem (30% total reduction) */
    font-size: 0.56rem !important; /* Reduced from 0.8rem (30% total reduction) */
    border-radius: 14px !important; /* Reduced from 20px (30% total reduction) */
    margin-left: 20px !important; /* Move to the right by 20px */
    transform: scale(0.9) !important; /* Additional 10% size reduction */
  }

  /* Mobile top-right container positioning */
  .mobile-top-right {
    position: absolute !important;
    top: -5px !important;
    right: -45px !important;
    z-index: 1000 !important;
    display: flex !important;
    gap: 0.5rem !important;
    align-items: center !important;
  }

  .mobile-language-menu {
    padding: 0.8rem !important; /* Reduced from 1rem */
    border-radius: 9.6px !important; /* Reduced from 12px */
    min-width: 160px !important; /* Reduced from 200px */
  }

  .mobile-language-menu .language-option {
    padding: 0.56rem 0.8rem !important; /* Reduced from 0.7rem 1rem */
    border-radius: 6.4px !important; /* Reduced from 8px */
    gap: 0.64rem !important; /* Reduced from 0.8rem */
    font-size: 0.8rem !important; /* Reduced from 1rem */
  }

  /* Sports Section Elements - 20% Reduction */
  .sports-features {
    gap: 2.4rem !important; /* Reduced from 3rem */
    padding: 0 1.6rem !important; /* Reduced from 0 2rem */
  }

  .feature-card {
    padding: 2.4rem 1.6rem !important; /* Reduced from 3rem 2rem */
    border-radius: 16px !important; /* Reduced from 20px */
  }

  .feature-icon {
    font-size: 3.2rem !important; /* Reduced from 4rem */
    margin-bottom: 1.6rem !important; /* Reduced from 2rem */
  }

  .feature-title {
    font-size: 1.6rem !important; /* Reduced from 2rem */
    margin-bottom: 1.2rem !important; /* Reduced from 1.5rem */
  }

  .feature-description {
    font-size: 0.88rem !important; /* Reduced from 1.1rem */
  }

  /* Sports Highlight Section - 20% Reduction */
  .sports-highlight {
    padding: 4.8rem 1.6rem !important; /* Reduced from 6rem 2rem */
  }

  .highlight-title {
    font-size: 2rem !important; /* Reduced from 2.5rem */
    margin-bottom: 1.6rem !important; /* Reduced from 2rem */
  }

  .highlight-text {
    font-size: 0.96rem !important; /* Reduced from 1.2rem */
    margin-bottom: 2.4rem !important; /* Reduced from 3rem */
  }

  /* Sports Atmosphere Section - 20% Reduction */
  .sports-atmosphere {
    padding: 4.8rem 1.6rem !important; /* Reduced from 6rem 2rem */
  }

  .atmosphere-grid {
    gap: 1.6rem !important; /* Reduced from 2rem */
  }

  .atmosphere-item {
    padding: 1.6rem !important; /* Reduced from 2rem */
    border-radius: 12px !important; /* Reduced from 15px */
  }

  .atmosphere-icon {
    font-size: 2rem !important; /* Reduced from 2.5rem */
    margin-bottom: 0.8rem !important; /* Reduced from 1rem */
  }

  .atmosphere-text {
    font-size: 0.8rem !important; /* Reduced from 1rem */
  }

  /* Additional Sports Section - 20% Reduction */
  .additional-sports {
    padding: 4.8rem 1.6rem !important; /* Reduced from 6rem 2rem */
  }

  .sports-categories {
    gap: 2.4rem !important; /* Reduced from 3rem */
  }

  .sport-category {
    padding: 2rem !important; /* Reduced from 2.5rem */
    border-radius: 16px !important; /* Reduced from 20px */
  }

  .sport-category h3 {
    font-size: 1.44rem !important; /* Reduced from 1.8rem */
    margin-bottom: 1.2rem !important; /* Reduced from 1.5rem */
  }

  .sport-category p {
    font-size: 0.8rem !important; /* Reduced from 1rem */
    margin-bottom: 1.2rem !important; /* Reduced from 1.5rem */
  }

  .sport-list li {
    font-size: 0.72rem !important; /* Reduced from 0.9rem */
    margin-bottom: 0.4rem !important; /* Reduced from 0.5rem */
  }

  /* Footer Elements - 20% Reduction */
  .footer {
    padding: 40px 0 0 0 !important; /* Reduced from 50px 0 0 0 */
    margin-top: 48px !important; /* Reduced from 60px */
  }

  .footer-container {
    padding: 0 32px !important; /* Reduced from 0 40px */
  }

  .footer-section {
    margin: 0 16px 32px 16px !important; /* Reduced from 0 20px 40px 20px */
    min-width: 160px !important; /* Reduced from 200px */
  }

  .footer-section h3 {
    font-size: 1.2rem !important; /* Reduced from 1.5rem */
    margin-bottom: 14.4px !important; /* Reduced from 18px */
    letter-spacing: 0.8px !important; /* Reduced from 1px */
  }

  .footer-section p, .footer-section strong {
    font-size: 0.8rem !important; /* Reduced from 1rem */
  }

  .footer-bottom {
    padding: 14.4px 0 8px 0 !important; /* Reduced from 18px 0 10px 0 */
    font-size: 0.76rem !important; /* Reduced from 0.95rem */
    margin-top: 8px !important; /* Reduced from 10px */
  }

  .footer-icons {
    margin-top: 8px !important; /* Reduced from 10px */
  }

  .footer-icons a {
    margin: 0 6.4px !important; /* Reduced from 0 8px */
  }

  /* Booking Form Elements - 20% Reduction */
  .booking-container {
    padding: 32px !important; /* Reduced from 40px */
    border-radius: 16px !important; /* Reduced from 20px */
  }

  .booking-container h2 {
    font-size: 2rem !important; /* Reduced from 2.5rem */
    margin-bottom: 6.4px !important; /* Reduced from 8px */
    letter-spacing: 0.8px !important; /* Reduced from 1px */
  }

  .booking-subtitle {
    font-size: 0.88rem !important; /* Reduced from 1.1rem */
    margin-bottom: 25.6px !important; /* Reduced from 32px */
  }

  .booking-form {
    gap: 16px !important; /* Reduced from 20px */
  }

  .form-row {
    gap: 16px !important; /* Reduced from 20px */
  }

  .booking-form label {
    font-size: 0.72rem !important; /* Reduced from 0.9rem */
    margin-bottom: 6.4px !important; /* Reduced from 8px */
    letter-spacing: 0.4px !important; /* Reduced from 0.5px */
  }

  .booking-form input[type="text"],
  .booking-form input[type="email"],
  .booking-form input[type="tel"],
  .booking-form input[type="date"],
  .booking-form input[type="time"],
  .booking-form input[type="number"],
  .booking-form textarea {
    padding: 9.6px 12.8px !important; /* Reduced from 12px 16px */
    border-radius: 6.4px !important; /* Reduced from 8px */
    font-size: 0.8rem !important; /* Reduced from 1rem */
  }

  .booking-form button {
    padding: 12.8px 0 !important; /* Reduced from 16px 0 */
    font-size: 0.88rem !important; /* Reduced from 1.1rem */
    border-radius: 6.4px !important; /* Reduced from 8px */
    margin-top: 8px !important; /* Reduced from 10px */
    letter-spacing: 0.8px !important; /* Reduced from 1px */
  }

  /* Career Form Elements - 20% Reduction */
  .career-container {
    padding: 32px 25.6px 25.6px 25.6px !important; /* Reduced from 40px 32px 32px 32px */
    border-radius: 9.6px !important; /* Reduced from 12px */
    margin: 32px auto !important; /* Reduced from 40px auto */
  }

  .career-container h2 {
    font-size: 1.76rem !important; /* Reduced from 2.2rem */
    margin-bottom: 22.4px !important; /* Reduced from 28px */
  }

  .career-form {
    gap: 14.4px !important; /* Reduced from 18px */
  }

  .career-form label {
    margin-bottom: 3.2px !important; /* Reduced from 4px */
  }

  .career-form input[type="text"],
  .career-form input[type="email"],
  .career-form textarea {
    padding: 8px 9.6px !important; /* Reduced from 10px 12px */
    border-radius: 4px !important; /* Reduced from 5px */
    font-size: 0.8rem !important; /* Reduced from 1rem */
  }

  .career-form button {
    padding: 9.6px 0 !important; /* Reduced from 12px 0 */
    font-size: 0.88rem !important; /* Reduced from 1.1rem */
    border-radius: 4px !important; /* Reduced from 5px */
    margin-top: 8px !important; /* Reduced from 10px */
  }

  /* About Page Elements - 20% Reduction */
  .about-main {
    padding: 48px 0 32px 0 !important; /* Reduced from 60px 0 40px 0 */
  }

  .about-container {
    gap: 48px !important; /* Reduced from 60px */
  }

  .about-text {
    font-size: 0.88rem !important; /* Reduced from 1.1rem */
  }

  .about-text h2 {
    font-size: 2.24rem !important; /* Reduced from 2.8rem */
    letter-spacing: 1.6px !important; /* Reduced from 2px */
    margin-bottom: 8px !important; /* Reduced from 10px */
  }

  .about-sub {
    font-size: 1.6rem !important; /* Reduced from 2rem */
    letter-spacing: 0.8px !important; /* Reduced from 1px */
  }

  .about-image img {
    max-width: 336px !important; /* Reduced from 420px */
    border-radius: 9.6px !important; /* Reduced from 12px */
  }

  /* Slider Elements - 20% Reduction */
  .slider {
    height: 320px !important; /* Reduced from 400px */
    margin: -64px auto 48px auto !important; /* Reduced from -80px auto 60px auto */
    border-radius: 6.4px !important; /* Reduced from 8px */
  }

  /* Mobile Menu Elements - 20% Reduction */
  .mobile-menu-toggle {
    padding: 4.8px 9.6px !important; /* Reduced from 6px 12px */
    font-size: 14.4px !important; /* Reduced from 18px */
  }

  .mobile-menu-toggle svg {
    width: 24px !important; /* Reduced from 30px */
    height: 16px !important; /* Reduced from 20px */
  }

  /* Mobile Language Button - 20% Reduction */
  .mobile-book-btn {
    padding: 0.24rem 0.48rem !important; /* Reduced from 0.3rem 0.6rem */
    font-size: 0.56rem !important; /* Reduced from 0.7rem */
    border-radius: 12px !important; /* Reduced from 15px */
  }
}

/* Move team image and container up by 110px in both desktop and mobile modes */
.jobs-page main > div:first-child {
  transform: translateY(-110px) !important;
}

/* Move form and its container up by 110px in both desktop and mobile modes */
.jobs-page main > div:last-child {
  transform: translateY(-110px) !important;
}

/* Responsive adjustments for smaller screens */
@media (max-width: 768px) {
  .navbar {
    padding: 12px 16px !important; /* Reduced from 15px 20px */
  }
  
  .btn-book {
    padding: 8px 16px !important; /* Reduced from 10px 20px */
    font-size: 0.72rem !important; /* Reduced from 0.9rem */
  }
  
  .hero-content h1 {
    font-size: 2rem !important; /* Reduced from 2.5rem */
  }
  
  .hero-content p {
    font-size: 0.8rem !important; /* Reduced from 1rem */
  }
  
  .hero-menu-btn {
    padding: 9.6px 24px !important; /* Reduced from 12px 30px */
    font-size: 0.8rem !important; /* Reduced from 1rem */
    margin-top: 20px !important; /* Reduced from 25px */
    gap: 8px !important; /* Reduced from 10px */
    min-width: 144px !important; /* Reduced from 180px */
  }
  
  .hero-menu-btn .arrow-icon {
    font-size: 2.4rem !important; /* Reduced from 3rem */
  }
  
  .hero-menu-btn .btn-text {
    font-size: 0.6rem !important; /* Reduced from 0.75rem */
  }
}

@media (max-width: 480px) {
  .navbar {
    padding: 8px 12px !important; /* Reduced from 10px 15px */
  }
  
  .btn-book {
    padding: 6.4px 12.8px !important; /* Reduced from 8px 16px */
    font-size: 0.64rem !important; /* Reduced from 0.8rem */
    border-radius: 20px !important; /* Reduced from 25px */
  }
  
  .hero-content h1 {
    font-size: 1.6rem !important; /* Reduced from 2rem */
  }
  
  .hero-content p {
    font-size: 0.72rem !important; /* Reduced from 0.9rem */
  }
  
  .hero-menu-btn {
    padding: 16px 32px !important; /* Reduced from 20px 40px */
    font-size: 0.72rem !important; /* Reduced from 0.9rem */
    margin-top: 16px !important; /* Reduced from 20px */
    gap: 6.4px !important; /* Reduced from 8px */
    min-width: 128px !important; /* Reduced from 160px */
  }
  
  .hero-menu-btn .arrow-icon {
    font-size: 2rem !important; /* Reduced from 2.5rem */
  }
  
  .hero-menu-btn .btn-text {
    font-size: 0.52rem !important; /* Reduced from 0.65rem */
  }
  
  .footer-section h3 {
    font-size: 0.96rem !important; /* Reduced from 1.2rem */
  }
  
  .footer-section p {
    font-size: 0.64rem !important; /* Reduced from 0.8rem */
  }
}

/* Sports streaming mobile adjustments - 20% Reduction */
@media (max-width: 868px) {
  .sports-title {
    font-size: 2rem !important; /* Reduced from 2.5rem */
  }
  
  .sports-subtitle {
    font-size: 0.96rem !important; /* Reduced from 1.2rem */
    letter-spacing: 1.6px !important; /* Reduced from 2px */
  }
  
  .sports-description {
    font-size: 0.8rem !important; /* Reduced from 1rem */
  }
  
  .sports-features {
    gap: 1.6rem !important; /* Reduced from 2rem */
    padding: 0 0.8rem !important; /* Reduced from 0 1rem */
  }
  
  .feature-card {
    padding: 1.6rem 1.2rem !important; /* Reduced from 2rem 1.5rem */
  }
  
  .feature-title {
    font-size: 1.44rem !important; /* Reduced from 1.8rem */
  }
  
  .highlight-title {
    font-size: 1.6rem !important; /* Reduced from 2rem */
  }
  
  .highlight-text {
    font-size: 0.88rem !important; /* Reduced from 1.1rem */
  }
  
  .atmosphere-grid {
    gap: 1.2rem !important; /* Reduced from 1.5rem */
    padding: 0 0.8rem !important; /* Reduced from 0 1rem */
  }
  
  .sports-categories {
    gap: 1.6rem !important; /* Reduced from 2rem */
    padding: 0 0.8rem !important; /* Reduced from 0 1rem */
  }
  
  .sport-category {
    padding: 1.2rem 0.8rem !important; /* Reduced from 1.5rem 1rem */
  }
  
  .sport-category h3 {
    font-size: 1.2rem !important; /* Reduced from 1.5rem */
  }
  
  .sport-category p {
    font-size: 0.72rem !important; /* Reduced from 0.9rem */
  }
  
  .sport-list li {
    font-size: 0.64rem !important; /* Reduced from 0.8rem */
  }
}

@media (max-width: 480px) {
  .sports-title {
    font-size: 1.6rem !important; /* Reduced from 2rem */
  }
  
  .sports-subtitle {
    font-size: 0.8rem !important; /* Reduced from 1rem */
    letter-spacing: 0.8px !important; /* Reduced from 1px */
  }
  
  .sports-description {
    font-size: 0.72rem !important; /* Reduced from 0.9rem */
  }
  
  .sports-hero {
    padding: 3.2rem 0.8rem 1.6rem !important; /* Reduced from 4rem 1rem 2rem */
  }
  
  .sports-features {
    gap: 1.2rem !important; /* Reduced from 1.5rem */
    padding: 0 0.8rem !important; /* Reduced from 0 1rem */
  }
  
  .feature-card {
    padding: 1.2rem 0.8rem !important; /* Reduced from 1.5rem 1rem */
  }
  
  .feature-title {
    font-size: 1.2rem !important; /* Reduced from 1.5rem */
  }
  
  .feature-description {
    font-size: 0.72rem !important; /* Reduced from 0.9rem */
  }
  
  .highlight-title {
    font-size: 1.44rem !important; /* Reduced from 1.8rem */
  }
  
  .highlight-text {
    font-size: 0.8rem !important; /* Reduced from 1rem */
  }
  
  .sports-highlight {
    padding: 2.4rem 0.8rem !important; /* Reduced from 3rem 1rem */
  }
  
  .atmosphere-grid {
    gap: 0.8rem !important; /* Reduced from 1rem */
    padding: 0 0.8rem !important; /* Reduced from 0 1rem */
  }
  
  .atmosphere-item {
    padding: 1.2rem 0.8rem !important; /* Reduced from 1.5rem 1rem */
  }
  
  .atmosphere-text {
    font-size: 0.72rem !important; /* Reduced from 0.9rem */
  }
  
  .sports-categories {
    gap: 1.2rem !important; /* Reduced from 1.5rem */
    padding: 0 0.8rem !important; /* Reduced from 0 1rem */
  }
  
  .sport-category {
    padding: 1.2rem 0.8rem !important; /* Reduced from 1.5rem 1rem */
  }
  
  .sport-category h3 {
    font-size: 1.2rem !important; /* Reduced from 1.5rem */
  }
  
  .sport-category p {
    font-size: 0.72rem !important; /* Reduced from 0.9rem */
  }
  
  .sport-list li {
    font-size: 0.64rem !important; /* Reduced from 0.8rem */
  }
  
  .additional-sports {
    padding: 2.4rem 0.8rem !important; /* Reduced from 3rem 1rem */
  }
}