/* =====================================================================
   KRITI V7 — course detail polish + breadcrumbs + footer contrast
   User-requested fixes:
   - prevent course hero CTA overlap
   - breadcrumbs around 20px and easier to read
   - headings around 500 weight
   - footer background chosen to keep the pink/gold KRITI logo clearly visible
   ===================================================================== */

/* Main headings: a little bolder than ultra-light, but still refined. */
h1,h2,h3,.display{
  font-family:var(--heading)!important;
  font-weight:500!important;
}
.display{letter-spacing:-.025em!important}

/* Breadcrumbs should read as navigation, not tiny metadata. */
.breadcrumbs{
  font-size:clamp(17px,1.15vw,20px)!important;
  line-height:1.5!important;
  font-weight:500!important;
  letter-spacing:.02em!important;
  text-transform:none!important;
  margin-bottom:24px!important;
  color:#9b7d88!important;
}
.breadcrumbs a{
  color:var(--rose)!important;
  font-weight:600!important;
  transition:color .2s ease;
}
.breadcrumbs a:hover{color:var(--rose-deep)!important}

/* Course hero CTAs: use a real two-column layout so buttons can never overlap. */
.course-detail-grid>div:first-child{min-width:0}
.course-detail-hero .hero-actions{
  display:grid!important;
  grid-template-columns:max-content max-content;
  align-items:stretch;
  gap:16px!important;
  width:max-content;
  max-width:100%;
  margin-top:4px;
}
.course-detail-hero .hero-actions .pill{
  margin:0!important;
  min-width:0;
  white-space:nowrap;
  padding:15px 24px;
  line-height:1.25;
  position:relative;
  z-index:1;
}
.course-detail-hero .hero-actions .pill--outline{
  background:rgba(255,255,255,.10)!important;
  color:#fff!important;
  border-color:rgba(255,255,255,.52)!important;
}
.course-detail-hero .hero-actions .pill--outline:hover{
  background:#fff!important;
  color:var(--wine)!important;
}

/* Footer: warm light blush gives maximum separation from the pink/gold logo. */
.footer{
  background:
    radial-gradient(circle at 86% 8%,rgba(216,172,98,.18),transparent 25%),
    radial-gradient(circle at 8% 88%,rgba(223,71,118,.10),transparent 28%),
    linear-gradient(135deg,#f8edef 0%,#f0dde3 55%,#f7e9e4 100%)!important;
  color:#3a202a!important;
  border-top:1px solid rgba(168,44,77,.14);
}
.footer::before{
  background:radial-gradient(circle,rgba(223,71,118,.10),transparent 68%)!important;
}
.footer-brand img{
  width:168px!important;
  height:168px!important;
  object-fit:contain;
  filter:drop-shadow(0 8px 18px rgba(103,41,62,.10));
}
.footer-brand p,
.footer-grid>div:not(.footer-brand){color:#735866!important}
.footer-brand strong{color:#6e243e!important;font-weight:600!important}
.footer-grid a{color:#5e3d49!important}
.footer-grid a:hover{color:var(--rose-deep)!important}
.footer-label{color:var(--rose-deep)!important;font-weight:700!important}
.footer-bottom{
  color:#846a74!important;
  border-top-color:rgba(74,39,52,.15)!important;
}

@media(max-width:1050px){
  .breadcrumbs{font-size:18px!important}
}

@media(max-width:700px){
  .breadcrumbs{font-size:17px!important;margin-bottom:20px!important}
  .course-detail-hero .hero-actions{
    grid-template-columns:1fr;
    width:100%;
    gap:12px!important;
  }
  .course-detail-hero .hero-actions .pill{
    width:100%;
    white-space:normal;
    text-align:center;
  }
  .footer-brand img{width:144px!important;height:144px!important}
}
