:root { --charcoal: #2d2e2d; --gold: #e1a72a; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 20px; }
body { margin: 0; min-width: 320px; color: var(--charcoal); background: #fff; font-family: "Heebo", Arial, sans-serif; line-height: 1.45; }
h1,h2,h3,p { margin: 0; }
a { color: inherit; text-decoration: none; }
a:focus-visible { outline: 3px solid var(--gold); outline-offset: 5px; }
.audience { padding: 18px 24px; background: var(--charcoal); color: var(--gold); font-size: 21px; font-weight: 700; text-align: center; }
.focus-hero { padding: 74px 24px 75px; display: flex; flex-direction: column; align-items: center; gap: 20px; text-align: center; background: url('/assets/focus-training-background.png') center / cover no-repeat; }
.eyebrow { color: var(--gold); font-size: 20px; font-weight: 700; }
h1 { max-width: 1100px; font-size: 54px; line-height: 1.13; }
.hero-subtitle { max-width: 1080px; font-size: 25px; }
.video-placeholder { width: min(960px,100%); aspect-ratio: 16/9; display: flex; flex-direction: column; gap: 16px; align-items: center; justify-content: center; border: 1px solid var(--gold); border-radius: 20px; background: var(--charcoal); color: white; font-size: 23px; font-weight: 700; }
.play-symbol { color: var(--gold); font-size: 48px; }
.registration-button { display: flex; align-items: center; justify-content: center; width: min(390px,100%); min-height: 62px; padding: 12px 20px; border-radius: 31px; background: var(--gold); color: var(--charcoal); font-size: 21px; font-weight: 700; text-align: center; }
.registration-button:hover { filter: brightness(1.05); }
.focus-problem { display: flex; flex-direction: column; align-items: center; gap: 20px; padding: 52px 24px; background: var(--charcoal); color: white; text-align: center; }
.focus-problem h2 { max-width: 1000px; font-size: 34px; }
.focus-problem p { max-width: 1100px; font-size: 22px; }
.focus-problem .focus-statement { color: var(--gold); font-size: 25px; font-weight: 700; }
.curriculum, .registration { display: flex; flex-direction: column; align-items: center; gap: 20px; padding: 64px 24px; text-align: center; }
.curriculum h2, .registration h2 { font-size: 38px; }
.section-intro { font-size: 22px; max-width: 1000px; }
.learning-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; width: min(1060px,100%); }
.learning-card { min-height: 280px; padding: 24px; border: 2px solid var(--gold); border-radius: 20px; background: var(--charcoal); color: white; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; }
.card-number { color: var(--gold); font-size: 34px; font-weight: 700; }
.learning-card h3 { font-size: 24px; }
.learning-card p { font-size: 18px; }
.speaker { min-height: 640px; padding: 20px 24px 24px; background: var(--charcoal); color: white; font: 16px/1.3 "Assistant",Arial,sans-serif; }
.speaker-lead { display: grid; grid-template-columns: 240px minmax(0,598px); gap: 5px; min-height: 378px; width: min(843px,100%); margin: auto; }
.speaker-portrait { position: relative; width: 224px; height: 347px; margin: 21px auto 10px; border: 1px solid var(--gold); border-radius: 15px; overflow: hidden; }
.speaker-portrait img { position: absolute; width: 123%; height: 119.57%; left: -11.44%; top: -4.03%; max-width: none; }
.speaker-copy { padding: 10px 10px 0 15px; }
.speaker-copy h2 { font-size: 32px; line-height: 1; margin-bottom: 5px; }
.speaker-copy p:not(.eyebrow) { max-width: 556px; margin: 0 0 20px auto; }
.speaker-copy .eyebrow { margin: 0; }
.speaker-more { width: min(814px,100%); margin: 10px auto 0; }
.speaker-more p { margin-bottom: 20px; }
.registration-card { width: min(740px,100%); padding: 32px; border-radius: 20px; background: var(--charcoal); overflow: hidden; }
.registration-card iframe { display: block; }
footer { display: flex; align-items: center; justify-content: center; gap: 12px; flex-wrap: wrap; padding: 22px 20px; color: white; background: var(--charcoal); font-size: 16px; }
@media (max-width: 760px) {
  .audience { padding: 14px 20px; font-size: 16px; }
  .focus-hero { padding: 40px 16px; }
  h1 { font-size: clamp(29px,7.8vw,44px); }
  .eyebrow { font-size: 17px; }
  .hero-subtitle { font-size: 19px; }
  .desktop-break { display: none; }
  .video-placeholder { font-size: 18px; border-radius: 14px; gap: 8px; }
  .play-symbol { font-size: 32px; }
  .registration-button { font-size: 18px; min-height: 56px; }
  .focus-problem { padding: 36px 20px; }
  .focus-problem h2 { font-size: 26px; }
  .focus-problem p { font-size: 18px; }
  .focus-problem .focus-statement { font-size: 21px; }
  .curriculum, .registration { padding: 40px 16px; }
  .curriculum h2, .registration h2 { font-size: 29px; }
  .section-intro { font-size: 18px; }
  .learning-grid { grid-template-columns: 1fr; max-width: 440px; }
  .learning-card { min-height: 240px; }
  .speaker { padding: 30px 20px; font-size: 16px; line-height: 1.5; }
  .speaker-lead { display: flex; flex-direction: column; }
  .speaker-copy { display: contents; }
  .speaker-copy .eyebrow { order: -3; text-align: center; margin-bottom: 8px; }
  .speaker-copy h2 { order: -2; text-align: center; margin-bottom: 16px; }
  .speaker-portrait { order: -1; margin: 0 auto 20px; }
  .speaker-more { margin-top: 0; }
  .registration-card { padding: 12px; }
  footer { font-size: 14px; gap: 8px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
