:root {
--primary-color: #165baf;
--secondary-color: #27ae60;
--primary-texte: #165BAF;
--secondary-texte: #19713E;
--primary-fg: #FFFFFF;
--primary-bouton: #165BAF;
--secondary-fg: #141A21;
--hero-fg: #FFFFFF;
--primary-clair: #8BADD7;
--dark-color: #2C3E50;
--gray-dark: #616A6B;
--light-bg: #F8F9FA;
--primary-light: #D5F4E6;
--shadow: 0 2px 10px rgba(0,0,0,0.1);
--transition: all 0.3s ease;
--btn-radius: 12px;
--card-radius: 14px;
--hero-gradient: linear-gradient(var(--accent), var(--accent));
--cta-gradient: linear-gradient(var(--accent), var(--accent));
--dark-color: #1C1C1E;
--ink: #1C1C1E;
--ink-2: #3A3A3F;
--paper: #FBF8F4;
--line: #D8D0C4;
--accent: #14529E;
--accent-soft: color-mix(in srgb, var(--accent) 10%, #FFFFFF);
--cta-bg: var(--accent);
--primary-texte: var(--accent);
}
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
color: var(--dark-color);
line-height: 1.6;
background: #FFFFFF;
}
.container {
max-width: 1200px;
margin: 0 auto;
padding: 0 20px;
}
.site-header {
background: white;
box-shadow: var(--shadow);
padding: 15px 0;
position: sticky;
top: 0;
z-index: 1000;
}
.site-header .container {
display: flex;
justify-content: space-between;
align-items: center;
}
.site-logo img {
height: 50px;
width: auto;
}
.site-nav a {
color: var(--dark-color);
text-decoration: none;
padding: 10px 20px;
border-radius: 5px;
transition: var(--transition);
font-weight: 600;
}
.site-nav a:hover {
background: var(--primary-light);
color: var(--primary-texte);
}
body {
color: var(--ink);
-webkit-text-size-adjust: 100%;
text-rendering: optimizeSpeed;
}
h1, h2, h3 {
letter-spacing: -0.02em;
line-height: 1.2;
}
.site-header {
box-shadow: none;
border-bottom: 1px solid var(--line);
padding: 8px 0;
}
.site-logo img {
height: 40px;
}
.site-nav {
display: flex;
align-items: center;
gap: 4px;
}
.site-nav a {
padding: 10px 14px;
border-radius: var(--btn-radius);
transition: background-color .15s;
}
.site-nav a:hover {
background: var(--light-bg);
color: var(--ink);
}
.site-nav a.open-devis-modal:hover {
background: var(--ink) !important;
color: #FFF;
}
.fiche-num {
display: none;
}
.breadcrumbs {
background: var(--light-bg);
padding: 15px 0;
margin-bottom: 30px;
}
.breadcrumbs ul {
list-style: none;
display: flex;
gap: 10px;
flex-wrap: wrap;
}
.breadcrumbs li:not(:last-child)::after {
content: "›";
margin-left: 10px;
color: var(--gray-dark);
}
.breadcrumbs a {
color: var(--primary-texte);
text-decoration: none;
}
.breadcrumbs a:hover {
text-decoration: underline;
}
.section {
padding: 40px 0;
}
.n1bugu h2 {
color: var(--primary-texte);
font-size: 2rem;
margin-top: 50px;
margin-bottom: 25px;
padding-bottom: 15px;
color: var(--ink);
font-size: 1.6rem;
border-bottom: none;
padding-bottom: 0;
}
.n1bugu h2:first-child {
margin-top: 40px;
}
.n1bugu h3 {
color: var(--secondary-texte);
font-size: 1.5rem;
margin-top: 35px;
margin-bottom: 20px;
color: var(--ink);
font-size: 1.25rem;
padding-left: 0;
border-left: none;
}
.n1bugu p {
line-height: 1.8;
margin-bottom: 25px;
}
.n1bugu p.intro,
.n1bugu p.highlight {
font-size: 1.1rem;
padding: 25px;
margin-bottom: 30px;
background: var(--tint);
border: none;
border-radius: var(--card-radius);
color: var(--ink);
}
.n1bugu p.cta {
font-size: 1.1rem;
font-weight: 600;
color: var(--secondary-texte);
margin-bottom: 30px;
}
.n1bugu p.subtitle {
font-weight: 600;
margin-bottom: 15px;
}
.n1bugu ul,
.n1bugu ol {
margin-bottom: 30px;
padding-left: 20px;
}
.n1bugu ul li,
.n1bugu ol li {
margin-bottom: 15px;
padding-left: 10px;
line-height: 1.7;
}
.n1bugu ul li strong,
.n1bugu ol li strong {
color: var(--primary-texte);
}
@media (max-width: 768px) {
.n1bugu h2 {
font-size: 1.5rem;
margin-top: 35px;
margin-bottom: 20px;
}
.n1bugu h2:first-child {
margin-top: 25px;
}
.n1bugu h3 {
font-size: 1.25rem;
margin-top: 25px;
}
.n1bugu p.intro,
.n1bugu p.highlight {
font-size: 1rem;
padding: 20px;
}
.n1bugu p.cta {
font-size: 1rem;
}
.container {
padding: 0 15px;
}
.site-header .container {
flex-direction: column;
gap: 15px;
}
.hero-region h1,
.hero-departement h1,
.hero-ville h1 {
font-size: 1.5rem !important;
margin-bottom: 20px !important;
line-height: 1.3 !important;
}
.hero-region,
.hero-departement,
.hero-ville {
padding: 40px 0 !important;
}
.hero-region .cta-button,
.hero-departement .cta-button,
.hero-ville .cta-button {
font-size: 1.1rem !important;
padding: 15px 30px !important;
}
.hero-region p,
.hero-departement p,
.hero-ville p {
font-size: 0.9rem !important;
}
.section h1 {
font-size: 1.75rem !important;
line-height: 1.3 !important;
}
.section p {
font-size: 1rem !important;
}
.section > .container > div > div {
padding: 25px 20px !important;
}
.section.dpe-block > .container > div > div {
padding: 0 !important;
}
#searchForm > div {
position: relative !important;
}
#searchInput {
padding: 15px 20px !important;
font-size: 1rem !important;
margin-bottom: 10px !important;
}
#searchForm button[type="submit"] {
position: static !important;
transform: none !important;
width: 100% !important;
padding: 15px 25px !important;
border-radius: 50px !important;
margin-top: 10px !important;
}
#searchForm button[type="submit"]:hover {
transform: scale(1.02) !important;
}
}
body.mhh1z9 .hero-ville,
body.mhh1z9 .hero-departement,
body.mhh1z9 .hero-region {
background: var(--hero-gradient) !important;
text-align: left !important;
padding: 70px 0 !important;
}
body.mhh1z9 .hero-ville h1,
body.mhh1z9 .hero-departement h1,
body.mhh1z9 .hero-region h1 {
font-size: 2.6rem !important;
letter-spacing: -0.02em;
}
body.mhh1z9 .cta-button {
border-radius: var(--btn-radius) !important;
box-shadow: none !important;
border: 2px solid white !important;
}
body.mhh1z9 .cta-button:hover {
box-shadow: 0 8px 20px rgba(0,0,0,0.15) !important;
}
body.mhh1z9 .installer-card {
border-left: none !important;
border-top: 4px solid var(--primary-color) !important;
border-radius: var(--card-radius) !important;
}
body.mhh1z9 .installer-card:hover {
transform: translateY(-4px) !important;
transform: translateX(0) !important;
}
body.mhh1z9 .stations-stat, body.mhh1z9 .dpe-stat {
border: 2px solid #e0e0e0 !important;
border-top: 4px solid var(--primary-color) !important;
border-radius: var(--card-radius) !important;
background: white !important;
}
body.mhh1z9 .ville-card {
border-left: none !important;
border: 2px solid #e0e0e0 !important;
border-radius: var(--card-radius) !important;
}
body.mhh1z9 .ville-card:hover {
border-color: var(--primary-color) !important;
background: linear-gradient(135deg, rgba(46,204,113,0.03), rgba(39,174,96,0.06)) !important;
}
body.mhh1z9 .dept-card {
border-radius: var(--card-radius) !important;
border: none !important;
box-shadow: 0 1px 4px rgba(0,0,0,0.08) !important;
}
body.mhh1z9 .dept-card:hover {
box-shadow: 0 6px 20px rgba(0,0,0,0.12) !important;
border-color: transparent !important;
}
body.mhh1z9 .dept-link,
body.mhh1z9 .region-link {
border-radius: var(--card-radius) !important;
background: var(--primary-color) !important;
}
body.mhh1z9 .section h2 {
position: relative;
display: inline-block;
}
body.mhh1z9 #searchInput {
border-radius: var(--btn-radius) !important;
}
body.mhh1z9 #searchForm button[type="submit"] {
border-radius: var(--btn-radius) !important;
}
body.mhh1z9 #autocompleteResults {
border-radius: var(--card-radius) !important;
}
@media (max-width: 768px) {
body.mhh1z9 .hero-ville,
body.mhh1z9 .hero-departement,
body.mhh1z9 .hero-region {
text-align: center !important;
}
}
body.u1gyuo .breadcrumbs {
background: var(--paper-alt);
border-bottom: 1px solid var(--paper-line);
}
body.u1gyuo .section[style*="background: white"] {
background: var(--paper-bg) !important;
}
body.u1gyuo .section[style*="background: #f8f9fa"] {
background: var(--paper-alt) !important;
}
body.u1gyuo .hero-ville,
body.u1gyuo .hero-departement,
body.u1gyuo .hero-region {
background: var(--hero-gradient) !important;
border-bottom: 5px solid var(--primary-color) !important;
padding: 90px 0 !important;
}
body.u1gyuo .hero-ville h1,
body.u1gyuo .hero-departement h1,
body.u1gyuo .hero-region h1 {
font-size: 2.9rem !important;
font-weight: 600 !important;
}
body.u1gyuo .cta-button {
border-radius: var(--btn-radius) !important;
box-shadow: 6px 6px 0 var(--primary-color) !important;
border: 1px solid rgba(22,32,43,0.15) !important;
}
body.u1gyuo .cta-button:hover {
transform: translate(3px, 3px) !important;
box-shadow: 2px 2px 0 var(--primary-color) !important;
}
body.u1gyuo .section > .container > div[style*="gradient"] {
border-radius: var(--card-radius) !important;
}
body.u1gyuo div:has(> #searchForm) {
border-radius: var(--card-radius) !important;
box-shadow: 10px 10px 0 rgba(22,32,43,0.25) !important;
}
body.u1gyuo .installer-card {
border-left: none !important;
border: 1px solid var(--paper-line) !important;
border-radius: var(--card-radius) !important;
box-shadow: 5px 5px 0 rgba(22,32,43,0.06) !important;
}
body.u1gyuo .installer-card:hover {
transform: none !important;
border-color: var(--primary-color) !important;
box-shadow: 5px 5px 0 var(--primary-color) !important;
}
body.u1gyuo .stations-stat, body.u1gyuo .dpe-stat {
background: var(--paper-alt) !important;
border: 1px solid var(--paper-line) !important;
border-top: 4px solid var(--primary-color) !important;
border-radius: var(--card-radius) !important;
box-shadow: 5px 5px 0 rgba(22,32,43,0.06) !important;
}
body.u1gyuo .ville-card {
border-left: none !important;
border: 1px solid var(--paper-line) !important;
border-radius: var(--card-radius) !important;
box-shadow: 5px 5px 0 rgba(22,32,43,0.06) !important;
}
body.u1gyuo .ville-card:hover {
transform: none !important;
border-color: var(--primary-color) !important;
box-shadow: 5px 5px 0 var(--primary-color) !important;
}
body.u1gyuo .dept-card {
border: 1px solid var(--paper-line) !important;
border-radius: var(--card-radius) !important;
box-shadow: none !important;
}
body.u1gyuo .dept-card:hover {
transform: none !important;
border-color: var(--ink) !important;
box-shadow: 6px 6px 0 rgba(22,32,43,0.10) !important;
}
body.u1gyuo .dept-link,
body.u1gyuo .region-link {
background: var(--ink) !important;
border-radius: var(--btn-radius) !important;
border-bottom: 3px solid var(--primary-color) !important;
box-shadow: none !important;
}
body.u1gyuo .dept-link:hover,
body.u1gyuo .region-link:hover {
transform: none !important;
background: var(--primary-color) !important;
border-bottom-color: var(--ink) !important;
box-shadow: 5px 5px 0 rgba(22,32,43,0.15) !important;
}
body.u1gyuo .section > .container > h2 {
padding-top: 18px;
border-top: 2px solid var(--ink);
}
body.u1gyuo #searchInput {
border-radius: var(--btn-radius) !important;
border-color: var(--paper-line) !important;
}
body.u1gyuo #searchForm button[type="submit"] {
border-radius: var(--btn-radius) !important;
}
body.u1gyuo #autocompleteResults {
border-radius: var(--card-radius) !important;
border: 1px solid var(--paper-line);
}
body.a1y7iq section[style*="padding: 15px 0"] {
background: #FFFFFF !important;
padding: 10px 0 !important;
font-size: 0.85rem;
}
body.a1y7iq [style*="color: var(--primary-texte)"]:not(.cta-button),
body.a1y7iq .n1bugu li strong {
color: var(--cta-bg) !important;
}
body.a1y7iq [style*="color: var(--gray-dark)"][style*="opacity"] {
opacity: 1 !important;
}
body.a1y7iq .section[style*="background: #f8f9fa"] {
background: var(--light-bg) !important;
}
body.a1y7iq .section[style*="padding: 60px 0"] {
padding: 48px 0 !important;
}
body.a1y7iq .section ~ .section {
content-visibility: auto;
contain-intrinsic-size: auto 600px;
}
body.a1y7iq .hero-ville,
body.a1y7iq .hero-departement,
body.a1y7iq .hero-region,
body.a1y7iq .section:has(#searchForm) {
background: var(--tint) !important;
color: var(--ink) !important;
text-align: left !important;
padding: 56px 0 48px !important;
border-bottom: 1px solid var(--line);
}
body.a1y7iq .hero-ville .container,
body.a1y7iq .hero-departement .container,
body.a1y7iq .hero-region .container {
max-width: 860px;
}
body.a1y7iq .hero-ville h1,
body.a1y7iq .hero-departement h1,
body.a1y7iq .hero-region h1,
body.a1y7iq .section:has(#searchForm) h1 {
font-size: 2.6rem !important;
font-weight: 800 !important;
line-height: 1.15 !important;
margin-bottom: 14px !important;
color: var(--ink) !important;
}
body.a1y7iq .hero-ville p,
body.a1y7iq .hero-departement p,
body.a1y7iq .hero-region p,
body.a1y7iq .section:has(#searchForm) h1 + p {
color: var(--gray-dark) !important;
opacity: 1 !important;
font-size: 1.05rem !important;
}
body.a1y7iq .hero-ville p { margin-bottom: 24px !important; }
body.a1y7iq .hero-departement h1,
body.a1y7iq .hero-region h1 {
margin-bottom: 24px !important;
}
body.a1y7iq .section:has(#searchForm) > .container > div {
text-align: left !important;
max-width: 720px !important;
}
body.a1y7iq .cta-button {
border-radius: var(--btn-radius) !important;
box-shadow: none !important;
transform: none !important;
font-size: 1.2rem !important;
padding: 16px 32px !important;
transition: background-color .15s !important;
}
body.a1y7iq .cta-button[style*="background: white"] {
color: var(--ink) !important;
}
body.a1y7iq .cta-button[style*="background: white"]:hover {
background: var(--tint) !important;
}
body.a1y7iq .cta-button[style*="background: var(--primary-color)"],
body.a1y7iq .hero-ville .cta-button,
body.a1y7iq .hero-departement .cta-button,
body.a1y7iq .hero-region .cta-button {
background: var(--cta-bg) !important;
color: #FFFFFF !important;
}
body.a1y7iq .cta-button[style*="background: var(--primary-color)"]:hover,
body.a1y7iq .hero-ville .cta-button:hover,
body.a1y7iq .hero-departement .cta-button:hover,
body.a1y7iq .hero-region .cta-button:hover {
background: var(--ink) !important;
}
body.a1y7iq .section > .container > div[style*="gradient"] {
border-radius: var(--card-radius) !important;
padding: 32px 24px !important;
}
body.a1y7iq .section:not([style*="gradient"]) > .container > h2,
body.a1y7iq .section:not([style*="gradient"]) > .container > h2 + p {
text-align: left !important;
}
body.a1y7iq .section > .container > h2 {
font-size: 1.85rem !important;
font-weight: 800;
margin-bottom: 10px !important;
}
body.a1y7iq .section > .container > h2 + p {
font-size: 1rem !important;
margin-bottom: 24px !important;
}
body.a1y7iq div:has(> .installer-card) {
gap: 10px !important;
}
body.a1y7iq .installer-card {
padding: 16px 20px !important;
border: 1px solid var(--line) !important;
border-radius: var(--card-radius) !important;
box-shadow: none !important;
transform: none !important;
transition: border-color .15s !important;
}
body.a1y7iq .installer-card:hover {
border-color: var(--primary-color) !important;
}
body.a1y7iq .installer-card h3 {
font-size: 1.1rem !important;
color: var(--ink) !important;
margin-bottom: 6px !important;
}
body.a1y7iq .installer-card h3 + div {
margin-bottom: 0 !important;
gap: 4px 14px !important;
font-size: 0.9rem !important;
}
body.a1y7iq .installer-card > div > div {
min-width: 0 !important;
}
body.a1y7iq .stations-stat, body.a1y7iq .dpe-stat {
background: var(--tint) !important;
border: none !important;
border-radius: var(--card-radius) !important;
padding: 22px 16px !important;
}
body.a1y7iq .stations-stat div:first-child, body.a1y7iq .dpe-stat div:first-child {
color: var(--cta-bg) !important;
}
body.a1y7iq .ville-card,
body.a1y7iq .dept-card {
border: 1px solid var(--line) !important;
border-radius: var(--card-radius) !important;
box-shadow: none !important;
transform: none !important;
padding: 18px 20px !important;
}
body.a1y7iq .ville-card:hover,
body.a1y7iq .dept-card:hover {
border-color: var(--primary-color) !important;
box-shadow: none !important;
}
body.a1y7iq .ville-card h3 {
font-size: 1.1rem !important;
margin-bottom: 6px !important;
}
body.a1y7iq .dept-link,
body.a1y7iq .region-link {
border-radius: var(--btn-radius) !important;
box-shadow: none !important;
transform: none !important;
}
body.a1y7iq .dept-link:hover,
body.a1y7iq .region-link:hover {
background: var(--cta-bg) !important;
}
body.a1y7iq div:has(> #searchForm) {
border: 1px solid var(--line);
border-radius: var(--card-radius) !important;
box-shadow: none !important;
}
body.a1y7iq #searchInput {
border-radius: var(--btn-radius) !important;
}
body.a1y7iq #searchForm button[type="submit"] {
border-radius: var(--btn-radius) !important;
background: var(--cta-bg) !important;
}
body.a1y7iq #autocompleteResults {
border-radius: var(--card-radius) !important;
border: 1px solid var(--line);
}
body.a1y7iq .map-facade {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 8px;
width: 100%;
height: 260px;
margin-bottom: 20px;
border: 1px solid var(--line);
border-radius: var(--card-radius);
background-color: var(--tint);
background-image:
linear-gradient(rgba(15,23,42,0.05) 1px, transparent 1px),
linear-gradient(90deg, rgba(15,23,42,0.05) 1px, transparent 1px);
background-size: 32px 32px;
color: var(--ink);
font: inherit;
cursor: pointer;
}
body.a1y7iq .map-facade strong {
display: inline-block;
padding: 12px 22px;
border-radius: var(--btn-radius);
background: #FFFFFF;
border: 1px solid var(--line);
font-size: 1.05rem;
}
body.a1y7iq .map-facade:hover strong {
border-color: var(--primary-color);
}
body.a1y7iq .map-facade span {
color: var(--gray-dark);
font-size: 0.9rem;
}
body.a1y7iq #map {
height: 460px !important;
box-shadow: none !important;
border: 1px solid var(--line);
}
@media (max-width: 768px) {
body.a1y7iq .site-header {
padding: 8px 0;
}
body.a1y7iq .site-header .container {
flex-direction: row;
gap: 12px;
}
body.a1y7iq .site-logo img {
height: 36px;
}
body.a1y7iq .site-nav a:not(.open-devis-modal) {
display: none;
}
body.a1y7iq .site-nav a.open-devis-modal {
padding: 10px 14px;
font-size: 0.95rem;
white-space: nowrap;
}
body.a1y7iq .hero-ville,
body.a1y7iq .hero-departement,
body.a1y7iq .hero-region,
body.a1y7iq .section:has(#searchForm) {
padding: 28px 0 28px !important;
}
body.a1y7iq .hero-ville h1,
body.a1y7iq .hero-departement h1,
body.a1y7iq .hero-region h1,
body.a1y7iq .section:has(#searchForm) h1 {
font-size: 1.7rem !important;
margin-bottom: 10px !important;
}
body.a1y7iq .hero-ville p,
body.a1y7iq .hero-departement p,
body.a1y7iq .hero-region p {
font-size: 0.95rem !important;
}
body.a1y7iq .hero-ville p { margin-bottom: 18px !important; }
body.a1y7iq .hero-departement h1,
body.a1y7iq .hero-region h1 {
margin-bottom: 18px !important;
}
body.a1y7iq .cta-button {
display: block !important;
width: 100%;
text-align: center;
font-size: 1.1rem !important;
padding: 16px 20px !important;
}
body.a1y7iq .section[style*="padding: 60px 0"],
body.a1y7iq .section[style*="padding: 80px 0"]:not(:has(#searchForm)) {
padding: 32px 0 !important;
}
body.a1y7iq .section > .container > h2 {
font-size: 1.4rem !important;
}
body.a1y7iq .section > .container > div[style*="gradient"] {
padding: 24px 18px !important;
}
body.a1y7iq .section > .container > div[style*="gradient"] h3 {
font-size: 1.3rem !important;
}
body.a1y7iq .section > .container > div[style*="gradient"] p {
margin-bottom: 18px !important;
}
body.a1y7iq .section[style*="gradient"] h2 {
font-size: 1.5rem !important;
}
body.a1y7iq .section[style*="gradient"] p {
margin-bottom: 20px !important;
}
body.a1y7iq .installer-card {
padding: 14px 16px !important;
}
body.a1y7iq .ville-card {
padding: 14px 16px !important;
}
body.a1y7iq div:has(> .ville-card) {
gap: 10px !important;
}
body.a1y7iq .stations-stat div:first-child, body.a1y7iq .dpe-stat div:first-child {
font-size: 2.2rem !important;
}
body.a1y7iq .map-facade {
height: 200px;
}
body.a1y7iq #map {
height: 360px !important;
}
body.a1y7iq div:has(> #searchForm) {
padding: 18px 16px !important;
}
body.a1y7iq #searchForm button[type="submit"] {
border-radius: var(--btn-radius) !important;
}
}
html.e1h-texte-grand { font-size: 118.75%; }
body.v19w50 {
--e1h-s1: .5rem; --e1h-s2: 1rem; --e1h-s3: 1.5rem; --e1h-s4: 2rem; --e1h-s5: 3rem; --e1h-s6: 4rem; --e1h-s7: 6rem;
--e1h-card: #FFFFFF;
--e1h-warn-bg: #FFF4D6;
--e1h-warn-line: #A35F00;
--e1h-dessin: #FBE7DA;
--e1h-focus: #FFBF47;
background: var(--paper);
color: var(--ink);
font-family: 'Atkinson Hyperlegible', Verdana, sans-serif;
font-size: 1.125rem;
line-height: 1.6;
}
@media (min-width: 1024px) { body.v19w50 { font-size: 1.25rem; } }
body.v19w50 a { color: var(--accent); text-underline-offset: .2em; text-decoration-thickness: 2px; }
body.v19w50 :focus-visible { outline: 4px solid var(--e1h-focus) !important; outline-offset: 3px; border-radius: 6px; }
body.v19w50 .t8 h1, body.v19w50 .t8 h2, body.v19w50 .t8 h3, body.v19w50 .t8 h4 { line-height: 1.25; margin: 0 0 var(--e1h-s2); color: var(--ink); font-family: inherit; }
body.v19w50 .t8 h1 { font-size: 2rem; }
body.v19w50 .t8 h2 { font-size: 1.75rem; }
body.v19w50 .t8 h3 { font-size: 1.25rem; }
@media (min-width: 1024px) {
body.v19w50 .t8 h1 { font-size: 2.75rem; }
body.v19w50 .t8 h2 { font-size: 2.125rem; }
body.v19w50 .t8 h3 { font-size: 1.375rem; }
}
body.v19w50 .t8 h1, body.v19w50 .t8 h2, body.v19w50 .t8 h3 { overflow-wrap: break-word; hyphens: manual; }
body.v19w50 .t8 p { margin: 0 0 var(--e1h-s2); }
body.v19w50 .t8 ul, body.v19w50 .t8 ol { margin: 0; padding: 0; }
body.v19w50 .t8 svg { max-width: 100%; height: auto; }
.e1h-conteneur { max-width: 1200px; margin: 0 auto; padding: 0 var(--e1h-s2); }
@media (min-width: 640px) { .e1h-conteneur { padding: 0 var(--e1h-s4); } }
.e1h-section { padding: var(--e1h-s6) 0; }
.e1h-blanche { background: var(--e1h-card); }
.e1h-chapo { font-size: 1.1875rem; color: var(--ink-2); max-width: 44rem; margin-bottom: var(--e1h-s4) !important; }
.e1h-source { font-size: 1rem; color: var(--ink-2); margin-top: var(--e1h-s3) !important; }
.e1h-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
body.v19w50 .e1h-bouton {
display: inline-flex; align-items: center; justify-content: center; gap: var(--e1h-s1);
min-height: 3.5rem; padding: .75rem 1.75rem; border-radius: 12px;
font: inherit; font-weight: 700; text-decoration: none; cursor: pointer;
background: var(--accent); color: #FFFFFF; border: 3px solid var(--accent);
}
body.v19w50 .e1h-bouton-clair { background: #FFFFFF; color: var(--accent); }
.e1h-boutons { display: flex; flex-wrap: wrap; gap: var(--e1h-s2); }
@media (max-width: 639px) { .e1h-bouton-large { width: 100%; } }
.e1h-entete { background: var(--e1h-card); border-bottom: 1px solid var(--line); }
.e1h-entete-haut { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--e1h-s2); padding: var(--e1h-s2) 0; }
body.v19w50 .e1h-logo { display: flex; align-items: center; gap: .75rem; text-decoration: none; color: var(--ink); }
.e1h-logo img { max-height: 3.5rem; width: auto; }
.e1h-logo-nom { font-size: 1.375rem; font-weight: 700; line-height: 1.2; }
.e1h-logo-nom small { display: block; font-size: 1rem; font-weight: 400; color: var(--ink-2); }
.e1h-outil-texte { display: flex; align-items: center; gap: var(--e1h-s1); }
.e1h-outil-texte button { min-height: 3.5rem; min-width: 3.5rem; padding: 0 1rem; border-radius: 12px; border: 2px solid var(--line); background: #FFFFFF; font: inherit; font-weight: 700; color: var(--ink); cursor: pointer; }
.e1h-outil-texte button[aria-pressed="true"] { border-color: var(--accent); background: var(--accent-soft); }
.e1h-nav { border-top: 1px solid var(--line); }
.e1h-nav ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0 var(--e1h-s3); align-items: center; }
body.v19w50 .e1h-nav a { display: inline-flex; align-items: center; min-height: 3.5rem; font-weight: 700; color: var(--ink); text-decoration: none; border-bottom: 4px solid transparent; }
body.v19w50 .e1h-nav a[aria-current="page"] { border-bottom-color: var(--accent); }
.e1h-nav li.e1h-nav-devis { margin-left: auto; }
body.v19w50 .e1h-nav li.e1h-nav-devis a { color: #FFFFFF; background: var(--accent); padding: 0 1.25rem; border-radius: 12px; border: 0; }
@media (max-width: 639px) { .e1h-nav li.e1h-nav-devis { display: none; } .e1h-nav.e1h-nav-sans-liens { display: none; } }
.e1h-court { display: none; }
@media (max-width: 639px) {
.e1h-nav ul { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: var(--e1h-s1); padding: var(--e1h-s1) 0; }
.e1h-nav li { display: flex; }
body.v19w50 .e1h-nav a { width: 100%; justify-content: center; text-align: center; line-height: 1.2; height: 100%; padding: .25rem .25rem; border: 2px solid var(--line); border-radius: 12px; font-size: 1rem; }
body.v19w50 .e1h-nav a[aria-current="page"] { border-color: var(--accent); }
.e1h-long { display: none; }
.e1h-court { display: inline; }
}
.e1h-fil { font-size: 1rem; padding: var(--e1h-s2) 0; }
.e1h-fil ol { list-style: none; display: flex; flex-wrap: wrap; gap: .25rem .5rem; }
.e1h-fil li + li::before { content: "›"; margin-right: .5rem; color: var(--ink-2); }
.e1h-heros { padding: var(--e1h-s4) 0 var(--e1h-s6); }
.e1h-heros-grille { display: grid; gap: var(--e1h-s4); align-items: center; }
.e1h-heros-grille > *, .e1h-fiche > *, .e1h-signaler > *, .e1h-bandeau > * { min-width: 0; }
@media (min-width: 1024px) { .e1h-heros-grille { grid-template-columns: 7fr 5fr; gap: var(--e1h-s5); } }
.e1h-synthese { background: var(--e1h-card); border: 2px solid var(--line); border-left: 8px solid var(--accent); border-radius: var(--card-radius); padding: var(--e1h-s3); margin: var(--e1h-s3) 0 var(--e1h-s4); }
body.v19w50 .e1h-synthese p { margin: 0; }
body.v19w50 .e1h-synthese .e1h-date { margin-top: var(--e1h-s1); font-size: 1rem; color: var(--ink-2); }
.e1h-dessin { background: var(--e1h-dessin); border-radius: 24px; padding: var(--e1h-s3); }
.e1h-dessin svg { display: block; width: 100%; }
.e1h-reperes { display: grid; gap: var(--e1h-s2); margin-top: var(--e1h-s5); }
@media (min-width: 640px) { .e1h-reperes { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 640px) and (max-width: 1023px) { .e1h-reperes-4 { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .e1h-reperes-4 { grid-template-columns: repeat(4, 1fr); } }
body.v19w50 .e1h-repere { background: var(--e1h-card); border: 2px solid var(--line); border-radius: var(--card-radius); padding: var(--e1h-s3); margin: 0; }
.e1h-repere strong { display: block; font-size: 2.25rem; line-height: 1.1; color: var(--accent); }
.e1h-recherche label { display: block; font-weight: 700; margin-bottom: var(--e1h-s1); }
.e1h-recherche-ligne { display: flex; flex-wrap: wrap; gap: var(--e1h-s2); }
.e1h-recherche input { flex: 1 1 14rem; min-height: 3.5rem; padding: 0 1rem; font: inherit; border: 3px solid var(--ink-2); border-radius: 12px; background: #FFFFFF; color: var(--ink); }
.e1h-ou { margin-top: var(--e1h-s2) !important; }
.e1h-liste { list-style: none; display: grid; gap: var(--e1h-s2); }
.e1h-groupe { margin: var(--e1h-s5) 0 var(--e1h-s2) !important; }
.e1h-chapo + .e1h-groupe { margin-top: 0 !important; }
.e1h-fiche { background: var(--e1h-card); border: 2px solid var(--line); border-radius: var(--card-radius); padding: var(--e1h-s3); display: grid; grid-template-columns: 3.5rem 1fr; gap: var(--e1h-s1) var(--e1h-s3); }
@media (min-width: 640px) { .e1h-fiche { grid-template-columns: 3.5rem 1fr 12rem; align-items: start; } }
.e1h-fiche-num { width: 3.5rem; height: 3.5rem; border-radius: 50%; background: var(--accent); color: #FFFFFF; font-size: 1.5rem; font-weight: 700; display: flex; align-items: center; justify-content: center; }
body.v19w50 .e1h-fiche-nom { font-size: 1.375rem; font-weight: 700; margin: .25rem 0 0; }
body.v19w50 .e1h-fiche-marque { margin: 0; font-weight: 700; color: var(--ink-2); }
body.v19w50 .e1h-fiche-adresse { margin: .25rem 0 0; color: var(--ink-2); }
body.v19w50 .e1h-fiche-note { margin: var(--e1h-s2) 0 0; padding: var(--e1h-s2); background: var(--paper); border-radius: 10px; font-size: 1rem; }
body.v19w50 .e1h-fiche-distance { grid-column: 2; font-size: 1.75rem; font-weight: 700; line-height: 1.1; color: var(--accent); margin: 0; }
body.v19w50 .e1h-fiche-lieu { font-size: 1.25rem; }
.e1h-fiche-distance small { display: block; font-size: 1rem; font-weight: 400; color: var(--ink-2); margin-top: .25rem; }
@media (min-width: 640px) { body.v19w50 .e1h-fiche-distance { grid-column: 3; text-align: right; } }
.e1h-alerte { background: var(--e1h-warn-bg); border-left: 6px solid var(--e1h-warn-line); padding: var(--e1h-s2) var(--e1h-s3); border-radius: 0 10px 10px 0; margin: 0 0 var(--e1h-s3) !important; }
.e1h-signaler { margin-top: var(--e1h-s5); background: var(--accent-soft); border: 2px solid color-mix(in srgb, var(--accent) 35%, #FFFFFF); border-radius: var(--card-radius); padding: var(--e1h-s4); display: grid; gap: var(--e1h-s3); }
@media (min-width: 1024px) { .e1h-signaler { grid-template-columns: 1fr auto; align-items: center; } }
body.v19w50 .e1h-signaler h3 { margin-bottom: var(--e1h-s1); }
body.v19w50 .e1h-signaler p { margin: 0; }
.e1h-bandeau { background: var(--accent); border-radius: 24px; padding: var(--e1h-s5) var(--e1h-s4); display: grid; gap: var(--e1h-s3); }
@media (min-width: 1024px) { .e1h-bandeau { grid-template-columns: 1fr auto; align-items: center; padding: var(--e1h-s5); } }
body.v19w50 .e1h-bandeau h2, body.v19w50 .e1h-bandeau p { color: #FFFFFF; margin: 0; }
body.v19w50 .e1h-bandeau p { margin-top: var(--e1h-s1); }
body.v19w50 .e1h-bandeau .e1h-bouton { background: #FFFFFF; color: var(--accent); border-color: #FFFFFF; }
.e1h-cartes { list-style: none; display: grid; gap: var(--e1h-s2); }
@media (min-width: 640px) { .e1h-cartes { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .e1h-cartes-3 { grid-template-columns: repeat(3, 1fr); } }
.e1h-carte { background: var(--e1h-card); border: 2px solid var(--line); border-radius: var(--card-radius); padding: var(--e1h-s3); display: flex; flex-direction: column; }
body.v19w50 .e1h-carte .e1h-qui { font-size: 1rem; color: var(--ink-2); margin-bottom: var(--e1h-s2); }
body.v19w50 .e1h-carte a { margin-top: auto; display: inline-flex; align-items: center; min-height: 3rem; font-weight: 700; }
.e1h-mention { background: var(--e1h-warn-bg); border-left: 6px solid var(--e1h-warn-line); padding: var(--e1h-s2) var(--e1h-s3); border-radius: 0 10px 10px 0; margin-top: var(--e1h-s3) !important; }
.e1h-titre-suite { margin-top: var(--e1h-s6) !important; }
.e1h-etapes { list-style: none; display: grid; gap: var(--e1h-s2); counter-reset: e1h-etape; }
@media (min-width: 1024px) { .e1h-etapes { grid-template-columns: repeat(3, 1fr); } }
.e1h-etape { background: var(--e1h-card); border: 2px solid var(--line); border-radius: var(--card-radius); padding: var(--e1h-s3); counter-increment: e1h-etape; }
.e1h-etape::before { content: counter(e1h-etape); display: flex; align-items: center; justify-content: center; width: 3.5rem; height: 3.5rem; border-radius: 50%; background: #E07A3F; color: var(--ink); font-size: 1.5rem; font-weight: 700; margin-bottom: var(--e1h-s2); }
.e1h-texte { max-width: 42rem; }
body.v19w50 .e1h-texte h2 { margin-top: var(--e1h-s5); }
body.v19w50 .e1h-texte img, body.v19w50 .e1h-texte figure { max-width: 100%; height: auto; }
body.v19w50 .e1h-texte .byline, body.v19w50 .e1h-texte .page-byline { font-size: 1rem; }
.e1h-liens { list-style: none; display: grid; gap: var(--e1h-s1) var(--e1h-s3); }
@media (min-width: 640px) { .e1h-liens { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .e1h-liens { grid-template-columns: repeat(3, 1fr); } }
body.v19w50 .e1h-liens a { display: flex; align-items: center; justify-content: space-between; gap: var(--e1h-s2); min-height: 3.5rem; padding: 0 var(--e1h-s2); background: var(--e1h-card); border: 2px solid var(--line); border-radius: 12px; font-weight: 700; text-decoration: none; }
.e1h-liens a span { font-weight: 400; color: var(--ink-2); font-size: 1rem; }
.e1h-lettres { display: flex; flex-wrap: wrap; gap: var(--e1h-s1); margin-bottom: var(--e1h-s3); }
body.v19w50 .e1h-lettres a { display: inline-flex; align-items: center; justify-content: center; min-width: 3.5rem; min-height: 3.5rem; border: 2px solid var(--line); border-radius: 12px; background: #FFFFFF; font-weight: 700; text-decoration: none; }
body.v19w50 .t8 .e1h-lettre { font-size: 1.5rem; margin: var(--e1h-s4) 0 var(--e1h-s2); color: var(--accent); }
.e1h-departements { list-style: none; display: grid; gap: var(--e1h-s2); }
@media (min-width: 640px) { .e1h-departements { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .e1h-departements { grid-template-columns: repeat(3, 1fr); } }
body.v19w50 .e1h-departements a { display: flex; flex-direction: column; gap: .25rem; height: 100%; padding: var(--e1h-s3); background: var(--e1h-card); border: 2px solid var(--line); border-radius: var(--card-radius); text-decoration: none; color: var(--ink); }
.e1h-dep-nom { font-size: 1.375rem; font-weight: 700; color: var(--accent); text-decoration: underline; text-underline-offset: .2em; }
.e1h-dep-code { color: var(--ink-2); font-weight: 400; }
.e1h-dep-nb { font-weight: 700; font-size: 1.125rem; }
.e1h-dep-aucune { color: var(--e1h-warn-line); }
.e1h-dep-lieux { color: var(--ink-2); font-size: 1rem; }
body.v19w50 .e1h-pied { background: #1F2A37; color: #FFFFFF; padding: var(--e1h-s6) 0 var(--e1h-s7); }
body.v19w50 .e1h-pied a { color: #FFFFFF; }
.e1h-pied-grille { display: grid; gap: var(--e1h-s4); }
@media (min-width: 1024px) { .e1h-pied-grille { grid-template-columns: 2fr 1fr 1fr; } }
.e1h-pied ul { list-style: none; margin: 0; padding: 0; }
.e1h-pied li a { display: inline-flex; align-items: center; min-height: 3rem; }
body.v19w50 .e1h-pied h2 { color: #FFFFFF; font-size: 1.25rem; margin: 0 0 var(--e1h-s2); }
body.v19w50 .e1h-pied p { color: #FFFFFF; }
body.v19w50 .sticky-cta { transition: none !important; }
body.v19w50 .sticky-cta a { min-height: 3.5rem; display: flex !important; align-items: center; justify-content: center; border-radius: 12px !important; background: var(--accent) !important; color: #FFFFFF !important; font-size: 1.125rem !important; font-family: inherit; }
@media (prefers-reduced-motion: reduce) { html:has(body.v19w50) { scroll-behavior: auto; } }
.icone {
flex: none;
vertical-align: -0.125em;
}
#searchInput.champ-loupe,
input.champ-loupe {
padding-left: 48px !important;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-4-4'/%3E%3C/svg%3E") !important;
background-repeat: no-repeat !important;
background-position: 16px center !important;
background-size: 20px 20px !important;
}
:focus-visible {
outline: 3px solid var(--dark-color) !important;
outline-offset: 2px !important;
box-shadow: 0 0 0 2px #FFFFFF !important;
}
.fil-ariane a {
display: inline-flex;
align-items: center;
min-height: 44px;
}
section:has(> .container > .fil-ariane) {
padding-top: 0 !important;
padding-bottom: 0 !important;
}
[style*="color: var(--gray-dark)"][style*="opacity"] {
opacity: 1 !important;
}
.n1bugu a {
color: var(--primary-texte);
}
@media (max-width: 768px) {
.accueil .acc-liste-communes a,
.accueil .acc-liste-maj a,
.footer-col a {
display: inline-flex;
align-items: center;
min-height: 44px;
}
}
:root {
--s1: 8px; --s2: 16px; --s3: 24px; --s4: 32px; --s5: 40px;
--s6: 48px; --s7: 56px; --s8: 64px; --s10: 80px; --s12: 96px;
}
.aside-devis {
display: none;
}
.dept-recherche {
position: relative;
max-width: 560px;
margin: var(--s4) auto 0;
text-align: left;
}
.dept-recherche label {
display: block;
margin-bottom: var(--s1);
font-weight: 600;
}
.dept-recherche input {
width: 100%;
min-height: 52px;
padding: 12px 16px;
border: 2px solid rgba(0, 0, 0, 0.12);
border-radius: var(--btn-radius);
background-color: #FFFFFF;
color: var(--dark-color);
font-size: 1rem;
}
.dept-resultats {
position: absolute;
left: 0;
right: 0;
top: 100%;
z-index: 50;
margin-top: 6px;
overflow: hidden;
border-radius: var(--card-radius);
background: #FFFFFF;
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
}
.dept-resultats a {
display: flex;
align-items: center;
min-height: 48px;
padding: 0 var(--s2);
border-bottom: 1px solid #EEF0F2;
color: var(--dark-color);
text-decoration: none;
}
.dept-resultats a:hover {
background: var(--light-bg);
}
.dept-resultats p {
margin: 0;
padding: var(--s2);
color: var(--gray-dark);
}
.villes-liens {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
gap: 0 var(--s3);
margin: 0;
padding: 0;
list-style: none;
}
.villes-liens a {
display: flex;
justify-content: space-between;
align-items: center;
gap: var(--s1);
min-height: 44px;
border-bottom: 1px solid rgba(0, 0, 0, 0.08);
color: var(--primary-texte);
font-weight: 600;
text-decoration: none;
}
.villes-liens a:hover {
text-decoration: underline;
}
.villes-liens span {
color: var(--gray-dark);
font-size: 0.9rem;
font-weight: 400;
}
.villes-liens-compact {
grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
}
.villes-liens-compact a {
min-height: 36px;
font-weight: 500;
font-size: 0.95rem;
}
.tableau-entreprises table {
width: 100%;
border-collapse: collapse;
overflow: hidden;
border-radius: var(--card-radius);
background: #FFFFFF;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
font-size: 0.95rem;
}
.tableau-entreprises th,
.tableau-entreprises td {
padding: 12px 16px;
border-bottom: 1px solid #EEF0F2;
text-align: left;
vertical-align: top;
}
.tableau-entreprises thead th {
background: var(--light-bg);
color: var(--gray-dark);
font-size: 0.85rem;
letter-spacing: 0.03em;
text-transform: uppercase;
}
.tableau-entreprises tbody th {
color: var(--dark-color);
font-weight: 600;
}
.tableau-detail,
.tableau-qualif {
display: block;
}
.tableau-detail {
color: var(--gray-dark);
font-size: 0.85rem;
font-weight: 400;
}
.tableau-qualif + .tableau-qualif {
margin-top: 4px;
}
.tableau-entreprises a {
color: var(--primary-texte);
white-space: nowrap;
}
.sr-only {
position: absolute;
width: 1px;
height: 1px;
overflow: hidden;
clip: rect(0 0 0 0);
white-space: nowrap;
}
.filtre-entreprises [hidden] {
display: none !important;
}
.filtre-sentinelle {
height: 1px;
}
.filtre-outils {
position: sticky;
top: 0;
z-index: 20;
display: grid;
grid-template-columns: minmax(0, 2fr) minmax(0, 1.3fr) auto;
column-gap: var(--s1);
align-items: end;
margin-bottom: var(--s1);
padding: var(--s2) 0 var(--s1);
background: inherit;
background-color: var(--light-bg);
}
.filtre-outils.colle {
box-shadow: 0 6px 12px -8px rgba(0, 0, 0, 0.25);
}
.filtre-ligne,
.filtre-panneau,
.filtre-ligne-panneau {
display: contents;
}
.filtre-puces,
.filtre-etat {
grid-column: 1 / -1;
}
.filtre-champ {
position: relative;
}
.filtre-champ label {
display: block;
margin-bottom: 4px;
font-size: 0.85rem;
font-weight: 600;
color: var(--dark-color);
}
.filtre-entreprises *,
.filtre-entreprises *::before,
.filtre-entreprises *::after {
box-sizing: border-box;
}
.filtre-champ input,
.filtre-champ select {
width: 100%;
min-height: 48px;
padding: 0 44px;
border: 2px solid rgba(0, 0, 0, 0.12);
border-radius: var(--btn-radius);
background: #FFFFFF;
color: var(--dark-color);
font: inherit;
font-size: 1rem;
}
.filtre-champ select {
padding: 0 12px;
}
.filtre-ico {
position: absolute;
left: 14px;
bottom: 14px;
width: 20px;
height: 20px;
color: var(--gray-dark);
pointer-events: none;
}
.filtre-effacer {
position: absolute;
right: 4px;
bottom: 4px;
width: 40px;
height: 40px;
border: 0;
border-radius: 8px;
background: transparent;
color: var(--gray-dark);
font-size: 1.4rem;
line-height: 1;
cursor: pointer;
}
.filtre-kbd {
position: absolute;
right: 12px;
bottom: 13px;
padding: 0 5px;
border: 1px solid rgba(0, 0, 0, 0.15);
border-radius: 4px;
color: var(--gray-dark);
font-size: 0.75rem;
pointer-events: none;
}
.filtre-suggestions {
position: absolute;
left: 0;
right: 0;
top: 100%;
z-index: 30;
max-height: 300px;
margin: 4px 0 0;
padding: 4px;
overflow: auto;
list-style: none;
border-radius: var(--card-radius);
background: #FFFFFF;
box-shadow: 0 10px 24px rgba(0, 0, 0, 0.14);
}
.filtre-suggestions li {
display: flex;
justify-content: space-between;
gap: 12px;
padding: 10px 12px;
border-radius: 8px;
cursor: pointer;
}
.filtre-suggestions li[aria-selected="true"],
.filtre-suggestions li:hover {
background: var(--light-bg);
}
.filtre-cp {
color: var(--gray-dark);
font-size: 0.9rem;
}
.filtre-puces {
display: flex;
flex-wrap: wrap;
gap: var(--s1);
margin-top: var(--s2);
}
.filtre-puce {
display: inline-flex;
align-items: center;
gap: 6px;
min-height: 40px;
padding: 0 14px;
border: 1.5px solid rgba(0, 0, 0, 0.12);
border-radius: 999px;
background: #FFFFFF;
color: var(--dark-color);
font: inherit;
font-size: 0.92rem;
cursor: pointer;
}
.filtre-n {
color: var(--gray-dark);
font-size: 0.85rem;
}
.filtre-puce[aria-pressed="true"] {
border-color: var(--primary-bouton, var(--primary-color));
background: var(--primary-bouton, var(--primary-color));
color: var(--primary-fg, #FFFFFF);
}
.filtre-puce[aria-pressed="true"] .filtre-n {
color: inherit;
opacity: 0.85;
}
.filtre-etat {
display: flex;
justify-content: space-between;
align-items: baseline;
flex-wrap: wrap;
gap: var(--s2);
margin-top: var(--s2);
}
.filtre-compte {
font-weight: 600;
color: var(--dark-color);
}
.filtre-reinit {
padding: 8px 0;
border: 0;
background: none;
color: var(--primary-texte);
font: inherit;
font-weight: 600;
text-decoration: underline;
cursor: pointer;
}
.filtre-bouton {
display: none;
}
.e-nom {
display: block;
}
.e-cp,
.e-vide {
color: var(--gray-dark);
}
.e-vide {
font-style: italic;
}
.e-distance {
display: block;
color: var(--primary-texte);
font-size: 0.88rem;
font-weight: 600;
}
.tableau-entreprises tbody tr:nth-child(even) {
background: color-mix(in srgb, var(--primary-color) 4%, #F7F8FA);
}
.filtre-js .tableau-entreprises tbody tr {
background: #FFFFFF;
}
.filtre-js .tableau-entreprises tbody tr.ligne-alt {
background: color-mix(in srgb, var(--primary-color) 4%, #F7F8FA);
}
.tableau-echeance {
color: #8A5300;
font-weight: 600;
}
.tableau-entreprises mark {
padding: 0 1px;
border-radius: 3px;
background: #FFE58A;
color: inherit;
}
.filtre-vide,
.filtre-plus {
display: flex;
justify-content: center;
flex-wrap: wrap;
gap: var(--s1);
margin-top: var(--s3);
}
.filtre-vide {
flex-direction: column;
align-items: center;
padding: var(--s4) var(--s3);
border-radius: var(--card-radius);
background: #FFFFFF;
text-align: center;
}
.filtre-vide p {
margin: 0;
}
.filtre-action {
min-height: 48px;
padding: 0 var(--s3);
border: 2px solid var(--primary-texte);
border-radius: var(--btn-radius);
background: #FFFFFF;
color: var(--primary-texte);
font: inherit;
font-weight: 700;
cursor: pointer;
}
@media (max-width: 768px) {
.filtre-outils {
display: block;
padding-top: var(--s1);
}
.filtre-ligne {
display: flex;
align-items: flex-end;
gap: var(--s1);
}
.filtre-champ-q {
flex: 1;
min-width: 0;
}
.filtre-champ-q label,
.filtre-kbd {
position: absolute;
width: 1px;
height: 1px;
overflow: hidden;
clip: rect(0 0 0 0);
}
.filtre-bouton {
display: inline-flex;
flex: none;
align-items: center;
gap: 6px;
min-height: 48px;
padding: 0 14px;
border: 2px solid rgba(0, 0, 0, 0.12);
border-radius: var(--btn-radius);
background: #FFFFFF;
color: var(--dark-color);
font: inherit;
font-weight: 600;
cursor: pointer;
}
.filtre-bouton[aria-expanded="true"] {
border-color: var(--primary-texte);
}
.filtre-nb {
display: inline-grid;
place-items: center;
min-width: 22px;
height: 22px;
border-radius: 999px;
background: var(--primary-bouton, var(--primary-color));
color: var(--primary-fg, #FFFFFF);
font-size: 0.8rem;
}
.filtre-panneau {
display: none;
}
.filtre-panneau.ouvert {
display: block;
margin-top: var(--s2);
padding: var(--s2);
border-radius: var(--card-radius);
background: #FFFFFF;
box-shadow: 0 6px 18px rgba(0, 0, 0, 0.12);
}
.filtre-ligne-panneau {
display: grid;
gap: var(--s2);
}
.filtre-etat {
margin-top: var(--s1);
}
}
@media (max-width: 768px) {
.villes-liens {
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0 var(--s2);
}
.villes-liens span {
display: none;
}
.tableau-entreprises thead {
position: absolute;
width: 1px;
height: 1px;
overflow: hidden;
clip: rect(0 0 0 0);
}
.tableau-entreprises table,
.tableau-entreprises tbody,
.tableau-entreprises tr,
.tableau-entreprises th,
.tableau-entreprises td {
display: block;
width: 100%;
}
.tableau-entreprises tr {
padding: 12px 16px;
border-bottom: 1px solid #EEF0F2;
}
.tableau-entreprises th,
.tableau-entreprises td {
padding: 2px 0;
border: 0;
}
.tableau-entreprises td::before {
content: attr(data-libelle) " : ";
color: var(--gray-dark);
}
}
.guides-entete {
display: flex;
justify-content: space-between;
align-items: baseline;
flex-wrap: wrap;
gap: var(--s1) var(--s3);
margin-bottom: var(--s3);
}
.guides-entete .titre-section {
margin: 0 !important;
text-align: left !important;
}
.guides-entete a {
display: inline-flex;
align-items: center;
min-height: 44px;
color: var(--primary-texte);
font-weight: 600;
}
.guides-grille {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
gap: var(--s3);
}
.guide-carte {
display: flex;
flex-direction: column;
gap: var(--s1);
padding: var(--s3);
border-radius: var(--card-radius);
background: #FFFFFF;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.07);
color: var(--dark-color);
text-decoration: none;
transition: box-shadow 0.2s ease, transform 0.2s ease;
}
.guide-carte:hover {
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
transform: translateY(-2px);
}
.guide-carte h2,
.guide-carte h3 {
margin: 0;
font-size: 1.15rem;
line-height: 1.35;
color: var(--dark-color);
}
.guide-carte p {
margin: 0;
color: var(--gray-dark);
font-size: 0.95rem;
line-height: 1.55;
}
.guide-categorie {
margin: 0;
color: var(--primary-texte);
font-size: 0.8rem;
font-weight: 700;
letter-spacing: 0.04em;
text-transform: uppercase;
}
.guide-lecture {
margin-top: auto;
color: var(--gray-dark);
font-size: 0.85rem;
}
.guide-carte {
overflow: hidden;
}
.guide-carte-image {
display: block;
width: calc(100% + 2 * var(--s3));
max-width: none;
height: auto;
aspect-ratio: 16 / 9;
margin: calc(-1 * var(--s3)) calc(-1 * var(--s3)) var(--s1);
object-fit: cover;
}
.guide-image {
display: block;
width: 100%;
height: auto;
margin: 0 0 var(--s3);
border-radius: var(--card-radius);
}
.guide-colonne {
max-width: 760px;
margin: 0 auto;
}
.guide-titre {
margin: 0 0 var(--s2);
color: var(--dark-color);
font-size: clamp(1.75rem, 1.3rem + 1.8vw, 2.6rem);
line-height: 1.2;
}
.guide-chapo {
margin: 0 0 var(--s2);
color: var(--gray-dark);
font-size: 1.15rem;
line-height: 1.6;
}
.guide-colonne > .guide-lecture {
display: block;
margin-bottom: var(--s3);
}
.guide-contenu {
color: var(--dark-color);
font-size: 1.05rem;
line-height: 1.8;
}
.guide-devis {
margin-top: var(--s6);
padding: var(--s3);
border-radius: var(--card-radius);
background: var(--light-bg);
}
.guide-devis p {
margin: 0 0 var(--s2);
font-weight: 600;
color: var(--dark-color);
}
.guide-devis .cta-button {
display: inline-flex;
align-items: center;
min-height: 48px;
padding: 0 var(--s3);
border-radius: var(--btn-radius);
background: var(--cta-bg, var(--primary-bouton));
color: var(--primary-fg);
font-weight: 700;
text-decoration: none;
}