/* Maison du Fermier — public design system. Reference: approved September 2026 prototype.
   1 Tokens/base  2 Navigation  3 Shared components  4 Home  5 Pages  6 Footer  7 Responsive.
   Keep component rules here; do not append corrective layers. */
:root {
    --mf-green: #0f5b3c;
    --mf-green-dark: #0b4f35;
    --mf-yellow: #f6b91c;
    --mf-orange: #da741b;
    --mf-ink: #15211b;
    --mf-muted: #596b60;
    --mf-line: #dfe7e1;
    --mf-soft: #eaf4ee;
    --mf-cream: #fbf8ef;
    --mf-radius: 22px;
    --mf-shadow: 0 18px 45px rgb(16 52 36 / 10%);
    --mf-width: 1280px;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    scroll-padding-top: 110px;
}

body {
    margin: 0;
    font-family: Inter, 'Segoe UI', Arial, sans-serif;
    color: var(--mf-ink);
    background: #f4f8f5;
    line-height: 1.65;
}

a {
    color: inherit;
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
    text-underline-offset: 4px;
}

img {
    display: block;
    max-width: 100%;
    height: auto;
}

button, input, textarea, select {
    font: inherit;
}

button, a {
    -webkit-tap-highlight-color: transparent;
}

button {
    cursor: pointer;
}

button:disabled {
    cursor: default;
    opacity: .65;
}

:focus-visible {
    outline: 3px solid var(--mf-orange);
    outline-offset: 4px;
}

[hidden] {
    display: none !important;
}

h1, h2 {
    font-family: Georgia, 'Times New Roman', serif;
    line-height: 1.12;
    color: var(--mf-green);
    text-wrap: balance;
}

h1 {
    font-size: clamp(2.5rem, 4.6vw, 4rem);
    margin: 0 0 24px;
}

h2 {
    font-size: clamp(2rem, 3.2vw, 2.9rem);
    margin: 8px 0 22px;
}

h3 {
    color: var(--mf-green);
    line-height: 1.35;
    margin: 0 0 12px;
    font-size: 1.25rem;
}

p {
    margin: 0 0 18px;
}

figure {
    margin: 0;
}

.container {
    width: min(var(--mf-width), calc(100% - 48px));
    margin-inline: auto;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}

.skip-link {
    position: fixed;
    top: -100px;
    left: 20px;
    z-index: 100;
    background: white;
    padding: 12px 20px;
}

.skip-link:focus {
    top: 12px;
}

/* Navigation: same 1100px breakpoint as frontend.js. */
.site-header {
    position: relative;
    z-index: 30;
    background: white;
}

.site-topbar {
    background: var(--mf-yellow);
    color: #183b2c;
    font-size: .82rem;
    font-weight: 650;
}

.topbar-inner, .topbar-contact, .topbar-actions, .topbar-languages {
    display: flex;
    align-items: center;
    gap: 18px;
}

.topbar-inner {
    justify-content: space-between;
    min-height: 38px;
    padding-block: 7px;
}

.topbar-contact {
    flex-wrap: wrap;
    gap: 8px 24px;
}

.topbar-languages {
    gap: 9px;
}

.topbar-languages .is-active {
    text-decoration: underline;
    text-underline-offset: 4px;
}

.topbar-separator:empty {
    display: none;
}

.main-navigation {
    border-bottom: 1px solid var(--mf-line);
}

.navbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-height: 100px;
    gap: 24px;
}

.brand {
    flex: 0 0 160px;
}

.brand-logo {
    width: 160px;
    height: 82px;
    object-fit: contain;
}

.nav-menu, .submenu {
    list-style: none;
    padding: 0;
    margin: 0;
}

.nav-menu {
    display: flex;
    align-items: center;
    gap: clamp(8px, 1.3vw, 22px);
}

.nav-link {
    display: block;
    border: 0;
    padding: 24px 0;
    background: transparent;
    color: var(--mf-ink);
    font-size: .88rem;
    font-weight: 700;
    white-space: nowrap;
}

.nav-link.is-active, .submenu .is-active {
    color: var(--mf-green);
    text-decoration: underline;
    text-decoration-color: var(--mf-yellow);
    text-decoration-thickness: 3px;
    text-underline-offset: 8px;
}

.nav-contact {
    display: inline-flex;
    gap: 12px;
    align-items: center;
    background: var(--mf-yellow);
    padding: 11px 17px;
    border-radius: 12px;
    font-weight: 750;
}

.has-submenu {
    position: relative;
}

.submenu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 235px;
    padding: 12px;
    background: white;
    border: 1px solid var(--mf-line);
    border-radius: 14px;
    box-shadow: var(--mf-shadow);
}

.has-submenu.is-open > .submenu, .has-submenu:focus-within > .submenu {
    display: block;
}

.submenu a {
    display: block;
    padding: 10px 12px;
    border-radius: 8px;
}

.submenu a:hover {
    background: var(--mf-soft);
}

.submenu-arrow {
    margin-left: 5px;
}

.menu-toggle {
    display: none;
    background: transparent;
    border: 1px solid var(--mf-line);
    border-radius: 10px;
    padding: 12px;
}

.menu-toggle span {
    display: block;
    width: 24px;
    height: 2px;
    background: var(--mf-green);
    margin: 5px 0;
}

/* Shared content primitives. */
.section-kicker, .section-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--mf-green);
    text-transform: uppercase;
    letter-spacing: .1em;
    font-size: .76rem;
    font-weight: 800;
}

.section-kicker::before, .section-eyebrow::before {
    content: '';
    width: 32px;
    height: 4px;
    border-radius: 4px;
    background: var(--mf-yellow);
    flex-shrink: 0;
}

.section-heading, .section-header {
    margin-bottom: 30px;
}

.section-heading-row {
    display: flex;
    justify-content: space-between;
    align-items: end;
    flex-wrap: wrap;
    gap: 16px;
    margin-bottom: 28px;
}

.section-heading-row h2 {
    margin-bottom: 0;
}

.section-more-link, .partner-page-link {
    color: var(--mf-green);
    font-weight: 750;
    font-size: .92rem;
}

.hero-button, .about-link, .home-contact-button, .contact-submit, .mf-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    padding: 13px 21px;
    border: 1px solid transparent;
    border-radius: 12px;
    background: var(--mf-yellow);
    color: #183b2c;
    font-weight: 750;
}

.hero-button-secondary {
    color: white;
    background: rgb(255 255 255 / 8%);
    border-color: rgb(255 255 255 / 65%);
}

.hero-button:hover, .mf-button:hover {
    filter: brightness(.97);
}

.cms-content {
    overflow-wrap: anywhere;
    line-height: 1.85;
}

.cms-content p {
    margin-bottom: 1.3em;
}

.cms-content img, .cms-content figure {
    max-width: 100%;
    height: auto;
    border-radius: 18px;
    margin-block: 28px;
}

.cms-content figcaption {
    color: var(--mf-muted);
    font-size: .88rem;
}

.cms-content blockquote {
    border-left: 4px solid var(--mf-yellow);
    margin: 25px 0;
    padding: 20px;
    background: var(--mf-cream);
}

.cms-content table {
    display: block;
    max-width: 100%;
    overflow-x: auto;
}

.cms-content a {
    color: var(--mf-green);
    text-decoration: underline;
}

.lead, .news-lead {
    font-size: 1.15rem;
    color: var(--mf-muted);
}

.mf-empty, .media-empty-state, .partners-empty {
    padding: 32px;
    border: 1px dashed #b8c8bd;
    background: white;
    border-radius: var(--mf-radius);
    color: var(--mf-muted);
    text-align: center;
}

.mf-empty p:last-child {
    margin-bottom: 0;
}

.mf-empty-action {
    text-align: center;
    margin-top: 20px;
}

.mf-empty h3 {
    font-family: Georgia, serif;
    font-size: 1.5rem;
}

/* Home. Photo and copy share the same full-width hero, never a dashboard card. */
.home-hero {
    position: relative;
    background: #073e29;
    color: white;
    isolation: isolate;
}

.hero-layout {
    position: relative;
    min-height: 640px;
    display: flex;
    align-items: center;
}

.hero-copy {
    width: min(var(--mf-width), calc(100% - 48px));
    margin: auto;
    padding: 64px 0 100px;
    z-index: 2;
    pointer-events: none;
}

.hero-copy-inner {
    max-width: 920px;
}

.hero-copy h1 {
    color: white;
    font-size: clamp(2.5rem, 4.2vw, 4rem);
    line-height: 1.06;
    margin-bottom: 24px;
}

.hero-copy p {
    max-width: 660px;
    font-size: 1.12rem;
    color: #edf6f0;
}

.hero-copy .section-kicker {
    color: var(--mf-yellow);
    margin-bottom: 18px;
}

.hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 26px;
    pointer-events: auto;
}

.hero-visual {
    position: absolute;
    inset: 0;
    z-index: 0;
}

.hero-slider {
    width: 100%;
    height: 100%;
}

.hero-slider::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgb(3 35 21 / 93%) 0%, rgb(3 35 21 / 74%) 45%, rgb(3 35 21 / 16%) 100%);
    pointer-events: none;
    z-index: 1;
}

.hero-slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity .7s ease;
}

.hero-slide.is-active {
    opacity: 1;
}

.hero-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hero-slider-btn {
    position: absolute;
    bottom: 56px;
    z-index: 3;
    border: 1px solid rgb(255 255 255 / 55%);
    background: #124e37;
    color: white;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    font-size: 1.5rem;
}

.hero-slider-prev {
    right: 80px;
}

.hero-slider-next {
    right: 28px;
}

.hero-slider-pause {
    right: 132px;
    font-size: .9rem;
}

.hero-slider-dots {
    position: absolute;
    z-index: 3;
    bottom: 65px;
    left: 50%;
    display: flex;
    gap: 8px;
}

.hero-slider-dots button {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: white;
    border: 2px solid white;
    padding: 0;
}

.hero-slider-dots .is-active {
    background: var(--mf-yellow);
}

.mf-domain-strip {
    position: relative;
    z-index: 3;
    margin-top: -32px;
}

.mf-domain-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.mf-domain-strip .mf-domain-grid {
    background: white;
    border-radius: 20px;
    box-shadow: var(--mf-shadow);
    overflow: hidden;
}

.mf-domain {
    display: block;
    padding: 23px 15px;
    text-align: center;
}

.mf-domain + .mf-domain {
    border-left: 1px solid var(--mf-line);
}

.mf-domain strong, .mf-domain small {
    display: block;
}

.mf-domain strong {
    color: var(--mf-green);
    margin-top: 8px;
}

.mf-domain small {
    color: var(--mf-muted);
}

.mf-domain-icon {
    font-size: 1.85rem;
}

.about-preview, .home-actions, .home-products, .home-partners, .home-gallery, .home-contact, .home-updates {
    padding-block: 76px;
}

.about-preview-grid {
    display: grid;
    grid-template-columns: 1.05fr .95fr;
    gap: 50px;
    align-items: center;
}

.about-preview-image {
    position: relative;
}

.about-preview-image > img {
    width: 100%;
    height: 420px;
    object-fit: cover;
    border-radius: 28px;
    box-shadow: var(--mf-shadow);
}

.about-preview-text {
    color: var(--mf-muted);
    margin-bottom: 24px;
}

.about-preview-badge {
    position: absolute;
    bottom: 18px;
    left: 18px;
    padding: 14px 22px;
    background: white;
    border-radius: 14px;
}

.about-preview-badge strong, .about-preview-badge span {
    display: block;
}

.about-pillars {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-block: 24px;
}

.about-pillar {
    display: flex;
    gap: 10px;
    flex: 1 1 130px;
}

.about-pillar-icon {
    font-size: 1.6rem;
}

.about-pillar strong, .about-pillar small {
    display: block;
}

.home-actions, .home-updates {
    background: white;
}

.home-actions .mf-domain-grid {
    gap: 16px;
}

.home-actions .mf-domain {
    background: #f4f8f5;
    border: 1px solid var(--mf-line);
    border-radius: 18px;
}

.mf-products-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
}

.mf-product {
    display:flex;
    flex-direction:column;
    box-shadow:0 8px 28px rgb(16 52 36 / 5%);
    border: 1px solid var(--mf-line);
    border-radius: 18px;
    overflow: hidden;
    background: white;
}

.mf-product img {
    flex-shrink: 0;
    width: 100%;
    height: 240px;
    object-fit: cover;
}

.mf-product-copy { padding:24px; display:flex; flex-direction:column; flex:1; }
.mf-product-copy h3 { font-size:1.4rem; }
.mf-product-copy p { color:var(--mf-muted); overflow-wrap:anywhere; }
.mf-product-link { margin-top:auto; padding-top:16px; color:var(--mf-green); font-weight:700; }
.mf-product:not(:has(img))::before { content:""; height:140px; background:linear-gradient(135deg,var(--mf-soft),var(--mf-cream)); }


.home-impact {
    background: linear-gradient(110deg, #0c5236, #0b6a44);
    color: white;
    padding: 40px 0;
}

.home-impact h2 {
    color: white;
    font-size: 2rem;
}

.mf-impact-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 24px;
    text-align: center;
}

.mf-impact-grid strong {
    display: block;
    font: 2.8rem Georgia, serif;
    margin-bottom: 12px;
    color: var(--mf-yellow);
}

.mf-impact-empty {
    max-width: 740px;
    margin-inline: auto;
    text-align: center;
}

.mf-impact-empty p {
    color: #dcebe3;
    margin: 0;
}

.home-updates > .container {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr);
    gap: 40px;
}

.home-updates .container .container {
    width: 100%;
}

.home-updates .news-grid {
    grid-template-columns: 1fr;
}

.home-updates .news-card {
    display: grid;
    grid-template-columns: 150px minmax(0, 1fr);
}

.home-updates .news-card:not(:has(.news-card-media)) {
    grid-template-columns: 1fr;
}

.home-updates .news-card-media img {
    height: 100%;
    min-height: 170px;
}

.home-updates .section-heading-row { align-items:start; flex-direction:column; gap:10px; margin-bottom:24px; }
.home-updates .news-card-content { padding:18px; }
.home-updates .news-card-content h3 { font-size:1.1rem; min-height:0; -webkit-line-clamp:2; margin-bottom:8px; }
.home-updates .news-card-content p { min-height:0; -webkit-line-clamp:2; font-size:.9rem; margin:0; }
.home-updates .home-event-card { display:grid; grid-template-columns:64px minmax(0,1fr); position:relative; padding:20px; gap:16px; }
.home-updates .home-event-image { display:none; }
.home-updates .home-event-content { min-width:0; }
.home-updates .home-event-content h3 { font-size:1.1rem; overflow-wrap:anywhere; }
.home-updates .home-event-content p { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden; font-size:.9rem; color:var(--mf-muted); }
.home-updates h2 {
    font-size: 2.25rem;
}

.home-contact-box, .page-cta-card {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(0, .7fr);
    gap: 40px;
    border-radius: 28px;
    padding: 48px;
    background: linear-gradient(120deg, #0d4f35, #176844);
    color: white;
}

.home-contact-box h2, .page-cta-card h2 {
    color: white;
}

.home-contact-box .section-eyebrow {
    color: var(--mf-yellow);
}

.home-contact-intro > p {
    color: #dcebe3;
}

.home-contact-details {
    display: grid;
    align-content: center;
    gap: 20px;
}

.home-contact-card {
    display: flex;
    gap: 15px;
    overflow-wrap: anywhere;
}

.home-contact-icon {
    font-size: 1.6rem;
    color: var(--mf-yellow);
}

.home-contact-label {
    font-size: .8rem;
    color: #dcebe3;
}

/* Public pages and data cards. */
.page-hero, .contact-hero, .partners-page-hero, .event-detail-header {
    padding: 28px 0 12px;
}

.page-hero-content, .contact-hero-content, .partners-page-hero-content {
    background: var(--mf-cream);
    border: 1px solid #e8e2d6;
    padding: 26px 32px;
    border-radius: 18px;
    box-shadow: none;
}

.page-hero h1, .contact-hero h1, .partners-page-hero h1 { font-size:clamp(1.8rem,3vw,2.6rem); margin:0 0 10px; }
.page-hero-content > :last-child, .contact-hero-content > :last-child, .partners-page-hero-content > :last-child { margin-bottom:0; }
.news-filters { display:flex; flex-wrap:wrap; gap:16px; align-items:end; padding:20px; background:white; border:1px solid var(--mf-line); border-radius:16px; margin-bottom:24px; }
.news-filters label { display:grid; gap:6px; font-weight:600; flex:1 1 180px; }
.news-filters input, .news-filters select { width:100%; min-height:46px; border:1px solid var(--mf-line); border-radius:8px; padding:10px; font:inherit; background:white; }
.news-pagination { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:18px; margin-top:32px; }
.activities-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr)); gap:24px; }
.activity-card { background:white; border:1px solid var(--mf-line); border-radius:20px; overflow:hidden; display:flex; flex-direction:column; }
.activity-card img { width:100%; height:240px; object-fit:cover; }
.activity-card-copy { padding:26px; }
.activity-card h2 { font-size:1.5rem; line-height:1.3; overflow-wrap:anywhere; }
.activity-card .cms-content { color:var(--mf-muted); overflow-wrap:anywhere; }
.activity-card summary { cursor:pointer; color:var(--mf-green); font-weight:700; margin-top:16px; }
.page-hero p, .contact-hero p, .partners-page-hero p {
    max-width: 790px;
    color: var(--mf-muted);
    font-size: 1.1rem;
}

.editorial-section, .content-section, .mission-page-section, .values-section, .history-section, .mission-vision-section, .program-intro-section, .program-areas-section, .program-method-section, .project-intro-section, .project-list-section, .project-results-section, .news-page-section, .events-page-section, .gallery-page-section, .media-section, .partners-page, .contact-main, .page-cta {
    padding: 36px 0 64px;
}

.editorial-grid, .content-section-grid, .mission-vision-grid, .program-intro-grid, .program-method-grid, .project-intro-grid, .contact-main-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 36px;
    align-items: start;
}

.content-section-grid:not(:has(.content-section-media)), .program-intro-grid:not(:has(figure)), .project-intro-grid:not(:has(figure)) {
    grid-template-columns: 1fr;
}

.editorial-image img, .content-section-media img, .program-intro-image img, .project-intro-image img {
    width: 100%;
    max-height: 480px;
    object-fit: cover;
    border-radius: 24px;
}

.content-card, .mission-card, .vision-card, .history-card, .mv-card, .program-area-card, .project-card, .contact-form-panel, .contact-info-panel {
    padding: 32px;
    border: 1px solid var(--mf-line);
    border-radius: var(--mf-radius);
    background: white;
}

.mv-card-vision, .vision-card {
    background: var(--mf-soft);
}

.mv-card-icon {
    font-size: 2.5rem;
}

.program-areas-grid, .project-grid, .values-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
}

.program-method-list article {
    display: flex;
    gap: 20px;
    border-bottom: 1px solid var(--mf-line);
    padding-block: 18px;
}

.program-method-list strong, .program-area-card > span {
    font-size: 1.5rem;
    color: var(--mf-orange);
}

.project-results-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 22px;
}

.project-results-grid article {
    padding: 25px;
    background: var(--mf-green);
    color: white;
    border-radius: 18px;
}

.project-results-grid strong, .project-results-grid span {
    display: block;
}

.project-results-grid strong {
    font-size: 2.3rem;
}

.project-status {
    display: inline-block;
    padding: 5px 12px;
    background: var(--mf-soft);
    border-radius: 30px;
    color: var(--mf-green);
    margin-bottom: 16px;
}

.project-status.is-done {
    background: var(--mf-cream);
}

.project-meta div {
    display: flex;
    justify-content: space-between;
    gap: 12px;
}

.project-meta dd {
    margin: 0;
}

.news-grid, .gallery-grid, .media-grid, .partners-page-grid, .gallery-page-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
}

.news-card, .home-event-card, .partner-page-card {
    overflow: hidden;
    background: white;
    border: 1px solid var(--mf-line);
    border-radius: var(--mf-radius);
}

.news-card-media img {
    width: 100%;
    height: 220px;
    object-fit: cover;
}

.news-card-content, .partner-page-content {
    padding: 24px;
}

.news-card { display:flex; flex-direction:column; min-width:0; }
.news-card-content { flex:1; min-width:0; }
.news-card-content h2, .news-card-content h3 {
    font-size:1.35rem;
    line-height:1.35;
    margin:0 0 16px;
    min-height:4.05em;
    overflow-wrap:anywhere;
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:3;
    overflow:hidden;
}
.news-card-content p {
    color: var(--mf-muted);
    line-height:1.65;
    min-height:6.6em;
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:4;
    overflow:hidden;
    overflow-wrap:anywhere;
}
.news-card .news-category {
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:1;
    overflow:hidden;
    min-height:1.65em;
}
.news-card:not(:has(.news-card-media))::before { content:""; display:block; height:220px; background:var(--mf-soft); }
.home-updates .news-card:not(:has(.news-card-media))::before { display:none; }

.news-category {
    display: inline-block;
    font-size: .8rem;
    color: var(--mf-green);
    font-weight: 700;
    margin-bottom: 10px;
}

.news-card time {
    display: block;
    color: var(--mf-muted);
    font-size: .85rem;
    margin-bottom: 10px;
}

/* Single-page editorial reading layout: shared alignment for title, cover and body. */
.news-detail .container {
    max-width: 940px;
}

.news-detail-header {
    padding: clamp(32px, 5vw, 64px) 0 24px;
}

.news-detail-header h1 {
    font-size: clamp(1.65rem, 2.7vw, 2.4rem);
    line-height: 1.22;
    margin: 12px 0 20px;
    text-wrap: pretty;
    overflow-wrap: anywhere;
}

.news-detail-header .section-kicker {
    font-size: .75rem;
    letter-spacing: .06em;
    line-height: 1.6;
    overflow-wrap: anywhere;
}

.news-detail-header time {
    display: block;
    font-size: .9rem;
    color: var(--mf-muted);
}

.news-detail-content {
    margin: clamp(24px, 4vw, 40px) 0 72px;
    font-size: clamp(1rem, 1.4vw, 1.125rem);
    line-height: 1.85;
    overflow-wrap: anywhere;
}

.news-detail-content .news-lead {
    font-size: 1.12em;
    line-height: 1.75;
    color: var(--mf-green-dark);
    margin: 0 0 28px;
    padding-bottom: 28px;
    border-bottom: 1px solid var(--mf-line);
}

.news-detail-content .cms-content p {
    margin: 0 0 1.4em;
}

.news-detail-cover img {
    width: 100%;
    height: auto;
    border-radius: 16px;
}

.event-detail-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.events-list {
    display: grid;
    gap: 20px;
}

.home-event-card {
    display: flex;
    align-items: start;
    gap: 18px;
    padding: 22px;
}

.event-date-box {
    flex: 0 0 68px;
    background: var(--mf-soft);
    color: var(--mf-green);
    border-radius: 14px;
    text-align: center;
    padding: 12px 8px;
}

.event-date-box strong {
    display: block;
    font-size: 1.9rem;
    line-height: 1.1;
}

.home-event-content {
    flex: 1;
    min-width: 0;
}

.home-event-image {
    width: 120px;
    flex-shrink: 0;
}

.home-event-image img {
    width: 100%;
    height: 110px;
    object-fit: cover;
    border-radius: 12px;
}

.event-location, .event-meta {
    color: var(--mf-muted);
    font-size: .9rem;
}

.partners-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 22px;
}

.partner-card {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 22px;
    background: white;
    border: 1px solid var(--mf-line);
    border-radius: 18px;
    min-height: 130px;
}

.partner-card img {
    width: 100%;
    height: 85px;
    object-fit: contain;
}

.partner-page-logo {
    padding: 25px;
    background: white;
}

.partner-page-logo img {
    width: 100%;
    height: 140px;
    object-fit: contain;
}

.gallery-card, .gallery-page-item, .media-card {
    position: relative;
    overflow: hidden;
    padding: 0;
    border: 0;
    border-radius: 18px;
    background: var(--mf-soft);
}

.gallery-card img, .gallery-page-item img, .media-card img {
    width: 100%;
    height: 270px;
    object-fit: cover;
    transition: transform .25s;
}

.gallery-page-item:hover img, .gallery-card:hover img {
    transform: scale(1.025);
}

.gallery-page-overlay, .media-card-overlay {
    position: absolute;
    inset: auto 0 0;
    padding: 18px;
    color: white;
    background: linear-gradient(transparent, rgb(0 0 0 / 80%));
}

.media-filter {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 28px;
}

.media-grid > .media-empty-state {
    grid-column: 1 / -1;
}

.media-filter-btn {
    padding: 10px 18px;
    border: 1px solid var(--mf-line);
    border-radius: 30px;
    background: white;
}

.media-filter-btn.active {
    color: white;
    background: var(--mf-green);
}

.media-card-link {
    display: block;
}

.media-placeholder {
    display: grid;
    place-items: center;
    min-height: 270px;
    font-size: 1.25rem;
}

.media-type-icon {
    font-size: 2rem;
}

.gallery-lightbox {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 100;
    align-items: center;
    justify-content: center;
    padding: 30px;
}

.gallery-lightbox.is-visible {
    display: flex;
}

.gallery-lightbox-backdrop {
    position: absolute;
    inset: 0;
    background: rgb(0 0 0 / 90%);
}

.gallery-lightbox-dialog {
    position: relative;
    width: min(100%, 1100px);
    color: white;
}

.gallery-lightbox-dialog img {
    margin: auto;
    max-height: 78vh;
    width: auto;
    object-fit: contain;
}

.gallery-lightbox-close, .gallery-lightbox-navigation {
    position: absolute;
    border: 0;
    border-radius: 50%;
    width: 44px;
    height: 44px;
    background: white;
    color: var(--mf-green);
    font-size: 1.5rem;
    z-index: 1;
}

.gallery-lightbox-close {
    right: 0;
    top: 0;
}

.gallery-lightbox-navigation {
    top: 45%;
}

.gallery-lightbox-previous {
    left: 0;
}

.gallery-lightbox-next {
    right: 0;
}

.gallery-lightbox-caption {
    padding-top: 16px;
    text-align: center;
}

body.has-lightbox {
    overflow: hidden;
}

.contact-info-panel {
    background: var(--mf-green);
    color: white;
}

.contact-info-panel h2, .contact-info-panel .section-kicker {
    color: white;
}

.contact-info-list {
    display: grid;
    gap: 24px;
    margin-block: 25px;
}

.contact-info-item {
    display: flex;
    gap: 16px;
    overflow-wrap: anywhere;
}

.contact-info-item h3 {
    color: white;
}

.contact-info-icon {
    color: var(--mf-yellow);
    font-size: 1.7rem;
}

.contact-social-links {
    display: flex;
    gap: 16px;
}

.contact-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}

.contact-field-full {
    grid-column: 1 / -1;
}

.contact-field label {
    display: block;
    font-weight: 650;
    margin-bottom: 7px;
}

.contact-field input, .contact-field textarea {
    width: 100%;
    min-width: 0;
    padding: 12px;
    border: 1px solid #bdcfc3;
    border-radius: 10px;
    background: white;
}

.contact-field textarea {
    resize: vertical;
}

.contact-submit {
    margin-top: 20px;
}

.contact-alert {
    padding: 18px;
    border-radius: 12px;
    margin-bottom: 20px;
    background: var(--mf-soft);
}

.contact-alert-error {
    background: #fff0ea;
}

/* Footer. */
.site-footer {
    background: var(--mf-green-dark);
    color: white;
    padding-top: 54px;
    border-radius: 28px 28px 0 0;
}

.footer-main {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 28px;
    padding-bottom: 36px;
}

.footer-brand-block {
    grid-column: 1 / -1;
    grid-row: 1;
}

.footer-brand img {
    width: 170px;
    height: 95px;
    object-fit: contain;
    padding: 8px;
    border-radius: 14px;
    background: white;
}

.footer-column h2 {
    color: white;
    font: 700 1rem Inter, 'Segoe UI', sans-serif;
    margin: 0 0 18px;
}

.footer-column ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.footer-column li {
    margin: 8px 0;
    font-size: .9rem;
    color: #dcebe3;
    overflow-wrap: anywhere;
}

.footer-column li span {
    display: block;
    font-size: .75rem;
    color: #b8d0c3;
}

.footer-column strong {
    font-weight: 500;
}

.footer-newsletter {
    border-top: 1px solid rgb(255 255 255 / 18%);
    display: flex;
    justify-content: space-between;
    gap: 30px;
    align-items: center;
    padding-block: 32px;
}

.footer-newsletter h2 {
    color: white;
    font-size: 1.7rem;
}

.footer-newsletter-kicker {
    color: var(--mf-yellow);
}

.footer-newsletter-form {
    display: flex;
    gap: 8px;
}

.footer-newsletter-form input {
    min-width: 0;
    padding: 12px;
    border: 0;
    border-radius: 10px;
}

.footer-newsletter-form button {
    border: 0;
    background: var(--mf-yellow);
    padding: 12px;
    border-radius: 10px;
}

.footer-bottom {
    border-top: 1px solid rgb(255 255 255 / 14%);
    padding-block: 22px;
    color: #dcebe3;
    font-size: .8rem;
}

.footer-bottom-inner, .footer-bottom-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 20px;
}

.footer-bottom p {
    margin: 0;
}

/* Responsive rules belong to their breakpoint, with no historical corrections. */
@media (hover: hover) and (min-width: 1101px) {
    .has-submenu:hover > .submenu {
        display: block;
    }

}

@media (max-width: 1100px) {
    .navbar {
        min-height: 86px;
    }

    .brand-logo {
        height: 72px;
    }

    .menu-toggle {
        display: block;
    }

    .site-navigation {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        padding: 20px 24px;
        background: white;
        box-shadow: var(--mf-shadow);
        max-height: 75vh;
        overflow: auto;
    }

    .site-navigation.is-open {
        display: block;
    }

    .nav-menu {
        display: block;
    }

    .nav-link {
        width: 100%;
        text-align: left;
        padding: 13px 0;
    }

    .submenu {
        position: static;
        border: 0;
        border-left: 3px solid var(--mf-yellow);
        border-radius: 0;
        box-shadow: none;
    }

    .has-submenu:focus-within:not(.is-open) > .submenu {
        display: none;
    }

    .nav-contact {
        margin-top: 14px;
    }

    .home-updates > .container {
        grid-template-columns: 1fr;
    }

    .about-preview-grid {
        gap: 30px;
    }

    .mf-products-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

}

@media (max-width: 800px) {
    .container, .hero-copy {
        width: calc(100% - 36px);
    }

    .about-preview-grid, .editorial-grid, .content-section-grid, .mission-vision-grid, .program-intro-grid, .program-method-grid, .project-intro-grid, .contact-main-grid, .home-contact-box, .page-cta-card {
        grid-template-columns: 1fr;
    }

    .mf-domain-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .mf-domain + .mf-domain {
        border-left: 0;
    }

    .mf-domain-strip .mf-domain:last-child {
        grid-column: 1 / -1;
    }

    .news-grid, .gallery-grid, .gallery-page-grid, .media-grid, .partners-page-grid, .program-areas-grid, .project-grid, .values-grid, .mf-impact-grid, .project-results-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .page-hero-content, .contact-hero-content, .partners-page-hero-content {
        padding: 38px;
    }

    .hero-copy h1 {
        font-size: 3.3rem;
    }

    .hero-slider::after {
        background: linear-gradient(90deg, rgb(3 35 21 / 88%), rgb(3 35 21 / 55%));
    }

    .hero-slider-dots {
        left: 24px;
    }

    .footer-newsletter {
        flex-direction: column;
        align-items: start;
    }

}

@media (max-width: 520px) {
    .container, .hero-copy {
        width: calc(100% - 32px);
    }

    .topbar-inner {
        align-items: start;
        gap: 10px;
    }

    .topbar-contact {
        font-size: .7rem;
        gap: 2px;
        flex-direction: column;
        align-items: start;
    }

    .topbar-actions {
        gap: 8px;
    }

    .brand-logo {
        width: 145px;
    }

    .hero-layout {
        min-height: 590px;
    }

    .hero-copy {
        padding-block: 54px 120px;
    }

    .hero-copy h1 {
        font-size: 2.6rem;
    }

    .hero-copy p {
        font-size: 1rem;
    }

    .hero-actions {
        gap: 10px;
    }

    .hero-button {
        padding: 11px 15px;
        font-size: .9rem;
    }

    .about-preview, .home-actions, .home-products, .home-updates, .home-partners, .home-gallery, .home-contact {
        padding-block: 48px;
    }

    .about-preview-image > img {
        height: 300px;
    }

    .mf-domain {
        padding: 18px 10px;
        font-size: .85rem;
    }

    .news-grid, .gallery-grid, .gallery-page-grid, .media-grid, .partners-page-grid, .program-areas-grid, .project-grid, .values-grid, .mf-products-grid, .project-results-grid, .contact-form-grid {
        grid-template-columns: 1fr;
    }

    .home-updates .news-card {
        grid-template-columns: 1fr;
    }

    .home-updates .news-card-media img {
        height: 210px;
    }

    .home-event-card {
        flex-wrap: wrap;
        padding: 18px;
        gap: 14px;
    }

    .home-event-image {
        width: 100%;
    }

    .home-event-image img {
        height: 180px;
    }

    .page-hero, .contact-hero, .partners-page-hero, .event-detail-header {
        padding-block: 30px;
    }

    .page-hero-content, .contact-hero-content, .partners-page-hero-content, .home-contact-box, .page-cta-card {
        padding: 28px 24px;
    }

    .content-card, .mission-card, .vision-card, .history-card, .mv-card, .contact-form-panel, .contact-info-panel {
        padding: 24px;
    }

    .footer-main {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 28px 18px;
    }

    .footer-newsletter-form {
        width: 100%;
        flex-wrap: wrap;
    }

    .gallery-lightbox {
        padding: 12px;
    }

}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    .hero-slide, .gallery-page-item img, .gallery-card img {
        transition: none;
    }

}

/* Photographs grouped by paragraph; native disclosure keeps extra images accessible without JS. */
.article-photo-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin:2rem 0; }
.article-photo-grid .article-photo { margin:0; min-width:0; }
.article-photo-grid .article-photo img { aspect-ratio:4/3; object-fit:cover; }
.article-photo-grid .article-photo:only-child { grid-column:1/-1; }
.article-photo-grid .article-photo:only-child img { aspect-ratio:auto; object-fit:contain; }
.article-photo-more { margin:-1rem 0 2rem; }
.article-photo-more summary { cursor:pointer; width:fit-content; border:1px solid var(--mf-line); border-radius:24px; padding:10px 20px; background:white; color:var(--mf-green); font-weight:700; }
.article-photo-more[open] .photo-more-closed, .article-photo-more:not([open]) .photo-more-open { display:none; }
/* Editorial photographs inside single-page articles. */
.article-photo { margin: 2rem 0; }
.article-photo img { display: block; width: 100%; height: auto; border-radius: 12px; }
.article-photo figcaption { padding-top: .6rem; font-size: .9rem; color: var(--muted, #64716b); }



/* =========================================================
   HEADER FIXE AU DÉFILEMENT
   ========================================================= */

.site-header {
    position: sticky;
    top: 0;
    z-index: 2000;
    width: 100%;
    background: #ffffff;
    box-shadow: 0 6px 24px rgba(20, 86, 41, 0.08);
}