/* MindMatch Search Widget — v1.1.0 */

.mms-widget,
.mms-widget * {
        box-sizing: border-box;
}

/* ── Main shell ── */
.mms-widget {
        position: relative;
        isolation: isolate;
        overflow: hidden;
        width: min(1500px, calc(100% - 48px));
        max-width: 1500px;
        margin: 20px auto;
        padding: 44px 54px;
        background:
                linear-gradient(135deg, rgba(255,255,255,.34), transparent 42%),
                linear-gradient(145deg, #e9fafa 0%, #d3f2f3 50%, #c5eaec 100%);
        border: 1px solid rgba(82, 178, 182, .22);
        border-radius: 30px;
        box-shadow: 0 20px 55px rgba(24, 82, 85, .14);
        color: #183f40;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
        opacity: 0;
        transform: translateY(24px) scale(.985);
        animation: mms-enter .72s cubic-bezier(.22,.8,.25,1) .08s forwards;
}

.mms-widget--wide {
        display: grid;
        grid-template-columns: 260px minmax(0, 1fr);
        align-items: center;
        gap: clamp(42px, 6vw, 80px);
        text-align: left;
}

.mms-widget--card {
        display: block;
        width: min(430px, calc(100% - 24px));
        padding: 40px 34px 34px;
        text-align: center;
}

.mms-widget--minimal {
        background: #fff;
        border: 2px solid #c0e8ea;
}

@keyframes mms-enter {
        to { opacity: 1; transform: translateY(0) scale(1); }
}

/* ── Animated background ── */
.mms-orb {
        position: absolute;
        z-index: -1;
        border-radius: 50%;
        pointer-events: none;
        filter: blur(2px);
}

.mms-orb--1 {
        width: 280px;
        height: 280px;
        top: -110px;
        right: -80px;
        background: radial-gradient(circle, rgba(43,181,186,.25), rgba(43,181,186,0) 70%);
        animation: mms-float1 7s ease-in-out infinite;
}

.mms-orb--2 {
        width: 220px;
        height: 220px;
        bottom: -100px;
        left: 17%;
        background: radial-gradient(circle, rgba(26,68,68,.13), rgba(26,68,68,0) 72%);
        animation: mms-float2 9s ease-in-out infinite 1s;
}

.mms-orb--3 {
        width: 150px;
        height: 150px;
        top: 20%;
        left: 47%;
        background: radial-gradient(circle, rgba(255,255,255,.6), rgba(255,255,255,0) 70%);
        animation: mms-float3 6s ease-in-out infinite .5s;
}

@keyframes mms-float1 {
        0%, 100% { transform: translate(0, 0) scale(1); }
        50% { transform: translate(-24px, 24px) scale(1.12); }
}

@keyframes mms-float2 {
        0%, 100% { transform: translate(0, 0) scale(1); }
        50% { transform: translate(22px, -18px) scale(.93); }
}

@keyframes mms-float3 {
        0%, 100% { transform: translateY(0); opacity: .7; }
        50% { transform: translateY(-20px); opacity: 1; }
}

/* ── Logo ── */
.mms-ring-wrap {
        position: relative;
        z-index: 2;
        width: 210px;
        height: 210px;
        margin: 0 auto;
        display: grid;
        place-items: center;
        animation: mms-logo-bob 5s ease-in-out infinite;
}

.mms-logo-halo {
        position: absolute;
        inset: 8px;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(255,255,255,.82) 0%, rgba(90,205,202,.2) 54%, transparent 72%);
        box-shadow: 0 0 42px rgba(43,181,186,.22);
        animation: mms-halo 3.2s ease-in-out infinite;
}

.mms-logo-spin {
        position: relative;
        z-index: 1;
        display: block;
        width: 190px;
        height: 190px;
        object-fit: contain;
        filter: drop-shadow(0 9px 16px rgba(24, 82, 85, .12));
}

.mms-logo-spin--rotate {
        animation: mms-logo-rotate 14s linear infinite;
}

@keyframes mms-logo-rotate {
        from { transform: rotate(0deg); }
        to { transform: rotate(360deg); }
}

@keyframes mms-logo-bob {
        0%, 100% { translate: 0 0; }
        50% { translate: 0 -7px; }
}

@keyframes mms-halo {
        0%, 100% { transform: scale(.96); opacity: .72; }
        50% { transform: scale(1.06); opacity: 1; }
}

/* ── Text ── */
.mms-content {
        position: relative;
        z-index: 2;
        min-width: 0;
}

.mms-content > * {
        opacity: 0;
        transform: translateY(10px);
        animation: mms-copy-in .5s ease forwards;
}

.mms-content > :nth-child(1) { animation-delay: .22s; }
.mms-content > :nth-child(2) { animation-delay: .31s; }
.mms-content > :nth-child(3) { animation-delay: .40s; }
.mms-content > :nth-child(4) { animation-delay: .49s; }
.mms-content > :nth-child(5) { animation-delay: .58s; }

@keyframes mms-copy-in {
        to { opacity: 1; transform: translateY(0); }
}

.mms-title {
        max-width: 760px;
        margin: 0 0 11px !important;
        padding: 0 !important;
        border: 0 !important;
        color: #163f40 !important;
        font-size: clamp(28px, 3vw, 40px) !important;
        font-weight: 800 !important;
        line-height: 1.12 !important;
        letter-spacing: -.025em;
}

.mms-subtitle {
        max-width: 720px;
        margin: 0 0 22px !important;
        color: #365f60 !important;
        font-size: clamp(17px, 1.55vw, 20px) !important;
        line-height: 1.55 !important;
}

.mms-issue-label {
        margin: 0 0 11px !important;
        color: #4d7475 !important;
        font-size: 18px !important;
        line-height: 1.5 !important;
}

.mms-issue-word {
        display: inline-block;
        min-width: 130px;
        margin-left: 5px;
        color: #163f40;
        font-size: 20px;
        font-weight: 800;
        transition: opacity .3s, transform .3s, filter .3s;
}

.mms-issue-word.mms-fade-out {
        opacity: 0;
        transform: translateY(-9px) scale(.97);
        filter: blur(2px);
}

.mms-issue-word.mms-fade-in {
        opacity: 0;
        transform: translateY(9px) scale(.97);
        filter: blur(2px);
}

.mms-meta {
        margin: 0 0 24px !important;
        color: #60898a !important;
        font-size: 15px !important;
        font-weight: 500;
        line-height: 1.5 !important;
        letter-spacing: .01em;
}

/* ── Main button ── */
.mms-btn {
        position: relative;
        overflow: hidden;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        width: min(100%, 370px);
        min-height: 56px;
        padding: 14px 25px !important;
        border: 0;
        border-radius: 999px;
        background: #174b4b;
        box-shadow: 0 8px 24px rgba(23,75,75,.25);
        color: #fff !important;
        font-size: 17px !important;
        font-weight: 800 !important;
        line-height: 1.2 !important;
        text-decoration: none !important;
        text-transform: uppercase;
        letter-spacing: .01em;
        transition: transform .2s ease, background .22s ease, box-shadow .22s ease;
}

.mms-btn::before {
        content: "";
        position: absolute;
        top: -50%;
        left: -45%;
        width: 32%;
        height: 200%;
        background: linear-gradient(90deg, transparent, rgba(255,255,255,.28), transparent);
        transform: skewX(-20deg);
        animation: mms-button-shine 4.6s ease-in-out infinite 1.2s;
}

.mms-btn:hover,
.mms-btn:focus-visible {
        background: #229ba0;
        transform: translateY(-3px);
        box-shadow: 0 12px 31px rgba(34,155,160,.34);
        color: #fff !important;
}

.mms-btn:focus-visible {
        outline: 3px solid rgba(23,75,75,.22);
        outline-offset: 4px;
}

.mms-btn:active {
        transform: translateY(0);
}

.mms-btn__arrow {
        width: 20px;
        height: 20px;
        flex: 0 0 20px;
        transition: transform .2s ease;
}

.mms-btn:hover .mms-btn__arrow,
.mms-btn:focus-visible .mms-btn__arrow {
        transform: translateX(5px);
}

@keyframes mms-button-shine {
        0%, 68% { left: -45%; opacity: 0; }
        72% { opacity: 1; }
        90%, 100% { left: 125%; opacity: 0; }
}

.mms-ripple {
        position: absolute;
        border-radius: 50%;
        background: rgba(255,255,255,.34);
        transform: scale(0);
        animation: mms-ripple-anim .55s linear;
        pointer-events: none;
}

@keyframes mms-ripple-anim {
        to { transform: scale(4); opacity: 0; }
}

/* ── Card layout overrides ── */
.mms-widget--card .mms-ring-wrap {
        margin: 0 auto 22px;
}

.mms-widget--card .mms-title,
.mms-widget--card .mms-subtitle {
        margin-left: auto !important;
        margin-right: auto !important;
}

/* ── Tablet ── */
@media (max-width: 820px) {
        .mms-widget {
                width: min(720px, calc(100% - 20px));
                padding: 38px 30px;
        }

        .mms-widget--wide {
                grid-template-columns: 180px minmax(0, 1fr);
                gap: 30px;
        }

        .mms-ring-wrap {
                width: 170px;
                height: 170px;
        }

        .mms-logo-spin {
                width: 155px;
                height: 155px;
        }

        .mms-title {
                font-size: 29px !important;
        }
}

/* ── Phone ── */
@media (max-width: 600px) {
        .mms-widget,
        .mms-widget--wide,
        .mms-widget--card {
                display: block;
                width: calc(100% - 16px);
                max-width: none;
                margin: 12px auto;
                padding: 30px 20px 26px;
                border-radius: 26px;
                text-align: center;
        }

        .mms-widget--wide .mms-ring-wrap,
        .mms-ring-wrap {
                width: 158px;
                height: 158px;
                margin: 0 auto 18px;
        }

        .mms-logo-spin {
                width: 146px;
                height: 146px;
        }

        .mms-logo-halo {
                inset: 5px;
        }

        .mms-title {
                margin-bottom: 10px !important;
                font-size: 24px !important;
                line-height: 1.18 !important;
        }

        .mms-subtitle {
                margin-bottom: 19px !important;
                font-size: 16px !important;
                line-height: 1.55 !important;
        }

        .mms-issue-label {
                margin-bottom: 10px !important;
                font-size: 16px !important;
        }

        .mms-issue-word {
                min-width: 105px;
                margin-left: 3px;
                font-size: 17px;
        }

        .mms-meta {
                margin-bottom: 20px !important;
                font-size: 14px !important;
        }

        .mms-btn {
                width: 100%;
                min-height: 55px;
                padding: 14px 16px !important;
                font-size: 15.5px !important;
        }

        .mms-orb--1 {
                width: 190px;
                height: 190px;
        }

        .mms-orb--3 {
                left: 55%;
        }
}

@media (max-width: 360px) {
        .mms-widget,
        .mms-widget--wide,
        .mms-widget--card {
                width: calc(100% - 10px);
                padding-left: 16px;
                padding-right: 16px;
        }

        .mms-title {
                font-size: 22px !important;
        }

        .mms-btn {
                font-size: 14.5px !important;
        }
}

/* Respect visitors who request reduced motion. */
@media (prefers-reduced-motion: reduce) {
        .mms-widget,
        .mms-content > *,
        .mms-orb,
        .mms-ring-wrap,
        .mms-logo-halo,
        .mms-logo-spin,
        .mms-btn::before {
                animation: none !important;
        }

        .mms-widget,
        .mms-content > * {
                opacity: 1;
                transform: none;
        }
}