*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

.page-title {
  font-family: serif ;
  color:#fff;
  font-size: 17px;
  letter-spacing: 0.14em;
  text-transform: uppercase; 
  text-decoration: rgb(255, 255, 255);
}

.layout {
  display: flex;
  align-items: flex-start;        
  min-height: calc(100vh - 56px); 
  background-color: #ffffff;
}


.sidebar {
  width: 260px;
  flex-shrink: 0;
  position: sticky;
  top: 56px;                      
  height: calc(100vh - 56px);
  padding: 2rem 1.5rem;
  border-right: 1px solid rgba(0, 0, 0, 0.1);
  background-color: #f8f7f4;
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
}

.sidebar-titolo {
  font-family: var(--font-titolo);
  font-size: 22px;
  font-weight: 600;
  color: #1a1a1a;
  line-height: 1.3;
}

.sidebar-desc {
  font-family: serif;
  font-size: 13px;
  font-weight: 300;
  color: #555;
  line-height: 1.7;
}

.sidebar-lista {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.sidebar-lista li {
  font-family: var(--font-testo);
  font-size: 13px;
  font-weight: 400;
  color: #333;
  padding-left: 16px;
  position: relative;
}

.sidebar-lista li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background-color: #a07840;
}

.sidebar-btn {
  display: inline-block;
  margin-top: auto;               
  padding: 10px 18px;
  font-family: var(--font-testo);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-decoration: none;
  color: whitesmoke;
  background-color: #a07840;
  border-radius: 6px;
  text-align: center;
  transition: background 0.2s ease;
}

.sidebar-btn:hover {
  background-color: #7a5a2c;
  color: #fff;
}


.card-wrapper {
  flex: 1;
  overflow-y: auto;
}


@media (max-width: 720px) {
  .layout {
    flex-direction: column;
  }
  .sidebar {
    width: 100%;
    position: static;
    height: auto;
    border-right: none;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  }
}

:root {
  --font-titolo: 'Playfair Display', serif;
  --font-testo: 'Lato', sans-serif;
  --gap-griglia: 16px;
  --raggio-card: 60px;
  --altezza-card: 300px;
  --opacita-overlay: 0.38;
  --opacita-pannello: 0.12;
  --blur-pannello: 6px;
  --bordo-pannello: rgba(255, 255, 255, 0.2);
}


.navbar-brand {
  font-family: serif;
  font-size: 17px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-decoration: none;
}


.card-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--gap-griglia);
  padding: 1.5rem;
  max-width: 1200px;
  min-height: 1900px;
  margin: 2rem auto;
}

@media (max-width: 720px) {
  .card-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 480px) {
  .card-grid {
    grid-template-columns: 1fr;
  }
}


.card {
  position: relative;
  border-radius: var(--raggio-card);
  overflow: hidden;                         
  min-height: var(--altezza-card);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;               
  border: 0.5px solid rgba(255, 255, 255, 0.1);
  cursor: default;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.4);
}


.card-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  transition: none;
}

.card:hover .card-bg {
  transform: scale(1.04);
}

/* OVERLAY SCURO, appena ci sono le imagini toglilo */
.card-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, var(--opacita-overlay));
  transition: background 0.25s ease;
}

.card:hover .card-overlay {
  background: rgba(0, 0, 0, 0.48);
}

/* qui cambi il testo*/
.card-body {
  position: relative;
  width: 300%;
  padding: 40px 66px;                      
  border-top: 0.5px solid var(--bordo-pannello);
}

/* TAG */
.card-tag {
  display: inline-block;
  font-family: var(--font-testo);
  font-size: 10px;
  font-weight: 400;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.7);
  margin-bottom: 4px;
}

/* TITOLO */
.card-title {
  font-family: var(--font-titolo) ;
  font-size: 15px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.95);
  margin: 0 0 4px;
  line-height: 1.3;
}

/* DESCRIZIONE */
.card-desc {
  font-family: serif var(--font-testo);
  font-size: 11px;
  font-weight: 300;
  color: rgba(255, 255, 255, 0.75);
  margin: 0;
  line-height: 1.5;
}

/*card CUCINE*/
   
.card-1 .card-bg { background-image: url(../immagini/immagini_falegnameria/Infissi/infisso_1.jpg); }
.card-2 .card-bg { background-image: url(../immagini/immagini_falegnameria/Infissi/infisso_2.jpg); }
.card-3 .card-bg { background-image: url(); }
.card-4 .card-bg { background-image: url(); }
.card-5 .card-bg { background-image: url(); }
.card-6 .card-bg { background-image: url(); }
.card-7 .card-bg { background-image: url(); }
.card-8 .card-bg { background-image: url(); }
.card-9 .card-bg { background-image: url(); }
.card-10 .card-bg { background-image: url(); }
.card-11 .card-bg { background-image: url(); }
.card-12 .card-bg { background-image: url(); }
.card-13 .card-bg { background-image: url(); }
.card-14 .card-bg { background-image: url(); }
.card-15 .card-bg { background-image: url(); }

/*card soggiorni*/
.card-bg.card-soggiorni-1 { background-image: url('../immagini/immagini_falegnameria/Infissi/infisso_11.jpg');}
.card-bg.card-soggiorni-2 { background-image: url('');}
.card-bg.card-soggiorni-3 { background-image: url('');}
.card-bg.card-soggiorni-4 { background-image: url('');}
.card-bg.card-soggiorni-5 { background-image: url('');}
.card-bg.card-soggiorni-6 { background-image: url('');}
.card-bg.card-soggiorni-7 { background-image: url('');}
.card-bg.card-soggiorni-8 { background-image: url('');}
.card-bg.card-soggiorni-9 { background-image: url('');}
.card-bg.card-soggiorni-10 { background-image: url('');}
.card-bg.card-soggiorni-11 { background-image: url('');}
.card-bg.card-soggiorni-12 { background-image: url('');}


/* card scale_interne*/
.card-bg.card-scale_interne-1 { background-image: url('../immagini/immagini_falegnameria/Infissi/infisso_2.jpg');}
.card-bg.card-scale_interne-2 { background-image: url('');}
.card-bg.card-scale_interne-3 { background-image: url('');}
.card-bg.card-scale_interne-4 { background-image: url('');}
.card-bg.card-scale_interne-5 { background-image: url('');}
.card-bg.card-scale_interne-6 { background-image: url('');}
.card-bg.card-scale_interne-7 { background-image: url('');}
.card-bg.card-scale_interne-8 { background-image: url('');}
.card-bg.card-scale_interne-9 { background-image: url('');}
.card-bg.card-scale_interne-10 { background-image: url('');}
.card-bg.card-scale_interne-11 { background-image: url('');}
.card-bg.card-scale-interne-12 { background-image: url('');}

/* card camerette*/
.card-bg.card-camerette-1 { background-image: url('../immagini/immagini_falegnameria/Infissi/infisso_4.jpg');}
.card-bg.card-camerette-2 { background-image: url('');}
.card-bg.card-camerette-3 { background-image: url('');}
.card-bg.card-camerette-4 { background-image: url('');}
.card-bg.card-camerette-5 { background-image: url('');}
.card-bg.card-camerette-6 { background-image: url('');}
.card-bg.card-camerette-7 { background-image: url('');}
.card-bg.card-camerette-8 { background-image: url('');}
.card-bg.card-camerette-9 { background-image: url('');}
.card-bg.card-camerette-10 { background-image: url('');}
.card-bg.card-camerette-11 { background-image: url('');}
.card-bg.card-camerette-12 { background-image: url('');}

/* card illuminazione*/
.card-bg.card-illuminazione-1 { background-image: url('../immagini/immagini_falegnameria/Infissi/infisso_4.jpg');}
.card-bg.card-illuminazione-2 { background-image: url('');}
.card-bg.card-illuminazione-3 { background-image: url('');}
.card-bg.card-illuminazione-4 { background-image: url('');}
.card-bg.card-illuminazione-5 { background-image: url('');}
.card-bg.card-illuminazione-6 { background-image: url('');}
.card-bg.card-illuminazione-7 { background-image: url('');}
.card-bg.card-illuminazione-8 { background-image: url('');}
.card-bg.card-illuminazione-9 { background-image: url('');}
.card-bg.card-illuminazione-10 { background-image: url('');}
.card-bg.card-illuminazione-11 { background-image: url('');}
.card-bg.card-illuminazione-12 { background-image: url('');}

/* card mobili_di_design*/
.card-bg.card-mobili_di_design-1 { background-image: url('../immagini/immagini_falegnameria/Infissi/infisso_4.jpg');}
.card-bg.card-mobili_di_design-2 { background-image: url('');}
.card-bg.card-mobili_di_design-3 { background-image: url('');}
.card-bg.card-mobili_di_design-4 { background-image: url('');}
.card-bg.card-mobili_di_design-5 { background-image: url('');}
.card-bg.card-mobili_di_design-6 { background-image: url('');}
.card-bg.card-mobili_di_design-7 { background-image: url('');}
.card-bg.card-mobili_di_design-8 { background-image: url('');}
.card-bg.card-mobili_di_design-9 { background-image: url('');}
.card-bg.card-mobili_di_design-10 { background-image: url('');}
.card-bg.card-mobili_di_design-11 { background-image: url('');}
.card-bg.card-mobili_di_design-12 { background-image: url('');}

/* card scrivanie*/
.card-bg.card-scrivanie-1 { background-image: url('../immagini/immagini_falegnameria/Infissi/infisso_4.jpg');}
.card-bg.card-scrivanie-2 { background-image: url('');}
.card-bg.card-scrivanie-3 { background-image: url('');}
.card-bg.card-scrivanie-4 { background-image: url('');}
.card-bg.card-scrivanie-5 { background-image: url('');}
.card-bg.card-scrivanie-6 { background-image: url('');}
.card-bg.card-scrivanie-7 { background-image: url('');}
.card-bg.card-scrivanie-8 { background-image: url('');}
.card-bg.card-scrivanie-9 { background-image: url('');}
.card-bg.card-scrivanie-10 { background-image: url('');}
.card-bg.card-scrivanie-11 { background-image: url('');}
.card-bg.card-scrivanie-12 { background-image: url('');}

/* card armadi*/
.card-bg.card-armadi-1 { background-image: url('../immagini/immagini_falegnameria/Infissi/infisso_4.jpg');}
.card-bg.card-armadi-2 { background-image: url('');}
.card-bg.card-armadi-3 { background-image: url('');}
.card-bg.card-armadi-4 { background-image: url('');}
.card-bg.card-armadi-5 { background-image: url('');}
.card-bg.card-armadi-6 { background-image: url('');}
.card-bg.card-armadi-7 { background-image: url('');}
.card-bg.card-armadi-8 { background-image: url('');}
.card-bg.card-armadi-9 { background-image: url('');}
.card-bg.card-armadi-10 { background-image: url('');}
.card-bg.card-armadi-11 { background-image: url('');}
.card-bg.card-armadi-12 { background-image: url('');}

/* card bagni*/
.card-bg.card-bagni-1 { background-image: url('../immagini/immagini_falegnameria/Infissi/infisso_4.jpg');}
.card-bg.card-bagni-2 { background-image: url('');}
.card-bg.card-bagni-3 { background-image: url('');}
.card-bg.card-bagni-4 { background-image: url('');}
.card-bg.card-bagni-5 { background-image: url('');}
.card-bg.card-bagni-6 { background-image: url('');}
.card-bg.card-bagni-7 { background-image: url('');}
.card-bg.card-bagni-8 { background-image: url('');}
.card-bg.card-bagni-9 { background-image: url('');}
.card-bg.card-bagni-10 { background-image: url('');}
.card-bg.card-bagni-11 { background-image: url('');}
.card-bg.card-bagni-12 { background-image: url('');}

/* card banchi_da_lavoro*/
.card-bg.card-banchi_da_lavoro-1 { background-image: url('../immagini/immagini_falegnameria/Infissi/infisso_4.jpg');}
.card-bg.card-banchi_da_lavoro-2 { background-image: url('');}
.card-bg.card-banchi_da_lavoro-3 { background-image: url('');}
.card-bg.card-banchi_da_lavoro-4 { background-image: url('');}
.card-bg.card-banchi_da_lavoro-5 { background-image: url('');}
.card-bg.card-banchi_da_lavoro-7 { background-image: url('');}
.card-bg.card-banchi_da_lavoro-8 { background-image: url('');}
.card-bg.card-banchi_da_lavoro-9 { background-image: url('');}
.card-bg.card-banchi_da_lavoro-10 { background-image: url('');}
.card-bg.card-banchi_da_lavoro-11 { background-image: url('');}
.card-bg.card-banchi_da_lavoro-12 { background-image: url('');}

/* card tavoli*/
.card-bg.card-tavoli-1 { background-image: url('../immagini/immagini_falegnameria/Infissi/infisso_4.jpg');}
.card-bg.card-tavoli-2 { background-image: url('');}
.card-bg.card-tavoli-3 { background-image: url('');}
.card-bg.card-tavoli-4 { background-image: url('');}
.card-bg.card-tavoli-5 { background-image: url('');}
.card-bg.card-tavoli-6 { background-image: url('');}
.card-bg.card-tavoli-7 { background-image: url('');}
.card-bg.card-tavoli-8 { background-image: url('');}
.card-bg.card-tavoli-9 { background-image: url('');}
.card-bg.card-tavoli-10 { background-image: url('');}
.card-bg.card-tavoli-11 { background-image: url('');}
.card-bg.card-tavoli-12 { background-image: url('');}


/* CURSORE PERSONALIZZATO */
a, button {
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18'%3E%3Ccircle cx='9' cy='9' r='8' fill='rgb(200,150,80)'/%3E%3C/svg%3E") 9 9, pointer;
}