/* ============================================================
   CEEFinder — Home V2  (vert forêt + or ambré)
   Chargé UNIQUEMENT sur la page d'accueil (body.home-v2)
   ============================================================ */

:root {
  --forest: #0D2B1A;
  --green:  #1A4D2E;
  --green2: #2D6A4F;
  --green3: #52B788;
  --amber:  #D4A017;
  --amber2: #F0C040;
  --cee-bg: #F4F7F4;
  --cee-text: #0D1F12;
  --cee-muted: #5C7A64;
  --cee-border: #D8E8DC;
  --font-serif: 'DM Serif Display', Georgia, serif;
  --font-sans: 'Plus Jakarta Sans', system-ui, sans-serif;
}

/* ── Keyframes ── */
@keyframes fadeInUp   { from { opacity:0; transform:translateY(30px); } to { opacity:1; transform:translateY(0); } }
@keyframes fadeInDown { from { opacity:0; transform:translateY(-20px);} to { opacity:1; transform:translateY(0); } }
@keyframes floatLeaf  { 0%,100% { transform:translateY(0) rotate(0deg);} 33% { transform:translateY(-14px) rotate(6deg);} 66% { transform:translateY(-6px) rotate(-4deg);} }
@keyframes pulseGreen { 0%,100% { box-shadow:0 0 0 0 rgba(82,183,136,.45);} 50% { box-shadow:0 0 0 9px rgba(82,183,136,0);} }
@keyframes shimmerAmber { 0% { background-position:-200% center;} 100% { background-position:200% center;} }
@keyframes bounceDown  { 0%,100% { transform:translateX(-50%) translateY(0);} 50% { transform:translateX(-50%) translateY(8px);} }
@keyframes kenburns    { 0% { transform:scale(1) translate(0,0);} 100% { transform:scale(1.12) translate(-1.5%,-1.5%);} }

/* ── Scroll reveal ── */
.home-v2 .reveal       { opacity:0; transform:translateY(34px); transition:opacity .7s cubic-bezier(.16,1,.3,1), transform .7s cubic-bezier(.16,1,.3,1); }
.home-v2 .reveal.visible { opacity:1; transform:translateY(0); }

/* ── Base ── */
.home-v2 { font-family:var(--font-sans); color:var(--cee-text); background:var(--cee-bg); }
.home-v2 h1,.home-v2 h2,.home-v2 h3 { font-family:var(--font-serif); font-weight:400; }
.home-v2 .wrap { max-width:1120px; margin:0 auto; padding:0 24px; }
.home-v2 .eyebrow { font-size:11px; font-weight:700; color:var(--amber); letter-spacing:.14em; text-transform:uppercase; margin-bottom:10px; font-family:var(--font-sans); }

/* ============================================================
   NAVBAR (homepage only) : transparente sur le hero, glass au scroll
   ============================================================ */
body.home-v2 .navbar { position:fixed; top:0; left:0; right:0; z-index:1000; background:transparent; box-shadow:none; border-bottom:1px solid transparent; transition:background .35s ease, backdrop-filter .35s ease, border-color .35s ease; }
body.home-v2 .navbar.scrolled { background:rgba(13,43,26,.92); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); border-bottom:1px solid rgba(212,160,23,.22); }
body.home-v2 .navbar .nav-user > a { color:#fff; transition:color .2s; }
body.home-v2 .navbar .nav-user > a:hover { color:var(--amber); }
body.home-v2 .navbar .mobile-menu-toggle { color:#fff; }
body.home-v2 .navbar .logo-img { filter:brightness(0) invert(1); transition:filter .35s ease; }
/* Etat connecté : puces/boutons lisibles (blanc sur fond translucide foncé) */
body.home-v2 .navbar .welcome-message { color:#fff; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.22); }
body.home-v2 .navbar .welcome-message i { color:var(--amber); }
body.home-v2 .navbar .nav-dropdown-btn,
body.home-v2 .navbar .btn-espace-pro,
body.home-v2 .navbar .btn-hamburger { color:#fff; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.22); }
body.home-v2 .navbar .nav-dropdown-btn:hover,
body.home-v2 .navbar .btn-espace-pro:hover,
body.home-v2 .navbar .btn-hamburger:hover { background:rgba(212,160,23,.22); border-color:rgba(212,160,23,.5); }
/* Le panneau déroulant garde son fond clair : texte foncé conservé */
body.home-v2 .navbar .nav-dropdown-content a { color:inherit; }

/* ============================================================
   HERO
   ============================================================ */
.hero-v2 { position:relative; min-height:100vh; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.hero-media { position:absolute; inset:0; z-index:0; }
.hero-media img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity 1.6s ease; will-change:transform; }
.hero-media img.active { opacity:1; animation:kenburns 14s ease-in-out infinite alternate; }
.hero-overlay { position:absolute; inset:0; z-index:1; background:linear-gradient(to bottom, rgba(13,43,26,.74) 0%, rgba(13,43,26,.82) 50%, rgba(13,43,26,.95) 100%); }
.hero-particles { position:absolute; inset:0; z-index:2; pointer-events:none; }
.hero-particles .particle { position:absolute; animation-name:floatLeaf; animation-timing-function:ease-in-out; animation-iteration-count:infinite; filter:blur(.4px); }

.hero-inner { position:relative; z-index:3; text-align:center; padding:96px 24px 0; max-width:840px; margin:0 auto; }
.hero-badge { display:inline-flex; align-items:center; gap:8px; background:rgba(212,160,23,.12); border:1px solid rgba(212,160,23,.35); border-radius:24px; padding:6px 16px; margin-bottom:24px; animation:fadeInDown .7s ease both; }
.hero-badge .dot { width:6px; height:6px; border-radius:50%; background:var(--green3); animation:pulseGreen 2s infinite; }
.hero-badge span.txt { font-size:11px; font-weight:700; color:var(--amber); letter-spacing:.12em; text-transform:uppercase; }

.hero-title { font-size:clamp(36px,6.5vw,68px); color:#fff; line-height:1.1; margin-bottom:20px; animation:fadeInUp .9s ease .15s both; }
.hero-title .shimmer { background:linear-gradient(135deg,#D4A017 0%,#F0C040 50%,#D4A017 100%); background-size:200% auto; -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; animation:shimmerAmber 3s linear infinite; }
.hero-sub { font-size:clamp(14px,2vw,17px); color:rgba(255,255,255,.68); line-height:1.7; max-width:600px; margin:0 auto 36px; animation:fadeInUp .9s ease .3s both; }

.hero-cta { display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin-bottom:54px; animation:fadeInUp .9s ease .45s both; }
.btn-amber { background:linear-gradient(135deg,#D4A017,#F0C040); color:var(--forest); border:none; border-radius:50px; padding:14px 34px; font-size:15px; font-weight:700; cursor:pointer; text-decoration:none; display:inline-flex; align-items:center; gap:8px; box-shadow:0 8px 32px rgba(212,160,23,.45); transition:transform .25s, box-shadow .25s; font-family:var(--font-sans); }
.btn-amber:hover { transform:translateY(-2px); box-shadow:0 14px 40px rgba(212,160,23,.55); }
.btn-glass { background:rgba(255,255,255,.08); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); color:#fff; border:1px solid rgba(255,255,255,.25); border-radius:50px; padding:14px 28px; font-size:14px; font-weight:600; cursor:pointer; text-decoration:none; display:inline-flex; align-items:center; gap:8px; transition:border-color .2s, background .2s; font-family:var(--font-sans); }
.btn-glass:hover { border-color:rgba(212,160,23,.5); background:rgba(212,160,23,.1); }

.hero-stats { display:flex; gap:48px; justify-content:center; flex-wrap:wrap; animation:fadeInUp .9s ease .6s both; }
.hero-stats .num { font-family:var(--font-serif); font-size:32px; color:var(--amber); line-height:1; }
.hero-stats .lbl { font-size:10px; color:rgba(255,255,255,.45); margin-top:5px; letter-spacing:.06em; }

.hero-scroll { position:absolute; bottom:26px; left:50%; z-index:3; display:flex; flex-direction:column; align-items:center; gap:6px; animation:bounceDown 2.5s infinite; }
.hero-scroll span { font-size:9px; color:rgba(255,255,255,.4); letter-spacing:.14em; text-transform:uppercase; }
.hero-scroll i { width:1px; height:36px; background:linear-gradient(to bottom, rgba(212,160,23,.55), transparent); display:block; }

/* ============================================================
   OUTILS (section sombre)
   ============================================================ */
.outils-v2 { position:relative; padding:100px 0; background:var(--forest); overflow:hidden; }
.outils-v2 .glow { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:720px; height:520px; background:radial-gradient(ellipse, rgba(82,183,136,.08) 0%, transparent 70%); pointer-events:none; }
.outils-v2 .head { text-align:center; margin-bottom:56px; position:relative; }
.outils-v2 .head h2 { font-size:clamp(26px,4vw,42px); color:#fff; }
.outils-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:20px; position:relative; }
.outil-card { display:flex; flex-direction:column; align-items:flex-start; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08); border-radius:20px; padding:28px 24px; text-decoration:none; position:relative; overflow:hidden; transition:transform .25s cubic-bezier(.16,1,.3,1), background .25s, border-color .25s; }
.outil-card::after { content:""; position:absolute; bottom:0; left:0; height:2px; width:0; background:var(--amber); transition:width .35s cubic-bezier(.16,1,.3,1); }
.outil-card:hover { transform:translateY(-6px); background:var(--green2); border-color:var(--green2); }
.outil-card:hover::after { width:100%; }
.outil-tag { display:inline-block; font-size:10px; font-weight:700; letter-spacing:.08em; padding:3px 9px; border-radius:6px; margin-bottom:16px; color:var(--amber); background:rgba(212,160,23,.14); border:1px solid rgba(212,160,23,.3); }
.outil-tag.green { color:var(--green3); background:rgba(82,183,136,.14); border-color:rgba(82,183,136,.3); }
.outil-emoji { font-size:36px; margin-bottom:14px; transition:transform .25s; }
.outil-card:hover .outil-emoji { transform:scale(1.14); }
.outil-card h3 { font-size:19px; color:#fff; margin-bottom:10px; line-height:1.3; }
.outil-card p { font-size:13px; color:rgba(255,255,255,.58); line-height:1.6; margin-bottom:20px; }
.outil-link { margin-top:auto; background:rgba(212,160,23,.16); color:var(--amber); border-radius:50px; padding:8px 18px; font-size:13px; font-weight:600; transition:all .2s; }
.outil-card:hover .outil-link { background:var(--amber); color:var(--forest); }

/* ============================================================
   STATS (compteurs)
   ============================================================ */
.stats-v2 { position:relative; padding:84px 0; background:linear-gradient(135deg,#1A4D2E 0%,#0D2B1A 100%); overflow:hidden; }
.stats-v2 .glow { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:600px; height:400px; background:radial-gradient(ellipse, rgba(212,160,23,.09) 0%, transparent 70%); pointer-events:none; }
.stats-grid { position:relative; display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:40px; max-width:920px; margin:0 auto; }
.stat-item { text-align:center; }
.stat-item .n { font-family:var(--font-serif); font-size:48px; color:var(--amber); line-height:1; }
.stat-item .l { font-size:13px; color:rgba(255,255,255,.55); font-weight:500; margin-top:8px; }

/* ============================================================
   AUDIT (drop zone)
   ============================================================ */
.audit-v2 { padding:100px 0; background:var(--cee-bg); }
.audit-v2 .head { text-align:center; max-width:720px; margin:0 auto 40px; }
.audit-v2 .head .pill { display:inline-flex; align-items:center; gap:6px; background:rgba(82,183,136,.12); border:1px solid rgba(82,183,136,.3); border-radius:24px; padding:5px 14px; margin-bottom:16px; }
.audit-v2 .head .pill .dot { width:6px; height:6px; border-radius:50%; background:var(--green3); }
.audit-v2 .head .pill .txt { font-size:11px; font-weight:700; color:var(--green2); letter-spacing:.1em; text-transform:uppercase; }
.audit-v2 .head h2 { font-size:clamp(22px,4vw,36px); color:var(--forest); margin-bottom:12px; }
.audit-v2 .head p { font-size:15px; color:var(--cee-muted); line-height:1.65; }
.audit-drop { max-width:720px; margin:0 auto; display:block; background:#fff; border:2px dashed var(--cee-border); border-radius:20px; padding:46px 32px; text-align:center; cursor:pointer; text-decoration:none; transition:border-color .2s, background .2s, transform .2s, box-shadow .2s; outline:none; }
.audit-drop:hover, .audit-drop.drag, .audit-drop:focus-visible { border-color:var(--green3); background:#F0F9F4; transform:translateY(-3px); box-shadow:0 18px 50px rgba(13,43,26,.1); }
.audit-drop:focus-visible { box-shadow:0 0 0 4px rgba(82,183,136,.35); }
.audit-drop .ic { width:64px; height:64px; margin:0 auto 18px; border-radius:18px; display:flex; align-items:center; justify-content:center; font-size:28px; color:#fff; background:linear-gradient(135deg,var(--green),var(--green3)); box-shadow:0 8px 22px rgba(82,183,136,.35); }
.audit-drop h3 { font-size:20px; color:var(--forest); margin-bottom:8px; }
.audit-drop p { font-size:14px; color:var(--cee-muted); margin-bottom:18px; }
.audit-drop .fake-btn { display:inline-block; background:linear-gradient(135deg,#D4A017,#F0C040); color:var(--forest); border-radius:50px; padding:11px 26px; font-size:14px; font-weight:700; }

/* ============================================================
   SECTEURS
   ============================================================ */
.secteurs-v2 { padding:100px 0; background:#fff; }
.secteurs-v2 .head { text-align:center; margin-bottom:54px; }
.secteurs-v2 .head h2 { font-size:clamp(26px,4vw,42px); color:var(--forest); }
.secteurs-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:20px; }
.secteur-card { position:relative; display:block; text-align:left; text-decoration:none; background:#fff; border:1px solid var(--cee-border); border-radius:16px; padding:24px 22px; overflow:hidden; transition:transform .25s cubic-bezier(.16,1,.3,1), background .25s, border-color .25s, box-shadow .25s; box-shadow:0 1px 4px rgba(0,0,0,.04); }
.secteur-card::after { content:""; position:absolute; bottom:0; left:0; height:2px; width:0; background:var(--green3); transition:width .35s cubic-bezier(.16,1,.3,1); }
.secteur-card:hover { transform:translateY(-6px); background:var(--forest); border-color:var(--green3); box-shadow:0 16px 48px rgba(13,43,26,.16); }
.secteur-card:hover::after { width:100%; }
.secteur-emoji { font-size:36px; margin-bottom:14px; display:inline-block; transition:transform .25s; }
.secteur-card:hover .secteur-emoji { transform:scale(1.15); }
.secteur-code { position:absolute; top:18px; right:16px; font-size:10px; font-weight:700; letter-spacing:.1em; padding:3px 8px; border-radius:6px; color:var(--green2); background:#F0F7F2; transition:all .2s; }
.secteur-card:hover .secteur-code { color:rgba(255,255,255,.65); background:rgba(255,255,255,.12); }
.secteur-name { font-family:var(--font-sans); font-size:17px; font-weight:700; color:var(--forest); margin-bottom:6px; transition:color .2s; }
.secteur-card:hover .secteur-name { color:#fff; }
.secteur-nb { font-size:12px; color:var(--cee-muted); transition:color .2s; }
.secteur-card:hover .secteur-nb { color:rgba(255,255,255,.55); }
.secteur-arrow { position:absolute; bottom:18px; right:16px; width:28px; height:28px; border-radius:50%; background:#E8F5ED; color:var(--green3); display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:700; transition:all .25s; }
.secteur-card:hover .secteur-arrow { background:var(--green3); color:var(--forest); }

/* ============================================================
   Sections legacy (expertise / à propos) — accord palette
   ============================================================ */
.home-v2 .illustrations-section, .home-v2 .about-section { background:var(--cee-bg); }
.home-v2 .illustrations-section h2, .home-v2 .about-section h2,
.home-v2 .section-title, .home-v2 .section-heading { font-family:var(--font-serif); color:var(--forest); }

/* ============================================================
   Responsive
   ============================================================ */
@media (max-width:640px){
  .hero-stats { gap:30px; }
  .hero-inner { padding-top:80px; }
  .outils-v2,.audit-v2,.secteurs-v2 { padding:64px 0; }
  .stats-v2 { padding:56px 0; }
}

/* ── Accessibilité : respect de prefers-reduced-motion ── */
@media (prefers-reduced-motion: reduce){
  .home-v2 *, .home-v2 *::before, .home-v2 *::after { animation:none !important; transition-duration:.01ms !important; }
  .home-v2 .reveal { opacity:1 !important; transform:none !important; }
  .hero-media img.active { animation:none !important; }
  .hero-particles { display:none; }
}