/* GANTRY5 DEVELOPMENT MODE ENABLED.
 *
 * WARNING: This file is automatically generated by Gantry5. Any modifications to this file will be lost!
 *
 * For more information on modifying CSS, please read:
 *
 * http://docs.gantry.org/gantry5/configure/styles
 * http://docs.gantry.org/gantry5/tutorials/adding-a-custom-style-sheet
 */

@charset "UTF-8";
/* ==================================================
   VARIABLES
   ================================================== */
/* ================================================
   FONT GLOBALE SITO
   Atkinson Hyperlegible Next
================================================ */
html, body {
  font-family: "Atkinson Hyperlegible Next", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-weight: 400;
  line-height: 1.6;
}
h1, h2, h3, h4, h5, h6, p, span, a, li, button, input, textarea, label, .gantry-container {
  font-family: "Atkinson Hyperlegible Next", inherit;
}
body {
  font-weight: 400;
}
strong, b {
  font-weight: 600;
}
h1 {
  font-weight: 700;
}
h2 {
  font-weight: 650;
}
h3 {
  font-weight: 600;
}
h4, h5, h6 {
  font-weight: 500;
}
/* ================================================
   RESET COLORE <em>
================================================ */
em {
  color: inherit;
  font-style: italic;
}
/* ==================================================
   GLOBAL BASE
   ================================================== */
body {
  color: #372e2c;
  background-color: #ffffff;
}
/* Link base */
a {
  color: #ff4d00;
  text-decoration: none;
  transition: color 0.3s ease;
}
a:hover, a:focus {
  color: #cc3e00;
}
/* ==================================================
   TYPOGRAPHY (opzionale, ma consigliata)
   ================================================== */
h1, h2, h3, h4, h5, h6 {
  color: #372e2c;
}
p {
  line-height: 1.6;
}
.frase-logo p {
  line-height: 1.2;
}
/* ==================================================
   UTILITY COLORS
   ================================================== */
.text-orange {
  color: #ff4d00;
}
.text-brown {
  color: #372e2c;
}
.bg-orange {
  background-color: #ff4d00;
  color: #ffffff;
}
.bg-brown {
  background-color: #372e2c;
  color: #ffffff;
}
/* ==================================================
   HERO sticky
   ================================================== */
/* HERO fisso sempre */
#g-hero {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 9999;
  background: #fff;
}
/* Spazio sopra al contenuto per non finire sotto l’header */
body {
  padding-top: 140px;
  /* regolalo in base all’altezza reale del tuo hero */
}
/* ==================================================
   ICONA E-MAIL (top right)
   ================================================== */
.mail-icon-wrapper {
  display: flex;
  justify-content: flex-end;
}
.mail-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 35px;
  height: 35px;
  margin-bottom: 8px;
  color: #ffffff !important;
  background-color: #ff4d00;
  font-size: 16px;
  line-height: 1;
  transition: background-color 0.25s ease, transform 0.25s ease, opacity 0.25s ease;
}
.mail-icon:hover {
  background-color: #cc3e00;
  transform: translateY(-2px);
  opacity: 1;
}
/* ==================================================
   SOCIAL FIXED BAR (bottom-right)
   ================================================== */
.social-fixed-bar {
  position: fixed;
  right: 10px;
  bottom: 20px;
  z-index: 999;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.social-fixed-bar .social-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 35px;
  height: 35px;
  margin-bottom: 8px;
  color: #ffffff !important;
  background-color: #ff4d00;
  font-size: 16px;
  line-height: 1;
  transition: background-color 0.25s ease, transform 0.25s ease, opacity 0.25s ease;
}
/* Tutte le icone stesso colore brand */
.social-fixed-bar .facebook, .social-fixed-bar .instagram, .social-fixed-bar .youtube, .social-fixed-bar .envelope, .social-fixed-bar .linkedin {
  background-color: #ff4d00;
}
/* Hover */
.social-fixed-bar .social-icon:hover {
  background-color: #cc3e00;
  transform: translateY(-2px);
  opacity: 1;
}
/* VISIBILITÀ ICONA EMAIL (solo mobile) */
/* Di default nascosta */
.social-fixed-bar .mobile-only {
  display: none;
}
/* Visibile solo su smartphone */
@media (max-width: 768px) {
  .social-fixed-bar .mobile-only {
    display: flex;
  }
}
.social-fixed-bar .social-icon.envelope i {
  position: relative;
  top: 1px;
  font-size: 15px;
}
/* ==================================================
   GALLERY HOMEPAGE
   ================================================== */
/* --------------------------------------------------
   MOBILE (touch): NIENTE hover sticky
   overlay SOLO con .is-active
   -------------------------------------------------- */
@media (hover: none) and (pointer: coarse) {
  /* card come reference per overlay assoluto */
  /* overlay sopra, centrato */
  #jlfiltergallery-LL .tm-item {
    position: relative;
  }
  #jlfiltergallery-LL .tm-item .jl-position-bottom-center {
    position: absolute;
    z-index: 5;
  }
}
/* --------------------------------------------------
   MICRO-REGOLAZIONI STILE (tutte le viewport)
   -------------------------------------------------- */
#jlfiltergallery-LL .jl-margin-small-top {
  margin-top: 5px !important;
}
#jlfiltergallery-LL a:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 3px;
}
#jlfiltergallery-LL .jl-margin-remove-first-child > :first-child {
  margin-bottom: 0 !important;
}
#jlfiltergallery-LL .jl-overlay, #jlfiltergallery-LL .jl-overlay .tm-title, #jlfiltergallery-LL .jl-overlay .tm-meta {
  text-align: center;
}
#jlfiltergallery-LL .jl-tile-default {
  background: rgba(255, 255, 255, 0.8) !important;
}
/* Mobile: quando un video è in play, overlay sempre nascosto */
@media (hover: none) and (pointer: coarse) {
  #jlfiltergallery-LL .tm-item.is-playing .jl-position-bottom-center {
    opacity: 0 !important;
    visibility: hidden !important;
  }
}
/* ==========================================================================
   Distanza verticale Portfolio Mobile - Lance Libere
   ========================================================================== */
/* Applichiamo la regola solo per schermi mobile (tipicamente sotto i 960px per le griglie) */
@media (max-width: 959px) {
  /* Usiamo l'ID per essere estremamente specifici */
  /* Gestione specifica per il primo elemento di ogni riga su mobile */
  #jlfiltergallery-LL .jlfiltergallery-LL.jl-grid > .jl-grid-margin {
    margin-top: 150px !important;
    /* Raddoppiamo il margine standard di 30px */
  }
  #jlfiltergallery-LL .jlfiltergallery-LL.jl-grid > div:not(.jl-first-column) {
    /* Se la griglia è a colonna singola su mobile, 
           forziamo il margine anche dove UIkit non mette .jl-grid-margin */
    margin-top: 150px !important;
  }
}
/*# sourceMappingURL=custom_39.css.map */