@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,300;9..144,400;9..144,500;9..144,600&family=Work+Sans:wght@300;400;500;600&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root{
  --sable:#F5F8FC;
  --sable-deep:#E6EEF7;
  --encre:#1C2B3A;
  --encre-soft:#46586B;
  --ocre:#C94F72;
  --ocre-deep:#A63A5C;
  --feuillage:#2F5C8A;
  --or:#3E6FA6;
  --rose:#D98CA0;
  --blanc:#FFFFFF;
  --serif:'Fraunces', serif;
  --sans:'Work Sans', sans-serif;
  --mono:'IBM Plex Mono', monospace;
}

*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{background:var(--sable);color:var(--encre);font-family:var(--sans);line-height:1.6;-webkit-font-smoothing:antialiased;}
a{color:inherit;text-decoration:none;}
img,svg{display:block;max-width:100%;}
::selection{background:var(--ocre);color:var(--blanc);}
:focus-visible{outline:2px solid var(--ocre);outline-offset:3px;}

.wrap{max-width:1180px;margin:0 auto;padding:0 32px;}

.eyebrow{
  font-family:var(--mono);font-size:0.72rem;letter-spacing:0.14em;text-transform:uppercase;
  color:var(--ocre-deep);display:flex;align-items:center;gap:10px;
}
.eyebrow::before{content:"";width:22px;height:1px;background:var(--ocre-deep);display:inline-block;}

/* ---------- NAV ---------- */
header.site{position:sticky;top:0;z-index:50;background:rgba(245,248,252,0.92);backdrop-filter:blur(8px);border-bottom:1px solid rgba(28,43,58,0.1);}
.navbar{display:flex;align-items:center;justify-content:space-between;padding:18px 32px;max-width:1180px;margin:0 auto;}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--serif);font-size:1.15rem;font-weight:500;letter-spacing:0.01em;}
.brand img{width:40px;height:40px;object-fit:contain;flex-shrink:0;}
.brand .sub{font-family:var(--mono);font-size:0.6rem;letter-spacing:0.12em;color:var(--encre-soft);display:block;text-transform:uppercase;margin-top:1px;}
nav.links{display:flex;gap:28px;font-size:0.85rem;flex-wrap:wrap;}
nav.links a{position:relative;padding:4px 0;color:var(--encre-soft);transition:color .2s ease;}
nav.links a:hover, nav.links a.active{color:var(--encre);}
nav.links a::after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:1px;background:var(--ocre);transition:width .25s ease;}
nav.links a:hover::after, nav.links a.active::after{width:100%;}

.btn{display:inline-flex;align-items:center;gap:8px;padding:11px 22px;border-radius:2px;font-size:0.85rem;font-weight:500;letter-spacing:0.01em;transition:all .2s ease;border:1px solid transparent;cursor:pointer;}
.btn-primary{background:var(--ocre);color:var(--blanc);}
.btn-primary:hover{background:var(--ocre-deep);}
.btn-ghost{border-color:var(--encre);color:var(--encre);}
.btn-ghost:hover{background:var(--encre);color:var(--blanc);}
.nav-cta{display:flex;gap:12px;align-items:center;}
@media (max-width:940px){nav.links{display:none;}}

/* ---------- PAGE HEADER (inner pages) ---------- */
.page-header{padding:70px 32px 54px;text-align:center;}
.page-header h1{font-family:var(--serif);font-weight:400;font-size:clamp(2.2rem,4.2vw,3.2rem);margin:16px 0 14px;line-height:1.1;}
.page-header p{max-width:56ch;margin:0 auto;color:var(--encre-soft);font-size:1.02rem;}
.page-header .eyebrow{justify-content:center;}
.page-header .eyebrow::before{display:none;}

/* ---------- SECTION GENERIC ---------- */
section{padding:80px 32px;}
.section-head{max-width:640px;margin-bottom:48px;}
.section-head h2{font-family:var(--serif);font-weight:400;font-size:clamp(1.8rem,3vw,2.4rem);margin-top:14px;line-height:1.15;}
.section-head.center{margin-left:auto;margin-right:auto;text-align:center;}
.section-head.center .eyebrow{justify-content:center;}

/* ---------- VALEURS BAND ---------- */
.valeurs-band{background:var(--encre);color:var(--sable);padding:46px 32px;}
.valeurs-grid{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:repeat(5,1fr);gap:28px;}
@media (max-width:900px){.valeurs-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:520px){.valeurs-grid{grid-template-columns:1fr;}}
.valeur-item{border-top:1px solid rgba(251,247,239,0.22);padding-top:16px;}
.valeur-item .num{font-family:var(--mono);font-size:0.72rem;color:var(--rose);letter-spacing:0.08em;}
.valeur-item h3{font-family:var(--serif);font-weight:400;font-size:1.28rem;margin:8px 0 8px;}
.valeur-item p{font-size:0.86rem;color:rgba(251,247,239,0.72);line-height:1.5;}

/* ---------- CARDS GRID (generic) ---------- */
.card-grid{max-width:1180px;margin:0 auto;display:grid;gap:1px;background:rgba(28,43,58,0.1);border:1px solid rgba(28,43,58,0.1);}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-2{grid-template-columns:repeat(2,1fr);}
@media (max-width:860px){.grid-3{grid-template-columns:1fr;}.grid-2{grid-template-columns:1fr;}}
.info-card{background:var(--blanc);padding:32px 28px;}
.info-card .tag{font-family:var(--mono);font-size:0.68rem;letter-spacing:0.1em;text-transform:uppercase;color:var(--feuillage);}
.info-card h3, .info-card h4{font-family:var(--serif);font-weight:400;font-size:1.18rem;margin:12px 0 10px;}
.info-card p{font-size:0.9rem;color:var(--encre-soft);}

/* ---------- BUDGET / TRANSPARENCE ---------- */
.dark-section{background:var(--encre);color:var(--sable);}
.dark-section .section-head p{color:rgba(251,247,239,0.7);}
.dark-section .eyebrow{color:var(--or);}
.dark-section .eyebrow::before{background:var(--or);}

.budget-figure{font-family:var(--mono);}
.budget-row{display:flex;justify-content:space-between;align-items:baseline;padding:16px 0;border-bottom:1px solid rgba(251,247,239,0.15);font-size:0.92rem;}
.budget-row .label{color:rgba(251,247,239,0.65);}
.budget-row .val{font-size:1rem;letter-spacing:0.01em;}
.budget-total{display:flex;justify-content:space-between;align-items:baseline;padding-top:22px;margin-top:6px;}
.budget-total .label{font-family:var(--sans);font-size:0.95rem;color:var(--sable);}
.budget-total .val{font-family:var(--mono);font-size:1.9rem;color:var(--or);}

.progress-block{margin-top:30px;}
.progress-labels{display:flex;justify-content:space-between;font-family:var(--mono);font-size:0.75rem;margin-bottom:8px;color:rgba(251,247,239,0.75);}
.progress-track{width:100%;height:6px;background:rgba(251,247,239,0.14);border-radius:4px;overflow:hidden;}
.progress-fill{height:100%;width:0.6%;background:var(--or);border-radius:4px;}
.progress-note{margin-top:12px;font-size:0.82rem;color:rgba(251,247,239,0.55);font-style:italic;}

/* ---------- GALERIE ---------- */
.galerie{background:var(--blanc);border-top:1px solid rgba(28,43,58,0.08);}
.gal-grid{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:1.3fr 1fr;grid-template-rows:auto auto;gap:18px;}
@media (max-width:860px){.gal-grid{grid-template-columns:1fr;}}
.gal-item{position:relative;overflow:hidden;background:var(--sable-deep);border:1px solid rgba(28,43,58,0.1);}
.gal-item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease;}
.gal-item:hover img{transform:scale(1.035);}
.gal-item.tall{grid-row:span 2;}
.gal-cap{position:absolute;left:0;right:0;bottom:0;padding:16px 18px;background:linear-gradient(180deg, rgba(28,43,58,0) 0%, rgba(28,43,58,0.82) 100%);color:var(--sable);}
.gal-cap .t{font-family:var(--serif);font-size:1.05rem;}
.gal-cap .s{font-family:var(--mono);font-size:0.65rem;letter-spacing:0.06em;text-transform:uppercase;color:rgba(251,247,239,0.65);margin-top:3px;}
.gal-disclaimer{max-width:1180px;margin:26px auto 0;font-size:0.85rem;color:var(--encre-soft);border-left:2px solid var(--ocre);padding-left:16px;font-style:italic;}

/* ---------- DOCUMENTS ---------- */
.doc-list{max-width:900px;margin:0 auto;display:flex;flex-direction:column;gap:1px;background:rgba(28,43,58,0.1);border:1px solid rgba(28,43,58,0.1);}
.doc-row{background:var(--blanc);padding:26px 28px;display:flex;align-items:center;gap:22px;justify-content:space-between;flex-wrap:wrap;}
.doc-left{display:flex;align-items:center;gap:18px;}
.doc-icon{width:42px;height:52px;flex-shrink:0;border:1.5px solid var(--encre);border-radius:2px;position:relative;}
.doc-icon::after{content:"";position:absolute;top:8px;left:7px;right:7px;height:1.5px;background:var(--encre);box-shadow:0 6px 0 var(--encre), 0 12px 0 var(--encre);opacity:0.5;}
.doc-title{font-family:var(--serif);font-size:1.08rem;}
.doc-meta{font-family:var(--mono);font-size:0.72rem;color:var(--encre-soft);margin-top:4px;letter-spacing:0.03em;}
.doc-status{font-family:var(--mono);font-size:0.68rem;letter-spacing:0.08em;text-transform:uppercase;padding:5px 11px;border-radius:2px;white-space:nowrap;}
.status-ready{background:rgba(47,92,138,0.12);color:var(--feuillage);}
.status-pending{background:rgba(201,79,114,0.12);color:var(--ocre-deep);}

/* ---------- CTA FINALE ---------- */
.cta-final{background:var(--ocre);color:var(--blanc);text-align:center;padding:90px 32px;}
.cta-final .eyebrow{color:rgba(251,247,239,0.85);justify-content:center;}
.cta-final .eyebrow::before{background:rgba(251,247,239,0.85);}
.cta-final h2{font-family:var(--serif);font-weight:400;font-size:clamp(1.9rem,4vw,2.7rem);max-width:18ch;margin:16px auto 28px;line-height:1.15;}
.cta-final .btn-primary{background:var(--encre);}
.cta-final .btn-primary:hover{background:#0F1822;}
.cta-final .btn-ghost{border-color:var(--blanc);color:var(--blanc);}
.cta-final .btn-ghost:hover{background:var(--blanc);color:var(--ocre);}
.cta-row{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}

/* ---------- FOOTER ---------- */
footer{background:var(--encre);color:rgba(251,247,239,0.6);padding:52px 32px 32px;font-size:0.85rem;}
.footer-grid{max-width:1180px;margin:0 auto;display:flex;justify-content:space-between;flex-wrap:wrap;gap:24px;padding-bottom:28px;border-bottom:1px solid rgba(251,247,239,0.12);}
.footer-brand{font-family:var(--serif);color:var(--sable);font-size:1.1rem;}
.footer-cols{display:flex;gap:60px;flex-wrap:wrap;}
.footer-cols div h5{font-family:var(--mono);font-size:0.68rem;letter-spacing:0.1em;text-transform:uppercase;color:rgba(251,247,239,0.4);margin-bottom:12px;}
.footer-cols div a{display:block;margin-bottom:8px;color:rgba(251,247,239,0.72);}
.footer-cols div a:hover{color:var(--or);}
.footer-bottom{max-width:1180px;margin:22px auto 0;display:flex;justify-content:space-between;font-size:0.75rem;color:rgba(251,247,239,0.35);flex-wrap:wrap;gap:10px;}

/* ---------- FORM (contact) ---------- */
.form-wrap{max-width:640px;margin:0 auto;}
.field{margin-bottom:20px;}
.field label{display:block;font-family:var(--mono);font-size:0.72rem;letter-spacing:0.06em;text-transform:uppercase;color:var(--encre-soft);margin-bottom:8px;}
.field input, .field textarea, .field select{
  width:100%;padding:12px 14px;border:1px solid rgba(28,43,58,0.25);background:var(--blanc);
  font-family:var(--sans);font-size:0.92rem;color:var(--encre);border-radius:2px;
}
.field textarea{resize:vertical;min-height:120px;}
.field input:focus, .field textarea:focus, .field select:focus{outline:2px solid var(--ocre);outline-offset:1px;border-color:var(--ocre);}

/* reveal on scroll */
.reveal{opacity:0;transform:translateY(14px);transition:opacity .7s ease, transform .7s ease;}
.reveal.in{opacity:1;transform:translateY(0);}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none;}html{scroll-behavior:auto;}}

/* ---------- EXTRA COMPONENTS (added for full site) ---------- */

/* Timeline (Le Projet) */
.timeline{max-width:900px;margin:0 auto;display:flex;flex-direction:column;gap:1px;background:rgba(28,43,58,0.1);border:1px solid rgba(28,43,58,0.1);}
.timeline-row{background:var(--blanc);padding:26px 28px;display:flex;gap:22px;align-items:flex-start;}
.timeline-num{font-family:var(--mono);font-size:0.85rem;color:var(--ocre-deep);flex-shrink:0;width:64px;letter-spacing:0.04em;padding-top:2px;}
.timeline-body h4{font-family:var(--serif);font-weight:400;font-size:1.1rem;margin-bottom:6px;}
.timeline-body p{font-size:0.9rem;color:var(--encre-soft);}

/* Simple data table (budget detail) */
.table-wrap{max-width:900px;margin:0 auto;overflow-x:auto;}
table.budget-table{width:100%;border-collapse:collapse;font-size:0.9rem;}
table.budget-table th{text-align:left;font-family:var(--mono);font-size:0.68rem;letter-spacing:0.08em;text-transform:uppercase;color:var(--encre-soft);padding:10px 14px;border-bottom:1px solid rgba(28,43,58,0.25);}
table.budget-table td{padding:12px 14px;border-bottom:1px solid rgba(28,43,58,0.08);color:var(--encre);}
table.budget-table td.num{font-family:var(--mono);text-align:right;}
table.budget-table tr.total td{font-weight:600;border-top:1.5px solid var(--encre);border-bottom:none;}

.dark-section table.budget-table th{color:rgba(251,247,239,0.55);border-bottom-color:rgba(251,247,239,0.2);}
.dark-section table.budget-table td{color:var(--sable);border-bottom-color:rgba(251,247,239,0.12);}
.dark-section table.budget-table tr.total td{color:var(--or);border-top-color:rgba(251,247,239,0.4);}

/* Stat row (Impact) */
.stat-grid{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(28,43,58,0.1);border:1px solid rgba(28,43,58,0.1);}
@media (max-width:860px){.stat-grid{grid-template-columns:repeat(2,1fr);}}
.stat-item{background:var(--blanc);padding:30px 24px;text-align:center;}
.stat-item .n{font-family:var(--serif);font-size:2.2rem;color:var(--ocre-deep);}
.stat-item .l{font-family:var(--mono);font-size:0.72rem;letter-spacing:0.06em;text-transform:uppercase;color:var(--encre-soft);margin-top:6px;}

/* Contact page layout */
.contact-grid{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:0.9fr 1.1fr;gap:60px;}
@media (max-width:860px){.contact-grid{grid-template-columns:1fr;}}
.contact-info h4{font-family:var(--serif);font-weight:400;font-size:1.1rem;margin:22px 0 8px;}
.contact-info p{color:var(--encre-soft);font-size:0.92rem;}
.contact-info a{color:var(--ocre);border-bottom:1px solid var(--ocre);}
.form-note{font-size:0.82rem;color:var(--encre-soft);margin-top:14px;font-style:italic;}
.form-success{display:none;background:rgba(47,92,138,0.1);border:1px solid var(--feuillage);color:var(--feuillage);padding:16px 20px;border-radius:2px;font-size:0.9rem;margin-bottom:20px;}
.form-success.show{display:block;}

/* Donation options (Documents) */
.don-grid{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(28,43,58,0.1);border:1px solid rgba(28,43,58,0.1);}
@media (max-width:860px){.don-grid{grid-template-columns:1fr;}}
.don-item{background:var(--blanc);padding:32px 28px;text-align:center;}
.don-item h4{font-family:var(--serif);font-weight:400;font-size:1.15rem;margin:10px 0 10px;}
.don-item p{font-size:0.88rem;color:var(--encre-soft);margin-bottom:18px;}
