/* ==========================================================================
   Costruire SRL - bersagli toccabili sul telefono.

   Misurato a 375 px: fra 11 e 18 elementi cliccabili per pagina erano
   sotto i 40 px di lato. Le linee guida chiedono 44x44, e la ragione
   non e la regola: un bersaglio da 24 px si sbaglia col pollice, e chi
   lo sbaglia due volte chiude la pagina.

   Le icone social e le voci del pie di pagina restano della stessa
   dimensione a vedersi: si allarga l AREA cliccabile, con il padding e
   con un min-height. La grafica non cambia.

   Tutto dentro (pointer: coarse): su un computer col mouse non serve e
   allargherebbe il pie di pagina per niente.
   ======================================================================== */

@media (pointer: coarse){

    /* le icone dei social: il tondo cliccabile diventa 44x44 */
    .footer-social a{
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 44px;
        min-height: 44px;
    }

    /* i collegamenti del pie di pagina, uno sotto l altro */
    .footer-links > a,
    .footer-contact a{
        display: inline-flex;
        align-items: center;
        min-height: 44px;
    }

    /* le voci del menu */
    .navbar ul a{
        display: flex;
        align-items: center;
        min-height: 44px;
    }

    /* il pulsante che apre il menu */
    .menu-toggle{
        min-width: 44px;
        min-height: 44px;
    }

    /* le frecce delle gallerie */
    .gallery-prev, .gallery-next,
    .orti-gallery-prev, .orti-gallery-next{
        min-width: 44px;
        min-height: 44px;
    }

    /* I PULSANTI PRINCIPALI.
       Misurati a 375 px erano fra 31 e 35 px di altezza: larghi, quindi non
       si sbagliano facilmente, ma sotto la soglia comoda. Sono anche i
       pulsanti che portano a una telefonata o a un invio, cioe quelli che
       conviene meno far sbagliare. */
    .btn-nav, .btn-primary, .btn-secondary,
    .hero-btn, .hero-btn-primary, .hero-btn-secondary,
    .orti-final-cta-primary, .orti-final-cta-secondary,
    .orti-specifications-button, .construction-cta a,
    .phs-cta a, .final-cta a{
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 44px;
    }

    /* I COLLEGAMENTI A SE STANTI del pie di pagina (Privacy, Cookie): stanno
       su una riga loro, quindi allargarli non sposta nessun testo. */
    .footer-links a{
        display: flex;
        align-items: center;
        min-height: 44px;
    }

    /* gli ultimi tre, trovati misurando a 375 px e non a occhio.
       .btn-outline della home e definito in home-experience.css come
       `.home-premium-page .home-hero .btn-outline`, tre classi: un selettore
       da una classe sola non lo batte nemmeno caricandosi dopo. Qui si pareggia
       la specificita invece di usare !important, che toglierebbe a chiunque la
       possibilita di intervenire piu tardi. */
    .home-premium-page .home-hero .btn-outline,
    .btn-outline,
    .orti-flagship-cta{
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 44px;
    }

    /* il logo in alto e un collegamento alla home: 53x35 */
    .logo a,
    a.logo{
        display: inline-flex;
        align-items: center;
        min-height: 44px;
    }

    /* NON si allargano i collegamenti DENTRO una frase - il numero di
       telefono e l indirizzo email nel corpo del testo, i rimandi
       nell informativa. Allargarli spezzerebbe l interlinea del paragrafo, e
       le linee guida li escludono proprio per questo: un collegamento dentro
       una frase e identificabile dal contesto, non dalla sua area. */

}
