/* Maquette v10 : repères visuels observés sur feae.cfdt.fr le 17 octobre 2026. */
:root {
  --orange: #d4622c;
  --orange-dark: #bd4b1f;
  --purple: #41467f;
  --ink: #171a28;
  --muted: #4b4d58;
  --cream: #fbf6f0;
  --peach: #f6e3d5;
  --line: #e8dbd1;
}

body { background: #fff; color: var(--ink); font-family: Arial, Helvetica, sans-serif; }
.shell { width: min(1180px, calc(100% - 48px)); }
h1, h2, h3 { color: var(--ink); font-weight: 900; letter-spacing: -.045em; }
.site-header { background: #fff; box-shadow: 0 4px 20px rgba(23,26,40,.08); }
.network-bar { max-height: 42px; overflow: hidden; background: #f8f8fa; color: #333745; font-size: .72rem; font-weight: 700; transition: max-height .22s ease, opacity .22s ease; }
.network-bar .shell { min-height: 42px; display: flex; justify-content: flex-end; align-items: center; gap: 32px; }
.network-bar strong { margin-right: auto; color: var(--orange-dark); text-transform: uppercase; letter-spacing: .055em; }
.network-bar a { text-decoration: none; }
.network-bar a:hover { text-decoration: underline; text-underline-offset: 3px; }
.site-header.is-compact .network-bar { max-height: 0; opacity: 0; }
.site-header .header-inner { min-height: 91px; }
.site-header .brand { width: 179px; flex-basis: 179px; }
.site-header.is-compact .header-inner { min-height: 64px; }
.site-header.is-compact .brand { width: 130px; flex-basis: 130px; }
.navigation { gap: 6px; font-size: .84rem; }
.navigation a { padding: 11px 12px; border-radius: 22px; }
.navigation a:hover, .navigation a[aria-current=page] { background: #fbf0e9; color: var(--orange-dark); text-decoration: none; }
.navigation .nav-contact { margin-left: 8px; padding: 10px 19px; border: 0; border-radius: 28px; background: var(--orange); color: #fff; }
.navigation .nav-contact:hover { background: var(--orange-dark); color: #fff; }
.menu-toggle { border-radius: 22px; }
html { scroll-padding-top: 108px; }

/* Le carrousel garde les photos locales et devient un bloc éditorial clair. */
.carousel { height: 575px; background: #fbf8f5; border-bottom: 1px solid #eadfd7; }
.slide-image { object-position: center 42%; }
.slide-one .slide-image { object-position: center 42%; }
.slide-four .slide-image { object-position: center 42%; }
.slide-shade, .slide-four .slide-shade {
  background: linear-gradient(90deg, rgba(250,250,251,.98) 0%, rgba(250,250,251,.96) 38%, rgba(250,250,251,.83) 52%, rgba(250,250,251,.06) 88%);
}
.slide-content { color: var(--ink); padding-bottom: 64px; }
.slide h1, .slide h2 { color: var(--ink); max-width: 675px; font-size: clamp(2.9rem, 4.7vw, 4.7rem); line-height: 1.04; }
.slide h1::after, .slide h2::after { content: ""; display: block; width: 102px; height: 5px; margin-top: 21px; border-radius: 4px; background: var(--orange); }
.slide-kicker { color: var(--orange-dark); }
.slide-identity { background: var(--orange); color: #fff; }
.slide-kicker { letter-spacing: .09em; }
.slide-content p:not(.slide-kicker) { color: #343643; max-width: 570px; font-size: 1.08rem; line-height: 1.55; }
.slide-content a { display: inline-flex; align-items: center; gap: 15px; padding: 8px 8px 8px 22px; border-radius: 28px; background: var(--ink); color: #fff; text-decoration: none; font-size: .88rem; }
.slide-content a:hover { background: var(--orange-dark); }
.slide-content a span { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: #fff; color: var(--ink); }
.carousel-controls { bottom: 19px; }
.carousel-arrow, .carousel-pause, .carousel-dots button { background: #fff; border-color: #5c5d68; color: var(--ink); }
.carousel-dots button.is-active { background: var(--orange); border-color: var(--orange); }
.carousel-pause { border-radius: 22px; }
.photo-disclosure { background: rgba(255,255,255,.86); color: var(--ink); }

.section { padding: 92px 0; }
.section-label, .page-eyebrow { color: var(--orange-dark); letter-spacing: .07em; }
.intro { background: #fff; }
.intro-grid { gap: 85px; }
.intro-grid h2 { max-width: 520px; }
.figures-section { background: var(--orange); padding: 38px 0; }
.figures { gap: 0; }
.figures>div { padding: 13px 30px; }
.figures>div:first-child { padding-left: 0; }
.figures strong { font-size: clamp(1.45rem, 2.3vw, 2.15rem); }
.figures span { max-width: 325px; }
.action-section, .proximity-section, .page-section-soft, .sources-section { background: var(--cream); }
.action-track .card, .territory-grid article, .steps-grid article, .organism-grid>div, .instance-grid>article, .site-map-wrap, .site-panel {
  border: 1px solid #e6ddd6; border-top: 4px solid var(--orange); box-shadow: 6px 6px 0 var(--ink);
}
.action-track .card { min-height: 255px; }
.card-number { font-size: 1rem; margin-bottom: 24px; }
.card h3 { font-size: 1.55rem; }
.news-panel { background: #48262b; box-shadow: 8px 8px 0 var(--ink); }
.news-panel h3 { color: #fff; }
.button { border-radius: 28px; padding: 13px 20px; }
.button-orange, .election-callout { background: var(--orange); }
.button-orange:hover { background: var(--orange-dark); }
.button-dark { background: var(--ink); }
.election-callout { padding: 32px 0; }
.election-callout h2 { color: #fff; }
.election-callout .eyebrow { color: #fff2e9; }
.contact-box, .ballot-panel { box-shadow: 7px 7px 0 var(--ink); }
.contact-box>a:not(.button), .source-links a, .inventory summary { color: var(--purple); }
.join-section { background: var(--peach); }
.site-footer { background: #1b1e2b; }
.page-hero { background: #f8f5f1; color: var(--ink); border-bottom: 8px solid var(--orange); padding: 78px 0 84px; }
.page-hero h1 { color: var(--ink); }
.page-hero p:not(.page-eyebrow) { color: #3d3e48; }
.page-eyebrow { color: var(--orange-dark); }
.election-hero { background: #f8e3d3; }
.hero-button { background: var(--ink); color: #fff; border-radius: 28px; }
.ballot-panel strong { color: #fff; }

@media (max-width: 900px) {
  .network-bar .shell { gap: 17px; }
  .slide-shade, .slide-four .slide-shade { background: linear-gradient(90deg, rgba(250,250,251,.98), rgba(250,250,251,.85) 65%, rgba(250,250,251,.35)); }
  .figures>div { padding: 13px 17px; }
}
@media (max-width: 850px) {
  .navigation { top: 100%; gap: 3px; }
  .navigation a { border-radius: 8px; }
  .navigation .nav-contact { margin-left: 0; }
}
@media (max-width: 650px) {
  .shell { width: min(100% - 32px, 1180px); }
  .network-bar { font-size: .62rem; }
  .network-bar .shell { min-height: 32px; gap: 10px; }
  .network-bar strong { display: none; }
  .site-header .header-inner { min-height: 71px; }
  .site-header .brand { width: 145px; flex-basis: 145px; }
  .site-header.is-compact .header-inner { min-height: 58px; }
  .site-header.is-compact .brand { width: 118px; flex-basis: 118px; }
  .carousel { height: 670px; }
  .slide-image, .slide-one .slide-image, .slide-four .slide-image { object-fit: cover; object-position: 65% center; }
  .slide-shade, .slide-two .slide-shade, .slide-three .slide-shade, .slide-four .slide-shade { background: linear-gradient(180deg, rgba(250,250,251,.99) 0%, rgba(250,250,251,.97) 57%, rgba(250,250,251,.73) 79%, rgba(250,250,251,.3) 100%); }
  .slide-content { justify-content: flex-start; padding-top: 50px; padding-bottom: 80px; }
  .slide h1, .slide h2 { font-size: clamp(2.25rem, 8.7vw, 3.2rem); margin-bottom: 17px; }
  .slide h1::after, .slide h2::after { margin-top: 13px; }
  .slide-kicker { font-size: .7rem; margin-bottom: 12px; }
  .slide-content p:not(.slide-kicker) { font-size: .94rem; line-height: 1.4; margin-bottom: 16px; }
  .slide-content a { padding: 5px 5px 5px 17px; }
  .carousel-controls { bottom: 15px; }
  .section { padding: 65px 0; }
  .figures>div, .figures>div:first-child { padding: 8px 0 20px; }
  .page-hero { padding: 58px 0 64px; }
  .action-track .card { min-height: auto; }
  html { scroll-padding-top: 77px; }
}
@media (prefers-reduced-motion: reduce) { .network-bar { transition: none; } }