@property --kne-a{syntax:"<angle>";inherits:false;initial-value:0deg}

.kne-gb{
  position:relative;padding:2px;border-radius:30px 30px 30px 8px;
  background:conic-gradient(from var(--kne-a),var(--kne-accent,#1FB5A3),transparent 28%,var(--kne-accent-2,#E9A23B) 52%,transparent 78%,var(--kne-accent,#1FB5A3));
  animation:kne-gb-spin 10s linear infinite;
}
@keyframes kne-gb-spin{to{--kne-a:360deg}}

.kne-gb__in{
  position:relative;overflow:hidden;padding:clamp(26px,4vw,44px);
  border-radius:28px 28px 28px 6px;background:var(--kne-ink,#0E2238);color:#EAF1F6;
}
.kne-gb__in::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .5s;
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,0%),rgba(31,181,163,.22),transparent 62%);
}
.kne-gb:hover .kne-gb__in::before{opacity:1}
.kne-gb__in > *{position:relative}

.kne-gb__badge{
  display:inline-block;margin-bottom:16px;padding:5px 14px;border-radius:99px;
  background:rgba(233,162,59,.14);color:var(--kne-accent-2,#E9A23B);font-size:13px;font-weight:700;
  border:1px solid rgba(233,162,59,.4);
}
.kne-gb__title{margin:0 0 12px;color:#fff;font-size:clamp(1.4rem,2.6vw,2rem);line-height:1.5;font-weight:800}
.kne-gb__text{margin:0 0 22px;max-width:46ch;color:#B7C6D4;font-size:1rem;line-height:2}
.kne-gb__extra{margin:0 0 22px;color:#B7C6D4;line-height:2}
.kne-gb__btn{
  display:inline-block;padding:12px 26px;border-radius:14px 14px 14px 4px;text-decoration:none;
  background:var(--kne-accent,#1FB5A3);color:#06211E;font-weight:800;font-size:.95rem;
  transition:transform .35s var(--kne-ease,ease),box-shadow .35s;
}
.kne-gb__btn:hover{transform:translateY(-3px);box-shadow:0 12px 24px -10px var(--kne-accent,#1FB5A3)}
.kne-gb__btn:focus-visible{outline:2px solid var(--kne-accent-2,#E9A23B);outline-offset:3px}

@media (prefers-reduced-motion:reduce){.kne-gb{animation:none}}