/* Curriculum styles migrated from React */
.curric-section-cartoon {
  max-width: 1100px;
  margin: 48px auto;
  padding: 38px 18px 55px;
  background: linear-gradient(132deg, #fafeff 60%, #e5effe 100%);
  border-radius: 38px;
  box-shadow: 0 14px 48px 6px #99caf029;
  text-align: center;
  font-family: 'Baloo 2', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  color: #24325e;
  position: relative;
}

.curric-title { font-size: 2.8rem; font-weight: 900; margin-bottom: 14px; color: #2368ac; text-transform: uppercase; letter-spacing: 0.04em; font-family: 'Baloo 2', cursive, 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; text-shadow: 0 2px 8px #e6eefb6e; }

.curric-quote { font-style: italic; font-weight: 700; font-size: 1.27rem; background: linear-gradient(90deg, #e2f1fd 68%, #f2fbff 100%); border-radius: 17px; margin: 18px auto 28px; color: #368adb; max-width: 570px; line-height: 1.6; padding: 13px; box-shadow: 0 3px 18px #b8dffc21; }

.curric-desc { font-size: 1.12rem; max-width: 720px; margin: 0 auto 38px; line-height: 1.65; font-weight: 600; color: #3975ae; }

.curric-flipcard-grid { display: flex; justify-content: center; gap: 42px; flex-wrap: wrap; margin-top: 20px; }
.curric-flipcard { width: 176px; height: 210px; background: #fff; border-radius: 48% 52% 58% 42% / 62% 38% 60% 55%; box-shadow: 0 11px 36px 0 #2274d612, 0 1.5px 0 #fffbe5; margin-bottom: 20px; perspective: 1100px; transition: box-shadow 0.34s, transform 0.15s; outline: none; cursor: pointer; position: relative; }
.curric-flipcard:focus, .curric-flipcard:hover { box-shadow: 0 24px 58px #a3dbff52, 0 4px 0 #fffbe5; transform: translateY(-9px) scale(1.07) rotate(-2deg); z-index: 2; }

.curric-flipcard-inner { width: 100%; height: 100%; border-radius: inherit; transition: transform 0.92s cubic-bezier(.23,1.44,.41,1.13); transform-style: preserve-3d; position: relative; }
.curric-flipcard:hover .curric-flipcard-inner, .curric-flipcard:focus .curric-flipcard-inner { transform: rotateY(180deg); }

.curric-flipcard-front, .curric-flipcard-back { border-radius: inherit; position: absolute; width: 100%; height: 100%; backface-visibility: hidden; display: flex; flex-direction: column; align-items: center; justify-content: center; box-sizing: border-box; font-family: 'Baloo 2', 'Segoe UI', Arial, sans-serif; padding: 0 10px; }
.curric-flipcard-front { z-index: 2; background: none; animation: jellyWobble 9s infinite; }

.curric-icon-blob { font-size: 2.65rem; background: #fff; border-radius: 51% 61% 44% 56% / 55% 42% 58% 45%; box-shadow: 0 4px 25px #bae7ff3a; margin-bottom: 15px; padding: 18px 18px 14px 18px; display: flex; align-items: center; justify-content: center; line-height: 1; border: 4px solid transparent; animation: iconFloat 3.3s infinite cubic-bezier(.86,-0.2,.04,1.14); transition: border 0.33s; }
.curric-flipcard:hover .curric-icon-blob, .curric-flipcard:focus .curric-icon-blob { border-color: #5bd1ff; }

.curric-flipcard-label { font-size: 1.12rem; letter-spacing: 0.02em; color: #2570d6; font-family: 'Baloo 2', cursive; font-weight: 800; text-align: center; }
.curric-flipcard-back { background: linear-gradient(120deg, #f7fbff 73%, #e5f2fd 100%); color: #3158b1; transform: rotateY(180deg); padding: 24px 14px 14px 14px; z-index: 3; font-size: 1.07rem; font-weight: 600; justify-content: center; }
.curric-flipcard-desc { font-family: 'Baloo 2', 'Segoe UI', Arial, sans-serif; color: #27457a; text-align: center; font-size: 1.09rem; line-height: 1.54; font-weight: 600; }

.area-academics .curric-icon-blob { color: #2876c6; border-color: #ace7ff; background: linear-gradient(120deg, #e6f1fa 72%, #ceeaff 100%); }
.area-arts .curric-icon-blob { color: #ed8a63; border-color: #ffd0dd; background: linear-gradient(120deg, #ffe6d2 72%, #ffd0dd 100%); }
.area-sports .curric-icon-blob { color: #39b97d; border-color: #d4fae1; background: linear-gradient(120deg, #d4fae1 72%, #cbeaff 100%); }
.area-global .curric-icon-blob { color: #ffbe5e; border-color: #ffe7aa; background: linear-gradient(120deg, #fff9e1 72%, #fbe8a3 100%); }
.area-holistic .curric-icon-blob { color: #c678ed; border-color: #ecd5ff; background: linear-gradient(120deg, #f4ddff 72%, #f8e7fd 100%); }

@keyframes iconFloat { 0%, 100% { transform: translateY(0);} 18% { transform: translateY(-6px);} 38% { transform: translateY(4px);} 53% { transform: translateY(-5px);} 70% { transform: translateY(2px);} 83% { transform: translateY(-8px);} 95% { transform: translateY(0);} }
@keyframes jellyWobble { 0%, 100% { transform: none;} 16% { transform: scale(1.04,0.97) } 20% { transform: scale(1,1.03) } 24% { transform: scale(0.95,1.05) } 30% { transform: scale(1.04,0.97) } 39% { transform: scale(1,1) } }

@media (max-width: 980px) { .curric-flipcard-grid { gap: 16px; } .curric-flipcard { width: 46vw; max-width: 228px; height: 165px; } }
@media (max-width: 620px) { .curric-flipcard-grid { flex-direction: column; gap: 14px; align-items: center; } .curric-flipcard { width: 96vw; max-width: 300px; height: 170px; } .curric-title { font-size: 1.28rem; } .curric-desc { font-size: 0.98rem; } .curric-flipcard-label { font-size: 1rem; } }