.tk-refer-contact {
                padding: clamp(56px, 6vw, 88px) 0;
            }

            .tk-refer-contact-grid {
                display: grid;
                grid-template-columns: minmax(0, 1fr) minmax(0, 1.04fr);
                gap: clamp(28px, 4vw, 56px);
                align-items: center;
            }

            /* ---- Left column ------------------------------------------- */
            .tk-refer-contact .tk-refer-contact-title {
                margin: 0;
                color: #F3F5F7;
                font-family: var(--font-primary), "Montserrat", sans-serif;
                font-size: clamp(30px, 3.6vw, 46px);
                font-weight: 800;
                line-height: 1.1;
                letter-spacing: -0.025em;
                text-transform: none;
            }

            /* the homepage .tk-toolkit-rule gradient, as a local element */
            .tk-refer-contact-rule {
                display: block;
                width: 100%;
                max-width: 520px;
                height: 1px;
                margin-top: 22px;
                background: linear-gradient(90deg, var(--primary-color, #0073FC), rgba(0, 115, 252, 0.12));
            }

            .tk-refer-contact .tk-refer-contact-lead {
                max-width: 520px;
                margin: 22px 0 0;
                color: #A8B0B8;
                font-size: 15.5px;
                line-height: 1.75;
            }

            /* ---- Right column ------------------------------------------ */
            .tk-refer-contact-cards {
                display: grid;
                gap: 14px;
                margin: 0;
                padding: 0;
                list-style: none;
            }

            .tk-refer-contact-cards > li {
                margin: 0;
                padding: 0;
                list-style: none;
            }

            .tk-refer-contact-cards > li::before,
            .tk-refer-contact-cards > li::marker {
                content: none;
            }

            .tk-refer-card {
                display: flex;
                align-items: center;
                gap: 16px;
                width: 100%;
                padding: 18px 20px;
                border: 1px solid rgba(255, 255, 255, 0.07);
                border-radius: 14px;
                background: linear-gradient(rgb(32, 37, 42), rgb(25, 29, 33));
                box-shadow:
                    inset 0 1px 0 rgba(255, 255, 255, 0.09),
                    0 6px 16px rgba(0, 0, 0, 0.42);
                font: inherit;
                text-align: left;
                text-decoration: none;
                cursor: pointer;
                transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
            }

            .tk-refer-card:hover,
            .tk-refer-card:focus-visible {
                transform: translateY(-2px);
                border-color: rgba(0, 115, 252, 0.28);
                box-shadow:
                    inset 0 1px 0 rgba(255, 255, 255, 0.11),
                    0 10px 22px rgba(0, 0, 0, 0.5);
                text-decoration: none;
            }

            .tk-refer-card-icon {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                flex: 0 0 42px;
                width: 42px;
                height: 42px;
                border: 0;
                border-radius: 12px;
                background: linear-gradient(rgb(40, 46, 52), rgb(31, 36, 41));
                box-shadow:
                    inset 0 1px 0 rgba(255, 255, 255, 0.09),
                    0 3px 7px rgba(0, 0, 0, 0.45);
                color: var(--primary-color, #0073FC);
                font-size: 16px;
            }

            .tk-refer-card-text {
                display: block;
                min-width: 0;
            }

            .tk-refer-contact .tk-refer-card-text strong {
                display: block;
                margin-bottom: 3px;
                color: #F3F5F7;
                font-size: 15px;
                font-weight: 700;
                line-height: 1.35;
            }

            .tk-refer-contact .tk-refer-card-text span {
                display: block;
                color: rgba(255, 255, 255, 0.55);
                font-size: 13.5px;
                line-height: 1.5;
            }

            /* ---- Light theme -------------------------------------------
               This page is in the layout's .tk-fp route list, so
               tbtk-footer-pages-light.css reaches it with selectors of the
               shape `html[data-tk-theme="light"] body.tk-fp .content-area h2
               / p / span`. Those outrank a plain class, which is why every
               rule below carries the same prefix plus this section's class —
               including the two that restate the reused badge's colours,
               since the badge and its icon tile are both <span>s and would
               otherwise be repainted by that sheet's generic span rule. */
            html[data-tk-theme="light"] body.tk-fp .content-area .tk-refer-contact .tk-refer-contact-title {
                color: #0A0D0F;
            }

            html[data-tk-theme="light"] body.tk-fp .content-area .tk-refer-contact .tk-refer-contact-lead {
                color: #4A535D;
            }

            html[data-tk-theme="light"] body.tk-fp .content-area .tk-refer-contact .tk-toolkit-badge {
                color: var(--primary-color-dark, #005BC7);
            }

            html[data-tk-theme="light"] body.tk-fp .content-area .tk-refer-contact .tk-toolkit-badge-icon {
                color: #FFFFFF;
            }

            html[data-tk-theme="light"] body.tk-fp .content-area .tk-refer-contact .tk-refer-card {
                border-color: rgba(15, 23, 42, 0.08);
                background: linear-gradient(#FFFFFF, #F8FAFB);
                box-shadow:
                    inset 0 1px 0 rgba(255, 255, 255, 0.9),
                    0 6px 18px rgba(15, 23, 42, 0.07);
            }

            html[data-tk-theme="light"] body.tk-fp .content-area .tk-refer-contact .tk-refer-card:hover,
            html[data-tk-theme="light"] body.tk-fp .content-area .tk-refer-contact .tk-refer-card:focus-visible {
                border-color: rgba(0, 115, 252, 0.3);
                box-shadow:
                    inset 0 1px 0 rgba(255, 255, 255, 0.9),
                    0 10px 24px rgba(15, 23, 42, 0.11);
            }

            html[data-tk-theme="light"] body.tk-fp .content-area .tk-refer-contact .tk-refer-card-icon {
                border: 1px solid rgba(15, 23, 42, 0.08);
                background: linear-gradient(#FFFFFF, #EEF2F5);
                box-shadow:
                    inset 0 1px 0 rgba(255, 255, 255, 0.9),
                    0 2px 5px rgba(15, 23, 42, 0.07);
                color: var(--primary-color, #0073FC);
            }

            html[data-tk-theme="light"] body.tk-fp .content-area .tk-refer-contact .tk-refer-card-text strong {
                color: #0A0D0F;
            }

            html[data-tk-theme="light"] body.tk-fp .content-area .tk-refer-contact .tk-refer-card-text span {
                color: #626B75;
            }

            /* ---- Responsive --------------------------------------------- */
            @media (max-width: 991px) {
                .tk-refer-contact-grid {
                    grid-template-columns: minmax(0, 1fr);
                    gap: 32px;
                }

                .tk-refer-contact-rule,
                .tk-refer-contact .tk-refer-contact-lead {
                    max-width: 100%;
                }
            }

            @media (max-width: 767px) {
                .tk-refer-contact {
                    padding: 48px 0;
                }

                .tk-refer-card {
                    padding: 16px;
                }
            }