/*
Theme Name: fsociety
Theme URI: https://wpastra.com/
Template: astra
Author: fsociety
Author URI:
Description: Child theme of Astra, named fsociety.
Version: 1.1.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: fsociety
*/

/* =========================================================================
   fsociety brand system
   Elegant, professional corporate security design — white / light-gray
   backgrounds with a navy accent, built on top of Astra's global color
   palette (--ast-global-color-0..8), repointed via astra-settings.
   Palette is a neutral placeholder until final brand colors are supplied —
   swap the 9 hex values in astra-settings and everything below follows.
   ========================================================================= */

:root {
	--fs-radius: 14px;
	--fs-radius-sm: 8px;
	--fs-border: var( --ast-global-color-6, #e1e5ea );
	--fs-surface: var( --ast-global-color-8, #ffffff );
	--fs-bg-alt: var( --ast-global-color-4, #f4f6f8 );
	--fs-bg: var( --ast-global-color-5, #ffffff );
	--fs-accent: var( --ast-global-color-0, #1b4b73 );
	--fs-accent-2: var( --ast-global-color-1, #2e6da4 );
	--fs-heading: var( --ast-global-color-2, #16202c );
	--fs-muted: var( --ast-global-color-3, #5b6672 );
	--fs-shadow: 0 4px 16px rgba( 22, 32, 44, 0.06 );
	--fs-shadow-hover: 0 16px 40px rgba( 22, 32, 44, 0.1 );
	--fs-ease: cubic-bezier( 0.22, 1, 0.36, 1 );
}

html {
	scroll-behavior: smooth;
}

body {
	overflow-x: hidden;
}

::selection {
	background: var( --fs-accent );
	color: #fff;
}

/* Focus visibility (accessibility) */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
.wp-block-button__link:focus-visible {
	outline: 2px solid var( --fs-accent );
	outline-offset: 3px;
	border-radius: 4px;
}

/* Scrollbar (webkit) */
::-webkit-scrollbar {
	width: 10px;
	height: 10px;
}
::-webkit-scrollbar-track {
	background: var( --fs-bg-alt );
}
::-webkit-scrollbar-thumb {
	background: var( --fs-border );
	border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover {
	background: var( --fs-accent );
}

/* -------------------------------------------------------------------------
   Site branding / wordmark
   No approved logo artwork on file yet (the previous "logo" image was
   leftover demo-template art, not an fsociety mark) — this text wordmark
   is the primary logo until real vector artwork is supplied.
   ------------------------------------------------------------------------- */
.site-title {
	display: block !important;
	font-family: 'Space Grotesk', sans-serif !important;
	font-weight: 700 !important;
	font-size: 1.5rem !important;
	letter-spacing: -0.01em;
}
.site-title a {
	color: var( --fs-heading );
}

/* -------------------------------------------------------------------------
   Header / navigation
   Logo far left, primary menu centered, "Kontaktujte nás" far right
   (layout controlled by Astra header builder — see astra-settings
   header-desktop-items / header-mobile-items).
   ------------------------------------------------------------------------- */
.main-header-bar {
	background: #fff;
	border-bottom: 1px solid var( --fs-border );
	transition: box-shadow 0.3s var( --fs-ease );
}
/* Astra's "Full Width" header option only stretches the bar's background —
   the logo/menu/button row still sits in a centered .ast-container capped
   at the site content width (1200px), leaving large empty margins on wide
   screens. Let the row itself use the full bar width so the logo and the
   "Kontaktujte nás" button sit right at the edges (with a small breathing
   margin), independent of that setting. */
.ast-primary-header-bar .site-primary-header-wrap.ast-container {
	max-width: none !important;
	padding-left: 2.5em !important;
	padding-right: 2.5em !important;
}
.ast-header-break-point.fs-is-scrolled .main-header-bar,
body.fs-is-scrolled .main-header-bar {
	box-shadow: 0 4px 20px rgba( 22, 32, 44, 0.08 );
}

.main-header-menu .menu-item > .menu-link {
	position: relative;
	font-weight: 500;
	color: var( --fs-heading );
}
.main-header-menu .menu-item > .menu-link::after {
	content: '';
	position: absolute;
	left: 0;
	right: 100%;
	bottom: 2px;
	height: 2px;
	background: var( --fs-accent );
	transition: right 0.25s var( --fs-ease );
}
.main-header-menu .menu-item:hover > .menu-link::after,
.main-header-menu .current-menu-item > .menu-link::after,
.main-header-menu .current-menu-ancestor > .menu-link::after {
	right: 0;
}

/* Dropdown submenu (Služby) */
.main-header-menu .sub-menu {
	background: #fff !important;
	border: 1px solid var( --fs-border );
	border-radius: var( --fs-radius-sm );
	box-shadow: var( --fs-shadow-hover );
	padding: 8px;
	overflow: hidden;
}
.main-header-menu .sub-menu .menu-item > .menu-link {
	border-radius: 6px;
	padding: 10px 14px !important;
	color: var( --fs-heading );
}
.main-header-menu .sub-menu .menu-item > .menu-link:hover {
	background: var( --fs-bg-alt );
}
.main-header-menu .sub-menu .menu-item > .menu-link::after {
	display: none;
}

/* Mobile off-canvas accordion: Astra's own dynamic CSS gives the expanded
   .sub-menu a fixed height/max-height that doesn't match its actual content
   height at this breakpoint, so items overflow past the box and end up
   spaced apart with large gaps instead of stacking tightly (confirmed via
   headless-browser inspection of the live layout). Force a plain,
   auto-height block list, keyed off Astra's own '.ast-submenu-expanded'
   toggle class, so items always stack with no gap regardless of what
   height value core Astra computed. */
#ast-mobile-site-navigation .sub-menu {
	position: static !important;
	inset: auto !important;
	top: auto !important;
	left: auto !important;
	transform: none !important;
	opacity: 1 !important;
	width: 100% !important;
	max-width: 100% !important;
	height: auto !important;
	max-height: none !important;
	min-height: 0 !important;
	overflow: visible !important;
	box-shadow: none !important;
	background: transparent !important;
	border: none !important;
	border-left: 2px solid var( --fs-border );
	border-radius: 0 !important;
	padding: 0.2em 0 0.2em 0.9em !important;
	margin: 0.3em 0 0.5em !important;
	display: none !important;
}
#ast-mobile-site-navigation .menu-item.ast-submenu-expanded > .sub-menu {
	display: block !important;
}
#ast-mobile-site-navigation .sub-menu .menu-item {
	display: block !important;
	height: auto !important;
	min-height: 0 !important;
	max-height: none !important;
}
#ast-mobile-site-navigation .sub-menu .menu-link {
	display: flex !important;
	align-items: center;
	height: auto !important;
	min-height: 0 !important;
	padding: 0.65em 0 !important;
}
/* The expanded parent <li> itself also carries a stale fixed height from
   Astra's accordion transition, shorter than its actual expanded content —
   letting the submenu overflow past it and overlap the next top-level item
   ("O firme"/"Kontakt" ending up visually inside "Služby"'s submenu). Force
   it to size to its real content too. */
#ast-mobile-site-navigation .main-header-menu > .menu-item {
	height: auto !important;
	max-height: none !important;
	min-height: 0 !important;
}
/* Root cause of the above: Astra's core CSS gives the top-level
   ".menu-link" `height: 100%` for the desktop horizontal bar (so links
   fill the header's line-height). Inside the mobile off-canvas accordion
   the <li> is a column flexbox with an indeterminate (auto) height, so that
   100% resolves to a large bogus value (confirmed ~289px for a one-line
   label) and pushes the whole expanded submenu down by the difference. */
#ast-mobile-site-navigation .main-header-menu > .menu-item > .menu-link {
	height: auto !important;
}

/* Header CTA button ("Kontaktujte nás") */
.ast-header-button-1 .ast-custom-button {
	font-weight: 600;
	transition: transform 0.25s var( --fs-ease ), box-shadow 0.25s var( --fs-ease );
}
.ast-header-button-1 .ast-custom-button-link:hover .ast-custom-button {
	transform: translateY( -1px );
	box-shadow: 0 8px 18px rgba( 27, 75, 115, 0.22 );
}

/* -------------------------------------------------------------------------
   Page title strip (Astra entry-title, used on every inner page as its H1)
   ------------------------------------------------------------------------- */
.entry-header:not( .ast-header-without-markup ) {
	position: relative;
	width: 100vw;
	left: 50%;
	transform: translateX( -50% );
	margin-top: -1px !important;
	padding: clamp( 2em, 4vw, 2.75em ) 1.5em clamp( 1.5em, 3vw, 2em );
	border-bottom: 1px solid var( --fs-border );
	margin-bottom: 3em;
	background: linear-gradient( 180deg, #fff 0%, var( --fs-bg-alt ) 100% );
}
.entry-header.ast-header-without-markup {
	display: none;
}
.entry-header .ast-breadcrumbs {
	max-width: 880px;
	margin: 0 auto 0.9em;
}
.entry-title {
	position: relative;
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700;
	font-size: clamp( 1.9rem, 4vw, 2.6rem );
	line-height: 1.15;
	letter-spacing: -0.02em;
	color: var( --fs-heading );
	max-width: 880px;
	margin-left: auto;
	margin-right: auto;
	padding-top: 0.6em;
}
.entry-title::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 48px;
	height: 3px;
	background: var( --fs-accent );
	border-radius: 3px;
}

/* -------------------------------------------------------------------------
   Reading column
   ------------------------------------------------------------------------- */
.entry-content {
	max-width: 880px !important;
	margin-left: auto !important;
	margin-right: auto !important;
}
.entry-content .fs-hero,
.entry-content .fs-full,
.entry-content .fs-marquee,
.entry-content .fs-section,
.entry-content .fs-cta-box {
	max-width: none !important;
}

.entry-content :where( h2, h3, h4 ) {
	font-family: 'Space Grotesk', sans-serif;
	letter-spacing: -0.01em;
	color: var( --fs-heading );
}
.entry-content h2.wp-block-heading {
	position: relative;
	padding-top: 0.4em;
	margin-top: clamp( 2.6em, 5vw, 3.6em );
	margin-bottom: 0.6em;
	font-size: clamp( 1.35rem, 2.4vw, 1.875rem );
	line-height: 1.25;
}
.entry-content > .wp-block-heading:first-child,
.entry-content > .fs-hero + .wp-block-heading,
.entry-content > .fs-marquee + .wp-block-heading {
	margin-top: 0;
}
.entry-content h2.wp-block-heading::before {
	content: '';
	display: block;
	width: 48px;
	height: 3px;
	background: var( --fs-accent );
	border-radius: 3px;
	margin-bottom: 0.7em;
}
.entry-content h3.wp-block-heading {
	color: var( --fs-accent );
	margin-top: 1.6em;
}
.entry-content h4.wp-block-heading {
	color: var( --fs-heading );
	margin-bottom: 0.35em;
}
.entry-content > p:first-of-type,
.entry-content h2.wp-block-heading + p {
	margin-top: 0;
}

/* Small uppercase eyebrow label, used above select H2 sections */
.fs-tag {
	display: inline-flex;
	align-items: center;
	gap: 0.55em;
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	font-size: 0.72rem;
	color: var( --fs-accent );
	margin-bottom: 0.9em;
}
.fs-tag::before {
	content: '';
	width: 18px;
	height: 2px;
	background: var( --fs-accent );
}

/* Services overview — link-card grid instead of a plain bullet list */
.fs-link-grid {
	display: grid;
	grid-template-columns: repeat( 2, 1fr );
	gap: 0.85em;
	list-style: none;
	padding: 0;
	margin: 1.6em 0 0;
}
.entry-content .fs-link-grid > li {
	display: flex;
	padding-left: 0;
	margin-bottom: 0;
}
.entry-content .fs-link-grid > li::before {
	display: none;
}
.fs-link-grid a {
	display: flex;
	width: 100%;
	align-items: center;
	justify-content: space-between;
	gap: 1em;
	padding: 1em 1.3em;
	background: var( --fs-surface );
	border: 1px solid var( --fs-border );
	border-radius: var( --fs-radius-sm );
	color: var( --fs-heading );
	font-weight: 500;
	text-decoration: none;
	background-image: none;
	transition: border-color 0.3s var( --fs-ease ), transform 0.3s var( --fs-ease ), box-shadow 0.3s var( --fs-ease );
}
.fs-link-grid a::after {
	content: '\2192';
	flex-shrink: 0;
	color: var( --fs-accent );
	transition: transform 0.3s var( --fs-ease );
}
.fs-link-grid a:hover {
	border-color: var( --fs-accent );
	box-shadow: var( --fs-shadow );
	transform: translateX( 4px );
}
.fs-link-grid a:hover::after {
	transform: translateX( 4px );
}

/* Differentiators — checklist grid instead of a plain bullet list */
.fs-check-grid {
	display: grid;
	grid-template-columns: repeat( 2, 1fr );
	gap: 0.9em 1.8em;
	list-style: none;
	padding: 0;
	margin: 1.6em 0 0;
}
.entry-content .fs-check-grid > li {
	display: flex;
	align-items: flex-start;
	gap: 0.75em;
	padding: 0.85em 1.1em;
	margin-bottom: 0;
	background: var( --fs-surface );
	border: 1px solid var( --fs-border );
	border-radius: var( --fs-radius-sm );
	color: var( --fs-muted );
	transition: border-color 0.3s var( --fs-ease ), box-shadow 0.3s var( --fs-ease );
}
.entry-content .fs-check-grid > li:hover {
	border-color: var( --fs-accent );
	box-shadow: var( --fs-shadow );
}
.entry-content .fs-check-grid > li::before {
	content: '\2713';
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 1.5em;
	height: 1.5em;
	margin-top: 0.1em;
	border-radius: 7px;
	background: var( --fs-bg-alt );
	border: 1px solid var( --fs-border );
	color: var( --fs-accent );
	font-size: 0.8em;
	font-weight: 700;
	position: static;
	transform: none;
}

@media ( max-width: 640px ) {
	.fs-link-grid,
	.fs-check-grid {
		grid-template-columns: 1fr;
	}
}

.entry-content p,
.entry-content li {
	color: var( --fs-muted );
}
.entry-content strong {
	color: var( --fs-heading );
}
.entry-content em {
	color: var( --fs-heading );
	font-size: 1.08em;
	font-style: italic;
}

.entry-content a:not(.wp-block-button__link) {
	color: var( --fs-accent );
	text-decoration: none;
	background-image: linear-gradient( var( --fs-accent ), var( --fs-accent ) );
	background-position: 0 100%;
	background-repeat: no-repeat;
	background-size: 0% 1px;
	transition: background-size 0.25s var( --fs-ease );
	padding-bottom: 1px;
}
.entry-content a:not(.wp-block-button__link):hover {
	background-size: 100% 1px;
}

.entry-content ul:not(.wp-block-buttons):not(.fs-link-grid):not(.fs-check-grid) > li {
	position: relative;
	padding-left: 1.6em;
	margin-bottom: 0.5em;
}
.entry-content ul:not(.wp-block-buttons):not(.fs-link-grid):not(.fs-check-grid) > li::marker {
	content: '';
}
.entry-content ul:not(.wp-block-buttons):not(.fs-link-grid):not(.fs-check-grid) > li::before {
	content: '';
	position: absolute;
	left: 0.15em;
	top: 0.62em;
	width: 6px;
	height: 6px;
	border-radius: 2px;
	background: var( --fs-accent );
}
.entry-content ol:not(.wp-block-buttons) > li {
	margin-bottom: 0.5em;
	padding-left: 0.3em;
}
.entry-content ol:not(.wp-block-buttons) > li::marker {
	color: var( --fs-accent );
	font-weight: 700;
	font-family: 'Space Grotesk', sans-serif;
}

.entry-content hr.wp-block-separator {
	border-top: 1px solid var( --fs-border );
	opacity: 1;
	margin: 3em auto;
}

/* -------------------------------------------------------------------------
   Cards — used for the homepage "tri prioritné služby" and feature grids
   ------------------------------------------------------------------------- */
.fs-card-grid {
	display: grid;
	grid-template-columns: repeat( 3, 1fr );
	gap: 1.5em;
	max-width: 920px;
	margin: 0 auto;
}
.fs-card {
	background: var( --fs-surface );
	border: 1px solid var( --fs-border );
	border-radius: var( --fs-radius );
	padding: 1.9em 1.7em;
	transition: transform 0.3s var( --fs-ease ), box-shadow 0.3s var( --fs-ease ), border-color 0.3s var( --fs-ease );
}
.fs-card:hover {
	transform: translateY( -6px );
	border-color: var( --fs-accent );
	box-shadow: var( --fs-shadow-hover );
}
.fs-card-num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.1em;
	height: 2.1em;
	padding: 0 0.2em;
	border-radius: 999px;
	background: var( --fs-bg-alt );
	border: 1px solid var( --fs-border );
	color: var( --fs-accent );
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700;
	font-size: 0.85rem;
	letter-spacing: 0.03em;
	margin-bottom: 1.1em;
}
.fs-card h3 {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700;
	color: var( --fs-heading );
	margin: 0 0 0.55em;
	font-size: 1.15rem;
}
.fs-card p {
	color: var( --fs-muted );
	margin: 0 0 1em;
	line-height: 1.6;
}
.fs-card a {
	display: inline-flex;
	align-items: center;
	gap: 0.4em;
	color: var( --fs-accent );
	font-weight: 600;
	text-decoration: none;
}
.fs-card a:hover {
	text-decoration: underline;
}

/* Two-column feature block (SOC monitoring / OT bezpečnosť, etc.) */
.fs-feature-grid {
	display: grid;
	grid-template-columns: repeat( 2, 1fr );
	gap: 1.5em;
	max-width: 920px;
	margin: 0 auto;
}
.fs-feature {
	background: var( --fs-surface );
	border: 1px solid var( --fs-border );
	border-radius: var( --fs-radius );
	padding: 1.9em 1.9em 2em;
}
.fs-feature h3 {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700;
	color: var( --fs-heading );
	margin: 0 0 0.6em;
	font-size: 1.2rem;
}
.fs-feature p {
	color: var( --fs-muted );
	line-height: 1.65;
	margin: 0 0 1em;
}
.fs-feature a {
	display: inline-flex;
	align-items: center;
	gap: 0.4em;
	color: var( --fs-accent );
	font-weight: 600;
	text-decoration: none;
}
.fs-feature a:hover {
	text-decoration: underline;
}

@media ( max-width: 900px ) {
	.fs-card-grid,
	.fs-feature-grid {
		grid-template-columns: 1fr;
	}
}

/* Related-services tag line ("Súvisiace služby: …") */
.entry-content p.has-small-font-size {
	margin-top: 3em;
	padding-top: 1.4em;
	border-top: 1px dashed var( --fs-border );
	color: var( --fs-muted );
}
.entry-content p.has-small-font-size a {
	white-space: nowrap;
}

/* -------------------------------------------------------------------------
   Buttons
   ------------------------------------------------------------------------- */
.wp-block-button__link {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 600;
	transition: transform 0.25s var( --fs-ease ), box-shadow 0.25s var( --fs-ease );
}
.wp-block-button:not(.is-style-outline) .wp-block-button__link:hover {
	transform: translateY( -1px );
	box-shadow: 0 10px 24px rgba( 27, 75, 115, 0.22 );
}
.wp-block-button.is-style-outline .wp-block-button__link {
	border: 2px solid var( --fs-accent );
	color: var( --fs-accent );
}
.wp-block-button.is-style-outline .wp-block-button__link:hover {
	background: var( --fs-accent );
	color: #fff;
	transform: translateY( -1px );
}

/* Low-emphasis text link used next to a single primary CTA (hero, etc.) */
.fs-link-cta {
	display: inline-flex;
	align-items: center;
	gap: 0.5em;
	color: var( --fs-heading );
	font-weight: 600;
	text-decoration: none;
	background-image: linear-gradient( var( --fs-heading ), var( --fs-heading ) );
	background-position: 0 100%;
	background-repeat: no-repeat;
	background-size: 0% 1px;
	transition: background-size 0.25s var( --fs-ease );
	padding-bottom: 2px;
}
.fs-link-cta:hover {
	background-size: 100% 1px;
}

/* -------------------------------------------------------------------------
   Full-bleed homepage section wrapper — alternating white / light-gray
   backgrounds, generous breathing room, clear visual separation.
   ------------------------------------------------------------------------- */
.fs-section {
	position: relative;
	width: 100vw;
	left: 50%;
	transform: translateX( -50% );
	padding: clamp( 3.5em, 7vw, 5.5em ) 1.5em;
	background: #fff;
}
.fs-section--alt {
	background: var( --fs-bg-alt );
}
.fs-section-inner {
	max-width: 920px !important;
	margin: 0 auto !important;
}
.fs-section-inner h2.wp-block-heading:first-child,
.fs-section-inner .fs-tag + h2.wp-block-heading {
	margin-top: 0;
}
.fs-section-inner > p {
	max-width: 720px;
}
.fs-section-inner > p:not(:first-child) {
	margin-top: 1em;
}

/* -------------------------------------------------------------------------
   Hero (full-bleed homepage intro)
   Clean, light, single clear hierarchy: heading, one short paragraph,
   one primary CTA. No grid pattern, no glow, no noise texture.
   ------------------------------------------------------------------------- */
.fs-hero {
	position: relative;
	width: 100vw;
	left: 50%;
	transform: translateX( -50% );
	margin-top: -1px;
	padding: clamp( 6em, 11vw, 9em ) 1.5em clamp( 5em, 10vw, 8em );
	background: linear-gradient( 180deg, #fff 0%, var( --fs-bg-alt ) 100% );
	border-bottom: 1px solid var( --fs-border );
	text-align: center;
}
.fs-hero > * {
	position: relative;
	max-width: 720px;
	margin-left: auto;
	margin-right: auto;
}
.fs-hero h1 {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700;
	font-size: clamp( 2.1rem, 5vw, 3.2rem );
	line-height: 1.15;
	letter-spacing: -0.02em;
	color: var( --fs-heading );
	margin: 0 0 0.55em;
	max-width: 820px;
}
.fs-hero h1 .fs-grad {
	color: var( --fs-accent );
}
.fs-hero p {
	color: var( --fs-muted );
	font-size: clamp( 1.05rem, 1.6vw, 1.2rem );
	line-height: 1.6;
	margin: 0 auto 0;
	max-width: 620px;
}
.fs-hero .wp-block-buttons {
	justify-content: center;
	align-items: center;
	gap: 1.6em;
	margin-top: 2em;
}

/* -------------------------------------------------------------------------
   Partner / technology logo strip
   Uniform-size tiles in a slow, pausable scrolling band — swap the
   placeholder wordmark tiles for real partner logo images (<img>) once
   supplied by the client.
   ------------------------------------------------------------------------- */
.fs-marquee {
	position: relative;
	width: 100vw;
	left: 50%;
	transform: translateX( -50% );
	padding: 2.6em 0;
	background: var( --fs-bg-alt );
	border-bottom: 1px solid var( --fs-border );
	overflow: hidden;
}
.fs-marquee-label {
	display: block;
	text-align: center;
	font-family: 'Space Grotesk', sans-serif;
	font-size: 0.72rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var( --fs-muted );
	margin: 0 0 1.5em;
}
.fs-marquee-viewport {
	mask-image: linear-gradient( 90deg, transparent, #000 8%, #000 92%, transparent );
	-webkit-mask-image: linear-gradient( 90deg, transparent, #000 8%, #000 92%, transparent );
}
.fs-marquee-track {
	display: flex;
	align-items: center;
	gap: 1.2em;
	width: max-content;
	animation: fs-marquee 34s linear infinite;
}
.fs-marquee:hover .fs-marquee-track {
	animation-play-state: paused;
}
.fs-logo-tile {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 168px;
	height: 64px;
	flex-shrink: 0;
	background: #fff;
	border: 1px solid var( --fs-border );
	border-radius: var( --fs-radius-sm );
	padding: 0 1em;
}
.fs-logo-tile img {
	max-width: 100%;
	max-height: 28px;
	width: auto;
	height: auto;
	display: block;
}
.fs-logo-tile span {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 600;
	font-size: 0.92rem;
	color: var( --fs-muted );
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	transition: color 0.25s var( --fs-ease );
}
.fs-logo-tile:hover span {
	color: var( --fs-heading );
}
@keyframes fs-marquee {
	from { transform: translateX( 0 ); }
	to { transform: translateX( -50% ); }
}
@media ( prefers-reduced-motion: reduce ) {
	.fs-marquee-track {
		animation: none !important;
		flex-wrap: wrap;
		justify-content: center;
		overflow-x: auto;
	}
}

/* -------------------------------------------------------------------------
   Closing CTA band (homepage) — solid brand-color panel for contrast
   against the alternating white / light-gray sections above it.
   ------------------------------------------------------------------------- */
.fs-cta-box {
	position: relative;
	width: 100vw;
	left: 50%;
	transform: translateX( -50% );
	padding: clamp( 3.5em, 7vw, 5.5em ) 1.5em;
	text-align: center;
	background: linear-gradient( 135deg, var( --fs-accent ), var( --fs-accent-2 ) );
}
.fs-cta-box .fs-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 0.6em;
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	font-size: 0.75rem;
	color: rgba( 255, 255, 255, 0.85 );
	margin-bottom: 1em;
}
.fs-cta-box h2 {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700;
	color: #fff;
	margin: 0 auto 0.5em;
	max-width: 640px;
	font-size: clamp( 1.5rem, 3vw, 2.1rem );
	line-height: 1.25;
}
.fs-cta-box p {
	color: rgba( 255, 255, 255, 0.85 );
	max-width: 560px;
	margin: 0 auto;
	line-height: 1.6;
}
.fs-cta-box .wp-block-buttons {
	justify-content: center;
	margin-top: 1.7em;
}
.fs-cta-box .wp-block-button__link {
	background: #fff;
	color: var( --fs-accent );
}
.fs-cta-box .wp-block-button__link:hover {
	box-shadow: 0 10px 24px rgba( 0, 0, 0, 0.2 );
}

/* -------------------------------------------------------------------------
   Reveal-on-scroll (progressive enhancement, JS adds .fs-in class) —
   respects prefers-reduced-motion below.
   ------------------------------------------------------------------------- */
.fs-reveal {
	opacity: 0;
	transform: translateY( 16px );
	transition: opacity 0.6s var( --fs-ease ), transform 0.6s var( --fs-ease );
}
.fs-reveal.fs-in {
	opacity: 1;
	transform: none;
}

@media ( prefers-reduced-motion: reduce ) {
	html {
		scroll-behavior: auto;
	}
	*,
	*::before,
	*::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.001ms !important;
		scroll-behavior: auto !important;
	}
	.fs-reveal {
		opacity: 1;
		transform: none;
	}
}

/* -------------------------------------------------------------------------
   Forms (WPForms contact form)
   ------------------------------------------------------------------------- */
.wpforms-container input[type="text"],
.wpforms-container input[type="email"],
.wpforms-container input[type="tel"],
.wpforms-container select,
.wpforms-container textarea {
	background: #fff !important;
	border: 1px solid var( --fs-border ) !important;
	color: var( --fs-heading ) !important;
	border-radius: var( --fs-radius-sm ) !important;
}
.wpforms-container input:focus,
.wpforms-container select:focus,
.wpforms-container textarea:focus {
	border-color: var( --fs-accent ) !important;
	box-shadow: 0 0 0 3px rgba( 27, 75, 115, 0.14 ) !important;
}

/* -------------------------------------------------------------------------
   Footer
   ------------------------------------------------------------------------- */
.ast-small-footer,
.footer-adv {
	border-top: 1px solid var( --fs-border );
}

/* -------------------------------------------------------------------------
   Responsive
   ------------------------------------------------------------------------- */
@media ( max-width: 768px ) {
	.fs-hero {
		text-align: left;
	}
	.fs-hero > * {
		margin-left: 0;
		margin-right: 0;
		max-width: 100%;
	}
	.fs-hero .wp-block-buttons {
		justify-content: flex-start;
	}
	.fs-section-inner > p {
		max-width: 100%;
	}
}