@media (min-width: 990px) {
      
  }

/* Tablet-pro desktop :1024px. */
@media  (max-width: 1030px) {

  
}

/* Tablet desktop :768px. */
@media (min-width: 768px) and (max-width: 991px) {
  
}

/* Tablet-pro desktop :1024px. */
@media (max-width: 840px) {
 
   .login-hero-grid { flex-direction: column; gap: 20px;}
   .hero-grid { flex-direction: column-reverse; gap: 30px; text-align: center;}
   .how-it-works-grid { flex-direction: column; gap: 30px;}
   .platform-cta-card { flex-direction: column-reverse; text-align: center; padding: var(--pad-20);}
   .school-benefits-card { flex-direction: column-reverse; text-align: center; padding: var(--pad-20);}
   .testimonial-carousel { padding: 0px;}
   .metrics-grid { grid-template-columns: repeat(2, 1fr); gap: 24px 16px;}
   .hero-section { padding: 40px 0 60px;}
   .hero-subtitle { max-width: none;}
   .hero-trust-note { justify-content: center;}
   .otp-inputs .otp-box{width: 50px; height: 50px;}
    .curriculum-subjects{ grid-template-columns: repeat(3, 1fr);}
    .game-bottom-bar{flex-direction: column;}
    .game-rounds { display: grid;  grid-template-columns: repeat(2, minmax(0, 1fr));}
    .game-play-layout { grid-template-columns: 1fr;}

    .game-play-sidebar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 100;
    background: var(--bg-white); border-top: var(--stroke-primary); box-shadow: 0 -10px 30px -20px rgba(13, 175, 175, .30);
    padding: 10px 16px; gap: 8px; flex-direction: row; justify-content: center;}
    .game-play-teams { flex-direction: row; align-items: center; justify-content: center; gap: 12px;}
    .game-play-teams .team-score-card { width: auto; flex: 1; min-width: 0;}
    .game-play-teams .team-avatar-lg { height: 70px;}
    .no-winner-card { padding: 6px 10px;}
    .no-winner-card img { height: 60px;}
    .game-play-topbar{gap: 30px;}
    .question-card-area, .answer-card-area{min-height: 180px;}

    .winner-hero-card{ max-width: 420px; padding: 36px 24px 30px;}
    .winner-hero-mascot{ width: 140px; height: 140px;}
    .winner-hero-mascot .circle-blur{ width: 140px; height: 140px;}
    .winner-ring-dashed{ width: 170px; height: 170px; margin: -85px 0 0 -85px;}
    .winner-ring-pulse{ width: 95px; height: 95px; margin: -47.5px 0 0 -47.5px;}
    .winner-hero-avatar{ max-width: 120px; max-height: 120px;}
    .winner-ribbon{ width: 50px; height: 50px;}
    .winner-ribbon .ribbon-strip{ width: 44px; height: 11px; margin-top: -5.5px;}

    .my-games-grid{ grid-template-columns: repeat(2, 1fr);}
    .my-games-banner{ padding: 50px 0 80px;}
    .my-games-banner-title{ font-size: 34px;}
    .my-games-empty{ padding: 20px 0 80px;}
    .my-games-empty-img{ max-width: 260px;}
    .profile-info-item{padding: 6px 10px;}

    .stats-highlight-bar{ flex-wrap: wrap; gap: 18px 10px;}
    .stats-tile, .stats-tile-trust{ flex: 1 1 40%; min-width: 130px;}
    .stats-divider{ display: none;}

    .why-choose-grid{ grid-template-columns: repeat(2, 1fr);}
    .testimonial-carousel .owl-nav{position: relative;}
    .how-it-works-star-1{left: 26%;}
    .how-it-works-star-2{left: 3%;}
    .how-it-works-star-3{right: 0px;}

}

/* small mobile :767px. */
@media (max-width: 767px) {

  .unit-layout{display: flex; flex-direction: column;}
  .subject-panel{width: 100%;}
  .units-panel{width: 100%;}
  .selected-units{display: none;}
  .curriculum-units{flex-direction: column; gap: 10px;}
  .unit-select{flex-direction: row; justify-content: space-between; align-items: center; text-align: right;
  min-height: auto; width: 100%; padding: 16px 20px; font-size: var(--font-size-16);}
  .unit-select .unit-icon{display: none;}
  .unit-select .unit-remove-icon{color: var(--font-secondary);}
  .unit-select.select .unit-remove-icon{display: inline-flex;}
  .fixedmenu .header-section .logo img{max-width: 90px;}

  .winner-compare-row{ gap: 14px;}
  .team-mini-card{ min-width: 120px; padding: 6px 10px;}

  .why-choose-grid{ display: flex; flex-wrap: nowrap; overflow-x: auto; scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch; scrollbar-width: none;}
  .why-choose-grid::-webkit-scrollbar{ display: none;}
  .why-choose-card{ flex: 0 0 85%; scroll-snap-align: start;}
  .school-benefits-list{ grid-template-columns: 1fr;}

  .trust-bar{display: grid; grid-template-columns: repeat(2, 1fr); gap: 0; align-items: stretch;}
  .trust-bar .divider{display: none;}
  .trustbar-tile{width: 100%; border: var(--stroke-primary); border-radius: 0; padding: var(--pad-20);}

  .my-games-grid{ grid-template-columns: 1fr; padding-bottom: 30px;}
  .my-games-nav{ justify-content: center;}
  .my-games-page-btn{ width: 34px; height: 34px; font-size: var(--font-size-16);}
  .my-games-nav .login-contact-link{ display: none;}
  .my-games-empty{ padding: 10px 0 60px;}
  .my-games-empty-img{ max-width: 240px;}
  .my-games-empty-media .circle-blur{ width: 160px; height: 160px;}
  .my-games-empty-cta{ width: 100%; padding: 0 20px;}
  .user-chip-menu-nav{ display: list-item;}

  .profile-info-grid{ grid-template-columns: 1fr;}
  .profile-edit-form .team-row{ flex-direction: column; gap: 12px;}

}

@media (max-width: 575px){
   .platform-gallery{padding: 16px;}
   .platform-gallery-nav{width: 42px; height: 42px; font-size: 24px;}
   .platform-gallery-prev{inset-inline-end: 8px;}
   .platform-gallery-next{inset-inline-start: 8px;}
}

/* Large Mobile :480px. */
@media only screen and (min-width: 480px) and (max-width: 767px) {
   
  
}

@media (max-width: 480px) {
  
  .login-contact-link{display: none;}
  header{padding: 15px 0px;}
  .header-section .logo img{max-width: 120px;}
  .login-flag img{height: 30px;}
  .btn-primary{height: 50px; min-width: 80px;}
  .login-signin-btn{height: 34px;}
  .login-nav-actions{gap: 12px;}
  .login-footer-brand .logo img{max-width: 130px;}
  .login-social a{width: 32px; height: 32px;}
  .login-footer-links{display: none;}
  .login-footer-grid{justify-content: center;}
  .login-copyright{margin-top: 20px;}
  .login-social{gap: 8px;}
  footer::before{height: 100px; top: -60px;}
  footer{padding: 40px 0px 30px;}
  .login-illustration img{max-width: 250px;}
  .hero-cta{width: 100%;}
  .scroll-top{width: 40px; height: 40px; bottom: 16px; left: 16px;}
  .login-card{padding: 20px;}
  .otp-inputs{gap: 10px;}
  .otp-inputs .otp-box{width: 40px; height: 40px;}
  .curriculum-select{padding: 30px 0px; gap: 15px;}
  .curriculum-title{font-size: 28px;}
  .curriculum-countries .country-select{padding: 10px 20px;}
  .curriculum-next{width: 100%;}
  .stage-select{ padding: 12px 15px;}
  .grade-select{min-width: inherit; padding: 12px 14px;}
  .curriculum-subjects{ grid-template-columns: repeat(2, 1fr);}
  .subject-select img{width: 100px; height: 90px;}
  .subject-img .circle-blur{width: 70px; height: 70px;}
  .back-arrow{width: 40px; height: 40px;}
  .mb-width-100{width: 100%;}
  .team-row{flex-direction: column; gap: 12px;}
  .login-signin-btn img{height: 22px;}
  .game-subject img, .game-subject-img .circle-blur{height: 60px; width: 60px;}
  .round-column{padding: 8px; min-width: inherit;}
  .points-action{width: 30px; height: 30px;}
  .question-pill img{width: 24px;}
  .points-action img{width: 18px;}
  .question-pill span{gap: 0px;}
  .game-bottom-bar{ padding: 10px 0px;}
  .game-dashboard{padding-top: 10px; padding-bottom: 14px;}
  .game-level-divider{margin: 5px 0px;}
  .level-badge{ padding: 5px 12px;}
  .turn-heading{margin-bottom: 8px;}
  .versus-icon{font-size: 18px;}
  .team-score-card{padding: 8px; min-width: 140px; border-radius: 12px;}
  .team-score img{max-width: 24px;}
  .flying-coin{ width: 20px; height: 20px; margin: -10px 0 0 -10px;}
  .teams-versus{gap: 10px;}
  .score-controls{gap: 0px; margin-top: 0px;}
  .team-avatar-lg{height: 50px;}
  .team-img .circle-blur{width: 40px; height: 40px;}
  .team-score{gap: 4px; font-size: 20px;}
  .winner-popup-card{max-width: 280px; padding: 14px;}
  .winner-popup-mascot{width: 90px; height: 90px;}
  .winner-popup-mascot .circle-blur{width: 75px; height: 75px;}
  .winner-popup-points-value{font-size: 34px;}
  .winner-popup-points, .winner-popup-bonus-stepper { min-height: 60px;}
  .winner-popup-heading{font-size: 20px;}
  .winner-popup-continue-btn { height: 40px; font-size: 14px;}
  .game-play-topbar{margin-bottom: 15px; gap: 15px;}
  .game-play{padding-top: 10px;}
  .timer-readout{min-width: 60px;}
  .timer-controls{gap: 0px; padding-right: 5px;}
  .points-pill{padding: 8px 15px; gap: 4px;}
  .icon-circle-btn{width: 40px; height: 40px;}
  .breadcrumbs img{max-width: 20px;}
  .round-pill{padding: 5px 12px;}
  .game-play-teams{flex-direction: row;}
  .no-winner-card{justify-content: center;}
  .no-winner-card img{height: 40px;}
  .game-play-teams .team-avatar-lg{height: 50px;}
  .game-play-sidebar{flex-direction: column;}

  .winner-announce-wrap{ gap: 26px; padding: 10px 0 26px;}
  .winner-hero-card{ padding: 26px 16px 24px; gap: 12px;}
  .winner-crown{ width: 42px; top: -20px;}
  .winner-ribbon{ width: 40px; height: 40px;}
  .winner-ribbon .ribbon-strip{ width: 34px; height: 9px; margin-top: -4.5px;}
  .winner-hero-mascot{ width: 100px; height: 100px;}
  .winner-hero-mascot .circle-blur{ width: 100px; height: 100px; filter: blur(22px);}
  .winner-ring-dashed{ width: 120px; height: 120px; margin: -60px 0 0 -60px;}
  .winner-ring-pulse{ width: 70px; height: 70px; margin: -35px 0 0 -35px;}
  .winner-hero-avatar{ max-width: 90px; max-height: 90px;}
  .team-mini-card{ min-width: 140px; gap: 6px; padding: 10px;}
  .team-avatar-sm{ height: 50px;}
  .winner-new-game-btn, .draw-new-game-btn{ min-width: 160px;}

  .my-games-banner{ padding: 30px 0 40px;}
  .my-games-banner-title{ font-size: 26px;}
  .user-chip span{ display: none;}
  .mini-round-badge{ width: 34px; height: 34px; font-size: 14px;}
  .mini-round-label{ font-size: 12px;}
  .dp-tabs{margin-bottom: 15px;}
  .dp-tabs .nav-link{padding: 0px 15px 10px 15px;}
  .profile-card{padding: 20px;}
  .profile-games-banner img{width: 50px; height: 50px;}
  .profile-games-banner{padding: 12px;}
  #subjectPicker .subject-select{min-width: 90px;}
  .modal-close-ico{right: 10px; top: 10px;}
  .dgrid{grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));}
  .grade-select, .grade-select-solo{min-width: 100px;}
  .subject-select{padding: 24px 8px;}
   .start-dflex{ gap: 10px;}

  .stats-highlight-bar{ padding: var(--pad-20) 16px; margin-top: 10px;}
  .stats-tile-value{ font-size: var(--font-size-24); gap: 0px;}
  .stats-tile-trust{ font-size: var(--font-size-28);}

  .why-choose-section{ padding: 10px 0;}
  .why-choose-title{ font-size: var(--font-size-28);}
  .why-choose-heading{ margin-bottom: 12px;}

  .how-it-works-section{ padding: 10px 0;}
  .how-it-works-steps{ gap: 14px;}
  .how-it-works-star-1{ width: 50px;}
  .how-it-works-star-2{ width: 34px;}
  .how-it-works-star-3{ width: 40px;}

  .metrics-card{ padding: 24px 16px;}
  .metrics-number{ font-size: var(--font-size-28);}
  .hero-shape-1{width: 160px; height: 160px;}
  .hero-shape-2{width: 110px; height: 110px;}
  .hero-shape-3{width: 75px; height: 75px;}
  .hero-section{padding: 20px 0px 10px;}
  
  .hero-grid{gap: 15px;}
  .hero-trust-note{padding: 10px;}
  .trust-bar{padding: 10px 0px;}
  .trustbar-tile img{max-width: 24px;}
  .trust-bar .divider{display: none;}
  .hero-title{line-height: 1.5; min-height: 72px;}
  .testing-platform-bg{padding: 15px 10px;}
  .testing-platform-bg h4{font-size: 16px;}
  .hero-subtitle{line-height: 1.4;}
  .stats-tile img{max-width: 32px;}
  .why-choose-card img{width: 60px; height: 60px;}
  .step-number{width: 40px; height: 40px;}
  .step-content h5{margin-bottom: 4px;}
  .how-it-works-steps::before{right: 19px;}
  .how-it-works-grid{gap: 15px;}
  .metrics-tile img{width: 60px; height: 60px;}
  .metrics-tile{gap: 0px;}
  .metrics-grid{gap: 10px;}
  .metrics-section, .platform-preview-section, .platform-cta-section,
  .testimonial-section, .faq-section, .school-benefits-section{padding: 10px 0px;}
  .owl-dots .owl-dot{width: 12px; height: 12px; margin: 2px 3px;}
  .owl-dots{margin-top: 10px;}
  .platform-cta-media img, .school-benefits-media img{max-width: 250px;}
  .circle-blur2{width: 200px; height: 200px;}
  .testimonial-heading{margin-bottom: 15px;}
  .school-benefits-content{gap: 15px;}
  .login-footer-brand{align-items: center; text-align: center;}
  .testimonial-card{padding: 20px; min-height: inherit;}
  .testimonial-avatar{width: 45px; height: 45px;}
  .teacher-writing{right: 0;}
  

}

@media (max-width: 380px) {
  

 
}