/* Impaginazione di base del Journal: rifà quella che dava Squarespace.
   Colori, caratteri e menu arrivano dal codice personalizzato di Blackstars (nelle pagine). */
@font-face{font-family:Archivo;src:url(/assets/fonts/archivo-latin.woff2) format('woff2');font-weight:100 900;font-display:swap}
@font-face{font-family:'Cormorant Garamond';src:url(/assets/fonts/cormorant-garamond-400-latin.woff2) format('woff2');font-weight:400;font-display:swap}

html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;font-family:Archivo,Arial,sans-serif;font-size:16px;line-height:1.5em;color:#e9e8e1;background:#101112;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
h1{color:#fafafa}
p{margin:1rem 0}
*,*:before,*:after{box-sizing:border-box}
img{max-width:100%}
a{color:inherit}
#header,#footer-sections{display:none}
.site-wrapper{display:flex;flex-direction:column;min-height:100vh}
#page{display:block;width:100%}

/* sezione e colonna dell'articolo */
.page-section{background:#050505;margin:0}
.content-wrapper{padding:0 5%}
.blog-item-wrapper{display:block;max-width:900px;margin:0 auto;background:#050505}
.h-entry{display:block;padding:3vw}
.blog-item-inner-wrapper{margin:0 23.5%}
.blog-item-top-wrapper{margin-bottom:50px}
.entry-title{margin:0;font-weight:400}
.blog-item-meta-wrapper{display:flex;margin-top:32px}
.blog-item-author-date-wrapper{display:flex;flex-wrap:wrap}
.blog-meta-item{font-weight:500;font-size:16px;line-height:24px}
.blog-meta-item--date span{color:#fafafa;font-family:Archivo,Arial,sans-serif;font-weight:500}
.blog-meta-item--date:after{content:"|";padding:0 8px}
.blog-author-name{text-decoration:none;font-family:Archivo,Arial,sans-serif;color:#aaa}
.blog-item-content{margin-bottom:3vw;font-size:16px;line-height:1.8}

/* blocchi */
.sqs-block{padding:17px;margin:0 -17px;position:relative}
.spacer-block{padding:0}
.sqs-html-content{white-space:normal}
.sqs-html-content>*:first-child{margin-top:0}
.sqs-html-content>*:last-child{margin-bottom:0}
.sqs-html-content p{margin:0 0 16px}
/* paragrafi vuoti lasciati apposta come spazio (come in Squarespace) */
.sqs-html-content [data-rte-preserve-empty]:empty:before{content:"\200b"}
.sqs-html-content h2,.sqs-html-content h3,.sqs-html-content h4{font-weight:400;margin:32px 0 0;letter-spacing:-.02em}
.sqs-html-content h3{text-transform:uppercase}
.sqs-html-content a,.image-caption a{color:inherit;text-decoration:none}
.sqs-block-image-figure{margin:0}
.image-block-wrapper{position:relative;overflow:hidden;height:0}
.image-block-wrapper img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.image-caption p{font-size:16px;line-height:24px;margin:16px 0}

/* galleria (4 per riga, quadrati, spazio 20px come in Squarespace) */
.gallery-block .sqs-gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-bottom:20px}
.gallery-block .slide{aspect-ratio:1/1;overflow:hidden}
.gallery-block .slide img{width:100%;height:100%;object-fit:cover;display:block}

/* newsletter (stessa struttura del blocco Squarespace) */
.newsletter-form-wrapper{text-align:center}
.newsletter-form{text-align:right;margin:0}
.newsletter-form-header-title{text-align:left;font:400 36.736px/1.2 'Cormorant Garamond',Georgia,serif;letter-spacing:-.02em;text-transform:uppercase;color:#fafafa;margin:0 0 16px}
.newsletter-form-header-description{font:16px/24px Archivo,Arial,sans-serif;color:#fafafa}
.newsletter-form-header-description p{text-align:left;margin:16px 0}
.newsletter-form-body{padding:0 0 16px}
.newsletter-form-fields-wrapper,.newsletter-form-button-wrapper{display:inline-block;margin:16px 0 0;vertical-align:top}
.newsletter-form-field-wrapper{display:inline-block;padding:8px 0 8px 4px}
.newsletter-form-button-wrapper{padding:8px 0 8px 4px}
.newsletter-form-field-element{font:16px/1.2 BlackstarsDM,Arial,sans-serif;padding:22.4px 32px;width:284px;max-width:100%;border:1px solid rgba(0,0,0,.12);background:#fff;color:#000;border-radius:0;margin:0}
.newsletter-form-button{font:500 16px/1.2 Archivo,Arial,sans-serif;text-transform:uppercase;padding:22.4px 32px;border:2px solid #dcdcdc;background:transparent;color:#dcdcdc;cursor:pointer;border-radius:0;margin:0}
.newsletter-form-button:hover{opacity:.8}
.newsletter-form-status{font-size:15px;min-height:1px;margin:12px 0 0}
.is-invalid{outline:2px solid #ff986f;outline-offset:2px}
.bs-honey{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0}
.bs-visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

@media (max-width:767px){
  .blog-item-inner-wrapper{margin:3vw 3vw 0}
  .blog-item-meta-wrapper{margin-top:19px}
  .spacer-block{display:none}
  .gallery-block .sqs-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
  .newsletter-form-header-title{font-size:27px;margin-bottom:14px}
  .newsletter-form-header-description{line-height:normal}
  .newsletter-form-header-description p{margin:0 0 14px}
}