/**
 * Remoun Hybrid utility system
 * Mobile-first helpers for layout, spacing, typography, cards, and visibility.
 */

:root {
	--rh-container-max: 1200px;
	--rh-radius-md: 18px;
	--rh-shadow: 0 18px 45px rgba(15, 23, 42, 0.08);
	--rh-color-bg: #ffffff;
	--rh-color-muted: #64748b;
	--rh-color-primary: #0ea5e9;
	--rh-color-dark: #0f172a;
	--rh-gutter-size: 24px;
	--rh-type-scale: 1;
}

body {
	font-size: calc(1rem * var(--rh-type-scale, 1));
}

body.rh-layout-boxed {
	--rh-container-max: 1200px;
}

body.rh-layout-wide {
	--rh-container-max: 1400px;
}

body.rh-layout-full {
	--rh-container-max: 100%;
}

/* Layout */
.rh-container {
	width: min(100%, var(--rh-container-max));
	margin-inline: auto;
	padding: clamp(16px, 4vw, var(--rh-gutter-size, 32px));
}

.rh-flex {
	display: flex;
	flex-wrap: wrap;
	gap: var(--rh-gap, var(--rh-gutter-size, 16px));
}

.rh-flex-between {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--rh-gap, var(--rh-gutter-size, 16px));
}

.rh-flex-center {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--rh-gap, var(--rh-gutter-size, 12px));
}

.rh-grid {
	display: grid;
	gap: var(--rh-gap, var(--rh-gutter-size, 16px));
}

.rh-grid-2 {
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.rh-grid-3 {
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.rh-grid-4 {
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.rh-gap-8 { --rh-gap: 8px; }
.rh-gap-12 { --rh-gap: 12px; }
.rh-gap-24 { --rh-gap: 24px; }

/* Column helpers */
.rh-col-1-2 {
	flex: 1 1 100%;
}

.rh-col-1-3 {
	flex: 1 1 100%;
}

@media (min-width: 768px) {
	.rh-col-1-2 {
		flex: 1 1 calc(50% - 12px);
	}

	.rh-col-1-3 {
		flex: 1 1 calc(33.333% - 12px);
	}
}

@media (min-width: 1024px) {
	.rh-grid-2 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.rh-grid-3 {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.rh-grid-4 {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.rh-col-1-2 {
		flex: 1 1 calc(50% - 24px);
	}

	.rh-col-1-3 {
		flex: 1 1 calc(33.333% - 24px);
	}
}

/* Visibility helpers */
.rh-hide-mobile {
	display: initial;
}

.rh-hide-tablet {
	display: initial;
}

.rh-show-desktop {
	display: none;
}

@media (max-width: 480px) {
	.rh-hide-mobile {
		display: none !important;
	}
}

@media (min-width: 481px) and (max-width: 1024px) {
	.rh-hide-tablet {
		display: none !important;
	}
}

@media (min-width: 1024px) {
	.rh-show-desktop {
		display: initial;
	}
}

/* Spacing scale (0,4,8,12,16,24,32) */
.rh-mt-0 { margin-top: 0 !important; }
.rh-mt-4 { margin-top: 4px !important; }
.rh-mt-8 { margin-top: 8px !important; }
.rh-mt-12 { margin-top: 12px !important; }
.rh-mt-16 { margin-top: 16px !important; }
.rh-mt-24 { margin-top: 24px !important; }
.rh-mt-32 { margin-top: 32px !important; }

.rh-mb-0 { margin-bottom: 0 !important; }
.rh-mb-4 { margin-bottom: 4px !important; }
.rh-mb-8 { margin-bottom: 8px !important; }
.rh-mb-12 { margin-bottom: 12px !important; }
.rh-mb-16 { margin-bottom: 16px !important; }
.rh-mb-24 { margin-bottom: 24px !important; }
.rh-mb-32 { margin-bottom: 32px !important; }

.rh-pt-0 { padding-top: 0 !important; }
.rh-pt-4 { padding-top: 4px !important; }
.rh-pt-8 { padding-top: 8px !important; }
.rh-pt-12 { padding-top: 12px !important; }
.rh-pt-16 { padding-top: 16px !important; }
.rh-pt-24 { padding-top: 24px !important; }
.rh-pt-32 { padding-top: 32px !important; }

.rh-pb-0 { padding-bottom: 0 !important; }
.rh-pb-4 { padding-bottom: 4px !important; }
.rh-pb-8 { padding-bottom: 8px !important; }
.rh-pb-12 { padding-bottom: 12px !important; }
.rh-pb-16 { padding-bottom: 16px !important; }
.rh-pb-24 { padding-bottom: 24px !important; }
.rh-pb-32 { padding-bottom: 32px !important; }

/* Typography */
.rh-text-sm { font-size: calc(0.875rem * var(--rh-type-scale, 1)); line-height: 1.4; }
.rh-text-md { font-size: calc(1rem * var(--rh-type-scale, 1)); line-height: 1.6; }
.rh-text-lg { font-size: calc(1.125rem * var(--rh-type-scale, 1)); line-height: 1.6; }
.rh-text-xl { font-size: calc(clamp(1.4rem, 3vw, 1.75rem) * var(--rh-type-scale, 1)); line-height: 1.3; }
.rh-truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rh-muted { color: var(--rh-color-muted); }

/* Buttons */
.rh-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 12px 20px;
	min-height: 44px;
	border-radius: 999px;
	font-weight: 600;
	text-decoration: none;
	border: 1px solid transparent;
	transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}

.rh-btn--primary {
	background: var(--rh-color-primary);
	color: #fff;
}

.rh-btn--primary:hover,
.rh-btn--primary:focus-visible {
	background: #0284c7;
	color: #fff;
}

.rh-btn--ghost {
	border-color: rgba(255, 255, 255, 0.4);
	color: #fff;
	background: transparent;
}

.rh-btn--ghost:hover,
.rh-btn--ghost:focus-visible {
	border-color: #fff;
	color: #fff;
}

/* Cards */
.rh-card {
	background: var(--rh-color-bg);
	border-radius: var(--rh-radius-md);
	box-shadow: var(--rh-shadow);
	padding: clamp(16px, 4vw, 28px);
}
.footer-branding {
	text-align: left;
}
.footer-branding .rh-btn {
	margin-inline-end: 8px;
}
.rh-address-list,
.rh-contact-list {
	list-style: none;
	margin: 0;
	padding: 0;
}
.rh-address-list li,
.rh-contact-list li {
	margin-bottom: 6px;
	font-size: calc(0.95rem * var(--rh-type-scale, 1));
	line-height: 1.5;
}
.rh-contact-list a {
	color: inherit;
	text-decoration: underline;
}

@media (max-width: 768px) {
	.rh-card {
		display: block;
	}
}

.rh-nav-overlay {
	position: fixed;
	inset: 0;
	background: rgba(15, 23, 42, 0.65);
	display: none;
	z-index: 998;
}

.rh-nav-overlay.is-active {
	display: block;
}

/* Accessibility */
:where(a, button, input, textarea, .rh-btn) {
	min-height: 44px;
}

:where(a, button, input, textarea, .rh-btn):focus-visible {
	outline: 3px solid var(--rh-color-primary);
	outline-offset: 2px;
	border-radius: 8px;
}

@media (prefers-reduced-motion: reduce) {
	* {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}