@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@500;600;700;800&family=Public+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@500;600&display=swap');

:root{
  --bleu: #000091;
  --bleu-fonce: #00006b;
  --bleu-clair: #e3e3fd;
  --rouge: #e1000f;
  --fond: #f5f6f8;
  --carte: #ffffff;
  --encre: #1e1e1e;
  --gris: #666a6f;
  --gris-clair: #dcdee2;
  --gris-tres-clair: #eeeff1;
  --radius: 2px;
}

*{ box-sizing: border-box; }
html,body,#root{ height: 100%; }
body{ margin:0; }
.efr{
  font-family: 'Public Sans', -apple-system, sans-serif;
  color: var(--encre);
  background: var(--fond);
  min-height: 100%;
  line-height: 1.5;
}
.efr h1,.efr h2,.efr h3,.efr h4{
  font-family: 'Archivo', sans-serif;
  font-weight: 700;
  letter-spacing: -0.01em;
  margin: 0;
  color: var(--bleu-fonce);
}
.efr .mono{ font-family: 'IBM Plex Mono', monospace; }
.efr a{ color: var(--bleu); text-decoration: none; }
.efr button{ font-family: inherit; cursor: pointer; }
.efr :focus-visible{ outline: 3px solid var(--rouge); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce){ .efr *{ transition: none !important; animation: none !important; } }

.efr .tricolore{ height: 4px; display:flex; }
.efr .tricolore span{ flex:1; }
.efr .tricolore .b{ background: var(--bleu); }
.efr .tricolore .w{ background: #fff; }
.efr .tricolore .r{ background: var(--rouge); }

.efr .header{ background:#fff; border-bottom: 1px solid var(--gris-clair); position: sticky; top:0; z-index: 20; }
.efr .header-inner{ max-width: 1120px; margin:0 auto; padding: 14px 24px; display:flex; align-items:center; justify-content:space-between; gap: 16px; }
.efr .brand{ display:flex; align-items:center; gap:10px; cursor:pointer; background:none; border:none; padding:0; }
.efr .brand-mark{ width:34px; height:34px; background: var(--bleu); color:#fff; display:flex; align-items:center; justify-content:center; font-family:'Archivo'; font-weight:800; font-size:15px; flex-shrink:0; }
.efr .brand-text{ text-align:left; line-height:1.15; }
.efr .brand-text b{ font-family:'Archivo'; font-weight:800; font-size:16px; color: var(--bleu-fonce); display:block; }
.efr .brand-text span{ font-size:11px; color: var(--gris); text-transform:uppercase; letter-spacing:.04em; }
.efr .nav{ display:flex; align-items:center; gap: 10px; flex-wrap: wrap; }
.efr .navlink{ background:none; border:none; font-size:14px; font-weight:600; color: var(--encre); padding: 8px 10px; border-radius: var(--radius); }
.efr .navlink:hover{ background: var(--gris-tres-clair); }
.efr .navlink.active{ color: var(--bleu); }

.efr .btn{ display:inline-flex; align-items:center; gap:8px; justify-content:center; border-radius: var(--radius); font-weight:600; font-size:14px; padding: 10px 18px; border: 1px solid transparent; white-space:nowrap; }
.efr .btn-primary{ background: var(--bleu); color:#fff; }
.efr .btn-primary:hover{ background: var(--bleu-fonce); }
.efr .btn-outline{ background:#fff; color: var(--bleu); border-color: var(--bleu); }
.efr .btn-outline:hover{ background: var(--bleu-clair); }
.efr .btn-ghost{ background:none; color: var(--gris); border-color: var(--gris-clair); }
.efr .btn-ghost:hover{ background: var(--gris-tres-clair); }
.efr .btn-danger{ background:#fff; color: var(--rouge); border-color: var(--rouge); }
.efr .btn-danger:hover{ background: #fdeceb; }
.efr .btn-sm{ padding: 6px 12px; font-size: 13px; }
.efr .btn:disabled{ opacity:.5; cursor:not-allowed; }

.efr .wrap{ max-width: 1120px; margin: 0 auto; padding: 0 24px; }

.efr .hero{
  background: linear-gradient(125deg, rgba(0,0,145,.85), rgba(0,0,80,.80)), url('images/hero-bg.jpg') center/cover no-repeat;
  color:#fff; padding: 64px 0 44px;
  position: relative;
}
.efr .hero-eyebrow{ font-family:'IBM Plex Mono'; font-size:12px; letter-spacing:.08em; text-transform:uppercase; color: #b9b9f5; margin-bottom: 14px; display:flex; align-items:center; gap:8px; }
.efr .hero-eyebrow .dot{ width:6px;height:6px; background: var(--rouge); }
.efr .hero h1{ color:#fff; font-size: 34px; max-width: 620px; margin-bottom: 10px; }
.efr .hero p{ color:#d7d7fb; font-size:16px; max-width: 560px; margin-bottom: 28px; }

.efr .search-panel{ background:#fff; border-radius: var(--radius); padding: 18px; display:grid; grid-template-columns: 2fr 1fr 1fr auto; gap: 12px; align-items:end; }
@media (max-width: 760px){ .efr .search-panel{ grid-template-columns: 1fr; } }
.efr .field label{ display:block; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color: var(--gris); margin-bottom: 6px; }
.efr .field input, .efr .field select, .efr .field textarea{ width:100%; border: 1px solid var(--gris-clair); border-radius: var(--radius); padding: 10px 12px; font-size: 14px; font-family: inherit; color: var(--encre); background:#fff; }
.efr .field input:focus, .efr .field select:focus, .efr .field textarea:focus{ border-color: var(--bleu); }
.efr .field-hint{ font-size: 12px; color: var(--gris); margin-top: 5px; }
.efr .field-error{ font-size: 12px; color: var(--rouge); margin-top: 5px; }

.efr .section{ padding: 40px 0; }
.efr .section-head{ display:flex; align-items:baseline; justify-content:space-between; margin-bottom: 20px; gap: 12px; flex-wrap: wrap; }
.efr .section-head h2{ font-size: 22px; }
.efr .count-tag{ font-family:'IBM Plex Mono'; font-size:12px; color: var(--gris); }

.efr .grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
@media (max-width: 900px){ .efr .grid{ grid-template-columns: repeat(2,1fr); } }
@media (max-width: 620px){ .efr .grid{ grid-template-columns: 1fr; } }

.efr .card{ background:#fff; border: 1px solid var(--gris-clair); border-radius: var(--radius); overflow:hidden; display:flex; flex-direction:column; text-align:left; width:100%; border-top: 3px solid var(--bleu); }
.efr .card-image{ height: 140px; background-size: cover; background-position: center; background-color: var(--gris-tres-clair); border-bottom: 1px solid var(--gris-clair); }
.efr .detail-image{ width: 100%; max-height: 320px; object-fit: cover; border-radius: var(--radius); margin-bottom: 20px; border: 1px solid var(--gris-clair); }
.efr .image-preview{ width: 100%; max-height: 200px; object-fit: cover; border-radius: var(--radius); border: 1px solid var(--gris-clair); margin-bottom: 8px; display: block; }
.efr .unverified-dot{ display:inline-block; width:7px; height:7px; background: var(--rouge); border-radius:50%; margin-left:6px; vertical-align:middle; }
.efr .card-body{ padding: 16px; display:flex; flex-direction:column; gap:10px; flex:1; }
.efr .card-top{ display:flex; gap:12px; align-items:flex-start; }
.efr .stamp{ border: 1px solid var(--bleu); color: var(--bleu); text-align:center; padding: 6px 8px; flex-shrink:0; min-width: 54px; }
.efr .stamp .day{ font-family:'Archivo'; font-weight:800; font-size:19px; line-height:1; }
.efr .stamp .month{ font-family:'IBM Plex Mono'; font-size:10px; text-transform:uppercase; letter-spacing:.05em; margin-top:2px; }
.efr .card-ref{ font-family:'IBM Plex Mono'; font-size:11px; color: var(--gris); margin-bottom: 4px; }
.efr .card-cat{ display:inline-block; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color: var(--bleu); background: var(--bleu-clair); padding: 3px 8px; width:fit-content; }
.efr .card h3{ font-size: 16px; color: var(--encre); }
.efr .card-meta{ font-size: 13px; color: var(--gris); }
.efr .card-foot{ margin-top:auto; padding-top: 10px; border-top: 1px solid var(--gris-tres-clair); display:flex; align-items:center; justify-content:space-between; font-size: 12px; color: var(--gris); }
.efr .card-link{ background:none; border:none; padding:0; text-align:inherit; cursor:pointer; }

.efr .status-badge{ font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.03em; padding: 3px 8px; border-radius: var(--radius); }
.efr .status-publie{ background:#e6f4ea; color:#1e7b34; }
.efr .status-brouillon{ background:#f0f0f0; color:#666; }
.efr .status-complet{ background:#fdeceb; color: var(--rouge); }

.efr .empty{ border: 1px dashed var(--gris-clair); background:#fff; padding: 40px 20px; text-align:center; color: var(--gris); }
.efr .empty h3{ color: var(--encre); font-size:16px; margin-bottom:6px; }

.efr .breadcrumb{ font-size:13px; color: var(--gris); display:flex; align-items:center; gap:6px; margin: 20px 0; }
.efr .detail-grid{ display:grid; grid-template-columns: 2fr 1fr; gap: 32px; align-items:start; }
@media (max-width: 820px){ .efr .detail-grid{ grid-template-columns: 1fr; } }
.efr .detail-header{ border-bottom: 1px solid var(--gris-clair); padding-bottom: 20px; margin-bottom: 20px; }
.efr .detail-header h1{ font-size: 28px; margin: 10px 0; }
.efr .detail-meta-list{ display:flex; flex-direction:column; gap:10px; margin: 16px 0; font-size:14px; }
.efr .prose{ font-size:15px; color:#333; white-space: pre-wrap; }

.efr .panel{ background:#fff; border:1px solid var(--gris-clair); border-radius: var(--radius); padding:20px; }
.efr .panel + .panel{ margin-top:16px; }
.efr .panel h3{ font-size:15px; margin-bottom:12px; }

.efr .places-bar{ height:6px; background: var(--gris-tres-clair); overflow:hidden; margin: 10px 0; }
.efr .places-bar-fill{ height:100%; background: var(--bleu); }

.efr .auth-wrap{ max-width: 420px; margin: 60px auto; padding: 0 24px; }
.efr .auth-card{ background:#fff; border:1px solid var(--gris-clair); border-radius: var(--radius); padding: 32px; border-top: 3px solid var(--bleu); }
.efr .auth-card h1{ font-size:22px; margin-bottom:6px; }
.efr .auth-card p.sub{ font-size:13px; color: var(--gris); margin-bottom: 24px; }
.efr .form-stack{ display:flex; flex-direction:column; gap:16px; }
.efr .switcher{ font-size:13px; color: var(--gris); margin-top: 20px; text-align:center; }

.efr .dash-head{ display:flex; justify-content:space-between; align-items:flex-end; gap:16px; flex-wrap:wrap; margin: 28px 0 20px; }
.efr .dash-stats{ display:grid; grid-template-columns: repeat(3,1fr); gap:14px; margin-bottom: 28px; }
@media (max-width:620px){ .efr .dash-stats{ grid-template-columns:1fr; } }
.efr .stat-box{ background:#fff; border:1px solid var(--gris-clair); padding:18px; border-left: 3px solid var(--bleu); }
.efr .stat-box .num{ font-family:'Archivo'; font-weight:800; font-size:26px; color: var(--bleu-fonce); }
.efr .stat-box .lbl{ font-size:12px; color: var(--gris); text-transform:uppercase; letter-spacing:.04em; margin-top:2px; }

.efr .plan-pill{ display:inline-block; background: var(--bleu); color:#fff; font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; padding:4px 10px; border-radius: var(--radius); }
.efr .plan-usage-banner{ display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; background:#fff; border:1px solid var(--gris-clair); padding:14px 18px; margin-bottom:16px; font-size:13.5px; }

.efr .table{ width:100%; border-collapse: collapse; background:#fff; border:1px solid var(--gris-clair); }
.efr .table th{ text-align:left; font-size:11px; text-transform:uppercase; letter-spacing:.04em; color: var(--gris); padding: 12px 14px; border-bottom: 1px solid var(--gris-clair); background: var(--gris-tres-clair); }
.efr .table td{ padding: 12px 14px; border-bottom: 1px solid var(--gris-tres-clair); font-size: 14px; vertical-align: middle; }
.efr .table tr:last-child td{ border-bottom:none; }
.efr .row-actions{ display:flex; gap:6px; flex-wrap:wrap; }
.efr .table-scroll{ overflow-x:auto; }

.efr .toast{ position: fixed; bottom: 22px; left: 50%; transform: translateX(-50%); background: var(--encre); color:#fff; padding: 12px 18px; border-radius: var(--radius); font-size: 14px; z-index: 100; box-shadow: 0 6px 20px rgba(0,0,0,.2); max-width: 90vw; }
.efr .toast.error{ background: var(--rouge); }

/* Footer étendu */
.efr .footer{ border-top:1px solid var(--gris-clair); padding: 44px 0 0; margin-top: 50px; background:#fff; }
.efr .footer-grid{ display:grid; grid-template-columns: 2fr 1fr 1fr; gap: 32px; padding-bottom: 32px; }
@media (max-width: 700px){ .efr .footer-grid{ grid-template-columns: 1fr; } }
.efr .footer-col h4{ font-size:12px; text-transform:uppercase; letter-spacing:.05em; color: var(--gris); margin-bottom: 14px; font-family:'Public Sans'; font-weight:700; }
.efr .footer-col button{ display:block; background:none; border:none; padding:4px 0; font-size:13.5px; color: var(--encre); text-align:left; }
.efr .footer-col button:hover{ color: var(--bleu); }
.efr .footer-brand p{ font-size:13px; color: var(--gris); margin-top:10px; max-width:320px; line-height:1.6; }
.efr .footer-bottom{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px; border-top:1px solid var(--gris-tres-clair); padding: 16px 0; }
.efr .footer-bottom p{ font-size:12px; color: var(--gris); margin:0; }

/* Pages de contenu générique (à propos, contact, légal) */
.efr .page-hero{ background: var(--bleu-fonce); color:#fff; padding: 44px 0; }
.efr .page-hero h1{ color:#fff; font-size:28px; margin-bottom:8px; }
.efr .page-hero p{ color:#d7d7fb; font-size:14px; max-width:600px; }
.efr .page-body{ padding: 40px 0 60px; max-width: 800px; margin: 0 auto; }
.efr .page-body h2{ font-size:19px; margin: 30px 0 12px; }
.efr .page-body h2:first-child{ margin-top:0; }
.efr .page-body p{ font-size:14.5px; color:#333; line-height:1.7; margin-bottom:12px; }
.efr .page-body ul{ margin:0 0 12px; padding-left:20px; }
.efr .page-body li{ font-size:14.5px; color:#333; line-height:1.7; margin-bottom:6px; }
.efr .page-body strong{ color: var(--encre); }

/* Tarifs */
.efr .pricing-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 20px; max-width:1120px; margin:0 auto; padding: 44px 24px; }
@media (max-width: 900px){ .efr .pricing-grid{ grid-template-columns: 1fr; } }
.efr .pricing-card{ background:#fff; border:1px solid var(--gris-clair); border-radius: var(--radius); padding:28px; display:flex; flex-direction:column; border-top:3px solid var(--gris-clair); }
.efr .pricing-card.featured{ border-top:3px solid var(--bleu); box-shadow: 0 8px 28px rgba(0,0,80,.12); position:relative; }
.efr .pricing-badge{ position:absolute; top:-13px; right:24px; background: var(--rouge); color:#fff; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; padding:4px 10px; border-radius: var(--radius); }
.efr .pricing-card h3{ font-size:17px; margin-bottom:6px; }
.efr .pricing-card .pricing-tagline{ font-size:13px; color: var(--gris); margin-bottom:18px; min-height:36px; }
.efr .pricing-price{ display:flex; align-items:baseline; gap:6px; margin-bottom:20px; }
.efr .pricing-price .amount{ font-family:'Archivo'; font-weight:800; font-size:34px; color: var(--bleu-fonce); }
.efr .pricing-price .period{ font-size:13px; color: var(--gris); }
.efr .pricing-features{ list-style:none; padding:0; margin:0 0 24px; flex:1; }
.efr .pricing-features li{ font-size:13.5px; color:#333; padding:8px 0; border-bottom:1px solid var(--gris-tres-clair); display:flex; gap:8px; }
.efr .pricing-features li::before{ content:"✓"; color: var(--bleu); font-weight:700; }
.efr .pricing-note{ font-size:12px; color: var(--gris); text-align:center; padding: 0 24px 44px; max-width:700px; margin:0 auto; }

/* Contact */
.efr .contact-grid{ display:grid; grid-template-columns: 1.3fr 1fr; gap:32px; max-width:1000px; margin:0 auto; padding: 44px 24px 60px; align-items:start; }
@media (max-width: 760px){ .efr .contact-grid{ grid-template-columns: 1fr; } }
.efr .contact-info-item{ display:flex; gap:12px; margin-bottom:18px; }
.efr .contact-info-item .lbl{ font-size:11px; text-transform:uppercase; letter-spacing:.05em; color: var(--gris); margin-bottom:3px; }
.efr .contact-info-item .val{ font-size:14px; color: var(--encre); font-weight:600; }

.efr .info-banner{ display:flex; gap:10px; align-items:flex-start; background: var(--bleu-clair); border:1px solid #c4c4f7; padding: 12px 14px; font-size:13px; color: var(--bleu-fonce); margin-bottom: 20px; }

/* Présentation */
.efr .presentation{ background:#fff; border-bottom: 1px solid var(--gris-clair); padding: 46px 0; }
.efr .presentation-head{ max-width: 640px; margin-bottom: 30px; }
.efr .presentation-head h2{ font-size: 22px; margin-bottom: 10px; }
.efr .presentation-head p{ font-size: 14px; color: var(--gris); }
.efr .presentation-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
@media (max-width: 760px){ .efr .presentation-grid{ grid-template-columns: 1fr; } }
.efr .presentation-item{ border-left: 3px solid var(--bleu); padding-left: 16px; }
.efr .presentation-item .num{ font-family:'IBM Plex Mono'; font-size:12px; color: var(--bleu); letter-spacing:.05em; margin-bottom: 8px; display:block; }
.efr .presentation-item h3{ font-size: 16px; margin-bottom: 8px; color: var(--encre); }
.efr .presentation-item p{ font-size: 13.5px; color: var(--gris); line-height:1.55; }

/* Galerie défilante */
.efr .gallery{ padding: 44px 0; }
.efr .gallery-head{ display:flex; align-items:baseline; justify-content:space-between; margin-bottom: 18px; gap:12px; flex-wrap:wrap; }
.efr .gallery-head h2{ font-size: 20px; }
.efr .gallery-nav{ display:flex; gap:8px; }
.efr .gallery-nav button{
  width:34px; height:34px; border-radius:50%; border:1px solid var(--gris-clair); background:#fff;
  color: var(--bleu); font-size:16px; display:flex; align-items:center; justify-content:center;
}
.efr .gallery-nav button:hover{ background: var(--bleu-clair); }
.efr .gallery-nav button:disabled{ opacity:.35; cursor:default; }
.efr .gallery-track{
  display:flex; gap:16px; overflow-x:auto; scroll-snap-type:x proximity; padding-bottom: 6px;
  scrollbar-width: thin;
}
.efr .gallery-track::-webkit-scrollbar{ height:6px; }
.efr .gallery-track::-webkit-scrollbar-thumb{ background: var(--gris-clair); border-radius:4px; }
.efr .gallery-card{
  flex: 0 0 260px; scroll-snap-align:start; background:#fff; border:1px solid var(--gris-clair);
  border-radius: var(--radius); overflow:hidden; text-align:left; cursor:pointer; display:flex; flex-direction:column;
}
.efr .gallery-card-image{ height:120px; background-size:cover; background-position:center; background-color: var(--bleu-clair); position:relative; }
.efr .gallery-card-image .stamp-mini{
  position:absolute; bottom:8px; left:8px; background:#fff; border:1px solid var(--bleu); padding:3px 7px;
  font-family:'IBM Plex Mono'; font-size:11px; font-weight:700; color: var(--bleu); line-height:1.1;
}
.efr .gallery-card-body{ padding: 12px 14px; }
.efr .gallery-card h4{ font-size:14px; color: var(--encre); margin-bottom:4px; font-family:'Public Sans'; font-weight:700; }
.efr .gallery-card .gallery-meta{ font-size:12px; color: var(--gris); }

.efr .modal-backdrop{ position: fixed; inset:0; background: rgba(0,0,0,.4); display:flex; align-items:center; justify-content:center; z-index: 200; padding: 20px; }
.efr .modal{ background:#fff; max-width: 420px; width:100%; padding: 24px; border-radius: var(--radius); border-top:3px solid var(--rouge); }
.efr .modal h3{ font-size:17px; margin-bottom:10px; }
.efr .modal p{ font-size:14px; color: var(--gris); margin-bottom:20px; }
.efr .modal-actions{ display:flex; gap:10px; justify-content:flex-end; }

.efr .checkbox-row{ display:flex; align-items:center; gap:8px; font-size:13px; color: var(--gris); }
.efr .loading-screen{ min-height: 60vh; display:flex; align-items:center; justify-content:center; color: var(--gris); font-family:'IBM Plex Mono'; }