/* ============================================================
   About pages — bespoke visual design shared by
     · Chi siamo (G01, template about-us.php)
     · Team      (G02, template team.php)
   Scoped to <main class="site-main st-about-pages">. Templates: about-us.php · team.php · quality.php
   Plain CSS layered over the compiled theme CSS — no build step.

   Each section is wrapped by the template in
     .st-about-sec.st-about-sec--<layout>.st-sec-<suptitle-slug>
   so blocks are styled by their "Sopratitolo" (slugified) or by layout.
   Chi siamo slugs: la-nostra-azienda (hero) · in-breve · chi-siamo ·
     dal-1972-a-oggi · cosa-facciamo · perche-sceglierci ·
     gruppo-study-tours (steps) · contatti · dove-siamo
   Chi siamo slugs: dal-1972 (hero) · in-breve · dal-1972-a-oggi (timeline) ·
     cosa-facciamo · perche-sceglierci · i-numeri (steps) · dicono-di-noi (reviews) ·
     contatti · dove-siamo (offices)
   Team slugs: prima-durante-e-dopo-il-viaggio (hero) · in-breve ·
     chi-ti-accompagna · lo-staff-allestero (team) · in-ufficio-con-te (people) ·
     i-numeri-della-fiducia (steps) · dicono-di-noi (reviews) · per-chi ·
     domande-frequenti · parliamone
   Qualità slugs: qualita-certificata (hero) · in-breve · i-certificati ·
     cosa-significa-per-te · i-numeri (steps) · le-scuole-partner · dicono-di-noi ·
     domande-frequenti · parliamone · registro certificati (layout "certificates", .st-cert-*)
   Renaming a Sopratitolo in the CMS changes which rules apply.
   ============================================================ */

.st-about-pages{
  /* Study Tours palette only: black + magenta (ST-0052). */
  --st-ink:#18191a;
  --st-muted:#636363;
  --st-pink:#cc0f7a;
  --st-pink-dark:#980b5b;
  --st-bg:#fbf9f8;
  --st-tint:#f5eef1;
  --st-card:#ffffff;
  --st-border:#ece7e3;
  --st-shadow:0 18px 40px -24px rgba(24,25,26,.35);
  --st-shadow-sm:0 8px 24px -16px rgba(24,25,26,.4);
  --st-grad:linear-gradient(135deg,var(--st-pink) 0%,#e0367f 45%,var(--st-pink-dark) 120%);
  --st-radius:20px;

  background:var(--st-bg); color:var(--st-ink); overflow:hidden;
}
.st-about-pages .st-about-sec .bg-light-grey{ background:var(--st-tint) !important; }
.st-about-pages .st-about-sec section{
  padding-top:clamp(48px,7vw,96px);
  padding-bottom:clamp(48px,7vw,96px);
}

/* ---- Kicker + headings ---------------------------------------------- */
.st-about-pages .st-about-sec .text-subtitle-mini{
  text-transform:uppercase; letter-spacing:.16em; font-weight:700; font-size:.78rem;
  color:var(--st-pink); display:inline-flex; align-items:center; gap:.55rem; margin-bottom:1rem;
}
.st-about-pages .st-about-sec .text-subtitle-mini::before{
  content:""; width:26px; height:2px; border-radius:2px; background:var(--st-grad);
}
.st-about-pages .st-about-sec .text-subheading{
  color:var(--st-ink); font-weight: 400; line-height:1.25;
}
.st-about-pages .editorial-content{ color:var(--st-muted); }
.st-about-pages .editorial-content strong{ color:var(--st-ink); }
.st-about-pages .editorial-content a{
  color:var(--st-pink); text-decoration-thickness:1px; text-underline-offset:3px; font-weight:500;
}
.st-about-pages .editorial-content a:hover{ color:var(--st-pink-dark); }
/* headings stay regular even if the editor bolds their text (ST-0052) */
.st-about-pages :is(h1,h2,h3,h4) :is(b,strong){ font-weight:inherit !important; }

/* ---- Shared layout helpers ------------------------------------------ */
/* "stacked": title centered on top, content full width below */
.st-about-pages :is(.st-sec-in-breve,.st-sec-dal-1972-a-oggi,.st-sec-cosa-facciamo,.st-sec-perche-sceglierci,.st-sec-chi-ti-accompagna,.st-sec-per-chi,.st-sec-i-certificati,.st-sec-cosa-significa-per-te) .grid.grid-cols-12{ display:block; }
.st-about-pages :is(.st-sec-in-breve,.st-sec-dal-1972-a-oggi,.st-sec-cosa-facciamo,.st-sec-perche-sceglierci,.st-sec-chi-ti-accompagna,.st-sec-per-chi,.st-sec-i-certificati,.st-sec-cosa-significa-per-te) .grid.grid-cols-12 > div{ width:100%; max-width:none; }
.st-about-pages :is(.st-sec-in-breve,.st-sec-dal-1972-a-oggi,.st-sec-cosa-facciamo,.st-sec-perche-sceglierci,.st-sec-chi-ti-accompagna,.st-sec-per-chi,.st-sec-i-certificati,.st-sec-cosa-significa-per-te) .grid.grid-cols-12 > div:nth-child(2){ display:none; }
.st-about-pages :is(.st-sec-in-breve,.st-sec-dal-1972-a-oggi,.st-sec-cosa-facciamo,.st-sec-perche-sceglierci,.st-sec-chi-ti-accompagna,.st-sec-per-chi,.st-sec-i-certificati,.st-sec-cosa-significa-per-te) .grid > div:first-child{
  text-align:center; max-width:58ch; margin:0 auto;
}
.st-about-pages :is(.st-sec-in-breve,.st-sec-dal-1972-a-oggi,.st-sec-cosa-facciamo,.st-sec-perche-sceglierci,.st-sec-chi-ti-accompagna,.st-sec-per-chi,.st-about-sec--steps,.st-about-sec--people,.st-about-sec--team,.st-about-sec--reviews) .text-subtitle-mini{ justify-content:center; }

/* "editorial 2-col": balanced 4 / 7 columns instead of 4 / 2 / 6 */
@media (min-width:1024px){
  .st-about-pages :is(.st-sec-chi-siamo,.st-sec-contatti,.st-sec-domande-frequenti,.st-sec-parliamone,.st-sec-le-scuole-partner) .grid.grid-cols-12 > div:nth-child(2){ display:none; }
  .st-about-pages :is(.st-sec-chi-siamo,.st-sec-contatti,.st-sec-domande-frequenti,.st-sec-parliamone,.st-sec-le-scuole-partner) .grid.grid-cols-12 > div:first-child{ grid-column:1 / span 4; }
  .st-about-pages :is(.st-sec-chi-siamo,.st-sec-contatti,.st-sec-domande-frequenti,.st-sec-parliamone,.st-sec-le-scuole-partner) .grid.grid-cols-12 > div:nth-child(3){ grid-column:6 / span 7; }
}

/* ================= HERO ================= */
.st-about-pages .st-about-sec--hero{ padding-top:12px; }
.st-about-pages .st-about-sec--hero .hero-page > div{
  min-height:clamp(440px,74vh,700px); border-radius:28px;
  justify-content:flex-end; padding-bottom:clamp(40px,6vw,72px);
}
.st-about-pages .st-about-sec--hero .hero-page > div::after{
  content:""; position:absolute; inset:0; z-index:2;
  background:linear-gradient(180deg,rgba(10,10,11,.10) 0%,rgba(10,10,11,.05) 40%,rgba(10,10,11,.80) 100%);
}
.st-about-pages .st-about-sec--hero .text-subtitle-mini{ color:#fff; z-index:20; position:relative; }
.st-about-pages .st-about-sec--hero .text-subtitle-mini::before{ background:#fff; }
.st-about-pages .st-about-sec--hero .text-heading{
  position:relative; z-index:20; font-weight: 400;
  max-width:20ch; text-shadow:0 2px 34px rgba(0,0,0,.28);
}

/* ================= IN BREVE (lead) ================= */
.st-about-pages .st-sec-in-breve .text-subheading{ max-width:24ch; margin:0 auto; }
.st-about-pages .st-sec-in-breve .editorial-content{
  max-width:62ch; margin:1.4rem auto 0; text-align:center;
  font-size:clamp(1.05rem,1.5vw,1.28rem); line-height:1.75; color:#404040;
}

/* ================= FACT TILES (Identità) ================= */
.st-about-pages .st-sec-chi-siamo .editorial-content{ margin-top:0; }
.st-about-pages .st-sec-chi-siamo .editorial-content ul{
  list-style:none; padding:0; margin:1.5rem 0;
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px;
}
.st-about-pages .st-sec-chi-siamo .editorial-content li{
  list-style:none; margin:0; background:var(--st-card); border:1px solid var(--st-border);
  border-radius:14px; padding:16px 18px; box-shadow:var(--st-shadow-sm); color:var(--st-ink); font-weight:500;
}
.st-about-pages .st-sec-chi-siamo .editorial-content li strong{
  display:block; font-size:.7rem; text-transform:uppercase; letter-spacing:.14em;
  color:var(--st-pink); margin-bottom:.35rem; font-weight:700;
}

/* ================= TIMELINE (horizontal) ================= */
.st-about-pages .st-sec-dal-1972-a-oggi .grid > div:first-child{ margin-bottom:2.6rem; }
.st-about-pages .st-sec-dal-1972-a-oggi .editorial-content{ margin-top:0; }
.st-about-pages .st-sec-dal-1972-a-oggi .editorial-content ul{
  list-style:none; padding:0; margin:0; position:relative;
  display:grid; grid-auto-flow:column; grid-auto-columns:minmax(0,1fr); gap:36px;
}
.st-about-pages .st-sec-dal-1972-a-oggi .editorial-content ul::before{
  content:""; position:absolute; left:10px; right:10px; top:10px; height:2px; border-radius:2px;
  background:linear-gradient(90deg,var(--st-pink),var(--st-pink-dark)); opacity:.35;
}
.st-about-pages .st-sec-dal-1972-a-oggi .editorial-content li{
  position:relative; list-style:none; margin:0; padding:40px 0 0;
}
.st-about-pages .st-sec-dal-1972-a-oggi .editorial-content li::before{
  content:""; position:absolute; left:0; top:1px; width:20px; height:20px; border-radius:50%;
  background:#fff; border:3px solid var(--st-pink); box-shadow:0 0 0 4px rgba(204,15,122,.12);
}
.st-about-pages .st-sec-dal-1972-a-oggi .editorial-content li strong{
  display:block; color:var(--st-pink); font-weight:400 !important; font-size:1.55rem; line-height:1.25; margin-bottom:.5rem;
}
@media (max-width:1023px){
  .st-about-pages .st-sec-dal-1972-a-oggi .editorial-content ul{ grid-auto-flow:row; grid-template-columns:1fr; gap:22px; }
  .st-about-pages .st-sec-dal-1972-a-oggi .editorial-content ul::before{
    left:9px; right:auto; top:6px; bottom:6px; width:2px; height:auto;
    background:linear-gradient(180deg,var(--st-pink),var(--st-pink-dark));
  }
  .st-about-pages .st-sec-dal-1972-a-oggi .editorial-content li{ padding:0 0 0 42px; }
  .st-about-pages .st-sec-dal-1972-a-oggi .editorial-content li::before{ top:2px; }
  .st-about-pages .st-sec-dal-1972-a-oggi .grid > div:first-child{ text-align:left; margin:0 0 1.6rem; max-width:none; }
  .st-about-pages .st-sec-dal-1972-a-oggi .text-subtitle-mini{ justify-content:flex-start; }
}

/* ============ ICON CARD GRIDS ============
   Programmi (cosa-facciamo) · Perché sceglierci · Chi ti accompagna · Per chi · I certificati · Cosa significa per te */
.st-about-pages :is(.st-sec-cosa-facciamo,.st-sec-perche-sceglierci,.st-sec-chi-ti-accompagna,.st-sec-per-chi,.st-sec-i-certificati,.st-sec-cosa-significa-per-te) .editorial-content > p{
  text-align:center; max-width:60ch; margin-left:auto; margin-right:auto;
}
.st-about-pages :is(.st-sec-cosa-facciamo,.st-sec-perche-sceglierci,.st-sec-chi-ti-accompagna,.st-sec-per-chi,.st-sec-i-certificati,.st-sec-cosa-significa-per-te) .editorial-content ul{
  list-style:none; padding:0; margin:2.2rem 0 1.4rem; display:grid; gap:18px;
}
.st-about-pages .st-sec-cosa-facciamo .editorial-content ul{ grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); }
.st-about-pages :is(.st-sec-perche-sceglierci,.st-sec-chi-ti-accompagna,.st-sec-per-chi,.st-sec-i-certificati,.st-sec-cosa-significa-per-te) .editorial-content ul{ grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); }
.st-about-pages :is(.st-sec-cosa-facciamo,.st-sec-perche-sceglierci,.st-sec-chi-ti-accompagna,.st-sec-per-chi,.st-sec-i-certificati,.st-sec-cosa-significa-per-te) .editorial-content li{
  position:relative; list-style:none; margin:0; background:var(--st-card);
  border:1px solid var(--st-border); border-radius:var(--st-radius);
  padding:24px 22px; box-shadow:var(--st-shadow-sm); text-align:left;
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
}
.st-about-pages :is(.st-sec-cosa-facciamo,.st-sec-perche-sceglierci,.st-sec-chi-ti-accompagna,.st-sec-per-chi,.st-sec-i-certificati,.st-sec-cosa-significa-per-te) .editorial-content li:hover{
  transform:translateY(-4px); box-shadow:var(--st-shadow); border-color:#e7d3de;
}
.st-about-pages :is(.st-sec-cosa-facciamo,.st-sec-perche-sceglierci,.st-sec-chi-ti-accompagna,.st-sec-per-chi,.st-sec-i-certificati,.st-sec-cosa-significa-per-te) .editorial-content li strong{
  display:block; color:var(--st-ink); font-size:1.06rem; margin-bottom:.35rem; line-height:1.25;
}
/* gradient tile (::before) + white glyph (::after) */
.st-about-pages :is(.st-sec-cosa-facciamo,.st-sec-perche-sceglierci,.st-sec-chi-ti-accompagna,.st-sec-per-chi,.st-sec-i-certificati,.st-sec-cosa-significa-per-te) .editorial-content li::before{
  content:""; display:block; width:46px; height:46px; margin-bottom:16px; border-radius:13px; background:var(--st-grad);
}
.st-about-pages :is(.st-sec-cosa-facciamo,.st-sec-perche-sceglierci,.st-sec-chi-ti-accompagna,.st-sec-per-chi,.st-sec-i-certificati,.st-sec-cosa-significa-per-te) .editorial-content li::after{
  content:""; position:absolute; top:24px; left:22px; width:46px; height:46px; background:#fff; pointer-events:none;
  -webkit-mask-size:24px 24px; mask-size:24px 24px;
  -webkit-mask-position:center; mask-position:center;
  -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat;
}
.st-about-pages .st-sec-cosa-facciamo li:nth-child(1)::after{ -webkit-mask-image:var(--ic-globe); mask-image:var(--ic-globe); }
.st-about-pages .st-sec-cosa-facciamo li:nth-child(2)::after{ -webkit-mask-image:var(--ic-book);  mask-image:var(--ic-book); }
.st-about-pages .st-sec-cosa-facciamo li:nth-child(3)::after{ -webkit-mask-image:var(--ic-cap);   mask-image:var(--ic-cap); }
.st-about-pages .st-sec-cosa-facciamo li:nth-child(4)::after{ -webkit-mask-image:var(--ic-sun);   mask-image:var(--ic-sun); }
.st-about-pages .st-sec-cosa-facciamo li:nth-child(5)::after{ -webkit-mask-image:var(--ic-case);  mask-image:var(--ic-case); }
.st-about-pages .st-sec-perche-sceglierci li:nth-child(1)::after{ -webkit-mask-image:var(--ic-users); mask-image:var(--ic-users); }
.st-about-pages .st-sec-perche-sceglierci li:nth-child(2)::after{ -webkit-mask-image:var(--ic-badge); mask-image:var(--ic-badge); }
.st-about-pages .st-sec-perche-sceglierci li:nth-child(3)::after{ -webkit-mask-image:var(--ic-star);  mask-image:var(--ic-star); }
.st-about-pages .st-sec-chi-ti-accompagna li:nth-child(1)::after{ -webkit-mask-image:var(--ic-chat);  mask-image:var(--ic-chat); }
.st-about-pages .st-sec-chi-ti-accompagna li:nth-child(2)::after{ -webkit-mask-image:var(--ic-users); mask-image:var(--ic-users); }
.st-about-pages .st-sec-chi-ti-accompagna li:nth-child(3)::after{ -webkit-mask-image:var(--ic-star);  mask-image:var(--ic-star); }
.st-about-pages .st-sec-per-chi li:nth-child(1)::after{ -webkit-mask-image:var(--ic-heart);  mask-image:var(--ic-heart); }
.st-about-pages .st-sec-per-chi li:nth-child(2)::after{ -webkit-mask-image:var(--ic-cap);    mask-image:var(--ic-cap); }
.st-about-pages .st-sec-per-chi li:nth-child(3)::after{ -webkit-mask-image:var(--ic-school); mask-image:var(--ic-school); }
.st-about-pages .st-sec-i-certificati li:nth-child(1)::after{ -webkit-mask-image:var(--ic-badge); mask-image:var(--ic-badge); }
.st-about-pages .st-sec-i-certificati li:nth-child(2)::after{ -webkit-mask-image:var(--ic-doc);   mask-image:var(--ic-doc); }
.st-about-pages .st-sec-i-certificati li:nth-child(3)::after{ -webkit-mask-image:var(--ic-sun);   mask-image:var(--ic-sun); }
.st-about-pages .st-sec-cosa-significa-per-te li:nth-child(1)::after{ -webkit-mask-image:var(--ic-chat);  mask-image:var(--ic-chat); }
.st-about-pages .st-sec-cosa-significa-per-te li:nth-child(2)::after{ -webkit-mask-image:var(--ic-cap);   mask-image:var(--ic-cap); }
.st-about-pages .st-sec-cosa-significa-per-te li:nth-child(3)::after{ -webkit-mask-image:var(--ic-users); mask-image:var(--ic-users); }

/* whole card is a link when the title is linked (<strong><a>): stretched link + arrow */
.st-about-pages :is(.st-sec-cosa-facciamo,.st-sec-perche-sceglierci,.st-sec-chi-ti-accompagna,.st-sec-per-chi,.st-sec-i-certificati,.st-sec-cosa-significa-per-te) .editorial-content li strong a{
  color:var(--st-ink); text-decoration:none; font-weight:inherit;
}
.st-about-pages :is(.st-sec-cosa-facciamo,.st-sec-perche-sceglierci,.st-sec-chi-ti-accompagna,.st-sec-per-chi,.st-sec-i-certificati,.st-sec-cosa-significa-per-te) .editorial-content li strong a::after{
  content:""; position:absolute; inset:0; z-index:2; border-radius:var(--st-radius);
}
.st-about-pages :is(.st-sec-cosa-facciamo,.st-sec-perche-sceglierci,.st-sec-chi-ti-accompagna,.st-sec-per-chi,.st-sec-i-certificati,.st-sec-cosa-significa-per-te) .editorial-content li strong a::before{
  content:"→"; position:absolute; right:18px; top:20px; color:var(--st-pink); font-weight:700; font-size:1.1rem;
  opacity:0; transform:translateX(-6px); transition:opacity .2s ease,transform .2s ease;
}
.st-about-pages :is(.st-sec-cosa-facciamo,.st-sec-perche-sceglierci,.st-sec-chi-ti-accompagna,.st-sec-per-chi,.st-sec-i-certificati,.st-sec-cosa-significa-per-te) .editorial-content li:hover strong a{ color:var(--st-pink); }
.st-about-pages :is(.st-sec-cosa-facciamo,.st-sec-perche-sceglierci,.st-sec-chi-ti-accompagna,.st-sec-per-chi,.st-sec-i-certificati,.st-sec-cosa-significa-per-te) .editorial-content li:hover strong a::before{ opacity:1; transform:none; }
.st-about-pages :is(.st-sec-cosa-facciamo,.st-sec-perche-sceglierci,.st-sec-chi-ti-accompagna,.st-sec-per-chi,.st-sec-i-certificati,.st-sec-cosa-significa-per-te) .editorial-content li:has(a:focus-visible){
  outline:2px solid var(--st-pink); outline-offset:3px;
}

/* icon library (line icons; the ::after layer paints them white) */
.st-about-pages{
  --ic-globe:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="black" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="9"/><path d="M3 12h18"/><path d="M12 3c2.6 2.9 2.6 15.1 0 18M12 3c-2.6 2.9-2.6 15.1 0 18"/></svg>');
  --ic-book:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="black" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M4 5a2 2 0 0 1 2-2h13v16H6a2 2 0 0 0-2 2z"/><path d="M19 3v18"/></svg>');
  --ic-cap:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="black" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M2 9l10-4 10 4-10 4z"/><path d="M6 11v4c0 1.1 2.7 2.5 6 2.5s6-1.4 6-2.5v-4"/></svg>');
  --ic-sun:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="black" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="4"/><path d="M12 2v3M12 19v3M2 12h3M19 12h3M5 5l2 2M17 17l2 2M19 5l-2 2M7 17l-2 2"/></svg>');
  --ic-case:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="black" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="7" width="18" height="13" rx="2"/><path d="M9 7V5a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2v2"/></svg>');
  --ic-users:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="black" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><circle cx="9" cy="8" r="3.2"/><path d="M3.5 19a5.5 5.5 0 0 1 11 0"/><path d="M16 5.5a3.2 3.2 0 0 1 0 6M17.5 19a5.5 5.5 0 0 0-2-4.2"/></svg>');
  --ic-badge:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="black" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M12 3l7 3v5c0 4.4-3 7.6-7 9-4-1.4-7-4.6-7-9V6z"/><path d="M9 12l2 2 4-4"/></svg>');
  --ic-star:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="black" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M12 3l2.6 5.3 5.9.9-4.3 4.1 1 5.8L12 16.9 6.8 19.2l1-5.8L3.5 9.2l5.9-.9z"/></svg>');
  --ic-chat:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="black" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M4 5h16v11H9l-5 4z"/><path d="M8 9h8M8 12h5"/></svg>');
  --ic-doc:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="black" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M6 3h8l4 4v14H6z"/><path d="M14 3v4h4"/><path d="M9 12h6M9 16h6"/></svg>');
  --ic-heart:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="black" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M12 20s-7-4.4-7-10a4 4 0 0 1 7-2.6A4 4 0 0 1 19 10c0 5.6-7 10-7 10z"/></svg>');
  --ic-school:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="black" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M3 21V9l9-5 9 5v12"/><path d="M3 21h18"/><path d="M9 21v-6h6v6"/><path d="M12 9.5v.01"/></svg>');
}

/* ================= NUMBERS / STEPS BAND (any "steps" layout) ================= */
.st-about-pages .st-about-sec--steps .text-center{ margin-bottom:8px; }
.st-about-pages .st-about-sec--steps .text-center .editorial-content{ max-width:60ch; margin-left:auto; margin-right:auto; }
.st-about-pages .st-about-sec--steps .overflow-x-scroll{
  overflow:visible !important; justify-content:center !important;
  gap:clamp(24px,5vw,80px) !important; flex-wrap:wrap; width:100% !important; margin-left:0 !important;
}
.st-about-pages .st-about-sec--steps .w-px{ display:none !important; }
/* each step = [labels][value][empty spacer]; hide only the trailing spacer */
.st-about-pages .st-about-sec--steps .overflow-x-scroll > div > div:nth-child(3){ display:none !important; }
.st-about-pages .st-about-sec--steps .overflow-x-scroll > div{
  width:auto !important; min-width:0 !important; max-width:240px; display:flex; flex-direction:column !important;
  align-items:center; text-align:center; gap:0 !important;
}
.st-about-pages .st-about-sec--steps .overflow-x-scroll > div > div:first-child{
  height:auto !important; align-items:center !important; gap:0 !important; flex-direction:column !important;
}
.st-about-pages .st-about-sec--steps .overflow-x-scroll > div > div:first-child > .space-y-1{ text-align:center; }
.st-about-pages .st-about-sec--steps .overflow-x-scroll > div > div:first-child > .space-y-1 > span:first-child{
  color:var(--st-ink) !important; font-weight:400 !important; font-size:1rem !important; margin-top:.25rem;
}
.st-about-pages .st-about-sec--steps .overflow-x-scroll > div > div:first-child > .space-y-1 > span:last-child{
  color:var(--st-muted) !important; width:auto !important; line-height:1.45 !important;
}
/* the value pill -> big gradient figure (the shorthand must not reset the clip) */
.st-about-pages .st-about-sec--steps .bg-primary-500{
  order:-1; display:block !important; height:auto !important; padding:0 !important; border-radius:0 !important;
  font-size:clamp(2.6rem,5.2vw,3.6rem) !important; font-weight:400 !important; line-height:1 !important;
  background:var(--st-grad) !important;
  -webkit-background-clip:text !important; background-clip:text !important;
  -webkit-text-fill-color:transparent; color:transparent !important;
  margin-bottom:.5rem; white-space:nowrap;
}

/* ================= FAQ (Domande frequenti) ================= */
.st-about-pages .st-sec-domande-frequenti .editorial-content{ margin-top:0; }
.st-about-pages .st-sec-domande-frequenti .editorial-content h3{
  font-size: clamp(1.125rem, 0.136vi + 1.091rem, 1.2rem); font-weight: 400; color:var(--st-ink); line-height: 1.25;
  margin:0 0 .45rem; padding-left:20px; position:relative;
}
.st-about-pages .st-sec-domande-frequenti .editorial-content h3::before{
  content:""; position:absolute; left:0; top:.42em; width:9px; height:9px; border-radius:50%; background:var(--st-grad);
}
.st-about-pages .st-sec-domande-frequenti .editorial-content h3 + p{ padding-left:20px; margin-bottom:1.6rem; }
.st-about-pages .st-sec-domande-frequenti .editorial-content > p:last-child{ margin-bottom:0; }

/* ================= HERO CTA buttons ================= */
.st-about-pages .st-about-sec--hero .hero-page__buttons{ margin-top:clamp(20px,3vw,32px); }
.st-about-pages .st-about-sec--hero .hero-page__buttons .btn-primary{ box-shadow:0 14px 30px -12px rgba(204,15,122,.8); }
.st-about-pages .st-about-sec--hero .hero-page__buttons .btn-outlined-white{ backdrop-filter:blur(6px); background:rgba(255,255,255,.08); }

/* ================= STAFF ROLES (persona cards) ================= */
.st-about-pages .st-grid__head{ max-width:58ch; margin:0 auto; }
.st-about-pages .st-grid__head .editorial-content{ margin-top:1rem; }
.st-about-pages .st-staff{
  list-style:none; padding:0; margin:2.4rem 0 0; display:grid; gap:20px;
  grid-template-columns:repeat(auto-fill,minmax(250px,1fr));
}
.st-about-pages .st-staff__card{
  list-style:none; margin:0; background:var(--st-card); border:1px solid var(--st-border); border-radius:var(--st-radius);
  overflow:hidden; box-shadow:var(--st-shadow-sm); display:flex; flex-direction:column;
  transition:transform .25s ease,box-shadow .25s ease;
}
.st-about-pages .st-staff__card:hover{ transform:translateY(-4px); box-shadow:var(--st-shadow); }
.st-about-pages .st-staff__photo{ aspect-ratio:4 / 3; overflow:hidden; background:var(--st-tint); }
.st-about-pages .st-staff__img{ width:100%; height:100%; object-fit:cover; display:block; }
.st-about-pages .st-staff__role{ font-size: clamp(1.125rem, 0.136vi + 1.091rem, 1.2rem); font-weight: 400; color:var(--st-ink); margin:18px 20px 6px; line-height:1.25; }
.st-about-pages .st-staff__text{ color:var(--st-muted); font-size:.93rem; line-height:1.55; margin:0 20px 20px; }

/* ================= QUOTES (real reviews) ================= */
.st-about-pages .st-quotes{
  list-style:none; padding:0; margin:2.4rem 0 0; display:grid; gap:20px;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
}
.st-about-pages .st-quotes__card{
  list-style:none; margin:0; position:relative; background:var(--st-card); border:1px solid var(--st-border);
  border-radius:var(--st-radius); padding:34px 26px 24px; box-shadow:var(--st-shadow-sm); display:flex; flex-direction:column;
}
.st-about-pages .st-quotes__card::before{
  content:"\201C"; position:absolute; top:6px; left:20px; font-size:4.2rem; line-height:1; font-weight:800;
  background:var(--st-grad); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent; opacity:.9;
}
.st-about-pages .st-quotes__text{ margin:14px 0 0; padding:0; border:0; color:var(--st-ink); font-size:1rem; line-height:1.65; font-style:normal; }
.st-about-pages .st-quotes__meta{ margin:auto 0 0; padding-top:16px; font-size:.88rem; color:var(--st-muted); display:flex; flex-direction:column; gap:2px; }
.st-about-pages .st-quotes__meta strong{ color:var(--st-pink); font-weight:700; }

/* ================= PEOPLE (named profiles) ================= */
.st-about-pages .st-people__head{ max-width:58ch; margin:0 auto; }
.st-about-pages .st-people__head .editorial-content{ margin-top:1rem; }
.st-about-pages .st-people{
  list-style:none; padding:0; margin:2.4rem 0 0; display:grid; gap:20px;
  grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
}
.st-about-pages .st-people__card{
  list-style:none; margin:0; background:var(--st-card); border:1px solid var(--st-border); border-radius:var(--st-radius);
  padding:26px 24px; box-shadow:var(--st-shadow-sm); display:flex; flex-direction:column; gap:.5rem;
}
.st-about-pages .st-people__photo{
  width:88px; height:88px; border-radius:50%; overflow:hidden; background:var(--st-grad);
  display:grid; place-items:center; margin-bottom:.5rem;
}
.st-about-pages .st-people__img{ width:100%; height:100%; object-fit:cover; display:block; }
.st-about-pages .st-people__initials{ color:#fff; font-weight: 400; font-size:1.6rem; letter-spacing:.02em; }
.st-about-pages .st-people__name{ font-size: clamp(1.125rem, 0.136vi + 1.091rem, 1.2rem); font-weight: 400; color:var(--st-ink); margin:0; line-height:1.25; }
.st-about-pages .st-people__role{ color:var(--st-pink); font-weight:600; font-size:.92rem; margin:0; }
.st-about-pages .st-people__areas{ list-style:none; padding:0; margin:.25rem 0 0; display:flex; flex-wrap:wrap; gap:6px; }
.st-about-pages .st-people__areas li{
  list-style:none; margin:0; font-size:.68rem; text-transform:uppercase; letter-spacing:.1em; font-weight:700;
  color:var(--st-pink-dark); background:var(--st-tint); border-radius:999px; padding:4px 10px;
}
.st-about-pages .st-people__bio{ color:var(--st-muted); font-size:.95rem; line-height:1.6; margin:.35rem 0 0; }
.st-about-pages .st-people__links{ margin:auto 0 0; padding-top:.9rem; display:flex; gap:16px; flex-wrap:wrap; font-size:.9rem; }
.st-about-pages .st-people__links a{ color:var(--st-pink); font-weight:600; text-decoration:none; }
.st-about-pages .st-people__links a:hover{ color:var(--st-pink-dark); text-decoration:underline; text-underline-offset:3px; }

/* ================= CTA CARD (Contatti · Parliamone) ================= */
.st-about-pages :is(.st-sec-contatti,.st-sec-parliamone) section{ padding-bottom:clamp(56px,8vw,110px); }
.st-about-pages :is(.st-sec-contatti,.st-sec-parliamone) .grid.grid-cols-12{
  background:var(--st-card); border:1px solid var(--st-border); border-radius:26px;
  box-shadow:var(--st-shadow); padding:clamp(28px,4vw,56px); position:relative; overflow:hidden;
}
.st-about-pages :is(.st-sec-contatti,.st-sec-parliamone) .grid.grid-cols-12::after{
  content:""; position:absolute; right:-80px; top:-80px; width:260px; height:260px; border-radius:50%;
  background:var(--st-grad); opacity:.10; pointer-events:none;
}
.st-about-pages :is(.st-sec-contatti,.st-sec-parliamone) .editorial-content{ margin-top:0; position:relative; z-index:1; }
.st-about-pages :is(.st-sec-contatti,.st-sec-parliamone) .editorial-content ul{ list-style:none; padding:0; margin:1.2rem 0; display:grid; gap:10px; }
.st-about-pages :is(.st-sec-contatti,.st-sec-parliamone) .editorial-content li{ list-style:none; margin:0; display:flex; gap:14px; align-items:baseline; }
.st-about-pages :is(.st-sec-contatti,.st-sec-parliamone) .editorial-content li strong{
  flex:0 0 96px; font-size:.7rem; text-transform:uppercase; letter-spacing:.14em; color:var(--st-pink); font-weight:700;
}
.st-about-pages :is(.st-sec-contatti,.st-sec-parliamone) .editorial-content > p:last-child{ font-size:.92rem; }
.st-about-pages :is(.st-sec-contatti,.st-sec-parliamone) .col-span-12.flex{ position:relative; z-index:1; }
.st-about-pages :is(.st-sec-contatti,.st-sec-parliamone) .btn-primary{ box-shadow:0 14px 30px -12px rgba(204,15,122,.7); }

/* ================= CERTIFICATE REGISTER (layout "certificates") =================
   One card per document: image, type, name, summary, facts (dl) and the PDF button.
   Without its own title the block continues the section above it (e.g. "I certificati"). */
.st-about-pages .st-cert-register--flush{ padding-top:0 !important; }
.st-about-pages .st-cert-register__head{ max-width:62ch; margin:0 auto 2.4rem; }
.st-about-pages .st-certs{
  list-style:none; padding:0; margin:0; display:grid; gap:24px;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); align-items:start;
}
.st-about-pages .st-cert{
  list-style:none; margin:0; background:var(--st-card); border:1px solid var(--st-border);
  border-radius:var(--st-radius); box-shadow:var(--st-shadow-sm); overflow:hidden;
  display:flex; flex-direction:column;
}
.st-about-pages .st-cert__doc{
  background:var(--st-tint); padding:22px 22px 0; display:flex; justify-content:center;
}
.st-about-pages .st-cert__doc a{ display:block; }
.st-about-pages .st-cert__img{
  display:block; width:auto; max-width:100%; height:260px; object-fit:contain; object-position:top center;
  border-radius:8px 8px 0 0; box-shadow:0 10px 30px -18px rgba(24,25,26,.55); background:#fff;
}
.st-about-pages .st-cert__body{ padding:22px 24px 26px; display:flex; flex-direction:column; gap:.5rem; }
.st-about-pages .st-cert__type{
  margin:0; font-size:.72rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--st-pink);
}
.st-about-pages .st-cert__name{ margin:0; font-size: clamp(1.266rem, 0.317vi + 1.186rem, 1.44rem); font-weight: 400; line-height: 1.25; color:var(--st-ink); }
.st-about-pages .st-cert__subject{ margin:0; color:var(--st-muted); }
.st-about-pages .st-cert__facts{ margin:.6rem 0 0; display:grid; gap:0; border-top:1px solid var(--st-border); }
.st-about-pages .st-cert__fact{
  display:grid; grid-template-columns:minmax(110px,38%) 1fr; gap:12px; padding:9px 0;
  border-bottom:1px solid var(--st-border); font-size:.95rem;
}
.st-about-pages .st-cert__fact dt{ color:var(--st-muted); }
.st-about-pages .st-cert__fact dd{ margin:0; color:var(--st-ink); font-weight:500; overflow-wrap:anywhere; }
.st-about-pages .st-cert__fact--valid_until dd{ color:var(--st-pink); font-weight:600; }
.st-about-pages .st-cert__actions{ display:flex; flex-wrap:wrap; gap:10px; margin-top:1rem; }
.st-about-pages .st-cert__actions .btn{ max-width:100%; }
.st-about-pages .st-cert__actions .btn > span{ max-width:none; white-space:normal; }
.st-about-pages .st-cert__actions .btn{ height:auto; min-height:2.5rem; padding-top:8px; padding-bottom:8px; }

/* ================= small screens ================= */
@media (max-width:640px){
  .st-about-pages .st-about-sec--hero .hero-page > div{ border-radius:20px; }
  .st-about-pages .st-sec-chi-siamo .editorial-content ul{ grid-template-columns:1fr; }
  .st-about-pages :is(.st-sec-contatti,.st-sec-parliamone) .editorial-content li{ flex-direction:column; gap:2px; }
  .st-about-pages :is(.st-sec-contatti,.st-sec-parliamone) .editorial-content li strong{ flex-basis:auto; }
  .st-about-pages .st-about-sec--steps .overflow-x-scroll > div{ max-width:none; }
  .st-about-pages .st-certs{ grid-template-columns:1fr; }
  .st-about-pages .st-cert__img{ height:220px; }
  .st-about-pages .st-cert__fact{ grid-template-columns:1fr; gap:2px; }
}