Sezione Card Banner Links

Sezione con griglia di card link tematici, usata per raccogliere collegamenti a siti web o risorse correlate con icone identificative.

Comportamento

<section> con intestazione @section-header e griglia di card @card--sito-tematico. Disponibile in diverse configurazioni di griglia e con variante a singola card.

Varianti

• default: Griglia 4 colonne (da md:2, da lg:4) — fino a 8 card
• grid-2: Griglia 2 colonne (da md) con card @card--sito-tematico-l
• single: Singola card con container ridotto (container-xs)
• sr-only-heading: Intestazione “Link utili” visibile solo a screen reader

Dipendenze

• @section-header — intestazione sezione
• @card--sito-tematico — card link con icona (variante default e single)
• @card--sito-tematico-l — card link grande (variante grid-2)

Stili CSS

• .rtds-section--siti-web-collegati: Modificatore della sezione
• La lista usa role="list" per compatibilità con screen reader
• Griglia: md:grid-cols-2, lg:grid-cols-4 (variante default)

Accessibilità

WCAG 2.1

Livello AA — criteri pertinenti:

• 1.3.1 Informazioni e correlazioni — la sezione è un <section> con intestazione; la lista usa role="list" per mantenere la semantica con CSS list-style: none
• 2.4.6 Intestazioni ed etichette — l’intestazione identifica la sezione per gli screen reader; la variante sr-only-heading la rende visibile solo ai lettori di schermo

Esempi di utilizzo

<section class="rtds-section rtds-section--siti-web-collegati rtds-py-8 md:rtds-py-12">
    <div class="rtds-container rtds-space-y-4">
        <div class="rtds-section-header rtds-section-header--siti-web-collegati">
    <div class="rtds-flex rtds-items-center rtds-gap-4 md:rtds-gap-6 rtds-content-01">
        <div class="rtds-flex rtds-flex-wrap rtds-items-center rtds-gap-2 md:rtds-gap-4">
            
            <h2 class="rtds-heading-3 md:rtds-heading-2">Titolo sezione</h2>
            
                <div class="rtds-vertical-divider rtds-w-4 md:rtds-w-6 lg:rtds-w-8">
    <img class="rtds-w-full rtds-h-auto" src="../../images/vertical-divider.svg" alt="">
</div>

            
            
            
        </div>

        
            
        
    </div>
</div>
        <div class="rtds-space-y-5">
            <ul role="list" class="rtds-grid rtds-gap-4 md:rtds-grid-cols-2 lg:rtds-grid-cols-4">
                <li class="rtds-col"><div
  class="rtds-card rtds-card--sito-tematico rtds-bg-gradient-04 is-card-fullclickable rtds-group/card"
>

  
  <picture class="rtds-card__image-wrapper
  ">
    <img
      class="rtds-card__image"
      alt=""
      src="../../images/card-image.jpg"
    />
  </picture>
  

  
  <div class="rtds-card__content">
    
    
    

    <div class="rtds-card__heading">

      
      

      
        <h3 class="rtds-card__title">
          <a class="group-hover/card:rtds-underline rtds-flex rtds-items-center" href="">
            
    
        <img alt="" width="24" height="24" src="../../images/icone-siti/toscana-notizie-icon.png" srcset="../../images/icone-siti/toscana-notizie-icon.png 1x, ../../images/logo-card@2x.png 2x" class="rtds-card__logo">
    

            Toscana Notizie
            
              
            
            
              
                  <svg
  class="rtds-icon rtds-fill-current rtds-flex-shrink-0"
  aria-hidden="true"
  focusable="false"
  role="img"
>
  <use href="../../icons.svg#mini--arrow-small-right" />
</svg>

              
            
            
          </a>
        </h3>
      

      
      
        

      
      
    </div>

    
      
     

    
    

    
    
    

    
      
    
   
    
      
    
   
    
      
    

    
    
    

    
    
    
  </div>
  
  
</div>
</li>
                <li class="rtds-col"><div
  class="rtds-card rtds-card--sito-tematico rtds-bg-gradient-04 is-card-fullclickable rtds-group/card"
>

  
  <picture class="rtds-card__image-wrapper
  ">
    <img
      class="rtds-card__image"
      alt=""
      src="../../images/card-image.jpg"
    />
  </picture>
  

  
  <div class="rtds-card__content">
    
    
    

    <div class="rtds-card__heading">

      
      

      
        <h3 class="rtds-card__title">
          <a class="group-hover/card:rtds-underline rtds-flex rtds-items-center" href="">
            
    
        <img alt="" width="24" height="24" src="../../images/icone-siti/giovanisi-icon.png" srcset="../../images/icone-siti/giovanisi-icon.png 1x, ../../images/logo-card@2x.png 2x" class="rtds-card__logo">
    

            GiovaniSì
            
              
            
            
              
                  <svg
  class="rtds-icon rtds-fill-current rtds-flex-shrink-0"
  aria-hidden="true"
  focusable="false"
  role="img"
>
  <use href="../../icons.svg#mini--arrow-small-right" />
</svg>

              
            
            
          </a>
        </h3>
      

      
      
        

      
      
    </div>

    
      
     

    
    

    
    
    

    
      
    
   
    
      
    
   
    
      
    

    
    
    

    
    
    
  </div>
  
  
</div>
</li>
                <li class="rtds-col"><div
  class="rtds-card rtds-card--sito-tematico rtds-bg-gradient-04 is-card-fullclickable rtds-group/card"
>

  
  <picture class="rtds-card__image-wrapper
  ">
    <img
      class="rtds-card__image"
      alt=""
      src="../../images/card-image.jpg"
    />
  </picture>
  

  
  <div class="rtds-card__content">
    
    
    

    <div class="rtds-card__heading">

      
      

      
        <h3 class="rtds-card__title">
          <a class="group-hover/card:rtds-underline rtds-flex rtds-items-center" href="">
            
    
        <img alt="" width="24" height="24" src="../../images/icone-siti/open-toscana-icon.png" srcset="../../images/icone-siti/open-toscana-icon.png 1x, ../../images/logo-card@2x.png 2x" class="rtds-card__logo">
    

            Open Toscana
            
              
            
            
              
                  <svg
  class="rtds-icon rtds-fill-current rtds-flex-shrink-0"
  aria-hidden="true"
  focusable="false"
  role="img"
>
  <use href="../../icons.svg#mini--arrow-small-right" />
</svg>

              
            
            
          </a>
        </h3>
      

      
      
        

      
      
    </div>

    
      
     

    
    

    
    
    

    
      
    
   
    
      
    
   
    
      
    

    
    
    

    
    
    
  </div>
  
  
</div>
</li>
                <li class="rtds-col"><div
  class="rtds-card rtds-card--sito-tematico rtds-bg-gradient-04 is-card-fullclickable rtds-group/card"
>

  
  <picture class="rtds-card__image-wrapper
  ">
    <img
      class="rtds-card__image"
      alt=""
      src="../../images/card-image.jpg"
    />
  </picture>
  

  
  <div class="rtds-card__content">
    
    
    

    <div class="rtds-card__heading">

      
      

      
        <h3 class="rtds-card__title">
          <a class="group-hover/card:rtds-underline rtds-flex rtds-items-center" href="">
            
    
        <img alt="" width="24" height="24" src="../../images/icone-siti/toscana-accessibile-icon.png" srcset="../../images/icone-siti/toscana-accessibile-icon.png 1x, ../../images/logo-card@2x.png 2x" class="rtds-card__logo">
    

            Toscana Accessibile
            
              
            
            
              
                  <svg
  class="rtds-icon rtds-fill-current rtds-flex-shrink-0"
  aria-hidden="true"
  focusable="false"
  role="img"
>
  <use href="../../icons.svg#mini--arrow-small-right" />
</svg>

              
            
            
          </a>
        </h3>
      

      
      
        

      
      
    </div>

    
      
     

    
    

    
    
    

    
      
    
   
    
      
    
   
    
      
    

    
    
    

    
    
    
  </div>
  
  
</div>
</li>
                <li class="rtds-col"><div
  class="rtds-card rtds-card--sito-tematico rtds-bg-gradient-04 is-card-fullclickable rtds-group/card"
>

  
  <picture class="rtds-card__image-wrapper
  ">
    <img
      class="rtds-card__image"
      alt=""
      src="../../images/card-image.jpg"
    />
  </picture>
  

  
  <div class="rtds-card__content">
    
    
    

    <div class="rtds-card__heading">

      
      

      
        <h3 class="rtds-card__title">
          <a class="group-hover/card:rtds-underline rtds-flex rtds-items-center" href="">
            
    
        <img alt="" width="24" height="24" src="../../images/icone-siti/digital-innovation-hub-icon.png" srcset="../../images/icone-siti/digital-innovation-hub-icon.png 1x, ../../images/logo-card@2x.png 2x" class="rtds-card__logo">
    

            Digital Innovation Hub - Industria 4.0
            
              
            
            
              
                  <svg
  class="rtds-icon rtds-fill-current rtds-flex-shrink-0"
  aria-hidden="true"
  focusable="false"
  role="img"
>
  <use href="../../icons.svg#mini--arrow-small-right" />
</svg>

              
            
            
          </a>
        </h3>
      

      
      
        

      
      
    </div>

    
      
     

    
    

    
    
    

    
      
    
   
    
      
    
   
    
      
    

    
    
    

    
    
    
  </div>
  
  
</div>
</li>
                <li class="rtds-col"><div
  class="rtds-card rtds-card--sito-tematico rtds-bg-gradient-04 is-card-fullclickable rtds-group/card"
>

  
  <picture class="rtds-card__image-wrapper
  ">
    <img
      class="rtds-card__image"
      alt=""
      src="../../images/card-image.jpg"
    />
  </picture>
  

  
  <div class="rtds-card__content">
    
    
    

    <div class="rtds-card__heading">

      
      

      
        <h3 class="rtds-card__title">
          <a class="group-hover/card:rtds-underline rtds-flex rtds-items-center" href="">
            
    
        <img alt="" width="24" height="24" src="../../images/icone-siti/muoversi-in-toscana-icon.png" srcset="../../images/icone-siti/muoversi-in-toscana-icon.png 1x, ../../images/logo-card@2x.png 2x" class="rtds-card__logo">
    

            Muoversi in Toscana
            
              
            
            
              
                  <svg
  class="rtds-icon rtds-fill-current rtds-flex-shrink-0"
  aria-hidden="true"
  focusable="false"
  role="img"
>
  <use href="../../icons.svg#mini--arrow-small-right" />
</svg>

              
            
            
          </a>
        </h3>
      

      
      
        

      
      
    </div>

    
      
     

    
    

    
    
    

    
      
    
   
    
      
    
   
    
      
    

    
    
    

    
    
    
  </div>
  
  
</div>
</li>
                <li class="rtds-col"><div
  class="rtds-card rtds-card--sito-tematico rtds-bg-gradient-04 is-card-fullclickable rtds-group/card"
>

  
  <picture class="rtds-card__image-wrapper
  ">
    <img
      class="rtds-card__image"
      alt=""
      src="../../images/card-image.jpg"
    />
  </picture>
  

  
  <div class="rtds-card__content">
    
    
    

    <div class="rtds-card__heading">

      
      

      
        <h3 class="rtds-card__title">
          <a class="group-hover/card:rtds-underline rtds-flex rtds-items-center" href="">
            
    
        <img alt="" width="24" height="24" src="../../images/icone-siti/toscana-digitale-icon.png" srcset="../../images/icone-siti/toscana-digitale-icon.png 1x, ../../images/logo-card@2x.png 2x" class="rtds-card__logo">
    

            Toscana Digitale
            
              
            
            
              
                  <svg
  class="rtds-icon rtds-fill-current rtds-flex-shrink-0"
  aria-hidden="true"
  focusable="false"
  role="img"
>
  <use href="../../icons.svg#mini--arrow-small-right" />
</svg>

              
            
            
          </a>
        </h3>
      

      
      
        

      
      
    </div>

    
      
     

    
    

    
    
    

    
      
    
   
    
      
    
   
    
      
    

    
    
    

    
    
    
  </div>
  
  
</div>
</li>
                <li class="rtds-col"><div
  class="rtds-card rtds-card--sito-tematico rtds-bg-gradient-04 is-card-fullclickable rtds-group/card"
>

  
  <picture class="rtds-card__image-wrapper
  ">
    <img
      class="rtds-card__image"
      alt=""
      src="../../images/card-image.jpg"
    />
  </picture>
  

  
  <div class="rtds-card__content">
    
    
    

    <div class="rtds-card__heading">

      
      

      
        <h3 class="rtds-card__title">
          <a class="group-hover/card:rtds-underline rtds-flex rtds-items-center" href="">
            
    
        <img alt="" width="24" height="24" src="../../images/icone-siti/urp-icon.png" srcset="../../images/icone-siti/urp-icon.png 1x, ../../images/logo-card@2x.png 2x" class="rtds-card__logo">
    

            Ufficio Relazioni con il Pubblico
            
              
            
            
              
                  <svg
  class="rtds-icon rtds-fill-current rtds-flex-shrink-0"
  aria-hidden="true"
  focusable="false"
  role="img"
>
  <use href="../../icons.svg#mini--arrow-small-right" />
</svg>

              
            
            
          </a>
        </h3>
      

      
      
        

      
      
    </div>

    
      
     

    
    

    
    
    

    
      
    
   
    
      
    
   
    
      
    

    
    
    

    
    
    
  </div>
  
  
</div>
</li>
            </ul>
        </div>
    </div>

</section>
<section class="rtds-section rtds-section--siti-web-collegati rtds-py-8 md:rtds-py-12">
    <div class="rtds-container rtds-space-y-4">
        <div class="rtds-section-header rtds-section-header--siti-web-collegati">
    <div class="rtds-flex rtds-items-center rtds-gap-4 md:rtds-gap-6 rtds-content-01">
        <div class="rtds-flex rtds-flex-wrap rtds-items-center rtds-gap-2 md:rtds-gap-4">
            
            <h2 class="rtds-heading-3 md:rtds-heading-2">Titolo sezione</h2>
            
                <div class="rtds-vertical-divider rtds-w-4 md:rtds-w-6 lg:rtds-w-8">
    <img class="rtds-w-full rtds-h-auto" src="../../images/vertical-divider.svg" alt="">
</div>

            
            
            
        </div>

        
            
        
    </div>
</div>
        <div class="rtds-space-y-5">
            <ul role="list" class="rtds-grid rtds-gap-4 md:rtds-grid-cols-2">
                <li class="rtds-col"><div
  class="rtds-card rtds-card--sito-tematico rtds-card--sito-tematico-l rtds-bg-gradient-04 is-card-fullclickable rtds-group/card"
>

  
  <picture class="rtds-card__image-wrapper
  ">
    <img
      class="rtds-card__image"
      alt=""
      src="../../images/card-image.jpg"
    />
  </picture>
  

  
  <div class="rtds-card__content">
    
    
    

    <div class="rtds-card__heading">

      
      

      
        <h3 class="rtds-card__title">
          <a class="group-hover/card:rtds-underline rtds-flex rtds-items-center" href="">
            
            
            Toscana Notizie
            
              
            
            
              
                  <svg
  class="rtds-icon rtds-fill-current rtds-flex-shrink-0"
  aria-hidden="true"
  focusable="false"
  role="img"
>
  <use href="../../icons.svg#mini--arrow-small-right" />
</svg>

              
            
            
          </a>
        </h3>
      

      
      
        

      
      
    </div>

    
      
     

    
    

    
    
    

    
      
    
   
    
      
    
   
    
      
    

    
    
    

    
    
    
  </div>
  
  
</div>
</li>
                <li class="rtds-col"><div
  class="rtds-card rtds-card--sito-tematico rtds-card--sito-tematico-l rtds-bg-gradient-04 is-card-fullclickable rtds-group/card"
>

  
  <picture class="rtds-card__image-wrapper
  ">
    <img
      class="rtds-card__image"
      alt=""
      src="../../images/card-image.jpg"
    />
  </picture>
  

  
  <div class="rtds-card__content">
    
    
    

    <div class="rtds-card__heading">

      
      

      
        <h3 class="rtds-card__title">
          <a class="group-hover/card:rtds-underline rtds-flex rtds-items-center" href="">
            
            
            GiovaniSì
            
              
            
            
              
                  <svg
  class="rtds-icon rtds-fill-current rtds-flex-shrink-0"
  aria-hidden="true"
  focusable="false"
  role="img"
>
  <use href="../../icons.svg#mini--arrow-small-right" />
</svg>

              
            
            
          </a>
        </h3>
      

      
      
        

      
      
    </div>

    
      
     

    
    

    
    
    

    
      
    
   
    
      
    
   
    
      
    

    
    
    

    
    
    
  </div>
  
  
</div>
</li>
                <li class="rtds-col"><div
  class="rtds-card rtds-card--sito-tematico rtds-card--sito-tematico-l rtds-bg-gradient-04 is-card-fullclickable rtds-group/card"
>

  
  <picture class="rtds-card__image-wrapper
  ">
    <img
      class="rtds-card__image"
      alt=""
      src="../../images/card-image.jpg"
    />
  </picture>
  

  
  <div class="rtds-card__content">
    
    
    

    <div class="rtds-card__heading">

      
      

      
        <h3 class="rtds-card__title">
          <a class="group-hover/card:rtds-underline rtds-flex rtds-items-center" href="">
            
            
            Open Toscana
            
              
            
            
              
                  <svg
  class="rtds-icon rtds-fill-current rtds-flex-shrink-0"
  aria-hidden="true"
  focusable="false"
  role="img"
>
  <use href="../../icons.svg#mini--arrow-small-right" />
</svg>

              
            
            
          </a>
        </h3>
      

      
      
        

      
      
    </div>

    
      
     

    
    

    
    
    

    
      
    
   
    
      
    
   
    
      
    

    
    
    

    
    
    
  </div>
  
  
</div>
</li>
                <li class="rtds-col"><div
  class="rtds-card rtds-card--sito-tematico rtds-card--sito-tematico-l rtds-bg-gradient-04 is-card-fullclickable rtds-group/card"
>

  
  <picture class="rtds-card__image-wrapper
  ">
    <img
      class="rtds-card__image"
      alt=""
      src="../../images/card-image.jpg"
    />
  </picture>
  

  
  <div class="rtds-card__content">
    
    
    

    <div class="rtds-card__heading">

      
      

      
        <h3 class="rtds-card__title">
          <a class="group-hover/card:rtds-underline rtds-flex rtds-items-center" href="">
            
            
            Toscana Accessibile
            
              
            
            
              
                  <svg
  class="rtds-icon rtds-fill-current rtds-flex-shrink-0"
  aria-hidden="true"
  focusable="false"
  role="img"
>
  <use href="../../icons.svg#mini--arrow-small-right" />
</svg>

              
            
            
          </a>
        </h3>
      

      
      
        

      
      
    </div>

    
      
     

    
    

    
    
    

    
      
    
   
    
      
    
   
    
      
    

    
    
    

    
    
    
  </div>
  
  
</div>
</li>
                <li class="rtds-col"><div
  class="rtds-card rtds-card--sito-tematico rtds-card--sito-tematico-l rtds-bg-gradient-04 is-card-fullclickable rtds-group/card"
>

  
  <picture class="rtds-card__image-wrapper
  ">
    <img
      class="rtds-card__image"
      alt=""
      src="../../images/card-image.jpg"
    />
  </picture>
  

  
  <div class="rtds-card__content">
    
    
    

    <div class="rtds-card__heading">

      
      

      
        <h3 class="rtds-card__title">
          <a class="group-hover/card:rtds-underline rtds-flex rtds-items-center" href="">
            
            
            Digital Innovation Hub - Industria 4.0
            
              
            
            
              
                  <svg
  class="rtds-icon rtds-fill-current rtds-flex-shrink-0"
  aria-hidden="true"
  focusable="false"
  role="img"
>
  <use href="../../icons.svg#mini--arrow-small-right" />
</svg>

              
            
            
          </a>
        </h3>
      

      
      
        

      
      
    </div>

    
      
     

    
    

    
    
    

    
      
    
   
    
      
    
   
    
      
    

    
    
    

    
    
    
  </div>
  
  
</div>
</li>
                <li class="rtds-col"><div
  class="rtds-card rtds-card--sito-tematico rtds-card--sito-tematico-l rtds-bg-gradient-04 is-card-fullclickable rtds-group/card"
>

  
  <picture class="rtds-card__image-wrapper
  ">
    <img
      class="rtds-card__image"
      alt=""
      src="../../images/card-image.jpg"
    />
  </picture>
  

  
  <div class="rtds-card__content">
    
    
    

    <div class="rtds-card__heading">

      
      

      
        <h3 class="rtds-card__title">
          <a class="group-hover/card:rtds-underline rtds-flex rtds-items-center" href="">
            
            
            Muoversi in Toscana
            
              
            
            
              
                  <svg
  class="rtds-icon rtds-fill-current rtds-flex-shrink-0"
  aria-hidden="true"
  focusable="false"
  role="img"
>
  <use href="../../icons.svg#mini--arrow-small-right" />
</svg>

              
            
            
          </a>
        </h3>
      

      
      
        

      
      
    </div>

    
      
     

    
    

    
    
    

    
      
    
   
    
      
    
   
    
      
    

    
    
    

    
    
    
  </div>
  
  
</div>
</li>
                <li class="rtds-col"><div
  class="rtds-card rtds-card--sito-tematico rtds-card--sito-tematico-l rtds-bg-gradient-04 is-card-fullclickable rtds-group/card"
>

  
  <picture class="rtds-card__image-wrapper
  ">
    <img
      class="rtds-card__image"
      alt=""
      src="../../images/card-image.jpg"
    />
  </picture>
  

  
  <div class="rtds-card__content">
    
    
    

    <div class="rtds-card__heading">

      
      

      
        <h3 class="rtds-card__title">
          <a class="group-hover/card:rtds-underline rtds-flex rtds-items-center" href="">
            
            
            Toscana Digitale
            
              
            
            
              
                  <svg
  class="rtds-icon rtds-fill-current rtds-flex-shrink-0"
  aria-hidden="true"
  focusable="false"
  role="img"
>
  <use href="../../icons.svg#mini--arrow-small-right" />
</svg>

              
            
            
          </a>
        </h3>
      

      
      
        

      
      
    </div>

    
      
     

    
    

    
    
    

    
      
    
   
    
      
    
   
    
      
    

    
    
    

    
    
    
  </div>
  
  
</div>
</li>
                <li class="rtds-col"><div
  class="rtds-card rtds-card--sito-tematico rtds-card--sito-tematico-l rtds-bg-gradient-04 is-card-fullclickable rtds-group/card"
>

  
  <picture class="rtds-card__image-wrapper
  ">
    <img
      class="rtds-card__image"
      alt=""
      src="../../images/card-image.jpg"
    />
  </picture>
  

  
  <div class="rtds-card__content">
    
    
    

    <div class="rtds-card__heading">

      
      

      
        <h3 class="rtds-card__title">
          <a class="group-hover/card:rtds-underline rtds-flex rtds-items-center" href="">
            
            
            Ufficio Relazioni con il Pubblico
            
              
            
            
              
                  <svg
  class="rtds-icon rtds-fill-current rtds-flex-shrink-0"
  aria-hidden="true"
  focusable="false"
  role="img"
>
  <use href="../../icons.svg#mini--arrow-small-right" />
</svg>

              
            
            
          </a>
        </h3>
      

      
      
        

      
      
    </div>

    
      
     

    
    

    
    
    

    
      
    
   
    
      
    
   
    
      
    

    
    
    

    
    
    
  </div>
  
  
</div>
</li>
            </ul>
        </div>
    </div>

</section>
<section class="rtds-section rtds-section--siti-web-collegati rtds-py-8 md:rtds-py-12">
    <div class="rtds-container-xs rtds-space-y-4">
        
        <div class="rtds-space-y-5">
            <div
  class="rtds-card rtds-card--sito-tematico rtds-card--sito-tematico-l rtds-bg-gradient-04 is-card-fullclickable rtds-group/card"
>

  
  <picture class="rtds-card__image-wrapper
  ">
    <img
      class="rtds-card__image"
      alt=""
      src="../../images/card-image.jpg"
    />
  </picture>
  

  
  <div class="rtds-card__content">
    
    
    

    <div class="rtds-card__heading">

      
      

      
        <h2 class="rtds-card__title">
          <a class="group-hover/card:rtds-underline rtds-flex rtds-items-center" href="">
            
            
            Servizio Sanitario Toscana
            
              
            
            
              
                  <svg
  class="rtds-icon rtds-fill-current rtds-flex-shrink-0"
  aria-hidden="true"
  focusable="false"
  role="img"
>
  <use href="../../icons.svg#mini--arrow-small-right" />
</svg>

              
            
            
          </a>
        </h2>
      

      
      
        

      
      
    </div>

    
      
     

    
    

    
    
    

    
      
    
   
    
      
    
   
    
      
    

    
    
    

    
    
    
  </div>
  
  
</div>

        </div>
    </div>

</section>
<section class="rtds-section rtds-section--siti-web-collegati rtds-py-8 md:rtds-py-12">
    <div class="rtds-container rtds-space-y-4">
        <h2 class="rtds-sr-only">Link utili</h2>
        <div class="rtds-space-y-5">
            <ul role="list" class="rtds-grid rtds-gap-4 md:rtds-grid-cols-2 lg:rtds-grid-cols-4">
                <li class="rtds-col"><div
  class="rtds-card rtds-card--sito-tematico rtds-bg-gradient-04 is-card-fullclickable rtds-group/card"
>

  
  <picture class="rtds-card__image-wrapper
  ">
    <img
      class="rtds-card__image"
      alt=""
      src="../../images/card-image.jpg"
    />
  </picture>
  

  
  <div class="rtds-card__content">
    
    
    

    <div class="rtds-card__heading">

      
      

      
        <h3 class="rtds-card__title">
          <a class="group-hover/card:rtds-underline rtds-flex rtds-items-center" href="">
            
    
        <img alt="" width="24" height="24" src="../../images/icone-siti/toscana-notizie-icon.png" srcset="../../images/icone-siti/toscana-notizie-icon.png 1x, ../../images/logo-card@2x.png 2x" class="rtds-card__logo">
    

            Toscana Notizie
            
              
            
            
              
                  <svg
  class="rtds-icon rtds-fill-current rtds-flex-shrink-0"
  aria-hidden="true"
  focusable="false"
  role="img"
>
  <use href="../../icons.svg#mini--arrow-small-right" />
</svg>

              
            
            
          </a>
        </h3>
      

      
      
        

      
      
    </div>

    
      
     

    
    

    
    
    

    
      
    
   
    
      
    
   
    
      
    

    
    
    

    
    
    
  </div>
  
  
</div>
</li>
                <li class="rtds-col"><div
  class="rtds-card rtds-card--sito-tematico rtds-bg-gradient-04 is-card-fullclickable rtds-group/card"
>

  
  <picture class="rtds-card__image-wrapper
  ">
    <img
      class="rtds-card__image"
      alt=""
      src="../../images/card-image.jpg"
    />
  </picture>
  

  
  <div class="rtds-card__content">
    
    
    

    <div class="rtds-card__heading">

      
      

      
        <h3 class="rtds-card__title">
          <a class="group-hover/card:rtds-underline rtds-flex rtds-items-center" href="">
            
    
        <img alt="" width="24" height="24" src="../../images/icone-siti/giovanisi-icon.png" srcset="../../images/icone-siti/giovanisi-icon.png 1x, ../../images/logo-card@2x.png 2x" class="rtds-card__logo">
    

            GiovaniSì
            
              
            
            
              
                  <svg
  class="rtds-icon rtds-fill-current rtds-flex-shrink-0"
  aria-hidden="true"
  focusable="false"
  role="img"
>
  <use href="../../icons.svg#mini--arrow-small-right" />
</svg>

              
            
            
          </a>
        </h3>
      

      
      
        

      
      
    </div>

    
      
     

    
    

    
    
    

    
      
    
   
    
      
    
   
    
      
    

    
    
    

    
    
    
  </div>
  
  
</div>
</li>
                <li class="rtds-col"><div
  class="rtds-card rtds-card--sito-tematico rtds-bg-gradient-04 is-card-fullclickable rtds-group/card"
>

  
  <picture class="rtds-card__image-wrapper
  ">
    <img
      class="rtds-card__image"
      alt=""
      src="../../images/card-image.jpg"
    />
  </picture>
  

  
  <div class="rtds-card__content">
    
    
    

    <div class="rtds-card__heading">

      
      

      
        <h3 class="rtds-card__title">
          <a class="group-hover/card:rtds-underline rtds-flex rtds-items-center" href="">
            
    
        <img alt="" width="24" height="24" src="../../images/icone-siti/open-toscana-icon.png" srcset="../../images/icone-siti/open-toscana-icon.png 1x, ../../images/logo-card@2x.png 2x" class="rtds-card__logo">
    

            Open Toscana
            
              
            
            
              
                  <svg
  class="rtds-icon rtds-fill-current rtds-flex-shrink-0"
  aria-hidden="true"
  focusable="false"
  role="img"
>
  <use href="../../icons.svg#mini--arrow-small-right" />
</svg>

              
            
            
          </a>
        </h3>
      

      
      
        

      
      
    </div>

    
      
     

    
    

    
    
    

    
      
    
   
    
      
    
   
    
      
    

    
    
    

    
    
    
  </div>
  
  
</div>
</li>
                <li class="rtds-col"><div
  class="rtds-card rtds-card--sito-tematico rtds-bg-gradient-04 is-card-fullclickable rtds-group/card"
>

  
  <picture class="rtds-card__image-wrapper
  ">
    <img
      class="rtds-card__image"
      alt=""
      src="../../images/card-image.jpg"
    />
  </picture>
  

  
  <div class="rtds-card__content">
    
    
    

    <div class="rtds-card__heading">

      
      

      
        <h3 class="rtds-card__title">
          <a class="group-hover/card:rtds-underline rtds-flex rtds-items-center" href="">
            
    
        <img alt="" width="24" height="24" src="../../images/icone-siti/toscana-accessibile-icon.png" srcset="../../images/icone-siti/toscana-accessibile-icon.png 1x, ../../images/logo-card@2x.png 2x" class="rtds-card__logo">
    

            Toscana Accessibile
            
              
            
            
              
                  <svg
  class="rtds-icon rtds-fill-current rtds-flex-shrink-0"
  aria-hidden="true"
  focusable="false"
  role="img"
>
  <use href="../../icons.svg#mini--arrow-small-right" />
</svg>

              
            
            
          </a>
        </h3>
      

      
      
        

      
      
    </div>

    
      
     

    
    

    
    
    

    
      
    
   
    
      
    
   
    
      
    

    
    
    

    
    
    
  </div>
  
  
</div>
</li>
                <li class="rtds-col"><div
  class="rtds-card rtds-card--sito-tematico rtds-bg-gradient-04 is-card-fullclickable rtds-group/card"
>

  
  <picture class="rtds-card__image-wrapper
  ">
    <img
      class="rtds-card__image"
      alt=""
      src="../../images/card-image.jpg"
    />
  </picture>
  

  
  <div class="rtds-card__content">
    
    
    

    <div class="rtds-card__heading">

      
      

      
        <h3 class="rtds-card__title">
          <a class="group-hover/card:rtds-underline rtds-flex rtds-items-center" href="">
            
    
        <img alt="" width="24" height="24" src="../../images/icone-siti/digital-innovation-hub-icon.png" srcset="../../images/icone-siti/digital-innovation-hub-icon.png 1x, ../../images/logo-card@2x.png 2x" class="rtds-card__logo">
    

            Digital Innovation Hub - Industria 4.0
            
              
            
            
              
                  <svg
  class="rtds-icon rtds-fill-current rtds-flex-shrink-0"
  aria-hidden="true"
  focusable="false"
  role="img"
>
  <use href="../../icons.svg#mini--arrow-small-right" />
</svg>

              
            
            
          </a>
        </h3>
      

      
      
        

      
      
    </div>

    
      
     

    
    

    
    
    

    
      
    
   
    
      
    
   
    
      
    

    
    
    

    
    
    
  </div>
  
  
</div>
</li>
                <li class="rtds-col"><div
  class="rtds-card rtds-card--sito-tematico rtds-bg-gradient-04 is-card-fullclickable rtds-group/card"
>

  
  <picture class="rtds-card__image-wrapper
  ">
    <img
      class="rtds-card__image"
      alt=""
      src="../../images/card-image.jpg"
    />
  </picture>
  

  
  <div class="rtds-card__content">
    
    
    

    <div class="rtds-card__heading">

      
      

      
        <h3 class="rtds-card__title">
          <a class="group-hover/card:rtds-underline rtds-flex rtds-items-center" href="">
            
    
        <img alt="" width="24" height="24" src="../../images/icone-siti/muoversi-in-toscana-icon.png" srcset="../../images/icone-siti/muoversi-in-toscana-icon.png 1x, ../../images/logo-card@2x.png 2x" class="rtds-card__logo">
    

            Muoversi in Toscana
            
              
            
            
              
                  <svg
  class="rtds-icon rtds-fill-current rtds-flex-shrink-0"
  aria-hidden="true"
  focusable="false"
  role="img"
>
  <use href="../../icons.svg#mini--arrow-small-right" />
</svg>

              
            
            
          </a>
        </h3>
      

      
      
        

      
      
    </div>

    
      
     

    
    

    
    
    

    
      
    
   
    
      
    
   
    
      
    

    
    
    

    
    
    
  </div>
  
  
</div>
</li>
                <li class="rtds-col"><div
  class="rtds-card rtds-card--sito-tematico rtds-bg-gradient-04 is-card-fullclickable rtds-group/card"
>

  
  <picture class="rtds-card__image-wrapper
  ">
    <img
      class="rtds-card__image"
      alt=""
      src="../../images/card-image.jpg"
    />
  </picture>
  

  
  <div class="rtds-card__content">
    
    
    

    <div class="rtds-card__heading">

      
      

      
        <h3 class="rtds-card__title">
          <a class="group-hover/card:rtds-underline rtds-flex rtds-items-center" href="">
            
    
        <img alt="" width="24" height="24" src="../../images/icone-siti/toscana-digitale-icon.png" srcset="../../images/icone-siti/toscana-digitale-icon.png 1x, ../../images/logo-card@2x.png 2x" class="rtds-card__logo">
    

            Toscana Digitale
            
              
            
            
              
                  <svg
  class="rtds-icon rtds-fill-current rtds-flex-shrink-0"
  aria-hidden="true"
  focusable="false"
  role="img"
>
  <use href="../../icons.svg#mini--arrow-small-right" />
</svg>

              
            
            
          </a>
        </h3>
      

      
      
        

      
      
    </div>

    
      
     

    
    

    
    
    

    
      
    
   
    
      
    
   
    
      
    

    
    
    

    
    
    
  </div>
  
  
</div>
</li>
                <li class="rtds-col"><div
  class="rtds-card rtds-card--sito-tematico rtds-bg-gradient-04 is-card-fullclickable rtds-group/card"
>

  
  <picture class="rtds-card__image-wrapper
  ">
    <img
      class="rtds-card__image"
      alt=""
      src="../../images/card-image.jpg"
    />
  </picture>
  

  
  <div class="rtds-card__content">
    
    
    

    <div class="rtds-card__heading">

      
      

      
        <h3 class="rtds-card__title">
          <a class="group-hover/card:rtds-underline rtds-flex rtds-items-center" href="">
            
    
        <img alt="" width="24" height="24" src="../../images/icone-siti/urp-icon.png" srcset="../../images/icone-siti/urp-icon.png 1x, ../../images/logo-card@2x.png 2x" class="rtds-card__logo">
    

            Ufficio Relazioni con il Pubblico
            
              
            
            
              
                  <svg
  class="rtds-icon rtds-fill-current rtds-flex-shrink-0"
  aria-hidden="true"
  focusable="false"
  role="img"
>
  <use href="../../icons.svg#mini--arrow-small-right" />
</svg>

              
            
            
          </a>
        </h3>
      

      
      
        

      
      
    </div>

    
      
     

    
    

    
    
    

    
      
    
   
    
      
    
   
    
      
    

    
    
    

    
    
    
  </div>
  
  
</div>
</li>
            </ul>
        </div>
    </div>

</section>