/* V9 — mondi ordinati e leggibili.
   Regola: il corsivo solo nei titoli grandi; tutto ciò che si legge in Manrope, grande e chiaro. */
body[data-world]{font-size:16.5px;line-height:1.6;color:var(--paper)}
body[data-world] .k{font:600 11px/1.3 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--lt);opacity:.85}
.wrap{position:relative;z-index:3;max-width:1060px;margin:0 auto;padding-left:max(22px,6vw);padding-right:max(22px,6vw);box-sizing:border-box}

/* HERO: logo, nome, una frase chiara, due azioni */
.wh p{font:400 clamp(17px,2.2vw,20px)/1.55 var(--sans);opacity:.92;max-width:30em}
.acts{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:4vh}
.btn{display:inline-flex;align-items:center;gap:10px;padding:15px 22px;border-radius:99px;font:600 13px/1 var(--sans);letter-spacing:.06em;
  border:1px solid rgba(232,225,214,.35);color:var(--paper);background:rgba(0,0,0,.25);transition:background .3s,border-color .3s}
.btn:hover{border-color:var(--paper);background:rgba(232,225,214,.08)}
.btn.pri{background:var(--paper);color:#0d0c0b;border-color:var(--paper)}
.btn.pri:hover{background:#fff}

/* titoli di sezione */
.sh{display:grid;gap:12px;margin:0 0 6vh}
.sh h2{font:300 clamp(40px,6.4vw,84px)/1 var(--serif);color:var(--lt);margin:0}
.sh h2 i{font-style:italic}
.sh p{max-width:34em;opacity:.85;margin:0}

/* COSA FACCIO: lista asciutta, si capisce in 5 secondi */
.cosa{padding-top:2vh;padding-bottom:4vh}
.cosa ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;border-top:1px solid rgba(232,225,214,.14)}
@media(min-width:820px){.cosa ul{grid-template-columns:1fr 1fr;column-gap:6vw}}
.cosa li{padding:26px 0;border-bottom:1px solid rgba(232,225,214,.14)}
.cosa h3{font:600 19px/1.3 var(--sans);margin:0 0 6px;color:var(--paper)}
.cosa li p{margin:0;opacity:.82}

/* CARTA DEI LAVORI: come una carta dei drink */
.carta{padding-top:8vh;padding-bottom:10vh}
.voce{border-top:1px solid rgba(232,225,214,.16)}
.voce:last-child{border-bottom:1px solid rgba(232,225,214,.16)}
.vh{all:unset;box-sizing:border-box;cursor:pointer;width:100%;display:grid;grid-template-columns:2.6em 1fr auto;align-items:center;gap:0 14px;padding:24px 0;-webkit-tap-highlight-color:transparent}
.vh .n{font:400 italic 20px/1 var(--serif);color:var(--lt);opacity:.7}
.vh h3{margin:0;font:400 clamp(28px,4.6vw,46px)/1.05 var(--serif);color:var(--paper);transition:color .3s}
.vh .m{grid-column:2;margin-top:8px;font:500 14px/1.4 var(--sans);opacity:.75}
.vh .pl{grid-row:1/span 2;grid-column:3;width:34px;height:34px;border-radius:50%;border:1px solid rgba(232,225,214,.35);position:relative;transition:transform .5s var(--ease-out),background .3s}
.vh .pl::before,.vh .pl::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:1px;background:var(--paper);transform:translate(-50%,-50%)}
.vh .pl::after{transform:translate(-50%,-50%) rotate(90deg)}
.voce.open .vh .pl{transform:rotate(45deg);background:rgba(232,225,214,.1)}
@media(hover:hover){.vh:hover h3{color:var(--lt)}}
.voce.soon .vh{cursor:default}
.voce.soon .vh h3{opacity:.5}
.voce.soon .pl{display:none}
.voce.soon .m::after{content:" · in arrivo";opacity:.8}

/* contenuto che si apre */
.vb{display:grid;grid-template-rows:0fr;transition:grid-template-rows .6s var(--ease-out)}
.voce.open .vb{grid-template-rows:1fr}
.vb>div{overflow:hidden;min-height:0}
.vin{padding:4px 0 34px 0;display:grid;gap:22px}
@media(min-width:820px){.vin{padding-left:calc(2.6em + 14px)}}
.vin p{margin:0;max-width:36em;font-size:17px;opacity:.92}
.vin .tags{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.vin .tags li{font:500 13px/1 var(--sans);padding:9px 13px;border-radius:99px;border:1px solid rgba(232,225,214,.22);opacity:.9}
/* striscia di foto: si scorre col dito */
.strip{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;margin-right:calc(-1*max(22px,6vw));padding-right:max(22px,6vw)}
.strip::-webkit-scrollbar{display:none}
.strip img{flex:0 0 auto;width:min(58vw,250px);aspect-ratio:4/5;object-fit:cover;border-radius:3px;scroll-snap-align:start;background:#000}
/* anteprima del progetto digitale + apri */
.prev{display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:center}
.prev img{width:min(38vw,200px);aspect-ratio:4/5;object-fit:cover;border-radius:3px;box-shadow:0 0 0 1px rgba(232,225,214,.18),0 20px 50px -20px #000}
@media(max-width:560px){.prev{grid-template-columns:1fr}.prev img{width:62vw}}

/* storia breve */
.storia{padding-top:12vh;padding-bottom:12vh}
.storia blockquote{margin:0;font:300 clamp(28px,4.4vw,52px)/1.2 var(--serif);color:var(--paper);max-width:20em}
.storia blockquote i{color:var(--lt)}
.storia p{margin:4vh 0 0;max-width:34em;opacity:.88}

/* contatti: grandi, toccabili */
.contatti{padding-top:12vh;padding-bottom:18vh}
.cl{display:grid;gap:0;border-top:1px solid rgba(232,225,214,.16);margin-top:2vh}
.cl a{display:grid;grid-template-columns:1fr auto;align-items:center;padding:22px 0;border-bottom:1px solid rgba(232,225,214,.16);font:400 clamp(24px,3.6vw,36px)/1.1 var(--serif);color:var(--paper)}
.cl a span{display:block}.cl a small{display:block;margin-top:6px;font:500 14px/1.3 var(--sans);opacity:.7}
.cl a::after{content:"→";font:300 24px/1 var(--sans);opacity:.7;transition:transform .4s var(--ease-out)}
.cl a:hover::after{transform:translateX(6px)}
.altro{display:inline-block;margin-top:8vh;font:600 13px/1 var(--sans);letter-spacing:.06em;border-bottom:1px solid;padding-bottom:6px;color:var(--lt)}
