/* Public Page Styles */


/* About.aspx */
.tg-fb-hero-card,
        .tg-fb-section-card,
        .tg-fb-plan-card,
        .tg-fb-step-card,
        .tg-fb-network-card,
        .tg-fb-faq-wrap,
        .tg-fb-cta-card {
            background: #fff;
            border: 1px solid #e9ecef;
            border-radius: 18px;
            box-shadow: 0 8px 24px rgba(0,0,0,0.05);
        }

        .tg-fb-hero-card,
        .tg-fb-section-card,
        .tg-fb-faq-wrap,
        .tg-fb-cta-card {
            padding: 30px;
        }

        .tg-fb-value-card,
        .tg-fb-step-card,
        .tg-fb-network-card,
        .tg-fb-plan-card {
            height: 100%;
            padding: 26px;
        }

        .tg-fb-icon {
            width: 58px;
            height: 58px;
            border-radius: 50%;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: #f3f7fb;
            font-size: 24px;
            margin-bottom: 18px;
        }

        .tg-fb-plan-card.featured {
            border-color: #cfe2ff;
            box-shadow: 0 14px 30px rgba(13,110,253,0.10);
        }

        .tg-fb-plan-badge {
            display: inline-block;
            font-size: 12px;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: .04em;
            background: #e8f1ff;
            color: #0d6efd;
            padding: 6px 11px;
            border-radius: 999px;
            margin-bottom: 14px;
        }

        .tg-fb-plan-list {
            list-style: none;
            padding-left: 0;
            margin-bottom: 0;
        }

            .tg-fb-plan-list li {
                position: relative;
                padding-left: 24px;
                margin-bottom: 10px;
                color: #495057;
            }

                .tg-fb-plan-list li:before {
                    content: "\f26e";
                    font-family: "bootstrap-icons";
                    position: absolute;
                    left: 0;
                    top: 0;
                    color: #198754;
                }

        .tg-fb-step-num {
            width: 42px;
            height: 42px;
            border-radius: 50%;
            background: #0d6efd;
            color: #fff;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-weight: 700;
            margin-bottom: 16px;
        }

        .tg-fb-muted {
            color: #6c757d;
        }

        .tg-fb-faq-wrap .accordion-item {
            border: 1px solid #e9ecef;
            border-radius: 14px !important;
            overflow: hidden;
            margin-bottom: 14px;
        }

        .tg-fb-faq-wrap .accordion-button {
            font-weight: 600;
        }

            .tg-fb-faq-wrap .accordion-button:not(.collapsed) {
                background: #f8fbff;
                color: #1d232f;
                box-shadow: none;
            }

        .tg-city-empty {
            background: #fff;
            border: 1px solid #e9ecef;
            border-radius: 18px;
            padding: 30px;
            text-align: center;
            color: #6c757d;
            box-shadow: 0 8px 24px rgba(0,0,0,0.05);
        }

        .tg-city-bottom-copy {
            background: #fff;
            border: 1px solid #e9ecef;
            border-radius: 18px;
            padding: 28px;
            margin-top: 40px;
            box-shadow: 0 8px 24px rgba(0,0,0,0.05);
        }

        #prosgrade_titlebar {
            position: relative;
            padding: 180px 0 120px 0;
            background-size: cover;
            background-position: top center;
            pointer-events: none;
            color: var(--bs-white);
        }

        @media (max-width: 992px) {
            #prosgrade_titlebar {
                padding: 120px 0 70px 0;
            }
        }


/* Cities.aspx */
.tg-city-search-card {
            background: #fff;
            border: 1px solid #e9ecef;
            border-radius: 18px;
            box-shadow: 0 8px 24px rgba(0,0,0,0.05);
            padding: 24px;
            margin-bottom: 35px;
        }

        .tg-city-card {
            display: block;
            background: #fff;
            border: 1px solid #e9ecef;
            border-radius: 18px;
            box-shadow: 0 8px 24px rgba(0,0,0,0.05);
            text-decoration: none;
            height: 100%;
            overflow: hidden;
            transition: all .18s ease;
        }

        .tg-city-card:hover {
            transform: translateY(-2px);
            box-shadow: 0 14px 30px rgba(0,0,0,0.08);
            border-color: #d7dce2;
        }

/* Home hero search */
.tg-home-search-wrap {
            max-width: 980px;
            align-items: stretch;
        }

        .tg-home-search-wrap > div {
            display: flex;
            align-items: center;
        }

        .tg-home-search-field-wrap {
            flex: 1 1 auto;
            min-width: 0;
        }

        .tg-home-search-input {
            display: block;
            width: 100%;
            height: 56px;
            min-height: 56px;
            padding: 0 18px;
            margin: 0;
            border: 0;
            outline: 0;
            background: transparent;
            box-shadow: none;
            color: #fff;
            font-size: 18px;
            font-weight: 500;
            line-height: 56px;
            box-sizing: border-box;
            appearance: none;
        }

        .tg-home-search-input:focus {
            background: transparent;
            color: #fff;
            box-shadow: none;
            outline: 0;
        }

        .tg-home-search-input::placeholder {
            color: rgba(255,255,255,0.96);
            opacity: 1;
        }

        .tg-home-search-input::-webkit-input-placeholder {
            color: rgba(255,255,255,0.96);
            opacity: 1;
        }

        .tg-home-search-input::-moz-placeholder {
            color: rgba(255,255,255,0.96);
            opacity: 1;
        }

        .tg-home-search-input:-ms-input-placeholder {
            color: rgba(255,255,255,0.96);
            opacity: 1;
        }

        .tg-home-search-input:-moz-placeholder {
            color: rgba(255,255,255,0.96);
            opacity: 1;
        }

        .tg-home-search-action {
            flex: 0 0 240px;
        }

        .tg-home-search-button,
        .tg-home-search-wrap .btn {
            min-height: 56px;
            height: 56px;
            border-radius: 14px !important;
            white-space: nowrap;
            padding-left: 28px;
            padding-right: 28px;
            font-weight: 700;
        }

        @media (min-width: 992px) {
            .tg-home-search-wrap {
                display: flex;
                gap: 0;
                padding: 12px 16px;
            }

            .tg-home-search-field-wrap {
                padding-right: 16px;
            }

            .tg-home-search-action {
                padding-left: 16px;
            }

            .tg-home-search-wrap .border-right-custom {
                border-right-width: 1px;
            }
        }

        @media (max-width: 991px) {
            .tg-home-search-wrap {
                display: flex;
                flex-direction: column;
            }

            .tg-home-search-field-wrap {
                width: 100%;
                padding-right: 0;
                border-right: 0;
            }

            .tg-home-search-action {
                width: 100%;
                flex: 0 0 auto;
                padding-left: 0;
                margin-top: 12px;
            }

            .tg-home-search-wrap .btn {
                width: 100%;
            }
        }

        .tg-city-card-image-wrap {
            position: relative;
            height: 190px;
            overflow: hidden;
            background: #eef1f4;
        }

        .tg-city-card-image {
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: center center;
            display: block;
            transition: transform .35s ease;
        }

        .tg-city-card:hover .tg-city-card-image {
            transform: scale(1.04);
        }

        .tg-city-card-body {
            padding: 22px;
        }

        .tg-city-card-title {
            font-size: 22px;
            font-weight: 700;
            color: #1d232f;
            margin-bottom: 8px;
            line-height: 1.2;
        }

        .tg-city-card-sub {
            color: #6c757d;
            font-size: 14px;
            margin-bottom: 16px;
        }

        .tg-city-stat-row {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
            margin-bottom: 16px;
        }

        .tg-city-stat {
            display: inline-flex;
            align-items: center;
            gap: 7px;
            background: #f8f9fa;
            border-radius: 999px;
            padding: 7px 12px;
            font-size: 13px;
            color: #495057;
        }

        .tg-city-priority {
            display: inline-block;
            margin-bottom: 14px;
            background: #e8f3ff;
            color: #0d6efd;
            border-radius: 999px;
            padding: 6px 12px;
            font-size: 13px;
            font-weight: 600;
        }

        .tg-city-link-text {
            color: #0d6efd;
            font-weight: 600;
        }

        @media (max-width: 767px) {
            .tg-city-card-image-wrap {
                height: 170px;
            }
        }

        .tg-city-empty {
            background: #fff;
            border: 1px solid #e9ecef;
            border-radius: 18px;
            padding: 30px;
            text-align: center;
            color: #6c757d;
            box-shadow: 0 8px 24px rgba(0,0,0,0.05);
        }

        .tg-city-bottom-copy {
            background: #fff;
            border: 1px solid #e9ecef;
            border-radius: 18px;
            padding: 28px;
            margin-top: 40px;
            box-shadow: 0 8px 24px rgba(0,0,0,0.05);
        }

        #prosgrade_titlebar {
            position: relative;
            padding: 180px 0 120px 0;
            background-size: cover;
            background-position: top center;
            pointer-events: none;
            color: var(--bs-white);
        }

        @media (max-width: 992px) {
            #prosgrade_titlebar {
                padding: 120px 0 70px 0;
            }
        }
        .tg-city-stat-market-launching {
    background: #f8f9fa;
    color: #6c757d;
}

.tg-city-stat-market-growing {
    background: #fff3cd;
    color: #664d03;
}

.tg-city-stat-market-active {
    background: #cfe2ff;
    color: #084298;
}

.tg-city-stat-market-competitive {
    background: #f8d7da;
    color: #842029;
}


/* Default.aspx */
.tg-home-search-wrap {
            max-width: 920px;
        }

        .tg-home-search-note {
            color: rgba(255,255,255,0.92);
            margin-top: 14px;
            font-size: 15px;
        }

        .tg-home-section-card {
            background: #fff;
            border: 1px solid #e9ecef;
            border-radius: 18px;
            box-shadow: 0 8px 24px rgba(0,0,0,0.05);
            padding: 28px;
        }

        .tg-home-city-card {
            display: block;
            background: #fff;
            border: 1px solid #e9ecef;
            border-radius: 18px;
            box-shadow: 0 8px 24px rgba(0,0,0,0.05);
            text-decoration: none;
            height: 100%;
            overflow: hidden;
            transition: all .18s ease;
        }

        .tg-home-city-card:hover {
            transform: translateY(-2px);
            box-shadow: 0 14px 30px rgba(0,0,0,0.08);
            border-color: #d7dce2;
        }

        .tg-home-city-image-wrap {
            position: relative;
            height: 190px;
            overflow: hidden;
            background: #eef1f4;
        }

        .tg-home-city-image {
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: center center;
            display: block;
            transition: transform .35s ease;
        }

        .tg-home-city-card:hover .tg-home-city-image {
            transform: scale(1.04);
        }

        .tg-home-city-body {
            padding: 22px;
        }

        .tg-home-city-title {
            font-size: 22px;
            font-weight: 700;
            color: #1d232f;
            margin-bottom: 8px;
            line-height: 1.2;
        }

        .tg-home-city-sub {
            color: #6c757d;
            font-size: 14px;
            margin-bottom: 16px;
        }

        .tg-home-stat-row {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
            margin-bottom: 16px;
        }

        .tg-home-stat {
            display: inline-flex;
            align-items: center;
            gap: 7px;
            background: #f8f9fa;
            border-radius: 999px;
            padding: 7px 12px;
            font-size: 13px;
            color: #495057;
        }

        .tg-home-city-priority {
            display: inline-block;
            margin-bottom: 14px;
            background: #e8f3ff;
            color: #0d6efd;
            border-radius: 999px;
            padding: 6px 12px;
            font-size: 13px;
            font-weight: 600;
        }

        .tg-home-link-text {
            color: #0d6efd;
            font-weight: 600;
        }

        .tg-home-business-card .card-img-top {
            height: 240px;
            object-fit: cover;
        }

        .tg-home-photo-placeholder {
            height: 240px;
            background: linear-gradient(135deg, #eef3f8 0%, #dfe8f3 100%);
            display: flex;
            align-items: center;
            justify-content: center;
            color: #5f6b7a;
            font-weight: 600;
            font-size: 18px;
        }

        .tg-home-logo-wrap {
            width: 58px;
            height: 58px;
            flex: 0 0 58px;
            overflow: hidden;
            border-radius: 14px;
            background: #fff;
            border: 1px solid #e9ecef;
            display: flex;
            align-items: center;
            justify-content: center;
        }

.tg-home-logo {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.tg-logo-photo {
    object-fit: cover;
}

        .tg-home-business-header {
            display: flex;
            gap: 14px;
            align-items: center;
        }

        .tg-home-business-title {
            font-size: 20px;
            line-height: 1.2;
        }

        .tg-home-badge-row .badge {
            margin-right: 6px;
            margin-bottom: 6px;
        }

        .tg-home-trade-card {
            display: block;
            text-decoration: none;
            background: #fff;
            border: 1px solid #e9ecef;
            border-radius: 18px;
            box-shadow: 0 8px 24px rgba(0,0,0,0.05);
            padding: 24px;
            height: 100%;
            transition: all .18s ease;
        }

        .tg-home-trade-card:hover {
            transform: translateY(-2px);
            box-shadow: 0 14px 30px rgba(0,0,0,0.08);
            border-color: #d7dce2;
        }

        .tg-home-trade-icon {
            width: 62px;
            height: 62px;
            border-radius: 50%;
            background: #f8f9fa;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            color: #0d6efd;
            font-size: 26px;
            margin-bottom: 14px;
        }

        .tg-home-empty {
            background: #fff;
            border: 1px solid #e9ecef;
            border-radius: 18px;
            padding: 30px;
            text-align: center;
            color: #6c757d;
            box-shadow: 0 8px 24px rgba(0,0,0,0.05);
        }

        .tg-home-cta-box {
            background: linear-gradient(135deg, #0d6efd 0%, #0b5ed7 100%);
            border-radius: 22px;
            padding: 40px;
            color: #fff;
        }

        .tg-home-soft-box {
            background: #fff;
            border: 1px solid #e9ecef;
            border-radius: 18px;
            box-shadow: 0 8px 24px rgba(0,0,0,0.05);
            padding: 30px;
        }

        @media (max-width: 767px) {
            .tg-home-city-image-wrap {
                height: 170px;
            }
        }


/* ForBusiness.aspx */
.tg-fb-hero-card,
        .tg-fb-section-card,
        .tg-fb-plan-card,
        .tg-fb-step-card,
        .tg-fb-network-card,
        .tg-fb-faq-wrap,
        .tg-fb-cta-card {
            background: #fff;
            border: 1px solid #e9ecef;
            border-radius: 18px;
            box-shadow: 0 8px 24px rgba(0,0,0,0.05);
        }

        .tg-fb-hero-card,
        .tg-fb-section-card,
        .tg-fb-faq-wrap,
        .tg-fb-cta-card {
            padding: 30px;
        }

        .tg-fb-value-card,
        .tg-fb-step-card,
        .tg-fb-network-card,
        .tg-fb-plan-card {
            height: 100%;
            padding: 26px;
        }

        .tg-fb-icon {
            width: 58px;
            height: 58px;
            border-radius: 50%;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: #f3f7fb;
            font-size: 24px;
            margin-bottom: 18px;
        }

        .tg-fb-plan-card.featured {
            border-color: #cfe2ff;
            box-shadow: 0 14px 30px rgba(13,110,253,0.10);
        }

        .tg-fb-plan-badge {
            display: inline-block;
            font-size: 12px;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: .04em;
            background: #e8f1ff;
            color: #0d6efd;
            padding: 6px 11px;
            border-radius: 999px;
            margin-bottom: 14px;
        }

        .tg-fb-plan-list {
            list-style: none;
            padding-left: 0;
            margin-bottom: 0;
        }

        .tg-fb-plan-list li {
            position: relative;
            padding-left: 24px;
            margin-bottom: 10px;
            color: #495057;
        }

        .tg-fb-plan-list li:before {
            content: "\f26e";
            font-family: "bootstrap-icons";
            position: absolute;
            left: 0;
            top: 0;
            color: #198754;
        }

        .tg-fb-step-num {
            width: 42px;
            height: 42px;
            border-radius: 50%;
            background: #0d6efd;
            color: #fff;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-weight: 700;
            margin-bottom: 16px;
        }

        .tg-fb-muted {
            color: #6c757d;
        }

        .tg-fb-faq-wrap .accordion-item {
            border: 1px solid #e9ecef;
            border-radius: 14px !important;
            overflow: hidden;
            margin-bottom: 14px;
        }

        .tg-fb-faq-wrap .accordion-button {
            font-weight: 600;
        }

        .tg-fb-faq-wrap .accordion-button:not(.collapsed) {
            background: #f8fbff;
            color: #1d232f;
            box-shadow: none;
        }

                .tg-city-empty {
            background: #fff;
            border: 1px solid #e9ecef;
            border-radius: 18px;
            padding: 30px;
            text-align: center;
            color: #6c757d;
            box-shadow: 0 8px 24px rgba(0,0,0,0.05);
        }

        .tg-city-bottom-copy {
            background: #fff;
            border: 1px solid #e9ecef;
            border-radius: 18px;
            padding: 28px;
            margin-top: 40px;
            box-shadow: 0 8px 24px rgba(0,0,0,0.05);
        }

            #prosgrade_titlebar {
              position: relative;
              padding: 180px 0 120px 0;
              background-size: cover;
              background-position: top center;
              pointer-events: none;
              color: var(--bs-white);
            }
            @media (max-width: 992px) {
              #prosgrade_titlebar {
                padding: 120px 0 70px 0;
              }
            }


/* Pricing.aspx */
.tg-price-card {
            background: #fff;
            border: 1px solid #e9ecef;
            border-radius: 18px;
            box-shadow: 0 8px 24px rgba(0,0,0,0.05);
            padding: 30px;
            height: 100%;
        }

        .tg-price-card.featured {
            border-color: #cfe2ff;
            box-shadow: 0 14px 30px rgba(13,110,253,0.12);
            transform: scale(1.02);
        }

        .tg-price-title {
            font-size: 22px;
            font-weight: 700;
        }

        .tg-price-amount {
            font-size: 36px;
            font-weight: 800;
            margin: 10px 0;
        }

        .tg-price-muted {
            color: #6c757d;
        }

        .tg-price-list {
            list-style: none;
            padding-left: 0;
        }

        .tg-price-list li {
            margin-bottom: 10px;
            padding-left: 22px;
            position: relative;
        }

        .tg-price-list li:before {
            content: "\f26e";
            font-family: "bootstrap-icons";
            position: absolute;
            left: 0;
            color: #198754;
        }

        .tg-compare-table {
            width: 100%;
            border-collapse: collapse;
        }

        .tg-compare-table th,
        .tg-compare-table td {
            border-bottom: 1px solid #e9ecef;
            padding: 12px;
            text-align: center;
        }

        .tg-compare-table th:first-child,
        .tg-compare-table td:first-child {
            text-align: left;
        }

        .tg-check {
            color: #198754;
            font-weight: bold;
        }

        .tg-x {
            color: #adb5bd;
        }

        .tg-note {
            font-size: 14px;
            color: #6c757d;
        }


/* Search.aspx */
.tg-search-hero {
            background:
                linear-gradient(rgba(15, 23, 42, 0.62), rgba(15, 23, 42, 0.48)),
                url('/assets/images/title-bar/prosgrade.webp');
            background-size: cover;
            background-position: center center;
            background-repeat: no-repeat;
            padding: 130px 0 80px 0;
            color: #fff;
        }

        .tg-search-hero h1,
        .tg-search-hero .lead,
        .tg-search-hero .text-muted {
            color: #fff !important;
        }

        .tg-search-hero .text-muted {
            opacity: 0.9;
        }

        @media (max-width: 992px) {
            .tg-search-hero {
                padding: 110px 0 60px 0;
            }
        }

        .tg-search-box {
            background: #fff;
            border: 1px solid #e9ecef;
            border-radius: 18px;
            box-shadow: 0 8px 24px rgba(0,0,0,0.05);
            padding: 14px;
        }

        .tg-search-card {
            background: #fff;
            border: 1px solid #e9ecef;
            border-radius: 18px;
            box-shadow: 0 8px 24px rgba(0,0,0,0.05);
            padding: 24px;
            height: 100%;
        }

        .tg-search-section-card {
            background: #fff;
            border: 1px solid #e9ecef;
            border-radius: 18px;
            box-shadow: 0 8px 24px rgba(0,0,0,0.05);
            padding: 28px;
        }

        .tg-search-empty {
            background: #fff;
            border: 1px solid #e9ecef;
            border-radius: 18px;
            box-shadow: 0 8px 24px rgba(0,0,0,0.05);
            padding: 40px;
            text-align: center;
            color: #6c757d;
        }

        .tg-search-logo-wrap {
            width: 58px;
            height: 58px;
            flex: 0 0 58px;
            overflow: hidden;
            border-radius: 14px;
            background: #fff;
            border: 1px solid #e9ecef;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0px 10px 10px 0px;
            vertical-align: top
        }

        .tg-search-logo {
            width: 100%;
            height: 100%;
            object-fit: contain;
            display: block;
        }

        .tg-search-logo-photo {
            object-fit: cover;
        }

        .tg-search-badge-row .badge {
            margin-right: 6px;
            margin-bottom: 6px;
        }

        .tg-search-city-link,
        .tg-search-service-link,
        .tg-search-browse-link {
            display: block;
            text-decoration: none;
            color: inherit;
        }

        .tg-search-city-link:hover,
        .tg-search-service-link:hover,
        .tg-search-browse-link:hover {
            text-decoration: none;
        }

        .tg-search-soft-icon {
            width: 52px;
            height: 52px;
            border-radius: 14px;
            background: rgba(13,110,253,0.10);
            color: #0d6efd;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 22px;
            flex: 0 0 52px;
        }


/* TopRated.aspx */
.tg-featured-card .card-img-top {
            height: 240px;
            object-fit: cover;
        }

        .tg-photo-placeholder {
            height: 240px;
            background: linear-gradient(135deg, #eef3f8 0%, #dfe8f3 100%);
            display: flex;
            align-items: center;
            justify-content: center;
            color: #5f6b7a;
            font-weight: 600;
            font-size: 18px;
        }

        .tg-featured-logo-wrap {
            width: 58px;
            height: 58px;
            flex: 0 0 58px;
            overflow: hidden;
            border-radius: 14px;
            background: #fff;
            border: 1px solid #e9ecef;
            display: flex;
            align-items: center;
            justify-content: center;
        }

.tg-featured-logo {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.tg-logo-photo {
    object-fit: cover;
}

        .tg-featured-header {
            display: flex;
            gap: 14px;
            align-items: center;
        }

        .tg-featured-title {
            font-size: 20px;
            line-height: 1.2;
        }

        .tg-badge-row .badge {
            margin-right: 6px;
            margin-bottom: 6px;
        }

        .tg-section-card {
            background: #fff;
            border: 1px solid #e9ecef;
            border-radius: 18px;
            box-shadow: 0 8px 24px rgba(0,0,0,0.05);
            padding: 28px;
        }

        .tg-city-top-card {
            background: #fff;
            border: 1px solid #e9ecef;
            border-radius: 18px;
            box-shadow: 0 8px 24px rgba(0,0,0,0.05);
            padding: 22px;
            height: 100%;
        }

        .tg-city-top-city {
            font-size: 13px;
            font-weight: 700;
            letter-spacing: .04em;
            text-transform: uppercase;
            color: #6c757d;
            margin-bottom: 8px;
        }

        .tg-city-top-name {
            font-size: 22px;
            font-weight: 700;
            line-height: 1.2;
            margin-bottom: 10px;
        }

        .tg-city-top-copy {
            color: #6c757d;
            margin-bottom: 14px;
        }

        .tg-empty-box {
            background: #fff;
            border: 1px solid #e9ecef;
            border-radius: 18px;
            box-shadow: 0 8px 24px rgba(0,0,0,0.05);
            padding: 30px;
            text-align: center;
            color: #6c757d;
        }

        .tg-top-bottom-copy {
            background: #fff;
            border: 1px solid #e9ecef;
            border-radius: 18px;
            box-shadow: 0 8px 24px rgba(0,0,0,0.05);
            padding: 30px;
            margin-top: 40px;
        }

        #prosgrade_titlebar {
            position: relative;
            padding: 180px 0 120px 0;
            background-size: cover;
            background-position: top center;
            pointer-events: none;
            color: var(--bs-white);
        }

        @media (max-width: 992px) {
            #prosgrade_titlebar {
                padding: 120px 0 70px 0;
            }
        }