:root {
            --primary: #075985;
            --primary-dark: #0c4a6e;
            --primary-soft: #e0f2fe;
            --accent: #f97316;
            --accent-dark: #ea580c;
            --green: #16a34a;
            --text: #172033;
            --muted: #64748b;
            --bg: #f6f8fb;
            --card: #ffffff;
            --border: #e5e7eb;
            --shadow: 0 12px 35px rgba(15, 23, 42, .08);
            --radius: 18px;
        }

        * { box-sizing: border-box; }
        html { scroll-behavior: smooth; }
        body {
            margin: 0;
            font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
            color: var(--text);
            background: var(--bg);
            line-height: 1.55;
        }
        a { color: inherit; text-decoration: none; }
        img { max-width: 100%; display: block; }
        button, input { font: inherit; }
        .container {
            width: min(1180px, calc(100% - 32px));
            margin-inline: auto;
        }

        /* Top bar */
        .topbar {
            background: var(--primary-dark);
            color: #fff;
            font-size: 14px;
        }
        .topbar-inner {
            min-height: 42px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 16px;
        }
        .topbar-links {
            display: flex;
            gap: 18px;
            flex-wrap: wrap;
        }
        .topbar a:hover { text-decoration: underline; }

        /* Header */
        .header {
            background: #fff;
            border-bottom: 1px solid var(--border);
            position: sticky;
            top: 0;
            z-index: 1000;
        }
        .header-inner {
            min-height: 82px;
            display: grid;
            grid-template-columns: 210px 1fr auto;
            align-items: center;
            gap: 24px;
        }
        .logo img {
            width: 185px;
            max-height: 58px;
            object-fit: contain;
            object-position: left center;
        }
        .search {
            position: relative;
        }
        .search-box {
            width: 100%;
            height: 46px;
            border: 1px solid #d7dee8;
            border-radius: 12px;
            padding: 0 48px 0 16px;
            outline: none;
            background: #f8fafc;
            transition: .2s;
        }
        .search-box:focus {
            border-color: #38bdf8;
            background: #fff;
            box-shadow: 0 0 0 4px rgba(56,189,248,.12);
        }
        .search-btn {
            position: absolute;
            right: 5px;
            top: 5px;
            height: 36px;
            width: 36px;
            border: 0;
            border-radius: 9px;
            background: var(--primary);
            color: #fff;
            cursor: pointer;
        }
        #livesearch {
            position: absolute;
            left: 0;
            right: 0;
            top: 52px;
            display: none;
            background: #fff;
            border: 1px solid var(--border);
            border-radius: 12px;
            box-shadow: var(--shadow);
            padding: 8px;
            z-index: 1100;
            max-height: 320px;
            overflow: auto;
        }
        .header-actions {
            display: flex;
            gap: 9px;
            align-items: center;
        }
        .header-action {
            display: inline-flex;
            align-items: center;
            gap: 7px;
            padding: 10px 12px;
            border: 1px solid var(--border);
            border-radius: 11px;
            background: #fff;
            font-size: 14px;
            font-weight: 700;
            white-space: nowrap;
        }
        .header-action.primary {
            background: var(--primary);
            color: #fff;
            border-color: var(--primary);
        }

        /* Navigation */
        .nav {
            background: #fff;
            border-bottom: 1px solid var(--border);
        }
        .nav-inner {
            min-height: 50px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 20px;
        }
        .nav-links {
            display: flex;
            align-items: center;
            gap: 4px;
            list-style: none;
            padding: 0;
            margin: 0;
        }
        .nav-links a {
            display: block;
            padding: 13px 15px;
            font-weight: 700;
            font-size: 14px;
            border-radius: 9px;
        }
        .nav-links a:hover, .nav-links a.active {
            color: var(--primary);
            background: var(--primary-soft);
        }
        .mobile-menu-btn {
            display: none;
            border: 0;
            background: var(--primary);
            color: #fff;
            width: 44px;
            height: 42px;
            border-radius: 10px;
            cursor: pointer;
        }

        /* Hero */
        .hero {
            padding: 32px 0 26px;
            background:
                radial-gradient(circle at 90% 10%, rgba(249,115,22,.18), transparent 32%),
                linear-gradient(135deg, #e0f2fe 0%, #f8fafc 52%, #fff7ed 100%);
        }
        .hero-grid {
            display: grid;
            grid-template-columns: 1.15fr .85fr;
            gap: 24px;
            align-items: stretch;
        }
        .hero-copy {
            min-height: 370px;
            border-radius: 24px;
            padding: clamp(28px, 5vw, 55px);
            background: linear-gradient(135deg, var(--primary-dark), var(--primary));
            color: #fff;
            box-shadow: var(--shadow);
            position: relative;
            overflow: hidden;
        }
        .hero-copy::after {
            content: "";
            width: 260px;
            height: 260px;
            border: 45px solid rgba(255,255,255,.08);
            border-radius: 50%;
            position: absolute;
            right: -90px;
            bottom: -110px;
        }
        .eyebrow {
            display: inline-flex;
            padding: 7px 12px;
            border-radius: 999px;
            background: rgba(255,255,255,.14);
            font-size: 13px;
            font-weight: 800;
            margin-bottom: 14px;
        }
        .hero h1 {
            margin: 0 0 13px;
            max-width: 650px;
            font-size: clamp(32px, 5vw, 54px);
            line-height: 1.06;
            letter-spacing: -1.5px;
        }
        .hero p {
            max-width: 600px;
            margin: 0 0 24px;
            color: #dbeafe;
            font-size: 17px;
        }
        .hero-buttons {
            display: flex;
            gap: 12px;
            flex-wrap: wrap;
        }
        .btn {
            border: 0;
            display: inline-flex;
            justify-content: center;
            align-items: center;
            gap: 8px;
            min-height: 46px;
            padding: 0 18px;
            border-radius: 11px;
            font-weight: 800;
            cursor: pointer;
            transition: transform .18s, box-shadow .18s;
        }
        .btn:hover { transform: translateY(-2px); }
        .btn-orange { background: var(--accent); color: #fff; box-shadow: 0 8px 20px rgba(249,115,22,.24); }
        .btn-white { background: #fff; color: var(--primary-dark); }
        .hero-side {
            min-height: 370px;
            background: #fff;
            border: 1px solid var(--border);
            border-radius: 24px;
            box-shadow: var(--shadow);
            padding: 26px;
        }
        .hero-side h2 { margin: 0 0 6px; font-size: 23px; }
        .hero-side p { margin: 0 0 18px; color: var(--muted); }
        .quick-list { display: grid; gap: 12px; }
        .quick-item {
            display: flex;
            align-items: center;
            gap: 13px;
            padding: 13px;
            border: 1px solid var(--border);
            border-radius: 14px;
            transition: .18s;
        }
        .quick-item:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(15,23,42,.07); }
        .quick-icon {
            width: 42px;
            height: 42px;
            border-radius: 12px;
            display: grid;
            place-items: center;
            background: var(--primary-soft);
            color: var(--primary);
            font-weight: 900;
        }
        .quick-item strong { display: block; }
        .quick-item span { color: var(--muted); font-size: 13px; }

        /* Benefits */
        .benefits { padding: 24px 0; }
        .benefit-grid {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 14px;
        }
        .benefit {
            background: #fff;
            border: 1px solid var(--border);
            border-radius: 16px;
            padding: 19px;
            display: flex;
            gap: 13px;
            align-items: flex-start;
        }
        .benefit img { width: 44px; height: 44px; object-fit: contain; }
        .benefit h3 { margin: 0 0 3px; font-size: 16px; }
        .benefit p { margin: 0; color: var(--muted); font-size: 13px; }

        /* Products */
        .section { padding: 28px 0; }
        .section-heading {
            display: flex;
            justify-content: space-between;
            align-items: end;
            gap: 20px;
            margin-bottom: 18px;
        }
        .section-heading h2 { margin: 0; font-size: clamp(24px, 4vw, 32px); }
        .section-heading p { margin: 5px 0 0; color: var(--muted); }
        .view-all { color: var(--primary); font-weight: 800; white-space: nowrap; }
        .tabs {
            display: flex;
            gap: 8px;
            overflow-x: auto;
            padding-bottom: 5px;
            margin-bottom: 18px;
            scrollbar-width: thin;
        }
        .tab {
            border: 1px solid var(--border);
            background: #fff;
            color: var(--muted);
            padding: 10px 15px;
            border-radius: 999px;
            cursor: pointer;
            font-weight: 800;
            white-space: nowrap;
        }
        .tab.active, .tab:hover {
            color: #fff;
            border-color: var(--primary);
            background: var(--primary);
        }
        .product-grid {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 18px;
        }
        .product-card {
            background: #fff;
            border: 1px solid var(--border);
            border-radius: var(--radius);
            overflow: hidden;
            box-shadow: 0 6px 18px rgba(15,23,42,.04);
            transition: transform .2s, box-shadow .2s;
        }
        .product-card:hover {
            transform: translateY(-5px);
            box-shadow: var(--shadow);
        }
        .product-image {
            background: #f8fafc;
            aspect-ratio: 1.25 / 1;
            display: grid;
            place-items: center;
            padding: 16px;
        }
        .product-image img {
            width: 100%;
            height: 100%;
            object-fit: contain;
            border-radius: 10px;
        }
        .product-body { padding: 17px; }
        .product-category {
            color: var(--primary);
            font-size: 11px;
            font-weight: 900;
            text-transform: uppercase;
            letter-spacing: .6px;
        }
        .product-title {
            margin: 5px 0 5px;
            font-size: 17px;
            line-height: 1.25;
            min-height: 43px;
        }
        .product-description {
            margin: 0 0 13px;
            color: var(--muted);
            font-size: 13px;
            min-height: 40px;
        }
        .product-bottom {
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: 8px;
            margin-bottom: 13px;
        }
        .price { font-size: 18px; font-weight: 900; color: var(--primary-dark); }
        .status { font-size: 11px; font-weight: 800; }
        .status-neutral { color: var(--muted); }
        .product-btn {
            width: 100%;
            background: var(--primary);
            color: #fff;
        }
        .product-btn:hover { background: var(--primary-dark); }

        /* How it works */
        .how {
            padding: 38px 0;
            background: #fff;
            border-top: 1px solid var(--border);
            border-bottom: 1px solid var(--border);
        }
        .steps {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 20px;
        }
        .step {
            text-align: center;
            padding: 22px;
        }
        .step-number {
            width: 54px;
            height: 54px;
            border-radius: 50%;
            display: grid;
            place-items: center;
            margin: 0 auto 13px;
            background: var(--primary-soft);
            color: var(--primary);
            font-size: 20px;
            font-weight: 900;
        }
        .step h3 { margin: 0 0 6px; }
        .step p { margin: 0; color: var(--muted); }

        /* CTA */
        .cta {
            padding: 34px 0;
        }
        .cta-box {
            background: linear-gradient(135deg, #0c4a6e, #075985);
            color: #fff;
            border-radius: 22px;
            padding: 30px clamp(22px, 5vw, 48px);
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: 20px;
        }
        .cta-box h2 { margin: 0 0 5px; }
        .cta-box p { margin: 0; color: #dbeafe; }

        /* Footer */
        footer {
            background: #0f172a;
            color: #cbd5e1;
            padding: 45px 0 0;
        }
        .footer-grid {
            display: grid;
            grid-template-columns: 1.3fr 1fr 1fr 1fr;
            gap: 35px;
        }
        footer h3 { color: #fff; margin: 0 0 13px; font-size: 16px; }
        footer p { color: #94a3b8; }
        .footer-links { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; }
        .footer-links a:hover { color: #fff; }
        .socials { display: flex; gap: 8px; margin-top: 16px; }
        .social {
            width: 38px;
            height: 38px;
            display: grid;
            place-items: center;
            border-radius: 10px;
            background: #1e293b;
            color: #fff;
            font-weight: 800;
        }
        .copyright {
            border-top: 1px solid #1e293b;
            margin-top: 35px;
            padding: 18px 0;
            text-align: center;
            color: #94a3b8;
            font-size: 13px;
        }

        .whatsapp {
            position: fixed;
            right: 20px;
            bottom: 20px;
            z-index: 1200;
            width: 58px;
            height: 58px;
            border-radius: 50%;
            display: grid;
            place-items: center;
            background: #25d366;
            color: #fff;
            font-size: 27px;
            font-weight: 900;
            box-shadow: 0 12px 30px rgba(37,211,102,.35);
        }
        .back-top {
            position: fixed;
            left: 20px;
            bottom: 20px;
            width: 42px;
            height: 42px;
            border: 0;
            border-radius: 10px;
            background: var(--primary);
            color: #fff;
            cursor: pointer;
            display: none;
            z-index: 1200;
        }

        @media (max-width: 1050px) {
            .header-inner { grid-template-columns: 170px 1fr auto; gap: 14px; }
            .header-action span { display: none; }
            .product-grid { grid-template-columns: repeat(3, 1fr); }
            .benefit-grid { grid-template-columns: repeat(2, 1fr); }
        }

        @media (max-width: 800px) {
            footer { display: none !important; }
            footer { display: none !important; }
            .topbar-inner { justify-content: center; text-align: center; }
            .topbar-links { display: none; }
            .header { position: relative; }
            .header-inner {
                grid-template-columns: 1fr auto;
                min-height: 72px;
            }
            .logo img { width: 155px; }
            .header-actions .header-action:nth-child(1),
            .header-actions .header-action:nth-child(2) { display: none; }
            .mobile-menu-btn { display: block; }
            .nav { display: none; }
            .nav.open { display: block; }
            .nav-inner { align-items: stretch; }
            .nav-links { flex-direction: column; align-items: stretch; padding: 8px 0; }
            .nav-links a { padding: 12px 10px; }
            .hero-grid { grid-template-columns: 1fr; }
            .hero-copy, .hero-side { min-height: auto; }
            .product-grid { grid-template-columns: repeat(2, 1fr); }
            .footer-grid { grid-template-columns: repeat(2, 1fr); }
        }

        @media (max-width: 560px) {
            .container { width: min(100% - 22px, 1180px); }
            .topbar { font-size: 12px; }
            .header-inner { grid-template-columns: 1fr auto; }
            .search { grid-column: 1 / -1; grid-row: 2; margin-bottom: 12px; }
            .header { padding-bottom: 1px; }
            .hero { padding-top: 16px; }
            .hero-copy { padding: 26px 21px; border-radius: 18px; }
            .hero h1 { font-size: 34px; }
            .hero p { font-size: 15px; }
            .hero-buttons .btn { width: 100%; }
            .benefit-grid { grid-template-columns: 1fr 1fr; gap: 9px; }
            .benefit { padding: 13px 10px; display: block; text-align: center; }
            .benefit img { margin: 0 auto 8px; }
            .benefit h3 { font-size: 13px; }
            .benefit p { font-size: 11px; }
            .section { padding: 22px 0; }
            .section-heading { align-items: flex-start; }
            .section-heading p { font-size: 13px; }
            .view-all { display: none; }
            .product-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
            .product-body { padding: 12px; }
            .product-title { font-size: 14px; min-height: 36px; }
            .product-description { font-size: 11px; min-height: 34px; }
            .price { font-size: 15px; }
            .product-bottom { display: block; }
            .product-bottom .status { display: block; margin-top: 3px; }
            .product-btn { min-height: 40px; font-size: 13px; }
            .steps { grid-template-columns: 1fr; gap: 4px; }
            .step { padding: 12px; }
            .cta-box { display: block; text-align: center; }
            .cta-box .btn { margin-top: 18px; width: 100%; }
            .footer-grid { grid-template-columns: 1fr; gap: 25px; }
            .whatsapp { right: 14px; bottom: 14px; }
            .back-top { left: 14px; bottom: 14px; }
        }
    
    .seo-intro{padding:72px 0 24px;background:#fff}
    .seo-copy-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:28px}
    .seo-copy-grid article{padding:24px;border:1px solid #e7ebf0;border-radius:18px;background:#fafbfd}
    .seo-copy-grid h3{margin:0 0 10px;font-size:19px}
    .seo-copy-grid p{margin:0;color:#596579;line-height:1.7}
    .faq-section{padding:72px 0;background:#f7f9fc}
    .faq-list{max-width:900px;margin:28px auto 0}
    .faq-list details{background:#fff;border:1px solid #e4e9f0;border-radius:14px;margin-bottom:12px;padding:0 20px}
    .faq-list summary{cursor:pointer;font-weight:700;padding:20px 4px;list-style:none}
    .faq-list summary::-webkit-details-marker{display:none}
    .faq-list summary:after{content:"+";float:right;font-size:22px}
    .faq-list details[open] summary:after{content:"−"}
    .faq-list details p{margin:0;padding:0 4px 20px;color:#596579;line-height:1.7}
    @media(max-width:800px){.seo-copy-grid{grid-template-columns:1fr}.seo-intro,.faq-section{padding:52px 0 20px}}

.footer-seo{max-width:900px;margin:0 auto 18px;text-align:center;color:#8a94a6;line-height:1.6;font-size:14px}


/* Mobile: hide the full footer */
@media (max-width: 800px) {
    footer { display: none !important; }
}


/* Featured hot-sale showcase */
.featured-showcase{
    display:grid;
    grid-template-columns:minmax(0, 1.75fr) minmax(310px, .85fr);
    gap:22px;
    margin:0 0 34px;
}
.featured-hot{
    position:relative;
    min-width:0;
    display:grid;
    grid-template-columns:minmax(280px, .95fr) minmax(300px, 1.05fr);
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:22px;
    background:#fff;
    box-shadow:0 12px 32px rgba(15,23,42,.08);
}
.featured-hot-badge{
    position:absolute;
    top:15px;
    left:15px;
    z-index:3;
    padding:7px 12px;
    border-radius:999px;
    background:#ef4444;
    color:#fff;
    font-size:11px;
    font-weight:900;
    letter-spacing:.05em;
}
.featured-hot-media{
    min-height:300px;
    padding:22px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#f4f8fb;
}
.featured-hot-media img{
    width:100%;
    height:255px;
    object-fit:contain;
    border-radius:14px;
}
.featured-hot-info{
    padding:30px 30px 28px;
    display:flex;
    flex-direction:column;
    justify-content:center;
}
.featured-hot-kicker{
    color:var(--primary);
    font-size:11px;
    font-weight:900;
    letter-spacing:.11em;
}
.featured-hot-info h2{
    margin:7px 0 10px;
    font-size:clamp(26px,2.5vw,38px);
    line-height:1.1;
}
.featured-hot-info p{
    margin:0 0 18px;
    color:var(--muted);
    font-size:14px;
    line-height:1.65;
}
.featured-hot-meta{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:12px;
    margin-bottom:20px;
}
.featured-hot-meta strong{
    font-size:25px;
    font-weight:900;
    color:var(--primary-dark);
}
.featured-hot-meta span{
    font-size:11px;
    font-weight:800;
}
.featured-hot-actions{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:15px;
}
.featured-hot-actions > a:not(.btn){
    color:var(--primary);
    font-weight:800;
    font-size:13px;
}

/* Products to the right of the hot sale */
.featured-picks{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:10px;
}
.featured-picks-title{
    padding:1px 3px 3px;
}
.featured-picks-title span{
    color:var(--primary);
    font-size:10px;
    font-weight:900;
    letter-spacing:.11em;
}
.featured-picks-title h2{
    margin:4px 0 0;
    font-size:22px;
    line-height:1.2;
}
.featured-pick{
    display:grid;
    grid-template-columns:82px minmax(0,1fr);
    gap:12px;
    align-items:center;
    min-height:92px;
    padding:9px;
    background:#fff;
    border:1px solid var(--border);
    border-radius:15px;
    box-shadow:0 5px 17px rgba(15,23,42,.055);
}
.featured-pick-image{
    height:72px;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    border-radius:10px;
    background:#f5f7fa;
}
.featured-pick-image img{
    width:100%;
    height:100%;
    object-fit:contain;
}
.featured-pick-info{
    min-width:0;
}
.featured-pick-info > span{
    display:block;
    margin-bottom:2px;
    color:var(--primary);
    font-size:9px;
    font-weight:900;
    letter-spacing:.08em;
}
.featured-pick-info h3{
    margin:0 0 6px;
    font-size:14px;
    line-height:1.2;
}
.featured-pick-info h3 a{
    color:var(--text);
}
.featured-pick-info > div{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:8px;
}
.featured-pick-info strong{
    color:var(--primary-dark);
    font-size:13px;
    white-space:nowrap;
}
.featured-pick-info > div a{
    color:var(--primary);
    font-size:11px;
    font-weight:900;
}
.featured-picks-all{
    min-height:40px;
    display:grid;
    place-items:center;
    border:1px dashed #b8c4d2;
    border-radius:12px;
    background:#f8fafc;
    color:var(--primary);
    font-size:12px;
    font-weight:900;
}

/* Product carousel */
.product-carousel{
    position:relative;
    display:grid;
    grid-template-columns:42px minmax(0,1fr) 42px;
    gap:10px;
    align-items:center;
}
.product-track-wrap{
    min-width:0;
    overflow:hidden;
}
.product-track{
    display:grid;
    grid-auto-flow:column;
    grid-auto-columns:calc((100% - 54px) / 4);
    grid-template-columns:none;
    gap:18px;
    transition:transform .35s ease;
    will-change:transform; transform:translate3d(0,0,0);
}
.product-track .product-card{
    width:auto;
    min-width:0;
}
.carousel-arrow{
    width:42px;
    height:42px;
    display:grid;
    place-items:center;
    border:1px solid #d8e0e9;
    border-radius:50%;
    background:#fff;
    color:var(--primary);
    font-size:29px;
    line-height:1;
    cursor:pointer;
    box-shadow:0 6px 16px rgba(15,23,42,.08);
    z-index:2;
}
.carousel-arrow:hover:not(:disabled){
    background:#f2f7fa;
    transform:scale(1.04);
}
.carousel-arrow:disabled{
    opacity:.3;
    cursor:not-allowed;
}
.carousel-arrow:focus-visible{
    outline:3px solid rgba(7,89,133,.2);
    outline-offset:2px;
}

@media(max-width:1050px){
    .featured-showcase{
        grid-template-columns:minmax(0,1.35fr) minmax(280px,.8fr);
        gap:16px;
    }
    .featured-hot{
        grid-template-columns:1fr;
    }
    .featured-hot-media{
        min-height:210px;
    }
    .featured-hot-media img{
        height:175px;
    }
    .featured-hot-info{
        padding:23px;
    }
    .product-track{
        grid-auto-columns:calc((100% - 36px) / 3);
    }
}

@media(max-width:800px){
    .featured-showcase{
        grid-template-columns:1fr;
        gap:20px;
    }
    .featured-hot{
        grid-template-columns:1fr;
        border-radius:19px;
    }
    .featured-hot-media{
        min-height:215px;
        padding:18px;
    }
    .featured-hot-media img{
        height:185px;
    }
    .featured-hot-info{
        padding:25px 21px 27px;
    }
    .featured-hot-info h2{
        font-size:28px;
    }
    .featured-picks{
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:10px;
    }
    .featured-picks-title,
    .featured-picks-all{
        grid-column:1/-1;
    }
    .product-carousel{
        grid-template-columns:38px minmax(0,1fr) 38px;
        gap:7px;
    }
    .carousel-arrow{
        width:38px;
        height:38px;
        font-size:26px;
    }
    .product-track{
        grid-auto-columns:calc((100% - 18px) / 2);
        gap:18px;
    }
}

@media(max-width:560px){
    .featured-picks{
        grid-template-columns:1fr;
    }
    .featured-pick{
        grid-template-columns:82px minmax(0,1fr);
    }
    .product-carousel{
        grid-template-columns:34px minmax(0,1fr) 34px;
        gap:5px;
    }
    .carousel-arrow{
        width:34px;
        height:34px;
        font-size:24px;
    }
    .product-track{
        grid-auto-columns:100%;
        gap:12px;
    }
}



/* Filtered carousel cards */
.product-card[hidden]{display:none !important;}


/* Touchscreen support: horizontal product swipes, vertical page scrolling */
.product-track { touch-action: pan-y; cursor: grab; }
.product-track:active { cursor: grabbing; }