/* MG Digital — foglio condiviso di tutte le pagine pubbliche, revisione 19
   (22 settembre 2026). Tiene in un posto solo la tavolozza, i caratteri, la
   testata, il piè di pagina e i pulsanti; sotto, le regole delle pagine
   interne (catalogo, scheda prodotto, percorso) riprese dalla revisione 14.
   Si carica per ultimo su ogni pagina; sulla home lo segue claude-home.css.
   Misure del marchio: release/claude/04-MARCHIO.md. */

@font-face{font-family:'MG Indice';src:url('../fonts/BarlowCondensed-Bold.woff2') format('woff2'),url('../fonts/BarlowCondensed-Bold.ttf') format('truetype');font-weight:700;font-style:normal;font-display:swap}

html:has(body.mg-site){background:#fbfbfa}
html:not(.js) .js-only{display:none!important}

body.mg-site{
  /* Colori: inchiostro e blu sono quelli della sigla (04-MARCHIO); il campo
     profondo è quello dell'immagine di condivisione; la carta è il fondo
     storico del sito e serve per le sezioni alternate. */
  --bg:#fbfbfa;
  --surface:#ffffff;
  --paper:#f5f4ee;
  --ink:#1d2631;
  --ink-2:#4c5763;
  --ink-3:#6b7680;
  --muted:#4c5763;
  --line:#e4e3de;
  --blue:#175edd;
  --field:#0f3f96;
  --lime:#e8ef9e;
  --clay:#9c4229;
  --verify:#9c4229;
  --index-face:'MG Indice','Arial Narrow',Arial,sans-serif;
  --cut:polygon(19% 0,100% 0,81% 100%,0 100%);
  --r:12px;
  --r-s:8px;
  --r-b:6px;
  --sh:0 1px 2px rgba(29,38,49,.05),0 18px 40px -16px rgba(29,38,49,.18);
  --sh-s:0 1px 2px rgba(29,38,49,.05),0 8px 20px -10px rgba(29,38,49,.14);
  background:var(--bg);color:var(--ink);
  font-family:'Instrument Sans',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;
  font-size:17px;line-height:1.6;letter-spacing:-.006em;
}
.mg-site :is(h1,h2,h3){font-family:inherit;font-weight:500;letter-spacing:-.038em}
.mg-site em{color:inherit}
.mg-site .brand-stroke{aspect-ratio:4.4;height:auto;clip-path:var(--cut)}
.mg-site :is(a,button,summary,input,select,textarea):focus-visible{outline:3px solid var(--blue);outline-offset:4px}
.mg-site .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Testata: ferma in alto, sul fondo della pagina, un filetto sotto. */
.mg-site .site-header{position:sticky;top:0;z-index:30;min-height:76px;border-bottom:1px solid var(--line);background:var(--bg);width:100%;padding-inline:max(56px,calc((100% - 1328px) / 2))}
.mg-site .site-header.wrap{width:100%}
@media(max-width:1000px){.mg-site .site-header{padding-inline:32px}}
@media(max-width:640px){.mg-site .site-header{padding-inline:20px}}
.mg-site .brand img{width:182px}
.mg-site .desktop-nav{gap:30px;font-size:15px}
.mg-site .desktop-nav>a:not(.button){color:var(--ink-2)}
.mg-site .desktop-nav>a:not(.button):hover{color:var(--ink)}
.mg-site .desktop-nav>a:not(.button):after{display:none}
.mg-site .edition-mobile summary{font-size:15px}
.mg-site .edition-mobile nav{background:var(--bg);border-color:var(--line);box-shadow:0 18px 24px -12px rgba(29,38,49,.18)}

/* Pulsanti: rettangolo con raggio piccolo, inchiostro; blu al passaggio.
   Il blu resta il colore di ciò che si clicca (02-DIREZIONE-GRAFICA). */
.mg-site .button{border-radius:var(--r-b);border:0;background:var(--ink);color:#fff;min-height:48px;padding:12px 20px;gap:16px;font-size:15px;font-weight:500;box-shadow:none;transition:background .18s,color .18s}
.mg-site .button:hover{background:var(--blue);color:#fff;transform:none}
.mg-site .button .arrow{font-size:20px}
.mg-site .desktop-nav .button{min-height:42px;font-size:14px;padding:10px 16px}
.mg-site .button-outline{background:transparent;color:var(--ink);border:1px solid var(--ink)}
.mg-site .button-outline:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
.mg-site .plain-link{color:var(--blue);font-size:15.5px;border:0;font-weight:500}
.mg-site .plain-link:hover{text-decoration:underline;text-underline-offset:4px}

/* Piè di pagina */
.mg-site .site-footer{background:var(--ink);color:#e6eaee;padding-top:64px}
.mg-site .footer-layout p,.mg-site .footer-bottom{color:#9aa6b1}
.mg-site .footer-bottom{border-top-color:#35404b}
.mg-site .footer-bottom .brand-stroke{background:var(--lime);width:46px}

/* Etichette: il taglio del marchio al posto del pallino blu */
.mg-site .eyebrow{display:flex;align-items:center;gap:9px;font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}
.mg-site .eyebrow::before{content:"";width:20px;height:5px;background:var(--blue);clip-path:var(--cut);flex:none}
.mg-site .dark-section .eyebrow{color:#9aa6b1}
.mg-site .dark-section .eyebrow::before{background:#9dc0ff}
.mg-site .law-note .eyebrow::before{background:var(--clay)}

/* Numerazioni: la condensata, e solo qui */
.mg-site :is(.catalog-number,.sheet-number,.benefit-number,.family-number){font-family:var(--index-face);font-weight:700;color:var(--ink-3);font-variant-numeric:tabular-nums}
.mg-site .catalog-number{font-size:22px;line-height:.9;padding:0;align-self:flex-start}
.mg-site .sheet-number{font-size:32px}

/* Barra della selezione e finestre */
.mg-site .selection-bar{border-radius:var(--r-s);background:var(--ink)}
.mg-site .selection-bar a{border-radius:var(--r-b)}

/* ── Catalogo: venti schede, non venti righe ────────────────── */
.mg-site .catalog-page .section{padding-block:56px 84px}
.mg-site .catalog-heading h1{font-size:clamp(32px,4.2vw,60px);line-height:1.05}
.mg-site .catalog-heading em{color:inherit}
.mg-site .catalog-tools{margin-block:34px 26px}
.mg-site .catalog-tools label{display:block;font-size:13px;color:var(--ink-3)}
.mg-site #catalog-search{width:100%;margin-top:10px;padding:15px 20px;border:1px solid var(--line);border-radius:var(--r-s);background:var(--surface);font-size:16px;box-shadow:var(--sh-s)}
.mg-site #catalog-search:focus{outline:2px solid var(--blue);outline-offset:2px;border-color:transparent}
.mg-site .filter-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.mg-site .filter-list button{border:1px solid var(--line);background:var(--surface);border-radius:var(--r-b);padding:9px 16px;font-size:13.5px;color:var(--ink-2);transition:background .16s,color .16s,border-color .16s}
.mg-site .filter-list button:hover{border-color:var(--ink-3)}
.mg-site .filter-list button[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:#fff}
.mg-site [data-result-count]{margin-top:16px;font-size:13px;color:var(--ink-3)}
.mg-site .catalog-list{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:26px}
.mg-site .catalog-row{display:flex;flex-direction:column;align-items:stretch;text-align:left;gap:10px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:24px 26px 22px;transition:box-shadow .16s,border-color .16s}
.mg-site .catalog-row:hover{border-color:transparent;box-shadow:var(--sh);transform:none}
.mg-site .catalog-row small{font-size:11.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-3)}
.mg-site .catalog-row h2{font-size:21px;margin-top:6px;letter-spacing:-.03em}
.mg-site .catalog-row>p{font-size:15.5px;line-height:1.5;color:var(--ink-2);flex:1}
.mg-site .catalog-actions{display:flex;flex-direction:row;justify-content:space-between;align-items:center;text-align:left;gap:14px;margin-top:auto;padding-top:14px;border-top:1px solid var(--line);font-size:13.5px}
.mg-site .catalog-actions>*{margin:0}
.mg-site .catalog-actions a{color:var(--ink);font-weight:500}
.mg-site .select-button{border:0;background:transparent;color:var(--ink-3);font-size:13px;display:inline-flex;align-items:center;gap:6px}
.mg-site .select-button:hover,.mg-site .select-button[aria-pressed=true]{color:var(--blue)}
.mg-site .catalog-help{margin-top:52px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:34px 36px;box-shadow:var(--sh-s)}
.mg-site .catalog-help h2{font-size:26px}
.mg-site .catalog-help p{color:var(--ink-2);margin:10px 0 22px}

/* ── Scheda prodotto ───────────────────────────────────────── */
.mg-site .product-hero{padding-block:38px 56px}
.mg-site .back-link{font-size:14px;color:var(--ink-3)}
.mg-site .product-hero-heading h1,.mg-site .product-title-display{font-size:clamp(32px,4vw,58px);line-height:1.05;letter-spacing:-.042em}
.mg-site .product-title-lead{display:block;font-size:.68em;line-height:1.1;margin-block:6px}
.mg-site .product-hero-heading>p{font-size:17px;line-height:1.6;color:var(--ink-2);max-width:52ch;margin:22px 0 26px}
.mg-site .product-hero-visual :is(.film,.hours-demo,.book-scene){border:0;border-radius:var(--r);overflow:hidden;box-shadow:var(--sh)}
.mg-site .product-hero-visual .book-scene{background:#f4f4f1;min-height:0;padding:46px 34px;transform:none!important}
.mg-site .product-audience{font-size:13px;color:var(--ink-3);padding-top:20px;border-top:1px solid var(--line)}
.mg-site .product-nav{background:var(--bg);border-block:1px solid var(--line)}
.mg-site .product-nav>.wrap{font-size:14px;gap:26px}
.mg-site .product-nav a{color:var(--ink-2)}
.mg-site .product-nav a:hover{color:var(--ink)}
.mg-site :is(.changes-section,.use-cases,.launch-section,.detail-editorial) h2,.mg-site .functions-section .section-heading h2{font-size:clamp(28px,3.2vw,44px);line-height:1.06}
.mg-site .changes-section dl{display:grid;gap:10px}
.mg-site .changes-section dl>div{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-s);padding:20px 24px}
.mg-site .changes-section dt{font-size:16.5px;font-weight:500}
.mg-site .changes-section dd{font-size:15.5px;line-height:1.5;color:var(--ink-2);margin-top:6px}
.mg-site .functions-section{background:var(--surface);border-block:1px solid var(--line)}
.mg-site .dark-section{background:var(--ink);color:#dfe5ea}
.mg-site .dark-section :is(h2,h3,b,strong){color:#fff}
.mg-site .dark-section :is(p,li,small){color:#a7b4bf}
.mg-site .tour-display{border-radius:var(--r);overflow:hidden;box-shadow:var(--sh)}
.mg-site .tour-rail button{border-radius:var(--r-s)}
.mg-site .use-case-row{display:block;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:24px 26px;margin-top:10px;transition:box-shadow .16s,border-color .16s}
.mg-site .use-case-row:hover{border-color:transparent;box-shadow:var(--sh)}
.mg-site .use-case-row h3{font-size:20px}
.mg-site .use-case-row p{font-size:15.5px;line-height:1.5;color:var(--ink-2);margin-top:8px}
.mg-site .launch-section em{color:inherit}
.mg-site .faq-list details{border-top:1px solid var(--line)}
.mg-site .faq-list summary{padding:17px 0;font-size:16px;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:20px;align-items:center}
.mg-site .faq-list summary::-webkit-details-marker{display:none}
.mg-site .faq-list summary::after{content:"+";color:var(--blue);font-size:19px}
.mg-site .faq-list details[open] summary::after{content:"\2212"}
.mg-site .faq-list p{font-size:15.5px;line-height:1.65;color:var(--ink-2);padding-bottom:18px;max-width:66ch}

/* Funzioni per beneficio (data/product-benefits.php) */
.mg-site .benefit-blocks{border-top:1px solid var(--line)}
.mg-site .benefit-block{display:grid;grid-template-columns:auto minmax(0,.9fr) minmax(0,1.1fr);gap:40px;padding:30px 0;border-bottom:1px solid var(--line);align-items:start}
.mg-site .benefit-number{font-size:30px;line-height:.85;padding-top:4px}
.mg-site .benefit-block>div{display:contents}
.mg-site .benefit-block h3{font-size:clamp(20px,1.8vw,26px);line-height:1.14;margin:0}
.mg-site .benefit-block p{font-size:16px;line-height:1.6;color:var(--ink-2);margin:0;max-width:62ch}
.mg-site .benefit-block small{grid-column:3;display:block;margin-top:14px;font-size:12.5px;line-height:1.5;color:var(--ink);padding-left:15px;border-left:3px solid var(--blue)}
.mg-site .feature-sheet{margin-top:32px;border-top:1px solid var(--line)}
.mg-site .feature-sheet>summary{cursor:pointer;padding:20px 0;font-size:15px;font-weight:600;list-style:none;display:flex;justify-content:space-between;align-items:center}
.mg-site .feature-sheet>summary::-webkit-details-marker{display:none}
.mg-site .feature-sheet>summary::after{content:"+";font-size:19px;color:var(--blue)}
.mg-site .feature-sheet[open]>summary::after{content:"\2212"}
.mg-site .feature-list li{border-top:1px solid var(--line);font-size:15.5px}

/* ── Percorso (soluzioni.php) ──────────────────────────────── */
.mg-site .sg-main{background:var(--bg)}
.mg-site .sg-intro h1{font-size:clamp(32px,4.2vw,60px);line-height:1.05}
.mg-site .sg-eyebrow{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}
.mg-site .sg-workspace label,.mg-site .sg-option{border-radius:var(--r-s)}
.mg-site .sg-button{border-radius:var(--r-b);background:var(--ink);color:#fff;border:0;padding:13px 24px}
.mg-site .sg-button:hover{background:var(--blue)}
.mg-site .sg-result-heading h1{font-size:clamp(28px,3.4vw,46px);line-height:1.06}
.mg-site .sg-scope-section,.mg-site .sg-preview{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:26px 28px}
.mg-site .sg-preview{overflow:hidden}
.mg-site .sg-scope-section h2{font-size:19px}
.mg-site .sg-scope-section li{font-size:15.5px;line-height:1.5}
.mg-site .sg-to-define li>span{color:var(--verify)}
.mg-site .sg-scope-section:not(.sg-to-define) li>span{color:var(--blue)}

@media(max-width:1000px){
  .mg-site .catalog-list{grid-template-columns:repeat(2,1fr)}
  .mg-site .benefit-block{grid-template-columns:auto minmax(0,1fr);gap:14px 26px}
  .mg-site .benefit-block :is(h3,p,small){grid-column:2}
}
@media(max-width:640px){
  .mg-site .catalog-list{grid-template-columns:1fr}
  .mg-site .benefit-block{grid-template-columns:1fr;gap:10px}
  .mg-site .benefit-block :is(h3,p,small){grid-column:1}
}
@media(prefers-reduced-motion:reduce){ .mg-site *{transition:none!important;animation:none!important;scroll-behavior:auto!important} }