/* =========================================================
   MJG RH — responsive layout + CSS-controlled color system
   ========================================================= */

:root{
  --top-bar-h:80px;
  --bottom-bar-h:88px;

  --bg:#f8f4ef;
  --bg-soft:#efe6de;
  --paper:#fffdfa;
  --paper-soft:#f6efe8;

  --text:#211c19;
  --text-muted:#726861;

  --dark:#1b1918;
  --dark-soft:#282523;
  --on-dark:#fffdfa;
  --on-dark-muted:#e7dfd8;

  --bronze:#875d47;
  --bronze-dark:#684535;
  --bronze-light:#b98f74;
  --gold:#c99d61;
  --gold-light:#e4c393;

  --border:rgba(74,55,45,.14);
  --border-strong:rgba(74,55,45,.24);
  --shadow:rgba(49,36,28,.12);
  --error:#a44439;

  /* Icon layers: CSS owns all visible colors */
  --icon-base:#f7eee6;
  --icon-symbol:#684535;
  --icon-accent:#c99d61;
  --icon-light:#f0d4ad;
  --icon-shadow:rgba(49,32,23,.30);
  --service-icon-filter:invert(34%) sepia(18%) saturate(1260%) hue-rotate(337deg) brightness(90%) contrast(86%);

  --radius-sm:12px;
  --radius-md:18px;
  --radius-lg:28px;
}

*,
*::before,
*::after{box-sizing:border-box}

html,
body{
  width:100%;
  height:100%;
  margin:0;
  overflow:hidden;
}

body{
  color:var(--text);
  background:var(--bg);
  font-family:Inter,"Segoe UI",Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
}

button,
input,
select,
textarea{font:inherit}

button{border:0}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
[hidden]{display:none!important}

/* All buttons: centered always */
button,
.btn,
.nav-link,
.cta-small,
.footer-cta,
.service-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
}

/* =========================================================
   TOP NAVIGATION — always visible
   ========================================================= */

.site-header{
  position:fixed;
  z-index:1000;
  inset:0 0 auto 0;
  min-height:74px;
  padding:10px max(20px,calc((100vw - 1700px)/2));
  display:grid;
  grid-template-columns:minmax(100px,150px) 1fr auto;
  align-items:center;
  gap:clamp(10px,2vw,30px);
  border-bottom:1px solid var(--border);
  background:rgba(250,247,243,.96);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}

.brand{
  justify-self:start;
  cursor:pointer;
  padding:0;
  background:transparent;
}

.brand img{
  width:clamp(92px,8vw,130px);
  max-height:56px;
  object-fit:contain;
}

.main-nav{
  min-width:0;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:clamp(8px,2vw,30px);
}

.nav-link{
  position:relative;
  min-height:42px;
  padding:0 2px;
  cursor:pointer;
  color:var(--text);
  background:transparent;
  font-size:clamp(.74rem,.85vw,.94rem);
  font-weight:650;
  white-space:nowrap;
}

.nav-link::after{
  content:"";
  position:absolute;
  left:50%;
  right:50%;
  bottom:2px;
  height:1.5px;
  background:var(--bronze);
  transition:left .22s ease,right .22s ease;
}

.nav-link:hover::after,
.nav-link.is-active::after{left:0;right:0}

.header-tools{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:clamp(8px,1.2vw,18px);
}

.language{
  display:flex;
  align-items:center;
  gap:7px;
  color:var(--text-muted);
}

.language button{
  cursor:pointer;
  background:transparent;
  color:var(--text-muted);
  font-size:.82rem;
  font-weight:750;
  padding:4px;
}

.language button.is-active{color:var(--bronze-dark)}

.cta-small{
  min-height:44px;
  border-radius:999px;
  cursor:pointer;
  padding:0 clamp(14px,1.4vw,22px);
  color:var(--on-dark);
  background:linear-gradient(135deg,var(--bronze),var(--bronze-dark));
  box-shadow:0 10px 24px rgba(104,69,53,.16);
  font-size:clamp(.72rem,.8vw,.86rem);
  font-weight:750;
  white-space:nowrap;
}

/* =========================================================
   BOTTOM BAR — always visible
   ========================================================= */

.footer{
  position:fixed;
  z-index:1000;
  inset:auto 0 0 0;
  min-height:76px;
  padding:9px max(20px,calc((100vw - 1700px)/2));
  display:grid;
  grid-template-columns:88px repeat(3,minmax(110px,.8fr)) minmax(210px,1.35fr) minmax(205px,1.15fr);
  align-items:center;
  gap:clamp(8px,1.35vw,22px);
  color:var(--on-dark);
  background:linear-gradient(115deg,var(--dark-soft),var(--dark));
  border-top:1px solid rgba(255,255,255,.08);
}

.footer > img{
  width:80px;
  padding:6px 7px;
  border-radius:10px;
  background:var(--bg);
}

.footer > a{
  color:var(--on-dark);
  font-size:clamp(.68rem,.78vw,.85rem);
  text-align:center;
  white-space:nowrap;
}

.footer-person{
  min-width:0;
  display:grid;
  gap:2px;
  padding-left:16px;
  border-left:1px solid rgba(255,255,255,.18);
  color:var(--on-dark);
  font-size:.72rem;
}

.footer-person strong{
  color:var(--on-dark);
  font-size:.86rem;
}

.footer-person span,
.footer-person a{
  color:var(--on-dark-muted);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.footer-cta{
  min-height:54px;
  border-radius:999px;
  cursor:pointer;
  padding:0 18px;
  color:var(--on-dark);
  background:linear-gradient(135deg,var(--bronze),var(--bronze-dark));
  font-size:clamp(.68rem,.76vw,.82rem);
  font-weight:800;
  line-height:1.15;
}

/* =========================================================
   CENTRAL VIEWPORT — between the two bars
   ========================================================= */

#viewport{
  position:fixed;
  top:var(--top-bar-h);
  bottom:var(--bottom-bar-h);
  left:0;
  right:0;
  overflow:auto;
  overscroll-behavior:contain;
  background:var(--bg);
}

.page{
  min-height:100%;
  animation:pageIn .36s ease both;
}

@keyframes pageIn{
  from{opacity:0;transform:translateY(5px)}
  to{opacity:1;transform:none}
}

/* =========================================================
   HOME
   ========================================================= */

.hero{
  min-height:clamp(330px,56vh,620px);
  display:grid;
  grid-template-columns:minmax(410px,.78fr) minmax(520px,1.22fr);
  background:var(--paper);
}

.hero-copy{
  min-width:0;
  padding:
    clamp(28px,4vh,58px)
    clamp(26px,4vw,66px)
    clamp(24px,3.6vh,48px)
    max(26px,calc((100vw - 1700px)/2));
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:10px;
  color:var(--bronze);
  font-size:clamp(.62rem,.7vw,.74rem);
  font-weight:800;
  letter-spacing:.16em;
}

.eyebrow::before{
  content:"";
  width:34px;
  height:1px;
  background:var(--gold);
}

.hero h1,
.content-shell h2,
.contact-copy h2{
  margin:clamp(12px,1.8vh,20px) 0;
  color:var(--text);
  font-family:Georgia,"Times New Roman",serif;
  font-weight:400;
  letter-spacing:-.04em;
  line-height:.97;
}

.hero h1{
  max-width:760px;
  font-size:clamp(2.8rem,4.6vw,6.1rem);
}

.hero-copy > p{
  max-width:650px;
  margin:0;
  color:var(--text-muted);
  font-size:clamp(.88rem,1vw,1.06rem);
  line-height:1.65;
}

.hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:clamp(18px,2.5vh,27px);
}

.btn{
  min-height:48px;
  border-radius:999px;
  cursor:pointer;
  padding:0 24px;
  font-size:.87rem;
  font-weight:750;
}

.btn-primary{
  color:var(--on-dark);
  background:linear-gradient(135deg,var(--bronze),var(--bronze-dark));
}

.btn-secondary{
  color:var(--text);
  background:var(--paper);
  border:1px solid var(--border-strong);
}

.slideshow{
  position:relative;
  min-height:330px;
  overflow:hidden;
  background:var(--bg-soft);
}

.slide{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:0;
  transform:scale(1.025);
  transition:opacity .9s ease,transform 5.8s ease;
}

.slide.is-active{
  opacity:1;
  transform:scale(1);
}

.slideshow::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(248,244,239,.10),transparent 18%),
    linear-gradient(180deg,transparent 72%,rgba(27,25,24,.18));
}

.slide-dots{
  position:absolute;
  z-index:4;
  right:20px;
  bottom:18px;
  display:flex;
  gap:7px;
  padding:7px 10px;
  border-radius:999px;
  background:rgba(27,25,24,.35);
  backdrop-filter:blur(10px);
}

.dot{
  width:7px;
  height:7px;
  padding:0;
  border-radius:50%;
  cursor:pointer;
  background:rgba(255,255,255,.55);
}

.dot.is-active{
  width:22px;
  border-radius:999px;
  background:#fff;
}

/* =========================================================
   LARGE INTERACTIVE MULTI-LAYER ICONS
   ========================================================= */

.icon-showcase{
  padding:
    clamp(18px,2.6vh,30px)
    max(22px,calc((100vw - 1580px)/2))
    clamp(18px,2.6vh,30px);
  background:linear-gradient(180deg,var(--bg),var(--bg-soft));
  border-top:1px solid var(--border);
}

.section-heading{
  display:none;
}

.service-icon-grid{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:clamp(8px,1.15vw,18px);
  align-items:stretch;
}

.service-icon{
  min-width:0;
  min-height:clamp(150px,19vh,220px);
  cursor:pointer;
  padding:7px 8px 10px;
  flex-direction:column;
  gap:5px;
  color:var(--text);
  background:transparent;
  border-radius:var(--radius-md);
  transition:background .2s ease,transform .2s ease;
}

.service-icon:hover{
  background:rgba(255,255,255,.46);
  transform:translateY(-2px);
}

.icon-stack{
  --tilt-x:0deg;
  --tilt-y:0deg;
  position:relative;
  width:clamp(120px,10vw,190px);
  aspect-ratio:1;
  flex:0 0 auto;
  transform:
    perspective(700px)
    rotateX(var(--tilt-x))
    rotateY(var(--tilt-y));
  transition:transform .15s ease;
}

.icon-layer{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  pointer-events:none;
  background:currentColor;

  -webkit-mask-image:var(--mask);
  mask-image:var(--mask);
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
  -webkit-mask-position:center;
  mask-position:center;
  -webkit-mask-size:contain;
  mask-size:contain;

  transition:
    transform .3s cubic-bezier(.2,.8,.2,1),
    opacity .3s ease,
    filter .3s ease;
}

.layer-shadow{
  z-index:1;
  color:var(--icon-shadow);
  opacity:.72;
  transform:translateY(10px) scale(.94);
}

.layer-base{
  z-index:2;
  color:var(--icon-base);
  filter:drop-shadow(0 8px 18px rgba(55,38,28,.10));
}

.layer-symbol{
  z-index:3;
  color:var(--icon-symbol);
}

.layer-accent{
  z-index:4;
  color:var(--icon-accent);
  opacity:.82;
}

.layer-light{
  z-index:5;
  color:var(--icon-light);
  opacity:.28;
}

.service-icon:hover .layer-symbol{
  transform:translateY(-9px) scale(1.04);
}

.service-icon:hover .layer-accent{
  transform:rotate(8deg) scale(1.025);
}

.service-icon:hover .layer-light{
  opacity:.8;
  filter:brightness(1.12);
}

.service-icon:hover .layer-shadow{
  transform:translateY(20px) scale(.87);
  opacity:.46;
}

.service-icon-label{
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  min-height:3.15em;
  width:100%;
  max-width:215px;
  margin-inline:auto;
  color:var(--text);
  font-size:clamp(.75rem,.84vw,.92rem);
  font-weight:650;
  line-height:1.3;
}

/* =========================================================
   INTERNAL PAGES
   ========================================================= */

.content-shell{
  width:min(calc(100% - 64px),1400px);
  margin:auto;
  padding:clamp(36px,5vh,66px) 0;
}

.content-shell h2,
.contact-copy h2{
  max-width:920px;
  font-size:clamp(2.45rem,4vw,4.6rem);
}

.service-list{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:14px;
  margin-top:32px;
}

.service-list article,
.package-grid article,
.value-grid div{
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  background:rgba(255,255,255,.62);
  padding:clamp(20px,2.2vw,30px);
}

.service-list h3,
.package-grid h3{
  margin:0 0 10px;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(1.45rem,2vw,2rem);
  font-weight:400;
}

.service-list p,
.package-grid p,
.about-simple > p{
  margin:0;
  color:var(--text-muted);
  line-height:1.7;
}

.package-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  margin-top:32px;
}

.package-grid article{
  min-height:290px;
}

.package-grid article.featured{
  color:var(--on-dark);
  background:linear-gradient(150deg,var(--dark-soft),var(--dark));
  border-color:rgba(255,255,255,.08);
}

.package-grid article.featured h3{
  color:var(--on-dark);
}

.package-grid article.featured p{
  color:var(--on-dark-muted);
}

.about-simple{
  max-width:1000px;
}

.value-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
  margin-top:28px;
}

.value-grid div{
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  min-height:100px;
  color:var(--text);
  font-weight:750;
}

.contact-layout{
  width:min(calc(100% - 64px),1300px);
  margin:auto;
  padding:clamp(36px,5vh,66px) 0;
  display:grid;
  grid-template-columns:.78fr 1.22fr;
  gap:clamp(34px,5vw,70px);
}

.contact-copy{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:8px;
}

.contact-copy a{
  color:var(--bronze);
  font-weight:700;
}

.contact-form{
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  background:var(--paper);
  padding:clamp(22px,2.8vw,34px);
  box-shadow:0 22px 60px var(--shadow);
}

.contact-form label{
  display:grid;
  gap:7px;
  margin-bottom:14px;
  color:var(--text);
  font-size:.84rem;
  font-weight:700;
}

.contact-form .row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}

.contact-form input,
.contact-form select,
.contact-form textarea{
  width:100%;
  min-height:47px;
  border:1px solid #dccfc5;
  border-radius:var(--radius-sm);
  outline:0;
  background:var(--paper);
  color:var(--text);
  padding:11px 13px;
}

.contact-form textarea{
  min-height:126px;
  resize:vertical;
}

.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus{
  border-color:var(--bronze-light);
  box-shadow:0 0 0 3px rgba(185,143,116,.10);
}

.contact-form .invalid{
  border-color:var(--error)!important;
}

.contact-form small{
  min-height:15px;
  color:var(--error);
  font-size:.74rem;
}

.group-error{
  display:block;
  margin:-6px 0 12px;
}

.form-status{
  min-height:19px;
  margin-top:12px;
  color:var(--bronze);
  font-size:.84rem;
}

/* =========================================================
   BREAKPOINTS
   ========================================================= */

@media(max-width:1300px){
  .footer{
    grid-template-columns:76px repeat(3,minmax(102px,.8fr)) minmax(195px,1.15fr);
  }

  .footer-person{display:none}

  .hero{
    grid-template-columns:minmax(365px,.86fr) minmax(470px,1.14fr);
  }

  .icon-stack{
    width:clamp(112px,10vw,165px);
  }
}

@media(max-width:1040px){
  .site-header{
    grid-template-columns:120px 1fr;
  }

  .header-tools{display:none}

  .main-nav{
    justify-content:flex-end;
    gap:10px;
  }

  .footer{
    grid-template-columns:66px repeat(3,1fr) minmax(185px,1.15fr);
  }

  .footer > img{width:64px}

  .hero{
    grid-template-columns:1fr;
  }

  .hero-copy{
    min-height:310px;
    padding:32px 28px;
  }

  .slideshow{
    min-height:360px;
  }

  .service-icon-grid{
    grid-template-columns:repeat(3,1fr);
  }

  .service-icon{
    min-height:182px;
  }

  .icon-stack{
    width:clamp(126px,18vw,180px);
  }

  .package-grid{
    grid-template-columns:1fr;
  }

  .contact-layout{
    grid-template-columns:1fr;
  }
}

@media(max-width:760px){
  .site-header{
    padding:8px 12px;
    grid-template-columns:86px 1fr;
    gap:8px;
  }

  .brand img{width:78px}

  .main-nav{
    gap:2px;
    overflow-x:auto;
    justify-content:flex-start;
    scrollbar-width:none;
  }

  .main-nav::-webkit-scrollbar{display:none}

  .nav-link{
    flex:0 0 auto;
    min-height:37px;
    padding:0 5px;
    font-size:.67rem;
  }

  .footer{
    padding:8px 12px;
    grid-template-columns:repeat(4,1fr);
    gap:4px;
  }

  .footer > img{display:none}

  .footer > a{
    font-size:.64rem;
    white-space:normal;
    line-height:1.2;
  }

  .footer-cta{
    min-height:45px;
    padding:0 8px;
    font-size:.62rem;
  }

  .hero-copy{
    min-height:300px;
    padding:28px 20px;
  }

  .hero h1{
    font-size:clamp(2.6rem,11vw,4rem);
  }

  .hero-actions{
    flex-direction:column;
  }

  .slideshow{
    min-height:300px;
  }

  .service-icon-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .service-icon{
    min-height:165px;
  }

  .icon-stack{
    width:clamp(112px,30vw,158px);
  }

  .service-icon-label{
    font-size:.76rem;
  }

  .content-shell,
  .contact-layout{
    width:min(calc(100% - 28px),700px);
  }

  .service-list{
    grid-template-columns:1fr;
  }

  .value-grid{
    grid-template-columns:1fr 1fr;
  }

  .contact-form .row{
    grid-template-columns:1fr;
    gap:0;
  }
}

@media(max-width:470px){
  .footer{
    grid-template-columns:repeat(3,1fr);
  }
}

@media(prefers-reduced-motion:reduce){
  *,
  *::before,
  *::after{
    scroll-behavior:auto!important;
    animation-duration:.01ms!important;
    transition-duration:.01ms!important;
  }
}


/* =========================================================
   ACCUEIL SANS SCROLLBAR + ICÔNES LOCALES VISIBLES
   ========================================================= */
#viewport{overflow:hidden}
.page:not(#accueil){height:100%;min-height:0;overflow:auto;scrollbar-width:none;-ms-overflow-style:none}
.page:not(#accueil)::-webkit-scrollbar{width:0;height:0}
#accueil{height:100%;min-height:0;overflow:hidden;display:grid;grid-template-rows:minmax(0,1fr) clamp(142px,23vh,202px)}
#accueil>.hero,#accueil>.icon-showcase{min-height:0;height:100%}
.hero{position:relative;grid-template-columns:minmax(360px,.78fr) minmax(480px,1.22fr)}
.hero-copy{position:relative;z-index:6;min-height:0;padding-top:clamp(18px,3.2vh,46px);padding-bottom:clamp(16px,2.8vh,38px)}
.hero h1{font-size:clamp(2.1rem,min(4.45vw,6.3vh),5.15rem);margin-top:clamp(8px,1.35vh,16px);margin-bottom:clamp(8px,1.35vh,16px)}
.hero-copy>p{font-size:clamp(.80rem,min(1vw,1.65vh),1.02rem);line-height:1.48}
.hero-actions{margin-top:clamp(10px,1.8vh,22px)}
.hero-copy::after{content:"";position:absolute;z-index:7;top:0;bottom:0;right:clamp(-175px,-9.5vw,-95px);width:clamp(110px,12vw,195px);pointer-events:none;background:linear-gradient(90deg,var(--paper) 0%,rgba(255,253,249,.94) 18%,rgba(255,253,249,.64) 48%,rgba(255,253,249,.24) 76%,rgba(255,253,249,0) 100%)}
.slideshow{z-index:2;min-height:0;height:100%}
.slideshow-loading{position:absolute;inset:0;z-index:2;display:flex;align-items:center;justify-content:center;text-align:center;color:var(--text-muted);background:var(--bg-soft);font-size:.9rem}
.slideshow-loading[hidden]{display:none!important}
.dynamic-slide{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.025);transition:opacity .9s ease,transform 5.8s ease}
.dynamic-slide.is-active{opacity:1;transform:scale(1)}
.slide-ui{position:absolute;z-index:8;right:16px;bottom:14px;max-width:min(78%,760px);display:flex;align-items:center;justify-content:flex-end;gap:8px}
.slide-dots{position:static;max-width:100%;display:flex;flex:0 1 auto;gap:6px;padding:7px 9px;overflow-x:auto;overflow-y:hidden;border-radius:999px;background:rgba(27,25,24,.35);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);scrollbar-width:none;-ms-overflow-style:none}
.slide-dots::-webkit-scrollbar{display:none}
.dynamic-slide-dot{flex:0 0 auto;width:7px;height:7px;padding:0;border-radius:50%;cursor:pointer;background:rgba(255,255,255,.58)}
.dynamic-slide-dot.is-active{width:22px;border-radius:999px;background:#fff}
.slide-counter{flex:0 0 auto;min-width:48px;padding:7px 9px;border-radius:999px;color:#fff;background:rgba(27,25,24,.48);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);font-size:.70rem;font-weight:750;text-align:center}
.icon-showcase{height:100%;min-height:0;padding:clamp(6px,1.1vh,12px) max(18px,calc((100vw - 1580px)/2));display:flex;align-items:stretch;border-top:1px solid var(--border);background:linear-gradient(180deg,var(--bg),var(--bg-soft))}
.icon-showcase .section-heading{display:none}
.service-icon-grid{width:100%;height:100%;min-height:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:clamp(5px,.8vw,13px);align-items:stretch}
.service-icon{min-width:0;min-height:0;height:100%;overflow:hidden;cursor:pointer;padding:4px 6px 7px;flex-direction:column;gap:2px;color:var(--text);background:transparent;border-radius:var(--radius-md)}
.service-icon-image{display:block;flex:1 1 auto;min-height:0;width:auto;height:auto;max-width:min(78%,150px);max-height:calc(100% - 3em);margin:auto auto 1px;object-fit:contain;filter:var(--service-icon-filter);transform:translateZ(0);transition:transform .24s ease,filter .24s ease,opacity .24s ease}
.service-icon:hover .service-icon-image{transform:translateY(-4px) scale(1.045);filter:var(--service-icon-filter) brightness(1.09)}
.service-icon-label{flex:0 0 auto;min-height:2.65em;width:100%;max-width:215px;margin:0 auto;padding:0 4px;display:flex;align-items:center;justify-content:center;text-align:center;color:var(--text);font-size:clamp(.68rem,min(.84vw,1.48vh),.92rem);font-weight:700;line-height:1.2}
button,.btn,.nav-link,.cta-small,.footer-cta,.service-icon{align-items:center;justify-content:center;text-align:center}
.footer-site{color:var(--on-dark);font-size:clamp(.68rem,.78vw,.85rem);text-align:center;white-space:nowrap}
@media (min-width:1041px) and (max-height:760px){#accueil{grid-template-rows:minmax(0,1fr) 132px}.hero-copy{padding-top:14px;padding-bottom:12px}.hero h1{font-size:clamp(1.9rem,5.45vh,3.75rem);margin-block:7px}.hero-copy>p{line-height:1.38}.hero-actions{margin-top:8px}.btn{min-height:42px}.service-icon-image{max-height:74px;max-width:110px}.service-icon-label{font-size:.68rem}}
@media(max-width:1040px){#accueil{grid-template-rows:minmax(0,1fr) clamp(205px,36vh,270px)}.hero{grid-template-columns:1fr 1fr}.hero-copy::after{display:none}.hero-copy{min-height:0;padding:18px 20px}.slideshow{min-height:0;height:100%}.service-icon-grid{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr))}.service-icon-image{max-width:92px;max-height:68px}.service-icon-label{font-size:.70rem;min-height:2.45em}}
@media(max-width:760px){#accueil{grid-template-rows:minmax(0,1fr) clamp(210px,40vh,285px)}.hero{grid-template-columns:1fr}.slideshow{position:absolute;inset:0;opacity:.26}.hero-copy{z-index:10;width:100%;background:linear-gradient(90deg,rgba(255,253,249,.97),rgba(255,253,249,.82))}.hero h1{font-size:clamp(2rem,9vw,3rem)}.hero-copy>p{font-size:.80rem}.service-icon-grid{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr))}.service-icon{padding:2px 3px 4px}.service-icon-image{max-width:74px;max-height:58px}.service-icon-label{font-size:.62rem;line-height:1.1;min-height:2.6em}.slide-ui{right:7px;bottom:7px;max-width:62%}}
@media(max-width:470px){#accueil{grid-template-rows:minmax(0,1fr) clamp(225px,44vh,300px)}.service-icon-image{max-width:64px;max-height:50px}.service-icon-label{font-size:.58rem}}


/* =========================================================
   RÉVISION : forfaits, footer et icônes
   ========================================================= */

.package-grid article,
.package-grid article.featured{
  color:var(--text);
  background:rgba(255,255,255,.76);
  border-color:var(--border);
}

.package-grid article.featured h3{
  color:var(--text);
}

.package-grid article.featured p{
  color:var(--text-muted);
}

.footer{
  grid-template-columns:
    82px
    minmax(150px,.82fr)
    minmax(190px,1fr)
    minmax(210px,1.35fr)
    minmax(205px,1.15fr);
}

.footer-contact-link{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:9px;
  min-width:0;
  color:var(--on-dark)!important;
  white-space:nowrap;
}

.footer-contact-icon{
  width:21px!important;
  height:21px!important;
  flex:0 0 21px;
  padding:0!important;
  border-radius:0!important;
  background:transparent!important;
  object-fit:contain;
}

.footer-contact-link span{
  overflow:hidden;
  text-overflow:ellipsis;
}

.service-icon-image{
  image-rendering:auto;
  filter:var(--service-icon-filter);
  opacity:1;
}

#accueil{
  overflow:hidden;
}

@media(max-width:1300px){
  .footer{
    grid-template-columns:
      68px
      minmax(135px,.9fr)
      minmax(175px,1fr)
      minmax(190px,1.15fr);
  }
  .footer-person{display:none}
}

@media(max-width:760px){
  .footer{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  .footer-contact-link{
    gap:5px;
    font-size:.62rem!important;
  }

  .footer-contact-icon{
    width:16px!important;
    height:16px!important;
    flex-basis:16px;
  }
}


/* =========================================================
   SLIDESHOW ULTRA-FLUIDE
   - aucun scrollIntoView du viewport
   - aucun zoom / déplacement des images
   - fondu croisé stable
   ========================================================= */

.dynamic-slide{
  opacity:0;
  transform:none!important;
  will-change:opacity;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
  transition:opacity 1.55s cubic-bezier(.4,0,.2,1)!important;
}

.dynamic-slide.is-active{
  opacity:1;
  transform:none!important;
}

.slideshow{
  transform:translateZ(0);
  contain:paint;
}

.slide-dots{
  scroll-behavior:smooth;
  overscroll-behavior-x:contain;
}

/* Empêche une ancienne animation de zoom d'interférer. */
.slide,
.slide.is-active{
  transform:none!important;
}

/* Icônes : contours nets et taille régulière. */
.service-icon-image{
  image-rendering:auto;
  object-fit:contain;
  max-width:min(76%,150px);
  filter:var(--service-icon-filter);
}


/* =========================================================
   DÉGRADÉ ACCUEIL RENFORCÉ
   Masque la jointure même avec une image de slideshow noire.
   ========================================================= */

/* Étendre le panneau clair au-delà de sa colonne. */
.hero-copy::after{
  right:clamp(-270px,-15vw,-170px)!important;
  width:clamp(200px,18vw,300px)!important;
  background:linear-gradient(
    90deg,
    var(--paper) 0%,
    rgba(255,253,249,1) 20%,
    rgba(255,253,249,.96) 38%,
    rgba(255,253,249,.76) 58%,
    rgba(255,253,249,.42) 76%,
    rgba(255,253,249,0) 100%
  )!important;
}

/* Deuxième fondu directement au-dessus de l'image. */
.slideshow::before{
  content:"";
  position:absolute;
  z-index:6;
  top:0;
  bottom:0;
  left:0;
  width:clamp(220px,42%,430px);
  pointer-events:none;
  background:linear-gradient(
    90deg,
    var(--paper) 0%,
    rgba(255,253,249,.99) 12%,
    rgba(255,253,249,.94) 28%,
    rgba(255,253,249,.78) 46%,
    rgba(255,253,249,.52) 64%,
    rgba(255,253,249,.24) 82%,
    rgba(255,253,249,0) 100%
  );
}

/* Les contrôles restent devant le dégradé. */
.slide-ui{
  z-index:9;
}

/* Téléphone entièrement visible. */
.footer-contact-icon{
  object-fit:contain!important;
  object-position:center!important;
}

/* Tablettes et téléphones utilisent déjà une autre composition. */
@media(max-width:1040px){
  .hero-copy::after,
  .slideshow::before{
    display:none!important;
  }
}