/* Workshop (1.34.0, includes/workshop.php): Home section (.palladio-home--workshop), parent page 61 and area pages
   124/128. Loaded only where the section is, and in the editor. The pages also have "palladio-contatti": colors
   (--pct-*), base type and the bordeaux opening come from palladio-contatti.css. Colors: direction A (README,
   "Regola dei colori"). Motion only on the website (.wp-site-blocks); the entrance is timed, started once by
   assets/palladio-workshop.js (1.34.1, see the end of this file): without JS or with reduced motion the cards are
   still and visible. */
.palladio-workshop {
  --pws-white: var(--wp--preset--color--base, #ffffff);
  --pws-ink: var(--wp--preset--color--palladio-ink-warm, #2a211c);
  --pws-secondary: var(--wp--preset--color--palladio-text-secondary, #5a4a3f);
  --pws-bordeaux: var(--wp--preset--color--palladio-bordeaux, #6b1d23);
  --pws-deep: var(--wp--preset--color--palladio-bordeaux-deep, #4a141b);
  --pws-red: var(--wp--preset--color--palladio-red, #a8342a);
  --pws-line: var(--wp--preset--color--palladio-line, #e7ded2);
  --pws-gold: #e8c46a;
  --pws-visual: 290px;
}
.palladio-home.palladio-home--workshop { background: var(--pws-white); }

/* Cards: three in a row, staggered 0 / 48 / 96 px (repeats every three cards). Not the numbered cards of
   Corsi regionali: no box, the image is the shape, text on the section background. */
.palladio-workshop .pws-carte { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; align-items: start; }
.palladio-workshop .pws-carte > :nth-child(3n+2) { margin-top: 48px; }
.palladio-workshop .pws-carte > :nth-child(3n) { margin-top: 96px; }
.palladio-workshop .pws-carte > :nth-child(3n+1) { margin-top: 0; }
.palladio-workshop .pws-carta { position: relative; display: grid; gap: 20px; min-width: 0; }
.palladio-workshop.palladio-workshop .pws-carta :where(h3, p, figure, .wp-block-group) { margin-block: 0; }

/* Image: bordeaux placeholder with a large gold icon (--pws-icon, class pws-icona-* on the card). A photo chosen
   in the Image block covers it; with a photo the icon is not drawn. */
.palladio-workshop .pws-visual {
  position: relative; isolation: isolate; height: var(--pws-visual); overflow: hidden;
  border-radius: 80px 16px 16px 16px; background: linear-gradient(150deg, var(--pws-bordeaux), var(--pws-deep));
}
.palladio-workshop .pws-visual::after {
  content: ""; position: absolute; inset: 0; margin: auto; width: 112px; height: 112px;
  background: var(--pws-gold); mask: var(--pws-icon) center / contain no-repeat;
}
.palladio-workshop .pws-visual:has(.pws-foto img[src])::after { content: none; }
.palladio-workshop .pws-foto { position: absolute; inset: 0; z-index: 1; }
.palladio-workshop .pws-foto img { display: block; width: 100%; height: 100%; object-fit: cover; }
.palladio-workshop.palladio-workshop .pws-etichetta {
  position: absolute; top: 26px; left: 34px; z-index: 2; padding: 5px 12px; border-radius: 999px;
  background: var(--pws-gold); color: var(--pws-deep); font-size: .75rem; font-weight: 700; line-height: 1.4; letter-spacing: .12em; text-transform: uppercase;
}
/* Editor: the empty Image block shows its upload controls at the bottom of the placeholder. */
.editor-styles-wrapper .palladio-workshop .pws-foto:not(:has(img[src])) { inset: auto 12px 12px; }

.palladio-workshop .pws-testo { display: grid; gap: 8px; padding-inline: 4px; }
.palladio-workshop .pws-carta h3 { color: var(--pws-ink); font-size: clamp(1.25rem, 1.9vw, 1.5rem); }
.palladio-workshop.palladio-workshop .pws-dati { color: var(--pws-secondary); font-size: .9rem; }
.palladio-workshop.palladio-workshop .pws-link { margin-top: 6px; font-size: .95rem; font-weight: 700; }
.palladio-workshop .pws-link a { color: var(--pws-red); text-decoration: none; }
.palladio-workshop .pws-link a:hover { text-decoration: underline; text-underline-offset: 3px; }
.palladio-workshop .pws-link a::after { content: "→" / ""; display: inline-block; margin-left: .4em; transition: transform .3s ease; }
.palladio-workshop .pws-link--esterno a::after { content: none; }
/* Website: the whole card opens its link. */
.wp-site-blocks .palladio-workshop .pws-link a::before { content: ""; position: absolute; inset: 0; z-index: 3; }

/* Pages 61, 124, 128. */
.palladio-workshop--pagina { --pws-section: clamp(48px, 7vw, 80px); }
.palladio-workshop--pagina .pct-testa::before, .palladio-workshop--pagina .pct-testa::after { grid-row: 1; }
.palladio-workshop.palladio-contatti .pct-apertura h1 { align-self: center; }
.palladio-workshop.palladio-contatti .pct-testa > .pct-intro { margin-top: 0; }
.palladio-workshop--pagina .pws-sezione { display: grid; gap: 28px; padding-block: var(--pws-section); }
.palladio-workshop--pagina .pws-sezione > h2 { font-size: clamp(26px, 3.6vw, 38px); }
.palladio-workshop--pagina .pws-carte { padding-bottom: 24px; }

/* Area pages: one row per workshop, data on the right. */
.palladio-workshop .pws-elenco { display: grid; border: 1px solid var(--pws-line); border-radius: 20px; background: var(--pws-white); overflow: hidden; }
.palladio-workshop .pws-voce { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr); gap: 12px 32px; align-items: center; padding: 24px clamp(18px, 3vw, 32px); }
.palladio-workshop .pws-voce + .pws-voce { border-top: 1px solid var(--pws-line); }
.palladio-workshop .pws-voce h3 { font-size: 20px; }
.palladio-workshop .pws-voce h3 a { color: var(--pws-red); text-decoration: none; }
.palladio-workshop .pws-voce h3 a::after { content: " →" / ""; }
.palladio-workshop .pws-voce h3 a:hover { text-decoration: underline; text-underline-offset: 3px; }
.palladio-workshop .pws-voce-dati { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px 20px; }
.palladio-workshop.palladio-workshop .pws-dato { display: grid; gap: 2px; color: var(--pws-secondary); font-size: 15px; }
.palladio-workshop .pws-dato strong { color: var(--pws-ink); font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }

/* Closing bordeaux band. */
.palladio-workshop .pws-chiusura { padding-block: clamp(40px, 6vw, 64px); background: linear-gradient(145deg, var(--pws-bordeaux), var(--pws-deep)); color: var(--wp--preset--color--palladio-cream, #faf7f2);
  --palladio-focus-text: var(--pws-gold); --palladio-focus-fill: var(--pws-gold); --palladio-focus-on-fill: var(--pws-deep); }
.palladio-workshop .pws-chiusura h2 { font-size: clamp(24px, 3vw, 32px); }
.palladio-workshop .pws-chiusura-wrap { display: flex; flex-wrap: wrap; gap: 20px 32px; align-items: center; justify-content: space-between; }
.palladio-workshop.palladio-workshop .pws-azioni { margin: 0; }
.palladio-workshop .pws-azione-chiara .wp-block-button__link {
  display: inline-flex; align-items: center; min-height: 48px; padding: 12px 28px; border-radius: 999px;
  background: var(--wp--preset--color--palladio-cream, #faf7f2); color: var(--pws-deep); font-size: 16px; font-weight: 700; text-decoration: none;
}
.palladio-workshop .pws-azione-chiara .wp-block-button__link:hover { background: var(--pws-white); color: var(--pws-deep); }

@media (max-width: 960px) {
  .palladio-workshop .pws-voce { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
  .palladio-workshop { --pws-visual: 220px; }
  .palladio-workshop .pws-carte { grid-template-columns: minmax(0, 1fr); gap: 40px; }
  .palladio-workshop .pws-carte > .pws-carta { margin-top: 0; }
  .palladio-workshop .pws-visual::after { width: 88px; height: 88px; }
  .palladio-workshop .pws-voce-dati { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Hover and keyboard focus (website only): the card lifts, the big corner softens, the icon turns, the arrow
   slides. Hover uses transform; the entrance below uses translate/scale/rotate, so the two do not override each other. */
@media (prefers-reduced-motion: no-preference) {
  .wp-site-blocks .palladio-workshop .pws-carta { transition: transform .35s ease; }
  .wp-site-blocks .palladio-workshop .pws-visual { transition: border-radius .35s ease, box-shadow .35s ease; }
  .wp-site-blocks .palladio-workshop .pws-visual::after { transition: transform .35s ease; }
  .wp-site-blocks .palladio-workshop .pws-carta:is(:hover, :has(a:focus-visible)) { transform: translateY(-8px); }
  .wp-site-blocks .palladio-workshop .pws-carta:is(:hover, :has(a:focus-visible)) .pws-visual { border-top-left-radius: 16px; box-shadow: 0 22px 40px -24px color-mix(in srgb, var(--pws-deep) 70%, transparent); }
  .wp-site-blocks .palladio-workshop .pws-carta:is(:hover, :has(a:focus-visible)) .pws-visual::after { transform: scale(1.12) rotate(4deg); }
  .wp-site-blocks .palladio-workshop .pws-carta:is(:hover, :has(a:focus-visible)) .pws-link a::after { transform: translateX(6px); }
}
@media (prefers-reduced-motion: reduce) {
  .palladio-workshop .pws-link a::after { transition: none; }
}

/* Entrance (1.34.1), once, timed: assets/palladio-workshop.js. The hidden start state applies only while
   html.pws-js is set (a head script sets it with motion allowed and IntersectionObserver available, and removes it
   at load if the main script did not run): without JS, if the script fails or with reduced motion the cards are
   static and complete. When a group of cards is 15% in view the script adds .is-visible (after a frame, so cards
   already in the first screen start from a clean hidden state): the card rises 70 px and fades in, the image
   uncovers from the bottom, then the icon turns and grows. Cascade: --i (card index, set by the script) × .18 s. */
@media (prefers-reduced-motion: no-preference) {
  .pws-js .wp-site-blocks .palladio-workshop .pws-carta {
    --pws-durata: .9s; --pws-curva: cubic-bezier(.2, .8, .2, 1); --pws-ritardo: calc(var(--i, 0) * .18s);
    transition: transform .35s ease, opacity var(--pws-durata) var(--pws-curva) var(--pws-ritardo), translate var(--pws-durata) var(--pws-curva) var(--pws-ritardo);
  }
  .pws-js .wp-site-blocks .palladio-workshop .pws-visual {
    clip-path: inset(-48px);
    transition: border-radius .35s ease, box-shadow .35s ease, clip-path var(--pws-durata) var(--pws-curva) calc(var(--pws-ritardo) + .12s);
  }
  .pws-js .wp-site-blocks .palladio-workshop .pws-visual::after {
    transition: transform .35s ease, opacity var(--pws-durata) var(--pws-curva) calc(var(--pws-ritardo) + .3s), scale var(--pws-durata) var(--pws-curva) calc(var(--pws-ritardo) + .3s), rotate var(--pws-durata) var(--pws-curva) calc(var(--pws-ritardo) + .3s);
  }
  .pws-js .wp-site-blocks .palladio-workshop .pws-carte:not(.is-visible) > .pws-carta { opacity: 0; translate: 0 70px; }
  .pws-js .wp-site-blocks .palladio-workshop .pws-carte:not(.is-visible) .pws-visual { clip-path: inset(100% 0 0 0); }
  .pws-js .wp-site-blocks .palladio-workshop .pws-carte:not(.is-visible) .pws-visual::after { opacity: 0; scale: .6; rotate: -12deg; }
}

/* Page 61 under the cards (1.37.6, includes/workshop.php, workshop_page_sezioni()): existing components on the
   dynamic background. Sections in a row share one spacing; no entrance animation (the timed entrance belongs to
   .pws-carte). */
.palladio-workshop--pagina .pws-sezione + .pws-sezione { padding-top: 0; }
/* Prossimi workshop (Fase 2, 27/10/2026): the links to the area pages under the title, outlined red pills with the arrow
   of the area cards; filled on hover. At least 44px tall; they wrap on narrow screens. */
.palladio-workshop--pagina .pws-sezione > .pws-aree-link { display: flex; flex-wrap: wrap; gap: 12px; margin: -8px 0 0; padding: 0; list-style: none; }
.palladio-workshop--pagina .pws-aree-link li { margin: 0; }
.palladio-workshop--pagina .pws-aree-link a {
  display: inline-flex; align-items: center; min-height: 44px; padding: 8px 20px; border: 1.5px solid var(--pws-red); border-radius: 999px;
  color: var(--pws-red); font-size: .95rem; font-weight: 700; text-decoration: none; transition: background-color .2s, color .2s;
}
.palladio-workshop--pagina .pws-aree-link a::after { content: "→" / ""; display: inline-block; margin-left: .5em; transition: transform .2s; }
.palladio-workshop--pagina .pws-aree-link a:hover { background: var(--pws-red); color: var(--pws-white); }
.palladio-workshop--pagina .pws-aree-link a:hover::after { transform: translateX(3px); }
@media (prefers-reduced-motion: reduce) {
  .palladio-workshop--pagina .pws-aree-link a, .palladio-workshop--pagina .pws-aree-link a::after { transition: none; }
}
/* Come funziona: the numbered steps of Richiedi informazioni (pct-passi), three in a row. */
.palladio-workshop--pagina .pws-passi { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px 32px; }
.palladio-workshop--pagina .pws-passi li { padding-left: 54px; font-size: 16px; line-height: 1.55; }
.palladio-workshop--pagina .pws-passi strong { display: inline-block; margin-bottom: 4px; font-size: 18px; }
.palladio-workshop--pagina .pws-passi a { color: var(--pws-red); text-underline-offset: 3px; }
/* Punti di forza: the Home trust bar with three items, on the page background. */
.palladio-workshop--pagina .palladio-top.pws-valori { max-width: 1120px; margin-inline: auto; padding: 0 var(--pct-gap); background: none; }
.palladio-workshop--pagina .pws-valori .palladio-trust-bar { max-width: none; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.palladio-workshop--pagina .pws-valori .palladio-trust-item { justify-content: center; }
/* Workshop o corso?: two white cards, button at the bottom. */
.palladio-workshop--pagina .pws-confronto { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
.palladio-workshop--pagina .pws-scelta {
  display: flex; flex-direction: column; gap: 12px; padding: clamp(24px, 3vw, 36px); border-radius: 20px;
  background: var(--pws-white); color: var(--pws-secondary); box-shadow: var(--pl-card-shadow-wide, 0 18px 40px -16px rgba(74, 20, 27, .22));
}
.palladio-workshop--pagina .pws-scelta h3 { color: var(--pws-ink); font-size: clamp(1.25rem, 1.9vw, 1.5rem); }
.palladio-workshop--pagina .pws-scelta .palladio-card-cta { margin-top: auto; padding-top: 12px; }
/* Closing: the band of the area pages as a box inside the page width. */
.palladio-workshop--pagina .pws-chiusura--riquadro { padding-inline: clamp(24px, 4vw, 48px); border-radius: 20px; }
.palladio-workshop .pws-chiusura--riquadro .pws-azioni { gap: 12px 16px; }
.palladio-workshop .pws-azione-contorno .wp-block-button__link {
  display: inline-flex; align-items: center; min-height: 48px; padding: 10px 26px; border: 2px solid var(--wp--preset--color--palladio-cream, #faf7f2); border-radius: 999px;
  background: transparent; color: var(--wp--preset--color--palladio-cream, #faf7f2); font-size: 16px; font-weight: 700; text-decoration: none;
}
.palladio-workshop .pws-azione-contorno .wp-block-button__link:hover { background: var(--wp--preset--color--palladio-cream, #faf7f2); color: var(--pws-deep); }
/* Up to 1100px the Home bar switches to six tracks (3 + 2 items): here the three items stay in one row. */
@media (max-width: 1100px) {
  .palladio-workshop--pagina .pws-valori .palladio-trust-bar { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; }
  .palladio-workshop--pagina .pws-valori .palladio-trust-item { grid-column: auto; justify-content: flex-start; padding: 4px 16px; }
  .palladio-workshop--pagina .pws-valori .palladio-trust-item:first-child { padding-left: 0; }
}
@media (max-width: 760px) {
  .palladio-workshop--pagina .pws-passi, .palladio-workshop--pagina .pws-confronto { grid-template-columns: minmax(0, 1fr); }
  .palladio-workshop--pagina .pws-valori .palladio-trust-bar { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .palladio-workshop--pagina .pws-valori .palladio-trust-item { flex-direction: row; text-align: left; padding: 0; border: 0; }
  .palladio-workshop .pws-chiusura--riquadro .pws-azioni, .palladio-workshop .pws-chiusura--riquadro .pws-azioni .wp-block-button { width: 100%; }
  .palladio-workshop .pws-chiusura--riquadro .pws-azioni .wp-block-button__link { justify-content: center; width: 100%; }
}

/* Light Palladio logo above the title, as on the "Parla con noi" bands (palladio-corso.css): 40px tall, 16px below,
   34px under 760px; fixed size (no layout shift), decorative pseudo-element (no text). */
.palladio-workshop .pws-chiusura h2::before { content: ""; display: block; width: calc(40px * 350 / 182.8); height: 40px; margin-bottom: 16px; background: url("images/scuola-palladio-logo-chiaro.svg") left center / contain no-repeat; }
@media (max-width: 760px) { .palladio-workshop .pws-chiusura h2::before { width: calc(34px * 350 / 182.8); height: 34px; } }
/* Workshop page box band only: more room under the logo (28px, 22px under 760px) and the gold speech bubble of the
   "Parla con noi" bands (--pc-cta-disegno, cta_contatto_css() in includes/corsi-regionali.php, added inline by
   includes/workshop.php) behind the buttons, cut by the bottom right edge. Decorative, no pointer events, never under
   the title; in the corner and smaller under 1024px, hidden under 760px (full width buttons). */
.palladio-workshop .pws-chiusura--riquadro { position: relative; isolation: isolate; }
.palladio-workshop .pws-chiusura--riquadro h2::before { margin-bottom: 28px; }
.palladio-workshop .pws-chiusura--riquadro::after {
  content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; pointer-events: none;
  background: var(--pws-gold); opacity: .16;
  mask: var(--pc-cta-disegno) right -90px bottom -150px / 440px 440px no-repeat;
}
@media (max-width: 1023px) {
  .palladio-workshop .pws-chiusura--riquadro::after { mask-position: right -56px bottom -64px; mask-size: 210px 210px; }
}
@media (max-width: 760px) {
  .palladio-workshop .pws-chiusura--riquadro h2::before { margin-bottom: 22px; }
  .palladio-workshop .pws-chiusura--riquadro::after { display: none; }
}
