/* ServiceGate v2: bigger header, black nav bar with icons, black footer, services icon grid.
   Loads after theme-servicegate.css. Colours: orange #ff6a00 / black #0d0d0d on white. */
:root{--sg-ink:#0d0d0d;--sg-orange:#ff6a00;--sg-orange-d:#e05a00;--sg-soft:#fff6ee}
.sg-ic{width:20px;height:20px;flex:none;display:inline-block;vertical-align:-4px}

/* ---------- top bar ---------- */
.header-top-section{background:#000!important}
.header-top-area,.header-number-location .number,.header-number-location .location{font-size:13px!important;color:#e9e9ee}
.header-top-area{padding:9px 0!important}

/* ---------- header (larger) ---------- */
.header-section.olx-header{background:#fff!important;border-bottom:4px solid var(--sg-orange)!important;box-shadow:0 8px 26px rgba(13,13,13,.1)}
.header-section.olx-header .header-logo img{height:64px!important;max-width:240px;object-fit:contain}
.header-section.olx-header .header-buttons{gap:16px}
.header-section.olx-header a.login{font-size:16px!important;font-weight:700;color:var(--sg-ink)!important;text-decoration:none}
.header-section.olx-header a.login:hover{color:var(--sg-orange)!important}
.header-section.olx-header .site-signup-btn{background:var(--sg-orange)!important;color:#fff!important;border:2px solid var(--sg-orange);border-radius:50px;padding:12px 30px;font-size:16px;font-weight:700}
.header-section.olx-header .site-signup-btn:hover{background:var(--sg-ink)!important;border-color:var(--sg-ink)}
.header-section.olx-header .become-seller-link{background:var(--sg-ink)!important;border:2px solid var(--sg-ink)!important;color:#fff!important;border-radius:50px;padding:11px 24px;font-size:16px;font-weight:700}
.header-section.olx-header .become-seller-link::before{color:var(--sg-orange)}
.header-section.olx-header .become-seller-link:hover{background:var(--sg-orange)!important;border-color:var(--sg-orange)!important}
.header-section.olx-header .user-dropdown-toggle img{width:46px;height:46px;border:3px solid var(--sg-orange)}
.header-section.olx-header .mobile-menu-btn{background:var(--sg-orange);border:0;border-radius:10px;width:46px;height:46px;display:grid;place-items:center}
.header-section.olx-header .mobile-menu-btn path{fill:#fff}

/* ---------- navigation ---------- */
.header-section.olx-header .header-nav-list>li>a.first-a{display:inline-flex!important;align-items:center;gap:9px;font-size:16px!important;font-weight:600!important;color:var(--sg-ink)!important;padding:12px 0!important;border-bottom:3px solid transparent!important}
.header-section.olx-header .header-nav-list>li>a.first-a .sg-ic{color:var(--sg-orange)}
.header-section.olx-header .header-nav-list>li>a.first-a:hover,
.header-section.olx-header .header-nav-list>li>a.first-a.active{color:var(--sg-orange)!important;border-bottom-color:var(--sg-orange)!important}

@media(min-width:1200px){
  .header-section.olx-header .main-header-area{grid-template-columns:auto 1fr auto!important;grid-template-areas:"logo . buttons" "nav nav nav"!important;row-gap:0!important;padding:16px 0 0!important}
  .header-section.olx-header .header-logo,.header-section.olx-header .header-buttons{padding-bottom:16px}
  /* full-width black nav bar */
  .header-section.olx-header #offcanvasMenu{background:var(--sg-ink)!important;box-shadow:0 0 0 100vmax var(--sg-ink);clip-path:inset(0 -100vmax);padding:0 6px}
  .header-section.olx-header .header-nav-list{overflow:visible!important;gap:4px 40px!important}
  .header-section.olx-header .header-nav-list>li>a.first-a{color:#fff!important;padding:17px 0!important;font-size:16px!important}
  .header-section.olx-header .header-nav-list>li>a.first-a:hover,
  .header-section.olx-header .header-nav-list>li>a.first-a.active{color:var(--sg-orange)!important}
  .header-section.olx-header .have-sub-menu svg path{fill:#fff}
  .header-section.olx-header .first-sub-menu{border-top:3px solid var(--sg-orange);border-radius:0 0 12px 12px}
}
@media(max-width:1199.98px){
  .header-section.olx-header .header-logo img{height:46px!important}
  .header-section.olx-header .header-nav-list>li>a.first-a{font-size:16px!important}
}

/* ---------- popular services: icon grid ---------- */
.sg-services{padding:60px 0 20px;background:#fff}
.sg-sec-head{text-align:center;margin-bottom:34px}
.sg-eyebrow{display:inline-block;font-size:12px;font-weight:700;letter-spacing:2.5px;text-transform:uppercase;color:var(--sg-orange)}
.sg-sec-head h2{font-size:clamp(26px,3.4vw,38px);font-weight:800;margin:8px 0 8px;color:var(--sg-ink)}
.sg-sec-head h2::after{content:"";display:block;width:76px;height:6px;margin:14px auto 0;background:var(--sg-orange);transform:skewX(-30deg)}
.sg-sec-head p{color:#666;margin:0 auto;max-width:520px}
.sg-svc-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:18px}
.sg-svc{display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px;padding:26px 14px 22px;background:#fff;border:1px solid #eee;border-bottom:4px solid var(--sg-orange);border-radius:6px;box-shadow:0 8px 22px rgba(13,13,13,.06);color:var(--sg-ink);transition:transform .2s,background .2s,box-shadow .2s}
.sg-svc b{font-size:14px;font-weight:700;line-height:1.3}
.sg-svc-ic{display:grid;place-items:center;width:68px;height:68px;background:var(--sg-ink);color:var(--sg-orange);clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);transition:background .2s,color .2s}
.sg-svc-ic .sg-ic{width:30px;height:30px}
.sg-svc:hover{transform:translateY(-6px);background:var(--sg-ink);color:#fff!important;box-shadow:0 18px 34px rgba(13,13,13,.25)}
.sg-svc:hover .sg-svc-ic{background:var(--sg-orange);color:#fff}
.sg-svc-all{background:var(--sg-soft)}
@media(max-width:1100px){.sg-svc-grid{grid-template-columns:repeat(4,1fr)}}
@media(max-width:700px){.sg-svc-grid{grid-template-columns:repeat(2,1fr);gap:12px}.sg-svc{padding:20px 10px}.sg-services{padding-top:44px}}
@media(prefers-reduced-motion:reduce){.sg-svc,.sg-svc-ic{transition:none}.sg-svc:hover{transform:none}}
