:root {
    --wmw-motion-ease: cubic-bezier(.22, 1, .36, 1);
    --wmw-motion-short: 220ms;
}

body :is(.button, .contact_btn, .mainHero__telegram) {
    transition: background-color var(--wmw-motion-short) ease,
        color var(--wmw-motion-short) ease, border-color var(--wmw-motion-short) ease,
        box-shadow var(--wmw-motion-short) ease, translate var(--wmw-motion-short) var(--wmw-motion-ease);
}

body :is(.button, .contact_btn, .mainHero__telegram):active {
    translate: 0 1px;
}

body :is(a, button, input, select, textarea, summary):focus-visible {
    outline: 2px solid #881944;
    outline-offset: 4px;
}

body :is(.how_it_works__step, .article_card, .blog__mainAllArticles__article) {
    transition: transform 300ms var(--wmw-motion-ease), box-shadow 300ms ease, border-color 300ms ease;
}

body :is(.article_card, .blog__mainAllArticles__article) .imgOverflow {
    overflow: hidden;
}

body :is(.article_card, .blog__mainAllArticles__article) {
    transition: transform 300ms var(--wmw-motion-ease),
        box-shadow 650ms ease-in-out, border-color 650ms ease-in-out;
}

body :is(.article_card, .blog__mainAllArticles__article) .imgOverflow img {
    transition: transform 500ms var(--wmw-motion-ease);
}

@media (hover: hover) and (pointer: fine) {
    body :is(.how_it_works__step, .article_card, .blog__mainAllArticles__article):hover {
        transform: translateY(-3px);
        box-shadow: 0 12px 28px #68093112;
    }
    body :is(.article_card, .blog__mainAllArticles__article):hover .imgOverflow img { transform: scale(1.03); }
    body :is(.button, .contact_btn, .mainHero__telegram):hover {
        box-shadow: 0 5px 16px #68093114;
    }
}

body .wmw-motion-tabs {
    position: relative;
    isolation: isolate;
}

body .wmw-motion-tabs > .wmw-tab-indicator {
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
    border-radius: 7px;
    background: #881944;
    pointer-events: none;
    transition: transform 480ms cubic-bezier(.22,1,.36,1), width 480ms ease-in-out, height 480ms ease-in-out;
}

body .wmw-motion-tabs [role="tab"] {
    background: transparent !important;
    transition: color 320ms ease-in-out;
}

/* The moving indicator, not a second static fill, owns the selected background. */
body .heroModes .wmw-motion-tabs [role="tab"][aria-selected] {
    background: transparent !important;
}

body .wmw-motion-tabs [role="tab"][aria-selected="true"] { color: #fff !important; }
body .wmw-motion-tabs [role="tab"][aria-selected="false"] { color: #881944 !important; }

body .wmw-faq-trigger :is(.fa-chevron-down, .fa-angle-down) {
    transition: rotate 220ms ease;
}
body .wmw-faq-trigger[aria-expanded="true"] :is(.fa-chevron-down, .fa-angle-down) { rotate: 180deg; }

/* Compact mobile introduction; desktop layout and editorial copy stay intact. */
@media (max-width: 600px) {
    body.main_page .girl__mainPage {
        gap: 16px !important;
        padding: 12px 16px 16px !important;
    }
    body.main_page .mainHero__portrait {
        display: grid;
        grid-template-columns: 76px minmax(0, 1fr);
        gap: 14px;
        align-items: center;
        width: 100%;
        max-width: 440px;
        padding: 10px;
        text-align: left;
        box-sizing: border-box;
        box-shadow: 0 4px 16px #6809310a;
    }
    body.main_page .mainHero__portrait img { width: 76px; border-radius: 10px; }
    body.main_page .mainHero__portrait figcaption { padding: 0; font-size: 14px; line-height: 1.5; }
    body.main_page .girl__mainPage .comment { padding: 0 !important; }
    body.main_page .girl__mainPage .comment_bubble { padding: 18px !important; }
    body.main_page .girl__mainPage .comment_bubble::before { display: none; }
    body.main_page .girl__mainPage .comment_text { max-height: none; overflow: visible; }
    body.main_page .girl__mainPage .main_text { text-align: left; }
    body.main_page .girl__mainPage .main_text p { line-height: 1.6; text-align: left; }
    body .mainHero__telegram { min-height: 44px; line-height: 1.4; white-space: normal; }
    body #emailModal input[type="email"] { font-size: 16px; }
}

@media (prefers-reduced-motion: reduce) {
    body :is(.button, .contact_btn, .mainHero__telegram, .how_it_works__step, .article_card, .blog__mainAllArticles__article, .article_card .imgOverflow img, .blog__mainAllArticles__article .imgOverflow img, .wmw-tab-indicator, .wmw-motion-tabs [role="tab"]) {
        transition: none !important;
    }
    body :is(.how_it_works__step, .article_card, .blog__mainAllArticles__article):hover,
    body :is(.article_card, .blog__mainAllArticles__article):hover .imgOverflow img { transform: none !important; }
}