/* Sezione 4 "Il Bully Club": base comune delle varianti, con gli stessi gesti della hero B (giallo, notte, rosso, ombre piene).
   L'unica immagine è la tessera ufficiale del Club, la stessa del sito di oggi e della mail della tessera. */
.cb { position: relative; overflow: clip; }
.cb-giro { width: 100%; max-width: 1440px; margin: 0 auto; padding-block: clamp(64px, 8vw, 112px); padding-left: max(20px, env(safe-area-inset-left, 0px)); padding-right: max(20px, env(safe-area-inset-right, 0px)); }
.cb h2 { margin: 0; font-family: var(--titolo); font-weight: 700; letter-spacing: -.035em; line-height: .95; font-size: clamp(42px, 5.6vw, 88px); text-wrap: balance; }
.cb h3 { margin: 0; font-family: var(--titolo); font-weight: 700; letter-spacing: -.025em; line-height: 1.05; }
.cb p { margin: 0; }
.cb .lead { font-size: clamp(17px, 1.35vw, 20px); line-height: 1.5; max-width: 34em; font-weight: 500; }
.cb .giallo.su-chiaro { -webkit-text-stroke-width: .05em; text-shadow: .045em .05em 0 var(--rosso); }
.cb .btn.primo { background: var(--rosso); color: var(--bianco); box-shadow: 0 6px 0 var(--notte); }
.cb .btn.primo:hover { box-shadow: 0 8px 0 var(--notte); }
.cb .nota { font-size: 14px; line-height: 1.45; font-weight: 500; }
.cb-tessera { display: block; width: 100%; height: auto; border-radius: 4.5% / 7%; }
@media (max-width: 760px) { .cb .btn { font-size: 16px; padding: 16px 22px; } }
@media (prefers-reduced-motion: reduce) { .cb *, .cb *::before, .cb *::after { transition: none !important; animation: none !important; } }