/* ==========================================================================
   Whispers Egypt — Luxury Modern Travel Design System
   Typography: Plus Jakarta Sans (Headings & UI) + DM Sans (Body)
   Palette: Midnight Navy · Warm Logo Amber-Gold · Alabaster · Nile Teal
   ========================================================================== */

:root {
	--navy: #0B1623;
	--navy-deep: #060D16;
	--navy-soft: #132438;
	--gold: #D98A2B;
	--gold-light: #F3C77E;
	--gold-dark: #B86F18;
	--gold-soft: rgba(217, 138, 43, .12);
	--ivory: #F8F6F1;
	--sand: #F1ECE1;
	--terra: #C85A32;
	--teal: #14534E;
	--ink: #0F1D2C;
	--muted: #5B6B7C;
	--line: rgba(11, 22, 35, .09);
	--line-strong: rgba(11, 22, 35, .16);
	--line-light: rgba(255, 255, 255, .14);
	--white: #ffffff;

	--serif: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	--sans: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

	--wrap: 1320px;
	--wrap-narrow: 880px;
	--gutter: clamp(1.25rem, 4vw, 3rem);
	--radius: 10px;
	--radius-lg: 16px;
	--radius-xl: 22px;

	--shadow-sm: 0 2px 8px rgba(11, 22, 35, .05), 0 6px 20px rgba(11, 22, 35, .04);
	--shadow-md: 0 14px 36px rgba(11, 22, 35, .09);
	--shadow-lg: 0 24px 64px rgba(11, 22, 35, .16);
	--shadow-gold: 0 10px 28px rgba(217, 138, 43, .32);

	--ease: cubic-bezier(.22, .61, .36, 1);
	--t-fast: 160ms var(--ease);
	--t: 280ms var(--ease);
}

/* ==========================================================================
   Reset & Base
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; }

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
	overflow-x: clip;
}

body.wsp {
	margin: 0;
	background: var(--ivory);
	color: var(--ink);
	font-family: var(--sans);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.7;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	overflow-x: clip;
}

img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }

h1, h2, h3, h4, h5 {
	font-family: var(--serif);
	font-weight: 700;
	line-height: 1.16;
	margin: 0 0 .5em;
	letter-spacing: -.022em;
	color: var(--navy);
	text-wrap: balance;
}

p { margin: 0 0 1em; }

.wsp-wrap {
	width: 100%;
	max-width: var(--wrap);
	margin-inline: auto;
	padding-inline: var(--gutter);
}
.wsp-wrap--narrow { max-width: var(--wrap-narrow); }

.wsp-main { display: block; min-height: 40vh; }

.wsp-skip {
	position: absolute;
	left: -9999px;
	top: 0;
	background: var(--navy);
	color: #fff;
	padding: .75rem 1rem;
	z-index: 999;
}
.wsp-skip:focus { left: 1rem; top: 1rem; }

:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }

::selection { background: var(--gold-light); color: var(--navy-deep); }

/* ==========================================================================
   Typography & Section Headings
   ========================================================================== */
.wsp-h1 { font-size: clamp(2.25rem, 4.5vw, 3.6rem); font-weight: 800; letter-spacing: -.028em; }
.wsp-h2 { font-size: clamp(1.85rem, 3.4vw, 2.75rem); font-weight: 800; letter-spacing: -.025em; }
.wsp-h3 { font-size: clamp(1.25rem, 2vw, 1.6rem); font-weight: 700; }

.wsp-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	font-family: var(--serif);
	font-size: .74rem;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--gold-dark);
	background: var(--gold-soft);
	padding: .4rem .9rem;
	border-radius: 999px;
	margin: 0 0 1rem;
}

.wsp-lede {
	font-size: clamp(1rem, 1.2vw, 1.12rem);
	line-height: 1.75;
	color: var(--muted);
	max-width: 62ch;
	margin: 0;
}

.wsp-section-head { margin-bottom: clamp(2.25rem, 4vw, 3.25rem); }
.wsp-section-head--center,
.wsp-section-head--left { text-align: center; }
.wsp-section-head--center .wsp-lede,
.wsp-section-head--left .wsp-lede { margin-inline: auto; }

.wsp-pill-badge {
	display: inline-flex;
	align-items: center;
	gap: .45rem;
	font-family: var(--serif);
	font-size: .75rem;
	font-weight: 600;
	letter-spacing: .06em;
	color: var(--gold-light);
	background: rgba(255, 255, 255, .1);
	border: 1px solid rgba(243, 199, 126, .3);
	padding: .42rem .95rem;
	border-radius: 999px;
	margin-bottom: 1rem;
}

/* ==========================================================================
   Buttons — Modern Luxury Pill Buttons
   ========================================================================== */
.wsp-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .65rem;
	padding: .85rem 1.5rem;
	border-radius: 999px;
	font-family: var(--serif);
	font-size: .86rem;
	font-weight: 700;
	letter-spacing: .01em;
	line-height: 1;
	border: 1px solid transparent;
	cursor: pointer;
	transition: transform var(--t-fast), box-shadow var(--t), background var(--t-fast), color var(--t-fast), border-color var(--t-fast);
	white-space: nowrap;
}
.wsp-btn:hover { transform: translateY(-2px); }
.wsp-btn:active { transform: translateY(0); }

.wsp-btn--lg {
	padding: 1rem 1.75rem;
	font-size: .92rem;
}

.wsp-btn__arrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	border-radius: 999px;
	background: rgba(255, 255, 255, .22);
	transition: transform var(--t-fast), background var(--t-fast);
	margin-right: -.35rem;
}
.wsp-btn:hover .wsp-btn__arrow {
	transform: translateX(3px);
	background: rgba(255, 255, 255, .32);
}

.wsp-btn--primary,
.wsp-btn--solid {
	background: linear-gradient(135deg, #E59532 0%, #C67314 100%);
	color: #fff;
	box-shadow: var(--shadow-gold);
}
.wsp-btn--primary:hover,
.wsp-btn--solid:hover {
	background: linear-gradient(135deg, #F0A13E 0%, #D47E1A 100%);
	color: #fff;
	box-shadow: 0 14px 32px rgba(217, 138, 43, .42);
}

.wsp-btn--glass {
	background: rgba(255, 255, 255, .12);
	color: #fff;
	border-color: rgba(255, 255, 255, .32);
	backdrop-filter: blur(12px);
}
.wsp-btn--glass:hover {
	background: #fff;
	color: var(--navy);
	border-color: #fff;
}

.wsp-btn--ghost {
	background: #fff;
	color: var(--navy);
	border-color: var(--line-strong);
	box-shadow: var(--shadow-sm);
}
.wsp-btn--ghost:hover {
	background: var(--navy);
	color: #fff;
	border-color: var(--navy);
}

.wsp-btn--light {
	background: #fff;
	color: var(--navy);
	box-shadow: var(--shadow-sm);
}
.wsp-btn--light:hover {
	background: var(--gold-light);
	color: var(--navy-deep);
}

.wsp-btn--outline-light {
	background: rgba(255, 255, 255, .08);
	color: #fff;
	border-color: rgba(255, 255, 255, .35);
}
.wsp-btn--outline-light:hover {
	background: #fff;
	color: var(--navy-deep);
	border-color: #fff;
}

.wsp-btn--block { width: 100%; }

.wsp-linkbtn {
	background: none;
	border: 0;
	padding: 0;
	cursor: pointer;
	font-family: var(--serif);
	font-size: .8rem;
	font-weight: 700;
	color: var(--gold-dark);
	border-bottom: 1.5px solid currentColor;
	padding-bottom: 2px;
}

/* ==========================================================================
   Topbar + Header
   ========================================================================== */
.wsp-topbar {
	background: var(--navy-deep);
	color: rgba(255, 255, 255, .78);
	font-size: .78rem;
	font-weight: 500;
	border-bottom: 1px solid rgba(255, 255, 255, .08);
}
.wsp-topbar__inner {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 1rem;
	min-height: 40px;
}
.wsp-topbar__left {
	display: flex;
	align-items: center;
	gap: .75rem;
}
.wsp-topbar__pill {
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	background: rgba(217, 138, 43, .18);
	color: var(--gold-light);
	font-family: var(--serif);
	font-size: .7rem;
	font-weight: 700;
	padding: .2rem .65rem;
	border-radius: 999px;
	border: 1px solid rgba(217, 138, 43, .35);
}
.wsp-topbar__contact {
	display: flex;
	gap: .75rem;
	align-items: center;
}
.wsp-topbar__contact a {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	color: rgba(255, 255, 255, .88);
	transition: color var(--t-fast);
}
.wsp-topbar__contact a:hover { color: var(--gold-light); }
.wsp-topbar__contact .wsp-i { color: var(--gold-light); }

@media (max-width: 860px) {
	.wsp-topbar__note { display: none; }
}
@media (max-width: 560px) {
	.wsp-topbar__left { display: none; }
	.wsp-topbar__inner { justify-content: center; min-height: 34px; }
	.wsp-topbar__contact { font-size: .72rem; gap: .45rem; }
}

.wsp-header {
	position: sticky;
	top: 0;
	z-index: 95;
	background: #ffffff;
	border-bottom: 1px solid var(--line);
	box-shadow: 0 4px 24px rgba(11, 22, 35, .05);
}
.wsp-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
	min-height: 82px;
}

.wsp-brand { display: flex; align-items: center; flex: 0 0 auto; }
.wsp-brand img,
.wsp-brand__img { max-height: 52px; width: auto; }
.wsp-brand__text {
	font-family: var(--serif);
	font-size: 1.5rem;
	font-weight: 800;
	color: var(--navy);
	display: flex;
	flex-direction: column;
	line-height: 1;
}
.wsp-brand__text span {
	font-size: .65rem;
	font-weight: 700;
	letter-spacing: .32em;
	text-transform: uppercase;
	color: var(--gold-dark);
	margin-top: .25rem;
}

.wsp-nav { margin-inline: auto; }
.wsp-nav__list {
	display: flex;
	align-items: center;
	gap: .35rem;
	list-style: none;
	margin: 0;
	padding: 0;
	font-family: var(--serif);
	font-size: .9rem;
	font-weight: 600;
}
.wsp-nav__list > li > a {
	position: relative;
	padding: .55rem .95rem;
	color: var(--navy);
	border-radius: 999px;
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	transition: background var(--t-fast), color var(--t-fast);
}
.wsp-nav__list > li > a:hover,
.wsp-nav__list > li.current-menu-item > a {
	background: var(--ivory);
	color: var(--gold-dark);
}
.wsp-nav__list > li.menu-item-has-children > a::after {
	content: '';
	width: 6px;
	height: 6px;
	border-right: 1.8px solid currentColor;
	border-bottom: 1.8px solid currentColor;
	transform: rotate(45deg);
	margin-top: -2px;
	opacity: .65;
}

.wsp-nav__list li { position: relative; }
.wsp-nav__list .sub-menu {
	position: absolute;
	top: calc(100% + 4px);
	left: 0;
	list-style: none;
	margin: 0;
	padding: .6rem;
	background: #fff;
	border: 1px solid var(--line);
	border-radius: var(--radius-lg);
	box-shadow: var(--shadow-lg);
	min-width: 240px;
	display: none;
	font-size: .88rem;
	font-weight: 600;
	z-index: 30;
}
.wsp-nav__list li:hover > .sub-menu,
.wsp-nav__list li:focus-within > .sub-menu { display: block; }
.wsp-nav__list .sub-menu a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: .6rem .9rem;
	border-radius: 8px;
	color: var(--ink);
	transition: background var(--t-fast), color var(--t-fast);
}
.wsp-nav__list .sub-menu a:hover {
	background: var(--gold-soft);
	color: var(--gold-dark);
}

.wsp-header__actions {
	display: flex;
	align-items: center;
	gap: .65rem;
}

.wsp-header__wa {
	display: inline-flex;
	align-items: center;
	gap: .45rem;
	padding: .65rem 1.05rem;
	border-radius: 999px;
	border: 1px solid var(--line-strong);
	background: #fff;
	font-family: var(--serif);
	font-size: .82rem;
	font-weight: 700;
	color: var(--navy);
	transition: border-color var(--t-fast), background var(--t-fast);
}
.wsp-header__wa:hover {
	border-color: #16A34A;
	background: rgba(22, 163, 74, .05);
}
.wsp-header__wa .wsp-i { color: #16A34A; }
.wsp-header__wa-dot {
	width: 7px;
	height: 7px;
	border-radius: 999px;
	background: #16A34A;
	box-shadow: 0 0 0 3px rgba(22, 163, 74, .2);
}

.wsp-burger {
	display: none;
	width: 44px;
	height: 44px;
	border: 1px solid var(--line-strong);
	border-radius: 999px;
	background: #fff;
	position: relative;
	cursor: pointer;
}
.wsp-burger span {
	position: absolute;
	left: 12px;
	right: 12px;
	height: 2px;
	background: var(--navy);
	border-radius: 2px;
	transition: transform var(--t);
}
.wsp-burger span:first-child { top: 17px; }
.wsp-burger span:last-child { top: 24px; }

.wsp-nav__drawer-head,
.wsp-nav__drawer-foot,
.wsp-nav-backdrop {
	display: none;
}

@media (max-width: 1120px) {
	.wsp-header__wa span:last-child { display: none; }
}
@media (max-width: 1024px) {
	.wsp-nav-backdrop {
		display: block;
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		width: 100vw;
		height: 100vh;
		height: 100dvh;
		background: rgba(6, 13, 22, .62);
		backdrop-filter: blur(4px);
		z-index: 190;
		opacity: 0;
		visibility: hidden;
		transition: opacity var(--t), visibility var(--t);
	}
	body.is-nav-open .wsp-nav-backdrop {
		opacity: 1;
		visibility: visible;
	}

	.wsp-nav {
		position: fixed;
		top: 0;
		right: 0;
		bottom: 0;
		left: auto;
		width: min(360px, 88vw);
		height: 100vh;
		height: 100dvh;
		background: #ffffff;
		box-shadow: -16px 0 48px rgba(6, 13, 22, .28);
		padding: 0;
		display: flex;
		flex-direction: column;
		transform: translateX(100%);
		transition: transform var(--t), visibility var(--t);
		z-index: 200;
		overflow: hidden;
		visibility: hidden;
	}
	.wsp-nav.is-open {
		transform: none;
		visibility: visible;
	}

	.wsp-nav__drawer-head {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 1rem 1.25rem;
		border-bottom: 1px solid var(--line);
		flex: 0 0 auto;
	}
	.wsp-nav__drawer-head .wsp-brand__img {
		max-height: 44px;
		width: auto;
	}
	.wsp-nav__close {
		width: 40px;
		height: 40px;
		border-radius: 999px;
		border: 1px solid var(--line-strong);
		background: var(--ivory);
		color: var(--navy);
		font-size: 1rem;
		font-weight: 700;
		cursor: pointer;
		display: inline-flex;
		align-items: center;
		justify-content: center;
	}

	.wsp-nav__list {
		flex-direction: column;
		align-items: stretch;
		gap: .2rem;
		padding: 1rem 1.25rem;
		overflow-y: auto;
		flex: 1 1 auto;
	}
	.wsp-nav__list > li {
		border-bottom: 1px solid var(--line);
		padding-bottom: .35rem;
		margin-bottom: .35rem;
	}
	.wsp-nav__list > li:last-child {
		border-bottom: 0;
	}
	.wsp-nav__list > li > a {
		padding: .75rem .85rem;
		border-radius: 10px;
		justify-content: space-between;
		font-size: 1rem;
		font-weight: 700;
	}
	.wsp-nav__list .sub-menu {
		position: static;
		display: grid;
		grid-template-columns: 1fr;
		gap: .15rem;
		box-shadow: none;
		border: 0;
		border-left: 2px solid rgba(217, 138, 43, .35);
		border-radius: 0;
		margin: .2rem 0 .4rem .85rem;
		padding: 0 0 0 .75rem;
		min-width: 0;
	}
	.wsp-nav__list .sub-menu a {
		padding: .48rem .65rem;
		font-size: .86rem;
		font-weight: 600;
		color: var(--muted);
	}

	.wsp-nav__drawer-foot {
		display: grid;
		gap: .6rem;
		padding: 1rem 1.25rem 1.35rem;
		border-top: 1px solid var(--line);
		background: var(--ivory);
		flex: 0 0 auto;
	}

	.wsp-burger { display: block; }
}
@media (max-width: 620px) {
	.wsp-header__actions .wsp-btn--primary { display: none; }
}

/* ==========================================================================
   Hero — 2-Column Luxury Showcase
   ========================================================================== */
.wsp-hero {
	position: relative;
	min-height: clamp(600px, 82vh, 820px);
	display: flex;
	align-items: center;
	background: var(--navy-deep);
	color: #fff;
	overflow: hidden;
	padding-block: clamp(3rem, 6vw, 5.5rem) clamp(5.5rem, 9vw, 7.5rem);
}
.wsp-hero__bg { position: absolute; inset: 0; z-index: 0; }
.wsp-hero__bg img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center 45%;
	filter: saturate(1.08);
}
.wsp-hero__bg::after {
	content: '';
	position: absolute;
	inset: 0;
	background:
		linear-gradient(95deg, rgba(6, 13, 22, .92) 0%, rgba(6, 13, 22, .74) 52%, rgba(6, 13, 22, .45) 100%),
		linear-gradient(180deg, rgba(6, 13, 22, .3) 0%, transparent 35%, rgba(6, 13, 22, .92) 100%);
}

.wsp-hero__grid {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr);
	gap: clamp(2rem, 4.5vw, 4rem);
	align-items: center;
}

.wsp-hero__badge {
	display: inline-flex;
	align-items: center;
	gap: .6rem;
	background: rgba(255, 255, 255, .1);
	border: 1px solid rgba(243, 199, 126, .35);
	backdrop-filter: blur(10px);
	padding: .45rem 1rem;
	border-radius: 999px;
	font-family: var(--serif);
	font-size: .78rem;
	font-weight: 600;
	color: #fff;
	margin-bottom: 1.35rem;
}
.wsp-hero__badge-stars {
	color: #FBBF24;
	letter-spacing: 1px;
}

.wsp-hero h1 {
	color: #fff;
	font-size: clamp(2.4rem, 5vw, 4.15rem);
	font-weight: 800;
	line-height: 1.08;
	letter-spacing: -.028em;
	margin-bottom: 1.2rem;
	max-width: 18ch;
}

.wsp-hero__sub {
	font-size: clamp(1rem, 1.25vw, 1.15rem);
	line-height: 1.75;
	color: rgba(255, 255, 255, .84);
	max-width: 54ch;
	margin-bottom: 2rem;
}

.wsp-hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: .85rem;
}

.wsp-hero__trust {
	display: flex;
	flex-wrap: wrap;
	gap: .65rem;
	list-style: none;
	margin: 2.25rem 0 0;
	padding: 0;
}
.wsp-hero__trust li {
	display: inline-flex;
	align-items: center;
	gap: .45rem;
	background: rgba(255, 255, 255, .08);
	border: 1px solid rgba(255, 255, 255, .14);
	backdrop-filter: blur(8px);
	padding: .45rem .85rem;
	border-radius: 999px;
	font-size: .78rem;
	font-weight: 600;
	color: rgba(255, 255, 255, .9);
}
.wsp-hero__trust .wsp-i { color: var(--gold-light); }

/* Right Hero Showcase Cards */
.wsp-hero__showcase {
	display: grid;
	gap: 1.1rem;
}

.wsp-herocard {
	display: grid;
	grid-template-columns: 130px 1fr;
	gap: 1rem;
	align-items: center;
	background: rgba(11, 22, 35, .78);
	border: 1px solid rgba(255, 255, 255, .18);
	backdrop-filter: blur(16px);
	padding: .75rem;
	border-radius: var(--radius-lg);
	box-shadow: var(--shadow-lg);
	transition: transform var(--t), border-color var(--t), background var(--t);
}
.wsp-herocard:hover {
	transform: translateY(-4px);
	border-color: var(--gold-light);
	background: rgba(11, 22, 35, .92);
}
.wsp-herocard--2 {
	margin-left: 1.5rem;
}

.wsp-herocard__media {
	position: relative;
	aspect-ratio: 4 / 3;
	border-radius: 10px;
	overflow: hidden;
	background: var(--navy-soft);
}
.wsp-herocard__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.wsp-herocard__tag {
	position: absolute;
	top: .4rem;
	left: .4rem;
	background: rgba(6, 13, 22, .82);
	color: var(--gold-light);
	font-family: var(--serif);
	font-size: .62rem;
	font-weight: 700;
	padding: .2rem .5rem;
	border-radius: 999px;
}

.wsp-herocard__body {
	min-width: 0;
	padding-right: .35rem;
}
.wsp-herocard__meta {
	display: flex;
	flex-wrap: wrap;
	gap: .65rem;
	font-size: .72rem;
	color: var(--gold-light);
	margin-bottom: .25rem;
}
.wsp-herocard__meta span {
	display: inline-flex;
	align-items: center;
	gap: .25rem;
}
.wsp-herocard__body strong {
	display: block;
	font-family: var(--serif);
	font-size: .96rem;
	font-weight: 700;
	color: #fff;
	line-height: 1.3;
	margin-bottom: .45rem;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.wsp-herocard__foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: .5rem;
	font-size: .78rem;
	color: rgba(255, 255, 255, .75);
}
.wsp-herocard__price b {
	color: #fff;
	font-family: var(--serif);
	font-size: .95rem;
}
.wsp-herocard__link {
	font-family: var(--serif);
	font-weight: 700;
	color: var(--gold-light);
}

@media (max-width: 1024px) {
	.wsp-hero__grid { grid-template-columns: 1fr; }
	.wsp-hero__showcase { display: none; }
}

/* ==========================================================================
   Custom Interactive Selector Bar (.wsp-selector)
   ========================================================================== */
.wsp-searchbar {
	position: relative;
	z-index: 35;
	background: #fff;
	border-bottom: 1px solid var(--line);
	padding-block: 1.25rem;
}
.wsp-searchbar--overlap {
	margin-top: -46px;
	background: transparent;
	border-bottom: 0;
	padding-block: 0;
}

.wsp-selector {
	display: grid;
	grid-template-columns: 1.15fr 1.1fr 1fr 1fr auto;
	align-items: stretch;
	background: #fff;
	border: 1px solid rgba(11, 22, 35, .1);
	border-radius: var(--radius-xl);
	box-shadow: 0 22px 60px rgba(11, 22, 35, .16);
	padding: .45rem;
	gap: .25rem;
}

.wsp-sel {
	position: relative;
	display: flex;
}
.wsp-sel:not(:first-of-type)::before {
	content: '';
	position: absolute;
	left: -2px;
	top: 18%;
	bottom: 18%;
	width: 1px;
	background: var(--line);
}

.wsp-sel__trigger {
	width: 100%;
	display: flex;
	align-items: center;
	gap: .8rem;
	padding: .75rem 1rem;
	border: 0;
	border-radius: 14px;
	background: transparent;
	text-align: left;
	cursor: pointer;
	transition: background var(--t-fast);
}
.wsp-sel__trigger:hover,
.wsp-sel.is-open .wsp-sel__trigger {
	background: var(--ivory);
}

.wsp-sel__icon {
	width: 40px;
	height: 40px;
	border-radius: 12px;
	background: var(--gold-soft);
	color: var(--gold-dark);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	transition: background var(--t-fast), color var(--t-fast);
}
.wsp-sel.is-open .wsp-sel__icon {
	background: var(--gold);
	color: #fff;
}

.wsp-sel__meta {
	display: flex;
	flex-direction: column;
	min-width: 0;
	flex: 1;
}
.wsp-sel__label {
	font-family: var(--serif);
	font-size: .68rem;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--muted);
	margin-bottom: .15rem;
}
.wsp-sel__value {
	font-family: var(--serif);
	font-size: .95rem;
	font-weight: 700;
	color: var(--navy);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.wsp-sel__chev {
	width: 7px;
	height: 7px;
	border-right: 2px solid var(--muted);
	border-bottom: 2px solid var(--muted);
	transform: rotate(45deg);
	transition: transform var(--t-fast);
	flex: 0 0 auto;
	margin-top: -2px;
}
.wsp-sel.is-open .wsp-sel__chev {
	transform: rotate(-135deg);
	border-color: var(--gold-dark);
}

.wsp-selector__submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .55rem;
	background: linear-gradient(135deg, #E59532 0%, #C67314 100%);
	color: #fff;
	border: 0;
	border-radius: 16px;
	padding: 0 1.85rem;
	font-family: var(--serif);
	font-size: .92rem;
	font-weight: 700;
	cursor: pointer;
	box-shadow: var(--shadow-gold);
	transition: transform var(--t-fast), box-shadow var(--t-fast), filter var(--t-fast);
	white-space: nowrap;
}
.wsp-selector__submit:hover {
	filter: brightness(1.06);
	transform: translateY(-1px);
}

/* Selector Popover Menus */
.wsp-sel__popover {
	position: absolute;
	top: calc(100% + 10px);
	left: 0;
	min-width: 300px;
	background: #fff;
	border: 1px solid var(--line-strong);
	border-radius: var(--radius-lg);
	box-shadow: var(--shadow-lg);
	padding: .55rem;
	z-index: 80;
	display: none;
	animation: wsp-pop 180ms var(--ease) both;
}
@keyframes wsp-pop {
	from { opacity: 0; transform: translateY(6px); }
	to { opacity: 1; transform: none; }
}
.wsp-sel.is-open .wsp-sel__popover {
	display: block;
}

.wsp-sel__option {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: .7rem .85rem;
	border: 0;
	border-radius: 10px;
	background: transparent;
	text-align: left;
	cursor: pointer;
	transition: background var(--t-fast);
}
.wsp-sel__option:hover {
	background: var(--ivory);
}
.wsp-sel__option.is-selected {
	background: var(--gold-soft);
}
.wsp-sel__opt-main {
	display: flex;
	flex-direction: column;
}
.wsp-sel__opt-main strong {
	font-family: var(--serif);
	font-size: .92rem;
	font-weight: 700;
	color: var(--navy);
}
.wsp-sel__opt-main small {
	font-size: .76rem;
	color: var(--muted);
}
.wsp-sel__badge {
	font-family: var(--serif);
	font-size: .72rem;
	font-weight: 700;
	color: var(--gold-dark);
	background: var(--ivory);
	padding: .2rem .55rem;
	border-radius: 999px;
	flex: 0 0 auto;
}

/* Custom Mini-Calendar inside Popover */
.wsp-sel__popover--cal {
	min-width: 310px;
	padding: 1rem;
}
.wsp-minical__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: .75rem;
}
.wsp-minical__title {
	font-family: var(--serif);
	font-size: .95rem;
	font-weight: 700;
	color: var(--navy);
}
.wsp-minical__nav {
	width: 32px;
	height: 32px;
	border-radius: 8px;
	border: 1px solid var(--line-strong);
	background: #fff;
	font-size: 1.1rem;
	line-height: 1;
	color: var(--navy);
	cursor: pointer;
}
.wsp-minical__nav:hover {
	background: var(--ivory);
	border-color: var(--gold);
}
.wsp-minical__weekdays {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	text-align: center;
	font-family: var(--serif);
	font-size: .7rem;
	font-weight: 700;
	color: var(--muted);
	margin-bottom: .4rem;
}
.wsp-minical__grid {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	gap: 3px;
}
.wsp-minical__day,
.wsp-minical__empty {
	aspect-ratio: 1 / 1;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 8px;
	font-family: var(--serif);
	font-size: .82rem;
	font-weight: 600;
}
.wsp-minical__day {
	border: 0;
	background: transparent;
	color: var(--navy);
	cursor: pointer;
}
.wsp-minical__day:hover:not(:disabled) {
	background: var(--gold-soft);
	color: var(--gold-dark);
}
.wsp-minical__day.is-selected {
	background: var(--gold) !important;
	color: #fff !important;
}
.wsp-minical__day.is-disabled {
	color: #CBD5E1;
	cursor: not-allowed;
}
.wsp-minical__foot {
	margin-top: .75rem;
	padding-top: .65rem;
	border-top: 1px solid var(--line);
	text-align: center;
}
.wsp-minical__clear {
	border: 0;
	background: var(--ivory);
	color: var(--navy);
	font-family: var(--serif);
	font-size: .78rem;
	font-weight: 700;
	padding: .45rem .9rem;
	border-radius: 999px;
	cursor: pointer;
	width: 100%;
}
.wsp-minical__clear:hover {
	background: var(--gold-soft);
	color: var(--gold-dark);
}

/* Custom Travellers Stepper Popover */
.wsp-sel__popover--guests {
	min-width: 290px;
	right: 0;
	left: auto;
	padding: 1rem 1.15rem;
}
.wsp-stepper-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding-block: .65rem;
}
.wsp-stepper-row + .wsp-stepper-row {
	border-top: 1px solid var(--line);
}
.wsp-stepper-row strong {
	display: block;
	font-family: var(--serif);
	font-size: .92rem;
	color: var(--navy);
}
.wsp-stepper-row small {
	font-size: .75rem;
	color: var(--muted);
}
.wsp-stepper {
	display: inline-flex;
	align-items: center;
	gap: .65rem;
}
.wsp-stepper button {
	width: 32px;
	height: 32px;
	border-radius: 999px;
	border: 1px solid var(--line-strong);
	background: #fff;
	font-size: 1rem;
	font-weight: 700;
	color: var(--navy);
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.wsp-stepper button:hover {
	border-color: var(--gold);
	background: var(--gold-soft);
	color: var(--gold-dark);
}
.wsp-stepper span {
	font-family: var(--serif);
	font-size: .95rem;
	font-weight: 700;
	min-width: 20px;
	text-align: center;
}
.wsp-stepper-note {
	margin-top: .65rem;
	padding-top: .65rem;
	border-top: 1px solid var(--line);
	display: flex;
	align-items: center;
	gap: .45rem;
	font-size: .75rem;
	font-weight: 600;
	color: var(--teal);
}

@media (max-width: 1024px) {
	.wsp-selector {
		grid-template-columns: 1fr 1fr;
		padding: .65rem;
		gap: .5rem;
	}
	.wsp-sel::before { display: none; }
	.wsp-sel__trigger { border: 1px solid var(--line); }
	.wsp-selector__submit {
		grid-column: 1 / -1;
		padding: 1rem;
	}
}
@media (max-width: 580px) {
	.wsp-selector { grid-template-columns: 1fr; }
	.wsp-sel__popover { left: 0; right: 0; min-width: 0; }
}

/* ==========================================================================
   Sections
   ========================================================================== */
.wsp-sec { padding-block: clamp(3.5rem, 6.5vw, 6rem); position: relative; }
.wsp-sec--white { background: #fff; }
.wsp-sec--ivory { background: var(--ivory); }
.wsp-sec--sand { background: var(--sand); }
.wsp-sec--navy {
	background: var(--navy);
	color: rgba(255, 255, 255, .78);
	overflow: hidden;
}
.wsp-sec--navy h2, .wsp-sec--navy h3, .wsp-sec--navy h4 { color: #fff; }
.wsp-sec--navy .wsp-lede { color: rgba(255, 255, 255, .68); }
.wsp-sec--navy .wsp-eyebrow {
	background: rgba(217, 138, 43, .2);
	color: var(--gold-light);
}
.wsp-sec--tight { padding-block: clamp(2.5rem, 4vw, 3.75rem); }

/* ==========================================================================
   Grids & Tour Cards
   ========================================================================== */
.wsp-grid {
	display: grid;
	gap: 1.65rem;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}
.wsp-grid--2 { grid-template-columns: repeat(2, 1fr); }
.wsp-grid--3 { grid-template-columns: repeat(3, 1fr); }
.wsp-grid--4 { grid-template-columns: repeat(4, 1fr); }

@media (max-width: 1140px) {
	.wsp-grid--4 { grid-template-columns: repeat(2, 1fr); }
	.wsp-grid--3 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
	.wsp-grid--2, .wsp-grid--3, .wsp-grid--4 { grid-template-columns: 1fr; }
}

.wsp-card {
	background: #fff;
	border: 1px solid var(--line);
	border-radius: var(--radius-lg);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	box-shadow: var(--shadow-sm);
	transition: transform var(--t), box-shadow var(--t), border-color var(--t);
	position: relative;
}
.wsp-card:hover {
	transform: translateY(-5px);
	box-shadow: var(--shadow-md);
	border-color: rgba(217, 138, 43, .35);
}

.wsp-card__media {
	position: relative;
	display: block;
	aspect-ratio: 4 / 3;
	background: var(--sand);
	overflow: hidden;
}
.wsp-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 700ms var(--ease);
}
.wsp-card:hover .wsp-card__media img { transform: scale(1.06); }
.wsp-card__placeholder {
	display: block;
	width: 100%;
	height: 100%;
	background: linear-gradient(135deg, rgba(217, 138, 43, .18), rgba(11, 22, 35, .1)), var(--sand);
}

.wsp-badge {
	position: absolute;
	top: .85rem;
	left: .85rem;
	max-width: calc(100% - 92px);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	background: rgba(11, 22, 35, .84);
	backdrop-filter: blur(8px);
	color: #fff;
	font-family: var(--serif);
	font-size: .68rem;
	font-weight: 700;
	padding: .35rem .75rem;
	border-radius: 999px;
	z-index: 2;
}
.wsp-badge--deal {
	background: var(--gold);
	color: #fff;
}

.wsp-card__priv {
	position: absolute;
	top: .85rem;
	right: .85rem;
	background: rgba(255, 255, 255, .92);
	color: var(--navy);
	font-family: var(--serif);
	font-size: .66rem;
	font-weight: 700;
	padding: .3rem .65rem;
	border-radius: 999px;
	z-index: 2;
}

.wsp-card__body {
	padding: 1.25rem 1.35rem 1.35rem;
	display: flex;
	flex-direction: column;
	flex: 1;
}
.wsp-card__meta {
	display: flex;
	flex-wrap: wrap;
	gap: .4rem .9rem;
	margin-bottom: .6rem;
}

.wsp-chip {
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	font-family: var(--serif);
	font-size: .74rem;
	font-weight: 600;
	color: var(--muted);
}
.wsp-chip .wsp-i { color: var(--gold-dark); }

.wsp-card__title {
	font-size: 1.15rem;
	font-weight: 700;
	line-height: 1.32;
	margin: 0 0 .5rem;
}
.wsp-card__title a:hover { color: var(--gold-dark); }

.wsp-card__text {
	font-size: .9rem;
	color: var(--muted);
	margin: 0 0 1.15rem;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.wsp-card__foot {
	margin-top: auto;
	padding-top: .95rem;
	border-top: 1px solid var(--line);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: .75rem;
}
.wsp-price {
	margin: 0;
	font-size: .74rem;
	color: var(--muted);
	display: flex;
	align-items: baseline;
	gap: .3rem;
	flex-wrap: wrap;
}
.wsp-price strong {
	font-family: var(--serif);
	font-size: 1.3rem;
	color: var(--navy);
	font-weight: 800;
}
.wsp-price strong.wsp-price__custom {
	font-size: .95rem;
	color: var(--teal);
}
.wsp-card__go {
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	font-family: var(--serif);
	font-size: .78rem;
	font-weight: 700;
	color: var(--gold-dark);
	background: var(--gold-soft);
	padding: .45rem .85rem;
	border-radius: 999px;
	transition: background var(--t-fast), color var(--t-fast), transform var(--t-fast);
}
.wsp-card:hover .wsp-card__go {
	background: var(--gold);
	color: #fff;
}

/* ==========================================================================
   Visual Travel Package Cards (.wsp-pkgcard)
   ========================================================================== */
.wsp-pkgcard {
	background: #fff;
	border: 1px solid var(--line);
	border-radius: var(--radius-lg);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	box-shadow: var(--shadow-sm);
	transition: transform var(--t), box-shadow var(--t), border-color var(--t);
}
.wsp-pkgcard:hover {
	transform: translateY(-5px);
	box-shadow: var(--shadow-md);
	border-color: rgba(217, 138, 43, .4);
}
.wsp-pkgcard__media {
	position: relative;
	aspect-ratio: 16 / 10;
	overflow: hidden;
	background: var(--navy);
}
.wsp-pkgcard__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 700ms var(--ease);
}
.wsp-pkgcard:hover .wsp-pkgcard__media img {
	transform: scale(1.06);
}
.wsp-pkgcard__count {
	position: absolute;
	top: .85rem;
	right: .85rem;
	background: rgba(11, 22, 35, .82);
	backdrop-filter: blur(8px);
	color: var(--gold-light);
	font-family: var(--serif);
	font-size: .72rem;
	font-weight: 700;
	padding: .32rem .75rem;
	border-radius: 999px;
}
.wsp-pkgcard__body {
	padding: 1.35rem 1.45rem 1.45rem;
	display: flex;
	flex-direction: column;
	flex: 1;
}
.wsp-pkgcard__body h3 {
	font-size: 1.25rem;
	margin: 0 0 .5rem;
}
.wsp-pkgcard__body p {
	font-size: .9rem;
	color: var(--muted);
	margin: 0 0 1.2rem;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.wsp-pkgcard__cta {
	margin-top: auto;
	display: inline-flex;
	align-items: center;
	gap: .45rem;
	font-family: var(--serif);
	font-size: .82rem;
	font-weight: 700;
	color: var(--gold-dark);
}
.wsp-pkgcard:hover .wsp-pkgcard__cta {
	color: var(--navy);
}

/* ==========================================================================
   Destination Overlay Cards (.wsp-destcard)
   ========================================================================== */
.wsp-destcard {
	position: relative;
	display: block;
	aspect-ratio: 3 / 4;
	border-radius: var(--radius-lg);
	overflow: hidden;
	background: var(--navy-soft);
	box-shadow: var(--shadow-md);
}
.wsp-destcard img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 800ms var(--ease);
}
.wsp-destcard::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(6, 13, 22, .1) 25%, rgba(6, 13, 22, .88) 100%);
}
.wsp-destcard:hover img { transform: scale(1.06); }

.wsp-destcard__badge {
	position: absolute;
	top: 1rem;
	right: 1rem;
	z-index: 2;
	background: rgba(6, 13, 22, .75);
	backdrop-filter: blur(8px);
	color: var(--gold-light);
	font-family: var(--serif);
	font-size: .72rem;
	font-weight: 700;
	padding: .32rem .75rem;
	border-radius: 999px;
	border: 1px solid rgba(255, 255, 255, .15);
}
.wsp-destcard__body {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 2;
	padding: 1.5rem;
	color: #fff;
}
.wsp-destcard__body h3 {
	color: #fff;
	font-size: 1.55rem;
	margin: 0 0 .25rem;
}
.wsp-destcard__body p {
	margin: 0;
	font-size: .78rem;
	font-weight: 500;
	color: rgba(255, 255, 255, .82);
}

/* ==========================================================================
   Pillars (Why Whispers)
   ========================================================================== */
.wsp-pillar {
	background: var(--ivory);
	border: 1px solid var(--line);
	border-radius: var(--radius-lg);
	padding: 2rem 1.75rem;
	transition: transform var(--t), box-shadow var(--t);
}
.wsp-pillar:hover {
	transform: translateY(-4px);
	box-shadow: var(--shadow-sm);
}
.wsp-pillar__icon {
	width: 54px;
	height: 54px;
	border-radius: 14px;
	background: var(--gold-soft);
	color: var(--gold-dark);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 1.25rem;
}
.wsp-pillar h3 {
	font-size: 1.25rem;
	margin-bottom: .55rem;
}
.wsp-pillar p {
	font-size: .94rem;
	color: var(--muted);
	margin: 0;
}

/* ==========================================================================
   Search Results & Faceted Filter Catalog (/book/)
   ========================================================================== */
.wsp-catalog {
	display: grid;
	grid-template-columns: 300px minmax(0, 1fr);
	gap: 2.25rem;
	align-items: start;
}

.wsp-filterbox {
	background: #fff;
	border: 1px solid var(--line);
	border-radius: var(--radius-lg);
	padding: 1.4rem;
	box-shadow: var(--shadow-sm);
	position: sticky;
	top: 100px;
}
.wsp-filterbox__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-bottom: 1rem;
	margin-bottom: 1.1rem;
	border-bottom: 1px solid var(--line);
}
.wsp-filterbox__head h2 {
	font-size: 1.1rem;
	margin: 0;
}
.wsp-filterbox__reset {
	font-family: var(--serif);
	font-size: .78rem;
	font-weight: 700;
	color: var(--terra);
}
.wsp-filterbox__close {
	display: none;
	border: 0;
	background: var(--ivory);
	width: 32px;
	height: 32px;
	border-radius: 999px;
	cursor: pointer;
}

.wsp-filter-group {
	padding-bottom: 1.15rem;
	margin-bottom: 1.15rem;
	border-bottom: 1px solid var(--line);
}
.wsp-filter-group__title {
	display: block;
	font-family: var(--serif);
	font-size: .78rem;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--navy);
	margin: 0 0 .75rem;
}

.wsp-filter-kw {
	display: flex;
	align-items: center;
	gap: .5rem;
	border: 1px solid var(--line-strong);
	border-radius: 10px;
	padding: .55rem .8rem;
	background: var(--ivory);
}
.wsp-filter-kw input {
	border: 0;
	background: transparent;
	width: 100%;
	font-size: .88rem;
	color: var(--ink);
}
.wsp-filter-kw input:focus { outline: none; }

.wsp-filter-checks {
	display: grid;
	gap: .5rem;
}
.wsp-check {
	display: flex;
	align-items: center;
	gap: .6rem;
	cursor: pointer;
	font-size: .9rem;
	color: var(--ink);
	user-select: none;
}
.wsp-check input {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}
.wsp-check__box {
	width: 18px;
	height: 18px;
	border: 1.5px solid var(--line-strong);
	border-radius: 5px;
	background: #fff;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	transition: background var(--t-fast), border-color var(--t-fast);
}
.wsp-check__box--radio {
	border-radius: 999px;
}
.wsp-check input:checked + .wsp-check__box {
	background: var(--gold);
	border-color: var(--gold);
}
.wsp-check input:checked + .wsp-check__box::after {
	content: '';
	width: 5px;
	height: 9px;
	border-right: 2px solid #fff;
	border-bottom: 2px solid #fff;
	transform: rotate(45deg);
	margin-top: -2px;
}
.wsp-check__label {
	flex: 1;
	line-height: 1.3;
}
.wsp-check__count {
	font-family: var(--serif);
	font-size: .72rem;
	font-weight: 700;
	color: var(--muted);
	background: var(--ivory);
	padding: .1rem .45rem;
	border-radius: 999px;
}

.wsp-filter-price {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	gap: .5rem;
	align-items: end;
}
.wsp-filter-price label {
	display: block;
	font-size: .7rem;
	color: var(--muted);
	margin-bottom: .2rem;
}
.wsp-filter-price input {
	width: 100%;
	border: 1px solid var(--line-strong);
	border-radius: 8px;
	padding: .45rem .6rem;
	font-size: .88rem;
}

/* Catalog Toolbar & Quick Pills */
.wsp-toolbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	flex-wrap: wrap;
	background: #fff;
	border: 1px solid var(--line);
	border-radius: 14px;
	padding: .85rem 1.15rem;
	margin-bottom: 1.1rem;
}
.wsp-toolbar__left,
.wsp-toolbar__right {
	display: flex;
	align-items: center;
	gap: .75rem;
}
.wsp-toolbar__count {
	margin: 0;
	font-size: .92rem;
	color: var(--muted);
}
.wsp-toolbar__count strong {
	color: var(--navy);
	font-family: var(--serif);
}
.wsp-toolbar__filterbtn {
	display: none;
	padding: .55rem 1rem;
	font-size: .8rem;
}
.wsp-toolbar__sortlabel {
	font-size: .82rem;
	color: var(--muted);
}
.wsp-toolbar__sort {
	border: 1px solid var(--line-strong);
	border-radius: 999px;
	padding: .45rem 1rem;
	font-family: var(--serif);
	font-size: .84rem;
	font-weight: 600;
	color: var(--navy);
	background: var(--ivory);
	cursor: pointer;
}

.wsp-quickpills {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	margin-bottom: 1.25rem;
}
.wsp-quickpill {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	padding: .48rem .95rem;
	border-radius: 999px;
	background: #fff;
	border: 1px solid var(--line);
	font-family: var(--serif);
	font-size: .8rem;
	font-weight: 600;
	color: var(--ink);
	transition: all var(--t-fast);
}
.wsp-quickpill:hover {
	border-color: var(--gold);
	color: var(--gold-dark);
}
.wsp-quickpill.is-active {
	background: var(--navy);
	border-color: var(--navy);
	color: #fff;
}
.wsp-quickpill small {
	opacity: .65;
	font-size: .72rem;
}

.wsp-activechips {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .45rem;
	margin-bottom: 1.25rem;
}
.wsp-activechip {
	display: inline-flex;
	align-items: center;
	background: var(--gold-soft);
	color: var(--gold-dark);
	font-family: var(--serif);
	font-size: .76rem;
	font-weight: 700;
	padding: .3rem .75rem;
	border-radius: 999px;
}
.wsp-activechips__clear {
	font-family: var(--serif);
	font-size: .78rem;
	font-weight: 700;
	color: var(--terra);
	margin-left: .4rem;
}

.wsp-empty-state {
	background: #fff;
	border: 1px solid var(--line);
	border-radius: var(--radius-lg);
	padding: 3.5rem 2rem;
	text-align: center;
}
.wsp-empty-state .wsp-lede { margin-inline: auto; }

@media (max-width: 1024px) {
	.wsp-catalog { grid-template-columns: 1fr; }
	.wsp-toolbar__filterbtn { display: inline-flex; }
	.wsp-catalog__sidebar {
		position: fixed;
		inset: 0 auto 0 0;
		width: min(340px, 90vw);
		background: #fff;
		z-index: 120;
		overflow-y: auto;
		transform: translateX(-100%);
		transition: transform var(--t);
		box-shadow: var(--shadow-lg);
	}
	.wsp-catalog__sidebar.is-open { transform: none; }
	.wsp-filterbox { border: 0; border-radius: 0; box-shadow: none; position: static; }
	.wsp-filterbox__close { display: inline-flex; align-items: center; justify-content: center; }
}

/* ==========================================================================
   Stats & Testimonials
   ========================================================================== */
.wsp-stats {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.5rem;
	text-align: center;
	background: rgba(255, 255, 255, .04);
	border: 1px solid rgba(255, 255, 255, .1);
	border-radius: var(--radius-lg);
	padding: 2rem 1.5rem;
}
.wsp-stats__num {
	font-family: var(--serif);
	font-size: clamp(2.2rem, 4vw, 3.2rem);
	font-weight: 800;
	color: var(--gold-light);
	line-height: 1;
	margin: 0 0 .45rem;
}
.wsp-stats__label {
	font-family: var(--serif);
	font-size: .76rem;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .7);
	margin: 0;
}
@media (max-width: 760px) {
	.wsp-stats { grid-template-columns: repeat(2, 1fr); }
}

.wsp-quotes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
@media (max-width: 1000px) { .wsp-quotes { grid-template-columns: 1fr; } }

.wsp-quote {
	background: #fff;
	border: 1px solid var(--line);
	border-radius: var(--radius-lg);
	padding: 2rem;
	box-shadow: var(--shadow-sm);
	display: flex;
	flex-direction: column;
}
.wsp-quote__stars {
	color: #F59E0B;
	font-size: 1rem;
	letter-spacing: 2px;
	margin-bottom: .85rem;
}
.wsp-quote__text {
	font-size: 1rem;
	line-height: 1.7;
	color: var(--ink);
	margin: 0 0 1.35rem;
	flex: 1;
}
.wsp-quote__by strong {
	display: block;
	font-family: var(--serif);
	font-size: .92rem;
	font-weight: 700;
	color: var(--navy);
}
.wsp-quote__by small {
	display: block;
	color: var(--muted);
	font-size: .78rem;
	margin-top: .15rem;
}

/* ==========================================================================
   CTA + Footer
   ========================================================================== */
.wsp-cta {
	position: relative;
	background: linear-gradient(135deg, #0D1E31 0%, #060D16 100%);
	color: rgba(255, 255, 255, .82);
	padding-block: clamp(3.5rem, 6vw, 5.5rem);
	text-align: center;
	border-bottom: 1px solid rgba(255, 255, 255, .08);
}
.wsp-cta h2 { color: #fff; margin-bottom: .6rem; }
.wsp-cta .wsp-lede { color: rgba(255, 255, 255, .72); margin-inline: auto; }
.wsp-cta .wsp-eyebrow {
	background: rgba(217, 138, 43, .2);
	color: var(--gold-light);
	margin-inline: auto;
}
.wsp-cta__actions {
	display: flex;
	gap: .85rem;
	flex-wrap: wrap;
	justify-content: center;
	margin-top: 2rem;
}

.wsp-footer {
	background: var(--navy-deep);
	color: rgba(255, 255, 255, .65);
	font-size: .9rem;
}
.wsp-footer__grid {
	display: grid;
	grid-template-columns: 1.55fr 1fr 1fr 1.15fr;
	gap: clamp(2rem, 4vw, 3.5rem);
	padding-block: clamp(3rem, 5vw, 4.5rem);
}
.wsp-footer__brand img { max-height: 58px; width: auto; margin-bottom: 1.35rem; }
.wsp-footer__brand .wsp-brand__text { color: #fff; }
.wsp-footer__brand > p { color: rgba(255, 255, 255, .6); max-width: 36ch; line-height: 1.7; }

.wsp-footer__badge {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	font-family: var(--serif);
	font-size: .72rem !important;
	font-weight: 600;
	color: var(--gold-light) !important;
	background: rgba(217, 138, 43, .14);
	border: 1px solid rgba(217, 138, 43, .32);
	padding: .5rem .9rem;
	border-radius: 999px;
	margin-top: 1.1rem;
}

.wsp-footer__social { display: flex; gap: .55rem; margin-top: 1.4rem; }
.wsp-footer__social a {
	width: 40px;
	height: 40px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 1px solid rgba(255, 255, 255, .16);
	border-radius: 999px;
	color: #fff;
	transition: all var(--t-fast);
}
.wsp-footer__social a:hover {
	background: var(--gold);
	border-color: var(--gold);
	color: #fff;
}

.wsp-footer__col h3 {
	font-family: var(--serif);
	font-size: .78rem;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--gold-light);
	margin-bottom: 1.2rem;
}
.wsp-footer__col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .65rem; }
.wsp-footer__col a { color: rgba(255, 255, 255, .75); transition: color var(--t-fast); }
.wsp-footer__col a:hover { color: var(--gold-light); }

.wsp-footer__contact li { display: flex; gap: .6rem; align-items: flex-start; color: rgba(255, 255, 255, .7); }
.wsp-footer__contact .wsp-i { color: var(--gold-light); flex: 0 0 auto; margin-top: .25rem; }

.wsp-footer__bottom {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 1rem;
	flex-wrap: wrap;
	border-top: 1px solid rgba(255, 255, 255, .08);
	padding-block: 1.5rem;
	font-size: .8rem;
	color: rgba(255, 255, 255, .48);
}
.wsp-footer__bottom p { margin: 0; }
.wsp-footer__legal { display: flex; gap: 1.35rem; align-items: center; }
.wsp-footer__legal a:hover { color: var(--gold-light); }
.wsp-footer__top {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	font-family: var(--serif);
	font-weight: 700;
	color: var(--gold-light);
}

@media (max-width: 900px) { .wsp-footer__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .wsp-footer__grid { grid-template-columns: 1fr; gap: 2.25rem; } }

/* ==========================================================================
   Archive Header, Pagination, FAQ & Forms
   ========================================================================== */
.wsp-archive-head {
	position: relative;
	background: linear-gradient(135deg, #0D1E31 0%, #060D16 100%);
	color: rgba(255, 255, 255, .8);
	padding-block: clamp(2.75rem, 5.5vw, 4.75rem) clamp(4.25rem, 7vw, 5.75rem);
}
.wsp-archive-head h1 {
	color: #fff;
	font-size: clamp(2.1rem, 4.2vw, 3.4rem);
	font-weight: 800;
	margin-bottom: .65rem;
	max-width: 22ch;
}
.wsp-archive-head .wsp-lede { color: rgba(255, 255, 255, .75); }
.wsp-archive-head .wsp-crumbs { color: rgba(255, 255, 255, .65); }
.wsp-archive-head .wsp-crumbs a { color: rgba(255, 255, 255, .65); }

.wsp-pagination { margin-top: 2.75rem; }
.wsp-pagination .nav-links,
.wsp-pagination { display: flex; gap: .4rem; flex-wrap: wrap; justify-content: center; }
.wsp-pagination a, .wsp-pagination span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 42px;
	height: 42px;
	padding-inline: .75rem;
	border: 1px solid var(--line-strong);
	font-family: var(--serif);
	font-size: .86rem;
	font-weight: 700;
	border-radius: 999px;
	background: #fff;
}
.wsp-pagination span.current {
	background: var(--navy);
	color: #fff;
	border-color: var(--navy);
}
.wsp-pagination a:hover { border-color: var(--gold); color: var(--gold-dark); }

.wsp-crumbs { font-size: .78rem; padding-block: 1rem; color: var(--muted); }
.wsp-crumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .45rem; align-items: center; }
.wsp-crumbs li { display: inline-flex; align-items: center; gap: .45rem; }
.wsp-crumbs a:hover { color: var(--gold-dark); }
.wsp-crumbs__sep { opacity: .4; }

.wsp-prose { font-size: 1.02rem; color: #243444; }
.wsp-prose p { margin-bottom: 1.15rem; }
.wsp-prose h2, .wsp-prose h3 { margin-top: 2rem; }
.wsp-prose a { color: var(--gold-dark); text-decoration: underline; }

/* FAQ Accordion */
.wsp-faq { display: grid; gap: .75rem; }
.wsp-faq__item {
	background: #fff;
	border: 1px solid var(--line);
	border-radius: var(--radius-lg);
	padding: 0 1.4rem;
	box-shadow: var(--shadow-sm);
}
.wsp-faq__item summary {
	list-style: none;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.25rem;
	padding: 1.2rem 0;
	font-family: var(--serif);
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--navy);
}
.wsp-faq__item summary::-webkit-details-marker { display: none; }
.wsp-faq__item summary::after {
	content: '+';
	width: 28px;
	height: 28px;
	border-radius: 999px;
	background: var(--gold-soft);
	color: var(--gold-dark);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 1.1rem;
	font-weight: 700;
	flex: 0 0 auto;
}
.wsp-faq__item[open] summary::after {
	content: '–';
	background: var(--gold);
	color: #fff;
}
.wsp-faq__body { padding: 0 0 1.25rem; }
.wsp-faq__body p { color: var(--muted); margin: 0; }

/* Forms */
.wsp-form { display: grid; gap: 1.15rem; }
.wsp-form__row { display: grid; gap: 1.15rem; grid-template-columns: 1fr 1fr; }
@media (max-width: 640px) { .wsp-form__row { grid-template-columns: 1fr; } }

.wsp-field { display: grid; gap: .4rem; }
.wsp-field label {
	font-family: var(--serif);
	font-size: .74rem;
	font-weight: 700;
	color: var(--navy);
}
.wsp-field input,
.wsp-field select,
.wsp-field textarea {
	width: 100%;
	padding: .8rem 1rem;
	border: 1px solid var(--line-strong);
	border-radius: 10px;
	background: #fff;
	font-size: .95rem;
	color: var(--ink);
}
.wsp-field input:focus,
.wsp-field select:focus,
.wsp-field textarea:focus {
	outline: none;
	border-color: var(--gold);
	box-shadow: 0 0 0 3px rgba(217, 138, 43, .15);
}
.wsp-field textarea { min-height: 130px; resize: vertical; }

.wsp-notice {
	padding: 1rem 1.25rem;
	border-left: 4px solid var(--gold);
	background: var(--gold-soft);
	border-radius: 8px;
	font-size: .92rem;
	margin-bottom: 1.5rem;
}
.wsp-notice--error { border-color: #B4443B; background: rgba(180, 68, 59, .08); }

/* Contact Form 7 */
.wsp-contact-form form { display: grid; gap: 1.1rem; }
.wsp-contact-form p { margin: 0; }
.wsp-contact-form label {
	display: block;
	font-family: var(--serif);
	font-size: .74rem;
	font-weight: 700;
	color: var(--navy);
	margin-bottom: .35rem;
}
.wsp-contact-form input[type="text"],
.wsp-contact-form input[type="email"],
.wsp-contact-form input[type="tel"],
.wsp-contact-form input[type="url"],
.wsp-contact-form select,
.wsp-contact-form textarea {
	width: 100%;
	padding: .8rem 1rem;
	border: 1px solid var(--line-strong);
	border-radius: 10px;
	background: #fff;
	font-size: .95rem;
	color: var(--ink);
}
.wsp-contact-form textarea { min-height: 140px; resize: vertical; }
.wsp-contact-form input[type="submit"],
.wsp-contact-form button[type="submit"] {
	justify-self: start;
	background: linear-gradient(135deg, #E59532 0%, #C67314 100%);
	color: #fff;
	border: 0;
	border-radius: 999px;
	padding: .95rem 2rem;
	font-family: var(--serif);
	font-size: .88rem;
	font-weight: 700;
	cursor: pointer;
	box-shadow: var(--shadow-gold);
}

@media (max-width: 900px) {
	.wsp-two { grid-template-columns: 1fr !important; }
	.wsp-tm-layout { grid-template-columns: 1fr !important; }
}