.cui-contact-channels { padding: 96px 0; background: #e9eeff; overflow: hidden; }
.cui-contact-channels, .cui-contact-channels * { box-sizing: border-box; }
.cui-contact-channels__container { width: 100%; max-width: 1536px; margin: 0 auto; padding: 0 24px; }
.cui-contact-channels__heading { text-align: center; margin: -16px 0 48px; }
.cui-contact-channels .cui-contact-channels__heading h2 { margin: 0 0 56px; color: #2e338c; font-family: "Marcellus", serif; font-size: 45px; font-weight: 400; line-height: 1.05; text-transform: none; letter-spacing: normal; }
.cui-contact-channels__heading p { margin: 0; padding: 0 16px; color: rgb(0 0 0 / 70%); font: 400 16px/1.8 "Figtree", sans-serif; }
.cui-contact-channels__heading a { color: #d33; font-weight: 700; text-decoration: none; }
.cui-contact-channels__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.cui-contact-channels .cui-contact-channels__card { display: flex; flex-direction: column; width: 100%; min-width: 0; min-height: 150px; height: 100%; margin: 0; padding: 24px; border: 0; border-radius: 16px; color: #000; text-align: left; text-decoration: none; text-transform: none; letter-spacing: normal; white-space: normal; box-shadow: 0 2px 3px rgb(0 0 0 / 12%); transition: transform .3s, box-shadow .3s; }
.cui-contact-channels .cui-contact-channels__card--pink { background: rgb(255 118 143 / 12%); --channel-color: #ff5c7a; }
.cui-contact-channels .cui-contact-channels__card--green { background: rgb(101 214 126 / 12%); --channel-color: #22c55e; }
.cui-contact-channels .cui-contact-channels__card--purple { background: rgb(167 139 250 / 14%); --channel-color: #8b5cf6; }
.cui-contact-channels .cui-contact-channels__card--blue { background: rgb(96 165 250 / 14%); --channel-color: #3b82f6; }
.cui-contact-channels :is(a, button).cui-contact-channels__card { cursor: pointer; }
.cui-contact-channels :is(a, button).cui-contact-channels__card:hover { transform: translateY(-6px); box-shadow: 0 16px 40px rgb(0 0 0 / 8%); }
.cui-contact-channels__card-heading { display: flex; align-items: center; margin-bottom: 12px; font: 400 24px/1.4 "Marcellus", serif; overflow-wrap: anywhere; }
.cui-contact-channels__icon { display: flex; align-items: center; width: 48px; height: 40px; flex: 0 0 48px; color: var(--channel-color); }
.cui-contact-channels__icon svg { display: block; width: 34px; height: 34px; max-width: 34px; flex: 0 0 34px; }
.cui-contact-channels__description { display: block; color: rgb(0 0 0 / 65%); font: 400 15px/1.7 "Figtree", sans-serif; }
.cui-contact-channels__dialog { position: fixed; inset: 0; width: min(680px, calc(100% - 32px)); max-height: calc(100dvh - 48px); margin: auto; padding: 40px 32px 32px; border: 0; border-radius: 16px; background: #fff; color: #222; overflow-y: auto; box-shadow: 0 24px 80px rgb(0 0 0 / 25%); }
.cui-contact-channels__dialog:not([open]) { display: none; }
.cui-contact-channels__dialog::backdrop { background: rgb(0 0 0 / 55%); }
.cui-contact-channels .cui-contact-channels__close { position: absolute; top: 4px; right: 8px; display: grid; place-items: center; width: 36px; min-width: 0; height: 36px; margin: 0; padding: 0; border: 0; border-radius: 50%; background: transparent; color: #555; font: 400 28px/1 sans-serif; cursor: pointer; }
.cui-contact-channels :is(a, button):focus-visible { outline: 2px solid #2e338c; outline-offset: 4px; }
@media (max-width: 1199px) { .cui-contact-channels__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 899px) { .cui-contact-channels { padding: 64px 0; } .cui-contact-channels__grid { grid-template-columns: minmax(0, 1fr); } .cui-contact-channels__heading { margin-bottom: 32px; } .cui-contact-channels .cui-contact-channels__heading h2 { margin-bottom: 32px; font-size: 45px; } }
@media (max-width: 599px) { .cui-contact-channels__container { padding: 0 16px; } .cui-contact-channels__heading p { padding: 0; } .cui-contact-channels__dialog { padding: 44px 20px 24px; } }
@media (prefers-reduced-motion: reduce) { .cui-contact-channels .cui-contact-channels__card { transition: none; } }