/* assets/css/site.css */
:root{
  --deep:#2F5D2F;
  --botanical:#5E8F3A;
  --gold:#C5A059;
  --header-btn-green:#4b5e46;
  --paper:#FBFCFA;
  --ink:#1f2a33;
  --max:1200px;
}

/* RESET + BASE */
*{box-sizing:border-box;margin:0;padding:0}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit}
body{
  font-family:"Lato",system-ui,-apple-system,sans-serif;
  color:var(--ink);
  line-height:1.6;
  background: radial-gradient(1100px 700px at 12% 10%, rgba(143,175,90,.16) 0%, rgba(143,175,90,0) 55%),
              linear-gradient(180deg, var(--paper) 0%, #ffffff 100%);
}

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

/* ACCESSIBILITY: focus visible */
a:focus-visible,
button:focus-visible{
  outline:3px solid rgba(197,160,89,.85);
  outline-offset:3px;
  border-radius:10px;
}

/* TOP TIER */
.top-tier{background:var(--deep); color:#fff; font-size:.95rem}
.top-tier-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:10px 0;
  gap:14px;
  flex-wrap:wrap;
}
.top-tier-links{display:flex; gap:16px; flex-wrap:wrap}
.top-tier-links a{opacity:.92}
.top-tier-links a:hover{opacity:1}
.top-data-link{color:var(--gold); font-weight:900}
.top-tier-tools{display:flex; gap:14px; align-items:center; flex-wrap:wrap}
.tool-item{opacity:.95}

.lang-switch{display:flex; gap:6px; align-items:center}
.lang-btn{
  display:inline-flex; align-items:center; gap:5px;
  padding:4px 10px; border-radius:20px;
  font-weight:700; font-size:.78rem; letter-spacing:.04em;
  color:rgba(255,255,255,.80);
  border:1.5px solid rgba(255,255,255,.25);
  text-decoration:none; transition:.18s;
  white-space:nowrap;
}
.lang-btn:hover{
  color:#fff; border-color:rgba(255,255,255,.7);
  background:rgba(255,255,255,.12);
}
.lang-btn.is-active{
  color:#fff; border-color:var(--gold);
  background:rgba(197,160,89,.22); font-weight:900;
}
.lang-flag{font-size:.95rem; line-height:1}
.lang-code{font-size:.78rem; letter-spacing:.05em}

/* MAIN TIER */
.main-tier{
  background:#fff;
  border-bottom:1px solid rgba(0,0,0,.06);
  position:sticky;
  top:0;
  z-index:3000;
}
.main-tier-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:12px 0;
  gap:18px;
}
.brand img{height:56px; width:auto}

.main-nav{display:flex; align-items:center; gap:18px}
.main-nav > a{
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
  font-size:.82rem;
  color:rgba(31,42,51,.92);
  padding:10px 6px;
  border-radius:10px;
}
.main-nav > a:hover{
  background:rgba(94,143,58,.08);
}

.nav-group{display:flex; align-items:center; gap:8px}
.drop{position:relative}
.drop button{
  background:transparent;
  border:none;
  cursor:pointer;
  padding:10px 6px;
  border-radius:10px;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
  font-size:.82rem;
  color:rgba(31,42,51,.92);
}
.drop button:hover{background:rgba(94,143,58,.08)}
.drop button i{font-size:.75rem}

.menu{
  position:absolute;
  top:100%;
  left:0;
  min-width:220px;
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  border-top:3px solid var(--gold);
  border-radius:0 0 12px 12px;
  box-shadow:0 18px 55px rgba(0,0,0,.12);
  padding:8px 0;
  display:none;

  /* évite le débordement sur petits écrans */
  max-height:60vh;
  overflow:auto;
}
.drop.open .menu{display:block}
.menu a{
  display:block;
  padding:10px 14px;
  color:rgba(31,42,51,.92);
}
.menu a:hover{background:rgba(94,143,58,.08)}

/* MAIN ACTIONS */
.main-actions{display:flex; align-items:center; gap:12px}
.btn-member-main{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:var(--header-btn-green);
  color:#fff;
  padding:12px 14px;
  border-radius:14px;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
  font-size:.78rem;
}
.btn-member-main:hover{filter:brightness(1.03)}
.burger{
  background:#fff;
  border:1px solid rgba(0,0,0,.10);
  border-radius:14px;
  padding:10px 12px;
  cursor:pointer;
}
.burger:hover{background:rgba(0,0,0,.03)}

/* DRAWER */
.drawer{
  position:fixed;
  right:0;
  top:0;
  height:100vh;
  width:min(380px, 88vw);
  background:#fff;
  box-shadow:-24px 0 70px rgba(0,0,0,.18);
  transform:translateX(110%);
  transition:.22s ease;
  z-index:4000;
  padding:18px;
  overflow:auto;
}
.drawer.open{transform:translateX(0)}
.drawer a{
  display:block;
  padding:12px 10px;
  font-weight:900;
  letter-spacing:.04em;
  border-radius:10px;
}
.drawer a:hover{background:rgba(94,143,58,.08)}
.drawer-group{display:flex; align-items:center; justify-content:space-between; gap:10px}
.drawer-group button{border:none; background:transparent; cursor:pointer}
.drawer-sub{display:none; padding-left:8px}
.drawer-sub.open{display:block}
.drawer-sub a{font-weight:700; opacity:.9}
.drawer-sep{border:none; border-top:1px solid rgba(0,0,0,.10); margin:14px 0}
.drawer-secondary{font-weight:700; color:#555; text-transform:none; font-size:.95rem}
.drawer-secondary.is-gold{color:var(--gold); font-weight:900}
.drawer-cta{margin-top:16px}
.drawer-cta .btn-member-main{width:100%}

/* FOOTER */
.footer{background:#0f1a12; color:#fff; margin-top:40px}
.footer-inner{
  display:grid;
  grid-template-columns:2fr 1fr 1fr;
  gap:26px;
  padding:44px 0
}
.footer h3, .footer h4{margin-bottom:10px}
.footer p{opacity:.85; line-height:1.8}
.footer a{opacity:.85; margin:6px 0; display:inline-block}
.footer a:hover{opacity:1}
.footer-bottom{border-top:1px solid rgba(255,255,255,.10)}
.footer-bottom-inner{padding:14px 0; opacity:.75; font-size:.95rem}
.footer-contact-line{display:flex; align-items:flex-start; gap:10px; margin:6px 0; opacity:.85; font-size:.95rem}
.footer-contact-line i{margin-top:4px; color:#C5A059; flex-shrink:0}
.footer-socials{display:flex; gap:12px; margin-top:16px}
.footer-socials a{width:36px; height:36px; border-radius:50%; background:rgba(255,255,255,.10); display:flex; align-items:center; justify-content:center; transition:.2s; margin:0}
.footer-socials a:hover{background:#C5A059; opacity:1}

/* MOBILE */
@media (max-width: 980px){
  .main-nav{display:none}
  .footer-inner{grid-template-columns:1fr}

  /* petits ajustements mobiles */
  .brand img{height:48px}
  .btn-member-main{padding:10px 12px; font-size:.75rem}
  .main-tier-inner{gap:12px}
}