/* Template Sewa Mobil Box: surat jalan — kertas krem #F7F3E8, tinta biru karbon #2846A0, rangkap merah muda #F4C6CF & kuning #F6E39A,
   cap merah #C2362B, garis titik formulir; isian bergaya tulisan tangan miring. */
:root{--latar:#EFEBE0;--latar-2:#E6E1D3;--permukaan:#FBF8F0;--teks:#232733;--teks-2:#4F5466;--teks-3:#868A97;--garis:#D7D1C1;
  --utama:#2846A0;--utama-tua:#1C3478;--utama-muda:#DCE3F4;--pada-utama:#FFFFFF;--aksen:#C2362B;--aksen-tua:#9C281F;--pada-aksen:#FFFFFF;
  --gelap:#232733;--pada-gelap:#F7F3E8;--radius:4px;--radius-kecil:3px;--bayang:0 14px 28px -20px rgba(35,39,51,.5);--tangan:"Segoe Print","Bradley Hand","Comic Sans MS",cursive}
body{background:var(--latar);color:var(--teks)}
h1,h2,h3{font-weight:800;letter-spacing:-.03em;color:var(--teks)}
.serif{font-family:var(--tangan);font-style:normal;font-weight:700;color:var(--utama)}
.kepala .btn-wa,.btn-wa,.btn-utama{background:var(--utama);color:#fff}
.bag-alt{background:var(--latar-2)}
.kaki{background:var(--gelap)}
[hidden]{display:none!important}
.mbx-alis{margin:0 0 12px;font-size:12.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--aksen)}
.mbx-lead{font-size:17px;color:var(--teks-2)}
.mbx-btn{background:var(--utama);color:#fff;font-weight:800;border-radius:3px}
.mbx-btn:hover{background:var(--utama-tua);color:#fff}
.mbx-link{font-weight:800;color:var(--utama);border-bottom:2px dotted var(--utama)}
.mbx-blok{width:100%;justify-content:center}

.mbx-hero{padding:72px 0 86px;overflow:hidden}
.mbx-hero-isi{display:grid;gap:48px;align-items:center}
@media(min-width:940px){.mbx-hero-isi{grid-template-columns:1.1fr .9fr}}
.mbx-lembar{position:relative;min-width:0;padding:26px 28px 32px;background:var(--permukaan) repeating-linear-gradient(transparent 0 33px,rgba(40,70,160,.12) 33px 34px);box-shadow:8px 8px 0 #F4C6CF,16px 16px 0 #F6E39A,var(--bayang)}
.mbx-kop{display:flex;justify-content:space-between;margin:-26px -28px 18px;padding:10px 28px;border-bottom:2px solid var(--teks);font-size:12px;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
.mbx-kop span+span{color:var(--aksen)}
.mbx-hero h1{font-size:clamp(36px,5.2vw,66px);line-height:1.04;margin:0 0 14px}
.mbx-isian{display:flex;gap:8px;align-items:baseline;margin:0 0 12px;border-bottom:2px dotted var(--teks-3);padding-bottom:4px}
.mbx-isian small{font-weight:800;font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--teks-3)}
.mbx-isian span{font-family:var(--tangan);color:var(--utama);font-size:17px}
.mbx-tombol{display:flex;flex-wrap:wrap;align-items:center;gap:22px;margin-top:24px}
.mbx-cap{position:absolute;right:22px;bottom:22px;display:grid;place-items:center;width:96px;height:96px;border:3px solid var(--aksen);border-radius:50%;color:var(--aksen);font-size:13px;font-weight:900;letter-spacing:.1em;transform:rotate(-14deg);opacity:.75;box-shadow:inset 0 0 0 4px var(--permukaan),inset 0 0 0 6px var(--aksen)}
@media(max-width:700px){.mbx-cap{display:none}}
.mbx-foto{position:relative;margin:0;padding:10px 10px 30px;background:#fff;box-shadow:var(--bayang);transform:rotate(-1.5deg)}
.mbx-foto img{display:block;width:100%;aspect-ratio:4/3.3;object-fit:cover}
.mbx-jepit{position:absolute;left:50%;top:-14px;width:70px;height:26px;margin-left:-35px;border-radius:4px 4px 8px 8px;background:linear-gradient(#9AA0AA,#6B717C);box-shadow:0 2px 3px rgba(0,0,0,.3);z-index:1}

.mbx-kepala{margin-bottom:30px}
.mbx-kepala h2,.mbx-rute h2,.mbx-t-teks h2{font-size:clamp(30px,4.4vw,54px);margin:0}
.mbx-kisi{display:grid;gap:22px}
@media(min-width:640px){.mbx-kisi{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1000px){.mbx-kisi{grid-template-columns:repeat(3,minmax(0,1fr))}}
.mbx-kartu{display:flex;flex-direction:column;min-width:0;background:var(--permukaan);box-shadow:4px 4px 0 #F4C6CF,var(--bayang)}
.mbx-k-foto img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}
.mbx-k-isi{display:flex;flex-direction:column;flex:1;padding:16px 20px 20px}
.mbx-k-sub{margin:0 0 4px;font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--aksen)}
.mbx-kartu h3{font-size:22px;margin:0 0 6px}.mbx-kartu h3 a{color:inherit}
.mbx-k-isi>p:not(.mbx-k-sub):not(.mbx-harga){margin:0 0 10px;color:var(--teks-2);font-size:15px}
.mbx-form{display:grid;margin:0 0 12px}
.mbx-form div{display:flex;justify-content:space-between;gap:10px;padding:4px 0;border-bottom:2px dotted var(--garis)}
.mbx-form dt{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--teks-3)}
.mbx-form dd{margin:0;font-family:var(--tangan);color:var(--utama);font-size:15px}
.mbx-harga{margin:auto 0 0;color:var(--teks-3);font-size:14px}.mbx-harga b{font-size:21px;color:var(--teks);border-bottom:3px solid var(--utama)}

.mbx-rute{display:grid;gap:30px;margin-top:64px;padding:30px;background:var(--permukaan);box-shadow:8px 8px 0 #F6E39A,var(--bayang)}
@media(min-width:960px){.mbx-rute{grid-template-columns:1fr 1.05fr;padding:42px}}
.mbx-r-kiri,.mbx-r-kanan{min-width:0}
.mbx-rute h2{margin-bottom:18px}
.mbx-dua{display:grid;grid-template-columns:1.4fr 1fr;gap:12px}
.mbx-f{display:grid;gap:6px;margin-bottom:12px;font-size:12.5px;font-weight:700;color:var(--teks-3)}
.mbx-f b{color:var(--teks-2)}
.mbx-f select,.mbx-f input{width:100%;min-width:0;padding:10px 12px;border:1px solid var(--garis);border-radius:3px;background:#fff;font:inherit;font-size:15px;color:var(--teks)}
.mbx-f textarea{width:100%;padding:10px 12px;border:1px solid var(--garis);background:#fff repeating-linear-gradient(transparent 0 25px,rgba(40,70,160,.1) 25px 26px);font:16px/26px var(--tangan);color:var(--utama);resize:vertical}
.mbx-garis{padding:8px;background:#fff;border:1px solid var(--garis)}
.mbx-garis svg{display:block;width:100%;height:auto}
.mbx-garis text{font:600 11.5px system-ui,sans-serif;fill:var(--teks)}
.mbx-garis .mbx-jam{font-family:var(--tangan);font-size:12px;fill:var(--utama)}
.mbx-jalur{stroke:var(--utama);stroke-width:3;stroke-dasharray:2 6;stroke-linecap:round}
.mbx-titik{fill:var(--utama);stroke:#fff;stroke-width:2}.mbx-titik.kosong{fill:#fff;stroke:var(--utama)}
.mbx-angka{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:14px 0}
.mbx-angka div{padding:10px;border:2px dotted var(--garis)}
.mbx-angka dt{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--teks-3)}
.mbx-angka dd{margin:2px 0 0;font-weight:800;font-size:15px}
.mbx-cek{margin:0 0 12px;padding:10px 14px;font-weight:700;font-size:14px;border-left:4px solid}
.mbx-cek.aman{border-color:var(--utama);background:var(--utama-muda)}.mbx-cek.awas{border-color:var(--aksen);background:#F8DFDB}
.mbx-rinci{display:grid;margin:0 0 16px}
.mbx-rinci>div{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 12px;padding:7px 0;border-bottom:2px dotted var(--garis)}
.mbx-rinci dt{color:var(--teks-3);font-size:14px}.mbx-rinci dd{margin:0;font-weight:800}
.mbx-total dd{font-size:26px;color:var(--utama)}

.mbx-t{display:grid;gap:44px;align-items:center}
@media(min-width:900px){.mbx-t{grid-template-columns:1.1fr .9fr}}
.mbx-t-teks{min-width:0}
.mbx-terima{width:100%;margin-top:22px;border-collapse:collapse;background:var(--permukaan);font-size:14.5px}
.mbx-terima th{padding:8px 10px;border:1.5px solid var(--teks);background:var(--latar-2);font-size:12px;text-transform:uppercase;letter-spacing:.06em;text-align:left}
.mbx-terima td{padding:9px 10px;border:1.5px solid var(--teks)}
.mbx-terima td:last-child{width:60px;text-align:center;font-family:var(--tangan);font-size:20px;color:var(--utama)}
.mbx-terima td:first-child{width:40px;text-align:center;font-weight:800}