/* DigitaSito · gli otto siti d'esempio dell'apertura, uno per attività (HTML in siti_esempio.py).
   Disegnati come se fossero larghi 1280: 1em = 16px a quella larghezza, e tutto si rimpicciolisce col contenitore. */

/* ---------------------------------------------------------------- comune */
.sx{position:absolute;inset:0 0 auto 0;font-size:1.25cqw;line-height:1.5;font-family:Inter,sans-serif;text-align:left;-webkit-font-smoothing:antialiased;
  overflow:hidden;animation:sxScorri 9s cubic-bezier(.45,0,.25,1) both}
/* una volta per attività: ferma sull'apertura, poi giù fino in fondo (il JS misura quanto e la fa ripartire al cambio) */
@keyframes sxScorri{0%,30%{transform:translateY(0)}85%,100%{transform:translateY(calc(var(--giu,0px) * -1))}}
:where(.sx) figure{position:relative;margin:0;overflow:hidden}
.sx img{display:block;width:100%;height:100%;object-fit:cover}
:where(.sx) :is(h3,h4,h5,p){margin:0}
:where(.sx) :is(ul,ol){list-style:none;margin:0;padding:0}
.sx svg{width:1.2em;height:1.2em;flex:none}
.sx__nav{position:relative;z-index:3;display:flex;align-items:center;gap:3em;height:6.2em;padding:0 4.5em}
.sx__nav nav{display:flex;gap:2.4em;margin-left:auto;font-size:.95em;font-weight:500}
.sx__bt{display:inline-flex;align-items:center;justify-content:center;gap:.6em;height:3.4em;padding:0 1.8em;font-weight:600;font-size:.95em;white-space:nowrap}
.sx__eti{display:inline-block;font-size:.76em;letter-spacing:.24em;text-transform:uppercase;font-weight:600}
.sx__piede{display:flex;justify-content:space-between;align-items:center;gap:2em;padding:2.8em 4.5em;font-size:.88em}

/* ---------------------------------------------------------------- estetista: «Cipria», prugna e rosa, Urbanist, arco e tondo */
.sx--est{background:#FAF2EF;color:#3A2430}
.est__logo{display:flex;flex-direction:column;font:700 2.2em/.95 'Urbanist',sans-serif}
.est__logo small{font:600 .3em/1.8 Inter,sans-serif;font-style:normal;letter-spacing:.32em;text-transform:uppercase;color:#C78281}
.sx--est .sx__nav nav{opacity:.82}
.est__bt{background:#3A2430;color:#FAF2EF;border-radius:999px}
.est__hero{position:relative;display:grid;grid-template-columns:1.05fr 1fr;gap:4em;align-items:center;padding:1.5em 4.5em 3em;min-height:44em}
.est__hero::before{content:"";position:absolute;right:-8em;top:-10em;width:44em;height:44em;border-radius:50%;background:#F8E1DD}
.est__testo{position:relative;z-index:1}
.est__testo .sx__eti{color:#C78281}
.est__hero h3{font:700 5.78em/.92 'Urbanist',sans-serif;letter-spacing:-.02em;margin:.4em 0 .35em}
.est__hero h3 em{font-style:normal;color:#C78281}
.est__testo p{font-size:1.15em;line-height:1.65;max-width:27em;opacity:.8;margin-bottom:2.2em}
.est__azioni{display:flex;align-items:center;gap:1.8em}
.est__link{font-weight:600;font-size:.95em;border-bottom:.1em solid currentColor;padding-bottom:.15em}
.est__fatti{display:flex;gap:2.8em;margin-top:3.2em;padding-top:1.8em;border-top:.08em solid rgba(58, 36, 48,.15)}
.est__fatti li{font-size:.85em;color:rgba(58, 36, 48,.7)}
.est__fatti b{display:block;font:700 1.7em/1.2 'Urbanist',sans-serif;color:#3A2430}
.est__foto{position:relative;z-index:1;height:38em}
.est__arco{position:absolute!important;right:1.5em;top:0;width:25em;height:36.5em;border-radius:13em 13em 1.4em 1.4em;box-shadow:0 2.4em 4em -2em rgba(58, 36, 48,.4)}
.est__tondo{position:absolute!important;left:0;bottom:1.5em;width:13em;height:13em;border-radius:50%;border:.6em solid #FAF2EF;box-shadow:0 1.4em 2.6em -1.4em rgba(58, 36, 48,.4)}
.est__card{position:absolute;right:-1.5em;bottom:4em;width:17em;padding:1.3em 1.4em;border-radius:1.2em;background:rgba(255,255,255,.9);-webkit-backdrop-filter:blur(.6em);backdrop-filter:blur(.6em);
  box-shadow:0 1.8em 3.2em -1.4em rgba(58, 36, 48,.5)}
.est__card small{display:block;font-size:.72em;letter-spacing:.16em;text-transform:uppercase;color:#C78281;font-weight:600}
.est__card b{display:block;font:700 1.9em/1.1 'Urbanist',sans-serif;margin:.15em 0}
.est__card span{display:block;font-size:.85em;opacity:.7;margin-bottom:1em}
.est__card .sx__a{display:block;padding:.75em;border-radius:999px;background:#3A2430;color:#fff;text-align:center;font-weight:600;font-size:.85em}
.est__tratt{padding:6em 4.5em}
.est__intesta{display:grid;grid-template-columns:1fr 1fr;gap:1em 4em;align-items:end;margin-bottom:3.4em}
.est__intesta .sx__eti{grid-column:1/-1;color:#C78281}
.est__intesta h4{font:700 3.74em/.95 'Urbanist',sans-serif;letter-spacing:-.01em}
.est__intesta h4 em{font-style:normal;color:#C78281}
.est__intesta p{font-size:1.05em;line-height:1.65;opacity:.75;max-width:28em}
.est__griglia{display:grid;grid-template-columns:repeat(4,1fr);gap:1.6em}
.est__griglia article:nth-child(even){margin-top:3.5em}
.est__griglia figure{height:21em;border-radius:10em 10em 1.2em 1.2em}
.est__griglia div{padding:1.3em .2em 0}
.est__griglia b{display:block;font:700 1.8em/1.1 'Urbanist',sans-serif}
.est__griglia span{display:block;font-size:.86em;opacity:.7;margin:.3em 0 .9em}
.est__griglia em{display:inline-block;font-style:normal;font-weight:600;font-size:.82em;color:#915D62;border:.08em solid #EAD6D3;padding:.3em .9em;border-radius:999px}
.est__frase{padding:6.5em 4.5em;text-align:center;background:#3A2430;color:#FAF2EF}
.est__frase .sx__eti{color:#E5BCB6}
.est__frase p{font:700 3.4em/1.05 'Urbanist',sans-serif;margin:.4em 0 .9em}
.est__frase p em{font-style:normal;color:#F2C9C5}
.est__frase .sx__bt{background:#FAF2EF;color:#3A2430;border-radius:999px}
.est__piede{background:#301B26;color:#DDDFDC}
.est__piede b{font:700 1.9em 'Urbanist',sans-serif;color:#fff}

/* ---------------------------------------------------------------- ristorante: «Brace», carbone e arancio, Archivo (identità scelta da Alfredo) */
.sx--ris{background:#F4EEE7;color:#1C1714}
.ris__hero{position:relative;display:flex;flex-direction:column;min-height:52em;color:#fff;overflow:hidden}
.ris__sfondo{position:absolute;inset:0}
.ris__hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(4, 4, 1,.7) 0%,rgba(4, 4, 1,.28) 40%,rgba(4, 4, 1,.85) 100%)}
.ris__hero>:not(img){position:relative;z-index:2}
.ris__logo{display:flex;flex-direction:column;font:600 .9em/1 Inter,sans-serif;letter-spacing:.34em;text-transform:uppercase;color:#E2662E}
.ris__logo i{font:800 2.2em/1 'Archivo',sans-serif;font-style:normal;letter-spacing:-.01em;text-transform:none;color:#fff;margin-top:.12em}
.sx--ris .sx__nav nav{color:rgba(255,255,255,.88)}
.ris__bt{background:#E2662E;color:#191512;border-radius:999px;box-shadow:0 .8em 1.6em -.6em rgba(226, 102, 46,.6)}
.ris__bt2{color:#fff;border-radius:999px;box-shadow:inset 0 0 0 .09em rgba(255,255,255,.75)}
.ris__centro{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:1em 6em 4em}
.ris__centro .sx__eti{color:#F3B585}
.ris__centro h3{font:800 7.6em/.94 'Archivo',sans-serif;letter-spacing:-.02em;margin:.35em 0 .3em}
.ris__centro h3 em{font-style:normal;color:#F3B585}
.ris__centro p{font-size:1.2em;max-width:28em;opacity:.9;margin-bottom:2.2em}
.ris__centro div{display:flex;gap:1em}
.ris__barra{display:grid;grid-template-columns:repeat(4,1fr);background:rgba(4, 4, 1,.5);-webkit-backdrop-filter:blur(.5em);backdrop-filter:blur(.5em);border-top:.08em solid rgba(226, 102, 46,.3)}
.ris__barra span{padding:1.5em 2.2em;font-size:.95em;border-left:.08em solid rgba(255,255,255,.12)}
.ris__barra span:first-child{border-left:0}
.ris__barra b{display:block;font-size:.72em;letter-spacing:.22em;text-transform:uppercase;color:#F3B585;margin-bottom:.3em}
.ris__menu{display:grid;grid-template-columns:1.45fr 1fr;gap:4.5em;padding:6.5em 4.5em 5em}
.ris__menu .sx__eti{color:#AA4F26}
.ris__menu h4{font:800 4.6em/.98 'Archivo',sans-serif;letter-spacing:-.015em;color:#191512;margin:.3em 0 1.1em}
.ris__menu h4 em{font-style:normal;color:#AA4F26}
.ris__colonne{display:grid;grid-template-columns:1fr 1fr;gap:3.2em}
.ris__colonne h5{font:800 1.6em 'Archivo',sans-serif;color:#191512;margin-bottom:.5em;padding-bottom:.3em;border-bottom:.08em solid #E2662E}
.ris__colonne ul{margin-bottom:2em}
.ris__colonne li{display:flex;align-items:baseline;gap:.6em;padding:.5em 0}
.ris__colonne li i{flex:1;border-bottom:.14em dotted rgba(25, 21, 18,.28)}
.ris__colonne li b{font:800 1.1em 'Archivo',sans-serif;color:#191512;white-space:nowrap}
.ris__foto{display:grid;gap:1.4em;align-content:start}
.ris__foto figure{height:18em;border-radius:.8em}
.ris__foto figure:first-child{height:27em;border-radius:12em 12em .8em .8em}
.ris__striscia{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:1.4em;padding:0 4.5em 6em}
.ris__striscia figure{height:22em;border-radius:.8em}
.ris__striscia figcaption{position:absolute;left:1.2em;bottom:1.2em;padding:.45em 1.1em;border-radius:999px;background:#F4EEE7;color:#191512;font:800 1.15em 'Archivo',sans-serif}
.ris__piede{background:#191512;color:#F7DDD3}
.ris__piede b{font:800 1.7em 'Archivo',sans-serif;color:#fff}

/* ---------------------------------------------------------------- officina: antracite e giallo, industriale */
.sx--off{background:#161E28;color:#fff}
.sx--off .sx__nav{background:#161E28;border-bottom:.08em solid rgba(255,255,255,.08)}
.off__logo{display:flex;align-items:center;gap:.55em;font:700 1.8em/1 'Barlow Condensed',sans-serif;letter-spacing:.05em;text-transform:uppercase}
.off__logo i{width:.9em;height:1em;background:#F2B705;transform:skewX(-14deg)}
.sx--off .sx__nav nav{font:600 1.1em 'Barlow Condensed',sans-serif;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.75)}
.off__bt,.off__bt2{border-radius:.3em;font:700 1.15em 'Barlow Condensed',sans-serif;letter-spacing:.05em;text-transform:uppercase}
.off__bt{background:#F2B705;color:#161E28}
.off__bt2{color:#fff;box-shadow:inset 0 0 0 .09em rgba(255,255,255,.5)}
.off__hero{position:relative;display:flex;align-items:center;min-height:46em;padding:3em 4.5em 6.5em;overflow:hidden}
.off__sfondo{position:absolute;inset:0;object-position:70% 40%}
.off__hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#161E28 0%,rgba(22,30,40,.94) 36%,rgba(22,30,40,.4) 68%,rgba(22,30,40,.12) 100%)}
.off__testo{position:relative;z-index:2;max-width:38em}
.off__eti{display:inline-block;font:700 1em 'Barlow Condensed',sans-serif;letter-spacing:.24em;text-transform:uppercase;color:#F2B705}
.off__hero h3{font:700 7.8em/.86 'Barlow Condensed',sans-serif;text-transform:uppercase;margin:.3em 0 .35em}
.off__hero h3 span{color:#F2B705}
.off__testo p{font-size:1.15em;color:rgba(255,255,255,.78);max-width:27em;margin-bottom:2.2em}
.off__testo div{display:flex;gap:1em}
.off__card{position:absolute;z-index:2;right:4.5em;bottom:6.5em;width:19em;padding:1.4em;border-radius:.6em;background:#fff;color:#161E28;box-shadow:0 2em 4em -1.5em rgba(0,0,0,.65)}
.off__card small{display:block;font:700 .82em 'Barlow Condensed',sans-serif;letter-spacing:.2em;text-transform:uppercase;color:#8A6A00}
.off__card b{display:block;font:700 2.1em 'Barlow Condensed',sans-serif;text-transform:uppercase;margin:.05em 0 .5em}
.off__ore{display:grid;grid-template-columns:repeat(3,1fr);gap:.4em;margin-bottom:.8em}
.off__ore span{padding:.65em 0;text-align:center;font-size:.78em;font-weight:600;border-radius:.3em;background:#EEF0F3}
.off__ore .on{background:#161E28;color:#F2B705}
.off__card .sx__a{display:block;padding:.75em;border-radius:.3em;background:#F2B705;text-align:center;font:700 1.05em 'Barlow Condensed',sans-serif;letter-spacing:.06em;text-transform:uppercase}
.off__strisce{position:absolute;left:0;right:0;bottom:0;z-index:2;height:1.1em;background:repeating-linear-gradient(-45deg,#F2B705 0 1.4em,#161E28 1.4em 2.8em)}
.off__serv{padding:6em 4.5em}
.off__serv h4{font:700 4.6em/.95 'Barlow Condensed',sans-serif;text-transform:uppercase;margin:.25em 0 1.1em}
.off__serv h4 span{color:#F2B705}
.off__griglia{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2em}
.off__griglia article{overflow:hidden;border-radius:.4em;background:#1E2834;border-top:.3em solid #F2B705}
.off__griglia figure{height:13em}
.off__griglia div{position:relative;padding:1.4em 1.4em 1.6em}
.off__griglia i{position:absolute;right:.6em;top:-1.1em;font:700 3.8em/1 'Barlow Condensed',sans-serif;font-style:normal;color:#F2B705;text-shadow:0 .08em .3em rgba(0,0,0,.5)}
.off__griglia b{display:block;font:700 1.8em 'Barlow Condensed',sans-serif;text-transform:uppercase}
.off__griglia span{display:block;font-size:.85em;color:rgba(255,255,255,.65);margin:.2em 0 .9em}
.off__griglia em{font-style:normal;font-weight:700;color:#F2B705}
.off__banda{display:grid;grid-template-columns:1.1fr 1fr auto;gap:3em;align-items:center;margin:0 4.5em 6em;padding:3em 3.5em;border-radius:.6em;background:#F2B705;color:#161E28}
.off__banda b{font:700 2.9em/.95 'Barlow Condensed',sans-serif;text-transform:uppercase}
.off__banda p{font-size:1.05em}
.off__banda .sx__bt{background:#161E28;color:#F2B705;border-radius:.3em;font:700 1.15em 'Barlow Condensed',sans-serif;letter-spacing:.05em;text-transform:uppercase}
.off__piede{background:#0F151D;color:rgba(255,255,255,.65)}
.off__piede b{font:700 1.6em 'Barlow Condensed',sans-serif;text-transform:uppercase;color:#fff}

/* ---------------------------------------------------------------- studio legale: «Ardesia», ardesia e blu acciaio, IBM Plex Sans */
.sx--avv{background:#2A313B;color:#E8E9E6}
.sx--avv .sx__nav{border-bottom:.08em solid rgba(111, 139, 168,.3)}
.avv__logo{display:flex;flex-direction:column;font:700 1.8em/1.05 'IBM Plex Sans',sans-serif}
.avv__logo small{font:600 .36em/1.9 Inter,sans-serif;letter-spacing:.32em;text-transform:uppercase;color:#6F8BA8}
.sx--avv .sx__nav nav{color:rgba(232, 233, 230,.8)}
.avv__bt{background:#6F8BA8;color:#2A313B}
.avv__hero{display:grid;grid-template-columns:1.15fr 1fr;gap:5em;align-items:center;min-height:46em;padding:3.5em 4.5em 5.5em}
.avv__testo .sx__eti{color:#6F8BA8}
.avv__hero h3{font:700 6.2em/1 'IBM Plex Sans',sans-serif;letter-spacing:-.025em;margin:.4em 0 .4em}
.avv__hero h3 em{font-style:normal;color:#6F8BA8}
.avv__testo p{font-size:1.15em;line-height:1.65;color:rgba(232, 233, 230,.78);max-width:29em;margin-bottom:2.4em}
.avv__azioni{display:flex;align-items:center;gap:2em}
.avv__link{font-weight:600;font-size:.95em;color:#6F8BA8;border-bottom:.08em solid #6F8BA8;padding-bottom:.15em}
.avv__foto{position:relative;height:37em}
.avv__foto::before{content:"";position:absolute;inset:2em -1.6em -1.6em 4.6em;border:.09em solid #6F8BA8}
.avv__foto figure{position:absolute;inset:0 0 0 3em;z-index:1}
.avv__nota{position:absolute;z-index:2;left:0;bottom:3em;padding:1.3em 1.6em;background:#E8E9E6;color:#2A313B;box-shadow:0 1.5em 3em -1.5em rgba(0,0,0,.65)}
.avv__nota small{display:block;font-size:.72em;letter-spacing:.2em;text-transform:uppercase;color:#5A758F;font-weight:600}
.avv__nota b{display:block;font:700 1.45em 'IBM Plex Sans',sans-serif;margin:.2em 0}
.avv__nota span{font-size:.85em;opacity:.7}
.avv__aree{display:grid;grid-template-columns:1fr 1.5fr;gap:4em;padding:6em 4.5em;background:#F1F1EF;color:#2A313B}
.avv__aree .sx__eti{color:#5A758F}
.avv__aree h4{font:700 3.9em/1.05 'IBM Plex Sans',sans-serif;margin-top:.4em}
.avv__aree h4 em{font-style:normal;color:#5A758F}
.avv__aree ol li{display:grid;grid-template-columns:3.4em 1fr 2em;column-gap:1.2em;align-items:baseline;padding:1.5em 0;border-top:.08em solid rgba(42, 49, 59,.18)}
.avv__aree ol li:last-child{border-bottom:.08em solid rgba(42, 49, 59,.18)}
.avv__aree li i{grid-row:span 2;font:700 1.6em 'IBM Plex Sans',sans-serif;color:#5A758F}
.avv__aree li b{font:700 1.75em 'IBM Plex Sans',sans-serif}
.avv__aree li span{grid-column:2;font-size:.9em;opacity:.7}
.avv__aree li em{grid-column:3;grid-row:1;color:#5A758F}
.avv__metodo{display:grid;grid-template-columns:1fr 1.1fr;gap:4.5em;align-items:center;padding:6em 4.5em}
.avv__metodo figure{height:30em;filter:grayscale(.25)}
.avv__metodo .sx__eti{color:#6F8BA8}
.avv__metodo h4{font:700 3.7em 'IBM Plex Sans',sans-serif;margin:.3em 0 .7em}
.avv__metodo h4 em{font-style:normal;color:#6F8BA8}
.avv__metodo ol li{display:flex;gap:1.4em;padding:1.2em 0;border-top:.08em solid rgba(111, 139, 168,.25)}
.avv__metodo li i{font:700 2.2em/1 'IBM Plex Sans',sans-serif;color:#6F8BA8}
.avv__metodo li b{display:block;font:700 1.45em 'IBM Plex Sans',sans-serif}
.avv__metodo li span{font-size:.9em;color:rgba(232, 233, 230,.7)}
.avv__piede{background:#222830;color:rgba(232, 233, 230,.7);border-top:.08em solid rgba(111, 139, 168,.3)}
.avv__piede b{font:700 1.5em 'IBM Plex Sans',sans-serif;color:#E8E9E6}

/* ---------------------------------------------------------------- studio medico: «Blu fiducia», bianco e blu, Figtree */
.sx--med{background:#F1F5FB;color:#13306B;font-family:'Figtree',sans-serif}
.sx--med .sx__nav{background:#fff}
.med__logo{display:flex;align-items:center;gap:.7em}
.med__logo>i{display:grid;place-items:center;width:2.3em;height:2.3em;border-radius:.7em;background:#3571E4;color:#fff;font:700 1.5em/1 Inter,sans-serif;font-style:normal}
.med__logo span{display:flex;flex-direction:column;font:700 1.35em/1.1 'Figtree',sans-serif;letter-spacing:-.025em}
.med__logo small{font:500 .62em/1.5 'Figtree',sans-serif;letter-spacing:0;color:#70849F}
.sx--med .sx__nav nav{color:#4F637E}
.med__bt{background:#13306B;color:#fff;border-radius:.9em}
.med__bt2{background:#fff;color:#13306B;border-radius:.9em;box-shadow:inset 0 0 0 .09em #D0DEF5}
.med__hero{display:grid;grid-template-columns:1fr 1fr;gap:4em;align-items:center;min-height:46em;padding:3.5em 4.5em 5em;background:radial-gradient(40em 30em at 85% 30%,#CEDEFA,transparent 70%)}
.med__badge{display:inline-flex;align-items:center;gap:.6em;padding:.5em 1.1em;border-radius:999px;background:#fff;font-size:.85em;font-weight:600;color:#3F78E9;box-shadow:0 .3em 1em -.4em rgba(19, 48, 107,.3)}
.med__badge i{width:.6em;height:.6em;border-radius:50%;background:#3571E4}
.med__hero h3{font:700 5.5em/1.02 'Figtree',sans-serif;letter-spacing:-.05em;margin:.5em 0 .4em}
.med__hero h3 em{font-style:normal;color:#3571E4}
.med__testo p{font-size:1.15em;line-height:1.6;color:#4F637E;max-width:28em;margin-bottom:2.2em}
.med__azioni{display:flex;gap:.8em}
.med__punti{display:flex;gap:1.8em;margin-top:2.6em}
.med__punti li{display:flex;align-items:center;gap:.5em;font-size:.9em;font-weight:600}
.med__punti li::before{content:"✓";display:grid;place-items:center;width:1.6em;height:1.6em;border-radius:50%;background:#CEDEFA;color:#3571E4;font-size:.8em}
.med__foto{position:relative;height:38em}
.med__foto figure{position:absolute;inset:0 3em 0 0;border-radius:2.4em}
.med__pren{position:absolute;right:0;bottom:2.5em;width:19em;padding:1.4em;border-radius:1.4em;background:#fff;box-shadow:0 2em 3.6em -1.6em rgba(19, 48, 107,.5)}
.med__pren b{display:block;font-size:1.15em}
.med__pren small{display:block;font-size:.78em;color:#70849F;margin:.2em 0 .9em}
.med__giorni,.med__ore{display:grid;grid-template-columns:repeat(4,1fr);gap:.35em;margin-bottom:.45em}
.med__giorni span,.med__ore span{padding:.55em 0;text-align:center;border-radius:.6em;background:#EBF0FF;font-size:.78em;font-weight:600}
.med__giorni .on,.med__ore .on{background:#3571E4;color:#fff}
.med__pren .sx__a{display:block;margin-top:.8em;padding:.8em;text-align:center;border-radius:.8em;background:#13306B;color:#fff;font-weight:600;font-size:.9em}
.med__chip{position:absolute;left:-1.5em;top:3em;padding:.7em 1.2em;border-radius:999px;background:#fff;font-size:.85em;font-weight:600;box-shadow:0 1em 2em -1em rgba(19, 48, 107,.45)}
.med__prest{padding:6em 4.5em}
.med__prest .sx__eti,.med__studio .sx__eti{color:#3F78E9}
.med__prest h4{font:700 3.7em/1.05 'Figtree',sans-serif;letter-spacing:-.045em;margin:.4em 0 1.2em}
.med__prest h4 em{font-style:normal;color:#3571E4}
.med__griglia{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2em}
.med__griglia article{padding:1.8em 1.6em;border-radius:1.4em;background:#fff;box-shadow:0 .4em 1.6em -.8em rgba(19, 48, 107,.22)}
.med__griglia i{display:grid;place-items:center;width:3.2em;height:3.2em;margin-bottom:1.4em;border-radius:1em;background:#CEDEFA;color:#3571E4}
.med__griglia i svg{width:1.6em;height:1.6em;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.med__griglia b{display:block;font-size:1.25em;letter-spacing:-.02em}
.med__griglia span{display:block;margin:.4em 0 1.2em;font-size:.88em;line-height:1.5;color:#70849F}
.med__griglia em{display:inline-flex;align-items:center;gap:.3em;font-style:normal;font-weight:600;font-size:.85em;color:#3F78E9}
.med__studio{display:grid;grid-template-columns:1fr 1fr;gap:4em;align-items:center;padding:0 4.5em 6em}
.med__studio figure{height:28em;border-radius:2em}
.med__studio h4{font:700 3.1em 'Figtree',sans-serif;letter-spacing:-.045em;margin:.3em 0 .9em}
.med__studio dl{display:grid;grid-template-columns:auto 1fr;gap:.9em 2em;margin:0 0 1.6em}
.med__studio dt{font-size:.78em;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#70849F}
.med__studio dd{margin:0;font-weight:600}
.med__mappa{position:relative;height:9em;overflow:hidden;border-radius:1.2em;background-color:#E0E9F7;
  background-image:linear-gradient(90deg,rgba(19, 48, 107,.08) .12em,transparent .12em),linear-gradient(rgba(19, 48, 107,.08) .12em,transparent .12em);background-size:2.6em 2.6em}
.med__mappa::before{content:"";position:absolute;left:-5%;right:-5%;top:55%;height:1em;background:#fff;transform:rotate(-8deg)}
.med__mappa i{position:absolute;left:50%;top:26%;width:1.8em;height:1.8em;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:#3571E4;box-shadow:0 0 0 .35em #fff}
.med__piede{background:#13306B;color:#C2D3EC}
.med__piede b{font-weight:700;font-size:1.3em;color:#fff}

/* ---------------------------------------------------------------- barbiere: blu notte e rosso, Oswald maiuscolo (stile scelto da Alfredo) */
.sx--bar{background:#0E1B2C;color:#F4F1EA}
.bar__hero{position:relative;display:flex;flex-direction:column;min-height:50em;overflow:hidden}
.bar__sfondo{position:absolute;inset:0;filter:saturate(.75)}
.bar__hero::after{content:"";position:absolute;inset:0;background:radial-gradient(65% 70% at 50% 55%,rgba(14,27,44,.55),rgba(14,27,44,.93))}
.bar__hero>:not(img){position:relative;z-index:2}
.bar__logo{display:flex;flex-direction:column;font:600 .85em/1 'Oswald',sans-serif;letter-spacing:.36em;text-transform:uppercase;color:#E4343F}
.bar__logo i{font:600 2.3em/1 'Oswald',sans-serif;font-style:normal;letter-spacing:.04em;color:#F4F1EA}
.sx--bar .sx__nav nav{font-family:'Oswald',sans-serif;letter-spacing:.1em;text-transform:uppercase;color:rgba(244,241,234,.82)}
.bar__bt{background:#E4343F;color:#fff;border-radius:.3em;font-family:'Oswald',sans-serif;letter-spacing:.08em;text-transform:uppercase}
.bar__centro{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:1em 6em 5em}
.bar__orn{display:flex;align-items:center;gap:1em;font:600 .9em 'Oswald',sans-serif;letter-spacing:.3em;text-transform:uppercase;color:#F06A72}
.bar__orn i{width:4em;height:.12em;background:#E4343F}
.bar__centro h3{font:600 8em/.9 'Oswald',sans-serif;text-transform:uppercase;margin:.3em 0 .35em}
.bar__centro h3 em{font-style:normal;color:#E4343F}
.bar__centro p{font-size:1.15em;max-width:28em;color:rgba(244,241,234,.82);margin-bottom:2.2em}
.bar__listino{display:grid;grid-template-columns:1fr 1.1fr;gap:4.5em;align-items:center;padding:6em 4.5em}
.bar__listino figure{height:34em;border-radius:.3em}
.bar__listino .sx__eti{color:#F06A72}
.bar__listino h4{font:600 4.4em/.95 'Oswald',sans-serif;text-transform:uppercase;margin:.3em 0 .9em}
.bar__listino h4 em{font-style:normal;color:#E4343F}
.bar__listino ul{margin-bottom:2.2em}
.bar__listino li{display:flex;align-items:baseline;gap:.8em;padding:.8em 0;border-bottom:.08em solid rgba(244,241,234,.12);font-size:1.1em}
.bar__listino li i{flex:1;border-bottom:.12em dotted rgba(244,241,234,.25)}
.bar__listino li b{font:600 1.25em 'Oswald',sans-serif;color:#E4343F;white-space:nowrap}
.bar__galleria{display:grid;grid-template-columns:1fr 1.3fr 1fr;gap:1.2em;align-items:center;padding:0 4.5em 6em}
.bar__galleria figure{height:24em;border-radius:.3em}
.bar__galleria figure:nth-child(2){height:29em}
.bar__piede{background:#08111D;color:rgba(244,241,234,.6);border-top:.2em solid #E4343F}
.bar__piede b{font:600 1.6em 'Oswald',sans-serif;text-transform:uppercase;color:#fff}

/* ---------------------------------------------------------------- palestra: nero e verde acido, caratteri grossi */
.sx--pal{background:#0E0F0C;color:#fff}
.pal__logo{display:flex;align-items:baseline;gap:.45em;font:400 2.5em/1 'Anton',sans-serif;text-transform:uppercase;letter-spacing:.02em}
.pal__logo span{font:700 .3em Inter,sans-serif;letter-spacing:.32em;text-transform:uppercase;color:#C8F135}
.sx--pal .sx__nav nav{font-size:.85em;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.75)}
.pal__bt,.pal__bt2{border-radius:.3em;font-size:.85em;font-weight:700;letter-spacing:.09em;text-transform:uppercase}
.pal__bt{background:#C8F135;color:#0E0F0C}
.pal__bt2{color:#fff;box-shadow:inset 0 0 0 .09em rgba(255,255,255,.4)}
.pal__hero{position:relative;min-height:44em;overflow:hidden}
.pal__testo{position:relative;z-index:2;display:flex;flex-direction:column;justify-content:center;min-height:44em;max-width:44em;padding:3em 0 5em 4.5em}
.pal__eti{font-size:.78em;font-weight:700;letter-spacing:.26em;text-transform:uppercase;color:#C8F135}
.pal__hero h3{font:400 9.2em/.86 'Anton',sans-serif;text-transform:uppercase;margin:.25em 0 .35em}
.pal__hero h3 span{color:#C8F135}
.pal__testo p{font-size:1.1em;color:rgba(255,255,255,.72);max-width:26em;margin-bottom:2.2em}
.pal__azioni{display:flex;gap:.8em}
.pal__foto{position:absolute!important;right:0;top:0;bottom:0;width:54%;clip-path:polygon(20% 0,100% 0,100% 100%,0 100%)}
.pal__foto::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(14,15,12,.55),transparent 45%)}
.pal__nastro{position:relative;z-index:3;margin:-.8em -1em 0;padding:.7em 0;overflow:hidden;white-space:nowrap;background:#C8F135;color:#0E0F0C;font:400 1.6em/1 'Anton',sans-serif;text-transform:uppercase;transform:rotate(-1.5deg)}
.pal__nastro span{display:inline-block;padding-left:1em}
.pal__orari{padding:6em 4.5em 4em}
.pal__orari h4{font:400 4.6em/1 'Anton',sans-serif;text-transform:uppercase;margin-bottom:.7em}
.pal__orari h4 span{color:#C8F135}
.pal__tab{display:grid;grid-template-columns:5em repeat(5,1fr);gap:.5em}
.pal__tab b{padding:.4em .2em;font-size:.78em;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.55)}
.pal__tab i{align-self:center;font:400 1.4em 'Anton',sans-serif;font-style:normal;color:#C8F135}
.pal__tab span{display:flex;align-items:center;min-height:3.3em;padding:0 1em;border-radius:.4em;background:#1A1C17;font-size:.9em;font-weight:600}
.pal__tab span:empty{background:transparent;border:.08em dashed rgba(255,255,255,.09)}
.pal__tab span.on{background:#C8F135;color:#0E0F0C}
.pal__abb{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4em;align-items:start;padding:3em 4.5em 6em}
.pal__abb article{padding:2.2em;border-radius:.6em;background:#1A1C17;border:.08em solid rgba(255,255,255,.06)}
.pal__abb article.on{background:#C8F135;color:#0E0F0C;transform:translateY(-1.2em)}
.pal__abb small{font-size:.8em;font-weight:700;letter-spacing:.2em;text-transform:uppercase;opacity:.75}
.pal__abb b{display:block;font:400 4.2em/1 'Anton',sans-serif;margin:.3em 0 .1em}
.pal__abb span{font-size:.9em;opacity:.7}
.pal__abb ul{margin:1.4em 0 1.8em}
.pal__abb li{padding:.55em 0;border-top:.08em solid rgba(255,255,255,.08);font-size:.92em}
.pal__abb .on li{border-color:rgba(14,15,12,.15)}
.pal__abb .sx__a{display:block;padding:.9em;border-radius:.3em;background:#C8F135;color:#0E0F0C;text-align:center;font-size:.82em;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.pal__abb .on .sx__a{background:#0E0F0C;color:#C8F135}
.pal__piede{background:#080907;color:rgba(255,255,255,.6)}
.pal__piede b{font:400 1.9em 'Anton',sans-serif;text-transform:uppercase;color:#C8F135}

/* ---------------------------------------------------------------- agenzia immobiliare: bianco e blu, ricerca e annunci */
.sx--imm{background:#fff;color:#0F2A3D;font-family:'Manrope',Inter,sans-serif}
.imm__logo{display:flex;align-items:center;gap:.7em}
.imm__logo>i{position:relative;width:2.4em;height:2.4em;border-radius:.7em;background:#0F2A3D}
.imm__logo>i::after{content:"";position:absolute;left:.6em;top:.62em;width:1.2em;height:1.15em;background:#5FC4D6;clip-path:polygon(50% 0,100% 45%,100% 100%,0 100%,0 45%)}
.imm__logo span{display:flex;flex-direction:column;font:800 1.5em/1.05 'Manrope',sans-serif;letter-spacing:-.045em}
.imm__logo small{font:600 .5em/1.6 Inter,sans-serif;letter-spacing:.26em;text-transform:uppercase;color:#1F7A8C}
.sx--imm .sx__nav nav{color:#41596B;font-weight:600}
.imm__bt{background:#0F2A3D;color:#fff;border-radius:.8em}
.imm__hero{position:relative;padding:0 2.5em 3em}
.imm__foto{height:44em;border-radius:2em}
.imm__foto::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(15,42,61,.62),rgba(15,42,61,0) 62%),linear-gradient(180deg,rgba(15,42,61,0) 35%,rgba(15,42,61,.72))}
.imm__testo{position:absolute;left:5em;bottom:17.5em;z-index:2;color:#fff;text-shadow:0 .1em 1.2em rgba(15,42,61,.45)}
.imm__testo span{font-size:.8em;font-weight:700;letter-spacing:.22em;text-transform:uppercase;opacity:.92}
.imm__hero h3{font:800 5.8em/1 'Manrope',sans-serif;letter-spacing:-.055em;margin-top:.3em}
.imm__cerca{position:absolute;left:5em;right:5em;bottom:5.5em;z-index:3;padding:1.2em;border-radius:1.4em;background:#fff;box-shadow:0 2em 4em -2em rgba(15,42,61,.5)}
.imm__tab{display:flex;gap:.4em;margin-bottom:1em}
.imm__tab b,.imm__tab span{padding:.5em 1.2em;border-radius:.6em;font-size:.88em;font-weight:700}
.imm__tab b{background:#0F2A3D;color:#fff}
.imm__tab span{color:#5E7383}
.imm__campi{display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:.8em}
.imm__campi p{padding:.8em 1.1em;border-radius:.8em;background:#F2F6F8;font-weight:700}
.imm__campi small{display:block;margin-bottom:.2em;font-size:.72em;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#6B8090}
.imm__campi .sx__bt{height:auto;padding:0 2.4em;background:#1F7A8C}
.imm__evid{padding:2em 4.5em 5em}
.imm__intesta{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:1.6em}
.imm__intesta h4{font:800 3.1em 'Manrope',sans-serif;letter-spacing:-.055em}
.imm__intesta .sx__a{display:flex;align-items:center;gap:.4em;font-weight:700;color:#1F7A8C}
.imm__griglia{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4em}
.imm__griglia article{overflow:hidden;border-radius:1.4em;background:#fff;border:.08em solid #E8EEF2;box-shadow:0 .6em 2em -1em rgba(15,42,61,.3)}
.imm__griglia figure{height:16em}
.imm__griglia figure span{position:absolute;left:1em;top:1em;padding:.35em .9em;border-radius:999px;background:#fff;font-size:.78em;font-weight:700;color:#1F7A8C}
.imm__griglia div{padding:1.3em 1.4em 1.5em}
.imm__griglia b{display:block;font:800 1.75em 'Manrope',sans-serif;letter-spacing:-.045em}
.imm__griglia strong{display:block;font-size:1.05em;margin:.2em 0 .1em}
.imm__griglia small{display:block;font-size:.85em;color:#6B8090}
.imm__griglia ul{display:flex;gap:1.2em;margin-top:1em;padding-top:1em;border-top:.08em solid #E8EEF2;font-size:.85em;font-weight:600;color:#41596B}
.imm__valuta{display:grid;grid-template-columns:1fr 1fr;gap:3em;align-items:center;margin:0 4.5em 6em;padding:3em;border-radius:2em;background:#EAF3F6}
.imm__valuta span{font-size:.8em;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#1F7A8C}
.imm__valuta h4{font:800 3.3em/1.05 'Manrope',sans-serif;letter-spacing:-.055em;margin:.3em 0 .5em}
.imm__valuta p{max-width:24em;margin-bottom:1.6em;color:#41596B}
.imm__valuta figure{height:20em;border-radius:1.4em}
.imm__piede{background:#0F2A3D;color:#AFC3CF}
.imm__piede b{font:800 1.3em 'Manrope',sans-serif;color:#fff}

/* ---------------------------------------------------------------- bar: «Gelato», cioccolato, fragola e pistacchio, Fredoka (identità scelta da Alfredo) */
.sx--caf{background:#FFF7EC;color:#3A221A}
.sx--caf .sx__nav{background:#4A2B21;color:#FFF7EC}
.caf__logo{display:flex;align-items:baseline;gap:.4em;font:600 1.7em/1 'Fredoka',sans-serif;letter-spacing:.04em}
.caf__logo i{font-style:normal;color:#F28B95}
.sx--caf .sx__nav nav{color:rgba(255, 247, 236,.82)}
.caf__bt{background:#F28B95;color:#4A2B21;border-radius:.25em;letter-spacing:.04em}
.caf__bt2{color:#4A2B21;border-radius:.25em;box-shadow:inset 0 0 0 .09em rgba(74, 43, 33,.4)}
.caf__hero{display:grid;grid-template-columns:1fr 1.05fr;min-height:46em}
.caf__testo{display:flex;flex-direction:column;justify-content:center;padding:3em 4em 4em 4.5em;background:#FFF7EC}
.caf__aperto{display:inline-flex;align-items:center;gap:.6em;align-self:flex-start;padding:.45em 1em;border-radius:999px;background:#fff;font-size:.82em;font-weight:600;color:#4A2B21;box-shadow:0 .3em 1em -.4em rgba(74, 43, 33,.35)}
.caf__aperto i{width:.6em;height:.6em;border-radius:50%;background:#3FA36B;box-shadow:0 0 0 .25em rgba(63,163,107,.2)}
.caf__eti{display:block;margin:2em 0 0;font:600 .9em 'Fredoka',sans-serif;letter-spacing:.24em;text-transform:uppercase;color:#A15D5D}
.caf__hero h3{font:600 5.4em/1.02 'Fredoka',sans-serif;letter-spacing:.005em;color:#4A2B21;margin:.3em 0 .45em}
.caf__testo p{font-size:1.12em;line-height:1.6;color:#6C5B51;max-width:27em;margin-bottom:2.2em}
.caf__azioni{display:flex;gap:.8em}
.caf__foto{position:relative}
.caf__foto figure{position:absolute;inset:0}
.caf__foto figure::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(74, 43, 33,.25),transparent 40%)}
.caf__gusti{position:absolute;left:-3em;bottom:3.5em;z-index:2;width:21em;padding:1.4em;border-radius:.4em;background:#4A2B21;color:#FFF7EC;box-shadow:0 2em 3.6em -1.6em rgba(74, 43, 33,.7)}
.caf__gusti small{display:block;margin-bottom:.9em;font:600 .78em 'Fredoka',sans-serif;letter-spacing:.2em;text-transform:uppercase;color:#F28B95}
.caf__gusti div{display:flex;flex-wrap:wrap;gap:.45em}
.caf__gusti span{display:inline-flex;align-items:center;gap:.45em;padding:.4em .8em;border-radius:999px;background:rgba(255, 247, 236,.1);font-size:.82em}
.caf__gusti span i{width:.8em;height:.8em;border-radius:50%;box-shadow:inset 0 0 0 .08em rgba(0,0,0,.15)}
.caf__menu{display:grid;grid-template-columns:1fr 1.6fr;gap:4em;padding:6em 4.5em;background:#4A2B21;color:#FFF7EC}
.caf__menu .caf__eti{margin:0;color:#F28B95}
.caf__menu h4{font:600 3.6em/1.05 'Fredoka',sans-serif;margin:.4em 0 .8em}
.caf__tab{display:inline-flex;gap:.3em;padding:.3em;border-radius:999px;background:rgba(255, 247, 236,.08)}
.caf__tab span{padding:.5em 1.1em;border-radius:999px;font-size:.85em;font-weight:600;color:rgba(255, 247, 236,.7)}
.caf__tab span.on{background:#F28B95;color:#4A2B21}
.caf__colonne{display:grid;grid-template-columns:repeat(3,1fr);gap:2.4em;align-self:end}
.caf__colonne h5{font:600 1.35em 'Fredoka',sans-serif;color:#F28B95;padding-bottom:.5em;margin-bottom:.4em;border-bottom:.08em solid rgba(242, 139, 149,.4)}
.caf__colonne li{display:flex;align-items:baseline;gap:.5em;padding:.55em 0;font-size:.98em}
.caf__colonne li i{flex:1;border-bottom:.12em dotted rgba(255, 247, 236,.25)}
.caf__colonne li b{font-family:'Fredoka',sans-serif;white-space:nowrap;color:#CFE3A9}
.caf__momenti{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4em;padding:5em 4.5em 6em}
.caf__momenti figure{height:23em;border-radius:.4em}
.caf__momenti figcaption{position:absolute;left:0;right:0;bottom:0;padding:2.4em 1.4em 1.2em;background:linear-gradient(transparent,rgba(74, 43, 33,.85));color:#FFF7EC;font:600 1.4em 'Fredoka',sans-serif}
.caf__piede{background:#331E16;color:rgba(255, 247, 236,.65);border-top:.2em solid #F28B95}
.caf__piede b{font:600 1.4em 'Fredoka',sans-serif;color:#F28B95}