/*==============================================
   KIMST brand balance
   The crest is mostly red with green laurels, so the pages should use BOTH colours, not green with red as a trim.
   This one file decides where red leads and where green leads. Delete it (and its <link>) to go back to green-led.

   Red   = crest red  #D02010   (deep #8F1409 / #B51A0C, light #E5483A, tint #FFD9D2)
   Green = crest green #108543

   Home page rhythm (top to bottom):
     top bar RED  |  hero GREEN  |  mission cards RED/GREEN/RED  |  about RED-led  |  notices GREEN + director RED
     why-choose GREEN/RED cards  |  numbers band RED  |  courses RED-led  |  testimonials GREEN-led  |  footer dark, red accents
===============================================*/

/*---------- Site-wide: top bar (the footer's colours live in footer.css) ----------*/

.kh-topbar {
    background: linear-gradient(90deg, #8f1409 0%, #b51a0c 55%, #d02010 100%);
    color: rgba(255, 255, 255, .92);
}

.kh-topbar__contact i {
    color: #ffd9d2;
}

.kh-topbar .kh-social a:hover {
    background: #fff;
    color: #d02010;
}

/*---------- Home: hero ----------*/

body.is-home .kh-hero__card::before {
    border-color: rgba(255, 122, 104, .55);
}

/*---------- Home: mission cards (red / green / red) ----------*/

body.is-home .kh-pillar--ink {
    --accent: #d02010;
    --accent-2: #e5483a;
    --glow: rgba(208, 32, 16, .3);
    --line: rgba(208, 32, 16, .35);
}

/*---------- Home: about (red-led) ----------*/

body.is-home .kh-about::before {
    background: radial-gradient(circle, rgba(208, 32, 16, .07), transparent 68%);
}

body.is-home .kh-about__title em {
    color: #d02010;
}

body.is-home .kh-about__media::before {
    border-color: rgba(208, 32, 16, .3);
}

body.is-home .kh-about__badge {
    background: linear-gradient(135deg, #e5483a, #b51a0c);
    box-shadow: 0 16px 34px rgba(208, 32, 16, .35);
}

/*---------- Home: notices (green header) + director (red card) ----------*/

body.is-home .kh-director {
    background:
        radial-gradient(520px 320px at 100% 0%, rgba(255, 140, 118, .5), transparent 65%),
        linear-gradient(135deg, #8f1409 0%, #b51a0c 55%, #d02010 100%);
    box-shadow: 0 30px 60px rgba(160, 20, 8, .28);
}

body.is-home .kh-director__role,
body.is-home .kh-director__eyebrow i {
    color: #ffd9d2;
}

/* the button was red, which vanishes on a red card: white with red text instead */
body.is-home .kh-director a.kh-director__btn {
    background: #fff;
    color: #b51a0c;
    box-shadow: 0 12px 28px rgba(0, 0, 0, .22);
}

body.is-home .kh-director a.kh-director__btn:hover {
    background: #fff3f1;
    color: #a8180c;
}

/*---------- Home: why choose us (green / red checkerboard) ----------*/

body.is-home .kh-feature:nth-child(odd) {
    --accent: #108543;
    --accent-2: #2bb86b;
    --glow: rgba(16, 133, 67, .3);
    --line: rgba(16, 133, 67, .4);
}

body.is-home .kh-feature:nth-child(even) {
    --accent: #d02010;
    --accent-2: #e5483a;
    --glow: rgba(208, 32, 16, .3);
    --line: rgba(208, 32, 16, .35);
}

body.is-home .kh-why__photo::before {
    border-color: rgba(208, 32, 16, .3);
}

/*---------- Home: numbers band (red) ----------*/

body.is-home .kh-stats {
    background:
        radial-gradient(700px 320px at 8% 0%, rgba(255, 160, 140, .3), transparent 62%),
        radial-gradient(640px 300px at 100% 100%, rgba(110, 8, 3, .55), transparent 62%),
        linear-gradient(120deg, #9c1509 0%, #bd1c0d 55%, #d02010 100%);
}

body.is-home .kh-stat::before {
    background: linear-gradient(90deg, transparent, #ffd9d2, transparent);
}

body.is-home .kh-stat__icon {
    color: #d02010;
}

body.is-home .kh-stat__plus {
    color: #ffd9d2;
}

body.is-home .kh-stats p.kh-stat__label {
    color: rgba(255, 255, 255, .94);
}

/*---------- Home: courses (red-led, warm tint) ----------*/

body.is-home .kh-courses {
    background: #fdf4f2;
}

body.is-home .kh-courses::before {
    background: radial-gradient(circle, rgba(208, 32, 16, .08), transparent 68%);
}

body.is-home .kh-courses::after {
    background: radial-gradient(circle, rgba(16, 133, 67, .07), transparent 68%);
}

body.is-home .kh-courses__title em {
    color: #d02010;
}

body.is-home .kh-courses__ctrl {
    border-color: #d02010;
    color: #b51a0c;
}

body.is-home .kh-courses__ctrl:hover:not(:disabled) {
    background: #d02010;
    color: #fff;
}

body.is-home .kh-courses__ctrl:disabled {
    border-color: #e3eae5;
    color: #9aa8a0;
}

body.is-home .kh-course__arrow {
    background: #d02010;
    box-shadow: 0 10px 22px rgba(208, 32, 16, .35);
}

/* swapped: hover turns the arrow to the logo's green */
body.is-home .kh-course:hover .kh-course__arrow,
body.is-home .kh-course:focus-within .kh-course__arrow {
    background: #108543;
    box-shadow: 0 10px 22px rgba(16, 133, 67, .35);
}

body.is-home .kh-course:hover,
body.is-home .kh-course:focus-within {
    border-color: rgba(208, 32, 16, .35);
}

body.is-home .kh-course:hover h3.kh-course__title {
    color: #b51a0c;
}

body.is-home .kh-courses__progress {
    background: rgba(208, 32, 16, .16);
}

body.is-home .kh-courses__progress span {
    background: linear-gradient(90deg, #d02010, #e5483a);
}

/*---------- Home: testimonials (green-led, red touches) ----------*/

body.is-home .kh-testi__fill {
    background: #d02010;
}

body.is-home .kh-testi__count b {
    color: #d02010;
}
