@import url('homepage-restyling-clean.css');
@import url('chi-siamo.css');
@import url('green-tools.css');
@import url('news.css');
@import url('contatti.css');

:root {
	--reveal-distance: 28px;
	--reveal-duration: 700ms;
	--reveal-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
}

html.has-js .reveal-on-scroll,
html.has-js .reveal-stagger > * {
	opacity: 0;
	transform: translateY(var(--reveal-distance));
	transition:
		opacity var(--reveal-duration) var(--reveal-ease),
		transform var(--reveal-duration) var(--reveal-ease);
	will-change: opacity, transform;
}

html.has-js .reveal-on-scroll.is-visible,
html.has-js .reveal-stagger > *.is-visible {
	opacity: 1;
	transform: none;
}

html.has-js .reveal-stagger > *:nth-child(2) { transition-delay: 90ms; }
html.has-js .reveal-stagger > *:nth-child(3) { transition-delay: 180ms; }
html.has-js .reveal-stagger > *:nth-child(4) { transition-delay: 270ms; }
html.has-js .reveal-stagger > *:nth-child(5) { transition-delay: 360ms; }
html.has-js .reveal-stagger > *:nth-child(6) { transition-delay: 450ms; }

.news-card:nth-child(3) {
	transition-delay: 180ms;
}

.site-footer {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.25rem;
	padding: clamp(1.6rem, 4vw, 2.6rem) clamp(1.2rem, 4vw, 3rem);
	background: #d9d9d9;
	color: var(--white);
}

.site-footer p {
	margin: 0.45rem 0 0;
	color: rgba(5, 7, 5, 0.72);
}

.site-footer strong {
	color: var(--black);
}

.site-footer__credits {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 0.5rem 0.75rem;
	padding: 1rem 1.2rem;
	background: #073b00;
	color: rgba(255, 255, 255, 0.82);
	font-size: 0.85rem;
	text-align: center;
}

.site-footer__socials {
	display: flex;
	align-items: center;
	justify-content: center;
	justify-self: center;
	width: 100%;
	gap: 0.75rem;
	flex-wrap: wrap;
	min-height: 100%;
}

.site-footer__social-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.8rem;
	height: 2.8rem;
	border: 1px solid rgba(5, 7, 5, 0.16);
	color: var(--black);
	border-radius: 0;
}

.site-footer__social-link svg {
	width: 1.15rem;
	height: 1.15rem;
	fill: currentColor;
	stroke: currentColor;
}

@media (max-width: 1200px) {
	.section--cards-right {
		padding: clamp(2rem, 4vw, 3rem) clamp(1.2rem, 4vw, 2rem);
	}

	.section--cards-right .section__heading {
		grid-column: auto;
		grid-row: auto;
		text-align: left;
		justify-self: start;
	}

	.site-footer {
		grid-template-columns: 1fr 1fr;
	}

	.site-footer > :first-child {
		grid-column: 1 / -1;
	}
}

@media (max-width: 980px) {
	.site-header {
		flex-wrap: wrap;
		padding: 0.9rem 1rem;
	}

	.menu-toggle {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
		gap: 0.32rem;
		width: 2.7rem;
		height: 2.7rem;
		padding: 0;
		border: 1px solid rgba(255, 255, 255, 0.35);
		background: rgba(255, 255, 255, 0.08);
		color: var(--white);
		cursor: pointer;
		border-radius: 0;
	}

	.menu-toggle span {
		display: block;
		width: 1.35rem;
		height: 2px;
		background: currentColor;
		border-radius: 999px;
		transition: transform 0.25s ease, opacity 0.25s ease;
	}

	.menu-toggle.is-open,
	.menu-toggle.active {
		background: #073b00;
		border-color: #073b00;
		color: var(--white);
	}

	.menu-toggle.is-open span:nth-child(1),
	.menu-toggle.active span:nth-child(1) {
		transform: translateY(0.45rem) rotate(45deg);
	}

	.menu-toggle.is-open span:nth-child(2),
	.menu-toggle.active span:nth-child(2) {
		opacity: 0;
	}

	.menu-toggle.is-open span:nth-child(3),
	.menu-toggle.active span:nth-child(3) {
		transform: translateY(-0.45rem) rotate(-45deg);
	}

	.site-nav {
		position: fixed;
		top: 4.5rem;
		right: 0;
		bottom: 0;
		z-index: 45;
		width: min(101vw, 33rem);
		display: block;
		padding: 0;
		background: rgba(255, 255, 255, 0.98);
		border-left: 1px solid rgba(7, 59, 0, 0.12);
		box-shadow: -18px 0 30px rgba(0, 0, 0, 0.18);
		opacity: 0;
		pointer-events: none;
		transform: translateX(105%);
		transition: opacity 0.25s ease, transform 0.25s ease;
	}

	.site-nav.is-open {
		opacity: 1;
		pointer-events: auto;
		transform: translateX(0);
		padding-top: 0;
	}

	.site-nav__list {
		display: flex;
		flex-direction: column;
		align-items: stretch;
		gap: 0;
		padding: 0.5rem 1.1rem 1.4rem;
		background: #f9f9f7;
		border: 0;
		box-shadow: none;
	}

	.site-nav__list li {
		width: 100%;
		border-bottom: 1px solid rgba(7, 59, 0, 0.08);
	}

	.site-nav__list a {
		display: block;
		padding: 1rem 0.6rem;
		border-radius: 0;
		font-size: clamp(1.05rem, 4vw, 1.5rem);
		letter-spacing: 0;
		text-transform: none;
		font-weight: 400;
		color: var(--black);
	}

	.site-nav__list a::after {
		display: none;
	}

	.three-columns,
	.news-grid,
	.page-stats,
	.story-grid,
	.contatti-layout,
	.green-tools-grid {
		grid-template-columns: 1fr;
	}

	.image-mosaic,
	.company-gallery {
		grid-template-columns: 1fr;
		column-count: 1;
	}

	.image-mosaic {
		grid-template-rows: none;
		min-height: auto;
	}

	.image-mosaic__item {
		grid-column: auto;
		grid-row: auto;
		aspect-ratio: 16 / 10;
	}

	.page-hero,
	.page-hero--contatti,
	.page-hero--news,
	.page-hero--green-tools,
	.hero {
		min-height: 35vh;
	}

	.site-main,
	.chi-siamo-main,
	.contatti-main,
	.green-tools-main,
	.news-main {
		padding-top: 4rem;
	}

	.contatti-map iframe {
		height: 320px;
	}

	.site-footer {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 640px) {
	html {
		font-size: 15px;
	}

	.site-header {
		align-items: flex-start;
	}

	.site-logo img {
		width: 128px;
	}

	.menu-toggle {
		font-size: 0.68rem;
		letter-spacing: 0.14em;
		padding: 0.7rem 0.8rem;
	}

	.hero__content,
	.page-hero__content,
	.page-hero--contatti .page-hero__content,
	.page-hero--green-tools .page-hero__content,
	.page-hero--news .page-hero__content {
		padding-inline: 1rem;
	}

	.section {
		padding-inline: 1rem;
	}

	.section__heading h2,
	.page-hero h1,
	.page-hero--contatti h1,
	.page-hero--green-tools h1,
	.page-hero--news h1 {
		max-width: 100%;
	}

	.section--cards-right {
		padding-inline: 1rem;
	}

	.contact-form__grid {
		grid-template-columns: 1fr;
	}

	.contact-form__actions {
		justify-content: stretch;
	}

	.contact-submit {
		width: 100%;
	}

	.contatti-map iframe {
		height: 260px;
	}
}

html.has-js .site-header,
html.has-js .site-footer,
html.has-js .site-footer__credits {
	animation: fade-slide-in 700ms var(--reveal-ease) both;
}

html.has-js .site-main > * {
	animation: fade-slide-in 700ms var(--reveal-ease) both;
}

html.has-js .site-main > *:nth-child(2) { animation-delay: 80ms; }
html.has-js .site-main > *:nth-child(3) { animation-delay: 160ms; }
html.has-js .site-main > *:nth-child(4) { animation-delay: 240ms; }
html.has-js .site-main > *:nth-child(5) { animation-delay: 320ms; }

html.has-js .page-hero__content,
html.has-js .hero__content {
	animation: fade-slide-in 900ms var(--reveal-ease) both;
}

html.has-js .page-hero__overlay,
html.has-js .hero__overlay {
	animation: gentle-scale 1200ms ease-out both;
}

html.has-js .site-nav a,
html.has-js .site-footer a,
html.has-js .site-footer__social-link,
html.has-js .contact-submit,
html.has-js .menu-toggle {
	transition: transform 180ms ease, opacity 180ms ease, background-color 180ms ease, color 180ms ease, border-color 180ms ease;
}

html.has-js .site-nav a:hover,
html.has-js .site-nav a:focus-visible,
html.has-js .site-footer a:hover,
html.has-js .site-footer a:focus-visible,
html.has-js .site-footer__social-link:hover,
html.has-js .site-footer__social-link:focus-visible,
html.has-js .contact-submit:hover,
html.has-js .contact-submit:focus-visible,
html.has-js .menu-toggle:hover,
html.has-js .menu-toggle:focus-visible {
	transform: translateY(-2px);
}

html.has-js .image-mosaic__item.is-visible,
html.has-js .news-card.is-visible,
html.has-js .story-card.is-visible,
html.has-js .company-gallery__item.is-visible,
html.has-js .info-card.is-visible,
html.has-js .contact-info-block.is-visible,
html.has-js .contatti-form-panel.is-visible,
html.has-js .contatti-info-panel.is-visible {
	animation: fade-slide-in 700ms var(--reveal-ease) both;
}

@keyframes fade-slide-in {
	from {
		opacity: 0;
		transform: translateY(var(--reveal-distance));
	}
	to {
		opacity: 1;
		transform: none;
	}
}

@keyframes gentle-scale {
	from {
		opacity: 0;
		transform: scale(1.04);
	}
	to {
		opacity: 1;
		transform: scale(1);
	}
}

@media (prefers-reduced-motion: reduce) {
	html.has-js .reveal-on-scroll,
	html.has-js .reveal-stagger > *,
	html.has-js .site-header,
	html.has-js .site-footer,
	html.has-js .site-footer__credits,
	html.has-js .site-main > *,
	html.has-js .page-hero__content,
	html.has-js .hero__content,
	html.has-js .page-hero__overlay,
	html.has-js .hero__overlay,
	html.has-js .image-mosaic__item.is-visible,
	html.has-js .news-card.is-visible,
	html.has-js .story-card.is-visible,
	html.has-js .company-gallery__item.is-visible,
	html.has-js .info-card.is-visible,
	html.has-js .contact-info-block.is-visible,
	html.has-js .contatti-form-panel.is-visible,
	html.has-js .contatti-info-panel.is-visible {
		opacity: 1;
		transform: none;
		animation: none;
		transition: none;
	}

	html.has-js .site-nav a,
	html.has-js .site-footer a,
	html.has-js .site-footer__social-link,
	html.has-js .contact-submit,
	html.has-js .menu-toggle {
		transition: none;
	}
}