body {
    font-family: sans-serif;
    margin: 0;
    padding: 0;
}

header {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding: 1rem 2rem;
    background-color: black;
}

    header img {
        width: 72px;
        height: auto;
        background: cornsilk;
        border-radius: 6px;
    }


nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    padding-left: 66px;
}

nav li {
    margin-right: 3rem;
}

nav a {
    text-decoration: none;
    color: floralwhite;
    font-size: 17px;
    font-family: ui-sans-serif;
}

/*main {
    padding: 2rem;
}*/
/*main {
    padding: 2rem;*/ /* Maintained for potential content padding */
/*min-height: calc(100vh - (header.offsetHeight + footer.offsetHeight));*/ /* Set minimum height to fill remaining viewport space */
/*background-color: #083344;*/ /* Added background color */
/*display: flex;*/ /* Added for vertical centering */
/*flex-direction: column;*/ /* Added for vertical centering */
/*justify-content: center;*/ /* Center content vertically */
/*align-items: center;*/ /* Center content horizontally */
/*}*/
main.hero {
    padding: 2rem;
    min-height: calc(100vh - (header.offsetHeight + footer.offsetHeight));
    background-image: url("/images/search_bar_bg.png");
    background-size: cover;
    background-position: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: white;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.7);
}

main h2 {
    margin-bottom: 1rem;
}

main h1 {
    font-size: 2.5rem;
    margin-bottom: 1rem;
    color: rgb(51, 51, 51);
    font-style: oblique;
    font-family: sans-serif;
}

main form {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 1rem;
}

main label {
    flex-basis: 30%;
    padding-right: 1rem;
}

main input[type="text"] {
    flex-basis: 70%;
    padding: 0.5rem;
    border: 1px solid #ccc;
}

main button {
    background-color: #333;
    color: white;
    padding: 0.5rem 1rem;
    border: none;
    cursor: pointer;
}

footer {
    text-align: center;
    padding: 1rem;
    background-color: black;
    color: #f2f2ec;
    font-family: Helvetica, Arial, sans-serif;
}

.why-choose-us {
    background-color: rgb(37 15 55 / 85%);
    padding: 40px 20px;
    height: 390px;
}

    .why-choose-us ul {
        list-style-type: none;
        padding: 18px;
        display: flex;
    }

    .why-choose-us li {
        padding: 13px;
        text-align: left;
        margin: 18px 0;
        font-family: 'Font Awesome 5 Free';
    }

    .why-choose-us strong {
        display: block;
        font-size: 1.2em;
        margin-bottom: 5px;
    }

.auth {
    display: flex;
    align-items: center;
    margin-left: 120px;
}

    .auth i {
        margin-left: 0.5rem;
        font-size: 1rem;
    }

.benefits {
    list-style: none; /* Removed default dot for list items */
    padding: 0;
    margin: 1rem 0;
}

    .benefits li {
        margin-bottom: 0.5rem; /* Add some space between list items */
        font-family: Arial, sans-serif; /* Change font to Arial or a preferred font */
    }

.search-box {
            background-color: white;
            padding: 30px;
            border-radius: 10px;
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
            width: 100%;
            max-width: 600px;
}

.search-box p {
            color: #333;
            font-size: 18px;
            margin-bottom: 20px;
            text-align: center;
}

#jobform {
            display: flex;
            flex-wrap: wrap;
            gap: 15px;
            align-items: center;
}

.job-search-cls {
            position: relative;
            flex: 1;
            min-width: 200px;
        }

.job-search-cls i {
            position: absolute;
            left: 12px;
            top: 50%;
            transform: translateY(-50%);
            color: #666;
            font-size: 16px;
}

.job-search-cls input {
            width: 100%;
            padding: 12px 12px 12px 40px;
            border: 1px solid #ddd;
            border-radius: 5px;
            font-size: 16px;
            transition: border-color 0.3s, box-shadow 0.3s;
}

.job-search-cls input:focus {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.3);
}

.job-search-cls input::placeholder {
    color: #999;
}

.autocomplete-suggestions {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: white;
    border: 1px solid #ddd;
    border-radius: 5px;
    margin-top: 5px;
    max-height: 200px;
    overflow-y: auto;
    z-index: 1000;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
        display: none;
}

.autocomplete-suggestions div {
        padding: 10px;
        cursor: pointer;
        font-size: 14px;
 }

.autocomplete-suggestions div:hover {
        background-color: #f0f0f0;
}

.job-sbm-btn {
        background-color: #007bff;
        color: white;
        border: none;
        padding: 12px 20px;
        border-radius: 5px;
        font-size: 16px;
        cursor: pointer;
        transition: background-color 0.3s;
}

.job-sbm-btn:hover {
        background-color: #0056b3;
 }

 @media (max-width: 480px) {
        .job-search-cls {
            min-width: 100%;
    }
        
    #jobform {
            flex-direction: column;
    }
        
    .job-sbm-btn {
            width: 100%;
     }
}

body {
    font-family: Arial, sans-serif;
}

.browse-section {
    text-align: center;
    padding: 20px;
    border-top: 1px solid #ccc;
}

    .browse-section h1 {
        font-size: 2em;
        margin-bottom: 20px;
        position: relative;
    }

        .browse-section h1::after {
            content: '';
            display: block;
            width: 60px;
            height: 3px;
            background: red;
            margin: 10px auto 0;
        }

.browse-filters {
    margin-bottom: 20px;
}

    .browse-filters button {
        background-color: rgba(0, 0, 0, 0.7);
        color: white;
        border: none;
        border-radius: 20px;
        padding: 10px 15px;
        margin: 5px;
        cursor: pointer;
    }

        .browse-filters button:hover {
            background-color: #0056b3;
        }

.job-lists {
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
}

.job-column {
    flex: 1;
    min-width: 200px;
    padding: 15px;
    display: grid;
    margin-left: 63px;
    text-align: -webkit-left;
}

    .job-column a {
        display: block;
        color: #0e7490;
        text-decoration: none;
        margin: 5px 0;
        font-size: 1em;
    }

        .job-column a:hover {
            text-decoration: underline;
        }

.choose-us-head {
    color: #39f800;
    text-align: center;
    font-family: "Sofia", sans-serif;
    font-size: 20px;
    text-shadow: 0px 0px 0px #ababab;
}

.why-choose-para {
    color: #fff;
    text-align: center;
    font-size: 15px;
    margin-left: 60px;
    position: absolute;
}

.li-item-box {
    height: 230px;
    width: 104%;
    border: 1px solid aliceblue;
    line-height: 1.5;
    text-align: center;
    box-sizing: border-box;
    box-shadow: -3px 0px 11px 3px black;
    border-radius: 16px;
    padding: 30px;
    float: left;
    position: relative;
}

.face-think-icon::after {
    content: "\1F914"; /* Unicode for thinking face emoji */
    font-family: "Font Awesome 5 Free"; /* Ensures emoji rendering */
    font-size: 24px; /* Adjust the size as needed */
    margin-right: 8px; /* Space between emoji and text */
}

.face-think-icon {
    display: inline-flex;
    padding-left: 4px;
}

.input-group {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    width: 37%;
}

a.btn.btn-primary.login-register-cls {
    background-color: cornsilk;
    color: black;
    font-family: serif;
}

.modal-content.login-body-cls {
    width: 530px;
    min-height: max-content;
    background: #8b6060;
    margin-top: 110px;
}

.modal-footer {
    display: flex;
    position: relative;
    border: none;
}

button.btn.btn-primary {
    background: black;
    border: none;
}

.modal-header.login-header {
    border: none;
    font-family: 'sans serif';
    color: aquamarine;
}

h5#exampleModalLabel {
    text-align: center;
    padding-left: 45px;
    font-size: xx-large;
}

label.col-form-label {
    color: aquamarine;
    font-family: fangsong;
    padding-left: 8px;
    font-size: 20px;
}


button.btn-close.close-login-btn {
    /* background: white; */
    position: relative;
    padding-left: 60px;
    border: 1px solid black;
    width: inherit;
    border-radius: 10px;
    box-shadow: 0px 1px;
}

.submit-login-btn {
    width: -webkit-fill-available;
    display: flex;
    height: 49px;
    padding-left: 160px;
    /* margin-left: 182px; */
    justify-content: flex-end;
    flex-wrap: nowrap;
    flex-direction: row-reverse;
    align-content: flex-end;
}

.login-para-footer {
    position: relative;
    padding-right: 225px;
    font-family: serif;
    color: black;
    font-size: 18px;
}

.modal-footer {
    border: none;
}

.roboto-thin {
    font-family: "Roboto", sans-serif;
    font-weight: 100;
    font-style: normal;
}

.roboto-light {
    font-family: "Roboto", sans-serif;
    font-weight: 300;
    font-style: normal;
}

.roboto-regular {
    font-family: "Roboto", sans-serif;
    font-weight: 400;
    font-style: normal;
}

.roboto-medium {
    font-family: "Roboto", sans-serif;
    font-weight: 500;
    font-style: normal;
}

.roboto-bold {
    font-family: "Roboto", sans-serif;
    font-weight: 700;
    font-style: normal;
}

.roboto-black {
    font-family: "Roboto", sans-serif;
    font-weight: 900;
    font-style: normal;
}

.roboto-thin-italic {
    font-family: "Roboto", sans-serif;
    font-weight: 100;
    font-style: italic;
}

.roboto-light-italic {
    font-family: "Roboto", sans-serif;
    font-weight: 300;
    font-style: italic;
}

.roboto-regular-italic {
    font-family: "Roboto", sans-serif;
    font-weight: 400;
    font-style: italic;
}

.roboto-medium-italic {
    font-family: "Roboto", sans-serif;
    font-weight: 500;
    font-style: italic;
}

.roboto-bold-italic {
    font-family: "Roboto", sans-serif;
    font-weight: 700;
    font-style: italic;
}

.roboto-black-italic {
    font-family: "Roboto", sans-serif;
    font-weight: 900;
    font-style: italic;
}

.login-para-footer {
    padding-right: 154px;
    display: flex;
}

    .login-para-footer a {
        text-decoration: underline;
        padding-left: 11px;
        color: blanchedalmond;
    }

.aboutus-content {
    min-width: -webkit-fill-available;
    display: flex;
    text-align: justify;
    line-height: 1.5;
    text-decoration: none;
    text-align: justify;
    margin-right: 0px;
}

.about-container {
    text-align: justify;
    font-size: 15px;
    font-family: Arial, Helvetica, sans-serif;
    text-align: center;
    /* min-width: -webkit-fill-available; */
    margin-top: 60px;
    width: 1033px;
    margin-left: 94px;
    border: 1px solid black;
    padding: 0px;
    /* margin: auto; */
    margin-bottom: 52px;
    box-shadow: -1px -1px 20px 2px;
    background: var(--bs-border-color);
}

    .about-container p {
        text-align: justify;
        padding-left: 110px;
        text-align: justify;
        padding-right: 80px;
    }

.aboutus-content ul {
    list-style-type: none;
    padding-left: 0px;
    line-height: 1.5;
}

.aboutus-content h3 {
    font-size: 24px;
    color: black;
    margin-left: 110px;
}

.about-container h2 {
    font-size: 40px;
    font-weight: revert-layer;
    font-family: Arial, Helvetica, sans-serif;
    padding-bottom: 20px;
    padding-top: 28px;
}

main.hero-section-cls {
    /* background: #0b20361a; */
    width: -webkit-fill-available;
}


.about-container {
    text-align: justify;
    font-size: 15px;
    font-family: Arial, Helvetica, sans-serif;
    text-align: center;
    min-width: -webkit-fill-available;
    margin-top: 60px;
    width: 1033px;
    margin-left: 310px;
    border: 1px solid black;
    padding: 0px;
    margin: auto;
    margin-bottom: 52px;
    box-shadow: -1px -1px 20px 2px;
    background: var(--bs-border-color);
}

header {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding: 1rem 3rem;
    /*background-color: black;*/
}

nav li {
    margin-right: 6rem;
}

.about-container ol {
    text-align: justify;
}

.about-container ol {
    text-align: justify;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 17px;
    padding-left: 127px;
}

.aboutus-content ol li h4 {
    text-align: justify;
    padding-left: 62px;
}

.privacy-list-inner h4 {
    text-align: justify;
}

.aboutus-content h4 {
    text-align: justify;
    padding-left: 110px;
    font-size: 18px;
    text-decoration: underline;
}

.about-container {
    text-align: justify;
    font-size: 15px;
    font-family: Arial, Helvetica, sans-serif;
    text-align: center;
    min-width: -webkit-fill-available;
    margin-top: 60px;
    width: 1033px;
    margin-left: 310px;
    border: 1px solid black;
    padding: 0px;
    margin: auto;
    margin-bottom: 52px;
    box-shadow: -1px -1px 20px 2px;
    background: var(--bs-border-color);
}

about-container conatct-containers {
    text-align: justify;
    font-size: 15px;
    font-family: Arial, Helvetica, sans-serif;
    text-align: center;
    min-width: -webkit-fill-available;
    margin-top: 60px;
    width: 1033px;
    margin-left: 310px;
    border: 1px solid black;
    padding: 0px;
    margin: auto;
    margin-bottom: 52px;
    box-shadow: -1px -1px 20px 2px;
    background: rgba(255, 255, 255, 0.15);
}

.about-container h2 {
    font-size: 40px;
    font-weight: revert-layer;
    font-family: Arial, Helvetica, sans-serif;
    padding-bottom: 20px;
    padding-top: 28px;
}

main.hero-section-cls {
    /*background: #2a0a08;*/
    width: -webkit-fill-available;
    width: 1399px;
    margin-left: 105px;
    margin-top: 28px;
}

main.hero-section-cls {
    /*background: #2a0a08;*/
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    padding: 28px 16px;
    box-sizing: border-box;
}
@media (max-width: 768px) {
    main.hero-section-cls {
        padding: 20px 12px;
    }
}

@media (max-width: 480px) {
    main.hero-section-cls {
        padding: 16px 10px;
    }
}


/*--------------------------Enquiry Form Css------------------------------*/


.contact-form-cls body {
    background-color: #444442;
    padding-top: 85px;
}

.contact-form-cls h1 {
    font-family: 'Poppins', sans-serif, 'arial';
    font-weight: 600;
    font-size: 72px;
    color: #343a40;
    text-align: center;
}

.contact-form-cls h4 {
    font-family: 'Roboto', sans-serif, 'arial';
    font-weight: 400;
    font-size: 20px;
    color: #343a40;
    line-height: 1.5;
}

/* ///// inputs /////*/

.contact-form-cls input:focus ~ label, textarea:focus ~ label, input:valid ~ label, textarea:valid ~ label {
    font-size: 0.75em;
    color: #999;
    top: -5px;
    -webkit-transition: all 0.225s ease;
    transition: all 0.225s ease;
}

.contact-form-cls .styled-input {
    float: left;
    width: 293px;
    margin: 1rem 0;
    position: relative;
    border-radius: 4px;
}

@media only screen and (max-width: 768px) {
    .contact-form-cls .styled-input {
        width: 100%;
    }
}

.contact-form-cls .styled-input label {
    color: #999;
    padding: 1.3rem 30px 1rem 30px;
    position: absolute;
    top: 10px;
    left: 0;
    -webkit-transition: all 0.25s ease;
    transition: all 0.25s ease;
    pointer-events: none;
}

.contact-form-cls .styled-input.wide {
    width: 650px;
    max-width: 100%;
}

.contact-form-cls input,
textarea {
    padding: 30px;
    border: 0;
    width: 100%;
    font-size: 1rem;
    background-color: #2d2d2d;
    color: white;
    border-radius: 4px;
}

    .contact-form-cls input:focus,
    textarea:focus {
        outline: 0;
    }

        .contact-form-cls input:focus ~ span,
        textarea:focus ~ span {
            width: 100%;
            -webkit-transition: all 0.075s ease;
            transition: all 0.075s ease;
        }

.contact-form-cls textarea {
    width: 100%;
    min-height: 15em;
}

.contact-form-cls .input-container {
    width: 650px;
    max-width: 100%;
    margin: 20px auto 25px auto;
}

.contact-form-cls .submit-btn {
    float: right;
    padding: 7px 245px;
    border-radius: 60px;
    display: inline-block;
    background-color: #343a40;
    color: white;
    font-size: 18px;
    cursor: pointer;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.06), 0 2px 10px 0 rgba(0, 0, 0, 0.07);
    -webkit-transition: all 300ms ease;
    transition: all 300ms ease;
}

    .contact-form-cls .submit-btn:hover {
        transform: translateY(1px);
        box-shadow: 0 1px 1px 0 rgba(0,0,0,0.10), 0 1px 1px 0 rgba(0,0,0,0.09);
    }

@media (max-width: 768px) {
    .contact-form-cls .submit-btn {
        width: 100%;
        float: none;
        text-align: center;
    }
}

.contact-form-cls input[type=checkbox] + label {
    color: #ccc;
    font-style: italic;
}

.contact-form-cls input[type=checkbox]:checked + label {
    color: #f00;
    font-style: normal;
}

.catagory-list-data {
    display: none;
}

    .catagory-list-data.active {
        display: flex;
    }

@media(max-width:1517px) {
    nav li {
        margin-right: 3rem;
    }

    main.hero-section-cls {
        /*background: #2a0a08;*/
        width: -webkit-fill-available;
        margin-right: 65px;
        margin-top: 28px;
    }
}

/*------------------------- AutoSuggetion CSS---------------------------*/

/* Container for the search input fields and icons */
.job-search-cls {
    position: relative;
    margin-bottom: 15px;
}

    /* Style the input fields */
    .job-search-cls input {
        width: 100%;
        padding: 10px;
        padding-left: 40px; /* Space for the icon */
        box-sizing: border-box;
    }

    /* Style the icons */
    .job-search-cls i {
        position: absolute;
        left: 10px;
        top: 50%;
        transform: translateY(-50%);
        color: #888;
    }

/* Style the suggestions dropdown */
.autocomplete-suggestions {
    border: 1px solid #ddd;
    max-height: 200px;
    overflow-y: auto;
    position: absolute;
    background-color: #717b8a;
    z-index: 1000;
    width: calc(100% - 20px); /* Match input width minus padding */
    top: 100%; /* Position below the input field */
    left: 0;
    box-sizing: border-box;
}

/* Style individual suggestion items */
.autocomplete-suggestion {
    padding: 10px;
    cursor: pointer;
    background: crimson;
}

    /* Highlight suggestion items on hover */
    .autocomplete-suggestion:hover {
        background-color: #f0f0f0;
    }

/* Style the search button */
.job-sbm-btn {
    padding: 10px 20px;
    background-color: #007bff;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}

    .job-sbm-btn:hover {
        background-color: #0056b3;
    }

/* Roadmap section styles */
.roadmap {
    padding: 20px;
}

.stage {
    margin-bottom: 20px;
    padding: 15px;
    border: 1px solid #ddd;
    border-radius: 8px;
    background: #f9f9f9;
}

    .stage h2 {
        background: #0044cc;
        color: #fff;
        padding: 10px;
        margin: 0 -15px;
        border-radius: 8px 8px 0 0;
    }

    .stage ul {
        list-style: none;
        padding: 0;
        margin: 0;
    }

    .stage li {
        padding: 10px;
        border-bottom: 1px solid #ddd;
    }

        .stage li:last-child {
            border-bottom: none;
        }

/* Responsive design */
@media (max-width: 600px) {
    .stage h2 {
        font-size: 1.2em;
    }
}

/* Job Search Loader CSS */

.loader-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    color: #38bdf8;
}

.loader-text {
    font-size: 1.5rem;
    margin-bottom: 20px;
    animation: typing 2s steps(22, end) infinite;
    white-space: nowrap;
    overflow: hidden;
    border-right: 2px solid #38bdf8;
    width: 16ch;
}

@keyframes typing {
    0% {
        width: 0;
    }

    50% {
        width: 16ch;
    }

    100% {
        width: 0;
    }
}

.dots {
    display: flex;
    gap: 8px;
}

.dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background-color: #38bdf8;
    opacity: 0.3;
    animation: blink 1.4s infinite;
}

    .dot:nth-child(2) {
        animation-delay: 0.2s;
    }

    .dot:nth-child(3) {
        animation-delay: 0.4s;
    }

@keyframes blink {
    0%, 80%, 100% {
        opacity: 0.3;
    }

    40% {
        opacity: 1;
    }
}

/* Loader container */

.footer-sections {
    display: flex;
    justify-content: space-around; /* Even space around each section */
    align-items: flex-start;
    flex-wrap: wrap;
    max-width: 1200px;
    margin: 0 auto 30px auto;
    width: 100%;
}

.footer-section {
    flex: 1 1 200px; /* Makes sections responsive and evenly spaced */
    padding: 0 15px;
    min-width: 180px;
}

.footer-heading {
    color: #f6f8f9;
    margin-bottom: 10px;
    font-size: 1.3rem;
    font-weight: 700;
}

.footer-link {
    color: #ffffff;
    text-decoration: none;
    display: block;
    margin-bottom: 8px;
    font-size: 0.95rem;
    transition: color 0.3s ease;
}

    .footer-link:hover {
        color: #38bdf8;
    }

.footer-copy {
    margin: 0;
    font-size: 0.9rem;
}

/*--- Terms and Condition CSS --- */

.term-cond-cls h1, h2 {
    color: #2c3e50;
}

.term-cond-cls a {
    color: #007bff;
    text-decoration: none;
}

    .term-cond-cls a:hover {
        text-decoration: underline;
    }

.term-cond-clssection {
    margin-bottom: 2rem;
}


.corporate-meme-section {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    padding: 2rem;
    background-color: #f5f7fa;
    color: #333;
}

    .corporate-meme-section h2 {
        text-align: center;
        color: #0077b6;
        margin-bottom: 0.5rem;
    }

    .corporate-meme-section p {
        text-align: center;
        margin-bottom: 2rem;
        color: #666;
    }

.meme-container {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 2rem;
    max-width: 1200px;
    margin: 0 auto;
}

.meme-card {
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
    overflow: hidden;
    transition: transform 0.3s ease;
}

    .meme-card:hover {
        transform: scale(1.02);
    }

    .meme-card img {
        width: 100%;
        height: auto;
        display: block;
    }

.caption {
    padding: 1rem;
    font-size: 1rem;
    color: #555;
}

.tip {
    margin-bottom: 1.5rem;
}

    .tip h1, h2 {
        color: #004d99;
    }

.advice {
    margin-bottom: 1.5rem;
}

    .advice h1, h2 {
        color: #006600;
    }


@media (max-width: 768px) {
    body {
        padding: 1rem;
        font-size: 1rem;
    }

    .advice h1 {
        font-size: 1.5rem;
    }

    .advice h2 {
        font-size: 1.25rem;
    }
}

@media (max-width: 480px) {
    body {
        padding: 0.75rem;
        font-size: 0.95rem;
    }

    .advice h1 {
        font-size: 1.25rem;
    }

    .advice h2 {
        font-size: 1.1rem;
    }
}

/* Tablet View (max-width: 768px) */
@media (max-width: 768px) {
    header {
        flex-direction: column;
        align-items: flex-start;
        padding: 1rem;
    }

    nav ul {
        flex-direction: column;
        align-items: flex-start;
        padding-left: 0;
        width: 100%;
    }

    nav li {
        margin: 0.5rem 0;
    }

    .auth {
        margin-left: 0;
        width: 100%;
    }

    .li-item-box {
        width: 100%;
        margin-bottom: 1rem;
    }

    .footer-sections {
        flex-direction: column;
        align-items: center;
    }

    .footer-section {
        padding: 1rem;
        text-align: center;
    }

    .why-choose-us ul {
        flex-direction: column;
        padding: 0;
        align-items: center;
    }

    .why-choose-para {
        margin-left: 0;
        position: static;
    }

    main.hero {
        padding: 1rem;
    }
}

/* Mobile View (max-width: 480px) */
@media (max-width: 480px) {
    header {
        padding: 1rem;
    }

        header img {
            width: 60px;
        }

    nav a {
        font-size: 1rem;
    }

    .footer-heading {
        font-size: 1.1rem;
    }

    .footer-link {
        font-size: 0.9rem;
    }

    .why-choose-us {
        padding: 20px 10px;
        height: auto;
    }

    .li-item-box {
        padding: 15px;
        font-size: 0.95rem;
    }

    .loader-text {
        font-size: 1.2rem;
    }

    .job-sbm-btn {
        width: 90%;
        margin: 20px auto;
        position: static;
    }

    main.hero h1 {
        font-size: 1.8rem;
    }

    main.hero h2 {
        font-size: 1.3rem;
    }
}


.job-column a:hover {
    text-decoration: underline;
}
/* Tablet View */
@media (max-width: 768px) {
    .browse-section h1 {
        font-size: 1.7rem;
    }

    .browse-filters button {
        font-size: 0.95rem;
        padding: 8px 14px;
    }

    .job-column {
        flex: 1 1 45%;
        text-align: center;
    }
}

/* Mobile View */
@media (max-width: 480px) {
    .browse-section {
        padding: 20px 10px;
    }

        .browse-section h1 {
            font-size: 1.5rem;
        }

    .browse-filters {
        flex-direction: column;
        align-items: center;
    }

        .browse-filters button {
            width: 90%;
            font-size: 1rem;
        }

    .job-column {
        flex: 1 1 100%;
        text-align: center;
    }

        .job-column a {
            font-size: 0.95rem;
        }
}

/* Responsive Design for Job Search Index Page */

/* ✅ Base container */
.search-box {
    background-color: #f5f5f5;
    border-radius: 8px;
    padding: 2rem;
    margin: 2rem auto;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    max-width: 700px;
    width: 90%;
    box-sizing: border-box;
    overflow: hidden;
}

    /* ✅ Description text */
    .search-box p {
        text-align: center;
        font-size: 1.1rem;
        margin-bottom: 1.5rem;
        color: #333;
    }

    /* ✅ Form container */
    .search-box form {
        display: flex;
        flex-direction: column;
        gap: 1.2rem;
        width: 100%;
    }

/* ✅ Input + icon wrapper */
.job-search-cls {
    display: flex;
    align-items: center;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 6px;
    padding: 0.6rem;
    box-sizing: border-box;
    width: 100%;
}

    /* ✅ Input icon */
    .job-search-cls i {
        margin-right: 10px;
        color: #888;
    }

    /* ✅ Text input field */
    .job-search-cls input {
        border: none;
        outline: none;
        flex: 1;
        font-size: 1rem;
        padding: 0.5rem 0;
        width: 100%;
        min-width: 0;
        box-sizing: border-box;
    }

/* ✅ Submit Button */
.job-sbm-btn {
    background-color: #0f172a;
    color: white;
    padding: 0.75rem;
    border: none;
    border-radius: 6px;
    font-size: 1rem;
    cursor: pointer;
    width: 100%;
    box-sizing: border-box;
    transition: background-color 0.3s ease;
}

    .job-sbm-btn:hover {
        background-color: #1e40af;
    }

/* ✅ Autocomplete Suggestions (optional) */
.autocomplete-suggestions {
    position: absolute;
    z-index: 100;
    background-color: #fff;
    border: 1px solid #ccc;
    width: 100%;
    max-height: 200px;
    overflow-y: auto;
    box-sizing: border-box;
    top: 100%;
    left: 0;
}

/* ✅ Responsive - Tablet */
@media (max-width: 768px) {
    .search-box {
        padding: 1.5rem;
    }

    .job-search-cls {
        flex-direction: row;
    }

    .job-sbm-btn {
        font-size: 1rem;
    }
}

/* ✅ Responsive - Mobile */
@media (max-width: 480px) {
    .search-box {
        padding: 1rem;
    }

    .job-search-cls {
        flex-direction: column;
        align-items: stretch;
    }

        .job-search-cls i {
            margin: 0 0 0.5rem 0;
            align-self: flex-start;
        }

    .job-sbm-btn {
        width: 100%;
        font-size: 1rem;
    }
}

.contact-section {
    padding: 40px 20px;
    background-color: #f9fafb;
}

.contact-container {
    max-width: 1000px;
    margin: auto;
    background: #ffffff;
    border-radius: 10px;
    padding: 30px;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.05);
}

    .contact-container h1 {
        text-align: center;
        font-size: 2rem;
        margin-bottom: 10px;
        color: #0f172a;
    }

    .contact-container .subtitle {
        text-align: center;
        margin-bottom: 30px;
        color: #555;
    }

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

.contact-info {
    flex: 1;
    min-width: 250px;
    font-size: 1rem;
    color: #0f172a;
    background-color: #f1f5f9;
    padding: 20px;
    border-radius: 8px;
}

    .contact-info a {
        color: #0f62fe;
        text-decoration: none;
    }

.contact-form {
    flex: 2;
    min-width: 280px;
}

    .contact-form form {
        display: flex;
        flex-direction: column;
        gap: 1rem;
    }

.form-row input,
.form-row textarea {
    width: 100%;
    padding: 12px;
    border: 1px solid #ccc;
    border-radius: 6px;
    font-size: 1rem;
    box-sizing: border-box;
}

.form-row textarea {
    min-height: 120px;
    resize: vertical;
}

.submit-btn {
    background-color: #0f172a;
    color: white;
    padding: 12px 20px;
    border: none;
    border-radius: 6px;
    font-size: 1rem;
    cursor: pointer;
    transition: background 0.3s ease;
}

    .submit-btn:hover {
        background-color: #1e40af;
    }

@media (max-width: 768px) {
    .contact-grid {
        flex-direction: column;
    }

    .contact-container {
        padding: 20px;
    }

    .contact-info,
    .contact-form {
        width: 100%;
    }
}

/* Responsive Design for Job Search Index Page End */


.thank-you-section {
    padding: 60px 20px;
    background-color: #f0f4f8;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 70vh;
}

.thank-you-container {
    background-color: #ffffff;
    padding: 40px;
    border-radius: 10px;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
    max-width: 600px;
    text-align: center;
}

    .thank-you-container h1 {
        color: #0f172a;
        font-size: 2.2rem;
        margin-bottom: 20px;
    }

    .thank-you-container p {
        font-size: 1.1rem;
        color: #333;
        margin-bottom: 30px;
    }

.back-home-btn {
    background-color: #0f172a;
    color: #fff;
    padding: 12px 24px;
    border-radius: 6px;
    text-decoration: none;
    font-size: 1rem;
    transition: background-color 0.3s ease;
}

    .back-home-btn:hover {
        background-color: #1e40af;
    }

@media (max-width: 480px) {
    .thank-you-container {
        padding: 20px;
    }

        .thank-you-container h1 {
            font-size: 1.5rem;
        }

        .thank-you-container p {
            font-size: 1rem;
        }

    .back-home-btn {
        font-size: 0.95rem;
        padding: 10px 20px;
    }
}

.about-section {
    padding: 40px 20px;
    background-color: #f9fafb;
}

.about-container {
    max-width: 1000px;
    margin: auto;
    padding: 20px;
    background-color: #ffffff;
    border-radius: 10px;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.05);
}

    .about-container h2 {
        font-size: 2rem;
        text-align: center;
        margin-bottom: 20px;
        color: #0f172a;
    }

    .about-container .intro {
        text-align: center;
        margin-bottom: 30px;
        color: #333;
        font-size: 1.1rem;
    }

.aboutus-content {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.about-card {
    background-color: #f1f5f9;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
}

    .about-card h3 {
        color: #1e3a8a;
        margin-bottom: 10px;
        font-size: 1.4rem;
    }

    .about-card p {
        color: #333;
        line-height: 1.6;
        margin-bottom: 1rem;
    }

@media (max-width: 768px) {
    .about-container {
        padding: 15px;
    }

    .aboutus-content {
        gap: 20px;
    }

    .about-card h3 {
        font-size: 1.3rem;
    }

    .about-card p {
        font-size: 1rem;
    }
}

@media (max-width: 480px) {
    .about-container h2 {
        font-size: 1.5rem;
    }

    .about-container .intro {
        font-size: 1rem;
    }

    .about-card h3 {
        font-size: 1.2rem;
    }

    .about-card p {
        font-size: 0.95rem;
    }
}



.privacy-section {
    background-color: #f9fafb;
    padding: 40px 20px;
}

.privacy-container {
    max-width: 1000px;
    margin: auto;
    background: #ffffff;
    padding: 30px;
    border-radius: 10px;
    box-shadow: 0 10px 20px rgba(0,0,0,0.05);
}

    .privacy-container h2 {
        text-align: center;
        font-size: 2rem;
        color: #0f172a;
        margin-bottom: 10px;
    }

.updated-date {
    text-align: center;
    font-size: 0.95rem;
    color: #666;
    margin-bottom: 20px;
}

.intro {
    font-size: 1.1rem;
    color: #333;
    text-align: center;
    margin-bottom: 30px;
}

.privacy-list {
    margin-bottom: 30px;
    padding-left: 20px;
    font-size: 1rem;
    color: #1e293b;
}

.privacy-details h3 {
    color: #1e3a8a;
    font-size: 1.4rem;
    margin-top: 20px;
}

.privacy-details h4 {
    color: #0f172a;
    margin-top: 15px;
    font-size: 1.1rem;
}

.privacy-list-inner ul {
    padding-left: 1.5rem;
    list-style-type: disc;
}

.privacy-list-inner p {
    color: #333;
    line-height: 1.6;
}

@media (max-width: 768px) {
    .privacy-container {
        padding: 20px;
    }

    .privacy-details h3 {
        font-size: 1.25rem;
    }

    .privacy-details h4 {
        font-size: 1rem;
    }
}

@media (max-width: 480px) {
    .privacy-container h2 {
        font-size: 1.5rem;
    }

    .intro {
        font-size: 1rem;
    }

    .privacy-details h3 {
        font-size: 1.15rem;
    }

    .privacy-details h4 {
        font-size: 0.95rem;
    }

    .privacy-list {
        font-size: 0.95rem;
    }
}

.help-center-section {
    padding: 40px 20px;
    background-color: #f1f5f9;
}

.help-center-container {
    max-width: 950px;
    margin: auto;
    background: #ffffff;
    border-radius: 10px;
    padding: 30px;
    box-shadow: 0 8px 16px rgba(0,0,0,0.05);
}

    .help-center-container h1 {
        font-size: 2rem;
        color: #0f172a;
        margin-bottom: 15px;
        text-align: center;
    }

.intro {
    text-align: center;
    font-size: 1.1rem;
    color: #333;
    margin-bottom: 30px;
}

.help-category {
    margin-bottom: 30px;
}

    .help-category h3 {
        font-size: 1.3rem;
        color: #1e3a8a;
        margin-bottom: 10px;
    }

    .help-category ul {
        list-style-type: disc;
        padding-left: 1.5rem;
        color: #444;
        line-height: 1.6;
    }

    .help-category a {
        color: #0f62fe;
        text-decoration: underline;
    }

.support-note {
    text-align: center;
    font-size: 1rem;
    color: #0f172a;
    margin-top: 20px;
}

@media (max-width: 768px) {
    .help-center-container {
        padding: 20px;
    }

        .help-center-container h1 {
            font-size: 1.6rem;
        }
}

@media (max-width: 480px) {
    .help-category h3 {
        font-size: 1.15rem;
    }

    .help-category ul li {
        font-size: 0.95rem;
    }
}


.faq-help-section {
    padding: 40px 20px;
    background-color: #f8fafc;
}

.faq-help-container {
    max-width: 900px;
    margin: auto;
    background: #ffffff;
    border-radius: 10px;
    padding: 30px;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.05);
}

    .faq-help-container h1 {
        font-size: 1.8rem;
        color: #0f172a;
        margin-bottom: 20px;
        border-bottom: 1px solid #e2e8f0;
        padding-bottom: 10px;
    }

.faq-item {
    margin-bottom: 25px;
}

    .faq-item h3 {
        font-size: 1.2rem;
        color: #1e3a8a;
        margin-bottom: 8px;
    }

    .faq-item p {
        font-size: 1rem;
        color: #333;
        line-height: 1.6;
    }

    .faq-item a {
        color: #0f62fe;
        text-decoration: underline;
    }

@media (max-width: 768px) {
    .faq-help-container {
        padding: 20px;
    }

        .faq-help-container h1 {
            font-size: 1.5rem;
        }
}

@media (max-width: 480px) {
    .faq-item h3 {
        font-size: 1.1rem;
    }

    .faq-item p {
        font-size: 0.95rem;
    }
}


.login-body-cls {
    border-radius: 10px;
    overflow: hidden;
    padding: 1rem;
}

.login-header {
    background-color: #0f172a;
    color: white;
    padding: 1rem;
}

.login-toggle-wrapper {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-bottom: 20px;
}

.toggle-btn {
    background: #e5e7eb;
    border: none;
    padding: 10px 20px;
    font-size: 1rem;
    cursor: pointer;
    border-radius: 5px;
    transition: background 0.3s ease;
}

    .toggle-btn.active {
        background-color: #1e40af;
        color: white;
    }

.auth-form {
    max-width: 500px;
    margin: auto;
}

@media (max-width: 768px) {
    .modal-dialog {
        margin: 1rem;
    }

    .auth-form {
        width: 100%;
    }
}

@media (max-width: 480px) {
    .login-toggle-wrapper {
        flex-direction: column;
        gap: 8px;
    }

    .toggle-btn {
        width: 100%;
    }
}

.job-not-found-section {
    background-color: #f8fafc;
    padding: 50px 20px;
    min-height: 70vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

.job-not-found-container {
    background: #ffffff;
    border-radius: 10px;
    padding: 40px;
    max-width: 700px;
    width: 100%;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
    text-align: center;
}

    .job-not-found-container h1 {
        font-size: 2rem;
        color: #0f172a;
        margin-bottom: 20px;
    }

    .job-not-found-container .message {
        font-size: 1.1rem;
        color: #333;
        margin-bottom: 10px;
    }

    .job-not-found-container .info {
        font-size: 1rem;
        color: #555;
        margin-bottom: 30px;
    }

.roadmap-list {
    text-align: left;
    margin: 0 auto 30px auto;
    max-width: 500px;
    padding-left: 1.2rem;
    color: #334155;
}

    .roadmap-list li {
        margin-bottom: 10px;
        line-height: 1.6;
        font-size: 1rem;
    }

.job-actions .btn {
    padding: 10px 20px;
    font-size: 1rem;
    border-radius: 6px;
    text-decoration: none;
    display: inline-block;
    margin-top: 20px;
}

@media (max-width: 768px) {
    .job-not-found-container {
        padding: 30px 20px;
    }

    .roadmap-list li {
        font-size: 0.95rem;
    }

    .job-actions .btn {
        width: 100%;
    }
}

@media (max-width: 480px) {
    .job-not-found-container h1 {
        font-size: 1.6rem;
    }

    .job-not-found-container .message,
    .job-not-found-container .info {
        font-size: 0.95rem;
    }

    .roadmap-list {
        padding-left: 1rem;
    }
}

/*----------------- Tech Panel CSS -----------------------*/

.tech-panel-section {
    padding: 40px 20px;
    background-color: #f9fafb;
    min-height: 70vh;
    overflow-x: hidden;
    width: 100%;
    box-sizing: border-box;
}

.tech-panel-container {
    max-width: 1000px;
    margin: auto;
    background-color: #ffffff;
    border-radius: 10px;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.05);
    padding: 30px;
    overflow-x: hidden;
    box-sizing: border-box;
}

.tech-panel-content {
    color: #1f2937;
    font-size: 1rem;
    line-height: 1.8;
    overflow-wrap: break-word;
}

    .tech-panel-content h1,
    .tech-panel-content h2,
    .tech-panel-content h3 {
        color: #0f172a;
        margin-top: 1.5rem;
        margin-bottom: 0.5rem;
        word-wrap: break-word;
    }

    .tech-panel-content ul,
    .tech-panel-content ol {
        margin-left: 1.5rem;
        margin-bottom: 1.5rem;
        padding-left: 1.2rem;
        list-style-position: outside;
        word-wrap: break-word;
    }

    .tech-panel-content li {
        margin-bottom: 10px;
    }

.coming-soon {
    font-size: 1.8rem;
    text-align: center;
    color: #1e3a8a;
    margin-bottom: 10px;
}

.coming-note {
    text-align: center;
    color: #555;
    font-size: 1rem;
}

@media (max-width: 768px) {
    .tech-panel-container {
        padding: 20px;
    }

    .tech-panel-content {
        font-size: 0.95rem;
    }

        .tech-panel-content h1, .tech-panel-content h2 {
            font-size: 1.4rem;
        }
}

@media (max-width: 480px) {
    .tech-panel-content {
        font-size: 0.9rem;
    }

        .tech-panel-content h1, .tech-panel-content h2 {
            font-size: 1.2rem;
        }

        .tech-panel-content ul {
            padding-left: 1rem;
        }
}

.page-title {
    text-align: center;
    font-size: 2.5rem;
    color: #004d00;
    margin-bottom: 2rem;
}

.tips-container {
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
    justify-content: center;
    padding: 1rem;
}

.tip-step {
    flex: 1 1 300px;
    max-width: 600px;
    background-color: #f2fff4;
    border: 1px solid #cceccc;
    border-radius: 10px;
    padding: 1.5rem;
    box-shadow: 0 4px 8px rgba(0,0,0,0.05);
    transition: transform 0.3s ease;
}

    .tip-step:hover {
        transform: scale(1.02);
    }

    .tip-step h2 {
        color: #006600;
        margin-top: 1rem;
    }

    .tip-step img {
        max-width: 60px;
        margin-bottom: 1rem;
    }

    .tip-step ul {
        padding-left: 1.2rem;
        margin-top: 0.5rem;
    }

    .tip-step a {
        color: #006699;
        text-decoration: none;
    }

        .tip-step a:hover {
            text-decoration: underline;
        }

blockquote {
    background: #e6ffe6;
    border-left: 4px solid #33cc33;
    margin: 1rem 0;
    padding: 1rem;
    font-style: italic;
}

.back-link {
    display: block;
    text-align: center;
    font-weight: bold;
    margin-top: 3rem;
    color: #004400;
    text-decoration: none;
}

    .back-link:hover {
        text-decoration: underline;
    }

/* Media Query for Mobile Devices */
@media (max-width: 768px) {
    .tips-container {
        flex-direction: column;
        align-items: center;
    }

    .tip-step {
        width: 90%;
    }
}


.page-title {
    text-align: center;
    color: #004400;
    font-size: 2.5rem;
    margin-bottom: 2rem;
}

.resume-guide {
    max-width: 1000px;
    margin: auto;
    padding: 1rem;
}

.step-section {
    background-color: #f8fff8;
    border: 1px solid #cceccc;
    border-radius: 10px;
    padding: 1.5rem;
    margin-bottom: 1.5rem;
    box-shadow: 0 4px 8px rgba(0,0,0,0.04);
    transition: transform 0.3s ease;
}

    .step-section:hover {
        transform: translateY(-3px);
    }

    .step-section h2 {
        color: #006600;
        margin-bottom: 0.75rem;
    }

    .step-section ul {
        padding-left: 1.5rem;
        margin-top: 0.5rem;
    }

    .step-section li {
        margin-bottom: 0.5rem;
    }

    .step-section a {
        color: #0077cc;
        text-decoration: none;
    }

        .step-section a:hover {
            text-decoration: underline;
        }

blockquote {
    background: #e8ffe8;
    border-left: 4px solid #33cc33;
    margin: 1rem 0;
    padding: 1rem;
    font-style: italic;
}

.warning {
    background-color: #fff9f5;
    border-color: #f5c6cb;
}

.back-link {
    display: block;
    text-align: center;
    margin: 2rem 0;
    font-weight: bold;
    color: #004400;
    text-decoration: none;
}

    .back-link:hover {
        text-decoration: underline;
    }

/* Mobile Responsive */
@media (max-width: 768px) {
    .resume-guide {
        padding: 1rem;
    }

    .page-title {
        font-size: 2rem;
    }

    .step-section {
        padding: 1.2rem;
    }
}
.page-title {
    text-align: center;
    color: #004d00;
    font-size: 2.5rem;
    margin-bottom: 2rem;
    padding: 0 1rem;
}

.advice-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 2rem;
    padding: 0 2rem;
    max-width: 1200px;
    margin: auto;
}

.advice-card {
    background: #f7fff7;
    border: 1px solid #cceccc;
    border-radius: 12px;
    padding: 1.5rem;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    text-align: center;
}

    .advice-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 8px 20px rgba(0,0,0,0.1);
    }

    .advice-card img {
        width: 60px;
        height: 60px;
        margin-bottom: 1rem;
    }

    .advice-card h2 {
        color: #006600;
        font-size: 1.3rem;
        margin: 0.5rem 0;
    }

    .advice-card p {
        font-size: 1rem;
        color: #333;
        line-height: 1.5;
    }

.back-link {
    display: block;
    text-align: center;
    font-weight: bold;
    margin: 2rem auto;
    font-size: 1.1rem;
    color: #004400;
    text-decoration: none;
}

    .back-link:hover {
        text-decoration: underline;
    }

/* Mobile Adjustments */
@media (max-width: 768px) {
    .page-title {
        font-size: 2rem;
    }

    .advice-card {
        padding: 1.2rem;
    }

        .advice-card h2 {
            font-size: 1.15rem;
        }
}
.terms-wrapper {
    max-width: 900px;
    margin: 0 auto;
    padding: 2rem 1.5rem;
    background-color: #fdfdfd;
    color: #222;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    line-height: 1.7;
}

.terms-title {
    font-size: 2.5rem;
    text-align: center;
    color: #004400;
    margin-bottom: 1rem;
}

.updated-date {
    text-align: center;
    font-size: 0.95rem;
    color: #666;
    margin-bottom: 2rem;
}

.terms-wrapper section {
    margin-bottom: 2rem;
}

.terms-wrapper h2 {
    font-size: 1.5rem;
    color: #006600;
    margin-top: 1rem;
}

.terms-wrapper p,
.terms-wrapper ul {
    margin-top: 0.5rem;
}

.terms-wrapper ul {
    padding-left: 1.25rem;
    list-style: disc;
}

.terms-wrapper a {
    color: #0077cc;
    text-decoration: none;
}

    .terms-wrapper a:hover {
        text-decoration: underline;
    }

@media (max-width: 768px) {
    .terms-wrapper {
        padding: 1.5rem 1rem;
    }

    .terms-title {
        font-size: 2rem;
    }

    .terms-wrapper h2 {
        font-size: 1.25rem;
    }
}
.privacy-policy-section {
    background: #fff;
    padding: 2rem 1rem;
    color: #222;
    font-family: 'Segoe UI', sans-serif;
    line-height: 1.6;
    max-width: 900px;
    margin: auto;
}

.privacy-policy-container {
    padding: 1rem;
}

.privacy-policy-section h1 {
    font-size: 2.4rem;
    color: #004d00;
    text-align: center;
    margin-bottom: 1.2rem;
}

.privacy-policy-section h2 {
    color: #006600;
    font-size: 1.5rem;
    margin-top: 1.8rem;
}

.privacy-policy-section h4 {
    margin-top: 1rem;
    font-weight: 600;
    color: #333;
}

.privacy-policy-section ul {
    margin-left: 1.2rem;
    list-style: disc;
    padding-left: 1rem;
}

.privacy-policy-section p,
.privacy-policy-section li {
    font-size: 1rem;
    margin-bottom: 0.6rem;
}

.last-updated {
    text-align: center;
    font-size: 0.95rem;
    color: #666;
    margin-bottom: 1.5rem;
}

.privacy-policy-section a {
    color: #0077cc;
    text-decoration: none;
}

    .privacy-policy-section a:hover {
        text-decoration: underline;
    }

@media (max-width: 768px) {
    .privacy-policy-section h1 {
        font-size: 2rem;
    }

    .privacy-policy-section h2 {
        font-size: 1.25rem;
    }

    .privacy-policy-section p,
    .privacy-policy-section li {
        font-size: 0.95rem;
    }
}
.disclaimer-section, .cookie-policy-section {
    padding: 2rem 1rem;
    max-width: 900px;
    margin: auto;
    font-family: 'Segoe UI', sans-serif;
    color: #333;
    line-height: 1.6;
    background-color: #fff;
}

    .disclaimer-section h1,
    .cookie-policy-section h1 {
        font-size: 2.2rem;
        text-align: center;
        color: #004d00;
        margin-bottom: 1rem;
    }

    .disclaimer-section h2,
    .cookie-policy-section h2 {
        font-size: 1.4rem;
        color: #006600;
        margin-top: 1.5rem;
    }

.last-updated {
    text-align: center;
    font-size: 0.95rem;
    color: #777;
    margin-bottom: 1rem;
}

.disclaimer-section ul,
.cookie-policy-section ul {
    padding-left: 1.5rem;
    list-style: disc;
}

a {
    color: #0077cc;
    text-decoration: none;
}

    a:hover {
        text-decoration: underline;
    }

@media (max-width: 768px) {
    .disclaimer-section h1,
    .cookie-policy-section h1 {
        font-size: 1.8rem;
    }

    .disclaimer-section h2,
    .cookie-policy-section h2 {
        font-size: 1.2rem;
    }
}
.contact-section {
    padding: 2rem 1rem;
    background-color: #f9f9f9;
    font-family: 'Segoe UI', sans-serif;
}

.contact-container {
    max-width: 1000px;
    margin: auto;
    background: white;
    padding: 2rem;
    border-radius: 8px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
}

.contact-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
}

.contact-info,
.contact-form {
    flex: 1 1 400px;
}

.form-row {
    margin-bottom: 1.2rem;
}

input[type="text"],
input[type="email"],
input[type="tel"],
textarea {
    width: 100%;
    padding: 0.75rem;
    border-radius: 6px;
    border: 1px solid #ccc;
    font-size: 1rem;
}

.submit-btn {
    padding: 0.8rem 1.5rem;
    background-color: #006600;
    color: white;
    border: none;
    border-radius: 6px;
    font-size: 1rem;
    cursor: pointer;
}

    .submit-btn:hover {
        background-color: #004d00;
    }

.checkbox-wrapper {
    display: flex;
    align-items: flex-start;
    font-size: 0.95rem;
    color: #333;
}

    .checkbox-wrapper label {
        display: flex;
        gap: 0.6rem;
        align-items: flex-start;
        line-height: 1.4;
        flex-wrap: wrap;
    }

    .checkbox-wrapper input[type="checkbox"] {
        margin-top: 0.25rem;
        transform: scale(1.1);
    }

/* Responsive Design */
@media (max-width: 768px) {
    .contact-grid {
        flex-direction: column;
    }

    .checkbox-wrapper label {
        flex-direction: row;
        align-items: flex-start;
    }
}