/* alessiomosca.it — ricostruzione del sito Squarespace */

/* Mona Sans (licenza OFL): font variabile, larghezza 95% e corpo al 91% per avere le stesse misure di Halyard Display */
@font-face{font-family:"Mona Sans";font-style:normal;font-display:swap;font-weight:200 900;font-stretch:75% 125%;src:url(fonts/mona-sans-latin-standard-normal.woff2) format("woff2-variations"),url(fonts/mona-sans-latin-standard-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Mona Sans";font-style:normal;font-display:swap;font-weight:200 900;font-stretch:75% 125%;src:url(fonts/mona-sans-latin-ext-standard-normal.woff2) format("woff2-variations"),url(fonts/mona-sans-latin-ext-standard-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Mona Sans";font-style:italic;font-display:swap;font-weight:200 900;font-stretch:75% 125%;src:url(fonts/mona-sans-latin-standard-italic.woff2) format("woff2-variations"),url(fonts/mona-sans-latin-standard-italic.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --font:"Mona Sans","Helvetica Neue",Arial,sans-serif;
  --k:.911;               /* rapporto di corpo rispetto a Halyard */
  --text:#000;
  --bg:#fff;
  --footer-bg:#eeedeb;
  --pad:3vw;
  --col:70.5vw;           /* colonna testi (bio, manifesto, laboratori) */
  --col-narrow:46.5vw;    /* colonna degli scritti */
  --fs-p:calc(16px * var(--k));
  --fs-h1:calc((26.8px + 1vw) * var(--k));
  --fs-h2:calc((20.14px + .529vw) * var(--k));
  --fs-h3:calc((18.47px + .412vw) * var(--k));
  --fs-h4:calc((17.77px + .227vw) * var(--k));
  --fs-title:calc((18.95px + .38vw) * var(--k));
}
@media (min-width:1800px){
  :root{--fs-h1:calc(44.8px * var(--k));--fs-h2:calc(29.7px * var(--k));--fs-h3:calc(25.9px * var(--k));--fs-h4:calc(21.9px * var(--k));--fs-title:calc(25.8px * var(--k))}
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;color-scheme:light}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);font-weight:300;font-size:var(--fs-p);line-height:1.537;letter-spacing:.055em;font-stretch:95%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.2em}
h1,h2,h3,h4{font-weight:300;letter-spacing:.022em;margin:0}
h1{font-size:var(--fs-h1);line-height:1.372}
h2{font-size:var(--fs-h2);line-height:1.334}
h3{font-size:var(--fs-h3);line-height:1.345}
h4{font-size:var(--fs-h4);line-height:1.356}
strong{font-weight:700;font-stretch:100%}
p{margin:0}
.visually-hidden,.skip:not(:focus){position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip:focus{position:fixed;top:8px;left:8px;z-index:100;background:#fff;padding:8px 12px}

/* freccia "→" disegnata (il carattere non esiste nel font) */
.arrow{position:relative;display:inline;white-space:nowrap}
.arrow::before{content:"\2002\2002"}
.arrow svg{position:absolute;left:.06em;top:50%;width:.9em;height:.5em;margin-top:-.2em;overflow:visible}

/* blocchi di testo come in Squarespace */
.content>*{margin:1rem 0}
.content>h1,.content>h2,.content>h3,.content>h4{margin:2rem 0}
.content>:first-child{margin-top:0}
.content>:last-child{margin-bottom:0}
.content p:empty{min-height:1.537em}

/* ---------------- header */
.site-header{position:relative;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:40px var(--pad);min-height:117px}
.site-title{font-size:var(--fs-title);line-height:1.372;letter-spacing:.022em;text-decoration:none}
.site-nav{display:flex;gap:20px}
.site-nav a{text-decoration:none;line-height:1.537}
.site-nav a.active,.site-nav a:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.25em}
.burger{display:none;background:none;border:0;padding:12px 0;width:34px;cursor:pointer;color:inherit}
.burger span{display:block;height:1px;background:currentColor;transition:transform .3s ease}
.burger span+span{margin-top:12px}
.menu-open .burger span:first-child{transform:translateY(6.5px) rotate(45deg)}
.menu-open .burger span:last-child{transform:translateY(-6.5px) rotate(-45deg)}
.mobile-menu{position:fixed;inset:0;z-index:10;background:var(--bg);display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s ease}
.mobile-menu[hidden]{display:none}
.menu-open .mobile-menu{opacity:1}
.mobile-menu nav{display:flex;flex-direction:column;align-items:center}
.mobile-menu a{font-size:calc(30px * var(--k));line-height:1.976;letter-spacing:.022em;text-decoration:none}
.menu-open{overflow:hidden}

/* ---------------- home */
.home-intro{padding:43px var(--pad) 0;max-width:calc(711px + var(--pad))}
.home-intro h4{margin:0}
.home-intro h4+h4{margin-top:2rem}
.home-feature{width:72.85vw;margin:190px auto 0}
.home-intro+.home-feature{margin-top:190px}
.home-feature .home-img{display:block}
.home-feature .home-img img{width:100%}
.home-feature h2{margin-top:17px}
.home-feature h2 a{text-underline-offset:.2em}
.page-home main{padding-bottom:95px}

/* ---------------- testi (bio, manifesto) */
.text-page{width:var(--col);margin:0 auto;padding:95px 0}

/* ---------------- formazione: griglia */
.portfolio-grid{display:grid;grid-template-columns:repeat(3,1fr);column-gap:6.6vw;row-gap:120px;padding:47.5px var(--pad)}
.grid-item{display:block;text-decoration:none}
.grid-image{aspect-ratio:3/4;overflow:hidden;background:#f3f3f3}
.grid-image img{width:100%;height:100%;object-fit:cover;object-position:50% 50%;transition:transform .4s ease}
.grid-item:hover .grid-image img{transform:scale(1.05)}
.grid-title{font-size:var(--fs-h4);line-height:1.372;margin-top:26px}

/* ---------------- formazione: laboratorio */
.project-text{width:var(--col);margin:0 auto;padding-top:95px}
.project-text>h4:first-child{text-align:center;margin-bottom:2rem}
.project-text>h4:first-child+p{text-align:center;margin-bottom:2rem}
.gallery{padding:139px var(--pad) 0}
.gallery figure{margin:0 0 36px}
.gallery figure:last-child{margin-bottom:0}
.gallery img{width:100%}

/* ---------------- scritti */
.scritti-index{list-style:none;margin:0;padding:72px var(--pad) 95px;text-align:center}
.scritti-index li{padding:16px 0}
.scritti-index h1{font-size:var(--fs-h1);line-height:1.372}
.scritti-index a{text-decoration:none}
.scritti-index a:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.15em}
.scritto{width:var(--col-narrow);margin:0 auto;padding:95px 0 0}

/* ---------------- frecce avanti/indietro */
.item-pagination{display:flex;justify-content:space-between;align-items:center;padding:95px var(--pad) 46px}
.item-pagination a{display:flex;align-items:center;gap:22px;text-decoration:none}
.item-pagination svg{width:9px;height:16px;flex:none;stroke:currentColor;stroke-width:1.2}
.pag-title{font-size:var(--fs-h4);line-height:1.372}
.item-pagination a:hover .pag-title{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.2em}
.page-project .item-pagination{padding-top:46px}

/* ---------------- footer */
.site-footer{background:var(--footer-bg);padding:103px var(--pad) 104px}
.footer-inner{display:grid;grid-template-columns:calc(33.3vw - var(--pad)) 1fr;align-items:start}
.footer-name{font-size:var(--fs-h4);line-height:1.356}
.footer-contacts{font-size:var(--fs-p);line-height:1.537}

/* ---------------- comparsa morbida dei blocchi */
.js .reveal{opacity:0;transition:opacity .65s ease}
.js .reveal.in{opacity:1}
@media (prefers-reduced-motion:reduce){.js .reveal{opacity:1;transition:none}.grid-image img{transition:none}}

/* ---------------- tablet e telefono */
@media (max-width:767px){
  :root{--pad:6vw;--col:calc(100vw - 12vw);--col-narrow:calc(100vw - 12vw)}
  .site-header{padding:30px var(--pad);min-height:0}
  .site-title{font-size:calc(25.5px * var(--k))}
  .site-nav{display:none}
  .burger{display:block}
  .home-intro{padding-top:60px}
  .home-feature{width:auto;margin:120px var(--pad) 0}
  .home-intro+.home-feature{margin-top:150px}
  .portfolio-grid{grid-template-columns:1fr;row-gap:120px;padding:20px var(--pad) 60px}
  .text-page,.scritto,.project-text{padding-top:50px}
  .text-page{padding-bottom:60px}
  .gallery{padding-top:80px}
  .gallery figure{margin-bottom:20px}
  .scritti-index{padding-top:40px}
  .item-pagination{padding-top:60px}
  .site-footer{padding:60px var(--pad)}
  .footer-inner{grid-template-columns:1fr}
  .footer-contacts br:first-child{display:none}
}