/* ===== Brookesia Tech — Design IMPACTANT (Tech / Cyber / Premium) ===== */
:root {
  /* Couleurs de fond profondes */
  --bg-dark: #0a111a; /* Très sombre */
  --bg: #0d1a28;      /* Bleu nuit profond */
  --bg-alt: #132433;  /* Bleu un peu plus clair pour le contraste */
  
  /* Accents Electriques & Lumineux (Le vrai changement visuel) */
  --cyan-bright: #00e5ff;    /* Cyan néon */
  --cyan-glow: rgba(0, 229, 255, 0.25);
  --violet-deep: #7c3aed;    /* Violet pour le contraste */
  --gold: #f59e0b;           /* Or chaud pour réchauffer l'ensemble */
  --gold-glow: rgba(245, 158, 11, 0.2);

  /* Effet Glass poussé */
  --card-bg: linear-gradient(135deg, rgba(255, 255, 255, 0.06) 0%, rgba(0, 229, 255, 0.03) 100%);
  --card-border: rgba(255, 255, 255, 0.08);
  --glass-blur: 16px;
  
  /* Textes */
  --text: #f0f3bd;
  --text-light: #ffffff;
  --muted: rgba(240, 243, 189, 0.6);

  /* Ombres portées pour l'effet 3D */
  --shadow-card: 0 15px 35px -10px rgba(0, 0, 0, 0.6);
  --shadow-glow: 0 0 30px rgba(0, 229, 255, 0.15);
  
  /* Gradients techniques */
  --grad-hero: linear-gradient(135deg, #00e5ff 0%, #7c3aed 100%);
  --grad-soft: linear-gradient(90deg, rgba(0, 229, 255, 0.15), rgba(124, 58, 237, 0.15));
  --radius: 16px;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  background:var(--bg-dark);
  color:var(--text);
  font-family:'Outfit', sans-serif;
  line-height:1.6;
  overflow-x:hidden;
  -webkit-font-smoothing: antialiased;
}
h1,h2,h3,.display{font-family:'Space Grotesk', sans-serif; font-weight:700; letter-spacing:-0.02em;}
.mono{font-family:'JetBrains Mono', monospace;}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
.wrap{max-width:1180px; margin:0 auto; padding:0 32px;}
section{position:relative;}
ul{list-style:none;}

/* ===== CANVAS EN FOND (ne prend pas de place) ===== */
.neural-canvas {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;   /* permet de cliquer à travers */
  z-index: 1;             /* juste au‑dessus des blobs, sous le contenu */
}

/* ---------- Blobs Premium ---------- */
.blob-field{position:absolute; inset:0; overflow:hidden; z-index:0; pointer-events:none;}
.blob{
  position:absolute; filter:blur(100px); opacity:0.25; mix-blend-mode:screen;
  animation: drift 30s ease-in-out infinite, morph 20s ease-in-out infinite;
  will-change: transform, border-radius;
}
.blob-blue{background:radial-gradient(circle at 30% 30%, #00e5ff, transparent 70%);}
.blob-teal{background:radial-gradient(circle at 60% 40%, #7c3aed, transparent 70%);}
.blob-warm{background:radial-gradient(circle at 70% 70%, #f59e0b, transparent 70%);}
.blob-1{width:600px; height:600px; top:-200px; left:-200px; border-radius:42% 58% 65% 35% / 45% 40% 60% 55%;}
.blob-2{width:500px; height:500px; top:50px; right:-150px; border-radius:60% 40% 35% 65% / 55% 60% 40% 45%;}
.blob-3{width:400px; height:400px; bottom:-150px; left:20%; border-radius:50% 50% 35% 65% / 40% 60% 40% 60%;}

@keyframes drift{ 0%,100%{transform:translate(0,0) scale(1);} 33%{transform:translate(40px,-30px) scale(1.05);} 66%{transform:translate(-20px,20px) scale(0.95);} }
@keyframes morph{ 0%,100%{border-radius:42% 58% 65% 35% / 45% 40% 60% 55%;} 33%{border-radius:65% 35% 45% 55% / 55% 65% 35% 45%;} 66%{border-radius:35% 65% 55% 45% / 60% 35% 65% 40%;} }
@media (prefers-reduced-motion: reduce){ .blob{animation:none;} }

/* ---------- Scroll reveal ---------- */
.reveal{opacity:0; transform:translateY(35px); transition:opacity 0.8s cubic-bezier(.22,1,.36,1), transform 0.8s cubic-bezier(.22,1,.36,1);}
.reveal.in{opacity:1; transform:translateY(0);}
.reveal-stagger > *{opacity:0; transform:translateY(25px); transition:opacity 0.6s ease, transform 0.6s ease;}
.reveal-stagger.in > *{opacity:1; transform:translateY(0);}
.reveal-stagger.in > *:nth-child(1){transition-delay:0.05s;}
.reveal-stagger.in > *:nth-child(2){transition-delay:0.12s;}
.reveal-stagger.in > *:nth-child(3){transition-delay:0.19s;}
.reveal-stagger.in > *:nth-child(4){transition-delay:0.26s;}
@media (prefers-reduced-motion: reduce){ .reveal, .reveal-stagger > *{opacity:1; transform:none; transition:none;} }

/* ---------- Navbar Ultra Tech ---------- */
header{position:sticky; top:0; z-index:100; background:rgba(10, 17, 26, 0.85); backdrop-filter:blur(var(--glass-blur)); border-bottom:1px solid rgba(255,255,255,0.05); box-shadow:0 10px 30px -10px rgba(0,0,0,0.5);}
.nav{display:flex; align-items:center; justify-content:space-between; padding:16px 32px; max-width:1180px; margin:0 auto;}
.brand{display:flex; align-items:center; gap:12px; transition:transform 0.2s ease;}
.brand:hover{transform:translateY(-1px);}
.brand img{height:48px; width:48px; object-fit:contain; padding:6px; background:#fff; border-radius:14px; box-shadow:0 8px 24px rgba(0,0,0,0.25);}
.brand span{font-family:'Space Grotesk'; font-weight:700; font-size:17px; line-height:1; letter-spacing:0.04em; color:#fff;}
.navlinks{display:flex; gap:34px; font-size:14px; color:var(--muted);}
.navlinks a{position:relative; padding:2px 0; transition:color 0.2s; font-weight:500;}
.navlinks a::after{content:''; position:absolute; left:0; bottom:-4px; width:0; height:2px; background:var(--grad-hero); transition:width 0.25s ease; box-shadow:0 0 10px var(--cyan-bright);}
.navlinks a:hover{color:var(--text-light);}
.navlinks a:hover::after, .navlinks a.active::after{width:100%;}
.navlinks a.active{color:var(--text-light);}
.nav-actions{display:flex; align-items:center; gap:16px;}
.nav-cta{background:linear-gradient(135deg, var(--cyan-bright), var(--violet-deep)); color:#fff; font-weight:600; font-size:13.5px; padding:10px 22px; border-radius:50px; transition:transform 0.2s, box-shadow 0.2s; box-shadow:0 4px 15px rgba(0, 229, 255, 0.2);}
.nav-cta:hover{transform:translateY(-2px); box-shadow:0 8px 25px rgba(0, 229, 255, 0.3);}
.menu-btn{display:none; background:none; border:none; color:var(--text); font-size:22px; cursor:pointer;}
.mobile-menu{display:none; flex-direction:column; gap:2px; background:var(--bg-dark); border-bottom:1px solid var(--card-border); padding:10px 32px 20px;}
.mobile-menu.open{display:flex;}
.mobile-menu a{padding:12px 0; font-size:15px; border-bottom:1px solid var(--card-border); color:var(--text);}

/* ---------- Hero Cyber Tech ---------- */
.hero{
  min-height: auto;          /* supprimé, le contenu décide */
  padding: 20px 0 70px;      /* padding‑top très réduit */
  position:relative;
  overflow:hidden;
  background: linear-gradient(90deg, rgba(10, 17, 26, 0.94) 0%, rgba(10, 17, 26, 0.78) 43%, rgba(10, 17, 26, 0.36) 100%), linear-gradient(180deg, rgba(10, 17, 26, 0.24), rgba(10, 17, 26, 0.9)), url('https://images.unsplash.com/photo-1555066931-4365d14bab8c?auto=format&fit=crop&w=1800&q=85');
  background-size:cover;
  background-position:center right;
  background-attachment:fixed;
}
.hero::after{content:''; position:absolute; inset:0; z-index:0; background:radial-gradient(circle at 18% 22%, rgba(0, 229, 255, 0.15), transparent 28%), radial-gradient(circle at 78% 62%, rgba(124, 58, 237, 0.15), transparent 30%); pointer-events:none;}
.hero .blob-field{opacity:0.5; z-index:1;}
.hero .neural-canvas{opacity:0.25; z-index:2;}
.hero .wrap{position:relative; z-index:3;}
.hero h1{font-size:clamp(38px,5.4vw,64px); font-weight:700; line-height:1.05; letter-spacing:-0.02em; max-width:780px; text-shadow:0 4px 20px rgba(0,0,0,0.3); margin-top:0;} /* margin-top:0 */
.grad{background:var(--grad-hero); -webkit-background-clip:text; background-clip:text; color:transparent;}
.hero p.lead{max-width:560px; color:var(--muted); font-size:17px; margin:24px 0 36px;}
.btn-row{display:flex; gap:16px; align-items:center; flex-wrap:wrap; justify-content:flex-start;}
.btn-primary{background:linear-gradient(135deg, var(--cyan-bright), var(--violet-deep)); color:#fff; font-weight:600; font-size:14.5px; padding:14px 26px; border-radius:100px; display:inline-flex; align-items:center; gap:8px; box-shadow:0 8px 30px -6px rgba(0, 229, 255, 0.3); transition:transform 0.2s, box-shadow 0.2s;}
.btn-primary:hover{transform:translateY(-3px); box-shadow:0 14px 34px -6px var(--cyan-bright);}
.btn-ghost{border:1px solid rgba(255,255,255,0.15); background:rgba(255,255,255,0.03); backdrop-filter:blur(8px); color:var(--text); font-weight:500; font-size:14.5px; padding:14px 26px; border-radius:100px; display:inline-flex; align-items:center; gap:8px; transition:border-color 0.2s, transform 0.2s, background 0.2s;}
.btn-ghost:hover{border-color:var(--cyan-bright); background:rgba(0, 229, 255, 0.1); transform:translateY(-3px);}

/* ---------- Pages intérieures (about, contact, services, works) ---------- */
.page-hero {
  padding: 30px 0 40px;    /* padding‑top réduit */
  min-height: auto;
  position:relative;
  overflow:hidden;
}
.page-hero .wrap{position:relative; z-index:3;}
.page-hero h1{margin-top:0; font-size:clamp(34px,4.6vw,52px);}
.page-hero .eyebrow{font-family:'JetBrains Mono'; font-size:11.5px; letter-spacing:0.14em; text-transform:uppercase; color:var(--cyan-bright); margin-bottom:12px;}
.page-hero .lead{max-width:600px; color:var(--muted); font-size:17px; margin-top:12px;}

/* Ajustement spécifique pour la page services */
.service-hero {
  min-height: auto;
  padding: 30px 0 40px;
}

.stack-row{margin-top:70px;}
.stack-label{font-family:'JetBrains Mono'; font-size:11px; letter-spacing:0.14em; text-transform:uppercase; color:var(--muted); margin-bottom:16px;}
.stack-chips{display:flex; flex-wrap:wrap; gap:10px;}
.chip{font-family:'JetBrains Mono'; font-size:12.5px; color:var(--text); border:1px solid rgba(255,255,255,0.1); background:rgba(255,255,255,0.04); backdrop-filter:blur(6px); padding:8px 16px; border-radius:50px; transition:all 0.2s;}
.chip:hover{border-color:var(--cyan-bright); background:rgba(0, 229, 255, 0.05); transform:translateY(-2px); box-shadow:0 0 15px rgba(0, 229, 255, 0.1);}

/* ---------- Cartes Impactantes (Glass + Ombres 3D) ---------- */
.cards4{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.1); border-radius:var(--radius); overflow:hidden; margin-top:64px; box-shadow:var(--shadow-card);}
.card4{background:linear-gradient(135deg, rgba(255,255,255,0.04) 0%, rgba(0, 229, 255, 0.02) 100%); backdrop-filter:blur(var(--glass-blur)); padding:26px 22px; transition:all 0.3s cubic-bezier(.22,1,.36,1);}
.card4:hover{background:linear-gradient(135deg, rgba(255,255,255,0.08) 0%, rgba(0, 229, 255, 0.06) 100%); transform:translateY(-4px); border-left:2px solid var(--cyan-bright); box-shadow:inset 0 0 20px rgba(0, 229, 255, 0.05);}
.card4 .ico{width:38px; height:38px; border-radius:9px; margin-bottom:18px; background:linear-gradient(135deg, rgba(0, 229, 255, 0.2), rgba(124, 58, 237, 0.2)); border:1px solid rgba(0, 229, 255, 0.3); display:flex; align-items:center; justify-content:center; transition:transform 0.25s, box-shadow 0.3s; color:var(--cyan-bright);}
.card4:hover .ico{transform:scale(1.15) rotate(-6deg); box-shadow:0 0 15px rgba(0, 229, 255, 0.4);}
.card4 h3{font-size:16px; font-weight:600; margin-bottom:8px; color:var(--text-light);}
.card4 p{font-size:13px; color:var(--muted); line-height:1.55;}

/* ---------- Sections ---------- */
.sec-head{text-align:center; max-width:600px; margin:0 auto 56px;}
.sec-tag{font-family:'JetBrains Mono'; font-size:11.5px; letter-spacing:0.14em; text-transform:uppercase; color:var(--cyan-bright); margin-bottom:14px; text-shadow:0 0 10px rgba(0, 229, 255, 0.3);}
.sec-head h2{font-size:clamp(28px,3.6vw,40px); font-weight:700; letter-spacing:-0.01em; color:var(--text-light);}
.sec-head p{color:var(--muted); margin-top:14px; font-size:15px;}
.trace-divider{width:120px; height:3px; margin:22px auto 0; background:var(--grad-hero); border-radius:3px; box-shadow:0 0 15px rgba(0, 229, 255, 0.2);}
section.pad{padding:110px 0;}
section.pad.alt{background:var(--bg-alt); border-top:1px solid rgba(255,255,255,0.05); border-bottom:1px solid rgba(255,255,255,0.05);}

/* ---------- Event Section ---------- */
.event-section{background:linear-gradient(180deg, var(--bg-alt), var(--bg));}

/* ---------- Countdown ---------- */
.countdown{display:flex; justify-content:center; gap:28px; margin:30px 0 16px;}
.cd-item{text-align:center; background:linear-gradient(135deg, rgba(255,255,255,0.05), rgba(0, 229, 255, 0.02)); padding:12px 16px; border-radius:var(--radius); border:1px solid rgba(255,255,255,0.1); min-width:70px; box-shadow:0 10px 20px -5px rgba(0,0,0,0.3);}
.cd-item span{font-family:'Space Grotesk'; font-size:32px; font-weight:700; display:block; color:var(--cyan-bright); text-shadow:0 0 10px rgba(0, 229, 255, 0.2);}
.cd-item small{font-size:11px; color:var(--muted); text-transform:uppercase; letter-spacing:0.1em;}

/* ---------- Projects ---------- */
.proj-grid{display:grid; grid-template-columns:1fr 1fr; gap:24px;}
.proj-grid.wide{grid-template-columns:repeat(3,1fr);}
.proj-card{position:relative; border-radius:var(--radius); overflow:hidden; border:1px solid rgba(255,255,255,0.1); aspect-ratio:16/11; background:var(--bg); transition:transform 0.3s, box-shadow 0.3s, border-color 0.3s; box-shadow:var(--shadow-card);}
.proj-card:hover{transform:scale(1.02); border-color:var(--cyan-bright); box-shadow:0 0 30px rgba(0, 229, 255, 0.1);}
.proj-card .art{position:absolute; inset:0; transition:transform 0.6s ease;}
.proj-card:hover .art{transform:scale(1.08);}
.proj-card .tag{position:absolute; top:16px; left:16px; font-family:'JetBrains Mono'; font-size:10px; text-transform:uppercase; background:rgba(0,0,0,0.6); backdrop-filter:blur(6px); color:var(--text); padding:4px 10px; border-radius:6px; border:1px solid rgba(255,255,255,0.1);}
.proj-card .info{position:absolute; left:0; right:0; bottom:0; padding:20px; background:linear-gradient(to top, rgba(10, 17, 26, 0.95), transparent);}
.proj-card .info h3{font-size:17px; font-weight:600; color:var(--text-light);}
.proj-card .info span{font-size:12.5px; color:var(--muted);}
.art-1{background:radial-gradient(circle at 30% 30%, var(--cyan-bright), var(--bg) 70%);}
.art-2{background:radial-gradient(circle at 70% 40%, var(--violet-deep), var(--bg) 70%);}
.art-3{background:radial-gradient(circle at 40% 70%, #03445f, var(--bg) 70%);}
.art-4{background:radial-gradient(circle at 60% 30%, #00a896, var(--bg) 70%);}
.art-5{background:radial-gradient(circle at 50% 50%, var(--cyan-bright), var(--violet-deep) 120%);}
.art-6{background:radial-gradient(circle at 20% 60%, #00a896, #03445f 100%);}

/* ---------- VISUAL ASSETS (Images conservées) ---------- */
.section-img, .project-img, .story-art, .team-avatar{background-size:cover; background-position:center; background-repeat:no-repeat;}
.section-img{min-height:220px; aspect-ratio:16/10; border-radius:var(--radius); border:1px solid rgba(255,255,255,0.05); overflow:hidden; position:relative; background-color:var(--bg);}
.section-img::after, .project-img::after, .story-art::after, .team-avatar::after{content:''; position:absolute; inset:0; background:linear-gradient(135deg, rgba(10, 17, 26, 0.08), rgba(10, 17, 26, 0.5)); pointer-events:none;}
.img-software{background-image:linear-gradient(rgba(10, 17, 26, 0.2), rgba(10, 17, 26, 0.4)), url('https://images.unsplash.com/photo-1555066931-4365d14bab8c?auto=format&fit=crop&w=1200&q=80');}
.img-cloud{background-image:linear-gradient(rgba(10, 17, 26, 0.2), rgba(10, 17, 26, 0.4)), url('https://images.unsplash.com/photo-1451187580459-43490279c0fa?auto=format&fit=crop&w=1200&q=80');}
.img-ai{background-image:linear-gradient(rgba(10, 17, 26, 0.2), rgba(10, 17, 26, 0.4)), url('https://images.unsplash.com/photo-1677442136019-21780ecad995?auto=format&fit=crop&w=1200&q=80');}
.img-security{background-image:linear-gradient(rgba(10, 17, 26, 0.2), rgba(10, 17, 26, 0.4)), url('https://images.unsplash.com/photo-1563986768609-322da13575f3?auto=format&fit=crop&w=1200&q=80');}
.img-contact{background-image:linear-gradient(rgba(10, 17, 26, 0.2), rgba(10, 17, 26, 0.4)), url('https://images.unsplash.com/photo-1556761175-b413da4baf72?auto=format&fit=crop&w=1200&q=80');}
.project-fintech{background-image:linear-gradient(to top, rgba(10, 17, 26, 0.4), rgba(10, 17, 26, 0.1)), url('https://images.unsplash.com/photo-1554224155-6726b3ff858f?auto=format&fit=crop&w=1100&q=80');}
.project-health{background-image:linear-gradient(to top, rgba(10, 17, 26, 0.4), rgba(10, 17, 26, 0.1)), url('https://images.unsplash.com/photo-1576091160550-2173dba999ef?auto=format&fit=crop&w=1100&q=80');}
.project-agri{background-image:linear-gradient(to top, rgba(10, 17, 26, 0.4), rgba(10, 17, 26, 0.1)), url('https://images.unsplash.com/photo-1500382017468-9049fed747ef?auto=format&fit=crop&w=1100&q=80');}
.project-logistics{background-image:linear-gradient(to top, rgba(10, 17, 26, 0.4), rgba(10, 17, 26, 0.1)), url('https://images.unsplash.com/photo-1586528116311-ad8dd3c8310d?auto=format&fit=crop&w=1100&q=80');}
.project-education{background-image:linear-gradient(to top, rgba(10, 17, 26, 0.4), rgba(10, 17, 26, 0.1)), url('https://images.unsplash.com/photo-1522202176988-66273c2fd55f?auto=format&fit=crop&w=1100&q=80');}
.project-energy{background-image:linear-gradient(to top, rgba(10, 17, 26, 0.4), rgba(10, 17, 26, 0.1)), url('https://images.unsplash.com/photo-1509391366360-2e959784a276?auto=format&fit=crop&w=1100&q=80');}

/* ---------- Services ---------- */
.service-preview{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
.service-tile{display:flex; flex-direction:column; min-height:100%; background:linear-gradient(135deg, rgba(255,255,255,0.04), rgba(0, 229, 255, 0.02)); border:1px solid rgba(255,255,255,0.08); border-radius:var(--radius); overflow:hidden; transition:transform 0.3s, border-color 0.3s, box-shadow 0.3s; box-shadow:var(--shadow-card);}
.service-tile:hover{transform:translateY(-8px); border-color:var(--violet-deep); box-shadow:0 0 30px rgba(124, 58, 237, 0.1);}
.service-tile .section-img{border:0; border-radius:0; min-height:190px; aspect-ratio:16/10;}
.service-copy{padding:24px;}
.service-copy span{font-family:'JetBrains Mono'; font-size:12px; color:var(--cyan-bright);}
.service-copy h3{font-size:17px; margin:8px 0; color:var(--text-light);}
.service-copy p{font-size:13.5px; color:var(--muted);}
.service-hero{min-height:430px;}
.service-detail-grid{display:grid; gap:34px;}
.service-detail{display:grid; grid-template-columns:minmax(280px,0.9fr) minmax(320px,1.1fr); gap:34px; align-items:center; padding:28px; background:linear-gradient(135deg, rgba(255,255,255,0.04), rgba(0, 229, 255, 0.02)); border:1px solid rgba(255,255,255,0.08); border-radius:var(--radius); box-shadow:var(--shadow-card); transition:border-color 0.3s;}
.service-detail:hover{border-color:var(--cyan-bright);}
.service-detail:nth-child(even) .service-detail-media{order:2;}
.service-detail-media{min-height:300px; aspect-ratio:4/3; width:100%; background-size:cover; background-position:center; border-radius:var(--radius); border:1px solid rgba(255,255,255,0.05); overflow:hidden;}
.service-detail:hover .service-detail-media{transform:scale(1.02);}
.service-detail-copy h2{font-size:clamp(24px,3vw,34px); line-height:1.15; margin-bottom:16px; color:var(--text-light);}
.service-detail-copy p{color:var(--muted); margin-bottom:20px;}
.check-list li{display:flex; gap:10px; padding:9px 0; border-top:1px solid rgba(255,255,255,0.05); font-size:13.5px; color:var(--muted);}
.check-list li:first-child{border-top:0;}
.check-list li::before{content:'✓'; color:var(--cyan-bright); font-weight:700;}

/* ---------- Impact ---------- */
.impact-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:24px;}
.impact-card{border:1px solid rgba(255,255,255,0.08); border-radius:var(--radius); padding:36px 24px; text-align:center; background:linear-gradient(135deg, rgba(255,255,255,0.04), rgba(0, 229, 255, 0.02)); transition:transform 0.3s, box-shadow 0.3s; box-shadow:var(--shadow-card);}
.impact-card:hover{transform:translateY(-6px); box-shadow:0 0 25px rgba(0, 229, 255, 0.1);}
.impact-card .num{font-family:'Space Grotesk'; font-size:44px; font-weight:700; color:var(--cyan-bright); text-shadow:0 0 15px rgba(0, 229, 255, 0.2);}
.impact-card .num span{background:var(--grad-hero); -webkit-background-clip:text; background-clip:text; color:transparent;}
.impact-card .lbl{color:var(--muted); font-size:13px; margin-top:8px;}

/* ---------- PARTNERS GLASS ---------- */
.partners-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:30px; max-width:900px; margin:0 auto;}
.partner-card{display:flex; flex-direction:column; align-items:center; text-align:center; background:linear-gradient(135deg, rgba(255,255,255,0.04), rgba(0, 229, 255, 0.02)); border:1px solid rgba(255,255,255,0.08); border-radius:var(--radius); padding:32px 20px; transition:transform 0.3s ease, border-color 0.3s ease, box-shadow 0.3s; box-shadow:var(--shadow-card);}
.partner-card:hover{transform:translateY(-8px); border-color:var(--gold); box-shadow:0 0 30px rgba(245, 158, 11, 0.1); text-decoration:none;}
.partner-logo{width:140px; height:90px; background:#ffffff; border-radius:12px; display:flex; align-items:center; justify-content:center; margin-bottom:20px; padding:12px; box-shadow:0 8px 24px rgba(0,0,0,0.2); transition:transform 0.3s ease, box-shadow 0.3s;}
.partner-card:hover .partner-logo{transform:scale(1.08) rotate(-2deg); box-shadow:0 12px 30px rgba(0,0,0,0.3);}
.partner-logo img{max-width:100%; max-height:100%; object-fit:contain;}
.partner-card h3{font-size:16px; font-weight:600; color:var(--text-light); margin-bottom:6px;}
.partner-card p{font-size:13px; color:var(--muted); font-style:italic;}

/* ---------- About page ---------- */
.values-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
.value-card{background:linear-gradient(135deg, rgba(255,255,255,0.04), rgba(0, 229, 255, 0.02)); border:1px solid rgba(255,255,255,0.08); border-radius:var(--radius); padding:30px; transition:transform 0.3s, border-color 0.3s, box-shadow 0.3s; box-shadow:var(--shadow-card);}
.value-card:hover{transform:translateY(-6px); border-color:var(--cyan-bright); box-shadow:0 0 25px rgba(0, 229, 255, 0.1);}
.value-card .ico{width:40px; height:40px; border-radius:10px; background:linear-gradient(135deg, rgba(0, 229, 255, 0.2), rgba(124, 58, 237, 0.2)); border:1px solid rgba(0, 229, 255, 0.3); display:flex; align-items:center; justify-content:center; margin-bottom:18px; color:var(--cyan-bright);}
.value-card h3{font-size:16px; font-weight:600; color:var(--text-light); margin-bottom:8px;}
.value-card p{font-size:13.5px; color:var(--muted);}

.story-grid{display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center;}
.story-art{aspect-ratio:1/1; border-radius:24px; position:relative; overflow:hidden; border:1px solid rgba(255,255,255,0.08); box-shadow:0 28px 70px rgba(0,0,0,0.4); background-image:linear-gradient(145deg, rgba(10, 17, 26, 0.08), rgba(10, 17, 26, 0.7)), url('https://images.unsplash.com/photo-1552664730-d307ca884978?auto=format&fit=crop&w=1400&q=85'); background-attachment:fixed; background-position:center;}
.story-art::before{content:''; position:absolute; inset:0; z-index:1; background:linear-gradient(180deg, transparent 35%, rgba(10, 17, 26, 0.8)), radial-gradient(circle at 25% 20%, rgba(0, 229, 255, 0.2), transparent 28%); pointer-events:none;}
.story-logo-card{position:absolute; top:24px; left:24px; right:24px; z-index:2; display:flex; align-items:center; gap:14px; padding:14px; border:1px solid rgba(255,255,255,0.15); border-radius:16px; background:rgba(10, 17, 26, 0.6); backdrop-filter:blur(12px);}
.story-logo-card img{width:58px; height:58px; object-fit:contain; padding:8px; border-radius:14px; background:#fff; flex-shrink:0;}
.story-logo-card strong{display:block; font-size:16px; color:#fff; line-height:1.2;}
.story-logo-card span{display:block; color:var(--muted); font-size:12.5px; margin-top:3px;}
.story-art-caption{position:absolute; left:24px; right:24px; bottom:24px; z-index:2;}
.story-art-caption span{display:inline-flex; font-family:'JetBrains Mono'; font-size:10.5px; letter-spacing:0.12em; text-transform:uppercase; color:var(--cyan-bright); margin-bottom:10px;}
.story-art-caption strong{display:block; max-width:360px; font-family:'Space Grotesk'; font-size:clamp(22px,3vw,32px); line-height:1.08; color:#fff;}
.story-text p{color:var(--muted); font-size:15px; margin-bottom:16px;}

.timeline{display:grid; grid-template-columns:repeat(4,1fr); gap:24px; position:relative;}
.timeline::before{content:''; position:absolute; top:9px; left:5%; right:5%; height:1px; background:rgba(255,255,255,0.05);}
.tl-item{text-align:center; position:relative;}
.tl-dot{width:18px; height:18px; border-radius:50%; background:var(--grad-hero); margin:0 auto 18px; box-shadow:0 0 10px rgba(0, 229, 255, 0.3);}
.tl-item h4{font-family:'JetBrains Mono'; font-size:13px; color:var(--cyan-bright); margin-bottom:6px;}
.tl-item p{font-size:13.5px; color:var(--muted);}

.team-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:22px;}
.team-card{overflow:hidden; background:linear-gradient(180deg, rgba(255,255,255,0.04), rgba(255,255,255,0.01)); border:1px solid rgba(255,255,255,0.08); border-radius:18px; transition:transform 0.3s, border-color 0.3s, box-shadow 0.3s; box-shadow:var(--shadow-card);}
.team-card:hover{transform:translateY(-8px); border-color:var(--violet-deep); box-shadow:0 0 25px rgba(124, 58, 237, 0.1);}
.team-avatar{aspect-ratio:4/5; border-radius:0; background:var(--grad-soft); border:0; margin-bottom:0; position:relative; overflow:hidden; background-size:cover; background-position:center top; transition:transform 0.55s ease;}
.team-card:hover .team-avatar{transform:scale(1.04);}
.team-avatar::after{content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(10, 17, 26, 0) 0%, rgba(10, 17, 26, 0.1) 58%, rgba(10, 17, 26, 0.4) 100%);}
.team-card:nth-child(1) .team-avatar{background-image:url('https://images.unsplash.com/photo-1494790108377-be9c29b29330?auto=format&fit=crop&w=700&q=88');}
.team-card:nth-child(2) .team-avatar{background-image:url('https://images.unsplash.com/photo-1500648767791-00dcc994a43e?auto=format&fit=crop&w=700&q=88');}
.team-card:nth-child(3) .team-avatar{background-image:url('https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?auto=format&fit=crop&w=700&q=88');}
.team-card:nth-child(4) .team-avatar{background-image:url('https://images.unsplash.com/photo-1531123897727-8f129e1688ce?auto=format&fit=crop&w=700&q=88');}
.team-info{padding:20px;}
.team-card h4{font-size:16px; font-weight:600; color:var(--text-light); margin-bottom:3px;}
.team-card span{display:block; font-size:12.5px; color:var(--cyan-bright); margin-bottom:10px;}
.team-card p{font-size:13px; color:var(--muted); line-height:1.55;}

/* ---------- Process ---------- */
.process-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:24px;}
.process-item{background:linear-gradient(135deg, rgba(255,255,255,0.04), rgba(0, 229, 255, 0.02)); border:1px solid rgba(255,255,255,0.08); border-radius:var(--radius); padding:28px; transition:transform 0.3s, box-shadow 0.3s; box-shadow:var(--shadow-card);}
.process-item:hover{transform:translateY(-6px); box-shadow:0 0 20px rgba(0, 229, 255, 0.1);}
.process-item .num{font-family:'Space Grotesk'; font-size:26px; font-weight:700; color:var(--cyan-bright); margin-bottom:14px;}
.process-item h3{font-size:15.5px; font-weight:600; color:var(--text-light); margin-bottom:8px;}
.process-item p{font-size:13px; color:var(--muted);}

/* ---------- Contact ---------- */
.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:50px;}
.contact-visual{margin-bottom:18px; min-height:260px; aspect-ratio:16/9;}
.contact-info-card{background:linear-gradient(135deg, rgba(255,255,255,0.04), rgba(0, 229, 255, 0.02)); border:1px solid rgba(255,255,255,0.08); border-radius:var(--radius); padding:24px; display:flex; gap:16px; align-items:flex-start; margin-bottom:16px; transition:border-color 0.25s, box-shadow 0.25s; box-shadow:var(--shadow-card);}
.contact-info-card:hover{border-color:rgba(0, 229, 255, 0.4); box-shadow:0 0 20px rgba(0, 229, 255, 0.1);}
.contact-info-card .ico{width:36px; height:36px; border-radius:9px; background:linear-gradient(135deg, rgba(0, 229, 255, 0.2), rgba(124, 58, 237, 0.2)); border:1px solid rgba(0, 229, 255, 0.3); display:flex; align-items:center; justify-content:center; flex-shrink:0; color:var(--cyan-bright);}
.contact-info-card h4{font-size:14.5px; color:var(--text-light); margin-bottom:4px;}
.contact-info-card p, .contact-info-card a{font-size:13.5px; color:var(--muted);}
.form-group{margin-bottom:20px;}
.form-group label{display:block; font-size:13px; color:var(--muted); margin-bottom:8px; font-family:'JetBrains Mono';}
.form-group input, .form-group textarea, .form-group select{width:100%; background:var(--bg); border:1px solid rgba(255,255,255,0.1); border-radius:10px; padding:13px 16px; color:var(--text); font-family:'Inter'; font-size:14px; transition:border-color 0.25s, box-shadow 0.25s;}
.form-group input:focus, .form-group textarea:focus, .form-group select:focus{outline:none; border-color:var(--cyan-bright); box-shadow:0 0 15px rgba(0, 229, 255, 0.1);}
.form-group textarea{resize:vertical; min-height:110px;}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
.form-note{font-size:12px; color:var(--muted); margin-top:12px;}
.submit-btn{border:none; cursor:pointer;}
.form-success{display:none; text-align:center; padding:40px 20px;}
.form-success.show{display:block;}
.form-success .ico{width:56px; height:56px; border-radius:50%; background:var(--grad-hero); display:flex; align-items:center; justify-content:center; margin:0 auto 18px; font-size:24px; color:#fff; box-shadow:0 0 20px rgba(0, 229, 255, 0.3);}

/* ---------- FAQ ---------- */
.faq{max-width:760px; margin:0 auto;}
.faq-item{border-bottom:1px solid rgba(255,255,255,0.05); padding:22px 0;}
.faq-q{display:flex; justify-content:space-between; align-items:center; cursor:pointer; font-size:15.5px; font-weight:600; color:var(--text-light);}
.faq-q .plus{color:var(--cyan-bright); font-size:20px; transition:transform 0.25s;}
.faq-item.open .plus{transform:rotate(45deg);}
.faq-a{max-height:0; overflow:hidden; transition:max-height 0.3s ease; color:var(--muted); font-size:14px;}
.faq-item.open .faq-a{max-height:220px; padding-top:14px;}

/* ---------- CTA ---------- */
.cta-final{text-align:center; padding:100px 32px; border-radius:28px; margin:0 32px; background:linear-gradient(160deg, var(--bg-alt), var(--bg-dark)); border:1px solid rgba(255,255,255,0.05); position:relative; overflow:hidden; box-shadow:inset 0 0 40px rgba(0, 229, 255, 0.02);}
.cta-final h2{font-size:clamp(30px,4.6vw,52px); font-weight:700; max-width:640px; margin:0 auto 30px; position:relative; z-index:1; color:var(--text-light);}
.cta-final .sec-tag{justify-content:center; display:flex; position:relative; z-index:1;}
.cta-final .btn-primary{position:relative; z-index:1;}

/* ---------- Footer ---------- */
footer{padding:72px 0 30px; border-top:1px solid rgba(255,255,255,0.05); background:radial-gradient(circle at 15% 0%, rgba(0, 229, 255, 0.08), transparent 34%), radial-gradient(circle at 85% 20%, rgba(124, 58, 237, 0.08), transparent 32%), linear-gradient(180deg, rgba(10, 17, 26, 0.9), var(--bg-dark));}
.foot-top{display:grid; grid-template-columns:minmax(280px,1.05fr) minmax(520px,1.4fr); gap:56px; align-items:start; margin-bottom:48px;}
.foot-brand{display:grid; grid-template-columns:84px 1fr; gap:20px; align-items:start;}
.foot-logo{display:inline-flex; align-items:center; justify-content:center; width:84px; height:84px; padding:12px; background:#fff; border-radius:18px; box-shadow:0 18px 38px rgba(0,0,0,0.3);}
.foot-logo img{width:60px; height:60px; object-fit:contain;}
.foot-brand h3{font-size:20px; font-weight:700; color:var(--text-light); margin-bottom:10px;}
.foot-brand p{color:var(--muted); font-size:14px; max-width:390px; margin-bottom:20px;}
.foot-cta{display:inline-flex; align-items:center; color:var(--cyan-bright); font-size:13.5px; font-weight:600; border-bottom:1px solid rgba(0, 229, 255, 0.3); padding-bottom:3px; transition:color 0.2s, border-color 0.2s;}
.foot-cta:hover{color:var(--text-light); border-color:var(--text-light);}
.foot-cols{display:grid; grid-template-columns:repeat(3,minmax(150px,1fr)); gap:36px;}
.foot-col h4{font-size:11px; text-transform:uppercase; letter-spacing:0.14em; color:var(--cyan-bright); margin-bottom:18px;}
.foot-col a, .foot-col span{display:block; font-size:14px; color:var(--muted); margin-bottom:11px; transition:color 0.2s, transform 0.2s;}
.foot-col a:hover{color:var(--text-light); transform:translateX(3px);}
.foot-contact a{color:var(--text-light);}
.foot-bottom{display:flex; justify-content:space-between; align-items:center; color:var(--muted); font-size:12.5px; border-top:1px solid rgba(255,255,255,0.05); padding-top:24px; flex-wrap:wrap; gap:14px;}
.foot-legal{display:flex; gap:20px; flex-wrap:wrap;}
.foot-legal a{color:var(--muted); transition:color 0.2s;}
.foot-legal a:hover{color:var(--cyan-bright);}

/* ===== AJOUTS POUR LE MENU FLOTTANT ET LE MODAL ===== */
.siae-floating-tab {
  position: fixed;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 9999;
  background: linear-gradient(135deg, #e51d3c, #14233f);
  padding: 10px 8px 10px 12px;
  border-top-left-radius: 12px;
  border-bottom-left-radius: 12px;
  box-shadow: -4px 8px 25px rgba(0, 0, 0, 0.4);
  border: 1px solid rgba(255,255,255,0.1);
  border-right: none;
  transition: transform 0.25s cubic-bezier(.22,1,.36,1), box-shadow 0.3s;
}
.siae-floating-tab:hover {
  transform: translateY(-50%) scale(1.05) translateX(-4px);
  box-shadow: -8px 8px 35px rgba(0, 0, 0, 0.6);
}
.siae-floating-tab img {
  width: 44px;
  height: auto;
  display: block;
}

.welcome-modal-overlay {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 99999;
  background: rgba(0, 0, 0, 0.75);
  backdrop-filter: blur(6px);
  justify-content: center;
  align-items: center;
  padding: 20px;
  animation: fadeIn 0.4s ease;
}
.welcome-modal-overlay.open { display: flex; }

.welcome-modal-content {
  position: relative;
  max-width: 560px;
  width: 100%;
  background: linear-gradient(145deg, rgba(20, 35, 63, 0.95), rgba(10, 17, 26, 0.98));
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: var(--radius);
  padding: 40px;
  box-shadow: 0 30px 80px rgba(0,0,0,0.8);
  overflow: hidden;
}
.welcome-modal-close {
  position: absolute;
  top: 16px;
  right: 20px;
  background: none;
  border: none;
  color: var(--muted);
  font-size: 28px;
  cursor: pointer;
  transition: color 0.2s, transform 0.2s;
  z-index: 2;
}
.welcome-modal-close:hover { color: #fff; transform: rotate(90deg); }
.welcome-modal-body {
  position: relative;
  z-index: 1;
  text-align: center;
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

.event-image-card img { display: block; width: 100%; height: auto; }

/* ---------- Responsive ---------- */
@media(max-width:900px){
  .cards4{grid-template-columns:repeat(2,1fr);}
  .proj-grid, .proj-grid.wide{grid-template-columns:1fr;}
  .service-preview{grid-template-columns:1fr;}
  .service-detail{grid-template-columns:1fr; padding:22px;}
  .service-detail:nth-child(even) .service-detail-media{order:0;}
  .service-detail-media{min-height:240px; aspect-ratio:16/10;}
  .impact-grid{grid-template-columns:repeat(2,1fr);}
  .values-grid{grid-template-columns:1fr;}
  .story-grid{grid-template-columns:1fr;}
  .story-art{aspect-ratio:16/11; background-attachment:scroll;}
  .timeline{grid-template-columns:1fr 1fr;}
  .team-grid{grid-template-columns:1fr 1fr;}
  .process-grid{grid-template-columns:1fr 1fr;}
  .contact-grid{grid-template-columns:1fr;}
  .foot-top{grid-template-columns:1fr; gap:42px;}
  .foot-cols{grid-template-columns:repeat(3,1fr);}
  .partners-grid{grid-template-columns:1fr 1fr;}
}
@media(max-width:640px){
  .navlinks{display:none;}
  .menu-btn{display:block;}
  .nav{padding:12px 20px;}
  .brand{min-width:0; gap:10px;}
  .brand img{width:42px; height:42px; padding:6px; border-radius:12px;}
  .brand span{font-size:15px;}
  .hero{min-height:auto; padding:20px 0 40px; background-attachment:scroll; background-position:62% center;}
  .page-hero{padding:20px 0 30px; min-height:auto;}
  .service-hero{padding:20px 0 30px; min-height:auto;}
  .cards4{grid-template-columns:1fr;}
  .impact-grid{grid-template-columns:1fr 1fr;}
  .foot-brand{grid-template-columns:1fr;}
  .foot-cols{grid-template-columns:1fr; gap:26px;}
  .foot-bottom{align-items:flex-start; flex-direction:column;}
  .foot-legal{gap:14px;}
  .nav-cta{display:none;}
  .form-row{grid-template-columns:1fr;}
  .timeline{grid-template-columns:1fr 1fr;}
  .team-grid{grid-template-columns:1fr;}
  .team-avatar{aspect-ratio:16/12;}
  .story-logo-card{top:16px; left:16px; right:16px;}
  .story-art-caption{left:16px; right:16px; bottom:18px;}
  .process-grid{grid-template-columns:1fr;}
  .section-img{min-height:190px;}
  .service-detail-media{min-height:210px;}
  .cta-final{margin:0 16px; padding:60px 20px;}
  .countdown{gap:12px; flex-wrap:wrap;}
  .cd-item{min-width:60px; padding:8px 12px;}
  .cd-item span{font-size:24px;}
  .partners-grid{grid-template-columns:1fr;}
  .siae-floating-tab { padding: 6px 4px 6px 8px; }
  .siae-floating-tab img { width: 32px; }
  .welcome-modal-content { padding: 28px 20px; }
  .service-detail-media { min-height: 180px; }
}
@media(prefers-reduced-motion: reduce){ html{scroll-behavior:auto;} }