
:root{
  --fg-page-padding:24px;
  --fg-header-text:#707070;
  --fg-main-text:#111;
}

html{min-height:100%}

body{
  min-height:100vh;
  margin:0;
  display:flex;
  flex-direction:column;
  background:#fff;
}

body>main,
body>.site-main,
body>#primary{flex:1 0 auto}

.fg-site-footer{margin-top:auto}

.fg-site-header{
  position:relative;
  z-index:1000;
  width:100%;
  background:#fff;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

.fg-site-header-inner{
  width:100%;
  min-height:108px;
  padding:20px var(--fg-page-padding) 16px;
  display:flex!important;
  align-items:flex-start!important;
  justify-content:space-between!important;
  gap:32px;
  box-sizing:border-box;
}

.fg-branding{
  flex:0 0 auto;
  min-width:220px;
}

.fg-branding-eyebrow{
  margin:0 0 7px;
  color:#111;
  font-size:10px;
  font-weight:500;
  line-height:1;
  letter-spacing:.30em;
}

.fg-branding-name{
  display:block;
  margin:0;
  color:#111;
  font-size:clamp(23px,2.05vw,29px);
  font-weight:400;
  line-height:1.05;
  letter-spacing:-.045em;
  text-decoration:none;
}

.fg-branding-name:hover,
.fg-branding-name:focus-visible{
  color:#111;
}

.fg-branding-description{
  margin-top:8px;
  color:var(--fg-header-text);
  font-size:11px;
  font-weight:400;
  line-height:1.35;
}

.fg-site-navigation{
  flex:0 0 auto!important;
  margin:30px 0 0 auto!important;
  padding:0!important;
}

.fg-site-navigation .fg-menu-list,
.fg-site-navigation>ul{
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:clamp(22px,2.4vw,38px)!important;
  margin:0!important;
  padding:0!important;
  list-style:none!important;
}

.fg-site-navigation li{
  margin:0!important;
  padding:0!important;
  list-style:none!important;
}

.fg-site-navigation a{
  display:block;
  color:var(--fg-header-text);
  font-size:12px;
  font-weight:400;
  line-height:1.4;
  text-decoration:none;
  white-space:nowrap;
}

.fg-site-navigation a:hover,
.fg-site-navigation a:focus-visible,
.fg-site-navigation .current-menu-item>a,
.fg-site-navigation .current_page_item>a{
  color:var(--fg-main-text);
}

.fg-menu-toggle{
  display:none;
  flex:0 0 auto;
  width:30px;
  height:30px;
  margin:1px 0 0 auto;
  padding:6px 3px;
  border:0;
  background:transparent;
  cursor:pointer;
}

.fg-menu-toggle span{
  display:block;
  width:21px;
  height:1px;
  margin:4px auto;
  background:#555;
  transition:transform 180ms ease,opacity 180ms ease;
}

/*
 * ACCUEIL
 * La zone principale prend exactement la même marge horizontale
 * que le header : titre et image démarrent sur le même axe.
 */
body.home main,
body.home .site-main,
body.home #primary{
  padding-left:var(--fg-page-padding)!important;
  padding-right:var(--fg-page-padding)!important;
  box-sizing:border-box;
}

/*
 * Si l'image principale ou son conteneur possède déjà une marge
 * horizontale définie par l'ancien thème, on la neutralise ici.
 */
body.home main > figure,
body.home .site-main > figure,
body.home #primary > figure{
  margin-left:0;
  margin-right:0;
}

/* Footer */
.fg-site-footer{
  width:100%;
  background:#fff;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

.fg-site-footer-inner{
  padding:28px var(--fg-page-padding) 24px;
  color:#727272;
  font-size:11px;
  line-height:1.4;
}

/* Mobile */
@media(max-width:680px){
  :root{
    --fg-page-padding:16px;
  }

  .fg-site-header-inner{
    min-height:92px;
    padding-top:16px;
    padding-bottom:12px;
  }

  .fg-branding{
    min-width:0;
  }

  .fg-branding-eyebrow{
    font-size:9px;
  }

  .fg-branding-name{
    font-size:22px;
  }

  .fg-branding-description{
    margin-top:6px;
    font-size:10px;
  }

  .fg-menu-toggle{
    display:block;
  }

  .fg-site-navigation{
    position:absolute!important;
    top:100%;
    right:0;
    left:0;
    display:none;
    margin:0!important;
    padding:14px var(--fg-page-padding) 20px!important;
    background:#fff;
  }

  .fg-site-header.fg-menu-open .fg-site-navigation{
    display:block;
  }

  .fg-site-navigation .fg-menu-list,
  .fg-site-navigation>ul{
    flex-direction:column!important;
    align-items:flex-end!important;
    gap:13px!important;
  }

  .fg-site-navigation a{
    font-size:13px;
  }

  .fg-site-header.fg-menu-open .fg-menu-toggle span:nth-child(1){
    transform:translateY(5px) rotate(45deg);
  }

  .fg-site-header.fg-menu-open .fg-menu-toggle span:nth-child(2){
    opacity:0;
  }

  .fg-site-header.fg-menu-open .fg-menu-toggle span:nth-child(3){
    transform:translateY(-5px) rotate(-45deg);
  }
}
