/* Docenti e ATA (page 60), framework from riferimenti/palladio-docenti-ata-framework.html: same layout, sizes and
   behavior, colors from the palette (README, "Regola dei colori"). Loaded only where the section is, and in the editor.
   The draft's line and placeholder greys (#c5b7a9, #d7cabe) are palette colors with transparency. */
/* Fallback shown until the theme's Manrope loads: local Arial scaled to Manrope's width (regular +2.8%, tuned so the
   opening paragraph breaks into the same lines from 296 to 544px except at 347 and 460-462; bold equal) and with
   Manrope's ascent/descent (1.066/0.300 of the size, overrides divided by size-adjust), so nothing below the opening
   paragraph moves when the font swaps (CLS at 390 was 0.03). */
@font-face { font-family: "Palladio Manrope fallback"; src: local("Arial"), local("ArialMT"); font-weight: 200 500; size-adjust: 102.8%; ascent-override: 103.7%; descent-override: 29.18%; line-gap-override: 0%; }
@font-face { font-family: "Palladio Manrope fallback"; src: local("Arial Bold"), local("Arial-BoldMT"); font-weight: 600 800; size-adjust: 100%; ascent-override: 106.6%; descent-override: 30%; line-gap-override: 0%; }
.palladio-docenti-ata {
  --da-cream: var(--wp--preset--color--palladio-cream, #faf7f2);
  --da-stone: var(--wp--preset--color--palladio-stone, #f1e9de);
  --da-white: var(--wp--preset--color--base, #ffffff);
  --da-ink: var(--wp--preset--color--palladio-ink-warm, #2a211c);
  --da-secondary: var(--wp--preset--color--palladio-text-secondary, #5a4a3f);
  --da-bordeaux: var(--wp--preset--color--palladio-bordeaux, #6b1d23);
  --da-deep: var(--wp--preset--color--palladio-bordeaux-deep, #4a141b);
  --da-red: var(--wp--preset--color--palladio-red, #a8342a);
  --da-gold: var(--wp--preset--color--palladio-gold-light, #e6c98a);
  --da-line: color-mix(in srgb, var(--wp--preset--color--palladio-border-strong, #7d6858) 45%, transparent);
  --da-placeholder: color-mix(in srgb, var(--wp--preset--color--palladio-stone-deep, #c9b8a4) 70%, transparent);
  --da-placeholder-dark: color-mix(in srgb, var(--wp--preset--color--palladio-cream, #faf7f2) 22%, transparent);
  /* Titles (1.18.0): heading font of theme.json; tracking -0.03em, -0.02em under 24px. */
  --da-heading-font: var(--wp--preset--font-family--palladio-heading, 'Plus Jakarta Sans', system-ui, sans-serif);
  --da-heading-tracking: clamp(-.03em, calc(-.02em - (1em - 23.9px) * 2.4), -.02em);
  --da-sans: Manrope, "Palladio Manrope fallback", sans-serif;
  /* Lucide arrows and plus (ISC), drawn as masks in the text color. */
  --da-arrow-down: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v14'/%3E%3Cpath d='m19 12-7 7-7-7'/%3E%3C/svg%3E");
  --da-arrow-corner: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 7 10 10'/%3E%3Cpath d='M17 7v10H7'/%3E%3C/svg%3E");
  --da-plus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='M12 5v14'/%3E%3C/svg%3E");
  --da-gap: 32px;
  background: var(--da-cream);
  color: var(--da-ink);
  font-family: var(--da-sans);
  font-size: 16px;
  font-weight: 400;
  letter-spacing: normal;
  line-height: normal;
}
.palladio-docenti-ata, .palladio-docenti-ata *, .palladio-docenti-ata *::before, .palladio-docenti-ata *::after { box-sizing: border-box; }
.palladio-docenti-ata.palladio-docenti-ata :where(h1,h2,h3,p,ul,li,details,.wp-block-group,.wp-block-buttons,.wp-block-button,.wp-block-spacer) { margin-block: 0; }
.palladio-docenti-ata :where(h1,h2,h3) { color: inherit; font-family: var(--da-heading-font); font-weight: 700; line-height: 1.08; letter-spacing: var(--da-heading-tracking); }
.palladio-docenti-ata [id] { scroll-margin-top: 16px; }

/* Opening. */
.palladio-docenti-ata .palladio-da-hero { padding: 52px var(--da-gap) 46px; background: linear-gradient(145deg, var(--da-bordeaux), var(--da-deep)); color: var(--da-cream); }
/* Opening as a native Cover (1.18.1): library photo under a bordeaux veil set in the block (dim 80). Keeps the old
   padding instead of the Cover's 430px minimum, content aligned top-left; 460px (380px on phones) so that the desks of
   the 21:9 photo show whole. */
.palladio-docenti-ata .palladio-da-hero.wp-block-cover { min-height: 460px; padding: 52px var(--da-gap) 46px; align-items: flex-start; justify-content: flex-start; }
@media (max-width: 600px) { .palladio-docenti-ata .palladio-da-hero.wp-block-cover { min-height: 380px; } }
.palladio-docenti-ata .palladio-da-hero h1 { margin: 18px 0 24px; font-size: clamp(30.24px, 5.544vw, 46.2px); overflow-wrap: anywhere; }
/* Readable measure (~65 characters) for the opening paragraph and the paragraph of a plain section (Roma e
   Frosinone); in em, not ch, so the width doesn't change with the fallback font. */
.palladio-docenti-ata :is(.palladio-da-hero .wp-block-cover__inner-container, .palladio-da-section) > p:not(.palladio-da-eyebrow) { max-width: 34em; }
/* Body line height (R-16): 1.5 instead of the inherited normal (1.2 or so, depending on the font in use). */
.palladio-docenti-ata :is(.palladio-da-hero .wp-block-cover__inner-container, .palladio-da-section) p:not(.palladio-da-eyebrow, .palladio-da-course p, .palladio-da-details p) { line-height: 1.5; }
.palladio-docenti-ata .palladio-da-eyebrow { font-size: .75rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--da-red); }
.palladio-docenti-ata :is(.palladio-da-hero, .palladio-da-closing) .palladio-da-eyebrow { color: var(--da-gold); }
.palladio-docenti-ata .palladio-da-section h2 { margin-top: 12px; font-size: clamp(24.36px, 4.032vw, 31.92px); }

/* Text still to be written: Spacers drawn as lines. Margins at three classes, or the layout rules of WordPress
   (`.is-layout-flow > :last-child`) would cancel them. */
.palladio-docenti-ata .palladio-da-righe { display: grid; gap: 9px; max-width: 360px; }
.palladio-docenti-ata :is(.palladio-da-hero, .palladio-da-section) .palladio-da-righe { margin: 20px 0; }
.palladio-docenti-ata .palladio-da-riga { width: auto; border-radius: 5px; background: var(--da-placeholder); }
.palladio-docenti-ata .palladio-da-riga:last-child { width: 72%; }
.palladio-docenti-ata :is(.palladio-da-hero, .palladio-da-closing) .palladio-da-riga { background: var(--da-placeholder-dark); }

/* Buttons: light on bordeaux; an arrow pointing down only for a link inside the page (no up-and-out arrow, 1.37.22). */
.palladio-docenti-ata .palladio-da-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 22px; margin-top: 28px; }
.palladio-docenti-ata .palladio-da-actions .wp-block-button__link { display: inline-flex; align-items: center; min-height: 44px; border: 0; color: var(--da-cream); font: 400 13px/normal var(--da-sans); letter-spacing: normal; text-align: left; }
.palladio-docenti-ata .palladio-da-actions .wp-block-button__link[href^="#"]::after { content: ""; flex: none; width: 18px; height: 18px; background: currentColor; mask: var(--da-arrow-down) center / contain no-repeat; }
.palladio-docenti-ata .palladio-da-button .wp-block-button__link { justify-content: center; gap: 12px; padding: 13px 18px; border-radius: 8px; background: var(--da-cream); color: var(--da-deep); font-weight: 500; text-decoration: none; }
.palladio-docenti-ata .palladio-da-button .wp-block-button__link:hover { background: var(--da-white); color: var(--da-deep); }
.palladio-docenti-ata .palladio-da-link .wp-block-button__link { padding: 0; border-radius: 0; background: none; text-decoration: underline; text-underline-offset: 5px; }
.palladio-docenti-ata .palladio-da-link .wp-block-button__link:hover { background: none; color: var(--da-white); }

/* Profile choice: two cards, anchor links to the catalogs; the active one (first without the script, then the one
   chosen, aria-current) is white with the red line. */
.palladio-docenti-ata .palladio-da-section { padding: 40px var(--da-gap); }
.palladio-docenti-ata .palladio-da-profiles { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 24px; }
.palladio-docenti-ata .palladio-da-profile { position: relative; display: block; width: auto; }
.palladio-docenti-ata .palladio-da-profile .wp-block-button__link {
  display: grid; grid-template-columns: 25px minmax(0, 1fr) 18px; align-content: center; align-items: center; column-gap: 14px;
  width: 100%; height: 100%; padding: 22px 18px; border: 1px solid var(--da-line); border-radius: 12px;
  background: var(--da-stone); color: var(--da-ink); font: 700 21.84px/1.1 var(--da-heading-font); letter-spacing: var(--da-heading-tracking);
  text-align: left; text-decoration: none; word-break: normal; overflow-wrap: anywhere;
}
.palladio-docenti-ata .palladio-da-profile .wp-block-button__link::before { content: ""; grid-column: 1; grid-row: 1 / span 2; width: 25px; height: 25px; background: var(--da-red); mask: var(--palladio-da-icon) center / contain no-repeat; }
.palladio-docenti-ata .palladio-da-profile .wp-block-button__link::after { content: ""; grid-column: 2; grid-row: 2; width: 70%; height: 5px; margin-top: 12px; border-radius: 3px; background: var(--da-placeholder); }
.palladio-docenti-ata .palladio-da-profile::after { content: ""; position: absolute; top: 50%; right: 19px; width: 18px; height: 18px; margin-top: -9px; background: var(--da-ink); mask: var(--da-arrow-corner) center / contain no-repeat; pointer-events: none; }
.palladio-docenti-ata:not([data-palladio-selector]) .palladio-da-profile:first-child .wp-block-button__link,
.palladio-docenti-ata .palladio-da-profile .wp-block-button__link[aria-current="true"] { border-color: var(--da-red); background: var(--da-white); box-shadow: inset 0 3px var(--da-red); }

/* Catalogs: one per profile, one under the other. */
.palladio-docenti-ata .palladio-da-panel { padding-top: 12px; }
.palladio-docenti-ata .palladio-da-heading-row { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 15px; }
.palladio-docenti-ata .palladio-da-caption { font-size: .75rem; color: var(--da-secondary); }
.palladio-docenti-ata .palladio-da-courses { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 25px; }
/* A catalog with two cards (ATA): same width as the three-card ones, centered instead of an empty third column. */
@media (min-width: 561px) {
  .palladio-docenti-ata .palladio-da-courses:has(> .palladio-da-course:nth-child(2):last-child) { grid-template-columns: repeat(2, minmax(0, calc((100% - 28px) / 3))); justify-content: center; }
}
.palladio-docenti-ata .palladio-da-course { display: flex; flex-direction: column; padding: 20px 16px 10px; border: 1px solid var(--da-line); border-radius: 12px; background: var(--da-white); }
.palladio-docenti-ata .palladio-da-course-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 27px; font-size: .75rem; color: var(--da-secondary); }
.palladio-docenti-ata .palladio-da-category { color: var(--da-bordeaux); letter-spacing: .07em; text-transform: uppercase; }
.palladio-docenti-ata .palladio-da-course h3 { font-size: 22.68px; line-height: 1.1; }
.palladio-docenti-ata .palladio-da-course .palladio-da-righe { margin: 20px 0 26px; }
.palladio-docenti-ata .palladio-da-tags { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 17px; font-size: .75rem; color: var(--da-secondary); }
/* Course cards linked to their page (2C-2): short description, then the link at the bottom of the card. */
.palladio-docenti-ata .palladio-da-course .palladio-da-descrizione { margin: 16px 0 22px; font-size: 1rem; line-height: 1.55; color: var(--da-secondary); }
.palladio-docenti-ata .palladio-da-course .palladio-da-segnaposto { font-style: italic; }
.palladio-docenti-ata .palladio-da-course .palladio-da-tags { margin-top: auto; }
.palladio-docenti-ata .palladio-da-course-link { border-top: 1px solid var(--da-line); font-size: 13px; font-weight: 600; }
.palladio-docenti-ata .palladio-da-course-link:not(.palladio-card-cta) a { display: flex; align-items: center; justify-content: space-between; min-height: 44px; padding: 10px 0; color: var(--da-bordeaux); text-decoration: none; }
.palladio-docenti-ata .palladio-da-course-link:not(.palladio-card-cta) a:hover { color: var(--da-red); text-decoration: underline; text-underline-offset: 5px; }
/* "Scopri il corso" as a full-width button (1.35.2), only on the groups with the --cta modifier; since 1.36.0 the
   shared palladio-card-cta palladio-card-cta--md button (palladio-card-cta.css), without arrow (1.37.22).
   No separator line, the button is the card's footer. The placeholder card has no link, so it gets no button. */
.palladio-docenti-ata .palladio-da-courses--cta .palladio-da-course-link { margin-top: 16px; border-top: 0; }
.palladio-docenti-ata .palladio-da-courses--cta .palladio-da-course { padding-bottom: 16px; }
.palladio-docenti-ata .palladio-card-cta > a::after { content: none; }
/* Buttons of a row on one line (R-15): the description takes the free height of the card, so the button (and the
   «Durata» row, when there is one) sits at the bottom of every card, however long the text is. */
.palladio-docenti-ata .palladio-da-courses--cta .palladio-da-course .palladio-da-descrizione { flex-grow: 1; }
/* ATA catalog (28/10/2026): the button at the bottom of every card, at the same height as in the card with the
   «Durata» row (whose row already takes the free space with margin-top: auto). */
.palladio-docenti-ata #ata .palladio-da-course:not(:has(.palladio-da-tags)) .palladio-da-course-link { margin-top: auto; }
/* Three columns of narrow cards (under ~260px, viewport 561-880px): the small size. */
@media (min-width: 561px) and (max-width: 880px) {
  .palladio-docenti-ata .palladio-da-courses--cta .palladio-card-cta { --palladio-card-cta-height: 44px; --palladio-card-cta-size: 14px; --palladio-card-cta-padding: 14px; }
}

/* Expandable details (native Details block): course information and useful information. */
.palladio-docenti-ata .palladio-da-details { border-top: 1px solid var(--da-line); }
.palladio-docenti-ata .palladio-da-details summary { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 44px; padding: 14px 0; font-size: 1rem; list-style: none; cursor: pointer; }
.palladio-docenti-ata .palladio-da-details summary::-webkit-details-marker { display: none; }
.palladio-docenti-ata .palladio-da-details summary::after { content: ""; flex: none; width: 18px; height: 18px; background: currentColor; mask: var(--da-plus) center / contain no-repeat; }
.palladio-docenti-ata .palladio-da-details[open] summary::after { transform: rotate(45deg); }
.palladio-docenti-ata .palladio-da-details :where(p, li) { font-size: 1rem; line-height: 1.6; color: var(--da-secondary); }
.palladio-docenti-ata .palladio-da-details[open] > :last-child { margin-bottom: 15px; }
/* Open item (1.18.0): 12px between the item and its first line, so that nothing of the opened text sits under the
   item or under its keyboard underline. */
.palladio-docenti-ata .palladio-da-details > summary + * { margin-top: 12px; }
.palladio-docenti-ata .palladio-da-facts { padding: 0; list-style: none; }

/* Useful information. */
.palladio-docenti-ata .palladio-da-info { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; background: var(--da-stone); }
.palladio-docenti-ata .palladio-da-info-list { align-self: center; }
.palladio-docenti-ata .palladio-da-info-list .palladio-da-details:last-child { border-bottom: 1px solid var(--da-line); }
.palladio-docenti-ata .palladio-da-info-list summary { padding: 20px 0; }

/* Closing band. */
.palladio-docenti-ata .palladio-da-closing { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 25px; background: var(--da-bordeaux); color: var(--da-cream); }
.palladio-docenti-ata .palladio-da-closing .palladio-da-actions { flex: none; margin-top: 0; }

/* Focus: palladio-focus.css of the child theme (profile cards and catalogs included). Light gold on the bordeaux opening and
   band, where red stays under 3:1; the default red elsewhere. */
.palladio-docenti-ata :is(.palladio-da-hero, .palladio-da-closing) { --palladio-focus-text: var(--da-gold); --palladio-focus-fill: var(--da-gold); --palladio-focus-on-fill: var(--da-deep); }

@media (max-width: 560px) {
  .palladio-docenti-ata { --da-gap: 22px; }
  .palladio-docenti-ata :is(.palladio-da-profiles, .palladio-da-courses), .palladio-docenti-ata .palladio-da-info { grid-template-columns: minmax(0, 1fr); }
  .palladio-docenti-ata .palladio-da-closing { flex-direction: column; align-items: flex-start; }
  .palladio-docenti-ata .palladio-da-section { padding-top: 30px; padding-bottom: 30px; }
  .palladio-docenti-ata .palladio-da-panel { padding-top: 12px; }
  .palladio-docenti-ata .palladio-da-course-top { margin-bottom: 18px; }
}

/* Without JavaScript the header never becomes compact: it stays 132px tall (160px up to 480px) instead of the 65px
   of --palladio-header-offset (scroll-padding-top), so the catalogs reached from the cards would stop under it. */
@media (scripting: none) {
  .palladio-docenti-ata [id] { scroll-margin-top: calc(132px - 65px + 16px); }
}
@media (scripting: none) and (max-width: 480px) {
  .palladio-docenti-ata [id] { scroll-margin-top: calc(160px - 65px + 16px); }
}

/* Editor: the section fills the canvas; both catalogs are visible there. */
.editor-styles-wrapper .palladio-docenti-ata { width: 100%; max-width: none; }

/* 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-docenti-ata .palladio-da-closing > .wp-block-group:first-child::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-docenti-ata .palladio-da-closing > .wp-block-group:first-child::before { width: calc(34px * 350 / 182.8); height: 34px; } }