/*
Theme Name: Best DSS
Theme URI: http://localhost/bestdss
Author: Ralph Aure
Description: A Tailwind-powered WordPress theme.
Version: 1.0
Text Domain: BestDss
*/
/*! tailwindcss v4.1.12 | MIT License | https://tailwindcss.com */

html,
body {
	margin: 0;
	padding: 0;
}

:root {
	--bestdss-ink: #12263a;
	--bestdss-primary: #245d8f;
	--bestdss-primary-dark: #173d62;
	--bestdss-secondary: #b7744b;
	--bestdss-sand: #f6efe4;
	--bestdss-surface: #ffffff;
	--bestdss-border: rgba(18, 38, 58, 0.14);
	--bestdss-muted: #4b647b;
	--bestdss-soft-blue: #e8f1f8;
	--bestdss-soft-warm: #f6e4d4;
}

body {
	color: var(--bestdss-ink);
	font-size: 18px;
	line-height: 1.7;
	background:
		radial-gradient(circle at top left, rgba(180, 116, 75, 0.08), transparent 30%),
		radial-gradient(circle at top right, rgba(36, 93, 143, 0.08), transparent 26%),
		linear-gradient(180deg, #fffdf9 0%, #f7f1e8 100%);
}

h1,
h2,
h3,
h4,
h5,
h6 {
	color: var(--bestdss-ink);
	letter-spacing: -0.02em;
}

.bestdss-page-title {
	text-wrap: balance;
}

.bestdss-home-tagline {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	border-radius: 999px;
	border: 1px solid rgba(36, 93, 143, 0.18);
	background: rgba(255, 255, 255, 0.82);
	padding: 0.55rem 1rem;
	font-size: 0.875rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--bestdss-primary-dark);
	box-shadow: 0 10px 20px rgba(18, 38, 58, 0.08);
}

.bestdss-home-summary {
	border: 1px solid rgba(36, 93, 143, 0.15);
	border-radius: 1.5rem;
	background: linear-gradient(135deg, rgba(232, 241, 248, 0.9), rgba(246, 228, 212, 0.78));
	padding: 1.1rem 1.2rem;
	box-shadow: 0 14px 28px rgba(18, 38, 58, 0.08);
}

.bestdss-home-summary p {
	color: var(--bestdss-muted);
	font-size: 1rem;
	line-height: 1.75;
}

.bestdss-button,
.bestdss-inline-button,
.bestdss-home .bestdss-button,
.bestdss-home .bestdss-inline-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.55rem;
	min-height: 3.25rem;
	border-radius: 999px;
	padding: 0.95rem 1.45rem;
	font-size: 1rem;
	font-weight: 800;
	line-height: 1;
	text-decoration: none;
	transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
	box-shadow: 0 12px 24px rgba(18, 38, 58, 0.12);
}

.bestdss-button--primary {
	border: 2px solid var(--bestdss-primary);
	background: var(--bestdss-primary);
	color: #ffffff;
}

.bestdss-button--primary:hover {
	background: var(--bestdss-primary-dark);
	border-color: var(--bestdss-primary-dark);
	color: #ffffff;
}

.bestdss-button--secondary {
	border: 2px solid var(--bestdss-primary);
	background: #ffffff;
	color: var(--bestdss-primary);
}

.bestdss-button--secondary:hover {
	background: var(--bestdss-primary);
	color: #ffffff;
}

.bestdss-button:focus-visible,
.bestdss-inline-button:focus-visible,
.bestdss-home a:focus-visible,
.bestdss-home button:focus-visible {
	outline: 3px solid rgba(183, 116, 75, 0.45);
	outline-offset: 3px;
}

.bestdss-card {
	border: 1px solid var(--bestdss-border);
	border-radius: 1.75rem;
	background: var(--bestdss-surface);
	box-shadow: 0 12px 28px rgba(18, 38, 58, 0.08);
}

.bestdss-card-soft {
	border: 1px solid rgba(36, 93, 143, 0.12);
	background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
}

.bestdss-service-card {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	padding: 1.5rem;
	min-height: 100%;
}

.bestdss-service-icon {
	display: inline-flex;
	height: 3.5rem;
	width: 3.5rem;
	align-items: center;
	justify-content: center;
	border-radius: 1rem;
	background: var(--bestdss-soft-blue);
	color: var(--bestdss-primary);
	flex: none;
}

.bestdss-service-summary {
	color: var(--bestdss-muted);
	font-size: 1rem;
	line-height: 1.75;
}

.bestdss-callout {
	border: 1px solid rgba(36, 93, 143, 0.15);
	border-radius: 1.75rem;
	background: linear-gradient(135deg, rgba(36, 93, 143, 0.98), rgba(23, 61, 98, 0.98));
	box-shadow: 0 18px 36px rgba(18, 38, 58, 0.18);
	color: #ffffff;
}

.bestdss-callout p,
.bestdss-callout li,
.bestdss-callout h2,
.bestdss-callout h3 {
	color: inherit;
}

.bestdss-callout .bestdss-inline-button,
.bestdss-callout .bestdss-button {
	box-shadow: none;
}

.bestdss-easy-read {
	border: 1px solid rgba(18, 38, 58, 0.12);
	border-radius: 1.5rem;
	background: linear-gradient(135deg, rgba(255, 255, 255, 0.92), rgba(246, 228, 212, 0.72));
	padding: 1rem 1.1rem;
}

.bestdss-easy-read p,
.bestdss-easy-read li {
	color: var(--bestdss-muted);
	font-size: 1rem;
	line-height: 1.7;
}

.bestdss-pill-list {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
}

.bestdss-pill {
	display: inline-flex;
	align-items: center;
	border-radius: 999px;
	background: rgba(36, 93, 143, 0.08);
	padding: 0.5rem 0.9rem;
	font-size: 0.95rem;
	font-weight: 700;
	color: var(--bestdss-primary-dark);
}

.bestdss-steps .bestdss-step {
	border: 1px solid rgba(255, 255, 255, 0.18);
	background: rgba(255, 255, 255, 0.96);
	box-shadow: 0 10px 22px rgba(18, 38, 58, 0.12);
}

.bestdss-steps .bestdss-step-number {
	display: inline-flex;
	height: 2.25rem;
	width: 2.25rem;
	align-items: center;
	justify-content: center;
	border-radius: 999px;
	background: var(--bestdss-primary);
	color: #ffffff;
	font-weight: 800;
}

.bestdss-mute-link {
	font-weight: 800;
	color: var(--bestdss-primary);
	text-decoration: none;
}

.bestdss-mute-link:hover {
	color: var(--bestdss-primary-dark);
	text-decoration: underline;
}

@media screen and (max-width: 640px) {
	body {
		font-size: 17px;
	}

	.bestdss-button,
	.bestdss-inline-button {
		width: 100%;
	}

	.bestdss-home-tagline {
		font-size: 0.8rem;
	}
}

.bestdss-site-header {
	position: fixed !important;
	top: 0;
	left: 0;
	right: 0;
	width: 100%;
	z-index: 9999;
}

#bestdss-victoria-map,
#bestdss-victoria-map .leaflet-container {
	position: relative;
	z-index: 1;
}

#bestdss-victoria-map .leaflet-pane,
#bestdss-victoria-map .leaflet-top,
#bestdss-victoria-map .leaflet-bottom,
#bestdss-victoria-map .leaflet-control {
	z-index: 2;
}

.admin-bar .bestdss-site-header {
	top: 0 !important;
}

@media screen and (max-width: 782px) {
	.admin-bar .bestdss-site-header {
		top: 0 !important;
	}
}

/* Bullet-proof menu reset */
.menu-reset,
.menu-reset ul,
.menu-reset li,
.bestdss-nav-desktop ul,
.bestdss-nav-desktop li,
.bestdss-nav-mobile ul,
.bestdss-nav-mobile li {
	list-style: none !important;
	list-style-type: none !important;
	margin: 0;
	padding: 0;
}

.bestdss-nav-desktop li,
.bestdss-nav-mobile li {
	display: block;
}

.bestdss-nav-desktop a,
.bestdss-nav-mobile a {
	text-decoration: none;
}

html {
	scroll-behavior: smooth;
}

.bestdss-site-header {
	transition: transform 0.28s ease, background-color 0.28s ease, box-shadow 0.28s ease;
	will-change: transform;
}

.bestdss-site-header.bestdss-header-scrolled {
	background: rgba(255, 255, 255, 0.92) !important;
	box-shadow: 0 12px 26px rgba(15, 23, 42, 0.12);
}

.bestdss-site-header.bestdss-header-hidden {
	transform: translateY(-115%);
}

.bestdss-scroll-progress {
	position: fixed;
	top: 0;
	left: 0;
	height: 4px;
	width: 100%;
	transform-origin: left center;
	transform: scaleX(0);
	z-index: 10001;
	background: linear-gradient(90deg, #533285 0%, #7d56b8 50%, #9f7ad5 100%);
	box-shadow: 0 2px 10px rgba(83, 50, 133, 0.25);
	pointer-events: none;
}

.bestdss-reveal {
	opacity: 0;
	transform: translateY(28px);
	transition: opacity 0.55s ease var(--bestdss-reveal-delay, 0ms), transform 0.55s ease var(--bestdss-reveal-delay, 0ms);
}

.bestdss-reveal.bestdss-visible {
	opacity: 1;
	transform: translateY(0);
}

.bestdss-back-to-top {
	position: fixed;
	right: 1rem;
	bottom: 1rem;
	z-index: 10000;
	display: inline-flex;
	height: 46px;
	width: 46px;
	align-items: center;
	justify-content: center;
	border: 0;
	border-radius: 999px;
	background: #533285;
	color: #fff;
	box-shadow: 0 12px 22px rgba(83, 50, 133, 0.28);
	cursor: pointer;
	opacity: 0;
	transform: translateY(18px) scale(0.95);
	pointer-events: none;
	transition: opacity 0.24s ease, transform 0.24s ease, background-color 0.2s ease;
}

.bestdss-back-to-top:hover {
	background: #412766;
}

.bestdss-back-to-top.is-visible {
	opacity: 1;
	transform: translateY(0) scale(1);
	pointer-events: auto;
}

.bestdss-live-interactive a,
.bestdss-live-interactive button {
	transition: transform 0.2s ease, filter 0.2s ease;
}

.bestdss-live-interactive a:hover,
.bestdss-live-interactive button:hover {
	filter: brightness(1.03);
}

.bestdss-live-interactive a:active,
.bestdss-live-interactive button:active {
	transform: translateY(1px);
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	.bestdss-site-header,
	.bestdss-scroll-progress,
	.bestdss-reveal,
	.bestdss-back-to-top {
		transition: none !important;
	}

	.bestdss-reveal {
		opacity: 1;
		transform: none;
	}
}

/* Accommodation badges and small chips */
[data-availability-badge] {
	font-weight: 700;
	letter-spacing: 0.02em;
}

.accom-top-chips span {
	box-shadow: 0 6px 18px rgba(2,6,23,0.08);
}

.accom-card-grid {
	display: grid;
	gap: 1rem;
}

/* ========================================
   CULTURAL PATTERN LAYER
   African-inspired geometric and woven patterns
   ======================================== */

/* Pattern: Woven Textile Style */
.bestdss-pattern-woven {
	background-image:
		repeating-linear-gradient(45deg, transparent, transparent 35px, rgba(183, 116, 75, 0.08) 35px, rgba(183, 116, 75, 0.08) 70px),
		repeating-linear-gradient(-45deg, transparent, transparent 35px, rgba(183, 116, 75, 0.06) 35px, rgba(183, 116, 75, 0.06) 70px),
		radial-gradient(circle 2px at 20px 20px, rgba(183, 116, 75, 0.12), rgba(183, 116, 75, 0.12));
	background-size: 100% 100%, 100% 100%, 40px 40px;
	background-attachment: fixed;
}

/* Pattern: Geometric Circles & Squares */
.bestdss-pattern-geometric {
	background-image:
		radial-gradient(circle at 40px 40px, transparent 30px, rgba(36, 93, 143, 0.08) 31px),
		radial-gradient(circle at 40px 40px, transparent 20px, rgba(183, 116, 75, 0.06) 21px),
		url("data:image/svg+xml,%3Csvg width='80' height='80' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='35' y='35' width='10' height='10' fill='%23b7744b' opacity='0.12'/%3E%3C/svg%3E");
	background-size: 80px 80px, 80px 80px, 80px 80px;
	background-position: 0 0, 0 0, 0 0;
	background-repeat: repeat;
}

/* Pattern: Triangle Motifs */
.bestdss-pattern-triangular {
	background-image:
		url("data:image/svg+xml,%3Csvg width='60' height='60' xmlns='http://www.w3.org/2000/svg'%3E%3Cpolygon points='30,5 55,50 5,50' fill='none' stroke='%23245d8f' stroke-width='1.5' opacity='0.2'/%3E%3Cpolygon points='30,15 48,45 12,45' fill='none' stroke='%23b7744b' stroke-width='1' opacity='0.15'/%3E%3Ccircle cx='30' cy='30' r='8' fill='%23b7744b' opacity='0.12'/%3E%3C/svg%3E");
	background-size: 60px 60px;
	background-repeat: repeat;
}

/* Pattern: Honeycomb/Hexagonal */
.bestdss-pattern-honeycomb {
	background-image:
		url("data:image/svg+xml,%3Csvg width='70' height='80' xmlns='http://www.w3.org/2000/svg'%3E%3Cpolygon points='35,5 65,20 65,50 35,65 5,50 5,20' fill='none' stroke='%23b7744b' stroke-width='1.5' opacity='0.15'/%3E%3Ccircle cx='35' cy='35' r='12' fill='%23245d8f' opacity='0.08'/%3E%3C/svg%3E");
	background-size: 70px 80px;
	background-repeat: repeat;
}

/* Pattern: Connection Nodes (Community theme) */
.bestdss-pattern-connection {
	background-image:
		url("data:image/svg+xml,%3Csvg width='100' height='100' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='20' cy='20' r='4' fill='%23245d8f' opacity='0.2'/%3E%3Ccircle cx='80' cy='20' r='4' fill='%23b7744b' opacity='0.2'/%3E%3Ccircle cx='50' cy='70' r='4' fill='%23245d8f' opacity='0.2'/%3E%3Cline x1='20' y1='20' x2='50' y2='70' stroke='%23b7744b' stroke-width='1.5' opacity='0.15'/%3E%3Cline x1='80' y1='20' x2='50' y2='70' stroke='%23245d8f' stroke-width='1.5' opacity='0.15'/%3E%3Cline x1='20' y1='20' x2='80' y2='20' stroke='%23b7744b' stroke-width='1.5' opacity='0.12'/%3E%3C/svg%3E");
	background-size: 100px 100px;
	background-repeat: repeat;
}

/* Pattern: Woven Lines */
.bestdss-pattern-lines {
	background-image:
		repeating-linear-gradient(0deg, transparent, transparent 9px, rgba(36, 93, 143, 0.08) 9px, rgba(36, 93, 143, 0.08) 11px),
		repeating-linear-gradient(0deg, transparent, transparent 24px, rgba(183, 116, 75, 0.1) 24px, rgba(183, 116, 75, 0.1) 26px),
		url("data:image/svg+xml,%3Csvg width='50' height='50' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='10' cy='25' r='2' fill='%23b7744b' opacity='0.15'/%3E%3Ccircle cx='30' cy='25' r='2' fill='%23b7744b' opacity='0.15'/%3E%3Ccircle cx='50' cy='25' r='2' fill='%23b7744b' opacity='0.15'/%3E%3C/svg%3E");
	background-size: 100% 100%, 100% 100%, 50px 50px;
	background-repeat: repeat;
}

/* Pattern: Layered Combination (for special sections) */
.bestdss-pattern-layered {
	background-image:
		repeating-linear-gradient(45deg, transparent, transparent 35px, rgba(183, 116, 75, 0.05) 35px, rgba(183, 116, 75, 0.05) 70px),
		radial-gradient(circle at 40px 40px, transparent 30px, rgba(36, 93, 143, 0.06) 31px),
		url("data:image/svg+xml,%3Csvg width='70' height='80' xmlns='http://www.w3.org/2000/svg'%3E%3Cpolygon points='35,5 65,20 65,50 35,65 5,50 5,20' fill='none' stroke='%23b7744b' stroke-width='1' opacity='0.1'/%3E%3C/svg%3E");
	background-size: 100% 100%, 80px 80px, 70px 80px;
	background-repeat: repeat;
}

/* Pattern overlay utility (for full-page sections) */
.bestdss-pattern-overlay::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	pointer-events: none;
	z-index: 0;
}

.bestdss-pattern-woven.bestdss-pattern-overlay::before {
	background-image:
		repeating-linear-gradient(45deg, transparent, transparent 35px, rgba(183, 116, 75, 0.08) 35px, rgba(183, 116, 75, 0.08) 70px),
		repeating-linear-gradient(-45deg, transparent, transparent 35px, rgba(183, 116, 75, 0.06) 35px, rgba(183, 116, 75, 0.06) 70px);
	background-size: 100% 100%, 100% 100%;
}

.bestdss-pattern-geometric.bestdss-pattern-overlay::before {
	background-image:
		radial-gradient(circle at 40px 40px, transparent 30px, rgba(36, 93, 143, 0.08) 31px),
		radial-gradient(circle at 40px 40px, transparent 20px, rgba(183, 116, 75, 0.06) 21px);
	background-size: 80px 80px, 80px 80px;
}

.bestdss-pattern-connection.bestdss-pattern-overlay::before {
	background-image:
		url("data:image/svg+xml,%3Csvg width='100' height='100' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='20' cy='20' r='4' fill='%23245d8f' opacity='0.2'/%3E%3Ccircle cx='80' cy='20' r='4' fill='%23b7744b' opacity='0.2'/%3E%3Ccircle cx='50' cy='70' r='4' fill='%23245d8f' opacity='0.2'/%3E%3Cline x1='20' y1='20' x2='50' y2='70' stroke='%23b7744b' stroke-width='1.5' opacity='0.15'/%3E%3Cline x1='80' y1='20' x2='50' y2='70' stroke='%23245d8f' stroke-width='1.5' opacity='0.15'/%3E%3Cline x1='20' y1='20' x2='80' y2='20' stroke='%23b7744b' stroke-width='1.5' opacity='0.12'/%3E%3C/svg%3E");
	background-size: 100px 100px;
}

/* Ensure content stays above patterns */
.bestdss-pattern-overlay > * {
	position: relative;
	z-index: 1;
}