@import url('https://fonts.googleapis.com/css2?family=Caprasimo&family=Figtree:wght@400;500;700&display=swap');

:root {
  --mb-mustard: #e8bf27;   /* brand yellow, from the logo */
  --mb-gingham: rgba(232, 191, 39, .45);
  --mb-ink: #000000;       /* logo line colour */
  --mb-text: #3d3a35;      /* body copy */
  --mb-red: #b3261e;       /* charcuterie red, accents only */
  --mb-paper: #ffffff;
  --mb-site-width: 1144px;

  --mb-display: 'Caprasimo', Georgia, 'Times New Roman', serif;
  --mb-body: 'Figtree', 'Helvetica Neue', Arial, sans-serif;
}

/* The tablecloth, reused wherever the motif appears */
.fusion-secondary-main-menu::after,
.fusion-footer-widget-area::before,
#concept > .fusion-fullwidth {
  background-color: var(--mb-paper);
  background-image:
    linear-gradient(90deg, var(--mb-gingham) 50%, transparent 50%),
    linear-gradient(var(--mb-gingham) 50%, transparent 50%);
  background-size: 28px 28px;
}

/* ---------- Base ---------- */
body {
  font: 400 16px/1.6 var(--mb-body);
  color: var(--mb-text);
  background: var(--mb-paper);
}
a { color: var(--mb-ink); }
a:hover { color: var(--mb-red); }
a:focus-visible,
button:focus-visible {
  outline: 2px solid var(--mb-red);
  outline-offset: 3px;
}

/* ==========================================================================
   Layout engine (replaces the missing fusion-styles file)
   ========================================================================== */
#main.width-100 { padding: 0; }

.fusion-fullwidth { position: relative; box-sizing: border-box; }

.fusion-builder-row.fusion-row {
  display: flex;
  flex-wrap: wrap;
  box-sizing: border-box;
}
.width-100 .nonhundred-percent-fullwidth > .fusion-builder-row {
  margin-left: auto !important;
  margin-right: auto !important;
}

.fusion-flex-align-items-flex-start  { align-items: flex-start; }
.fusion-flex-align-items-stretch     { align-items: stretch; }
.fusion-flex-align-content-center    { align-content: center; }
.fusion-flex-align-self-stretch      { align-self: stretch; }
.fusion-flex-align-self-flex-start   { align-self: flex-start; }

.fusion-layout-column {
  position: relative;
  display: flex;
  box-sizing: border-box;
}
.fusion-layout-column > .fusion-column-wrapper {
  position: relative;
  z-index: 1;
  width: 100%;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
}
.fusion-flex-justify-content-center       { justify-content: center; }
.fusion-flex-justify-content-space-around { justify-content: space-around; }
.fusion-flex-justify-content-flex-start   { justify-content: flex-start; }

.fusion-column-inner-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}

.fusion-animated { visibility: visible !important; opacity: 1 !important; }
.fusion-imageframe { display: inline-block; max-width: 100%; line-height: 0; }

/* ==========================================================================
   Header
   ========================================================================== */
.fusion-header { background: var(--mb-paper); }
.fusion-header-v5 .fusion-logo { padding: 24px 0 8px; }

.fusion-secondary-main-menu {
  position: relative;
  background: var(--mb-paper);
  border-bottom: 0;
  padding-bottom: 14px;
}
.fusion-secondary-main-menu::after {          /* tablecloth hem */
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 14px;
  border-top: 2px solid var(--mb-ink);
}

.fusion-main-menu > ul > li { padding-right: 34px; }
.fusion-main-menu > ul > li > a,
.fusion-main-menu > ul > li > .menu-text {
  min-height: 52px;
  display: flex;
  align-items: center;
  font: 500 15px/1 var(--mb-body);
  color: var(--mb-ink);
}
.fusion-main-menu > ul > li > a .menu-text {
  text-decoration: underline 2px transparent;
  text-underline-offset: 6px;
  transition: text-decoration-color .15s linear;
}
.fusion-main-menu > ul > li > a:hover .menu-text,
.fusion-main-menu > ul > .current-menu-item > a .menu-text {
  color: var(--mb-ink);
  text-decoration-color: var(--mb-red);
}

/* Réservation */
.fusion-main-menu .fusion-menu-item-button .fusion-button {
  min-height: 0;
  margin-top: 9px;
  padding: 10px 20px;
  font: 700 14px/1 var(--mb-body);
  color: var(--mb-ink);
  background: var(--mb-mustard);
  border: 2px solid var(--mb-ink);
  border-radius: 0;
  box-shadow: 3px 3px 0 var(--mb-ink);
  cursor: pointer;
}
.fusion-main-menu .fusion-menu-item-button .fusion-button:hover {
  transform: translate(1px, 1px);
  box-shadow: 2px 2px 0 var(--mb-ink);
}

/* Dropdowns */
.fusion-main-menu .sub-menu {
  min-width: 210px;
  padding: 6px 0;
  background: var(--mb-paper);
  border: 2px solid var(--mb-ink);
  box-shadow: 4px 4px 0 var(--mb-ink);
}
.fusion-main-menu .sub-menu a {
  font: 500 14px/1.4 var(--mb-body);
  color: var(--mb-ink);
}
.fusion-main-menu .sub-menu a:hover { color: var(--mb-red); background: none; }

/* ==========================================================================
   Typography inside builder text blocks
   ========================================================================== */
.fusion-text h1,
.fusion-text h2 {
  font-family: var(--mb-display);
  font-weight: 400;
  color: var(--mb-ink);
  letter-spacing: 0;
  text-transform: lowercase;          /* the source text is typed in capitals */
}
.fusion-text h1::first-letter,
.fusion-text h2::first-letter { text-transform: uppercase; }

.fusion-text h1 { font-size: clamp(30px, 4vw, 44px); line-height: 1.1; margin: 0 0 12px; }
.fusion-text h2 { font-size: 24px; line-height: 1.2; margin: 0 0 4px; }

.fusion-text h3 {
  font: 400 17px/1.55 var(--mb-body);
  color: var(--mb-text);
  margin: 0 0 10px;
}
.fusion-text h3 strong,
.fusion-text p b { color: var(--mb-ink); font-weight: 700; }

/* Gold text on white was unreadable – titles go ink, ornaments go red */
.fusion-text h1 span[style*="#e8b"],
.fusion-text h2 span[style*="#e8b"] { color: var(--mb-ink) !important; }
.fusion-text h3 span[style*="#e8b"],
.fusion-text p span[style*="#e8b"] { color: var(--mb-red) !important; }

/* ==========================================================================
   Hero – the menu card on the restaurant photo
   ========================================================================== */
.home .fusion-builder-row-1 .fusion-imageframe {
  border: 10px solid var(--mb-paper);
  box-shadow: 10px 10px 0 var(--mb-ink) !important;
}
.awb-views-counter { margin-top: 18px; }
.awb-views-counter-content {
  display: inline-flex;
  gap: 14px;
  padding: 6px 12px;
  font: 500 12px/1.4 var(--mb-body);
  color: var(--mb-ink);
  background: var(--mb-paper);
  border: 2px solid var(--mb-ink);
}

/* ==========================================================================
   Concept – two cards laid on the tablecloth
   ========================================================================== */
#concept > .fusion-fullwidth {
  background-image:
    linear-gradient(90deg, var(--mb-gingham) 50%, transparent 50%),
    linear-gradient(var(--mb-gingham) 50%, transparent 50%) !important;
  background-attachment: scroll !important;
  padding: 70px 30px !important;
}
#concept .fusion-builder-column-2 > .fusion-column-wrapper,
#concept .fusion-builder-column-3 > .fusion-column-wrapper {
  padding: 28px 26px !important;
  border-radius: 0 !important;
  box-shadow: 8px 8px 0 var(--mb-ink);
}
#concept .fusion-builder-column-2 > .fusion-column-wrapper { transform: rotate(-1.2deg); }
#concept .fusion-builder-column-3 > .fusion-column-wrapper { transform: rotate(1deg); }

#concept .fusion-separator-border {
  height: 0;
  border-top: 2px dashed var(--mb-ink) !important;
  border-bottom: 0 !important;
  margin: 14px 0;
}

/* ==========================================================================
   "Une maison pas comme les autres" – photos + story
   ========================================================================== */
.home .fusion-builder-row-3 { padding: 80px 30px !important; }
.home .fusion-builder-row-3 .fusion-slider-sc .flexslider {
  margin: 0;
  border: 3px solid var(--mb-ink);
}
.fusion-flexslider-loading .slides > li:first-child { display: block; }

.home .fusion-builder-row-3 .fusion-text-4 { max-width: 38em; margin: 0 auto; }
.home .fusion-builder-row-3 .fusion-text-4 h3 { margin-bottom: 6px; }

/* ==========================================================================
   Actualités / Instagram / 360°
   ========================================================================== */
#actu .fusion-fullwidth { padding-top: 40px !important; }
#actu .fusion-builder-column-8 h1 { margin: 0; }

.home .fusion-builder-row-5,
.home .fusion-builder-row-6 { border-top: 2px solid var(--mb-ink); }

/* White text on mustard failed contrast – switch to ink */
.home .fusion-builder-row-6 .fusion-text span[style*="#ffffff"] { color: var(--mb-ink) !important; }
.home .fusion-builder-row-6 .fusion-text h3 { font: 400 22px/1.3 var(--mb-display); color: var(--mb-ink); }

#sb_instagram #sbi_load { text-align: center; }
#sb_instagram .sbi_follow_btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 18px;
  font: 700 14px/1 var(--mb-body);
  color: var(--mb-mustard);
  background: var(--mb-ink);
}
#sb_instagram .sbi_follow_btn svg { width: 1.1em; height: 1.1em; }

#\33 60 iframe {
  max-width: 100%;
  border: 3px solid var(--mb-ink) !important;
  background: var(--mb-paper);
}

/* ==========================================================================
   Footer
   ========================================================================== */
.fusion-footer-parallax { position: static !important; }

.fusion-footer-widget-area {
  position: relative;
  padding: 64px 30px 30px;
  background: var(--mb-paper);
  color: var(--mb-text);
  font-size: 15px;
}
.fusion-footer-widget-area::before {          /* tablecloth hem, mirrored */
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 14px;
  border-bottom: 2px solid var(--mb-ink);
}
.fusion-footer-widget-area > .fusion-row { max-width: var(--mb-site-width); }

.fusion-footer-widget-area .fusion-columns {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -15px;
}
.fusion-footer-widget-area .fusion-column {
  flex: 1 1 33.333%;
  max-width: 33.333%;
  padding: 0 15px;
  box-sizing: border-box;
  text-align: center;
}
.fusion-footer-widget-column { margin-bottom: 30px; }
.fusion-footer-widget-area .widget-title {
  margin: 0 0 16px;
  font: 400 22px/1.2 var(--mb-display);
  color: var(--mb-ink);
  text-transform: lowercase;
}
.fusion-footer-widget-area .widget-title::first-letter { text-transform: uppercase; }
.fusion-footer-widget-area strong { color: var(--mb-ink); }

/* ==========================================================================
   Shared: black-bordered "cards" on any page
   (any column the page builder gave a black border)
   ========================================================================== */
.fusion-column-wrapper[style*="border-color:#000000"] {
  border-radius: 0 !important;
  box-shadow: 8px 8px 0 var(--mb-ink);
}

/* The builder pasted 'Work Sans' inline in places – fold it into the theme font */
.fusion-text [style*="Work Sans"] {
  font-family: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
}

/* ==========================================================================
   Les Producteurs (page-id-47) – producer cards on the tablecloth
   ========================================================================== */
.page-id-47 .fusion-builder-row-1 {
  background-color: var(--mb-paper) !important;
  background-image:
    linear-gradient(90deg, var(--mb-gingham) 50%, transparent 50%),
    linear-gradient(var(--mb-gingham) 50%, transparent 50%) !important;
  background-size: 28px 28px !important;
  padding: 56px 30px 32px !important;
}

/* Centre the grid and give every card in a row the same height */
.page-id-47 .fusion-builder-row-1 > .fusion-builder-row {
  justify-content: center;
  align-items: stretch;
}
/* Empty spacer columns were only there to fake centring – drop them.
   (Browsers without :has() simply keep the original layout.) */
.page-id-47 .fusion-builder-row-1 .fusion-layout-column:has(> .fusion-column-wrapper:empty) {
  display: none;
}

/* "D'où viennent nos viandes ?" title image */
.page-id-47 .fusion-builder-column-1 { margin-bottom: 40px !important; }

/* Producer cards */
.page-id-47 .fusion-builder-column-3,
.page-id-47 .fusion-builder-column-4,
.page-id-47 .fusion-builder-column-5,
.page-id-47 .fusion-builder-column-6,
.page-id-47 .fusion-builder-column-7 { margin-bottom: 40px !important; }

.page-id-47 .fusion-builder-column-3 > .fusion-column-wrapper,
.page-id-47 .fusion-builder-column-4 > .fusion-column-wrapper,
.page-id-47 .fusion-builder-column-5 > .fusion-column-wrapper,
.page-id-47 .fusion-builder-column-6 > .fusion-column-wrapper,
.page-id-47 .fusion-builder-column-7 > .fusion-column-wrapper {
  padding: 26px 24px !important;           /* was 20/15 with an odd 88px bottom on the first card */
  border-width: 3px !important;            /* last card was 2px */
  justify-content: flex-start !important;  /* text starts under the title, not floating mid-card */
}

/* "Pourquoi c'est si bon ?" is the explanation, not a producer – red shadow sets it apart */
.page-id-47 .fusion-builder-column-7 > .fusion-column-wrapper {
  box-shadow: 8px 8px 0 var(--mb-red);
}

/* Card text: one size, left-aligned (justified text left big gaps in narrow cards) */
.page-id-47 .fusion-builder-row-1 .fusion-text,
.page-id-47 .fusion-builder-row-1 .fusion-text h3,
.page-id-47 .fusion-builder-row-1 .fusion-text p {
  font: 400 16px/1.6 var(--mb-body) !important;
  color: var(--mb-text);
  text-align: left !important;
}
.page-id-47 .fusion-builder-row-1 .fusion-text h3,
.page-id-47 .fusion-builder-row-1 .fusion-text p { margin: 0 0 12px; }
.page-id-47 .fusion-builder-row-1 .fusion-text p:empty { display: none; }
/* the lamb card was set entirely in bold */
.page-id-47 .fusion-builder-row-1 .fusion-text h3 strong { font-weight: 400; color: inherit; }

/* Title graphics vs. photos */
.page-id-47 .fusion-builder-row-1 .fusion-column-wrapper > div[style*="text-align:center"]:first-child {
  margin-bottom: 14px;
}
.page-id-47 .imageframe-4,
.page-id-47 .imageframe-6,
.page-id-47 .imageframe-8 {
  margin-top: 8px;
  border: 2px solid var(--mb-ink);
}

/* The thin strip of background photo under the cards – the footer hem replaces it */
.page-id-47 .fusion-builder-row-2 { display: none; }

/* ==========================================================================
   Small screens
   ========================================================================== */
@media (max-width: 800px) {
  .fusion-main-menu > ul { justify-content: center; }
  .fusion-main-menu > ul > li { padding: 0 10px; }
  #concept .fusion-builder-column-2 > .fusion-column-wrapper,
  #concept .fusion-builder-column-3 > .fusion-column-wrapper { transform: none; }
  .home .fusion-builder-row-3 { padding: 48px 20px !important; }
  .page-id-47 .fusion-builder-row-1 { padding: 36px 16px 16px !important; }
  .fusion-footer-widget-area .fusion-column { flex-basis: 100%; max-width: 100%; }
}