/* Andromède Bâtiment – Styles
   Palette: Jaune univers (#FFD94A / #FFB800), Nuit (#0B0F1A / #111628), Blanc (#FFFFFF)
*/
:root{
  --bg: #0B0F1A;
  --bg-2:#0E1322;
  --text:#E9EDF5;
  --muted:#B9C2D0;
  --accent:#FFD94A;
  --accent-2:#FFB800;
  --surface:#111628;
  --success:#22C55E;
  --error:#EF4444;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Arial, sans-serif;
  background: var(--bg);
  color: var(--text);
  line-height:1.6;
}
a{color:var(--accent); text-decoration:none}
a:hover{text-decoration:underline}
.container{width:min(1120px, 92%); margin-inline:auto}
.header{
  position:sticky; top:0; z-index:50;
  background: rgba(11,15,26,0.75);
  backdrop-filter: blur(8px);
  border-bottom:1px solid rgba(255,255,255,0.06);
}
.nav{display:flex; align-items:center; justify-content:space-between; padding:10px 0}
.nav .brand{display:flex; align-items:center; gap:12px}
.nav .brand img{height:36px; width:auto}
.nav .brand .group{font-size:12px; color:var(--muted)}
.nav ul{display:flex; list-style:none; gap:20px; padding:0; margin:0}
.nav a.button{background:linear-gradient(90deg,var(--accent),var(--accent-2)); color:#0B0F1A; padding:10px 14px; border-radius:10px; font-weight:700}
.skip-link{position:absolute; left:-9999px; top:auto}
.skip-link:focus{left:12px; top:12px; background:var(--accent); color:#0B0F1A; padding:8px 10px; border-radius:8px}

.hero{
  position:relative; min-height:72vh; display:grid; place-items:center; text-align:center;
  background: url('./assets/hero-stars.svg') center/cover no-repeat, var(--bg);
  border-bottom:1px solid rgba(255,255,255,0.06);
}
.hero h1{
  font-size: clamp(28px, 3.2vw + 16px, 56px);
  margin: 0 0 12px;
  letter-spacing:0.3px;
}
.hero p{max-width:820px; margin:0 auto 24px; color:var(--muted); font-size:clamp(16px,1.1vw + 12px,20px)}
.badges{display:flex; flex-wrap:wrap; gap:12px; justify-content:center; margin-top:6px}
.badge{border:1px solid rgba(255,255,255,0.12); padding:6px 10px; border-radius:999px; color:var(--text); font-size:14px}
.kpi{display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:24px}
.kpi .card{background:var(--surface); border:1px solid rgba(255,255,255,0.06); border-radius:14px; padding:16px}
.kpi .card h3{margin:0; font-size:28px}
.kpi .card p{margin:4px 0 0; color:var(--muted)}

.section{padding:64px 0; border-bottom:1px solid rgba(255,255,255,0.06)}
.section h2{font-size: clamp(22px, 2.2vw + 12px, 38px); margin:0 0 12px}
.section p.lead{color:var(--muted); margin-top:0}

.grid{display:grid; gap:22px}
.grid.cols-2{grid-template-columns:1fr; }
.grid.cols-3{grid-template-columns:1fr; }
@media (min-width: 880px){
  .grid.cols-2{grid-template-columns:1.1fr 1fr}
  .grid.cols-3{grid-template-columns:repeat(3, 1fr)}
}
.card{background:var(--surface); border:1px solid rgba(255,255,255,0.06); border-radius:14px; padding:16px}
.card h3{margin-top:0}
.icon{width:24px; height:24px; display:inline-block; border-radius:6px; background:linear-gradient(180deg,var(--accent),var(--accent-2)); margin-right:8px}

.list{padding-left:18px}
.list li{margin-bottom:6px}

.cta{
  text-align:center; padding:40px 0 10px;
}
.cta .note{color:var(--muted); margin-top:6px}

.form{
  display:grid; gap:12px;
}
.input, textarea, select{
  width:100%; padding:12px 14px; background:#0E1322; color:var(--text);
  border:1px solid rgba(255,255,255,0.12); border-radius:10px;
}
label{font-size:14px; color:var(--muted)}
button{
  background:linear-gradient(90deg,var(--accent),var(--accent-2));
  border:none; color:#0B0F1A; font-weight:800; padding:12px 16px; border-radius:12px; cursor:pointer
}
button:disabled{opacity:0.7; cursor:not-allowed}

.footer{padding:28px 0; color:#94A3B8; font-size:14px}
.footer a{color:#cbd5e1}

.banner{
  background:linear-gradient(90deg, rgba(255,217,74,0.1), rgba(255,184,0,0.1));
  border:1px solid rgba(255,217,74,0.2);
  padding:12px 14px; border-radius:12px;
}
.alert{color:#fca5a5; font-size:14px}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
}
