@media (min-width: 1578px) {
  .hundred-award-container.main-align-left {
    max-width: 1352px;
  }
}
/* ========== Main Left Alignment Utility ========== */
.main-align-left {
  padding-left: 12rem;
  box-sizing: border-box;
}

.flex-1-min-0 { flex:1; min-width:0; }
.flex-0-auto { flex:0 0 auto; display:flex; }
.align-center { align-items:center; }
.maxw-600 { max-width:600px; }
.maxw-500 { max-width:500px; }
.w-100 { width:100%; }
.h-auto { height:auto; }
.d-block { display:block; }
.text-left { text-align:left; }
.hundred-title { font-size:2.2rem; font-weight:bold; color:#142259; margin-bottom:2rem; margin-top:0; }
.hundred-desc { font-size:1.1rem; line-height:1.6; color:#333; margin:0; }
.hundred-link { color:#2f4583; text-decoration:underline; }

@media (max-width: 1200px) {
  .main-align-left { padding-left: 2rem; }
  .hundred-award-container.main-align-left { padding-left: 2rem; gap: 4rem; }
  .league-bg-wrapper.main-align-left,
  .league-carousel-container,
  .alliances-carousel-wrapper.main-align-left {
    padding-left: 1rem; padding-right: 1rem; width: 100%; max-width: 100%; box-sizing: border-box;
  }
}
@media (max-width: 1024px) {
  .swiper { height: 50vh; }
  .reach-form-card { padding: 1rem; }
  .league-bg-image { height: 250px; }
  .league-carousel-container { width: 95%; padding: 0 10px; }
}
@media (max-width: 768px) {
  .main-align-left { padding-left: 1rem; }
  .hundred-award-container.main-align-left { flex-direction: column; padding-left: 3.5rem !important; gap: 2rem !important; align-items: stretch; }
  .hundred-left, .hundred-right { width: 100%; padding: 0.5rem 0; text-align: center; justify-content: center; align-items: center; }
  .hundred-text-wrapper { max-width: 100%; text-align: center; }
  .hundred-title { font-size: 1.2rem; }
  .hundred-desc { font-size: 0.95rem; }
  .award-img { max-width: 90vw; width: 100%; height: auto; }
  .league-bg-wrapper.main-align-left,
  .league-carousel-container,
  .alliances-carousel-wrapper.main-align-left { padding-left: 0.5rem; padding-right: 0.5rem; width: 100%; max-width: 100%; }
  .league-bg-image { height: 120px; padding-bottom: 0.5rem; }
  .league-heading, .alliances-heading { font-size: 1.2rem; }
  .reach-form-card.main-align-left { padding-left: 1rem; padding-right: 1rem; }
  .container-fluid { padding: 0; }
}
@media (max-width: 480px) {
  .main-align-left { padding-left: 3.5rem; }
  .hundred-title { font-size: 1rem; }
  .hundred-desc { font-size: 0.85rem; }
  .award-img { max-width: 100vw; }
  .league-heading, .alliances-heading { font-size: 1.1rem; }
  .testimonial-heading{ padding-left:2.2rem; }
  .league-bg-wrapper.main-align-left,
  .league-carousel-container,
  .alliances-carousel-wrapper.main-align-left { padding-left: 0; padding-right: 0; }
}
/* ========== General Swiper Styles ========== */
.swiper { width: 100%; height: 66vh; position: relative; }
.swiper-button-next, .swiper-button-prev { color: #ffffff; }
.swiper-slide { background: center / cover no-repeat; display: flex; align-items: center; justify-content: flex-start; padding-left: 12.2%; position: relative; }
/* ========== Slide Overlay ========== */
.slide-overlay { position: absolute; inset: 0; background: rgba(0, 0, 0, 0.4); z-index: 1; }
.overlay-content { position: relative; z-index: 2; text-align: left; padding: 2rem 1rem; max-width: 600px; }
.overlay-content h2 { color: white; font-size: 2.975rem; line-height: 1.3; margin-bottom: 1rem; }
/* ========== Buttons & Links ========== */
.learn-more-btn, .slide-link { display: inline-block; text-decoration: none; font-weight: 500; margin-top: 1rem; }
.learn-more-btn { background: linear-gradient(to right, #3b59a6 0%, #d3c9c0 100%); color: #fff; padding: 0.4rem 2.5rem; border-radius: 999px; font-size: 1rem; font-weight: bold; transition: filter 0.3s ease; text-align: center; white-space: nowrap; border: none; }
.learn-more-btn:hover, .reach-us-btn:hover, .play-circle:hover { filter: brightness(1.1); }
/* ========== Reach Us Section ========== */
.reach-us-section { padding: 0 10.8% 10px }
.reach-heading { font-size: 2.2rem; font-weight: bold; color: #142259; margin-bottom: 1.5rem; text-align: left; }
@media (max-width: 1200px) { .reach-heading { font-size: 1.8rem; } }
@media (max-width: 768px) { .reach-heading { font-size: 1.2rem; } }
@media (max-width: 480px) { .reach-heading { font-size: 1.1rem; } }
.reach-form-card { background: #fff; border-radius: 0 0 4rem 4rem; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05); padding: 2rem 0; max-width: 1200px; margin: 0 auto; }
.reach-form-card.main-align-left { padding-left: 2.5rem; padding-right: 2.5rem; }
@media (max-width: 768px) { .reach-form-card.main-align-left { padding-left: 1rem; padding-right: 1rem; } }
.reach-form .form-columns { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 2rem; }
.form-left { flex: 1 1 75%; }
.form-right { flex: 1 1 18%; display: flex; justify-content: flex-end; align-items: flex-end; }
.form-row { display: flex; flex-wrap: wrap; gap: 1rem; margin-bottom: 1rem; margin-left: 0px; }
.reach-form input { flex: 1; padding: 0.6rem 1rem; border: none; background: #e3e6f9; font-size: 1rem; }
.reach-us-btn { background: linear-gradient(to right, #3b59a6 0%, #d3c9c0 100%); color: #fff; padding: 0.4rem 2.5rem; border-radius: 999px; font-size: 1rem; font-weight: bold; border: none; cursor: pointer; display: flex; align-items: center; gap: 0.5rem; margin-bottom: 1rem; }
.reach-us-btn .btn-icon { width: 18px; height: 18px; }
/* ========== Video Section ========== */
.video-text-section { display: flex; justify-content: center; padding: 2rem 0; width: 100%; }
.video-text-container { display: flex; width: 100%; height: 42vh; }
.video-left, .video-right { flex: 1; position: relative; }
.video-wrapper { width: 100%; height: 100%; position: relative; }
.video-bg { width: 100%; height: 100%; display: block; }
.video-overlay { position: absolute; inset: 0; display: flex; justify-content: center; align-items: center; }
.play-circle { width: 100px; height: 100px; border-radius: 50%; display: flex; justify-content: center; align-items: center; transition: background 0.3s ease; cursor: pointer; }
.play-icon { width: 40px; height: 40px; margin-top:5px; }
.video-right { display: flex; align-items: center; justify-content: flex-start; padding-left: 4rem; }
.video-right h2 { font-size: 1.8rem; font-weight: bold; color: #2c3541; padding: 2rem; max-width: 95%; }
/* ========== Modal Styles ========== */
.modal { display: none; position: fixed; inset: 0; z-index: 999; background: rgba(0, 0, 0, 0.7); }
.modal-content { background: #fff; margin: 5% auto; padding: 1rem; border-radius: 8px; width: 80%; max-width: 800px; position: relative; }
.modal .close { position: absolute; top: 16px; right: 16px; font-size: 1.8rem; color: #000; cursor: pointer; z-index: 2; padding: 0.25rem 0.5rem; background: #fff; border-radius: 50%; box-shadow: 0 0 6px rgba(0, 0, 0, 0.15); }
/* ========== Hundred Awards ========== */
.hundred-award-section { width: 100%; padding: 0; }
.hundred-award-container.main-align-left { display: flex; flex-wrap: nowrap; align-items: center; gap: 10rem; margin: 0 auto; width: 100%; padding-left: 5rem; box-sizing: border-box; }

@media (min-width: 1578px) {
  .hundred-award-container.main-align-left {
    max-width: 1352px !important;
  }
}
.hundred-left.flex-1-min-0 { display: flex; align-items: center; }
.hundred-text-wrapper h2 { font-size: 2.2rem; font-weight: bold; color: #142259; margin-bottom: 2rem; }
.hundred-text-wrapper p { font-size: 1.4rem; line-height: 1.6; color: #333; }
.hundred-text-wrapper a { color: #2f4583; text-decoration: underline; }
/* ========== League of Greats ========== */
.league-of-greats-section { background: #fff; padding: 2rem 0; width: 100%; }
.league-heading { font-size: 2.2rem; font-weight: bold; color: #142259; }
.league-bg-wrapper { position: relative; overflow: hidden; padding: 0; }
.league-bg-image { background: url('../images/league_of_greats.png') center bottom / cover no-repeat; height: 485px; display: flex; align-items: flex-end; justify-content: center; padding-bottom: 2rem; }
.league-carousel-container { width: 78%; margin: 0 auto; }
.league-carousel .logo-item { padding: 0 15px; }
.league-carousel .logo-item img { max-height: 150px; width: auto; object-fit: contain; display: block; margin: 0 auto; }
/* ========== Alliances Carousel (Gap Adjustments) ========== */
.alliances-section { background: #fff; padding: 3rem 0; }
.alliances-heading { font-size: 2.2rem; font-weight: bold; color: #142259; margin-bottom: 2rem; }
.alliances-carousel-wrapper { overflow: hidden; padding-left: 0; width: 85%; box-sizing: border-box; }
.alliances-carousel { display: flex; align-items: center; }
.alliances-carousel .alliances-item { display: flex; align-items: center; justify-content: center; height: 100px; padding: 5px 15px; margin: 0 8px; background: #fff; border-radius: 6px; }
.alliances-carousel .alliances-item img { max-height: 70px; width: auto; object-fit: contain; display: block; }
/* ========== Responsive Media Queries ========== */
@media (max-width: 1200px) { .league-heading, .alliances-heading { font-size: 1.8rem; } .hundred-award-container { padding: 0 1rem; } }
@media (max-width: 1024px) { .swiper { height: 50vh; } .reach-form-card { padding: 1rem; } .league-bg-image { height: 250px; } .league-carousel-container { width: 95%; padding: 0 10px; } }
@media (max-width: 768px) { .swiper { height: 30vh; } .swiper-slide { padding-left: 1rem; } .overlay-content { padding: 54px 0px 0px 42px; max-width: 95vw; } .overlay-content h2 { font-size: 1.2rem; } .learn-more-btn { width: 50%; padding: 0.5rem 1.5rem; } .reach-form .form-columns { flex-direction: column; gap: 0.5rem; } .form-row { flex-direction: column; gap: 0.5rem; margin-bottom: 0.5rem; } .form-left, .form-right { width: 100%; flex: 1 1 100%; padding: 0; justify-content: center; align-items: center; } .reach-form input { width: 100%; margin-bottom: 0.5rem; font-size: 0.95rem; } .reach-us-btn { width: 100%; justify-content: center; padding: 0.5rem 1.5rem; } .video-text-container { flex-direction: column; height: auto; } .video-left, .video-right { width: 100%; padding: 0; justify-content: center; text-align: center; } .video-wrapper { height: 180px; } .play-circle { width: 60px; height: 60px; } .play-icon { width: 24px; height: 24px; } .video-right h2 { font-size: 1.1rem; padding: 1rem 4rem; } .league-bg-image { height: 120px; padding-bottom: 0.5rem; } .league-carousel .logo-item img { max-height: 40px; } .alliances-carousel .alliances-item { height: 60px; padding: 2px 4px; } .alliances-carousel .alliances-item img { max-height: 30px; } .hundred-award-container { flex-direction: column; padding: 0 0.5rem; } .hundred-left, .hundred-right { width: 100%; padding: 0.5rem; text-align: center; justify-content: center; align-items: center; } .hundred-text-wrapper { max-width: 100%; text-align: center; } .hundred-text-wrapper h2 { font-size: 1.2rem; } .hundred-text-wrapper p { font-size: 0.95rem; } .container-fluid { padding: 0; } }
@media (max-width: 480px) { .swiper { height: 38vh; } .overlay-content h2 { font-size: 1rem; } .league-heading, .alliances-heading { font-size: 1.1rem; } .hundred-text-wrapper h2 { font-size: 1rem; } .hundred-text-wrapper p { font-size: 0.85rem; } .award-img { max-width: 100%; } }
@media (min-width: 1600px) { .hundred-award-container.main-align-left { max-width: 1690px; } .video-text-container { height: 50vh; } }
@media (min-width: 1920px) { .league-bg-image { height: 560px; } }
@media (min-width: 1440px) and (max-width: 1599px) { .hundred-award-container.main-align-left { max-width: 1315px; } .video-text-container { height: 46vh; } .hundred-award-container.main-align-left{ gap:18rem; } .league-bg-image{ height: 520px } }
@media (min-width: 1280px) and (max-width: 1439px) { .hundred-award-container.main-align-left { max-width: 1138px; } .league-bg-image{ height: 460px; } }
@media (width: 1440px) { .hundred-award-container.main-align-left { max-width: 1200px; gap: 10rem; } .league-bg-image { height: 420px; } .video-text-container { height: 42vh;} }
@media (min-width: 1441px) and (max-width: 1599px) { .hundred-award-container.main-align-left { max-width: 1315px; gap: 18rem; } .video-text-container { height: 46vh; } .league-bg-image{ height: 455px; } }

/* Form Validation Styles */
.input-error {
    border: 1.5px solid #e74c3c !important;
    background: #fff6f6 !important;
    color: #e74c3c !important;
}
.form-row {
    display: flex;
    gap: 16px;
    margin-bottom: 10px;
}
.form-row .input-tooltip-wrapper {
    position: relative;
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
}
.form-row input {
    width: 100%;
    box-sizing: border-box;
    padding-right: 32px; /* space for check icon */
}
.input-tooltip-wrapper {
    position: relative;
}
.input-checkmark {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    width: 18px;
    height: 18px;
    pointer-events: none;
    display: none;
    color: #27ae60;
    z-index: 11;
}
.input-tooltip-wrapper.valid .input-checkmark {
    display: block;
}
.input-tooltip {
    position: absolute;
    left: 0;
    top: 100%;
    margin-top: 2px;
    background: #e74c3c;
    color: #fff;
    font-size: 13px;
    padding: 4px 10px;
    border-radius: 4px;
    white-space: normal;
    z-index: 10;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    pointer-events: none;
    opacity: 0.97;
    transition: opacity 0.2s;
    min-width: 120px;
    max-width: 260px;
}


/* ========== League of Greats Carousel Padding & View All Link ========== */
.league-carousel-padding {
  padding-bottom: 30px;
  position: relative;
}

.league-view-all-wrapper {
  width: 100%;
  text-align: center;
  position: absolute;
  left: 0;
  bottom: 18px;
  z-index: 2;
}


@media (max-width: 768px) {
  .league-carousel-padding {
    padding-bottom: 50px;
  }
  .league-view-all-wrapper {
    bottom: 10px;
  }
}

@media (max-width: 480px) {
  .league-carousel-padding {
    padding-bottom: 20px;
  }
  .league-view-all-wrapper {
    bottom: 6px;
  }
}


/* Form Slider Styles */
.form-slider {
    position: relative;
    overflow: visible;
    width: 100%;
}

.form-step {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    opacity: 0;
    transform: translateX(100%);
    transition: all 0.3s ease-in-out;
    pointer-events: none;
    overflow: visible;
}

.form-step.active {
    position: static;
    opacity: 1;
    transform: translateX(0);
    pointer-events: auto;
    overflow: visible;
}

.form-step.slide-out {
    transform: translateX(-100%);
    opacity: 0;
    overflow: visible;
}

/* Button stack for step 2 */
.button-stack {
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: stretch;
}

.prev-btn {
    margin-bottom: 0 !important;
}

.form-right .prev-btn {
    background-color: #6c757d;
    border-color: #6c757d;
}

.form-right .prev-btn:hover {
    background-color: #5a6268;
    border-color: #545b62;
}

/* Tooltip styling: simple, always above input */
.input-tooltip {
    position: absolute;
    bottom: 100%;
    left: 0;
    background: #f44336;
    color: #fff;
    padding: 8px 12px;
    border-radius: 4px;
    font-size: 13px;
    white-space: nowrap;
    z-index: 1000;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
    pointer-events: none;
    line-height: 1.3;
    min-height: 20px;
    display: flex;
    align-items: center;
}

/* Tooltip arrow pointing up - positioned at top of tooltip */
.input-tooltip::after {
    content: '';
    position: absolute;
    top: -4px;
    left: 20px;
    border-width: 4px;
    border-style: solid;
    border-color: transparent transparent #f44336 transparent;
}

/* Dropdown styling */
select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6,9 12,15 18,9'%3e%3c/polyline%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 1rem center;
    background-size: 1em;
    padding-right: 2.5rem;
    color:#757575;
}

/* Style select elements within input-tooltip-wrapper to match other inputs */
.input-tooltip-wrapper select {
    width: 100%;
    padding: 12px 2.5rem 12px 16px;
    border: none;
    font-size: 14px;
    line-height: 1.5;
    background-color: #e3e6f9;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
    outline: none;
}

.input-tooltip-wrapper select:focus {
    border-color: #007bff;
    box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25);
}

.input-tooltip-wrapper select.input-error {
    border-color: #dc3545;
    box-shadow: 0 0 0 2px rgba(220, 53, 69, 0.25);
}