/* =========================================================
   PRA REGISTER CSS (FULL) - FAST MODE (ANTI LAG TYPING)
   Target: input super ringan, tetap rapi & premium sederhana
========================================================= */

* { font-family: 'Outfit', sans-serif; }
.display-font { font-family: 'Space Grotesk', sans-serif; }

html, body { height: 100%; }
body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

/* =========================================================
   ✅ FAST MODE DEFAULT: MATIKAN LAYER BERAT
   (Particles + Grid + Shine + Animasi background)
========================================================= */
.particles, .grid-pattern { display: none !important; }

/* Background tetap bagus tapi TANPA animasi */
.mega-bg{
  position: relative;
  min-height: 100vh;
  overflow-x: hidden;
  width: 100%;
  background:
    radial-gradient(ellipse at 15% 25%, rgba(147, 197, 253, 0.22) 0%, transparent 55%),
    radial-gradient(ellipse at 85% 75%, rgba(191, 219, 254, 0.22) 0%, transparent 55%),
    linear-gradient(135deg, #e0f2fe 0%, #bae6fd 35%, #93c5fd 60%, #dbeafe 100%);
}

/* =========================================================
   HERO HEADER (tanpa shine animasi)
========================================================= */
.hero-header{
  background: linear-gradient(135deg, #bfdbfe 0%, #93c5fd 35%, #60a5fa 65%, #dbeafe 100%);
  border-top: 6px solid #60a5fa;
  box-shadow: 0 10px 22px rgba(2,6,23,.10);
  position: relative;
  overflow: hidden;
}

/* pastikan tidak ada overlay animasi */
.hero-header::before{ display:none !important; }

/* hero pill tanpa blur */
.hero-pill{
  background: rgba(0,0,0,.28);
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.hero-pill-text{ font-size:.875rem; letter-spacing:.05em; }
.hero-title{ color:#0f172a; letter-spacing:-.02em; text-shadow:none; }
.hero-subtitle{ color:#334155; text-shadow:none; }

/* =========================================================
   CARD: hapus backdrop-filter (paling terasa saat ngetik)
========================================================= */
.mega-glass{
  background: rgba(255,255,255,.97);
  border: 1px solid rgba(148,163,184,.30);
  box-shadow: 0 10px 22px rgba(2,6,23,.10);
  position: relative;
  overflow: hidden;
}
.mega-glass::before{ display:none !important; }

.icon-badge{
  width:92px; height:92px;
  display:inline-flex;
  align-items:center; justify-content:center;
  border-radius: 18px;
  background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
  box-shadow: 0 10px 22px rgba(59,130,246,.25);
}
.icon-emoji{ font-size:3rem; }

.info-box{
  background: rgba(59,130,246,.08);
  border: 1px solid rgba(59,130,246,.18);
}
.info-emoji{ font-size:2rem; flex-shrink:0; }
.info-title{ color:#0f172a; font-size:1.05rem; }
.info-text{ color:#475569; font-size:.95rem; line-height:1.65; }

.label-strong{ color:#0f172a; }

/* =========================================================
   INPUT: paling penting biar ngetik halus
   - hilangkan shadow besar
   - hilangkan transition berat
========================================================= */
.input-soft{
  border: 1px solid rgba(148,163,184,.45) !important;
  background: #ffffff !important;
  padding: 1rem 1.1rem !important;
  transition: border-color .12s ease !important; /* kecil & ringan */
}

/* Focus super ringan */
.form-control:focus{
  border-color:#3b82f6 !important;
  box-shadow: 0 0 0 .18rem rgba(59,130,246,.10) !important;
}

/* =========================================================
   UPLOAD: hilangkan transform (repaint)
========================================================= */
.upload-area{
  border: 2px dashed rgba(148,163,184,.55);
  background: rgba(255,255,255,.78);
  transition: border-color .12s ease, background-color .12s ease;
  cursor:pointer;
}
.upload-area:hover{
  border-color: rgba(59, 130, 246, .75);
  background: rgba(219, 234, 254, .55);
  transform: none !important;
}
.upload-area.dragover{
  border-color:#3b82f6;
  background: rgba(147, 197, 253, .18);
  transform: none !important;
}
.upload-emoji{ font-size:3.4rem; }
.upload-title{ color:#0f172a; font-size:1.25rem; }

.file-preview{
  background: rgba(16,185,129,.08);
  border: 1px solid rgba(16,185,129,.22);
}

/* =========================================================
   BUTTON: tetap cakep, tapi ringan
========================================================= */
.btn-mega{
  background: linear-gradient(135deg, #60a5fa 0%, #3b82f6 50%, #2563eb 100%);
  color: #fff !important;
  border: none !important;
  box-shadow: 0 10px 22px rgba(59,130,246,.20);
  transition: filter .12s ease, transform .12s ease;
}
.btn-mega:hover{
  filter: brightness(1.02);
  transform: translateY(-1px);
}
.btn-mega:disabled{ opacity:.7; transform:none; cursor:not-allowed; }
.btn-mega::before{ display:none !important; }
.btn-ico{ font-size:1.35rem; }

/* =========================================================
   SUCCESS
========================================================= */
.success-message{
  background: rgba(16,185,129,.08);
  border: 1px solid rgba(16,185,129,.22);
}
.success-emoji{ font-size:4.2rem; }
.success-title{ color:#0f172a; }
.success-summary{ background: rgba(255,255,255,.95); }
.summary-title{ color:#0f172a; font-size:1.02rem; }
.summary-text{ color:#334155; }

/* =========================================================
   ✅ MODE "SEDANG MENGETIK"
   Saat input fokus, matikan semua transition (super halus)
========================================================= */
html.is-typing *{
  transition: none !important;
  animation: none !important;
  scroll-behavior: auto !important;
}