/* =========================================================
   SARKARI KAAM
   GOVERNMENT SCHEMES
   PREMIUM GOVERNMENT PORTAL UI
   FINAL VERSION 2.0
========================================================= */


/* =========================================================
   01. VARIABLES
========================================================= */

:root {

    --sk-primary: #0b3d91;
    --sk-primary-dark: #082d6b;
    --sk-primary-light: #edf4ff;

    --sk-orange: #ff9933;
    --sk-green: #138808;

    --sk-bg: #f4f7fb;
    --sk-white: #ffffff;

    --sk-text: #172033;
    --sk-text-soft: #475467;
    --sk-muted: #667085;

    --sk-border: #e4e8ef;

    --sk-success-bg: #edf8f0;
    --sk-success: #137333;

    --sk-warning-bg: #fff6ea;
    --sk-warning: #a65300;

    --sk-danger-bg: #fff0f0;
    --sk-danger: #b42318;

    --sk-shadow-sm:
        0 4px 16px rgba(16, 24, 40, 0.06);

    --sk-shadow:
        0 10px 30px rgba(16, 24, 40, 0.08);

    --sk-shadow-lg:
        0 20px 50px rgba(16, 24, 40, 0.12);

    --sk-radius: 18px;
    --sk-radius-md: 14px;
    --sk-radius-sm: 10px;

    --sk-container: 1240px;

    --sk-transition:
        0.25s ease;

}


/* =========================================================
   02. RESET / BASE
========================================================= */

.schemes-hero *,
.scheme-categories *,
.scheme-filter-section *,
.schemes-section *,
.eligibility-banner *,
.portal-disclaimer * {
    box-sizing: border-box;
}

button,
input,
select {
    font: inherit;
}

button {
    cursor: pointer;
}

a {
    -webkit-tap-highlight-color: transparent;
}

.container {
    width: min(
        calc(100% - 40px),
        var(--sk-container)
    );

    margin-inline: auto;
}


/* =========================================================
   03. ACCESSIBILITY
========================================================= */

.sr-only {
    position: absolute;

    width: 1px;
    height: 1px;

    padding: 0;
    margin: -1px;

    overflow: hidden;

    clip: rect(0, 0, 0, 0);

    white-space: nowrap;

    border: 0;
}


/* =========================================================
   04. HEADER
========================================================= */

.site-header {
    position: sticky;

    top: 0;

    z-index: 1000;

    background:
        rgba(255, 255, 255, 0.96);

    border-bottom:
        1px solid var(--sk-border);

    backdrop-filter: blur(16px);
}

.header-inner {
    min-height: 76px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 20px;
}

.brand {
    display: flex;

    align-items: center;

    gap: 11px;

    color: var(--sk-text);

    text-decoration: none;
}

.brand-icon {
    width: 44px;
    height: 44px;

    display: grid;

    place-items: center;

    border:
        1px solid var(--sk-border);

    border-radius: 13px;

    background:
        linear-gradient(
            135deg,
            #fff7ed,
            #edf4ff
        );

    font-size: 22px;
}

.brand strong {
    display: block;

    color: var(--sk-primary);

    font-size: 18px;

    line-height: 1.2;
}

.brand small {
    display: block;

    margin-top: 3px;

    color: var(--sk-muted);

    font-size: 10px;
}

.main-nav {
    display: flex;

    align-items: center;

    gap: 3px;
}

.main-nav a {
    position: relative;

    padding: 10px 13px;

    border-radius: 9px;

    color: #475467;

    font-size: 13px;

    font-weight: 700;

    text-decoration: none;

    transition:
        var(--sk-transition);
}

.main-nav a:hover {
    color: var(--sk-primary);

    background:
        var(--sk-primary-light);
}

.main-nav a.active {
    color: var(--sk-primary);

    background:
        var(--sk-primary-light);
}

.main-nav a.active::after {
    content: "";

    position: absolute;

    left: 14px;
    right: 14px;

    bottom: 3px;

    height: 2px;

    border-radius: 99px;

    background:
        var(--sk-orange);
}

.mobile-menu-btn {
    display: none;

    width: 42px;
    height: 42px;

    border:
        1px solid var(--sk-border);

    border-radius: 10px;

    background: #fff;

    color: var(--sk-primary);

    font-size: 20px;
}


/* =========================================================
   05. HERO
========================================================= */

.schemes-hero {
    position: relative;

    overflow: hidden;

    padding: 78px 0 82px;

    color: #fff;

    background:
        linear-gradient(
            135deg,
            #071f4c 0%,
            #0b3d91 48%,
            #165dbb 100%
        );
}

.schemes-hero::before {
    content: "";

    position: absolute;

    width: 480px;
    height: 480px;

    top: -260px;
    right: -120px;

    border-radius: 50%;

    background:
        rgba(255, 153, 51, 0.14);
}

.schemes-hero::after {
    content: "";

    position: absolute;

    width: 360px;
    height: 360px;

    left: -200px;
    bottom: -250px;

    border-radius: 50%;

    background:
        rgba(255, 255, 255, 0.06);
}

.hero-content {
    position: relative;

    z-index: 2;

    max-width: 860px;

    margin-inline: auto;

    text-align: center;
}

.hero-badge {
    display: inline-flex;

    align-items: center;

    gap: 8px;

    padding: 8px 15px;

    margin-bottom: 17px;

    border:
        1px solid
        rgba(255, 255, 255, 0.2);

    border-radius: 999px;

    background:
        rgba(255, 255, 255, 0.09);

    color: #fff;

    font-size: 12px;

    font-weight: 800;

    backdrop-filter: blur(10px);
}

.schemes-hero h1 {
    margin: 0;

    color: #fff;

    font-size:
        clamp(36px, 5vw, 60px);

    line-height: 1.08;

    font-weight: 850;

    letter-spacing: -1.6px;
}

.schemes-hero p {
    max-width: 720px;

    margin: 20px auto 30px;

    color:
        rgba(255, 255, 255, 0.80);

    font-size: 16px;

    line-height: 1.75;
}


/* =========================================================
   06. SEARCH
========================================================= */

.scheme-search {
    display: flex;

    max-width: 780px;

    margin-inline: auto;

    padding: 6px;

    background: #fff;

    border-radius: 15px;

    box-shadow:
        0 20px 50px
        rgba(0, 0, 0, 0.18);
}

.scheme-search input {
    flex: 1;

    min-width: 0;

    height: 52px;

    padding: 0 18px;

    border: 0;

    outline: none;

    background: transparent;

    color: var(--sk-text);

    font-size: 14px;
}

.scheme-search input::placeholder {
    color: #98a2b3;
}

.scheme-search input:focus {
    outline: none;
}

.scheme-search button {
    min-width: 112px;

    height: 52px;

    border: 0;

    border-radius: 11px;

    background:
        var(--sk-orange);

    color: #172033;

    font-weight: 850;

    transition:
        var(--sk-transition);
}

.scheme-search button:hover {
    transform: translateY(-1px);

    filter: brightness(1.05);
}


/* =========================================================
   07. CATEGORIES
========================================================= */

.scheme-categories {
    padding: 62px 0 30px;

    background: #fff;
}

.section-heading {
    margin-bottom: 24px;
}

.section-heading span,
.section-label {
    display: block;

    margin-bottom: 6px;

    color: var(--sk-primary);

    font-size: 11px;

    font-weight: 850;

    letter-spacing: 1.1px;

    text-transform: uppercase;
}

.section-heading h2,
.results-header h2 {
    margin: 0;

    color: var(--sk-text);

    font-size:
        clamp(25px, 3vw, 34px);

    line-height: 1.2;

    letter-spacing: -0.5px;
}

.category-grid {
    display: grid;

    grid-template-columns:
        repeat(8, minmax(0, 1fr));

    gap: 12px;
}

.category-btn {
    min-height: 105px;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    gap: 8px;

    padding: 13px 8px;

    border:
        1px solid var(--sk-border);

    border-radius: 15px;

    background: #fff;

    color: var(--sk-text);

    transition:
        transform .25s ease,
        box-shadow .25s ease,
        border-color .25s ease,
        background .25s ease;
}

.category-btn span {
    font-size: 24px;

    line-height: 1;
}

.category-btn strong {
    font-size: 11px;

    text-align: center;
}

.category-btn:hover {
    transform: translateY(-4px);

    border-color: #c6d3e5;

    box-shadow:
        var(--sk-shadow-sm);
}

.category-btn.active {
    border-color:
        var(--sk-primary);

    background:
        var(--sk-primary-light);

    color:
        var(--sk-primary);

    box-shadow:
        0 0 0 1px
        rgba(11, 61, 145, .06);
}


/* =========================================================
   08. FILTER AREA
========================================================= */

.scheme-filter-section {
    padding: 36px 0 10px;

    background:
        var(--sk-bg);
}

.filter-box {
    padding: 25px;

    background: #fff;

    border:
        1px solid var(--sk-border);

    border-radius:
        var(--sk-radius);

    box-shadow:
        var(--sk-shadow);
}

.filter-header {
    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 20px;

    margin-bottom: 22px;
}

.filter-header span {
    color: var(--sk-primary);

    font-size: 10px;

    font-weight: 850;

    letter-spacing: 1px;

    text-transform: uppercase;
}

.filter-header h2 {
    margin: 4px 0 0;

    color: var(--sk-text);

    font-size: 21px;
}

#clearFilters,
#emptyClearFilters {
    min-height: 38px;

    padding: 0 13px;

    border:
        1px solid var(--sk-border);

    border-radius: 9px;

    background: #fff;

    color: var(--sk-primary);

    font-size: 12px;

    font-weight: 800;

    transition:
        var(--sk-transition);
}

#clearFilters:hover,
#emptyClearFilters:hover {
    border-color:
        var(--sk-primary);

    background:
        var(--sk-primary-light);
}

.filter-grid {
    display: grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 15px;
}

.filter-field {
    display: flex;

    flex-direction: column;

    gap: 7px;
}

.filter-field label {
    color: var(--sk-text-soft);

    font-size: 11px;

    font-weight: 800;
}

.filter-field select {
    width: 100%;

    height: 46px;

    padding: 0 13px;

    border:
        1px solid var(--sk-border);

    border-radius: 10px;

    outline: none;

    background: #fff;

    color: var(--sk-text);

    font-size: 13px;

    cursor: pointer;

    transition:
        var(--sk-transition);
}

.filter-field select:hover {
    border-color: #b8c6dc;
}

.filter-field select:focus {
    border-color:
        var(--sk-primary);

    box-shadow:
        0 0 0 3px
        rgba(11, 61, 145, .09);
}


/* =========================================================
   09. RESULTS
========================================================= */

.schemes-section {
    padding: 43px 0 78px;

    background:
        var(--sk-bg);
}

.results-header {
    display: flex;

    align-items: flex-end;

    justify-content: space-between;

    gap: 20px;

    margin-bottom: 24px;
}

.scheme-count {
    display: inline-flex;

    align-items: center;

    min-height: 34px;

    padding: 0 13px;

    border:
        1px solid #d9e2ef;

    border-radius: 999px;

    background: #fff;

    color: var(--sk-primary);

    font-size: 11px;

    font-weight: 850;

    white-space: nowrap;
}


/* =========================================================
   10. SCHEME GRID
========================================================= */

.scheme-grid {
    display: grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 20px;
}


/* =========================================================
   11. SCHEME CARD
========================================================= */

.scheme-card {
    position: relative;

    display: flex;

    flex-direction: column;

    overflow: hidden;

    min-width: 0;

    background: #fff;

    border:
        1px solid var(--sk-border);

    border-radius:
        var(--sk-radius);

    box-shadow:
        var(--sk-shadow-sm);

    transition:
        transform .28s ease,
        box-shadow .28s ease,
        border-color .28s ease;
}

.scheme-card:hover {
    transform: translateY(-6px);

    border-color: #cad6e7;

    box-shadow:
        var(--sk-shadow-lg);
}

.scheme-card-top {
    height: 5px;

    flex-shrink: 0;

    background:
        linear-gradient(
            90deg,
            var(--sk-primary) 0%,
            var(--sk-primary) 55%,
            var(--sk-orange) 100%
        );
}

.scheme-card-body {
    padding: 22px;
}

.scheme-card-badges {
    display: flex;

    flex-wrap: wrap;

    gap: 6px;

    margin-bottom: 13px;
}

.scheme-badge {
    display: inline-flex;

    align-items: center;

    min-height: 24px;

    padding: 0 8px;

    border-radius: 999px;

    background:
        var(--sk-primary-light);

    color:
        var(--sk-primary);

    font-size: 9px;

    font-weight: 850;

    letter-spacing: .45px;

    text-transform: uppercase;
}

.scheme-badge.state {
    background:
        var(--sk-success-bg);

    color:
        var(--sk-success);
}

.scheme-badge.featured {
    background:
        var(--sk-warning-bg);

    color:
        var(--sk-warning);
}

.scheme-card h3 {
    margin: 0 0 10px;

    color: var(--sk-text);

    font-size: 19px;

    line-height: 1.4;

    letter-spacing: -.2px;
}

.scheme-card-description {
    min-height: 63px;

    margin: 0;

    color: var(--sk-muted);

    font-size: 12.5px;

    line-height: 1.7;

    display: -webkit-box;

    -webkit-line-clamp: 3;

    -webkit-box-orient: vertical;

    overflow: hidden;
}


/* =========================================================
   12. CARD META
========================================================= */

.scheme-meta {
    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 11px;

    margin-top: 19px;

    padding-top: 17px;

    border-top:
        1px solid var(--sk-border);
}

.scheme-meta-item {
    min-width: 0;
}

.scheme-meta-label {
    display: block;

    margin-bottom: 4px;

    color: #98a2b3;

    font-size: 9px;

    font-weight: 800;

    letter-spacing: .55px;

    text-transform: uppercase;
}

.scheme-meta-value {
    display: block;

    overflow: hidden;

    color: #344054;

    font-size: 11px;

    font-weight: 750;

    text-overflow: ellipsis;

    white-space: nowrap;
}


/* =========================================================
   13. CARD FOOTER
========================================================= */

.scheme-card-footer {
    display: flex;

    align-items: center;

    gap: 8px;

    margin-top: 20px;
}

.scheme-details-btn {
    flex: 1;

    min-height: 42px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    padding: 0 14px;

    border-radius: 10px;

    background:
        var(--sk-primary);

    color: #fff;

    font-size: 11px;

    font-weight: 850;

    text-decoration: none;

    transition:
        var(--sk-transition);
}

.scheme-details-btn:hover {
    background:
        var(--sk-primary-dark);

    transform: translateY(-1px);
}

.scheme-save-btn {
    width: 42px;
    height: 42px;

    flex-shrink: 0;

    display: grid;

    place-items: center;

    border:
        1px solid var(--sk-border);

    border-radius: 10px;

    background: #fff;

    color:
        var(--sk-primary);

    font-size: 18px;

    transition:
        var(--sk-transition);
}

.scheme-save-btn:hover {
    border-color:
        var(--sk-primary);

    background:
        var(--sk-primary-light);
}

.scheme-save-btn:focus-visible,
.scheme-details-btn:focus-visible,
.category-btn:focus-visible,
.scheme-search button:focus-visible {
    outline:
        3px solid
        rgba(11, 61, 145, .20);

    outline-offset: 2px;
}


/* =========================================================
   14. LOADING
========================================================= */

.scheme-loading {
    min-height: 330px;

    display: none;

    align-items: center;

    justify-content: center;

    flex-direction: column;

    padding: 50px 20px;

    background: #fff;

    border:
        1px solid var(--sk-border);

    border-radius:
        var(--sk-radius);

    box-shadow:
        var(--sk-shadow-sm);

    text-align: center;
}

.scheme-loading.active {
    display: flex;
}

.loading-spinner {
    width: 48px;
    height: 48px;

    margin-bottom: 16px;

    border:
        4px solid #e8eef7;

    border-top-color:
        var(--sk-primary);

    border-right-color:
        var(--sk-orange);

    border-radius: 50%;

    animation:
        schemeSpinner .8s linear infinite;
}

.scheme-loading p {
    margin: 0;

    color: var(--sk-muted);

    font-size: 13px;

    font-weight: 650;
}

@keyframes schemeSpinner {

    to {
        transform: rotate(360deg);
    }

}


/* =========================================================
   15. ERROR STATE
========================================================= */

.scheme-error {
    min-height: 310px;

    display: none;

    align-items: center;

    justify-content: center;

    flex-direction: column;

    padding: 45px 20px;

    background: #fff;

    border:
        1px solid #f0d5d5;

    border-radius:
        var(--sk-radius);

    text-align: center;
}

.scheme-error.active {
    display: flex;
}

.scheme-error .message-icon {
    background:
        var(--sk-danger-bg);

    color:
        var(--sk-danger);
}

.scheme-error h3 {
    margin: 0 0 8px;

    color: var(--sk-text);

    font-size: 20px;
}

.scheme-error p {
    max-width: 520px;

    margin: 0 0 20px;

    color: var(--sk-muted);

    font-size: 13px;

    line-height: 1.65;
}

#retrySchemes {
    min-height: 43px;

    padding: 0 20px;

    border: 0;

    border-radius: 10px;

    background:
        var(--sk-primary);

    color: #fff;

    font-size: 12px;

    font-weight: 850;

    transition:
        var(--sk-transition);
}

#retrySchemes:hover {
    background:
        var(--sk-primary-dark);

    transform: translateY(-1px);
}


/* =========================================================
   16. EMPTY STATE
========================================================= */

.scheme-empty {
    min-height: 310px;

    display: none;

    align-items: center;

    justify-content: center;

    flex-direction: column;

    padding: 45px 20px;

    background: #fff;

    border:
        1px solid var(--sk-border);

    border-radius:
        var(--sk-radius);

    text-align: center;
}

.scheme-empty.active {
    display: flex;
}

.scheme-empty .message-icon {
    background:
        var(--sk-primary-light);

    color:
        var(--sk-primary);
}

.scheme-empty h3 {
    margin: 0 0 8px;

    color: var(--sk-text);

    font-size: 20px;
}

.scheme-empty p {
    max-width: 500px;

    margin: 0 0 20px;

    color: var(--sk-muted);

    font-size: 13px;

    line-height: 1.6;
}


/* =========================================================
   17. PAGINATION
========================================================= */

.scheme-pagination {
    display: flex;

    align-items: center;

    justify-content: center;

    flex-wrap: wrap;

    gap: 6px;

    margin-top: 34px;
}

.scheme-pagination button {
    min-width: 39px;

    height: 39px;

    padding: 0 10px;

    border:
        1px solid var(--sk-border);

    border-radius: 9px;

    background: #fff;

    color: var(--sk-text-soft);

    font-size: 11px;

    font-weight: 800;

    transition:
        var(--sk-transition);
}

.scheme-pagination button:hover {
    border-color:
        var(--sk-primary);

    color:
        var(--sk-primary);

    background:
        var(--sk-primary-light);
}

.scheme-pagination button.active {
    border-color:
        var(--sk-primary);

    background:
        var(--sk-primary);

    color: #fff;
}

.scheme-pagination button:disabled {
    opacity: .4;

    cursor: not-allowed;
}

.scheme-pagination span {
    padding: 0 4px;

    color: #98a2b3;

    font-size: 12px;
}


/* =========================================================
   18. ELIGIBILITY FINDER
========================================================= */

.eligibility-banner {
    padding: 65px 0;

    background:
        linear-gradient(
            135deg,
            #071f4c,
            #0b3d91
        );
}

.eligibility-content {
    display: flex;

    align-items: center;

    gap: 23px;

    padding: 30px 34px;

    border:
        1px solid
        rgba(255, 255, 255, .14);

    border-radius:
        var(--sk-radius);

    background:
        rgba(255, 255, 255, .07);

    box-shadow:
        0 20px 50px
        rgba(0, 0, 0, .14);
}

.eligibility-icon {
    width: 64px;
    height: 64px;

    flex-shrink: 0;

    display: grid;

    place-items: center;

    border-radius: 17px;

    background:
        rgba(255, 255, 255, .11);

    font-size: 29px;
}

.eligibility-content > div:nth-child(2) {
    flex: 1;
}

.eligibility-content span {
    color:
        rgba(255, 255, 255, .62);

    font-size: 11px;

    font-weight: 750;
}

.eligibility-content h2 {
    margin: 5px 0 7px;

    color: #fff;

    font-size: 22px;

    line-height: 1.3;
}

.eligibility-content p {
    margin: 0;

    color:
        rgba(255, 255, 255, .68);

    font-size: 12px;

    line-height: 1.65;
}

.primary-btn {
    min-height: 46px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    flex-shrink: 0;

    padding: 0 18px;

    border-radius: 10px;

    background:
        var(--sk-orange);

    color: #172033;

    font-size: 11px;

    font-weight: 850;

    text-decoration: none;

    transition:
        var(--sk-transition);
}

.primary-btn:hover {
    transform: translateY(-2px);

    filter: brightness(1.06);
}


/* =========================================================
   19. DISCLAIMER
========================================================= */

.portal-disclaimer {
    padding: 35px 0;

    background: #fff;
}

.disclaimer-box {
    padding: 19px 21px;

    border-left:
        4px solid
        var(--sk-orange);

    border-radius: 10px;

    background:
        #fff9f3;
}

.disclaimer-box strong {
    display: block;

    margin-bottom: 7px;

    color: #7a450e;

    font-size: 12px;
}

.disclaimer-box p {
    margin: 5px 0;

    color: #695d4f;

    font-size: 10.5px;

    line-height: 1.7;
}


/* =========================================================
   20. FOOTER
========================================================= */

.site-footer {
    padding-top: 55px;

    background:
        #101828;

    color: #fff;
}

.footer-grid {
    display: grid;

    grid-template-columns:
        1.5fr 1fr 1fr 1fr;

    gap: 38px;

    padding-bottom: 44px;
}

.site-footer h3 {
    margin: 0 0 11px;

    color: #fff;

    font-size: 20px;
}

.site-footer h4 {
    margin: 0 0 13px;

    color: #fff;

    font-size: 12px;
}

.site-footer p {
    max-width: 330px;

    margin: 0;

    color:
        rgba(255, 255, 255, .55);

    font-size: 11px;

    line-height: 1.75;
}

.site-footer a {
    display: block;

    width: fit-content;

    margin-bottom: 9px;

    color:
        rgba(255, 255, 255, .55);

    font-size: 11px;

    text-decoration: none;

    transition:
        var(--sk-transition);
}

.site-footer a:hover {
    color: #fff;

    transform: translateX(2px);
}

.footer-bottom {
    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 20px;

    padding: 18px 0;

    border-top:
        1px solid
        rgba(255, 255, 255, .08);
}

.footer-bottom p {
    max-width: none;

    font-size: 9px;
}


/* =========================================================
   21. TABLET
========================================================= */

@media (max-width: 1100px) {

    .category-grid {
        grid-template-columns:
            repeat(4, 1fr);
    }

    .scheme-grid {
        grid-template-columns:
            repeat(2, 1fr);
    }

    .filter-grid {
        grid-template-columns:
            repeat(2, 1fr);
    }

}


/* =========================================================
   22. MOBILE NAVIGATION
========================================================= */

@media (max-width: 900px) {

    .mobile-menu-btn {
        display: grid;

        place-items: center;
    }

    .main-nav {
        display: none;

        position: absolute;

        top: 76px;

        left: 14px;
        right: 14px;

        flex-direction: column;

        align-items: stretch;

        gap: 2px;

        padding: 8px;

        background: #fff;

        border:
            1px solid var(--sk-border);

        border-radius: 13px;

        box-shadow:
            var(--sk-shadow-lg);
    }

    .main-nav.mobile-open {
        display: flex;
    }

    .main-nav a {
        padding: 12px;

        border-radius: 9px;
    }

    .main-nav a.active::after {
        display: none;
    }

}


/* =========================================================
   23. MOBILE 767
========================================================= */

@media (max-width: 767px) {

    .container {
        width:
            calc(100% - 28px);
    }

    .schemes-hero {
        padding: 58px 0 62px;
    }

    .schemes-hero h1 {
        font-size: 38px;

        letter-spacing: -1px;
    }

    .schemes-hero p {
        font-size: 13px;

        line-height: 1.7;
    }

    .scheme-search {
        flex-direction: column;

        padding: 7px;
    }

    .scheme-search input {
        height: 48px;
    }

    .scheme-search button {
        width: 100%;

        height: 46px;
    }

    .scheme-categories {
        padding-top: 45px;
    }

    .category-grid {
        grid-template-columns:
            repeat(2, 1fr);

        gap: 10px;
    }

    .category-btn {
        min-height: 90px;
    }

    .filter-box {
        padding: 18px;
    }

    .filter-header {
        flex-direction: column;

        align-items: flex-start;
    }

    .filter-grid {
        grid-template-columns: 1fr;
    }

    .schemes-section {
        padding-top: 35px;
    }

    .results-header {
        flex-direction: column;

        align-items: flex-start;
    }

    .scheme-grid {
        grid-template-columns: 1fr;
    }

    .scheme-card-body {
        padding: 20px;
    }

    .eligibility-content {
        flex-direction: column;

        align-items: flex-start;

        padding: 25px;
    }

    .eligibility-content .primary-btn {
        width: 100%;
    }

    .footer-grid {
        grid-template-columns: 1fr;

        gap: 27px;
    }

    .footer-bottom {
        flex-direction: column;

        align-items: flex-start;

        gap: 5px;
    }

}


/* =========================================================
   24. SMALL MOBILE 480
========================================================= */

@media (max-width: 480px) {

    .header-inner {
        min-height: 68px;
    }

    .main-nav {
        top: 68px;
    }

    .brand-icon {
        width: 39px;
        height: 39px;

        font-size: 19px;
    }

    .brand strong {
        font-size: 16px;
    }

    .brand small {
        font-size: 9px;
    }

    .schemes-hero h1 {
        font-size: 31px;
    }

    .hero-badge {
        font-size: 10px;
    }

    .section-heading h2,
    .results-header h2 {
        font-size: 25px;
    }

    .scheme-meta {
        grid-template-columns: 1fr;
    }

    .scheme-card h3 {
        font-size: 18px;
    }

    .scheme-card-description {
        min-height: auto;
    }

    .eligibility-content h2 {
        font-size: 19px;
    }

}


/* =========================================================
   25. REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;

        animation-duration:
            .01ms !important;

        animation-iteration-count:
            1 !important;

        transition-duration:
            .01ms !important;
    }

}