/**
 * Doctor AK Portal — Home page ([dak_home]).
 *
 * Loaded together with doctor-ak-auth.css (tokens, .dak-button*, .dak-eyebrow,
 * the html[data-theme='dark']/.dak-dashboard[data-theme='dark'] dark-mode
 * overrides), doctor-ak-directory.css (.dak-directory-header/-grid,
 * service/doctor cards) and doctor-ak-featured-doctors.css (slider). Every
 * color here reads from the shared --dak-* tokens so the public light/dark
 * toggle (assets/js/doctor-ak-public-theme-toggle.js) re-colors it for free.
 */

.dak-home {
	max-width: 1180px !important;
	margin: 0 auto !important;
	padding: 0 1.5rem var( --dak-space-8 ) !important;
}

.dak-home-section {
	margin-top: var( --dak-space-8 ) !important;
}

.dak-home-section-footer {
	display: flex !important;
	justify-content: center !important;
	margin-top: var( --dak-space-5 ) !important;
}

/* Hero */

.dak-home-hero {
	margin-top: var( --dak-space-6 ) !important;
	padding: var( --dak-space-7 ) 0 !important;
	border-bottom: 1px solid var( --dak-border ) !important;
}

.dak-home-hero-grid {
	display: grid !important;
	grid-template-columns: 1fr 340px !important;
	gap: var( --dak-space-7 ) !important;
	align-items: center !important;
}

.dak-home-hero-copy h1 {
	font-size: var( --dak-text-3xl ) !important;
	font-weight: 800 !important;
	line-height: 1.18 !important;
	margin: var( --dak-space-3 ) 0 var( --dak-space-3 ) !important;
	color: var( --dak-text ) !important;
}

.dak-home-hero-accent {
	font-style: italic !important;
	color: var( --dak-primary ) !important;
}

.dak-home-hero-copy > p {
	font-size: var( --dak-text-lg ) !important;
	color: var( --dak-muted ) !important;
	margin: 0 0 var( --dak-space-5 ) !important;
	max-width: 46ch !important;
}

.dak-home-hero-actions {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: var( --dak-space-3 ) !important;
}

.dak-button-lg {
	padding: 0.95rem 1.75rem !important;
	font-size: var( --dak-text-md ) !important;
}

.dak-home-hero-actions .dak-button svg,
.dak-home-cta .dak-button svg {
	width: 18px !important;
	height: 18px !important;
	flex: 0 0 auto !important;
}

/* Hero floating doctor card */

.dak-home-hero-card {
	background: var( --dak-bg-card ) !important;
	border: 1px solid var( --dak-border ) !important;
	border-radius: var( --dak-radius-lg ) !important;
	box-shadow: var( --dak-shadow-lg ) !important;
	padding: var( --dak-space-5 ) !important;
	display: flex !important;
	flex-direction: column !important;
	gap: var( --dak-space-4 ) !important;
}

.dak-home-hero-card-doctor {
	display: flex !important;
	align-items: center !important;
	gap: var( --dak-space-3 ) !important;
}

.dak-home-hero-card-avatar {
	width: 52px !important;
	height: 52px !important;
	flex: 0 0 auto !important;
	background: var( --dak-primary-tint ) !important;
	color: var( --dak-primary-dark ) !important;
	font-weight: 700 !important;
	font-size: var( --dak-text-md ) !important;
}

.dak-home-hero-card-doctor div {
	display: flex !important;
	flex-direction: column !important;
	min-width: 0 !important;
}

.dak-home-hero-card-doctor strong {
	font-size: var( --dak-text-md ) !important;
	color: var( --dak-text ) !important;
}

.dak-home-hero-card-doctor span {
	font-size: var( --dak-text-sm ) !important;
	color: var( --dak-muted ) !important;
}

.dak-home-hero-card-stats {
	display: grid !important;
	grid-template-columns: repeat( 3, 1fr ) !important;
	gap: var( --dak-space-2 ) !important;
	padding-top: var( --dak-space-4 ) !important;
	border-top: 1px solid var( --dak-border ) !important;
}

.dak-home-hero-card-stats div {
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	text-align: center !important;
}

.dak-home-hero-card-stats strong {
	font-size: var( --dak-text-lg ) !important;
	font-weight: 800 !important;
	color: var( --dak-primary-dark ) !important;
}

.dak-home-hero-card-stats span {
	font-size: 0.68rem !important;
	color: var( --dak-muted ) !important;
	line-height: 1.3 !important;
}

.dak-home-hero-card-badge {
	align-self: flex-start !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 0.3rem !important;
	padding: 0.3rem 0.75rem !important;
	border-radius: 999px !important;
	background: var( --dak-tint-success, var( --dak-primary-tint ) ) !important;
	color: var( --dak-tint-success-text, var( --dak-primary-dark ) ) !important;
	font-size: var( --dak-text-xs ) !important;
	font-weight: 700 !important;
}

/* Stats strip below the hero */

.dak-home-hero-stats-strip {
	margin-top: var( --dak-space-7 ) !important;
	padding-top: var( --dak-space-6 ) !important;
	border-top: 1px solid var( --dak-border ) !important;
	display: grid !important;
	grid-template-columns: repeat( 4, 1fr ) !important;
	gap: var( --dak-space-4 ) !important;
}

.dak-home-hero-stat {
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	text-align: center !important;
	gap: var( --dak-space-1 ) !important;
}

.dak-home-hero-stat strong {
	font-size: var( --dak-text-2xl ) !important;
	font-weight: 800 !important;
	color: var( --dak-text ) !important;
}

.dak-home-hero-stat span {
	font-size: var( --dak-text-sm ) !important;
	color: var( --dak-muted ) !important;
	font-weight: 600 !important;
}

/* Video tour banner */

.dak-home-video-banner {
	position: relative !important;
	aspect-ratio: 16 / 7 !important;
	border-radius: var( --dak-radius-lg ) !important;
	overflow: hidden !important;
	background: linear-gradient( 135deg, var( --dak-secondary ) 0%, var( --dak-primary-dark ) 100% ) !important;
	box-shadow: var( --dak-shadow-lg ) !important;
}

.dak-home-video-banner video {
	position: absolute !important;
	inset: 0 !important;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
}

.dak-home-video-banner-overlay {
	position: absolute !important;
	left: 0 !important;
	bottom: 0 !important;
	width: 100% !important;
	padding: var( --dak-space-6 ) var( --dak-space-5 ) !important;
	background: linear-gradient( 180deg, transparent 0%, rgba( 0, 0, 0, 0.75 ) 100% ) !important;
}

.dak-home-video-banner-overlay h2 {
	color: #fff !important;
	font-size: var( --dak-text-xl ) !important;
	font-weight: 800 !important;
	margin: var( --dak-space-1 ) 0 0 !important;
}

/* Trust strip (used as the "Why Choose Us" icon grid too, see .dak-home-why-*) */

.dak-home-trust-grid {
	display: grid !important;
	grid-template-columns: repeat( 4, 1fr ) !important;
	gap: var( --dak-space-5 ) !important;
}

.dak-home-trust-card {
	background: var( --dak-bg-card ) !important;
	border: 1px solid var( --dak-border ) !important;
	border-radius: var( --dak-radius-md ) !important;
	padding: var( --dak-space-5 ) !important;
	box-shadow: var( --dak-shadow ) !important;
}

.dak-home-trust-icon {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 44px !important;
	height: 44px !important;
	border-radius: var( --dak-radius-md ) !important;
	background: var( --dak-primary-tint ) !important;
	color: var( --dak-primary-dark ) !important;
	margin-bottom: var( --dak-space-3 ) !important;
}

.dak-home-trust-icon svg {
	width: 22px !important;
	height: 22px !important;
}

.dak-home-trust-card h3 {
	font-size: var( --dak-text-lg ) !important;
	font-weight: 700 !important;
	margin: 0 0 var( --dak-space-2 ) !important;
	color: var( --dak-text ) !important;
}

.dak-home-trust-card p {
	font-size: var( --dak-text-sm ) !important;
	color: var( --dak-muted ) !important;
	margin: 0 !important;
	line-height: 1.55 !important;
}

/* Why Choose Us — plain centered icon columns, no card chrome */

.dak-home-why .dak-directory-header {
	text-align: center !important;
}

.dak-home-why-grid {
	display: grid !important;
	grid-template-columns: repeat( 4, 1fr ) !important;
	gap: var( --dak-space-5 ) !important;
	margin-top: var( --dak-space-6 ) !important;
}

.dak-home-why-item {
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	text-align: center !important;
}

.dak-home-why-icon {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 48px !important;
	height: 48px !important;
	border-radius: 50% !important;
	background: var( --dak-primary-tint ) !important;
	color: var( --dak-primary-dark ) !important;
	margin-bottom: var( --dak-space-3 ) !important;
}

.dak-home-why-icon svg {
	width: 22px !important;
	height: 22px !important;
}

.dak-home-why-item h3 {
	font-size: var( --dak-text-md ) !important;
	font-weight: 700 !important;
	margin: 0 0 var( --dak-space-1 ) !important;
	color: var( --dak-text ) !important;
}

.dak-home-why-item p {
	font-size: var( --dak-text-sm ) !important;
	color: var( --dak-muted ) !important;
	margin: 0 !important;
	line-height: 1.5 !important;
}

/* Testimonial band — dark, full-bleed within the page's max-width */

.dak-home-testimonial-band {
	margin-top: var( --dak-space-8 ) !important;
	/* Deliberately fixed (not a --dak-text/--dak-bg-* token, which flip with
	   the light/dark toggle) — this band stays dark in both modes, matching
	   the reference design. */
	background: #14161a !important;
	border-radius: var( --dak-radius-lg ) !important;
	padding: var( --dak-space-7 ) var( --dak-space-6 ) !important;
}

.dak-home-testimonial-band-inner {
	display: grid !important;
	grid-template-columns: 1.4fr 1fr !important;
	gap: var( --dak-space-6 ) !important;
	align-items: center !important;
}

.dak-home-testimonial-band-quote .dak-eyebrow {
	background: rgba( 255, 255, 255, 0.1 ) !important;
	color: var( --dak-primary ) !important;
}

.dak-home-testimonial-band-quote p {
	color: #fff !important;
	font-size: var( --dak-text-xl ) !important;
	font-weight: 600 !important;
	line-height: 1.45 !important;
	margin: var( --dak-space-3 ) 0 !important;
}

.dak-home-testimonial-band-author {
	color: #9198a3 !important;
	font-size: var( --dak-text-sm ) !important;
}

.dak-home-testimonial-band-stats {
	display: flex !important;
	flex-direction: column !important;
	gap: var( --dak-space-4 ) !important;
}

.dak-home-testimonial-band-stats strong {
	display: block !important;
	color: var( --dak-primary ) !important;
	font-size: var( --dak-text-2xl ) !important;
	font-weight: 800 !important;
}

.dak-home-testimonial-band-stats span {
	color: #9198a3 !important;
	font-size: var( --dak-text-sm ) !important;
}

/* Visit Us / clinics */

.dak-home-clinics-grid {
	display: grid !important;
	grid-template-columns: repeat( 3, 1fr ) !important;
	gap: var( --dak-space-5 ) !important;
	margin-top: var( --dak-space-5 ) !important;
}

.dak-home-clinic-card {
	display: flex !important;
	flex-direction: column !important;
	gap: var( --dak-space-2 ) !important;
	background: var( --dak-bg-card ) !important;
	border: 1px solid var( --dak-border ) !important;
	border-radius: var( --dak-radius-md ) !important;
	padding: var( --dak-space-4 ) !important;
	box-shadow: var( --dak-shadow ) !important;
}

.dak-home-clinic-card strong {
	font-size: var( --dak-text-md ) !important;
	color: var( --dak-text ) !important;
}

.dak-home-clinic-meta {
	display: flex !important;
	align-items: flex-start !important;
	gap: var( --dak-space-2 ) !important;
	font-size: var( --dak-text-sm ) !important;
	color: var( --dak-muted ) !important;
}

.dak-home-clinic-meta .dak-location-icon {
	flex: 0 0 auto !important;
	width: 14px !important;
	height: 14px !important;
	margin-top: 0.15rem !important;
	color: var( --dak-secondary ) !important;
}

.dak-home-clinic-meta .dak-location-icon svg {
	width: 100% !important;
	height: 100% !important;
}

/* Final CTA band */

.dak-home-cta {
	margin-top: var( --dak-space-8 ) !important;
	background: var( --dak-primary-tint ) !important;
	border-radius: var( --dak-radius-lg ) !important;
	padding: var( --dak-space-6 ) !important;
}

.dak-home-cta-inner {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	flex-wrap: wrap !important;
	gap: var( --dak-space-4 ) !important;
}

.dak-home-cta h2 {
	color: var( --dak-text ) !important;
	font-size: var( --dak-text-xl ) !important;
	font-weight: 800 !important;
	margin: 0 0 var( --dak-space-1 ) !important;
}

.dak-home-cta p {
	color: var( --dak-muted ) !important;
	font-size: var( --dak-text-md ) !important;
	margin: 0 !important;
}

/* Video grid + lightbox (marketing reel + admin-uploaded videos) */

.dak-home-videos-grid {
	display: grid !important;
	grid-template-columns: repeat( 3, 1fr ) !important;
	gap: var( --dak-space-5 ) !important;
	margin-top: var( --dak-space-5 ) !important;
}

.dak-home-video-card {
	position: relative !important;
	display: flex !important;
	align-items: flex-end !important;
	aspect-ratio: 16 / 10 !important;
	border: none !important;
	border-radius: var( --dak-radius-md ) !important;
	overflow: hidden !important;
	background: #000 !important;
	cursor: pointer !important;
	padding: 0 !important;
	box-shadow: var( --dak-shadow ) !important;
	transition: transform 0.15s ease, box-shadow 0.15s ease !important;
}

.dak-home-video-card:hover {
	transform: translateY( -2px ) !important;
	box-shadow: var( --dak-shadow-hover ) !important;
}

.dak-home-video-card img,
.dak-home-video-card video {
	position: absolute !important;
	inset: 0 !important;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
}

.dak-home-video-play {
	position: absolute !important;
	top: 50% !important;
	left: 50% !important;
	transform: translate( -50%, -50% ) !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 56px !important;
	height: 56px !important;
	border-radius: 50% !important;
	background: rgba( 255, 255, 255, 0.92 ) !important;
	color: var( --dak-primary-dark ) !important;
	box-shadow: 0 4px 14px rgba( 0, 0, 0, 0.35 ) !important;
	pointer-events: none !important;
}

.dak-home-video-play svg {
	width: 22px !important;
	height: 22px !important;
	margin-left: 2px !important;
}

.dak-home-video-title {
	position: relative !important;
	z-index: 1 !important;
	width: 100% !important;
	padding: var( --dak-space-4 ) var( --dak-space-3 ) var( --dak-space-2 ) !important;
	background: linear-gradient( 180deg, transparent 0%, rgba( 0, 0, 0, 0.75 ) 100% ) !important;
	color: #fff !important;
	font-size: var( --dak-text-sm ) !important;
	font-weight: 700 !important;
	text-align: left !important;
}

.dak-home-video-modal {
	position: fixed !important;
	inset: 0 !important;
	z-index: 9999 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	padding: var( --dak-space-5 ) !important;
}

.dak-home-video-modal[aria-hidden='true'] {
	display: none !important;
}

.dak-home-video-modal-overlay {
	position: absolute !important;
	inset: 0 !important;
	background: rgba( 10, 12, 15, 0.8 ) !important;
}

.dak-home-video-modal-dialog {
	position: relative !important;
	z-index: 1 !important;
	width: 100% !important;
	max-width: 860px !important;
	background: #000 !important;
	border-radius: var( --dak-radius-md ) !important;
	box-shadow: var( --dak-shadow-lg ) !important;
	overflow: hidden !important;
}

.dak-home-video-modal-title {
	margin: 0 !important;
	padding: var( --dak-space-3 ) var( --dak-space-4 ) !important;
	background: #000 !important;
	color: #fff !important;
	font-size: var( --dak-text-md ) !important;
}

.dak-home-video-modal-dialog video {
	display: block !important;
	width: 100% !important;
	max-height: 75vh !important;
	background: #000 !important;
}

.dak-home-video-modal-close {
	position: absolute !important;
	top: var( --dak-space-2 ) !important;
	right: var( --dak-space-2 ) !important;
	z-index: 2 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 36px !important;
	height: 36px !important;
	border: none !important;
	border-radius: 50% !important;
	background: rgba( 255, 255, 255, 0.9 ) !important;
	color: var( --dak-text ) !important;
	font-size: 1.3rem !important;
	line-height: 1 !important;
	cursor: pointer !important;
}

@media ( max-width: 900px ) {
	.dak-home-hero-grid {
		grid-template-columns: 1fr !important;
	}

	.dak-home-hero-card {
		max-width: 360px !important;
	}

	.dak-home-hero-stats-strip,
	.dak-home-trust-grid,
	.dak-home-why-grid {
		grid-template-columns: repeat( 2, 1fr ) !important;
	}

	.dak-home-testimonial-band-inner {
		grid-template-columns: 1fr !important;
	}

	.dak-home-clinics-grid,
	.dak-home-videos-grid {
		grid-template-columns: 1fr !important;
	}

	.dak-home-hero-copy h1 {
		font-size: var( --dak-text-2xl ) !important;
	}
}

@media ( max-width: 560px ) {
	.dak-home-hero-stats-strip,
	.dak-home-trust-grid,
	.dak-home-why-grid {
		grid-template-columns: 1fr !important;
	}

	.dak-home-cta-inner {
		flex-direction: column !important;
		align-items: flex-start !important;
	}
}