/* =========================================================================
   Isolation Laurentienne — Habillage premium (surcouche chargée en dernier)
   Direction : « Artisan des Laurentides, éditorial et haut de gamme »
   NB : n'écrase JAMAIS les background-image des bannières (.hero2-bg, .herobg-*)
   ========================================================================= */

:root{
  --ink:#201D24;
  --plum:#912C90;
  --plum-deep:#5E1B5C;
  --paper:#FBFAFB;
  --mist:#F4F1F5;
  --line:#E7E2EA;
  --muted:#726C77;
  --shadow-sm:0 2px 10px rgba(32,29,36,.06);
  --shadow-md:0 14px 40px -18px rgba(32,29,36,.28);
  --shadow-lg:0 26px 70px -30px rgba(94,27,92,.40);
  --radius:14px;
  --radius-sm:9px;
  --display:"Fraunces",Georgia,"Times New Roman",serif;
  --body:"Ubuntu",system-ui,-apple-system,"Segoe UI",sans-serif;
  --ease:cubic-bezier(.2,.7,.2,1);
  --wrap:1160px;
}

/* ---------- Base ---------------------------------------------------------- */
html{scroll-behavior:smooth;}
body{
  background:var(--paper)!important;
  color:var(--ink)!important;
  font-family:var(--body)!important;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  line-height:1.65;
}
::selection{background:rgba(145,44,144,.16);}
img{max-width:100%;height:auto;}
a{transition:color .2s var(--ease);}

.container{max-width:var(--wrap)!important;}

/* ---------- Typographie --------------------------------------------------- */
h1,h2,h3,.hero-content h1,
.services-title h4,.new-blog h4,.blog-title h4,.button-blog-content h4,
.footer-single-content h4,.bordereds h3,.igloo-con h3,.contact-info-box h4{
  font-family:var(--display)!important;
  font-optical-sizing:auto;
  letter-spacing:-.01em;
  line-height:1.14;
}
p{color:var(--ink);}
.newa,.blog1,.text1{
  color:var(--plum)!important;
  font-family:var(--body)!important;
  font-weight:500!important;
  font-size:1.02rem!important;
  letter-spacing:.01em;
}
.newb,.newk,.blog2,.blog3,.text2,.m-s,.m-t4,.m-gs,.m-jg,.mar-1{
  color:#403B44!important;
}
.bold1,.bold2,.boldi{
  font-family:var(--display)!important;
  color:var(--ink)!important;
  font-weight:600!important;
  font-size:1.22rem!important;
}

/* Surtitre réutilisable (ajouté via ::before sur les titres de section) */
.services-title,.blog-title,.services-bottom-text{position:relative;}

/* ---------- Boutons & liens d'action ------------------------------------- */
.hero-content a,
.blog-title a,.button-blog-content a,
.price-text1 a,
.contact-form button{
  display:inline-block;
  font-family:var(--body)!important;
  font-weight:600!important;
  font-size:.95rem!important;
  letter-spacing:.02em;
  color:#fff!important;
  background:var(--plum)!important;
  border:0!important;
  border-radius:999px!important;
  padding:13px 30px!important;
  box-shadow:0 10px 24px -12px rgba(145,44,144,.7);
  transition:transform .2s var(--ease),background .2s var(--ease),box-shadow .2s var(--ease);
}
.hero-content a:hover,
.blog-title a:hover,.button-blog-content a:hover,
.price-text1 a:hover,
.contact-form button:hover{
  background:var(--plum-deep)!important;
  transform:translateY(-2px);
  box-shadow:0 16px 30px -12px rgba(94,27,92,.75);
  color:#fff!important;
}
.new-blog a:not([class]){color:var(--plum);font-weight:600;}

/* ---------- Bandeau supérieur (RBQ) & en-tête ---------------------------- */
.header-area{
  background:#fff!important;
  padding:0!important;
  color:var(--ink);
  border-bottom:1px solid var(--line);
}
.header-area .headertop{
  padding:11px 0;background:var(--plum);
}
.header-area .headertop p{
  margin:0;color:#fff!important;font-size:.72rem;letter-spacing:.22em;
  text-transform:uppercase;font-weight:600;display:flex;align-items:center;
}
.header-area .headertop p::before{
  content:"\f0a3";font-family:"Font Awesome 5 Free";font-weight:900;
  font-size:.85rem;margin-right:10px;opacity:.9;letter-spacing:0;
}
.header-area .row.d-flex{
  background:#fff;margin:0;padding:18px 0;
}
.header-area .single-header-content img{max-height:66px;width:auto;}
.header-area .single-header-content p{margin:3px 0;}
.header-area .single-header-content p a{
  color:var(--ink)!important;font-weight:600;font-size:1.08rem;letter-spacing:.01em;
}
.header-area .single-header-content p a[href^="tel"]::before{
  content:"\f095";font-family:"Font Awesome 5 Free";font-weight:900;
  color:var(--plum);margin-right:9px;font-size:.82em;
}
.header-area .single-header-content p a:hover{color:var(--plum)!important;}
.header-area ul{margin:0;padding:0;list-style:none;display:flex;justify-content:flex-end;align-items:center;gap:10px;height:100%;}
.header-area ul li a{
  display:inline-flex;align-items:center;justify-content:center;
  width:42px;height:42px;border-radius:50%;
  background:var(--mist);color:var(--plum)!important;
  transition:transform .2s var(--ease),background .2s var(--ease),color .2s var(--ease);
}
.header-area ul li a:hover{background:var(--plum)!important;color:#fff!important;transform:translateY(-2px);}

/* ---------- Menu principal (desktop) ------------------------------------- */
.main-menu-area{
  background:#fff!important;
  border-bottom:1px solid var(--line);
  transition:box-shadow .25s var(--ease);
  z-index:60;
}
body.is-scrolled .main-menu-area{box-shadow:0 10px 30px -18px rgba(32,29,36,.35);}
#mobile-menu > ul{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px;margin:0;padding:0;list-style:none;}
#mobile-menu > ul > li{position:relative;}
#mobile-menu > ul > li > a{
  display:block;color:var(--ink)!important;font-family:var(--body)!important;
  font-weight:500!important;font-size:.92rem!important;letter-spacing:.02em;
  padding:13px 20px!important;margin:9px 2px;border-radius:999px;
  text-transform:none!important;position:relative;
  transition:color .2s var(--ease),background .2s var(--ease);
}
#mobile-menu > ul > li:hover > a,
#mobile-menu > ul > li > a:hover{color:var(--plum)!important;background:var(--mist);}
#mobile-menu > ul > li > a span i{margin-left:5px;font-size:.7rem;}

/* Sous-menu */
#mobile-menu .submenu{
  position:absolute;left:0;top:100%;min-width:246px;
  background:#fff;border:1px solid var(--line);border-radius:12px;
  box-shadow:var(--shadow-md);padding:8px;margin:0;list-style:none;
  opacity:0;visibility:hidden;transform:translateY(8px);
  transition:opacity .22s var(--ease),transform .22s var(--ease),visibility .22s;
  z-index:70;
}
#mobile-menu > ul > li:hover .submenu{opacity:1;visibility:visible;transform:translateY(0);}
#mobile-menu .submenu li a{
  display:block;padding:11px 14px;border-radius:8px;color:var(--ink)!important;
  font-size:.9rem;font-weight:500;transition:background .18s var(--ease),color .18s var(--ease);
}
#mobile-menu .submenu li a:hover{background:var(--mist);color:var(--plum)!important;}

/* ---------- Menu mobile (meanmenu) --------------------------------------- */
.mean-container .mean-bar{background:#fff!important;padding:10px 0;border-bottom:1px solid var(--line);}
.mean-container a.meanmenu-reveal{color:var(--plum)!important;padding:14px 12px!important;}
.mean-container a.meanmenu-reveal span{background:var(--plum)!important;height:2px!important;margin-top:3px;}
.mean-container .mean-nav{background:var(--ink)!important;margin-top:52px;}
.mean-container .mean-nav ul li a{
  color:#EDE8F0!important;border-top:1px solid rgba(255,255,255,.07)!important;
  padding:1.05em 5%!important;font-size:.98rem;font-weight:500;
}
.mean-container .mean-nav ul li a:hover{background:rgba(145,44,144,.35)!important;color:#fff!important;}
.mean-container .mean-nav ul li a.mean-expand{border:0!important;height:auto;}

/* ---------- Hero (accueil) — overlay sans toucher l'image ---------------- */
.hero-area{position:relative;isolation:isolate;}
.hero-area::before{
  content:"";position:absolute;inset:0;z-index:0;
  background:linear-gradient(180deg,rgba(24,20,28,.30) 0%,rgba(24,20,28,.62) 100%),
             radial-gradient(120% 90% at 20% 20%,rgba(145,44,144,.20),transparent 60%);
}
.hero-area .container{position:relative;z-index:1;}
.hero-area{padding:clamp(84px,14vw,150px) 0!important;}
.hero-content h1{
  color:#fff!important;font-size:clamp(2.1rem,5.2vw,3.7rem)!important;
  font-weight:600!important;max-width:16ch;margin:0 0 .5em;
  text-shadow:0 2px 30px rgba(0,0,0,.25);
}
.hero-content p{color:rgba(255,255,255,.92)!important;font-size:clamp(1.05rem,2vw,1.3rem)!important;margin-bottom:1.7em;max-width:40ch;}

/* ---------- Titres de section -------------------------------------------- */
.services-title{padding:clamp(56px,8vw,90px) 0 8px;text-align:center;}
.services-title h4,.blog-title h4{
  font-size:clamp(1.7rem,3.4vw,2.5rem)!important;color:var(--ink)!important;font-weight:600!important;
}
.services-title h4::before{
  content:"Notre engagement";display:block;font-family:var(--body);font-size:.74rem;
  letter-spacing:.22em;text-transform:uppercase;color:var(--plum);margin-bottom:14px;font-weight:600;
}
.services-title h4::after{
  content:"";display:block;width:54px;height:3px;background:var(--plum);
  border-radius:3px;margin:18px auto 0;
}

/* ---------- Cartes de services (4 icônes) -------------------------------- */
.services-area{padding-bottom:clamp(50px,7vw,84px);}
.services-wrap{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:30px 18px 26px!important;box-shadow:var(--shadow-sm);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s var(--ease);
  position:relative;overflow:hidden;height:100%;
}
.services-wrap::before{
  content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--plum);
  transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease);
}
.services-wrap:hover{transform:translateY(-6px);box-shadow:var(--shadow-md);border-color:transparent;}
.services-wrap:hover::before{transform:scaleX(1);}
.single-services{
  width:96px;height:96px;margin:0 auto 18px;border-radius:50%;
  background:var(--mist);display:flex;align-items:center;justify-content:center;
  transition:background .3s var(--ease);
}
.services-wrap:hover .single-services{background:rgba(145,44,144,.12);}
.single-services img{max-width:52px;max-height:52px;}
.services-wrap > a:last-child{
  display:block;font-family:var(--display)!important;color:var(--ink)!important;
  font-size:1.12rem;font-weight:600;letter-spacing:-.01em;
}
.services-wrap:hover > a:last-child{color:var(--plum)!important;}

/* ---------- Bandeau « Témoignages » -------------------------------------- */
.services-bottom-area{background:var(--mist);margin-top:clamp(30px,5vw,60px);}
.services-bottom-text{padding:clamp(40px,6vw,68px) 0;text-align:center;}
.services-bottom-text p{
  font-family:var(--display)!important;font-size:clamp(1.5rem,3vw,2.2rem)!important;
  color:var(--ink)!important;margin:0;font-weight:500;
}
.services-bottom-text p::before{
  content:"\201C";color:var(--plum);font-family:var(--display);font-size:2.4em;
  line-height:0;position:relative;top:.32em;margin-right:.08em;opacity:.5;
}

/* ---------- Section subventions / contenu -------------------------------- */
.services-blog-content-area{padding:clamp(60px,9vw,110px) 0;}
.bblog-content-wrap{
  display:grid;grid-template-columns:1.4fr 1fr;gap:clamp(28px,4vw,56px);align-items:start;
  margin-bottom:clamp(44px,6vw,72px);
}
.blog-title h4::before{
  content:"Isolation Laurentienne";display:block;font-family:var(--body);font-size:.74rem;
  letter-spacing:.22em;text-transform:uppercase;color:var(--plum);margin-bottom:12px;font-weight:600;
}
.button-blog-content{
  background:var(--mist);border:1px solid var(--line);border-radius:var(--radius);
  padding:clamp(24px,3vw,36px)!important;box-shadow:var(--shadow-sm);
}
.button-blog-content h4{font-size:1.5rem!important;color:var(--ink)!important;margin-bottom:.5em;}

/* Logos de programmes (Rénoclimat, etc.) */
.blog-item{display:flex;flex-wrap:wrap;gap:20px;justify-content:center;}
.single-blog{
  flex:1 1 180px;max-width:220px;background:#fff;border:1px solid var(--line);
  border-radius:var(--radius);padding:22px 18px;text-align:center;box-shadow:var(--shadow-sm);
  transition:transform .28s var(--ease),box-shadow .28s var(--ease);
}
.single-blog:hover{transform:translateY(-5px);box-shadow:var(--shadow-md);}
.single-blog .items img{max-height:74px;width:auto;margin:0 auto 14px;
  filter:grayscale(1);opacity:.72;transition:filter .3s var(--ease),opacity .3s var(--ease);}
.single-blog:hover .items img{filter:none;opacity:1;}
.single-blog .blogu a{color:var(--plum)!important;font-weight:600;font-size:.92rem;}
.single-blog.centerr1{margin:0 auto;}

/* ---------- Bannière pages intérieures (overlay léger) ------------------- */
.pag-2-hero-bg{position:relative;}
.pag-2-hero-bg .hero2-bg{
  min-height:clamp(190px,30vw,330px);background-size:cover;background-position:center;
  position:relative;border-radius:0;
}
.pag-2-hero-bg::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  box-shadow:inset 0 -70px 90px -50px rgba(24,20,28,.55);
}

/* ---------- Contenu pages intérieures ------------------------------------ */
.page2-blog-contentarea{padding:clamp(50px,7vw,90px) 0;}
.new-blog{margin-bottom:34px;}
.new-blog h4{font-size:clamp(1.55rem,3vw,2.15rem)!important;color:var(--ink)!important;font-weight:600!important;margin-bottom:.55em;}
.new-blog h4::before{
  content:"";display:block;width:46px;height:3px;background:var(--plum);border-radius:3px;margin-bottom:20px;
}
.page-3list ul{list-style:none;padding:0;margin:14px 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:8px 22px;}
.page-3list ul li,
.new-blog ul:not(.submenu) li{
  position:relative;padding-left:26px;margin:7px 0;color:#403B44;
}
.page-3list ul li::before,
.new-blog ul:not(.submenu) li::before{
  content:"";position:absolute;left:0;top:.55em;width:9px;height:9px;border-radius:2px;
  background:var(--plum);transform:rotate(45deg);
}

/* ---------- Encadré « Estimation gratuite » (sidebar) -------------------- */
.blog-price{
  background:#fff!important;border:1px solid var(--line)!important;border-radius:var(--radius)!important;
  padding:30px 26px!important;box-shadow:var(--shadow-md)!important;position:sticky;top:96px;
}
.blog-price .price1{text-align:center;}
.blog-price .price1 img{max-height:62px;width:auto;}
.price-text1{text-align:center;padding-top:8px;}
.price-text1 h4{font-size:1.5rem!important;color:var(--ink)!important;margin-bottom:.35em;}
.price-text1 p{color:var(--muted)!important;margin-bottom:1.1em;}
.price-text1 a{margin-top:4px;}

/* « Idéal pour l'isolation de vos : » */
.page3-right-content{margin-top:26px;padding-top:24px;border-top:1px solid var(--line);}
.bordereds h3,.igloo-con h3{font-size:1.12rem!important;color:var(--ink)!important;margin-bottom:14px;}
.page-3right-list11 ul{list-style:none;padding:0;margin:0;}
.page-3right-list11 ul li{
  position:relative;padding-left:26px;margin:9px 0;color:#403B44;font-size:.95rem;
}
.page-3right-list11 ul li::before{
  content:"\2713";position:absolute;left:0;top:0;color:var(--plum);font-weight:700;
}
.igloo-con{margin-top:24px;padding-top:22px;border-top:1px solid var(--line);}
.igloo-pic{display:flex;gap:14px;flex-wrap:wrap;}
.igloo-pic img{max-height:52px;width:auto;filter:grayscale(1);opacity:.8;transition:.3s var(--ease);}
.igloo-pic img:hover{filter:none;opacity:1;}

/* ---------- Formulaire contact & carte ----------------------------------- */
.contact-info-box{box-shadow:var(--shadow-sm);}
.contact-map-area{margin-top:0;}
.contact-map-area iframe{filter:saturate(.92) contrast(1.02);}

/* ---------- Pied de page (clair, éditorial) ------------------------------ */
.footer-top-area{
  background:var(--mist)!important;color:var(--ink)!important;
  border-top:1px solid var(--line);padding:clamp(52px,7vw,80px) 0 28px!important;
}
.footer-single-content h4{
  color:var(--ink)!important;font-size:1.15rem!important;margin-bottom:16px;
  position:relative;padding-bottom:12px;
}
.footer-single-content h4::after{content:"";position:absolute;left:0;bottom:0;width:32px;height:2px;background:var(--plum);border-radius:2px;}
.footer-single-content p,.foter-info p,.info-list li{color:#4A454E!important;font-size:.94rem;line-height:1.7;}
.foter-logo img{max-height:74px;width:auto;}
.foter-contact a,.footer-single-content a{color:var(--plum)!important;font-weight:500;display:inline-block;margin:2px 0;}
.foter-contact a:hover,.footer-single-content a:hover{color:var(--plum-deep)!important;}
.foter-contact p{margin:12px 0 2px;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)!important;}
.info-list ul{list-style:none;padding:0;margin:0;}
.info-list li{position:relative;padding-left:18px;margin:6px 0;}
.info-list li::before{content:"";position:absolute;left:0;top:.62em;width:6px;height:6px;border-radius:50%;background:var(--plum);}
.footer-textt{margin-top:36px;padding-top:24px;border-top:1px solid var(--line);text-align:center;}
.footer-textt p{color:var(--muted)!important;font-size:.86rem;margin:0;}
.footer-textt img{max-height:30px;width:auto;opacity:.75;transition:opacity .2s var(--ease);margin-top:12px;}
.footer-textt img:hover{opacity:1;}

/* ---------- Galerie « Réalisations » ------------------------------------- */
.realisations-gallery{margin-top:6px;}
.realisations-gallery h3{font-size:clamp(1.3rem,2.6vw,1.85rem)!important;color:var(--ink)!important;margin:38px 0 6px;}
.realisations-gallery h3::before{content:"";display:block;width:42px;height:3px;background:var(--plum);border-radius:3px;margin-bottom:16px;}
.gallery-caption{color:var(--muted)!important;font-size:.98rem;margin:0 0 18px;max-width:62ch;}
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px;margin-bottom:16px;}
.gallery-grid .example-image-link{display:block;border-radius:12px;overflow:hidden;box-shadow:var(--shadow-sm);position:relative;aspect-ratio:4/3;background:var(--mist);}
.gallery-grid .example-image-link::after{content:"\f00e";font-family:"Font Awesome 5 Free";font-weight:900;position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;background:rgba(94,27,92,0);opacity:0;transition:opacity .3s var(--ease),background .3s var(--ease);font-size:1.35rem;}
.gallery-grid .example-image-link:hover::after{background:rgba(94,27,92,.42);opacity:1;}
.gallery-grid .example-image{width:100%;height:100%;object-fit:cover;display:block;transition:transform .55s var(--ease);}
.gallery-grid .example-image-link:hover .example-image{transform:scale(1.06);}
.realisations-gallery hr{border:0;border-top:1px solid var(--line);margin:42px 0;}
@media (max-width:767px){.gallery-grid{grid-template-columns:repeat(2,1fr);gap:10px;}}

/* ---------- Révélations au défilement ------------------------------------ */.reveal-init{opacity:0;transform:translateY(20px);}
.reveal-in{opacity:1;transform:none;transition:opacity .7s var(--ease),transform .8s var(--ease);}

/* ---------- Responsive / mobile ------------------------------------------ */
@media (max-width:991px){
  .bblog-content-wrap{grid-template-columns:1fr;}
  .blog-price{position:static;top:auto;margin-top:34px;}
}
@media (max-width:767px){
  .header-area .row.d-flex{text-align:center;}
  .header-area .single-header-content,
  .header-area .single-header-content.text-right{text-align:center!important;margin:8px 0;}
  .header-area ul{justify-content:center;}
  .header-area .single-header-content img{max-height:56px;}
  .hero-content h1{max-width:100%;}
  .hero-content p{max-width:100%;}
  .services-wrap{margin-bottom:18px;}
  .single-blog{flex:1 1 140px;}
  .page-3list ul{grid-template-columns:1fr;}
  .contact-map-area iframe{height:320px;}
  .footer-single-content{margin-bottom:30px;text-align:center;}
  .footer-single-content h4::after{left:50%;transform:translateX(-50%);}
  .info-list li{padding-left:0;}
  .info-list li::before{display:none;}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  .reveal-init{opacity:1;transform:none;}
  *{transition-duration:.001ms!important;animation-duration:.001ms!important;}
}

/* ---------- Galerie de réalisations -------------------------------------- */
.realisations-gallery{margin-top:8px;}
.realisations-gallery h3{
  font-family:var(--display)!important;font-size:1.5rem!important;color:var(--ink)!important;
  margin:36px 0 8px;font-weight:600;
}
.realisations-gallery h3:first-child{margin-top:4px;}
.realisations-gallery hr{border:0;height:1px;background:var(--line);margin:40px 0 6px;}
.gallery-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(155px,1fr));gap:12px;margin:14px 0;
}
.example-image-link{
  display:block;position:relative;overflow:hidden;border-radius:12px;
  aspect-ratio:4/3;background:var(--mist);box-shadow:var(--shadow-sm);
}
.example-image-link::after{
  content:"\f00e";font-family:"Font Awesome 5 Free";font-weight:900;color:#fff;
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-size:1.35rem;background:rgba(94,27,92,.42);opacity:0;transition:opacity .3s var(--ease);
}
.example-image-link:hover::after{opacity:1;}
.example-image{
  width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s var(--ease);
}
.example-image-link:hover .example-image{transform:scale(1.06);}
.gallery-caption{color:var(--muted)!important;font-size:.92rem;font-style:italic;margin:8px 0 20px;}

/* Lightbox maison (aucune dépendance) */
.il-lightbox{
  position:fixed;inset:0;z-index:9999;background:rgba(20,17,24,.93);
  display:flex;align-items:center;justify-content:center;flex-direction:column;
  padding:28px;opacity:0;visibility:hidden;transition:opacity .3s var(--ease),visibility .3s;
}
.il-lightbox.open{opacity:1;visibility:visible;}
.il-lightbox img{max-width:92vw;max-height:80vh;border-radius:8px;box-shadow:0 30px 80px rgba(0,0,0,.5);}
.il-lightbox .il-cap{color:#EDE8F0;font-size:.95rem;margin-top:16px;max-width:760px;text-align:center;}
.il-lightbox .il-close{position:absolute;top:18px;right:26px;color:#fff;font-size:2.2rem;cursor:pointer;line-height:1;background:none;border:0;opacity:.85;}
.il-lightbox .il-close:hover{opacity:1;}

@media (max-width:767px){
  .gallery-grid{grid-template-columns:repeat(2,1fr);gap:9px;}
}
