
:root{
  --ink:#0B0C0E;          /* hitam utama */
  --ink-2:#141619;        /* hitam sekunder */
  --steel:#22262B;        /* abu baja */
  --amber:#FFB400;        /* kuning hazard */
  --amber-2:#FF7A1A;      /* oranye */
  --white:#FFFFFF;
  --mist:#F2F3F5;         /* abu terang */
  --text:#15181C;
  --muted:#6B7280;
  --line:rgba(255,255,255,.10);
  --line-d:rgba(0,0,0,.09);
  --wrap:1180px;
  --r:14px;
  --shadow:0 18px 44px rgba(0,0,0,.14);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:78px}
body{
  margin:0;background:var(--white);color:var(--text);
  font-family:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  font-size:16px;line-height:1.7;-webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{font-family:'Barlow Condensed','Inter',sans-serif;font-weight:700;line-height:1.05;margin:0;letter-spacing:.005em}
h2{font-size:clamp(2rem,4.4vw,3.1rem)}
h3{font-size:1.35rem}
p{margin:0 0 1rem}
.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 20px}
.sec{padding:84px 0;position:relative}
.sec--dark{background:var(--ink);color:#E9EAEC}
.sec--dark h2,.sec--dark h3{color:#fff}#formKonsul h3{color:var(--ink);}
.sec--white{background:var(--white)}
.sec--mist{background:var(--mist)}
.sec--deep{background:var(--ink-2);color:#E9EAEC}
.sec--deep h2,.sec--deep h3{color:#fff}
:focus-visible{outline:3px solid var(--amber);outline-offset:3px;border-radius:4px}

/* garis hazard sebagai motif identitas */
.hazard{height:7px;background:repeating-linear-gradient(135deg,var(--amber) 0 16px,#0B0C0E 16px 32px)}
.hazard--thin{height:4px}

.eyebrow{display:inline-flex;align-items:center;gap:9px;font-weight:700;font-size:.82rem;letter-spacing:.06em;color:var(--amber-2);margin-bottom:12px}
.sec--dark .eyebrow,.sec--deep .eyebrow{color:var(--amber)}
.eyebrow::before{content:"";width:26px;height:3px;background:var(--amber);border-radius:2px}
.lead{max-width:62ch}
.sec--dark .lead,.sec--deep .lead{color:#B9BDC4}
.muted{color:var(--muted)}
.sec--dark .muted{color:#9AA0A8}

/* ============ TOMBOL ============ */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;
  font-weight:700;font-size:.95rem;padding:14px 26px;border-radius:999px;border:0;cursor:pointer;
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease;font-family:inherit;line-height:1}
.btn i{font-size:1.05em}
.btn--wa{background:linear-gradient(135deg,var(--amber),var(--amber-2));color:#111;box-shadow:0 10px 26px rgba(255,140,20,.34)}
.btn--wa:hover{transform:translateY(-2px);box-shadow:0 14px 32px rgba(255,140,20,.44)}
.btn--green{background:#25D366;color:#06301A;box-shadow:0 10px 26px rgba(37,211,102,.3)}
.btn--green:hover{transform:translateY(-2px)}
.btn--ghost{background:transparent;color:#fff;border:2px solid rgba(255,255,255,.28)}
.btn--ghost:hover{border-color:var(--amber);color:var(--amber)}
.btn--dark{background:var(--ink);color:#fff}
.btn--dark:hover{transform:translateY(-2px)}
.btn--block{width:100%}

/* ============ HEADER ============ */
.hdr{position:sticky;top:0;z-index:90;background:rgba(11,12,14,.94);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line)}
.hdr__in{display:flex;align-items:center;gap:22px;height:74px}
.brand{display:flex;align-items:center;gap:11px;flex:0 0 auto}
.brand img{height:55px;width:auto}
@media (max-width:767px){.brand img{height:50px;}}
.brand__fb{display:none;flex-direction:column;line-height:1}
.brand__fb b{font-family:'Barlow Condensed',sans-serif;font-size:1.6rem;color:#fff;letter-spacing:.02em}
.brand__fb span{font-size:.64rem;letter-spacing:.24em;color:var(--amber);font-weight:700}
.nav{margin-left:auto;display:flex;align-items:center;gap:4px}
.nav a{padding:9px 13px;font-size:.9rem;font-weight:600;color:#D4D7DC;border-radius:8px;transition:color .16s,background .16s}
.nav a:hover{color:var(--amber);background:rgba(255,255,255,.05)}
.hdr .btn{padding:12px 20px;font-size:.88rem}
.burger{display:none;margin-left:auto;background:none;border:0;color:#fff;font-size:1.5rem;cursor:pointer;padding:6px 10px}

/* ============ HERO SLIDER ============ */
.hero{position:relative;overflow:hidden;
  background:
    radial-gradient(880px 520px at 76% 46%, rgba(255,140,26,.17), transparent 62%),
    linear-gradient(160deg,#171B20 0%,#0B0C0E 56%,#0B0C0E 100%)}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.055;
  background:repeating-linear-gradient(135deg,var(--amber) 0 2px,transparent 2px 24px)}
.slides{position:relative;min-height:560px}
.slide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .5s ease;display:flex;align-items:center}
.slide.on{opacity:1;visibility:visible}
.slide__in{position:relative;z-index:2;width:100%;max-width:var(--wrap);margin:0 auto;padding:86px 20px 128px;
  display:grid;grid-template-columns:1.02fr .98fr;gap:40px;align-items:center}
.slide__txt{min-width:0}
.slide__ph{position:relative;display:grid;place-items:center;min-height:330px}
.slide__ph::before{content:"";position:absolute;width:88%;aspect-ratio:1/1;border-radius:50%;
  background:radial-gradient(circle,rgba(255,180,0,.24),transparent 66%)}
.slide__ph img{position:relative;z-index:2;max-height:390px;width:auto;object-fit:contain;
  filter:drop-shadow(0 26px 32px rgba(0,0,0,.5))}
.slide.on .slide__ph img{animation:driveIn .7s cubic-bezier(.2,.8,.3,1) both}
@keyframes driveIn{from{opacity:0;transform:translateX(42px)}to{opacity:1;transform:none}}
.slide__cap{display:inline-flex;align-items:center;gap:10px;background:var(--amber);color:#111;
  font-weight:800;font-size:.8rem;letter-spacing:.08em;padding:7px 15px;border-radius:999px;margin-bottom:18px}
.slide h1{font-size:clamp(2.6rem,6.6vw,5rem);color:#fff;max-width:14ch;margin-bottom:16px}
.slide h1 em{font-style:normal;color:var(--amber);display:block}
.slide p{color:#C6CAD1;max-width:48ch;font-size:1.04rem}
.specs{display:flex;flex-wrap:wrap;gap:9px;margin:20px 0 28px;padding:0;list-style:none}
.specs li{display:flex;align-items:center;gap:8px;font-size:.84rem;font-weight:600;color:#E5E7EA;
  background:rgba(255,255,255,.07);border:1px solid var(--line);padding:8px 14px;border-radius:999px}
.specs i{color:var(--amber)}
.hero__acts{display:flex;flex-wrap:wrap;gap:12px}

.sl-nav{position:absolute;bottom:34px;right:calc(50% - var(--wrap)/2 + 20px);z-index:5;display:flex;gap:9px}
.sl-nav button{width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.3);
  background:rgba(0,0,0,.35);color:#fff;cursor:pointer;font-size:.95rem;transition:.2s;backdrop-filter:blur(4px)}
.sl-nav button:hover{background:var(--amber);color:#111;border-color:var(--amber)}
.dots{position:absolute;bottom:46px;left:calc(50% - var(--wrap)/2 + 20px);z-index:5;display:flex;gap:9px}
.dots button{width:30px;height:5px;border-radius:3px;border:0;background:rgba(255,255,255,.28);cursor:pointer;padding:0;transition:.25s}
.dots button.on{background:var(--amber);width:52px}

/* ============ TENTANG ============ */
.split{display:grid;grid-template-columns:1fr 1.06fr;gap:56px;align-items:center}
.figure{position:relative}
.figure img{border-radius:var(--r);box-shadow:var(--shadow);width:100%;object-fit:cover;aspect-ratio:4/3}
@media (min-width:901px){ .figure img{aspect-ratio:3/4;} }
.figure__tag{position:absolute;left:-14px;bottom:26px;background:var(--amber);color:#111;
  padding:14px 20px;border-radius:12px;font-family:'Barlow Condensed',sans-serif;font-weight:700;
  line-height:1;box-shadow:0 14px 30px rgba(0,0,0,.2)}
.figure__tag b{display:block;font-size:2.3rem}
.figure__tag span{font-size:.78rem;font-family:'Inter',sans-serif;font-weight:600;letter-spacing:.04em}
.kota-chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:22px 0}
.kota-chips li{font-size:.83rem;font-weight:600;padding:7px 13px;border-radius:8px;
  background:var(--mist);border:1px solid var(--line-d);display:flex;align-items:center;gap:7px}
.kota-chips i{color:var(--amber-2);font-size:.8em}
.notice{display:flex;gap:13px;padding:16px 18px;border-radius:12px;font-size:.9rem;line-height:1.6;
  background:#FFF7E6;border:1px solid #FFE0A3;color:#6B4A00}
.notice i{color:var(--amber-2);font-size:1.05rem;margin-top:3px;flex:0 0 auto}

/* ============ FORM ============ */
.form-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:56px;align-items:center}
.field{margin-bottom:14px}
.field label{display:block;font-size:.83rem;font-weight:600;margin-bottom:6px;color:inherit}
.field .req{color:var(--amber-2)}
.field input,.field select,.field textarea{
  width:100%;padding:13px 15px;border-radius:10px;border:1.5px solid #DADDE2;background:#fff;
  font-family:inherit;font-size:.95rem;color:var(--text);transition:border-color .16s,box-shadow .16s}
.field textarea{min-height:92px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:0;border-color:var(--amber);box-shadow:0 0 0 3px rgba(255,180,0,.2)}
.field input.bad,.field select.bad,.field textarea.bad{border-color:#E0413A;box-shadow:0 0 0 3px rgba(224,65,58,.15)}
.card-form{background:#fff;border-radius:18px;padding:30px;box-shadow:0 22px 60px rgba(0,0,0,.28);color:var(--text)}
.card-form h3{font-size:1.7rem;margin-bottom:6px}
.card-form>p{font-size:.72rem;color:var(--muted)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.warn{display:none;gap:10px;align-items:flex-start;background:#FDECEA;border:1px solid #F5B7B1;color:#9A2A22;
  padding:13px 15px;border-radius:10px;font-size:.86rem;line-height:1.55;margin:4px 0 14px}
.warn.on{display:flex}
.form-note{font-size:.79rem;color:var(--muted);line-height:1.6;margin-top:12px;text-align:center}

/* ============ KENAPA KAMI ============ */
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.why{background:#fff;border-radius:16px;padding:32px 28px;border:1px solid var(--line-d);
  border-top:4px solid var(--amber);transition:transform .22s ease,box-shadow .22s ease}
.why:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.why__ic{width:56px;height:56px;border-radius:14px;display:grid;place-items:center;font-size:1.4rem;
  background:linear-gradient(135deg,var(--amber),var(--amber-2));color:#111;margin-bottom:18px}
.why h3{margin-bottom:9px}
.why p{font-size:.93rem;color:var(--muted);margin:0}
.why ul{margin:12px 0 0;padding:0;list-style:none;font-size:.88rem}
.why li{display:flex;gap:9px;align-items:flex-start;margin-bottom:6px;color:#4B5563}
.why li i{color:#1F9D55;margin-top:5px;font-size:.78em}

/* ============ PRODUK ============ */
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.prod{background:#15181B;border:1px solid var(--line);border-radius:16px;overflow:hidden;
  display:flex;flex-direction:column;transition:transform .22s ease,border-color .22s ease}
.prod:hover{transform:translateY(-6px);border-color:rgba(255,180,0,.5)}
.prod__img{position:relative;aspect-ratio:4/3;overflow:hidden;background:#fff}
.prod__img img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.prod:hover .prod__img img{transform:scale(1.06)}
.prod__badge{position:absolute;top:12px;left:12px;background:var(--amber);color:#111;font-size:.62rem;
  font-weight:800;padding:5px 11px;border-radius:6px;letter-spacing:.03em}
.prod__body{padding:20px 20px 22px;display:flex;flex-direction:column;flex:1}
.prod__body h3{margin-bottom:7px;font-size:1.5rem;font-weight:600;}
.prod__body p{font-size:.88rem;color:#A8ADB5;flex:1}
.prod__body .btn{margin-top:14px;padding:11px 18px;font-size:.85rem}

/* ============ CTA ============ */
.cta{background:linear-gradient(120deg,var(--amber) 0%,var(--amber-2) 100%);color:#151515;position:relative;overflow:hidden}
.cta::before{content:"";position:absolute;inset:0;opacity:.13;
  background:repeating-linear-gradient(135deg,#000 0 22px,transparent 22px 44px)}
.cta__in{position:relative;z-index:2;text-align:center;max-width:820px;margin:0 auto}
.cta h2{color:#111;margin-bottom:14px}
.cta p{color:#3A2A00;font-weight:500}
.engines{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:22px 0 28px;list-style:none;padding:0}
.engines li{background:rgba(0,0,0,.82);color:var(--amber);font-weight:700;font-size:.84rem;
  padding:9px 18px;border-radius:999px;letter-spacing:.02em}
.cta__acts{display:flex;flex-wrap:wrap;gap:13px;justify-content:center}
.cta .btn--dark{box-shadow:0 12px 30px rgba(0,0,0,.26)}

/* ============ PRODUK LAIN ============ */
.grid3b{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.other{border:1px solid var(--line-d);border-radius:16px;overflow:hidden;background:#fff;
  transition:transform .22s ease,box-shadow .22s ease}
.other:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.other img{aspect-ratio:16/10;object-fit:cover;width:100%}
.other__b{padding:22px 24px 26px}
.other__b h3{margin-bottom:8px}
.other__b p{font-size:.9rem;color:var(--muted);margin:0}

/* ============ CUSTOMER ============ */
.logos{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.logos div{background:#fff;border:1px solid var(--line-d);border-radius:12px;padding:16px;
  display:grid;place-items:center;min-height:96px;transition:box-shadow .2s ease}
.logos div:hover{box-shadow:0 10px 24px rgba(0,0,0,.09)}
.logos img{max-height:58px;width:auto;object-fit:contain;filter:grayscale(1);opacity:.72;transition:.25s}
.logos div:hover img{filter:none;opacity:1}
.cert{display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:center;margin-top:38px;
  background:var(--ink);color:#DDE0E4;border-radius:16px;padding:30px 34px}
.cert__ic{width:76px;height:76px;border-radius:16px;display:grid;place-items:center;font-size:1.9rem;
  background:linear-gradient(135deg,var(--amber),var(--amber-2));color:#111}
.cert h3{margin-bottom:7px}
.cert p{margin:0;font-size:.94rem;color:#B4B9C0}
.tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px;list-style:none;padding:0}
.tags li{font-size:.76rem;font-weight:700;color:var(--amber);border:1px solid rgba(255,180,0,.4);
  padding:5px 12px;border-radius:999px}

/* ============ LOKASI ============ */
.hq{display:grid;grid-template-columns:auto 1fr;gap:20px;align-items:center;background:rgba(255,180,0,.09);
  border:1px solid rgba(255,180,0,.28);border-radius:16px;padding:24px 28px;margin-bottom:30px}
.hq__ic{width:58px;height:58px;border-radius:14px;background:var(--amber);color:#111;display:grid;place-items:center;font-size:1.35rem}
.hq h3{margin-bottom:4px}
.hq p{margin:0;font-size:.94rem;color:#B4B9C0}
.cities{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.city{background:#15181B;border:1px solid var(--line);border-radius:12px;padding:16px 18px;transition:.2s}
.city:hover{border-color:rgba(255,180,0,.55);transform:translateY(-3px)}
.city b{font-family:'Barlow Condensed',sans-serif;font-size:1.22rem;color:#fff;display:block;letter-spacing:.02em}
.city span{font-size:.79rem;color:#93989F}
.ops{display:flex;flex-wrap:wrap;gap:24px;align-items:center;justify-content:space-between;
  margin-top:34px;padding-top:30px;border-top:1px solid var(--line)}
.ops__t{display:flex;align-items:center;gap:13px;font-size:.95rem}
.ops__t i{color:var(--amber);font-size:1.4rem}
.ops__t b{display:block;color:#fff;font-size:1.02rem}
.ops__acts{display:flex;flex-wrap:wrap;gap:12px}

/* ============ FOOTER ============ */
.ftr{background:#07080A;color:#8C9198;padding:48px 0 34px;font-size:.88rem}
.ftr__top{display:flex;flex-wrap:wrap;gap:18px;justify-content:space-between;align-items:center;
  padding-bottom:24px;border-bottom:1px solid rgba(255,255,255,.07)}
.ftr__nav{display:flex;flex-wrap:wrap;gap:18px}
.ftr__nav a:hover{color:var(--amber)}
.copy{padding:22px 0 14px;text-align:center}
.copy b{color:#D6D9DD}
.kw{font-size:.73rem;line-height:1.85;color:#4A4F56;text-align:center;max-width:1000px;margin:0 auto}

/* ============ MODAL ============ */
.ov{position:fixed;inset:0;z-index:200;background:rgba(8,9,11,.74);backdrop-filter:blur(5px);
  display:none;align-items:center;justify-content:center;padding:20px;overflow-y:auto}
.ov.on{display:flex;animation:fadeIn .22s ease}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.modal{background:#fff;border-radius:18px;width:100%;max-width:480px;overflow:hidden;position:relative;
  box-shadow:0 30px 80px rgba(0,0,0,.45);animation:pop .3s cubic-bezier(.2,.8,.3,1);margin:auto}
@keyframes pop{from{transform:translateY(22px) scale(.96);opacity:0}to{transform:none;opacity:1}}
.modal__hd{background:var(--ink);color:#fff;padding:24px 26px 22px;position:relative}
.modal__hd h3{font-size:1.5rem;color:#fff;margin-bottom:4px}
.modal__hd p{margin:0;font-size:.86rem;color:#A9AEB6}
.modal__hd .wa-ic{position:absolute;right:24px;top:50px;width:42px;height:42px;border-radius:12px;
  background:#25D366;color:#fff;display:grid;place-items:center;font-size:1.25rem}
@media (max-width:500px){ .modal__hd .wa-ic{display:none;}.modal__hd h3{margin-bottom:10px;} }
.modal__bd{padding:24px 26px 26px}
.x{position:absolute;right:12px;top:-52px;width:38px;height:38px;border-radius:50%;border:0;
  background:rgba(255,255,255,.16);color:#fff;font-size:1rem;cursor:pointer}
.modal__close{position:absolute;right:14px;bottom:-0px}
.closeBtn{position:absolute;top:10px;right:10px;z-index:4;width:34px;height:34px;border-radius:50%;
  border:0;background:rgba(255,255,255,.14);color:#fff;cursor:pointer;font-size:.95rem;transition:.2s}
.closeBtn:hover{background:var(--amber);color:#111}
.to-wa{display:flex;align-items:center;gap:10px;font-size:.82rem;color:var(--muted);
  justify-content:center;margin-top:14px}
.to-wa i{color:#25D366}

/* ============ FLOATING WA ============ */
.fabs{position:fixed;z-index:120;right:20px;bottom:22px;display:flex;flex-direction:column;gap:14px}
.fabs__row{display:flex;flex-direction:column;gap:14px}
.fabs__hint{display:none;align-items:center;gap:8px;font-size:.78rem;font-weight:600;color:#C9CDD3;padding:0 3px}
.fabs__hint i{color:var(--amber)}
.fab__name{display:none}
.fab{display:flex;align-items:center;gap:0;position:relative}
.fab__btn{width:60px;height:60px;border-radius:50%;border:0;cursor:pointer;color:#fff;font-size:1.6rem;
  background:linear-gradient(140deg,#2AE071,#128C4B);display:grid;place-items:center;
  box-shadow:0 10px 26px rgba(18,140,75,.44);position:relative;z-index:2;transition:transform .2s ease}
.fab__btn:hover{transform:scale(1.07)}
.fab__btn::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid #2AE071;
  animation:ring 2.4s ease-out infinite}
.fab:nth-child(2) .fab__btn::after{animation-delay:1.2s}
@keyframes ring{0%{transform:scale(1);opacity:.85}70%{transform:scale(1.75);opacity:0}100%{opacity:0}}
.fab__lbl{position:absolute;right:70px;top:50%;transform:translateY(-50%);white-space:nowrap;
  background:var(--ink);color:#fff;font-size:.8rem;font-weight:600;padding:9px 15px;border-radius:999px;
  box-shadow:0 8px 22px rgba(0,0,0,.28);opacity:0;pointer-events:none;transition:opacity .25s ease,transform .25s ease}
.fab__lbl b{color:var(--amber)}
.fab:hover .fab__lbl,.fab__lbl.peek{opacity:1;transform:translateY(-50%) translateX(0)}
.fab__lbl{transform:translateY(-50%) translateX(10px)}
.fab__dot{position:absolute;top:-2px;right:-2px;width:14px;height:14px;border-radius:50%;
  background:var(--amber);border:2px solid #0B0C0E;z-index:3}
  
#tentang h2,#konsultasi h2,#produk h2{margin-bottom:20px;}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}
}

/* ============ RESPONSIVE ============ */
@media(max-width:1080px){
  .grid4{grid-template-columns:repeat(2,1fr)}
  .logos{grid-template-columns:repeat(4,1fr)}
  .cities{grid-template-columns:repeat(3,1fr)}
  .sl-nav{right:20px}.dots{left:20px}
}
@media(max-width:900px){
  .nav{position:fixed;inset:72px 0 auto;background:var(--ink);flex-direction:column;align-items:stretch;
    gap:0;padding:8px 16px 18px;border-bottom:1px solid var(--line);display:none}
  .nav.on{display:flex}
  .nav a{padding:13px 8px;border-bottom:1px solid var(--line)}
  .burger{display:block}
  .hdr .btn{display:none}
  .split,.form-grid,.grid3,.grid3b{grid-template-columns:1fr;gap:34px}
  .slides{min-height:auto}
  .slide{position:relative;display:none}
  .slide.on{display:flex}
  .slide__in{padding:30px 20px 116px;grid-template-columns:1fr;gap:24px;text-align:center;justify-items:center}
  .slide h1{max-width:none}
  .specs{justify-content:center}
  .hero__acts{justify-content:center}
  .slide__ph{min-height:0;order:2;width:100%}
  .slide__ph img{max-height:250px;max-width:82%}
  .dots{left:0;right:0;justify-content:center}
  .sl-nav{display:none}
  .figure__tag{display:none}
  .cert{grid-template-columns:1fr;text-align:left}
  .ops{flex-direction:column;align-items:flex-start}
}
@media(max-width:620px){
  .sec{padding:60px 0}
  .grid4,.logos{grid-template-columns:repeat(2,1fr)}
  #produk .grid4{grid-template-columns:repeat(1,1fr)}
  .cities{grid-template-columns:repeat(2,1fr)}
  .row2{grid-template-columns:1fr}
  .card-form{padding:22px}
  .hero__acts .btn,.cta__acts .btn{width:100%}
  .ops__acts{width:100%;display:block;}.ops__acts .btn{flex:1;display:block;width:100%;margin-bottom:10px;}
  .ops__acts .btn:last-child{margin-bottom:0;}
  /* slider: teks diringkas, gambar tetap tampil di bawah teks */
  .slide p{display:none}
  .specs{margin:14px 0 20px}
  .specs li:nth-child(n+3){display:none}
  .slide__in{padding-bottom:100px}
  .slide__ph img{max-height:250px;height:250px}
  /* floating WA: satu panel di bawah, bukan dua tombol mepet pinggir */
  .fabs{left:3px;right:3px;bottom:3px;flex-direction:column;gap:5px;align-items:stretch;
    background:rgba(11,12,14,.93);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.12);
    border-radius:18px;padding:7px 8px 8px;box-shadow:0 14px 34px rgba(0,0,0,.45)}
  .fabs__hint{display:flex}
  .fabs__row{flex-direction:row;gap:9px}
  .fab{flex:1;min-width:0}
  .fab__lbl{display:none}
  .fab__dot{display:none}
  .fab__btn{width:100%;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;
    gap:8px;font-size:1.12rem;box-shadow:0 6px 16px rgba(18,140,75,.34)}
  .fab__btn::after{display:none}
  .fab__name{display:inline;font-family:'Inter',sans-serif;font-size:.88rem;font-weight:700;letter-spacing:.01em}
}