@font-face{font-family:Inter;src:url("polices/inter.woff2") format("woff2");font-display:swap;font-weight:100 900}
@font-face{font-family:Montserrat;src:url("polices/montserrat.woff2") format("woff2");font-display:swap;font-weight:100 900}
:root{
  color-scheme:light;
  --ink:#161816;--muted:#515752;--line:#d7dad4;--paper:#fff;--wash:#f4f5f1;
  --display:Montserrat,"Helvetica Neue",Arial,sans-serif;--body:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --gutter:clamp(20px,5.8vw,94px);--section:clamp(62px,7.2vw,112px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:85px}
body{margin:0;color:var(--ink);background:var(--paper);font:400 16px/1.55 var(--body);-webkit-font-smoothing:antialiased}
body.plomberie{--accent:#965a3b;--wash:#f5f2ed;--deep:#30251d}
body.couverture{--accent:#49616b;--wash:#f0f3f3;--deep:#23343b}
body.paysage{--accent:#5e7051;--wash:#f0f2e9;--deep:#273424}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit;color:inherit}
button,a,input,select,textarea,summary{-webkit-tap-highlight-color:transparent}
button{cursor:pointer}
button{border:0;background:transparent}
img{display:block;max-width:100%}
h1,h2,h3,p,dl,dd,figure,ol,fieldset{margin:0}
h1,h2,h3{font-family:var(--display);text-wrap:balance;overflow-wrap:anywhere}
h2{font-size:clamp(35px,4.3vw,68px);line-height:1.03;font-weight:610;letter-spacing:-.067em}
h3{font-weight:640;letter-spacing:-.044em}
p,li,dd{overflow-wrap:break-word}
[hidden]{display:none!important}
:focus-visible{outline:3px solid #147caa;outline-offset:4px}
.skip,.sr-only{position:absolute;width:1px;height:1px;padding:0;clip-path:inset(50%);white-space:nowrap;overflow:hidden}
.skip:focus{width:auto;height:auto;z-index:99;clip-path:none;top:12px;left:12px;padding:10px 18px;background:white;color:black}
.wrap,.nav-inner,.footer-inner,.hero-inner,.hub-wrap{width:min(100%,1496px);margin-inline:auto;padding-inline:var(--gutter)}
.section{padding-block:var(--section)}
.topbar{background:rgba(255,255,255,.97);position:sticky;top:0;z-index:20;border-bottom:1px solid #e6e7e3}
.nav-inner{height:74px;display:flex;align-items:center;justify-content:space-between;gap:30px}
.brand,.hub-brand{display:inline-flex;align-items:center;gap:12px;font:650 clamp(19px,1.6vw,25px)/1.05 var(--display);letter-spacing:-.065em;min-width:0}
.brand>span:last-child{overflow-wrap:anywhere}
.marque{width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;gap:3px;flex:none;overflow:hidden;color:var(--deep)}
.marque i{display:block;width:5px;height:27px;transform:skew(-21deg);background:currentColor}
.plomberie .marque{gap:0;position:relative}
.plomberie .marque i{position:absolute;left:1px;bottom:2px;background:none;transform:none;width:30px;height:30px;border:3px solid currentColor;border-top:none;border-right:none;border-radius:0 0 0 11px}
.plomberie .marque i:nth-child(2){width:23px;height:23px;left:8px;bottom:9px}
.plomberie .marque i:nth-child(3){width:16px;height:16px;left:15px;bottom:16px}
.couverture .marque i:nth-child(2){height:19px}.couverture .marque i:last-child{height:11px}
.paysage .marque{gap:2px;align-items:flex-end;padding:2px 3px}
.paysage .marque i{width:7px;border-radius:100% 0 60% 0;transform:rotate(13deg)}
.paysage .marque i:first-child{height:16px}.paysage .marque i:nth-child(2){height:26px}.paysage .marque i:last-child{height:19px}
.client-logo{width:auto;max-width:84px;height:33px;object-fit:contain}
.desktop-nav,.nav-actions,.inline-actions,.recap-actions,.hero-actions,.tab-list{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.desktop-nav{gap:32px;margin-left:auto;margin-right:20px}
.desktop-nav a,.mobile-nav a{font-weight:530;font-size:14px}
.desktop-nav a:hover,.mobile-nav a:hover,.footer-links a:hover{text-decoration:underline;text-underline-offset:4px}
.btn{display:inline-flex;justify-content:center;align-items:center;gap:19px;min-height:47px;max-width:100%;padding:12px 22px;border:1px solid transparent;border-radius:40px;font:630 14px/1.35 var(--body);text-align:center;transition:transform .18s,background .18s,color .18s;overflow-wrap:anywhere}
.btn-line:hover{background:var(--wash);border-color:#72796f}
.arrow{display:inline-block;font:500 19px/1 var(--body);flex:none;transition:transform .18s}
.btn:hover .arrow,.text-link:hover .arrow,.contact-direct:hover .arrow{transform:translate(2px,-2px)}
.btn-dark{background:var(--ink);color:white}.btn-dark:hover{background:#323630}
.btn-white{background:white;color:#171b16}.btn-white:hover{background:#f1f2ed}
.btn-line{border-color:#a5aaa2;background:white;color:var(--ink)}
.btn-glass{border-color:rgba(255,255,255,.7);background:rgba(10,15,12,.35);color:white;backdrop-filter:blur(5px)}
.btn-glass:hover{background:rgba(10,15,12,.64)}
.btn-nav{min-height:39px;padding:8px 17px;gap:13px;font-size:13px}
.menu-toggle{display:none;width:42px;height:42px;border:1px solid var(--line);border-radius:50%;padding:0}
.menu-toggle span{display:block;width:15px;height:1.5px;background:var(--ink);margin:4px auto}
.mobile-nav{border-top:1px solid var(--line);padding:6px var(--gutter) 15px;background:#fff}
.mobile-nav a{display:block;padding:10px 0}
.hero{position:relative;isolation:isolate;display:flex;align-items:flex-end;min-height:clamp(510px,72svh,780px);margin:12px 14px 0;border-radius:14px;background:var(--deep);color:white;overflow:hidden}
.hero-photo,.hero-shade,.contact-aside>img,.contact-shade{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-1}
.hero-photo{object-position:50% 50%}
.hero-shade{background:linear-gradient(90deg,rgba(9,12,11,.70),rgba(9,12,11,.33) 55%,rgba(9,12,11,.06)),linear-gradient(0deg,rgba(9,12,11,.25),transparent 55%)}
.hero-inner{padding-top:90px;padding-bottom:clamp(45px,6vw,94px)}
.hero-copy{max-width:790px}
.hero-kicker,.section-tag,.cover-info>p,.figure-meta,.hub-footer{font-size:11px;text-transform:uppercase;font-weight:680;line-height:1.5;letter-spacing:.13em}
.hero-kicker{color:#fff;margin-bottom:21px;letter-spacing:.14em}
.sep{margin-inline:10px;opacity:.65}
.hero h1{font-weight:610;font-size:clamp(64px,7.5vw,125px);letter-spacing:-.078em;line-height:.95;text-shadow:0 1px 6px #0001}
.hero-desc{max-width:530px;font-size:clamp(16px,1.4vw,21px);line-height:1.48;margin-top:23px;text-wrap:pretty}
.hero-actions{margin-top:29px}
.couverture .hero-shade{background:linear-gradient(90deg,rgba(10,19,25,.75),rgba(10,19,25,.32) 53%,rgba(10,19,25,.03)),linear-gradient(0deg,rgba(10,19,25,.16),transparent)}
.paysage .hero-shade{background:linear-gradient(90deg,rgba(12,26,16,.73),rgba(12,26,16,.32) 55%,rgba(12,26,16,.01)),linear-gradient(0deg,rgba(12,26,16,.2),transparent)}
.section-tag{display:flex;gap:9px;align-items:center;color:var(--muted);margin-bottom:20px}
.section-tag i{display:block;width:22px;height:2px;background:var(--accent)}
.lead,.project-intro>p,.intervention p,.service-panel p,.steps p,.use small{color:var(--muted);font-size:16px;line-height:1.65}
.lead{margin-top:16px;text-wrap:pretty}
.project-intro{display:grid;grid-template-columns:1.05fr .82fr;gap:clamp(30px,7vw,132px);align-items:end;margin-bottom:36px}
.project-intro>p{max-width:585px}
.tone{background:var(--wash)}
.service-split{display:grid;grid-template-columns:.95fr 1fr;gap:clamp(40px,7vw,112px);align-items:center}
.service-split.reverse{grid-template-columns:1fr .95fr}
.reverse .service-photo{order:2}
.service-photo{min-height:450px;height:100%;max-height:640px;border-radius:9px;overflow:hidden;background:var(--wash);position:relative}
.service-photo img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover}
.service-copy{min-width:0}
.interventions{margin-top:25px;border-bottom:1px solid var(--line)}
.intervention{border-top:1px solid var(--line)}
.intervention summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:20px;cursor:pointer;padding:18px 0;font:610 clamp(19px,1.55vw,25px)/1.2 var(--display);letter-spacing:-.045em}
.intervention summary::-webkit-details-marker{display:none}
.intervention>div{padding:0 28px 21px 0}
.plus{position:relative;width:22px;height:22px;flex:none}
.plus:before,.plus:after{content:"";position:absolute;left:3px;top:10px;height:1.5px;width:15px;background:var(--ink)}
.plus:after{transform:rotate(90deg)}.intervention[open] .plus:after{transform:rotate(0)}
.text-link,.contact-direct{display:inline-flex;align-items:center;gap:8px;min-height:34px;font:630 14px/1.4 var(--body);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}
.text-link .arrow,.contact-direct .arrow{font-size:16px}
.intervention .text-link,.service-panel .text-link{margin-top:10px}
.intervention .terms{font-size:14px;color:var(--ink);font-weight:620;margin-top:8px}
.steps{list-style:decimal-leading-zero;counter-reset:step;list-style-position:inside;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:35px}
.steps li{display:block;counter-increment:step;border-top:1px solid #b8bcb3;padding-top:18px}
.steps li:before{content:counter(step,decimal-leading-zero);font:600 12px/1 var(--body);color:var(--accent)}
.steps h3{font-size:22px;line-height:1.18;margin:26px 0 9px}
.steps p{font-size:15px}
.project-visual{margin:0}
.compare,.single-view{height:auto;aspect-ratio:2.35;width:100%;position:relative;overflow:hidden;border-radius:8px;background:var(--wash);--split:50%}
.compare img,.single-view img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.compare-before{clip-path:inset(0 calc(100% - var(--split)) 0 0)}
.compare-line{position:absolute;inset:0 auto 0 var(--split);width:2px;background:white;pointer-events:none;z-index:1}
.compare-line>span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:50px;height:50px;display:grid;place-content:center;border-radius:50%;background:#fff;color:#262b24;font:500 24px/1 var(--body);box-shadow:0 2px 15px #0003}
.compare input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0;z-index:2;touch-action:pan-y}
.compare:focus-within{outline:3px solid #147caa;outline-offset:4px}
.compare-labels{position:absolute;display:flex;align-items:end;justify-content:space-between;inset:auto 16px 16px 16px;pointer-events:none}
.compare-labels span{font-size:12px;font-weight:630;line-height:1.2;background:#131813bf;color:white;padding:7px 10px;border-radius:4px}
.figure-meta{color:var(--muted);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;padding:11px 0;letter-spacing:.07em;font-size:10px}
.figure-meta b{font-weight:500;font-size:15px;margin-left:4px}
.project-foot{border-top:1px solid var(--line);padding-top:16px;display:flex;flex-wrap:wrap;gap:15px;align-items:start;justify-content:space-between}
.project-foot p{font:600 18px/1.3 var(--display);letter-spacing:-.035em}
.facts{display:flex;flex-wrap:wrap;gap:22px;margin-top:12px;font-size:14px}
.facts dt{font-size:11px;text-transform:uppercase;color:var(--muted);letter-spacing:.06em}
.tab-list{gap:7px;margin:25px 0 18px}
.pill{display:inline-flex;align-items:center;justify-content:center;min-height:42px;border-radius:24px;border:1px solid #acb5b4;padding:8px 15px;font-size:13px;font-weight:600}
.pill[aria-selected=true]{background:var(--deep);color:white;border-color:var(--deep)}
.service-panel{padding-top:18px;border-top:1px solid var(--line)}
.service-panel h3{font-size:23px;margin-bottom:7px}
.uses{padding:0;margin:20px 0 12px;border:0;border-top:1px solid #c1c7b9}
.use{position:relative;display:grid;grid-template-columns:21px 1fr;gap:13px;align-items:start;border-bottom:1px solid #c1c7b9;padding:14px 0;cursor:pointer}
.use input{position:absolute;z-index:1;left:0;top:16px;width:24px;height:24px;opacity:0;cursor:pointer}
.use-box{width:19px;height:19px;border:1px solid #737e6a;border-radius:5px;margin-top:4px;display:grid;place-items:center}
.use input:checked+.use-box{background:var(--deep);border-color:var(--deep);color:white}
.use input:checked+.use-box:after{content:"✓";font-size:14px;line-height:1}
.use input:focus-visible+.use-box{outline:3px solid #147caa;outline-offset:3px}
.use strong,.use small{display:block}.use strong{font:620 19px/1.4 var(--display);letter-spacing:-.035em}.use small{font-size:14px}
.contact-section{display:grid;grid-template-columns:.86fr 1.14fr;gap:clamp(30px,6vw,94px);align-items:stretch}
.contact-aside{background:var(--deep);min-height:410px;position:relative;isolation:isolate;overflow:hidden;border-radius:9px;display:flex;align-items:flex-end;color:#fff}
.contact-shade{background:linear-gradient(0deg,rgba(13,17,13,.85),rgba(13,17,13,.16) 92%)}
.contact-copy{padding:clamp(25px,4vw,60px);width:100%}.contact-copy h2{font-size:clamp(36px,3.7vw,62px)}
.contact-aside .section-tag{color:#fff}
.contact-aside .section-tag i{background:#fff}
.zone{font-size:14px;margin-top:18px}.zone b{font-weight:600}
.direct-links{display:grid;justify-items:start;margin-top:15px}
.contact-direct{overflow-wrap:anywhere}
.contact-card{padding-block:16px;align-self:center;min-width:0}
.contact-card h3{font-size:clamp(28px,2.6vw,40px);line-height:1.12}
.contact-card .lead{margin-top:9px;font-size:15px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px 16px;margin:23px 0}
.field{display:flex;flex-direction:column;gap:6px;min-width:0}
.field span,.selected-uses span{font-size:13px;font-weight:620}
.field input,.field textarea,.field select{width:100%;min-height:47px;min-width:0;padding:10px 12px;border:1px solid #b9beb8;background:#fff;color:var(--ink);border-radius:7px;font:400 16px/1.45 var(--body)}
textarea{resize:vertical}.field select{padding-right:25px}.wide,.selected-uses{grid-column:1/-1}
.selected-uses{font-size:14px;background:var(--wash);padding:11px 14px;border-radius:6px}.selected-uses span,.selected-uses strong{display:block}.selected-uses strong{font-weight:500;color:var(--muted)}
.form-note,.feedback{font-size:13px;color:var(--muted);margin-top:12px}
.recap:focus{outline:none}.message-preview{white-space:pre-wrap;overflow-wrap:anywhere;font:400 15px/1.65 var(--body);padding:20px;background:var(--wash);border-radius:7px;margin:20px 0}
.back-link,.manual-copy{font:580 14px/1.5 var(--body);text-decoration:underline;text-underline-offset:3px;padding:8px 0}
.footer-inner{border-top:1px solid var(--line);display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding-block:27px}
.footer-inner>p,.footer-links{font-size:12px;color:var(--muted)}
.footer-links{margin-left:auto;display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.hub{background:#f8f8f5;color:#171a17}
.hub-header{border-bottom:1px solid #dbded7}
.hub-header .hub-wrap{display:flex;align-items:center;justify-content:space-between;min-height:70px;gap:18px}
.hub-brand{font-size:23px;gap:10px}.hub-brand img{width:32px;height:32px;object-fit:contain;border-radius:50%}
.hub-header .text-link{text-decoration:none}
.hub-title{padding-block:clamp(44px,5.4vw,88px) clamp(30px,3.6vw,55px);display:grid;grid-template-columns:1.4fr .8fr;gap:30px;align-items:end}
.hub-title h1{font-size:clamp(54px,6.7vw,108px);font-weight:610;line-height:.95;letter-spacing:-.082em}
.hub-title p{font-size:clamp(16px,1.5vw,22px);line-height:1.42;color:#4d524c;max-width:370px;padding-bottom:4px}
.covers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,2vw,30px)}
.cover-card{display:block}.cover-img{position:relative;aspect-ratio:1.22;border-radius:7px;overflow:hidden;background:#ddd}
.cover-img img{height:100%;width:100%;object-fit:cover;transition:transform .5s}.cover-card:hover .cover-img img{transform:scale(1.035)}
.round-arrow{position:absolute;right:14px;bottom:14px;width:36px;height:36px;display:grid;place-items:center;border-radius:50%;background:white;color:#191c19;font:500 22px/1 var(--body)}
.cover-info{padding:16px 1px 4px}.cover-info>p{font-size:10px;color:#51574d}
.cover-info h2{font-size:clamp(22px,2vw,33px);line-height:1.15;margin-top:6px;letter-spacing:-.059em;font-weight:620}
.cover-info>span{display:block;margin-top:8px;color:var(--muted);font-size:14px}
.hub-footer{display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between;margin-top:clamp(45px,6vw,90px);padding-block:22px;border-top:1px solid #dbded7;color:#555a53;font-size:10px;letter-spacing:.08em}
@media(min-width:1700px){.hero{width:min(100% - 28px,1800px);margin-inline:auto}}
@media(max-width:900px){
  :root{--gutter:clamp(21px,4.4vw,40px)}
  .nav-inner{height:68px}.desktop-nav{margin-right:0;gap:20px}
  .service-split,.service-split.reverse,.contact-section{gap:32px}
  .steps{gap:20px}.project-intro{gap:28px}
  .cover-img{aspect-ratio:1}.cover-info h2{font-size:23px}
}
@media(max-width:720px){
  html{scroll-padding-top:73px}.nav-inner{height:61px;gap:12px}.brand{gap:8px}.marque{width:29px;transform:scale(.9)}
  .desktop-nav{display:none}.menu-toggle{display:block}.nav-actions{flex-wrap:nowrap;gap:8px}
  .hero{margin:7px 7px 0;border-radius:9px;min-height:clamp(430px,72svh,640px)}
  .hero-inner{padding:90px 25px 35px}.hero-kicker{font-size:10px;margin-bottom:15px}
  .hero h1{font-size:clamp(53px,10.8vw,77px)}.hero-desc{font-size:16px;max-width:400px;margin-top:17px}
  .hero-actions{margin-top:22px;gap:8px}.hero-actions .btn{padding:12px 15px;gap:10px;font-size:13px}
  .hero .hero-shade{background:linear-gradient(0deg,rgba(9,17,13,.84),rgba(9,17,13,.46) 51%,rgba(9,17,13,.08))}
  .project-intro,.service-split,.service-split.reverse,.contact-section{grid-template-columns:1fr}
  .project-intro{align-items:start;gap:16px;margin-bottom:22px}
  .service-copy{order:1}.service-photo,.reverse .service-photo{order:2;min-height:0;height:auto;aspect-ratio:1.75}
  .service-split{gap:26px}.section-tag{margin-bottom:14px}
  .contact-section{gap:24px}.contact-aside{min-height:245px}.contact-card{padding:0}
  .compare,.single-view{aspect-ratio:1.46}.compare-line>span{width:40px;height:40px;font-size:19px}
  .steps{grid-template-columns:1fr;gap:0}.steps li{display:grid;grid-template-columns:27px 1fr;column-gap:12px;padding:17px 0}
  .steps li:before{padding-top:6px}.steps h3{margin:0 0 4px;font-size:19px}.steps p{grid-column:2}
  .footer-inner{gap:12px}.footer-links{margin-left:0;width:100%;justify-content:space-between}
  .hub-title{grid-template-columns:1fr;gap:18px}.hub-title p{font-size:16px;max-width:440px}.covers{grid-template-columns:1fr;gap:28px}
  .cover-img{aspect-ratio:1.95}.cover-info{padding-top:10px}.cover-info h2{font-size:26px}.cover-info>span{margin-top:4px}
}
@media(max-width:430px){
  .form-grid{grid-template-columns:1fr}.hero-actions{align-items:flex-start;flex-wrap:wrap}.btn-nav{gap:7px;padding:7px 11px;font-size:12px;min-height:36px}
  .nav-inner{padding-inline:16px}.brand{font-size:18px}
  .figure-meta{letter-spacing:.025em}.compare-labels{inset:auto 8px 8px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}

.coordonnees dt{border-top:1px solid var(--line);padding-top:14px;margin-top:16px;font-size:13px;color:var(--muted)}.coordonnees dd{margin-top:4px;overflow-wrap:anywhere}.coordonnees .text-link{font-size:clamp(16px,1.6vw,23px);overflow-wrap:anywhere;display:inline}
.proposition{padding:8px 20px;text-align:center;background:#273424;color:white;font-size:13px}.proposition a{text-decoration:underline}
.maison-porin{--deep:#102743;--accent:#2666bb;--wash:#eff5fb;--ink:#11263c}
.maison-porin .proposition{background:#e9f2ff;color:#233f62;font-size:12px}
.maison-porin .brand>span{display:none}
.maison-porin .client-logo{width:145px;max-width:145px;height:auto}
.maison-porin .hero{display:grid;grid-template-columns:1fr 1fr;align-items:stretch;background:#102743;border-radius:0;margin:0;min-height:clamp(460px,63vh,670px)}
.maison-porin .hero-photo{position:static;grid-column:2;grid-row:1;height:100%;min-height:0;max-height:670px;object-position:52% 36%;z-index:0}
.maison-porin .hero-shade{display:none}
.maison-porin .hero-inner{grid-column:1;grid-row:1;align-self:center;padding:clamp(34px,5vw,85px);margin:0}
.maison-porin .hero-kicker{color:#afceff}
.maison-porin .hero h1{font-size:clamp(45px,5.25vw,90px);letter-spacing:-.057em}
.maison-porin .hero-desc{color:#e0eaf5}
.maison-porin .hero .btn-white,.maison-porin .btn-dark{background:#205fc1;color:white}
@media(max-width:720px){
.maison-porin .client-logo{max-width:108px}
.maison-porin .hero{grid-template-columns:1fr;min-height:0}
.maison-porin .hero-photo{grid-column:1;grid-row:1;height:clamp(190px,52vw,310px);object-position:center 27%}
.maison-porin .hero-inner{grid-row:2;padding:30px 22px 34px}
.maison-porin .hero h1{font-size:clamp(42px,10vw,64px)}
}