/**
 * Inner-page patterns: listings, detail pages, booking & checkout, flights, account, footer.
 * Built from tokens.css and the Figma component board (page 09). Pages: docs/design/pages/.
 */

/* ---------- Page hero (inner pages) ---------- */
.pabe-page-hero {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	gap: var(--pabe-space-16);
	box-sizing: border-box;
	min-height: 520px;
	padding: var(--pabe-space-80) var(--pabe-inset) var(--pabe-space-48);
	overflow: hidden;
	background: var(--pabe-color-ink);
	color: var(--pabe-text-inverse);
	isolation: isolate;
}

.pabe-page-hero--short {
	min-height: 0;
	padding-top: var(--pabe-space-64);
	padding-bottom: var(--pabe-space-48);
}

.pabe-page-hero > img {
	position: absolute;
	inset: 0;
	z-index: -2;
	width: 100%;
	max-width: none;
	height: 100%;
	object-fit: cover;
	border-radius: 0;
}

.pabe-page-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(180deg, rgb(10 10 10 / 20%) 0%, rgb(10 10 10 / 70%) 100%);
}

.pabe-page-hero > :not(img) {
	margin: 0;
	max-width: 1000px;
}

.pabe-page-hero h1 {
	font-size: var(--pabe-text-h2);
	line-height: var(--pabe-leading-display);
	letter-spacing: var(--pabe-tracking-display);
}

.pabe-page-hero p {
	max-width: 560px;
	font-size: var(--pabe-text-lead);
	color: var(--pabe-text-inverse-secondary);
}

.pabe-page-hero .pabe-eyebrow {
	color: var(--pabe-text-accent-inverse);
}

/* Light variant for functional pages (checkout, account). */
.pabe-page-head {
	padding: var(--pabe-space-48) 0 var(--pabe-space-32);
	border-bottom: var(--pabe-rule) solid var(--pabe-border);
}

.pabe-page-head h1 {
	margin: var(--pabe-space-12) 0 0;
	font-size: var(--pabe-text-h2);
	line-height: var(--pabe-leading-display);
	letter-spacing: var(--pabe-tracking-display);
}

.pabe-page-head p {
	margin: var(--pabe-space-12) 0 0;
	max-width: var(--pabe-measure);
	color: var(--pabe-text-secondary);
}

/* ---------- Breadcrumb ---------- */
.pabe-breadcrumb {
	display: flex;
	flex-wrap: wrap;
	gap: var(--pabe-space-8);
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: var(--pabe-text-label);
	letter-spacing: var(--pabe-tracking-meta);
	color: inherit;
}

.pabe-breadcrumb li + li::before {
	content: "/";
	margin-right: var(--pabe-space-8);
	opacity: 0.6;
}

.pabe-breadcrumb a {
	color: inherit;
	text-decoration: none;
}

.pabe-breadcrumb [aria-current] {
	opacity: 0.75;
}

/* ---------- Filter bar & listing ---------- */
.pabe-filterbar {
	display: flex;
	flex-wrap: wrap;
	gap: var(--pabe-space-12);
	align-items: center;
	justify-content: space-between;
	padding-block: var(--pabe-space-24);
	border-bottom: var(--pabe-rule) solid var(--pabe-border);
	margin-bottom: var(--pabe-space-40);
}

.pabe-filterbar__chips {
	display: flex;
	flex-wrap: wrap;
	gap: var(--pabe-space-8);
}

.pabe-filter-chip {
	display: inline-flex;
	align-items: center;
	min-height: var(--pabe-target-min);
	padding: 0 var(--pabe-space-16);
	border: var(--pabe-rule) solid var(--pabe-border);
	border-radius: var(--pabe-radius-control);
	background: var(--pabe-surface);
	color: var(--pabe-text);
	font: inherit;
	font-size: var(--pabe-text-ui);
	text-decoration: none;
	cursor: pointer;
}

.pabe-filter-chip[aria-pressed="true"],
.pabe-filter-chip[aria-current="true"] {
	border-color: var(--pabe-color-ink);
	background: var(--pabe-color-ink);
	color: var(--pabe-text-inverse);
}

.pabe-filterbar__meta {
	display: flex;
	gap: var(--pabe-space-16);
	align-items: center;
	font-size: var(--pabe-text-label);
	color: var(--pabe-text-secondary);
}

.pabe-filterbar__meta select {
	width: auto;
}

.pabe-listing {
	display: grid;
	grid-template-columns: 280px minmax(0, 1fr);
	gap: var(--pabe-space-48);
	align-items: start;
}

.pabe-filters {
	position: sticky;
	top: var(--pabe-space-24);
	display: grid;
	gap: var(--pabe-space-24);
}

.pabe-filters fieldset {
	display: grid;
	gap: var(--pabe-space-12);
	margin: 0;
	padding: 0 0 var(--pabe-space-24);
	border: 0;
	border-bottom: var(--pabe-rule) solid var(--pabe-border);
}

.pabe-filters legend {
	margin-bottom: var(--pabe-space-12);
	padding: 0;
	font-size: var(--pabe-text-eyebrow);
	font-weight: var(--pabe-weight-medium);
	letter-spacing: var(--pabe-tracking-eyebrow);
	text-transform: uppercase;
	color: var(--pabe-text-secondary);
}

.pabe-check {
	display: flex;
	gap: var(--pabe-space-12);
	align-items: center;
	min-height: 32px;
	font-size: var(--pabe-text-card);
}

.pabe-check input {
	width: 18px;
	height: 18px;
	margin: 0;
	accent-color: var(--pabe-color-ink);
}

.pabe-grid-3 {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--pabe-card-gap);
}

.pabe-grid-2 {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--pabe-card-gap);
}

.pabe-pagination {
	display: flex;
	gap: var(--pabe-space-8);
	justify-content: center;
	margin-top: var(--pabe-space-48);
}

/* ---------- Key facts strip ---------- */
.pabe-facts {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	border-top: var(--pabe-rule) solid var(--pabe-border);
	border-bottom: var(--pabe-rule) solid var(--pabe-border);
}

.pabe-facts > div {
	display: grid;
	gap: var(--pabe-space-8);
	padding: var(--pabe-space-24);
	border-left: var(--pabe-rule) solid var(--pabe-border);
}

.pabe-facts > div:first-child {
	border-left: 0;
	padding-left: 0;
}

.pabe-facts dt {
	font-size: var(--pabe-text-eyebrow);
	letter-spacing: var(--pabe-tracking-eyebrow);
	text-transform: uppercase;
	color: var(--pabe-text-secondary);
}

.pabe-facts dd {
	margin: 0;
	font-family: var(--pabe-font-display);
	font-size: 26px;
	line-height: 1.15;
	color: var(--pabe-text-strong);
}

/* ---------- Editorial split ---------- */
.pabe-split {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: var(--pabe-space-80);
	align-items: center;
}

.pabe-split__media {
	overflow: hidden;
	aspect-ratio: 4 / 5;
	border-radius: var(--pabe-radius-media);
}

.pabe-split__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.pabe-split__body {
	display: grid;
	gap: var(--pabe-space-24);
}

.pabe-split__body > * {
	margin: 0;
}

/* ---------- Gallery (1 large + 2 stacked) ---------- */
.pabe-gallery {
	display: grid;
	grid-template-columns: 2fr 1fr;
	grid-template-rows: 240px 240px;
	gap: var(--pabe-card-gap);
}

.pabe-gallery > :first-child {
	grid-row: span 2;
}

.pabe-gallery img,
.pabe-gallery .pabe-media--placeholder {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: var(--pabe-radius-media);
}

/* ---------- Detail layout: content + sticky booking card ---------- */
.pabe-detail {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 420px;
	gap: var(--pabe-space-64);
	align-items: start;
}

.pabe-detail__main {
	display: grid;
	gap: var(--pabe-space-64);
}

.pabe-detail__main > section > h2 {
	margin: 0 0 var(--pabe-space-24);
	font-size: 44px;
}

/* ---------- Itinerary accordion (Figma "Pabe / Itinerary day") ---------- */
.pabe-itinerary {
	border-top: var(--pabe-rule) solid var(--pabe-color-grey-secondary);
}

.pabe-itinerary__day {
	border-bottom: var(--pabe-rule) solid var(--pabe-border);
}

.pabe-itinerary__day[open] {
	border-bottom-color: var(--pabe-accent);
}

.pabe-itinerary__day summary {
	display: flex;
	gap: var(--pabe-space-16);
	align-items: center;
	justify-content: space-between;
	padding-block: var(--pabe-space-24);
	cursor: pointer;
	list-style: none;
	font-family: var(--pabe-font-display);
	font-size: var(--pabe-text-h3);
	line-height: var(--pabe-leading-heading);
	color: var(--pabe-text-strong);
}

.pabe-itinerary__day summary::-webkit-details-marker {
	display: none;
}

.pabe-itinerary__day summary::after {
	content: "+";
	flex-shrink: 0;
	font-family: var(--pabe-font-body);
	font-size: 22px;
	font-weight: 300;
}

.pabe-itinerary__day[open] summary::after {
	content: "\2212";
}

.pabe-itinerary__body {
	display: grid;
	gap: var(--pabe-space-16);
	padding-bottom: var(--pabe-space-32);
}

.pabe-itinerary__body > * {
	margin: 0;
}

.pabe-itinerary__body p {
	max-width: var(--pabe-measure);
}

.pabe-itinerary__meta {
	font-size: var(--pabe-text-label);
	color: var(--pabe-text-secondary);
}

/* ---------- Included / not included ---------- */
.pabe-incl {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--pabe-space-40);
}

.pabe-incl h3 {
	margin: 0 0 var(--pabe-space-16);
	font-family: var(--pabe-font-body);
	font-size: var(--pabe-text-eyebrow);
	font-weight: var(--pabe-weight-medium);
	letter-spacing: var(--pabe-tracking-eyebrow);
	text-transform: uppercase;
	color: var(--pabe-text-secondary);
}

.pabe-list {
	display: grid;
	gap: var(--pabe-space-12);
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: var(--pabe-text-small);
}

.pabe-list li {
	display: flex;
	gap: var(--pabe-space-12);
	align-items: baseline;
}

.pabe-list li::before {
	content: "";
	flex-shrink: 0;
	width: 6px;
	height: 6px;
	background: var(--pabe-accent);
	transform: translateY(-2px);
}

.pabe-list--muted li::before {
	background: var(--pabe-color-grey-light);
	outline: 1px solid var(--pabe-color-grey-secondary);
}

/* ---------- Panels, booking card & summary ---------- */
.pabe-panel {
	display: grid;
	gap: var(--pabe-space-20);
	padding: var(--pabe-space-32);
	border: var(--pabe-rule) solid var(--pabe-border);
	border-radius: var(--pabe-radius-media);
	background: var(--pabe-surface);
}

.pabe-panel > * {
	margin: 0;
}

.pabe-panel--alt {
	background: var(--pabe-surface-alt);
}

.pabe-panel--sticky {
	position: sticky;
	top: var(--pabe-space-24);
}

.pabe-panel__title {
	font-family: var(--pabe-font-display);
	font-size: var(--pabe-text-h3);
	font-weight: var(--pabe-weight-regular);
	line-height: var(--pabe-leading-heading);
	color: var(--pabe-text-strong);
}

.pabe-panel__note {
	font-size: var(--pabe-text-label);
	line-height: 1.6;
	color: var(--pabe-text-secondary);
}

.pabe-price-lg {
	display: flex;
	flex-wrap: wrap;
	gap: var(--pabe-space-8);
	align-items: baseline;
}

.pabe-price-lg strong {
	font-family: var(--pabe-font-display);
	font-size: 46px;
	font-weight: var(--pabe-weight-regular);
	line-height: 1.04;
	letter-spacing: var(--pabe-tracking-display);
	color: var(--pabe-text-strong);
}

.pabe-price-lg span {
	font-size: var(--pabe-text-label);
	color: var(--pabe-text-secondary);
}

/* Traveller stepper (Figma "Pabe / Passenger selector") */
.pabe-counter {
	display: flex;
	gap: var(--pabe-space-16);
	align-items: center;
	justify-content: space-between;
	padding-block: var(--pabe-space-16);
	border-bottom: var(--pabe-rule) solid var(--pabe-border);
}

.pabe-counter__label {
	display: grid;
	gap: 2px;
	font-size: var(--pabe-text-body);
	color: var(--pabe-text-strong);
}

.pabe-counter__label small {
	font-size: var(--pabe-text-label);
	color: var(--pabe-text-secondary);
}

.pabe-counter__controls {
	display: flex;
	gap: var(--pabe-space-12);
	align-items: center;
}

.pabe-counter__controls button {
	display: grid;
	place-items: center;
	width: var(--pabe-target-min);
	height: var(--pabe-target-min);
	border: var(--pabe-rule) solid var(--pabe-border);
	border-radius: var(--pabe-radius-control);
	background: var(--pabe-surface);
	font-size: 20px;
	line-height: 1;
	cursor: pointer;
}

.pabe-counter__controls output {
	min-width: 24px;
	text-align: center;
	font-size: var(--pabe-text-body);
}

/* Line-item summary */
.pabe-lines {
	display: grid;
	gap: var(--pabe-space-12);
	margin: 0;
	font-size: var(--pabe-text-small);
}

.pabe-lines > div {
	display: flex;
	gap: var(--pabe-space-16);
	justify-content: space-between;
}

.pabe-lines dt {
	color: var(--pabe-text);
}

.pabe-lines dd {
	margin: 0;
	font-variant-numeric: tabular-nums;
	text-align: right;
	color: var(--pabe-text-strong);
}

.pabe-lines__total {
	padding-top: var(--pabe-space-16);
	border-top: var(--pabe-rule) solid var(--pabe-border);
	font-size: var(--pabe-text-body);
	font-weight: var(--pabe-weight-medium);
}

.pabe-lines__strong dd {
	font-family: var(--pabe-font-display);
	font-size: 28px;
	line-height: 1.1;
}

.pabe-summary-media {
	overflow: hidden;
	aspect-ratio: 16 / 9;
	border-radius: var(--pabe-radius-media);
}

.pabe-summary-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Indicative UGX line (Figma currency rules) */
.pabe-indicative {
	display: grid;
	gap: var(--pabe-space-4);
	padding: var(--pabe-space-16) var(--pabe-space-20);
	border-radius: var(--pabe-radius-control);
	background: var(--pabe-surface-alt);
	font-size: var(--pabe-text-label);
	color: var(--pabe-text-secondary);
}

.pabe-indicative strong {
	font-family: var(--pabe-font-display);
	font-size: 26px;
	font-weight: var(--pabe-weight-regular);
	color: var(--pabe-text-strong);
}

/* ---------- Checkout steps ---------- */
.pabe-steps {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--pabe-space-8);
	margin: 0;
	padding: 0;
	list-style: none;
}

.pabe-steps li {
	display: grid;
	gap: var(--pabe-space-8);
	padding-top: var(--pabe-space-16);
	border-top: 2px solid var(--pabe-border);
	font-size: var(--pabe-text-ui);
	color: var(--pabe-text-secondary);
}

/* Step number lives in the markup (not a CSS counter) so screen readers and design imports see it. */
.pabe-steps__num {
	font-size: var(--pabe-text-eyebrow);
	letter-spacing: var(--pabe-tracking-eyebrow);
}

.pabe-steps li[data-state="done"] {
	border-top-color: var(--pabe-color-ink);
	color: var(--pabe-text);
}

.pabe-steps li[aria-current="step"] {
	border-top-color: var(--pabe-accent);
	font-weight: var(--pabe-weight-medium);
	color: var(--pabe-text-strong);
}

.pabe-checkout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 440px;
	gap: var(--pabe-space-64);
	align-items: start;
}

.pabe-form-section {
	display: grid;
	gap: var(--pabe-space-24);
	padding-bottom: var(--pabe-space-40);
	margin-bottom: var(--pabe-space-40);
	border-bottom: var(--pabe-rule) solid var(--pabe-border);
}

.pabe-form-section > h2 {
	margin: 0;
	font-size: var(--pabe-text-h3);
}

.pabe-form-section > p {
	margin: 0;
	color: var(--pabe-text-secondary);
}

.pabe-form-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--pabe-space-20) var(--pabe-space-24);
}

.pabe-form-grid .pabe-field--full {
	grid-column: 1 / -1;
}

.pabe-field__hint {
	margin: 0;
	font-size: var(--pabe-text-label);
	color: var(--pabe-text-secondary);
}

/* Payment option radio cards */
.pabe-options {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--pabe-space-12);
	margin: 0;
	padding: 0;
	border: 0;
}

.pabe-option {
	position: relative;
	display: block;
}

.pabe-option input {
	position: absolute;
	top: var(--pabe-space-20);
	right: var(--pabe-space-20);
	width: 18px;
	height: 18px;
	margin: 0;
	accent-color: var(--pabe-color-ink);
}

.pabe-option__box {
	display: grid;
	gap: var(--pabe-space-4);
	min-height: 112px;
	box-sizing: border-box;
	padding: var(--pabe-space-20);
	border: var(--pabe-rule) solid var(--pabe-border);
	border-radius: var(--pabe-radius-control);
	cursor: pointer;
}

.pabe-option input:checked + .pabe-option__box {
	border: 2px solid var(--pabe-color-ink);
	padding: calc(var(--pabe-space-20) - 1px);
}

.pabe-option input:focus-visible + .pabe-option__box {
	outline: 2px solid var(--pabe-focus);
	outline-offset: 2px;
}

.pabe-option__label {
	font-size: var(--pabe-text-eyebrow);
	letter-spacing: var(--pabe-tracking-eyebrow);
	text-transform: uppercase;
	color: var(--pabe-text-secondary);
}

.pabe-option__value {
	font-family: var(--pabe-font-display);
	font-size: 30px;
	line-height: 1.1;
	color: var(--pabe-text-strong);
}

.pabe-option__note {
	font-size: var(--pabe-text-label);
	color: var(--pabe-text-secondary);
}

.pabe-methods {
	display: flex;
	flex-wrap: wrap;
	gap: var(--pabe-space-8);
	margin: 0;
	padding: 0;
	list-style: none;
}

.pabe-methods li {
	padding: var(--pabe-space-8) var(--pabe-space-12);
	border: var(--pabe-rule) solid var(--pabe-border);
	border-radius: var(--pabe-radius-control);
	font-size: var(--pabe-text-label);
}

/* ---------- Alerts (Figma "Pabe / Alert") ---------- */
.pabe-alert {
	display: flex;
	gap: var(--pabe-space-16);
	align-items: flex-start;
	padding: var(--pabe-space-24);
	border: var(--pabe-rule) solid var(--pabe-border);
	border-radius: var(--pabe-radius-control);
	background: var(--pabe-surface);
	font-size: var(--pabe-text-card);
	line-height: 1.6;
}

.pabe-alert svg {
	flex-shrink: 0;
	margin-top: 2px;
}

.pabe-alert strong {
	display: block;
	margin-bottom: var(--pabe-space-4);
	font-size: var(--pabe-text-small);
	font-weight: var(--pabe-weight-medium);
	color: var(--pabe-text-strong);
}

.pabe-alert--error {
	border-color: var(--pabe-color-ink);
}

.pabe-alert--success {
	border-color: var(--pabe-color-ink);
}

/* ---------- Status badge ---------- */
.pabe-status {
	display: inline-flex;
	gap: var(--pabe-space-8);
	align-items: center;
	padding: var(--pabe-space-4) var(--pabe-space-12);
	border: var(--pabe-rule) solid var(--pabe-border);
	border-radius: var(--pabe-radius-control);
	font-size: var(--pabe-text-label);
	font-weight: var(--pabe-weight-medium);
	white-space: nowrap;
	color: var(--pabe-text-strong);
}

.pabe-status::before {
	content: "";
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--pabe-color-grey-secondary);
}

.pabe-status--progress::before {
	background: var(--pabe-accent);
}

.pabe-status--done::before {
	background: var(--pabe-color-ink);
}

.pabe-status--done {
	border-color: var(--pabe-color-ink);
}

/* ---------- Payment progress ---------- */
.pabe-progress {
	display: grid;
	gap: var(--pabe-space-8);
}

.pabe-progress__bar {
	height: 4px;
	overflow: hidden;
	border-radius: var(--pabe-radius-control);
	background: var(--pabe-color-grey-light);
}

.pabe-progress__bar span {
	display: block;
	height: 100%;
	background: var(--pabe-color-ink);
}

.pabe-progress__legend {
	display: flex;
	justify-content: space-between;
	font-size: var(--pabe-text-label);
	color: var(--pabe-text-secondary);
}

/* ---------- Table ---------- */
.pabe-table {
	width: 100%;
	border-collapse: collapse;
	font-size: var(--pabe-text-card);
}

.pabe-table th {
	padding: var(--pabe-space-12) var(--pabe-space-16) var(--pabe-space-12) 0;
	border-bottom: var(--pabe-rule) solid var(--pabe-color-grey-secondary);
	font-size: var(--pabe-text-eyebrow);
	font-weight: var(--pabe-weight-medium);
	letter-spacing: var(--pabe-tracking-eyebrow);
	text-align: left;
	text-transform: uppercase;
	color: var(--pabe-text-secondary);
}

.pabe-table td {
	padding: var(--pabe-space-20) var(--pabe-space-16) var(--pabe-space-20) 0;
	border-bottom: var(--pabe-rule) solid var(--pabe-border);
	vertical-align: middle;
}

.pabe-table td.num,
.pabe-table th.num {
	font-variant-numeric: tabular-nums;
	text-align: right;
}

/* ---------- Account ---------- */
.pabe-account {
	display: grid;
	grid-template-columns: 240px minmax(0, 1fr);
	gap: var(--pabe-space-64);
	align-items: start;
	padding-block: var(--pabe-space-48) var(--pabe-section-y);
}

.pabe-account > * {
	min-width: 0;
}

.pabe-account__nav {
	display: grid;
	gap: var(--pabe-space-4);
	margin: 0;
	padding: 0;
	list-style: none;
}

.pabe-account__nav a {
	display: flex;
	align-items: center;
	min-height: var(--pabe-target-min);
	padding: 0 var(--pabe-space-16);
	border-left: 2px solid transparent;
	font-size: var(--pabe-text-small);
	color: var(--pabe-text);
	text-decoration: none;
}

.pabe-account__nav a[aria-current="page"] {
	border-left-color: var(--pabe-accent);
	background: var(--pabe-surface-alt);
	color: var(--pabe-text-strong);
	font-weight: var(--pabe-weight-medium);
}

.pabe-account__main {
	display: grid;
	gap: var(--pabe-space-40);
}

.pabe-account__main > section > h2 {
	margin: 0 0 var(--pabe-space-20);
	font-size: var(--pabe-text-h3);
}

.pabe-stats {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--pabe-card-gap);
}

.pabe-trip {
	display: grid;
	grid-template-columns: 280px minmax(0, 1fr);
	overflow: hidden;
	border: var(--pabe-rule) solid var(--pabe-border);
	border-radius: var(--pabe-radius-media);
}

.pabe-trip > img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.pabe-trip__body {
	display: grid;
	gap: var(--pabe-space-16);
	padding: var(--pabe-space-32);
}

.pabe-trip__body > * {
	margin: 0;
}

.pabe-actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--pabe-space-12);
}

/* Timeline (booking history / audit) */
.pabe-timeline {
	display: grid;
	gap: 0;
	margin: 0;
	padding: 0;
	list-style: none;
	border-left: var(--pabe-rule) solid var(--pabe-border);
}

.pabe-timeline li {
	position: relative;
	display: grid;
	gap: var(--pabe-space-4);
	padding: 0 0 var(--pabe-space-24) var(--pabe-space-24);
	font-size: var(--pabe-text-card);
}

.pabe-timeline li::before {
	content: "";
	position: absolute;
	top: 6px;
	left: -4px;
	width: 7px;
	height: 7px;
	background: var(--pabe-color-ink);
}

.pabe-timeline li[data-state="pending"]::before {
	background: var(--pabe-surface);
	outline: 1px solid var(--pabe-color-grey-secondary);
}

.pabe-timeline time {
	font-size: var(--pabe-text-label);
	color: var(--pabe-text-secondary);
}

/* ---------- Flights ---------- */
.pabe-trip-type {
	display: inline-flex;
	gap: var(--pabe-space-4);
	padding: var(--pabe-space-4);
	border: var(--pabe-rule) solid var(--pabe-border);
	border-radius: var(--pabe-radius-control);
}

.pabe-trip-type label {
	display: inline-flex;
	align-items: center;
	min-height: 40px;
	padding: 0 var(--pabe-space-16);
	border-radius: var(--pabe-radius-control);
	font-size: var(--pabe-text-ui);
	cursor: pointer;
}

.pabe-trip-type input {
	position: absolute;
	opacity: 0;
}

.pabe-trip-type label:has(input:checked) {
	background: var(--pabe-color-ink);
	color: var(--pabe-text-inverse);
}

.pabe-segment {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
	gap: var(--pabe-space-24);
	align-items: center;
	padding: var(--pabe-space-24) 0;
	border-bottom: var(--pabe-rule) solid var(--pabe-border);
}

.pabe-segment__end {
	display: grid;
	gap: var(--pabe-space-4);
}

.pabe-segment__end:last-child {
	text-align: right;
}

.pabe-segment__code {
	font-family: var(--pabe-font-display);
	font-size: 40px;
	line-height: 1;
	color: var(--pabe-text-strong);
}

.pabe-segment__place,
.pabe-segment__time {
	font-size: var(--pabe-text-label);
	color: var(--pabe-text-secondary);
}

.pabe-segment__path {
	display: grid;
	gap: var(--pabe-space-8);
	justify-items: center;
	min-width: 200px;
	font-size: var(--pabe-text-label);
	color: var(--pabe-text-secondary);
}

.pabe-segment__path::before {
	content: "";
	width: 100%;
	height: 1px;
	background: var(--pabe-accent);
}

/* ---------- Auth ---------- */
.pabe-auth {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	min-height: 760px;
}

.pabe-auth__media {
	position: relative;
	display: flex;
	align-items: flex-end;
	padding: var(--pabe-space-48);
	overflow: hidden;
	color: var(--pabe-text-inverse);
	isolation: isolate;
}

.pabe-auth__media img {
	position: absolute;
	inset: 0;
	z-index: -2;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.pabe-auth__media::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: var(--pabe-scrim-photo);
}

.pabe-auth__media p {
	margin: 0;
	max-width: 22ch;
	font-family: var(--pabe-font-display);
	font-size: 44px;
	line-height: 1.08;
}

.pabe-auth__form {
	display: grid;
	gap: var(--pabe-space-20);
	align-content: center;
	max-width: 440px;
	padding: var(--pabe-space-64) var(--pabe-inset);
}

.pabe-auth__form > * {
	margin: 0;
}

/* ---------- Footer (Figma "Pabe / Footer") ---------- */
.pabe-footer {
	padding: var(--pabe-space-80) var(--pabe-inset) var(--pabe-space-40);
	background: var(--pabe-color-ink);
	color: var(--pabe-text-inverse);
	font-size: var(--pabe-text-card);
}

.pabe-footer a {
	color: var(--pabe-text-inverse);
	text-decoration: none;
}

.pabe-footer__top {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
	gap: var(--pabe-space-40);
	align-items: center;
	padding-bottom: var(--pabe-space-48);
	border-bottom: var(--pabe-rule) solid rgb(255 255 255 / 12%);
}

.pabe-footer .pabe-wordmark {
	color: var(--pabe-text-inverse);
}

.pabe-footer .pabe-wordmark__slogan {
	color: var(--pabe-text-accent-inverse);
}

.pabe-footer__tagline {
	margin: 0;
	font-family: var(--pabe-font-display);
	font-size: 48px;
	line-height: 1.1;
	text-align: right;
}

.pabe-footer__cols {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--pabe-space-40);
	padding-block: var(--pabe-space-48);
}

.pabe-footer__cols h2 {
	margin: 0 0 var(--pabe-space-20);
	font-family: var(--pabe-font-body);
	font-size: var(--pabe-text-eyebrow);
	font-weight: var(--pabe-weight-medium);
	letter-spacing: var(--pabe-tracking-eyebrow);
	color: var(--pabe-text-accent-inverse);
}

.pabe-footer__cols ul {
	display: grid;
	gap: var(--pabe-space-16);
	margin: 0;
	padding: 0;
	list-style: none;
}

.pabe-footer__bottom {
	display: flex;
	flex-wrap: wrap;
	gap: var(--pabe-space-24);
	justify-content: space-between;
	padding-top: var(--pabe-space-24);
	border-top: var(--pabe-rule) solid rgb(255 255 255 / 12%);
	font-size: var(--pabe-text-label);
	color: var(--pabe-text-inverse-secondary);
}

.pabe-footer__bottom nav {
	display: flex;
	flex-wrap: wrap;
	gap: var(--pabe-space-24);
}

/* ---------- Responsive ---------- */
@media (max-width: 1199px) {

	.pabe-listing,
	.pabe-detail,
	.pabe-checkout,
	.pabe-split,
	.pabe-account,
	.pabe-auth {
		grid-template-columns: 1fr;
	}

	.pabe-filters,
	.pabe-panel--sticky {
		position: static;
	}

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

	.pabe-facts {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.pabe-facts > div:nth-child(3) {
		border-left: 0;
		padding-left: 0;
	}

	.pabe-footer__top,
	.pabe-footer__cols {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.pabe-footer__tagline {
		text-align: left;
	}

	.pabe-account__nav {
		display: flex;
		overflow-x: auto;
	}

	.pabe-account__nav a {
		border-bottom: 2px solid transparent;
		border-left: 0;
		white-space: nowrap;
	}

	.pabe-account__nav a[aria-current="page"] {
		border-bottom-color: var(--pabe-accent);
	}

	.pabe-auth__media {
		min-height: 280px;
	}
}

@media (max-width: 599px) {

	.pabe-grid-3,
	.pabe-grid-2,
	.pabe-stats,
	.pabe-facts,
	.pabe-incl,
	.pabe-form-grid,
	.pabe-options,
	.pabe-footer__top,
	.pabe-footer__cols,
	.pabe-trip {
		grid-template-columns: 1fr;
	}

	.pabe-facts > div {
		border-left: 0;
		padding-left: 0;
		border-top: var(--pabe-rule) solid var(--pabe-border);
	}

	.pabe-gallery {
		grid-template-columns: 1fr;
		grid-template-rows: 240px 160px 160px;
	}

	.pabe-gallery > :first-child {
		grid-row: auto;
	}

	.pabe-steps {
		grid-template-columns: repeat(4, minmax(64px, 1fr));
		font-size: var(--pabe-text-label);
	}

	.pabe-panel {
		padding: var(--pabe-space-24);
	}

	.pabe-itinerary__day summary {
		font-size: 26px;
	}

	.pabe-segment {
		grid-template-columns: 1fr 1fr;
	}

	.pabe-segment__path {
		grid-column: 1 / -1;
		grid-row: 2;
		min-width: 0;
	}

	.pabe-table thead {
		display: none;
	}

	.pabe-table tr {
		display: grid;
		gap: var(--pabe-space-4);
		padding-block: var(--pabe-space-16);
		border-bottom: var(--pabe-rule) solid var(--pabe-border);
	}

	.pabe-table td {
		padding: 0;
		border: 0;
	}

	.pabe-table td.num {
		text-align: left;
	}

	.pabe-auth__media p {
		font-size: 32px;
	}
}

/* ---------- Principles (Figma "The Pabe difference") ---------- */
.pabe-principles {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--pabe-space-40);
}

.pabe-principles > div {
	display: grid;
	gap: var(--pabe-space-12);
	align-content: start;
	padding-top: var(--pabe-space-24);
	border-top: var(--pabe-rule) solid var(--pabe-accent);
}

.pabe-principles h3 {
	margin: 0;
	font-size: 26px;
}

.pabe-principles p {
	margin: 0;
	font-size: var(--pabe-text-small);
	color: var(--pabe-text-secondary);
}

/* ---------- Newsletter ---------- */
.pabe-newsletter {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: var(--pabe-space-48);
	align-items: end;
}

.pabe-newsletter h2,
.pabe-newsletter p {
	margin: 0;
}

.pabe-newsletter > div {
	display: grid;
	gap: var(--pabe-space-16);
}

.pabe-newsletter__form {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: var(--pabe-space-12);
	align-items: end;
}

.pabe-newsletter__form .pabe-field__hint {
	grid-column: 1 / -1;
}

/* ---------- Long-form text (policies, journal) ---------- */
.pabe-prose {
	display: grid;
	gap: var(--pabe-space-24);
	max-width: 760px;
}

.pabe-prose > *,
.pabe-prose section > * {
	margin: 0;
}

.pabe-prose section {
	display: grid;
	gap: var(--pabe-space-16);
	padding-bottom: var(--pabe-space-32);
	border-bottom: var(--pabe-rule) solid var(--pabe-border);
}

.pabe-prose h2 {
	font-size: var(--pabe-text-h3);
}

/* ---------- Contact ---------- */
.pabe-contact-row {
	display: flex;
	gap: var(--pabe-space-16);
	align-items: flex-start;
	font-size: var(--pabe-text-small);
}

.pabe-contact-row strong {
	display: block;
	font-weight: var(--pabe-weight-medium);
	color: var(--pabe-text-strong);
}

.pabe-map {
	display: grid;
	place-items: center;
	min-height: 220px;
	padding: var(--pabe-space-24);
	border-radius: var(--pabe-radius-media);
	background:
		repeating-linear-gradient(0deg, transparent 0 39px, var(--pabe-border) 39px 40px),
		repeating-linear-gradient(90deg, transparent 0 39px, var(--pabe-border) 39px 40px),
		var(--pabe-surface-alt);
	font-size: var(--pabe-text-label);
	text-align: center;
	color: var(--pabe-text-secondary);
}

.pabe-checkout .pabe-tailor {
	grid-template-columns: 1fr;
}

.pabe-checkout .pabe-tailor__intro {
	min-height: 280px;
}

/* Story variant of the steps list (About page) */
.pabe-steps--story li {
	gap: var(--pabe-space-8);
	padding-right: var(--pabe-space-24);
	font-size: var(--pabe-text-small);
}

.pabe-steps--story strong {
	font-family: var(--pabe-font-display);
	font-size: 26px;
	font-weight: var(--pabe-weight-regular);
	color: var(--pabe-text-strong);
}

@media (max-width: 1199px) {

	.pabe-principles {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.pabe-newsletter {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 599px) {

	.pabe-principles,
	.pabe-newsletter__form {
		grid-template-columns: 1fr;
	}

	.pabe-steps--story {
		grid-template-columns: 1fr;
	}
}

/* ------------------------------------------------------------------ Car hire */

.pabe-fleet {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--pabe-space-24);
	margin: 0;
	padding: 0;
	list-style: none;
}

.pabe-vehicle-card {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border: var(--pabe-rule) solid var(--pabe-border);
	border-radius: var(--pabe-radius-media);
	background: var(--pabe-surface);
}

.pabe-vehicle-card__media {
	display: block;
	overflow: hidden;
	aspect-ratio: 4 / 3;
}

.pabe-vehicle-card__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.6s ease;
}

.pabe-vehicle-card:hover .pabe-vehicle-card__media img {
	transform: scale(1.03);
}

.pabe-vehicle-card__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: var(--pabe-space-12);
	padding: var(--pabe-space-24);
}

.pabe-vehicle-card__body > * {
	margin: 0;
}

.pabe-vehicle-card__title {
	font-family: var(--pabe-font-display);
	font-size: var(--pabe-text-place);
	font-weight: var(--pabe-weight-regular);
	line-height: var(--pabe-leading-heading);
}

.pabe-vehicle-card__title a {
	color: var(--pabe-text-strong);
	text-decoration: none;
}

.pabe-vehicle-card__specs {
	display: flex;
	flex-wrap: wrap;
	gap: var(--pabe-space-8);
	padding: 0;
	list-style: none;
}

.pabe-vehicle-card__specs li {
	padding: 4px 10px;
	border: var(--pabe-rule) solid var(--pabe-border);
	border-radius: 999px;
	font-size: var(--pabe-text-label);
	color: var(--pabe-text-secondary);
}

.pabe-vehicle-card__foot {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: var(--pabe-space-16);
	margin-top: auto;
	padding-top: var(--pabe-space-16);
	border-top: var(--pabe-rule) solid var(--pabe-border);
}

.pabe-vehicle-card__price {
	margin: 0;
	font-family: var(--pabe-font-display);
	font-size: 22px;
}

.pabe-mode-card {
	display: grid;
	overflow: hidden;
	border: var(--pabe-rule) solid var(--pabe-border);
	border-radius: var(--pabe-radius-media);
	background: var(--pabe-surface);
}

.pabe-mode-card .pabe-media {
	aspect-ratio: 16 / 9;
	border-radius: 0;
}

.pabe-mode-card__body {
	display: grid;
	gap: var(--pabe-space-16);
	padding: var(--pabe-space-32);
}

.pabe-mode-card__body > * {
	margin: 0;
}

.pabe-mode-card h3 {
	font-family: var(--pabe-font-display);
	font-size: var(--pabe-text-h3);
	font-weight: var(--pabe-weight-regular);
	line-height: var(--pabe-leading-heading);
}

.pabe-options--stack {
	grid-template-columns: 1fr;
}

.pabe-cta-band {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--pabe-space-32);
	padding: var(--pabe-space-48);
	border-radius: var(--pabe-radius-media);
	background: var(--pabe-surface-alt);
}

.pabe-cta-band h2 {
	margin: 0 0 var(--pabe-space-8);
}

.pabe-cta-band p {
	margin: 0;
}

.pabe-lines__detail {
	font-size: var(--pabe-text-label);
	color: var(--pabe-text-secondary);
}

[data-pabe-self-drive][hidden] {
	display: none;
}

@media (max-width: 1199px) {

	.pabe-fleet {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 599px) {

	.pabe-fleet {
		grid-template-columns: 1fr;
	}

	.pabe-mode-card__body,
	.pabe-cta-band {
		padding: var(--pabe-space-24);
	}
}

/* WhatsApp message previews (design review page only) */

.pabe-wa {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 380px));
	gap: var(--pabe-space-32);
}

.pabe-wa__phone {
	display: grid;
	align-content: start;
	gap: var(--pabe-space-16);
	padding: var(--pabe-space-20);
	border: var(--pabe-rule) solid var(--pabe-border);
	border-radius: 28px;
	background: #ece5dd;
}

.pabe-wa__head {
	display: grid;
	margin: calc(var(--pabe-space-20) * -1) calc(var(--pabe-space-20) * -1) 0;
	padding: var(--pabe-space-16) var(--pabe-space-20);
	border-radius: 28px 28px 0 0;
	background: var(--pabe-color-ink);
	color: var(--pabe-text-inverse);
	font-size: var(--pabe-text-small);
}

.pabe-wa__head span {
	font-size: var(--pabe-text-label);
	color: var(--pabe-text-inverse-secondary);
}

.pabe-wa__item {
	display: grid;
	gap: var(--pabe-space-4);
	justify-items: start;
}

.pabe-wa__item > * {
	margin: 0;
}

.pabe-wa__item--me {
	justify-items: end;
	text-align: right;
}

.pabe-wa__bubble {
	position: relative;
	max-width: 92%;
	padding: 10px 12px 18px;
	border-radius: 0 10px 10px;
	background: var(--pabe-color-white);
	font-size: var(--pabe-text-small);
	line-height: 1.5;
	text-align: left;
	color: var(--pabe-text);
	overflow-wrap: anywhere;
}

.pabe-wa__bubble--me {
	border-radius: 10px 0 10px 10px;
	background: #dcf8c6;
}

.pabe-wa__time {
	position: absolute;
	right: 10px;
	bottom: 4px;
	font-size: 10px;
	color: var(--pabe-text-secondary);
}

@media (max-width: 899px) {

	.pabe-wa {
		grid-template-columns: 1fr;
	}
}

/* ---------- Trust: people, guide's notes, guest stories, credentials ----------
 * Markup comes from the pabe-core templates (templates/front/*.php) and the page designs.
 * Empty photo slots show the striped placeholder until Pabe supplies real portraits. */
.pabe-person {
	display: grid;
	grid-template-columns: 88px minmax(0, 1fr);
	gap: var(--pabe-space-20);
	align-items: start;
}

.pabe-person__photo,
.pabe-team__photo,
.pabe-note__photo {
	overflow: hidden;
	background:
		repeating-linear-gradient(135deg, rgb(255 255 255 / 6%) 0 1px, transparent 1px 12px),
		var(--pabe-color-charcoal);
}

.pabe-person__photo {
	width: 88px;
	aspect-ratio: 1;
	border-radius: var(--pabe-radius-round);
}

.pabe-person__photo img,
.pabe-team__photo img,
.pabe-note__photo img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.pabe-person__body {
	display: grid;
	gap: var(--pabe-space-8);
	justify-items: start;
}

.pabe-person__body > * {
	margin: 0;
}

.pabe-person__name {
	font-family: var(--pabe-font-display);
	font-size: 26px;
	line-height: var(--pabe-leading-heading);
}

.pabe-person__name a {
	text-decoration: none;
}

.pabe-person__meta {
	font-size: var(--pabe-text-small);
	color: var(--pabe-text-secondary);
}

.pabe-person__quote {
	margin: var(--pabe-space-4) 0 0;
	padding-left: var(--pabe-space-16);
	border-left: 2px solid var(--pabe-accent);
	font-family: var(--pabe-font-display);
	font-size: 20px;
	line-height: 1.35;
	color: var(--pabe-text-strong);
}

.pabe-panel .pabe-person {
	grid-template-columns: 64px minmax(0, 1fr);
	gap: var(--pabe-space-16);
}

.pabe-panel .pabe-person__photo {
	width: 64px;
}

/* Team grid */
.pabe-team {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--pabe-card-gap);
	margin: 0;
	padding: 0;
	list-style: none;
}

.pabe-team__link {
	display: grid;
	gap: var(--pabe-space-8);
	text-decoration: none;
	color: inherit;
}

.pabe-team__link > * {
	margin: 0;
}

.pabe-team__photo {
	display: grid;
	place-items: center;
	aspect-ratio: 4 / 5;
	margin-bottom: var(--pabe-space-12);
	border-radius: var(--pabe-radius-media);
	font-size: var(--pabe-text-eyebrow);
	letter-spacing: var(--pabe-tracking-eyebrow);
	text-transform: uppercase;
	color: var(--pabe-color-grey-light);
}

.pabe-team__name {
	font-size: 28px;
}

.pabe-inverse .pabe-team .pabe-meta,
.pabe-inverse .pabe-person__meta {
	color: var(--pabe-text-inverse-secondary);
}

.pabe-team__link:hover .pabe-team__name,
.pabe-team__link:focus-visible .pabe-team__name {
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

/* Guide's note / local insight */
.pabe-note {
	display: grid;
	grid-template-columns: 56px minmax(0, 1fr);
	gap: var(--pabe-space-16);
	margin: var(--pabe-space-16) 0 0;
	padding: var(--pabe-space-24);
	border-left: 2px solid var(--pabe-accent);
	border-radius: 0 var(--pabe-radius-media) var(--pabe-radius-media) 0;
	background: var(--pabe-surface-alt);
}

.pabe-note__photo {
	width: 56px;
	height: 56px;
	border-radius: var(--pabe-radius-round);
}

.pabe-note > div {
	display: grid;
	gap: var(--pabe-space-8);
}

.pabe-note__text {
	margin: 0;
	font-family: var(--pabe-font-display);
	font-size: 22px;
	line-height: 1.35;
	color: var(--pabe-text-strong);
}

/* Guest stories */
.pabe-stories {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--pabe-card-gap);
}

.pabe-story {
	display: grid;
	grid-template-rows: auto 1fr;
	overflow: hidden;
	border: var(--pabe-rule) solid var(--pabe-border);
	border-radius: var(--pabe-radius-media);
	background: var(--pabe-surface);
}

.pabe-story__media {
	display: grid;
	place-items: center;
	aspect-ratio: 16 / 9;
	overflow: hidden;
}

.pabe-story__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.pabe-story__body {
	display: grid;
	gap: var(--pabe-space-16);
	align-content: start;
	padding: var(--pabe-space-32);
}

.pabe-story__body > * {
	margin: 0;
}

.pabe-story__stars {
	font-size: 16px;
	letter-spacing: 3px;
	color: var(--pabe-text-strong);
}

.pabe-story__title {
	font-size: 30px;
}

.pabe-story__shift {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--pabe-space-24);
	margin: 0;
}

.pabe-story__shift div {
	display: grid;
	gap: var(--pabe-space-8);
	align-content: start;
	padding-top: var(--pabe-space-12);
	border-top: var(--pabe-rule) solid var(--pabe-border);
}

.pabe-story__shift dt {
	font-size: var(--pabe-text-eyebrow);
	font-weight: var(--pabe-weight-medium);
	letter-spacing: var(--pabe-tracking-eyebrow);
	text-transform: uppercase;
	color: var(--pabe-text-secondary);
}

.pabe-story__shift dd {
	margin: 0;
	font-family: var(--pabe-font-display);
	font-size: 20px;
	line-height: 1.35;
	color: var(--pabe-text-strong);
}

.pabe-story__text {
	font-size: var(--pabe-text-body);
	line-height: var(--pabe-leading-body);
}

.pabe-story__who {
	display: flex;
	flex-wrap: wrap;
	gap: var(--pabe-space-4) var(--pabe-space-12);
	align-items: baseline;
	padding-top: var(--pabe-space-16);
	border-top: var(--pabe-rule) solid var(--pabe-border);
	font-size: var(--pabe-text-small);
}

.pabe-story__who span {
	color: var(--pabe-text-secondary);
}

.pabe-story__who .pabe-story__verified {
	margin-left: auto;
	padding: 2px var(--pabe-space-8);
	border: var(--pabe-rule) solid var(--pabe-border-strong);
	border-radius: var(--pabe-radius-control);
	font-size: var(--pabe-text-label);
	font-weight: var(--pabe-weight-medium);
	color: var(--pabe-text-strong);
}

/* Rating summary */
.pabe-rating {
	display: flex;
	flex-wrap: wrap;
	gap: var(--pabe-space-8) var(--pabe-space-24);
	align-items: baseline;
}

.pabe-rating > * {
	margin: 0;
}

.pabe-rating__score {
	font-family: var(--pabe-font-display);
	font-size: 22px;
	color: var(--pabe-text-secondary);
}

.pabe-rating__score strong {
	font-size: 64px;
	font-weight: var(--pabe-weight-regular);
	line-height: 1;
	color: var(--pabe-text-strong);
}

.pabe-rating__links {
	display: flex;
	flex-wrap: wrap;
	gap: var(--pabe-space-12) var(--pabe-space-24);
	font-size: var(--pabe-text-small);
}

/* Credentials bar */
.pabe-credentials {
	display: grid;
	gap: var(--pabe-space-20);
	padding-block: var(--pabe-space-24);
	border-block: var(--pabe-rule) solid var(--pabe-border);
}

.pabe-credentials ul {
	display: flex;
	flex-wrap: wrap;
	gap: var(--pabe-space-16) var(--pabe-space-40);
	margin: 0;
	padding: 0;
	list-style: none;
}

.pabe-credentials__list li {
	display: grid;
	gap: 2px;
}

.pabe-credentials__list strong {
	font-size: var(--pabe-text-eyebrow);
	font-weight: var(--pabe-weight-medium);
	letter-spacing: var(--pabe-tracking-eyebrow);
	text-transform: uppercase;
	color: var(--pabe-text-secondary);
}

.pabe-credentials__list span {
	font-family: var(--pabe-font-display);
	font-size: 20px;
	color: var(--pabe-text-strong);
}

.pabe-credentials__list a,
.pabe-credentials__contact {
	font-size: var(--pabe-text-small);
}

.pabe-credentials__contact {
	color: var(--pabe-text-secondary);
}

.pabe-inverse .pabe-credentials {
	border-color: rgb(255 255 255 / 18%);
}

.pabe-inverse .pabe-credentials__list span,
.pabe-inverse .pabe-credentials a {
	color: var(--pabe-text-inverse);
}

.pabe-inverse .pabe-credentials__list strong,
.pabe-inverse .pabe-credentials__contact {
	color: var(--pabe-text-inverse-secondary);
}

/* Founder letter */
.pabe-letter {
	display: grid;
	gap: var(--pabe-space-20);
	max-width: 720px;
}

.pabe-letter > * {
	margin: 0;
}

.pabe-letter p {
	font-family: var(--pabe-font-display);
	font-size: 24px;
	line-height: 1.45;
	color: var(--pabe-text-strong);
}

.pabe-letter p.pabe-letter__sign {
	font-family: var(--pabe-font-body);
	font-size: var(--pabe-text-small);
	color: var(--pabe-text-secondary);
}

/* Review form */
.pabe-review {
	display: grid;
	gap: var(--pabe-space-32);
	max-width: 760px;
}

.pabe-review form {
	display: grid;
	gap: var(--pabe-space-32);
}

.pabe-review__intro {
	display: grid;
	gap: var(--pabe-space-12);
}

.pabe-review__intro > *,
.pabe-review--done > * {
	margin: 0;
}

.pabe-rating-input {
	display: flex;
	flex-wrap: wrap;
	gap: var(--pabe-space-8);
	margin: 0;
	padding: 0;
	border: 0;
}

.pabe-rating-input legend {
	margin-bottom: var(--pabe-space-12);
	font-size: var(--pabe-text-label);
	font-weight: var(--pabe-weight-medium);
}

.pabe-rating-input label {
	display: inline-flex;
	gap: var(--pabe-space-8);
	align-items: center;
	min-height: var(--pabe-target-min);
	padding: 0 var(--pabe-space-16);
	border: var(--pabe-rule) solid var(--pabe-border);
	border-radius: var(--pabe-radius-control);
	font-size: var(--pabe-text-small);
	cursor: pointer;
}

.pabe-rating-input label:has(input:checked) {
	border-color: var(--pabe-border-strong);
	box-shadow: inset 0 0 0 1px var(--pabe-border-strong);
}

/* Design files only: marks a slot that waits for Pabe's real content. WordPress templates never use it. */
.pabe-slot {
	margin: 0;
	padding: var(--pabe-space-12) var(--pabe-space-16);
	border: var(--pabe-rule) dashed var(--pabe-color-grey-secondary);
	border-radius: var(--pabe-radius-control);
	font-size: var(--pabe-text-label);
	line-height: 1.5;
	color: var(--pabe-text-secondary);
}

@media (max-width: 1199px) {

	.pabe-team {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 899px) {

	.pabe-stories,
	.pabe-story__shift {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 599px) {

	.pabe-team {
		grid-template-columns: 1fr;
	}

	.pabe-person {
		grid-template-columns: 64px minmax(0, 1fr);
	}

	.pabe-person__photo {
		width: 64px;
	}

	.pabe-story__body {
		padding: var(--pabe-space-24);
	}

	.pabe-story__who .pabe-story__verified {
		margin-left: 0;
	}

	.pabe-letter p {
		font-size: 20px;
	}
}

/* ---------- Motion on inner-page heroes: a slow drift, off for reduced motion ---------- */
.pabe-page-hero > img,
.pabe-kenburns {
	animation: pabe-kenburns 18s ease-out forwards;
}

@media (prefers-reduced-motion: reduce) {

	.pabe-page-hero > img,
	.pabe-kenburns {
		animation: none;
	}
}

/* ---------- Coming soon ---------- */
.pabe-launch .pabe-slider__stage {
	min-height: 100vh;
	min-height: 100svh;
}

.pabe-launch .pabe-slide {
	padding: 0;
}

.pabe-launch .pabe-slide::after {
	background: linear-gradient(180deg, rgb(10 10 10 / 45%) 0%, rgb(10 10 10 / 35%) 50%, rgb(10 10 10 / 70%) 100%);
}

.pabe-slider.pabe-launch > .pabe-slider__overlay {
	justify-content: space-between;
	gap: var(--pabe-space-48);
	padding: var(--pabe-space-40) var(--pabe-inset) 130px;
	color: var(--pabe-text-inverse);
}

.pabe-launch__top {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--pabe-space-16);
}

.pabe-wordmark--light {
	color: var(--pabe-text-inverse);
}

.pabe-wordmark--light .pabe-wordmark__slogan {
	color: var(--pabe-text-accent-inverse);
}

.pabe-launch__body {
	display: grid;
	gap: var(--pabe-space-24);
	max-width: 760px;
}

.pabe-launch__body > * {
	margin: 0;
}

.pabe-launch .pabe-eyebrow {
	color: var(--pabe-text-accent-inverse);
}

.pabe-countdown {
	display: flex;
	flex-wrap: wrap;
	gap: var(--pabe-space-12);
}

.pabe-countdown > div {
	display: grid;
	gap: var(--pabe-space-4);
	min-width: 88px;
	padding: var(--pabe-space-12) var(--pabe-space-16);
	border: var(--pabe-rule) solid rgb(255 255 255 / 35%);
	border-radius: var(--pabe-radius-control);
	background: rgb(10 10 10 / 25%);
}

.pabe-countdown strong {
	font-family: var(--pabe-font-display);
	font-size: 44px;
	font-weight: var(--pabe-weight-regular);
	line-height: 1;
}

.pabe-countdown span {
	font-size: var(--pabe-text-eyebrow);
	letter-spacing: var(--pabe-tracking-eyebrow);
	text-transform: uppercase;
	color: var(--pabe-text-inverse-secondary);
}

.pabe-launch__form {
	display: grid;
	grid-template-columns: minmax(0, 380px) auto;
	gap: var(--pabe-space-12);
	align-items: end;
}

.pabe-launch__form .pabe-consent {
	grid-column: 1 / -1;
}

.pabe-launch .pabe-field__label,
.pabe-launch .pabe-consent a {
	color: var(--pabe-text-inverse);
}

.pabe-launch .pabe-consent {
	color: var(--pabe-text-inverse-secondary);
}

.pabe-launch__footer {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: var(--pabe-space-16);
	padding: var(--pabe-space-24) var(--pabe-inset);
	border-top: var(--pabe-rule) solid var(--pabe-border);
	font-size: var(--pabe-text-small);
	color: var(--pabe-text-secondary);
}

.pabe-launch__footer nav {
	display: flex;
	flex-wrap: wrap;
	gap: var(--pabe-space-24);
}

.pabe-launch > .pabe-slider__overlay:only-child {
	min-height: 100vh;
	min-height: 100svh;
}

/* ---------- Travel notice (Settings → Launch and notices) ---------- */
.pabe-notice {
	padding: var(--pabe-space-12) var(--pabe-inset);
	background: var(--pabe-color-champagne);
	color: var(--pabe-color-ink);
	font-size: var(--pabe-text-small);
	line-height: 1.5;
}

.pabe-notice p {
	margin: 0;
	max-width: 1160px;
}

.pabe-notice a {
	color: inherit;
}

@media (max-width: 599px) {

	.pabe-notice {
		padding-inline: var(--pabe-space-24);
	}
}

/* ---------- Book with confidence ---------- */
.pabe-confidence__list {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
	gap: var(--pabe-space-24);
	margin: 0;
	padding: var(--pabe-space-32) 0;
	border-bottom: var(--pabe-rule) solid var(--pabe-border);
	list-style: none;
}

.pabe-confidence__list li {
	display: grid;
	grid-template-columns: 20px minmax(0, 1fr);
	gap: var(--pabe-space-12);
	align-items: start;
}

.pabe-confidence__list svg {
	color: var(--pabe-focus);
}

.pabe-confidence__list strong {
	display: block;
	font-size: var(--pabe-text-small);
	font-weight: var(--pabe-weight-medium);
	color: var(--pabe-text-strong);
}

.pabe-confidence__list span {
	display: block;
	margin-top: var(--pabe-space-4);
	font-size: var(--pabe-text-label);
	line-height: 1.5;
	color: var(--pabe-text-secondary);
}

/* ---------- Voices from the field ---------- */
.pabe-voices {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--pabe-card-gap);
}

.pabe-voice {
	display: grid;
	gap: var(--pabe-space-24);
	align-content: space-between;
	margin: 0;
	padding: var(--pabe-space-32);
	border-radius: var(--pabe-radius-media);
	background: var(--pabe-surface);
}

.pabe-voice blockquote {
	margin: 0;
	font-family: var(--pabe-font-display);
	font-size: 24px;
	line-height: 1.35;
	color: var(--pabe-text-strong);
}

.pabe-voice figcaption {
	display: grid;
	grid-template-columns: 48px minmax(0, 1fr);
	gap: var(--pabe-space-12);
	align-items: center;
	font-size: var(--pabe-text-small);
}

.pabe-voice figcaption span {
	display: block;
	font-size: var(--pabe-text-label);
	color: var(--pabe-text-secondary);
}

.pabe-voice__photo {
	width: 48px;
	height: 48px;
	border-radius: var(--pabe-radius-round);
	background:
		repeating-linear-gradient(135deg, rgb(255 255 255 / 6%) 0 1px, transparent 1px 12px),
		var(--pabe-color-charcoal);
}

/* ---------- Uganda at a glance and seasons ---------- */
.pabe-glance {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--pabe-space-32) var(--pabe-card-gap);
	margin: 0;
}

.pabe-glance > div {
	display: grid;
	gap: var(--pabe-space-8);
	align-content: start;
	padding-top: var(--pabe-space-16);
	border-top: var(--pabe-rule) solid var(--pabe-accent);
}

.pabe-glance dt {
	font-size: var(--pabe-text-eyebrow);
	font-weight: var(--pabe-weight-medium);
	letter-spacing: var(--pabe-tracking-eyebrow);
	text-transform: uppercase;
	color: var(--pabe-text-secondary);
}

.pabe-glance dd {
	margin: 0;
	font-family: var(--pabe-font-display);
	font-size: 24px;
	line-height: 1.25;
	color: var(--pabe-text-strong);
}

.pabe-inverse .pabe-glance dt {
	color: var(--pabe-text-inverse-secondary);
}

.pabe-inverse .pabe-glance dd {
	color: var(--pabe-text-inverse);
}

.pabe-months {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	gap: var(--pabe-space-4);
	margin: 0 0 var(--pabe-space-16);
	padding: 0;
	list-style: none;
}

.pabe-months li {
	display: grid;
	gap: var(--pabe-space-8);
	font-size: var(--pabe-text-label);
	text-align: center;
}

.pabe-months li::before {
	content: "";
	height: 40px;
	border-radius: var(--pabe-radius-control);
	background: var(--pabe-color-grey-light);
}

.pabe-months .is-dry::before {
	background: var(--pabe-accent);
}

.pabe-legend {
	display: flex;
	flex-wrap: wrap;
	gap: var(--pabe-space-24);
	margin: 0;
	font-size: var(--pabe-text-label);
	color: var(--pabe-text-secondary);
}

.pabe-legend span::before {
	content: "";
	display: inline-block;
	width: 12px;
	height: 12px;
	margin-right: var(--pabe-space-8);
	vertical-align: -1px;
	border-radius: 2px;
	background: var(--pabe-color-grey-light);
}

.pabe-legend .is-dry::before {
	background: var(--pabe-accent);
}

/* Planned journal articles: shown in the design, not linked until written. */
.pabe-planned {
	opacity: 0.72;
}

/* ---------- Hero concepts ---------- */
.pabe-concept-label {
	display: grid;
	gap: var(--pabe-space-8);
	padding: var(--pabe-space-64) var(--pabe-inset) var(--pabe-space-24);
	border-top: var(--pabe-rule) solid var(--pabe-border);
}

.pabe-concept-label > * {
	margin: 0;
}

.pabe-concept-label h2 {
	font-size: 40px;
}

/* Editorial split: classic two-column hero for About, Car hire and team pages. */
.pabe-hero-split {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	min-height: 680px;
	background: var(--pabe-surface-alt);
}

.pabe-hero-split__body {
	display: grid;
	gap: var(--pabe-space-24);
	align-content: center;
	padding: var(--pabe-space-80) var(--pabe-space-64) var(--pabe-space-80) var(--pabe-inset);
}

.pabe-hero-split__body > * {
	margin: 0;
}

.pabe-hero-split__body h1,
.pabe-hero-split__body h2 {
	font-size: 72px;
	line-height: var(--pabe-leading-display);
	letter-spacing: var(--pabe-tracking-display);
}

.pabe-hero-split__stats {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--pabe-space-24);
	margin: var(--pabe-space-16) 0 0;
	padding-top: var(--pabe-space-24);
	border-top: var(--pabe-rule) solid var(--pabe-border);
}

.pabe-hero-split__stats dt {
	font-size: var(--pabe-text-label);
	color: var(--pabe-text-secondary);
}

.pabe-hero-split__stats dd {
	margin: 0;
	font-family: var(--pabe-font-display);
	font-size: 32px;
	color: var(--pabe-text-strong);
}

.pabe-hero-split__media {
	position: relative;
	overflow: hidden;
}

.pabe-hero-split__media > img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.pabe-hero-split__media .pabe-person {
	position: absolute;
	bottom: var(--pabe-space-32);
	left: var(--pabe-space-32);
	max-width: 380px;
	padding: var(--pabe-space-20);
	border-radius: var(--pabe-radius-media);
	background: var(--pabe-surface);
	grid-template-columns: 56px minmax(0, 1fr);
}

.pabe-hero-split__media .pabe-person__photo {
	width: 56px;
}

/* Panorama: centred title over a wide landscape, with the journey finder overlapping. */
.pabe-hero--center {
	align-items: center;
	justify-content: center;
	min-height: 640px;
	padding-bottom: 140px;
	text-align: center;
}

.pabe-hero--center .pabe-hero__content {
	justify-items: center;
	max-width: 900px;
}

.pabe-hero--center .pabe-hero__actions {
	justify-content: center;
}

.pabe-finder--float {
	position: relative;
	z-index: 2;
	margin-top: -84px;
	padding: var(--pabe-space-24) var(--pabe-space-32);
	border: 0;
	border-radius: var(--pabe-radius-media);
	box-shadow: 0 18px 50px rgb(10 10 10 / 18%);
}

/* Film: a short, muted, looping background film with a visible pause control. */
.pabe-hero--film {
	justify-content: flex-end;
}

.pabe-hero__film-controls {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--pabe-space-12);
}

.pabe-play {
	display: inline-grid;
	place-items: center;
	width: 88px;
	height: 88px;
	border: var(--pabe-rule) solid rgb(255 255 255 / 60%);
	border-radius: var(--pabe-radius-round);
	background: rgb(10 10 10 / 30%);
	color: var(--pabe-text-inverse);
	font-size: 22px;
}

@media (max-width: 1199px) {

	.pabe-glance {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.pabe-voices {
		grid-template-columns: 1fr;
	}

	.pabe-hero-split__body h1,
	.pabe-hero-split__body h2 {
		font-size: 56px;
	}
}

@media (max-width: 899px) {

	.pabe-hero-split {
		grid-template-columns: 1fr;
	}

	.pabe-hero-split__media {
		min-height: 420px;
	}

	.pabe-hero-split__body {
		padding: var(--pabe-space-64) var(--pabe-space-24);
	}

	.pabe-months {
		grid-template-columns: repeat(6, minmax(0, 1fr));
	}
}

@media (max-width: 599px) {

	.pabe-launch__form {
		grid-template-columns: 1fr;
	}

	.pabe-countdown > div {
		min-width: 72px;
	}

	.pabe-countdown strong {
		font-size: 34px;
	}

	.pabe-slider.pabe-launch > .pabe-slider__overlay {
		padding: var(--pabe-space-24) var(--pabe-space-24) 140px;
	}

	.pabe-glance {
		grid-template-columns: 1fr;
	}

	.pabe-hero-split__body h1,
	.pabe-hero-split__body h2 {
		font-size: 42px;
	}

	.pabe-hero-split__stats {
		grid-template-columns: 1fr;
	}

	.pabe-hero-split__media .pabe-person {
		right: var(--pabe-space-16);
		left: var(--pabe-space-16);
	}

	.pabe-finder--float {
		margin-top: -48px;
		padding: var(--pabe-space-20);
	}

	.pabe-concept-label {
		padding-inline: var(--pabe-space-24);
	}
}