/* ===== Youth hero (deep teal) ===== */
.page-id-642 [data-id="5500176b"] {
  position:relative; overflow:hidden; isolation:isolate;
  background:
    radial-gradient(ellipse 60% 70% at 15% 20%, rgba(15,108,120,.85) 0%, rgba(15,108,120,0) 60%),
    radial-gradient(ellipse 50% 60% at 90% 85%, rgba(216,164,65,.28) 0%, rgba(216,164,65,0) 60%),
    linear-gradient(160deg, #163A3F 0%, #1D3F44 40%, #245C63 100%) !important;
  padding-top:110px !important; padding-bottom:120px !important;
}
/* dot grid texture */
.page-id-642 [data-id="5500176b"]::before {
  content:''; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background-image:radial-gradient(rgba(255,255,255,.13) 1.2px, transparent 1.4px);
  background-size:22px 22px;
  -webkit-mask-image:linear-gradient(180deg, rgba(0,0,0,.9), rgba(0,0,0,.2));
          mask-image:linear-gradient(180deg, rgba(0,0,0,.9), rgba(0,0,0,.2));
}
.page-id-642 [data-id="5500176b"] > * { position:relative; z-index:2; }

/* glowing blobs */
.yth-blob { position:absolute !important; z-index:0 !important; border-radius:50%; filter:blur(50px); opacity:.55; pointer-events:none; }
.yth-blob.b1 { width:380px; height:380px; background:#0F8A99; top:-120px; left:-100px; animation:yth6098Drift1 14s ease-in-out infinite; }
.yth-blob.b2 { width:300px; height:300px; background:#D8A441; bottom:-140px; right:-60px; opacity:.38; animation:yth6098Drift2 17s ease-in-out infinite; }
.yth-blob.b3 { width:220px; height:220px; background:#3FB6A8; top:30%; right:18%; opacity:.25; animation:yth6098Drift1 20s ease-in-out infinite reverse; }
@keyframes yth6098Drift1 { 0%,100% { transform:translate(0,0) scale(1); } 50% { transform:translate(60px,40px) scale(1.12); } }
@keyframes yth6098Drift2 { 0%,100% { transform:translate(0,0) scale(1); } 50% { transform:translate(-50px,-30px) scale(1.08); } }

/* doodles */
.yth-doodle { position:absolute !important; z-index:1 !important; pointer-events:none; opacity:.9; }
.yth-doodle svg { display:block; width:100%; height:100%; }
.yth-doodle.d1 { width:46px; height:46px; top:18%; left:12%; animation:yth6098Float 6s ease-in-out infinite, yth6098Spin 18s linear infinite; }
.yth-doodle.d2 { width:120px; height:34px; top:26%; right:10%; animation:yth6098Float 7s ease-in-out infinite .6s; }
.yth-doodle.d3 { width:60px; height:60px; bottom:16%; left:8%; animation:yth6098Float 8s ease-in-out infinite 1.2s; }
.yth-doodle.d4 { width:30px; height:30px; bottom:24%; right:16%; animation:yth6098Float 5.5s ease-in-out infinite .3s, yth6098Spin 12s linear infinite reverse; }
.yth-doodle.d5 { width:24px; height:24px; top:14%; right:30%; animation:yth6098Twinkle 2.8s ease-in-out infinite; }
.yth-doodle.d6 { width:18px; height:18px; bottom:34%; left:24%; animation:yth6098Twinkle 3.4s ease-in-out infinite 1s; }
@keyframes yth6098Float { 0%,100% { translate:0 0; } 50% { translate:0 -16px; } }
@keyframes yth6098Spin { to { rotate:360deg; } }
@keyframes yth6098Twinkle { 0%,100% { opacity:.25; scale:.7; } 50% { opacity:1; scale:1.15; } }

/* eyebrow pill */
.page-id-642 [data-id="5500176b"] .hm-eyebrow { display:inline-block; width:fit-content; margin-left:auto; margin-right:auto; padding:6px 16px; border:1.5px solid rgba(216,164,65,.6); border-radius:999px; background:rgba(216,164,65,.1); transition:background .25s ease; }
.page-id-642 [data-id="5500176b"] .hm-eyebrow:hover { background:rgba(216,164,65,.25); }

/* big title */
.page-id-642 [data-id="5500176b"] .hm-title {
  font-size:clamp(72px, 15vw, 190px) !important; font-weight:900 !important; line-height:.92 !important;
  letter-spacing:.04em !important; text-transform:uppercase; margin:18px 0 10px !important;
  color:#fff; position:relative; display:inline-block; width:fit-content; margin-left:auto !important; margin-right:auto !important;
}
.yth-letter { display:inline-block; opacity:0; transform:translateY(-80px) rotate(-12deg); animation:yth6098Drop .8s cubic-bezier(.2,1.4,.4,1) forwards; animation-delay:calc(var(--i) * .09s + .15s);
  background:linear-gradient(100deg, #FFFFFF 0%, #FFFFFF 38%, #F2CF86 48%, #D8A441 52%, #FFFFFF 62%, #FFFFFF 100%); background-size:250% 100%; background-position:100% 0;
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; cursor:default; transition:transform .25s cubic-bezier(.2,1.6,.4,1); }
.yth-shine .yth-letter { animation:yth6098Drop .8s cubic-bezier(.2,1.4,.4,1) forwards, yth6098Shine 5s ease-in-out infinite; animation-delay:calc(var(--i) * .09s + .15s), calc(var(--i) * .12s + 1.4s); }
@keyframes yth6098Drop { to { opacity:1; transform:translateY(0) rotate(0); } }
@keyframes yth6098Shine { 0%,55% { background-position:100% 0; } 85%,100% { background-position:0% 0; } }
.yth-letter.is-pop { transform:translateY(-14px) rotate(var(--r,-6deg)) scale(1.08) !important; }
/* outlined echo behind title */
.yth-echo { position:absolute; inset:0; z-index:-1; color:transparent; -webkit-text-stroke:2px rgba(216,164,65,.45); transform:translate(10px,10px); pointer-events:none; letter-spacing:inherit; white-space:nowrap; opacity:0; animation:yth6098Fade .8s ease forwards 1s; }
@keyframes yth6098Fade { to { opacity:1; } }

/* grades sticker */
.yth-sticker { position:absolute; top:-6px; right:-38px; transform:rotate(12deg) scale(0); background:#D8A441; color:#1D3F44; font-family:Montserrat, sans-serif; font-weight:800; font-size:clamp(11px, 1.3vw, 15px); letter-spacing:1px; text-transform:uppercase; padding:8px 14px; border-radius:999px; box-shadow:0 8px 20px rgba(0,0,0,.25); -webkit-text-fill-color:#1D3F44; line-height:1.1; white-space:nowrap; animation:yth6098Stick .6s cubic-bezier(.2,1.8,.4,1) forwards 1.1s, yth6098Wiggle 4s ease-in-out infinite 2.2s; }
@keyframes yth6098Stick { to { transform:rotate(12deg) scale(1); } }
@keyframes yth6098Wiggle { 0%,88%,100% { transform:rotate(12deg) scale(1); } 92% { transform:rotate(4deg) scale(1.08); } 96% { transform:rotate(16deg) scale(1.04); } }

/* lead */
.page-id-642 [data-id="5500176b"] .hm-lead { max-width:760px; margin-left:auto !important; margin-right:auto !important; opacity:0; transform:translateY(16px); animation:yth6098Up .8s ease forwards .9s; }
@keyframes yth6098Up { to { opacity:1; transform:none; } }

/* scroll cue */
.yth-cue { position:absolute !important; left:50%; bottom:26px; transform:translateX(-50%); width:30px; height:48px; border:2px solid rgba(255,255,255,.55); border-radius:20px; cursor:pointer; z-index:3 !important; background:none; padding:0; }
.yth-cue::after { content:''; position:absolute; left:50%; top:9px; width:5px; height:10px; margin-left:-2.5px; border-radius:3px; background:#D8A441; animation:yth6098Cue 1.8s ease-in-out infinite; }
@keyframes yth6098Cue { 0% { transform:translateY(0); opacity:1; } 70% { transform:translateY(16px); opacity:0; } 100% { transform:translateY(0); opacity:0; } }

@media (max-width:767px) {
  .page-id-642 [data-id="5500176b"] { padding-top:70px !important; padding-bottom:96px !important; }
  .yth-sticker { right:-14px; top:-18px; }
  .yth-doodle.d2 { width:80px; top:10%; right:4%; }
  .yth-doodle.d1 { top:8%; left:6%; }
  .yth-doodle.d3 { bottom:8%; left:4%; width:44px; height:44px; }
  .yth-blob.b3 { display:none; }
}
@media (prefers-reduced-motion: reduce) {
  .yth-letter, .yth-echo, .yth-sticker, .page-id-642 [data-id="5500176b"] .hm-lead { animation:none !important; opacity:1 !important; transform:none !important; }
  .yth-sticker { transform:rotate(12deg) !important; }
  .yth-blob, .yth-doodle, .yth-cue::after { animation:none !important; }
}
