/* Font ufficiale: Gotham. In attesa dei file con licenza web si usa Montserrat, il libero piu' vicino:
   basta sostituire qui i @font-face con quelli di Gotham. */
@font-face{font-family:Montserrat;font-style:normal;font-weight:300;font-display:swap;src:url("../fonts/montserrat-300.woff2") format("woff2")}
@font-face{font-family:Montserrat;font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/montserrat-400.woff2") format("woff2")}
@font-face{font-family:Montserrat;font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/montserrat-500.woff2") format("woff2")}
@font-face{font-family:Montserrat;font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/montserrat-700.woff2") format("woff2")}

:root{
  --nero:#000;
  --giallo:#EED621;
  --bianco:#fff;
  --pietra:#E6E5E1;
  --grafite:#55544F;
  --head:72px;
  --gutter:clamp(16px,4.5vw,72px);
  --display:Oswald,"Arial Narrow",sans-serif;
  --testo:"Playfair Display",Georgia,serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:var(--head)}
body{margin:0;background:var(--bianco);color:var(--nero);font:400 1.125rem/1.7 var(--testo)}
img{display:block;max-width:100%}
h1,h2,h3,p,ul{margin:0;padding:0}
ul{list-style:none}
h1,h2,h3{font-family:var(--display);font-weight:300;line-height:1.08}
a{color:inherit}
:focus-visible{outline:3px solid currentColor;outline-offset:3px}
.skip{position:absolute;left:-999px;top:8px;z-index:60;background:var(--giallo);color:var(--nero);padding:.5rem 1rem;font-family:var(--display)}
.skip:focus{left:8px}

/* Testata */
.top{position:sticky;top:0;z-index:50;height:var(--head);display:flex;align-items:center;justify-content:space-between;padding:0 var(--gutter);background:var(--nero);color:var(--bianco)}
.logo img{height:46px;width:auto}
.nav ul{display:flex;gap:clamp(1.25rem,2.6vw,2.5rem)}
.nav a{font:400 1.0625rem/1 var(--display);text-decoration:none;padding:.5rem 0;display:block;border-bottom:2px solid transparent}
.nav a:hover{border-bottom-color:var(--giallo)}
.menu-btn{display:none;background:none;border:1px solid var(--bianco);color:var(--bianco);font:400 1rem/1 var(--display);padding:.6rem 1rem;cursor:pointer}

/* Hero */
.hero{position:relative;min-height:calc(100svh - var(--head));display:flex;flex-direction:column;justify-content:flex-end;background:var(--nero);color:var(--bianco);padding:var(--gutter);overflow:hidden}
.hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 12%}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 35%,rgba(0,0,0,.72) 72%)}
.hero-in{position:relative;z-index:1}
.hero h1{font-size:clamp(3.25rem,9.4vw,9.75rem);line-height:1.02;letter-spacing:-.01em;max-width:9.5em}
.hero-foot{display:flex;flex-wrap:wrap;gap:1.5rem 3rem;align-items:center;justify-content:space-between;margin-top:clamp(1.25rem,2.5vw,2.25rem)}
.hero-foot p{font-style:italic;font-size:clamp(1.125rem,1.5vw,1.375rem);line-height:1.5;max-width:36ch}

.btn{display:inline-block;background:var(--giallo);color:var(--nero);font:400 1.1875rem/1 var(--display);padding:1.05rem 1.75rem;text-decoration:none;transition:background .15s,color .15s}
.btn:hover{background:var(--bianco)}

/* Chi siamo */
.about{display:grid;grid-template-columns:minmax(0,56fr) minmax(0,44fr)}
.about-text{padding:clamp(56px,8vw,128px) var(--gutter)}
.about h2,.team h2,.supply h2,.dir h2{font-size:clamp(2.5rem,5vw,4.75rem)}
.about p{max-width:60ch;margin-top:1.25em}
.about p:first-of-type{margin-top:1.5em;font-size:clamp(1.3125rem,1.9vw,1.625rem);line-height:1.5}
.about>img{width:100%;height:100%;object-fit:cover}

/* Cosa forniamo */
.supply{background:var(--giallo);padding:clamp(56px,8vw,120px) var(--gutter);display:grid;grid-template-columns:minmax(0,3fr) minmax(0,8fr);gap:2.5rem clamp(2rem,5vw,5rem)}
.supply-head p{font-style:italic;margin-top:.5rem;font-size:1.25rem}
.supply ul{columns:2;column-gap:clamp(2rem,4vw,4rem)}
.supply li{break-inside:avoid;border-top:1px solid var(--nero);font:300 clamp(1.375rem,2.25vw,2.125rem)/1.2 var(--display);padding:.7rem 0 .85rem}

/* Tabellone delle aree */
.dir{position:relative;background:var(--nero);color:var(--bianco);padding:clamp(32px,5vh,64px) var(--gutter);min-height:calc(100vh - var(--head));overflow:hidden}
.dir-bg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .45s ease}
.dir-bg img.on{opacity:.62}
.dir-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.72) 0,rgba(0,0,0,.25) 75%)}
.dir-in{position:relative;z-index:1}
.dir-head p{font-style:italic;margin-top:.5rem;max-width:44ch}
.dir-list{margin-top:clamp(1rem,2.5vh,2rem)}
.dir-row{display:block;text-decoration:none;padding:.08em 0}
.dir-name{font:300 clamp(2rem,min(4.9vw,6.6vh),4.625rem)/1.2 var(--display);display:inline-block;transition:color .15s}
.dir-row.on .dir-name{color:var(--giallo)}
.dir-brands{position:absolute;right:0;bottom:0;width:min(340px,30vw);background:var(--giallo);color:var(--nero);padding:1.25rem 1.5rem 1.4rem;font-style:italic;font-size:1.125rem;line-height:1.5;visibility:hidden}
.dir-row.on .dir-brands{visibility:visible}
.dir-thumb{display:none}

/* Team */
.team{background:var(--pietra);padding:clamp(56px,8vw,120px) var(--gutter)}
.team h2{max-width:17em}
.team-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1rem,2.5vw,2.5rem);margin-top:clamp(2.5rem,5vw,4.5rem)}
.team-grid img{width:100%;height:auto}
.team-grid h3{font-size:clamp(1.5rem,2.3vw,2.125rem);font-weight:400;margin-top:1rem}
.team-grid p{font-style:italic;color:var(--grafite)}

/* Pagine area */
.cover{position:relative;min-height:min(72vh,720px);background:var(--nero);color:var(--bianco);display:flex;flex-direction:column;justify-content:flex-end;padding:var(--gutter);overflow:hidden}
.cover>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cover::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.72) 0,rgba(0,0,0,.1) 75%)}
.cover-in{position:relative;z-index:1}
.cover h1{font-size:clamp(3rem,8vw,7.75rem);line-height:1.03;max-width:11em}
.cover p{font-style:italic;font-size:clamp(1.125rem,1.6vw,1.4375rem);line-height:1.5;max-width:46ch;margin-top:1rem}
.jump{display:flex;flex-wrap:wrap;gap:.25rem 1.5rem;margin-top:1.5rem;max-width:62em}
.jump a{font:400 1.125rem/1.7 var(--display);text-underline-offset:.25em;text-decoration-color:var(--giallo);text-decoration-thickness:2px}

.areas{background:var(--pietra);padding:0 var(--gutter);overflow-x:auto;scrollbar-width:none}
.areas ul{display:flex;gap:.25rem;min-width:max-content}
.areas a{display:block;font:400 1.0625rem/1 var(--display);padding:1rem .9rem;text-decoration:none;white-space:nowrap}
.areas a:hover{background:var(--bianco)}
.areas a[aria-current]{background:var(--giallo)}
.areas:focus-visible{outline-offset:-3px}

.brand{display:grid;grid-template-columns:minmax(0,37fr) minmax(0,63fr);border-top:5px solid var(--bianco)}
.brand-text{padding:clamp(40px,4.5vw,72px) var(--gutter)}
.brand-sticky{position:sticky;top:calc(var(--head) + 40px)}
.brand h2{font-size:clamp(2.5rem,4vw,3.75rem);font-weight:400}
.brand .tag{font-style:italic;color:var(--grafite);margin-top:.5rem;line-height:1.4}
.brand .desc{margin-top:1.25rem;max-width:56ch}
.brand ul{margin-top:1.25rem}
.brand li{font:400 1.0625rem/1.35 var(--display);padding:.3rem 0 .3rem 1.1rem;position:relative}
.brand li::before{content:"";position:absolute;left:0;top:.72em;width:.45rem;height:.45rem;background:var(--giallo);outline:1px solid var(--nero)}
.brand .links{margin-top:1.5rem}
.brand .links a{font:400 1.1875rem/1.4 var(--display);text-underline-offset:.22em;text-decoration-color:var(--giallo);text-decoration-thickness:3px;overflow-wrap:anywhere}
.brand .links a:hover{background:var(--giallo)}
.brand .links span{margin:0 .5rem}
.mosaic{position:relative;overflow:hidden;background:var(--bianco)}
.mosaic img{position:absolute;object-fit:cover}

.next{display:block;background:var(--giallo);color:var(--nero);padding:clamp(40px,6vw,88px) var(--gutter);text-decoration:none}
.next span{display:block;font-style:italic}
.next strong{display:block;font:300 clamp(2.5rem,7vw,6.75rem)/1.05 var(--display)}
.next:hover strong{text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:.12em}

/* Cataloghi e contatti */
.foot{background:var(--nero);color:var(--bianco);padding:clamp(56px,7vw,104px) var(--gutter) 2rem}
.foot-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:3rem clamp(2rem,6vw,6rem)}
.foot h2{font-size:clamp(2.5rem,5vw,4.75rem)}
.foot-lead{margin:1rem 0 1.75rem;max-width:40ch}
.people li{border-top:1px solid #6b6a65;padding:1rem 0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:.25rem 1.5rem}
.people h3{font-size:1.375rem;font-weight:400}
.people .role{font-style:italic;font-size:1rem;line-height:1.5}
.people .reach{grid-column:2;grid-row:1/span 2;align-self:center;font-size:1rem;line-height:1.7}
.people a{text-decoration:none;overflow-wrap:anywhere}
.people a:hover{color:var(--giallo)}
.legal{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:1.5rem;margin-top:clamp(3rem,6vw,5rem);font-size:1rem}
.legal img{height:64px;width:auto}

@media (prefers-reduced-motion:no-preference){
  html{scroll-behavior:smooth}
  .hero>img{animation:emerge 1.8s ease-out both}
  .hero h1{animation:rise 1s .35s cubic-bezier(.2,.7,.2,1) both}
  .hero-foot{animation:rise 1s .6s cubic-bezier(.2,.7,.2,1) both}
  @keyframes emerge{from{opacity:0;transform:scale(1.04)}to{opacity:1;transform:none}}
  @keyframes rise{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
}
@media (prefers-reduced-motion:reduce){
  *{transition:none!important}
}

@media (min-width:1900px){
  .brand{grid-template-columns:minmax(0,1fr) 1180px}
}

@media (max-width:900px){
  :root{--head:64px}
  .logo img{height:40px}
  .menu-btn{display:block}
  .nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--nero);padding:.5rem var(--gutter) 1.25rem}
  .nav.open{display:block}
  .nav ul{flex-direction:column;gap:0}
  .nav a{font-size:1.5rem;padding:.65rem 0}
  .hero>img{object-position:36% 12%}
  .about,.supply,.brand,.foot-grid{grid-template-columns:minmax(0,1fr)}
  .about>img{height:auto;aspect-ratio:4/3;object-position:50% 40%}
  .supply ul{columns:1}
  .dir{min-height:0;padding-left:0;padding-right:0;padding-bottom:0}
  .dir-bg{display:none}
  .dir-head{padding:0 var(--gutter)}
  .dir-row{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:190px;padding:1rem var(--gutter);border-top:3px solid var(--nero);overflow:hidden}
  .dir-thumb{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
  .dir-row::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(0,0,0,.1),rgba(0,0,0,.78))}
  .dir-name{position:relative;z-index:2;font-size:2rem;line-height:1.15}
  .dir-row.on .dir-name{color:inherit}
  .dir-brands,.dir-row.on .dir-brands{position:relative;z-index:2;right:auto;bottom:auto;width:auto;background:none;color:var(--bianco);padding:.25rem 0 0;visibility:visible;font-size:1rem;line-height:1.45}
  .team-grid{grid-template-columns:minmax(0,1fr)}
  .brand-sticky{position:static}
  .cover{min-height:62vh}
}
@media (min-width:601px) and (max-width:900px){
  .team-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:520px){
  .people li{grid-template-columns:minmax(0,1fr)}
  .people .reach{grid-column:1;grid-row:auto}
  .hero-foot .btn{width:100%;text-align:center}
}

/* Pulsanti del piede */
.foot-cta{display:flex;flex-wrap:wrap;gap:.75rem}
.btn-alt{background:transparent;color:var(--bianco);box-shadow:inset 0 0 0 1px var(--bianco)}
.btn-alt:hover{background:var(--bianco);color:var(--nero)}

/* === Versione immersiva con immagini HD === */
.hero{min-height:calc(100svh - var(--head));padding-bottom:0}
.hero::after{z-index:1;background:linear-gradient(180deg,rgba(0,0,0,.05) 25%,rgba(0,0,0,.82) 86%)}
.slides{position:absolute;inset:0;overflow:hidden}
.slide{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:50% 40%;opacity:0;transition:opacity 1.2s ease}
.slide.on{opacity:1}
.slide:first-child{object-position:50% 12%}
.hero-in{z-index:2}
.hero h1{font-size:clamp(3.25rem,7.6vw,7.5rem);line-height:1.02;max-width:11em}
.hero-azioni{display:flex;align-items:center;gap:.75rem}
.hero-stop{background:rgba(0,0,0,.35);border:1px solid var(--bianco);color:var(--bianco);font:400 1rem/1 var(--display);padding:1rem 1.25rem;cursor:pointer}
.hero-stop:hover{background:var(--bianco);color:var(--nero)}
.hero-tabs{position:relative;z-index:2;display:grid;grid-template-columns:repeat(8,minmax(0,1fr));column-gap:clamp(.5rem,1.2vw,1.25rem);margin-top:clamp(1.25rem,2.4vw,2.25rem);border-top:1px solid rgba(255,255,255,.4)}
.hero-tabs a{position:relative;display:block;padding:.85rem 0 1.25rem;font:300 clamp(.9375rem,1.1vw,1.125rem)/1.2 var(--display);color:var(--bianco);text-decoration:none;transition:color .2s}
.hero-tabs a::before{content:"";position:absolute;left:0;right:0;top:-1px;height:3px;background:var(--giallo);transform:scaleX(0);transform-origin:0 50%}
.hero-tabs a.on{color:var(--giallo)}
.hero-tabs a.on::before{transform:scaleX(1);transition:transform var(--giro,6s) linear}
.hero.pausa .hero-tabs a.on::before{transition:none}

/* Elenco con foto che segue il mouse */
.li-thumb{display:none}
.preview{position:fixed;left:0;top:0;z-index:40;width:min(420px,32vw);aspect-ratio:4/3;overflow:hidden;pointer-events:none;opacity:0;transition:opacity .25s;box-shadow:0 34px 60px -24px rgba(0,0,0,.6)}
.preview.vis{opacity:1}
.preview img{width:100%;height:100%;object-fit:cover}
.supply li{transition:padding-left .35s var(--uscita,cubic-bezier(.16,1,.3,1))}
.supply li:hover{padding-left:.75rem}

/* Aree a schermo intero, una sopra l'altra */
.stack{background:var(--nero);color:var(--bianco)}
.stack-head{padding:clamp(56px,7vw,104px) var(--gutter) clamp(32px,4vw,56px)}
.stack-head h2{font-size:clamp(2.5rem,5vw,4.75rem)}
.stack-head p{font-style:italic;margin-top:.5rem;max-width:44ch}
.panel{position:sticky;top:var(--head);height:calc(100svh - var(--head));overflow:hidden;background:var(--nero)}
.panel a{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding:var(--gutter);color:var(--bianco);text-decoration:none}
.panel img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;transform:scale(1.12);transition:transform 1.8s cubic-bezier(.16,1,.3,1)}
.panel.in img{transform:none}
.panel a:hover img{transform:scale(1.04)}
.panel a::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 40%,rgba(0,0,0,.78) 100%)}
.panel-testo{position:relative;z-index:1;opacity:0;transform:translateY(32px);transition:opacity .8s .1s,transform 1s .1s cubic-bezier(.16,1,.3,1)}
.panel.in .panel-testo{opacity:1;transform:none}
.panel h3{font-size:clamp(3.25rem,9vw,9rem);line-height:1;max-width:10em}
.panel p{font-style:italic;font-size:clamp(1.0625rem,1.6vw,1.4375rem);line-height:1.4;margin-top:.75rem;max-width:52ch}
.indice{position:fixed;right:clamp(10px,1.6vw,24px);top:50%;z-index:30;translate:0 -50%;opacity:0;pointer-events:none;transition:opacity .3s}
.indice.vis{opacity:1;pointer-events:auto}
.indice button{display:flex;align-items:center;justify-content:flex-end;gap:.6rem;width:100%;background:none;border:0;color:var(--bianco);font:400 .9375rem/1 var(--display);padding:.45rem 0;cursor:pointer;text-shadow:0 1px 8px rgba(0,0,0,.8)}
.indice span{opacity:0;translate:8px 0;transition:opacity .2s,translate .3s}
.indice button:hover span,.indice button:focus-visible span,.indice button.on span{opacity:1;translate:0 0}
.indice i{display:block;width:26px;height:3px;background:var(--bianco);box-shadow:0 0 6px rgba(0,0,0,.6);transition:width .3s,background .2s}
.indice button.on i{width:44px;background:var(--giallo)}
.indice button.on{color:var(--giallo)}

/* Galleria trascinabile */
.gal{position:relative;z-index:1;background:var(--nero);color:var(--bianco);padding:clamp(64px,8vw,120px) 0}
.gal-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:1.25rem;padding:0 var(--gutter);margin-bottom:clamp(1.75rem,3vw,2.75rem)}
.gal h2{font-size:clamp(2.5rem,5vw,4.75rem)}
.gal-head p{font-style:italic;margin-top:.5rem}
.gal-frecce{display:flex;gap:.5rem}
.gal-frecce button{width:56px;height:56px;display:grid;place-items:center;background:none;border:1px solid var(--bianco);color:var(--bianco);cursor:pointer}
.gal-frecce button:hover{background:var(--giallo);border-color:var(--giallo);color:var(--nero)}
.gal-frecce svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.gal-track{display:flex;gap:clamp(10px,1.2vw,18px);overflow-x:auto;padding:0 var(--gutter) 2.5rem;scrollbar-width:none;cursor:grab;scroll-padding:0 var(--gutter);overscroll-behavior-x:contain}
.gal-track::-webkit-scrollbar{display:none}
.gal-track.trascina{cursor:grabbing;user-select:none}
.gal-track li{flex:none}
.gal-track li:nth-child(even){margin-top:2.5rem}
.gal-track img{height:clamp(300px,58vh,620px);width:auto;max-width:none;-webkit-user-drag:none;cursor:zoom-in;transition:filter .25s}
.gal-track img:hover{filter:brightness(1.08)}
.gal-track figure{margin:0}
.gal-track figcaption{font:300 1.0625rem/1.3 var(--display);margin-top:.6rem}

/* Foto a tutta larghezza e mosaici ingrandibili */
.fullbleed{position:relative;margin:clamp(40px,5vw,72px) 0 0;height:min(92vh,960px);overflow:hidden;background:var(--nero)}
.fullbleed img{position:absolute;left:0;top:-8%;width:100%;height:116%;max-width:none;object-fit:cover;cursor:zoom-in}
.mosaic img{cursor:zoom-in;transition:transform .45s cubic-bezier(.16,1,.3,1),filter .25s;z-index:0}
.mosaic img:hover,.mosaic img:focus-visible{transform:scale(1.035);z-index:2;box-shadow:0 26px 50px -18px rgba(0,0,0,.55)}
.mosaic img:focus-visible{outline:3px solid var(--nero);outline-offset:-3px}

/* Ingrandimento a tutto schermo */
.lb{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:rgba(0,0,0,.96);color:var(--bianco)}
.lb::backdrop{background:#000}
.lb-foto{position:absolute;inset:0;display:grid;place-items:center;padding:clamp(52px,6vw,80px) clamp(8px,6vw,88px)}
.lb-foto img{max-width:100%;max-height:100%;object-fit:contain;box-shadow:0 30px 80px rgba(0,0,0,.6)}
.lb button{position:absolute;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.4);color:var(--bianco);width:52px;height:52px;display:grid;place-items:center;cursor:pointer}
.lb button:hover{background:var(--giallo);border-color:var(--giallo);color:var(--nero)}
.lb svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.lb-chiudi{top:12px;right:12px}
.lb-prec{left:12px;top:50%;translate:0 -50%}
.lb-succ{right:12px;top:50%;translate:0 -50%}
.lb-conta{position:absolute;left:16px;top:24px;font:300 1.0625rem/1 var(--display)}

.cursore{position:fixed;left:0;top:0;z-index:45;padding:.7rem 1.1rem;background:var(--giallo);color:var(--nero);font:400 1rem/1 var(--display);pointer-events:none;opacity:0;transition:opacity .2s}
.cursore.vis{opacity:1}

@media (prefers-reduced-motion:no-preference){
  .slide.on{animation:avvicina 9s linear both}
  @keyframes avvicina{from{transform:scale(1.01)}to{transform:scale(1.09)}}
  @supports (animation-timeline:view()){
    .fullbleed img{animation:deriva linear both;animation-timeline:view();animation-range:cover}
    @keyframes deriva{from{translate:0 -6%}to{translate:0 6%}}
  }
}
@media (prefers-reduced-motion:reduce){
  .panel img,.panel.in img{transform:none}
  .panel-testo{opacity:1;transform:none}
}
@media (hover:none),(max-width:900px){
  .preview,.cursore,.indice{display:none}
}
@media (max-width:900px){
  .hero-tabs{display:none}
  .hero{padding-bottom:var(--gutter)}
  .slide:first-child{object-position:36% 12%}
  .hero-azioni{width:100%}
  .hero-azioni .btn{flex:1;text-align:center}
  .supply li{display:flex;align-items:center;gap:.85rem}
  .li-thumb{display:block;flex:none;width:58px;height:58px;object-fit:cover}
  .gal-track img{height:min(52vh,340px)}
  .gal-track li:nth-child(even){margin-top:1.25rem}
  .fullbleed{height:62vh}
  .gal-frecce{display:none}
}

/* === Coordinato ufficiale Are You Hotel: Pantone 102C, nero, Pantone 425C, Gotham === */
:root{
  --giallo:#F8E326;
  --nero:#000;
  --antracite:#54575A;
  --grafite:#54575A;
  --pietra:#ECECEC;
  --display:Gotham,Montserrat,"Century Gothic",Arial,sans-serif;
  --testo:Gotham,Montserrat,"Century Gothic",Arial,sans-serif;
}
body{font:400 1.0625rem/1.65 var(--testo)}
body *{font-style:normal!important}
h1,h2,h3{font-weight:700;text-transform:uppercase;letter-spacing:.005em;line-height:1.08;text-wrap:balance}
::selection{background:var(--giallo);color:var(--nero)}

.logo img{height:44px}
.nav a{font:500 .9375rem/1 var(--display)}
.menu-btn{font:500 .9375rem/1 var(--display)}
.btn{font:700 .9375rem/1 var(--display);letter-spacing:.03em;text-transform:uppercase}
.hero-stop{font:500 .9375rem/1 var(--display)}

.hero h1{font-size:clamp(2.25rem,5.5vw,5.25rem);max-width:15em}
.hero-foot p{font-size:clamp(1rem,1.25vw,1.1875rem);font-weight:400;line-height:1.5}
.hero-tabs a{font:500 clamp(.8125rem,.95vw,.9375rem)/1.25 var(--display)}

.about h2,.team h2,.supply h2,.dir h2,.foot h2,.stack-head h2,.gal h2{font-size:clamp(2rem,3.7vw,3.5rem)}
.about p:first-of-type{font-size:clamp(1.1875rem,1.55vw,1.4375rem);font-weight:500;line-height:1.45}
.supply-head p,.stack-head p,.gal-head p,.dir-head p{font-weight:400}
.supply li{font:500 clamp(1.0625rem,1.5vw,1.375rem)/1.25 var(--display);padding:.8rem 0 .95rem}
.team h2{max-width:22em}
.team-grid h3{font-size:clamp(1.1875rem,1.7vw,1.5rem)}

.panel h3{font-size:clamp(2.25rem,6vw,5.75rem);line-height:1.04;max-width:13em}
.panel p{font-size:clamp(1rem,1.35vw,1.25rem);font-weight:500;line-height:1.45}
.indice button{font:500 .875rem/1 var(--display)}
.gal-track figcaption{font:500 .9375rem/1.3 var(--display)}
.cursore{font:700 .875rem/1 var(--display);text-transform:uppercase;letter-spacing:.03em}
.next strong{font:700 clamp(2.25rem,5.6vw,5.5rem)/1.05 var(--display);text-transform:uppercase}
.next span{font-weight:500}

.cover h1{font-size:clamp(2.25rem,5.5vw,5.25rem);line-height:1.06;max-width:14em}
.cover p{font-size:clamp(1rem,1.3vw,1.1875rem);font-weight:500;line-height:1.5}
.jump a{font:500 .9375rem/1.8 var(--display)}
.areas a{font:500 .875rem/1 var(--display);padding:1rem .75rem}
.brand h2,.team-grid h3,.people h3{font-weight:700}
.brand h2{font-size:clamp(1.75rem,2.9vw,2.625rem)}
.brand .tag{font-size:1rem;font-weight:500;color:var(--antracite)}
.brand li{font:500 .9375rem/1.4 var(--display)}
.brand .links a{font:700 1rem/1.4 var(--display)}
.foot-lead{font-weight:400}
.people h3{font-size:1.0625rem;letter-spacing:.01em}
.people .role{font-size:.9375rem}
.people .reach{font-size:.9375rem}
.legal{font-size:.9375rem}
.legal img{height:60px}

@media (max-width:1100px) and (min-width:901px){
  .nav ul{gap:.85rem}
  .nav a{font-size:.8125rem}
}
@media (max-width:900px){
  .logo img{height:38px}
  .nav a{font-size:1.25rem;font-weight:500}
  .panel h3{font-size:clamp(2rem,9vw,3.5rem)}
}

/* === Specializzazione hospitality e azioni commerciali === */
.hero-tabs{grid-template-columns:repeat(5,minmax(0,1fr))}
.clienti{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.5rem clamp(.75rem,1.6vw,1.5rem);padding:clamp(1.25rem,2.2vw,2rem) var(--gutter);background:var(--antracite);color:var(--bianco)}
.clienti li{font:700 clamp(.8125rem,1.15vw,1.0625rem)/1.2 var(--display);text-transform:uppercase;letter-spacing:.02em}
.stack-more{position:relative;z-index:1;background:var(--nero);padding:clamp(40px,5vw,72px) var(--gutter) clamp(24px,3vw,40px)}
.stack-more h3{font-size:clamp(1.0625rem,1.4vw,1.25rem);color:var(--giallo)}
.stack-more ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem clamp(1rem,3vw,3rem);margin-top:1rem}
.stack-more a{display:block;padding:.9rem 0 1rem;border-top:1px solid #54575A;text-decoration:none;color:var(--bianco)}
.stack-more strong{display:block;font:500 clamp(1rem,1.3vw,1.1875rem)/1.25 var(--display)}
.stack-more span{display:block;font-size:.875rem;line-height:1.4;margin-top:.25rem;color:#C6C5C5}
.stack-more a:hover strong{color:var(--giallo)}
.azioni{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.4rem}
.azioni .btn{padding:.95rem 1.2rem;font-size:.8125rem}
.azioni .btn:hover{background:var(--nero);color:var(--bianco)}
.azioni .btn-sec{background:var(--bianco);box-shadow:inset 0 0 0 1px var(--nero)}
.brand .links{margin-top:.9rem;font-size:.875rem;color:var(--antracite)}
.brand .links a{font:400 .875rem/1.4 var(--display);text-decoration-color:currentColor;text-decoration-thickness:1px}
.brand .links a:hover{background:none;color:var(--nero)}
@media (max-width:900px){
  .clienti{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stack-more ul{grid-template-columns:minmax(0,1fr)}
  .azioni .btn{flex:1 1 100%;text-align:center}
}

/* Pagine legali */
.pagina-legale{max-width:calc(74ch + 2 * var(--gutter));padding:clamp(48px,7vw,104px) var(--gutter)}
.pagina-legale h1{font-size:clamp(2rem,3.7vw,3.5rem)}
.pagina-legale h2{font-size:1.25rem;margin-top:2.25rem}
.pagina-legale p,.pagina-legale ul{margin-top:.75rem}
.pagina-legale ul{list-style:disc;padding-left:1.25rem}
.pagina-legale li+li{margin-top:.5rem}
.pagina-legale .btn{margin-top:1.75rem}

/* === Pagina contatti, recapiti e social === */
.cover-contatti{min-height:min(64vh,620px)}
.contatti{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(2rem,5vw,5rem);padding:clamp(56px,7vw,104px) var(--gutter)}
.contatti h2,.mappa h2,.testo-legale h1{font-size:clamp(1.75rem,3vw,2.75rem)}
.nota{margin-top:.5rem;font-size:.9375rem;color:var(--antracite)}
.modulo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.25rem 1.5rem;margin-top:1.75rem}
.campo{display:flex;flex-direction:column;gap:.4rem}
.campo.largo,.esito.largo{grid-column:1/-1}
.campo label{font:700 .8125rem/1.3 var(--display);text-transform:uppercase;letter-spacing:.04em}
.campo input,.campo select,.campo textarea{width:100%;font:400 1rem/1.4 var(--testo);color:var(--nero);background:var(--bianco);border:1px solid var(--nero);border-radius:0;padding:.85rem .9rem;min-height:48px}
.campo textarea{resize:vertical;min-height:150px}
.campo input:focus,.campo select:focus,.campo textarea:focus{outline:3px solid var(--giallo);outline-offset:0;border-color:var(--nero)}
.campo [aria-invalid="true"]{border-color:#B3261E;border-width:2px}
.errore{font-size:.875rem;color:#B3261E;min-height:0}
.errore:empty{display:none}
.consenso{flex-direction:row;flex-wrap:wrap;align-items:flex-start;gap:.75rem}
.consenso input{width:24px;height:24px;min-height:0;flex:none;margin-top:.1rem;accent-color:var(--nero)}
.consenso label{flex:1;font:400 .9375rem/1.5 var(--testo);text-transform:none;letter-spacing:0}
.consenso .errore{flex-basis:100%}
.trappola{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.modulo .btn{justify-self:start;border:0;cursor:pointer;padding:1.1rem 1.75rem}
.modulo .btn:hover{background:var(--nero);color:var(--bianco)}
.modulo .btn[disabled]{opacity:.6;cursor:progress}
.esito{font-size:1rem;line-height:1.5}
.esito:empty{display:none}
.esito.ok{background:var(--giallo);padding:1rem 1.2rem}
.esito.ko{border:2px solid #B3261E;padding:1rem 1.2rem}
.contatti-info{background:var(--nero);color:var(--bianco);padding:clamp(1.75rem,3vw,2.75rem);align-self:start;position:sticky;top:calc(var(--head) + 24px)}
.contatti-info dl{margin:0}
.contatti-info dt{font:700 .8125rem/1.3 var(--display);text-transform:uppercase;letter-spacing:.06em;color:var(--giallo);margin-top:1.5rem}
.contatti-info dt:first-child{margin-top:0}
.contatti-info dd{margin:.4rem 0 0;font-size:1.0625rem;line-height:1.5}
.contatti-info .grande{display:inline-flex;align-items:center;min-height:44px;font:700 clamp(1.25rem,2vw,1.75rem)/1.2 var(--display);text-decoration:none;overflow-wrap:anywhere}
.contatti-info a:hover{color:var(--giallo)}

.social{display:flex;flex-wrap:wrap;gap:.5rem}
.social a{display:inline-flex;align-items:center;gap:.5rem;min-height:44px;padding:.55rem .9rem;border:1px solid currentColor;text-decoration:none;font:500 .9375rem/1 var(--display)}
.social a:hover{background:var(--giallo);border-color:var(--giallo);color:var(--nero)}
.social svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8}
.social svg .pieno{fill:currentColor;stroke:none}

.mappa{position:relative;background:var(--pietra)}
.mappa-avviso{padding:clamp(56px,7vw,104px) var(--gutter);display:flex;flex-direction:column;align-items:flex-start;gap:1rem}
.mappa-avviso p{font-size:1.125rem}
.mappa-azioni{display:flex;flex-wrap:wrap;gap:.75rem}
.mappa .btn-alt{background:var(--bianco);color:var(--nero);box-shadow:inset 0 0 0 1px var(--nero);border:0;cursor:pointer}
.mappa .btn-alt:hover{background:var(--nero);color:var(--bianco)}
.mappa-nota{font-size:.875rem!important;color:var(--antracite)}
.mappa iframe{display:block;width:100%;height:min(70vh,560px);border:0}

.recapiti p{margin:0 0 .35rem}
.recapiti p a{text-decoration:none;margin-right:1.25rem}
.recapiti p a:hover{color:var(--giallo)}
.recapiti .social{margin-top:.75rem;justify-content:flex-end}
.legale{margin:1.5rem 0 0;font-size:.875rem}
.legale a{color:#C6C5C5}

.testo-legale{max-width:46rem;padding:calc(var(--head) + clamp(48px,6vw,88px)) var(--gutter) clamp(56px,7vw,104px)}
.testo-legale h2{font-size:1.125rem;margin-top:2rem}
.testo-legale p{margin-top:.6rem;line-height:1.65}
.bozza{background:var(--giallo);padding:.9rem 1.1rem;font-weight:500}

@media (max-width:900px){
  .contatti{grid-template-columns:minmax(0,1fr)}
  .contatti-info{position:static}
  .recapiti .social{justify-content:flex-start}
}
@media (max-width:600px){
  .modulo{grid-template-columns:minmax(0,1fr)}
  .modulo .btn{width:100%;justify-self:stretch}
  .recapiti p a{display:block;margin:0 0 .35rem}
}

/* === Vetrina dei partner e fondo della home === */
.vetrina{background:var(--nero);color:var(--bianco);padding:clamp(56px,7vw,104px) var(--gutter) clamp(48px,6vw,88px)}
.vetrina-testa{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:1.5rem 3rem;margin-bottom:clamp(1.75rem,3vw,2.75rem)}
.vetrina-testa h2{font-size:clamp(2rem,3.7vw,3.5rem)}
.vetrina-testa p{margin-top:.6rem;max-width:52ch;color:#D9D9D9}
.vetrina-filtri{display:flex;flex-wrap:wrap;gap:.5rem}
.vetrina-filtri button{min-height:44px;padding:.6rem 1rem;background:none;border:1px solid #717070;color:var(--bianco);font:500 .875rem/1 var(--display);cursor:pointer;transition:background .2s,border-color .2s,color .2s}
.vetrina-filtri button:hover{border-color:var(--bianco)}
.vetrina-filtri button[aria-pressed="true"]{background:var(--giallo);border-color:var(--giallo);color:var(--nero)}
.vetrina-griglia{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:clamp(170px,18vw,290px);grid-auto-flow:dense;gap:clamp(6px,.8vw,12px)}
.tessera{position:relative;overflow:hidden;background:#1D1D1B}
.tessera.grande{grid-column:span 2;grid-row:span 2}
.tessera.larga{grid-column:span 2}
.tessera.alta{grid-row:span 2}
.tessera[hidden]{display:none}
.tessera a{position:absolute;inset:0;display:block;color:var(--bianco);text-decoration:none}
.tessera img{width:100%;height:100%;max-width:none;object-fit:cover;transition:transform .9s cubic-bezier(.16,1,.3,1),filter .3s}
.tessera a::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 50%,rgba(0,0,0,.72) 100%);transition:opacity .3s}
.tessera-testo{position:absolute;left:0;right:0;bottom:0;z-index:1;padding:clamp(.75rem,1.4vw,1.25rem)}
.tessera-testo strong{display:block;font:700 clamp(.875rem,1.1vw,1.0625rem)/1.2 var(--display);text-transform:uppercase;letter-spacing:.02em}
.tessera-testo span{display:block;font-size:.8125rem;color:#D9D9D9;margin-top:.15rem}
.tessera a:hover img,.tessera a:focus-visible img{transform:scale(1.05)}
.tessera a:hover strong,.tessera a:focus-visible strong{color:var(--giallo)}
.tessera a:focus-visible{outline:3px solid var(--giallo);outline-offset:-3px}
.vetrina-griglia.filtrata .tessera{grid-column:auto;grid-row:auto}
.vetrina-altri{margin-top:clamp(40px,5vw,64px)}
.vetrina-altri h3{font-size:clamp(1.0625rem,1.4vw,1.25rem);color:var(--giallo)}
.vetrina-altri ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem clamp(1rem,3vw,3rem);margin-top:1rem}
.vetrina-altri a{display:block;padding:.9rem 0 1rem;border-top:1px solid #54575A;text-decoration:none;color:var(--bianco)}
.vetrina-altri strong{display:block;font:500 clamp(1rem,1.3vw,1.1875rem)/1.25 var(--display)}
.vetrina-altri span{display:block;font-size:.875rem;line-height:1.4;margin-top:.25rem;color:#C6C5C5}
.vetrina-altri a:hover strong{color:var(--giallo)}

.simboli{display:flex;gap:.5rem}
.simboli a{display:grid;place-items:center;width:48px;height:48px;border:1px solid currentColor;color:inherit;transition:background .2s,border-color .2s,color .2s}
.simboli a:hover{background:var(--giallo);border-color:var(--giallo);color:var(--nero)}
.simboli svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8}
.simboli svg .pieno{fill:currentColor;stroke:none}
.simboli-testa{margin-left:1.25rem;gap:.35rem}
.simboli-testa a{width:40px;height:40px;border-color:rgba(255,255,255,.45)}
.simboli-testa svg{width:19px;height:19px}

.foot-home{padding:clamp(48px,6vw,80px) var(--gutter) 1.75rem}
.foot-home-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:2rem}
.foot-home-in>img{height:64px;width:auto}
.foot-home-dati{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 1.5rem}
.foot-mail{font:700 clamp(1.125rem,1.8vw,1.5rem)/1.2 var(--display);text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
.foot-mail:hover{color:var(--giallo)}
.foot-home-legale{margin-top:clamp(2rem,4vw,3rem);padding-top:1.25rem;border-top:1px solid #54575A;font-size:.875rem;color:#C6C5C5}
.foot-home-legale a{color:inherit}

@media (max-width:1040px){
  .simboli-testa{margin-left:.75rem}
}
@media (max-width:900px){
  .vetrina-griglia{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:clamp(150px,44vw,240px)}
  .tessera.grande{grid-column:span 2;grid-row:span 2}
  .vetrina-filtri{flex-wrap:nowrap;overflow-x:auto;margin:0 calc(-1 * var(--gutter));padding:0 var(--gutter);scrollbar-width:none;width:calc(100% + 2 * var(--gutter))}
  .vetrina-filtri button{flex:none}
  .vetrina-altri ul{grid-template-columns:minmax(0,1fr)}
  .simboli-testa{order:2;margin-left:auto;margin-right:.6rem}
  .simboli-testa a{width:40px;height:40px}
  .top .menu-btn{order:3}
}
@media (max-width:340px){
  .simboli-testa{display:none}
}

.hero-tabs{grid-template-columns:repeat(6,minmax(0,1fr))}
/* domotica tra le aree principali */

/* galleria Amonn nella pagina Arredo camera */
.gal-amonn{margin-top:clamp(56px,7vw,104px)}
