@font-face{font-family:"Bricolage";src:url(fonts/bricolage.woff2) format("woff2");font-weight:200 800;font-display:swap}
:root{
  --forest:oklch(.29 .07 160);--forest-2:oklch(.34 .075 160);--bright:oklch(.86 .17 148);--mint:oklch(.94 .04 150);
  --navy:oklch(.24 .075 262);--blue:oklch(.58 .19 256);--sky:oklch(.8 .1 240);--white:oklch(.99 .004 120);
  --ease:cubic-bezier(.22,1,.36,1);--gutter:clamp(18px,4vw,56px);
}
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;height:100%}
body{background:var(--forest);color:var(--white);font:400 1.0625rem/1.5 "Bricolage","Helvetica Neue",sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img,svg{display:block;max-width:100%}
ul{list-style:none;margin:0;padding:0}
h1,h2,p{margin:0}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;z-index:100;background:var(--white);color:var(--forest);padding:10px 16px;border-radius:6px}
.skip:focus{left:8px}
:focus-visible{outline:3px solid var(--bright);outline-offset:3px}

.top{position:absolute;z-index:5;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding:18px var(--gutter);pointer-events:none}
.top>*{pointer-events:auto}

.brand{display:block;width:clamp(150px,17vw,230px);padding:8px 12px;background:#fff;border-radius:14px;box-shadow:0 14px 34px -14px oklch(.1 .03 260/.6)}
.brand img{width:100%;height:auto}
.top__contact{display:flex;gap:8px}
.btn{display:inline-flex;align-items:center;gap:.55em;min-height:46px;padding:0 1.05em;border-radius:10px;font-weight:600;font-size:.97rem;transition:transform .2s var(--ease),background-color .2s}
.btn svg{width:1.15em;height:1.15em}
.btn:hover{transform:translateY(-2px)}
.btn--call{background:var(--white);color:var(--forest)}
.btn--wa{background:oklch(.55 .15 150);color:var(--white)}
.top__contact{padding-top:6px}

.doors{display:grid;grid-template-columns:1fr 1fr;min-height:100svh}
.door{position:relative;isolation:isolate;display:flex;align-items:flex-end;min-height:100svh;overflow:hidden;padding:clamp(6rem,10vw,8rem) var(--gutter) clamp(2.6rem,6vw,4.6rem)}
.door__body{max-width:34rem;min-width:0}
.door__tag{font-size:.8rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;margin-bottom:1rem}
.door h2{font-size:clamp(3rem,7.4vw,7.2rem);line-height:.95;letter-spacing:-.04em;font-weight:700}
.door__text{margin:1.2rem 0 1.3rem;font-size:1.1rem;line-height:1.45;max-width:30em;opacity:.9}
.door__chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:1.8rem}
.door__chips li{padding:.34em .75em;border:1px solid currentColor;border-radius:99px;font-size:.88rem;font-weight:500;opacity:.85}
.door__go{display:inline-flex;align-items:center;gap:.6em;min-height:56px;padding:0 1.5em;border-radius:12px;font-weight:700;font-size:1.05rem;transition:transform .3s var(--ease),gap .3s var(--ease)}
.door__go svg{width:1.3em;height:1.3em;transition:transform .3s var(--ease)}
.door:hover .door__go svg,.door:focus-visible .door__go svg{transform:translateX(6px)}

/* Dératisation : photo, voile sombre neutre */
.door--derat{background:oklch(.16 .01 250);color:var(--white)}
.door--derat::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,oklch(.14 .01 250/.55) 0%,oklch(.14 .01 250/.72) 45%,oklch(.12 .01 250/.94) 100%)}
.door--derat .door__go{background:var(--white);color:oklch(.18 .02 250)}
.door--derat .door__tag{color:oklch(.86 .05 150)}

/* Nettoyage : couleurs du logo, étincelles */
.door--menage{background:var(--navy);color:var(--white)}
.door--menage::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,oklch(.24 .075 262/.55) 0%,oklch(.24 .075 262/.75) 45%,oklch(.2 .07 262/.95) 100%)}
.door__photo{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;}
.door--menage::after{content:"";position:absolute;left:-10%;right:-10%;bottom:-70px;height:120px;border-top:5px solid var(--blue);border-radius:50% 50% 0 0;pointer-events:none}
.door--menage .door__tag{color:var(--sky)}
.door--menage h2{font-family:"Archivo","Arial Black",sans-serif;font-weight:800;text-transform:uppercase;letter-spacing:-.01em;font-size:clamp(2.6rem,6vw,6rem)}
.door--menage h2::first-letter{color:inherit}
.door--menage .door__go{background:var(--blue);color:var(--white)}
.door__spark{position:absolute;z-index:-1;color:var(--sky)}
.door__spark svg{width:100%;height:100%}
.door__spark--a{top:22%;right:12%;width:56px;height:56px;animation:twinkle 3.2s ease-in-out infinite}
.door__spark--b{top:31%;right:21%;width:30px;height:30px;color:var(--blue);animation:twinkle 3.2s 1.1s ease-in-out infinite}
@keyframes twinkle{0%,100%{transform:scale(1) rotate(0);opacity:1}50%{transform:scale(.7) rotate(20deg);opacity:.6}}

@media (max-width:760px){
  .doors{grid-template-columns:1fr}
  .door{min-height:50svh;padding:5.2rem var(--gutter) 2.4rem}
  .door--menage{padding-top:2.6rem}
  .door h2{font-size:clamp(2.8rem,15vw,4.4rem)}
  .door__text{display:none}
  .door__chips{margin-bottom:1.2rem}
  .door__spark--a{top:12%;width:40px;height:40px}.door__spark--b{top:20%}
  .brand{width:130px;padding:6px 8px;border-radius:10px}
  .top__contact span{display:none}
  .btn{width:46px;padding:0;justify-content:center}
  .brand{font-size:1.35rem}
}
@media (orientation:landscape) and (max-height:520px){
  .doors{grid-template-columns:1fr 1fr}
  .door{min-height:100svh;padding-block:4rem 1.2rem}
  .door__text,.door__chips{display:none}
  .door h2{font-size:3rem}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}}
/* Logo centré à l'entrée, à cheval sur les deux univers */
.brand{position:absolute;left:50%;top:18px;transform:translateX(-50%);width:clamp(170px,19vw,270px)}
.top{justify-content:flex-end}
@media (max-width:760px){.brand{left:var(--gutter);transform:none;width:130px;top:14px}}

/* Logo horizontal SVG en version blanche, sans carte */
.brand{padding:0;background:none;box-shadow:none;border-radius:0;width:clamp(230px,26vw,360px);top:22px;filter:drop-shadow(0 2px 12px oklch(.1 .02 260/.55))}
.brand img{display:block;width:100%;height:auto}
@media (max-width:760px){
  .brand{width:min(230px,58vw);top:16px}
  .door--menage h2{font-size:clamp(2.1rem,10.4vw,3.4rem)}
  .door h2{font-size:clamp(2.4rem,12vw,3.8rem)}
}

/* Logo officiel en haut de l'entrée ; les deux côtés ne bougent pas */
.brand{width:clamp(250px,30vw,430px);filter:drop-shadow(0 2px 14px oklch(.1 .02 260/.6))}
.door__photo{transform:none}
@media (min-width:761px) and (max-width:1000px){.brand{left:var(--gutter);transform:none}}
@media (max-width:760px){.brand{width:min(250px,62vw)}}

/* Bandeau blanc en haut de l'entrée : logo officiel en couleurs d'origine */
.top{position:relative;z-index:5;justify-content:space-between;align-items:center;height:84px;padding:0 var(--gutter);background:#fff;border-bottom:1px solid oklch(.9 .02 255);pointer-events:auto}
.brand{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:clamp(230px,24vw,330px);filter:none}
.top__contact{margin-left:auto;padding-top:0}
.btn--call{background:#13254f;color:#fff}
.doors{min-height:calc(100svh - 84px)}
.door{min-height:calc(100svh - 84px);padding-top:clamp(3rem,6vw,5rem)}
@media (min-width:761px) and (max-width:1000px){.brand{left:var(--gutter);transform:translateY(-50%)}}
@media (max-width:760px){
  .top{height:68px}
  .brand{left:var(--gutter);transform:translateY(-50%);width:min(210px,56vw)}
  .doors{min-height:auto}
  .door{min-height:calc(50svh - 34px);padding-top:2.4rem}
  .door--menage{padding-top:2.4rem}
}
