/* =========================================================
   WILLSMARG CONTACT — LEVEL 5 PREMIUM PAGE
   File: wwwroot/css/Contact.css
========================================================= */

:root {
    --wsm-contact-bg: #f7f9fc;
    --wsm-contact-surface: #ffffff;
    --wsm-contact-ink: #0b1f3a;
    --wsm-contact-ink-2: #20324d;
    --wsm-contact-muted: #64748b;
    --wsm-contact-line: #dfe7ef;
    --wsm-contact-teal: #00a8c8;
    --wsm-contact-teal-2: #e5fbff;
    --wsm-contact-teal-dark: #007d95;
    --wsm-contact-shadow: 0 16px 42px rgba(11,31,58,.075);
    --wsm-contact-shadow-lg: 0 28px 72px rgba(11,31,58,.13);
    --wsm-contact-radius: 24px;
}

.wsm-contact-page {
    color: var(--wsm-contact-ink);
    background: var(--wsm-contact-bg);
    overflow-x: hidden;
}

.wsm-contact-shell {
    width: 100%;
    max-width: none;
    padding-left: 32px;
    padding-right: 32px;
    margin: 0 auto;
}

.wsm-contact-section {
    position: relative;
    padding: clamp(64px, 5vw, 96px) 0;
    border-bottom: 1px solid var(--wsm-contact-line);
}

.wsm-contact-head h2,
.wsm-contact-form-copy h2,
.wsm-contact-cta-card h2 {
    margin: 22px 0 14px;
    color: var(--wsm-contact-ink);
    font-size: clamp(2.25rem, 3.15vw, 4.25rem);
    line-height: 1.05;
    letter-spacing: -.055em;
    font-weight: 950;
}

.wsm-contact-head p,
.wsm-contact-form-copy p,
.wsm-contact-location-card p,
.wsm-contact-route-grid p,
.wsm-contact-cta-card p {
    color: var(--wsm-contact-muted);
    font-size: clamp(.95rem, .9vw, 1.04rem);
    line-height: 1.72;
    font-weight: 620;
}

.wsm-contact-head-center {
    max-width: 1120px;
    margin: 0 auto clamp(34px, 4vw, 54px);
    text-align: center;
}

    .wsm-contact-head-center p {
        max-width: 880px;
        margin-left: auto;
        margin-right: auto;
    }

/* =========================================================
   HERO
========================================================= */

.wsm-contact-hero {
    position: relative;
    padding: clamp(58px, 5vw, 92px) 0 clamp(60px, 5vw, 96px);
    background: linear-gradient(rgba(11,31,58,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(11,31,58,.035) 1px, transparent 1px), radial-gradient(circle at 8% 12%, rgba(0,168,200,.11), transparent 30%), radial-gradient(circle at 90% 18%, rgba(29,78,216,.07), transparent 28%), linear-gradient(135deg, #fbfdff 0%, #f4f8fb 52%, #eef5f8 100%);
    background-size: 46px 46px, 46px 46px, auto, auto, auto;
    border-bottom: 1px solid var(--wsm-contact-line);
    overflow: hidden;
}

    .wsm-contact-hero::before {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(110deg, transparent 0 48%, rgba(0,168,200,.075) 48% 49%, transparent 49% 100%);
        pointer-events: none;
    }

.wsm-contact-hero-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 1.02fr) minmax(560px, .88fr);
    gap: clamp(42px, 5vw, 92px);
    align-items: center;
}

.wsm-contact-hero-copy h1 {
    max-width: 1120px;
    margin: 26px 0 22px;
    color: var(--wsm-contact-ink);
    font-size: clamp(3rem, 5vw, 6.15rem);
    line-height: .99;
    letter-spacing: -.072em;
    font-weight: 950;
}

.wsm-contact-hero-copy p {
    max-width: 1040px;
    color: var(--wsm-contact-muted);
    font-size: clamp(1rem, 1.05vw, 1.15rem);
    line-height: 1.82;
    font-weight: 620;
}

.wsm-contact-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 30px;
}

.wsm-contact-proof-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 30px;
}

    .wsm-contact-proof-strip span {
        min-height: 40px;
        display: inline-flex;
        align-items: center;
        gap: 8px;
        padding: 0 14px;
        border-radius: 999px;
        color: var(--wsm-contact-ink);
        background: rgba(255,255,255,.88);
        border: 1px solid var(--wsm-contact-line);
        box-shadow: 0 8px 22px rgba(11,31,58,.045);
        font-size: .86rem;
        font-weight: 900;
    }

    .wsm-contact-proof-strip i {
        color: var(--wsm-contact-teal-dark);
    }

/* =========================================================
   SIGNATURE HERO BOARD
========================================================= */

.wsm-contact-system-card {
    position: relative;
    width: 100%;
    max-width: 850px;
    margin-left: auto;
    border: 1px solid var(--wsm-contact-line);
    border-radius: 30px;
    background: rgba(255,255,255,.96);
    box-shadow: var(--wsm-contact-shadow);
    overflow: hidden;
    animation: wsmContactBoardIn .85s cubic-bezier(.22,1,.36,1) both;
}

@keyframes wsmContactBoardIn {
    from {
        opacity: 0;
        transform: translateY(28px) scale(.975);
        filter: blur(8px);
    }

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

.wsm-contact-system-card::after {
    content: "";
    position: absolute;
    inset: 0;
    transform: translateX(-120%);
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.55), transparent);
    animation: wsmContactBoardSweep 1.1s ease .45s both;
    pointer-events: none;
}

@keyframes wsmContactBoardSweep {
    to {
        transform: translateX(120%);
    }
}

.wsm-contact-system-head {
    min-height: 60px;
    padding: 0 22px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    border-bottom: 1px solid var(--wsm-contact-line);
    background: #fbfdff;
}

    .wsm-contact-system-head span,
    .wsm-contact-system-head strong {
        text-transform: uppercase;
        letter-spacing: .11em;
        font-size: .74rem;
        font-weight: 950;
        color: #8a98aa;
    }

    .wsm-contact-system-head strong {
        color: var(--wsm-contact-teal-dark);
    }

.wsm-contact-system-body {
    position: relative;
    min-height: 485px;
    background: linear-gradient(rgba(11,31,58,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(11,31,58,.045) 1px, transparent 1px), #fff;
    background-size: 34px 34px;
    isolation: isolate;
}

    .wsm-contact-system-body::before {
        content: "";
        position: absolute;
        inset: 12%;
        border: 1px dashed rgba(0,168,200,.30);
        border-radius: 34px;
        z-index: 0;
    }

.wsm-contact-line-svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    pointer-events: none;
}

.wsm-contact-line {
    fill: none;
    stroke: rgba(0,168,200,.45);
    stroke-width: 2;
    stroke-linecap: round;
    stroke-dasharray: 640;
    stroke-dashoffset: 640;
    animation: wsmContactLineDraw 1.25s cubic-bezier(.22,1,.36,1) forwards;
}

.line-a {
    animation-delay: .55s;
}

.line-b {
    animation-delay: .72s;
}

.line-c {
    animation-delay: .88s;
}

.line-d {
    animation-delay: 1.04s;
}

@keyframes wsmContactLineDraw {
    to {
        stroke-dashoffset: 0;
    }
}

.wsm-contact-core {
    position: absolute;
    width: 245px;
    min-height: 152px;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    padding: 24px;
    border-radius: 20px;
    color: #fff;
    background: var(--wsm-contact-ink);
    box-shadow: 0 22px 56px rgba(11,31,58,.24);
    display: grid;
    place-items: center;
    text-align: center;
    z-index: 5;
    animation: wsmContactCoreIn .82s cubic-bezier(.22,1,.36,1) .35s both, wsmContactCoreFloat 6s ease-in-out 1.4s infinite;
}

@keyframes wsmContactCoreIn {
    from {
        opacity: 0;
        transform: translate(-50%, -44%) scale(.92);
        filter: blur(6px);
    }

    to {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1);
        filter: blur(0);
    }
}

@keyframes wsmContactCoreFloat {
    0%, 100% {
        transform: translate(-50%, -50%);
    }

    50% {
        transform: translate(-50%, calc(-50% - 6px));
    }
}

.wsm-contact-core small {
    color: #9ceeff;
    font-weight: 850;
    letter-spacing: .12em;
}

.wsm-contact-core strong {
    font-size: 1.24rem;
    line-height: 1.22;
    font-weight: 950;
}

.wsm-contact-core span {
    color: rgba(255,255,255,.74);
    font-size: .76rem;
    font-weight: 800;
}

.wsm-contact-node {
    position: absolute;
    width: 250px;
    min-height: 124px;
    padding: 24px 22px 20px;
    border-radius: 18px;
    border: 1px solid var(--wsm-contact-line);
    background: rgba(255,255,255,.98);
    box-shadow: 0 14px 36px rgba(11,31,58,.09);
    transition: transform .28s ease, border-color .28s ease, box-shadow .28s ease;
    overflow: hidden;
    z-index: 4;
    opacity: 0;
    animation: wsmContactNodeIn .75s cubic-bezier(.22,1,.36,1) forwards;
}

    .wsm-contact-node:hover {
        transform: translateY(-5px);
        border-color: rgba(0,168,200,.32);
        box-shadow: 0 22px 50px rgba(11,31,58,.12);
    }

    .wsm-contact-node i {
        position: absolute;
        left: 15px;
        top: 10px;
        color: rgba(0,168,200,.22);
        font-size: 2.9rem;
        line-height: 1;
        pointer-events: none;
    }

    .wsm-contact-node strong {
        position: relative;
        z-index: 1;
        display: block;
        padding-top: 28px;
        margin-bottom: 6px;
        color: var(--wsm-contact-ink);
        line-height: 1.22;
        font-weight: 950;
    }

    .wsm-contact-node span {
        position: relative;
        z-index: 1;
        display: block;
        color: var(--wsm-contact-muted);
        line-height: 1.45;
        font-size: .86rem;
        font-weight: 650;
    }

@keyframes wsmContactNodeIn {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.97);
        filter: blur(6px);
    }

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

.wsm-contact-node.node-a {
    left: 32px;
    top: 42px;
    animation-delay: .72s;
}

.wsm-contact-node.node-b {
    right: 32px;
    top: 70px;
    animation-delay: .88s;
}

.wsm-contact-node.node-c {
    left: 42px;
    bottom: 54px;
    animation-delay: 1.04s;
}

.wsm-contact-node.node-d {
    right: 42px;
    bottom: 44px;
    animation-delay: 1.2s;
}

.wsm-contact-system-foot {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border-top: 1px solid var(--wsm-contact-line);
}

    .wsm-contact-system-foot span {
        padding: 18px;
        border-right: 1px solid var(--wsm-contact-line);
        color: var(--wsm-contact-ink);
        font-size: .84rem;
        font-weight: 950;
    }

        .wsm-contact-system-foot span:last-child {
            border-right: 0;
        }

/* =========================================================
   LOCATION CARDS
========================================================= */

.wsm-contact-location-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
}

.wsm-contact-location-card,
.wsm-contact-route-grid article {
    position: relative;
    min-height: 310px;
    padding: 30px 28px;
    border-radius: var(--wsm-contact-radius);
    background: #fff;
    border: 1px solid var(--wsm-contact-line);
    box-shadow: 0 14px 36px rgba(11,31,58,.06);
    overflow: hidden;
    transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}

    .wsm-contact-location-card:hover,
    .wsm-contact-route-grid article:hover {
        transform: translateY(-7px);
        border-color: rgba(0,168,200,.34);
        box-shadow: 0 24px 58px rgba(11,31,58,.11);
    }

    .wsm-contact-location-card.is-featured {
        border-color: rgba(0,168,200,.42);
        background: linear-gradient(180deg, #fff, rgba(229,251,255,.35));
        box-shadow: 0 24px 62px rgba(0,168,200,.12);
    }

.wsm-contact-icon-title {
    position: relative;
    isolation: isolate;
    min-height: 92px;
    margin-bottom: 12px;
}

    .wsm-contact-icon-title i,
    .wsm-contact-route-grid i {
        position: absolute;
        left: 22px;
        top: 20px;
        z-index: 0;
        color: rgba(0,168,200,.18);
        font-size: 4.2rem;
        line-height: 1;
        pointer-events: none;
    }

    .wsm-contact-icon-title h3,
    .wsm-contact-route-grid h3 {
        position: relative;
        z-index: 1;
        padding-top: 58px;
        margin: 0 0 12px;
        color: var(--wsm-contact-ink);
        font-size: clamp(1.08rem, 1vw, 1.28rem);
        line-height: 1.25;
        letter-spacing: -.025em;
        font-weight: 950;
    }

.wsm-contact-location-card span {
    display: inline-flex;
    margin-top: 14px;
    color: var(--wsm-contact-teal-dark);
    letter-spacing: .13em;
    text-transform: uppercase;
    font-size: .76rem;
    font-weight: 950;
}

/* =========================================================
   FORM
========================================================= */

.wsm-contact-form-section {
    background: linear-gradient(rgba(11,31,58,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(11,31,58,.035) 1px, transparent 1px), radial-gradient(circle at 88% 12%, rgba(0,168,200,.075), transparent 28%), #f7f9fc;
    background-size: 46px 46px, 46px 46px, auto, auto;
}

.wsm-contact-form-grid {
    display: grid;
    grid-template-columns: minmax(0, .86fr) minmax(560px, 1.08fr);
    gap: clamp(34px, 5vw, 90px);
    align-items: start;
}

.wsm-contact-direct-list {
    display: grid;
    gap: 14px;
    margin-top: 30px;
}

    .wsm-contact-direct-list article {
        display: grid;
        grid-template-columns: 54px 1fr;
        gap: 14px;
        padding: 20px;
        border-radius: 20px;
        background: #fff;
        border: 1px solid var(--wsm-contact-line);
        box-shadow: 0 12px 30px rgba(11,31,58,.05);
    }

    .wsm-contact-direct-list i {
        width: 54px;
        height: 54px;
        display: grid;
        place-items: center;
        border-radius: 16px;
        color: var(--wsm-contact-teal-dark);
        background: var(--wsm-contact-teal-2);
        border: 1px solid rgba(0,168,200,.22);
    }

    .wsm-contact-direct-list strong {
        display: block;
        color: var(--wsm-contact-ink);
        font-weight: 950;
    }

    .wsm-contact-direct-list a,
    .wsm-contact-direct-list span {
        display: block;
        margin-top: 5px;
        color: var(--wsm-contact-muted);
        font-weight: 700;
    }

.wsm-contact-form-card {
    padding: 26px;
    border-radius: 30px;
    background: #fff;
    border: 1px solid var(--wsm-contact-line);
    box-shadow: var(--wsm-contact-shadow-lg);
}

.wsm-contact-form-head {
    min-height: 56px;
    display: flex;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 22px;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--wsm-contact-line);
}

    .wsm-contact-form-head span,
    .wsm-contact-form-head strong {
        text-transform: uppercase;
        letter-spacing: .11em;
        font-size: .74rem;
        font-weight: 950;
        color: #8a98aa;
    }

    .wsm-contact-form-head strong {
        color: var(--wsm-contact-teal-dark);
    }

.wsm-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.wsm-form-field-full {
    grid-column: 1 / -1;
}

.wsm-form-field label {
    display: block;
    margin-bottom: 8px;
    color: var(--wsm-contact-ink);
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .1em;
    font-weight: 950;
}

.wsm-form-field input,
.wsm-form-field select,
.wsm-form-field textarea {
    width: 100%;
    min-height: 52px;
    padding: 0 15px;
    border-radius: 14px;
    border: 1px solid var(--wsm-contact-line);
    color: var(--wsm-contact-ink);
    background: #fbfdff;
    font-weight: 750;
    outline: none;
    transition: border-color .22s ease, box-shadow .22s ease, background .22s ease;
}

.wsm-form-field textarea {
    min-height: 142px;
    padding-top: 15px;
    resize: vertical;
}

    .wsm-form-field input:focus,
    .wsm-form-field select:focus,
    .wsm-form-field textarea:focus {
        border-color: rgba(0,168,200,.48);
        box-shadow: 0 0 0 4px rgba(0,168,200,.10);
        background: #fff;
    }

.wsm-contact-form-card .wsm-btn {
    margin-top: 20px;
}

/* =========================================================
   ROUTES + CTA
========================================================= */

.wsm-contact-route-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 22px;
}

    .wsm-contact-route-grid article {
        min-height: 260px;
    }

    .wsm-contact-route-grid p {
        position: relative;
        z-index: 1;
    }

.wsm-contact-cta-section {
    background: #f7f9fc;
}

.wsm-contact-cta-card {
    max-width: 1500px;
    margin: 0 auto;
    padding: clamp(34px, 5vw, 74px);
    text-align: center;
    border-radius: 30px;
    background: linear-gradient(rgba(11,31,58,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(11,31,58,.035) 1px, transparent 1px), #fff;
    background-size: 34px 34px;
    border: 1px solid var(--wsm-contact-line);
    box-shadow: var(--wsm-contact-shadow-lg);
}

    .wsm-contact-cta-card p {
        max-width: 860px;
        margin: 0 auto 24px;
    }

/* =========================================================
   RESPONSIVE
========================================================= */

@media (min-width: 1200px) and (max-width: 1599.98px) {
    .wsm-contact-hero-grid {
        grid-template-columns: minmax(0, 1.05fr) minmax(500px, .78fr);
        gap: clamp(44px, 4vw, 72px);
    }

    .wsm-contact-system-card {
        max-width: 760px;
        margin-right: 18px;
    }

    .wsm-contact-system-body {
        min-height: 430px;
    }

    .wsm-contact-node {
        width: 220px;
        min-height: 118px;
        padding: 20px 18px 18px;
    }

        .wsm-contact-node i {
            font-size: 2.45rem;
            left: 14px;
            top: 9px;
        }

        .wsm-contact-node strong {
            padding-top: 24px;
            font-size: .98rem;
        }

        .wsm-contact-node span {
            font-size: .80rem;
            line-height: 1.42;
        }

    .wsm-contact-core {
        width: 205px;
        min-height: 132px;
        padding: 20px;
        border-radius: 18px;
    }

        .wsm-contact-core strong {
            font-size: 1.06rem;
        }

        .wsm-contact-core span {
            font-size: .70rem;
        }

    .wsm-contact-node.node-a {
        left: 28px;
        top: 38px;
    }

    .wsm-contact-node.node-b {
        right: 28px;
        top: 58px;
    }

    .wsm-contact-node.node-c {
        left: 34px;
        bottom: 48px;
    }

    .wsm-contact-node.node-d {
        right: 34px;
        bottom: 42px;
    }

    .wsm-contact-route-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1199.98px) {
    .wsm-contact-hero-grid,
    .wsm-contact-form-grid {
        grid-template-columns: 1fr;
        gap: 34px;
    }

    .wsm-contact-system-card {
        width: 100%;
        max-width: 820px;
        margin: 30px auto 0;
        border-radius: 24px;
        overflow: hidden;
    }

    .wsm-contact-system-body {
        position: relative;
        min-height: auto;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 16px;
        padding: 24px;
        align-items: stretch;
    }

        .wsm-contact-system-body::before,
        .wsm-contact-line-svg {
            display: none;
        }

    .wsm-contact-core {
        position: relative;
        inset: auto;
        transform: none;
        width: 100%;
        max-width: 440px;
        min-height: 145px;
        margin: 0 auto 10px;
        grid-column: 1 / -1;
        order: 1;
        z-index: 2;
        animation: none;
    }

    .wsm-contact-node,
    .wsm-contact-node.node-a,
    .wsm-contact-node.node-b,
    .wsm-contact-node.node-c,
    .wsm-contact-node.node-d {
        position: relative;
        inset: auto;
        transform: none;
        width: 100%;
        min-height: 128px;
        z-index: 1;
        opacity: 1;
        animation: none;
    }

        .wsm-contact-node.node-a {
            order: 2;
        }

        .wsm-contact-node.node-b {
            order: 3;
        }

        .wsm-contact-node.node-c {
            order: 4;
        }

        .wsm-contact-node.node-d {
            order: 5;
        }

    .wsm-contact-location-grid,
    .wsm-contact-route-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .wsm-contact-shell {
        padding-left: 18px;
        padding-right: 18px;
    }

    .wsm-contact-hero {
        padding-top: 48px;
        padding-bottom: 60px;
    }

    .wsm-contact-hero-copy h1 {
        font-size: clamp(2.35rem, 10vw, 3.45rem);
        line-height: 1.02;
        letter-spacing: -.055em;
    }

    .wsm-contact-hero-actions .wsm-btn {
        width: 100%;
    }

    .wsm-contact-proof-strip span {
        width: 100%;
        justify-content: center;
    }

    .wsm-contact-system-card {
        max-width: 100%;
        margin-top: 26px;
        border-radius: 22px;
    }

    .wsm-contact-system-head {
        min-height: auto;
        padding: 16px 18px;
        display: grid;
        grid-template-columns: 1fr;
        gap: 6px;
    }

    .wsm-contact-system-body {
        grid-template-columns: 1fr;
        gap: 14px;
        padding: 18px;
    }

    .wsm-contact-core {
        max-width: 100%;
        min-height: 132px;
        margin: 0;
    }

    .wsm-contact-system-foot,
    .wsm-contact-location-grid,
    .wsm-contact-route-grid,
    .wsm-form-grid {
        grid-template-columns: 1fr;
    }

        .wsm-contact-system-foot span {
            border-right: 0;
            border-bottom: 1px solid var(--wsm-contact-line);
        }

        .wsm-contact-location-card,
        .wsm-contact-route-grid article,
        .wsm-contact-form-card {
            min-height: auto;
            padding: 24px 22px;
            border-radius: 22px;
        }

    .wsm-contact-form-head {
        display: grid;
        grid-template-columns: 1fr;
        gap: 6px;
    }

    .wsm-contact-direct-list article {
        grid-template-columns: 1fr;
    }

    .wsm-contact-cta-card {
        border-radius: 24px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .wsm-contact-system-card,
    .wsm-contact-system-card::after,
    .wsm-contact-core,
    .wsm-contact-node,
    .wsm-contact-line {
        animation: none !important;
        transition-duration: .001ms !important;
    }

    .wsm-contact-node,
    .wsm-contact-system-card,
    .wsm-contact-core {
        opacity: 1 !important;
        filter: none !important;
    }
}


/* =========================================================
   CONTACT LEVEL 6 — GLOBAL PRESENCE VISUAL + SMART FORM
========================================================= */

.wsm-contact-presence-section {
    background: linear-gradient(rgba(11,31,58,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(11,31,58,.035) 1px, transparent 1px), radial-gradient(circle at 12% 18%, rgba(0,168,200,.08), transparent 30%), #f7f9fc;
    background-size: 46px 46px, 46px 46px, auto, auto;
}

.wsm-presence-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(390px, .7fr);
    gap: clamp(24px, 4vw, 54px);
    align-items: stretch;
}

.wsm-presence-map-card {
    position: relative;
    min-height: 620px;
    border-radius: 30px;
    background: rgba(255,255,255,.96);
    border: 1px solid var(--wsm-contact-line);
    box-shadow: var(--wsm-contact-shadow-lg);
    overflow: hidden;
}

.wsm-presence-map-head {
    min-height: 62px;
    padding: 0 22px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    border-bottom: 1px solid var(--wsm-contact-line);
    background: #fbfdff;
}

    .wsm-presence-map-head span,
    .wsm-presence-map-head strong {
        text-transform: uppercase;
        letter-spacing: .11em;
        font-size: .74rem;
        font-weight: 950;
        color: #8a98aa;
    }

    .wsm-presence-map-head strong {
        color: var(--wsm-contact-teal-dark);
    }

.wsm-presence-map {
    position: relative;
    min-height: 558px;
    padding: 28px;
    background: radial-gradient(circle at 25% 25%, rgba(0,168,200,.10), transparent 28%), radial-gradient(circle at 78% 62%, rgba(29,78,216,.08), transparent 30%), linear-gradient(rgba(11,31,58,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(11,31,58,.04) 1px, transparent 1px), #fff;
    background-size: auto, auto, 32px 32px, 32px 32px, auto;
}

    .wsm-presence-map svg {
        width: 100%;
        height: 100%;
        min-height: 500px;
        display: block;
    }

.wsm-map-land {
    fill: rgba(11,31,58,.045);
    stroke: rgba(11,31,58,.10);
    stroke-width: 1.4;
}

.wsm-presence-route {
    fill: none;
    stroke: url(#wsmPresenceLine);
    stroke-width: 3;
    stroke-linecap: round;
    stroke-dasharray: 820;
    stroke-dashoffset: 820;
    animation: wsmPresenceRoute 2.2s cubic-bezier(.22,1,.36,1) forwards;
}

.route-ny-hyd {
    animation-delay: .35s;
}

.route-va-hyd {
    animation-delay: .55s;
}

.route-va-ny {
    animation-delay: .75s;
}

@keyframes wsmPresenceRoute {
    to {
        stroke-dashoffset: 0;
    }
}

.wsm-map-node .pulse {
    fill: rgba(0,168,200,.16);
    stroke: rgba(0,168,200,.20);
    animation: wsmMapPulse 2.4s ease-in-out infinite;
}

.wsm-map-node .dot {
    fill: var(--wsm-contact-teal);
    stroke: #fff;
    stroke-width: 4;
}

.wsm-map-node text {
    fill: var(--wsm-contact-ink);
    font-size: 22px;
    font-weight: 950;
}

@keyframes wsmMapPulse {
    0%, 100% {
        opacity: .7;
        r: 20;
    }

    50% {
        opacity: .22;
        r: 31;
    }
}

.wsm-presence-tooltip {
    position: absolute;
    min-width: 180px;
    padding: 14px 16px;
    border-radius: 16px;
    background: rgba(255,255,255,.92);
    border: 1px solid rgba(223,231,239,.92);
    box-shadow: 0 18px 42px rgba(11,31,58,.12);
    backdrop-filter: blur(16px);
}

    .wsm-presence-tooltip strong {
        display: block;
        color: var(--wsm-contact-ink);
        font-size: .9rem;
        font-weight: 950;
    }

    .wsm-presence-tooltip span {
        display: block;
        margin-top: 4px;
        color: var(--wsm-contact-muted);
        font-size: .8rem;
        font-weight: 750;
    }

    .wsm-presence-tooltip.richmond {
        left: 13%;
        top: 48%;
    }

    .wsm-presence-tooltip.newyork {
        left: 22%;
        top: 26%;
    }

    .wsm-presence-tooltip.hyderabad {
        right: 7%;
        bottom: 24%;
    }

.wsm-presence-location-stack {
    display: grid;
    gap: 18px;
}

    .wsm-presence-location-stack .wsm-contact-location-card {
        min-height: auto;
    }

.wsm-form-field {
    position: relative;
}

.wsm-field-message {
    min-height: 18px;
    display: block;
    margin-top: 7px;
    color: #b45309;
    font-size: .78rem;
    line-height: 1.35;
    font-weight: 800;
}

.wsm-form-field.is-valid input,
.wsm-form-field.is-valid select,
.wsm-form-field.is-valid textarea {
    border-color: rgba(22,163,74,.45);
    box-shadow: 0 0 0 4px rgba(22,163,74,.09);
    background: #fff;
}

.wsm-form-field.is-valid::after {
    content: "\F26A";
    font-family: "bootstrap-icons";
    position: absolute;
    right: 14px;
    top: 42px;
    color: #16a34a;
    font-size: 1rem;
}

.wsm-form-field.is-invalid input,
.wsm-form-field.is-invalid select,
.wsm-form-field.is-invalid textarea {
    border-color: rgba(220,38,38,.45);
    box-shadow: 0 0 0 4px rgba(220,38,38,.08);
    background: #fff;
}

.wsm-form-field.is-invalid .wsm-field-message {
    color: #dc2626;
}

.wsm-form-status {
    min-height: 22px;
    margin-top: 18px;
    color: var(--wsm-contact-teal-dark);
    font-weight: 900;
}

.wsm-contact-form-card.is-submitting {
    pointer-events: none;
}

    .wsm-contact-form-card.is-submitting #wsmContactSubmit {
        opacity: .78;
    }

        .wsm-contact-form-card.is-submitting #wsmContactSubmit span::after {
            content: "…";
        }

@media (max-width: 1199.98px) {
    .wsm-presence-grid {
        grid-template-columns: 1fr;
    }

    .wsm-presence-location-stack {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .wsm-presence-map-card {
        min-height: auto;
    }
}

@media (max-width: 767.98px) {
    .wsm-presence-map-head {
        min-height: auto;
        padding: 16px 18px;
        display: grid;
        grid-template-columns: 1fr;
        gap: 6px;
    }

    .wsm-presence-map {
        min-height: 420px;
        padding: 16px;
    }

        .wsm-presence-map svg {
            min-height: 390px;
        }

    .wsm-map-node text {
        font-size: 18px;
    }

    .wsm-presence-tooltip {
        display: none;
    }

    .wsm-presence-location-stack {
        grid-template-columns: 1fr;
    }
}

@media (prefers-reduced-motion: reduce) {
    .wsm-presence-route,
    .wsm-map-node .pulse {
        animation: none !important;
    }

    .wsm-presence-route {
        stroke-dashoffset: 0 !important;
    }
}


/* =========================================================
   CONTACT LEVEL 7 — SMART MAP PREVIEW + ENTERPRISE FORM FIX
========================================================= */

.wsm-presence-map-card-smart {
    min-height: auto !important;
}

    .wsm-presence-map-card-smart .wsm-presence-map {
        min-height: 390px !important;
        padding: 18px 24px 8px !important;
    }

        .wsm-presence-map-card-smart .wsm-presence-map svg {
            min-height: 345px !important;
        }

.wsm-map-node {
    cursor: pointer;
}

    .wsm-map-node:hover .dot,
    .wsm-map-node:focus .dot {
        fill: #0b1f3a;
    }

.wsm-map-preview-panel {
    display: grid;
    grid-template-columns: minmax(260px, .72fr) minmax(320px, 1fr);
    gap: 18px;
    padding: 18px;
    border-top: 1px solid var(--wsm-contact-line);
    background: radial-gradient(circle at 8% 18%, rgba(0,168,200,.08), transparent 34%), #fbfdff;
}

.wsm-map-preview-copy {
    padding: 18px;
    border-radius: 20px;
    background: #fff;
    border: 1px solid var(--wsm-contact-line);
    box-shadow: 0 12px 30px rgba(11,31,58,.055);
}

    .wsm-map-preview-copy span {
        color: var(--wsm-contact-teal-dark);
        text-transform: uppercase;
        letter-spacing: .12em;
        font-size: .74rem;
        font-weight: 950;
    }

    .wsm-map-preview-copy strong {
        display: block;
        margin-top: 10px;
        color: var(--wsm-contact-ink);
        font-size: 1.35rem;
        line-height: 1.15;
        letter-spacing: -.03em;
        font-weight: 950;
    }

    .wsm-map-preview-copy p {
        margin: 12px 0 16px;
        color: var(--wsm-contact-muted);
        line-height: 1.62;
        font-weight: 700;
    }

    .wsm-map-preview-copy a {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        color: var(--wsm-contact-teal-dark);
        font-weight: 950;
        text-decoration: none;
    }

.wsm-map-preview-panel iframe {
    width: 100%;
    min-height: 230px;
    border: 0;
    border-radius: 20px;
    filter: saturate(.92) contrast(.96);
    box-shadow: 0 14px 34px rgba(11,31,58,.10);
}

.wsm-form-field label em {
    color: #dc2626;
    font-style: normal;
}

.wsm-form-field input,
.wsm-form-field select,
.wsm-form-field textarea {
    font-size: .98rem;
}

    .wsm-form-field select:required:invalid {
        color: #94a3b8;
    }

.wsm-textarea-meta {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-top: 7px;
}

    .wsm-textarea-meta .wsm-field-message {
        margin-top: 0;
    }

.wsm-char-count {
    flex: 0 0 auto;
    color: #8a98aa;
    font-size: .78rem;
    font-weight: 900;
}

    .wsm-char-count strong {
        color: var(--wsm-contact-teal-dark);
    }

.wsm-form-field.is-valid input,
.wsm-form-field.is-valid select,
.wsm-form-field.is-valid textarea {
    border-color: rgba(22,163,74,.48) !important;
}

.wsm-form-field.is-invalid input,
.wsm-form-field.is-invalid select,
.wsm-form-field.is-invalid textarea {
    border-color: rgba(220,38,38,.56) !important;
}

@media (max-width: 1199.98px) {
    .wsm-presence-map-card-smart .wsm-presence-map {
        min-height: 340px !important;
    }

        .wsm-presence-map-card-smart .wsm-presence-map svg {
            min-height: 310px !important;
        }

    .wsm-map-preview-panel {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767.98px) {
    .wsm-presence-map-card-smart .wsm-presence-map {
        min-height: 310px !important;
        padding: 10px 12px 0 !important;
    }

        .wsm-presence-map-card-smart .wsm-presence-map svg {
            min-height: 285px !important;
        }

    .wsm-map-preview-panel {
        padding: 14px;
    }

        .wsm-map-preview-panel iframe {
            min-height: 220px;
        }

    .wsm-textarea-meta {
        display: grid;
        grid-template-columns: 1fr;
    }
}


.wsm-form-alert {
    margin-bottom: 18px;
    padding: 16px 18px;
    border-radius: 16px;
    font-weight: 900;
    line-height: 1.5;
}

    .wsm-form-alert.success {
        color: #166534;
        background: #dcfce7;
        border: 1px solid #86efac;
    }

    .wsm-form-alert.error {
        color: #991b1b;
        background: #fee2e2;
        border: 1px solid #fecaca;
    }

/* =========================================================
   CONTACT SUCCESS POPUP
========================================================= */

.wsm-success-modal {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: grid;
    place-items: center;
    padding: 24px;
    background: rgba(11, 31, 58, .42);
    backdrop-filter: blur(12px);
}

.wsm-success-card {
    position: relative;
    width: min(560px, 100%);
    padding: 42px 34px 36px;
    border-radius: 28px;
    text-align: center;
    background: linear-gradient(rgba(11,31,58,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(11,31,58,.035) 1px, transparent 1px), #ffffff;
    background-size: 34px 34px;
    border: 1px solid rgba(223,231,239,.95);
    box-shadow: 0 32px 90px rgba(11,31,58,.22);
    animation: wsmSuccessIn .45s cubic-bezier(.22,1,.36,1) both;
}

@keyframes wsmSuccessIn {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.96);
        filter: blur(8px);
    }

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

.wsm-success-close {
    position: absolute;
    right: 18px;
    top: 16px;
    width: 42px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #dfe7ef;
    background: #fff;
    color: #0b1f3a;
    font-size: 1.45rem;
    line-height: 1;
    cursor: pointer;
}

.wsm-success-icon {
    width: 82px;
    height: 82px;
    margin: 0 auto 20px;
    display: grid;
    place-items: center;
    border-radius: 24px;
    color: #00a8c8;
    background: #e5fbff;
    border: 1px solid rgba(0,168,200,.28);
    box-shadow: 0 18px 42px rgba(0,168,200,.18);
}

    .wsm-success-icon i {
        font-size: 2.6rem;
    }

.wsm-success-card h3 {
    margin: 0 0 12px;
    color: #0b1f3a;
    font-size: clamp(1.6rem, 3vw, 2.15rem);
    font-weight: 950;
    letter-spacing: -.04em;
}

.wsm-success-card p {
    max-width: 440px;
    margin: 0 auto 24px;
    color: #64748b;
    font-size: 1rem;
    line-height: 1.7;
    font-weight: 700;
}