/* Styles principaux */
:root {
  --accent:#0b74de;
  --bg:#f6f8fb;
  --card:#fff;
  --radius:12px;
}
body {
  margin:0;
  font-family:system-ui,Arial,Helvetica,sans-serif;
  background:var(--bg);
  color:#0b1b2b;
}
.wrap {max-width:980px;margin:0 auto;padding:24px;}
.hero {
  background:linear-gradient(90deg,rgba(11,116,222,0.12),rgba(11,116,222,0.06));
  padding:40px 0;
  border-bottom:1px solid rgba(11,116,222,0.06);
  text-align:center;
}
.hero h1 {margin:0 0 10px;font-size:28px;}
.cta .btn {
  background:var(--accent);
  color:#fff;
  padding:12px 20px;
  border-radius:var(--radius);
  text-decoration:none;
  font-weight:600;
}
.main section {
  background:var(--card);
  margin-bottom:20px;
  border-radius:var(--radius);
  padding:18px;
  box-shadow:0 4px 14px rgba(0,0,0,0.05);
}
.gallery img {
  width:100%;
  height:auto;
  border-radius:10px;
}
.carousel-controls {
  display:flex;
  justify-content:center;
  margin-top:8px;
}
.carousel-controls button {
  border:1px solid #ccc;
  background:#fff;
  padding:8px 12px;
  border-radius:8px;
  cursor:pointer;
}
.footer {
  text-align:center;
  font-size:14px;
  padding:18px;
  color:#555;
}
.float-btn {
  position:fixed;
  bottom:20px;
  right:20px;
  background:var(--accent);
  color:#fff;
  font-size:24px;
  padding:14px 18px;
  border-radius:50%;
  text-decoration:none;
  box-shadow:0 6px 16px rgba(0,0,0,0.2);
  z-index:100;
}
@media(max-width:640px){
  .hero h1{font-size:22px;}
}