/* SoulTrack Expeditions — homepage sections (mobile-first) */

:root
{
	--st-espresso: #2B1B17;
	--st-brown: #3B2721;
	--st-ink: #1C110E;
	--st-white: #FFF8EC;
	--st-bronze-text: #7A5600;
	--st-focus: #FA9E1B;
	--st-gold: #D9A520;
	--st-bronze: #B8860B;
	--st-cream: #F1E4CB;
	--st-ivory: #FBF5E9;
	--st-sand: #DCC9A6;
	--st-line: rgba(217, 165, 32, 0.28);
}

/* Section shell */

.st_section
{
	position: relative;
	padding: 64px 0;
	background-color: var(--st-cream);
	/* savanna light: low sun glow + dust grain */
	background-image:
		radial-gradient(ellipse at 88% 0%, rgba(217, 165, 32, 0.30), rgba(217, 165, 32, 0) 55%),
		radial-gradient(ellipse at 0% 100%, rgba(184, 134, 11, 0.16), rgba(184, 134, 11, 0) 50%),
		radial-gradient(rgba(44, 24, 16, 0.07) 1px, rgba(44, 24, 16, 0) 1.6px);
	background-size: auto, auto, 18px 18px;
	color: var(--st-brown);
	scroll-margin-top: 110px;
}
.st_section.st_dark
{
	background-color: var(--st-espresso);
	background-image: radial-gradient(ellipse at 50% 0%, rgba(217, 165, 32, 0.10), rgba(217, 165, 32, 0) 60%);
	background-size: auto;
	color: var(--st-white);
}
.st_section > .container
{
	position: relative;
	z-index: 1;
}

/* Photo horizon strip fading into light sections */

.st_horizon
{
	padding-bottom: 170px;
}
.st_horizon::after
{
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 150px;
	content: '';
	background: url(../images/kenya_elephant_grass.jpg) no-repeat center bottom;
	background-size: cover;
	filter: sepia(0.55) saturate(0.85);
	opacity: 0.55;
	-webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), var(--st-ink) 85%);
	mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), var(--st-ink) 85%);
	pointer-events: none;
}
.st_head
{
	max-width: 760px;
	margin: 0 auto 40px;
	text-align: center;
}
.st_eyebrow
{
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--st-bronze);
	margin-bottom: 12px;
}
.st_dark .st_eyebrow
{
	color: var(--st-gold);
}
.st_title
{
	font-size: 30px;
	font-weight: 800;
	line-height: 1.2;
	color: var(--st-espresso);
	margin-bottom: 0;
}
.st_dark .st_title
{
	color: var(--st-white);
}
.st_title::after
{
	display: block;
	content: '';
	width: 56px;
	height: 3px;
	margin: 18px auto 0;
	background: linear-gradient(to right, var(--st-bronze), var(--st-gold));
}
.st_lead
{
	font-size: 15px;
	line-height: 1.8;
	color: #5A4636;
	margin: 20px 0 0;
}
.st_dark .st_lead
{
	color: rgba(255, 255, 255, 0.78);
}

/* Who we are */

.st_about .st_head,
.st_about .st_title::after
{
	text-align: left;
	margin-left: 0;
}
.st_about .st_head
{
	margin-bottom: 0;
}
.st_about p
{
	font-size: 15px;
	line-height: 1.85;
	color: #4A382B;
	margin: 20px 0 0;
}
.st_motto
{
	margin-top: 26px;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--st-bronze);
}
.st_purpose
{
	margin-top: 40px;
}
.st_purpose_card
{
	position: relative;
	padding: 28px 26px 28px 30px;
	background: var(--st-espresso);
	color: var(--st-white);
	border-left: 3px solid var(--st-gold);
	transition: transform 300ms ease, box-shadow 300ms ease;
}
.st_purpose > *
{
	margin-bottom: 20px;
}
.st_purpose_card
{
	height: 100%;
}
.st_about_photo
{
	margin-top: 36px;
	border: 1px solid var(--st-gold);
	padding: 8px;
}
.st_about_photo img
{
	display: block;
	width: 100%;
	height: 260px;
	object-fit: cover;
}
.st_purpose_card:hover
{
	transform: translateY(-6px);
	box-shadow: 0 18px 40px rgba(43, 27, 23, 0.28);
}
.st_purpose_label
{
	display: flex;
	align-items: center;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--st-gold);
	margin-bottom: 12px;
}
.st_purpose_label i
{
	font-size: 18px;
	margin-right: 12px;
}
.st_purpose_card p
{
	font-size: 15px;
	line-height: 1.8;
	color: rgba(255, 255, 255, 0.86);
	margin: 0;
}

/* Card grids */

.st_grid
{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin: -10px;
}
.st_grid > *
{
	flex: 0 0 100%;
	max-width: 100%;
	padding: 10px;
}
.st_card
{
	height: 100%;
	padding: 30px 24px;
	background: var(--st-ivory);
	border: 1px solid var(--st-sand);
	box-shadow: 0 6px 18px rgba(44, 24, 16, 0.07);
	border-top: 3px solid transparent;
	transition: transform 300ms ease, box-shadow 300ms ease, border-color 300ms ease, background 300ms ease;
}
.st_dark .st_card
{
	background: var(--st-brown);
	border-color: var(--st-line);
	border-top-color: transparent;
}
.st_card:hover
{
	transform: translateY(-6px);
	border-top-color: var(--st-gold);
	box-shadow: 0 20px 44px rgba(43, 27, 23, 0.16);
}
.st_dark .st_card:hover
{
	border-color: var(--st-gold);
	box-shadow: 0 20px 44px rgba(0, 0, 0, 0.45);
}
.st_icon
{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: var(--st-espresso);
	color: var(--st-gold);
	font-size: 22px;
	margin-bottom: 20px;
	transition: background 300ms ease, color 300ms ease, transform 300ms ease;
}
.st_dark .st_icon
{
	background: transparent;
	border: 1px solid var(--st-gold);
}
.st_card:hover .st_icon
{
	background: var(--st-gold);
	color: var(--st-espresso);
	transform: scale(1.06);
}
.st_card h3
{
	font-size: 17px;
	font-weight: 700;
	color: var(--st-espresso);
	margin-bottom: 10px;
}
.st_dark .st_card h3
{
	color: var(--st-white);
}
.st_card p
{
	font-size: 14px;
	line-height: 1.75;
	color: #5A4636;
	margin: 0;
}
.st_dark .st_card p
{
	color: rgba(255, 255, 255, 0.74);
}
.st_values .st_card
{
	text-align: center;
}
.st_values .st_icon
{
	margin-left: auto;
	margin-right: auto;
}

/* Who we serve */

.st_badge
{
	display: flex;
	align-items: flex-start;
	height: 100%;
	padding: 20px 22px;
	border: 1px solid var(--st-line);
	border-radius: 4px;
	transition: background 300ms ease, border-color 300ms ease, transform 300ms ease;
}
.st_badge:hover
{
	background: var(--st-brown);
	border-color: var(--st-gold);
	transform: translateY(-4px);
}
.st_badge i
{
	flex: 0 0 auto;
	width: 28px;
	font-size: 20px;
	line-height: 24px;
	color: var(--st-gold);
	margin-right: 14px;
	text-align: center;
}
.st_badge h3
{
	font-size: 15px;
	font-weight: 700;
	color: var(--st-white);
	margin-bottom: 4px;
}
.st_badge p
{
	font-size: 13px;
	line-height: 1.65;
	color: rgba(255, 255, 255, 0.72);
	margin: 0;
}

/* Experience timeline: vertical on mobile, horizontal from lg */

.st_steps
{
	display: flex;
	flex-direction: column;
	margin: 0;
	padding: 0;
	list-style: none;
}
.st_step
{
	position: relative;
	padding: 0 0 34px 78px;
	min-height: 56px;
}
.st_step:last-child
{
	padding-bottom: 0;
}
.st_step::before
{
	position: absolute;
	top: 56px;
	bottom: 0;
	left: 27px;
	width: 2px;
	content: '';
	background: var(--st-sand);
}
.st_step:last-child::before
{
	display: none;
}
.st_step_num
{
	position: absolute;
	top: 0;
	left: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: var(--st-cream);
	border: 2px solid var(--st-bronze);
	color: var(--st-bronze);
	font-size: 16px;
	font-weight: 800;
	transition: background 300ms ease, color 300ms ease, transform 300ms ease;
}
.st_step:hover .st_step_num
{
	background: var(--st-espresso);
	border-color: var(--st-gold);
	color: var(--st-gold);
	transform: scale(1.08);
}
.st_step h3
{
	font-size: 17px;
	font-weight: 700;
	color: var(--st-espresso);
	margin-bottom: 8px;
	padding-top: 4px;
}
.st_step p
{
	font-size: 14px;
	line-height: 1.75;
	color: #5A4636;
	margin: 0;
}

/* Commitment banner */

.st_commit
{
	padding: 56px 0;
	background: linear-gradient(135deg, var(--st-brown), var(--st-espresso));
	border-top: 1px solid var(--st-line);
	border-bottom: 1px solid var(--st-line);
	scroll-margin-top: 110px;
}
.st_commit_box
{
	padding: 36px 24px;
	border: 1px solid var(--st-gold);
	text-align: center;
}
.st_commit_text
{
	max-width: 820px;
	margin: 22px auto 0;
	font-size: 15px;
	line-height: 1.85;
	color: rgba(255, 255, 255, 0.84);
}
.st_trust
{
	display: flex;
	flex-direction: column;
	align-items: center;
	margin: 28px 0 0;
	padding: 0;
	list-style: none;
}
.st_trust li
{
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--st-white);
	margin: 6px 16px;
}
.st_trust i
{
	color: var(--st-gold);
	margin-right: 10px;
}
.st_btn
{
	display: inline-block;
	margin-top: 30px;
	padding: 0 38px;
	font-size: 13px;
	font-weight: 700;
	line-height: 50px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--st-espresso);
	background: var(--st-gold);
	border: 1px solid var(--st-gold);
	transition: background 300ms ease, color 300ms ease;
}
.st_btn:hover,
.st_btn:focus
{
	background: transparent;
	color: var(--st-gold);
}

/* Contact: savanna sand panel replaces the template stock photo */

html
{
	scroll-behavior: smooth;
}
.contact .contact_background
{
	display: none;
}
.st_contact_info
{
	margin-bottom: 40px;
}
.st_contact_info .st_title::after
{
	margin-left: 0;
}
.st_contact_list
{
	margin: 28px 0 0;
	padding: 0;
	list-style: none;
}
.st_contact_list li
{
	display: flex;
	align-items: flex-start;
	font-size: 15px;
	line-height: 1.6;
	color: var(--st-brown);
	margin-bottom: 14px;
	word-break: break-word;
}
.st_contact_list i
{
	flex: 0 0 34px;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: var(--st-espresso);
	color: var(--st-gold);
	font-size: 15px;
	line-height: 34px;
	text-align: center;
	margin: -5px 14px 0 0;
}
.st_contact_list a
{
	color: var(--st-brown);
	font-weight: 600;
	transition: color 200ms ease;
}
.st_contact_list a:hover
{
	color: var(--st-bronze);
}
.contact .contact_form_container
{
	background: linear-gradient(135deg, var(--st-brown), var(--st-espresso));
	border-top: 3px solid var(--st-gold);
	box-shadow: 0 24px 50px rgba(43, 27, 23, 0.30);
}
.contact .form_submit_button
{
	background: var(--st-gold);
	color: var(--st-espresso);
}

/* Scroll reveal (only when JS is running) */

.st_js .st_reveal
{
	opacity: 0;
	transform: translateY(32px);
	transition: opacity 700ms ease, transform 700ms cubic-bezier(0.22, 0.61, 0.36, 1);
}
.st_js .st_reveal.is_visible
{
	opacity: 1;
	transform: none;
}
.st_js .st_reveal_zoom
{
	transform: scale(0.94);
}
.st_js .st_reveal .st_title::after
{
	width: 0;
	transition: width 700ms ease 350ms;
}
.st_js .st_reveal.is_visible .st_title::after
{
	width: 56px;
}

/* Hero: photo slides with slow zoom + espresso/gold wash */

.home_slider_item
{
	overflow: hidden;
}
.home_slider_background
{
	opacity: 0.62;
	transform: scale(1.02);
	will-change: transform;
}
.home_slider .owl-item.active .home_slider_background
{
	animation: st_kenburns 9s ease-out forwards;
}
.home_slider_item::after
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	content: '';
	z-index: 1;
	background:
		linear-gradient(to bottom, rgba(43, 27, 23, 0.70), rgba(43, 27, 23, 0.10) 38%, rgba(43, 27, 23, 0.85)),
		radial-gradient(ellipse at 50% 100%, rgba(217, 165, 32, 0.22), rgba(217, 165, 32, 0) 60%);
	pointer-events: none;
}
.search
{
	animation: st_rise 900ms ease 300ms both;
}
@keyframes st_kenburns
{
	from {transform: scale(1.02);}
	to {transform: scale(1.14) translate3d(-1%, -1%, 0);}
}
@keyframes st_rise
{
	from {opacity: 0; transform: translateY(28px);}
	to {opacity: 1; transform: none;}
}

/* Dark sections: project photos under an espresso veil */

.st_section.st_dark,
.st_commit
{
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}
.st_section.st_values
{
	background-image:
		linear-gradient(rgba(43, 27, 23, 0.84), rgba(43, 27, 23, 0.92)),
		url(../images/kenya_elephant.jpg);
}
.st_section.st_serve
{
	background-image:
		linear-gradient(rgba(43, 27, 23, 0.86), rgba(43, 27, 23, 0.93)),
		url(../images/kenya_zebras_sunset.jpg);
}
.st_commit
{
	background-image:
		linear-gradient(135deg, rgba(44, 24, 16, 0.86), rgba(43, 27, 23, 0.93)),
		url(../images/kenya_elephant_grass.jpg);
}

/* Button sheen */

.st_btn
{
	position: relative;
	overflow: hidden;
}
.st_btn::after
{
	position: absolute;
	top: 0;
	left: -80%;
	width: 50%;
	height: 100%;
	content: '';
	background: linear-gradient(100deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.45), rgba(255, 255, 255, 0));
	transform: skewX(-20deg);
	animation: st_sheen 4.5s ease-in-out infinite;
	pointer-events: none;
}
@keyframes st_sheen
{
	0%, 60% {left: -80%;}
	100% {left: 140%;}
}

@media (prefers-reduced-motion: reduce)
{
	.st_js .st_reveal
	{
		opacity: 1;
		transform: none;
		transition: none;
	}
	.st_js .st_reveal .st_title::after
	{
		width: 56px;
		transition: none;
	}
	.home_slider .owl-item.active .home_slider_background,
	.search,
	.st_btn::after
	{
		animation: none;
	}
}

/* Homepage hotels tab: extras + more options (same panel as offers page) */

.search > .container .search_panel
{
	min-height: 192px;
}
.extras
{
	width: 100%;
	margin-top: 32px;
}
.search_extras_item
{
	width: 50%;
	float: left;
	margin-bottom: 10px;
}
.search_extras_item div
{
	display: inline-block;
	cursor: pointer;
}
.search_extras_cb
{
	display: inline-block;
	position: relative;
	float: left;
	width: 12px;
	height: 12px;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background-color: var(--st-white);
	border: 1px solid var(--st-white);
	border-radius: 0px;
	padding: 9px;
	margin-top: 2px;
	cursor: pointer;
}
.search_extras_cb:focus
{
	outline: none;
	border: 1px solid var(--st-espresso);
}
.search_extras_cb:checked::after
{
	display: block;
	position: absolute;
	top: 2px;
	left: 2px;
	width: calc(100% - 4px);
	height: calc(100% - 4px);
	content: '';
	background: var(--st-espresso);
}
.search_extras label,
.more_options_list label
{
	display: block;
	position: relative;
	font-size: 12px;
	font-weight: 400;
	padding-left: 31px;
	margin-bottom: 0px;
	cursor: pointer;
	color: var(--st-white);
}
.more_options
{
	width: 100%;
	margin-top: 22px;
}
.more_options_trigger
{
	display: inline-block;
	position: relative;
}
.more_options_trigger a
{
	font-size: 14px;
	font-weight: 700;
	color: var(--st-white);
	text-transform: uppercase;
	padding-left: 18px;
}
.more_options_trigger a::before
{
	display: block;
	position: absolute;
	top: 7px;
	left: 0;
	width: 10px;
	height: 10px;
	content: '+';
	font-size: 13px;
	line-height: 8px;
	color: var(--st-white);
	padding-left: 1px;
}
.more_options_trigger.active a::before
{
	content: '-';
	padding-left: 2px;
}
.more_options_list
{
	display: block;
	width: 100%;
	max-height: 0px;
	overflow: hidden;
	opacity: 0;
	transition: all 500ms ease;
}
.more_options_list li
{
	margin-bottom: 10px;
}
.more_options_list.active
{
	margin-top: 20px;
	opacity: 1;
}

/* Breakpoints */

@media (min-width: 576px)
{
	.st_grid > *
	{
		flex-basis: 50%;
		max-width: 50%;
	}
	.st_commit_box
	{
		padding: 44px 40px;
	}
}

@media (min-width: 768px)
{
	.st_section
	{
		padding: 84px 0;
	}
	.st_title
	{
		font-size: 36px;
	}
	.st_services .st_grid > *,
	.st_values .st_grid > *,
	.st_serve .st_grid > *
	{
		flex-basis: 33.3333%;
		max-width: 33.3333%;
	}
	.st_trust
	{
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: center;
	}
}

@media (min-width: 992px)
{
	.st_section
	{
		padding: 100px 0;
	}
	.st_horizon
	{
		padding-bottom: 210px;
	}
	.st_head
	{
		margin-bottom: 56px;
	}
	.st_about_photo
	{
		margin-top: 0;
	}
	.st_about_photo img
	{
		height: 420px;
	}
	.st_contact_info
	{
		margin-bottom: 0;
	}
	.st_services .st_grid > *
	{
		flex-basis: 25%;
		max-width: 25%;
	}
	.st_steps
	{
		flex-direction: row;
	}
	.st_step
	{
		flex: 1 1 0;
		padding: 80px 14px 0;
		text-align: center;
	}
	.st_step::before
	{
		top: 27px;
		bottom: auto;
		left: 50%;
		width: 100%;
		height: 2px;
	}
	.st_step_num
	{
		left: 50%;
		margin-left: -28px;
	}
	.st_step:hover .st_step_num
	{
		transform: scale(1.08);
	}
	.search
	{
		height: auto;
	}
	.search_extras_item
	{
		width: 20%;
	}
	/* side slides + parallax only where there is room / a pointer */
	.st_js .st_reveal_left
	{
		transform: translateX(-48px);
	}
	.st_js .st_reveal_right
	{
		transform: translateX(48px);
	}
	.st_section.st_dark,
	.st_commit
	{
		background-attachment: fixed;
	}
}

@media (min-width: 1200px)
{
	.st_values .st_grid > *
	{
		flex-basis: 20%;
		max-width: 20%;
	}
}

/* Editorial rhythm pass: Who We Are / Our Services / The SoulTrack Experience
   Spacing scale 4 · 8 · 12 · 16 · 24 · 32 · 48 · 64 · 96 */

.st_section
{
	padding: 64px 0;
}
.st_head
{
	margin-bottom: 32px;
}
.st_eyebrow
{
	margin-bottom: 8px;
}
.st_title::after
{
	margin-top: 12px;
}
.st_lead
{
	max-width: 56ch;
	margin: 12px auto 0;
	line-height: 1.7;
}

/* Who we are: shorter lines, tighter stack, one contrast band instead of two boxes */

.st_about p
{
	max-width: 60ch;
	margin-top: 12px;
	line-height: 1.7;
}
.st_about .st_head + p
{
	margin-top: 16px;
}
.st_motto
{
	margin-top: 24px;
}
.st_purpose
{
	margin: 48px 0 0;
	background: var(--st-espresso);
	border-left: 3px solid var(--st-gold);
}
.st_purpose > *
{
	margin-bottom: 0;
	padding-left: 0;
	padding-right: 0;
}
.st_purpose_card
{
	padding: 24px;
	background: none;
	border-left: 0;
}
.st_purpose > * + * .st_purpose_card
{
	border-top: 1px solid var(--st-line);
}
.st_purpose_card:hover
{
	transform: none;
	box-shadow: none;
}
.st_purpose_label
{
	margin-bottom: 8px;
}
.st_purpose_card p
{
	max-width: 52ch;
	margin-top: 0;
	line-height: 1.7;
}

/* Our services: hairline rules, no boxes */

.st_services .st_grid
{
	margin: 0 -16px;
}
.st_services .st_grid > *
{
	padding: 0 16px;
}
.st_services .st_card
{
	padding: 16px 0 24px;
	background: none;
	border: 0;
	border-top: 1px solid rgba(44, 24, 16, 0.22);
	box-shadow: none;
}
.st_services .st_card:hover
{
	transform: none;
	border-top-color: var(--st-bronze);
	box-shadow: none;
}
.st_services .st_icon
{
	justify-content: flex-start;
	width: auto;
	height: auto;
	margin-bottom: 12px;
	font-size: 20px;
	color: var(--st-bronze);
	background: none;
	border-radius: 0;
}
.st_services .st_card:hover .st_icon
{
	background: none;
	color: var(--st-espresso);
	transform: none;
}
.st_services .st_card h3
{
	margin-bottom: 4px;
}
.st_services .st_card h3 a
{
	color: inherit;
	border-bottom: 1px solid var(--st-gold);
}
.st_services .st_card p
{
	max-width: 36ch;
	line-height: 1.65;
}

/* Experience: tighter step text */

.st_step
{
	padding-bottom: 24px;
}
.st_step h3
{
	margin-bottom: 4px;
}
.st_step p
{
	max-width: 44ch;
	line-height: 1.65;
}

@media (min-width: 768px)
{
	.st_section
	{
		padding: 80px 0;
	}
	.st_purpose > * + * .st_purpose_card
	{
		border-top: 0;
		border-left: 1px solid var(--st-line);
	}
	.st_purpose_card
	{
		padding: 32px;
	}
}

@media (min-width: 992px)
{
	.st_section
	{
		padding: 96px 0;
	}
	.st_head
	{
		margin-bottom: 48px;
	}
	.st_purpose
	{
		margin-top: 64px;
	}
	.st_step
	{
		padding: 72px 12px 0;
	}
	.st_step p
	{
		max-width: 26ch;
		margin-left: auto;
		margin-right: auto;
	}
}

/* keep room for the photo strip under the steps */
.st_section.st_horizon
{
	padding-bottom: 170px;
}
@media (min-width: 992px)
{
	.st_section.st_horizon
	{
		padding-bottom: 208px;
	}
}

/* Interactive states: hover · focus · active · disabled
   One focus ring everywhere: gold line on an espresso halo, so it reads on light, gold and dark. */

:root
{
	--st-ring: var(--st-focus);
	--st-halo: var(--st-espresso);
	--st-danger: #9B2C1A;
}
.header,
.home,
.st_dark,
.st_commit,
.footer,
.copyright,
.contact .contact_form_container
{
	--st-halo: var(--st-ink);
	--st-danger: #FF9C85;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible
{
	outline: 3px solid var(--st-ring) !important;
	outline-offset: 2px;
	box-shadow: 0 0 0 2px var(--st-halo), 0 0 0 7px var(--st-halo) !important;
}

/* Disabled: one look for every control */

button:disabled,
input:disabled,
select:disabled,
textarea:disabled,
[aria-disabled="true"]
{
	opacity: 0.5;
	cursor: not-allowed;
	box-shadow: none;
}
[aria-disabled="true"]
{
	pointer-events: none;
}

/* Search tabs (dark text on gold: white failed contrast) */

.search_tab.active,
.search_tab:hover
{
	color: var(--st-espresso);
}
.search_tab.active img,
.search_tab:hover img
{
	-webkit-filter: brightness(0);
	filter: brightness(0);
}
.search_tab:active
{
	background: var(--st-bronze);
}
.search_tab:focus-visible
{
	outline-offset: -4px;
}

/* Search fields */

.search_input,
.dropdown_item_select
{
	border: 1px solid var(--st-white);
	transition: border-color 150ms ease, box-shadow 150ms ease, background-color 150ms ease;
}
.search_input:hover,
.dropdown_item_select:hover
{
	border-color: var(--st-espresso);
}
.search_input:focus,
.dropdown_item_select:focus
{
	border-color: var(--st-espresso);
	color: var(--st-espresso);
}
.search_input:disabled
{
	background-color: #EFE6D2;
	border-color: #EFE6D2;
}

/* Search checkboxes */

.search_extras_cb
{
	transition: border-color 150ms ease, transform 100ms ease;
}
.search_extras_item div:hover .search_extras_cb,
.more_options_item div:hover .search_extras_cb,
.search_extras_cb:hover
{
	border-color: var(--st-espresso);
}
.search_extras_cb:active
{
	transform: scale(0.9);
}
.search_extras_cb:focus
{
	border-color: var(--st-espresso);
}
.search_extras_cb:disabled + label
{
	opacity: 0.5;
	cursor: not-allowed;
}
.more_options_trigger a:hover
{
	color: var(--st-espresso);
}

/* Buttons */

.search_button,
.contact .form_submit_button,
.st_btn
{
	transition: background-color 200ms ease, color 200ms ease, transform 100ms ease, box-shadow 200ms ease, opacity 200ms ease;
}
.search_button:hover
{
	opacity: 1;
	background: #3B2618;
	box-shadow: 0 10px 22px rgba(43, 27, 23, 0.35);
}
.search_button:active
{
	background: var(--st-ink);
	box-shadow: none;
	transform: translateY(17px);
}
.search_button:disabled,
.search_button:disabled:hover
{
	background: #2B1B17;
	box-shadow: none;
	transform: translateY(15px);
}
.contact .form_submit_button:hover
{
	opacity: 1;
	background: #DDB942;
	box-shadow: 0 10px 22px rgba(0, 0, 0, 0.35);
}
.contact .form_submit_button:active
{
	background: var(--st-bronze);
	box-shadow: none;
	transform: translateY(17px);
}
.contact .form_submit_button:disabled,
.contact .form_submit_button:disabled:hover
{
	background: var(--st-gold);
	box-shadow: none;
	transform: translateY(15px);
}
.st_btn:active
{
	background: var(--st-bronze);
	border-color: var(--st-bronze);
	color: var(--st-espresso);
	transform: translateY(1px);
}
.home_slider_button
{
	transition: transform 100ms ease;
}
.home_slider_button:active
{
	transform: scale(0.97);
}
/* the link sits inside a clipped pill: ring goes on the pill */
.button:has(a:focus-visible)
{
	outline: 3px solid var(--st-ring);
	outline-offset: 3px;
	box-shadow: 0 0 0 3px var(--st-halo), 0 0 0 8px var(--st-halo);
}
.button a:focus-visible
{
	outline: 0 !important;
}

/* Slider arrows, dots, menu and search icons (made focusable in soultrack.js) */

.home_slider_nav,
.hamburger,
.content_search,
.menu_close_container
{
	border-radius: 6px;
}
.home_slider_nav:active,
.hamburger:active,
.content_search:active
{
	opacity: 0.7;
}
.home_slider_custom_dot:focus-visible
{
	border-radius: 18px;
}

/* Contact form */

.contact .input_field,
.contact .text_field
{
	transition: border-color 150ms ease, background-color 150ms ease;
}
.contact .input_field:hover,
.contact .text_field:hover
{
	border-bottom-color: var(--st-gold);
}
.contact .input_field:focus,
.contact .text_field:focus
{
	border-bottom-color: var(--st-gold);
	background-color: rgba(255, 255, 255, 0.06);
}
.contact .input_field:user-invalid,
.contact .text_field:user-invalid
{
	border-bottom-color: var(--st-danger);
}
.contact .input_field:disabled,
.contact .text_field:disabled
{
	border-bottom-style: dashed;
}

/* Service cards: only the linked card acts like a control */

.st_services .st_card
{
	position: relative;
	transition: border-color 200ms ease;
}
.st_services .st_card h3 a
{
	transition: color 200ms ease;
}
.st_services .st_card h3 a::before
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	content: '';
}
.st_services .st_card h3 a::after
{
	display: inline-block;
	margin-left: 8px;
	content: '\2192';
	transition: transform 200ms ease;
}
.st_services .st_card:has(a):hover
{
	border-top-color: var(--st-gold);
}
.st_services .st_card:has(a):hover h3 a
{
	color: var(--st-bronze);
}
.st_services .st_card:has(a):hover h3 a::after
{
	transform: translateX(4px);
}
.st_services .st_card:has(a):active h3 a
{
	color: var(--st-espresso);
}
.st_services .st_card:has(a:focus-visible)
{
	outline: 3px solid var(--st-ring);
	outline-offset: 6px;
	box-shadow: 0 0 0 6px var(--st-cream), 0 0 0 11px var(--st-halo);
}
.st_services .st_card h3 a:focus-visible
{
	outline: 0 !important;
}

/* Text links */

.st_contact_list a:hover,
.footer a:hover
{
	text-decoration: underline;
}
.st_contact_list a:active
{
	color: var(--st-espresso);
}

@media (prefers-reduced-motion: reduce)
{
	.search_button,
	.contact .form_submit_button,
	.st_btn,
	.home_slider_button,
	.search_extras_cb,
	.st_services .st_card h3 a::after
	{
		transition: none;
	}
}

/* Palette pass: tinted neutrals, espresso containers, no raw black or white */

body
{
	background: var(--st-cream);
	color: #6B5848;
}
.search_tab
{
	background: var(--st-ivory);
	color: var(--st-espresso);
}
.search_input,
.dropdown_item_select
{
	background-color: var(--st-ivory);
	border-color: var(--st-ivory);
	color: #6B5848;
}
.search_extras_cb
{
	background-color: var(--st-ivory);
	border-color: var(--st-ivory);
}
.mag_glass
{
	fill: var(--st-white);
}

/* bronze as text on cream was too faint: darker bronze for small type */
.st_eyebrow,
.st_motto,
.st_services .st_icon,
.st_step_num
{
	color: var(--st-bronze-text);
}
.st_step_num
{
	border-color: var(--st-bronze-text);
}
.st_dark .st_eyebrow,
.st_commit .st_eyebrow
{
	color: var(--st-gold);
}

/* gold search bar: espresso type (warm white on gold was too faint) */
.search_item div,
.search_extras label,
.more_options_list label,
.more_options_trigger a,
.more_options_trigger a::before
{
	color: var(--st-espresso);
}
.more_options_trigger a:hover
{
	text-decoration: underline;
}

/* Inner page hero (About, Services, Contact) */

.st_page_hero
{
	position: relative;
	padding: 170px 0 56px;
	background: var(--st-espresso);
	overflow: hidden;
}
.st_page_hero_bg
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-size: cover;
	background-position: center center;
	opacity: 0.5;
}
.st_page_hero::after
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	content: '';
	background: linear-gradient(to bottom, rgba(43, 27, 23, 0.80), rgba(43, 27, 23, 0.35) 55%, rgba(43, 27, 23, 0.85));
	pointer-events: none;
}
.st_page_hero > .container
{
	position: relative;
	z-index: 1;
	animation: st_rise 700ms ease 100ms both;
}
.st_page_hero .st_eyebrow
{
	color: var(--st-gold);
}
.st_page_title
{
	font-size: 40px;
	font-weight: 900;
	line-height: 1.1;
	color: var(--st-white);
	margin: 0;
}
@media (min-width: 992px)
{
	.st_page_hero
	{
		padding: 220px 0 80px;
	}
	.st_page_title
	{
		font-size: 60px;
	}
}
@media (prefers-reduced-motion: reduce)
{
	.st_page_hero > .container
	{
		animation: none;
	}
}

/* No site search yet: hide the template's search icon and box */

.content_search,
.search_form
{
	display: none !important;
}

.st_form_note
{
	margin: 28px 0 0;
	font-size: 12px;
	color: rgba(255, 248, 236, 0.75);
}
input[type="date"].search_input
{
	min-width: 0;
	text-transform: uppercase;
}

/* Golden hour pass: less brown, more light and gold
   Aim: about 70% light surfaces, 20% espresso, 10% gold. */

:root
{
	--st-gold: #D9A520;
	--st-gold-bright: #F2B632;
	--st-wheat: #EAD7A6;
	--st-line: rgba(217, 165, 32, 0.34);
}

/* Our Values: wheat band with a low sun glow */

.st_section.st_values
{
	background-color: var(--st-wheat);
	background-image:
		radial-gradient(ellipse at 50% 0%, rgba(242, 182, 50, 0.55), rgba(242, 182, 50, 0) 62%),
		radial-gradient(rgba(43, 27, 23, 0.06) 1px, rgba(43, 27, 23, 0) 1.6px);
	background-size: auto, 18px 18px;
	background-attachment: scroll;
	border-top: 1px solid var(--st-line);
	border-bottom: 1px solid var(--st-line);
}
.st_values .st_card
{
	padding: 24px 16px;
	background: var(--st-ivory);
	border: 0;
	border-top: 3px solid var(--st-gold);
	box-shadow: none;
}
.st_values .st_card:hover
{
	transform: translateY(-4px);
	box-shadow: 0 14px 30px rgba(122, 86, 0, 0.18);
}
.st_values .st_icon
{
	margin-bottom: 12px;
	background: var(--st-gold);
	color: var(--st-espresso);
}
.st_values .st_card:hover .st_icon
{
	background: var(--st-espresso);
	color: var(--st-gold-bright);
}
.st_values .st_card h3
{
	margin-bottom: 4px;
}
.st_values .st_card p
{
	line-height: 1.65;
}

/* Who We Serve: ivory with thin gold-edged rows */

.st_section.st_serve
{
	background-color: var(--st-ivory);
	background-image: none;
	background-attachment: scroll;
}
.st_badge
{
	padding: 16px;
	border: 0;
	border-left: 3px solid var(--st-gold);
	border-radius: 0;
	background: var(--st-cream);
}
.st_badge:hover
{
	background: var(--st-wheat);
	border-color: var(--st-bronze);
	transform: none;
}
.st_badge i
{
	color: var(--st-bronze-text);
}
.st_badge h3
{
	color: var(--st-espresso);
}
.st_badge p
{
	color: #5A4636;
}

/* Heroes: golden-hour tint in place of the flat brown veil */

.home_slider_background
{
	opacity: 0.82;
}
.home_slider_item::after
{
	background:
		linear-gradient(to bottom, rgba(43, 27, 23, 0.74), rgba(43, 27, 23, 0.06) 40%, rgba(133, 80, 10, 0.50) 78%, rgba(43, 27, 23, 0.90)),
		radial-gradient(ellipse at 50% 88%, rgba(242, 182, 50, 0.40), rgba(242, 182, 50, 0) 60%);
}
.home_slider_content h1
{
	text-shadow: 0 2px 20px rgba(28, 17, 14, 0.60);
}
.st_page_hero_bg
{
	opacity: 0.72;
}
.st_page_hero::after
{
	background:
		linear-gradient(to bottom, rgba(43, 27, 23, 0.78), rgba(43, 27, 23, 0.20) 50%, rgba(133, 80, 10, 0.55)),
		radial-gradient(ellipse at 20% 100%, rgba(242, 182, 50, 0.35), rgba(242, 182, 50, 0) 60%);
}
.st_page_title
{
	text-shadow: 0 2px 20px rgba(28, 17, 14, 0.60);
}

/* The espresso that stays: warmed with a gold glow */

.st_commit
{
	background-image:
		radial-gradient(ellipse at 50% 125%, rgba(242, 182, 50, 0.42), rgba(242, 182, 50, 0) 62%),
		linear-gradient(135deg, rgba(84, 52, 22, 0.84), rgba(43, 27, 23, 0.94)),
		url(../images/kenya_elephant_grass.jpg);
}
.st_commit_box
{
	border-color: var(--st-gold-bright);
}
.st_dark .st_eyebrow,
.st_commit .st_eyebrow,
.st_page_hero .st_eyebrow,
.st_purpose_label
{
	color: var(--st-gold-bright);
}
.st_purpose
{
	background: linear-gradient(135deg, #4A2F1C, var(--st-espresso) 70%);
	border-left-color: var(--st-gold-bright);
}
.footer
{
	border-top: 3px solid var(--st-gold);
}
.st_title::after
{
	background: linear-gradient(to right, var(--st-gold-bright), var(--st-bronze));
}

/* Enquiry dialog (js/st-enquiry.js) */

.st_dialog
{
	width: calc(100% - 32px);
	max-width: 460px;
	max-height: calc(100% - 32px);
	padding: 28px 24px 24px;
	overflow-y: auto;
	color: var(--st-brown);
	background: var(--st-ivory);
	border: 0;
	border-top: 4px solid var(--st-gold);
	border-radius: 0;
	box-shadow: 0 30px 80px rgba(28, 17, 14, 0.55);
}
.st_dialog::backdrop
{
	background: rgba(43, 27, 23, 0.72);
}
.st_dialog[open]
{
	animation: st_rise 250ms ease both;
}
.st_dialog_title
{
	margin: 0 0 12px;
	font-size: 22px;
	font-weight: 800;
	line-height: 1.25;
	color: var(--st-espresso);
}
.st_dialog_summary
{
	margin: 0 0 16px;
	padding: 12px 16px;
	list-style: none;
	font-size: 13px;
	line-height: 1.6;
	color: #5A4636;
	background: var(--st-cream);
	border-left: 3px solid var(--st-gold);
}
.st_dialog_summary li:first-child
{
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--st-espresso);
}
.st_dialog_field
{
	display: block;
	margin: 0 0 12px;
}
.st_dialog_field span
{
	display: block;
	margin-bottom: 4px;
	font-size: 12px;
	font-weight: 700;
	color: #5A4636;
}
.st_dialog_field input,
.st_dialog_field textarea
{
	display: block;
	width: 100%;
	padding: 10px 12px;
	font-size: 15px;
	color: var(--st-espresso);
	background: var(--st-white);
	border: 1px solid var(--st-sand);
	border-radius: 0;
	transition: border-color 150ms ease;
}
.st_dialog_field input:hover,
.st_dialog_field textarea:hover
{
	border-color: var(--st-bronze);
}
.st_dialog_trap
{
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	opacity: 0;
}
.st_dialog_error
{
	margin: 0 0 12px;
	font-size: 13px;
	font-weight: 600;
	color: #9B2C1A;
}
.st_dialog_text
{
	margin: 0 0 8px;
	font-size: 15px;
	line-height: 1.7;
	color: #5A4636;
}
.st_dialog_actions
{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
}
.st_dialog .st_btn
{
	margin-top: 8px;
	cursor: pointer;
}
.st_dialog .st_btn:hover,
.st_dialog .st_btn:focus
{
	background: var(--st-espresso);
	border-color: var(--st-espresso);
	color: var(--st-gold-bright);
}
.st_dialog_cancel
{
	margin: 8px 0 0 16px;
	padding: 8px;
	font-size: 13px;
	font-weight: 700;
	color: var(--st-bronze-text);
	background: none;
	border: 0;
	cursor: pointer;
}
.st_dialog_cancel:hover
{
	color: var(--st-espresso);
	text-decoration: underline;
}

/* Footer legal line and plain text pages (Privacy, 404) */

.st_footer_legal
{
	margin-top: 40px;
	padding-top: 20px;
	font-size: 12px;
	color: rgba(255, 248, 236, 0.70);
	border-top: 1px solid var(--st-line);
}
.st_footer_legal a
{
	color: var(--st-gold-bright);
}
.st_prose .container
{
	max-width: 720px;
}
.st_prose h2
{
	margin: 32px 0 8px;
	font-size: 20px;
	font-weight: 800;
	color: var(--st-espresso);
}
.st_prose h2:first-child
{
	margin-top: 0;
}
.st_prose p
{
	max-width: 62ch;
	margin: 0 0 12px;
	font-size: 15px;
	line-height: 1.7;
	color: #4A382B;
}
.st_prose p a:not(.st_btn)
{
	color: var(--st-bronze-text);
	font-weight: 600;
	text-decoration: underline;
}
.st_prose .st_btn
{
	margin-top: 8px;
}
.st_prose .st_btn:hover,
.st_prose .st_btn:focus
{
	background: var(--st-espresso);
	border-color: var(--st-espresso);
	color: var(--st-gold-bright);
}

/* Who we are photo: whole elephant in frame, walking toward the text */

.st_about_photo
{
	margin-top: 32px;
}
.st_about_photo img
{
	height: auto;
	aspect-ratio: 3 / 2;
	object-position: 45% 50%;
}
@media (min-width: 992px)
{
	.st_about_photo
	{
		margin-top: 0;
	}
	.st_about_photo img
	{
		height: auto;
	}
}

/* Logo: round SoulTrack badge */

.logo a img
{
	width: 54px;
	height: 54px;
	vertical-align: middle;
	margin-right: 10px;
	transform: none;
}
.menu_logo a img
{
	width: 72px !important;
	height: 72px;
}
@media only screen and (max-width: 575px)
{
	.logo a img
	{
		width: 40px;
		height: 40px;
		margin-right: 8px;
	}
	.menu_logo a img
	{
		width: 56px !important;
		height: 56px;
	}
}

/* Wordmark beside the badge: same serif, gold and stacking as the logo */

.logo a
{
	display: inline-flex;
	align-items: center;
	text-transform: none;
}
.st_wordmark
{
	display: inline-flex;
	flex-direction: column;
	align-items: stretch;
	line-height: 1;
}
.st_wordmark_name
{
	font-family: Georgia, 'Times New Roman', Times, serif;
	font-size: 30px;
	font-weight: 700;
	letter-spacing: 0.01em;
	color: #E8B56A;
}
.st_wordmark_sub
{
	margin-top: 5px;
	padding-top: 4px;
	font-family: 'Open Sans', Arial, sans-serif;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.34em;
	text-transform: uppercase;
	text-align: center;
	color: #E8B56A;
	border-top: 1px solid rgba(232, 181, 106, 0.55);
}
@media only screen and (max-width: 575px)
{
	.st_wordmark_name
	{
		font-size: 21px;
	}
	.st_wordmark_sub
	{
		margin-top: 3px;
		padding-top: 3px;
		font-size: 7px;
	}
}

/* Search tabs: one accent per service on the espresso + gold base.
   --sx-a / --sx-b: bar gradient + active tab (espresso type, AA 4.8+:1)
   --sx-deep: submit button, icons, focus ring (warm-white type, AA 11+:1)
   Tabs carry their own theme (hover preview); the bar follows the active panel. */

:root
{
	--st-car-a: #D9A520;      --st-car-b: #B8860B;      --st-car-deep: #2B1B17;      --st-car-tint: rgba(217, 165, 32, 0.16);
	--st-hotels-a: #D3A3B5;   --st-hotels-b: #B07C92;   --st-hotels-deep: #3F1E2C;   --st-hotels-tint: rgba(176, 124, 146, 0.18);
	--st-flights-a: #AFB9E4;  --st-flights-b: #8794CB;  --st-flights-deep: #232A57;  --st-flights-tint: rgba(135, 148, 203, 0.18);
	--st-trips-a: #C2BA6E;    --st-trips-b: #99A24A;    --st-trips-deep: #2E3416;    --st-trips-tint: rgba(153, 162, 74, 0.18);
	--st-cruises-a: #6CCAC6;  --st-cruises-b: #36A3A2;  --st-cruises-deep: #0B3A3D;  --st-cruises-tint: rgba(54, 163, 162, 0.18);
	--st-activities-a: #E6A170; --st-activities-b: #C77A48; --st-activities-deep: #4A2412; --st-activities-tint: rgba(199, 122, 72, 0.18);
}
.search,
.st_theme_car,
.search:has(.search_panel.st_theme_car.active)
{
	--sx-a: var(--st-car-a); --sx-b: var(--st-car-b); --sx-deep: var(--st-car-deep); --sx-tint: var(--st-car-tint);
}
.st_theme_hotels,
.search:has(.search_panel.st_theme_hotels.active)
{
	--sx-a: var(--st-hotels-a); --sx-b: var(--st-hotels-b); --sx-deep: var(--st-hotels-deep); --sx-tint: var(--st-hotels-tint);
}
.st_theme_flights,
.search:has(.search_panel.st_theme_flights.active)
{
	--sx-a: var(--st-flights-a); --sx-b: var(--st-flights-b); --sx-deep: var(--st-flights-deep); --sx-tint: var(--st-flights-tint);
}
.st_theme_trips,
.search:has(.search_panel.st_theme_trips.active)
{
	--sx-a: var(--st-trips-a); --sx-b: var(--st-trips-b); --sx-deep: var(--st-trips-deep); --sx-tint: var(--st-trips-tint);
}
.st_theme_cruises,
.search:has(.search_panel.st_theme_cruises.active)
{
	--sx-a: var(--st-cruises-a); --sx-b: var(--st-cruises-b); --sx-deep: var(--st-cruises-deep); --sx-tint: var(--st-cruises-tint);
}
.st_theme_activities,
.search:has(.search_panel.st_theme_activities.active)
{
	--sx-a: var(--st-activities-a); --sx-b: var(--st-activities-b); --sx-deep: var(--st-activities-deep); --sx-tint: var(--st-activities-tint);
}
.search
{
	--st-ring: var(--sx-deep);
	--st-halo: var(--st-white);
	background: linear-gradient(to right, var(--sx-a), var(--sx-b));
	transition: background-color 200ms ease;
}
.search_tab.active,
.search_tab:hover
{
	background: var(--sx-a);
	box-shadow: inset 0 4px 0 var(--sx-deep);
}
.search_tab:active
{
	background: var(--sx-b);
}
.search_panel .search_input:hover,
.search_panel .search_input:focus,
.search_panel .dropdown_item_select:hover,
.search_panel .dropdown_item_select:focus,
.search_panel .search_extras_cb:hover,
.search_panel .search_extras_cb:focus
{
	border-color: var(--sx-deep);
}
.search_panel .search_extras_cb:checked::after
{
	background: var(--sx-deep);
}
.search_panel .search_button
{
	background: var(--sx-deep);
}
.search_panel .search_button:hover
{
	background: var(--sx-deep);
	filter: brightness(1.35);
}
.search_panel .ch_mode i,
.search_panel .ch_field > i
{
	color: var(--sx-deep);
}
.search_panel .ch_mode input:checked + span
{
	border-color: var(--sx-b);
	background: var(--sx-tint);
}
.search_panel .ch_check input:checked + span
{
	border-color: var(--sx-b);
	background: var(--sx-tint);
}
.search_panel .ch_check span::before
{
	color: var(--sx-deep);
}
.search_panel .ch_check input:focus-visible + span
{
	box-shadow: 0 0 0 3px var(--sx-tint);
}
.search_panel .ch_field:focus-within
{
	border-color: var(--sx-deep);
	box-shadow: 0 0 0 3px var(--sx-tint);
}
.search_panel .ch_submit
{
	background: linear-gradient(to right, var(--sx-a), var(--sx-b));
}