.demo-btn{align-items:center;gap:var(--space-6);border-radius:var(--radius-pill);height:44px;color:var(--text-inverse);background:var(--button-dark);font:500 var(--font-16)/1 var(--font-family);letter-spacing:-.03em;white-space:nowrap;padding:0 16px;transition:transform .18s;display:inline-flex;position:relative;overflow:hidden}.demo-btn:hover{transform:translateY(-2px)}.demo-btn:before{content:"";z-index:0;top:var(--y,50%);left:var(--x,50%);border-radius:var(--radius-pill);background:var(--accent-blue);width:0;height:0;transition:width .42s cubic-bezier(.32,.72,.3,1),height .42s cubic-bezier(.32,.72,.3,1);position:absolute;transform:translate(-50%,-50%)}.demo-btn:hover:before{width:260%;height:620%}.demo-btn .nav-roll,.demo-btn__dot{z-index:1;position:relative}.demo-btn__dot{border-radius:var(--radius-pill);background:currentColor;flex:none;width:10px;height:10px}.demo-btn--ghost{color:var(--button-dark);background:var(--surface-page)}.demo-btn--ghost:before{background:#e6e6ea}@media (prefers-reduced-motion:reduce){.demo-btn:before{transition:none}}.b-chan{background:var(--surface-card);padding:0 clamp(20px,3.5vw,50px) clamp(40px,7vh,80px)}.b-chan__card{color:inherit;isolation:isolate;background:linear-gradient(105deg,#f3f7ff 0%,#e4edff 58%,#d7e6ff 100%);border-radius:50px;grid-template-columns:minmax(0,1fr) minmax(0,320px);align-items:center;gap:clamp(24px,3vw,48px);padding:clamp(32px,4vw,54px) clamp(24px,3.4vw,46px);text-decoration:none;transition:transform .25s cubic-bezier(.32,.72,.3,1);display:grid;position:relative;overflow:hidden}.b-chan__card:hover{transform:translateY(-3px)}.b-chan__text{flex-direction:column;align-items:flex-start;display:flex}.b-chan__title{max-width:17ch;color:var(--text-heading);font:500 clamp(24px, 2.6vw, 36px)/1.15 var(--font-family);letter-spacing:-.03em;margin:0}.b-chan__copy{color:#5b6479;max-width:46ch;font:400 var(--font-16)/1.5 var(--font-family);letter-spacing:-.01em;margin:14px 0 0}.b-chan__btn{margin-top:clamp(20px,2.6vw,30px)}.b-chan__art{justify-self:end;width:clamp(250px,31vw,430px);margin:clamp(-90px,-7vw,-34px) clamp(-64px,-4.6vw,-24px) clamp(-90px,-7vw,-34px) 0;display:block}.b-chan__art img{width:100%;height:auto;transition:transform .4s cubic-bezier(.32,.72,.3,1);display:block}.b-chan__card:hover .b-chan__art img{transform:translateY(-4px)rotate(-3deg)}@media (prefers-reduced-motion:reduce){.b-chan__card,.b-chan__card:hover,.b-chan__art img,.b-chan__card:hover .b-chan__art img{transition:none;transform:none}}@media (width<=760px){.b-chan__card{text-align:left;border-radius:34px;grid-template-columns:1fr;gap:24px;padding:30px 24px 32px}.b-chan__art{order:-1;justify-self:start;width:104px;margin:0}.b-chan__title{max-width:none}}
