/* ==========================================================================
   Falegnameria ADN — foglio di stile principale
   Il layout è progettato su 1200px di larghezza (1rem = 16px a 1200px) e
   scala in modo proporzionale sui desktop: la home resta fedele al design.
   ========================================================================== */

:root {
  --gold: #a8875a;
  --gold-600: #8f7148;
  --gold-300: #c8aa7c;
  --gold-200: #dcc6a3;
  --gold-100: #efe4d2;
  --ink: #1f1813;
  --ink-2: #2c231c;
  --text: #3b342e;
  --muted: #6d665f;
  --muted-2: #8a837b;
  --paper: #f5f3f0;
  --paper-2: #f3f1ee;
  --sand: #ece5dc;
  --sand-2: #e6ddd1;
  --line: #ddd5ca;
  --cream: #f3ece2;
  --dark: #1b130e;
  --white: #fff;

  --f-serif: "Gilda Display", "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --f-sans: "Montserrat", "Helvetica Neue", Arial, sans-serif;
  --f-script: "Mrs Saint Delafield", "Brush Script MT", cursive;

  --container: 68.75rem;          /* 1100px @1200 */
  --gutter: 3.125rem;             /* 50px @1200 */
  --header-h: 5.9rem;
  --ease: cubic-bezier(.2, .7, .2, 1);
  --radius: 2px;
  --shadow: 0 18px 50px -20px rgba(30, 20, 10, .35);
}

html { font-size: 16px; scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (min-width: 1000px) { html { font-size: clamp(13.4px, 1.3334vw, 20px); } }

*, *::before, *::after { box-sizing: border-box; }
body {
  margin: 0;
  font-family: var(--f-sans);
  font-size: .875rem;
  line-height: 1.5;
  color: var(--text);
  background: var(--paper);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}
img, svg, video, canvas { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
h1, h2, h3, h4 { font-family: var(--f-serif); font-weight: 400; margin: 0; color: var(--ink); line-height: 1.1; }
p { margin: 0 0 1em; }
address { font-style: normal; }
[hidden] { display: none !important; }
::selection { background: var(--gold-200); color: var(--ink); }

.skip-link { position: absolute; left: -999px; top: 0; z-index: 999; background: var(--gold); color: #fff; padding: .6rem 1rem; }
.skip-link:focus { left: 1rem; top: 1rem; }
:focus-visible { outline: 2px solid var(--gold-300); outline-offset: 3px; }

.container { width: 100%; max-width: calc(var(--container) + var(--gutter) * 2); margin: 0 auto; padding: 0 var(--gutter); }
.sr-only { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- Bottoni ---------- */
.btn {
  --h: 2.35rem;
  display: inline-flex; align-items: center; justify-content: center; gap: .7rem;
  min-height: var(--h); padding: 0 1.3rem;
  border: 1px solid transparent; border-radius: var(--radius);
  font-family: var(--f-sans); font-size: .69rem; font-weight: 500; letter-spacing: .12em; text-transform: uppercase;
  line-height: 1; white-space: nowrap;
  transition: background-color .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease), transform .3s var(--ease), box-shadow .3s var(--ease);
}
.btn .arrow { width: .8rem; height: .55rem; fill: none; stroke: currentColor; stroke-width: 1.3; transition: transform .3s var(--ease); }
.btn:hover .arrow { transform: translateX(3px); }
.btn--gold { background: var(--gold); color: #fff; border-color: var(--gold); }
.btn--gold:hover { background: var(--gold-600); border-color: var(--gold-600); }
.btn--outline { border-color: var(--gold); color: var(--gold-600); background: transparent; }
.btn--outline:hover { background: var(--gold); color: #fff; }
.btn--outline-light { border-color: rgba(255,255,255,.5); color: #fff; }
.btn--outline-light:hover { background: #fff; color: var(--ink); }
.btn--ghost-dark { border-color: var(--line); color: var(--text); background: #fff; }
.btn--ghost-dark:hover { border-color: var(--ink); }
.btn--lg { --h: 2.7rem; padding: 0 1.8rem; font-size: .75rem; }
.btn--block { width: 100%; }
.linklike { background: none; border: 0; padding: 0; color: inherit; text-decoration: underline; text-underline-offset: 2px; font-size: inherit; }

.eyebrow {
  display: block; margin: 0 0 .75rem;
  font-size: .69rem; font-weight: 500; letter-spacing: .42em; text-transform: uppercase; color: var(--gold-300);
}
.eyebrow--dark { color: var(--gold); }
.badge { display: inline-block; padding: .2rem .45rem .15rem; background: var(--gold); color: #fff; font-size: .55rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }

/* ---------- Header ---------- */
.site-header {
  position: fixed; inset: 0 0 auto; z-index: 100;
  height: var(--header-h);
  transition: background-color .4s var(--ease), height .4s var(--ease), box-shadow .4s var(--ease), backdrop-filter .4s;
}
.site-header__inner {
  height: 100%; display: flex; align-items: center;
  padding: 0 4.4rem 0 4.25rem;
}
.brand { display: block; flex: 0 0 auto; width: 8.6rem; margin-top: .2rem; transition: width .4s var(--ease); }
.brand img { width: 100%; height: auto; }
.main-nav { flex: 1; display: flex; justify-content: center; }
.main-nav ul { display: flex; gap: clamp(1.15rem, 2.3vw, 2.2rem); margin: 0 1.4rem; padding: 0; list-style: none; }
.main-nav li { white-space: nowrap; }
.main-nav a {
  position: relative; display: block; padding: .4rem 0;
  font-size: .78rem; font-weight: 400; color: #f4eee6; letter-spacing: .03em;
  transition: color .25s;
}
.main-nav a::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: .1rem; height: 1px;
  background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform .35s var(--ease);
}
.main-nav a:hover::after, .main-nav a.is-active::after { transform: scaleX(1); }
.main-nav a.is-active { color: #fff; }
.btn--header { --h: 2.4rem; padding: 0 1.25rem; font-size: .68rem; letter-spacing: .1em; margin-left: 1rem; }

.site-header.is-scrolled, .site-header--solid {
  background: rgba(27, 19, 14, .94);
  -webkit-backdrop-filter: saturate(1.2) blur(10px); backdrop-filter: saturate(1.2) blur(10px);
  box-shadow: 0 10px 30px -18px rgba(0,0,0,.6);
}
.site-header.is-scrolled { height: 4.4rem; }
.site-header.is-scrolled .brand { width: 6.6rem; }

.nav-toggle { display: none; margin-left: auto; width: 44px; height: 44px; border: 0; background: none; position: relative; }
.nav-toggle span { position: absolute; left: 11px; right: 11px; height: 1.5px; background: #fff; transition: transform .35s var(--ease), opacity .2s; }
.nav-toggle span:nth-child(1) { top: 15px; } .nav-toggle span:nth-child(2) { top: 21px; } .nav-toggle span:nth-child(3) { top: 27px; }
.nav-open .nav-toggle span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.nav-open .nav-toggle span:nth-child(2) { opacity: 0; }
.nav-open .nav-toggle span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

.mobile-menu {
  position: fixed; inset: 0; z-index: 90; padding: 96px 28px 32px;
  background: rgba(22, 15, 11, .98); color: #fff;
  display: flex; flex-direction: column; gap: 28px; overflow-y: auto;
  animation: fadeIn .3s var(--ease);
}
.mobile-menu nav { display: flex; flex-direction: column; }
.mobile-menu nav a { font-family: var(--f-serif); font-size: 28px; padding: 10px 0; border-bottom: 1px solid rgba(255,255,255,.08); }
.mobile-menu nav a.is-active { color: var(--gold-300); }
.mobile-menu__contacts { display: flex; flex-direction: column; gap: 8px; font-size: 14px; color: rgba(255,255,255,.7); }
body.nav-open { overflow: hidden; }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }

/* ---------- HERO (home) ---------- */
.hero {
  position: relative; isolation: isolate;
  min-height: 26rem; height: 34.6vw; max-height: 52rem;
  color: #fff; overflow: hidden; background: #1a120d;
}
.hero__media { position: absolute; inset: 0; z-index: -2; }
.hero__media img { width: 100%; height: 100%; object-fit: cover; object-position: 60% 50%; transform: scale(1.04); animation: heroZoom 14s var(--ease) forwards; }
@keyframes heroZoom { to { transform: scale(1); } }
/* più foto: dissolvenza automatica con zoom lento */
.hero__media.is-slides img { position: absolute; inset: 0; opacity: 0; animation: none; transform: none; transition: opacity 1.1s ease; }
/* avvicinamento lento e costante per tutta la durata della foto (4 s + dissolvenza) */
.hero__media.is-slides img.is-on { opacity: 1; animation: heroPush 5.2s linear forwards; }
.hero__media.is-slides img.is-off { opacity: 0; animation: heroPush 5.2s linear forwards; }
@keyframes heroPush { from { transform: scale(1); } to { transform: scale(1.06); } }
/* barre di avanzamento delle foto */
.hero__cap { position: absolute; left: 47%; bottom: 1.6rem; z-index: 2; }
/* testi che cambiano con la foto */
.hero__content.is-out > * { animation: heroOut .45s cubic-bezier(.4,0,.2,1) forwards; }
.hero__content.is-in > * { opacity: 0; animation: heroIn .8s cubic-bezier(.2,.8,.2,1) forwards; }
.hero__content.is-in > :nth-child(1) { animation-delay: 0s; }
.hero__content.is-in > :nth-child(2) { animation-delay: .08s; }
.hero__content.is-in > :nth-child(3) { animation-delay: .32s; }
.hero__content.is-in > :nth-child(4) { animation-delay: .44s; }
.hero__content.is-in h1 { opacity: 1; animation: none; }
.hero h1 .hw { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .06em; }
.hero h1 .hw > span { display: inline-block; transform: translateY(105%); animation: heroWord .8s cubic-bezier(.2,.8,.2,1) forwards; }
.hero .eyebrow .ec { display: inline-block; opacity: 0; animation: heroSub .5s ease forwards; }
@keyframes heroOut { to { opacity: 0; transform: translateY(-14px); filter: blur(4px); } }
@keyframes heroIn { from { opacity: 0; transform: translateY(16px); filter: blur(4px); } to { opacity: 1; transform: none; filter: none; } }
@keyframes heroWord { to { transform: none; } }
@keyframes heroSub { to { opacity: 1; } }
.hero__bars { display: flex; gap: .4rem; }
.hero__bars button { position: relative; width: 2.4rem; height: 14px; padding: 0; border: 0; background: none; cursor: pointer; }
.hero__bars button::before { content: ""; position: absolute; left: 0; right: 0; top: 6px; height: 2px; background: rgba(255,255,255,.3); border-radius: 2px; }
.hero__bars button i { position: absolute; left: 0; top: 6px; height: 2px; width: 0; background: var(--gold-200); border-radius: 2px; }
.hero__bars button.is-done i { width: 100%; }
.hero__bars button.is-on i { animation: capBar var(--dur, 3s) linear forwards; }
.hero__bars button:hover::before { background: rgba(255,255,255,.6); }
@keyframes capBar { from { width: 0; } to { width: 100%; } }
@media (prefers-reduced-motion: reduce) { .hero__media.is-slides img { transition: opacity .6s ease; transform: none !important; animation: none !important; } .hero__content.is-in > *, .hero__content.is-out > *, .hero h1 .hw > span, .hero .eyebrow .ec { animation: none !important; opacity: 1 !important; transform: none !important; filter: none !important; } }
.hero::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background:
    linear-gradient(90deg, rgba(20,13,9,.86) 0%, rgba(20,13,9,.62) 28%, rgba(20,13,9,.18) 52%, rgba(20,13,9,0) 70%),
    linear-gradient(180deg, rgba(15,10,7,.55) 0%, rgba(15,10,7,0) 26%, rgba(15,10,7,0) 75%, rgba(15,10,7,.35) 100%);
}
.hero__content { position: absolute; left: 4.8rem; top: 7.75rem; width: 27rem; }
.hero .eyebrow { margin-bottom: .55rem; font-size: .7rem; letter-spacing: .46em; color: var(--gold-200); }
.hero h1 {
  color: #f6f0e8; font-size: 2.62rem; line-height: .97; letter-spacing: -.002em; margin: 0 0 1.05rem;
  text-shadow: 0 2px 30px rgba(0,0,0,.25);
}
.hero__lead { font-size: .905rem; line-height: 1.37; color: #f1ebe3; margin: 0 0 .95rem; max-width: 25.4rem; }
.hero .btn { --h: 2.33rem; padding: 0 1.25rem; font-size: .66rem; }
.hero__script {
  position: absolute; right: 3.9rem; bottom: 1.75rem;
  font-family: var(--f-script); font-size: 2.55rem; line-height: .82; color: #fff;
  transform: rotate(-12deg); transform-origin: right bottom; text-align: left;
  text-shadow: 0 2px 18px rgba(0,0,0,.35);
}
.hero__script span { display: block; padding-left: 1.3rem; }
.hero__script::after { content: ""; display: block; width: 1.6rem; height: 1px; background: rgba(255,255,255,.8); margin: .55rem 0 0 5.5rem; }

/* ---------- Feature strip ---------- */
.features { background: var(--paper); }
.features__grid { display: grid; grid-template-columns: repeat(5, 1fr); padding: 1.15rem 0 1.25rem; }
.feature { position: relative; text-align: center; padding: .1rem .8rem 0; }
.feature + .feature::before { content: ""; position: absolute; left: 0; top: .25rem; bottom: .05rem; width: 1px; background: #dcd6ce; }
.feature__ico { width: 2.2rem; height: 2.2rem; margin: 0 auto .95rem; stroke: var(--gold); fill: none; stroke-width: 1.15; stroke-linecap: round; stroke-linejoin: round; }
.feature h3 { font-size: .8rem; letter-spacing: .075em; text-transform: uppercase; line-height: 1.3; margin: 0 0 .4rem; color: #2a221c; }
.feature p { font-size: .75rem; line-height: 1.38; color: var(--muted); margin: 0; }

/* ---------- Configuratore + Artigiani ---------- */
.split { display: grid; grid-template-columns: 61.15% 38.85%; min-height: 17.35rem; }
.config-teaser {
  position: relative; overflow: hidden;
  background: linear-gradient(100deg, #efe9e1 0%, #ebe4db 55%, #e7e0d6 100%);
  display: grid; grid-template-columns: 17.2rem 1fr 7.4rem; align-items: center;
  padding: 0 1rem 0 3.15rem;
}
.config-teaser__text { align-self: center; padding: .4rem 0 0; }
.config-teaser .badge { margin-bottom: .75rem; }
.config-teaser h2 { font-size: 1.6rem; line-height: .98; text-transform: uppercase; letter-spacing: .01em; margin: 0 0 .95rem; color: #2a221c; }
.config-teaser p { font-size: .84rem; line-height: 1.34; color: #5b544d; margin: 0 0 .95rem; }
.config-teaser .btn { --h: 2.15rem; padding: 0 1.5rem; font-size: .64rem; }
.config-teaser__product { position: relative; height: 100%; display: flex; align-items: center; justify-content: center; }
.config-teaser__product img {
  height: 16.3rem; width: auto; max-width: none; margin-top: .1rem;
  filter: drop-shadow(0 18px 18px rgba(60,40,20,.18));
  transition: transform .8s var(--ease);
}
.config-teaser:hover .config-teaser__product img { transform: translateY(-4px) rotate(-.4deg); }
.rot360 { position: absolute; right: .2rem; bottom: .45rem; width: 2.5rem; color: #2d2620; }
.rot360 svg { width: 100%; height: auto; fill: none; stroke: currentColor; stroke-width: 1.2; }
.rot360 text { fill: currentColor; stroke: none; font: 600 9.5px var(--f-sans); }
.config-steps { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 1.03rem; align-self: center; }
.config-steps a { display: flex; align-items: center; gap: .85rem; font-size: .68rem; color: #2e2721; font-weight: 500; transition: color .25s; }
.config-steps a:hover { color: var(--gold-600); }
.config-steps .ico {
  display: grid; place-items: center; width: 1.6rem; height: 1.6rem; border-radius: 50%; margin: -.3rem -.25rem;
}
.config-steps .ico svg { width: 1.1rem; height: 1.1rem; stroke: #2e2721; fill: none; stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round; }
.config-steps li:first-child .ico { background: #fff; box-shadow: 0 2px 8px rgba(0,0,0,.08); }

.craft {
  position: relative; isolation: isolate; overflow: hidden; color: #fff;
  background: #2a1f18;
  padding: 2.35rem 1.5rem 2.2rem 1.5rem;
  display: flex; flex-direction: column;
}
.craft__media { position: absolute; inset: 0; z-index: -2; }
.craft__media img { width: 100%; height: 100%; object-fit: cover; object-position: 30% 30%; transition: transform 1.2s var(--ease); }
.craft:hover .craft__media img { transform: scale(1.03); }
.craft::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(28,19,13,.93) 0%, rgba(28,19,13,.82) 34%, rgba(28,19,13,.25) 62%, rgba(28,19,13,.05) 100%); }
.craft h2 { color: #f3ede5; font-size: 1.43rem; line-height: 1; text-transform: uppercase; letter-spacing: .04em; margin: 0 0 1.2rem; }
.craft p { font-size: .8rem; line-height: 1.5; max-width: 13.9rem; color: #efe7dc; margin: 0 0 1.25rem; }
.craft__sign { font-family: var(--f-script); font-size: 2.35rem; line-height: 1; color: #fff; margin: .15rem 0 .3rem .45rem; }
.craft__role { font-size: .74rem; color: rgba(255,255,255,.72); margin: 0 0 0 .5rem; }

/* ---------- I nostri lavori ---------- */
.works { background: var(--paper-2); padding: 1.35rem 0 1.4rem; }
.section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; margin-bottom: 1.1rem; }
.section-head h2 { font-size: 1.43rem; text-transform: uppercase; letter-spacing: .04em; line-height: 1; margin: 0 0 .5rem; color: #2a221c; }
.section-head p { font-size: .69rem; color: var(--muted); margin: 0; }
.link-arrow { display: inline-flex; align-items: center; gap: .6rem; font-size: .68rem; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: #2a221c; margin-bottom: .95rem; }
.link-arrow .arrow { width: .8rem; height: .55rem; fill: none; stroke: currentColor; stroke-width: 1.3; transition: transform .3s var(--ease); }
.link-arrow:hover .arrow { transform: translateX(4px); }
.works__grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: .45rem; }
.work-card { position: relative; display: block; border-radius: 10px; overflow: hidden; isolation: isolate; box-shadow: 0 14px 30px -22px rgba(40,25,10,.55); }
.work-card__img { position: relative; overflow: hidden; aspect-ratio: 177 / 137; background: #ddd; }
.work-card__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .9s var(--ease), filter .6s; }
.work-card:hover .work-card__img img { transform: scale(1.06); }
.work-card__img::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(20,13,9,0) 38%, rgba(20,13,9,.42) 64%, rgba(20,13,9,.86) 100%); transition: opacity .4s; }
.work-card__img::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, transparent 50%, rgba(20,13,9,.35)); opacity: 0; transition: opacity .4s; pointer-events: none; }
.work-card:hover .work-card__img::before { opacity: 1; }

.work-card h3 { position: absolute; left: .85rem; right: .85rem; bottom: .8rem; z-index: 2; font-family: var(--f-sans); font-size: .74rem; font-weight: 600; letter-spacing: .02em; color: #fff; margin: 0; line-height: 1.3; text-shadow: 0 1px 10px rgba(0,0,0,.35); transition: transform .45s var(--ease); }
.work-card h3::after { content: ""; display: block; width: 18px; height: 1px; margin-top: .45rem; background: var(--gold-200); transform-origin: left; transition: width .45s var(--ease); }
.work-card:hover h3 { transform: translateY(-3px); }
.work-card:hover h3::after { width: 34px; }


/* ---------- Footer ---------- */
.site-footer {
  position: relative; color: #efe6da;
  background: #24190f url("../assets/img/texture-noce-scuro.webp") center / cover no-repeat;
  padding: 1.95rem 0 0;
}
.site-footer::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(18,12,8,.25), rgba(18,12,8,.5)); pointer-events: none; }
.site-footer > .container { position: relative; }
.footer-contacts { display: grid; grid-template-columns: 15.2rem 12.9rem 19.4rem 1fr auto; align-items: center; gap: 0; }
.fc { display: flex; align-items: center; gap: .95rem; font-size: .8rem; line-height: 1.3; color: #f1e9de; }
a.fc:hover span { color: var(--gold-200); }
.fc__ico { flex: 0 0 auto; width: 1.4rem; height: 1.4rem; fill: none; stroke: #efe6da; stroke-width: 1.2; stroke-linejoin: round; }
.fc--social { gap: 1.2rem; }
.fc--social svg { width: 1.45rem; height: 1.45rem; fill: none; stroke: #f3ece2; stroke-width: 1.3; transition: transform .3s var(--ease); }
.fc--social svg .fill { fill: #f3ece2; stroke: none; }
.fc--social a:hover svg { transform: translateY(-2px); }
.footer-main { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 1.85rem 0 1.55rem; }
.footer-logo { width: 7.4rem; margin-left: .5rem; }
.footer-claim {
  margin: 0; font-size: .82rem; letter-spacing: .42em; text-transform: uppercase; color: #efe6da; text-align: center;
}
.footer-claim::after { content: ""; display: block; width: 1.5rem; height: 1px; margin: 1.1rem auto 0; background: rgba(239, 230, 218, .6); }
.footer-main .btn { justify-self: end; --h: 2.7rem; padding: 0 1.8rem; font-size: .75rem; letter-spacing: .1em; }
.footer-bottom {
  display: flex; justify-content: space-between; align-items: center; gap: 1rem;
  border-top: 1px solid rgba(239, 230, 218, .18); padding: .95rem 0 1.1rem;
  font-size: .64rem; color: rgba(239, 230, 218, .82);
}
.footer-bottom p { margin: 0; }
.footer-bottom a:hover, .footer-bottom .linklike:hover { color: #fff; }
.footer-bottom .linklike { text-decoration: none; }
.footer-motto { letter-spacing: .02em; }
.footer-credit a { letter-spacing: .14em; font-weight: 600; text-decoration: none; }

.wa-float {
  position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 80;
  width: 3.1rem; height: 3.1rem; min-width: 48px; min-height: 48px; border-radius: 50%;
  display: grid; place-items: center; background: #25d366; color: #fff;
  box-shadow: 0 10px 30px -8px rgba(0,0,0,.45); transition: transform .3s var(--ease);
}
.wa-float svg { width: 55%; height: 55%; fill: currentColor; }
.wa-float:hover { transform: scale(1.07); }
.page-configuratore .wa-float { display: none; }

.cookie-banner {
  position: fixed; left: 1rem; bottom: 1rem; z-index: 200; max-width: 30rem;
  background: #fff; color: var(--text); padding: 1.1rem 1.2rem; border-radius: 4px;
  box-shadow: 0 20px 60px -15px rgba(0,0,0,.45); font-size: .78rem;
  animation: slideUp .5s var(--ease);
}
.cookie-banner p { margin: 0 0 .9rem; }
.cookie-banner a { text-decoration: underline; }
.cookie-banner__actions { display: flex; gap: .6rem; justify-content: flex-end; flex-wrap: wrap; }
@keyframes slideUp { from { transform: translateY(20px); opacity: 0; } }

/* ==========================================================================
   Pagine interne
   ========================================================================== */
.page-hero {
  position: relative; isolation: isolate; color: #fff; overflow: hidden;
  min-height: 24rem; display: flex; align-items: flex-end; padding: calc(var(--header-h) + 3rem) 0 3.2rem; background: #1b130e;
}
.page-hero__media { position: absolute; inset: 0; z-index: -2; }
.page-hero__media img { width: 100%; height: 100%; object-fit: cover; }
.page-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(20,13,9,.9) 0%, rgba(20,13,9,.65) 40%, rgba(20,13,9,.25) 100%), linear-gradient(180deg, rgba(15,10,7,.55), transparent 35%); }
.page-hero h1 { color: #f6f0e8; font-size: 3rem; line-height: 1; margin: 0 0 1rem; max-width: 40rem; }
.page-hero p { max-width: 34rem; font-size: .95rem; color: #efe7dc; margin: 0; }
.breadcrumb { display: flex; gap: .5rem; font-size: .7rem; letter-spacing: .08em; color: rgba(255,255,255,.65); margin-bottom: 1.2rem; }
.breadcrumb a:hover { color: #fff; }

.section { padding: 5rem 0; }
.section--tight { padding: 3.5rem 0; }
.section--sand { background: var(--sand); }
.section--white { background: #fff; }
.section--dark { background: #1f1712; color: #e9e1d6; }
.section--dark h2, .section--dark h3 { color: #f5efe7; }
.section-title { font-size: 2.1rem; line-height: 1.05; margin: 0 0 1rem; }
.section-title--upper { text-transform: uppercase; letter-spacing: .04em; font-size: 1.8rem; }
.section-intro { max-width: 40rem; color: var(--muted); font-size: .95rem; margin-bottom: 2.6rem; }
.section--dark .section-intro { color: #bfb4a6; }
.center { text-align: center; margin-left: auto; margin-right: auto; }
.lead { font-size: 1.02rem; line-height: 1.65; color: var(--text); }

.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 4.5rem; align-items: center; }
.two-col--wide { grid-template-columns: 1.1fr .9fr; }
.img-frame { position: relative; }
.img-frame img { width: 100%; aspect-ratio: 4 / 3.2; object-fit: cover; box-shadow: var(--shadow); }
.img-frame::before { content: ""; position: absolute; inset: -1.2rem 1.2rem 1.2rem -1.2rem; border: 1px solid var(--gold-200); z-index: -1; }
.img-frame .tag { position: absolute; right: -1rem; bottom: 2rem; background: var(--gold); color: #fff; padding: 1rem 1.3rem; font-family: var(--f-serif); font-size: 1.05rem; line-height: 1.2; box-shadow: var(--shadow); }
.signature { font-family: var(--f-script); font-size: 2.4rem; color: var(--gold-600); line-height: 1; margin: .5rem 0 0; }

.card-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.card-grid--4 { grid-template-columns: repeat(4, 1fr); }
.card-grid--2 { grid-template-columns: repeat(2, 1fr); }
.card {
  background: #fff; padding: 2rem 1.8rem; border: 1px solid #ebe5dc; position: relative;
  transition: transform .4s var(--ease), box-shadow .4s var(--ease), border-color .4s;
}
.card:hover { transform: translateY(-4px); box-shadow: var(--shadow); border-color: transparent; }
.card__ico { width: 2.4rem; height: 2.4rem; stroke: var(--gold); fill: none; stroke-width: 1.15; stroke-linecap: round; stroke-linejoin: round; margin-bottom: 1.2rem; }
.card h3 { font-size: 1.2rem; margin: 0 0 .6rem; }
.card p { font-size: .84rem; color: var(--muted); margin: 0; }
.card ul { margin: .9rem 0 0; padding: 0; list-style: none; font-size: .8rem; color: var(--text); }
.card li { padding: .28rem 0 .28rem 1.1rem; position: relative; }
.card li::before { content: ""; position: absolute; left: 0; top: .78rem; width: .45rem; height: 1px; background: var(--gold); }
.section--dark .card { background: rgba(255,255,255,.03); border-color: rgba(255,255,255,.08); }
.section--dark .card p { color: #b9ae9f; }
.section--dark .card li { color: #d8cfc3; }
.card__num { position: absolute; top: 1.4rem; right: 1.6rem; font-family: var(--f-serif); font-size: 2.2rem; color: var(--gold-100); line-height: 1; }
.section--dark .card__num { color: rgba(200,170,124,.25); }

/* Servizi dettagliati */
.service-row { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: center; padding: 4rem 0; border-bottom: 1px solid var(--line); scroll-margin-top: 6rem; }
.service-row:last-child { border-bottom: 0; }
.service-row:nth-child(even) .service-row__media { order: 2; }
.service-row__media { position: relative; overflow: hidden; }
.service-row__media img { width: 100%; aspect-ratio: 4/3; object-fit: cover; transition: transform 1s var(--ease); }
.service-row:hover .service-row__media img { transform: scale(1.03); }
.service-row h2 { font-size: 2rem; margin: 0 0 1rem; }
.service-row p { color: var(--muted); font-size: .92rem; }
.tick-list { list-style: none; padding: 0; margin: 1.2rem 0 1.6rem; display: grid; grid-template-columns: 1fr 1fr; gap: .45rem 1.4rem; font-size: .83rem; }
.tick-list li { position: relative; padding-left: 1.4rem; }
.tick-list li::before { content: ""; position: absolute; left: 0; top: .35rem; width: .7rem; height: .38rem; border-left: 1.5px solid var(--gold); border-bottom: 1.5px solid var(--gold); transform: rotate(-45deg); }
.service-row__actions { display: flex; gap: .8rem; flex-wrap: wrap; }

/* Processo */
.process { display: grid; grid-template-columns: repeat(6, 1fr); gap: 0; counter-reset: step; position: relative; }
.process::before { content: ""; position: absolute; top: 1.6rem; left: 8%; right: 8%; height: 1px; background: linear-gradient(90deg, transparent, var(--gold-300), transparent); }
.process__step { text-align: center; padding: 0 .8rem; position: relative; }
.process__step::before {
  counter-increment: step; content: counter(step, decimal-leading-zero);
  display: grid; place-items: center; width: 3.2rem; height: 3.2rem; margin: 0 auto 1.1rem; border-radius: 50%;
  background: var(--paper); border: 1px solid var(--gold-300); color: var(--gold-600); font-family: var(--f-serif); font-size: 1rem; position: relative;
}
.section--dark .process__step::before { background: #1f1712; }
.process__step h3 { font-size: 1.02rem; margin: 0 0 .45rem; }
.process__step p { font-size: .78rem; color: var(--muted); margin: 0; }
.section--dark .process__step p { color: #b3a898; }

/* Numeri / valori */
.stats { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.stat { padding: 2rem 1.5rem; text-align: center; }
.stat + .stat { border-left: 1px solid var(--line); }
.stat strong { display: block; font-family: var(--f-serif); font-weight: 400; font-size: 2.2rem; color: var(--gold-600); line-height: 1; margin-bottom: .5rem; }
.stat span { font-size: .78rem; color: var(--muted); letter-spacing: .04em; }

/* Timeline */
.timeline { position: relative; max-width: 50rem; margin: 0 auto; padding-left: 2.4rem; }
.timeline::before { content: ""; position: absolute; left: .45rem; top: .5rem; bottom: .5rem; width: 1px; background: var(--gold-300); }
.timeline__item { position: relative; padding: 0 0 2.2rem; }
.timeline__item::before { content: ""; position: absolute; left: -2.35rem; top: .35rem; width: .8rem; height: .8rem; border-radius: 50%; background: var(--paper); border: 1px solid var(--gold); }
.timeline__item h3 { font-size: 1.25rem; margin: 0 0 .35rem; }
.timeline__item small { display: block; font-size: .68rem; letter-spacing: .2em; text-transform: uppercase; color: var(--gold-600); margin-bottom: .35rem; }
.timeline__item p { color: var(--muted); font-size: .88rem; margin: 0; }

/* Macchinari */
.machine { display: grid; grid-template-columns: 3.4rem 1fr; gap: 1.2rem; padding: 1.6rem 0; border-bottom: 1px solid rgba(255,255,255,.08); }
.machine__ico { width: 3.4rem; height: 3.4rem; border: 1px solid rgba(200,170,124,.4); display: grid; place-items: center; }
.machine__ico svg { width: 1.8rem; height: 1.8rem; stroke: var(--gold-300); fill: none; stroke-width: 1.15; stroke-linecap: round; stroke-linejoin: round; }
.machine h3 { font-size: 1.12rem; margin: 0 0 .35rem; }
.machine p { color: #b3a898; font-size: .83rem; margin: 0; }
.machines { display: grid; grid-template-columns: 1fr 1fr; gap: 0 3.5rem; }

/* Materiali (swatch) */
.swatches { display: grid; grid-template-columns: repeat(6, 1fr); gap: 1rem; }
.swatch { text-align: left; }
.swatch__chip { aspect-ratio: 1; border-radius: 2px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.06); margin-bottom: .55rem; background-size: cover; }
.swatch strong { display: block; font-size: .8rem; font-weight: 500; color: var(--ink); }
.swatch span { font-size: .7rem; color: var(--muted); }

/* Portfolio */
.filters { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 2rem; }
.filter-btn { border: 1px solid var(--line); background: #fff; padding: .55rem 1rem; font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; border-radius: 40px; transition: all .25s; }
.filter-btn:hover { border-color: var(--gold); color: var(--gold-600); }
.filter-btn.is-active { background: var(--ink); color: #fff; border-color: var(--ink); }
.gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; grid-auto-flow: dense; }
.gallery__item { position: relative; overflow: hidden; background: #ddd; cursor: zoom-in; border: 0; padding: 0; text-align: left; aspect-ratio: 4/3; }
.gallery__item--tall { grid-row: span 2; aspect-ratio: auto; }
.gallery__item--wide { grid-column: span 2; aspect-ratio: auto; }
.gallery__item img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--ease); }
.gallery__item:hover img { transform: scale(1.05); }
.gallery__cap { position: absolute; inset: auto 0 0 0; padding: 2.5rem 1.2rem 1rem; background: linear-gradient(180deg, transparent, rgba(15,10,7,.85)); color: #fff; transform: translateY(35%); opacity: .0; transition: all .45s var(--ease); }
.gallery__item:hover .gallery__cap, .gallery__item:focus-visible .gallery__cap { transform: none; opacity: 1; }
.gallery__cap small { display: block; font-size: .62rem; letter-spacing: .2em; text-transform: uppercase; color: var(--gold-200); margin-bottom: .3rem; }
.gallery__cap strong { font-family: var(--f-serif); font-weight: 400; font-size: 1.15rem; }
.gallery__item.is-hidden { display: none; }

.lightbox { position: fixed; inset: 0; z-index: 300; background: rgba(12,8,6,.94); display: grid; place-items: center; padding: 4rem 5rem; animation: fadeIn .3s; }
.lightbox img { max-height: 80vh; width: auto; max-width: 100%; box-shadow: 0 30px 80px rgba(0,0,0,.5); }
.lightbox figcaption { color: #eee4d6; text-align: center; margin-top: 1rem; font-family: var(--f-serif); font-size: 1.1rem; }
.lightbox button { position: absolute; background: none; border: 1px solid rgba(255,255,255,.25); color: #fff; width: 3rem; height: 3rem; min-width: 44px; min-height: 44px; border-radius: 50%; font-size: 1.3rem; display: grid; place-items: center; }
.lightbox button:hover { background: rgba(255,255,255,.1); }
.lightbox .lb-close { top: 1.5rem; right: 1.5rem; }
.lightbox .lb-prev { left: 1.5rem; top: 50%; transform: translateY(-50%); }
.lightbox .lb-next { right: 1.5rem; top: 50%; transform: translateY(-50%); }

/* CTA band */
.cta-band { position: relative; isolation: isolate; overflow: hidden; color: #fff; padding: 4.5rem 0; background: #1d140e; }
.cta-band__media { position: absolute; inset: 0; z-index: -2; }
.cta-band__media img { width: 100%; height: 100%; object-fit: cover; opacity: .45; }
.cta-band::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(20,13,9,.92), rgba(20,13,9,.55)); }
.cta-band__inner { display: flex; align-items: center; justify-content: space-between; gap: 2rem; }
.cta-band h2 { color: #f6f0e8; font-size: 2.2rem; line-height: 1.05; max-width: 32rem; margin: 0 0 .6rem; }
.cta-band p { color: #d9cfc2; margin: 0; max-width: 32rem; }
.cta-band__actions { display: flex; gap: .8rem; flex-wrap: wrap; }

/* FAQ */
.faq { max-width: 52rem; margin: 0 auto; }
.faq details { border-bottom: 1px solid var(--line); }
.faq summary { list-style: none; cursor: pointer; padding: 1.25rem 2.5rem 1.25rem 0; font-family: var(--f-serif); font-size: 1.15rem; color: var(--ink); position: relative; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: ""; position: absolute; right: .4rem; top: 50%; width: .6rem; height: .6rem; border-right: 1.5px solid var(--gold); border-bottom: 1.5px solid var(--gold); transform: translateY(-70%) rotate(45deg); transition: transform .3s var(--ease); }
.faq details[open] summary::after { transform: translateY(-30%) rotate(-135deg); }
.faq details p { color: var(--muted); font-size: .9rem; padding: 0 2.5rem 1.2rem 0; margin: 0; }

/* Contatti */
.contact-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 4rem; align-items: start; }
.contact-info { display: flex; flex-direction: column; gap: 1.6rem; }
.contact-item { display: grid; grid-template-columns: 2.6rem 1fr; gap: 1rem; align-items: start; }
.contact-item__ico { width: 2.6rem; height: 2.6rem; border-radius: 50%; background: var(--gold-100); display: grid; place-items: center; }
.contact-item__ico svg { width: 1.2rem; height: 1.2rem; stroke: var(--gold-600); fill: none; stroke-width: 1.4; stroke-linejoin: round; stroke-linecap: round; }
.contact-item h3 { font-family: var(--f-sans); font-size: .7rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); margin: .2rem 0 .3rem; }
.contact-item p, .contact-item a { font-size: .95rem; color: var(--ink); margin: 0; }
.contact-item a:hover { color: var(--gold-600); }
.hours { width: 100%; border-collapse: collapse; font-size: .84rem; }
.hours td { padding: .35rem 0; border-bottom: 1px dashed var(--line); }
.hours td:last-child { text-align: right; color: var(--muted); }

.form { background: #fff; padding: 2.4rem; border: 1px solid #ebe5dc; box-shadow: 0 30px 70px -40px rgba(40,25,10,.35); scroll-margin-top: 6rem; }
.form h2 { font-size: 1.7rem; margin-bottom: .4rem; }
.form > p { color: var(--muted); font-size: .85rem; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem 1.1rem; margin-top: 1.4rem; }
.field { display: flex; flex-direction: column; gap: .35rem; }
.field--full { grid-column: 1 / -1; }
.field label, .field .label { font-size: .68rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.field input, .field select, .field textarea {
  width: 100%; border: 1px solid #ddd5ca; background: #fcfbf9; border-radius: 2px;
  padding: .8rem .9rem; font-size: .9rem; color: var(--ink); transition: border-color .2s, box-shadow .2s, background .2s;
}
.field textarea { min-height: 8rem; resize: vertical; }
.field input:focus, .field select:focus, .field textarea:focus { outline: none; border-color: var(--gold); background: #fff; box-shadow: 0 0 0 3px rgba(168,135,90,.15); }
.field input:invalid:not(:placeholder-shown) { border-color: #c56b5a; }
.chips { display: flex; flex-wrap: wrap; gap: .45rem; }
.chip { position: relative; }
.chip input { position: absolute; opacity: 0; pointer-events: none; }
.chip span { display: inline-block; padding: .5rem .85rem; border: 1px solid var(--line); border-radius: 40px; font-size: .78rem; cursor: pointer; transition: all .2s; background: #fff; }
.chip input:checked + span { background: var(--ink); border-color: var(--ink); color: #fff; }
.chip input:focus-visible + span { outline: 2px solid var(--gold-300); outline-offset: 2px; }
.check { display: flex; gap: .7rem; align-items: flex-start; font-size: .78rem; color: var(--muted); }
.check input { margin-top: .2rem; accent-color: var(--gold); width: 1rem; height: 1rem; flex: 0 0 auto; }
.check a { text-decoration: underline; }
.hp { position: absolute !important; left: -5000px !important; }
.form-actions { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 1.4rem; flex-wrap: wrap; }
.form-status { font-size: .84rem; margin: 0; }
.form-status.is-ok { color: #3d7a4d; }
.form-status.is-err { color: #b4513f; }
.file-drop { border: 1px dashed var(--gold-300); padding: 1rem; text-align: center; font-size: .8rem; color: var(--muted); background: #fcfaf6; cursor: pointer; transition: background .2s; }
.file-drop:hover, .file-drop.is-over { background: var(--gold-100); }
.file-list { list-style: none; margin: .4rem 0 0; padding: 0; font-size: .75rem; color: var(--text); }

.map { position: relative; aspect-ratio: 21 / 8; background: #d9d2c8 url("../assets/img/texture-noce-scuro.webp") center/cover; display: grid; place-items: center; color: #fff; text-align: center; overflow: hidden; }
.map::before { content: ""; position: absolute; inset: 0; background: rgba(20,13,9,.65); }
.map > * { position: relative; }
.map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; filter: grayscale(.25) sepia(.15); }
.map p { margin: 0 0 1rem; font-size: .9rem; }

/* Legal */
.legal { max-width: 50rem; }
.legal h2 { font-size: 1.5rem; margin: 2.4rem 0 .8rem; }
.legal p, .legal li { color: var(--text); font-size: .9rem; line-height: 1.7; }
.legal .note { background: var(--gold-100); padding: 1rem 1.2rem; font-size: .82rem; border-left: 3px solid var(--gold); }

/* Rivelazione allo scroll */
.reveal { opacity: 0; transform: translateY(24px); transition: opacity .9s var(--ease), transform .9s var(--ease); }
.reveal.is-in { opacity: 1; transform: none; }
.reveal-delay-1 { transition-delay: .08s; } .reveal-delay-2 { transition-delay: .16s; } .reveal-delay-3 { transition-delay: .24s; } .reveal-delay-4 { transition-delay: .32s; } .reveal-delay-5 { transition-delay: .4s; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
}

/* 404 */
.notfound { min-height: 80vh; display: grid; place-items: center; text-align: center; padding: 8rem 1.5rem 4rem; background: var(--sand); }
.notfound strong { display: block; font-family: var(--f-serif); font-weight: 400; font-size: 8rem; line-height: 1; color: var(--gold); }

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 1180px) and (min-width: 1000px) {
  .site-header__inner { padding: 0 2rem; }
  .main-nav ul { gap: 2.3vw; margin: 0 1rem; }
  .main-nav a { font-size: .74rem; letter-spacing: .02em; }
  .btn--header { padding: 0 1rem; margin-left: .4rem; }
}
@media (max-width: 999px) {
  :root { --gutter: 24px; --header-h: 72px; }
  .site-header__inner { padding: 0 12px 0 20px; }
  .brand { width: 104px; }
  .site-header.is-scrolled { height: 64px; }
  .site-header.is-scrolled .brand { width: 92px; }
  .main-nav, .btn--header { display: none; }
  .nav-toggle { display: block; z-index: 101; }

  .hero { height: auto; min-height: 640px; max-height: none; }
  .hero::before { background: linear-gradient(180deg, rgba(20,13,9,.6) 0%, rgba(20,13,9,.35) 35%, rgba(20,13,9,.82) 100%); }
  .hero__media img { object-position: 62% 50%; }
  .hero__content { position: relative; left: auto; top: auto; width: auto; padding: 150px 24px 150px; }
  .hero h1 { font-size: clamp(38px, 9vw, 54px); }
  .hero__lead { font-size: 15px; }
  .hero .eyebrow { font-size: 11px; letter-spacing: .32em; }
  .hero .btn { --h: 46px; font-size: 12px; }
  .hero__script { right: 24px; bottom: 28px; font-size: 38px; }
  .hero__cap { left: 24px; bottom: 34px; }
  .hero__bars button { width: 26px; }

  .features__grid { grid-template-columns: repeat(2, 1fr); gap: 28px 0; padding: 36px 0; }
  .feature:nth-child(odd)::before { display: none; }
  .feature:last-child { grid-column: 1 / -1; }
  .feature:last-child::before { display: none; }
  .feature h3 { font-size: 13px; }
  .feature p { font-size: 12.5px; }
  .feature__ico { width: 36px; height: 36px; margin-bottom: 12px; }

  .split { grid-template-columns: 1fr; }
  .config-teaser { grid-template-columns: 1fr; padding: 44px 24px 36px; gap: 16px; text-align: left; }
  .config-teaser h2 { font-size: 30px; }
  .config-teaser p { font-size: 15px; }
  .config-teaser .btn { --h: 46px; font-size: 12px; }
  .config-teaser__product img { height: 320px; }
  .config-steps { flex-direction: row; flex-wrap: wrap; gap: 10px 18px; }
  .config-steps a { font-size: 13px; gap: 10px; }
  .config-steps .ico { margin: 0; width: 32px; height: 32px; background: #fff; }
  .rot360 { width: 44px; right: 10%; }
  .craft { min-height: 460px; padding: 48px 24px; justify-content: flex-end; }
  .craft::before { background: linear-gradient(180deg, rgba(28,19,13,.25) 0%, rgba(28,19,13,.92) 70%); }
  .craft h2 { font-size: 28px; }
  .craft p { font-size: 15px; max-width: 30rem; }
  .craft__sign { font-size: 34px; }
  .craft__role { font-size: 13px; }

  .works { padding: 44px 0; }
  .section-head { flex-direction: column; align-items: flex-start; gap: 6px; }
  .section-head h2 { font-size: 28px; }
  .section-head p { font-size: 14px; }
  .link-arrow { font-size: 12px; margin: 0; }
  .works__grid { grid-template-columns: repeat(2, 1fr); gap: 14px 10px; }
  .work-card h3 { font-size: 13px; left: 12px; right: 12px; bottom: 12px; }

  .footer-contacts { grid-template-columns: 1fr 1fr; gap: 22px 18px; }
  .fc { font-size: 14px; }
  .fc--social { grid-column: 1 / -1; }
  .fc__ico, .fc--social svg { width: 24px; height: 24px; }
  .footer-main { grid-template-columns: 1fr; justify-items: center; gap: 24px; padding: 36px 0; text-align: center; }
  .footer-logo { width: 140px; margin: 0; }
  .footer-claim { font-size: 13px; letter-spacing: .3em; }
  .footer-main .btn { justify-self: center; --h: 48px; font-size: 12px; }
  .footer-bottom { flex-direction: column; align-items: flex-start; font-size: 12px; line-height: 1.7; padding-bottom: 90px; }

  .page-hero { min-height: 420px; padding: 130px 0 44px; }
  .page-hero h1 { font-size: clamp(34px, 8vw, 48px); }
  .page-hero p { font-size: 15px; }
  .section { padding: 64px 0; }
  .section-title { font-size: 32px; }
  .section-intro, .lead { font-size: 15px; }
  .two-col, .two-col--wide, .contact-grid, .service-row { grid-template-columns: 1fr; gap: 40px; }
  .service-row { padding: 48px 0; }
  .service-row:nth-child(even) .service-row__media { order: 0; }
  .service-row h2 { font-size: 30px; }
  .service-row p { font-size: 15px; }
  .tick-list { font-size: 14px; }
  .card-grid, .card-grid--4 { grid-template-columns: 1fr 1fr; }
  .card h3 { font-size: 19px; } .card p { font-size: 14px; } .card ul { font-size: 13.5px; }
  .process { grid-template-columns: 1fr 1fr; gap: 32px 0; }
  .process::before { display: none; }
  .process__step h3 { font-size: 17px; } .process__step p { font-size: 13.5px; }
  .stats { grid-template-columns: 1fr 1fr; }
  .stat:nth-child(3) { border-left: 0; }
  .stat:nth-child(n+3) { border-top: 1px solid var(--line); }
  .machines { grid-template-columns: 1fr; }
  .machine h3 { font-size: 18px; } .machine p { font-size: 14px; }
  .swatches { grid-template-columns: repeat(3, 1fr); }
  .gallery { grid-template-columns: 1fr 1fr; gap: 10px; }
  .gallery__item--wide { grid-column: span 2; }
  .gallery__cap { opacity: 1; transform: none; padding: 2rem .8rem .7rem; }
  .gallery__cap strong { font-size: 15px; }
  .cta-band__inner { flex-direction: column; align-items: flex-start; }
  .cta-band h2 { font-size: 32px; }
  .form { padding: 24px 18px; }
  .form-grid { grid-template-columns: 1fr; }
  .field input, .field select, .field textarea { font-size: 16px; }
  .field label, .field .label { font-size: 11px; }
  .check { font-size: 13px; }
  .contact-item p, .contact-item a { font-size: 16px; }
  .map { aspect-ratio: 4 / 3; }
  .lightbox { padding: 60px 10px; }
  .legal p, .legal li { font-size: 15px; }
  .img-frame::before { inset: -10px 10px 10px -10px; }
  .img-frame .tag { right: 10px; font-size: 16px; }
  .btn { --h: 46px; font-size: 12px; }
  .filter-btn { font-size: 12px; }
  .cookie-banner { left: 10px; right: 10px; bottom: 10px; font-size: 14px; }
  .eyebrow { font-size: 11px; }
}
@media (max-width: 560px) {
  .card-grid, .card-grid--4, .card-grid--2 { grid-template-columns: 1fr; }
  .features__grid { grid-template-columns: 1fr; }
  .feature::before { display: none !important; }
  .feature:last-child { grid-column: auto; }
  .works__grid { grid-template-columns: 1fr 1fr; }
  .footer-contacts { grid-template-columns: 1fr; }
  .tick-list { grid-template-columns: 1fr; }
  .gallery { grid-template-columns: 1fr; }
  .gallery__item--wide, .gallery__item--tall { grid-column: auto; grid-row: auto; aspect-ratio: 4/3; }
  .process { grid-template-columns: 1fr; }
  .swatches { grid-template-columns: repeat(2, 1fr); }
}

/* ==========================================================================
   Pagine lavorazione, province e comuni
   ========================================================================== */
.hero-actions { display: flex; gap: .7rem; flex-wrap: wrap; margin-top: 1.4rem; }
.page-hero--service, .page-hero--city { min-height: 28rem; }
.prose h2 { font-size: 1.6rem; margin: 2.2rem 0 .8rem; }
.prose p { color: var(--text); font-size: .95rem; line-height: 1.75; }
.prose a, .section p a:not(.btn):not(.link-arrow), .faq details p a { color: var(--gold-600); text-decoration: underline; text-underline-offset: 2px; }
.side-card { position: sticky; top: 6.5rem; background: #fff; border: 1px solid #ebe5dc; padding: 1.8rem; box-shadow: 0 30px 60px -40px rgba(40,25,10,.35); }
.side-card h3 { font-size: 1.3rem; margin: 0 0 1rem; }
.side-card .btn { margin-top: 1rem; }
.side-card__tel { text-align: center; font-size: .8rem; color: var(--muted); margin: .7rem 0 0; }
.side-card__tel a { color: var(--ink); font-weight: 600; }
.facts { margin: 0; display: grid; gap: .1rem; }
.facts div { display: flex; justify-content: space-between; gap: 1rem; padding: .55rem 0; border-bottom: 1px dashed var(--line); font-size: .82rem; }
.facts dt { color: var(--muted); }
.facts dd { margin: 0; font-weight: 500; color: var(--ink); text-align: right; }
.facts a { color: var(--gold-600); }
.tags { display: flex; flex-wrap: wrap; gap: .45rem; }
.tag { display: inline-block; padding: .45rem .8rem; background: #fff; border: 1px solid var(--line); border-radius: 30px; font-size: .78rem; color: var(--text); }
.pgallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: .8rem; }
.pgallery .gallery__item { aspect-ratio: 4 / 3; }
.two-col .pgallery { grid-template-columns: 1fr 1fr; }
.svc-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.1rem; margin-top: 1.2rem; }
.svc-card { display: flex; flex-direction: column; background: #fff; border: 1px solid #ebe5dc; transition: transform .4s var(--ease), box-shadow .4s var(--ease); }
.svc-card:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.svc-card__img { aspect-ratio: 4 / 3; overflow: hidden; background: #ddd; }
.svc-card__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .9s var(--ease); }
.svc-card:hover .svc-card__img img { transform: scale(1.05); }
.svc-card__txt { padding: 1.1rem 1.2rem 1.3rem; display: flex; flex-direction: column; flex: 1; }
.svc-card h3 { font-size: 1.12rem; margin: 0 0 .35rem; }
.svc-card p { font-size: .8rem; color: var(--muted); margin: 0 0 .8rem; flex: 1; }
.svc-card .link-arrow { margin: 0; font-size: .64rem; }
.prov-links { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1.4rem; }
.prov-links a { padding: .6rem 1rem; border: 1px solid rgba(200,170,124,.45); color: #efe6da; font-size: .8rem; transition: all .25s; }
.prov-links a:hover { background: var(--gold); border-color: var(--gold); color: #fff; }
.city-links { font-size: .82rem; line-height: 2; color: var(--muted); }
.section--dark .city-links a { color: #e9dcc6; }
.city-links a:hover { color: var(--gold-600); }
.near-links { display: grid; grid-template-columns: repeat(6, 1fr); gap: .6rem; margin-top: 1rem; }
.near-links a { display: flex; flex-direction: column; padding: .8rem 1rem; background: #fff; border: 1px solid #ebe5dc; transition: border-color .25s; }
.near-links a:hover { border-color: var(--gold); }
.near-links strong { font-family: var(--f-serif); font-weight: 400; font-size: 1rem; color: var(--ink); }
.near-links small { font-size: .7rem; color: var(--muted); }
.note-small { font-size: .72rem; color: var(--muted-2); margin-top: .6rem; }
.zone-block { margin: 2.4rem 0 0; }
.zone-block h2 { font-size: 1.5rem; margin-bottom: 1rem; border-bottom: 1px solid var(--line); padding-bottom: .6rem; }
.zone-block h2 small { font-family: var(--f-sans); font-size: .7rem; color: var(--muted); letter-spacing: .1em; text-transform: uppercase; margin-left: .6rem; }
.zone-list { list-style: none; margin: 0; padding: 0; columns: 5; column-gap: 1.6rem; font-size: .82rem; }
.zone-list li { break-inside: avoid; padding: .22rem 0; }
.zone-list a:hover { color: var(--gold-600); }
.zone-list small { color: var(--muted-2); font-size: .68rem; }
.dist-table { width: 100%; border-collapse: collapse; font-size: .76rem; }
.dist-table th { text-align: left; font-size: .64rem; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); padding: .3rem 0; }
.dist-table td { padding: .3rem 0; border-bottom: 1px dashed var(--line); }
.dist-table td:not(:first-child), .dist-table th:not(:first-child) { text-align: right; }
.side-card:has(.dist-table) { max-height: calc(100vh - 8rem); overflow: auto; }
.footer-nav { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; padding: 1.6rem 0 1.8rem; border-top: 1px solid rgba(239,230,218,.14); }
.footer-nav h3 { font-family: var(--f-sans); font-size: .64rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--gold-200); margin: 0 0 .7rem; }
.footer-nav a { display: block; font-size: .74rem; color: rgba(239,230,218,.82); padding: .18rem 0; }
.footer-nav a:hover { color: #fff; }
@media (max-width: 999px) {
  .side-card { position: static; }
  .svc-grid { grid-template-columns: 1fr 1fr; }
  .near-links { grid-template-columns: repeat(2, 1fr); }
  .zone-list { columns: 2; font-size: 14px; }
  .footer-nav { grid-template-columns: 1fr 1fr; }
  .footer-nav a { font-size: 13.5px; padding: 5px 0; }
  .footer-nav h3 { font-size: 11px; }
  .prose p, .facts div, .dist-table { font-size: 15px; }
  .tag { font-size: 13px; }
  .page-hero--service, .page-hero--city { min-height: 460px; }
  .two-col .pgallery { grid-template-columns: 1fr 1fr; }
  .city-links, .note-small { font-size: 13px; }
  .svc-card p { font-size: 13px; }
}
@media (max-width: 560px) {
  .svc-grid { grid-template-columns: 1fr; }
  .pgallery { grid-template-columns: 1fr 1fr; }
}

/* ---------------------------------------------------------------- Blog */
.blog-cats { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 2.2rem; }
.blog-cats a { border: 1px solid var(--line); background: #fff; padding: .55rem 1rem; font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; border-radius: 40px; color: var(--text); text-decoration: none; transition: all .25s; }
.blog-cats a:hover { border-color: var(--gold); color: var(--gold-600); }
.blog-cats a.is-active { background: var(--ink); color: #fff; border-color: var(--ink); }
.post-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.6rem; }
.post-card { display: flex; flex-direction: column; background: #fff; border: 1px solid #ebe5dc; color: inherit; text-decoration: none; transition: transform .35s var(--ease), box-shadow .35s var(--ease); }
.post-card:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.post-card__img { aspect-ratio: 4 / 3; overflow: hidden; background: #eee; }
.post-card__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--ease); }
.post-card:hover .post-card__img img { transform: scale(1.05); }
.post-card__txt { padding: 1.3rem 1.4rem 1.5rem; display: flex; flex-direction: column; gap: .55rem; flex: 1; }
.post-card__cat { font-size: .64rem; letter-spacing: .22em; text-transform: uppercase; color: var(--gold-600); font-weight: 600; }
.post-card h3 { font-size: 1.22rem; line-height: 1.25; margin: 0; }
.post-card p { font-size: .84rem; color: var(--muted); margin: 0; line-height: 1.55; }
.post-card__meta { margin-top: auto; padding-top: .4rem; font-size: .72rem; letter-spacing: .06em; color: var(--text); display: inline-flex; align-items: center; gap: .5rem; }
.post-body { max-width: 46rem; }
.post-body h2 { scroll-margin-top: 6.5rem; }
.post-body ul { margin: .4rem 0 1.2rem; padding: 0; list-style: none; }
.post-body li { position: relative; padding: .35rem 0 .35rem 1.3rem; font-size: .95rem; line-height: 1.65; color: var(--text); }
.post-body li::before { content: ""; position: absolute; left: 0; top: 1rem; width: .6rem; height: 1px; background: var(--gold); }
.post-fig { margin: 1.8rem 0; }
.post-fig img { width: 100%; height: auto; max-height: 34rem; object-fit: cover; display: block; }
.post-fig figcaption { font-size: .76rem; color: var(--muted); margin-top: .55rem; }
.post-toc { margin: 0; padding: 0 0 0 1.1rem; font-size: .84rem; line-height: 1.5; }
.post-toc li { padding: .25rem 0; }
.post-toc a, .post-links a { color: var(--text); text-decoration: none; }
.post-toc a:hover, .post-links a:hover { color: var(--gold-600); }
.post-links { margin: 0; padding: 0; list-style: none; font-size: .86rem; }
.post-links li { padding: .3rem 0; border-bottom: 1px solid #f0ebe3; }
.post-side .btn { display: flex; justify-content: center; width: 100%; }
.post-list { list-style: none; margin: 1.4rem 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: .2rem 2.4rem; }
.post-list li { display: flex; justify-content: space-between; gap: 1rem; padding: .8rem 0; border-bottom: 1px solid var(--line); font-size: .95rem; }
.post-list a { color: var(--ink); text-decoration: none; }
.post-list a:hover { color: var(--gold-600); }
.post-list span { font-size: .72rem; color: var(--muted); white-space: nowrap; }
.page-hero--post h1 { max-width: 22em; }
@media (max-width: 999px) {
  .post-grid { grid-template-columns: 1fr 1fr; }
  .post-side { position: static; }
  .post-list { grid-template-columns: 1fr; }
}
@media (max-width: 699px) {
  .post-grid { grid-template-columns: 1fr; }
  .blog-cats { flex-wrap: nowrap; overflow-x: auto; margin-left: -16px; margin-right: -16px; padding: 0 16px .3rem; scrollbar-width: none; }
  .blog-cats a { white-space: nowrap; }
}

/* ---------------------------------------------------------------- Intro: il laboratorio si apre */
/* minimale: un filo d'oro, il logo che ne emerge, la quota che prende la misura, due ante scorrevoli */
html { scrollbar-gutter: stable; }
html.is-intro, html.is-intro body { overflow: hidden; }
html.is-intro-logo .site-header .brand img { opacity: 0; }
.site-header .brand img { transition: opacity .4s ease; }
.ldr { position: fixed; inset: 0; z-index: 10000; overflow: hidden; --ease: cubic-bezier(.77,0,.18,1); --out: cubic-bezier(.16,1,.3,1); }
.ldr.is-out { pointer-events: none; }
/* ante: nero caldo opaco, grana finissima, bordo interno che prende luce */
.ldr__door { position: absolute; top: 0; bottom: 0; width: 50.1%; background: #16110d; will-change: transform; transition: transform 1.15s var(--ease); }
.ldr__door--l { left: 0; background: linear-gradient(90deg, #110d0a 0%, #19130f 100%); }
.ldr__door--r { right: 0; background: linear-gradient(270deg, #110d0a 0%, #19130f 100%); }
.ldr__door::before { content: ""; position: absolute; inset: 0; opacity: .07; mix-blend-mode: screen; pointer-events: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1 0 0 0 0 .92 0 0 0 0 .8 0 0 0 .9 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>"); }
.ldr__door::after { content: ""; position: absolute; top: 0; bottom: 0; width: 1px; background: linear-gradient(transparent 5%, rgba(236,212,170,.85) 50%, transparent 95%); opacity: 0; transition: opacity .5s ease; }
.ldr__door--l::after { right: 0; } .ldr__door--r::after { left: 0; }
.ldr.is-out .ldr__door::after { opacity: 1; transition-delay: .2s; }
.ldr.is-out .ldr__door--l { transform: translate3d(-101%, 0, 0); transition-delay: .28s; }
.ldr.is-out .ldr__door--r { transform: translate3d(101%, 0, 0); transition-delay: .28s; }
/* alone caldo che respira una volta */
.ldr__glow { position: absolute; left: 50%; top: 50%; width: 900px; height: 900px; margin: -520px 0 0 -450px; border-radius: 50%; pointer-events: none;
  background: radial-gradient(closest-side, rgba(214,168,104,.16), rgba(214,168,104,.05) 45%, transparent 70%); opacity: 0; transform: scale(.8); animation: ldrGlow 2.2s .1s var(--out) forwards; transition: opacity .5s ease; }
.ldr.is-out .ldr__glow { opacity: 0 !important; animation: none; }
/* marchio: filo d'oro, logo che emerge, quota */
.ldr__mark { position: absolute; left: 50%; top: 50%; width: min(300px, 74vw); transform: translate(-50%, -62%); display: flex; flex-direction: column; align-items: center; z-index: 3; }
.ldr__rise { width: 176px; overflow: hidden; padding-top: 6px; }
.ldr.is-free .ldr__rise { overflow: visible; }
.ldr__logo { will-change: transform, opacity; }
.ldr__logo img { display: block; width: 100%; height: auto; transform: translate3d(0, 104%, 0); animation: ldrRise 1s .35s var(--out) forwards; }
.ldr__logo.is-fly { transition: transform 1s var(--ease); }
.ldr__logo.is-fly img { transform: none; animation: none; }
.ldr__logo.is-fade { opacity: 0; transition: transform 1s var(--ease), opacity .3s ease; }
.ldr__cut { display: block; width: 190px; height: 1px; margin-top: 2px; background: linear-gradient(90deg, transparent, #e8cfa2 20%, #fff0d4 50%, #e8cfa2 80%, transparent); transform: scaleX(0); animation: ldrCut .6s .05s var(--ease) forwards, ldrCutOut .7s 1s ease forwards; }
.ldr__stage { width: 100%; margin-top: 26px; text-align: center; transition: opacity .35s ease, transform .6s var(--ease); }
.ldr.is-out .ldr__stage, .ldr.is-out .ldr__cut { opacity: 0; transform: translateY(8px); }
.ldr__dim { display: flex; align-items: center; color: #e4cca4; opacity: 0; animation: ldrFade .7s .8s ease forwards; }
.ldr__tick { width: 1px; height: 9px; flex: none; background: rgba(228,204,164,.7); transform: scaleY(0); animation: ldrTick .5s .85s var(--out) forwards; }
.ldr__line { flex: 1; height: 1px; background: rgba(228,204,164,.5); transform: scaleX(0); will-change: transform; }
.ldr__line:first-of-type { transform-origin: 100% 50%; }
.ldr__line:last-of-type { transform-origin: 0 50%; }
.ldr__val { flex: none; padding: 0 1rem; font-family: var(--f-serif); color: #f1e3c8; white-space: nowrap; line-height: 1; }
.ldr__val b { font-weight: 400; font-size: 1.15rem; letter-spacing: .04em; display: inline-block; min-width: 1.9em; text-align: right; font-variant-numeric: tabular-nums; }
.ldr__val em { font-style: italic; font-size: .78rem; margin-left: .3em; color: rgba(228,204,164,.7); }
.ldr__tag { margin: 1.25rem 0 0; font-size: .58rem; font-weight: 500; letter-spacing: .62em; text-indent: .62em; text-transform: uppercase; color: rgba(228,204,164,.55); opacity: 0; transform: translateY(6px); animation: ldrUp .9s 1.05s var(--out) forwards; }
/* atterraggio sulla pagina */
.hero__media, .page-hero__media { transition: transform 2.4s cubic-bezier(.16,1,.3,1); }
html.is-intro .hero__media, html.is-intro .page-hero__media { transform: scale(1.08); }
html.is-intro .page-hero .container > * { opacity: 0; }
html.is-landing .page-hero .container > * { animation: ldrUp 1.1s cubic-bezier(.16,1,.3,1) both; }
html.is-landing .page-hero .container > :nth-child(2) { animation-delay: .1s; }
html.is-landing .page-hero .container > :nth-child(3) { animation-delay: .2s; }
html.is-landing .page-hero .container > :nth-child(n+4) { animation-delay: .3s; }
html.is-intro .main-nav li, html.is-intro .btn--header, html.is-intro .nav-toggle { opacity: 0; }
html.is-landing .main-nav li, html.is-landing .btn--header, html.is-landing .nav-toggle { animation: ldrFade 1s ease both; }
html.is-landing .main-nav li:nth-child(1) { animation-delay: .55s; } html.is-landing .main-nav li:nth-child(2) { animation-delay: .61s; }
html.is-landing .main-nav li:nth-child(3) { animation-delay: .67s; } html.is-landing .main-nav li:nth-child(4) { animation-delay: .73s; }
html.is-landing .main-nav li:nth-child(5) { animation-delay: .79s; } html.is-landing .main-nav li:nth-child(6) { animation-delay: .85s; }
html.is-landing .main-nav li:nth-child(7) { animation-delay: .91s; } html.is-landing .main-nav li:nth-child(8) { animation-delay: .97s; }
html.is-landing .btn--header, html.is-landing .nav-toggle { animation-delay: 1.05s; }
html.is-intro .hero__script { opacity: 0; }
html.is-landing .hero__script { animation: ldrWrite 1.7s 1.1s cubic-bezier(.5,0,.3,1) both; }
@keyframes ldrFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes ldrUp { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes ldrRise { to { transform: none; } }
@keyframes ldrCut { to { transform: scaleX(1); } }
@keyframes ldrCutOut { to { opacity: 0; transform: scaleX(1.25); } }
@keyframes ldrTick { to { transform: scaleY(1); } }
@keyframes ldrGlow { 0% { opacity: 0; transform: scale(.8); } 45% { opacity: 1; transform: scale(1); } 100% { opacity: .6; transform: scale(1.05); } }
@keyframes ldrWrite { from { opacity: 0; clip-path: inset(-20% 100% -20% 0); } to { opacity: 1; clip-path: inset(-20% -5% -20% 0); } }
@media (max-width: 699px) { .ldr__rise { width: 144px; } .ldr__cut { width: 160px; } .ldr__glow { width: 600px; height: 600px; margin: -340px 0 0 -300px; } }
@media (prefers-reduced-motion: reduce) { .ldr { display: none; } }

/* home: FAQ + tabella misure */
.home-faq { display: grid; grid-template-columns: 1.15fr .85fr; gap: 3.5rem; align-items: start; }
.home-faq .faq { margin-top: 1.4rem; }
.spec-table { width: 100%; margin-top: 1.4rem; border-collapse: collapse; background: #fff; font-size: .86rem; box-shadow: 0 30px 60px -45px rgba(40,25,10,.4); }
.spec-table caption { caption-side: bottom; text-align: left; padding-top: .7rem; font-size: .74rem; color: var(--muted); }
.spec-table th, .spec-table td { padding: .85rem 1rem; text-align: left; border-bottom: 1px solid #efe8de; vertical-align: top; }
.spec-table thead th { font-size: .64rem; letter-spacing: .2em; text-transform: uppercase; color: var(--gold-600); font-weight: 600; background: #fbf8f3; }
.spec-table tbody th { font-weight: 600; color: var(--ink); }
.spec-table td:last-child { color: var(--muted); font-size: .8rem; }
@media (max-width: 999px) { .home-faq { grid-template-columns: 1fr; gap: 2.4rem; } }
@media (max-width: 599px) { .spec-table td:last-child, .spec-table th:last-child { display: none; } }

/* ---------------------------------------------------------------- Mazzetta colori RAL / NCS */
.mz { --mz-ease: cubic-bezier(.16,1,.3,1); color: var(--ink); }
.mz__loading { padding: 3rem 0; text-align: center; color: var(--muted); }
.mz__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.6rem; }
.mz__tabs { display: inline-flex; padding: 4px; background: #fff; border: 1px solid #e8e0d4; border-radius: 40px; }
.mz__tab { border: 0; background: none; padding: .6rem 1.2rem; border-radius: 40px; font: 600 .72rem var(--f-sans); letter-spacing: .12em; text-transform: uppercase; color: var(--text); cursor: pointer; transition: background .3s, color .3s; }
.mz__tab small { margin-left: .5rem; font-weight: 500; letter-spacing: .04em; opacity: .6; }
.mz__tab.is-on { background: var(--ink); color: #fff; }
.mz__search { position: relative; flex: 1; max-width: 360px; min-width: 220px; }
.mz__q { width: 100%; padding: .75rem 1.1rem; border: 1px solid #e3d9ca; border-radius: 40px; background: #fff; font: .85rem var(--f-sans); outline: none; transition: border-color .2s; }
.mz__q:focus { border-color: var(--gold); }
.mz__res { position: absolute; z-index: 20; left: 0; right: 0; top: calc(100% + 6px); max-height: 360px; overflow: auto; background: #fff; border: 1px solid #eadfcd; border-radius: 14px; box-shadow: var(--shadow); padding: .35rem; }
.mz__res button { display: grid; grid-template-columns: 26px auto 1fr; align-items: center; gap: .7rem; width: 100%; padding: .5rem .6rem; border: 0; background: none; border-radius: 9px; text-align: left; cursor: pointer; font: .8rem var(--f-sans); }
.mz__res button:hover { background: #f7f1e8; }
.mz__res i { width: 26px; height: 26px; border-radius: 6px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.08); }
.mz__res span { color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mz__res p { margin: .6rem; color: var(--muted); font-size: .8rem; }
.mz__body { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 2.4rem; align-items: start; }
.mz__stage { min-width: 0; }
.mz__groups { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: 1rem; }
.mz__chip { display: inline-flex; align-items: center; gap: .45rem; padding: .4rem .8rem .4rem .45rem; border: 1px solid #e6ddcf; border-radius: 30px; background: #fff; font: .72rem var(--f-sans); color: var(--text); cursor: pointer; transition: border-color .2s, transform .2s; }
.mz__chip:hover { border-color: var(--gold); transform: translateY(-1px); }
.mz__chip i { width: 16px; height: 16px; border-radius: 50%; box-shadow: inset 0 0 0 1px rgba(0,0,0,.1); }
/* ventaglio */
.mz__fan { position: relative; height: 380px; margin: 0 auto; max-width: 720px; --h: 300px; --w: 56px; --spread: 1; }
.mz__strip { position: absolute; left: 50%; bottom: 24px; width: var(--w); height: var(--h); margin-left: calc(var(--w) / -2); padding: 4px 4px 22px; border: 0; border-radius: 6px 6px 3px 3px; background: #fbf9f5; box-shadow: 0 1px 0 rgba(0,0,0,.06), 0 10px 24px -14px rgba(40,25,10,.55); display: flex; flex-direction: column; gap: 3px; cursor: pointer;
  transform-origin: 50% calc(100% - 12px); transform: rotate(0deg); transition: transform .9s var(--mz-ease); transition-delay: calc(var(--i) * 14ms); will-change: transform; }
.mz__strip i { flex: 1; border-radius: 2px; }
.mz__strip span { position: absolute; left: 0; right: 0; bottom: 4px; font: 600 .54rem var(--f-sans); letter-spacing: .06em; color: #8a7a66; text-align: center; }
.mz__fan.is-open .mz__strip { transform: rotate(calc(var(--a) * var(--spread) + var(--d, 0) * 1.4deg)); }
.mz__fan.is-open .mz__strip:hover { transform: rotate(calc(var(--a) * var(--spread) + var(--d, 0) * 1.4deg)) translateY(-10px); transition-delay: 0s; transition-duration: .35s; }
.mz__fan.has-on .mz__strip { transition-delay: 0s; transition-duration: .5s; }
.mz__fan.is-open .mz__strip.is-on { transform: rotate(calc(var(--a) * var(--spread))) translateY(-34px) scale(1.06); z-index: 50; box-shadow: 0 24px 40px -18px rgba(40,25,10,.6); }
.mz__pin { position: absolute; left: 50%; bottom: 24px; width: 16px; height: 16px; margin: 0 0 4px -8px; border-radius: 50%; background: radial-gradient(circle at 35% 35%, #f1ddb6, #9c7a4c); box-shadow: 0 2px 6px rgba(0,0,0,.35); z-index: 60; }
.mz__detail { margin-top: .6rem; }
.mz__rows { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: .45rem; }
.mz__row { display: grid; grid-template-columns: 40px 1fr; grid-template-rows: auto auto; column-gap: .75rem; align-items: center; padding: .45rem; border: 1px solid #eee5d8; border-radius: 10px; background: #fff; cursor: pointer; text-align: left; font: .78rem var(--f-sans); transition: border-color .2s, transform .2s, box-shadow .2s; }
.mz__row:hover { transform: translateY(-2px); box-shadow: 0 10px 22px -16px rgba(40,25,10,.5); }
.mz__row.is-on { border-color: var(--ink); }
.mz__row i { grid-row: span 2; width: 40px; height: 40px; border-radius: 7px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.08); }
.mz__row b { font-weight: 600; font-size: .78rem; }
.mz__row span { color: var(--muted); font-size: .74rem; }
/* NCS */
.mz__ncs { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 2rem; align-items: start; }
.mz__wheelbox { display: flex; flex-direction: column; align-items: center; gap: 1rem; }
.mz__wheel { width: 100%; max-width: 280px; height: auto; overflow: visible; }
.mz__hue { cursor: pointer; stroke: #f5f1ea; stroke-width: 1.2; transform-origin: 0 0; transition: transform .35s var(--mz-ease); outline: none; }
.mz__hue:hover, .mz__hue:focus-visible { transform: scale(1.05); }
.mz__hue.is-on { transform: scale(1.09); stroke: var(--ink); stroke-width: 2; }
.mz__wheel-t { font: 400 26px var(--f-serif); fill: var(--ink); }
.mz__wheel-s { font: 500 9px var(--f-sans); letter-spacing: .3em; text-transform: uppercase; fill: var(--muted); }
.mz__neutral i { background: linear-gradient(90deg, #f3f0ea, #8d8a86, #2a2927); }
.mz__neutral.is-on { border-color: var(--ink); }
.mz__tri-h { display: flex; justify-content: space-between; align-items: baseline; margin: 0 0 .8rem; font-family: var(--f-serif); font-size: 1.15rem; }
.mz__tri-h small { font: .72rem var(--f-sans); color: var(--muted); }
.mz__tri { position: relative; width: 100%; max-width: 440px; aspect-ratio: .95; background: linear-gradient(90deg, #fff, #fbf8f3); border: 1px solid #eee5d8; border-radius: 16px; }
.mz__tri-l { position: absolute; font: 600 .62rem var(--f-sans); letter-spacing: .2em; color: #a2927e; }
.mz__tri-w { left: 10px; top: 8px; } .mz__tri-s { left: 10px; bottom: 8px; } .mz__tri-c { right: 10px; top: 50%; }
.mz__dot { position: absolute; width: 7.4%; aspect-ratio: 1; transform: translate(-50%, -50%) scale(0); border: 0; border-radius: 50%; cursor: pointer; box-shadow: inset 0 0 0 1px rgba(0,0,0,.1), 0 3px 8px -4px rgba(0,0,0,.4); animation: mzPop .5s var(--mz-ease) forwards; animation-delay: calc(var(--k) * 6ms); transition: box-shadow .2s; }
.mz__dot:hover { z-index: 2; box-shadow: 0 0 0 2px #fff, 0 0 0 3px var(--ink), 0 6px 14px -6px rgba(0,0,0,.5); }
.mz__dot.is-on { z-index: 3; box-shadow: 0 0 0 3px #fff, 0 0 0 4px var(--ink); }
@keyframes mzPop { to { transform: translate(-50%, -50%) scale(1); } }
/* anteprima */
.mz__side { position: sticky; top: 6.5rem; background: #fff; border: 1px solid #ece4d8; border-radius: 18px; padding: 1.4rem; box-shadow: 0 30px 60px -45px rgba(40,25,10,.45); }
.mz__empty strong { display: block; font-family: var(--f-serif); font-size: 1.3rem; font-weight: 400; margin-bottom: .4rem; }
.mz__empty p { margin: 0; font-size: .85rem; color: var(--muted); }
.mz__preview { border-radius: 12px; padding: 18px 18px 10px; background: linear-gradient(180deg, #efe9df, #e4dccf); }
.mz__door { display: block; width: 100%; height: auto; max-height: 300px; filter: drop-shadow(0 18px 18px rgba(40,25,10,.25)); }
.mz__fin { display: inline-flex; margin: 1rem 0 .2rem; padding: 3px; border: 1px solid #e8e0d4; border-radius: 30px; }
.mz__fin button { border: 0; background: none; padding: .4rem .9rem; border-radius: 30px; font: 600 .66rem var(--f-sans); letter-spacing: .12em; text-transform: uppercase; cursor: pointer; color: var(--text); }
.mz__fin button.is-on { background: var(--ink); color: #fff; }
.mz__info { display: grid; gap: .15rem; margin: .8rem 0 1rem; }
.mz__code { font-family: var(--f-serif); font-size: 1.6rem; font-weight: 400; line-height: 1.1; }
.mz__name { font-size: .92rem; }
.mz__hex { font-size: .72rem; color: var(--muted); }
.mz__copy { justify-self: start; margin-top: .3rem; border: 0; background: none; padding: 0; font: 600 .7rem var(--f-sans); letter-spacing: .1em; text-transform: uppercase; color: var(--gold-600); cursor: pointer; }
.mz__actions { display: grid; gap: .5rem; }
.mz__btn { display: flex; justify-content: center; align-items: center; padding: .85rem 1rem; border: 1px solid var(--gold); border-radius: 3px; background: transparent; color: var(--gold-600); font: 600 .7rem var(--f-sans); letter-spacing: .14em; text-transform: uppercase; text-decoration: none; cursor: pointer; transition: background .25s, color .25s; }
.mz__btn:hover { background: var(--gold); color: #fff; }
.mz__btn--gold { background: var(--gold); color: #fff; }
.mz__btn--gold:hover { background: var(--gold-600); border-color: var(--gold-600); }
.mz__note { margin: .9rem 0 0; font-size: .7rem; line-height: 1.5; color: var(--muted); }
@media (max-width: 999px) {
  .mz__body { grid-template-columns: 1fr; }
  .mz__side { position: static; }
  .mz__ncs { grid-template-columns: 1fr; }
  .mz__wheelbox { max-width: 280px; margin: 0 auto; }
}
@media (max-width: 599px) {
  .mz__fan { height: 250px; --h: 196px; --w: 36px; --spread: .74; }
  .mz__strip { padding: 3px 3px 16px; gap: 2px; }
  .mz__strip span { font-size: .44rem; bottom: 3px; }
  .mz__groups { flex-wrap: nowrap; overflow-x: auto; margin: 0 -16px 1rem; padding: 0 16px .3rem; scrollbar-width: none; }
  .mz__chip { white-space: nowrap; }
  .mz__search { max-width: none; }
}
@media (prefers-reduced-motion: reduce) { .mz__strip { transition: none; } .mz__dot { animation: none; transform: translate(-50%, -50%); } }

.mz-disclaimer { font-size: .82rem !important; color: var(--muted) !important; border-left: 2px solid var(--gold-300); padding-left: .9rem; }

/* ---------------------------------------------------------------- Pagine partner (elettrodomestici, luci, marchi) */
.pt-intro { display: grid; grid-template-columns: 1.1fr .9fr; gap: 4rem; align-items: center; }
.pt-duo { display: grid; gap: 1rem; }
.pt-brand { position: relative; display: grid; gap: .35rem; padding: 1.7rem 1.8rem; border-radius: 16px; color: #fff; text-decoration: none; overflow: hidden; isolation: isolate; box-shadow: 0 30px 60px -40px rgba(30,20,10,.7); transition: transform .5s var(--ease), box-shadow .5s var(--ease); }
.pt-brand::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--pt-bg); }
.pt-brand::after { content: ""; position: absolute; right: -60px; top: -60px; width: 220px; height: 220px; border-radius: 50%; z-index: -1; background: radial-gradient(closest-side, rgba(255,255,255,.14), transparent); transition: transform .8s var(--ease); }
.pt-brand:hover { transform: translateY(-4px); box-shadow: 0 40px 70px -40px rgba(30,20,10,.85); }
.pt-brand:hover::after { transform: translate(-30px, 30px) scale(1.2); }
.pt-brand__k { font-size: .62rem; letter-spacing: .26em; text-transform: uppercase; opacity: .75; }
.pt-brand strong { font-family: var(--f-serif); font-weight: 400; font-size: 2.6rem; letter-spacing: .12em; line-height: 1; }
.pt-brand > span:not(.pt-brand__k) { font-size: .86rem; opacity: .85; max-width: 30ch; }
.pt-brand em { font-style: normal; font-size: .68rem; letter-spacing: .18em; text-transform: uppercase; color: var(--gold-200); display: inline-flex; gap: .5rem; align-items: center; margin-top: .4rem; }
.pt-brand--smeg { --pt-bg: linear-gradient(135deg, #2a2320, #3d302a 60%, #5a4536); }
.pt-brand--neff { --pt-bg: linear-gradient(135deg, #1d2226, #2c343a 60%, #45505a); }
.pt-brand--ls { --pt-bg: linear-gradient(135deg, #1e1b16, #332b21 60%, #6a5433); }
.pt-brand--red { --pt-bg: linear-gradient(135deg, #2a1616, #4a2020 60%, #7a3326); }
.pt-band { position: relative; overflow: hidden; }
.pt-light { color: #fff; }
.pt-light-p { color: rgba(255,255,255,.78); line-height: 1.75; font-size: .95rem; }
.pt-band .pt-light-p strong { color: #fff; }
.pt-h3 { font-family: var(--f-serif); font-weight: 400; font-size: 1.35rem; color: var(--gold-200); margin: 2rem 0 .9rem; }
.pt-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: .8rem; }
.pt-card { padding: 1.1rem 1.1rem 1.2rem; border: 1px solid rgba(220,198,163,.22); border-radius: 12px; background: rgba(255,255,255,.03); transition: border-color .3s, background .3s; }
.pt-card:hover { border-color: rgba(220,198,163,.5); background: rgba(255,255,255,.06); }
.pt-card strong { display: block; font-family: var(--f-serif); font-weight: 400; font-size: 1.15rem; color: #fff; margin-bottom: .35rem; }
.pt-card p { margin: 0; font-size: .82rem; line-height: 1.55; color: rgba(255,255,255,.72); }
.pt-chips { display: flex; flex-wrap: wrap; gap: .4rem; margin: .4rem 0 1.2rem; }
.pt-chips span { padding: .42rem .85rem; border: 1px solid rgba(220,198,163,.3); border-radius: 30px; font-size: .74rem; color: #f1e4cc; }
.pt-side { position: sticky; top: 6.5rem; display: grid; gap: 1rem; }
.pt-fig { margin: 0; border-radius: 14px; overflow: hidden; box-shadow: 0 30px 60px -40px rgba(0,0,0,.6); }
.pt-fig img { display: block; width: 100%; height: auto; max-height: 460px; object-fit: cover; }
.pt-fig figcaption { padding: .6rem .9rem; font-size: .74rem; color: var(--muted); background: #fff; }
.pt-band .pt-fig figcaption { background: #231a14; color: rgba(255,255,255,.6); }
.pt-note { padding: 1.2rem 1.3rem; border-radius: 12px; background: rgba(220,198,163,.1); border: 1px solid rgba(220,198,163,.25); color: rgba(255,255,255,.82); font-size: .86rem; line-height: 1.6; }
.pt-note strong { display: block; font-size: .64rem; letter-spacing: .22em; text-transform: uppercase; color: var(--gold-200); margin-bottom: .4rem; }
.pt-note p { margin: 0; }
.pt-note--light { background: #fbf7f0; border-color: #eadfcd; color: var(--text); }
.pt-note--light strong { color: var(--gold-600); }
.pt-feature { display: grid; grid-template-columns: 96px 1fr; gap: 1.3rem; align-items: center; padding: 1.3rem 0; border-top: 1px solid var(--line); }
.pt-feature h3 { font-family: var(--f-serif); font-weight: 400; font-size: 1.3rem; margin: 0 0 .35rem; }
.pt-feature p { margin: 0; font-size: .9rem; line-height: 1.65; color: var(--text); }
.pt-feature__art { width: 96px; height: 96px; border-radius: 18px; background: linear-gradient(145deg, #f4efe7, #e7ddcd); display: grid; place-items: center; }
.pt-oven { position: relative; width: 56px; height: 52px; border-radius: 6px; background: #1d1d1f; box-shadow: inset 0 0 0 2px #3a3a3d; overflow: hidden; }
.pt-oven::before { content: ""; position: absolute; left: 6px; right: 6px; top: 6px; height: 4px; border-radius: 2px; background: #9aa0a6; }
.pt-oven i { position: absolute; left: 4px; right: 4px; top: 14px; bottom: 4px; border-radius: 3px; background: linear-gradient(180deg, #3a3a3d, #151517); animation: ptSlide 3.6s cubic-bezier(.7,0,.2,1) infinite; }
@keyframes ptSlide { 0%, 18% { transform: none; } 45%, 70% { transform: translateY(105%); } 95%, 100% { transform: none; } }
.pt-flex { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.pt-flex i { width: 26px; height: 26px; border-radius: 50%; box-shadow: inset 0 0 0 1px rgba(0,0,0,.15), 0 4px 8px -4px rgba(0,0,0,.5); }
.pt-knob { width: 50px; height: 50px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #5b5f64, #1f2124); box-shadow: 0 6px 12px -6px rgba(0,0,0,.6); position: relative; animation: ptTwist 4s ease-in-out infinite; }
.pt-knob::after { content: ""; position: absolute; left: 50%; top: 6px; width: 3px; height: 12px; margin-left: -1.5px; border-radius: 2px; background: var(--gold-200); }
@keyframes ptTwist { 0%, 20% { transform: rotate(-40deg); } 50%, 70% { transform: rotate(80deg); } 100% { transform: rotate(-40deg); } }
.pt-steps { list-style: none; margin: 2.4rem 0 2.2rem; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; counter-reset: none; }
.pt-steps li { position: relative; padding: 1.4rem 1.3rem; background: #fff; border-radius: 14px; border: 1px solid #ece3d6; }
.pt-steps li::after { content: ""; position: absolute; right: -1rem; top: 2.1rem; width: 1rem; height: 1px; background: var(--gold-300); }
.pt-steps li:last-child::after { display: none; }
.pt-steps span { font-family: var(--f-serif); font-size: 1.9rem; color: var(--gold); line-height: 1; }
.pt-steps h3 { font-size: 1.05rem; margin: .5rem 0 .35rem; }
.pt-steps p { margin: 0; font-size: .84rem; line-height: 1.55; color: var(--muted); }
.pt-table-wrap { overflow-x: auto; margin-top: 1.6rem; }
.pt-table { min-width: 560px; }
.pt-table--3 td:nth-child(3) { color: var(--text); font-size: .86rem; }
.pt-badges { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; margin-top: 2.4rem; }
.pt-badge { padding: 1.4rem 1.3rem; border-radius: 14px; border: 1px solid rgba(220,198,163,.2); background: rgba(255,255,255,.03); transition: transform .4s var(--ease), border-color .3s; }
.pt-badge:hover { transform: translateY(-3px); border-color: rgba(220,198,163,.5); }
.pt-badge svg { width: 38px; height: 38px; fill: none; stroke: var(--gold-200); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.pt-badge strong { display: block; margin: .8rem 0 .35rem; font-family: var(--f-serif); font-weight: 400; font-size: 1.15rem; color: #fff; }
.pt-badge p { margin: 0; font-size: .8rem; line-height: 1.6; color: rgba(255,255,255,.7); }
.pt-list { list-style: none; padding: 0; margin: 1.4rem 0 0; display: grid; gap: .7rem; }
.pt-list li { display: grid; grid-template-columns: 22px 1fr; gap: .7rem; font-size: .92rem; line-height: 1.6; color: var(--text); }
.pt-list svg { width: 20px; height: 20px; margin-top: .15rem; fill: none; stroke: var(--gold); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.pt-sources { margin-top: 2.2rem; font-size: .72rem; line-height: 1.6; color: var(--muted); }
.pt-sources a { color: var(--gold-600); }
.pt-groups { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.2rem; margin-top: 2rem; }
.pt-group { padding: 1.5rem 1.5rem 1.2rem; background: #fff; border: 1px solid #ece3d6; border-radius: 16px; box-shadow: 0 24px 50px -44px rgba(40,25,10,.5); transition: transform .4s var(--ease); }
.pt-group:hover { transform: translateY(-3px); }
.pt-group header { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; margin-bottom: .8rem; }
.pt-group h2 { font-size: 1.35rem; margin: 0; }
.pt-group .link-arrow { font-size: .62rem; }
.pt-group ul { list-style: none; margin: 0; padding: 0; }
.pt-group li { display: grid; gap: .1rem; padding: .7rem 0; border-top: 1px solid #f1ebe2; }
.pt-group li strong { font-size: .95rem; color: var(--ink); }
.pt-group li span { font-size: .8rem; color: var(--muted); }
@media (max-width: 999px) {
  .pt-intro { grid-template-columns: 1fr; gap: 2rem; }
  .pt-cards { grid-template-columns: 1fr; }
  .pt-side { position: static; }
  .pt-steps { grid-template-columns: 1fr 1fr; }
  .pt-steps li::after { display: none; }
  .pt-badges { grid-template-columns: 1fr 1fr; }
  .pt-groups { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 599px) {
  .pt-brand strong { font-size: 2.1rem; }
  .pt-steps, .pt-badges, .pt-groups { grid-template-columns: 1fr; }
  .pt-feature { grid-template-columns: 72px 1fr; }
  .pt-feature__art { width: 72px; height: 72px; }
}
@media (prefers-reduced-motion: reduce) { .pt-oven i, .pt-knob { animation: none; } }
.pt-brand .arrow, .post-card__meta .arrow { width: .8rem; height: .55rem; fill: none; stroke: currentColor; stroke-width: 1.3; transition: transform .3s var(--ease); }
.pt-brand:hover .arrow { transform: translateX(4px); }

/* ================================================================ Rifinitura: forme, movimento, dettagli */
:root { --r-img: 12px; --r-card: 16px; }
/* angoli morbidi e ombre coerenti */
.gallery__item, .pgallery .gallery__item { border-radius: var(--r-img); isolation: isolate; }
.svc-card, .post-card { border-radius: var(--r-card); overflow: hidden; }
.card { border-radius: var(--r-card); }
.side-card { border-radius: 18px; }
.img-frame img { border-radius: var(--r-img); }
.img-frame::before { border-radius: calc(var(--r-img) + 6px); }
.post-fig img { border-radius: var(--r-img); }
.spec-table { border-collapse: separate; border-spacing: 0; border-radius: var(--r-img); overflow: hidden; }
.field input, .field select, .field textarea { border-radius: 10px; }
.btn { border-radius: 6px; }
.btn--gold { position: relative; overflow: hidden; isolation: isolate; }
.btn--gold::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,.35) 50%, transparent 70%); transform: translateX(-120%); transition: transform .8s var(--ease); }
.btn--gold:hover::after { transform: translateX(120%); }
/* FAQ a schede */
.faq { display: grid; gap: .6rem; }
.faq details { background: #fff; border: 1px solid #ece3d6; border-radius: 14px; padding: 0 1.3rem; transition: box-shadow .35s var(--ease), border-color .35s; }
.faq details:hover { border-color: #dcc9ab; }
.faq details[open] { box-shadow: 0 22px 40px -32px rgba(40,25,10,.55); border-color: #d9c19b; }
.faq summary { padding: 1.15rem 2.2rem 1.15rem 0; font-size: 1.08rem; }
.faq details p { margin: 0 0 1.2rem; }
.section--dark .faq details { background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.1); }
/* card: sollevamento e filo oro */
.card, .svc-card, .post-card, .pt-group { transition: transform .5s var(--ease), box-shadow .5s var(--ease), border-color .4s; }
.card:hover { transform: translateY(-4px); box-shadow: 0 26px 50px -34px rgba(40,25,10,.5); border-color: #dcc9ab; }
.svc-card:hover, .post-card:hover { box-shadow: 0 30px 56px -36px rgba(40,25,10,.55); }
.gallery__item img { transition: transform 1.1s var(--ease), filter .6s; }
.gallery__item:hover img { transform: scale(1.06); }
.gallery__cap { transition: transform .5s var(--ease), opacity .5s; }
/* occhiello con filo che si allunga */
.eyebrow--dark::before, .section--dark .eyebrow::before { content: ""; display: inline-block; vertical-align: middle; width: 1.6rem; height: 1px; margin: 0 .7rem .2em 0; background: currentColor; opacity: .7; transform-origin: left; transition: transform .9s var(--ease) .15s; }
.center .eyebrow--dark::before, .center .eyebrow::before { display: none; }
.reveal:not(.is-in) .eyebrow--dark::before, .eyebrow--dark.reveal:not(.is-in)::before { transform: scaleX(0); }
/* entrate a cascata (classi aggiunte da main.js) */
.rv-auto { transition-delay: var(--rv, 0ms); }
.rv-title.reveal { transform: translateY(18px); filter: blur(4px); transition: opacity .9s var(--ease), transform .9s var(--ease), filter .9s var(--ease); transition-delay: var(--rv, 0ms); }
.rv-title.reveal.is-in { filter: none; }
.rv-img { clip-path: inset(0 0 100% 0 round var(--r-img)); transition: clip-path 1.2s cubic-bezier(.77,0,.18,1) var(--rv, 0ms); }
.rv-img img { transform: scale(1.12); transition: transform 1.6s var(--ease) var(--rv, 0ms); }
.is-in > .rv-img, .is-in .rv-img, .rv-img.is-in { clip-path: inset(0 0 0 0 round var(--r-img)); }
.is-in > .rv-img img, .is-in .rv-img img, .rv-img.is-in img { transform: none; }
.work-card:hover .work-card__img img, .svc-card:hover .svc-card__img img, .post-card:hover .post-card__img img, .gallery__item:hover img { transform: scale(1.06); }
.svc-card .rv-img, .post-card .rv-img, .work-card .rv-img { clip-path: inset(0 0 100% 0); }
.is-in .svc-card__img.rv-img, .svc-card.is-in .rv-img, .post-card.is-in .rv-img, .work-card.is-in .rv-img { clip-path: inset(0 0 0 0); }
/* barra di lettura */
.read-bar { position: fixed; left: 0; right: 0; top: 0; height: 2px; z-index: 200; background: linear-gradient(90deg, var(--gold-600), var(--gold-200)); transform: scaleX(0); transform-origin: left; pointer-events: none; }
/* profondità sulle copertine */
.page-hero__media img { will-change: transform; }
/* striscia di foto che scorre (home) */
.marquee { overflow: hidden; padding: 1.2rem 0 1.6rem; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.marquee__track { display: flex; gap: 1rem; width: max-content; animation: marquee 70s linear infinite; }
.marquee:hover .marquee__track { animation-play-state: paused; }
.marquee a { position: relative; flex: none; width: 17rem; aspect-ratio: 4 / 3; border-radius: var(--r-img); overflow: hidden; box-shadow: 0 18px 36px -26px rgba(40,25,10,.6); }
.marquee a:nth-child(3n+2) { width: 13rem; aspect-ratio: 3 / 4; }
.marquee img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--ease); }
.marquee a:hover img { transform: scale(1.07); }
.marquee a span { position: absolute; left: .8rem; right: .8rem; bottom: .7rem; color: #fff; font-size: .72rem; font-weight: 600; text-shadow: 0 1px 8px rgba(0,0,0,.5); opacity: 0; transform: translateY(6px); transition: opacity .4s, transform .4s var(--ease); }
.marquee a::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 55%, rgba(20,13,9,.7)); opacity: 0; transition: opacity .4s; }
.marquee a:hover span, .marquee a:hover::after { opacity: 1; transform: none; }
.marquee a span { z-index: 1; }
@keyframes marquee { to { transform: translateX(-50%); } }
.home-strip__head { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; }
@media (max-width: 699px) { .marquee a { width: 12rem; } .marquee a:nth-child(3n+2) { width: 9rem; } .marquee__track { animation-duration: 55s; } }
@media (prefers-reduced-motion: reduce) {
  .rv-img, .rv-img img, .rv-title.reveal { clip-path: none !important; transform: none !important; filter: none !important; }
  .marquee__track { animation: none; }
}
.rv-pic img { clip-path: inset(0 0 100% 0); transform: scale(1.12); transition: clip-path 1.2s cubic-bezier(.77,0,.18,1) var(--rv, 0ms), transform 1.6s var(--ease) var(--rv, 0ms); }
.rv-pic.is-in img { clip-path: inset(0 0 0 0); transform: none; }
.rv-pic.is-in:hover img { transform: scale(1.06); }
@media (prefers-reduced-motion: reduce) { .rv-pic img { clip-path: none; transform: none; } }

/* ---------------------------------------------------------------- Tessere dei marchi e pagine marchio */
.bt-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; margin-top: 2rem; }
.bt-h { margin: 2.6rem 0 0; font-size: 1.15rem; }
.bt { position: relative; display: grid; align-content: space-between; min-height: 11.5rem; padding: 1.3rem 1.3rem 1.2rem; border-radius: 16px; overflow: hidden; isolation: isolate; color: #fff; text-decoration: none; background: #1d1611;
  box-shadow: 0 24px 44px -34px rgba(20,12,6,.9); transition: transform .55s var(--ease), box-shadow .55s var(--ease); }
.bt::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(120% 90% at 100% 0%, color-mix(in srgb, var(--bc) 70%, transparent), transparent 62%), linear-gradient(160deg, #241b15, #16110d); transition: opacity .5s; }
.bt::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: var(--bc); transform: scaleX(.18); transform-origin: left; transition: transform .6s var(--ease); }
.bt:hover { transform: translateY(-5px); box-shadow: 0 34px 60px -34px rgba(20,12,6,.95); }
.bt:hover::after { transform: scaleX(1); }
.bt__cat { font-size: .58rem; letter-spacing: .26em; text-transform: uppercase; color: rgba(255,255,255,.62); }
.bt strong { display: block; margin: .9rem 0 .4rem; font-family: var(--f-serif); font-weight: 400; font-size: 1.75rem; line-height: 1.05; letter-spacing: .02em; }
.bt__logo { display: block; max-width: 78%; max-height: 3.6rem; margin: .9rem 0 .5rem; object-fit: contain; object-position: left center; filter: brightness(0) invert(1); opacity: .95; }
.bt em { font-style: normal; font-size: .78rem; line-height: 1.45; color: rgba(255,255,255,.72); padding-right: 1.6rem; }
.bt__go { position: absolute; right: 1.1rem; bottom: 1.1rem; color: var(--gold-200); opacity: .8; transition: transform .45s var(--ease), opacity .3s; }
.bt__go .arrow { width: .9rem; height: .6rem; fill: none; stroke: currentColor; stroke-width: 1.3; }
.bt:hover .bt__go { transform: translateX(4px); opacity: 1; }
.bt-grid--side { grid-template-columns: 1fr; margin-top: 1.2rem; }
.bt-grid--side .bt { min-height: 0; }
.section--sand .bt-grid + p .link-arrow { color: var(--gold-600); }
/* pagina marchio */
.page-hero--brand .page-hero__media::after { content: ""; position: absolute; inset: 0; background: radial-gradient(80% 90% at 90% 10%, color-mix(in srgb, var(--bc) 55%, transparent), transparent 60%); pointer-events: none; }
.bp-intro { display: grid; grid-template-columns: 1.2fr .8fr; gap: 3.5rem; align-items: center; }
.bp-card { position: relative; display: grid; gap: .5rem; padding: 2.2rem 2rem; border-radius: 22px; overflow: hidden; isolation: isolate; color: #fff; background: #1d1611; box-shadow: 0 40px 80px -50px rgba(20,12,6,.9); }
.bp-card::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(120% 100% at 100% 0%, color-mix(in srgb, var(--bc) 75%, transparent), transparent 65%), linear-gradient(160deg, #261c15, #15100c); }
.bp-card strong { font-family: var(--f-serif); font-weight: 400; font-size: 2.6rem; line-height: 1; margin: .6rem 0 .3rem; }
.bp-card em { font-style: normal; color: rgba(255,255,255,.75); font-size: .92rem; line-height: 1.55; }
.bp-card a { justify-self: start; margin-top: 1rem; font-size: .66rem; letter-spacing: .2em; text-transform: uppercase; color: var(--gold-200); text-decoration: none; display: inline-flex; gap: .5rem; align-items: center; }
.bp-card a .arrow { width: .8rem; height: .55rem; fill: none; stroke: currentColor; stroke-width: 1.3; }
.bp-feats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin-top: 2.2rem; }
.bp-feat { padding: 1.5rem 1.4rem; background: #fff; border: 1px solid #ece3d6; border-radius: 16px; }
.bp-feat span { font-family: var(--f-serif); font-size: 1.6rem; color: var(--gold); }
.bp-feat h3 { font-size: 1.1rem; margin: .45rem 0 .4rem; }
.bp-feat p { margin: 0; font-size: .86rem; line-height: 1.6; color: var(--muted); }
.bp-uses { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; margin-top: 1.6rem; }
.bp-uses a { display: grid; gap: .15rem; padding: .9rem 1rem; border: 1px solid #ece3d6; border-radius: 12px; background: #fff; text-decoration: none !important; transition: border-color .3s, transform .4s var(--ease); }
.bp-uses a:hover { border-color: var(--gold-300); transform: translateY(-2px); }
.bp-uses strong { color: var(--ink); font-size: .92rem; }
.bp-uses span { color: var(--muted); font-size: .78rem; line-height: 1.45; }
.bp-pics { display: grid; gap: .9rem; }
.bp-pics .pt-fig img { max-height: 300px; }
@media (max-width: 999px) {
  .bt-grid { grid-template-columns: 1fr 1fr; }
  .bp-intro { grid-template-columns: 1fr; gap: 2rem; }
  .bp-feats { grid-template-columns: 1fr 1fr; }
  .bp-pics { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 599px) {
  .bt-grid { grid-template-columns: 1fr 1fr; gap: .7rem; }
  .bt { min-height: 9.5rem; padding: 1rem; }
  .bt strong { font-size: 1.3rem; }
  .bt em { display: none; }
  .bp-feats, .bp-uses { grid-template-columns: 1fr; }
}

/* fascia loghi dei marchi (home e lavorazioni) */
.lg-band { margin-top: 2rem; padding: 1.6rem 0; border-radius: 20px; background: linear-gradient(160deg, #241b15, #15100c); box-shadow: 0 30px 60px -45px rgba(20,12,6,.9); overflow: hidden; }
.lg-strip { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 9%, #000 91%, transparent); mask-image: linear-gradient(90deg, transparent, #000 9%, #000 91%, transparent); }
.lg-track { display: flex; align-items: center; gap: 3.6rem; width: max-content; padding: 0 1.8rem; animation: marquee 48s linear infinite; }
.lg-band:hover .lg-track { animation-play-state: paused; }
.lg-item { flex: none; display: grid; place-items: center; height: 3.4rem; opacity: .62; transition: opacity .35s, transform .35s var(--ease); }
.lg-item:hover { opacity: 1; transform: translateY(-2px); }
.lg-item img { display: block; max-height: 2.6rem; max-width: 9.5rem; width: auto; object-fit: contain; filter: brightness(0) invert(1); }
.lg-item span { font-family: var(--f-serif); font-size: 1.35rem; color: #fff; white-space: nowrap; }
@media (max-width: 599px) { .lg-band { padding: 1.2rem 0; border-radius: 16px; } .lg-track { gap: 2.4rem; animation-duration: 36s; } .lg-item img { max-height: 2rem; max-width: 7rem; } }
@media (prefers-reduced-motion: reduce) { .lg-track { animation: none; flex-wrap: wrap; justify-content: center; width: auto; } }

/* ================================================================ Telefono: punti di forza 2 per fila, metodo come linea del tempo */
@media (max-width: 699px) {
  /* punti di forza: schede 2 per fila, l'ultima a tutta larghezza */
  .features__grid { grid-template-columns: 1fr 1fr; gap: 10px; padding: 22px 0 26px; }
  .feature, .feature:last-child { grid-column: auto; }
  .feature { display: flex; flex-direction: column; align-items: center; padding: 18px 12px 16px; background: #fff; border: 1px solid #eee5d8; border-radius: 16px; box-shadow: 0 16px 30px -26px rgba(40,25,10,.55); }
  .feature::before, .feature + .feature::before { display: none !important; }
  .feature__ico { box-sizing: content-box; width: 26px; height: 26px; padding: 11px; margin: 0 0 12px; border-radius: 50%; background: linear-gradient(145deg, #faf3e8, #f0e3cf); stroke-width: 1.3; }
  .feature h3 { font-size: 11.5px; letter-spacing: .06em; margin-bottom: 6px; }
  .feature p { font-size: 12px; line-height: 1.45; margin: 0; }
  .feature p br { display: none; }
  .feature:last-child:nth-child(odd) { grid-column: 1 / -1; display: grid; grid-template-columns: auto 1fr; align-items: center; column-gap: 14px; text-align: left; padding: 16px 18px; }
  .feature:last-child:nth-child(odd) .feature__ico { grid-row: span 2; margin: 0; }
  .feature:last-child:nth-child(odd) h3 { margin: 0 0 3px; }

  /* metodo: linea del tempo verticale con numeri */
  .process { display: block; position: relative; margin-top: 1.6rem !important; padding-left: 0; }
  .process::before { display: block; content: ""; position: absolute; left: 22px; top: 24px; bottom: 24px; right: auto; width: 1px; height: auto; background: linear-gradient(180deg, var(--gold-300), var(--gold-200) 70%, transparent); }
  .process__step { display: grid; grid-template-columns: 46px 1fr; column-gap: 14px; align-items: start; text-align: left; padding: 0; margin: 0 0 12px; }
  .process__step::before { grid-row: span 2; width: 46px; height: 46px; margin: 0; font-size: 15px; background: var(--paper); box-shadow: 0 0 0 5px var(--paper); z-index: 1; }
  .section--sand .process__step::before { background: #f3ece2; box-shadow: 0 0 0 5px #f3ece2; }
  .process__step h3, .process__step p { grid-column: 2; }
  .process__step h3 { margin: 0; padding: 13px 16px 0; font-size: 17px; background: #fff; border: 1px solid #eee5d8; border-bottom: 0; border-radius: 14px 14px 0 0; }
  .process__step p { margin: 0; padding: 4px 16px 14px; font-size: 13px; line-height: 1.5; background: #fff; border: 1px solid #eee5d8; border-top: 0; border-radius: 0 0 14px 14px; box-shadow: 0 16px 30px -28px rgba(40,25,10,.6); }
  .section--dark .process__step h3, .section--dark .process__step p { background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.1); }
  .process__step:last-child { margin-bottom: 0; }
}

/* ================================================================ Contatti: modulo compatto che invia su WhatsApp */
.form--wa { padding: 1.8rem 2rem; max-width: 34rem; justify-self: end; width: 100%; border-radius: 14px; }
.form--wa h2 { font-size: 1.45rem; }
.form--wa > p { font-size: .82rem; margin: 0; }
.form--wa .form-grid { gap: .8rem .9rem; margin-top: 1.1rem; }
.form--wa .field input, .form--wa .field select, .form--wa .field textarea { padding: .62rem .8rem; font-size: .88rem; border-radius: 8px; }
.form--wa .field textarea { min-height: 5.2rem; }
.form--wa .form-actions { margin-top: 1rem; }
.form--wa .form-status { font-size: .75rem; color: var(--muted); flex: 1 1 12rem; }
.form--wa .form-status.is-ok { color: #3d7a4d; }
.form--wa .btn { gap: .55rem; }
.form--wa .wa-ico { width: 1.05rem; height: 1.05rem; fill: currentColor; }
.contact-item__more { display: inline-block; margin-top: .35rem; font-size: .72rem !important; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--gold-600) !important; }
a.fc address { font-style: normal; }
@media (max-width: 999px) { .form--wa { justify-self: stretch; max-width: none; } }
@media (max-width: 699px) {
  .form--wa { padding: 22px 18px; }
  .form--wa .form-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .form--wa .field label { font-size: 10px; }
  .form--wa .field:nth-child(3), .form--wa .field:nth-child(4) { grid-column: auto; }
  .form--wa .form-actions .btn { width: 100%; justify-content: center; }
}

/* ================================================================ Avviso in cima (dal pannello admin) */
.avviso { position: fixed; inset: 0 0 auto; z-index: 101; height: 36px; display: flex; align-items: center; justify-content: center; gap: .6rem; padding: 0 2.6rem; background: #f3ece2; color: #2a221c; font-size: .74rem; letter-spacing: .02em; box-shadow: 0 1px 0 rgba(0,0,0,.06); }
.avviso p { margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.avviso a { color: var(--gold-600); text-decoration: underline; text-underline-offset: 2px; font-weight: 500; }
.avviso__dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--gold); margin-right: .55rem; vertical-align: middle; animation: avvisoPulse 2s ease-in-out infinite; }
@keyframes avvisoPulse { 50% { opacity: .35; } }
.avviso__x { position: absolute; right: .6rem; top: 50%; transform: translateY(-50%); width: 28px; height: 28px; border: 0; background: none; font-size: 1.2rem; line-height: 1; color: #6b5d4f; cursor: pointer; }
.avviso + .site-header { top: 36px; }
@media (max-width: 699px) { .avviso { font-size: 11.5px; padding: 0 2.4rem 0 1rem; justify-content: flex-start; } }

/* ================================================================ Campionario (pagina Lavorazioni) */
.campionario { max-width: 980px; margin: 2rem auto 0; display: flex; flex-direction: column; gap: .7rem; }
.campionario__g { background: #fff; border: 1px solid #ebe5dc; border-radius: 14px; padding: 0 1.2rem; }
.campionario__g summary { cursor: pointer; list-style: none; padding: 1rem 0; font-family: var(--f-serif); font-size: 1.15rem; color: #2a221c; display: flex; align-items: center; gap: .6rem; }
.campionario__g summary::-webkit-details-marker { display: none; }
.campionario__g summary::after { content: "+"; margin-left: auto; font-family: var(--f-sans); font-size: 1.2rem; color: var(--gold); transition: transform .3s; }
.campionario__g[open] summary::after { transform: rotate(45deg); }
.campionario__g summary small { font-family: var(--f-sans); font-size: .7rem; color: var(--muted); letter-spacing: .08em; }
.campionario__grid { grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)) !important; padding-bottom: 1.2rem; }
.campionario__grid .swatch { min-width: 0; overflow-wrap: anywhere; }
.campionario__grid .swatch__chip { position: relative; overflow: hidden; }
.campionario__grid .swatch__chip img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.campionario__grid .swatch strong { font-size: .72rem; line-height: 1.25; }
.campionario__grid .swatch__chip { border-radius: 10px; }
.campionario .campionario__grid { gap: .8rem; }
@media (max-width: 699px) {
  .campionario .campionario__grid { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: .6rem .5rem; }
  .campionario__g { padding: 0 .9rem; }
  .campionario__grid .swatch strong { font-size: 10.5px; }
}
.swatch__chip--ciclo { transition: background-color 1.2s ease; }
.swatch__chip--ciclo + strong + span { transition: opacity .4s; }
.swatch__chip--ciclo { position: relative; overflow: hidden; }
.ciclo__l { position: absolute; inset: 0; background-size: cover; background-position: center; opacity: 0; transition: opacity 1.2s ease; }
.ciclo__l.is-on { opacity: 1; }
/* contorno leggero per i campioni bianchissimi (Fenix Malé, Alaska, Kos) */
.swatch__chip--chiaro { position: relative; }
.swatch__chip--chiaro::after { content: ""; position: absolute; inset: 0; border: 1px solid rgba(42, 34, 28, .16); border-radius: inherit; pointer-events: none; z-index: 2; }
/* laccati: quadratino "qualsiasi colore" (porta alla mazzetta RAL · NCS) */
.swatch--tutti { display: block; color: inherit; text-decoration: none; }
.swatch__chip--rgb { background: radial-gradient(circle at 50% 50%, rgba(255,255,255,.55), rgba(255,255,255,0) 62%), conic-gradient(from 210deg, #e8574a, #f0a23b, #f2d649, #8cc66b, #3fb7a6, #3f86c8, #6a5bc4, #c457a7, #e8574a); transition: transform .4s var(--ease), filter .4s; }
.swatch--tutti:hover .swatch__chip--rgb { transform: rotate(18deg) scale(1.03); filter: saturate(1.15); }
.swatch--tutti strong { text-decoration: underline; text-decoration-color: var(--gold-300); text-underline-offset: 3px; }
.campionario__nota { margin: -.2rem 0 1rem; padding: .7rem .9rem; border-left: 2px solid var(--gold-300); background: #faf7f2; font-size: .82rem; line-height: 1.5; color: var(--muted); }
.campionario__sub { margin: 1.1rem 0 .6rem; font-family: var(--f-sans); font-size: .72rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--gold-600); }
.campionario__sub small { color: var(--muted); font-weight: 400; letter-spacing: .04em; margin-left: .3rem; }
.campionario__sub:first-of-type { margin-top: .2rem; }
.campionario__marca { border-top: 1px solid var(--line, #e6ded4); }
.campionario__marca > summary { cursor: pointer; padding: .75rem 0; font-family: var(--f-sans); font-size: .85rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--ink, #2b2420); list-style-position: inside; }
.campionario__marca > summary small { color: var(--muted); font-weight: 400; margin-left: .3rem; }
.campionario__marca[open] { padding-bottom: .8rem; }

/* ---------- Campionario con ricerca e filtri (js/campionario.js) ---------- */
.camp { max-width: 1080px; margin: 2rem auto 0; }
.camp__bar { position: sticky; top: 4.4rem; z-index: 5; background: rgba(251, 249, 246, .96); backdrop-filter: blur(8px); padding: .8rem 0 .6rem; display: grid; gap: .6rem; border-bottom: 1px solid #ebe5dc; }
.camp__cerca { display: flex; align-items: center; gap: .6rem; background: #fff; border: 1px solid #e2d9cc; border-radius: 40px; padding: 0 1.1rem; transition: border-color .2s, box-shadow .2s; }
.camp__cerca:focus-within { border-color: var(--gold); box-shadow: 0 0 0 3px rgba(176, 141, 87, .15); }
.camp__cerca svg { width: 18px; height: 18px; flex: none; fill: none; stroke: var(--gold-600, #8a6a3c); stroke-width: 2; stroke-linecap: round; }
.camp__cerca input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; padding: .85rem 0; font: inherit; font-size: .95rem; color: var(--ink); }
.camp__cats, .camp__marche { display: flex; gap: .4rem; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
.camp__cats::-webkit-scrollbar, .camp__marche::-webkit-scrollbar { display: none; }
.camp__pill, .camp__marca { flex: none; border: 1px solid #e2d9cc; background: #fff; color: #4a3f36; border-radius: 40px; padding: .45rem .9rem; font: inherit; font-size: .8rem; cursor: pointer; transition: background .2s, color .2s, border-color .2s; }
.camp__pill small, .camp__marca small { font-size: .68rem; opacity: .6; margin-left: .15rem; }
.camp__pill:hover, .camp__marca:hover { border-color: var(--gold); }
.camp__pill.is-on { background: var(--ink, #2b2420); border-color: var(--ink, #2b2420); color: #fff; }
.camp__marca { font-size: .74rem; padding: .35rem .75rem; }
.camp__marca.is-on { background: var(--gold); border-color: var(--gold); color: #fff; }
.camp__pill:disabled { opacity: .35; cursor: default; }
.camp__marche:empty { display: none; }
.camp__info { display: flex; align-items: center; gap: .8rem; flex-wrap: wrap; font-size: .8rem; color: var(--muted); }
.camp__coll { border: 1px solid #e2d9cc; border-radius: 40px; padding: .35rem .8rem; font: inherit; font-size: .78rem; background: #fff; color: #4a3f36; max-width: 100%; }
.camp__coll[hidden], .camp__azzera[hidden] { display: none; }
.camp__azzera { margin-left: auto; border: 0; background: none; color: var(--gold-600, #8a6a3c); font: inherit; font-size: .78rem; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.camp__nota { margin: 1rem 0 0; }
.camp__grid { margin-top: 1.1rem; }
.camp__sw { display: block; border: 0; background: none; padding: 0; font: inherit; text-align: left; cursor: zoom-in; }
.camp__sw .swatch__chip { transition: transform .25s var(--ease), box-shadow .25s; }
.camp__sw:hover .swatch__chip { transform: translateY(-2px); box-shadow: 0 8px 18px rgba(42, 34, 28, .14); }
.camp__sw span { display: block; font-size: .66rem; letter-spacing: .04em; color: var(--muted); }
.camp__vuoto { grid-column: 1 / -1; padding: 1.5rem 0; color: var(--muted); font-size: .9rem; }
.camp__piu { text-align: center; }
.camp__piu:not(:empty) { margin: .4rem 0 1rem; }
.camp.is-pronto .camp__riepilogo { display: none; }
.camp__riepilogo p { font-size: .85rem; color: var(--muted); margin: .4rem 0; }
.camp__zoom { border: 0; border-radius: 16px; padding: 1.2rem; width: min(440px, calc(100vw - 32px)); text-align: center; box-shadow: 0 30px 80px rgba(0, 0, 0, .35); }
.camp__zoom::backdrop { background: rgba(20, 16, 12, .6); backdrop-filter: blur(3px); }
.camp__zoomimg { aspect-ratio: 1; border-radius: 10px; overflow: hidden; background-size: cover; }
.camp__zoomimg img { width: 100%; height: 100%; object-fit: cover; display: block; }
.camp__zoomnome { font-family: var(--f-serif); font-size: 1.25rem; color: var(--ink); margin: .9rem 0 .1rem; }
.camp__zoominfo { font-size: .8rem; color: var(--muted); margin: 0 0 1rem; }
.camp__chiudi { position: absolute; top: .4rem; right: .6rem; border: 0; background: none; font-size: 1.6rem; line-height: 1; color: var(--muted); cursor: pointer; }
@media (max-width: 999px) { .camp__bar { top: 64px; } }
.camp__colori { display: flex; align-items: center; gap: .45rem; flex-wrap: wrap; }
.camp__lab { font-size: .72rem; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); margin-right: .2rem; }
.camp__col { width: 26px; height: 26px; border-radius: 50%; border: 2px solid #fff; background: var(--c); box-shadow: 0 0 0 1px #d9cfc2; cursor: pointer; padding: 0; transition: transform .2s, box-shadow .2s; }
.camp__col:hover { transform: scale(1.12); }
.camp__col.is-on { box-shadow: 0 0 0 2px var(--ink, #2b2420); transform: scale(1.12); }
.camp__col:disabled { opacity: .25; cursor: default; transform: none; }
@media (max-width: 700px) { .camp__bar { position: static; backdrop-filter: none; } .camp__col { width: 24px; height: 24px; } }