@charset "UTF-8";
/**
 * @file
 * Objective card styles — mobile-first.
 * Figma: Desktop 26:3310, Mobile 26:5735.
 *
 * Card with icon (86px), heading (48px), and body text (20px) at desktop.
 * All text uses --vel-primary color.
 */
/* ==========================================================================
   Mobile base (xs)
   ========================================================================== */
.vel-objective-card {
  display: flex;
  flex-direction: column;
  gap: var(--vel-space-md); /* 16px */
}

.vel-objective-card__icon-wrapper {
  width: 48px;
  height: 48px;
  flex-shrink: 0;
}

.vel-objective-card__icon {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.vel-objective-card__title {
  font-family: var(--vel-font-heading);
  font-size: 24px;
  font-weight: 800;
  color: var(--vel-primary);
  letter-spacing: var(--vel-tracking-snug); /* -0.75px */
  line-height: var(--vel-leading-card-title);
  margin: 0;
  overflow-wrap: break-word;
  word-wrap: break-word;
}

.vel-objective-card__body {
  font-family: var(--vel-font-body);
  font-size: var(--vel-text-base); /* 16px */
  font-weight: 500;
  color: var(--vel-primary);
  line-height: var(--vel-leading-snug); /* 24px */
  margin: 0;
  overflow-wrap: break-word;
  word-wrap: break-word;
}

/* ==========================================================================
   sm (576px)
   ========================================================================== */
@media (min-width: 576px) {
  .vel-objective-card__title {
    font-size: 32px;
    line-height: 36px;
  }
  .vel-objective-card__body {
    font-size: var(--vel-text-lg); /* 18px */
    line-height: var(--vel-leading-card-body);
  }
}
/* ==========================================================================
   md (768px)
   ========================================================================== */
@media (min-width: 768px) {
  .vel-objective-card {
    gap: var(--vel-space-lg); /* 24px */
  }
  .vel-objective-card__icon-wrapper {
    width: 72px;
    height: 72px;
  }
  .vel-objective-card__title {
    font-size: var(--vel-text-3xl-plus);
    line-height: var(--vel-leading-heading-sm); /* 36px */
  }
  .vel-objective-card__body {
    font-size: var(--vel-text-lg); /* 18px */
    line-height: var(--vel-leading-relaxed); /* 28px */
  }
}
/* ==========================================================================
   lg (992px) — Desktop
   ========================================================================== */
@media (min-width: 992px) {
  .vel-objective-card {
    gap: var(--vel-space-lg);
  }
  .vel-objective-card__icon-wrapper {
    width: 80px;
    height: 80px;
  }
  .vel-objective-card__title {
    font-size: 40px;
    line-height: 44px;
  }
  .vel-objective-card__body {
    font-size: var(--vel-text-xl); /* 20px */
    line-height: var(--vel-leading-body); /* 29.25px */
  }
}
/* ==========================================================================
   xl (1200px)
   ========================================================================== */
@media (min-width: 1200px) {
  .vel-objective-card__icon-wrapper {
    width: 86px;
    height: 86px;
  }
  .vel-objective-card__title {
    font-size: 44px;
    line-height: 48px;
  }
}
/* ==========================================================================
   xxl (1600px) — Full Figma spec sizes
   ========================================================================== */
@media (min-width: 1600px) {
  .vel-objective-card__title {
    font-size: var(--vel-text-4xl); /* 48px */
    line-height: var(--vel-leading-heading-md); /* 48.75px */
  }
  .vel-objective-card__body {
    font-size: var(--vel-text-xl); /* 20px */
    line-height: var(--vel-leading-body); /* 29.25px */
  }
}
/*# sourceMappingURL=objective-card.css.map */
