@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 400 800;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url(/fonts/archivo-normal-latin-ext-0.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 400 800;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url(/fonts/archivo-normal-latin-1.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'DM Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/dm-mono-normal-latin-ext-2.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'DM Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/dm-mono-normal-latin-3.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* photographe-de-produit.com — noir chaud, crème, ambre ; repères de cadrage (inspiration cominspir.fr, variée le 13/10/2026) */
:root{
  --noir:#0d0b09;--noir2:#15120f;--noir3:#1c1814;--creme:#f5f0e6;--creme2:rgba(245,240,230,.66);--creme3:rgba(245,240,230,.38);
  --filet:rgba(245,240,230,.13);--orange:#ffc061;--orange2:#f5a524;
  --f:'Archivo',system-ui,-apple-system,'Segoe UI',sans-serif;--mono:'DM Mono',ui-monospace,'SFMono-Regular',Menlo,monospace;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:80px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
body{margin:0;background:var(--noir);color:var(--creme);font:400 1.02rem/1.7 var(--f);-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration-color:var(--creme3);text-underline-offset:4px}
a:hover{text-decoration-color:var(--orange)}
:focus-visible{outline:2px solid var(--orange);outline-offset:3px}
h1,h2,h3{margin:0 0 .5em;line-height:1;letter-spacing:-.02em;text-wrap:balance}
h1,h2{font-stretch:125%;font-weight:800}
h2{font-size:clamp(2.4rem,5.6vw,4.6rem)}
h3{font-size:1.3rem;font-weight:700;font-stretch:112%;line-height:1.2;letter-spacing:-.01em}
p{margin:0 0 1.1em}
.w{width:min(1280px,100% - 56px);margin-inline:auto}
@media (max-width:560px){.w{width:calc(100% - 32px)}}
.etroit{max-width:760px}
.saut{position:absolute;left:-9999px}.saut:focus{left:16px;top:12px;z-index:99;background:var(--creme);color:var(--noir);padding:8px 12px}
.mono{font:400 .74rem/1.4 var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--creme2)}
.doux{color:var(--creme2)}
.fl{display:inline-block;transition:transform .25s ease}

/* Boutons pilule */
.pilule{display:inline-flex;align-items:center;gap:10px;background:var(--orange2);color:var(--noir);text-decoration:none;font:700 .86rem/1 var(--f);padding:11px 18px;border-radius:99px;transition:background-color .2s ease,transform .15s ease;white-space:nowrap}
.pilule:hover{background:var(--orange)}.pilule:hover .fl{transform:translateX(3px)}
.pilule:active{transform:scale(.97)}
.pilule.grande{font-size:.98rem;padding:15px 24px}
.lien{font-weight:600;text-decoration:none;border-bottom:1px solid var(--creme3);padding-bottom:3px}
.lien:hover{border-color:var(--orange)}

/* En-tête */
.tete{position:sticky;top:0;z-index:30;background:rgba(13,11,9,.82);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--filet)}
.tete .w{display:flex;align-items:center;gap:22px;min-height:66px}
.logo{font:800 .92rem/1 var(--f);font-stretch:125%;letter-spacing:.01em;text-decoration:none;white-space:nowrap;margin-right:auto}
.logo i{font-style:normal;color:var(--orange);font-size:.6em;margin-left:4px;vertical-align:.4em}
.nav{display:flex;gap:4px}
.nav a{text-decoration:none;font-size:.88rem;font-weight:500;padding:8px 12px;border-radius:99px;color:var(--creme2)}
.nav a:hover,.nav a[aria-current]{color:var(--creme);background:var(--noir3)}
.tel{font:400 .8rem/1 var(--mono);text-decoration:none;color:var(--creme2);white-space:nowrap}
.tel:hover{color:var(--creme)}
.burger{display:none;width:44px;height:44px;border:1px solid var(--filet);border-radius:99px;background:none;cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:6px}
.burger span{display:block;width:18px;height:1.5px;background:var(--creme);transition:transform .25s ease}
.burger[aria-expanded="true"] span:first-child{transform:translateY(3.75px) rotate(45deg)}
.burger[aria-expanded="true"] span:last-child{transform:translateY(-3.75px) rotate(-45deg)}
@media (max-width:1020px){.tel{display:none}}
@media (max-width:860px){
  .burger{display:flex}
  .tete .pilule{display:none}
  .nav{position:absolute;inset:100% 0 auto;flex-direction:column;background:var(--noir);border-bottom:1px solid var(--filet);padding:8px 16px 18px;display:none}
  .nav.ouvert{display:flex}
  .nav a{padding:16px 4px;border-radius:0;border-bottom:1px solid var(--filet);font:800 1.25rem/1.1 var(--f);font-stretch:125%;color:var(--creme)}
  .nav a:hover,.nav a[aria-current]{background:none;color:var(--orange)}
}

/* Une : titre + photo encadrée de repères de cadrage */
.une{padding:clamp(40px,6vw,88px) 0 clamp(48px,7vw,96px);background:
  linear-gradient(var(--filet) 1px,transparent 1px) 0 0/100% 25%,linear-gradient(90deg,var(--filet) 1px,transparent 1px) 0 0/12.5% 100%;background-color:var(--noir)}
.une-grille{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,80px);align-items:center}
.une h1{font-size:clamp(2.7rem,6.8vw,6.6rem);line-height:.9;letter-spacing:-.035em;margin:18px 0 0}
.une h1 span{display:block}
.une h1 i{font-style:normal;color:var(--orange2)}
.une .chapo{max-width:50ch;margin:clamp(24px,3vw,36px) 0 30px;color:rgba(245,240,230,.86);font-size:clamp(1rem,1.3vw,1.12rem)}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:22px}
.une-photo{margin:0;max-width:640px;justify-self:end}
.une-photo img{width:100%;height:auto}
.une-photo figcaption{display:flex;justify-content:space-between;margin-top:14px}
@media (max-width:900px){.une-grille{grid-template-columns:1fr}.une-photo{max-width:520px}}
/* Repères de cadrage (coins de visée) */
.vise{position:relative;padding:14px}
.vise img{border-radius:2px}
.coin{position:absolute;width:22px;height:22px;border:0 solid var(--orange2);pointer-events:none;transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.c1{top:0;left:0;border-top-width:2px;border-left-width:2px}.c2{top:0;right:0;border-top-width:2px;border-right-width:2px}
.c3{bottom:0;left:0;border-bottom-width:2px;border-left-width:2px}.c4{bottom:0;right:0;border-bottom-width:2px;border-right-width:2px}
.une-photo .c3,.une-photo .c4{bottom:44px}
@media (hover:hover){.vise:hover .c1{transform:translate(-5px,-5px)}.vise:hover .c2{transform:translate(5px,-5px)}.vise:hover .c3{transform:translate(-5px,5px)}.vise:hover .c4{transform:translate(5px,5px)}}

/* Bandeau défilant */
.defile{border-top:1px solid var(--filet);border-bottom:1px solid var(--filet);overflow:hidden;padding:18px 0;background:var(--noir2)}
.defile-piste{display:flex;gap:28px;width:max-content;animation:defile 38s linear infinite}
.defile span{font:800 clamp(1.1rem,2vw,1.5rem)/1 var(--f);font-stretch:125%;text-transform:uppercase;color:var(--creme2)}
.defile i{font-style:normal;color:var(--orange);font-size:.8rem;align-self:center}
@keyframes defile{to{transform:translateX(-50%)}}

/* Manifeste */
.manifeste{padding:clamp(72px,10vw,150px) 0}
.manif{font:500 clamp(1.6rem,3.6vw,3.1rem)/1.15 var(--f);font-stretch:112%;letter-spacing:-.02em;color:rgba(245,240,230,.42);max-width:24ch;margin:0 0 clamp(36px,5vw,64px)}
.manif b{color:var(--creme);font-weight:800;font-stretch:125%;text-transform:uppercase}
.chiffres{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:20px 44px}
.chiffres b{display:block;font:800 1.2rem/1.2 var(--f);font-stretch:118%}
.chiffres span{font-size:.85rem;color:var(--creme2)}

/* Réalisations : quinconce sur 2 colonnes */
.realisations{padding:clamp(56px,7vw,110px) 0;border-top:1px solid var(--filet)}
.quinconce{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,64px) clamp(24px,4vw,72px);align-items:start}
.projet{position:relative;margin:0}
.projet.decale{margin-top:clamp(60px,10vw,160px)}
.projet .num{position:absolute;top:-.55em;right:0;z-index:1;margin:0;font:800 clamp(3rem,6vw,5.5rem)/1 var(--f);font-stretch:125%;color:transparent;-webkit-text-stroke:1.5px var(--orange2);pointer-events:none}
.projet figure{margin:0}
.projet img{width:100%;height:auto;transition:filter .5s ease}
.legende{display:flex;justify-content:space-between;gap:16px;align-items:baseline;padding:12px 14px 0}
.legende h3{margin:0;font-size:1.05rem}
@media (max-width:700px){.quinconce{grid-template-columns:1fr}.projet.decale{margin-top:0}.projet .num{font-size:2.6rem}}

/* Titres de section */
.titre-sec{display:grid;grid-template-columns:1.2fr .8fr;gap:12px 48px;align-items:end;margin-bottom:clamp(32px,5vw,64px)}
.titre-sec h2{grid-column:1;margin:0}
.titre-sec .sous{grid-column:1;margin:0;font:700 clamp(1rem,1.6vw,1.3rem)/1.25 var(--f);font-stretch:112%;color:var(--creme2)}
.titre-sec .doux{grid-column:2;grid-row:1/3;margin:0;max-width:40ch}
@media (max-width:800px){.titre-sec{grid-template-columns:1fr}.titre-sec .doux{grid-column:1;grid-row:auto}}

/* Prestations : index numéroté */
.prestations{padding:clamp(64px,8vw,120px) 0}
.index{list-style:none;margin:0;padding:0;border-top:1px solid var(--filet)}
.index a{display:grid;grid-template-columns:70px 1.1fr 1.4fr 180px 40px;gap:24px;align-items:baseline;padding:clamp(22px,2.6vw,32px) 0;border-bottom:1px solid var(--filet);text-decoration:none;transition:background-color .3s ease,padding .3s ease}
.index .mono{color:var(--orange2)}
.index h3{margin:0;font-size:clamp(1.2rem,2vw,1.6rem);font-stretch:125%;font-weight:800}
.index p{margin:0;color:var(--creme2);font-size:.95rem}
.index .tagl{color:var(--creme3)}
.index .fleche{font-size:1.4rem;color:var(--creme3);transition:transform .3s ease,color .3s ease;justify-self:end}
@media (hover:hover){.index a:hover{background:var(--noir2);padding-left:16px;padding-right:16px}.index a:hover .fleche{color:var(--orange2);transform:translate(3px,-3px)}}
@media (max-width:900px){.index a{grid-template-columns:44px 1fr 28px;gap:6px 14px}.index p,.index .tagl{grid-column:2}.index .fleche{grid-column:3;grid-row:1}}

/* Méthode */
.methode{padding:clamp(64px,8vw,120px) 0}
.etapes{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--filet)}
.etapes li{padding:26px 22px 0 0;margin-right:22px;border-right:1px solid var(--filet)}
.etapes li:last-child{border-right:0;margin-right:0}
.etapes .mono{color:var(--orange)}
.etapes p:not(.mono){color:var(--creme2);font-size:.94rem}
@media (max-width:900px){.etapes{grid-template-columns:1fr 1fr}.etapes li:nth-child(2){border-right:0;margin-right:0}}
@media (max-width:560px){.etapes{grid-template-columns:1fr}.etapes li{border-right:0;margin-right:0;border-bottom:1px solid var(--filet);padding:22px 0 8px}}

/* Texte SEO */
.texte-seo{padding:clamp(48px,6vw,96px) 0;border-top:1px solid var(--filet)}
.deux-col{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,72px)}
.deux-col p{color:var(--creme2)}
@media (max-width:800px){.deux-col{grid-template-columns:1fr}}

/* Guides */
.guides{padding:clamp(56px,7vw,110px) 0;border-top:1px solid var(--filet)}
.guides-grille{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.guide{position:relative;display:block;overflow:hidden;border-radius:4px;aspect-ratio:4/3;text-decoration:none}
.guide img{width:100%;height:100%;object-fit:cover;transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.guide::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 35%,rgba(13,11,9,.85))}
.guide span{position:absolute;left:20px;right:20px;bottom:18px;z-index:1;font:800 clamp(1.3rem,2.2vw,1.9rem)/1 var(--f);font-stretch:125%;text-transform:uppercase;color:var(--creme)}
@media (hover:hover){.guide:hover img{transform:scale(1.05)}}
@media (max-width:800px){.guides-grille{grid-template-columns:1fr}}

/* FAQ */
.faq{padding:clamp(56px,7vw,110px) 0;border-top:1px solid var(--filet)}
.faq .w{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(24px,5vw,80px)}
.faq details{border-top:1px solid var(--filet)}
.faq details:last-child{border-bottom:1px solid var(--filet)}
.faq summary{cursor:pointer;list-style:none;padding:20px 52px 20px 0;font-weight:600;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:0;top:50%;width:30px;height:30px;margin-top:-15px;border:1px solid var(--filet);border-radius:50%;display:grid;place-items:center;font:400 1rem/1 var(--mono);transition:transform .25s ease,background-color .25s ease}
.faq details[open] summary::after{transform:rotate(45deg);background:var(--orange2);border-color:var(--orange2);color:var(--noir)}
.faq details p{color:var(--creme2);font-size:.95rem;max-width:62ch;padding-bottom:10px}
@media (max-width:800px){.faq .w{grid-template-columns:1fr}}

/* Pages internes */
.tete-page{padding:clamp(40px,6vw,88px) 0 0;position:relative;isolation:isolate;overflow:hidden}
.tete-page::before{content:"";position:absolute;left:-10%;right:-10%;top:-30%;height:80%;z-index:-1;background:radial-gradient(45% 55% at 40% 40%,rgba(245,165,36,.18),transparent 70%);filter:blur(30px)}
.tete-page h1{font-size:clamp(2.3rem,5vw,4.8rem);line-height:.92;letter-spacing:-.03em;max-width:14ch}
.tete-page{padding-bottom:clamp(40px,5vw,72px);background:linear-gradient(var(--filet) 1px,transparent 1px) 0 0/100% 25%,linear-gradient(90deg,var(--filet) 1px,transparent 1px) 0 0/12.5% 100%}
.tete-grille{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,80px);align-items:center}
.tete-photo{margin:0;justify-self:end;width:100%}
.tete-photo img{width:100%;height:auto}
.tete-photo .c3,.tete-photo .c4{bottom:44px}
.tete-photo figcaption{display:flex;justify-content:space-between;margin-top:14px}
@media (max-width:900px){.tete-grille{grid-template-columns:1fr}.tete-photo{justify-self:start}}
.fil{margin-bottom:28px}.fil a{text-decoration:none;color:var(--creme2)}.fil a:hover{color:var(--creme)}
.tete-page .chapo{max-width:58ch;color:rgba(245,240,230,.86);font-size:clamp(1rem,1.3vw,1.15rem);margin:24px 0 30px}
.photo-tete{margin-top:clamp(36px,5vw,64px);margin-bottom:0}
.photo-tete img{width:auto;max-width:100%;height:auto;border-radius:4px}
.article{padding:clamp(48px,6vw,96px) 0}
.article h2{font-size:clamp(1.7rem,3.4vw,2.6rem);margin-top:1.4em}
.article h3{margin-top:1.4em}
.article p,.article li{color:rgba(245,240,230,.8)}
.article strong{color:var(--creme)}
.lettrine{font-size:clamp(1.15rem,1.7vw,1.35rem);line-height:1.55;color:var(--creme)!important}
.liste{list-style:none;padding:0;margin:0 0 1.4em}
.liste li{padding:11px 0 11px 26px;border-bottom:1px solid var(--filet);position:relative}
.liste li:first-child{border-top:1px solid var(--filet)}
.liste li::before{content:"";position:absolute;left:0;top:1.35em;width:12px;height:1.5px;background:var(--orange)}
.photo{margin:clamp(28px,4vw,48px) 0}
.photo img{border-radius:4px}
.photo figcaption{margin-top:10px}
.encart{margin:clamp(28px,4vw,48px) 0 0;padding:24px 26px;border:1px solid var(--filet);border-left:3px solid var(--orange);background:var(--noir2);border-radius:4px}
.encart .mono{color:var(--orange);margin-bottom:8px}
.encart p:last-child{margin:0}

/* Devis */
.devis{padding:clamp(64px,8vw,120px) 0;background:var(--noir2);border-top:1px solid var(--filet)}
.devis .w{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(32px,6vw,96px)}
.devis h2{font-size:clamp(2.2rem,4.6vw,3.8rem)}
.devis p:not(.mono){color:var(--creme2)}
.coord{list-style:none;margin:28px 0 0;padding:0}
.coord li{display:grid;grid-template-columns:110px 1fr;gap:12px;padding:14px 0;border-top:1px solid var(--filet);font-weight:600}
.coord a{text-decoration:none}.coord a:hover{color:var(--orange)}
.form{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form .plein{grid-column:1/-1}
.form label{display:block;font:400 .72rem/1.4 var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--creme2);margin-bottom:7px}
.form input,.form select,.form textarea{width:100%;font:inherit;font-size:16px;color:var(--creme);background:var(--noir);border:1px solid var(--filet);border-radius:8px;padding:12px 14px}
.form select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--creme2) 50%),linear-gradient(135deg,var(--creme2) 50%,transparent 50%);background-position:calc(100% - 20px) 52%,calc(100% - 15px) 52%;background-size:5px 5px;background-repeat:no-repeat}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--orange)}
.form textarea{min-height:140px;resize:vertical}
.form button{grid-column:1/-1;justify-self:start;display:inline-flex;gap:10px;align-items:center;background:var(--orange2);color:var(--noir);border:0;border-radius:99px;padding:15px 26px;font:700 .98rem/1 var(--f);cursor:pointer;transition:background-color .2s ease,transform .15s ease}
.form button:hover{background:var(--orange)}.form button:active{transform:scale(.97)}.form button:disabled{opacity:.6}
.pot{position:absolute;left:-9999px}
.etat{grid-column:1/-1;margin:0;font-size:.92rem;color:var(--creme2)}
.etat.ok{color:#9be29b}.etat.err{color:#ff9a7a}
@media (max-width:900px){.devis .w{grid-template-columns:1fr}}
@media (max-width:560px){.form{grid-template-columns:1fr}}

/* Pied */
.pied{padding:clamp(56px,7vw,96px) 0 28px;border-top:1px solid var(--filet);overflow:hidden}
.pied-grille{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px}
.pied-grille p:not(.mono){color:var(--creme2);font-size:.92rem;max-width:40ch}
.pied ul{list-style:none;margin:0;padding:0}
.pied li{margin:0 0 9px;font-size:.92rem}
.pied a{text-decoration:none;color:var(--creme2)}.pied a:hover{color:var(--creme)}
.geant{font:800 clamp(3rem,14.5vw,14rem)/.85 var(--f);font-stretch:125%;letter-spacing:-.04em;color:transparent;-webkit-text-stroke:1.5px rgba(245,240,230,.16);margin:clamp(40px,6vw,80px) 0 18px;white-space:nowrap}
.geant i{font-style:normal;color:var(--orange2);-webkit-text-stroke:0;font-size:.25em;vertical-align:.9em;margin-left:.1em}
.bas{margin:0;color:var(--creme3)}
@media (max-width:800px){.pied-grille{grid-template-columns:1fr;gap:28px}}
.appel{display:none}
@media (max-width:860px){.appel{display:grid;place-items:center;position:fixed;right:16px;bottom:16px;z-index:40;width:56px;height:56px;border-radius:50%;background:var(--orange2);color:var(--noir);box-shadow:0 10px 30px -8px rgba(245,165,36,.55)}}
