/* NCFE CACHE Level 2 page (EN + RU) — round 2. Page-specific styles only; everything else comes from style.css. */

/* Hero: long official title → two-tier heading, portrait photo frame */
.l2-title { font-size: clamp(2.2rem, 3.9vw, 3.3rem); line-height: 1.08; }
.l2-title__sub {
  display: block; margin-top: .6rem;
  font-size: clamp(1.35rem, 2.1vw, 1.75rem); line-height: 1.25;
  font-style: italic; font-weight: 500; color: var(--bb-teal);
}
.l2-hero .hero__lead { margin-bottom: 1rem; }
.l2-hero__text { color: var(--bb-ink-2); max-width: 560px; margin-bottom: 2rem; }
.l2-hero .hero__actions { margin-bottom: 0; }
.l2-hero__media { display: flex; justify-content: flex-end; }
.hero--page .l2-hero__photo { aspect-ratio: 4 / 5; width: 100%; max-width: 480px; }
.l2-hero__photo img { object-position: 50% 40%; }
@media (max-width: 991.98px) {
  .l2-hero__media { justify-content: center; }
  .hero--page .l2-hero__photo { max-width: 560px; aspect-ratio: 1 / 1; }
  .l2-hero__photo img { object-position: 50% 30%; }
}

/* What you'll master */
.l2-master .feature--card { align-items: center; }
.l2-master .feature__title { margin-bottom: .2rem; }
@media (max-width: 767.98px) { .l2-master .feature--card { align-items: flex-start; } }

/* How it works: fact tiles + one sentence */
.l2-facts .fact { display: flex; flex-direction: column; justify-content: center; }
.l2-facts .fact__label { text-wrap: balance; }
.l2-how__text { max-width: 760px; margin: clamp(1.75rem, 3vw, 2.5rem) 0 0; font-size: 1.125rem; color: var(--bb-ink-2); }

/* Outcomes + who can apply */
.l2-box { background: var(--bb-cream-2); border-radius: var(--radius-xl); padding: clamp(1.5rem, 3vw, 2.5rem); height: 100%; }
.l2-box__title { font-size: clamp(1.5rem, 2.2vw, 1.9rem); line-height: 1.2; margin-bottom: 1.25rem; }
.l2-box__intro { font-weight: 700; color: var(--bb-teal-deep); margin-bottom: .75rem; }
.l2-box .check-list { margin-bottom: 0; }
.l2-actions { justify-content: center; }
@media (max-width: 575.98px) {
  .l2-actions { flex-direction: column; align-items: stretch; text-align: center; }
  .l2-actions .btn-bb-ghost { align-self: center; }
}