/* ============================================================
   New Model School Facilities — Premium Frontend Styles v2.0
   ============================================================ */

:root {
  --nms-primary:      #5B2EFF;
  --nms-primary-mid:  #7B3CFF;
  --nms-accent:       #FF4D8D;
  --nms-white:        #FFFFFF;
  --nms-text-dark:    #1A1A1A;
  --nms-text-light:   #6B6B6B;
  --nms-shadow:       0 8px 32px rgba(91,46,255,0.10);
  --nms-shadow-hover: 0 16px 48px rgba(91,46,255,0.18);
  --nms-radius:       20px;
  --nms-transition:   all 0.32s cubic-bezier(.4,0,.2,1);
}

/* ---------- Section ---------- */
.nms-facilities-section {
  width: 100% !important;
  padding: 72px 24px !important;
  background: linear-gradient(135deg, #f0ecff 0%, #fdf0f6 55%, #eef1ff 100%) !important;
  box-sizing: border-box !important;
}

/* ---------- Header ---------- */
.nms-facilities-header {
  text-align: center !important;
  max-width: 640px !important;
  margin: 0 auto 52px !important;
}

.nms-facilities-heading {
  font-size: clamp(26px, 4vw, 38px) !important;
  font-weight: 800 !important;
  line-height: 1.22 !important;
  margin: 0 0 16px !important;
  padding: 0 !important;
  background: linear-gradient(135deg, var(--nms-primary) 0%, var(--nms-accent) 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}

.nms-facilities-subtext {
  font-size: 16px !important;
  color: var(--nms-text-light) !important;
  line-height: 1.7 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ---------- Grid ---------- */
.nms-facilities-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)) !important;
  gap: 28px !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

/* ---------- Card ---------- */
.nms-facility-card {
  background: var(--nms-white) !important;
  border-radius: var(--nms-radius) !important;
  padding: 36px 28px 32px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  box-shadow: var(--nms-shadow) !important;
  transition: var(--nms-transition) !important;
  position: relative !important;
  overflow: hidden !important;
  border: 1.5px solid rgba(91,46,255,0.07) !important;
}

.nms-facility-card::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important; left: 0 !important; right: 0 !important;
  height: 4px !important;
  background: linear-gradient(90deg, var(--nms-primary), var(--nms-accent)) !important;
  opacity: 0 !important;
  transition: var(--nms-transition) !important;
}

.nms-facility-card:hover {
  transform: translateY(-6px) !important;
  box-shadow: var(--nms-shadow-hover) !important;
  border-color: rgba(91,46,255,0.15) !important;
}

.nms-facility-card:hover::before {
  opacity: 1 !important;
}

/* ---------- Icon Wrap ---------- */
.nms-facility-icon-wrap {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 72px !important;
  height: 72px !important;
  border-radius: 50% !important;
  background: linear-gradient(135deg, var(--nms-primary) 0%, var(--nms-primary-mid) 100%) !important;
  margin-bottom: 20px !important;
  flex-shrink: 0 !important;
  box-shadow: 0 6px 20px rgba(91,46,255,0.30) !important;
  transition: var(--nms-transition) !important;
}

.nms-facility-card:hover .nms-facility-icon-wrap {
  background: linear-gradient(135deg, var(--nms-accent) 0%, #c0306e 100%) !important;
  box-shadow: 0 8px 28px rgba(255,77,141,0.40) !important;
  transform: scale(1.1) rotate(-3deg) !important;
}

/* ---------- Icon (Font Awesome <i> tag) ---------- */
.nms-facility-icon {
  font-size: 28px !important;
  color: #ffffff !important;
  line-height: 1 !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* ---------- Title ---------- */
.nms-facility-title {
  font-size: 17px !important;
  font-weight: 700 !important;
  color: var(--nms-text-dark) !important;
  margin: 0 0 10px !important;
  padding: 0 !important;
  line-height: 1.35 !important;
  transition: var(--nms-transition) !important;
}

.nms-facility-card:hover .nms-facility-title {
  color: var(--nms-primary) !important;
}

/* ---------- Description ---------- */
.nms-facility-desc {
  font-size: 14px !important;
  color: var(--nms-text-light) !important;
  line-height: 1.65 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ---------- Empty State ---------- */
.nms-no-facilities {
  text-align: center !important;
  color: var(--nms-text-light) !important;
  font-size: 15px !important;
  padding: 40px !important;
}

/* ---------- Responsive ---------- */
@media (max-width: 640px) {
  .nms-facilities-section { padding: 48px 16px !important; }
  .nms-facilities-grid    { grid-template-columns: 1fr !important; gap: 18px !important; }
  .nms-facility-card      { padding: 28px 20px 24px !important; }
  .nms-facilities-header  { margin-bottom: 36px !important; }
  .nms-facilities-heading { font-size: 26px !important; }
}

@media (min-width: 641px) and (max-width: 900px) {
  .nms-facilities-grid { grid-template-columns: repeat(2, 1fr) !important; }
}