/* GadgetMobi Mobile & Tablets — same design system as Home / Products / Deals / Contact */
:root{--dark:#292929;--dark2:#464646;--orange:#dc7123;--orange-light:#ffb267;--cream:#f4f1ea;--white:#fff;--text:#2d2d2d;--muted:#777;--border:#e6e1da;--green:#18c96a}
*{margin:0;padding:0;box-sizing:border-box;font-family:"Poppins",sans-serif}
html{scroll-behavior:smooth}body{background:var(--cream);color:var(--text);overflow-x:hidden}a{color:inherit}.container{width:min(1165px,92%);margin:auto}

/* announcement + header */
.announcement-bar{height:38px;background:var(--dark);color:#fff}.announcement-content{width:min(1165px,92%);height:100%;margin:auto;display:flex;align-items:center;justify-content:center;gap:55px;font-size:13px;font-weight:500}.announcement-content span{white-space:nowrap}
.site-header{height:88px;background:#fff;position:sticky;top:0;z-index:1000;box-shadow:0 2px 12px rgba(0,0,0,.07)}
.navbar{height:100%;display:flex;align-items:center;justify-content:space-between;gap:25px}
.logo{display:flex;align-items:center;gap:8px;text-decoration:none;flex-shrink:0}.logo img{width:43px;height:43px;object-fit:contain}.logo-text{display:flex;flex-direction:column;line-height:1}.logo-text strong{color:#444;font-size:27px;font-weight:700;letter-spacing:-.8px}.logo-text strong span{color:var(--orange)}.logo-text small{color:#999;font-size:9px;font-weight:400;margin-top:5px}
.nav-links{display:flex;align-items:center;gap:4px}.nav-links a{position:relative;color:#444;text-decoration:none;padding:12px 14px;font-size:16px;font-weight:600;transition:.25s}.nav-links a:hover,.nav-links a.active{color:var(--orange)}.nav-links a.active:after{content:"";position:absolute;left:14px;right:14px;bottom:2px;height:3px;background:var(--orange);border-radius:10px}
.header-right{display:flex;align-items:center;gap:10px}.header-action{width:46px;height:46px;border:0;border-radius:50%;display:flex;align-items:center;justify-content:center;text-decoration:none;color:#fff;font-size:17px;cursor:pointer;transition:.25s}.header-action:hover{transform:translateY(-3px)}.call-btn{background:#464646}.whatsapp-btn{background:var(--green)}.cart-btn{background:var(--orange);position:relative}.login-btn{background:#f0ede8;color:#444}.cart-btn span{position:absolute;top:-5px;right:-3px;width:19px;height:19px;border-radius:50%;background:#292929;color:#fff;font-size:10px;display:flex;align-items:center;justify-content:center}

/* hero */
.hero{min-height:545px;position:relative;overflow:hidden;display:flex;align-items:center;padding:68px 0;color:#fff;background:radial-gradient(circle at 88% 20%,rgba(255,255,255,.13),transparent 28%),linear-gradient(112deg,#3d3d3d 0%,#505050 42%,#a36f4f 72%,#dc7123 100%)}
.hero:before{content:"";position:absolute;width:480px;height:480px;right:-220px;bottom:-270px;border:1px solid rgba(255,255,255,.15);border-radius:50%}.hero:after{content:"";position:absolute;width:330px;height:330px;right:-90px;bottom:-210px;border:1px solid rgba(255,255,255,.08);border-radius:50%}
.circle{position:absolute;border:1px solid rgba(255,255,255,.08);border-radius:50%;pointer-events:none}.circle.one{width:240px;height:240px;left:-160px;top:-110px}.circle.two{width:110px;height:110px;right:17%;top:45px}
.hero-content{position:relative;z-index:2;display:grid;grid-template-columns:1.15fr .85fr;align-items:center;gap:50px}.hero-badge{display:inline-flex;align-items:center;gap:7px;padding:9px 17px;margin-bottom:23px;border:1px solid rgba(255,255,255,.3);border-radius:25px;background:rgba(255,255,255,.08);font-size:13px;font-weight:600}.hero-badge i{color:var(--orange-light)}
.hero h1{max-width:700px;color:#fff;font-size:57px;line-height:1.08;font-weight:700;letter-spacing:-1.5px}.hero h1 span{color:var(--orange-light)}.hero p{max-width:650px;margin:24px 0 30px;color:#f4f4f4;font-size:16px;line-height:1.8}
.hero-buttons{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.hero-buttons a{min-width:145px;padding:15px 24px;border-radius:13px;text-align:center;font-size:15px;font-weight:700;text-decoration:none;transition:.3s}.btn-primary{color:var(--orange);background:#fff;border:1px solid #fff}.btn-primary:hover{color:#fff;background:var(--orange);transform:translateY(-3px)}.btn-secondary{color:#fff;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.45)}.btn-secondary:hover{color:var(--orange);background:#fff;transform:translateY(-3px)}
.hero-features{display:flex;align-items:center;flex-wrap:wrap;gap:30px;margin-top:31px}.hero-features div{display:flex;align-items:center;gap:8px;color:#fff;font-size:13px}
.hero-right{display:flex;align-items:center;justify-content:center}.mobile-tablet-box{width:300px;height:300px;border-radius:40px;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;gap:18px;box-shadow:0 20px 45px rgba(0,0,0,.1);backdrop-filter:blur(3px)}.mobile-icon{color:#fff;font-size:105px;filter:drop-shadow(0 8px 15px rgba(0,0,0,.15))}.tablet-icon{color:var(--orange-light);font-size:88px;filter:drop-shadow(0 8px 15px rgba(0,0,0,.15))}
/* =========================================
   SEARCH SECTION
========================================= */

.search-section{
    padding:38px 0 10px;
    background:var(--cream);
}

.search-box{
    position:relative;
    width:100%;
}

.search-box i{
    position:absolute;
    left:20px;
    top:50%;
    transform:translateY(-50%);
    color:#dc7123;
    font-size:17px;
    z-index:2;
}

.search-box input{
    width:100%;
    height:54px;

    padding:0 20px 0 50px;

    border:1px solid #e0dcd5;
    border-radius:15px;

    outline:none;
    background:#fff;

    font-family:'Poppins',sans-serif;
    font-size:14px;
    color:#2d2d2d;

    box-shadow:0 5px 20px rgba(0,0,0,.05);

    transition:.3s ease;
}

.search-box input::placeholder{
    color:#888;
}

.search-box input:focus{
    border-color:#dc7123;

    box-shadow:
        0 0 0 4px rgba(220,113,35,.10);
}


/* =========================================
   CATEGORIES SECTION
========================================= */

.categories-section{
    padding:25px 0 80px;
    background:var(--cream);
}

.section-title{
    text-align:center;
    margin-bottom:30px;
}

.section-title span{
    display:inline-block;

    color:#dc7123;

    font-size:13px;
    font-weight:700;

    margin-bottom:7px;
}

.section-title h2{
    margin:0 0 8px;

    color:#303030;

    font-size:34px;
    line-height:1.2;
    font-weight:700;
}

.section-title p{
    margin:0;

    color:#777;

    font-size:14px;
}


/* =========================================
   CARDS GRID
========================================= */

.cards-container{
    max-width:1160px;
    margin:0 auto;

    display:grid;
    grid-template-columns:repeat(4,1fr);

    gap:22px;

    padding:0;
}

.card-link{
    display:flex;

    width:100%;

    text-decoration:none;
    color:inherit;
}


/* =========================================
   CATEGORY CARD
========================================= */

.category-card{
    position:relative;

    width:100%;
    height:390px;
    min-height:390px;

    padding:25px;

    display:flex;
    flex-direction:column;

    overflow:hidden;

    border:1px solid #e2ddd5;
    border-radius:20px;

    background:#fff;

    box-shadow:
        0 10px 30px rgba(0,0,0,.07);

    transition:
        transform .35s ease,
        box-shadow .35s ease,
        background .35s ease,
        color .35s ease,
        border-color .35s ease;
}


/* =========================================
   ORANGE TOP LINE
========================================= */

.category-card::before{
    content:"";

    position:absolute;

    top:0;
    left:0;

    width:100%;
    height:4px;

    background:#dc7123;

    transform:scaleX(0);
    transform-origin:left;

    transition:.35s ease;
}

.category-card:hover::before{
    transform:scaleX(1);
}


/* =========================================
   CARD HOVER
========================================= */

.category-card:hover{
    transform:translateY(-8px);

    background:linear-gradient(
        135deg,
        #1f1f1f,
        #464646
    );

    border-color:transparent;

    box-shadow:
        0 20px 40px rgba(220,113,35,.25);
}


/* =========================================
   ICON
========================================= */

.card-icon{
    width:70px;
    height:70px;

    flex-shrink:0;

    margin-bottom:17px;

    border-radius:19px;

    display:flex;
    align-items:center;
    justify-content:center;

    color:#fff;

    background:linear-gradient(
        135deg,
        #464646,
        #dc7123
    );

    font-size:29px;

    transition:.35s ease;
}

.category-card:hover .card-icon{
    background:linear-gradient(
        135deg,
        #dc7123,
        #ff8c2a
    );

    transform:
        translateY(-4px)
        scale(1.06);
}


/* =========================================
   CARD TITLE
========================================= */

.category-card h3{
    margin:0 0 7px;

    color:#333;

    font-size:19px;
    line-height:1.3;
    font-weight:700;
}

.category-card:hover h3{
    color:#fff;
}


/* =========================================
   DESCRIPTION
========================================= */

.category-card > p{
    margin:0 0 13px;

    color:#888;

    font-size:12px;
    line-height:1.6;
}

.category-card:hover > p{
    color:#fff;
}


/* =========================================
   ITEM LIST
========================================= */

.category-card ul{
    list-style:none;

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:7px 12px;

    margin:0;
    padding:0;

    flex:1;
}

.category-card li{
    color:#777;

    font-size:12px;
    line-height:1.45;
}

.category-card li::before{
    content:"•";

    color:#dc7123;

    margin-right:6px;
}

.category-card:hover li{
    color:#fff;
}


/* =========================================
   EXPLORE BUTTON
========================================= */

.category-card b{
    position:static;

    display:block;

    margin-top:auto;
    padding-top:18px;

    color:#dc7123;

    font-size:12px;
    font-weight:700;

    flex-shrink:0;
}

.category-card b i{
    margin-left:2px;
}

.category-card:hover b{
    color:#ff8c2a;
}


/* =========================================
   NO RESULTS
========================================= */

.no-results{
    display:none;

    text-align:center;

    padding:50px 20px;

    color:#777;
}

.no-results.show{
    display:block;
}

.no-results i{
    display:block;

    margin-bottom:12px;

    color:#dc7123;

    font-size:35px;
}


/* =========================================
   TABLET
========================================= */

@media (max-width:1000px){

    .cards-container{
        grid-template-columns:repeat(2,1fr);

        padding:0 20px;
    }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width:600px){

    .search-section{
        padding:20px 15px 5px;
    }

    .categories-section{
        padding:25px 15px 60px;
    }

    .section-title{
        margin-bottom:25px;
    }

    .section-title h2{
        font-size:28px;
    }

    .section-title p{
        font-size:13px;
    }

    .cards-container{
        grid-template-columns:1fr;

        gap:18px;

        padding:0;
    }

    .category-card{
        height:auto;
        min-height:370px;
    }

}
/* footer */
.footer{background:#292929;color:#fff;padding:55px 0 25px}.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.15fr;gap:40px}.footer h2{color:#fff;font-size:27px;margin-bottom:18px}.footer h2 span{color:var(--orange)}.footer h3{color:#fff;font-size:18px;margin-bottom:17px}.footer p,.footer li,.footer a{color:#aaa;font-size:13px}.footer p{line-height:1.9}.footer ul{list-style:none}.footer li{margin:10px 0}.footer a{text-decoration:none;transition:.25s}.footer a:hover{color:var(--orange)}.footer-social{display:flex;gap:9px;margin-top:18px}.footer-social a{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#3a3a3a;color:#fff;font-size:16px}.footer-social a:hover{background:var(--orange);transform:translateY(-3px)}.contact-list i{width:20px;color:var(--orange);margin-right:5px}.footer-bottom{margin-top:30px;padding-top:20px;border-top:1px solid #444;display:flex;align-items:center;justify-content:space-between;gap:20px}.footer-links{display:flex;gap:22px}.footer-links a{position:relative}.footer-links a:after{content:"";position:absolute;left:0;bottom:-5px;width:0;height:2px;background:var(--orange);transition:.3s}.footer-links a:hover:after{width:100%}

/* responsive */
@media(max-width:1100px){.navbar{gap:10px}.nav-links a{padding:12px 9px;font-size:14px}.header-right{gap:6px}.header-action{width:42px;height:42px}.hero-content{grid-template-columns:1fr 330px;gap:30px}.hero h1{font-size:49px}.cards-container{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:768px){.announcement-bar{height:auto;min-height:34px}.announcement-content{width:96%;gap:12px;padding:7px 0;font-size:9px;justify-content:space-between}.site-header{height:auto}.navbar{min-height:72px;flex-wrap:wrap;padding:8px 0 10px;justify-content:center}.logo{width:100%;justify-content:center}.logo img{width:38px;height:38px}.logo-text strong{font-size:22px}.logo-text small{font-size:8px}.nav-links{width:100%;justify-content:flex-start;overflow-x:auto;scrollbar-width:none}.nav-links::-webkit-scrollbar{display:none}.nav-links a{flex-shrink:0;padding:8px 9px;font-size:12px}.nav-links a.active:after{left:9px;right:9px}.header-right{display:none}.hero{min-height:auto;padding:52px 0;text-align:center}.hero-content{grid-template-columns:1fr;gap:38px}.hero-badge{margin:0 auto 20px;font-size:11px}.hero h1{font-size:39px;letter-spacing:-.8px}.hero p{margin:20px auto 25px;font-size:14px;line-height:1.7}.hero-buttons{justify-content:center}.hero-buttons a{min-width:140px;padding:13px 18px}.hero-features{justify-content:center;gap:17px}.hero-right{order:2}.mobile-tablet-box{width:225px;height:225px;border-radius:30px}.mobile-icon{font-size:76px}.tablet-icon{font-size:62px}.search-section{padding:25px 0 5px}.categories-section{padding:35px 0 60px}.section-title h2{font-size:28px}.cards-container{gap:15px}.category-card{min-height:310px;padding:19px}.card-icon{width:58px;height:58px;font-size:24px}.category-card h3{font-size:16px}.category-card li{font-size:11px}.category-card b{left:19px;bottom:17px}.footer{padding:45px 0 22px}.footer-grid{grid-template-columns:1fr;text-align:center;gap:30px}.footer-social{justify-content:center}.footer-bottom{flex-direction:column;text-align:center}.footer-links{justify-content:center;flex-wrap:wrap;gap:15px}}
@media(max-width:480px){.announcement-content{gap:5px;font-size:7.5px}.logo-text strong{font-size:20px}.nav-links a{font-size:11px;padding:8px 7px}.hero{padding:43px 0}.hero h1{font-size:32px}.hero-buttons{flex-direction:column}.hero-buttons a{width:100%}.hero-features{display:grid;grid-template-columns:1fr;gap:10px}.hero-features div{justify-content:center}.mobile-tablet-box{width:195px;height:195px}.mobile-icon{font-size:64px}.tablet-icon{font-size:53px}.cards-container{grid-template-columns:1fr}.category-card{min-height:290px}.footer-links{flex-direction:column;gap:10px}}