/* NSG Brand Thinking: stili del sito. */

/* ==== base.css ==== */

:root{
  --teal: #005A6F;
  --ink: #000000;
  --ink-80: #333333;
  --paper: #f2ede6;
  --paper-line: rgba(0, 0, 0, 0.18);
  --serif: 'Bodoni Moda', 'Didot', serif;
  --display: 'Gloock', 'Bodoni Moda', Georgia, serif;
  --sans: 'Montserrat', 'Helvetica Neue', Arial, sans-serif;
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --pad: clamp(20px, 3.2vw, 48px);
}

*, *::before, *::after{ box-sizing: border-box; }
html{ -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body{
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
img{ display: block; max-width: 100%; height: auto; }
a{ color: inherit; text-underline-offset: 0.22em; text-decoration-thickness: 1px; }
h1, h2, h3, p{ margin: 0; }
h1, h2, h3{ text-wrap: balance; }
p{ text-wrap: pretty; }
ul{ margin: 0; padding: 0; list-style: none; }
button{ font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }

::selection{ background: var(--teal); color: var(--paper); }
:focus-visible{ outline: 2px solid var(--teal); outline-offset: 3px; }
.on-teal :focus-visible, .on-dark :focus-visible{ outline-color: var(--paper); }
html{ scrollbar-color: var(--teal) var(--paper); scrollbar-width: thin; }
::-webkit-scrollbar{ width: 10px; }
::-webkit-scrollbar-track{ background: var(--paper); }
::-webkit-scrollbar-thumb{ background: var(--teal); }

.sr{ position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* language toggle */
.lang{ display: inline-flex; gap: 0.9em; font-size: 0.75rem; font-weight: 500; letter-spacing: 0.14em; }
.lang button{ opacity: 0.55; letter-spacing: inherit; padding: 0.4em 0; border-bottom: 1px solid transparent; transition: opacity .3s var(--ease); }
.lang button:hover{ opacity: 1; }
.lang button[aria-pressed="true"]{ opacity: 1; border-bottom-color: currentColor; }


@media (prefers-reduced-motion: reduce) {
  html{ scroll-behavior: auto; }
  *, *::before, *::after{ animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}

/* ==== site.css ==== */
/* Sezioni condivise dalle tre direzioni (secondo giro) */
body{ font-weight: 500; font-size: 1.02rem; }
h1, h2, h3, .display{ font-family: var(--display); font-weight: 400; letter-spacing: -0.015em; }

/* header */
.hdr{ position: fixed; inset: 0 0 auto 0; z-index: 40; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 18px var(--pad); color: var(--hdr-fg, var(--ink)); transition: background .4s var(--ease), color .4s var(--ease); }
.hdr img{ width: clamp(104px, 9vw, 136px); }
.hdr .logo-alt{ display: none; }
.hdr.is-solid{ background: var(--paper); color: var(--ink); box-shadow: 0 1px 0 var(--paper-line); }
.hdr.is-solid .logo-main{ display: none; }
.hdr.is-solid .logo-alt{ display: block; }
.hdr nav{ display: flex; align-items: center; gap: clamp(14px, 2.2vw, 34px); font-size: 0.78rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; }
.hdr nav a{ text-decoration: none; padding: 6px 0; border-bottom: 2px solid transparent; transition: border-color .3s; }
.hdr nav a:hover{ border-bottom-color: currentColor; }
.hdr .lang{ font-weight: 600; }

.btn{ display: inline-flex; align-items: center; gap: 12px; padding: 15px 26px; background: var(--teal); color: var(--paper); font-weight: 700; font-size: 0.8rem; letter-spacing: 0.12em; text-transform: uppercase; text-decoration: none; transition: background .3s var(--ease), color .3s var(--ease), transform .3s var(--ease); }
.btn:hover{ background: var(--ink); }
.btn svg{ width: 16px; height: 16px; transition: transform .4s var(--ease); }
.btn:hover svg{ transform: translateX(5px); }
.btn--paper{ background: var(--paper); color: var(--teal); }
.btn--paper:hover{ background: var(--ink); color: var(--paper); }
.btn--ink{ background: var(--ink); color: var(--paper); }
.btn--ink:hover{ background: var(--teal); }
.btn--sm{ padding: 11px 18px; font-size: 0.72rem; }
.hdr .btn{ background: var(--hdr-btn-bg, var(--teal)); color: var(--hdr-btn-fg, var(--paper)); }
.hdr .btn:hover{ background: var(--ink); color: var(--paper); }
.hdr.is-solid .btn{ background: var(--teal); color: var(--paper); }
.hdr.is-solid .btn:hover{ background: var(--ink); }
.link{ font-weight: 700; font-size: 0.8rem; letter-spacing: 0.12em; text-transform: uppercase; text-decoration: none; border-bottom: 2px solid currentColor; padding-bottom: 4px; transition: opacity .3s; }
.link:hover{ opacity: .65; }

/* sections */
.sec{ padding: clamp(72px, 10vw, 160px) var(--pad); }
.sec h2{ font-size: clamp(2.2rem, 4.2vw, 4.4rem); line-height: 1.04; max-width: 18ch; }
.lead{ font-size: clamp(1.05rem, 1.4vw, 1.3rem); max-width: 46ch; }

.proof{ background: var(--teal); color: var(--paper); padding: clamp(72px, 12vw, 190px) var(--pad); display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 48px; align-items: end; }
.proof p{ font-family: var(--display); font-size: clamp(2.2rem, 5.6vw, 6.2rem); line-height: 1.02; letter-spacing: -0.02em; max-width: 17ch; }
.proof small{ display: block; margin-top: 28px; font-family: var(--sans); font-size: 1rem; font-weight: 500; max-width: 46ch; letter-spacing: 0; }

.method{ display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(32px, 6vw, 96px); }
.steps{ display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 2px solid var(--ink); }
.step{ padding: 22px 20px 0 0; }
.step + .step{ padding-left: 20px; border-left: 1px solid var(--paper-line); }
.step h3{ font-size: clamp(1.4rem, 2vw, 2.1rem); line-height: 1.1; margin-bottom: 12px; color: var(--teal); }
.step p{ font-size: 0.95rem; color: var(--ink-80); }

.work__grid{ margin-top: clamp(36px, 5vw, 72px); display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: clamp(16px, 2.4vw, 40px); align-items: start; }
.pj{ margin: 0; }
.pj img{ width: 100%; aspect-ratio: 1; object-fit: cover; background: var(--ink-80); transition: transform .8s var(--ease); }
.pj a{ display: block; overflow: hidden; }
.pj a:hover img{ transform: scale(1.04); }
.pj figcaption{ padding-top: 16px; font-weight: 700; font-size: 1rem; }
.pj figcaption span{ display: block; font-weight: 500; font-size: 0.86rem; color: var(--ink-80); }
.pj--1{ grid-column: 1 / span 7; }
.pj--2{ grid-column: 9 / span 4; margin-top: clamp(40px, 12vw, 200px); }
.pj--3{ grid-column: 4 / span 5; }
.work__cta{ margin-top: clamp(36px, 5vw, 64px); }
.clients{ margin-top: clamp(48px, 6vw, 96px); display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); grid-auto-rows: clamp(84px, 9vw, 130px); gap: 1px; background: var(--paper-line); border-top: 1px solid var(--paper-line); border-bottom: 1px solid var(--paper-line); }
.clients li{ background: var(--paper); display: grid; place-items: center; padding: 16px; min-width: 0; }
.clients img{ width: 100%; height: 100%; object-fit: contain; filter: grayscale(1) contrast(1.1); opacity: .9; }

.blog{ background: #e9e2d8; }
.blog__head{ display: flex; justify-content: space-between; align-items: flex-end; gap: 32px; flex-wrap: wrap; }
.posts{ margin-top: clamp(36px, 5vw, 72px); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(20px, 2.6vw, 44px); }
.post{ display: flex; flex-direction: column; }
.post a{ text-decoration: none; display: flex; flex-direction: column; flex: 1; }
.post .post__ph{ overflow: hidden; background: var(--ink-80); }
.post img{ width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform .8s var(--ease); }
.post a:hover img{ transform: scale(1.05); }
.post h3{ margin-top: 20px; font-size: clamp(1.4rem, 1.9vw, 2rem); line-height: 1.1; }
.post p{ margin-top: 10px; font-size: 0.95rem; color: var(--ink-80); flex: 1; }
.post .more{ margin-top: 16px; font-weight: 700; font-size: 0.78rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--teal); }

.serv{ display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(32px, 6vw, 96px); }
.serv ul{ border-top: 2px solid var(--ink); }
.serv li{ padding: 20px 0; border-bottom: 1px solid var(--paper-line); font-family: var(--display); font-size: clamp(1.4rem, 2.3vw, 2.3rem); line-height: 1.15; }
.serv .btn{ margin-top: 36px; }

.story{ display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(32px, 6vw, 96px); background: var(--ink-80); color: var(--paper); }
.story blockquote{ margin: 0; font-family: var(--display); font-size: clamp(1.8rem, 3.2vw, 3.4rem); line-height: 1.1; letter-spacing: -0.015em; }
.story cite{ display: block; margin-top: 20px; font-family: var(--sans); font-style: normal; font-size: 0.86rem; font-weight: 700; letter-spacing: 0.08em; }
.story p{ max-width: 46ch; }
.story p + p{ margin-top: 16px; }

.foot{ background: var(--teal); color: var(--paper); padding: clamp(72px, 10vw, 150px) var(--pad) var(--pad); }
.foot h2{ max-width: 12ch; font-size: clamp(2.6rem, 6.4vw, 7rem); line-height: 1; }
.foot__row{ margin-top: 36px; display: flex; flex-wrap: wrap; gap: 20px 32px; align-items: center; }
.foot__mail{ font-family: var(--display); font-size: clamp(1.4rem, 3vw, 3.2rem); text-decoration: none; border-bottom: 2px solid var(--paper); padding-bottom: 4px; }
.foot__cols{ margin-top: clamp(56px, 8vw, 120px); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; font-size: 0.95rem; border-top: 1px solid rgba(242, 237, 230, 0.45); padding-top: 24px; }
.foot__cols strong{ display: block; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; font-size: 0.74rem; margin-bottom: 8px; }
.foot img.l{ margin-top: 56px; width: clamp(130px, 12vw, 180px); }

@media (max-width: 960px) {
  .hdr nav a:not(.btn){ display: none; }
  .method, .serv, .story{ grid-template-columns: 1fr; }
  .steps{ grid-template-columns: 1fr 1fr; }
  .step:nth-child(3){ padding-left: 0; border-left: 0; margin-top: 28px; }
  .step:nth-child(4){ margin-top: 28px; }
  .pj--1, .pj--2, .pj--3{ grid-column: 1 / -1; margin-top: 0; }
  .clients{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .posts{ grid-template-columns: 1fr; }
  .proof{ grid-template-columns: 1fr; }
  .foot__cols{ grid-template-columns: 1fr 1fr; }
}

.nsg-n1 .hdr{ background: var(--paper); box-shadow: 0 1px 0 var(--paper-line); }

.post__meta{ margin-top: 16px; font-weight: 700; font-size: 0.72rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--teal); }
.post__meta + h3{ margin-top: 8px; }

/* ==== home.css ==== */
/* Home definitiva: testata foto, quattro parole, clienti in movimento */
.nsg{ --hdr-fg: var(--paper); --hdr-btn-bg: var(--paper); --hdr-btn-fg: var(--teal); }

/* testata */
.hm{ position: relative; min-height: max(680px, 100svh); background: #0b0b0b; color: var(--paper); display: flex; align-items: flex-end; padding: 0 var(--pad) clamp(40px, 8vh, 96px); overflow: hidden; }
.hm__img{ position: absolute; top: 0; right: 0; bottom: 0; left: 18%; }
.hm__img img{ width: 100%; height: 100%; object-fit: cover; object-position: 38% 50%; }
.hm__img::after{ content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, #0b0b0b 0%, rgba(11, 11, 11, 0) 34%), linear-gradient(0deg, rgba(11, 11, 11, 0.55), rgba(11, 11, 11, 0) 45%); }
.hm__copy{ position: relative; z-index: 2; max-width: 540px; }
.hm__copy h1{ font-size: clamp(2.6rem, 4.6vw, 5rem); line-height: 1.02; }
.hm__copy p{ margin-top: 18px; max-width: 38ch; font-weight: 500; }
.hm__cta{ margin-top: 28px; display: flex; flex-wrap: wrap; align-items: center; gap: 20px 28px; }
.hm__cap{ position: absolute; z-index: 2; right: var(--pad); bottom: clamp(40px, 8vh, 96px); text-align: right; font-size: 0.86rem; font-weight: 600; max-width: 26ch; }
.hm__cap a{ text-decoration: none; border-bottom: 1px solid currentColor; }
.hm__cap span{ display: block; font-weight: 500; opacity: .85; }

/* quattro parole, fascia più bassa e foto quadrate */
.fw{ background: var(--teal); color: var(--paper); padding: clamp(56px, 7vw, 110px) var(--pad); display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 340px) minmax(0, min(28vw, 400px)); gap: clamp(24px, 3vw, 56px); align-items: center; }
.fw__intro{ grid-column: 1 / -1; font-weight: 700; font-size: 0.86rem; letter-spacing: 0.14em; text-transform: uppercase; margin-bottom: clamp(8px, 2vw, 28px); }
.fw__words{ margin: 0; padding: 0; list-style: none; }
.fw__words button{ font-family: var(--display); font-size: clamp(2.8rem, 6.6vw, 7.2rem); line-height: 1; letter-spacing: -0.02em; color: var(--paper); text-align: left; display: block; transition: color .35s var(--ease), transform .5s var(--ease); }
.fw__words button:hover, .fw__words button[aria-pressed="true"]{ color: var(--ink); transform: translateX(clamp(8px, 1.2vw, 20px)); }
.fw__desc{ max-width: 34ch; margin-left: auto; text-align: right; font-size: 1.08rem; line-height: 1.55; font-weight: 500; min-height: 9em; align-self: end; }
.fw__panel{ position: relative; aspect-ratio: 1; background: #0a4656; overflow: hidden; }
.fw__panel > *{ position: absolute; inset: 0; opacity: 0; transition: opacity .6s var(--ease); }
.fw__panel > .is-on{ opacity: 1; }
.fw__panel img{ width: 100%; height: 100%; object-fit: cover; object-position: 60% 50%; }
.fw__panel .cap{ inset: auto 0 0 0; padding: 18px 20px; background: linear-gradient(0deg, rgba(0, 0, 0, 0.72), rgba(0, 0, 0, 0)); font-weight: 600; font-size: 0.9rem; }
.fw__panel .cap span{ display: block; font-weight: 500; }
.fw__panel .card{ background: var(--paper); color: var(--ink); padding: clamp(20px, 2.4vw, 36px); display: flex; flex-direction: column; justify-content: flex-end; gap: 16px; }
.fw__panel .card p{ font-family: var(--display); font-size: clamp(1.3rem, 1.8vw, 2rem); line-height: 1.12; }

/* clienti: due righe in movimento, loghi chiari su teal, nessuna griglia */
.cl{ background: var(--ink-80); color: var(--paper); padding: clamp(56px, 7vw, 110px) 0; overflow: hidden; }
.cl h2{ padding: 0 var(--pad); font-size: clamp(2rem, 3.6vw, 3.8rem); line-height: 1.05; max-width: 20ch; }
.cl__rows{ margin-top: clamp(32px, 4vw, 64px); display: grid; gap: clamp(20px, 3vw, 44px); -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.cl__row{ display: flex; width: max-content; gap: clamp(48px, 6vw, 110px); align-items: center; animation: cl-slide 60s linear infinite; }
.cl__row--rev{ animation-direction: reverse; animation-duration: 74s; }
.cl__rows:hover .cl__row{ animation-play-state: paused; }
.cl__row img{ --lh: clamp(44px, 5.2vw, 76px); height: calc(var(--lh) * var(--s, 1)); width: auto; max-width: none; object-fit: contain; opacity: .78; transition: opacity .3s var(--ease), transform .4s var(--ease); }
.cl__row img:hover{ opacity: 1; transform: scale(1.08); }
@keyframes cl-slide { to { transform: translateX(calc(-50% - clamp(24px, 3vw, 55px))); } }

@media (max-width: 960px) {
  .hm{ flex-direction: column; justify-content: flex-start; padding-bottom: 36px; min-height: 100svh; }
  .hm__img{ position: relative; inset: auto; width: calc(100% + var(--pad) * 2); margin: 0 calc(var(--pad) * -1); height: auto; }
  .hm__img img{ height: auto; object-fit: initial; }
  .hm__img::after{ background: linear-gradient(0deg, #0b0b0b 0%, rgba(11, 11, 11, 0) 34%); }
  .hm__copy{ position: relative; z-index: 2; margin-top: -26vw; }
  .hm__cap{ display: none; }
  .fw{ grid-template-columns: 1fr; }
  .fw__desc{ text-align: left; margin-left: 0; align-self: auto; min-height: 7.4em; max-width: 46ch; }
  .fw__panel{ max-width: 420px; }
}
@media (prefers-reduced-motion: reduce) {
  .cl__row{ animation: none; flex-wrap: wrap; width: auto; padding: 0 var(--pad); justify-content: center; }
  .cl__row [aria-hidden="true"]{ display: none; }
  .cl__rows{ -webkit-mask-image: none; mask-image: none; }
}

/* equilibrio ottico tra i loghi */

/* manifesto: fascia nera a tutto peso */
.mf{ background: var(--ink); color: var(--paper); padding: clamp(96px, 13vw, 220px) var(--pad); }
.mf h2{ font-size: clamp(1.5rem, 2.2vw, 2.4rem); line-height: 1.1; color: var(--paper); margin-bottom: clamp(40px, 6vw, 96px); padding-bottom: 20px; border-bottom: 1px solid rgba(242, 237, 230, 0.35); max-width: none; }
.mf__text{ max-width: 1240px; }
.mf__text p{ font-family: var(--display); font-size: clamp(2rem, 4.9vw, 5.6rem); line-height: 1.06; letter-spacing: -0.02em; max-width: 22em; }
.mf__text p + p{ margin-top: clamp(28px, 4vw, 64px); }
.mf__text .mf__end{ margin-top: clamp(56px, 8vw, 130px); font-size: clamp(2.4rem, 6.4vw, 7.4rem); line-height: 1; max-width: 17em; color: var(--paper); }
.mf__text .mf__end::before{ content: ''; display: block; width: clamp(72px, 9vw, 140px); height: clamp(5px, 0.6vw, 9px); background: var(--teal); margin-bottom: clamp(24px, 3vw, 44px); }

/* ==== project.css ==== */
/* Pagina progetto: testata d'immagine, materiali interattivi, richiesta */
.ph{ position: relative; min-height: max(680px, 100svh); background: #0b0b0b; color: var(--paper); display: flex; align-items: flex-end; padding: 0 var(--pad) clamp(40px, 8vh, 96px); overflow: hidden; }
.ph__img{ position: absolute; top: 0; right: 0; bottom: 0; left: 16%; }
.ph__img img{ width: 100%; height: 100%; object-fit: cover; object-position: 22% 50%; }
.ph__img::after{ content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, #0b0b0b 0%, rgba(11, 11, 11, 0) 38%), linear-gradient(0deg, rgba(11, 11, 11, 0.5), rgba(11, 11, 11, 0) 40%); }
.ph__copy{ position: relative; z-index: 2; max-width: 560px; }
.ph__copy h1{ font-size: clamp(4rem, 9.2vw, 10.5rem); line-height: 0.9; letter-spacing: -0.025em; text-transform: uppercase; }
.ph__copy h1 span{ display: block; }
.ph__copy p{ margin-top: 20px; font-weight: 600; font-size: clamp(1rem, 1.3vw, 1.25rem); max-width: 30ch; }

.pi__facts{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin: 0 0 clamp(48px, 7vw, 100px); padding: 20px 0; border-top: 2px solid var(--ink); border-bottom: 1px solid var(--paper-line); }
.pi__facts dt{ font-weight: 700; font-size: 0.74rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-80); }
.pi__facts dd{ margin: 6px 0 0; font-family: var(--display); font-size: clamp(1.2rem, 1.8vw, 1.9rem); line-height: 1.15; }
.pi__facts dd span{ display: block; font-family: var(--sans); font-weight: 500; font-size: 0.86rem; color: var(--ink-80); }
.pi h2{ font-size: clamp(2.4rem, 5.2vw, 5.8rem); line-height: 1.02; max-width: 17em; }
.pi__cols{ margin-top: clamp(40px, 6vw, 88px); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(24px, 3.5vw, 56px); }
.pi__cols p{ font-size: 1.04rem; }
.pi__cols strong{ font-weight: 700; }

.eq{ background: #e9e2d8; display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(32px, 6vw, 96px); align-items: center; }
.eq__img{ margin: 0; }
.eq__img img{ width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.eq__text h2{ font-size: clamp(1.9rem, 3.4vw, 3.6rem); line-height: 1.06; }
.eq__text p{ margin-top: 20px; }
.eq__text p + p{ margin-top: 14px; }
.eq__text strong{ font-weight: 700; }

.mat{ background: var(--ink-80); color: var(--paper); }
.mat__head{ display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(24px, 6vw, 96px); align-items: end; }
.mat__head h2{ font-size: clamp(2rem, 3.8vw, 4.2rem); max-width: 16em; }
.mat__body{ margin-top: clamp(40px, 6vw, 88px); display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(24px, 5vw, 80px); align-items: start; }
.mat__list{ border-top: 1px solid rgba(242, 237, 230, 0.4); }
.mat__list li{ padding: 22px 0; border-bottom: 1px solid rgba(242, 237, 230, 0.25); cursor: pointer; opacity: .6; transition: opacity .4s var(--ease); outline-offset: 4px; }
.mat__list li.is-on, .mat__list li:hover{ opacity: 1; }
.mat__list h3{ font-size: clamp(1.5rem, 2.4vw, 2.6rem); line-height: 1.1; }
.mat__list p{ margin-top: 8px; max-width: 38ch; font-size: 0.98rem; }
.mat__inline{ display: none; }
.mat__panel{ position: sticky; top: 96px; aspect-ratio: 4 / 3; background: #222; overflow: hidden; }
.mat__panel img{ position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .6s var(--ease); }
.mat__panel img.is-on{ opacity: 1; }

.col{ display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 6vw, 96px); align-items: center; }
.col__text h2{ font-size: clamp(2rem, 3.8vw, 4.2rem); line-height: 1.04; }
.col__text p{ margin-top: 20px; max-width: 44ch; }
.col__imgs{ display: grid; gap: clamp(12px, 1.6vw, 24px); }
.col__imgs img{ width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }

.req{ background: var(--teal); color: var(--paper); display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: clamp(32px, 6vw, 96px); padding: clamp(72px, 10vw, 160px) var(--pad); align-items: start; }
.req__text h2{ font-size: clamp(2.2rem, 4.4vw, 4.8rem); line-height: 1.04; max-width: 14em; }
.req__text p{ margin-top: 24px; max-width: 42ch; font-size: 1.08rem; }
.req__form h3{ font-size: clamp(1.6rem, 2.4vw, 2.6rem); line-height: 1.1; }
.req__note{ margin-top: 8px; font-weight: 600; }
.req__grid{ margin-top: 28px; display: grid; grid-template-columns: 1fr 1fr; gap: 16px 20px; }
.req__grid .wide{ grid-column: 1 / -1; }
.req label{ display: block; }
.req label > span{ display: block; font-weight: 700; font-size: 0.74rem; letter-spacing: 0.12em; text-transform: uppercase; margin-bottom: 6px; }
.req input[type="text"], .req input[type="email"], .req textarea{ width: 100%; font: inherit; font-weight: 500; color: var(--ink); background: var(--paper); border: 2px solid transparent; padding: 14px 16px; border-radius: 0; transition: border-color .3s var(--ease); }
.req textarea{ resize: vertical; }
.req input:focus, .req textarea:focus{ outline: none; border-color: var(--ink); }
.req__check{ margin: 20px 0 26px; display: flex !important; align-items: flex-start; gap: 12px; font-size: 0.92rem; }
.req__check input{ margin-top: 4px; width: 18px; height: 18px; accent-color: var(--ink); flex: none; }
.req__check span{ display: inline !important; font-weight: 500 !important; font-size: 0.92rem !important; letter-spacing: 0 !important; text-transform: none !important; margin: 0 !important; }
.req button{ cursor: pointer; border: 0; }

.rel h2{ font-size: clamp(2rem, 3.4vw, 3.6rem); }
.rel__grid{ margin-top: clamp(32px, 4vw, 64px); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(20px, 3vw, 48px); }
.rel__card{ text-decoration: none; display: block; }
.rel__card img{ width: 100%; aspect-ratio: 16 / 9; object-fit: cover; transition: transform .8s var(--ease); }
.rel__card{ overflow: hidden; }
.rel__card:hover img{ transform: scale(1.04); }
.rel__card h3{ margin-top: 18px; font-size: clamp(1.4rem, 2vw, 2.1rem); line-height: 1.12; max-width: 22em; }
.project .work__cta{ margin-top: clamp(32px, 4vw, 56px); }

@media (max-width: 960px) {
  .ph{ flex-direction: column; justify-content: flex-start; min-height: 100svh; padding-bottom: 36px; }
  .ph__img{ position: relative; inset: auto; width: calc(100% + var(--pad) * 2); margin: 0 calc(var(--pad) * -1); height: auto; }
  .ph__img img{ height: auto; object-fit: initial; }
  .ph__img::after{ background: linear-gradient(0deg, #0b0b0b 0%, rgba(11, 11, 11, 0) 30%); }
  .ph__copy{ position: relative; z-index: 2; margin-top: -38vw; }
  .ph__copy h1{ font-size: 22vw; }
  .pi__facts, .pi__cols{ grid-template-columns: 1fr; }
  .eq, .mat__head, .mat__body, .col, .req, .rel__grid{ grid-template-columns: 1fr; }
  .mat__panel{ display: none; }
  .mat__inline{ display: block; width: 100%; margin-top: 16px; aspect-ratio: 4 / 3; object-fit: cover; }
  .mat__list li{ opacity: 1; }
  .req__grid{ grid-template-columns: 1fr; }
}

/* ==== portfolio.css ==== */
/* Portfolio: titolo enorme su una striscia di copertine in movimento, in evidenza, griglia filtrabile */
.pfh{ position: relative; min-height: max(680px, 100svh); background: #0b0b0b; color: var(--paper); padding: 112px var(--pad) 0; display: flex; flex-direction: column; overflow: hidden; }
.pfh__top{ position: relative; z-index: 2; display: flex; flex-direction: column; gap: clamp(16px, 2.4vw, 36px); }
.pfh__side{ order: -1; align-self: flex-end; max-width: 360px; }
.pfh h1{ font-size: clamp(4.4rem, 17vw, 19rem); line-height: 0.82; letter-spacing: -0.035em; text-transform: uppercase; margin-bottom: clamp(-60px, -3vw, -14px); }
.pfh__side p{ font-weight: 500; font-size: clamp(1rem, 1.2vw, 1.15rem); }
.pfh__side .hm__cta{ margin-top: 22px; }
.pfh__rail{ position: relative; flex: 1; min-height: 240px; margin: clamp(10px, 2vw, 28px) calc(var(--pad) * -1) 0; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent); mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent); }
.pfh__track{ position: absolute; left: 0; top: 0; bottom: 0; display: flex; gap: clamp(8px, 1vw, 16px); animation: pf-slide 150s linear infinite; padding-right: clamp(8px, 1vw, 16px); }
.pfh__track img{ height: 100%; width: auto; aspect-ratio: 4 / 5; object-fit: cover; flex: none; background: #1a1a1a; }
@keyframes pf-slide { to { transform: translateX(-50%); } }

.pf-featured h2{ font-size: clamp(2.4rem, 4.8vw, 5.2rem); }
.pf-feat__grid{ margin-top: clamp(32px, 5vw, 72px); display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: clamp(14px, 2vw, 32px); }
.pf-feat{ position: relative; display: block; overflow: hidden; background: #111; color: var(--paper); text-decoration: none; aspect-ratio: 4 / 3; }
.pf-feat img{ width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--ease); }
.pf-feat:hover img{ transform: scale(1.05); }
.pf-feat::after{ content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0, 0, 0, 0.78), rgba(0, 0, 0, 0) 55%); pointer-events: none; }
.pf-feat__cap{ position: absolute; z-index: 2; left: clamp(18px, 2.4vw, 36px); right: clamp(18px, 2.4vw, 36px); bottom: clamp(16px, 2.2vw, 32px); }
.pf-feat__cap h3{ font-size: clamp(1.8rem, 3.4vw, 3.8rem); line-height: 1; }
.pf-feat__cap p{ margin-top: 8px; font-weight: 500; max-width: 34ch; }
.pf-badge{ display: inline-block; margin-bottom: 12px; padding: 6px 12px; background: var(--paper); color: var(--ink); font-weight: 700; font-size: 0.7rem; letter-spacing: 0.12em; text-transform: uppercase; }
.pf-f1{ grid-column: 1 / span 7; }
.pf-f2{ grid-column: 8 / span 5; aspect-ratio: auto; }
.pf-f3{ grid-column: 1 / span 5; aspect-ratio: auto; }
.pf-f4{ grid-column: 6 / span 7; }

.pf-all{ padding-bottom: clamp(72px, 9vw, 140px); }
.pff{ position: sticky; top: 78px; z-index: 30; display: flex; align-items: center; justify-content: space-between; gap: 16px 32px; flex-wrap: wrap; padding: 14px var(--pad); background: var(--paper); border-top: 1px solid var(--paper-line); border-bottom: 1px solid var(--paper-line); }
.pff__btns{ display: flex; flex-wrap: wrap; gap: 8px; }
.pff__btns button{ padding: 10px 18px; border: 2px solid var(--ink); font-weight: 700; font-size: 0.78rem; letter-spacing: 0.1em; text-transform: uppercase; transition: background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease); }
.pff__btns button i{ font-style: normal; font-weight: 500; opacity: .6; margin-left: 4px; }
.pff__btns button:hover{ background: var(--ink); color: var(--paper); }
.pff__btns button[aria-pressed="true"]{ background: var(--teal); border-color: var(--teal); color: var(--paper); }
.pff__count{ font-weight: 700; font-size: 0.78rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-80); }

.pf-grid{ list-style: none; margin: clamp(32px, 4vw, 56px) 0 0; padding: 0 var(--pad); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(28px, 3.4vw, 56px) clamp(14px, 1.8vw, 28px); grid-auto-flow: dense; align-items: start; }
.pc[hidden]{ display: none; }
.pc a{ display: block; text-decoration: none; }
.pc__img{ overflow: hidden; background: #222; aspect-ratio: 4 / 5; }
.pc.is-wide{ grid-column: span 2; }
.pc.is-wide .pc__img{ aspect-ratio: 8 / 5.1; }
.pc__img img{ width: 100%; height: 100%; object-fit: cover; transition: transform .9s var(--ease); }
.pc a:hover .pc__img img{ transform: scale(1.06); }
.pc__c{ margin-top: 14px; font-size: clamp(1.25rem, 1.7vw, 1.8rem); line-height: 1.08; }
.pc__t{ margin-top: 4px; font-size: 0.9rem; color: var(--ink-80); max-width: 40ch; }
.pc__tags{ margin-top: 8px; font-weight: 700; font-size: 0.68rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--teal); }
.pc.in{ animation: pc-in .7s var(--ease) both; animation-delay: var(--d, 0ms); }
@keyframes pc-in { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }

.pf-cta{ background: var(--teal); color: var(--paper); padding: clamp(80px, 11vw, 180px) var(--pad); display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: clamp(32px, 6vw, 96px); align-items: end; }
.pf-cta h2{ font-size: clamp(2.8rem, 7.4vw, 8.4rem); line-height: 0.98; max-width: 10em; }
.pf-cta p{ font-size: 1.1rem; margin-bottom: 28px; max-width: 36ch; }

@media (max-width: 1100px) {
  .pf-grid{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 960px) {
  .pfh__side{ align-self: flex-start; max-width: none; }
  .pfh h1{ margin-bottom: 0; font-size: 14.4vw; }
  .pfh__rail{ min-height: 280px; }
  .pf-feat{ aspect-ratio: 4 / 3 !important; }
  .pf-f1, .pf-f2, .pf-f3, .pf-f4{ grid-column: 1 / -1; }
  .pff{ top: 70px; flex-wrap: nowrap; gap: 12px; padding: 10px var(--pad); }
  .pff__btns{ flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin: 0 calc(var(--pad) * -1); padding: 0 var(--pad); }
  .pff__btns::-webkit-scrollbar{ display: none; }
  .pff__btns button{ flex: none; padding: 8px 14px; font-size: 0.72rem; }
  .pff__count{ display: none; }
  .pf-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pc.is-wide{ grid-column: 1 / -1; }
  .pc.is-wide .pc__img{ aspect-ratio: 4 / 3; }
  .pf-cta{ grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .pfh__track{ animation: none; position: static; width: max-content; }
  .pfh__rail{ overflow-x: auto; -webkit-mask-image: none; mask-image: none; }
  .pc.in{ animation: none; }
}

/* ==== pages.css ==== */
/* Servizi e Chi siamo */

/* ---- servizi ---- */
.sv-hero{ position: relative; min-height: max(700px, 100svh); background: var(--teal); color: var(--paper); padding: 120px var(--pad) clamp(40px, 7vh, 80px); display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(24px, 4vw, 72px); align-items: end; overflow: hidden; }
.sv-hero h1{ font-size: clamp(3.4rem, 8.6vw, 10rem); line-height: 0.94; letter-spacing: -0.03em; }
.sv-hero p{ margin-top: 24px; max-width: 42ch; font-weight: 500; font-size: clamp(1rem, 1.25vw, 1.2rem); }
.sv-hero .hm__cta{ margin-top: 28px; }
.sv-hero__imgs{ position: relative; align-self: stretch; min-height: 420px; }
.sv-hero__imgs img{ position: absolute; object-fit: cover; box-shadow: 0 30px 60px rgba(0, 0, 0, 0.35); }
.sv-hero__imgs .a{ top: 0; right: 0; width: 72%; aspect-ratio: 4 / 5; }
.sv-hero__imgs .b{ bottom: 0; left: 0; width: 62%; aspect-ratio: 1; }

.sv-intro p{ font-family: var(--display); font-size: clamp(1.8rem, 3.8vw, 4.2rem); line-height: 1.1; letter-spacing: -0.015em; max-width: 24em; }

.sv-item{ display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); min-height: min(86vh, 860px); }
.sv-item:nth-child(even){ background: #e9e2d8; }
.sv-item__img{ margin: 0; overflow: hidden; }
.sv-item__img img{ width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
.sv-item:hover .sv-item__img img{ transform: scale(1.04); }
.sv-item__text{ padding: clamp(48px, 7vw, 120px) var(--pad); display: flex; flex-direction: column; justify-content: center; gap: 22px; }
.sv-item--rev .sv-item__img{ order: 2; }
.sv-item__text h2{ font-size: clamp(3.2rem, 6.6vw, 8rem); line-height: 0.92; letter-spacing: -0.03em; max-width: none; }
.sv-item__text p{ max-width: 42ch; font-size: clamp(1.02rem, 1.2vw, 1.15rem); }
.sv-chips{ display: flex; flex-wrap: wrap; gap: 8px; list-style: none; padding: 0; margin: 0; }
.sv-chips li{ padding: 8px 14px; border: 2px solid var(--ink); font-weight: 700; font-size: 0.72rem; letter-spacing: 0.1em; text-transform: uppercase; }
.sv-item__text .link{ align-self: flex-start; margin-top: 6px; color: var(--teal); }

.sv-roots{ background: var(--ink); color: var(--paper); padding: clamp(96px, 13vw, 220px) var(--pad); display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: clamp(32px, 6vw, 96px); align-items: end; }
.sv-roots h2{ font-size: clamp(3rem, 7.6vw, 9rem); line-height: 0.96; max-width: 9em; }
.sv-roots p{ font-size: 1.1rem; max-width: 36ch; margin-bottom: 28px; }

/* ---- chi siamo ---- */
.cs-hero{ position: relative; min-height: max(700px, 100svh); background: #0b0b0b; color: var(--paper); display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(24px, 4vw, 72px); align-items: end; padding: 120px 0 clamp(40px, 7vh, 80px) var(--pad); overflow: hidden; }
.cs-hero h1{ font-size: clamp(3.8rem, 9.6vw, 11.4rem); line-height: 0.9; letter-spacing: -0.03em; }
.cs-hero p{ margin-top: 24px; max-width: 34ch; font-weight: 500; font-size: clamp(1.05rem, 1.4vw, 1.35rem); }
.cs-hero .hm__cta{ margin-top: 28px; }
.cs-hero__img{ margin: 0; align-self: stretch; margin-top: 56px; }
.cs-hero__img img{ width: 100%; height: 100%; object-fit: cover; }

.cs-intro{ display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(32px, 6vw, 96px); align-items: end; }
.cs-intro h2{ font-size: clamp(2.6rem, 5.4vw, 6.2rem); line-height: 1; max-width: 12em; }
.cs-intro p{ max-width: 44ch; font-size: clamp(1.05rem, 1.3vw, 1.25rem); }
.cs-intro p + p{ margin-top: 18px; }
.cs-intro .link{ display: inline-block; margin-top: 28px; color: var(--teal); }

.cs-tone{ background: var(--teal); color: var(--paper); padding: clamp(80px, 11vw, 180px) var(--pad); }
.cs-tone h2{ font-size: clamp(1.5rem, 2.2vw, 2.4rem); margin-bottom: clamp(32px, 5vw, 72px); padding-bottom: 20px; border-bottom: 1px solid rgba(242, 237, 230, 0.4); }
.cs-tone ul{ list-style: none; margin: 0; padding: 0; }
.cs-tone li{ display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: clamp(24px, 5vw, 80px); align-items: center; padding: clamp(20px, 3vw, 44px) 0; border-bottom: 1px solid rgba(242, 237, 230, 0.3); }
.cs-tone h3{ font-size: clamp(3.4rem, 9.4vw, 11rem); line-height: 0.95; letter-spacing: -0.03em; }
.cs-tone li p{ max-width: 36ch; font-size: clamp(1rem, 1.2vw, 1.15rem); }

.cs-ws h2{ max-width: none; }

.cs-values{ background: var(--paper); color: var(--ink); padding: clamp(80px, 11vw, 180px) var(--pad); }
.cs-values h2{ font-size: clamp(3rem, 7vw, 8rem); line-height: 0.96; }
.cs-values ul{ list-style: none; margin: clamp(40px, 6vw, 88px) 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(28px, 4vw, 64px) clamp(32px, 6vw, 96px); }
.cs-values li{ padding-top: 22px; border-top: 2px solid var(--ink); }
.cs-values h3{ font-size: clamp(1.7rem, 2.6vw, 2.9rem); line-height: 1.05; color: var(--teal); }
.cs-values li p{ margin-top: 12px; max-width: 38ch; }
.cs-values__end{ margin-top: clamp(56px, 8vw, 120px); font-family: var(--display); font-size: clamp(1.8rem, 4vw, 4.4rem); line-height: 1.05; max-width: 18em; }

.cs-group{ background: var(--teal); color: var(--paper); padding: clamp(96px, 13vw, 200px) var(--pad); }
.cs-group__lead{ font-family: var(--display); font-size: clamp(2.4rem, 5.8vw, 6.8rem); line-height: 1; letter-spacing: -0.02em; max-width: 13em; }
.cs-group__cols{ margin-top: clamp(40px, 6vw, 88px); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(28px, 5vw, 80px); }
.cs-group__cols > div{ padding-top: 22px; border-top: 1px solid rgba(242, 237, 230, 0.5); }
.cs-group__cols h3{ font-size: clamp(1.8rem, 3vw, 3.2rem); }
.cs-group__cols p{ margin-top: 12px; max-width: 40ch; }
.cs-group__sub{ margin-top: clamp(40px, 6vw, 80px); font-size: 1.1rem; display: flex; flex-wrap: wrap; gap: 14px 28px; align-items: baseline; }

.servizi .req, .chisiamo .req{ background: var(--ink); }

@media (max-width: 960px) {
  .sv-hero, .cs-hero, .sv-roots, .cs-intro{ grid-template-columns: 1fr; }
  .cs-tone li, .cs-group__cols{ grid-template-columns: 1fr; }
  .sv-hero__imgs{ min-height: 360px; }
  .sv-item{ grid-template-columns: 1fr; min-height: 0; }
  .sv-item__img, .sv-item--rev .sv-item__img{ order: 0; aspect-ratio: 4 / 3; }
  .cs-hero{ padding-right: var(--pad); }
  .cs-hero__img{ aspect-ratio: 4 / 3; margin-top: 0; }
  .cs-values ul{ grid-template-columns: 1fr; }
}

.chisiamo .mf{ background: var(--teal); }
.chisiamo .mf__end::before{ background: var(--paper); }

/* ==== blog.css ==== */
/* Blog e articolo */

/* ---- elenco ---- */
.bh{ position: relative; min-height: max(700px, 100svh); background: #0b0b0b; color: var(--paper); display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: clamp(24px, 4vw, 72px); align-items: end; padding: 120px 0 clamp(40px, 7vh, 80px) var(--pad); overflow: hidden; }
.bh h1{ font-size: clamp(3.4rem, 10.4vw, 12rem); line-height: 0.8; letter-spacing: -0.035em; text-transform: uppercase; }
.bh__text p{ margin-top: 28px; max-width: 36ch; font-weight: 500; font-size: clamp(1.05rem, 1.4vw, 1.3rem); }
.bh .hm__cta{ margin-top: 28px; }
.bh__feat{ position: relative; display: block; align-self: stretch; margin-top: 56px; overflow: hidden; background: #111; color: var(--paper); text-decoration: none; }
.bh__feat img{ width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
.bh__feat:hover img{ transform: scale(1.04); }
.bh__feat::after{ content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0) 55%); pointer-events: none; }
.bh__cap{ position: absolute; z-index: 2; left: clamp(20px, 2.6vw, 40px); right: clamp(20px, 2.6vw, 40px); bottom: clamp(20px, 2.6vw, 40px); }
.bh__tag{ font-weight: 700; font-size: 0.74rem; letter-spacing: 0.12em; text-transform: uppercase; }
.bh__cap h2{ margin: 10px 0 14px; font-size: clamp(1.7rem, 3.2vw, 3.6rem); line-height: 1.04; max-width: 14em; }

.bl-all{ padding-bottom: clamp(72px, 9vw, 140px); }
.bl-grid{ list-style: none; margin: clamp(32px, 4vw, 56px) 0 0; padding: 0 var(--pad); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(32px, 4vw, 64px) clamp(16px, 2.2vw, 36px); align-items: start; }
.bc[hidden]{ display: none; }
.bc a{ display: block; text-decoration: none; }
.bc__img{ overflow: hidden; background: #222; aspect-ratio: 4 / 3; }
.bc__img img{ width: 100%; height: 100%; object-fit: cover; transition: transform .9s var(--ease); }
.bc a:hover .bc__img img{ transform: scale(1.06); }
.bc__meta{ margin-top: 16px; font-weight: 700; font-size: 0.7rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--teal); }
.bc__date{ margin-left: 10px; color: var(--ink-80); font-weight: 600; }
.bc h3{ margin-top: 8px; font-size: clamp(1.4rem, 1.9vw, 2.1rem); line-height: 1.1; max-width: 22em; }
.bc__more{ display: inline-block; margin-top: 14px; font-weight: 700; font-size: 0.76rem; letter-spacing: 0.12em; text-transform: uppercase; border-bottom: 2px solid currentColor; padding-bottom: 3px; }
.bc.in{ animation: pc-in .7s var(--ease) both; animation-delay: var(--d, 0ms); }

.nl{ background: var(--ink); color: var(--paper); display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(32px, 6vw, 96px); padding: clamp(80px, 11vw, 170px) var(--pad); align-items: start; }
.nl h2{ font-size: clamp(2.6rem, 5.4vw, 6rem); line-height: 1; max-width: 8em; }
.nl p{ margin-top: 20px; max-width: 34ch; font-size: 1.08rem; }

/* ---- articolo ---- */
.ah{ position: relative; min-height: max(640px, 92svh); background: #0b0b0b; color: var(--paper); display: flex; align-items: flex-end; padding: 0 var(--pad) clamp(40px, 8vh, 96px); overflow: hidden; }
.ah__img{ position: absolute; inset: 0; }
.ah__img img{ width: 100%; height: 100%; object-fit: cover; }
.ah__img::after{ content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(11, 11, 11, 0.92), rgba(11, 11, 11, 0.1) 62%); }
.ah__copy{ position: relative; z-index: 2; max-width: 1100px; }
.ah__meta{ font-weight: 700; font-size: 0.78rem; letter-spacing: 0.12em; text-transform: uppercase; }
.ah__meta a{ text-decoration: none; border-bottom: 2px solid currentColor; padding-bottom: 2px; }
.ah h1{ margin-top: 16px; font-size: clamp(2.8rem, 6.6vw, 7.4rem); line-height: 0.98; letter-spacing: -0.025em; }

.ab{ padding: clamp(64px, 9vw, 140px) var(--pad); }
.ab > *{ max-width: 760px; margin-left: auto; margin-right: auto; }
.ab__lead{ font-family: var(--display); font-size: clamp(1.7rem, 2.8vw, 2.9rem); line-height: 1.16; letter-spacing: -0.01em; }
.ab__logo{ margin-top: 32px; width: clamp(150px, 16vw, 220px); height: auto; }
.ab__q{ margin-top: clamp(56px, 8vw, 120px); margin-bottom: clamp(56px, 8vw, 120px); max-width: 1100px; font-family: var(--display); font-size: clamp(2.2rem, 5vw, 5.6rem); line-height: 1.04; letter-spacing: -0.02em; }
.ab__q::before{ content: ''; display: block; width: clamp(72px, 8vw, 120px); height: clamp(5px, 0.6vw, 9px); background: var(--teal); margin-bottom: clamp(20px, 2.4vw, 36px); }
.ab__text h2{ font-size: clamp(1.8rem, 3vw, 3.2rem); line-height: 1.06; margin-bottom: 20px; }
.ab__text p{ font-size: 1.12rem; line-height: 1.7; }
.ab__text p + p{ margin-top: 20px; }
.ab__duo{ margin-top: clamp(40px, 6vw, 88px); margin-bottom: clamp(40px, 6vw, 88px); max-width: 1200px; display: grid; grid-template-columns: 1fr 1fr; gap: clamp(10px, 1.4vw, 20px); }
.ab__duo img, .ab__wide img{ width: 100%; height: auto; display: block; background: #111; }
.ab__wide{ margin-top: clamp(40px, 6vw, 88px); margin-bottom: clamp(40px, 6vw, 88px); max-width: 1200px; }
.ab figcaption{ margin-top: 10px; font-size: 0.86rem; color: var(--ink-80); }
.ab .link{ color: var(--teal); }
.ab__close{ margin-top: 36px !important; font-family: var(--display); font-size: clamp(1.5rem, 2.2vw, 2.4rem) !important; line-height: 1.15 !important; letter-spacing: -0.01em; }
.ab__case{ margin-top: clamp(56px, 8vw, 120px); max-width: 1000px; display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: clamp(20px, 3vw, 48px); align-items: center; padding: clamp(18px, 2vw, 28px); background: #e9e2d8; text-decoration: none; color: inherit; }
.ab__case img{ width: 100%; aspect-ratio: 1; object-fit: cover; }
.ab__case-k{ font-weight: 700; font-size: 0.72rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--teal); }
.ab__case h3{ margin: 8px 0 14px; font-size: clamp(1.4rem, 2.2vw, 2.4rem); line-height: 1.1; }

.bl-rel{ background: #e9e2d8; }
.bl-rel h2{ font-size: clamp(2rem, 3.6vw, 4rem); }
.bl-rel__grid{ margin-top: clamp(28px, 4vw, 56px); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(20px, 3vw, 48px); }

@media (max-width: 1100px) { .bl-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 960px) {
  .bh{ grid-template-columns: 1fr; padding-right: var(--pad); }
  .bh h1{ font-size: 15vw; }
  .bh__feat{ margin-top: 0; aspect-ratio: 4 / 3; }
  .nl{ grid-template-columns: 1fr; }
  .ah{ flex-direction: column; justify-content: flex-start; min-height: 0; padding-bottom: 36px; }
  .ah__img{ position: relative; inset: auto; width: calc(100% + var(--pad) * 2); margin: 84px calc(var(--pad) * -1) 0; aspect-ratio: 16 / 9; }
  .ah__img::after{ background: linear-gradient(0deg, #0b0b0b, rgba(11, 11, 11, 0) 35%); }
  .ah__copy{ margin-top: 12px; }
  .ah h1{ font-size: 11vw; }
  .ab__duo{ grid-template-columns: 1fr; }
  .ab__case{ grid-template-columns: 1fr; }
  .bl-rel__grid{ grid-template-columns: 1fr; }
}
@media (max-width: 640px) { .bl-grid{ grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .bc.in{ animation: none; } }

.article .pf-cta{ background: var(--ink); }
.ab__logo{ margin-left: max(0px, calc(50% - 380px)); margin-right: auto; }

/* ==== Adattamenti delle pagine a contenuti modificabili ==== */
html{ scroll-padding-top: 96px; }
.nsg .sr, .nsg-skip{ position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.nsg-skip:focus{ position: fixed; z-index: 100; left: 12px; top: 12px; width: auto; height: auto; clip: auto; padding: 10px 16px; background: var(--paper); color: var(--teal); font-weight: 700; }

/* menu: le voci sono link, senza elenco visibile */
.hdr nav li{ display: contents; list-style: none; }
.hdr nav a[aria-current="page"]{ border-bottom-color: currentColor; }
.hdr nav .btn[aria-current]{ border-bottom: 0; }
.hdr nav a.btn{ border-bottom: 0; }

/* trappola anti-spam e messaggi dei moduli */
.nsg-hp{ position: absolute !important; left: -9999px; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.req__ok, .req__err{ margin: 14px 0 0; padding: 14px 16px; font-weight: 600; background: var(--paper); color: var(--ink); border-left: 6px solid var(--teal); }
.req__err{ border-left-color: #b32d2e; }
.req__form select, .req__form button{ font: inherit; }

/* titoli di pagina generici */
.gh{ background: #0b0b0b; color: var(--paper); padding: 150px var(--pad) clamp(40px, 6vw, 80px); }
.gh h1{ font-size: clamp(2.6rem, 7vw, 8rem); line-height: 0.96; letter-spacing: -0.025em; max-width: 14em; }

/* testata dei progetti: il cliente in grande, il titolo vero (H1) sotto */
.ph__copy .ph__big, .ph__big{ font-family: var(--display); font-size: clamp(3.6rem, 9.2vw, 10.5rem); line-height: 0.9; letter-spacing: -0.025em; text-transform: uppercase; margin: 0; }
.ph__big span{ display: block; }
.ph__copy .ph__big{ font-weight: 400; max-width: none; margin-top: 0; }
.ph__big--long, .ph__copy .ph__big--long{ font-size: clamp(2.6rem, 6.2vw, 7rem); }
.ph__title{ margin-top: 18px; font-family: var(--sans); font-weight: 600; font-size: clamp(1rem, 1.4vw, 1.3rem); line-height: 1.35; letter-spacing: 0; max-width: 34ch; }
.ph__copy h1{ text-transform: none; font-size: clamp(1rem, 1.4vw, 1.3rem); line-height: 1.35; }
.pi__intro{ margin-bottom: clamp(32px, 5vw, 72px); }
.rel__grid--3{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
.rel__card h3 span{ display: block; font-family: var(--sans); font-weight: 500; font-size: 0.9rem; color: var(--ink-80); margin-top: 4px; }
.sec.pi > .pi__facts:first-child{ margin-top: 24px; }

/* testo degli articoli e dei progetti (contenuto a blocchi) */
.entry > *{ max-width: 760px; margin-left: auto; margin-right: auto; }
.entry > .b-wide, .entry > .b-gallery, .entry > .nsg-embed, .entry > .nsg-embeds, .entry > .b-img.b-wide{ max-width: 1200px; }
.entry--project > *{ margin-left: 0; margin-right: 0; }
.entry--project > .b-wide, .entry--project > .b-gallery, .entry--project > .b-img, .entry--project > .nsg-embed, .entry--project > .nsg-embeds{ max-width: 100%; }
.entry--project > p, .entry--project > h2, .entry--project > h3, .entry--project > ul, .entry--project > ol{ max-width: 760px; }
.entry p, .entry li{ font-size: 1.12rem; line-height: 1.7; }
.entry p{ margin-top: 20px; }
.entry h2{ font-size: clamp(1.8rem, 3vw, 3.2rem); line-height: 1.06; margin-top: clamp(40px, 5vw, 72px); max-width: 760px; }
.entry h3{ font-size: clamp(1.4rem, 2vw, 2.1rem); line-height: 1.12; margin-top: clamp(28px, 4vw, 48px); }
.entry ul, .entry ol{ margin-top: 16px; padding-left: 1.2em; }
.entry a{ color: var(--teal); text-underline-offset: 0.2em; }
.entry strong{ font-weight: 700; }
.entry figure{ margin-top: clamp(28px, 4vw, 56px); margin-bottom: 0; }
.entry figure img{ width: 100%; height: auto; display: block; background: #111; }
.entry figcaption{ margin-top: 10px; font-size: 0.86rem; color: var(--ink-80); }
.entry .b-gallery{ gap: clamp(8px, 1.2vw, 16px); }
.entry .b-gallery figure{ margin-top: 0; }
.entry blockquote, .entry .b-quote{ margin-top: clamp(40px, 6vw, 88px); font-family: var(--display); font-size: clamp(1.8rem, 3.4vw, 3.6rem); line-height: 1.08; border: 0; padding: 0; max-width: 1100px; }
.entry blockquote::before{ content: ''; display: block; width: clamp(72px, 8vw, 120px); height: clamp(5px, 0.6vw, 9px); background: var(--teal); margin-bottom: 24px; }
.entry blockquote p{ font-size: inherit; line-height: inherit; margin: 0; }
.entry--article > p:first-child{ font-family: var(--display); font-size: clamp(1.7rem, 2.8vw, 2.9rem); line-height: 1.16; letter-spacing: -0.01em; margin-top: 0; }
.entry .nsg-embed{ position: relative; aspect-ratio: var(--ar, 16 / 9); margin-top: clamp(28px, 4vw, 56px); background: #000; }
.entry .nsg-embed iframe{ position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.bl-rel__grid{ margin-top: clamp(28px, 4vw, 56px); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(20px, 3vw, 48px); }
.foot__legal{ margin-top: 32px; font-size: 0.8rem; opacity: .8; }
.foot__legal a{ color: inherit; }
.cl__row .cl__img, .cl__row img{ --lh: clamp(44px, 5.2vw, 76px); height: calc(var(--lh) * var(--s, 1)); width: auto; max-width: none; object-fit: contain; }

@media (max-width: 960px) {
  .rel__grid--3, .bl-rel__grid{ grid-template-columns: 1fr; }
  .ph__copy .ph__big{ font-size: 22vw; }
  .ph__copy .ph__big--long{ font-size: 14vw; }
  .ph__title, .ph__copy h1{ margin-top: 14px; }
}

/* Home, quattro passi: sotto i 1180px il testo va sotto le parole */
@media (max-width: 1180px) and (min-width: 961px) {
  .fw{ grid-template-columns: minmax(0, 1fr) minmax(0, min(34vw, 380px)); }
  .fw__desc{ grid-column: 1; grid-row: 3; text-align: left; margin-left: 0; align-self: start; max-width: 46ch; }
  .fw__panel{ grid-column: 2; grid-row: 2 / span 2; }
}

/* ==== Pagina progetto: sezioni impaginate automaticamente ==== */
.pi__cols{ margin-top: clamp(32px, 5vw, 72px); }
.pi__gal{ margin-top: clamp(32px, 5vw, 64px); }
.eq--flip .eq__img{ order: 2; }
.eq--flip{ grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
.eq__more{ grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(10px, 1.4vw, 20px); }
.eq__more figure{ margin: 0; }
.eq__more img{ width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; display: block; }
.eq__text p{ font-size: 1.05rem; }
.tx__head{ display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(24px, 5vw, 80px); align-items: start; }
.tx h2{ font-size: clamp(1.9rem, 3.4vw, 3.6rem); line-height: 1.06; }
.tx__body p{ margin: 0; font-size: 1.05rem; }
.tx__body p + p{ margin-top: 16px; }
.gal__grid{ margin-top: clamp(28px, 4vw, 56px); display: grid; gap: clamp(10px, 1.4vw, 20px); }
.gal__grid--1{ grid-template-columns: minmax(0, 1fr); }
.gal__grid--1 img{ aspect-ratio: 16 / 9; }
.gal__grid--2{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
.gal__grid--3{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
.gal__grid figure{ margin: 0; }
.gal__grid img{ width: 100%; aspect-ratio: 4 / 3; height: auto; object-fit: cover; display: block; background: #111; }
.vid__media{ margin-top: clamp(28px, 4vw, 56px); position: relative; aspect-ratio: 16 / 9; background: #000; }
.vid__media figure{ position: absolute; inset: 0; margin: 0; }
.vid__media iframe, .vid__media video{ position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.mat__inline img{ width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; display: block; }
.mat__list li h3{ margin: 0; }
.mat__list p{ margin: 8px 0 0; font-size: 0.98rem; line-height: 1.55; }
.mat__head p{ margin: 0; }
.mat__panel img{ position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .6s var(--ease); }
.mat__panel img.is-on{ opacity: 1; }
@media (max-width: 960px) {
  .tx__head{ grid-template-columns: 1fr; }
  .eq--flip{ grid-template-columns: 1fr; }
  .eq--flip .eq__img{ order: 0; }
  .eq__more, .gal__grid--2, .gal__grid--3{ grid-template-columns: 1fr; }
  .mat__inline{ display: block; margin-top: 16px; }
  .mat__panel{ display: none; }
}
.eq__more figure:only-child{ grid-column: 1 / -1; }
.eq__more{ margin-top: clamp(8px, 1.4vw, 20px); }

/* ==== Testata Home a scorrimento ==== */
.hm__slide{ display: block; position: absolute; inset: 0; opacity: 0; transition: opacity 1.1s var(--ease); }
.hm__slide.is-on{ opacity: 1; z-index: 1; }
.hm__slide img{ width: 100%; height: 100%; object-fit: cover; object-position: 38% 50%; }
.hm__caps{ position: absolute; z-index: 2; right: var(--pad); bottom: clamp(40px, 8vh, 96px); text-align: right; }
.hm__caps .hm__cap{ position: static; display: none; margin: 0; }
.hm__caps .hm__cap.is-on{ display: block; }
.hm__dots{ position: absolute; z-index: 3; right: var(--pad); top: 50%; transform: translateY(-50%); display: flex; flex-direction: column; gap: 10px; }
.hm__dots button{ width: 12px; height: 12px; padding: 0; border: 2px solid var(--paper); background: transparent; border-radius: 50%; cursor: pointer; transition: background .3s var(--ease), transform .3s var(--ease); }
.hm__dots button[aria-selected="true"]{ background: var(--paper); transform: scale(1.15); }
.hm__dots button:hover{ background: rgba(242, 237, 230, 0.6); }
@media (max-width: 960px) {
  .hm__img{ aspect-ratio: var(--ar, 0.5625); height: auto; }
  .hm__slide img{ object-position: center; }
  .hm__dots{ flex-direction: row; right: auto; left: 50%; top: auto; bottom: 14px; transform: translateX(-50%); }
  .hm__caps{ display: none; }
}
.post .post__meta{ flex: none; }
.post a{ height: 100%; }

/* pulsante del menu: stessa distanza sopra/sotto e ai lati */
.hdr nav a.btn{ padding: 6px 10px; }

/* ==== Testata Home: foto a tutta larghezza, senza fascia nera; sfumatura solo dove serve al testo ==== */
@media (min-width: 961px) {
  .hm__img{ left: 0; }
  .hm__img::after{ z-index: 2; background:
    linear-gradient(90deg, rgba(11, 11, 11, 0.86) 0%, rgba(11, 11, 11, 0.55) 30%, rgba(11, 11, 11, 0) 58%),
    linear-gradient(180deg, rgba(11, 11, 11, 0.55) 0%, rgba(11, 11, 11, 0) 22%),
    linear-gradient(0deg, rgba(11, 11, 11, 0.45) 0%, rgba(11, 11, 11, 0) 38%); }
  .hm__slide img{ object-position: 50% 50%; }
}
@media (max-width: 960px) {
  .hm__img::after{ z-index: 2; }
}

/* ==== Selettore di lingua con link veri (IT / EN) ==== */
.lang a{ opacity: 0.55; letter-spacing: inherit; padding: 0.4em 0; border-bottom: 1px solid transparent; transition: opacity .3s var(--ease); text-decoration: none; }
.lang a:hover{ opacity: 1; }
.lang a[aria-current="true"]{ opacity: 1; border-bottom-color: currentColor; }

/* ==== Pagine di servizio (SEO) ==== */
.sv-eyebrow{ margin: 0 0 18px !important; max-width: none !important; font-weight: 700 !important; font-size: 0.75rem !important; letter-spacing: 0.16em; text-transform: uppercase; opacity: 0.85; }
.service .sv-hero h1{ font-size: clamp(2.6rem, 6.2vw, 7.2rem); line-height: 0.98; max-width: 14em; }
.service .sv-hero p:not(.sv-eyebrow){ max-width: 48ch; }
.svc-intro h2{ font-size: clamp(2.2rem, 4.6vw, 5rem); line-height: 1.02; max-width: 16em; }
.svc-intro__cols{ margin-top: clamp(28px, 4vw, 56px); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(20px, 3vw, 48px); }
.svc-intro__cols p{ font-size: clamp(1rem, 1.15vw, 1.12rem); line-height: 1.55; max-width: 44ch; }
.svc-points{ background: #e9e2d8; }
.svc-points ul{ list-style: none; margin: clamp(28px, 4vw, 56px) 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(28px, 3.4vw, 56px) clamp(20px, 3vw, 48px); }
.svc-points li{ border-top: 2px solid var(--ink); padding-top: 18px; }
.svc-points h3{ font-family: var(--display); font-size: clamp(1.5rem, 2.1vw, 2.2rem); line-height: 1.05; margin-bottom: 10px; }
.svc-points p{ max-width: 36ch; }
.svc-steps{ background: var(--ink); color: var(--paper); }
.svc-steps ol{ list-style: none; counter-reset: step; margin: clamp(28px, 4vw, 56px) 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(20px, 3vw, 48px); }
.svc-steps li{ counter-increment: step; border-top: 2px solid var(--paper); padding-top: 18px; }
.svc-steps li::before{ content: "0" counter(step); display: block; font-weight: 700; letter-spacing: 0.12em; font-size: 0.8rem; margin-bottom: 14px; opacity: 0.8; }
.svc-steps h3{ font-family: var(--display); font-size: clamp(1.5rem, 2.1vw, 2.2rem); line-height: 1.05; margin-bottom: 10px; }
.svc-steps p{ max-width: 30ch; }
.svc-projects .pf-grid{ padding: 0; }
.svc-projects__all{ margin-top: 28px; }
.svc-faq__list{ margin-top: clamp(24px, 3vw, 44px); max-width: 60rem; border-top: 2px solid var(--ink); }
.svc-faq details{ border-bottom: 2px solid var(--ink); }
.svc-faq summary{ cursor: pointer; list-style: none; padding: 20px 40px 20px 0; font-family: var(--display); font-size: clamp(1.25rem, 1.8vw, 1.8rem); line-height: 1.15; position: relative; }
.svc-faq summary::-webkit-details-marker{ display: none; }
.svc-faq summary::after{ content: "+"; position: absolute; right: 4px; top: 50%; transform: translateY(-50%); font-size: 1.8rem; font-weight: 500; }
.svc-faq details[open] summary::after{ content: "–"; }
.svc-faq details p{ padding: 0 0 22px; max-width: 52ch; line-height: 1.55; }
.svc-strip h2{ font-size: clamp(2rem, 3.6vw, 3.6rem); }
.svc-strip ul{ list-style: none; margin: clamp(24px, 3vw, 40px) 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.svc-strip a{ display: grid; gap: 8px; padding: 22px 24px; border: 2px solid var(--ink); text-decoration: none; position: relative; transition: background .3s var(--ease), color .3s var(--ease); }
.svc-strip a:hover{ background: var(--ink); color: var(--paper); }
.svc-strip strong{ font-family: var(--display); font-size: clamp(1.4rem, 2vw, 2rem); font-weight: 400; }
.svc-strip span{ max-width: 44ch; padding-right: 36px; }
.svc-strip svg{ position: absolute; right: 24px; top: 50%; width: 22px; height: 22px; transform: translateY(-50%); }
@media (max-width: 960px) {
  .svc-intro__cols, .svc-points ul, .svc-steps ol, .svc-strip ul{ grid-template-columns: 1fr; }
}
@media (min-width: 640px) and (max-width: 960px) {
  .svc-points ul, .svc-steps ol{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ==== Progetto con impaginazione libera: i blocchi nell'ordine dell'editor, con le sezioni del sito ==== */
.entry.entry--free{ padding: 0; }
.entry--free > *{ max-width: none; margin-left: 0; margin-right: 0; }
.entry--free > p, .entry--free > h2, .entry--free > h3, .entry--free > ul, .entry--free > ol, .entry--free > blockquote, .entry--free > .b-quote{ box-sizing: border-box; padding-left: var(--pad); padding-right: var(--pad); }
.entry--free > p, .entry--free > ul, .entry--free > ol{ max-width: calc(760px + 2 * var(--pad)); }
.entry--free > p:first-child, .entry--free > h2:first-child{ margin-top: clamp(32px, 4vw, 56px); }
.entry--free > .b-gallery, .entry--free > .b-img, .entry--free > .nsg-embed{ margin-left: var(--pad); margin-right: var(--pad); max-width: none; }
.entry--free > *:last-child{ margin-bottom: clamp(48px, 6vw, 96px); }
.entry--free .pi__cols > *{ margin-top: 0; }
.entry--free .sec.pi{ padding-bottom: 0; }
.entry--free .eq__img img{ width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.entry--free .eq__text > *{ margin-top: 0; }
.entry--free .eq__text p{ margin-top: 20px; }
.entry--free .mat h2{ font-size: clamp(2rem, 3.8vw, 4.2rem); max-width: 16em; }
.entry--free .mat h3{ font-size: clamp(1.4rem, 2.2vw, 2.4rem); line-height: 1.1; margin-top: 16px; }
.entry--free .mat .b-img img{ width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.entry--free .mat p{ margin-top: 10px; }
.entry--free .mat > p{ max-width: 52ch; margin-top: 20px; }
@media (max-width: 960px) { .entry--free .pi__cols{ grid-template-columns: 1fr; } }

/* I gruppi salvati dall'editor possono avere un contenitore interno: la griglia va applicata anche lì. */
.entry--free .eq--flip .eq__img{ order: 2; }
.entry--free > .sec.pi:first-child{ padding-top: 0; margin-top: 0; }
.sec.pi:has(+ .entry--free){ padding-bottom: 0; }
@media (max-width: 960px) {
  .entry--free .eq--flip .eq__img{ order: 0; }
}


/* ==== Newsletter nel piè di pagina ==== */
.foot__nl{ margin-top: clamp(48px, 7vw, 100px); padding-top: 32px; border-top: 1px solid rgba(242, 237, 230, 0.45); display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(24px, 5vw, 80px); align-items: start; }
.foot__nl h3{ font-size: clamp(1.9rem, 3.6vw, 3.8rem); line-height: 1.02; max-width: 12em; }
.foot__nl__text p{ margin-top: 14px; max-width: 44ch; font-size: 1rem; }
.foot__nl__row{ display: flex; gap: 12px; flex-wrap: wrap; }
.foot__nl__row input[type="email"]{ flex: 1 1 240px; min-width: 0; font: inherit; font-weight: 500; color: var(--ink); background: var(--paper); border: 2px solid transparent; padding: 14px 16px; border-radius: 0; }
.foot__nl__row input[type="email"]:focus{ outline: none; border-color: var(--ink); }
.foot__nl__check{ margin: 16px 0 0; }
.foot__nl .req__ok, .foot__nl .req__err{ margin: 0 0 14px; }
@media (max-width: 960px) { .foot__nl{ grid-template-columns: 1fr; } }

/* ==== Modulo newsletter della pagina Pensieri: stessi campi del modulo richiesta ==== */
.nl label{ display: block; }
.nl label > span{ display: block; font-weight: 700; font-size: 0.74rem; letter-spacing: 0.12em; text-transform: uppercase; margin-bottom: 6px; }
.nl input[type="text"], .nl input[type="email"], .nl textarea{ width: 100%; font: inherit; font-weight: 500; color: var(--ink); background: var(--paper); border: 2px solid transparent; padding: 14px 16px; border-radius: 0; transition: border-color .3s var(--ease); }
.nl textarea{ resize: vertical; }
.nl input:focus, .nl textarea:focus{ outline: none; border-color: var(--ink); }
.req__check span{ display: inline !important; font-weight: 500 !important; font-size: 0.92rem !important; letter-spacing: 0 !important; text-transform: none !important; margin: 0 !important; }
.nl button{ cursor: pointer; border: 0; }
.nl .req__check{ margin: 20px 0 26px; display: flex; align-items: flex-start; gap: 12px; font-size: .92rem; }
.nl .req__grid{ margin-top: 0; }

/* Footer fisso: modulo di richiesta + newsletter */
.foot__form{ margin-top: clamp(32px, 4vw, 56px); }
.foot__form .req__ok, .foot__form .req__err{ margin: 0 0 20px; }
.foot__form__cols{ display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 64px); align-items: start; }
.foot__form label{ display: block; }
.foot__form label > span{ display: block; font-weight: 700; font-size: 0.74rem; letter-spacing: 0.12em; text-transform: uppercase; margin-bottom: 6px; }
.foot__form input[type="text"], .foot__form input[type="email"], .foot__form input[type="tel"], .foot__form textarea{ width: 100%; font: inherit; font-weight: 500; color: var(--ink); background: var(--paper); border: 2px solid transparent; padding: 14px 16px; border-radius: 0; transition: border-color .3s var(--ease); }
.foot__form textarea{ resize: vertical; min-height: 9.5rem; }
.foot__form input:focus, .foot__form textarea:focus{ outline: none; border-color: var(--ink); }
.foot__form .req__grid{ margin-top: 0; }
.foot__checks{ display: flex; flex-wrap: wrap; gap: 6px 32px; margin: 16px 0 22px; }
.foot__checks .req__check{ margin: 0; }
.foot__form button{ cursor: pointer; border: 0; }
.foot__nl{ display: block; }
.foot__nl__text{ display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px clamp(24px, 4vw, 64px); }
.foot__nl__text > p{ margin: 0; max-width: 48ch; padding-bottom: 6px; }
.foot__nl__k{ display: block; margin-bottom: 10px; font-weight: 700; font-size: 0.74rem; letter-spacing: 0.12em; text-transform: uppercase; }
.foot__nl__form{ margin-top: 24px; max-width: 56%; }
@media (max-width: 960px) { .foot__form__cols{ grid-template-columns: 1fr; } .foot__nl__form{ max-width: none; } }
.foot > h2{ max-width: none; }

/* Rifiniture footer */
.foot{ padding-top: clamp(36px, 5vw, 75px); }
.foot__form__cols{ align-items: stretch; }
.foot__form .req__grid{ height: 100%; align-content: space-between; }
.foot__form .foot__msg{ display: block; }
.foot__nl{ margin-top: clamp(32px, 4vw, 56px); padding-top: clamp(28px, 3vw, 44px); }
.foot__nl__text{ flex-wrap: nowrap; }
.foot__nl__text > div{ flex: none; }
.foot__nl__text > p{ flex: 1 1 0; max-width: 80ch; }
.foot__nl + .foot__cols{ margin-top: clamp(28px, 3vw, 44px); }
@media (max-width: 960px) { .foot__nl__text{ flex-wrap: wrap; } .foot__form .req__grid{ height: auto; } }
.foot__nl__text{ align-items: flex-end; align-items: last baseline; }
.foot__nl__text > p{ padding-bottom: 0; }

/* ===== Pensieri: testata, articolo in evidenza, schede con presentazione ===== */
.pnh{ background: #0b0b0b; color: var(--paper); padding: clamp(120px, 14vw, 190px) var(--pad) clamp(40px, 5vw, 72px); }
.pnh__in{ display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 24px clamp(32px, 6vw, 96px); }
.pnh h1{ font-size: clamp(3.4rem, 11vw, 11rem); line-height: 0.85; letter-spacing: -0.035em; text-transform: uppercase; }
.pnh__side{ max-width: 400px; }
.pnh__side p{ font-weight: 500; font-size: clamp(1rem, 1.2vw, 1.15rem); }
.pnh .hm__cta{ margin-top: 22px; }

.pnf{ display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); background: #e9e2d8; color: var(--ink); }
.pnf__copy{ display: flex; flex-direction: column; justify-content: center; padding: clamp(32px, 5vw, 88px) clamp(24px, 5vw, 88px) clamp(32px, 5vw, 88px) var(--pad); }
.pnf__meta{ font-weight: 700; font-size: 0.72rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--teal); }
.pnf h2{ margin: 18px 0 22px; font-size: clamp(2rem, 3.6vw, 4rem); line-height: 1.04; }
.pnf h2 a, .pn-card h3 a{ color: inherit; text-decoration: none; }
.pnf h2 a:hover, .pn-card h3 a:hover{ text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 6px; }
.pnf__txt{ max-width: 52ch; font-size: 1rem; line-height: 1.65; }
.pnf__foot{ margin-top: 28px; display: flex; flex-wrap: wrap; align-items: center; gap: 14px 28px; }
.pnf__foot .bc__more{ margin-top: 0; }
.pnf__img{ display: block; position: relative; min-height: 420px; overflow: hidden; background: #111; }
.pnf__img img{ position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
.pnf__img:hover img{ transform: scale(1.04); }

.pn-all{ padding-top: clamp(48px, 7vw, 100px); }
.pn-all__t{ padding: 0 var(--pad); text-align: center; font-size: clamp(2.4rem, 4.6vw, 5rem); line-height: 1; margin-bottom: clamp(28px, 4vw, 56px); }
.pn-all .pff{ top: 78px; }
.pn-grid{ display: block; column-count: 3; column-gap: clamp(20px, 3vw, 48px); }
.pn-card{ break-inside: avoid; page-break-inside: avoid; margin: 0 0 clamp(36px, 4.5vw, 64px); }
.pn-card[hidden]{ display: none; }
.pn-card .pn-card__img{ display: block; overflow: hidden; background: #222; aspect-ratio: 4 / 3; }
.pn-card:nth-child(4n+2) .pn-card__img{ aspect-ratio: 3 / 4; }
.pn-card:nth-child(4n+3) .pn-card__img{ aspect-ratio: 1 / 1; }
.pn-card__img img{ width: 100%; height: 100%; object-fit: cover; transition: transform .9s var(--ease); }
.pn-card:hover .pn-card__img img{ transform: scale(1.05); }
.pn-card__top{ margin-top: 16px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.pn-card__top .bc__meta{ margin-top: 0; }
.pn-card h3{ margin-top: 10px; font-size: clamp(1.4rem, 1.9vw, 2.1rem); line-height: 1.1; }
.pn-card__txt{ margin-top: 12px; font-size: 0.95rem; line-height: 1.6; color: var(--ink-80); }

.share{ display: inline-flex; align-items: center; gap: 4px; }
.share a, .share button{ display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border: 0; border-radius: 50%; background: transparent; color: var(--ink); cursor: pointer; transition: background .25s var(--ease), color .25s var(--ease); position: relative; }
.share a:hover, .share button:hover{ background: var(--teal); color: var(--paper); }
.share .share__copy.is-done{ background: var(--teal); color: var(--paper); }
.share .share__copy.is-done::after{ content: "Link copiato"; position: absolute; top: -30px; right: 0; padding: 4px 8px; background: var(--ink); color: var(--paper); font-size: .68rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; }
.ab__share{ margin-top: 56px; padding-top: 20px; border-top: 1px solid var(--paper-line); display: flex; align-items: center; gap: 14px; font-weight: 700; font-size: .74rem; letter-spacing: .12em; text-transform: uppercase; }

@media (max-width: 1100px) { .pn-grid{ column-count: 2; } }
@media (max-width: 960px) { .pnf{ grid-template-columns: 1fr; } .pnf__img{ min-height: 0; aspect-ratio: 4 / 3; order: -1; } .pnf__copy{ padding: 32px var(--pad) 48px; } }
@media (max-width: 640px) { .pn-grid{ column-count: 1; } .pnh__side{ max-width: none; } }
.pn-card a.bc__more{ display: inline-block; }

/* Pensieri: testata e primo articolo integrati */
.pnh--feat{ display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(24px, 4vw, 72px); align-items: stretch; padding: 0 0 0 var(--pad); min-height: max(640px, 88svh); }
.pnh--feat .pnh__text{ align-self: end; padding: 140px 0 clamp(40px, 6vh, 72px); }
.pnh--feat h1{ font-size: clamp(3.2rem, 8.4vw, 9.5rem); margin-bottom: 28px; }
.pnh--feat .pnh__text > p{ max-width: 36ch; font-weight: 500; font-size: clamp(1rem, 1.2vw, 1.15rem); }
.pnh--feat .hm__cta{ margin-top: 24px; }
.pnh__feat{ position: relative; overflow: hidden; background: #111; }
.pnh__img{ position: absolute; inset: 0; display: block; }
.pnh__img img{ width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
.pnh__feat:hover .pnh__img img{ transform: scale(1.03); }
.pnh__feat::after{ content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0,0,0,.88), rgba(0,0,0,.35) 45%, rgba(0,0,0,0) 70%); pointer-events: none; }
.pnh__cap{ position: absolute; z-index: 2; left: clamp(20px, 3vw, 48px); right: clamp(20px, 3vw, 48px); bottom: clamp(24px, 3.4vw, 52px); }
.pnh__cap .pnf__meta{ color: var(--paper); }
.pnh__cap h2{ margin: 12px 0 14px; font-size: clamp(1.8rem, 3.2vw, 3.6rem); line-height: 1.04; max-width: 16em; }
.pnh__cap h2 a{ color: inherit; text-decoration: none; }
.pnh__cap h2 a:hover{ text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 6px; }
.pnh__txt{ max-width: 56ch; font-size: .98rem; line-height: 1.6; opacity: .92; }
.pnh__cap .bc__more{ color: var(--paper); }
.pnh__cap .share a, .pnh__cap .share button{ color: var(--paper); }
.pnh__cap .share a:hover, .pnh__cap .share button:hover{ background: var(--paper); color: var(--ink); }
@media (max-width: 960px) {
  .pnh--feat{ grid-template-columns: 1fr; padding: 0; min-height: 0; }
  .pnh--feat .pnh__text{ padding: 120px var(--pad) 36px; }
  .pnh__feat{ aspect-ratio: 4 / 5; }
}
.pnh__cap .bc__date, .pnh__cap .pnf__meta span{ color: var(--paper); }

/* Pensieri: primo articolo a tutto schermo, poi fascia titolo */
.pnx{ position: relative; min-height: max(640px, 100svh); background: #0b0b0b; color: var(--paper); overflow: hidden; }
.pnx__img{ position: absolute; inset: 0; display: block; }
.pnx__img img{ width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s var(--ease); }
.pnx:hover .pnx__img img{ transform: scale(1.03); }
.pnx::after{ content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0,0,0,.88), rgba(0,0,0,.3) 45%, rgba(0,0,0,.25) 100%); pointer-events: none; }
.pnx__cap{ position: absolute; z-index: 2; left: var(--pad); right: var(--pad); bottom: clamp(32px, 6vh, 72px); max-width: 880px; }
.pnx__cap .pnf__meta, .pnx__cap .bc__date, .pnx__cap .pnf__meta span, .pnx__cap .bc__more{ color: var(--paper); }
.pnx__cap h2{ margin: 14px 0 16px; font-size: clamp(2.2rem, 4.6vw, 5.2rem); line-height: 1.02; }
.pnx__cap h2 a{ color: inherit; text-decoration: none; }
.pnx__cap h2 a:hover{ text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 8px; }
.pnx__cap .share a, .pnx__cap .share button{ color: var(--paper); }
.pnx__cap .share a:hover, .pnx__cap .share button:hover{ background: var(--paper); color: var(--ink); }
.pnh{ padding: clamp(48px, 6vw, 96px) var(--pad); }
.pn-all{ padding-top: clamp(40px, 5vw, 72px); }
.pn-grid{ margin-top: 0; }

/* ===== Articolo singolo: copertina, titolo centrato, colonna laterale + testo ===== */
.ax__cover{ position: relative; height: min(78svh, 820px); min-height: 360px; background: #0b0b0b; overflow: hidden; }
.ax__cover img{ width: 100%; height: 100%; object-fit: cover; display: block; }
.ax__cover::after{ content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.55), rgba(0,0,0,0) 28%); pointer-events: none; }
.ax__head{ padding: clamp(40px, 6vw, 96px) var(--pad) 0; text-align: center; }
.ax__head h1{ max-width: 17em; margin: 0 auto; font-size: clamp(2.4rem, 5.2vw, 5.6rem); line-height: 1.02; letter-spacing: -0.02em; }
.ax__body.entry{ max-width: 1240px; margin: 0 auto; padding: clamp(40px, 6vw, 88px) var(--pad) clamp(64px, 9vw, 130px); display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 7fr); column-gap: clamp(24px, 5vw, 80px); }
.ax__body.entry > *{ grid-column: 2; max-width: none; margin-left: 0; margin-right: 0; }
.ax__body.entry > .ax__meta{ grid-column: 1; grid-row: 1; align-self: start; text-align: right; display: flex; flex-direction: column; align-items: flex-end; gap: 6px; margin-top: 6px; }
.ax__cat{ font-weight: 700; font-size: .72rem; letter-spacing: .12em; text-transform: uppercase; color: var(--teal); text-decoration: none; border-bottom: 2px solid currentColor; padding-bottom: 2px; }
.ax__date .bc__date{ margin: 0; font-weight: 600; font-size: .72rem; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-80); }
.ax__sh{ margin-top: 18px; font-weight: 700; font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; }
.ax__meta .share{ margin-right: -6px; }
.ax__body.entry > p:first-of-type{ margin-top: 0; font-family: var(--display); font-size: clamp(1.4rem, 2.1vw, 2.1rem); line-height: 1.25; letter-spacing: -0.01em; }
.ax__body.entry > p:first-of-type + p{ margin-top: 28px; }
.ax__body.entry > figure, .ax__body.entry > .b-img, .ax__body.entry > .b-gallery, .ax__body.entry > .b-wide, .ax__body.entry > .nsg-embed, .ax__body.entry > .nsg-embeds{ grid-column: 1 / -1; margin-top: clamp(36px, 5vw, 72px); }
.ax__body.entry > h2, .ax__body.entry > h3{ max-width: 760px; }

.ax__more{ max-width: 1240px; margin: 0 auto; padding: clamp(40px, 5vw, 72px) var(--pad) clamp(72px, 9vw, 130px); border-top: 1px solid var(--paper-line); }
.ax__more__head{ display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin-bottom: clamp(24px, 3vw, 40px); }
.ax__more__head h2{ font-size: clamp(1.6rem, 2.6vw, 2.6rem); line-height: 1.05; }
.ax__more__head .bc__more{ margin-top: 0; }
.ax__more__grid{ list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(20px, 3vw, 48px); }
.pn-card--min{ margin: 0; break-inside: auto; }
.pn-card--min .pn-card__img, .pn-card--min:nth-child(n) .pn-card__img{ aspect-ratio: 4 / 3; }
.pn-card--min .bc__meta{ margin-top: 14px; }
.pn-card--min h3{ margin-top: 8px; font-size: clamp(1.2rem, 1.6vw, 1.7rem); }
@media (max-width: 960px) {
  .ax__body.entry{ grid-template-columns: 1fr; }
  .ax__body.entry > *{ grid-column: 1; }
  .ax__body.entry > .ax__meta{ grid-row: auto; text-align: left; align-items: flex-start; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 10px 18px; margin-bottom: 28px; }
  .ax__sh{ margin-top: 0; }
  .ax__more__grid{ grid-template-columns: 1fr; }
}

/* Video: nessuno spazio doppio e nessuna fascia vuota intorno (la cornice è la figure, il rapporto lo dà il wrapper) */
.entry .nsg-embed iframe{ display: block; }

/* Colori e tipografia dei progetti web */
.nsg-pal{ display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: clamp(24px, 5vw, 80px); padding: clamp(32px, 4vw, 64px) var(--pad); border-top: 1px solid var(--paper-line); border-bottom: 1px solid var(--paper-line); }
.nsg-pal h3{ margin: 0; font-family: var(--sans); font-weight: 700; font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; }
.nsg-pal__sw, .nsg-pal__ty{ list-style: none; margin: 22px 0 0; padding: 0; }
.nsg-pal__sw{ display: grid; grid-template-columns: repeat(auto-fit, minmax(80px, 1fr)); gap: 12px; }
.nsg-pal__sw li{ position: relative; height: clamp(160px, 18vw, 260px); border: 1px solid var(--paper-line); background-position: center; }
.nsg-pal__sw span{ position: absolute; left: 8px; bottom: 8px; font-size: .68rem; font-weight: 600; letter-spacing: .06em; color: #fff; text-shadow: 0 0 3px rgba(0,0,0,.45); }
.nsg-pal__sw .is-light span{ color: #000; text-shadow: none; }
.nsg-pal__ty{ display: flex; flex-wrap: wrap; gap: 24px clamp(32px, 5vw, 72px); }
.nsg-pal__ty li{ display: flex; flex-direction: column; gap: 14px; }
.nsg-pal__aa{ font-family: var(--display); font-size: clamp(3.6rem, 6vw, 6.4rem); line-height: 1; }
.nsg-pal__aa.is-it{ font-style: italic; }
.nsg-pal__n{ font-size: .92rem; }
@media (max-width: 960px) { .nsg-pal{ grid-template-columns: 1fr; } }

/* ===== Case history: ritmo dei colori e immagini senza ritagli ===== */
.sec--beige{ background: #e9e2d8; }
.sec--paper{ background: var(--paper); }
.sec--ink{ background: #0b0b0b; color: var(--paper); }
.sec--teal{ background: var(--teal); color: var(--paper); }
.sec--ink a, .sec--teal a{ color: inherit; }
.gal__grid{ align-items: start; }
.gal__grid img, .gal__grid--1 img, .eq__img img, .eq__more img, .pi__gal img{ height: auto; object-fit: contain; background: transparent; }

/* Video affiancati (anche in verticale), senza fasce vuote intorno */
.vid__media--html{ aspect-ratio: auto; background: transparent; position: static; }
.nsg-embeds{ display: grid; grid-template-columns: repeat(var(--n, 1), minmax(0, 1fr)); gap: clamp(10px, 1.4vw, 20px); align-items: start; margin-top: clamp(28px, 4vw, 56px); }
.nsg-embeds--v{ justify-content: center; width: 100%; max-width: calc(var(--n, 1) * 400px + (var(--n, 1) - 1) * 20px); margin-left: auto; margin-right: auto; }
.entry > .nsg-embeds--v{ width: 100%; max-width: min(100%, calc(var(--n, 1) * 400px + (var(--n, 1) - 1) * 20px)); margin-left: auto; margin-right: auto; }
.nsg-embeds--v[style*="--n:1"]{ grid-template-columns: minmax(0, min(100%, 420px)); }
.nsg-embed{ position: relative; aspect-ratio: var(--ar, 16 / 9); background: #000; overflow: hidden; }
.nsg-embed iframe, .nsg-embed video{ position: absolute; inset: 0; width: 100%; height: 100%; border: 0; display: block; object-fit: cover; }
.vid__media--html .nsg-embeds{ margin-top: 0; }
@media (max-width: 960px) { .nsg-embeds[style*="--n:2"], .nsg-embeds[style*="--n:3"], .nsg-embeds[style*="--n:4"], .nsg-embeds[style*="--n:5"]{ grid-template-columns: 1fr 1fr; } .nsg-embeds--v[style*="--n:1"]{ grid-template-columns: minmax(0, 100%); } }

/* Immagini intere, mai tagliate (anche quelle dei social, verticali o quadrate) */
.entry--free .eq__img img, .entry--free .mat .b-img img, .mat__inline img{ aspect-ratio: auto; height: auto; object-fit: contain; }
.mat__panel img{ object-fit: contain; }
.mat__panel{ background: #1b1b1b; }
.gal__grid figure, .eq__img, .eq__more figure{ display: flex; justify-content: center; }
.gal__grid figure img, .eq__img img, .eq__more img{ max-width: 100%; }

/* Link ai servizi nei progetti */
.rl{ padding-top: clamp(40px, 5vw, 72px); padding-bottom: clamp(40px, 5vw, 72px); }
.rl h2{ font-size: clamp(1.5rem, 2.4vw, 2.4rem); line-height: 1.1; }
.rl__list{ list-style: none; margin: 22px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px 28px; }
.rl__list a{ font-weight: 600; font-size: .95rem; text-underline-offset: .22em; }

/* Manifesto: «Alcuni lavori» */
.cs-works__head{ display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(24px, 5vw, 80px); align-items: start; }
.cs-works__head h2{ font-size: clamp(1.9rem, 3.4vw, 3.6rem); line-height: 1.06; }
.cs-works__head p{ font-size: 1.05rem; line-height: 1.6; max-width: 56ch; }
.cs-works__head a{ text-underline-offset: .2em; }
@media (max-width: 960px) { .cs-works__head{ grid-template-columns: 1fr; } }

/* Blocchi del testo (articoli e pagine): immagini, gallerie, citazioni. */
.b-img { margin: 0; }
.b-img img { display: block; width: 100%; height: auto; }
.b-gallery { display: flex; flex-direction: column; gap: clamp(8px, 1.2vw, 16px); }
.b-gallery__row { display: grid; gap: clamp(8px, 1.2vw, 16px); align-items: start; }
.b-gallery .b-img { margin: 0; }
.b-gallery .b-img img { display: block; width: 100%; height: auto; aspect-ratio: auto; object-fit: contain; }
@media (max-width: 640px) { .b-gallery__row { grid-template-columns: 1fr !important; } }

/* Menu su telefono e tablet: pulsante e pannello a tutto schermo. */
.hdr__burger { display: none; position: relative; width: 44px; height: 44px; margin-right: -10px; padding: 0; background: none; border: 0; color: inherit; cursor: pointer; }
.hdr__burger span { position: absolute; left: 11px; right: 11px; height: 2px; background: currentColor; transition: transform .3s var(--ease), top .3s var(--ease); }
.hdr__burger span:nth-child(1) { top: 17px; }
.hdr__burger span:nth-child(2) { top: 25px; }
@media (max-width: 960px) {
  .hdr__burger { display: block; }
  .hdr nav { display: none; }
  .hdr.is-open { background: var(--paper); color: var(--ink); box-shadow: 0 1px 0 var(--paper-line); }
  .hdr.is-open .logo-main { display: none; }
  .hdr.is-open .logo-alt { display: block; }
  .hdr.is-open .hdr__burger span:nth-child(1) { top: 21px; transform: rotate(45deg); }
  .hdr.is-open .hdr__burger span:nth-child(2) { top: 21px; transform: rotate(-45deg); }
  .hdr.is-open nav { display: flex; position: fixed; inset: 0; z-index: -1; flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 0; padding: 92px var(--pad) 40px; overflow-y: auto; background: var(--paper); color: var(--ink); font-size: 1rem; letter-spacing: 0; text-transform: none; }
  .hdr.is-open nav a:not(.btn) { display: block; width: 100%; padding: 14px 0; border: 0; border-bottom: 1px solid var(--paper-line); font-family: var(--display); font-weight: 400; font-size: clamp(1.9rem, 8vw, 2.8rem); line-height: 1.1; letter-spacing: -0.01em; }
  .hdr.is-open nav a[aria-current="page"] { color: var(--teal); }
  .hdr.is-open nav a.btn { margin-top: 32px; padding: 14px 22px; font-size: .82rem; letter-spacing: .12em; text-transform: uppercase; background: var(--teal); color: var(--paper); }
  .hdr.is-open .lang { display: flex; gap: 18px; margin-top: 28px; font-size: .86rem; letter-spacing: .12em; }
  .hdr.is-open nav .lang a { width: auto; padding: 4px 0; border: 0; font-family: var(--sans); font-weight: 600; font-size: .86rem; letter-spacing: .12em; text-transform: uppercase; }
  .hdr.is-open nav .lang a[aria-current="true"] { border-bottom: 2px solid currentColor; }
  body.nav-open { overflow: hidden; }
}

/* Banner dei cookie. */
.foot__cookie, .foot__legal .iubenda-embed { margin-left: 12px; }
.foot__cookie, .foot__legal .iubenda-nostyle { color: inherit; text-decoration: underline; }

/* reCAPTCHA: il distintivo di Google è nascosto, al suo posto la nota obbligatoria sotto il modulo */
.grecaptcha-badge{ visibility: hidden; }
.rc__note{ margin: 12px 0 0; font-size: .72rem; line-height: 1.5; opacity: .7; }
.rc__note a{ text-decoration: underline; }

/* Promemoria per chi è collegato al pannello mentre il sito è in manutenzione. */
.maint-note{ position: fixed; z-index: 100; left: 16px; bottom: 16px; padding: 10px 16px; background: var(--ink); color: var(--paper); font-size: .78rem; font-weight: 600; letter-spacing: .02em; text-decoration: none; box-shadow: 0 8px 24px rgba(0, 0, 0, .28); }
.maint-note:hover{ background: var(--teal); }