/* =============================================================
   Icarus Pictures — main stylesheet
   Editorial dark theme · fully responsive · mobile-first
   ============================================================= */

/* -------------------------------------------------------------
   1. Design tokens
   ------------------------------------------------------------- */
:root {
	/* Palette */
	--color-bg:       #0c0c0e;
	--color-bg-soft:  #15151a;
	/* Overlay alpha is driven by the Customizer (icarus_bg_overlay).
	   Default value is set here and overridden via wp_add_inline_style. */
	--icarus-overlay-alpha: 0.78;
	--icarus-bg-blur:       22px;
	--color-overlay:  rgba(12, 12, 14, var(--icarus-overlay-alpha));
	--color-text:     #f4f1ec;
	--color-muted:    #9c9893;
	--color-accent:   #E13293;
	--color-line:     rgba(244, 241, 236, 0.12);

	/* Typography */
	--font-display:   "Cormorant Garamond", "Times New Roman", serif;
	--font-body:      "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;

	/* Spacing scale */
	--space-xs:  0.5rem;
	--space-sm:  0.75rem;
	--space-md:  1.25rem;
	--space-lg:  2rem;
	--space-xl:  3rem;
	--space-2xl: 5rem;

	/* Layout */
	--container-max:  1720px;       /* Almost full-width on desktop. */
	--container-pad:  clamp(16px, 1.6vw, 28px); /* Tight but breathable side padding. */
	/* --header-height is injected dynamically by the Customizer (default 76px).
	   Define a fallback here for when inline CSS hasn't loaded yet. */
	--header-height:  76px;
	--icarus-logo-max-h: 44px;
	--radius-sm:      4px;
	--radius-md:      10px;

	/* Motion */
	--ease-out: cubic-bezier(0.16, 1, 0.3, 1);
	--dur-fast: 200ms;
	--dur-med:  450ms;
	--dur-slow: 800ms;

	/* Breakpoints (referenced in comments only, CSS uses px directly) */
}

/* -------------------------------------------------------------
   2. Base / reset
   ------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }

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

body {
	margin: 0;
	font-family: var(--font-body);
	font-size: 16px;
	line-height: 1.6;
	color: var(--color-text);
	background-color: var(--color-bg);
	overflow-x: hidden;
}

img, picture, video, svg {
	max-width: 100%;
	height: auto;
	/* No `display: block` here — it would defeat Elementor's text-align based
	   centering on the atomic Image widget. Theme widgets that DO need block
	   display (no baseline gap) declare it on their own classes. */
}

/* ============================================================
   Image download deterrent (paired with assets/js/image-protection.js).
   Blocks the visual-affordance side of "save image" — selection,
   drag handles, and the iOS long-press callout menu.
   Add the class `icarus-allow-download` on an <img> or an ancestor to
   opt OUT for specific images (press kit, etc.).
   ============================================================ */
img:not(.icarus-allow-download):not(.icarus-allow-download *) {
	-webkit-user-drag: none;
	user-select: none;
	-webkit-user-select: none;
	-webkit-touch-callout: none; /* hides iOS Safari long-press menu */
}

a {
	color: inherit;
	text-decoration: none;
	transition: color var(--dur-fast) var(--ease-out);
}
a:hover,
a:focus-visible { color: var(--color-accent); }

h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-display);
	font-weight: 500;
	line-height: 1.15;
	/* Light default — Elementor's per-widget settings override this. */
	margin: 0 0 0.5em;
	letter-spacing: 0.01em;
}

/* Override Hello Elementor's parent theme heading sizes (h2: 2rem etc.)
   with restrained editorial defaults.
   The `body` selector raises specificity to (0,0,0,2) so we beat the
   parent's plain `h2 { font-size: 2rem }` (specificity 1) regardless of
   the parent's stylesheet load order.
   Elementor per-widget rules use `.elementor-element-XYZ ...` chains with
   specificity ≥4 — they still beat us, so user customizations win. */
body h1 { font-size: 2rem; }
body h2 { font-size: 1.5rem; }
body h3 { font-size: 1.25rem; }
body h4 { font-size: 1.1rem; }
body h5 { font-size: 1rem; }
body h6 { font-size: 0.9rem; }

/* Light paragraph margin — Elementor's per-widget typography settings
   override this naturally thanks to higher CSS specificity. */
p { margin: 0 0 1em; }

button {
	font: inherit;
	color: inherit;
	background: none;
	border: 0;
	cursor: pointer;
}

::selection { background: var(--color-accent); color: var(--color-bg); }

.screen-reader-text {
	position: absolute !important;
	clip: rect(1px, 1px, 1px, 1px);
	width: 1px; height: 1px;
	overflow: hidden;
}
.screen-reader-text:focus {
	position: fixed !important;
	top: 12px; left: 12px;
	width: auto; height: auto;
	padding: var(--space-sm) var(--space-md);
	background: var(--color-bg-soft);
	color: var(--color-text);
	clip: auto;
	z-index: 10000;
}

/* -------------------------------------------------------------
   3. Blurred fixed background
   ------------------------------------------------------------- */
.icarus-bg {
	position: fixed;
	inset: 0;
	z-index: -2;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	/* Blur radius is driven by the Customizer (icarus_bg_blur). */
	filter: blur(var(--icarus-bg-blur, 22px)) brightness(0.55) saturate(0.9);
	transform: scale(1.15); /* hides the blurred edges */
	will-change: filter;
}
/* Dark overlay placed above the bg so text stays readable */
body::before {
	content: "";
	position: fixed;
	inset: 0;
	z-index: -1;
	background: var(--color-overlay);
	pointer-events: none;
}

/* -------------------------------------------------------------
   4. Generic layout
   ------------------------------------------------------------- */
.icarus-main {
	min-height: calc(100vh - var(--header-height));
	padding-top: var(--header-height);
}
/* Page wrapper rendered by page.php / front-page.php. No width constraint,
   no padding — every widget inside it controls its own internal layout. */
.icarus-page {
	width: 100%;
	max-width: 100%;
	margin: 0;
	padding: 0;
}

/* When the page contains a Hero or a Banner widget, let it touch the top of
   the viewport (the fixed transparent header sits over it). Requires browser
   :has() support — all evergreen browsers since 2023. */
.icarus-main:has(.icarus-hero-w),
.icarus-main:has(.icarus-banner-w),
.icarus-main:has(.icarus-page--home) {
	padding-top: 0;
}

/* The Elementor sections/columns that host our custom widgets need to take
   the full available width with no inner padding — otherwise the carousels
   look squeezed and the hero leaves margins on the sides. We only reset
   PADDING (not margin) to preserve Elementor's auto-centering. */
.elementor-widget-container:has(> .icarus-hero-w),
.elementor-widget-container:has(> .icarus-banner-w),
.elementor-widget-container:has(> .icarus-cc),
.elementor-widget-container:has(> .icarus-ts),
.elementor-widget:has(.icarus-hero-w),
.elementor-widget:has(.icarus-banner-w),
.elementor-widget:has(.icarus-cc),
.elementor-widget:has(.icarus-ts),
.elementor-column:has(.icarus-hero-w),
.elementor-column:has(.icarus-banner-w),
.elementor-column:has(.icarus-cc),
.elementor-column:has(.icarus-ts),
.elementor-column-wrap:has(.icarus-hero-w),
.elementor-column-wrap:has(.icarus-banner-w),
.elementor-column-wrap:has(.icarus-cc),
.elementor-column-wrap:has(.icarus-ts),
.e-con:has(.icarus-hero-w),
.e-con:has(.icarus-banner-w),
.e-con:has(.icarus-cc),
.e-con:has(.icarus-ts),
.e-con-inner:has(.icarus-hero-w),
.e-con-inner:has(.icarus-banner-w),
.e-con-inner:has(.icarus-cc),
.e-con-inner:has(.icarus-ts) {
	padding: 0 !important;
	max-width: 100% !important;
	width: 100% !important;
}
/* Sections specifically: also stretch to 100% of the viewport when they host
   a Hero widget. Padding=0 is critical for the Hero to touch the top. */
.elementor-section:has(.icarus-hero-w),
.elementor-section:has(.icarus-banner-w),
.elementor-section:has(.icarus-cc),
.elementor-section:has(.icarus-ts) {
	padding: 0 !important;
	width: 100% !important;
	max-width: 100% !important;
}
/* For the new flex-container ("Stretch full width" enabled by default) */
.e-con-full:has(.icarus-hero-w),
.e-con-full:has(.icarus-banner-w),
.e-con-full:has(.icarus-cc),
.e-con-full:has(.icarus-ts) {
	padding: 0 !important;
	max-width: 100% !important;
}

/* Hide WordPress page title rendering when present (some templates still
   inject one). Keeps Elementor in full control of the visible content. */
.icarus-main .entry-header,
.icarus-main .page-header,
.icarus-main > .entry-title,
.icarus-main h1.entry-title,
.icarus-main h1.page-title {
	display: none !important;
}

/* WordPress admin bar offset for logged-in users — keep the fixed header
   below the admin bar so it doesn't get hidden behind it. */
body.admin-bar .icarus-header { top: 32px; }
@media (max-width: 782px) {
	body.admin-bar .icarus-header { top: 46px; }
}

.icarus-container {
	width: 100%;
	max-width: var(--container-max);
	margin: 0 auto;
	padding: 0 var(--container-pad);
}

/* Buttons */
.icarus-btn {
	display: inline-block;
	padding: 0.85rem 1.6rem;
	font-family: var(--font-body);
	font-size: 0.875rem;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--color-bg);
	background: var(--color-accent);
	border-radius: var(--radius-sm);
	transition: background var(--dur-fast) var(--ease-out),
				transform var(--dur-fast) var(--ease-out);
}
.icarus-btn:hover,
.icarus-btn:focus-visible {
	background: var(--color-text);
	color: var(--color-bg);
	transform: translateY(-1px);
}
.icarus-btn--ghost {
	background: transparent;
	color: var(--color-text);
	border: 1px solid var(--color-text);
}
.icarus-btn--ghost:hover,
.icarus-btn--ghost:focus-visible {
	background: var(--color-text);
	color: var(--color-bg);
}

/* -------------------------------------------------------------
   5. Header
   ------------------------------------------------------------- */
.icarus-header {
	position: fixed;
	top: 0; left: 0;
	width: 100%;
	height: var(--header-height);
	z-index: 200;
	background: linear-gradient(180deg, rgba(12,12,14,0.85) 0%, rgba(12,12,14,0) 100%);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	transition: background var(--dur-med) var(--ease-out);
}
.icarus-header__inner {
	/* Full-width: logo flush left, nav flush right. No max-width constraint. */
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0 var(--space-lg);
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.icarus-logo {
	display: inline-flex;
	align-items: center;
	gap: var(--space-sm);
}
.icarus-logo__text {
	font-family: var(--font-display);
	font-size: 1.6rem;
	letter-spacing: 0.06em;
	color: var(--color-text);
}
/* Logo image: height controlled via the Customizer (--icarus-logo-max-h).
   WP outputs inline width/height attributes on the <img> which we override
   to let our max-height drive the sizing while keeping the aspect ratio. */
.icarus-logo__img,
.icarus-logo img {
	max-height: var(--icarus-logo-max-h, 44px);
	width: auto !important;
	height: auto !important;
	display: block;
}

/* -------------------------------------------------------------
   5b. Desktop nav — classic horizontal menu with hover dropdowns
   ------------------------------------------------------------- */
.icarus-dnav {
	display: none; /* hidden on mobile; revealed at ≥1100 px */
}
@media (min-width: 1100px) {
	.icarus-dnav { display: block; }
	/* Hide hamburger on desktop */
	.icarus-burger { display: none !important; }
	/* Hide overlay on desktop (prevents accidental opening via keyboard) */
	.icarus-overlay { display: none !important; }
}

.icarus-dnav__menu {
	list-style: none;
	margin: 0; padding: 0;
	display: flex;
	align-items: center;
	gap: 6px;
}

/* First-level items */
.icarus-dnav__menu > li > a {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 14px;
	font-family: var(--font-body);
	font-size: 0.82rem;
	font-weight: 500;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--icarus-menu-text, var(--color-text));
	border-radius: var(--radius-sm);
	transition: color var(--dur-fast) var(--ease-out),
				background var(--dur-fast) var(--ease-out);
}
.icarus-dnav__menu > li > a:hover,
.icarus-dnav__menu > li > a:focus-visible,
.icarus-dnav__menu > li.current-menu-item > a,
.icarus-dnav__menu > li.current-menu-parent > a {
	color: var(--icarus-menu-accent, var(--color-accent));
	background: rgba(255, 255, 255, 0.04);
}

/* Chevron on parent items that have a dropdown sub-menu.
   Rotates from pointing down → pointing up when the dropdown is open. */
.icarus-dnav__menu > .menu-item-has-children > a::after {
	content: "";
	flex-shrink: 0;
	width: 7px;
	height: 7px;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	transform: rotate(45deg) translateY(-2px);
	transition: transform 300ms var(--ease-out);
}
.icarus-dnav__menu > .menu-item-has-children:hover > a::after,
.icarus-dnav__menu > .menu-item-has-children:focus-within > a::after {
	transform: rotate(-135deg) translateY(-2px);
}

/* Dropdown sub-menu */
.icarus-dnav__menu .sub-menu {
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translateX(-50%) translateY(8px);
	min-width: 230px;
	padding: 10px 0;
	list-style: none;
	margin: 0;
	background: rgba(15, 15, 20, 0.94);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	border: 1px solid var(--color-line);
	border-radius: 10px;
	box-shadow: 0 16px 48px -12px rgba(0, 0, 0, 0.5);
	z-index: 200;
	/* Hidden by default, revealed on parent hover */
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity 250ms var(--ease-out),
				transform 250ms var(--ease-out),
				visibility 250ms;
}
.icarus-dnav__menu > li {
	position: relative;
}
.icarus-dnav__menu > li:hover > .sub-menu,
.icarus-dnav__menu > li:focus-within > .sub-menu {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: translateX(-50%) translateY(0);
}

.icarus-dnav__menu .sub-menu li a {
	display: block;
	padding: 9px 22px;
	font-family: var(--font-body);
	font-size: 0.88rem;
	font-weight: 400;
	color: var(--icarus-menu-submenu-text, var(--color-muted));
	transition: color var(--dur-fast) var(--ease-out),
				background var(--dur-fast) var(--ease-out);
}
.icarus-dnav__menu .sub-menu li a:hover,
.icarus-dnav__menu .sub-menu li a:focus-visible,
.icarus-dnav__menu .sub-menu .current-menu-item > a {
	color: var(--icarus-menu-accent, var(--color-accent));
	background: rgba(255, 255, 255, 0.05);
}

/* Hamburger button — visible only <1100 px */
.icarus-burger {
	position: relative;
	width: 44px; height: 44px;
	display: inline-flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-end;
	gap: 6px;
	padding: 0 8px;
	border-radius: var(--radius-sm);
	transition: background var(--dur-fast) var(--ease-out);
}
.icarus-burger:hover,
.icarus-burger:focus-visible { background: rgba(255,255,255,0.06); }
.icarus-burger__bar {
	display: block;
	height: 1.5px;
	background-color: var(--color-text);
	border-radius: 2px;
	transition: transform var(--dur-med) var(--ease-out),
				opacity var(--dur-fast) var(--ease-out),
				width var(--dur-med) var(--ease-out);
}
.icarus-burger__bar:nth-child(1) { width: 28px; }
.icarus-burger__bar:nth-child(2) { width: 22px; }
.icarus-burger__bar:nth-child(3) { width: 28px; }

.icarus-burger.is-active .icarus-burger__bar:nth-child(1) {
	transform: translateY(7.5px) rotate(45deg);
	width: 28px;
}
.icarus-burger.is-active .icarus-burger__bar:nth-child(2) {
	opacity: 0;
}
.icarus-burger.is-active .icarus-burger__bar:nth-child(3) {
	transform: translateY(-7.5px) rotate(-45deg);
	width: 28px;
}

/* -------------------------------------------------------------
   6. Overlay menu
   ------------------------------------------------------------- */
.icarus-overlay {
	position: fixed;
	inset: 0;
	z-index: 150;
	/* Drives by Customizer (Apparence → Personnaliser → Icarus Pictures — Menu).
	   Fallback uses the default palette dark color. */
	background: var(--icarus-menu-bg, rgba(8, 8, 10, 0.96));
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	opacity: 0;
	transition: opacity var(--dur-med) var(--ease-out);
	overflow-y: auto;
}
.icarus-overlay.is-open { opacity: 1; }
.icarus-overlay[hidden] { display: none; }

.icarus-overlay__inner {
	max-width: var(--container-max);
	min-height: 100%;
	margin: 0 auto;
	padding: calc(var(--header-height) + var(--space-xl)) var(--space-md) var(--space-xl);
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--space-2xl);
}

.icarus-overlay__menu {
	list-style: none;
	margin: 0; padding: 0;
}
.icarus-overlay__menu > li {
	border-bottom: 1px solid var(--color-line);
	padding: var(--space-md) 0;
	opacity: 0;
	transform: translateY(20px);
	animation: icarus-fade-up var(--dur-slow) var(--ease-out) forwards;
}
.icarus-overlay.is-open .icarus-overlay__menu > li:nth-child(1) { animation-delay: 0.05s; }
.icarus-overlay.is-open .icarus-overlay__menu > li:nth-child(2) { animation-delay: 0.10s; }
.icarus-overlay.is-open .icarus-overlay__menu > li:nth-child(3) { animation-delay: 0.15s; }
.icarus-overlay.is-open .icarus-overlay__menu > li:nth-child(4) { animation-delay: 0.20s; }
.icarus-overlay.is-open .icarus-overlay__menu > li:nth-child(5) { animation-delay: 0.25s; }
.icarus-overlay.is-open .icarus-overlay__menu > li:nth-child(6) { animation-delay: 0.30s; }

.icarus-overlay__menu > li > a {
	font-family: var(--font-display);
	font-size: clamp(1.8rem, 4vw, 2.8rem);
	font-weight: 500;
	display: inline-block;
	color: var(--icarus-menu-text, var(--color-text));
}
.icarus-overlay__menu > li > a:hover,
.icarus-overlay__menu > li.current-menu-item > a,
.icarus-overlay__menu > li.current-menu-parent > a {
	color: var(--icarus-menu-accent, var(--color-accent));
}
/* Chevron on parent items that have children. Points down at rest,
   rotates up when the sub-menu is open. */
.icarus-overlay__menu > .menu-item-has-children > a {
	display: flex;
	align-items: center;
	gap: 12px;
}
.icarus-overlay__menu > .menu-item-has-children > a::after {
	content: "";
	flex-shrink: 0;
	width: 10px;
	height: 10px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg);
	transition: transform 300ms var(--ease-out);
}
.icarus-overlay__menu > .menu-item-has-children.is-open > a::after {
	transform: rotate(-135deg);
}

/* Sub-menus: hidden by default, slide-down when parent has .is-open. */
.icarus-overlay__menu .sub-menu {
	list-style: none;
	margin: 0;
	padding: 0 0 0 var(--space-md);
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--space-xs);
	max-height: 0;
	overflow: hidden;
	opacity: 0;
	transition: max-height 400ms var(--ease-out),
				opacity    300ms var(--ease-out),
				margin-top 300ms var(--ease-out);
}
.icarus-overlay__menu > .menu-item-has-children.is-open > .sub-menu {
	max-height: 600px;
	opacity: 1;
	margin-top: var(--space-sm);
}

.icarus-overlay__menu .sub-menu a {
	font-family: var(--font-body);
	font-size: 1rem;
	color: var(--icarus-menu-submenu-text, var(--color-muted));
}
.icarus-overlay__menu .sub-menu a:hover,
.icarus-overlay__menu .sub-menu .current-menu-item > a {
	color: var(--icarus-menu-accent, var(--color-accent));
}

.icarus-overlay__side {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	gap: var(--space-md);
	padding-top: var(--space-lg);
	border-top: 1px solid var(--color-line);
}
.icarus-overlay__tagline {
	font-family: var(--font-display);
	font-style: italic;
	font-size: 1.25rem;
	color: var(--color-muted);
	margin: 0;
}

/* Tablet+ : split into two columns and 2-col sub-menus */
@media (min-width: 768px) {
	.icarus-overlay__inner {
		grid-template-columns: minmax(0, 1fr) 320px;
		gap: var(--space-2xl);
	}
	.icarus-overlay__menu .sub-menu {
		grid-template-columns: 1fr 1fr;
		gap: var(--space-xs) var(--space-lg);
	}
	.icarus-overlay__side {
		justify-content: center;
		border-top: 0;
		border-left: 1px solid var(--color-line);
		padding-top: 0;
		padding-left: var(--space-lg);
	}
}

@keyframes icarus-fade-up {
	to { opacity: 1; transform: translateY(0); }
}

/* Body lock + hide overflow when menu is open */
body.icarus-menu-open { overflow: hidden; }

/* -------------------------------------------------------------
   7. Footer
   ------------------------------------------------------------- */
.icarus-footer {
	margin-top: var(--space-2xl);
	background: var(--color-bg-soft);
	color: var(--color-text);
	border-top: 1px solid var(--color-line);
}
.icarus-footer__inner {
	max-width: var(--container-max);
	margin: 0 auto;
	padding: var(--space-xl) var(--container-pad);
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--space-xl);
}
.icarus-footer__title {
	font-family: var(--font-body);
	font-size: 0.75rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--color-muted);
	margin-bottom: var(--space-md);
}
.icarus-footer__menu,
.icarus-footer__social {
	list-style: none;
	margin: 0; padding: 0;
	display: flex;
	flex-direction: column;
	gap: var(--space-xs);
}
.icarus-footer__address { font-style: normal; color: var(--color-muted); }
.icarus-footer__tagline {
	font-family: var(--font-display);
	font-style: italic;
	color: var(--color-muted);
	margin-top: var(--space-sm);
}

.icarus-footer__base {
	max-width: var(--container-max);
	margin: 0 auto;
	padding: var(--space-md) var(--container-pad);
	border-top: 1px solid var(--color-line);
	display: flex;
	flex-direction: column;
	gap: var(--space-xs);
	align-items: center;
	text-align: center;
	color: var(--color-muted);
	font-size: 0.85rem;
}
.icarus-footer__base p { margin: 0; }
.icarus-footer__legal { display: flex; gap: var(--space-xs); flex-wrap: wrap; justify-content: center; }

@media (min-width: 768px) {
	.icarus-footer__inner {
		grid-template-columns: 1.4fr 1fr 1.2fr 1fr;
		gap: var(--space-xl);
	}
	.icarus-footer__base {
		flex-direction: row;
		justify-content: space-between;
		text-align: left;
	}
}

/* -------------------------------------------------------------
   8. Helpers used by Elementor pages
   ------------------------------------------------------------- */

/* Full-screen hero used on the homepage (Elementor section helper class) */
.icarus-hero {
	min-height: 100vh;
	display: flex;
	align-items: flex-end;
	color: var(--color-text);
}
.icarus-hero__title {
	font-size: clamp(2.2rem, 5vw, 4.2rem);
	letter-spacing: 0.02em;
}
.icarus-hero__subtitle {
	font-family: var(--font-display);
	font-style: italic;
	color: var(--color-muted);
}

/* Reusable two-column section (text 1/3 + media 2/3) */
.icarus-section {
	padding: var(--space-2xl) 0;
}
.icarus-section__inner {
	max-width: var(--container-max);
	margin: 0 auto;
	padding: 0 var(--container-pad);
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--space-xl);
	align-items: center;
}
@media (min-width: 1100px) {
	.icarus-section__inner {
		grid-template-columns: 1fr 2fr;
		gap: var(--space-2xl);
	}
	.icarus-section--reverse .icarus-section__inner {
		grid-template-columns: 2fr 1fr;
	}
	.icarus-section--reverse .icarus-section__text {
		order: 2;
	}
}

/* Respect prefers-reduced-motion */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* -------------------------------------------------------------
   9. Elementor widgets — NO overrides.
   We deliberately do NOT target .elementor-widget-* selectors so the
   per-widget settings the user configures in the Elementor editor
   (typography, spacing, color) always take precedence and the WYSIWYG
   experience is honored exactly.

   Global defaults defined earlier in this file (body font, palette,
   heading family, base paragraph margin) still cascade in as fallbacks
   when no Elementor setting is set on a widget — but they never
   override anything the user has changed in Elementor.
   ------------------------------------------------------------- */