/* Manutenzione Contoforte - stile ispirato a www.contoforte.it */

*,
*::before,
*::after {
	box-sizing: border-box;
}

:root {
	--blu: #1055fa;
	--blu-scuro: #0a2a5e;
	--azzurro: #00a3e0;
	--testo: #1d2a3d;
	--grigio: #5b6778;
	--sfondo: #f4f7fc;
}

body {
	margin: 0;
	font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
	color: var(--testo);
	background: var(--sfondo);
	line-height: 1.6;
	min-height: 100vh;
	display: flex;
	flex-direction: column;
}

a {
	color: var(--blu);
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

.container {
	width: 100%;
	max-width: 1140px;
	margin: 0 auto;
	padding: 0 16px;
}

/* Header */
.site-header {
	background: #fff;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
	position: sticky;
	top: 0;
	z-index: 10;
}

.header-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: 80px;
}

.logo img {
	height: 40px;
	width: auto;
	display: block;
}

.top-links {
	display: flex;
	align-items: center;
	gap: 16px;
	font-size: 15px;
	font-weight: 600;
}

.top-links a {
	color: var(--blu-scuro);
}

.btn-azzurro {
	background: var(--azzurro);
	color: #fff !important;
	padding: 8px 16px;
	border-radius: 30px;
}

/* Main */
.main {
	flex: 1;
	padding: 60px 0;
}

.card {
	background: #fff;
	max-width: 760px;
	margin: 0 auto;
	padding: 48px 40px;
	border-radius: 16px;
	box-shadow: 0 10px 30px rgba(16, 85, 250, 0.12);
	text-align: center;
}

.icon {
	color: var(--blu);
	margin-bottom: 16px;
}

h1 {
	font-size: 36px;
	font-weight: 700;
	color: var(--blu-scuro);
	margin: 0 0 20px;
}

.lead {
	font-size: 18px;
	color: var(--testo);
}

hr {
	border: 0;
	height: 1px;
	background: #e1e7f2;
	margin: 28px auto;
	width: 80%;
}

p {
	font-size: 17px;
	color: var(--grigio);
	margin: 0;
}

.card p a {
	color: var(--blu);
}

.actions {
	margin-top: 32px;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 16px;
}

.btn {
	display: inline-block;
	padding: 14px 28px;
	border-radius: 30px;
	font-weight: 700;
	font-size: 15px;
	text-transform: uppercase;
	letter-spacing: 0.3px;
	transition: background 0.2s, color 0.2s;
}

.btn:hover {
	text-decoration: none;
}

.btn-blu {
	background: var(--blu);
	color: #fff;
}

.btn-blu:hover {
	background: var(--blu-scuro);
	color: #fff;
}

.btn-outline {
	border: 2px solid var(--blu);
	color: var(--blu);
}

.btn-outline:hover {
	background: var(--blu);
	color: #fff;
}

/* Footer */
.site-footer {
	--footer-angle: clamp(80px, 15vw, 216px);
	background: var(--blu);
	color: #fff;
	clip-path: polygon(0 var(--footer-angle), 100% 0, 100% 100%, 0 100%);
	padding: var(--footer-angle) 0 32px;
	font-size: 14px;
}

.footer-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
	column-gap: clamp(40px, 7vw, 100px);
	row-gap: 32px;
}

.footer-brand > p,
.footer-menu p {
	color: #fff;
	font-size: 14px;
	line-height: 1.55;
	margin: 18px 0 28px;
}

.site-footer strong {
	color: #fff;
}

.site-footer a {
	color: #fff;
}

.footer-logo {
	display: block;
	width: auto;
	max-width: 100%;
	height: 38px;
	margin-bottom: 18px;
	object-fit: contain;
}

.footer-apps h3 {
	color: #fff;
	font-size: 14px;
	font-weight: 700;
	text-transform: uppercase;
	margin: 0 0 14px;
}

.footer-navigation {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	align-content: start;
	gap: 36px 32px;
}

.footer-menu-legal {
	grid-column: 2;
}

.footer-menu summary {
	color: #fff;
	cursor: pointer;
	font-size: 20px;
	font-weight: 700;
	list-style: none;
	margin-bottom: 16px;
}

.footer-menu summary::-webkit-details-marker {
	display: none;
}

.footer-menu ul {
	list-style: none;
	padding: 0;
	margin: 0 0 14px;
}

.footer-menu li {
	margin: 0 0 8px;
}

.footer-menu a:hover,
.footer-cookie-link:hover {
	text-decoration: underline;
}

.footer-menu p {
	margin: 14px 0 0;
}

.badges {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px;
}

.badges img {
	max-width: 100%;
	height: auto;
	display: block;
}

.footer-cookie-link {
	grid-column: 1 / -1;
	justify-self: start;
	background: rgba(0, 0, 0, 0.18);
	border-radius: 4px;
	font-size: 12px;
	padding: 8px 14px;
	text-transform: uppercase;
}

@media (max-width: 768px) {
	.site-footer {
		clip-path: none;
		padding: 24px 0 28px;
	}

	.footer-grid {
		grid-template-columns: 1fr;
		gap: 28px;
	}

	.footer-brand > p {
		margin: 0 0 28px;
	}

	.footer-navigation {
		grid-template-columns: 1fr;
		gap: 0;
	}

	.footer-menu-legal {
		grid-column: auto;
	}

	.footer-menu summary {
		position: relative;
		font-size: 24px;
		margin: 0;
		padding: 12px 36px 12px 0;
	}

	.footer-menu summary::after {
		content: "";
		position: absolute;
		top: 19px;
		right: 4px;
		width: 10px;
		height: 10px;
		border-right: 3px solid currentColor;
		border-bottom: 3px solid currentColor;
		transform: rotate(45deg);
		transition: transform 0.2s;
	}

	.footer-menu[open] summary::after {
		transform: rotate(225deg);
	}

	.footer-menu[open] summary {
		margin-bottom: 12px;
	}

	.footer-menu ul,
	.footer-menu p {
		margin: 0 0 16px;
	}

	.footer-cookie-link {
		grid-column: auto;
	}

	h1 {
		font-size: 28px;
	}

	.card {
		padding: 32px 22px;
	}

	.top-links a:not(.btn-azzurro) {
		display: none;
	}
}