/* Dynamic background (1.37.4; made on Corsi regionali in 1.37.2–1.37.3): white–cream–sand surface, darker beige corners,
   grain, two-level card shadows, all from variables. Loaded only on the pages of includes/sfondo-dinamico.php, website
   only, static (no animation, nothing changes with reduced motion). Each page names its surface element and places its
   own glows and bands with --pl-bg-extra (layers painted over the corners and the base) and the corner positions:
   - Corsi regionali (57): the post content; map halo, light streak and tonal bands in palladio-regione-lazio.css;
   - Workshop (61): the Workshop group; the bordeaux opening keeps its own background on top, so the corners and the
     base start under it; white halo behind the heading, gold glow behind the cards, deeper band toward the footer;
   - Specializzazioni (51): the stage of the scrolling cards only (.ps-stage). The sidebar keeps its stone, and the stage
     starts from that same stone at the shared edge, so there is no line. The stage already clips (overflow: hidden);
     nothing is set on the ancestors of the sticky .ps-pin.
   --pl-bg-intensity scales every tint, glow and corner at once (1 = values of page 57, 0 = flat base). */
body.page-id-57 .wp-block-post-content,
body.page-id-61 .palladio-workshop--pagina,
body.page-id-51 .palladio-specializations .ps-stage {
  --pl-bg-light: #fffdf9;
  --pl-bg-cream: #f3e9d8;
  --pl-bg-sand: #e6d6bd;
  --pl-bg-deep: #d9c4a3;
  --pl-glow-white: #ffffff;
  --pl-glow-gold: #f0d9a4;
  --pl-bg-intensity: 1;
  --pl-a: calc(var(--pl-bg-intensity) * 100%);
  --pl-corner-tr: 100% 0%;
  --pl-corner-bl: 0% 100%;
  /* Cards: a close sharp shadow and a far wide one (narrow variant where a container clips at the sides). */
  --pl-card-shadow: 0 1px 2px rgba(42, 33, 28, .1), 0 22px 26px -24px rgba(74, 20, 27, .45);
  --pl-card-shadow-wide: 0 1px 3px rgba(42, 33, 28, .1), 0 18px 40px -16px rgba(74, 20, 27, .22);
  /* Red for text right on this surface at intensity 1: the palette red (4.1:1 on the darkest point) toward
     bordeaux-deep, >= 4.5:1. Used on 51; 61 (intensity .45) keeps the palette red, 4.9:1. */
  --pl-red-on-bg: color-mix(in srgb, var(--wp--preset--color--palladio-red, #a8342a) 75%, var(--wp--preset--color--palladio-bordeaux-deep, #4a141b));
  position: relative; isolation: isolate;
  /* Base stops: plain cream and sand; a page with a lower intensity mixes them toward the light tone (see 61). */
  --pl-base-cream: var(--pl-bg-cream);
  --pl-base-sand: var(--pl-bg-sand);
  --pl-grain: .045;
  background-color: var(--pl-base-cream);
  background-image:
    var(--pl-bg-extra, none),
    radial-gradient(ellipse clamp(280px, 55vw, 760px) clamp(240px, 40vw, 560px) at var(--pl-corner-tr), color-mix(in srgb, var(--pl-bg-deep) calc(var(--pl-a) * .7), transparent) 0%, transparent 100%),
    radial-gradient(ellipse clamp(280px, 60vw, 820px) clamp(260px, 42vw, 600px) at var(--pl-corner-bl), color-mix(in srgb, var(--pl-bg-deep) calc(var(--pl-a) * .75), transparent) 0%, transparent 100%),
    linear-gradient(135deg, var(--pl-bg-light) 0%, var(--pl-base-cream) 50%, var(--pl-base-sand) 100%);
}
/* Glows that reach past the surface are clipped without making a scroll container (no effect on sticky). */
body.page-id-57 .wp-block-post-content,
body.page-id-61 .palladio-workshop--pagina { overflow-x: clip; }
/* Grain against the flat look and banding (multiply, 4.5%). The filter id lives inside the data URI, not in the page. */
body.page-id-57 .wp-block-post-content::before,
body.page-id-61 .palladio-workshop--pagina::before,
body.page-id-51 .palladio-specializations .ps-stage::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; opacity: var(--pl-grain); mix-blend-mode: multiply;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");
}

/* Workshop (61), lighter than 57 and 51 (1.37.5): a warm veil, the images and cards stay in front. The opening is
   about 200px high at every width: the top-right corner starts under it. Halo and band wider and softer, band toward
   the footer over the bottom 420px. */
body.page-id-61 .palladio-workshop--pagina {
  /* INTENSITY OF THIS PAGE: to make Workshop lighter or stronger change only this value (57 and 51 stay at 1). */
  --pl-bg-intensity: .45;
  --pl-base-cream: color-mix(in srgb, var(--pl-bg-cream) var(--pl-a), var(--pl-bg-light));
  --pl-base-sand: color-mix(in srgb, var(--pl-bg-sand) var(--pl-a), var(--pl-bg-light));
  --pl-grain: .02;
  --pl-corner-tr: 100% 200px;
  --pl-bg-extra:
    radial-gradient(ellipse clamp(320px, 56vw, 860px) clamp(220px, 28vw, 420px) at 18% 300px, color-mix(in srgb, var(--pl-glow-white) calc(var(--pl-a) * .85), transparent) 0%, transparent 100%),
    linear-gradient(180deg, transparent 0, transparent calc(100% - 420px), color-mix(in srgb, var(--pl-bg-sand) calc(var(--pl-a) * .35), transparent) 100%);
}
body.page-id-61 .palladio-workshop--pagina .pws-carte { position: relative; }
/* Gold glow behind the cards, white at its heart; painted under the cards, over the surface and the grain. */
body.page-id-61 .palladio-workshop--pagina .pws-carte::before {
  content: ""; position: absolute; inset: -24% -16%; z-index: -1; pointer-events: none;
  background:
    radial-gradient(closest-side at 50% 42%, color-mix(in srgb, var(--pl-glow-white) calc(var(--pl-a) * .7), transparent) 0%, transparent 80%),
    radial-gradient(closest-side at 50% 58%, color-mix(in srgb, var(--pl-glow-gold) calc(var(--pl-a) * .5), transparent) 0%, transparent 100%);
}
/* The image is the card's shape: one wide soft shadow, no close one (hover keeps its own, more specific). */
body.page-id-61 .palladio-workshop--pagina .pws-visual { box-shadow: 0 18px 44px -22px rgba(74, 20, 27, .16); }

/* Specializzazioni (51), stage only. From the left edge (the sidebar's stone) to the surface over 120–180px; white halo
   behind the deck, gold glow under it. */
body.page-id-51 .palladio-specializations .ps-stage {
  /* Gold glow (1.37.9): 38% weaker than before (.6 -> .37 of the gold), tint lightened toward the light cream, soft
     stops (100/62/22/0%). Fixed vertical radius: it is gone 360px (desktop, stage 803px) and 240px (one column, stage
     593px) above the bottom of the stage, so no edge shows where Corsi in tendenza begins.
   Bottom 160px: one flat sand (--ps-fondo-sabbia) under the stone fade of the left edge, and no grain, so Corsi in
   tendenza can start from the same colours at every width, with or without reduced motion (when the deck is not
   pinned the stage is several screens tall and its corner tints land elsewhere). */
  --ps-glow: color-mix(in srgb, color-mix(in srgb, var(--pl-glow-gold) 60%, var(--pl-bg-light)) calc(var(--pl-a) * .37), transparent);
  --ps-fondo-sabbia: #e4d4bb;
  --pl-bg-extra:
    linear-gradient(90deg, var(--ps-stone) 0, color-mix(in srgb, var(--ps-stone) 0%, transparent) clamp(120px, 12vw, 180px)),
    linear-gradient(0deg, var(--ps-fondo-sabbia) 0, color-mix(in srgb, var(--ps-fondo-sabbia) 0%, transparent) 160px),
    radial-gradient(closest-side at 50% 48%, color-mix(in srgb, var(--pl-glow-white) calc(var(--pl-a) * .85), transparent) 0%, transparent 100%),
    radial-gradient(ellipse 62% 190px at 50% 250px, var(--ps-glow) 0%, color-mix(in srgb, var(--ps-glow) 62%, transparent) 35%, color-mix(in srgb, var(--ps-glow) 22%, transparent) 65%, color-mix(in srgb, var(--ps-glow) 0%, transparent) 100%);
}
/* The grain (multiply) would darken the first pixels after the sidebar: it fades in over the same distance. */
body.page-id-51 .palladio-specializations .ps-stage::before {
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 clamp(120px, 12vw, 180px)), linear-gradient(180deg, #000 calc(100% - 160px), transparent);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(90deg, transparent 0, #000 clamp(120px, 12vw, 180px)), linear-gradient(180deg, #000 calc(100% - 160px), transparent);
  mask-composite: intersect;
}
body.page-id-51 .palladio-specializations .ps-frame { box-shadow: var(--pl-card-shadow-wide); }
body.page-id-51 .palladio-specializations .ps-controls button:not([aria-disabled="true"]) { color: var(--pl-red-on-bg); }
@media (max-width: 780px) {
  /* One column: the sidebar is above the stage, the edge is horizontal. */
  body.page-id-51 .palladio-specializations .ps-stage::before {
    -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 120px, #000 calc(100% - 160px), transparent); mask-image: linear-gradient(180deg, transparent 0, #000 120px, #000 calc(100% - 160px), transparent);
  }
  body.page-id-51 .palladio-specializations .ps-stage {
    --pl-bg-extra:
      linear-gradient(180deg, var(--ps-stone) 0, color-mix(in srgb, var(--ps-stone) 0%, transparent) 120px),
      linear-gradient(0deg, var(--ps-fondo-sabbia) 0, color-mix(in srgb, var(--ps-fondo-sabbia) 0%, transparent) 160px),
      radial-gradient(closest-side at 50% 48%, color-mix(in srgb, var(--pl-glow-white) calc(var(--pl-a) * .85), transparent) 0%, transparent 100%),
      radial-gradient(ellipse 75% 180px at 50% 170px, var(--ps-glow) 0%, color-mix(in srgb, var(--ps-glow) 62%, transparent) 35%, color-mix(in srgb, var(--ps-glow) 22%, transparent) 65%, color-mix(in srgb, var(--ps-glow) 0%, transparent) 100%);
  }
}
