:root{
  --dark:#1C1D21;
  --blue:#355C7D;
  --light:#ECEFF3;
  --gold:#C9A24D;
  --radius:18px;
  --max:1120px;
}

*{box-sizing:border-box}

body{
  margin:0;
  font-family:Montserrat,Arial,sans-serif;
  background:var(--light);
  -webkit-text-size-adjust:100%;
}

img{
  max-width:100%;
  height:auto;
  display:block;
}

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

/* ================= HEADER ================= */

.header{
  position: sticky;
  top: 0;
  z-index: 9999;
  background:#2A3440;
  color:#fff;
  border-bottom:1px solid rgba(255,255,255,.10);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}

@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))){
  .header{background:#2A3440;}
}

@supports not (position: sticky){
  .header{
    position:fixed;
    width:100%;
    top:0;
    left:0;
  }
  body{padding-top:72px;}
}

.nav{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:14px 0;
  flex-wrap:wrap;
}

.links{
  display:flex;
  gap:18px;
  flex-wrap:wrap;
}

.links a{
  color:#fff;
  text-decoration:none;
  font-weight:600;
}

.header a{
  color:inherit;
  text-decoration:none;
}

/* ================= BUTTONS ================= */

.btn{
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.25);
  color:#fff;
  padding:10px 16px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:filter .2s ease, box-shadow .2s ease, transform .2s ease;
}

.btn:hover,
.btn:focus-visible{
  filter:brightness(1.05);
}

.nav-actions{
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
}

.btn-outline{
  background:transparent;
  border:1px solid rgba(255,255,255,.28);
}

.btn-dark{
  background:#2A3440;
  border:1px solid rgba(0,0,0,.10);
}

.btn-email{
  background:var(--blue);
  border-color:var(--blue);
  box-shadow:0 6px 16px rgba(53,92,125,.25);
}

.btn-email:hover{
  box-shadow:0 8px 20px rgba(53,92,125,.35);
}

/* ================= SECTIONS ================= */

.section{padding:70px 0;}
.section-blue{color:#fff;}
.section-light{background:var(--light);}

.subtitle{opacity:.8;margin-bottom:30px;}

/* ✅ chemin absolu pour éviter les soucis selon la page */
.section-bg{
  background:
    linear-gradient(rgba(28,29,33,.75),rgba(28,29,33,.85)),
    url("assets/background-v2.jpg") center/cover no-repeat;
}

/* ================= GRID ================= */

.poles-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}

/* ================= CARDS ================= */

.pole-card{
  position:relative;
  min-height:440px;
  border-radius:var(--radius);
  overflow:hidden;
  display:flex;
  padding:22px;
  background:var(--bg) center/cover no-repeat;
  justify-content:center;
  align-items:center;
}

.pole-card::before{
  content:"";
  position:absolute;
  inset:0;
  opacity:0;
  transition:.25s;
  background:linear-gradient(180deg,rgba(28,29,33,.25),rgba(28,29,33,.9));
}

.pole-card:hover::before{opacity:1;}

.pole-card h3{
  position:absolute;
  top:22px;
  left:50%;
  transform:translateX(-50%);
  width:100%;
  text-align:center;
  padding:0 18px;
  font-size:22px;
  z-index:2;
}

.pole-content{
  position:absolute;
  left:22px;
  right:22px;
  bottom:32px;
  color:#fff;
  opacity:0;
  transform:translateY(10px);
  transition:.25s;
  z-index:2;
}

.pole-card:hover .pole-content{
  opacity:1;
  transform:none;
}

.pole-content ul{
  padding-left:18px;
  font-size:14px;
}

/* === Mobile: contenu visible sans hover === */

@media(max-width:900px){
  .poles-grid{grid-template-columns:1fr;}

  .pole-content{
    opacity:1;
    transform:none;
  }

  .pole-card::before{
    opacity:1;
  }
}

/* ================= PROFILE ================= */

.profile{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:20px;
}

.profile__photo{
  border-radius:var(--radius);
  overflow:hidden;
  border:1px solid rgba(28,47,68,.12);
  min-height:340px;
}

.profile__photo img{
  width:100%;
  height:100%;
  object-fit:cover;
}

/* ================= FEES ================= */

.fees{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}

.list{
  padding-left:18px;
  line-height:1.65;
  color:rgba(28,47,68,.82);
}

@media(max-width:900px){
  .profile,
  .fees{grid-template-columns:1fr;}
}

/* ================= FORMS ================= */

input,textarea,select{
  width:100%;
  border-radius:14px;
  border:1px solid rgba(28,47,68,.18);
  background:#fff;
  padding:12px;
  font:inherit;
}

textarea{min-height:160px;}

.form-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

@media(max-width:900px){
  .form-row{grid-template-columns:1fr;}
}

/* ================= FOOTER ================= */

.footer{
  background:#1F2B38;
  padding:60px 0;
  color:rgba(255,255,255,.85);
}

.footer-grid{
  display:grid;
  grid-template-columns:1.2fr 1fr;
  gap:28px;
}

.footer a{
  color:rgba(255,255,255,.85);
  text-decoration:none;
  transition:opacity .2s ease;
}

.footer a:hover{opacity:.75;}

.footer-map{
  border-radius:18px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.18);
}

.footer-map iframe{
  width:100%;
  height:100%;
  min-height:260px;
  border:0;
}

@media(max-width:900px){
  .footer-grid{grid-template-columns:1fr;}
}

/* ================= ANCHORS ================= */

html{
  scroll-behavior:smooth;
  scroll-padding-top:86px;
}

section[id]{scroll-margin-top:86px;}

/* ================= FAQ FLOAT BUTTON ================= */

#backtoc{
  position:fixed;
  right:28px;
  bottom:28px;
  z-index:999;
  background:var(--blue);
  color:#fff;
  padding:12px 18px;
  border-radius:999px;
  box-shadow:0 14px 30px rgba(53,92,125,.35);
  opacity:0;
  pointer-events:none;
  transform:translateY(20px);
  transition:.3s ease;
}

body.has-scrolled #backtoc{
  opacity:1;
  pointer-events:auto;
  transform:none;
}

#backtoc:hover{
  transform:translateY(-3px);
  filter:brightness(1.08);
}

@media(max-width:700px){
  #backtoc{
    right:16px;
    bottom:16px;
    padding:10px 14px;
  }
}