
/* =========================================================
   INNESTI PER WORDPRESS
   Il foglio qui sopra è quello del sito statico, invariato.
   Sotto ci sono solo le correzioni necessarie perché i wrapper
   aggiunti dall'editor a blocchi non alterino il disegno.

   Tutte le regole stanno dentro :where(), quindi valgono zero in
   specificità: annullano gli stili del core senza mai prendere il
   sopravvento sulle misure di progetto scritte sopra.
   ========================================================= */

/* WordPress avvolge le parti del template in un <div>: senza questo,
   header e piede si comporterebbero come blocchi anonimi in mezzo
   al flusso e alcune fasce a tutta larghezza si restringerebbero. */
.wp-block-template-part{ display:contents; }

/* Lo stacco fra i blocchi del layout "a flusso" è azzerato in
   theme.json (styles.spacing.blockGap): le fasce del sito sono a
   contatto per progetto. Qui resta solo l'azzeramento dei margini
   esterni dei due contenitori. */
:where(main.wp-block-group),
:where(.wp-block-post-content){ margin-block:0; }

/* I titoli restano quelli delle tavole: la classe del core non deve
   aggiungere margini propri. */
:where(.wp-block-heading){ margin-block:0; }

/* Immagini inserite dall'editor: WordPress aggiunge width/height in
   linea, il sito le vuole fluide. */
:where(.wp-block-image),
:where(.wp-block-image figure){ margin:0; }
:where(.wp-block-image img){ height:auto; }

/* Il contenitore assegna le coordinate dall'ordine corrente dei riquadri. */
.rz-galleria{ height:calc(var(--sial-gallery-height, 2293) * var(--px)); }
.rz-galleria .rz-item{
  left:calc(var(--sial-x, 116) * var(--px));
  top:calc(var(--sial-y, 0) * var(--px));
  width:calc(var(--sial-w, 596) * var(--px));
  height:calc(var(--sial-h, 440) * var(--px));
}
/* Nell'editor il contenitore dei blocchi di WordPress forza position:relative. */
.rz-galleria .rz-item.block-editor-block-list__block,
.benv-foto.block-editor-block-list__block,
.benv-foto img.block-editor-block-list__block,
.sv-imb-foto img.block-editor-block-list__block{ position:absolute; }
@media (max-width:900px){
  .sv-imb-foto img.block-editor-block-list__block{ position:static; }
}
.rz-galleria:empty{ height:0; margin-block:0; }
.sec-rz{ display:flow-root; }
@media (max-width:900px){
  .rz-galleria{
    height:auto;
    grid-template-areas:none;
    grid-template-rows:clamp(112px,37vw,260px);
    grid-auto-rows:clamp(96px,31vw,220px);
  }
  .rz-galleria .rz-item[data-i]{
    grid-area:auto;
    grid-column:var(--sial-col);
    grid-row:var(--sial-row) / span var(--sial-span);
  }
}

/* Una didascalia nuova o più lunga resta contenuta nella tappa. */
@media (min-width:901px){
  /* Le misure originali diventano minimi: il testo può crescere senza coprire le foto. */
  .sv-scheda{ height:auto; min-height:calc(920 * var(--px)); padding-bottom:calc(29 * var(--px)); }
  .sv-imballaggio .sv-blocco{ height:auto; min-height:calc(674 * var(--px)); padding-bottom:calc(30 * var(--px)); }
  /* Le schede di Verniciatura crescono gia' col testo: 10-servizi-3.css. */
}
.timeline figure:nth-child(n+11){ --pill-x:100; --pill-y:525; --pill-w:610; --pill-h:90; --text-x:120; --text-y:535; --text-w:570; }
.timeline figcaption span{ overflow-wrap:anywhere; }
