:root {
  --cream: #fbf3ea;
  --cream-deep: #f1e1cb;
  --cream-card: #f6eada;
  --ink: #241811;
  --cacao: #2b1b12;
  --cacao-soft: #3b2a1e;
  --gold: #a9793f;
  --gold-deep: #8a6132;
  --gold-light: #d9bd93;
  --hairline: #ddc7a6;
  --berry: #b2555a;
  --text-soft: #5a4b3d;
}

body.site-preview {
  margin: 0;
  background: var(--cream);
  color: var(--ink);
  font-family: "Lora", serif;
  font-size: 17px;
  line-height: 1.7;
}

.preview-banner {
  position: fixed;
  inset: 0 0 auto;
  z-index: 1300;
  min-height: 34px;
  padding: 7px 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  background: var(--ink);
  color: var(--cream);
  font: 600 10px/1.4 "Montserrat", sans-serif;
  letter-spacing: .16em;
  text-align: center;
  text-transform: uppercase;
}

.preview-banner a {
  color: var(--gold-light);
  border-bottom: 1px solid currentColor;
}

.preview-banner-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #cf6b65;
  box-shadow: 0 0 0 4px rgba(207, 107, 101, .17);
}

.preview-site-header { top: 34px; }
.preview-site-header .nav-inner { width: 100%; max-width: 1280px; }
.preview-site-header .brandmark img {
  height: 52px;
  transform: scale(1.34);
  transform-origin: left center;
}
.preview-site-header nav.links { gap: clamp(18px, 2.4vw, 34px); }
.preview-site-header nav.links a[aria-current="page"] { color: var(--ink); }
.preview-site-header nav.links a[aria-current="page"]::after { width: 100%; }

.nav-quote {
  padding: 12px 19px;
  border: 1px solid var(--ink);
  font: 600 10px/1 "Montserrat", sans-serif;
  letter-spacing: .14em;
  text-transform: uppercase;
  transition: background .3s ease, color .3s ease;
}

.nav-quote:hover { background: var(--ink); color: var(--cream); }

.site-preview .mobile-menu { top: 34px; }
.site-preview .mobile-menu a[aria-current="page"] { color: var(--gold-deep); font-style: italic; }

.preview-main { padding-top: 34px; }

.editorial-hero {
  min-height: 100svh;
  padding-top: 178px;
}

.editorial-hero .hero-logo { width: min(390px, 64vw); }
.editorial-hero .lead { max-width: 640px; }

.page-hero {
  min-height: 76svh;
  padding: 184px 32px 92px;
}

.page-hero .eyebrow { display: block; margin-bottom: 24px; }
.page-hero > div,
.editorial-hero > div { width: 100%; min-width: 0; }
.page-hero h1 { max-width: 980px; }
.page-hero .lead { max-width: 670px; }

.hero-mark {
  width: 48px;
  height: 48px;
  margin: 0 auto 24px;
  display: grid;
  place-items: center;
  border: 1px solid var(--hairline);
  border-radius: 50%;
  font-size: 23px;
}

/* Signature introduction — Nos Bars */
.bars-signature-hero {
  position: relative;
  min-height: 700px;
  overflow: hidden;
  background:
    radial-gradient(circle at 83% 26%, rgba(181, 127, 59, .12), transparent 27%),
    linear-gradient(135deg, #fbf3e8 0%, #f8ecdc 56%, #f2ddc3 100%);
  border-bottom: 1px solid var(--hairline);
}

.bars-signature-hero::before {
  content: "";
  position: absolute;
  inset: 22px;
  pointer-events: none;
  border: 1px solid rgba(181, 127, 59, .32);
}

.bars-signature-grid {
  min-height: 700px;
  padding-top: 94px;
  padding-bottom: 74px;
  display: grid;
  grid-template-columns: minmax(0, .88fr) minmax(590px, 1.12fr);
  align-items: center;
  gap: clamp(36px, 5vw, 90px);
}

.bars-signature-copy { position: relative; z-index: 2; }
.bars-signature-copy .eyebrow { display: block; margin-bottom: 18px; color: #9a642c; }
.bars-signature-script {
  display: block;
  margin: 0 0 -4px;
  color: #b17a3e;
  font: 400 clamp(47px, 4.3vw, 72px)/.9 "Mrs Saint Delafield", cursive;
}
.bars-signature-copy h1 {
  max-width: 730px;
  margin: 0;
  font-size: clamp(58px, 5.3vw, 88px);
  line-height: .99;
  letter-spacing: -.035em;
}
.bars-signature-copy p {
  max-width: 660px;
  margin: 28px 0 34px;
  color: #655446;
  font: 400 clamp(17px, 1.25vw, 21px)/1.65 "Lora", serif;
}
.bars-signature-copy .hero-ctas { flex-wrap: nowrap; gap: 16px; }
.bars-signature-copy .btn { min-width: 210px; white-space: nowrap; }
.bars-signature-copy .btn:first-child { color: var(--cream); background: #2f1c13; border-color: #2f1c13; }
.bars-signature-copy .btn-outline { color: #2f1c13; background: rgba(255,255,255,.18); border-color: #7e6049; }

.bars-signature-art {
  position: relative;
  z-index: 1;
  min-width: 0;
  height: 530px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: end;
  gap: 12px;
}

@media (min-width: 1101px) {
  .bars-signature-copy {
    left: clamp(-70px, -4.5vw, -42px);
  }

  .bars-signature-art {
    left: clamp(42px, 4.5vw, 70px);
  }
}
.bars-signature-orbit {
  position: absolute;
  z-index: -1;
  inset: 50% auto auto 50%;
  width: 94%;
  aspect-ratio: 1.82;
  border: 1px solid rgba(154, 100, 44, .24);
  border-radius: 50%;
  transform: translate(-50%, -50%);
}
.bars-signature-orbit.orbit-two { width: 72%; }
.bars-universe {
  position: relative;
  min-width: 0;
  height: 390px;
  padding: 18px 8px 22px;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: flex-end;
  color: #352319;
  text-decoration: none;
  transition: transform .35s ease;
}
.bars-universe:hover { transform: translateY(-8px); }
.bars-universe::before {
  content: "";
  position: absolute;
  inset: 54px 4px 52px;
  z-index: -1;
  border: 1px solid rgba(160, 112, 59, .32);
  border-radius: 48% 48% 8px 8px;
  background: rgba(255, 249, 240, .3);
}
.bars-universe img,
.bars-universe canvas {
  width: 100%;
  height: 265px;
  display: block;
  object-fit: contain;
  filter: drop-shadow(0 18px 16px rgba(59, 32, 17, .16));
}
.bars-universe.universe-pancakes canvas { width: 108%; }
.bars-universe.universe-fraises { height: 445px; }
.bars-universe.universe-fraises canvas { width: 110%; height: 310px; }
.bars-universe strong { margin-top: 4px; font: 500 27px/1.05 "Playfair Display", serif; }
.bars-universe small { margin-top: 7px; color: #927052; font: 500 10px/1.2 "Montserrat", sans-serif; letter-spacing: .16em; text-transform: uppercase; }
.universe-number {
  position: absolute;
  top: 70px;
  left: 20px;
  color: #a8763d;
  font: italic 17px/1 "Lora", serif;
}

@media (max-width: 1100px) {
  .bars-signature-grid { grid-template-columns: minmax(0, .95fr) minmax(460px, 1.05fr); gap: 26px; }
  .bars-signature-copy h1 { font-size: clamp(52px, 6.1vw, 70px); }
  .bars-signature-copy .hero-ctas { flex-wrap: wrap; }
  .bars-signature-art { height: 470px; }
  .bars-universe { height: 350px; }
  .bars-universe.universe-fraises { height: 402px; }
  .bars-universe img, .bars-universe canvas { height: 230px; }
  .bars-universe.universe-fraises canvas { height: 276px; }
}

@media (max-width: 760px) {
  .bars-signature-hero::before { inset: 10px; }
  .bars-signature-grid { min-height: auto; padding: 74px 22px 46px; display: block; }
  .bars-signature-copy { text-align: left; }
  .bars-signature-copy .eyebrow { margin-bottom: 15px; }
  .bars-signature-script { font-size: 48px; }
  .bars-signature-copy h1 { max-width: 520px; font-size: clamp(43px, 13vw, 62px); }
  .bars-signature-copy p { margin: 22px 0 27px; font-size: 16px; line-height: 1.55; }
  .bars-signature-copy .hero-ctas { display: grid; gap: 10px; }
  .bars-signature-copy .btn { width: 100%; min-width: 0; padding-inline: 12px; }
  .bars-signature-art { height: 320px; margin-top: 34px; gap: 2px; }
  .bars-signature-orbit { width: 108%; }
  .bars-universe, .bars-universe.universe-fraises { height: 270px; padding: 12px 2px 14px; }
  .bars-universe::before { inset: 44px 1px 43px; }
  .bars-universe img, .bars-universe canvas,
  .bars-universe.universe-fraises canvas { width: 108%; height: 185px; }
  .bars-universe.universe-fraises { transform: translateY(-18px); }
  .bars-universe.universe-fraises:hover { transform: translateY(-24px); }
  .bars-universe strong { font-size: clamp(17px, 5vw, 22px); }
  .bars-universe small { font-size: 7px; letter-spacing: .09em; text-align: center; }
  .universe-number { top: 56px; left: 9px; font-size: 12px; }
}

/* Le design multipage est désormais le site officiel : aucun décalage d’aperçu. */
body.site-live .preview-site-header,
body.site-live .mobile-menu { top: 0 !important; }
body.site-live .preview-main { padding-top: 0 !important; }

@media (min-width: 761px) {
  .bars-signature-copy .btn { padding-inline: 23px; font-size: 11px; }
  .bars-signature-copy .btn-outline { min-width: 265px; }
}

@media (max-width: 760px) {
  body[data-page="bars"] .bars-signature-grid {
    width: calc(100% - 20px);
    margin-inline: auto;
    padding-inline: 10px;
  }
  body[data-page="bars"] .bars-signature-copy,
  body[data-page="bars"] .bars-signature-copy p { max-width: 100%; }
  body[data-page="bars"] .bars-signature-art {
    width: calc(100% - 12px);
    margin-inline: auto;
  }
  body[data-page="bars"] .bars-universe img,
  body[data-page="bars"] .bars-universe canvas,
  body[data-page="bars"] .bars-universe.universe-fraises canvas { width: 100%; }
  body[data-page="bars"] .bars-universe strong { font-size: clamp(16px, 4.5vw, 20px); }
}

.section-intro {
  max-width: 770px;
  margin: 0 auto 66px;
  text-align: center;
}

.section-intro .eyebrow { display: block; margin-bottom: 14px; }
.section-intro h2 { margin-bottom: 18px; font-size: clamp(31px, 4vw, 50px); line-height: 1.12; }
.section-intro p { color: var(--text-soft); }

.bars-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
}

.bar-card {
  position: relative;
  min-height: 380px;
  padding: 48px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border: 1px solid var(--hairline);
  background: var(--cream-card);
  transition: transform .45s ease, background .45s ease, box-shadow .45s ease;
}

.bar-card:hover {
  transform: translateY(-7px);
  background: var(--cream-deep);
  box-shadow: 0 24px 60px -46px rgba(43, 27, 18, .85);
}

.bar-card.dark { background: var(--cacao); color: var(--cream); border-color: var(--cacao); }
.bar-card.dark h3 { color: var(--cream); }
.bar-card.dark p { color: #d8c7b3; }
.bar-card .bar-number { color: var(--gold-deep); font: italic 16px "Playfair Display", serif; }
.bar-card.dark .bar-number { color: var(--gold-light); }
.bar-card h3 { margin: 20px 0 12px; font-size: clamp(29px, 3vw, 42px); }
.bar-card p { max-width: 510px; color: var(--text-soft); font-size: 15px; }
.bar-card .bar-link { margin-top: 34px; font: 600 10px "Montserrat", sans-serif; letter-spacing: .18em; text-transform: uppercase; }
.bar-card .bar-link span { display: inline-block; margin-left: 10px; transition: transform .3s ease; }
.bar-card:hover .bar-link span { transform: translateX(6px); }

.soon-tag {
  position: absolute;
  top: 28px;
  right: 28px;
  padding: 7px 12px;
  border: 1px solid currentColor;
  color: var(--gold-deep);
  font: 600 9px "Montserrat", sans-serif;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.card-orbit {
  position: absolute;
  width: 240px;
  height: 240px;
  right: -90px;
  bottom: -100px;
  border: 1px solid rgba(169, 121, 63, .24);
  border-radius: 50%;
}

.card-orbit::after {
  content: "";
  position: absolute;
  inset: 24px;
  border: 1px solid rgba(169, 121, 63, .17);
  border-radius: inherit;
}

.story-lead {
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  gap: clamp(44px, 8vw, 100px);
  align-items: start;
}

.story-lead h2 { font-size: clamp(34px, 4.5vw, 56px); line-height: 1.09; }
.story-copy p { margin-bottom: 20px; color: var(--text-soft); }
.story-copy p:first-child { color: var(--ink); font-size: 19px; }

.split-teaser {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 500px;
  border: 1px solid var(--hairline);
}

.teaser-copy {
  padding: clamp(48px, 7vw, 90px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: var(--cream-card);
}

.teaser-copy h2 { margin: 18px 0; font-size: clamp(33px, 4vw, 52px); line-height: 1.08; }
.teaser-copy p { margin-bottom: 32px; color: var(--text-soft); }

.teaser-visual {
  position: relative;
  overflow: hidden;
  display: grid;
  place-items: center;
  background: var(--cacao);
}

.teaser-visual::before,
.teaser-visual::after {
  content: "";
  position: absolute;
  border: 1px solid rgba(217, 189, 147, .2);
  border-radius: 50%;
}

.teaser-visual::before { width: 390px; height: 390px; }
.teaser-visual::after { width: 270px; height: 270px; }
.teaser-symbol { position: relative; z-index: 1; color: var(--cream); font: 112px/1 "Mrs Saint Delafield", cursive; }

.promise-strip {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-block: 1px solid var(--hairline);
}

.promise-item { padding: 37px 30px; text-align: center; border-right: 1px solid var(--hairline); }
.promise-item:last-child { border-right: 0; }
.promise-item strong { display: block; margin-bottom: 5px; font: 600 14px "Playfair Display", serif; }
.promise-item span { color: var(--text-soft); font-size: 13px; }

.formula-cta { margin-top: auto; }

.experience-note {
  margin-top: 48px;
  padding: 26px 32px;
  border-left: 2px solid var(--gold);
  background: var(--cream-card);
  color: var(--text-soft);
  font-size: 15px;
}

.pancake-showcase {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(90px, 10vw, 150px) 0;
  color: var(--cream);
  background:
    radial-gradient(circle at 76% 42%, rgba(169, 121, 63, .2), transparent 28%),
    var(--cacao);
}

.pancake-showcase::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: .22;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.18'/%3E%3C/svg%3E");
  pointer-events: none;
}

.pancake-stage {
  display: grid;
  grid-template-columns: .78fr 1.22fr;
  gap: clamp(54px, 7vw, 105px);
  align-items: center;
}

.pancake-stage-copy .eyebrow { display: block; margin-bottom: 19px; color: var(--gold-light); }
.pancake-stage-copy .script { display: block; margin-bottom: -9px; color: #ddb99b; font-size: clamp(37px, 4vw, 55px); line-height: 1; }
.pancake-stage-copy h2 { margin-bottom: 25px; color: var(--cream); font-size: clamp(36px, 4.6vw, 60px); line-height: 1.05; }
.pancake-stage-copy > p { margin-bottom: 34px; color: #d8c7b3; font-size: 16px; }

.pancake-details { margin-bottom: 38px; border-block: 1px solid rgba(217, 189, 147, .22); }
.pancake-details div { display: grid; grid-template-columns: 38px 1fr; gap: 15px; padding: 14px 0; border-bottom: 1px solid rgba(217, 189, 147, .14); }
.pancake-details div:last-child { border-bottom: 0; }
.pancake-details span { color: var(--gold-light); font: italic 13px "Playfair Display", serif; }
.pancake-details strong { color: var(--cream); font: 500 12px "Montserrat", sans-serif; letter-spacing: .11em; text-transform: uppercase; }

.pancake-stage-visual {
  position: relative;
  min-height: 810px;
  display: grid;
  place-items: end center;
  border: 1px solid rgba(217, 189, 147, .2);
  border-radius: 320px 320px 12px 12px;
  background: linear-gradient(180deg, rgba(251, 243, 234, .055), rgba(251, 243, 234, .015));
}

.pancake-stage-visual::before {
  content: "";
  position: absolute;
  inset: 13px;
  border: 1px solid rgba(217, 189, 147, .13);
  border-radius: inherit;
}

.pancake-visual-index {
  position: absolute;
  top: 32px;
  left: 50%;
  z-index: 5;
  padding: 6px 12px;
  color: rgba(251, 243, 234, .76);
  background: rgba(38, 22, 15, .72);
  border-radius: 999px;
  font: 600 9px "Montserrat", sans-serif;
  letter-spacing: .24em;
  text-transform: uppercase;
  transform: translateX(-50%);
  white-space: nowrap;
}

.pancake-bar-canvas {
  position: relative;
  z-index: 2;
  width: min(108%, 760px);
  height: auto;
  opacity: 0;
  filter: drop-shadow(0 30px 30px rgba(12, 6, 3, .34));
  transform: translateY(8px);
  transition: opacity .6s ease, transform .8s cubic-bezier(.2, .8, .2, 1);
}

.pancake-bar-canvas.is-ready { opacity: 1; transform: translateY(0); }
.pancake-stage-shadow { position: absolute; z-index: 1; right: 18%; bottom: 18px; left: 18%; height: 28px; border-radius: 50%; background: rgba(10, 5, 3, .42); filter: blur(20px); }

.pancake-bar-assembly {
  position: relative;
  z-index: 2;
  width: min(108%, 760px);
  aspect-ratio: 1086 / 1450;
}

.pancake-callout {
  position: absolute;
  z-index: 4;
  padding: 7px 9px;
  color: rgba(251, 243, 234, .65);
  background: rgba(38, 22, 15, .78);
  font: 600 9px/1.45 "Montserrat", sans-serif;
  letter-spacing: .15em;
  text-transform: uppercase;
}
.pancake-callout::before {
  content: "";
  position: absolute;
  top: calc(50% - 2px);
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: currentColor;
}
.pancake-callout::after { content: ""; position: absolute; top: 50%; width: 96px; height: 1px; background: currentColor; opacity: .58; }
.pancake-callout-top { top: 17%; right: -24%; }
.pancake-callout-top::after { right: calc(100% + 10px); }
.pancake-callout-top::before { right: calc(100% + 104px); }
.pancake-callout-bottom { top: 58%; bottom: auto; left: -24%; text-align: right; }
.pancake-callout-bottom::after { left: calc(100% + 10px); }
.pancake-callout-bottom::before { left: calc(100% + 104px); }

.site-preview .fraises-collection {
  --ivory: #f7efe5;
  --ink: #21140f;
  --muted: #9d8c7d;
  --berry: #c84645;
  --nutella: #3a1d16;
  --caramel: #ba7040;
  --pistachio: #75824d;
  --serif: "Italiana", "Times New Roman", serif;
  --sans: "DM Sans", Arial, sans-serif;
  --script: "Mrs Saint Delafield", cursive;
  color: var(--ivory);
  font-family: var(--sans);
  min-height: auto;
}

.site-preview .fraises-collection .collection-heading h1 { color: var(--ivory); }
.site-preview .fraises-collection .recipe-copy h2 { color: var(--card-fg); }
.site-preview .fraises-collection .collection-action strong { color: var(--ivory); }

.principle-card {
  max-width: 880px;
  margin: 0 auto;
  padding: 60px 44px;
  text-align: center;
  border: 1px solid var(--hairline);
  background: var(--cream-card);
}

.principle-card .script { display: block; color: var(--gold-deep); font-size: 36px; }
.principle-card h2 { margin: 2px 0 20px; font-size: clamp(32px, 4vw, 50px); }
.principle-equation { display: flex; justify-content: center; gap: 16px; flex-wrap: wrap; margin-top: 30px; }
.principle-equation span { padding: 13px 21px; border: 1px solid var(--hairline); font: 600 11px "Montserrat", sans-serif; letter-spacing: .13em; text-transform: uppercase; }
.principle-equation i { align-self: center; color: var(--gold-deep); font-style: normal; }

.cta-band {
  padding: 86px 0;
  color: var(--cream);
  background: var(--cacao);
  text-align: center;
}

.cta-band h2 { max-width: 750px; margin: 0 auto 18px; color: var(--cream); font-size: clamp(30px, 4vw, 48px); }
.cta-band p { max-width: 600px; margin: 0 auto 32px; color: #d8c7b3; }

.faq-categories {
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 70px;
  align-items: start;
}

.faq-aside { position: sticky; top: 145px; }
.faq-aside h2 { margin: 13px 0 18px; font-size: 36px; }
.faq-aside p { color: var(--text-soft); font-size: 14px; }

.devis-intro {
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  gap: 60px;
  margin-bottom: 70px;
  align-items: end;
}

.devis-intro h1 { margin-top: 14px; color: var(--cream); font-size: clamp(40px, 5vw, 64px); line-height: 1.05; }
.devis-intro p { color: #d8c7b3; }
.devis-page { min-height: 100vh; padding-top: 190px; }

.contact-service-picker {
  max-width: 1120px;
  margin: 0 auto 64px;
  padding: 30px;
  border: 1px solid rgba(217, 189, 147, .26);
  background: rgba(255, 255, 255, .025);
}

.contact-service-head {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 44px;
  align-items: end;
  margin-bottom: 24px;
}

.contact-service-head h2 {
  margin-top: 8px;
  color: var(--cream);
  font-size: clamp(26px, 3vw, 38px);
  line-height: 1.1;
}

.contact-service-head p { color: #c8b49b; font-size: 13.5px; }

.contact-service-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.contact-service-choice {
  min-width: 0;
  padding: 20px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 14px;
  align-items: start;
  color: var(--cream);
  background: rgba(251, 243, 234, .035);
  border: 1px solid rgba(217, 189, 147, .2);
  text-align: left;
  cursor: pointer;
  transition: border-color .25s ease, background .25s ease, transform .25s ease;
}

.contact-service-choice:hover,
.contact-service-choice.is-selected {
  border-color: var(--gold-light);
  background: rgba(217, 189, 147, .11);
  transform: translateY(-2px);
}

.contact-service-choice.is-selected { box-shadow: inset 0 -2px 0 var(--gold); }
.contact-service-choice .service-icon { font-size: 20px; line-height: 1; }
.contact-service-choice small,
.contact-service-choice strong,
.contact-service-choice em { display: block; }
.contact-service-choice small {
  margin-bottom: 7px;
  color: var(--gold-light);
  font: 600 7px/1.35 "Montserrat", sans-serif;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.contact-service-choice strong { margin-bottom: 7px; font: 500 18px/1.15 "Playfair Display", serif; }
.contact-service-choice em { color: #c8b49b; font-size: 11px; line-height: 1.45; font-style: normal; }
.contact-service-choice > i { color: var(--gold-light); font-style: normal; }

.contact-direct {
  margin-top: 18px;
  padding-top: 17px;
  display: flex;
  justify-content: flex-end;
  gap: 23px;
  border-top: 1px solid rgba(217, 189, 147, .17);
  color: #9f8d77;
  font: 600 9px "Montserrat", sans-serif;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.contact-direct a { color: var(--gold-light); border-bottom: 1px solid rgba(217, 189, 147, .36); }

.selection-recap {
  display: none;
  grid-column: 1 / -1;
  padding: 18px 20px;
  border: 1px solid rgba(217, 189, 147, .35);
  color: var(--gold-light);
  font-size: 14px;
}
.selection-recap.is-visible { display: block; }

.preview-footer .foot-brand img { height: 54px; }
.preview-footer .foot-brand p { max-width: 360px; }

/* Accueil reproduit depuis l’artifact de référence, jusqu’à la page Pancakes. */
.home-exact .preview-site-header .nav-inner { max-width: 1180px; }
.home-exact .preview-site-header .brandmark img { height: 34px; }
.home-exact .preview-site-header .nav-cta { padding: 17px 34px; }
.home-exact .bars-grid { grid-template-columns: repeat(2, 1fr); gap: 28px; }
.home-exact .bar-card {
  min-height: 280px;
  padding: 50px 40px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 18px;
  border: 1px solid var(--hairline);
  background: var(--cream-card);
  box-shadow: none;
}
.home-exact .bar-card:not(.is-soon):hover {
  transform: translateY(-6px);
  background: var(--cream-card);
  box-shadow: 0 30px 50px -25px rgba(43, 27, 18, .25);
}
.home-exact .bar-card .glyph { font-size: 34px; line-height: 1; }
.home-exact .bar-card h3 { margin: 0; font-size: 26px; }
.home-exact .bar-card p { max-width: none; flex: 1; color: var(--text-soft); font-size: 15px; }
.home-exact .bar-card .btn { align-self: flex-start; margin-top: 0; }
.home-exact .bar-card.is-soon { background: transparent; border-style: dashed; }
.home-exact .bar-card.is-soon:hover { transform: none; background: transparent; box-shadow: none; }
.home-exact .bar-card.is-soon h3,
.home-exact .bar-card.is-soon p { opacity: .6; }
.home-exact .soon-tag {
  top: 24px;
  right: 24px;
  padding: 5px 12px;
  color: var(--gold-deep);
  border: 1px solid var(--gold-light);
  font-size: 10px;
  letter-spacing: .18em;
}

@media (max-width: 999px) {
  .preview-site-header .brandmark img { height: 40px; }
  .preview-main { padding-top: 34px; }
}

@media (max-width: 820px) {
  .bars-grid,
  .story-lead,
  .split-teaser,
  .faq-categories,
  .devis-intro { grid-template-columns: 1fr; }
  .faq-aside { position: static; }
  .promise-strip { grid-template-columns: 1fr; }
  .promise-item { border-right: 0; border-bottom: 1px solid var(--hairline); }
  .promise-item:last-child { border-bottom: 0; }
  .teaser-visual { min-height: 360px; }
  .pancake-stage { grid-template-columns: 1fr; }
  .pancake-stage-copy { max-width: 650px; }
  .pancake-stage-visual { min-height: 760px; }
}

@media (max-width: 860px) {
  .home-exact .bars-grid { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  .preview-banner { min-height: 32px; padding-inline: 13px; font-size: 8px; letter-spacing: .1em; }
  .preview-banner a { display: none; }
  .preview-site-header { top: 32px; }
  .site-preview .mobile-menu { top: 32px; }
  .preview-main { padding-top: 32px; }
  .editorial-hero,
  .page-hero { min-height: 90svh; padding-top: 148px; }
  .page-hero h1 { width: 100%; overflow-wrap: anywhere; }
  .page-hero .hero-mark { margin-bottom: 19px; }
  .bar-card { min-height: 330px; padding: 38px 28px; }
  .story-lead { gap: 30px; }
  .principle-card { padding: 48px 24px; }
  .devis-page { padding-top: 148px; }
  .devis-intro { gap: 22px; margin-bottom: 48px; }
  .home-exact .bar-card { padding: 42px 30px; }
  .pancake-showcase { padding-block: 80px; }
  .pancake-stage { gap: 54px; }
  .pancake-stage-visual { min-height: 610px; border-radius: 52vw 52vw 12px 12px; }
  .pancake-callout { display: none; }
  .pancake-visual-index { top: 48px; }
}

@media (min-width: 761px) and (max-width: 1100px) {
  .site-preview .contact-service-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Couleurs de service : chaque univers garde une identité immédiatement reconnaissable. */
body[data-page="pancakes"] {
  --service-deep: #3b2115;
  --service-main: #a86432;
  --service-soft: #eed4ad;
  --service-pale: #f3e1c7;
}

body[data-page="pancakes"] .page-hero {
  isolation: isolate;
  overflow: hidden;
  color: var(--cream);
  background:
    radial-gradient(circle at 22% 25%, rgba(226, 164, 92, .34), transparent 28%),
    radial-gradient(circle at 82% 72%, rgba(151, 82, 42, .42), transparent 32%),
    linear-gradient(135deg, #5a2d19 0%, #2d190f 62%, #20110b 100%);
}

body[data-page="pancakes"] .page-hero::before { border-color: rgba(242, 206, 155, .34); }
body[data-page="pancakes"] .page-hero h1 { color: var(--cream); }
body[data-page="pancakes"] .page-hero .eyebrow { color: #efca91; }
body[data-page="pancakes"] .page-hero .lead { color: #e2cbb1; }
body[data-page="pancakes"] .page-hero .hero-mark { border-color: rgba(239, 202, 145, .48); background: rgba(255,255,255,.045); }
body[data-page="pancakes"] .page-hero .btn:not(.btn-outline) { color: #382015; background: #f5dfbd; border-color: #f5dfbd; }
body[data-page="pancakes"] .page-hero .btn-outline { color: var(--cream); border-color: rgba(255,255,255,.55); }
body[data-page="pancakes"] .pancake-showcase {
  background:
    radial-gradient(circle at 76% 42%, rgba(199, 119, 57, .32), transparent 30%),
    linear-gradient(135deg, #2d170e, #4a2818 55%, #21120c);
}
body[data-page="pancakes"] .pancake-showcase + section.pad { background: #f4e4ce; }
body[data-page="pancakes"] .pancake-showcase + section.pad .prest-grid { background: #d8b98e; border-color: #d8b98e; }
body[data-page="pancakes"] .pancake-showcase + section.pad .prest-card { background: #fbf0df; }
body[data-page="pancakes"] .composer { background: linear-gradient(135deg, #efd4ac, #f7e8d2); }
body[data-page="pancakes"] .composer .pill { background: #fff8ec; border-color: #d7b17c; }
body[data-page="pancakes"] .composer .pill.active { color: #fff7ea; background: var(--service-deep); border-color: var(--service-deep); }
body[data-page="pancakes"] .composer .carte { background: #fff9ef; border-color: #c78c4a; }
body[data-page="pancakes"] #formules { background: #f8eddd; }
body[data-page="pancakes"] #formules .fcard { border-color: #d9bc93; background: #fff9ef; }
body[data-page="pancakes"] #formules .fcard.highlight { color: var(--cream); background: linear-gradient(160deg, #4b2818, #28150d); border-color: #4b2818; }
body[data-page="pancakes"] #formules + section.pad { background: #f1dcc0 !important; }
body[data-page="pancakes"] .cta-band { background: linear-gradient(120deg, #31190f, #5a2e1b); }

body[data-page="fraises"] {
  --service-deep: #5a2029;
  --service-main: #b84955;
  --service-soft: #edbec0;
  --service-pale: #f5dddd;
}

body[data-page="fraises"] .page-hero {
  isolation: isolate;
  overflow: hidden;
  color: var(--cream);
  background:
    radial-gradient(circle at 20% 30%, rgba(233, 128, 133, .3), transparent 27%),
    radial-gradient(circle at 82% 70%, rgba(126, 137, 77, .22), transparent 31%),
    linear-gradient(135deg, #752d38 0%, #471b24 58%, #291218 100%);
}

body[data-page="fraises"] .page-hero::before { border-color: rgba(250, 205, 202, .34); }
body[data-page="fraises"] .page-hero h1 { color: var(--cream); }
body[data-page="fraises"] .page-hero .eyebrow { color: #f2c3c1; }
body[data-page="fraises"] .page-hero .lead { color: #efd8d6; }
body[data-page="fraises"] .page-hero .hero-mark { border-color: rgba(242, 195, 193, .5); background: rgba(255,255,255,.05); }
body[data-page="fraises"] .page-hero .btn:not(.btn-outline) { color: #542029; background: #f7dfdc; border-color: #f7dfdc; }
body[data-page="fraises"] .page-hero .btn-outline { color: var(--cream); border-color: rgba(255,255,255,.55); }
body[data-page="fraises"] .page-hero + section.pad { background: linear-gradient(135deg, #f5dddd, #faeee7); }
body[data-page="fraises"] .page-hero + section.pad .principle-card { background: #fff6ef; border-color: #deb8b3; }
body[data-page="fraises"] .page-hero + section.pad .principle-equation span { background: #fae7e2; border-color: #dbb3ae; }
body[data-page="fraises"] .composer { background: linear-gradient(135deg, #efcfd0, #f8e4de); }
body[data-page="fraises"] .composer .pill { background: #fff7f1; border-color: #d8a9a8; }
body[data-page="fraises"] .composer .pill.active { color: #fff7f1; background: var(--service-deep); border-color: var(--service-deep); }
body[data-page="fraises"] .composer .carte { background: #fff8f2; border-color: #c9787d; }
body[data-page="fraises"] #formules { background: #f4e7dc; }
body[data-page="fraises"] #formules .fcard { border-color: #d9b9ad; background: #fff8f1; }
body[data-page="fraises"] #formules .fcard.highlight { color: var(--cream); background: linear-gradient(160deg, #732d38, #421922); border-color: #732d38; }
body[data-page="fraises"] #formules + section.pad { background: #e5e1cf !important; }
body[data-page="fraises"] .cta-band { background: linear-gradient(120deg, #481a23, #7c303b); }

@media (max-width: 760px) {
  body[data-page="pancakes"] .page-hero,
  body[data-page="fraises"] .page-hero { background-position: center; }
}

/* Accueil : reprise de la collection éditoriale de la page Nos Bars. */
.home-exact .home-bars-editorial { gap: 20px; }
.home-exact .home-bars-editorial .bar-card {
  min-height: 380px;
  padding: 48px;
  justify-content: space-between;
  gap: 0;
  background: var(--cream-card);
}
.home-exact .home-bars-editorial .bar-card.dark { background: var(--cacao); }
.home-exact .home-bars-editorial .bar-card:not(.is-soon):hover { background: var(--cream-deep); }
.home-exact .home-bars-editorial .bar-card.dark:hover { background: #25150f; }
.home-exact .home-bars-editorial .bar-card.is-soon { background: var(--cream-card); border-style: solid; }
.home-exact .home-bars-editorial .bar-card.is-soon:hover { background: var(--cream-card); }
.home-exact .home-bars-editorial .bar-card-meta {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding-right: 0;
}
.home-exact .home-bars-editorial .service-glyph {
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border: 1px solid var(--hairline);
  border-radius: 50%;
  background: rgba(255, 255, 255, .28);
  font-size: 21px;
  line-height: 1;
}
.home-exact .home-bars-editorial .bar-card.dark .service-glyph {
  border-color: rgba(255, 255, 255, .2);
  background: rgba(255, 255, 255, .06);
}
.home-exact .home-bars-editorial .bar-card h3 {
  margin: 20px 0 12px;
  font-size: clamp(29px, 3vw, 42px);
}
.home-exact .home-bars-editorial .bar-card p {
  max-width: 510px;
  color: var(--text-soft);
  font-size: 15px;
}
.home-exact .home-bars-editorial .bar-card.dark p { color: #d8c7b3; }
.home-exact .home-bars-editorial .soon-tag { top: 18px; right: 18px; }
.home-exact .home-bars-editorial .bar-card.is-soon .bar-card-meta { padding-right: 66px; }

@media (min-width: 1200px) {
  .home-exact .home-bars-editorial .bar-card {
    min-height: 350px;
    padding: 38px 28px;
  }
  .home-exact .home-bars-editorial .bar-card h3 { font-size: clamp(27px, 2.25vw, 36px); }
  .home-exact .home-bars-editorial .bar-card p { font-size: 14px; }
  .home-exact .home-bars-editorial .service-glyph {
    flex-basis: 38px;
    width: 38px;
    height: 38px;
    font-size: 19px;
  }
}

@media (max-width: 760px) {
  .home-exact .home-bars-editorial .bar-card {
    min-height: 330px;
    padding: 32px 24px;
  }
  .home-exact .home-bars-editorial .bar-card h3 { font-size: 29px; }
  .home-exact .home-bars-editorial .bar-card p { font-size: 13px; }
  .home-exact .home-bars-editorial .bar-card-meta { align-items: flex-start; }
  .home-exact .home-bars-editorial .bar-card.is-soon .bar-card-meta { padding-right: 58px; }
}

@media (max-width: 540px) {
  .bars-grid { grid-template-columns: 1fr; }
  .teaser-copy { padding: 48px 28px; }
  .teaser-visual { min-height: 300px; }
  .principle-equation { flex-direction: column; align-items: stretch; }
  .principle-equation i { transform: rotate(90deg); }
  .pancake-stage-visual { min-height: 520px; }
  .pancake-visual-index { top: 22px; font-size: 8px; }
  .pancake-bar-canvas { width: 112%; }
}

/* Harmonisation téléphone de l’ensemble de l’aperçu multipage. */
@media (max-width: 760px) {
  html { scroll-padding-top: 104px; }

  body.site-preview {
    width: 100%;
    min-width: 0;
    font-size: 16px;
    line-height: 1.65;
    overflow-wrap: break-word;
  }

  .site-preview .container { width: 100%; padding-inline: 20px; }

  .preview-banner {
    min-height: 32px;
    gap: 9px;
    padding: 6px 12px;
    font-size: 7.5px;
    letter-spacing: .09em;
    line-height: 1.3;
    white-space: nowrap;
  }

  .preview-banner-dot { flex: 0 0 6px; }

  .preview-site-header .nav-inner {
    min-height: 64px;
    padding: 10px 20px;
  }

  .preview-site-header .brandmark,
  .preview-site-header .brandmark img,
  .home-exact .preview-site-header .brandmark img {
    width: auto;
    max-width: 112px;
    height: 34px;
  }

  .preview-site-header .brandmark img,
  .home-exact .preview-site-header .brandmark img { transform: scale(1.42); }

  .site-preview .burger {
    width: 44px;
    height: 44px;
    padding: 9px 0 9px 12px;
    align-items: flex-end;
    justify-content: center;
  }

  .site-preview .mobile-menu {
    inset: 32px 0 0;
    min-height: 0;
    gap: 15px;
    padding: calc(72px + env(safe-area-inset-top)) 22px calc(28px + env(safe-area-inset-bottom));
  }

  .site-preview .mobile-menu a {
    width: min(100%, 310px);
    padding: 5px 12px;
    font-size: clamp(22px, 7vw, 28px);
    line-height: 1.15;
    text-align: center;
  }

  .site-preview .mobile-close {
    top: calc(16px + env(safe-area-inset-top));
    right: 20px;
    width: 44px;
    height: 44px;
  }

  .preview-main { width: 100%; min-width: 0; }

  .site-preview .hero,
  .site-preview .page-hero,
  .site-preview .editorial-hero {
    min-height: calc(100svh - 32px);
    padding: 128px 20px 72px;
  }

  .site-preview .hero::before { inset: 10px; }
  .site-preview .hero-logo {
    width: min(260px, 72vw);
    margin-bottom: 28px;
  }

  .site-preview .hero h1,
  .site-preview .page-hero h1 {
    max-width: 100%;
    margin-bottom: 20px;
    font-size: clamp(33px, 9.3vw, 43px);
    line-height: 1.08;
    overflow-wrap: normal;
  }

  .site-preview .hero p.lead {
    max-width: 36ch;
    margin-bottom: 32px;
    font-size: 16px;
    line-height: 1.58;
  }

  .site-preview .hero-ctas {
    width: min(100%, 360px);
    gap: 12px;
  }

  .site-preview .btn {
    min-height: 52px;
    padding: 14px 18px;
    justify-content: center;
    font-size: 11px;
    letter-spacing: .11em;
    line-height: 1.45;
    white-space: normal;
    overflow-wrap: anywhere;
    text-align: center;
  }

  .site-preview .pad { padding-block: 72px; }

  .site-preview .section-intro,
  .site-preview .sec-head { margin-bottom: 42px; }

  .site-preview .section-intro h2,
  .site-preview .sec-head h2 {
    margin-bottom: 15px;
    font-size: clamp(29px, 8.6vw, 38px);
    line-height: 1.12;
  }

  .site-preview .section-intro p,
  .site-preview .sec-head p { font-size: 15.5px; }

  .site-preview .bars-grid { gap: 14px; }

  .site-preview .bar-card,
  .home-exact .bar-card {
    min-height: 0;
    padding: 32px 24px;
  }

  .site-preview .bar-card h3 { font-size: 29px; }
  .home-exact .bar-card h3 { font-size: 26px; }
  .home-exact .bar-card .btn { width: 100%; align-self: stretch; }
  .home-exact .soon-tag { top: 18px; right: 18px; }

  .site-preview .story-lead h2 { font-size: clamp(31px, 8.7vw, 40px); }
  .site-preview .story-copy p:first-child { font-size: 17px; }

  .site-preview .value-cell { padding: 27px 20px; }
  .site-preview .premium-band { padding-block: 72px; }
  .site-preview .premium-band h2 { font-size: 28px; }

  .site-preview .split-teaser { min-height: 0; }
  .site-preview .teaser-copy { padding: 44px 24px; }
  .site-preview .teaser-copy h2 { font-size: 34px; }
  .site-preview .teaser-visual { min-height: 280px; }
  .site-preview .promise-item { padding: 28px 20px; }

  .site-preview .principle-card { padding: 42px 20px; }
  .site-preview .principle-card .script { font-size: 32px; }
  .site-preview .principle-card h2 { font-size: 31px; }

  .site-preview .prest-grid { grid-template-columns: 1fr; }
  .site-preview .prest-card { min-height: 0; padding: 30px 24px; }

  .site-preview .composer-grid { gap: 36px; }
  .site-preview .step { margin-bottom: 36px; }
  .site-preview .step-label { align-items: flex-start; }
  .site-preview .pill { padding: 10px 13px; font-size: 11px; }
  .site-preview .carte { padding: 34px 22px; }

  .site-preview .formule-grid { gap: 18px; }
  .site-preview .fcard { padding: 32px 22px; }
  .site-preview .fcard .price { font-size: 14px; }
  .site-preview .options-wrap { margin-top: 58px; }
  .site-preview .opt-row { grid-template-columns: 1fr; gap: 8px; padding: 18px 20px; }
  .site-preview .opt-row .price { white-space: normal; }

  .site-preview .faq-categories { gap: 36px; }
  .site-preview .faq-aside h2 { font-size: 31px; }
  .site-preview .faq-q { padding-block: 20px; font-size: 17px; }

  .site-preview .cta-band { padding-block: 68px; }
  .site-preview .cta-band .btn { width: min(100%, 350px); }

  .site-preview .devis-page {
    min-height: 0;
    padding: 132px 0 76px;
  }

  .site-preview .devis-intro h1 {
    font-size: clamp(37px, 10.5vw, 48px);
    overflow-wrap: normal;
  }

  .site-preview .devis-intro p { font-size: 15.5px; }
  .site-preview form.devis-form { width: 100%; gap: 20px; }
  .site-preview form.devis-form { grid-template-columns: minmax(0, 1fr); }
  .site-preview .field,
  .site-preview .field input,
  .site-preview .field select,
  .site-preview .field textarea { width: 100%; min-width: 0; max-width: 100%; }
  .site-preview .selection-recap { overflow-wrap: anywhere; }
  .site-preview .devis-submit .btn { width: 100%; }

  .site-preview .pancake-showcase { padding-block: 66px; }
  .site-preview .pancake-stage { gap: 40px; }
  .site-preview .pancake-stage-copy .script { margin-bottom: -4px; font-size: 35px; }
  .site-preview .pancake-stage-copy h2 { font-size: clamp(34px, 9.3vw, 42px); }
  .site-preview .pancake-stage-copy > p { font-size: 15px; }
  .site-preview .pancake-details { margin-bottom: 30px; }
  .site-preview .pancake-details strong { font-size: 10px; letter-spacing: .09em; }
  .site-preview .pancake-stage-copy .btn { width: 100%; }
  .site-preview .pancake-stage-visual {
    width: 100%;
    min-height: 490px;
    border-radius: min(46vw, 180px) min(46vw, 180px) 12px 12px;
  }
  .site-preview .pancake-bar-canvas { width: 100%; max-width: 430px; }
  .site-preview .pancake-visual-index { top: 16px; max-width: calc(100% - 28px); font-size: 7px; }

  .site-preview .preview-footer { padding: 58px 0 26px; }
  .site-preview .preview-footer .foot-grid { gap: 30px; margin-bottom: 38px; }
  .site-preview .preview-footer .foot-brand img { height: 44px; }
  .site-preview .preview-footer a { overflow-wrap: anywhere; }
  .site-preview .preview-footer .foot-bottom { gap: 8px; }

  .site-preview .fraises-collection { padding: 66px 0 52px; }
  .site-preview .collection-shell { width: min(calc(100% - 32px), 540px); }
  .site-preview .collection-heading { gap: 27px; margin-bottom: 40px; }
  .site-preview .collection-heading h1 {
    font-size: clamp(44px, 14vw, 58px);
    line-height: .9;
  }
  .site-preview .collection-heading h1 em {
    display: block;
    font-size: .9em;
    line-height: 1;
    white-space: normal;
  }
  .site-preview .heading-note p { font-size: 16px; }
  .site-preview .recipe-deck { gap: 13px; }
  .site-preview .recipe-card,
  .site-preview .recipe-card.is-active {
    min-height: 560px;
    padding: 22px 20px 24px;
    border-radius: min(46vw, 170px) min(46vw, 170px) 18px 18px;
  }
  .site-preview .card-topline { top: 48px; left: 38px; right: 38px; }
  .site-preview .recipe-artwork { height: 310px; margin-inline: -18px; }
  .site-preview .recipe-canvas { width: min(112%, 390px); max-height: 355px; }
  .site-preview .recipe-copy { min-height: 145px; }
  .site-preview .recipe-copy h2 { font-size: 33px; }
  .site-preview .recipe-card:not(.is-active) { min-height: 176px; }
  .site-preview .recipe-card:not(.is-active) .card-topline {
    top: 40px;
    left: clamp(54px, 16vw, 64px);
    right: clamp(54px, 16vw, 64px);
  }
  .site-preview .recipe-card:not(.is-active) .recipe-number { font-size: 15px; }
  .site-preview .recipe-card:not(.is-active) .recipe-mood { font-size: 7px; letter-spacing: .13em; }
  .site-preview .recipe-card:not(.is-active) .recipe-copy { margin-top: 78px; }
  .site-preview .recipe-card:not(.is-active) .recipe-copy h2 { font-size: 25px; }
  .site-preview .collection-action { margin-top: 28px; }
  .site-preview .collection-action p { align-items: flex-start; flex-direction: column; }
  .site-preview .collection-cta { width: 100%; gap: 15px; padding: 15px 17px; }
}

@media (max-width: 420px) {
  .site-preview .container { padding-inline: 18px; }
  .site-preview .devis-page .container,
  .site-preview form.devis-form { width: auto; max-width: 100%; }
  .preview-banner { padding-inline: 8px; font-size: 7px; letter-spacing: .07em; }
  .preview-site-header .nav-inner { padding-inline: 18px; }
  .site-preview .hero,
  .site-preview .page-hero,
  .site-preview .editorial-hero { padding: 120px 18px 66px; }
  .site-preview .hero h1,
  .site-preview .page-hero h1 { font-size: clamp(32px, 9.7vw, 40px); }
  .site-preview .hero p.lead { font-size: 15.5px; }
  .site-preview .bar-card,
  .home-exact .bar-card { padding: 29px 21px; }
  .site-preview .pancake-stage-visual { min-height: 460px; }
  .site-preview .pancake-visual-index { top: 13px; letter-spacing: .16em; }
  .site-preview .collection-shell { width: calc(100% - 28px); }
  .site-preview .recipe-card,
  .site-preview .recipe-card.is-active { min-height: 545px; }
  .site-preview .recipe-artwork { height: 296px; }
  .site-preview .recipe-copy h2 { font-size: 31px; }
}

/* Densité ordinateur : chaque grande composition reste lisible sur un écran peu haut. */
@media (min-width: 1000px) {
  .site-preview .pad { padding-block: clamp(68px, 8.5svh, 96px); }

  .site-preview .section-intro,
  .site-preview .sec-head { margin-bottom: clamp(36px, 5svh, 54px); }

  .site-preview .section-intro h2,
  .site-preview .sec-head h2 { font-size: clamp(31px, 3.2vw, 44px); }

  .site-preview .page-hero {
    min-height: min(76svh, 760px);
    padding-top: clamp(140px, 20svh, 184px);
    padding-bottom: clamp(62px, 9svh, 92px);
  }

  .site-preview .bar-card { min-height: 330px; padding: 40px; }
  .home-exact .bar-card { min-height: 250px; padding: 38px 34px; }
  .site-preview .story-lead { gap: clamp(44px, 6vw, 78px); }
  .site-preview .values-row { margin-top: clamp(52px, 7svh, 76px); }
  .site-preview .value-cell { padding: 30px 22px; }

  .site-preview .premium-band {
    margin-top: clamp(68px, 9svh, 90px);
    padding-block: clamp(72px, 10svh, 96px);
  }

  .site-preview .prest-card { min-height: 210px; padding: 38px 28px; }
  .site-preview .composer-grid { gap: 48px; }
  .site-preview .step { margin-bottom: 36px; }
  .site-preview .pill { padding: 9px 16px; font-size: 11.5px; }
  .site-preview .carte { padding: 36px 30px; }

  .site-preview .formule-grid { gap: 22px; }
  .site-preview .fcard { padding: 32px 27px; }
  .site-preview .fcard li { padding-block: 7px; font-size: 14px; }
  .site-preview .fcard ul { margin-bottom: 24px; }
  .site-preview .options-wrap { margin-top: 64px; }

  .site-preview .principle-card { padding: 48px 38px; }
  .site-preview .cta-band { padding-block: clamp(68px, 9svh, 86px); }
  .site-preview .preview-footer { padding-top: 64px; }

  .site-preview .devis-page { padding-top: clamp(132px, 18svh, 170px); }
  .site-preview .devis-intro { margin-bottom: 52px; }
  .site-preview .contact-service-picker { margin-bottom: 48px; }

  .site-preview .pancake-showcase {
    padding-block: clamp(34px, 6svh, 72px);
  }

  .site-preview .pancake-stage {
    grid-template-columns: .9fr 1.1fr;
    gap: clamp(44px, 5vw, 76px);
  }

  .site-preview .pancake-stage-copy .script {
    margin-bottom: -5px;
    font-size: clamp(36px, 3.2vw, 47px);
  }

  .site-preview .pancake-stage-copy h2 {
    margin-bottom: 18px;
    font-size: clamp(35px, 3.65vw, 51px);
  }

  .site-preview .pancake-stage-copy > p { margin-bottom: 24px; font-size: 15px; }
  .site-preview .pancake-details { margin-bottom: 26px; }
  .site-preview .pancake-details div { padding-block: 10px; }

  .site-preview .pancake-stage-visual {
    min-height: clamp(480px, 75svh, 735px);
    max-height: 735px;
    border-radius: min(22vw, 280px) min(22vw, 280px) 12px 12px;
  }

  .site-preview .pancake-bar-canvas {
    width: auto;
    max-width: 98%;
    height: min(68svh, 650px);
    object-fit: contain;
  }

  .site-preview .pancake-visual-index { top: 24px; }

  .site-preview .fraises-collection {
    padding: clamp(30px, 5svh, 62px) 0 clamp(28px, 4svh, 52px);
  }

  .site-preview .collection-heading {
    gap: 44px;
    margin-bottom: clamp(24px, 4svh, 42px);
  }

  .site-preview .collection-kicker { margin-bottom: 14px; }
  .site-preview .collection-heading h1 { font-size: clamp(54px, 5.5vw, 82px); line-height: .86; }
  .site-preview .heading-note { padding-bottom: 0; }
  .site-preview .note-line { margin-bottom: 14px; }
  .site-preview .heading-note p { margin-bottom: 12px; font-size: clamp(15px, 1.3vw, 19px); }

  .site-preview .recipe-deck {
    height: clamp(395px, 58svh, 580px);
    min-height: 0;
  }

  .site-preview .recipe-card {
    display: flex;
    flex: 1 1 0;
    flex-direction: column;
    min-height: 0;
    padding: 18px clamp(18px, 1.8vw, 27px) 20px;
    border-radius: min(12vw, 150px) min(12vw, 150px) 18px 18px;
  }

  .site-preview .recipe-card.is-active { flex: 1 1 0; }

  .site-preview .card-topline {
    top: clamp(39px, 6svh, 55px);
    left: clamp(34px, 3vw, 52px);
    right: clamp(34px, 3vw, 52px);
  }

  .site-preview .recipe-number { font-size: 15px; }
  .site-preview .recipe-mood { font-size: 8px; }

  .site-preview .recipe-artwork {
    height: clamp(210px, 31svh, 290px);
    margin: 0 -18px -3px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
  }

  .site-preview .recipe-canvas {
    width: auto;
    max-width: 108%;
    height: clamp(255px, 36svh, 340px);
    max-height: none;
    flex: 0 0 auto;
  }

  .site-preview .recipe-copy {
    flex: 1 1 auto;
    min-height: clamp(88px, 14svh, 132px);
    overflow: visible;
  }
  .site-preview .recipe-script { margin-bottom: -8px; font-size: clamp(28px, 2.6vw, 36px); }
  .site-preview .recipe-copy h2 { margin-bottom: 9px; font-size: clamp(24px, 2.25vw, 34px); }
  .site-preview .recipe-copy p { font-size: 11px; line-height: 1.48; }
  .site-preview .recipe-card.is-active .ingredient-list { margin-top: 9px; }
  .site-preview .ingredient-list li { padding: 4px 7px; font-size: 7px; }
  .site-preview .discover-button { flex: 0 0 auto; margin-top: auto; padding-top: 10px; }

  .site-preview .collection-action {
    margin-top: clamp(16px, 2.5svh, 26px);
    padding-top: 16px;
  }

  .site-preview .collection-cta { padding-block: 12px; }
}

@media (min-width: 1000px) and (max-height: 760px) {
  .preview-banner { min-height: 28px; padding-block: 5px; }
  .preview-site-header { top: 28px; }
  .site-preview .mobile-menu { top: 28px; }
  .preview-main { padding-top: 28px; }
  .preview-site-header .nav-inner { padding-block: 9px; }
  .preview-site-header .brandmark img { height: 42px; }

  .site-preview .page-hero {
    min-height: calc(100svh - 28px);
    padding-top: 120px;
    padding-bottom: 48px;
  }

  .site-preview .page-hero h1 { font-size: clamp(38px, 4.5vw, 56px); }
  .site-preview .page-hero .lead { margin-bottom: 30px; font-size: 17px; }
  .site-preview .pad { padding-block: 60px; }
  .site-preview .section-intro,
  .site-preview .sec-head { margin-bottom: 32px; }

  .site-preview .pancake-showcase { padding-block: 28px; }
  .site-preview .pancake-stage-visual { min-height: calc(100svh - 122px); }
  .site-preview .pancake-bar-canvas { height: min(64svh, 500px); }
  .site-preview .pancake-stage-copy .eyebrow { margin-bottom: 11px; }
  .site-preview .pancake-stage-copy h2 { font-size: clamp(34px, 3.3vw, 46px); }
  .site-preview .pancake-details div { padding-block: 8px; }

  .site-preview .fraises-collection { padding-top: 24px; padding-bottom: 22px; }
  .site-preview .collection-heading { margin-bottom: 20px; }
  .site-preview .collection-kicker { margin-bottom: 9px; }
  .site-preview .collection-heading h1 { font-size: clamp(50px, 4.8vw, 70px); }
  .site-preview .recipe-deck { height: 340px; }
  .site-preview .recipe-card,
  .site-preview .recipe-card.is-active {
    flex-basis: 0;
    height: 100%;
    padding-top: 15px;
    padding-bottom: 18px;
    transform: none;
  }
  .site-preview .recipe-artwork { height: 172px; flex: 0 0 172px; }
  .site-preview .recipe-canvas { height: 188px; }
  .site-preview .recipe-copy { min-height: 74px; }
  .site-preview .recipe-card.is-active .ingredient-list { display: none; }
  .site-preview .recipe-script { font-size: 27px; }
  .site-preview .recipe-copy h2 { font-size: clamp(23px, 2vw, 29px); }
  .site-preview .callout-two { top: 31%; }
  .site-preview .discover-button { padding-bottom: 2px; }
  .site-preview .collection-action { margin-top: 12px; padding-top: 12px; }

  /* Les collections deviennent de vraies compositions plein écran sur ordinateur. */
  .site-preview section.pad:has(.bars-grid) { padding-block: 38px; }
  .site-preview section.pad:has(.bars-grid) .section-intro {
    max-width: 700px;
    margin-bottom: 22px;
  }
  .site-preview section.pad:has(.bars-grid) .section-intro .eyebrow { margin-bottom: 8px; }
  .site-preview section.pad:has(.bars-grid) .section-intro h2 {
    margin-bottom: 10px;
    font-size: clamp(30px, 2.8vw, 39px);
  }
  .site-preview section.pad:has(.bars-grid) .section-intro p {
    font-size: 14px;
    line-height: 1.5;
  }
  .site-preview .bars-grid { gap: 14px; }
  .site-preview .bar-card {
    min-height: 246px;
    padding: 27px 25px;
  }
  .site-preview .bar-card h3 {
    margin: 13px 0 9px;
    font-size: clamp(24px, 2.25vw, 31px);
  }
  .site-preview .bar-card p { font-size: 13px; line-height: 1.52; }
  .site-preview .bar-card .bar-link { margin-top: 18px; font-size: 8px; }
  .site-preview .bar-card .bar-number { font-size: 13px; }
  .site-preview .soon-tag { top: 18px; right: 18px; padding: 5px 9px; font-size: 7px; }

  .home-exact .bar-card {
    min-height: 226px;
    padding: 25px 24px;
  }
  .home-exact .bar-card .glyph { font-size: 27px; }
  .home-exact .bar-card h3 { font-size: 21px; }
  .home-exact .bar-card p { font-size: 12.5px; line-height: 1.48; }
  .home-exact .bar-card .btn { min-height: 40px; padding: 11px 18px; font-size: 8px; }

  .site-preview .faq-categories { gap: 54px; }
  .site-preview .faq-aside h2 { margin-block: 9px 12px; font-size: 31px; }
  .site-preview .faq-q { padding-block: 15px; font-size: 15px; }
  .site-preview .faq-a-inner { padding-bottom: 17px; font-size: 13.5px; }

  .site-preview .devis-page { padding-top: 118px; }
  .site-preview .devis-intro { margin-bottom: 30px; }
  .site-preview .contact-service-picker { margin-bottom: 36px; padding: 22px; }
  .site-preview .contact-service-head { margin-bottom: 18px; }
  .site-preview .contact-service-choice { padding: 16px; }
}

@media (min-width: 1200px) {
  .site-preview .bars-grid,
  .home-exact .bars-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .site-preview .contact-service-picker {
    width: 100%;
    margin-bottom: 42px;
    padding: 20px 16px;
  }

  .site-preview .contact-service-head,
  .site-preview .contact-service-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .site-preview .contact-service-head { gap: 12px; margin-bottom: 20px; }
  .site-preview .contact-service-head h2 { font-size: 28px; }
  .site-preview .contact-service-choice { padding: 17px 15px; }
  .site-preview .contact-direct {
    align-items: flex-start;
    flex-direction: column;
    gap: 11px;
  }
}

/* Une seule carte de service, identique sur Accueil et Nos Bars. */
.site-preview .service-card-grid { gap: 20px; }
.site-preview .service-card-grid .bar-card {
  min-height: 380px;
  padding: 48px;
  justify-content: space-between;
  gap: 0;
}
.site-preview .service-card-grid .bar-card-meta {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.site-preview .service-card-grid .service-glyph {
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border: 1px solid var(--hairline);
  border-radius: 50%;
  background: rgba(255, 255, 255, .28);
  font-size: 21px;
  line-height: 1;
}
.site-preview .service-card-grid .bar-card.dark .service-glyph {
  border-color: rgba(255, 255, 255, .2);
  background: rgba(255, 255, 255, .06);
}
.site-preview .service-card-grid .bar-card h3 {
  margin: 20px 0 12px;
  font-size: clamp(29px, 3vw, 42px);
}
.site-preview .service-card-grid .bar-card p {
  max-width: 510px;
  color: var(--text-soft);
  font-size: 15px;
}
.site-preview .service-card-grid .bar-card.dark p { color: #d8c7b3; }
.site-preview .service-card-grid .bar-card.is-soon {
  background: var(--cream-card);
  border-style: solid;
}
.site-preview .service-card-grid .bar-card.is-soon:hover {
  transform: none;
  background: var(--cream-card);
  box-shadow: none;
}
.site-preview .service-card-grid .bar-card.is-soon h3,
.site-preview .service-card-grid .bar-card.is-soon p { opacity: .6; }
.site-preview .service-card-grid .bar-card.is-soon .bar-card-meta { padding-right: 66px; }

@media (min-width: 1000px) and (max-height: 760px) {
  .site-preview .service-card-grid { gap: 14px; }
  .site-preview .service-card-grid .bar-card {
    min-height: 246px;
    padding: 27px 25px;
  }
  .site-preview .service-card-grid .bar-card h3 {
    margin: 13px 0 9px;
    font-size: clamp(24px, 2.25vw, 31px);
  }
  .site-preview .service-card-grid .bar-card p { font-size: 13px; line-height: 1.52; }
  .site-preview .service-card-grid .bar-card .bar-link { margin-top: 18px; font-size: 8px; }
  .site-preview .service-card-grid .bar-number { font-size: 13px; }
  .site-preview .service-card-grid .service-glyph {
    flex-basis: 34px;
    width: 34px;
    height: 34px;
    font-size: 17px;
  }
  .site-preview .service-card-grid .bar-card.is-soon .bar-card-meta { padding-right: 50px; }
}

@media (max-width: 760px) {
  .site-preview .service-card-grid .bar-card {
    min-height: 330px;
    padding: 32px 24px;
  }
  .site-preview .service-card-grid .bar-card h3 { font-size: 29px; }
  .site-preview .service-card-grid .bar-card p { font-size: 13px; }
  .site-preview .service-card-grid .bar-card-meta { align-items: flex-start; }
  .site-preview .service-card-grid .bar-card.is-soon .bar-card-meta { padding-right: 58px; }
}

/* Hero Strawberry : les trois créations, au même niveau que le hero Matcha. */
body[data-page="fraises"] .strawberry-hero {
  min-height: min(880px, 100svh);
  padding: 124px 0 72px;
  overflow: hidden;
  color: var(--cream);
  text-align: left;
  background:
    radial-gradient(circle at 73% 34%, rgba(210, 111, 119, .22), transparent 28%),
    linear-gradient(130deg, #6f2633 0%, #4d1e27 56%, #32151c 100%);
}

body[data-page="fraises"] .strawberry-hero .container {
  width: 100%;
  max-width: 100%;
}

.strawberry-hero-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 60px;
  align-items: center;
}

.strawberry-hero-grid > * { min-width: 0; }
.strawberry-hero-copy { position: relative; z-index: 3; min-width: 0; }
.strawberry-hero-copy .eyebrow { color: #f1c1bd; }
.strawberry-script {
  display: block;
  margin: 19px 0 -6px;
  color: #efb8b6;
  font: 46px/1 "Mrs Saint Delafield", cursive;
}
body[data-page="fraises"] .strawberry-hero-copy h1 {
  max-width: 630px;
  margin: 0;
  color: var(--cream);
  font-size: clamp(48px, 5.6vw, 78px);
  line-height: .98;
}
body[data-page="fraises"] .strawberry-hero-copy > p {
  max-width: 570px;
  margin: 27px 0 34px;
  color: #ead1cf;
  font-size: 17px;
}
body[data-page="fraises"] .strawberry-hero-copy .hero-ctas {
  width: max-content;
  max-width: none;
  flex-wrap: nowrap;
  justify-content: flex-start;
}
body[data-page="fraises"] .strawberry-hero .btn {
  min-width: 0;
  padding-inline: 23px;
  white-space: nowrap;
}
body[data-page="fraises"] .strawberry-hero .btn-berry {
  border-color: #d9a09e;
  background: #b75e68;
  color: var(--cream);
}
body[data-page="fraises"] .strawberry-hero .btn-berry:hover {
  border-color: #f1c1bd;
  background: transparent;
  color: #f1c1bd;
}

.strawberry-hero-art {
  position: relative;
  min-width: 0;
  min-height: 570px;
}

.strawberry-orbit {
  position: absolute;
  display: block;
  border: 1px solid rgba(250, 205, 202, .2);
  border-radius: 50%;
}
.strawberry-orbit.orbit-one { inset: 2% 4% 4%; }
.strawberry-orbit.orbit-two { inset: 13% 15% 15%; }

.strawberry-hero-cup {
  position: absolute;
  z-index: 2;
  bottom: 14%;
  width: 32%;
  text-align: center;
}
.strawberry-hero-cup .recipe-canvas {
  --shift-x: 0;
  --shift-y: 0;
  display: block;
  width: 100%;
  max-width: none;
  max-height: none;
  height: auto;
  margin: 0;
  filter: drop-shadow(0 27px 22px rgba(18, 5, 8, .34));
  transform: none;
}
.strawberry-hero-cup span {
  display: block;
  margin-top: 10px;
  color: #f1d1ce;
  font: italic 13px/1.25 "Playfair Display", serif;
}
.strawberry-hero-cup.cup-nutella {
  left: 0;
  transform: scale(.74) rotate(-5deg);
  transform-origin: bottom;
}
.strawberry-hero-cup.cup-caramel { left: 33%; bottom: 6%; width: 38%; }
.strawberry-hero-cup.cup-pistache {
  right: -1%;
  transform: scale(.8) rotate(5deg);
  transform-origin: bottom;
}

@media (min-width: 1000px) and (max-height: 760px) {
  body[data-page="fraises"] .strawberry-hero { min-height: calc(100svh - 28px); padding: 94px 0 34px; }
  body[data-page="fraises"] .strawberry-hero-copy h1 { font-size: clamp(44px, 4.7vw, 65px); }
  body[data-page="fraises"] .strawberry-hero-copy > p { margin-block: 20px 25px; }
  .strawberry-hero-art { min-height: 440px; }
}

@media (max-width: 900px) {
  body[data-page="fraises"] .strawberry-hero { min-height: auto; padding: 142px 0 64px; text-align: center; }
  .strawberry-hero-grid { grid-template-columns: 1fr; gap: 28px; }
  body[data-page="fraises"] .strawberry-hero-copy h1,
  body[data-page="fraises"] .strawberry-hero-copy > p { margin-inline: auto; }
  body[data-page="fraises"] .strawberry-hero-copy .hero-ctas {
    width: min(100%, 360px);
    max-width: 360px;
    margin-inline: auto;
    flex-wrap: wrap;
    justify-content: center;
  }
  body[data-page="fraises"] .strawberry-hero-copy .hero-ctas .btn {
    width: 100%;
    padding: 14px 18px;
  }
  .strawberry-hero-art { width: min(100%, 620px); min-height: 430px; margin-inline: auto; }
}

@media (max-width: 600px) {
  body[data-page="fraises"] .strawberry-hero { padding: 124px 0 50px; }
  body[data-page="fraises"] .strawberry-hero-grid {
    width: calc(100vw - 40px);
    max-width: calc(100vw - 40px);
    padding-inline: 0;
    overflow: hidden;
  }
  body[data-page="fraises"] .strawberry-hero-copy {
    width: 100%;
    max-width: 100%;
    overflow: hidden;
  }
  .strawberry-script { font-size: 37px; }
  body[data-page="fraises"] .strawberry-hero-copy h1 {
    width: 100%;
    max-width: 100%;
    font-size: clamp(35px, 10vw, 43px);
    white-space: normal;
    overflow-wrap: break-word;
  }
  body[data-page="fraises"] .strawberry-hero-copy > p { font-size: 15px; }
  body[data-page="fraises"] .strawberry-hero-copy .hero-ctas {
    width: min(100%, 360px);
    max-width: 360px;
    margin-inline: auto;
    align-items: stretch;
    flex-direction: column;
  }
  body[data-page="fraises"] .strawberry-hero-copy .hero-ctas .btn {
    width: 100%;
    padding: 14px 18px;
    justify-content: center;
    white-space: normal;
  }
  .strawberry-hero-art { min-height: 315px; }
  .strawberry-hero-cup { width: 38%; }
  .strawberry-hero-cup.cup-caramel { left: 29%; width: 43%; }
  .strawberry-hero-cup span { margin-top: 5px; font-size: 9px; }
}

/* Hero Pancakes : même composition éditoriale que Matcha et Fraises. */
body[data-page="pancakes"] .pancake-menu-hero {
  min-height: min(880px, 100svh);
  padding: 124px 0 72px;
  overflow: hidden;
  color: var(--cream);
  background:
    radial-gradient(circle at 73% 34%, rgba(184, 112, 51, .24), transparent 28%),
    linear-gradient(130deg, #351b10 0%, #552914 56%, #26130c 100%);
}

body[data-page="pancakes"] .pancake-menu-hero .container {
  width: 100%;
  max-width: 100%;
}

.pancake-menu-hero-grid {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 60px;
  align-items: center;
}

.pancake-menu-hero-grid > * { min-width: 0; }
.pancake-menu-hero-copy { position: relative; z-index: 3; }
.pancake-menu-hero-copy .eyebrow { color: #efd0a1; }
.pancake-menu-script {
  display: block;
  margin: 19px 0 -6px;
  color: #e1b879;
  font: 46px/1 "Mrs Saint Delafield", cursive;
}
.pancake-menu-hero h1 {
  max-width: 630px;
  margin: 0;
  color: var(--cream);
  font-size: clamp(48px, 5.6vw, 78px);
  line-height: .98;
}
.pancake-menu-hero-copy > p {
  max-width: 570px;
  margin: 27px 0 34px;
  color: #e2ceba;
  font-size: 17px;
}
.pancake-menu-hero .hero-ctas {
  width: max-content;
  max-width: none;
  flex-wrap: nowrap;
  justify-content: flex-start;
}
.pancake-menu-hero .btn {
  min-width: 0;
  padding-inline: 23px;
  white-space: nowrap;
}
.pancake-menu-hero .btn-pancake {
  border-color: #e1bd87;
  background: #ad7139;
  color: var(--cream);
}
.pancake-menu-hero .btn-pancake:hover {
  border-color: #efd0a1;
  background: transparent;
  color: #efd0a1;
}

.pancake-menu-hero-art { position: relative; min-height: 570px; }
.pancake-menu-orbit {
  position: absolute;
  display: block;
  border: 1px solid rgba(235, 198, 145, .2);
  border-radius: 50%;
}
.pancake-menu-orbit.orbit-one { inset: 2% 4% 4%; }
.pancake-menu-orbit.orbit-two { inset: 13% 15% 15%; }
.pancake-menu-cup {
  position: absolute;
  z-index: 2;
  bottom: 14%;
  width: 32%;
  text-align: center;
}
.pancake-menu-cup img,
.pancake-menu-cup canvas {
  display: block;
  width: 100%;
  max-height: 510px;
  height: auto;
  margin-inline: auto;
  object-fit: contain;
  filter: drop-shadow(0 28px 25px rgba(10, 4, 1, .32));
}
.pancake-menu-cup span {
  display: block;
  margin-top: 14px;
  color: #ead4b5;
  font: italic 14px/1.3 "Playfair Display", serif;
}
.pancake-menu-cup.cup-nutella {
  left: 0;
  transform: scale(.74) rotate(-5deg);
  transform-origin: bottom;
}
.pancake-menu-cup.cup-caramel { left: 30%; bottom: 6%; width: 38%; }
.pancake-menu-cup.cup-pistache {
  right: -1%;
  transform: scale(.8) rotate(5deg);
  transform-origin: bottom;
}

@media (min-width: 1000px) and (max-height: 760px) {
  body[data-page="pancakes"] .pancake-menu-hero { min-height: calc(100svh - 28px); padding: 94px 0 34px; }
  .pancake-menu-hero-art { min-height: 440px; }
  .pancake-menu-cup img,
  .pancake-menu-cup canvas { max-height: 390px; }
  .pancake-menu-hero h1 { font-size: clamp(44px, 4.7vw, 65px); }
  .pancake-menu-hero-copy > p { margin-block: 20px 25px; }
}

@media (max-width: 900px) {
  body[data-page="pancakes"] .pancake-menu-hero { min-height: auto; padding: 142px 0 64px; }
  .pancake-menu-hero-grid { grid-template-columns: 1fr; gap: 28px; }
  .pancake-menu-hero-copy { text-align: center; }
  .pancake-menu-hero h1,
  .pancake-menu-hero-copy > p { margin-inline: auto; }
  .pancake-menu-hero .hero-ctas {
    width: min(100%, 360px);
    max-width: 360px;
    margin-inline: auto;
    flex-wrap: wrap;
    justify-content: center;
  }
  .pancake-menu-hero .hero-ctas .btn {
    width: 100%;
    padding: 14px 18px;
  }
  .pancake-menu-hero-art { width: 100%; max-width: 620px; min-height: 430px; margin-inline: auto; }
}

@media (max-width: 600px) {
  body[data-page="pancakes"] .pancake-menu-hero { padding: 124px 0 50px; }
  body[data-page="pancakes"] .pancake-menu-hero-grid {
    width: calc(100vw - 40px);
    max-width: calc(100vw - 40px);
    margin-inline: auto;
    padding-inline: 0;
    overflow: hidden;
  }
  .pancake-menu-hero-copy {
    width: 100%;
    max-width: 100%;
    overflow: hidden;
  }
  .pancake-menu-script { font-size: 37px; }
  .pancake-menu-hero h1 {
    width: 100%;
    max-width: 100%;
    font-size: clamp(34px, 10vw, 43px);
    white-space: normal;
    overflow-wrap: break-word;
  }
  .pancake-menu-hero-copy > p {
    width: 100%;
    max-width: 100%;
    font-size: 15px;
    white-space: normal;
  }
  .pancake-menu-hero .hero-ctas {
    width: min(100%, 360px);
    max-width: 360px;
    margin-inline: auto;
    align-items: stretch;
    flex-direction: column;
  }
  .pancake-menu-hero .btn {
    width: 100%;
    padding: 14px 18px;
    justify-content: center;
    white-space: normal;
  }
  .pancake-menu-hero-art {
    width: 100%;
    max-width: 100%;
    min-height: 315px;
    overflow: hidden;
  }
  .pancake-menu-cup { width: 35%; }
  .pancake-menu-cup.cup-nutella { left: 1%; }
  .pancake-menu-cup.cup-caramel { left: 29%; width: 43%; }
  .pancake-menu-cup.cup-pistache { right: 1%; }
  .pancake-menu-cup img,
  .pancake-menu-cup canvas { max-height: 270px; }
  .pancake-menu-cup span { margin-top: 8px; font-size: 10px; }
}

/* Raccord direct entre la dernière bande sombre de l’accueil et le footer. */
.home-exact #concept.pad { padding-bottom: 0 !important; }

/* Accueil : rapproche le monogramme sans jamais le couper sur un écran peu haut. */
.home-exact .hero > div:not(.scrollcue) {
  transform: translateY(-48px);
  transform: translateY(clamp(-104px, calc(106px - 21svh), -12px));
}
.home-exact .scrollcue { transform: translateX(-50%); }

/* Accueil : conserve les quatre univers dans des cartes éditoriales compactes. */
.home-exact #bars .container {
  max-width: 1540px;
}

@media (min-width: 1200px) {
  .home-exact .home-bars-editorial .bar-card {
    min-height: 320px;
    padding: 30px 27px;
  }

  .home-exact .home-bars-editorial .bar-card h3 {
    margin: 16px 0 10px;
    font-size: clamp(27px, 2vw, 32px);
    line-height: 1.14;
    text-wrap: balance;
  }

  .home-exact .home-bars-editorial .bar-card p {
    font-size: 13px;
    line-height: 1.55;
  }

  .home-exact .home-bars-editorial .bar-number {
    font-size: 14px;
    line-height: 1.35;
  }

  .home-exact .home-bars-editorial .bar-link {
    margin-top: 22px;
    font-size: 9px;
  }
}

/* Accueil : rapproche le repère d’identité du logo du parasol. */
.home-exact .home-experience .pancake-callout-top {
  right: -16%;
}

.home-exact .home-experience .pancake-callout-top::after {
  width: 22px;
}

.home-exact .home-experience .pancake-callout-top::before {
  right: calc(100% + 30px);
}

/* Petits iPhone : proportions plus compactes, sans modifier le centrage adaptatif. */
@media (max-width: 420px) {
  .home-exact .hero-logo {
    width: min(230px, 68vw);
    margin-bottom: 18px;
  }

  .home-exact .hero h1 {
    margin-bottom: 16px;
  }

  .home-exact .hero p.lead {
    margin-bottom: 24px;
    font-size: 15px;
    line-height: 1.5;
  }

  .home-exact .hero-ctas {
    gap: 10px;
  }

  .home-exact .hero-ctas .btn {
    padding-block: 14px;
  }
}

/* Les annotations suivent désormais l’image du bar, pas le cadre extérieur. */
.site-preview .pancake-bar-assembly {
  width: auto;
  max-width: 98%;
  height: min(68svh, 650px);
}

.site-preview .pancake-bar-assembly .pancake-bar-canvas {
  width: 100%;
  max-width: none;
  height: 100%;
  max-height: none;
  object-fit: contain;
}

@media (min-width: 1000px) and (max-height: 760px) {
  .site-preview .pancake-bar-assembly {
    height: min(64svh, 500px);
  }
}

@media (max-width: 900px) {
  .site-preview .pancake-bar-assembly {
    width: 100%;
    max-width: 430px;
    height: auto;
  }

  .site-preview .pancake-callout {
    display: none;
  }
}