/* Dipindah dari shop/index.php (blok #8, id=sg-mobile-final-rhythm) */
    /* Final mobile rhythm pass for the homepage surface. */
    @media (max-width: 760px) {
        .tg-main {
            padding-top: 8px !important;
            padding-bottom: calc(12px + var(--sg-bottom-nav-clearance, 64px)) !important;
        }

        body.has-mobile-checkout-cta .tg-main {
            padding-bottom: calc(16px + var(--sg-sticky-cta-clearance, 80px)) !important;
        }

        .sg-home-hero {
            gap: 14px !important;
            padding: 2px 0 0 !important;
        }

        .sg-home-hero .sg-hero-carousel {
            border-radius: 21px !important;
            box-shadow: 0 14px 30px -25px rgba(26, 134, 255,.72) !important;
        }

        html[data-theme="light"] .sg-home-hero .sg-hero-carousel {
            border-color: #d8e8ff !important;
            box-shadow: 0 14px 30px -25px rgba(15,23,42,.34) !important;
        }

        .sg-home-hero .sg-promo-banner {
            padding: 2px 2px 0 !important;
        }

        .sg-home-hero .sg-promo-banner-body {
            max-width: 100% !important;
        }

        .sg-home-hero .sg-promo-banner-title {
            max-width: 22ch !important;
            margin: 0 0 8px !important;
            font-size: clamp(1.28rem, 6.2vw, 1.46rem) !important;
            line-height: 1.11 !important;
            letter-spacing: -.035em !important;
        }

        .sg-home-hero .sg-promo-banner-desc {
            max-width: 40ch !important;
            margin: 0 !important;
            font-size: .86rem !important;
            line-height: 1.48 !important;
        }

        .sg-home-content {
            gap: 13px !important;
            padding-top: 12px !important;
        }

        .sg-tabs-wrap {
            margin: 0 !important;
            padding: 13px 12px 12px !important;
            border-radius: 22px !important;
            overflow: hidden !important;
        }

        html[data-theme="light"] .sg-tabs-wrap {
            background: linear-gradient(180deg, #f2f8ff 0%, #ffffff 100%) !important;
            border-color: #d9e9ff !important;
            box-shadow: 0 12px 26px -24px rgba(15,23,42,.34) !important;
        }

        html:not([data-theme="light"]) .sg-tabs-wrap {
            background: linear-gradient(180deg, #080d18 0%, #050505 100%) !important;
            border-color: rgba(120,170,255,.16) !important;
            box-shadow: 0 12px 28px -24px rgba(26, 134, 255,.75) !important;
        }

        .sg-market-quick .tg-market-section.sg-section {
            margin: 0 !important;
            padding: 13px 12px 12px !important;
            border-radius: 22px !important;
            overflow: hidden !important;
        }

        html[data-theme="light"] .sg-market-quick .tg-market-section.sg-section {
            background: linear-gradient(180deg, #f2f8ff 0%, #ffffff 100%) !important;
            border-color: #d9e9ff !important;
            box-shadow: 0 12px 26px -24px rgba(15,23,42,.34) !important;
        }

        html:not([data-theme="light"]) .sg-market-quick .tg-market-section.sg-section {
            background: linear-gradient(180deg, #080d18 0%, #050505 100%) !important;
            border-color: rgba(120,170,255,.16) !important;
            box-shadow: 0 12px 28px -24px rgba(26, 134, 255,.75) !important;
        }

        .sg-tabs-wrap::before,
        .sg-tabs-wrap::after {
            display: none !important;
        }

        .sg-tabs-wrap .sg-section-head,
        .sg-market-quick .tg-market-section.sg-section .sg-section-head {
            margin-bottom: 10px !important;
        }

        .sg-tabs-wrap .sg-section-title,
        .sg-market-quick .tg-market-section.sg-section .sg-section-title {
            margin-bottom: 4px !important;
            font-size: 1.04rem !important;
            line-height: 1.15 !important;
        }

        .sg-tabs-wrap .sg-section-desc,
        .sg-market-quick .tg-market-section.sg-section .sg-section-desc {
            font-size: .78rem !important;
            line-height: 1.42 !important;
            color: rgba(255,255,255,.66) !important;
        }

        html[data-theme="light"] .sg-tabs-wrap .sg-section-desc,
        html[data-theme="light"] .sg-market-quick .tg-market-section.sg-section .sg-section-desc {
            color: #5f6f86 !important;
        }

        .sg-tabs {
            gap: 7px !important;
            margin: 0 -6px !important;
            padding: 1px 6px 0 !important;
            scroll-padding-inline: 6px !important;
        }

        .sg-tab {
            min-height: 38px !important;
            padding: 8px 11px !important;
            border-radius: 999px !important;
            gap: 6px !important;
            font-size: .78rem !important;
            line-height: 1 !important;
        }

        .sg-tab i {
            font-size: .94rem !important;
        }

        .sg-search-section {
            position: relative !important;
            top: auto !important;
            z-index: 1 !important;
            margin: -2px 0 2px !important;
            padding: 0 !important;
        }

        .sg-search-section::before {
            display: none !important;
        }

        .sg-hero-search-standalone {
            min-height: 48px !important;
            border-radius: 18px !important;
            padding: 6px 12px !important;
            border-color: rgba(120,170,255,.16) !important;
            background: #080808 !important;
            box-shadow: 0 12px 28px -24px rgba(26, 134, 255,.8) !important;
        }

        html[data-theme="light"] .sg-hero-search-standalone {
            background: #ffffff !important;
            border-color: #d8e8ff !important;
            box-shadow: 0 12px 28px -24px rgba(15,23,42,.34) !important;
        }

        .sg-hero-search-standalone > i.bi-search {
            left: 13px !important;
            color: rgba(255,255,255,.62) !important;
        }

        html[data-theme="light"] .sg-hero-search-standalone > i.bi-search {
            color: #64748b !important;
        }

        .sg-hero-search-standalone input {
            min-height: 34px !important;
            padding: 8px 2px !important;
            font-size: .88rem !important;
        }
    }

    @media (max-width: 380px) {
        .sg-home-hero .sg-promo-banner-title {
            font-size: 1.25rem !important;
        }

        .sg-tabs-wrap,
        .sg-market-quick .tg-market-section.sg-section {
            padding-inline: 11px !important;
        }

        .sg-tab {
            padding-inline: 10px !important;
            font-size: .76rem !important;
        }
    }