/* Formulir pendaftaran Certiva */
.cv-wrap{
	--cv-warna:#1f4e79;
	--cv-garis:#e2e7ee;
	--cv-garis-kuat:#cfd6e0;
	--cv-teks:#1b2430;
	--cv-teks-2:#5c6875;
	--cv-teks-3:#8a94a1;
	--cv-latar:#ffffff;
	--cv-latar-2:#f7f9fc;
	--cv-font:inherit;
	--cv-radius:14px;
	max-width:760px;margin:0 auto;
	font-family:var(--cv-font);font-size:15px;line-height:1.55;color:var(--cv-teks);
}
.cv-wrap *{box-sizing:border-box}
.cv-wrap input,.cv-wrap select,.cv-wrap textarea,.cv-wrap button{font-family:inherit}

.cv-judul{margin:0 0 18px;font-size:22px;font-weight:700;letter-spacing:-.02em}

/* ---------- Kartu formulir ---------- */
.cv-form{
	background:var(--cv-latar);
	border:1px solid var(--cv-garis);
	border-radius:var(--cv-radius);
	padding:26px;
	box-shadow:0 1px 2px rgba(20,32,48,.04), 0 12px 32px -20px rgba(20,32,48,.25);
}
.cv-form-judul{
	margin:0 0 22px;font-size:20px;font-weight:700;letter-spacing:-.02em;line-height:1.3;
}

/* ---------- Seksi ---------- */
.cv-seksi{
	display:flex;align-items:center;gap:9px;
	font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
	color:var(--cv-teks-3);
	margin:26px 0 14px;padding-bottom:9px;
	border-bottom:1px solid var(--cv-garis);
}
.cv-seksi::before{
	content:"";width:3px;height:13px;border-radius:2px;background:var(--cv-warna);flex:none;
}
.cv-seksi:first-of-type{margin-top:0}
.cv-opsional{
	text-transform:none;letter-spacing:0;font-weight:500;font-size:11.5px;color:var(--cv-teks-3);
}

/* ---------- Kolom isian ---------- */
.cv-grid{display:flex;flex-wrap:wrap;gap:15px}
.cv-field{display:flex;flex-direction:column;min-width:0}
.cv-full{width:100%}
.cv-half{width:calc(50% - 7.5px)}

.cv-field label{font-size:13.5px;font-weight:600;margin-bottom:7px;color:var(--cv-teks)}
.cv-wajib{color:#d13b30;margin-left:1px}
.cv-field small{font-size:12px;color:var(--cv-teks-3);margin-top:6px;line-height:1.5}

.cv-field input[type=text],
.cv-field input[type=email],
.cv-field input[type=tel],
.cv-field input[type=number],
.cv-field input[type=date],
.cv-field select,
.cv-field textarea{
	width:100%;min-height:46px;padding:12px 14px;
	border:1px solid var(--cv-garis-kuat);border-radius:10px;
	font-size:15px;color:inherit;background:var(--cv-latar);
	transition:border-color .14s,box-shadow .14s,background-color .14s;
	-webkit-appearance:none;appearance:none;
}
.cv-field textarea{min-height:92px;resize:vertical}

.cv-field select{
	cursor:pointer;padding-right:40px;
	background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' stroke='%238a94a1' stroke-width='1.8' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat:no-repeat;background-position:right 15px center;
}

.cv-field input:hover,.cv-field select:hover,.cv-field textarea:hover{border-color:#b6c0cc}
.cv-field input:focus,.cv-field select:focus,.cv-field textarea:focus{
	outline:0;border-color:var(--cv-warna);background:var(--cv-latar);
	box-shadow:0 0 0 3.5px color-mix(in srgb, var(--cv-warna) 16%, transparent);
}
.cv-field.cv-salah input,.cv-field.cv-salah select,.cv-field.cv-salah textarea{
	border-color:#d13b30;background:#fff6f5;
}

.cv-pilihan{display:flex;flex-wrap:wrap;gap:10px 20px;padding-top:2px}
.cv-pilihan-item{
	display:flex;align-items:center;gap:9px;font-weight:400;font-size:14.5px;
	margin:0;cursor:pointer;min-height:32px;
}
.cv-pilihan-item input{margin:0;width:19px;height:19px;accent-color:var(--cv-warna)}

/* ---------- Voucher ---------- */
.cv-voucher{display:flex;gap:10px}
.cv-voucher-input{
	flex:1;min-width:0;min-height:46px;padding:12px 14px;
	border:1px dashed var(--cv-garis-kuat);border-radius:10px;background:var(--cv-latar-2);
	font-size:15px;text-transform:uppercase;letter-spacing:.08em;font-weight:600;
	transition:border-color .14s,background-color .14s,box-shadow .14s;
}
.cv-voucher-input::placeholder{font-weight:400;letter-spacing:0;text-transform:none}
.cv-voucher-input:focus{
	outline:0;border-style:solid;border-color:var(--cv-warna);background:var(--cv-latar);
	box-shadow:0 0 0 3.5px color-mix(in srgb, var(--cv-warna) 16%, transparent);
}
.cv-voucher-btn{
	min-height:46px;padding:0 22px;
	border:1px solid var(--cv-warna);background:transparent;color:var(--cv-warna);
	border-radius:10px;font-size:14.5px;font-weight:700;cursor:pointer;white-space:nowrap;
	transition:background-color .14s,color .14s;
}
.cv-voucher-btn:hover:not(:disabled){background:var(--cv-warna);color:#fff}
.cv-voucher-btn:disabled{opacity:.55;cursor:default}

.cv-voucher-pesan{
	margin-top:10px;font-size:13.5px;font-weight:500;padding:11px 14px;border-radius:10px;
	display:flex;align-items:flex-start;gap:8px;
}
.cv-voucher-pesan.cv-ok,.cv-pesan.cv-ok{background:#e9f6ec;color:#216b32;border:1px solid #bfe3c8}
.cv-voucher-pesan.cv-err,.cv-pesan.cv-err{background:#fdecea;color:#b02d22;border:1px solid #f3c2bd}

.cv-pesan{margin-bottom:18px;font-size:14px;padding:12px 15px;border-radius:10px;font-weight:500}

/* ---------- Ringkasan ---------- */
.cv-ringkasan{
	margin-top:24px;padding:18px 20px;border-radius:12px;
	background:var(--cv-latar-2);border:1px solid var(--cv-garis);
}
.cv-baris{
	display:flex;justify-content:space-between;align-items:baseline;gap:14px;
	padding:6px 0;font-size:14.5px;color:var(--cv-teks-2);
}
.cv-baris b{font-variant-numeric:tabular-nums;color:var(--cv-teks);font-weight:600}
.cv-baris-diskon,.cv-baris-diskon b{color:#2e7d32}
.cv-baris-total{
	border-top:1px solid var(--cv-garis-kuat);margin-top:8px;padding-top:14px;
	font-size:15px;color:var(--cv-teks);font-weight:600;
}
.cv-baris-total b{font-size:24px;font-weight:800;letter-spacing:-.025em;color:var(--cv-warna)}
.cv-kode{font-style:normal;color:var(--cv-teks-3);font-size:13px}

.cv-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ---------- Tombol kirim ---------- */
.cv-submit{
	margin-top:22px;width:100%;min-height:54px;padding:15px 20px;
	background:var(--cv-warna);color:#fff;border:0;border-radius:11px;
	font-size:16.5px;font-weight:700;cursor:pointer;
	transition:filter .14s,transform .06s;
}
.cv-submit:hover:not(:disabled){filter:brightness(1.08)}
.cv-submit:active:not(:disabled){transform:translateY(1px)}
.cv-submit:disabled{opacity:.6;cursor:default}

/* ---------- Bilah melayang di layar kecil ---------- */
.cv-bar-mobil{display:none}

/* ---------- Layar sukses ---------- */
.cv-sukses{
	background:var(--cv-latar);border:1px solid #bfe3c8;border-radius:var(--cv-radius);
	padding:40px 26px;text-align:center;
	box-shadow:0 1px 2px rgba(20,32,48,.04), 0 12px 32px -20px rgba(20,32,48,.25);
}
.cv-sukses-ikon{
	width:62px;height:62px;line-height:62px;margin:0 auto 16px;border-radius:50%;
	background:#e9f6ec;color:#2e7d32;font-size:30px;border:1px solid #bfe3c8;
}
.cv-sukses h3{margin:0 0 10px;font-size:21px;font-weight:700;letter-spacing:-.02em;color:#216b32}
.cv-sukses-teks{margin:0 auto 22px;max-width:44ch;color:var(--cv-teks-2);font-size:14.5px}
.cv-sukses-aksi{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.cv-sukses-aksi a{
	display:inline-flex;align-items:center;justify-content:center;
	min-height:46px;padding:0 24px;border-radius:10px;
	text-decoration:none;font-size:14.5px;font-weight:600;
}
.cv-lihat-invoice{background:var(--cv-warna);color:#fff}
.cv-lihat-invoice:hover{filter:brightness(1.08);color:#fff}
.cv-unduh-pdf{border:1px solid var(--cv-warna);color:var(--cv-warna)}
.cv-unduh-pdf:hover{background:var(--cv-warna);color:#fff}

.cv-kosong{
	padding:24px;background:#fff8e6;border:1px solid #f2d79b;border-radius:12px;
	color:#8a6320;text-align:center;
}

.cv-wrap :focus-visible{outline:2px solid var(--cv-warna);outline-offset:2px}

/* =====================================================================
 * Layar kecil
 * ===================================================================== */
@media (max-width:720px){
	.cv-wrap{
		font-size:15px;
		/* Ruang untuk bilah melayang di bawah. */
		padding-bottom:calc(84px + env(safe-area-inset-bottom, 0px));
	}

	.cv-form{
		padding:20px 17px;border-radius:13px;
		box-shadow:0 1px 2px rgba(20,32,48,.05);
	}
	.cv-form-judul{font-size:18.5px;margin-bottom:18px}
	.cv-half{width:100%}
	.cv-grid{gap:14px}
	.cv-seksi{margin:22px 0 13px}

	/* 16px mencegah Safari iOS memperbesar halaman saat kolom disentuh. */
	.cv-field input[type=text],
	.cv-field input[type=email],
	.cv-field input[type=tel],
	.cv-field input[type=number],
	.cv-field input[type=date],
	.cv-field select,
	.cv-field textarea,
	.cv-voucher-input{
		font-size:16px;min-height:50px;border-radius:11px;
	}

	.cv-voucher{flex-direction:column}
	.cv-voucher-btn{width:100%;min-height:48px}

	.cv-ringkasan{padding:16px 17px}
	.cv-baris-total b{font-size:22px}

	/* Tombol utama pindah ke bilah melayang. */
	.cv-submit{display:none}

	.cv-bar-mobil{
		display:flex;align-items:center;gap:12px;
		position:fixed;left:0;right:0;bottom:0;z-index:999;
		padding:10px 14px;
		padding-bottom:calc(10px + env(safe-area-inset-bottom, 0px));
		background:rgba(255,255,255,.94);
		border-top:1px solid var(--cv-garis);
		box-shadow:0 -6px 24px -12px rgba(20,32,48,.3);
	}
	@supports (backdrop-filter:blur(10px)){
		.cv-bar-mobil{backdrop-filter:saturate(150%) blur(10px)}
	}
	.cv-bar-info{display:flex;flex-direction:column;min-width:0;flex:1}
	.cv-bar-info span{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--cv-teks-3)}
	.cv-bar-info b{
		font-size:19px;font-weight:800;letter-spacing:-.02em;color:var(--cv-warna);
		font-variant-numeric:tabular-nums;line-height:1.25;
		overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
	}
	.cv-bar-tombol{
		flex:none;min-height:50px;padding:0 24px;
		background:var(--cv-warna);color:#fff;border:0;border-radius:11px;
		font-size:15.5px;font-weight:700;cursor:pointer;
	}
	.cv-bar-tombol:active:not(:disabled){transform:translateY(1px)}
	.cv-bar-tombol:disabled{opacity:.6}

	.cv-sukses{padding:32px 18px}
	.cv-sukses-aksi a{width:100%}
}

@media (max-width:380px){
	.cv-form{padding:17px 14px}
	.cv-bar-tombol{padding:0 18px;font-size:15px}
}

@media (prefers-reduced-motion: reduce){
	.cv-wrap *{transition:none !important}
}