.gw-onboarding{max-width:880px;margin:0 auto;padding:8px}
.gw-title{margin:0 0 .5rem 0}
.gw-progress{height:6px;background:#e5e7eb;border-radius:999px;margin:.25rem 0 1.25rem;overflow:hidden}
.gw-progress__bar{height:100%;width:0;border-radius:999px;background:#1558d6;transition:width .25s ease}
.gw-step{display:none}
.gw-step.active{display:block}
.gw-option{display:flex;align-items:center;gap:.6rem;padding:.85rem 1rem;border:1px solid #e5e7eb;border-radius:.75rem;margin:.5rem 0;background:#fff}
.gw-option input[type=radio]{transform:scale(1.05)}
.gw-other{display:none;margin:.5rem 0 0 0}
.gw-other input{width:100%;padding:.75rem 1rem;border:1px solid #d1d5db;border-radius:.5rem;background:#fff}
.gw-actions{display:flex;justify-content:space-between;gap:.75rem;margin-top:1rem}
.gw-btn{padding:.6rem 1.1rem;border:none;border-radius:.6rem;background:#0b5cab;color:#fff;cursor:pointer}
.gw-btn.secondary{background:#e6effa;color:#0b5cab}
.gw-error{display:none;color:#b91c1c;font-size:.875rem;margin-top:.4rem}

/* Interstitial styles */
.gw-interstitial{text-align:center;padding:28px 18px}

.gw-interstitial h2{font-size:28px;line-height:1.2;margin:8px 0 10px}
.gw-interstitial p{font-size:16px;color:#374151;max-width:620px;margin:0 auto 18px}


@media (prefers-color-scheme: dark){
  body.dark .gw-option,
  html[theme="dark"] .gw-option,
  .gw-option {
    background:#fff !important;
    border-color:#e5e7eb !important;
    color:#111 !important;
  }
  body.dark .gw-other input,
  html[theme="dark"] .gw-other input,
  .gw-other input {
    background:#fff !important;
    border-color:#d1d5db !important;
    color:#111 !important;
  }
  body.dark .gw-interstitial p,
  html[theme="dark"] .gw-interstitial p,
  .gw-interstitial p {
    color:#374151 !important;
  }
}
  .gw-other input {
    background:#fff !important;
    border-color:#d1d5db !important;
    color:#111 !important;
  }
  .gw-interstitial p {
    color:#374151 !important;
  }
}



.gw-btn.gw-telegram::before {
  content: "\2709"; /* ✉ as placeholder icon */
}

.gw-btn.gw-whatsapp {
  background-color: #25D366;
  color: #fff !important;
  border-radius: 8px;
  padding: 10px 20px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 10px;
  text-decoration: none;
}
.gw-btn.gw-whatsapp::before {
  content: "\260E"; /* ☎ as placeholder icon */
}

/* Logo lebih besar */


/* Gambar utama lebih besar */





@media (max-width: 640px) {
  
  
  }


/* Gambar di halaman jeda */



/* Responsive fix for contact buttons */
.gw-contact-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.gw-contact-buttons button,
.gw-contact-buttons a {
  flex: 1 1 auto;
  min-width: 120px;
}

@media (max-width: 600px) {
  .gw-contact-buttons {
    flex-direction: column;
  }
  .gw-contact-buttons button,
  .gw-contact-buttons a {
    width: 100%;
  }
}


/* Responsive fix for contact buttons (patched13) */
.gw-contact-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.gw-contact-buttons button,
.gw-contact-buttons a {
  flex: 1 1 auto;
  min-width: 120px;
  max-width: 100%;
}

/* === Responsive Fix for Buttons on Small Screens === */
@media (max-width: 480px) {
  .onboarding-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }
  .onboarding-buttons a,
  .onboarding-buttons button {
    flex: 1 1 100%;
    max-width: 100%;
    text-align: center;
  }
}