:root{
  --bg: #03050c;
  --bg-alt: #05081a;
  --ink: #f4f6fb;
  --ink-muted: #a7afc4;
  --ink-dim: #656d85;
  --blue: #3b5bfe;
  --blue-soft: #7d9bff;
  --blue-pale: #9fb3f0;
  --blue-deep: #0a1e63;
  --card: rgba(255,255,255,0.035);
  --card-border: rgba(255,255,255,0.09);
  --card-border-hover: rgba(59,91,254,0.45);
  --radius: 20px;
  --maxw: 1180px;
  --font-head: 'Bodoni Moda', 'Didot', Georgia, serif;
  --font-body: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}

html{scroll-behavior:smooth;}

body{
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-body);
  font-weight:300;
  line-height:1.6;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}

img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
button{font:inherit;cursor:pointer;border:none;background:none;color:inherit;}
input,textarea{font:inherit;}
ul{list-style:none;}

.container{
  max-width: var(--maxw);
  margin:0 auto;
  padding:0 24px;
}

/* Background decoration */
/* Soft glow built entirely from gradient stops rather than filter:blur — large
   blurred elements are a well-known performance killer on Safari/iOS. */
.bg-glow{
  position:fixed;
  border-radius:50%;
  pointer-events:none;
  z-index:0;
}
.bg-glow--a{
  width:900px;height:900px;
  top:-320px; left:-280px;
  background:radial-gradient(circle, rgba(10,30,99,0.55) 0%, rgba(10,30,99,0.32) 30%, rgba(10,30,99,0.12) 55%, rgba(10,30,99,0) 75%);
}
.bg-glow--b{
  width:750px;height:750px;
  top:900px; right:-300px;
  background:radial-gradient(circle, rgba(10,30,99,0.4) 0%, rgba(10,30,99,0.22) 30%, rgba(10,30,99,0.08) 55%, rgba(10,30,99,0) 75%);
}
.bg-grid{
  position:fixed;
  inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,0.02) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.02) 1px, transparent 1px);
  background-size:56px 56px;
  -webkit-mask-image: radial-gradient(ellipse 80% 60% at 50% 0%, black 40%, transparent 100%);
  mask-image: radial-gradient(ellipse 80% 60% at 50% 0%, black 40%, transparent 100%);
  pointer-events:none;
  z-index:0;
}

/* Reveal animation */
.reveal{
  opacity:0;
  transform:translateY(24px);
  transition:opacity .7s ease, transform .7s ease;
}
.reveal.is-visible{
  opacity:1;
  transform:translateY(0);
}

/* Buttons */
.btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:14px 26px;
  border-radius:999px;
  font-family:var(--font-body);
  font-weight:500;
  font-size:0.95rem;
  transition:transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease;
  white-space:nowrap;
}
.btn--small{padding:10px 20px;font-size:0.875rem;}
.btn--primary{
  background: linear-gradient(135deg, var(--blue), #2440d6);
  color:#f8f9ff;
  box-shadow:0 8px 30px rgba(59,91,254,0.3);
}
.btn--primary:hover{transform:translateY(-2px);box-shadow:0 12px 36px rgba(59,91,254,0.45);}
.btn--ghost{
  background:rgba(255,255,255,0.04);
  border:1px solid var(--card-border);
  color:var(--ink);
}
.btn--ghost:hover{border-color:var(--card-border-hover);background:rgba(255,255,255,0.07);}

/* Header */
.site-header{
  position:sticky; top:0; z-index:50;
  backdrop-filter:blur(16px);
  background:rgba(3,5,12,0.65);
  border-bottom:1px solid rgba(255,255,255,0.06);
}
.header-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  height:76px;
  gap:24px;
}
.logo{display:flex;align-items:center;}
.logo-full-img{height:22px;width:auto;filter:drop-shadow(0 0 10px rgba(59,91,254,0.35));}

.nav-desktop{display:flex;gap:32px;flex:1;justify-content:center;}
.nav-desktop a{font-size:0.92rem;color:var(--ink-muted);transition:color .2s ease;}
.nav-desktop a:hover{color:var(--ink);}

.nav-cta{flex-shrink:0;}

.menu-toggle{
  display:none;
  flex-direction:column;
  gap:5px;
  width:32px;height:32px;
  align-items:center;justify-content:center;
}
.menu-toggle span{width:20px;height:2px;background:var(--ink);border-radius:2px;transition:transform .25s ease, opacity .25s ease;}
.menu-toggle.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.menu-toggle.is-open span:nth-child(2){opacity:0;}
.menu-toggle.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

.nav-mobile{
  display:none;
  flex-direction:column;
  gap:4px;
  padding:12px 24px 24px;
  border-top:1px solid rgba(255,255,255,0.06);
}
.nav-mobile a{padding:12px 4px;color:var(--ink-muted);border-bottom:1px solid rgba(255,255,255,0.05);}
.nav-mobile a.btn{margin-top:12px;text-align:center;justify-content:center;color:#f8f9ff;}
.nav-mobile.is-open{display:flex;}

/* Hero */
.hero{
  position:relative;
  z-index:1;
  padding:110px 0 60px;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
}
.hero-inner{display:flex;flex-direction:column;align-items:center;max-width:820px;}
.eyebrow{
  display:inline-block;
  font-family:var(--font-body);
  font-size:0.8rem;
  font-weight:500;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--blue-pale);
  background:rgba(59,91,254,0.1);
  border:1px solid rgba(59,91,254,0.3);
  padding:8px 18px;
  border-radius:999px;
  margin-bottom:28px;
}
.hero h1{
  font-family:var(--font-head);
  font-size:clamp(2.6rem, 6.4vw, 4.6rem);
  font-weight:600;
  font-style:normal;
  line-height:1.1;
  letter-spacing:-0.01em;
  margin-bottom:26px;
  background:linear-gradient(180deg, #ffffff 0%, #c3ccea 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.hero-sub{
  font-size:1.1rem;
  font-weight:300;
  color:var(--ink-muted);
  max-width:600px;
  margin-bottom:36px;
}
.hero-actions{display:flex;gap:16px;flex-wrap:wrap;justify-content:center;}

/* Hero bloom mark with mirror reflection, per brand guide */
.hero-bloom{
  position:relative;
  margin-top:64px;
  width:180px;
  height:180px;
}
.hero-bloom img{
  width:100%;height:100%;object-fit:contain;
  filter:drop-shadow(0 0 40px rgba(59,91,254,0.55));
  animation:bloomFloat 5s ease-in-out infinite;
}
.hero-bloom::after{
  content:'';
  position:absolute;
  left:0; top:100%;
  width:100%; height:60px;
  background:url('../assets/img/logo-mark.png') center top / contain no-repeat;
  transform:scaleY(-1);
  opacity:0.18;
  mask-image:linear-gradient(to bottom, black, transparent);
  -webkit-mask-image:linear-gradient(to bottom, black, transparent);
}
@keyframes bloomFloat{0%,100%{transform:translateY(0);}50%{transform:translateY(-10px);}}

/* Sections */
.section{position:relative;z-index:1;padding:110px 0;}
.section--alt{background:linear-gradient(180deg, transparent, rgba(255,255,255,0.015) 15%, rgba(255,255,255,0.015) 85%, transparent);}
.section-title{
  font-family:var(--font-head);
  font-size:clamp(1.9rem, 4vw, 2.7rem);
  font-weight:600;
  letter-spacing:-0.005em;
  margin-bottom:20px;
  max-width:720px;
}
.section-lead{
  font-size:1.05rem;
  font-weight:300;
  color:var(--ink-muted);
  max-width:680px;
  margin-bottom:20px;
}
.section-note{
  font-size:1.05rem;
  font-weight:300;
  color:var(--ink);
  margin-top:40px;
  max-width:680px;
}
.section-note strong{color:var(--blue-soft);font-weight:500;}
.section-note a{color:var(--blue-soft);text-decoration:underline;}

/* Stats */
.stats-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:20px;
  margin-top:48px;
}
.stat-card{
  background:var(--card);
  border:1px solid var(--card-border);
  border-radius:var(--radius);
  padding:32px 24px;
  transition:border-color .25s ease, transform .25s ease;
}
.stat-card:hover{border-color:var(--card-border-hover);transform:translateY(-4px);}
.stat-value{font-family:var(--font-head);font-size:2.7rem;font-weight:600;color:var(--blue-soft);}
.stat-value span{font-size:1.4rem;color:var(--ink-dim);margin-left:2px;}
.stat-label{font-size:0.9rem;font-weight:300;color:var(--ink-muted);margin-top:8px;}

/* Pillars */
.pillars-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:18px;
  margin-top:48px;
}
.pillar-card{
  background:var(--card);
  border:1px solid var(--card-border);
  border-radius:16px;
  padding:26px 22px;
  transition:border-color .25s ease, transform .25s ease;
}
.pillar-card:hover{border-color:var(--card-border-hover);transform:translateY(-4px);}
.pillar-num{font-family:var(--font-head);font-size:0.8rem;color:var(--blue-soft);font-weight:600;}
.pillar-card h3{font-family:var(--font-head);font-size:1.08rem;font-weight:600;margin:10px 0 8px;}
.pillar-card p{font-size:0.88rem;font-weight:300;color:var(--ink-muted);}

/* Score tool */
.score-tool{
  margin-top:48px;
  background:var(--card);
  border:1px solid var(--card-border);
  border-radius:24px;
  padding:32px;
}
.score-tool-query{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  background:rgba(255,255,255,0.04);
  border:1px solid var(--card-border);
  border-radius:12px;
  padding:14px 18px;
}
.score-tool-query-label{
  font-size:0.75rem;
  text-transform:uppercase;
  letter-spacing:0.05em;
  color:var(--ink-dim);
}
.score-tool-query-value{font-weight:500;color:var(--ink);}
.score-tool-query-value--placeholder{font-style:italic;font-weight:300;color:var(--ink-muted);}
.score-tool-hint{font-size:0.82rem;font-weight:300;color:var(--ink-dim);margin-top:10px;}

.score-results{margin-top:32px;}
.score-cards{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:14px;
}
.score-card{
  background:rgba(255,255,255,0.03);
  border:1px solid var(--card-border);
  border-radius:14px;
  padding:18px;
}
.score-card-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:8px;}
.score-card-head h4{font-family:var(--font-head);font-size:0.95rem;font-weight:600;flex:1;min-width:0;}
.score-card-head b{font-family:var(--font-head);font-size:1.1rem;flex-shrink:0;white-space:nowrap;}
.score-card p{font-size:0.78rem;font-weight:300;color:var(--ink-muted);margin-bottom:4px;}
.score-card p strong{color:var(--ink);font-weight:500;}
.score-card-bar{height:5px;border-radius:999px;background:rgba(255,255,255,0.08);margin-top:10px;overflow:hidden;}
.score-card-bar span{display:block;height:100%;border-radius:999px;}

.score-global{
  margin-top:24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:20px;
  background:rgba(255,255,255,0.03);
  border:1px solid var(--card-border);
  border-radius:16px;
  padding:22px 26px;
}
.score-global-value{font-family:var(--font-head);font-size:2rem;font-weight:600;color:var(--blue-soft);}
.score-global-value span{font-size:1.1rem;color:var(--ink-dim);}
.score-global-label{font-size:0.85rem;font-weight:300;color:var(--ink-muted);margin-top:4px;}
.score-global-actions{display:flex;gap:10px;flex-wrap:wrap;}

/* Agence */
.agence-grid{
  display:grid;
  grid-template-columns:1.2fr 1fr;
  gap:60px;
  align-items:center;
}
.agence-stats{display:flex;flex-direction:column;gap:20px;}
.agence-stat{
  background:var(--card);
  border:1px solid var(--card-border);
  border-radius:16px;
  padding:24px 26px;
}
.agence-stat-value{font-family:var(--font-head);font-size:2.3rem;font-weight:600;color:var(--blue-soft);}
.agence-stat-value span{font-size:1rem;color:var(--ink-dim);margin-left:4px;}
.agence-stat-label{font-size:0.88rem;font-weight:300;color:var(--ink-muted);margin-top:6px;}

/* Team */
.team-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:22px;
  margin-top:48px;
}
.team-card{
  background:var(--card);
  border:1px solid var(--card-border);
  border-radius:var(--radius);
  padding:28px;
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  transition:border-color .25s ease, transform .25s ease;
}
.team-card:hover{border-color:var(--card-border-hover);transform:translateY(-4px);}
.team-avatar{
  width:144px;height:144px;
  border-radius:50%;
  overflow:hidden;
  margin:0 auto 18px;
  border:1px solid rgba(255,255,255,0.14);
}
.team-avatar img{width:100%;height:100%;object-fit:cover;}
.team-card h3{font-family:var(--font-head);font-size:1.3rem;font-weight:600;margin-bottom:4px;}
.team-role{color:var(--blue-soft);font-size:0.82rem;font-weight:500;letter-spacing:0.02em;margin-bottom:16px;}
.team-quote{font-size:0.88rem;font-weight:300;color:var(--ink-muted);margin-bottom:20px;font-style:italic;}
.team-contact{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:0.82rem;}
.team-contact a{color:var(--blue-soft);font-weight:300;transition:opacity .2s ease;}
.team-contact a:hover{opacity:0.75;}

/* Contact */
.contact-grid{
  display:grid;
  grid-template-columns:1fr 1.1fr;
  gap:60px;
}
.contact-direct{
  margin-top:28px;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.contact-direct strong{font-size:1rem;font-weight:500;}
.contact-direct a{color:var(--blue-soft);font-size:0.92rem;font-weight:300;}

.contact-form{
  background:var(--card);
  border:1px solid var(--card-border);
  border-radius:var(--radius);
  padding:32px;
}
.form-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;}
.form-field{margin-bottom:18px;}
.form-field label{display:block;font-size:0.85rem;font-weight:300;margin-bottom:8px;color:var(--ink-muted);}
.form-field label span{color:var(--ink-dim);font-weight:300;}
.form-field input,.form-field textarea{
  width:100%;
  background:rgba(255,255,255,0.04);
  border:1px solid var(--card-border);
  border-radius:10px;
  padding:12px 16px;
  color:var(--ink);
  font-weight:300;
  resize:vertical;
}
.form-field input:focus,.form-field textarea:focus{outline:none;border-color:var(--card-border-hover);}
.form-field--honeypot{
  position:absolute;
  left:-9999px;
  width:1px;
  height:1px;
  overflow:hidden;
}
.form-success,.form-error{
  display:none;
  margin-top:16px;
  font-size:0.88rem;
  font-weight:300;
  padding:12px 16px;
  border-radius:10px;
}
.form-success{
  color:var(--blue-soft);
  background:rgba(59,91,254,0.1);
  border:1px solid rgba(59,91,254,0.3);
}
.form-error{
  color:#ff8a8a;
  background:rgba(255,90,90,0.08);
  border:1px solid rgba(255,90,90,0.3);
}
.form-error a{text-decoration:underline;}
.form-success.is-visible,.form-error.is-visible{display:block;}
.btn[disabled]{opacity:0.6;pointer-events:none;}

/* Footer */
.site-footer{
  position:relative;z-index:1;
  border-top:1px solid rgba(255,255,255,0.06);
  padding:56px 0 40px;
}
.footer-inner{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:16px;
}
.footer-logo img{height:20px;width:auto;}
.footer-tagline{color:var(--ink-muted);font-size:0.9rem;font-weight:300;}
.footer-nav{display:flex;gap:24px;flex-wrap:wrap;justify-content:center;}
.footer-nav a{font-size:0.85rem;color:var(--ink-muted);}
.footer-nav a:hover{color:var(--ink);}
.footer-mantra{
  font-family:var(--font-head);
  font-style:italic;
  font-size:1.1rem;
  color:var(--ink-muted);
  margin-top:8px;
}
.footer-copy{color:var(--ink-dim);font-size:0.8rem;font-weight:300;margin-top:8px;}

/* Responsive */
@media (max-width:960px){
  .nav-desktop, .nav-cta{display:none;}
  .menu-toggle{display:flex;}
  .stats-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .pillars-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
  .score-cards{grid-template-columns:repeat(3,minmax(0,1fr));}
  .agence-grid, .contact-grid{grid-template-columns:1fr;gap:36px;}
  .team-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .score-card-head{flex-direction:column;align-items:flex-start;gap:2px;}
}
@media (max-width:640px){
  .hero{padding:64px 0 40px;}
  .stats-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);}
  .pillars-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);}
  .score-cards{grid-template-columns:minmax(0,1fr) minmax(0,1fr);}
  .form-row{grid-template-columns:1fr;}
  .score-global{flex-direction:column;align-items:flex-start;}
  .team-grid{grid-template-columns:1fr;}
}
