/* HUE Youth: Mundial headings, Articulat CF body, and room to breathe. */
.youth-page{--youth-yellow:#ffe000;background:#fff;color:#000}
.youth-page p{color:inherit}
.youth-page h1,.youth-page h2,.youth-page h3{font-weight:600}
.youth-page h1 br,.youth-page h2 br{display:initial}
.youth-wrap{width:min(100%,1264px);margin-inline:auto;padding-inline:40px}
.youth-page a:focus-visible,.youth-page summary:focus-visible{outline:3px solid #a18c00;outline-offset:6px}
.youth-page a{touch-action:manipulation}
.youth-skip{position:absolute;top:-80px;left:20px;background:var(--youth-yellow);color:#000;padding:12px 20px;z-index:10}
.youth-skip:focus{top:12px}
.youth-header{background:#000;color:#fff}
.youth-header__inner{display:flex;align-items:center;justify-content:space-between;gap:30px;min-height:100px}
.youth-logo{font:600 25px/1 var(--font-heading);letter-spacing:-.055em;text-decoration:none;white-space:nowrap}
.youth-header nav{display:flex;align-items:center;gap:30px;font-size:14px}
.youth-header nav a{text-decoration:none}
.youth-header nav a:hover{text-decoration:underline;text-underline-offset:5px}
.youth-nav-cta{border-bottom:1px solid var(--youth-yellow);padding-bottom:5px}
.youth-nav-cta span{color:var(--youth-yellow);margin-left:12px}
.youth-hero{background:#000;color:#fff;padding:58px 0 48px}
.youth-eyebrow{font:600 12px/1.5 var(--font-heading);letter-spacing:.14em;text-transform:uppercase}
.youth-hero .youth-eyebrow{color:var(--youth-yellow);margin-bottom:28px}
.youth-eyebrow>span{padding-inline:14px}
.youth-hero h1{color:#fff;font-size:clamp(3.6rem,7.9vw,7.15rem);line-height:1.01;letter-spacing:-.065em;text-wrap:initial}
.youth-hero__intro{display:flex;align-items:center;justify-content:space-between;gap:60px;margin:32px 0 52px}
.youth-hero__intro p{max-width:650px;font-size:19px;line-height:1.65}
.youth-button{display:inline-flex;align-items:center;justify-content:center;gap:30px;min-height:58px;padding:17px 26px;border-radius:100px;background:var(--youth-yellow);color:#000;flex-shrink:0;font:600 15px/1.4 var(--font-heading);text-decoration:none;transition:box-shadow .2s ease}
.youth-button:hover{box-shadow:0 0 0 2px currentColor}
.youth-details{display:grid;grid-template-columns:1fr 1.15fr 1fr;gap:42px;border-top:1px solid #494949;padding-top:29px}
.youth-details dt{font-size:12px;margin-bottom:12px}
.youth-details dd{font:600 21px/1.55 var(--font-heading);letter-spacing:-.025em}
.youth-details dd span{font:400 16px/1.6 var(--font-body);letter-spacing:0}
.youth-details>div:first-child dd>span,.youth-details>div:last-child dd>a>span{display:block}
.youth-details>div:nth-child(2) dd>span{margin-left:7px}
.youth-details dd a{text-decoration:none}
.youth-details dd a:hover{text-decoration:underline;text-underline-offset:5px}
.youth-purpose{padding-top:100px;padding-bottom:100px}
.youth-section-heading{display:grid;grid-template-columns:1fr 1fr;column-gap:80px;align-items:end}
.youth-section-heading>.youth-eyebrow{grid-column:1/-1;margin-bottom:22px}
.youth-section-heading h2,.youth-signup h2,.youth-faq h2{font-size:clamp(2.45rem,4.4vw,4rem);line-height:1.08;letter-spacing:-.045em}
.youth-section-heading>p:last-child{font-size:19px;max-width:490px;line-height:1.7}
.youth-pillars{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));list-style:none;gap:32px;margin-top:62px}
.youth-pillars li{border-top:1px solid #000;padding-top:19px}
.youth-pillars li>span{display:block;font-size:12px;margin-bottom:32px}
.youth-pillars h3{font-size:28px;margin-bottom:14px}
.youth-pillars p{font-size:16px;line-height:1.6;max-width:230px}
.youth-signup{background:var(--youth-yellow);padding:76px 0;scroll-margin-top:20px}
.youth-signup__inner{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.youth-signup .youth-eyebrow{margin-bottom:22px}
.youth-signup__action>p:first-child{font-size:20px;max-width:475px;line-height:1.6;margin-bottom:24px}
.youth-button--black{background:#000;color:#fff}
.youth-signup__action .youth-note{font-size:14px;line-height:1.6;margin-top:18px;max-width:400px}
.youth-faq{display:grid;grid-template-columns:1fr 1.3fr;gap:90px;padding-top:96px;padding-bottom:100px}
.youth-faq .youth-eyebrow{margin-bottom:20px}
.youth-faq__list details{border-top:1px solid #bbb;padding:23px 0}
.youth-faq__list details:last-child{border-bottom:1px solid #bbb}
.youth-faq summary{position:relative;list-style:none;font:600 18px/1.5 var(--font-heading);letter-spacing:-.02em;cursor:pointer;padding-right:30px}
.youth-faq summary::-webkit-details-marker{display:none}
.youth-faq summary::after{content:'+';position:absolute;right:0;top:-2px;font:400 26px/1.2 var(--font-body)}
.youth-faq details[open] summary::after{content:'−'}
.youth-faq details p{font-size:16px;line-height:1.7;margin-top:15px;max-width:550px}
.youth-faq details a{text-underline-offset:4px}
.youth-footer{border-top:1px solid #ddd;padding:36px 0}
.youth-footer__inner{display:flex;align-items:center;justify-content:space-between;gap:35px}
.youth-footer p{font-size:13px;margin-top:8px}
.youth-footer nav{display:flex;align-items:center;gap:28px;font-size:14px;flex-wrap:wrap}
.youth-footer nav a{text-decoration:none}
.youth-footer nav a:hover{text-decoration:underline;text-underline-offset:4px}
@media(max-width:900px){
  .youth-wrap{padding-inline:28px}
  .youth-hero__intro{gap:34px}
  .youth-hero__intro p{font-size:18px}
  .youth-details{gap:24px}
  .youth-details dd{font-size:18px}
  .youth-details dd span{font-size:14px}
  .youth-section-heading,.youth-signup__inner{gap:36px}
  .youth-pillars{gap:22px}
  .youth-pillars h3{font-size:24px}
  .youth-faq{gap:45px;grid-template-columns:.8fr 1.2fr}
}
@media(max-width:640px){
  .youth-wrap{padding-inline:22px}
  .youth-header__inner{min-height:83px;gap:20px}
  .youth-logo{font-size:22px}
  .youth-header nav{gap:18px;font-size:13px}
  .youth-header nav>a:first-child,.youth-header nav>a:nth-child(2){display:none}
  .youth-nav-cta span{margin-left:5px}
  .youth-hero{padding:30px 0 38px}
  .youth-hero .youth-eyebrow{margin-bottom:23px;font-size:11px}
  .youth-hero h1{font-size:clamp(2.8rem,10.5vw,4.8rem);letter-spacing:-.06em}
  .youth-hero__intro{display:block;margin:24px 0 35px}
  .youth-hero__intro p{font-size:17px;line-height:1.6;margin-bottom:25px}
  .youth-button{min-height:54px;padding:15px 24px;font-size:14px}
  .youth-details{grid-template-columns:1fr 1fr;gap:24px 20px;padding-top:25px}
  .youth-details dt{font-size:11px;margin-bottom:8px}
  .youth-details dd{font-size:16px}
  .youth-details>div:nth-child(2) dd>span{margin-left:2px;font-size:13px}
  .youth-details>div:last-child{grid-column:1/-1}
  .youth-details>div:last-child dd>a>span{display:inline;margin-left:6px}
  .youth-purpose{padding-top:57px;padding-bottom:57px}
  .youth-section-heading,.youth-signup__inner{grid-template-columns:1fr;gap:23px}
  .youth-section-heading>.youth-eyebrow{margin-bottom:0}
  .youth-section-heading h2,.youth-signup h2,.youth-faq h2{font-size:clamp(2.1rem,8.5vw,3.1rem)}
  .youth-section-heading>p:last-child{font-size:17px}
  .youth-pillars{grid-template-columns:1fr 1fr;gap:32px 22px;margin-top:35px}
  .youth-pillars li>span{margin-bottom:22px}
  .youth-pillars h3{font-size:23px;margin-bottom:12px}
  .youth-pillars p{font-size:15px;line-height:1.55}
  .youth-signup{padding:48px 0}
  .youth-signup .youth-eyebrow{margin-bottom:19px}
  .youth-signup__action>p:first-child{font-size:18px}
  .youth-signup__action .youth-note{font-size:13px}
  .youth-faq{grid-template-columns:1fr;gap:28px;padding-top:56px;padding-bottom:57px}
  .youth-faq summary{font-size:17px}
  .youth-footer__inner{align-items:flex-start;flex-direction:column;gap:27px}
  .youth-footer nav{font-size:13px;gap:22px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.youth-button{transition:none}}