:root{--ink:#172e36;--paper:#f5f5f2;--accent:#afdfba;--muted:#53636a}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:2rem}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:1.6}a{color:inherit;text-decoration:none}a:focus-visible{outline:3px solid #38804c;outline-offset:6px}.skip{position:absolute;top:-100px}.skip:focus{top:0;background:white;z-index:10}header{padding:28px 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #172e3620}.brand strong{display:block;font-size:31px;letter-spacing:.09em;line-height:1}.brand span{display:block;font-size:12px;letter-spacing:.26em;margin-top:8px}nav{display:flex;align-items:center;gap:36px;font-size:14px}nav a:hover,.text-link:hover{text-decoration:underline;text-underline-offset:5px}.nav-contact{border-bottom:1px solid;padding:8px 0}.nav-contact span{margin-left:25px}.hero{display:grid;grid-template-columns:1.03fr 1fr;min-height:660px}.hero-copy{padding:85px 7% 56px 10%}.eyebrow{font-size:12px;font-weight:700;letter-spacing:.14em;margin:0 0 28px}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(48px,5.6vw,88px);font-weight:400;line-height:1.05;letter-spacing:-.055em;margin-bottom:30px}h1 em{font-family:Georgia,serif;font-weight:400;color:#41705e}p.intro{font-size:18px;max-width:410px;line-height:1.7;color:var(--muted)}.button{display:inline-flex;justify-content:space-between;align-items:center;gap:36px;background:var(--ink);color:white;padding:17px 25px;min-height:56px;margin-top:15px;font-size:15px}.button:hover{background:#2c4f5c}.hero-note{font-size:12px;color:var(--muted);margin:34px 0 0}.hero-visual{position:relative;background:#d9dfe0;min-height:480px;margin:28px 28px 28px 0;overflow:hidden}.hero-visual img{display:block;width:100%;height:100%;object-fit:cover}.image-label{position:absolute;bottom:20px;left:20px;background:var(--paper);padding:10px 16px;font-size:12px}.section{padding:95px 8%}.services{display:grid;grid-template-columns:1fr 1.2fr;gap:9%;border-top:1px solid #172e3620}h2{font-size:clamp(36px,4vw,57px);line-height:1.12;font-weight:400;letter-spacing:-.045em}.section-heading>p:last-child{max-width:320px;color:var(--muted)}.service-list article{display:flex;gap:25px;border-top:1px solid #172e3640;padding:25px 0}.service-list article:last-child{border-bottom:1px solid #172e3640}.number{font-size:12px;padding-top:5px;color:var(--muted)}h3{font-size:21px;font-weight:400;letter-spacing:-.025em;margin-bottom:10px}.service-list p{font-size:15px;color:var(--muted);margin:0}.approach{background:var(--ink);color:white;display:grid;grid-template-columns:1fr 1.2fr;gap:9%}.approach .eyebrow{color:var(--accent)}.approach h2{font-size:clamp(40px,4vw,62px)}.approach p:not(.eyebrow){color:#c3d0d4;max-width:550px}.text-link{display:inline-block;font-size:15px;border-bottom:1px solid currentColor;padding-bottom:5px;margin-top:12px}.contact{display:grid;grid-template-columns:1fr 1fr;gap:9%;background:var(--accent)}.contact p:not(.eyebrow){max-width:440px}.contact h2{font-size:clamp(44px,5vw,72px)}.contact-actions{display:flex;align-items:flex-start;justify-content:center;flex-direction:column}.contact-actions .button{width:100%;max-width:350px}.contact-actions>p{font-size:14px;margin-top:35px}footer{padding:42px 5%;display:flex;align-items:center;justify-content:space-between;gap:24px}footer p,footer>span{font-size:12px;color:var(--muted);margin:0}@media(min-width:1600px){body{max-width:1800px;margin:auto}}@media(max-width:800px){header{padding:24px 6%}nav>a:not(.nav-contact){display:none}nav{gap:0}.nav-contact{font-size:12px}.nav-contact span{margin-left:8px}.brand strong{font-size:26px}.brand span{font-size:10px}.hero{grid-template-columns:1fr}.hero-copy{padding:52px 7% 30px}.eyebrow{font-size:11px;letter-spacing:.1em}h1{font-size:64px}.hero-visual{margin:0 6% 32px;min-height:0;aspect-ratio:1/1}.hero-note{margin-top:25px}.section{padding:60px 7%}.services,.approach,.contact{grid-template-columns:1fr;gap:28px}.service-list article{padding:23px 0}.section-heading>p:last-child{max-width:100%}footer{flex-wrap:wrap;padding:32px 7%}footer>span{width:100%}.contact-actions .button{max-width:none}}@media(max-width:370px){h1{font-size:53px}.nav-contact{max-width:130px}header{gap:12px}.button{gap:15px;padding:16px 20px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

:root{--ink:#282722;--paper:#faf9f6;--accent:#dac89e;--muted:#666258}h1 em{color:#907343}header{padding-top:14px;padding-bottom:14px}.brand .logo-crop{display:block;position:relative;width:139px;height:88px;overflow:hidden;margin:0}.logo-crop img{position:absolute;width:460px;height:auto;max-width:none;left:-26px;top:-23px}.hero-visual img{position:absolute;left:-105%;width:205%;max-width:none;height:100%;object-fit:cover}.hero-visual{background:#e7e4df}.button:hover{background:#4a4539}.approach p:not(.eyebrow){color:#d6d2c8}.button:focus-visible{outline-color:#a3864c}@media(max-width:800px){.hero-visual{aspect-ratio:1.15/1}.hero-visual img{left:-85%;width:185%}}
body .brand .logo-crop{width:150px;height:116px;mix-blend-mode:multiply;flex-shrink:0}body .brand .logo-crop img{width:160px;height:160px;left:-5px;top:-20px}.brand{flex-shrink:0}
/* Rénovation résidentielle : extension de la direction visuelle existante. */
.license{font-size:14px;font-weight:600;line-height:1.5;margin-top:12px}
.hero h1{font-size:clamp(46px,5vw,76px)}
.hero .eyebrow{line-height:1.6;font-size:12px;max-width:430px}
.integrated,.portfolio{display:grid;grid-template-columns:1fr 1.2fr;gap:9%;border-top:1px solid #28272225}
.integrated{background:#eeece5}
.integrated p:not(.eyebrow),.portfolio p{color:var(--muted)}
#project-gallery:empty{display:none}
#project-gallery{grid-column:1/-1}
.project{padding:30px 0;border-top:1px solid #28272230}
.project-photos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.project-photos figure{margin:0}.project-photos img{width:100%;height:280px;object-fit:cover}
.project-photos figcaption{font-size:14px;margin-top:8px}
.contact{align-items:start}
#project-form{grid-column:1/-1;border-top:1px solid #28272240;padding-top:36px;margin-top:12px;max-width:900px;width:100%}
#project-form h3{font-size:28px}
#project-form .form-note{font-size:14px;max-width:750px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
#project-form label{display:block;font-size:16px;margin-bottom:18px}
input,select,textarea{display:block;width:100%;max-width:100%;margin-top:7px;background:#fffaf0;color:var(--ink);border:1px solid #776e58;border-radius:0;padding:13px 12px;font:inherit;font-size:16px}
textarea{resize:vertical}input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid #282722;outline-offset:3px}
button.button{font:inherit;border:0;cursor:pointer}
#form-status{font-size:14px;margin-top:18px;max-width:700px;white-space:pre-line}
.project-main{display:block;width:100%;height:auto;max-height:640px;object-fit:contain;margin-bottom:24px}
.form-grid{column-gap:18px;row-gap:0}
.form-grid>label{min-width:0}
input,select{min-height:48px;padding:10px 12px;line-height:1.5}
select{overflow:hidden;text-overflow:ellipsis}
textarea{min-height:120px}
#project-form .button{max-width:100%;text-align:left}
.text-link{overflow-wrap:anywhere;min-height:44px}
@media(max-width:800px){
  .section>*{min-width:0}
  #project-form label{margin-bottom:14px}
  .image-label{max-width:calc(100% - 40px)}
}
.service-list p{font-size:16px}
nav{flex-wrap:wrap;gap:24px}
header{gap:20px}
@media(max-width:800px){
.integrated,.portfolio{grid-template-columns:1fr;gap:24px}
.form-grid,.project-photos{grid-template-columns:1fr}
.hero h1{font-size:clamp(42px,9vw,64px)}
.contact h2{font-size:clamp(36px,8vw,56px)}
.hero .eyebrow{font-size:12px}
.project-photos img{height:auto}
.contact-actions{align-items:stretch}
#project-form{min-width:0}
}
@media(max-width:370px){body .brand .logo-crop{width:120px;height:100px}body .brand .logo-crop img{width:135px;height:135px;left:-5px;top:-17px}header{gap:8px}}
/* Réalisations authentiques : une image active et des vues compactes. */
#hero-visual{align-self:center;min-height:0;aspect-ratio:1/1}
#hero-visual img{position:static;display:block;left:auto;width:100%;height:100%;object-fit:contain;object-position:center}
#project-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px}
.project{min-width:0}
.project-feature{margin:0 0 24px}
.project-feature .project-main{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;object-position:center;background:#eeece5;margin:0}
.project-feature figcaption{padding:8px 0;font-size:14px;font-weight:600}
.project-work{font-size:14px}
.project-thumbnails{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:4px 4px 12px}
.photo-choice{min-width:0;min-height:44px;border:1px solid #b6b0a3;background:transparent;color:var(--ink);padding:4px;cursor:pointer;font:inherit}
.photo-choice img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;object-position:center;background:#eeece5}
.photo-choice span{display:block;font-size:12px;line-height:1.4;padding:7px 2px}
.photo-choice[aria-pressed=true]{border:2px solid #907343;padding:3px}
.photo-choice:focus-visible{outline:3px solid #907343;outline-offset:2px}
@media(max-width:800px){
 #hero-visual{aspect-ratio:1/1;margin:0 6% 32px}
 #project-gallery{grid-template-columns:1fr;gap:24px}
 .project-thumbnails{gap:8px}
}
/* Afficheur des réalisations, sans recadrage des photos. */
.project-feature .project-main{width:100%;height:auto;max-height:none;aspect-ratio:auto;object-fit:contain;background:transparent}
.open-photos{display:block;width:100%;padding:0;border:0;background:transparent;cursor:zoom-in}
.gallery-link{background:transparent;color:inherit;border:0;border-bottom:1px solid currentColor;font:inherit;cursor:pointer;padding:8px 0}
.open-photos:focus-visible,.gallery-link:focus-visible{outline:3px solid #907343;outline-offset:4px}
#project-gallery{align-items:start}
#photo-viewer{position:fixed;inset:0;width:100%;height:100%;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:#181817;color:#faf9f6}
#photo-viewer::backdrop{background:#181817}
.viewer-shell{height:100%;display:grid;grid-template-rows:auto minmax(0,1fr) auto;padding:max(12px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));gap:12px}
.viewer-top{display:flex;align-items:center;justify-content:space-between;gap:16px}
#viewer-title{font:inherit;font-size:16px;line-height:1.4;letter-spacing:normal;margin:0}
#photo-viewer button{flex-shrink:0;background:transparent;color:inherit;border:1px solid #817d70;border-radius:3px;min-width:48px;min-height:48px;padding:8px 12px;font:inherit;cursor:pointer}
#photo-viewer button:focus-visible{outline:3px solid #dac89e;outline-offset:3px}
.viewer-stage{min-height:0;min-width:0;display:flex;align-items:center;justify-content:center;touch-action:pan-y pinch-zoom}
#viewer-image{display:block;width:100%;height:100%;object-fit:contain;user-select:none}
.viewer-bottom{text-align:center}
.viewer-nav{display:flex;align-items:center;justify-content:center;gap:24px}
#viewer-count{min-width:56px;font-size:16px}
#viewer-caption{margin:8px 0 0;font-size:16px;line-height:1.4}
@media(max-width:600px){#viewer-title{font-size:14px}.viewer-shell{gap:8px}.viewer-top{gap:8px}}
/* Finitions de l'interface et contraintes intrinsèques mobiles. */
.ui-icon{display:inline-block;width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;vertical-align:-2px;flex-shrink:0}
.sr-only,.form-trap{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip-path:inset(50%);white-space:nowrap;border:0}
.hero>*,.contact>*,.services>*,.approach>*,.integrated>*,.portfolio>*,header nav{min-width:0}
.button{max-width:100%;white-space:normal;overflow-wrap:anywhere;gap:18px}
nav .nav-contact{min-height:44px;display:flex;align-items:center;gap:10px}
nav .nav-contact span{margin-left:0}
footer>*{min-width:0;overflow-wrap:anywhere}
.viewer-stage{position:relative;padding:0 56px}
#viewer-image{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain}
#viewer-prev,#viewer-next{position:absolute;top:50%;transform:translateY(-50%);z-index:1;background:#181817b3!important;border-color:#ffffff30!important}
#viewer-prev{left:0}#viewer-next{right:0}
#viewer-close{border:0!important}
.viewer-nav{min-height:24px}
#viewer-title{min-width:0;overflow-wrap:anywhere}
@media(max-width:800px){header nav{flex:1;justify-content:flex-end}.nav-contact{max-width:180px}.viewer-stage{padding:0}#viewer-prev{left:0}#viewer-next{right:0}}