/* Lidon Motoculture — Nature Modern Theme (overrides) */
:root{
  --brand:#1F4F2E;      /* vert fonce (flyer) */
  --brand2:#4C8D45;     /* vert accent */
  --paper:#EDE3D2;      /* beige papier */
  --wood:#7D5A43;       /* brun bois */
  --ink:#141414;
  --muted:#5f5f5f;
  --card:#ffffff;
  --border:rgba(20,20,20,.12);
  --shadow:0 12px 30px rgba(20,20,20,.10);
  --radius:18px;
}

/* subtle paper texture via inline SVG (no external image needed) */
body{
  color:var(--ink) !important;
  background-color:var(--paper) !important;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)' opacity='.08'/%3E%3C/svg%3E");
  background-attachment: fixed;
}

/* Typography */
h1,h2,h3,h4,h5,.section-heading{
  letter-spacing:.4px;
}
p,.text-muted{ color:var(--muted) !important; }

/* Navbar */
#mainNav{
  background: rgba(255,255,255,.75) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(20,20,20,.08);
}
#mainNav .navbar-brand,
#mainNav .navbar-nav .nav-item .nav-link{
  color: var(--ink) !important;
  font-weight: 700;
}
#mainNav .navbar-nav .nav-item .nav-link.active,
#mainNav .navbar-nav .nav-item .nav-link:hover{
  color: var(--brand) !important;
}

/* Masthead (hero) */
header.masthead{
  position:relative;
  background-image:
    linear-gradient(120deg, rgba(31,79,46,.85), rgba(125,90,67,.55)),
    url("../assets/img/header-bg.jpg");
  background-size: cover;
  background-position: center;
}
header.masthead .masthead-subheading,
header.masthead .masthead-heading{
  text-shadow: 0 10px 30px rgba(0,0,0,.25);
}
header.masthead .btn{
  border-radius: 999px !important;
  padding: 14px 22px !important;
  font-weight: 800 !important;
}

/* Buttons */
.btn-primary{
  background-color: var(--brand) !important;
  border-color: var(--brand) !important;
}
.btn-primary:hover,
.btn-primary:focus{
  filter: brightness(.95);
}
.btn-outline-primary{
  color: var(--brand) !important;
  border-color: var(--brand) !important;
}
.btn-outline-primary:hover{
  background-color: var(--brand) !important;
  color: #fff !important;
}

/* Sections + cards */
section, .page-section{
  padding-top: 4.5rem;
  padding-bottom: 4.5rem;
}
.bg-light{ background-color: rgba(255,255,255,.55) !important; }

.card, .service-heading, .timeline-panel, .team-member{
  border-radius: var(--radius) !important;
}
.timeline > li .timeline-panel{
  background: var(--card);
  border: 1px solid var(--border);
  box-shadow: var(--shadow);
}
.timeline > li .timeline-image{
  border: 6px solid rgba(255,255,255,.85) !important;
  box-shadow: 0 12px 26px rgba(20,20,20,.18);
}

/* Portfolio/service blocks */
.rounded, img{ border-radius: 14px; }

/* Footer */
.footer{
  background:
    linear-gradient(120deg, rgba(31,79,46,.92), rgba(125,90,67,.75)),
    url("../assets/img/header-bg.jpg");
  background-size: cover;
  background-position: center;
  color: rgba(255,255,255,.92) !important;
  padding: 36px 0 !important;
}
.footer a{ color:#fff !important; opacity:.92; }
.footer a:hover{ opacity:1; }

/* Better spacing on mobile */
@media (max-width: 768px){
  header.masthead{ padding-top: 6rem; padding-bottom: 5rem; }
  .btn{ width:100%; justify-content:center; }
  .timeline > li .timeline-panel{ padding:18px; }
}

/* Fix links */
a{ color: var(--brand) }
a:hover{ color: var(--brand2) }


/* Offset for fixed navbar (prevents content hidden under the top bar) */
body{ padding-top: 78px; }
@media (max-width: 991.98px){ body{ padding-top: 64px; } }


/* NAVBAR OFFSET BIGGER */
body {
    padding-top: 140px !important;
}

@media (max-width: 991px) {
    body {
        padding-top: 110px !important;
    }
}

/* FOOTER COLOR FIX */
footer, .footer {
    background: #1F4F2E !important; /* vert foncé */
    color: #ffffff !important;
}

footer a { color:#ffffff !important; opacity:0.9; }
footer a:hover { opacity:1; }



/* =========================================================
   MOBILE FIXES (no overlap) + NATURE BG FOR ABOUT SECTION
   ========================================================= */

/* Background image only for the "Renseignements" section (Horaires / Coordonnées / Engagements) */
.section-nature-bg{
  position: relative;
  background-image: url("../assets/img/nature-leaves-bg.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* Soft overlay to keep text readable */
.section-nature-bg::before{
  content:"";
  position:absolute;
  inset:0;
  background: rgba(255, 248, 235, 0.86);
  z-index:0;
}

.section-nature-bg .container,
.section-nature-bg .timeline{
  position: relative;
  z-index: 1;
}

/* Timeline: prevent icon/text overlap on mobile */
@media (max-width: 768px){
  .timeline:before{ display:none !important; }
  .timeline > li{ margin-bottom: 30px !important; min-height: 0 !important; }
  .timeline > li .timeline-image{
    position: relative !important;
    left: auto !important;
    top: auto !important;
    margin: 0 auto 14px auto !important;
    width: 90px !important;
    height: 90px !important;
  }
  .timeline > li .timeline-panel{
    float: none !important;
    width: 100% !important;
    padding: 20px 16px !important;
    text-align: center !important;
  }
  .timeline > li .timeline-panel:before,
  .timeline > li .timeline-panel:after{ display:none !important; }
}

/* Google Map: centered & responsive ONLY on mobile (Contact page) */
@media (max-width: 768px){
  iframe[src*="google.com/maps"]{
    display:block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 320px !important;
    margin: 0 auto !important;
  }
}


/* ===== TEAM (MAQUETTE, SANS FEUILLES) ===== */
.team-section{
  position: relative;
  background: url("../assets/img/team-bg-beige.jpg") center/cover no-repeat !important;
  padding: 80px 0;
}


.team-card{
  background: rgba(255,255,255,0.86);
  border-radius: 26px;
  padding: 40px;
  box-shadow: 0 25px 60px rgba(0,0,0,0.15);
  border: 1px solid rgba(0,0,0,0.08);
  max-width: 1000px;
  margin: 0 auto;
}

.team-head{
  display:flex;
  justify-content: space-between;
  gap: 40px;
  align-items: center;
}

.team-person{
  display:flex;
  align-items:center;
  gap:20px;
  flex: 1 1 0;
}

.team-initial{
  width:90px;
  height:90px;
  border-radius:50%;
  background:#3b5f3b;
  color:white;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:34px;
  font-weight:800;
  flex: 0 0 auto;
}

.team-person-name{
  font-size:42px;
  font-weight:800;
  color:#3b5f3b;
  line-height:1.05;
}

.team-person-role{
  color:#555;
  font-size:18px;
  font-weight:600;
  margin-top: 6px;
}

.team-divider{
  margin: 24px 0;
  border: 0;
  height: 1px;
  background: rgba(0,0,0,0.12);
}

.team-tagline{
  text-align:center;
  font-size:22px;
  margin: 0 0 26px;
  color:#2b2b2b;
}

.team-features{
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap:20px;
}

.team-feature{
  background: rgba(255,255,255,0.92);
  padding:18px 18px;
  border-radius:16px;
  box-shadow: 0 10px 25px rgba(0,0,0,0.10);
  border: 1px solid rgba(0,0,0,0.06);
  display:flex;
  align-items:center;
  gap:14px;
}

.team-feature-icon{
  width:54px;
  height:54px;
  border-radius:50%;
  background:#3b5f3b;
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:22px;
  flex:0 0 auto;
}

.team-feature-text{
  font-weight:800;
  color:#2b2b2b;
  line-height:1.15;
}

/* Responsive */
@media (max-width: 768px){
  .team-card{ padding: 26px; }
  .team-head{ flex-direction:column; gap:22px; }
  .team-person{ justify-content:center; text-align:center; }
  .team-person-name{ font-size:34px; }
  .team-features{ grid-template-columns: 1fr; }
}


/* ===== DEPLACEMENT PREMIUM (fond beige texture + cartes) ===== */
.deplacement-premium{
  background: url("../assets/img/deplacement-bg.png") center/cover no-repeat;
  padding: 90px 0;
}

.deplacement-premium .depl-note{
  display: inline-block;
  margin: 18px 0 34px;
  padding: 12px 16px;
  border-radius: 14px;
  background: rgba(255,255,255,0.70);
  border: 1px solid rgba(0,0,0,0.08);
  box-shadow: 0 10px 22px rgba(0,0,0,0.08);
  font-weight: 600;
  color: #2a2a2a;
}

.deplacement-premium .depl-note i{
  margin-right: 8px;
  color: #1F4F2E;
}

.deplacement-premium .zone-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
  margin-top: 10px;
}

.deplacement-premium .zone-card{
  background: rgba(255,255,255,0.86);
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 18px;
  padding: 22px;
  box-shadow: 0 18px 40px rgba(0,0,0,0.12);
  text-align: center;
}

.deplacement-premium .zone-title{
  font-weight: 900;
  letter-spacing: .02em;
  text-transform: uppercase;
  color: #2a2a2a;
  margin-bottom: 10px;
}

.deplacement-premium .zone-price{
  font-size: 28px;
  font-weight: 900;
  color: #1F4F2E;
  margin-bottom: 2px;
}

.deplacement-premium .zone-sub{
  font-size: 14px;
  color: #6a6a6a;
  margin-bottom: 10px;
}

.deplacement-premium .zone-desc{
  color: #3a3a3a;
  font-weight: 600;
}

.deplacement-premium .zone-card-alt{
  background: rgba(255,255,255,0.78);
}

.deplacement-premium .depl-cta{
  margin-top: 34px;
}

@media (max-width: 992px){
  .deplacement-premium .zone-grid{ grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 768px){
  .deplacement-premium{ padding: 70px 0; }
  .deplacement-premium .zone-grid{ grid-template-columns: 1fr; }
}



/* ===== REPARATION PREMIUM (fond photo identique à Déplacement) ===== */
.reparation-premium{
  background: url("../assets/img/deplacement-bg.png") center/cover no-repeat;
  padding: 100px 0;
  position: relative;
}
.reparation-premium::before{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(120deg, rgba(31,79,46,.50), rgba(125,90,67,.25));
}
.reparation-premium .container{ position:relative; z-index:1; }

.reparation-premium .section-heading{ color:#fff; text-shadow: 0 10px 30px rgba(0,0,0,.25); }
.reparation-premium .section-subheading{ color: rgba(255,255,255,.85) !important; }

.repair-grid-top{
  margin-top: 26px;
  display:grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 22px;
  align-items: start;
}

.repair-photo img{
  border-radius: 18px !important;
  box-shadow: 0 18px 45px rgba(0,0,0,.18) !important;
  border: 1px solid rgba(255,255,255,.22);
}

.repair-cards{
  display:grid;
  grid-template-columns: 1fr;
  gap: 18px;
}

.repair-card{
  background: rgba(255,255,255,.88);
  border: 1px solid rgba(0,0,0,.10);
  border-radius: 18px;
  padding: 18px;
  box-shadow: 0 18px 45px rgba(0,0,0,.14);
}

.repair-card-title{
  font-weight: 900;
  color:#1F4F2E;
  margin-bottom: 12px;
  display:flex;
  align-items:center;
  gap: 10px;
  font-size: 18px;
}

.reparation-premium .tarif-box{
  background: rgba(255,255,255,.82);
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 16px;
  padding: 14px 14px;
}
.reparation-premium .tarif-title{ display:block; font-weight: 900; color:#1F4F2E; }
.reparation-premium .tarif-price{ display:block; font-weight: 900; font-size: 22px; margin-top: 4px; color:#2b2b2b; }
.reparation-premium .tarif-text{ color:#555; margin: 8px 0 0; }

.repair-block{
  margin-top: 26px;
  background: rgba(255,255,255,.80);
  border: 1px solid rgba(0,0,0,.10);
  border-radius: 20px;
  padding: 18px;
  box-shadow: 0 18px 45px rgba(0,0,0,.14);
  backdrop-filter: blur(6px);
}

.block-head h4{
  margin: 0 0 14px;
  font-weight: 900;
  color:#1F4F2E;
  display:flex;
  align-items:center;
  gap: 10px;
}

.repair-cards-3{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}

.price-card{
  background: rgba(255,255,255,.90);
  border: 1px solid rgba(0,0,0,.10);
  border-radius: 18px;
  padding: 16px;
  text-align:center;
  box-shadow: 0 12px 28px rgba(0,0,0,.10);
}
.price-card h5{ margin:0 0 8px; font-weight: 900; color:#1F4F2E; font-size: 16px; }
.price-big{ font-size: 34px; font-weight: 900; color:#2b2b2b; line-height: 1; }
.price-sub{ margin-top: 8px; color:#666; font-weight: 600; }

.repair-grid-affutage{
  display:grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 22px;
  align-items: start;
}

.repair-cta{
  margin-top: 26px;
  text-align:center;
}

@media (max-width: 992px){
  .repair-grid-top, .repair-grid-affutage{ grid-template-columns: 1fr; }
  .repair-cards-3{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px){
  .reparation-premium{ padding: 75px 0; }
  .repair-cards-3{ grid-template-columns: 1fr; }
}



/* Boutons sociaux : même rendu mobile/ordi */
.footer .btn-social{
  width: 44px;
  height: 44px;
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  border-radius: 999px !important;
  background: rgba(255,255,255,.10) !important;
  border: 1px solid rgba(255,255,255,.22) !important;
  backdrop-filter: blur(6px);
}
.footer .btn-social i{
  font-size: 18px;
  line-height: 1;
}

/* Mentions légales */
.footer .btn-outline-light{
  border-color: rgba(255,255,255,.55);
  background: rgba(255,255,255,.06);
  backdrop-filter: blur(6px);
}
.footer .btn-outline-light:hover{
  background: rgba(255,255,255,.16);
}

/* Lisibilité mobile */
@media (max-width: 768px){
  .footer a{ display:inline-block; margin-bottom: 6px; }
}


/* ===== FOOTER BOIS (FORCE MAX) ===== */
/* On force le fond directement sur l'élément <footer> pour éviter toute règle qui écrase */
footer.footer{
  background-image: url("../assets/img/footer-bois.jpg") !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-attachment: scroll !important;
  position: relative !important;
  overflow: hidden !important;
  padding: 60px 0 !important;
}

/* Assombrit légèrement pour lisibilité, mais laisse voir le bois */
footer.footer::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  background: linear-gradient(135deg, rgba(10,30,20,0.55), rgba(31,79,46,0.35)) !important;
  pointer-events:none !important;
  z-index:0 !important;
}

footer.footer .container,
footer.footer .row{
  position: relative !important;
  z-index: 1 !important;
}

/* Texte & liens lisibles */
footer.footer,
footer.footer a,
footer.footer small,
footer.footer .text-muted{
  color: #ffffff !important;
  opacity: 1 !important;
}

footer.footer a{ text-decoration:none !important; }
footer.footer a:hover{ text-decoration:underline !important; }

/* Facebook identique mobile/ordi */
footer.footer .btn-social{
  width: 44px !important;
  height: 44px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.12) !important;
  border: 1px solid rgba(255,255,255,.28) !important;
}
footer.footer .btn-social i{
  font-size: 18px !important;
  line-height: 1 !important;
}


/* ===== NAVBAR AMELIORATIONS ===== */

/* Bouton MENU (mobile) en vert */
#mainNav .navbar-toggler{
  background: #1F4F2E !important;
  border: 1px solid rgba(255,255,255,.25) !important;
  color: #fff !important;
  border-radius: 12px !important;
  padding: 10px 14px !important;
}
#mainNav .navbar-toggler:focus{
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(31,79,46,.25) !important;
}

/* Liens navbar (ordinateur) : effet "enfoncement" au survol */
#mainNav .navbar-nav .nav-link{
  position: relative;
  border-radius: 999px;
  transition: transform .12s ease, box-shadow .12s ease, background-color .12s ease;
  padding: .65rem 1rem !important;
}
@media (min-width: 992px){
  #mainNav .navbar-nav .nav-link:hover{
    background: rgba(255,255,255,.10);
    box-shadow: inset 0 2px 6px rgba(0,0,0,.35);
    transform: translateY(1px);
  }
  #mainNav .navbar-nav .nav-link:active{
    transform: translateY(2px);
    box-shadow: inset 0 3px 10px rgba(0,0,0,.45);
  }
}



/* ===== ABONNEMENT PAGE ===== */
.abonnement-page{
  background: url("../assets/img/abonnement/beige-texture.jpg") repeat;
}

.abonnement-hero{
  position: relative;
  padding: 120px 0 70px;
  background: url("../assets/img/abonnement/abonnement-hero.jpg") center/cover no-repeat;
  color: #fff;
}
.abonnement-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(135deg, rgba(10,30,20,.78), rgba(31,79,46,.45));
}
.abonnement-hero .container{ position:relative; z-index:1; }
.abonnement-hero-inner{
  max-width: 920px;
  margin: 0 auto;
  text-align: center;
}
.abonnement-badge img{
  width: 120px;
  height: auto;
  filter: drop-shadow(0 10px 18px rgba(0,0,0,.35));
  margin-bottom: 18px;
}
.abonnement-title{
  font-family: "Montserrat", sans-serif;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
  margin: 0 0 10px;
}
.abonnement-subtitle{
  margin: 0 0 26px;
  opacity: .95;
}
.abonnement-cta{
  display:flex;
  gap: 12px;
  justify-content:center;
  flex-wrap: wrap;
  margin-bottom: 18px;
}
.abonnement-note{
  margin: 18px auto 0;
  max-width: 720px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 16px;
  padding: 12px 16px;
  backdrop-filter: blur(6px);
}

.abonnement-section{
  padding-top: 4.5rem;
  padding-bottom: 4.5rem;
}
.abonnement-section--alt{
  background: linear-gradient(180deg, rgba(255,255,255,.55), rgba(255,255,255,.35));
}

.abonnement-card{
  background: rgba(255,255,255,.82);
  border: 1px solid rgba(30,30,30,.10);
  border-radius: 22px;
  padding: 22px;
  box-shadow: 0 16px 36px rgba(0,0,0,.12);
}
.abonnement-card--image{
  padding: 14px;
  text-align:center;
}
.abonnement-card--image img{
  max-width: 100%;
  height: auto;
  border-radius: 16px;
}

.abonnement-card-title{
  font-weight: 800;
  margin-bottom: 12px;
}
.abonnement-list{
  margin: 0 0 14px;
  padding-left: 18px;
}
.abonnement-highlight{
  background: rgba(31,79,46,.10);
  border: 1px solid rgba(31,79,46,.18);
  border-radius: 16px;
  padding: 12px 14px;
  margin: 14px 0 0;
}
.abonnement-tip{
  display:flex;
  gap: 10px;
  margin-top: 14px;
  padding: 12px 14px;
  border-radius: 16px;
  background: rgba(255, 248, 235, .75);
  border: 1px solid rgba(160,120,70,.18);
}
.abonnement-tip i{ margin-top: 2px; color: rgba(31,79,46,.95); }

.abonnement-feature{
  height: 100%;
  background: rgba(255,255,255,.86);
  border: 1px solid rgba(30,30,30,.10);
  border-radius: 22px;
  padding: 18px 16px;
  text-align:center;
  box-shadow: 0 16px 36px rgba(0,0,0,.10);
}
.abonnement-icon{
  width: 54px;
  height: 54px;
  margin: 0 auto 10px;
  border-radius: 16px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: rgba(31,79,46,.12);
  border: 1px solid rgba(31,79,46,.20);
  color: rgba(31,79,46,1);
  font-size: 22px;
}

.abonnement-checks{
  list-style:none;
  margin:0;
  padding:0;
}
.abonnement-checks li{
  display:flex;
  gap: 10px;
  padding: 10px 0;
  border-bottom: 1px solid rgba(0,0,0,.06);
}
.abonnement-checks li:last-child{ border-bottom:none; }
.abonnement-checks i{
  margin-top: 3px;
  color: rgba(31,79,46,1);
}
.abonnement-cta--center{ margin-top: 14px; }

@media (max-width: 575.98px){
  .abonnement-hero{ padding: 105px 0 58px; }
  .abonnement-badge img{ width: 96px; }
  .abonnement-card{ padding: 18px; }
}


/* ===== ABONNEMENT FIXES ===== */

/* Navbar visible sur la page abonnement */
.abonnement-nav{
  background: rgba(15, 45, 30, 0.92) !important;
  backdrop-filter: blur(6px);
}
.abonnement-nav .navbar-brand img{ filter: drop-shadow(0 2px 6px rgba(0,0,0,.35)); }
.abonnement-nav .nav-link{ color:#ffffff !important; }
.abonnement-nav .nav-link:hover{
  background: rgba(255,255,255,.10);
  box-shadow: inset 0 2px 6px rgba(0,0,0,.35);
  transform: translateY(1px);
  border-radius: 999px;
}

/* Hero abonnement: overlay sombre pour lisibilité */
.abonnement-hero,
.abonnement-hero.masthead{
  position: relative;
  color: #fff;
}
.abonnement-hero::before,
.abonnement-hero.masthead::before{
  content:"";
  position:absolute;
  inset:0;
  background: rgba(0,0,0,0.55);
}
.abonnement-hero .container,
.abonnement-hero.masthead .container{
  position: relative;
  z-index: 2;
}
.abonnement-hero .masthead-subheading,
.abonnement-hero .masthead-heading{
  color:#fff !important;
  opacity: 1 !important;
  text-shadow: 0 2px 12px rgba(0,0,0,.45);
}

/* Petits textes du hero */
.abonnement-hero p, .abonnement-hero small, .abonnement-hero .lead{
  color:#fff !important;
  opacity: 1 !important;
  text-shadow: 0 2px 10px rgba(0,0,0,.35);
}


/* ABONNEMENT NAVBAR FIX (palette conservée) */
.abonnement-page #mainNav.abonnement-navfix{
  background: rgba(245, 240, 230, 0.92) !important; /* beige clair comme le thème */
  backdrop-filter: blur(6px);
  border-bottom: 1px solid rgba(0,0,0,0.06);
}
.abonnement-page #mainNav.abonnement-navfix .nav-link{
  color: #123826 !important; /* vert foncé */
}
.abonnement-page #mainNav.abonnement-navfix .navbar-brand img{
  filter: none !important;
}

/* Lisibilité du HERO (on ne touche pas aux couleurs des boutons) */
.abonnement-page .abonnement-hero{
  position: relative;
}
.abonnement-page .abonnement-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background: rgba(0,0,0,0.38); /* juste pour lire le texte */
  pointer-events:none;
}
.abonnement-page .abonnement-hero .container{
  position: relative;
  z-index: 1;
}
.abonnement-page .abonnement-hero h1,
.abonnement-page .abonnement-hero h2,
.abonnement-page .abonnement-hero p{
  color: #ffffff !important;
  text-shadow: 0 2px 12px rgba(0,0,0,0.45);
}


/* ===== ABONNEMENT : NAV + TEXTE LISIBLE ===== */
.abonnement-page #mainNav{
  background: rgba(15,45,30,.92) !important;
  backdrop-filter: blur(6px);
  z-index: 9999 !important;
}
.abonnement-page #mainNav .navbar-brand img{ filter: drop-shadow(0 6px 10px rgba(0,0,0,.35)); }
.abonnement-page #mainNav .nav-link{ color:#fff !important; }
.abonnement-page #mainNav .nav-link.active{
  background: rgba(255,255,255,.12);
  box-shadow: inset 0 2px 6px rgba(0,0,0,.35);
}
.abonnement-page .abonnement-title,
.abonnement-page .abonnement-subtitle,
.abonnement-page .abonnement-note{
  text-shadow: 0 6px 18px rgba(0,0,0,.55) !important;
  opacity: 1 !important;
}


/* ===== NAVBAR VERTE GLOBALE ===== */
#mainNav{
  background: linear-gradient(90deg, rgba(31,79,46,.96), rgba(34,93,54,.96)) !important;
  box-shadow: 0 8px 20px rgba(0,0,0,.22) !important;
  backdrop-filter: blur(6px);
}
#mainNav .navbar-nav .nav-link{
  color: #ffffff !important;
  border-radius: 999px;
  padding: .65rem 1rem !important;
  transition: transform .12s ease, box-shadow .12s ease, background-color .12s ease, opacity .12s ease;
}
@media (min-width: 992px){
  #mainNav .navbar-nav .nav-link:hover{
    background: rgba(255,255,255,.10);
    box-shadow: inset 0 2px 6px rgba(0,0,0,.35);
    transform: translateY(1px);
    opacity: .95;
  }
  #mainNav .navbar-nav .nav-link:active{
    transform: translateY(2px);
    box-shadow: inset 0 3px 10px rgba(0,0,0,.45);
  }
}
/* Lien actif (page courante) */
#mainNav .navbar-nav .nav-item.active > .nav-link{
  background: rgba(255,255,255,.14);
  box-shadow: inset 0 2px 10px rgba(0,0,0,.35);
}