/* ============================================================
   Vision Craft page — course catalog components (theme tokens)
   ============================================================ */

/* hero variant (bright mentorship photo needs a heavy left wash) */
.ngo-hero--vc .ngo-hero__bg{ object-position:74% 30%; }
.ngo-hero--vc .ngo-hero__overlay{
  background:linear-gradient(95deg, rgba(28,20,17,.93) 0%, rgba(28,20,17,.84) 40%, rgba(28,20,17,.55) 72%, rgba(28,20,17,.35) 100%);
}
.ngo-hero--vc .ngo-hero__copy h1{ font-size:clamp(34px,4.6vw,58px); }
.ngo-hero__sub{
  font-size:clamp(15px,1.8vw,17.5px); line-height:1.75;
  color:var(--c-hero-body); max-width:560px; margin-top:24px;
}

/* three-pillar overview cards */
.vc-cards{
  display:grid; grid-template-columns:repeat(3, minmax(0,1fr));
  gap:clamp(18px, 2.4vw, 30px);
}
.vc-card{
  background:#fff; border-radius:var(--radius);
  padding:clamp(24px, 2.6vw, 34px);
  display:flex; flex-direction:column; min-width:0;
  box-shadow:0 14px 34px -22px rgba(38,37,31,.35);
}
.vc-card__num{
  font-family:var(--f-accent); font-size:clamp(30px,3vw,40px); line-height:1;
  color:var(--pillar-c, var(--c-maroon)); margin-bottom:16px;
}
.vc-card__title{
  font-family:var(--f-sans); font-weight:700;
  font-size:clamp(17px,1.8vw,20px); line-height:1.35; color:var(--c-ink);
}
.vc-card__meta{
  font-family:var(--f-accent); font-size:13px;
  color:var(--c-muted-lt); margin-top:6px;
}
.vc-card__desc{ font-size:14px; line-height:1.75; color:var(--c-muted); margin-top:14px; flex:1; }
.vc-card__link{
  margin-top:20px; align-self:flex-start;
  font-family:var(--f-mont); font-weight:600; font-size:12px;
  letter-spacing:.14em; text-transform:uppercase;
  color:var(--pillar-c, var(--c-maroon)); text-decoration:none;
  border-bottom:1.4px solid currentColor; padding-bottom:3px;
}
.vc-card__link:hover{ opacity:.75; }

/* course groups + rows */
.vc-columns{
  display:grid; grid-template-columns:1fr 1fr;
  gap:clamp(36px, 5vw, 80px); align-items:start;
}
.vc-group + .vc-group{ margin-top:clamp(36px, 4.5vw, 54px); }
.vc-group__title{
  display:flex; align-items:center; gap:14px;
  font-family:var(--f-accent); font-weight:400;
  font-size:clamp(19px, 2.1vw, 23px); line-height:1.3;
  margin-bottom:6px;
}
.vc-group__title::before{
  content:""; width:28px; height:3px; border-radius:2px; flex:none;
  background:var(--group-c, var(--c-maroon));
}
.on-light .vc-group__title{ color:var(--c-ink); }
.on-dark .vc-group__title{ color:var(--c-cream-lt); }
.vc-course{
  display:flex; align-items:baseline; gap:14px; flex-wrap:wrap;
  padding:15px 0;
}
.on-light .vc-course{ border-bottom:1px solid rgba(38,37,31,.16); }
.on-dark .vc-course{ border-bottom:1px solid rgba(237,231,214,.18); }
.vc-course__name{
  flex:1; min-width:200px;
  font-family:var(--f-sans); font-weight:600; font-size:14.5px; line-height:1.5;
}
.on-light .vc-course__name{ color:var(--c-ink); }
.on-dark .vc-course__name{ color:var(--c-cream); }
.vc-course__desc{
  flex-basis:100%; font-size:13px; line-height:1.7; margin-top:2px;
}
.on-light .vc-course__desc{ color:var(--c-muted); }
.on-dark .vc-course__desc{ color:color-mix(in srgb, var(--c-cream) 78%, transparent); }
.vc-chip{
  flex:none; font-family:var(--f-mont); font-weight:500;
  font-size:10.5px; letter-spacing:.1em; text-transform:uppercase;
  padding:5px 11px; border-radius:999px; white-space:nowrap;
}
.on-light .vc-chip{ color:var(--c-maroon); border:1px solid color-mix(in srgb, var(--c-maroon) 45%, transparent); }
.on-dark .vc-chip{ color:var(--c-peach); border:1px solid rgba(237,231,214,.35); }

/* done-for-you service cards */
.vc-services{
  display:grid; grid-template-columns:repeat(3, minmax(0,1fr));
  gap:clamp(18px, 2.4vw, 28px);
}
.vc-service{
  background:#fff; border-radius:var(--radius);
  padding:clamp(22px, 2.4vw, 30px);
  border-top:3px solid var(--service-c, var(--c-maroon));
  min-width:0;
}
.vc-service__title{
  font-family:var(--f-accent); font-weight:400;
  font-size:clamp(17px,1.9vw,20px); line-height:1.35; color:var(--c-ink);
}
.vc-service__chip{
  display:inline-block; margin-top:10px;
  font-family:var(--f-mont); font-weight:500; font-size:10.5px;
  letter-spacing:.1em; text-transform:uppercase;
  color:var(--c-maroon); border:1px solid color-mix(in srgb, var(--c-maroon) 45%, transparent);
  border-radius:999px; padding:5px 11px;
}
.vc-service__desc{ font-size:13.5px; line-height:1.75; color:var(--c-muted); margin-top:12px; }

/* responsive */
@media (max-width:900px){
  .vc-cards{ grid-template-columns:1fr; }
  .vc-columns{ grid-template-columns:1fr; gap:44px; }
  .vc-services{ grid-template-columns:repeat(2, minmax(0,1fr)); }
}
@media (max-width:560px){
  .vc-services{ grid-template-columns:1fr; }
}
