/* =========================================================
   INDEX
   01. Variables globales
   02. Reset / base
   03. Layout général
   04. Typographie
   05. Liens / boutons
   06. Composants communs
   07. Transitions de page
   08. Responsive global
   ========================================================= */

/* =========================================================
   00. FONTES LOCALES
   ========================================================= */
@font-face{
  font-family:"Google Sans";
  src:local("Google Sans Regular"), local("GoogleSans-Regular"), url("../fonts/googlesans/GoogleSans-Regular.ttf") format("truetype");
  font-weight:400;
  font-style:normal;
  font-display:swap;
}

@font-face{
  font-family:"Google Sans";
  src:local("Google Sans Medium"), local("GoogleSans-Medium"), url("../fonts/googlesans/GoogleSans-Medium.ttf") format("truetype");
  font-weight:500;
  font-style:normal;
  font-display:swap;
}

@font-face{
  font-family:"Google Sans";
  src:local("Google Sans Bold"), local("GoogleSans-Bold"), url("../fonts/googlesans/GoogleSans-Bold.ttf") format("truetype");
  font-weight:700;
  font-style:normal;
  font-display:swap;
}

@font-face{
  font-family:"Google Sans";
  src:local("Google Sans Bold"), local("GoogleSans-Bold"), url("../fonts/googlesans/GoogleSans-Bold.ttf") format("truetype");
  font-weight:800;
  font-style:normal;
  font-display:swap;
}

@font-face {
  font-family: "Unbounded";
  src: url("../fonts/unbounded/Unbounded-ExtraLight.ttf") format("truetype");
  font-style: normal;
  font-weight: 200;
  font-display: swap;
}

@font-face {
  font-family: "Unbounded";
  src: url("../fonts/unbounded/Unbounded-Light.ttf") format("truetype");
  font-style: normal;
  font-weight: 300;
  font-display: swap;
}

@font-face {
  font-family: "Unbounded";
  src: url("../fonts/unbounded/Unbounded-Regular.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Unbounded";
  src: url("../fonts/unbounded/Unbounded-Medium.ttf") format("truetype");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}

@font-face {
  font-family: "Unbounded";
  src: url("../fonts/unbounded/Unbounded-SemiBold.ttf") format("truetype");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}

@font-face {
  font-family: "Unbounded";
  src: url("../fonts/unbounded/Unbounded-Bold.ttf") format("truetype");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

@font-face {
  font-family: "Unbounded";
  src: url("../fonts/unbounded/Unbounded-ExtraBold.ttf") format("truetype");
  font-style: normal;
  font-weight: 800;
  font-display: swap;
}

@font-face {
  font-family: "Unbounded";
  src: url("../fonts/unbounded/Unbounded-Black.ttf") format("truetype");
  font-style: normal;
  font-weight: 900;
  font-display: swap;
}

/* =========================================================
   01. VARIABLES GLOBALES
   ========================================================= */
:root{
  /*--font-heading:"Google Sans", Arial, Helvetica, sans-serif;*/
    --font-heading: "Unbounded", sans-serif;
  --font-body:"Google Sans", Arial, Helvetica, sans-serif;
  --bg:#f7f3ee;
  --panel:#ffffff;
  --text:#232527;
  --muted:#58534e;
  --line:rgba(0,0,0,.08);
 --primary:#344E41;
  --primary-rgb:52,78,65;

  /*--primary:#2d4143;*/
  --primary-dark:#588157;
  --primary-soft:#f4e2d1;
  --dark:#111111;
  --success:#215c38;
  --green:#588157;

  --gp-bg:#f6f3ee;
  --gp-surface:#ffffff;
  --gp-surface-2:#fbfaf7;
  --gp-text:#1e1f1b;
  --gp-muted:#60655d;
  --gp-line:rgba(23,59,45,.10);
  --gp-line-strong:rgba(23,59,45,.16);
  --gp-brand:#173b2d;
  --gp-brand-2:#214d3b;
  --gp-accent:#d9b66d;
  --gp-accent-2:#f4ead1;

  --radius-md:24px;
  --radius-lg:34px;
  --gp-radius-xl:32px;
  --gp-radius-lg:24px;
  --gp-radius-md:18px;
  --gp-radius-sm:14px;

  --shadow-sm:0 12px 30px rgba(17,17,17,.06);
  --shadow-md:0 24px 70px rgba(17,17,17,.10);
  --gp-shadow:0 16px 44px rgba(16,24,20,.08);
  --gp-shadow-soft:0 10px 28px rgba(16,24,20,.05);

  --container:1240px;
  --header-height:84px;
  --mobile-overlay-header:66px;
  --gp-sticky-offset:96px;
  --gp-toolbar-height:78px;
}

/* =========================================================
   02. RESET / BASE
   ========================================================= */
*{
  box-sizing:border-box;
}

html{
  scroll-behavior:auto;
  scroll-padding-top:180px;
  overflow-y:scroll;
  scrollbar-gutter:stable;
}

body{
  margin:0;
  color:var(--text);
  background:
    radial-gradient(circle at top left, rgba(197,106,42,.05), transparent 24%),
    linear-gradient(180deg, #fbf8f4 0%, #f7f3ee 100%);
  line-height:1.6;
}

body.menu-open{
  overflow:hidden;
  touch-action:none;
}

img{
  max-width:100%;
  display:block;
  height:auto;
}

a{
  text-decoration:none;
  color:inherit;
}

.brand-name{
  font-family:"Unbounded", sans-serif, Arial, Helvetica, sans-serif !important;
  color: #f7f7f7;
  background: var(--green);
  font-weight: 600;
  padding: 0px 10px;
  border-radius: 999px;
  display: inline-block;
}

p .brand-name {
    font-family: "Unbounded", sans-serif, Arial, Helvetica, sans-serif !important;
    color: #f7f7f7;
    background: var(--green);
    font-weight: 400;
    border-radius: 999px;
    display: inline-block;
    font-size: 0.8rem;
}

/* =========================================================
   03. LAYOUT GÉNÉRAL
   ========================================================= */
.container{
  width:min(100% - 15px, var(--container));
  margin-inline:auto;

}



.section {
    max-width: 1100px;
    width: 100%;
    margin: 0 auto;
    padding: 80px 15px 80px;
}

.section-lg{
  padding:104px 0;
}

.section-head{
  max-width:800px;
  margin:0 auto 46px;
  text-align:center;
}

.page-content{
  opacity:1;
  transform:translateY(0);
  transition:opacity .28s ease, transform .28s ease;
  will-change:opacity, transform;
}

/* =========================================================
   04. TYPOGRAPHIE
   ========================================================= */
html,
body{
  font-family:"Google Sans", Arial, Helvetica, sans-serif !important;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
  font-synthesis:none;
}

body,
p,
a,
li,
span,
small,
em,
strong,
label,
button,
input,
select,
textarea,
summary{
  font-family:"Google Sans", Arial, Helvetica, sans-serif;
  z-index: 0;
}



h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6{
  font-family:"Unbounded", sans-serif, Arial, Helvetica, sans-serif !important;
  margin:0 0 16px;
  line-height:1.20;
  font-weight:600;
}

h1{
  font-size: clamp(1.8rem,4.0vw,3.0rem);
  letter-spacing:-.05em;
  text-align: center;
  line-height: 1.20;
}

h2{
  font-size:clamp(1.6rem,3.4vw,2.8rem);
  letter-spacing:-.04em;
}

h3{
  font-size:clamp(1.2rem,2vw,2.4rem);
  letter-spacing:-.02em;
}

p{
  margin:0 0 16px;
  color:var(--muted);
  font-size:clamp(0.9rem, 3.4vw, 1.1rem);
}

.muted{
  color:var(--muted);
}

.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:8px 14px;
  border-radius:999px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.82);
  color:var(--green);
  font-size:.84rem;
  font-weight:800;
  letter-spacing:.03em;
  text-transform:uppercase;
  margin-bottom:16px;
}

.eyebrow::before{
  content:"";
  width:8px;
  height:8px;
  border-radius:999px;
  background:var(--green);
}

/* =========================================================
   05. LIENS / BOUTONS
   ========================================================= */
.btn-row,
.cta-row{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-top:28px;
  justify-content:center;
}

.btn{
  --btn-bg:var(--primary);
  --btn-border:var(--primary);
  --btn-color:#fff;
  --btn-hover-color:#fff;
  --btn-bubble:var(--primary-dark);
  --btn-shadow:var(--shadow-sm);

  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:40px;
  padding:0.6rem 1.2rem;
  border-radius:999px;
  border:1px solid var(--btn-border);
  background:var(--btn-bg);
  color:var(--btn-color);
  font-weight:800;
  line-height:1.2;
  text-decoration:none;
  transition:transform .2s ease, color .25s ease, border-color .25s ease, background-color .25s ease, box-shadow .25s ease;
  box-shadow:var(--btn-shadow);
  overflow:hidden;
  isolation:isolate;
  cursor:pointer;
}

.btn::before{
  content:"";
  position:absolute;
  z-index:-1;
  top:-50%;
  left:0;
  width:100%;
  height:150%;
  background:var(--btn-bubble);
  transform-origin:left center;
  transform:scaleX(0);
  border-radius:0 80px 80px 0;
}

.btn::after{
  content:none;
}

.btn:hover{
  transform:translateY(-1px);
  color:var(--btn-hover-color);
}

.btn:hover::before{
  animation:btnBubble 700ms cubic-bezier(.25,.25,.5,1.4) 0s both;
}

.btn:focus-visible{
  outline:none;
  box-shadow:0 0 0 3px rgba(88,129,87,.18), var(--btn-shadow);
}

@keyframes btnBubble{
  90%{
    transform:scaleX(.8);
    border-radius:0 40px 40px 0;
  }
  100%{
    transform:scaleX(1);
    border-radius:0;
  }
}

.btn-primary,
.btn-accent{
  --btn-bg:var(--primary);
  --btn-border:var(--primary);
  --btn-color:#fff;
  --btn-hover-color:#fff;
  --btn-bubble:var(--primary-dark);
  --btn-shadow:var(--shadow-sm);
}

.btn-primary:hover,
.btn-accent:hover{
  background:var(--primary);
}

.btn-secondary,
.btn-light{
  --btn-bg:#fff;
  --btn-border:var(--line);
  --btn-color:var(--text);
  --btn-hover-color:#fff;
  --btn-bubble:var(--primary);
  --btn-shadow:none;
}

.btn-secondary:hover,
.btn-light:hover{
  border-color:var(--primary);
  background:#fff;
}

.btn-dark{
  --btn-bg:var(--dark);
  --btn-border:var(--dark);
  --btn-color:#fff;
  --btn-hover-color:#fff;
  --btn-bubble:#000;
  --btn-shadow:0 12px 24px rgba(17,17,17,.16);
}

/* =========================================================
   Variantes boutons avec icône
   ========================================================= */
.btn-icon{
  gap:10px;
  padding:0.6rem 1.2rem;
}

.btn-icon-svg{
  width:25px;
  height:25px;
  flex:0 0 25px;
  display:block;
}

.btn-label{
  display:inline-block;
  line-height:1.2;
}

/* Variante verte type maps / itinéraire */
.btn-maps{
  --btn-bg:var(--primary);
  --btn-border:var(--primary);
  --btn-color:#fff;
  --btn-hover-color:#fff;
  --btn-bubble:var(--primary-dark);
  --btn-shadow:var(--shadow-sm);
}

/* Variante claire type carte / pizza */
.btn-pizza{
  --btn-bg:#fff;
  --btn-border:var(--line);
  --btn-color:var(--text);
  --btn-hover-color:#fff;
  --btn-bubble:var(--primary);
  --btn-shadow:none;
}

.btn-pizza:hover{
  border-color:var(--primary);
  background:#fff;
}

/* Bouton uniquement icône si besoin */
.btn-icon-only{
  width:42px;
  min-width:42px;
  height:42px;
  min-height:42px;
  padding:0;
  border-radius:999px;
}

.btn-icon-only .btn-icon-svg{
  width:18px;
  height:18px;
  flex:0 0 18px;
}

/* =========================================================
   Responsive
   ========================================================= */
@media (max-width:767px){
  .btn-row,
  .cta-row{
    align-items:stretch;
  }

  .btn-row .btn,
  .cta-row .btn{
    width:100%;
  }

  .btn-icon{
    justify-content:center;
  }
}
/* =========================================================
   06. COMPOSANTS COMMUNS
   ========================================================= */


/* =========================================================
   07. TRANSITIONS DE PAGE
   ========================================================= */



/* =========================================================
   08. RESPONSIVE GLOBAL
   ========================================================= */
@media (max-width:767px){
  html{
    scroll-padding-top:154px;
  }
}
















.read-more-line,
.read-more-line section,
.read-more-line p,
.read-more-line h1,
.read-more-line h2,
.read-more-line h3,
.read-more-line h4,
.read-more-line h5,
.read-more-line h6{
  margin:0;
  line-height:1.6;
}

.read-more-word{
  display:inline;
  border:none;
  background:none;
  padding:0;
  margin:0;
  font:inherit;
  color:inherit;
  line-height:inherit;
  vertical-align:baseline;
  text-decoration:none;
  cursor:default;
  appearance:none;
  -webkit-appearance:none;
}

.read-more-word strong,
.read-more-word a,
.read-more-content strong,
.read-more-content a{
  font:inherit;
  color:inherit;
  text-decoration:none;
}

.read-more-word:focus,
.read-more-word:active,
.read-more-word:hover,
.read-more-word:visited{
  outline:none;
  box-shadow:none;
  color:inherit;
  text-decoration:none;
}

.read-more-content{
  display:inline;
}

.read-more-content[hidden]{
  display:none !important;
}









#page-content{
  background:
    radial-gradient(circle at top left, rgba(197,106,42,.05), transparent 24%),
    linear-gradient(180deg, #fbf8f4 0%, #f7f3ee 100%);
}