/* =====================================================================
   InstoPedia — Brand Refresh (Ink Blue #22335C + Ember Orange #ED7226 ONLY)
   Loaded LAST so it wins over theme.min.css / instopedia-home.css /
   instopedia-color-boost.css / instopedia-inner.css without editing them.
   Font system: Funnel Display everywhere on the public frontend.
===================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Funnel+Display:wght@300;400;500;600;700;800&family=Noto+Sans+Gujarati:wght@400;500;600;700;800&display=swap');

:root{
  --heading-font:'Funnel Display','Noto Sans Gujarati',sans-serif !important;
  --body-font:'Funnel Display','Noto Sans Gujarati',sans-serif !important;
  --ip-glow:0 20px 45px rgba(34,51,92,.16);
  --ip-radius-lg:26px;
  --ip-radius-md:18px;
  --ip-radius-sm:12px;
}

html{scroll-behavior:smooth}

*, body, h1,h2,h3,h4,h5,h6, .btn, .nav-link, .form-label, .badge,
input, select, textarea, button{
  font-family:'Funnel Display','Noto Sans Gujarati',sans-serif !important;
}

h1,h2,h3,h4,h5,h6{letter-spacing:-.02em}

/* ---------- Scrollbar ---------- */
::-webkit-scrollbar{height:10px;width:10px}
::-webkit-scrollbar-track{background:#f1f5f9}
::-webkit-scrollbar-thumb{background:#22335C;border-radius:99px}

/* ---------- Selection colour ---------- */
::selection{background:rgba(237,114,38,.25);color:#1B2740}

/* =====================================================================
   HERO — soft two-tone glow (no rainbow), glassy search, flat headline
===================================================================== */
.ip-hero{
  background:
    radial-gradient(circle at 88% 8%,rgba(237,114,38,.14),transparent 34%),
    radial-gradient(circle at 6% 82%,rgba(34,51,92,.12),transparent 34%),
    linear-gradient(135deg,#f7f9ff 0%,#eef4ff 48%,#fff6ee 100%) !important;
}

.ip-eyebrow{
  background:linear-gradient(135deg,#fff,#f3f7ff) !important;
  border:1px solid #dfe8f7 !important;
  box-shadow:0 8px 20px rgba(34,51,92,.08) !important;
}
.ip-trend-chip{
  display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;
  background:#ED7226 !important;
  color:#fff !important;font-weight:800;font-size:12px;letter-spacing:.04em;
  box-shadow:0 10px 24px rgba(237,114,38,.28);
  animation:ipPulseChip 2.6s ease-in-out infinite;
}
@keyframes ipPulseChip{0%,100%{transform:scale(1)}50%{transform:scale(1.035)}}

.ip-hero h1{animation:ipFadeUp .7s cubic-bezier(.22,.85,.32,1) both}
.ip-hero h1 span{
  color:#22335C !important;
  background:none !important;
  -webkit-background-clip:initial !important;background-clip:initial !important;
  -webkit-text-fill-color:#22335C !important;
}
.ip-caret{color:#ED7226}
.ip-hero-copy{animation:ipFadeUp .7s .08s cubic-bezier(.22,.85,.32,1) both}
.ip-search{animation:ipFadeUp .7s .16s cubic-bezier(.22,.85,.32,1) both}
.ip-hero-actions,.ip-trust-row{animation:ipFadeUp .7s .22s cubic-bezier(.22,.85,.32,1) both}
@keyframes ipFadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}

.ip-search{
  border:1px solid #e3ecfa !important;
  box-shadow:0 26px 60px rgba(34,51,92,.14),0 0 0 1px rgba(255,255,255,.6) inset !important;
  border-radius:22px !important;
}
.ip-search .form-control,.ip-search .form-select{
  background:#f7f9fd !important;transition:box-shadow .2s ease,background .2s ease;
}
.ip-search .form-control:focus,.ip-search .form-select:focus{
  background:#fff !important;box-shadow:0 0 0 4px rgba(237,114,38,.16) !important;
}
.ip-search .btn{
  background:#22335C !important;
  box-shadow:0 14px 30px rgba(34,51,92,.28) !important;
}

.ip-btn-orange{
  background:#ED7226 !important;
  box-shadow:0 16px 34px rgba(237,114,38,.28) !important;
}
.ip-btn-orange:hover{background:#22335C !important}
.btn-primary{
  background:#22335C !important;
  border-color:transparent !important;
  box-shadow:0 16px 32px rgba(34,51,92,.22) !important;
  position:relative;overflow:hidden;
}
.btn-primary:hover{background:#ED7226 !important}
.btn-primary,.ip-btn-orange,.btn-admin{transition:transform .22s ease,box-shadow .22s ease,background .22s ease !important}
.btn-primary:hover,.ip-btn-orange:hover,.btn-admin:hover{transform:translateY(-3px) scale(1.015)}

.ip-visual-card{animation:ipFadeUp .8s .1s cubic-bezier(.22,.85,.32,1) both}
.ip-float{animation:ipDrift 5s ease-in-out infinite}
.ip-float-two{animation-delay:.6s}.ip-float-three{animation-delay:1.2s}
@keyframes ipDrift{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.ip-float i{
  background:#ED7226 !important;
  color:#fff !important;
}
.ip-float-one i{background:#22335C !important}
.ip-float-three i{background:#22335C !important}

/* =====================================================================
   SECTION KICKERS — flat brand orange text, no gradient-text tricks
===================================================================== */
.ip-kicker{
  background:none !important;
  -webkit-background-clip:initial !important;background-clip:initial !important;
  -webkit-text-fill-color:#ED7226 !important;
  color:#ED7226 !important;
  font-weight:900 !important;
}
.ip-city-section .ip-kicker{color:#ED7226 !important;-webkit-text-fill-color:#ED7226 !important}
.ip-section.ip-section-soft .ip-kicker{color:#ED7226 !important;-webkit-text-fill-color:#ED7226 !important}

/* =====================================================================
   CARDS — hover lift + shadow, brand colours only
===================================================================== */
.ip-course-card,.ip-why-card,.ip-review-card,.ip-info-card{
  border-radius:var(--ip-radius-md) !important;
  transition:transform .28s cubic-bezier(.22,.85,.32,1),box-shadow .28s ease,border-color .28s ease !important;
}
.ip-course-card:hover,.ip-why-card:hover,.ip-review-card:hover,.ip-info-card:hover{
  transform:translateY(-8px) !important;
  box-shadow:0 26px 55px rgba(34,51,92,.16) !important;
}
.ip-course-icon,.ip-why-icon,.ip-avatar,.ip-info-icon{transition:transform .3s cubic-bezier(.34,1.56,.64,1)}
.ip-course-card:hover .ip-course-icon,.ip-why-card:hover .ip-why-icon,.ip-info-card:hover .ip-info-icon{
  transform:rotate(-6deg) scale(1.08);
}

.ip-course-count{
  background:#fff3ea !important;color:#ED7226 !important;font-weight:900 !important;
}
.ip-course-count-new{background:#22335C !important;color:#fff !important}

/* View-all / outline buttons */
.btn-outline-primary{border-width:2px !important;font-weight:800 !important;transition:.25s !important}
.btn-outline-primary:hover{
  background:#22335C !important;
  border-color:transparent !important;color:#fff !important;transform:translateY(-2px);
}

/* Swiper arrows / pagination — brand colours */
.ipCourseSwiper .swiper-button-next,.ipCourseSwiper .swiper-button-prev,
.ipFeatureSwiper .swiper-button-next,.ipFeatureSwiper .swiper-button-prev,
.ip-swiper-nav .swiper-button-next,.ip-swiper-nav .swiper-button-prev,
.swiper-button-next,.swiper-button-prev{
  background:#22335C !important;
  box-shadow:0 10px 22px rgba(34,51,92,.28) !important;
}
.swiper-pagination-bullet-active{
  background:#ED7226 !important;
}

/* =====================================================================
   BADGES / CHIPS
===================================================================== */
.ip-feature-badge{
  background:#ED7226 !important;
  color:#fff !important;border-color:transparent !important;font-weight:800 !important;
}
.ip-about-badge{
  background:#fff3ea !important;
  border-color:#ffd9b8 !important;color:#ED7226 !important;
}

/* =====================================================================
   FORMS
===================================================================== */
.form-control,.form-select{
  border-radius:var(--ip-radius-sm) !important;
  border:1.5px solid #e2e8f0 !important;
  padding-top:.65rem !important;padding-bottom:.65rem !important;
  transition:border-color .2s ease,box-shadow .2s ease,background .2s ease !important;
}
.form-control:focus,.form-select:focus{
  border-color:#ED7226 !important;
  box-shadow:0 0 0 4px rgba(237,114,38,.14) !important;
}
.form-label{font-weight:800 !important;color:#1B2740}
.form-check-input:checked{background-color:#ED7226 !important;border-color:#ED7226 !important}

/* =====================================================================
   MODALS / POPUPS
===================================================================== */
.modal-content{
  border-radius:var(--ip-radius-lg) !important;
  border:0 !important;
  box-shadow:0 40px 100px rgba(15,23,42,.35) !important;
  overflow:hidden;
  animation:ipModalPop .35s cubic-bezier(.34,1.56,.64,1) both;
}
@keyframes ipModalPop{from{opacity:0;transform:scale(.94) translateY(10px)}to{opacity:1;transform:scale(1) translateY(0)}}
.modal-content::before{
  content:"";display:block;height:6px;width:100%;
  background:linear-gradient(90deg,#22335C 0%,#22335C 50%,#ED7226 50%,#ED7226 100%);
}
.modal-backdrop.show{opacity:.62 !important;background:#0b1220 !important}

/* Registration popup */
.edu-popup-badge{
  background:#fff3ea !important;color:#ED7226 !important;
}
.edu-popup-title span{color:#ED7226 !important}
.edu-popup-input:focus{border-color:#ED7226 !important;box-shadow:0 0 0 4px rgba(237,114,38,.14) !important}
.edu-popup-btn{
  background:#ED7226 !important;
  box-shadow:0 16px 34px rgba(237,114,38,.28) !important;
}
.edu-popup-btn:hover{background:#22335C !important}

/* Student auth modal tabs */
.ip-auth-tabs .nav-link{border-radius:999px !important;font-weight:800 !important;transition:.2s}
.ip-auth-tabs .nav-link.active{
  background:#22335C !important;color:#fff !important;
  box-shadow:0 10px 22px rgba(34,51,92,.24);
}
.ip-modal-brand{background:#eaf2ff !important}

/* =====================================================================
   INNER PAGES (About / FAQ / Contact / Pricing)
===================================================================== */
.ip-inner-hero{
  background:
    radial-gradient(circle at 88% 12%,rgba(237,114,38,.14),transparent 34%),
    radial-gradient(circle at 4% 90%,rgba(34,51,92,.10),transparent 36%),
    linear-gradient(135deg,#f7f9ff,#fff 65%) !important;
}
.ip-about-visual{
  background:linear-gradient(150deg,#141D33,#22335C 55%,#ED7226 100%) !important;
}
.ip-info-card::before{background:linear-gradient(90deg,#ED7226 0%,#ED7226 50%,#22335C 50%,#22335C 100%) !important}

/* =====================================================================
   FOOTER
===================================================================== */
.ip-footer{position:relative}
.ip-footer::before{
  content:"";position:absolute;top:0;left:0;right:0;height:4px;
  background:linear-gradient(90deg,#22335C 0%,#22335C 50%,#ED7226 50%,#ED7226 100%);
}
.ip-footer-socials a{transition:transform .25s ease,box-shadow .25s ease}
.ip-footer-socials a:hover{
  background:#ED7226 !important;
  color:#fff !important;transform:translateY(-3px) scale(1.05);
  box-shadow:0 10px 22px rgba(237,114,38,.3);
}
.ip-footer-cta{
  background:#ED7226 !important;
  box-shadow:0 14px 30px rgba(237,114,38,.28) !important;
}

/* =====================================================================
   Accessibility
===================================================================== */
a:focus-visible,button:focus-visible,.btn:focus-visible{
  outline:3px solid #ED7226 !important;outline-offset:2px;
}