.ccb{box-sizing:border-box;max-width:var(--ccb-max-width,700px);width:100%;margin:0 auto 20px;background:var(--ccb-bg,rgba(37,99,235,.08));border-left:4px solid var(--ccb-accent,#2563eb);padding:18px 18px 22px;border-radius:6px;color:#0f172a;font-size:var(--ccb-font-size,100%)}
.ccb *{box-sizing:border-box}
.ccb__content{font-size:inherit;line-height:1.6}
/* Remove extra spacing caused by first/last child margins */
.ccb__content > :first-child{margin-top:0}
.ccb__content > :last-child{margin-bottom:0}
.ccb__btnwrap{margin-top:16px;text-align:center}
.ccb__btn{display:inline-block;background:var(--ccb-accent,#2563eb);color:#fff;text-decoration:none;padding:10px 14px;border-radius:6px;font-weight:600}
.ccb__btn:hover{filter:brightness(.95)}
.ccb__btn:focus{outline:2px solid rgba(0,0,0,.2);outline-offset:2px}
@media (max-width:640px){
	.ccb{padding:16px 16px 18px}
}

/* Minimal AOS-style animation */
[data-aos]{opacity:0;transform:translate3d(-14px,0,0);transition-property:opacity,transform}
[data-aos][data-aos-easing=ease],body[data-aos-easing=ease] [data-aos]{transition-timing-function:cubic-bezier(.25,.1,.25,1)}
[data-aos][data-aos-duration="400"],body[data-aos-duration="400"] [data-aos]{transition-duration:.4s}
[data-aos=swipe-right]{position:relative}
[data-aos].aos-animate{opacity:1;transform:translate3d(0,0,0)}

/* Standalone button */
.cb-btnwrap{text-align:center;margin:10px 0 20px}
.cb-btn{display:inline-block;background:var(--btn-bg,#2563eb);color:#fff;text-decoration:none;padding:8px 16px;border-radius:10px;border:0;font-weight:700;font-size:18px;box-shadow:0 2px 4px rgba(0,0,0,.2);will-change:transform,box-shadow;transform-origin:center}
.cb-btn:hover{filter:brightness(.95);color:#fff;text-decoration:none}
.cb-btn:visited{color:#fff}
.cb-btn:active{color:#fff}
.cb-btn:focus{outline:2px solid rgba(0,0,0,.2);outline-offset:2px}

/* Pulse animation */
@keyframes cb-pulse{
	0%{transform:scale(1);box-shadow:0 0 0 0 rgba(var(--btn-bg-rgb,37,99,235), .28)}
	50%{transform:scale(1.03);box-shadow:0 0 0 8px rgba(var(--btn-bg-rgb,37,99,235), .10)}
	100%{transform:scale(1);box-shadow:0 0 0 0 rgba(var(--btn-bg-rgb,37,99,235), 0)}
}
.cb-btn--pulse{animation:cb-pulse 2.2s ease-in-out infinite}

/* Line callout (no background) */
.lcb{box-sizing:border-box;max-width:var(--lcb-max-width,760px);width:100%;margin:0 auto 18px;border-left:4px solid var(--lcb-accent,#334155);padding:6px 0 6px 14px;font-size:var(--lcb-font-size,100%)}
.lcb__content> :first-child{margin-top:0}
.lcb__content> :last-child{margin-bottom:0}

/* Rounded background box */
.rbox{box-sizing:border-box;max-width:var(--rbox-max-width,760px);width:100%;margin:0 auto 18px;background:var(--rbox-bg,rgba(245,158,11,.08));border-radius:12px;padding:16px 18px;font-size:var(--rbox-font-size,100%);box-shadow:0 6px 22px rgba(0,0,0,.08)}
.rbox__content> :first-child{margin-top:0}
.rbox__content> :last-child{margin-bottom:0}

/* Bullet links */
.blist{list-style:none;margin:0 auto 18px;max-width:var(--blist-max-width,760px);padding:0}
.blist__item{display:flex;align-items:flex-start;gap:10px;margin:10px 0}
.blist__icon{color:var(--blist-accent,#2563eb);line-height:1;display:inline-flex;align-items:center;justify-content:center;min-width:1.2em}
.blist__emoji{font-size:1.1em;line-height:1}
.blist__link{color:inherit;text-decoration:underline}
.blist__link:hover{text-decoration:none}

/* Outline media box */
.ibox{box-sizing:border-box;max-width:var(--ibox-max,760px);width:100%;margin:0 auto 18px;border:2px solid var(--ibox-border,#ef4444);border-radius:8px;padding:14px 16px;font-size:var(--ibox-font,100%);display:flex;align-items:center;gap:16px;background:transparent}
.ibox__media img{width:var(--ibox-img,88px);height:var(--ibox-img,88px);object-fit:cover;display:block;border-radius:8px}
.ibox--shape-circle .ibox__media img{border-radius:50%}
.ibox--right{flex-direction:row-reverse}
.ibox__content> :first-child{margin-top:0}
.ibox__content> :last-child{margin-bottom:0}
.ibox--left .ibox__media{flex-shrink:0}
.ibox--right .ibox__media{flex-shrink:0}
@media (max-width:640px){
	.ibox{align-items:flex-start}
}
