/* ==========================================================================
   Car Rental Manager — Front-end styles (v2.1, hardened for embedding)
   Konsep visual: dealer/showroom mobil mewah — hitam pekat + aksen kuningan,
   headline serif editorial, harga ditampilkan seperti plakat logam berukir,
   spesifikasi seperti readout dashboard, garis pembatas tipis warna emas.

   CATATAN: warna/background/border/fill di file ini sengaja diberi !important.
   Plugin ini dirender di banyak konteks berbeda (halaman biasa, shortcode di
   Elementor/page builder lain, tema apa pun) yang masing-masing punya CSS
   global sendiri (reset tombol, warna link, dst). Tanpa !important, identitas
   visual komponen ini (kartu, tombol, plakat harga) gampang "kalah" dan jadi
   tidak konsisten atau bahkan tak terlihat (mis. teks putih di tombol gelap
   yang tertimpa warna teks tema). Properti layout (ukuran, jarak, animasi)
   sengaja TIDAK diberi !important supaya tetap fleksibel/tidak kaku.
   ========================================================================== */

.crm-wrap,
.crm-wrap *,
.crm-scope,
.crm-scope *,
.crm-floating-wa,
.crm-floating-wa *,
.crm-sticky-cta,
.crm-sticky-cta * {
	box-sizing: border-box;
}

/* Variabel warna didefinisikan di :root (global), BUKAN cuma di .crm-wrap — supaya
   tetap berfungsi walau markup komponennya (mis. dari shortcode yang ditaruh di
   Elementor/page builder lain) tidak dibungkus .crm-wrap. Tiap var() di file ini
   juga sudah dikasih nilai fallback sebagai jaring pengaman kedua. */
:root {
	--crm-bg: #F6F3EC;
	--crm-surface: #FFFFFF;
	--crm-ink: #17181C;
	--crm-ink-soft: #6E6A61;
	--crm-charcoal: #101114;
	--crm-charcoal-soft: #1E2025;
	--crm-gold: #B4903F;
	--crm-gold-soft: #E8DEC3;
	--crm-gold-ink: #4A3813;
	--crm-line: #E4DFD2;
	--crm-success: #4F7A5B;
	--crm-warn: #A97C2F;
	--crm-danger: #A34A3D;
	--crm-radius: 10px;
	--crm-font-display: Georgia, 'Iowan Old Style', 'Palatino Linotype', Palatino, 'Times New Roman', serif;
	--crm-font-body: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
	--crm-font-mono: 'DM Mono', 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
}

.crm-wrap, .crm-scope {
	font-family: var(--crm-font-body, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif);
	color: var(--crm-ink, #17181C) !important;
	background: transparent;
}

.crm-wrap {
	max-width: 1200px;
	margin: 0 auto;
	padding: 32px 20px 80px;
}

.crm-wrap a, .crm-scope a { text-decoration: none !important; color: inherit; box-shadow: none !important; }
.crm-wrap p, .crm-scope p { margin: 0 0 1em; }
.crm-wrap ul, .crm-scope ul { margin: 0; }
.crm-wrap svg, .crm-scope svg { display: inline-block; vertical-align: middle; }
.crm-wrap h1, .crm-wrap h2, .crm-wrap h3, .crm-wrap h4,
.crm-scope h1, .crm-scope h2, .crm-scope h3, .crm-scope h4 {
	font-family: var(--crm-font-display, Georgia, 'Iowan Old Style', 'Palatino Linotype', Palatino, 'Times New Roman', serif);
	font-weight: 400;
	color: var(--crm-ink, #17181C) !important;
	background: none !important;
}

/* --------------------------------------------------------------------
   Breadcrumb
   -------------------------------------------------------------------- */

.crm-single__breadcrumb {
	font-size: 13px;
	color: var(--crm-ink-soft, #6E6A61) !important;
	margin: 0 0 22px;
	letter-spacing: .01em;
}
.crm-single__breadcrumb a { color: var(--crm-ink-soft, #6E6A61) !important; }
.crm-single__breadcrumb a:hover { color: var(--crm-gold-ink, #4A3813) !important; }

/* --------------------------------------------------------------------
   Header / archive
   -------------------------------------------------------------------- */

.crm-archive__header { margin-bottom: 20px; }
.crm-archive__title {
	font-size: clamp(30px, 4vw, 44px);
	letter-spacing: -0.01em;
	margin: 0 0 8px;
}
.crm-archive__desc { color: var(--crm-ink-soft, #6E6A61) !important; max-width: 640px; line-height: 1.6; }

.crm-kategori-list {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 32px;
	padding: 0;
}
.crm-kategori-list a {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 18px;
	border: 1px solid var(--crm-line, #E4DFD2) !important;
	border-radius: 999px;
	font-size: 12.5px;
	font-weight: 600;
	letter-spacing: .03em;
	text-transform: uppercase;
	background: var(--crm-surface, #FFFFFF) !important;
	color: var(--crm-ink, #17181C) !important;
	transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.crm-kategori-list a:hover { border-color: var(--crm-gold, #B4903F) !important; color: var(--crm-gold-ink, #4A3813) !important; }
.crm-kategori-list a.is-active {
	background: var(--crm-charcoal, #101114) !important;
	color: #fff !important;
	border-color: var(--crm-charcoal, #101114) !important;
}
.crm-kategori-count {
	font-family: var(--crm-font-mono, 'DM Mono', 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace);
	font-size: 10.5px;
	opacity: .6;
}

/* --------------------------------------------------------------------
   Grid
   -------------------------------------------------------------------- */

.crm-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 28px;
}
.crm-grid--kolom-2 { grid-template-columns: repeat(2, 1fr); }
.crm-grid--kolom-4 { grid-template-columns: repeat(4, 1fr); }

.crm-grid__judul {
	font-size: 28px;
	margin: 0 0 22px;
}

.crm-empty {
	color: var(--crm-ink-soft, #6E6A61) !important;
	padding: 40px 0;
	text-align: center;
}

/* --------------------------------------------------------------------
   Kartu mobil
   -------------------------------------------------------------------- */

.crm-card {
	background: var(--crm-surface, #FFFFFF) !important;
	border: 1px solid var(--crm-line, #E4DFD2) !important;
	border-radius: var(--crm-radius, 10px);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: transform .2s ease, border-color .2s ease;
}
.crm-card:hover {
	transform: translateY(-3px);
	border-color: var(--crm-gold, #B4903F) !important;
}

.crm-card__media {
	position: relative;
	aspect-ratio: 4 / 3;
	background: var(--crm-charcoal, #101114) !important;
	overflow: hidden;
}
.crm-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.crm-card__noimg {
	display: block;
	width: 100%;
	height: 100%;
	background: linear-gradient(160deg, var(--crm-charcoal, #101114), var(--crm-charcoal-soft, #1E2025)) !important;
}

.crm-badge {
	position: absolute;
	top: 12px;
	left: 12px;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 5px 11px 5px 9px;
	border-radius: 999px;
	background: rgba(246,243,236,.95) !important;
	font-size: 10.5px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: var(--crm-ink, #17181C) !important;
}
.crm-dot {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--crm-success, #4F7A5B) !important;
	display: inline-block;
}
.crm-badge--disewa .crm-dot { background: var(--crm-warn, #A97C2F) !important; }
.crm-badge--maintenance .crm-dot { background: var(--crm-danger, #A34A3D) !important; }

/* pembatas tipis emas dengan aksen berlian kecil di tengah */
.crm-card__tear {
	position: relative;
	height: 1px;
	background: var(--crm-line, #E4DFD2) !important;
	margin: 0 18px;
}
.crm-card__tear::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 5px;
	height: 5px;
	background: var(--crm-gold, #B4903F) !important;
	transform: translate(-50%, -50%) rotate(45deg);
}

.crm-card__body {
	padding: 16px 18px 18px;
	display: flex;
	flex-direction: column;
	gap: 8px;
	flex: 1;
}

.crm-card__cat {
	font-size: 10.5px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .08em;
	color: var(--crm-gold-ink, #4A3813) !important;
}

.crm-card__title {
	margin: 0;
	font-size: 19px;
	line-height: 1.3;
	font-family: var(--crm-font-display, Georgia, 'Iowan Old Style', 'Palatino Linotype', Palatino, 'Times New Roman', serif);
}
.crm-card__title a { color: var(--crm-ink, #17181C) !important; }

.crm-card__submerek {
	margin: -4px 0 0;
	color: var(--crm-ink-soft, #6E6A61) !important;
	font-size: 13px;
}

/* --------------------------------------------------------------------
   Spec row — readout ala dashboard
   -------------------------------------------------------------------- */

.crm-spec-row {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 4px 0 2px;
	padding: 0;
}
.crm-spec {
	font-family: var(--crm-font-mono, 'DM Mono', 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace);
	font-size: 10.5px;
	font-weight: 500;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var(--crm-gold-soft, #E8DEC3) !important;
	background: var(--crm-charcoal, #101114) !important;
	padding: 4px 9px;
	border-radius: 4px;
	white-space: nowrap;
}
.crm-spec-row--lg .crm-spec { font-size: 11.5px; padding: 6px 12px; }

/* --------------------------------------------------------------------
   Harga — plakat logam berukir
   -------------------------------------------------------------------- */

.crm-card__footer {
	margin-top: auto;
	padding-top: 12px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	flex-wrap: wrap;
}

.crm-plate {
	display: inline-flex;
	align-items: center;
	background: var(--crm-charcoal, #101114) !important;
	border: 1px solid var(--crm-gold, #B4903F) !important;
	border-radius: 4px;
	padding: 6px 12px;
}
.crm-plate__harga {
	font-family: var(--crm-font-mono, 'DM Mono', 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace);
	font-weight: 500;
	font-size: 12.5px;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var(--crm-gold-soft, #E8DEC3) !important;
}
.crm-plate--lg { padding: 12px 18px; }
.crm-plate--lg .crm-plate__harga { font-size: 18px; }
.crm-single__harga-minggu { margin: 8px 0 0; font-size: 13px; color: var(--crm-ink-soft, #6E6A61) !important; }

.crm-card__actions {
	display: flex;
	gap: 8px;
}

/* --------------------------------------------------------------------
   Tombol
   -------------------------------------------------------------------- */

.crm-btn {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	gap: 7px;
	padding: 10px 18px;
	border-radius: 6px;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .01em;
	border: 1px solid transparent;
	cursor: pointer;
	line-height: 1.2;
	text-indent: 0 !important;
	overflow: visible !important;
	white-space: normal;
	text-decoration: none !important;
	font-family: var(--crm-font-body, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif);
	box-shadow: none !important;
	transition: background .15s ease, color .15s ease, border-color .15s ease, opacity .15s ease;
}
.crm-btn--ghost {
	border-color: var(--crm-line, #E4DFD2) !important;
	background: transparent !important;
	color: var(--crm-ink, #17181C) !important;
}
.crm-btn--ghost:hover { border-color: var(--crm-ink, #17181C) !important; }
.crm-btn--wa {
	background: var(--crm-charcoal, #101114) !important;
	color: #fff !important;
}
.crm-btn--wa:hover { background: var(--crm-charcoal-soft, #1E2025) !important; color: #fff !important; }
.crm-btn--wa svg { width: 15px !important; height: 15px !important; max-width: 15px !important; fill: #fff !important; flex-shrink: 0; }
.crm-btn--primary {
	background: var(--crm-gold, #B4903F) !important;
	color: var(--crm-charcoal, #101114) !important;
}
.crm-btn--primary:hover { background: #a17f34 !important; color: var(--crm-charcoal, #101114) !important; }
.crm-btn--block { width: 100%; padding: 14px 16px; font-size: 14.5px; }
.crm-btn[disabled], .crm-btn:disabled { opacity: .45; cursor: not-allowed; }

/* --------------------------------------------------------------------
   Pagination
   -------------------------------------------------------------------- */

.crm-pagination {
	margin-top: 40px;
	display: flex;
	gap: 6px;
	flex-wrap: wrap;
}
.crm-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 36px;
	height: 36px;
	padding: 0 10px;
	border: 1px solid var(--crm-line, #E4DFD2) !important;
	border-radius: 6px;
	font-size: 13px;
	font-weight: 600;
	color: var(--crm-ink, #17181C) !important;
	background: var(--crm-surface, #FFFFFF) !important;
}
.crm-pagination .page-numbers.current {
	background: var(--crm-charcoal, #101114) !important;
	color: #fff !important;
	border-color: var(--crm-charcoal, #101114) !important;
}

.crm-archive__seo-content {
	margin-top: 56px;
	padding-top: 40px;
	border-top: 1px solid var(--crm-line, #E4DFD2) !important;
	max-width: 820px;
	line-height: 1.75;
	color: var(--crm-ink, #17181C) !important;
}
.crm-archive__seo-content h2,
.crm-archive__seo-content h3 { margin: 1.4em 0 .6em; }
.crm-archive__seo-content p:first-child { margin-top: 0; }
.crm-archive__seo-content img { max-width: 100%; height: auto; border-radius: 8px; }

/* --------------------------------------------------------------------
   Single mobil
   -------------------------------------------------------------------- */

.crm-single__top {
	display: grid;
	grid-template-columns: 1.15fr 1fr;
	gap: 44px;
	align-items: start;
}

.crm-gallery__main {
	position: relative;
	aspect-ratio: 4 / 3;
	border-radius: var(--crm-radius, 10px);
	overflow: hidden;
	background: var(--crm-charcoal, #101114) !important;
}
.crm-gallery__main img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.crm-gallery__thumbs {
	display: flex;
	gap: 10px;
	margin-top: 10px;
	flex-wrap: wrap;
}
.crm-gallery__thumb {
	width: 64px;
	height: 64px;
	border-radius: 6px;
	overflow: hidden;
	border: 2px solid transparent;
	padding: 0;
	cursor: pointer;
	background: none !important;
	opacity: .6;
	transition: opacity .15s ease, border-color .15s ease;
}
.crm-gallery__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.crm-gallery__thumb.is-active,
.crm-gallery__thumb:hover { opacity: 1; border-color: var(--crm-gold, #B4903F) !important; }

.crm-single__cat { display: flex; gap: 10px; margin-bottom: 10px; }
.crm-single__cat a {
	font-size: 10.5px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .08em;
	color: var(--crm-gold-ink, #4A3813) !important;
}
.crm-single__title {
	font-size: clamp(28px, 3.4vw, 38px);
	margin: 0 0 6px;
	letter-spacing: -0.01em;
	line-height: 1.15;
}
.crm-single__submerek { color: var(--crm-ink-soft, #6E6A61) !important; margin: 0 0 16px; font-size: 15px; }
.crm-single__quick-actions { display: flex; gap: 10px; margin-top: 20px; flex-wrap: wrap; }
.crm-single__trust {
	margin: 10px 0 0;
	font-size: 12.5px;
	color: var(--crm-ink-soft, #6E6A61) !important;
}
.crm-single__trust::before { content: "✓ "; color: var(--crm-success, #4F7A5B) !important; }

.crm-single__body {
	margin-top: 48px;
	padding-top: 40px;
	border-top: 1px solid var(--crm-line, #E4DFD2) !important;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 44px;
}
.crm-single__desc h2, .crm-single__fitur h2 {
	font-size: 20px;
	margin: 0 0 14px;
}
.crm-single__desc { line-height: 1.75; color: var(--crm-ink, #17181C) !important; }

.crm-fitur-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 9px 16px;
}
.crm-fitur-list li {
	font-size: 13.5px;
	padding-left: 18px;
	position: relative;
	color: var(--crm-ink, #17181C) !important;
}
.crm-fitur-list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 8px;
	width: 6px;
	height: 6px;
	background: var(--crm-gold, #B4903F) !important;
	transform: rotate(45deg);
}

.crm-single__booking {
	margin-top: 52px;
	padding-top: 44px;
	border-top: 1px solid var(--crm-line, #E4DFD2) !important;
}

.crm-single__related {
	margin-top: 56px;
	padding-top: 44px;
	border-top: 1px solid var(--crm-line, #E4DFD2) !important;
}
.crm-single__related h2 {
	font-size: 22px;
	margin: 0 0 22px;
}

/* --------------------------------------------------------------------
   Form booking
   -------------------------------------------------------------------- */

.crm-booking {
	max-width: 640px;
	background: var(--crm-surface, #FFFFFF) !important;
	border: 1px solid var(--crm-line, #E4DFD2) !important;
	border-radius: var(--crm-radius, 10px);
	padding: 30px;
}
.crm-booking__title { margin: 0 0 6px; font-size: 22px; }
.crm-booking__subtitle { margin: 0 0 14px; color: var(--crm-ink-soft, #6E6A61) !important; font-size: 14px; line-height: 1.6; }
.crm-booking__min-info {
	display: inline-block;
	font-size: 11.5px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .04em;
	color: var(--crm-gold-ink, #4A3813) !important;
	background: var(--crm-gold-soft, #E8DEC3) !important;
	padding: 4px 10px;
	border-radius: 4px;
	margin: 0 0 18px;
}
.crm-booking__notice {
	background: #F7EFE8 !important;
	color: var(--crm-warn, #A97C2F) !important;
	border: 1px solid #EAD8BE !important;
	border-radius: 6px;
	padding: 11px 15px;
	font-size: 13.5px;
	margin-bottom: 18px;
}
.crm-booking__trust {
	text-align: center;
	font-size: 12.5px;
	color: var(--crm-ink-soft, #6E6A61) !important;
	margin: 12px 0 0;
}
.crm-booking__syarat {
	max-width: 640px;
	margin-top: 20px;
	padding-top: 18px;
	border-top: 1px dotted var(--crm-line, #E4DFD2) !important;
}
.crm-booking__syarat h4 {
	font-size: 15px;
	margin: 0 0 6px;
}
.crm-booking__syarat p {
	font-size: 13px;
	color: var(--crm-ink-soft, #6E6A61) !important;
	line-height: 1.6;
	margin: 0;
}

.crm-form-row { margin-bottom: 16px; }
.crm-form-row--2col {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}
.crm-field { display: flex; flex-direction: column; gap: 6px; }
.crm-field label { font-size: 12.5px; font-weight: 600; letter-spacing: .01em; color: var(--crm-ink, #17181C) !important; }
.crm-field .req { color: var(--crm-danger, #A34A3D) !important; }
.crm-field input,
.crm-field textarea {
	font-family: inherit;
	font-size: 14px;
	padding: 10px 12px;
	border: 1px solid var(--crm-line, #E4DFD2) !important;
	border-radius: 6px;
	background: var(--crm-bg, #F6F3EC) !important;
	color: var(--crm-ink, #17181C) !important;
	box-shadow: none !important;
	width: 100%;
}
.crm-field input:focus,
.crm-field textarea:focus {
	outline: none;
	border-color: var(--crm-gold, #B4903F) !important;
	background: #fff !important;
}
.crm-hp-trap { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

.crm-durasi-info {
	font-size: 13px;
	font-weight: 600;
	color: var(--crm-gold-ink, #4A3813) !important;
	margin: -8px 0 16px;
}
.crm-form-msg {
	font-size: 13.5px;
	font-weight: 600;
	padding: 10px 14px;
	border-radius: 6px;
	margin: 0 0 16px;
}
.crm-form-msg[data-tone="error"] { background: #F7E9E6 !important; color: var(--crm-danger, #A34A3D) !important; }
.crm-form-msg[data-tone="success"] { background: #E9F0EA !important; color: var(--crm-success, #4F7A5B) !important; }

/* --------------------------------------------------------------------
   Tombol WhatsApp mengambang (site-wide)
   -------------------------------------------------------------------- */

.crm-floating-wa {
	position: fixed !important;
	right: 20px;
	bottom: 20px;
	z-index: 9000;
	display: inline-flex !important;
	align-items: center;
	gap: 9px;
	background: var(--crm-charcoal, #101114) !important;
	color: #fff !important;
	padding: 13px 18px;
	border-radius: 999px;
	box-shadow: 0 8px 22px rgba(16,17,20,.28);
	font-family: var(--crm-font-body, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif);
	font-size: 13.5px;
	font-weight: 600;
	text-decoration: none !important;
	transition: transform .15s ease, background .15s ease;
}
.crm-floating-wa:hover { transform: translateY(-2px); background: var(--crm-charcoal-soft, #1E2025) !important; color: #fff !important; }
.crm-floating-wa__icon { width: 20px !important; height: 20px !important; max-width: 20px !important; fill: #fff !important; flex-shrink: 0; }

@media (max-width: 560px) {
	.crm-floating-wa__label { display: none; }
	.crm-floating-wa { padding: 14px; }
}

/* --------------------------------------------------------------------
   Bar booking sticky (mobile, halaman detail mobil)
   -------------------------------------------------------------------- */

.crm-sticky-cta {
	position: fixed !important;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 8500;
	display: none;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	background: var(--crm-surface, #FFFFFF) !important;
	border-top: 1px solid var(--crm-line, #E4DFD2) !important;
	padding: 12px 16px calc(12px + env(safe-area-inset-bottom));
	transform: translateY(100%);
	transition: transform .25s ease;
	font-family: var(--crm-font-body, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif);
}
.crm-sticky-cta.is-visible { transform: translateY(0); }
.crm-sticky-cta__harga { display: flex; flex-direction: column; min-width: 0; }
.crm-sticky-cta__label {
	font-size: 11px;
	color: var(--crm-ink-soft, #6E6A61) !important;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.crm-sticky-cta__nilai {
	font-family: var(--crm-font-mono, 'DM Mono', 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace);
	font-weight: 600;
	font-size: 15px;
	color: var(--crm-ink, #17181C) !important;
}

@media (max-width: 780px) {
	.crm-sticky-cta { display: flex; }
}

/* --------------------------------------------------------------------
   Responsif
   -------------------------------------------------------------------- */

@media (max-width: 960px) {
	.crm-single__top,
	.crm-single__body { grid-template-columns: 1fr; }
}

@media (max-width: 780px) {
	.crm-grid,
	.crm-grid--kolom-3,
	.crm-grid--kolom-4 { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 560px) {
	.crm-grid,
	.crm-grid--kolom-2,
	.crm-grid--kolom-3,
	.crm-grid--kolom-4 { grid-template-columns: 1fr; }
	.crm-form-row--2col { grid-template-columns: 1fr; }
	.crm-fitur-list { grid-template-columns: 1fr; }
	.crm-booking { padding: 20px; }
}

@media (prefers-reduced-motion: reduce) {
	.crm-card, .crm-floating-wa, .crm-sticky-cta { transition: none; }
	.crm-card:hover, .crm-floating-wa:hover { transform: none; }
}
