/*
Theme Name: Astra Child
Template: astra
Version: 1.0.0
Text Domain: astra-child
*/

:root {
	--phomi-font: "GTF Adieu TRIAL";
}

body,
body .site,
body .site-content,
body .entry-content,
body input,
body textarea,
body button,
body select {
	font-family: "GTF Adieu TRIAL";
}

html.phomi-page-loading::before {
	animation: phomi-loading-bar 1s ease-in-out infinite;
	background: var(--phomi-blue, #70c7d1);
	box-shadow: 0 0 18px rgba(112, 199, 209, 0.62);
	content: "";
	height: 3px;
	left: 0;
	position: fixed;
	top: 0;
	transform-origin: left center;
	width: 100%;
	z-index: 99999;
}

@keyframes phomi-loading-bar {
	0% {
		transform: scaleX(0);
	}
	55% {
		transform: scaleX(0.72);
	}
	100% {
		transform: scaleX(0.96);
	}
}

.phomi-header {
	background: transparent;
	left: 0 !important;
	position: fixed !important;
	top: 0 !important;
	transition: background-color 0.24s ease, box-shadow 0.24s ease;
	width: 100% !important;
	z-index: 1000 !important;
}

.phomi-header.is-scrolled,
.phomi-header.is-nav-active,
.phomi-header.is-mega-active,
.phomi-header.is-nav-hover {
	background: #fff;
	box-shadow: 0 8px 28px rgba(0, 0, 0, 0.08);
}

.phomi-header.is-scrolled .phomi-nav > ul > li > a,
.phomi-header.is-nav-active .phomi-nav > ul > li > a,
.phomi-header.is-mega-active .phomi-nav > ul > li > a,
.phomi-header.is-nav-hover .phomi-nav > ul > li > a {
	color: #000;
}

.phomi-logo__default,
.phomi-logo__active {
	transition: opacity 220ms ease;
}

.phomi-logo__active {
	inset: 0;
	opacity: 0;
	position: absolute;
}

.phomi-header.is-scrolled .phomi-logo__default,
.phomi-header.is-nav-active .phomi-logo__default,
.phomi-header.is-mega-active .phomi-logo__default,
.phomi-header.is-nav-hover .phomi-logo__default {
	opacity: 0;
}

.phomi-header.is-scrolled .phomi-logo__active,
.phomi-header.is-nav-active .phomi-logo__active,
.phomi-header.is-mega-active .phomi-logo__active,
.phomi-header.is-nav-hover .phomi-logo__active {
	opacity: 1;
}

.phomi-nav > ul > li > a:hover,
.phomi-nav > ul > li > a:focus-visible {
	color: var(--phomi-blue) !important;
}

.phomi-nav .has-menu:hover > a::after,
.phomi-nav .has-menu:focus-within > a::after {
	transform: rotate(45deg) !important;
}

.phomi-nav .has-mega-menu:hover:not(.is-mega-open):not(.is-mega-leaving) .phomi-mega-menu,
.phomi-nav .has-mega-menu:focus-within:not(.is-mega-open):not(.is-mega-leaving) .phomi-mega-menu {
	opacity: 0 !important;
	pointer-events: none !important;
	transform: translateY(-8px) !important;
	visibility: hidden !important;
}

.phomi-nav .has-mega-menu .phomi-mega-menu {
	transition: opacity 420ms ease, transform 420ms ease, visibility 420ms ease !important;
}

.phomi-nav .has-mega-menu.is-mega-open > a::after {
	transform: rotate(225deg) !important;
}

.phomi-header.is-mega-active .has-mega-menu.is-mega-open .phomi-mega-menu,
.phomi-nav .has-mega-menu.is-mega-open .phomi-mega-menu {
	opacity: 1 !important;
	pointer-events: auto !important;
	transform: translateY(0) !important;
	visibility: visible !important;
	z-index: 20 !important;
}

.phomi-header.is-mega-active .has-mega-menu.is-mega-leaving .phomi-mega-menu,
.phomi-nav .has-mega-menu.is-mega-leaving .phomi-mega-menu {
	opacity: 0 !important;
	pointer-events: none !important;
	transform: translateY(-8px) !important;
	visibility: visible !important;
	z-index: 21 !important;
}

.phomi-header.is-mega-active ~ .phomi-menu-scrim {
	opacity: 1 !important;
	visibility: visible !important;
}

/* Scrim only when mega menu is open (click), not on mere nav hover. */
.phomi-header:has(.has-mega-menu:hover):not(.is-mega-active) ~ .phomi-menu-scrim,
.phomi-header:has(.has-mega-menu:focus-within):not(.is-mega-active) ~ .phomi-menu-scrim {
	opacity: 0 !important;
	visibility: hidden !important;
}

.phomi-header.is-mega-active:has(.has-mega-menu--case.is-mega-open) ~ .phomi-menu-scrim,
.phomi-header.is-mega-active:has(.has-mega-menu--about.is-mega-open) ~ .phomi-menu-scrim,
.phomi-header.is-mega-active:has(.has-mega-menu--technology.is-mega-open) ~ .phomi-menu-scrim,
.phomi-header.is-mega-active:has(.has-mega-menu--application.is-mega-open) ~ .phomi-menu-scrim,
.phomi-header.is-mega-active:has(.has-mega-menu--partner.is-mega-open) ~ .phomi-menu-scrim {
	top: 686px;
}

/* Desktop mega menu only — below 1181px the header drawer (header.css) owns these. */
@media (min-width: 1181px) {
	.phomi-nav .has-mega-menu--about .phomi-mega-menu,
	.phomi-nav .has-mega-menu--about .phomi-mega-menu__panel,
	.phomi-nav .has-mega-menu--case .phomi-mega-menu,
	.phomi-nav .has-mega-menu--case .phomi-mega-menu__panel,
	.phomi-nav .has-mega-menu--technology .phomi-mega-menu,
	.phomi-nav .has-mega-menu--technology .phomi-mega-menu__panel,
	.phomi-nav .has-mega-menu--application .phomi-mega-menu,
	.phomi-nav .has-mega-menu--application .phomi-mega-menu__panel,
	.phomi-nav .has-mega-menu--partner .phomi-mega-menu,
	.phomi-nav .has-mega-menu--partner .phomi-mega-menu__panel {
		width: 100vw !important;
	}

	.phomi-nav .has-mega-menu--about .phomi-mega-menu,
	.phomi-nav .has-mega-menu--case .phomi-mega-menu,
	.phomi-nav .has-mega-menu--application .phomi-mega-menu,
	.phomi-nav .has-mega-menu--partner .phomi-mega-menu {
		height: 596px !important;
	}

	.phomi-nav .has-mega-menu--about .phomi-mega-menu__panel,
	.phomi-nav .has-mega-menu--case .phomi-mega-menu__panel,
	.phomi-nav .has-mega-menu--application .phomi-mega-menu__panel,
	.phomi-nav .has-mega-menu--partner .phomi-mega-menu__panel {
		height: 570px !important;
	}

	.phomi-nav .phomi-mega-card:hover,
	.phomi-nav .phomi-mega-card:focus-visible {
		filter: brightness(1.08);
		outline: none;
		transform: scale(1.06);
	}
}


.phomi-footer a.phomi-footer__email {
	align-items: flex-start;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.phomi-footer__email img {
	flex: 0 0 auto;
	height: 32px;
	width: 32px;
}

/* About / Case / Product / Technology / Application / Partner: fluid card flow. */
:root {
	--phomi-mega-card-width: clamp(240px, 16.145833vw, 310px);
	--phomi-mega-card-gap: clamp(22px, 1.5625vw, 30px);
	--phomi-mega-content-width: 1330px;
	--phomi-mega-padding-x: max(40px, calc((100vw - var(--phomi-mega-content-width)) / 2));
	--phomi-mega-padding-y: 50px;
	--phomi-mega-product-card-height: calc(var(--phomi-mega-card-width) * 186 / 310 + 36px);
	/* Match preview image row height; JS overrides when list is taller than image. */
	--phomi-mega-product-submenu-height: max(
		calc(var(--phomi-mega-card-width) * 186 / 310 + clamp(20px, 2vw, 36px)),
		280px
	);
	--phomi-mega-top: 90px;
	--phomi-scrim-top: calc(var(--phomi-mega-top) + 346px);
	/* Align mega cards with logo/title trailing edge (Figma 1920: 450 + 5 = 455). */
	--phomi-logo-left: 15.104167vw;
	--phomi-logo-width: 8.333333vw;
	--phomi-mega-title-end: calc(var(--phomi-logo-left) + var(--phomi-logo-width) + 5px);
}

/* Desktop mega menu only — below 1181px the header drawer (header.css) owns these. */
@media (min-width: 1181px) {
	.phomi-nav .has-mega-menu--about .phomi-mega-menu,
	.phomi-nav .has-mega-menu--case .phomi-mega-menu,
	.phomi-nav .has-mega-menu--product .phomi-mega-menu,
	.phomi-nav .has-mega-menu--technology .phomi-mega-menu,
	.phomi-nav .has-mega-menu--application .phomi-mega-menu,
	.phomi-nav .has-mega-menu--partner .phomi-mega-menu {
		background: transparent !important;
		height: auto !important;
		left: 0 !important;
		min-height: 0 !important;
		right: 0 !important;
		top: var(--phomi-mega-top) !important;
		width: 100vw !important;
	}

	.phomi-nav .has-mega-menu--about .phomi-mega-menu__panel,
	.phomi-nav .has-mega-menu--case .phomi-mega-menu__panel,
	.phomi-nav .has-mega-menu--product .phomi-mega-menu__panel,
	.phomi-nav .has-mega-menu--technology .phomi-mega-menu__panel,
	.phomi-nav .has-mega-menu--application .phomi-mega-menu__panel,
	.phomi-nav .has-mega-menu--partner .phomi-mega-menu__panel {
		align-content: start !important;
		align-items: stretch !important;
		background: #1a1a1a !important;
		box-sizing: border-box !important;
		display: flex !important;
		flex: 0 0 auto !important;
		flex-wrap: wrap !important;
		gap: var(--phomi-mega-card-gap) !important;
		height: auto !important;
		justify-content: center !important;
		min-height: 0 !important;
		padding: var(--phomi-mega-padding-y) var(--phomi-mega-padding-x) !important;
		position: relative !important;
		width: 100% !important;
	}

	.phomi-nav .has-mega-menu--about .phomi-mega-card:nth-child(n),
	.phomi-nav .has-mega-menu--case .phomi-mega-card:nth-child(n),
	.phomi-nav .has-mega-menu--product .phomi-mega-card:nth-child(n),
	.phomi-nav .has-mega-menu--technology .phomi-mega-card:nth-child(n),
	.phomi-nav .has-mega-menu--application .phomi-mega-card:nth-child(n),
	.phomi-nav .has-mega-menu--partner .phomi-mega-card:nth-child(n) {
		box-sizing: border-box !important;
		flex: 0 0 var(--phomi-mega-card-width) !important;
		left: auto !important;
		max-width: none !important;
		position: relative !important;
		top: auto !important;
		width: var(--phomi-mega-card-width) !important;
	}

	.phomi-nav .has-mega-menu--about .phomi-mega-card img,
	.phomi-nav .has-mega-menu--case .phomi-mega-card img,
	.phomi-nav .has-mega-menu--product .phomi-mega-card img,
	.phomi-nav .has-mega-menu--technology .phomi-mega-card img,
	.phomi-nav .has-mega-menu--application .phomi-mega-card img,
	.phomi-nav .has-mega-menu--partner .phomi-mega-card img {
		aspect-ratio: 310 / 186 !important;
		height: auto !important;
		object-fit: cover !important;
		width: 100% !important;
	}

	/* PRODUCT: level-1 cards in one row; arrow reveals a full-width level-2 row below. */
	.phomi-nav .has-mega-menu--product .phomi-mega-card-group {
		flex: 0 0 var(--phomi-mega-card-width) !important;
		max-width: none !important;
		position: static;
		width: var(--phomi-mega-card-width) !important;
	}

	.phomi-nav .has-mega-menu--product .phomi-mega-card-group .phomi-mega-card {
		width: 100% !important;
	}

	.phomi-nav .has-mega-menu--product .phomi-mega-card-wrap {
		position: relative;
		width: 100%;
	}

	.phomi-nav .has-mega-menu--product .phomi-mega-submenu {
		align-items: flex-start;
		box-sizing: border-box;
		display: none;
		flex-direction: row;
		gap: clamp(32px, 4.5vw, 72px);
		margin: 0;
		opacity: 0;
		overflow: hidden;
		padding-top: clamp(20px, 2vw, 36px);
		pointer-events: none;
		visibility: hidden;
		width: auto;
	}

	.phomi-nav .has-mega-menu--product.is-mega-open .phomi-mega-card-group,
	.phomi-nav .has-mega-menu--product.is-mega-open .phomi-mega-card--primary {
		visibility: visible;
	}

	.phomi-nav .has-mega-menu--product .phomi-mega-card__toggle {
		align-items: center;
		background: transparent;
		border: 0;
		bottom: 0;
		color: #fff;
		cursor: pointer;
		display: flex;
		height: 28px;
		justify-content: center;
		padding: 0;
		position: absolute;
		right: 0;
		width: 28px;
		z-index: 2;
	}

	.phomi-nav .has-mega-menu--product .phomi-mega-card__toggle:hover,
	.phomi-nav .has-mega-menu--product .phomi-mega-card__toggle:focus-visible {
		opacity: 0.78;
		outline: none;
	}

	.phomi-nav .has-mega-menu--product .phomi-mega-card__chevron {
		border-bottom: 1px solid currentColor;
		border-right: 1px solid currentColor;
		display: block;
		height: 7px;
		transform: rotate(45deg);
		transition: transform 0.2s ease;
		width: 7px;
	}

	.phomi-nav .has-mega-menu--product .phomi-mega-menu__panel:has(.phomi-mega-card-group.is-submenu-open) {
		height: auto !important;
		min-height: 0 !important;
		overflow: visible !important;
		padding-bottom: calc(var(--phomi-mega-padding-y) + var(--phomi-mega-product-submenu-height) + 12px) !important;
	}

	.phomi-nav .has-mega-menu--product.is-mega-open:has(.phomi-mega-card-group.is-submenu-open) .phomi-mega-menu {
		height: auto !important;
		min-height: 0 !important;
		overflow: visible !important;
	}

	.phomi-nav .has-mega-menu--product .phomi-mega-card-group.is-submenu-open .phomi-mega-submenu {
		border-top: 1px solid rgba(255, 255, 255, 0.12);
		display: flex !important;
		left: var(--phomi-mega-padding-x);
		opacity: 1;
		overflow: visible;
		pointer-events: auto;
		position: absolute;
		right: var(--phomi-mega-padding-x);
		top: calc(var(--phomi-mega-padding-y) + var(--phomi-mega-product-card-height) + 12px);
		visibility: visible;
		z-index: 3;
	}

	.phomi-nav .has-mega-menu--product .phomi-mega-card-group.is-submenu-open .phomi-mega-card__chevron {
		transform: rotate(225deg);
	}

	.phomi-nav .has-mega-menu--product .phomi-mega-submenu__label {
		color: rgba(255, 255, 255, 0.45);
		flex: 0 0 clamp(120px, 11vw, 190px);
		font-family: var(--phomi-font);
		font-size: clamp(12px, 0.833333vw, 16px);
		font-weight: 400;
		letter-spacing: 0.08em;
		line-height: 1.35;
		margin: 0;
		/* text-transform: uppercase; */
	}

	.phomi-nav .has-mega-menu--product .phomi-mega-submenu__list {
		display: flex;
		flex: 0 1 auto;
		flex-direction: column;
		gap: clamp(10px, 1.1vw, 18px);
		list-style: none;
		margin: 0;
		min-width: 0;
		padding: 0;
	}

	.phomi-nav .has-mega-menu--product .phomi-mega-submenu__media {
		flex: 0 0 clamp(200px, 16.145833vw, 310px);
		margin-left: auto;
		max-width: 100%;
	}

	.phomi-nav .has-mega-menu--product .phomi-mega-submenu__preview {
		aspect-ratio: 310 / 186;
		display: block;
		height: auto;
		object-fit: cover;
		width: 100%;
	}

	.phomi-nav .has-mega-menu--product .phomi-mega-submenu__list a {
		color: #eeeeee;
		font-family: var(--phomi-font);
		font-size: clamp(16px, 1.25vw, 24px);
		font-weight: 400;
		line-height: 1.25;
		text-decoration: none;
		transition: color 0.2s ease;
	}

	.phomi-nav .has-mega-menu--product .phomi-mega-submenu__list a:hover,
	.phomi-nav .has-mega-menu--product .phomi-mega-submenu__list a:focus-visible {
		color: var(--phomi-blue, #70c7d1);
		outline: none;
	}
}

.phomi-menu-scrim,
.phomi-header.is-mega-active:has(.has-mega-menu--case.is-mega-open) ~ .phomi-menu-scrim,
.phomi-header.is-mega-active:has(.has-mega-menu--about.is-mega-open) ~ .phomi-menu-scrim,
.phomi-header.is-mega-active:has(.has-mega-menu--product.is-mega-open) ~ .phomi-menu-scrim,
.phomi-header.is-mega-active:has(.has-mega-menu--technology.is-mega-open) ~ .phomi-menu-scrim,
.phomi-header.is-mega-active:has(.has-mega-menu--application.is-mega-open) ~ .phomi-menu-scrim,
.phomi-header.is-mega-active:has(.has-mega-menu--partner.is-mega-open) ~ .phomi-menu-scrim,
.phomi-header:has(.has-mega-menu--case:hover) ~ .phomi-menu-scrim,
.phomi-header:has(.has-mega-menu--case:focus-within) ~ .phomi-menu-scrim,
.phomi-header:has(.has-mega-menu--product:hover) ~ .phomi-menu-scrim,
.phomi-header:has(.has-mega-menu--product:focus-within) ~ .phomi-menu-scrim,
.phomi-header:has(.has-mega-menu--technology:hover) ~ .phomi-menu-scrim,
.phomi-header:has(.has-mega-menu--technology:focus-within) ~ .phomi-menu-scrim,
.phomi-header:has(.has-mega-menu--application:hover) ~ .phomi-menu-scrim,
.phomi-header:has(.has-mega-menu--application:focus-within) ~ .phomi-menu-scrim,
.phomi-header:has(.has-mega-menu--partner:hover) ~ .phomi-menu-scrim,
.phomi-header:has(.has-mega-menu--partner:focus-within) ~ .phomi-menu-scrim {
	top: var(--phomi-scrim-top) !important;
}

@media (max-width: 1100px) {
	:root {
		--phomi-mega-card-width: clamp(210px, 27vw, 260px);
		--phomi-mega-padding-x: 32px;
	}
}

@media (max-width: 767px) {
	.phomi-menu-scrim {
		display: none !important;
	}
}
