/* =============================================================
   Alture - Base (design tokens, reset, typography, layout)
   ============================================================= */

:root {
	/* Palette */
	--al-black: #000000;
	--al-grey-900: #0a0a0a;
	--al-grey-800: #0f0f0f;
	--al-grey-700: #171717;
	--al-grey-600: #292929;
	--al-grey-500: #4d4d4d;
	--al-grey-400: #666666;
	--al-grey-300: #707070;
	--al-grey-200: #b6b6b6;
	--al-grey-100: #dddddd;
	--al-grey-50: #f1efed;
	--al-paper: #f8f7f3;
	--al-white: #ffffff;
	--al-accent: #f3350c;

	/* Alpha */
	--al-w-10: rgba(255,255,255,.1);
	--al-w-15: rgba(255,255,255,.15);
	--al-w-20: rgba(255,255,255,.2);
	--al-w-30: rgba(255,255,255,.3);
	--al-w-50: rgba(255,255,255,.5);
	--al-w-70: rgba(255,255,255,.7);

	/* Typography */
	--al-ff-primary: "Inter", "Helvetica Neue", Arial, sans-serif;
	--al-ff-display: "Inter", "Inter VF", "Helvetica Neue", Arial, sans-serif;
	--al-ff-mono:    "Roboto Mono", ui-monospace, "SFMono-Regular", monospace;

	/* Size scale (desktop) */
	--al-fs-display: clamp(4.5rem, 10vw, 8rem);
	--al-fs-h1:      clamp(3.5rem, 8vw, 6rem);
	--al-fs-h2:      clamp(2.5rem, 6vw, 4.5rem);
	--al-fs-h3:      clamp(2rem, 4.5vw, 3.5rem);
	--al-fs-h4:      clamp(1.5rem, 3.5vw, 2.75rem);
	--al-fs-h5:      clamp(1.25rem, 2.5vw, 2rem);
	--al-fs-h6:      clamp(1.125rem, 1.75vw, 1.5rem);
	--al-fs-body-l:  1.25rem;
	--al-fs-body-m:  1.125rem;
	--al-fs-body:    1rem;
	--al-fs-body-s:  0.875rem;
	--al-fs-label:   0.75rem;

	/* Spacing */
	--al-sp-1: 0.25rem;
	--al-sp-2: 0.5rem;
	--al-sp-3: 0.75rem;
	--al-sp-4: 1rem;
	--al-sp-5: 1.5rem;
	--al-sp-6: 2rem;
	--al-sp-8: 3rem;
	--al-sp-10: 4rem;
	--al-sp-12: 6rem;
	--al-sp-16: 8rem;
	--al-sp-20: 10rem;

	/* Layout */
	--al-container: 90rem; /* 1440px */
	--al-gutter-x:  clamp(1rem, 4vw, 4rem);

	/* Motion */
	--al-ease-out: cubic-bezier(.16,1,.3,1);
	--al-ease-in-out: cubic-bezier(.65,0,.35,1);
}

/* -------------------------------------------------------------
   Reset per pagine Alture (body.alture-theme)
   ------------------------------------------------------------- */
body.alture-theme {
	background: var(--al-paper);
	color: var(--al-grey-900);
	font-family: var(--al-ff-primary);
	font-size: var(--al-fs-body);
	font-weight: 400;
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	margin: 0;
}

body.alture-theme.no-scroll { overflow: hidden; }

body.alture-theme *,
body.alture-theme *::before,
body.alture-theme *::after { box-sizing: border-box; }

body.alture-theme a {
	color: inherit;
	text-decoration: none;
	transition: color .3s var(--al-ease-out);
}
body.alture-theme a:hover { color: var(--al-accent); }

body.alture-theme img,
body.alture-theme video {
	max-width: 100%;
	height: auto;
	display: block;
}

body.alture-theme button {
	font: inherit;
	color: inherit;
	background: none;
	border: 0;
	cursor: pointer;
	padding: 0;
}

/* Selection */
body.alture-theme ::selection {
	background: var(--al-accent);
	color: var(--al-white);
}

/* Scrollbar (webkit) */
body.alture-theme::-webkit-scrollbar { width: 8px; }
body.alture-theme::-webkit-scrollbar-track { background: var(--al-paper); }
body.alture-theme::-webkit-scrollbar-thumb { background: var(--al-grey-200); border-radius: 4px; }

/* -------------------------------------------------------------
   Typography
   ------------------------------------------------------------- */
body.alture-theme h1,
body.alture-theme h2,
body.alture-theme h3,
body.alture-theme h4,
body.alture-theme h5,
body.alture-theme h6 {
	font-family: var(--al-ff-display);
	font-weight: 600;
	letter-spacing: -0.02em;
	margin: 0;
	line-height: 1;
}

.al-display { font-size: var(--al-fs-display); line-height: .85; letter-spacing: -0.035em; font-weight: 600; }
.al-h1 { font-size: var(--al-fs-h1); line-height: .95; }
.al-h2 { font-size: var(--al-fs-h2); line-height: 1.05; }
.al-h3 { font-size: var(--al-fs-h3); line-height: 1; }
.al-h4 { font-size: var(--al-fs-h4); line-height: 1.1; }
.al-h5 { font-size: var(--al-fs-h5); line-height: 1.15; }
.al-h6 { font-size: var(--al-fs-h6); line-height: 1.2; }

.al-text-l  { font-size: var(--al-fs-body-l); line-height: 1.5; }
.al-text-m  { font-size: var(--al-fs-body-m); line-height: 1.5; }
.al-text-s  { font-size: var(--al-fs-body-s); line-height: 1.5; }

.al-label {
	font-family: var(--al-ff-mono);
	font-size: var(--al-fs-label);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	line-height: 1;
	color: var(--al-grey-500);
	display: inline-flex;
	align-items: center;
	gap: .5rem;
}
.al-label::before {
	content: "";
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--al-accent);
	display: inline-block;
}
.al-label.al-label--nodot::before { display: none; }
.al-label.al-label--light { color: var(--al-grey-600); }

.al-mono {
	font-family: var(--al-ff-mono);
	letter-spacing: 0.02em;
}

.al-uppercase { text-transform: uppercase; }
.al-italic    { font-style: italic; }

/* -------------------------------------------------------------
   Layout utilities
   ------------------------------------------------------------- */
.al-container {
	max-width: var(--al-container);
	margin-inline: auto;
	padding-inline: var(--al-gutter-x);
	width: 100%;
}
.al-container--full { max-width: none; padding-inline: var(--al-gutter-x); }
.al-container--sm   { max-width: 60rem; margin-inline: auto; padding-inline: var(--al-gutter-x); }

.al-section {
	padding-block: clamp(4rem, 10vw, 10rem);
	position: relative;
}
.al-section--sm { padding-block: clamp(3rem, 6vw, 6rem); }
.al-section--lg { padding-block: clamp(6rem, 14vw, 14rem); }

.al-line {
	width: 100%;
	height: 1px;
	background: var(--al-w-15);
}
.al-line--dark { background: rgba(0,0,0,.1); }

.al-stack   { display: flex; flex-direction: column; }
.al-row     { display: flex; flex-wrap: wrap; }
.al-grid    { display: grid; }

.al-gap-2 { gap: var(--al-sp-2); }
.al-gap-4 { gap: var(--al-sp-4); }
.al-gap-6 { gap: var(--al-sp-6); }
.al-gap-8 { gap: var(--al-sp-8); }
.al-gap-10 { gap: var(--al-sp-10); }

.al-text-center { text-align: center; }
.al-text-right  { text-align: right; }

.al-hide-desk { display: none; }
@media (max-width: 991px) {
	.al-hide-tab { display: none; }
	.al-hide-desk { display: initial; }
}
@media (max-width: 767px) {
	.al-hide-mob { display: none; }
}

/* Sezione light / dark switch (light è ora default) */
.al-section--light {
	background: var(--al-paper);
	color: var(--al-grey-900);
}
.al-section--light .al-label { color: var(--al-grey-500); }

.al-section--dark {
	background: var(--al-grey-900);
	color: var(--al-white);
}
.al-section--dark .al-label { color: var(--al-grey-200); }
.al-section--dark a { color: var(--al-white); }

/* Video utility */
.al-video-cover {
	position: relative;
	width: 100%;
	overflow: hidden;
	background: var(--al-black);
	aspect-ratio: 16/9;
}
.al-video-cover video {
	width: 100%;
	height: 100%;
	object-fit: cover;
}