/* Mam'zelle — base commune : tokens, header, menu mobile, footer · Studio Gringo */
/* Mam'zelle — styles partagés (header, footer, polices) · Studio Gringo */







/* ============ GR TOKENS ============ */
:root{
  --creme:#FFFAE7;
  --vert:#28341C;
  --sauge:#7A8463;
  --gris:#B7B5A4;
  --tomate:#C8442B;
  --or:#C99A45;
  --brique:#7A3B2E;
  --sauge2:#BEBFAC;
  --display:'Jackson',Impact,sans-serif;
  --mono:'Cousine','Courier New',monospace;
  --gut:clamp(20px,4vw,64px);
  --e:cubic-bezier(.22,1,.36,1);
  --eio:cubic-bezier(.76,0,.24,1);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:auto}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{
  background:var(--creme);
  color:var(--vert);
  font-family:var(--mono);
  font-size:15px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
body.gr-lock{overflow:hidden}
::selection{background:var(--vert);color:var(--creme)}
a{color:inherit;text-decoration:none}
ul{list-style:none}
img,svg{display:block;max-width:100%}
/* les attributs width/height servent à réserver la place, pas à figer la hauteur */
img{height:auto}
.gr-wrap{width:min(1500px,100%);margin-inline:auto;padding-inline:var(--gut)}

/* grain papier */
body::after{
  content:"";position:fixed;inset:-50%;z-index:9999;pointer-events:none;opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ============ INTRO (à la Don Molinico) ============ */
.gr-intro{
  position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:900;
  display:flex;align-items:center;justify-content:center;
}
.gr-intro-bg{position:absolute;inset:0;background:var(--vert);will-change:transform}
.gr-intro-logo{
  position:relative;width:min(80vw,760px);
  color:var(--creme);
  opacity:0;will-change:transform;
}
.gr-intro-logo svg{display:block;width:100%;height:auto;fill:currentColor}
.gr-intro-logo em{font-style:normal;color:var(--tomate)}
.gr-intro-bot{
  position:absolute;z-index:2;left:var(--gut);right:var(--gut);bottom:28px;
  display:flex;justify-content:space-between;align-items:baseline;
  color:var(--creme);font-size:12px;letter-spacing:.14em;text-transform:uppercase;
  overflow:hidden;
}
.gr-intro-bot span{display:inline-block;transform:translateY(150%);will-change:transform}
.gr-intro-count{font-variant-numeric:tabular-nums}

/* ============ NAV ============ */
.gr-nav{
  position:fixed;top:0;left:0;right:0;z-index:500;color:var(--creme);
  transition:background .4s var(--e),box-shadow .4s var(--e),color .4s var(--e);
}
.gr-nav.is-scrolled{background:rgba(40,52,28,.94);backdrop-filter:blur(12px);color:var(--creme)}
.gr-nav-in{
  display:flex;align-items:center;justify-content:space-between;gap:24px;
  padding:18px var(--gut);
}
@media (max-width:700px){.gr-nav-in{padding-left:12px;padding-right:12px;gap:10px}}
.gr-brand{display:inline-flex;align-items:center;color:inherit}
.gr-brand svg{display:block;height:19px;width:auto;fill:currentColor;transition:color .4s var(--e)}
.gr-links{display:flex;gap:clamp(16px,3vw,42px);font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:700}
.gr-links a{position:relative;padding:6px 0;white-space:nowrap}
.gr-links a::after{
  content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;background:currentColor;
  transform:scaleX(0);transform-origin:right;transition:transform .45s var(--eio);
}
.gr-links a:hover::after{transform:scaleX(1);transform-origin:left}
.gr-pill{
  --notch:9px;
  display:inline-flex;align-items:center;justify-content:center;
  background:var(--creme);color:var(--vert);
  font-size:12px;letter-spacing:.14em;text-transform:uppercase;
  padding:14px 22px;border-radius:7px;border:0;white-space:nowrap;
  -webkit-mask:
    radial-gradient(circle var(--notch) at 0 50%,#0000 98%,#000) left /51% 100% no-repeat,
    radial-gradient(circle var(--notch) at 100% 50%,#0000 98%,#000) right/51% 100% no-repeat;
  mask:
    radial-gradient(circle var(--notch) at 0 50%,#0000 98%,#000) left /51% 100% no-repeat,
    radial-gradient(circle var(--notch) at 100% 50%,#0000 98%,#000) right/51% 100% no-repeat;
  transition:background .35s var(--e),color .35s var(--e);
  opacity:0;
}
.gr-nav.is-scrolled .gr-pill{background:var(--tomate);color:var(--creme)}
.gr-pill:hover{background:var(--tomate);color:var(--creme)}
.gr-nav.is-scrolled .gr-pill:hover{background:#A93420}
.gr-burger{
  display:none;background:none;border:1px solid currentColor;border-radius:999px;
  width:44px;height:44px;cursor:pointer;position:relative;color:inherit;
}
.gr-burger span{position:absolute;left:12px;right:12px;height:1.5px;background:currentColor;transition:.35s var(--eio)}
.gr-burger span:nth-child(1){top:17px}
.gr-burger span:nth-child(2){bottom:17px}
body.gr-menu-open .gr-burger span:nth-child(1){top:21px;transform:rotate(45deg)}
body.gr-menu-open .gr-burger span:nth-child(2){bottom:21.5px;transform:rotate(-45deg)}

/* menu mobile plein écran */
.gr-menu{
  position:fixed;inset:0;z-index:450;background:var(--vert);color:var(--creme);
  display:flex;flex-direction:column;justify-content:center;row-gap:clamp(10px,1.4vh,16px);padding:0 var(--gut);
  clip-path:inset(0 0 100% 0);visibility:hidden;
  transition:clip-path .8s var(--eio),visibility 0s .8s;
}
body.gr-menu-open .gr-menu{clip-path:inset(0);visibility:visible;transition:clip-path .8s var(--eio)}
.gr-menu a{
  font-family:var(--display);font-size:clamp(40px,9vw,80px);line-height:1.05;
  display:flex;align-items:baseline;gap:clamp(8px,2vw,16px);width:fit-content;text-transform:uppercase;
}
.gr-menu a small{font-family:var(--mono);font-size:12px;letter-spacing:.14em;color:var(--gris)}
.gr-menu a>span{white-space:nowrap;letter-spacing:-.015em}
.gr-menu a:hover{color:var(--tomate)}
.gr-menu-foot{position:absolute;bottom:28px;left:var(--gut);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--gris)}

/* ============ MASQUES / REVEALS ============ */
.gr-mask{overflow:hidden;display:block}
.gr-mask>.gr-l{display:block;transform:translateY(112%);will-change:transform}
html.gr-nojs .gr-mask>.gr-l{transform:none}
[data-fade]{opacity:0;transform:translateY(36px);will-change:transform,opacity}
html.gr-nojs [data-fade]{opacity:1;transform:none}
[data-clip]{clip-path:inset(100% 0 0 0);will-change:clip-path}
html.gr-nojs [data-clip]{clip-path:inset(0)}
[data-clip] .gr-par{will-change:transform}

/* ============ HERO — tout fond vert, centré ============ */
.gr-hero{
  min-height:100svh;position:relative;
  background:var(--vert);color:var(--creme);
  display:flex;flex-direction:column;
  padding:76px 0 0;text-align:center;
}
/* iOS : la barre d'outils se rétracte en cours de défilement, 100svh laisserait un vide sous le hero */
@supports (min-height:100lvh){.gr-hero{min-height:100lvh}}

.gr-hero-grid{
  position:relative;z-index:2;flex:1;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:clamp(18px,3.2vh,34px);
}
.gr-hero-badge{width:clamp(76px,7.5vw,112px);height:auto}
.gr-h1{
  font-family:var(--display);
  font-size:clamp(44px,8vw,136px);
  line-height:.9;letter-spacing:.005em;text-transform:uppercase;
}
.gr-h1 .gr-l em{font-style:normal;color:var(--tomate)}
.gr-h1 .gr-l i{font-style:normal;color:inherit}
.gr-hero-side{margin-inline:auto}
.gr-hero-side p{margin:0 auto 30px;color:rgba(255,250,231,.82)}
.gr-hero-side p b{display:block;white-space:nowrap;font-weight:700;color:var(--creme)}
.gr-hero-side p small{display:block;font-size:12.5px;margin-top:6px;color:rgba(255,250,231,.72)}
@media (max-width:760px){.gr-hero-side p b{white-space:normal}}
.gr-acts{display:flex;flex-wrap:wrap;gap:16px;justify-content:center}
/* boutons "ticket" à encoches */
.gr-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  font-size:12px;letter-spacing:.16em;text-transform:uppercase;
  padding:19px 46px;cursor:pointer;font-family:var(--mono);border:0;
  background:var(--creme);color:var(--vert);
  -webkit-mask:
    radial-gradient(circle 11px at 0 50%,#0000 97%,#000) left/51% 100% no-repeat,
    radial-gradient(circle 11px at 100% 50%,#0000 97%,#000) right/51% 100% no-repeat;
  mask:
    radial-gradient(circle 11px at 0 50%,#0000 97%,#000) left/51% 100% no-repeat,
    radial-gradient(circle 11px at 100% 50%,#0000 97%,#000) right/51% 100% no-repeat;
  transition:background .3s var(--e),color .3s var(--e),transform .3s var(--e);
}
.gr-btn:hover{background:var(--tomate);color:var(--creme);transform:translateY(-2px)}
.gr-btn-alt{background:var(--gris);color:var(--vert)}
.gr-btn-full{background:var(--vert);color:var(--creme)}
.gr-hero::after{
  content:"";position:absolute;bottom:0;left:0;right:0;height:26px;z-index:2;
  background:
    repeating-linear-gradient(90deg,var(--creme) 0 22px,transparent 22px 44px) left 0 bottom 0/44px 13px repeat-x,
    repeating-linear-gradient(90deg,transparent 0 22px,var(--creme) 22px 44px) left 0 bottom 13px/44px 13px repeat-x;
}
@keyframes gr-spin{to{transform:rotate(360deg)}}
/* cartes timbre qui montent au scroll (hero épinglé) */
.gr-hero{overflow:clip}
.gr-hero-cards{position:absolute;inset:0;z-index:3;pointer-events:none}
.gr-hero-cards .gr-stamp{
  position:absolute;top:100%;
  filter:drop-shadow(0 22px 34px rgba(0,0,0,.45));
}
.gr-hero-cards .hc1{left:5%;width:clamp(170px,17vw,270px);transform:rotate(-7deg)}
.gr-hero-cards .hc2{left:50%;margin-left:calc(-1*clamp(95px,10vw,160px));width:clamp(190px,20vw,320px);transform:rotate(2.5deg)}
.gr-hero-cards .hc3{right:5%;width:clamp(170px,17vw,270px);transform:rotate(6deg)}
@media (max-width:820px){.gr-hero-cards{display:none}}
/* ============ MARQUEE — titre géant + cartes intercalées ============ */
.gr-mq{overflow:hidden;padding:clamp(48px,8vh,100px) 0 clamp(24px,4vh,48px)}
.gr-mq-t{
  display:flex;align-items:center;gap:clamp(22px,3vw,52px);
  width:max-content;will-change:transform;
  animation:gr-mq 30s linear infinite;
}
.gr-mq-t span{
  font-family:var(--display);font-size:clamp(56px,9vw,150px);
  line-height:1;text-transform:uppercase;color:var(--vert);white-space:nowrap;
}
.gr-mq-card{
  flex:none;width:clamp(130px,15vw,240px);aspect-ratio:2.9/1.6;
  background:#141414;border-radius:14px;
  display:flex;align-items:center;justify-content:center;
  color:rgba(255,250,231,.35);font-size:9px;letter-spacing:.2em;text-transform:uppercase;
}
@keyframes gr-mq{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.gr-mq-t{animation:none}}

/* ============ CIAO (intro + stats) ============ */
.gr-ciao{padding:clamp(70px,11vh,150px) 0;text-align:center}
.gr-ciao h2{
  font-family:var(--display);font-size:clamp(64px,11vw,180px);
  line-height:.9;text-transform:uppercase;color:var(--vert);
}
.gr-ciao h2 em{font-style:normal;color:var(--tomate)}
.gr-ciao-txt{
  max-width:56ch;margin:clamp(20px,3vh,34px) auto 0;
  font-weight:700;font-size:clamp(12px,1.3vw,15px);
  letter-spacing:.02em;line-height:2;color:var(--vert);
}
.gr-stats{
  display:flex;justify-content:center;gap:clamp(40px,8vw,140px);
  margin-top:clamp(44px,7vh,84px);flex-wrap:wrap;
}
.gr-stat b{
  font-family:var(--display);font-weight:400;
  font-size:clamp(56px,8vw,120px);line-height:1;color:var(--vert);display:block;
}
.gr-stat > span{font-size:11px;letter-spacing:.02em;color:var(--sauge)}
.gr-stat b span{font:inherit;color:inherit}

/* ============ CARROUSEL PIZZAS & PASTAS (cartes "collection") ============ */
.gr-fx{background:var(--vert);color:var(--creme);border-radius:44px;padding:clamp(70px,11vh,150px) 0;overflow:hidden}
.gr-fx-top{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,72px);
  align-items:center;margin-bottom:clamp(34px,5vh,64px);
}
.gr-fx-left h2{font-family:var(--display);font-size:clamp(44px,6.5vw,104px);line-height:.9;text-transform:uppercase}
.gr-fx-left .gr-rib{margin-top:clamp(18px,3vh,30px)}
.gr-fx-hand{font-style:italic;font-size:15px;color:rgba(255,250,231,.85);transform:rotate(-3deg);display:inline-block;margin-bottom:14px}
.gr-fx-right p:not(.gr-fx-hand){max-width:46ch;font-size:13px;line-height:1.8;color:rgba(255,250,231,.8)}
@media (max-width:820px){.gr-fx-top{grid-template-columns:1fr}}
.gr-fx .swiper{overflow:visible}
.gr-fx .swiper-slide{width:clamp(250px,25vw,350px)}
/* carte collection */
.gr-tc{
  background:#EDE5C9;color:var(--vert);border-radius:10px;
  padding:clamp(16px,1.6vw,24px);height:100%;cursor:grab;
  position:relative;text-align:center;
  transition:transform .45s var(--e);
  display:flex;flex-direction:column;gap:14px;
}
.gr-tc:active{cursor:grabbing}
.gr-tc::before{
  content:"";position:absolute;inset:8px;border:1.5px solid var(--vert);
  border-radius:6px;pointer-events:none;
}
.gr-tc:hover{transform:translateY(-8px) rotate(-1deg)}
.gr-tc h3{
  font-family:var(--display);font-size:clamp(21px,2.2vw,32px);
  line-height:1;text-transform:uppercase;padding-top:10px;
  text-align:center;
}
.gr-tc-ph{
  position:relative;aspect-ratio:1/1;background:#141414;margin:0 6px;
  clip-path:polygon(0 12px,12px 12px,12px 0,calc(100% - 12px) 0,calc(100% - 12px) 12px,100% 12px,100% calc(100% - 12px),calc(100% - 12px) calc(100% - 12px),calc(100% - 12px) 100%,12px 100%,12px calc(100% - 12px),0 calc(100% - 12px));
  display:flex;align-items:center;justify-content:center;
  color:rgba(255,250,231,.28);font-size:9px;letter-spacing:.02em;
  transition:transform .5s var(--e);
}
.gr-tc:hover .gr-tc-ph{transform:scale(1.02)}
.gr-tc-strip{
  position:absolute;top:0;left:8%;right:8%;height:16px;
  background:repeating-linear-gradient(90deg,#EDE5C9 0 16px,transparent 16px 32px);
}
.gr-tc-stats{
  display:grid;grid-template-columns:1fr 1fr;align-items:stretch;
  padding:2px 6px 10px;
}
.gr-tc-stats > div{padding:4px 8px}
.gr-tc-stats > div + div{border-left:1.5px dotted rgba(40,52,28,.5)}
.gr-tc-stats b{
  display:block;font-family:var(--display);font-weight:400;
  font-size:clamp(24px,2.4vw,36px);line-height:1.05;
}
.gr-tc-stats span{font-size:9.5px;letter-spacing:.02em;color:rgba(40,52,28,.65)}
/* ============ SAVOIR-FAIRE — fond vert, billets inclinés ============ */
.gr-steps{background:var(--vert);color:var(--creme);position:relative;overflow:clip;border-radius:44px;margin-top:-14px}
.gr-steps::before{
  content:"";position:absolute;top:0;left:0;right:0;height:26px;z-index:3;
  background:
    repeating-linear-gradient(90deg,var(--creme) 0 22px,transparent 22px 44px) top left/44px 13px repeat-x,
    repeating-linear-gradient(90deg,transparent 0 22px,var(--creme) 22px 44px) left 0 top 13px/44px 13px repeat-x;
}
.gr-steps-pin{position:relative}
.gr-steps-stage{min-height:100lvh;position:relative;overflow:hidden;padding:clamp(70px,10vh,110px) 0}
.gr-steps h2{
  font-family:var(--display);font-size:clamp(44px,6.5vw,104px);
  line-height:.9;text-transform:uppercase;position:relative;z-index:2;
}
.gr-steps-circle{
  position:absolute;z-index:1;left:50%;bottom:-46%;transform:translateX(-50%);
  width:min(52vw,680px);aspect-ratio:1;
  will-change:transform;pointer-events:none;
  filter:drop-shadow(0 26px 54px rgba(0,0,0,.45));
}
/* billets */
.gr-step{
  position:absolute;z-index:2;
  width:clamp(230px,21.5vw,330px);
  background:#EDE4D3;color:var(--vert);border-radius:6px;
  padding:clamp(26px,2.6vw,40px) clamp(20px,2vw,32px);
  text-align:center;will-change:transform;
  box-shadow:0 24px 60px rgba(0,0,0,.35);
}
.gr-step-f{position:absolute;inset:8px;border:1.5px solid var(--vert);border-radius:3px;pointer-events:none}
.gr-step-f::before{content:"";position:absolute;inset:4px;border:1.5px solid var(--vert);border-radius:2px}
.gr-step-c{
  position:absolute;width:15px;height:15px;border-radius:50%;
  background:#EDE4D3;border:1.5px solid var(--vert);
}
.gr-step-c.c1{top:-8px;left:-8px}
.gr-step-c.c2{top:-8px;right:-8px}
.gr-step-c.c3{bottom:-8px;left:-8px}
.gr-step-c.c4{bottom:-8px;right:-8px}
.gr-step small{
  display:block;font-size:10px;letter-spacing:.02em;
  color:rgba(40,52,28,.6);margin-bottom:8px;
}
.gr-step h3{font-family:var(--display);font-size:clamp(22px,2.3vw,34px);text-transform:uppercase;line-height:1;margin-bottom:12px}
.gr-step p{font-size:12.5px;line-height:1.75;color:rgba(40,52,28,.8)}
.gr-step.st1{left:6%;top:34%;transform:rotate(-6deg)}
.gr-step.st2{left:28%;top:42%;transform:rotate(-1.5deg);z-index:3}
.gr-step.st3{left:51%;top:32%;transform:rotate(4deg)}
.gr-step.st4{left:73%;top:44%;transform:rotate(8deg);z-index:3}
@media (max-width:820px){
  .gr-steps-stage{min-height:0;padding-bottom:120px}
  .gr-step{position:relative;left:auto!important;top:auto!important;width:min(100%,420px);margin:18px auto 0}
  .gr-step.st1{transform:rotate(-2deg)}.gr-step.st2{transform:rotate(1.5deg)}
  .gr-step.st3{transform:rotate(-1deg)}.gr-step.st4{transform:rotate(2deg)}
  .gr-steps-circle{bottom:-18%;width:70vw}
}
/* ============ AVIS ============ */
.gr-rev{padding:clamp(70px,11vh,150px) 0;text-align:center;overflow:hidden}
.gr-rev h2{
  font-family:var(--display);font-size:clamp(52px,9vw,150px);
  line-height:.9;text-transform:uppercase;color:var(--vert);
}
.gr-rev h2 .gr-star{color:var(--or)}
.gr-rev-tag{
  display:inline-block;margin-top:14px;font-size:10px;letter-spacing:.02em;
  border:1px solid rgba(40,52,28,.3);border-radius:999px;padding:6px 14px;color:var(--sauge);
}
.gr-rev-track{
  display:flex;gap:clamp(16px,2vw,28px);width:max-content;
  margin-top:clamp(40px,6vh,70px);will-change:transform;
  animation:gr-mq 38s linear infinite;
}
.gr-rev:hover .gr-rev-track{animation-play-state:paused}
.gr-rev-card{
  width:clamp(240px,26vw,360px);background:#F3ECD3;border:1px solid rgba(40,52,28,.2);
  border-radius:16px;padding:1.8em 1.6em;text-align:center;flex:none;
  display:flex;flex-direction:column;gap:.8em;
}
.gr-rev-stars{color:var(--or);letter-spacing:.2em;font-size:14px}
.gr-rev-card p{font-size:13px;line-height:1.7}
.gr-rev-card b{font-size:11px;letter-spacing:.02em;color:var(--sauge)}

/* ============ ENGAGEMENTS — timbres + certificat ============ */
.gr-ben{padding:clamp(80px,12vh,170px) 0;overflow:hidden}
.gr-ben-grid{display:grid;grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);align-items:center}
.gr-ben-stamps{position:relative;z-index:2;min-height:clamp(380px,46vw,640px)}
.gr-stamp{
  position:absolute;background:#fff;padding:12px;
  width:clamp(170px,19vw,290px);
  filter:drop-shadow(0 18px 28px rgba(20,20,20,.3));
  /* perforations : vraies encoches soustraites du cadre */
  -webkit-mask:
    radial-gradient(circle 7px at 50% 50%,#000 97%,#0000) 0 -7px/23px 14px repeat-x,
    radial-gradient(circle 7px at 50% 50%,#000 97%,#0000) left 0 bottom -7px/23px 14px repeat-x,
    radial-gradient(circle 7px at 50% 50%,#000 97%,#0000) -7px 0/14px 23px repeat-y,
    radial-gradient(circle 7px at 50% 50%,#000 97%,#0000) right -7px top 0/14px 23px repeat-y,
    linear-gradient(#000 0 0);
  -webkit-mask-composite:destination-out,destination-out,destination-out,destination-out,source-over;
  mask:
    radial-gradient(circle 7px at 50% 50%,#000 97%,#0000) 0 -7px/23px 14px repeat-x,
    radial-gradient(circle 7px at 50% 50%,#000 97%,#0000) left 0 bottom -7px/23px 14px repeat-x,
    radial-gradient(circle 7px at 50% 50%,#000 97%,#0000) -7px 0/14px 23px repeat-y,
    radial-gradient(circle 7px at 50% 50%,#000 97%,#0000) right -7px top 0/14px 23px repeat-y,
    linear-gradient(#000 0 0);
  mask-composite:exclude;
}
.gr-stamp-ph{
  aspect-ratio:3/4;background:#141414;position:relative;overflow:hidden;
  display:flex;align-items:flex-end;justify-content:flex-start;padding:12px;
  color:rgba(255,250,231,.25);font-size:9px;letter-spacing:.02em;
}
.gr-stamp-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.gr-stamp.s1{top:0;left:0;transform:rotate(-6deg);z-index:1}
.gr-stamp.s2{top:6%;left:38%;transform:rotate(4deg);z-index:2}
.gr-stamp.s3{top:38%;left:14%;transform:rotate(-2deg);z-index:3;width:clamp(200px,22vw,330px)}
.gr-stamp{transition:transform .45s var(--e),z-index 0s}
.gr-stamp:hover{transform:rotate(0) scale(1.04);z-index:5}

.gr-cert{
  position:relative;background:#F3ECD3;border:1.5px solid var(--vert);
  padding:clamp(34px,4.5vw,64px) clamp(26px,4vw,70px) clamp(56px,6vw,90px);
  margin-left:calc(-1*clamp(30px,4vw,70px));
}
.gr-cert::before{
  content:"";position:absolute;inset:9px;border:1.5px solid var(--vert);
  pointer-events:none;
}
.gr-cert h2{
  font-family:var(--display);font-size:clamp(36px,4.6vw,72px);
  line-height:.95;text-transform:uppercase;color:var(--vert);
  text-align:center;margin-bottom:clamp(26px,3.5vh,44px);
}
.gr-cert-item{margin-bottom:clamp(18px,2.6vh,30px)}
.gr-cert-item h3{
  display:flex;align-items:center;gap:12px;
  font-family:var(--mono);font-weight:700;font-size:clamp(14px,1.4vw,17px);
  letter-spacing:.04em;color:var(--vert);
  border-bottom:1.5px solid rgba(40,52,28,.55);padding-bottom:9px;
}
.gr-cert-item h3 i{font-style:normal;color:var(--vert)}
.gr-cert-item p{font-size:13px;line-height:1.75;color:rgba(40,52,28,.75);margin-top:9px}
.gr-cert .gr-rib{position:absolute;left:50%;bottom:-19px;transform:translateX(-50%)}
.gr-rib{
  display:inline-flex;align-items:center;justify-content:center;
  padding:15px 42px;background:var(--or);color:var(--vert);
  font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-family:var(--mono);font-weight:700;
  clip-path:polygon(0 0,100% 0,calc(100% - 13px) 50%,100% 100%,0 100%,13px 50%);
  transition:background .3s var(--e),color .3s var(--e);white-space:nowrap;
}
.gr-rib:hover{background:var(--vert);color:var(--creme)}
/* ============ PIZZA & PASTA — disque tournant ============ */
.gr-pp{position:relative;overflow:hidden;padding:clamp(90px,14vh,180px) 0}
.gr-pp-stage{position:relative;min-height:clamp(560px,108vh,1000px)}
.gr-pp-center{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  /* le texte circulaire culmine à ~95% du bloc : 105vw => le texte affleure le bord */
  width:min(108.5vw,1560px);aspect-ratio:1;
}
.gr-pp-ringtext{position:absolute;inset:0;will-change:transform}
.gr-pp-ringtext text{
  font-family:var(--display);font-size:32px;letter-spacing:.2em;
  fill:var(--vert);text-transform:uppercase;
}
.gr-pp-ring{position:absolute;inset:7%;will-change:transform}
.gr-pp-disc{
  position:absolute;inset:16%;border-radius:50%;overflow:hidden;
  background:#141414;will-change:transform;
  box-shadow:0 40px 120px rgba(40,52,28,.3);
}
.gr-pp-half{
  position:absolute;inset:0;
  display:flex;align-items:center;justify-content:center;
  color:rgba(255,250,231,.25);font-size:10px;letter-spacing:.02em;
}
.gr-pp-half.h1{clip-path:polygon(0 0,100% 0,0 100%);background:#161616}
.gr-pp-half.h2{clip-path:polygon(100% 0,100% 100%,0 100%);background:#1f1f1f}
.gr-pp-half.h1 span{transform:translate(-18%,-18%)}
.gr-pp-half.h2 span{transform:translate(18%,18%)}
.gr-pp-cut{
  position:absolute;left:-8%;top:50%;width:116%;height:0;
  border-top:3px dashed rgba(255,250,231,.75);
  transform:rotate(-45deg);transform-origin:center;
}
.gr-pp-card{
  position:absolute;z-index:5;background:#fff;color:var(--vert);
  width:clamp(240px,26vw,360px);padding:clamp(22px,2.6vw,38px);
  box-shadow:0 26px 70px rgba(40,52,28,.28);border-radius:8px;
  text-align:center;display:flex;flex-direction:column;gap:14px;
}
.gr-pp-card h3{font-family:var(--display);font-size:clamp(30px,3.2vw,48px);line-height:1;text-transform:uppercase}
.gr-pp-card p{font-size:12.5px;line-height:1.8}
.gr-pp-card .gr-rib{width:100%}
.gr-pp-card .gr-rib.is-vert{background:var(--vert);color:var(--creme)}
.gr-pp-card .gr-rib.is-vert:hover{background:var(--sauge)}
.gr-pp-card.c1{left:clamp(8px,6vw,120px);top:clamp(20px,10vh,120px);transform:rotate(-2deg)}
.gr-pp-card.c2{right:clamp(8px,6vw,120px);bottom:clamp(20px,10vh,120px);transform:rotate(2deg)}
@media (max-width:820px){
  .gr-pp-stage{min-height:0;display:flex;flex-direction:column;gap:26px;align-items:center}
  .gr-pp-center{position:relative;left:auto;top:auto;transform:none;width:108.5vw;max-width:none;margin:-8vw 0}
  .gr-pp-card{position:static;transform:none;width:min(100%,420px)}
}


/* ============ TROUVER ============ */
.gr-tr-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,72px);align-items:start}
.gr-tr-fig{border-radius:18px;overflow:hidden;background:#F3ECD3;aspect-ratio:4/3;position:relative}
.gr-tr-fig svg{position:absolute;inset:0;width:100%;height:100%}
.gr-infos{display:grid;grid-template-columns:1fr 1fr;gap:28px 32px;margin-top:8px}
.gr-info h4{
  font-size:11px;letter-spacing:.02em;color:var(--sauge);
  margin-bottom:10px;
}
.gr-info p{font-size:14px}
.gr-info .gr-todo{color:var(--gris)}
.gr-tr-cta{margin-top:34px}

/* ============ FOOTER ============ */
.gr-foot{background:var(--vert);color:var(--creme);padding:clamp(60px,9vh,110px) 0 26px;border-radius:44px 44px 0 0}
.gr-fmark{
  width:100%;margin:0;line-height:0;
}
.gr-fmark-svg{display:block;width:100%;height:auto;fill:var(--creme);overflow:visible}
.gr-fmark-dot{fill:var(--tomate)}
.gr-fbot{
  display:flex;flex-wrap:wrap;gap:14px 28px;justify-content:space-between;align-items:center;
  border-top:1px solid rgba(255,250,231,.18);
  margin-top:clamp(30px,5vh,60px);padding-top:22px;
  font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--gris);
}
.gr-fbot nav{display:flex;gap:22px}
.gr-fbot a:hover{color:var(--creme)}
.gr-foot .gr-pill{opacity:1;background:var(--tomate);color:var(--creme);flex:none}
.gr-foot .gr-pill:hover{background:#A93420;color:var(--creme)}

/* ============ RESPONSIVE ============ */
@media (max-width:980px){
  .gr-tr-grid{grid-template-columns:1fr}
  .gr-steps-track{width:auto;flex-direction:column;padding-left:0}
  .gr-step{width:100%}
  .gr-steps-stage{min-height:0}
  .gr-steps-circle{display:none}
  .gr-ben-grid{grid-template-columns:minmax(0,1fr);gap:40px}
  .gr-cert h2{font-size:clamp(19px,6.2vw,34px)}
  .gr-ben-stamps{min-height:0;display:flex;flex-wrap:wrap;gap:18px;justify-content:center}
  .gr-stamp{position:static;width:clamp(150px,40vw,240px)}
  .gr-stamp.s3{width:clamp(150px,40vw,240px)}
  .gr-cert{margin-left:0}
}
@media (max-width:960px){
  .gr-links{display:none}
  .gr-burger{display:block}
  .gr-brand svg{height:13px}
}
@media (min-width:561px) and (max-width:960px){
  .gr-menu{
    row-gap:clamp(5px,1.2vmin,10px);
    padding:clamp(90px,13vmin,120px) var(--gut) clamp(56px,8vmin,72px);
    overflow-y:auto;
  }
  .gr-menu a{font-size:clamp(42px,7.2vmin,58px);line-height:1}
  .gr-menu a small{font-size:clamp(9px,1.3vmin,11px)}
  .gr-menu-foot{bottom:clamp(16px,3vmin,28px)}
}
@media (max-width:560px){
  .gr-infos{grid-template-columns:1fr}
}