/* Generated 390px mobile baseline; rebuild with build-mobile-rem.py. */
.hero .why-slide{--accent: #fff451;}
.hero .why-slide > .wrap{align-items: flex-start; justify-content: center; max-width: none; width: 100%; padding: 2.375rem 8.125rem 6.875rem;}
.hero .why-slide .campaign-copy{width: min(80rem, 100%); padding: 0; text-align: center;}
.why-script{margin: 0; color: rgb(255, 255, 255); font-family: "Brush Script MT", "Segoe Script", cursive; font-size: 2.25rem; font-style: italic; line-height: 1; font-weight: 400;}
.hero .why-slide .campaign-copy h2{margin: 0.5rem 0 0; font-size: clamp(1.875rem, 3.2vw, 3.125rem); font-weight: 800; line-height: 1.2; letter-spacing: -0.055em; color: rgb(255, 255, 255);}
.hero .why-slide .campaign-copy h2 em{color: var(--accent); font-weight: 900;}
.hero .why-slide .campaign-copy .lead{margin: 0.75rem 0 0; color: rgb(255, 255, 255); font-size: max(13px,1.125rem); font-weight: 550; line-height: 1.6; letter-spacing: -0.035em; word-break: keep-all;}
.hero .why-slide .lead strong{color: var(--accent); font-weight: 800;}
.why-roster{--teacher-height: clamp(10.9375rem,15vw,14.375rem); position: relative; width: 100%; height: var(--teacher-height); margin-top: 1.5rem; isolation: isolate;}
.why-person{position: absolute; bottom: 0; left: calc(4% + 92% * var(--desk) / 19); height: var(--teacher-height); width: calc(var(--teacher-height) * var(--ratio)); transform: translateX(-50%); z-index: var(--desk); overflow: visible; pointer-events: none;}
.why-person svg{display: block; width: 100%; height: 100%;}
.hero .why-slide .campaign-btn{height: 3rem; margin-top: 1.375rem; padding: 0 1.5625rem; gap: 0.875rem; border: 1px solid rgba(255, 255, 255, 0.78); background: rgba(10, 24, 51, 0.28); color: rgb(255, 255, 255); font-size: max(13px,0.9375rem); box-shadow: none;}
.hero .why-slide .campaign-btn:hover{background: rgb(255, 255, 255); color: rgb(21, 36, 66);}
.hero .why-slide .campaign-btn:focus-visible{outline: 0.1875rem solid var(--accent); outline-offset: 0.3125rem;}
.hero .why-slide > .wrap{padding: 2.75rem 7.8125rem 6.25rem 1.875rem;}
.hero .why-slide .campaign-copy .lead{font-size: max(13px,1rem);}
.why-roster{--teacher-height: clamp(10.625rem,18vw,13.125rem);}
.hero .why-slide > .wrap{padding: 2rem 1.5rem 5.9375rem; align-items: flex-start;}
.hero .why-slide .campaign-copy{width: 100%; padding: 0;}
.why-script{font-size: 2.25rem;}
.hero .why-slide .campaign-copy h2{font-size: 2.125rem; line-height: 1.25;}
.why-prefix{display: block;}
.hero .why-slide .campaign-copy .lead{margin-top: 0.75rem; font-size: max(13px,0.9375rem); line-height: 1.6;}
.why-proof{display: block;}
.why-roster{--teacher-height: clamp(6.75rem,20vw,9.125rem); height: calc(var(--teacher-height) * 1.65); margin-top: 1.375rem;}
.why-person{left: calc(5% + 90% * var(--mobile-order) / 9); bottom: calc((1 - var(--mobile-row)) * var(--teacher-height) * .65); z-index: calc(var(--mobile-row) * 20 + var(--mobile-order));}
.hero .why-slide .campaign-btn{margin-top: 1.375rem; height: 2.875rem; font-size: max(13px,0.875rem);}
body:has(.why-slide.is-active) .fab{top: auto; bottom: calc(0.5rem + env(safe-area-inset-bottom,0)); left: 0.75rem; right: 0.75rem; transform: none; display: flex; border-radius: 0.875rem;}
body:has(.why-slide.is-active) .fab a{width: 20%; min-width: 0; flex: 1 1 0%; gap: 0.1875rem; padding: 0.4375rem 0.125rem; border-top: 0; border-left: 1px solid var(--line); font-size: 0.625rem;}
body:has(.why-slide.is-active) .fab a:first-child{border-left: 0;}
body:has(.why-slide.is-active) .fab .ic{width: 1.75rem; height: 1.75rem;}
body:has(.why-slide.is-active) .fab .ico{width: 0.9375rem; height: 0.9375rem;}
.hero .why-slide > .wrap{padding: 1.875rem 1.25rem 5.625rem;}
.why-script{font-size: 2rem;}
.hero .why-slide .campaign-copy h2{margin-top: 0.5rem; font-size: 1.625rem; line-height: 1.3;}
.hero .why-slide .campaign-copy .lead{font-size: max(10px,0.75rem); margin-top: 0.75rem; line-height: 1.7;}
.why-roster{--teacher-height: 6.75rem; margin-top: 1.375rem;}
.hero .why-slide .campaign-btn{margin-top: 1.5rem;}

@media (prefers-reduced-motion: reduce){.hero .why-slide .campaign-btn{transition: none; transform: none;}}
.hero .why-slide .campaign-copy{top: 3.125rem;}
.why-person{z-index: min(calc(20 + var(--desk)),calc(40 - var(--desk)));}
.why-person{z-index: calc(var(--mobile-row) * 30 + min(calc(10 + var(--mobile-order)),calc(18 - var(--mobile-order))));}
.why-roster::after{content: ""; position: absolute; z-index: 100; left: -1rem; right: -1rem; bottom: -0.625rem; height: 1.5rem; border-radius: 6.25rem; background: linear-gradient(rgb(61, 87, 126) 0%, rgb(38, 62, 100) 30%, rgb(25, 46, 80) 100%); border-top: 1px solid rgba(176, 201, 234, 0.35); box-shadow: rgba(5, 14, 32, 0.2) 0 0.3125rem 0.75rem; pointer-events: none;}
.why-roster::after{left: -0.75rem; right: -0.75rem; bottom: -0.5rem; height: 1.25rem;}

