/* DFScripts catalog / product presentation — inspired by the clean FiveM storefront layout, not copied assets. */
.store-section#store{max-width:1180px;margin:0 auto;padding:110px 28px 70px}
.store-section#store .section-head{max-width:1180px;margin:0 auto 34px;display:flex;justify-content:space-between;gap:40px;align-items:end}
.store-section#store .section-head h2{margin:8px 0 0;font-size:clamp(32px,4vw,48px);letter-spacing:-.04em}
.store-section#store .section-head p{max-width:440px;margin:0;color:#8e8e94;line-height:1.65}
.compact-product-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px!important;align-items:stretch}
.compact-product-grid .product-card{display:flex!important;flex-direction:column!important;min-width:0;overflow:hidden!important;border:1px solid rgba(255,255,255,.075)!important;border-radius:16px!important;background:#101011!important;box-shadow:0 16px 45px rgba(0,0,0,.24)!important;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease!important}
.compact-product-grid .product-card:hover{transform:translateY(-4px);border-color:rgba(255,255,255,.18)!important;box-shadow:0 24px 60px rgba(0,0,0,.36)!important}
.compact-product-grid .product-preview-image{width:100%!important;height:220px!important;min-height:220px!important;margin:0!important;border:0!important;border-radius:0!important;background:#242426!important;overflow:hidden!important;position:relative!important}
.compact-product-grid .product-preview-image img{width:100%!important;height:100%!important;display:block!important;object-fit:cover!important;object-position:center!important;transition:transform .35s ease!important}
.compact-product-grid .product-card:hover .product-preview-image img{transform:scale(1.025)}
.compact-product-grid .product-copy{padding:20px 20px 8px!important;display:block!important;flex:1!important}
.compact-product-grid .product-topline{display:flex!important;justify-content:space-between!important;align-items:center!important;gap:10px!important;margin-bottom:11px!important;font-size:10px!important;letter-spacing:.13em!important;font-weight:800!important;color:#777!important}
.compact-product-grid .product-topline b{font-size:9px!important;letter-spacing:.12em!important;color:#aaa!important}
.compact-product-grid .product-copy h3{margin:0 0 8px!important;font-size:20px!important;letter-spacing:-.025em!important;color:#f2f2f2!important}
.compact-product-grid .product-copy p{margin:0!important;color:#85858b!important;font-size:13px!important;line-height:1.55!important}
.compact-product-grid .soon-card-meta,.compact-product-grid .available-card-meta{display:flex!important;justify-content:space-between!important;align-items:center!important;padding:16px 20px 20px!important;border-top:1px solid rgba(255,255,255,.06)!important;margin-top:10px!important}
.compact-product-grid .soon-card-meta span,.compact-product-grid .available-card-meta span{font-size:15px!important;font-weight:800!important;color:#f1f1f1!important}
.compact-product-grid .soon-card-meta b,.compact-product-grid .available-card-meta b{font-size:10px!important;letter-spacing:.1em!important;color:#aaa!important}
.compact-product-grid .product-mini-icon{height:220px!important;min-height:220px!important;margin:0!important;border-radius:0!important;background:#242426!important;display:grid!important;place-items:center!important;font-size:42px!important;color:#777!important}
/* Modal: large image-first product detail, so one click opens the complete product view. */
.product-modal{padding:20px!important}
.product-modal-window{width:min(1000px,96vw)!important;max-height:92vh!important;overflow:auto!important;border:1px solid rgba(255,255,255,.1)!important;border-radius:18px!important;background:#101011!important;box-shadow:0 35px 110px rgba(0,0,0,.72)!important}
.product-modal-hero{height:410px!important;min-height:410px!important;background:#242426!important;border-bottom:1px solid rgba(255,255,255,.07)!important;display:flex!important;align-items:center!important;justify-content:center!important;overflow:hidden!important}
.product-modal-image{width:100%!important;height:100%!important;max-width:none!important;object-fit:cover!important;filter:none!important;border-radius:0!important}
.product-modal-window .product-modal-gallery,.product-modal-window .dfs-product-gallery{bottom:18px!important}
.product-modal-content{padding:28px 30px 30px!important}
.product-modal-close{z-index:20!important;width:38px!important;height:38px!important;border-radius:10px!important;background:rgba(0,0,0,.65)!important;border:1px solid rgba(255,255,255,.14)!important}
@media(max-width:950px){.compact-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.store-section#store{padding-left:20px;padding-right:20px}}
@media(max-width:620px){.store-section#store .section-head{display:block}.store-section#store .section-head p{margin-top:16px}.compact-product-grid{grid-template-columns:1fr}.compact-product-grid .product-preview-image,.compact-product-grid .product-mini-icon{height:210px!important;min-height:210px!important}.product-modal-hero{height:270px!important;min-height:270px!important}}

/* Final homepage store layout: no hero/banner on the page itself. */
.dfs-old-hero-hidden{display:none!important}
.store-intro-bar{max-width:1180px;margin:0 auto;padding:108px 28px 12px;display:flex;align-items:end;justify-content:space-between;gap:30px}
.store-intro-bar h1{margin:10px 0 8px;font-size:clamp(38px,5vw,62px);line-height:1.02;letter-spacing:-.055em;color:#f4f4f5}
.store-intro-bar h1 span{color:#8e8e94}
.store-intro-bar p{margin:0;max-width:620px;color:#85858b;font-size:15px;line-height:1.7}
.store-intro-meta{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.store-intro-meta span{padding:9px 12px;border:1px solid rgba(255,255,255,.09);border-radius:999px;background:#151516;color:#8f8f95;font-size:10px;font-weight:800;letter-spacing:.1em}
.store-section#store{padding-top:34px}
.compact-product-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.compact-product-grid .product-card{min-width:0;overflow:hidden;border-radius:14px;background:#111113;border:1px solid rgba(255,255,255,.075);box-shadow:0 12px 35px rgba(0,0,0,.22);transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease}
.compact-product-grid .product-card:hover{transform:translateY(-4px);border-color:rgba(255,255,255,.16);box-shadow:0 20px 50px rgba(0,0,0,.34)}
.compact-product-grid .product-preview-image{height:245px!important;min-height:245px!important;background:#252527!important}
.compact-product-grid .product-preview-image img{object-fit:cover!important}
.compact-product-grid .product-copy{padding:18px 18px 4px!important}
.compact-product-grid .soon-card-meta,.compact-product-grid .available-card-meta{padding:15px 18px 18px!important}
@media(max-width:950px){.compact-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.store-intro-bar{padding-left:20px;padding-right:20px}}
@media(max-width:620px){.compact-product-grid{grid-template-columns:1fr}.store-intro-bar{display:block;padding-top:92px}.store-intro-meta{justify-content:flex-start;margin-top:18px}.compact-product-grid .product-preview-image{height:230px!important;min-height:230px!important}}


/* Final visual cleanup: store starts immediately below navigation. */
.store-intro-bar{padding:54px 28px 12px!important;min-height:0!important}
.store-section#store{padding-top:24px!important}
/* Product detail: the real preview fills the entire grey hero area. */
.product-modal-hero{position:relative!important;height:440px!important;min-height:440px!important;padding:0!important;background:#242426!important}
.product-modal-image{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:none!important;object-fit:cover!important;object-position:center!important;display:block!important;filter:none!important;border-radius:0!important;z-index:2!important}
.product-modal-orbit,.product-modal-grid,.product-modal-code{display:none!important}
.product-modal-hero::before,.product-modal-hero::after{display:none!important}
@media(max-width:620px){.store-intro-bar{padding:40px 20px 8px!important}.store-section#store{padding-top:18px!important}.product-modal-hero{height:280px!important;min-height:280px!important}}

#store.reveal-on-scroll{opacity:1!important;transform:none!important;visibility:visible!important}


/* Final product modal image fix: hero uses the same 16:9 ratio as the real preview, so no empty grey frame surrounds it. */
.product-modal-hero{width:100%!important;height:auto!important;min-height:0!important;aspect-ratio:16/9!important;padding:0!important;background:#242426!important;overflow:hidden!important}
.product-modal-hero .product-modal-image{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:none!important;object-fit:cover!important;object-position:center!important;display:block!important;border-radius:0!important;filter:none!important}
.product-modal-hero .dfs-product-gallery,.product-modal-hero .product-modal-gallery{z-index:10!important}
@media(max-width:620px){.product-modal-hero{aspect-ratio:16/9!important;height:auto!important;min-height:0!important}}

/* FINAL MODAL IMAGE FIX */
.product-modal-window{overflow:auto!important}
.product-modal-hero{
    position:relative!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    aspect-ratio:auto!important;
    display:block!important;
    padding:0!important;
    margin:0!important;
    overflow:hidden!important;
    background:#242426!important;
}
.product-modal-hero .product-modal-image{
    position:relative!important;
    inset:auto!important;
    display:block!important;
    width:100%!important;
    max-width:none!important;
    height:auto!important;
    max-height:none!important;
    padding:0!important;
    margin:0!important;
    object-fit:fill!important;
    object-position:center!important;
    border-radius:0!important;
    opacity:1!important;
    filter:none!important;
    z-index:2!important;
}
.product-modal-hero:before,.product-modal-hero:after,
.product-modal-grid,.product-modal-orbit,.product-modal-code{
    display:none!important;
    content:none!important;
    animation:none!important;
}
@media(max-width:700px){
    .product-modal-hero{height:auto!important;min-height:0!important}
    .product-modal-hero .product-modal-image{width:100%!important;height:auto!important;max-height:none!important}
}


/* FINAL ADD TO CART CONTRAST FIX */
.product-info button,
.product-info > a,
.product-card button,
.product-card a[class*="cart"],
.product-card a[class*="buy"],
.product-card button[class*="cart"],
.product-card button[class*="buy"] {
    background: #f4c542 !important;
    color: #111111 !important;
    border: 2px solid #f4c542 !important;
    min-height: 48px !important;
    height: auto !important;
    padding: 12px 16px !important;
    font-size: 13px !important;
    line-height: 1.35 !important;
    font-weight: 900 !important;
    letter-spacing: .01em !important;
    text-align: center !important;
    text-shadow: none !important;
    box-shadow: 0 3px 0 rgba(0,0,0,.25) !important;
    opacity: 1 !important;
}

.product-info button *,
.product-info > a *,
.product-card button *,
.product-card a[class*="cart"] *,
.product-card a[class*="buy"] * {
    color: #111111 !important;
    opacity: 1 !important;
    text-shadow: none !important;
}

.product-info button:hover,
.product-info > a:hover,
.product-card button:hover,
.product-card a[class*="cart"]:hover,
.product-card a[class*="buy"]:hover,
.product-card button[class*="cart"]:hover,
.product-card button[class*="buy"]:hover {
    background: #ffe07a !important;
    color: #111111 !important;
    border-color: #ffe07a !important;
    transform: translateY(-1px);
}

.product-info button:focus-visible,
.product-info > a:focus-visible,
.product-card button:focus-visible,
.product-card a[class*="cart"]:focus-visible,
.product-card a[class*="buy"]:focus-visible {
    outline: 3px solid #ffffff !important;
    outline-offset: 3px !important;
}

@media (max-width: 620px) {
    .product-info button,
    .product-info > a,
    .product-card button,
    .product-card a[class*="cart"],
    .product-card a[class*="buy"] {
        min-height: 50px !important;
        font-size: 14px !important;
    }
}