@charset "UTF-8";
/*
  lp-campaign-shell.css — optional layer for wizard-scaffolded landing pages.
  Loaded after Bootstrap; improves focus, cards, and motion (respects reduced-motion).
*/

html {
	scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
}

/* Step: clearer focus for keyboard / accessibility */
.btn:focus-visible,
.form-control:focus-visible,
.form-check-input:focus-visible {
	outline: 2px solid rgba(13, 110, 253, 0.65);
	outline-offset: 2px;
}

/* Step: subtle lift on cards (Bootstrap-compatible) */
.card {
	transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.card:hover {
	box-shadow: 0 0.75rem 1.5rem rgba(0, 0, 0, 0.12) !important;
}

@media (prefers-reduced-motion: reduce) {
	.card {
		transition: none;
	}
}

/* Step: primary buttons — slight letter spacing for readability */
.btn-primary,
.btn-danger {
	letter-spacing: 0.02em;
}

/* Step: responsive WebP / SVG hero as semantic <picture>/<img> (not CSS background-image) — IIS needs .webp/.svg in web.config staticContent */
.ctu-hero-visual {
	max-width: 1100px;
	margin: 0 auto 24px;
}

.ctu-hero-picture {
	display: block;
	margin: 0;
	border-radius: 12px;
	overflow: hidden;
	box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
}

.ctu-hero-img {
	width: 100%;
	height: auto;
	display: block;
	object-fit: cover;
	max-height: min(52vh, 480px);
}