@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap");

:root{
    --bg:#050505;
    --panel:#090909;
    --panel2:#0d0d0d;
    --panel3:#111111;
    --line:#1c1c1c;
    --line2:#292929;
    --text:#f5f5f5;
    --muted:#858585;
    --dim:#555;
    --white:#f2f2f2;
    --green:#42d392;
    --max:1420px;
}

*{
    box-sizing:border-box;
    margin:0;
    padding:0;
}

html{
    scroll-behavior:smooth;
    scroll-padding-top:105px;
}

body{
    font-family:"Inter",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    background:#050505;
    color:var(--text);
    min-height:100vh;
    overflow-x:hidden;
    -webkit-font-smoothing:antialiased;
}

body.cart-open{
    overflow:hidden;
}

a{
    text-decoration:none;
    color:inherit;
}

button{
    font:inherit;
}

.grid{
    position:fixed;
    inset:0;
    z-index:-5;
    pointer-events:none;
    background-image:
        linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
    background-size:64px 64px;
    mask-image:linear-gradient(#000,rgba(0,0,0,.7),transparent 92%);
}

.page-noise{
    position:fixed;
    inset:0;
    z-index:-4;
    pointer-events:none;
    opacity:.018;
    background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");
}

.navbar{
    position:sticky;
    top:14px;
    z-index:100;
    width:min(var(--max),calc(100% - 34px));
    height:68px;
    margin:14px auto 0;
    padding:0 11px 0 17px;
    border:1px solid #292929;
    border-radius:18px;
    background:rgba(7,7,7,.97);
    box-shadow:0 20px 60px rgba(0,0,0,.5);
    display:flex;
    align-items:center;
    gap:22px;
}

.brand{
    display:flex;
    align-items:center;
    gap:11px;
    min-width:225px;
}

.brand-mark{
    width:38px;
    height:38px;
    display:grid;
    place-items:center;
}

.brand-mark img{
    width:100%;
    height:100%;
    object-fit:contain;
}

.brand-text{
    display:flex;
    flex-direction:column;
    line-height:1.05;
}

.brand-text strong{
    font-size:13px;
    letter-spacing:.08em;
}

.brand-text small{
    margin-top:5px;
    color:#606060;
    font-size:7px;
    font-weight:900;
    letter-spacing:.16em;
}

.nav-tabs{
    flex:1;
    min-width:0;
    display:flex;
    align-items:center;
    gap:3px;
    padding:4px;
    border:1px solid #202020;
    border-radius:13px;
    background:#0a0a0a;
}

.nav-tabs a{
    position:relative;
    padding:10px 13px;
    border-radius:9px;
    color:#707070;
    font-size:9px;
    font-weight:900;
    white-space:nowrap;
    transition:.2s ease;
}

.nav-tabs a:hover{
    color:#ddd;
    background:#141414;
}

.nav-tabs a.active{
    color:#fff;
    background:#191919;
    box-shadow:inset 0 0 0 1px #292929;
}

.nav-tabs a.active:after{
    content:"";
    position:absolute;
    left:50%;
    bottom:3px;
    width:3px;
    height:3px;
    border-radius:50%;
    background:#fff;
    transform:translateX(-50%);
}

.nav-actions{
    display:flex;
    align-items:center;
    gap:7px;
}

.round-btn,
.cart{
    height:40px;
    border:1px solid #292929;
    border-radius:10px;
    background:#0e0e0e;
    color:#aaa;
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    transition:.2s ease;
}

.round-btn{
    width:40px;
}

.round-btn:hover,
.cart:hover{
    color:#fff;
    background:#171717;
    border-color:#3a3a3a;
}

.cart{
    position:relative;
    gap:8px;
    padding:0 12px;
    font-size:9px;
    font-weight:900;
}

.cart b{
    min-width:17px;
    height:17px;
    padding:0 4px;
    display:grid;
    place-items:center;
    border-radius:5px;
    background:#eee;
    color:#050505;
    font-size:7px;
}

.auth-area{
    display:flex;
    align-items:center;
    position:relative;
}

.discord-login{
    height:40px;
    display:flex;
    align-items:center;
    gap:8px;
    padding:0 13px;
    border:1px solid #292929;
    border-radius:10px;
    background:#0e0e0e;
    color:#d5d5d5;
    font-size:8px;
    font-weight:900;
    transition:.2s ease;
}

.discord-login i{
    color:#ddd;
    font-size:14px;
}

.discord-login:hover{
    background:#181818;
    border-color:#3a3a3a;
    color:#fff;
}

.user-menu{
    position:relative;
}

.user-profile{
    height:42px;
    min-width:160px;
    display:flex;
    align-items:center;
    gap:9px;
    padding:4px 9px 4px 4px;
    border:1px solid #292929;
    border-radius:11px;
    background:#0e0e0e;
    color:#fff;
    cursor:pointer;
}

.user-profile:hover{
    background:#171717;
    border-color:#3a3a3a;
}

.user-profile img{
    width:32px;
    height:32px;
    border-radius:9px;
    object-fit:cover;
    background:#202020;
}

.user-profile-copy{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:4px;
    text-align:left;
}

.user-profile-copy strong{
    max-width:90px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:8px;
}

.user-profile-copy small{
    color:#686868;
    font-size:6px;
    font-weight:900;
    letter-spacing:.1em;
}

.user-chevron{
    margin-left:auto;
    color:#555;
    font-size:7px;
    transition:.2s ease;
}

.user-profile[aria-expanded="true"] .user-chevron{
    transform:rotate(180deg);
    color:#fff;
}

.user-dropdown{
    position:absolute;
    top:calc(100% + 10px);
    right:0;
    width:235px;
    padding:8px;
    border:1px solid #292929;
    border-radius:13px;
    background:#090909;
    box-shadow:0 30px 90px rgba(0,0,0,.8);
    opacity:0;
    visibility:hidden;
    transform:translateY(-7px);
    transition:.18s ease;
    z-index:200;
}

.user-dropdown.open{
    opacity:1;
    visibility:visible;
    transform:translateY(0);
}

.dropdown-user{
    display:flex;
    align-items:center;
    gap:10px;
    padding:10px;
}

.dropdown-user img{
    width:40px;
    height:40px;
    border-radius:10px;
    object-fit:cover;
}

.dropdown-user div{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:5px;
}

.dropdown-user strong{
    font-size:10px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.dropdown-user span{
    color:#666;
    font-size:7px;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.dropdown-divider{
    height:1px;
    margin:5px 0;
    background:#202020;
}

.dropdown-role-list{
    padding:9px;
}

.dropdown-role-title{
    color:#555;
    font-size:6px;
    font-weight:900;
    letter-spacing:.13em;
    margin-bottom:8px;
}

.role-badge{
    display:flex;
    align-items:center;
    gap:7px;
    width:max-content;
    padding:7px 9px;
    border:1px solid #282828;
    border-radius:7px;
    background:#111;
    color:#bbb;
    font-size:7px;
    font-weight:900;
}

.role-dot{
    width:5px;
    height:5px;
    border-radius:50%;
    background:#fff;
}

.logout-link{
    display:flex;
    align-items:center;
    gap:8px;
    padding:10px;
    border-radius:8px;
    color:#777;
    font-size:8px;
    font-weight:900;
}

.logout-link:hover{
    background:#171717;
    color:#fff;
}

.mobile-toggle{
    display:none;
    width:40px;
    height:40px;
    border:1px solid #292929;
    border-radius:10px;
    background:#101010;
    color:#fff;
}

.mobile-menu{
    display:none;
}

.hero-shell{
    width:min(1260px,calc(100% - 34px));
    min-height:680px;
    margin:75px auto 0;
    display:grid;
    grid-template-columns:1.02fr .98fr;
    gap:65px;
    align-items:center;
}

.hero-copy{
    padding:35px 0;
}

.eyebrow,
.section-kicker{
    color:#686868;
    font-size:8px;
    font-weight:900;
    letter-spacing:.2em;
}

.eyebrow{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:9px 11px;
    border:1px solid #242424;
    border-radius:8px;
    background:#090909;
}

.pulse{
    width:5px;
    height:5px;
    border-radius:50%;
    background:#ddd;
    box-shadow:0 0 10px rgba(255,255,255,.3);
}

.hero-copy h1{
    margin-top:25px;
    font-size:clamp(64px,7vw,102px);
    line-height:.9;
    letter-spacing:-.07em;
    font-weight:900;
}

.hero-copy h1 span{
    color:#5d5d5d;
}

.hero-copy>p{
    max-width:600px;
    margin-top:28px;
    color:#858585;
    font-size:14px;
    line-height:1.8;
}

.hero-buttons{
    display:flex;
    gap:10px;
    margin-top:31px;
}

.button{
    min-height:47px;
    padding:0 18px;
    border-radius:10px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    font-size:9px;
    font-weight:900;
    transition:.2s ease;
}

.button-light{
    background:#ededed;
    color:#050505;
}

.button-light:hover{
    background:#fff;
    transform:translateY(-2px);
}

.button-dark{
    border:1px solid #2a2a2a;
    background:#101010;
    color:#ddd;
}

.button-dark:hover{
    background:#191919;
    transform:translateY(-2px);
}

.trust-row{
    max-width:600px;
    margin-top:57px;
    display:grid;
    grid-template-columns:repeat(4,1fr);
    border-top:1px solid #202020;
    border-bottom:1px solid #202020;
}

.trust-row div{
    padding:18px 13px;
    border-right:1px solid #202020;
}

.trust-row div:last-child{
    border-right:0;
}

.trust-row strong{
    display:block;
    font-size:15px;
}

.trust-row span{
    display:block;
    margin-top:6px;
    color:#555;
    font-size:6px;
    font-weight:900;
    letter-spacing:.15em;
}

.hero-visual{
    padding:13px;
    border:1px solid #252525;
    border-radius:18px;
    background:#090909;
    box-shadow:0 35px 100px rgba(0,0,0,.55);
}

.visual-topline,
.visual-footer{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:5px 5px 11px;
    color:#555;
    font-size:6px;
    font-weight:900;
    letter-spacing:.16em;
}

.visual-topline i{
    color:#ddd;
    font-size:5px;
    margin-right:5px;
}

.visual-screen{
    padding:18px;
    border:1px solid #292929;
    border-radius:12px;
    background:linear-gradient(145deg,#121212,#080808);
}

.product-preview-head{
    display:flex;
    align-items:center;
    gap:10px;
    padding-bottom:18px;
    border-bottom:1px solid #222;
}

.preview-brand{
    width:37px;
    height:37px;
    display:grid;
    place-items:center;
}

.preview-brand img{
    width:100%;
    height:100%;
    object-fit:contain;
}

.product-preview-head b{
    display:block;
    font-size:9px;
}

.product-preview-head small{
    display:block;
    margin-top:4px;
    color:#555;
    font-size:6px;
    font-weight:900;
    letter-spacing:.1em;
}

.preview-status{
    margin-left:auto;
    color:#666;
    font-size:6px;
    font-weight:900;
    letter-spacing:.1em;
}

.preview-status i{
    display:inline-block;
    width:5px;
    height:5px;
    margin-right:5px;
    border-radius:50%;
    background:#ddd;
}

.preview-main{
    display:grid;
    grid-template-columns:1.5fr .7fr;
    gap:10px;
    margin-top:12px;
}

.preview-large,
.preview-side{
    border:1px solid #252525;
    border-radius:10px;
    background:#0d0d0d;
}

.preview-large{
    min-height:260px;
    padding:20px;
}

.preview-kicker{
    color:#555;
    font-size:6px;
    font-weight:900;
    letter-spacing:.15em;
}

.preview-large>strong{
    display:block;
    margin-top:45px;
    font-size:34px;
    letter-spacing:-.06em;
}

.preview-large>b{
    display:block;
    margin-top:-2px;
    color:#555;
    font-size:11px;
    letter-spacing:.15em;
}

.preview-large p{
    max-width:280px;
    margin-top:16px;
    color:#666;
    font-size:8px;
    line-height:1.7;
}

.preview-actions{
    display:flex;
    gap:6px;
    margin-top:20px;
}

.preview-actions span{
    padding:6px 8px;
    border:1px solid #282828;
    border-radius:6px;
    color:#aaa;
    font-size:6px;
    font-weight:900;
}

.preview-side{
    display:flex;
    flex-direction:column;
}

.preview-side div{
    flex:1;
    padding:16px;
    border-bottom:1px solid #202020;
}

.preview-side div:last-child{
    border-bottom:0;
}

.preview-side small{
    display:block;
    color:#505050;
    font-size:6px;
    font-weight:900;
    letter-spacing:.1em;
}

.preview-side strong{
    display:block;
    margin-top:9px;
    font-size:11px;
}

.preview-lines{
    display:flex;
    gap:15px;
    padding-top:13px;
}

.preview-lines span{
    color:#666;
    font-size:6px;
    font-weight:800;
}

.preview-lines i{
    color:#bbb;
    margin-right:4px;
}

.visual-footer{
    padding:11px 5px 2px;
}

.stats-section{
    width:min(1260px,calc(100% - 34px));
    margin:0 auto;
    display:grid;
    grid-template-columns:repeat(4,1fr);
    border-top:1px solid #202020;
    border-bottom:1px solid #202020;
}

.stat-box{
    min-height:125px;
    padding:25px 20px;
    border-right:1px solid #202020;
}

.stat-box:last-child{
    border-right:0;
}

.stat-box strong{
    display:block;
    font-size:34px;
    letter-spacing:-.06em;
}

.stat-box strong span{
    color:#555;
}

.stat-box small{
    display:block;
    margin-top:10px;
    color:#555;
    font-size:7px;
    font-weight:900;
    letter-spacing:.13em;
}

.store-section,
.compatibility-section,
.showcase-section,
.development-section,
.process-section,
.features,
.faq-section,
.final-cta,
.deal-section{
    width:min(1260px,calc(100% - 34px));
    margin-left:auto;
    margin-right:auto;
}

.store-section{
    margin-top:110px;
}

.section-head,
.showcase-head,
.process-head{
    display:flex;
    align-items:end;
    justify-content:space-between;
    gap:30px;
    margin-bottom:25px;
}

.section-head h2,
.showcase-head h2,
.process-head h2,
.compatibility-copy h2,
.development-intro h2,
.faq-head h2{
    margin-top:10px;
    font-size:38px;
    line-height:1;
    letter-spacing:-.06em;
}

.section-head h2 span,
.showcase-head h2 span,
.process-head h2 span,
.compatibility-copy h2 span,
.development-intro h2 span,
.faq-head h2 span{
    color:#555;
}

.section-head>p{
    max-width:400px;
    color:#666;
    font-size:10px;
    line-height:1.7;
    text-align:right;
}

.product-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:13px;
}

.product-card{
    overflow:hidden;
    border:1px solid #252525;
    border-radius:15px;
    background:#090909;
    transition:.22s ease;
}

.product-card:hover{
    transform:translateY(-5px);
    border-color:#3a3a3a;
}

.product-art{
    height:250px;
    position:relative;
    display:grid;
    place-items:center;
    overflow:hidden;
}

.product-art:before{
    content:"";
    position:absolute;
    width:270px;
    height:270px;
    border-radius:50%;
    border:1px solid rgba(255,255,255,.07);
    box-shadow:
        0 0 0 35px rgba(255,255,255,.015),
        0 0 0 70px rgba(255,255,255,.01);
}

.art-one{
    background:radial-gradient(circle at 50% 30%,#303030,#111 52%,#080808);
}

.art-two{
    background:radial-gradient(circle at 30% 35%,#292929,#111 54%,#080808);
}

.art-three{
    background:radial-gradient(circle at 70% 25%,#303030,#111 54%,#080808);
}

.art-label{
    position:absolute;
    top:13px;
    left:13px;
    padding:7px 9px;
    border:1px solid #303030;
    border-radius:6px;
    background:#090909;
    color:#aaa;
    font-size:6px;
    font-weight:900;
    letter-spacing:.14em;
}

.art-center{
    position:relative;
    text-align:center;
}

.art-center img{
    display:block;
    width:54px;
    height:54px;
    object-fit:contain;
    margin:0 auto 15px;
}

.art-center i{
    display:block;
    margin-bottom:15px;
    color:#ddd;
    font-size:31px;
}

.art-center b{
    display:block;
    font-size:20px;
    letter-spacing:.1em;
}

.art-center small{
    display:block;
    margin-top:7px;
    color:#666;
    font-size:6px;
    font-weight:900;
    letter-spacing:.18em;
}

.product-info{
    padding:19px;
}

.tag-row{
    display:flex;
    justify-content:space-between;
    color:#555;
    font-size:6px;
    font-weight:900;
    letter-spacing:.13em;
}

.tag-row b{
    color:#999;
}

.product-info h3{
    margin-top:11px;
    font-size:16px;
}

.product-info p{
    min-height:49px;
    margin-top:9px;
    color:#6c6c6c;
    font-size:9px;
    line-height:1.7;
}

.product-info button,
.product-info>a{
    width:100%;
    height:40px;
    margin-top:15px;
    padding:0 12px;
    border:1px solid #292929;
    border-radius:8px;
    background:#101010;
    color:#ccc;
    display:flex;
    align-items:center;
    justify-content:space-between;
    font-size:8px;
    font-weight:900;
    cursor:pointer;
}

.product-info button:hover,
.product-info>a:hover{
    background:#191919;
    color:#fff;
}

.compatibility-section{
    margin-top:105px;
    display:grid;
    grid-template-columns:.85fr 1.15fr;
    gap:70px;
    padding:45px;
    border:1px solid #252525;
    border-radius:17px;
    background:#090909;
}

.compatibility-copy p{
    max-width:420px;
    margin-top:20px;
    color:#666;
    font-size:10px;
    line-height:1.8;
}

.compatibility-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
}

.compatibility-card{
    position:relative;
    min-height:105px;
    padding:18px;
    border:1px solid #252525;
    border-radius:10px;
    background:#0d0d0d;
}

.compatibility-card strong{
    display:block;
    font-size:20px;
}

.compatibility-card span{
    display:block;
    margin-top:7px;
    color:#555;
    font-size:6px;
    font-weight:900;
    letter-spacing:.13em;
}

.compatibility-card i{
    position:absolute;
    right:17px;
    top:18px;
    color:#aaa;
    font-size:10px;
}

.showcase-section{
    margin-top:110px;
}

.showcase-grid{
    display:grid;
    grid-template-columns:1.5fr 1fr;
    gap:13px;
}

.showcase-card{
    overflow:hidden;
    border:1px solid #252525;
    border-radius:15px;
    background:#090909;
}

.showcase-large{
    grid-row:span 2;
}

.showcase-ui{
    min-height:230px;
    padding:17px;
    background:#0c0c0c;
}

.banking-ui{
    min-height:390px;
}

.ui-top{
    display:flex;
    justify-content:space-between;
    color:#666;
    font-size:7px;
    font-weight:900;
    letter-spacing:.1em;
}

.ui-balance{
    margin-top:42px;
    padding:20px;
    border:1px solid #242424;
    border-radius:10px;
    background:#111;
}

.ui-balance small{
    display:block;
    color:#555;
    font-size:6px;
    font-weight:900;
}

.ui-balance strong{
    display:block;
    margin-top:11px;
    font-size:31px;
    letter-spacing:-.06em;
}

.ui-cards{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
    margin-top:9px;
}

.ui-cards div{
    padding:14px;
    border:1px solid #242424;
    border-radius:9px;
    background:#0f0f0f;
}

.ui-cards small{
    display:block;
    color:#555;
    font-size:6px;
}

.ui-cards strong{
    display:block;
    margin-top:7px;
    font-size:9px;
}

.ui-transactions{
    margin-top:9px;
    padding:15px;
    border:1px solid #242424;
    border-radius:9px;
}

.ui-transactions>span{
    color:#555;
    font-size:6px;
    font-weight:900;
    letter-spacing:.1em;
}

.ui-transactions p{
    display:flex;
    align-items:center;
    gap:8px;
    padding:9px 0;
    border-top:1px solid #1d1d1d;
    color:#777;
    font-size:7px;
}

.ui-transactions p:first-of-type{
    margin-top:9px;
}

.ui-transactions i{
    color:#aaa;
}

.ui-transactions b{
    margin-left:auto;
    color:#aaa;
}

.radio-ui{
    min-height:230px;
    display:flex;
    flex-direction:column;
    justify-content:center;
}

.radio-header{
    display:flex;
    align-items:center;
    gap:8px;
    padding-bottom:14px;
    border-bottom:1px solid #222;
}

.radio-header i{
    color:#bbb;
}

.radio-header strong{
    font-size:9px;
}

.radio-header span{
    margin-left:auto;
    color:#555;
    font-size:6px;
    font-weight:900;
}

.radio-frequency{
    padding:28px 0;
    text-align:center;
}

.radio-frequency small{
    display:block;
    color:#555;
    font-size:6px;
    font-weight:900;
}

.radio-frequency strong{
    display:block;
    margin-top:9px;
    font-size:38px;
    letter-spacing:-.06em;
}

.radio-users{
    display:flex;
    justify-content:center;
    gap:5px;
}

.radio-users span{
    width:22px;
    height:22px;
    border-radius:6px;
    background:#1d1d1d;
    border:1px solid #292929;
}

.code-ui{
    min-height:230px;
    padding:25px;
}

.code-head{
    display:flex;
    gap:5px;
    margin-bottom:28px;
}

.code-head span{
    width:6px;
    height:6px;
    border-radius:50%;
    background:#555;
}

.code-ui p{
    margin:8px 0;
    color:#686868;
    font-family:monospace;
    font-size:8px;
}

.code-ui b{
    color:#aaa;
}

.code-ui em{
    color:#888;
    font-style:normal;
}

.showcase-info{
    padding:17px 18px 19px;
    border-top:1px solid #202020;
}

.showcase-info span{
    color:#555;
    font-size:6px;
    font-weight:900;
    letter-spacing:.13em;
}

.showcase-info strong{
    display:block;
    margin-top:8px;
    font-size:13px;
}

.showcase-info p{
    margin-top:6px;
    color:#666;
    font-size:8px;
}

.deal-section{
    margin-top:85px;
    padding:30px;
    display:grid;
    grid-template-columns:50px 1fr auto;
    gap:17px;
    align-items:center;
    border:1px solid #292929;
    border-radius:16px;
    background:#090909;
}

.deal-badge{
    width:47px;
    height:47px;
    display:grid;
    place-items:center;
    border:1px solid #333;
    border-radius:12px;
    background:#151515;
    color:#ddd;
}

.deal-section h2{
    margin-top:7px;
    font-size:20px;
    letter-spacing:-.04em;
}

.deal-section p{
    margin-top:6px;
    color:#666;
    font-size:8px;
}

.development-section{
    margin-top:110px;
    padding:55px;
    display:grid;
    grid-template-columns:.9fr 1.1fr;
    gap:90px;
    border:1px solid #252525;
    border-radius:18px;
    background:#090909;
}

.development-intro h2{
    font-size:49px;
    line-height:.95;
}

.development-intro p{
    max-width:430px;
    margin-top:21px;
    color:#666;
    font-size:10px;
    line-height:1.8;
}

.development-intro .button{
    margin-top:25px;
}

.development-services{
    display:flex;
    flex-direction:column;
}

.service-row{
    display:grid;
    grid-template-columns:28px 38px 1fr;
    gap:14px;
    align-items:start;
    padding:19px 0;
    border-bottom:1px solid #202020;
}

.service-row:last-child{
    border-bottom:0;
}

.service-row>span{
    padding-top:3px;
    color:#444;
    font-size:7px;
    font-weight:900;
}

.service-row>i{
    width:34px;
    height:34px;
    display:grid;
    place-items:center;
    border:1px solid #292929;
    border-radius:8px;
    color:#aaa;
    font-size:10px;
}

.service-row strong{
    display:block;
    font-size:11px;
}

.service-row p{
    margin-top:5px;
    color:#626262;
    font-size:8px;
}

.process-section{
    margin-top:110px;
}

.process-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    border-top:1px solid #222;
    border-bottom:1px solid #222;
}

.process-item{
    min-height:190px;
    padding:22px;
    border-right:1px solid #222;
}

.process-item:last-child{
    border-right:0;
}

.process-item>span{
    color:#444;
    font-size:7px;
    font-weight:900;
}

.process-item>i{
    display:block;
    margin-top:32px;
    color:#aaa;
    font-size:15px;
}

.process-item strong{
    display:block;
    margin-top:17px;
    font-size:11px;
}

.process-item p{
    max-width:190px;
    margin-top:7px;
    color:#606060;
    font-size:8px;
    line-height:1.6;
}

.features{
    margin-top:110px;
    margin-bottom:0;
    padding:50px;
    display:grid;
    grid-template-columns:.85fr 1.15fr;
    gap:90px;
    border:1px solid #252525;
    border-radius:17px;
    background:#090909;
}

.feature-intro h2{
    margin-top:11px;
    font-size:52px;
    line-height:.94;
    letter-spacing:-.065em;
}

.feature-intro h2 span{
    color:#555;
}

.feature-intro p{
    max-width:400px;
    margin-top:21px;
    color:#666;
    font-size:10px;
    line-height:1.8;
}

.feature-list{
    display:flex;
    flex-direction:column;
}

.feature-item{
    display:grid;
    grid-template-columns:28px 35px 1fr;
    gap:13px;
    padding:17px 0;
    border-bottom:1px solid #202020;
}

.feature-item:last-child{
    border-bottom:0;
}

.feature-item>span{
    color:#444;
    font-size:7px;
    font-weight:900;
    padding-top:3px;
}

.feature-item>i{
    width:32px;
    height:32px;
    display:grid;
    place-items:center;
    border:1px solid #292929;
    border-radius:8px;
    color:#aaa;
    font-size:10px;
}

.feature-item b{
    display:block;
    font-size:10px;
}

.feature-item p{
    margin-top:5px;
    color:#666;
    font-size:8px;
    line-height:1.6;
}

.faq-section{
    margin-top:110px;
    display:grid;
    grid-template-columns:.75fr 1.25fr;
    gap:90px;
}

.faq-head h2{
    font-size:43px;
    line-height:.95;
}

.faq-list{
    border-top:1px solid #242424;
}

.faq-item{
    border-bottom:1px solid #242424;
}

.faq-item button{
    width:100%;
    min-height:65px;
    padding:0;
    border:0;
    background:none;
    color:#ddd;
    display:flex;
    align-items:center;
    justify-content:space-between;
    text-align:left;
    cursor:pointer;
    font-size:10px;
    font-weight:800;
}

.faq-item button i{
    color:#555;
    font-size:9px;
    transition:.2s ease;
}

.faq-item.open button i{
    transform:rotate(45deg);
    color:#aaa;
}

.faq-answer{
    max-height:0;
    overflow:hidden;
    transition:max-height .25s ease;
}

.faq-answer p{
    padding:0 35px 19px 0;
    color:#666;
    font-size:9px;
    line-height:1.8;
}

.final-cta{
    margin-top:110px;
    margin-bottom:100px;
    padding:75px 30px;
    border:1px solid #292929;
    border-radius:19px;
    background:#090909;
    text-align:center;
}

.final-logo{
    width:65px;
    height:65px;
    margin:0 auto 25px;
}

.final-logo img{
    width:100%;
    height:100%;
    object-fit:contain;
}

.final-cta h2{
    margin-top:13px;
    font-size:56px;
    line-height:.94;
    letter-spacing:-.065em;
}

.final-cta h2 span{
    color:#555;
}

.final-cta p{
    max-width:550px;
    margin:20px auto 0;
    color:#666;
    font-size:10px;
    line-height:1.8;
}

.final-cta .button{
    margin-top:26px;
}

.discord-pop,
.offer-pop{
    position:fixed;
    z-index:150;
    bottom:17px;
    border:1px solid #2b2b2b;
    border-radius:14px;
    background:#090909;
    box-shadow:0 30px 90px rgba(0,0,0,.8);
}

.discord-pop{
    left:20px;
    width:395px;
    padding:20px;
    display:grid;
    grid-template-columns:48px 1fr;
    gap:13px;
}

.pop-icon{
    width:48px;
    height:48px;
    display:grid;
    place-items:center;
    border:1px solid #333;
    border-radius:12px;
    background:#151515;
    color:#ddd;
    font-size:20px;
}

.pop-copy b{
    font-size:12px;
}

.pop-copy p{
    margin-top:6px;
    color:#777;
    font-size:9px;
    line-height:1.65;
}

.pop-actions{
    grid-column:1/-1;
    margin-top:4px;
    padding-top:13px;
    border-top:1px solid #222;
    display:flex;
    justify-content:space-between;
    align-items:center;
}

.pop-actions button{
    border:0;
    background:none;
    color:#666;
    font-size:9px;
    font-weight:800;
    cursor:pointer;
}

.pop-actions button:hover{
    color:#fff;
}

.pop-actions a{
    padding:10px 14px;
    border-radius:8px;
    background:#eee;
    color:#050505;
    font-size:9px;
    font-weight:900;
}

.offer-pop{
    right:20px;
    width:315px;
    padding:20px;
}

.offer-title{
    display:flex;
    justify-content:space-between;
    align-items:center;
}

.offer-title span{
    color:#666;
    font-size:8px;
    font-weight:900;
    letter-spacing:.14em;
}

.offer-title b{
    color:#aaa;
    font-size:7px;
    letter-spacing:.1em;
}

.offer-pop>strong{
    display:block;
    margin-top:11px;
    font-size:12px;
}

.offer-pop>p{
    margin-top:7px;
    color:#707070;
    font-size:9px;
    line-height:1.65;
}

.close{
    position:absolute;
    top:8px;
    right:10px;
    width:24px;
    height:24px;
    border:0;
    background:none;
    color:#555;
    font-size:18px;
    cursor:pointer;
}

.close:hover{
    color:#fff;
}

.toast{
    position:fixed;
    left:50%;
    bottom:23px;
    z-index:300;
    transform:translate(-50%,18px);
    opacity:0;
    pointer-events:none;
    padding:11px 15px;
    border:1px solid #2d2d2d;
    border-radius:8px;
    background:#151515;
    color:#ddd;
    font-size:8px;
    font-weight:800;
    transition:.25s;
}

.toast.show{
    opacity:1;
    transform:translate(-50%,0);
}

.cart-overlay{
    position:fixed;
    inset:0;
    z-index:180;
    background:rgba(0,0,0,.75);
    opacity:0;
    visibility:hidden;
    transition:.25s ease;
}

.cart-overlay.show{
    opacity:1;
    visibility:visible;
}

.cart-drawer{
    position:fixed;
    z-index:190;
    top:0;
    right:0;
    width:min(430px,100vw);
    height:100dvh;
    display:flex;
    flex-direction:column;
    border-left:1px solid #292929;
    background:#080808;
    box-shadow:-30px 0 90px rgba(0,0,0,.8);
    transform:translateX(105%);
    transition:transform .3s cubic-bezier(.2,.8,.2,1);
    visibility:hidden;
}

.cart-drawer.open{
    transform:translateX(0);
    visibility:visible;
}

.cart-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    padding:28px 24px 21px;
    border-bottom:1px solid #202020;
}

.cart-head h2{
    margin-top:7px;
    font-size:26px;
    letter-spacing:-.05em;
}

.cart-head h2 span{
    color:#555;
    font-size:11px;
}

.cart-close{
    width:32px;
    height:32px;
    border:1px solid #292929;
    border-radius:8px;
    background:#111;
    color:#777;
    font-size:19px;
    cursor:pointer;
}

.cart-close:hover{
    color:#fff;
    background:#181818;
}

.cart-body{
    flex:1;
    overflow:auto;
    padding:18px 20px;
}

.cart-empty{
    height:100%;
    min-height:300px;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    text-align:center;
}

.empty-icon{
    width:54px;
    height:54px;
    display:grid;
    place-items:center;
    margin-bottom:15px;
    border:1px solid #292929;
    border-radius:14px;
    background:#111;
    color:#888;
}

.cart-empty strong{
    font-size:13px;
}

.cart-empty p{
    max-width:250px;
    margin-top:7px;
    color:#666;
    font-size:9px;
    line-height:1.65;
}

.cart-empty button{
    margin-top:17px;
    padding:10px 13px;
    border:1px solid #303030;
    border-radius:8px;
    background:#171717;
    color:#ddd;
    font-size:8px;
    font-weight:900;
    cursor:pointer;
}

.cart-list{
    display:flex;
    flex-direction:column;
    gap:9px;
}

.cart-item{
    display:grid;
    grid-template-columns:48px 1fr 25px;
    gap:12px;
    padding:13px;
    border:1px solid #252525;
    border-radius:12px;
    background:#101010;
}

.cart-item-icon{
    width:48px;
    height:48px;
    min-width:48px;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    border:1px solid #2b2b2b;
    border-radius:9px;
    background:#151515;
    color:#bbb;
}

.cart-item-icon img{
    display:block;
    width:100%;
    height:100%;
    max-width:100%;
    max-height:100%;
    object-fit:cover;
    object-position:center;
    border:0;
    margin:0;
    padding:0;
}

.cart-item-info{
    min-width:0;
    align-self:center;
}

.cart-item-info strong{
    display:block;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:10px;
    line-height:1.25;
}

.cart-item-info small{
    display:block;
    margin-top:5px;
    color:#707070;
    font-size:8px;
}

.cart-item-controls{
    grid-column:2;
    display:flex;
    align-items:center;
    gap:7px;
    margin-top:7px;
}

.cart-item-controls button{
    width:22px;
    height:22px;
    padding:0;
    border:1px solid #292929;
    border-radius:6px;
    background:#151515;
    color:#aaa;
    line-height:20px;
    font-size:12px;
    cursor:pointer;
}

.cart-item-controls button:hover{
    background:#1d1d1d;
    color:#fff;
    border-color:#3a3a3a;
}

.cart-item-controls span{
    min-width:14px;
    text-align:center;
    color:#ddd;
    font-size:8px;
    font-weight:800;
}

.cart-item > .remove-item{
    grid-column:3;
    grid-row:1 / span 2;
    align-self:start;
    justify-self:end;
}

.cart-item-main{
    min-width:0;
}

.cart-item-main strong{
    display:block;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:10px;
}

.cart-item-main>span{
    display:block;
    margin-top:4px;
    color:#707070;
    font-size:8px;
}

.quantity{
    display:flex;
    align-items:center;
    gap:7px;
    margin-top:10px;
}

.quantity button{
    width:22px;
    height:22px;
    border:1px solid #292929;
    border-radius:6px;
    background:#151515;
    color:#aaa;
    cursor:pointer;
}

.quantity b{
    min-width:14px;
    text-align:center;
    font-size:8px;
}

.remove-item{
    width:23px;
    height:23px;
    border:0;
    background:none;
    color:#555;
    font-size:16px;
    cursor:pointer;
}

.remove-item:hover{
    color:#fff;
}

.cart-footer{
    padding:19px 20px 22px;
    border-top:1px solid #202020;
    background:#0b0b0b;
}

.cart-total{
    display:flex;
    justify-content:space-between;
    margin-bottom:13px;
}

.cart-total span{
    color:#666;
    font-size:9px;
}

.cart-total strong{
    font-size:18px;
}

.checkout-button{
    width:100%;
    height:46px;
    border:1px solid #e7e7e7;
    border-radius:9px;
    background:#eee;
    color:#050505;
    font-size:9px;
    font-weight:900;
    cursor:pointer;
}

.checkout-button:hover{
    background:#fff;
}

.cart-footer small{
    display:block;
    margin-top:9px;
    color:#555;
    font-size:7px;
    line-height:1.5;
    text-align:center;
}

footer{
    width:min(1260px,calc(100% - 34px));
    margin:auto;
    padding:32px 0 45px;
    border-top:1px solid #1e1e1e;
    display:flex;
    align-items:center;
    gap:25px;
    color:#555;
    font-size:7px;
}

.footer-brand{
    display:flex;
    align-items:center;
    gap:10px;
}

.footer-logo{
    width:31px;
    height:31px;
}

.footer-logo img{
    width:100%;
    height:100%;
    object-fit:contain;
}

.footer-brand>div:last-child{
    display:flex;
    flex-direction:column;
    gap:4px;
}

.footer-brand b{
    color:#aaa;
    font-size:10px;
    letter-spacing:.08em;
}

.footer-brand span{
    font-size:6px;
    letter-spacing:.14em;
}

.footer-links{
    display:flex;
    gap:19px;
    margin-left:auto;
}

.footer-links a:hover{
    color:#ddd;
}

footer p{
    margin-left:20px;
}

@media(max-width:1180px){

    .brand{
        min-width:175px;
    }

    .nav-tabs a{
        padding:10px 9px;
    }

    .discord-login span{
        display:none;
    }

    .discord-login{
        width:40px;
        padding:0;
        justify-content:center;
    }

    .hero-shell{
        gap:35px;
    }

    .features,
    .development-section{
        gap:50px;
    }

}

@media(max-width:980px){

    .navbar{
        top:0;
        width:100%;
        height:64px;
        margin-top:0;
        border-radius:0;
    }

    .nav-tabs,
    .nav-actions{
        display:none;
    }

    .mobile-toggle{
        display:block;
        margin-left:auto;
    }

    .mobile-menu{
        position:fixed;
        top:75px;
        right:16px;
        z-index:110;
        width:240px;
        padding:8px;
        border:1px solid #292929;
        border-radius:13px;
        background:#090909;
        box-shadow:0 25px 80px rgba(0,0,0,.8);
    }

    .mobile-menu.open{
        display:flex;
        flex-direction:column;
    }

    .mobile-menu a{
        padding:12px;
        border-radius:8px;
        color:#888;
        font-size:9px;
        font-weight:900;
    }

    .mobile-menu a:hover{
        background:#171717;
        color:#fff;
    }

    .mobile-discord{
        margin-top:4px;
        background:#eee!important;
        color:#050505!important;
    }

    .hero-shell{
        grid-template-columns:1fr;
        margin-top:45px;
    }

    .hero-visual{
        max-width:800px;
    }

    .compatibility-section,
    .development-section,
    .features,
    .faq-section{
        grid-template-columns:1fr;
    }

    .product-grid{
        grid-template-columns:1fr 1fr;
    }

    .section-head{
        align-items:flex-start;
        flex-direction:column;
    }

    .section-head>p{
        text-align:left;
    }

    .deal-section{
        grid-template-columns:48px 1fr;
    }

    .deal-section .button{
        grid-column:2;
        width:max-content;
    }

    .faq-section{
        gap:40px;
    }

}

@media(max-width:650px){

    .hero-shell,
    .stats-section,
    .store-section,
    .compatibility-section,
    .showcase-section,
    .development-section,
    .process-section,
    .features,
    .faq-section,
    .final-cta,
    .deal-section{
        width:calc(100% - 24px);
    }

    .hero-copy h1{
        font-size:55px;
    }

    .hero-copy>p{
        font-size:11px;
    }

    .hero-buttons{
        flex-direction:column;
    }

    .button{
        width:100%;
    }

    .trust-row{
        grid-template-columns:1fr 1fr;
        margin-top:38px;
    }

    .trust-row div:nth-child(2){
        border-right:0;
    }

    .trust-row div:nth-child(3),
    .trust-row div:nth-child(4){
        border-top:1px solid #202020;
    }

    .preview-main{
        grid-template-columns:1fr;
    }

    .preview-side{
        display:grid;
        grid-template-columns:1fr 1fr 1fr;
    }

    .preview-side div{
        border-right:1px solid #202020;
        border-bottom:0;
    }

    .preview-side div:last-child{
        border-right:0;
    }

    .preview-large{
        min-height:230px;
    }

    .stats-section{
        grid-template-columns:1fr 1fr;
    }

    .stat-box{
        min-height:105px;
    }

    .stat-box:nth-child(2){
        border-right:0;
    }

    .stat-box:nth-child(3),
    .stat-box:nth-child(4){
        border-top:1px solid #202020;
    }

    .product-grid{
        grid-template-columns:1fr;
    }

    .compatibility-section,
    .development-section,
    .features{
        padding:27px;
    }

    .compatibility-grid{
        grid-template-columns:1fr 1fr;
    }

    .showcase-grid{
        grid-template-columns:1fr;
    }

    .showcase-large{
        grid-row:auto;
    }

    .banking-ui{
        min-height:330px;
    }

    .development-intro h2{
        font-size:40px;
    }

    .process-grid{
        grid-template-columns:1fr 1fr;
    }

    .process-item{
        min-height:165px;
    }

    .process-item:nth-child(2){
        border-right:0;
    }

    .process-item:nth-child(3),
    .process-item:nth-child(4){
        border-top:1px solid #222;
    }

    .feature-intro h2{
        font-size:40px;
    }

    .faq-head h2{
        font-size:37px;
    }

    .final-cta{
        padding:55px 20px;
    }

    .final-cta h2{
        font-size:42px;
    }

    .discord-pop{
        left:12px;
        width:calc(100vw - 24px);
        bottom:12px;
    }

    .offer-pop{
        right:12px;
        width:calc(100vw - 24px);
        bottom:12px;
    }

    footer{
        width:calc(100% - 24px);
        flex-direction:column;
        align-items:flex-start;
    }

    .footer-links{
        margin-left:0;
        flex-wrap:wrap;
    }

    footer p{
        margin-left:0;
        line-height:1.6;
    }

}
.showcase-card,
.product-card,
.compatibility-card,
.final-cta,
.deal-section,
.hero-visual{
    isolation:isolate;
}

.showcase-card,
.product-card{
    box-shadow:0 18px 60px rgba(0,0,0,.18);
}

.showcase-card:hover .showcase-ui,
.product-card:hover .product-art{
    border-color:#333;
}

.showcase-card .showcase-ui{
    transition:transform .35s cubic-bezier(.2,.8,.2,1),background .35s ease;
}

.showcase-card:hover .showcase-ui{
    transform:scale(1.012);
}

.product-art{
    transition:transform .35s cubic-bezier(.2,.8,.2,1),filter .35s ease;
}

.product-card:hover .product-art{
    transform:scale(1.018);
    filter:brightness(1.08);
}

.product-card .product-info button,
.product-card .product-info>a{
    position:relative;
    overflow:hidden;
    transition:.25s ease;
}

.product-card .product-info button:before,
.product-card .product-info>a:before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(100deg,transparent 20%,rgba(255,255,255,.08) 50%,transparent 80%);
    transform:translateX(-120%);
    transition:transform .55s ease;
}

.product-card:hover .product-info button:before,
.product-card:hover .product-info>a:before{
    transform:translateX(120%);
}

.product-card .product-info button i,
.product-card .product-info>a i{
    transition:transform .25s ease;
}

.product-card:hover .product-info button i,
.product-card:hover .product-info>a i{
    transform:translateX(3px);
}

.showcase-section{
    position:relative;
}

.showcase-section:before{
    content:"";
    position:absolute;
    left:0;
    right:0;
    top:-35px;
    height:1px;
    background:linear-gradient(90deg,transparent,#252525 20%,#252525 80%,transparent);
}

.showcase-large .banking-ui{
    position:relative;
    overflow:hidden;
}

.showcase-large .banking-ui:after{
    content:"";
    position:absolute;
    width:260px;
    height:260px;
    right:-100px;
    bottom:-150px;
    border:1px solid rgba(255,255,255,.06);
    border-radius:50%;
    box-shadow:0 0 0 35px rgba(255,255,255,.012),0 0 0 70px rgba(255,255,255,.008);
    pointer-events:none;
}

.radio-users span{
    transition:transform .25s ease,background .25s ease;
}

.showcase-card:hover .radio-users span:nth-child(1){transform:translateY(-3px)}
.showcase-card:hover .radio-users span:nth-child(2){transform:translateY(-5px)}
.showcase-card:hover .radio-users span:nth-child(3){transform:translateY(-2px)}
.showcase-card:hover .radio-users span:nth-child(4){transform:translateY(-5px)}
.showcase-card:hover .radio-users span:nth-child(5){transform:translateY(-3px)}

.code-ui p{
    transition:transform .2s ease,color .2s ease;
}

.showcase-card:hover .code-ui p:nth-child(2){transform:translateX(4px);color:#8b8b8b}
.showcase-card:hover .code-ui p:nth-child(3){transform:translateX(8px);color:#8b8b8b}
.showcase-card:hover .code-ui p:nth-child(4){transform:translateX(12px);color:#8b8b8b}

.deal-section{
    position:relative;
    overflow:hidden;
}

.deal-section:after{
    content:"";
    position:absolute;
    width:360px;
    height:360px;
    right:-180px;
    top:-230px;
    border:1px solid rgba(255,255,255,.05);
    border-radius:50%;
    box-shadow:0 0 0 45px rgba(255,255,255,.012),0 0 0 90px rgba(255,255,255,.008);
    pointer-events:none;
}

.final-cta{
    position:relative;
    overflow:hidden;
    box-shadow:0 30px 100px rgba(0,0,0,.3);
}

.final-cta:before{
    content:"";
    position:absolute;
    left:50%;
    top:-220px;
    width:600px;
    height:600px;
    transform:translateX(-50%);
    border:1px solid rgba(255,255,255,.035);
    border-radius:50%;
    box-shadow:0 0 0 60px rgba(255,255,255,.008),0 0 0 120px rgba(255,255,255,.005);
    pointer-events:none;
}

.final-cta > *{
    position:relative;
    z-index:1;
}

.final-logo{
    transition:transform .4s cubic-bezier(.2,.8,.2,1),filter .4s ease;
}

.final-cta:hover .final-logo{
    transform:translateY(-4px) scale(1.04);
    filter:brightness(1.15);
}

.faq-item button{
    transition:color .2s ease,background .2s ease;
}

.faq-item button:hover{
    color:#fff;
}

.faq-item.open button{
    color:#fff;
}

.faq-item.open{
    background:linear-gradient(90deg,rgba(255,255,255,.018),transparent);
}

@media(max-width:650px){
    .showcase-section:before{top:-20px}
    .search-modal-top strong{font-size:16px}
}

/* DFSCRIPTS PREMIUM VISUAL OVERHAUL */
:root{
    --bg:#050505;
    --panel:#090909;
    --panel2:#0d0d0d;
    --panel3:#121212;
    --line:#202020;
    --line2:#303030;
    --text:#f7f7f7;
    --muted:#888;
    --dim:#505050;
    --white:#fff;
}

body{
    background:
        radial-gradient(circle at 82% 8%,rgba(255,255,255,.055),transparent 24%),
        radial-gradient(circle at 12% 24%,rgba(255,255,255,.025),transparent 25%),
        #050505;
}

body:before{
    content:"";
    position:fixed;
    inset:0;
    pointer-events:none;
    z-index:-3;
    background:linear-gradient(180deg,rgba(255,255,255,.018),transparent 18%,transparent 82%,rgba(255,255,255,.012));
}

.navbar{
    width:min(1460px,calc(100% - 42px));
    height:74px;
    margin-top:18px;
    padding:0 12px 0 20px;
    border-radius:20px;
    border-color:#303030;
    background:rgba(6,6,6,.92);
    backdrop-filter:blur(24px);
    box-shadow:0 18px 70px rgba(0,0,0,.65),inset 0 1px 0 rgba(255,255,255,.035);
}

.brand{min-width:250px;gap:13px}
.brand-mark{width:42px;height:42px}
.brand-text strong{font-size:14px;letter-spacing:.13em}
.brand-text small{font-size:7px;letter-spacing:.2em}

.nav-tabs{
    max-width:650px;
    margin:auto;
    border-color:#292929;
    background:#080808;
    padding:5px;
}
.nav-tabs a{
    padding:11px 17px;
    font-size:9px;
    color:#666;
}
.nav-tabs a.active{
    background:#1c1c1c;
    box-shadow:inset 0 0 0 1px #353535,0 5px 18px rgba(0,0,0,.35);
}

.round-btn,.cart,.discord-login,.user-profile{
    border-color:#303030;
    background:#0d0d0d;
}
.round-btn,.cart{height:42px}
.round-btn{width:42px}
.cart{padding:0 14px;font-size:9px}
.discord-login{height:42px;padding:0 15px}

.hero-shell{
    width:min(1400px,calc(100% - 42px));
    min-height:760px;
    margin-top:72px;
    grid-template-columns:1fr 1fr;
    gap:80px;
}

.hero-copy{position:relative}
.hero-copy:before{
    content:"";
    position:absolute;
    width:420px;
    height:420px;
    left:-150px;
    top:50px;
    border-radius:50%;
    background:radial-gradient(circle,rgba(255,255,255,.055),transparent 67%);
    filter:blur(12px);
    pointer-events:none;
}

.eyebrow{
    padding:10px 13px;
    border-color:#303030;
    background:#090909;
}
.hero-copy h1{
    position:relative;
    max-width:850px;
    margin-top:28px;
    font-size:clamp(68px,7.5vw,116px);
    line-height:.86;
    letter-spacing:-.085em;
}
.hero-copy h1 span{color:#737373}
.hero-copy>p{
    max-width:590px;
    margin-top:34px;
    color:#858585;
    font-size:15px;
    line-height:1.85;
}
.hero-buttons{margin-top:36px;gap:12px}
.button{min-height:52px;padding:0 21px;border-radius:12px;font-size:9px}
.button-light{box-shadow:0 10px 30px rgba(255,255,255,.06)}
.button-light:hover{box-shadow:0 14px 40px rgba(255,255,255,.11)}

.trust-row{max-width:650px;margin-top:65px}
.trust-row div{padding:20px 15px}
.trust-row strong{font-size:16px}

.hero-visual{
    position:relative;
    padding:15px;
    border-color:#303030;
    border-radius:22px;
    background:linear-gradient(145deg,#0d0d0d,#070707);
    box-shadow:0 45px 120px rgba(0,0,0,.72),inset 0 1px 0 rgba(255,255,255,.04);
    transform:perspective(1200px) rotateY(-2deg) rotateX(1deg);
    transition:transform .5s ease,box-shadow .5s ease;
}
.hero-visual:hover{
    transform:perspective(1200px) rotateY(0) rotateX(0) translateY(-5px);
    box-shadow:0 55px 140px rgba(0,0,0,.8),inset 0 1px 0 rgba(255,255,255,.05);
}
.visual-screen{
    padding:20px;
    min-height:470px;
    border-color:#303030;
    border-radius:15px;
    background:linear-gradient(145deg,#151515,#080808 65%);
    box-shadow:inset 0 0 70px rgba(255,255,255,.018);
}
.preview-large{min-height:290px;background:linear-gradient(145deg,#121212,#090909)}
.preview-large>strong{font-size:40px}
.preview-large>b{font-size:12px}
.preview-side div{padding:18px}
.preview-lines{padding-top:16px}

.stats-section{
    width:min(1400px,calc(100% - 42px));
    border-color:#252525;
    background:rgba(255,255,255,.008);
}
.stat-box{min-height:145px;padding:30px 25px}
.stat-box strong{font-size:42px}
.stat-box small{font-size:7px}

.store-section,.compatibility-section,.showcase-section,.development-section,.process-section,.features,.faq-section,.final-cta,.deal-section{
    width:min(1400px,calc(100% - 42px));
}
.store-section{margin-top:150px}
.section-head,.showcase-head,.process-head{margin-bottom:34px}
.section-head h2,.showcase-head h2,.process-head h2,.compatibility-copy h2,.development-intro h2,.faq-head h2{
    font-size:50px;
    letter-spacing:-.07em;
}
.section-head>p{max-width:470px;font-size:11px;line-height:1.8}

.product-grid{gap:16px}
.product-card{
    border-color:#292929;
    border-radius:18px;
    background:linear-gradient(145deg,#0b0b0b,#070707);
    box-shadow:0 20px 50px rgba(0,0,0,.25);
}
.product-card:hover{
    transform:translateY(-9px);
    border-color:#444;
    box-shadow:0 30px 70px rgba(0,0,0,.5);
}
.product-art{
    height:310px;
    background:#0b0b0b;
}
.product-art:after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(135deg,rgba(255,255,255,.06),transparent 35%,transparent 65%,rgba(255,255,255,.025));
    pointer-events:none;
}
.art-one{background:radial-gradient(circle at 50% 30%,#3b3b3b,#151515 42%,#070707 76%)}
.art-two{background:radial-gradient(circle at 30% 35%,#343434,#141414 44%,#070707 76%)}
.art-three{background:radial-gradient(circle at 70% 25%,#3b3b3b,#141414 44%,#070707 76%)}
.art-center{z-index:1}
.art-center img{width:72px;height:72px;filter:drop-shadow(0 15px 25px rgba(0,0,0,.65));margin-bottom:20px}
.art-center i{font-size:38px}
.art-center b{font-size:23px}
.product-info{padding:24px}
.product-info h3{font-size:19px;margin-top:14px}
.product-info p{font-size:10px;line-height:1.8;min-height:56px;color:#777}
.add-cart,.product-info>a{
    width:100%;
    min-height:47px;
    margin-top:17px;
    border:1px solid #303030;
    border-radius:10px;
    background:#111;
    color:#ddd;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0 14px;
    cursor:pointer;
    font-size:8px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.08em;
    transition:.22s ease;
}
.add-cart:hover,.product-info>a:hover{background:#eee;color:#050505;border-color:#eee;transform:translateY(-2px)}

.compatibility-section{
    margin-top:160px;
    padding:42px;
    border:1px solid #242424;
    border-radius:22px;
    background:linear-gradient(135deg,#0b0b0b,#070707);
    display:grid;
    grid-template-columns:.8fr 1.2fr;
    gap:70px;
    align-items:center;
    box-shadow:0 30px 80px rgba(0,0,0,.3);
}
.compatibility-grid{gap:10px}
.compatibility-card{
    min-height:150px;
    border-color:#292929;
    border-radius:15px;
    background:#0c0c0c;
    transition:.22s ease;
}
.compatibility-card:hover{transform:translateY(-5px);border-color:#444;background:#111}
.compatibility-card strong{font-size:25px}

.showcase-section{margin-top:160px}
.showcase-grid{gap:16px}
.showcase-card{
    border-color:#292929;
    border-radius:18px;
    background:linear-gradient(145deg,#0c0c0c,#070707);
    box-shadow:0 25px 65px rgba(0,0,0,.28);
    transition:.3s ease;
}
.showcase-card:hover{transform:translateY(-7px);border-color:#444;box-shadow:0 35px 80px rgba(0,0,0,.48)}
.showcase-ui{margin:13px;border-radius:13px;border-color:#292929;box-shadow:inset 0 0 45px rgba(255,255,255,.02)}
.showcase-info{padding:22px 22px 25px}
.showcase-info strong{font-size:18px}
.showcase-info p{font-size:9px;margin-top:8px;color:#686868}
.banking-ui{background:linear-gradient(145deg,#161616,#090909)}
.radio-ui,.code-ui{background:#0b0b0b}

.deal-section{
    margin-top:160px;
    min-height:210px;
    padding:35px 42px;
    border:1px solid #333;
    border-radius:22px;
    background:linear-gradient(110deg,#181818,#0b0b0b 58%,#080808);
    box-shadow:0 30px 100px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.04);
    position:relative;
    overflow:hidden;
}
.deal-section:after{
    content:"";
    position:absolute;
    width:420px;height:420px;
    right:-160px;top:-160px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:50%;
    box-shadow:0 0 0 50px rgba(255,255,255,.015),0 0 0 100px rgba(255,255,255,.01);
    pointer-events:none;
}
.deal-badge{width:52px;height:52px;border:1px solid #383838;background:#111;border-radius:14px;z-index:1}
.deal-section h2{font-size:34px;letter-spacing:-.06em}
.deal-section p{font-size:10px;color:#777}
.deal-section .button{z-index:1}

.development-section{margin-top:160px}
.development-services{border-top:1px solid #252525}
.service-row{padding:25px 8px;border-bottom:1px solid #252525;transition:.2s ease}
.service-row:hover{padding-left:17px;background:rgba(255,255,255,.015)}
.service-row strong{font-size:14px}
.service-row p{font-size:9px;color:#666}

.process-section{margin-top:160px}
.process-grid{gap:1px;background:#242424;border:1px solid #242424}
.process-item{min-height:190px;padding:26px;background:#090909;transition:.22s ease}
.process-item:hover{background:#111}
.process-item i{font-size:20px;margin-top:35px}
.process-item strong{font-size:16px}
.process-item p{font-size:9px;color:#666;line-height:1.7}

.features{margin-top:160px}
.feature-list{border-top:1px solid #252525}
.feature-item{padding:27px 5px;border-bottom:1px solid #252525;transition:.2s ease}
.feature-item:hover{padding-left:16px;background:rgba(255,255,255,.012)}
.feature-item b{font-size:15px}
.feature-item p{font-size:9px;color:#666}

.faq-section{margin-top:160px}
.faq-row,.faq-item{border-color:#292929!important;background:#090909;transition:.22s ease}
.faq-row:hover,.faq-item:hover{background:#101010}
.faq-row.open,.faq-item.open{background:#111;border-color:#3a3a3a!important}

.final-cta{margin-top:160px;min-height:310px;border-radius:24px;background:linear-gradient(135deg,#181818,#080808);border-color:#333;box-shadow:0 35px 100px rgba(0,0,0,.5)}
.final-cta h2{font-size:56px;letter-spacing:-.075em}

.reveal-on-scroll{opacity:1;transform:none;transition:opacity .7s ease,transform .7s ease}
.reveal-on-scroll.revealed{opacity:1;transform:none}

@media(max-width:1050px){
    .brand{min-width:190px}
    .nav-tabs a{padding:10px 11px}
    .hero-shell{grid-template-columns:1fr;gap:35px}
    .hero-visual{max-width:800px;width:100%;margin:auto}
    .compatibility-section{grid-template-columns:1fr}
}

@media(max-width:760px){
    .navbar{width:calc(100% - 24px);margin-top:10px;height:64px;padding:0 9px 0 12px}
    .brand{min-width:auto}
    .brand-text small{display:none}
    .nav-tabs,.nav-actions{display:none}
    .mobile-toggle{display:grid;place-items:center;margin-left:auto}
    .hero-shell,.stats-section,.store-section,.compatibility-section,.showcase-section,.development-section,.process-section,.features,.faq-section,.final-cta,.deal-section{width:calc(100% - 24px)}
    .hero-shell{margin-top:48px;min-height:auto}
    .hero-copy h1{font-size:clamp(58px,17vw,88px)}
    .hero-copy>p{font-size:12px}
    .trust-row{grid-template-columns:repeat(2,1fr);margin-top:45px}
    .trust-row div:nth-child(2){border-right:0}
    .hero-visual{transform:none;padding:9px}
    .visual-screen{padding:13px;min-height:auto}
    .preview-main{grid-template-columns:1fr}
    .preview-side{display:grid;grid-template-columns:repeat(3,1fr)}
    .preview-side div{border-right:1px solid #202020;border-bottom:0}
    .preview-large{min-height:230px}
    .preview-large>strong{font-size:30px}
    .preview-lines{flex-wrap:wrap}
    .stats-section{grid-template-columns:repeat(2,1fr)}
    .stat-box:nth-child(2){border-right:0}
    .section-head,.showcase-head,.process-head{display:block}
    .section-head>p{text-align:left;margin-top:15px}
    .section-head h2,.showcase-head h2,.process-head h2,.compatibility-copy h2,.development-intro h2,.faq-head h2{font-size:38px}
    .product-grid{grid-template-columns:1fr}
    .product-art{height:260px}
    .compatibility-section{padding:25px;margin-top:100px}
    .compatibility-grid{grid-template-columns:1fr 1fr}
    .showcase-grid{grid-template-columns:1fr}
    .deal-section{padding:28px;display:block}
    .deal-section .button{margin-top:22px}
    .development-section,.process-section,.features,.faq-section,.final-cta{margin-top:110px}
    .final-cta h2{font-size:40px}
}


/* DFSCRIPTS EXPANDED CONTENT */

.updates-section {
    width: min(1440px, calc(100% - 48px));
    margin: 0 auto;
    padding: 125px 0 30px;
}

.updates-head {
    margin-bottom: 34px;
}

.updates-grid {
    display: grid;
    grid-template-columns: 1.25fr .875fr .875fr 1.25fr;
    gap: 14px;
}

.update-card {
    position: relative;
    min-height: 310px;
    padding: 28px;
    border: 1px solid #202020;
    border-radius: 18px;
    background:
        radial-gradient(500px circle at var(--mouse-x, 80%) var(--mouse-y, 10%), rgba(255,255,255,.055), transparent 45%),
        linear-gradient(145deg, #101010, #080808);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    transition: transform .3s ease, border-color .3s ease, box-shadow .3s ease;
}

.update-card::before {
    content: "";
    position: absolute;
    width: 230px;
    height: 230px;
    top: -115px;
    right: -75px;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 50%;
    box-shadow:
        0 0 0 28px rgba(255,255,255,.018),
        0 0 0 56px rgba(255,255,255,.012);
    pointer-events: none;
}

.update-card:hover {
    transform: translateY(-7px);
    border-color: #363636;
    box-shadow: 0 25px 70px rgba(0,0,0,.38);
}

.update-wide {
    grid-column: span 2;
}

.update-number {
    position: absolute;
    top: 23px;
    right: 25px;
    color: #3f3f3f;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .16em;
}

.update-icon {
    width: 46px;
    height: 46px;
    margin-bottom: auto;
    border: 1px solid #2b2b2b;
    border-radius: 12px;
    background: #141414;
    display: grid;
    place-items: center;
    color: #e9e9e9;
    font-size: 14px;
    box-shadow: inset 0 1px rgba(255,255,255,.04);
}

.update-content {
    position: relative;
    z-index: 2;
    max-width: 540px;
    margin-top: 58px;
}

.update-content > span {
    color: #5e5e5e;
    font-size: 7px;
    font-weight: 900;
    letter-spacing: .16em;
}

.update-content h3 {
    margin: 9px 0 10px;
    color: #f5f5f5;
    font-size: clamp(20px, 2vw, 29px);
    line-height: 1.05;
    letter-spacing: -.055em;
}

.update-content p {
    max-width: 560px;
    margin: 0;
    color: #777;
    font-size: 10px;
    line-height: 1.75;
}

.update-arrow {
    position: absolute;
    right: 26px;
    bottom: 25px;
    color: #4f4f4f;
    font-size: 10px;
}

.update-link {
    position: absolute;
    right: 25px;
    bottom: 24px;
    z-index: 3;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 10px 13px;
    border: 1px solid #2c2c2c;
    border-radius: 8px;
    background: #111;
    color: #d7d7d7;
    font-size: 8px;
    font-weight: 900;
    text-decoration: none;
    transition: .2s ease;
}

.update-link:hover {
    border-color: #454545;
    background: #171717;
    color: #fff;
}

@media (max-width: 1050px) {
    .updates-grid {
        grid-template-columns: 1fr 1fr;
    }

    .update-wide {
        grid-column: span 2;
    }
}

@media (max-width: 680px) {
    .updates-section {
        width: min(100% - 28px, 1440px);
        padding-top: 80px;
    }

    .updates-grid {
        grid-template-columns: 1fr;
    }

    .update-wide {
        grid-column: span 1;
    }

    .update-card {
        min-height: 270px;
        padding: 22px;
    }
}

.request-card .product-art {
    position: relative;
    overflow: hidden;
}

.request-card .product-art::before,
.request-card .product-art::after {
    content: "";
    position: absolute;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 50%;
    pointer-events: none;
}

.request-card .product-art::before {
    width: 260px;
    height: 260px;
    left: -70px;
    top: -90px;
}

.request-card .product-art::after {
    width: 190px;
    height: 190px;
    right: -55px;
    bottom: -75px;
}

.request-card .art-center i {
    font-size: 38px;
    margin-bottom: 10px;
}

.request-card:hover .art-center i {
    transform: translateY(-3px) rotate(-4deg);
}

.request-card .product-info > a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
}

@media (min-width: 1100px) {
    .product-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 1099px) and (min-width: 720px) {
    .product-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.custom-only-grid {
    grid-template-columns: minmax(0, 760px);
    justify-content: center;
}

.custom-request-product {
    width: 100%;
}

.custom-request-product .product-art {
    min-height: 300px;
}

.tech-marquee {
    width: min(1440px, calc(100% - 48px));
    margin: 20px auto 0;
    padding: 34px 0 18px;
    overflow: hidden;
}

.tech-marquee-top {
    width: min(1180px, 100%);
    margin: 0 auto 18px;
    padding: 0 8px;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 30px;
}

.tech-marquee-top p {
    margin: 0;
    color: #666;
    font-size: 10px;
    letter-spacing: .02em;
}

.tech-marquee-window {
    position: relative;
    width: 100vw;
    margin-left: 50%;
    transform: translateX(-50%);
    overflow: hidden;
    border-top: 1px solid #202020;
    border-bottom: 1px solid #202020;
    background: #080808;
}

.tech-marquee-window::before,
.tech-marquee-window::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    width: 180px;
    z-index: 2;
    pointer-events: none;
}

.tech-marquee-window::before {
    left: 0;
    background: linear-gradient(90deg, #080808 5%, rgba(8,8,8,0));
}

.tech-marquee-window::after {
    right: 0;
    background: linear-gradient(270deg, #080808 5%, rgba(8,8,8,0));
}

.tech-marquee-track {
    width: max-content;
    display: flex;
    animation: dfsTechMarquee 34s linear infinite;
    will-change: transform;
}

.tech-marquee-group {
    display: flex;
    align-items: center;
    gap: 28px;
    min-width: max-content;
    padding: 25px 28px;
}

.tech-marquee-group span {
    color: #f3f3f3;
    font-size: clamp(15px, 1.3vw, 21px);
    font-weight: 900;
    letter-spacing: .08em;
    white-space: nowrap;
}

.tech-marquee-group i {
    color: #3d3d3d;
    font-size: 13px;
    font-style: normal;
}

.tech-marquee:hover .tech-marquee-track {
    animation-play-state: paused;
}

@keyframes dfsTechMarquee {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-50%);
    }
}

@media (max-width: 760px) {
    .custom-only-grid {
        grid-template-columns: 1fr;
    }

    .tech-marquee {
        width: 100%;
        padding-top: 24px;
    }

    .tech-marquee-top {
        padding: 0 18px;
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
    }

    .tech-marquee-window::before,
    .tech-marquee-window::after {
        width: 80px;
    }

    .tech-marquee-group {
        gap: 20px;
        padding: 22px 20px;
    }
}

.dfs-store-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
}

.dfs-store-grid .custom-request-product {
    grid-column: span 2;
}

.soon-product {
    opacity: .94;
}

.soon-product .product-art {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 50% 50%, rgba(255,255,255,.07), transparent 34%),
        linear-gradient(135deg, #171717 0%, #0d0d0d 55%, #151515 100%);
}

.soon-product .product-art::before,
.soon-product .product-art::after {
    content: "";
    position: absolute;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 50%;
    pointer-events: none;
}

.soon-product .product-art::before {
    width: 300px;
    height: 300px;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.soon-product .product-art::after {
    width: 210px;
    height: 210px;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.soon-product .art-center {
    position: relative;
    z-index: 2;
}

.soon-product .art-center i {
    color: #d8d8d8;
    font-size: 34px;
    margin-bottom: 12px;
    opacity: .8;
}

.soon-product .art-center b {
    letter-spacing: .08em;
}

.soon-product .art-center small {
    color: #6d6d6d;
}

.soon-product:hover .product-art::before {
    transform: translate(-50%, -50%) scale(1.04);
}

.soon-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    width: 100%;
    min-height: 48px;
    padding: 0 16px;
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 8px;
    background: #111;
    color: #8d8d8d;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.soon-button i {
    font-size: 10px;
}

@media (min-width: 1100px) {
    .dfs-store-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .dfs-store-grid .custom-request-product {
        grid-column: span 3;
    }
}

@media (max-width: 719px) {
    .dfs-store-grid,
    .dfs-store-grid .custom-request-product {
        grid-template-columns: 1fr;
        grid-column: auto;
    }

    .dfs-store-grid .custom-request-product {
        width: 100%;
    }
}


/* DFSCRIPTS STORE REFINEMENT */
.dfs-store-grid{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:14px !important;
    align-items:stretch;
}

.dfs-store-grid .custom-request-product{
    grid-column:1 / -1 !important;
    display:grid;
    grid-template-columns:360px minmax(0,1fr);
    min-height:270px;
}

.dfs-store-grid .custom-request-product .product-art{
    height:100%;
    min-height:270px;
}

.dfs-store-grid .custom-request-product .product-info{
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:30px 34px;
}

.dfs-store-grid .custom-request-product .product-info h3{
    font-size:27px;
    letter-spacing:-.045em;
    margin:12px 0 8px;
}

.dfs-store-grid .custom-request-product .product-info p{
    max-width:620px;
    min-height:0;
    font-size:11px;
    line-height:1.75;
}

.dfs-store-grid .custom-request-product .product-info>a{
    width:max-content;
    min-width:190px;
    margin-top:18px;
}

.dfs-store-grid .soon-product{
    min-width:0;
    border-radius:14px;
    background:linear-gradient(145deg,#0d0d0d,#080808);
}

.dfs-store-grid .soon-product .product-art{
    height:150px;
    min-height:150px;
}

.dfs-store-grid .soon-product .product-art:before{
    width:145px;
    height:145px;
    box-shadow:0 0 0 24px rgba(255,255,255,.014),0 0 0 48px rgba(255,255,255,.008);
}

.dfs-store-grid .soon-product .product-art:after{
    background:linear-gradient(120deg,rgba(255,255,255,.055),transparent 45%,rgba(255,255,255,.015));
}

.dfs-store-grid .soon-product .art-label{
    top:11px;
    left:11px;
    padding:6px 8px;
    font-size:7px;
    letter-spacing:.12em;
}

.dfs-store-grid .soon-product .art-center i{
    font-size:24px;
    margin-bottom:8px;
}

.dfs-store-grid .soon-product .art-center b{
    display:block;
    font-size:14px;
    letter-spacing:.08em;
}

.dfs-store-grid .soon-product .art-center small{
    font-size:6px;
    margin-top:4px;
}

.dfs-store-grid .soon-product .product-info{
    padding:18px;
}

.dfs-store-grid .soon-product .tag-row{
    font-size:7px;
}

.dfs-store-grid .soon-product .product-info h3{
    font-size:16px;
    margin:10px 0 6px;
    letter-spacing:-.03em;
}

.dfs-store-grid .soon-product .product-info p{
    min-height:0;
    font-size:9px;
    line-height:1.65;
    margin-bottom:14px;
}

.dfs-store-grid .soon-button{
    min-height:38px;
    font-size:8px;
    border-radius:7px;
}

/* DF LAB */
.df-lab{
    width:min(1400px,calc(100% - 42px));
    margin:110px auto 0;
    position:relative;
    overflow:hidden;
    border:1px solid #242424;
    border-radius:22px;
    background:
        radial-gradient(circle at 50% 25%,rgba(255,255,255,.055),transparent 28%),
        linear-gradient(145deg,#0d0d0d,#070707 70%);
    box-shadow:0 35px 100px rgba(0,0,0,.38);
}

.df-lab:before{
    content:"";
    position:absolute;
    inset:0;
    background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
    background-size:48px 48px;
    mask-image:linear-gradient(to bottom,black,transparent 88%);
    pointer-events:none;
}

.df-lab-head{
    position:relative;
    z-index:2;
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    padding:38px 42px 10px;
}

.df-lab-head h2{
    margin:10px 0 0;
    font-size:46px;
    line-height:.98;
    letter-spacing:-.065em;
}

.df-lab-head h2 span{color:#555}

.df-lab-status{
    display:flex;
    align-items:center;
    gap:9px;
    padding:9px 12px;
    border:1px solid #292929;
    border-radius:999px;
    color:#888;
    font-size:7px;
    font-weight:900;
    letter-spacing:.12em;
}

.df-lab-status i{
    width:6px;
    height:6px;
    border-radius:50%;
    background:#a8a8a8;
    box-shadow:0 0 12px rgba(255,255,255,.45);
    animation:dfPulse 1.8s infinite;
}

.df-lab-stage{
    position:relative;
    z-index:1;
    height:280px;
    display:grid;
    place-items:center;
    overflow:hidden;
}

.df-lab-stage:before{
    content:"";
    position:absolute;
    width:430px;
    height:430px;
    border-radius:50%;
    background:radial-gradient(circle,rgba(255,255,255,.055),transparent 62%);
}

.df-lab-core{
    position:relative;
    z-index:4;
    width:138px;
    height:138px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    border:1px solid #333;
    border-radius:50%;
    background:radial-gradient(circle at 50% 35%,#202020,#0b0b0b 72%);
    box-shadow:0 0 0 15px rgba(255,255,255,.018),0 0 0 38px rgba(255,255,255,.008),0 20px 70px rgba(0,0,0,.7);
}

.df-lab-core span{
    font-size:27px;
    font-weight:1000;
    letter-spacing:-.08em;
}

.df-lab-core b{
    margin-top:-2px;
    font-size:9px;
    letter-spacing:.18em;
}

.df-lab-core small{
    margin-top:8px;
    color:#555;
    font-size:5px;
    letter-spacing:.18em;
}

.df-lab-orbit{
    position:absolute;
    left:50%;
    top:50%;
    border:1px solid rgba(255,255,255,.09);
    border-radius:50%;
    transform:translate(-50%,-50%);
}

.orbit-one{width:230px;height:230px;animation:dfOrbit 14s linear infinite}
.orbit-two{width:360px;height:360px;border-style:dashed;opacity:.55;animation:dfOrbitReverse 20s linear infinite}

.df-lab-scan{
    position:absolute;
    z-index:3;
    width:420px;
    height:1px;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);
    box-shadow:0 0 18px rgba(255,255,255,.12);
    animation:dfScan 3.8s ease-in-out infinite;
}

.df-lab-grid{
    position:relative;
    z-index:3;
    display:grid;
    grid-template-columns:repeat(4,1fr);
    margin:0 24px 24px;
    border:1px solid #202020;
    border-radius:14px;
    overflow:hidden;
    background:rgba(5,5,5,.62);
}

.df-lab-item{
    position:relative;
    min-height:150px;
    padding:20px;
    border-right:1px solid #202020;
    transition:.25s ease;
}

.df-lab-item:last-child{border-right:0}
.df-lab-item:hover{background:rgba(255,255,255,.025);transform:translateY(-2px)}

.df-lab-item>span{
    color:#444;
    font-size:8px;
    font-weight:900;
    letter-spacing:.1em;
}

.df-lab-item strong{
    display:block;
    margin-top:20px;
    font-size:14px;
    letter-spacing:-.02em;
}

.df-lab-item p{
    margin:7px 0 18px;
    color:#666;
    font-size:9px;
    line-height:1.65;
}

.lab-state{
    color:#777;
    font-size:6px;
    letter-spacing:.14em;
}

@keyframes dfOrbit{to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes dfOrbitReverse{to{transform:translate(-50%,-50%) rotate(-360deg)}}
@keyframes dfScan{0%,100%{transform:translateY(-100px);opacity:0}15%,85%{opacity:1}50%{transform:translateY(100px)}}
@keyframes dfPulse{50%{opacity:.35;transform:scale(.7)}}

@media (max-width:1099px){
    .dfs-store-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
    .dfs-store-grid .custom-request-product{grid-column:1 / -1 !important}
    .df-lab-grid{grid-template-columns:repeat(2,1fr)}
    .df-lab-item:nth-child(2){border-right:0}
    .df-lab-item:nth-child(-n+2){border-bottom:1px solid #202020}
}

@media (max-width:719px){
    .dfs-store-grid{grid-template-columns:1fr !important}
    .dfs-store-grid .custom-request-product{grid-template-columns:1fr;min-height:0}
    .dfs-store-grid .custom-request-product .product-art{height:190px;min-height:190px}
    .dfs-store-grid .custom-request-product .product-info{padding:22px}
    .dfs-store-grid .custom-request-product .product-info h3{font-size:22px}
    .dfs-store-grid .soon-product .product-art{height:125px;min-height:125px}
    .df-lab{width:calc(100% - 28px);margin-top:70px;border-radius:17px}
    .df-lab-head{padding:28px 22px 8px;align-items:flex-start;flex-direction:column;gap:18px}
    .df-lab-head h2{font-size:34px}
    .df-lab-stage{height:230px}
    .df-lab-grid{grid-template-columns:1fr;margin:0 14px 14px}
    .df-lab-item{border-right:0;border-bottom:1px solid #202020}
    .df-lab-item:last-child{border-bottom:0}
}

/* STORE / SCROLL REFINEMENT */
html{
    scrollbar-width:thin;
    scrollbar-color:#3a3a3a #070707;
}

body{
    scrollbar-width:thin;
    scrollbar-color:#3a3a3a #070707;
}

::-webkit-scrollbar{
    width:9px;
    height:9px;
}

::-webkit-scrollbar-track{
    background:#070707;
}

::-webkit-scrollbar-thumb{
    background:linear-gradient(180deg,#3d3d3d,#222);
    border:2px solid #070707;
    border-radius:999px;
}

::-webkit-scrollbar-thumb:hover{
    background:linear-gradient(180deg,#5a5a5a,#303030);
}

::-webkit-scrollbar-corner{
    background:#070707;
}

.compact-product-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:12px;
    max-width:1040px;
    margin:0 auto;
}

.compact-product-grid .product-card{
    position:relative;
    min-height:0;
    height:118px;
    display:grid;
    grid-template-columns:64px minmax(0,1fr) auto;
    align-items:center;
    gap:16px;
    padding:14px;
    border-radius:13px;
    background:linear-gradient(135deg,#101010 0%,#080808 70%);
    border-color:#242424;
    box-shadow:0 12px 35px rgba(0,0,0,.24);
    overflow:hidden;
}

.compact-product-grid .product-card:before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(105deg,rgba(255,255,255,.045),transparent 30%,transparent 70%,rgba(255,255,255,.018));
    pointer-events:none;
}

.compact-product-grid .product-card:hover{
    transform:translateY(-3px);
    border-color:#3b3b3b;
    box-shadow:0 18px 45px rgba(0,0,0,.42);
}

.compact-product-grid .custom-request-product{
    grid-column:1 / -1;
    height:142px;
    grid-template-columns:72px minmax(0,1fr) auto;
    border-color:#353535;
    background:linear-gradient(120deg,#161616 0%,#0b0b0b 52%,#070707 100%);
}

.product-mini-icon{
    position:relative;
    z-index:1;
    width:64px;
    height:64px;
    display:grid;
    place-items:center;
    border:1px solid #303030;
    border-radius:14px;
    background:radial-gradient(circle at 50% 35%,#2b2b2b,#111 62%,#0a0a0a);
    box-shadow:inset 0 0 25px rgba(255,255,255,.025),0 8px 24px rgba(0,0,0,.35);
}

.custom-request-product .product-mini-icon{
    width:72px;
    height:72px;
    border-radius:16px;
    background:linear-gradient(145deg,#303030,#111);
}

.product-mini-icon i{
    color:#e7e7e7;
    font-size:20px;
    transition:transform .3s ease;
}

.custom-request-product .product-mini-icon i{font-size:24px}

.compact-product-grid .product-card:hover .product-mini-icon i{
    transform:scale(1.12) rotate(-4deg);
}

.product-copy{
    position:relative;
    z-index:1;
    min-width:0;
}

.product-topline{
    display:flex;
    align-items:center;
    gap:8px;
    margin-bottom:6px;
}

.product-topline span,
.product-topline b{
    font-size:6px;
    line-height:1;
    font-weight:900;
    letter-spacing:.14em;
    color:#666;
}

.product-topline b{
    color:#9a9a9a;
}

.compact-product-grid h3{
    margin:0;
    color:#f2f2f2;
    font-size:14px;
    line-height:1.15;
    letter-spacing:-.025em;
}

.compact-product-grid p{
    margin:6px 0 0;
    max-width:500px;
    color:#666;
    font-size:8px;
    line-height:1.5;
}

.compact-product-grid .soon-pill{
    position:relative;
    z-index:1;
    align-self:center;
    padding:7px 9px;
    border:1px solid #2c2c2c;
    border-radius:6px;
    background:#0b0b0b;
    color:#777;
    font-size:6px;
    font-weight:900;
    letter-spacing:.14em;
}

.compact-product-grid .product-action{
    position:relative;
    z-index:1;
    display:inline-flex;
    align-items:center;
    gap:9px;
    padding:11px 14px;
    border:1px solid #383838;
    border-radius:8px;
    background:#151515;
    color:#f3f3f3;
    font-size:7px;
    font-weight:900;
    letter-spacing:.1em;
    text-decoration:none;
    transition:.25s ease;
}

.compact-product-grid .product-action:hover{
    background:#222;
    border-color:#555;
    transform:translateX(2px);
}

.compact-product-grid .product-action i{font-size:9px}

.release-radar{
    position:relative;
    width:min(1040px,calc(100% - 42px));
    margin:28px auto 0;
    padding:22px 24px 18px;
    border:1px solid #242424;
    border-radius:15px;
    background:
        radial-gradient(circle at 90% 0%,rgba(255,255,255,.045),transparent 30%),
        linear-gradient(135deg,#0e0e0e,#080808);
    overflow:hidden;
}

.release-radar:before{
    content:"";
    position:absolute;
    inset:0;
    background:repeating-linear-gradient(90deg,transparent 0,transparent 79px,rgba(255,255,255,.018) 80px);
    pointer-events:none;
}

.release-radar-head,
.release-track,
.release-radar-foot{
    position:relative;
    z-index:1;
}

.release-radar-head{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:20px;
}

.release-radar-head h3{
    margin:7px 0 0;
    font-size:23px;
    letter-spacing:-.045em;
}

.release-radar-head h3 span{color:#555}

.radar-live{
    display:flex;
    align-items:center;
    gap:7px;
    color:#777;
    font-size:6px;
    font-weight:900;
    letter-spacing:.14em;
}

.radar-live i{
    width:6px;
    height:6px;
    border-radius:50%;
    background:#aaa;
    box-shadow:0 0 0 5px rgba(255,255,255,.04);
    animation:radarPulse 1.8s infinite;
}

.release-track{
    position:relative;
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:12px;
    margin-top:26px;
}

.release-line{
    position:absolute;
    left:4%;
    right:4%;
    top:13px;
    height:1px;
    background:#292929;
}

.release-line span{
    display:block;
    width:34%;
    height:100%;
    background:linear-gradient(90deg,#777,#333);
    box-shadow:0 0 12px rgba(255,255,255,.14);
}

.release-step{
    position:relative;
    display:flex;
    flex-direction:column;
    gap:5px;
    padding-top:27px;
}

.release-step:before{
    content:"";
    position:absolute;
    top:8px;
    left:0;
    width:11px;
    height:11px;
    border:2px solid #292929;
    border-radius:50%;
    background:#090909;
    box-sizing:border-box;
}

.release-step.active:before{
    border-color:#aaa;
    box-shadow:0 0 0 5px rgba(255,255,255,.04),0 0 18px rgba(255,255,255,.14);
}

.release-step b{color:#555;font-size:6px;letter-spacing:.12em}
.release-step strong{font-size:10px;color:#ddd}
.release-step small{color:#555;font-size:6px;font-weight:900;letter-spacing:.12em}

.release-radar-foot{
    display:flex;
    justify-content:space-between;
    gap:20px;
    margin-top:23px;
    padding-top:13px;
    border-top:1px solid #1d1d1d;
    color:#4e4e4e;
    font-size:6px;
    font-weight:900;
    letter-spacing:.13em;
}

.release-radar-foot b{color:#777}

@keyframes radarPulse{50%{opacity:.35;transform:scale(.72)}}

@media(max-width:1099px){
    .compact-product-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
    .compact-product-grid .custom-request-product{grid-column:1 / -1 !important}
}

@media(max-width:719px){
    .compact-product-grid{grid-template-columns:1fr !important;width:100%}
    .compact-product-grid .product-card,
    .compact-product-grid .custom-request-product{
        grid-column:auto !important;
        height:auto;
        min-height:108px;
        grid-template-columns:52px minmax(0,1fr) auto;
        gap:11px;
        padding:11px;
    }
    .compact-product-grid .custom-request-product{min-height:128px}
    .product-mini-icon{width:52px;height:52px;border-radius:12px}
    .custom-request-product .product-mini-icon{width:58px;height:58px}
    .product-mini-icon i{font-size:17px}
    .custom-request-product .product-mini-icon i{font-size:21px}
    .compact-product-grid h3{font-size:12px}
    .compact-product-grid p{font-size:7px}
    .compact-product-grid .soon-pill{padding:6px 7px;font-size:5px}
    .compact-product-grid .product-action{padding:9px 10px;font-size:6px}
    .release-radar{width:calc(100% - 28px);padding:19px 17px 15px}
    .release-radar-head{align-items:flex-start;flex-direction:column;gap:12px}
    .release-radar-head h3{font-size:20px}
    .release-track{grid-template-columns:repeat(2,1fr);gap:22px 14px}
    .release-line{display:none}
    .release-radar-foot{flex-direction:column;gap:8px}
}

.build-console{
    width:min(1180px,calc(100% - 48px));
    margin:34px auto 0;
    padding:26px;
    border:1px solid #242424;
    border-radius:18px;
    background:
        radial-gradient(circle at 82% 20%,rgba(255,255,255,.045),transparent 28%),
        linear-gradient(135deg,#0d0d0d,#080808 65%,#0b0b0b);
    position:relative;
    overflow:hidden;
    box-shadow:0 24px 70px rgba(0,0,0,.35);
}

.build-console:before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(105deg,transparent 0%,rgba(255,255,255,.025) 48%,transparent 52%);
    transform:translateX(-110%);
    animation:buildSweep 7s linear infinite;
    pointer-events:none;
}

@keyframes buildSweep{
    to{transform:translateX(110%)}
}

.build-console-head{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:20px;
    margin-bottom:20px;
    position:relative;
    z-index:1;
}

.build-console-head h3{
    margin:7px 0 0;
    font-size:24px;
    letter-spacing:-.04em;
}

.build-console-head h3 span{color:#555}

.console-status{
    display:flex;
    align-items:center;
    gap:8px;
    padding:9px 11px;
    border:1px solid #252525;
    border-radius:8px;
    background:#0a0a0a;
    color:#777;
    font-size:7px;
    font-weight:900;
    letter-spacing:.1em;
    white-space:nowrap;
}

.console-status i{
    width:6px;
    height:6px;
    border-radius:50%;
    background:#aaa;
    box-shadow:0 0 12px rgba(255,255,255,.35);
    animation:consolePulse 1.5s ease-in-out infinite;
}

@keyframes consolePulse{
    50%{opacity:.35;transform:scale(.7)}
}

.build-console-body{
    display:grid;
    grid-template-columns:minmax(0,1.7fr) minmax(220px,.8fr);
    gap:16px;
    position:relative;
    z-index:1;
}

.console-window{
    min-width:0;
    border:1px solid #292929;
    border-radius:13px;
    overflow:hidden;
    background:#050505;
    box-shadow:inset 0 1px rgba(255,255,255,.025),0 15px 40px rgba(0,0,0,.3);
}

.console-bar{
    height:36px;
    display:flex;
    align-items:center;
    gap:12px;
    padding:0 13px;
    border-bottom:1px solid #1e1e1e;
    background:#0c0c0c;
    color:#555;
    font-size:8px;
    font-family:monospace;
}

.console-bar>b{
    margin-left:auto;
    color:#8d8d8d;
    font-size:6px;
    letter-spacing:.12em;
}

.console-dots{display:flex;gap:4px}
.console-dots i{width:6px;height:6px;border-radius:50%;background:#2b2b2b}

.console-content{
    padding:16px 17px 18px;
    min-height:190px;
    font-family:monospace;
    font-size:8px;
    line-height:1.9;
}

.console-content p{
    margin:0;
    color:#555;
    white-space:nowrap;
    overflow:hidden;
}

.console-content p:nth-child(2){animation:consoleFlicker 4s ease-in-out infinite}
.console-content p:nth-child(4){animation:consoleFlicker 3.5s ease-in-out infinite .4s}

@keyframes consoleFlicker{
    0%,92%,100%{opacity:1}
    94%{opacity:.55}
}

.console-content em{
    display:inline-block;
    width:24px;
    color:#292929;
    font-style:normal;
}

.console-content p>span:first-of-type{color:#777;margin-right:8px}
.console-content strong{color:#aaa;font-weight:700}
.console-content .success{color:#bcbcbc}
.console-content .typing{letter-spacing:-1px;animation:blocks 1.7s steps(8) infinite}

@keyframes blocks{
    0%{opacity:.35;clip-path:inset(0 85% 0 0)}
    50%{opacity:1;clip-path:inset(0 35% 0 0)}
    100%{opacity:.7;clip-path:inset(0 0 0 0)}
}

.blink{color:#fff!important;animation:blinkCursor .85s steps(2) infinite}

@keyframes blinkCursor{50%{opacity:0}}

.build-metrics{display:grid;grid-template-rows:repeat(3,1fr);gap:10px}

.metric-card{
    padding:17px;
    border:1px solid #222;
    border-radius:12px;
    background:#0a0a0a;
    display:flex;
    flex-direction:column;
    justify-content:center;
    min-height:70px;
    position:relative;
    overflow:hidden;
}

.metric-card:after{
    content:"";
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    height:1px;
    background:linear-gradient(90deg,#444,transparent);
    transform:scaleX(.35);
    transform-origin:left;
    animation:metricLoad 3s ease-in-out infinite alternate;
}

.metric-card:nth-child(2):after{animation-delay:.6s}
.metric-card:nth-child(3):after{animation-delay:1.2s}

@keyframes metricLoad{
    to{transform:scaleX(.95)}
}

.metric-card span{
    color:#444;
    font-size:6px;
    font-weight:900;
    letter-spacing:.13em;
    margin-bottom:6px;
}

.metric-card strong{
    color:#ddd;
    font-size:12px;
    letter-spacing:-.02em;
}

.metric-line{
    height:2px;
    margin-top:12px;
    border-radius:10px;
    background:#171717;
    overflow:hidden;
}

.metric-line i{
    display:block;
    width:68%;
    height:100%;
    background:#555;
    animation:metricBar 2.4s ease-in-out infinite alternate;
}

.metric-card:nth-child(2) .metric-line i{width:84%;animation-delay:.4s}
.metric-card:nth-child(3) .metric-line i{width:52%;animation-delay:.8s}

@keyframes metricBar{
    to{width:96%}
}

@media(max-width:800px){
    .build-console{width:calc(100% - 28px);padding:18px;margin-top:24px}
    .build-console-head{align-items:flex-start;flex-direction:column}
    .build-console-head h3{font-size:20px}
    .build-console-body{grid-template-columns:1fr}
    .build-metrics{grid-template-columns:repeat(3,1fr);grid-template-rows:none}
    .metric-card{min-height:90px;padding:12px}
}

@media(max-width:560px){
    .build-console{border-radius:13px}
    .build-console-head h3{font-size:18px}
    .console-content{font-size:7px;padding:13px;min-height:165px}
    .build-metrics{grid-template-columns:1fr}
    .metric-card{min-height:70px}
    .console-status{font-size:6px}
}

.product-modal-trigger{
    cursor:pointer;
}

.product-modal-trigger:after{
    content:"";
    position:absolute;
    inset:0;
    border-radius:inherit;
    pointer-events:none;
    background:radial-gradient(circle at var(--mouse-x,50%) var(--mouse-y,50%),rgba(255,255,255,.055),transparent 32%);
    opacity:0;
    transition:opacity .25s ease;
}

.product-modal-trigger:hover:after{
    opacity:1;
}

.soon-card-meta{
    position:absolute;
    left:132px;
    right:14px;
    bottom:12px;
    min-height:18px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    pointer-events:none;
    z-index:4;
}

.soon-card-meta span{
    display:inline-flex;
    align-items:center;
    min-height:18px;
    padding:3px 7px;
    border:1px solid #2c2c2c;
    border-radius:5px;
    background:#111;
    color:#f2f2f2;
    font-size:8px;
    line-height:1;
    font-weight:900;
    letter-spacing:.02em;
    text-shadow:none;
    box-shadow:0 5px 18px rgba(0,0,0,.3);
}

.soon-card-meta b{
    color:#5f5f5f;
    font-size:7px;
    line-height:1;
    font-weight:900;
    letter-spacing:.13em;
    transition:color .2s ease;
}

.product-modal-trigger:hover .soon-card-meta span{
    border-color:#444;
    background:#151515;
}

.product-modal-trigger:hover .soon-card-meta b{
    color:#aaa;
}

.product-modal{
    position:fixed;
    inset:0;
    z-index:100000;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:28px;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:opacity .22s ease,visibility .22s ease;
}

.product-modal.open{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
}

.product-modal-backdrop{
    position:absolute;
    cursor:pointer;
    inset:0;
    z-index:0;
    background:rgba(0,0,0,.82);
    backdrop-filter:blur(15px);
}

.product-modal-window{
    position:relative;
    z-index:1;
    width:min(930px,100%);
    max-height:min(850px,calc(100vh - 56px));
    overflow:auto;
    border:1px solid #303030;
    border-radius:20px;
    background:#090909;
    box-shadow:0 40px 140px rgba(0,0,0,.9),0 0 0 1px rgba(255,255,255,.025);
    transform:translateY(18px) scale(.985);
    transition:transform .25s ease;
    scrollbar-width:thin;
    scrollbar-color:#454545 #090909;
}

.product-modal.open .product-modal-window{
    transform:translateY(0) scale(1);
}

.product-modal-window::-webkit-scrollbar{
    width:8px;
}

.product-modal-window::-webkit-scrollbar-track{
    background:#090909;
}

.product-modal-window::-webkit-scrollbar-thumb{
    background:linear-gradient(180deg,#4a4a4a,#252525);
    border:2px solid #090909;
    border-radius:999px;
}

.product-modal-close{
    position:absolute;
    top:16px;
    right:16px;
    z-index:5;
    width:38px;
    height:38px;
    border:1px solid #363636;
    border-radius:10px;
    background:rgba(10,10,10,.8);
    color:#777;
    font-size:20px;
    line-height:1;
    cursor:pointer;
    transition:.2s ease;
}

.product-modal-close:hover{
    color:#fff;
    border-color:#555;
    background:#151515;
    transform:rotate(4deg);
}

.product-modal-hero{
    position:relative;
    height:300px;
    overflow:hidden;
    border-bottom:1px solid #252525;
    background:
        radial-gradient(circle at 50% 42%,#252525 0,#141414 22%,#0a0a0a 56%,#070707 100%);
    display:flex;
    align-items:center;
    justify-content:center;
}

.product-modal-grid{
    position:absolute;
    inset:0;
    opacity:.32;
    background-image:
        linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
    background-size:42px 42px;
    mask-image:linear-gradient(to bottom,transparent,black 30%,black 70%,transparent);
}

.product-modal-soon{
    position:relative;
    z-index:2;
    width:168px;
    height:168px;
    border:1px solid #444;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#eee;
    font-size:27px;
    font-weight:1000;
    letter-spacing:.08em;
    background:radial-gradient(circle,#1b1b1b 0,#111 65%,#0b0b0b 100%);
    box-shadow:0 0 0 16px rgba(255,255,255,.018),0 0 0 38px rgba(255,255,255,.012),0 30px 80px rgba(0,0,0,.65);
    animation:productSoonPulse 3.5s ease-in-out infinite;
}

.product-modal-orbit{
    position:absolute;
    width:270px;
    height:270px;
    border:1px dashed rgba(255,255,255,.12);
    border-radius:50%;
    animation:productOrbit 14s linear infinite;
}

.orbit-one{
    transform:rotate(25deg) scaleX(1.3);
}

.orbit-two{
    width:340px;
    height:340px;
    border-color:rgba(255,255,255,.055);
    transform:rotate(-35deg) scaleY(.72);
    animation-duration:19s;
    animation-direction:reverse;
}

.product-modal-code{
    position:absolute;
    left:24px;
    bottom:20px;
    display:flex;
    flex-direction:column;
    gap:5px;
    z-index:2;
}

.product-modal-code span{
    color:#555;
    font-size:7px;
    font-weight:900;
    letter-spacing:.15em;
}

.product-modal-code b{
    color:#aaa;
    font-size:9px;
    letter-spacing:.12em;
}

@keyframes productSoonPulse{
    0%,100%{box-shadow:0 0 0 16px rgba(255,255,255,.018),0 0 0 38px rgba(255,255,255,.012),0 30px 80px rgba(0,0,0,.65)}
    50%{box-shadow:0 0 0 22px rgba(255,255,255,.025),0 0 0 48px rgba(255,255,255,.012),0 35px 95px rgba(0,0,0,.72)}
}

@keyframes productOrbit{
    to{transform:rotate(385deg) scaleX(1.3)}
}

.product-modal-content{
    padding:28px;
}

.product-modal-heading{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:24px;
}

.product-modal-heading > div{
    min-width:0;
}

.product-modal-heading span{
    color:#555;
    font-size:7px;
    font-weight:900;
    letter-spacing:.15em;
}

.product-modal-heading h2{
    margin:7px 0 0;
    color:#f1f1f1;
    font-size:28px;
    line-height:1.05;
    letter-spacing:-.035em;
}

.product-modal-heading > strong{
    color:#eee;
    font-size:20px;
    white-space:nowrap;
    letter-spacing:-.025em;
}

#productModalDescription{
    max-width:760px;
    margin:14px 0 0;
    color:#777;
    font-size:10px;
    line-height:1.75;
}

.product-modal-divider{
    height:1px;
    margin:24px 0 20px;
    background:linear-gradient(90deg,#303030,transparent);
}

.product-modal-section-title{
    margin-bottom:12px;
    color:#555;
    font-size:7px;
    font-weight:900;
    letter-spacing:.15em;
}

.product-modal-features{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.product-modal-feature{
    display:flex;
    align-items:center;
    gap:9px;
    min-height:42px;
    padding:0 12px;
    border:1px solid #202020;
    border-radius:9px;
    background:#0d0d0d;
    color:#aaa;
    font-size:9px;
}

.product-modal-feature i{
    color:#777;
    font-size:9px;
}

.product-modal-bottom{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    margin-top:24px;
    padding-top:20px;
    border-top:1px solid #202020;
}

.product-modal-bottom > div{
    display:flex;
    flex-direction:column;
    gap:7px;
}

.product-modal-bottom span{
    color:#4f4f4f;
    font-size:6px;
    font-weight:900;
    letter-spacing:.14em;
}

.product-modal-bottom b{
    color:#999;
    font-size:8px;
    letter-spacing:.08em;
}

.product-modal-bottom b i{
    display:inline-block;
    width:6px;
    height:6px;
    margin-right:4px;
    border-radius:50%;
    background:#8c8c8c;
    box-shadow:0 0 0 4px rgba(255,255,255,.025);
}

.product-modal-discord{
    min-height:44px;
    padding:0 15px;
    border:1px solid #343434;
    border-radius:9px;
    background:#111;
    color:#ddd;
    display:flex;
    align-items:center;
    gap:12px;
    font-size:7px;
    font-weight:900;
    letter-spacing:.08em;
    cursor:pointer;
    transition:.2s ease;
}

.product-modal-discord:hover{
    background:#181818;
    border-color:#555;
    color:#fff;
    transform:translateY(-1px);
}

@media(max-width:700px){
    .compact-product-grid .product-card{
        grid-template-columns:56px minmax(0,1fr);
        height:auto;
        min-height:128px;
        padding:13px;
    }

    .compact-product-grid .product-mini-icon{
        width:56px;
        height:56px;
    }

    .compact-product-grid .soon-card-meta{
        left:82px;
        right:12px;
        bottom:10px;
        gap:8px;
    }

    .compact-product-grid .soon-card-meta span{
        font-size:7px;
        min-height:17px;
        padding:3px 6px;
    }

    .compact-product-grid .soon-card-meta b{
        font-size:6px;
    }

    .product-modal{
        padding:12px;
    }

    .product-modal-window{
        max-height:calc(100vh - 24px);
        border-radius:15px;
    }

    .product-modal-hero{
        height:230px;
    }

    .product-modal-soon{
        width:130px;
        height:130px;
        font-size:21px;
    }

    .product-modal-content{
        padding:20px;
    }

    .product-modal-heading{
        flex-direction:column;
        gap:9px;
    }

    .product-modal-heading h2{
        font-size:23px;
    }

    .product-modal-features{
        grid-template-columns:1fr;
    }

    .product-modal-bottom{
        align-items:stretch;
        flex-direction:column;
    }

    .product-modal-discord{
        justify-content:center;
    }
}


body.product-modal-open{
    overflow:hidden;
}


/* DFSCRIPTS AVAILABLE PRODUCTS */
.available-product{
    position:relative;
    overflow:hidden;
}

.available-product .product-preview-image{
    height:150px;
    position:relative;
    display:grid;
    place-items:center;
    overflow:hidden;
    background:#090909;
    border-bottom:1px solid #222;
}

.available-product .product-preview-image:before{
    content:"";
    position:absolute;
    inset:0;
    background:radial-gradient(circle at 50% 40%,rgba(255,255,255,.08),transparent 55%);
    pointer-events:none;
}

.available-product .product-preview-image img{
    position:relative;
    z-index:1;
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    transition:transform .35s ease,filter .35s ease;
}

.available-product:hover .product-preview-image img{
    transform:scale(1.035);
    filter:brightness(1.08);
}

.available-product .product-copy{
    padding:17px 18px 8px;
}

.available-product .product-copy h3{
    margin-top:10px;
}

.available-product .product-topline b{
    color:#8cffb0;
}

.available-card-meta{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:0 18px 17px;
}

.available-card-meta span{
    color:#eee;
    font-size:13px;
    font-weight:900;
}

.available-card-meta b{
    color:#888;
    font-size:7px;
    letter-spacing:.1em;
}

.multichar-preview img{
    object-position:center;
}

.product-modal-image{
    position:absolute;
    inset:0;
    z-index:1;
    width:100%;
    height:100%;
    object-fit:cover;
    opacity:.88;
}

.product-modal-hero:after{
    content:"";
    position:absolute;
    inset:0;
    z-index:2;
    background:linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.35) 58%,rgba(0,0,0,.9));
    pointer-events:none;
}

.product-modal-soon{
    z-index:5;
}

.product-modal-soon.is-available{
    color:#8cffb0;
    border-color:rgba(140,255,176,.18);
}

.product-modal-actions{
    display:grid;
    grid-template-columns:minmax(150px,.8fr) minmax(220px,1.2fr);
    gap:9px;
    width:min(100%,500px);
}

.product-modal-cart,
.product-modal-discord{
    min-height:46px;
}

.product-modal-cart{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:0 15px;
    border:1px solid #333;
    border-radius:9px;
    background:#171717;
    color:#fff;
    cursor:pointer;
    font-size:8px;
    font-weight:900;
    letter-spacing:.06em;
}

.product-modal-cart:hover{
    background:#222;
    border-color:#4a4a4a;
}

.product-modal-cart.is-disabled,
.product-modal-cart:disabled{
    opacity:.45;
    cursor:not-allowed;
}

@media(max-width:700px){
    .product-modal-actions{
        grid-template-columns:1fr;
    }
}


.product-modal-gallery{
    position:absolute;
    z-index:6;
    left:16px;
    bottom:14px;
    display:flex;
    gap:7px;
    max-width:calc(100% - 32px);
}

.product-modal-gallery-item{
    width:58px;
    height:38px;
    padding:0;
    overflow:hidden;
    border:1px solid #383838;
    border-radius:6px;
    background:#0c0c0c;
    cursor:pointer;
    opacity:.65;
    transition:.18s ease;
}

.product-modal-gallery-item:hover,
.product-modal-gallery-item.active{
    opacity:1;
    border-color:#777;
    transform:translateY(-2px);
}

.product-modal-gallery-item img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

.product-modal-availability{
    display:inline-flex;
    align-items:center;
    gap:6px;
}

#productModalAvailability.is-available{
    color:#8cffb0;
}

#productModalAvailability.is-available i{
    background:#8cffb0;
    box-shadow:0 0 9px rgba(140,255,176,.45);
}


/* DFSCRIPTS PRODUCT SHOWCASE REDESIGN */
.compact-product-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:18px !important;
    max-width:1120px !important;
}

.compact-product-grid .product-card{
    height:auto !important;
    min-height:390px !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:0 !important;
    padding:0 !important;
    border:1px solid #252525 !important;
    border-radius:18px !important;
    background:linear-gradient(145deg,#111 0%,#090909 72%) !important;
    box-shadow:0 18px 55px rgba(0,0,0,.28) !important;
    overflow:hidden !important;
    transform:none !important;
}

.compact-product-grid .product-card:hover{
    transform:translateY(-6px) !important;
    border-color:#404040 !important;
    box-shadow:0 28px 70px rgba(0,0,0,.48) !important;
}

.compact-product-grid .product-card:before{
    background:linear-gradient(135deg,rgba(255,255,255,.035),transparent 38%,rgba(255,255,255,.012)) !important;
}

/* Image products */
.available-product .product-preview-image{
    position:relative !important;
    height:245px !important;
    flex:0 0 245px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    padding:18px !important;
    background:
        radial-gradient(circle at 50% 35%,rgba(255,255,255,.08),transparent 55%),
        linear-gradient(145deg,#151515,#080808) !important;
    border:0 !important;
    border-bottom:1px solid #222 !important;
    overflow:hidden !important;
}

.available-product .product-preview-image:after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,transparent 60%,rgba(0,0,0,.38));
    pointer-events:none;
    z-index:3;
}

.available-product .product-preview-image > img{
    position:relative !important;
    z-index:2 !important;
    width:100% !important;
    height:100% !important;
    object-fit:contain !important;
    object-position:center !important;
    display:block !important;
    border-radius:10px !important;
    transition:transform .35s ease,filter .35s ease !important;
}

.available-product:hover .product-preview-image > img{
    transform:scale(1.025) !important;
    filter:brightness(1.08) !important;
}

/* Multicharacter: show both screenshots cleanly */
.multichar-preview{
    padding:16px !important;
}

.product-preview-gallery{
    width:100%;
    height:100%;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
    position:relative;
    z-index:2;
}

.product-preview-shot{
    min-width:0;
    min-height:0;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:7px;
    overflow:hidden;
    border:1px solid #292929;
    border-radius:11px;
    background:#070707;
    box-shadow:inset 0 0 28px rgba(255,255,255,.025),0 10px 25px rgba(0,0,0,.28);
}

.product-preview-shot img{
    width:100%;
    height:100%;
    object-fit:contain;
    object-position:center;
    display:block;
    border-radius:7px;
    transition:transform .35s ease,filter .35s ease;
}

.available-product:hover .product-preview-shot img{
    transform:scale(1.025);
    filter:brightness(1.07);
}

/* Product information */
.compact-product-grid .available-product .product-copy,
.compact-product-grid .soon-product .product-copy{
    position:relative;
    z-index:4;
    flex:1;
    min-width:0;
    padding:18px 20px 8px !important;
}

.compact-product-grid .product-topline{
    margin-bottom:9px !important;
}

.compact-product-grid .product-topline span,
.compact-product-grid .product-topline b{
    font-size:7px !important;
    letter-spacing:.15em !important;
}

.compact-product-grid h3{
    font-size:20px !important;
    line-height:1.15 !important;
    letter-spacing:-.035em !important;
}

.compact-product-grid p{
    margin-top:8px !important;
    max-width:100% !important;
    color:#737373 !important;
    font-size:10px !important;
    line-height:1.55 !important;
}

.compact-product-grid .available-card-meta,
.compact-product-grid .soon-card-meta{
    position:relative !important;
    left:auto !important;
    right:auto !important;
    bottom:auto !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:12px !important;
    padding:8px 20px 19px !important;
    margin-top:auto !important;
}

.compact-product-grid .available-card-meta span,
.compact-product-grid .soon-card-meta span{
    color:#f2f2f2 !important;
    font-size:16px !important;
    font-weight:900 !important;
}

.compact-product-grid .available-card-meta b,
.compact-product-grid .soon-card-meta b{
    color:#777 !important;
    font-size:7px !important;
    letter-spacing:.12em !important;
}

.compact-product-grid .available-product .product-topline b{
    color:#8cffb0 !important;
}

/* Coming-soon products get the same premium card proportions */
.compact-product-grid .soon-product{
    justify-content:flex-start !important;
    background:
        radial-gradient(circle at 85% 15%,rgba(255,255,255,.045),transparent 30%),
        linear-gradient(145deg,#111,#080808) !important;
}

.compact-product-grid .soon-product:after{
    content:"";
    width:calc(100% - 40px);
    height:1px;
    margin:0 20px;
    background:#202020;
    order:2;
}

.compact-product-grid .soon-product .product-copy{
    order:1;
    padding-top:28px !important;
}

.compact-product-grid .soon-product .soon-card-meta{
    order:3;
}

.compact-product-grid .soon-product .product-mini-icon{
    position:absolute;
    top:20px;
    right:20px;
    width:48px;
    height:48px;
    border-radius:13px;
    z-index:5;
    opacity:.75;
}

.compact-product-grid .soon-product .product-copy{
    padding-right:85px !important;
}

/* Custom development card */
.compact-product-grid .custom-request-product{
    min-height:190px !important;
    height:auto !important;
    display:grid !important;
    grid-template-columns:76px minmax(0,1fr) auto !important;
    align-items:center !important;
    gap:20px !important;
    padding:22px !important;
}

.compact-product-grid .custom-request-product .product-copy{
    padding:0 !important;
}

.compact-product-grid .custom-request-product h3{
    font-size:22px !important;
}

@media(max-width:900px){
    .compact-product-grid{
        grid-template-columns:1fr !important;
    }
}

@media(max-width:719px){
    .compact-product-grid{
        gap:14px !important;
    }

    .compact-product-grid .product-card{
        min-height:360px !important;
        border-radius:15px !important;
    }

    .available-product .product-preview-image{
        height:210px !important;
        flex-basis:210px !important;
        padding:13px !important;
    }

    .product-preview-gallery{
        gap:8px;
    }

    .compact-product-grid h3{
        font-size:17px !important;
    }

    .compact-product-grid p{
        font-size:9px !important;
    }

    .compact-product-grid .available-card-meta,
    .compact-product-grid .soon-card-meta{
        padding-left:16px !important;
        padding-right:16px !important;
        padding-bottom:16px !important;
    }

    .compact-product-grid .custom-request-product{
        display:flex !important;
        min-height:170px !important;
        padding:18px !important;
    }

    .compact-product-grid .custom-request-product .product-mini-icon{
        position:relative;
        top:auto;
        right:auto;
    }
}

/* DFSCRIPTS STORE - FINAL PRODUCT CARD POLISH */
.compact-product-grid {
    align-items: stretch !important;
    gap: 20px !important;
}

.compact-product-grid .product-card {
    min-width: 0 !important;
    min-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    border-radius: 20px !important;
    background: linear-gradient(145deg, #151515 0%, #0b0b0b 72%) !important;
}

.compact-product-grid .available-product .product-preview-image {
    height: 270px !important;
    flex: 0 0 270px !important;
    padding: 18px !important;
    background: #080808 !important;
    border-bottom: 1px solid #252525 !important;
}

.compact-product-grid .available-product .product-preview-image > img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
    border-radius: 12px !important;
    background: #0d0d0d !important;
    box-shadow: 0 12px 30px rgba(0,0,0,.28) !important;
}

.compact-product-grid .available-product .product-preview-image:after {
    background: linear-gradient(180deg, rgba(0,0,0,0) 55%, rgba(0,0,0,.32)) !important;
}

.compact-product-grid .multichar-preview {
    height: 270px !important;
    flex: 0 0 270px !important;
    padding: 18px !important;
}

.compact-product-grid .multichar-preview .product-preview-gallery {
    width: 100% !important;
    height: 100% !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 12px !important;
}

.compact-product-grid .multichar-preview .product-preview-shot {
    min-width: 0 !important;
    min-height: 0 !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 10px !important;
    overflow: hidden !important;
    border: 1px solid #252525 !important;
    border-radius: 12px !important;
    background: #0d0d0d !important;
}

.compact-product-grid .multichar-preview .product-preview-shot img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
    display: block !important;
    border-radius: 7px !important;
    background: #111 !important;
}

.compact-product-grid .available-product .product-copy,
.compact-product-grid .soon-product .product-copy {
    padding: 18px 20px 8px !important;
}

.compact-product-grid .product-copy h3 {
    margin: 9px 0 7px !important;
    line-height: 1.15 !important;
}

.compact-product-grid .product-copy p {
    margin: 0 !important;
    line-height: 1.55 !important;
    color: #969696 !important;
}

.compact-product-grid .available-card-meta,
.compact-product-grid .soon-card-meta {
    margin-top: auto !important;
    padding: 15px 20px 20px !important;
}

.compact-product-grid .available-card-meta span,
.compact-product-grid .soon-card-meta span {
    font-size: 16px !important;
    font-weight: 900 !important;
}

.compact-product-grid .available-card-meta b,
.compact-product-grid .soon-card-meta b {
    font-size: 8px !important;
    letter-spacing: .12em !important;
}

.product-modal-hero .product-modal-image {
    object-fit: contain !important;
    padding: 22px !important;
    background: #080808 !important;
}

@media (max-width: 719px) {
    .compact-product-grid .available-product .product-preview-image,
    .compact-product-grid .multichar-preview {
        height: 230px !important;
        flex-basis: 230px !important;
        padding: 13px !important;
    }

    .compact-product-grid .multichar-preview .product-preview-gallery {
        gap: 8px !important;
    }

    .compact-product-grid .multichar-preview .product-preview-shot {
        padding: 7px !important;
    }
}


/* DFSCRIPTS PRODUCT MARKETPLACE REDESIGN */
.compact-product-grid{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:18px !important;
    max-width:1120px !important;
}

.compact-product-grid .product-card{
    min-width:0 !important;
    height:auto !important;
    min-height:410px !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:0 !important;
    padding:0 !important;
    border:1px solid #242424 !important;
    border-radius:18px !important;
    background:#0a0a0a !important;
    box-shadow:0 16px 45px rgba(0,0,0,.28) !important;
    overflow:hidden !important;
    transform:none;
}

.compact-product-grid .product-card:hover{
    transform:translateY(-5px) !important;
    border-color:#3a3a3a !important;
    box-shadow:0 25px 65px rgba(0,0,0,.5) !important;
}

.compact-product-grid .product-card:before{
    display:none !important;
}

.compact-product-grid .product-copy{
    flex:1;
    padding:19px 20px 12px !important;
    min-width:0;
}

.compact-product-grid .product-copy .product-topline{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-bottom:10px;
}

.compact-product-grid .product-copy .product-topline span{
    color:#5d5d5d;
    font-size:7px;
    font-weight:900;
    letter-spacing:.14em;
}

.compact-product-grid .product-copy .product-topline b{
    color:#8cffb0;
    font-size:7px;
    font-weight:900;
    letter-spacing:.12em;
}

.compact-product-grid .soon-product .product-copy .product-topline b{
    color:#777;
}

.compact-product-grid .product-copy h3{
    margin:0 !important;
    color:#f1f1f1 !important;
    font-size:19px !important;
    line-height:1.15 !important;
    letter-spacing:-.025em !important;
}

.compact-product-grid .product-copy p{
    margin:8px 0 0 !important;
    max-width:430px;
    color:#666 !important;
    font-size:9px !important;
    line-height:1.65 !important;
}

.compact-product-grid .product-preview-image{
    position:relative !important;
    height:235px !important;
    min-height:235px !important;
    width:100% !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    padding:14px !important;
    background:linear-gradient(145deg,#111 0%,#080808 100%) !important;
    border-bottom:1px solid #202020 !important;
    overflow:hidden !important;
}

.compact-product-grid .product-preview-image:after{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:linear-gradient(180deg,rgba(255,255,255,.025),transparent 35%,rgba(0,0,0,.18));
}

.compact-product-grid .product-preview-image > img:not(.x){
    position:relative !important;
    z-index:1 !important;
    width:100% !important;
    height:100% !important;
    object-fit:contain !important;
    object-position:center !important;
    border-radius:10px !important;
    filter:drop-shadow(0 16px 25px rgba(0,0,0,.45));
    transition:transform .3s ease,filter .3s ease !important;
}

.compact-product-grid .product-card:hover .product-preview-image > img{
    transform:scale(1.025) !important;
    filter:brightness(1.04) drop-shadow(0 20px 30px rgba(0,0,0,.55));
}

.compact-product-grid .multichar-preview{
    padding:12px !important;
}

.compact-product-grid .product-preview-gallery{
    position:relative !important;
    z-index:1 !important;
    width:100% !important;
    height:100% !important;
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px !important;
}

.compact-product-grid .product-preview-shot{
    min-width:0 !important;
    min-height:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    overflow:hidden !important;
    padding:7px !important;
    border:1px solid #252525 !important;
    border-radius:11px !important;
    background:#070707 !important;
}

.compact-product-grid .product-preview-shot img{
    width:100% !important;
    height:100% !important;
    object-fit:contain !important;
    border-radius:7px !important;
    display:block !important;
    filter:drop-shadow(0 12px 20px rgba(0,0,0,.4));
}

.compact-product-grid .available-card-meta,
.compact-product-grid .soon-card-meta{
    position:static !important;
    left:auto !important;
    right:auto !important;
    bottom:auto !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:12px !important;
    min-height:58px !important;
    padding:0 20px !important;
    border-top:1px solid #1b1b1b !important;
    background:#090909 !important;
}

.compact-product-grid .available-card-meta span,
.compact-product-grid .soon-card-meta span{
    color:#eee !important;
    font-size:14px !important;
    font-weight:900 !important;
}

.compact-product-grid .available-card-meta b,
.compact-product-grid .soon-card-meta b{
    color:#777 !important;
    font-size:7px !important;
    letter-spacing:.12em !important;
}

.compact-product-grid .product-mini-icon{
    width:235px !important;
    height:235px !important;
    flex:0 0 235px !important;
    margin:0 auto !important;
    display:grid !important;
    place-items:center !important;
    border-radius:0 !important;
    background:radial-gradient(circle at 50% 35%,#202020,#0b0b0b 65%) !important;
    border:0 !important;
}

.compact-product-grid .soon-product .product-mini-icon{
    width:100% !important;
    height:235px !important;
    flex:0 0 235px !important;
    border-bottom:1px solid #202020 !important;
}

.compact-product-grid .soon-product .product-mini-icon i{
    font-size:34px !important;
    color:#555 !important;
}

/* Product modal: real image viewer */
.product-modal-window{
    width:min(1080px,100%) !important;
    max-height:min(900px,calc(100vh - 42px)) !important;
    border-radius:22px !important;
}

.product-modal-hero{
    height:440px !important;
    background:#070707 !important;
}

.product-modal-image{
    position:relative !important;
    inset:auto !important;
    z-index:1 !important;
    width:100% !important;
    height:100% !important;
    padding:24px 150px 24px 24px !important;
    object-fit:contain !important;
    object-position:center !important;
    opacity:1 !important;
    filter:drop-shadow(0 25px 45px rgba(0,0,0,.65));
}

.product-modal-hero:after{
    z-index:2 !important;
    background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.05) 55%,rgba(0,0,0,.55)) !important;
}

.product-modal-grid,
.product-modal-orbit{
    pointer-events:none !important;
    z-index:0 !important;
}

.product-modal-soon{
    z-index:7 !important;
}

.product-modal-gallery{
    position:absolute !important;
    z-index:10 !important;
    top:18px !important;
    right:18px !important;
    bottom:18px !important;
    left:auto !important;
    width:112px !important;
    max-width:none !important;
    display:flex !important;
    flex-direction:column !important;
    gap:10px !important;
    overflow:auto !important;
    padding:2px !important;
}

.product-modal-gallery-item{
    flex:0 0 82px !important;
    width:108px !important;
    height:82px !important;
    padding:5px !important;
    border:1px solid #292929 !important;
    border-radius:10px !important;
    background:#0a0a0a !important;
    cursor:pointer !important;
    opacity:.62 !important;
    transition:.2s ease !important;
}

.product-modal-gallery-item:hover,
.product-modal-gallery-item.active{
    opacity:1 !important;
    border-color:#666 !important;
    background:#141414 !important;
    transform:translateX(-2px);
}

.product-modal-gallery-item img{
    display:block !important;
    width:100% !important;
    height:100% !important;
    object-fit:contain !important;
    border-radius:6px !important;
}

.product-modal-content{
    padding:30px !important;
}

@media(max-width:760px){
    .compact-product-grid{
        grid-template-columns:1fr !important;
    }

    .compact-product-grid .product-preview-image,
    .compact-product-grid .soon-product .product-mini-icon{
        height:220px !important;
        min-height:220px !important;
        flex-basis:220px !important;
    }

    .product-modal-hero{
        height:330px !important;
    }

    .product-modal-image{
        padding:18px 18px 85px !important;
    }

    .product-modal-gallery{
        top:auto !important;
        right:14px !important;
        bottom:12px !important;
        left:14px !important;
        width:auto !important;
        height:62px !important;
        flex-direction:row !important;
        overflow-x:auto !important;
        overflow-y:hidden !important;
    }

    .product-modal-gallery-item{
        flex:0 0 82px !important;
        width:82px !important;
        height:58px !important;
    }
}

/* DFSCRIPTS // MARKETPLACE PRODUCT SYSTEM */
.compact-product-grid{
    width:min(1180px,calc(100% - 32px)) !important;
    max-width:1180px !important;
    margin:0 auto !important;
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:22px !important;
    align-items:stretch !important;
}

.compact-product-grid .product-card{
    position:relative !important;
    min-width:0 !important;
    min-height:0 !important;
    height:100% !important;
    padding:0 !important;
    display:flex !important;
    flex-direction:column !important;
    border:1px solid #252525 !important;
    border-radius:18px !important;
    background:#0d0d0d !important;
    box-shadow:0 16px 45px rgba(0,0,0,.28) !important;
    overflow:hidden !important;
    isolation:isolate !important;
    transition:border-color .25s ease,transform .25s ease,box-shadow .25s ease,background .25s ease !important;
}

.compact-product-grid .product-card:hover{
    transform:translateY(-5px) !important;
    border-color:#414141 !important;
    background:#101010 !important;
    box-shadow:0 28px 70px rgba(0,0,0,.48) !important;
}

.compact-product-grid .product-card:before,
.compact-product-grid .product-card:after{
    pointer-events:none !important;
}

/* product media */
.compact-product-grid .available-product .product-preview-image{
    position:relative !important;
    width:100% !important;
    height:250px !important;
    flex:0 0 250px !important;
    padding:16px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    background:
        radial-gradient(circle at 50% 35%,rgba(255,255,255,.07),transparent 48%),
        linear-gradient(145deg,#171717,#080808) !important;
    border:0 !important;
    border-bottom:1px solid #232323 !important;
    overflow:hidden !important;
}

.compact-product-grid .available-product .product-preview-image > img{
    position:relative !important;
    z-index:2 !important;
    display:block !important;
    width:100% !important;
    height:100% !important;
    object-fit:contain !important;
    object-position:center !important;
    border-radius:10px !important;
    background:#0a0a0a !important;
    box-shadow:0 14px 32px rgba(0,0,0,.38) !important;
    transition:transform .35s cubic-bezier(.2,.7,.2,1),filter .35s ease !important;
}

.compact-product-grid .available-product:hover .product-preview-image > img{
    transform:scale(1.035) !important;
    filter:brightness(1.08) !important;
}

.compact-product-grid .product-preview-image:after{
    content:"" !important;
    position:absolute !important;
    inset:0 !important;
    z-index:3 !important;
    pointer-events:none !important;
    background:linear-gradient(180deg,transparent 60%,rgba(0,0,0,.32)) !important;
}

/* multichar = two real previews */
.compact-product-grid .multichar-preview{
    height:250px !important;
    flex:0 0 250px !important;
    padding:14px !important;
}

.compact-product-grid .multichar-preview .product-preview-gallery{
    position:relative !important;
    z-index:2 !important;
    width:100% !important;
    height:100% !important;
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px !important;
}

.compact-product-grid .multichar-preview .product-preview-shot{
    min-width:0 !important;
    min-height:0 !important;
    width:100% !important;
    height:100% !important;
    padding:7px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    border:1px solid #292929 !important;
    border-radius:11px !important;
    background:#080808 !important;
    overflow:hidden !important;
    box-shadow:inset 0 0 35px rgba(255,255,255,.018),0 10px 25px rgba(0,0,0,.3) !important;
}

.compact-product-grid .multichar-preview .product-preview-shot img{
    width:100% !important;
    height:100% !important;
    object-fit:contain !important;
    object-position:center !important;
    display:block !important;
    border-radius:7px !important;
    transition:transform .35s ease,filter .35s ease !important;
}

.compact-product-grid .multichar-preview .product-preview-shot:hover img{
    transform:scale(1.035) !important;
    filter:brightness(1.08) !important;
}

/* product information */
.compact-product-grid .available-product .product-copy,
.compact-product-grid .soon-product .product-copy{
    position:relative !important;
    z-index:4 !important;
    flex:1 1 auto !important;
    min-width:0 !important;
    padding:18px 19px 15px !important;
}

.compact-product-grid .product-topline{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:10px !important;
    margin:0 0 9px !important;
}

.compact-product-grid .product-topline span{
    color:#666 !important;
    font-size:7px !important;
    font-weight:900 !important;
    letter-spacing:.16em !important;
}

.compact-product-grid .product-topline b{
    color:#777 !important;
    font-size:7px !important;
    font-weight:900 !important;
    letter-spacing:.12em !important;
}

.compact-product-grid .available-product .product-topline b{
    color:#8cffb0 !important;
}

.compact-product-grid h3{
    margin:0 !important;
    color:#f1f1f1 !important;
    font-size:18px !important;
    line-height:1.16 !important;
    font-weight:900 !important;
    letter-spacing:-.035em !important;
}

.compact-product-grid p{
    margin:8px 0 0 !important;
    color:#6f6f6f !important;
    font-size:9px !important;
    line-height:1.55 !important;
}

.compact-product-grid .available-card-meta,
.compact-product-grid .soon-card-meta{
    position:relative !important;
    left:auto !important;
    right:auto !important;
    bottom:auto !important;
    z-index:4 !important;
    min-height:57px !important;
    margin:0 !important;
    padding:0 19px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:12px !important;
    border-top:1px solid #202020 !important;
    background:#0a0a0a !important;
}

.compact-product-grid .available-card-meta span,
.compact-product-grid .soon-card-meta span{
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
    color:#ededed !important;
    font-size:14px !important;
    font-weight:900 !important;
    box-shadow:none !important;
}

.compact-product-grid .available-card-meta b,
.compact-product-grid .soon-card-meta b{
    color:#666 !important;
    font-size:7px !important;
    font-weight:900 !important;
    letter-spacing:.13em !important;
    transition:color .2s ease !important;
}

.compact-product-grid .product-card:hover .available-card-meta b,
.compact-product-grid .product-card:hover .soon-card-meta b{
    color:#aaa !important;
}

/* soon cards without giant fake icon */
.compact-product-grid .soon-product{
    min-height:360px !important;
    background:linear-gradient(145deg,#121212,#090909) !important;
}

.compact-product-grid .soon-product .product-mini-icon{
    position:relative !important;
    top:auto !important;
    right:auto !important;
    width:100% !important;
    height:250px !important;
    flex:0 0 250px !important;
    margin:0 !important;
    display:grid !important;
    place-items:center !important;
    border:0 !important;
    border-bottom:1px solid #232323 !important;
    border-radius:0 !important;
    background:
        radial-gradient(circle at 50% 40%,rgba(255,255,255,.07),transparent 42%),
        linear-gradient(145deg,#151515,#080808) !important;
    opacity:1 !important;
}

.compact-product-grid .soon-product .product-mini-icon i{
    width:68px !important;
    height:68px !important;
    display:grid !important;
    place-items:center !important;
    border:1px solid #303030 !important;
    border-radius:18px !important;
    background:#101010 !important;
    color:#737373 !important;
    font-size:24px !important;
    box-shadow:0 20px 45px rgba(0,0,0,.45) !important;
}

.compact-product-grid .soon-product:after{
    display:none !important;
}

.compact-product-grid .soon-product .product-copy{
    order:initial !important;
    padding:18px 19px 15px !important;
}

.compact-product-grid .soon-product .soon-card-meta{
    order:initial !important;
}

.compact-product-grid .custom-request-product{
    grid-column:1 / -1 !important;
    min-height:170px !important;
    height:auto !important;
    display:grid !important;
    grid-template-columns:68px minmax(0,1fr) auto !important;
    align-items:center !important;
    gap:20px !important;
    padding:25px !important;
}

.compact-product-grid .custom-request-product .product-copy{
    padding:0 !important;
}

.compact-product-grid .custom-request-product h3{
    font-size:22px !important;
}

/* product modal */
.product-modal-window{
    width:min(1040px,calc(100vw - 48px)) !important;
    max-height:calc(100vh - 48px) !important;
    border-radius:22px !important;
    border-color:#2c2c2c !important;
    background:#0b0b0b !important;
}

.product-modal-hero{
    height:500px !important;
    background:
        radial-gradient(circle at 48% 42%,#202020 0,#111 35%,#080808 75%) !important;
}

.product-modal-image{
    position:relative !important;
    z-index:4 !important;
    width:100% !important;
    height:100% !important;
    padding:30px 150px 30px 30px !important;
    object-fit:contain !important;
    object-position:center !important;
    display:block !important;
    filter:drop-shadow(0 25px 45px rgba(0,0,0,.55)) !important;
}

.product-modal-grid{
    z-index:0 !important;
    opacity:.18 !important;
}

.product-modal-orbit{
    z-index:1 !important;
    pointer-events:none !important;
}

.product-modal-soon{
    z-index:8 !important;
    top:22px !important;
    right:22px !important;
    left:auto !important;
    bottom:auto !important;
    width:auto !important;
    height:auto !important;
    padding:8px 11px !important;
    border:1px solid #333 !important;
    border-radius:7px !important;
    background:#111 !important;
    box-shadow:none !important;
    animation:none !important;
    font-size:7px !important;
    letter-spacing:.14em !important;
}

.product-modal-soon.is-available{
    color:#8cffb0 !important;
    border-color:rgba(140,255,176,.25) !important;
}

.product-modal-gallery{
    top:20px !important;
    right:20px !important;
    bottom:20px !important;
    left:auto !important;
    z-index:12 !important;
    width:112px !important;
    display:flex !important;
    flex-direction:column !important;
    gap:10px !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
    padding:2px !important;
}

.product-modal-gallery-item{
    position:relative !important;
    z-index:13 !important;
    flex:0 0 82px !important;
    width:108px !important;
    height:82px !important;
    padding:5px !important;
    border:1px solid #292929 !important;
    border-radius:11px !important;
    background:#090909 !important;
    opacity:.55 !important;
    cursor:pointer !important;
    pointer-events:auto !important;
    transition:transform .2s ease,border-color .2s ease,opacity .2s ease,background .2s ease !important;
}

.product-modal-gallery-item:hover,
.product-modal-gallery-item.active{
    opacity:1 !important;
    border-color:#777 !important;
    background:#151515 !important;
    transform:translateX(-3px) !important;
}

.product-modal-gallery-item img{
    width:100% !important;
    height:100% !important;
    display:block !important;
    object-fit:contain !important;
    border-radius:7px !important;
    pointer-events:none !important;
}

.product-modal-content{
    padding:30px 32px 32px !important;
}

.product-modal-heading h2{
    font-size:32px !important;
}

@media(max-width:980px){
    .compact-product-grid{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    }

    .compact-product-grid .custom-request-product{
        grid-column:1 / -1 !important;
    }
}

@media(max-width:700px){
    .compact-product-grid{
        width:calc(100% - 24px) !important;
        grid-template-columns:1fr !important;
        gap:15px !important;
    }

    .compact-product-grid .custom-request-product{
        grid-column:auto !important;
        display:flex !important;
        align-items:flex-start !important;
        min-height:0 !important;
        padding:19px !important;
    }

    .compact-product-grid .available-product .product-preview-image,
    .compact-product-grid .multichar-preview,
    .compact-product-grid .soon-product .product-mini-icon{
        height:225px !important;
        flex-basis:225px !important;
    }

    .product-modal-window{
        width:calc(100vw - 20px) !important;
        max-height:calc(100vh - 20px) !important;
        border-radius:17px !important;
    }

    .product-modal-hero{
        height:350px !important;
    }

    .product-modal-image{
        padding:20px 20px 82px !important;
    }

    .product-modal-gallery{
        top:auto !important;
        right:12px !important;
        bottom:10px !important;
        left:12px !important;
        width:auto !important;
        height:60px !important;
        flex-direction:row !important;
        overflow-x:auto !important;
        overflow-y:hidden !important;
    }

    .product-modal-gallery-item{
        flex:0 0 78px !important;
        width:78px !important;
        height:56px !important;
    }
}


/* DFSCRIPTS STORE — premium product layer */
.dfs-store-grid .product-card{
    position:relative;
    isolation:isolate;
    transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease,background .24s ease;
}
.dfs-store-grid .product-card:not(.product-ticket-card):hover{
    transform:translateY(-4px);
    border-color:#3b3b3f;
    box-shadow:0 18px 55px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.035);
}
.dfs-store-grid .product-card.available-product{
    background:linear-gradient(145deg,#121214,#0b0b0c);
}
.dfs-store-grid .product-card.soon-product{
    background:linear-gradient(145deg,#101011,#09090a);
}
.dfs-store-grid .product-card .product-topline b{
    font-size:7px;
    letter-spacing:.12em;
}
.dfs-store-grid .product-card.available-product .product-topline b{color:#e1e1e3}
.dfs-store-grid .product-card.soon-product .product-topline b{color:#5c5c60}
.dfs-store-grid .product-preview-image{
    position:relative;
    overflow:hidden;
    border:1px solid #29292d;
    border-radius:11px;
    background:#080809;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.02),0 12px 35px rgba(0,0,0,.3);
}
.dfs-store-grid .product-preview-image:after{
    content:"";position:absolute;inset:0;pointer-events:none;
    background:linear-gradient(180deg,rgba(255,255,255,.035),transparent 35%,rgba(0,0,0,.25));
}
.dfs-store-grid .product-preview-image img{width:100%;height:100%;object-fit:cover;display:block}
.dfs-store-grid .multichar-preview .product-preview-gallery{display:grid;grid-template-columns:1fr 1fr;gap:3px;width:100%;height:100%}
.dfs-store-grid .multichar-preview .product-preview-shot{min-width:0;overflow:hidden}
.dfs-store-grid .multichar-preview .product-preview-shot img{width:100%;height:100%;object-fit:cover}
.dfs-store-grid .available-card-meta,.dfs-store-grid .soon-card-meta{z-index:5}
.dfs-store-grid .available-card-meta span,.dfs-store-grid .soon-card-meta span{background:#101012;border-color:#303035}
.dfs-store-grid .available-card-meta b{color:#dcdce0}
.dfs-store-grid .soon-card-meta b{color:#5c5c60}

/* Modal: no giant SOON art, product screenshots are the hero. */
.product-modal-soon{display:none!important}
.product-modal-hero{min-height:320px}
.product-modal-image{position:relative;z-index:3;display:block;width:min(78%,760px);height:240px;object-fit:contain;border-radius:13px;filter:drop-shadow(0 26px 48px rgba(0,0,0,.62))}
.product-modal-window{border-color:#343438;background:linear-gradient(180deg,#0b0b0d,#080809);box-shadow:0 45px 150px rgba(0,0,0,.92),0 0 0 1px rgba(255,255,255,.025)}
.product-modal-hero:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 35%,rgba(255,255,255,.075),transparent 40%);pointer-events:none;z-index:1}
.product-modal-hero .product-modal-grid{z-index:0}
.dfs-product-gallery{position:absolute;left:22px;right:22px;bottom:14px;z-index:8;display:flex;justify-content:center;pointer-events:none}
.dfs-product-thumbs{display:flex;gap:8px;padding:5px;border:1px solid rgba(255,255,255,.09);border-radius:11px;background:rgba(8,8,9,.72);backdrop-filter:blur(12px);box-shadow:0 12px 35px rgba(0,0,0,.45);pointer-events:auto}
.dfs-product-thumb{width:82px;height:52px;padding:0;overflow:hidden;border:1px solid #303034;border-radius:8px;background:#101012;cursor:pointer;opacity:.55;transition:.18s ease}
.dfs-product-thumb:hover{opacity:.9;transform:translateY(-2px);border-color:#666}
.dfs-product-thumb.active{opacity:1;border-color:#aaa;box-shadow:0 0 0 2px rgba(255,255,255,.07)}
.dfs-product-thumb img{display:block;width:100%;height:100%;object-fit:cover}
.product-modal-status-available{color:#e7e7e9!important}
.product-modal-status-available i{background:#d8d8dc!important;box-shadow:0 0 0 4px rgba(255,255,255,.035)!important}
.product-modal-status-unavailable{color:#707074!important}
.product-modal-status-unavailable i{background:#4f4f54!important;box-shadow:0 0 0 4px rgba(255,255,255,.015)!important}
.product-modal-cart:disabled{display:none!important}
@media(max-width:700px){
 .product-modal-hero{min-height:240px;height:240px}
 .product-modal-image{width:94%;height:175px}
 .dfs-product-gallery{left:10px;right:10px;bottom:9px}
 .dfs-product-thumb{width:61px;height:41px}
}


/* DFSCRIPTS — MULTICHAR PREVIEW BAR
   Keeps gallery controls completely outside the Purchase / action area. */
.product-modal-hero{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:flex-start !important;
    min-height:0 !important;
    height:auto !important;
    padding:18px 18px 14px !important;
    overflow:hidden !important;
}
.product-modal-hero .product-modal-image{
    position:relative !important;
    inset:auto !important;
    flex:0 0 auto !important;
    width:min(100%, 820px) !important;
    height:270px !important;
    max-height:270px !important;
    object-fit:contain !important;
    margin:0 auto !important;
    z-index:3 !important;
    border-radius:14px !important;
}
/* The old static gallery container from the HTML stays harmless and invisible. */
.product-modal-hero > .product-modal-gallery{
    display:none !important;
}
.dfs-product-gallery{
    position:relative !important;
    inset:auto !important;
    width:100% !important;
    margin:10px auto 0 !important;
    padding:0 !important;
    display:flex !important;
    justify-content:center !important;
    pointer-events:auto !important;
    z-index:10 !important;
}
.dfs-product-gallery-bar{
    display:grid !important;
    grid-template-columns:auto auto auto !important;
    align-items:center !important;
    gap:12px !important;
    min-height:48px !important;
    max-width:100% !important;
    padding:6px 9px !important;
    border:1px solid rgba(255,255,255,.09) !important;
    border-radius:14px !important;
    background:rgba(10,10,12,.82) !important;
    backdrop-filter:blur(18px) !important;
    box-shadow:0 14px 40px rgba(0,0,0,.42), inset 0 1px rgba(255,255,255,.035) !important;
}
.dfs-product-gallery-label,
.dfs-product-gallery-counter{
    font-size:8px !important;
    font-weight:900 !important;
    letter-spacing:.13em !important;
    color:#737379 !important;
    white-space:nowrap !important;
}
.dfs-product-gallery-counter{color:#c7c7cb !important; min-width:36px !important; text-align:right !important}
.dfs-product-thumbs{
    position:relative !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:7px !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    pointer-events:auto !important;
}
.dfs-product-thumb{
    width:64px !important;
    height:40px !important;
    flex:0 0 64px !important;
    border:1px solid rgba(255,255,255,.12) !important;
    border-radius:8px !important;
    opacity:.5 !important;
    transform:none !important;
    box-shadow:none !important;
}
.dfs-product-thumb:hover{opacity:.9 !important; transform:translateY(-1px) !important}
.dfs-product-thumb.active{
    opacity:1 !important;
    border-color:#bfc0c5 !important;
    box-shadow:0 0 0 2px rgba(255,255,255,.07), 0 5px 18px rgba(0,0,0,.25) !important;
}
.dfs-product-thumb img{width:100% !important;height:100% !important;object-fit:cover !important}
@media(max-width:700px){
    .product-modal-hero{padding:12px 10px 11px !important}
    .product-modal-hero .product-modal-image{height:190px !important;max-height:190px !important}
    .dfs-product-gallery{margin-top:8px !important}
    .dfs-product-gallery-bar{gap:7px !important;padding:5px 7px !important}
    .dfs-product-gallery-label{display:none !important}
    .dfs-product-thumb{width:56px !important;height:36px !important;flex-basis:56px !important}
    .dfs-product-gallery-counter{font-size:7px !important;min-width:30px !important}
}


/* =========================================================
   DFSCRIPTS — IMAGE-FIRST STORE
   Product previews intentionally fill the entire image area.
   ========================================================= */

.compact-product-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:18px !important;
    max-width:1260px !important;
    align-items:stretch !important;
}

.compact-product-grid .product-image-card{
    position:relative !important;
    min-height:0 !important;
    height:auto !important;
    display:flex !important;
    flex-direction:column !important;
    overflow:hidden !important;
    padding:0 !important;
    border:1px solid #272727 !important;
    border-radius:18px !important;
    background:#090909 !important;
    box-shadow:0 20px 70px rgba(0,0,0,.35) !important;
}

.compact-product-grid .product-image-card:hover{
    transform:translateY(-7px) !important;
    border-color:#4a4a4a !important;
    box-shadow:0 32px 90px rgba(0,0,0,.58) !important;
}

.product-card-image{
    position:relative !important;
    width:100% !important;
    height:310px !important;
    min-height:310px !important;
    overflow:hidden !important;
    background:#191919 !important;
    border-bottom:1px solid #2a2a2a !important;
}

.product-card-image img{
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    display:block !important;
    object-fit:cover !important;
    object-position:center !important;
    transform:scale(1.001) !important;
    filter:brightness(.82) saturate(.78) !important;
    transition:transform .55s cubic-bezier(.2,.7,.2,1),filter .35s ease !important;
}

.product-image-overlay{
    position:absolute !important;
    inset:0 !important;
    z-index:2 !important;
    background:
        linear-gradient(180deg,rgba(0,0,0,.08) 0%,rgba(0,0,0,.02) 35%,rgba(0,0,0,.18) 65%,rgba(0,0,0,.82) 100%),
        linear-gradient(90deg,rgba(0,0,0,.2),transparent 30%,transparent 70%,rgba(0,0,0,.2)) !important;
    pointer-events:none !important;
}

.product-card-image:after{
    content:"" !important;
    position:absolute !important;
    inset:0 !important;
    z-index:3 !important;
    border:1px solid rgba(255,255,255,.035) !important;
    pointer-events:none !important;
}

.product-image-badge{
    position:absolute !important;
    top:15px !important;
    left:15px !important;
    z-index:5 !important;
    display:inline-flex !important;
    align-items:center !important;
    gap:7px !important;
    padding:8px 10px !important;
    border:1px solid rgba(255,255,255,.16) !important;
    border-radius:8px !important;
    background:rgba(8,8,8,.76) !important;
    backdrop-filter:blur(10px) !important;
    color:#eee !important;
    font-size:7px !important;
    font-weight:900 !important;
    letter-spacing:.13em !important;
}

.product-image-badge i{
    font-size:8px !important;
    color:#aaa !important;
}

.product-image-corner{
    position:absolute !important;
    top:16px !important;
    right:16px !important;
    z-index:5 !important;
    color:rgba(255,255,255,.38) !important;
    font-size:7px !important;
    font-weight:900 !important;
    letter-spacing:.16em !important;
}

.product-image-card:hover .product-card-image img{
    transform:scale(1.045) !important;
    filter:brightness(.98) saturate(.9) !important;
}

.product-card-content{
    position:relative !important;
    z-index:4 !important;
    display:flex !important;
    flex-direction:column !important;
    flex:1 !important;
    min-height:150px !important;
    padding:18px 20px 17px !important;
    background:
        radial-gradient(circle at 100% 0%,rgba(255,255,255,.045),transparent 34%),
        linear-gradient(180deg,#101010,#090909) !important;
}

.product-card-content .product-topline{
    margin-bottom:8px !important;
}

.product-card-content .product-topline span,
.product-card-content .product-topline b{
    font-size:7px !important;
    letter-spacing:.14em !important;
}

.product-card-content .product-topline b{
    color:#8cffb0 !important;
}

.product-title-row{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:16px !important;
}

.product-title-row h3{
    margin:0 !important;
    font-size:21px !important;
    line-height:1.1 !important;
    letter-spacing:-.04em !important;
}

.product-price{
    flex:0 0 auto !important;
    color:#f1f1f1 !important;
    font-size:14px !important;
    font-weight:900 !important;
}

.product-card-content > p{
    margin:9px 0 0 !important;
    min-height:0 !important;
    color:#707070 !important;
    font-size:9px !important;
    line-height:1.55 !important;
}

.product-card-footer{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    margin-top:auto !important;
    padding-top:17px !important;
    color:#858585 !important;
    font-size:7px !important;
    font-weight:900 !important;
    letter-spacing:.13em !important;
}

.product-card-footer i{
    display:grid !important;
    place-items:center !important;
    width:30px !important;
    height:30px !important;
    border:1px solid #303030 !important;
    border-radius:8px !important;
    color:#aaa !important;
    transition:.25s ease !important;
}

.product-image-card:hover .product-card-footer i{
    color:#fff !important;
    border-color:#555 !important;
    transform:translate(2px,-2px) !important;
}

.featured-product{
    border-color:#303030 !important;
}

@media(max-width:900px){
    .compact-product-grid{
        grid-template-columns:1fr !important;
    }
}

@media(max-width:600px){
    .product-card-image{
        height:235px !important;
        min-height:235px !important;
    }

    .product-card-content{
        min-height:140px !important;
        padding:16px !important;
    }

    .product-title-row h3{
        font-size:18px !important;
    }

    .product-price{
        font-size:12px !important;
    }
}


/* =========================================================
   DFSCRIPTS HOMEPAGE / ABOUT HERO
   ========================================================= */
.dfs-about-hero{
    width:min(1440px,calc(100% - 20px));
    margin:30px auto 0;
    position:relative;
    overflow:hidden;
    border:1px solid #252525;
    border-radius:20px;
    background:
        radial-gradient(circle at 78% 18%,rgba(255,255,255,.055),transparent 32%),
        linear-gradient(135deg,#0b0b0b 0%,#080808 55%,#050505 100%);
    box-shadow:0 30px 90px rgba(0,0,0,.34);
}

.dfs-about-hero:before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:
        linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
    background-size:56px 56px;
    mask-image:linear-gradient(to bottom,#000,transparent 92%);
}

.dfs-about-hero:after{
    content:"";
    position:absolute;
    width:520px;
    height:520px;
    right:-170px;
    top:-260px;
    border:1px solid rgba(255,255,255,.045);
    border-radius:50%;
    box-shadow:0 0 0 80px rgba(255,255,255,.012),0 0 0 160px rgba(255,255,255,.008);
    pointer-events:none;
}

.dfs-about-inner{
    position:relative;
    z-index:1;
    display:grid;
    grid-template-columns:minmax(0,1.15fr) minmax(360px,.85fr);
    gap:70px;
    padding:78px 72px 72px;
}

.dfs-about-copy{max-width:790px}

.dfs-about-copy h1{
    margin:14px 0 22px;
    max-width:820px;
    font-size:clamp(48px,5.2vw,82px);
    line-height:.98;
    letter-spacing:-.065em;
    font-weight:800;
    color:#f5f5f5;
}

.dfs-about-copy h1 span{color:#77777c}

.dfs-about-lead{
    max-width:720px;
    margin:0 0 17px;
    color:#c3c3c7;
    font-size:17px;
    line-height:1.75;
}

.dfs-about-story{
    max-width:720px;
    margin:0;
    color:#77777d;
    font-size:14px;
    line-height:1.8;
}

.dfs-about-actions{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-top:32px;
}

.dfs-about-button{
    min-height:46px;
    display:inline-flex;
    align-items:center;
    gap:10px;
    padding:0 17px;
    border:1px solid #292929;
    border-radius:10px;
    background:#0c0c0c;
    color:#bdbdc2;
    font-size:9px;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
    transition:.2s ease;
}

.dfs-about-button:hover{background:#151515;color:#fff;border-color:#3b3b3b;transform:translateY(-1px)}
.dfs-about-button-primary{background:#efefef;color:#050505;border-color:#efefef}
.dfs-about-button-primary:hover{background:#fff;color:#050505;border-color:#fff}

.dfs-about-side{display:flex;flex-direction:column;gap:12px;align-self:stretch}

.dfs-about-panel{
    flex:1;
    min-height:390px;
    padding:25px;
    border:1px solid #242424;
    border-radius:15px;
    background:rgba(9,9,9,.86);
}

.dfs-panel-top{
    display:flex;
    justify-content:space-between;
    align-items:center;
    color:#64646a;
    font-size:8px;
    font-weight:900;
    letter-spacing:.13em;
}

.dfs-panel-top b{color:#444449;font-weight:800}

.dfs-story-line{width:100%;height:1px;margin:24px 0 25px;background:#252525}

.dfs-about-panel h2{
    max-width:430px;
    margin:0 0 14px;
    font-size:31px;
    line-height:1.05;
    letter-spacing:-.045em;
}

.dfs-about-panel h2 span{color:#737379}

.dfs-about-panel p{max-width:470px;color:#77777d;font-size:13px;line-height:1.8}

.dfs-story-people{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    margin-top:34px;
}

.dfs-story-people div{
    padding:14px;
    border:1px solid #202020;
    border-radius:10px;
    background:#0c0c0c;
}

.dfs-story-people strong{display:block;font-size:11px;letter-spacing:.08em}
.dfs-story-people span{display:block;margin-top:6px;color:#55555a;font-size:7px;font-weight:900;letter-spacing:.1em}

.dfs-about-mini-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}

.dfs-about-mini{
    min-height:78px;
    padding:15px;
    border:1px solid #202020;
    border-radius:10px;
    background:#090909;
}

.dfs-about-mini strong{display:block;font-size:9px;letter-spacing:.1em}
.dfs-about-mini span{display:block;margin-top:7px;color:#57575d;font-size:8px}

/* Keep the catalogue clearly below the full-width introduction. */
#store.store-section{margin-top:34px!important;padding-top:44px!important}

@media(max-width:1050px){
    .dfs-about-inner{grid-template-columns:1fr;gap:28px;padding:60px 46px}
    .dfs-about-copy{max-width:none}
    .dfs-about-side{display:grid;grid-template-columns:1fr 1fr}
    .dfs-about-panel{min-height:350px}
}

@media(max-width:700px){
    .dfs-about-hero{width:calc(100% - 14px);margin-top:18px;border-radius:16px}
    .dfs-about-inner{padding:42px 22px 28px;gap:22px}
    .dfs-about-copy h1{font-size:clamp(42px,13vw,62px)}
    .dfs-about-lead{font-size:15px}
    .dfs-about-story{font-size:13px}
    .dfs-about-side{display:block}
    .dfs-about-panel{min-height:0;padding:20px}
    .dfs-story-people{grid-template-columns:1fr;margin-top:25px}
    .dfs-about-mini-grid{margin-top:10px}
    #store.store-section{margin-top:20px!important;padding-top:30px!important}
}


/* DFScripts cart visibility / live count */
#cartButton{white-space:nowrap}
#cartButton #cartCount{display:inline-flex!important;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px}
.cart-drawer .cart-head h2{display:flex;align-items:center;gap:5px}
#cartItemsLabel{display:inline-block;min-width:18px}


/* =========================================================
   DFScripts — Live System Status
   ========================================================= */

.status-nav-link{
    display:inline-flex !important;
    align-items:center;
    gap:6px;
}

.status-nav-dot{
    width:5px;
    height:5px;
    flex:0 0 5px;
    border-radius:50%;
    background:#42d392;
    box-shadow:0 0 9px rgba(66,211,146,.65);
    animation:dfsStatusPulse 2s ease-in-out infinite;
}

.status-section{
    width:min(1260px,calc(100% - 34px));
    margin:110px auto 0;
    padding:0 0 18px;
}

.status-head{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:30px;
    padding-bottom:28px;
    border-bottom:1px solid #202020;
}

.status-head h2{
    margin-top:13px;
    font-size:clamp(34px,4vw,58px);
    line-height:.95;
    letter-spacing:-.055em;
    font-weight:900;
}

.status-head h2 span{
    color:#5d5d5d;
}

.status-summary{
    min-width:250px;
    display:flex;
    align-items:center;
    gap:11px;
    padding:12px 15px;
    border:1px solid #252525;
    border-radius:11px;
    background:#090909;
}

.status-summary-dot{
    width:8px;
    height:8px;
    flex:0 0 8px;
    border-radius:50%;
    background:#777;
}

.status-summary strong{
    display:block;
    font-size:9px;
    font-weight:900;
    letter-spacing:.03em;
}

.status-summary small{
    display:block;
    margin-top:4px;
    color:#5e5e5e;
    font-size:7px;
    font-weight:700;
}

.status-summary.is-online .status-summary-dot{
    background:#42d392;
    box-shadow:0 0 12px rgba(66,211,146,.6);
}

.status-summary.is-issue .status-summary-dot{
    background:#ff5f5f;
    box-shadow:0 0 12px rgba(255,95,95,.55);
}

.status-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
    margin-top:18px;
}

.status-card{
    position:relative;
    min-width:0;
    display:flex;
    align-items:center;
    gap:13px;
    padding:17px;
    border:1px solid #202020;
    border-radius:13px;
    background:#090909;
    transition:border-color .2s ease,background .2s ease,transform .2s ease;
}

.status-card:hover{
    border-color:#303030;
    background:#0d0d0d;
    transform:translateY(-2px);
}

.status-card-icon{
    width:39px;
    height:39px;
    flex:0 0 39px;
    display:grid;
    place-items:center;
    border:1px solid #242424;
    border-radius:10px;
    background:#101010;
    color:#aaa;
    font-size:14px;
}

.status-card-copy{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:4px;
}

.status-card-copy > span{
    color:#555;
    font-size:6px;
    font-weight:900;
    letter-spacing:.16em;
}

.status-card-copy > strong{
    font-size:11px;
    font-weight:900;
    letter-spacing:.01em;
}

.status-card-copy > small{
    color:#626262;
    font-size:7px;
    font-weight:700;
}

.status-card-result{
    margin-left:auto;
    min-width:62px;
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:7px;
}

.status-indicator{
    width:6px;
    height:6px;
    flex:0 0 6px;
    border-radius:50%;
    background:#666;
}

.status-value{
    min-width:48px;
    text-align:right;
    color:#8a8a8a;
    font-size:9px;
    font-weight:900;
}

.status-card.is-online .status-indicator{
    background:#42d392;
    box-shadow:0 0 10px rgba(66,211,146,.55);
}

.status-card.is-online .status-value{
    color:#42d392;
}

.status-card.is-online .status-card-icon{
    color:#42d392;
    border-color:rgba(66,211,146,.18);
}

.status-card.is-issue .status-indicator{
    background:#ff5f5f;
    box-shadow:0 0 10px rgba(255,95,95,.5);
}

.status-card.is-issue .status-value{
    color:#ff5f5f;
}

.status-card.is-issue .status-card-icon{
    color:#ff5f5f;
    border-color:rgba(255,95,95,.18);
}

.status-card.is-unknown .status-indicator{
    background:#777;
}

.status-card.is-unknown .status-value{
    color:#777;
}

.status-footer{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:18px;
    margin-top:13px;
    color:#4f4f4f;
    font-size:6px;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.status-footer span{
    display:inline-flex;
    align-items:center;
    gap:6px;
}

.status-footer i{
    font-size:7px;
}

@keyframes dfsStatusPulse{
    0%,100%{opacity:.55;transform:scale(.9)}
    50%{opacity:1;transform:scale(1.15)}
}

@media (max-width:900px){
    .status-head{
        align-items:flex-start;
        flex-direction:column;
    }

    .status-summary{
        min-width:0;
        width:100%;
    }
}

@media (max-width:700px){
    .status-grid{
        grid-template-columns:1fr;
    }

    .status-section{
        margin-top:80px;
    }

    .status-footer{
        line-height:1.8;
    }
}

@media (max-width:560px){
    .status-card{
        padding:14px;
    }

    .status-card-copy > strong{
        font-size:10px;
    }

    .status-card-result{
        min-width:54px;
    }
}


/* DFScripts status v13 — slow != offline */
.status-nav-dot.is-online{
    background:#42d392;
    box-shadow:0 0 9px rgba(66,211,146,.65);
}
.status-nav-dot.is-warning{
    background:#f2c94c;
    box-shadow:0 0 9px rgba(242,201,76,.55);
}
.status-nav-dot.is-issue{
    background:#ff5f5f;
    box-shadow:0 0 9px rgba(255,95,95,.65);
}
.status-summary.is-warning .status-summary-dot{
    background:#f2c94c;
    box-shadow:0 0 12px rgba(242,201,76,.55);
}
.status-card.is-warning .status-indicator{
    background:#f2c94c;
    box-shadow:0 0 10px rgba(242,201,76,.5);
}
.status-card.is-warning .status-value{
    color:#f2c94c;
}
.status-card.is-warning .status-card-icon{
    color:#f2c94c;
    border-color:rgba(242,201,76,.18);
}
.status-card.is-warning .status-card-copy > small{
    color:#9a8334;
}


/* DFScripts status v14 — explicit state rendering (stale CSS safe) */
.status-card[data-status-state="online"] .status-indicator{
    background:#42d392 !important;
    box-shadow:0 0 10px rgba(66,211,146,.55) !important;
}
.status-card[data-status-state="online"] .status-value{
    color:#42d392 !important;
}
.status-card[data-status-state="online"] .status-card-icon{
    color:#42d392 !important;
    border-color:rgba(66,211,146,.18) !important;
}
.status-card[data-status-state="warning"] .status-indicator{
    background:#f2c94c !important;
    box-shadow:0 0 10px rgba(242,201,76,.5) !important;
}
.status-card[data-status-state="warning"] .status-value{
    color:#f2c94c !important;
}
.status-card[data-status-state="warning"] .status-card-icon{
    color:#f2c94c !important;
    border-color:rgba(242,201,76,.18) !important;
}
.status-card[data-status-state="warning"] .status-card-copy > small{
    color:#9a8334 !important;
}
.status-card[data-status-state="issue"] .status-indicator{
    background:#ff5f5f !important;
    box-shadow:0 0 10px rgba(255,95,95,.5) !important;
}
.status-card[data-status-state="issue"] .status-value{
    color:#ff5f5f !important;
}
.status-card[data-status-state="issue"] .status-card-icon{
    color:#ff5f5f !important;
    border-color:rgba(255,95,95,.18) !important;
}
.status-card[data-status-state="unknown"] .status-indicator{
    background:#777 !important;
    box-shadow:none !important;
}
.status-card[data-status-state="unknown"] .status-value{
    color:#777 !important;
}
.status-summary.is-warning .status-summary-dot{
    background:#f2c94c !important;
    box-shadow:0 0 12px rgba(242,201,76,.55) !important;
}


/* Readability fix: product action buttons / "Add to cart" */
.product-info button,
.product-info > a {
    min-height: 46px;
    height: auto;
    padding: 12px 14px;
    font-size: 12px;
    line-height: 1.35;
    letter-spacing: .01em;
    font-weight: 800;
    text-align: left;
}

.product-info button span,
.product-info > a span {
    font-size: inherit;
    line-height: inherit;
}

@media (max-width: 600px) {
    .product-info button,
    .product-info > a {
        font-size: 13px;
        min-height: 48px;
    }
}


/* Extra contrast tuning: make "Add to cart" clearly recognizable */
.product-info button,
.product-info > a {
    background: #f5f5f5;
    color: #f5f5f5;
    border: 1px solid #f4c542;
    box-shadow: 0 2px 0 rgba(0, 0, 0, .18);
    text-shadow: none;
}

.product-info button:hover,
.product-info > a:hover {
    background: #ffd866;
    color: #111;
    border-color: #ffd866;
}

.product-info button:focus-visible,
.product-info > a:focus-visible {
    outline: 3px solid #ffffff;
    outline-offset: 3px;
}

.product-info button span,
.product-info > a span {
    color: inherit;
}