:root {
  --ink: #11110f;
  --paper: #f1efe9;
  --line: rgba(255, 255, 255, .24);
  --accent: #d99b4a;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--ink);
  color: #fff;
  font-family: "Manrope", Arial, sans-serif;
}
a { color: inherit; text-decoration: none; }

.topbar {
  min-height: 94px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 20px clamp(22px, 5vw, 76px);
  border-bottom: 1px solid rgba(255,255,255,.14);
  position: relative;
  z-index: 2;
}
.brand { display: flex; flex-direction: column; line-height: 1; }
.brand-name { font: 600 clamp(1.8rem, 3vw, 2.65rem)/1 "Oswald", sans-serif; letter-spacing: .07em; }
.brand-sub { margin-top: 8px; color: #b9b5ab; font-size: .68rem; letter-spacing: .24em; }
.quick { display: flex; align-items: center; gap: clamp(16px, 3vw, 36px); font-weight: 600; }
.contact-button { border: 1px solid #fff; padding: 12px 18px; transition: .25s; }
.contact-button:hover, .contact-button:focus-visible { background: #fff; color: var(--ink); }

.intro {
  padding: clamp(56px, 9vw, 120px) clamp(22px, 5vw, 76px) clamp(42px, 6vw, 76px);
  max-width: 1100px;
}
.eyebrow { margin: 0 0 18px; color: var(--accent); font-size: .72rem; font-weight: 700; letter-spacing: .24em; }
.intro h1, .manifesto h2 {
  margin: 0;
  font: 600 clamp(3.4rem, 9vw, 8rem)/.94 "Oswald", sans-serif;
  letter-spacing: -.025em;
  text-transform: uppercase;
}
.intro > p:last-child { margin: 24px 0 0; color: #c9c6bd; font-size: clamp(1rem, 1.5vw, 1.2rem); }

.services { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.service {
  min-height: min(620px, 64vw);
  padding: clamp(22px, 4vw, 56px);
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: flex;
  justify-content: space-between;
  border-top: 1px solid var(--line);
  background-position: center;
  background-size: cover;
}
.service:nth-child(odd) { border-right: 1px solid var(--line); }
.service::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg, rgba(8,8,7,.14), rgba(8,8,7,.88));
  transition: .45s ease;
}
.service::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background: inherit;
  background-position: center;
  background-size: cover;
  transition: transform .65s ease;
}
.service:hover::after { transform: scale(1.035); }
.service:hover::before { background: linear-gradient(180deg, rgba(8,8,7,.05), rgba(8,8,7,.76)); }
.service-renovation { background-image: url("plomberie-chauffage-atelier.png"); }
.service-pro { background-image: url("service-chantier.png"); }
.service-feu { background-image: url("renovation.png"); }
.service-pmr { background-image: url("pmr.png"); }
.number { font: 500 .78rem/1 "Manrope", sans-serif; letter-spacing: .18em; opacity: .72; }
.service-copy { align-self: flex-end; max-width: 520px; display: flex; flex-direction: column; align-items: flex-start; }
.tag { color: var(--accent); font-size: .68rem; font-weight: 700; letter-spacing: .22em; margin-bottom: 17px; }
.service strong { font: 600 clamp(2.5rem, 5vw, 5.7rem)/.94 "Oswald", sans-serif; text-transform: uppercase; }
.description { margin-top: 20px; max-width: 420px; color: #e4e1d9; font-size: clamp(.95rem, 1.35vw, 1.12rem); line-height: 1.55; }
.action { margin-top: 27px; padding-bottom: 7px; border-bottom: 1px solid #fff; font-size: .82rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }

.manifesto {
  padding: clamp(80px, 12vw, 170px) clamp(22px, 7vw, 110px);
  background: var(--paper);
  color: var(--ink);
}
.manifesto .eyebrow { color: #a26927; }
.manifesto p:last-child { max-width: 630px; margin: 34px 0 0 auto; font-size: clamp(1.15rem, 2.2vw, 1.75rem); line-height: 1.5; }

.seo-content {
  display: grid;
  grid-template-columns: 1.3fr .7fr;
  align-items: stretch;
  background: #1a1a17;
}
.seo-content > div { padding: clamp(55px, 8vw, 110px); }
.seo-content h2 { margin: 0 0 22px; font: 600 clamp(2rem, 4vw, 4rem)/1 "Oswald", sans-serif; text-transform: uppercase; }
.seo-content p { max-width: 750px; color: #c9c6bd; line-height: 1.75; }
.phone-card { padding: clamp(45px, 6vw, 90px); background: var(--accent); color: #16130f; display: flex; flex-direction: column; justify-content: center; gap: 12px; }
.phone-card span { font-size: .78rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.phone-card strong { font: 600 clamp(1.8rem, 3vw, 3.25rem)/1 "Oswald", sans-serif; }

footer { padding: 28px clamp(22px, 5vw, 76px); display: flex; flex-wrap: wrap; gap: 16px 34px; color: #a7a39a; font-size: .78rem; }
footer a { margin-left: auto; }

@media (max-width: 760px) {
  .topbar { min-height: 78px; }
  .quick > a:first-child { display: none; }
  .contact-button { padding: 10px 12px; font-size: .76rem; }
  .intro { min-height: 42vh; display: flex; flex-direction: column; justify-content: center; }
  .services { grid-template-columns: 1fr; }
  .service { min-height: 72vh; border-right: 0 !important; }
  .service strong { font-size: clamp(3rem, 15vw, 5rem); }
  .seo-content { grid-template-columns: 1fr; }
  footer a { margin-left: 0; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .service::after { transition: none; }
}

/* Original supplied logo, displayed without the surrounding black margins. */
.logo-window { position:relative; display:block; width:152px; height:139px; overflow:hidden; background:#000; }
.logo-window img { position:absolute; width:194px; height:auto; max-width:none; top:-66px; left:-20px; }
a:focus-visible,summary:focus-visible { outline:3px solid var(--accent); outline-offset:5px; }
.skip-link { position:absolute; left:16px; top:-100px; padding:14px; background:#fff; color:#111; z-index:20; }.skip-link:focus { top:10px; }
@media(max-width:760px) { .topbar { gap:14px; padding-block:12px; }.logo-window { width:120px; height:110px; }.logo-window img { width:153px; top:-52px; left:-16px; } }

.pro-main {max-width:1200px;margin:auto}.pro-panel{border:1px solid var(--line);background:#1a1a17;padding:clamp(24px,4vw,44px);margin:35px 0;max-width:680px}.pro-panel label{display:block;margin-bottom:12px;font-weight:600}.pro-panel input{display:block;width:100%;font:inherit;font-size:1rem;padding:15px;border:1px solid #aaa;background:#fff;color:#111;margin-bottom:18px}.pro-panel input:focus{outline:3px solid var(--accent);outline-offset:2px}.pro-panel button{cursor:pointer;font-family:inherit}.pro-panel p{color:#d5d1c7}.pro-panel .error{color:#ffb8a6}.pro-panel h2,.pro-request h2{font-size:2rem;margin-bottom:20px}.pro-request{padding:30px 0}.pro-request p{color:#c9c6bd}.logout{display:block;margin-top:22px}.logout button{color:#ccc;background:none;border:0;text-decoration:underline;font-size:1rem;padding:10px 0}.quick .pro-access-link{display:inline-block!important;font-size:.9rem;white-space:nowrap}@media(max-width:760px){.quick{flex-wrap:wrap;justify-content:flex-end;gap:12px}.quick>a[href^="tel:"]{display:none}.quick .contact-button{font-size:.875rem}.topbar .brand{flex-shrink:0}}

.contact-page{max-width:1400px;margin:auto}.contact-layout{display:grid;grid-template-columns:1.25fr 1fr;gap:clamp(24px,5vw,70px);align-items:start}.contact-layout .pro-panel{margin:10px 0}.contact-alternatives{padding:32px 0}.contact-alternatives h2{font-size:2rem}.contact-number{font:500 clamp(1.9rem,4vw,3rem)/1.3 Oswald,sans-serif;display:block;margin:20px 0}.contact-alternatives button{background:transparent;color:#fff;cursor:pointer;font-family:inherit}.contact-alternatives button:hover{color:#111}.pro-panel textarea{width:100%;font:inherit;padding:15px;margin-bottom:22px;resize:vertical;min-height:120px;line-height:1.6}.optional,.contact-hint{font-size:.9rem;color:#c9c6bd;font-weight:400}.response-promise{color:var(--accent)!important;font-weight:700;font-size:1rem;margin:24px 0 12px}.contact-actions .response-promise{margin:0 0 6px}.contact-layout input,.contact-layout textarea{box-sizing:border-box}.contact-layout textarea:focus-visible{outline:3px solid var(--accent);outline-offset:2px}@media(max-width:760px){.contact-layout{grid-template-columns:1fr}.contact-page .primary-button{width:100%}}

.service-renovation,.service-renovation::after { background-position:left center; }

footer{flex-wrap:wrap;gap:16px}footer address{font-style:normal}footer nav{display:flex;flex-wrap:wrap;gap:18px}.legal-page{max-width:1000px;margin:auto;line-height:1.75}.legal-page h1{font-size:clamp(2rem,7vw,4rem);margin:32px 0;overflow-wrap:anywhere}.legal-page h2{font-size:1.4rem;margin:36px 0 12px}.legal-page p{margin:12px 0}.legal-page a{text-decoration:underline;text-underline-offset:3px}.legal-page dd{margin:0 0 16px;overflow-wrap:anywhere}.legal-page dt{font-weight:bold}
