@import url('https://fonts.googleapis.com/css2?family=Play:wght@400;700&display=swap');

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
    --neg: #f87171;
    --bg: #060708;
    --surface: rgba(255,255,255,0.04);
    --surface-2: rgba(255,255,255,0.07);
    --border: rgba(255,255,255,0.08);
    --border-hover: rgba(255,255,255,0.18);
    --text: #ffffff;
    --muted: #fff;
    --accent-gold: #c8d67e;
    --accent-glow: rgba(120,180,120,0.15);
    --panel-bg: rgba(12,18,16,0.92);
    --radius: 20px;
    --radius-sm: 12px;
    --amber: #fff;
}
::-webkit-scrollbar {
    width: 4px;
    border-radius: 10px;
}
em{
    font-style: normal;
}
.featured-side-card,nav,.hero-article,.s2-card,.sw-active{
    opacity: 0;
}
::-webkit-scrollbar-thumb {
    background-color: rgba(21, 20, 26, 0.33);
    border-radius: 10px;
}
html, body {
    background: var(--bg);
    color: var(--text);
    font-family: 'Play', sans-serif;
}
.grecaptcha-badge{
    display: none;
}
.mw-nav {
    display: none;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: transform 400ms;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.mw-line {
    fill:none;
    transition: stroke-dasharray 400ms, stroke-dashoffset 400ms;
    stroke:#fff;
    stroke-width:5.5;
    stroke-linecap:round;
}
.mw-nn-btn{
    display: flex;
    gap: 4px;
    align-items: center;
}
.mw-nav .top {
    stroke-dasharray: 40 172;
}
.mw-nav .middle {
    stroke-dasharray: 40 111;
}
.mw-nav .bottom {
    stroke-dasharray: 40 172;
}
.mw-nav.active .top {
    stroke-dashoffset: -132px;
}
.mw-nav.active .middle {
    stroke-dashoffset: -71px;
}
.mw-nav.active .bottom {
    stroke-dashoffset: -132px;
}

.spy-bac{
    z-index: 2;
    opacity: .7;
}
.spp-co{
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    align-items: center;
    width: 100%;
}
.spp-co .s2-label{
    height: -webkit-fill-available;
    border-radius: 18px;
    transition: .5s;
    max-height: 0;
    overflow: hidden;
    margin: 10px 15px 0;
    padding: 10px 20px;
    box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.4);
    background: linear-gradient(45deg, #0b0d10, #0b0d1054);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    position: absolute;
    bottom: 0;
    z-index: 99;
    font-size: 14px;
}
.spp-co.active-spco .s2-label{
    max-height: 20vh;
    opacity: 1;
    display: flex;
    justify-content: center;
    align-items: center;
}
.spp-co.active-spco .iphone-container{
}
.mw-after{
    opacity: 0;
    max-height: 0;
    overflow: hidden;
    position: relative;
}
.spp-co .s2-label .s2-tag{
    font-size: 16px;
}
.spp-co .s2-label .s2-tag{
    opacity: 0;
}
.spp-co.active-spco:hover .s2-label{
    opacity: 0;
    max-height: 0;
    pointer-events: unset;
    touch-action: unset;
}
.spp-co.active-spco:hover .iphone-container{
    min-height: 100%;
}
.spp-co.active-spco .s2-label .s2-tag{
    opacity: 1;
    text-shadow: 0 0 9px rgb(255 255 255 / 66%);
}
nav {
    display: flex;
    align-items: center;
    gap: 4px;
    justify-content: space-between;
    padding: revert;
    z-index: 999;
}
nav .logo{
    color: white;
    text-shadow: 0 0 19px rgb(255 255 255 / 66%);
    text-transform: uppercase;
}
.nav-links {
    display: flex;
    gap: 25px;
    font-size: 14px;
    font-weight: 500;
}




.btn-outline, .btn-outline-small {
    padding: 8px 18px;
    border: 1px solid #ddd;
    background: #ffffff87;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 500;
    position: relative;
    z-index: 1;
    backdrop-filter: blur(3px);
}

.sidebar {
    flex: 0 0 280px;
    padding: 40px;
    border-right: solid 2px #f8e19e;
    position: relative;
    box-shadow: 0px 2px 10px 4px rgb(255 166 19 / 51%);
}
.sidebar.mmw{
    flex: 0 0 50%;
}
.sidebar img{
    position: absolute;
    width: 228px;
    left: 0;
    opacity: .3;
    filter: grayscale(1);
}

.stories-section {
    flex: 1;
    padding: 40px;
    overflow: auto;
}

.section-label {
    font-size: 12px;
    text-transform: uppercase;
    color: var(--muted);
    letter-spacing: 1px;
    padding-bottom: 30px;
    font-weight: 500;
}
.mmw .section-label, .mmw .stories-section{
    border-bottom: solid 2px #f8e19e;
}
.stories-grid.mmw a{
    display: grid;
}
.ux-m1w .stories-grid{
    display: flex;
    flex-direction: column;
}
.ux-m1w .story-card{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    background: rgba(255, 255, 255, 0);
    border: 2px solid var(--border);
    padding: 1.1rem;
}
.ux-m1w .story-card:hover{
    background: #9b83534a;
    box-shadow: 0 0 10px 4px rgb(255 166 19 / 51%);
    border: solid 2px #f8e19e;
    transition: cubic-bezier(.51,.61,0,2.3) all .5s;
}
.ux-m1w .card-title{
    margin: 0;
    font-size: 15px;
}
.mmw .stories-grid{
    padding-top: 30px;
}
.description {
    font-size: 15px;
    line-height: 1.6;
    color: #666;
    margin-bottom: 30px;
}

.stories-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 1rem;
}
.stories-grid.mmw{
    grid-template-columns: repeat(auto-fill, minmax(40%, 1fr));
    padding-top: 30px;
}
.story-card {
    display: flex;
    flex-direction: column;
}
.story-card:hover .card-image img{
    opacity: 1;
    filter: grayscale(0);
}
.card-image img{

}
.card-image {
    height: 180px;
    background-color: #f1f8f8;
    border-radius: 8px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 7px;
    padding: 20px;
    overflow: hidden;
}

.card-image {
    background-image: radial-gradient(#555555 1px, #2d2d2d 1px);
    background-size: 20px 20px;
}

.card-image img {
    max-width: 125%;
    filter: grayscale(1);
    transition: .5s;
    opacity: 0.7;
}

.card-title {
    line-height: 1.4;
    flex-grow: 1;
    padding: 0 8px;
    margin-bottom: 4px;
    font-size: 12px;
    text-transform: uppercase;
    color: var(--muted);
    letter-spacing: 1px;
    font-weight: 500;
}

.btn-read-more {
    align-self: flex-start;
    padding: 6px 14px;
    border: 1px solid #eee;
    background: white;
    border-radius: 4px;
    font-size: 13px;
    cursor: pointer;
    color: #444;
}

.btn-read-more:hover {
    background: #f5f5f5;
}
.min-d{
    position: absolute;
    transition: .1s;
    left: 0;
    right: 0;
    top: 27px;
    opacity: 0;
    overflow: hidden;
    z-index: 999;
}
.visibly .min-d{top: 24px;}
.dropdown:hover > .min-d{
    opacity: 1;
    cursor: auto;
    padding: 1.4rem 0;
}
nav.visibly .dropdown:hover > .min-d{
    width: 200%;
    transform: translateX(-25%);
}
.flex-mw{
    height: 0;
    overflow: hidden;
    pointer-events: none;
    touch-action: none;
    background: linear-gradient(45deg, #0b0d10, #0b0d1054);
    transition: .3s;
    scale: .7;
    backdrop-filter: blur(20px);
    border-radius: 20px;
}
nav.visibly .flex-mw{
    background: linear-gradient(45deg, #0b0d10, #0b0d1054);
}
.ffm{
    display: flex;
    height: 100%;
}
.stream-head .live-tag {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 3px 10px;
    background: var(--neg);
    color: #fff;
    border-radius: 100px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.05em;
}
.stream-head {
    padding: 14px 20px;
    border-bottom: 1px solid var(--line);
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.dropdown:hover > .min-d .flex-mw{
    pointer-events: unset;
    touch-action: unset;
    height: 500px;
    scale: 1;
}
.stream-video-overlay {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.stream-instr {
    background: rgba(0, 0, 0, 0.7);
    backdrop-filter: blur(8px);
    border: 1px solid rgba(232, 162, 62, 0.3);
    border-radius: var(--r-sm);
    padding: 8px 14px;
    font-family: var(--mono);
    font-size: 11px;
    color: var(--accent);
}
.stream-info {
    padding: 14px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 12px;
}
.stream-info a {
    color: var(--accent);
    font-weight: 500;
}
.stream-ctrl {
    background: rgba(0, 0, 0, 0.7);
    backdrop-filter: blur(8px);
    border-radius: var(--r-sm);
    padding: 6px 12px;
    font-family: var(--mono);
    font-size: 11px;
    color: var(--text-mid);
}
.story-card {
    --delay: 0s;
    transition: transform 0.6s var(--delay) cubic-bezier(.51,.61,0,2.3);
    transform: translateY(-50px);
    opacity: 0;
    padding: 4px 4px;
    cursor: pointer;
    border-radius: 14px;
}

.dropdown:hover .story-card {
    transform: translateY(0);
    opacity: 1;
}

.dropdown:hover .story-card:nth-child(1) { --delay: 0s; }
.dropdown:hover .story-card:nth-child(2) { --delay: 0.05s; }
.dropdown:hover .story-card:nth-child(3) { --delay: 0.1s; }
.dropdown:hover .story-card:nth-child(4) { --delay: 0.15s; }
.dropdown:hover .story-card:nth-child(5) { --delay: 0.2s; }
.dropdown:hover .story-card:nth-child(6) { --delay: 0.25s; }
.dropdown:hover .story-card:nth-child(7) { --delay: 0.3s; }

.dropdown span{
    display: block;
}

.dropdown:hover span:after {
    width: 100%;
}

.dropdown span:after {
    content: '';
    position: absolute;
    width: 0;
    height: 2px;
    bottom: -4px;
    left: 0;
    background-color: #005a36;
    transition: width 0.3s ease;
}
.stMw .dropdown{
    padding: 18px 0;
}
.stMw .dropdown span{
    color: #666;
}
.logo img{
    width: 134px;
    border-radius: 15px;
}
/*modals*/
.modal-wrapper-mw {
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: 0 0;
    display: flex;
    justify-content: end;
    transform: translateY(100%);
    transition: transform .3s ease, background .3s ease;
    backdrop-filter: blur(24px);
    z-index: 999999999;
}
.mini-notify.modal-wrapper-mw{
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: 0 0;
    display: unset;
    align-items: unset;
    justify-content: unset;
    transform: translateX(100%);
    transition: transform .3s ease, background .3s ease;
    backdrop-filter: blur(24px);
    z-index: 999999999;
    width: unset;
    border-radius: unset;
    box-shadow: unset;
    opacity: unset;
    visibility: unset;
    overflow: hidden;
    cursor: unset;
    background: unset!important;
    backdrop-filter: brightness(.25);
}
.mini-notify.modal-wrapper-mw .modal-mw{
    position: fixed;
    top: 20px;
    right: 20px;
    width: 390px;
    border-radius: 24px;
    box-shadow: 0 20px 40px -12px rgba(0, 0, 0, 0.25);
    opacity: unset;
    visibility: unset;
    transform: translateX(50px) scale(0.95);
    transition: all 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    z-index: 9999999;
    overflow: hidden;
    left: unset;
    bottom: unset;
    cursor: unset;
    background-color: white;
    padding: 0;
}
.mini-notify.modal-wrapper-mw .modal-mw span{
    color:black;
    margin-bottom: 1.5rem;
    font-weight: 600;
}
.modal-wrapper-mw.small-wh {
    display: block;
}

.modal-wrapper-mw.small-wh .modal-mw {
    border-radius: 12px 0 0 12px;
    width: 50% !important;
    position: inherit;
    right: 0;
    left: initial;
    bottom: 0;
    top: 0;
}

.modal-mw {
    opacity: 0;
    transform: translateY(20%);
    transition: opacity .3s ease, transform .3s ease;
    display: flex;
    flex-direction: column;
    max-width: 50%;
    padding: 12px 24px;
    --gradient-angle: 0deg;
    animation: rotate-gradient 5s infinite linear;
    width: 100%;
    justify-content: center;
    background-image: linear-gradient(rgba(255, 255, 255, 0.025) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.025) 1px, transparent 1px);
    background-size: 48px 48px;
    background-color: #101010c9;
}
.modal-mw p{
    margin-bottom: 1rem;
    font-size: clamp(24px, 4vw, 32px);
}
.modal-mw .container {
    padding: 32px;
}

.mw-form input::placeholder {
    color: #767676;
}

.modal-wrapper-mw button {
    padding: .75rem 1.8rem;
    border-radius: 1.5rem;
    color: white;
    border: unset!important;
    height: 54px;
    background: linear-gradient(45deg, #c5a771, rgb(150 89 2));
    font-size: 18px;
    line-height: 1.75rem;
    width: 100%;
    border: 2px solid #767676;
    cursor: pointer;
    transition: 1.5s all;
}

.modal-wrapper-mw button:disabled {
    opacity: .2;
    cursor: not-allowed;
}

.mw-form input.clbk__input_checked {
    border: 2px solid #66ef61;
    color: #66ef61;
}

.mw-send-open-sck {
    display: flex;
    margin-top: 30px;
    gap: 20px;
    align-items: center;
}

.modal-mw .mw-send-open-sck > div,.modal-mw .mw-send-open-sck > div > a {
    font-size: 12px!important;
    color: #ffffff;
    font-weight: 700!important;
    text-align: center;
    text-decoration: none;
}


.close-modal-mw,.header-modal .modal-mw .navigate-mw .close-modal-mw  {
    border-radius: 50%;
    width: 40px;
    height: 40px;
    padding: 10px;
    border: #ffffff solid 1px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: #ffffff;
    background: unset;
}
.header-modal .modal-mw .navigate-mw .close-modal-mw svg{
    color: #005bca;
}
.header-status{
    position: fixed;
    z-index: 9999;
    width: 100%;
    transition: 0.5s;
}
.header-status.active{
    transform: translateY(-32px);
}
.mwS-close {
    position: absolute;
    left: 10px;
    top: -40px;
}

.mw-form input,.mw-form textarea {
    padding: .75rem 1.8rem;
    border: 2px solid #767676;
    border-radius: 1.5rem;
    color: white;
    font-size: 18px;
    line-height: 1.75rem;
    width: 100%;
    transition: .5s all;
    background: unset;
}

.mw-form textarea::placeholder {
    color: white;
}

.mw-form form {
    display: flex;
    flex-direction: column;
    gap: 24px;
    margin-top: 16px;
}

.logo-icon { width: 36px; height: 36px; }
nav ul { list-style: none; display: flex; gap: 2.2rem; align-items: center; }
nav ul li a {
    color: var(--muted);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 400;
    transition: color .2s;
    display: flex;
    gap: .8rem;
}
nav ul li.dropdown:hover > a {
    color: #e2ca89;
}
nav ul li a:hover {color: var(--text);}
nav ul li a.active { color: var(--text); }
@keyframes pulse { 0%,100% { opacity: 1; } 50% { opacity: 0.4; } }
@keyframes pulse-soft { 0%,100% { opacity: 0.7; } 50% { opacity: 1; } }
nav.visibly{
    position: fixed;
    max-width: 1698px;
    margin: 0 auto;
    transition: 0.4s;
    animation: menu 1s;
    -webkit-animation: menu 1s;
    left: 0;
    right: 0;
    padding: clamp(0px, 8vh, 0px) var(--pad-h) clamp(0px, 10vh, 0px);
    z-index: 9999999;
}
@keyframes menu {
    0% {
        transform: translateY(0);
    }
    50% {
        transform: scale(1) translateY(60px);

    }
    100% {
        transform: scale(1);
    }
}
.nav-pill {
    border: 1px solid var(--border);
    border-radius: 50px;
    padding: 0.45rem 1.1rem;
    display: flex;
    align-items: center;
    gap: 1.8rem;
    background: linear-gradient(45deg, #0b0d1047, #0b0d1000);
}
nav.visibly .nav-pill{
    position: relative;
    background: linear-gradient(45deg, #0b0d10, #0b0d1054);
}
.btn-login {
    background: linear-gradient(45deg, #0b0d1047, #0b0d1054);
    border: 1px solid var(--border);
    color: var(--text);
    font-family: 'DM Sans', sans-serif;
    font-size: 0.88rem;
    padding: 0.6rem 1.4rem;
    border-radius: 50px;
    cursor: pointer;
    transition: background .2s;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}
.btn-login:hover { background: rgba(255,255,255,0.16); }
a {
    text-decoration: none;
}

.wrapper {
    align-items: flex-end;
    height: 100%;
}
.menu,
.menu > div {
    padding: 0.4rem;
    border-radius: 1.8rem;
}
.spy-glass-wrapper {
    position: relative;
    display: flex;
    overflow: hidden;
    width: 100%;
    color: white;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 2.2);
    height: 100%;
    /* min-height: 720px; */
}
.spy-start-wrapper{
    height: 100%;
    min-height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: relative;
    /* align-items: center; */
    gap: 1rem;
}

.liquidGlass-effect {
    position: absolute;
    z-index: 0;
    inset: 0;
    backdrop-filter: blur(3px);
    filter: url(#glass-distortion);
    overflow: hidden;
    isolation: isolate;
    /* box-shadow: -19px 20px 8px 8px rgb(255 166 19 / 51%); */
}

.liquidGlass-tint {
    z-index: 1;
    position: absolute;
    inset: 0;
    background: rgb(138 138 138 / 9%);
}

.liquidGlass-text {
    z-index: 3;
    width: 100%;
    display: flex;
}
.liquidGlass-text .s2-tag{
    letter-spacing: unset;
}

/*page*/
.hero {
    background-image: url(../../img/img_14.png);
    background-size: cover;
    background-position: center;
    padding: 1.4rem 2.5rem;
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    gap: 20px;
    overflow: hidden;
}
.hero:after{
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    /* background: #00000075; */
}

.sp-rea{
    width: 100%;
    display: flex;
    gap: 20px;
    height: 100%;
    min-height: 100%;
    flex: 1;
    justify-content: space-between;
    z-index: 1;
    max-width: 1400px;
    margin: 0 auto;
}
.spy-content{
    max-width: 100%;
    width: 100%;
    /* height: 700px; */
}
.spy-content:nth-child(2){
    max-width: 33%;
}
.global-m{
    display: flex;
    flex-direction: column;
    gap: 1.4rem;
    color: #f6f6f6;
    background: #00000047;
    height: 100%;
    backdrop-filter: blur(6px);
    border-radius: 1rem;
    padding: 2rem;
    border: 1px solid var(--border);
    justify-content: space-between;
    height: min-content;
}
.global-m span.wm-span{
    border: 1px solid #d2c973;
    border-radius: 50px;
    padding: 0.45rem 1.1rem;
    align-items: center;
    display: flex;
    gap: .45rem;
    width: fit-content;
    color: #d2c973;
}
.global-m h1{
    font-size: 47px;
    max-width: 550px;
    line-height: 42px;
}
.global-m p{
    position: relative;
    max-width: 455px;
    z-index: -1;
    font-size: var(--text-p);
}
.tw-spy-btt{
    display: flex;
    gap: .8rem;
    width: -webkit-fill-available;
}
.tw-spy-btt a{
    padding: 0.85rem 1rem;
    display: flex;
    align-items: center;
    gap: .4rem;
    font-size: 14px;
    font-weight: 600;
    justify-content: center;
    cursor: pointer;
    width: 100%;
    max-width: fit-content;
    transition: .5s all;
}
.tw-spy-btt a:hover{
    transform: scale(1.05);
}

.tw-spy-btt a.t{
    background: var(--primary);
    color: var(--text);
    box-shadow: 0 0 10px 4px rgb(255 166 19 / 51%);
    border: solid 2px var(--primary);
}
.cta-banner .tw-spy-btt a.t{
    background: unset;
}
.tw-spy-btt a.y{
    background: #0000002b;
    color: var(--text);
    border: solid 2px #f8e19e5c;
    backdrop-filter: blur(4px);
    border-radius: 58px;
}
.tw-spy-btt a.y:hover{
    color: white;
    background: unset;
}
.spy-bttn{
    width: 100%;
    background: rgba(0, 0, 0, 0.28);
    border-top: 1px solid var(--border);
    border-radius: 1.8rem;
    gap: 1.15rem;
    padding: 1.15rem;
    min-height: 16vh;
    display: flex;
    justify-content: space-around;
    align-items: center;
}
.spy-bttn.slite{
    min-height: auto;
}
.spy-bttn a{
    width: 100%;
    height: 100%;
    border-radius: 1.4rem;
    background: #0d0d0d;
    color: #f6f6f6;
    display: flex;
    align-items: center;
    justify-content: center;
}
.spy-bttn a.t{
    background: linear-gradient(135deg, #a8e6cf 0%, #e4e6b1 5%, #8dafa7 40%, #426E65 60%, #000000 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: white;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}


.splide__slide a{
    background: rgba(255,255,255,0.06);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--muted);
    padding: 0.45rem 1.1rem;
    border-radius: 16px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.3);
    transition: transform 0.3s ease;
    font-size: 0.9rem;
    font-weight: 400;
    gap: .8rem;
    border: solid 2px #00000000;
    backdrop-filter: blur(8px);
}
.slide-container-sp .splide__slide a{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: unset;
    height: 100%;
}
.slide-container-sp .splide__slide a:hover{
    transform: unset;
}
.splide__slide a:hover{
    color: var(--text);
}
.splide__slide a:hover {
    transform: scale(1.05);
    box-shadow: 0 0 10px 4px rgb(255 166 19 / 51%);
    border: solid 2px #f8e19e;
    background: #9b83534a;
}

.particles {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 1;
}
.particle {
    position: absolute;
    width: 2px;
    height: 2px;
    background: var(--amber);
    border-radius: 50%;
    opacity: 0;
    animation: float-particle linear infinite;
}
@keyframes float-particle {
    0% {
        opacity: 0;
        transform: translateY(0) scale(0);
    }
    10% {
        opacity: 0.6;
        transform: translateY(-10px) scale(1);
    }
    90% {
        opacity: 0.3;
    }
    100% {
        opacity: 0;
        transform: translateY(-200px) scale(0.5);
    }
}

/*video*/
.iphone-container {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    transition: .5s;
    min-height: 100%;
}

.iphone {
    position: relative;
    width: 100%;
    height: 100%;
    background: #1c1c1e;
    border-radius: 24px;
    transition: transform 0.2s ease;
    box-shadow: 0 0 10px 4px rgb(255 166 19 / 51%);
    border: solid 2px #f8e19e;
}
.iphone:hover {
    transform: translateY(-4px);
}
.iphone-screen {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    /* margin: 8px 4px 8px 4px; */
    background: black;
    border-radius: 20px;
    overflow: hidden;
    z-index: 5;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.05);
}
.controls-panel{
    opacity: 0;
    transition: .4s;
}
.iphone-container:hover .controls-panel{
    opacity: 1!important;
}

.iphone-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    pointer-events: none;
}


.controls-panel {
    position: absolute;
    bottom: 14px;
    left: 14px;
    right: 14px;
    background: rgb(20 22 32 / 70%);
    z-index: 30;
    display: flex;
    flex-direction: column;
    gap: 4px;
    transition: opacity 0.2s;
    background: rgba(33, 33, 30, 0.75);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 16px;
    padding: 16px 20px;
    box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.4);
}

.progress-area {
    flex: 1;
    height: 6px;
    border-radius: 100px;
    cursor: pointer;
    position: relative;
    transition: height 0.2s ease;
}
.progress-bar-container {
    flex: 1;
    height: 5px;
    background: rgba(255,255,255,0.25);
    border-radius: 10px;
    cursor: pointer;
    position: relative;
    transition: height 0.1s;
}
.progress-bar-container:hover {
    height: 7px;
}
.progress-bar-container:hover .progress-fill::after {
    content: '';
    position: absolute;
    right: -4px;
    top: 50%;
    transform: translateY(-50%);
    width: 10px;
    height: 10px;
    background: #ffffff;
    border-radius: 50%;
    box-shadow: 0 0 10px rgba(255, 255, 255, 0.8);
}
.time-text {
}
.progress-fill {
    width: 0%;
    height: 100%;
    background: linear-gradient(135deg, #d1a862 0%, #fae19d 45%, #e6c200 100%);
    border-radius: 100px;
    box-shadow: 0 0 8px rgba(229, 186, 115, 0.5);
    position: relative;
    transition: width 0.1s linear;
}
.time-text {
    font-family: 'JetBrains Mono', monospace;
    padding: 8px;
    color: white;
    letter-spacing: 0.5px;
    text-align: center;
    font-size: clamp(18px, 1vw, 24px);
}

.audio-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.play-pause-btn {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: none;
    background: linear-gradient(135deg, #d1a862 0%, #fae19d 45%, #e6c200 100%);
    color: 1a1a1a;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: transform 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
    box-shadow: 0 4px 12px rgba(181, 126, 61, 0.3);
}
.play-pause-btn:hover {
    transform: scale(1.05);
    box-shadow: 0 8px 28px rgba(254, 215, 0, 0.5), 0 3px 8px rgba(0, 0, 0, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.55);
    background: linear-gradient(135deg, #fff08a 0%, #fed700 40%, #f0c800 100%);
}
.play-pause-btn:active {
    transform: scale(0.95);
}
.play-pause-btn svg {
    width: 18px;
    height: 18px;
}
.volume-control {
    display: flex;
    align-items: center;
    gap: 10px;
    background: rgba(255, 255, 255, 0.04);
    padding: 6px 12px;
    border-radius: 100px;
    border: 1px solid rgba(255, 255, 255, 0.03);
}
.volume-icon {
    background: none;
    border: none;
    color: #94a3b8;
    cursor: pointer;
    display: flex;
    align-items: center;
    padding: 0;
    transition: color 0.2s ease;
}
.volume-icon:hover {
    color: #ffffff;
}
.volume-icon svg {
    width: 16px;
    height: 16px;
}
.volume-slider {
    -webkit-appearance: none;
    appearance: none;
    width: 70px;
    height: 4px;
    background: rgba(255, 255, 255, 0.15);
    border-radius: 100px;
    outline: none;
    cursor: pointer;
    transition: width 0.3s ease, background 0.2s ease;
}
.volume-slider:hover {
    background: rgba(255, 255, 255, 0.25);
}
.mute-note {
    font-size: 11px;
    color: rgba(255, 255, 255, 0.4);
    display: flex;
    align-items: center;
    gap: 5px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    user-select: none;
}
.mute-note .dot {
    width: 5px;
    height: 5px;
    background-color: #ef4444;
    border-radius: 50%;
    display: inline-block;
    box-shadow: 0 0 6px #ef4444;
}
.volume-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #ffffff;
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
    transition: transform 0.1s ease;
}
.volume-slider::-webkit-slider-thumb:hover {
    transform: scale(1.3);
}
.volume-slider::-moz-range-thumb {
    width: 10px;
    height: 10px;
    border: none;
    border-radius: 50%;
    background: #ffffff;
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
    transition: transform 0.1s ease;
}

.volume-slider::-moz-range-thumb:hover {
    transform: scale(1.3);
}
.play-pause-btn .icon-play { display: none; }
.play-pause-btn .icon-pause { display: block; }

.play-pause-btn.paused {
    background: rgba(255, 255, 255, 0.1);
    box-shadow: none;
}
.play-pause-btn.paused .icon-play {display: block;color: white;}
.play-pause-btn.paused .icon-pause { display: none; }

.volume-icon svg { display: none; }
.volume-icon.mute .vol-mute { display: block; }
.volume-icon.low .vol-low { display: block; }
.volume-icon.loud .vol-loud { display: block; }
@media (max-width: 450px) {
    .iphone {
        width: 320px;
        height: 600px;
        border-radius: 48px;
    }
    .iphone-screen {
        margin: 14px 6px 14px 6px;
        border-radius: 42px;
    }
    .controls-panel {
        bottom: 12px;
        left: 12px;
        right: 12px;
        padding: 10px 12px;
        gap: 8px;
    }
    .volume-slider {
        width: 70px;
    }
    .time-text {
        font-size: 0.6rem;
        min-width: 80px;
    }
    .play-pause-btn {
        width: 36px;
        height: 36px;
        font-size: 1rem;
    }
}
.slide-container-sp{
    width: 54%;
    height: 58vh;
}


.slide-container-sp .splide {
    height: 100%;
    border-radius: 16px;
    overflow: hidden;
}

.slide-container-sp .splide__track {
    height: 100%;
}

.slide-container-sp .splide__slide {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    font-weight: bold;
    color: white;
    height: 100%;
    transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}


.slide-container-sp .splide__slide:not(.is-active) {
    opacity: 0.3;
    transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.slide-container-sp .splide__slide.is-active {
    opacity: 1;
}

.slide-container-sp  .splide__slide.is-prev {
    opacity: 0.6;
}

.slide-container-sp  .splide__slide.is-next {
    opacity: 0.8;
}

.iphone-video::-webkit-media-controls {
    display: none !important;
}
.iphone-video {
    pointer-events: none;
}
.foundation-icon {
    width: 100%;
    height: 64px;
    border-radius: 50%;
    background: #5b5b5b;
    color: #1a1004;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 36px;
    font-weight: 500;
    max-width: 64px;
}
.scenario-card {
    display: block;
    background: rgb(13 13 13);
    border-radius: 20px;
    padding: 20px;
    text-decoration: none;
    color: inherit;
    transition: all 0.3s cubic-bezier(0.2, 0, 0, 1);
    border: 1px solid rgba(0, 0, 0, 0.05);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
    position: relative;
    overflow: hidden;
}


.scenario-tag {
    font-size: 11px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: white;
    background: #1c1c1e;
    display: inline-block;
    padding: 4px 10px;
    border-radius: 30px;
}

.scenario-card h3 {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.3;
    margin-bottom: 10px;
    color: white;
    letter-spacing: -0.3px;
}

.scenario-card p {
    font-size: 13px;
    line-height: 1.45;
    color: var(--muted);
}
.section-head h2 em {
    background: linear-gradient(45deg, #ffeecf, rgb(232 162 62));
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    font-weight: 400;
}
.section-head h2 {
    margin-bottom: 1rem;
    /* max-width: 60%; */
    font-size: 24px;
}

.mww .mmww .s2-card{
    background-image: unset;
    padding: clamp(24px, 3.5vw, 40px);
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.s2-card:nth-child(1) .img-card-s2{
    background-image: url("../../img/img_16.png");
}
.s2-card:nth-child(4) .img-card-s2{
    background-image: url("../../img/img_17.png");
}
.mww .mmww .s2-card::after{
    background: unset;
}
.cart-box-s2 .tw-spy-btt a{
    width: 100%;
    max-width: 100%;
}
.mww .s2-card::after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse at 90% 10%, rgb(232 162 62 / 9%), transparent 50%), radial-gradient(ellipse at 80% 70%, rgba(96, 165, 250, 0.06), transparent 50%);
    z-index: -1;
}
.section-head p{
    font-size: 16px;
    line-height: 1.6;
    color: var(--white-30);
    margin: 0 0 16px 0;
}
.gamma-chart-head{
    color: #959595;
}
.options-point strong{
    background: linear-gradient(45deg, #ffeecf, rgb(232 162 62));
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
}
.char{
    position: relative;
    z-index: -1;
}
.scenario-metrics {
    display: flex;
    gap: 12px;
    padding: 12px 0;
    border-top: 1px solid #ffffff2e;
    backdrop-filter: blur(3px);
    border-radius: 34px;
}
.gamma-chart{
    backdrop-filter: blur(4px);
    filter: url(#glass-distortion);
    box-shadow: inset 2px 2px 1px 0 rgb(13 13 13 / 6%), inset -1px -1px 1px 1px rgb(4 6 4 / 25%);
    background: rgb(49 49 49 / 8%);
    border: 1px solid var(--border);
    border-radius: 16px;
    padding:1.1rem;
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: space-evenly;
}
.flow-mmw .gamma-chart{
    display: grid;
    grid-template-columns: 36px 1fr auto;
    gap: 16px;
    align-items: center;
}
.flow-mmw .gamma-chart .num{
    text-align: center;
}
.flow-mmw .gamma-chart p{
    margin: 0;
}
.sm-item {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.sm-v {
    font-size: 24px;
    font-weight: 600;
    color: white;
    letter-spacing: -0.2px;
}

.sm-v.pos {
    background: linear-gradient(45deg, #ffeecf, rgb(232 162 62));
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
}

.sm-l {
    font-size: 10px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    color: var(--muted);
    margin-top: 4px;
}

.scenario-edge {
    border-radius: 12px;
    margin-bottom: 14px;
    line-height: 1.4;
}
.cart-box-s2{
    padding: clamp(24px, 3.5vw, 40px);
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.mww .s2-cards{
    gap: 8px;
    background: unset;
    border: unset;
    border-radius: unset;
}
.mww .s2-card{
    border-radius: 16px;
    overflow: hidden;
}
.mww .scenario-edge{
    padding: 12px 14px;
    background: rgba(232, 162, 62, 0.06);
    border: 1px solid rgba(232, 162, 62, 0.25);
    border-radius: 6px;
    line-height: 1.5;
    margin-bottom: 14px;
}

.scenario-proof {
    font-size: 11px;
    font-weight: 500;
    color: var(--muted);
    display: flex;
    align-items: center;
    gap: 6px;
    display: none;
}
.img-card-s2{
    height: clamp(345px, 3.5vw, 122px);
    background-image: url(../../img/img_15.png);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: clamp(24px, 3.5vw, 24px) clamp(24px, 3.5vw, 40px) 14px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: unset;
    backdrop-filter: blur(3px);
    filter: url(#glass-distortion);
    overflow: hidden;
    isolation: isolate;
    box-shadow: inset 1px -120px 120px 1px rgb(22 26 33);
    background-position: center;
}
.flow-head {
    padding: 18px 24px;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}
.swp{
    display: flex;
    flex-direction: column;
}
.curse .options-feature-text h3 em{
    display: block;
}
.curse .swp{
    position: sticky;
    top: 100px;
}
.curse .module-card .module-body{
    max-height: 0;
    overflow: hidden;
    transition: max-height .3s;
}
.curse .module-card.open .module-body{
    transition: max-height .9s;
    overflow: hidden;
    max-height: 600px;
}
.curse .module-card.open .module-num{
    width: 36px;
    height: 36px;
    border-radius: var(--r-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 600;
    background: var(--accent);
    color: #1a1004;
}
.module-card:last-child {
    border-bottom: none;
}
.curse .module-body > div{
    padding: 0 24px 22px 86px;
}
.module-tog {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    color: var(--text-dim);
    transition: all 0.2s;
}
.module-card.open .module-tog {
    color: var(--accent);
    transform: rotate(45deg);
}
.options-feature.curse{
    align-items: start;
}
.flow-mmw{
    height: 100%;
}
.bt-name{
    display: flex;
    justify-content: center;
}
.bt-name p{
    font-size: 0.88rem;
    padding: 0.6rem 1.4rem;
    border-radius: 50px;
    border: 1px solid var(--border-hover);
}
.dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    display: inline-block;
}
.scenario-proof .dot.neg {
    background: var(--neg);
    animation: pulse 1.5s infinite;
    box-shadow: 0 0 8px var(--neg);
}
.scenario-proof .dot.amber {
    background: var(--accent);
}
.sp-lbo{
    display: flex;
    justify-content: space-between;
}
.sp-lbo > div{
    width: 48%;
}
.span-dio-sp{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.dot.pos {
    background: #10b981;
    box-shadow: 0 0 0 2px rgba(16, 185, 129, 0.2);
}

.scenario-arrow {
    font-size: 20px;
    font-weight: 400;
    color: #d1d5db;
    transition: all 0.2s ease;
}

.scenario-card:hover .scenario-arrow {
    color: #6366f1;
    transform: translateX(4px);
}
.mww .s2-card-num {
    font-size: clamp(24px, 2vw, 80px);
    /* width: 50%; */
    padding-bottom: 3%;
}

.promo-container {
    position: relative;
    z-index: 1;
    display: flex;
    gap: 40px;
}
.promo-container > div{
    width: 50%;
    gap: 20px;
}
.cta-banner span{
    font-size: clamp(24px, 4vw, 32px);
    margin: 0 0 20px 0;
    color: #fff;
    max-width: 500px;
    font-weight: 700;
}
.cta-banner em{
    font-weight: 400;
    background: linear-gradient(45deg, #ffeecf, rgb(232 162 62));
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
}
.cta-banner {
    background: linear-gradient(135deg, #0f141c 0%, #171d26 100%);
    border-radius: 20px;
    padding: 60px;
    color: #ffffff;
    box-shadow: 0 30px 60px rgba(15, 20, 28, 0.15);
    gap: 40px;
    align-items: center;
    position: relative;
    overflow: hidden;
}
.cta-banner::after {
    content: '';
    position: absolute;
    top: 0; right: 0; bottom: 0; left: 0;
    opacity: 0.05;
    background-image: radial-gradient(#ffffff 1px, transparent 1px);
    background-size: 20px 20px;
    pointer-events: none;
}

.cta-title {
    font-size: 2.2rem;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: -0.5px;
}

.cta-right {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.cta-description {
    color: #a0a5b0;
    font-size: 1rem;
    line-height: 1.6;
}

.cta-buttons {
    display: flex;
    align-items: center;
    gap: 20px;
}

.btn-primary {
    background-color: #ffffff;
    color: #0f141c;
    padding: 14px 28px;
    border-radius: 10px;
    text-decoration: none;
    font-weight: 600;
    font-size: 0.95rem;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: background-color 0.2s;
}

.btn-primary:hover {
    background-color: #e2e5eb;
}

.btn-secondary {
    color: #ffffff;
    text-decoration: none;
    font-weight: 600;
    font-size: 0.95rem;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: opacity 0.2s;
}

.btn-secondary:hover {
    opacity: 0.8;
}
.mw-social-cont{
    display: flex;
    gap: 20px;
    justify-content: space-between;
}
.mw-social-cont a{
    color: white;
}
.promo-container a{
    color: white;
}
.mw-social-cont .gamma-chart span{
    opacity: 0;
    transition: 1s;
}
.mw-social-cont .gamma-chart:hover span{
    opacity: 1;
}
.mw-social-cont .gamma-chart:hover{
    background: unset;
}

.mw-social-cont .gamma-chart{
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    width: 100%;
    height: 148px;
    text-align: center;
    mask-image: linear-gradient(to right, transparent 0%, black 20%, black 80%, transparent 100%);
    -webkit-mask-image: linear-gradient(to right, transparent 0%, black 20%, black 80%, transparent 100%);
}
.mw-social-cont .gamma-chart:nth-child(1){
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(../../img/tg.jpeg);
}
.mw-social-cont .gamma-chart:nth-child(2){
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(../../img/inst.webp);
}
.mw-social-cont .gamma-chart:nth-child(3){
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(../../img/youtube.png);
}
.mw-contact-box.gamma-chart{
    mask-image: linear-gradient(to right, transparent 0%, transparent 20%, black 80%, transparent 100%);
    -webkit-mask-image: linear-gradient(to right, black 0%, black 20%, black 80%, transparent 100%);
}
.footer {
    position: relative;
    z-index: 1;
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 24px;
    padding: 36px 32px;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    overflow: hidden;
    transition: all 0.4s ease;
}
.footer-top {
    display: grid;
    grid-template-columns: 2fr repeat(3, 1fr);
    gap: 40px;
    padding-bottom: 60px;
    z-index: 2;
    position: relative;
    max-width: 1200px;
    margin: 0 auto;
}

.brand-section .logo {
    font-size: 1.8rem;
    font-weight: 800;
    letter-spacing: -1px;
    margin-bottom: 15px;
}

.brand-section .disclaimer {
    color: var(--muted);
    font-size: var(--text-p);
}

.footer-links-column h4 {
    display: none;
}

.footer-links-column ul {
    list-style: none;
}

.footer-links-column ul li {
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.02em;
    margin-bottom: 12px;
    color: #fff;
    background: var(--liner-text);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
}

.footer-links-column ul li a {
    color: var(--text-muted);
    text-decoration: none;
    font-size: 0.95rem;
    transition: color 0.2s;
    font-weight: 400;
}

.footer-links-column ul li a:hover {
    color: #FFF;
}

.footer-bottom {
    border-top: 1px solid transparent;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 20px;
    font-size: 0.85rem;
    color: #8a8d93;
    flex-wrap: wrap;
    max-width: 1200px;
    margin: 0 auto;
}

.status-badge {
    display: flex;
    align-items: center;
    gap: 8px;
    background-color: #ffffff;
    padding: 8px 16px;
    border-radius: 20px;
    border: 1px solid #e2e5eb;
    font-weight: 500;
    color: #1a1a1a;
}

.status-dot {
    width: 8px;
    height: 8px;
    background-color: #4caf50;
    border-radius: 50%;
    box-shadow: 0 0 8px #4caf50;
}

.footer-legal {
    display: flex;
    gap: 25px;
}

.footer-legal a {
    color: #8a8d93;
    text-decoration: none;
}

.footer-legal a:hover {
    color: #1a1a1a;
}


.nav-pill.slide{
    display: block;
    overflow: hidden;
    background: #00000047;
    max-width: 1400px;
    margin: 0 auto;
    z-index: 2;
    width: 100%;
}
@media (max-width: 1400px) {
    nav ul{
        gap: 1.2rem;
    }

}
@media (max-width: 1300px) {
    nav ul{
        gap: 0.8rem;
    }

}
@media (max-width: 1024px) {

    .spy-content:nth-child(2){
        display: none;
    }
    .spy-content, .modal-mw {
        max-width: 100% !important;
    }
}
@media (max-width: 991px) {
    .tw-spy-btt a{
        max-width: unset;
    }

    .hero{
        padding: 1.4rem 1.5rem;
    }
    .global-m h1{
        font-size: 26px;
        line-height: 28px;
    }
    .mw-nav{
        display: block;
    }
    .footer-top{
        grid-template-columns: 2fr repeat(2, 1fr);
    }
    .promo-container{
        flex-direction: column;
    }
    .curse .swp{
        position: unset;
    }
    .nav-pill{
        display: none;
    }
    .sp-lbo > div,.promo-container > div{
        width: 100%;
    }
    .sp-lbo {
        flex-direction: column-reverse;
        gap: clamp(40px, 7vh, 80px);
    }
    .spy-content,.modal-mw{
        max-width: 100% !important;
    }
    .curse .gamma-chart{
        padding: 0;
    }
    .mw-social-cont .gamma-chart{
        height: 80px;
    }
    .cta-banner{
        padding: 60px 24px;
    }

}

@media (max-width: 576px) {
    .footer-top{
        grid-template-columns: 1fr;
    }
    .tw-spy-btt{
        flex-direction: column;
    }
    .section-head h2{
        max-width: 100%;
    }
    .mww .s2-card-num {
        font-size: clamp(24px, 3.5vw, 62px);
    }
    .mww .s2-card:nth-child(1) {
        background-position: top 14% left 100%;
    }
    .mww .s2-card:nth-child(2) {
        background-size: 34%;
        background-position: top 16% left 95%;
    }
    .mww .s2-card:nth-child(3) {
        background-size: 46%;
        background-position: top 12% left 113%;
    }
    .modal-mw .container{
        padding: 14px;
    }

}
