/**
 * Hero: zaokrąglona karta ze zdjęciem (tło bloku Grupa) i granatowym
 * przyciemnieniem 50%. Wypełnia ekran (min. 600 px). Na górze zostawia
 * miejsce na header nałożony na kartę (44 px + odstęp).
 */

.aries-hero-section {
	--aries-hero-pad: var(--wp--style--root--padding-left, 24px);
	--aries-hero-gap: var(--wp--preset--spacing--32);

	padding: var(--aries-hero-pad);
}

.aries-hero {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	box-sizing: border-box;
	min-height: max(600px, calc(100svh - 2 * var(--aries-hero-pad)));
	padding: calc(var(--aries-hero-pad) + 44px + var(--aries-hero-gap)) var(--aries-hero-pad) var(--wp--preset--spacing--60);
	overflow: hidden;
	background-color: var(--wp--custom--color--bg--inverse);
	background-position: center;
	background-size: cover;
	border-radius: var(--wp--custom--radius--30);
	color: var(--wp--custom--color--text--inverse);
}

body.admin-bar .aries-hero {
	min-height: max(600px, calc(100svh - 2 * var(--aries-hero-pad) - var(--wp-admin--admin-bar--height, 0px)));
}

/* Przyciemnienie bg/overlay (granat 50%) */
.aries-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--wp--custom--color--bg--overlay);
}

.aries-hero > * {
	position: relative;
}

/* Nagłówki na ciemnym tle przyjmują kolor otoczenia */
.is-dark :is(h1, h2, h3, h4, h5, h6) {
	color: inherit;
}

/* Treść: na desktopie tekst po lewej, tytuł po prawej, wyrównane do dołu */
.aries-hero__content {
	display: flex;
	flex-direction: row-reverse;
	align-items: flex-end;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--64);
}

.aries-hero__title {
	flex: 0 1 783px;
	margin: 0;
}

.aries-hero__intro {
	display: flex;
	flex: 0 1 497px;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--wp--preset--spacing--24);
}

.aries-hero__intro p {
	margin: 0;
}

.aries-hero__intro .wp-block-buttons {
	margin: 0;
}

/* Tablet i telefon: tytuł nad tekstem */
@media (max-width: 1023px) {
	.aries-hero__content {
		flex-direction: column;
		align-items: stretch;
	}

	.aries-hero__title,
	.aries-hero__intro {
		flex-basis: auto;
	}
}

/* Telefon: większy odstęp pod headerem, przycisk na całą szerokość */
@media (max-width: 767px) {
	.aries-hero-section {
		--aries-hero-gap: var(--wp--preset--spacing--48);
	}

	.aries-hero__intro {
		align-items: stretch;
	}

	/* Przycisk: szerokość wg treści, do lewej (#015) */
}

/* Domyślne zdjęcie hero strony głównej. Zdjęcie ustawione w edytorze (styl inline) ma pierwszeństwo. */
.aries-hero--home {
	background-image: url("../images/hero-home.webp");
	background-position: 50% 67%;
}

/* --- Wariant wyśrodkowany (podstrony): tytuł, tekst i strzałka w dół na środku karty --- */
.aries-hero--center {
	justify-content: center;
}

.aries-hero--center .aries-hero__content {
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: var(--wp--preset--spacing--24);
	text-align: center;
}

.aries-hero--center .aries-hero__title {
	flex: none;
	max-width: 888px;
}

.aries-hero--center .aries-hero__lead {
	max-width: 660px;
	margin: 0;
}

/* Strzałka „przewiń w dół”: kółko 44 px z obwódką, jak strzałki sliderów */
.aries-scroll-down {
	--aries-icon-arrow-down: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='14' viewBox='0 0 13 14'%3E%3Cpath fill='white' transform='matrix(0 1 -1 0 13 0)' d='M10.9438 7.36292L0.898876 7.36292C0.644195 7.36292 0.430712 7.28076 0.258427 7.11643C0.0861423 6.95211 0 6.74849 0 6.50557C0 6.26266 0.0861423 6.05904 0.258427 5.89471C0.430712 5.73038 0.644195 5.64822 0.898876 5.64822L10.9438 5.64822L6.53933 1.44721C6.35955 1.27574 6.27341 1.07569 6.2809 0.847062C6.28839 0.618435 6.38202 0.418387 6.5618 0.246917C6.74157 0.089736 6.95131 0.00757326 7.19101 0.000428675C7.43071 -0.00671591 7.64045 0.0754468 7.82022 0.246917L13.7528 5.90543C13.8427 5.99116 13.9064 6.08404 13.9438 6.18407C13.9813 6.28409 14 6.39126 14 6.50557C14 6.61989 13.9813 6.72705 13.9438 6.82708C13.9064 6.9271 13.8427 7.01998 13.7528 7.10572L7.82022 12.7642C7.65543 12.9214 7.44944 13 7.20225 13C6.95506 13 6.74157 12.9214 6.5618 12.7642C6.38202 12.5928 6.29213 12.3891 6.29213 12.1534C6.29213 11.9176 6.38202 11.714 6.5618 11.5425L10.9438 7.36292Z'/%3E%3C/svg%3E");

	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	box-sizing: border-box;
	color: inherit;
	/* Obrys do środka jak w Figmie: 2 px, hover 3 px (#006) */
	border: 0;
	box-shadow: inset 0 0 0 2px currentColor;
	border-radius: var(--wp--custom--radius--full);
	transition: box-shadow var(--aries-hover-duration) var(--aries-hover-ease);
}

.aries-scroll-down::before {
	/* Strzałka w dół narysowana wprost (ta sama ikona co --aries-icon-arrow, obrócona w samym SVG).
	   Bez transform: rotate – obrót maski zostawiał przy krawędzi pionową kreskę 1 px (#012).
	   Pole 14×14 px: równe położenie w kole 44 px, bez połówek piksela. */
	content: "";
	width: 14px;
	height: 14px;
	background-color: currentColor;
	-webkit-mask: var(--aries-icon-arrow-down) center / 13px 14px no-repeat;
	mask: var(--aries-icon-arrow-down) center / 13px 14px no-repeat;
}

.aries-scroll-down:hover {
	box-shadow: inset 0 0 0 3px currentColor;
}

.aries-scroll-down:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
	.aries-scroll-down {
		transition: none;
	}
}

/* Domyślne zdjęcie hero „Jak działamy” */
.aries-hero--how-we-work {
	background-image: url("../images/hero-how-we-work.webp");
	background-position: center;
}

/* Domyślne zdjęcie hero „O nas” */
.aries-hero--about {
	background-image: url("../images/hero-about.webp");
	background-position: center;
}

/* Domyślne zdjęcie hero listy realizacji (kadr jak w Figmie) */
.aries-hero--case-studies {
	background-image: url("../images/hero-case-studies.webp");
	background-position: 50% 73%;
}

/* Domyślne zdjęcie hero Aktualności */
.aries-hero--news {
	background-image: url("../images/hero-news.webp");
	background-position: center;
}

/* --- Hero Kontakt: formularz po lewej, tytuł po prawej --- */
.aries-hero--contact {
	justify-content: center;
	background-image: url("../images/hero-case-studies.webp");
	background-position: 50% 75%;
}

.aries-hero.aries-hero--contact .aries-hero__content {
	flex-direction: row-reverse;
	align-items: center;
	justify-content: flex-end;
	gap: var(--wp--preset--spacing--64);
}

.aries-hero--contact .aries-hero__title {
	flex: 1 1 0;
	min-width: 0;
	margin: 0;
}

/* Karta formularza: jasne tło, ciemny tekst (wyjątek w ciemnym hero) */
.aries-contact-card {
	display: flex;
	flex: 0 0 398px;
	flex-direction: column;
	gap: var(--wp--preset--spacing--24);
	box-sizing: border-box;
	padding: var(--wp--preset--spacing--24);
	background: var(--wp--custom--color--bg--primary);
	border-radius: var(--wp--custom--radius--30);
	color: var(--wp--custom--color--text--primary);
	font-size: var(--wp--preset--font-size--body-s);
	line-height: 1.2;
}

.aries-hero .aries-contact-card > *,
.aries-hero .aries-contact-card .wpcf7 {
	margin: 0;
}

.aries-hero .aries-contact-card :is(.wp-block-button .wp-block-button__link, .aries-button) {
	--aries-btn-text: var(--wp--custom--color--text--primary);
	--aries-btn-focus: var(--wp--custom--color--border--primary);
}

/* Od 1440 px wzwyż: szersza karta formularza (480 px przy 1440, rośnie z ekranem, maks. 640 px) */
@media (min-width: 1440px) {
	.aries-contact-card {
		flex-basis: clamp(480px, 33.34vw, 640px);
	}
}

/* Tablet i telefon: tytuł nad formularzem, formularz na całą szerokość */
@media (max-width: 1023px) {
	.aries-hero.aries-hero--contact .aries-hero__content {
		flex-direction: column;
		align-items: stretch;
		gap: var(--wp--preset--spacing--64);
	}

	.aries-contact-card {
		flex-basis: auto;
	}
}

@media (max-width: 767px) {
	.aries-contact-card {
		padding: var(--wp--preset--spacing--16);
	}
}

/* Domyślne zdjęcia: 404 (kadr jak w Figmie) i Dziękujemy */
.aries-hero--404 {
	background-image: url("../images/hero-404.webp");
	background-position: 50% 73%;
}

.aries-hero--thank-you {
	background-image: url("../images/hero-about.webp");
	background-position: center;
}

.aries-hero--center .wp-block-buttons {
	margin: 0;
}

/* Telefon: przycisk wg treści, wyśrodkowany razem z tytułem i tekstem (#015) */

/* --- Strona „Wkrótce”: bez headera, logo i tytuł na środku karty --- */
.aries-hero.aries-hero--soon {
	padding: var(--aries-hero-pad);
	background-image: url("../images/hero-how-we-work.webp");
	background-position: center;
}

.aries-hero--soon .aries-hero__content {
	gap: var(--wp--preset--spacing--48);
}

.aries-hero--soon .aries-hero__content > * {
	margin: 0;
}

/* Logo: 251 px na desktopie, 173 px na telefonie (jak w Figmie) */
.aries-soon__logo {
	width: clamp(173px, calc(173px + (100vw - 390px) * 0.07429), 251px);
	color: var(--wp--custom--color--icon--inverse);
	line-height: 0;
}

.aries-soon__logo svg {
	display: block;
	width: 100%;
	height: auto;
}

/* Strona „Wkrótce” ma pełną wysokość ekranu (bez paska admina, bo widzą ją tylko niezalogowani) */
body.aries-coming-soon {
	margin: 0;
}
