/* Stili aggiuntivi dello storefront: cio' che il tema originale otteneva con icon-font, JS del tema o markup non migrato. */
.d-contents, .d-content { display: contents; }
.client-hidden { display: none; }

/* Icone inline (sostituiscono Font Awesome) */
.mp-icon { display: inline-block; width: 1em; height: 1em; vertical-align: -0.125em; fill: currentColor; }
.breadcrumb li:first-child a::before { content: ""; display: inline-block; width: 1.05em; height: .95em; margin-right: .5em; vertical-align: -0.08em; background-color: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 576 512'%3E%3Cpath d='M575.8 255.5c0 18-15 32.1-32 32.1l-32 0 .7 160.2c0 2.7-.2 5.4-.5 8.1l0 16.2c0 22.1-17.9 40-40 40l-16 0c-1.100 0-2.200 0-3.300-.1c-1.400 .1-2.800 .1-4.200 .1L416 512l-24 0c-22.100 0-40-17.900-40-40l0-24 0-64c0-17.700-14.300-32-32-32l-64 0c-17.700 0-32 14.300-32 32l0 64 0 24c0 22.100-17.900 40-40 40l-24 0-31.900 0c-1.500 0-3-.1-4.500-.2c-1.200 .1-2.400 .2-3.600 .2l-16 0c-22.100 0-40-17.900-40-40l0-112c0-.9 0-1.900 .1-2.800l0-69.700-32 0c-18 0-32-14-32-32.100c0-9 3-17 10-24L266.400 8c7-7 15-8 22-8s15 2 21 7L564.800 231.500c8 7 12 15 11 24z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 576 512'%3E%3Cpath d='M575.8 255.5c0 18-15 32.1-32 32.1l-32 0 .7 160.2c0 2.7-.2 5.4-.5 8.1l0 16.2c0 22.1-17.9 40-40 40l-16 0c-1.100 0-2.200 0-3.300-.1c-1.400 .1-2.800 .1-4.200 .1L416 512l-24 0c-22.100 0-40-17.900-40-40l0-24 0-64c0-17.700-14.300-32-32-32l-64 0c-17.700 0-32 14.300-32 32l0 64 0 24c0 22.100-17.900 40-40 40l-24 0-31.900 0c-1.500 0-3-.1-4.500-.2c-1.200 .1-2.400 .2-3.600 .2l-16 0c-22.100 0-40-17.900-40-40l0-112c0-.9 0-1.900 .1-2.800l0-69.700-32 0c-18 0-32-14-32-32.100c0-9 3-17 10-24L266.400 8c7-7 15-8 22-8s15 2 21 7L564.800 231.500c8 7 12 15 11 24z'/%3E%3C/svg%3E") center / contain no-repeat; }

/* Logo: le dimensioni intrinseche servono solo a riservare lo spazio */
.logo-container img, .footer-logo-container img { width: auto; height: auto; }
.brand-info img, .product-content-left img { height: auto; }
.footer .widget-list .mp-icon { width: 18px; height: 25px; padding: 3px 0 4px; margin: 0 12px 0 0; vertical-align: top; }
.btn-social .mp-icon { vertical-align: -0.15em; }

/* Segnaposto banner: senza slot attivo non occupano spazio */
.adv-slot:empty { display: none; }
.adv-slot--filled { padding: 16px 24px; text-align: center; }
.adv-blocks { display: flex; flex-wrap: wrap; gap: 16px; justify-content: center; }
.adv-block { margin: 0; }
.adv-block img { max-width: 100%; height: auto; }
.adv-block figcaption { font-size: 12px; color: #aeb4be; margin-top: 4px; }

/* Riga legale e powered-by (dal config del canale) */
.footer-legal { padding-top: 2px; }
.powered-by-strip { text-align: center; padding-top: 6px; }
.powered-by-strip a, .powered-by-strip span { color: #aeb4be; text-decoration: none; }
.powered-by-text { font-size: 11px; letter-spacing: .04em; text-transform: uppercase; }
.powered-by-strip a:hover .powered-by-text { color: #fff; }

/* Pagina di disiscrizione newsletter (vecchio tema) */
.mp-narrow h1, .mp-narrow p, .mp-narrow a { color: #fff; }

/* L'anteprima gira in dev: l'overlay d'errore di Nuxt non deve mai comparire nelle pagine servite. */
nuxt-error-overlay { display: none !important; }

/* Caroselli della home (generati da server/utils/views.ts, attivati da plugins/mp-carousel.client.ts):
   scorrimento nativo con scroll-snap, frecce grandi ai lati, pallini di pagina sotto. --pv = slide per volta. */
.mp-carousel { --pv: 4; --gap: 10px; align-items: center; display: grid; gap: 0 14px; grid-template-columns: 52px minmax(0, 1fr) 52px; position: relative; width: 100%; }
.mp-carousel--news { --pv: 3; --gap: 24px; }
@media (max-width: 1100px) { .mp-carousel--news { --pv: 2; } }
@media (max-width: 1180px) { .mp-carousel--works { --pv: 3; } }
@media (max-width: 970px) { .mp-carousel--works { --pv: 2; } }
@media (max-width: 760px) { .mp-carousel { --pv: 1; gap: 0 4px; grid-template-columns: 40px minmax(0, 1fr) 40px; } .mp-carousel--news { --gap: 16px; } }
.mp-carousel__track { display: grid; gap: var(--gap); grid-auto-columns: calc((100% - (var(--pv) - 1) * var(--gap)) / var(--pv)); grid-auto-flow: column; overflow-x: auto; overscroll-behavior-x: contain; padding: 6px 2px 10px; scroll-behavior: smooth; scroll-snap-type: x mandatory; scrollbar-width: none; }
.mp-carousel__track::-webkit-scrollbar { display: none; }
.mp-carousel__slide { min-width: 0; scroll-snap-align: start; }
.mp-carousel__arrow { align-items: center; background: none; border: 0; border-radius: 50%; color: #fff; cursor: pointer; display: flex; height: 52px; justify-content: center; opacity: .85; padding: 0; transition: opacity .2s, transform .2s, color .2s; width: 52px; }
.mp-carousel__arrow:hover { color: #24a0bd; opacity: 1; transform: scale(1.12); }
.mp-carousel__arrow:focus-visible, .mp-carousel__dot:focus-visible { outline: 3px solid #7fd3ea; outline-offset: 2px; }
.mp-carousel__arrow svg { display: block; height: 44px; width: 44px; }
.mp-carousel__dots { display: flex; flex-wrap: wrap; gap: 14px; grid-column: 1 / -1; justify-content: center; min-height: 12px; padding-top: 22px; }
.mp-carousel__dot { background: rgba(255, 255, 255, .38); border: 0; border-radius: 50%; cursor: pointer; height: 12px; padding: 0; transition: background-color .2s, transform .2s; width: 12px; }
.mp-carousel__dot:hover { background: rgba(255, 255, 255, .7); }
.mp-carousel__dot.is-active { background: #fff; transform: scale(1.15); }
.mp-carousel.is-single .mp-carousel__arrow, .mp-carousel.is-single .mp-carousel__dots { visibility: hidden; }
@media (max-width: 760px) { .mp-carousel__arrow { height: 40px; width: 40px; } .mp-carousel__arrow svg { height: 34px; width: 34px; } }
@media (prefers-reduced-motion: reduce) { .mp-carousel__track { scroll-behavior: auto; } }

/* Locandina dei works con l'etichetta di categoria sovrapposta in basso a sinistra */
.mp-poster { box-shadow: 0 1px 3px rgba(0, 0, 0, .12), 0 1px 2px rgba(0, 0, 0, .24); display: block; overflow: hidden; position: relative; }
.mp-poster img { aspect-ratio: 2 / 3; display: block; height: auto; object-fit: cover; transition: opacity .2s; width: 100%; }
.mp-poster:hover img { opacity: .8; }
.mp-poster__label { background: #00091a; border-radius: 5px; bottom: 14px; color: #fff; font: 700 15px/1.2 Montserrat, sans-serif; left: 14px; letter-spacing: .04em; max-width: calc(100% - 28px); padding: 8px 16px; position: absolute; text-transform: uppercase; }

/* Card news della home (nel carosello: tre per volta) */
.mp-home-news .mp-carousel__slide { display: flex; }
.mp-news-card { display: flex; flex-direction: column; height: 100%; width: 100%; }
.mp-news-card__media { display: block; }
.mp-news-card__media img { aspect-ratio: 720 / 517; display: block; height: auto; object-fit: cover; width: 100%; }
.mp-news-card__text { color: rgb(53, 53, 53); display: flex; flex: 1; flex-direction: column; padding: 20px; width: 100%; }
.mp-news-card__title { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-height: 1.3; overflow: hidden; }
.mp-news-card__meta { color: rgb(102, 102, 102); margin: 10px 0 0; }
.mp-news-card__text > div { margin-top: auto; padding-top: 12px; }
.visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; margin: -1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }

/* Home: hero "cover" come nel sito di riferimento — la foto resta sotto l'header, il contenuto la copre e lei si
   sfoca e si scurisce. Animazione legata allo scroll dove supportata; altrove plugins/cover-hero.client.ts
   imposta --p e le classi is-moving / is-covered. (I keyframes cover-veil sono in dx.css.) */
:root { --mp-header-h: 112px; }
@media (max-width: 969px) { :root { --mp-header-h: 76px; } }
.mp-cover-hero { position: sticky !important; top: var(--mp-header-h); z-index: 1; --cover-start: 0px; }
.mp-cover-hero ~ .is-section { position: relative; z-index: 2; }
.mp-cover-hero::after { content: ""; position: absolute; inset: 0; background: #00091a; opacity: 0; pointer-events: none; z-index: 1; }
@keyframes mp-cover-blur { from { filter: none; } to { filter: blur(14px); } }
/* SOLO dove le animazioni legate allo scroll esistono: senza questo @supports un browser che non le conosce
   eseguirebbe l'animazione "a tempo" con durata 0 — immagine gia' sfocata e scurita al caricamento. */
@supports (animation-timeline: scroll()) {
  @media (prefers-reduced-motion: no-preference) {
    .mp-cover-hero::after { animation: cover-veil linear both; animation-timeline: scroll(root); animation-range: var(--cover-start, 0px) calc(var(--cover-start, 0px) + var(--cover-h, 100vh)); }
  }
  @media (prefers-reduced-motion: no-preference) and (min-width: 768px) {
    .mp-cover-hero__media { animation: mp-cover-blur linear forwards; animation-timeline: scroll(root); animation-range: calc(var(--cover-start, 0px) + 1px) calc(var(--cover-start, 0px) + var(--cover-h, 100vh)); }
    /* ContentBox anima gia' questa immagine (zoom lento "is-scale"): le due animazioni convivono, ognuna col suo tempo. */
    .mp-cover-hero .mp-cover-hero__media.is-scale-animated.is-inview { animation: is-scale 25s ease forwards, mp-cover-blur linear forwards !important; animation-timeline: auto, scroll(root) !important; animation-range: normal, calc(var(--cover-start, 0px) + 1px) calc(var(--cover-start, 0px) + var(--cover-h, 100vh)) !important; }
  }
}
/* Ripiego (plugins/cover-hero.client.ts): la sfocatura segue lo scroll senza il ritardo della transizione ContentBox. */
.mp-cover-hero.is-moving .mp-cover-hero__media, .mp-cover-hero.is-covered .mp-cover-hero__media { transition: none; }
.mp-cover-hero.is-moving::after, .mp-cover-hero.is-covered::after { opacity: calc(var(--p, 0) * .3); }
@media (min-width: 768px) {
  .mp-cover-hero.is-moving .mp-cover-hero__media, .mp-cover-hero.is-covered .mp-cover-hero__media { filter: blur(calc(var(--p, 0) * 14px)); }
}
@media (prefers-reduced-motion: reduce) { .mp-cover-hero { position: relative !important; top: auto; } }

/* Caroselli della home: su schermi larghi le frecce escono dal contenitore, cosi' le slide restano allineate ai titoli */
@media (min-width: 1340px) {
  .mp-carousel--works { margin-inline: -30px; width: calc(100% + 60px); }
  .mp-carousel--news { margin-inline: -66px; width: calc(100% + 132px); }
}
.mp-carousel__track { scroll-padding-inline: 2px; }
/* Il pulsante "Dettagli" si accende solo sulla card sotto il mouse (nel vecchio markup ogni card era una colonna) */
.section-products .column:hover .mp-news-card:not(:hover) .news-button { opacity: .3; transform: translateY(10px); }
.mp-news-card:hover .news-button { opacity: 1; transform: translateY(0); }
/* Senza hover (touch) il pulsante resterebbe al 30% per sempre: illeggibile (contrasto 2:1). Li' e' sempre acceso. */
@media (hover: none) { .news-button { opacity: 1 !important; transform: none !important; } }

/* ---------------------------------------------------------------- Banner del consenso cookie (config del canale)
   Posizione e tema arrivano da consent.layout; --mpc-accent da layout.accent_color. Accetta e Rifiuta hanno lo
   stesso peso visivo (scelta simmetrica). Il banner e' fixed: nessuno spostamento del layout. */
.mp-consent { --mpc-bg: #fff; --mpc-fg: #1f2733; --mpc-muted: #4a5568; --mpc-line: #d9dee6; --mpc-accent: #0f6f86; --mpc-on-accent: #fff; font-family: Montserrat, system-ui, sans-serif; inset: 0; pointer-events: none; position: fixed; z-index: 2147483000; }
.mp-consent--dark { --mpc-bg: #00091a; --mpc-fg: #fff; --mpc-muted: #c3cad6; --mpc-line: #26324a; --mpc-accent: #7fd3ea; --mpc-on-accent: #00091a; }
@media (prefers-color-scheme: dark) { .mp-consent--auto { --mpc-bg: #00091a; --mpc-fg: #fff; --mpc-muted: #c3cad6; --mpc-line: #26324a; --mpc-accent: #7fd3ea; --mpc-on-accent: #00091a; } }
.mp-consent__backdrop { background: rgba(0, 9, 26, .6); inset: 0; pointer-events: auto; position: absolute; }
.mp-consent__box { background: var(--mpc-bg); border: 1px solid var(--mpc-line); box-shadow: 0 10px 40px rgba(0, 0, 0, .3); box-sizing: border-box; color: var(--mpc-fg); max-height: 100dvh; outline: 0; overflow-y: auto; padding: 22px 24px; pointer-events: auto; position: absolute; }
.mp-consent--bar-bottom .mp-consent__box, .mp-consent--bar-top .mp-consent__box { left: 0; right: 0; }
.mp-consent--bar-bottom .mp-consent__box { border-width: 1px 0 0; bottom: 0; }
.mp-consent--bar-top .mp-consent__box { border-width: 0 0 1px; top: 0; }
.mp-consent--bar-bottom .mp-consent__inner, .mp-consent--bar-top .mp-consent__inner { margin-inline: auto; max-width: 1180px; }
.mp-consent--box-left .mp-consent__box, .mp-consent--box-right .mp-consent__box { border-radius: 12px; bottom: 20px; max-height: calc(100dvh - 40px); width: min(440px, calc(100vw - 32px)); }
.mp-consent--box-left .mp-consent__box { left: 16px; }
.mp-consent--box-right .mp-consent__box { right: 16px; }
.mp-consent--modal .mp-consent__box { border-radius: 12px; left: 50%; max-height: calc(100dvh - 32px); top: 50%; transform: translate(-50%, -50%); width: min(620px, calc(100vw - 32px)); }
.mp-consent__title { color: inherit; font: 700 18px/1.3 Montserrat, system-ui, sans-serif; margin: 0 0 8px; }
.mp-consent__msg { color: var(--mpc-muted); font-size: 14px; line-height: 1.55; margin: 0; }
.mp-consent__legal { display: flex; flex-wrap: wrap; gap: 4px 18px; list-style: none; margin: 10px 0 0 !important; padding: 0 !important; }
.mp-consent__legal li { margin: 0; padding: 0; }
.mp-consent__legal a { color: var(--mpc-fg); font-size: 13px; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.mp-consent__cats { display: grid; gap: 10px; list-style: none; margin: 4px 0 0; padding: 0; }
.mp-consent__cat { align-items: flex-start; border: 1px solid var(--mpc-line); border-radius: 8px; cursor: pointer; display: flex; gap: 14px; justify-content: space-between; margin: 0; padding: 12px 14px; }
.mp-consent__cat-title { display: block; font-size: 14px; font-weight: 700; }
.mp-consent__cat-desc { color: var(--mpc-muted); display: block; font-size: 13px; line-height: 1.5; margin-top: 2px; }
.mp-consent__cat-always { color: var(--mpc-muted); font-size: 12px; font-weight: 600; white-space: nowrap; }
.mp-consent__switch { accent-color: var(--mpc-accent); flex: none; height: 22px; margin: 0; width: 22px; }
.mp-consent__error { color: #c62828; font-size: 13px; font-weight: 600; margin: 12px 0 0; }
.mp-consent--dark .mp-consent__error { color: #ff9a9a; }
.mp-consent__actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: flex-end; margin-top: 16px; }
.mp-consent__btn { background: transparent; border: 2px solid var(--mpc-accent); border-radius: 999px; color: var(--mpc-fg); cursor: pointer; font: 600 14px/1.2 Montserrat, system-ui, sans-serif; min-height: 44px; padding: 10px 22px; }
.mp-consent__btn--main { background: var(--mpc-accent); color: var(--mpc-on-accent); }
.mp-consent__btn--ghost { border-color: transparent; text-decoration: underline; text-underline-offset: 3px; }
.mp-consent__btn:hover { filter: brightness(1.12); }
.mp-consent__btn:focus-visible, .mp-consent__switch:focus-visible, .mp-consent__legal a:focus-visible { outline: 3px solid var(--mpc-accent); outline-offset: 2px; }
.mp-consent__btn[disabled] { cursor: progress; opacity: .6; }
@media (max-width: 640px) {
  .mp-consent__box { padding: 18px 16px; }
  .mp-consent__actions { flex-direction: column-reverse; }
  .mp-consent__btn { width: 100%; }
}
/* Link "Preferenze cookie" nel footer */
.mp-consent-reopen { background: none; border: 0; color: #c3cad6; cursor: pointer; font: inherit; font-size: 12px; margin-top: 6px; padding: 4px 8px; text-decoration: underline; text-underline-offset: 3px; }
.mp-consent-reopen:hover, .mp-consent-reopen:focus-visible { color: #fff; }

/* Footer: blocco «Ufficio Stampa» nella colonna Stefania Capobianco (contenuto in content/site.json) */
.mp-footer-press { list-style: none; margin: 1.4em 0 0; }
.mp-footer-press__title { color: #fff; display: block; font-size: 15px; font-weight: 700; margin-bottom: .45em; }
.mp-footer-press__link { align-items: center; display: inline-flex; gap: .5em; }
.footer .mp-footer-press .mp-footer-press__link .mp-icon { box-sizing: content-box; flex: none; height: 15px; margin: 0; padding: 0; vertical-align: middle; width: 15px; }
/* Pagine legali di `legal.pages` non gia' linkate dalle colonne del footer */
.mp-footer-legal-links { display: flex; flex-wrap: wrap; gap: 4px 18px; justify-content: center; list-style: none; margin: 4px 0 6px; padding: 0; }
.mp-footer-legal-links a { color: #c3cad6; font-size: 12px; text-decoration: underline; text-underline-offset: 3px; }
.mp-footer-legal-links a:hover { color: #fff; }
