/* ==========================================================================
   SMART ELITE — tema nero / oro
   Si carica DOPO main.css e ne ridefinisce stile e palette.
   Palette ricavata dai loghi:  nero #0b0b0b · bianco #ffffff · oro #d4af37
   ========================================================================== */

@font-face { font-family: "SE Montserrat"; font-weight: 300; font-display: swap; src: url("../../fonts/montserrat/Montserrat-Light.ttf") format("truetype"); }
@font-face { font-family: "SE Montserrat"; font-weight: 400; font-display: swap; src: url("../../fonts/montserrat/Montserrat-Regular.ttf") format("truetype"); }
@font-face { font-family: "SE Montserrat"; font-weight: 500; font-display: swap; src: url("../../fonts/montserrat/Montserrat-Medium.ttf") format("truetype"); }
@font-face { font-family: "SE Montserrat"; font-weight: 600; font-display: swap; src: url("../../fonts/montserrat/Montserrat-SemiBold.ttf") format("truetype"); }
@font-face { font-family: "SE Montserrat"; font-weight: 700; font-display: swap; src: url("../../fonts/montserrat/Montserrat-Bold.ttf") format("truetype"); }

:root {
	--se-black:   #0b0b0b;
	--se-ink:     #121212;
	--se-card:    #161616;
	--se-line:    rgba(255, 255, 255, 0.09);
	--se-white:   #ffffff;
	--se-muted:   rgba(255, 255, 255, 0.72);
	--se-gold:    #d4af37;
	--se-gold-hi: #e8cd6b;
	--se-gold-lo: #a8872a;
	--se-gold-bg: rgba(212, 175, 55, 0.12);
	--se-radius:  6px;
	--se-ease:    cubic-bezier(.2, .7, .2, 1);
	--se-font:    "SE Montserrat", "Montserrat", "Helvetica Neue", Arial, sans-serif;
}

/* ---------- Base ---------- */
html { scroll-behavior: smooth; }

body, input, select, textarea {
	font-family: var(--se-font);
	font-size: 16px;
	font-weight: 300;
	line-height: 1.8;
	color: var(--se-muted);
}
body { background: var(--se-black); -webkit-font-smoothing: antialiased; }
::selection { background: var(--se-gold); color: var(--se-black); }

h1, h2, h3, h4, h5, h6 {
	font-family: var(--se-font);
	color: var(--se-white);
	font-weight: 600;
	letter-spacing: -0.005em;
}
h2 { font-size: 2.1em; line-height: 1.2; }
h3 { font-size: 1.35em; }
strong, b { color: var(--se-white); font-weight: 600; }

a {
	color: var(--se-gold);
	border-bottom: 1px solid rgba(212, 175, 55, 0.35);
}
a:hover { color: var(--se-gold-hi) !important; border-bottom-color: var(--se-gold-hi); }

/* ---------- Header ---------- */
#header {
	background: rgba(11, 11, 11, 0.82);
	-webkit-backdrop-filter: saturate(140%) blur(14px);
	backdrop-filter: saturate(140%) blur(14px);
	box-shadow: none;
	border-bottom: 1px solid rgba(212, 175, 55, 0.22);
	height: 4.5em;
	line-height: 4.5em;
}
#page-wrapper { padding-top: 4.5em; }
body.landing #page-wrapper { padding-top: 0; }
body.landing #header { background: linear-gradient(180deg, rgba(11,11,11,.85), rgba(11,11,11,0)); border-bottom-color: transparent; -webkit-backdrop-filter: none; backdrop-filter: none; }

#header h1 { left: 1.75em; }
#header h1 a, #titleBar .title a { border: 0; display: inline-flex; align-items: center; gap: .65em; color: var(--se-white); height: 100%; }
#header h1 a:hover { color: var(--se-white) !important; }

.logo-mark { height: 2.15em; width: auto; display: block; flex: none; }
.logo-word {
	font-family: var(--se-font);
	font-weight: 700;
	font-size: 1.15rem;
	letter-spacing: .01em;
	color: var(--se-white);
	line-height: 1;
}
.logo-word em { font-style: normal; font-weight: 300; color: var(--se-gold); }
.logo-word.logo-plant { font-weight: 500; font-size: .95rem; letter-spacing: .02em; }
#header h1 .logo-mark { margin-top: 0; }

#header nav { right: 1.75em; }
#header nav ul li { margin-left: 1.6em; }
#header nav ul li a:not(.button) {
	font-size: .72rem;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: .14em;
	color: rgba(255,255,255,.82);
	border: 0;
	position: relative;
}
#header nav ul li a:not(.button)::after {
	content: ""; position: absolute; left: 0; right: 0; bottom: 1.25em; height: 1px;
	background: var(--se-gold); transform: scaleX(0); transform-origin: left; transition: transform .35s var(--se-ease);
}
#header nav ul li a:not(.button):hover { color: var(--se-gold) !important; }
#header nav ul li a:not(.button):hover::after,
#header nav ul li a.icon.fa-circle-notch::after { transform: scaleX(1); }
#header nav ul li a.fa-circle-notch { color: var(--se-gold); }
#header nav ul li a:not(.button):before { color: var(--se-gold); font-size: .85em; }
#header nav ul li a.button { height: 2.5em; line-height: 2.5em; }

/* dropdown "Prodotti" */
.dropotron {
	background: rgba(14, 14, 14, .96) !important;
	border: 1px solid rgba(212,175,55,.25);
	border-radius: var(--se-radius);
	box-shadow: 0 18px 40px rgba(0,0,0,.6) !important;
	padding: .5em 0 !important;
	-webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
}
.dropotron li { margin: 0 !important; }
.dropotron li a, .dropotron li span {
	border: 0 !important; color: var(--se-muted) !important;
	font-size: .78rem !important; letter-spacing: .04em; text-transform: none !important;
}
.dropotron li:hover > a, .dropotron li:hover > span, .dropotron li.active > a { color: var(--se-gold) !important; background: var(--se-gold-bg) !important; }

/* ---------- Buttons ---------- */
input[type="submit"], input[type="reset"], input[type="button"], .button {
	font-family: var(--se-font);
	font-size: .76rem;
	font-weight: 600;
	letter-spacing: .14em;
	text-transform: uppercase;
	border-radius: 999px;
	height: 3.1em;
	line-height: 3.1em;
	padding: 0 2.4em;
	border-bottom: 0;
	box-shadow: inset 0 0 0 1px rgba(212, 175, 55, .55);
	color: var(--se-white) !important;
	transition: background-color .25s var(--se-ease), color .25s var(--se-ease), box-shadow .25s var(--se-ease), transform .25s var(--se-ease);
}
.button:hover, .button:active, input[type="submit"]:hover, input[type="button"]:hover {
	background-color: var(--se-gold) !important;
	color: var(--se-black) !important;
	box-shadow: 0 8px 22px rgba(212, 175, 55, .28) !important;
	transform: translateY(-1px);
}
.button.primary, input[type="submit"].primary, input[type="button"].primary {
	background: linear-gradient(135deg, var(--se-gold-hi), var(--se-gold) 55%, var(--se-gold-lo));
	color: var(--se-black) !important;
	box-shadow: 0 6px 18px rgba(212, 175, 55, .22);
}
.button.primary:hover, input[type="submit"].primary:hover {
	background: linear-gradient(135deg, #f1da85, var(--se-gold-hi) 55%, var(--se-gold));
	box-shadow: 0 10px 26px rgba(212, 175, 55, .38) !important;
}
#header nav ul li a.button { font-size: .68rem; padding: 0 1.8em; }
.button.icon:before { color: inherit; }

/* ---------- Banner / Hero ---------- */
#banner {
	background-color: var(--se-black);
	box-shadow: none;
	border-bottom: 1px solid rgba(212, 175, 55, .2);
	overflow: hidden;
}
#banner:after {
	background:
		radial-gradient(ellipse 55% 60% at 78% 42%, rgba(212, 175, 55, .20), rgba(212, 175, 55, 0) 62%),
		radial-gradient(ellipse 40% 50% at 8% 95%, rgba(212, 175, 55, .08), rgba(212, 175, 55, 0) 70%),
		linear-gradient(180deg, rgba(11,11,11,.93), rgba(11,11,11,.97)) !important;
}
#banner .content { padding: 7em 4em 6em; max-width: 1200px; }
#banner .content header { text-align: left; max-width: 34em; }
#banner .content header h2 {
	font-size: clamp(3rem, 7vw, 5.6rem);
	font-weight: 700;
	letter-spacing: -.03em;
	line-height: 1;
	color: var(--se-white);
}
#banner .content header h2 em { font-style: normal; font-weight: 300; color: var(--se-gold); letter-spacing: -.02em; }
#banner .content header h3 {
	margin-top: .9em;
	font-size: .78rem; font-weight: 500; letter-spacing: .32em; text-transform: uppercase;
	color: var(--se-gold) !important;
}
#banner .content header h3 em { font-style: normal; }
#banner .content header p {
	margin-top: 2em;
	font-size: 1.12rem; line-height: 1.85; color: rgba(255,255,255,.82);
	padding-left: 1.4em; border-left: 2px solid var(--se-gold);
}
#banner .content header p .fa-seedling { color: var(--se-gold) !important; }
#banner .content .image {
	border-radius: 0;
	width: auto; height: auto;
	margin-left: 5em;
	position: relative;
}
#banner .content .image img {
	border-radius: 0;
	width: clamp(12em, 24vw, 21em);
	height: auto;
	filter: drop-shadow(0 0 38px rgba(212, 175, 55, .30));
	animation: se-float 7s ease-in-out infinite;
}
@keyframes se-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }

.goto-next:before { filter: none; opacity: .9; }
.goto-next { border-bottom: 0; }

/* ---------- Spotlight (sezioni a immagine) ---------- */
.spotlight { box-shadow: none; }
.spotlight:before { background: linear-gradient(180deg, rgba(11,11,11,.25), rgba(11,11,11,.5)); }
.spotlight .content {
	background: rgba(11, 11, 11, .88);
	-webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
	border-color: var(--se-gold) !important;
}
.spotlight.style2 .content { border-color: var(--se-white) !important; }
.spotlight .content header h2 { font-size: 2em; }
.spotlight .content header p { color: var(--se-gold); font-weight: 500; letter-spacing: .08em; text-transform: uppercase; font-size: .78rem; }
.spotlight.bottom .content { border-top-width: 3px; }
.spotlight.left .content, .spotlight.right .content { border-width: 0; }
.spotlight.left .content  { border-right-width: 3px; }
.spotlight.right .content { border-left-width: 3px; }

/* ---------- Sezioni / wrapper ---------- */
.wrapper.style1 { background: var(--se-black); }
.wrapper.style2 { background: linear-gradient(135deg, var(--se-gold-hi), var(--se-gold) 55%, var(--se-gold-lo)); color: var(--se-black); }
.wrapper.style2 h1, .wrapper.style2 h2, .wrapper.style2 h3, .wrapper.style2 p, .wrapper.style2 strong { color: var(--se-black); }

header.major { text-align: center; }
header.major h2 { font-size: 2.4em; font-weight: 700; letter-spacing: -.015em; }
header.major h2::after {
	content: ""; display: block; width: 3.2rem; height: 3px; margin: .65em auto 0;
	background: linear-gradient(90deg, var(--se-gold-hi), var(--se-gold-lo)); border-radius: 3px;
}
header.major p { color: var(--se-gold); font-weight: 500; letter-spacing: .08em; text-transform: uppercase; font-size: .82rem; margin-top: 1.1em; }
header.major p.align-centere, header.major p + p { color: var(--se-muted); text-transform: none; letter-spacing: 0; font-weight: 300; font-size: 1rem; }

#main.wrapper { background: var(--se-black); }
#main h3 {
	color: var(--se-white);
	padding-bottom: .5em; margin-bottom: .8em;
	border-bottom: 1px solid var(--se-line);
	position: relative;
}
#main h3::after { content: ""; position: absolute; left: 0; bottom: -1px; width: 3rem; height: 2px; background: var(--se-gold); }
.imp-medium section > h3 + p { color: var(--se-gold); font-weight: 500; }
#main ol, #main ul:not(.actions):not(.icons) { margin-left: 1.2em; }
#main ol li::marker { color: var(--se-gold); font-weight: 600; }

/* immagini */
.image.fit img, img.fit { border-radius: var(--se-radius); box-shadow: 0 18px 50px rgba(0,0,0,.55); }
.image.fit { border-bottom: 0; }
.spotlight .image.main img { border-radius: 0; box-shadow: none; }
#main section img[align="right"], #main section img[align="left"] { filter: drop-shadow(0 12px 28px rgba(0,0,0,.55)); }

/* ---------- Contatti (section #four) ---------- */
#four.wrapper.style1 {
	background:
		radial-gradient(ellipse 60% 80% at 50% 0%, rgba(212,175,55,.10), rgba(212,175,55,0) 70%),
		var(--se-ink);
	border-top: 1px solid rgba(212,175,55,.22);
	border-bottom: 1px solid var(--se-line);
}
.box { border-radius: var(--se-radius); }
.box.alt section {
	background: var(--se-card);
	border: 1px solid var(--se-line);
	border-radius: 10px;
	padding: 2.4em 1.6em 1.8em;
	transition: border-color .3s var(--se-ease), transform .3s var(--se-ease), box-shadow .3s var(--se-ease);
}
.box.alt section:hover { border-color: rgba(212,175,55,.55); transform: translateY(-4px); box-shadow: 0 18px 40px rgba(0,0,0,.5); }
.icon.major {
	color: var(--se-gold) !important;
	border: 1px solid rgba(212,175,55,.5) !important;
	border-radius: 50%;
	background: var(--se-gold-bg);
}
.icon.major:before { color: var(--se-gold) !important; }
.box.alt section h3 { border: 0; padding: 0; margin: .6em 0 .3em; }
.box.alt section h3::after { display: none; }

/* ---------- Tabelle e form ---------- */
table tbody tr { border-color: var(--se-line); }
table thead { border-color: rgba(212,175,55,.5); }
table th { color: var(--se-white); }
table tbody tr:nth-child(2n+1) { background-color: rgba(255,255,255,.03); }
input[type="text"], input[type="password"], input[type="email"], select, textarea {
	background: var(--se-card); border-radius: var(--se-radius); box-shadow: inset 0 0 0 1px var(--se-line);
}
input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus, select:focus, textarea:focus {
	box-shadow: inset 0 0 0 1px var(--se-gold), 0 0 0 4px var(--se-gold-bg);
}
hr { border-bottom-color: var(--se-line); }
blockquote { border-left-color: var(--se-gold); }

/* ---------- Footer ---------- */
#footer {
	background: #070707;
	border-top: 1px solid rgba(212,175,55,.25);
	padding: 5em 0 4em;
}
#footer .icons .icon.alt { color: var(--se-gold) !important; }
#footer .icons .icon.alt:before { color: var(--se-gold) !important; }
#footer .icons li a { border: 0; }
#footer .icons .icon.alt:hover:before { color: var(--se-black) !important; }
#footer .icons li a:hover { background: var(--se-gold); border-color: var(--se-gold); }
#footer .copyright li { color: rgba(255,255,255,.45); font-size: .8rem; }
#footer .copyright li:first-child { color: rgba(255,255,255,.6); }
#footer .copyright a { color: var(--se-gold) !important; }

/* ---------- Spinner di caricamento ---------- */
body.landing:before { color: rgba(212, 175, 55, .55); }
body.landing:after { background: var(--se-black); }

/* ---------- Mobile (title bar + pannello) ---------- */
#titleBar { background: rgba(11,11,11,.94); border-bottom: 1px solid rgba(212,175,55,.25); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
#titleBar .title { color: var(--se-white); }
#titleBar .toggle:before { color: var(--se-gold); }
#titleBar .title .logo-mark { height: 1.9em; }
#titleBar .title a { height: 100%; }
#navPanel { background: #080808; border-right: 1px solid rgba(212,175,55,.25); }
#navPanel .link { color: rgba(255,255,255,.82); border-top-color: var(--se-line); letter-spacing: .06em; font-size: .85rem; }
#navPanel .link:hover { color: var(--se-gold); }
#navPanel .link.depth-0 { text-transform: uppercase; font-weight: 500; font-size: .75rem; letter-spacing: .14em; }

@media screen and (max-width: 980px) {
	#banner .content { padding: 6em 2.2em 5em; text-align: center; }
	#banner .content header { text-align: center; }
	#banner .content header p { border-left: 0; padding-left: 0; border-top: 2px solid var(--se-gold); padding-top: 1.2em; display: inline-block; }
	#banner .content .image { margin: 3em 0 0; display: block; }
}
@media screen and (max-width: 736px) {
	h2 { font-size: 1.6em; }
	#banner .content { padding: 5.5em 1.4em 4.5em; }
	#banner .content header h2 { font-size: 3.1rem; }
	header.major h2 { font-size: 1.7em; }
	.box.alt section { padding: 1.8em 1.2em; }
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	#banner .content .image img { animation: none; }
}

/* Il simbolo nell'hero non deve avere overlay/ritaglio del template */
#banner .content .image { overflow: visible; }
#banner .content .image:before { display: none; }

/* Logo grande nelle pagine interne: niente texture del template, dimensione contenuta */
.image.brandlogo:before { display: none; }
.image.brandlogo { max-width: 680px; margin-left: auto; margin-right: auto; border-radius: 10px; box-shadow: 0 0 0 1px rgba(212,175,55,.25), 0 24px 60px rgba(0,0,0,.6); }
.image.brandlogo img { width: 100%; border-radius: 10px; box-shadow: none; }
/* una sola barra decorativa sotto i titoli */
header.major:after, header.major:before { display: none !important; }

/* Hero su tablet/mobile: contenuto centrato nello schermo (niente salto a capo dello spacer del template) */
@media screen and (max-width: 980px) {
	#banner { display: flex; align-items: center; justify-content: center; }
	#banner:before { display: none; }
	#banner .content { margin: 0; max-width: 100%; width: 100%; }
	#banner .content .image img { width: 11em; }
}
/* Pulsante hamburger della title bar */
#titleBar .toggle { background: transparent !important; }
#titleBar .toggle:before { background: transparent !important; color: var(--se-gold) !important; border-right: 1px solid rgba(212,175,55,.22); }
@media screen and (max-width: 980px) {
	#banner .content .image img { margin: 0 auto; display: block; }
	#banner .content header p { max-width: 24em; margin-left: auto; margin-right: auto; display: block; }
}

/* Sicurezza: se la pagina non finisce di caricarsi (o JS è bloccato), lo spinner/overlay sparisce comunque dopo 3 secondi */
@keyframes se-unveil { to { opacity: 0; visibility: hidden; z-index: -1; } }
body.landing.is-preload:before,
body.landing.is-preload:after { animation: se-unveil .5s ease 3s forwards !important; }