/* ======================================================
   CONTACT PAGE – MOBILEGADGET (HARD-LOCKED STYLES)
====================================================== */

.mg-contact-wrapper {
    max-width: 1250px;
    margin: 50px auto 90px;
    padding: 0 16px;
}

.mg-contact-header {
    text-align: center;
    margin-bottom: 40px;
}

.mg-contact-wrapper .mg-contact-header h1 {
    font-size: 34px;
    font-weight: 800;
    color: #0b1a39;
    margin: 0;
}

.mg-contact-wrapper .mg-contact-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 34px;
}

/* ======================================================
   GLASS CARD – darker premium
====================================================== */
.mg-contact-wrapper .glass-card {
    padding: 32px;
    border-radius: 26px;

    background: linear-gradient(
        135deg,
        rgba(205,220,255,0.30),
        rgba(175,195,255,0.34)
    );

    border: 1px solid rgba(255,255,255,0.22);
    backdrop-filter: blur(26px);
    box-shadow: 0 14px 36px rgba(0,0,0,0.08);
}

/* ======================================================
   HEADINGS
====================================================== */
.mg-contact-wrapper .mg-contact-info h3,
.mg-contact-wrapper .mg-contact-form h3 {
    margin: 0 0 20px;
    font-size: 20px;
    font-weight: 700;
    color: #0b1a39;
}

/* ======================================================
   LEFT SIDE – CONTACT INFO (BIG + NO LINK STYLING)
====================================================== */
.mg-contact-wrapper .mg-contact-info .mg-contact-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.mg-contact-wrapper .mg-contact-info .mg-contact-list li {
    font-size: 19px;              /* +25% */
    margin-bottom: 14px;
    color: #0b1a39;
    line-height: 1.6;
    font-weight: 500;
}

.mg-contact-wrapper .mg-contact-info .mg-contact-list strong {
    font-weight: 700;
}

/* 🔥 NUCLEAR OVERRIDE: kill blue/underline no matter what theme does */
.mg-contact-wrapper .mg-contact-info .mg-contact-list a,
.mg-contact-wrapper .mg-contact-info .mg-contact-list a:link,
.mg-contact-wrapper .mg-contact-info .mg-contact-list a:visited,
.mg-contact-wrapper .mg-contact-info .mg-contact-list a:hover,
.mg-contact-wrapper .mg-contact-info .mg-contact-list a:active,
.mg-contact-wrapper .mg-contact-info .mg-contact-list a:focus,
.mg-contact-wrapper .mg-contact-info .mg-contact-list a:focus-visible {
    color: #0b1a39 !important;
    text-decoration: none !important;
    text-decoration-color: transparent !important;
    border-bottom: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    outline: none !important;
}

/* In case your theme underlines via pseudo elements */
.mg-contact-wrapper .mg-contact-info .mg-contact-list a::before,
.mg-contact-wrapper .mg-contact-info .mg-contact-list a::after {
    content: none !important;
    display: none !important;
}

/* HOURS */
.mg-contact-wrapper .mg-contact-hours {
    margin-top: 18px;
    font-size: 17px;
    color: #253048;
    line-height: 1.6;
}

/* MAP */
.mg-contact-wrapper .mg-contact-map {
    margin-top: 24px;
}

.mg-contact-wrapper .mg-contact-map iframe {
    width: 100%;
    height: 260px;
    border-radius: 20px;
    border: none;
}

/* ======================================================
   RIGHT SIDE – FORM (HARD-LOCKED STACKED LAYOUT)
====================================================== */

/* Force the form itself to be a stable vertical stack */
.mg-contact-wrapper .mg-contact-form form.mg-form {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 18px !important;
    width: 100% !important;
}

/* Force inputs/textarea to full width and block */
.mg-contact-wrapper .mg-contact-form form.mg-form input,
.mg-contact-wrapper .mg-contact-form form.mg-form textarea {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;

    padding: 14px 18px !important;
    border-radius: 18px !important;
    border: 1px solid rgba(175,195,255,0.7) !important;
    background: rgba(255,255,255,0.96) !important;

    font-size: 16px !important;
    color: #0b1a39 !important;
    outline: none !important;
    margin: 0 !important;
}

/* Disable resize: user can’t drag it */
.mg-contact-wrapper .mg-contact-form form.mg-form textarea {
    min-height: 150px !important;
    resize: none !important;
}

/* Button */
.mg-contact-wrapper .mg-contact-form .mg-primary-btn {
    align-self: flex-start !important;
    padding: 12px 32px !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg,#238CFF,#5b7dff) !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    border: none !important;
    cursor: pointer !important;
    box-shadow: 0 4px 14px rgba(35,140,255,0.35) !important;
    transition: box-shadow 0.2s ease, filter 0.2s ease !important;
}

.mg-contact-wrapper .mg-contact-form .mg-primary-btn:hover {
    box-shadow: 0 8px 22px rgba(35,140,255,0.5) !important;
    filter: brightness(1.05) !important;
}

/* Success */
.mg-contact-wrapper .mg-form-success {
    margin-top: 18px;
    padding: 12px 20px;
    border-radius: 999px;
    background: rgba(60,180,120,0.18);
    color: #1e7c3f;
    font-size: 15px;
    font-weight: 600;
}

/* ======================================================
   MOBILE
====================================================== */
@media (max-width: 900px) {
    .mg-contact-wrapper .mg-contact-grid {
        grid-template-columns: 1fr;
    }
}