:root {
	/* --------------------------------------------------------------
	   Primitive colors
	   -------------------------------------------------------------- */

	--color-white: #ffffff;
	--color-black: #000000;

	--color-charcoal: #232323;
	--color-navy: #212959;
	--color-blue: #021c9e;
	--color-teal: #69bfb7;
	--color-gold: #f8bf3b;
	--color-purple: #9d56cd;
	--color-dark-teal: #007fa6;
	--color-gray-100: #a7a9ac;
	--color-gray-500: #6d6e71;
	--color-coral: #eb716c;
	--color-brand-turquoise: #0094c2;
	--color-light-mint: #b0ccbb;
	--color-light-text: #eaeaea;
	--color-dark-mint: #496b58;
	--color-dark-text: #1b1f1d;
	--color-card-border: #2c3856;
	--color-dark-navy: #0c0d17;
	--color-dark-navy-elevated: #141a33;
	--color-dark-navy-border: #2c3856;
	--color-dark-blue: #0f1d56;
	--color-dark-blue-border: #16478e;
	--color-dark-blue-focus: #081030;
	--color-dark-blue-hover: #13256e;
	--color-dark-blue-border-hover: #1b56ac;
    --color-light-blue: #dfeaff;
	--color-light-blue-border: #bdcadd;
	--color-light-blue-hover: #ebf2ff;
	--color-light-blue-border-hover: #c4d1e0;
	--color-card-dark-background: var(--color-dark-navy);
	--color-card-dark-border: var(--color-dark-navy-border);
	--color-card-dark-label: #adbddb;
	--color-light-surface: #f7f7f9;
	--color-card-light-background: #ffffff;
	--color-card-light-border: #d6dbe5;
	--color-card-light-label: #000000;

	/* --------------------------------------------------------------
	   Semantic colors
	   -------------------------------------------------------------- */

	/* Brand */
	--color-primary: var(--color-navy);
	--color-secondary: var(--color-blue);

	/* Interface */
	--color-accent: var(--color-gold);
	--color-success: var(--color-teal);
	--color-info: var(--color-dark-teal);
	--color-transport: var(--color-purple);
	--color-danger: var(--color-coral);

	/* Text */
	--color-text: var(--color-navy);
	--color-text-muted: var(--color-gray-500);
	--color-text-inverse: var(--color-white);

	/* Backgrounds */
	--color-background: var(--color-white);
	--color-surface: var(--color-white);
	--color-surface-alt: #f7f8fa;

	/* Borders */
	--color-border: var(--color-gray-100);
	--color-border-strong: var(--color-gray-500);

	/* Links */
	--color-link: var(--color-blue);
	--color-link-hover: var(--color-navy);

	/* Buttons */
	--color-button-primary: var(--color-primary);
	--color-button-primary-hover: var(--color-secondary);

	--color-button-secondary: var(--color-accent);
	--color-button-secondary-hover: #e4ac2d;

	/* Alerts */
	--color-alert-info: var(--color-info);
	--color-alert-success: var(--color-success);
	--color-alert-warning: var(--color-accent);
	--color-alert-danger: var(--color-danger);

	/* Sections Backgrounds */
	--section-bg-primary-dark: var( --color-black );
	--section-bg-primary-light: var( --color-light-surface );

	--xo-fuel-prices-bg: var( --color-surface );
	

	/* --------------------------------------------------------------
	   Typography
	   -------------------------------------------------------------- */

	--font-family-body: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

	--font-family-display: "Inter", system-ui, sans-serif;

	--font-weight-light: 300;
	--font-weight-regular: 400;
	--font-weight-medium: 500;
	--font-weight-bold: 700;
	--font-weight-black: 900;

	--font-size-xs: 0.75rem;
	--font-size-sm: 0.875rem;
	--font-size-base: 1rem;
	--font-size-md: 1.111rem;
	--font-size-lg: 1.222rem;
	--font-size-xl: 1.333rem;
	--font-size-2xl: 1.666rem;
	--font-size-3xl: 2.222rem;

	--font-size-h1: 1.666rem;
	--font-size-h1-2x: 1.888rem;
	--font-size-h1-3x: 2.666rem;

	--line-height-tight: 1.111;
	--line-height-heading: 1.125;
	--line-height-body: 1.5;
	--line-height-loose: 1.666;
	--default-header-font-weight: var( --font-weight-light );

	/* --------------------------------------------------------------
	   Spacing
	   -------------------------------------------------------------- */

	--space-0: 0;
	--space-1: 0.25rem;
	--space-2: 0.5rem;
	--space-3: 0.75rem;
	--space-4: 1rem;
	--space-5: 1.25rem;
	--space-6: 1.5rem;
	--space-8: 2rem;
	--space-10: 2.5rem;
	--space-12: 3rem;
	--space-16: 4rem;

	/* --------------------------------------------------------------
	   Layout
	   -------------------------------------------------------------- */

	--content-width-narrow: 48rem;
	/* --- These can use the global content size variables from WordPress defined in theme.json --- */
	/*
	--content-width: 75rem;
	--content-width-wide: 90rem;
	*/
	--content-width: var(--wp--style--global--content-size);
	--content-width-wide: var(--wp--style--global--wide-size);

	--content-gutter: 1rem;
	--section-spacing: 2rem;

	/* --------------------------------------------------------------
	   Shape and effects
	   -------------------------------------------------------------- */

	--radius-small: 0.75rem;
	--radius-medium: 1.125rem;
	--radius-large: 2rem;
	--radius-pill: 999px;

	--shadow-popup: 0 0 0.625rem rgb(0 0 0 / 50%);
	--overlay-dark: rgb(0 0 0 / 75%);

	--transition-fast: 150ms ease-in-out;
	--transition-default: 250ms ease-in-out;

	/* --------------------------------------------------------------
	   Compatibility aliases
	   Temporary aliases for existing Cool Beans CSS.
	   Remove after component migration is complete.
	   -------------------------------------------------------------- */

	--white: var(--color-white);
	--black: var(--color-black);
	--dark-grey: var(--color-gray-900);
	--charcoal: var(--color-gray-800);
	--gray: var(--color-gray-500);
	--light-gray: var(--color-gray-300);
	--medium-grey: var(--color-gray-700);

	--light-blue: var(--color-cyan-100);
	--darker-blue: var(--color-blue-600);
	--navy-blue: var(--color-blue-900);
	--dark-blue: var(--color-blue-950);

	--purple: var(--color-purple-700);
	--red: var(--color-red-700);
	--light-red: var(--color-red-500);
	--lipstick-red: var(--color-pink-700);
	--green: var(--color-green-500);
	--dark-green: var(--color-green-700);
	--ultra-marine: var(--color-cyan-400);

	--body-bg: var(--color-background);

	--blue-btn-gradient: var(--gradient-blue-button);
	--purple-btn-gradient: var(--gradient-purple-button);
	--red-btn-gradient: var(--gradient-red-button);
	--green-btn-gradient: var(--gradient-green-button);

	--rounded-bold: var(--font-family-display);
	--rounded-black: var(--font-family-display);
	--regular: var(--font-family-body);
	--italic: var(--font-family-body);
	--medium: var(--font-family-body);
	--bold: var(--font-family-body);

	--cruise-packages-bg: var(--color-surface);
	--footer-contact-margin-bottoms: .888rem;
	--footer-nav-links-margin-bottoms: 1rem;
	--footer-font-size-small: .933rem;
}

/* medium: 48rem / 768px */
@media (min-width: 64rem) {
	:root {
		--content-gutter: 2rem;
		--section-spacing: 3rem;
	}
}

/* wide: 90rem / 1440px */
@media (min-width: 90rem) {
	:root {
		--content-gutter: 0rem;
	}
}
*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
}

body {
	margin: 0;
	padding: 0;
	background: var(--color-background);
	color: var(--color-text);
	font-family: var(--font-family-body);
	font-size: clamp(1rem, 0.9375rem + 0.25vw, 1.125rem);
	font-weight: var(--font-weight-regular);
	line-height: var(--line-height-body);
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-margin-top: 0 !important;
	}
}

img,
picture,
svg,
video,
canvas {
	display: block;
	max-width: 100%;
}

img {
	height: auto;
}

iframe {
	max-width: 100%;
	border: 0;
}

button,
input,
select,
textarea {
	font: inherit;
}

button,
[type="button"],
[type="reset"],
[type="submit"] {
	cursor: pointer;
}

a {
	color: var(--color-link);
	text-decoration: underline;
	text-decoration-thickness: 0.0625em;
	text-underline-offset: 0.15em;
	transition:
		color var(--transition-fast),
		background-color var(--transition-fast);
}

a:hover {
	color: var(--color-link-hover);
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
	outline: 0.1875rem solid var(--color-primary);
	outline-offset: 0.1875rem;
}

p,
ul,
ol,
blockquote,
figure {
	margin-block-start: 0;
	margin-block-end: var(--space-6);
}

ul,
ol {
	padding-inline-start: 1.5rem;
}

strong,
b {
	font-weight: var(--font-weight-bold);
}
address{ font-style: normal; }
em,
i {
	font-style: italic;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	margin-block-start: 0;
	margin-block-end: var(--space-4);
	color: var(--color-heading);
	font-family: var(--font-family-display);
	font-weight: var(--font-weight-black);
	line-height: var(--line-height-heading);
	text-wrap: balance;
	font-weight: var( --default-header-font-weight );
}

h1 {
	font-size: var(--font-size-h1);
}

h2 {
	font-size: var(--font-size-lg);
}

h3 {
	font-size: var(--font-size-md);
}

h4,
h5,
h6 {
	font-size: var(--font-size-base);
}

@media (min-width: 48rem) {
	h1 {
		font-size: var(--font-size-h1-2x );
	}
	h2 {
		font-size: var(--font-size-xl);
	}
}

/* large: 64rem / 1024px */
@media (min-width: 64rem) {
	body {
		font-size: var(--font-size-lg);
	}

	h1 {
		font-size: var(--font-size-h1-3x );
	}

	h2 {
		font-size: var(--font-size-2xl);
	}

	h3 {
		font-size: var(--font-size-lg);
	}
}

hr {
	height: 0;
	margin-block: var(--space-8);
	border: 0;
	border-top: 1px solid var(--color-border);
}

table {
	width: 100%;
	border-collapse: collapse;
}

th {
	font-weight: var(--font-weight-bold);
	text-align: left;
}

pre,
code,
kbd,
samp {
	font-family:
		ui-monospace,
		SFMono-Regular,
		Menlo,
		Monaco,
		Consolas,
		"Liberation Mono",
		monospace;
}

pre {
	overflow-x: auto;
	padding: var(--space-4);
	background: var(--color-surface);
}

/* --------------------------------------------------------------
   Button foundation
   -------------------------------------------------------------- */

.btn,
.button,
.wp-element-button,
.wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--space-2);
	min-height: 2.75rem;
	padding: var(--space-2) var(--space-5);
	border: 0;
	border-radius: var(--radius-pill);
	background: var(--color-primary);
	color: var(--color-text-inverse);
	font-family: var(--font-family-display);
	font-weight: var(--font-weight-bold);
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
	transition:
		background-color var(--transition-fast),
		color var(--transition-fast),
		transform var(--transition-fast);
}

.btn:hover,
.button:hover,
.wp-element-button:hover,
.wp-block-button__link:hover {
	background: var(--color-primary-hover);
	color: var(--color-text-inverse);
}

.btn:active,
.button:active,
.wp-element-button:active,
.wp-block-button__link:active {
	transform: translateY(1px);
}

.icon-button{ display: flex; }
.icon-button .icon{ display: inline-block; height: 15px; width: 15px; }

body .xo-notice--top { z-index: 90; }
.xo-mobile-menu{ font-size: 1.444rem; text-align: center; }
.xo-mobile-menu .wp-block-navigation.is-vertical{ }
.xo-mobile-menu .wp-block-navigation.is-vertical {
    --navigation-layout-direction: column;
    --navigation-layout-justify: flex-start;
    --navigation-layout-align: center;
}
.xo-mobile-menu .mobile-menu-nav-buttons{ margin: 1.666rem 0 0 0; }
.xo-mobile-menu .mobile-menu-nav-buttons .wp-block-button{ margin: 0.833rem 0 0 0; }
.xo-mobile-menu .mobile-menu-nav-buttons .wp-block-button a{ min-width: 16rem; }

.xo-mobile-menu .wp-block-navigation-item__content::after {
	content: "";
	position: absolute;
	left: 8%;
	right: 8%;
	bottom: 0;
	height: 2px;
	background: var(--color-light-blue);
	transform: scaleX(0);
	opacity: 0;
	transition:
		transform var(--transition-fast),
		opacity var(--transition-fast);
}

.xo-mobile-menu .current-menu-item > .wp-block-navigation-item__content::after,
.xo-mobile-menu .current-menu-ancestor > .wp-block-navigation-item__content::after {
	transform: scaleX(1);
	opacity: 1;
}

.xo-mobile-menu .wp-block-navigation-item__content:hover::after,
.xo-mobile-menu .wp-block-navigation-item__content:focus-visible::after {
	transform: scaleX(0.6);
	opacity: 0.5;
}
.site-container,
.site-container-wide,
.site-container-narrow {
	width: calc(100% - (2 * var(--content-gutter)));
	margin-inline: auto;
}

.site-container {
	max-width: var(--content-width);
}

.site-container-wide {
	max-width: var(--content-width-wide);
}

.site-container-narrow {
	max-width: var(--content-width-narrow);
}

.site-section {
	padding-block: var(--section-spacing);
}

.site-main {
	min-width: 0;
	line-height: var(--line-height-body);
}

.site-surface {
	padding: var(--space-4);
	background: var(--color-surface);
}

/*
 * backdrop-filter lives on .xo-site-header > .xo-section (the alignfull
 * wrapper around the header's visible row — same width as .xo-site-header
 * itself) rather than on .xo-site-header directly. backdrop-filter on an
 * ancestor establishes a new containing block for position:fixed
 * descendants (CSSWG containing-block rules shared with
 * transform/filter/perspective/will-change/contain), and .xo-mobile-menu
 * (fixed, inset:0, see xo-dna/assets/css/src/mobile-menu.css) is a sibling
 * of .xo-section but a child of .xo-site-header (see parts/header.html) —
 * putting the blur on .xo-site-header trapped the overlay's fixed
 * positioning inside the header's own box (~header height) instead of the
 * viewport.
 */
.xo-site-header > .xo-section{
	backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}
.xo-site-header .xo-section {
	padding-block: 1.25rem;
}

.xo-site-header__columns {
	align-items: center !important;
	gap: 2rem;
	margin-block: 0;
}

.xo-site-header__columns > .wp-block-column {
	flex-basis: auto !important;
	flex-grow: 0;
}

.xo-site-header__branding-column {
	width: 7rem;
}

.xo-site-header__nav-column {
	flex: 1 1 auto !important;
	min-width: 25rem;
}

.xo-site-header__cta-column {
	width: auto;
	flex-shrink: 0;
}

.xo-site-header__utility-column {
	width: 1rem;
}

.xo-site-header .site-header__branding,
.xo-site-header .site-header__mobile-nav,
.xo-site-header .xo-site-header__utility {
	margin-block: 0;
}

.xo-site-header .site-header__branding {
	justify-content: flex-start;
}

.xo-site-header .site-header__branding .wp-block-xo-dna-site-logo {
	width: min(10.75rem, 100%);
}

.xo-site-header .xo-dna-site-logo__image {
	width: 96%;
	height: auto;
	transition: width var(--transition-fast);
}

.xo-site-header .primary-navigation {
	width: -moz-fit-content;
	width: fit-content;
	max-width: 100%;
	margin-inline: auto;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
}

.xo-site-header .primary-navigation .wp-block-navigation__container {
	gap: clamp(1rem, 2vw, 2rem);
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: var(--color-nav-text);
}

.xo-site-header .primary-navigation .wp-block-navigation-item__content {
	position: relative;
	padding-block: 0.6rem;
	font-family: var(--font-family-display);
	font-size: 1.125rem;
	line-height: 1;
	color: var(--color-nav-text);
	text-decoration: none;
	text-transform: uppercase;
	transition: color var(--transition-fast);
}

/* Active-page indicator. WordPress adds "current-menu-item" to the <li>
   of whichever navigation link matches the current URL — no theme PHP
   needed to detect it. */
.xo-site-header .primary-navigation .wp-block-navigation-item__content::after {
	content: "";
	position: absolute;
	left: 8%;
	right: 8%;
	bottom: 0;
	height: 2px;
	background: var(--color-light-blue);
	transform: scaleX(0);
	opacity: 0;
	transition:
		transform var(--transition-fast),
		opacity var(--transition-fast);
}

.xo-site-header .primary-navigation .current-menu-item > .wp-block-navigation-item__content::after,
.xo-site-header .primary-navigation .current-menu-ancestor > .wp-block-navigation-item__content::after {
	transform: scaleX(1);
	opacity: 1;
}
html[data-xo-theme="light"] .xo-site-header .primary-navigation .wp-block-navigation-item__content::after {
	background: var(--color-black );
}

html[data-xo-theme="dark"] .xo-site-header .primary-navigation .wp-block-navigation-item__content:hover,
html[data-xo-theme="dark"] .xo-site-header .primary-navigation .wp-block-navigation-item__content:focus-visible {
	color: var(--color-light-blue);
}

.xo-site-header .primary-navigation .wp-block-navigation-item__content:hover::after,
.xo-site-header .primary-navigation .wp-block-navigation-item__content:focus-visible::after {
	transform: scaleX(0.6);
	opacity: 0.5;
}

.xo-site-header .primary-navigation .current-menu-item > .wp-block-navigation-item__content:hover::after,
.xo-site-header .primary-navigation .current-menu-item > .wp-block-navigation-item__content:focus-visible::after {
	transform: scaleX(1);
	opacity: 1;
}

/* --- CTA BUTTONS --- */

.xo-site-header .wp-block-buttons {
	flex-wrap: nowrap;
	justify-content: flex-end;
	margin-block: 0;
}

/* Shared with the footer's FBO Reservations CTA (.xo-site-footer) — see
   footer.css — so both instances of the same primary action stay visually
   identical without a second button design. */
.xo-site-header .wp-block-button__link,
.xo-site-footer .wp-block-button__link {
	min-height: 3.15rem;
	padding: 0.777rem 1.35rem;
	background: var( --color-white );
	border: 1px solid var( --color-light-blue-border );
	color: var(--color-black );
	font-size: 1rem;
	font-weight: 500;
	text-transform: uppercase;
	white-space: nowrap;
	border-radius: 0;
}

html[data-xo-theme="dark"] .xo-site-header .wp-block-button__link,
html[data-xo-theme="dark"] .xo-site-footer .wp-block-button__link { color: var(--color-white); background: var( --color-dark-blue ); border: 1px solid var( --color-dark-blue-border ); }

html[data-xo-theme="light"] .xo-site-header .wp-block-button__link:hover,
html[data-xo-theme="light"] .xo-site-header .wp-block-button__link:active,
html[data-xo-theme="light"] .xo-site-header .wp-block-button__link:focus,
html[data-xo-theme="light"] .xo-site-footer .wp-block-button__link:hover,
html[data-xo-theme="light"] .xo-site-footer .wp-block-button__link:active,
html[data-xo-theme="light"] .xo-site-footer .wp-block-button__link:focus {
	color: var(--color-black);
	background: var( --color-light-blue-hover );
	border: 1px solid var( --color-light-blue-border-hover );
}
html[data-xo-theme="light"] .xo-site-header .wp-block-button__link:focus,
html[data-xo-theme="light"] .xo-site-footer .wp-block-button__link:focus { background: var( --color-light-blue-focus ); }

html[data-xo-theme="dark"] .xo-site-header .wp-block-button__link:hover,
html[data-xo-theme="dark"] .xo-site-header .wp-block-button__link:active,
html[data-xo-theme="dark"] .xo-site-header .wp-block-button__link:focus,
html[data-xo-theme="dark"] .xo-site-footer .wp-block-button__link:hover,
html[data-xo-theme="dark"] .xo-site-footer .wp-block-button__link:active,
html[data-xo-theme="dark"] .xo-site-footer .wp-block-button__link:focus {
	background: var( --color-dark-blue-hover );
	border: 1px solid var( --color-dark-blue-border-hover );
}
html[data-xo-theme="dark"] .xo-site-header .wp-block-button__link:focus,
html[data-xo-theme="dark"] .xo-site-footer .wp-block-button__link:focus { background: var( --color-dark-blue-focus ); }

html[data-xo-theme="dark"] .xo-site-header{ background-color: rgba(0, 0, 0, 0.8); }
html[data-xo-theme="light"] .xo-site-header{ background-color: rgba(255, 255, 255, 0.8); }

.xo-notice__inner{ 
	max-width: var(--xo-layout-xxl);
    margin-inline: auto;
    padding-inline: var(--xo-page-gutter);
}

.xo-site-header .xo-site-header__utility {
	justify-content: flex-end;
}

.xo-site-header .xo-theme-mode-toggle {
	min-width: 2.75rem;
	min-height: 2.75rem;
}

.xo-site-header .xo-theme-mode-toggle__icon {
	width: 1.5rem;
	height: 1.5rem;
}

body.xo-condensed-sticky-header.xo-header-is-stuck .xo-site-header .xo-dna-site-logo__image{ width: 50%; }

@media( min-width: 1100px ){
	.xo-site-header .primary-navigation .wp-block-navigation__container {
		gap: clamp(2rem, 3.5vw, 3.5rem);
	}
}

@media (max-width: 1023px) {
	.xo-site-header .xo-section {
		padding-block: 1rem;
	}

	.xo-site-header__columns {
		flex-wrap: nowrap !important;
		gap: 0;
	}

	.xo-site-header__branding-column {
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: 100%;
	}

	.xo-site-header .site-header__branding .wp-block-xo-dna-site-logo {
		width: min(9.5rem, 46vw);
	}

	.xo-site-header .site-header__mobile-nav {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 0.3rem;
		margin-left: auto;
	}
	
	.xo-site-header .xo-mobile-menu__toggle {
		place-items: center;
		width: 3.25rem;
		min-width: 0;
		height: 2.5rem;
		min-height: 0;
		margin: 0;
		padding: 0;
		background: transparent;
		border: 0;
		color: #8d8d8d;
	}
	.xo-site-header .xo-mobile-menu__toggle .xo-mobile-menu__toggle-label{ display: block; margin-top: -0.25rem; text-transform: uppercase; color: var( --xo-mobile-menu-color ); font-size: .888rem; font-weight: 700; }

	.xo-site-header .xo-mobile-menu__toggle:hover,
	.xo-site-header .xo-mobile-menu__toggle:focus {
		background: transparent;
	}

	.xo-site-header .xo-mobile-menu__icon {
		width: 3.25rem;
		height: 2.5rem;
	}

	.xo-site-header .xo-mobile-menu__icon-lines {
		stroke: var( --xo-mobile-menu-color );
		stroke-width: 2.5;
		stroke-linecap: round;
		transform: scaleX(1.2);
		transform-origin: center;
	}

	.xo-site-header__nav-column,
	.xo-site-header__cta-column,
	.xo-site-header__utility-column {
		display: none !important;
	}
}

/* medium: 48rem / 768px */
@media (min-width: 48rem) {
	.site-surface {
		padding: var(--space-6);
	}
}

/* large: 64rem / 1024px */
@media (min-width: 64rem) {
	.site-surface {
		padding: var(--space-8);
	}
}

/* --- Main Adjustment --- */

.wp-site-blocks > main{ padding: 0 0 3rem 0; }

/* --- H1 --- */

.wp-block-xo-dna-section.xo-section.xo-page-title,
.xo-page-title-container {
	padding: 3rem 0 1.333rem 0;
}
.wp-block-xo-dna-section.xo-section.xo-page-title h1{ margin-block-end: 1rem; }

/* --- Featured Images --- */

.xo-featured-image{ padding: 0 0 2rem 0; container-type: inline-size;}
.xo-featured-image .xo-featured-image__content{
	padding: 2rem 0 0 0;
	width: 100%;
	max-width: var(--xo-layout-xxl);
	margin-inline: auto;
	padding-inline: var(--xo-page-gutter);
 }

.xo-featured-image.homepage-top-rated-fbo{ position: relative; padding: 0 0 0 0; }
.xo-featured-image.homepage-top-rated-fbo .xo-featured-image__content{
	position: absolute;
	top: 0px;
	padding: .888rem 0 0 .666rem;
	width: 100%;
	max-width: 100%;
}
.xo-featured-image.homepage-top-rated-fbo .xo-featured-image__content .xo-featured-image__content-inner{ max-width: 90rem; margin: 0px auto; }
.xo-featured-image.homepage-top-rated-fbo .xo-featured-image__content h1{ 
	color: var( --color-gold ); font-weight: 400; max-width: 66%; text-shadow: 0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.35); 
	font-size: clamp(1.165rem, 4cqw, 4rem);
	line-height: 1.333;
	margin-block-end: 0;
}
.xo-featured-image.homepage-top-rated-fbo .xo-featured-image__description{ font-weight: 500; font-size: clamp(.444rem, 3.77cqw, 4rem ); color: var( --white ); padding: 0 0  0 .125rem; text-shadow: 0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.35); }

@media (min-width: 64rem) {
	.xo-featured-image.homepage-top-rated-fbo .xo-featured-image__description{ margin: -5px 0 0 0; padding: 0 0  0 .666rem; }
}

.home-supporting-tagline-container{ padding: 2rem 0 2rem 0; }
p.home-supporting-tagline{ font-weight: 600; }

@media (min-width: 64rem) {
	p.home-supporting-tagline {
		font-size: 2rem;
	}
}

/* --- Section Backgrounds --- */
html[data-xo-theme="dark"] .xo-section-bg-color-primary{ background-color: var( --color-card-dark-background ); }
html[data-xo-theme="light"] .xo-section-bg-color-primary{ background-color: var( --section-bg-primary-light ); }
.is-hidden,
[hidden] {
	display: none !important;
}

.visually-hidden,
.sr-only {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

.clearfix::after {
	display: table;
	clear: both;
	content: "";
}

.text-center {
	text-align: center;
}

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

.text-right {
	text-align: right;
}

.text-danger,
.has-danger-color {
	color: var(--color-danger);
}

.text-success,
.has-success-color {
	color: var(--color-success);
}

.no-margin {
	margin: 0 !important;
}

.no-padding {
	padding: 0 !important;
}

.underline {
	text-decoration: underline;
}
/**
 * Temporary compatibility rules for legacy Cool Beans markup.
 *
 * New templates and patterns should use the modern layout primitives.
 * Remove selectors from this file as legacy markup is migrated.
 */

.grid-row,
.grid-container {
	width: calc(100% - (2 * var(--content-gutter)));
	max-width: var(--content-width-wide);
	margin-inline: auto;
}

.grid-row {
	display: block;
}

.grid-row .cell,
.grid-container .cell,
.cell {
	min-width: 0;
	border: 0;
}

.grid-row .cell {
	padding-inline: var(--content-gutter);
}

.grid-row .cell.nopad,
.cell.nopad {
	padding-inline: 0;
}

.content-centered {
	width: -moz-fit-content;
	width: fit-content;
	max-width: 100%;
	margin-inline: auto;
}

.content-default {
	margin-block-end: var(--space-8);
}
/**
 * XO Cool Beans front page structure.
 *
 * Component styling will be added in later isolated builds.
 */

#main {
	min-width: 0;
}

#content-home {
	min-width: 0;
}

.homepage-content-top {
	min-width: 0;
}

.homepage-content-top > .wp-block-post-content {
	margin-block: 0;
}
/* ==========================================================================
   Semantic Variables — Light (default)
   ========================================================================== */

:root,
html[data-xo-theme="light"] {
	.xo-card, .xo-weather-block--summary { background-color: var( --color-card-light-background ); border: 1px solid var( --color-card-light-border );}
	.xo-card .xo-card-title, .xo-card .xo-card-label,
	.xo-weather-block--summary .xo-weather-title { color: var( --color-card-light-label ); }
}

/* ==========================================================================
   Semantic Variables — Dark
   ========================================================================== */

html[data-xo-theme="dark"] {
	.xo-card, .xo-weather-block--summary { background-color: var( --color-card-dark-background ); border: 1px solid var( --color-card-dark-border );}
	.xo-card .xo-card-title, .xo-card .xo-card-label,
	.xo-weather-block--summary .xo-weather-title { color: var( --color-card-dark-label ); }
}
/**
 * xo/fuel-prices block styling (xo-fuel-prices plugin).
 *
 * The plugin's own stylesheet only provides a minimal, unstyled black and
 * white fallback. This theme owns the full "cockpit display" look — colors,
 * typography, and layout — and the light/dark sync via [data-xo-theme].
 */

.xo-fuel-prices {
	padding: clamp(1.25rem, 4vw, 2.5rem);
	font-family: var(--font-family-technical, "Arial Narrow", Arial, sans-serif);
}

.xo-fuel-prices__title,
.xo-fuel-prices__fuel,
.xo-fuel-prices__service {
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

.xo-fuel-prices__grid {
	display: grid;
	grid-template-columns: minmax(7rem, 0.8fr) repeat(2, minmax(7rem, 1fr));
	gap: 0.75rem clamp(1rem, 4vw, 2.5rem);
	align-items: baseline;
}

.xo-fuel-prices__fuel {
	text-align: center;
	font-size: clamp(1.15rem, 2.4vw, 1.75rem);
}

.xo-fuel-prices__service {
	font-size: clamp(0.9rem, 1.8vw, 1.2rem);
}

.xo-fuel-prices__price {
	text-align: center;
	font-size: clamp(1.222rem, 3vw, 3rem);
	line-height: 0.95;
	font-weight: 600;
}

.xo-fuel-prices__currency {
	display: inline-block;
	margin-right: 0.08em;
	font-size: 0.55em;
	vertical-align: 0.28em;
}
/**
 * Base Operations homepage dashboard refinement.
 *
 * Styles the existing xo-dna/fuel-prices and xo-dna/weather-summary block output —
 * both already carry the .xo-card treatment defined in tokens.css. No
 * plugin or block markup is modified — this file styles what those blocks
 * already render. Footer styling lives in footer.css.
 */

/* --------------------------------------------------------------
   Homepage dashboard background
   -------------------------------------------------------------- */

/* --------------------------------------------------------------
   Shared card shell — xo-dna/fuel-prices and xo-dna/weather-summary
   -------------------------------------------------------------- */

.xo-card,
.xo-weather-block--summary {
	padding: clamp(1.75rem, 2.5vw, 2.5rem);
}

@media (max-width: 520px) {
	.xo-card,
	.xo-weather-block--summary {
		padding: 1.25rem;
	}
}

/* --------------------------------------------------------------
   Card header icons — reusable for other Base Operations modules.
   The Fuel Prices / Current Conditions icons sit in a circular tint;
   the Forecast icon is a smaller inline mark with no circle.
   -------------------------------------------------------------- */

.xo-card-icon {
	display: inline-flex;
	flex-shrink: 0;
	align-items: center;
	justify-content: center;
	width: 3.25rem;
	height: 3.25rem;
	border-radius: 50%;
	background: var(--color-icon-badge-background);
	color: var(--color-icon-badge-foreground);
}

.xo-card-icon__svg {
	width: 1.6rem;
	height: 1.6rem;
}

.xo-card-icon--inline {
	width: auto;
	height: auto;
	margin-right: 0.5rem;
	border-radius: 0;
	background: none;
	color: currentColor;
	vertical-align: -0.2em;
}

.xo-card-icon--inline .xo-card-icon__svg {
	width: 1.1rem;
	height: 1.1rem;
}

:root,
html[data-xo-theme="light"] {
	--color-icon-badge-background: color-mix(in srgb, var(--color-secondary) 14%, white);
	--color-icon-badge-foreground: var(--color-secondary);
}

html[data-xo-theme="dark"] {
	--color-icon-badge-background: var(--color-secondary);
	--color-icon-badge-foreground: #ffffff;
}

/* Dashboard row: align the two cards side by side at ~45/55. */

body.home .wp-block-columns:has(> .wp-block-column > .xo-fuel-prices) {
	gap: 2rem;
	align-items: flex-start;
}

@media (min-width: 782px) {
	body.home .wp-block-column:has(> .xo-fuel-prices) {
		flex: 1 1 45%;
	}

	body.home .wp-block-column:has(> .xo-weather-block--summary) {
		flex: 1 1 55%;
	}
}

/* --------------------------------------------------------------
   Fuel Prices card
   -------------------------------------------------------------- */

.xo-fuel-prices__header {
	display: flex;
	align-items: center;
	gap: 1rem;
	margin-bottom: 1.25rem;
}

.xo-fuel-prices__heading {
	min-width: 0;
}

.xo-fuel-prices__header .xo-fuel-prices__title {
	margin: 0;
}

.xo-fuel-prices__subtitle {
	margin: 0.15rem 0 0;
	color: var(--color-text-muted);
	font-size: 0.85rem;
}

.xo-fuel-prices__grid {
	position: relative;
	row-gap: 1.25rem;
	-moz-column-gap: clamp(1.5rem, 5vw, 3rem);
	     column-gap: clamp(1.5rem, 5vw, 3rem);
}

/* Fuel type headers ("100LL" / "Jet A"). Qualified with
   "section.xo-card.xo-fuel-prices" to out-specify cards.css's
   ".xo-card .xo-card-label" rule, which — via native CSS nesting under
   "html[data-xo-theme]" — resolves to a higher specificity than a plain
   two-class selector would suggest. */
section.xo-card.xo-fuel-prices .xo-fuel-prices__grid .xo-fuel-prices__fuel {
	color: var(--color-secondary);
	font-weight: var(--font-weight-bold);
	font-size: 0.95rem;
	text-align: center;
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

section.xo-card.xo-fuel-prices .xo-fuel-prices__grid .xo-fuel-prices__service {
	color: var(--color-text-muted);
	font-size: 0.8rem;
	font-weight: var(--font-weight-bold);
}

.xo-fuel-prices__price {
	font-size: clamp(1.5rem, 3vw, 2rem);
	font-weight: var(--font-weight-black);
}

.xo-fuel-prices__price--unavailable {
	color: var(--color-text-muted);
	font-size: 1.25rem;
	font-weight: var(--font-weight-regular);
}

/* The 100LL/Jet A columns get too narrow to read side by side in two
   ranges: below 520px, where the card itself is small, and again from
   782px (where the dashboard row above puts this card at ~45% width
   alongside the weather card) up to 1121px, where that 45% share is
   still too narrow for the card's own 3-column grid. Both ranges get the
   same fix: the grid is transposed, fuel type becomes the row (left-hand
   label) and Full Service / Self-Serve become the column headers. The
   grid stays 3 columns × 3 rows either way — only what occupies each
   line changes — so the separator pseudo-elements below need no
   breakpoint-specific adjustment. Cells are placed by nth-child because
   the plugin markup gives every fuel-header and every price cell the
   same class regardless of which fuel or service it belongs to; position
   in render.php's fixed output order is the only thing that
   distinguishes them. */
@media (max-width: 520px), (min-width: 782px) and (max-width: 1121px) {
	.xo-fuel-prices__grid {
		grid-template-columns: minmax(4.5rem, auto) repeat(2, 1fr);
	}

	.xo-fuel-prices__corner {
		display: none;
	}

	/* 100LL / Jet A headers become left-aligned row labels in column 1. */
	section.xo-card.xo-fuel-prices .xo-fuel-prices__grid .xo-fuel-prices__fuel {
		text-align: left;
	}

	.xo-fuel-prices__grid > :nth-child(2) {
		grid-row: 2;
		grid-column: 1;
	}

	.xo-fuel-prices__grid > :nth-child(3) {
		grid-row: 3;
		grid-column: 1;
	}

	/* Full Service / Self-Serve labels become centered column headers in row 1. */
	section.xo-card.xo-fuel-prices .xo-fuel-prices__grid .xo-fuel-prices__service {
		text-align: center;
	}

	.xo-fuel-prices__grid > :nth-child(4) {
		grid-row: 1;
		grid-column: 2;
	}

	.xo-fuel-prices__grid > :nth-child(7) {
		grid-row: 1;
		grid-column: 3;
	}

	.xo-fuel-prices__grid > :nth-child(5) {
		grid-row: 2;
		grid-column: 2;
	}

	.xo-fuel-prices__grid > :nth-child(6) {
		grid-row: 3;
		grid-column: 2;
	}

	.xo-fuel-prices__grid > :nth-child(8) {
		grid-row: 2;
		grid-column: 3;
	}

	.xo-fuel-prices__grid > :nth-child(9) {
		grid-row: 3;
		grid-column: 3;
	}
}

/* One continuous separator between grid columns 2 and 3, and one between
   grid rows 2 and 3 — single pseudo-elements placed on the grid rather
   than borders on individual cells, so neither line is broken by the grid
   gap and neither heading sits flush against it. Above 520px that's a
   vertical line between the 100LL/Jet A columns and a horizontal line
   between the Full Service/Self-Serve rows; below 520px the grid is
   transposed (see the fuel/service placement rules above) so the same
   two lines fall between the Full Service/Self-Serve columns and the
   100LL/Jet A rows instead — the grid stays 3×3 either way, so these
   rules need no breakpoint-specific adjustment. Absolutely positioned so
   they size against their named grid lines without reserving those
   cells from the real content's auto-placement. */
.xo-fuel-prices__grid::before {
	content: "";
	position: absolute;
	inset: 0;
	grid-column: 2 / 4;
	/* Explicit "1 / 4" rather than "1 / -1": grid-template-rows is not set
	   (only columns are templated, by the plugin's own CSS), so the grid
	   has no explicit row tracks for "-1" to resolve against — it would
	   collapse to a zero-height span instead of covering the 3 auto rows. */
	grid-row: 1 / 4;
	width: 1px;
	margin-inline: auto;
	background: var(--color-border);
}

.xo-fuel-prices__grid::after {
	content: "";
	position: absolute;
	inset: 0;
	grid-column: 1 / -1;
	grid-row: 2 / 4;
	height: 1px;
	margin-block: auto;
	background: var(--color-border);
}

/* Card footer — a full-bleed band matching the fuel icon's tint, holding
   the AV Fuel badge (inserted by xo_base_operations_fuel_prices_icon() in
   functions.php) beside the block's own editable footer HTML. The
   negative inline/bottom margins cancel .xo-card's own padding so the
   band reaches the card's edges; horizontal padding re-adds it so the
   content lines back up with the header/body above. Reusable by any
   other Base Operations card that adopts .xo-card-footer. */
.xo-card-footer {
	display: flex;
	align-items: center;
	gap: 1rem;
	margin: 1.25rem calc(-1 * clamp(1.75rem, 2.5vw, 2.5rem)) calc(-1 * clamp(1.75rem, 2.5vw, 2.5rem));
	padding: 1.25rem clamp(1.75rem, 2.5vw, 2.5rem);
}

.xo-card-footer:empty {
	display: none;
}

@media (max-width: 520px) {
	.xo-card-footer {
		margin: 1.25rem -1.25rem -1.25rem;
		padding: 1.25rem;
	}
}

.xo-fuel-prices__badge {
	flex-shrink: 0;
}

.xo-fuel-prices__badge .xo-badge {
	display: block;
	width: 3rem;
}

/* The badge's SVG artwork (uploaded per-badge in xo-badges) carries no
   fill of its own, so it defaults to black — force it to the same
   foreground token as the fuel icon and card footer above. */
.xo-fuel-prices__badge .xo-badge svg path {
	fill: currentColor;
}

.xo-fuel-prices__footer-text .fuel-footer-top {
	font-weight: var(--font-weight-bold);
	font-size: 1.05rem;
	text-transform: uppercase;
	letter-spacing: 0.03em;
}

.xo-fuel-prices__footer-text .fuel-footer-bottom {
	margin-top: 0.2rem;
	font-size: 0.85rem;
	line-height: 1.4;
}

.xo-fuel-prices__footer-text .fuel-rates-contact {
	color: inherit;
	font-weight: var(--font-weight-bold);
	text-decoration: none;
}

.xo-fuel-prices__footer-text .fuel-rates-contact:hover {
	text-decoration: underline;
}

/* --------------------------------------------------------------
   Weather summary card
   -------------------------------------------------------------- */

.xo-weather-block--summary {
	display: grid;
	grid-template-columns: 1fr auto;
	-moz-column-gap: 1rem;
	     column-gap: 1rem;
}

/* .xo-weather-block__header (icon + <h2>) replaces the bare <h2> as the
   grid-row-1/column-1 item — see xo_base_operations_weather_summary_icon(). */
.xo-weather-block--summary .xo-weather-block__header {
	display: flex;
	align-items: center;
	gap: 1rem;
	grid-column: 1;
	grid-row: 1;
	min-width: 0;
}

.xo-weather-block--summary .xo-weather-title {
	margin-bottom: 0;
	font-size: 1rem;
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

.xo-weather-block--summary .xo-weather-flight-category {
	grid-column: 2;
	grid-row: 1;
	align-self: center;
	justify-self: end;
	margin: 0;
}

.xo-weather-block--summary .xo-weather-kicker,
.xo-weather-block--summary .xo-weather-grid,
.xo-weather-block--summary .xo-weather-section,
.xo-weather-block--summary > p:last-child {
	grid-column: 1 / -1;
}

.xo-weather-block--summary .xo-weather-kicker {
	margin-top: 0.35rem;
	color: var(--color-text-muted);
	font-weight: var(--font-weight-regular);
	font-size: 0.9rem;
}

/* Station identifier ("KFMY") reads slightly stronger than the full
   airport name that follows it — see
   xo_base_operations_weather_summary_icon() in functions.php, which
   splits the plugin's single kicker string into these two spans. */
.xo-weather-block--summary .xo-weather-kicker__station {
	color: var(--color-text);
	font-weight: var(--font-weight-bold);
}

/* icon | label | value — see xo_base_operations_add_weather_row_icons()
   in functions.php, which wraps each row's icon and label text in their
   own spans and marks the <dt> as the icon/text pair below so those two
   spans (rather than the <dt> itself) become the grid's real columns 1–2. */
.xo-weather-block--summary .xo-weather-grid {
	grid-template-columns: 1.25rem minmax(7rem, 9.5rem) 1fr;
	align-items: center;
	-moz-column-gap: 0.75rem;
	     column-gap: 0.75rem;
	row-gap: 0.5rem;
	margin-bottom: 0;
}

.xo-weather-block--summary .xo-weather-label {
	display: contents;
}

.xo-weather-block--summary .xo-weather-label__text {
	font-weight: var(--font-weight-regular);
	color: var(--color-text-muted);
}

.xo-weather-block--summary .xo-card-icon--row {
	width: 1.25rem;
	height: 1.25rem;
	border-radius: 0;
	background: none;
	color: var(--color-secondary);
}

.xo-weather-block--summary .xo-card-icon--row .xo-card-icon__svg {
	width: 1.1rem;
	height: 1.1rem;
}

.xo-weather-block--summary .xo-weather-value {
	font-weight: var(--font-weight-medium);
}

.xo-weather-block--summary .xo-weather-section {
	margin-top: 1.25rem;
	padding-top: 1.25rem;
	border-top: 1px solid var(--color-border);
}

/* The link is the last thing in the card — no trailing space needed
   beneath it beyond the card's own padding. */
.xo-weather-block--summary > p:last-child {
	margin-bottom: 0;
}

.xo-weather-block--summary .xo-weather-section-title {
	margin-bottom: 0.6rem;
	font-family: var(--font-family-display);
	font-size: 0.85rem;
	font-weight: var(--font-weight-bold);
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

.xo-weather-block--summary .xo-weather-link {
	font-weight: var(--font-weight-bold);
	text-decoration: none;
}

.xo-weather-block--summary .xo-weather-link:hover {
	text-decoration: underline;
}

.xo-weather-block--summary .xo-weather-link::after {
	content: "\2192";
	display: inline-block;
	margin-left: 0.35em;
}

/* Flight category badge: uniform outline in the category color.
   Scoped under .xo-weather-block so it wins over the plugin's own
   .xo-weather-flight-category rules regardless of stylesheet order. */
.xo-weather-block .xo-weather-flight-category {
	--flight-category-color: currentColor;
	border-width: 1px;
	border-radius: 0.35rem;
	color: var(--flight-category-color);
	border-color: var(--flight-category-color);
	font-size: 0.8rem;
}

.xo-weather-block .xo-weather-flight-category--vfr {
	--flight-category-color: #1a7f37;
}

.xo-weather-block .xo-weather-flight-category--mvfr {
	--flight-category-color: #0969da;
}

.xo-weather-block .xo-weather-flight-category--ifr {
	--flight-category-color: var(--color-danger);
}

.xo-weather-block .xo-weather-flight-category--lifr {
	--flight-category-color: #8250df;
}
/**
 * Base Operations site footer.
 *
 * Styles the existing xo-dna contact/address/hours/logo/copyright blocks,
 * the xo-dna/footer-fuel-prices and footer-weather widgets
 * (see functions.php), and the footer's FBO Reservations CTA (which shares
 * the header's button rules — see layout.css). No plugin or block markup
 * is modified; this file styles what those blocks already render.
 */

/* --------------------------------------------------------------
   Overall footer spacing
   -------------------------------------------------------------- */

.xo-site-footer {
	font-family: var( --font-family-technical );
}

.xo-site-footer a {
	text-decoration: none;
	color: var( --color-footer-text );
}

.xo-site-footer a:hover {
	text-decoration: underline;
}

/* --------------------------------------------------------------
   Column grid
   -------------------------------------------------------------- */

.xo-site-footer__columns {
	gap: clamp(2.5rem, 5vw, 4rem);
	margin-bottom: 0;
}

.xo-site-footer__col {
	min-width: 0;
}

@media (min-width: 782px) {
	.xo-site-footer__columns {
		flex-wrap: wrap;
	}

	.xo-site-footer__col {
		flex: 1 1 calc(50% - 2rem);
	}
}

@media (min-width: 1024px) {
	.xo-site-footer__columns {
		flex-wrap: nowrap;
	}

	.xo-site-footer__col {
		flex: 1 1 0;
	}
}

/* --------------------------------------------------------------
   Shared label style — "Contact", "Fuel Prices", "Current Weather",
   "Navigation".
   -------------------------------------------------------------- */

/* --------------------------------------------------------------
   Identity column — logo, contact, hours
   -------------------------------------------------------------- */

.xo-site-footer__col--identity{ font-size: .888rem; }
.xo-site-footer__logo {
	display: block;
	margin-bottom: var(--footer-contact-margin-bottoms);
}

.xo-site-footer .xo-site-footer__logo.wp-block-xo-dna-site-logo{
	width: min(9.5rem, 50%);
}

.xo-site-footer .wp-block-xo-dna-physical-address,
.xo-site-footer .wp-block-xo-dna-contact-info {
	line-height: var(--line-height-loose);
}

.xo-site-footer__logo,
.xo-site-footer .wp-block-xo-dna-physical-address,
.xo-site-footer .wp-block-xo-dna-contact-info{
	margin-bottom: var(--footer-contact-margin-bottoms);
}

.xo-site-footer .wp-block-xo-dna-contact-info .xo-contact-info__main-phone, 
.xo-site-footer .wp-block-xo-dna-contact-info .xo-contact-info__secondary-phone{ margin: 0 0 .333rem 0; }

/* --------------------------------------------------------------
   Fuel Prices widget
   -------------------------------------------------------------- */

.xo-footer-fuel .xo-footer-fuel-top-inner{ display: flex; padding: 0 1rem 0 2rem; }
.xo-footer-fuel .xo-footer-fuel-top-inner .av-fuel-logo{ flex: 0 0 22%; }
.xo-footer-fuel .xo-footer-fuel-top .xo-footer-fuel-title{ text-align: center; width: 100%; }
.xo-footer-fuel .xo-footer-fuel-top-inner .xo-footer-fuel-title h3{ color: var(--color-footer-text); font-weight: var(--font-weight-bold ); font-family: var( --font-family-technical ); text-transform: uppercase; margin: 0px; padding: 3px; }
.xo-footer-fuel .xo-footer-fuel-top-inner .xo-footer-fuel-updated{ font-size: .777rem; margin: .333rem 0 0 0; text-transform: uppercase; font-weight: var( --font-weight-normal ); }
html[data-xo-theme="dark"] .xo-footer-fuel .xo-footer-fuel-top .xo-footer-fuel-updated{ color: var( --white ); }
html[data-xo-theme="light"] .xo-footer-fuel .xo-footer-fuel-top .xo-footer-fuel-updated{ color: var( --black ); }

.xo-footer-fuel th, .xo-footer-fuel td{ text-align: center; }
.xo-footer-fuel th{ font-weight: var( --font-weight-normal ); font-size: var(--footer-font-size-small); text-transform: uppercase; }
.xo-footer-fuel tbody th, .xo-footer-fuel tbody td{ font-weight: var( --font-weight-bold ); font-size: 1.222rem; }
html[data-xo-theme="dark"]  .xo-footer-fuel tbody td{ color: var( --white ); }
html[data-xo-theme="light"]  .xo-footer-fuel tbody td{ color: var( --black ); }

.xo-footer-fuel .xo-fuel-footer-footer{ text-align: center; margin: 1rem 0 0 0; font-size: .888rem; line-height: 1; }

/* --------------------------------------------------------------
   Current Weather widget
   -------------------------------------------------------------- */

.xo-footer-weather__row {
	display: flex;
	align-items: center;
	gap: 0.6rem;
}

.xo-footer-weather__icon {
	width: 2rem;
	height: 2rem;
	flex-shrink: 0;
}

.xo-footer-weather__temp {
	font-size: 1.35rem;
	font-weight: var(--font-weight-bold);
}

.xo-footer-weather__condition {
	margin: 0.5rem 0 0;
}

/* --------------------------------------------------------------
   Lightning status toggle
   -------------------------------------------------------------- */

.xo-lightning-status__toggle {
	display: block;
	margin: 1rem auto;
	padding: 0.5rem 1rem;
	font-size: var(--footer-font-size-small);
	background: var(--color-footer-text );
	color: var(--color-footer-background);
	border: none;
	cursor: pointer;
}
.xo-lightning-status__toggle[aria-expanded="true"] {
	background: var(--color-footer-text);
	color: var(--color-footer-background);
}

html[data-xo-theme="dark"] .xo-site-footer .xo-lightning-status__toggle{ color: var(--color-white); background: var( --color-dark-blue ); }

.xo-earthworks-widget__frame {
	height: 105px;
	overflow: hidden;
	transition: height 250ms ease;
}

.xo-lightning-status.is-expanded .xo-earthworks-widget__frame {
	height: 105px;
}
.xo-earthworks-widget__frame--expanded {
	height: 350px;
}

/* --------------------------------------------------------------
   Actions column — FBO Reservations CTA + footer navigation
   -------------------------------------------------------------- */

.xo-site-footer__col--actions {
	display: flex;
	flex-direction: column;
}

.xo-site-footer__cta {
	margin: 0 0 2rem;
}

.xo-site-footer__col--actions .xo-site-footer__eyebrow {
	margin-bottom: 0.75rem;
}

.xo-site-footer__navigation .wp-block-navigation__container {
	gap: 0.65rem;
}

.xo-site-footer__navigation .wp-block-navigation-item__content {
	padding: 0;
	font-family: var(--font-family-display);
	font-size: var( --footer-font-size-small );
	text-transform: uppercase;
	letter-spacing: 0.03em;
}

/* --------------------------------------------------------------
   Footer navigation list
   -------------------------------------------------------------- */
.footer-nav__list {
	list-style-type: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}
.footer-nav__list li{ margin-bottom: var( --footer-nav-links-margin-bottoms); }

.xo-site-footer .wp-block-button__link {
	width: 100%;
	background: transparent;
}

html[data-xo-theme="dark"] .xo-site-footer .wp-block-button__link,
html[data-xo-theme="light"] .xo-site-footer .wp-block-button__link{ background: transparent; color: var( --color-footer-text );  }

html[data-xo-theme="dark"] .xo-site-footer .wp-block-button__link.button-fbo-reservations { color: var(--color-white); background: var( --color-dark-blue ); border: 1px solid var( --color-dark-blue-border ); }
html[data-xo-theme="dark"] .xo-site-footer .wp-block-button__link.button-fbo-reservations:hover,
html[data-xo-theme="dark"] .xo-site-footer .wp-block-button__link.button-fbo-reservations:active,
html[data-xo-theme="dark"] .xo-site-footer .wp-block-button__link.button-fbo-reservations:focus {
	background: var( --color-dark-blue-hover );
	border: 1px solid var( --color-dark-blue-border-hover );
}
.xo-site-footer .wp-block-button__link:hover{ text-decoration: none; }

/* --------------------------------------------------------------
   Weather mini
   -------------------------------------------------------------- */
a.xo-weather-mini:hover{ text-decoration: none; }
.xo-weather-mini{ display: table; margin: 0 auto 1rem auto;}
.xo-weather-mini h2{ color: var( --color-footer-text ); margin: 0 0 .333rem 0; }
.xo-weather-mini__conditions{ margin: 0px auto; font-size: var( --footer-font-size-small ); }

/* --------------------------------------------------------------
   Legal row
   -------------------------------------------------------------- */

.xo-site-footer__legal {
	margin-top: clamp(1rem, 5vw, 2rem);
	padding-top: 1rem;
	font-size: var( --footer-font-size-small );
	text-align: center;
}
.xo-site-footer__legal a{ display: block; margin: .65rem; }

.xo-site-footer__legal .copyright{
	margin: 0 0 1rem 0;
	display: block;
	text-align: center;
}
.xo-site-footer__legal .copyright .copyright-part {
	display: block;
	text-align: center;
}

.ada-accessibility .ada{ display: inline-block; background-color: var( --color-footer-text ); color: var( --color-footer-background ); padding: 0 0.222rem; border-radius: 0.333rem; margin: 0 2px 0 0; text-transform: uppercase; font-weight: var( --font-weight-bold ); }

/* --------------------------------------------------------------
   Footer Breakpoints
   -------------------------------------------------------------- */

@media (min-width: 48rem) {
	.xo-site-footer__legal .copyright{ margin: 0 0 0 0; display: inline-block; }
	.xo-site-footer__legal .copyright .copyright-part {
		display: inline-block;
	}
	.xo-site-footer__legal a{ display: inline-block; margin: 0 0.5rem 0 .5rem; }
}


@media (max-width: 64rem) {
	body .wp-block-columns.xo-site-footer__columns {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 3rem 2rem;
	}

	body .wp-block-columns.xo-site-footer__columns > .wp-block-column {
		width: auto;
		flex: none;
		margin: 0;
	}
	.ada-accessibility .ada{ margin: 0 2px 0 1rem; }
	.xo-site-footer__legal a{ display: block; margin: .65rem; }
}

@media (max-width: 48rem) {
	body .wp-block-columns.xo-site-footer__columns {
		grid-template-columns: 1fr;
	}
}
/*# sourceMappingURL=main.css.map */