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

.header {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	z-index: 999;
}

.header .container {
	background-color: #fff;
	position: relative;
	margin-top: 30px;
	border-radius: 30px;
}

.logo {
	padding: 15px 30px;
}

.logo img {
	height: 60px;
}

.menus {
	position: absolute;
	top: 25px;
	right: 30px;
}

.menus ul {
	margin: 0;
	padding: 0;
}

.menus ul li {
	margin: 0;
	padding: 0;
	list-style: none;
	display: inline-block;
}

.menus ul li a {
	color: #1F1A17;
	display: block;
	padding: 10px 20px;
	font-weight: bold;
}

.menus ul li a:hover, .menus ul li a.is-active {
	background:#f2efe9;
	border-radius: 10px;
	text-decoration: none;
}

/* Burger */
.burger{ display:none; width:44px; height:44px; border-radius:10px; border:1px solid #e5e2dc; background:#fff; align-items:center; justify-content:center; cursor:pointer; }
.burger span, .burger::before, .burger::after{ content:""; display:block; width:22px; height:2px; background:#111; border-radius:2px; transition:.25s; }
.burger span{ transform:translateY(0); }
.burger::before{ transform:translateY(-6px); }
.burger::after{ transform:translateY(6px); }
.burger.is-open span{ opacity:0; }
.burger.is-open::before{ transform:rotate(45deg); }
.burger.is-open::after{ transform:rotate(-45deg); }

/* Mobile drawer */
.drawer{ position:fixed; inset:auto 0 0 0; top:0; display:none; z-index:1200; }
.drawer .backdrop{ position:absolute; inset:0; background:rgba(0,0,0,.35); opacity:0; transition:opacity .25s; }
.drawer .panel{ position:absolute; right:0; top:0; height:100%; width:min(86vw,380px); background:#fff; box-shadow:-10px 0 24px rgba(0,0,0,.12); transform:translateX(100%); transition:transform .3s; display:flex; flex-direction:column; }
.drawer .panel .top{ display:flex; align-items:center; gap:10px; padding:16px; border-bottom:1px solid #eee; }
.drawer .panel nav a{ display:block; padding:14px 18px; border-bottom:1px solid #f1f1f1; color:#111; text-decoration:none; font-weight:700; }
.drawer .panel nav a:hover{ background:#faf8f4; }
.drawer.is-open{ display:block; }
.drawer.is-open .backdrop{ opacity:1; }
.drawer.is-open .panel{ transform:none; }

/* slider */

/*
.slider {
	height: 700px;
}

.slide {
	height: 100%;
	background-size: cover;
	background-position: center;
}

.slideTitre {
	padding-top: 450px;
	color: #fff;
	text-align: center;
	font-weight: 900;
	font-size: 40px;
    text-shadow: 2px 2px 6px rgba(0,0,0,0.7);
}

.slideSousTitre {
	color: #fff;
	text-align: center;
	font-weight: 100;
	font-size: 30px;
    text-shadow: 1px 1px 4px rgba(0,0,0,0.6);
}
*/
/* Container */
/* Container */
.slider{
  position:relative;
  height:700px;
  overflow:hidden;
}

/* Slides empilés */
.slide{
  position:absolute; inset:0;
  background-size:cover; background-position:center;
  height:100%;
  z-index:1;
  opacity:0;
  transition:opacity .4s ease;
  display:flex; flex-direction:column; justify-content:center; align-items:center;
  text-align:center;
  padding-top: 450px;
}
.slide.is-active{ opacity:1; z-index:2; }
.slide.is-under { opacity:1; z-index:1; } /* prochain slide, dessous */

/* Texte (ton style) */
.slideTitre{
  color:#fff; text-align:center; font-weight:900; font-size:40px;
  text-shadow:2px 2px 6px rgba(0,0,0,.9);
  margin-bottom:10px;
}
.slideSousTitre{
  color:#fff; text-align:center; font-weight:100; font-size:30px;
  text-shadow:2px 2px 4px rgba(0,0,0,.9);
}

/* --- MODE A : clip-path qui se referme sur le slide courant --- */
.slide.shrink-circle{
  /* centre du cercle ajustable en CSS vars */
  --cx:50%; --cy:60%;
  --r:150%; /* départ grand = couvre tout */
  clip-path: circle(var(--r) at var(--cx) var(--cy));
  -webkit-clip-path: circle(var(--r) at var(--cx) var(--cy));
  transition: clip-path 1s ease-in-out, -webkit-clip-path 1s ease-in-out;
}
.slide.shrink-circle.to-zero{
  --r:0%;
  clip-path: circle(var(--r) at var(--cx) var(--cy));
  -webkit-clip-path: circle(var(--r) at var(--cx) var(--cy));
}

/* --- MODE B (fallback) : bulle qui rétrécit avec fond + texte cloné --- */
.circle-shrink{
  position:absolute;
  left:50%; top:60%;
  transform:translate(-50%,-50%);
  width:0; height:0;
  border-radius:50%;
  background-size:cover; background-position:center;
  z-index:3; pointer-events:none;
  display:flex; flex-direction:column; justify-content:center; align-items:center;
  text-align:center;
  overflow:hidden; /* garde le texte dans le cercle */
}

/* Texte cloné dans la bulle */
.circle-shrink .bubbleTitre{
  color:#fff; font-weight:900; font-size:40px; text-shadow:2px 2px 6px rgba(0,0,0,.7);
  margin-bottom:10px; transform:scale(1); opacity:1;
}
.circle-shrink .bubbleSousTitre{
  color:#fff; font-weight:100; font-size:30px; text-shadow:1px 1px 4px rgba(0,0,0,.6);
  transform:scale(1); opacity:1;
}

/* Responsive rapide */
@media (max-width:768px){
  .slideTitre{ font-size:28px; }
  .slideSousTitre{ font-size:18px; }
  .circle-shrink .bubbleTitre{ font-size:28px; }
  .circle-shrink .bubbleSousTitre{ font-size:18px; }
}

.slider-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(0,0,0,0.4);
  border: none;
  color: #fff;
  font-size: 20px;
  cursor: pointer;
  padding: 5px 15px;
  border-radius: 50%;
  transition: background 0.3s;
  z-index: 10;
}
.slider-arrow:hover {
  background: rgba(0,0,0,0.7);
}
.slider-arrow.prev { left: 20px; }
.slider-arrow.next { right: 20px; }

/* fin slider */

.section {
	padding: 100px 0;
}

.section-icones {
	background-color: #1F1A17;
	padding: 50px 0;
	text-align: center;
}

.section-icones img {
	max-width: 100%;
	height: 150px;
}

.homeIconeTexte {
	text-align: center;
	color: #fff;
	font-weight: 900;
	font-size: 22px;
}

.section-about h1, .section-modeles h2, .section-actualites h2 {
	font-size: 36px;
	font-weight: 900;
	color: #544438;
}

.section-about h2, .section-modeles h3, .section-actualites h3 {
	font-size: 30px;
	font-weight: 600;
	margin-bottom: 20px;
	color: #E1C265;
}

.section-modeles h2, .section-actualites h2 {
	text-align: center;
}

.section-modeles h3, .section-actualites h3 {
	text-align: center;
	margin-bottom: 50px;
}

.aboutImg {
	text-align: center;
}

.aboutImg img {
	max-width: 100%;
	border-radius: 30px;
	max-height: 600px;
}

.aboutTexte {
	background-image: url(../img/about-house-bg.png);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}

.section-infos {
	background-color: #E1C265;
	position: relative;
}

.blocInfos {
	background-color: #fff;
	border-radius: 30px;
	height: 100%;
}

.blocInfosTitre {
	padding: 70px 30px 0px 30px;
	text-align: center;
	font-weight: 900;
	text-transform: uppercase;
	color: #544438;
}

.blocInfosTexte {
	padding: 30px;
	text-align: center;
	padding-bottom: 90px;
}

.blocInfosTexteDetail {
    display: none;
}

.swal-infos-wrapper {
    text-align: left;
    font-size: 16px;
    line-height: 1.6;
}

.swal-infos-popup {
    padding: 25px 35px !important;
}

.blocInfosIcone {
	background-color: #544438;
	text-align: center;
	border-radius: 100%;
	width: 100px;
	position: absolute;
	top: -50px;
	left: 50%;
	margin-left: -50px;
}

.blocInfosIcone img {
	width: 100%;
}

.blocInfosBtn {
	text-align: center;
	position: absolute;
	bottom: 30px;
	left: 0;
	right: 0;
}

.btn-princ {
  background-color: #544438;
  color: #fff;
  text-transform: uppercase;
  padding: 10px 20px;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.3s ease;
}

.btn-princ:hover {
  background-color: #6b5647; /* teinte légèrement plus claire */
  color: #fff;
  transform: translateY(-2px); /* léger effet de soulèvement */
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2); /* ombre douce */
}

.section-accroche {
	background-size: cover;
	background-position: center;
	color: #fff;
	text-align: center;
	font-size: 40px;
	font-weight: 900;
}

.section-accroche.image1 {
	background-image: url(../img/bg-bois.jpg);
}

.section-accroche.image2 {
	background-image: url(../img/bg-bois3.png?2);
}

.section-accroche.image3 {
	background-image: url(../img/bg-bois2.png?1);
}

.blocConceptUsages {
	padding: 30px
}

.blocConceptUsages h3 {
	font-size: 30px;
	text-transform: uppercase;
	color: #544438;
}

.blocConceptImage {
	position: relative;
}

.blocConceptImage::before {
	content: '';
	display: block;
	border: 2px #544438 solid;
	border-radius: 100%;
	width: 340px;
	height: 340px;
	position: absolute;
	top: 0;
	left: 0;
}

.blocConceptImage img {
	position: absolute;
	top: 20px;
	left: 20px;
	width: 300px;
	border-radius: 100%;
}

.blocModele {
	position: relative;
}

.blocModelePhoto {
    position: relative;
    width: 100%;              /* prend 100% de la largeur de la colonne */
    padding-top: 100%;        /* permet de garder un carré proportionnel */
}

.blocModelePhoto::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 2px solid #544438;
    border-radius: 50%;       /* cercle parfait */
    box-sizing: border-box;
}

.blocModelePhoto img {
    position: absolute;
    top: 20px;                /* marge intérieure */
    left: 20px;
    right: 20px;
    bottom: 20px;
    width: calc(100% - 40px); /* image adaptée avec la marge */
    height: calc(100% - 40px);
    border-radius: 50%;
    object-fit: cover;        /* garde un beau cadrage */
}

.blocModeleTitre {
	margin-top: 30px;
	text-align: center;
	color: #544438;
	font-weight: 900;
	font-size: 18px;
}

.blocModeleDescription {
	color: #544438;
	text-align: center;
}

.blocModelePrix {
	margin-top: 10px;
	text-align: center;
	color: #E1C265;
	font-size: 26px;
	font-weight: 900;
}

.formContact {
	background-color: #E1C265;
	padding: 50px;
	position: relative;
}

.formContactTitre {
	color: #fff;
	position: absolute;
	top: -30px;
	left: 30px;
	right: 30px;
	text-align: center;
	background-color: #22180F;
	font-weight: 900;
	padding: 15px;
	text-transform: uppercase;
}

.contactTexte {
	text-align: center;
}

.contactLogo img {
	max-width: 300px;
}

.contactImage img {
	max-width: 300px;
	border-radius: 100%;
}

#contactMap {
	height: 450px;
	margin-top: 100px;
}

.blocActu {
	position: relative;
}

.blocActuDate {
	position: absolute;
	top: 0;
	right: 0;
	padding: 3px 5px;
	background-color: #E2C46C;
	font-size: 10px;
}

.blocActuImage {
	background-size: cover;
	height: 250px;
}

.blocActuTitre {
	font-weight: 900;
	padding: 15px 0;
}

.blocActuTexte {
	color: #666;
}

.blocActuBtn {
	margin-top: 15px;
}

.blocActuJournal {
	color: #444;
	text-transform: uppercase;
	font-size: 12px;
}

.footer {
	background-color: #1F1A17;
	padding: 100px 0;
}

.footerLogo {
	margin-bottom: 20px;
	text-align: center;
}

.footerLogo img {
	width: 100%;
}

.footerAbout {
	color: #fff;
}

.footerCol {
	width: 80%;
}

.footerCol h4 {
	color: #E1C265;
	font-size: 28px;
	font-weight: 900;
}

.footerCol ul {
	margin: 0;
	padding: 0;
}

.footerCol ul li {
	margin: 0;
	padding: 0;
	list-style: none;
}

.footerCol ul li a {
	color: #fff;
	display: block;
	padding: 3px 0;
}

.footerCol ul li a::before {
	color: #E1C265;
	content: '>';
	margin-right: 10px;
}

.footerContact {
	color: #fff;
	padding: 5px 0;
}

.footerContact i {
	color: #E1C265;
}

.footerContact a {
	color: #fff;
}

.footerRS {
	padding-top: 20px;
}

.contactAdresse {
	padding-top: 50px;
}

.contactAdresse i {
	color: #E1C265;
}

.contactTel i {
	color: #E1C265;
}

.contactRS {
	margin: 30px 0;
	padding-left: 15px;
}

.footerRS a, .contactRS a {
	background-color: #E1C265;
	color: #fff;
	display: inline-block;
	text-align: center;
	border-radius: 10px;
	width: 40px;
	line-height: 40px;
	font-size: 22px;
	margin-right: 15px;
}

.copyright {
	background-color: #13100E;
	color: #fff;
	text-align: center;
	padding: 15px 0;
	text-transform: uppercase;
	font-size: 12px;
}

.copyright a {
	color: #E1C265;
}


/* heager g2 */

.section-headerG2 h1 {
	text-align: center;
	color: #fff;
	padding-top: 80px;
	font-size: 40px;
	font-weight: 900;
}

.section-headerG2 h2 {
	text-align: center;
	color: #fff;
	font-size: 30px;
}

.section-contenu h3 {
	color: #000;
	font-size: 22px;
	font-weight: 900;
	margin-top: 30px;
	margin-bottom: 10px;
}

.section-contenu h3 a {
	color: #000;
}

.section-contenu p {
	color: #555;
	line-height: 26px;
}

.section-contenu p a {
	color: #E1C265;
}

.section-contenu ul li {
	color: #555;
	line-height: 26px;
}


/* GLOBAL - RESPONSIVE */

@media (max-width: 1200px) { /* LG */

	.menus ul li a {
		font-size: 14px;
		padding: 10px 16px;
	}

	.slideTitre {
		font-size: 30px;
	}

	.slideSousTitre {
		font-size: 22px;
	}

	.section-about h1, .section-modeles h2, .section-actualites h2 {
		font-size: 30px;
	}

	.section-about h2, .section-modeles h3, .section-actualites h3 {
		font-size: 26px;
	}

	.section-accroche {
		font-size: 30px;
	}

	.contactLogo img {
		max-width: 200px;
	}

}

@media (max-width: 991px) { /* MD */

	body {
		font-size: 14px;
	}

	.header {
		text-align: left;
		right: 20px;
		left: 20px;
	}

	.menus {
		display: none;
	}

  .burger{ display: inline-flex; position:absolute; top:22px; right:20px; }
  .burger.is-open {
  	top: 11px;
  }

	.slider {
		height: 500px;
	}

	.section-about h1, .section-modeles h2, .section-actualites h2 {
		font-size: 24px;
	}

	.section-about h2, .section-modeles h3, .section-actualites h3 {
		font-size: 18px;
	}

	.blocInfos {
		height: auto;
		margin: 30px auto;
		position: relative;
		max-width: 300px;
	}

	.blocInfosBtn a {
		font-size: 12px;
	}

	.blocModele {
		margin: 30px 0;
	}

	.footerCol h4 {
		font-size: 22px;
	}

	.footerRS a, .contactRS a {
		font-size: 17px;
		width: 34px;
		line-height: 34px;
	}

}

@media (max-width: 767px) { /* SM */

	.blocConceptImage {
		margin-top: 100px;
	}

	.blocConceptImage::before {
		width: 170px;
		height: 170px;
	}

	.blocConceptImage img {
		width: 130px;
	}

	.footerCol1 {
		margin-bottom: 50px;
	}

	.footerCol {
		width: 100%;
	}

}

@media (max-width: 575px) { /* XS */

	.formContact {
		padding: 30px;
		padding-top: 80px;
	}

	.section-accroche {
		font-size: 20px;
	}

	.blocConceptImage {
		height: 200px;
	}

	.blocActu {
		margin: 30px 0;
	}

	.footerCol2 {
		margin-bottom: 30px;
	}

	.blocModelePhoto {
		width: 80%;
		padding-top: 80%;
		margin: 0 auto;
	}

	.slideTitre {
		font-size: 23px;
	}

	.slideSousTitre {
		font-size: 16px;
	}

}