:root { color-scheme: light; }
body { font-family: 'Plus Jakarta Sans', sans-serif; }

[data-reveal] { opacity: 0; transform: translateY(18px); transition: opacity .7s ease, transform .7s ease; }
[data-reveal].is-visible { opacity: 1; transform: translateY(0); }

.mesh-bg {
	background:
		radial-gradient(circle at 14% 18%, rgba(94, 230, 179, .15), transparent 26%),
		radial-gradient(circle at 88% 16%, rgba(20, 125, 255, .28), transparent 30%),
		radial-gradient(circle at 70% 92%, rgba(62, 156, 255, .16), transparent 28%),
		linear-gradient(135deg, #0A347D 0%, #082A69 46%, #051A48 100%);
}

.dot-grid {
	background-image: radial-gradient(rgba(125, 234, 193, .16) 1px, transparent 1px);
	background-size: 20px 20px;
}

.range-progress {
	background: linear-gradient(to right, #155DEB 0%, #155DEB var(--value), #D9E2F0 var(--value), #D9E2F0 100%);
}

input[type="range"] { appearance: none; height: 8px; border-radius: 999px; }
input[type="range"]::-webkit-slider-thumb {
	appearance: none; width: 24px; height: 24px; border-radius: 50%; background: #fff;
	border: 6px solid #155DEB; box-shadow: 0 3px 12px rgba(21,93,235,.28); cursor: pointer;
}
input[type="range"]::-moz-range-thumb {
	width: 14px; height: 14px; border-radius: 50%; background: #fff;
	border: 6px solid #155DEB; box-shadow: 0 3px 12px rgba(21,93,235,.28); cursor: pointer;
}

details[open] summary .faq-icon { transform: rotate(45deg); }

.btn-loading .btn-label::after { content: '...'; }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
	[data-reveal] { opacity: 1; transform: none; }
}

.custom-logo-link img,
#site-header .custom-logo {
    max-height: 48px;
    width: auto;
}

.number-outline {
	color: transparent;
	-webkit-text-stroke: 2px rgba(21, 93, 235, .12);
	text-stroke: 2px rgba(21, 93, 235, .12);
}

/* ===== Hero stat card hover ===== */
#home .hero-stat-card {
	background: linear-gradient(155deg, rgba(24, 78, 167, .56), rgba(10, 48, 120, .46));
	border-color: rgba(125, 186, 255, .28);
	box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 14px 34px rgba(3, 19, 58, .14);
	transition: transform .2s ease, border-color .2s ease;
}
#home .hero-stat-card:hover {
	border-color: rgba(94, 230, 179, .42);
	transform: translateY(-2px);
}

/* ===== Dark lead form (hero & form kedua) ===== */
.dark-lead-form {
	background:
		radial-gradient(circle at 82% 2%, rgba(62,156,255,.18), transparent 34%),
		linear-gradient(145deg, rgba(19, 67, 151, .94), rgba(8, 42, 105, .96)) !important;
	border-color: rgba(141, 187, 255, .30) !important;
	box-shadow: 0 28px 80px rgba(3, 18, 55, .34), inset 0 1px 0 rgba(255,255,255,.05) !important;
}
.dark-lead-form select { color-scheme: dark; }
.dark-lead-form select option { background: #061E50; color: #F4F8FF; }
.dark-lead-form input:not([type="checkbox"]),
.dark-lead-form select {
	background: rgba(5, 35, 91, .62) !important;
	border-color: rgba(147, 190, 255, .32) !important;
	color: #F4F8FF !important;
}
.dark-lead-form input:not([type="checkbox"]):focus,
.dark-lead-form select:focus {
	border-color: #5EE6B3 !important;
	box-shadow: 0 0 0 4px rgba(94,230,179,.15) !important;
}
.dark-lead-form label:has(input[type="checkbox"]) {
	background: rgba(5, 35, 91, .42) !important;
	border-color: rgba(147, 190, 255, .22) !important;
}
.dark-lead-form input:-webkit-autofill,
.dark-lead-form input:-webkit-autofill:hover,
.dark-lead-form input:-webkit-autofill:focus {
	-webkit-text-fill-color: #F4F8FF;
	-webkit-box-shadow: 0 0 0 1000px #061E50 inset;
	transition: background-color 9999s ease-in-out 0s;
}
.dark-lead-form button[type="submit"] {
	background: linear-gradient(90deg, #5EE6B3 0%, #72E9BC 100%) !important
	color: #051A48 !important;
	box-shadow: 0 14px 34px rgba(85, 227, 174, .20) !important;
}
.dark-lead-form button[type="submit"]:not(:disabled):hover {
	background: linear-gradient(90deg, #7DEAC1 0%, #91EFCB 100%) !important;
	color: #051A48 !important;
}

/* ===== Benefit icon line-art (dipakai di section Keunggulan) ===== */
.benefit-icon-shell {
	background:
		radial-gradient(circle at 50% 42%, rgba(94, 230, 179, .13), transparent 38%),
		linear-gradient(180deg, rgba(255,255,255,.98), rgba(246,249,252,.96));
}
.benefit-icon-svg {
	width: 118px; height: 118px; overflow: visible;
	filter: drop-shadow(0 8px 18px rgba(3, 39, 67, .08));
	transition: transform .3s ease;
}
.group:hover .benefit-icon-svg { transform: translateY(-2px) scale(1.035); }
.benefit-icon-svg .line-main   { fill: none; stroke: #147DFF; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.benefit-icon-svg .line-dark   { fill: none; stroke: #123D8E; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.benefit-icon-svg .line-accent { fill: none; stroke: #5EE6B3; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.benefit-icon-svg .line-mantis { fill: none; stroke: #3E9CFF; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.benefit-icon-svg .soft-blue   { fill: #EDF6FF; }
.benefit-icon-svg .soft-orange { fill: #ECFFF8; }
.benefit-icon-svg .soft-mantis { fill: #ECFFF8; }

/* ===== Responsive content carousels (success-stories & testimonials) ===== */
.content-carousel-viewport { overflow: hidden; padding: 6px 2px 22px; }
.content-carousel-track {
	display: flex; gap: 1.25rem; align-items: stretch;
	transition: transform .5s cubic-bezier(.22, .61, .36, 1);
	will-change: transform; touch-action: pan-y;
}
.content-carousel-slide { display: flex; flex: 0 0 100%; min-width: 0; }
.content-carousel-slide > article { width: 100%; }
.content-carousel-button {
	position: absolute; top: 50%; z-index: 10;
	display: grid; width: 46px; height: 46px; place-items: center;
	border: 1px solid rgba(203, 213, 225, .95); border-radius: 999px;
	background: rgba(255, 255, 255, .96); color: #123D8E;
	box-shadow: 0 12px 34px rgba(8, 36, 93, .18);
	transform: translateY(-50%);
	transition: transform .2s ease, background-color .2s ease, color .2s ease, opacity .2s ease;
}
.content-carousel-button:hover:not(:disabled) {
	background: #5EE6B3 !important; color: #051A48 !important;
	transform: translateY(-50%) scale(1.05);
}
.content-carousel-button:focus-visible { outline: 3px solid rgba(94, 230, 179, .52); outline-offset: 3px; }
.content-carousel-button:disabled { cursor: not-allowed; opacity: .38; }
.content-carousel-button--prev { left: -14px; }
.content-carousel-button--next { right: -14px; }
.content-carousel-dot { width: 9px; height: 9px; border-radius: 999px; background: #CBD5E1; transition: width .25s ease, background-color .25s ease; }
.content-carousel-dot[aria-current="true"] { width: 28px; background: #5EE6B3 !important; }
@media (min-width: 640px) {
	.content-carousel-slide { flex-basis: calc((100% - 1.25rem) / 2); }
	.content-carousel-button--prev { left: -20px; }
	.content-carousel-button--next { right: -20px; }
}
@media (min-width: 1280px) {
	.content-carousel-slide { flex-basis: calc((100% - 2.5rem) / 3); }
}
@media (max-width: 639px) {
	.content-carousel-button { width: 42px; height: 42px; }
	.content-carousel-button--prev { left: -10px; }
	.content-carousel-button--next { right: -10px; }
	
	.siapcair-floating-wa {
        right: 16px !important;

        /*
         * Posisi dinaikkan agar berada
         * di atas tombol "Ajukan Sekarang"
         */
        bottom: calc(
            88px + env(safe-area-inset-bottom, 0px)
        ) !important;

        width: 56px;
        height: 56px;
    }
}

/* ===== Success modal — pastikan overlay selalu menutup seluruh viewport ===== */
#success-modal {
	position: fixed !important; inset: 0 !important;
	width: 100vw !important; max-width: none !important;
	height: 100vh !important; min-height: 100dvh !important;
	margin: 0 !important; z-index: 999999 !important; box-sizing: border-box !important;
}
html.modal-open, body.modal-open { overflow: hidden !important; overscroll-behavior: none; }

footer { background: #031538 !important; }

.siapcair-seo-content p + p {
    margin-top: 1rem;
}

.siapcair-floating-wa {
    position: fixed !important;
    right: 10px !important;
    bottom: 65px !important;
    z-index: 999999 !important;

    display: block !important;

    width: 64px;
    height: 64px;

    border-radius: 50%;

    filter: drop-shadow(
        0 10px 20px rgba(0, 0, 0, 0.22)
    );

    transition: transform 0.2s ease;
}

.siapcair-floating-wa:hover {
    transform: translateY(-4px);
}

.siapcair-floating-wa img {
    display: block !important;

    width: 100% !important;
    height: 100% !important;

    object-fit: contain;
}