/* =============================================================================
   landing-icsemiraroad.css — ICSE / Mira Road overrides on the shared landing
   skeleton (landing.css). Band colours match the landing.css defaults (welcome
   #2fa59f, enquiry #44ACAF, awards #EA4E5C, testimonials #EBA82F, achievements
   #ECF5F3), so only this page's extra sections + a couple of tints need styles.
   Values from this page's generated CSS (post-380.css) where they differ.
   ============================================================================= */

/* Curriculum title tint (9622bfe) + this page has a 4-tab curriculum. */
.kk-landing--icsemiraroad .kk-lcur__title { color: #45ACAF; }
.kk-landing--icsemiraroad .kk-lcur__gradeband { margin-top: 26px; }
.kk-landing--icsemiraroad .kk-lcur__gradeband h3 { font-size: 22px; font-weight: 700; color: #1C1C1C; margin-bottom: 2px; }
.kk-landing--icsemiraroad .kk-lcur__age { font-size: 15px; font-weight: 600; color: #45ACAF; margin: 0 0 10px; }
.kk-landing--icsemiraroad .kk-lcur__gb-media { margin: 12px 0; }
.kk-landing--icsemiraroad .kk-lcur__gb-media img { width: 100%; border-radius: var(--kk-radius-md); }

/* -- "What Sets KIS Apart": pure-CSS 3D flip cards (kk-flip) ------------------- */
.kk-kisapart { padding: 60px 0 80px; }
.kk-kisapart__title { text-align: center; font-size: 35px; font-weight: 700; text-transform: uppercase; color: #45ACAF; }
.kk-kisapart__divider { width: 30%; margin: 10px auto 26px; border: 0; border-top: 2px solid #B98E7F; }
.kk-kisapart__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
@media (max-width: 767px) { .kk-kisapart__grid { grid-template-columns: 1fr; } }

.kk-flip { perspective: 1200px; height: 320px; }
.kk-flip__inner {
    position: relative; width: 100%; height: 100%;
    transition: transform .6s; transform-style: preserve-3d;
}
.kk-flip:hover .kk-flip__inner, .kk-flip:focus .kk-flip__inner, .kk-flip:focus-within .kk-flip__inner { transform: rotateY(180deg); }
.kk-flip:focus-visible { outline: 2px solid #45ACAF; outline-offset: 3px; }
.kk-flip__face {
    position: absolute; inset: 0; backface-visibility: hidden; -webkit-backface-visibility: hidden;
    border-radius: 12px; padding: 22px; display: flex; flex-direction: column;
    align-items: center; justify-content: center; text-align: center; overflow: hidden;
}
/* Front = photo (from the Elementor flip-box) under a dark overlay so the white
   icon + title stay readable. Per-card background-image below; the background-color
   is a fallback if a photo ever fails to load. */
.kk-flip__front { color: #fff; gap: 16px; background-color: #45ACAF; background-size: cover; background-position: center center; }
.kk-flip__front::before { content: ""; position: absolute; inset: 0; background: rgba(0, 0, 0, .42); }
.kk-flip__front > * { position: relative; z-index: 1; }
.kk-flip__front h3 { font-size: 20px; font-weight: 700; color: #fff; }
.kk-flip__icon { width: 54px; height: 54px; fill: #fff; }
.kk-flip__back { transform: rotateY(180deg); background: #fff; border: 2px solid #45ACAF; align-items: flex-start; justify-content: flex-start; overflow-y: auto; }
.kk-flip__back p { font-size: 12.5px; line-height: 1.55; color: #333; text-align: left; margin: 0 0 8px; }
/* per-card front photo (source: post-380.css flip-box fronts) + fallback tint */
.kk-flip--food .kk-flip__front { background-color: #45ACAF; background-image: url("/wp-content/uploads/2024/12/DSC09262-1.webp"); }
.kk-flip--counsellor .kk-flip__front { background-color: #EA4E5C; background-image: url("/wp-content/uploads/2024/12/WhatsApp-Image-2024-12-16-at-10.22.37-AM.webp"); }
.kk-flip--special .kk-flip__front { background-color: #EBA82F; background-image: url("/wp-content/uploads/2024/12/WhatsApp-Image-2024-12-16-at-10.22.36-AM-1.webp"); }
.kk-flip--infirmary .kk-flip__front { background-color: #6C7BA8; background-image: url("/wp-content/uploads/2024/12/WhatsApp-Image-2024-12-16-at-10.22.35-AM-1.webp"); }
.kk-flip--library .kk-flip__front { background-color: #2fa59f; background-image: url("/wp-content/uploads/2024/12/C3284T01.webp"); }
.kk-flip--stream .kk-flip__front { background-color: #B98E7F; background-image: url("/wp-content/uploads/2024/12/2N9A5904-copy.webp"); }
.kk-flip--horticulture .kk-flip__front { background-color: #5FA85A; background-image: url("/wp-content/uploads/2024/12/DSC07687.webp"); }
.kk-flip--playlab .kk-flip__front { background-color: #D06BA0; background-image: url("/wp-content/uploads/2025/08/Play-Lab_5_11zon.webp"); }
.kk-flip--counsellor .kk-flip__back, .kk-flip--counsellor .kk-flip__back p { border-color: #EA4E5C; }
.kk-flip--special .kk-flip__back { border-color: #EBA82F; }
.kk-flip--infirmary .kk-flip__back { border-color: #6C7BA8; }
.kk-flip--library .kk-flip__back { border-color: #2fa59f; }
.kk-flip--stream .kk-flip__back { border-color: #B98E7F; }
.kk-flip--horticulture .kk-flip__back { border-color: #5FA85A; }
.kk-flip--playlab .kk-flip__back { border-color: #D06BA0; }

/* -- "Our exceptional results": stats + result-chart carousel ----------------- */
.kk-results { padding: 60px 0; }
.kk-results__cols { display: flex; gap: 40px; align-items: center; }
.kk-results__body { flex: 1 1 0; min-width: 0; }
.kk-results__body h2 { font-size: 30px; font-weight: 700; text-transform: uppercase; color: #2A2A2A; }
.kk-results__intro { font-size: 15px; font-weight: 500; line-height: 26px; color: #1D1D1D; margin: 10px 0 16px; }
.kk-results__media { flex: 1 1 0; min-width: 0; }
.kk-results .kk-carousel { --kk-carousel-per: 1; --kk-carousel-per-tablet: 1; --kk-carousel-per-mobile: 1; }
.kk-results .kk-carousel__track img { width: 100%; border-radius: var(--kk-radius-md); }
@media (max-width: 900px) { .kk-results__cols { flex-direction: column; } }

/* -- "Life at KIS" image gallery ---------------------------------------------- */
.kk-lifegallery { background: #F5F5F5; padding: 60px 0 80px; }
.kk-lifegallery__title { text-align: center; font-size: 35px; font-weight: 700; text-transform: uppercase; color: #45ACAF; margin-bottom: 0; }
.kk-lifegallery__divider { width: 30%; margin: 10px auto 26px; border: 0; border-top: 2px solid #B98E7F; }
.kk-lifegallery .kk-gallery { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 1024px) { .kk-lifegallery .kk-gallery { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 767px)  { .kk-lifegallery .kk-gallery { grid-template-columns: repeat(2, 1fr); } }

/* -- Alumni band (#44ACAF) — same testimonial carousel treatment -------------- */
.kk-alumni { background: #44ACAF; padding: 60px 0 80px; }
.kk-alumni__title { text-align: center; font-size: 35px; font-weight: 700; text-transform: uppercase; color: #fff; }
.kk-alumni .kk-carousel {
    /* gap under the heading — on the carousel because the .kk-landing h1/h2/h3
       reset zeroes the title's own margin. */
    margin-top: 40px;
    --kk-carousel-per: 2; --kk-carousel-per-tablet: 2; --kk-carousel-per-mobile: 1; --kk-carousel-gap: 10px;
    --kk-carousel-dot: rgba(255,255,255,.45); --kk-carousel-dot-active: #fff;
}
@media (max-width: 767px) { .kk-alumni__title { font-size: 30px; } }
