/* Non-Critical CSS - Caricamento asincrono */
#biografia::after{ content:""; display:block; clear:both }
#biografia h3{ margin:30px 0 6px; clear:both; position:relative }
#biografia h3::after{ content:""; position:absolute; left:0; bottom:-8px; width:56px; height:2px; background:var(--accent); border-radius:2px }
#biografia h3 + p.muted{ margin:3px 0 14px }
#biografia p{ margin:0 0 14px }
#biografia p + h3{ margin-top:34px }
#biografia h3:not(:first-of-type){ border-top:1px solid var(--border); padding-top:16px }

.bio-block{ padding:16px 18px; border-radius:14px; position:relative }
.bio-block:nth-of-type(even){ background:#FAFBFC; border:1px solid var(--border) }
.bio-block + .bio-block{ margin-top:18px }

.chapter-badge{ float:right; clear:right; margin:4px 0 12px 16px; color:var(--accent); aspect-ratio: 1 / 1; min-height: 110px; }
.chapter-badge img,.chapter-badge svg{ width:110px; height:auto; display:block }
.chapter-badge svg, .chapter-badge svg *{ fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round }
@media (max-width:560px){
  .chapter-badge{ float:none; margin:8px auto 12px; text-align:center }
  .chapter-badge img,.chapter-badge svg{ width:96px }
}

.badge-stack{ float:right; text-align:right; margin:4px 0 12px 16px; max-width:132px }
.badge-stack>*{ display:block; margin:0 0 12px 0 }
.badge-stack .chapter-badge{ float:none; clear:none; margin:0 0 12px 0; display:inline-block }
.badge-stack .badge{ display:inline-block }
@media (max-width:560px){
  .badge-stack{ float:none; text-align:center; margin:10px auto 12px }
  .badge-stack>*{ display:inline-block; margin:0 8px }
}

/* MIGLIORAMENTO ACCESSIBILITÀ: Sottolineatura link nel corpo del testo */
main p a {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}

/* MIGLIORAMENTO CONTRASTO: Certificazioni */
#certificazioni .achievements li {
  color: var(--ink-strong); /* Assicura alto contrasto per tutto il testo della lista */
}
#certificazioni .achievements li a,
#certificazioni .achievements li strong,
#certificazioni .achievements li .nb {
  color: var(--ink-strong); /* Forza il colore per tutti gli elementi interni */
}

#certificazioni .achievements{ display:grid; grid-template-columns:1fr; gap:12px 40px; margin:12px 0 0; padding-left:0 }
@media (min-width:900px){ #certificazioni .achievements{ grid-template-columns:1fr 1fr } }

#certificazioni .achievements li{
  list-style:none; position:relative; display:block; margin:0;
  padding:4px 0 4px 24px; line-height:1.55; text-align:left;
}

#certificazioni .achievements .trophy{
  position:absolute; left:0; top:.28em; width:14px; height:14px; display:block;
  background:linear-gradient(180deg, var(--accent) 0%, #004d00 100%);
  -webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M5 4h14v2h2a5 5 0 0 1-5 5h-1.1A4 4 0 0 1 13 13v3h3v2H8v-2h3v-3a4 4 0 0 1-1.9-2.99H8a5 5 0 0 1-5-5h2V4Zm14 2v1a3 3 0 0 0 3-3h-3Zm-14 0H2a3 3 0 0 0 3 3V6Z"/></svg>');
  mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M5 4h14v2h2a5 5 0 0 1-5 5h-1.1A4 4 0 0 1 13 13v3h3v2H8v-2h3v-3a4 4 0 0 1-1.9-2.99H8a5 5 0 0 1-5-5h2V4Zm14 2v1a3 3 0 0 0 3-3h-3Zm-14 0H2a3 3 0 0 0 3 3V6Z"/></svg>');
  -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat;
  -webkit-mask-position:center;  mask-position:center;
  -webkit-mask-size:contain;     mask-size:contain;
}

#certificazioni .achievements a,
#certificazioni .achievements strong{
  font-weight:600; text-decoration-thickness:.06em; text-underline-offset:.16em;
}
#certificazioni .achievements a{ white-space:normal; overflow-wrap:anywhere }
.nb{ white-space:nowrap }

.toc{ display:none }
@media (max-width:640px){
  .toc{ display:block; margin:12px 0 20px }
  .toc ul{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:1fr; gap:10px }
  .toc a{
    display:block; padding:12px 14px; background:#fff; border:1px solid var(--border);
    border-radius:12px; color:var(--ink); box-shadow:0 1px 0 rgba(0,0,0,.03);
  }
  .toc a:hover, .toc a:focus-visible{ border-color:var(--accent); box-shadow:0 2px 8px rgba(0,128,0,.1) }
}

.contact-grid{ display:grid; gap:24px; align-items:start }
@media (min-width:900px){ .contact-grid{ grid-template-columns:minmax(0,1fr) 420px } }

.contact-copy .cta-row{ display:flex; gap:12px; flex-wrap:wrap; margin:12px 0 6px }
.contact-copy .small{ font-size:.95rem }

.contact-map{
  background:#fff; border:1px solid var(--border); border-radius:14px; padding:12px;
  box-shadow:0 2px 10px rgba(0,0,0,.04); transition:box-shadow .2s, transform .2s;
}
.contact-map:hover{ box-shadow:0 8px 24px rgba(0,0,0,.10); transform:translateY(-1px) }

.map-media{ position:relative; width:100%; height:clamp(160px,21vw,180px); border-radius:10px; overflow:hidden; background:#f3f5f6 }
.map-media img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .25s }
.contact-map:hover .map-media img{ transform:scale(1.03) }

.map-pin{
  position:absolute; left:50%; top:50%; width:26px; height:26px; transform:translate(-50%,-70%);
  background:var(--accent);
  -webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 2a8 8 0 0 0-8 8c0 5.1 6.3 11 7.2 11.8.5.4 1.1.4 1.6 0C13.7 21 20 15.1 20 10a8 8 0 0 0-8-8z"/></svg>');
  mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M5 4h14v2h2a5 5 0 0 1-5 5h-1.1A4 4 0 0 1 13 13v3h3v2H8v-2h3v-3a4 4 0 0 1-1.9-2.99H8a5 5 0 0 1-5-5h2V4Zm14 2v1a3 3 0 0 0 3-3h-3Zm-14 0H2a3 3 0 0 0 3 3V6Z"/></svg>');
  -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat;
  -webkit-mask-position:center;  mask-position:center;
  -webkit-mask-size:contain;     mask-size:contain;
}
.map-pin::after{ content:""; position:absolute; left:50%; top:40%; width:6px; height:6px; border-radius:50%; background:#fff; transform:translate(-50%,-50%) }

.map-caption{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:10px; font-size:.95rem }
.contact-map .open-maps{ white-space:nowrap }
@media (max-width:899px){ .map-caption{ justify-content:flex-start; gap:12px; flex-wrap:wrap } }

#contatto{ padding-bottom:16px }
@media (max-width:640px){ #contatto{ padding-bottom:12px } }
