/* Responsive Design */

@media (max-width: 1400px) {
    .hero-title {
        font-size: 62px;
    }

    .profile-card-img {
        width: 100%;
        height: 273px;
        border-radius: 24px;
        object-fit: cover;
        box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08);
    }

    .profile-card-left {
        width: 185px;
        flex-shrink: 0;
        position: relative;
    }

    .new-match-notif {
        right: -20px;
    }

    .profile-loc {
        font-size: 12.5px;

    }
}

@media (max-width: 1199px) {
    .hero-title {
        font-size: 52px;
    }

    .hero-graphics-container {
        min-height: 450px;
    }



    .hero-floating-main {
        right: 30px;
    }

    .hero-floating-img {
        height: 250px;
    }

    .login-right-side {
        padding: 40px;
    }
}

@media (max-width: 991px) {
    .hero-content-left {
        text-align: center;
        margin-bottom: 50px;
    }

    .ai-badge {
        margin: 0 auto;
    }

    .hero-graphics-container {
        margin-bottom: 50px;
        display: flex;
        justify-content: center;
        min-height: 400px;
    }

    .hero-floating-main {
        position: relative;
        left: 90px !important;
        top: 0;
    }

    .floating-online-badge,
    .liked-notification,
    .new-match-notif {
        /* display: none; */
        scale: 0.7;
    }

    .search-grid-container {
        grid-template-columns: 1fr 1fr;
    }

    .search-action {
        grid-column: span 2;
    }

    .hero-floating-secondary {
        z-index: 5;
        right: 20%;
        top: 0;
        transform: rotate(6deg);
        animation: float-secondary 8s ease-in-out infinite;
    }

    .hero-floating-card {
        background: #fff;
        border-radius: 35px;
        padding: 12px;
        box-shadow: 0 40px 100px rgba(0, 0, 0, 0.08);
        position: absolute;
        width: 280px;
        transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
        border: 1px solid rgba(255, 255, 255, 0.8);
    }

    /* Mobile Sidebar Styles */
    .mobile-sidebar {
        position: fixed;
        top: 0;
        left: -320px;
        width: 320px;
        height: 100vh;
        background: #fff;
        z-index: 1050;
        transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
        box-shadow: 25px 0 60px rgba(0, 0, 0, 0.08);
        display: flex;
        flex-direction: column;
        padding: 30px;
    }

    .mobile-sidebar.active {
        left: 0;
    }

    .sidebar-overlay {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.5);
        backdrop-filter: blur(8px);
        -webkit-backdrop-filter: blur(8px);
        z-index: 1040;
        opacity: 0;
        visibility: hidden;
        transition: all 0.4s ease;
    }

    .sidebar-overlay.active {
        opacity: 1;
        visibility: visible;
    }

    .sidebar-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 50px;
    }

    .btn-close-sidebar {
        background: #f1f4ff;
        border: none;
        width: 44px;
        height: 44px;
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 22px;
        color: var(--primary-color);
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    }

    .btn-close-sidebar:hover {
        background: var(--primary-color);
        color: #fff;
        transform: rotate(90deg) scale(1.1);
    }

    .sidebar-nav {
        display: flex;
        flex-direction: column;
        gap: 20px;
    }

    .sidebar-nav .nav-link {
        font-size: 16px;
        font-weight: 700;
        padding: 12px 15px;
        border-radius: 12px;
        color: #444 !important;
        transition: all 0.3s ease;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .sidebar-nav .nav-link:hover,
    .sidebar-nav .nav-link.active {
        background: #f8faff;
        color: var(--primary-color);
        padding-left: 20px;
    }

    .sidebar-footer {
        margin-top: auto;
        display: flex;
        flex-direction: column;
        gap: 20px;
        padding-top: 30px;
        border-top: 1px dashed #eee;
    }

    .sidebar-footer img {
        object-fit: cover;
    }

    .btn-signin-mobile {
        font-weight: 700;
        color: var(--text-dark);
        text-align: center;
        font-size: 16px;
        padding: 10px;
    }

    body.menu-open {
        overflow: hidden;
    }

    .py-100 {
        padding-top: 40px !important;
        padding-bottom: 40px !important;
    }

    .process-desc {
        color: #666;
        font-size: 16px;
        line-height: 1.6;
        margin-top: 16px;
    }

    /* Login Page Responsive */
    .login-container-wrapper {
        flex-direction: column;
    }

    .login-left-side,
    .login-right-side {
        width: 100%;
        padding: 40px;
    }

    .login-right-side {
        border-left: none;
        border-top: 1px solid #f0f0f0;
    }

    .login-left-side {
        text-align: center;
    }

    .login-subtitle {
        margin-left: auto;
        margin-right: auto;
    }

    .login-profile-visuals {
        display: none;
    }

    .trusted-users {
        justify-content: center;
        margin-top: 30px;
    }

    /* OTP Verification Responsive */
    .otp-inputs-wrapper {
        gap: 8px;
    }

    .otp-digit {
        width: 50px;
        height: 50px;
        font-size: 18px;
    }

    /* Search Results Page Responsive (< 992px) */
    .search-filters-card {
        position: fixed;
        top: 0;
        left: -380px;
        width: 330px;
        height: 100vh;
        overflow-y: auto;
        z-index: 1050;
        background: #fff;
        box-shadow: 25px 0 60px rgba(0, 0, 0, 0.2);
        transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
        margin: 0 !important;
        border-radius: 0 !important;
    }

    .search-filters-card.active {
        left: 0;
    }

    .filter-backdrop {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.5);
        backdrop-filter: blur(5px);
        -webkit-backdrop-filter: blur(5px);
        z-index: 1045;
        opacity: 0;
        visibility: hidden;
        transition: all 0.3s ease;
    }

    .filter-backdrop.active {
        opacity: 1;
        visibility: visible;
    }

    .btn-mobile-filter {
        background: #fff;
        border: 1px solid #cbd5e1;
        color: #1e293b;
        padding: 10px 20px;
        border-radius: 50px;
        font-size: 14px;
        font-weight: 700;
        display: inline-flex;
        align-items: center;
        gap: 8px;
        cursor: pointer;
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
        transition: all 0.2s ease;
    }

    .btn-mobile-filter:hover {
        background: #f8fafc;
        border-color: #94a3b8;
    }

    .btn-mobile-filter iconify-icon {
        font-size: 18px;
        color: #ff4b58;
    }

    .btn-close-filter {
        width: 38px;
        height: 38px;
        border-radius: 50%;
        background: #f1f5f9;
        border: none;
        color: #475569;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 20px;
        cursor: pointer;
        transition: all 0.2s ease;
    }

    .btn-close-filter:hover {
        background: #e2e8f0;
        color: #ef4444;
    }

    /* Profile Cards Stacking on Mobile */
    .result-profile-card {
        flex-direction: column;
        padding: 20px;
        gap: 20px;
        border-radius: 28px;
    }

    .profile-card-left {
        width: 100% !important;
    }

    .profile-card-img {
        height: 320px !important;
    }

    .profile-card-top {
        flex-direction: column;
        align-items: flex-start;
        gap: 14px;
    }

    .action-buttons-group {
        width: 100%;
        justify-content: space-between;
    }

    .search-input-box {
        flex-grow: 1;
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 0 20px;
        border: 1px solid #c4d3e9;
        width: 100%;
        height: 50px;
        border-radius: 52px;
    }

    .select-box-wrap {
        min-width: 100%;
    }

    .search-bar-floating-container {
        max-width: 1140px;
        margin: -65px auto -20px auto;
        position: relative;
        z-index: 20;
        padding: 0 15px;
    }
}

@media (max-width: 767px) {
    .search-grid-container {
        grid-template-columns: 1fr;
    }

    .search-action {
        grid-column: span 1;
    }

    .btn-begin {
        padding: 12px 24px;
        font-size: 16px;
    }

    .hero-floating-name {
        font-size: 18px;
        font-weight: 800;
        margin-bottom: 6px;
        color: #111;
    }

    .navbar-brand img {
        height: 35px;
    }

    .btn-join {
        padding: 14px 20px;
        font-size: 16px;
    }

    /* Search Result Page Mobile Stacking */
    .search-result-bar {
        flex-direction: column;
        padding: 16px;
        gap: 12px;
    }

    .search-result-bar>div,
    .search-result-bar .select-box-wrap,
    .search-result-bar .btn-main-search {
        width: 100% !important;
        border-right: none !important;
    }

    .search-result-bar .btn-main-search {
        margin-top: 8px;
    }

    /* Mobile Table / Grid Single Column Clean Reflow */
    .profile-details-table {
        padding: 16px !important;
        border-radius: 16px !important;
    }

    .details-grid-row {
        display: flex !important;
        flex-direction: column !important;
        min-width: 0 !important;
        gap: 10px !important;
        border-bottom: none !important;
        padding-bottom: 0 !important;
        margin-bottom: 0 !important;
    }

    .grid-cell {
        width: 100% !important;
        border-right: none !important;
        padding-right: 0 !important;
        padding-bottom: 10px !important;
        margin-bottom: 10px !important;
        border-bottom: 1px solid #edf2f7 !important;
    }

    .profile-details-table .details-grid-row:last-child .grid-cell:last-child {
        border-bottom: none !important;
        padding-bottom: 0 !important;
        margin-bottom: 0 !important;
    }

    .grid-cell .lbl {
        font-size: 13px !important;
        background: transparent !important;
    }

    .grid-cell .val {
        font-size: 13px !important;
        max-width: 60% !important;
        text-align: right !important;
    }

    /* Action Buttons Mobile Polish */
    .action-buttons-group {
        flex-wrap: wrap !important;
        gap: 8px !important;
    }

    .btn-circle-action {
        width: 33px !important;
        font-size: 17px;
        height: 33px !important;
    }

    .btn-pill-action {
        padding: 0 13px !important;
        height: 33px !important;
        font-size: 11.5px !important;
    }

    /* Bottom Tags & Prohibit Layout Fix */
    .profile-card-bottom {
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 16px !important;
    }

    .profile-tags-container {
        width: 100% !important;
        gap: 8px !important;
    }

    .btn-prohibit {
        align-self: flex-end !important;
        margin-top: -10px !important;
    }

    .profile-card-img {
        height: 280px !important;
    }
}

/* Ticker Responsive */
@media (max-width: 768px) {
    .ticker-item {
        font-size: 18px;
        gap: 30px;
    }

    .ticker-content {
        gap: 30px;
    }
}

/* Process Section Responsive */
@media (min-width: 992px) {
    .border-end-lg {
        border-right: 1px solid rgba(0, 0, 0, 0.08);
    }
}

@media (max-width: 991px) {
    .process-card {
        padding: 30px 20px;
        border-bottom: 1px solid rgba(0, 0, 0, 0.08);
    }

    .process-box {
        padding: 20px;
    }

    .process-title {
        font-size: 32px;
    }
}

/* Members Responsive */
@media (max-width: 1199px) {
    .member-card-wrapper {
        padding: 10px;
    }

    .member-info-overlay h4 {
        font-size: 18px;
    }
}

@media (max-width: 991px) {
    .members-section .process-title {
        font-size: 32px;
    }

    .btn-all-profiles {
        padding: 10px 20px;
        font-size: 14px;
    }
}

@media (max-width: 575px) {

    .member-img {
        aspect-ratio: 1 / 1;
    }

    /* OTP mobile responsive tweaks */
    .login-left-side,
    .login-right-side {
        padding: 24px 20px;
    }

    .otp-digit {
        width: 44px;
        height: 44px;
        font-size: 16px;
        border-radius: 8px;
    }
}

/* Stories Responsive */
@media (max-width: 991px) {
    .forever-bg-text {
        font-size: 100px;
        top: 20px;
        right: -20px;
    }

    .main-story-card {
        padding: 20px;
    }

    .story-img img {
        min-height: 300px;
    }

    .side-story-card {
        padding: 15px;
    }

    .side-img-box {
        width: 100px;
        height: 100px;
    }
}

@media (max-width: 575px) {
    .forever-bg-text {
        display: none;
    }

    .story-info h3 {
        font-size: 24px;
    }

    .side-story-card {
        flex-direction: column;
    }

    .side-img-box {
        width: 100%;
        height: 200px;
    }
}

/* Community Responsive */
@media (max-width: 991px) {
    .community-box {
        padding: 40px 20px;
    }

    .stat-num {
        font-size: 30px;
    }
}

@media (max-width: 575px) {
    .stat-card {
        padding: 30px 15px;
    }
}

/* About Responsive */
@media (max-width: 991px) {
    .features-provided-box {
        padding: 40px 20px;
        margin-top: 30px;
    }

    .feat-title {
        font-size: 26px;
    }
}

@media (max-width: 575px) {
    .about-feature-box {
        flex-direction: column;
        text-align: center;
        padding: 20px;
    }

    .feature-pill {
        font-size: 13px;
        padding: 12px 15px;
    }
}

/* App Responsive */
@media (max-width: 991px) {
    .app-box {
        padding: 40px 20px;
    }

    .app-mockup-wrapper {
        margin-top: 50px;
    }

    .app-section {
        padding-top: 0px !important;
    }
}

@media (max-width: 575px) {
    .app-benefits {
        gap: 15px !important;
    }

    .benefit-item {
        font-size: 13px;
    }

    .btn-app {
        width: 100%;
        justify-content: center;
    }
}

/* Explore Responsive */
@media (max-width: 991px) {
    .explore-card {
        padding: 30px;
    }

    .explore-header h3 {
        font-size: 18px;
    }
}

@media (max-width: 575px) {
    .explore-header h3 {
        font-size: 20px;
    }

    .tag-pill {
        padding: 6px 14px;
        font-size: 13px;
    }
}

/* CTA Responsive */
@media (max-width: 991px) {
    .cta-box {
        padding: 60px 30px;
    }

    .cta-title {
        font-size: 38px;
    }
}

@media (max-width: 575px) {
    .cta-title {
        font-size: 28px;
    }

    .cta-desc {
        font-size: 16px;
    }

    .btn-cta-white,
    .btn-cta-outline {
        width: 100%;
        justify-content: center;
        padding: 15px 30px;
    }
}

/* Footer Responsive */
@media (max-width: 991px) {
    .footer-section {
        text-align: center;
        padding: 0px 15px;
    }

    .social-links {
        justify-content: center;
    }

    .footer-links {
        margin-top: 20px !important;
    }

    .footer-desc {
        max-width: 100%;
    }

    .footer-title {
        text-align: left;
    }

    .footer-links li {
        text-align: left;
    }
}

@media (max-width: 767px) {
    .scroll-top-btn {
        width: 50px;
        height: 50px;
        bottom: 20px;
        right: 20px;
        font-size: 20px;
    }

    /* Mobile Pagination Clean Sizing */
    .search-pagination {
        gap: 6px !important;
    }

    .btn-page-nav,
    .btn-page-num {
        width: 36px !important;
        height: 36px !important;
        font-size: 14px !important;
        flex-shrink: 0 !important;
        aspect-ratio: 1 / 1 !important;
    }
}

/* Mobile Responsive Overrides for My Profile Page */
@media (max-width: 991px) {
    .profile-header-card {
        padding: 24px;
        border-radius: 24px;
    }

    .grid-info-item {
        display: flex;
        flex-direction: column;
        text-align: left;
    }

    .verify-info {
        text-align: left;
    }

    .profile-header-avatar-wrap {
        position: relative;
        width: 100%;
        height: 390px;
    }

    .profile-sidebar-card {
        background: white;
        box-shadow: none;
        border-radius: 0;
        height: 100vh;
    }

    .profile-sidebar-nav .nav-link {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 20px 13px;
        border-radius: 13px;
        color: #475569;
        font-weight: 600;
        font-size: 15px;
        transition: all 0.2s ease;
        text-decoration: none;
    }
}

@media (max-width: 767px) {
    .profile-header-card {
        padding: 20px;
        text-align: center;
    }

    .profile-header-avatar-wrap {
        margin: 0 auto 20px auto;
    }

    .profile-header-tags {
        justify-content: center;
    }

    .preference-table-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .profile-tab-btn {
        padding: 10px 16px;
        font-size: 14px;
    }


}

/* Glassmorphism dropdown menu for desktop */
@media (min-width: 992px) {
    .navbar .dropdown-menu {
        display: block;
        opacity: 0;
        visibility: hidden;
        transform: translateY(12px) scale(0.30);
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        background: rgba(255, 255, 255, 0.96);
        backdrop-filter: blur(20px);
        -webkit-backdrop-filter: blur(20px);
        border: 1px solid rgba(115, 66, 235, 0.08);
        border-radius: 18px;
        box-shadow: 0 20px 40px rgba(115, 66, 235, 0.06), 0 5px 15px rgba(0, 0, 0, 0.03);
        padding: 10px;
        min-width: 230px;
        margin-top: 15px !important;
    }


    .navbar .dropdown-menu.show {
        opacity: 1;
        visibility: visible;
        transform: translateY(0) scale(1);
    }
}

/* --create-account-steps-- */

@media (max-width: 991.98px) {
    .onboarding-steps-section {
        padding: 30px 0 60px 0;
    }

    .onboarding-form-card {
        padding: 24px;
    }

    .onboarding-steps-sidebar {
        margin-top: 20px;
        position: static;
        padding: 24px;
    }
}

/* =============================================
   Onboarding Steps Page (Step 5 & Step 6)
   ============================================= */
@media (max-width: 768px) {

    /* Step 5 - Photos */
    .photo-upload-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .photo-upload-slot.large-slot {
        aspect-ratio: 1 / 1.15;
    }

    /* Step 6 - ID Proof & Bio Data / Certificate */
    .doc-upload-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .id-proof-radios .form-check {
        display: flex;
        align-items: center;
        margin-bottom: 0;
        background: #f8fafc;
        padding: 8px;
        padding-left: 40px;
        border-radius: 14px;
        border: 1px solid #edf2f7;
        width: 41%;
    }

    .id-proof-radios {
        display: flex;
        flex-wrap: wrap;
        gap: 17px;
        justify-content: space-between;
    }

    .id-proof-radios .form-check-label {
        font-size: 13px;
    }

    .btn-accordion-edit {
        right: 20px;
        top: 30px;
    }

    .accordion-card-title-box span {
        display: none;
    }
}

/* =============================================
   Contact Us Page Responsive Styles
   ============================================= */

@media (max-width: 991px) {
    .contact-section-title {
        font-size: 32px;
    }

    .contact-right-wrapper {
        margin-top: 20px;
    }
}

@media (max-width: 767px) {
    .contact-page-section {
        padding: 40px 0 60px;
    }

    .contact-section-title {
        font-size: 28px;
    }

    .info-card {
        padding: 24px 16px;
    }

    .map-card-frame {
        height: 280px;
    }
}

/* =============================================
   Search Page Responsive Styles
   ============================================= */

@media (max-width: 991px) {
    .search-sidebar-wrapper {
        margin-top: 30px;
    }
}

@media (max-width: 767px) {
    .search-page-section {
        padding: 40px 0 60px;
    }

    .gender-cards-grid {
        gap: 12px !important;
    }

    .search-tabs-nav .nav-link {
        padding: 10px 18px;
        font-size: 14px;
    }

    .btn-search-cta {
        justify-content: center;
        width: 100%;
    }
}

/* =============================================
   Success Stories Page Responsive Styles
   ============================================= */

@media (max-width: 991px) {
    .stories-main-title {
        font-size: 36px;
    }

    .stories-hero-section {
        padding: 60px 0 40px;
    }

    .featured-story-banner .row,
    .story-card.horizontal-card .row {
        flex-direction: column;
    }

    .min-h-350 {
        min-height: 280px !important;
    }

    .story-card-img-wrap,
    .featured-story-img-container {
        height: 280px !important;
    }

    .stats-gradient-card {
        padding: 30px 20px !important;
    }

    .trust-stat-box {
        padding: 20px 15px;
    }

    .stories-testimonial-title {
        font-size: 28px;
    }

    .testimonial-bubble-card {
        padding: 30px 20px !important;
    }

    /* Video Story Banner Responsive Styles */
    .video-banner-overlay {
        background: linear-gradient(to top, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.5) 70%, rgba(0, 0, 0, 0.3) 100%);
        padding: 30px;
        align-items: flex-end;
    }

    .video-banner-img-container {
        min-height: 480px;
    }
}

@media (max-width: 767px) {
    .stories-main-title {
        font-size: 30px;
    }

    .stories-subtitle {
        font-size: 14.5px;
    }

    .stat-badge-pill {
        padding: 8px 16px;
        font-size: 12.5px;
    }

    .featured-story-title {
        font-size: 26px;
    }

    .romantic-quote {
        font-size: 14px;
    }

    .testimonial-text {
        font-size: 14.5px;
        line-height: 1.6;
    }

    /* Upload Story Form Responsive Styles */
    .onboarding-form-card.upload-card {
        padding: 25px 20px !important;
    }
}

@media (max-width: 575px) {
    .trust-stat-box {
        margin-bottom: 12px;
    }

    .trust-stat-box:last-child {
        margin-bottom: 0;
    }
}

@media (max-width: 991px) {
    .story-cover-image-container {
        height: 300px;
    }

    .story-narrative-card {
        padding: 24px !important;
    }

    .story-sidebar-sticky {
        position: static;
    }
}

/* =============================================
   IdealJodi Blog Page Responsive Styles
   ============================================= */

@media (max-width: 991px) {
    .blog-main-title {
        font-size: 28px;
    }

    .blog-hero-section {
        padding: 40px 0 20px;
    }

    .featured-card .row {
        flex-direction: column;
    }

    .featured-card .blog-card-img-wrap {
        height: 280px !important;
    }

    .featured-card .blog-card-body {
        padding: 30px 24px !important;
    }
}

@media (max-width: 767px) {
    .blog-main-title {
        font-size: 24px;
    }

    .blog-subtitle {
        font-size: 13.5px;
    }

    .btn-category-filter {
        padding: 8px 16px;
        font-size: 12px;
    }

    .blog-card-body {
        padding: 20px !important;
    }
}

/* =============================================
   IdealJodi Blog Details Page Responsive Styles
   ============================================= */

@media (max-width: 991px) {
    .blog-details-title {
        font-size: 28px;
    }

    .blog-details-featured-img-wrap {
        height: 320px;
    }

    .blog-details-content-body {
        font-size: 14.5px;
        line-height: 1.7;
    }

    .blog-details-content-body .lead-paragraph {
        font-size: 16px;
        margin-bottom: 20px;
    }

    .blog-details-content-body h2 {
        font-size: 22px;
        margin-top: 30px;
        margin-bottom: 12px;
    }

    .blog-details-sidebar {
        margin-top: 40px;
    }
}

@media (max-width: 767px) {
    .blog-details-title {
        font-size: 24px;
    }

    .blog-details-featured-img-wrap {
        height: 240px;
        border-radius: 16px;
    }

    .blog-details-content-body h2 {
        font-size: 20px;
    }

    .blog-details-footer-tags {
        flex-direction: column;
        align-items: flex-start !important;
        gap: 20px !important;
    }
}

/* ==========================================================================
   IdealJodi Matrimonial Events Page Responsive Styles
   ========================================================================== */

@media (max-width: 991px) {
    .events-main-title {
        font-size: 28px;
    }

    .events-hero-section {
        padding: 40px 0 20px;
    }

    .event-card-img-wrap {
        border-radius: 24px;
        margin-bottom: 16px;
    }

    .event-card-title {
        font-size: 20px;
    }
}

@media (max-width: 767px) {
    .events-main-title {
        font-size: 24px;
    }

    .events-subtitle {
        font-size: 13.5px;
    }

    .event-card-img-wrap {
        border-radius: 20px;
        aspect-ratio: 16 / 9;
    }

    .event-card-title {
        font-size: 19px;
    }

    .event-action-btn {
        width: 44px;
        height: 44px;
        font-size: 18px;
    }
}

/* ==========================================================================
   IdealJodi Matrimonial Event Detail Page Responsive Styles
   ========================================================================== */

@media (max-width: 991px) {
    .event-details-content-wrap {
        padding: 30px;
        border-radius: 24px;
        margin-bottom: 20px;
    }

    .event-details-hero-wrap {
        border-radius: 20px;
    }

    .event-details-title {
        font-size: 24px;
    }
}

@media (max-width: 767px) {
    .event-info-wrapper {
        flex-direction: column;
        align-items: stretch !important;
        gap: 15px !important;
    }

    .event-pricing-box {
        align-self: flex-start;
        width: 100%;
        text-align: center;
    }

    .event-details-title {
        font-size: 20px;
    }

    .event-description-box {
        font-size: 14.5px;
    }

    .event-description-box .lead-paragraph {
        font-size: 14px;
        margin-bottom: 20px;
    }

    .thumbnail-gallery-track {
        justify-content: space-between;
    }

    .event-details-meta {
        font-size: 10.5px;
        font-weight: 600;
        color: var(--text-muted);
    }

    .event-details-meta iconify-icon {
        color: var(--primary-color);
        font-size: 16px;
    }

    .sidebar-contact-card {
        padding: 20px;
    }

    .map-card-container {
        height: 240px;
        border-radius: 20px;
    }

    .event-details-content-wrap {
        padding: 20px;
        border-radius: 20px;
    }
}

/* Event Detail Ticket Modal Responsive Styles */
@media (max-width: 576px) {
    .modal-ticket-footer {
        flex-direction: column;
        align-items: stretch !important;
        gap: 15px !important;
    }

    .ticket-qty-price-box {
        width: 100% !important;
    }

    #btnBookTicketNext {
        width: 100% !important;
    }
}

/* ==========================================================
   IdealJodi Matrimony - Vendors Page Responsive Styles
   ========================================================== */

@media (max-width: 1199px) {
    .vendor-main-title {
        font-size: 38px;
    }

    .vendor-card-name {
        font-size: 17px;
    }
}

@media (max-width: 991px) {
    .vendor-hero-section {
        min-height: 340px;
        padding: 50px 0;
    }

    .vendor-main-title {
        font-size: 32px;
    }

    .vendor-subtitle {
        font-size: 14px;
        margin-bottom: 25px;
    }

    .search-panel-glass {
        flex-direction: column;
        border-radius: 30px;
        padding: 20px;
        gap: 12px;
    }

    .search-panel-glass .search-field-group {
        width: 100%;
        min-width: 100%;
        border-radius: 40px;
        padding: 15px 20px;
    }

    .search-panel-glass .btn-search-submit {
        width: 100%;
        height: 56px;
        border-radius: 40px;
    }

    .vendor-listing-section {
        padding: 60px 0;
    }
}

@media (max-width: 767px) {
    .vendor-hero-section {
        min-height: 280px;
    }

    .vendor-main-title {
        font-size: 26px;
    }

    .vendor-grid-header {
        text-align: center;
        margin-bottom: 30px;
    }

    .vendor-grid-header h2 {
        font-size: 26px;
    }

    .vendor-card-img-wrap {
        padding-bottom: 120%;
    }
}

/* ==========================================================
   IdealJodi Matrimony - Horizontal Vendor Card Listing Spacings
   ========================================================== */

@media (max-width: 991px) {
    .vendor-horizontal-card {
        flex-direction: column;
    }

    .vendor-horiz-img-area {
        width: 100%;
        min-width: 100%;
        min-height: 220px;
    }

    .vendor-horiz-category-badge {
        bottom: 15px;
        left: 15px;
    }

    .vendor-horiz-details-area {
        width: 100%;
        padding: 24px;
    }

    .vendor-horiz-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }

    .vendor-horiz-name {
        font-size: 19px;
    }

    .featured-vendor-badge {
        top: 15px;
        right: auto;
        left: 15px;
    }

    .vendor-horiz-info-tags {
        gap: 12px;
        padding: 10px 15px;
    }

    .vendor-horiz-chips {
        margin-bottom: 20px;
        gap: 14px;
    }
}

/* ==========================================================
   IdealJodi Matrimony - Vendor Details Responsiveness
   ========================================================== */
@media (max-width: 991px) {
    .vendor-sidebar-sticky {
        position: relative !important;
        top: 0 !important;
        margin-top: 30px;
        z-index: 10;
    }

    .featured-image-wrapper {
        height: 360px;
    }

    .vendor-details-title {
        font-size: 26px;
    }

    .thumbnail-item {
        width: 90px;
        height: 62px;
    }
}

@media (max-width: 575px) {
    .featured-image-wrapper {
        height: 240px;
    }

    .carousel-control-prev-custom,
    .carousel-control-next-custom {
        width: 36px;
        height: 36px;
        font-size: 16px;
    }

    .thumbnail-item {
        width: 70px;
        height: 50px;
        border-radius: 8px;
    }

    .vendor-details-title {
        font-size: 22px;
    }

    .price-val {
        font-size: 17px;
    }

    .vendor-details-header {
        padding: 20px !important;
    }
}

/* Community Page Responsive Styles */
@media (max-width: 991px) {
    .community-hero-section {
        padding: 50px 0 40px 0;
    }

    .community-banner-title {
        font-size: 32px;
    }

    .community-stats-container {
        gap: 15px;
        justify-content: space-between;
    }

    .community-toggle-card,
    .sidebar-widget-card {
        padding: 24px 20px;
    }

    .city-header-bar {
        padding: 14px 20px;
    }

    .city-header-title {
        font-size: 20px;
    }

    .community-stat-box {
        background: rgba(255, 255, 255, 0.02);
        border: 1px solid rgba(255, 255, 255, 0.06);
        padding: 16px 8px;
        border-radius: 16px;
        display: flex;
        flex-direction: column;
        gap: 0px;
        min-width: 100px;
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
        transition: all 0.3s ease;
        justify-content: space-between !important;
    }

    .cms-sidebar-card {
        display: none;
    }

    .cms-content-card {
        padding: 20px;
        overflow: hidden;
    }

    .faq-tabs-container {
        display: none;
    }

    .cms-page-section {
        padding: 15px 0px !important;
    }

    .faq-question {
        font-size: 15px !important;
    }

    .cms-text-block p {
        font-size: 14px;
    }
}

@media (max-width: 575px) {
    .community-banner-title {
        font-size: 26px;
    }

    .community-banner-subtitle {
        font-size: 14px;
    }

    .toggle-tab-btn {
        font-size: 13px;
    }

    .city-card {
        padding: 14px 16px;
        font-size: 14px;
    }

    .city-card-icon-box {
        width: 28px;
        height: 28px;
        font-size: 13px;
    }

    .city-card-arrow {
        width: 24px;
        height: 24px;
        font-size: 10px;
    }
}

@media (max-width: 576px) {
    .priority-radio-group {
        grid-template-columns: 1fr 1fr;
    }
}

/* ==========================================================
   Pricing Plans Page Responsive Styles
   ========================================================== */
@media (max-width: 991.98px) {
    .pricing-card.highlighted {
        transform: none !important;
    }

    .pricing-card.highlighted:hover {
        transform: translateY(-8px) !important;
    }
}

/* ==========================================================
   Pricing Plan Checkout Page Responsive Styles
   ========================================================== */
@media (max-width: 575.98px) {
    .checkout-page-section {
        padding: 40px 0 60px;
    }

    .checkout-card {
        padding: 20px !important;
    }

    .coupon-card {
        flex-direction: column;
    }

    .coupon-left {
        width: 100% !important;
        height: 60px;
        flex-direction: row !important;
        justify-content: center;
        gap: 10px;
        padding: 10px !important;
    }

    .coupon-left::after {
        display: none !important;
    }

    .coupon-left .coupon-percent {
        font-size: 22px !important;
    }

    .coupon-left .coupon-off-lbl {
        font-size: 11px !important;
        margin-top: 4px;
    }
}

/* ==========================================================
   Photo Requests Responsive Styles
   ========================================================== */
@media (max-width: 991.98px) {
    .profile-content-card {
        padding: 20px;
    }

    .section-title {
        font-size: 24px;
    }

    .received-request-item {
        padding: 16px 20px;
    }

    .received-request-avatar {
        width: 60px;
        height: 60px;
    }

    .received-request-name {
        font-size: 16px;
    }
}

@media (max-width: 767.98px) {
    .section-header {
        flex-direction: column;
        align-items: flex-start !important;
        gap: 15px !important;
    }

    .section-actions {
        width: 100%;
        gap: 10px !important;
    }

    .section-actions .btn-select-all,
    .section-actions .btn-delete-selected {
        flex: 1;
        justify-content: center;
        padding: 8px 12px;
        font-size: 13px;
    }

    .received-request-item {
        flex-direction: column;
        align-items: flex-start;
        padding: 20px;
        position: relative;
        gap: 15px;
    }

    .received-request-item .custom-checkbox-label {
        position: absolute;
        top: 20px;
        right: 20px;
    }

    .received-request-details {
        width: 100%;
    }

    .received-request-actions {
        width: 100%;
        margin-top: 5px;
    }

    .received-request-actions .btn-accept-request,
    .received-request-actions .btn-reject-request {
        flex: 1;
        justify-content: center;
        padding: 8px 16px;
        font-size: 13px;
    }

    .sent-request-card {
        padding: 16px;
    }

    .sent-request-photo-wrap {
        width: 100px;
        height: 100px;
    }
}

@media (max-width: 575.98px) {
    .sent-request-card {
        flex-direction: column;
        align-items: flex-start;
        position: relative;
    }

    .sent-request-photo-wrap {
        width: 100%;
        height: 340px;
    }

    .sent-request-photo-wrap .custom-checkbox-label {
        top: 12px !important;
        left: 12px !important;
    }

    .sent-request-card-info {
        width: 100%;
        margin-top: 12px;
    }

    .sent-request-card-info .d-flex {
        justify-content: space-between !important;
        align-items: center;
        margin-bottom: 8px;
    }

    .sent-request-card-info .btn-card-menu {
        padding: 4px;
    }

    .sent-request-card-actions {
        width: 100%;
        margin-top: 12px;
    }

    .btn-card-action {
        padding: 9px 12px;
        font-size: 12px;
    }

    .profile-content-card {
        padding: 15px;
        border-radius: 18px;
    }
}

/* ==========================================================
   IdealJodi Matrimony - Responsive Chat Detail Overrides
   ========================================================== */

@media (max-width: 991.98px) {
    .chat-split-row {
        flex-direction: column;
    }

    .chat-list-column {
        width: 100% !important;
        border-right: none !important;
    }

    .chat-detail-column {
        width: 100% !important;
        padding-left: 15px !important;
        margin-top: 0;
        min-height: 520px;
    }

    .chat-header-back-btn {
        display: flex !important;
    }

    .chat-message-list {
        max-height: 380px;
    }
}

/* ==========================================================
   Short Listed & Blocked Profiles Responsive Styles
   ========================================================== */
@media (max-width: 767.98px) {

    .shortlisted-list-item,
    .blocked-list-item {
        padding: 14px 20px;
        gap: 16px;
    }

    .shortlisted-item-photo-wrap,
    .blocked-item-photo-wrap {
        width: 70px;
        height: 70px;
        border-radius: 14px;
    }

    .shortlisted-item-name,
    .blocked-item-name {
        font-size: 18px;
        margin-bottom: 6px;
    }

    .shortlisted-item-meta,
    .blocked-item-meta {
        font-size: 13.5px;
    }

    .btn-shortlisted-toggle,
    .btn-blocked-toggle {
        padding: 6px 18px;
        font-size: 13px;
        padding-left: 6px;
    }

    .btn-shortlist-star-box,
    .btn-blocked-ban-box {
        width: 26px;
        height: 26px;
        font-size: 14px;
    }
}

@media (max-width: 575.98px) {

    .shortlisted-list-item,
    .blocked-list-item {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: flex-start;
        padding: 16px;
        gap: 12px;
        position: relative;
    }

    .shortlisted-item-checkbox,
    .blocked-item-checkbox {
        position: absolute;
        top: 16px;
        left: 16px;
        z-index: 5;
    }

    .shortlisted-item-photo-wrap,
    .blocked-item-photo-wrap {
        width: 64px;
        height: 64px;
        border-radius: 12px;
        margin-left: 32px;
    }

    .shortlisted-item-details,
    .blocked-item-details {
        width: calc(100% - 108px);
        flex-grow: 1;
    }

    .shortlisted-item-name,
    .blocked-item-name {
        font-size: 17px;
        margin-bottom: 4px;
    }

    .shortlisted-item-meta,
    .blocked-item-meta {
        font-size: 13px;
        line-height: 1.4;
    }

    .shortlisted-item-actions,
    .blocked-item-actions {
        width: 100%;
        justify-content: flex-end;
        margin-top: 8px;
        border-top: 1px dashed #e2e8f0;
        padding-top: 12px;
    }

    .btn-shortlisted-toggle,
    .btn-blocked-toggle {
        padding: 5px 14px;
        font-size: 12px;
        padding-left: 5px;
    }

    .btn-shortlist-star-box,
    .btn-blocked-ban-box {
        width: 22px;
        height: 22px;
        font-size: 12px;
    }
}

/* ==========================================================
   General / Shared Responsive Overrides (Moved from main.css)
   ========================================================== */
@media (max-width: 1200px) {
    .details-grid-row {
        grid-template-columns: repeat(2, 1fr);
    }

    .grid-cell:nth-child(2) {
        border-right: none;
    }
}

@media (max-width: 992px) {
    .result-profile-card {
        flex-direction: column;
        align-items: center;
    }

    .profile-card-left {
        width: 100%;
        max-width: 320px;
    }

    .profile-card-right {
        width: 100%;
    }

    .search-bar-inner {
        flex-direction: column;
        border-radius: 28px;
        padding: 20px;
    }

    .btn-main-search {
        width: 100%;
        justify-content: center;
    }

    .header-stats-container {
        justify-content: flex-start;
        margin-top: 30px;
    }
}

@media (min-width: 992px) {
    .navbar .dropdown-menu.show {
        opacity: 1;
        visibility: visible;
        transform: translateY(0) scale(1);
    }

    .min-h-350 {
        height: 350px !important;
    }

    .min-h-300 {
        height: 300px !important;
    }
}

@media (min-width: 768px) {
    .border-md-end {
        border-right: 1.5px solid #edf2f7 !important;
    }
}

@media (max-width: 768px) {
    .faq-accordion-body {
        padding: 0 20px 20px 20px;
    }
}

/* ==========================================================
   IdealJodi Matrimony - Settings Page Redesign Responsive CSS
   ========================================================== */
@media (max-width: 991.98px) {


    .profile-tabs-nav.settings-tabs .profile-tab-btn {
        flex: 0 0 auto;
        border-radius: 12px;
        padding: 10px 18px;
    }

    .profile-tabs-nav.settings-tabs .profile-tab-btn.active {
        border-radius: 12px !important;
    }

    /* Public profile page overrides */
    .gallery-grid {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 200px 100px;
        gap: 12px;
    }

    .gallery-item-main {
        grid-row: span 2;
        height: 312px;
    }

    .gallery-info-banner {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .btn-request-gallery-access {
        width: 100%;
        text-align: center;
    }

    .user-profile-actions {
        justify-content: center;
        padding: 12px 16px;
    }

    .user-action-btn {
        padding: 10px 18px;
        font-size: 13px;
        flex: 1 1 auto;
    }
}

@media (max-width: 767.98px) {
    .settings-toggles-grid {
        grid-template-columns: 1fr;
    }

    /* Public profile page overrides */
    .gallery-grid {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto;
        gap: 8px;
    }

    .gallery-item-main {
        grid-column: span 2;
        grid-row: span 1;
        height: 220px;
    }

    .gallery-item {
        height: 95px;
    }

    .user-profile-actions {
        gap: 8px;
    }

    .user-action-btn {
        width: 100%;
        padding: 12px 20px;
    }
}

@media (max-width: 575.98px) {
    .settings-option-desc {
        margin-left: 0;
    }

    .settings-choice-group {
        margin-left: 0;
    }

    .settings-message-box {
        margin-left: 0;
    }
}

/* ==========================================================
   IdealJodi Matrimony - Redesigned Premium Profile Card Responsive CSS
   ========================================================== */
@media (max-width: 991.98px) {
    .profile-main-card {
        padding: 20px;
    }

    .profile-main-card .row {
        text-align: center;
    }

    /* Adapting Portrait Avatar size on Tablets */
    .profile-avatar-container {
        width: 190px;
        height: 250px;
        margin-bottom: 10px;
    }

    /* Scaling Floating Actions Dock for Tablet Portraits */
    .avatar-action-dock {
        padding: 6px;
        border-radius: 16px;
        bottom: 8px;
        left: 8px;
        right: 8px;
    }

    .avatar-action-dock .circle-action-btn {
        width: 32px;
        height: 32px;
        font-size: 14px;
    }

    /* Metrics Grid columns adaptation */
    .profile-details-list {
        margin-top: 15px;
        grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    }

    .profile-short-bio {
        margin-top: 15px;
        text-align: left;
    }

    /* Styling Horizontal Action Buttons on Tablets */
    .profile-actions-bar {
        justify-content: center;
        width: 100%;
        gap: 12px !important;
    }

    .action-btn-horizontal {
        flex: 1 1 calc(33.33% - 12px) !important;
        min-width: 140px;
        justify-content: center;
    }

    .profile-actions-bar .ms-md-auto {
        margin-left: 0 !important;
        flex: 1 1 100% !important;
    }

    .action-btn-horizontal.btn-report-stacked {
        width: 100% !important;
    }
}

@media (max-width: 767.98px) {
    .profile-nav-arrow {
        display: none !important;
        /* Hide arrows on mobile views to give maximum room */
    }

    .profile-name {
        font-size: 22px;
        justify-content: center;
    }

    /* Stack buttons fully vertically on phones for easy clicking */
    .profile-actions-bar {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 10px !important;
    }

    .action-btn-horizontal {
        width: 100% !important;
        flex: none !important;
    }
}

/* ==========================================================
   IdealJodi Matrimony - Contact Modal Responsive Rules
   ========================================================== */
@media (max-width: 575.98px) {
    #contactDetailsModal .modal-title {
        font-size: 18px;
    }

    .contact-main-photo-wrap {
        height: 180px;
    }

    .contact-thumbnails {
        width: 40px;
    }

    .contact-thumb {
        width: 40px;
        height: 40px;
        border-radius: 6px;
    }

    .contact-action-card {
        height: 60px;
        border-radius: 10px;
    }

    .contact-action-card iconify-icon {
        font-size: 18px;
    }

    .contact-action-card span {
        font-size: 9px;
    }

    .contact-info-grid {
        padding-left: 0;
    }

    .info-field-val {
        font-size: 14px;
    }

    .modal:not(.lightbox-modal) .modal-header {
        padding: 16px 20px 8px 20px !important;
    }

    .modal:not(.lightbox-modal) .modal-body {
        padding: 8px 20px 20px 20px !important;
    }
}

/* ==========================================================
   404 Page Responsive Rules
   ========================================================== */
@media (max-width: 991px) {
    .error-card {
        padding: 0;
        border-radius: 30px;
    }

    .error-title-modern {
        font-size: 36px;
    }

    .error-text-modern {
        font-size: 14px;
    }

    .error-badge-icon {
        margin: auto;
        margin-bottom: 15px;
    }

    .error-content-wrap {
        padding: 40px 25px;
    }

    .error-illustration-wrap {

        min-height: 360px;
        background: #ffffff;
    }
}

/* ==========================================================
   IdealJodi Matrimony - Invoice Page Responsiveness
   ========================================================== */
@media (max-width: 991px) {
    .invoice-meta-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .invoice-meta-right {
        text-align: left;
        align-items: flex-start;
    }

    .invoice-company-details {
        text-align: left;
        margin-top: 15px;
    }

    .company-detail-item {
        justify-content: flex-start;
    }

    .invoice-card {
        padding: 25px;
    }
}

@media (max-width: 575px) {
    .invoice-summary-area {
        width: 100%;
    }

    .invoice-table th,
    .invoice-table td {
        padding: 12px 10px;
        font-size: 12px;
    }
}

/* ==========================================================
   IdealJodi Matrimony - Current Plan Responsiveness
   ========================================================== */
@media (max-width: 991px) {
    .plan-details-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }
}

@media (max-width: 767px) {
    .past-plan-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
    }

    .past-plan-actions {
        width: 100%;
        border-top: 1px dashed #e2e8f0;
        padding-top: 12px;
    }

    .past-plan-actions .btn-invoice-action {
        flex: 1;
        justify-content: center;
    }
}

@media (max-width: 575px) {
    .plan-details-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .plan-billing-banner {
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
    }

    .plan-billing-banner .btn-invoice-action {
        width: 100%;
        justify-content: center;
    }

    .plan-header-area {
        display: flex;
        align-items: flex-start;
        border-bottom: 1px dashed #e2e8f0;
        padding-bottom: 20px;
        margin-bottom: 24px;
        flex-direction: column;
        gap: 12px;
    }
}

/* ==========================================================
   IdealJodi Matrimony - Saved Searches Responsiveness Overrides
   ========================================================== */
@media (max-width: 767.98px) {
    .saved-search-grid-container {
        grid-template-columns: 1fr;
        padding-top: 16px;
        column-gap: 0;
    }

    .saved-search-grid-item {
        padding: 10px 0;
        border-bottom: 1px solid #f1f5f9;
    }

    .saved-search-grid-item:last-child {
        border-bottom: none;
    }

    .saved-search-grid-item:nth-last-child(2) {
        border-bottom: 1px solid #f1f5f9;
    }
}

@media (max-width: 575.98px) {
    .saved-search-header-row {
        flex-direction: column;
        align-items: flex-start;
    }

    .saved-search-right-part {
        width: 100%;
        justify-content: space-between;
        margin-top: 12px;
        border-top: 1px dashed #e2e8f0;
        padding-top: 12px;
    }
}

/* ==========================================================
   IdealJodi Matrimony - Error & No Data Pages Responsiveness Overrides
   ========================================================== */
@media (max-width: 991px) {
    .error-page-wrapper {
        padding: 40px 0 !important;
    }

    .error-card {
        border-radius: 24px !important;
        margin: 0 15px;
    }

    .error-illustration-wrap {
        min-height: 280px !important;
        height: 280px !important;
    }

    .error-illustration-img {
        object-position: center !important;
    }

    .error-content-wrap {
        padding: 40px 24px !important;
    }

    .error-title-modern {
        font-size: 32px !important;
        line-height: 1.3 !important;
    }

    .error-text-modern {
        margin-bottom: 30px !important;
    }

    .error-actions {
        flex-direction: column !important;
        gap: 12px !important;
        width: 100% !important;
        max-width: 300px !important;
        margin: 0 auto !important;
    }

    .error-actions a {
        width: 100% !important;
        justify-content: center !important;
    }

    .meeting-card-item {
        display: flex;
        flex-direction: column;
    }

    .meeting-photo-wrap {
        width: 100%;
        height: 340px;
        border-radius: 20px;
        overflow: hidden;
        border: 1px solid #edf2f7;
        position: relative;
    }

    .admin-match-item {
        display: flex;
        align-items: center;
        padding: 20px 24px;
        border-bottom: 1px solid #f1f5f9;
        transition: all 0.3s ease;
        position: relative;
        gap: 20px;
        flex-direction: column;
        text-align: center;
    }

    .admin-match-photo-wrap {
        width: 100%;
        height: 330px;
        flex-shrink: 0;
        border-radius: 18px;
        overflow: hidden;
        position: relative;
        border: 1px solid #edf2f7;
    }
}

@media (max-width: 575px) {
    .error-title-modern {
        font-size: 26px !important;
    }

    .error-illustration-wrap {
        min-height: 220px !important;
        height: 220px !important;
    }
}

/* Scoped Affiliate Page Responsive Styles */
@media (max-width: 991px) {
    .aff-hero-sec {
        padding-bottom: 60px;
    }

    .aff-hero-title {
        font-size: 48px;
        text-align: center;
    }

    .aff-hero-desc {
        font-size: 16px;
        text-align: center;
    }

    .aff-hero-btn-group {
        justify-content: center;
    }

    .aff-hero-stats-row {
        justify-content: center;
    }

    .aff-hero-graphic-container {
        margin-top: 40px;
        min-height: 400px;
    }

    .aff-hero-circle-bg {
        width: 320px;
        height: 320px;
    }

    .aff-hero-photo-wrap {
        width: 290px;
        height: 290px;
    }

    .aff-section-title {
        font-size: 36px;
        text-align: center;
    }

    .aff-section-desc {
        text-align: center;
    }

    .aff-dashboard-mockup {
        margin-right: 0;
        margin-bottom: 40px;
    }

    .aff-trust-stats-grid {
        justify-content: center;
    }

    .aff-cta-title {
        font-size: 32px;
    }

    .aff-steps-sec,
    .aff-trust-sec,
    .aff-benefits-sec {
        padding: 50px 0;
    }

    .aff-cta-sec {
        padding: 40px 0 60px;
    }
}

@media (max-width: 575px) {
    .aff-hero-title {
        font-size: 38px;
    }

    .aff-hero-stats-row {
        flex-direction: row;
        align-items: center;
        gap: 20px;
        border: 0;
        padding-top: 0px;
        justify-content: space-between;
        width: 100%;
    }

    .aff-hero-stat-card {
        text-align: center;
    }

    .aff-trust-stats-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .aff-hero-stat-card span {
        font-size: 11px;
    }

    .aff-talk-card {
        padding: 30px 20px;
    }

    .aff-login-visuals {
        display: none;
    }
}