/* =============================================================================
   landing-ibchembur.css — Kanakia International School (IB), Chembur overrides
   + extra sections on the shared landing skeleton (landing.css). Values copied
   from this page's generated Elementor CSS (post-131.css), not eyeballed.
   Everything is scoped under .kk-landing--ibchembur.

   The band colour variables (--kkl-accent #44ACAF, welcome #2fa59f, enquiry
   #44ACAF, awards #EA4E5C, testimonials #EBA82F, achievements #ECF5F3,
   frame #B98E7F) all match the landing.css defaults on this page, so none are
   overridden.
   ============================================================================= */

/* -- Curriculum tab panels: age line under each panel heading (c765b98). ------ */
.kk-landing--ibchembur .kk-lcur__age {
    margin-top: -12px; padding-left: 12px;
    font-size: 16px; font-weight: 500; color: #404040;
}

/* -- Facilities & amenities video band: taller than the hero default
      (42af71c: 600px desktop / 400px tablet; mobile 200px already matches
      the skeleton default). -------------------------------------------------- */
.kk-hero--facilities { min-height: 600px; }
@media (max-width: 1024px) { .kk-hero--facilities { min-height: 400px; } }

/* -- IB Co-Curricular Activities: section heading + divider (306bb1a heading
      29px/700 uppercase #45ACAF, left-aligned on desktop, centred <=767;
      3aabc0f divider 22% wide, 2px solid #B98E7F). --------------------------- */
.kk-cocur { padding: 60px 0; }
.kk-cocur__title { font-size: 29px; font-weight: 700; text-transform: uppercase; color: #45ACAF; }
.kk-cocur__divider { width: 22%; margin: 8px 0 30px; border: 0; border-top: 2px solid var(--kkl-frame); }
@media (max-width: 767px) {
    .kk-cocur__title { text-align: center; font-size: 25px; }
    .kk-cocur__divider { margin: 8px auto 30px; }
}

/* -- Co-curricular flip cards: pure-CSS 3D flip (no elementor-flip-box__face
      wrapper in this school's markup, so front/back themselves carry the
      absolute-position + backface-visibility mechanics). Each card's front is
      a photo (per-card background-image below, from the b471e80-family
      widgets) with a dark overlay (#1717177A) behind the icon + title
      (#EEE6E6, 18px/700); the back is the flat accent colour (#45ACAF) with
      a 14px/400 description (border-radius 15px on both faces throughout). */
.kk-cocur__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
@media (max-width: 1024px) { .kk-cocur__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px)  { .kk-cocur__grid { grid-template-columns: 1fr; } }

.kk-flip { perspective: 1200px; height: 300px; }
.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__front, .kk-flip__back {
    position: absolute; inset: 0; backface-visibility: hidden; -webkit-backface-visibility: hidden;
    border-radius: 15px; padding: 22px; display: flex; flex-direction: column;
    align-items: center; justify-content: flex-end; text-align: center; overflow: hidden;
    background-position: center center; background-repeat: no-repeat; background-size: cover;
}
.kk-flip__front {
    color: #EEE6E6; gap: 14px;
    background-color: #1C1C1C; /* fallback under the photo while it loads */
    box-shadow: inset 0 0 0 999px rgba(23, 23, 23, .48); /* #1717177A overlay */
}
.kk-flip__front .kk-flip__title { color: #EEE6E6; font-size: 18px; font-weight: 700; }
.kk-flip__icon { width: 46px; height: 46px; fill: #fff; }
.kk-flip__back {
    transform: rotateY(180deg); justify-content: center;
    background: #45ACAF; border: 2px solid #45ACAF;
}
.kk-flip__back p { font-size: 14px; font-weight: 400; line-height: 1.5; color: #fff; margin: 0; }
/* per-card front photo (b471e80, febc700, 7cb7b69, ccfe9c1, a60b097, 36cb0fa, e5b22fe, 57612a0) */
.kk-flip--guardians .kk-flip__front { background-image: url("/wp-content/uploads/2025/07/Horticulture.png"); }
.kk-flip--atelier .kk-flip__front { background-image: url("/wp-content/uploads/2025/07/KanakiaAtelier.webp"); }
.kk-flip--studio .kk-flip__front { background-image: url("/wp-content/uploads/2025/07/KanakiaStudio-1.webp"); }
.kk-flip--sparc .kk-flip__front { background-image: url("/wp-content/uploads/2025/07/KanakiaSPARC2.webp"); }
.kk-flip--culinary .kk-flip__front { background-image: url("/wp-content/uploads/2025/07/unnamed-1.png"); }
.kk-flip--scholastics .kk-flip__front { background-image: url("/wp-content/uploads/2025/07/KanakiaScholastics.webp"); }
.kk-flip--kpulse .kk-flip__front { background-image: url("/wp-content/uploads/2025/07/K-Pulse-1.webp"); }
.kk-flip--kasa .kk-flip__front { background-image: url("/wp-content/uploads/2025/07/KASA-KanakiaAfterSchoolActivities.webp"); }

/* -- Life at Kanakia International School: heading + divider (a24705e heading
      29px/700 uppercase #0F0F0F, left-aligned on desktop / centred <=767,
      25px <=1024; 6f4948b divider 35% wide, 2px solid #B98E7F) plus the
      accordion body's video+text row (6c7c461/4c8ef0a/c9dea49, even split)
      and copy (7acd841: 15px/400, line-height 25px, letter-spacing .2px,
      word-spacing 2px, #474747; 14px <=1024; 13px/22px <=767). ------------- */
.kk-life { background: #fff; padding: 50px 0; }
.kk-life__title { font-size: 29px; font-weight: 700; text-transform: uppercase; color: #0F0F0F; }
.kk-life__divider { width: 35%; margin: 8px 0 20px; border: 0; border-top: 2px solid var(--kkl-frame); }
@media (max-width: 1024px) { .kk-life__title { font-size: 25px; } }
@media (max-width: 767px) {
    .kk-life__title { text-align: center; }
    .kk-life__divider { margin: 8px auto 20px; }
}

.kk-life__media-row { display: flex; gap: 30px; align-items: flex-start; margin-bottom: 20px; }
.kk-life__media-row .kk-video { flex: 1 1 0; min-width: 0; border-radius: 10px; }
.kk-life__media-row .kk-life__text { flex: 1 1 0; min-width: 0; margin-bottom: 0; }
.kk-life .kk-carousel { margin-top: 20px; }
.kk-life .kk-carousel + .kk-life__text { margin-top: 20px; }
.kk-life__text {
    font-size: 15px; font-weight: 400; line-height: 25px;
    letter-spacing: .2px; word-spacing: 2px; color: #474747;
}
.kk-life__text p { margin: 0 0 12px; }
.kk-life__text p:last-child { margin-bottom: 0; }
@media (max-width: 1024px) {
    .kk-life__media-row { flex-direction: column; }
    .kk-life__text { font-size: 14px; }
}
@media (max-width: 767px) { .kk-life__text { font-size: 13px; line-height: 22px; } }

/* -- Alumni band: Univariety stats iframe (inline style stripped in the
      partial; border:none / vertical-align:top reproduced here as a class)
      + the "Register as an Alumni" CTA (1f6ed1a — already the shared
      kk-landing__btn accent style, just needs its own spacing). ------------ */
.kk-alumni { padding: 40px 0 60px; }
.kk-alumni__stats { display: block; width: 100%; border: 0; vertical-align: top; }
.kk-alumni__cta { text-align: center; margin-top: 40px; }

/* -- IBDP Scholarship Programme (9dde7ba row, 60/60 pad; ba8074b text col
      52.684% wide >=768, full width + 20px top pad <=767; 95c924e heading
      25px/600 uppercase #2A2A2A, line-height 30px; body copy 16px/500 #222
      matching the admission-process intro convention; 5da4fef banner image
      radius 10px, 60px top offset, 188px tall cropped bottom-centre —
      214px <=767). ------------------------------------------------------- */
.kk-scholarship { padding: 60px 0; }
.kk-scholarship__cols { display: flex; gap: 0; }
.kk-scholarship__body {
    flex: 0 0 52.684%; min-width: 0; padding-top: 20px;
    display: flex; flex-direction: column; justify-content: center;
}
.kk-scholarship__body h2 { font-size: 25px; font-weight: 600; text-transform: uppercase; color: #2A2A2A; line-height: 30px; margin-bottom: 14px; }
.kk-scholarship__body p { font-size: 16px; font-weight: 500; line-height: 27px; letter-spacing: .5px; color: #222; margin: 0; }
.kk-scholarship__media { flex: 1 1 0; min-width: 0; }
.kk-scholarship__media img {
    width: 100%; height: 188px; object-fit: cover; object-position: bottom center;
    border-radius: 10px; margin-top: 60px;
}
@media (max-width: 767px) {
    .kk-scholarship__cols { flex-direction: column; }
    .kk-scholarship__body { flex-basis: auto; padding: 20px 20px 0; }
    .kk-scholarship__body p { font-size: 14px; line-height: 24px; }
    .kk-scholarship__media img { height: 214px; }
}

/* -- Job-openings band: empty in the source (menu-anchor target only) and
      hidden on the school domain via kk-tenant-hide; just needs to not
      collapse to a jarring seam on the main site. ------------------------- */
.kk-jobs { padding: 60px 0; }

/* -- Cross-section divider (used before Scholarship and twice after Social;
      72d4ecf/8e14f70 family: 2px solid #B98E7F, width varies 22–81% per
      instance — a middling 40% reads fine in every spot it's reused). ------ */
.kk-landing__divider { width: 40%; margin: 0 auto; border: 0; border-top: 2px solid var(--kkl-frame); }