/* devanagari */
@font-face {
  font-family: 'Poppins';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/cde48c89e89f53ae.woff2") format('woff2');
  unicode-range: U+0900-097F, U+1CD0-1CF4, U+1CF7-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B0A;
}
/* latin-ext */
@font-face {
  font-family: 'Poppins';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/1e91b430ebe5aa34.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Poppins';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/50d0c1742d80ac71.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* devanagari */
@font-face {
  font-family: 'Poppins';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/c4f36ddfe165e5c1.woff2") format('woff2');
  unicode-range: U+0900-097F, U+1CD0-1CF4, U+1CF7-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B0A;
}
/* latin-ext */
@font-face {
  font-family: 'Poppins';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/248a4c1403251015.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Poppins';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/1ddb074f9963be8f.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* devanagari */
@font-face {
  font-family: 'Poppins';
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url("/assets/fonts/73b9ec8afb28abd1.woff2") format('woff2');
  unicode-range: U+0900-097F, U+1CD0-1CF4, U+1CF7-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B0A;
}
/* latin-ext */
@font-face {
  font-family: 'Poppins';
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url("/assets/fonts/10a9b6414cbebd69.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Poppins';
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url("/assets/fonts/3ad6c8bd3624555d.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* devanagari */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("/assets/fonts/28e0850de1cae95b.woff2") format('woff2');
  unicode-range: U+0900-097F, U+1CD0-1CF4, U+1CF7-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B0A;
}
/* latin-ext */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("/assets/fonts/33ff412e573782b8.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("/assets/fonts/78bc3aa78faec288.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* devanagari */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/6b986471df6084ba.woff2") format('woff2');
  unicode-range: U+0900-097F, U+1CD0-1CF4, U+1CF7-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B0A;
}
/* latin-ext */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/0b1fcab42c18b69b.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/7d93459d86585bfc.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* devanagari */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/f018c9ad67dc6c2c.woff2") format('woff2');
  unicode-range: U+0900-097F, U+1CD0-1CF4, U+1CF7-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B0A;
}
/* latin-ext */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/af5fda16a19169e0.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/cd36de204aca2d5f.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* devanagari */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/assets/fonts/58dba357cb1e89bf.woff2") format('woff2');
  unicode-range: U+0900-097F, U+1CD0-1CF4, U+1CF7-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B0A;
}
/* latin-ext */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/assets/fonts/bb1f2d582e7fba58.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/assets/fonts/f4e80d9dfd374d02.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* devanagari */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/assets/fonts/de10eb6f1f452594.woff2") format('woff2');
  unicode-range: U+0900-097F, U+1CD0-1CF4, U+1CF7-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B0A;
}
/* latin-ext */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/assets/fonts/ccfd87f69ef00d81.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/assets/fonts/9338e65fc077355c.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* devanagari */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("/assets/fonts/6c6bb57f25ccf0ee.woff2") format('woff2');
  unicode-range: U+0900-097F, U+1CD0-1CF4, U+1CF7-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B0A;
}
/* latin-ext */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("/assets/fonts/a72eccfa6cfa9c26.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("/assets/fonts/60bf0aba6526436f.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ============================================================
   KAPPU — Café de spécialité · Brunch · Pâtisseries maison
   Design tokens + 3 directions visuelles
   ============================================================ */

:root{
  /* Brand palette — Kappu */
  --orange:#FE6E27;       /* primaire */
  --orange-deep:#E45A18;
  --olive:#4F522D;        /* vert profond */
  --sage:#A1B39B;         /* vert sauge */
  --sage-soft:#C6D2C0;
  --terracotta:#A65F39;   /* brun terracotta */
  --tan:#D9C0A2;
  --tan-soft:#E7DABF;
  --cream:#F3EEDC;
  --espresso:#4F522D;     /* sections sombres = olive */
  --ink:#36331E;          /* texte: brun-olive sombre */
  --paper:#F3EEDC;
  --paper-2:#E9E0C7;
  --card:#FBF7EA;
  --line:rgba(54,51,30,.14);
  --muted:#7B785F;

  /* Typography — Poppins (marque) */
  --font-display:"Poppins", system-ui, sans-serif;
  --font-body:"Poppins", system-ui, sans-serif;
  --font-accent:"Poppins", system-ui, sans-serif;

  --h1: clamp(2.5rem, 6vw, 5.2rem);
  --h2: clamp(1.9rem, 3.8vw, 3.2rem);
  --h3: clamp(1.3rem, 2.1vw, 1.85rem);
  --display-weight:700;
  --display-tracking:-0.02em;

  /* Shape */
  --radius:22px;
  --radius-sm:14px;
  --radius-pill:999px;
  --maxw:1240px;
  --gutter:clamp(20px,5vw,72px);

  /* Card treatment (overridden per direction) */
  --card-bg:var(--card);
  --card-border:1px solid transparent;
  --card-shadow:0 24px 60px -32px rgba(33,27,21,.35);
  --card-radius:var(--radius);

  --eyebrow-style:normal; /* serif italic vs uppercase grotesk */
}

/* ---- Direction 2 : Nature (vert-sauge) ---- */
html[data-direction="2"]{
  --paper:#E7ECDA;
  --paper-2:#D2DDC6;
  --card:#F3F5E9;
  --ink:#363C1E;
  --muted:#666B4D;
  --tan-soft:#C2D1B6;
  --espresso:#4F522D;
  --display-weight:600;
  --card-bg:var(--card);
  --card-border:1px solid var(--line);
  --card-shadow:0 18px 44px -30px rgba(63,66,32,.4);
}
html[data-direction="2"] .hero-blob{background:var(--sage);opacity:.5;}
html[data-direction="2"] .chip{background:var(--sage);color:var(--olive);}

/* ---- Direction 3 : Immersive (olive sombre, premium) ---- */
html[data-direction="3"]{
  --paper:#33361C;
  --paper-2:#3D4124;
  --card:#43472A;
  --ink:#F3EEDC;
  --line:rgba(243,238,220,.16);
  --muted:#BDC1A2;
  --tan-soft:#4C5030;
  --sage-soft:#4C5030;
  --espresso:#2A2C16;
  --card-bg:var(--card);
  --card-border:1px solid var(--line);
  --card-shadow:0 30px 70px -30px rgba(0,0,0,.6);
  --display-weight:700;
  --radius:24px;
}

/* ============================================================
   Reset & base
   ============================================================ */
*{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{
  margin:0;
  font-family:var(--font-body);
  background:var(--paper);
  color:var(--ink);
  font-size:18px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
  transition:background .4s ease, color .4s ease;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;cursor:pointer;border:none;background:none;}
h1,h2,h3,h4{margin:0;font-family:var(--font-display);font-weight:var(--display-weight);letter-spacing:var(--display-tracking);line-height:1.02;text-wrap:balance;}
h1{font-size:var(--h1);}
h2{font-size:var(--h2);}
h3{font-size:var(--h3);line-height:1.12;}
p{margin:0;text-wrap:pretty;}
section{position:relative;}

.wrap{max-width:var(--maxw);margin:0 auto;padding-left:var(--gutter);padding-right:var(--gutter);}
.lang-en{display:none;}
html[data-lang="en"] .lang-fr{display:none;}
html[data-lang="en"] .lang-en{display:inline;}
html[data-lang="en"] .lang-en.block{display:block;}

/* Eyebrow / section labels */
.eyebrow{
  font-family:var(--font-accent);
  font-style:italic;
  font-weight:500;
  font-size:.98rem;
  color:var(--orange);
  display:inline-flex;align-items:center;gap:.5rem;
  margin-bottom:1rem;
}
.eyebrow::before{content:"";width:26px;height:1px;background:var(--orange);display:inline-block;}

/* Buttons */
.btn{
  display:inline-flex;align-items:center;gap:.6rem;
  padding:.95rem 1.6rem;border-radius:var(--radius-pill);
  font-weight:600;font-size:1rem;letter-spacing:-.01em;
  transition:transform .25s cubic-bezier(.2,.8,.2,1), background .25s, color .25s, box-shadow .25s;
  white-space:nowrap;
}
.btn:hover{transform:translateY(-2px);}
.btn-primary{background:var(--orange);color:#fff;box-shadow:0 12px 30px -12px var(--orange);}
.btn-primary:hover{background:var(--orange-deep);box-shadow:0 18px 36px -12px var(--orange);}
.btn-ghost{border:1.5px solid var(--ink);color:var(--ink);}
.btn-ghost:hover{background:var(--ink);color:var(--paper);}
.btn-arrow svg{width:18px;height:18px;transition:transform .25s;}
.btn:hover .btn-arrow svg{transform:translateX(3px);}

/* Tag chips */
.chip{
  display:inline-flex;align-items:center;gap:.45rem;
  padding:.4rem .85rem;border-radius:var(--radius-pill);
  background:var(--tan-soft);color:var(--ink);
  font-size:.82rem;font-weight:600;letter-spacing:.01em;
}
html[data-direction="3"] .chip{background:rgba(254,110,39,.16);color:var(--orange);}

/* ============================================================
   NAV
   ============================================================ */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:60;
  transition:background .35s ease, box-shadow .35s ease, padding .35s ease;
  padding:18px 0;
}
.nav.scrolled{
  background:color-mix(in srgb, var(--paper) 86%, transparent);
  backdrop-filter:blur(14px);
  box-shadow:0 1px 0 var(--line);
  padding:10px 0;
}
.nav-inner{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;}
.nav-logo{display:flex;align-items:center;gap:.6rem;}
.nav-logo img{height:46px;width:auto;}
.nav-civet{height:46px;width:auto;transform:scaleX(-1);margin:0 auto;pointer-events:none;}
.nav-links{margin-right:auto;}
@media (max-width:860px){.nav-links{margin-right:0;}}
html[data-direction="3"] .nav-logo .wm-dark{display:none;}
.nav-logo .wm-light{display:none;}
html[data-direction="3"] .nav-logo .wm-light{display:block;}
.nav-links{display:flex;align-items:center;gap:2rem;}
.nav-links a{font-size:.97rem;font-weight:500;color:var(--ink);position:relative;padding:.2rem 0;opacity:.85;transition:opacity .2s;}
.nav-links a::after{content:"";position:absolute;left:0;bottom:-2px;height:2px;width:0;background:var(--orange);transition:width .28s ease;}
.nav-links a:hover{opacity:1;}
.nav-links a:hover::after{width:100%;}
.nav-right{display:flex;align-items:center;gap:1rem;}
.lang-toggle{
  display:inline-flex;border:1px solid var(--line);border-radius:var(--radius-pill);overflow:hidden;font-size:.8rem;font-weight:700;
}
.lang-toggle button{padding:.4rem .7rem;color:var(--muted);transition:background .2s,color .2s;}
.lang-toggle button.active{background:var(--ink);color:var(--paper);}
.nav-burger{display:none;width:44px;height:44px;border-radius:12px;border:1px solid var(--line);align-items:center;justify-content:center;}
.nav-burger span{display:block;width:20px;height:2px;background:var(--ink);position:relative;}
.nav-burger span::before,.nav-burger span::after{content:"";position:absolute;left:0;width:20px;height:2px;background:var(--ink);}
.nav-burger span::before{top:-6px;}.nav-burger span::after{top:6px;}

/* Mobile menu */
.mobile-menu{position:fixed;inset:0;z-index:55;background:var(--paper);transform:translateY(-100%);transition:transform .45s cubic-bezier(.6,0,.2,1);display:flex;flex-direction:column;padding:90px var(--gutter) 40px;gap:.5rem;}
.mobile-menu.open{transform:translateY(0);}
.mobile-menu a{font-family:var(--font-display);font-size:2rem;font-weight:var(--display-weight);padding:.5rem 0;border-bottom:1px solid var(--line);}

/* ============================================================
   HERO
   ============================================================ */
.hero{padding:clamp(120px,16vh,180px) 0 clamp(60px,8vh,90px);overflow:hidden;}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(24px,4vw,60px);align-items:center;}
.hero h1{margin-bottom:1.4rem;}
.hero h1 .accent{font-family:var(--font-accent);font-style:italic;font-weight:600;color:var(--orange);}
.hero-lead{font-size:1.22rem;color:var(--muted);max-width:34ch;margin-bottom:2rem;}
.hero-cta{display:flex;gap:.9rem;flex-wrap:wrap;align-items:center;}
.hero-meta{display:flex;gap:1.6rem;margin-top:2.4rem;flex-wrap:wrap;}
.hero-meta .item{display:flex;flex-direction:column;gap:.1rem;}
.hero-meta .item b{font-family:var(--font-display);font-size:1.5rem;font-weight:var(--display-weight);}
.hero-meta .item span{font-size:.82rem;color:var(--muted);}
.hero-meta .item b span{font-size:inherit;color:inherit;}
.hero-visual{position:relative;}
.hero-photo{width:100%;aspect-ratio:4/5;border-radius:var(--radius);overflow:hidden;}
.hero-civet{position:absolute;left:-46px;bottom:-30px;width:42%;z-index:3;filter:drop-shadow(0 20px 30px rgba(0,0,0,.25));pointer-events:none;}
.hero-blob{position:absolute;inset:auto -8% -12% auto;width:60%;height:60%;background:var(--orange);border-radius:50%;filter:blur(60px);opacity:.22;z-index:0;}
html[data-direction="3"] .hero-blob{opacity:.4;}

/* Ticker / marquee strip */
.ticker{background:var(--orange);color:#fff;padding:14px 0;overflow:hidden;white-space:nowrap;}
html[data-direction="2"] .ticker{background:var(--olive);}
html[data-direction="3"] .ticker{background:var(--orange);}
.ticker-track{display:inline-flex;gap:2.5rem;animation:ticker 28s linear infinite;}
.ticker-track span{font-family:var(--font-display);font-weight:var(--display-weight);font-size:1.1rem;letter-spacing:.01em;display:inline-flex;align-items:center;gap:2.5rem;text-transform:uppercase;}
.ticker-track span::after{content:"✦";font-size:.8rem;opacity:.8;}
@keyframes ticker{to{transform:translateX(-50%);}}

/* ============================================================
   SECTION scaffolding
   ============================================================ */
.section{padding:clamp(70px,11vh,130px) 0;}
.section-head{max-width:62ch;margin-bottom:clamp(36px,5vw,60px);}
.section-head.center{margin-left:auto;margin-right:auto;text-align:center;}
.section-head p.sub{color:var(--muted);font-size:1.12rem;margin-top:1rem;}
.tan-bg{background:var(--paper-2);}
.dark-bg{background:var(--espresso);color:#F6EEE2;}
.dark-bg .section-head p.sub,.dark-bg .muted{color:#C9BBA8;}
html[data-direction="3"] .tan-bg{background:var(--paper-2);}

/* ============================================================
   PRODUCTS / OFFRE
   ============================================================ */
.offer-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,1.6vw,22px);}
.offer-card{
  background:var(--card-bg);border:var(--card-border);box-shadow:var(--card-shadow);
  border-radius:var(--card-radius);overflow:hidden;display:flex;flex-direction:column;
  transition:transform .4s cubic-bezier(.2,.8,.2,1), box-shadow .4s;
}
.offer-card:hover{transform:translateY(-6px);}
.offer-card .ph{width:100%;aspect-ratio:1/1.05;}
.offer-card .photo-slot.ph{height:auto;aspect-ratio:4/5;flex:none;overflow:hidden;}
.offer-card .body{padding:1.3rem 1.4rem 1.6rem;display:flex;flex-direction:column;gap:.5rem;flex:1;}
.offer-card h3{font-size:1.4rem;}
.offer-card p{font-size:.96rem;color:var(--muted);}
.offer-card .num{font-family:var(--font-accent);font-style:italic;color:var(--orange);font-size:1rem;}

/* MENU BROWSER */
.menu-browser{margin-top:clamp(40px,6vw,72px);background:var(--card-bg);border:var(--card-border);box-shadow:var(--card-shadow);border-radius:var(--card-radius);padding:clamp(22px,3.5vw,48px);}
.menu-head{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;flex-wrap:wrap;margin-bottom:1.4rem;}
.menu-head .slogan-line{margin:0;}
.m-tabs{display:flex;gap:.5rem;overflow-x:auto;padding-bottom:.6rem;margin-bottom:1.6rem;border-bottom:1px solid var(--line);scrollbar-width:thin;}
.m-tab{flex:none;padding:.6rem 1.05rem;border-radius:var(--radius-pill);border:1px solid var(--line);color:var(--ink);font-size:.92rem;font-weight:500;transition:background .2s,color .2s,border-color .2s;}
.m-tab:hover{border-color:var(--orange);color:var(--orange);}
.m-tab.active{background:var(--orange);border-color:var(--orange);color:#fff;}
.m-panel{display:none;}
.m-panel.active{display:block;animation:mFade .35s ease;}
@keyframes mFade{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:none;}}
.m-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(28px,4vw,56px);}
.m-item{padding:.85rem 0;border-bottom:1px dashed var(--line);}
.m-line{display:flex;align-items:baseline;gap:.6rem;}
.m-name{font-weight:600;font-size:1rem;}
.m-dots{flex:1;border-bottom:1px dotted color-mix(in srgb,var(--ink) 30%,transparent);transform:translateY(-4px);min-width:12px;}
.m-price{font-weight:700;color:var(--orange);white-space:nowrap;}
.m-desc{font-size:.88rem;color:var(--muted);margin-top:.2rem;line-height:1.45;}
.m-block{margin-top:2rem;}
.m-block h4{font-family:var(--font-display);font-size:1.1rem;font-weight:var(--display-weight);margin-bottom:.4rem;}
.m-grains{margin-top:0;margin-bottom:1.8rem;padding:1.2rem 1.4rem;border-radius:var(--radius-sm);background:var(--tan-soft);}
.m-grains .m-list{grid-template-columns:1fr;}
.m-grains .m-item:last-child{border-bottom:none;}
.m-note{font-size:.95rem;color:var(--muted);margin-bottom:1rem;line-height:1.7;padding:1rem 1.2rem;border-radius:var(--radius-sm);background:var(--tan-soft);}
.m-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(28px,4vw,56px);align-items:start;}
.m-col{grid-template-columns:1fr;}
@media (max-width:760px){.m-list{grid-template-columns:1fr;}.m-cols{grid-template-columns:1fr;}}

/* ============================================================
   BRUNCH FEATURE
   ============================================================ */
.brunch{background:var(--orange);color:#fff;border-radius:var(--radius);overflow:hidden;}
html[data-direction="3"] .brunch{background:linear-gradient(135deg,var(--orange),var(--orange-deep));}
.brunch-grid{display:grid;grid-template-columns:1fr 1fr;align-items:stretch;}
.brunch-copy{padding:clamp(34px,5vw,64px);}
.brunch-copy .eyebrow{color:#fff;}
.brunch-copy .eyebrow::before{background:#fff;}
.brunch h2{color:#fff;margin-bottom:1.2rem;}
.brunch-copy p{color:rgba(255,255,255,.92);font-size:1.1rem;max-width:42ch;margin-bottom:1.4rem;}
.brunch .btn-primary{background:#fff;color:var(--orange-deep);box-shadow:none;}
.brunch .btn-primary:hover{background:var(--ink);color:#fff;}
.brunch-photo{position:relative;min-height:340px;}
.brunch-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;}
@media (max-width:860px){.brunch-photo{min-height:0;aspect-ratio:4/5;}}
.brunch-badge{
  position:absolute;top:24px;right:24px;background:var(--ink);color:#fff;
  width:120px;height:120px;border-radius:50%;display:flex;flex-direction:column;
  align-items:center;justify-content:center;text-align:center;gap:.1rem;
  font-family:var(--font-display);line-height:1;transform:rotate(-8deg);pointer-events:none;
}
.brunch-badge b{font-size:1.9rem;}
.brunch-badge span{font-size:.62rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;}

/* ============================================================
   ABOUT / STORY
   ============================================================ */
.about-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(30px,5vw,70px);align-items:center;}
.about-visual{position:relative;}
.about-photo{aspect-ratio:5/6;border-radius:var(--radius);overflow:hidden;}
.about-civet{position:absolute;right:-30px;bottom:-30px;width:38%;filter:drop-shadow(0 16px 26px rgba(0,0,0,.22));pointer-events:none;}
.about-body p{color:var(--muted);font-size:1.12rem;margin-bottom:1.2rem;}
.values{display:flex;flex-direction:column;gap:0;margin-top:1.5rem;border-top:1px solid var(--line);}
.value{display:flex;gap:1.2rem;padding:1.2rem 0;border-bottom:1px solid var(--line);align-items:baseline;}
.value .k{font-family:var(--font-accent);font-style:italic;color:var(--orange);font-size:1.2rem;min-width:2.4rem;}
.value h4{font-family:var(--font-display);font-size:1.25rem;font-weight:var(--display-weight);margin-bottom:.2rem;}
.value p{color:var(--muted);font-size:.98rem;}

/* ============================================================
   BOUTIQUE
   ============================================================ */
.shop-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,26px);}
.shop-card{background:var(--card-bg);border:var(--card-border);box-shadow:var(--card-shadow);border-radius:var(--card-radius);overflow:hidden;display:flex;flex-direction:column;transition:transform .35s;}
.shop-card:hover{transform:translateY(-5px);}
.shop-card .ph{aspect-ratio:1/1;position:relative;}
.shop-card .tagrow{position:absolute;top:12px;left:12px;display:flex;gap:.4rem;}
.shop-card .body{padding:1.2rem 1.3rem 1.4rem;display:flex;flex-direction:column;gap:.35rem;flex:1;}
.shop-card h3{font-size:1.22rem;}
.shop-card .desc{font-size:.9rem;color:var(--muted);flex:1;}
.shop-card .buy{display:flex;align-items:center;justify-content:space-between;margin-top:.7rem;}
.shop-card .price{font-family:var(--font-display);font-weight:var(--display-weight);font-size:1.3rem;}
.shop-card .add{width:42px;height:42px;border-radius:50%;background:var(--ink);color:var(--paper);display:flex;align-items:center;justify-content:center;transition:background .2s,transform .2s;}
.shop-card .add:hover{background:var(--orange);transform:scale(1.08) rotate(90deg);}

/* ============================================================
   TÉMOIGNAGES
   ============================================================ */
.testi-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,2vw,24px);}
.testi{background:var(--card-bg);border:var(--card-border);box-shadow:var(--card-shadow);border-radius:var(--card-radius);padding:1.8rem;display:flex;flex-direction:column;gap:1.1rem;}
.testi .stars{color:var(--orange);letter-spacing:.15em;font-size:.95rem;}
.testi blockquote{margin:0;font-family:var(--font-accent);font-style:italic;font-size:1.18rem;line-height:1.45;}
.testi .who{display:flex;align-items:center;gap:.75rem;margin-top:auto;}
.testi .who .av{width:42px;height:42px;border-radius:50%;background:var(--tan);overflow:hidden;flex:none;}
.testi .who b{font-family:var(--font-body);font-weight:700;font-size:.95rem;display:block;}
.testi .who span{font-size:.82rem;color:var(--muted);}

/* ============================================================
   RECRUTEMENT
   ============================================================ */
.recruit{display:grid;grid-template-columns:1.3fr .7fr;gap:clamp(24px,4vw,50px);align-items:center;background:var(--espresso);color:#F6EEE2;border-radius:var(--radius);padding:clamp(34px,5vw,60px);overflow:hidden;}
.recruit h2{color:#F6EEE2;}
.recruit p{color:#C9BBA8;font-size:1.1rem;margin:1rem 0 1.6rem;max-width:46ch;}
.recruit .btn-primary{background:var(--orange);}
.recruit-note{
  display:inline-flex;align-items:center;gap:.55rem;margin:1.4rem 0 1.7rem;max-width:42ch;
  padding:.7rem 1.1rem;border-radius:14px;border:1px solid rgba(254,110,39,.4);
  background:rgba(254,110,39,.13);color:#F6EEE2;font-size:.95rem;line-height:1.4;
}
.recruit-note strong{color:var(--orange);font-weight:700;}
.recruit-visual{position:relative;display:flex;justify-content:center;align-items:center;}
.recruit-visual img{width:80%;max-width:260px;}

/* ============================================================
   CONTACT
   ============================================================ */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,56px);}
.info-list{display:flex;flex-direction:column;gap:1.5rem;margin-top:1.5rem;}
.info-item{display:flex;gap:1rem;align-items:flex-start;}
.info-item .ic{width:44px;height:44px;border-radius:12px;background:var(--tan-soft);display:flex;align-items:center;justify-content:center;flex:none;color:var(--orange);}
.info-item .ic svg{width:20px;height:20px;}
.info-item h4{font-family:var(--font-display);font-size:1.1rem;font-weight:var(--display-weight);margin-bottom:.2rem;}
.info-item p{color:var(--muted);font-size:.98rem;}
.hours{margin-top:1.6rem;border-top:1px solid var(--line);}
.hours .row{display:flex;justify-content:space-between;padding:.7rem 0;border-bottom:1px solid var(--line);font-size:.96rem;}
.hours .row span:first-child{color:var(--muted);}
.hours .row.today{color:var(--orange);font-weight:700;}
.hours .row.brunch-note{font-size:.84rem;color:var(--orange);font-style:italic;gap:1rem;}
.hours .row.brunch-note span:last-child{color:var(--muted);font-style:normal;white-space:nowrap;}
.socials{display:flex;gap:.7rem;margin-top:1.6rem;flex-wrap:wrap;}
.socials a{display:inline-flex;align-items:center;gap:.55rem;padding:.6rem 1rem;border-radius:var(--radius-pill);border:1px solid var(--line);font-size:.9rem;font-weight:600;transition:background .2s,color .2s,border-color .2s;}
.socials a:hover{background:var(--orange);color:#fff;border-color:var(--orange);}
.socials svg{width:18px;height:18px;}

.form{background:var(--card-bg);border:var(--card-border);box-shadow:var(--card-shadow);border-radius:var(--card-radius);padding:clamp(24px,3vw,38px);}
.field{margin-bottom:1.1rem;}
.field label{display:block;font-size:.82rem;font-weight:600;margin-bottom:.45rem;letter-spacing:.02em;}
.field input,.field textarea,.field select{
  width:100%;padding:.85rem 1rem;border-radius:12px;border:1px solid var(--line);
  background:var(--paper);color:var(--ink);font-family:inherit;font-size:1rem;transition:border .2s,box-shadow .2s;
}
.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-color:var(--orange);box-shadow:0 0 0 3px rgba(254,110,39,.16);}
.field textarea{resize:vertical;min-height:110px;}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem;}

/* ============================================================
   FOOTER
   ============================================================ */
.footer{position:relative;background:var(--espresso);color:#EFE6D8;padding:clamp(60px,8vw,90px) 0 32px;}
.footer-top{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:2rem;padding-bottom:3rem;border-bottom:1px solid rgba(255,255,255,.12);}
.footer-brand img.wm{height:42px;margin-bottom:1.2rem;}
.footer-brand p{color:#B6A893;max-width:34ch;font-size:.98rem;}
.footer-col h5{font-family:var(--font-display);font-weight:var(--display-weight);font-size:1rem;margin-bottom:1rem;}
.footer-col a{display:block;color:#C9BBA8;font-size:.95rem;padding:.3rem 0;transition:color .2s;}
.footer-col a:hover{color:var(--orange);}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding-top:1.8rem;flex-wrap:wrap;font-size:.85rem;color:#9C8E7C;}
.footer-civet{position:absolute;right:var(--gutter);bottom:0;width:120px;opacity:.9;}

/* Slogans (English, never translated) */
.hero-slogan{
  font-style:italic;font-weight:500;color:var(--terracotta);
  font-size:1.05rem;margin-top:1.6rem;letter-spacing:.01em;
}
html[data-direction="3"] .hero-slogan{color:var(--sage);}
.slogan-line{
  font-style:italic;font-weight:500;color:var(--terracotta);
  font-size:1.1rem;margin-top:1rem;
}
html[data-direction="3"] .slogan-line{color:var(--sage);}

/* Photo placeholder visual (when no .photo-slot) */
.ph{background:
   linear-gradient(135deg, color-mix(in srgb,var(--tan) 60%,var(--paper)), var(--tan-soft));
   position:relative;display:flex;align-items:center;justify-content:center;color:var(--muted);}
.ph[data-label]::after{content:none;}
.photo-slot{display:block;width:100%;height:100%;}

/* Reveal on scroll — only hide when JS is active (progressive enhancement) */
html.js .reveal{opacity:0;transform:translateY(26px);}
html.js .reveal.anim{transition:opacity .8s cubic-bezier(.2,.7,.2,1), transform .8s cubic-bezier(.2,.7,.2,1);}
html.js .reveal.in{opacity:1;transform:none;}
@media (prefers-reduced-motion:reduce){
  html.js .reveal{opacity:1 !important;transform:none !important;}
}

/* ============================================================
   Responsive
   ============================================================ */
@media (max-width:1024px){
  .offer-grid{grid-template-columns:repeat(2,1fr);}
  .hero-grid{grid-template-columns:1fr;}
  .hero-visual{max-width:480px;}
  .hero-civet{width:34%;}
  .about-grid{grid-template-columns:1fr;}
  .recruit{grid-template-columns:1fr;}
  .recruit-visual{display:none;}
  .footer-top{grid-template-columns:1fr 1fr;}
}
@media (max-width:860px){
  .nav-links{display:none;}
  .nav-burger{display:flex;}
  .brunch-grid{grid-template-columns:1fr;}
  .shop-grid{grid-template-columns:repeat(2,1fr);}
  .testi-grid{grid-template-columns:1fr;}
  .contact-grid{grid-template-columns:1fr;}
}
@media (max-width:560px){
  body{font-size:17px;}
  .offer-grid{grid-template-columns:1fr;}
  .shop-grid{grid-template-columns:1fr;}
  .field-row{grid-template-columns:1fr;}
  .footer-top{grid-template-columns:1fr;}
  .hero-civet{width:40%;left:-20px;}
  .footer-civet{display:none;}
}
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms !important;transition-duration:.001ms !important;}
  .reveal{opacity:1;transform:none;}
}

.testi .who{font-size:.85rem;color:var(--muted);font-weight:500;}
.g-ic{width:18px;height:18px;flex:none;}
.testi-more{display:flex;justify-content:center;margin-top:2.2rem;}

/* Candidature (modal) */
.apply-dlg{width:min(1100px,calc(100vw - 32px));max-height:calc(100vh - 32px);padding:0;border:none;border-radius:var(--radius);background:var(--paper);color:var(--ink);box-shadow:0 40px 100px -30px rgba(0,0,0,.5);}
.apply-dlg::backdrop{background:rgba(40,38,20,.55);backdrop-filter:blur(4px);}
.apply-dlg .apply-inner{padding:clamp(24px,4vw,52px);}
.apply-close{position:absolute;top:14px;right:14px;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--paper);display:flex;align-items:center;justify-content:center;color:var(--ink);z-index:2;}
.apply-close:hover{background:var(--orange);color:#fff;border-color:var(--orange);}
html.dlg-open{overflow:hidden;}

.apply-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(28px,5vw,64px);align-items:start;}
.apply-intro p{color:var(--muted);font-size:1.08rem;margin-top:1rem;}
.apply-intro .recruit-note{background:rgba(254,110,39,.12);color:var(--ink);}
.roles{display:flex;flex-wrap:wrap;gap:.5rem;}
.roles label{display:inline-flex;align-items:center;gap:.45rem;padding:.55rem .95rem;border:1px solid var(--line);border-radius:var(--radius-pill);font-size:.92rem;font-weight:500;cursor:pointer;margin:0;}
.roles input{accent-color:var(--orange);width:auto;}
.field label.drop{position:relative;display:flex;align-items:center;gap:.7rem;padding:.6rem .8rem;margin:0;font-weight:400;letter-spacing:0;border:1.5px dashed color-mix(in srgb,var(--ink) 25%,transparent);border-radius:12px;background:var(--paper);cursor:pointer;transition:border-color .2s,background .2s;}
.drop:hover,.drop.over{border-color:var(--orange);background:color-mix(in srgb,var(--orange) 6%,var(--paper));}
.drop input{position:absolute;inset:0;opacity:0;cursor:pointer;}
.drop .ic{width:32px;height:32px;border-radius:10px;background:var(--tan-soft);color:var(--orange);display:flex;align-items:center;justify-content:center;flex:none;}
.drop .ic svg{width:20px;height:20px;}
.drop b{display:block;font-size:.88rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}.drop>span:last-child{min-width:0;}
.drop small{color:var(--muted);font-size:.74rem;}
.drop.has b{color:var(--orange);}
.check{display:flex;gap:.7rem;align-items:flex-start;font-size:.92rem;margin:.4rem 0 1.4rem;}
.check input{width:18px;height:18px;margin-top:.2rem;accent-color:var(--orange);flex:none;}
.req{color:var(--orange);}


@media (max-width:900px){.apply-grid{grid-template-columns:1fr;}}


/* Read-only preview and ordinary photo containers. */
.photo-slot{position:relative;overflow:hidden;}
.photo-slot>img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;}
.photo-slot:not(:has(img)){background:linear-gradient(135deg,var(--tan),var(--tan-soft));}
.preview-notice{position:fixed;z-index:80;bottom:12px;left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100% - 24px);padding:9px 16px;border:1px solid var(--line);border-radius:99px;background:var(--paper);box-shadow:0 3px 18px rgba(0,0,0,.1);font-size:12px;line-height:1.4;text-align:center;pointer-events:none;}
.preview-unavailable{padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--paper);font-size:.9rem;line-height:1.5;}
.preview-unavailable a{text-decoration:underline;text-underline-offset:3px;}
.form .preview-unavailable{margin-bottom:16px;}
.form[aria-disabled="true"] input,.form[aria-disabled="true"] select,.form[aria-disabled="true"] textarea{opacity:.65;cursor:not-allowed;}
.form[aria-disabled="true"] .drop{cursor:not-allowed;}
button:disabled{cursor:not-allowed;}
.btn:disabled,.add:disabled{opacity:.55;transform:none;}
.shop-preview-note{margin-top:1rem;color:var(--muted);font-size:.92rem;}
/* Let contact content shrink and wrap instead of widening its grid track. */
.contact-grid>*{min-width:0;}
.info-item>div{min-width:0;flex:1;}
.info-item a{overflow-wrap:anywhere;}
.hours .row.brunch-note{flex-wrap:wrap;gap:.35rem 1rem;}
.hours .row>span{min-width:0;max-width:100%;overflow-wrap:anywhere;}
@media(max-width:600px){.preview-notice{font-size:10px;padding:8px 12px;}}
/* Keep every header control visible and tappable on narrow phones. */
@media(max-width:600px){
  .nav-inner{gap:8px;padding-left:12px;padding-right:12px;}
  .nav-civet{display:none;}
  .nav-logo{flex:0 0 82px;width:82px;min-height:44px;}
  .nav-logo img{width:100%;height:auto;max-height:44px;object-fit:contain;}
  .nav-right{flex:0 0 auto;gap:6px;}
  .lang-toggle{flex:0 0 auto;}
  .lang-toggle button{min-width:40px;min-height:42px;padding:.4rem .35rem;}
  .nav-right>.btn{min-height:44px;padding:.6rem .65rem!important;font-size:.8rem!important;}
  .nav-burger{flex:0 0 44px;}
}
