/* Luca Vitti: foglio di stile unico, costruito sulle regole del brandbook.
   Sfondi: solo i colori primari (Blue Velvet, Riviera Blue, Ecru Wool) e il bianco.
   Testi: Blue Velvet o Ecru Wool, a seconda dello sfondo.
   Ocra (Gold Stars) e azzurro chiaro (Brunnera): solo come elementi di contrasto.
   Caratteri: Playfair Display (titoli, black e bold) e Clear Sans (testo), serviti da /fonts. */

@font-face{font-family:"Playfair Display";src:url(/fonts/playfair-display-latin-900-normal.woff2) format("woff2");font-weight:900;font-style:normal;font-display:swap}
@font-face{font-family:"Playfair Display";src:url(/fonts/playfair-display-latin-700-normal.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Playfair Display";src:url(/fonts/playfair-display-latin-400-italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Clear Sans";src:url(/fonts/clear-sans-latin-300-normal.woff2) format("woff2");font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:"Clear Sans";src:url(/fonts/clear-sans-latin-400-normal.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Clear Sans";src:url(/fonts/clear-sans-latin-700-normal.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Clear Sans";src:url(/fonts/clear-sans-latin-400-italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}

:root{
  --velvet:#02012b;
  --riviera:#3475a2;
  --ecru:#e7e3dd;
  --white:#fff;
  --gold:#ae8742;
  --gold-soft:#c9a566;
  --brunnera:#97c1df;
  --muted:rgba(2,1,43,.8);
  --line:rgba(2,1,43,.16);
  --serif:"Playfair Display",Georgia,"Times New Roman",serif;
  --sans:"Clear Sans","Source Sans 3",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --gutter:clamp(1.25rem,4vw,2.5rem);
  --grain-light:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .5 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --grain-dark:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .45 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--sans);font-size:1.0625rem;line-height:1.65;color:var(--velvet);background:var(--white);-webkit-font-smoothing:antialiased}
@media(min-width:700px){body{font-size:1.125rem}}
img,svg{max-width:100%;height:auto}
h1,h2,h3,h4{font-family:var(--serif);font-weight:700;line-height:1.12;margin:0 0 .6em;color:var(--velvet);text-wrap:balance}
h1{font-weight:700;font-size:clamp(2.4rem,5.8vw,4.3rem);letter-spacing:-.015em}
h2{font-weight:700;font-size:clamp(1.8rem,3.6vw,2.6rem);letter-spacing:-.01em}
h3{font-size:clamp(1.3rem,2.2vw,1.55rem)}
p{margin:0 0 1.1em}
a{color:var(--velvet);text-decoration-color:var(--gold);text-decoration-thickness:2px;text-underline-offset:.22em}
a:hover{text-decoration-color:var(--velvet)}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.skip{position:absolute;left:-999px;top:0;background:var(--gold);color:var(--velvet);padding:.7rem 1rem;z-index:100}
.skip:focus{left:0}

.container{width:min(1120px,100% - 2*var(--gutter));margin-inline:auto}
.narrow{max-width:44rem}
.lead{font-size:clamp(1.15rem,2vw,1.35rem);line-height:1.55;font-weight:300;color:var(--velvet)}
.fineprint{font-size:.95rem;color:var(--muted)}
.opt{font-weight:400;color:var(--muted)}
.more{font-weight:700;color:var(--velvet)}
/* evidenziatura: sottolineatura/evidenziatore in Gold Stars, come nei format social */
.hl{background:var(--gold);color:var(--velvet);padding:0 .22em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.on-blue .hl,.blue .hl{background:var(--brunnera)}

/* ---------- Grana (sfondi materici del brandbook) ---------- */
.hero,.page-head,.section.blue,.cta,.site-footer{position:relative;isolation:isolate}
.hero::before,.page-head::before,.section.blue::before,.cta::before,.site-footer::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:var(--grain-light);opacity:.14;mix-blend-mode:multiply}
.site-footer::before{background-image:var(--grain-dark);mix-blend-mode:screen;opacity:.09}

/* ---------- Testata ---------- */
.site-header{background:var(--white);color:var(--velvet);position:sticky;top:0;z-index:50;border-bottom:1px solid var(--line)}
.nav-wrap{display:flex;align-items:center;justify-content:space-between;min-height:74px;gap:1rem}
.brand{display:block;line-height:0}
.brand img{display:block;height:46px;width:auto}
.nav-list{display:flex;align-items:center;gap:.15rem;list-style:none;margin:0;padding:0}
.nav-list a{display:block;color:var(--velvet);text-decoration:none;padding:.6rem .8rem;font-size:1rem}
.nav-list a:hover,.nav-list a[aria-current="page"]{text-decoration:underline;text-decoration-color:var(--gold);text-decoration-thickness:3px;text-underline-offset:.4em}
.nav-list .btn{margin-left:.5rem;padding:.65em 1.15em;font-size:.98rem;text-decoration:none}
.has-sub{position:relative}
.sub{position:absolute;left:0;top:100%;min-width:18rem;background:var(--white);border:1px solid var(--line);box-shadow:0 10px 28px rgba(2,1,43,.1);list-style:none;margin:0;padding:.5rem 0;display:none}
.has-sub:hover .sub,.has-sub:focus-within .sub{display:block}
.sub a{padding:.65rem 1.1rem}
.nav-toggle{display:none;background:none;border:1px solid rgba(2,1,43,.4);color:var(--velvet);font:inherit;padding:.5rem .9rem;cursor:pointer}
@media(max-width:959px){
  .nav-toggle{display:block}
  .brand img{height:38px}
  .nav-list{flex-direction:column;align-items:stretch;gap:0;padding:.5rem 0 1.25rem;border-top:1px solid var(--line)}
  .nav-wrap{flex-wrap:wrap}
  nav.primary{width:100%;order:3}
  .js nav.primary .nav-list{display:none}
  .js nav.primary .nav-list.open{display:flex}
  .sub{position:static;display:block;background:none;border:0;box-shadow:none;padding:0 0 0 1rem}
  .sub a{padding:.4rem .8rem;font-size:.97rem}
  .nav-list .btn{margin:.75rem 0 0;text-align:center}
}

/* ---------- Pulsanti ---------- */
.btn{display:inline-block;padding:.9em 1.6em;border-radius:2px;font:inherit;font-weight:700;line-height:1.2;text-decoration:none;border:1.5px solid transparent;cursor:pointer;transition:background-color .15s,color .15s,border-color .15s}
.btn-gold{background:var(--gold);color:var(--velvet)}
.btn-gold:hover{background:var(--gold-soft);color:var(--velvet)}
.btn-dark{background:var(--velvet);color:var(--ecru)}
.btn-dark:hover{background:#17165e;color:#fff}
.btn-line{border-color:var(--velvet);color:var(--velvet);background:transparent}
.btn-line:hover{background:var(--velvet);color:var(--ecru)}
.btn-row{display:flex;flex-wrap:wrap;gap:.9rem;margin-top:2rem}

/* ---------- Sezioni ---------- */
.section{padding-block:clamp(3.5rem,8vw,6.5rem)}
.section.paper{background:var(--white)}
.section.ecru{background:var(--ecru)}
.section.blue{background:var(--riviera);color:var(--velvet)}
.section-head{max-width:46rem;margin-bottom:clamp(2rem,4vw,3.25rem)}

/* ---------- Hero ---------- */
.hero{background:var(--ecru);overflow:hidden;padding-block:clamp(2.5rem,6vw,5rem)}
.hero-grid{display:grid;gap:clamp(2rem,5vw,4.5rem);align-items:center;position:relative;z-index:1}
@media(min-width:900px){.hero-grid:has(>.ph){grid-template-columns:1.1fr .9fr}.hero .ph{justify-self:end}}
.hero-copy{max-width:36rem}
.hero h1{margin-bottom:.45em;max-width:14ch}
.hero .lead{max-width:34rem}
.hero-lines{position:absolute;left:auto;right:-12%;bottom:-30%;width:min(1100px,110%);height:auto;z-index:0;pointer-events:none}
.hero-lines path{fill:none;stroke:var(--gold);stroke-width:1.6;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;animation:draw 2.8s cubic-bezier(.5,.1,.2,1) forwards}
.hero-lines path:nth-child(1){opacity:.95}
.hero-lines path:nth-child(2){opacity:.7;animation-delay:.35s}
.hero-lines path:nth-child(3){opacity:.5;animation-delay:.7s}
@keyframes draw{to{stroke-dashoffset:0}}
@media(max-width:899px){.hero-lines{right:-30%;bottom:-8%;width:130%;opacity:.7}}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .hero-lines path{animation:none;stroke-dashoffset:0}
  .btn{transition:none}
}
.hero .ph{width:100%;max-width:34rem;aspect-ratio:4/5;border:0;box-shadow:14px 14px 0 var(--gold)}

/* ---------- Foto ----------
   Le foto stanno in /images. Se un file manca, la foto sparisce e il layout si ricompone.
   Nell'attesa (e nell'anteprima) le cornici mostrano le linee del marchio. */
.ph{position:relative;margin:0;aspect-ratio:4/5;overflow:hidden;border:1px solid rgba(174,135,66,.5);background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 300'%3E%3Cg fill='none' stroke='%23ae8742' stroke-width='1.5' stroke-linecap='round'%3E%3Cpath d='M0 270 C90 270 140 200 250 170 S370 100 400 50' opacity='.6'/%3E%3Cpath d='M0 215 C90 220 160 160 260 150 S375 95 400 50' opacity='.4'/%3E%3Cpath d='M0 160 C100 170 180 130 270 135 S380 90 400 50' opacity='.25'/%3E%3C/g%3E%3C/svg%3E") center/cover no-repeat,linear-gradient(165deg,#f1eee9,#ddd8cf)}
.ph::after{content:attr(data-hint);position:absolute;inset:0;display:grid;place-items:center;padding:1.5rem;text-align:center;font-size:.9rem;color:rgba(2,1,43,.5)}
.ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1}
.ph.land{aspect-ratio:4/3}
.ph.wide{aspect-ratio:3/2}
.ph.shot{aspect-ratio:16/10}
.ph.port{aspect-ratio:4/5}
.ph.band{aspect-ratio:2/1}
@media(max-width:700px){.ph.band{aspect-ratio:16/9}}

/* ---------- Pannelli (percorsi / business) ---------- */
.panels{display:grid;gap:1.25rem}
@media(min-width:800px){.panels{grid-template-columns:1fr 1fr}}
.panel{display:flex;flex-direction:column;align-items:stretch;padding:0}
.panel .ph{width:100%;border:0;border-bottom:3px solid var(--gold)}
.panel-body{display:flex;flex-direction:column;align-items:flex-start;flex:1;padding:clamp(1.5rem,3.5vw,2.5rem)}
.panel h3{font-size:clamp(1.7rem,3vw,2.2rem);font-weight:700}
.panel p{max-width:30rem}
.panel .more{margin-top:auto;padding-top:1rem}
.panel.one{background:var(--ecru);color:var(--velvet)}
.panel.one:not(:has(.ph)){background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 300'%3E%3Cg fill='none' stroke='%23ae8742' stroke-width='1.5' stroke-linecap='round'%3E%3Cpath d='M0 270 C90 270 140 200 250 170 S370 100 400 50' opacity='.7'/%3E%3Cpath d='M0 215 C90 220 160 160 260 150 S375 95 400 50' opacity='.45'/%3E%3Cpath d='M0 160 C100 170 180 130 270 135 S380 90 400 50' opacity='.3'/%3E%3C/g%3E%3C/svg%3E") right 55%/90% auto no-repeat,var(--ecru)}
.panel.two{background:var(--velvet);color:var(--ecru)}
.panel.two h3{color:var(--ecru)}
.panel.two .more{color:var(--ecru);text-decoration-color:var(--gold)}
.panel:not(:has(.ph)) .panel-body{min-height:18rem}

/* ---------- Le tre sfere ---------- */
.trio{display:grid;gap:2.25rem}
@media(min-width:860px){.trio{grid-template-columns:repeat(3,1fr);gap:2.75rem}}
.trio-item .ph{margin-bottom:1.35rem;border:0;border-bottom:3px solid var(--gold)}
.trio-item:not(:has(.ph)){border-top:3px solid var(--gold);padding-top:1.25rem}
.trio-item h3{margin-bottom:.5em}
.trio-item p{color:var(--muted)}
.kicker{margin:-.25rem 0 .5rem;font-size:.82rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--velvet)!important}
.trio-item .kicker{opacity:.75}

/* ---------- Come funziona ---------- */
.steps{list-style:none;margin:0;padding:0;counter-reset:step;display:grid;gap:2rem}
@media(min-width:860px){.steps{grid-template-columns:repeat(3,1fr);gap:2.5rem}}
.steps li{counter-increment:step;position:relative;padding-top:3.4rem}
.steps li::before{content:counter(step);position:absolute;top:0;left:0;font-family:var(--serif);font-weight:900;font-size:3rem;line-height:1;color:var(--velvet);text-decoration:underline;text-decoration-color:var(--gold);text-decoration-thickness:5px;text-underline-offset:.12em}
.steps h3{font-size:1.3rem}
.steps p{color:var(--muted)}
.note{border-left:3px solid var(--gold);padding:.25rem 0 .25rem 1.25rem;max-width:42rem;margin-top:2.5rem}
.modes-title{margin-top:3rem}
.modes{display:grid;gap:1.25rem;margin-top:1.25rem}
@media(min-width:760px){.modes{grid-template-columns:1fr 1fr}}
.mode{background:var(--white);border-top:3px solid var(--gold);padding:1.5rem 1.6rem}
.mode h4{font-family:var(--serif);font-weight:700;font-size:1.25rem;color:var(--velvet);margin:0 0 .5rem}
.mode p{margin:0}

/* ---------- Recensioni ---------- */
.quotes{display:grid;gap:1.5rem}
@media(min-width:760px){.quotes{grid-template-columns:1fr 1fr}}
.quote{margin:0;background:var(--white);border-top:3px solid var(--gold);padding:1.75rem}
.quote blockquote{margin:0 0 1rem;font-family:var(--serif);font-style:italic;font-size:1.18rem;line-height:1.55;color:var(--velvet)}
.quote blockquote p{margin:0}
.quote figcaption{font-weight:700;font-size:.9rem;letter-spacing:.08em;text-transform:uppercase;color:var(--velvet)}

/* ---------- Chi sono e blocchi con foto ---------- */
.about{display:grid;gap:2.5rem;align-items:center}
@media(min-width:860px){
  .about:has(>.ph){grid-template-columns:.8fr 1.2fr;gap:4.5rem}
  .about.rev:has(>.ph){grid-template-columns:1.2fr .8fr}
  .about:not(:has(>.ph)){grid-template-columns:1fr}
}
.about:not(:has(>.ph))>div{max-width:44rem}
.about .ph{max-width:26rem}
.band-photo{margin-top:3rem}
.band-photo:empty{display:none}
.band-photo .ph{width:100%}

/* ---------- Blog ---------- */
.posts{display:grid;gap:1.5rem}
@media(min-width:800px){.posts{grid-template-columns:1fr 1fr}}
.post-card{display:flex;flex-direction:column;gap:.5rem;padding:1.6rem 0 1.4rem;border-top:1px solid var(--line);text-decoration:none;color:var(--velvet)}
.post-card:hover h3{text-decoration:underline;text-decoration-color:var(--gold);text-decoration-thickness:3px}
.post-card h3{margin:.2rem 0 .2rem}
.post-card p{margin:0;color:var(--muted)}
.post-card .ph{width:100%;margin:0 0 .5rem;border:0}
.post-meta{font-size:.92rem;color:var(--velvet);opacity:.75;font-weight:700}
.filters{display:flex;flex-wrap:wrap;gap:.6rem;margin:0 0 2rem}
.chip{font:inherit;font-size:.97rem;padding:.45em 1.1em;border:1px solid var(--line);background:transparent;color:var(--velvet);cursor:pointer;border-radius:2px}
.chip[aria-pressed="true"]{background:var(--velvet);color:var(--ecru);border-color:var(--velvet)}
.post-card[hidden]{display:none}

/* ---------- Invito finale (azzurro) ---------- */
.cta{background:var(--brunnera);color:var(--velvet);text-align:center;overflow:hidden}
.cta .narrow{margin-inline:auto}
.cta h2{color:var(--velvet)}
.cta .lead{color:var(--velvet);font-weight:400}
.cta .btn-row{justify-content:center}
.bg-photo{position:absolute;inset:0;margin:0;z-index:-1}
.bg-photo img{display:block;width:100%;height:100%;object-fit:cover}
.bg-photo::after{content:"";position:absolute;inset:0;background:rgba(151,193,223,.7)}
.cta .container{position:relative;z-index:1}

/* ---------- Pagine interne ---------- */
.page-head{background:var(--ecru);padding-block:clamp(2.75rem,7vw,5.5rem)}
.page-head h1{max-width:18ch;margin-bottom:.4em}
.page-head .lead{max-width:40rem;margin:0}
.crumbs{font-size:.93rem;margin-bottom:1.5rem;color:var(--muted)}
.crumbs a{color:var(--velvet)}
.crumbs span[aria-hidden]{margin-inline:.45rem}
.head-grid{display:grid;gap:2rem;align-items:center}
@media(min-width:900px){.head-grid:has(>.ph){grid-template-columns:1.15fr .85fr;gap:4rem}}
.page-head .ph{width:100%;max-width:30rem;justify-self:end;border:0;box-shadow:10px 10px 0 var(--gold)}
.prose{max-width:42rem}
.prose h2{margin-top:2.2em;font-size:clamp(1.55rem,3vw,2.1rem)}
.prose h2:first-child{margin-top:0}
.prose h3{margin-top:1.8em}
.prose ul{padding:0;list-style:none;margin:0 0 1.4em}
.prose ul li{position:relative;padding-left:1.4rem;margin-bottom:.6em}
.prose ul li::before{content:"";position:absolute;left:0;top:.72em;width:.5rem;height:3px;background:var(--gold)}
.prose ol{padding-left:1.3rem}
.prose ol li{margin-bottom:.6em}
.prose blockquote{margin:2rem 0;padding:.2rem 0 .2rem 1.4rem;border-left:3px solid var(--gold);font-family:var(--serif);font-style:italic;font-size:1.35rem;line-height:1.4}
.prose .ph{width:100%;margin:1.75rem 0 2.25rem}
.two-col{display:grid;gap:3rem}
@media(min-width:900px){.two-col{grid-template-columns:1fr 20rem;gap:5rem;align-items:start}.two-col aside{position:sticky;top:6.5rem}}
aside .ph{width:100%}
.aside-box{background:var(--ecru);padding:1.75rem}
.aside-box+.ph{margin-top:1.25rem}
.aside-box h2,.aside-box h3{font-size:1.35rem;margin-bottom:.5em}
.aside-box p{font-size:1rem}
.aside-box .btn{width:100%;text-align:center;margin-top:.4rem}
.ecru .aside-box{background:var(--white)}

/* FAQ */
.faq details{border-top:1px solid var(--line);padding:1.1rem 0}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;font-family:var(--serif);font-size:1.25rem;font-weight:700;color:var(--velvet);list-style:none;display:flex;justify-content:space-between;gap:1rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--sans);font-size:1.6rem;line-height:1;color:var(--velvet);flex:none}
.faq details[open] summary::after{content:"\2212"}
.faq details p{margin:.8rem 0 0;color:var(--muted);max-width:40rem}

/* Articolo */
.article-meta{color:var(--muted);font-size:.98rem;margin-top:1.25rem}
.article-end{margin-top:3.5rem;padding:2rem;background:var(--ecru)}
.article-end h2{font-size:1.5rem}
.article-cover{max-width:56rem;margin:0 0 2.5rem}
.article-cover:empty{display:none}
.article-cover .ph{width:100%}

/* Modulo */
.form{display:grid;gap:1.25rem;max-width:36rem}
.form label{display:block;font-weight:700;margin-bottom:.35rem}
.form input,.form select,.form textarea{width:100%;font:inherit;color:var(--velvet);background:#fff;border:1px solid rgba(2,1,43,.4);border-radius:2px;padding:.75rem .9rem}
.form textarea{min-height:9rem;resize:vertical}
.form input:focus,.form select:focus,.form textarea:focus{outline:3px solid var(--gold);outline-offset:1px;border-color:var(--velvet)}
.form .check{display:flex;gap:.7rem;align-items:flex-start;font-size:.97rem}
.form .check input{width:auto;margin-top:.3rem}
.form .check label{font-weight:400;margin:0}
.hp{position:absolute;left:-9999px}

/* ---------- Piè di pagina (Blue Velvet) ---------- */
.site-footer{background:var(--velvet);color:var(--ecru);padding-block:clamp(3rem,6vw,4.5rem) 2rem;font-size:1rem}
.site-footer p,.site-footer li{color:var(--ecru)}
.site-footer a{color:var(--ecru);text-decoration:none}
.site-footer a:hover{text-decoration:underline;text-decoration-color:var(--gold);text-decoration-thickness:2px;text-underline-offset:.25em}
.foot-grid{display:grid;gap:2.25rem}
@media(min-width:800px){.foot-grid{grid-template-columns:1.4fr 1fr 1fr 1.2fr}}
.foot-logo{display:block;height:50px;width:auto;margin-bottom:.9rem}
.site-footer h2{font-family:var(--sans);font-size:1rem;font-weight:700;color:var(--ecru);margin-bottom:.8em;letter-spacing:.02em}
.site-footer ul{list-style:none;margin:0;padding:0}
.site-footer li{margin-bottom:.4rem}
.legal{margin-top:2.75rem;padding-top:1.5rem;border-top:1px solid rgba(231,227,221,.25);font-size:.9rem}
.legal p{margin:0 0 .4em;color:rgba(231,227,221,.85)}
.legal a{text-decoration:underline;text-decoration-color:var(--gold)}

/* ---------- Video del viaggio ---------- */
.journey{display:grid;gap:2.5rem;align-items:center}
@media(min-width:900px){.journey{grid-template-columns:.8fr 1.2fr;gap:4.5rem}}
.ph.vid{width:100%;max-width:26rem;aspect-ratio:4/5;border:0;box-shadow:12px 12px 0 var(--gold);background:var(--ecru);justify-self:start}
.ph.vid::after{content:none}
.ph.vid video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:40% 30%;z-index:1;display:block}
.vid-toggle{position:absolute;right:.75rem;bottom:.75rem;z-index:2;font:inherit;font-size:.85rem;font-weight:700;color:var(--velvet);background:var(--ecru);border:0;border-radius:2px;padding:.35em .8em;cursor:pointer;opacity:.92}
.vid-toggle:hover{background:#fff}
.steps.col{grid-template-columns:1fr;gap:1.5rem}
.steps.col li{padding:0 0 0 3.6rem;min-height:3rem}
.steps.col li::before{font-size:2.4rem}
.steps.col h3{margin-bottom:.25em}
.journey-copy .lead{margin-bottom:2rem}

/* foto verticale dentro il testo (business) */
.prose .ph.port{max-width:26rem;margin-inline:0}

.ph-empty::after{content:none}


/* =====================================================================
   Stile morbido (ispirato a saranoseda.com): onde tra le sezioni,
   foto a tutta larghezza in apertura, immagini tonde, angoli arrotondati.
   Colori e caratteri restano quelli del brandbook.
   ===================================================================== */
:root{
  --wave:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 100' preserveAspectRatio='none'%3E%3Cpath d='M0 62 C180 8 360 8 560 46 S980 96 1200 28 V100 H0Z'/%3E%3C/svg%3E");
  --wave2:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 100' preserveAspectRatio='none'%3E%3Cpath d='M0 30 C220 96 520 94 700 48 S1060 6 1200 56 V100 H0Z'/%3E%3C/svg%3E");
  --radius:18px;
}
.section,.site-footer{
  --w:clamp(28px,5vw,72px);
  margin-top:calc(var(--w) * -1);
  -webkit-mask:var(--wave) top/100% var(--w) no-repeat,linear-gradient(#000,#000) 0 var(--w)/100% calc(100% - var(--w) + 1px) no-repeat;
          mask:var(--wave) top/100% var(--w) no-repeat,linear-gradient(#000,#000) 0 var(--w)/100% calc(100% - var(--w) + 1px) no-repeat;
}
.section:nth-of-type(even),.site-footer{
  -webkit-mask-image:var(--wave2),linear-gradient(#000,#000);
          mask-image:var(--wave2),linear-gradient(#000,#000);
}
.section{padding-top:calc(clamp(3.5rem,8vw,6.5rem) + var(--w))}
.site-footer{padding-top:calc(clamp(3rem,6vw,4.5rem) + var(--w))}
.page-head{padding-bottom:calc(clamp(2.75rem,7vw,5.5rem) + clamp(28px,5vw,72px))}
.hero{padding-bottom:calc(clamp(2.5rem,6vw,5rem) + clamp(28px,5vw,72px))}
main>:first-child.section{margin-top:0;-webkit-mask:none;mask:none;padding-top:clamp(3.5rem,8vw,6.5rem)}

/* Apertura a tutta larghezza: foto a destra che sfuma nel fondo, titolo a sinistra */
.hero{min-height:clamp(30rem,62vh,40rem);display:flex;align-items:center}
.hero-grid{position:static;z-index:auto;width:min(1120px,100% - 2*var(--gutter))}
.hero-grid:has(>.ph){grid-template-columns:1fr}
.hero-copy{position:relative;z-index:2}
.hero-lines{display:none}
.hero .ph{position:absolute;z-index:1;top:0;right:0;bottom:0;width:min(62%,900px);max-width:none;aspect-ratio:auto;border:0;border-radius:0;box-shadow:none;
  -webkit-mask-image:linear-gradient(to right,transparent 0,#000 42%);mask-image:linear-gradient(to right,transparent 0,#000 42%)}
.hero .ph img{object-position:50% 12%}
@media(max-width:899px){
  .hero{display:block;min-height:0}
  .hero-grid:has(>.ph){display:grid}
  .hero .ph{position:relative;width:100%;aspect-ratio:4/3;order:-1;border-radius:var(--radius);-webkit-mask-image:none;mask-image:none;margin-bottom:1.5rem}
  .hero .ph img{object-position:50% 12%}
}

/* Forme morbide */
.ph{border-radius:var(--radius)}
.ph.band{border-radius:calc(var(--radius) + 6px)}
.page-head .ph,.ph.vid{border:0;box-shadow:0 22px 48px rgba(2,1,43,.18)}
.ph.vid{border-radius:calc(var(--radius) + 6px)}
.panel{border-radius:calc(var(--radius) + 4px);overflow:hidden}
.panel .ph{border-radius:0;border-bottom:0}
.mode,.quote,.aside-box,.article-end{border-radius:var(--radius)}
.mode,.quote{border-top:0;box-shadow:0 10px 30px rgba(2,1,43,.08)}
.btn{border-radius:6px}
.chip{border-radius:999px}
.form input,.form select,.form textarea{border-radius:8px}

/* Le tre sfere: immagini tonde, titolo, filo punteggiato */
.trio-item{text-align:center}
.trio-item .ph{width:min(15rem,74%);aspect-ratio:1;border:0;border-radius:50%;margin:0 auto 1.5rem;box-shadow:0 14px 34px rgba(2,1,43,.16)}
.trio-item h3::after{content:"";display:block;width:min(14rem,70%);margin:.85rem auto 1rem;border-bottom:2px dotted rgba(2,1,43,.28)}
.trio-item .kicker{margin-top:0}

/* Banda scura con ritratto grande (Chi sono, home) */
.section.dark{background:var(--velvet);color:var(--ecru)}
.section.dark h2,.section.dark h3,.section.dark .lead,.section.dark p{color:var(--ecru)}
.section.dark .more{color:var(--ecru);text-decoration-color:var(--gold)}
.section.dark .ph{border:0;border-radius:calc(var(--radius) + 10px);max-width:30rem;box-shadow:0 24px 54px rgba(0,0,0,.35)}
@media(min-width:860px){.section.dark .about:has(>.ph){grid-template-columns:.85fr 1.15fr}}

/* Testata delle pagine interne con la foto come sfondo (la home ha la sua apertura) */
.page-head.has-photo{min-height:clamp(19rem,42vh,26rem);display:flex;align-items:center}
.page-head.has-photo .container{position:relative;z-index:1}
.page-head.has-photo>.ph{position:absolute;z-index:0;top:0;right:0;bottom:0;width:min(62%,900px);max-width:none;aspect-ratio:auto;border:0;border-radius:0;box-shadow:none;justify-self:auto;
  -webkit-mask-image:linear-gradient(to right,transparent 0,#000 42%);mask-image:linear-gradient(to right,transparent 0,#000 42%)}
.page-head.has-photo>.ph img{object-position:var(--focus,50% 40%)}
@media(max-width:899px){
  .page-head.has-photo>.ph{width:100%;opacity:.2;-webkit-mask-image:none;mask-image:none}
}

/* Chi sono: elenchi di frasi brevi, una per riga */
.prose p.stack{line-height:1.75;margin-block:1.1em;padding-left:1rem;border-left:2px solid var(--gold)}

/* Fascia "Parliamone": stesso impianto della hero (fondo chiaro a sinistra, foto a destra che sfuma) */
.section,.site-footer{
  -webkit-mask-size:100% var(--w),100% calc(100% - var(--w) + 2px);
          mask-size:100% var(--w),100% calc(100% - var(--w) + 2px);
  -webkit-mask-position:top,0 calc(var(--w) - 1px);
          mask-position:top,0 calc(var(--w) - 1px);
}
.cta{background:color-mix(in srgb,var(--brunnera) 42%,#fff);text-align:left;min-height:clamp(22rem,44vh,28rem);display:flex;align-items:center}
.cta .container{width:min(1120px,100% - 2*var(--gutter))}
.cta .narrow{margin-inline:0;max-width:34rem}
.cta .btn-row{justify-content:flex-start}
.cta .bg-photo{inset:0 0 0 auto;width:min(62%,900px);z-index:0;
  -webkit-mask-image:linear-gradient(to right,transparent 0,#000 42%);mask-image:linear-gradient(to right,transparent 0,#000 42%)}
.cta .bg-photo::after{background:rgba(151,193,223,.22)}
.cta .btn-line{background:var(--riviera);border-color:var(--riviera);color:#fff}
.cta .btn-line:hover,.cta .btn-line:focus-visible{background:var(--gold);border-color:var(--gold);color:var(--velvet)}
@media(max-width:899px){
  .cta{display:block}
  .cta .bg-photo{inset:0;width:100%;opacity:.3;-webkit-mask-image:none;mask-image:none}
}

/* "Cosa dicono": stesso impianto della hero e della fascia Parliamone */
.section.blue.cosa{background:color-mix(in srgb,var(--brunnera) 42%,#fff);overflow:hidden}
.cosa .container{position:relative;z-index:1;width:min(1120px,100% - 2*var(--gutter))}
.cosa .section-head{margin-bottom:1.75rem}
.cosa .quotes{grid-template-columns:1fr;max-width:36rem}
.cosa .bg-photo{position:absolute;inset:0 0 0 auto;width:min(62%,900px);margin:0;z-index:0;
  -webkit-mask-image:linear-gradient(to right,transparent 0,#000 34%);mask-image:linear-gradient(to right,transparent 0,#000 34%)}
.cosa .bg-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 30%}
.cosa .bg-photo::after{content:none}
@media(max-width:899px){
  .cosa .bg-photo{inset:0;width:100%;opacity:.22;-webkit-mask-image:none;mask-image:none}
}

/* Testate con un ritratto: più foto visibile, il viso non viene tagliato */
.page-head.has-photo.is-portrait{min-height:clamp(24rem,56vh,34rem)}
.page-head.has-photo.is-portrait>.ph{width:min(50%,680px);-webkit-mask-image:linear-gradient(to right,transparent 0,#000 38%);mask-image:linear-gradient(to right,transparent 0,#000 38%)}
@media(max-width:899px){.page-head.has-photo.is-portrait>.ph{width:100%}}

/* Fascia "Parliamone": titolo su una riga, più aria */
.cta .narrow{max-width:44rem}
@media(min-width:600px){.cta h2{white-space:nowrap}}

/* Footer: più spazio tra logo e descrizione */
.foot-logo{margin-bottom:1.6rem}
.cta .lead{max-width:34rem}

/* Home: modulo di contatto, con la foto come sfondo (stesso impianto delle altre fasce) */
.section.contact{background:var(--ecru);overflow:hidden;position:relative;isolation:isolate}
.contact .container{position:relative;z-index:1;width:min(1120px,100% - 2*var(--gutter))}
.contact-copy{max-width:36rem}
.contact .lead{margin-bottom:1.75rem}
.contact .form{max-width:none}
.contact .bg-photo{position:absolute;inset:0 0 0 auto;width:min(66%,960px);margin:0;z-index:0;
  -webkit-mask-image:linear-gradient(to right,transparent 0,#000 40%);mask-image:linear-gradient(to right,transparent 0,#000 40%)}
.contact .bg-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:62% 50%}
.contact .bg-photo::after{content:none}
@media(max-width:899px){.contact .bg-photo{inset:0;width:100%;opacity:.16;-webkit-mask-image:none;mask-image:none}}

/* Recensioni: carosello con cinque stelle, sezione più compatta */
.section.cosa{padding-top:calc(clamp(1.75rem,3.5vw,2.75rem) + var(--w));padding-bottom:calc(var(--w) + clamp(1.25rem,2.5vw,2rem))}
.cosa .section-head{margin-bottom:1rem}
.cosa .section-head .lead{margin-bottom:0}
.carousel{max-width:38rem}
.car-track{display:flex;gap:1rem;scroll-padding-left:.25rem;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;position:relative;padding:.25rem .25rem 1.1rem;margin:-.25rem -.25rem 0}
.car-track::-webkit-scrollbar{display:none}
.car-track .quote{flex:0 0 88%;scroll-snap-align:start;padding:1.25rem 1.5rem}
.car-track .quote blockquote{font-size:1.08rem;line-height:1.5;margin-bottom:.8rem}
.stars{color:var(--gold);font-size:1.15rem;letter-spacing:.2em;line-height:1;margin-bottom:.7rem}
.car-controls{display:flex;align-items:center;gap:.9rem}
.car-controls button{width:2.5rem;height:2.5rem;border-radius:50%;border:1.5px solid var(--velvet);background:transparent;color:var(--velvet);font:inherit;font-size:1.1rem;line-height:1;cursor:pointer;transition:background-color .15s,color .15s,border-color .15s}
.car-controls button:hover:not(:disabled){background:var(--gold);border-color:var(--gold)}
.car-controls button:disabled{opacity:.35;cursor:default}
.car-controls button:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.car-dots{display:flex;gap:.5rem}
.car-dots span{width:.6rem;height:.6rem;border-radius:50%;background:rgba(2,1,43,.25)}
.car-dots span.on{background:var(--velvet)}
@media(prefers-reduced-motion:reduce){.car-track{scroll-behavior:auto}}
.car-track{-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 3rem),transparent);mask-image:linear-gradient(to right,#000 calc(100% - 3rem),transparent)}

/* "Scrivimi": spaziature ridotte */
.section.contact{padding-top:calc(clamp(1.75rem,3.5vw,2.75rem) + var(--w));padding-bottom:calc(var(--w) + clamp(1rem,2vw,1.5rem))}
.contact h2{margin-bottom:.5rem}
.contact .lead{margin-bottom:1.1rem}
.contact .form{gap:.8rem}
.contact .form label{margin-bottom:.2rem}
.contact .form input,.contact .form select,.contact .form textarea{padding:.55rem .8rem}
.contact .form textarea{min-height:5.5rem}
.contact .form .check{font-size:.92rem}

/* =====================================================================
   Pagine dei percorsi: struttura a sezioni (intro con foto, cosa trovi,
   fa per te se, che cos'è, come si struttura, recensioni, costo)
   ===================================================================== */
.center{text-align:center}
.gold-list{list-style:none;margin:0 0 1.5rem;padding:0}
.gold-list li{position:relative;padding:.55rem 0 .55rem 2rem;border-bottom:1px solid var(--line)}
.gold-list li:last-child{border-bottom:0}
.gold-list li::before{content:"";position:absolute;left:0;top:.95rem;width:1.05rem;height:1.05rem;border-radius:50%;background:radial-gradient(circle at 34% 34%,#fff 0 12%,var(--gold-soft) 13% 45%,var(--gold) 46%)}
.gold-list.fit{display:grid;gap:0 3rem;max-width:56rem;margin:1.75rem auto 0}
@media(min-width:760px){.gold-list.fit{grid-template-columns:1fr 1fr}}
.gold-list.fit li{border-bottom:0;padding-right:.25rem}
.svc-label{font-weight:700;margin:1.6rem 0 .4rem}
.svc-muted{color:var(--muted);max-width:40rem}
.svc-intro,.svc-split{display:grid;gap:2rem;align-items:center}
.svc-intro{align-items:start}
.svc-intro .ph{border-radius:var(--radius)}
.svc-text p{max-width:40rem}
.svc-text h2{font-size:clamp(1.5rem,2.4vw,1.9rem);margin:1.75rem 0 .75rem}
.svc-text h2:first-child{margin-top:0}
.svc-split .ph{max-width:26rem;justify-self:center;width:100%}
@media(min-width:900px){
  .svc-intro{grid-template-columns:.95fr 1.05fr;gap:4rem}
  .svc-split{grid-template-columns:1.1fr .9fr;gap:4.5rem}
  .svc-split.rev{grid-template-columns:.9fr 1.1fr}
  .svc-split.rev .ph{order:-1;justify-self:start}
  .svc-split:not(.rev) .ph{justify-self:end}
}
.tiles{display:grid;gap:1.25rem;margin-top:2.25rem}
@media(min-width:760px){.tiles{grid-template-columns:repeat(3,1fr);gap:1.5rem}}
.tile{background:var(--white);border-radius:var(--radius);padding:1.75rem 1.5rem;text-align:center;box-shadow:0 10px 30px rgba(2,1,43,.07)}
.tile-icon{display:grid;place-items:center;width:3.6rem;height:3.6rem;margin:0 auto 1rem;border-radius:50%;background:color-mix(in srgb,var(--brunnera) 45%,#fff);color:var(--velvet)}
.tile h3{font-size:1.2rem;margin:0 0 .4rem}
.tile p{margin:0;color:var(--muted)}
.svc-extra{margin-top:2.5rem;padding-top:2rem;border-top:1px solid var(--line)}
.svc-extra .prose{max-width:46rem;margin-inline:auto;text-align:center}
.svc-extra .prose h2{margin-bottom:.6rem}
.price{text-align:center;max-width:42rem}
.price p{margin-inline:auto}
.price .svc-muted{margin-bottom:1.5rem}

/* Business coaching */
.center-lead{max-width:46rem;margin:.75rem auto 0;text-align:center;font-size:1.08rem}
.themes{display:grid;gap:1.25rem;margin-top:2rem}
@media(min-width:760px){.themes{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1040px){.themes{grid-template-columns:repeat(3,1fr)}}
.theme{background:var(--ecru);border-radius:var(--radius);padding:1.5rem 1.5rem .75rem}
.theme h3{font-size:1.2rem;margin:0 0 .6rem}
.theme .gold-list li{font-size:.98rem;padding-top:.45rem;padding-bottom:.45rem}
.theme .gold-list li::before{top:.8rem}
.tile.left{text-align:left}
.tile.left h3{margin-bottom:.5rem}
@media(min-width:1040px){.tiles.four{grid-template-columns:repeat(4,1fr)}}
.pull{font-family:var(--serif);font-style:italic;font-size:clamp(1.35rem,2.6vw,1.9rem);text-align:center;margin:2rem auto 1rem;max-width:40rem;line-height:1.35;color:var(--velvet)}
.steps.four{grid-template-columns:1fr}
@media(min-width:760px){.steps.four{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1040px){.steps.four{grid-template-columns:repeat(4,1fr)}}
.themes{display:flex;flex-wrap:wrap;justify-content:center}
.theme{flex:1 1 100%}
@media(min-width:760px){.theme{flex:0 1 calc(50% - .625rem)}}
@media(min-width:1040px){.theme{flex:0 1 calc(33.333% - .85rem)}}
.svc-text.exp{max-width:46rem;margin-inline:auto}
.svc-text.exp p{max-width:none}

/* ---- Business coaching: elementi grafici al posto dei bullet ---- */
.theme{padding:1.6rem 1.5rem 1rem}
.theme-icon{display:grid;place-items:center;width:3rem;height:3rem;margin:0 0 .9rem;border-radius:50%;background:#fff;color:var(--velvet);box-shadow:0 2px 10px rgba(13,13,56,.07)}
.theme h3{margin-bottom:.7rem}
.plain-list{list-style:none;margin:0;padding:0}
.plain-list li{padding:.6rem 0;border-top:1px solid color-mix(in srgb,var(--gold) 35%,transparent);font-size:.98rem;line-height:1.55}
.num-list{list-style:none;counter-reset:n;margin:0 0 1.5rem;padding:0}
.num-list li{counter-increment:n;display:grid;grid-template-columns:2.2rem 1fr;gap:.25rem;align-items:baseline;padding:.65rem 0;border-bottom:1px solid var(--line)}
.num-list li:last-child{border-bottom:0}
.num-list li::before{content:counter(n);font-family:"Playfair Display",serif;font-weight:900;font-size:1.5rem;line-height:1;color:var(--gold)}
.thoughts{list-style:none;margin:2rem auto 0;padding:0;display:grid;gap:1rem;max-width:62rem}
@media(min-width:640px){.thoughts{grid-template-columns:repeat(2,1fr)}}
@media(min-width:980px){.thoughts{grid-template-columns:repeat(3,1fr)}}
.thoughts li{position:relative;background:#fff;border-radius:var(--radius);padding:1.5rem 1.4rem 1.3rem;box-shadow:0 6px 22px rgba(13,13,56,.06);font-family:"Playfair Display",serif;font-size:1.12rem;line-height:1.4;color:var(--velvet)}
.thoughts li::before{content:"“";display:block;font-size:2.6rem;line-height:.7;color:var(--gold);margin-bottom:.35rem}
.page-head.has-photo.is-portrait:has(img[src*="luca-ritratto"]){min-height:clamp(30rem,76vh,43rem)}

/* Homepage mobile: foto a tutta larghezza in apertura, sfumata nel fondo */
@media(max-width:899px){
  .hero{padding-top:0}
  .hero .ph{width:100vw;max-width:none;margin-inline:calc(50% - 50vw);margin-bottom:-2.5rem;aspect-ratio:1/1;border-radius:0;
    -webkit-mask-image:linear-gradient(to bottom,#000 62%,transparent 100%);mask-image:linear-gradient(to bottom,#000 62%,transparent 100%)}
  .hero .ph img{object-position:50% 14%}
}
@media(min-width:600px) and (max-width:899px){.hero .ph{aspect-ratio:16/10}.hero .ph img{object-position:50% 16%}}

/* Chi sono: foto dentro il testo, a destra su desktop */
.prose .ph.prose-fig{float:right;width:min(44%,19rem);margin:.4rem 0 1.25rem 2rem;aspect-ratio:4/5}
.prose h2{clear:both}
@media(max-width:699px){.prose .ph.prose-fig{float:none;width:100%;max-width:22rem;margin:1.5rem auto}}
.section.contact .contact-copy h2{margin-bottom:1.4rem}

/* Ancora "Contatti" nel menu: atterra sul modulo, non sotto l'intestazione */
#scrivimi{scroll-margin-top:3.5rem}
@media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}

/* Instagram: rimandi */
.ig-line{margin:1.25rem 0 0;font-size:.95rem}
.ig-center{text-align:center;margin-top:2.5rem}
.ig-link{display:inline-flex;align-items:center;gap:.4em;font-weight:600;text-decoration:none;border-bottom:1px solid currentColor}
.ig-link .ig-ico{flex:none;margin-top:-1px}
.article-end .ig-line{margin-top:1.1rem}
.site-footer .ig-link{border-bottom:0}

/* SEO: sottotitolo dentro H1 e riga sopra il titolo della home */
.h1-sub{display:block;margin-top:.7rem;font-family:var(--sans);font-size:clamp(.82rem,1.3vw,.98rem);font-weight:700;letter-spacing:.09em;text-transform:uppercase;line-height:1.35;color:var(--velvet);opacity:.78;max-width:34ch}
.eyebrow{margin:0 0 .9rem;font-size:.82rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--velvet);opacity:.78}
@media(min-width:900px){.posts.three{grid-template-columns:repeat(3,1fr);gap:2rem}}

.form-error{margin:0;color:#8a1c1c;font-weight:700}

/* Percorsi: foto di sfondo in "Cosa trovi in questo percorso" e testo senza immagine in "Che cos'è" */
.section.tiles-bg{position:relative;isolation:isolate;overflow:hidden}
.tiles-bg .bg-photo{position:absolute;inset:0;margin:0;z-index:-1}
.tiles-bg .bg-photo img{display:block;width:100%;height:100%;object-fit:cover}
.tiles-bg .bg-photo::after{content:"";position:absolute;inset:0;background:rgba(231,227,221,.7)}
.tiles-bg .container{position:relative;z-index:1}
.svc-split.solo{display:block;max-width:44rem}