/* ============================================================
   GARAGE AUTO GENEVOIS - Design system
   Thème sombre "tableau de bord", accent bleu #1769FF.
   Rayons : boutons en pilule, cartes/médias 18px, champs 10px.
   Couches z-index : contenu 1, header 50, menu mobile 60, grain 70.
   ============================================================ */
/* ============ POLICES hébergées sur le site (Geist, Geist Mono, Unbounded : licence OFL) ============ */
@font-face { font-family: "Geist"; font-style: normal; font-weight: 300 700; font-display: swap; src: url("/assets/fonts/geist-latin-ext.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: "Geist"; font-style: normal; font-weight: 300 700; font-display: swap; src: url("/assets/fonts/geist-latin.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: "Geist Mono"; font-style: normal; font-weight: 400; font-display: swap; src: url("/assets/fonts/geist-mono-latin-ext-400.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: "Geist Mono"; font-style: normal; font-weight: 400; font-display: swap; src: url("/assets/fonts/geist-mono-latin-400.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: "Geist Mono"; font-style: normal; font-weight: 500; font-display: swap; src: url("/assets/fonts/geist-mono-latin-ext-400.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: "Geist Mono"; font-style: normal; font-weight: 500; font-display: swap; src: url("/assets/fonts/geist-mono-latin-400.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: "Unbounded"; font-style: normal; font-weight: 400 700; font-display: swap; src: url("/assets/fonts/unbounded-latin-ext.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: "Unbounded"; font-style: normal; font-weight: 400 700; font-display: swap; src: url("/assets/fonts/unbounded-latin.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; }

/* ============ ICÔNES : 32 icônes Phosphor (licence MIT) en masques CSS, sans police ni requête externe ============ */
.ph, .ph-fill { display: inline-block; flex: none; width: 1em; height: 1em; vertical-align: -.125em; background-color: currentColor; -webkit-mask: var(--i) center / contain no-repeat; mask: var(--i) center / contain no-repeat; }
.ph-arrow-left{--i:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20256%20256%22%20fill=%22currentColor%22%3E%3Cpath%20d=%22M224,128a8,8,0,0,1-8,8H59.31l58.35,58.34a8,8,0,0,1-11.32,11.32l-72-72a8,8,0,0,1,0-11.32l72-72a8,8,0,0,1,11.32,11.32L59.31,120H216A8,8,0,0,1,224,128Z%22/%3E%3C/svg%3E")}
.ph-arrow-right{--i:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20256%20256%22%20fill=%22currentColor%22%3E%3Cpath%20d=%22M221.66,133.66l-72,72a8,8,0,0,1-11.32-11.32L196.69,136H40a8,8,0,0,1,0-16H196.69L138.34,61.66a8,8,0,0,1,11.32-11.32l72,72A8,8,0,0,1,221.66,133.66Z%22/%3E%3C/svg%3E")}
.ph-arrow-up-right{--i:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20256%20256%22%20fill=%22currentColor%22%3E%3Cpath%20d=%22M200,64V168a8,8,0,0,1-16,0V83.31L69.66,197.66a8,8,0,0,1-11.32-11.32L172.69,72H88a8,8,0,0,1,0-16H192A8,8,0,0,1,200,64Z%22/%3E%3C/svg%3E")}
.ph-battery-charging{--i:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20256%20256%22%20fill=%22currentColor%22%3E%3Cpath%20d=%22M200,56H32A24,24,0,0,0,8,80v96a24,24,0,0,0,24,24H200a24,24,0,0,0,24-24V80A24,24,0,0,0,200,56Zm8,120a8,8,0,0,1-8,8H32a8,8,0,0,1-8-8V80a8,8,0,0,1,8-8H200a8,8,0,0,1,8,8Zm48-80v64a8,8,0,0,1-16,0V96a8,8,0,0,1,16,0ZM138.81,123.79a8,8,0,0,1,.35,7.79l-16,32a8,8,0,0,1-14.32-7.16L119.06,136H100a8,8,0,0,1-7.16-11.58l16-32a8,8,0,1,1,14.32,7.16L112.94,120H132A8,8,0,0,1,138.81,123.79Z%22/%3E%3C/svg%3E")}
.ph-calendar-check{--i:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20256%20256%22%20fill=%22currentColor%22%3E%3Cpath%20d=%22M208,32H184V24a8,8,0,0,0-16,0v8H88V24a8,8,0,0,0-16,0v8H48A16,16,0,0,0,32,48V208a16,16,0,0,0,16,16H208a16,16,0,0,0,16-16V48A16,16,0,0,0,208,32ZM72,48v8a8,8,0,0,0,16,0V48h80v8a8,8,0,0,0,16,0V48h24V80H48V48ZM208,208H48V96H208V208Zm-38.34-85.66a8,8,0,0,1,0,11.32l-48,48a8,8,0,0,1-11.32,0l-24-24a8,8,0,0,1,11.32-11.32L116,164.69l42.34-42.35A8,8,0,0,1,169.66,122.34Z%22/%3E%3C/svg%3E")}
.ph-car-profile{--i:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20256%20256%22%20fill=%22currentColor%22%3E%3Cpath%20d=%22M240,112H211.31L168,68.69A15.86,15.86,0,0,0,156.69,64H44.28A16,16,0,0,0,31,71.12L1.34,115.56A8.07,8.07,0,0,0,0,120v48a16,16,0,0,0,16,16H33a32,32,0,0,0,62,0h66a32,32,0,0,0,62,0h17a16,16,0,0,0,16-16V128A16,16,0,0,0,240,112ZM44.28,80H156.69l32,32H23ZM64,192a16,16,0,1,1,16-16A16,16,0,0,1,64,192Zm128,0a16,16,0,1,1,16-16A16,16,0,0,1,192,192Zm48-24H223a32,32,0,0,0-62,0H95a32,32,0,0,0-62,0H16V128H240Z%22/%3E%3C/svg%3E")}
.ph-caret-right{--i:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20256%20256%22%20fill=%22currentColor%22%3E%3Cpath%20d=%22M181.66,133.66l-80,80a8,8,0,0,1-11.32-11.32L164.69,128,90.34,53.66a8,8,0,0,1,11.32-11.32l80,80A8,8,0,0,1,181.66,133.66Z%22/%3E%3C/svg%3E")}
.ph-chat-text{--i:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20256%20256%22%20fill=%22currentColor%22%3E%3Cpath%20d=%22M216,48H40A16,16,0,0,0,24,64V224a15.85,15.85,0,0,0,9.24,14.5A16.13,16.13,0,0,0,40,240a15.89,15.89,0,0,0,10.25-3.78l.09-.07L83,208H216a16,16,0,0,0,16-16V64A16,16,0,0,0,216,48ZM40,224h0ZM216,192H80a8,8,0,0,0-5.23,1.95L40,224V64H216ZM88,112a8,8,0,0,1,8-8h64a8,8,0,0,1,0,16H96A8,8,0,0,1,88,112Zm0,32a8,8,0,0,1,8-8h64a8,8,0,1,1,0,16H96A8,8,0,0,1,88,144Z%22/%3E%3C/svg%3E")}
.ph-check-circle{--i:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20256%20256%22%20fill=%22currentColor%22%3E%3Cpath%20d=%22M173.66,98.34a8,8,0,0,1,0,11.32l-56,56a8,8,0,0,1-11.32,0l-24-24a8,8,0,0,1,11.32-11.32L112,148.69l50.34-50.35A8,8,0,0,1,173.66,98.34ZM232,128A104,104,0,1,1,128,24,104.11,104.11,0,0,1,232,128Zm-16,0a88,88,0,1,0-88,88A88.1,88.1,0,0,0,216,128Z%22/%3E%3C/svg%3E")}
.ph-check{--i:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20256%20256%22%20fill=%22currentColor%22%3E%3Cpath%20d=%22M229.66,77.66l-128,128a8,8,0,0,1-11.32,0l-56-56a8,8,0,0,1,11.32-11.32L96,188.69,218.34,66.34a8,8,0,0,1,11.32,11.32Z%22/%3E%3C/svg%3E")}
.ph-clock{--i:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20256%20256%22%20fill=%22currentColor%22%3E%3Cpath%20d=%22M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24Zm0,192a88,88,0,1,1,88-88A88.1,88.1,0,0,1,128,216Zm64-88a8,8,0,0,1-8,8H128a8,8,0,0,1-8-8V72a8,8,0,0,1,16,0v48h48A8,8,0,0,1,192,128Z%22/%3E%3C/svg%3E")}
.ph-credit-card{--i:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20256%20256%22%20fill=%22currentColor%22%3E%3Cpath%20d=%22M224,48H32A16,16,0,0,0,16,64V192a16,16,0,0,0,16,16H224a16,16,0,0,0,16-16V64A16,16,0,0,0,224,48Zm0,16V88H32V64Zm0,128H32V104H224v88Zm-16-24a8,8,0,0,1-8,8H168a8,8,0,0,1,0-16h32A8,8,0,0,1,208,168Zm-64,0a8,8,0,0,1-8,8H120a8,8,0,0,1,0-16h16A8,8,0,0,1,144,168Z%22/%3E%3C/svg%3E")}
.ph-engine{--i:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20256%20256%22%20fill=%22currentColor%22%3E%3Cpath%20d=%22M240,104H227.31L192,68.69A15.86,15.86,0,0,0,180.69,64H140V40h24a8,8,0,0,0,0-16H100a8,8,0,0,0,0,16h24V64H64A16,16,0,0,0,48,80v52H24V108a8,8,0,0,0-16,0v64a8,8,0,0,0,16,0V148H48v20.69A15.86,15.86,0,0,0,52.69,180L92,219.31A15.86,15.86,0,0,0,103.31,224h77.38A15.86,15.86,0,0,0,192,219.31L227.31,184H240a16,16,0,0,0,16-16V120A16,16,0,0,0,240,104Zm0,64H224a8,8,0,0,0-5.66,2.34L180.69,208H103.31L64,168.69V80H180.69l37.65,37.66A8,8,0,0,0,224,120h16Z%22/%3E%3C/svg%3E")}
.ph-envelope-simple{--i:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20256%20256%22%20fill=%22currentColor%22%3E%3Cpath%20d=%22M224,48H32a8,8,0,0,0-8,8V192a16,16,0,0,0,16,16H216a16,16,0,0,0,16-16V56A8,8,0,0,0,224,48ZM203.43,64,128,133.15,52.57,64ZM216,192H40V74.19l82.59,75.71a8,8,0,0,0,10.82,0L216,74.19V192Z%22/%3E%3C/svg%3E")}
.ph-file-text{--i:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20256%20256%22%20fill=%22currentColor%22%3E%3Cpath%20d=%22M213.66,82.34l-56-56A8,8,0,0,0,152,24H56A16,16,0,0,0,40,40V216a16,16,0,0,0,16,16H200a16,16,0,0,0,16-16V88A8,8,0,0,0,213.66,82.34ZM160,51.31,188.69,80H160ZM200,216H56V40h88V88a8,8,0,0,0,8,8h48V216Zm-32-80a8,8,0,0,1-8,8H96a8,8,0,0,1,0-16h64A8,8,0,0,1,168,136Zm0,32a8,8,0,0,1-8,8H96a8,8,0,0,1,0-16h64A8,8,0,0,1,168,168Z%22/%3E%3C/svg%3E")}
.ph-gear-six{--i:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20256%20256%22%20fill=%22currentColor%22%3E%3Cpath%20d=%22M128,80a48,48,0,1,0,48,48A48.05,48.05,0,0,0,128,80Zm0,80a32,32,0,1,1,32-32A32,32,0,0,1,128,160Zm109.94-52.79a8,8,0,0,0-3.89-5.4l-29.83-17-.12-33.62a8,8,0,0,0-2.83-6.08,111.91,111.91,0,0,0-36.72-20.67,8,8,0,0,0-6.46.59L128,41.85,97.88,25a8,8,0,0,0-6.47-.6A112.1,112.1,0,0,0,54.73,45.15a8,8,0,0,0-2.83,6.07l-.15,33.65-29.83,17a8,8,0,0,0-3.89,5.4,106.47,106.47,0,0,0,0,41.56,8,8,0,0,0,3.89,5.4l29.83,17,.12,33.62a8,8,0,0,0,2.83,6.08,111.91,111.91,0,0,0,36.72,20.67,8,8,0,0,0,6.46-.59L128,214.15,158.12,231a7.91,7.91,0,0,0,3.9,1,8.09,8.09,0,0,0,2.57-.42,112.1,112.1,0,0,0,36.68-20.73,8,8,0,0,0,2.83-6.07l.15-33.65,29.83-17a8,8,0,0,0,3.89-5.4A106.47,106.47,0,0,0,237.94,107.21Zm-15,34.91-28.57,16.25a8,8,0,0,0-3,3c-.58,1-1.19,2.06-1.81,3.06a7.94,7.94,0,0,0-1.22,4.21l-.15,32.25a95.89,95.89,0,0,1-25.37,14.3L134,199.13a8,8,0,0,0-3.91-1h-.19c-1.21,0-2.43,0-3.64,0a8.08,8.08,0,0,0-4.1,1l-28.84,16.1A96,96,0,0,1,67.88,201l-.11-32.2a8,8,0,0,0-1.22-4.22c-.62-1-1.23-2-1.8-3.06a8.09,8.09,0,0,0-3-3.06l-28.6-16.29a90.49,90.49,0,0,1,0-28.26L61.67,97.63a8,8,0,0,0,3-3c.58-1,1.19-2.06,1.81-3.06a7.94,7.94,0,0,0,1.22-4.21l.15-32.25a95.89,95.89,0,0,1,25.37-14.3L122,56.87a8,8,0,0,0,4.1,1c1.21,0,2.43,0,3.64,0a8.08,8.08,0,0,0,4.1-1l28.84-16.1A96,96,0,0,1,188.12,55l.11,32.2a8,8,0,0,0,1.22,4.22c.62,1,1.23,2,1.8,3.06a8.09,8.09,0,0,0,3,3.06l28.6,16.29A90.49,90.49,0,0,1,222.9,142.12Z%22/%3E%3C/svg%3E")}
.ph-key{--i:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20256%20256%22%20fill=%22currentColor%22%3E%3Cpath%20d=%22M216.57,39.43A80,80,0,0,0,83.91,120.78L28.69,176A15.86,15.86,0,0,0,24,187.31V216a16,16,0,0,0,16,16H72a8,8,0,0,0,8-8V208H96a8,8,0,0,0,8-8V184h16a8,8,0,0,0,5.66-2.34l9.56-9.57A79.73,79.73,0,0,0,160,176h.1A80,80,0,0,0,216.57,39.43ZM224,98.1c-1.09,34.09-29.75,61.86-63.89,61.9H160a63.7,63.7,0,0,1-23.65-4.51,8,8,0,0,0-8.84,1.68L116.69,168H96a8,8,0,0,0-8,8v16H72a8,8,0,0,0-8,8v16H40V187.31l58.83-58.82a8,8,0,0,0,1.68-8.84A63.72,63.72,0,0,1,96,95.92c0-34.14,27.81-62.8,61.9-63.89A64,64,0,0,1,224,98.1ZM192,76a12,12,0,1,1-12-12A12,12,0,0,1,192,76Z%22/%3E%3C/svg%3E")}
.ph-magnifying-glass{--i:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20256%20256%22%20fill=%22currentColor%22%3E%3Cpath%20d=%22M229.66,218.34l-50.07-50.06a88.11,88.11,0,1,0-11.31,11.31l50.06,50.07a8,8,0,0,0,11.32-11.32ZM40,112a72,72,0,1,1,72,72A72.08,72.08,0,0,1,40,112Z%22/%3E%3C/svg%3E")}
.ph-map-pin{--i:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20256%20256%22%20fill=%22currentColor%22%3E%3Cpath%20d=%22M128,64a40,40,0,1,0,40,40A40,40,0,0,0,128,64Zm0,64a24,24,0,1,1,24-24A24,24,0,0,1,128,128Zm0-112a88.1,88.1,0,0,0-88,88c0,31.4,14.51,64.68,42,96.25a254.19,254.19,0,0,0,41.45,38.3,8,8,0,0,0,9.18,0A254.19,254.19,0,0,0,174,200.25c27.45-31.57,42-64.85,42-96.25A88.1,88.1,0,0,0,128,16Zm0,206c-16.53-13-72-60.75-72-118a72,72,0,0,1,144,0C200,161.23,144.53,209,128,222Z%22/%3E%3C/svg%3E")}
.ph-medal{--i:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20256%20256%22%20fill=%22currentColor%22%3E%3Cpath%20d=%22M216,96A88,88,0,1,0,72,163.83V240a8,8,0,0,0,11.58,7.16L128,225l44.43,22.21A8.07,8.07,0,0,0,176,248a8,8,0,0,0,8-8V163.83A87.85,87.85,0,0,0,216,96ZM56,96a72,72,0,1,1,72,72A72.08,72.08,0,0,1,56,96ZM168,227.06l-36.43-18.21a8,8,0,0,0-7.16,0L88,227.06V174.37a87.89,87.89,0,0,0,80,0ZM128,152A56,56,0,1,0,72,96,56.06,56.06,0,0,0,128,152Zm0-96A40,40,0,1,1,88,96,40,40,0,0,1,128,56Z%22/%3E%3C/svg%3E")}
.ph-paper-plane-tilt{--i:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20256%20256%22%20fill=%22currentColor%22%3E%3Cpath%20d=%22M227.32,28.68a16,16,0,0,0-15.66-4.08l-.15,0L19.57,82.84a16,16,0,0,0-2.49,29.8L102,154l41.3,84.87A15.86,15.86,0,0,0,157.74,248q.69,0,1.38-.06a15.88,15.88,0,0,0,14-11.51l58.2-191.94c0-.05,0-.1,0-.15A16,16,0,0,0,227.32,28.68ZM157.83,231.85l-.05.14,0-.07-40.06-82.3,48-48a8,8,0,0,0-11.31-11.31l-48,48L24.08,98.25l-.07,0,.14,0L216,40Z%22/%3E%3C/svg%3E")}
.ph-phone{--i:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20256%20256%22%20fill=%22currentColor%22%3E%3Cpath%20d=%22M222.37,158.46l-47.11-21.11-.13-.06a16,16,0,0,0-15.17,1.4,8.12,8.12,0,0,0-.75.56L134.87,160c-15.42-7.49-31.34-23.29-38.83-38.51l20.78-24.71c.2-.25.39-.5.57-.77a16,16,0,0,0,1.32-15.06l0-.12L97.54,33.64a16,16,0,0,0-16.62-9.52A56.26,56.26,0,0,0,32,80c0,79.4,64.6,144,144,144a56.26,56.26,0,0,0,55.88-48.92A16,16,0,0,0,222.37,158.46ZM176,208A128.14,128.14,0,0,1,48,80,40.2,40.2,0,0,1,82.87,40a.61.61,0,0,0,0,.12l21,47L83.2,111.86a6.13,6.13,0,0,0-.57.77,16,16,0,0,0-1,15.7c9.06,18.53,27.73,37.06,46.46,46.11a16,16,0,0,0,15.75-1.14,8.44,8.44,0,0,0,.74-.56L168.89,152l47,21.05h0s.08,0,.11,0A40.21,40.21,0,0,1,176,208Z%22/%3E%3C/svg%3E")}
.ph-plus{--i:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20256%20256%22%20fill=%22currentColor%22%3E%3Cpath%20d=%22M224,128a8,8,0,0,1-8,8H136v80a8,8,0,0,1-16,0V136H40a8,8,0,0,1,0-16h80V40a8,8,0,0,1,16,0v80h80A8,8,0,0,1,224,128Z%22/%3E%3C/svg%3E")}
.ph-shield-check{--i:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20256%20256%22%20fill=%22currentColor%22%3E%3Cpath%20d=%22M208,40H48A16,16,0,0,0,32,56v56c0,52.72,25.52,84.67,46.93,102.19,23.06,18.86,46,25.26,47,25.53a8,8,0,0,0,4.2,0c1-.27,23.91-6.67,47-25.53C198.48,196.67,224,164.72,224,112V56A16,16,0,0,0,208,40Zm0,72c0,37.07-13.66,67.16-40.6,89.42A129.3,129.3,0,0,1,128,223.62a128.25,128.25,0,0,1-38.92-21.81C61.82,179.51,48,149.3,48,112l0-56,160,0ZM82.34,141.66a8,8,0,0,1,11.32-11.32L112,148.69l50.34-50.35a8,8,0,0,1,11.32,11.32l-56,56a8,8,0,0,1-11.32,0Z%22/%3E%3C/svg%3E")}
.ph-snowflake{--i:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20256%20256%22%20fill=%22currentColor%22%3E%3Cpath%20d=%22M223.77,150.09a8,8,0,0,1-5.86,9.68l-24.64,6,6.46,24.11a8,8,0,0,1-5.66,9.8A8.25,8.25,0,0,1,192,200a8,8,0,0,1-7.72-5.93l-7.72-28.8L136,141.86v46.83l21.66,21.65a8,8,0,0,1-11.32,11.32L128,203.31l-18.34,18.35a8,8,0,0,1-11.32-11.32L120,188.69V141.86L79.45,165.27l-7.72,28.8A8,8,0,0,1,64,200a8.25,8.25,0,0,1-2.08-.27,8,8,0,0,1-5.66-9.8l6.46-24.11-24.64-6a8,8,0,0,1,3.82-15.54l29.45,7.23L112,128,71.36,104.54l-29.45,7.23A7.85,7.85,0,0,1,40,112a8,8,0,0,1-1.91-15.77l24.64-6L56.27,66.07a8,8,0,0,1,15.46-4.14l7.72,28.8L120,114.14V67.31L98.34,45.66a8,8,0,0,1,11.32-11.32L128,52.69l18.34-18.35a8,8,0,0,1,11.32,11.32L136,67.31v46.83l40.55-23.41,7.72-28.8a8,8,0,0,1,15.46,4.14l-6.46,24.11,24.64,6A8,8,0,0,1,216,112a7.85,7.85,0,0,1-1.91-.23l-29.45-7.23L144,128l40.64,23.46,29.45-7.23A8,8,0,0,1,223.77,150.09Z%22/%3E%3C/svg%3E")}
.ph-sparkle{--i:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20256%20256%22%20fill=%22currentColor%22%3E%3Cpath%20d=%22M197.58,129.06,146,110l-19-51.62a15.92,15.92,0,0,0-29.88,0L78,110l-51.62,19a15.92,15.92,0,0,0,0,29.88L78,178l19,51.62a15.92,15.92,0,0,0,29.88,0L146,178l51.62-19a15.92,15.92,0,0,0,0-29.88ZM137,164.22a8,8,0,0,0-4.74,4.74L112,223.85,91.78,169A8,8,0,0,0,87,164.22L32.15,144,87,123.78A8,8,0,0,0,91.78,119L112,64.15,132.22,119a8,8,0,0,0,4.74,4.74L191.85,144ZM144,40a8,8,0,0,1,8-8h16V16a8,8,0,0,1,16,0V32h16a8,8,0,0,1,0,16H184V64a8,8,0,0,1-16,0V48H152A8,8,0,0,1,144,40ZM248,88a8,8,0,0,1-8,8h-8v8a8,8,0,0,1-16,0V96h-8a8,8,0,0,1,0-16h8V72a8,8,0,0,1,16,0v8h8A8,8,0,0,1,248,88Z%22/%3E%3C/svg%3E")}
.ph-fill.ph-star{--i:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20256%20256%22%20fill=%22currentColor%22%3E%3Cpath%20d=%22M234.29,114.85l-45,38.83L203,211.75a16.4,16.4,0,0,1-24.5,17.82L128,198.49,77.47,229.57A16.4,16.4,0,0,1,53,211.75l13.76-58.07-45-38.83A16.46,16.46,0,0,1,31.08,86l59-4.76,22.76-55.08a16.36,16.36,0,0,1,30.27,0l22.75,55.08,59,4.76a16.46,16.46,0,0,1,9.37,28.86Z%22/%3E%3C/svg%3E")}
.ph-stop-circle{--i:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20256%20256%22%20fill=%22currentColor%22%3E%3Cpath%20d=%22M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24Zm0,192a88,88,0,1,1,88-88A88.1,88.1,0,0,1,128,216ZM160,88H96a8,8,0,0,0-8,8v64a8,8,0,0,0,8,8h64a8,8,0,0,0,8-8V96A8,8,0,0,0,160,88Zm-8,64H104V104h48Z%22/%3E%3C/svg%3E")}
.ph-tire{--i:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20256%20256%22%20fill=%22currentColor%22%3E%3Cpath%20d=%22M149.26,159.26C155.09,173.82,163.5,176,168,176s12.91-2.18,18.74-16.74c3.39-8.48,5.26-19.58,5.26-31.26s-1.87-22.78-5.26-31.26C180.91,82.18,172.5,80,168,80s-12.91,2.18-18.74,16.74C145.87,105.22,144,116.32,144,128S145.87,150.78,149.26,159.26ZM168,96.2c2.62,2.06,8,13,8,31.8s-5.38,29.74-8,31.8c-2.62-2.06-8-13-8-31.8S165.38,98.26,168,96.2ZM232,216H196.41C213.12,197.73,224,165.47,224,128c0-58.32-26.35-104-60-104H92C58.35,24,32,69.68,32,128S58.35,232,92,232H232a8,8,0,0,0,0-16ZM193.74,63.93C202.93,80.91,208,103.67,208,128s-5.07,47.09-14.26,64.07C185.38,207.5,174.82,216,164,216s-21.38-8.5-29.74-23.93C125.07,175.09,120,152.33,120,128s5.07-47.09,14.26-64.07C142.62,48.5,153.18,40,164,40S185.38,48.5,193.74,63.93ZM48,128c0-2.5.07-5,.17-7.44L80,97.83l24.43,17.45c-.28,4.16-.43,8.41-.43,12.72a179.89,179.89,0,0,0,3.07,33.5l-22.42-16a8,8,0,0,0-9.3,0l-23.74,17A161,161,0,0,1,48,128ZM62.26,63.93C70.62,48.5,81.18,40,92,40h39.59c-11.9,13-20.84,33.12-25,57.16L84.65,81.49a8,8,0,0,0-9.3,0L50.49,99.25C52.85,86,56.83,74,62.26,63.93Zm0,128.14a100.08,100.08,0,0,1-5.94-13.32L80,161.83l33.94,24.24c4.6,12,10.6,22.22,17.65,29.93H92C81.18,216,70.62,207.5,62.26,192.07Z%22/%3E%3C/svg%3E")}
.ph-user{--i:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20256%20256%22%20fill=%22currentColor%22%3E%3Cpath%20d=%22M230.92,212c-15.23-26.33-38.7-45.21-66.09-54.16a72,72,0,1,0-73.66,0C63.78,166.78,40.31,185.66,25.08,212a8,8,0,1,0,13.85,8c18.84-32.56,52.14-52,89.07-52s70.23,19.44,89.07,52a8,8,0,1,0,13.85-8ZM72,96a56,56,0,1,1,56,56A56.06,56.06,0,0,1,72,96Z%22/%3E%3C/svg%3E")}
.ph-users-three{--i:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20256%20256%22%20fill=%22currentColor%22%3E%3Cpath%20d=%22M244.8,150.4a8,8,0,0,1-11.2-1.6A51.6,51.6,0,0,0,192,128a8,8,0,0,1-7.37-4.89,8,8,0,0,1,0-6.22A8,8,0,0,1,192,112a24,24,0,1,0-23.24-30,8,8,0,1,1-15.5-4A40,40,0,1,1,219,117.51a67.94,67.94,0,0,1,27.43,21.68A8,8,0,0,1,244.8,150.4ZM190.92,212a8,8,0,1,1-13.84,8,57,57,0,0,0-98.16,0,8,8,0,1,1-13.84-8,72.06,72.06,0,0,1,33.74-29.92,48,48,0,1,1,58.36,0A72.06,72.06,0,0,1,190.92,212ZM128,176a32,32,0,1,0-32-32A32,32,0,0,0,128,176ZM72,120a8,8,0,0,0-8-8A24,24,0,1,1,87.24,82a8,8,0,1,0,15.5-4A40,40,0,1,0,37,117.51,67.94,67.94,0,0,0,9.6,139.19a8,8,0,1,0,12.8,9.61A51.6,51.6,0,0,1,64,128,8,8,0,0,0,72,120Z%22/%3E%3C/svg%3E")}
.ph-wrench{--i:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20256%20256%22%20fill=%22currentColor%22%3E%3Cpath%20d=%22M226.76,69a8,8,0,0,0-12.84-2.88l-40.3,37.19-17.23-3.7-3.7-17.23,37.19-40.3A8,8,0,0,0,187,29.24,72,72,0,0,0,88,96,72.34,72.34,0,0,0,94,124.94L33.79,177c-.15.12-.29.26-.43.39a32,32,0,0,0,45.26,45.26c.13-.13.27-.28.39-.42L131.06,162A72,72,0,0,0,232,96,71.56,71.56,0,0,0,226.76,69ZM160,152a56.14,56.14,0,0,1-27.07-7,8,8,0,0,0-9.92,1.77L67.11,211.51a16,16,0,0,1-22.62-22.62L109.18,133a8,8,0,0,0,1.77-9.93,56,56,0,0,1,58.36-82.31l-31.2,33.81a8,8,0,0,0-1.94,7.1L141.83,108a8,8,0,0,0,6.14,6.14l26.35,5.66a8,8,0,0,0,7.1-1.94l33.81-31.2A56.06,56.06,0,0,1,160,152Z%22/%3E%3C/svg%3E")}

:root {
  --bg: #0B0D11;
  --bg-2: #101318;
  --surface: #151920;
  --surface-2: #1C2129;
  --line: rgba(236, 238, 241, .09);
  --line-2: rgba(236, 238, 241, .18);
  --text: #ECEEF1;
  --muted: #A0A7B2;
  --dim: #6E7682;
  --accent: #1769FF;
  --accent-hover: #3D83FF;
  --accent-text: #4D8BFF;
  --accent-ink: #FFFFFF;
  --accent-soft: rgba(23, 105, 255, .14);
  --chrome: linear-gradient(180deg, #F4F5F7 0%, #B9BEC6 55%, #8A9099 100%);

  --r-sm: 10px;
  --r: 18px;
  --r-pill: 999px;

  --font-display: "Unbounded", "Arial Black", system-ui, sans-serif;
  --font-body: "Geist", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "Geist Mono", ui-monospace, monospace;

  --header-h: 72px;
  --gutter: clamp(1rem, 4vw, 3rem);
  --ease-out: cubic-bezier(.16, 1, .3, 1);

  --z-header: 50;
  --z-menu: 60;
  --z-grain: 70;
  color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html {
  -webkit-text-size-adjust: 100%;
  scroll-padding-top: calc(var(--header-h) + 24px);
  background: var(--bg);
}
html:not(.lenis) { scroll-behavior: smooth; }

body {
  font-family: var(--font-body);
  font-size: 1.0625rem;
  line-height: 1.65;
  color: var(--text);
  background: var(--bg);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

/* Grain fixe, jamais sur un conteneur qui défile */
body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: var(--z-grain);
  pointer-events: none;
  opacity: .05;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
ul, ol { list-style: none; }
button { font: inherit; color: inherit; cursor: pointer; background: none; border: 0; }
::selection { background: var(--accent); color: var(--accent-ink); }

:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
  border-radius: 6px;
}

h1, h2, h3, h4 {
  font-family: var(--font-display);
  font-weight: 600;
  line-height: 1.06;
  letter-spacing: -.035em;
  text-wrap: balance;
}
h1 { font-size: clamp(2.2rem, 5.4vw, 4.6rem); }
h2 { font-size: clamp(1.75rem, 3.6vw, 3.1rem); }
h3 { font-size: clamp(1.1rem, 1.6vw, 1.35rem); letter-spacing: -.02em; line-height: 1.2; }
h4 { font-size: .95rem; letter-spacing: -.01em; }
p { text-wrap: pretty; }

.accent { color: var(--accent); }
.muted { color: var(--muted); }

.container {
  width: min(1320px, 100% - var(--gutter) * 2);
  margin-inline: auto;
}

.section { padding-block: clamp(5rem, 11vw, 9.5rem) clamp(5.5rem, 12vw, 10.5rem); position: relative; }
.section--tight { padding-block: clamp(3.5rem, 7vw, 6rem); }
.section--raised { background: var(--bg-2); }

.section-title { max-width: 18ch; }
.section-title--wide { max-width: 24ch; }
.lede { color: var(--muted); font-size: clamp(1.05rem, 1.3vw, 1.2rem); max-width: 56ch; margin-top: 1.25rem; }

.label {
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  font-family: var(--font-mono);
  font-size: .78rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--muted);
}
.label--accent { color: var(--accent-text); }

.skip-link {
  position: absolute;
  left: 1rem;
  top: -100px;
  z-index: 100;
  padding: .75rem 1.25rem;
  background: var(--accent);
  color: var(--accent-ink);
  border-radius: var(--r-sm);
  font-weight: 600;
}
.skip-link:focus { top: 1rem; }

.ph { line-height: 1; }

/* ---------- Boutons ---------- */
.btn {
  --pad-y: 1rem;
  --pad-x: 1.6rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .7rem;
  padding: var(--pad-y) var(--pad-x);
  border-radius: var(--r-pill);
  border: 1px solid transparent;
  font-size: .98rem;
  font-weight: 600;
  white-space: nowrap;
  transition: background-color .3s var(--ease-out), border-color .3s var(--ease-out), color .3s var(--ease-out), transform .3s var(--ease-out);
}
.btn:active { transform: scale(.97); }
.btn .ph { font-size: 1.15em; transition: transform .35s var(--ease-out); }
.btn:hover .ph-arrow-right, .btn:hover .ph-arrow-up-right { transform: translateX(3px); }
.btn--primary { background: var(--accent); color: var(--accent-ink); }
.btn--primary:hover { background: var(--accent-hover); }
.btn--ghost { border-color: var(--line-2); color: var(--text); background: rgba(255, 255, 255, .02); }
.btn--ghost:hover { border-color: var(--text); background: rgba(255, 255, 255, .06); }
.btn--sm { --pad-y: .62rem; --pad-x: 1.1rem; font-size: .9rem; }
.btn[disabled] { opacity: .6; pointer-events: none; }

.link-arrow {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  font-weight: 600;
  color: var(--text);
  border-bottom: 1px solid var(--line-2);
  padding-bottom: .2rem;
  transition: color .3s var(--ease-out), border-color .3s var(--ease-out), gap .3s var(--ease-out);
}
.link-arrow:hover { color: var(--accent); border-color: var(--accent); gap: .8rem; }

/* ---------- Statut d'ouverture (calculé en JS) ---------- */
.open-status {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  font-family: var(--font-mono);
  font-size: .8rem;
  letter-spacing: .04em;
  color: var(--muted);
}
.open-status::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--dim);
  flex: none;
}
.open-status.is-open::before { background: #3DD68C; box-shadow: 0 0 0 4px rgba(61, 214, 140, .15); }
.open-status.is-closed::before { background: var(--accent); }

/* ============ HEADER ============ */
.site-header {
  position: fixed;
  inset: 0 0 auto;
  z-index: var(--z-header);
  height: var(--header-h);
  transition: background-color .4s var(--ease-out), border-color .4s var(--ease-out), transform .45s var(--ease-out);
  border-bottom: 1px solid transparent;
}
.site-header.scrolled {
  background: rgba(11, 13, 17, .72);
  backdrop-filter: blur(18px) saturate(160%);
  -webkit-backdrop-filter: blur(18px) saturate(160%);
  border-bottom-color: var(--line);
}
.site-header.hidden { transform: translateY(-100%); }
.site-header .container {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
}
.nav-logo { display: flex; align-items: center; flex: none; }
.nav-logo img { height: 56px; width: auto; }

.main-nav { display: flex; align-items: center; gap: .25rem; }
.nav-link {
  position: relative;
  padding: .5rem .85rem;
  font-size: .94rem;
  font-weight: 500;
  color: var(--muted);
  border-radius: var(--r-pill);
  transition: color .25s ease, background-color .25s ease;
}
.nav-link:hover { color: var(--text); background: rgba(255, 255, 255, .05); }
.nav-link.active { color: var(--text); }
.nav-link.active::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: .15rem;
  width: 4px;
  height: 4px;
  margin-left: -2px;
  border-radius: 50%;
  background: var(--accent);
}
.nav-end { display: flex; align-items: center; gap: 1.1rem; }
.nav-phone { display: inline-flex; align-items: center; gap: .45rem; font-weight: 600; font-size: .94rem; }
.nav-phone .ph { color: var(--accent); font-size: 1.1rem; }

.nav-toggle {
  display: none;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  border: 1px solid var(--line-2);
  position: relative;
  z-index: calc(var(--z-menu) + 1);
}
.nav-toggle span {
  position: absolute;
  left: 14px;
  right: 14px;
  height: 1.5px;
  background: var(--text);
  transition: transform .4s var(--ease-out), top .4s var(--ease-out);
}
.nav-toggle span:nth-child(1) { top: 19px; }
.nav-toggle span:nth-child(2) { top: 26px; }
.menu-open .nav-toggle span:nth-child(1) { top: 22.5px; transform: rotate(45deg); }
.menu-open .nav-toggle span:nth-child(2) { top: 22.5px; transform: rotate(-45deg); }

.mobile-menu {
  position: fixed;
  inset: 0;
  z-index: var(--z-menu);
  background: var(--bg);
  padding: calc(var(--header-h) + 2rem) var(--gutter) 2rem;
  display: flex;
  flex-direction: column;
  gap: .25rem;
  clip-path: inset(0 0 100% 0);
  visibility: hidden;
  transition: clip-path .6s var(--ease-out), visibility 0s linear .6s;
  overflow-y: auto;
}
.mobile-menu.open { clip-path: inset(0 0 0 0); visibility: visible; transition: clip-path .6s var(--ease-out); }
.mobile-menu > a {
  font-family: var(--font-display);
  font-size: clamp(1.05rem, 4.6vw, 1.35rem);
  font-weight: 500;
  letter-spacing: -.02em;
  padding: .8rem 0;
  border-bottom: 1px solid var(--line);
  opacity: 0;
  transform: translateY(16px);
  transition: opacity .4s ease, transform .5s var(--ease-out), color .2s ease;
}
.mobile-menu.open > a { opacity: 1; transform: none; }
.mobile-menu > a:hover { color: var(--accent); }
.mobile-menu-foot { margin-top: auto; padding-top: 2rem; display: grid; gap: 1rem; }
.mobile-menu-foot a { color: var(--muted); }
body.menu-open { overflow: hidden; }
/* Le bouton (croix) vit dans l'en-tête : l'en-tête doit passer au-dessus du menu ouvert */
.menu-open .site-header {
  z-index: calc(var(--z-menu) + 1);
  background: transparent;
  border-bottom-color: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

/* ============ HERO (accueil) ============ */
.hero {
  position: relative;
  min-height: 100dvh;
  display: flex;
  align-items: flex-end;
  padding: calc(var(--header-h) + 3rem) 0 clamp(3rem, 7vw, 5.5rem);
  overflow: hidden;
  isolation: isolate;
}
.hero-media { position: absolute; inset: 0; z-index: -1; }
/* Calée en haut : l'enseigne du garage reste visible sur les écrans larges */
.hero-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 12%;
  transform-origin: 50% 0%;
}
.hero-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(11, 13, 17, .7) 0%, rgba(11, 13, 17, 0) 18%),
    linear-gradient(90deg, rgba(11, 13, 17, .92) 0%, rgba(11, 13, 17, .6) 40%, rgba(11, 13, 17, .05) 75%),
    linear-gradient(0deg, var(--bg) 0%, rgba(11, 13, 17, 0) 38%);
}
.hero-content { max-width: 880px; }
.hero h1 { margin-top: 0; }
.hero-kicker { display: block; margin-bottom: 1.4rem; font-family: var(--font-mono); font-size: .82rem; font-weight: 500; letter-spacing: .1em; line-height: 1.4; text-transform: uppercase; color: var(--text); text-shadow: 0 1px 12px rgba(11, 13, 17, .8); }
.hero h1 .line { display: block; overflow: hidden; padding-bottom: .06em; }
.hero h1 .line > span { display: inline-block; }
.hero-sub { margin-top: 1.5rem; color: var(--muted); font-size: clamp(1.05rem, 1.35vw, 1.22rem); max-width: 46ch; }
.hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.75rem; margin-top: 2.25rem; }

/* ============ BANDEAU INFOS ============ */
.infobar { border-block: 1px solid var(--line); }
.infobar .container {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}
.info-item {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
  padding: 1.75rem 1.5rem 1.75rem 0;
}
.info-item + .info-item { padding-left: 1.5rem; border-left: 1px solid var(--line); }
.info-item .ph { font-size: 1.5rem; color: var(--accent); margin-top: .15rem; }
.info-item strong { display: block; font-weight: 600; }
.info-item span { color: var(--muted); font-size: .94rem; }
.info-item a:hover { color: var(--accent); }
.info-item .open-status { display: flex; margin-top: .45rem; font-size: .78rem; }

/* ============ SERVICES : DÉFILEMENT HORIZONTAL ============ */
.hscroll { overflow: hidden; }
@media (min-width: 768px) {
  /* Section épinglée : tout doit tenir dans l'écran */
  .hscroll {
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-block: calc(var(--header-h) + 1.5rem) 2.5rem;
  }
}
.hscroll-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 2rem;
  flex-wrap: wrap;
  margin-bottom: clamp(2.5rem, 5vw, 4rem);
}
.hscroll-progress {
  width: 180px;
  height: 2px;
  background: var(--line);
  border-radius: 2px;
  overflow: hidden;
}
.hscroll-progress span { display: block; height: 100%; background: var(--accent); transform-origin: left; transform: scaleX(0); }
.hscroll-track {
  display: flex;
  gap: 1.25rem;
  padding-inline: max(var(--gutter), (100vw - 1320px) / 2);
  width: max-content;
}
.svc-card {
  width: clamp(280px, 26vw, 360px);
  flex: none;
  display: flex;
  flex-direction: column;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r);
  padding: .65rem;
  transition: border-color .4s var(--ease-out), background-color .4s var(--ease-out);
}
.svc-card:hover { border-color: var(--line-2); background: var(--surface-2); }
.svc-media { border-radius: calc(var(--r) - 6px); overflow: hidden; aspect-ratio: 16 / 10; background: var(--surface-2); }
.svc-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .9s var(--ease-out); }
.svc-card:hover .svc-media img { transform: scale(1.06); }
.svc-body { padding: 1.4rem .85rem .9rem; display: flex; flex-direction: column; flex: 1; }
.svc-tag { font-family: var(--font-mono); font-size: .75rem; letter-spacing: .1em; text-transform: uppercase; color: var(--accent-text); margin-bottom: .6rem; }
.svc-body p { color: var(--muted); font-size: .97rem; margin-top: .65rem; }
.svc-body .link-arrow { margin-top: auto; align-self: flex-start; }
.svc-body p + .link-arrow { margin-top: 1.5rem; }
.svc-card--end {
  justify-content: space-between;
  background: var(--accent);
  border-color: var(--accent);
  color: var(--accent-ink);
  padding: 2rem;
}
.svc-card--end:hover { background: var(--accent-hover); border-color: var(--accent-hover); }
.svc-card--end h3 { font-size: clamp(1.5rem, 2.2vw, 2rem); }
.svc-card--end .ph { font-size: 3rem; align-self: flex-end; transition: transform .5s var(--ease-out); }
.svc-card--end:hover .ph { transform: translate(6px, -6px); }

/* ============ CLIMATISATION (mise en avant) ============ */
.feature {
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  gap: clamp(2.5rem, 6vw, 6rem);
  align-items: center;
}
.feature-media { position: relative; border-radius: var(--r); overflow: hidden; aspect-ratio: 5 / 4; }
.feature-media img { width: 100%; height: 115%; object-fit: cover; }
/* Affiche avec texte intégré : affichée entière, sans recadrage */
.feature-media--poster { aspect-ratio: 1402 / 958; }
.feature-media--poster img { height: 100%; }
.feature-caption { margin-top: .8rem; font-size: .82rem; color: var(--dim); }
.feature h2 { margin-top: 1rem; }
.checks { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem 1.5rem; margin: 2rem 0 2.5rem; }
.checks li { display: flex; gap: .7rem; align-items: flex-start; font-size: .97rem; }
.checks .ph { color: var(--accent); font-size: 1.15rem; margin-top: .2rem; flex: none; }

/* ============ LE GARAGE : BENTO ============ */
.bento {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-auto-rows: minmax(220px, auto);
  gap: 1rem;
  margin-top: clamp(2.5rem, 5vw, 4rem);
}
.tile {
  position: relative;
  border-radius: var(--r);
  background: var(--surface);
  border: 1px solid var(--line);
  padding: clamp(1.5rem, 2.4vw, 2.2rem);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  isolation: isolate;
}
.tile h3 { margin-bottom: .5rem; }
.tile p { color: var(--muted); font-size: .97rem; max-width: 42ch; }
.tile .ph-tile { font-size: 2rem; color: var(--accent); margin-bottom: auto; padding-bottom: 2rem; }
.tile--photo { border: 0; }
.tile--photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; transition: transform 1.2s var(--ease-out); }
.tile--photo::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, rgba(11, 13, 17, .92) 10%, rgba(11, 13, 17, .25) 70%); }
.tile--photo:hover img { transform: scale(1.05); }
.tile--photo p { color: rgba(236, 238, 241, .8); }
.tile--accent { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
.tile--accent p { color: rgba(255, 255, 255, .85); }
.tile--accent .ph-tile { color: var(--accent-ink); }
.tile--chrome { background: radial-gradient(120% 90% at 100% 0%, rgba(23, 105, 255, .2), transparent 60%), var(--surface); }
.tile .stat-num {
  max-width: none;
  font-family: var(--font-display);
  font-size: clamp(3.5rem, 7vw, 6rem);
  font-weight: 600;
  letter-spacing: -.05em;
  line-height: .95;
  background: var(--chrome);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  margin-bottom: auto;
  font-variant-numeric: tabular-nums;
}
.t-a { grid-column: span 7; grid-row: span 2; }
.t-b { grid-column: span 5; }
.t-c { grid-column: span 5; }
.t-d { grid-column: span 4; }
.t-e { grid-column: span 4; }
.t-f { grid-column: span 4; }
.tile-link { position: absolute; inset: 0; z-index: 2; border-radius: inherit; }

/* ============ ÉTAPES ============ */
.steps { margin-top: clamp(3rem, 6vw, 5rem); position: relative; }
.steps-line { position: absolute; left: 0; right: 0; top: 23px; height: 1px; background: var(--line-2); }
.steps-line span { position: absolute; inset: 0; background: var(--accent); transform-origin: left; transform: scaleX(0); }
.steps-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2rem; position: relative; }
.step-dot {
  width: 47px;
  height: 47px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--bg);
  border: 1px solid var(--line-2);
  font-size: 1.3rem;
  color: var(--muted);
  transition: background-color .4s var(--ease-out), color .4s var(--ease-out), border-color .4s var(--ease-out);
}
.step.is-active .step-dot { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
.step h3 { margin-top: 1.6rem; }
.step p { color: var(--muted); margin-top: .6rem; font-size: .97rem; max-width: 28ch; }

/* ============ RÉALISATIONS : MOSAÏQUE ============ */
/* Colonnes décalées : les photos d'origine (≈390px) restent nettes */
.mosaic {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 1rem;
  align-items: start;
}
.mosaic--full { grid-template-columns: repeat(4, 1fr); row-gap: 2.5rem; }
.shot:nth-child(even) { margin-top: clamp(2rem, 5vw, 4.5rem); }
.mosaic--full .shot:nth-child(even) { margin-top: 0; }
.mosaic--full .shot:nth-child(4n + 2), .mosaic--full .shot:nth-child(4n + 4) { margin-top: clamp(2rem, 5vw, 4.5rem); }
.shot-img { border-radius: var(--r); overflow: hidden; aspect-ratio: 3 / 4; background: var(--surface); }
.shot img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.85); transition: filter .6s var(--ease-out), transform .9s var(--ease-out); }
.shot:hover img { filter: saturate(1.05); transform: scale(1.05); }
.shot figcaption { margin-top: .9rem; font-weight: 600; font-size: .95rem; }
.mosaic-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 2rem; flex-wrap: wrap; margin-bottom: clamp(2.5rem, 5vw, 4rem); }

/* ============ AVIS ============ */
.reviews-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 2rem; flex-wrap: wrap; margin-bottom: clamp(2.5rem, 5vw, 4rem); }
.rating { display: flex; align-items: center; gap: 1rem; }
.rating-stars { color: var(--accent); display: flex; gap: 2px; font-size: 1.1rem; }
.reviews-wall { columns: 2; column-gap: 1rem; }
.review {
  break-inside: avoid;
  margin-bottom: 1rem;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r);
  padding: clamp(1.6rem, 3vw, 2.4rem);
}
.review:nth-child(1) { background: var(--surface-2); }
.review .rating-stars { margin-bottom: 1.2rem; font-size: 1rem; }
.review blockquote { font-size: clamp(1.08rem, 1.5vw, 1.3rem); line-height: 1.5; letter-spacing: -.01em; }
.review:nth-child(1) blockquote { font-family: var(--font-display); font-size: clamp(1.25rem, 2vw, 1.75rem); line-height: 1.3; letter-spacing: -.03em; font-weight: 500; }
.review-author { display: flex; align-items: center; gap: .9rem; margin-top: 1.6rem; }
.review-avatar {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: var(--accent-soft);
  color: var(--accent);
  font-family: var(--font-mono);
  font-size: .85rem;
  font-weight: 500;
}
.review-author strong { display: block; font-weight: 600; font-size: .97rem; }
.review-author span { color: var(--muted); font-size: .86rem; }

/* ============ FAQ ============ */
.faq { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(2.5rem, 6vw, 6rem); align-items: start; }
.faq-side { position: sticky; top: calc(var(--header-h) + 2rem); }
.faq-side .btn { margin-top: 2rem; }
.faq-list { border-top: 1px solid var(--line); }
.faq-item { border-bottom: 1px solid var(--line); }
.faq-item summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  padding: 1.6rem 0;
  font-size: clamp(1.02rem, 1.4vw, 1.18rem);
  font-weight: 600;
  transition: color .25s ease;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary:hover { color: var(--accent); }
.faq-icon {
  flex: none;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid var(--line-2);
  display: grid;
  place-items: center;
  transition: transform .45s var(--ease-out), background-color .3s ease, color .3s ease, border-color .3s ease;
}
.faq-item[open] .faq-icon { transform: rotate(45deg); background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
.faq-answer { overflow: hidden; }
.faq-answer p { color: var(--muted); padding-bottom: 1.7rem; max-width: 62ch; }

/* ============ CTA FINAL ============ */
.cta-final { position: relative; overflow: hidden; isolation: isolate; text-align: left; }
.cta-final .cta-bg { position: absolute; inset: 0; z-index: -1; }
.cta-final .cta-bg img { width: 100%; height: 100%; object-fit: cover; opacity: .28; }
.cta-final .cta-bg::after { content: ""; position: absolute; inset: 0; background: radial-gradient(80% 120% at 20% 50%, rgba(11, 13, 17, .6), var(--bg) 85%); }
.cta-final h2 { font-size: clamp(2.2rem, 6vw, 5.4rem); max-width: 14ch; }
.cta-final p { color: var(--muted); margin-top: 1.4rem; font-size: 1.15rem; max-width: 48ch; }
.cta-actions { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 2.5rem; }

/* ============ FOOTER ============ */
.site-footer { border-top: 1px solid var(--line); padding: clamp(4rem, 8vw, 6rem) 0 2rem; background: var(--bg); }
.footer-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 3rem; }
.footer-brand img { height: 96px; width: auto; }
.footer-brand p { color: var(--muted); margin-top: 1.25rem; max-width: 38ch; font-size: .95rem; }
.footer-col h4 { font-family: var(--font-mono); font-weight: 400; font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; color: var(--dim); margin-bottom: 1.2rem; }
.footer-col li + li { margin-top: .6rem; }
.footer-col a { color: var(--muted); transition: color .2s ease; }
.footer-col a:hover { color: var(--text); }
.footer-contact li { display: flex; gap: .7rem; color: var(--muted); }
.footer-contact .ph { color: var(--accent); margin-top: .3rem; }
.footer-bottom {
  margin-top: clamp(3rem, 6vw, 5rem);
  padding-top: 1.5rem;
  border-top: 1px solid var(--line);
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  color: var(--dim);
  font-size: .88rem;
}
.footer-legal { display: flex; gap: 1.5rem; }
.footer-credit { color: var(--dim); }
.footer-credit a { color: var(--muted); text-decoration: underline; text-decoration-color: var(--line-2); text-underline-offset: 3px; transition: color .2s ease, text-decoration-color .2s ease; }
.footer-credit a:hover { color: var(--text); text-decoration-color: var(--accent); }
.footer-legal a:hover { color: var(--text); }
.footer-word {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: clamp(2.5rem, 10.5vw, 10rem);
  letter-spacing: -.06em;
  line-height: .85;
  margin-top: clamp(3rem, 6vw, 5rem);
  background: linear-gradient(180deg, rgba(236, 238, 241, .14), rgba(236, 238, 241, 0));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  white-space: nowrap;
  user-select: none;
}

/* ============ HERO DES PAGES INTERNES ============ */
.page-hero {
  position: relative;
  padding: calc(var(--header-h) + clamp(4rem, 9vw, 7rem)) 0 clamp(3.5rem, 7vw, 5.5rem);
  overflow: hidden;
  isolation: isolate;
  border-bottom: 1px solid var(--line);
}
.page-hero-bg { position: absolute; inset: 0; z-index: -1; }
.page-hero-bg img { width: 100%; height: 100%; object-fit: cover; opacity: .32; }
.page-hero-bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, var(--bg) 15%, rgba(11, 13, 17, .55) 100%), linear-gradient(0deg, var(--bg), transparent 60%); }
.page-hero h1 { max-width: 16ch; margin-top: 1.5rem; }
.page-hero .lede { margin-top: 1.5rem; }
.breadcrumb { display: flex; align-items: center; gap: .6rem; font-family: var(--font-mono); font-size: .8rem; letter-spacing: .06em; color: var(--dim); }
.breadcrumb a { color: var(--muted); }
.breadcrumb a:hover { color: var(--accent); }
.breadcrumb .ph { font-size: .8rem; }

/* ============ PAGE SERVICES : INDEX COLLANT ============ */
.svc-layout { display: grid; grid-template-columns: 280px 1fr; gap: clamp(2.5rem, 6vw, 6rem); align-items: start; }
.svc-index { position: sticky; top: calc(var(--header-h) + 2rem); }
.svc-index ol { counter-reset: s; border-left: 1px solid var(--line); }
.svc-index a {
  display: block;
  padding: .55rem 0 .55rem 1.25rem;
  margin-left: -1px;
  border-left: 1px solid transparent;
  color: var(--dim);
  font-size: .95rem;
  transition: color .25s ease, border-color .25s ease;
}
.svc-index a:hover { color: var(--text); }
.svc-index a.is-active { color: var(--text); border-left-color: var(--accent); }
.svc-index .btn { margin-top: 2rem; }
.svc-detail {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: clamp(1.75rem, 4vw, 3.5rem);
  align-items: start;
  padding-bottom: clamp(3rem, 6vw, 5rem);
  margin-bottom: clamp(3rem, 6vw, 5rem);
  border-bottom: 1px solid var(--line);
}
.svc-detail:last-child { border-bottom: 0; margin-bottom: 0; padding-bottom: 0; }
.svc-detail-media { border-radius: var(--r); overflow: hidden; aspect-ratio: 4 / 5; background: var(--surface); max-width: 400px; }
.svc-detail-media img { width: 100%; height: 100%; object-fit: cover; }
.svc-detail .label { margin-bottom: .8rem; }
.svc-detail h2 { font-size: clamp(1.5rem, 2.4vw, 2.1rem); }
.svc-detail p { color: var(--muted); margin-top: 1rem; }
.svc-detail .checks { grid-template-columns: 1fr; margin: 0 0 2rem; }
.svc-note { font-size: .82rem; color: var(--dim); margin-top: .8rem; }

/* ============ PAGE LE GARAGE ============ */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2.5rem, 6vw, 6rem); align-items: center; }
.split-media { position: relative; }
.split-media .main { border-radius: var(--r); overflow: hidden; aspect-ratio: 4 / 5; }
.split-media .main img { width: 100%; height: 115%; object-fit: cover; }
.split-media .float {
  position: absolute;
  right: -2rem;
  bottom: -2rem;
  width: 46%;
  border-radius: var(--r);
  overflow: hidden;
  border: 6px solid var(--bg);
  aspect-ratio: 1;
}
.split-media .float img { width: 100%; height: 100%; object-fit: cover; }
.split-text p { color: var(--muted); margin-top: 1.1rem; }
.split-text h2 { margin-bottom: .5rem; }
.feature-list { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin: 2.2rem 0 2.5rem; }
.feature-list li { display: flex; align-items: center; gap: .8rem; padding: 1rem 1.1rem; border-radius: var(--r-sm); background: var(--surface); border: 1px solid var(--line); font-weight: 500; font-size: .95rem; }
.feature-list .ph { color: var(--accent); font-size: 1.3rem; }

.values { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 1rem; margin-top: clamp(2.5rem, 5vw, 4rem); }
.values .tile { min-height: 280px; }

.visit { display: grid; grid-template-columns: 1fr 1.1fr; gap: clamp(2rem, 5vw, 4.5rem); align-items: stretch; }
.visit-list { margin: 2rem 0 2.5rem; display: grid; gap: 1.1rem; }
.visit-list li { display: flex; gap: 1rem; align-items: flex-start; }
.visit-list .ph { color: var(--accent); font-size: 1.35rem; margin-top: .1rem; }
.visit-list small { display: block; font-family: var(--font-mono); font-size: .75rem; letter-spacing: .1em; text-transform: uppercase; color: var(--dim); }
.visit-list a:hover { color: var(--accent); }
.map {
  border-radius: var(--r);
  overflow: hidden;
  border: 1px solid var(--line);
  min-height: 380px;
  background: var(--surface);
}
.map-consent { height: 100%; min-height: inherit; display: grid; place-content: center; justify-items: center; gap: 1rem; text-align: center; padding: 2rem 1.5rem; }
.map-consent > .ph { font-size: 2.2rem; color: var(--accent-text); }
.map-consent p { color: var(--muted); font-size: .92rem; max-width: 38ch; }
.map iframe { width: 100%; height: 100%; min-height: 380px; border: 0; display: block; filter: grayscale(1) invert(.92) contrast(.85) hue-rotate(180deg); }

/* ============ CONTACT ============ */
.contact-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: clamp(2rem, 5vw, 4.5rem); align-items: start; }
.contact-card {
  position: sticky;
  top: calc(var(--header-h) + 1.5rem);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r);
  padding: clamp(1.5rem, 3vw, 2.25rem);
}
.contact-card h2 { font-size: 1.35rem; letter-spacing: -.02em; margin-bottom: .5rem; }
.contact-card .visit-list { margin: 1.5rem 0; }
.contact-card .map, .contact-card .map iframe { min-height: 240px; }

.devis-form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.35rem 1.25rem;
  background: var(--bg-2);
  border: 1px solid var(--line);
  border-radius: var(--r);
  padding: clamp(1.5rem, 3.5vw, 2.75rem);
}
.form-head { grid-column: 1 / -1; margin-bottom: .5rem; }
.form-head h2 { font-size: clamp(1.4rem, 2.4vw, 2rem); }
.form-head p { color: var(--muted); margin-top: .6rem; }
.form-field { display: flex; flex-direction: column; gap: .5rem; }
.form-field--full { grid-column: 1 / -1; }
.form-field label { font-size: .9rem; font-weight: 500; color: var(--text); }
.req { color: var(--accent); }
.form-field input, .form-field select, .form-field textarea {
  width: 100%;
  font: inherit;
  font-size: 1rem;
  color: var(--text);
  background: var(--surface);
  border: 1px solid var(--line-2);
  border-radius: var(--r-sm);
  padding: .9rem 1rem;
  transition: border-color .25s ease, background-color .25s ease, box-shadow .25s ease;
}
.form-field select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 256 256'%3E%3Cpath fill='%23A0A7B2' d='M213.66 101.66l-80 80a8 8 0 0 1-11.32 0l-80-80a8 8 0 0 1 11.32-11.32L128 164.69l74.34-74.35a8 8 0 0 1 11.32 11.32Z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 1rem center;
  padding-right: 2.75rem;
}
.form-field select option { background: var(--surface); color: var(--text); }
.form-field textarea { min-height: 150px; resize: vertical; }
.form-field input::placeholder, .form-field textarea::placeholder { color: var(--dim); }
.form-field input:hover, .form-field select:hover, .form-field textarea:hover { border-color: rgba(236, 238, 241, .3); }
.form-field input:focus, .form-field select:focus, .form-field textarea:focus { outline: none; border-color: var(--accent); background: var(--surface-2); box-shadow: 0 0 0 4px var(--accent-soft); }
.form-field.prefilled select { border-color: var(--accent); }
.field-error { font-size: .85rem; color: #FF8A7A; min-height: 0; display: none; }
.form-field.invalid .field-error { display: block; }
.form-field.invalid input, .form-field.invalid select, .form-field.invalid textarea { border-color: #FF8A7A; }
.form-honeypot { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.form-consent { grid-column: 1 / -1; display: flex; gap: .8rem; align-items: flex-start; font-size: .9rem; color: var(--muted); cursor: pointer; }
.form-consent input { width: 20px; height: 20px; margin-top: .15rem; accent-color: var(--accent); flex: none; }
.form-consent a { color: var(--text); text-decoration: underline; text-underline-offset: 3px; }
.form-status { grid-column: 1 / -1; display: none; padding: 1rem 1.2rem; border-radius: var(--r-sm); font-size: .95rem; }
.form-status.success { display: block; background: rgba(61, 214, 140, .1); border: 1px solid rgba(61, 214, 140, .35); color: #9AF0C4; }
.form-status.error { display: block; background: rgba(255, 138, 122, .08); border: 1px solid rgba(255, 138, 122, .35); color: #FFB3A8; }
.btn-submit { width: 100%; }

/* ============ PAIEMENT EN PLUSIEURS FOIS (Oney) ============ */
.pay {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: clamp(1.5rem, 4vw, 3.5rem);
  padding: clamp(1.75rem, 4vw, 3rem);
  border: 1px solid var(--line-2);
  border-radius: var(--r);
  background: radial-gradient(90% 140% at 0% 0%, rgba(23, 105, 255, .22), transparent 60%), var(--surface);
}
.pay-icon { width: 76px; height: 76px; border-radius: 20px; display: grid; place-items: center; background: var(--accent); color: var(--accent-ink); font-size: 2.2rem; }
.pay-text h2 { font-size: clamp(1.5rem, 2.8vw, 2.3rem); max-width: 22ch; }
.pay-text .lede { max-width: 58ch; margin-top: .9rem; }
.pay-legal { margin-top: .9rem; font-size: .85rem; color: var(--dim); }
.pay-actions { display: flex; flex-direction: column; align-items: flex-start; gap: 1.1rem; }

/* ============ DEMANDE DE DEVIS : FORMULAIRE EN 4 ÉTAPES ============ */
[hidden] { display: none !important; }
.wz { max-width: 860px; }
.wz-head { background: var(--bg-2); border: 1px solid var(--line); border-radius: var(--r); padding: 1.5rem clamp(1rem, 3vw, 2rem) 1.25rem; margin-bottom: 1rem; }
.wz-steps { display: flex; margin-bottom: 1.1rem; }
.wz-step { position: relative; flex: 1; display: flex; flex-direction: column; align-items: center; gap: .5rem; }
.wz-step:not(:last-child)::after { content: ""; position: absolute; top: 18px; left: calc(50% + 24px); width: calc(100% - 48px); height: 1px; background: var(--line-2); transition: background-color .4s var(--ease-out); }
.wz-step.is-done:not(:last-child)::after { background: var(--accent); }
.wz-dot { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; border: 1px solid var(--line-2); background: var(--bg-2); font-family: var(--font-mono); font-size: .85rem; color: var(--muted); position: relative; z-index: 1; transition: background-color .3s var(--ease-out), border-color .3s var(--ease-out), color .3s var(--ease-out); }
.wz-label { font-family: var(--font-mono); font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; color: var(--dim); transition: color .3s ease; }
.wz-step.is-active .wz-dot { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
.wz-step.is-active .wz-label { color: var(--text); }
.wz-step.is-done .wz-dot { border-color: var(--accent); background: var(--accent-soft); color: var(--accent-text); }
.wz-step.is-done .wz-label { color: var(--muted); }
.wz-bar { height: 3px; background: var(--line); border-radius: 3px; overflow: hidden; }
.wz-bar span { display: block; height: 100%; background: var(--accent); transition: width .5s var(--ease-out); }

.wz-form { background: var(--bg-2); border: 1px solid var(--line); border-radius: var(--r); padding: clamp(1.5rem, 4vw, 2.75rem); }
.js .wz-panel:not(.is-active) { display: none; }
.wz-panel.is-active { animation: wz-in .45s var(--ease-out) both; }
@keyframes wz-in { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.wz-panel h2 { font-size: clamp(1.5rem, 2.6vw, 2.1rem); outline: none; }
.wz-sub { color: var(--muted); margin: .6rem 0 2rem; }

.wz-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.35rem 1.25rem; }
.wz-grid--3 { grid-template-columns: repeat(3, 1fr); }
.wz-field--full { grid-column: 1 / -1; }
.wz-stack { display: grid; gap: 1.6rem; margin-top: 2rem; padding-top: 2rem; border-top: 1px solid var(--line); }
.wz-indent { margin-left: 2rem; display: grid; gap: 1rem; }
.wz-hint { font-size: .82rem; color: var(--dim); }
.wz-other { margin-top: .5rem; }
.wz-plate { text-transform: uppercase; letter-spacing: .12em; }
.wz-field, fieldset.wz-field { border: 0; min-width: 0; display: flex; flex-direction: column; gap: .6rem; }
.wz-field legend { font-size: .9rem; font-weight: 500; padding: 0; margin-bottom: .6rem; }
.wz-section { border: 1px solid var(--line); border-radius: var(--r-sm); padding: 1.25rem; background: var(--surface); }
.wz-section .form-field { margin-top: 1.1rem; }
.wz-box { background: var(--accent-soft); border: 1px solid rgba(23, 105, 255, .35); border-radius: var(--r-sm); padding: .9rem 1.1rem; font-size: .92rem; }
.wz-tag { display: inline-block; margin-left: .5rem; padding: .1rem .55rem; border-radius: 6px; background: var(--accent-soft); color: var(--accent-text); font-size: .78rem; font-weight: 600; }

/* Boutons radio présentés comme un sélecteur segmenté */
.wz-seg { display: flex; gap: .6rem; flex-wrap: wrap; }
.wz-seg label { flex: 1 1 120px; display: block; cursor: pointer; }
.wz-seg input, .wz-svc input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.wz-seg span { display: block; text-align: center; padding: .85rem 1rem; border: 1px solid var(--line-2); border-radius: var(--r-sm); background: var(--surface); font-weight: 600; font-size: .95rem; transition: background-color .25s var(--ease-out), border-color .25s var(--ease-out), color .25s var(--ease-out); }
.wz-seg label:hover span { border-color: var(--text); }
.wz-seg input:checked + span { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
.wz-seg input:focus-visible + span, .wz-svc input:focus-visible + .wz-svc-body { outline: 2px solid var(--accent); outline-offset: 3px; }

/* Cartes de prestation (cases à cocher) */
.wz-svc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: .75rem; }
.wz-svc { display: block; cursor: pointer; position: relative; }
.wz-svc-body { display: flex; flex-direction: column; gap: .2rem; height: 100%; padding: 1.15rem 1.1rem; border: 1px solid var(--line-2); border-radius: var(--r-sm); background: var(--surface); transition: border-color .25s var(--ease-out), background-color .25s var(--ease-out); }
.wz-svc-body .ph { font-size: 1.6rem; color: var(--accent-text); margin-bottom: .45rem; }
.wz-svc-body strong { font-weight: 600; font-size: .98rem; line-height: 1.25; }
.wz-svc-body small { color: var(--muted); font-size: .85rem; line-height: 1.4; }
.wz-svc:hover .wz-svc-body { border-color: var(--text); }
.wz-svc input:checked + .wz-svc-body { border-color: var(--accent); background: var(--accent-soft); }
.wz-svc-error { margin-top: .8rem; }

/* Détail d'une prestation : cases cochées par défaut, à décocher */
.wz-sub-list { display: grid; gap: .8rem; margin-top: .8rem; }
.wz-detail { border: 1px solid rgba(23, 105, 255, .4); border-radius: var(--r-sm); background: var(--accent-soft); padding: 1.1rem 1.25rem 1.25rem; min-width: 0; animation: wz-in .35s var(--ease-out) both; }
.wz-detail legend { padding: 0 .5rem; font-family: var(--font-mono); font-size: .75rem; letter-spacing: .1em; text-transform: uppercase; color: var(--accent-text); }
.wz-detail .wz-hint { margin: .1rem 0 .9rem; }
.wz-sub-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: .5rem; }
.wz-sub-check { position: relative; display: flex; align-items: center; gap: .65rem; padding: .55rem .7rem; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); cursor: pointer; font-size: .9rem; transition: border-color .2s ease; }
.wz-sub-check:hover { border-color: var(--line-2); }
.wz-sub-check input { appearance: none; -webkit-appearance: none; flex: none; width: 18px; height: 18px; margin: 0; border: 1px solid var(--line-2); border-radius: 5px; background: var(--bg-2); display: grid; place-items: center; cursor: pointer; transition: background-color .2s ease, border-color .2s ease; }
.wz-sub-check input::after { content: ""; width: 9px; height: 5px; border-left: 2px solid var(--accent-ink); border-bottom: 2px solid var(--accent-ink); transform: rotate(-45deg) translate(1px, -1px); opacity: 0; }
.wz-sub-check input:checked { background: var(--accent); border-color: var(--accent); }
.wz-sub-check input:checked::after { opacity: 1; }
.wz-sub-check input:not(:checked) + span { color: var(--dim); text-decoration: line-through; }
.wz-sub-check input:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.wz-recap-block dd { white-space: pre-line; }

.wz-nav { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-top: 2.5rem; }
.wz-note { text-align: right; color: var(--dim); font-size: .85rem; margin-top: 1rem; }
.wz-consent { margin-top: 1.5rem; }

/* Récapitulatif */
.wz-recap { display: grid; gap: .9rem; }
.wz-recap-block { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-sm); overflow: hidden; }
.wz-recap-block h3 { display: flex; align-items: center; gap: .6rem; padding: .8rem 1.1rem; font-family: var(--font-mono); font-size: .75rem; font-weight: 400; letter-spacing: .12em; text-transform: uppercase; color: var(--accent-text); background: var(--surface-2); border-bottom: 1px solid var(--line); }
.wz-recap-block dl { padding: .6rem 1.1rem 1rem; display: grid; gap: .55rem; }
.wz-recap-block dl > div { display: grid; grid-template-columns: 160px 1fr; gap: 1rem; font-size: .95rem; }
.wz-recap-block dt { color: var(--muted); }
.wz-recap-block dd { font-weight: 500; overflow-wrap: anywhere; }
.wz-recap-block dd.is-empty { color: var(--dim); font-weight: 400; }

.wz-done { text-align: center; background: var(--bg-2); border: 1px solid var(--line); border-radius: var(--r); padding: clamp(2.5rem, 7vw, 4.5rem) 1.5rem; }
.wz-done > .ph { font-size: 3.5rem; color: var(--accent-text); }
.wz-done h2 { margin-top: 1rem; font-size: clamp(1.6rem, 3vw, 2.3rem); outline: none; }
.wz-done p { color: var(--muted); margin: .8rem 0 2rem; }

/* ============ PAGES LÉGALES ============ */
.legal-content { max-width: 760px; }
.legal-content h2 { font-size: clamp(1.25rem, 2vw, 1.6rem); margin: 3rem 0 1rem; }
.legal-content h2:first-child { margin-top: 0; }
.legal-content p, .legal-content li { color: var(--muted); margin-top: .8rem; }
.legal-content ul { list-style: disc; padding-left: 1.25rem; }
.legal-content a { color: var(--text); text-decoration: underline; text-underline-offset: 3px; }
.legal-content strong { color: var(--text); }
.placeholder-note { padding: 1rem 1.2rem; border-radius: var(--r-sm); border: 1px dashed rgba(23, 105, 255, .55); background: var(--accent-soft); color: var(--text) !important; }

/* ============ 404 / redirection ============ */
.center-page { min-height: 80dvh; display: grid; place-items: center; text-align: center; padding: 8rem var(--gutter) 4rem; }

/* ============ RESPONSIVE ============ */
@media (max-width: 1180px) {
  .main-nav, .nav-phone { display: none; }
  .nav-toggle { display: block; }
  .nav-end .btn { display: none; }
}

@media (max-width: 1024px) {
  .infobar .container { grid-template-columns: 1fr 1fr; }
  .info-item:nth-child(3) { padding-left: 0; border-left: 0; }
  .info-item:nth-child(n + 3) { border-top: 1px solid var(--line); }
  .feature, .split, .visit, .contact-grid, .faq { grid-template-columns: 1fr; }
  .pay { grid-template-columns: 1fr; }
  .pay-icon { width: 64px; height: 64px; font-size: 1.9rem; }
  .pay-actions { flex-direction: row; flex-wrap: wrap; align-items: center; }
  .faq-side, .contact-card, .svc-index { position: static; }
  .t-a { grid-column: span 12; grid-row: span 1; min-height: 380px; }
  .t-b, .t-c { grid-column: span 6; }
  .t-d, .t-e, .t-f { grid-column: span 6; }
  .t-f { grid-column: span 12; }
  .steps-grid { grid-template-columns: 1fr 1fr; row-gap: 3rem; }
  .steps-line { display: none; }
  .svc-layout { grid-template-columns: 1fr; }
  .svc-index { display: none; }
  .values { grid-template-columns: 1fr 1fr; }
  .values .tile:first-child { grid-column: span 2; }
  .split-media .float { right: 1rem; }
  .wz-grid--3 { grid-template-columns: 1fr 1fr; }
  .mosaic { grid-template-columns: repeat(3, 1fr); }
  .mosaic:not(.mosaic--full) .shot:nth-child(n + 4) { display: none; }
  .mosaic--full { grid-template-columns: repeat(3, 1fr); }
  .mosaic--full .shot:nth-child(n) { margin-top: 0; }
  .mosaic--full .shot:nth-child(3n + 2) { margin-top: clamp(2rem, 5vw, 4.5rem); }
}

@media (max-width: 767px) {
  body { font-size: 1rem; }
  .hero-media::after { background: linear-gradient(180deg, rgba(11, 13, 17, .55) 0%, rgba(11, 13, 17, .35) 30%, rgba(11, 13, 17, .85) 60%, var(--bg) 92%); }
  .hero-media img { object-position: 62% 30%; }
  .hero-actions .btn { width: 100%; }
  .infobar .container { grid-template-columns: 1fr; }
  .info-item, .info-item + .info-item { padding: 1.25rem 0; border-left: 0; }
  .info-item + .info-item { border-top: 1px solid var(--line); }
  .hscroll-track { width: auto; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 1rem; scrollbar-width: none; }
  .hscroll-track::-webkit-scrollbar { display: none; }
  .svc-card { width: 82vw; scroll-snap-align: center; }
  .hscroll-progress { display: none; }
  .checks, .feature-list, .svc-detail-grid { grid-template-columns: 1fr; }
  .bento { grid-auto-rows: auto; }
  .t-a, .t-b, .t-c, .t-d, .t-e, .t-f { grid-column: span 12; min-height: 220px; }
  .t-a { min-height: 340px; }
  .steps-grid { grid-template-columns: 1fr; }
  .mosaic, .mosaic--full { grid-template-columns: 1fr 1fr; row-gap: 1.75rem; }
  .mosaic .shot:nth-child(n) { margin-top: 0; }
  .mosaic .shot:nth-child(even) { transform: translateY(2rem); }
  .mosaic:not(.mosaic--full) .shot:nth-child(4) { display: block; }
  .svc-detail { grid-template-columns: 1fr; }
  .svc-detail-media { max-width: none; aspect-ratio: 4 / 3; }
  .reviews-wall { columns: 1; }
  .values { grid-template-columns: 1fr; }
  .values .tile:first-child { grid-column: auto; }
  .footer-grid { grid-template-columns: 1fr; gap: 2.5rem; }
  .devis-form { grid-template-columns: 1fr; }
  .wz-grid, .wz-grid--3 { grid-template-columns: 1fr; }
  .wz-label { font-size: .62rem; letter-spacing: .04em; }
  .wz-nav .btn { flex: 1; }
  .wz-nav > span { display: none; }
  .wz-indent { margin-left: 0; }
  .wz-recap-block dl > div { grid-template-columns: 1fr; gap: .1rem; }
  .wz-note { text-align: center; }
  .split-media .float { display: none; }
  .split-media .main { aspect-ratio: 4 / 3; }
  .svc-detail-media { aspect-ratio: 4 / 3; }
  .cta-actions .btn { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
  html { scroll-behavior: auto !important; }
}