/* Harambee — en-tête et bas de page communs à toutes les pages publiques (09/10/2026).
   Reprend à l'identique la barre et le pied de la landing (maquette validée 01_Accueil_Harambee_HD).
   Classes préfixées « se- » pour ne pas heurter les styles propres à chaque page
   (header{position:sticky}, footer{padding}, *{margin:0}, a{text-decoration:none}…).
   Sur un sous-domaine de club, /assets/js/site-entete.js pose html.se-club : SEULS le logo et le nom
   du club changent. Depuis le 10/10/2026 l'en-tête garde partout le bleu nuit du nouveau design
   (plus de fond ni d'accent aux couleurs du club). */
:root{
  --se-nuit:#031421; --se-nuit-2:#020f19; --se-nuit-3:#041725; --se-filet:#1b2833;
  --se-or:#f5bd13; --se-or-charte:#D4A017; --se-vert:#06814a; --se-vert-hover:#056b3d; --se-blanc:#ffffff;
  --se-texte-doux:#c3ced8;
  --se-serif:'Libre Caslon Text',Georgia,'Times New Roman',serif;
  --se-titre:'Outfit','Nunito',system-ui,sans-serif;
  --se-bouton:'Nunito','Outfit',system-ui,sans-serif;
  --se-corps:'Fira Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --se-gouttiere:clamp(16px,3vw,43px);
  --se-fond:var(--se-nuit);
  --se-accent:var(--se-or);
}

/* Mode club (10/10/2026) : TOUTES les pages publiques du club gardent exactement les couleurs de la
   plateforme. /brand.css du club pose --bp/--ba/--bo aux couleurs du club ; on les ramène ici aux
   valeurs de la plateforme (html.se-club l'emporte sur :root). Seuls le logo et le nom changent. */
html.se-club{--bp:#0A1428;--ba:#D4A017;--bo:#C8860A}

/* ---------- Barre de navigation ---------- */
header.se-entete{position:relative;top:auto;z-index:1000;display:block;height:auto;margin:0;padding:0;background:var(--se-fond);box-shadow:0 2px 14px rgba(0,0,0,.35);font-family:var(--se-corps);line-height:1.5}
header.se-entete *,header.se-entete *::before,header.se-entete *::after,footer.se-pied *,footer.se-pied *::before,footer.se-pied *::after{box-sizing:border-box}
.se-in{display:flex;align-items:center;gap:24px;min-height:88px;max-width:none;margin:0;padding:0 var(--se-gouttiere)}
.se-logo{display:inline-flex;align-items:center;min-height:44px;margin:0;padding:0;text-decoration:none;font-family:var(--se-serif);font-weight:700;font-size:32px;line-height:1;white-space:nowrap;color:var(--se-blanc)}
.se-logo .h{color:var(--se-or)}
.se-logo .pt{color:var(--se-or);font-family:var(--se-titre);margin:0 3px 0 2px}
.se-logo .nom{color:var(--se-blanc);font-family:var(--se-bouton);font-weight:900;letter-spacing:-.5px;font-size:29px}
.se-logo img{display:block;height:48px;width:auto;max-width:96px;border-radius:8px;background:#fff;margin-right:12px;flex:none}
.se-logo .se-club-nom{font-family:var(--se-bouton);font-weight:900;font-size:22px;letter-spacing:-.3px;color:var(--se-blanc);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
html.se-club .se-logo{visibility:hidden}
html.se-club .se-logo.se-pret{visibility:visible}
.se-nav{display:block;margin:0;padding:0}
.se-liens{display:flex;gap:6px;margin:0 0 0 clamp(12px,3vw,60px);padding:0;list-style:none}
.se-liens li{margin:0;padding:0;list-style:none}
.se-liens a{display:inline-flex;align-items:center;min-height:44px;margin:0;padding:0 15px;text-decoration:none;color:var(--se-blanc);background:none;font-family:var(--se-bouton);font-weight:800;font-size:16px;line-height:1.2;border-radius:8px;white-space:nowrap}
.se-liens a:hover{color:var(--se-accent)}
.se-liens a[aria-current]{color:var(--se-blanc)}
.se-actions{display:flex;align-items:center;gap:12px;margin:0 0 0 auto;padding:0}
.se-langue{display:inline-flex;align-items:center;gap:4px;min-height:44px;padding:0 10px;color:var(--se-blanc);font-family:var(--se-bouton);font-weight:800;font-size:14px}
.se-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:46px;margin:0;padding:0 20px;border:0;border-radius:999px;text-decoration:none;font-family:var(--se-bouton);font-weight:800;font-size:15px;line-height:1.2;white-space:nowrap;box-shadow:none;transform:none;transition:background-color .2s,color .2s,border-color .2s}
.se-btn-blanc{background:var(--se-blanc);color:#0b1620}
.se-btn-blanc:hover{background:#e9eef2;color:#0b1620}
.se-btn-vert{background:var(--se-vert);color:var(--se-blanc)}
.se-btn-vert:hover{background:var(--se-vert-hover);color:var(--se-blanc)}
header.se-entete a:focus-visible,header.se-entete summary:focus-visible,footer.se-pied a:focus-visible{outline:3px solid var(--se-or);outline-offset:3px;border-radius:8px}
.se-menu{display:none;margin:0 0 0 auto}
.se-menu summary{list-style:none;display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:10px;cursor:pointer;color:var(--se-blanc);border:1px solid #2a3a48}
.se-menu summary::-webkit-details-marker{display:none}
.se-menu .ico-fermer{display:none}
.se-menu[open] .ico-ouvrir{display:none}
.se-menu[open] .ico-fermer{display:block}
.se-menu-panneau{position:absolute;left:0;right:0;top:100%;z-index:1001;background:var(--se-fond);border-top:1px solid var(--se-filet);box-shadow:0 12px 30px rgba(0,0,0,.35);padding:12px var(--se-gouttiere) 20px;display:grid;gap:6px;max-height:calc(100vh - 88px);overflow-y:auto}
.se-menu-panneau a:not(.se-btn){display:flex;align-items:center;min-height:48px;margin:0;padding:0 8px;color:var(--se-blanc);text-decoration:none;font-family:var(--se-bouton);font-weight:800;font-size:16px;border-bottom:1px solid var(--se-filet)}
.se-menu-panneau a[aria-current]{color:var(--se-accent)}
.se-menu-panneau .se-btn{width:100%;margin-top:8px}

/* ---------- Bas de page ---------- */
footer.se-pied{display:block;margin:0;padding:0;background:#020b13;border-top:1px solid var(--se-filet);color:var(--se-texte-doux);font-family:var(--se-corps);font-size:15px;line-height:1.5;text-align:left}
.se-pied-in{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr));gap:32px;max-width:none;margin:0;padding:48px var(--se-gouttiere) 32px}
footer.se-pied h2{margin:0 0 12px;padding:0;font-family:var(--se-titre);font-size:16px;font-weight:700;line-height:1.3;color:var(--se-blanc);letter-spacing:.3px;text-transform:none}
footer.se-pied ul{list-style:none;margin:0;padding:0}
footer.se-pied li{margin:0;padding:0;font-size:15px}
footer.se-pied li a{display:inline-flex;align-items:center;min-height:44px;color:var(--se-texte-doux);text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(195,206,216,.35)}
footer.se-pied li a:hover{color:var(--se-or)}
footer.se-pied .se-logo{font-size:26px}
footer.se-pied .se-logo .nom{font-size:24px}
footer.se-pied .se-logo .se-club-nom{font-size:20px}
footer.se-pied p{margin:12px 0 0;max-width:36ch;line-height:1.55;color:var(--se-texte-doux);font-size:15px}
footer.se-pied .se-risque{font-size:13px;color:#9fb0bf}
.se-pied-bas{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;max-width:none;margin:0;padding:18px var(--se-gouttiere) 26px;border-top:1px solid var(--se-filet);font-size:14px;color:#9fb0bf;text-align:left}

/* ---------- Adaptatif (mêmes seuils que la landing) ---------- */
@media (max-width:1180px){
  .se-liens a{padding:0 9px;font-size:15px}
  .se-liens{margin-left:8px}
  .se-actions{gap:8px}
}
@media (max-width:1279px){
  .se-nav,.se-actions{display:none}
  .se-menu{display:block}
  .se-in{gap:12px}
  .se-logo{min-width:0;flex:1 1 auto}
  .se-pied-in{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .se-logo{font-size:27px}.se-logo .nom{font-size:24px}
  .se-logo .se-club-nom{font-size:18px}
  .se-logo img{height:40px}
  .se-pied-in{grid-template-columns:minmax(0,1fr)}
}

/* ---------- Habillage des pages intérieures (body.se-page) ----------
   Typographies et couleurs de la landing ; le contenu de chaque page reste le sien. */
body.se-page{font-family:var(--se-corps)}
body.se-page input,body.se-page select,body.se-page textarea,body.se-page button{font-family:var(--se-corps)}
body.se-page main h1,body.se-page main h2,body.se-page main h3,body.se-page main h4,
body.se-page section h1,body.se-page section h2,body.se-page section h3,body.se-page section h4{font-family:var(--se-titre);letter-spacing:-.2px}
body.se-page .page-hero,body.se-page .legal-hero{background:linear-gradient(180deg,var(--se-nuit) 0%,var(--se-nuit-3) 100%);color:var(--se-blanc)}
body.se-page .page-hero h1,body.se-page .legal-hero h1{font-family:var(--se-serif);font-weight:700;letter-spacing:-.5px;text-shadow:0 3px 14px rgba(0,0,0,.45)}
body.se-page .page-hero h1 em,body.se-page .legal-hero h1 em{color:var(--se-or-charte)}
body.se-page .page-hero p,body.se-page .legal-hero p{color:var(--se-texte-doux)}
/* Boutons d'action : pilule verte de la landing */
body.se-page .btn-cta,body.se-page .btn-join,body.se-page .btn-register,body.se-page .btn-submit,
body.se-page .btn-hero-primary,body.se-page .btn-invest-cta,body.se-page .btn-primary,body.se-page .btn-invest{
  background:var(--se-vert);color:var(--se-blanc);border:0;border-radius:999px;font-family:var(--se-bouton);font-weight:800;box-shadow:none}
body.se-page .btn-cta:hover,body.se-page .btn-join:hover,body.se-page .btn-register:hover,body.se-page .btn-submit:hover,
body.se-page .btn-hero-primary:hover,body.se-page .btn-invest-cta:hover,body.se-page .btn-primary:hover,body.se-page .btn-invest:hover{background:var(--se-vert-hover);color:var(--se-blanc)}
body.se-page .btn-hero-secondary,body.se-page .btn-secondary{border-radius:999px;font-family:var(--se-bouton);font-weight:800}
@media (prefers-reduced-motion:reduce){
  header.se-entete *,footer.se-pied *{transition:none!important}
}

/* Recherche dans l'en-tête, entre le menu et FR (10/10/2026) */
.se-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.se-recherche{display:flex;align-items:center;gap:8px;flex:1 1 300px;max-width:440px;min-width:0;margin:0 0 0 auto;height:46px;padding:0 4px 0 16px;
  border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.2);color:#cfd8e3;transition:background .18s,border-color .18s}
.se-recherche:focus-within{background:rgba(255,255,255,.14);border-color:var(--se-or,#D4A017);outline:2px solid var(--se-or,#D4A017);outline-offset:2px}
.se-recherche>svg{flex:none;opacity:.8}
.se-recherche input{flex:1 1 auto;min-width:0;height:100%;border:0;outline:0;background:transparent;color:#fff;font:inherit;font-size:14.5px}
.se-recherche input::placeholder{color:#a9b6c4}
.se-recherche input::-webkit-search-cancel-button{filter:invert(1)}
.se-recherche button{flex:none;display:grid;place-items:center;width:38px;height:38px;border:0;border-radius:50%;cursor:pointer;background:var(--se-vert,#0f8a4a);color:#fff;transition:filter .18s}
.se-recherche button:hover{filter:brightness(1.12)}
.se-recherche button:focus-visible{outline:2px solid #fff;outline-offset:2px}
.se-recherche + .se-actions{margin-left:0}
.se-recherche-panneau{display:none}
/* 1024-1279 px : plus la place pour un champ ; la recherche devient une loupe qui ouvre la page Projets (et son champ). */
@media (min-width:1280px) and (max-width:1365px){
  .se-in > .se-recherche{flex:0 0 46px;width:46px;padding:0;justify-content:center;background:transparent}
  .se-in > .se-recherche > svg,.se-in > .se-recherche input{display:none}
}
@media (max-width:1279px){
  .se-in > .se-recherche{display:none}
  .se-recherche-panneau{display:flex;flex:none;max-width:none;width:100%;margin:0 0 6px}
}
@media (prefers-reduced-motion:reduce){.se-recherche,.se-recherche button{transition:none}}

/* Grand écran (10/10/2026) : boîte de logo de largeur fixe, pour que le menu commence au même endroit
   sur la plateforme et sur un club (le nom du club passe sur deux lignes au besoin). */
@media (min-width:1280px){
  header.se-entete .se-in > .se-logo{flex:0 0 190px;width:190px;min-width:0;overflow:hidden}
  header.se-entete .se-in > .se-logo img{height:44px;max-width:72px;margin-right:10px}
  header.se-entete .se-in > .se-logo .se-club-nom{white-space:normal;font-size:16px;line-height:1.12;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
}
