/* Final call to action (includes/cta-finale.php, 1.37.7): .palladio-cta-finale--scura (page 59) and --chiara (page 51).
   Loaded where a page uses the class, and in the editor. Colors: direction A (README, "Regola dei colori"), gold #e8c46a
   for the glow and the rule. Main action: palladio-card-cta (palladio-card-cta.css), here 48px tall and cream on the
   dark variant; second action: outlined link (pcf-contorno), same height and radius. Focus: palladio-focus.css of the
   child theme (underlined label) plus a ring on the two actions. Entrance in palladio-cta-finale.js: only with
   html.pcf-js, which the head script sets with motion allowed; otherwise everything is static and visible. */
.palladio-cta-finale {
  --pcf-bordeaux: var(--wp--preset--color--palladio-bordeaux, #6b1d23);
  --pcf-deep: var(--wp--preset--color--palladio-bordeaux-deep, #4a141b);
  --pcf-cream: var(--wp--preset--color--palladio-cream, #faf7f2);
  --pcf-white: var(--wp--preset--color--base, #ffffff);
  --pcf-ink: var(--wp--preset--color--palladio-ink-warm, #2a211c);
  --pcf-secondary: var(--wp--preset--color--palladio-text-secondary, #5a4a3f);
  --pcf-line: var(--wp--preset--color--palladio-line, #e7ded2);
  --pcf-gold: #e8c46a;
  --pcf-gold-light: var(--wp--preset--color--palladio-gold-light, #e6c98a);
  --pcf-gold-detail: #c99a3a;
  --pcf-heading-font: var(--wp--preset--font-family--palladio-heading, 'Plus Jakarta Sans', system-ui, sans-serif);
  --pcf-heading-tracking: clamp(-.03em, calc(-.02em - (1em - 23.9px) * 2.4), -.02em);
  /* Second action, light variant values; the dark variant redefines them. */
  --pcf-contorno-fg: var(--pcf-bordeaux);
  --pcf-contorno-hover-bg: var(--pcf-bordeaux);
  --pcf-contorno-hover-fg: var(--pcf-white);
  --pcf-ring: var(--pcf-bordeaux);
  /* Joins (1.37.8): the section starts exactly from the colour of the block above and ends exactly on the footer's,
     over --pcf-raccordo. Each page can set the two colours on the section (style or a more specific rule). */
  --pcf-raccordo: clamp(120px, 15vw, 220px);
  --pcf-colore-sotto: var(--wp--preset--color--palladio-bordeaux-deep, #4a141b);
  --pcf-raccordi:
    linear-gradient(180deg, var(--pcf-colore-sopra) 0, color-mix(in srgb, var(--pcf-colore-sopra) 0%, transparent) var(--pcf-raccordo)),
    linear-gradient(0deg, var(--pcf-colore-sotto) 0, color-mix(in srgb, var(--pcf-colore-sotto) 0%, transparent) var(--pcf-raccordo-sotto, var(--pcf-raccordo)));
  position: relative; isolation: isolate;
  padding: clamp(56px, 8vw, 104px) clamp(16px, 4vw, 32px);
  font-family: var(--wp--preset--font-family--manrope, Manrope, sans-serif); font-size: 16px; line-height: 1.55;
}
.palladio-cta-finale, .palladio-cta-finale *, .palladio-cta-finale *::before, .palladio-cta-finale *::after { box-sizing: border-box; }
/* No block gap above or below the section (the white body would show as a stripe between coloured sections). */
.palladio-cta-finale.palladio-cta-finale { margin-block: 0; }
.palladio-cta-finale.palladio-cta-finale.palladio-cta-finale :where(h2, h3, p, figure, .wp-block-group) { margin-block: 0; }
.palladio-cta-finale .pcf-wrap {
  display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: clamp(32px, 5vw, 72px); align-items: center;
  width: 100%; max-width: 1180px; margin-inline: auto;
}
.palladio-cta-finale .pcf-titolo {
  max-width: 18ch; color: inherit; font-family: var(--pcf-heading-font); font-size: clamp(2rem, 3.8vw, 3.1rem); font-weight: 700;
  line-height: 1.08; letter-spacing: var(--pcf-heading-tracking); text-wrap: balance; overflow-wrap: break-word;
}
.palladio-cta-finale.palladio-cta-finale.palladio-cta-finale .pcf-intro { max-width: 52ch; margin-top: 18px; font-size: 1.08rem; }

/* Actions: the shared card button, 48px, and the outlined link. */
.palladio-cta-finale.palladio-cta-finale.palladio-cta-finale .pcf-azioni { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; }
/* Never wider than the box: with very large text or a zoomed page the button labels wrap. */
.palladio-cta-finale .pcf-azioni > * { min-width: 0; max-width: 100%; }
.palladio-cta-finale .pcf-azioni a { overflow-wrap: anywhere; }
.palladio-cta-finale.palladio-cta-finale.palladio-cta-finale .pcf-testo .pcf-azioni { margin-top: 32px; }
.palladio-cta-finale .pcf-principale { --palladio-card-cta-height: 48px; --palladio-card-cta-size: 16px; --palladio-card-cta-padding: 26px; }
.palladio-cta-finale .pcf-principale > a { font-weight: 600; }
.palladio-cta-finale .pcf-contorno > a {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; padding: 6px 24px;
  border: 2px solid currentColor; border-radius: 8px; background: transparent; color: var(--pcf-contorno-fg);
  font-size: 16px; font-weight: 600; line-height: 1.25; text-align: center; text-decoration: none;
  transition: background-color .2s, color .2s, border-color .2s;
  --palladio-focus-text: var(--pcf-contorno-hover-fg);
}
.palladio-cta-finale .pcf-contorno > a:is(:hover, :focus-visible) { border-color: var(--pcf-contorno-hover-bg); background: var(--pcf-contorno-hover-bg); color: var(--pcf-contorno-hover-fg); }
.wp-site-blocks .palladio-cta-finale .pcf-contorno > a:focus-visible { outline: 2px solid var(--pcf-ring) !important; outline-offset: 3px; }
.palladio-cta-finale [class*="pcf-icona-"] > a::before { content: ""; flex: none; width: 20px; height: 20px; background: currentColor; mask: var(--pcf-icon) center / contain no-repeat; }

/* Dark (28/10/2026): on the bordeaux of the page a cream card set off from the footer, like the closing card «Parla
   con noi» of the other pages (palladio-corso-cta: 1120px less the gutters, radius 22px, padding clamp(28px, 5vw,
   48px)). The section keeps the page's diagonal bordeaux, joined to the block above and to the footer; between the card
   and the footer a bordeaux band of clamp(56px, 8vw, 96px). The card carries the light variant's colours (text, second
   action, focus); the main action is the default bordeaux palladio-card-cta. */
.palladio-cta-finale--scura {
  /* Default: the bottom of the stacked cards of Per le aziende (sampled #4b151c–#4f181d). */
  --pcf-colore-sopra: #4b171c;
  --pcf-gutter: clamp(16px, 4vw, 32px);
  padding-bottom: clamp(56px, 8vw, 96px); padding-inline: var(--pcf-gutter);
  background:
    var(--pcf-raccordi),
    radial-gradient(ellipse 55% 70% at 100% 100%, color-mix(in srgb, var(--pcf-deep) 70%, transparent) 0%, transparent 70%),
    linear-gradient(135deg, var(--pcf-bordeaux) 0%, color-mix(in srgb, var(--pcf-bordeaux) 55%, var(--pcf-deep)) 55%, var(--pcf-deep) 100%);
}
.palladio-cta-finale--scura .pcf-wrap {
  max-width: calc(1120px - 2 * var(--pcf-gutter)); padding: clamp(28px, 5vw, 48px); border-radius: 22px;
  background: var(--pcf-cream); color: var(--pcf-ink);
}
.palladio-cta-finale--scura .pcf-intro { color: var(--pcf-secondary); }
/* Logo on a thin gold rule that fades out: the signature above the title. */
.palladio-cta-finale.palladio-cta-finale.palladio-cta-finale .pcf-firma { display: flex; align-items: center; gap: 20px; margin-bottom: 28px; }
.palladio-cta-finale .pcf-firma::after { content: ""; flex: 1; max-width: 180px; height: 1px; background: linear-gradient(90deg, var(--pcf-gold-detail), transparent); }
.palladio-cta-finale .pcf-logo img { display: block; width: auto; height: 40px; }
/* Box on the right: a stone panel with a thin gold edge. One flexible column: with very large text the phone number
   wraps inside the box instead of widening it. */
.palladio-cta-finale .pcf-riquadro {
  display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; padding: clamp(24px, 3vw, 36px);
  border: 1px solid color-mix(in srgb, var(--pcf-gold-detail) 30%, transparent); border-radius: 20px;
  background: var(--wp--preset--color--palladio-stone, #f1e9de);
}
.palladio-cta-finale .pcf-riquadro-titolo { margin-bottom: 4px !important; color: var(--pcf-ink); font-family: var(--pcf-heading-font); font-size: 1.3rem; font-weight: 700; line-height: 1.2; letter-spacing: -.02em; }
.palladio-cta-finale .pcf-contatto { position: relative; }
.palladio-cta-finale .pcf-contatto::before {
  content: ""; position: absolute; left: 0; top: 50%; width: 44px; height: 44px; margin-top: -22px; border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--pcf-gold-detail) 40%, transparent); background: color-mix(in srgb, var(--pcf-gold) 16%, transparent);
}
.palladio-cta-finale .pcf-contatto > a {
  display: flex; align-items: center; min-height: 48px; padding-left: 60px; color: var(--pcf-bordeaux); overflow-wrap: anywhere;
  font-weight: 600; text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--pcf-gold-detail) 60%, transparent); text-underline-offset: 5px;
}
.palladio-cta-finale .pcf-contatto > a:hover { color: var(--pcf-deep); text-decoration-color: currentColor; }
.palladio-cta-finale .pcf-contatto > a::before { position: absolute; left: 12px; top: 50%; margin-top: -10px; color: var(--pcf-bordeaux); }
.palladio-cta-finale .pcf-contatto.pcf-icona-phone > a { font-family: var(--pcf-heading-font); font-size: 1.3rem; letter-spacing: -.01em; text-decoration: none; }

/* Light: cream to sand like the dynamic background, one white panel with the shadow of its cards. */
.palladio-cta-finale--chiara {
  /* Default: the cream of the section above (Corsi in tendenza on 51); the bottom fades into the footer. */
  --pcf-colore-sopra: var(--wp--preset--color--palladio-cream, #faf7f2);
  /* Bottom (1.37.9): no fade into the dark footer (it turned mauve). The bottom join fades the sand of the diagonal
     gradient and of the corner glow back into the uniform cream over --pcf-raccordo, so the section ends in plain cream
     and the footer starts with a clean edge. --pcf-raccordo-sotto (unset, defaults to --pcf-raccordo) stays available. */
  --pcf-colore-sotto: var(--wp--preset--color--palladio-cream, #faf7f2);
  background:
    var(--pcf-raccordi),
    radial-gradient(ellipse clamp(280px, 55vw, 760px) clamp(220px, 36vw, 480px) at 100% 0%, color-mix(in srgb, #d9c4a3 55%, transparent) 0%, transparent 100%),
    radial-gradient(ellipse clamp(280px, 50vw, 720px) clamp(220px, 34vw, 460px) at 8% 100%, color-mix(in srgb, #f0d9a4 45%, transparent) 0%, transparent 100%),
    linear-gradient(135deg, #fffdf9 0%, #f3e9d8 55%, #e6d6bd 100%);
  color: var(--pcf-ink);
}
.palladio-cta-finale--chiara .pcf-wrap {
  max-width: 1040px; padding: clamp(28px, 5vw, 60px); border: 1px solid var(--pcf-line); border-radius: 24px; background: var(--pcf-white);
  box-shadow: 0 1px 3px rgba(42, 33, 28, .1), 0 22px 48px -20px rgba(74, 20, 27, .24);
}
.palladio-cta-finale--chiara .pcf-titolo::before { content: ""; display: block; width: 56px; height: 2px; margin-bottom: 22px; background: var(--pcf-gold-detail); }
.palladio-cta-finale--chiara .pcf-intro { color: var(--pcf-secondary); }
.palladio-cta-finale.palladio-cta-finale--chiara .pcf-wrap > .pcf-azioni { flex-direction: column; align-items: stretch; width: 100%; max-width: 340px; justify-self: end; }
.palladio-cta-finale--chiara .pcf-wrap > .pcf-azioni > p > a { display: flex; width: 100%; }

/* One column; actions full width, at least 44px (here 48px). */
@media (max-width: 860px) {
  .palladio-cta-finale .pcf-wrap { grid-template-columns: minmax(0, 1fr); }
  .palladio-cta-finale.palladio-cta-finale--chiara .pcf-wrap > .pcf-azioni { max-width: none; justify-self: stretch; }
}
@media (max-width: 760px) {
  .palladio-cta-finale.palladio-cta-finale.palladio-cta-finale .pcf-azioni { flex-direction: column; align-items: stretch; }
  .palladio-cta-finale .pcf-azioni > p > a { display: flex; width: 100%; }
  .palladio-cta-finale .pcf-logo img { height: 34px; }
}

/* Entrance (time based, once): text first, then the box or the actions. */
@media (prefers-reduced-motion: no-preference) {
  .pcf-js .wp-site-blocks .palladio-cta-finale .pcf-wrap > * { transition: opacity .7s cubic-bezier(.2, .7, .2, 1), translate .7s cubic-bezier(.2, .7, .2, 1); }
  .pcf-js .wp-site-blocks .palladio-cta-finale .pcf-wrap > :nth-child(2) { transition-delay: .15s; }
  .pcf-js .wp-site-blocks .palladio-cta-finale:not(.is-visible) .pcf-wrap > * { opacity: 0; translate: 0 28px; }
  .pcf-js .wp-site-blocks .palladio-cta-finale--chiara .pcf-wrap { transition: opacity .7s cubic-bezier(.2, .7, .2, 1), translate .7s cubic-bezier(.2, .7, .2, 1); }
  .pcf-js .wp-site-blocks .palladio-cta-finale--chiara:not(.is-visible) .pcf-wrap { opacity: 0; translate: 0 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .palladio-cta-finale .pcf-contorno > a { transition: none; }
}
