/* =========================================================
   REFURB HUB — responsive rules
   1400+ large desktop | 1200-1399 desktop | 992-1199 laptop / tablet landscape
   768-991 tablet portrait | 576-767 large phone / phone landscape | <=575 phone
========================================================= */

/* ---------- Large screens (1600+) ---------- */
@media (min-width:1600px){
    :root{--container:1320px}
    .rh-hero-inner{width:min(1400px,calc(100% - var(--gutter)*2))}
}

/* ---------- Desktop (<=1399) ---------- */
@media (max-width:1399px){
    .main-nav a{padding:0 13px}
    .rh-chip-top{left:-16px}
}

/* ---------- Laptop / tablet landscape (<=1199) ---------- */
@media (max-width:1199px){
    :root{--section:85px}
    .site-logo img{width:185px}
    .main-nav a{padding:0 11px;font-size:14.5px}
    .rh-hero-inner{gap:40px}
    .rh-product-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
    .rh-why-grid{grid-template-columns:repeat(2,1fr)}
    .rh-why-split{grid-template-columns:1fr;gap:40px}
    .rh-showcase-grid{gap:50px}
    .rh-split-grid,.rh-outlet-grid{gap:50px}
    .rh-footer-grid{grid-template-columns:1.2fr 1fr 1fr;gap:40px}
    .rh-footer-brand{grid-column:1/-1;display:grid;grid-template-columns:auto 1fr;gap:10px 40px;align-items:start}
    .rh-footer-brand .rh-footer-logo{grid-row:span 2;margin-bottom:0}
    .rh-footer-brand p{margin-bottom:0}
    .rh-panel{padding:44px}
    .rh-faq-layout{grid-template-columns:260px 1fr;gap:34px}
    .rh-contact-cards{grid-template-columns:1fr 1fr}
    .rh-contact-cards .rh-contact-card:last-child{grid-column:1/-1}
}

/* ---------- Tablet (<=991): hamburger menu + single-column layouts ---------- */
@media (max-width:991px){
    :root{--section:75px;--header-h:68px}

    /* header */
    .menu-toggle{display:flex}
    .main-nav{position:absolute;left:calc(var(--gutter)*-1);right:calc(var(--gutter)*-1);top:100%;display:flex;flex-direction:column;align-items:stretch;gap:4px;padding:12px var(--gutter) 18px;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 18px 30px rgba(12,54,25,.1);max-height:calc(100vh - var(--header-h));max-height:calc(100dvh - var(--header-h));overflow-y:auto;opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .2s ease,transform .2s ease,visibility .2s ease}
    .main-nav.is-open{opacity:1;visibility:visible;transform:none}
    .main-nav a{justify-content:space-between;min-height:48px;padding:0 16px;border-radius:12px;font-size:16px}
    .main-nav a.active{background:var(--soft);color:var(--primary)}

    /* hero */
    .rh-hero-inner{grid-template-columns:1fr;gap:50px;padding:56px 0 120px}
    .rh-hero-copy{max-width:680px}
    .rh-hero-visual{width:100%;max-width:620px;margin-inline:auto}
    .rh-chip-top{left:-10px}

    /* stats */
    .rh-stats-box{grid-template-columns:repeat(2,1fr);padding:10px}
    .rh-stat:nth-child(2){border-right:0}
    .rh-stat:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.12)}

    /* grids */
    .rh-heading-split{grid-template-columns:1fr;gap:16px}
    .rh-rating{justify-self:start;text-align:left}
    .rh-service-grid,.rh-testimonial-grid,.rh-objective-grid{grid-template-columns:repeat(2,1fr)}
    .rh-objective-grid .rh-objective:last-child{grid-column:1/-1}
    .rh-objective-grid .rh-objective:last-child .rh-objective-img{aspect-ratio:21/9}
    .rh-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .rh-promo-grid{grid-template-columns:1fr 1fr}
    .rh-promo-wide{grid-column:1/-1}
    .rh-split-grid,.rh-outlet-grid,.rh-showcase-grid,.rh-contact-grid{grid-template-columns:minmax(0,1fr);gap:40px}
    .rh-outlet-media,.rh-media-card{max-width:640px;width:100%;margin-inline:auto}
    .rh-reverse .rh-showcase-media{order:0}
    .rh-showcase-media{max-width:640px;width:100%}
    .rh-showcase-num,.rh-reverse .rh-showcase-num{left:auto;right:12px;top:12px;width:56px;height:56px;font-size:18px}
    .rh-steps{padding-left:0;border-left:0;border-top:1px solid var(--line)}

    /* services page: horizontal scrolling tabs */
    .rh-service-tabs-inner{display:flex;overflow-x:auto;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:none}
    .rh-service-tabs-inner::-webkit-scrollbar{display:none}
    .rh-service-tabs a{flex:0 0 auto;min-width:150px;scroll-snap-align:start}

    /* faq */
    .rh-faq-layout{grid-template-columns:minmax(0,1fr);gap:30px}
    .rh-faq-layout>*{min-width:0}
    .rh-faq-sidebar{position:static;padding:18px}
    .rh-faq-sidebar-title{display:none}
    .rh-faq-tabs{flex-direction:row;flex-wrap:wrap;gap:8px}
    .rh-faq-tab{flex:1 1 auto;justify-content:center;min-height:44px;border:1px solid var(--line)}
    .rh-faq-tab .bi{display:none}
    .rh-faq-help{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:6px 18px}
    .rh-faq-help .rh-icon-box{grid-row:span 2}
    .rh-faq-help h3{margin:0}
    .rh-faq-help p{margin:0;grid-column:2}
    .rh-faq-help .rh-btn{grid-column:3;grid-row:1/span 2;width:auto}
    .rh-faq-help .rh-link{display:none}

    /* footer */
    .rh-prefooter-inner{flex-direction:column;align-items:flex-start;gap:26px;padding:38px 34px}
    .rh-footer-grid{grid-template-columns:1fr 1fr}
    .rh-footer-brand{display:block}
    .rh-footer-brand .rh-footer-logo{margin-bottom:20px}
    .rh-footer-brand p{margin-bottom:22px}
}

/* ---------- Large phones / phone landscape (<=767) ---------- */
@media (max-width:767px){
    :root{--section:64px}
    .rh-topbar-inner{justify-content:center}
    .rh-hide-md{display:none}
    .rh-heading{margin-bottom:36px}
    .rh-service-grid,.rh-testimonial-grid,.rh-objective-grid,.rh-promo-grid,.rh-contact-cards,.rh-why-grid,.rh-why-grid-2{grid-template-columns:1fr}
    .rh-objective-grid .rh-objective:last-child .rh-objective-img{aspect-ratio:16/10}
    .rh-contact-cards .rh-contact-card:last-child{grid-column:auto}
    .rh-promo{min-height:250px}
    .rh-page-hero{padding:56px 0 48px}
    .rh-panel{padding:30px 24px}
    .rh-filter-bar{flex-direction:column;flex-wrap:nowrap;align-items:stretch}
    .rh-filter-bar>*{min-width:0}
    .rh-filter-chips{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}
    .rh-filter-chips::-webkit-scrollbar{display:none}
    .rh-chip{flex:0 0 auto}
    .rh-sort{justify-content:space-between}
    .rh-sort select{flex:1;min-width:0}
    .rh-card-form{padding:24px}
    .rh-map{height:340px}
    .rh-faq-help{grid-template-columns:auto 1fr}
    .rh-faq-help .rh-btn{grid-column:1/-1;grid-row:auto;margin-top:12px;width:100%}
    .rh-faq-question{padding:18px;font-size:16px}
    .rh-faq-answer{padding:0 18px 18px}
    .rh-faq-answer p{font-size:15px}
    .rh-footer-grid{grid-template-columns:1fr 1fr;gap:36px 24px}
    .rh-footer-brand,.rh-footer-contact{grid-column:1/-1}
    .rh-footer-bottom{flex-direction:column;align-items:center;text-align:center}
}

/* ---------- Phones (<=575) ---------- */
@media (max-width:575px){
    :root{--gutter:16px;--section:56px}
    body{font-size:15px}
    .site-logo img{width:160px}
    .rh-topbar{font-size:12px}
    .rh-topbar-inner{gap:14px}
    .rh-topbar-info{gap:6px 14px}

    .rh-hero-inner{padding:40px 0 104px;gap:36px}
    .rh-hero-copy>p{font-size:15.5px;margin:16px 0 24px}
    .rh-hero-actions .rh-btn{flex:1 1 auto}
    .rh-hero-points{gap:8px;margin-top:24px}
    .rh-hero-points li{min-height:36px;padding:0 12px;font-size:13px}
    .rh-hero-blob{right:-30px}
    .rh-hero-chip{padding:9px 12px;gap:9px}
    .rh-hero-chip .bi{flex-basis:32px;width:32px;height:32px;font-size:16px}
    .rh-hero-chip strong{font-size:12.5px}
    .rh-hero-chip span{font-size:11px}
    .rh-chip-top{left:-4px;top:4px}
    .rh-chip-bottom{left:6px;bottom:-14px}
    .rh-hero-price{right:-4px;bottom:26px;padding:10px 14px}
    .rh-hero-price strong{font-size:20px}

    .rh-stats{margin-top:-64px}
    .rh-stat{min-height:94px;padding:10px 6px}
    .rh-stat strong{font-size:30px}
    .rh-stat p{font-size:13px}

    .rh-product-grid{gap:14px}
    .rh-product-media{padding:12px}
    .rh-product-body{padding:14px}
    .rh-product-body h3{font-size:13.5px}
    .rh-product-foot{flex-direction:column;align-items:stretch;gap:12px}
    .rh-product-foot strong{font-size:18px}
    .rh-product-enquire{width:100%}

    .rh-outlet-media{padding:0 0 18px 18px}
    .rh-outlet-media:before{right:18px;top:18px}
    .rh-outlet-badge{padding:12px 14px}
    .rh-outlet-badge strong{font-size:24px}
    .rh-outlet-actions .rh-btn{flex:1 1 auto}

    .rh-promo{padding:24px;min-height:230px}
    .rh-promo h3{font-size:21px}
    .rh-testimonial{padding:22px}
    .rh-check-grid{grid-template-columns:1fr}
    .rh-media-label{left:12px;right:12px;bottom:12px;padding:12px 14px}
    .rh-media-mark{flex-basis:40px;width:40px;height:40px;font-size:14px}
    .rh-media-label small{font-size:13px}

    .rh-showcase{padding-block:56px}
    .rh-showcase-copy .rh-btn,.rh-split-copy .rh-btn{width:100%}
    .rh-tags li{font-size:13px;padding:6px 12px}

    .rh-contact-card{padding:20px}
    .rh-field-row{grid-template-columns:1fr;gap:0}
    .rh-submit{width:100%}
    .rh-card-form{padding:20px}
    .rh-map{height:300px}

    .rh-prefooter{padding-top:56px}
    .rh-prefooter-inner{padding:30px 22px;border-radius:20px}
    .rh-prefooter-actions{width:100%}
    .rh-prefooter-actions .rh-btn{flex:1 1 auto}
    .rh-footer{padding-top:56px}
    .rh-footer-grid{grid-template-columns:1fr 1fr;gap:32px 18px}
    .rh-footer-col h3{margin-bottom:18px}

    .rh-whatsapp-float,.rh-back-to-top{width:48px;height:48px;bottom:calc(14px + env(safe-area-inset-bottom))}
    .rh-whatsapp-float{left:14px;font-size:24px}
    .rh-back-to-top{right:14px;font-size:18px}

    /* modal becomes a bottom sheet */
    .rh-modal{align-items:flex-end;padding:0}
    .rh-modal-box{width:100%;max-height:92vh;max-height:92dvh;padding:26px 18px calc(22px + env(safe-area-inset-bottom));border-radius:22px 22px 0 0;transform:translateY(40px)}
    .rh-modal-head h3{font-size:20px}
    .rh-toast{top:12px;font-size:14px}
}

/* ---------- Narrow phones (<=480): compact 2-up product cards ---------- */
@media (max-width:480px){
    .rh-product-grid{gap:10px}
    .rh-product-media{padding:8px}
    .rh-product-badge{left:8px;top:8px;padding:4px 8px;font-size:10px}
    .rh-product-body{padding:12px}
    .rh-product-brand{font-size:11px}
    .rh-product-body h3{margin:4px 0 10px;font-size:13px;-webkit-line-clamp:2;line-clamp:2}
    .rh-product-tags{display:none}
    .rh-product-foot{padding-top:10px}
    .rh-product-enquire{min-height:36px;padding:0 10px;font-size:12px}
}

/* ---------- Small phones (<=380) ---------- */
@media (max-width:380px){
    .site-logo img{width:140px}
    .rh-topbar-item{font-size:11.5px}
    .rh-hero-copy h1{font-size:30px}
    .rh-hero-actions .rh-btn{width:100%}
    .rh-btn{padding:0 20px}
    .rh-stat strong{font-size:26px}
    .rh-hero-chip span{display:none}
}

/* ---------- Phones in landscape (short screens) ---------- */
@media (max-height:520px) and (orientation:landscape){
    :root{--header-h:60px}
    .rh-topbar{display:none}
    .rh-hero-inner{grid-template-columns:1.1fr .9fr;gap:30px;padding:36px 0 100px}
    .rh-hero-copy h1{font-size:clamp(26px,4vw,36px)}
    .rh-hero-copy>p{margin:12px 0 18px}
    .rh-hero-points{display:none}
    .rh-hero-visual{max-width:none}
    .rh-page-hero{padding:40px 0 34px}
    .rh-service-tabs{position:static}
    .rh-modal{align-items:flex-start;padding:10px}
    .rh-modal-box{max-height:calc(100vh - 20px);max-height:calc(100dvh - 20px);padding:22px;border-radius:18px;transform:translateY(16px)}
    .rh-modal-product{margin-bottom:14px}
    .rh-field-row{grid-template-columns:1fr 1fr;gap:12px}
    .rh-field textarea{min-height:80px}
}
