/* ── Utilities ── */
        .common_class {
            float: left;
            width: 100%;
        }

        .heading-accent {
            color: #F35B00;
        }

        .heading-main {
            font-size: 40px;
            font-weight: 800;
            color: #000;
            line-height: 1.2;
        }

        .section-title {
            font-size: 32px;
            font-weight: 800;
            color: #000;
            line-height: 40px;
            margin-bottom: 20px;
        }

        .subheading {
            font-size: 20px;
            font-weight: 700;
            color: #003596;
            margin-bottom: 14px;
        }

        p,
        ul li {
            font-size: 17px;
            line-height: 26px;
            font-weight: 500;
            color: #2C2C2C;
        }

        ul {
            padding-left: 20px;
        }

        .btn-orange {
            display: block;
            width: 100%;
            background: #F35B00;
            color: #fff;
            font-size: 17px;
            font-weight: 700;
            border-radius: 5px;
            border: none;
            padding: 12px 0;
            cursor: pointer;
            text-align: center;
            transition: background 0.2s;
            font-family: 'Manrope', sans-serif;
        }

        .btn-orange:hover {
            background: #d44e00;
            color: #fff;
        }

        /* ══════════════════════════════════════════
           HERO SECTION
        ══════════════════════════════════════════ */
        .hero-section {
            background: url("https://www.onlinelegalindia.com/images/business-dispute/hero-banner.webp") no-repeat center center;
            background-size: cover;
            position: relative;
            overflow: hidden;
            padding: 0;
            float: left;
            width: 100%;
        }



        .hero-content {
            padding: 60px 0 0 0;
            position: relative;
            z-index: 2;
        }

        .hero-title {
            font-size: 56px;
            font-weight: bold;
            color: #fff;
            line-height: 64px;
            margin-bottom: 20px;
        }

        .hero-title .heading-accent {
            color: #F35B00;
        }

        .hero-desc {
            font-size: 16px;
            line-height: 26px;
            font-weight: 500;
            color: rgba(255, 255, 255, 0.88);
            margin-bottom: 22px;
        }

        .hero-desc .hero-sub {
            display: block;
            margin-top: 10px;
        }



        .brand-ambassador b {
            color: #F35B00;
        }

        .hero-img-wrap {
            position: relative;
            z-index: 2;
            text-align: right;
            padding-top: 20px;
        }

        .hero-img-wrap img.hero-person {
            width: 100%;
            max-width: 320px;
            display: inline-block;
            vertical-align: bottom;
            position: relative;
            z-index: 2;
        }

        /* ══════════════════════════════════════════
           FORM + TYPES SECTION
        ══════════════════════════════════════════ */
        .form-types-section {
            background: url("https://www.onlinelegalindia.com/images/business-dispute/line-bg.webp");
            background-size: auto;
            background-repeat: no-repeat;
            padding: 60px 0;
        }

        .one_right {
            box-shadow: 2px 1px 17px 0px rgba(0, 0, 0, 0.2);
            padding: 25px 15px;
            border-radius: 12px;
            background-color: #fff;
        }

        .one_right h5 {
            text-align: center;
            color: #000000;
            font-size: 18px;
            font-weight: 600;
        }

        .form_one_right {
            margin-top: 25px;
        }

        .form-group {
            margin-bottom: 15px;
        }

        .new_control {
            height: 40px !important;
            font-size: 14px;
            width: 100%;
            border: 1px solid #ccc;
            color: #919191;
        }

        .new_control_select {
            border-radius: 4px !important;
            padding-left: 10px;
        }

        .tsfb_started {
            background-color: #129805;
            height: 40px;
            border-radius: 24px;
            color: #fff !important;
            font-size: 16px;
            font-weight: 700;
            width: 100%;
            margin-top: 20px
        }



        /* Types of disputes */
        .types-col {
            padding-left: 24px;
        }



        .types-col ul {
            margin-top: 10px;
        }

        .types-col ul li {
            margin-bottom: 6px;
        }

        .legal-framework {
            margin-top: 20px;
        }

        .legal-framework .lf-title {
            font-size: 32px;
            font-weight: 800;
            color: #000;
            margin-bottom: 10px;
            line-height: 40px;
            margin-bottom: 16px;
        }

        /* ══════════════════════════════════════════
           WHO SHOULD USE
        ══════════════════════════════════════════ */
        .who-section {
            padding: 0 0 60px 0;
        }

        .scenter {
            text-align: center;
            margin-bottom: 40px;
        }

        .who-card {
            background: #FFF3EC;
            border-radius: 12px;
            padding: 28px 16px 22px;
            text-align: center;
            margin-bottom: 20px;
            font-size: 16px;
            font-weight: 700;
            color: #2C2C2C;
            min-height: 130px;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 10px;
            transition: box-shadow 0.2s, transform 0.2s;
        }

        .who-card:hover {
            box-shadow: 0 6px 20px rgba(243, 91, 0, 0.14);
            transform: translateY(-3px);
        }

        .who-card .card-icon {
            width: 44px;
            height: 44px;
            object-fit: contain;
        }

        /* Placeholder icon circles */
        .who-card .icon-placeholder {
            width: 44px;
            height: 44px;
            border-radius: 50%;
            background: #F35B00;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0 auto;
        }

        .who-card .icon-placeholder svg {
            fill: #fff;
            width: 24px;
            height: 24px;
        }

        /* ══════════════════════════════════════════
           WHY CHOOSE
        ══════════════════════════════════════════ */
        .why-section {
            padding: 0 0 60px 0;
        }

        .why-list {
            list-style: none;
            padding-left: 0;
            margin-top: 16px;
        }

        .why-list li {
            position: relative;
            margin-bottom: 16px;
            font-size: 16px;
            font-weight: 500;
            display: flex;
            align-items: flex-start;
            gap: 6px;
        }

        .why-img-wrap img {
            width: 100%;
        }


        /* ══════════════════════════════════════════
           PANEL SECTION
        ══════════════════════════════════════════ */
        .header {
            background: linear-gradient(135deg, #2c2c2c 0%, #1a1a1a 100%);
            padding: 15px 25px;
            position: relative;
        }

        .header h2 {
            color: #fdb714;
            font-size: 18px;
            font-weight: bold;
            line-height: 1.4;
        }

        .header::after {
            content: '';
            position: absolute;
            right: 0;
            top: 0;
            width: 0;
            height: 0;
            border-style: solid;
            border-width: 0 0 70px 70px;
            border-color: transparent transparent #1a1a1a transparent;
        }

        .content {
            background: linear-gradient(135deg, #f5f5f5 0%, #e8e8e8 100%);
            padding: 30px 25px;
            position: relative;
        }

        .team-list {
            list-style: none;
            position: relative;
            z-index: 1;
        }

        .team-list li {
            font-size: 17px;
            color: #2c2c2c;
            margin-bottom: 20px;
            padding-left: 15px;
            position: relative;
            font-weight: 500;
        }

        .team-list li::before {
            content: '•';
            position: absolute;
            left: 0;
            font-size: 20px;
            color: #2c2c2c;
        }

        .content::after {
            content: '';
            position: absolute;
            right: 0;
            bottom: 0;
            width: 0;
            height: 0;
            border-style: solid;
            border-width: 0 0 120px 120px;
            border-color: transparent transparent #2c2c2c transparent;
        }

        .disclaimer {
            background: #fdb714;
            padding: 20px 25px;
            position: relative;
        }

        .disclaimer-title {
            font-size: 16px;
            font-weight: bold;
            color: #2c2c2c;
            margin-bottom: 8px;
        }

        .disclaimer-text {
            font-size: 14px;
            color: #2c2c2c;
            line-height: 1.5;
            margin-bottom: 5px;
        }

        .footer {

            border-top: 1px solid;
            background: #2e363a;
            text-align: center;
            margin-top: 0 !important;
            padding: 20px 0 !important;
        }

        .footer h3 {
            color: #fdb714;
            font-size: 22px;
            font-weight: bold;
            text-transform: capitalize;
        }

        .cstm_padd {
            padding: 0 0 60px 0;
        }

        /* ══════════════════════════════════════════
           CTA SECTION
        ══════════════════════════════════════════ */
        .cta-section {
            background: url(https://www.onlinelegalindia.com/images/business-dispute/cta-bg.webp) no-repeat center center;
            text-align: center;
            float: left;
            width: 100%;
            padding: 70px 0;
        }

        .cta-title p {
            font-size: 32px;
            font-weight: 800;
            color: #fff;
            line-height: 1.3;
            margin-bottom: 16px;
        }

        .cta-title .heading-accent {
            color: #F35B00;
        }

        .cta-desc {
            font-size: 17px;
            font-weight: 500;
            color: rgba(255, 255, 255, 0.82);
            margin-bottom: 36px;
        }

        .cta-btn-wrap {
            max-width: 220px;
            margin: 0 auto;
        }

        .common_heading h2 {
            color: #000;
            font-size: 32px;
            font-weight: 700;
            position: relative;
            text-align: center;
            margin-bottom: 20px;
            padding: 0 15px;
            line-height: 42px;
        }

        /* ===============================
   TABLET VIEW FIX (992px - 1199px)
   =============================== */
        @media (min-width: 768px) and (max-width: 1199px) {

            .hero-content {
                display: flex;
                align-items: center;
                /* vertical center */
            }

            .hero-content>div {
                float: none;
                /* override bootstrap float */
            }

            .hero-title {
                font-size: 44px;
                line-height: 52px;
            }

            .hero-desc {
                font-size: 15px;
                line-height: 24px;
                max-width: 95%;
            }

            .hero-img-wrap {
                text-align: right;
            }

            .hero-img-wrap img.hero-person {
                max-width: 280px;
                width: 100%;
            }

            .tab_view {
                text-align: center;
            }

            .form-types-section .row {
                display: flex;
                align-items: stretch;
                /* same height */
            }

            .form-types-section .col-md-5,
            .form-types-section .col-md-7 {
                float: none;
                /* remove bootstrap float issue */
                display: flex;
                flex-direction: column;
            }

            /* FORM BOX */
            .one_right {
                padding: 20px;
            }

            /* RIGHT CONTENT */
            .types-col {
                padding-left: 25px;
            }

            .section-title {
                font-size: 28px;
                line-height: 36px;
            }

            .subheading {
                font-size: 18px;
            }

            .types-col ul li {
                font-size: 15px;
                line-height: 24px;
            }

            .legal-framework .lf-title {
                font-size: 26px;
                line-height: 34px;
            }

            /* WHO SECTION - 2 CARDS PER ROW PERFECT */
            .who-section .col-sm-6 {
                width: 50%;
                float: left;
            }

            .who-card {
                min-height: 120px;
                padding: 20px;
            }

            /* WHY SECTION ALIGN */
            .why-section .col-md-7,
            .why-section .col-md-5 {
                display: flex;
                flex-direction: column;
                justify-content: center;
            }

            .why-img-wrap img {
                max-width: 280px;
                margin: 0 auto;
                display: block;
            }

            .why-section .row {
                display: flex;
                align-items: center;
                /* vertical center align */
            }

            .why-section .col-md-7,
            .why-section .col-md-5 {
                float: none;
                /* override bootstrap float */
                display: flex;
                flex-direction: column;
                justify-content: center;
            }

            /* LEFT TEXT */
            .section-title {
                font-size: 28px;
                line-height: 36px;
            }

            .why-list li {
                font-size: 15px;
                line-height: 24px;
            }

            /* RIGHT IMAGE */
            .why-img-wrap {
                text-align: center;
            }

            .why-img-wrap img {
                width: 100%;
            }

            /* CTA */
            .cta-title p {
                font-size: 28px;
                line-height: 36px;
            }

            .cstm_padd {
                padding: 0 15px 60px 15px !important;

            }

            .faq {
                padding: 0 15px;
            }
        }


        @media (max-width: 767px) {
            .hero-section {
                padding: 0;
            }

            .hero-content {
                padding: 40px 0 0;
            }

            .hero-title {
                font-size: 28px;
                line-height: 36px;
            }

            .hero-img-wrap {
                text-align: center;
                padding-top: 0;
            }

            .hero-img-wrap img.hero-person {
                max-width: 260px;
            }

            .section-title,
            .legal-framework .lf-title {
                font-size: 24px;
                line-height: 32px;
            }

            .scenter {
                margin-bottom: 20px;
                padding: 0 15px;
            }


            .types-col {
                padding-left: 15px;
                margin-top: 32px;
            }

            .form-types-section {
                background-size: auto;
            }

            .who-card {
                min-height: 100px;
                font-size: 14px;
                padding: 20px 12px;
            }

            .why-img-wrap {
                text-align: center;
            }

            .cstm_padd {
                padding: 0 15px 40px 15px !important;
            }

            .why-badges {
                text-align: center;
            }

            .cta-title p {
                font-size: 24px;
                line-height: 32px;
                padding: 0 15px;

            }

            .child-ans-text {
                margin-left: 0px;
            }

            .who-section {
                padding: 0 0 30px 0;
            }

            .form-types-section {
                padding: 30px 0;
            }

            .faq {
                padding-right: 15px;
                padding-left: 15px;
            }

            .common_heading h2 {
                font-size: 28px;
                line-height: 38px;
            }
        }