/* ============================================================
   LABORATORIO - case study "Come lavoro con l'AI" (sessione 35)
   Pagina /laboratorio-metodo. Cornici e colori sono quelli del sito
   (.cd-card, variabili --cd-*): qui solo le card dei progetti, la
   scheda in modale e i due riquadri dei ruoli.
   ============================================================ */
.cd-metodo{padding-bottom:1.5rem}
/* Il titolo e' lungo: il banner cresce invece di tagliarlo */
.cd-metodo .cd-illu-banner{height:auto;min-height:140px}
.cd-metodo .cd-illu-text{padding-top:1rem;padding-bottom:1rem}

.mt-bozza{background:#fff8e6;border:1px solid #f2dca8;border-left:4px solid #d4760a;border-radius:8px;
  padding:.6rem .9rem;font-size:.85rem;color:#6b4a06;margin-bottom:1rem}

.mt-testo p,.mt-testo li,.mt-testo dd{font-size:.9rem;line-height:1.65;color:#3b4654}
.mt-testo p:last-child{margin-bottom:0}
.mt-lead{font-size:1rem !important;color:var(--cd-text) !important}

/* Ruoli: due colonne affiancate, una per parte */
.mt-ruolo{height:100%;border:1px solid var(--cd-border);border-radius:var(--cd-radius);padding:.9rem 1rem;background:#fff}
.mt-ruolo.io{border-top:3px solid var(--cd-accent)}
.mt-ruolo.claude{border-top:3px solid var(--cd-blu)}
.mt-ruolo h2{font-family:'Montserrat',sans-serif;font-size:1rem;font-weight:700;color:var(--cd-blu-scuro);margin:0 0 .5rem}
.mt-ruolo ul{margin:0;padding-left:1.1rem}
.mt-ruolo li{margin-bottom:.2rem}

/* Intestazione di gruppo: h2 vero, aspetto del cd-card-header */
.mt-gruppo{font-size:inherit;font-weight:inherit;font-family:inherit;color:inherit;margin:0}
.mt-gruppo i{margin-right:.3rem}

/* ---- Card progetto ----
   Tutta la card e' cliccabile (stretched-link sul pulsante del titolo),
   ma il fuoco da tastiera va su un solo elemento: il pulsante. */
.mt-card{position:relative;display:flex;flex-direction:column;overflow:hidden;
  transition:border-color .15s,box-shadow .15s,transform .15s}
.mt-card:not(.piccola):hover{border-color:var(--cd-blu);box-shadow:0 8px 22px rgba(16,24,40,.09);transform:translateY(-2px)}
.mt-card:focus-within{outline:3px solid var(--cd-accent);outline-offset:2px}
.mt-media{position:relative;aspect-ratio:16/9;background:var(--cd-blu-light);overflow:hidden}
.mt-media img{width:100%;height:100%;object-fit:cover;display:block}
.mt-media .mt-stato{position:absolute;top:.5rem;left:.5rem}
.mt-segnaposto{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:.3rem;color:#7a95b3;background:repeating-linear-gradient(135deg,#eef4fb 0 12px,#e6eef8 12px 24px)}
.mt-segnaposto i{font-size:2rem}
.mt-segnaposto code{font-size:.7rem;color:#51606f;background:rgba(255,255,255,.8);padding:.1rem .35rem;border-radius:4px}
.mt-body{padding:.9rem 1rem 1rem;display:flex;flex-direction:column;flex:1 1 auto}
.mt-tit{font-family:'Montserrat',sans-serif;font-weight:700;font-size:1rem;line-height:1.3;margin:0 0 .45rem;color:var(--cd-blu-scuro)}
.mt-tit button{all:unset;cursor:pointer}
.mt-tit button:focus-visible{text-decoration:underline}
.mt-cosa{font-size:.83rem;line-height:1.5;color:var(--cd-muted);margin:0 0 .6rem;
  display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.mt-card.piccola .mt-cosa{-webkit-line-clamp:unset;display:block}
.mt-evid{font-size:.85rem;font-weight:700;color:#14532d;background:#ecfdf3;border-radius:6px;padding:.4rem .6rem;margin:0 0 .6rem}
.mt-evid i{margin-right:.2rem}
.mt-apri{margin-top:auto;font-size:.8rem;font-weight:700;color:var(--cd-blu)}
.mt-apri i{transition:transform .15s}
.mt-card:hover .mt-apri i{transform:translateX(3px)}
.mt-card.piccola{border-style:dashed;background:#fcfcfb}

/* Etichette di stato: sempre parola, mai solo colore */
.mt-stato{display:inline-block;font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;
  padding:.2rem .5rem;border-radius:999px;background:#fff;border:1px solid currentColor}
.mt-stato.sviluppo{color:#8a6410}
.mt-stato.privata{color:#51606f}
.mt-stato.ideazione{color:#6d28d9}
.mt-card.piccola .mt-stato{align-self:flex-start;margin-bottom:.4rem}

/* ---- Scheda completa (modale) ---- */
#mtModal .modal-title{font-family:'Montserrat',sans-serif;font-weight:700;font-size:1.15rem;color:var(--cd-blu-scuro)}
.mt-det-media{aspect-ratio:16/9;border-radius:var(--cd-radius);overflow:hidden;margin-bottom:1rem;background:var(--cd-blu-light)}
.mt-det-media img{width:100%;height:100%;object-fit:cover;display:block}
.mt-dl{margin:0 0 1rem}
.mt-dl dt{font-family:'Montserrat',sans-serif;font-size:.85rem;font-weight:700;color:var(--cd-blu-scuro);margin-top:.8rem}
.mt-dl dt i{color:var(--cd-blu);margin-right:.25rem}
.mt-dl dd{margin:.15rem 0 0}

.mt-imparato{margin:0;padding-left:1.1rem}
.mt-imparato li{margin-bottom:.5rem}
.mt-contatto .cd-card-body{font-size:.95rem}
.mt-contatto i{color:var(--cd-blu);margin-right:.3rem}

@media (prefers-reduced-motion:reduce){.mt-card,.mt-apri i{transition:none}.mt-card:not(.piccola):hover{transform:none}}