:root {
                                            /* --brand: #d54732; */
                                            /*  --brand2:#bd3f2d; */
                                            --brand: #cf3d33;
                                            /* --brand: #bd2124; */
                                            --brand2: #f46624;
                                            /*   --ink: #101828; */
                                            --muted: #667085;
                                            --line: #f2f4f7;
                                            --bg: #faf7f5;
                                            --card: #fff;
                                            --radius: 18px;
                                            --shadow-sm: 0 6px 20px rgba(16, 24, 40, .06);
                                            --shadow-md: 0 14px 34px rgba(16, 24, 40, .10);
                                            --shadow-lg: 0 24px 60px rgba(16, 24, 40, .14);
                                            --brand-soft: rgba(213, 71, 50, .08);
                                            --soft: rgba(213, 71, 50, .09);
                                            --ink: #0f1923;
                                            --sub: #3d4a5c;
                                            --line2: rgba(0, 0, 0, .06);
                                            --white: #fff;
                                            --sh1: 0 2px 8px rgba(0, 0, 0, .05);
                                            --sh2: 0 8px 28px rgba(0, 0, 0, .09);
                                            --sh3: 0 10px 46px rgba(0, 0, 0, .13);
                                            --r: 14px;
                                            --rL: 22px;
                                            --step-total: 5;
                                        }

                                        html {
                                            scroll-behavior: smooth;
                                        }

                                        /* ─── ANIMATED BG ─── */

                                        body::before {
                                            content: '';
                                            position: fixed;
                                            inset: 0;
                                            z-index: -1;
                                            background: radial-gradient(ellipse 80% 60% at 10% -10%, rgba(213, 71, 50, .10) 0%, transparent 60%), radial-gradient(ellipse 60% 50% at 90% 110%, rgba(213, 71, 50, .07) 0%, transparent 60%), #faf7f5;
                                        }

                                        /* ─── HERO ─── */

                                        .hero {
                                            /* padding: 60px 0 80px; */
                                            position: relative;
                                            padding: 0 !important;
                                        }

                                        .com-page-main-content {
                                            position: absolute;
                                            left: 0;
                                            top: 0;
                                            right: 0;
                                            width: 100%;
                                            /* padding: 100px 0px 100px 0px; */
                                            background: rgba(0, 0, 0, .45);
                                            height: 100%;
                                        }

                                        .com-page-main-content .hero-inner {
                                            display: flex;
                                            justify-content: center;
                                            flex-direction: column;
                                            height: 100%;
                                        }

                                        .comparison-v-hero {
                                            position: relative;
                                        }

                                        .comparison-v-hero video {
                                            width: 100%;
                                            height: 100%;
                                            object-fit: cover;
                                        }

                                        .hero-inner {
                                            max-width: 1300px;
                                            margin: auto;
                                            padding: 0 24px;
                                        }

                                        .hero-eyebrow {
                                            display: inline-flex;
                                            align-items: center;
                                            gap: 8px;
                                            padding: 6px 16px;
                                            background: rgba(213, 71, 50, .10);
                                            border-radius: 999px;
                                            font-size: 12px;
                                            font-weight: 800;
                                            color: var(--brand);
                                            text-transform: uppercase;
                                            letter-spacing: .8px;
                                            margin-bottom: 18px;
                                        }

                                        .hero-title {
                                            font-family: 'Playfair Display', serif;
                                            font-size: 52px;
                                            line-height: 1.0;
                                            /*  color: var(--ink); */
                                            color: #fff;
                                            margin-bottom: 14px;
                                        }

                                        .hero-title span {
                                            /* color: var(--brand); */
                                            color: #ff665b;
                                            position: relative;
                                        }

                                        .hero-title span::after {
                                            content: '';
                                            position: absolute;
                                            left: 0;
                                            bottom: -4px;
                                            width: 100%;
                                            height: 3px;
                                            background: linear-gradient(90deg, var(--brand), transparent);
                                        }

                                        .hero-sub {
                                            font-size: 15px;
                                            /* color: var(--muted); */
                                            color: #fff;
                                            max-width: 600px;
                                            margin-bottom: 32px;
                                            line-height: 1.7;
                                        }

                                        .hero-metrics {
                                            display: flex;
                                            gap: 12px;
                                            flex-wrap: wrap;
                                            margin-bottom: 28px;
                                        }

                                        .metric {
                                            /* background: #fff; */
                                            background: rgba(255, 255, 255, .13) !important;
                                            border: 1px solid rgba(255, 255, 255, .13) !important;
                                            border-radius: 999px;
                                            padding: 8px 16px;
                                            font-size: 12px;
                                            font-weight: 700;
                                            /* color: #7a2f24; */
                                            color: var(--brand) !important; 
                                            box-shadow: var(--shadow-sm);
                                            display: flex;
                                            align-items: center;
                                            gap: 6px;
                                            transition: .2s;
                                        }

                                        .metric:hover {
                                            transform: translateY(-2px);
                                            box-shadow: var(--shadow-md);
                                        }

                                        .selector-card {
                                            background: rgba(255, 255, 255, .13) !important;
                                            border: 1px solid #f1deda;
                                            border-radius: 24px;
                                            padding: 28px;
                                            box-shadow: var(--shadow-lg);
                                            position: relative;
                                            /* overflow: hidden; */
                                        }

                                        .selector-card::before {
                                            content: '';
                                            position: absolute;
                                            right: -80px;
                                            top: -80px;
                                            width: 200px;
                                            height: 200px;
                                            border-radius: 50%;
                                            background: radial-gradient(circle, rgba(213, 71, 50, .10), transparent 70%);
                                        }

                                        .sel-row {
                                            display: flex;
                                            gap: 16px;
                                            align-items: flex-end;
                                            flex-wrap: wrap;
                                        }

                                        .sel-slot {
                                            flex: 1;
                                            min-width: 180px;
                                        }

                                        .sel-slot label {
                                            display: block;
                                            font-size: 13px;
                                            font-weight: 600;
                                            /* color: #3d424c; */
                                            color: #fff;
                                            text-transform: uppercase;
                                            letter-spacing: .7px;
                                            margin-bottom: 7px;
                                        }

                                        .sel-slot select {
                                            width: 100%;
                                            border: 1.5px solid #d1d1d1;
                                            background: #fff;
                                            border-radius: 12px;
                                            padding: 12px 36px 12px 14px;
                                            font-size: 13px;
                                            font-family: inherit;
                                            outline: none;
                                            appearance: none;
                                            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%2398a2b3' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
                                            background-repeat: no-repeat;
                                            background-position: right 12px center;
                                            cursor: pointer;
                                            transition: .2s;
                                        }

                                        .sel-slot select:focus {
                                            border-color: var(--brand);
                                            box-shadow: 0 0 0 4px rgba(213, 71, 50, .12);
                                        }

                                        .vs-badge {
                                            width: 44px;
                                            height: 44px;
                                            border-radius: 50%;
                                            background: linear-gradient(135deg, var(--brand), var(--brand2));
                                            color: #fff;
                                            display: flex;
                                            align-items: center;
                                            justify-content: center;
                                            font-size: 11px;
                                            font-weight: 900;
                                            margin: 0 auto;
                                            box-shadow: 0 8px 18px rgba(213, 71, 50, .30);
                                            flex-shrink: 0;
                                            align-self: flex-end;
                                            margin-bottom: 2px;
                                        }

                                        .compare-btn {
                                            border: none;
                                            background: linear-gradient(135deg, var(--brand), var(--brand2));
                                            color: #fff;
                                            border-radius: 14px;
                                            padding: 13px 24px;
                                            font-size: 14px;
                                            font-weight: 800;
                                            font-family: inherit;
                                            white-space: nowrap;
                                            box-shadow: 0 10px 22px rgba(213, 71, 50, .28);
                                            cursor: pointer;
                                            display: flex;
                                            align-items: center;
                                            justify-content: center;
                                            gap: 8px;
                                            transition: .22s;
                                            align-self: flex-end;
                                            margin: 0 auto;
                                            width: 100%;
                                            max-width: 190px;
                                        }

                                        .compare-btn:hover {
                                            transform: translateY(-3px);
                                            box-shadow: 0 16px 30px rgba(213, 71, 50, .38);
                                        }

                                        /* ─── PROGRAM CARDS ─── */

                                        .section-label {
                                            max-width: 1300px;
                                            margin: 50px auto 20px;
                                            padding: 0 24px;
                                            display: flex;
                                            align-items: center;
                                            gap: 14px;
                                        }

                                        .section-label h2 {
                                            font-size: 26px;
                                            font-weight: 700;
                                            color: var(--ink);
                                        }

                                        .section-label .line {
                                            flex: 1;
                                            height: 1px;
                                            background: linear-gradient(90deg, var(--line), transparent);
                                        }

                                        .prog-cards {
                                            max-width: 1300px;
                                            margin: 0 auto;
                                            padding: 0 24px;
                                            display: grid;
                                            grid-template-columns: repeat(3, 1fr);
                                            gap: 20px;
                                        }

                                        .prog-card {
                                            background: #fff;
                                            border-radius: 20px;
                                            overflow: hidden;
                                            box-shadow: var(--shadow-sm);
                                            border: 1px solid var(--line);
                                            transition: .28s;
                                            cursor: pointer;
                                            position: relative;
                                        }

                                        .prog-card:hover {
                                            transform: translateY(-6px);
                                            box-shadow: var(--shadow-lg);
                                            border-color: #f3c8c1;
                                        }

                                        .prog-card.active-card {
                                            border: 2px solid var(--brand);
                                        }

                                        .prog-card img {
                                            width: 100%;
                                            /* height: 165px; */
                                            object-fit: cover;
                                            display: block;
                                        }

                                        .prog-card-body {
                                            padding: 18px;
                                        }

                                        .prog-card-body h5 {
                                            color: var(--brand);
                                            font-size: 13px;
                                            font-weight: 700;
                                            margin-bottom: 4px;
                                            text-transform: uppercase;
                                            letter-spacing: .4px;
                                        }

                                        .prog-card-body h4 {
                                            font-size: 16px;
                                            color: var(--ink);
                                            font-weight: 700;
                                            line-height: 1.3;
                                        }

                                        .prog-remove {
                                            position: absolute;
                                            top: 10px;
                                            right: 10px;
                                            width: 26px;
                                            height: 26px;
                                            background: var(--brand);
                                            color: #fff;
                                            border-radius: 50%;
                                            display: flex;
                                            align-items: center;
                                            justify-content: center;
                                            font-size: 12px;
                                            opacity: 0;
                                            transition: .2s;
                                            cursor: pointer;
                                        }

                                        .prog-card:hover .prog-remove {
                                            opacity: 1;
                                        }

                                        .add-card {
                                            border: 2px dashed rgba(213, 71, 50, .25);
                                            background: #fafafa;
                                            display: flex;
                                            flex-direction: column;
                                            align-items: center;
                                            justify-content: center;
                                            min-height: 240px;
                                            transition: .25s;
                                            cursor: pointer;
                                        }

                                        .add-card:hover {
                                            border-color: var(--brand);
                                            background: rgba(213, 71, 50, .03);
                                        }

                                        .add-card .plus-icon {
                                            width: 60px;
                                            height: 60px;
                                            border-radius: 50%;
                                            background: rgba(213, 71, 50, .10);
                                            color: var(--brand);
                                            font-size: 26px;
                                            display: flex;
                                            align-items: center;
                                            justify-content: center;
                                            margin-bottom: 12px;
                                            transition: .2s;
                                        }

                                        .add-card:hover .plus-icon {
                                            background: var(--brand);
                                            color: #fff;
                                            transform: scale(1.1);
                                        }

                                        .add-card span {
                                            color: #000;
                                            font-size: 14px;
                                            font-weight: 600;
                                        }

                                        /* ─── COMPARE MATRIX ─── */

                                        .matrix-section {
                                            max-width: 1300px;
                                            margin: 80px auto;
                                            padding: 0 24px;
                                        }

                                        .matrix-card {
                                            background: #fff;
                                            border-radius: 24px;
                                            /*   overflow: hidden; */
                                            box-shadow: var(--shadow-lg);
                                            border: 1px solid var(--line);
                                        }

                                        .matrix-top-bar {
                                            height: 5px;
                                            background: linear-gradient(90deg, var(--brand), var(--brand2), var(--brand));
                                        }

                                        .matrix-header {
                                            padding: 28px 32px 20px;
                                            border-bottom: 1px solid var(--line);
                                            background: linear-gradient(180deg, #fff, #fff8f6);
                                        }

                                        .matrix-header h3 {
                                            font-family: 'Playfair Display', serif;
                                            font-size: 28px;
                                            font-weight: 700;
                                            margin-bottom: 6px;
                                        }

                                        .matrix-header p {
                                            font-size: 14px;
                                            color: var(--muted);
                                        }

                                        /* SHARED */

                                        .pico {
                                            width: 28px;
                                            height: 28px;
                                            border-radius: 7px;
                                            background: var(--brand-soft);
                                            color: var(--brand);
                                            display: flex;
                                            align-items: center;
                                            justify-content: center;
                                            font-size: 11px;
                                            flex-shrink: 0;
                                        }

                                        .highlight-pill {
                                            display: inline-flex;
                                            align-items: center;
                                            gap: 5px;
                                           /*  background: rgba(100, 112, 133, .10); */
                                             background: rgba(213, 71, 50, .10);
                                            /* color: #757575; */
                                            color :var(--brand);
                                            border-radius: 999px;
                                            padding: 5px 12px;
                                            font-size: 14px;
                                            font-weight: 700;
                                        }

                                        .check-i {
                                            color: var(--brand);
                                            font-size: 16px;
                                        }

                                        /* ═══ DESKTOP CSS GRID ═══ */

                                        .grid-scroll {
                                            overflow-x: auto;
                                            -webkit-overflow-scrolling: touch;
                                        }

                                        .comp-grid {
                                            display: grid;
                                            grid-template-columns: 230px repeat(3, 1fr);
                                            min-width: 720px;
                                        }

                                        .cell {
                                            padding:9px 14px;
                                            border-bottom: 1px solid rgba(0, 0, 0, .04);
                                            display: flex;
                                            align-items: center;
                                            font-size: 16px;
                                            font-weight: 500;
                                            color: var(--ink);
                                        }

                                        .cell.center {
                                            justify-content: center;
                                            text-align: center;
                                        }

                                        .cell.thead {
                                            font-size: 14px;
                                            color: var(--muted);
                                            text-transform: uppercase;
                                            letter-spacing: .12em;
                                            font-weight: 700;
                                            background: #fafafa;
                                            align-items: flex-start;
                                        }

                                        .th-card {
                                            display: flex;
                                            flex-direction: column;
                                            align-items: center;
                                            gap: 10px;
                                            padding: 8px 0;
                                            width: 100%;
                                        }

                                        .th-img {
                                            width: 240px;
                                            height: 160px;
                                            object-fit: cover;
                                            border-radius: 10px;
                                        }

                                        .th-name {
                                            font-size: 15px;
                                            font-weight: 700;
                                            color: var(--ink);
                                        }

                                        .th-badge {
                                            font-size: 13px;
                                            font-weight: 800;
                                            background: rgba(100, 112, 133, .10);
                                            /*  background: rgba(213, 71, 50, .10); */
                                            color: #757575;
                                            padding: 3px 10px;
                                            border-radius: 999px;
                                        }

                                        .th-badge.gray {
                                            background: rgba(100, 112, 133, .10);
                                            color: var(--muted);
                                        }

                                        .cell.section-cell {
                                            grid-column: 1/-1 !important;
                                            /* background: linear-gradient(90deg, rgba(47, 47, 47, .08), transparent); */
                                            background: rgba(47, 47, 47, .08);
                                            font-size: 14px;
                                            color: var(--brand);
                                            font-weight: 700;
                                            text-transform: uppercase;
                                            /* letter-spacing: .14em; */
                                            letter-spacing: 2px;
                                            padding: 10px 20px;
                                            display: grid;
                                            /*  grid-template-columns: 230px repeat(3, 1fr); */
                                            min-width: 720px;
                                        }

                                        .cell.section-cell .cell {
                                            color: var(--brand);
                                            text-transform: capitalize;
                                            letter-spacing: normal;
                                            border: none;
                                        }

                                        .cell.section-cell .cell:first-child {
                                            color: var(--brand);
                                            text-transform: uppercase;
                                            letter-spacing: 2px;
                                            font-size: 14px;
                                            font-weight: 700;
                                            padding: 0;
                                        }

                                        .b-btn {
                                            text-decoration: underline;
                                            color: var(--brand) !important;
                                        }

                                        .param-cell {
                                            display: flex;
                                            align-items: center;
                                            gap: 10px;
                                            color: #000;
                                            font-size: 16px;
                                            font-weight: 500;
                                        }

                                        .cell.row-hover:hover {
                                            background: rgba(213, 71, 50, .015);
                                        }

                                        .cell.verdict {
                                            background: linear-gradient(180deg, #fff, #fff8f6);
                                            align-items: flex-start;
                                            flex-direction: column;
                                            padding: 24px 20px;
                                        }

                                        .v-score {
                                            font-family: 'Playfair Display', serif;
                                            font-size: 40px;
                                            font-weight: 800;
                                            color: var(--brand);
                                            line-height: 1;
                                        }

                                        .v-score.top {
                                            font-size: 48px;
                                        }

                                        .v-of {
                                            font-size: 11px;
                                            color: var(--muted);
                                            margin: 4px 0 14px;
                                        }

                                        .v-btn {
                                            display: block;
                                            width: 100%;
                                            border: none;
                                            border-radius: 10px;
                                            padding: 9px 10px;
                                            font-size: 12px;
                                            font-weight: 700;
                                            cursor: pointer;
                                            margin-bottom: 8px;
                                            font-family: inherit;
                                            transition: .2s;
                                        }

                                        .v-btn.primary {
                                            /* background: var(--brand); */
                                            background: linear-gradient(135deg, var(--brand), var(--brand2));
                                            color: #fff;
                                        }

                                        .v-btn.primary:hover {
                                            background: var(--brand2);
                                        }

                                        .v-btn.outline {
                                            background: #fff;
                                            color: var(--brand);
                                            border: 1.5px solid var(--brand);
                                        }

                                        .v-btn.outline:hover {
                                            background: rgba(213, 71, 50, .06);
                                        }

                                        /* ═══ MOBILE — hidden on desktop ═══ */

                                        .mob-wrap {
                                            display: none;
                                        }

                                        .mob-sticky-clone {
                                            display: none;
                                        }

                                        /* 
.add-sub {
    font-size: 12px !important;
    color: var(--muted) !important;
    margin-top: 10px;
}

.matrix-section {
    max-width: 1300px;
    margin: 50px auto;
    padding: 0 24px;
}

.matrix-card {
    background: #fff;
    border-radius: 24px;
    overflow: hidden;
    box-shadow: var(--shadow-lg);
    border: 1px solid var(--line);
}

.matrix-top-bar {
    height: 5px;
    background: linear-gradient(90deg, var(--brand), var(--brand2), var(--brand));
}

.matrix-header {
    padding: 28px 32px 20px;
    border-bottom: 1px solid var(--line);
    background: linear-gradient(180deg, #fff, #fff8f6);
}

.matrix-header h3 {
    font-family: 'Playfair Display', serif;
    font-size: 28px;
    font-weight: 700;
    margin-bottom: 6px;
}

.matrix-header p {
    font-size: 14px;
    color: var(--muted);
}

.table-scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

table.comp-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 720px;
}

table.comp-table th,
table.comp-table td {
    padding: 14px 20px;
    text-align: left;
    border-bottom: 1px solid rgba(0, 0, 0, .04);
}

table.comp-table th:nth-child(n+2),
table.comp-table td:nth-child(n+2) {
    text-align: center;
}

table.comp-table thead th {
    font-size: 11px;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: .12em;
    font-weight: 700;
    background: #fafafa;
}

.th-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
}

.th-img {
    width: 100px;
    height: 65px;
    object-fit: cover;
    border-radius: 10px;
}

.th-name {
    font-size: 13px;
    font-weight: 700;
    color: var(--ink);
}

.th-badge {
    font-size: 11px;
    font-weight: 800;
    color: var(--brand);
    background: rgba(213, 71, 50, .10);
    padding: 3px 10px;
    border-radius: 999px;
}

.section-row td {
    background: linear-gradient(90deg, rgba(213, 71, 50, .06), transparent);
    font-size: 13px;
    color: var(--brand);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .14em;
    padding: 10px 20px;
}

.param-cell {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--muted);
    font-size: 15px;
    font-weight: 500;
}

.param-cell i {
    color: var(--brand);
    width: 18px;
    text-align: center;
    font-size: 13px;
}

.pico {
    width: 28px;
    height: 28px;
    border-radius: 7px;
    background: var(--brand-soft);
    color: var(--brand);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    flex-shrink: 0;
}

.highlight-pill {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    background: rgba(213, 71, 50, .10);
    color: var(--brand);
    border-radius: 999px;
    padding: 5px 12px;
    font-size: 12px;
    font-weight: 700;
}

.check-i {
    color: var(--brand);
    font-size: 16px;
}

.plain {
    font-size: 14px;
    font-weight: 500;
}

tr:hover td {
    background: rgba(213, 71, 50, .015);
}

.verdict-row td {
    background: linear-gradient(180deg, #fff, #fff8f6);
    vertical-align: top;
    padding: 24px 20px;
}

.v-score {
    font-family: 'Playfair Display', serif;
    font-size: 40px;
    font-weight: 800;
    color: var(--brand);
    line-height: 1;
}

.v-score.top {
    color: var(--brand);
    font-size: 48px;
}

.v-of {
    font-size: 11px;
    color: var(--muted);
    margin: 4px 0 14px;
}

.v-btn {
    display: block;
    width: 100%;
    border: none;
    border-radius: 10px;
    padding: 9px 10px;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    margin-bottom: 8px;
    font-family: inherit;
    transition: .2s;
}

.v-btn.primary {
    background: var(--brand);
    color: #fff;
}

.v-btn.primary:hover {
    background: var(--brand2);
}

.v-btn.outline {
    background: #fff;
    color: var(--brand);
    border: 1.5px solid var(--brand);
}

.v-btn.outline:hover {
    background: rgba(213, 71, 50, .06);
}
 */
                                        /* ─── STATS BAND ─── */

                                        .stats-band {
                                            background: linear-gradient(135deg, var(--brand), var(--brand2));
                                            padding: 50px 0;
                                            margin: 0;
                                        }

                                        .stats-inner {
                                            max-width: 1300px;
                                            margin: auto;
                                            padding: 0 24px;
                                            display: grid;
                                            grid-template-columns: repeat(4, 1fr);
                                            gap: 30px;
                                            text-align: center;
                                        }

                                        .stat-item {
                                            color: #fff;
                                        }

                                        .stat-num {
                                            font-family: 'Playfair Display', serif;
                                            font-size: 48px;
                                            font-weight: 800;
                                            line-height: 1;
                                        }

                                        .stat-label {
                                            font-size: 14px;
                                            font-weight: 600;
                                            opacity: .88;
                                            margin-top: 6px;
                                        }

                                        .stat-divider {
                                            width: 1px;
                                            background: rgba(255, 255, 255, .2);
                                        }

                                        /* ─── FEATURES STRIP ─── */

                                        .features-strip {
                                            max-width: 1300px;
                                            margin: 50px auto;
                                            padding: 0 24px;
                                            display: grid;
                                            grid-template-columns: repeat(3, 1fr);
                                            gap: 20px;
                                        }

                                        .feature-box {
                                            background: #fff;
                                            border-radius: 20px;
                                            padding: 28px;
                                            border: 1px solid var(--line);
                                            box-shadow: var(--shadow-sm);
                                            transition: .25s;
                                            position: relative;
                                            overflow: hidden;
                                        }

                                        .feature-box::before {
                                            content: '';
                                            position: absolute;
                                            right: -30px;
                                            top: -30px;
                                            width: 100px;
                                            height: 100px;
                                            border-radius: 50%;
                                            background: rgba(213, 71, 50, .05);
                                        }

                                        .feature-box:hover {
                                            transform: translateY(-5px);
                                            box-shadow: var(--shadow-md);
                                            border-color: #f3c8c1;
                                        }

                                        .feature-icon {
                                            width: 50px;
                                            height: 50px;
                                            border-radius: 14px;
                                            background: rgba(213, 71, 50, .10);
                                            color: var(--brand);
                                            display: flex;
                                            align-items: center;
                                            justify-content: center;
                                            font-size: 20px;
                                            margin-bottom: 16px;
                                            /*  background: linear-gradient(9deg, rgba(155, 42, 76, 1) 0%, rgba(108, 87, 199, 1) 0%, rgba(108, 87, 199, 1) 32%, rgba(155, 42, 76, 1) 100%); -webkit-text-fill-color: transparent; -webkit-background-clip: text;  background-clip: text; */
                                        }

                                        .feature-box h5 {
                                            padding-top: 16px !important;
                                            font-size: 17px;
                                            font-weight: 700;
                                            margin-bottom: 8px;
                                            color: var(--ink);
                                        }

                                        .feature-box p {
                                            font-size: 13px;
                                            color: var(--muted);
                                            line-height: 1.6;
                                        }

                                        /* ─── CTA BLOCK ─── */

                                        .cta-block {
                                            background: linear-gradient(135deg, var(--brand), var(--brand2));
                                            border-radius: 28px;
                                            padding: 60px 50px;
                                            margin: 0 24px 60px;
                                            max-width: 1252px;
                                            margin-left: auto;
                                            margin-right: auto;
                                            text-align: center;
                                            position: relative;
                                            overflow: hidden;
                                        }

                                        .cta-block::before {
                                            content: '';
                                            position: absolute;
                                            width: 400px;
                                            height: 400px;
                                            border-radius: 50%;
                                            background: rgba(255, 255, 255, .05);
                                            right: -100px;
                                            top: -100px;
                                        }

                                        .cta-block::after {
                                            content: '';
                                            position: absolute;
                                            width: 300px;
                                            height: 300px;
                                            border-radius: 50%;
                                            background: rgba(255, 255, 255, .05);
                                            left: -80px;
                                            bottom: -80px;
                                        }

                                        .cta-block h2 {
                                            font-family: 'Playfair Display', serif;
                                            font-size: 38px;
                                            color: #fff;
                                            margin-bottom: 12px;
                                            position: relative;
                                            z-index: 1;
                                        }

                                        .cta-block p {
                                            color: rgba(255, 255, 255, .86);
                                            font-size: 15px;
                                            margin-bottom: 28px;
                                            position: relative;
                                            z-index: 1;
                                        }

                                        .cta-btns {
                                            display: flex;
                                            justify-content: center;
                                            gap: 14px;
                                            flex-wrap: wrap;
                                            position: relative;
                                            z-index: 1;
                                        }

                                        .cta-btns a {
                                            display: inline-flex;
                                            align-items: center;
                                            gap: 8px;
                                            padding: 14px 28px;
                                            border-radius: 14px;
                                            font-size: 14px;
                                            font-weight: 800;
                                            text-decoration: none;
                                            transition: .22s;
                                        }

                                        .cta-btns .w {
                                            background: #fff;
                                            color: var(--brand);
                                        }

                                        .cta-btns .w:hover {
                                            transform: translateY(-3px);
                                            box-shadow: 0 12px 24px rgba(0, 0, 0, .2);
                                        }

                                        .cta-btns .g {
                                            background: rgba(255, 255, 255, .15);
                                            color: #fff;
                                            backdrop-filter: blur(6px);
                                        }

                                        .cta-btns .g:hover {
                                            background: rgba(255, 255, 255, .25);
                                        }

                                        /* ─── FLOATING BAR ─── */

                                        .float-bar {
                                            position: fixed;
                                            bottom: 0;
                                            left: 0;
                                            right: 0;
                                            background: var(--brand);
                                            padding: 12px 24px;
                                            display: flex;
                                            justify-content: center;
                                            gap: 30px;
                                            z-index: 9999;
                                            box-shadow: 0 -4px 20px rgba(213, 71, 50, .30);
                                        }

                                        .float-bar a {
                                            color: #fff;
                                            text-decoration: none;
                                            font-weight: 700;
                                            font-size: 14px;
                                            display: flex;
                                            align-items: center;
                                            gap: 8px;
                                        }

                                        .float-divider {
                                            width: 1px;
                                            background: rgba(255, 255, 255, .3);
                                        }

                                        /* ─── ENQUIRE SIDEBAR ─── */

                                        .enquire-side {
                                            position: fixed;
                                            top: 50%;
                                            right: -91px;
                                            transform: translateY(-50%) rotate(-90deg);
                                            z-index: 999;
                                        }

                                        .enquire-side a {
                                            display: inline-flex;
                                            align-items: center;
                                            gap: 6px;
                                            background: var(--brand);
                                            color: #fff;
                                            padding: 8px 18px;
                                            font-size: 13px;
                                            font-weight: 700;
                                            border-radius: 10px 10px 0 0;
                                            text-decoration: none;
                                            box-shadow: 0 -4px 14px rgba(213, 71, 50, .30);
                                        }

                                        /* ─── ANIMATIONS ─── */

                                        @keyframes fadeUp {
                                            from {
                                                opacity: 0;
                                                transform: translateY(30px);
                                            }

                                            to {
                                                opacity: 1;
                                                transform: translateY(0);
                                            }
                                        }

                                        @keyframes pulse-ring {

                                            0%,
                                            100% {
                                                box-shadow: 0 0 0 0 rgba(213, 71, 50, .4);
                                            }

                                            50% {
                                                box-shadow: 0 0 0 10px rgba(213, 71, 50, 0);
                                            }
                                        }

                                        .anim {
                                            opacity: 0;
                                            animation: fadeUp .6s ease forwards;
                                        }

                                        .anim-1 {
                                            animation-delay: .1s;
                                        }

                                        .anim-2 {
                                            animation-delay: .2s;
                                        }

                                        .anim-3 {
                                            animation-delay: .3s;
                                        }

                                        .anim-4 {
                                            animation-delay: .4s;
                                        }

                                        /* ─── COUNTER ANIMATION ─── */

                                        .counter-num {
                                            display: inline-block;
                                        }

                                        /* ─── RESPONSIVE ─── */
                                        /* ai predictor */
                                        /* ── HERO ── */

                                        .ai-hero {
                                            /*   background: linear-gradient(135deg, #1a0a07 0%, var(--brand) 45%, var(--brand2) 100%); */
                                            /*   background: #9b2a4c; */
                                            /*  background: linear-gradient(9deg, rgba(155, 42, 76, 1) 0%, rgba(108, 87, 199, 1) 0%, rgba(108, 87, 199, 1) 32%, rgba(155, 42, 76, 1) 100%); */

                                            background: linear-gradient(9deg, rgba(155, 42, 76, 1) 0%, rgba(173, 154, 255, 1) 0%, rgba(30, 0, 157, 1) 32%, rgba(205, 18, 74, 1) 100%);
                                            padding: 64px 0 80px;
                                            position: relative;
                                            overflow: hidden;
                                        }

                                        .ai-hero::before {
                                            content: '';
                                            position: absolute;
                                            right: -140px;
                                            bottom: -140px;
                                            width: 500px;
                                            height: 500px;
                                            border-radius: 50%;
                                            background: rgba(255, 255, 255, .05);
                                            pointer-events: none;
                                        }

                                        .ai-hero::after {
                                            content: '';
                                            position: absolute;
                                            left: -80px;
                                            top: -80px;
                                            width: 300px;
                                            height: 300px;
                                            border-radius: 50%;
                                            background: rgba(0, 0, 0, .08);
                                            pointer-events: none;
                                        }

                                        .ai-hero-inner {
                                            max-width: 900px;
                                            margin: auto;
                                            padding: 0 28px;
                                            text-align: center;
                                            position: relative;
                                            z-index: 1;
                                        }

                                        .ai-hero-eyebrow {
                                            display: inline-flex;
                                            align-items: center;
                                            gap: 8px;
                                            background: rgba(255, 255, 255, .15);
                                            color: #fff;
                                            border-radius: 999px;
                                            padding: 6px 16px;
                                            font-size: 11.5px;
                                            font-weight: 800;
                                            text-transform: uppercase;
                                            letter-spacing: .8px;
                                            margin-bottom: 20px;
                                            backdrop-filter: blur(4px);
                                        }

                                        .ai-hero-h1 {
                                            font-family: 'Playfair Display', serif;
                                            font-size: 52px;
                                            line-height: .98;
                                            color: #fff;
                                            margin-bottom: 16px;
                                            letter-spacing: -.5px;
                                        }

                                        .ai-hero-h1 em {
                                            font-style: italic;
                                            opacity: .85;
                                        }

                                        .ai-hero-lead {
                                            font-size: 15.5px;
                                            color: rgba(255, 255, 255, .82);
                                            line-height: 1.7;
                                            max-width: 560px;
                                            margin: 0 auto 28px;
                                        }

                                        .ai-hero-pills {
                                            display: flex;
                                            justify-content: center;
                                            gap: 10px;
                                            flex-wrap: wrap;
                                        }

                                        .ai-hero-pill {
                                            display: inline-flex;
                                            align-items: center;
                                            gap: 7px;
                                            background: rgba(255, 255, 255, .13);
                                            color: #fff;
                                            border-radius: 999px;
                                            padding: 7px 16px;
                                            font-size: 12px;
                                            font-weight: 700;
                                            border: 1px solid rgba(255, 255, 255, .2);
                                            backdrop-filter: blur(4px);
                                        }

                                        /* ── PREDICTOR WRAPPER ── */

                                        .predictor-wrap {
                                            max-width: 1300px;
                                            margin: -48px auto 64px;
                                            padding: 0 24px;
                                            position: relative;
                                            z-index: 10;
                                        }

                                        /* ── PROGRESS HEADER ── */

                                        .prog-shell {
                                            background: var(--white);
                                            border-radius: var(--rL);
                                            box-shadow: var(--sh3);
                                            overflow: hidden;
                                        }

                                        .prog-header {
                                            padding: 26px 32px 0;
                                        }

                                        .prog-top-row {
                                            display: flex;
                                            align-items: center;
                                            justify-content: space-between;
                                            margin-bottom: 20px;
                                        }

                                        .prog-title {
                                            font-size: 13px;
                                            font-weight: 800;
                                            color: var(--muted);
                                            text-transform: uppercase;
                                            letter-spacing: .6px;
                                        }

                                        .prog-fraction {
                                            /*   font-family: 'Playfair Display', serif; */
                                            font-size: 28px;
                                            font-weight: 700;
                                            color: var(--brand);
                                        }

                                        .prog-fraction span {
                                            font-size: 15px;
                                            color: var(--muted);
                                            /* font-family: 'Saira Semi Condensed', sans-serif; */
                                            font-weight: 600;
                                        }

                                        /* Step dots */

                                        .step-dots {
                                            display: flex;
                                            align-items: center;
                                            gap: 0;
                                            margin-bottom: 18px;
                                        }

                                        .sdot {
                                            display: flex;
                                            flex-direction: column;
                                            align-items: center;
                                            gap: 4px;
                                            flex: 1;
                                            position: relative;
                                            cursor: default;
                                        }

                                        .sdot::before {
                                            content: '';
                                            position: absolute;
                                            top: 14px;
                                            left: calc(-50% + 14px);
                                            right: calc(50% + 14px);
                                            height: 2px;
                                            background: var(--line2);
                                            z-index: 0;
                                            transition: background .4s ease;
                                        }

                                        .sdot:first-child::before {
                                            display: none;
                                        }

                                        .sdot.done::before {
                                            background: var(--brand);
                                        }

                                        .sdot.active::before {
                                            background: var(--brand);
                                        }

                                        .sdot-circle {
                                            width: 28px;
                                            height: 28px;
                                            border-radius: 50%;
                                            border: 2px solid var(--line2);
                                            background: var(--bg);
                                            display: flex;
                                            align-items: center;
                                            justify-content: center;
                                            font-size: 11px;
                                            font-weight: 800;
                                            color: var(--muted);
                                            z-index: 1;
                                            position: relative;
                                            transition: all .35s cubic-bezier(.34, 1.56, .64, 1);
                                        }

                                        .sdot.done .sdot-circle {
                                            background: var(--brand);
                                            border-color: var(--brand);
                                            color: #fff;
                                            transform: scale(1.08);
                                        }

                                        .sdot.active .sdot-circle {
                                            background: var(--white);
                                            border-color: var(--brand);
                                            color: var(--brand);
                                            box-shadow: 0 0 0 4px rgba(213, 71, 50, .14);
                                            transform: scale(1.15);
                                        }

                                        /*  .sdot.active .sdot-circle {
                                        background: var(--white);
                                        color: var(--brand);
                                        box-shadow: 0 0 0 4px rgba(213, 71, 50, .14);
                                        transform: scale(1.15);
                                    
                                        border: 3px solid transparent; 
                                        border-radius: 50%;
                                        background-image: 
                                            linear-gradient(var(--white), var(--white)), 
                                            linear-gradient(9deg, rgba(155, 42, 76, 1) 0%, rgba(108, 87, 199, 1) 0%, rgba(108, 87, 199, 1) 32%, rgba(155, 42, 76, 1) 100%);
                                        background-origin: border-box;
                                        background-clip: padding-box, border-box;
                                    } */

                                        .sdot-lbl {
                                            font-size: 9.5px;
                                            font-weight: 700;
                                            color: var(--muted);
                                            text-transform: uppercase;
                                            letter-spacing: .3px;
                                            white-space: nowrap;
                                            transition: color .3s;
                                        }

                                        .sdot.active .sdot-lbl {
                                            color: var(--brand);
                                            /*  background: linear-gradient(9deg, rgba(155, 42, 76, 1) 0%, rgba(108, 87, 199, 1) 0%, rgba(108, 87, 199, 1) 32%, rgba(155, 42, 76, 1) 100%); -webkit-text-fill-color: transparent; -webkit-background-clip: text;  background-clip: text; */
                                        }

                                        .sdot.done .sdot-lbl {
                                            color: var(--brand);
                                        }

                                        /* Progress bar */

                                        .prog-bar-track {
                                            height: 5px;
                                            background: rgba(213, 71, 50, .12);
                                            border-radius: 0;
                                            overflow: hidden;
                                        }

                                        .prog-bar-fill {
                                            height: 100%;
                                            background: linear-gradient(90deg, var(--brand), var(--brand2));
                                            border-radius: 0;
                                            transition: width .5s cubic-bezier(.4, 0, .2, 1);
                                        }

                                        /* ── STEP CONTENT ── */

                                        .step-body {
                                            padding: 32px 32px 28px;
                                        }

                                        .step-item {
                                            display: none;
                                        }

                                        .step-item.active {
                                            display: block;
                                            animation: stepIn .4s cubic-bezier(.22, .68, 0, 1) forwards;
                                        }

                                        @keyframes stepIn {
                                            from {
                                                opacity: 0;
                                                transform: translateX(22px);
                                            }

                                            to {
                                                opacity: 1;
                                                transform: translateX(0);
                                            }
                                        }

                                        @keyframes stepBack {
                                            from {
                                                opacity: 0;
                                                transform: translateX(-22px);
                                            }

                                            to {
                                                opacity: 1;
                                                transform: translateX(0);
                                            }
                                        }

                                        .step-item.back-anim {
                                            animation: stepBack .4s cubic-bezier(.22, .68, 0, 1) forwards;
                                        }

                                        .step-eyebrow {
                                            font-size: 11px;
                                            font-weight: 800;
                                            /* color: var(--brand); */
                                            text-transform: uppercase;
                                            letter-spacing: .7px;
                                            margin-bottom: 8px;
                                            display: flex;
                                            align-items: center;
                                            gap: 6px;
                                            /*  background: linear-gradient(9deg, rgba(155, 42, 76, 1) 0%, rgba(108, 87, 199, 1) 0%, rgba(108, 87, 199, 1) 32%, rgba(155, 42, 76, 1) 100%); -webkit-text-fill-color: transparent; -webkit-background-clip: text;  background-clip: text; */
                                        }

                                        .step-h2 {
                                            font-size: 26px;
                                            font-weight: 700;
                                            color: var(--ink);
                                            margin-bottom: 6px;
                                            line-height: 1.2;
                                        }

                                        .step-sub {
                                            font-size: 14px;
                                            color: var(--muted);
                                            margin-bottom: 24px;
                                            line-height: 1.5;
                                        }

                                        /* ── OPTION CARDS ── */

                                        .opt-grid {
                                            display: grid;
                                            grid-template-columns: repeat(4, 1fr);
                                            gap: 14px;
                                            margin-bottom: 26px;
                                        }

                                        .opt-grid.cols-3 {
                                            grid-template-columns: repeat(3, 1fr);
                                        }

                                        .opt-grid.cols-5 {
                                            grid-template-columns: repeat(5, 1fr);
                                        }

                                        .opt-card {
                                            background: var(--bg);
                                            border: 1.5px solid var(--line2);
                                            border-radius: 16px;
                                            padding: 20px 14px;
                                            text-align: center;
                                            cursor: pointer;
                                            transition: all .25s cubic-bezier(.22, .68, 0, 1.2);
                                            position: relative;
                                            overflow: hidden;
                                        }

                                        .opt-card::before {
                                            content: '';
                                            position: absolute;
                                            inset: 0;
                                            border-radius: 14px;
                                            background: var(--soft);
                                            opacity: 0;
                                            transition: opacity .2s;
                                        }

                                        .opt-card:hover {
                                            border-color: var(--brand);
                                            transform: translateY(-4px);
                                            box-shadow: 0 10px 28px rgba(213, 71, 50, .14);
                                        }

                                        .opt-card:hover::before {
                                            opacity: 1;
                                        }

                                        .opt-card.selected {
                                            border-color: var(--brand);
                                            background: rgba(213, 71, 50, .06);
                                            box-shadow: 0 0 0 3px rgba(213, 71, 50, .15);
                                        }

                                        .opt-icon {
                                            width: 50px;
                                            height: 50px;
                                            border-radius: 14px;
                                            background: rgba(213, 71, 50, .10);
                                            color: var(--brand);
                                            display: flex;
                                            align-items: center;
                                            justify-content: center;
                                            font-size: 20px;
                                            margin: 0 auto 12px;
                                            transition: all .25s cubic-bezier(.22, .68, 0, 1.2);
                                        }

                                        .opt-card:hover .opt-icon,
                                        .opt-card.selected .opt-icon {
                                            background: var(--brand);
                                            color: #fff;
                                            transform: scale(1.1);
                                        }

                                        .opt-name {
                                            font-size: 18px;
                                            font-weight: 800;
                                            color: var(--ink);
                                            margin-bottom: 3px;
                                            line-height: 1.2;
                                        }

                                        .opt-sub {
                                            font-size: 16px;
                                            color: var(--muted);
                                            font-weight: 500;
                                            line-height: 1.3;
                                        }

                                        .opt-check {
                                            position: absolute;
                                            top: 9px;
                                            right: 9px;
                                            width: 20px;
                                            height: 20px;
                                            border-radius: 50%;
                                            background: var(--brand);
                                            color: #fff;
                                            font-size: 9px;
                                            display: flex;
                                            align-items: center;
                                            justify-content: center;
                                            opacity: 0;
                                            transform: scale(.5);
                                            transition: all .2s cubic-bezier(.34, 1.56, .64, 1);
                                        }

                                        .opt-card.selected .opt-check {
                                            opacity: 1;
                                            transform: scale(1);
                                        }

                                        /* ── STEP 1 SPECIAL (Intro) ── */

                                        .intro-box {
                                            display: flex;
                                            gap: 32px;
                                            align-items: center;
                                            background: linear-gradient(135deg, rgba(213, 71, 50, .05), rgba(213, 71, 50, .01));
                                            border: 1.5px solid rgba(213, 71, 50, .12);
                                            border-radius: var(--r);
                                            padding: 28px;
                                            margin-bottom: 26px;
                                        }

                                        .intro-illustration {
                                            flex-shrink: 0;
                                            width: 120px;
                                            height: 120px;
                                            border-radius: 20px;
                                            background: linear-gradient(135deg, var(--brand), var(--brand2));
                                            display: flex;
                                            align-items: center;
                                            justify-content: center;
                                            color: #fff;
                                            font-size: 52px;
                                            box-shadow: 0 12px 28px rgba(213, 71, 50, .30);
                                        }

                                        .intro-content h3 {
                                            /*     font-family: 'Playfair Display', serif; */
                                            font-size: 22px;
                                            font-weight: 700;
                                            color: var(--ink);
                                            margin-bottom: 8px;
                                        }

                                        .intro-content p {
                                            font-size: 14px;
                                            color: var(--sub);
                                            line-height: 1.65;
                                        }

                                        .intro-features {
                                            display: flex;
                                            gap: 14px;
                                            flex-wrap: wrap;
                                            margin-top: 16px;
                                        }

                                        .intro-feat {
                                            display: flex;
                                            align-items: center;
                                            gap: 7px;
                                            font-size: 12.5px;
                                            font-weight: 700;
                                            color: var(--brand);

                                            /* background: linear-gradient(9deg, rgba(155, 42, 76, 1) 0%, rgba(108, 87, 199, 1) 0%, rgba(108, 87, 199, 1) 32%, rgba(155, 42, 76, 1) 100%); -webkit-text-fill-color: transparent; -webkit-background-clip: text;  background-clip: text; */
                                        }

                                        .intro-feat i {
                                            font-size: 11px;
                                        }

                                        /* ── STEP FOOTER ── */

                                        .step-footer {
                                            display: flex;
                                            align-items: center;
                                            justify-content: space-between;
                                            padding: 0 0 4px;
                                            border-top: 1px solid var(--line2);
                                            padding-top: 20px;
                                            gap: 12px;
                                        }

                                        .btn-back {
                                            display: inline-flex;
                                            align-items: center;
                                            gap: 7px;
                                            border: 1.5px solid var(--line2);
                                            background: var(--brand);
                                            /*  background: linear-gradient(9deg, rgba(155, 42, 76, 1) 0%, rgba(108, 87, 199, 1) 0%, rgba(108, 87, 199, 1) 32%, rgba(155, 42, 76, 1) 100%); */
                                            color: var(--white);
                                            border-radius: 11px;
                                            padding: 10px;
                                            font-size: 13px;
                                            font-weight: 800;
                                            font-family: inherit;
                                            cursor: pointer;
                                            transition: .2s;
                                        }

                                        .btn-back:hover {
                                            border-color: var(--brand);
                                            color: var(--brand);
                                        }

                                        .btn-back:disabled {
                                            opacity: .35;
                                            cursor: default;
                                        }

                                        .btn-next {
                                            display: inline-flex;
                                            align-items: center;
                                            gap: 8px;
                                            background: var(--brand);
                                            /*  background: linear-gradient(9deg, rgba(155, 42, 76, 1) 0%, rgba(108, 87, 199, 1) 0%, rgba(108, 87, 199, 1) 32%, rgba(155, 42, 76, 1) 100%); */
                                            color: #fff;
                                            border: none;
                                            border-radius: 11px;
                                            padding: 10px;
                                            font-size: 13.5px;
                                            font-weight: 800;
                                            font-family: inherit;
                                            cursor: pointer;
                                            box-shadow: 0 6px 16px rgba(213, 71, 50, .28);
                                            transition: .22s;
                                        }

                                        .btn-next:hover {
                                            transform: translateY(-2px);
                                            box-shadow: 0 10px 24px rgba(213, 71, 50, .38);
                                        }

                                        .btn-next.start-btn {
                                            padding: 13px 32px;
                                            font-size: 14.5px;
                                        }

                                        .step-hint {
                                            font-size: 11.5px;
                                            color: var(--muted);
                                            text-align: center;
                                            flex: 1;
                                        }

                                        /* ── FLOAT BAR ── */

                                        .floatbar {
                                            position: fixed;
                                            bottom: 0;
                                            left: 0;
                                            right: 0;
                                            background: var(--brand);
                                            padding: 11px 24px;
                                            display: flex;
                                            justify-content: center;
                                            gap: 28px;
                                            z-index: 999;
                                            box-shadow: 0 -4px 18px rgba(213, 71, 50, .30);
                                        }

                                        .floatbar a {
                                            color: #fff;
                                            text-decoration: none;
                                            font-weight: 700;
                                            font-size: 13.5px;
                                            display: flex;
                                            align-items: center;
                                            gap: 7px;
                                        }

                                        .fdiv {
                                            width: 1px;
                                            background: rgba(255, 255, 255, .25);
                                        }

                                        /* ── ENQUIRE PILL ── */

                                        .enq-pill {
                                            position: fixed;
                                            top: 50%;
                                            right: -88px;
                                            transform: translateY(-50%) rotate(-90deg);
                                            z-index: 800;
                                        }

                                        .enq-pill a {
                                            display: inline-flex;
                                            align-items: center;
                                            gap: 6px;
                                            background: var(--brand);
                                            color: #fff;
                                            padding: 8px 16px;
                                            font-size: 12px;
                                            font-weight: 800;
                                            border-radius: 10px 10px 0 0;
                                            text-decoration: none;
                                            box-shadow: 0 -3px 12px rgba(213, 71, 50, .28);
                                        }

                                        /* ai predictor */
                                        /* ── STICKY HEADER (JS controlled) ── */

                                        .comp-grid.is-sticky-header {
                                            padding-top: var(--sticky-header-height, 90px);
                                        }

                                        .sticky-clone {
                                            position: fixed;
                                            top: 0;
                                            left: 0;
                                            right: 0;
                                            z-index: 999;
                                            display: none;
                                            max-width: 1300px;
                                            padding: 0 24px;
                                            margin: 0 auto;
                                        }

                                        .sticky-clone.show {
                                            display: block;
                                        }

                                        .sticky-clone .comp-grid {
                                            /* min-width: 720px; */
                                            background: #fafafa;
                                            box-shadow: 0 4px 12px rgba(0, 0, 0, .08);
                                        }

                                        .c-cta {
                                            padding: 0 24px;
                                            max-width: 1300px;
                                            margin: 0 auto;
                                        }

                                        @media(max-width:1024px) {
                                            .hero-sub {
                                                margin-bottom: 18px;
                                            }

                                            .hero-metrics {
                                                margin-bottom: 18px;
                                            }

                                            .selector-card {
                                                padding: 18px;
                                                margin-top: 6px;
                                            }

                                            .compare-btn {
                                                height: 45px;
                                            }
                                        }

                                        @media(max-width:992px) {

                                            .comparison-v-hero {
                                                height: 550px;
                                            }

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

                                            .stats-inner {
                                                grid-template-columns: repeat(2, 1fr);
                                            }

                                            .features-strip {
                                                grid-template-columns: 1fr 1fr;
                                            }

                                            .prog-cards {
                                                grid-template-columns: 1fr 1fr;
                                            }

                                            .footer-inner {
                                                grid-template-columns: 1fr 1fr;
                                            }

                                            .nav-links {
                                                display: none;
                                            }

                                            .intro-box {
                                                gap: 25px;
                                                padding: 16px;
                                            }

                                            .intro-illustration {
                                                width: 90px;
                                                height: 90px;
                                                font-size: 38px;
                                            }

                                            .prog-header {
                                                padding: 18px 15px 0;
                                            }

                                            .step-body {
                                                padding: 32px 15px 28px;
                                            }

                                            .feature-box {
                                                padding: 20px 15px;
                                                margin-bottom: 20px;
                                            }

                                            .features-strip {
                                                gap: 6px;
                                            }

                                            .th-img {
                                                width: 192px;
                                                height: 128px;
                                            }
                                        }

                                        @media(max-width:768px) {
                                            .compare-btn {
                                                max-width: 320px;
                                                margin-top: 10px;

                                            }

                                            .sel-slot select {
                                                padding: 9px 36px 9px 14px;
                                            }

                                            .sel-row {
                                                gap: 8px;
                                            }

                                            .vs-badge {
                                                width: 38px;
                                                height: 38px;
                                            }

                                            .grid-scroll {
                                                display: none;
                                            }

                                            .mob-wrap {
                                                display: block;
                                            }



                                            /* accordion content */
                                            .mob-vals-row {
                                                display: grid;
                                                grid-template-columns: repeat(3, 1fr);
                                                gap: 6px;
                                                padding: 10px 14px 14px;
                                                background: rgba(213, 71, 50, .02);
                                                border-top: 1px solid rgba(213, 71, 50, .08);
                                            }

                                            .mob-val-card {
                                                background: #fff;
                                                border-radius: 10px;
                                                border: 1px solid var(--line);
                                                padding: 10px 6px;
                                                display: flex;
                                                flex-direction: column;
                                                align-items: center;
                                                gap: 5px;
                                                text-align: center;
                                            }

                                            .mvc-name {
                                                font-size: 14px;
                                                font-weight: 700;
                                                color: var(--muted);
                                                text-transform: uppercase;
                                            }

                                            .mvc-val {
                                                font-size: 14px;
                                                font-weight: 600;
                                                color: var(--ink);
                                                line-height: 1.3;
                                            }

                                            .mob-val-card .highlight-pill {
                                                font-size: 9px;
                                                padding: 3px 7px;
                                            }

                                            .mob-val-card .check-i {
                                                font-size: 15px;
                                            }

                                            /* verdict */
                                            .mob-verdict-wrap {
                                                padding: 16px 12px 20px;
                                                background: linear-gradient(180deg, #fff, #fff8f6);
                                            }

                                            .mob-verdict-title {
                                                display: flex;
                                                align-items: center;
                                                gap: 8px;
                                                font-size: 13px;
                                                font-weight: 700;
                                                margin-bottom: 12px;
                                            }

                                            .mob-verdict-title i {
                                                color: var(--brand);
                                            }

                                            .mob-verdict-grid {
                                                display: grid;
                                                grid-template-columns: repeat(3, 1fr);
                                                gap: 8px;
                                            }

                                            .mob-verdict-card {
                                                background: #fff8f6;
                                                border-radius: 14px;
                                                padding: 12px 8px;
                                                text-align: center;
                                                border: 1px solid rgba(213, 71, 50, .15);
                                            }

                                            .mob-verdict-card.featured {
                                                border: 2px solid var(--brand);
                                            }

                                            .mob-verdict-card .vc-name {
                                                font-size: 10px;
                                                font-weight: 700;
                                                margin-bottom: 6px;
                                            }

                                            .mob-verdict-card .v-score {
                                                font-size: 30px;
                                            }

                                            .mob-verdict-card .v-score.top {
                                                font-size: 36px;
                                            }

                                            .mob-verdict-card .v-of {
                                                font-size: 10px;
                                                margin: 3px 0 10px;
                                            }

                                            .mob-verdict-card .v-btn {
                                                font-size: 10px;
                                                padding: 7px 4px;
                                                border-radius: 8px;
                                                margin-bottom: 6px;
                                            }

                                            .sticky-clone {
                                                display: none !important;
                                            }

                                            /* ── STICKY COLLEGE HEADER ── */
                                            .mob-college-header {
                                                display: grid;
                                                grid-template-columns: repeat(3, 1fr);
                                                gap: 6px;
                                                padding: 10px 12px;
                                                background: #fafafa;
                                                border-bottom: 1px solid var(--line);
                                                /*     position: sticky;
                                                        top: 0;
                                                        z-index: 30; */
                                            }

                                            /* ── MOBILE STICKY CLONE (JS controlled) ── */
                                            .mob-sticky-clone {
                                                position: fixed;
                                                top: 0;
                                                left: 24px;
                                                right: 24px;
                                                z-index: 999;
                                                display: none;
                                                background: #fafafa;
                                                border-bottom: 1px solid var(--line);
                                            }

                                            .mob-sticky-clone.show {
                                                /*  display: block; */
                                                display: grid;
                                                grid-template-columns: repeat(3, 1fr);
                                                gap: 6px;
                                                padding: 10px 12px;
                                                background: #fafafa;
                                                border-bottom: 1px solid var(--line);
                                            }

                                            .mob-col-card {
                                                display: flex;
                                                flex-direction: column;
                                                align-items: center;
                                                gap: 3px;
                                            }

                                            .mob-col-card img {
                                                width: 100%;
                                                max-width: 125px;
                                                height: 84px;
                                                object-fit: cover;
                                                border-radius: 7px;
                                            }

                                            .mob-col-card .cn {
                                                font-size: 10px;
                                                font-weight: 700;
                                                color: var(--ink);
                                                text-align: center;
                                                line-height: 1.2;
                                            }

                                            .mob-col-card .cb {
                                                font-size: 8px;
                                                font-weight: 800;
                                                color: var(--brand);
                                                background: rgba(213, 71, 50, .10);
                                                padding: 2px 6px;
                                                border-radius: 999px;
                                            }

                                            .mob-col-card .cb.gray {
                                                background: rgba(100, 112, 133, .10);
                                                color: var(--muted);
                                            }

                                            /* ── RADIO TABS — inputs inside mob-wrap ── */
                                            .tab-radio {
                                                display: none;
                                            }

                                            .mob-tabs-wrap {
                                                overflow-x: auto;
                                                background: #fff;
                                                border-bottom: 2px solid var(--line);
                                                /* position: sticky; */
                                                left: 24px;
                                                right: 24px;
                                                /* top: 74px; */
                                                z-index: 20;
                                                scrollbar-width: none;
                                            }

                                            .mob-tabs-wrap::-webkit-scrollbar {
                                                display: none;
                                            }

                                            .mob-tabs {
                                                display: flex;
                                                padding: 0 10px;
                                                white-space: nowrap;
                                            }

                                            .mob-tab-lbl {
                                                flex-shrink: 0;
                                                padding: 11px 14px;
                                                font-size: 15px;
                                                font-weight: 600;
                                                color: var(--muted);
                                                border-bottom: 3px solid transparent;
                                                cursor: pointer;
                                                transition: .2s;
                                                margin-bottom: -2px;
                                                display: inline-block;
                                            }

                                            /* active tab */
                                            /*  #t1:checked~.mob-tabs-wrap .mob-tabs [for="t1"],
                                                #t2:checked~.mob-tabs-wrap .mob-tabs [for="t2"],
                                                #t3:checked~.mob-tabs-wrap .mob-tabs [for="t3"],
                                                #t4:checked~.mob-tabs-wrap .mob-tabs [for="t4"],
                                                #t5:checked~.mob-tabs-wrap .mob-tabs [for="t5"] {
                                                    color: var(--brand);
                                                    border-bottom-color: var(--brand);
                                                } */
                                            /* panels — hidden by default */
                                            /*  .mob-panel {
                                                    display: none;
                                                }
                                                #t1:checked~.mob-panels #p1,
                                                #t2:checked~.mob-panels #p2,
                                                #t3:checked~.mob-panels #p3,
                                                #t4:checked~.mob-panels #p4,
                                                #t5:checked~.mob-panels #p5 {
                                                    display: block;
                                                } */
                                            .mob-tab-lbl {
                                                text-decoration: none;
                                            }

                                            .mob-tab-lbl.active {
                                                color: var(--brand) !important;
                                                border-bottom-color: var(--brand) !important;
                                            }

                                            .mob-tab-lbl:hover {
                                                color: var(--muted);
                                            }

                                            .mob-panel {
                                                display: block;
                                                scroll-margin-top: 130px;
                                                /* sticky tabs/header ke hisab se adjust kar lena */
                                            }

                                            /* ── DETAILS/SUMMARY ACCORDION ── */
                                            details.mob-acc {
                                                border-bottom: 1px solid var(--line);
                                            }

                                            details.mob-acc summary {
                                                list-style: none;
                                                padding: 12px 14px;
                                                display: flex;
                                                align-items: center;
                                                justify-content: space-between;
                                                gap: 8px;
                                                cursor: pointer;
                                            }

                                            details.mob-acc summary::-webkit-details-marker {
                                                display: none;
                                            }

                                            .sum-left {
                                                display: flex;
                                                align-items: center;
                                                gap: 8px;
                                            }

                                            .sum-left .pico {
                                                width: 24px;
                                                height: 24px;
                                                border-radius: 6px;
                                                font-size: 9px;
                                            }

                                            .sum-text {
                                                font-size: 15px;
                                                font-weight: 500;
                                                color: var(--ink);
                                            }

                                            .sum-chevron {
                                                font-size: 11px;
                                                color: var(--brand);
                                                transition: transform .25s;
                                            }

                                            details.mob-acc[open] summary .sum-chevron {
                                                transform: rotate(180deg);
                                            }

                                            details.mob-acc summary:hover {
                                                background: rgba(213, 71, 50, .02);
                                            }



                                        }

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

                                            .sel-row {
                                                flex-direction: column;
                                            }

                                            .sel-slot {
                                                min-width: 100%;
                                            }

                                            .stats-inner {
                                                grid-template-columns: 1fr 1fr;
                                                gap: 20px;
                                            }

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

                                            .features-strip {
                                                grid-template-columns: 1fr;
                                            }

                                            .prog-cards {
                                                grid-template-columns: 1fr;
                                            }

                                            .footer-inner {
                                                grid-template-columns: 1fr;
                                            }

                                            .cta-block {
                                                padding: 36px 24px;
                                            }

                                            .cta-block h2 {
                                                font-size: 28px;
                                            }

                                            .opt-grid {
                                                display: grid;
                                                grid-template-columns: repeat(2, 1fr);
                                            }

                                            .opt-grid.cols-3 {
                                                grid-template-columns: repeat(2, 1fr);
                                            }

                                            .opt-grid.cols-5 {
                                                grid-template-columns: repeat(2, 1fr);
                                            }




                                        }

                                        @media (max-width: 575px) {
                                            body {
                                                padding: 12px 0 40px;
                                            }

                                            .matrix-section {
                                                padding: 0 10px;
                                            }

                                            .matrix-header {
                                                padding: 16px 14px 12px;
                                            }

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

                                            .matrix-header p {
                                                font-size: 12px;
                                            }

                                            .mob-tabs-wrap {

                                                left: 10px;
                                                right: 10px;

                                            }

                                            .mob-sticky-clone {

                                                left: 10px;
                                                right: 10px;

                                            }


                                            .selector-card {
                                                padding: 18px;
                                            }

                                            .vs-badge {
                                                width: 32px;
                                                height: 32px;
                                            }

                                            .sel-slot select {
                                                padding: 8px 36px 8px 12px;
                                            }

                                            .sel-row {
                                                display: flex;
                                                gap: 12px;
                                                align-items: flex-end;
                                                flex-wrap: initial;
                                            }

                                            .compare-btn {
                                                height: 36px;
                                            }

                                            .compare-btn {
                                                max-width: 100%;
                                            }

                                            .comparison-v-hero {
                                                position: relative;
                                                height: 387px
                                            }
                                        }


                                        @media(max-width:480px) {
                                            .intro-box {
                                                flex-direction: column;
                                                align-items: flex-start;
                                            }

                                            .intro-illustration {
                                                width: 70px;
                                                height: 71px;
                                                font-size: 29px;
                                            }
                                        }

                                        @media(max-width:380px) {
                                            .mob-col-card img {
                                                max-width: 90px;
                                                height: 60px;
                                            }
                                        }

                                        @media(max-width:450px) {

                                            .mob-col-card img {
                                                max-width: 106px;
                                                height: 70px;
                                            }
                                        }


                                        .com-degree .mvc-val img {
                                            /* max-width: 60px; */
                                            width: 100%;
                                        }

                                        .com-degree-acr .mvc-val img {
                                            max-width: 30px;
                                        }

                                        .c-degree-img img {
                                            max-width: 120px;
                                            width: 100%;
                                        }

                                        .cdegree-acr img {
                                            max-width: 40px;
                                            width: 100%;
                                        }





                                        /* ==============================================================New CSS============================================================== */


                                        .rec-section {
                                            padding: 28px 24px 34px;
                                        }

                                        .rec-cards {
                                            display: grid;
                                            grid-template-columns: repeat(3, 1fr);
                                            gap: 16px;
                                        }

                                        .rec-card {
                                            display: flex;
                                            flex-direction: column;
                                            height: 100%;
                                            border: 1px solid var(--line);
                                            border-radius: 14px;
                                            padding: 20px;
                                            background: #fff;
                                        }

                                        .rec-top {
                                            display: flex;
                                            align-items: center;
                                            gap: 10px;
                                            margin-bottom: 10px;
                                        }

                                        .rec-avatar {
                                            width: 36px;
                                            height: 36px;
                                            border-radius: 50%;
                                            color: #fff;
                                            font-weight: 700;
                                            font-size: 13px;
                                            display: flex;
                                            align-items: center;
                                            justify-content: center;
                                            flex-shrink: 0;
                                        }

                                        .rec-name {
                                            font-weight: 700;
                                            font-size: 15px;
                                            color: #111;
                                        }

                                        .rec-tag {
                                            display: flex;
                                            align-items: center;
                                            gap: 5px;
                                            font-size: 16px;
                                            font-weight: 600;
                                            color: #B45309;
                                            margin-bottom: 8px;
                                        }

                                        .rec-desc {
                                            font-size: 13px;
                                            color: var(--muted);
                                            line-height: 1.55;
                                            margin: 0 0 16px;
                                            flex-grow: 1;
                                        }

                                        .rec-btn {
                                            margin-top: auto;
                                            align-self: flex-start;
                                            background: linear-gradient(135deg, var(--brand), var(--brand2));
                                            color: #fff;
                                            font-size: 12px;
                                            font-weight: 700;
                                            padding: 7px 14px;
                                            border-radius: 20px;
                                            display: inline-flex;
                                            align-items: center;
                                            gap: 6px;
                                        }

                                        .rec-btn i {
                                            font-size: 12px;
                                        }

                                        @media (max-width:768px) {
                                            .rec-cards {
                                                grid-template-columns: 1fr;
                                            }
                                        }



/* 
                                        .sel-slot {
                                            position: relative;
                                        }

                                        .search-box {
                                            width: 100%;
                                            padding: 10px 12px;
                                            border: 1px solid #ddd;
                                            border-radius: 8px;
                                            margin-bottom: 8px;
                                            outline: none;
                                            font-size: 14px;
                                        } */

                                        /* ==============================================================New CSS============================================================== */

                                        /* ===========================
   Searchable Dropdown
   =========================== */

.sdx-box{
    position:relative;
    width:100%;
    font-family:inherit;
}

.sdx-input{
    width:100%;
    height:48px;
    border:1.5px solid #d1d1d1;
    border-radius:12px;
    padding:0 42px 0 14px;
    font-size:13px;
    outline:none;
    /* background:#fff; */
    background: rgba(255, 255, 255, .13) !important;
    transition:.25s;
    box-sizing:border-box;
}

.sdx-input:focus{
    border-color:var(--brand);
    box-shadow:0 0 0 4px rgba(213,71,50,.12);
}

.sdx-input::placeholder{
    color:#525253;
}

.sdx-arrow{
    position:absolute;
    top:50%;
    right:14px;
    transform:translateY(-50%);
    pointer-events:none;
    color:#98a2b3;
    transition:.25s;
}

.sdx-box.active .sdx-arrow{
    transform:translateY(-50%) rotate(180deg);
}

/* ===========================
   Dropdown
   =========================== */

.sdx-list{

    position:absolute;
    top:calc(100% + 8px);
    left:0;

    width:100%;
    background:#fff;

    border:1px solid #ececec;
    border-radius:12px;

    box-shadow:0 15px 35px rgba(0,0,0,.12);

    overflow:hidden;

    max-height:260px;

    overflow-y:auto;

    display:none;

    z-index:9999;

}

.sdx-box.active .sdx-list{
    display:block;
}

/* ===========================
   Item
   =========================== */

.sdx-item{

    padding:13px 15px;

    font-size:13px;

    cursor:pointer;

    transition:.18s;

    border-bottom:1px solid #f3f3f3;

    background:#fff;

}

.sdx-item:last-child{
    border-bottom:none;
}

.sdx-item:hover{

    background:rgba(213,71,50,.08);

    color:var(--brand);

}

/* active */

.sdx-item.sdx-selected{

    background:rgba(213,71,50,.12);

    color:var(--brand);

    font-weight:600;

}

/* ===========================
   Scrollbar
   =========================== */

.sdx-list::-webkit-scrollbar{

    width:8px;

}

.sdx-list::-webkit-scrollbar-track{

    background:#f5f5f5;

}

.sdx-list::-webkit-scrollbar-thumb{

    background:#d0d0d0;

    border-radius:10px;

}

.sdx-list::-webkit-scrollbar-thumb:hover{

    background:#bdbdbd;

}

/* ===========================
   No Result
   =========================== */

.sdx-empty{

    padding:14px;

    text-align:center;

    color:#999;

    font-size:13px;

}

/* ===========================
   Responsive
   =========================== */

.m-select-comparison{
    display: none;
}



@media(max-width:768px){

    .sdx-input{

        height:46px;

        font-size:14px;

    }

}
@media(max-width:600px){

    .d-select-comparison{
        display: none;
    }
    .m-select-comparison{
        display: block;
    }
    .com-page-main-content{
        height: auto;
    }
     .hero-inner{
        padding: 50px 10px;
    }

}
@media(max-width:450px){

    .comparison-v-hero {
        position: relative;
        height: 412px;
    }

}



    /*==============================
   Consultation Section
===============================*/

.edu-consultation-section{
    background: linear-gradient(135deg, var(--brand), var(--brand2));
    padding:90px;
    overflow:hidden;
    width:100%;
}

.edu-consultation-container{
    margin:auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:70px;
}

.edu-consultation-left{
    flex:1;
    color:#fff;
}

.edu-consultation-badge{
    display:inline-flex;
    align-items:center;
    gap:10px;
    padding:6px 22px;
    border-radius:50px;
    background:rgba(255,255,255,.12);
    border:1px solid rgba(255,255,255,.18);
    backdrop-filter:blur(10px);
    font-size:15px;
    font-weight:600;
    margin-bottom:25px;
}

.edu-consultation-badge i{
    color:#ffd24a;
}

.edu-consultation-heading{
    font-size:38px;
    font-weight:800;
    color:#fff;
    margin-bottom:25px;
}

.edu-consultation-highlight{
    
    color:#ffc107;
}

.edu-consultation-description {
    max-width: 640px;
    font-size: 18px;
    /* line-height: 1.8; */
    color: rgba(255,255,255,.95);
    margin-bottom: 36px;
}

/*==============================
 Feature List
===============================*/

.edu-consultation-feature-list{
    list-style:none;
    padding:0;
    margin:0 0 45px;
}

.edu-consultation-feature-item{
    display:flex;
    align-items:center;
    gap:16px;
    margin-bottom:13px;
    font-size:18px;
    color:#fff;
}


.edu-consultation-feature-icon{
    width:29px;
    height:29px;
    min-width:29px;
    border-radius:50%;
    border:2px solid #ffd44f;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#ffd44f;
    font-size:13px;
}

.edu-consultation-feature-icon i{
    color:#ffd44f;
    margin: 0;
}

/*==============================
 Contact
===============================*/

.edu-consultation-contact{
    display:flex;
    flex-wrap:wrap;
    gap:30px;
}

.edu-consultation-contact-item{
    display:flex;
    align-items:center;
    gap:10px;
    color:#fff;
    font-size:16px;
}

.edu-consultation-contact-item i{
    color:#ffd44f;
}

/*==============================
 Form Card
===============================*/

.edu-consultation-form-card{
    width:540px;
    background:#fff;
    border-radius:28px;
    padding:42px;
    box-shadow:0 35px 80px rgba(0,0,0,.18);
}

.edu-consultation-form-title{
    font-size:28px;
    font-weight:700;
    color:#1f2937;
    margin-bottom:12px;
}

.edu-consultation-form-subtitle{
    font-size:15px;
    color:#888;
    margin-bottom:30px;
}

.edu-consultation-form-group{
    margin-bottom:22px;
}

.edu-consultation-form-label{
    display:block;
    margin-bottom:6px;
    font-weight:600;
    color:#344054;
}

.edu-consultation-form-input{
    width:100%;
    border-radius:12px;
    border:1px solid #e5e7eb;
    padding: 7px 14px ;
    font-size:16px;
    outline:none;
    transition:.3s;
    background:#fff;
}

.edu-consultation-form-input:focus{
    border-color:#ff6c20;
    box-shadow:0 0 0 4px rgba(255,108,32,.15);
}

/*==============================
 Phone Input
===============================*/

.edu-consultation-phone-group{
    display:flex;
}

.edu-consultation-country-code{
    width:80px;
    display:flex;
    justify-content:center;
    align-items:center;
    border:1px solid #e5e7eb;
    border-right:none;
    border-radius:16px 0 0 16px;
    background:#fafafa;
    font-weight:600;
}

.edu-consultation-phone-input{
    flex:1;
    padding: 7px 14px ;
    border:1px solid #e5e7eb;
    border-radius:0 12px 12px 0;
    font-size:16px;
    outline:none;
}

.edu-consultation-phone-input:focus{
    border-color:#ff6c20;
}

/*==============================
 Select
===============================*/

.edu-consultation-select{
    appearance:none;
    cursor:pointer;
    background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%23666' stroke-width='2' viewBox='0 0 24 24'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") no-repeat right 18px center;
}

/*==============================
 Button
===============================*/

.edu-consultation-submit-btn{
    width:100%;
    padding: 7px 14px ;
    border:none;
    border-radius:12px;
    background: linear-gradient(135deg, var(--brand), var(--brand2));
    color:#fff;
    font-size:18px;
    font-weight:700;
    cursor:pointer;
    transition:.35s;
    display:flex;
    justify-content:center;
    align-items:center;
    gap:12px;
}

.edu-consultation-submit-btn:hover{
    transform:translateY(-2px);
    box-shadow:0 15px 35px rgba(255,108,32,.30);
}

/*==============================
 Terms
===============================*/

.edu-consultation-terms{
    text-align:center;
    margin-top:18px;
    font-size:13px;
    color:#888;
    margin-bottom: 0;
}

.edu-consultation-terms a{
    color:#d42a1d;
    text-decoration:none;
    font-weight:600;
}

/*==============================
 Responsive
===============================*/

@media(max-width:1100px){

    .edu-consultation-container{
        flex-direction:column;
    }

    .edu-consultation-form-card{
        width:100%;
        max-width:650px;
    }

    .edu-consultation-heading{
        font-size:46px;
    }

}

@media(max-width:768px){

    .edu-consultation-section{
        padding:60px 20px;
    }

    .edu-consultation-heading{
        font-size:36px;
    }

    .edu-consultation-description{
        font-size:17px;
        line-height:1.7;
    }

    .edu-consultation-form-card{
        padding:30px 22px;
        border-radius:22px;
    }

    .edu-consultation-form-title{
        font-size:30px;
    }

    .edu-consultation-contact{
        flex-direction:column;
        gap:15px;
    }

}