/* ===== TRY NOW ===== */
.try-now-page { background:#f7f9fc; }
.try-now-hero { min-height:calc(100vh - 72px); padding:120px 0 72px; overflow:hidden; position:relative; }
.try-now-hero::before { content:""; position:absolute; width:620px; height:620px; border-radius:50%; left:-280px; top:70px; background:radial-gradient(circle, rgba(47,128,237,.13), transparent 68%); pointer-events:none; }
.try-now-hero::after { content:""; position:absolute; width:560px; height:560px; border-radius:50%; right:-250px; bottom:-240px; background:radial-gradient(circle, rgba(29,185,166,.12), transparent 70%); pointer-events:none; }
.try-now-shell { width:min(1180px, calc(100% - 48px)); margin:0 auto; display:grid; grid-template-columns:minmax(0,.95fr) minmax(480px,1.05fr); gap:64px; align-items:center; position:relative; z-index:1; }
.try-now-story { padding:12px 0; }
.try-now-eyebrow { display:inline-flex; padding:8px 13px; border-radius:999px; background:#fff; border:1px solid var(--border); color:var(--secondary); font-size:11px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; box-shadow:var(--shadow-sm); }
.try-now-story h1 { font-size:clamp(2.2rem,4.2vw,4rem); line-height:1.08; letter-spacing:-.045em; max-width:650px; margin:26px 0 20px; color:var(--primary); }
.try-now-story > p { max-width:610px; font-size:16px; line-height:1.75; color:var(--text-muted); }
.try-now-solution-wrap {
  width:100%;
  max-width:620px;
  margin:0 auto 12px;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
}
.try-now-solution-scene {
  width:min(100%,620px);
  margin:0 auto;
}
.try-now-solution-scene .solution-node { cursor:default; }
.float-a { top:30px; left:4%; }.float-b { right:4%; top:90px; animation-delay:.8s; }.float-c { left:15%; bottom:20px; animation-delay:1.5s; }
.try-now-points { display:flex; flex-wrap:wrap; gap:8px; margin-top:25px; }
.try-now-points span { font-size:12px; color:#475467; background:#fff; border:1px solid var(--border); padding:8px 11px; border-radius:999px; }
.try-now-card { background:#fff; border:1px solid rgba(16,24,40,.08); border-radius:28px; padding:34px; box-shadow:0 30px 80px rgba(16,24,40,.12); position:relative; overflow:hidden; }
.try-now-card::before { content:""; position:absolute; width:180px; height:180px; right:-80px; top:-90px; border-radius:50%; background:rgba(47,128,237,.08); }
.try-now-form-head { position:relative; z-index:1; margin-bottom:24px; }
.try-now-step { font-size:11px; font-weight:800; color:var(--secondary); letter-spacing:.08em; }
.try-now-form-head h2 { margin:8px 0 9px; font-size:28px; line-height:1.15; letter-spacing:-.025em; }
.try-now-form-head p { margin:0; color:var(--text-muted); line-height:1.6; font-size:13px; max-width:560px; }
.try-now-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.try-now-form-grid .full-width { grid-column:1/-1; }
.try-now-card .form-group label { display:block; margin-bottom:7px; font-size:12px; font-weight:700; color:var(--primary); }
.try-now-card input, .try-now-card select, .try-now-card textarea { width:100%; border:1px solid #dfe3ea; border-radius:12px; background:#fbfcfe; padding:12px 13px; font:inherit; font-size:13px; color:var(--text); outline:none; transition:border-color .25s ease,box-shadow .25s ease,background .25s ease,transform .25s ease; }
.try-now-card textarea { resize:vertical; min-height:104px; }
.try-now-card input:focus, .try-now-card select:focus, .try-now-card textarea:focus { border-color:var(--secondary); background:#fff; box-shadow:0 0 0 4px rgba(47,128,237,.10); transform:translateY(-1px); }
.try-now-card .form-group.has-error input, .try-now-card .form-group.has-error select, .try-now-card .form-group.has-error textarea { border-color:var(--error); }
.try-now-card .form-error-msg { display:block; min-height:15px; margin-top:4px; font-size:11px; color:var(--error); }
.try-now-submit { width:100%; justify-content:center; margin-top:6px; position:relative; overflow:hidden; }
.try-now-submit::after { content:""; position:absolute; top:0; left:-80%; width:55%; height:100%; transform:skewX(-18deg); background:rgba(255,255,255,.22); animation:tryNowShine 3.8s ease-in-out infinite; }
.try-now-privacy { margin:13px 0 0; text-align:center; font-size:10px; color:var(--text-faint); }
.try-now-honeypot { position:absolute!important; left:-9999px!important; width:1px!important; height:1px!important; opacity:0!important; pointer-events:none!important; }
.try-now-card .form-status { margin-top:15px; }
@keyframes tryNowFloat { 0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)} }
@keyframes tryNowOrbit { from{transform:rotate(0deg) rotate(-12deg)} to{transform:rotate(360deg) rotate(-12deg)} }
@keyframes tryNowShine { 0%,58%{left:-80%} 78%,100%{left:135%} }
@media(max-width:1000px){
 .try-now-hero{padding:104px 0 56px}.try-now-shell{grid-template-columns:1fr;max-width:760px;gap:38px}.try-now-story{text-align:center}.try-now-story h1{margin-left:auto;margin-right:auto}.try-now-story>p{margin-left:auto;margin-right:auto}.try-now-points{justify-content:center}.try-now-card{max-width:700px;margin:0 auto;width:100%}
}
@media(max-width:600px){
 .try-now-hero{padding:92px 0 36px}.try-now-shell{width:min(100% - 28px,520px);gap:22px}.try-now-eyebrow{font-size:9px}try-now-story h1{font-size:2.25rem;margin-top:20px}.try-now-story>p{font-size:13px;line-height:1.65}.try-now-points span{font-size:10px}.try-now-card{padding:22px 18px;border-radius:22px}.try-now-form-head h2{font-size:23px}.try-now-form-grid{grid-template-columns:1fr;gap:12px}.try-now-form-grid .full-width{grid-column:auto}.try-now-card input,.try-now-card select,.try-now-card textarea{font-size:16px;min-height:48px}.try-now-card textarea{min-height:120px}.try-now-submit{min-height:52px}.try-now-privacy{font-size:9px}
}
@media(max-width:600px){
 .try-now-solution-wrap{max-width:390px;margin-top:2px;margin-bottom:4px}
 .try-now-solution-scene{max-width:390px}
}
@media(prefers-reduced-motion:reduce){.try-now-orbit,.try-now-float,.try-now-submit::after{animation:none!important}.try-now-card input,.try-now-card select,.try-now-card textarea{transition:none!important}}

/* ===== CONFIRMATION MODAL (shown after a successful "Coba Sekarang" submit) ===== */
.cefat-modal-overlay {
  position: fixed; inset: 0; z-index: var(--z-modal, 200);
  display: flex; align-items: center; justify-content: center;
  padding: 20px;
  background: rgba(16,24,40,.55);
  backdrop-filter: blur(3px);
  opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity .28s var(--ease-out);
}
.cefat-modal-overlay.is-open { opacity: 1; visibility: visible; pointer-events: auto; }
.cefat-modal {
  position: relative;
  width: 100%; max-width: 440px;
  background: #fff;
  border-radius: 24px;
  padding: 36px 32px 28px;
  text-align: center;
  box-shadow: 0 40px 90px rgba(16,24,40,.28);
  transform: translateY(18px) scale(.97);
  opacity: 0;
  transition: transform .32s var(--ease-out), opacity .32s var(--ease-out);
}
.cefat-modal-overlay.is-open .cefat-modal { transform: translateY(0) scale(1); opacity: 1; }
.cefat-modal-close {
  position: absolute; top: 14px; right: 14px;
  width: 32px; height: 32px; border-radius: 50%;
  border: 1px solid var(--border); background: #fff;
  font-size: 20px; line-height: 1; color: var(--text-muted);
  cursor: pointer; display: grid; place-items: center;
  transition: background .2s ease, color .2s ease;
}
.cefat-modal-close:hover { background: var(--surface-alt); color: var(--primary); }
.cefat-modal-icon {
  width: 64px; height: 64px; margin: 0 auto 16px;
  border-radius: 50%; display: grid; place-items: center;
  font-size: 30px;
  background: var(--accent-soft);
}
.cefat-modal h3 { font-size: 20px; line-height: 1.3; margin-bottom: 10px; }
.cefat-modal p { font-size: 13.5px; line-height: 1.65; color: var(--text-muted); }
.cefat-modal-steps {
  list-style: none; margin: 20px 0 0; padding: 16px;
  background: var(--surface-alt); border-radius: 16px;
  text-align: left; display: flex; flex-direction: column; gap: 10px;
}
.cefat-modal-steps li {
  display: flex; align-items: flex-start; gap: 10px;
  font-size: 12.5px; color: var(--text); line-height: 1.5;
}
.cefat-modal-steps li span {
  flex-shrink: 0; width: 20px; height: 20px; border-radius: 50%;
  background: var(--secondary); color: #fff; font-size: 11px; font-weight: 800;
  display: grid; place-items: center; margin-top: 1px;
}
.cefat-modal-actions {
  display: flex; flex-direction: column; gap: 10px;
  margin-top: 24px;
}
.cefat-modal-actions .btn { width: 100%; }
@media (max-width: 480px) {
  .cefat-modal { padding: 30px 22px 24px; border-radius: 20px; }
}
