/* Textes HTML, photos indépendantes et dessins vectoriels, comme le bloc 3. */
.native-block { gap: 0; }
.native-block > .cuisine-panel { min-width: 0; min-height: 0; position: relative; }
.native-block > .cuisine-panel > .paper { height: 100%; }
.native-script { font-family: ElSolBrush, cursive; font-weight: 400; }
.native-branch { position: absolute; pointer-events: none; width: 20%; height: auto; }
.native-heart { fill: none; stroke: currentColor; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.native-swash { fill: none; stroke: #f3c849; stroke-width: 6; stroke-linecap: square; pointer-events: none; }
.native-block .main-photo > img { position: absolute; inset: 0; width: 100%; height: 100%; transition: none; }
.native-block .main-photo:hover > img { transform: none; }

/* Bloc 2 : vrai titre et vraie note sur papier quadrillé. */
.experience-native { grid-template-columns: 44% 56%; height: clamp(450px, 41vw, 630px); min-height: 0; }
.experience-native > .cuisine-panel-left { z-index: 2; }
.experience-native .experience-surface { padding: 8% 10% 8% 11%; }
.experience-native .experience-surface::before { content: ''; position: absolute; left: 0; top: 10%; bottom: 6%; width: 2.5%; background: #efc446; clip-path: polygon(0 0,70% 3%,100% 21%,75% 40%,95% 62%,64% 84%,100% 100%,0 98%); }
.experience-native h2 { font-size: clamp(64px, 7.2vw, 110px); line-height: 1; letter-spacing: -.055em; }
.experience-native h2 em { color: #a97118; }
.experience-native .eyebrow { margin-bottom: 16px; }
.experience-native .copy { font-size: clamp(17px, 1.7vw, 25px); margin-top: 16px; line-height: 1.25; position: relative; }
.experience-branch { top: 0; right: 2%; width: 20%; max-height: 300px; }
.experience-swash { position: absolute; right: -12%; top: 48%; width: 26%; height: 65px; }
.native-qualities { list-style: none; display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; text-align: center; padding: 0; margin: 34px -10px 0; }
.native-qualities svg { display: block; width: 42px; height: 42px; margin: 0 auto 14px; color: #d27168; stroke-width: 1.8; }
.native-qualities span { display: block; font-size: clamp(14px, 1.3vw, 20px); line-height: 1.15; }
.experience-native .main-photo > img { object-position: center 43%; }
.native-grid-note { position: absolute; right: -12px; bottom: -10px; width: 72%; max-width: 560px; padding: 22px 30px 28px; background-color: #fcf8ef; background-image: linear-gradient(#bdccd34d 1px,transparent 1px),linear-gradient(90deg,#bdccd34d 1px,transparent 1px); background-size: 22px 22px; color: #252a27; font-size: clamp(26px, 2.7vw, 42px); line-height: 1.2; text-align: center; transform: rotate(-8deg); }
.native-grid-note .native-heart { display: block; width: 42px; height: 48px; margin: 8px 0 0 auto; }

/* Bloc 4 : papier manuscrit à gauche, vraie photo à droite. */
.together-native { grid-template-columns: 41% 59%; height: clamp(440px, 38vw, 590px); min-height: 0; }
.together-native > .cuisine-panel-left { z-index: 2; }
.together-native .together-surface { margin: 0; transform: none; padding: 7% 10% 6% 11%; width: 108%; clip-path: polygon(0 0,84% 0,100% 100%,0 100%); }
.together-native h2 { font-size: clamp(52px, 5.6vw, 86px); line-height: 1.04; transform: rotate(-6deg); letter-spacing: -.04em; position: relative; }
.together-native h2 > span { display: block; }
.together-native h2 mark { display: inline-block; font-size: .72em; position: relative; padding: 0 8px 6px; background: transparent; box-shadow: none; z-index: 0; }
.together-native h2 mark::before { content: ''; position: absolute; inset: 7% -3% 4%; background: #f6c94c; z-index: -1; clip-path: polygon(2% 16%,10% 4%,94% 0,100% 10%,97% 30%,100% 44%,97% 85%,88% 98%,0 100%,3% 75%,0 55%); }
.together-native h2 mark::after { content: ''; position: absolute; left: 12%; right: 3%; bottom: -5px; height: 4px; border-radius: 50%; background: #e4b232; transform: rotate(-2deg); }
.together-native .copy { position: relative; font-size: clamp(17px, 1.65vw, 25px); margin-top: 34px; line-height: 1.3; }
.together-branch { left: -7%; top: 6%; width: 22%; }
.together-surface::after { content: ''; position: absolute; top: 0; left: 0; width: 90px; height: 45px; background: #f4c54a; clip-path: polygon(0 0,100% 0,0 100%,12% 28%,0 64%); }
.together-native .main-photo > img { object-position: center 59%; }

/* Bloc 5 : tous les textes, le bouton et la légende sont des éléments HTML. */
.events-native { grid-template-columns: 55% 45%; height: clamp(500px, 47vw, 720px); min-height: 0; }
.events-native .events-surface { padding: 8% 5% 8% 7%; display: block; }
.events-native .event-text { width: 65%; }
.events-native h2 { font-size: clamp(34px, 4vw, 61px); }
.events-native .catalina > img { object-position: center 42%; }
.events-native .catalina figcaption { font-size: clamp(43px, 4.8vw, 74px); line-height: 1.05; }
.events-native .catalina .native-heart { display: block; width: 45px; height: 52px; color: #f3cb49; margin: 8px auto 0; }
.events-native .karaoke-note { width: 34%; right: 2%; top: 8%; padding: 10px; }
.events-native .karaoke-note img { height: auto; aspect-ratio: 1; object-fit: cover; }
.events-native .karaoke-note figcaption { font-size: clamp(24px, 2.3vw, 36px); line-height: 1.1; }
.events-native .native-music { color: #d47469; font-family: Georgia,serif; display: block; text-align: right; margin-top: 18px; }
.events-native li::before { background: #f4cb49; }

/* Bloc 6 : ardoise et texte dans le panneau gauche, vins dans celui de droite. */
.flavours-native { grid-template-columns: 65% 35%; height: clamp(450px, 39vw, 600px); min-height: 0; }
.flavours-native .flavours-left { display: grid; grid-template-columns: 36fr 29fr; }
.flavours-native .flavours-surface { padding: 13% 9% 10%; margin: 0 -22px 0 -25px; transform: rotate(-2deg); min-width: 0; }
.flavours-native h2 { font-size: clamp(32px, 3.35vw, 51px); line-height: 1.15; letter-spacing: -.035em; position: relative; z-index: 1; }
.flavours-native h2 .native-script { font-size: 1.12em; line-height: 1.12; }
.flavours-native h2 mark { display: inline-block; margin: 5px 0 2px -3px; padding: 0 8px 3px; background: #f5c749; transform: rotate(-2deg); }
.flavours-native .copy { position: relative; z-index: 1; font-size: clamp(16px, 1.48vw, 23px); line-height: 1.35; margin-top: 23px; }
.flavours-swash { width: 60%; height: 50px; margin: 18px 0 0 -5px; }
.flavours-heart { position: absolute; bottom: 12%; right: 20%; width: 40px; height: 45px; color: #d5746b; }
.flavours-branch { right: -3%; bottom: -39%; width: 29%; transform: rotate(-53deg); }
.flavours-native .slate > img { position: absolute; inset: 0; object-fit: cover; object-position: center; width: 100%; height: 100%; }
.flavours-native .slate > img { object-position: left top; }
.flavours-native > .main-photo > img { object-position: 40% center; }

/* Téléphone : même séparation en deux panneaux, contenus disposés verticalement. */
@media (max-width: 1000px) and (min-width: 701px) {
  .experience-native .eyebrow { font-size: 12px; margin-bottom: 10px; }
  .experience-native .native-qualities { margin-top: 25px; gap: 5px; }
  .native-qualities svg { width: 34px; height: 34px; margin-bottom: 10px; }
  .native-grid-note { padding: 16px 20px; }
  .together-native h2 { font-size: 5.6vw; }
  .together-native .copy { font-size: 17px; }
  .flavours-native h2 { font-size: 3.35vw; }
  .flavours-native .copy { font-size: 16px; }
  .flavours-native .flavours-surface { padding-left: 7%; padding-right: 7%; }
}

@media (max-width: 700px) {
  .native-block { grid-template-columns: 1fr; height: auto; min-height: 0; }
  .experience-native .experience-surface { padding: 38px 8% 34px; }
  .experience-native h2 { font-size: 74px; }
  .experience-native .copy { font-size: 18px; }
  .experience-branch { width: 65px; right: 4%; }
  .experience-swash { display: none; }
  .native-qualities { margin-top: 28px; margin-left: -6px; margin-right: -6px; gap: 8px; }
  .native-qualities span { font-size: 15px; }
  .native-qualities svg { width: 36px; height: 36px; }
  .experience-native > .main-photo { height: 400px; }
  .native-grid-note { font-size: clamp(23px, 6.2vw, 34px); width: 82%; padding: 17px 18px 19px; }
  .native-grid-note .native-heart { width: 30px; height: 36px; }
  .together-native .together-surface { width: 100%; margin: 0; transform: none; clip-path: none; padding: 42px 8% 36px; }
  .together-native h2 { font-size: clamp(46px, 13vw, 76px); line-height: 1.07; }
  .together-native .copy { font-size: 18px; line-height: 1.35; margin-top: 30px; }
  .together-branch { left: -5%; width: 65px; }
  .together-native > .main-photo { height: 400px; }
  .together-native .main-photo > img { object-position: center 57%; }
  .events-native > .catalina { height: 530px; }
  .events-native .events-surface { padding: 35px 6%; min-height: 440px; }
  .events-native .event-text { width: 65%; }
  .events-native h2 { font-size: clamp(33px, 9.4vw, 43px); }
  .events-native .catalina figcaption { font-size: clamp(45px, 13vw, 64px); }
  .events-native .karaoke-note { width: 30%; top: 50px; right: 3%; padding: 6px; }
  .events-native .karaoke-note figcaption { font-size: clamp(21px, 5.7vw, 29px); }
  .flavours-native .flavours-left { grid-template-columns: 40% 60%; min-height: 355px; }
              .flavours-native .flavours-surface { margin: 0 0 0 -10px; padding: 30px 9%; }
  .flavours-native h2 { font-size: clamp(27px, 8vw, 42px); }
  .flavours-native .copy { font-size: 16px; line-height: 1.35; }
  .flavours-native > .main-photo { height: 340px; }
  .flavours-native > .main-photo > img { object-position: 40% 24%; }
  .flavours-heart { bottom: 6%; right: 14%; width: 30px; height: 35px; }
  .flavours-swash { margin-top: 18px; height: 30px; }
  .flavours-branch { display: none; }
}