/*
 * Marketing home / landing page (Views/Home/Index.cshtml)
 * Extracted verbatim from the view's inline <style> block.
 */
	/* ─── Global ─────────────────────────────────────────────── */
	:root {
		--color-red:      var(--color-blue);
		--color-dark:     #000000;
		--color-dark-rgb: 0, 0, 0;
	}

	html { scroll-behavior: smooth; }
	body { overflow-x: hidden; }

	/* ─── Navbar ─────────────────────────────────────────────── */
	.landing-nav-link {
		color: #000 !important;
		font-weight: 600;
		font-size: 1.15rem;
		padding: .5rem 1rem;
		border-radius: .375rem;
		transition: color .2s, background .2s;
		text-decoration: none;
	}
	.landing-nav-link:hover { color: var(--color-red) !important; background: none; }
	.landing-nav-link.active { color: var(--color-red) !important; }

	@media (max-width: 991px) {
		.mobile-menu-block { width: 100%; padding: .6rem 0; }
		.nav-mobile .landing-nav-link { color: #000 !important; display: block; padding: .65rem 1rem; }
	}

	/* ─── Hero ───────────────────────────────────────────────── */
	.hero-section {
		position: relative;
		min-height: 92vh;
		display: flex;
		align-items: center;
		justify-content: center;
		background: linear-gradient(135deg, rgba(0,0,0,.96) 0%, rgba(0,158,247,.28) 100%),
		            url('/media/images/hero-moto.webp') center center / cover no-repeat;
		padding: 120px 0 80px;
	}
	.hero-section::after {
		content: '';
		position: absolute;
		bottom: -1px; left: 0; right: 0;
		height: 60px;
		background: #fff;
		clip-path: ellipse(55% 100% at 50% 100%);
	}
	.hero-title {
		font-size: clamp(2.5rem, 5vw, 3.8rem);
		font-weight: 700;
		line-height: 1.15;
		color: #fff;
		text-shadow: 0 2px 12px rgba(0,0,0,.55);
	}
	.hero-title .accent { color: var(--color-blue); }
	.hero-sub {
		font-size: clamp(1.25rem, 2.4vw, 1.55rem);
		color: #fff;
		max-width: 560px;
		margin: 0 auto;
		line-height: 1.7;
		text-shadow: 0 1px 8px rgba(0,0,0,.4);
	}
	.btn-hero-primary {
		background: var(--color-red);
		color: #fff;
		font-weight: 700;
		padding: .85rem 2.25rem;
		border-radius: 50px;
		border: none;
		font-size: 1.15rem;
		text-decoration: none;
		transition: background .2s, transform .2s, box-shadow .2s;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		text-align: center;
	}
	.btn-nav-cta { padding: .6rem 1.4rem; font-size: 1rem; }
	.btn-nav-login {
		padding: .6rem 1.4rem;
		font-size: 1rem;
		font-weight: 700;
		border-radius: 50px;
		border: 2px solid var(--color-blue);
		color: var(--color-blue);
		background: transparent;
		text-decoration: none;
		transition: background .2s, color .2s, transform .2s, box-shadow .2s, border-color .2s;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		text-align: center;
	}
	.btn-nav-login:hover {
		background: #0085d0;
		border-color: #0085d0;
		color: #fff;
		transform: translateY(-2px);
		box-shadow: 0 8px 24px rgba(0,105,180,.45);
	}

	.btn-hero-primary:hover {
		background: #0085d0;
		color: #fff;
		transform: translateY(-2px);
		box-shadow: 0 8px 24px rgba(0,105,180,.45);
	}
	.btn-hero-outline {
		background: transparent;
		color: #fff;
		font-weight: 700;
		padding: .85rem 2.25rem;
		border-radius: 50px;
		border: 2px solid rgba(255,255,255,.55);
		font-size: 1.15rem;
		text-decoration: none;
		transition: background .2s, border-color .2s, transform .2s;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		text-align: center;
	}
	.btn-hero-outline:hover {
		background: rgba(255,255,255,.12);
		border-color: #fff;
		color: #fff;
		transform: translateY(-2px);
	}

	/* ─── Stats bar ──────────────────────────────────────────── */
	.stats-bar { background: #fff; padding: 2.5rem 0; border-bottom: 1px solid #f0f0f0; }
	.stat-item { text-align: center; }
	.stat-number { font-size: 3rem; font-weight: 700; color: var(--color-dark); line-height: 1; }
	.stat-label { font-size: 1.1rem; color: #000; font-weight: 500; margin-top: .25rem; }

	/* ─── Section titles ─────────────────────────────────────── */
	.section-label {
		font-size: 1rem;
		font-weight: 700;
		letter-spacing: .12em;
		text-transform: uppercase;
		color: var(--color-red);
		display: block;
		margin-bottom: .5rem;
	}
	.section-title {
		font-size: clamp(1.9rem, 3.5vw, 2.7rem);
		font-weight: 700;
		color: var(--color-dark);
		line-height: 1.2;
	}
	.section-sub { font-size: 1.3rem; color: #000; max-width: 600px; margin: 0 auto; line-height: 1.7; }
	.section-title-white { color: #fff; }
	.section-sub-white { color: #fff; }

	/* ─── Feature cards ──────────────────────────────────────── */
	.feature-card {
		background: #fff;
		border: 1px solid #e8ecf0;
		border-radius: 1rem;
		padding: 2rem 1.75rem;
		height: 100%;
		transition: transform .25s, box-shadow .25s, border-color .25s;
	}
	.feature-card:hover {
		transform: translateY(-4px);
		box-shadow: 0 16px 40px rgba(0,0,0,.10);
		border-color: var(--color-red);
	}
	a.feature-card-link {
		display: block;
		text-decoration: none;
		color: inherit;
	}
	a.feature-card-link:hover,
	a.feature-card-link:focus {
		color: inherit;
	}
	.feature-icon {
		width: 56px; height: 56px;
		border-radius: .75rem;
		background: rgba(0,158,247,.10);
		display: flex; align-items: center; justify-content: center;
		margin-bottom: 1.25rem;
	}
	.feature-icon svg { width: 28px; height: 28px; }
	.feature-title { font-size: 1.35rem; font-weight: 700; color: var(--color-dark); margin-bottom: .5rem; }
	.feature-desc { font-size: 1.15rem; color: #000; line-height: 1.65; }

	/* ─── How it Works ───────────────────────────────────────── */
	.step-card { text-align: center; padding: 1.5rem 1rem; }
	.step-number {
		width: 52px; height: 52px;
		border-radius: 50%;
		background: var(--color-red);
		color: #fff;
		font-size: 1.3rem;
		font-weight: 800;
		display: flex; align-items: center; justify-content: center;
		margin: 0 auto 1.25rem;
	}
	.step-icon { margin-bottom: 1rem; }
	.step-icon svg { width: 72px; height: 72px; }
	.step-title { font-size: 1.3rem; font-weight: 700; color: var(--color-dark); margin-bottom: .5rem; }
	.step-desc { font-size: 1.15rem; color: #000; line-height: 1.6; }

	/* connector line between steps on desktop */
	.steps-row { position: relative; }
	@media (min-width: 992px) {
		.steps-row::before {
			content: '';
			position: absolute;
			top: 26px; left: 12.5%; right: 12.5%;
			height: 2px;
			background: repeating-linear-gradient(90deg, var(--color-red) 0 8px, transparent 8px 16px);
			z-index: 0;
		}
		.step-card { position: relative; z-index: 1; }
	}

	/* ─── Showcase carousel ──────────────────────────────────── */
	.showcase-section { background: #000; padding: 80px 0; }
	.showcase-carousel-item { border-radius: 1rem; overflow: hidden; height: 500px; }
	.showcase-carousel-item img { width: 100%; height: 100%; object-fit: cover; border-radius: 1rem; }
	.carousel-control-prev-icon, .carousel-control-next-icon {
		background-color: rgba(0,0,0,.65);
		border-radius: 50%;
		padding: 1.5rem;
		background-size: 60%;
	}
	@media (max-width: 768px) { .showcase-carousel-item { height: 240px; } }

	/* ─── Testimonials ───────────────────────────────────────── */
	.testimonial-card {
		background: #fff;
		border: 1px solid #e8ecf0;
		border-radius: 1rem;
		padding: 2rem 1.75rem;
		height: 100%;
		position: relative;
	}
	.testimonial-card::before { content: none; }
	.testimonial-text { font-size: 1.2rem; color: #000; line-height: 1.75; margin-bottom: 1.5rem; }
	.testimonial-author { font-weight: 700; color: var(--color-dark); font-size: 1.15rem; }
	.testimonial-role { font-size: 1.05rem; color: #000; }
	.stars { color: #f59e0b; font-size: 1.25rem; margin-bottom: .75rem; }

	/* ─── Pricing ────────────────────────────────────────────── */
	.pricing-card {
		background: #fff;
		border-radius: 1.5rem;
		padding: 3rem 2.5rem;
		max-width: 500px;
		margin: 0 auto;
		text-align: center;
	}
	.pricing-badge {
		display: inline-block;
		background: rgba(0,105,180,.12);
		color: var(--color-red);
		font-weight: 700;
		font-size: .9rem;
		letter-spacing: .08em;
		text-transform: uppercase;
		border-radius: 50px;
		padding: .3rem .9rem;
		margin-bottom: 1.25rem;
	}
	.pricing-amount { font-size: 3.8rem; font-weight: 800; color: var(--color-dark); line-height: 1; }
	.pricing-unit { font-size: 1.2rem; color: #000; font-weight: 500; }
	.pricing-divider { border-top: 1px solid #e8ecf0; margin: 1.75rem 0; }
	.pricing-feature {
		display: flex; align-items: center; gap: .75rem;
		font-size: 1.15rem; color: #000;
		margin-bottom: .875rem; text-align: left;
	}
	.pricing-feature svg { flex-shrink: 0; color: #16a34a; }
	.btn-pricing {
		background: var(--color-dark);
		color: #fff;
		font-weight: 700;
		padding: 1rem 2.5rem;
		border-radius: 50px;
		border: none;
		font-size: 1.05rem;
		text-decoration: none;
		width: 100%;
		display: block;
		text-align: center;
		transition: background .2s, transform .2s;
		margin-top: 1.75rem;
	}
	.btn-pricing:hover { background: var(--color-red); color: #fff; transform: translateY(-2px); }

	/* ─── FAQ ────────────────────────────────────────────────── */
	.faq-item {
		border: 1px solid #e8ecf0;
		border-radius: .875rem;
		margin-bottom: .875rem;
		overflow: hidden;
		transition: box-shadow .2s;
	}
	.faq-item:hover { box-shadow: 0 4px 16px rgba(0,0,0,.07); }
	.faq-question {
		width: 100%;
		background: #fff;
		border: none;
		padding: 1.25rem 1.5rem;
		text-align: left;
		display: flex;
		align-items: center;
		justify-content: space-between;
		font-weight: 700;
		font-size: 1.2rem;
		color: var(--color-dark);
		margin: 0;
		gap: 1rem;
	}
	.faq-answer { background: #fafafa; padding: 1rem 1.5rem 1.5rem; }
	.faq-answer p { font-size: 1.15rem; color: #000; line-height: 1.7; margin: 0; }

	/* ─── CTA Banner ─────────────────────────────────────────── */
	.cta-banner {
		background: linear-gradient(135deg, #000 0%, #007bc4 100%);
		border-radius: 1.5rem;
		padding: 4rem 3rem;
	}
	@media (max-width: 768px) { .cta-banner { padding: 2.5rem 1.5rem; border-radius: 1rem; } }
	.btn-cta {
		background: #fff;
		color: #000;
		font-weight: 700;
		padding: .9rem 2.5rem;
		border-radius: 50px;
		border: none;
		font-size: 1.05rem;
		text-decoration: none;
		transition: transform .2s, box-shadow .2s;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		text-align: center;
		white-space: nowrap;
	}
	.btn-cta:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0,0,0,.2); color: #000; }

	/* ─── Footer ─────────────────────────────────────────────── */
	.site-footer { background: #000; padding: 3.5rem 0 2rem; }
	.footer-logo img { height: 28px; }
	.footer-tagline { color: rgba(255,255,255,.75); font-size: 1.2rem; margin-top: .5rem; }
	.footer-link { color: rgba(255,255,255,.8); text-decoration: none; font-size: 1.15rem; transition: color .2s; }
	.footer-link:hover { color: #fff; }
	.footer-divider { border-top: 1px solid rgba(255,255,255,.12); margin: 2rem 0 1.5rem; }
	.footer-copy { color: rgba(255,255,255,.9); font-size: 1.05rem; }
	.footer-copy a { color: inherit; font-size: inherit; font-weight: inherit; text-decoration: none; }
	.footer-copy a:hover { color: #fff; }

	/* ─── Utilities ──────────────────────────────────────────── */
	.section-py { padding: 90px 0; }

	/* ─── Mobile ─────────────────────────────────────────────── */
	@media (max-width: 767.98px) {
		/* Hero */
		.hero-section {
			min-height: 80vh;
			padding: 90px 0 60px;
		}
		.hero-sub { font-size: 1.05rem; }
		.btn-hero-primary, .btn-hero-outline {
			width: 100%;
			font-size: 1rem;
		}
		/* Section spacing */
		.section-py { padding: 56px 0; }
		/* Stats */
		.stat-number { font-size: 2rem; }
		.stat-label { font-size: .95rem; }
		.stats-bar { padding: 2rem 0; }
		/* Feature cards — full width, less padding */
		.feature-card { padding: 1.5rem 1.25rem; }
		.feature-title { font-size: 1.1rem; }
		.feature-desc { font-size: 1rem; }
		/* Steps */
		.step-card { padding: 1rem .75rem; }
		.step-title { font-size: 1.1rem; }
		.step-desc { font-size: 1rem; }
		/* Showcase */
		.showcase-section { padding: 48px 0; }
		.showcase-carousel-item { height: 220px; }
		/* Testimonials */
		.testimonial-card { padding: 1.5rem 1.25rem; }
		.testimonial-text { font-size: 1rem; }
		/* Pricing */
		.pricing-card { padding: 2rem 1.5rem; max-width: 100%; }
		.pricing-amount { font-size: 2.8rem; }
		.pricing-feature { font-size: 1rem; }
		/* FAQ */
		.faq-question { font-size: 1rem; padding: 1rem 1.25rem; }
		.faq-answer p { font-size: 1rem; }
		.faq-answer.open { padding: .875rem 1.25rem 1.25rem; }
		/* CTA banner */
		.cta-banner { padding: 2.25rem 1.5rem; border-radius: 1rem; text-align: center; }
		.btn-cta { width: 100%; font-size: 1rem; }
		/* Footer */
		.site-footer { padding: 2.5rem 0 1.5rem; }
		.footer-tagline { font-size: .95rem; }
		.footer-bottom-row { text-align: center; }
	}

	@media (max-width: 575.98px) {
		.landing-header .container { padding-left: 8px; padding-right: 8px; }
		.btn-nav-cta { padding: .5rem 1.1rem !important; font-size: .95rem !important; white-space: nowrap; }
		.btn-nav-login { padding: .5rem 1.1rem !important; font-size: .95rem !important; white-space: nowrap; }
		.landing-header .flex-equal:last-child { flex: 0 0 auto; }
		.hero-section { padding: 80px 0 52px; }
		.section-title { font-size: 1.65rem; }
		.section-sub { font-size: 1.05rem; }
		.stat-number { font-size: 1.75rem; }
	}


/* ── Classes promoted from former inline styles on the landing page ── */
.home-logo-img { width: auto; aspect-ratio: 5281 / 1000; }
.home-hero-badge { background: rgba(255,255,255,.15); color: #fff; font-size: .875rem; letter-spacing: .06em; }
.section-bg-light { background: #f8fafc; }
.section-bg-dark { background: var(--color-dark); }
.section-label-light { color: rgba(255,255,255,.8); }
.home-link-plain { color: #000; text-decoration: none; }
.home-link-red { color: var(--color-red); }
.home-contact-note { font-size: 1rem; color: #000; }
.home-cta-title { font-size: clamp(1.5rem, 3vw, 2.2rem); }
.home-cta-sub { opacity: .9; font-size: 1.15rem; max-width: 500px; }
.home-cta-btn-outline { border-color: rgba(255,255,255,.4); }
.home-footer-heading { font-size: 1.05rem; }