.elementor-3020 .elementor-element.elementor-element-e5f082f{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-3020 .elementor-element.elementor-element-f1605b7{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:center;--gap:56px 56px;--row-gap:56px;--column-gap:56px;}.elementor-3020 .elementor-element.elementor-element-edfcf59{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-3020 .elementor-element.elementor-element-7baa83f{--display:flex;}.elementor-3020 .elementor-element.elementor-element-646943d{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:14px 14px;--row-gap:14px;--column-gap:14px;}.elementor-3020 .elementor-element.elementor-element-8600cc5{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-3020 .elementor-element.elementor-element-808a3bb{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:center;--gap:56px 56px;--row-gap:56px;--column-gap:56px;}.elementor-3020 .elementor-element.elementor-element-717ec7a{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-3020 .elementor-element.elementor-element-14df3af{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:14px 14px;--row-gap:14px;--column-gap:14px;}.elementor-3020 .elementor-element.elementor-element-b259e6d{--display:flex;}.elementor-3020 .elementor-element.elementor-element-d24222d{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-3020 .elementor-element.elementor-element-c8e7bd9{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}@media(max-width:1024px){.elementor-3020 .elementor-element.elementor-element-f1605b7{--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-3020 .elementor-element.elementor-element-edfcf59{--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-3020 .elementor-element.elementor-element-808a3bb{--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-3020 .elementor-element.elementor-element-717ec7a{--flex-direction:column-reverse;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}}@media(max-width:767px){.elementor-3020 .elementor-element.elementor-element-f1605b7{--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-3020 .elementor-element.elementor-element-808a3bb{--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-3020 .elementor-element.elementor-element-717ec7a{--flex-direction:column-reverse;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}}@media(min-width:768px){.elementor-3020 .elementor-element.elementor-element-e5f082f{--content-width:1200px;}.elementor-3020 .elementor-element.elementor-element-f1605b7{--content-width:1200px;}.elementor-3020 .elementor-element.elementor-element-7baa83f{--width:42%;}.elementor-3020 .elementor-element.elementor-element-646943d{--width:58%;}.elementor-3020 .elementor-element.elementor-element-808a3bb{--content-width:1200px;}.elementor-3020 .elementor-element.elementor-element-14df3af{--width:58%;}.elementor-3020 .elementor-element.elementor-element-b259e6d{--width:42%;}.elementor-3020 .elementor-element.elementor-element-c8e7bd9{--content-width:1200px;}}@media(max-width:1024px) and (min-width:768px){.elementor-3020 .elementor-element.elementor-element-7baa83f{--width:100%;}.elementor-3020 .elementor-element.elementor-element-646943d{--width:100%;}.elementor-3020 .elementor-element.elementor-element-14df3af{--width:100%;}.elementor-3020 .elementor-element.elementor-element-b259e6d{--width:100%;}}/* Start custom CSS *//* =========================================================
   LEKTORZY — CSS della pagina
   Pagina → Impostazioni → CSS personalizzato
   (NON nel CSS globale: queste regole valgono solo qui)

   Contiene:
     1. intro
     2. blocco docente — griglia, foto, blob, maschere
     3. testi
     4. recensioni
     5. responsive
   Tutto il resto (bottoni, sezioni, testo attenuato) viene dai
   componenti av-* nel CSS globale.

   NOTA: Astra imposta il font-size di base a 15px, non 16. Qui le
   dimensioni sono in px proprio per questo: in rem arriverebbero
   tutte il 6% più piccole del previsto.
   ========================================================= */


/* ---------- 1. INTRO ---------- */

/* Lo spazio fra titolo e prima docente è la somma di due padding:
   quello sotto l'intro e quello sopra la riga. Ridurne uno solo
   dimezza il risultato — vanno toccati entrambi. */
.lek-intro{padding-bottom:clamp(8px, 1.2vw, 18px) !important}
.lek-intro + .lek-row,
.lek-row:first-of-type{padding-top:clamp(10px, 1.6vw, 24px) !important}

/* il sopratitolo: av-eyebrow vale .8125rem, che con root a 15px fa 12,2px */
.lek-intro .av-eyebrow .elementor-heading-title{
  font-size:18px;
  letter-spacing:.12em;
}

/* stessa scala dei nomi delle docenti */
.lek-intro__title .elementor-heading-title{
  font-family:var(--av-display);
  font-size:clamp(34px, 20px + 2vw, 48px);
  font-weight:800;
  line-height:1.02;
  letter-spacing:-.015em;
  color:var(--av-navy);
}


/* ---------- 2. BLOCCO DOCENTE ---------- */

/* la riga: foto e testo.
   Le larghezze delle due colonne NON sono qui: si impostano dal pannello
   di ciascun container figlio (Layout → Larghezza). Nella sezione di Magda
   i due container stanno nell'ordine inverso nel Navigatore, quindi non
   serve nessun order né nessuna regola di ribaltamento. */
.lek-row{align-items:center}

/* colonna foto: il blob è uno pseudo-elemento, non un widget */
.lek-media{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:clamp(16px,3vw,34px);
}
.lek-media::before{
  content:"";
  position:absolute;
  z-index:0;
  /* top/left + transform invece del solo transform: Elementor scrive
     align-items:stretch sul container e senza questi il blob viene
     allungato per tutta l'altezza della colonna */
  top:50%; left:50%;
  transform:translate(-50%,-46%);
  align-self:center;
  width:min(100%,400px);
  height:auto;
  aspect-ratio:1/1.06;
  background:var(--av-peach);
  border-radius:44% 56% 61% 39% / 47% 42% 58% 53%;
  pointer-events:none;
}
.lek-row--flip .lek-media::before{
  border-radius:58% 42% 38% 62% / 42% 56% 44% 58%;
}

/* la foto galleggia sopra il blob */
.lek-photo{position:relative; z-index:1; width:100%}
.lek-photo .elementor-widget-container{display:flex; justify-content:center}
.lek-photo img{
  display:block;
  height:auto;
  animation:lek-float 5.5s ease-in-out infinite;
  will-change:transform;
}

/* Paulina — volto più vicino all'obiettivo: ridotta del 3%.
   Taglio netto e largo sotto i fianchi: sfumatura lunga. */
.lek-photo--paulina img{
  width:min(80%,326px);
  -webkit-mask-image:linear-gradient(to bottom,#000 88%,transparent 100%);
  mask-image:linear-gradient(to bottom,#000 88%,transparent 100%);
}

/* Magda — sotto il 90% dell'altezza la metà sinistra della foto resta
   piena (la gamba che esce dal blob) mentre la destra si svuota da sé.
   Due maschere intersecate: verticale lunga + diagonale sull'angolo. */
.lek-photo--magda img{
  width:min(82%,337px);
  animation-delay:-2.6s;
  -webkit-mask-image:
    linear-gradient(to bottom,#000 80%,transparent 98%),
    linear-gradient(to bottom left,#000 56%,transparent 91%);
  mask-image:
    linear-gradient(to bottom,#000 80%,transparent 98%),
    linear-gradient(to bottom left,#000 56%,transparent 91%);
  -webkit-mask-composite:source-in;
  mask-composite:intersect;
}

@keyframes lek-float{
  0%,100%{transform:translateY(0)}
  50%    {transform:translateY(-12px)}
}
@media (prefers-reduced-motion:reduce){
  .lek-photo img{animation:none}
}


/* ---------- 3. TESTI ---------- */

.lek-name .elementor-heading-title{
  font-family:var(--av-display);
  font-size:clamp(34px, 20px + 2vw, 48px);
  font-weight:700;
  line-height:1.05;
  letter-spacing:-.015em;
  color:var(--av-navy);
  text-wrap:balance;
}

/* il ruolo: av-label vale .75rem, che con root a 15px fa 11,25px.
   Qui lo riporto a 13px in valore assoluto. */
.lek-role .elementor-heading-title{
  font-size:13px;
  letter-spacing:.12em;
  line-height:1.45;
  color:var(--av-orange);
}

/* il filo arancio sotto il nome, che si allunga passando sulla sezione */
.lek-name{position:relative; padding-bottom:18px}
.lek-name::after{
  content:"";
  position:absolute;
  left:0; bottom:0;
  width:72px; height:2px;
  background:var(--av-orange);
  transition:width .45s ease;
}
.lek-row:hover .lek-name::after{width:180px}

.lek-bio p{
  font-size:17px;
  line-height:1.62;
  color:var(--av-muted);
  max-width:58ch;
  margin:0 0 18px;
}
.lek-bio p:last-child{margin-bottom:0}

/* etichette sotto la bio */
.lek-facts ul{
  display:flex; flex-wrap:wrap; gap:8px;
  list-style:none; margin:0; padding:0;
}
.lek-facts li{
  font-size:12px; font-weight:600; letter-spacing:.02em;
  padding:6px 12px; border-radius:999px;
  border:1px solid var(--av-line);
  color:var(--av-muted);
}


/* ---------- 4. RECENSIONI ----------
   Widget HTML (non Editor di testo: quello ripulisce i <details>),
   posizionato dentro la riga come sorella di foto e testo, in ultima
   posizione. Sulla riga va attivato "A capo → Avvolgi" dal pannello.

   Ogni recensione è un <details>: si apre al click e da tastiera,
   senza JavaScript. Chiuso mostra tre righe, aperto tutto il testo.
   ------------------------------------------------------------------ */

.lek-quotes{
  width:100%;
  margin-top:36px;
}

/* il grid va sul wrapper: Elementor infila un .elementor-widget-container
   fra la classe del widget e il contenuto */
.lek-quotes .elementor-widget-container{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));
  gap:16px;
  align-items:start;
}

.lek-quotes details{
  padding:16px 18px;
  border-left:2px solid var(--av-orange);
  border-radius:0 6px 6px 0;
  background:rgba(236,127,71,.09);
}

.lek-quotes summary{
  cursor:pointer;
  list-style:none;          /* via il triangolino di default */
}
.lek-quotes summary::-webkit-details-marker{display:none}
.lek-quotes summary::marker{content:""}

/* tre righe da chiuso, tutto da aperto */
.lek-quotes summary p{
  margin:0;
  font-family:var(--av-display);
  font-size:17px;
  font-style:italic;
  line-height:1.45;
  color:var(--av-navy);
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.lek-quotes details[open] summary p{
  -webkit-line-clamp:unset;
  overflow:visible;
}

.lek-quotes cite{
  display:block;
  margin-top:10px;
  font-family:var(--av-sans);
  font-size:12px;
  font-style:normal;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--av-muted);
}

/* l'invito ad aprire, che cambia parola quando è aperto */
.lek-quotes summary::after{
  content:"Czytaj więcej";
  display:block;
  margin-top:12px;
  font-family:var(--av-sans);
  font-size:12px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--av-orange);
  text-decoration:underline;
  text-underline-offset:4px;
}
.lek-quotes details[open] summary::after{content:"Zwiń"}
.lek-quotes summary:hover::after{text-decoration-thickness:2px}

/* apertura da tastiera: senza questo il focus non si vede */
.lek-quotes summary:focus-visible{
  outline:3px solid var(--av-navy);
  outline-offset:3px;
  border-radius:2px;
}


/* ---------- 5. RESPONSIVE ----------
   La direzione delle righe (riga → colonna) si imposta dal PANNELLO,
   per breakpoint. Qui ci sono solo le dimensioni, che il pannello
   non sa esprimere: blob, foto, spaziature.
   ------------------------------------------------------------------ */

/* TABLET — fino a 1024px */
@media (max-width:1024px){
  .lek-media{padding:0}
  .lek-media::before{width:min(88%,320px)}
  .lek-photo--paulina img{width:min(70%,260px)}
  .lek-photo--magda img{width:min(72%,268px)}

  /* in colonna il testo prende tutta la larghezza. Il limite serve
     comunque: oltre gli ~80 caratteri l'occhio perde la riga tornando
     a capo. 76 lascia respiro senza arrivarci. */
  .lek-bio p{max-width:76ch}
  .lek-quotes{margin-top:28px}
  .lek-quotes .elementor-widget-container{grid-template-columns:repeat(auto-fit, minmax(240px, 1fr)); gap:14px}

  /* il blocco docente respira meno: in colonna è già alto di suo */
  .lek-row{padding-block:clamp(36px,5vw,56px) !important}
}

/* MOBILE — fino a 767px */
@media (max-width:767px){
  .lek-media::before{width:min(84%,270px)}
  .lek-photo--paulina img{width:min(66%,220px)}
  .lek-photo--magda img{width:min(68%,226px)}

  .lek-name{padding-bottom:14px}
  .lek-name::after{width:56px}

  .lek-bio p{max-width:none; font-size:16px}
  .lek-facts li{font-size:11.5px; padding:5px 10px}

  .lek-quotes{margin-top:24px}
  .lek-quotes .elementor-widget-container{grid-template-columns:1fr; gap:12px}
  .lek-quotes details{padding:14px 16px}
  .lek-quotes summary p{font-size:16px}

  /* la sfumatura in basso può essere più corta: a schermo piccolo
     il taglio si nota meno e la foto è già ridotta */
  .lek-photo--paulina img{
    -webkit-mask-image:linear-gradient(to bottom,#000 91%,transparent 100%);
    mask-image:linear-gradient(to bottom,#000 91%,transparent 100%);
  }
}/* End custom CSS */