:root{--navy:#1E3557;--sky:#6ECFF6;--yellow:#FFD86B;--softred:#FF6666;--ink:#0f172a;--muted:#475569;--bg:#f8fafc;--card:#ffffff}
*{box-sizing:border-box}
body{margin:0;font-family:Poppins,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu;color:var(--ink);background:linear-gradient(180deg,#eaf6ff,#fff 35%,#fff7e2);
  text-align:center; display:flex; flex-direction:column; align-items:center; justify-content:flex-start;}
.container{max-width:1120px;margin:0 auto; padding:0 20px; text-align:center;}
.hero{background:radial-gradient(1200px 600px at 20% -10%,#dff3ff 0%,#fff 60%),linear-gradient(90deg,#eaf6ff,#fff);border-bottom:1px solid #e5e7eb; width:100%;}
.hero-inner{padding:40px 0 30px}
.hero-center{display:flex;flex-direction:column;align-items:center;justify-content:center}
.site-logo{width:180px;height:auto;margin:0 0 10px 0;display:block;transition:transform .3s ease}
.site-logo:hover{transform:scale(1.03)}
.title{font-size: clamp(36px,6vw,56px); font-weight:800; color:var(--ink); margin:0 0 8px}
.tagline{font-size:clamp(16px,2.4vw,22px); margin:0 0 8px}
.sub{max-width:780px; color:var(--muted); margin:8px auto 0}
.btn{display:inline-flex; align-items:center; gap:8px; padding:12px 16px; border-radius:14px; text-decoration:none; font-weight:600}
.btn.primary{background:var(--yellow); color:#111827; box-shadow:0 2px 0 rgba(0,0,0,.06); margin-top:16px}
.btn.dark{background:var(--ink); color:#fff}
.btn.small{padding:10px 14px; font-size:14px}
.about{background:#f1f9ff; border-top:1px solid #e5e7eb; border-bottom:1px solid #e5e7eb; width:100%;}
.about-inner{display:grid; grid-template-columns:1fr; gap:16px; padding:28px 0}
@media(min-width:860px){.about-inner{grid-template-columns:1.1fr .9fr}}
.card{background:var(--card); border-radius:16px; padding:16px; box-shadow:0 1px 0 rgba(0,0,0,.05); border:1px solid #e5e7eb}
.bold{font-weight:700}.muted{color:var(--muted)}.small{font-size:14px}
.videos{padding:38px 0 60px; width:100%;}
.videos-head{display:flex; justify-content:space-between; align-items:flex-end; gap:16px}
.grid{display:grid; grid-template-columns:1fr; gap:18px; margin-top:14px}
@media(min-width:860px){.grid{grid-template-columns:1fr 1fr}}
.card-video{background:#fff; border-radius:16px; overflow:hidden; border:1px solid #e5e7eb; box-shadow:0 1px 0 rgba(0,0,0,.04)}
.aspect-video{position:relative; width:100%; padding-top:56.25%; background:#f1f5f9}
.aspect-video iframe,.aspect-video blockquote{position:absolute; left:0; top:0; width:100%; height:100%}
.card-body{padding:14px}
.card-title{margin:0; font-weight:600}
.card-desc{margin:6px 0 0; color:var(--muted); font-size:14px}
.footer{border-top:1px solid #e5e7eb; background:#fff8e8; width:100%;}
.footer-inner{display:flex; justify-content:space-between; align-items:center; padding:18px 0}
/* Social links with colored icons */
.socials{display:flex; justify-content:center; flex-wrap:wrap; gap:12px; margin:16px 0 0}
.badge{display:inline-flex; align-items:center; gap:8px; padding:10px 14px; border:1px solid #e5e7eb; border-radius:12px; background:#fff; color:#111; text-decoration:none; font-weight:600; transition:.25s}
.badge:hover{background:#f1f5f9; transform:translateY(-2px)}
.social-icon{width:18px; height:18px; display:inline-block}