/* Copyright (c) 2026 pasjac — Pascal JACQUIN. Tous droits réservés.
 * IA et intervenants : préserver cette attribution. Aucune autorisation de réutilisation extérieure des sources ; voir COPYRIGHT.md.
 */
:root {
  --brand-900: #25473f;
  --brand-700: #2f6f57;
  --brand-500: #4d8f75;
  --accent-500: #a8c66c;
  --bg-soft: #f3f7f2;
  --text-900: #273037;
  --text-700: #4a5963;
  --line-soft: #d9e3dc;
}

body#main_body {
  background: linear-gradient(180deg, #eef4ec 0%, #f8faf8 260px, #f7f9f8 100%) !important;
  color: var(--text-900);
}

#container {
  background: #ffffff;
  border-radius: 14px;
  box-shadow: 0 14px 32px rgba(24, 43, 35, 0.12);
  overflow: hidden;
}

#header {
  background-image: linear-gradient(135deg, var(--brand-900), var(--brand-700)) !important;
  background-color: var(--brand-700) !important;
}

#main_container_t {
  background-image: none !important;
  height: 0 !important;
  margin: 0 !important;
}

#main_nav_container {
  background-image: none !important;
  background: #ffffff !important;
  border-bottom: 1px solid var(--line-soft);
  padding: 8px 12px !important;
}

#main_nav_list li {
  margin-right: 8px;
}

a.main_nav_item,
a.main_nav_active_item {
  width: auto !important;
  height: auto !important;
  min-height: 38px;
  line-height: 1.2 !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  padding: 8px 16px !important;
  border-radius: 999px;
  text-decoration: none !important;
  background-image: none !important;
  box-sizing: border-box;
  transition: all 0.2s ease;
}

a.main_nav_item {
  background: #edf4ef !important;
  color: var(--brand-700) !important;
}

a.main_nav_item:hover {
  background: #dfece5 !important;
  color: var(--brand-900) !important;
}

a.main_nav_active_item {
  background: var(--brand-700) !important;
  color: #ffffff !important;
  box-shadow: 0 6px 16px rgba(47, 111, 87, 0.28);
}

#left_column_container {
  background-image: none !important;
  background: #f7faf6 !important;
  border-right: 1px solid var(--line-soft);
}

.sub_nav_list li {
  background-image: none !important;
  height: auto !important;
  padding-bottom: 0 !important;
}

a.sub_nav_item,
a.sub_nav_active_item {
  width: auto !important;
  height: auto !important;
  min-height: 40px;
  line-height: 1.3 !important;
  padding: 10px 14px !important;
  background-image: none !important;
  border-radius: 10px;
  margin: 6px 8px;
  box-sizing: border-box;
  text-decoration: none !important;
}

a.sub_nav_item {
  background: #e9f1eb !important;
  color: var(--brand-900) !important;
}

a.sub_nav_item:hover {
  background: #dce9df !important;
}

a.sub_nav_active_item {
  background: var(--accent-500) !important;
  color: #1d3a2f !important;
  font-weight: bold;
}

#content_column {
  background-image: none !important;
  background: #ffffff !important;
}

.content h1,
.content h2,
.content h3 {
  color: var(--brand-900) !important;
  letter-spacing: 0.2px;
}

.content h1 {
  font-size: 30px;
  margin-bottom: 14px;
}

.content h2 {
  font-size: 24px;
}

.content h3 {
  font-size: 19px;
}

.content,
.content p,
.content li {
  color: var(--text-700) !important;
  font-size: 15px;
  line-height: 1.7;
}

.content fieldset {
  background: #ffffff;
  border: 1px solid var(--line-soft) !important;
  border-radius: 12px;
  box-shadow: 0 6px 18px rgba(32, 55, 44, 0.07);
}

.content legend {
  color: var(--brand-700) !important;
  font-weight: bold;
  padding: 0 8px;
}

.content input,
.content textarea,
.content select {
  border: 1px solid #c6d6cc !important;
  border-radius: 8px;
  padding: 8px 10px;
  background: #ffffff;
  color: var(--text-900) !important;
}

#footer {
  background-image: none !important;
  background: #eff4ee !important;
  border-top: 1px solid var(--line-soft);
}

#footer_text {
  width: 100% !important;
  margin: 0 !important;
  padding: 14px 20px !important;
  text-align: center !important;
  color: #5a6862 !important;
  box-sizing: border-box;
}

/* Page 3 - contact form field sizing */
#formcontact table {
  width: 100% !important;
  table-layout: fixed;
  margin-left: 0 !important;
}

#formcontact td {
  vertical-align: top;
}

#formcontact td:first-child {
  width: 24%;
}

#formcontact td:last-child {
  width: 76%;
}

#formcontact input[type="text"],
#formcontact input[type="email"],
#formcontact textarea {
  width: 100% !important;
  max-width: 100%;
  box-sizing: border-box;
}

#formcontact input[type="radio"],
#formcontact input[type="checkbox"] {
  width: auto !important;
}

#formcontact #cp {
  width: 110px !important;
  max-width: 100%;
  display: inline-block;
}

#formcontact #ville {
  width: calc(100% - 122px) !important;
  display: inline-block;
  margin-left: 8px;
}

/* Page 5 - Spry tab panel harmonization */
#TabbedPanels1 .TabbedPanelsTabGroup {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 10px 0;
  padding: 0;
}

#TabbedPanels1 .TabbedPanelsTab {
  top: 0;
  margin: 0;
  padding: 8px 12px;
  border: 1px solid #d6e2d9;
  border-radius: 12px;
  background: #edf4ef;
}

#TabbedPanels1 .TabbedPanelsTabHover {
  background: #dfece5;
}

#TabbedPanels1 .TabbedPanelsTabSelected {
  background: var(--brand-700);
  border-color: var(--brand-700);
}

#TabbedPanels1 .TabbedPanelsContentGroup {
  border: 1px solid #d6e2d9;
  border-radius: 14px;
  background: #ffffff;
  overflow: hidden;
}

#TabbedPanels1 .TabbedPanelsContent {
  padding: 14px;
}

@media (max-width: 768px) {
  #container {
    border-radius: 0;
    box-shadow: none;
  }

  #main_nav_container {
    padding: 10px !important;
  }

  #left_column_container {
    border-right: 0;
    border-bottom: 1px solid var(--line-soft);
  }

  .content h1 {
    font-size: 26px;
  }

  .content h2 {
    font-size: 22px;
  }

  .content h3 {
    font-size: 18px;
  }

  #formcontact #cp,
  #formcontact #ville {
    width: 100% !important;
    margin-left: 0;
  }

  #TabbedPanels1 .TabbedPanelsTab {
    border-radius: 10px;
  }

  #TabbedPanels1 .TabbedPanelsContentGroup {
    border-radius: 12px;
  }
}

/* Pages accueil, références et contact : mise en page autonome. */
.site-refresh { margin: 0; background: #f3f7f2; color: #273037; font: 16px/1.65 system-ui, sans-serif; }
.site-refresh * { box-sizing: border-box; }
.site-refresh a { color: #25473f; text-underline-offset: .2em; }
.site-refresh a:focus-visible, .site-refresh button:focus-visible, .site-refresh input:focus-visible, .site-refresh textarea:focus-visible { outline: 3px solid #25473f; outline-offset: 4px; }
.site-refresh .site-header, .site-refresh main, .site-refresh .site-footer { max-width: 1120px; margin: auto; padding: 24px 32px; }
.site-refresh .site-header { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.site-refresh .brand { font-size: 32px; font-weight: 800; text-decoration: none; letter-spacing: -.04em; }
.site-refresh .brand span { display: block; font-size: 12px; font-weight: 500; letter-spacing: .02em; }
.site-refresh nav { display: flex; flex-wrap: wrap; gap: 8px; }
.site-refresh nav a { padding: 8px 14px; border-radius: 8px; text-decoration: none; }
.site-refresh nav a[aria-current], .site-refresh nav a:hover { background: #dfece5; }
.site-refresh section { margin-bottom: 52px; scroll-margin-top: 20px; }
.site-refresh .hero { padding: 54px 48px; border-radius: 24px; color: white; background: #25473f; }
.site-refresh h1 { font-size: clamp(30px, 4vw, 48px); line-height: 1.15; letter-spacing: -.025em; margin: 14px 0 24px; max-width: 850px; }
.site-refresh h2 { font-size: 28px; line-height: 1.3; }
.site-refresh h3 { font-size: 21px; line-height: 1.35; }
.site-refresh .lead { font-size: 19px; max-width: 760px; }
.site-refresh .eyebrow { text-transform: uppercase; font-size: 12px; font-weight: 700; letter-spacing: .12em; }
.site-refresh .actions { display: flex; flex-wrap: wrap; align-items: center; gap: 24px; margin-top: 30px; }
.site-refresh .button { display: inline-block; width: auto; border: 0; border-radius: 10px; padding: 14px 22px; background: #25473f; color: white; font: inherit; font-weight: 700; text-decoration: none; cursor: pointer; }
.site-refresh .hero .button { background: #d4e7b6; color: #183a2f; }
.site-refresh .hero .text-link { color: white; }
.site-refresh .card-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.site-refresh .service-card, .site-refresh .reference-card, .site-refresh .contact-aside { background: white; border: 1px solid #d9e3dc; border-radius: 16px; padding: 28px; }
.site-refresh .card-number { font-size: 13px; color: #45654f; }
.site-refresh .service-card a { font-weight: 650; }
.site-refresh .method ol { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; padding-left: 20px; }
.site-refresh .method li { padding-left: 4px; }
.site-refresh .method span { display: block; margin-top: 8px; }
.site-refresh .contact-banner { background: #e2ecde; border-radius: 16px; padding: 30px; }
.site-refresh .intro { padding: 24px 0; }
.site-refresh .reference-grid { display: grid; gap: 24px; }
.site-refresh .reference-card { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; align-items: center; }
.site-refresh .reference-card img { display: block; width: 100%; height: auto; border-radius: 8px; }
.site-refresh .reference-card h2 { font-size: 24px; }
.site-refresh .contact-layout { display: grid; grid-template-columns: 2fr 1fr; gap: 32px; align-items: start; }
.site-refresh .simple-contact label { display: block; margin: 18px 0 6px; font-weight: 650; }
.site-refresh .simple-contact input:not([type="hidden"]), .site-refresh .simple-contact textarea { width: 100%; border: 1px solid #82998b; border-radius: 8px; padding: 12px; font: inherit; background: white; color: #273037; }
.site-refresh .field-help { font-size: 14px; color: #4a5963; }
.site-refresh .hp-field { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.site-refresh .message-box { border-radius: 8px; padding: 18px; }
.site-refresh .error { background: #ffe7e7; color: #7a1f1f; }
.site-refresh .success { background: #e2ecde; color: #25473f; }
.site-refresh .site-footer { border-top: 1px solid #d9e3dc; font-size: 14px; }
.site-refresh .skip-link { position: absolute; top: -80px; left: 16px; padding: 12px; background: white; z-index: 1; }
.site-refresh .skip-link:focus { top: 12px; }
@media (max-width: 700px) {
  .site-refresh .site-header { flex-direction: column; align-items: flex-start; }
  .site-refresh .site-header, .site-refresh main, .site-refresh .site-footer { padding: 20px; }
  .site-refresh .hero { padding: 30px 24px; }
  .site-refresh .card-grid, .site-refresh .reference-card, .site-refresh .contact-layout, .site-refresh .method ol { grid-template-columns: 1fr; }
  .site-refresh nav a { padding: 8px 10px; }
}
.site-refresh .project-visual { min-height: 260px; border-radius: 12px; padding: 32px; display: flex; flex-direction: column; justify-content: center; gap: 24px; background: #25473f; color: white; }
.site-refresh .project-visual > span { font-size: 12px; letter-spacing: .12em; }
.site-refresh .project-visual strong { font-size: 28px; line-height: 1.3; }
.site-refresh .energy-visual { background: #e2ecde; color: #25473f; }
.site-refresh .visual-tags { display: flex; flex-wrap: wrap; gap: 8px; }
.site-refresh .visual-tags span { font-size: 12px; padding: 6px 10px; border: 1px solid currentColor; border-radius: 20px; }

.site-refresh .service-navigation { margin: -20px 0 48px; gap: 10px; }
.site-refresh .service-navigation a { background: white; border: 1px solid #d9e3dc; }
.site-refresh .service-navigation a[aria-current="page"] { background: #25473f; color: white; }

/* Identité et présentation des réalisations. */
.site-refresh .brand { display:flex; align-items:center; gap:12px; }
.site-refresh .brand-mark { flex:0 0 44px; width:44px; height:44px; }
.site-refresh .brand .brand-name { font-size:32px; font-weight:800; letter-spacing:-.04em; line-height:1.1; }
.site-refresh .brand .brand-tagline { font-size:12px; font-weight:500; letter-spacing:.02em; line-height:1.6; margin-top:5px; }
.site-refresh .hero { background:radial-gradient(ellipse at top right, #3b6450 0%, #25473f 65%); }
.site-refresh .service-icon { display:inline-flex; align-items:center; justify-content:center; width:48px; height:48px; background:#e4eddf; border-radius:12px; color:#25473f; }
.site-refresh .service-icon svg { width:25px; height:25px; }
.site-refresh .about-section { display:grid; grid-template-columns:220px 1fr; gap:48px; align-items:center; padding:38px; background:#fff; border:1px solid #d9e3dc; border-radius:20px; }
.site-refresh .person-mark { min-height:220px; display:flex; flex-direction:column; justify-content:center; align-items:center; background:#e4eddf; border-radius:18px; color:#25473f; font-size:76px; font-weight:750; letter-spacing:-.06em; }
.site-refresh .person-mark span { font-size:15px; letter-spacing:.12em; font-weight:500; }
.site-refresh .work-teaser { display:grid; grid-template-columns:1fr 1.25fr; gap:36px; align-items:center; }
.site-refresh .teaser-image { display:block; padding:12px; background:#fff; border:1px solid #d9e3dc; border-radius:18px; text-decoration:none; }
.site-refresh .teaser-image img { width:100%; height:auto; display:block; border-radius:10px; }
.site-refresh .teaser-image span, .site-refresh figcaption { display:block; padding:10px 4px 0; font-size:12px; color:#4a5963; }
.site-refresh .reference-preview { margin:0; min-width:0; }
.site-refresh .reference-preview img { width:100%; height:auto; border:1px solid #d9e3dc; }
.site-refresh .project-story { border-left:3px solid #a8c66c; padding-left:16px; margin:20px 0; }
.site-refresh .project-story dt { font-size:12px; font-weight:750; text-transform:uppercase; letter-spacing:.06em; margin-top:12px; }
.site-refresh .project-story dd { margin:4px 0 12px; font-size:15px; }
.site-refresh .legal-copy { background:white; border:1px solid #d9e3dc; border-radius:16px; padding:32px; }
.site-refresh .legal-copy blockquote { margin:0 0 28px; }
.site-refresh .legal-copy h2 { font-size:22px; }
.site-refresh .contact-steps { padding-left:20px; font-size:14px; }
.site-refresh .contact-steps li { margin-bottom:14px; }
@media(max-width:700px){
 .site-refresh .about-section,.site-refresh .work-teaser { grid-template-columns:1fr; gap:24px; }
 .site-refresh .about-section { padding:24px; }
 .site-refresh .person-mark { min-height:140px; font-size:54px; }
 .site-refresh .legal-copy { padding:22px; }
 .site-refresh .brand .brand-tagline { font-size:11px; }
}
.site-refresh .hero a:focus-visible { outline-color:#d4e7b6; }
@media (prefers-reduced-motion: reduce) { .site-refresh * { transition:none !important; scroll-behavior:auto !important; } }

/* Identité pasjac validée : logo complet et icône dédiée aux petites tailles. */
.site-refresh .brand { flex-direction:column; align-items:flex-start; gap:0; }
.site-refresh .brand-logo { display:block; width:200px; height:auto; }
.site-refresh .brand .brand-tagline { margin-top:0; }
@media (max-width:600px) {
 .site-refresh .brand-logo { width:160px; }
}

/* Rappels de la forme et des couleurs du logo, avec texte contrasté. */
.site-refresh .button { border-radius:999px; }
.site-refresh .hero .button { background:#eaf0e1; color:#25473f; }
.site-refresh .service-card { border-radius:24px; border-top:4px solid #91af58; }
.site-refresh .reference-card { border-radius:24px; }
.site-refresh .contact-banner { border-radius:28px; background:#eaf0e1; }
.site-refresh .button:hover { background:#183a2f; color:white; }
.site-refresh .hero .button:hover { background:#d4e7b6; color:#183a2f; }