/* =========================
   CLEAN + DARK-PRO CSS (FINAL)
   Home + Games + Wizard + Modal + Footer
   ========================= */

:root{
  --max-width: 1280px;
  --container-padding: 18px;
  --radius: 18px;

  /* Dark Pro Palette */
  --bg:#0b1220;
  --panel:rgba(17,24,39,.96);
  --panel-2:#0f172a;
  --border:#1f2937;

  --text:#e5e7eb;
  --muted:#94a3b8;

  --primary-1:#22c55e;
  --primary-2:#16a34a;

  --accent-1:#60a5fa;
  --accent-2:#a78bfa;

  --success:#22c55e;
  --warning:#f59e0b;
  --danger:#ef4444;

  --line:#243044;
}

/* ---------- BASE ---------- */
*{ box-sizing:border-box; }
html{
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}
body{
  margin:0; padding:0;
  font-family:'Noto Sans Myanmar','Padauk','Myanmar3',sans-serif;
  background:
    radial-gradient(1200px 500px at 10% -10%, #1f2a44 0%, transparent 60%),
    radial-gradient(1200px 500px at 110% 0%, #0b3a4a 0%, transparent 60%),
    var(--bg);
  min-height:100%;
  color:var(--text);
}
.container{
  max-width:var(--max-width);
  margin:0 auto;
  padding:clamp(12px, 2.5vw, var(--container-padding));
}

/* flash messages */
.success-message, .error-message{
  padding:12px 14px;border-radius:12px;font-weight:900;font-size:14px;
  border:1px solid transparent; box-shadow:0 10px 25px rgba(0,0,0,.25);
}
.success-message{
  background:rgba(34,197,94,.12);
  color:#bbf7d0;border-color:rgba(34,197,94,.45);display:none;
}
.success-message.show{display:block;}
.error-message{
  background:rgba(239,68,68,.12);
  color:#fecaca;border-color:rgba(239,68,68,.45);
}

/* ---------- HEADER ---------- */
header{
  background:var(--panel);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:22px 24px;
  margin-bottom:22px;
  box-shadow:0 12px 30px rgba(0,0,0,.35);
}
.header-content{
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;
}
.logo-section{ display:flex;align-items:center;gap:14px; }
.store-logo{
  width:86px;height:86px;object-fit:contain;border-radius:16px;
  background:var(--panel-2);padding:6px;border:1px solid var(--border);
  box-shadow:0 6px 16px rgba(0,0,0,.35);
}
.store-info{ display:flex;flex-direction:column;gap:4px; }
#store-name{
  margin:0;font-weight:900;font-size:clamp(22px,2.8vw,34px);
  letter-spacing:.6px;line-height:1.1;
  background:linear-gradient(135deg,#22c55e,#60a5fa,#a78bfa);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  text-shadow:0 2px 12px rgba(34,197,94,.35);
}
#store-tagline{
  margin:0;font-weight:800;font-size:clamp(12px,1.4vw,15px);
  color:var(--text);opacity:.9;display:inline-flex;align-items:center;gap:6px;
  padding:4px 10px;border-radius:999px;
  background:rgba(96,165,250,.12);border:1px solid rgba(96,165,250,.25);
}
.header-right{display:flex;gap:12px;align-items:center;flex-wrap:wrap;}
.contact-info{
  display:flex;align-items:center;gap:10px;
  background:linear-gradient(135deg,var(--primary-1),var(--primary-2));
  color:#052e16;padding:10px 18px;border-radius:999px;font-weight:900;font-size:15px;
  box-shadow:0 8px 20px rgba(34,197,94,.35);
}

/* Mobile header */
@media (max-width:767px){
  header{ padding:18px 16px; margin-bottom:18px; border-radius:16px; }
  .header-content{ flex-direction:column; text-align:center; gap:12px; }
  .logo-section{ flex-direction:column; gap:10px; }
  .store-logo{ width:74px;height:74px; }
  #store-tagline{ justify-content:center; align-self:center; }
  .header-right{ flex-direction:column; width:100%; gap:10px; }
  .contact-info{ width:100%; justify-content:center; }
}

/* ---------- SLIDESHOW ---------- */
.slideshow-section{ margin-bottom:18px; }
.slideshow-container{
  position:relative;width:100%;
  border-radius:16px;overflow:hidden;background:#0b1020;
  height:380px;max-height:560px;border:1px solid var(--border);
  box-shadow:0 12px 30px rgba(0,0,0,.35);
}
.slides{ position:relative;width:100%;aspect-ratio:16/7; }
.slide{ position:absolute;inset:0;opacity:0;transition:opacity .6s ease; }
.slide.active{ opacity:1; }
.slide img{ width:100%;height:100%;object-fit:cover;object-position:center;display:block; }

.slide-arrow{
  position:absolute;top:50%;transform:translateY(-50%);
  background:rgba(15,23,42,0.95);border:1px solid var(--border);
  width:40px;height:40px;border-radius:999px;color:#fff;
  font-size:18px;font-weight:900;cursor:pointer;z-index:5;
}
.slide-arrow.prev{ left:10px; }
.slide-arrow.next{ right:10px; }

.slide-nav{
  position:absolute;left:50%;bottom:10px;transform:translateX(-50%);
  display:flex;gap:8px;z-index:6;
}
.slide-dot{
  width:22px;height:6px;background:rgba(255,255,255,.25);
  border-radius:999px;cursor:pointer;transition:.2s;
}
.slide-dot.active{ background:var(--accent-1);width:32px; }

@media (max-width:1024px){ .slideshow-container{ height:300px; } }
@media (max-width:767px){ .slideshow-container{ height:240px; } }
@media (max-width:480px){ .slideshow-container{ height:210px; } }

/* ---------- GAMES GRID (Dark Pro) ---------- */
.games-section{ margin-bottom:26px; }
.section-title{
  text-align:center;color:#e2e8f0;
  font-size:clamp(20px,3vw,32px);
  margin-bottom:18px;text-shadow:0 4px 18px rgba(0,0,0,.45);
  font-weight:900;
}
.games-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:16px;margin-bottom:18px;
}
.game-card{
  background:var(--panel);
  border-radius:14px;overflow:hidden;
  border:1px solid var(--border);
  box-shadow:0 10px 26px rgba(0,0,0,.35);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.game-card:hover{
  transform:translateY(-4px);
  box-shadow:0 16px 35px rgba(0,0,0,.5);
  border-color:#2b3a55;
}
.game-image{
  width:100%;
  aspect-ratio:1/1; height:auto !important;
  object-fit:cover;object-position:center;
  cursor:zoom-in;transition:transform .25s ease;
  display:block;background:#0b1020;
  border-bottom:1px solid var(--border);
}
.game-image:hover{ transform:scale(1.04); }

.game-info{ padding:12px;text-align:center;display:grid;gap:8px; }
.game-info h3{
  margin:0;color:var(--text);
  font-size:15px;font-weight:900;letter-spacing:.2px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.buy-button{
  background:linear-gradient(135deg,var(--primary-1),var(--primary-2));
  color:#052e16;border:none;padding:10px 14px;border-radius:12px;
  font-size:14px;font-weight:900;cursor:pointer;width:100%;
  font-family:'Noto Sans Myanmar',sans-serif;
  transition:transform .15s ease, box-shadow .15s ease;
  box-shadow:0 8px 20px rgba(34,197,94,.35);
}
.buy-button:hover{ transform:translateY(-1px); box-shadow:0 10px 24px rgba(34,197,94,.45); }

/* Tablet */
@media (max-width:900px){
  .games-grid{ grid-template-columns:repeat(3,1fr); gap:14px; }
  .game-info h3{ font-size:14px; }
}
/* Phone */
@media (max-width:600px){
  .games-grid{ grid-template-columns:repeat(2,1fr); gap:12px; }
  .game-image{ aspect-ratio:4/3 !important; }
  .game-info h3{ font-size:13.5px; }
  .buy-button{ font-size:13px; padding:9px 12px; }
}
@media (max-width:380px){
  .games-grid{ grid-template-columns:1fr; }
}

/* ---------- ZOOM MODAL ---------- */
.zoom-modal{
  display:none;position:fixed;inset:0;background:rgba(0,0,0,0.92);z-index:2000;
  justify-content:center;align-items:center;cursor:zoom-out;
}
.zoom-modal.active{ display:flex; }
.zoom-modal img{
  max-width:90%;max-height:90%;object-fit:contain;border-radius:14px;
  box-shadow:0 20px 60px rgba(0,0,0,0.6);animation:zoomIn .25s ease;
}
.zoom-close{
  position:absolute;top:24px;right:24px;background:var(--panel-2);color:#fff;border:1px solid var(--border);
  width:48px;height:48px;border-radius:50%;font-size:26px;font-weight:900;cursor:pointer;display:flex;
  align-items:center;justify-content:center;box-shadow:0 5px 20px rgba(0,0,0,0.5);transition:transform .2s ease;
}
.zoom-close:hover{ transform:scale(1.06); }
@keyframes zoomIn{ from{transform:scale(.7);opacity:0} to{transform:scale(1);opacity:1} }

/* =========================================================
   PURCHASE PAGE / WIZARD (Dark Pro)
   ========================================================= */
.purchase-page{ display:none; }
.purchase-page.active{ display:block; }

.wizard-wrap{ padding-top:8px; padding-bottom:18px; }
.wizard-top{ display:grid; gap:12px; margin-bottom:12px; }

.back-button{
  background:var(--panel);
  color:var(--text);border:1px solid var(--border);
  padding:10px 16px;border-radius:12px;font-size:15px;font-weight:900;cursor:pointer;
  box-shadow:0 8px 20px rgba(0,0,0,.35);transition:.15s ease;display:inline-flex;align-items:center;gap:8px;
}
.back-button:hover{ transform:translateY(-1px); }

.wizard-game{
  background:var(--panel);border:1px solid var(--border);
  border-radius:14px;padding:12px;display:flex;align-items:center;gap:12px;
  box-shadow:0 8px 24px rgba(0,0,0,.35);
}
.wizard-game-logo{ width:64px;height:64px;border-radius:12px;object-fit:cover;cursor:zoom-in;flex:0 0 auto;border:1px solid var(--border); }
.wizard-game-title{ margin:0;color:var(--text);font-size:18px;font-weight:900; }
.wizard-game-sub{ margin:4px 0 0;font-size:12px;color:var(--muted);font-weight:700; }

.wizard-steps{ display:flex; gap:8px; flex-wrap:wrap; justify-content:center; margin-top:6px; }
.w-step{
  position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:8px 14px;border-radius:999px;font-weight:900;font-size:12.5px;letter-spacing:.3px;
  color:#e5e7eb;background:rgba(255,255,255,0.08);border:1px solid rgba(255,255,255,0.15);
  backdrop-filter:blur(6px);cursor:pointer;user-select:none;transition:.18s ease;
  box-shadow:0 6px 16px rgba(0,0,0,0.35);
}
.w-step:hover{ transform:translateY(-1px); background:rgba(255,255,255,0.12); }
.w-step.active{
  color:#052e16;border-color:transparent;
  background:linear-gradient(135deg,var(--primary-1),var(--primary-2));
  box-shadow:0 8px 22px rgba(34,197,94,0.45), inset 0 0 0 1px rgba(255,255,255,0.25);
}
.w-step.active::before{
  content:"";width:8px;height:8px;border-radius:999px;background:#fff;
  box-shadow:0 0 0 4px rgba(255,255,255,0.25);margin-right:6px;
}

.w-card{
  background:var(--panel);border:1px solid var(--border);
  border-radius:14px;padding:14px;box-shadow:0 8px 24px rgba(0,0,0,.35);
  margin-bottom:12px;display:none;
}
.w-card.show{ display:block; }

.w-card-head{ display:flex;gap:10px;align-items:center;margin-bottom:10px; }
.w-no{
  width:32px;height:32px;border-radius:999px;background:linear-gradient(135deg,var(--accent-1),var(--accent-2));
  color:#fff;font-weight:900;display:grid;place-items:center;
}
.w-title{ font-size:16px;font-weight:900;color:var(--text); }
.w-sub{ font-size:12px;font-weight:700;color:var(--muted); }

.w-next{ display:flex;gap:8px;justify-content:flex-end;margin-top:12px; }
.w-next-btn, .w-prev-btn{
  border:none;padding:10px 14px;border-radius:10px;font-weight:900;cursor:pointer;font-size:14px;
}
.w-next-btn{
  background:linear-gradient(135deg,var(--primary-1),var(--primary-2));
  color:#052e16;
}
.w-prev-btn{
  background:var(--panel-2);color:var(--text);border:1px solid var(--border);
}
.w-next-btn:disabled{ opacity:.55; cursor:not-allowed; }

/* STEP-1 ITEM GRID */
.game-item-grid{
  display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:10px;
}
.game-item-option{
  background:var(--panel-2);border:2px solid var(--border);
  border-radius:12px;padding:14px;text-align:center;cursor:pointer;transition:.18s ease;
  font-size:15px;font-weight:900;color:var(--text);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
}
.game-item-option:hover{
  border-color:var(--accent-1);transform:translateY(-2px);
  box-shadow:0 8px 18px rgba(96,165,250,0.25);
}
.game-item-option.selected{
  border-color:var(--accent-2);
  background:linear-gradient(135deg, rgba(167,139,250,0.12), rgba(96,165,250,0.10));
  color:#dbeafe;
}
.item-thumb{ width:58px;height:58px;object-fit:contain; }
.item-title{ font-weight:900;font-size:14px;color:var(--text); }

/* STEP-1 PACKAGE GRID */
#diamondGrid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:12px;
}
.diamond-card{
  background:var(--panel);
  border:1px solid var(--border);border-radius:14px;padding:12px 10px;text-align:center;
  box-shadow:0 6px 16px rgba(0,0,0,0.25);cursor:pointer;transition:.18s ease;
  min-height:135px;display:flex;flex-direction:column;justify-content:center;gap:6px;
}
.diamond-card:hover{
  transform:translateY(-2px);box-shadow:0 12px 22px rgba(0,0,0,0.35);border-color:#2b3a55;
}
.diamond-card.selected{
  border:2px solid var(--accent-2);
  box-shadow:0 10px 26px rgba(167,139,250,0.35);transform:translateY(-2px);
}
.diamond-img{
  width:62px;height:62px;object-fit:contain;margin:0 auto 2px;
  filter:drop-shadow(0 6px 6px rgba(0,0,0,0.25));
}
.diamond-name{ font-size:14.5px;font-weight:900;color:var(--text);line-height:1.35; }
.diamond-price{ font-size:14px;font-weight:900;color:#bbf7d0; }
.diamond-empty{
  background:var(--panel);padding:12px;border-radius:12px;font-weight:900;color:var(--muted);
  text-align:center;grid-column:1/-1;border:1px dashed var(--border);
}

/* diamondGrid responsive */
@media (max-width:900px){
  #diamondGrid{ grid-template-columns:repeat(3,1fr);gap:10px; }
}
@media (max-width:560px){
  #diamondGrid{ grid-template-columns:repeat(2,1fr);gap:10px; }
  .diamond-img{ width:54px;height:54px; }
  .diamond-name{ font-size:14px; }
  .diamond-price{ font-size:13.5px; }
}
@media (max-width:380px){
  #diamondGrid{ grid-template-columns:1fr; }
}
@media (min-width:768px) and (max-width:1024px){
  .game-item-grid{ grid-template-columns:repeat(3,1fr)!important;gap:12px!important; }
}

/* STEP-3 FORM */
.w-form-grid{ display:grid;grid-template-columns:1fr 1fr;gap:12px; }
.form-group{ margin-bottom:14px; }
.form-group label{
  display:block;margin-bottom:6px;color:var(--text);font-weight:900;font-size:14px;
}
.form-group input, .form-group select{
  width:100%;padding:12px;border:1px solid var(--border);border-radius:10px;
  font-size:16px;font-weight:700;background:var(--panel-2);color:var(--text);
}
.form-group input:focus, .form-group select:focus{
  outline:none;border-color:var(--primary-1);box-shadow:0 0 0 3px rgba(34,197,94,.18);
}

.selected-item-preview{
  background:var(--panel-2);padding:8px 10px;border-radius:10px;
  font-weight:900;font-size:14px;margin-bottom:10px;color:var(--text);
  border:1px solid var(--border);
}

/* telegram box */
.telegram-box{
  background:var(--panel-2);border:2px dashed var(--success);
  padding:14px;border-radius:14px;margin-top:12px;display:grid;gap:10px;
}
.telegram-title{ font-size:15px;font-weight:900;color:#bbf7d0; }
.telegram-text{ font-size:14px;line-height:1.8;color:var(--text);font-weight:700; }
.telegram-text code{
  background:#0b1020;color:#fff;padding:3px 8px;border-radius:8px;font-size:14px;font-weight:900;
}
.telegram-text small{ display:block;margin-top:4px;color:var(--muted);font-size:12px;font-weight:800; }
.telegram-btn{
  text-align:center;background:linear-gradient(135deg,var(--primary-1),var(--primary-2));
  color:#052e16;padding:12px 14px;border-radius:12px;font-weight:900;
  text-decoration:none;font-size:15px;box-shadow:0 6px 18px rgba(34,197,94,.35);
  transition:.2s ease;
}
.telegram-btn:hover{ transform:translateY(-2px); box-shadow:0 10px 22px rgba(34,197,94,.45); }
.telegram-note{
  font-size:12px;font-weight:800;color:#fecaca;background:rgba(239,68,68,.12);
  padding:8px 10px;border-radius:10px;border:1px solid rgba(239,68,68,.35);
}

/* STEP-4 PAY PREVIEW */
.pay-preview{ display:grid;gap:8px; }
.pp-row{
  display:flex;justify-content:space-between;align-items:center;
  background:var(--panel-2);border:1px solid var(--border);
  padding:8px 10px;border-radius:10px;font-size:14px;font-weight:900;color:var(--text);
}
.pp-total{
  background:linear-gradient(135deg,var(--accent-1),var(--accent-2));
  color:#fff;padding:12px;border-radius:12px;text-align:center;margin-top:6px;
}
.pp-total .label{ font-size:13px;font-weight:800;opacity:.9; }
.pp-total .amount{ font-size:22px;font-weight:900; }
.pp-pay-btn{
  width:100%;border:none;border-radius:12px;padding:12px;font-size:16px;font-weight:900;cursor:pointer;
  background:var(--warning);color:#111827;margin-top:6px;
}
.pp-note{
  font-size:12px;color:var(--muted);font-weight:800;line-height:1.7;
  background:var(--panel-2);padding:8px 10px;border-radius:10px;border:1px solid var(--border);
}

/* =========================================================
   PAYMENT MODAL (Dark Pro)
   ========================================================= */
.payment-modal{
  position:fixed;inset:0;display:none;align-items:center;justify-content:center;
  padding:8px;background:rgba(0,0,0,.85);z-index:3500;overflow:hidden;
}
.payment-modal.active{ display:flex; }

.payment-modal-content{
  width:100%;max-width:520px;height:100dvh;max-height:100dvh;
  background:var(--panel);border-radius:14px;border:1px solid var(--border);
  display:flex;flex-direction:column;overflow:hidden;box-sizing:border-box;
}
.payment-modal-header{
  flex:0 0 auto;padding:12px 14px;border-bottom:1px solid var(--border);
  display:flex;justify-content:space-between;align-items:center;
  background:var(--panel);position:sticky;top:0;z-index:10;
}
.payment-modal-header h2{ margin:0;font-size:16px;font-weight:900;color:var(--text); }
.modal-close-btn{
  background:var(--danger);color:white;border:none;width:36px;height:36px;border-radius:50%;
  font-size:20px;font-weight:900;cursor:pointer;display:grid;place-items:center;transition:.2s;
}
.modal-close-btn:hover{ transform:scale(1.1); }
.payment-modal-body{
  flex:1 1 auto;overflow-y:auto;overflow-x:hidden;padding:12px 14px;
}
.payment-section{ margin-bottom:14px; }
.payment-section h3{ margin:0 0 8px;font-size:15px;font-weight:900;color:var(--text); }

.package-detail-box{
  background:var(--panel-2);padding:12px;border-radius:12px;border:1px solid var(--border);
}
.package-detail-item{
  display:flex;justify-content:space-between;align-items:center;
  padding:8px 0;border-bottom:1px dashed var(--border);
  font-size:14px;font-weight:900;color:var(--text);
}
.package-detail-item:last-child{ border-bottom:none; }
.package-detail-item .label{ color:var(--muted); }
.package-detail-item .value{ color:#bbf7d0;font-weight:900; }

.modal-input, .payment-modal-body input, .payment-modal-body select{
  width:100%!important;max-width:100%!important;min-width:0!important;
  font-size:16px!important;padding:10px 12px;border:1px solid var(--border);
  border-radius:10px;background:var(--panel-2);color:var(--text);
}

/* pay-card view */
.pay-grid{ display:grid;grid-template-columns:repeat(2,1fr);gap:10px; }
.pay-card{
  background:var(--panel-2);border:1px solid var(--border);border-radius:14px;padding:12px;
  cursor:pointer;transition:.15s ease;box-shadow:0 6px 18px rgba(0,0,0,.35);
}
.pay-card:hover{ transform:translateY(-2px); border-color:#2b3a55; }
.pay-card.selected{
  border-color:var(--success);
  box-shadow:0 8px 22px rgba(34,197,94,.25);
  background:linear-gradient(135deg, rgba(34,197,94,.12), var(--panel-2));
}
.pay-top{ display:flex;align-items:center;gap:8px;margin-bottom:8px; }
.pay-logo{ width:34px;height:34px;object-fit:contain; }
.pay-name{ font-weight:900;font-size:14px;color:var(--text);letter-spacing:.5px; }
.pay-owner{ font-size:13px;font-weight:800;color:var(--muted);margin-bottom:6px; }
.pay-phone{
  background:#0b1020;color:#fff;padding:10px 12px;border-radius:10px;font-weight:900;text-align:center;user-select:none;cursor:copy;
}

/* screenshot area */
.screenshot-upload{
  background:var(--panel-2);border:2px dashed var(--border);border-radius:12px;
  padding:14px;text-align:center;cursor:pointer;transition:.2s;color:var(--text);
}
.screenshot-upload:hover{ border-color:var(--accent-1); }
.screenshot-upload.has-file{
  border-color:var(--success);border-style:solid;background:rgba(34,197,94,.08);
}
.screenshot-upload .icon{ font-size:34px;margin-bottom:8px; }
.screenshot-upload p{ margin:6px 0 0;color:var(--muted);font-weight:800;font-size:13px; }
.screenshot-preview{
  display:none;margin-top:8px;border-radius:10px;overflow:hidden;
  box-shadow:0 5px 15px rgba(0,0,0,0.35);
}
.screenshot-preview.show{ display:block; }
.screenshot-preview img{
  width:100%;max-height:180px;object-fit:contain;background:#0b1020;
}
.file-input-hidden{ display:none; }

.payment-confirm-btn{
  width:100%;padding:12px;font-size:16px;font-weight:900;border-radius:12px;margin-top:10px;
  position:sticky;bottom:0;background:linear-gradient(135deg,var(--primary-1),var(--primary-2));
  color:#052e16;border:none;cursor:pointer;
}

/* Modal responsive */
@media (max-width:520px){
  .pay-grid{ grid-template-columns:1fr; }
}

/* =========================
   FOOTER (Dark Pro)
   ========================= */
.site-footer{
  background:var(--panel);
  border:1px solid var(--border);
  border-radius:18px;padding:22px 18px;margin-top:18px;
  box-shadow:0 12px 30px rgba(0,0,0,.35);
}
.site-footer .footer-content{
  display:grid;grid-template-columns:repeat(3,1fr);gap:18px;align-items:start;
}
.site-footer .footer-section h3{
  margin:0 0 10px 0;color:var(--accent-1);font-size:17px;font-weight:900;
}
.site-footer .footer-item{
  display:flex;align-items:center;gap:8px;margin:6px 0;color:var(--text);
  font-size:14.5px;font-weight:800;line-height:1.7;
}
.site-footer .footer-icon{
  width:24px;height:24px;border-radius:8px;display:grid;place-items:center;
  background:rgba(96,165,250,.12);font-size:14px;flex:0 0 auto;
}
.site-footer .payment-badge{
  background:linear-gradient(135deg,var(--accent-1),var(--accent-2));
  color:#fff;padding:6px 10px;border-radius:999px;font-size:12.5px;font-weight:900;
}
.site-footer .footer-note{
  margin-top:8px;font-size:12.5px;font-weight:900;color:#bbf7d0;
}
.site-footer .footer-divider{
  margin-top:14px;width:100%;height:0;border-top:1px solid var(--border);
}
.site-footer .footer-bottom{
  margin-top:10px;text-align:center;
}
.site-footer .footer-bottom p{
  margin:0;font-size:13.5px;font-weight:900;color:var(--muted);line-height:1.7;opacity:.95;
}

/* footer responsive */
@media (max-width:900px){
  .site-footer .footer-content{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:520px){
  .site-footer{ padding:18px 14px;border-radius:16px; }
  .site-footer .footer-content{ grid-template-columns:1fr;gap:14px; }
}

/* =========================================================
   Responsive fixes
   ========================================================= */
@media (max-width:767px){
  .w-form-grid{ grid-template-columns:1fr; }
}

/* prevent iOS zoom */
input, select, textarea{ font-size:16px !important; }

/* =========================
   SPLASH / PRELOADER (Dark Pro)
   ========================= */
.splash{
  position:fixed;inset:0;z-index:9999;
  background:linear-gradient(135deg,#0f172a,#0b1220);
  display:grid;place-items:center;transition:opacity .4s ease, visibility .4s ease;
}
.splash.hide{ opacity:0; visibility:hidden; }
.splash-inner{ text-align:center; padding:20px; }
.splash-logo{
  width:clamp(110px,24vw,180px);height:auto;display:block;margin:0 auto 12px auto;
  filter:drop-shadow(0 10px 30px rgba(0,0,0,.55));
}
.splash-text{
  color:#fff;font-weight:900;font-size:clamp(15px,4vw,20px);letter-spacing:.5px;margin-bottom:8px;
}
.splash-dots{ display:inline-flex;gap:6px; }
.splash-dots span{
  width:8px;height:8px;background:rgba(255,255,255,.9);border-radius:999px;
  animation:splashBounce 1s infinite ease-in-out;
}
.splash-dots span:nth-child(2){ animation-delay:.15s; }
.splash-dots span:nth-child(3){ animation-delay:.3s; }
@keyframes splashBounce{
  0%,80%,100%{ transform:translateY(0); opacity:.6; }
  40%{ transform:translateY(-8px); opacity:1; }
}

/* ✅ success modal */
.success-modal{
  position:fixed;inset:0;background:rgba(0,0,0,.55);display:none;align-items:center;justify-content:center;
  z-index:5000;padding:20px;
}
.success-modal.active{ display:flex; }
.success-box{
  width:min(420px,92vw);background:var(--panel);color:var(--text);
  border-radius:18px;padding:20px 18px;text-align:center;
  box-shadow:0 15px 50px rgba(0,0,0,.55);border:1px solid var(--border);
}
.success-check{ font-size:42px;margin-bottom:6px; }
.success-box h3{ font-size:18px;font-weight:900;margin:4px 0 8px; }
.success-box p{ font-size:14px;color:var(--muted);line-height:1.8;white-space:pre-line;font-weight:800; }
.success-btn{
  margin-top:12px;width:100%;padding:11px 16px;border:0;border-radius:12px;font-weight:900;cursor:pointer;
  background:linear-gradient(135deg,var(--primary-1),var(--primary-2));color:#052e16;
}
/* ✅ FIX wizard steps for phones */
@media (max-width: 560px){

  .wizard-steps{
    display:grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap:8px !important;
    justify-items: stretch;
    align-items: center;
    margin-top: 8px;
  }

  .w-step{
    width:100% !important;
    justify-content:center !important;
    text-align:center;
    font-size:11.5px !important;
    padding:8px 6px !important;
    white-space:nowrap;          /* ✅ မပေါက်မဖောက် */
    border-radius:14px !important; /* pill အစား rounded button */
  }

  /* active step လည်း width မရွံ့စေ */
  .w-step.active{
    transform:none !important;
  }
}