/* ==========================================================================
   Stile del sito Antares.adv
   Colori e font in :root: cambiandoli qui si aggiorna tutto il sito.
   Ordine: font e variabili, base, pulsanti, header, hero, sezioni comuni,
   home (clienti, chi siamo, banner, servizi, cta), chi siamo, servizi, siti web (pacchetti),
   pagine pacchetto, ufficio stampa, contatti, form, footer, galleria, pagine di testo, blog,
   tablet, mobile, movimento ridotto.
   ========================================================================== */

@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(assets/fonts/poppins-400.woff2) format("woff2");
}
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(assets/fonts/poppins-600.woff2) format("woff2");
}
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(assets/fonts/poppins-700.woff2) format("woff2");
}

:root {
  --primario: #c2001c;     /* rosso del marchio: banner, titoli dei pacchetti, pulsanti pieni */
  --testo: #303030;        /* testo normale */
  --nero: #000;
  --bianco: #fff;
  --grigio: #707070;       /* testi secondari */
  --grigio-chiaro: #e3e3e3;/* bordi e separatori */
  --sfondo-card: #f7f8f7;  /* sfondo delle tabelle prezzi e delle card */
  --font: "Poppins", system-ui, sans-serif;
  --container: 1140px;
  --ssg-font: "Poppins", sans-serif; /* font del banner/messaggi di SiteHub */
}

/* --- base ----------------------------------------------------------------- */

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 100px; }
body { margin: 0; font: 400 15px/1.6 var(--font); color: var(--testo); background: var(--bianco); -webkit-font-smoothing: antialiased; overflow-x: hidden; }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--primario); text-decoration: none; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid var(--primario); outline-offset: 2px; }
h1, h2, h3 { margin: 0; line-height: 1.2; font-weight: 600; color: var(--nero); }
p { margin: 0 0 1rem; }
p:last-child { margin-bottom: 0; }
strong, b { font-weight: 700; }
.container { width: 100%; max-width: var(--container); margin: 0 auto; padding: 0 20px; }
.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip-link { position: absolute; left: -9999px; }
.skip-link:focus { left: 10px; top: 10px; z-index: 100; padding: 8px 12px; background: var(--bianco); color: var(--nero); }
.icon { width: 16px; height: 16px; flex-shrink: 0; fill: currentColor; }
.center { text-align: center; }

/* --- pulsanti ------------------------------------------------------------- */

.button {
  display: inline-block; padding: 10px 24px; border: 2px solid var(--nero); border-radius: 3px;
  background: transparent; color: var(--nero); font: 400 14px/1.4 var(--font); text-transform: uppercase;
  cursor: pointer; transition: background .2s, color .2s;
}
.button:hover { background: var(--nero); color: var(--bianco); }
.button--pieno { border-color: var(--primario); background: var(--primario); color: var(--bianco); }
.button--pieno:hover { border-color: #9a0016; background: #9a0016; }
.button--piccolo { padding: 6px 16px; font-size: 13px; border-width: 1px; text-transform: none; }

/* --- header (sopra l'hero, trasparente) ------------------------------------ */

/* header fisso in cima: trasparente sopra l'hero, nero dopo 500 px di scorrimento (classe aggiunta da script.js) */
.site-header { position: fixed; top: 0; left: 0; right: 0; z-index: 50; color: var(--bianco); transition: background .3s; }
.site-header.scrolled { background: var(--nero); }
.navbar { display: flex; align-items: center; justify-content: space-between; gap: 20px; max-width: 1440px; margin: 0 auto; padding: 14px 60px; }
.logo { flex: 0 0 auto; width: 175px; }
.logo img { width: 175px; transition: width .3s ease-in-out; }
.scrolled .logo img { width: 120px; }
.menu { display: flex; justify-content: center; gap: 30px; flex: 1; margin: 0; padding: 0; list-style: none; }
.menu li { position: relative; }
.menu a { display: block; padding: 10px 0; color: var(--bianco); font-size: 18px; font-weight: 600; text-transform: uppercase; }
/* linea bianca che al passaggio del mouse cresce da sinistra e all'uscita si ritira verso destra */
.menu li::before {
  content: ""; position: absolute; left: 0; bottom: 4px; width: 100%; height: 2px; background: var(--bianco);
  transform: scaleX(0); transform-origin: right; transition: transform .7s cubic-bezier(1, 0, 0, 1); pointer-events: none;
}
.menu li:hover::before, .menu li:focus-within::before { transform: scaleX(1); transform-origin: left; }
.social { flex: 0 0 auto; margin: 0; font-size: 13px; }
.social a { color: var(--bianco); }
.social a:hover { opacity: .75; }

.menu-toggle { display: none; padding: 8px; border: 0; background: none; cursor: pointer; }
.menu-toggle span { display: block; width: 26px; height: 2px; margin: 6px 0; background: var(--bianco); transition: transform .2s, opacity .2s; }
.menu-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.menu-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

/* --- hero: immagine a tutta larghezza, velo scuro, testo bianco ------------ */

.hero { position: relative; display: flex; align-items: center; min-height: 655px; padding: 120px 0 60px; overflow: hidden; background: #111; color: var(--bianco); }
.hero__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero::after { content: ""; position: absolute; inset: 0; background: var(--nero); opacity: .5; }
.hero--chiaro::after { opacity: .3; }
.hero__inner { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 40px; width: 100%; max-width: 1440px; margin: 0 auto; padding: 0 50px; }
.hero__testo { max-width: 620px; }
.hero h1 { color: var(--bianco); font-size: 64px; font-weight: 700; line-height: 1.1; }
.hero p { margin-top: 18px; font-size: 16px; font-weight: 600; }
.hero__eyebrow { margin: 0 0 6px; font-size: 14px; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; color: #ffd0d6; }
.hero p.hero__eyebrow { margin-top: 0; }
.hero a { color: inherit; text-decoration: underline; }
.hero__pianeta { flex: 0 0 auto; width: 290px; margin-right: 10%; border-radius: 50%; }
/* pagine senza foto (privacy, cookie, 404): hero basso e nero */
.hero--breve { min-height: 360px; }
.hero--breve::after { display: none; }

/* --- sezioni comuni ------------------------------------------------------- */

.sezione { padding: 70px 0; }
.titolo-sezione { margin-bottom: 30px; font-size: 32px; text-align: center; }
.intro { max-width: 980px; margin: 0 auto; text-align: center; color: var(--nero); }
.divisore { width: 50%; max-width: 710px; margin: 0 auto; border: 0; border-top: 1px solid var(--nero); }

/* banner rosso a tutta larghezza ("lancia la tua attività online…") */
.banner { padding: 22px 20px; background: var(--primario); color: var(--bianco); font-size: 32px; font-weight: 600; text-align: center; }

/* --- home: clienti (loghi che scorrono) ------------------------------------ */

.clienti { padding: 40px 0 20px; }
.clienti h2 { margin-bottom: 30px; font-size: 28px; text-align: center; }
.clienti__nastro { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
.clienti__lista { display: flex; gap: 50px; width: max-content; margin: 0; padding: 0; list-style: none; animation: scorri 40s linear infinite; }
.clienti__lista img { width: 175px; height: auto; }
.clienti__nastro:hover .clienti__lista { animation-play-state: paused; }
@keyframes scorri { to { transform: translateX(calc(-50% - 25px)); } }

/* --- home: chi siamo ------------------------------------------------------ */

.about { display: grid; grid-template-columns: 412px 1fr; align-items: center; gap: 90px; padding-top: 50px; padding-bottom: 100px; }
.about__img { width: 100%; border-radius: 8px; }
.about__testo h2 { margin-bottom: 24px; font-size: 32px; text-align: center; }
.about__testo { font-size: 14px; color: var(--nero); }
.about__testo .button { display: table; margin: 24px auto 50px; }
.about__claim { color: var(--testo); }

/* --- home: servizi (titoli giganti e pianeti) ------------------------------ */

.servizi-home { padding: 80px 0 40px; }
.servizi-home > .container > p { margin-bottom: 40px; text-align: center; color: var(--nero); }
.servizio-home { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 70px; max-width: 900px; margin: 0 auto 60px; }
.servizio-home__testo { text-align: center; color: var(--nero); }
.servizio-home__testo h3 { margin-bottom: 20px; font-size: 120px; font-weight: 700; line-height: 1; }
.servizio-home__testo h3 a { color: var(--nero); }
.servizio-home__testo h3 a:hover { color: var(--primario); }
.servizio-home__img { width: 100%; max-width: 385px; margin: 0 auto; border-radius: 50%; }
.servizio-home--inverso .servizio-home__img { order: -1; }

/* call to action finale ("Richiedi informazioni.") */
.cta { padding: 70px 20px; text-align: center; color: var(--nero); }
.cta h2 { margin-bottom: 24px; font-size: 32px; font-weight: 700; }
.cta .button { margin-top: 20px; }

/* --- chi siamo ------------------------------------------------------------ */

.presentazione { max-width: 1000px; margin: 0 auto; padding: 60px 20px; text-align: center; font-size: 14px; color: var(--nero); }
.presentazione h2 { margin-bottom: 18px; font-size: 22px; font-weight: 600; text-transform: uppercase; }
.presentazione__logo { width: 220px; margin: 0 auto 20px; }
.presentazione hr { width: 70%; margin: 0 auto 30px; border: 0; border-top: 1px solid var(--grigio-chiaro); }

.workspace { padding: 60px 0 70px; }
.workspace .intro { margin-bottom: 40px; font-size: 14px; }
.foto-griglia { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.foto-griglia img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }

/* --- pagina servizi ------------------------------------------------------- */

.servizi-card { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; padding-top: 50px; padding-bottom: 50px; }
.servizi-card a { display: block; color: var(--nero); }
.servizi-card img { width: 100%; border-radius: 6px; aspect-ratio: 3 / 2; object-fit: cover; transition: opacity .2s; }
.servizi-card h2 { margin-top: 14px; font-size: 28px; }
.servizi-card a:hover img { opacity: .85; }
.servizi-card a:hover h2 { color: var(--primario); }

/* --- siti web: tabelle prezzi --------------------------------------------- */

.pacchetti { display: grid; grid-template-columns: repeat(3, 1fr); gap: 50px; max-width: 1000px; margin: 0 auto; }
.pacchetto { text-align: center; }
.pacchetto__pianeta { width: 150px; margin: 0 auto 20px; border-radius: 50%; }
.pacchetto__nome { margin-bottom: 10px; color: var(--primario); font-size: 24px; font-weight: 600; }
.pacchetto__tabella { position: relative; overflow: hidden; background: var(--sfondo-card); }
.pacchetto__tabella h3 { padding: 14px 10px; background: var(--primario); color: var(--bianco); font-size: 20px; font-weight: 600; }
.pacchetto__prezzo { padding: 24px 10px 6px; color: var(--nero); font-size: 60px; font-weight: 600; line-height: 1; }
.pacchetto__prezzo sup { font-size: 22px; vertical-align: 1.4em; }
.pacchetto__rate { margin: 0; color: var(--grigio); font-size: 13px; }
.pacchetto__iva { margin: 0; color: var(--grigio); font-size: 9px; }
.pacchetto__lista { margin: 20px 0 0; padding: 0 25px; list-style: none; font-size: 12px; color: var(--testo); }
.pacchetto__lista li { padding: 10px 0; border-bottom: 1px solid var(--grigio-chiaro); }
.pacchetto__tabella .button { margin: 30px 0 25px; font-size: 13px; text-transform: none; }
.pacchetto__nastro {
  position: absolute; top: 18px; right: -30px; width: 130px; padding: 4px 0; transform: rotate(45deg);
  background: var(--nero); color: var(--bianco); font-size: 11px; font-weight: 700; text-transform: uppercase;
}

/* --- pagine dei pacchetti (Nova, Supernova, Quasar) ----------------------- */

.dettaglio { max-width: 1060px; margin: 0 auto; padding: 40px 20px 30px; font-size: 14px; color: var(--nero); }
.dettaglio h2 { margin: 1.4rem 0 .6rem; font-size: 18px; font-weight: 700; }
.dettaglio ul { margin: 0 0 1rem; padding-left: 20px; }
.dettaglio .button { display: table; margin: 30px auto 0; }

/* --- ufficio stampa ------------------------------------------------------- */

.aree { display: grid; grid-template-columns: repeat(3, 1fr); gap: 50px; max-width: 1000px; margin: 0 auto; text-align: center; }
.aree img { width: 150px; margin: 0 auto 20px; border-radius: 50%; }
.aree h3 { margin-bottom: 18px; color: var(--primario); font-size: 26px; text-transform: uppercase; }
.aree p { font-size: 14px; color: var(--testo); }

.rassegna { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; padding: 0 10px; }
.rassegna img { width: 100%; aspect-ratio: 480 / 528; object-fit: cover; }
.rassegna a { display: block; overflow: hidden; }
.rassegna a:hover img { transform: scale(1.03); transition: transform .3s; }

.catalogo { max-width: 1000px; margin: 0 auto; padding: 50px 20px 80px; }

/* --- contatti ------------------------------------------------------------- */

/* disegni grandi e grigio chiarissimo (#f2f2f2), centrati, come nel sito originale; oltre 2000 px di larghezza si allarga */
.contatti { position: relative; padding: 110px 0; background: var(--bianco) url(assets/img/sfondo-contatti-disegni.webp) center / 2000px auto no-repeat; }
@media (min-width: 2000px) { .contatti { background-size: cover; } }
.contatti__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: start; }
.contatti__card { padding: 40px; background: var(--bianco); box-shadow: 0 0 30px rgba(0, 0, 0, .3); }
.contatti__testo { padding-top: 0; font-size: 14px; }
.contatti__testo h2 { margin-bottom: 16px; font-size: 24px; font-weight: 500; }
.contatti__testo hr { margin: 25px 0 50px; border: 0; border-top: 1px solid var(--grigio); }
.lista-icone { margin: 0 0 40px; padding: 0 0 0 20px; list-style: none; }
.lista-icone li { display: flex; align-items: center; gap: 14px; padding: 5px 0; color: var(--testo); }
.lista-icone .icon { color: var(--primario); }
.lista-icone a { color: var(--testo); }
.lista-icone a:hover { color: var(--primario); }

/* --- form (moduli SiteHub) ------------------------------------------------ */

.form { display: grid; grid-template-columns: 1fr; gap: 14px; font-size: 13px; }
.form--due { grid-template-columns: 1fr 1fr; }
.form__campo { display: flex; flex-direction: column; gap: 4px; }
.form__campo[hidden] { display: none; }
.form__campo--intero, .form__privacy, .form__azioni, .form [data-ssg-success], .form [data-ssg-error] { grid-column: 1 / -1; }
.form label { color: var(--nero); font-weight: 600; }
.form input:not([type="checkbox"]), .form select, .form textarea {
  width: 100%; padding: 8px 12px; border: 1px solid #69727d; border-radius: 3px;
  background: var(--bianco); font: inherit; font-size: 14px; color: var(--testo);
}
.form textarea { min-height: 90px; resize: vertical; }
.form ::placeholder { color: #9aa0a6; }
.form__privacy { display: flex; align-items: center; gap: 8px; }
.form .form__privacy { font-weight: 400; }
.form__privacy input { accent-color: var(--primario); }
.form__azioni { display: flex; justify-content: flex-end; }
.form__azioni--sinistra { justify-content: flex-start; }
.form button[type="submit"] { padding: 8px 22px; font-size: 13px; }

/* messaggi automatici di SiteHub */
.ssg-msg { grid-column: 1 / -1; padding: 10px 14px; border-radius: 3px; }
.ssg-msg-ok { background: #e7f6ec; color: #13612d; }
.ssg-msg-ko { background: #fde8eb; color: #8a0014; }

/* --- footer --------------------------------------------------------------- */

.site-footer { padding: 20px 0 30px; background: var(--nero); color: var(--bianco); font-size: 15px; }
.site-footer a { color: var(--bianco); }
.site-footer a:hover { opacity: .75; }
.footer__top { display: flex; align-items: center; justify-content: space-between; gap: 20px; max-width: 1440px; margin: 0 auto; padding: 8px 55px 18px; border-bottom: 1px solid #3a3a3a; }
.footer__logo { width: 175px; }
.footer__menu { display: flex; flex-wrap: wrap; justify-content: center; margin: 0; padding: 0; list-style: none; }
.footer__menu a { display: block; padding: 6px 20px; font-weight: 600; }
.footer__partner { margin: 22px 0 8px; text-align: center; }
.footer__bottom { display: grid; grid-template-columns: repeat(4, 1fr); align-items: center; gap: 20px; max-width: var(--container); margin: 0 auto; padding: 0 20px; text-align: center; }
.footer__bottom img { margin: 0 auto; }
.footer__nexxtone { width: 125px; }
.footer__plan { width: 64px; }
.footer__dati { margin: 26px auto 0; padding: 0 20px; color: #bdbdbd; font-size: 12px; text-align: center; }
.footer__dati a { color: #bdbdbd; }

/* --- ingrandimento foto (creato da script.js) ------------------------------ */

.lightbox { position: fixed; inset: 0; z-index: 100; display: flex; align-items: center; justify-content: center; background: rgba(0, 0, 0, .9); }
.lightbox img { max-width: 92vw; max-height: 88vh; width: auto; }
.lightbox button { position: absolute; padding: 10px 16px; border: 0; background: none; color: var(--bianco); font-size: 40px; line-height: 1; cursor: pointer; }
.lightbox .close { top: 10px; right: 10px; }
.lightbox .prev { left: 10px; }
.lightbox .next { right: 10px; }

/* --- pagine di testo (privacy, cookie, 404) ------------------------------- */

.page { max-width: 820px; margin: 0 auto; padding: 50px 20px 100px; }
.page h2 { margin: 2rem 0 1rem; font-size: 1.4rem; }
.page h3 { margin: 1.2rem 0 .5rem; font-size: 1.1rem; }
.page li { margin-bottom: .35rem; }
.page .updated { margin-top: 2rem; color: var(--grigio); font-size: .9em; }
.page--404 { text-align: center; }

/* --- blog: pagine generate da SiteHub con _sitehub/templates/ ---------------- */

.blog { max-width: 1140px; }
.blog__griglia { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 30px; margin-top: 2rem; }
.blog__card { display: flex; flex-direction: column; border: 1px solid var(--grigio-chiaro); background: var(--bianco); }
.blog__card > a { color: inherit; }
.blog__card img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.blog__card h2 { margin: 20px 20px 8px; font-size: 1.25rem; transition: color .2s; }
.blog__card > a:hover h2, .blog__card > a:focus-visible h2 { color: var(--primario); }
.blog__data { margin: 0 20px 10px; color: var(--grigio); font-size: .9em; }
.blog__card .blog__estratto { margin: 0 20px 20px; }

.articolo__meta { margin-bottom: 1rem; color: var(--grigio); font-size: .95em; }
.articolo__immagine { width: 100%; margin: 0 0 2rem; }
.articolo__testo { font-size: 1.05rem; }
.articolo__testo h2 { margin: 2rem 0 1rem; font-size: 1.5rem; }
.articolo__testo h3 { margin: 1.5rem 0 .7rem; font-size: 1.2rem; }
.articolo__testo figure { margin: 1.5rem 0; }
.articolo__testo img { display: block; max-width: 100%; height: auto; margin: 1.5rem auto; }
.articolo__testo figure img { margin: 0 auto; }
.articolo__testo figcaption { margin-top: .5rem; font-size: .9em; color: var(--grigio); text-align: center; }
.articolo__testo .img--media { width: 50%; }
.articolo__testo .img--piccola { width: 30%; }
.articolo__testo figure.img--media img, .articolo__testo figure.img--piccola img { width: 100%; }
.articolo__testo .img--sinistra { float: left; margin: .3rem 1.5rem 1rem 0; }
.articolo__testo .img--destra { float: right; margin: .3rem 0 1rem 1.5rem; }
.articolo__testo::after { content: ""; display: block; clear: both; }
.articolo__testo ul, .articolo__testo ol { margin: 0 0 1rem; padding-left: 1.4rem; }
.articolo__testo blockquote { margin: 1.5rem 0; padding: .4rem 0 .4rem 1.2rem; border-left: 4px solid var(--primario); color: #444; }
.articolo__testo a { text-decoration: underline; }
.articolo__testo hr { margin: 2rem 0; border: 0; border-top: 1px solid var(--grigio-chiaro); }

.pagination .nav-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 3rem; }
.pagination .page-numbers { padding: 6px 14px; border: 1px solid var(--grigio-chiaro); color: var(--testo); }
.pagination .current { border-color: var(--primario); background: var(--primario); color: var(--bianco); }

@media (max-width: 600px) {
  .articolo__testo .img--media, .articolo__testo .img--sinistra, .articolo__testo .img--destra { float: none; width: 100%; margin: 1.5rem 0; }
}

/* --- tablet --------------------------------------------------------------- */

@media (max-width: 1024px) {
  .navbar { position: relative; padding: 18px 20px; }
  .navbar .social { display: none; }
  .menu-toggle { display: block; }
  .menu {
    display: none; position: absolute; top: 100%; left: 0; right: 0; flex-direction: column;
    padding: 10px 0; background: rgba(0, 0, 0, .95);
  }
  .menu.open { display: flex; }
  .menu { gap: 0; }
  .menu a { padding: 12px 20px; font-size: 16px; }
  .menu li::before { display: none; }
  .hero__inner { padding: 0 20px; }
  .hero__pianeta { width: 220px; margin-right: 0; }
  .about { grid-template-columns: 1fr 1fr; gap: 40px; }
  .servizio-home__testo h3 { font-size: 90px; }
  .pacchetti { gap: 20px; }
  .aree { gap: 30px; }
  .rassegna { grid-template-columns: repeat(3, 1fr); }
  .contatti__inner { gap: 30px; }
  .footer__top { flex-direction: column; padding: 8px 20px 18px; }
  .footer__bottom { grid-template-columns: 1fr 1fr; }
}

/* --- mobile --------------------------------------------------------------- */

@media (max-width: 767px) {
  body { font-size: 14px; }
  .logo, .logo img { width: 140px; }
  .scrolled .logo img { width: 85px; }
  .hero { min-height: 440px; padding: 110px 0 50px; }
  .hero h1 { font-size: 40px; }
  .hero p { font-size: 14px; }
  .hero__inner { flex-direction: column; align-items: flex-start; }
  .hero__pianeta { width: 150px; }
  .hero--breve { min-height: 280px; }
  .sezione { padding: 50px 0; }
  .titolo-sezione, .about__testo h2, .cta h2 { font-size: 26px; }
  .banner { font-size: 22px; }
  .clienti h2 { font-size: 22px; }
  .clienti__lista img { width: 130px; }
  .about { grid-template-columns: 1fr; padding-bottom: 50px; }
  .about__img { max-width: 360px; margin: 0 auto; }
  .servizio-home { grid-template-columns: 1fr; gap: 30px; }
  .servizio-home--inverso .servizio-home__img { order: 0; }
  .servizio-home__testo h3 { font-size: 64px; }
  .servizio-home__img { max-width: 280px; }
  .foto-griglia, .servizi-card, .pacchetti, .aree { grid-template-columns: 1fr; }
  .pacchetti { max-width: 360px; gap: 50px; }
  .rassegna { grid-template-columns: repeat(2, 1fr); }
  .contatti { padding: 50px 0; }
  .contatti__inner { grid-template-columns: 1fr; }
  .contatti__card { padding: 24px; }
  .contatti__testo hr { margin-bottom: 30px; }
  .form--due { grid-template-columns: 1fr; }
  .footer__bottom { grid-template-columns: 1fr; }
  .divisore { width: 80%; }
}

/* --- movimento ridotto ---------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .menu li::before, .logo img, .site-header { transition: none; }
  .clienti__lista { animation: none; flex-wrap: wrap; justify-content: center; width: auto; }
  .clienti__lista [aria-hidden="true"] { display: none; }
  .clienti__nastro { -webkit-mask-image: none; mask-image: none; }
}
