/* =====================================================================
   Home page "color boost" — adds a lively multi-colour palette on top
   of the existing blue/orange brand colours without changing structure.
   Loaded after instopedia-home.css so these rules win.
===================================================================== */

/* ---------- Section backgrounds: soft colour washes ---------- */
.ip-course-section{
  position:relative;
  background:radial-gradient(circle at 90% 0%,rgba(237,114,38,.08),transparent 45%),
             radial-gradient(circle at 4% 100%,rgba(34,51,92,.07),transparent 40%),
             linear-gradient(180deg,#fbfdff 0%,#f6faff 100%);
}
.ip-city-section{
  position:relative;
  background:radial-gradient(circle at 6% 10%,rgba(13,148,136,.08),transparent 40%),
             radial-gradient(circle at 96% 90%,rgba(237,114,38,.08),transparent 42%),
             linear-gradient(180deg,#f7faff 0%,#eef8f6 100%) !important;
}
.ip-feature-section{
  background:linear-gradient(180deg,#ffffff 0%,#fff8f1 100%);
}
.ip-section.ip-section-soft{
  background:radial-gradient(circle at 92% 8%,rgba(124,58,237,.06),transparent 40%),
             radial-gradient(circle at 2% 92%,rgba(13,148,136,.07),transparent 40%),
             linear-gradient(180deg,#f7faff 0%,#f3f7fc 100%) !important;
}

/* ---------- Explore by Courses: colourful icon cycle ---------- */
.ip-course-carousel .row > div:nth-child(4n+1) .ip-course-icon{background:linear-gradient(135deg,#eaf2ff,#dbe9ff);color:#22335C}
.ip-course-carousel .row > div:nth-child(4n+2) .ip-course-icon{background:linear-gradient(135deg,#fff3ea,#ffe1c2);color:#ED7226}
.ip-course-carousel .row > div:nth-child(4n+3) .ip-course-icon{background:linear-gradient(135deg,#e6fbf8,#c9f4ec);color:#0d9488}
.ip-course-carousel .row > div:nth-child(4n+4) .ip-course-icon{background:linear-gradient(135deg,#f5edff,#e6d4ff);color:#7c3aed}
.ip-course-carousel .row > div:nth-child(4n+1) .ip-course-card:hover .ip-course-icon{background:linear-gradient(135deg,#22335C,#3A5A95);color:#fff}
.ip-course-carousel .row > div:nth-child(4n+2) .ip-course-card:hover .ip-course-icon{background:linear-gradient(135deg,#ED7226,#F5943F);color:#fff}
.ip-course-carousel .row > div:nth-child(4n+3) .ip-course-card:hover .ip-course-icon{background:linear-gradient(135deg,#0d9488,#14b8a6);color:#fff}
.ip-course-carousel .row > div:nth-child(4n+4) .ip-course-card:hover .ip-course-icon{background:linear-gradient(135deg,#7c3aed,#9b6bf0);color:#fff}

/* ---------- Browse by City: colourful icon cycle ---------- */
.ip-city-carousel .row > div:nth-child(4n+1) .ip-city-icon,
.row > div:nth-child(4n+1) .ip-city-icon{background:linear-gradient(135deg,#eaf2ff,#dbe9ff);color:#22335C}
.ip-city-carousel .row > div:nth-child(4n+2) .ip-city-icon,
.row > div:nth-child(4n+2) .ip-city-icon{background:linear-gradient(135deg,#fff3ea,#ffe1c2);color:#ED7226}
.ip-city-carousel .row > div:nth-child(4n+3) .ip-city-icon,
.row > div:nth-child(4n+3) .ip-city-icon{background:linear-gradient(135deg,#e6fbf8,#c9f4ec);color:#0d9488}
.ip-city-carousel .row > div:nth-child(4n+4) .ip-city-icon,
.row > div:nth-child(4n+4) .ip-city-icon{background:linear-gradient(135deg,#f5edff,#e6d4ff);color:#7c3aed}

/* ---------- Why InstoPedia: colourful icon cycle + top accent ---------- */
.ip-why-card{position:relative}
.row > .col-sm-6.col-lg-3:nth-child(4n+1) .ip-why-icon{background:linear-gradient(135deg,#eaf2ff,#dbe9ff);color:#22335C}
.row > .col-sm-6.col-lg-3:nth-child(4n+2) .ip-why-icon{background:linear-gradient(135deg,#fff3ea,#ffe1c2);color:#ED7226}
.row > .col-sm-6.col-lg-3:nth-child(4n+3) .ip-why-icon{background:linear-gradient(135deg,#e6fbf8,#c9f4ec);color:#0d9488}
.row > .col-sm-6.col-lg-3:nth-child(4n+4) .ip-why-icon{background:linear-gradient(135deg,#f5edff,#e6d4ff);color:#7c3aed}
.row > .col-sm-6.col-lg-3:nth-child(4n+1) .ip-why-card::before{background:linear-gradient(90deg,#22335C,#3A5A95)}
.row > .col-sm-6.col-lg-3:nth-child(4n+2) .ip-why-card::before{background:linear-gradient(90deg,#ED7226,#F5943F)}
.row > .col-sm-6.col-lg-3:nth-child(4n+3) .ip-why-card::before{background:linear-gradient(90deg,#0d9488,#14b8a6)}
.row > .col-sm-6.col-lg-3:nth-child(4n+4) .ip-why-card::before{background:linear-gradient(90deg,#7c3aed,#9b6bf0)}

/* ---------- Student Reviews: colourful avatar + top edge ---------- */
.ip-review-card{position:relative;overflow:hidden}
.ip-review-card::before{content:"";position:absolute;top:0;left:0;right:0;height:4px}
.row > .col-md-6.col-lg-4:nth-child(3n+1) .ip-review-card::before{background:linear-gradient(90deg,#22335C,#3A5A95)}
.row > .col-md-6.col-lg-4:nth-child(3n+2) .ip-review-card::before{background:linear-gradient(90deg,#ED7226,#F5943F)}
.row > .col-md-6.col-lg-4:nth-child(3n+3) .ip-review-card::before{background:linear-gradient(90deg,#0d9488,#14b8a6)}
.row > .col-md-6.col-lg-4:nth-child(3n+1) .ip-avatar{background:linear-gradient(135deg,#eaf2ff,#dbe9ff);color:#22335C}
.row > .col-md-6.col-lg-4:nth-child(3n+2) .ip-avatar{background:linear-gradient(135deg,#fff3ea,#ffe1c2);color:#ED7226}
.row > .col-md-6.col-lg-4:nth-child(3n+3) .ip-avatar{background:linear-gradient(135deg,#e6fbf8,#c9f4ec);color:#0d9488}

/* ---------- How It Works: 3 distinct colours ---------- */
.row > .col-md-4:nth-child(3n+1) .ip-step-num{background:linear-gradient(135deg,#22335C,#3A5A95);box-shadow:0 15px 30px rgba(34,51,92,.25)}
.row > .col-md-4:nth-child(3n+2) .ip-step-num{background:linear-gradient(135deg,#ED7226,#F5943F);box-shadow:0 15px 30px rgba(237,114,38,.25)}
.row > .col-md-4:nth-child(3n+3) .ip-step-num{background:linear-gradient(135deg,#0d9488,#14b8a6);box-shadow:0 15px 30px rgba(13,148,136,.25)}

/* ---------- Kicker badges: alternate accent tint per section ---------- */
.ip-city-section .ip-kicker{color:#0d9488}
.ip-section.ip-section-soft .ip-kicker{color:#7c3aed}

/* ---------- FAQ accordion: colourful active state ---------- */
.ip-faq .accordion-button:not(.collapsed){background:linear-gradient(90deg,#eef2ff,#f7faff);color:#22335C;box-shadow:inset 3px 0 0 #ED7226}

/* ---------- Featured institutes badge ---------- */
.ip-feature-badge{background:linear-gradient(135deg,#fff3ea,#ffe1c2)!important;color:#ED7226!important;border-color:#ffd9b8!important}