@font-face{font-family:"Baloo 2";src:url(assets/Baloo2-ExtraBold.ttf) format("truetype");font-weight:800;font-display:swap}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font-family:"Baloo 2",system-ui,sans-serif;color:#24304a;background:#fffaf0;line-height:1.45}
h1,h2,h3,.logo,.btn,nav a,b{font-weight:800}
p{font-family:system-ui,-apple-system,"Segoe UI",sans-serif}
.hero{text-align:center;padding:1rem 1rem 2.5rem;background:linear-gradient(160deg,#e3f2ff,#fff4d6 55%,#ffe3ef)}
nav{display:flex;flex-wrap:wrap;justify-content:center;gap:.4rem 1.1rem;margin-bottom:1rem}
nav a{color:#1E88E5;text-decoration:none}
.avatar{width:96px;height:96px;border-radius:50%;border:5px solid #fff;box-shadow:0 6px 18px #0002}
.logo{font-size:3rem;letter-spacing:.06em;line-height:1;text-shadow:0 3px 0 #fff,0 5px 10px #0002}
.logo.small{font-size:2rem}
h1{font-size:2.6rem;margin:.2rem 0 0;color:#24304a;line-height:1.05}
.line{font-family:"Baloo 2";font-weight:800;font-size:1.4rem;color:#1E88E5;margin:.2rem 0}
.tag{margin:0 0 1rem;color:#EC407A;font-weight:700}
.banner{width:100%;max-width:1000px;height:auto;border-radius:22px;box-shadow:0 10px 30px #0002;display:block;margin:0 auto 1.5rem}
.btn{display:inline-block;border:0;cursor:pointer;font-family:inherit;font-size:1.1rem;color:#fff;background:#1E88E5;padding:.7rem 1.4rem;border-radius:999px;text-decoration:none;box-shadow:0 4px 0 #0003}
.btn.yt{background:#e62117}
section{padding:3rem 1rem;text-align:center}section.alt{background:#fff}
h2{font-size:2.1rem;margin:0;line-height:1.1}.sub{margin:.3rem 0 1.6rem;color:#5a6680}
.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;max-width:1100px;margin:auto}
.card{background:#fff;border-radius:22px;padding:1rem .8rem;border-top:8px solid var(--c);box-shadow:0 6px 18px #0001}
.pic{height:190px;display:flex;align-items:flex-end;justify-content:center;background:radial-gradient(circle at 50% 70%,color-mix(in srgb,var(--c) 25%,#fff),#fff 70%);border-radius:16px}
.pic img{max-height:180px;max-width:100%}
.card h3{font-size:1.7rem;margin:.4rem 0 0;color:var(--c);line-height:1}
.role{margin:.1rem 0;font-weight:700}.topic{display:inline-block;margin:.3rem 0;background:var(--c);color:#fff;padding:.1rem .7rem;border-radius:999px;font-size:.9rem}
.q{font-size:.9rem;color:#5a6680;margin:.3rem 0 0}
.shorts{display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;padding:.5rem .2rem 1rem;max-width:1100px;margin:0 auto 1.2rem}
.short{flex:0 0 220px;aspect-ratio:9/16;scroll-snap-align:center;border-radius:18px;overflow:hidden;background:#222;box-shadow:0 6px 18px #0002}
.short iframe{width:100%;height:100%;border:0}
.signup{max-width:520px;margin:auto;background:#fff;padding:1.4rem;border-radius:22px;box-shadow:0 6px 18px #0001;text-align:left;border:3px dashed #F7B500}
.signup label{font-weight:700;font-family:system-ui}.row{display:flex;gap:.5rem;margin:.4rem 0 .8rem;flex-wrap:wrap}
.row input{flex:1 1 200px;font-size:1rem;padding:.7rem 1rem;border-radius:999px;border:2px solid #cfd8e6}
.chk{display:flex;gap:.5rem;font-weight:400!important;font-size:.9rem}
.note{font-size:.88rem;background:#fff6dc;padding:.7rem;border-radius:12px}
.draft{color:#c0392b;font-size:.8rem;font-weight:700}
.pgrid{display:grid;gap:1rem;max-width:1000px;margin:1.5rem auto 0;text-align:left}
.pgrid div{background:#f3f8ff;border-radius:18px;padding:1rem 1.2rem}.pgrid b{font-size:1.2rem}.pgrid p{margin:.3rem 0 0}
footer{text-align:center;padding:2rem 1rem;background:#24304a;color:#dfe6f3;font-size:.92rem}footer a{color:#ffd166}
@media(min-width:760px){.logo{font-size:4.5rem}h1{font-size:3.6rem}.cards{grid-template-columns:repeat(3,1fr)}.pic{height:240px}.pic img{max-height:230px}.pgrid{grid-template-columns:1fr 1fr}.shorts{justify-content:center;flex-wrap:wrap;overflow:visible}.short{flex-basis:200px}}
@media(min-width:1100px){.cards{grid-template-columns:repeat(6,1fr)}}