/*
Theme Name: .G Architecture 2026
Theme URI: https://www.g-architecture.fr/
Description: Thème créé par Net-tendance.com
Version: 1
Author: Net-tendance - Erwan Girerd
Author URI:   https://www.net-tendance.com
*/

@import url('https://fonts.googleapis.com/css2?family=Figtree:ital,wght@0,300..900;1,300..900&display=swap');


body, html{font: 14px/20px 'Roboto', sans-serif; font-weight: 300; color:#1d1d1d; border:0px; margin:0px; padding: 0px;}
body{}

a{ color:#1d1d1d; background: none;}
/* STRUCTURE*/
div#first{ width: 100%; display: block; text-align: center; float: left;}

@media screen and (max-width: 1024px) 
{
	div#first div#second{ width:  calc(100% - 20px);padding:10px; display: inline-block; text-align: left;  }
	div.CaseLimite{width: calc(100% - 20px); padding: 20px 10px; display: inline-block;}
}
@media screen and (min-width: 1024px) 
{
	div#first div#second{ width: 944px; display: inline-block; text-align: left;  }
	div.CaseLimite{width: 50%; display: inline-block;}
}
@media screen and (min-width: 1200px) 
{
	div#first div#second{ width: 1120px; display: inline-block; text-align: left;  }
	div.CaseLimite{max-width: 400px; width: calc(100% - 100px); display: inline-block;padding: 50px;}
}
@media screen and (min-width: 1400px) 
{
	div#first div#second{ width: 1320px; display: inline-block; text-align: left;  }
	div.CaseLimite{max-width: 500px; width: calc(100% - 100px); display: inline-block; padding: 50px;}
}

:root
{
	--CouleurCorail:#E07A6A;
	--CouleurTerraCotta:#A13F28;
	--CouleurTaupe:#75695D;
	/*--CouleurBleu:#0b1b33;*/
	--CouleurBleu:#192734;
	--CouleurBeige:#F5F1EB;
	--CouleurGrisChaud:#D6D1CB;
}
@media screen and (max-width: 1024px) {
}
@media screen and (max-width: 767px) {
}
@media screen and (min-width: 1024px) {
	.row{width: 100%;display: -webkit-box;  display: -moz-box;  display: -ms-flexbox;  display: -webkit-flex; display: flex !important;  -webkit-flex-direction: row;  -moz-flex-direction: row;  -ms-flex-direction: row;  flex-direction: row !important; float: none; display: inline-block; position: relative;}
	.row.h100{height: 100%;}
 	.row .case1{ flex: 1;display: inline-block; position: relative; }.row .case2{ flex: 2;display: inline-block; position: relative; }.row .case3{ flex: 3; display: inline-block; position: relative; max-width: calc(100% / 4);}.row .case4{ flex: 4; display: inline-block; position: relative;}.row .case5{ flex: 5; }.row .case6{ flex: 6; max-width: 50%; }.row .case7{ flex: 7; }.row .case8{ flex: 8; }.row .case9{ flex: 9; }.row .case10{ flex: 10; }.row .case11{ flex: 11; }.row .case12{ flex: 12; }
	
	.column{width: 100%;display: -webkit-box;  display: -moz-box;  display: -ms-flexbox;  display: -webkit-flex; display: flex !important;  -webkit-flex-direction: row;  -moz-flex-direction: row;  -ms-flex-direction: row;  flex-direction:column ; float: none; min-height: 100%; height: 100%; }
 	.column .case1{ flex: 1; flex-direction: column;}.column .case2{ flex: 2;flex-direction: column; }.column .case3{ flex: 3;flex-direction: column; }.column .case4{ flex: 4;flex-direction: column; }.column .case5{ flex: 5;flex-direction: column; }.column .case6{ flex: 6; max-height: 50%;flex-direction: column; }.column .case7{ flex: 7; flex-direction: column;}.column .case8{ flex: 8; flex-direction: column;}.column .case9{ flex: 9;flex-direction: column; }.column .case10{ flex: 10;flex-direction: column; }.column .case11{ flex: 11; flex-direction: column;}.column .case12{ flex: 12; flex-direction: column;}
	
	.row > div, .column > div{position: relative;}	
}
@media screen and (max-width: 1024px) 
{
	.row, .column{float: left; width: 100%;}
}

.txtcenter { text-align:center;}

.DesignTxt1{color:#A13F28;font: 14px/20px 'Roboto', sans-serif; font-weight: 300; text-transform: uppercase; letter-spacing: 1px;}
.DesignTxt1 p{padding: 0px; margin: 0px;}

.DesignTxt2{color:var(--CouleurTaupe);font: 14px/20px 'Roboto', sans-serif !important; font-weight: 300; text-transform: uppercase; letter-spacing: 1px; margin-top: 0px; display: inline-block; position: relative;}
.DesignTxt2 p{padding: 0px; margin: 0px;}
/*
* Bloc de texte
*/
.BlocDesign1{margin: auto;max-width: 600px; text-align: left;}
.BlocDesign2{ max-width: 600px; text-align: left;}

/*
* HEADER
*/

.HeaderTop.fixe{position: fixed; top:0px; z-index: 9999991; width: 100%; height: 40px;}
.HeaderTop.fixe .elementor-widget-wrap{height: 40px; padding: 0px;}
.HeaderMenu.fixe{position: fixed; top:40px; z-index: 999999; width: 100%; background: #FFFFFF; border-bottom: 1px solid var(--CouleurBleu);}

/*
.HeaderTop{ position: absolute; top: 0px; left: 0px; width: 100%; z-index: 10; height: 40px; max-height: 40px;}
.HeaderMenu{position: absolute; top: 40px; left: 0px; width: 100%; z-index: 9; }
.HeaderMenu .ContentLogo{}
.HeaderMenu .ContentLogo .Logo{}
.HeaderMenu .Menu{}
.HeaderMenu .Menu ul#menu-menu-principal{}
.HeaderMenu .Menu ul#menu-menu-principal li{}
.HeaderMenu .Menu ul#menu-menu-principal li a{ text-decoration: none !important; color:var(--CouleurBleu); position: relative; font: 16px/80px "Oswald", sans-serif; text-transform: uppercase; overflow: hidden;}
.HeaderMenu .Menu ul#menu-menu-principal li a::after{background: var(--CouleurBleu); position: absolute; bottom: -5px; left: 0px; height: 5px; content: ""; width: 100%; transition: bottom 0.5s ease; }
.HeaderMenu .Menu ul#menu-menu-principal li a:hover::after{ bottom: 0px; }
.HeaderMenu .Menu ul#menu-menu-principal li.active a::after{bottom: 0px;}


.HeaderTop.fixe{position: fixed; top:0px; z-index: 9999991;}
.HeaderMenu.fixe{position: fixed; top:40px; z-index: 999999;}

@media screen and (min-width: 1024px) {
	
.HeaderMenu.fixe .Menu{height: 40px; padding: 0px; margin: 0px;}
.HeaderMenu.fixe .Menu ul#menu-menu-principal{height: 40px; padding: 0px; margin: 0px;}
.HeaderMenu.fixe .Menu ul#menu-menu-principal li{height: 40px; padding: 0px; margin: 0px;}
.HeaderMenu.fixe .Menu ul#menu-menu-principal li a{font: 16px/40px "Oswald", sans-serif; height: 40px; padding: 0px 10px 0px 10px; margin: 0px;}
.HeaderMenu.fixe .ContentLogo .Logo img{max-height: 30px !important;}
.HeaderMenu.fixe > div{ max-height: 40px !important; }
}

@media screen and (max-width: 1024px) {
	
}
@media screen and (max-width: 767px) {
	
.HeaderTop{ position: relative; top: 0px; left: 0px; width: 100%; height: 80px; z-index: 1; height: 40px; max-height: 40px;}
.HeaderMenu{position: relative; top: inherit; left: inherit; width: 100%; z-index: 1; }
.HeaderMenu .Menu ul#menu-menu-principal li a{ font: 16px/40px "Oswald", sans-serif; }
	
}*/

.PhraseEntete{color:#FFFFFF; font: 14px/20px "Figtree", sans-serif; font-weight: 200;}


/*
* Fil d'arianne
*/
.FilArianne{background: var(--CouleurBeige); padding:3px 5px 3px 5px; font: 11px/20px 'Figtree', sans-serif; font-weight: 600; text-transform: uppercase;}

.realisation-filters {    text-align: center;    margin: 30px 0;}
.IntroProjetType{padding: 20px;}
/*
* Boutons
*/
.Btn1{ color:#FFFFFF; font: 14px/20px "Figtree", sans-serif; font-weight: 600; text-transform: uppercase; background: var(--CouleurTerraCotta); border-radius: 5px; margin: 5px; padding: 10px 20px; text-decoration: none; display: inline-block;}
.Btn1.active, .Btn1:hover{background: var(--CouleurCorail); color:#FFFFFF; }


.BtnRetour{color:var(--CouleurTaupe); font-weight: 700; font: 16px/32px 'Oswald', sans-serif; padding: 0px 10px 0px 50px; display: inline-block;  position: relative; text-decoration: none;  border-radius:5px;}
.BtnRetour::before{content: ""; top: 50%; width: 20px; height: 20px; transform: translateY(-50%); left: 15px; background: var(--CouleurTaupe);-webkit-mask: url('charte/IconeFleche2-bis.svg') no-repeat 50% 50%;  mask: url('charte/IconeFleche2-bis.svg') no-repeat 50% 50%; display: block; z-index: 1; position: absolute;}
.BtnRetour:hover{background:var(--CouleurTaupe); color:#FFFFFF;}
.BtnRetour:hover::before{background: #FFFFFF;}

@media screen and (max-width: 1024px) 
{
}
@media screen and (max-width: 767px) {
}

/*
* Background
*/
.BgBeige{background: var(--CouleurBeige);}

/*
* Mise en page
*/
.h100{height: 100%;}


/*
* Titres
*/

.DesignTitre1{padding-left: 26px; position: relative;}
.DesignTitre1::before{content: ""; width: 16px; height: 16px; border-radius: 8px; position: absolute; top: 10px; left: 0px; background: var(--CouleurTerraCotta);}

.IconeMap{padding-left: 30px;}
.IconeMap::before{content: ""; top: 50%; width: 20px; height: 20px; transform: translateY(-50%); left: 5px; background: var(--CouleurTaupe);-webkit-mask: url('charte/IconeMap.svg') no-repeat 50% 50%;  mask: url('charte/IconeMap.svg') no-repeat 50% 50%; display: block; z-index: 1; position: absolute;}
/*
* Case design
*/
.CaseDesign1{border-radius: 5px; border: 1px solid #75695D; height: 100%;}
.caseDesign1 .elementor-widget-wrap:hover{--e-transform-scale:1.05;}
.CaseDesign1 .elementor-image-box-wrapper h3{margin :0px; height: 120px;display: flex; font-size: 16px;
  align-items: center;      /* Centre verticalement */
  justify-content: center;  /* Centre horizontalement (optionnel) */}
.CaseDesign1 .elementor-image-box-wrapper .elementor-image-box-description{padding :5px;}



/*
* LEs projets le listing
*/
.NTListingProjets{display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; grid-auto-rows: 220px;}

/* BASE */
.NTUnProjet{ position: relative; overflow: hidden; border-radius: 5px;}

/* LIENS */
.NTUnProjet a{ position: relative; display: block; width: 100%; height: 100%; overflow: hidden;  border-radius: 5px; }

/* IMAGES */
.NTUnProjet picture {    display: block;    width: 100%;    height: 100%;    overflow: hidden;}
.NTUnProjet picture img {    display: block;    width: 100%;    height: 100%;    object-fit: cover;    object-position: center;    transition: transform .7s ease;}
/* OVERLAY */
.NTUnProjet a::before{ content: "";  position: absolute; top: 0px; left: 0px;  width: 20px; height: 20px; border-radius: 999px;  background: var(--CouleurTaupe); transform: translate(-50%, -50%) scale(1);  transition: transform .7s cubic-bezier(.22,1,.36,1);z-index: 2;}

/* TITRE */
.NTTitreRealisation{  position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 24px; color: white; text-align: center; font-size: 28px; font-weight: 700;  line-height: 1.2;  opacity: 0; transform: translateY(20px);  transition: opacity .4s ease, transform .5s ease;  z-index: 3; font : 20px/30px "Figtree", sans-serif; font-weight: 200;text-transform: uppercase; }
.NTTitreRealisation .Lieu{	font : 14px/20px "Figtree", sans-serif;}

/* HOVER */
.NTUnProjet:hover a::before{  transform: translate(-50%, -50%) scale(100); opacity: 0.8; }
.NTUnProjet:hover .NTTitreRealisation{  opacity: 1; transform: translateY(0); transition-delay: .12s; }
.NTUnProjet:hover img{ transform: scale(1.08); }

/* =========================================
   VARIATIONS AUTOMATIQUES
   motif sur 9 éléments
========================================= */

/* grande horizontale */
.NTUnProjet:nth-child(10n+1){grid-column: span 2; grid-row: span 2; }

/* verticale */
.NTUnProjet:nth-child(10n+4){ grid-row: span 2; }

/* grande horizontale basse */
.NTUnProjet:nth-child(10n+7){ grid-column: span 2; }

/* petite carrée */
.NTUnProjet:nth-child(10n+9), .NTUnProjet:nth-child(10n){ grid-row: span 1; }

/* RESPONSIVE */
@media screen and (max-width: 1024px)
{
    .NTListingProjets{grid-template-columns: repeat(2, 1fr);}
    .NTUnProjet:nth-child(n){ grid-column: span 1 !important;}
    .NTUnProjet:nth-child(3n+1){grid-row: span 2;    }
}

@media screen and (max-width: 640px)
{
    .NTListingProjets{grid-template-columns: 1fr;grid-auto-rows: 260px;    }
    .NTUnProjet:nth-child(n){grid-column: span 1 !important; grid-row: span 1 !important;    }
}
.Tuile1{height: 100%;}


/*
* Galerie photo
*/
.case_table{display:table !important;height:100%; width: 100%;}.case_table .vertical_align{display:table-cell;vertical-align:middle; width: 100%;}
.photo-gallery {  display: flex;  gap: 1rem;   margin: auto; height: 600px; position: relative;}

.main-photo {  flex: 1; /* prend 50% de l’espace */  height: 100%;}

.main-photo img {  width: 100%;  height: 100%;  object-fit: cover;  border-radius: 8px;}

.grid-4-photos {  flex: 1;  display: grid;  grid-template-columns: 1fr 1fr;  grid-template-rows: 1fr 1fr;  gap: 0.5rem; height: 100%;}
.grid-4-photos div {  width: 100%;  overflow: hidden;  border-radius: 6px;}
.grid-4-photos img {  width: 100%;  height: 100%;  object-fit: cover;  border-radius: 6px;}

.photo-gallery a.SelectGalerie{background: #000000; position: relative; object-fit: cover; display: block; height: 100%;border-radius: 6px;}
.photo-gallery a.SelectGalerie:hover img{ opacity: 0.5;}
.photo-gallery a.SelectGalerie:hover::before{content: ""; position: absolute; top: 50%; left:50%; transform: translate(-50%, -50%); background: var(--CouleurTaupes); -webkit-mask: url('charte/IconePhoto.svg') no-repeat 50% 50%;  mask: url('charte/IconePhoto.svg') no-repeat 50% 50%; width: 60px; height: 60px; z-index: 1;}


@media (max-width: 1024px) {
  .photo-gallery {    flex-direction: column;    height: auto;  }

  .main-photo {    height: 300px;  }

  .grid-4-photos {
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: auto;
    height: auto;
  }
s
  .grid-4-photos div {
    height: 150px;
  }
}

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

  .grid-4-photos div {
    height: 120px;
  }
}

.BtnGalerie{ position: absolute; bottom: -20px; left: 87%; transform: translateX(-50%); z-index: 1; height: 40px; background: var(--CouleurTaupe); border-radius: 5px; padding: 0px 10px 0px 40px; color:#FFFFFF; line-height: 40px; font-weight: 700;   }
.BtnGalerie::before{content: ""; position: absolute; top: 10px; left:10px; background: #FFFFFF; -webkit-mask: url('charte/IconePhoto.svg') no-repeat 50% 50%;  mask: url('charte/IconePhoto.svg') no-repeat 50% 50%; width: 20px; height: 20px; z-index: 1;}

@media (max-width: 768px) {
	.BtnGalerie{left: 50%; }
}