/* netDesk.IT - layout a flusso per smartphone e tablet (fino a 879px)
   Fino a 879px la grafica a posizioni fisse viene nascosta e al suo posto
   compare questo layout (.tb), con testo a 16px e immagini a tutta larghezza.
   Dagli 880px in su resta la versione desktop. */

.tb { display: none; }

@media screen and (max-width: 879px) {
	#xr_xrii { display: none !important; }
	.tb { display: block; }
	html, body { overflow-x: hidden; overflow-x: clip; } /* clip: non annulla l'header sticky */
}

.tb {
	--tb-orange: #E19324;
	--tb-ink: #333333;
	--tb-text: #4d4d4d;
	--tb-dark: #1c1f24;
	font-family: 'Open Sans', Arial, sans-serif;
	font-size: 16px;
	line-height: 1.65;
	color: var(--tb-text);
	text-align: left;
	background: #ffffff;
	-webkit-font-smoothing: antialiased;
}
.tb *, .tb *::before, .tb *::after { box-sizing: border-box; }
.tb h1, .tb h2, .tb h3, .tb p, .tb ul, .tb li, .tb figure { margin: 0; padding: 0; }
.tb ul { list-style: none; }
.tb img { display: block; max-width: 100%; height: auto; border: 0; }
.tb a { color: inherit; text-decoration: none; }
.tb h1, .tb h2, .tb h3 { font-family: 'xr2_Open Sans1', 'Open Sans', Arial, sans-serif; font-weight: bold; color: var(--tb-ink); line-height: 1.25; }
.tb .tb-sym { font-family: Arial, Helvetica, sans-serif; }
.tb .tb-o { color: var(--tb-orange); }

.tb-wrap { max-width: 760px; margin: 0 auto; padding: 0 32px; }
.tb-sec { padding: 56px 0; }

/* ---------- Header ---------- */
.tb-head {
	position: sticky;
	top: 0;
	z-index: 50;
	background: linear-gradient(#3b3b3b, #232323);
	border-bottom: 1px solid #111;
	box-shadow: 0 2px 10px rgba(0, 0, 0, .25);
}
.tb-head .tb-wrap { display: flex; align-items: center; justify-content: space-between; height: 64px; padding: 0 20px; max-width: none; }
.tb-logo img { width: 140px; height: 50px; }
.tb-nav ul { display: flex; height: 64px; }
.tb-nav a {
	display: flex;
	align-items: center;
	height: 100%;
	padding: 0 11px;
	font-size: 12px;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: #d9d9d9;
	transition: background-color .2s ease, color .2s ease;
}
.tb-nav a:hover { color: #ffffff; background: rgba(255, 255, 255, .06); }
.tb-nav a[aria-current="page"] { color: #ffffff; font-weight: bold; background: #161616; }
.tb-burger, #tb-menu { display: none; }

@media screen and (max-width: 759px) {
	.tb-burger {
		display: flex;
		flex-direction: column;
		justify-content: center;
		gap: 5px;
		width: 44px;
		height: 44px;
		padding: 0 10px;
		cursor: pointer;
		border-radius: 6px;
	}
	.tb-burger span { display: block; height: 2px; background: #e6e6e6; border-radius: 2px; transition: transform .25s ease, opacity .25s ease; }
	#tb-menu:checked + .tb-burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
	#tb-menu:checked + .tb-burger span:nth-child(2) { opacity: 0; }
	#tb-menu:checked + .tb-burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
	.tb-nav {
		position: absolute;
		top: 64px;
		left: 0;
		right: 0;
		background: #232323;
		border-top: 1px solid #111;
		box-shadow: 0 10px 20px rgba(0, 0, 0, .3);
		max-height: 0;
		overflow: hidden;
		transition: max-height .3s ease;
	}
	#tb-menu:checked ~ .tb-nav { max-height: 400px; }
	.tb-nav ul { display: block; height: auto; padding: 6px 0; }
	.tb-nav a { height: 48px; padding: 0 28px; font-size: 14px; }
	.tb-nav a[aria-current="page"] { border-left: 3px solid var(--tb-orange); padding-left: 25px; }
}

/* ---------- Hero ---------- */
.tb-hero { position: relative; background: #111 center / cover no-repeat; color: #fff; }
.tb-hero::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0, 0, 0, .7), rgba(0, 0, 0, .35)); }
.tb-hero > * { position: relative; }
.tb-hero--pic::before { display: none; }
.tb-hero--pic img { width: 100%; height: clamp(300px, 54vw, 440px); object-fit: cover; }
.tb-hero h1 { font-family: 'Open Sans Extrabold', 'Open Sans', Arial, sans-serif; font-weight: 800; font-size: 46px; color: #fff; text-shadow: 0 2px 12px rgba(0, 0, 0, .4); }

/* ---------- Home ---------- */
.tb-intro { overflow: hidden; }
.tb-intro + .tb-intro { margin-top: 44px; padding-top: 44px; border-top: 1px solid #ececec; }
.tb-intro img { float: left; width: 44%; margin: 4px 26px 12px 0; border-radius: 4px; box-shadow: 0 6px 18px rgba(0, 0, 0, .12); }
.tb-intro h2 { font-size: 23px; margin-bottom: 10px; }
.tb-intro p { font-size: 16px; }

.tb-lead { text-align: center; }
.tb-lead h2 { font-family: 'Open Sans', Arial, sans-serif; font-weight: normal; font-size: 31px; color: var(--tb-ink); }
.tb-lead h3 { font-size: 18px; margin: 10px 0 16px; color: #444; }
.tb-lead p { max-width: 600px; margin: 0 auto; font-size: 16px; }

.tb-band { position: relative; background: #0b1418 center / cover no-repeat; color: #fff; padding: 64px 0; }
.tb-band::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(5, 12, 16, .82), rgba(5, 12, 16, .45)); }
.tb-band > * { position: relative; }
.tb-band h2 { color: #fff; font-size: 36px; }
.tb-band h3 { color: #fff; font-size: 22px; margin: 4px 0 22px; }
.tb-band p { font-family: 'xr2_Open Sans1', 'Open Sans', Arial, sans-serif; font-weight: bold; font-size: 16px; line-height: 1.7; max-width: 560px; }
.tb-band p + p { margin-top: 10px; }

.tb-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 40px 28px; }
.tb-card img { width: 100%; aspect-ratio: 295 / 192; object-fit: cover; border-radius: 4px; box-shadow: 0 6px 18px rgba(0, 0, 0, .12); }
.tb-card h3 { font-size: 21px; text-align: center; margin: 18px 0 8px; }
.tb-card p { font-size: 16px; }

/* ---------- About ---------- */
.tb-about { padding: 64px 0 60px; }
.tb-about h1 { margin-bottom: 26px; }
.tb-about p { font-size: 16.5px; line-height: 1.7; color: #f2f2f2; padding-left: 20px; border-left: 2px solid rgba(255, 255, 255, .5); }
.tb-about p + p { margin-top: 16px; }

.tb-path { background: #f7f7f7; }
.tb-path-box { background: #22262e center / cover no-repeat; color: #fff; padding: 40px 36px 72px; border-radius: 4px; }
.tb-path-box p { font-size: 16.5px; line-height: 1.7; }
.tb-path img { width: 72%; margin: -44px 0 0 auto; border-radius: 4px; box-shadow: 0 12px 30px rgba(0, 0, 0, .3); }

.tb-why { background: #000 center / cover no-repeat; color: #fff; text-align: center; }
.tb-why h2 { color: #fff; font-size: 32px; }
.tb-why > .tb-wrap > p { max-width: 580px; margin: 12px auto 0; font-size: 16px; color: #e6e6e6; }
.tb-feat { display: grid; grid-template-columns: 1fr 1fr; gap: 40px 32px; margin-top: 46px; }
.tb-feat svg { width: 52px; height: 52px; display: block; margin: 0 auto 16px; fill: #fff; }
.tb-feat h3 { color: #fff; font-size: 17px; margin-bottom: 6px; }
.tb-feat p { font-size: 16px; color: #e6e6e6; }

/* ---------- Contatti ---------- */
.tb-chero { padding: 70px 0; }
.tb-chero .tb-wrap { display: grid; grid-template-columns: 1fr 1.15fr; gap: 28px; align-items: center; }
.tb-chero address { font-style: normal; font-size: 15.5px; line-height: 1.6; color: #f0f0f0; padding-left: 20px; border-left: 2px solid rgba(255, 255, 255, .6); }
.tb-chero address strong { font-family: 'xr2_Open Sans1', 'Open Sans', Arial, sans-serif; color: #fff; }
.tb-chero address > span { display: block; }
.tb-chero address .tb-gap { margin-top: 12px; }
.tb-chero address a { border-bottom: 1px solid rgba(225, 147, 36, .6); }

.tb-profile { background: #eee center / cover no-repeat; padding: 70px 0; }
.tb-profile-card { display: flex; max-width: 420px; margin: 0 auto; background: #f4f4f4; border: 1px solid #777; box-shadow: 0 12px 30px rgba(0, 0, 0, .2); }
.tb-profile-card img { width: 50%; aspect-ratio: 1; object-fit: cover; }
.tb-profile-card div { flex: 1; display: flex; flex-direction: column; justify-content: center; text-align: center; padding: 16px; }
.tb-profile-card strong { font-family: 'xr2_Open Sans1', 'Open Sans', Arial, sans-serif; font-size: 18px; color: var(--tb-ink); }
.tb-profile-card span { font-size: 16px; color: #555; }

.tb-split { display: grid; grid-template-columns: 1fr 1fr; }
.tb-split img { width: 100%; height: 100%; min-height: 260px; object-fit: cover; }
.tb-split-txt { display: flex; flex-direction: column; justify-content: center; padding: 36px 32px; background: #15171b center / cover no-repeat; color: #fff; }
.tb-split-txt h2 { color: #fff; font-size: 24px; margin-bottom: 6px; }
.tb-split-txt p { font-size: 16px; }

.tb-where { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; align-items: start; }
.tb-where > a img { width: 100%; border-radius: 4px; box-shadow: 0 6px 18px rgba(0, 0, 0, .12); }
.tb-where h2 { font-size: 22px; }
.tb-where li + li { margin-top: 18px; }
.tb-where p { display: flex; gap: 12px; font-size: 16px; margin-top: 4px; }
.tb-where p svg { flex: 0 0 18px; width: 18px; height: 18px; margin-top: 4px; fill: none; stroke: var(--tb-orange); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.tb-where p a { color: var(--tb-orange); }

@media screen and (max-width: 699px) {
	.tb-chero .tb-wrap, .tb-where { grid-template-columns: 1fr; }
	.tb-split img { min-height: 220px; }
}

/* ---------- Footer (riusa gli stili .ndf) ---------- */
.tb .ndf--t { position: static; width: auto; background: var(--tb-dark); border-top: 3px solid var(--tb-orange); padding: 0; }
.ndf--t .ndf-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 0 28px; padding: 30px 0 12px; }
.ndf--t .ndf-cards > li { border-bottom: 1px solid rgba(255, 255, 255, .08); }
.ndf--t .ndf-cards > li:nth-child(2) { grid-column: 1 / -1; grid-row: 2; border-bottom: 0; }
.ndf--t .ndf-card { padding: 16px 4px; }
.ndf--t .ndf-bar { padding: 20px 0 26px; text-align: center; }

/* ---------- Smartphone (fino a 599px) ---------- */
@media screen and (max-width: 599px) {
	.tb { line-height: 1.6; }
	.tb-wrap { padding: 0 20px; }
	.tb-sec { padding: 40px 0; }
	.tb-head .tb-wrap { height: 56px; padding: 0 12px 0 16px; }
	.tb-logo img { width: 118px; height: 42px; }
	.tb-nav { top: 56px; }

	.tb-hero h1 { font-size: 36px; }
	.tb-hero--pic img { height: clamp(210px, 58vw, 330px); }

	.tb-intro + .tb-intro { margin-top: 32px; padding-top: 32px; }
	.tb-intro h2 { font-size: 21px; }
	.tb-lead h2 { font-size: 25px; }
	.tb-lead h3 { font-size: 17px; }

	.tb-band { padding: 44px 0; }
	.tb-band h2 { font-size: 29px; }
	.tb-band h3 { font-size: 19px; margin-bottom: 16px; }

	.tb-cards { grid-template-columns: 1fr; gap: 36px; }
	.tb-card h3 { font-size: 20px; margin-top: 14px; }

	.tb-about { padding: 44px 0 40px; }
	.tb-about h1 { margin-bottom: 18px; }
	.tb-about p { font-size: 16px; padding-left: 14px; }
	.tb-path-box { padding: 28px 22px 60px; }
	.tb-path-box p { font-size: 16px; }
	.tb-path img { width: 86%; margin-top: -36px; }
	.tb-why h2 { font-size: 26px; }
	.tb-feat { gap: 32px 20px; margin-top: 34px; }
	.tb-feat svg { width: 44px; height: 44px; margin-bottom: 10px; }
	.tb-feat h3 { font-size: 16px; }

	.tb-chero { padding: 44px 0; }
	.tb-chero .tb-wrap { gap: 18px; }
	.tb-profile { padding: 44px 0; }
	.tb-profile-card strong { font-size: 17px; }
	.tb-lead h2[style] { font-size: 21px !important; }
	.tb-split { grid-template-columns: 1fr; }
	.tb-split img { min-height: 0; height: 52vw; }
	.tb-split-txt { padding: 30px 20px; }

	.ndf--t .ndf-cards { grid-template-columns: 1fr; padding-top: 18px; }
	.ndf--t .ndf-cards > li:nth-child(2) { grid-column: auto; grid-row: auto; border-bottom: 1px solid rgba(255, 255, 255, .08); }
	.ndf--t .ndf-card { padding: 14px 0; }
	.ndf--t .ndf-vl { font-size: 16px; }
	.ndf--t .ndf-copy .ndf-row { display: block; }
	.ndf--t .ndf-sep { display: none; }
}

/* schermi molto stretti: caratteristiche su una colonna */
@media screen and (max-width: 419px) {
	.tb-feat { grid-template-columns: 1fr; }
	.tb-intro img { float: none; width: 100%; margin: 0 0 16px; }
}

/* smartphone: versioni ridotte delle immagini di sfondo grandi */
@media screen and (max-width: 599px) {
	.tb-bg-1069 { background-image: url(1069-1200.webp) !important; }
	.tb-bg-1072 { background-image: url(1072-1200.webp) !important; }
	.tb-bg-558 { background-image: url(558-800.webp) !important; }
}

/* pulsante chat nell'header del layout a flusso */
.tb-head .tb-wrap { gap: 10px; }
.tb-nav { order: 1; margin-left: auto; }
.tb .tb-chat { order: 2; flex: 0 0 auto; width: 38px; height: 38px; padding: 0; font-size: 13px; font-weight: bold; letter-spacing: .03em; }
.tb .tb-chat svg { width: 21px; height: 21px; }
.tb .tb-chat-txt { display: none; }
.tb .tb-burger { order: 3; }
/* 600-759px: menu a hamburger, c'e' spazio anche per l'etichetta */
@media screen and (min-width: 600px) and (max-width: 759px) {
	.tb .tb-chat { width: auto; padding: 0 14px 0 10px; }
	.tb .tb-chat svg { width: 20px; height: 20px; }
	.tb .tb-chat-txt { display: inline; }
}
@media screen and (max-width: 759px) {
	.tb-head .tb-logo { margin-right: auto; }
}

/* contatti: nome con gli stessi colori della versione desktop (net . IT grigi, Desk arancione) */
.tb-chero address .tb-brand { color: #AFAFAF; }
