@keyframes cgb-homedemo-badge-bounce { 0%, to { transform: rotate(12deg) scale(1) } 45% { transform: rotate(7deg) scale(1.13) } 72% { transform: rotate(14deg) scale(.97) } }
.cgb-homedemo .demo-cta__button:hover span { animation-name: cgb-homedemo-badge-bounce; }
.cgb-homedemo .container { width:min(1440px,100vw);margin:0 auto;padding-inline:50px }
.cgb-homedemo .button { display:inline-flex;min-height:42px;align-items:center;justify-content:center;padding:11px 20px;border:1px solid #0389cb;border-radius:5px;font-size:16px;font-weight:500;line-height:1;letter-spacing:-.04em;text-decoration:none;transition:color .25s,background-color .25s,transform .45s cubic-bezier(.22,1.35,.36,1) }
.cgb-homedemo .button:hover { transform:translateY(-2px) }
.cgb-homedemo .button:active { transform:scale(.96) }
.cgb-homedemo .button--primary { color:#fff;background:#0389cb }
.cgb-homedemo .button--secondary { color:#0389cb;background:transparent }
.cgb-homedemo .button.hero__button { min-height:64px }
.cgb-homedemo .demo-cta { background:#f3f3f3 }
.cgb-homedemo .demo-cta .container { padding-block:50px }
.cgb-homedemo .demo-cta__panel { position:relative;display:flex;overflow:hidden;min-height:1122px;padding:40px;flex-direction:column;align-items:center;gap:50px;border-radius:32px;background:radial-gradient(ellipse 245px 197px at 2% 2%,#fff3,#fff0 70%),radial-gradient(ellipse 215px 238px at 99% 35%,#ffffff2e,#fff0 70%),#0389cb }
.cgb-homedemo .demo-cta__pattern { position:absolute;z-index:0;top:40px;right:40px;width:182px;height:90px;-o-object-fit:contain;object-fit:contain }
.cgb-homedemo .demo-cta__intro { position:relative;z-index:1;display:flex;width:734px;max-width:100%;flex-direction:column;align-items:center;gap:30px }
.cgb-homedemo .demo-cta__intro h2 { margin:0;color:#fff;font-size:48px;font-weight:400;line-height:1;letter-spacing:-.08em;text-align:center }
.cgb-homedemo .demo-cta__actions { display:flex;align-items:center;gap:20px }
.cgb-homedemo .demo-cta__actions p { display:flex;margin:0;align-items:center;gap:4px;color:#ffffffe6;font-size:16px;font-weight:500;line-height:1;letter-spacing:-.04em;white-space:nowrap }
.cgb-homedemo .demo-cta__actions p img { width:20px;height:20px }
.cgb-homedemo .demo-cta__button { position:relative;width:176px;height:64px;color:#0389cb;background:#fff }
.cgb-homedemo .demo-cta__button span { position:absolute;top:-15px;right:-25px;display:grid;width:60px;height:38px;place-items:center;border-radius:5px;color:#fff;background:#46b765;font-size:14px;transform:rotate(12deg) }
.cgb-homedemo .demo-cta__button:hover span { animation:demo-badge-bounce .65s cubic-bezier(.22,1.35,.36,1) }
.cgb-homedemo .demo-cta__features { position:relative;z-index:1;width:100% }
.cgb-homedemo .demo-cta__features>h3 { margin:0 0 20px;color:#fff;font-size:36px;font-weight:400;line-height:1.05;letter-spacing:-.06em;text-align:center }
.cgb-homedemo .demo-cta__grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px }
.cgb-homedemo .demo-feature { display:flex;overflow:hidden;height:362px;padding:25px 25px 0;flex-direction:column;gap:20px;border-radius:10px;background:#fff }
.cgb-homedemo .demo-feature__copy { height:102px;flex:0 0 102px }
.cgb-homedemo .demo-feature h4 { margin:0 0 10px;color:#0389cb;font-size:24px;font-weight:500;line-height:1.05;letter-spacing:-.08em }
.cgb-homedemo .demo-feature p { margin:0;color:#131313b3;font-size:16px;line-height:1.05;letter-spacing:-.04em }
.cgb-homedemo .demo-feature>img { display:block;width:100%;height:215px;-o-object-fit:contain;object-fit:contain }
.cgb-homedemo .mobile-slider-nav { display:none }

@media (max-width:919px) {
  .cgb-homedemo .container { padding-inline:30px }
  .cgb-homedemo .demo-cta .container { padding-inline:0 }
  .cgb-homedemo .demo-cta__panel { width:100%;padding:40px 30px }
  .cgb-homedemo .demo-cta__pattern { right:25px;opacity:.55 }
  .cgb-homedemo .demo-cta__intro h2 { font-size:40px }
  .cgb-homedemo .demo-cta__grid { grid-template-columns:repeat(2,minmax(0,1fr)) }
}

@media (max-width:619px) {
  .cgb-homedemo .container { padding-inline:15px }
  .cgb-homedemo .button { width:100% }
  .cgb-homedemo .demo-cta .container { padding-block:35px }
  .cgb-homedemo .demo-cta__panel { min-height:0;padding:34px 15px 15px;gap:35px;border-radius:22px }
  .cgb-homedemo .demo-cta__pattern { top:20px;right:15px;width:100px;height:auto;opacity:.38 }
  .cgb-homedemo .demo-cta__intro { gap:24px }
  .cgb-homedemo .demo-cta__intro h2 { font-size:30px }
  .cgb-homedemo .demo-cta__intro h2 br { display:none }
  .cgb-homedemo .demo-cta__actions { width:100%;flex-direction:column;gap:16px }
  .cgb-homedemo .demo-cta__button { width:min(230px,100% - 40px) }
  .cgb-homedemo .demo-cta__features>h3 { font-size:25px }
  .cgb-homedemo .demo-cta__grid { grid-template-columns:1fr }
  .cgb-homedemo .demo-feature { height:350px;padding-inline:20px }
  .cgb-homedemo .demo-feature h4 { font-size:22px }
  .cgb-homedemo .container { padding-inline:20px }
  .cgb-homedemo .mobile-slider-nav { display:flex;align-items:center;justify-content:center;gap:20px;height:36px }
  .cgb-homedemo .mobile-slider-nav__arrow { display:grid;width:36px;height:36px;padding:0;place-items:center;border:0;border-radius:50%;background:#1313131a;color:#131313;font:400 20px/1 Inter,sans-serif;cursor:pointer;transition:transform .52s cubic-bezier(.22,1.35,.36,1),opacity .2s ease }
  .cgb-homedemo .mobile-slider-nav__arrow:active { transform:scale(.88) }
  .cgb-homedemo .mobile-slider-nav__arrow:disabled { opacity:.32 }
  .cgb-homedemo .mobile-slider-nav__dots { display:flex;align-items:center;gap:4px }
  .cgb-homedemo .mobile-slider-nav__dots i { width:12px;height:12px;border-radius:99px;background:#13131329;transition:width .52s cubic-bezier(.22,1.35,.36,1),background .25s ease }
  .cgb-homedemo .mobile-slider-nav__dots i.is-active { width:20px;background:#0389cb }
  .cgb-homedemo .demo-cta { padding:40px 0;background:#f3f3f3 }
  .cgb-homedemo .demo-cta .container { padding:0 }
  .cgb-homedemo .demo-cta__panel { min-height:783px;padding:40px 20px 12px;gap:30px;border-radius:15px;overflow:hidden }
  .cgb-homedemo .demo-cta__intro { gap:30px }
  .cgb-homedemo .demo-cta__intro h2 { font-size:30px;line-height:1;letter-spacing:-.08em }
  .cgb-homedemo .demo-cta__actions { gap:10px }
  .cgb-homedemo .demo-cta__button { width:100%;height:64px;color:#0389cb;background:#fff }
  .cgb-homedemo .demo-cta__actions p { justify-content:center }
  .cgb-homedemo .demo-cta__features>h3 { font-size:24px;line-height:1.05;text-align:center }
  .cgb-homedemo .demo-cta__grid { display:flex;width:calc(100% + 40px);margin:20px -20px 0;padding-inline:calc(50% - 131px);box-sizing:border-box;gap:10px;overflow-x:auto;overscroll-behavior-inline:contain;scroll-padding-inline:calc(50% - 131px);scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch }
  .cgb-homedemo .demo-cta__grid::-webkit-scrollbar { display:none }
  .cgb-homedemo .demo-feature { width:262px;height:398px;padding:15px;flex:0 0 262px;scroll-snap-align:center }
  .cgb-homedemo .demo-feature h4 { font-size:24px;line-height:1.05 }
  .cgb-homedemo .demo-feature p { font-size:16px;line-height:1.3 }
  .cgb-homedemo .demo-feature>img { height:215px;-o-object-fit:contain;object-fit:contain;-o-object-position:center bottom;object-position:center bottom }
  .cgb-homedemo .demo-cta .mobile-slider-nav__arrow { color:#fff;background:#ffffff2e }
  .cgb-homedemo .demo-cta .mobile-slider-nav__dots i { background:#ffffff52 }
  .cgb-homedemo .demo-cta .mobile-slider-nav__dots i.is-active { background:#fff }
}
