/* CSPLUS v2.4.4 — Desktop All Pages Polish
   Scope: desktop/tablet only first, safe mobile guard included.
*/
:root{
  --cs-ink:#0b1220;
  --cs-muted:#64748b;
  --cs-line:#e2e8f0;
  --cs-soft:#f8fafc;
  --cs-card:#ffffff;
  --cs-blue:#2563eb;
  --cs-green:#16a34a;
  --cs-radius:28px;
  --cs-shadow:0 18px 54px rgba(15,23,42,.08);
}

/* Global desktop shell */
@media (min-width: 981px){
  body{
    background:
      radial-gradient(circle at 8% 0%,rgba(37,99,235,.08),transparent 28%),
      radial-gradient(circle at 92% 0%,rgba(22,163,74,.06),transparent 30%),
      #f7faff!important;
    color:var(--cs-ink)!important;
  }
  .site-header{
    min-height:76px!important;
    padding:14px max(48px,calc((100vw - 1180px)/2 + 22px))!important;
    background:rgba(255,255,255,.88)!important;
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    border-bottom:1px solid rgba(226,232,240,.9)!important;
    box-shadow:0 8px 28px rgba(15,23,42,.04)!important;
  }
  .brand-logo{
    width:48px!important;
    height:48px!important;
    border-radius:18px!important;
    box-shadow:0 12px 26px rgba(15,23,42,.12)!important;
  }
  .brand b{
    font-size:19px!important;
    letter-spacing:-.02em!important;
  }
  .brand small{
    font-size:13px!important;
  }
  .desktop-nav{
    gap:6px!important;
    align-items:center!important;
  }
  .desktop-nav a{
    padding:10px 12px!important;
    border-radius:999px!important;
    color:#334155!important;
    transition:.18s ease!important;
  }
  .desktop-nav a:hover{
    background:#f1f5f9!important;
    color:#0b1220!important;
  }
  .page-main{
    max-width:none!important;
    margin:0!important;
  }

  /* Shared public spacing */
  .home-wrap,
  .jualhp-wrap,
  .service-wrap,
  .section,
  .page-hero.small,
  .hero,
  .product-grid,
  .install-section{
    max-width:1180px!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
  .section,
  .page-hero.small,
  .hero{
    padding-left:22px!important;
    padding-right:22px!important;
  }

  /* Home desktop */
  .home-ads .home-wrap{
    width:min(1180px,calc(100% - 44px))!important;
  }
  .home-ads .hero-ads{
    padding-top:44px!important;
  }
  .home-ads .hero-grid{
    min-height:auto!important;
  }
  .home-ads .hero-title{
    max-width:950px!important;
  }
  .home-slider-intro{
    padding-top:8px!important;
  }
  .home-slider-intro .home-wrap{
    width:min(1180px,calc(100% - 44px))!important;
  }
  .home-click-slider .home-wrap{
    width:min(1180px,calc(100% - 44px))!important;
  }
  .home-slider-track{
    overflow-x:hidden!important;
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:16px!important;
    padding:6px 0 10px!important;
  }
  .home-slide-card{
    min-width:0!important;
    width:100%!important;
    min-height:230px!important;
    border-radius:30px!important;
  }
  .home-slider-dots{
    display:none!important;
  }
  .benefit-strip{
    margin-top:12px!important;
  }
  .benefit-grid{
    width:min(1180px,calc(100% - 44px))!important;
    margin:0 auto!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:14px!important;
  }
  .home-service-focus .home-wrap{
    width:min(1180px,calc(100% - 44px))!important;
  }

  /* Product listing / Beli HP */
  .product-grid{
    width:min(1180px,calc(100% - 44px))!important;
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:20px!important;
    padding:0!important;
  }
  .product-card{
    border-radius:28px!important;
    overflow:hidden!important;
    padding:0!important;
    transition:transform .18s ease, box-shadow .18s ease!important;
  }
  .product-card:hover{
    transform:translateY(-4px)!important;
    box-shadow:0 24px 70px rgba(15,23,42,.12)!important;
  }
  .product-thumb,
  .product-image{
    min-height:220px!important;
    border-radius:0!important;
  }

  /* Product detail */
  .product-detail,
  .detail-wrap,
  .detail-grid,
  .product-detail-wrap{
    max-width:1180px!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
  .detail-grid,
  .product-detail-grid{
    display:grid!important;
    grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr)!important;
    gap:26px!important;
    align-items:start!important;
  }
  .detail-main-photo,
  .product-main-photo{
    border-radius:32px!important;
    max-height:620px!important;
    background:#f8fafc!important;
  }
  .detail-main-photo img,
  .product-main-photo img{
    max-height:620px!important;
    object-fit:contain!important;
  }

  /* Jual HP desktop */
  .jualhp-page .jualhp-wrap{
    width:min(1180px,calc(100% - 44px))!important;
  }
  .jualhp-hero{
    padding-top:44px!important;
  }
  .jualhp-hero-grid{
    grid-template-columns:minmax(0,1.05fr) minmax(420px,.95fr)!important;
    gap:30px!important;
  }
  .jualhp-form-card{
    top:96px!important;
    border-radius:34px!important;
  }
  .jualhp-form{
    gap:14px!important;
  }
  .value-grid,
  .flow-grid{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:16px!important;
  }
  .safe-box{
    grid-template-columns:1fr 1fr!important;
    gap:18px!important;
  }
  .faq-list{
    max-width:940px!important;
  }

  /* Service desktop */
  .service-page .service-wrap{
    width:min(1180px,calc(100% - 44px))!important;
  }
  .service-hero{
    padding-top:44px!important;
  }
  .service-hero-grid{
    grid-template-columns:minmax(0,1.05fr) minmax(420px,.95fr)!important;
    gap:30px!important;
  }
  .key-grid,
  .main-device-grid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:16px!important;
  }
  .issue-grid,
  .flow-grid{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:16px!important;
  }
  .service-form-card{
    max-width:980px!important;
    margin:0 auto!important;
    border-radius:34px!important;
  }
  .service-form{
    gap:14px!important;
  }

  /* Tracking / simple pages */
  .page-hero.small{
    max-width:1180px!important;
    margin:0 auto!important;
  }
  .panel,
  .stat-card,
  .install-card{
    border-radius:28px!important;
    box-shadow:var(--cs-shadow)!important;
  }
  .form-grid{
    gap:14px!important;
  }
  input,select,textarea{
    min-height:48px!important;
    border-radius:16px!important;
  }

  /* Admin desktop polish */
  .admin-wrap,
  .admin-page,
  .dashboard-wrap,
  .health-wrap,
  .panel-wrap{
    max-width:1180px!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
  body:has(.admin-card),
  body:has(.health-card){
    background:#f7faff!important;
  }
  table{
    border-collapse:separate!important;
    border-spacing:0!important;
  }
  th,td{
    vertical-align:middle!important;
  }

  /* Floating buttons on desktop */
  .live-chat-button{
    right:28px!important;
    bottom:104px!important;
    padding:13px 17px!important;
    border-radius:999px!important;
    box-shadow:0 16px 34px rgba(15,23,42,.18)!important;
  }
}

/* Tablet safety */
@media (min-width:861px) and (max-width:980px){
  .desktop-nav{
    gap:6px!important;
  }
  .desktop-nav a{
    padding:9px 8px!important;
    font-size:13px!important;
  }
  .home-slider-track{
    display:flex!important;
    overflow-x:auto!important;
  }
}

/* Mobile guard: keep current mobile flow safe */
@media (max-width:860px){
  .site-header{
    min-height:72px!important;
  }
  .desktop-nav{
    display:none!important;
  }
}