.feature-icon{
  width:46px;height:46px;border-radius:18px;
  display:grid; place-items:center;
  background: rgba(143,211,255,.10);
  border: 1px solid rgba(143,211,255,.22);
  box-shadow: 0 14px 34px rgba(0,0,0,.45);
}

.hero{
  padding-top: 92px;
  padding-bottom: 34px;
  position: relative;
}
.hero h1{
  font-weight: 950;
  letter-spacing: -0.8px;
  line-height: 1.05;
}
.hero .lead{
  color: rgba(233,242,238,.85);
  font-size: 1.08rem;
}

body[data-page="reviews"] .hero{ padding-top: 86px; padding-bottom: 18px; }
@media (max-width: 576px){
  body[data-page="reviews"] .hero{ padding-top: 80px; padding-bottom: 16px; }
}

.hero--page{ padding-bottom: 26px; }
@media (max-width: 576px){ .hero--page{ padding-top: 76px; padding-bottom: 22px; } }

.hero--index .container{ position: relative; }
.hero--index .container > .row{ position: relative; z-index: 2; }

@media (min-width: 992px){
  .hero--index .container > .row{
    align-items: flex-start !important;
  }
  .hero--index .hero-copy{ margin-top: 18px; }
}

@media (min-width: 768px){
  .hero--index #heroKpis{
    margin-top: clamp(150px, 30vh, 360px) !important;
  }
}

.kpi-grid .card-dark{ height:100%; }

.feature-icon-img{
  width: 24px;
  height: 24px;
  object-fit: contain;
  display: block;
  filter: drop-shadow(0 3px 8px rgba(0,0,0,.25));
}

.kpi-grid .feature-icon{
  width: auto !important;
  height: auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  overflow: visible !important;
}
.kpi-grid .feature-icon-img{
  width: 144px !important;
  height: auto !important;
  max-width: none !important;
  object-fit: contain !important;
  filter: none !important;
  display: block;
}

.card-image{
  border-radius: var(--radius-lg);
  border:1px solid rgba(190,255,220,.12);
  box-shadow: var(--shadow);
  overflow:hidden;
  background: rgba(10,16,14,.35);
}
.card-image img{
  width:100%;
  height:auto;
  display:block;
}

.location-card .badge{
  background: rgba(143,211,255,.12);
  border: 1px solid rgba(143,211,255,.28);
  color: rgba(233,242,238,.92);
}

.hero-visual{
  border-radius: var(--radius-lg);
  overflow: visible;
  position: relative;
  display: inline-block;
  width: fit-content;
  max-width: 100%;
  padding: 10px;
}
.hero-visual--placeholder{
  min-height: 0;
}
.hero-visual img{
  width: auto;
  height: auto;
  display: block;
  object-fit: contain;
  max-width: 100%;
  max-height: 640px;
  filter: none;
}

.hero--index{
  --hero-boy-x: 100px;
  --hero-boy-y: 290px;
  --hero-boy-scale: 1.4;
  --hero-boy-rotate: 0deg;
  --hero-boy-max-width: 903px;
  --hero-boy-max-height: 540px;
}

@media (min-width: 992px) and (max-width: 1599px){
  .hero--index{
    --hero-boy-x: 42px;
    --hero-boy-y: 228px;
    --hero-boy-scale: 1.18;
    --hero-boy-max-width: 820px;
    --hero-boy-max-height: 500px;
  }
}
@media (min-width: 1600px) and (max-width: 2399px){
  .hero--index{
    --hero-boy-x: 100px;
    --hero-boy-y: 290px;
    --hero-boy-scale: 1.4;
    --hero-boy-max-width: 903px;
    --hero-boy-max-height: 540px;
  }
}
@media (min-width: 2400px){
  .hero--index{
    --hero-boy-x: 162px;
    --hero-boy-y: 362px;
    --hero-boy-scale: 1.4;
    --hero-boy-max-width: 1060px;
    --hero-boy-max-height: 640px;
  }
}
@media (max-width: 992px){
  .hero-visual img{
    max-height: 460px;
    transform: none !important;
  }
}
@media (min-width: 992px){
  .hero--index .hero-visual img{
    width: auto !important;
    max-width: var(--hero-boy-max-width) !important;
    max-height: var(--hero-boy-max-height) !important;
    transform: translateX(var(--hero-boy-x)) translateY(var(--hero-boy-y)) rotate(var(--hero-boy-rotate)) scale(var(--hero-boy-scale)) !important;
    transform-origin: center bottom !important;
    will-change: transform;
  }
}

@media (max-width: 576px){
  .hero .display-5, .hero .display-6{
    font-size: 1.72rem;
    line-height: 1.05;
  }
  .hero .lead{
    font-size: .92rem;
  }
  .hero .btn{
    padding: .46rem .84rem !important;
    font-size: .86rem;
  }

  .hero .pill{ display: none !important; }
  .hero .stat{
    padding: 14px;
  }
  .hero .stat .num{
    font-size: 1.36rem;
  }
}
@media (max-width: 576px){
  .hero--index .row{ row-gap: 10px; }
  .hero-visual{ min-height: 260px; }
  .hero--index #heroKpis{ margin-top: 1rem !important; }
}

.profile-card{
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.profile-media{
  width: 100%;
  aspect-ratio: 4 / 5;
  background: rgba(10,16,14,.45);
  border-bottom: 1px solid rgba(190,255,220,.12);
}
.profile-media img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display:block;
}
.badge-popular{
  background: rgba(143,211,255,.16);
  border: 1px solid rgba(143,211,255,.32);
  color: rgba(235,245,240,.92);
}

.mini-carousel .carousel-inner{
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.mini-carousel .carousel-item{
  padding: 0;
}

.list-check .d-flex{ line-height: 1.25; }
.list-check .bi{ margin-top: 2px; }

@media (max-width: 991.98px){

  .profile-media{
    aspect-ratio: 4 / 5;
    background: rgba(0,0,0,.18);
  }
  .profile-media img{
    object-fit: contain;
  }
}

.quiz-modal{
  background: linear-gradient(180deg, rgba(14,23,20,.96), rgba(7,11,9,.94));
  border:1px solid rgba(190,255,220,.12);
  border-radius: 22px;
}
.quiz-options{
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}
@media (min-width: 768px){
  .quiz-options{ grid-template-columns: 1fr 1fr; }
}
.quiz-option{
  display:flex;
  gap:12px;
  align-items:flex-start;
  padding: 14px 14px;
  border-radius: 16px;
  border: 1px solid rgba(190,255,220,.12);
  background: rgba(10,16,14,.42);
  cursor:pointer;
  user-select:none;
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
.quiz-option:hover{
  transform: translateY(-1px);
  border-color: rgba(143,211,255,.32);
  background: rgba(10,16,14,.54);
  box-shadow: 0 12px 40px rgba(0,0,0,.28);
}
.quiz-option .form-check-input{
  width: 1.18em;
  height: 1.18em;
  margin-top: .1rem;
  border-color: rgba(190,255,220,.22);
  background-color: rgba(10,16,14,.65);
}
.quiz-option .form-check-input:checked{
  background-color: rgba(143,211,255,.95);
  border-color: rgba(143,211,255,.95);
}
.quiz-option-text{
  font-weight: 700;
  color: rgba(235,245,240,.92);
  line-height: 1.15;
}
@media (max-width: 576px){
  .quiz-option{ padding: 12px 12px; }
  .quiz-option-text{ font-weight: 650; }
}

.quiz-picker{
  width: 100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  padding: 14px 14px;
  border-radius: 16px;
  border: 1px solid rgba(190,255,220,.14);
  background: rgba(10,16,14,.55);
  color: rgba(235,245,240,.92);
  box-shadow: 0 10px 30px rgba(0,0,0,.22);
  transition: border-color .18s ease, background .18s ease, transform .18s ease;
}
.quiz-picker:hover{
  border-color: rgba(143,211,255,.30);
  background: rgba(10,16,14,.64);
  transform: translateY(-1px);
}
.quiz-picker-text{
  font-weight: 750;
  line-height: 1.15;
}
.quiz-input{
  background: rgba(10,16,14,.55) !important;
  border: 1px solid rgba(190,255,220,.14) !important;
  color: rgba(235,245,240,.92) !important;
  border-radius: 14px !important;
}
.quiz-input::placeholder{
  color: rgba(235,245,240,.45);
}

.quiz-modal .modal-body{ position: relative; }

.quiz-picker-sheet{
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.18);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  z-index: 1085;
  padding: 0;
  display: block;
  pointer-events: none;
}
.quiz-picker-sheet.is-open{ pointer-events: auto; }

@media (min-width: 768px){

  .quiz-picker-sheet{
    position: fixed;
    inset: 0;
  }
}

.quiz-picker-panel{
  position: absolute;
  top: 0;
  left: 0;
  transform: translateY(6px) scale(.98);
  opacity: 0;
  transform-origin: top left;
  transition: opacity .18s ease, transform .18s ease;

  width: min(560px, 100%);
  max-height: 78vh;
  background: linear-gradient(180deg, rgba(14,20,18,.98) 0%, rgba(9,13,11,.98) 100%);
  border: 1px solid rgba(184,137,0,.88);
  border-radius: 0;
  box-shadow: 0 18px 48px rgba(0,0,0,.52);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.quiz-picker-header{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 10px;
  padding: 14px 14px;
  border-bottom: 1px solid rgba(190,255,220,.10);
}
.quiz-picker-options{
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  padding: 10px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.quiz-picker-sheet.is-desktop .quiz-picker-options{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 8px;
  padding: 10px 10px 14px;
  overflow-x: hidden;
  overflow-y: auto;
}
.quiz-picker-sheet.is-desktop .quiz-picker-option{
  text-align: center;
  white-space: normal;
  padding: 10px 10px;
  font-size: 14px;
  border-radius: 16px;
  line-height: 1.15;
}

.quiz-picker-sheet.is-desktop.is-district .quiz-picker-option{
  text-align: left;
  padding: 12px 12px;
  font-size: 14px;
  line-height: 1.15;
}

@media (max-width: 576px){
  .quiz-picker-options{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 10px 10px 14px;
  }
  .quiz-picker-option{
    width: 100%;
    min-width: 0;
    white-space: normal;
    margin-bottom: 0;
    text-align: center;
    padding: 13px 10px;
    border-radius: 16px;
  }
}

.quiz-picker-option{
  width: 100%;
  text-align: left;
  border: 1px solid rgba(190,255,220,.12);
  background: linear-gradient(180deg, rgba(18,30,25,.66), rgba(8,12,10,.66));
  color: rgba(235,245,240,.92);
  border-radius: 16px;
  padding: 14px 14px;
  margin-bottom: 0;
  font-weight: 750;
  transition: border-color .18s ease, background .18s ease, transform .18s ease;
}
.quiz-loc-row{
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 4px;
  width: 100%;
  min-width: 0;
}
.quiz-loc-district{
  color: #b88900;
  font-weight: 850;
  line-height: 1.15;
  display: block;
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
  hyphens: auto;
  text-shadow: 0 1px 0 rgba(0,0,0,.25);
}
.quiz-loc-address{
  color: rgba(235,245,240,.92);
  font-weight: 700;
  line-height: 1.2;
  display: block;
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.quiz-picker-option:hover{
  border-color: rgba(143,211,255,.34);
  background: rgba(10,16,14,.62);
  transform: translateY(-1px);
}

.quiz-picker-sheet[data-picker="age"] .quiz-picker-options{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.quiz-picker-sheet[data-picker="district"] .quiz-picker-options{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.quiz-picker-sheet[data-picker="district"] .quiz-picker-option{
  display: flex;
  align-items: center;
  justify-content: center;
}
@media (max-width: 576px){
  .quiz-picker-sheet[data-picker="district"] .quiz-picker-options{
    grid-template-columns: 1fr;
  }
  .quiz-picker-sheet[data-picker="district"] .quiz-picker-option{
    min-height: 64px;
    padding-left: 10px;
    padding-right: 10px;
  }
}
@media (min-width: 768px){
  .quiz-picker-sheet[data-picker="age"] .quiz-picker-options,
  .quiz-picker-sheet[data-picker="district"] .quiz-picker-options{
    max-height: none;
    overflow: visible;
  }
}

@media (min-width: 768px){
  .quiz-picker-sheet[data-picker="age"] .quiz-picker-options{
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }
}

.quiz-picker-option.is-active{
  border-color: rgba(143,211,255,.55);
  background: rgba(143,211,255,.10);
  box-shadow: 0 0 0 1px rgba(143,211,255,.18), 0 16px 50px rgba(0,0,0,.45);
}

@media (max-width: 576px){
  .quiz-modal .modal-body{ padding: 14px; }
  .quiz-modal h3{ font-size: 1.35rem; }
  .quiz-modal .card-dark.p-4{ padding: 14px !important; }
  .quiz-modal .btn{ padding: .6rem 1rem; }
  .quiz-modal #quizSubmitBtn{ font-size: .92rem; padding: .6rem 1rem; }
  .quiz-picker{ padding: 12px 12px; }
  .quiz-picker-text{ font-weight: 700; }
  .quiz-picker-option{ padding: 12px 12px; font-weight: 700; }
}

.quiz-orient-note-mobile{ display:none; }

@media (max-width: 576px){
  .quiz-modal .modal-header{
    padding: 10px 12px;
  }
  .quiz-modal .modal-header .btn-close{
    transform: scale(.92);
  }
  .quiz-modal .quiz-progress{ margin-bottom: 10px; }

  .quiz-modal h3{ font-size: 1.08rem; margin-bottom: .35rem; }
  .quiz-modal .muted{ font-size: .86rem; }

  .quiz-modal .quiz-result-actions{
    position: sticky;
    bottom: 0;
    margin: 8px -14px -14px;
    padding: 10px 14px 12px;
    background: linear-gradient(180deg, rgba(7,11,9,.98) 0%, rgba(5,8,6,.98) 100%);
    border-top: 1px solid rgba(190,255,220,.10);
    border-bottom-left-radius: 18px;
    border-bottom-right-radius: 18px;
  }
  .quiz-modal .quiz-result-actions .form-label{ display:none; }
  .quiz-modal .quiz-result-actions .muted.small.mt-2{ display:block;
  font-size:.72rem;
  line-height:1.25;
  opacity:.78;
  margin-top:8px;
}

  .quiz-modal .quiz-result-actions .form-control{
    padding: 10px 12px;
    font-size: .92rem;
  }

  .quiz-modal #quizSubmitBtn{
    font-size: .86rem;
    padding: .50rem .85rem;
  }
  .quiz-modal .btn{
    font-size: .86rem;
    padding: .50rem .85rem;
  }

  .quiz-modal #quizSummary .d-flex{ margin-bottom: 6px !important; }
  .quiz-modal #quizRecommendation{ font-size: .92rem; }

  .quiz-orient-note{ display:none; } 
  .quiz-orient-note-mobile{
    display:block;
    font-size: .74rem;
    opacity: .72;
    line-height: 1.25;
    margin-bottom: 8px;
  }

  .quiz-result-card{ padding: 14px !important; }
  .quiz-result-card .row{ --bs-gutter-x: .75rem; --bs-gutter-y: .75rem; }

  .quiz-result-card .fw-bold{ font-size: .98rem; }

}

.quiz-error{
  margin-bottom: 10px;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(255,90,90,.28);
  background: rgba(255,90,90,.10);
  color: rgba(235,245,240,.92);
  font-weight: 650;
}

.quiz-orient-note{}

@media (max-width: 576px){
  .quiz-orient-note{ display:none !important; }
  .quiz-modal .progress{ height: 8px !important; }
  .quiz-modal .modal-body{ padding: 14px 14px 10px; }
  .quiz-modal .soft-line{ margin: 10px 0 !important; }
  .quiz-modal .quiz-result-actions{ margin-top: 6px; }
  .quiz-modal #quizSubmitBtn{ font-size: .86rem; padding: .52rem .85rem; }
  .quiz-modal .quiz-result-actions .btn{ font-size: .84rem; padding: .52rem .85rem; }
  .quiz-modal #quizParentName, .quiz-modal #quizPhone{ padding: 10px 12px; font-size: 16px !important; }
  .quiz-modal .fw-black{ letter-spacing: -0.4px; }
  .quiz-modal .quiz-step[data-step="5"] h3{ margin-bottom: 6px !important; }
}

.quiz-submit-error{
  font-size: .78rem;
  color: rgba(235,245,240,.88);
  margin: 0 0 8px;
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  transform: translateY(-4px);
  transition: max-height .22s ease, opacity .18s ease, transform .18s ease;
}
.quiz-submit-error.is-show{
  max-height: 90px;
  opacity: 1;
  transform: translateY(0);
}

.quiz-error-inline{
  font-size: .78rem;
  color: rgba(235,245,240,.88);
  margin-top: 6px;
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  transform: translateY(-4px);
  transition: max-height .22s ease, opacity .18s ease, transform .18s ease;
}

.quiz-error-inline::before{
  content: "•";
  display: inline-block;
  margin-right: 8px;
  color: rgba(143,211,255,.92);
  transform: translateY(-1px);
}
.quiz-error-inline.is-show{
  max-height: 80px;
  opacity: 1;
  transform: translateY(0);
}

.quiz-modal .form-control.is-invalid{
  border-color: rgba(255,90,90,.55) !important;
  box-shadow: 0 0 0 3px rgba(255,90,90,.12);
}

@media (max-width: 576px){
  .quiz-orient-note-mobile{
    font-size: .70rem;
    opacity: .70;
    margin-bottom: 6px;
  }
}

.quiz-rec-title{
  letter-spacing: -0.2px;
}
.quiz-rec-title 
.quiz-title-gradient{
  background: linear-gradient(90deg, rgba(199,235,255,.98) 0%, rgba(143,211,255,.96) 45%, rgba(199,235,255,.98) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  text-shadow: 0 10px 28px rgba(143,211,255,.18);
}
.quiz-accent{
  background: linear-gradient(180deg, rgba(173,229,255,.95), rgba(89,170,255,.92));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.quiz-modal .btn-accent:disabled{
  opacity: .46;
  filter: grayscale(1);
  cursor: not-allowed;
  box-shadow: none !important;
  transform: none !important;
}

/* Final quiz step: always keep dark visual style */
#quizModal.quiz-is-result .quiz-step[data-step="6"] .quiz-result-card{
  background: linear-gradient(180deg, rgba(12,19,16,.96), rgba(7,11,9,.96)) !important;
  border: 1px solid rgba(184,137,0,.34) !important;
  color: rgba(235,245,240,.94) !important;
}
#quizModal.quiz-is-result .quiz-step[data-step="6"] .quiz-result-card .fw-bold,
#quizModal.quiz-is-result .quiz-step[data-step="6"] .quiz-result-card b{
  color: rgba(245,252,248,.96) !important;
}
#quizModal.quiz-is-result .quiz-step[data-step="6"] .quiz-result-card .muted,
#quizModal.quiz-is-result .quiz-step[data-step="6"] #quizSummary > .d-flex > div,
#quizModal.quiz-is-result .quiz-step[data-step="6"] .quiz-orient-note,
#quizModal.quiz-is-result .quiz-step[data-step="6"] .quiz-orient-note-mobile{
  color: rgba(220,232,226,.9) !important;
}
#quizModal.quiz-is-result .quiz-step[data-step="6"] #quizRecommendation{
  background: rgba(10,16,14,.72) !important;
  border: 1px solid rgba(184,137,0,.28) !important;
  color: rgba(235,245,240,.94) !important;
}
#quizModal.quiz-is-result .quiz-step[data-step="6"] #quizRecommendation .muted{
  color: rgba(220,232,226,.9) !important;
}
#quizModal.quiz-is-result .quiz-step[data-step="6"] .quiz-result-actions{
  background: linear-gradient(180deg, rgba(8,13,11,.96), rgba(5,8,6,.98)) !important;
  border-top: 1px solid rgba(184,137,0,.26) !important;
}
#quizModal.quiz-is-result .quiz-step[data-step="6"] .quiz-result-actions .form-label{
  color: rgba(226,237,231,.92) !important;
}
#quizModal.quiz-is-result .quiz-step[data-step="6"] .quiz-result-actions .form-control{
  border: 1px solid rgba(184,137,0,.88) !important;
}
#quizModal.quiz-is-result .quiz-step[data-step="6"] .quiz-result-actions .form-control:focus{
  border-color: rgba(242,196,0,.98) !important;
  box-shadow: 0 0 0 2px rgba(184,137,0,.22) !important;
}

@media (max-width: 576px){
  #quizModal.quiz-is-result .quiz-progress{ display: none !important; }
  #quizModal.quiz-is-result .modal-footer{ display: none !important; }
  #quizModal.quiz-is-result .modal-dialog{
    margin: .35rem;
    height: calc(100dvh - .7rem);
    min-height: calc(100dvh - .7rem);
    max-width: calc(100vw - .7rem);
  }
  #quizModal.quiz-is-result .modal-content{
    height: 100%;
    display: flex;
    border-radius: 0;
  }
  #quizModal.quiz-is-result .modal-body{
    flex: 1 1 auto;
    min-height: 0;
    padding: 10px 10px 8px !important;
    overflow-y: auto;
    max-height: none;
  }
  #quizModal.quiz-is-result .quiz-rec-title{
    margin-top: 0;
    margin-bottom: 6px !important;
  }
  #quizModal.quiz-is-result .quiz-result-card{ padding: 10px !important; border-radius: 0 !important; }
  #quizModal.quiz-is-result .quiz-result-card .row.g-2{
    --bs-gutter-x: .45rem;
    --bs-gutter-y: .45rem;
  }
  #quizModal.quiz-is-result .quiz-result-card .fw-bold.mb-2{
    margin-bottom: 4px !important;
    font-size: .9rem;
    line-height: 1.18;
  }
  #quizModal.quiz-is-result #quizSummary .d-flex{
    gap: .35rem !important;
    margin-bottom: 3px !important;
    line-height: 1.18;
  }
  #quizModal.quiz-is-result #quizSummary .d-flex i.bi-check2-circle{
    font-size: .82rem;
    margin-top: 1px;
  }
  #quizModal.quiz-is-result #quizSummary .d-flex > div{
    font-size: .79rem;
    line-height: 1.2;
  }
  #quizModal.quiz-is-result #quizRecommendation{
    padding: .5rem .55rem !important;
    border-radius: 0 !important;
  }
  #quizModal.quiz-is-result #quizRecommendation .fw-bold{
    font-size: .82rem;
    margin-bottom: 3px !important;
    line-height: 1.2;
  }
  #quizModal.quiz-is-result #quizRecommendation .muted{
    font-size: .76rem !important;
    line-height: 1.2 !important;
    margin-bottom: 3px !important;
  }
  #quizModal.quiz-is-result #quizSummary .d-flex{ margin-bottom: 3px !important; }
  #quizModal.quiz-is-result .soft-line.my-3{ margin: 6px 0 !important; }
  #quizModal.quiz-is-result .quiz-result-actions .row{ --bs-gutter-x: .5rem; --bs-gutter-y: .5rem; }
  #quizModal.quiz-is-result .quiz-result-actions .muted.small.mt-2{
    font-size: .7rem;
    line-height: 1.2;
    margin-top: 4px !important;
  }
  #quizModal.quiz-is-result .quiz-result-actions .d-grid.d-md-flex.gap-2.mt-3{
    margin-top: 8px !important;
    gap: 6px !important;
  }
  #quizModal.quiz-is-result #quizSubmitBtn,
  #quizModal.quiz-is-result .quiz-result-actions .btn{
    font-size: .86rem !important;
    padding: .52rem .8rem !important;
  }

  /* keep one visual style for final step fields/buttons */
  #quizModal.quiz-is-result .quiz-result-actions .form-control,
  #quizModal.quiz-is-result .quiz-result-actions .btn{
    border-radius: 0 !important;
  }
  #quizModal.quiz-is-result .quiz-result-actions .form-control{
    background: rgba(10,16,14,.78) !important;
    border: 1px solid rgba(190,255,220,.2) !important;
    color: rgba(235,245,240,.95) !important;
  }
  #quizModal.quiz-is-result .quiz-result-actions{
    border-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
  }
  #quizModal.quiz-is-result .quiz-result-actions .form-control::placeholder{
    color: rgba(235,245,240,.52) !important;
  }
  #quizModal.quiz-is-result .quiz-result-actions .form-control:-webkit-autofill,
  #quizModal.quiz-is-result .quiz-result-actions .form-control:-webkit-autofill:hover,
  #quizModal.quiz-is-result .quiz-result-actions .form-control:-webkit-autofill:focus{
    -webkit-text-fill-color: rgba(235,245,240,.95) !important;
    -webkit-box-shadow: 0 0 0 1000px rgba(10,16,14,.78) inset !important;
    box-shadow: 0 0 0 1000px rgba(10,16,14,.78) inset !important;
  }
  #quizModal.quiz-is-result .quiz-result-actions .invalid-feedback{
    color: rgba(255,176,176,.95) !important;
  }
}

/* Extra compact layout for very small phones (iPhone SE class) */
@media (max-width: 380px){
  #quizModal.quiz-is-result .modal-dialog{
    margin: .2rem;
    height: calc(100dvh - .4rem);
    min-height: calc(100dvh - .4rem);
    max-width: calc(100vw - .4rem);
  }
  #quizModal.quiz-is-result .modal-header{
    padding: 8px 10px !important;
  }
  #quizModal.quiz-is-result .modal-body{
    padding: 9px 9px 9px !important;
  }
  #quizModal.quiz-is-result .quiz-rec-title{
    font-size: 1.02rem !important;
    margin-bottom: 2px !important;
  }
  #quizModal.quiz-is-result .muted.mb-3{
    font-size: .76rem !important;
    margin-bottom: 6px !important;
  }
  #quizModal.quiz-is-result .quiz-result-card{
    padding: 10px !important;
  }
  #quizModal.quiz-is-result .quiz-result-card .row.g-2{
    --bs-gutter-x: .35rem;
    --bs-gutter-y: .35rem;
  }
  #quizModal.quiz-is-result .quiz-result-card .fw-bold{
    font-size: .9rem !important;
    margin-bottom: 4px !important;
  }
  #quizModal.quiz-is-result #quizSummary .d-flex{
    margin-bottom: 2px !important;
  }
  #quizModal.quiz-is-result #quizSummary .d-flex > div{
    font-size: .75rem !important;
    line-height: 1.18 !important;
  }
  #quizModal.quiz-is-result #quizRecommendation{
    padding: .42rem .48rem !important;
  }
  #quizModal.quiz-is-result #quizRecommendation .fw-bold{
    font-size: .78rem !important;
  }
  #quizModal.quiz-is-result #quizRecommendation .muted{
    font-size: .72rem !important;
    line-height: 1.16 !important;
  }
  #quizModal.quiz-is-result .quiz-result-card .muted,
  #quizModal.quiz-is-result #quizRecommendation{
    font-size: .78rem !important;
    line-height: 1.24 !important;
  }
  #quizModal.quiz-is-result .soft-line.my-3{
    margin: 5px 0 !important;
  }
  #quizModal.quiz-is-result .quiz-result-actions .row{
    --bs-gutter-x: .4rem;
    --bs-gutter-y: .35rem;
  }
  #quizModal.quiz-is-result .quiz-result-actions .form-label{
    font-size: .72rem !important;
    margin-bottom: 2px !important;
  }
  #quizModal.quiz-is-result .quiz-result-actions .form-control{
    padding: 8px 10px !important;
    font-size: 16px !important;
  }
  #quizModal.quiz-is-result .quiz-result-actions .muted.small.mt-2{
    font-size: .66rem !important;
    line-height: 1.16 !important;
    margin-top: 4px !important;
  }
  #quizModal.quiz-is-result .quiz-result-actions .d-grid.d-md-flex.gap-2.mt-3{
    margin-top: 6px !important;
    gap: 5px !important;
    display: grid !important;
    grid-template-columns: 1fr;
  }
  #quizModal.quiz-is-result #quizSubmitBtn,
  #quizModal.quiz-is-result .quiz-result-actions .btn{
    font-size: .82rem !important;
    padding: .45rem .65rem !important;
  }
  #quizModal.quiz-is-result .quiz-result-actions .btn[data-bs-dismiss="modal"]{
    display: none !important;
  }
  #quizModal.quiz-is-result .quiz-result-actions{
    border-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
  }
}

.nav-icon-link{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 14px;
  border: 1px solid rgba(190,255,220,.14);
  background: rgba(8,12,10,.38);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  color: rgba(235,245,240,.92);
}
.nav-icon-link i{ font-size: 1.25rem; }
.nav-icon-link:hover{
  border-color: rgba(173,229,255,.32);
  box-shadow: 0 14px 34px rgba(89,170,255,.16);
  transform: translateY(-1px);
  color: rgba(255,255,255,.95);
}
.nav-icon-link--mobile{
  width: 44px;
  height: 44px;
  border-radius: 16px;
}

.nav-parents{
  position: relative;
}
.parents-dropdown{
  position: absolute;
  top: calc(100% + 10px);
  left: 0;
  min-width: 240px;
  padding: 10px;
  border-radius: 2px;
  border: 1px solid rgba(242,196,0,.52);
  background: rgba(6,10,8,.32);
  backdrop-filter: blur(28px) saturate(140%);
  -webkit-backdrop-filter: blur(28px) saturate(140%);
  box-shadow: 0 24px 60px rgba(0,0,0,.55);
  opacity: 0;
  transform: translateY(10px);
  pointer-events: none;
  transition: opacity .18s ease, transform .18s ease;
  z-index: 1050;
}
.parents-dropdown .parents-item{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 2px;
  color: rgba(235,245,240,.92);
  text-decoration: none;
  background: linear-gradient(180deg, rgba(10,16,14,.35), rgba(8,12,10,.30));
  border: 1px solid rgba(242,196,0,.28);
  font-family: "Russo One", "Oswald", sans-serif;
  text-transform: uppercase;
  letter-spacing: .03em;
  font-size: .78rem;
  line-height: 1.2;
}
.parents-dropdown .parents-item:hover{
  background: linear-gradient(180deg, rgba(242,196,0,.22), rgba(242,196,0,.15));
  border-color: rgba(242,196,0,.55);
  color: rgba(255,246,207,.98);
  box-shadow: 0 10px 28px rgba(0,0,0,.35);
}
.parents-dropdown .parents-item i{
  font-size: 1rem;
  opacity: .85;
  transition: transform .18s ease, opacity .18s ease;
}
.parents-dropdown .parents-item:hover i{
  transform: translateX(2px);
  opacity: 1;
}

.parents-dropdown::before{
  content:"";
  position:absolute;
  left: 0;
  right: 0;
  top: -12px;
  height: 12px;

  background: transparent;
}
.parents-dropdown::after{
  content:"";
  position:absolute;
  top: -7px;
  left: 18px;
  width: 12px;
  height: 12px;
  transform: rotate(45deg);
  background: rgba(6,10,8,.32);
  border-left: 1px solid rgba(242,196,0,.52);
  border-top: 1px solid rgba(242,196,0,.52);
  backdrop-filter: blur(28px) saturate(140%);
  -webkit-backdrop-filter: blur(28px) saturate(140%);
}

@media (min-width: 992px){
  .nav-parents:hover .parents-dropdown{
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
  }
}

.parents-modal{
  background: rgba(8,12,10,.55);
  border: 1px solid rgba(190,255,220,.14);
  border-radius: 22px;
  backdrop-filter: blur(28px) saturate(140%);
  -webkit-backdrop-filter: blur(28px) saturate(140%);
}
.parents-modal .modal-body{ padding: 14px 14px 16px; }
.parents-modal-list{
  display: grid;
  gap: 10px;
}
.parents-modal-link{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 16px;
  background: rgba(10,16,14,.38);
  border: 1px solid rgba(190,255,220,.12);
  text-decoration:none;
  color: rgba(235,245,240,.92);
}
.parents-modal-link:hover{
  background: rgba(10,16,14,.52);
  border-color: rgba(173,229,255,.28);
  color: rgba(255,255,255,.96);
}
.parents-modal-link i{ font-size: 1.25rem; opacity: .85; }

.mini-carousel-wrap{
  position: relative;
}
.carousel-arrow{
  position: absolute;
  top: 40%;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  border-radius: 999px;
  border: 1px solid rgba(190,255,220,.16);
  background: rgba(0,0,0,.22);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  color: rgba(235,245,240,.92);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  opacity: .78;
  transition: opacity .15s ease, transform .15s ease;
  z-index: 5;
}
.carousel-arrow:hover{
  opacity: 1;
  transform: translateY(-50%) scale(1.03);
}
.carousel-arrow--left{ left: 10px; }
.carousel-arrow--right{ right: 10px; }
.carousel-arrow i{ font-size: 1.15rem; }

.desktop-snap .carousel-arrow{ top: 50%; }
.snap-carousel{
  display: flex;
  gap: 12px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  padding: 6px 52px;
  scrollbar-width: none;
}
.snap-carousel::-webkit-scrollbar{ display: none; }
.snap-item{ flex: 0 0 240px; scroll-snap-align: start; }
@media (min-width: 1200px){
  .snap-item{ flex-basis: 260px; }
}

.snap-carousel--three{ padding: 6px; }
.snap-carousel--three .snap-item{ flex: 0 0 calc((100% - 24px) / 3); }

.quiz-picker-sheet.is-open .quiz-picker-panel{ opacity: 1; transform: translateY(0) scale(1); }
.quiz-picker-panel.is-flip{ transform-origin: bottom left; }

@media (max-width: 991.98px){
  .mini-carousel .carousel-inner{
    overflow: visible;
    border-radius: 0;
  }
}

body[data-page="cabinet"]{
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
body[data-page="cabinet"] #siteFooter{
  margin-top: auto;
}

@media (min-width: 992px){
  .quiz-picker-sheet.is-desktop.is-district .quiz-picker-option{
  text-align: left;
  padding: 12px 12px;
  font-size: 14px;
  line-height: 1.15;
}
}

:root{
  --ease-out: cubic-bezier(.2,.9,.2,1);
  --t-fast: 180ms;
  --t-ui: 220ms;
}

.card-dark, .glass, .card-image{
  transition:
    box-shadow var(--t-ui) var(--ease-out),
    border-color var(--t-ui) var(--ease-out),
    background-color var(--t-ui) var(--ease-out);
}

.btn{
  transition: transform var(--t-ui) var(--ease-out),
              box-shadow var(--t-ui) var(--ease-out),
              filter var(--t-ui) var(--ease-out),
              background-color var(--t-ui) var(--ease-out);
}
.btn:hover{
  transform: translateY(-1px);
}
.btn-accent:hover{
  box-shadow: 0 18px 44px rgba(143,211,255,.22), 0 10px 24px rgba(0,0,0,.52);
}

.parents-dropdown{
  transition: opacity var(--t-ui) var(--ease-out), transform var(--t-ui) var(--ease-out);
}
.nav-parents:hover .parents-dropdown{
  opacity: 1;
  transform: translateY(0);
}

@media (prefers-reduced-motion: reduce){
  *{
    transition: none !important;
    animation: none !important;
    scroll-behavior: auto !important;
  }
}

.fab-call{
  position: fixed;
  right: 18px;
  bottom: 18px;
  width: 56px;
  height: 56px;
  border-radius: 999px;
  background: radial-gradient(120% 120% at 30% 20%, rgba(190,255,220,.45) 0%, rgba(143,211,255,.18) 32%, rgba(10,16,14,.86) 100%), rgba(12,18,16,.72);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(190,255,220,.28);
  color: var(--accent);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2500;
  box-shadow: 0 14px 34px rgba(0,0,0,.42), 0 0 0 1px rgba(143,211,255,.12) inset;
  text-decoration: none;
  cursor: pointer;
  transform: translateZ(0);
  transition: transform 180ms ease-out, box-shadow 180ms ease-out, filter 180ms ease-out;
  isolation: isolate;
  overflow: visible;
}
.fab-call:hover{
  transform: translateY(-2px) scale(1.02);
  box-shadow: 0 18px 42px rgba(0,0,0,.48), 0 0 0 1px rgba(143,211,255,.18) inset;
  filter: saturate(1.06);
}
.fab-call:active{ transform: translateY(0) scale(.98); }
.fab-call i{ font-size: 22px; }
.fab-call::before{
  content: "";
  position: absolute;
  inset: -12px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(143,211,255,.26), rgba(143,211,255,0) 62%);
  opacity: .75;
  z-index: -1;
  pointer-events: none;
  animation: fabPulse 1.8s ease-out infinite;
}
@keyframes fabPulse{
  0%{ transform: scale(.65); opacity: 0; }
  18%{ opacity: .7; }
  100%{ transform: scale(1.38); opacity: 0; }
}
@media (prefers-reduced-motion: reduce){
  .fab-call{ transition: none; }
  .fab-call::before{ animation: none; }
}
.fab-call:hover{
  transform: translateY(-2px);
  filter: brightness(1.02);
}

.footer-strong{
  border-top: 1px solid rgba(190,255,220,.10);
  background: rgba(6, 14, 36, .86);
}
.icon-pill{
  width: 44px;
  height: 44px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background: rgba(12,18,16,.45);
  border: 1px solid rgba(190,255,220,.12);
  color: rgba(235,245,240,.92);
}
.icon-pill--text{
  font-weight: 900;
  letter-spacing: .6px;
  font-size: 12px;
}
.social-text{
  font-weight: 900;
  letter-spacing: .6px;
  font-size: 12px;
  line-height: 1;
}
.social-btn{
  width: 44px;
  height: 44px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background: rgba(12,18,16,.45);
  border: 1px solid rgba(190,255,220,.12);
  color: rgba(235,245,240,.92);
  text-decoration: none;
}
.social-btn:hover{
  border-color: rgba(143,211,255,.45);
}
.footer-list{
  list-style: none;
  padding-left: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px 14px;
}
.footer-list li{
  margin: 0;
  color: rgba(235,245,240,.86);
  font-size: .94rem;
  line-height: 1.25;
}

@media (max-width: 340px){
  .footer-list{ grid-template-columns: 1fr; }
}

.footer-strong{
  padding-top: 22px;
  padding-bottom: 22px;
}
@media (max-width: 575.98px){
  .footer-strong{
    padding-top: 16px;
    padding-bottom: 16px;
  }
  .footer-strong .icon-pill,
  .footer-strong .social-btn{
    width: 38px;
    height: 38px;
    border-radius: 14px;
  }
  .footer-strong .footer-list li{ font-size: .88rem; }
}

@media (max-width: 991.98px){
  .signup-whatnext,
  .signup-comment,
  .signup-side{
    display: none !important;
  }
}

.schedule-top{
  padding-top: 96px; 
  padding-bottom: 22px;
}
.schedule-panel{
  background: rgba(12,18,16,.42);
  border: 1px solid rgba(190,255,220,.12);
  border-radius: 22px;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
.filter-row{
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}
@media (max-width: 991.98px){
  .filter-row{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
.chips{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.chip{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(12,18,16,.50);
  border: 1px solid rgba(190,255,220,.12);
  color: rgba(235,245,240,.92);
  font-size: 13px;
}
.chip button{
  border: none;
  background: transparent;
  color: rgba(235,245,240,.75);
  line-height: 1;
}
.chip button:hover{ color: rgba(235,245,240,.95); }

.week-grid{
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 14px;
  align-items: start;
  margin-top: 14px; 
}
@media (max-width: 991.98px){
  .week-grid{ display: none; }
}
.day-col{
  background: rgba(12,18,16,.36);
  border: 1px solid rgba(190,255,220,.10);
  border-radius: 18px;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  padding: 12px;
  height: fit-content;
  align-self: start;
}
.day-head{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 10px;
}

.day-name{
  font-weight: 950;
  letter-spacing: -.4px;
}
.count-badge{
  font-size: 12px;
  font-weight: 850;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 26px;
  width: 26px;      
  min-width: 26px;
  padding: 0;
  line-height: 1;
  border-radius: 999px;
  background: rgba(143,211,255,.12);
  border: 1px solid rgba(143,211,255,.22);
  color: rgba(235,245,240,.92);
  flex: 0 0 auto;
  white-space: nowrap;
}
.count-badge.is-wide{
  width: auto;      
  padding: 0 8px;
}

.branch{
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid rgba(190,255,220,.10);
}
.branch:first-child{
  margin-top: 0;
  padding-top: 0;
  border-top: none;
}
.branch-title{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-weight: 800;
  margin-bottom: 8px;
  min-width: 0;
}
.branch-title > span:first-child{
  min-width: 0;
}

.lesson{
  display: grid;
  grid-template-columns: 88px minmax(0, 1fr);
  gap: 10px;
  padding: 10px 10px;
  border-radius: 14px;
  background: rgba(8,12,10,.32);
  border: 1px solid rgba(190,255,220,.10);
  margin-bottom: 8px;
  overflow: hidden; 
}
.lesson:last-child{ margin-bottom: 0; }
.lesson > div:last-child{ min-width:0; }
.lesson:hover{
  border-color: rgba(143,211,255,.28);
}
.lesson-time{
  font-weight: 950;
  font-size: 13px;
  line-height: 1.1;
  color: rgba(235,245,240,.92);
}
.lesson-meta{
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 6px;
  min-width: 0;
  overflow: hidden;
}

.pill-mini{
  font-size: 11px;
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(12,18,16,.55);
  border: 1px solid rgba(190,255,220,.12);
  color: rgba(235,245,240,.88);
  max-width: 100%;
  min-width: 0;
  flex: 0 1 auto; 
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.lesson-note{
  font-size: 12px;
  color: rgba(235,245,240,.72);
}

.week-grid .lesson{
  grid-template-columns: 1fr;
}
.week-grid .lesson-time{
  margin-bottom: 4px;
  font-size: 12px;
  opacity: .9;
  border-right: 0;
  padding-right: 0;
}

.week-grid .lesson-meta{
  flex-direction: column;
  align-items: flex-start;
}
.week-grid .pill-mini{
  width: 100%;
}
.week-grid .lesson-note{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.empty-day{
  display: grid;
  place-items: center;
  text-align: center;
  padding: 26px 10px;
  border-radius: 16px;
  background: rgba(8,12,10,.28);
  border: 1px dashed rgba(190,255,220,.18);
}
.empty-day .title{
  font-weight: 950;
  letter-spacing: .6px;
}
.fade-in{
  animation: fadeInUp var(--t-ui) var(--ease-out) both;
}
@keyframes fadeInUp{
  from{ opacity: 0; transform: translateY(6px); }
  to{ opacity: 1; transform: translateY(0); }
}

.schedule-accordion{ display:none; }
@media (max-width: 991.98px){
  .schedule-accordion{ display:block; }
}

.camps-top{
  padding-top: 28px;
  padding-bottom: 22px;
}
.camp-filter-row{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
@media (max-width: 991.98px){
  .camp-filter-row{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 575.98px){
  .camp-filter-row{
    grid-template-columns: 1fr;
  }
}
.camps-grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  align-items: stretch;
}
@media (max-width: 991.98px){
  .camps-grid{
    grid-template-columns: 1fr;
  }
}
.camp-card{
  height: 100%;
}

.media-card{
  position: relative;
}
.media-arrow{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 12;
  width: 40px;
  height: 40px;
  border-radius: 2px;
  display: grid;
  place-items: center;
  background: rgba(12,18,16,.55);
  border: 1px solid rgba(190,255,220,.16);
  color: rgba(235,245,240,.92);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.media-arrow:hover{ border-color: rgba(143,211,255,.40); }
.media-arrow--left{ left: 14px; }
.media-arrow--right{ right: 14px; }
@media (max-width: 575.98px){
  .media-arrow{ width: 38px; height: 38px; }
}

.review-btn{ border:0; color: inherit; text-align: left; cursor: pointer; }
.review-btn:focus{ outline: 2px solid rgba(143,211,255,.35); outline-offset: 2px; }

.video-reviews-card{ max-width: 920px; margin: 0 auto; }
@media (max-width: 991.98px){
  .video-reviews-card{ max-width: none; }
}

.nav-parents{ position: relative; }
.parents-dropdown:before{ content:""; position:absolute; top:-12px; left:0; right:0; height:12px; }

#contacts{ scroll-margin-top: 96px; }

[data-page="schedule"] .branch-title span{
  color: #1f1f1f;
}

.media-frame{
  position: relative;
  border: 0;
  border-radius: 0;
  padding: 0;
  background: transparent;
  box-shadow: none;
}
.media-stage{
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: 2px;
  overflow: hidden;
  border: 2px solid #111;
  background: rgba(8,12,10,.25);
  display: grid;
  place-items: center;
}
.media-img{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain; 
}
.media-video,
.media-stage iframe{
  width: 100%;
  height: 100%;
  display: block;
  border: 0;
  background: #000;
}
.media-video{ object-fit: contain !important; background: #000; }
.media-frame .media-arrow{ z-index: 30; }

.smart-player{
  position: relative;
  width: 100%;
  height: 100%;
  background: #000;
}
.smart-player__video{
  width: 100%;
  height: 100%;
  display: block;
  background: #000;
}
.smart-player__play{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 62px;
  height: 62px;
  border: 1px solid rgba(255,255,255,.35);
  border-radius: 2px;
  background: rgba(0,0,0,.55);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 60;
  transition: opacity .18s ease, transform .18s ease, background .18s ease;
}
.smart-player__play i{
  font-size: 34px;
  line-height: 1;
}
.smart-player__play:hover{
  background: rgba(0,0,0,.72);
  transform: translate(-50%, -50%) scale(1.04);
}
.smart-player.smart-player--narrow .smart-player__play{
  top: 47%;
}
.smart-player:not(.is-paused) .smart-player__play{
  opacity: 0;
  pointer-events: none;
}
.smart-player__fs{
  position: absolute;
  right: 10px;
  bottom: 10px;
  width: 36px;
  height: 36px;
  border: 1px solid rgba(255,255,255,.32);
  border-radius: 2px;
  background: rgba(0,0,0,.54);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 60;
}
.smart-player__fs:hover{
  background: rgba(0,0,0,.68);
}
.smart-player__volume{
  position: absolute;
  left: 10px;
  bottom: 10px;
  z-index: 60;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 8px;
  border: 1px solid rgba(255,255,255,.32);
  border-radius: 2px;
  background: rgba(0,0,0,.54);
}
.smart-player__mute{
  width: 26px;
  height: 26px;
  border: 0;
  background: transparent;
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  padding: 0;
}
.smart-player__range{
  width: 92px;
  accent-color: #f2c400;
  touch-action: auto;
}
@media (min-width: 992px){
  .smart-player__volume{
    display: none;
  }
}
@media (max-width: 991.98px){
  .smart-player.smart-player--no-mobile-volume .smart-player__volume{
    display: none !important;
  }
  /* Mobile/tablet: use native video controls only (avoid duplicated overlays) */
  .smart-player__play,
  .smart-player__volume,
  .smart-player__fs,
  .smart-player__buffer,
  .smart-player__spinner{
    display: none !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }
  .smart-player__volume{
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s ease;
  }
  .smart-player.show-mobile-ui .smart-player__volume{
    opacity: 1;
    pointer-events: auto;
  }
  .smart-player.show-mobile-ui .smart-player__play{
    opacity: 1;
    pointer-events: auto;
  }
}
.smart-player__buffer{
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 3px;
  background: rgba(255,255,255,.15);
  z-index: 40;
}
.smart-player__buffer > span{
  display: block;
  width: 0%;
  height: 100%;
  background: rgba(255,255,255,.45);
  transition: width .2s linear;
}
.smart-player__spinner{
  display: none;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 34px;
  height: 34px;
  margin: -17px 0 0 -17px;
  border: 3px solid rgba(255,255,255,.3);
  border-top-color: #fff;
  border-radius: 50%;
  animation: spPlayerSpin .85s linear infinite;
  z-index: 70;
}
@keyframes spPlayerSpin{
  to{ transform: rotate(360deg); }
}
@media (max-width: 575.98px){
  .smart-player__play{
    width: 54px;
    height: 54px;
  }
  .smart-player__play i{
    font-size: 30px;
  }
  .smart-player__volume{
    left: 8px;
    bottom: 8px;
    gap: 4px;
    padding: 4px 6px;
  }
  .smart-player__range{
    width: 78px;
  }
}

.testing-card{ max-width: 1060px; margin: 0 auto; }
.testing-grid{
  display: grid;
  grid-template-columns: minmax(0, 82fr) minmax(0, 18fr);
  gap: 16px;
  align-items: stretch;
}
.testing-media-col{ min-width: 0; }
.testing-media .media-stage{

  aspect-ratio: 16 / 9;
  height: auto;
}
.testing-info{
  border-radius: 18px;
  padding: 14px;
  background: rgba(10,16,14,.45);
  border: 1px solid rgba(190,255,220,.14);
  box-shadow: 0 10px 26px rgba(0,0,0,.25);
}
.testing-info-title{
  font-weight: 900;
  letter-spacing: .2px;
  margin-bottom: 8px;
}
.testing-info-box{
  margin-top: 12px;
  padding: 12px;
  border-radius: 16px;
  background: rgba(0,0,0,.22);
  border: 1px solid rgba(190,255,220,.10);
}
.testing-info-list{
  list-style: none;
  padding: 0;
  margin: 10px 0 0;
  display: grid;
  gap: 8px;
}
.testing-info-list li{
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--text-1);
  font-size: 13px;
}
.testing-info-list .dot{
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: var(--accent);
  box-shadow: 0 0 0 3px rgba(143,211,255,.18);
  flex: 0 0 auto;
}

@media (min-width: 992px){

  .testing-grid{
    grid-template-columns: minmax(0, 68fr) minmax(0, 32fr);
  }
}

@media (max-width: 991.98px){
  .testing-card{ max-width: 680px; }
  .testing-grid{ grid-template-columns: 1fr; }

  .testing-media .media-stage{ height: auto; }
}

.signup-mini-contacts{
  margin-top: 14px;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.mini-contact{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  border-radius: 999px;
  border: 1px solid rgba(190,255,220,.14);
  background: rgba(10,16,14,.45);
  color: var(--text-0);
  text-decoration: none;
  transition: transform 160ms ease-out, box-shadow 160ms ease-out, border-color 160ms ease-out;
}
.mini-contact:hover{
  transform: translateY(-1px);
  border-color: rgba(143,211,255,.24);
  box-shadow: 0 10px 24px rgba(0,0,0,.22);
}
.mini-contact i{ font-size: 16px; color: var(--accent); }

.cs-native{
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.cs{
  position: relative;
  width: 100%;
}
.cs-trigger{
  width: 100%;
  min-height: 38px;
  text-align: left;
  border-radius: 14px;
  border: 1px solid rgba(190,255,220,.14);
  background: rgba(10,16,14,.55);
  color: var(--text-0);
  padding: .375rem 2.2rem .375rem .75rem;
  line-height: 1.5;
}
.cs--sm .cs-trigger{
  min-height: 31px;
  padding-top: .18rem;
  padding-bottom: .18rem;
  font-size: .875rem;
}
.cs-trigger.is-disabled{
  opacity: .66;
  cursor: not-allowed;
}
.cs-caret{
  position: absolute;
  right: .72rem;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  opacity: .86;
}
.cs.is-open .cs-caret{
  transform: translateY(-50%) rotate(180deg);
}
.cs-menu{
  position: absolute;
  z-index: 2600;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  border-radius: 14px;
  border: 1px solid rgba(190,255,220,.18);
  background: rgba(7,11,9,.98);
  box-shadow: 0 18px 40px rgba(0,0,0,.45);
}
.cs-list{
  max-height: 260px;
  overflow: auto;
  padding: 6px;
}

/* Signup modal: show all location options without inner scrolling */
#signupModal #signupDistrict + .cs .cs-list{
  max-height: none !important;
  overflow: visible !important;
}
#signupModal #signupDistrict + .cs .cs-option{
  padding: .34rem .52rem;
  font-size: .9rem;
  line-height: 1.2;
}

/* Signup modal: age list should fit fully on mobile */
#signupModal select[name="child_age"] + .cs .cs-list{
  max-height: none !important;
  overflow: visible !important;
}

/* Signup modal: keep long labels/select text in one line for neat desktop alignment */
#signupModal .signup-line-label{
  white-space: nowrap;
  font-size: .78rem !important;
  line-height: 1.1;
}
#signupModal #signupDistrict + .cs .cs-trigger,
#signupModal select[name="contact_method"] + .cs .cs-trigger{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
  font-size: .82rem;
  padding-right: 3.2rem !important;
}
#signupModal #signupDistrict + .cs .cs-trigger{
  text-overflow: clip;
  font-size: .82rem !important;
  font-weight: 700 !important;
  font-family: inherit;
  text-transform: none;
  letter-spacing: inherit;
  padding-right: 3.45rem !important;
}
#signupModal #signupDistrict + .cs .cs-caret,
#signupModal select[name="contact_method"] + .cs .cs-caret{
  right: .75rem;
  width: 1.2rem;
  display: inline-flex;
  justify-content: center;
}
#signupModal #signupDistrict + .cs .cs-caret{
  right: .65rem;
  width: 1.35rem;
}

/* Fallback: if custom-select is not initialized, keep native select readable too */
#signupModal #signupDistrict{
  font-size: .82rem !important;
  font-weight: inherit;
  font-family: inherit;
  text-transform: none;
  letter-spacing: inherit;
  padding-right: 2.1rem !important;
}

/* Signup modal: strict uniform field sizing/alignment */
#signupModal #signupForm .form-label{
  display: flex;
  align-items: center;
  min-height: 18px;
  margin-bottom: 6px;
}
#signupModal #signupForm .form-control,
#signupModal #signupForm .form-select,
#signupModal #signupForm .cs-trigger{
  min-height: 42px !important;
  height: 42px !important;
  line-height: 1.2;
}
#signupModal #signupForm .cs{
  width: 100%;
}

/* Do not compress the comment textarea */
#signupModal #signupForm .signup-comment .form-control{
  height: auto !important;
  min-height: 96px !important;
  line-height: 1.35;
}

/* Desktop: strict alignment for 2-column fields */
@media (min-width: 768px){
  #signupModal #signupForm .row.g-2 > .col-md-6{
    display: flex;
    flex-direction: column;
  }
  #signupModal #signupForm .row.g-2 > .col-md-6 > .form-label{
    height: 18px;
    min-height: 18px;
    max-height: 18px;
    margin-bottom: 6px;
    line-height: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: .74rem !important;
  }
  #signupModal #signupForm .signup-line-label{
    height: 18px;
    min-height: 18px;
    max-height: 18px;
  }
  #signupModal #signupForm .form-control,
  #signupModal #signupForm .form-select,
  #signupModal #signupForm .cs-trigger{
    height: 44px !important;
    min-height: 44px !important;
    box-sizing: border-box;
  }
  #signupModal #signupForm .form-select,
  #signupModal #signupForm .cs-trigger{
    font-size: .82rem !important;
  }
  #signupModal #signupForm .cs-trigger{
    padding-top: .375rem;
    padding-bottom: .375rem;
  }
}
.cs-option{
  width: 100%;
  text-align: left;
  border: 1px solid transparent;
  border-radius: 10px;
  background: transparent;
  color: var(--text-0);
  padding: .42rem .58rem;
}
.cs-option:hover{
  background: rgba(190,255,220,.08);
  border-color: rgba(190,255,220,.15);
}
.cs-option.is-selected{
  background: rgba(190,255,220,.14);
  border-color: rgba(190,255,220,.22);
}

.map-wrap{ position: relative; border-radius: 18px; overflow: hidden; }
.map-wrap.is-locked #map{
  filter: blur(2.6px) saturate(.8) brightness(.75);
}
.map-gate{
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  background: rgba(6,10,8,.55);
  backdrop-filter: blur(10px);
  border-radius: 18px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 180ms ease-out;
}
.map-wrap.is-locked .map-gate{
  opacity: 1;
  pointer-events: auto;
}
.map-gate-inner{
  text-align: center;
  padding: 14px 16px;
  border-radius: 16px;
  border: 1px solid rgba(190,255,220,.14);
  background: rgba(10,16,14,.45);
  max-width: 340px;
}
.map-gate-title{
  font-weight: 900;
  letter-spacing: .2px;
  margin-bottom: 6px;
}

.glass-select{
  background: rgba(10,16,14,.55) !important;
  border: 1px solid rgba(190,255,220,.14) !important;
  color: var(--text-0) !important;
  border-radius: 14px !important;
}

.loc-item{
  width: 100%;
  text-align: left;
  border: 1px solid rgba(190,255,220,.10);
  background: rgba(10,16,14,.40);
  border-radius: 16px;
  padding: 12px 12px;
  color: var(--text-0);
  cursor: pointer;
  transition: transform 180ms ease-out, box-shadow 180ms ease-out, border-color 180ms ease-out;
}
.loc-item + .loc-item{ margin-top: 10px; }
.loc-item:hover{
  transform: none;
  border-color: rgba(143,211,255,.22);
  box-shadow: 0 14px 28px rgba(0,0,0,.28);
}
.loc-item-title{ font-weight: 900; margin-bottom: 4px; }

.contact-pill--max .brand-badge{ background: rgba(143,211,255,.18); border-color: rgba(143,211,255,.22); }
.footer a.link-accent{ text-decoration: none; }

.media-frame .media-arrow--left{ left: 10px; }
.media-frame .media-arrow--right{ right: 10px; }

.media-title-tape{
  align-items: center;
  justify-content: center;
  text-align: center;
  width: fit-content;
  margin-left: auto;
  margin-right: auto;
  padding: 6px 14px;
  border: 1px solid #111;
  border-radius: 2px;
  background: #f2c400;
  color: #111;
  font-family: var(--ff-heading, "Russo One", sans-serif);
  font-weight: 900;
  letter-spacing: .04em;
  text-transform: uppercase;
  line-height: 1;
}

@media (min-width: 992px){
  body[data-page="index"] #media .media-card .media-frame,
  body[data-page="camps"] #campsMediaSection .media-card .media-frame{
    max-width: 520px;
    margin-left: auto;
    margin-right: auto;
  }
}

@media (min-width: 1200px){
  body[data-page="index"] #media .media-card .media-frame,
  body[data-page="camps"] #campsMediaSection .media-card .media-frame{
    max-width: 540px;
  }
}

.philo-photo{
  border-radius: 22px;
  overflow: hidden;
  border: 1px solid rgba(170,224,255,.18);
  background: rgba(8,12,10,.25);
  aspect-ratio: 16 / 10;
  display: grid;
  place-items: center;
}
.philo-photo img{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
  filter: saturate(1.05) contrast(1.02);
  opacity: .95;
}

.nav-glass{
  box-shadow: 0 10px 30px rgba(4,12,30,.28);
  border-bottom-color: rgba(190,255,220,.2);
}

.navbar .nav-link{
  position: relative;
  transition: color 180ms ease-out, transform 180ms ease-out;
}
.navbar .nav-link:hover{
  transform: translateY(-1px);
}
.navbar .nav-link::after{
  content: "";
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 4px;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(143,211,255,0), rgba(143,211,255,.95), rgba(143,211,255,0));
  opacity: 0;
  transform: scaleX(.6);
  transition: opacity 180ms ease-out, transform 180ms ease-out;
}
.navbar .nav-link:hover::after,
.navbar .nav-link.active::after{
  opacity: 1;
  transform: scaleX(1);
}

.btn-accent{
  transition: transform 180ms ease-out, box-shadow 180ms ease-out, filter 180ms ease-out !important;
}
.btn-accent:hover{
  transform: translateY(-2px);
  box-shadow: 0 18px 36px rgba(143,211,255,.28), 0 12px 24px rgba(0,0,0,.35);
}

.card-dark{
  position: relative;
  overflow: hidden;
  transition: box-shadow 220ms cubic-bezier(.2,.9,.2,1), border-color 220ms ease-out;
}
.card-dark::before{
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(120% 80% at 10% 0%, rgba(255,255,255,.44), rgba(255,255,255,0) 52%);
  opacity: .55;
  pointer-events: none;
}
.kpi-grid .card-dark:hover,
.card-dark:hover{
  transform: none;
  box-shadow: 0 24px 48px rgba(3,10,24,.28), 0 2px 0 rgba(255,255,255,.45) inset;
  border-color: rgba(255,255,255,.72);
}

.section-with-decor--steps .card-dark{
  transition: box-shadow 220ms cubic-bezier(.2,.9,.2,1), border-color 220ms ease-out, transform 220ms cubic-bezier(.2,.9,.2,1);
}
.section-with-decor--steps .card-dark:hover{
  box-shadow: 0 28px 56px rgba(3,10,24,.35), 0 2px 0 rgba(255,255,255,.55) inset;
  border-color: rgba(255,255,255,.85);
  transform: translateY(-4px);
}

.card-popular{
  position: relative;
  border: 2px solid #f0c400 !important;
  box-shadow: 0 16px 40px rgba(240,196,0,.25), 0 2px 0 rgba(255,255,255,.45) inset;
}
.card-popular::after{
  content: "";
  position: absolute;
  inset: -2px;
  border-radius: inherit;
  pointer-events: none;
  box-shadow: 0 0 24px rgba(240,196,0,.35);
}
.card-popular:hover{
  box-shadow: 0 24px 56px rgba(240,196,0,.35), 0 2px 0 rgba(255,255,255,.55) inset;
  transform: translateY(-4px);
}

.section-title{
  position: relative;
}
.section-title::after{
  content: "";
  display: block;
  width: 74px;
  height: 3px;
  margin-top: 10px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(143,211,255,.2), rgba(143,211,255,.95), rgba(143,211,255,0));
  filter: drop-shadow(0 0 12px rgba(143,211,255,.35));
}

.feature-icon{
  background: linear-gradient(180deg, rgba(216,241,255,.38), rgba(191,233,255,.28));
  border-color: rgba(143,211,255,.46);
  box-shadow: 0 12px 26px rgba(26,74,120,.18), 0 1px 0 rgba(255,255,255,.52) inset;
}

.card-image img,
.profile-media img,
.philo-photo img{
  transition: transform 320ms cubic-bezier(.2,.9,.2,1), filter 320ms ease-out;
}
.card-image:hover img,
.profile-card:hover .profile-media img,
.philo-photo:hover img{
  transform: scale(1.03);
  filter: saturate(1.1) contrast(1.04);
}

@media (prefers-reduced-motion: reduce){
  .btn-accent,
  .card-dark,
  .navbar .nav-link,
  .card-image img,
  .profile-media img,
  .philo-photo img{
    transition: none !important;
  }
}

.hero{
  position: relative;
}
.hero::after{
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(900px 520px at 8% 8%, rgba(143,211,255,.12), transparent 62%),
    radial-gradient(720px 420px at 90% 20%, rgba(143,211,255,.09), transparent 64%);
  pointer-events: none;
}

.nav-glass{
  background: rgba(8, 19, 44, .82);
  border-bottom-color: rgba(143,211,255,.24);
  box-shadow: 0 14px 34px rgba(2,8,22,.45);
}

.footer-strong{
  background: linear-gradient(180deg, rgba(8,18,40,.90), rgba(6,14,32,.92));
  border-top-color: rgba(143,211,255,.22);
}

.glass,
.quiz-modal,
.map-gate-inner,
.loc-item,
.mini-contact,
.glass-select{
  border-color: rgba(143,211,255,.24) !important;
}

.card-dark{
  border: 1px solid rgba(255,255,255,.65);
  box-shadow: 0 22px 52px rgba(4,12,30,.28), 0 1px 0 rgba(255,255,255,.55) inset;
}

.card-dark .fw-bold,
.card-dark .fw-black,
.card-dark .section-title{
  color: #17253a;
}
.card-dark .muted{
  color: rgba(26,36,51,.72);
}

.section-sub,
.muted{
  color: rgba(208,220,240,.84);
}

.pill{
  border-color: rgba(143,211,255,.34);
  background: rgba(14,28,54,.55);
  color: rgba(233,244,255,.95);
}

.stat{
  border-color: rgba(143,211,255,.22);
  background: linear-gradient(180deg, rgba(12,24,48,.58), rgba(9,18,38,.54));
}

.feature-icon{
  background: linear-gradient(180deg, rgba(232,245,255,.42), rgba(191,233,255,.30));
  border-color: rgba(143,211,255,.52);
  box-shadow: 0 12px 30px rgba(26,74,120,.18), 0 1px 0 rgba(255,255,255,.62) inset;
}

.media-arrow{
  border-color: rgba(143,211,255,.28);
  background: rgba(9,19,38,.58);
}

.brand-logo{
  filter: drop-shadow(0 16px 36px rgba(0,0,0,.42));
}

[data-page="schedule"] .lesson .pill-mini,
[data-page="schedule"] .week-grid .pill-mini{
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  line-height: 1.2;
}
[data-page="schedule"] .week-grid .lesson-note,
[data-page="schedule"] .lesson-note{
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  word-break: break-word;
}

.hero-kpis-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  width: 100%;
}

.hero-kpi-card{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  min-height: 120px;
  padding: 16px 24px;
  background: linear-gradient(180deg, #ffffff, #f5f5f5);
  border: 2px solid #111;
  border-radius: 4px;
  box-shadow: 0 4px 12px rgba(0,0,0,.08);
  transition: transform 220ms ease, box-shadow 220ms ease;
}

.hero-kpi-card:hover{
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0,0,0,.12);
}

.hero-kpi-num{
  font-weight: 950;
  font-size: 1.75rem;
  letter-spacing: -.5px;
  color: #111;
  margin-bottom: 8px;
  line-height: 1.2;
}

.hero-kpi-label{
  font-size: .9rem;
  color: #555;
  font-weight: 500;
  line-height: 1.4;
}

@media (max-width: 767.98px){
  .hero-kpis-grid{
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }

  .hero-kpi-card{
    min-height: 100px;
    padding: 12px 16px;
  }

  .hero-kpi-num{
    font-size: 1.25rem;
  }

  .hero-kpi-label{
    font-size: .75rem;
  }
}

@media (min-width: 768px) and (max-width: 991.98px){
  .hero-kpis-grid{
    gap: 14px;
  }

  .hero-kpi-card{
    min-height: 110px;
    padding: 14px 18px;
  }
}

@media (min-width: 1600px){
  .hero-kpi-card{
    min-height: 140px;
    padding: 20px 28px;
  }

  .hero-kpi-num{
    font-size: 2.2rem;
  }

  .hero-kpi-label{
    font-size: 1.05rem;
  }
}

@media (max-width: 575.98px){

  .kpi-grid .card-dark{
    padding: 12px !important;
  }

  
  .kpi-grid .feature-icon-img{
    width: 64px !important;
    height: auto !important;
  }

  
  .card-dark .fw-bold{
    font-size: 1rem !important;
  }

  
  .btn-accent,
  .btn-outline-accent{
    padding: .65rem 1rem !important;
    font-size: .95rem !important;
  }

  
  body:not(.theme-football) .hero h1{
    font-size: 1.75rem !important;
  }

  
  .kpi-grid .col-12{
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }
}

@media (min-width: 576px) and (max-width: 991.98px){
  .kpi-grid .feature-icon-img{
    width: 96px !important;
    height: auto !important;
  }

  
  body:not(.theme-football) .hero h1{
    font-size: 2.2rem !important;
  }
}

@media (min-width: 1600px){
  .section-title{
    font-size: 2.2rem !important;
  }

  .card-dark{
    padding: 28px !important;
  }

  .kpi-grid .feature-icon-img{
    width: 180px !important;
    height: auto !important;
  }

  body:not(.theme-football) .hero h1{
    font-size: 3rem !important;
  }
}

@media (min-width: 2560px){
  html{
    font-size: 18px !important;
  }

  .section-title{
    font-size: 2.6rem !important;
  }

  .card-dark{
    padding: 32px !important;
  }

  body:not(.theme-football) .hero h1{
    font-size: 3.8rem !important;
  }

  .container{
    max-width: 2200px !important;
  }
}
