/* ============================================================
   TY COUVERTURE — template.css
   Stack : Bootstrap 5 + Smarty + WF32 + GSAP + Swiper 11 + Lenis
   ============================================================ */

/* ============================================================
   BLOC 1 — FOUNDATION (fonts, :root, resets, FA sizing)
   ============================================================ */

/* --- Fonts --- */
@font-face {
    font-family: 'Inter Tight';
    src: url('../fonts/InterTight-Regular.woff2') format('woff2'),
         url('../fonts/InterTight-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Inter Tight';
    src: url('../fonts/InterTight-Medium.woff2') format('woff2'),
         url('../fonts/InterTight-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Inter Tight';
    src: url('../fonts/InterTight-SemiBold.woff2') format('woff2'),
         url('../fonts/InterTight-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Inter Tight';
    src: url('../fonts/InterTight-Bold.woff2') format('woff2'),
         url('../fonts/InterTight-Bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* --- Design tokens (mapped from Figma) --- */
:root {
    --primary-color: #E5010D;
    --secondary-color: #E7A104;
    --tertiary-color: #8ACB01;
    --quaternary-color: #555655;
    --dark-color: #313131;
    --bg-dark: #1B1B1B;
    --light-color: #FFFFFF;

    --bs-primary: #E5010D;
    --bs-primary-rgb: 229, 1, 13;
    --bs-secondary: #E7A104;
    --bs-secondary-rgb: 231, 161, 4;
    --bs-body-color: #555655;
    --bs-body-bg: #FFFFFF;
    --bs-body-font-family: 'Inter Tight', sans-serif;
    --bs-body-font-size: 15px;
    --bs-body-line-height: 1.6;

    --ff-base: 'Inter Tight', sans-serif;

    --container-max: 1440px;
    --container-pad: 15px;
    --header-height: 110px;
    --transition: .3s ease;
}

/* --- Resets --- */
*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
    font-family: var(--ff-base);
    font-weight: 400;
    font-size: 15px;
    line-height: 24px;
    color: var(--quaternary-color);
    background: var(--light-color);
    margin: 0;
    overflow-x: hidden;
}

img { max-width: 100%; height: auto; display: block; }

a { color: var(--primary-color); text-decoration: none; transition: color var(--transition); }
a:hover { color: black; }

ul, ol { list-style: none; padding: 0; margin: 0; }

/* --- FontAwesome sizing harmonization --- */
.fas, .fa-solid, .fa-brands, .fab { line-height: 1; }

.box-light, .box-border-left, .box-border-right {
	padding: 20px 15px;
	margin: 0 0 20px;
	background: none;
      border-radius: 10px;
    border: 2px solid var(--primary-color);
}
.box-border-left {
    border-left: 7px solid var(--primary-color);
}
.box-border-right {
    border-right: 7px solid var(--primary-color);
}
.box-dark {
	padding: 20px;
	margin: 0 0 20px;
      border-radius: 10px;
    color: var(--light-color);
	background: var(--quaternary-bg);
} 
.box-dark a {
    color: var(--light-color) !important;
}
.box-dark h1, .box-dark h2, .box-dark h3, .box-dark h4, .box-dark h6, .box-dark .h1, .box-dark .h2, .box-dark .h3, .box-dark .h4, .box-dark .h6{
	color: var(--light-color);
}
.alert-success {
    border-radius: 5px!important;
}

/* ============================================================
   BLOC 2 — COMPONENTS (container, typography, buttons, forms)
   ============================================================ */
 
.p-absolute {
position: absolute !important;
}
.p-fixed {
position: fixed !important;
}
.txt-white {
--bs-text-opacity: 1;
color: rgba(var(--bs-white-rgb), var(--bs-text-opacity)) !important;
}

html, body {
  height: auto !important;
  min-height: 100%;
  overflow: visible !important;
  scroll-behavior: auto !important; /* désactive le smooth natif pour laisser Lenis gérer */
}

/* --- Typography (mapped from Figma tokens) --- */

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
	position: relative;
    font-family: var(--ff-base);
    font-weight: 600;
	line-height: 1.2em; 
    color: var(--dark-color);
	margin: 0 0 15px;
  text-transform: uppercase; 
}
h1, .h1 {
   font-size: 50px;
    color: var(--primary-color);
}
h2, .h2 {
   font-size: 40px;
}
h3, .h3 {
    font-size: 30px;
}
h4, .h4 {
    font-size: 26px;
}
h5, .h5 {
    font-size: 24px;
}
h6, .h6 {
    font-size: 22px;
}
 
p { margin: 0 0 1em; line-height: 24px; }

.subtitle {
    display: inline-block;
    font-family: var(--ff-base);
    font-weight: 400;
    font-size: 20px;
    line-height: 25px;
    letter-spacing: 5px;
    color: var(--quaternary-color);
    text-transform: uppercase;
    margin: 0 0 10px;
}
.section-header { margin-bottom: 40px; }
.section-header .subtitle { color: var(--quaternary-color); }
.section-header h2 { color: var(--dark-color); }

/* --- Buttons --- */
.btn-cta,
.btn-primary {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 16px 32px;
      line-height: normal;
    background: var(--primary-color);
    color: var(--light-color);
    font-family: var(--ff-base);
    font-weight: 500;
    font-size: 16px;
    text-transform: uppercase;
    text-decoration: none;
    border: 0;
    border-radius: 0;
    transition: background var(--transition), transform var(--transition);
    white-space: nowrap;
}
.btn-cta:hover,
.btn-primary:hover,
.btn-cta:focus,
.btn-primary:focus,
.btn-cta:active,
.btn-primary:active{
    background: var(--dark-color)!important;
    color: var(--light-color);
    transform: translateY(-2px);
}
.btn-cta img { width: 19px; height: 18px; }

.btn-back-sub-gallery{ display: block !important; }

/* ============================================================
   BLOC 3 — LAYOUT (header, hero, sections, footer, internal pages)
   ============================================================ */

/* ---------- HEADER + NAV ---------- */
.header { position: relative; }

.bx-head {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 50;
    padding: 48px 0;
    transition: background var(--transition), padding var(--transition);
}
.bx-head .container-fluid {
      max-width: 1544px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
} 
header.small .bx-head {
    position: relative;
    background: var(--quaternary-color);
}
 .logo2 {
    max-width: 100px;
}
/*--------------------------------------------------
# navbar
--------------------------------------------------*/
header nav.navbar {
padding: 0; 
} 
 header .navbar-nav .nav-link {
    display: inline-block;
    color: var(--light-color);
    font-family: var(--ff-base);
    font-weight: 500;
    font-size: 16px;
    text-transform: uppercase;
    text-decoration: none;
    padding: 8px 0!important;
    transition: color var(--transition);
}  
header .navbar-nav .nav-item.selected>.nav-link, header .navbar-nav li>.nav-link:hover, header .navbar-nav li> .nav-link:active, header .navbar-nav li>.nav-link:focus{ 
   color: var(--secondary-color)!important;
} 
 @keyframes glow {
  0% {
    text-shadow: 0 0 5px #fff;
  }
  50% {
    text-shadow: 0 0 20px #fff, 0 0 30px #9C6622, 0 0 40px #9C6622;
  }
  100% {
    text-shadow: 0 0 5px #fff;
  }
}
header .navbar-nav li {
    position: relative;
} 
 .navbar-toggler {
	position: relative;
	border: none;
	padding: 0;
	box-shadow: none !important;
}
  .navbar-nav {
     margin: 0 auto ;
    gap: 24px;
}
button.navbar-toggler:before {
	top: 0;
	transform: rotate(-32deg);
	transform-origin: right;
}
button.navbar-toggler:after {
	bottom: 0;
	transform: rotate(32deg);
	transform-origin: right;
}
button.navbar-toggler:after, button.navbar-toggler:before {
	content: '';
	width: 1.5em;
	background:var(--light-color);
	position: absolute;
	left: 0;
	height: 2px;
	transition: .3s;
}
button.navbar-toggler .navbar-toggler-icon {
	display: block;
	height: 2px;
	background-image: none;
	background-color: var(--light-color);
	transition: .1s;
	opacity: 1;
	margin: 8px 0;
}
.navbar-nav .dropdown-toggle:after {
    margin: -3px auto 0 !important;
    display: table;
    content: "\f107";
    font-family: "Font Awesome 6 Sharp" !important;
    border: none;
    font-weight: 900;
    font-size: 15px;
    color: var(--light-color); 
}
.navbar-nav .nav-item:hover .dropdown-toggle:after {
	content: "\f106";
}
.dropdown-menu {
    background: var(--quaternary-color);
    border: none;
    border-radius: 10px;
      left: 50%;
    transform: translate(-50%);
    min-width: 200px; 
  padding: 10px 0;
      text-align: center
}
.dropdown-toggle {
    white-space: nowrap;
    /*position: absolute;
    right: -15px;
    transform: translatey(-50%);
    top: 50%;
      margin-top: 2px;*/
}
header nav.navbar.sticky-top .level-0 li:first-child .dropdown-toggle {
    right: 50px;
}
.navbar-nav .dropdown-menu .nav-item .nav-link {
    padding: 4px 10px !important; 
    font-size: 15px;
    font-weight:700;
   color: var(--light-color);    display: block;
}
.navbar-nav .dropdown-menu .nav-item:not(:last-child) .nav-link {
  border-bottom:1px solid  rgba(255, 255, 255, 0.20);
}  
.navbar-nav .dropdown-menu .nav-item .nav-link:before {
  display: none;
}
.navbar.is-sticky {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    padding: 15px 0;
    z-index: 999;
    border-radius: 0;
    background: rgb(0 0 0  / 50%);
    backdrop-filter: blur(10px);
    margin: 0;
      max-width: 100%;
}
 .navbar.is-sticky .navbar-brand {
	display: none;
}
 
/* Nav CTA */
.nav-cta { display: flex; align-items: center;  flex-direction: column;
    gap: 5px;}
 

/* ---------- BANNER (HERO) — Rule 3 visible content ---------- */
.banner {
    position: relative;
    height: 900px; 
    color: var(--light-color);
    background: var(--dark-color);
}
.banner.small { min-height: 500px; }

.banner #slideshow,
.banner .carousel,
.banner .carousel-inner,
.banner .carousel-item {
    height: 100%;
    width: 100%;
}
.banner .container-fluid {
    position: absolute;
    inset: 0;
    padding: 0;
    height: 100%;
}
/* BS5 .fade fix (Rule 3) */
.banner .fade,
.banner .carousel-item { opacity: 1 !important; }

.banner #slideshow img,
.banner .carousel-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    min-height: 900px;
}
.banner.small #slideshow img,
.banner.small .carousel-item img {
    min-height: 500px;
}

/* Banner overlay gradient (Figma) */
.banner-overlay {
    position: absolute;
    inset: 0;
background: linear-gradient(0deg, rgba(0, 0, 0, 0.00) 41.04%, rgba(0, 0, 0, 0.80) 100%) ;
    pointer-events: none;
    z-index: 2;
}

section.banner .carousel-control-next, section.banner .carousel-control-prev {
	display: none;
} 
/* Banner decoratives */
.hero-deco-bottom {
    position: absolute;
    left: 0;
    bottom: -1px;
      right: 0;
    width: 100%; 
    z-index: 3;
    pointer-events: none;
    display: block;
  height: 296px;
}
.hero-deco-roof {
    position: absolute;
    right: 23px;
    bottom: -95px;
width: 552px;
height: 377px;
    z-index: 4;
    pointer-events: none;
    display: block;
} 

 


/* ---------- PRESENTATION SECTION ---------- */
.content-presentation {
    background: var(--light-color);
    padding: 40px 0 100px;
    position: relative;
}
.content-presentation .container-fluid {
    max-width: 1544px;
}

.presentation-wrapper {
    display: flex; 
    gap: 80px;
      margin-bottom: 30px;
}
.presentation-photos {     width: 762px; }
 
.photo-large {
    position: absolute;
    left: 0;
    width: 49%;
    top: 0;
    bottom: 0;
}
.photo-large img,
.photo-stack img {
    width: 100%;
    height: 100%;
    object-fit: cover;
      position: absolute;
}
.photo-stack {
    position: absolute;
    right: 0;
    width: 49%;
    top: 0;
    bottom: 0;
}
.photo-stack .photo {
    position: absolute;
    left: 0;
    right: 0;
    height: 49%; 
}
.photo-stack .photo.p1 {
     top: 0;
}
.photo-stack .photo.p2 {
     bottom: 0;
}
.presentation-text { 
     width: 678px;
    text-align: center;
    padding: 138.5px 0;
}
.presentation-text .subtitle-pres,
.presentation-text > span:first-child {
    display: block;
    font-family: var(--ff-base);
    font-weight: 400;
    font-size: 20px;
    line-height: 25px;
    letter-spacing: 5px;
    color: var(--quaternary-color);
    text-transform: uppercase;
    margin: 0 0 10px;
}
.presentation-text h1 {
    color: var(--primary-color);  
    margin: 0 0 30px;
}
.presentation-text p {
    font-size: 15px;
    line-height: 24px;
    color: var(--quaternary-color);
    margin-bottom: 20px;
}


/* ---------- SERVICES SECTION ---------- */
.services-section {
    position: relative;
    padding: 100px 0;
    background: var(--bg-dark);
    color: var(--light-color);
    overflow: hidden;
}
.services-section::before {
    content: '';
    position: absolute;
    inset: 0;
    background: url('../images/section-bg-texture.webp') center/cover no-repeat;
    opacity: .4;
    pointer-events: none;
    z-index: 0;
}
.services-section .container-fluid {max-width: 1544px; }

.services-section .section-header { text-align: center; }
.services-section .section-header .subtitle {
    color: var(--light-color);
}
.services-section .section-header h2 {
    color: var(--light-color);  
}

.blc-boxes {
    position: relative;
    display: flex;
    gap: 100px;
}
.blc-boxes .bx-home {
    display: flex;
    align-items: flex-start;
    gap: 30px;
    padding:0 0 60px;
border-bottom: 1px solid rgba(255, 255, 255, 0.25);
    position: relative;
    z-index: 2;
}
/*.blc-boxes .bx-home:last-child {*/
.blc-boxes .bx-home:not(:first-child) {
    margin-top: 60px;
} 
.services-section .part {
    display: flex;
    flex-direction: column;
    gap: 24px;
  width: 427px;
}
.services-section .part.p2 {
    position: relative;
    order: 3;
}
.services-section .bx-home .bx-icon {
    flex: 0 0 100px;
    width: 100px;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center; 
position: relative;
} 
.services-section .bx-home .bx-icon:before {
    content: "";
    position: absolute;
    top: 50%;
    transform: translate(0, -50%);
    right: -10px;
    width: 14px;
    height: 44px;
    background: var(--primary-color);
    clip-path: polygon(0 0, 0% 100%, 100% 50%);
}
.services-section .bx-home .bx-icon.icon1 {
    background: var(--primary-color) url(/smarty/wireframe30/media/images/icon1.svg) no-repeat center; 
}
.services-section .bx-home .bx-icon.icon2 {
    background: var(--primary-color) url(/smarty/wireframe30/media/images/icon2.svg) no-repeat center; 
}
.services-section .bx-home .bx-icon.icon3 {
    background: var(--primary-color) url(/smarty/wireframe30/media/images/icon3.svg) no-repeat center; 
}
.services-section .bx-home .bx-icon.icon4 {
    background:var(--primary-color) url(/smarty/wireframe30/media/images/icon4.svg) no-repeat center; 
}
.services-section .bx-home .bx-icon.icon5 {
    background:var(--primary-color) url(/smarty/wireframe30/media/images/icon5.webp) no-repeat center; 
}
.services-section .bx-home .bx-icon.icon6 {
    background:var(--primary-color) url(/smarty/wireframe30/media/images/icon6.webp) no-repeat center; 
}
.blc-boxes .bx-home:hover .bx-icon { 
    transition: all .4s;
    transform: scale(.97);
}
.services-section .bx-home .bx-content {
    flex: 1 1 auto;
    min-width: 0;
}
.services-section .bx-home .bx-content h3 {
    color: var(--light-color);
    font-size: 30px;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0 0 20px;
}
.services-section .bx-home:hover .bx-content h3 {
    color: var(--primary-color);
    transition: all .4s;
}
.services-section .bx-home .bx-content p {
    color: var(--light-color);
    font-size: 15px;
    line-height: 24px;
    margin: 0;
}
 a.link {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    z-index: 3;
    opacity: 0;
}
.house-center-wrapper {
    position: relative; 
    order: 2;
    pointer-events: none;
    width: 466px; 
      display: flex;
    align-items: center;
}
.house-center-wrapper .house-center {
    width: 100%;
    height: auto;
    display: block;
}


/* ---------- GALERIE HOME ---------- */
.galerie-home {
    background: var(--light-color);
    padding: 100px 0;
    position: relative;
} 

.galerie-home .section-header { text-align: center; margin-bottom: 40px; }
.galerie-home .section-header .subtitle { color: var(--quaternary-color); }
.galerie-home .section-header h2 { color: var(--primary-color); }

/* container */
.galerie-home .grid-gallery {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

/* chaque ligne */
.galerie-home .gallery-row {
    display: grid;
    grid-template-columns: 1fr 2fr; /* petit + grand */
    gap: 24px;
}

/* inverser la 2eme ligne */
.galerie-home .gallery-row:nth-child(2) {
    grid-template-columns: 2fr 1fr;
} 
 
.galerie-home .grid-gallery .link-picture {
    position: relative;
    overflow: hidden;
    height: 400px;
}
.galerie-home .grid-gallery .link-picture:before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background:url(/smarty/wireframe30/media/images/icon-ghal.svg) no-repeat center, linear-gradient(0deg, rgba(0, 0, 0, 0.50) 0%, rgba(0, 0, 0, 0.50) 100%);
    transition: all .4s;
    opacity: 0;z-index: 1;
}
.galerie-home .grid-gallery .link-picture:hover:before {
      opacity: 1;
}

.galerie-home .grid-gallery .link-picture img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
} 
.galerie-home .grid-gallery .link-picture:hover img {
    transform: scale(1.05);transition: all .4s;
}
.galerie-home .grid-gallery .title-picture {
	display: none;
}

.galerie-home .swiper-pagination,
.galerie-home .swiper-pagination2 {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 10px;
    text-align: center;
    z-index: 3;
}
.galerie-home .swiper-pagination .swiper-pagination-bullet,
.galerie-home .swiper-pagination2 .swiper-pagination-bullet {
    width: 10px;
    height: 10px;
    background: var(--quaternary-color);
    opacity: .4;
    margin: 0 4px;
    border-radius: 50%;
    display: inline-block;
}
.galerie-home .swiper-pagination .swiper-pagination-bullet-active,
.galerie-home .swiper-pagination2 .swiper-pagination-bullet-active {
    background: var(--primary-color);
    opacity: 1;
}


/* ---------- INTERNAL PAGES (1.tpl, 4.tpl, 5.tpl) ---------- */
.content-page {
    padding: 70px 0; 
}  
.content-page h1,
.content-page h2 {
    color: var(--dark-color);
    margin-bottom: 24px;
}
 
.content-page p { font-size: 15px; line-height: 24px; margin-bottom: 16px; }
 
section.content ul {
	padding: 0;    margin-bottom: 1rem;
}
section.content li {
	background: url(../images/bullet.webp) no-repeat left 6px;
	padding-left: 20px;
} 
section.content li::marker{
	content: "" !important;
}
h3.contact-field {
    display: none;
}
  a.btn-cookies-link {
    color: #000000;
    background: #fff;
}
.footer-b {
    display: none;
}
a.btn-cookies-link i {
    width: 22px;
}
/* ---------- CONTACT PAGE (4.tpl) ---------- */
.box-contact-info {
    background: var(--bg-dark);
    color: var(--light-color);
    padding: 30px;
}
.box-contact-info h5 {
    color: var(--secondary-color);
    font-size: 18px;
    font-weight: 600;
    margin: 0 0 12px;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    gap: 8px;
}
.box-contact-info h5 i { color: var(--primary-color); }
.box-contact-info .info-block { margin-bottom: 30px; }
.box-contact-info a { color: var(--light-color); }
.box-contact-info a:hover { color: var(--secondary-color); }
.box-contact-info .tel a { font-weight: 700; font-size: 18px; }
.box-contact-info .social {
    display: flex;
    gap: 8px;
}
.box-contact-info .social a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    background: var(--primary-color);
    color: var(--light-color);
    transition: background var(--transition);
      margin: 0 5px 0 0;
}
.box-contact-info .social a:hover { background: var(--secondary-color); }

/* Contact form (CMS module {contact_b}) */
.content-page form,
.content-page .contact-form {
    background: var(--light-color);
}
 .content-page select, .content-page .form-control{
    width: 100%;
    padding: 12px 16px;
    border: 1px solid #ddd;
    border-radius: 0;
    font-family: var(--ff-base);
    font-size: 15px;
    color: var(--dark-color);
    background: var(--light-color);
    margin-bottom: 16px;
    transition: border-color var(--transition);
}
.content-page input:focus,
.content-page textarea:focus,
.content-page select:focus {
    outline: 0;
    border-color: var(--primary-color);
}
.content-page textarea { min-height: 140px; resize: vertical; }
.content-page button[type="submit"],
.content-page input[type="submit"] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 16px 32px;
    background: var(--primary-color);
    color: var(--light-color);
    font-family: var(--ff-base);
    font-weight: 500;
    font-size: 16px;
    text-transform: uppercase;
    border: 0;
    cursor: pointer;
    transition: background var(--transition);
}
.content-page button[type="submit"]:hover,
.content-page input[type="submit"]:hover {
    background: var(--dark-color);
}


/* ---------- FOOTER ---------- */
.bottom {
    position: relative;
    padding: 80px 0  ;
    background: var(--bg-dark);
    color: var(--light-color);
    overflow: hidden;
}
.bottom::before {
    content: '';
    position: absolute;
    inset: 0;
    background: url('../images/section-bg-texture.webp') center/cover no-repeat;
    opacity: .4;
    pointer-events: none;
    z-index: 1;
}
.bottom .container-fluid {
    max-width: 1224px;
}
.bottom .bx-flx {
    position: relative;
    z-index: 2;
    max-width: 1200px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    flex-wrap: wrap;
}

.footer-logo a { display: block; }
.footer-logo img {
    height: 110px;
    width: auto;
    max-width: 271px;
} 
.bottom  .info-item {
    display: flex;
    align-items: center;
    gap: 15px;
    color: var(--light-color);
    font-size: 15px;
    line-height: 24px;
}
.bottom .info-item i {
    color: var(--primary-color);
    font-size: 16px;
}
.bottom .info-item a {
    color: var(--light-color);
    font-weight: 700;
    font-size: 15px;
}
.bottom  .info-item a:hover { color: var(--secondary-color); }

.footer-social { display: flex; align-items: center; gap: 24px; }
.footer-social .follow-label {
    color: var(--light-color);
    font-family: var(--ff-base);
    font-weight: 500;
    font-size: 20px;
}
.footer-social .social,
.footer-social .social ul {
    display: flex;
    align-items: center;
    gap: 10px;
    list-style: none;
    padding: 0;
    margin: 0;
}
.footer-social .social a,
.footer-social .social li a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    background: var(--primary-color);
    color: var(--light-color);
    font-size: 16px;
    transition: transform var(--transition), background var(--transition);
      margin: 0 10px 0 0;
}
.footer-social .social a:hover,
.footer-social .social li a:hover { transform: translateY(-3px); }
.fa-facebook::before {
    content: "\f39e" !important;
} 
/* Per-platform colors (verify on staging — adjust selectors if CMS uses different output) */
.footer-social .social a[href*="facebook"],
.footer-social .social li:nth-child(1) a { background: var(--primary-color); }
.footer-social .social a[href*="instagram"],
.footer-social .social li:nth-child(2) a { background: var(--secondary-color); }
.footer-social .social a[href*="google"],
.footer-social .social a[href*="plus.google"],
.footer-social .social li:nth-child(3) a { background: var(--tertiary-color); }

/* Footer-nav (mentions + créa) */
.footer-nav {
    background: var(--bg-dark);
    color: rgba(255, 255, 255, .6);
    border-top: 1px solid rgba(255, 255, 255, .1);
    position: relative;
    z-index: 2;
}
.footer-nav a {
    color: rgba(255, 255, 255, .8);
    text-decoration: none;
}
.footer-nav a:hover { color: var(--secondary-color); }


/* ---------- NEWS NOPHOTO FALLBACK (Rule 23 — kept for safety even if no news) ---------- */
.news-col .news-object .nophoto,
.news-object .nophoto {
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--quaternary-color);
    overflow: hidden;
}
.news-col .news-object .nophoto img,
.news-object .nophoto img {
    object-fit: scale-down;
    padding: 10px;
    max-width: 60%;
    max-height: 80%;
    opacity: 0.6;
    width: auto;
    height: auto;
}

.news-object .nophoto::before{
  content: "";
  background: url(/smarty/wireframe30/media/images/logo.svg) no-repeat center center;
  background-size: 80% auto;
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1/1;
}

.news-object .photo img{
   width: 100%;
  height: auto;
  aspect-ratio: 1/1;
  object-fit: cover;
}

.news-object .nophoto .fa-duotone.fa-image,
.news-object .nophoto .fa-solid.fa-image,
.news-object .nophoto i[class*="fa-image"] {
    display: none;
}
.news-object .news-body-desc .date {
    display: block;
    margin-bottom: 8px;
    font-size: 0.875rem;
    color: var(--quaternary-color);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.05em;
  margin-top: 15px;
}

.fslightboxci h2 {
    font-family: var(--bs-body-font-family);
    font-size: 17px;
    color: var(--bs-white);
    text-transform: none;
}

.news-object .news-body-desc .news-body{
  display: none;
}

.news-object .news-desc{
  margin-top: 15px;
}

.news-object .news-desc h3{
  font-size: 24px;
}

.news-object{
  margin-bottom: 45px;
}

/* ============================================================
   BLOC 4 — FINISHING (animations, prefers-reduced-motion, responsive)
   ============================================================ */

/* --- Smooth Lenis scroll integration helper --- */
html.lenis { height: auto; }
html.lenis.lenis-smooth { scroll-behavior: auto; }
html.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }
html.lenis.lenis-stopped { overflow: hidden; }


/* --- Reveal animations (driven by GSAP, no opacity:0 by default per Rule 3) --- */
.gsap-fade-up { will-change: transform, opacity; }
.gsap-zoom { will-change: transform; }


/* --- Reduced motion --- */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
    html.lenis.lenis-smooth { overflow: auto; }
}




section.content .row.bx-grid {
    margin-bottom: 30px;
}
section.content .row.bx-grid .img-page {
    position: relative;
    height: 100%;
    min-height: 240px;
}
section.content .row.bx-grid .img-page img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
     border-radius: 50px;  
} 
section.content .row.bx-grid .text-page {
    padding: 30px 0;
}
 


/* --- */ 
section.content.page-content.content-page .grid-gallery {
    display: flex;
    flex-wrap: wrap;
    gap: 13px;
    justify-content: center;
    margin-top: 5px;
}
section.content.page-content.content-page a.link-picture, section.content.page-content.content-page a.link-subgallery {
	display: block;
	width: 23.5%;
	background-size: cover;
	background-position: center;
	height: 300px;
	cursor: zoom-in;
      border-radius: 10px;
	position: relative;
	transition: transform .4s,box-shadow .4s;
	margin-bottom: 13px;
	background-repeat: no-repeat;
}
section.content.page-content.content-page .link-subgallery:hover, section.content.page-content.content-page .link-picture:hover {
	filter: grayscale(1);
}
section.content.page-content.content-page .pagination {
    margin-top: 20px;
    justify-content: center;
    flex-wrap: wrap;
}
section.content.page-content.content-page .pagination li {
	background-image: none !important;
	margin: 0 !important;
	padding: 0;
}
section.content.page-content.content-page .pagination .page-link{
  color: var(--tertiary-color) !important ;
}
 
section.content.page-content.content-page .pagination .active > .page-link, section.content.page-content.content-page .pagination .page-link.active {
	color: var(--bs-body-bg) !important;
	background: var(--primary-color) !important;
	border-color: var(--primary-color);
}
section.content.page-content.content-page .pagination #fslight-prev.disabled .page-link, section.content.page-content.content-page .pagination #fslight-next.disabled .page-link {
	background: var(--bs-pagination-disabled-border-color);
}
section.content.page-content.content-page span.title-subgallery{
  position : absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding : 10px;
  color : var(--bs-body-bg);
  text-align : center;
  background : rgba(0,0,0,0.7);    pointer-events: none;
}
section.content.page-content.content-page .title-picture {
	display: none;
}
.img-responsive {
	max-width: 100%;
}
/* ============================================================
   RESPONSIVE BREAKPOINTS
   ============================================================ */
@media (max-width: 1799px) {
 
}
@media (max-width: 1599px) {
 .blc-boxes { 
    gap: 25px;
}
  
  
}
@media (max-width: 1399px) {
  
  .navbar-nav{
    gap: 15px;
  }
  
  .nav-cta .btn-cta:first-child{
    font-size: 13px;
    padding: 16px 9px;
  }
  
 .hero-deco-roof { 
    right: 0;
    bottom: -40px;
    width: auto;
    height: 300px; 
    object-fit: scale-down;
}
  .banner { 
    height: 700px;
  }
  .content-presentation { 
    padding: 40px 0 70px;
  }
  .presentation-text { 
    padding: 70px 0;
}
  .presentation-wrapper { 
    gap: 25px; 
  }
  .hero-deco-bottom { 
    height: 200px;
}
 h1, .h1 {
    font-size: 40px;
  }
  h2, .h2 {
    font-size: 35px;
}
  .services-section,.galerie-home { 
    padding: 70px 0;
  }
.blc-boxes .bx-home { 
    padding: 0 0 30px;
  }
 /* .blc-boxes .bx-home:last-child {*/
    .blc-boxes .bx-home:not(:first-child) {
    margin-top: 30px;
}
  .services-section .bx-home .bx-icon {
    flex: 0 0 80px;
    width: 80px;
    height: 80px;
  }
  .services-section .part { 
    width: 400px;
        gap: 0;
}
  .bottom { 
    padding: 60px 0;
  }
  .btn-cta, .btn-primary {
	padding: 16px 22px;gap: 7px;
}
  .services-section .bx-home .bx-content h3 {
    font-size: 26px;
  }
}
@media (max-width: 1199px) {
    

    .banner { height: 700px; } 
  .bx-head .container-fluid { 
    flex-direction: column;
}
  .hero-deco-roof { 
        height: 250px;
  }
      h1, .h1 {
        font-size: 35px;
    }
  .presentation-text {
        padding: 30px 0;
    }
      .blc-boxes { 
        flex-direction: column;
    }
      .services-section .part {
        width: 100%;
        gap: 15px;
        flex-direction: initial;
    }
      .blc-boxes .bx-home { 
        width: 50%;
    }
    /*  .blc-boxes .bx-home:last-child {*/
  .blc-boxes .bx-home:not(:first-child) {
        margin-top: 0;
    }
  .services-section .bx-home .bx-content h3 {
      font-size: 21px;
  }
  .house-center-wrapper { 
    margin: auto; 
        order: inherit;
    }
  .galerie-home .grid-gallery .link-picture { 
    height: 300px;
}
  .box-contact-info { 
    padding: 20px 15px;
}
 
}

/* --- Tablet medium (≤991px) — burger appears --- */
@media (max-width: 991px) {
    
   .bx-head {
	padding: 18px 0;
}
  
   header .navbar-nav .dropdown-menu {
		transform: none;
		display: table;
		margin: 0 auto;
		min-width: inherit;
		left: 0;
	}
  	button.navbar-toggler[aria-expanded="false"]:after, button.navbar-toggler[aria-expanded="false"]:before {
        transform: none;
    }
  	button.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon {
        opacity: 0;
    }
    nav.navbar.sticky-top:not(.is-sticky) .navbar-collapse#navbarNav li#menu_1, nav.navbar.sticky-top:not(.is-sticky) .navbar-collapse#navbarNav li#menu_2 {
        display: block;
    } 
    nav.navbar.sticky-top .navbar-collapse {
		position: absolute;
		top: 100%;
		left: 50%;
		transform: translateX(-50%);
		width: 100vw;
        background: var(--dark-color); 
        padding: 10px 0;
        text-align: center;
        z-index: 100;
        clear: both;
        box-shadow: 0 0 3px rgba(0 0 0 / 30%);
	}
	header nav.navbar.sticky-top .navbar-toggler {
		margin: 5px auto 10px;
	} 
  header .navbar-nav .nav-link { 
        display: table;
        margin: 0 auto;
        padding: 6px 12px !important;  
    }
  header .navbar-nav li:first-child a {
    padding-left: 12px !important;
}
  header .navbar-nav li:last-child a {
    padding-right: 12px !important;
}
  .dropdown-toggle, header li a.nav-link:after , header .navbar-nav li:not(:first-child) a.nav-link:before, header .navbar-nav li:not(:first-child):before{
    display: none;
} 
      header li.nav-item.dropdown a.nav-link {
        padding: 6px 12px !important;
    }
  header nav.navbar {
    padding: 0; 
    background: none;
    backdrop-filter: inherit;        order: 3;
  } 
  .navbar-nav { 
    gap: 0;
}
  
.hero-deco-roof { 
        display: none;
    }
      .hero-deco-bottom {
        height: 150px;
    }
      .banner {
        height: 650px;
    }
  
    /* Presentation: stacked */
    .content-presentation {
        padding: 20px 0 70px;
    }
    .presentation-wrapper {
        flex-direction: column;
        gap: 20px;
    }
    .presentation-photos {
        width: 100%;
        max-width: 481px;
        height: 400px;
        margin: 0 auto 30px;
    }
    .presentation-text { padding: 0;    width: 100%; } 
    h1, .h1 { font-size: 36px; }
    h2, .h2 { font-size: 30px; }

    /* Services: stacked, hide center house image */
    .services-section { padding: 60px 0; }
   
    .services-section .part { 
        flex-direction: column;
    }
  .blc-boxes .bx-home {
        width: 100%;
        flex-direction: column;
        text-align: center;
        justify-content: center;
        align-items: center;
            padding: 0 0 15px;
    }
  .services-section .bx-home .bx-icon:before { 
    top: inherit;
    bottom: -12px;
    left: 50%;
    transform: translate(-50%);
    right: 0;
    width: 44px;
    height: 14px;  
    clip-path: polygon(1% 0, 50% 100%, 100% 0);
}
  
    .galerie-home { padding: 60px 0; }
        .galerie-home .grid-gallery .link-picture {
        height: 250px;
    }
    /* Footer: stacked */
    .bottom { padding: 50px 0  ;        text-align: center; }
 
  .bottom .bx-flx { 
    flex-direction: column;
} 
  .bottom .info-item { justify-content: center;         flex-direction: column;
        gap: 5px;}
  .footer-social { 
    gap: 15px;
    flex-direction: column;
}
  .footer-social .social a, .footer-social .social li a { 
    margin: 0 5px;
}
  
  .box {
    height: auto !important;
}
  
      .box-light {
        height: auto !important;
    }
	 section.content .row.bx-grid .img-page { 
    min-height: inherit;
    max-width: 370px;
    height: 400px;
    margin: 0 auto;
} 
    section.content.page-content.content-page .text-page {
        padding-bottom: 0 !important;
    } 
     section.content.page-content.content-page a.link-picture, section.content.page-content.content-page a.link-subgallery {
        width: 32%;
    }
  
  
}

/* --- Mobile (≤767px) --- */
@media (max-width: 767px) {
    h1, .h1 { font-size: 30px; }
    h2, .h2 { font-size: 26px; }
    h3, .h3 { font-size: 22px; }
  h4, .h4 {
    font-size: 21px;
}
h5, .h5 {
    font-size: 20px;
}
h6, .h6 {
    font-size: 18px;
}
   .container, .container-sm {
    max-width: 100%;
  }
    .subtitle { font-size: 16px; letter-spacing: 3px; }
 
  
  .galerie-home .gallery-row { 
    grid-template-columns: 1fr!important;
  }
   
    .footer-social .social a { width: 42px; height: 42px; font-size: 15px; }
  
   /* --- */
  	.contactForm .contact-field-item {
        width: 100%;
        float: none;
        clear: both!important;
    }
    .contactForm .contact-field-item:nth-child(even) {
        padding: 0 !important;
    }
    .contactForm .contact-field-item:nth-child(odd) {
        padding: 0 !important;
    }
  
      section.content.page-content.content-page a.link-picture, section.content.page-content.content-page a.link-subgallery {
        width: 48.5%;
    }
  
  .news-object .news-desc h3{
    height: auto !important;
  }
  .news-abstract{
    height: auto !important;
  }
  
  
}

/* --- Small mobile (≤480px) --- */
@media (max-width: 480px) {
    
      .banner {
        height: 600px;
    }
  .hero-deco-bottom {
        height: 100px;
    }
  .photo-large {
    position: relative; 
    width: 100%; 
    height: 250px;
}
  .photo-stack {
    position: relative; 
    width: 100%;
  }
      .presentation-photos { 
        height: auto;
  }
  .photo-stack .photo {
    position: relative; 
        margin-top: 10px;
    height: 250px;
}
  .bx-head { 
    padding: 24px 0;
  }
  .house-center-wrapper { 
        width: 250px;
    }
  .services-section .bx-home .bx-content h3 { 
    /*font-size: 24px;*/
    font-size: 20px;
  }
  .galerie-home .grid-gallery { 
    gap: 15px;
}
        .galerie-home .gallery-row { 
        gap: 15px;
    }
  
   section.content.page-content.content-page a.link-picture, section.content.page-content.content-page a.link-subgallery {
        width: 100%;
    }
  
}