/* Paper, white and sage surfaces follow the school's Action Lab trainer. */
:root {
  color-scheme: light;
  --surface: #ffffff;
  --sage: #e9ede5;
  --muted: #626967;
  --line: #d9dedc;
  --accent-text: #3e6300;
}

body { background: var(--mte-color-paper); color: var(--mte-color-ink); }
:focus-visible { outline-color: #647c00; }
.header { background: var(--mte-color-paper); border-color: var(--line); }
.desktop-nav { color: var(--muted); }
.desktop-nav a:hover { color: var(--mte-color-ink); }
.nav-cta { border-color: #bfc8bd; }
.nav-cta:hover { color: var(--mte-color-ink); background: var(--mte-color-signal); border-color: var(--mte-color-signal); }
.status-dot { background: var(--mte-color-ink); }
h1 span { color: var(--mte-color-ink); box-shadow: inset 0 -.11em var(--mte-color-signal); padding-bottom: .025em; }
.hero-description, .hero-note, .hero-scroll { color: var(--muted); }
.hero-scroll span { color: var(--mte-color-ink); }
.mini-check { color: var(--accent-text); }
.hero-image, .community-photo { background: var(--sage); }
.hero-image:after, .community-photo:after { display: none; }
.hero-image > img, .community-photo img { object-fit: contain; object-position: center; }
.hero-image figcaption, .community-photo figcaption { color: #203b34; }
.image-topline, .photo-index { color: #5a675e; }
.image-caption-mark { color: #203b34; border-color: #b9c4b6; }
.facts, .facts > div + div { border-color: var(--line); }
.fact-label { color: var(--muted); }
.small-arrow { color: var(--mte-color-ink); }
.light-section { background: var(--surface); }
.section-label, .light-section .section-label { color: var(--muted); border-color: var(--line); }
.audience-grid, .audience-item + .audience-item { border-color: var(--line); }
.section-heading > p, .method p, .method > span { color: var(--muted); }
.method { border-color: var(--line); }
.phrase-lab { background: var(--surface); border-color: var(--line); border-radius: 8px; }
.lab-heading .eyebrow { color: var(--muted); }
.lab-symbol { color: var(--mte-color-ink); }
.phrase-tabs { border-color: var(--line); gap: 4px; padding-bottom: 12px; }
.phrase-tabs button { color: var(--muted); padding: 10px 12px; border-radius: 4px; }
.phrase-tabs button:first-child { padding: 10px 12px; }
.phrase-tabs button:hover { background: var(--sage); color: var(--mte-color-ink); }
.phrase-tabs button[aria-selected=true] { background: var(--mte-color-ink); color: var(--mte-color-signal); }
.phrase-tabs button[aria-selected=true]:after { display: none; }
.phrase-panel { background: var(--sage); border: 1px solid #dde4d8; border-radius: 5px; padding: 24px 20px; margin: 20px 0; }
.phrase-counter { color: var(--muted); top: 12px; right: 14px; }
.phrase-uk { color: var(--accent-text); }
.phrase-tip { color: #5a675e; }
.lab-bottom { border-color: var(--line); color: var(--muted); }
.community { background: var(--sage); }
.community-copy > .eyebrow, .community-copy > p { color: #5a675e; }
.community-copy h2 span, .join h2 span { color: var(--mte-color-ink); }
.community-copy h2 span { box-shadow: inset 0 -.1em var(--mte-color-signal); }
.text-link { border-color: #b9c4b6; }
.text-link span { color: var(--mte-color-ink); }
.text-link:hover { border-color: var(--mte-color-ink); }
.faq-list, .faq details { border-color: var(--line); }
.join-description { color: var(--muted); }
.registration-panel { background: var(--surface); border-color: var(--line); border-radius: 8px; }
.registration-top, .registration-panel p, .registration-note { color: var(--muted); }
.registration-top > span:last-child { color: var(--mte-color-ink); }
.button-pending { background: #eaeee4; color: #68745f; border-color: #eaeee4; }
.button-pending > span { color: #68745f; }
.location, .footer { border-color: var(--line); }
.location-label, .location-venue, .footer p, .footer-inner > span { color: var(--muted); }
.location-icon, .map-link > span { color: var(--mte-color-ink); }
.map-link { border-color: #b9c4b6; }
.map-link:hover { border-color: var(--mte-color-ink); }
.back-top { border-color: var(--line); }
.back-top:hover { color: var(--mte-color-ink); background: var(--mte-color-signal); border-color: var(--mte-color-signal); }

@media (max-width: 850px) {
  .phrase-tabs button, .phrase-tabs button:first-child { font-size: 9px; padding: 10px; }
  .phrase-panel { padding: 23px 17px; }
  .phrase-en { font-size: 28px; }
}

@media (max-width: 640px) {
  .hero-image > img { height: calc(100% - 82px); top: 10px; }
  .menu-toggle { color: var(--mte-color-ink); border-color: var(--line); }
  .mobile-nav { border-color: var(--line); }
  .mobile-nav a:last-child { color: var(--accent-text); }
  .phrase-tabs button, .phrase-tabs button:first-child { font-size: 10px; padding: 10px 11px; }
  .phrase-en { font-size: 32px; }
}

@media (max-width: 360px) {
  .phrase-lab { padding: 20px; }
  .phrase-tabs button, .phrase-tabs button:first-child { font-size: 9px; padding: 10px 8px; }
  .phrase-panel { padding: 23px 14px; }
  .phrase-en { font-size: 28px; }
}

/* Readable type and a brighter rhythm, designed around phone screens. */
:root { --muted: #4e5a54; --line: #cdd6c9; }
body { font-size:18px; line-height:1.65; }
.desktop-nav, .nav-cta { font-size:16px; }
.hero-description { font-size:18px; line-height:1.65; max-width:490px; }
.hero-schedule { display:flex; align-items:center; gap:12px; margin-top:26px; padding:14px 18px; background:#f0f6df; border-left:4px solid #91b700; color:#203b34; font-family:Manrope,Arial,sans-serif; font-size:23px; line-height:1.4; font-weight:600; }
.hero-schedule svg { width:26px; height:26px; flex-shrink:0; }
.hero-schedule strong { font-weight:800; white-space:nowrap; }
.hero-eyebrow { font-size:14px; letter-spacing:.6px; }
.button, .hero .button { font-size:18px; min-height:60px; }
.hero-image figcaption { bottom:30px; right:24px; }
.hero-image figcaption p { font-size:18px; }
.facts > div { font-size:17px; gap:20px; }
.fact-label { font-size:14px; letter-spacing:0; text-transform:none; }
.section-label, .light-section .section-label { font-size:14px; letter-spacing:.7px; color:#425345; border-color:var(--line); }
.section-label > span:last-child { font-size:14px; text-align:left; max-width:none; }
.about-copy p, .audience-item p, .method p, .community-copy > p, .faq-intro, .faq-answer, .join-description, .registration-panel p { font-size:18px; line-height:1.65; }
.about-copy .lead { font-size:23px; line-height:1.5; }
.about-copy p { max-width:none; }
.about-grid { gap:64px; }
.audience-grid { gap:24px; border:0; }
.audience-item, .audience-item + .audience-item { display:flex; flex-direction:column; border:1px solid #dce5cf; padding:28px; background:#f0f6df; border-radius:8px; gap:22px; }
.audience-item + .audience-item { background:#f7f7f2; }
.audience-visual { width:150px; height:90px; }
.audience-item h3 { font-size:25px; letter-spacing:-.7px; }
.audience-item p { max-width:none; margin-top:14px; }
.learning { background:#f0f6df; }
.section-heading > p { font-size:18px; line-height:1.65; width:38%; }
.learning-grid { gap:56px; align-items:start; }
.method { gap:20px; padding:26px 0; }
.method > span { display:grid; place-items:center; width:48px; height:48px; flex-shrink:0; background:#dce9bc; border-radius:4px; color:#203b34; font-family:Manrope,Arial,sans-serif; font-size:22px; font-weight:700; padding:0; }
.method h3 { font-size:24px; }
.method p { max-width:none; }
.phrase-lab { padding:30px; border:1px solid #cbd7b6; box-shadow:0 8px 0 #dce9bc; min-height:0; }
.lab-heading h3 { font-size:25px; letter-spacing:-.6px; }
.lab-symbol { font-size:36px; }
.lab-instruction { color:var(--muted); font-size:17px; margin-top:10px; }
.phrase-tabs { margin-top:22px; flex-wrap:wrap; border:0; padding:0; gap:8px; }
.phrase-tabs button, .phrase-tabs button:first-child { font-size:15px; min-height:44px; padding:10px 12px; border:1px solid #cad4bf; color:#203b34; }
.phrase-tabs button[aria-selected=true] { color:#101416; background:#c5fa00; border-color:#86a900; }
.phrase-panel { background:#f7f7f2; border:0; padding:24px; margin:24px 0 0; }
.phrase-en { font-size:40px; min-height:0; line-height:1.2; letter-spacing:-1.2px; }
.phrase-uk { font-size:20px; font-weight:500; color:#203b34; margin-top:22px; }
.phrase-tip { font-size:17px; line-height:1.6; color:var(--muted); margin-top:14px; }
.community { background:#fff; }
.community-photo { border-radius:8px; height:490px; }
.community-photo figcaption { font-size:20px; font-family:Manrope,Arial,sans-serif; font-weight:700; }
.community-copy h2 { margin-top:0; }
.community-copy > p { max-width:none; }
.text-link { font-size:18px; min-height:48px; }
.faq { background:#f7f7f2; }
.faq-list { border:0; display:flex; flex-direction:column; gap:12px; }
.faq details { background:#fff; border:1px solid #d9dfd2; border-radius:6px; padding:0 24px; }
.faq details[open] { border-color:#99ac76; }
.faq summary { font-size:19px; padding:22px 0; }
.faq details[open] .plus { color:#3e6300; }
.faq-answer { padding:0 22px 24px 0; }
.faq-intro { max-width:320px; }
.join { padding-bottom:0; }
.registration-panel { background:#f0f6df; border:1px solid #d0dcb9; padding:30px; }
.registration-top .eyebrow { font-size:14px; letter-spacing:.3px; }
.registration-panel h3 { font-size:34px; }
.registration-note { font-size:20px; color:#203b34; font-weight:600; margin-top:18px; }
.registration-panel .button-lime { width:100%; min-width:0; margin-top:24px; gap:16px; }
.button-pending { font-size:18px; background:#dfe8ce; color:#425536; }
.location-label, .location-venue, .map-link { font-size:16px; }
.location-address { font-size:20px; }
.location-city { font-size:16px; color:var(--muted); margin-top:6px; }
.location { gap:28px; }
.footer-inner > span { font-size:14px; }
.footer p { display:none; }
.back-top { width:46px; height:46px; font-size:22px; }

@media (max-width:1000px) {
  .header-inner { gap:20px; }
  .desktop-nav { display:none; }
  .nav-cta { margin-left:auto; }
  .hero { grid-template-columns:1.1fr 1fr; }
  .hero-description { font-size:18px; }
  .hero-eyebrow { font-size:14px; }
  .hero-image { min-height:620px; }
  .hero-image figcaption { left:20px; gap:12px; }
  .hero-image figcaption p { font-size:16px; }
  .facts { gap:20px; }
  .facts > div { font-size:16px; }
  .facts > div + div { padding-left:20px; }
  .about-grid, .learning-grid, .faq-grid, .join-grid { grid-template-columns:1fr; gap:32px; }
  .about-grid { padding:36px 0; }
  .about-copy .lead { max-width:680px; }
  .section-heading { align-items:start; }
  .section-heading > p { width:40%; }
  .community-grid { gap:36px; }
  .community-copy h2 { font-size:36px; }
  .community-photo { height:420px; }
  .join h2 { font-size:48px; }
  .faq-intro { max-width:none; }
  .location { grid-template-columns:1fr auto; }
  .location-label { grid-column:1/-1; }
}

@media (max-width:640px) {
  .container { width:calc(100% - 40px); }
  .mobile-nav a { font-size:18px; padding:15px 0; }
  .hero { gap:28px; padding-top:22px; }
  .hero-eyebrow { font-size:14px; letter-spacing:.2px; margin-bottom:24px; }
  h1 { font-size:clamp(38px,11.7vw,64px); letter-spacing:-2px; line-height:1.09; }
  .hero-description { font-size:18px; max-width:none; line-height:1.65; margin:24px 0 26px; }
  .hero-schedule { width:100%; font-size:22px; margin-top:24px; padding:14px 16px; gap:12px; }
  .hero .button { width:100%; font-size:18px; min-height:62px; }
  .hero-image { height:360px; min-height:360px; }
  .hero-image > img { height:calc(100% - 74px); top:-8px; }
  .hero-image figcaption { bottom:22px; left:20px; right:18px; gap:12px; }
  .hero-image figcaption p { font-size:17px; line-height:1.45; }
  .image-caption-mark { width:38px; height:38px; flex-shrink:0; }
  .facts { display:flex; flex-direction:column; gap:0; padding:0 0 28px; }
  .facts > div, .facts > div + div { display:flex; justify-content:space-between; align-items:center; gap:12px; font-size:17px; padding:14px 0; border:0; border-bottom:1px solid var(--line); }
  .fact-label { font-size:14px; margin:0; }
  .facts > div:last-child > span:last-child { font-weight:600; color:#203b34; }
  .about, .community, .faq { padding:48px 0; }
  .learning { padding:48px 0 56px; }
  .join { padding-top:48px; }
  .section-label, .light-section .section-label { font-size:14px; padding-bottom:18px; }
  h2, .community-copy h2 { font-size:36px; line-height:1.18; letter-spacing:-1.5px; }
  .about-grid { padding:30px 0; gap:24px; }
  .about-copy .lead { font-size:22px; line-height:1.5; margin-bottom:18px; }
  .about-copy p, .audience-item p, .method p, .community-copy > p, .faq-intro, .faq-answer, .join-description, .registration-panel p { font-size:18px; line-height:1.65; }
  .audience-grid { gap:18px; }
  .audience-item, .audience-item + .audience-item { padding:24px; gap:16px; border:1px solid #dce5cf; }
  .audience-visual { width:130px; height:78px; }
  .audience-item h3 { font-size:25px; line-height:1.25; }
  .audience-item p { margin-top:12px; }
  .section-heading { padding:30px 0 24px; }
  .section-heading > p { font-size:18px; width:auto; margin-top:18px; line-height:1.65; }
  .learning-grid { gap:24px; }
  .method { gap:16px; padding:24px 0; }
  .method > span { width:42px; height:42px; font-size:20px; }
  .method h3 { font-size:23px; line-height:1.3; }
  .method p { margin-top:12px; }
  .phrase-lab { padding:22px; min-height:0; }
  .lab-heading h3 { font-size:24px; }
  .lab-instruction { font-size:17px; }
  .phrase-tabs { display:grid; grid-template-columns:1fr; gap:8px; margin-top:20px; }
  .phrase-tabs button, .phrase-tabs button:first-child { font-size:17px; text-align:left; min-height:48px; padding:10px 14px; }
  .phrase-tabs button[aria-selected=true]:before { content:'✓'; float:right; font-weight:700; }
  .phrase-panel { padding:22px 18px; margin-top:20px; }
  .phrase-en { font-size:clamp(27px,8vw,38px); letter-spacing:-.8px; overflow-wrap:anywhere; }
  .phrase-uk { font-size:19px; }
  .phrase-tip { font-size:17px; }
  .community-grid { gap:28px; }
  .community-photo { height:330px; order:2; }
  .community-photo figcaption { font-size:20px; }
  .community-copy h2 { margin:0 0 22px; }
  .text-link { font-size:18px; margin-top:16px; }
  .faq-grid { padding-top:30px; gap:28px; }
  .faq-intro { margin-top:18px; }
  .faq details { padding:0 20px; }
  .faq summary { font-size:19px; line-height:1.45; gap:16px; padding:20px 0; }
  .plus { width:20px; height:20px; }
  .plus:before, .plus:after { width:18px; top:10px; height:2px; }
  .faq-answer { padding:0 0 22px; }
  .join-grid { padding:30px 0 36px; gap:28px; }
  .join h2 { font-size:38px; }
  .join-description { margin-top:20px; }
  .join-description br, .registration-panel p br { display:none; }
  .registration-panel { padding:24px; }
  .registration-panel h3 { font-size:30px; line-height:1.25; margin:20px 0; }
  .registration-top .eyebrow { font-size:14px; }
  .registration-note { font-size:20px; }
  .button-pending { font-size:18px; min-height:58px; padding:14px; }
  .location { grid-template-columns:1fr; gap:20px; padding:28px 0 36px; }
  .location-label { grid-column:auto; font-size:17px; }
  .location-address { font-size:22px; line-height:1.45; }
  .location-venue { font-size:17px; max-width:none; margin-top:8px; }
  .map-link { font-size:18px; justify-content:space-between; min-height:48px; width:100%; }
  .footer-inner { gap:20px; }
  .footer-inner > span { font-size:14px; }
}

@media (min-width:641px) and (max-width:850px) {
  .hero { grid-template-columns:1fr; }
  .hero-image { height:520px; min-height:520px; }
  .community-grid { grid-template-columns:1fr; }
  .community-copy { max-width:680px; }
}

/* A bright, static conversation poster. */
.hello-poster { background:#c5fa00; color:#101416; padding:28px 30px 32px; border:1px solid #aecf28; border-radius:8px; overflow:hidden; }
.hello-kicker { display:flex; align-items:center; gap:10px; font-size:17px; font-weight:600; line-height:1.5; }
.hello-kicker > span { font-size:27px; line-height:1; }
.hello-art { position:relative; height:245px; margin:24px 0 26px; isolation:isolate; }
.hello-english { position:absolute; top:25px; left:0; width:85%; background:#203b34; color:#c5fa00; padding:20px 16px 26px; font-family:Manrope,Arial,sans-serif; font-weight:800; font-size:clamp(62px,6.7vw,90px); letter-spacing:-5px; line-height:1; text-align:center; border-radius:6px; transform:rotate(-5deg); }
.hello-english:after { content:''; position:absolute; bottom:-21px; left:34px; width:30px; height:28px; background:#203b34; clip-path:polygon(0 0,100% 0,0 100%); }
.hello-ukrainian { position:absolute; bottom:8px; right:0; padding:17px 26px; background:#f7f7f2; color:#203b34; border:2px solid #203b34; border-radius:6px; font-family:Manrope,Arial,sans-serif; font-size:34px; font-weight:700; line-height:1.2; letter-spacing:-1px; transform:rotate(5deg); box-shadow:5px 6px 0 #203b34; }
.hello-ukrainian:after { content:''; position:absolute; right:24px; bottom:-15px; width:22px; height:22px; background:#f7f7f2; border-right:2px solid #203b34; border-bottom:2px solid #203b34; transform:skewY(30deg); clip-path:polygon(0 0,100% 0,100% 100%); }
.hello-spark { position:absolute; width:48px; height:48px; right:0; top:0; color:#203b34; transform:rotate(10deg); }
.hello-swoop { position:absolute; width:80px; height:64px; left:20px; bottom:0; color:#203b34; }
.hello-copy { border-top:1px solid #8ba925; padding-top:25px; }
.hello-copy h3 { font-family:Manrope,Arial,sans-serif; font-size:32px; font-weight:800; line-height:1.15; letter-spacing:-1px; }
.hello-copy p { font-size:19px; line-height:1.55; color:#203b34; margin-top:16px; }
@media (max-width:1000px) and (min-width:641px) {
  .hello-poster { display:grid; grid-template-columns:1fr 1fr; column-gap:36px; align-items:center; }
  .hello-kicker { grid-column:1/-1; }
  .hello-art { width:100%; margin-bottom:0; }
  .hello-copy { border:0; padding:0; }
  .hello-english { font-size:76px; }
}
@media (max-width:640px) {
  .hello-poster { padding:23px 24px 28px; }
  .hello-art { height:222px; margin:24px 0 22px; }
  .hello-english { font-size:clamp(58px,18vw,94px); letter-spacing:-4px; padding:20px 10px 24px; }
  .hello-ukrainian { font-size:31px; padding:15px 21px; bottom:7px; }
  .hello-spark { width:40px; height:40px; }
  .hello-swoop { left:8px; width:64px; height:52px; bottom:5px; }
  .hello-copy h3 { font-size:30px; }
  .hello-copy p { font-size:19px; }
}
@media (max-width:360px) {
  .hello-poster { padding:22px 18px 26px; }
  .hello-kicker { font-size:16px; }
  .hello-art { height:210px; }
  .hello-english { font-size:58px; }
  .hello-ukrainian { font-size:28px; padding:13px 18px; }
  .hello-copy h3 { font-size:27px; }
}

.fact-audience { font-weight:600; line-height:1.45; }
.fact-audience-note { display:block; font-size:16px; line-height:1.5; font-weight:400; color:#4e5a54; margin-top:5px; max-width:240px; }
@media (max-width:640px) {
  .facts .fact-audience { text-align:right; max-width:calc(100% - 76px); }
  .fact-audience-note { font-size:16px; }
}