.contact-page-hero {

    padding:
        145px 0 90px;

    background:
        radial-gradient(circle at 80% 15%,
            rgba(99, 91, 255, .13),
            transparent 35%),
        linear-gradient(180deg,
            #ffffff,
            #f7f8ff);

}


.contact-hero-inner {

    max-width:
        900px;

    margin:
        auto;

    text-align:
        center;

}


.contact-hero-inner h1 {

    max-width:
        900px;

    margin:
        12px auto 20px;

    color:
        #171a2b;

    font-size:
        clamp(2.4rem, 5vw, 4.8rem);

    line-height:
        1.03;

    letter-spacing:
        -0.055em;

}


.contact-hero-text {

    max-width:
        700px;

    margin:
        auto;

    color:
        #6b7180;

    font-size:
        clamp(.9rem, 1.4vw, 1.05rem);

    line-height:
        1.8;

}


.contact-hero-actions {

    display:
        flex;

    justify-content:
        center;

    flex-wrap:
        wrap;

    gap:
        12px;

    margin-top:
        30px;

}


.contact-main-btn {

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    min-width:
        145px;

    padding:
        13px 22px;

    border-radius:
        10px;

    background:
        #635bff;

    color:
        #ffffff;

    font-size:
        .72rem;

    font-weight:
        800;

    text-decoration:
        none;

    transition:
        transform .2s ease,
        box-shadow .2s ease;

}


.contact-main-btn:hover {

    transform:
        translateY(-2px);

    box-shadow:
        0 12px 30px rgba(99, 91, 255, .2);

}


.contact-main-btn.secondary {

    background:
        #ffffff;

    border:
        1px solid rgba(30, 35, 65, .1);

    color:
        #24283a;

}



/* =========================================================
   SECTION HEADING
========================================================= */

.contact-section-heading {

    max-width:
        760px;

    margin-bottom:
        42px;

}


.contact-section-heading h2 {

    margin:
        10px 0 14px;

}



/* =========================================================
   CONTACT METHOD CARDS
========================================================= */

.contact-method-grid {

    display:
        grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap:
        16px;

}


.contact-method-card {

    min-width:
        0;

    padding:
        27px;

    border:
        1px solid rgba(30, 35, 65, .08);

    border-radius:
        20px;

    background:
        #ffffff;

    color:
        inherit;

    text-decoration:
        none;

    transition:
        transform .25s ease,
        box-shadow .25s ease;

}


.contact-method-card:hover {

    transform:
        translateY(-5px);

    box-shadow:
        0 20px 45px rgba(30, 35, 65, .07);

}


.contact-method-icon {

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    width:
        48px;

    height:
        48px;

    margin-bottom:
        20px;

    border-radius:
        13px;

    background:
        rgba(99, 91, 255, .08);

    color:
        #635bff;

}


.contact-method-label {

    display:
        block;

    margin-bottom:
        8px;

    color:
        #858a97;

    font-size:
        .57rem;

    font-weight:
        900;

    letter-spacing:
        .1em;

}


.contact-method-card h3 {

    margin:
        0 0 9px;

    font-size:
        1rem;

    line-height:
        1.35;

}


.contact-method-card p {

    min-height:
        52px;

    margin:
        0;

    color:
        #707683;

    font-size:
        .68rem;

    line-height:
        1.65;

}


.contact-method-link {

    display:
        inline-block;

    margin-top:
        19px;

    color:
        #635bff;

    font-size:
        .66rem;

    font-weight:
        850;

}



/* =========================================================
   FORM SECTION
========================================================= */

.contact-form-section {

    padding:
        95px 0;

    background:
        #f7f8fc;

}


.contact-form-layout {

    display:
        grid;

    grid-template-columns:
        minmax(0, .75fr) minmax(0, 1.25fr);

    gap:
        clamp(35px, 7vw, 85px);

    align-items:
        start;

}


.contact-form-info h2 {

    max-width:
        500px;

    margin:
        10px 0 18px;

    font-size:
        clamp(2rem, 4vw, 3.2rem);

    line-height:
        1.05;

    letter-spacing:
        -.045em;

}


.contact-form-info>.muted {

    max-width:
        550px;

    line-height:
        1.75;

}


.contact-form-points {

    margin-top:
        35px;

}


.contact-form-points>div {

    display:
        flex;

    gap:
        15px;

    padding:
        18px 0;

    border-bottom:
        1px solid rgba(30, 35, 65, .08);

}


.contact-form-points>div:first-child {

    border-top:
        1px solid rgba(30, 35, 65, .08);

}


.contact-form-points>div>span {

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    width:
        32px;

    height:
        32px;

    flex:
        0 0 auto;

    border-radius:
        9px;

    background:
        rgba(99, 91, 255, .08);

    color:
        #635bff;

    font-size:
        .58rem;

    font-weight:
        900;

}


.contact-form-points strong {

    display:
        block;

    margin-bottom:
        5px;

    font-size:
        .76rem;

}


.contact-form-points p {

    margin:
        0;

    color:
        #747a86;

    font-size:
        .66rem;

    line-height:
        1.55;

}



/* =========================================================
   FORM CARD
========================================================= */

.contact-form-card {

    padding:
        clamp(24px, 4vw, 40px);

    border:
        1px solid rgba(30, 35, 65, .08);

    border-radius:
        24px;

    background:
        #ffffff;

    box-shadow:
        0 20px 60px rgba(30, 35, 65, .05);

}


.form-row {

    display:
        grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap:
        15px;

}


.form-group {

    margin-bottom:
        18px;

}


.form-group label {

    display:
        block;

    margin-bottom:
        8px;

    color:
        #343847;

    font-size:
        .67rem;

    font-weight:
        800;

}


.form-group label span {

    margin-left:
        5px;

    color:
        #989daa;

    font-size:
        .56rem;

    font-weight:
        600;

}


.form-group input,
.form-group select,
.form-group textarea {

    width:
        100%;

    border:
        1px solid rgba(30, 35, 65, .11);

    border-radius:
        10px;

    background:
        #ffffff;

    color:
        #242837;

    font-family:
        inherit;

    font-size:
        .72rem;

    outline:
        none;

    transition:
        border-color .2s ease,
        box-shadow .2s ease;

}


.form-group input,
.form-group select {

    height:
        46px;

    padding:
        0 13px;

}


.form-group textarea {

    min-height:
        140px;

    padding:
        13px;

    resize:
        vertical;

    line-height:
        1.6;

}


.form-group input::placeholder,
.form-group textarea::placeholder {

    color:
        #a1a5af;

}


.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {

    border-color:
        rgba(99, 91, 255, .55);

    box-shadow:
        0 0 0 3px rgba(99, 91, 255, .08);

}


.contact-submit {

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        12px;

    width:
        100%;

    min-height:
        50px;

    margin-top:
        5px;

    padding:
        12px 18px;

    border:
        0;

    border-radius:
        10px;

    background:
        #635bff;

    color:
        #ffffff;

    cursor:
        pointer;

    font-family:
        inherit;

    font-size:
        .7rem;

    font-weight:
        850;

    transition:
        transform .2s ease,
        box-shadow .2s ease;

}


.contact-submit:hover {

    transform:
        translateY(-2px);

    box-shadow:
        0 12px 30px rgba(99, 91, 255, .2);

}


.contact-submit span {

    font-size:
        1rem;

}


.form-status {

    min-height:
        18px;

    margin:
        12px 0 0;

    font-size:
        .66rem;

    text-align:
        center;

}


.form-status.success {

    color:
        #23844b;

}


.form-status.error {

    color:
        #d44949;

}


.form-note {

    margin:
        10px 0 0;

    color:
        #9297a2;

    font-size:
        .57rem;

    line-height:
        1.55;

    text-align:
        center;

}



/* =========================================================
   MAP
========================================================= */

.contact-map-section {

    padding:
        95px 0;

}


.contact-map-heading {

    max-width:
        700px;

    margin-bottom:
        35px;

}


.contact-map-heading h2 {

    margin:
        10px 0 14px;

}


.contact-map-heading .muted {

    line-height:
        1.7;

}


.map-wrapper {

    position:
        relative;

    height:
        480px;

    overflow:
        hidden;

    border:
        1px solid rgba(30, 35, 65, .08);

    border-radius:
        25px;

    background:
        #eef0f5;

}


.map-wrapper iframe {

    width:
        100%;

    height:
        100%;

    border:
        0;

    filter:
        grayscale(.15);

}


.map-overlay-card {

    position:
        absolute;

    left:
        25px;

    bottom:
        25px;

    width:
        min(340px, calc(100% - 50px));

    padding:
        22px;

    border:
        1px solid rgba(255, 255, 255, .65);

    border-radius:
        17px;

    background:
        rgba(255, 255, 255, .94);

    box-shadow:
        0 15px 40px rgba(30, 35, 65, .14);

    backdrop-filter:
        blur(10px);

}


.map-overlay-label {

    display:
        block;

    margin-bottom:
        7px;

    color:
        #635bff;

    font-size:
        .55rem;

    font-weight:
        900;

    letter-spacing:
        .1em;

}


.map-overlay-card strong {

    display:
        block;

    font-size:
        .9rem;

}


.map-overlay-card p {

    margin:
        7px 0 12px;

    color:
        #6d7380;

    font-size:
        .66rem;

    line-height:
        1.55;

}


.map-overlay-card a {

    color:
        #635bff;

    font-size:
        .64rem;

    font-weight:
        850;

    text-decoration:
        none;

}



/* =========================================================
   FAQ
========================================================= */

.contact-faq {

    background:
        #f7f8fc;

}


.contact-faq details {

    margin-bottom:
        10px;

    padding:
        20px;

    border:
        1px solid rgba(30, 35, 65, .08);

    border-radius:
        13px;

    background:
        #ffffff;

}


.contact-faq summary {

    cursor:
        pointer;

    list-style:
        none;

    font-size:
        .78rem;

    font-weight:
        800;

}


.contact-faq summary::-webkit-details-marker {

    display:
        none;

}


.contact-faq summary::after {

    content:
        "+";

    float:
        right;

    color:
        #635bff;

    font-size:
        1rem;

}


.contact-faq details[open] summary::after {

    content:
        "−";

}


.contact-faq details p {

    max-width:
        800px;

    margin:
        13px 0 0;

    color:
        #707682;

    font-size:
        .68rem;

    line-height:
        1.7;

}



/* =========================================================
   FINAL CTA
========================================================= */

.contact-final-cta {

    padding:
        90px 0;

    background:
        linear-gradient(135deg,
            #171a2b,
            #292c4d);

    color:
        #ffffff;

}


.contact-final-inner {

    max-width:
        800px;

    margin:
        auto;

    text-align:
        center;

}


.contact-final-inner h2 {

    margin:
        10px 0 14px;

    font-size:
        clamp(2rem, 4vw, 3.5rem);

    line-height:
        1.05;

    letter-spacing:
        -.045em;

}


.contact-final-inner>p:not(.eyebrow) {

    margin:
        0;

    color:
        #c8cbd8;

}


.contact-final-actions {

    display:
        flex;

    justify-content:
        center;

    flex-wrap:
        wrap;

    gap:
        12px;

    margin-top:
        28px;

}


.contact-final-btn {

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    min-width:
        140px;

    padding:
        13px 22px;

    border-radius:
        10px;

    background:
        #635bff;

    color:
        #ffffff;

    font-size:
        .68rem;

    font-weight:
        850;

    text-decoration:
        none;

}


.contact-final-btn.outline {

    border:
        1px solid rgba(255, 255, 255, .18);

    background:
        rgba(255, 255, 255, .07);

}



/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1050px) {

    .contact-method-grid {

        grid-template-columns:
            repeat(2, minmax(0, 1fr));

    }


    .contact-form-layout {

        grid-template-columns:
            1fr;

    }

}



/* =========================================================
   800px
========================================================= */

@media (max-width: 800px) {

    .contact-page-hero {

        padding:
            120px 0 70px;

    }


    .map-wrapper {

        height:
            430px;

    }

}



/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    .contact-page-hero {

        padding:
            90px 0 60px;

    }


    .contact-hero-inner h1 {

        font-size:
            2.25rem;

    }


    .contact-hero-text {

        font-size:
            .84rem;

    }


    .contact-hero-actions {

        flex-direction:
            column;

    }


    .contact-main-btn {

        width:
            100%;

    }


    .contact-method-grid {

        grid-template-columns:
            1fr;

    }


    .contact-method-card {

        padding:
            23px;

    }


    .contact-method-card p {

        min-height:
            auto;

    }


    .contact-form-section,
    .contact-map-section {

        padding:
            65px 0;

    }


    .form-row {

        grid-template-columns:
            1fr;

        gap:
            0;

    }


    .contact-form-card {

        padding:
            21px;

        border-radius:
            18px;

    }


    .map-wrapper {

        height:
            420px;

        border-radius:
            18px;

    }


    .map-overlay-card {

        left:
            15px;

        right:
            15px;

        bottom:
            15px;

        width:
            auto;

    }


    .contact-final-cta {

        padding:
            65px 0;

    }


    .contact-final-actions {

        flex-direction:
            column;

    }


    .contact-final-btn {

        width:
            100%;

    }

}



/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 400px) {

    .contact-hero-inner h1 {

        font-size:
            2rem;

    }


    .contact-form-card {

        padding:
            17px;

    }


    .contact-method-card {

        padding:
            20px;

    }


    .map-wrapper {

        height:
            400px;

    }

}



/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {

        transition:
            none !important;

        animation:
            none !important;

    }

}

/* =========================================================
   RESPONSIVE TYPOGRAPHY + FORM POLISH
   Existing layout/design preserved
========================================================= */

.contact-page-hero,
.contact-methods,
.contact-form-section,
.contact-map-section,
.contact-faq,
.contact-final-cta {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

.contact-hero-inner h1 {
    font-size: clamp(2.15rem, 5vw, 4.8rem);
    line-height: 1.06;
}

.contact-hero-text {
    font-size: clamp(.95rem, 1.35vw, 1.08rem);
    line-height: 1.75;
}

.contact-main-btn,
.contact-final-btn {
    font-size: clamp(.82rem, 1vw, .95rem);
    line-height: 1.2;
}

.contact-section-heading h2,
.contact-map-heading h2 {
    font-size: clamp(1.8rem, 3.4vw, 2.8rem);
    line-height: 1.12;
}

.contact-method-label,
.form-group label,
.form-group label span,
.contact-form-points>div>span,
.map-overlay-label {
    font-size: clamp(.68rem, .75vw, .78rem);
}

.contact-method-card h3 {
    font-size: clamp(1rem, 1.3vw, 1.18rem);
    line-height: 1.4;
}

.contact-method-card p {
    font-size: clamp(.78rem, .9vw, .9rem);
    line-height: 1.65;
}

.contact-method-link {
    font-size: clamp(.75rem, .85vw, .86rem);
    line-height: 1.4;
}

.contact-form-info h2 {
    font-size: clamp(1.9rem, 4vw, 3.2rem);
    line-height: 1.08;
}

.contact-form-info>.muted {
    font-size: clamp(.88rem, 1.1vw, 1rem);
    line-height: 1.75;
}

.contact-form-points strong {
    font-size: clamp(.82rem, .95vw, .92rem);
    line-height: 1.45;
}

.contact-form-points p {
    font-size: clamp(.76rem, .88vw, .88rem);
    line-height: 1.6;
}

.form-group label {
    font-size: clamp(.76rem, .9vw, .88rem);
    line-height: 1.4;
}

.form-group label span {
    font-size: clamp(.66rem, .75vw, .76rem);
}

.form-group input,
.form-group select,
.form-group textarea {
    font-size: clamp(.88rem, 1vw, .98rem);
    line-height: 1.45;
}

.form-group input,
.form-group select {
    height: 50px;
    padding-left: 14px;
    padding-right: 14px;
}

.form-group textarea {
    min-height: 150px;
    line-height: 1.6;
    padding-left: 14px;
    padding-right: 14px;
}

.form-group input::placeholder,
.form-group textarea::placeholder {
    font-size: clamp(.82rem, .95vw, .92rem);
}

.contact-submit {
    min-height: 52px;
    font-size: clamp(.84rem, .95vw, .95rem);
    line-height: 1.3;
}

.form-status {
    font-size: clamp(.76rem, .85vw, .86rem);
    line-height: 1.5;
}

.form-note {
    font-size: clamp(.68rem, .8vw, .78rem);
    line-height: 1.55;
}

.contact-map-heading .muted {
    font-size: clamp(.86rem, 1vw, .98rem);
}

.map-overlay-card strong {
    font-size: clamp(.95rem, 1.1vw, 1.08rem);
}

.map-overlay-card p {
    font-size: clamp(.76rem, .88vw, .88rem);
    line-height: 1.6;
}

.map-overlay-card a {
    font-size: clamp(.74rem, .85vw, .84rem);
}

.contact-faq summary {
    font-size: clamp(.88rem, 1vw, 1rem);
    line-height: 1.5;
}

.contact-faq details p {
    font-size: clamp(.8rem, .95vw, .92rem);
    line-height: 1.7;
}

.contact-final-inner h2 {
    font-size: clamp(1.9rem, 4vw, 3.5rem);
    line-height: 1.08;
}

.contact-final-inner>p:not(.eyebrow) {
    font-size: clamp(.88rem, 1.1vw, 1rem);
    line-height: 1.7;
}

@media(max-width:800px) {
    .contact-hero-inner h1 {
        font-size: clamp(2rem, 7vw, 3.2rem);
    }

    .contact-hero-text {
        font-size: .95rem;
    }

    .contact-section-heading h2,
    .contact-map-heading h2 {
        font-size: clamp(1.75rem, 5vw, 2.4rem);
    }

    .contact-form-info h2 {
        font-size: clamp(1.85rem, 6vw, 2.8rem);
    }

    .contact-method-card h3 {
        font-size: 1.05rem;
    }

    .contact-method-card p {
        font-size: .82rem;
    }

    .form-group input,
    .form-group select,
    .form-group textarea {
        font-size: .92rem;
    }
}

@media(max-width:600px) {
    .contact-page-hero {
        padding: 90px 0 60px;
    }

    .contact-hero-inner h1 {
        font-size: clamp(2rem, 9vw, 2.55rem);
        line-height: 1.08;
        letter-spacing: -.04em;
    }

    .contact-hero-text {
        font-size: .94rem;
        line-height: 1.7;
    }

    .contact-section-heading h2,
    .contact-map-heading h2 {
        font-size: clamp(1.7rem, 7vw, 2.15rem);
        line-height: 1.15;
    }

    .contact-method-card {
        padding: 22px;
    }

    .contact-method-label {
        font-size: .7rem;
    }

    .contact-method-card h3 {
        font-size: 1.05rem;
    }

    .contact-method-card p {
        font-size: .84rem;
        line-height: 1.65;
    }

    .contact-method-link {
        font-size: .78rem;
    }

    .contact-form-info h2 {
        font-size: clamp(1.8rem, 8vw, 2.35rem);
        line-height: 1.1;
    }

    .contact-form-info>.muted {
        font-size: .9rem;
    }

    .contact-form-points>div {
        gap: 12px;
    }

    .contact-form-points strong {
        font-size: .84rem;
    }

    .contact-form-points p {
        font-size: .78rem;
    }

    .contact-form-card {
        padding: 21px;
    }

    .form-group {
        margin-bottom: 17px;
    }

    .form-group label {
        font-size: .8rem;
        margin-bottom: 7px;
    }

    .form-group label span {
        font-size: .68rem;
    }

    .form-group input,
    .form-group select {
        height: 50px;
        font-size: .92rem;
    }

    .form-group textarea {
        min-height: 145px;
        font-size: .92rem;
    }

    .form-group input::placeholder,
    .form-group textarea::placeholder {
        font-size: .84rem;
    }

    .contact-submit {
        min-height: 52px;
        font-size: .86rem;
    }

    .form-status {
        font-size: .78rem;
    }

    .form-note {
        font-size: .7rem;
    }

    .contact-faq summary {
        font-size: .9rem;
        padding-right: 5px;
    }

    .contact-faq details p {
        font-size: .82rem;
    }

    .contact-final-inner h2 {
        font-size: clamp(1.85rem, 8vw, 2.4rem);
    }

    .contact-final-inner>p:not(.eyebrow) {
        font-size: .9rem;
    }
}

@media(max-width:400px) {
    .contact-hero-inner h1 {
        font-size: 1.95rem;
    }

    .contact-hero-text {
        font-size: .9rem;
    }

    .contact-form-card {
        padding: 17px;
    }

    .form-group input,
    .form-group select {
        height: 48px;
        font-size: .9rem;
    }

    .form-group textarea {
        min-height: 135px;
        font-size: .9rem;
    }

    .contact-submit {
        min-height: 50px;
        font-size: .82rem;
    }

    .contact-faq summary {
        font-size: .86rem;
    }

    .contact-faq details p {
        font-size: .78rem;
    }
}

@media(max-width:340px) {
    .contact-hero-inner h1 {
        font-size: 1.78rem;
    }

    .contact-hero-text {
        font-size: .86rem;
    }

    .contact-form-card {
        padding: 15px;
    }

    .form-group input,
    .form-group select,
    .form-group textarea {
        font-size: .86rem;
    }

    .contact-submit {
        font-size: .78rem;
    }
}