:root {
  --ink: #171923;
  --cream: #fff8ef;
  --cream-2: #fff1df;
  --blush: #f8b7c9;
  --blush-soft: #fde6ed;
  --cobalt: #5546e8;
  --cobalt-dark: #4032cf;
  --periwinkle: #dfe2ff;
  --coral: #ff8467;
  --yellow: #ffd45d;
  --sky-soft: #eef4f8;
  --mint-soft: #dff6ed;
}

body {
  color: var(--ink);
  background: var(--cream);
  background-image:
    radial-gradient(circle at 8% 14%, rgba(248, 183, 201, .3), transparent 18rem),
    radial-gradient(circle at 91% 16%, rgba(85, 70, 232, .11), transparent 21rem);
  background-attachment: fixed;
}

a {
  color: var(--cobalt-dark);
}

.topbar {
  color: #4e4d59;
  background: rgba(255, 248, 239, .96);
  border-bottom: 1px solid rgba(23, 25, 35, .07);
}

.topbar a {
  color: var(--ink);
}

.site-header {
  top: 0;
  padding: .35rem 0;
  background: rgba(255, 248, 239, .9);
  border-bottom: 1px solid rgba(23, 25, 35, .05);
  box-shadow: none;
}

.navbar {
  min-height: 68px;
  padding-inline: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.brand-mark {
  width: 40px;
  height: 40px;
  border-radius: 11px;
  color: #fff;
  background: var(--cobalt);
  box-shadow: 0 7px 16px rgba(85, 70, 232, .2);
}

.brand-name {
  color: var(--ink);
}

.brand-name small {
  color: var(--cobalt);
}

.navbar-nav {
  gap: .55rem;
}

.navbar-nav .nav-link {
  color: var(--ink);
  font-size: .82rem;
  font-weight: 700;
  border-radius: 999px;
}

.navbar-nav .nav-link:hover,
.navbar-nav .nav-link.active {
  color: var(--cobalt-dark);
  background: var(--periwinkle);
  box-shadow: none;
}

.navbar .btn-warning {
  padding: .68rem 1.05rem;
  color: #fff;
  background: var(--ink);
  box-shadow: 0 8px 18px rgba(23, 25, 35, .18);
}

.dropdown-menu {
  border-color: rgba(23, 25, 35, .08);
  background: #fffdf9;
  box-shadow: 0 20px 42px rgba(23, 25, 35, .12);
}

.dropdown-item:hover,
.dropdown-item:focus {
  color: var(--cobalt-dark);
  background: var(--periwinkle);
}

.hero {
  padding: 3.8rem 0 4rem;
  background:
    radial-gradient(circle at 2% 50%, rgba(255, 212, 93, .23), transparent 15rem),
    radial-gradient(circle at 98% 20%, rgba(248, 183, 201, .32), transparent 22rem);
}

.hero::before,
.hero::after {
  display: none;
}

.hero .row {
  --bs-gutter-x: 3rem;
}

.hero-panel {
  display: flex;
  min-height: 510px;
  padding: 2rem 0;
  flex-direction: column;
  justify-content: center;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}

.hero-panel::before {
  display: none;
}

.hero .display-title {
  max-width: 650px;
  margin: 1.05rem 0 1.1rem;
  color: var(--ink);
  font-size: clamp(3.05rem, 5.1vw, 5.2rem);
  font-weight: 800;
  line-height: .99;
  letter-spacing: -.068em;
}

.gradient-text {
  color: var(--ink);
  background: none;
  -webkit-text-fill-color: currentColor;
}

.hero .lead {
  max-width: 570px;
  color: #605f68;
  font-size: 1rem;
  line-height: 1.67;
}

.eyebrow {
  width: fit-content;
  color: #4032cf;
  border: 0;
  background: var(--periwinkle);
  box-shadow: none;
}

.hero .btn-success,
.cta-band .btn-warning {
  color: #fff;
  background: var(--cobalt);
  border-color: var(--cobalt);
  box-shadow: 0 9px 20px rgba(85, 70, 232, .23);
}

.hero .btn-outline-primary {
  color: var(--ink);
  border: 1.5px solid var(--ink);
  background: transparent;
  box-shadow: none;
}

.hero-photo {
  min-height: 510px;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}

.hero-photo::before {
  content: "";
  position: absolute;
  inset: 12% 5% 10% 8%;
  z-index: -1;
  border-radius: 44% 56% 54% 46% / 50% 38% 62% 50%;
  background: rgba(248, 183, 201, .45);
  transform: rotate(-4deg);
}

.hero-photo::after {
  display: none;
}

.hero-photo img {
  min-height: 510px;
  object-fit: contain;
  filter: drop-shadow(0 25px 24px rgba(85, 70, 232, .12));
}

.hero-photo:hover img {
  transform: translateY(-4px) scale(1.012);
}

.photo-badge {
  color: var(--ink);
  border: 0;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(23, 25, 35, .11);
}

.photo-badge.one {
  background: #fff3cc;
}

.photo-badge.two {
  background: var(--blush-soft);
}

.section,
.section-sm {
  background: #fffdfa;
}

.section:nth-of-type(even) {
  background: var(--cream-2);
}

.section.bg-white,
.section-sm.bg-white {
  border: 0;
  background: var(--sky-soft) !important;
}

.section-title,
.page-hero .display-title {
  color: var(--ink);
  font-weight: 800;
  letter-spacing: -.055em;
}

.section-intro,
.lead {
  color: #62616b;
}

.glass,
.solid-panel {
  border: 1px solid rgba(23, 25, 35, .07);
  border-radius: 20px;
  background: #fff;
  box-shadow: none;
  backdrop-filter: none;
}

.feature-card,
.course-card,
.skill-card,
.contact-card,
.placeholder-card {
  border: 1px solid rgba(23, 25, 35, .065);
  border-radius: 18px;
  box-shadow: 0 6px 0 rgba(23, 25, 35, .035);
}

.row > div:nth-child(3n+1) > .course-card,
.row > div:nth-child(3n+1) > .feature-card,
.row > div:nth-child(3n+1) > .skill-card {
  background: #fff0d8;
}

.row > div:nth-child(3n+2) > .course-card,
.row > div:nth-child(3n+2) > .feature-card,
.row > div:nth-child(3n+2) > .skill-card {
  background: var(--periwinkle);
}

.row > div:nth-child(3n) > .course-card,
.row > div:nth-child(3n) > .feature-card,
.row > div:nth-child(3n) > .skill-card {
  background: var(--blush-soft);
}

.feature-card:hover,
.course-card:hover,
.skill-card:hover,
.contact-card:hover {
  border-color: rgba(85, 70, 232, .2);
  box-shadow: 0 16px 32px rgba(85, 70, 232, .09);
}

.icon-box,
.icon-box.blue,
.icon-box.orange {
  color: #fff;
  background: var(--cobalt);
  box-shadow: none;
}

.row > div:nth-child(3n+1) .icon-box {
  color: var(--ink);
  background: var(--yellow);
}

.row > div:nth-child(3n) .icon-box {
  color: var(--ink);
  background: var(--coral);
}

.tag {
  color: var(--cobalt-dark);
  background: var(--periwinkle);
}

.process-step .number {
  background: var(--cobalt);
  box-shadow: 0 8px 0 rgba(85, 70, 232, .12);
}

.check-list li::before {
  color: var(--cobalt);
}

.notice {
  border-left-color: var(--coral);
  background: #fff0e9;
}

.page-hero {
  padding: 4.6rem 0 4.2rem;
  border: 0;
  background:
    radial-gradient(circle at 87% 28%, rgba(248, 183, 201, .5), transparent 17rem),
    radial-gradient(circle at 10% 95%, rgba(255, 212, 93, .2), transparent 16rem),
    var(--cream);
}

.page-hero::before {
  display: none;
}

.breadcrumb {
  border: 0;
  background: var(--periwinkle);
}

.cta-band {
  color: var(--ink);
  border: 0;
  border-radius: 28px;
  background:
    radial-gradient(circle at 90% 12%, rgba(255, 212, 93, .55), transparent 12rem),
    #fff1d8;
  box-shadow: 0 14px 0 rgba(248, 183, 201, .35);
}

.cta-band::after {
  background: rgba(85, 70, 232, .12);
}

.cta-band .btn-light {
  color: #fff;
  border-color: var(--ink);
  background: var(--ink);
}

.cta-band .btn-outline-light,
.cta-band a.text-white {
  color: var(--ink) !important;
  border-color: var(--ink);
}

.accordion-item {
  border: 1px solid rgba(23, 25, 35, .07);
  background: #fff;
  box-shadow: none;
}

.accordion-button:not(.collapsed) {
  color: var(--cobalt-dark);
  background: var(--periwinkle);
}

.form-control,
.form-select {
  border: 1px solid rgba(23, 25, 35, .16);
  background: #fff;
}

.form-control:focus,
.form-select:focus {
  border-color: var(--cobalt);
  box-shadow: 0 0 0 .25rem rgba(85, 70, 232, .13);
}

.site-footer {
  color: #565560;
  background: #f6f4ff;
}

.site-footer h3,
.site-footer h4,
.site-footer .brand-name {
  color: var(--ink) !important;
}

.site-footer a {
  color: #4d4b59;
}

.site-footer a:hover {
  color: var(--cobalt-dark);
}

.site-footer .brand-mark {
  background: var(--cobalt);
}

.social-link {
  color: var(--cobalt) !important;
  background: #fff;
}

.footer-bottom {
  border-top-color: rgba(23, 25, 35, .1);
}

.site-footer .btn-outline-light {
  color: var(--ink);
  border-color: var(--ink);
}

.mobile-actions {
  background: #fffaf3;
}

@media (min-width: 992px) {
  .hero .col-lg-7 {
    width: 48%;
  }

  .hero .col-lg-5 {
    width: 52%;
  }
}

@media (max-width: 991.98px) {
  .navbar-collapse {
    border: 1px solid rgba(23, 25, 35, .07);
    border-radius: 15px;
    background: #fffdf9;
  }

  .hero-panel {
    min-height: auto;
    padding-top: 1rem;
  }

  .hero-photo,
  .hero-photo img {
    min-height: 430px;
  }
}

@media (max-width: 767.98px) {
  .topbar {
    background: var(--ink);
  }

  .topbar a,
  .topbar {
    color: #fff;
  }

  .hero {
    padding-top: 2.3rem;
  }

  .hero .display-title {
    font-size: clamp(2.65rem, 13vw, 4rem);
  }

  .hero-photo,
  .hero-photo img {
    min-height: 330px;
  }

  .photo-badge {
    font-size: .72rem;
  }

  .page-hero {
    padding: 3.2rem 0;
  }
}
