:root{
    --bg:#f4f7fb;
    --surface:#ffffff;
    --ink:#1e2733;
    --ink-soft:#5a6678;
    --line:#dce4ee;
    --brand:#2563a8;        /* bleu profond */
    --brand-deep:#1c4a82;
    --accent:#0f8a9c;       /* bleu-sarcelle */
    --accent-soft:#e6f1f3;
    --warm:#e9eff7;
    --radius:18px;
    --shadow:0 18px 40px -22px rgba(20,40,70,.35);
  }

  .brand{color:var(--brand);}

  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  body{
    font-family:'Outfit',-apple-system,sans-serif;
    background:var(--bg);
    color:var(--ink);
    line-height:1.65;
    -webkit-font-smoothing:antialiased;
  }

   .wrap{max-width:1140px; width:92%; margin:0 auto;padding:0 28px}

	/* DIVERS */
	  h1,h2,h3{font-family:'Fraunces',Georgia,serif;font-weight:500;line-height:1.15;letter-spacing:-.01em}
  a{color:inherit;text-decoration:none}
  img{max-width:100%;display:block}

	
	  /* ---------- HEADER ---------- */
  header{
    position:sticky;top:0;z-index:50;
    background:var(--bg);
    border-bottom:1px solid var(--line);
  }
  .nav{display:flex;align-items:center;justify-content:space-between;height:74px}
  .logo{display:flex;flex-direction:column;gap:.12rem;color:var(--ink)}
  .logo-main{display:flex;align-items:baseline;gap:.55rem;font-family:'Fraunces',serif;font-size:1.5rem;font-weight:600;line-height:1}
  .logo-main span{font-family:'Outfit',sans-serif;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);font-weight:500}
  .logo-company{
    font-family:'Spectral',Georgia,serif;font-style:italic;font-weight:500;
    font-size:.82rem;letter-spacing:.03em;color:var(--brand);
  }
  .logo b{color:var(--brand)}
  .menu{display:flex;gap:2.2rem;align-items:center}
  .menu a{font-size:.95rem;color:var(--ink-soft);transition:color .2s}
  .menu a:hover{color:var(--brand)}
  .btn{
    display:inline-block;font-family:'Outfit',sans-serif;font-weight:500;
    font-size:.95rem;padding:.78rem 1.5rem;border-radius:999px;
    transition:transform .15s ease,box-shadow .2s ease,background .2s;
    cursor:pointer;border:none;
  }
  .btn-primary{background:var(--brand);color:#fff !important;font-weight:600;box-shadow:0 6px 16px -8px rgba(28,74,130,.6)}
  .btn-primary:hover{background:var(--brand-deep);color:#fff !important;transform:translateY(-2px)}
  .btn-ghost{background:transparent;color:var(--ink);border:1px solid var(--line)}
  .btn-ghost:hover{border-color:var(--brand);color:var(--brand)}
  .burger{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:8px}
  .burger span{width:24px;height:2px;background:var(--ink);border-radius:2px}

	
  /* ---------- FOOTER ---------- */
  footer{background:var(--warm);border-top:1px solid var(--line);padding:56px 0 28px}
  .foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:40px;margin-bottom:38px}
  .foot-grid h4{font-family:'Outfit',sans-serif;font-size:.82rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:16px;font-weight:600}
  .foot-grid a,.foot-grid p{display:block;font-size:.94rem;color:var(--ink-soft);margin-bottom:9px}
  .foot-grid a:hover{color:var(--brand)}
  .foot-brand .logo{margin-bottom:14px}
  .foot-brand p{max-width:34ch}
  .foot-bottom{
    border-top:1px solid var(--line);padding-top:22px;
    display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;
    font-size:.85rem;color:var(--ink-soft);
  }
  .foot-bottom a{color:var(--ink-soft)}
  .foot-bottom a:hover{color:var(--brand)}




	/* ---------- RESPONSIVE ---------- */
  @media(max-width:900px){
    .foot-grid{grid-template-columns:1fr 1fr}
    .menu{
      position:fixed;inset:74px 0 auto 0;background:var(--bg);
      flex-direction:column;gap:0;padding:10px 28px 24px;
      border-bottom:1px solid var(--line);display:none;
    }
    .menu.open{display:flex}
    .menu a{padding:14px 0;border-bottom:1px solid var(--line);width:100%}
    .menu .btn{margin-top:14px;text-align:center}
    .burger{display:flex}
  }
  @media(max-width:560px){
    .foot-grid{grid-template-columns:1fr}
  }
