:root{
    --cream:#F5EEDC;
    --cream-deep:#EDE2C8;
    --ink:#1E2A38;
    --ink-soft:#4A5A6A;
    --pink:#EC4C79;
    --pink-deep:#D6335F;
    --blue:#4FB6E0;
    --orange:#F5A94E;
    --white:#FFFDF8;
    --line:#DDD0AC;
    --shadow: 0 18px 40px -20px rgba(30,42,56,.35);
    --radius: 22px;
  }
  .ks h1,.ks h2,.ks h3,.ks .wordmark{font-family:'Fredoka', sans-serif; font-weight:600; letter-spacing:-0.01em;}
  .ks{font-family:'Manrope', sans-serif; color:var(--ink); line-height:1.5;}
  .ks a{color:inherit; text-decoration:none;}
  .ks .wrap{max-width:1180px; margin:0 auto; padding:0 32px;}

  .ks .eyebrow{
    font-size:13px; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
    color:var(--pink-deep); display:inline-flex; align-items:center; gap:8px; margin-bottom:14px;
  }
  .ks .eyebrow::before{content:""; width:22px; height:2px; background:var(--pink-deep); display:inline-block; border-radius:2px;}

  .ks .btn{
    display:inline-flex; align-items:center; justify-content:center; gap:8px;
    padding:16px 30px; border-radius:100px; font-weight:800; font-size:16px;
    background:var(--pink); color:#fff; border:none; cursor:pointer;
    box-shadow:0 14px 28px -12px rgba(214,51,95,.55);
    transition:transform .18s ease, box-shadow .18s ease, background .18s ease;
    white-space:nowrap;
  }
  .ks .btn:hover{transform:translateY(-2px); background:var(--pink-deep); box-shadow:0 18px 34px -12px rgba(214,51,95,.65);}
  .ks .btn.ghost{background:transparent; color:var(--ink); border:2px solid var(--ink); box-shadow:none;}
  .ks .btn.ghost:hover{background:var(--ink); color:var(--white);}
  .ks .btn.on-dark{background:var(--white); color:var(--ink); box-shadow:none;}
  .ks .btn.on-dark:hover{background:var(--pink); color:#fff;}

  .ks .ball{
    --s: 46px; width:var(--s); height:var(--s); position:relative; flex-shrink:0;
    border-radius:50%; overflow:hidden;
    background: conic-gradient(from 210deg, var(--blue) 0deg 90deg, var(--orange) 90deg 200deg, var(--pink) 200deg 360deg);
  }
  .ks .ball::before{
    content:""; position:absolute; inset:-10%; border-radius:50%;
    background: repeating-conic-gradient(from -20deg, transparent 0 24deg, rgba(255,253,248,.9) 24deg 25.5deg);
    mix-blend-mode:screen; opacity:.55;
  }
  .ks .ball.lg{--s:120px;}
  .ks .ball.xl{--s:220px;}

  .ks .logo{display:flex; align-items:center; gap:12px;}
  .ks .logo .wordmark{font-size:20px; line-height:1; color:var(--pink); font-weight:700;}
  .ks .logo .wordmark span{display:block; color:var(--ink);}

  .ks .section-head{max-width:640px; margin-bottom:44px;}
  .ks .section-head h2{font-size:clamp(28px,3.4vw,40px);}
  .ks .section-head p{margin-top:14px; color:var(--ink-soft); font-size:16.5px;}

  .ks-section{background:var(--cream); padding:88px 0;}
  max-width:720px{ .ks-section{padding:60px 0;} }
</style>