:root{
  --canary: #FAF554;
  --green-dark: #061F1B;
  --green-main: #0B322C;
  --green-card: #082621;

  --radius: 16px;
}

/* Reset */
*{ box-sizing:border-box; }

html, body{
  margin:0;
  padding:0;
}

body{
  font-family: 'Open Sans', sans-serif;
  background: var(--green-main);
  color: var(--canary);
  line-height:1.7;
}

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

.site-header{
  background: var(--green-dark);
  border-bottom: 1px solid rgba(250,245,84,.15);
}

.header-inner{
  max-width: 1000px;
  margin: 0 auto;
  padding:18px 16px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  position:relative;
}

.header-left{
  display:flex;
  align-items:center;
}

.brand-logo{
  height:42px;
}

.header-center{
  position:absolute;
  left:50%;
  transform:translateX(-50%);
}

.brand-title-image{
  height:52px;
  width:auto;
  display:block;
}

/* ================= PAGE ================= */

.legal-page{
  max-width:900px;
  margin: 60px auto;
  padding: 0 20px 80px;
}

.legal-header h1{
  font-family: 'Instrument Serif', serif;
  font-style: italic;
  font-size: 38px;
  margin-bottom:16px;
}

.legal-header p{
  opacity:.85;
}

/* Sections */

.legal-section{
  margin-top:40px;
}

.legal-section h2{
  font-family: 'Instrument Serif', serif;
  font-style: italic;
  font-size:26px;
  margin-bottom:14px;
  border-bottom:1px solid rgba(250,245,84,.2);
  padding-bottom:6px;
}

.legal-section ul{
  padding-left:20px;
}

.legal-section li{
  margin-bottom:6px;
}

/* Links */

a{
  color: var(--canary);
  text-decoration:none;
  border-bottom:1px solid rgba(250,245,84,.3);
}

a:hover{
  opacity:.8;
}

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

.site-footer{
  background: var(--green-dark);
  border-top:1px solid rgba(250,245,84,.15);
}

.footer-inner{
  max-width:1000px;
  margin:0 auto;
  padding:20px 16px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  flex-wrap:wrap;
  font-size:.9rem;
  color: rgba(250,245,84,.75);
}

.footer-inner a{
  color: var(--canary);
}

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

.footer-links{
  display:flex;
  gap:18px;              /* espace entre les liens */
  flex-wrap:wrap;
}

.footer-links a{
  color: var(--canary);
  font-weight:600;
  text-decoration:none;
  position:relative;
}

.footer-links a::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-3px;
  width:0%;
  height:1px;
  background: var(--canary);
  transition: width .25s ease;
}

.footer-links a:hover::after{
  width:100%;
}

/* ================= RESPONSIVE ================= */

@media (max-width:768px){

  .brand-title-image{
    height:40px;
  }

  .legal-header h1{
    font-size:28px;
  }

  .legal-section h2{
    font-size:22px;
  }
}

@media (max-width:700px){
  .header-inner{
    flex-wrap: wrap;
    gap: 10px;
  }
  .header-center{
    position: static;
    transform: none;
    width: 100%;
    display:flex;
    justify-content:center;
    order: 3;
  }
  .brand-title-image{
    height: auto;
    max-height: 44px;
    max-width: 78vw;
  }
}

.back-home{
  max-width:1000px;
  margin:20px auto 0;
  padding:0 16px;
}

.btn-home{
  display:inline-block;
  padding:8px 16px;
  border-radius:999px;
  border:1px solid rgba(250,245,84,.4);
  color: var(--canary);
  font-size:.9rem;
  text-decoration:none;
  transition:.2s ease;
}

.btn-home:hover{
  background: rgba(250,245,84,.15);
}
