* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 88px; }
body { margin: 0; background: #0a0a0c; color: #f4f4f6; font-family: 'Outfit', system-ui, sans-serif; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
::selection { background: #d4f300; color: #0a0a0c; }
input, textarea, button { font-family: inherit; }
input::placeholder, textarea::placeholder { color: rgba(255,255,255,0.32); }
a { color: inherit; }

/* ── Keyframes ─────────────────────────────────────── */
@keyframes drift { 0%,100% { transform: translate(0,0); } 50% { transform: translate(1%,-0.8%); } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes overlayIn { from { opacity:0; } to { opacity:1; } }
@keyframes overlayOut { from { opacity:1; } to { opacity:0; } }
@keyframes memberCardIn { from { transform:translateY(22px) scale(0.965) translateZ(0); } to { transform:translateY(0) scale(1) translateZ(0); } }
@keyframes cardOut { from { transform:translateY(0) scale(1) translateZ(0); opacity:1; } to { transform:translateY(12px) scale(0.97) translateZ(0); opacity:0; } }
@keyframes spinFast { from { transform:rotate(0deg); } to { transform:rotate(360deg); } }
@keyframes spinSlow  { from { transform:rotate(0deg); } to { transform:rotate(360deg); } }
@keyframes glowIn   { 0% { filter: drop-shadow(0 0 10px rgba(212,243,0,.5)) drop-shadow(0 0 20px rgba(140,80,255,.3)); } 100% { filter: drop-shadow(0 0 0px rgba(212,243,0,0)); } }
@keyframes avatarSlideIn { from { transform:scale(0.85) translateY(10px) translateZ(0); } to { transform:scale(1) translateY(0) translateZ(0); } }
@keyframes star-glow {
  0%,100% { text-shadow: 0 0 5px rgba(212,243,0,.35), 0 0 10px rgba(212,243,0,.15); opacity:.8; }
  50%      { text-shadow: 0 0 10px rgba(212,243,0,.9), 0 0 22px rgba(212,243,0,.5), 0 0 40px rgba(212,243,0,.2); opacity:1; }
}
@property --border-angle { syntax:'<angle>'; inherits:false; initial-value:0deg; }
@keyframes border-spin { from { --border-angle:196deg; } to { --border-angle:556deg; } }

/* ── Utility ─────────────────────────────────────── */
.section-star { display:inline-block; animation:star-glow 2.8s ease-in-out infinite; margin-right:8px; }
.modal-closing-overlay { animation:overlayOut 0.35s ease forwards !important; pointer-events:none !important; }
.modal-closing-card { animation:cardOut 0.35s ease forwards !important; }

/* ── Logo ─────────────────────────────────────── */
.logo-symbol { animation:spinFast 1.1s cubic-bezier(0.15,0.85,0.3,1) forwards, spinSlow 32s 1.1s linear infinite, glowIn 2s ease-out forwards; will-change:transform; transform:translateZ(0); cursor:pointer; }
.logo-symbol:hover { filter:drop-shadow(0 0 8px rgba(212,243,0,.3)) drop-shadow(0 0 16px rgba(140,80,255,.18)) !important; }

/* ── Navbar links ─────────────────────────────── */
.nav-link { position:relative; display:inline-block; padding:6px 14px; border-radius:999px; text-decoration:none; transition:color .32s ease; }
.nav-link::before { content:''; position:absolute; inset:0; border-radius:999px; border:1px solid rgba(212,243,0,0); background:rgba(212,243,0,0); box-shadow:0 0 0px rgba(212,243,0,0), inset 0 0 0px rgba(212,243,0,0); transition:border-color .38s ease, background .38s ease, box-shadow .42s ease; }
.nav-link:hover { color:#fff !important; }
.nav-link:hover::before { border-color:rgba(212,243,0,.28); background:rgba(212,243,0,.05); box-shadow:0 0 22px rgba(212,243,0,.18), 0 0 6px rgba(212,243,0,.1), inset 0 0 14px rgba(212,243,0,.05); }
.nav-link.active { color:#d4f300 !important; font-weight:700 !important; }
.nav-link.active::before { border-color:rgba(212,243,0,.18); background:rgba(212,243,0,.04); }

/* ── Lang switcher ────────────────────────────── */
.lang-off { color:#9a9aa3; opacity:.4; transition:color .25s ease, opacity .25s ease; cursor:pointer; }
.lang-off:hover { color:#b690ff; opacity:1; }

/* ── Bouton violet ────────────────────────────── */
.btn-glass-violet { position:relative; overflow:hidden; background:linear-gradient(170deg,#6527c8 0%,#5c1fb8 50%,#5019a6 100%); border:none !important; outline:none; box-shadow:0 8px 28px rgba(90,25,185,.5), 0 2px 6px rgba(0,0,0,.35), inset 0 1.5px 0 rgba(255,255,255,.15), inset 0 -1px 0 rgba(0,0,0,.28); font-weight:300 !important; color:#fff !important; cursor:pointer; transition:transform .22s ease, box-shadow .28s ease, background .28s ease; }
.btn-glass-violet::before { content:''; position:absolute; left:var(--shimmer-x,-70%); top:var(--shimmer-y,50%); transform:translateY(-50%); width:80%; height:300%; background:radial-gradient(ellipse 50% 42% at 50% 50%, rgba(255,255,255,.13) 0%, rgba(255,255,255,.05) 50%, rgba(255,255,255,.01) 74%, transparent 100%); pointer-events:none; transition:opacity .3s ease; opacity:calc(var(--shimmer-op,0) * var(--shimmer-show,0)); }
.btn-glass-violet:hover::before { --shimmer-show:1; }
.btn-glass-violet:hover { background:linear-gradient(170deg,#7830e0 0%,#6D27D8 50%,#6022c8 100%) !important; box-shadow:0 14px 40px rgba(109,39,216,.6), 0 3px 10px rgba(0,0,0,.35), inset 0 1.5px 0 rgba(255,255,255,.22), inset 0 -1px 0 rgba(0,0,0,.24) !important; transform:translateY(-2px) !important; }
.btn-glass-violet:active { transform:translateY(0) !important; box-shadow:0 4px 16px rgba(109,39,216,.45) !important; }

/* ── Service accordéon ────────────────────────── */
.service-wrap { border-radius:15px; border:1px solid rgba(255,255,255,.08); background:transparent; transition:border-color .35s ease, box-shadow .35s ease; }
.service-wrap:not(.active):hover { border-color:rgba(255,255,255,.14); box-shadow:0 8px 32px rgba(0,0,0,.18); }
.service-wrap.active { border:none; position:relative; }
.service-wrap.active::before { content:''; position:absolute; inset:-1.5px; border-radius:17px; border:1.5px solid transparent; background:linear-gradient(#0a0a0c,#0a0a0c) padding-box, conic-gradient(from var(--border-angle) at 50% 50%, #6D27D8 0deg, #d4f300 70deg, #d4f300 165deg, #6D27D8 235deg, #6D27D8 360deg) border-box; animation:border-spin 20s linear infinite; pointer-events:none; z-index:-1; }
.service-wrap.anim-reset::before { animation:none !important; }
.service-inner { background:#0a0a0c; border-radius:13.5px; transition:background .35s ease, box-shadow .35s ease; }
.service-wrap:not(.active):hover .service-inner { background:linear-gradient(160deg,rgba(255,255,255,.13) 0%,rgba(255,255,255,.05) 40%,rgba(109,39,216,.10) 100%); backdrop-filter:blur(24px) saturate(160%); -webkit-backdrop-filter:blur(24px) saturate(160%); }
.service-wrap.active .service-inner { border-radius:15px !important; background:linear-gradient(160deg,rgba(255,255,255,.13) 0%,rgba(255,255,255,.05) 40%,rgba(109,39,216,.10) 100%) !important; backdrop-filter:blur(24px) saturate(180%); -webkit-backdrop-filter:blur(24px) saturate(180%); box-shadow:0 8px 40px rgba(0,0,0,.35); }
.service-row { display:flex; align-items:center; justify-content:space-between; gap:20px; width:100%; height:55px; padding:0 24px; background:transparent; border:none; cursor:pointer; transition:color .25s; }
.service-title { font-size:clamp(15px,1.5vw,18px); font-weight:600; letter-spacing:-0.005em; color:#f4f4f6; transition:color .4s ease; }
.service-wrap.active .service-title { color:#d4f300; }
.service-icon { flex:none; width:36px; height:36px; border-radius:50%; background:rgba(109,39,216,.14); border:1px solid rgba(109,39,216,.38); color:#b690ff; display:flex; align-items:center; justify-content:center; font-size:18px; font-weight:300; line-height:1; transition:background .38s ease, border-color .38s ease, color .38s ease, transform .3s cubic-bezier(.2,.8,.2,1); }
.service-row:hover .service-icon { background:rgba(109,39,216,.24); border-color:rgba(140,80,255,.55); color:#cdb0ff; }
.service-wrap.active .service-icon { transform:rotate(45deg); }
.service-body { overflow:hidden; max-height:0; opacity:0; transition:max-height .65s cubic-bezier(.4,0,.2,1), opacity .45s ease; }
.service-wrap.active .service-body { max-height:700px; opacity:1; }

/* ── Portfolio cards ──────────────────────────── */
.portfolio-card { position:relative; border-radius:18px; }
.portfolio-card::before { content:''; position:absolute; inset:-1.5px; border-radius:20px; padding:1.5px; background:conic-gradient(from var(--border-angle) at 50% 50%, #6D27D8 0deg, #d4f300 70deg, #d4f300 165deg, #6D27D8 235deg, #6D27D8 360deg); -webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite:xor; mask-composite:exclude; animation:border-spin 20s linear infinite; opacity:0; transition:opacity .35s ease; pointer-events:none; z-index:1; }
.portfolio-card:hover::before { opacity:1; }
.portfolio-card.anim-reset::before { animation:none !important; }
.price-card-pulse::before { opacity:1 !important; transition:opacity .35s ease !important; }

/* ── Price detail accordion ───────────────────── */
.price-detail { display:grid; grid-template-rows:0fr; transition:grid-template-rows .55s cubic-bezier(.4,0,.2,1); }
.price-detail.open { grid-template-rows:1fr; }
.price-detail > div { overflow:hidden; opacity:0; transition:opacity .6s ease; }
.price-detail.open > div { opacity:1; transition:opacity .9s ease .2s; }

/* ── Play overlay ─────────────────────────────── */
.play-overlay { background:rgba(0,0,0,0); transition:background .3s; }
.portfolio-thumb:hover .play-overlay { background:rgba(0,0,0,.2); }
.play-btn { background:rgba(255,255,255,0); border:1.5px solid rgba(255,255,255,0); transition:background .3s, border-color .3s; }
.portfolio-thumb:hover .play-btn { background:rgba(255,255,255,.22); border-color:rgba(255,255,255,.4); }
.play-btn > span { opacity:0; transition:opacity .3s; }
.portfolio-thumb:hover .play-btn > span { opacity:1; }

/* ── Team buttons ─────────────────────────────── */
.btn-plus-team { transition:background .25s ease, border-color .25s ease, color .25s ease, box-shadow .25s ease; }
.btn-plus-team:hover,
.member-card:hover .btn-plus-team { background:rgba(109,39,216,.45) !important; border-color:rgba(180,120,255,.7) !important; color:#e0ccff !important; box-shadow:0 4px 18px rgba(109,39,216,.4); }
.btn-plus-team:active { background:rgba(109,39,216,.55) !important; color:#fff !important; }

/* ── Member avatar ────────────────────────────── */
.member-avatar { transition:transform .55s cubic-bezier(.2,.8,.2,1), box-shadow .55s cubic-bezier(.2,.8,.2,1); cursor:zoom-in; }
.member-avatar:hover { transform:scale(1.18) translateY(-6px) !important; box-shadow:0 28px 70px rgba(0,0,0,.7) !important; }
.member-avatar-animating { animation:avatarSlideIn .55s cubic-bezier(.2,.8,.2,1) forwards !important; }

/* ── Price cards ──────────────────────────────── */
.btn-toggle-detail { transition:background .25s, border-color .25s, color .25s !important; }
.btn-toggle-detail:hover { background:rgba(109,39,216,.28) !important; border-color:rgba(150,100,255,.55) !important; color:#d4b8ff !important; }
.btn-shimmer-outline { position:relative; overflow:hidden; transition:background .25s, border-color .25s, color .25s !important; }
.btn-shimmer-outline:hover { background:rgba(212,243,0,.07) !important; border-color:rgba(212,243,0,.3) !important; color:#f4f4f6 !important; }
.btn-shimmer-accent { position:relative; overflow:hidden; background:linear-gradient(170deg,#dcff08 0%,#d4f300 50%,#bbda00 100%) !important; border:none !important; outline:none; box-shadow:0 6px 22px rgba(212,243,0,.28), 0 2px 6px rgba(0,0,0,.18); color:#0a0a0c !important; transition:background .28s, box-shadow .28s, transform .22s !important; cursor:pointer; }
.btn-shimmer-accent:hover { box-shadow:0 10px 32px rgba(212,243,0,.38), 0 3px 9px rgba(0,0,0,.2) !important; transform:translateY(-2px) !important; }

/* ── Chips contact ────────────────────────────── */
.chip-prestation { display:inline-flex; align-items:center; gap:6px; flex-shrink:0; padding:8px 16px; border-radius:999px; cursor:pointer; border:1px solid rgba(140,80,255,.45); background:transparent; color:#cdb0ff; font-size:13px; font-weight:400; white-space:nowrap; transition:background .2s, border-color .2s, color .2s, font-weight .2s; }
.chip-prestation:hover { background:rgba(109,39,216,.22) !important; border-color:rgba(150,100,255,.55) !important; color:#d4b8ff !important; font-weight:600 !important; }
.chip-prestation.selected { background:rgba(109,39,216,.5) !important; border-color:rgba(170,120,255,.85) !important; color:#ecdeff !important; font-weight:700 !important; box-shadow:0 0 0 1px rgba(140,80,255,.3), inset 0 0 12px rgba(109,39,216,.25) !important; }

/* ── Modal member card border ─────────────────── */
.member-modal-card { position:relative; border-radius:28px; }
.member-modal-card::before { content:''; position:absolute; inset:-2px; border-radius:30px; padding:2px; background:conic-gradient(from var(--border-angle) at 50% 50%, #6D27D8 0deg, #d4f300 70deg, #d4f300 165deg, #6D27D8 235deg, #6D27D8 360deg); -webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite:xor; mask-composite:exclude; animation:border-spin 20s linear infinite; pointer-events:none; z-index:0; }

/* ── Social links ─────────────────────────────── */
.social-link { transition:color .25s ease; }
.social-link:hover { color:#d4f300 !important; }

/* ── Responsive ───────────────────────────────── */
@media (max-width:920px) {
  .mbcard-pad { padding:80px 22px 36px 22px !important; } /* MBCARD-MOBILE */
  #member-avatar { position:absolute !important; top:-46px !important; right:50% !important; transform:translateX(50%) !important; width:110px !important; height:110px !important; }
  #member-name { font-size:26px !important; }
  .svc-pad { padding:0 20px 24px 20px !important; } /* SVC-MOBILE */
  .service-wrap.active .service-body { max-height:3000px !important; }
  .service-title { font-size:16px !important; }
  [data-nav-links] .nav-link { display:none !important; } /* logo garde sa place en mobile */
  [data-burger] { display:flex !important; }
  [data-fren] { display:none !important; } /* FREN-HIDE */ /* HAMBURGER-CSS */
  [data-services-grid] { gap:32px !important; }
  [data-portfolio-grid] { grid-template-columns:1fr 1fr !important; }
  [data-price-grid] { grid-template-columns:1fr 1fr !important; }
  [data-team-grid] { grid-template-columns:1fr 1fr !important; }
  [data-founder] { grid-template-columns:1fr !important; }
  [data-contact-grid] { display:block !important; }
}
@media (max-width:560px) {
  [data-portfolio-grid], [data-price-grid], [data-team-grid] { grid-template-columns:1fr !important; }
}