{"id":4310,"date":"2026-06-08T14:11:00","date_gmt":"2026-06-08T12:11:00","guid":{"rendered":"https:\/\/www.norki.com\/sur-mesure\/?page_id=4310"},"modified":"2026-07-17T12:58:08","modified_gmt":"2026-07-17T10:58:08","slug":"les-barmes-de-l-ours-val-d-isere","status":"publish","type":"page","link":"https:\/\/www.norki.com\/en\/custom-made-upholstery\/interior-design-projects-bespoke-craftsmanship\/hotel-projects\/les-barmes-de-l-ours-val-d-isere\/","title":{"rendered":"Les barmes de l\u2019Ours"},"content":{"rendered":"\n<section class=\"nk-hero\">\n  <div class=\"nk-hero__bg\">\n    <img decoding=\"async\" src=\"https:\/\/www.norki.com\/sur-mesure\/wp-content\/uploads\/2026\/07\/hotel-les-barmes-de-l-ours.png\" alt=\"The Alpine Haven of Les Barmes de l\u2019Ours, Val d'Is\u00e8re\" loading=\"eager\">\n    <div class=\"nk-hero__overlay\"><\/div>\n  <\/div>\n  \n  <div class=\"nk-hero__content\">\n    <div class=\"nk-hero__header\">\n      <!-- Wrapper pour le titre -->\n      <div class=\"nk-hero__title-wrapper\">\n        <h1 class=\"nk-hero__title avenirmedium-font\">The Alpine Haven of Les Barmes de l\u2019Ours<\/h1>\n      <\/div>\n      <!-- Wrapper pour le sous-titre -->\n      <div class=\"nk-hero__subtitle-wrapper\">\n        <span class=\"nk-hero__subtitle baskerville-italic-font\">Val d\u2019Is\u00e8re<\/span>\n      <\/div>\n    <\/div>\n    \n    <hr class=\"nk-hero__divider\">\n    \n    <!-- Meta informations d\u00e9filantes -->\n    <div class=\"nk-hero__meta\">\n      <span class=\"nk-hero__meta-item avenirmedium-font\">Val d&rsquo;Is\u00e8re, France<\/span>\n      <span class=\"nk-hero__meta-item avenirmedium-font\">2019\/2021<\/span>\n      <span class=\"nk-hero__meta-item\">Banquettes, furniture &amp; bespoke cushions<\/span>\n    <\/div>\n  <\/div>\n<\/section>\n\n<style>\n.nk-hero {\n  position: relative;\n  width: 100%;\n  \/* Height set above 100vh to naturally nudge users to scroll down *\/\n  height: 120vh; \n  min-height: 700px;\n  overflow: hidden;\n  background-color: #000000;\n}\n\n.nk-hero__bg {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  z-index: 1;\n}\n\n.nk-hero__bg img {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  object-position: center center;\n  display: block;\n}\n\n\/* Linear gradient overlay for solid text legibility *\/\n.nk-hero__overlay {\n  position: absolute;\n  bottom: 0;\n  left: 0;\n  width: 100%;\n  height: 40%;\n  background: linear-gradient(to top, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0) 100%);\n  z-index: 2;\n  pointer-events: none;\n}\n\n.nk-hero__content {\n  position: absolute;\n  bottom: 0;\n  left: 0;\n  width: 100%;\n  z-index: 3;\n  padding: 0 40px 40px 40px;\n  color: #ffffff;\n  box-sizing: border-box;\n}\n\n\/* Header Text (Titres - Larger typography and higher positioning) *\/\n.nk-hero__header {\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-end;\n  margin-bottom: 35px; \/* Spacing increased to detach the title row from the line below *\/\n  gap: 20px;\n  width: 100%;\n}\n\n.nk-hero__title-wrapper {\n  flex: 1 1 65%;\n  max-width: calc(100% - 250px);\n}\n\n.nk-hero__subtitle-wrapper {\n  flex: 0 0 auto;\n  text-align: right;\n  min-width: max-content;\n}\n\n.nk-hero__title {\n  color: white;\n  font-size: clamp(2.2rem, 3.2vw, 3.2rem); \/* Larger fluid font size *\/\n  letter-spacing: 0.02em;\n  line-height: 1.1;\n  font-weight: normal;\n  margin: 0;\n}\n\n.nk-hero__subtitle {\n  font-size: clamp(2.2rem, 3.2vw, 3.2rem); \/* Larger fluid font size to match title *\/\n  line-height: 1.1;\n  font-weight: normal;\n  display: block;\n}\n\n\/* White Divider *\/\n.nk-hero__divider {\n  width: 100%;\n  height: 1px;\n  background-color: rgba(255, 255, 255, 0.6);\n  border: none;\n  margin-bottom: 16px;\n}\n\n\/* Meta Informations (Equal spacing layout) *\/\n.nk-hero__meta {\n  display: flex;\n  justify-content: flex-start;\n  gap: 40px; \/* Equal spacing between each item *\/\n}\n\n.nk-hero__meta-item {\n  font-size: 0.75rem;\n  letter-spacing: 0.05em;\n  text-transform: capitalize;\n}\n\n\/* ============================================\n    RESPONSIVE TABLETTE (\u2264 1024px)\n============================================ *\/\n@media (max-width: 1024px) {\n  .nk-hero__content {\n    padding: 0 30px 30px 30px;\n  }\n  .nk-hero__title,\n  .nk-hero__subtitle {\n    font-size: clamp(1.8rem, 2.8vw, 2.4rem);\n  }\n  .nk-hero__meta {\n    gap: 30px;\n  }\n}\n\n\/* ============================================\n    RESPONSIVE MOBILE (\u2264 640px)\n============================================ *\/\n@media (max-width: 640px) {\n  .nk-hero {\n    height: 110vh; \n  }\n\n  .nk-hero__bg img {\n    object-position: 40% center;\n  }\n\n  .nk-hero__content {\n    padding: 0 20px 24px 20px;\n  }\n\n  .nk-hero__header {\n    flex-direction: column;\n    align-items: flex-start;\n    gap: 8px;\n    margin-bottom: 20px;\n  }\n\n  .nk-hero__title-wrapper,\n  .nk-hero__subtitle-wrapper {\n    flex: none;\n    max-width: 100%;\n    min-width: 0;\n  }\n\n  .nk-hero__subtitle-wrapper {\n    text-align: left;\n  }\n\n  .nk-hero__title {\n    font-size: 1.8rem;\n  }\n\n  .nk-hero__subtitle {\n    font-size: 1.7rem;\n  }\n\n  \/* Configuration du scroll horizontal fluide sur mobile *\/\n  .nk-hero__meta {\n    flex-wrap: nowrap; \/* Maintient les \u00e9l\u00e9ments sur 1 ligne *\/\n    gap: 25px; \/* Espacement raisonnable *\/\n    overflow-x: auto; \/* Autorise le scroll *\/\n    -webkit-overflow-scrolling: touch; \/* Inertie iOS *\/\n    scrollbar-width: none; \/* Cache la barre Firefox *\/\n    -ms-overflow-style: none; \/* Cache la barre IE\/Edge *\/\n    padding-bottom: 2px;\n    padding-left: 8px; \/* Ajout d'une marge de s\u00e9curit\u00e9 pour \u00e9viter que la premi\u00e8re lettre soit rogn\u00e9e *\/\n    padding-right: 8px;\n  }\n  \n  \/* Cache la scrollbar sur Chrome\/Safari *\/\n  .nk-hero__meta::-webkit-scrollbar {\n    display: none;\n  }\n\n  .nk-hero__meta-item {\n    white-space: nowrap; \/* Emp\u00eache de passer \u00e0 la ligne \u00e0 l'int\u00e9rieur d'un item *\/\n    flex-shrink: 0; \/* Emp\u00eache le texte d'\u00eatre \u00e9cras\u00e9 *\/\n  }\n\n  .nk-hero__meta-item:nth-child(3) {\n    margin-left: 0;\n    flex-basis: auto;\n    margin-top: 0;\n  }\n}\n<\/style>\n\n<script>\ndocument.addEventListener('DOMContentLoaded', () => {\n  const metaContainer = document.querySelector('.nk-hero__meta');\n  if (!metaContainer) return;\n\n  let isAnimating = false;\n  let animationFrameId;\n  let direction = 1; \/\/ 1 = droite, -1 = gauche\n  let speed = 0.5; \/\/ Vitesse divis\u00e9e par 3 (0.5 pixel par frame pour une douceur maximale)\n  let resumeTimeout;\n  let extremityTimeout; \/\/ Identifiant pour la pause aux extr\u00e9mit\u00e9s et au chargement\n  let isInteracting = false;\n  let isPausedAtExtremity = false; \/\/ Verrou de temporisation\n  let currentScroll = metaContainer.scrollLeft;\n\n  \/\/ Fonction d'animation \"va-et-vient\"\n  function autoScroll() {\n    if (isInteracting) return;\n    if (isPausedAtExtremity) {\n       animationFrameId = requestAnimationFrame(autoScroll);\n       return;\n    }\n    \n    \/\/ Si le conteneur ne d\u00e9borde pas (ex: sur PC), on ne fait rien\n    if (metaContainer.scrollWidth <= metaContainer.clientWidth) {\n       animationFrameId = requestAnimationFrame(autoScroll);\n       return;\n    }\n\n    currentScroll += speed * direction;\n    metaContainer.scrollLeft = Math.round(currentScroll);\n\n    const maxScroll = metaContainer.scrollWidth - metaContainer.clientWidth;\n\n    \/\/ PROTECTION ANTI-WORDPRESS : Remplacement des esperluettes \"&#038;&#038;\" par des IF imbriqu\u00e9s\n    if (direction === 1) {\n      if (metaContainer.scrollLeft >= maxScroll - 1) {\n        isPausedAtExtremity = true;\n        extremityTimeout = setTimeout(() => {\n          direction = -1;\n          currentScroll = metaContainer.scrollLeft;\n          isPausedAtExtremity = false;\n        }, 2000); \/\/ Attente de 2 secondes \u00e0 l'extr\u00e9mit\u00e9 droite\n      }\n    } else if (direction === -1) {\n      if (metaContainer.scrollLeft <= 1) {\n        isPausedAtExtremity = true;\n        extremityTimeout = setTimeout(() => {\n          direction = 1;\n          currentScroll = metaContainer.scrollLeft;\n          isPausedAtExtremity = false;\n        }, 2000); \/\/ Attente de 2 secondes \u00e0 l'extr\u00e9mit\u00e9 gauche\n      }\n    }\n\n    animationFrameId = requestAnimationFrame(autoScroll);\n  }\n\n  \/\/ D\u00e9marrer l'animation\n  function startAnimation() {\n    if (!isAnimating) {\n      isAnimating = true;\n      currentScroll = metaContainer.scrollLeft; \/\/ Synchronisation initiale\n      \n      \/\/ PAUSE INITIALE DE 2 SECONDES AU CHARGEMENT \/ APPARITION \u00c0 L'\u00c9CRAN\n      isPausedAtExtremity = true;\n      clearTimeout(extremityTimeout);\n      extremityTimeout = setTimeout(() => {\n        isPausedAtExtremity = false;\n      }, 2000);\n\n      autoScroll();\n    }\n  }\n\n  \/\/ Arr\u00eater l'animation\n  function stopAnimation() {\n    isAnimating = false;\n    cancelAnimationFrame(animationFrameId);\n  }\n\n  \/\/ Gestion des interactions (pause l'animation, puis la reprend)\n  function handleInteraction() {\n    isInteracting = true;\n    isPausedAtExtremity = false; \/\/ Reset de la pause en cas de geste\n    clearTimeout(extremityTimeout); \/\/ Annulation du d\u00e9lai d'attente initial ou d'extr\u00e9mit\u00e9\n    stopAnimation();\n    clearTimeout(resumeTimeout);\n    \n    \/\/ Reprise de l'animation apr\u00e8s 3 secondes d'inactivit\u00e9\n    resumeTimeout = setTimeout(() => {\n      isInteracting = false;\n      \/\/ Ne relance que si on est sur mobile\n      if (window.innerWidth <= 640) {\n        currentScroll = metaContainer.scrollLeft; \/\/ Resync\n        startAnimation();\n      }\n    }, 3000);\n  }\n\n  \/\/ Intersection Observer pour lancer l'animation uniquement si visible \u00e0 l'\u00e9cran\n  const observer = new IntersectionObserver((entries) => {\n    entries.forEach(entry => {\n      if (entry.isIntersecting) {\n        \/\/ Uniquement sur mobile\n        if (window.innerWidth <= 640) {\n            startAnimation();\n        }\n      } else {\n        stopAnimation();\n      }\n    });\n  }, { threshold: 0 });\n\n  observer.observe(metaContainer);\n\n  \/* \u00c9couteurs d'\u00e9v\u00e9nements corrig\u00e9s (touch uniquement pour \u00e9viter les conflits) *\/\n  metaContainer.addEventListener('touchstart', () => {\n    currentScroll = metaContainer.scrollLeft; \n    handleInteraction();\n  }, { passive: true });\n  \n  metaContainer.addEventListener('touchmove', () => {\n    currentScroll = metaContainer.scrollLeft; \n    handleInteraction();\n  }, { passive: true });\n  \n  metaContainer.addEventListener('wheel', handleInteraction, { passive: true });\n\n  \/\/ Reset ou d\u00e9marrage en cas de redimensionnement de la fen\u00eatre\n  window.addEventListener('resize', () => {\n    if (window.innerWidth > 640) {\n       stopAnimation();\n       metaContainer.scrollLeft = 0; \/\/ Remise \u00e0 z\u00e9ro si repasse sur Desktop\n       currentScroll = 0;\n    } else {\n       if (!isInteracting) {\n         startAnimation();\n       }\n    }\n  });\n});\n<\/script>\n\n\n\n<section class=\"nk-intro\">\n\n  <div class=\"nk-intro__inner\">\n\n    <div class=\"nk-intro__header\">\n\n      <h2 class=\"nk-intro__title avenirmedium-font\">\n\n        Val d&rsquo;Is\u00e8re: Norki\u2019s Craftsmanship\n\n        <span class=\"nk-intro__title-accent avenirmedium-font\">Elevates an <span class=\"baskerville-italic-font\">Alpine Icon<\/span><\/span>\n\n      <\/h2>\n\n    <\/div>\n\n    \n\n    <div class=\"nk-intro__content\">\n\n      <p class=\"nk-intro__paragraph\">\n\n        In the heart of the Haute-Tarentaise, where peaks meet the sky at 1,850 meters, <a href=\"https:\/\/www.valdisere.com\/en\/\" class=\"nk-intro__inline-link\" target=\"_blank\" rel=\"noopener\" title=\"Visit the official website of Val d'Is\u00e8re\">Val d\u2019Is\u00e8re<\/a> stands as the epicenter of authentic luxury. With its massive stone chalets, lauze-stone roofs, and Baroque church, the resort cultivates a mineral yet warm aesthetic. Within this snowy theater\u2014a winter \u00ab\u00a0Mecca of skiing\u00a0\u00bb and a verdant summer sanctuary in the Vanoise National Park\u2014lies an exceptional establishment: <a href=\"https:\/\/www.hotellesbarmes.com\/en\/\" class=\"nk-intro__inline-link\" target=\"_blank\" rel=\"noopener\" title=\"Visit the official website of Les Barmes de l'Ours\">Les Barmes de l\u2019Ours<\/a>.\n\n      <\/p>\n\n    <\/div>\n\n  <\/div>\n\n<\/section>\n\n<style>\n\n.nk-intro {\n\n  background-color: var(--color-norki-beige);\n\n  padding: var(--section-pad-v-dt) var(--section-pad-h-dt);\n\n  width: 100%;\n\n  display: flex;\n\n  justify-content: center;\n\n  box-sizing: border-box;\n\n}\n\n.nk-intro__inline-link {\n        color: inherit;\n        text-decoration: underline;\n        text-decoration-color: currentColor;\n        text-underline-offset: 3px;\n        text-decoration-thickness: 1px;\n        transition: text-decoration-color 0.3s ease, opacity 0.3s ease;\n        font-weight: 500;\n    }\n\n    .nk-intro__inline-link:hover {\n        text-decoration-color: transparent;\n        opacity: 0.7;\n    }\n.nk-intro__inner {\n\n  width: 100%;\n\n  display: grid;\n\n  grid-template-columns: 1fr 1.6fr; \/* Ratio asym\u00e9trique \u00e9l\u00e9gant *\/\n\n  gap: clamp(40px, 6vw, 100px); \/* Espacement horizontal fluide *\/\n\n  align-items: stroke;\n\n}\n\n\n\/* Colonne de gauche : Titre *\/\n\n.nk-intro__header {\n\n  display: flex;\n\n  flex-direction: column;\n\n  justify-content: flex-start;\n\n}\n\n\n.nk-intro__title {\n\n  font-size: clamp(1.4rem, 2.2vw, 25px);\n\n  line-height: 1.25;\n\n  color: #000000;\n\n  font-weight: normal;\n\n  letter-spacing: -0.01em;\n\n  margin: 0 !important; \/* Neutralise les surcharges th\u00e8mes *\/\n\n}\n\n\n.nk-intro__title-accent {\n\n  display: block;\n\n  font-size: 0.95em; \/* L\u00e9g\u00e8rement plus petit et subtil *\/\n\n  color: #000000;\n\n}\n\n\n\/* Colonne de droite : Paragraphes *\/\n\n.nk-intro__content {\n\n  display: flex;\n\n  flex-direction: column;\n\n  gap: 24px; \/* Espace \u00e9quilibr\u00e9 entre les blocs de texte *\/\n\n  justify-content: flex-start;\n\n}\n\n\n.nk-intro__paragraph {\n\n  font-size: clamp(0.92rem, 1.1vw, 1.05rem);\n\n  line-height: 1.7;\n\n  color: #000000;\n\n  letter-spacing: 0.01em;\n\n  max-width: 80%;\n\n  margin: 0 !important;\n\n}\n\n\n\/* ============================================\n\n  RESPONSIVE TABLETTE (\u2264 1024px)\n\n============================================ *\/\n\n@media (max-width: 1024px) {\n\n  .nk-intro {\n\n    padding: var(--section-pad-v-tab) var(--section-pad-h-tab);\n\n  }\n\n  \n\n  .nk-intro__inner {\n\n    grid-template-columns: 1fr; \/* Passage sur une colonne *\/\n\n    gap: 32px;\n\n  }\n\n  \n\n  .nk-intro__title {\n\n    max-width: 90%;\n\n  }\n\n\n  .nk-intro__paragraph {\n\n    text-align: left; \/* Plus naturel sur \u00e9crans moyens et tactiles *\/\n\n  }\n\n}\n\n\n\/* ============================================\n\n  RESPONSIVE MOBILE (\u2264 640px)\n\n============================================ *\/\n\n@media (max-width: 640px) {\n\n  .nk-intro {\n\n    padding: var(--section-pad-v-mob) var(--section-pad-h-mob);\n\n  }\n\n  \n\n  .nk-intro__inner {\n\n    gap: 24px;\n\n  }\n\n  \n\n  .nk-intro__title {\n\n    max-width: 100%;\n\n  }\n\n  \n\n  .nk-intro__title-accent {\n\n    margin-top: 4px;\n\n  }\n\n}\n\n<\/style>\n\n\n\n<section class=\"nk-simple-image\">\n  <!-- Image cliquable -->\n  <a href=\"https:\/\/www.norki.com\/en\/custom-made-upholstery\/bespoke-upholstery-services\/\" class=\"nk-simple-image__wrapper\" title=\"Discover bespoke upholstery\">\n    <img decoding=\"async\" src=\"https:\/\/www.norki.com\/sur-mesure\/wp-content\/uploads\/2026\/07\/Restaurant-Val-d-isere.jpg\" alt=\"Bespoke upholstery and custom banquettes for the gourmet restaurant by Maison Norki\" class=\"nk-simple-image__img\" loading=\"lazy\">\n  <\/a>\n  \n  <!-- L\u00e9gende cliquable avec le style \u00e9ditorial demand\u00e9 -->\n  <div class=\"nk-simple-image__caption\">\n    <a href=\"https:\/\/www.norki.com\/en\/custom-made-upholstery\/bespoke-upholstery-services\/\" class=\"nk-editorial-inline-link\" title=\"Discover bespoke upholstery\">\n      Bespoke upholstery for banquettes\n    <\/a>\n  <\/div>\n<\/section>\n\n<style>\n\/* ============================================\n  COMPOSANT : SECTION IMAGE UNIQUE IMMERSIVE\n============================================ *\/\n.nk-simple-image {\n  width: 100%;\n  background-color: var(--color-norki-beige, #f8f0ea);\n  line-height: 0; \/* \u00c9vite un d\u00e9calage de pixel parasite sous l'image *\/\n  overflow: hidden;\n  padding-bottom: 15px; \/* Espace de respiration sous la l\u00e9gende *\/\n}\n\n.nk-simple-image__wrapper {\n  display: block; \/* N\u00e9cessaire pour la balise <a> cliquable *\/\n  width: 100%;\n  height: 85vh; \/* Hauteur immersive et \u00e9l\u00e9gante sur PC *\/\n  min-height: 500px;\n  overflow: hidden;\n}\n\n.nk-simple-image__img {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  object-position: center center; \/* Centrage \u00e9quilibr\u00e9 par d\u00e9faut sur PC *\/\n  transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1);\n}\n\n\/* L\u00e9ger effet de zoom luxueux et fluide au survol *\/\n.nk-simple-image__wrapper:hover .nk-simple-image__img {\n  transform: scale(1.02);\n}\n\n\/* Styles des l\u00e9gendes sous les images *\/\n.nk-simple-image__caption {\n  display: block;\n  font-size: 0.8rem; \n  font-style: italic;\n  margin-top: 10px;\n  text-align: right;\n  color: #000;\n  line-height: normal; \/* Annule le line-height 0 du parent pour l'affichage de texte *\/\n  padding-right: var(--section-pad-h-dt, 5vw); \/* Alignement sur la grille \u00e0 droite *\/\n}\n\n\/* Style de lien \u00e9ditorial demand\u00e9 *\/\n.nk-editorial-inline-link {\n  color: inherit;\n  text-decoration: underline;\n  text-decoration-color: currentcolor;\n  text-decoration-thickness: auto;\n  text-decoration-color: currentColor;\n  text-underline-offset: 3px;\n  text-decoration-thickness: 1px;\n  transition: text-decoration-color 0.3s ease, opacity 0.3s ease;\n}\n\n.nk-editorial-inline-link:hover {\n  text-decoration-color: #fff0;\n  opacity: .7;\n}\n\n\/* ============================================\n  RESPONSIVE MOBILE ET TABLETTE\n============================================ *\/\n@media (max-width: 1024px) {\n  .nk-simple-image__caption {\n    padding-right: var(--section-pad-h-tab, 4vw);\n  }\n}\n\n@media (max-width: 767px) {\n  .nk-simple-image__caption {\n    padding-right: var(--section-pad-h-mob, 20px);\n  }\n}\n\n@media (max-width: 640px) {\n  .nk-simple-image__wrapper {\n    height: 70vh; \/* Hauteur ajust\u00e9e pour un cadrage vertical sur mobile *\/\n    min-height: 400px;\n  }\n\n  .nk-simple-image__img {\n    \/* Alignement \u00e0 gauche forc\u00e9 pour conserver le mobilier et la table dans le cadre *\/\n    object-position: left center;\n  }\n}\n<\/style>\n\n\n\n<section class=\"nk-architecture\">\n  <div class=\"nk-architecture__inner\">\n    \n    <!-- Left Column: Image -->\n    <div class=\"nk-architecture__media\">\n      <img decoding=\"async\" src=\"https:\/\/www.norki.com\/sur-mesure\/wp-content\/uploads\/2026\/07\/luxury-hide-decoration-hotel.jpg\" alt=\"An Architecture of Emotion by Studio Chalet Norki\" class=\"nk-architecture__img\" loading=\"lazy\">\n    <\/div>\n\n    <!-- Right Column: Content -->\n    <div class=\"nk-architecture__content\">\n      \n      <!-- Top Text Block -->\n      <div class=\"nk-architecture__text-top\">\n        <h2 class=\"nk-architecture__title avenirmedium-font\">\n          An Architecture of Emotion\n        <\/h2>\n        <p class=\"nk-architecture__paragraph\">\n          Opened twenty years ago, this Relais &amp; Ch\u00e2teaux\u2014recently awarded a prestigious Michelin Key\u2014redefines the art of hospitality. Its name, a tribute to the protective \u00ab\u00a0dens\u00a0\u00bb (barmes) of the mountain&rsquo;s bears, sets the tone: a cocoon of serenity. The interior architecture, orchestrated by the incomparable cabinetmaker-poet Christophe Mattis, emphasizes the nobility of raw materials. Under the majestic Bellevarde Rock, the 76 rooms and suites, along with the 1,000 m\u00b2 Sisley spa, invite a tactile contemplation.\n        <\/p>\n      <\/div>\n\n      <!-- Bottom Text & CTA Block -->\n      <div class=\"nk-architecture__text-bottom\">\n        <p class=\"nk-architecture__cta-text baskerville-italic-font\">\n          Contact our design office to bring your high-end<br class=\"nk-desktop-br\"> interior projects to life\n        <\/p>\n        <a href=\"https:\/\/www.norki.com\/en\/contact-us\/\" class=\"norki-btn\" title=\"Contact Studio Chalet\">\n          Contact Studio Chalet\n        <\/a>\n      <\/div>\n\n    <\/div>\n  <\/div>\n<\/section>\n\n<style>\n\/* ============================================\n   COMPOSANT : SECTION ARCHITECTURE \/ TEXTE-IMAGE\n============================================ *\/\n.nk-architecture {\n  background-color: var(--color-norki-beige, #f8f0ea);\n  padding: var(--section-pad-v-dt, 80px) var(--section-pad-h-dt, 5vw);\n  width: 100%;\n  display: flex;\n  justify-content: center;\n  box-sizing: border-box;\n}\n\n.nk-architecture__inner {\n  width: 100%;\n  display: grid;\n  grid-template-columns: 1fr 1fr; \/* 50\/50 split classique *\/\n  gap: clamp(40px, 6vw, 80px); \/* Espacement fluide entre image et texte *\/\n  align-items: stroke; \/* Permet \u00e0 la colonne texte de prendre la m\u00eame hauteur que l'image *\/\n}\n\n\/* Image *\/\n.nk-architecture__media {\n  width: 100%;\n  height: 100%;\n}\n\n.nk-architecture__img {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  object-position: center;\n  display: block;\n}\n\n\/* Colonne Contenu (Droite) *\/\n.nk-architecture__content {\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between; \/* Disperse le texte en haut et le CTA en bas *\/\n  padding-top: 10px; \/* Ajustement visuel avec le haut de l'image *\/\n  padding-bottom: 20px; \/* Ajustement visuel avec le bas de l'image *\/\n}\n\n\/* Bloc Texte Haut *\/\n.nk-architecture__text-top {\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n}\n\n.nk-architecture__title {\n  font-size: clamp(1.4rem, 2.2vw, 25px); \/* Reprise de votre syst\u00e8me de typo *\/\n  line-height: 1.25;\n  color: #000000;\n  font-weight: normal;\n  letter-spacing: -0.01em;\n  margin: 0 !important;\n}\n\n.nk-architecture__paragraph {\n  font-size: 0.95rem;\n  color: #000000;\n  letter-spacing: 0.01em;\n  max-width: 88%; \/* Respect de la largeur de texte contrainte vue sur l'image *\/\n  margin: 0 !important;\n}\n\n.nk-architecture__highlight {\n  color: #e3000f; \/* Rouge fid\u00e8le \u00e0 la maquette *\/\n}\n\n\/* Bloc CTA Bas *\/\n.nk-architecture__text-bottom {\n  display: flex;\n  flex-direction: column;\n  align-items: center; \/* Centrage horizontal du texte et bouton *\/\n  text-align: center;\n  margin-top: 40px; \/* Espace de s\u00e9curit\u00e9 naturel si l'image devenait tr\u00e8s courte *\/\n}\n\n.nk-architecture__cta-text {\n  font-size: clamp(1.3rem, 1.8vw, 24px); \n  line-height: 1.35;\n  color: #000000;\n  margin: 0 0 25px 0 !important;\n  font-weight: normal;\n}\n\n\/* Bouton Sp\u00e9cifique Norki (Code strictement repris) *\/\n.norki-btn {\n  display: block;\n  background-color: black;\n  color: #fff !important;\n  border: 1px solid #000;\n  padding: 4px 35px;\n  text-align: center;\n  text-decoration: none;\n  font-size: 0.9rem;\n  font-style: normal;\n  transition: all 0.3s ease;\n  box-sizing: border-box;\n  \n  \/* Astuce : max-content et margin auto permettent au display:block d'avoir la bonne largeur et d'\u00eatre centr\u00e9 *\/\n  width: max-content; \n  margin: 0 auto;\n}\n\n.norki-btn:hover {\n  background-color: transparent;\n  color: #000 !important;\n}\n\n\/* ============================================\n    RESPONSIVE TABLETTE (\u2264 1024px)\n============================================ *\/\n@media (max-width: 1024px) {\n  .nk-architecture {\n    padding: var(--section-pad-v-tab, 60px) var(--section-pad-h-tab, 4vw);\n  }\n  .nk-architecture__inner {\n    grid-template-columns: 1fr; \/* Passage sur une seule colonne *\/\n    gap: 40px;\n  }\n  .nk-architecture__content {\n    justify-content: flex-start; \/* Annule l'espacement vertical forc\u00e9 sur mobile *\/\n    gap: 60px; \/* Espace manuel entre le haut et le CTA *\/\n    padding: 0;\n  }\n  .nk-architecture__paragraph {\n    max-width: 100%;\n  }\n  .nk-desktop-br {\n    display: none; \/* Laisse le texte couler naturellement sur les petits \u00e9crans *\/\n  }\n}\n\n\/* ============================================\n    RESPONSIVE MOBILE (\u2264 640px)\n============================================ *\/\n@media (max-width: 640px) {\n  .nk-architecture {\n    padding: var(--section-pad-v-mob, 40px) var(--section-pad-h-mob, 20px);\n  }\n  .nk-architecture__content {\n    gap: 40px;\n  }\n  .nk-architecture__cta-text {\n    font-size: 1.2rem;\n  }\n}\n<\/style>\n\n\n\n<section class=\"nk-sig\">\n    <div class=\"nk-sig__container\">\n        \n        <!-- En-t\u00eate avec textes officiels de la maquette (image_3bf13d.jpg) -->\n        <div class=\"nk-sig__header\">\n            <h2 class=\"nk-sig__title avenirmedium-font\">\n                The Norki Signature: Noble Materials and Bespoke Design\n            <\/h2>\n            \n            <div class=\"nk-sig__text-grid\">\n                <!-- Colonne Gauche -->\n                <div class=\"nk-sig__text-col\">\n                    <p class=\"nk-sig__text\">\n                        Norki\u2019s expertise was called upon to perfect the sensory harmony of the hotel. In our workshops, each piece was designed as a punctuation of comfort and sophisticated design:\n                    <\/p>\n                    <p class=\"nk-sig__text\">\n                        <strong>Culinary Comfort:<\/strong> For the restaurant La Fromagerie, Norki crafted bespoke banquettes, blending ergonomics with Alpine aesthetics, inviting guests to linger after a day on the slopes.\n                    <\/p>\n                    <p class=\"nk-sig__text\">\n                        <strong>Contrast and Texture:<\/strong> Exclusive armchairs pair the opulence of long-haired white sheepskin with vibrant orange velvet\u2014the hotel\u2019s signature hue. This dialogue between natural fiber and silky textile perfectly embodies the spirit of the project.\n                    <\/p>\n                <\/div>\n                \n                <!-- Colonne Droite -->\n                <div class=\"nk-sig__text-col\">\n                    <p class=\"nk-sig__text\">\n                        <strong>Bespoke Leisure:<\/strong> The exclusive game tables, centerpieces of the lounge, feature tops clad in high-end leather, supported by deep-lacquered bases.\n                    <\/p>\n                    <p class=\"nk-sig__text\">\n                        <strong>Prestigious Accents:<\/strong> A constellation of sheepskin cushions and carefully placed pelts enhance the \u00ab\u00a0hygge\u00a0\u00bb and luxurious atmosphere of the communal spaces.\n                    <\/p>\n                    <p class=\"nk-sig__text\">\n                        Through this collaboration, Norki reaffirms its mastery of textures and its ability to engage with the most demanding architectures.\n                    <\/p>\n                <\/div>\n            <\/div>\n        <\/div>\n\n        <div class=\"nk-sig__slider-area\" id=\"sig-slider\">\n            \n            <!-- Navigation (Masqu\u00e9e sur PC car 3\/3 slides visibles) -->\n            <div class=\"nk-sig__nav-bar\">\n                <div class=\"nk-sig__arrows\">\n                    <button class=\"nk-sig__prev\" aria-label=\"Previous slide\">\n                        <svg viewBox=\"0 0 24 24\"><path d=\"M15 18l-6-6 6-6\"><\/path><\/svg>\n                    <\/button>\n                    <button class=\"nk-sig__next\" aria-label=\"Next slide\">\n                        <svg viewBox=\"0 0 24 24\"><path d=\"M9 18l6-6-6-6\"><\/path><\/svg>\n                    <\/button>\n                <\/div>\n            <\/div>\n\n            <div class=\"nk-sig__carousel-viewport\">\n                <div class=\"nk-sig__carousel-track\">\n                    \n                    <!-- Slide 1 (Gauche) - Fauteuils exclusifs sur mesure -->\n                    <article class=\"nk-sig__slide nk-sig__slide--1\">\n                        <a href=\"https:\/\/www.norki.com\/en\/custom-made-upholstery\/contact-us\/\" class=\"nk-sig__image-link\" aria-label=\"Contact Norki for bespoke exclusive armchairs\">\n                            <img decoding=\"async\" data-src=\"https:\/\/www.norki.com\/sur-mesure\/wp-content\/uploads\/2026\/07\/Restaurent-les-Barmes-de-l-ours.jpg\" src=\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' viewBox='0 0 3 4'%3E%3C\/svg%3E\" alt=\"Bespoke exclusive armchairs\" class=\"norki-lazy\">\n                        <\/a>\n                        <div class=\"nk-sig__caption avenirmedium-font\">\n                            <span>Bespoke armchairs<\/span>\n                            <a href=\"https:\/\/www.norki.com\/en\/custom-made-upholstery\/contact-us\/\">Contact us<\/a>\n                        <\/div>\n                    <\/article>\n\n                    <!-- Slide 2 (Centre) - Table de jeu sur mesure -->\n                    <article class=\"nk-sig__slide nk-sig__slide--2\">\n                        <a href=\"https:\/\/www.norki.com\/en\/custom-made-upholstery\/contact-us\/\" class=\"nk-sig__image-link\" aria-label=\"Contact Norki for a bespoke game table\">\n                            <img decoding=\"async\" data-src=\"https:\/\/www.norki.com\/sur-mesure\/wp-content\/uploads\/2026\/07\/Fauteuil-mouton-hotel.jpg\" src=\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' viewBox='0 0 3 4'%3E%3C\/svg%3E\" alt=\"Bespoke game table\" class=\"norki-lazy\">\n                        <\/a>\n                        <div class=\"nk-sig__caption avenirmedium-font\">\n                            <span>Bespoke game table<\/span>\n                            <a href=\"https:\/\/www.norki.com\/en\/custom-made-upholstery\/contact-us\/\">Contact us<\/a>\n                        <\/div>\n                    <\/article>\n\n                    <!-- Slide 3 (Droite) - Banquette sur mesure -->\n                    <article class=\"nk-sig__slide nk-sig__slide--3\">\n                        <a href=\"https:\/\/www.norki.com\/en\/custom-made-upholstery\/contact-us\/\" class=\"nk-sig__image-link\" aria-label=\"Contact Norki for bespoke banquettes\">\n                            <img decoding=\"async\" data-src=\"https:\/\/www.norki.com\/sur-mesure\/wp-content\/uploads\/2026\/07\/Restaurent-la-fromagerie-banquettes-peau-lainee.jpg\" src=\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' viewBox='0 0 3 4'%3E%3C\/svg%3E\" alt=\"Bespoke banquette\" class=\"norki-lazy\">\n                        <\/a>\n                        <div class=\"nk-sig__caption avenirmedium-font\">\n                            <span>Bespoke banquette<\/span>\n                            <a href=\"https:\/\/www.norki.com\/en\/custom-made-upholstery\/contact-us\/\">Contact us<\/a>\n                        <\/div>\n                    <\/article>\n\n                <\/div>\n            <\/div>\n        <\/div>\n\n    <\/div>\n<\/section>\n\n<style>\n\/* ============================================\n   COMPOSANT : SIGNATURE GLOBALE (Styles Principaux)\n============================================ *\/\n.nk-sig {\n    padding-top: 0;\n    padding-bottom: var(--section-pad-v-dt, 80px);\n    padding-left: var(--section-pad-h-dt, 5vw);\n    padding-right: var(--section-pad-h-dt, 5vw);\n    background-color: var(--color-norki-beige, #f8f0ea);\n    color: #000000;\n    box-sizing: border-box;\n    overflow: hidden;\n    font-family: Arial, sans-serif; \/* Fallback si avenirmedium-font n'est pas dispo *\/\n}\n\n.nk-sig * {\n    box-sizing: border-box;\n}\n\n.nk-sig__container {\n    margin: 0 auto;\n    width: 100%;\n}\n\n\/* --- EN-T\u00caTE \/ TEXTE --- *\/\n.nk-sig__header {\n    width: 100%;\n    margin-bottom: 60px;\n}\n\n.nk-sig__title {\n    font-size: clamp(1.4rem, 2.5vw, 35px);\n    font-weight: normal;\n    margin-top: 0;\n    margin-bottom: 25px;\n    letter-spacing: -0.01em;\n    line-height: 1.25;\n}\n\n\/* Grille ajout\u00e9e pour les paragraphes (2 colonnes sur PC) *\/\n.nk-sig__text-grid {\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    gap: 40px 80px; \/* 40px vertical, 80px horizontal *\/\n    max-width: 1100px;\n}\n\n.nk-sig__text-col {\n    display: flex;\n    flex-direction: column;\n    gap: 16px;\n}\n\n.nk-sig__text {\n    font-size: 0.95rem;\n    margin: 0;\n    text-align: justify;\n}\n\n\/* --- DESIGN SYSTEM : LIENS INLINE --- *\/\n.nk-sig__inline-link {\n    color: inherit;\n    text-decoration: underline;\n    text-decoration-color: currentColor;\n    text-underline-offset: 3px;\n    text-decoration-thickness: 1px;\n    transition: text-decoration-color 0.3s ease, opacity 0.3s ease;\n    font-weight: bold;\n}\n\n.nk-sig__inline-link:hover {\n    text-decoration-color: transparent;\n    opacity: 0.7;\n}\n\n\/* --- CARROUSEL --- *\/\n.nk-sig__slider-area {\n    position: relative;\n    width: 100%;\n}\n\n.nk-sig__nav-bar {\n    display: flex;\n    justify-content: flex-end;\n    align-items: center;\n    margin-bottom: 15px;\n}\n\n.nk-sig__arrows {\n    display: flex;\n    gap: 15px;\n    margin-right: -12px;\n}\n\n.nk-sig__arrows button {\n    background: none;\n    border: none;\n    color: #000000;\n    cursor: pointer;\n    padding: 5px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    transition: opacity 0.3s ease;\n}\n\n.nk-sig__arrows button:hover { opacity: 0.6; }\n\n.nk-sig__arrows svg {\n    width: 26px;\n    height: 26px;\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 1.2;\n}\n\n.nk-sig__carousel-viewport {\n    overflow: hidden;\n    touch-action: pan-y;\n    margin: 0 -15px;\n}\n\n.nk-sig__carousel-track {\n    display: flex;\n    will-change: transform;\n}\n\n.nk-sig__slide {\n    padding: 0 15px;\n    display: flex;\n    flex-direction: column;\n}\n\n\/* --- DESIGN SYSTEM : CONTENEUR D'IMAGE AVEC RECOUVREMENT --- *\/\n.nk-sig__image-link {\n    display: block;\n    width: 100%;\n    aspect-ratio: 3 \/ 4;\n    overflow: hidden;\n    position: relative;\n    border-radius: 4px;\n    background-color: rgba(0, 0, 0, 0.05);\n}\n\n\/* --- DESIGN SYSTEM : ANIMATION D'IMAGE --- *\/\n.nk-sig__slide img {\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n    display: block;\n    opacity: 0;\n    transition: opacity 0.5s ease-in-out, transform 0.6s ease;\n    will-change: opacity, transform;\n}\n\n\/* LoadFade TriggerClass *\/\n.nk-sig__slide img.norki-loaded {\n    opacity: 1;\n}\n\n\/* HoverZoom *\/\n.nk-sig__image-link:hover img {\n    transform: scale(1.03);\n}\n\n\/* --- CADRAGES ET ALIGNEMENTS INDIVIDUELS --- *\/\n.nk-sig__slide--1 img { object-position: center; }\n.nk-sig__slide--2 img { object-position: center; }\n.nk-sig__slide--3 img { object-position: center; }\n\n\/* --- CAPTIONS SOUS LES IMAGES --- *\/\n.nk-sig__caption {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding-top: 15px;\n    padding-left: 23px;\n    padding-right: 23px;\n    font-size: 0.85rem;\n    color: #000000;\n}\n\n.nk-sig__caption span {\n    font-weight: 500;\n    letter-spacing: 0.02em;\n}\n\n.nk-sig__caption a {\n    color: #000000;\n    text-decoration: underline;\n    text-underline-offset: 4px;\n    text-decoration-thickness: 1.5px;\n    transition: opacity 0.3s ease;\n}\n\n.nk-sig__caption a:hover {\n    opacity: 0.6;\n}\n\n\/* ============================================\n    RESPONSIVE TABLETTE (\u2264 1024px)\n============================================ *\/\n@media (max-width: 1024px) {\n    .nk-sig__arrows button:hover { opacity: 1; }\n    .nk-sig {\n        padding-bottom: var(--section-pad-v-tab, 60px);\n        padding-left: var(--section-pad-h-tab, 4vw);\n        padding-right: var(--section-pad-h-tab, 4vw);\n    }\n    \n    .nk-sig__header {\n        margin-bottom: 40px;\n    }\n\n    .nk-sig__text-grid {\n        gap: 30px;\n    }\n    \n    .nk-sig__caption {\n        padding-left: 20px;\n        padding-right: 20px;\n    }\n}\n\n\/* ============================================\n    RESPONSIVE MOBILE (\u2264 768px)\n============================================ *\/\n@media (max-width: 768px) {\n    .nk-sig {\n        padding-bottom: var(--section-pad-v-mob, 50px);\n        padding-left: var(--section-pad-h-mob, 20px);\n        padding-right: var(--section-pad-h-mob, 20px);\n    }\n\n    .nk-sig__text-grid {\n        grid-template-columns: 1fr;\n        gap: 16px;\n    }\n\n    .nk-sig__text {\n        text-align: left;\n    }\n    \n    .nk-sig__carousel-viewport {\n        margin: 0 -5px;\n    }\n\n    .nk-sig__slide {\n        padding: 0 5px;\n    }\n\n    .nk-sig__image-link {\n        aspect-ratio: 4 \/ 5;\n        height: auto;\n    }\n\n    .nk-sig__caption {\n        padding: 15px 20px;\n    }\n}\n<\/style>\n\n<script>\ndocument.addEventListener('DOMContentLoaded', () => {\n\n    \/* =========================================================\n        GESTION DU CARROUSEL (Adaptatif 3 \/ 2 \/ 1)\n       ========================================================= *\/\n    const container = document.getElementById('sig-slider');\n    if (!container) return;\n\n    const track = container.querySelector('.nk-sig__carousel-track');\n    const originalSlides = Array.from(container.querySelectorAll('.nk-sig__slide'));\n    const totalOriginal = originalSlides.length;\n    const navBar = container.querySelector('.nk-sig__nav-bar');\n\n    \/\/ Clonage pour l'effet de boucle infinie\n    originalSlides.forEach(slide => {\n        const clone = slide.cloneNode(true);\n        clone.classList.add('norki-clone');\n        clone.setAttribute('aria-hidden', 'true');\n        track.appendChild(clone);\n    });\n    originalSlides.slice().reverse().forEach(slide => {\n        const clone = slide.cloneNode(true);\n        clone.classList.add('norki-clone');\n        clone.setAttribute('aria-hidden', 'true');\n        track.insertBefore(clone, track.firstChild);\n    });\n\n    const allSlides = Array.from(container.querySelectorAll('.nk-sig__slide'));\n\n    const getSlidesPerView = () => {\n        if (window.innerWidth > 1024) return 3; \/\/ PC\n        if (window.innerWidth > 768) return 2;  \/\/ Tablette\n        return 1;                               \/\/ Mobile\n    };\n\n    let itemsPerView = getSlidesPerView();\n    let itemWidthPct = 100 \/ itemsPerView;\n    allSlides.forEach(s => s.style.flex = `0 0 ${itemWidthPct}%`);\n    \n    let currentIndex = totalOriginal; \n    let isAnimating = false;\n\n    \/\/ Masque\/Affiche la navigation si toutes les slides sont visibles\n    const updateNavVisibility = () => {\n        if (itemsPerView >= totalOriginal) {\n            navBar.style.display = 'none'; \n        } else {\n            navBar.style.display = 'flex';\n        }\n    };\n\n    const updateCarousel = (instant = false) => {\n        updateNavVisibility();\n        \n        if (itemsPerView >= totalOriginal) {\n            currentIndex = totalOriginal; \n            track.style.transition = 'none';\n            track.style.transform = `translateX(-${currentIndex * itemWidthPct}%)`;\n            return;\n        }\n\n        track.style.transition = instant ? 'none' : 'transform 0.5s cubic-bezier(0.4, 0.0, 0.2, 1)';\n        track.style.transform = `translateX(-${currentIndex * itemWidthPct}%)`;\n    };\n\n    updateCarousel(true);\n\n    const moveNext = () => {\n        if (isAnimating || itemsPerView >= totalOriginal) return;\n        isAnimating = true;\n        currentIndex++;\n        updateCarousel();\n    };\n\n    const movePrev = () => {\n        if (isAnimating || itemsPerView >= totalOriginal) return;\n        isAnimating = true;\n        currentIndex--;\n        updateCarousel();\n    };\n\n    container.querySelector('.nk-sig__next').addEventListener('click', moveNext);\n    container.querySelector('.nk-sig__prev').addEventListener('click', movePrev);\n\n    track.addEventListener('transitionend', (e) => {\n        if (e.propertyName !== 'transform') return;\n        isAnimating = false;\n        \n        if (currentIndex <= 0) {\n            currentIndex = totalOriginal;\n            updateCarousel(true);\n        } \n        else if (currentIndex >= totalOriginal * 2) {\n            currentIndex = totalOriginal;\n            updateCarousel(true);\n        }\n    });\n\n    \/\/ Gestion Resize\n    window.addEventListener('resize', () => {\n        const newItemsPerView = getSlidesPerView();\n        if (newItemsPerView !== itemsPerView) {\n            itemsPerView = newItemsPerView;\n            itemWidthPct = 100 \/ itemsPerView;\n            allSlides.forEach(s => s.style.flex = `0 0 ${itemWidthPct}%`);\n            updateCarousel(true);\n        }\n    });\n\n    \/\/ Gestion Swipe Tactile\n    let startX = 0, endX = 0;\n    const swipeThreshold = 40;\n\n    track.addEventListener('touchstart', (e) => {\n        if (itemsPerView >= totalOriginal) return; \n        startX = e.touches[0].clientX;\n    }, { passive: true });\n    \n    track.addEventListener('touchend', (e) => {\n        if (itemsPerView >= totalOriginal) return;\n        endX = e.changedTouches[0].clientX;\n        const diff = startX - endX;\n        if (Math.abs(diff) > swipeThreshold) {\n            if (diff > 0) moveNext();\n            else movePrev();\n        }\n    });\n\n    \/* =========================================================\n        LAZY LOADING DES IMAGES\n       ========================================================= *\/\n    const imageObserver = new IntersectionObserver((entries, observer) => {\n        entries.forEach(entry => {\n            if (entry.isIntersecting) {\n                const img = entry.target;\n                if (img.dataset.src) {\n                    img.onload = () => img.classList.add('norki-loaded');\n                    img.src = img.dataset.src;\n                    img.removeAttribute('data-src');\n                    observer.unobserve(img);\n                }\n            }\n        });\n    }, { root: null, rootMargin: '0px 100% 0px 100%', threshold: 0 });\n    \n    document.querySelectorAll('.norki-lazy').forEach(img => {\n        imageObserver.observe(img);\n    });\n\n});\n<\/script>\n\n\n\n<section class=\"nk-map\">\n    <div class=\"nk-map__inner\">\n        \n        <!-- World map (Hidden on mobile) -->\n        <div class=\"nk-map__world\">\n            <a href=\"https:\/\/www.valdisere.com\/en\/\" class=\"nk-map__world-link\" aria-label=\"View the Val d'Is\u00e8re hotel project on the world map\">\n                <img decoding=\"async\" src=\"https:\/\/www.norki.com\/sur-mesure\/wp-content\/uploads\/2026\/07\/Carte-du-monde-Val-disere.png\" alt=\"World map localizing Val d'Is\u00e8re\" class=\"nk-map__world-img\" loading=\"lazy\">\n            <\/a>\n        <\/div>\n\n        <!-- Detailed zoom (Circle) -->\n        <div class=\"nk-map__detail\">\n            <span class=\"nk-map__title avenirmedium-font\">\n                Hotel Project in <span class=\"baskerville-italic-font\">Val d\u2019Is\u00e8re<\/span>\n            <\/span>\n            <div class=\"nk-map__circle\">\n                <a href=\"https:\/\/www.valdisere.com\/en\/\" class=\"nk-map__circle-link\" aria-label=\"Zoom on the exceptional hotel project in Val d'Is\u00e8re\">\n                    <img decoding=\"async\" src=\"https:\/\/www.norki.com\/sur-mesure\/wp-content\/uploads\/2026\/07\/Carte-europe-Val-disere.png\" alt=\"Zoom on the map of Val d'Is\u00e8re\" class=\"nk-map__circle-img\" loading=\"lazy\">\n                <\/a>\n            <\/div>\n        <\/div>\n\n    <\/div>\n<\/section>\n\n<style>\n\/* ============================================\n   COMPOSANT : CARTE DE LOCALISATION\n============================================ *\/\n.nk-map {\n    padding-top: 0;\n    padding-bottom: var(--section-pad-v-dt, 80px);\n    padding-left: var(--section-pad-h-dt, 5vw);\n    padding-right: var(--section-pad-h-dt, 5vw);\n    background-color: var(--color-norki-beige, #f8f0ea);\n    color: #000000;\n    box-sizing: border-box;\n}\n\n.nk-map * {\n    box-sizing: border-box;\n}\n\n.nk-map__inner {\n    margin: 0 auto;\n    display: grid;\n    grid-template-columns: 2fr 1fr; \/* Ratio PC : la carte du monde prend plus de place *\/\n    gap: 20px;\n    align-items: center;\n}\n\n\/* --- CARTE DU MONDE (Gauche) --- *\/\n.nk-map__world {\n    width: 100%;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n}\n\n\/* Lien enveloppant la carte mondiale *\/\n.nk-map__world-link {\n    display: block;\n    width: 100%;\n    cursor: pointer;\n    overflow: hidden;\n}\n\n.nk-map__world-img {\n    width: 100%;\n    height: auto;\n    display: block;\n    object-fit: contain;\n    \/* Transition de micro-interaction douce et continue *\/\n    transition: transform 0.6s ease, opacity 0.6s ease;\n}\n\n\/* Animation subtile au survol de la carte mondiale *\/\n.nk-map__world-link:hover .nk-map__world-img {\n    transform: scale(1.01);\n    opacity: 0.92;\n}\n\n\/* --- ZOOM D\u00c9TAILL\u00c9 (Droite) --- *\/\n.nk-map__detail {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    width: 100%;\n}\n\n.nk-map__title {\n    font-size: clamp(1.5rem, 2.2vw, 28px);\n    font-weight: normal;\n    margin-top: 0;\n    margin-bottom: 25px;\n    letter-spacing: 0.02em;\n    text-align: center;\n    color: #000000;\n}\n\n.nk-map__circle {\n    width: 100%;\n    max-width: 420px; \/* Limite la taille du cercle sur grand \u00e9cran *\/\n    aspect-ratio: 1 \/ 1;\n    border-radius: 50%;\n    overflow: hidden; \/* D\u00e9coupe parfaite demand\u00e9e *\/\n    border: 1px solid rgba(0, 0, 0, 0.8); \/* Fine bordure sombre fa\u00e7on maquette *\/\n    background-color: var(--color-norki-beige, #f8f0ea);\n    display: flex;\n    justify-content: center;\n    align-items: center;\n}\n\n\/* Lien enveloppant le cercle *\/\n.nk-map__circle-link {\n    display: block;\n    width: 100%;\n    height: 100%;\n    cursor: pointer;\n    overflow: hidden;\n    border-radius: 50%; \/* Force la rondeur du focus et de la zone cliquable *\/\n}\n\n.nk-map__circle-img {\n    width: 102%; \/* L\u00e9g\u00e8rement > 100% pour \u00e9viter les liser\u00e9s de pixel blanc aux bords *\/\n    height: 102%;\n    object-fit: cover;\n    object-position: 20% center; \/* Cadrage optimal \u00e0 20% pour centrer la principaut\u00e9 d'Andorre *\/\n    \/* Transition d'animation HoverZoom issue de la DA *\/\n    transition: transform 0.6s ease;\n}\n\n\/* Animation d'impact au survol sur le zoom circulaire *\/\n.nk-map__circle-link:hover .nk-map__circle-img {\n    transform: scale(1.03); \/* HoverZoom standard *\/\n}\n\n\/* ============================================\n    RESPONSIVE TABLETTE (\u2264 1024px)\n============================================ *\/\n@media (max-width: 1024px) {\n    .nk-map {\n        padding-top: 0;\n        padding-bottom: var(--section-pad-v-tab, 60px);\n        padding-left: var(--section-pad-h-tab, 4vw);\n        padding-right: var(--section-pad-h-tab, 4vw);\n    }\n    \n    .nk-map__inner {\n        gap: 15px; \/* \u00c9cart ajust\u00e9 \u00e9galement sur tablette *\/\n    }\n}\n\n\/* ============================================\n    RESPONSIVE MOBILE (\u2264 768px)\n============================================ *\/\n@media (max-width: 768px) {\n    .nk-map {\n        padding-top: 0;\n        padding-bottom: var(--section-pad-v-mob, 50px);\n        padding-left: var(--section-pad-h-mob, 20px);\n        padding-right: var(--section-pad-h-mob, 20px);\n    }\n\n    .nk-map__inner {\n        grid-template-columns: 1fr; \/* Passage sur une seule colonne *\/\n    }\n\n    \/* Masquage de la carte du monde globale sur mobile *\/\n    .nk-map__world {\n        display: none;\n    }\n\n    .nk-map__detail {\n        margin: 0 auto;\n    }\n\n    .nk-map__title {\n        font-size: 1.4rem;\n        margin-bottom: 30px;\n    }\n    \n    .nk-map__circle {\n        max-width: 320px; \/* Taille l\u00e9g\u00e8rement ajust\u00e9e pour les petits \u00e9crans *\/\n    }\n}\n<\/style>\n\n\n\n<section class=\"nk-sfa\">\n    <div class=\"nk-sfa__container\">\n        \n        <!-- Header: Title (Left) + Arrows (Right) -->\n        <div class=\"nk-sfa__header\">\n            <h2 class=\"nk-sfa__title avenirmedium-font\">\n                Our <span class=\"baskerville-italic-font\">associated expertise<\/span>\n            <\/h2>\n            \n            <!-- Navigation on the same line as the title -->\n            <div class=\"nk-sfa__nav-bar\">\n                <div class=\"nk-sfa__arrows\">\n                    <button class=\"nk-sfa__prev\" aria-label=\"Previous slide\">\n                        <svg viewBox=\"0 0 24 24\"><path d=\"M15 18l-6-6 6-6\"><\/path><\/svg>\n                    <\/button>\n                    <button class=\"nk-sfa__next\" aria-label=\"Next slide\">\n                        <svg viewBox=\"0 0 24 24\"><path d=\"M9 18l6-6-6-6\"><\/path><\/svg>\n                    <\/button>\n                <\/div>\n            <\/div>\n        <\/div>\n\n        <!-- Slider Section -->\n        <div class=\"nk-sfa__slider-area\" id=\"sfa-slider\">\n            <div class=\"nk-sfa__carousel-viewport\">\n                <div class=\"nk-sfa__carousel-track\">\n                    \n                    <!-- Slide 1 -->\n                    <article class=\"nk-sfa__slide\">\n                        <a href=\"https:\/\/www.norki.com\/en\/custom-made-upholstery\/sewing-fur-epv\/\" class=\"nk-sfa__image-link\" aria-label=\"Discover our expertise in Fur Couture\">\n                            <img decoding=\"async\" data-src=\"https:\/\/norki.com\/sur-mesure\/wp-content\/uploads\/2026\/05\/savoir-faire-couture-fourrure-norki-2-e1779974256415.jpg\" src=\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' viewBox='0 0 1 1'%3E%3C\/svg%3E\" alt=\"Fur Couture detail\" class=\"norki-lazy\">\n                        <\/a>\n                        <div class=\"nk-sfa__caption\">\n                            <p class=\"nk-sfa__caption-title baskerville-italic-font\">Fur Couture<\/p>\n                            <a href=\"https:\/\/www.norki.com\/en\/custom-made-upholstery\/sewing-fur-epv\/\" class=\"nk-sfa__link\">Discover<\/a>\n                        <\/div>\n                    <\/article>\n\n                    <!-- Slide 2 -->\n                    <article class=\"nk-sfa__slide\">\n                        <a href=\"https:\/\/www.norki.com\/en\/custom-made-upholstery\/bespoke-upholstery-services\/\" class=\"nk-sfa__image-link\" aria-label=\"Discover our expertise in Bespoke Upholstery\">\n                            <img decoding=\"async\" data-src=\"https:\/\/norki.com\/sur-mesure\/wp-content\/uploads\/2026\/05\/atelier-tapisserie-ameublement-sur-mesure-norki.jpg\" src=\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' viewBox='0 0 1 1'%3E%3C\/svg%3E\" alt=\"Bespoke Upholstery detail\" class=\"norki-lazy\">\n                        <\/a>\n                        <div class=\"nk-sfa__caption\">\n                            <p class=\"nk-sfa__caption-title baskerville-italic-font\">Bespoke Upholstery<\/p>\n                            <a href=\"https:\/\/www.norki.com\/en\/custom-made-upholstery\/bespoke-upholstery-services\/\" class=\"nk-sfa__link\">Discover<\/a>\n                        <\/div>\n                    <\/article>\n\n                    <!-- Slide 3 -->\n                    <article class=\"nk-sfa__slide\">\n                        <a href=\"https:\/\/www.norki.com\/en\/custom-made-upholstery\/bespoke-soft-furnishings-curtains\/\" class=\"nk-sfa__image-link\" aria-label=\"Discover our expertise in Soft Furnishings\">\n                            <img decoding=\"async\" data-src=\"https:\/\/norki.com\/sur-mesure\/wp-content\/uploads\/2026\/05\/atelier-couture-ameublement-decoration-norki.jpg\" src=\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' viewBox='0 0 1 1'%3E%3C\/svg%3E\" alt=\"Soft Furnishing detail\" class=\"norki-lazy\">\n                        <\/a>\n                        <div class=\"nk-sfa__caption\">\n                            <p class=\"nk-sfa__caption-title baskerville-italic-font\">Soft Furnishings<\/p>\n                            <a href=\"https:\/\/www.norki.com\/en\/custom-made-upholstery\/bespoke-soft-furnishings-curtains\/\" class=\"nk-sfa__link\">Discover<\/a>\n                        <\/div>\n                    <\/article>\n\n                <\/div>\n            <\/div>\n        <\/div>\n\n    <\/div>\n<\/section>\n\n<style>\n\/* ============================================\n   COMPOSANT : SAVOIR-FAIRE ASSOCI\u00c9S\n============================================ *\/\n.nk-sfa {\n    padding-top: 0;\n    padding-bottom: var(--section-pad-v-dt, 80px);\n    padding-left: var(--section-pad-h-dt, 5vw);\n    padding-right: var(--section-pad-h-dt, 5vw);\n    background-color: var(--color-norki-beige, #f8f0ea);\n    color: #000000;\n    box-sizing: border-box;\n    overflow: hidden;\n}\n\n.nk-sfa * {\n    box-sizing: border-box;\n}\n\n.nk-sfa__container {\n    margin: 0 auto;\n    width: 100%;\n}\n\n\/* --- HEADER --- *\/\n.nk-sfa__header {\n    display: flex;\n    justify-content: space-between;\n    align-items: flex-end;\n    margin-bottom: 50px;\n    gap: 15px; \/* Prevents arrows from overlapping with titles on small viewports *\/\n}\n\n.nk-sfa__title {\n    font-size: clamp(1.4rem, 2.5vw, 35px);\n    font-weight: normal;\n    margin: 0;\n    letter-spacing: -0.01em;\n    line-height: 1.25;\n}\n\n\/* --- NAVIGATION --- *\/\n.nk-sfa__nav-bar {\n    display: flex;\n    align-items: center;\n}\n\n.nk-sfa__arrows {\n    display: flex;\n    gap: 15px;\n    margin-right: -12px; \/* Offsets button paddings *\/\n}\n\n.nk-sfa__arrows button {\n    background: none;\n    border: none;\n    color: #000000;\n    cursor: pointer;\n    padding: 5px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    transition: opacity 0.3s ease;\n}\n\n.nk-sfa__arrows button:hover { opacity: 0.6; }\n\n.nk-sfa__arrows svg {\n    width: 26px;\n    height: 26px;\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 1.2;\n}\n\n\/* --- CAROUSEL --- *\/\n.nk-sfa__slider-area {\n    position: relative;\n    width: 100%;\n}\n\n.nk-sfa__carousel-viewport {\n    overflow: hidden;\n    touch-action: pan-y;\n    margin: 0 -15px; \/* Offsets slide padding *\/\n}\n\n.nk-sfa__carousel-track {\n    display: flex;\n    will-change: transform;\n}\n\n.nk-sfa__slide {\n    padding: 0 15px; \/* Space between slides *\/\n    display: flex;\n    flex-direction: column;\n}\n\n\/* --- BRAND DESIGN SYSTEM IMAGE CONTAINER --- *\/\n.nk-sfa__image-link {\n    display: block;\n    width: 100%;\n    aspect-ratio: 1 \/ 1; \/* PERFECT SQUARE REQUIRED *\/\n    overflow: hidden; \/* Necessary for HoverZoom scaling *\/\n    border-radius: 4px; \/* Premium smooth corners *\/\n    background-color: rgba(0, 0, 0, 0.05);\n    position: relative;\n}\n\n\/* SQUARE RATIO AND ANIMATIONS *\/\n.nk-sfa__slide img {\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n    object-position: center;\n    display: block;\n    opacity: 0;\n    \/* Design System: LoadFade & HoverZoom *\/\n    transition: opacity 0.5s ease-in-out, transform 0.6s ease;\n    will-change: opacity, transform;\n}\n\n\/* LoadFade TriggerClass *\/\n.nk-sfa__slide img.norki-loaded {\n    opacity: 1;\n}\n\n\/* HoverZoom on parent hover *\/\n.nk-sfa__image-link:hover img {\n    transform: scale(1.03);\n}\n\n\/* --- CAPTIONS --- *\/\n.nk-sfa__caption {\n    text-align: center;\n    padding-top: 25px;\n}\n\n.nk-sfa__caption-title {\n    font-size: clamp(1.2rem, 1.5vw, 22px);\n    font-weight: normal;\n    margin: 0 0 6px 0 !important;\n    color: #000000;\n}\n\n.nk-sfa__link {\n    font-size: 0.95rem;\n    color: #000000;\n    text-decoration: underline;\n    text-underline-offset: 3px;\n    text-decoration-thickness: 1.5px;\n    text-decoration-color: #000000;\n    transition: opacity 0.3s ease, text-decoration-color 0.3s ease;\n    display: inline-block;\n}\n\n.nk-sfa__link:hover {\n    opacity: 0.7;\n    text-decoration-color: transparent; \/* Smooth underline exit on hover *\/\n}\n\n\/* ============================================\n   RESPONSIVE TABLET (\u2264 1024px)\n============================================ *\/\n@media (max-width: 1024px) {\n    .nk-sfa {\n        padding-top: 0;\n        padding-bottom: var(--section-pad-v-tab, 60px);\n        padding-left: var(--section-pad-h-tab, 4vw);\n        padding-right: var(--section-pad-h-tab, 4vw);\n    }\n    \n    .nk-sfa__header {\n        margin-bottom: 30px;\n    }\n\n    \/* Prevent opacity hover bugs on mobile touchpoints *\/\n    .nk-sfa__arrows button:hover,\n    .nk-sfa__arrows button:active,\n    .nk-sfa__arrows button:focus {\n        opacity: 1 !important;\n    }\n}\n\n\/* ============================================\n   RESPONSIVE MOBILE (\u2264 768px)\n============================================ *\/\n@media (max-width: 768px) {\n    .nk-sfa {\n        padding-top: 0;\n        padding-bottom: var(--section-pad-v-mob, 50px);\n        padding-left: var(--section-pad-h-mob, 20px);\n        padding-right: var(--section-pad-h-mob, 20px);\n    }\n\n    .nk-sfa__header {\n        align-items: center; \/* Centers arrows with title line *\/\n        margin-bottom: 25px;\n    }\n\n    .nk-sfa__title {\n        \/* Fluid title size for optimal layout sharing *\/\n        font-size: clamp(1.1rem, 4.5vw, 1.4rem);\n    }\n\n    .nk-sfa__arrows {\n        margin-right: -5px;\n        gap: 10px;\n    }\n\n    .nk-sfa__arrows svg {\n        width: 22px; \n        height: 22px;\n    }\n\n    .nk-sfa__carousel-viewport {\n        margin: 0 -5px; \/* Tightened layout *\/\n    }\n\n    .nk-sfa__slide {\n        padding: 0 5px;\n    }\n\n    .nk-sfa__caption {\n        padding-top: 15px;\n    }\n}\n<\/style>\n\n<script>\ndocument.addEventListener('DOMContentLoaded', () => {\n\n    \/* =========================================================\n       SLIDER GEOMETRIC ARCHITECTURE (3 \/ 2 \/ 1 layout)\n       ========================================================= *\/\n    const container = document.getElementById('sfa-slider');\n    if (!container) return;\n\n    const section = container.closest('.nk-sfa'); \n    const track = container.querySelector('.nk-sfa__carousel-track');\n    const originalSlides = Array.from(container.querySelectorAll('.nk-sfa__slide'));\n    const totalOriginal = originalSlides.length;\n    const navBar = section.querySelector('.nk-sfa__nav-bar');\n\n    \/\/ Infinite loop clones creation\n    originalSlides.forEach(slide => {\n        const clone = slide.cloneNode(true);\n        clone.classList.add('norki-clone');\n        clone.setAttribute('aria-hidden', 'true');\n        \/\/ Disable focus on clones\n        clone.querySelectorAll('a').forEach(link => link.setAttribute('tabindex', '-1'));\n        track.appendChild(clone);\n    });\n    originalSlides.slice().reverse().forEach(slide => {\n        const clone = slide.cloneNode(true);\n        clone.classList.add('norki-clone');\n        clone.setAttribute('aria-hidden', 'true');\n        clone.querySelectorAll('a').forEach(link => link.setAttribute('tabindex', '-1'));\n        track.insertBefore(clone, track.firstChild);\n    });\n\n    const allSlides = Array.from(container.querySelectorAll('.nk-sfa__slide'));\n\n    const getSlidesPerView = () => {\n        if (window.innerWidth > 1024) return 3; \/\/ Desktop\n        if (window.innerWidth > 768) return 2;  \/\/ Tablet\n        return 1;                               \/\/ Mobile\n    };\n\n    let itemsPerView = getSlidesPerView();\n    let itemWidthPct = 100 \/ itemsPerView;\n    allSlides.forEach(s => s.style.flex = `0 0 ${itemWidthPct}%`);\n    \n    let currentIndex = totalOriginal; \n    let isAnimating = false;\n\n    const updateNavVisibility = () => {\n        if (itemsPerView >= totalOriginal) {\n            navBar.style.display = 'none';\n        } else {\n            navBar.style.display = 'flex';\n        }\n    };\n\n    const updateCarousel = (instant = false) => {\n        updateNavVisibility();\n        \n        if (itemsPerView >= totalOriginal) {\n            currentIndex = totalOriginal; \n            track.style.transition = 'none';\n            track.style.transform = `translateX(-${currentIndex * itemWidthPct}%)`;\n            return;\n        }\n\n        track.style.transition = instant ? 'none' : 'transform 0.5s cubic-bezier(0.4, 0.0, 0.2, 1)';\n        track.style.transform = `translateX(-${currentIndex * itemWidthPct}%)`;\n    };\n\n    updateCarousel(true);\n\n    const moveNext = () => {\n        if (isAnimating || itemsPerView >= totalOriginal) return;\n        isAnimating = true;\n        currentIndex++;\n        updateCarousel();\n    };\n\n    const movePrev = () => {\n        if (isAnimating || itemsPerView >= totalOriginal) return;\n        isAnimating = true;\n        currentIndex--;\n        updateCarousel();\n    };\n\n    section.querySelector('.nk-sfa__next').addEventListener('click', moveNext);\n    section.querySelector('.nk-sfa__prev').addEventListener('click', movePrev);\n\n    track.addEventListener('transitionend', (e) => {\n        if (e.propertyName !== 'transform') return;\n        isAnimating = false;\n        \n        if (currentIndex <= 0) {\n            currentIndex = totalOriginal;\n            updateCarousel(true);\n        } \n        else if (currentIndex >= totalOriginal * 2) {\n            currentIndex = totalOriginal;\n            updateCarousel(true);\n        }\n    });\n\n    \/\/ Resize updates\n    window.addEventListener('resize', () => {\n        const newItemsPerView = getSlidesPerView();\n        if (newItemsPerView !== itemsPerView) {\n            itemsPerView = newItemsPerView;\n            itemWidthPct = 100 \/ itemsPerView;\n            allSlides.forEach(s => s.style.flex = `0 0 ${itemWidthPct}%`);\n            updateCarousel(true);\n        }\n    });\n\n    \/\/ Touch Swipe gesturings\n    let startX = 0, endX = 0;\n    const swipeThreshold = 40;\n\n    track.addEventListener('touchstart', (e) => {\n        if (itemsPerView >= totalOriginal) return; \n        startX = e.touches[0].clientX;\n    }, { passive: true });\n    \n    track.addEventListener('touchend', (e) => {\n        if (itemsPerView >= totalOriginal) return;\n        endX = e.changedTouches[0].clientX;\n        const diff = startX - endX;\n        if (Math.abs(diff) > swipeThreshold) {\n            if (diff > 0) moveNext();\n            else movePrev();\n        }\n    });\n\n    \/* =========================================================\n       LAZY LOADING IMAGES (Intersection Observer)\n       ========================================================= *\/\n    const imageObserver = new IntersectionObserver((entries, observer) => {\n        entries.forEach(entry => {\n            if (entry.isIntersecting) {\n                const img = entry.target;\n                if (img.dataset.src) {\n                    img.onload = () => img.classList.add('norki-loaded');\n                    img.src = img.dataset.src;\n                    img.removeAttribute('data-src');\n                    observer.unobserve(img);\n                }\n            }\n        });\n    }, { root: null, rootMargin: '0px 100% 0px 100%', threshold: 0 });\n    \n    document.querySelectorAll('.norki-lazy').forEach(img => {\n        imageObserver.observe(img);\n    });\n\n});\n<\/script>\n\n\n\n<section class=\"nk-sel\">\n    <div class=\"nk-sel__container\">\n        \n        <!-- En-t\u00eate : Titre (Gauche) + Fl\u00e8ches (Droite) -->\n        <div class=\"nk-sel__header\">\n            <h2 class=\"nk-sel__title avenirmedium-font\">\n                Our Selection of <span class=\"baskerville-italic-font\">objects<\/span>\n            <\/h2>\n            \n            <!-- Navigation remont\u00e9e sur la m\u00eame ligne que le titre -->\n            <div class=\"nk-sel__nav-bar\">\n                <div class=\"nk-sel__arrows\">\n                    <button class=\"nk-sel__prev\" aria-label=\"Previous slide\">\n                        <svg viewBox=\"0 0 24 24\"><path d=\"M15 18l-6-6 6-6\"><\/path><\/svg>\n                    <\/button>\n                    <button class=\"nk-sel__next\" aria-label=\"Next slide\">\n                        <svg viewBox=\"0 0 24 24\"><path d=\"M9 18l6-6-6-6\"><\/path><\/svg>\n                    <\/button>\n                <\/div>\n            <\/div>\n        <\/div>\n\n        <!-- Section Carrousel -->\n        <div class=\"nk-sel__slider-area\" id=\"sel-slider\">\n            <div class=\"nk-sel__carousel-viewport\">\n                <div class=\"nk-sel__carousel-track\">\n                    \n                    <!-- Slide 1 : Chaise Luna -->\n                    <article class=\"nk-sel__slide\">\n                        <a href=\"https:\/\/www.norki.com\/en\/luxury-modern-armchairs-collection-norki\/573-design-coloured-chic-chair-interior-design-norki.html\" class=\"nk-sel__image-link\" aria-label=\"Discover the Luna Chair\">\n                            <img decoding=\"async\" data-src=\"https:\/\/www.norki.com\/sur-mesure\/wp-content\/uploads\/2026\/07\/chaise-design-luna-coloree-luxe.jpg\" src=\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' viewBox='0 0 1 1'%3E%3C\/svg%3E\" alt=\"Luna Chair\" class=\"norki-lazy\">\n                        <\/a>\n                        <div class=\"nk-sel__caption avenirmedium-font\">\n                            <span class=\"nk-sel__product-name\">Luna Chair<\/span>\n                            <a href=\"https:\/\/www.norki.com\/en\/luxury-modern-armchairs-collection-norki\/573-design-coloured-chic-chair-interior-design-norki.html\" class=\"nk-sel__link\">Buy<\/a>\n                        <\/div>\n                    <\/article>\n\n                    <!-- Slide 2 : Plaid Datcha -->\n                    <article class=\"nk-sel__slide\">\n                        <a href=\"https:\/\/www.norki.com\/en\/timeless-throws-collection-norki\/493-soft-light-throw-white-beige-brown-mottled-shearling.html\" class=\"nk-sel__image-link\" aria-label=\"Discover the Datcha Throw\">\n                            <img decoding=\"async\" data-src=\"https:\/\/www.norki.com\/sur-mesure\/wp-content\/uploads\/2026\/07\/Datcha-throw-grey-sheepskin.jpg\" src=\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' viewBox='0 0 1 1'%3E%3C\/svg%3E\" alt=\"Datcha Throw\" class=\"norki-lazy\">\n                        <\/a>\n                        <div class=\"nk-sel__caption avenirmedium-font\">\n                            <span class=\"nk-sel__product-name\">Datcha Throw<\/span>\n                            <a href=\"https:\/\/www.norki.com\/en\/timeless-throws-collection-norki\/493-soft-light-throw-white-beige-brown-mottled-shearling.html\" class=\"nk-sel__link\">Buy<\/a>\n                        <\/div>\n                    <\/article>\n\n                    <!-- Slide 3 : Coussin Val d'Is\u00e8re -->\n                    <article class=\"nk-sel__slide\">\n                        <a href=\"https:\/\/www.norki.com\/en\/collections-de-coussins-intemporels-norki-decoration\/553-luxury-square-cushion-genuine-fox-fur-orange-chalet-norki.html\" class=\"nk-sel__image-link\" aria-label=\"Discover the Val d'Is\u00e8re Cushion\">\n                            <img decoding=\"async\" data-src=\"https:\/\/www.norki.com\/sur-mesure\/wp-content\/uploads\/2026\/07\/Coussin-Luxe-fourrure-cuir-carre-Renard.jpg\" src=\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' viewBox='0 0 1 1'%3E%3C\/svg%3E\" alt=\"Val d'Is\u00e8re Cushion\" class=\"norki-lazy\">\n                        <\/a>\n                        <div class=\"nk-sel__caption avenirmedium-font\">\n                            <span class=\"nk-sel__product-name\">Val d&rsquo;Is\u00e8re Cushion<\/span>\n                            <a href=\"https:\/\/www.norki.com\/en\/collections-de-coussins-intemporels-norki-decoration\/553-luxury-square-cushion-genuine-fox-fur-orange-chalet-norki.html\" class=\"nk-sel__link\">Buy<\/a>\n                        <\/div>\n                    <\/article>\n\n                    <!-- Slide 4 : Fauteuil Alpina -->\n                    <article class=\"nk-sel__slide\">\n                        <a href=\"https:\/\/www.norki.com\/en\/luxury-modern-armchairs-collection-norki\/100-white-alpina-armchair-norki-long-hairs-sheepskin.html\" class=\"nk-sel__image-link\" aria-label=\"Discover the Alpina Armchair\">\n                            <img decoding=\"async\" data-src=\"https:\/\/www.norki.com\/sur-mesure\/wp-content\/uploads\/2026\/07\/fauteuil-blanc-poils-longs-mouton.jpg\" src=\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' viewBox='0 0 1 1'%3E%3C\/svg%3E\" alt=\"Alpina Armchair\" class=\"norki-lazy\">\n                        <\/a>\n                        <div class=\"nk-sel__caption avenirmedium-font\">\n                            <span class=\"nk-sel__product-name\">Alpina Armchair<\/span>\n                            <a href=\"https:\/\/www.norki.com\/en\/luxury-modern-armchairs-collection-norki\/100-white-alpina-armchair-norki-long-hairs-sheepskin.html\" class=\"nk-sel__link\">Buy<\/a>\n                        <\/div>\n                    <\/article>\n\n                    <!-- Slide 5 : Fauteuil Scandinave -->\n                    <article class=\"nk-sel__slide\">\n                        <a href=\"https:\/\/www.norki.com\/en\/classiques-sofas-design-scandinave-norki\/273-camel-vintage-scandinavian-sofa-1950-norki.html\" class=\"nk-sel__image-link\" aria-label=\"Discover the Scandinavian Sofa\">\n                            <img decoding=\"async\" data-src=\"https:\/\/www.norki.com\/sur-mesure\/wp-content\/uploads\/2026\/07\/scandinavian-camel-sofa-vintage.jpg\" src=\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' viewBox='0 0 1 1'%3E%3C\/svg%3E\" alt=\"Scandinavian Sofa\" class=\"norki-lazy\">\n                        <\/a>\n                        <div class=\"nk-sel__caption avenirmedium-font\">\n                            <span class=\"nk-sel__product-name\">Scandinavian Sofa<\/span>\n                            <a href=\"https:\/\/www.norki.com\/en\/classiques-sofas-design-scandinave-norki\/273-camel-vintage-scandinavian-sofa-1950-norki.html\" class=\"nk-sel__link\">Buy<\/a>\n                        <\/div>\n                    <\/article>\n\n                <\/div>\n            <\/div>\n        <\/div>\n\n    <\/div>\n<\/section>\n\n<style>\n\/* ============================================\n    COMPOSANT : S\u00c9LECTION D'OBJETS\n============================================ *\/\n.nk-sel {\n    padding-top: 0;\n    padding-bottom: var(--section-pad-v-dt, 80px);\n    padding-left: var(--section-pad-h-dt, 5vw);\n    padding-right: var(--section-pad-h-dt, 5vw);\n    background-color: var(--color-norki-beige, #f8f0ea);\n    color: #000000;\n    box-sizing: border-box;\n    overflow: hidden;\n}\n\n.nk-sel * {\n    box-sizing: border-box;\n}\n\n.nk-sel__container {\n    margin: 0 auto;\n    width: 100%;\n}\n\n\/* --- EN-T\u00caTE --- *\/\n.nk-sel__header {\n    display: flex;\n    justify-content: space-between;\n    align-items: flex-end;\n    margin-bottom: 50px;\n    gap: 15px; \/* \u00c9vite que les fl\u00e8ches ne collent au titre sur petits \u00e9crans *\/\n}\n\n.nk-sel__title {\n    font-size: clamp(1.4rem, 2.5vw, 35px); \/* Calibr\u00e9 sur la taille H2 globale *\/\n    font-weight: normal;\n    margin: 0;\n    letter-spacing: -0.01em;\n    line-height: 1.25;\n}\n\n\/* --- NAVIGATION --- *\/\n.nk-sel__nav-bar {\n    display: flex;\n    align-items: center;\n}\n\n.nk-sel__arrows {\n    display: flex;\n    gap: 15px;\n    margin-right: -12px; \/* Calibr\u00e9 \u00e0 -12px pour un alignement pixel-perfect *\/\n}\n\n.nk-sel__arrows button {\n    background: none;\n    border: none;\n    color: #000000;\n    cursor: pointer;\n    padding: 5px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    transition: opacity 0.3s ease;\n}\n\n.nk-sel__arrows button:hover { opacity: 0.6; }\n\n.nk-sel__arrows svg {\n    width: 26px;\n    height: 26px;\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 1.2;\n}\n\n\/* --- CARROUSEL --- *\/\n.nk-sel__slider-area {\n    position: relative;\n    width: 100%;\n}\n\n.nk-sel__carousel-viewport {\n    overflow: hidden;\n    touch-action: pan-y;\n    margin: 0 -15px; \/* Compense le padding des slides *\/\n}\n\n.nk-sel__carousel-track {\n    display: flex;\n    will-change: transform;\n}\n\n.nk-sel__slide {\n    padding: 0 15px; \/* Espace entre les images *\/\n    display: flex;\n    flex-direction: column;\n}\n\n\/* --- ENCAPSULATION DESIGN SYSTEM DES IMAGES --- *\/\n.nk-sel__image-link {\n    display: block;\n    width: 100%;\n    aspect-ratio: 1 \/ 1; \/* FORMAT CARR\u00c9 IMP\u00c9RATIF *\/\n    overflow: hidden; \/* N\u00e9cessaire pour contenir le zoom *\/\n    border-radius: 4px; \/* Coins arrondis \u00e9l\u00e9gants et l\u00e9gers *\/\n    background-color: rgba(0, 0, 0, 0.04);\n    position: relative;\n}\n\n\/* FORMAT CARR\u00c9 IMP\u00c9RATIF ET ANIMATIONS *\/\n.nk-sel__slide img {\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n    object-position: center;\n    display: block;\n    opacity: 0;\n    \/* Design System: LoadFade & HoverZoom *\/\n    transition: opacity 0.5s ease-in-out, transform 0.6s ease;\n    will-change: opacity, transform;\n}\n\n\/* LoadFade TriggerClass *\/\n.nk-sel__slide img.norki-loaded {\n    opacity: 1;\n}\n\n\/* HoverZoom sur l'image au survol de la bo\u00eete d'image *\/\n.nk-sel__image-link:hover img {\n    transform: scale(1.03);\n}\n\n\/* --- CAPTIONS SOUS LES IMAGES (PC) --- *\/\n.nk-sel__caption {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding-top: 20px;\n    padding-left: 23px; \/* Marge gauche ajout\u00e9e au pixel pr\u00e8s *\/\n    padding-right: 23px; \/* Marge droite ajout\u00e9e au pixel pr\u00e8s *\/\n    font-size: 0.95rem;\n    color: #000000;\n}\n\n.nk-sel__product-name {\n    font-weight: 500;\n    letter-spacing: 0.02em;\n}\n\n.nk-sel__link {\n    color: #000000;\n    text-decoration: underline;\n    text-underline-offset: 3px;\n    text-decoration-thickness: 1.5px;\n    text-decoration-color: #000000;\n    transition: opacity 0.3s ease, text-decoration-color 0.3s ease;\n    font-weight: 500;\n}\n\n\/* Effet de disparition du soulignement fluide *\/\n.nk-sel__link:hover {\n    opacity: 0.7;\n    text-decoration-color: transparent;\n}\n\n\/* ============================================\n    RESPONSIVE TABLETTE (\u2264 1024px)\n============================================ *\/\n@media (max-width: 1024px) {\n    .nk-sel {\n        padding-top: 0;\n        padding-bottom: var(--section-pad-v-tab, 60px);\n        padding-left: var(--section-pad-h-tab, 4vw);\n        padding-right: var(--section-pad-h-tab, 4vw);\n    }\n\n    .nk-sel__header {\n        margin-bottom: 30px;\n    }\n\n    .nk-sel__caption {\n        padding-left: 20px; \/* Marges de s\u00e9curit\u00e9 pour tablettes *\/\n        padding-right: 20px;\n    }\n\n    \/* Annulation de l'effet hover d'opacit\u00e9 sur \u00e9crans tactiles *\/\n    .nk-sel__arrows button:hover,\n    .nk-sel__arrows button:active,\n    .nk-sel__arrows button:focus {\n        opacity: 1 !important;\n    }\n}\n\n\/* ============================================\n    RESPONSIVE MOBILE (\u2264 768px)\n============================================ *\/\n@media (max-width: 768px) {\n    .nk-sel {\n        padding-top: 0;\n        padding-bottom: var(--section-pad-v-mob, 50px);\n        padding-left: var(--section-pad-h-mob, 20px);\n        padding-right: var(--section-pad-h-mob, 20px);\n    }\n    \n    .nk-sel__header {\n        align-items: center; \/* Centre les fl\u00e8ches verticalement avec le texte *\/\n        margin-bottom: 25px;\n    }\n\n    .nk-sel__title {\n        \/* Taille dynamique calcul\u00e9e pour partager la ligne (max 1.4rem) *\/\n        font-size: clamp(1.1rem, 4.5vw, 1.4rem);\n    }\n\n    .nk-sel__arrows {\n        margin-right: -5px;\n        gap: 10px;\n    }\n\n    .nk-sel__arrows svg {\n        width: 22px; \/* Fl\u00e8ches tr\u00e8s l\u00e9g\u00e8rement r\u00e9duites sur mobile *\/\n        height: 22px;\n    }\n\n    .nk-sel__carousel-viewport {\n        margin: 0 -5px; \/* \u00c9cart r\u00e9duit sur mobile *\/\n    }\n\n    .nk-sel__slide {\n        padding: 0 5px;\n    }\n\n    .nk-sel__caption {\n        padding-top: 15px;\n        padding-left: 20px; \/* Alignement parfait et uniforme sur mobile *\/\n        padding-right: 20px;\n    }\n}\n<\/style>\n\n<script>\ndocument.addEventListener('DOMContentLoaded', () => {\n\n    \/* =========================================================\n        GESTION DU CARROUSEL (Adaptatif 3 \/ 2 \/ 1)\n       ========================================================= *\/\n    const container = document.getElementById('sel-slider');\n    if (!container) return;\n\n    const section = container.closest('.nk-sel'); \/\/ S\u00e9lection globale de la section\n    const track = container.querySelector('.nk-sel__carousel-track');\n    const originalSlides = Array.from(container.querySelectorAll('.nk-sel__slide'));\n    const totalOriginal = originalSlides.length;\n    const navBar = section.querySelector('.nk-sel__nav-bar'); \/\/ Barre de navigation remont\u00e9e\n\n    \/\/ Clonage pour l'effet de boucle infinie\n    originalSlides.forEach(slide => {\n        const clone = slide.cloneNode(true);\n        clone.classList.add('norki-clone');\n        clone.setAttribute('aria-hidden', 'true');\n        \/\/ D\u00e9sactivation du focus clavier pour les \u00e9l\u00e9ments clon\u00e9s (s\u00e9curit\u00e9 accessibilit\u00e9)\n        clone.querySelectorAll('a').forEach(link => link.setAttribute('tabindex', '-1'));\n        track.appendChild(clone);\n    });\n    originalSlides.slice().reverse().forEach(slide => {\n        const clone = slide.cloneNode(true);\n        clone.classList.add('norki-clone');\n        clone.setAttribute('aria-hidden', 'true');\n        clone.querySelectorAll('a').forEach(link => link.setAttribute('tabindex', '-1'));\n        track.insertBefore(clone, track.firstChild);\n    });\n\n    const allSlides = Array.from(container.querySelectorAll('.nk-sel__slide'));\n\n    const getSlidesPerView = () => {\n        if (window.innerWidth > 1024) return 3; \/\/ PC\n        if (window.innerWidth > 768) return 2;  \/\/ Tablette\n        return 1;                               \/\/ Mobile\n    };\n\n    let itemsPerView = getSlidesPerView();\n    let itemWidthPct = 100 \/ itemsPerView;\n    allSlides.forEach(s => s.style.flex = `0 0 ${itemWidthPct}%`);\n    \n    let currentIndex = totalOriginal; \n    let isAnimating = false;\n\n    \/\/ Masque\/Affiche la navigation si toutes les slides sont visibles (s\u00e9curit\u00e9)\n    const updateNavVisibility = () => {\n        if (itemsPerView >= totalOriginal && navBar) {\n            navBar.style.display = 'none';\n        } else if (navBar) {\n            navBar.style.display = 'flex';\n        }\n    };\n\n    const updateCarousel = (instant = false) => {\n        updateNavVisibility();\n        \n        if (itemsPerView >= totalOriginal) {\n            currentIndex = totalOriginal; \n            track.style.transition = 'none';\n            track.style.transform = `translateX(-${currentIndex * itemWidthPct}%)`;\n            return;\n        }\n\n        track.style.transition = instant ? 'none' : 'transform 0.5s cubic-bezier(0.4, 0.0, 0.2, 1)';\n        track.style.transform = `translateX(-${currentIndex * itemWidthPct}%)`;\n    };\n\n    updateCarousel(true);\n\n    const moveNext = () => {\n        if (isAnimating || itemsPerView >= totalOriginal) return;\n        isAnimating = true;\n        currentIndex++;\n        updateCarousel();\n    };\n\n    const movePrev = () => {\n        if (isAnimating || itemsPerView >= totalOriginal) return;\n        isAnimating = true;\n        currentIndex--;\n        updateCarousel();\n    };\n\n    \/\/ Liaison aux fl\u00e8ches d'en-t\u00eate\n    section.querySelector('.nk-sel__next').addEventListener('click', moveNext);\n    section.querySelector('.nk-sel__prev').addEventListener('click', movePrev);\n\n    track.addEventListener('transitionend', (e) => {\n        if (e.propertyName !== 'transform') return;\n        isAnimating = false;\n        \n        if (currentIndex <= 0) {\n            currentIndex = totalOriginal;\n            updateCarousel(true);\n        } \n        else if (currentIndex >= totalOriginal * 2) {\n            currentIndex = totalOriginal;\n            updateCarousel(true);\n        }\n    });\n\n    \/\/ Gestion Resize\n    window.addEventListener('resize', () => {\n        const newItemsPerView = getSlidesPerView();\n        if (newItemsPerView !== itemsPerView) {\n            itemsPerView = newItemsPerView;\n            itemWidthPct = 100 \/ itemsPerView;\n            allSlides.forEach(s => s.style.flex = `0 0 ${itemWidthPct}%`);\n            updateCarousel(true);\n        }\n    });\n\n    \/\/ Gestion Swipe Tactile\n    let startX = 0, endX = 0;\n    const swipeThreshold = 40;\n\n    track.addEventListener('touchstart', (e) => {\n        if (itemsPerView >= totalOriginal) return; \n        startX = e.touches[0].clientX;\n    }, { passive: true });\n    \n    track.addEventListener('touchend', (e) => {\n        if (itemsPerView >= totalOriginal) return;\n        endX = e.changedTouches[0].clientX;\n        const diff = startX - endX;\n        if (Math.abs(diff) > swipeThreshold) {\n            if (diff > 0) moveNext();\n            else movePrev();\n        }\n    });\n\n    \/* =========================================================\n        LAZY LOADING DES IMAGES (IntersectionObserver)\n       ========================================================= *\/\n    const imageObserver = new IntersectionObserver((entries, observer) => {\n        entries.forEach(entry => {\n            if (entry.isIntersecting) {\n                const img = entry.target;\n                if (img.dataset.src) {\n                    img.onload = () => img.classList.add('norki-loaded');\n                    img.src = img.dataset.src;\n                    img.removeAttribute('data-src');\n                    observer.unobserve(img);\n                }\n            }\n        });\n    }, { root: null, rootMargin: '0px 100% 0px 100%', threshold: 0 });\n    \n    document.querySelectorAll('.norki-lazy').forEach(img => {\n        imageObserver.observe(img);\n    });\n\n});\n<\/script>\n\n\n\n<div class=\"nk-hotels-showcase\">\n    \n    <!-- Image Sup\u00e9rieure avec D\u00e9grad\u00e9 -->\n    <section class=\"nk-hs-hero\">\n        <img decoding=\"async\" src=\"https:\/\/norki.com\/sur-mesure\/wp-content\/uploads\/2026\/05\/grey-white-mottled-shearling-headboard-grau-roig.jpg\" alt=\"Grau Roig Room - Headboard\" class=\"nk-hs-hero__img\">\n        <div class=\"nk-hs-hero__fade\"><\/div>\n    <\/section>\n\n    <!-- ==========================================\n         BLOC HTML - S\u00c9MANTIQUE & INDEXABILIT\u00c9\n         ========================================== -->\n    <section id=\"wp-custom-projects-slider\" class=\"wp-custom-projects-slider-container\" aria-label=\"Our projects\">\n        \n        <!-- Bloc Information (Sans description, descendu pour l'alignement) -->\n        <div class=\"projects-info\">\n            <h2 class=\"avenirmedium-font\">Explore all our <br><span class=\"baskerville-italic-font\">Hotel Projects<\/span><\/h2>\n            <a href=\"https:\/\/www.norki.com\/en\/custom-made-upholstery\/interior-design-projects-bespoke-craftsmanship\/hotel-projects\/\" class=\"link-voir-tout\">View all<\/a>\n        <\/div>\n\n        <!-- Zone Slider -->\n        <div class=\"projects-slider\">\n            <button class=\"nav-arrow left-arrow\" aria-label=\"Previous project\">\n                <img decoding=\"async\" src=\"https:\/\/norki.com\/sur-mesure\/wp-content\/themes\/twentytwentyfour\/assets\/images\/arrow-right.svg\" alt=\"\" aria-hidden=\"true\">\n            <\/button>\n            <button class=\"nav-arrow right-arrow\" aria-label=\"Next project\">\n                <img decoding=\"async\" src=\"https:\/\/norki.com\/sur-mesure\/wp-content\/themes\/twentytwentyfour\/assets\/images\/arrow-right.svg\" alt=\"\" aria-hidden=\"true\">\n            <\/button>\n\n            <!-- Slide 1 : Palace Les Neiges (Courchevel) - COMING SOON -->\n            <article class=\"slide is-coming-soon\">\n                <div class=\"slide-img-wrapper\">\n                    <img decoding=\"async\" src=\"https:\/\/norki.com\/sur-mesure\/wp-content\/uploads\/2026\/05\/interior-design-hotel-room-palace-les-neiges-courchevel-2.jpg\" alt=\"Palace Les Neiges, Courchevel\">\n                <\/div>\n                <div class=\"slide-content\">\n                    <div class=\"slide-content-text\">\n                        <span class=\"slide-city\">Courchevel, France<\/span>\n                        <h3>Palace Les Neiges<\/h3>\n                        <p>Bespoke fur headboards, furniture and cushions<\/p>\n                    <\/div>\n                    <a href=\"#\" class=\"link-voir\">View<\/a>\n                <\/div>\n            <\/article>\n\n            <!-- Slide 2 : Le Cheval Blanc (Courchevel - Active par d\u00e9faut) - COMING SOON -->\n            <article class=\"slide active is-coming-soon\">\n                <div class=\"slide-img-wrapper\">\n                    <img decoding=\"async\" src=\"https:\/\/norki.com\/sur-mesure\/wp-content\/uploads\/2026\/05\/Cowhide-wall-covering_Cheval-Blanc-Courchevel_Norki-2-scaled.jpg\" alt=\"Le Cheval Blanc, Courchevel\">\n                <\/div>\n                <div class=\"slide-content\">\n                    <div class=\"slide-content-text\">\n                        <span class=\"slide-city\">Courchevel, France<\/span>\n                        <h3>Le Cheval Blanc<\/h3>\n                        <p>Graphic cowhide wall covering<\/p>\n                    <\/div>\n                    <a href=\"#\" class=\"link-voir\">View<\/a>\n                <\/div>\n            <\/article>\n\n            <!-- Slide 3 : Grand H\u00f4tel Rougemont (Rougemont) - COMING SOON -->\n            <article class=\"slide is-coming-soon\">\n                <div class=\"slide-img-wrapper\">\n                    <img decoding=\"async\" src=\"https:\/\/norki.com\/sur-mesure\/wp-content\/uploads\/2026\/05\/tapis-peau-de-vache-chambre-hotel-rougemont-v2-1536x1272.png\" alt=\"Grand H\u00f4tel Rougemont\">\n                <\/div>\n                <div class=\"slide-content\">\n                    <div class=\"slide-content-text\">\n                        <span class=\"slide-city\">Rougemont, Switzerland<\/span>\n                        <h3>Grand H\u00f4tel Rougemont<\/h3>\n                        <p>Cowhide rugs and bespoke decoration<\/p>\n                    <\/div>\n                    <a href=\"#\" class=\"link-voir\">View<\/a>\n                <\/div>\n            <\/article>\n\n            <!-- Slide 4 : H\u00f4tel Le C\u0153ur de Meg\u00e8ve (Meg\u00e8ve) - COMING SOON -->\n            <article class=\"slide is-coming-soon\">\n                <div class=\"slide-img-wrapper\">\n                    <img decoding=\"async\" src=\"https:\/\/norki.com\/sur-mesure\/wp-content\/uploads\/2026\/05\/Coeur-de-Megeve-II.jpg\" alt=\"H\u00f4tel Le C\u0153ur de Meg\u00e8ve\">\n                <\/div>\n                <div class=\"slide-content\">\n                    <div class=\"slide-content-text\">\n                        <span class=\"slide-city\">Meg\u00e8ve, France<\/span>\n                        <h3>H\u00f4tel Le C\u0153ur de Meg\u00e8ve<\/h3>\n                        <p>Characterful furniture, throws and decoration<\/p>\n                    <\/div>\n                    <a href=\"#\" class=\"link-voir\">View<\/a>\n                <\/div>\n            <\/article>\n\n            <!-- Slide 5 : Palace Grau Roig (Principaut\u00e9 d'Andorre) - PROJET ACTIF & DISPONIBLE -->\n            <article class=\"slide\">\n                <div class=\"slide-img-wrapper\">\n                    <img decoding=\"async\" src=\"https:\/\/norki.com\/sur-mesure\/wp-content\/uploads\/2026\/05\/Cowhide-round-sofas-Grau-Roig-palace.jpg\" alt=\"Grau Roig Palace, Principality of Andorra\">\n                <\/div>\n                <div class=\"slide-content\">\n                    <div class=\"slide-content-text\">\n                        <span class=\"slide-city\">Principality of Andorra<\/span>\n                        <h3>Palace Grau Roig<\/h3>\n                        <p>Circular cowhide benches, furniture &amp; cushions<\/p>\n                    <\/div>\n                    <a href=\"https:\/\/www.norki.com\/en\/custom-made-upholstery\/interior-design-projects-bespoke-craftsmanship\/hotel-projects\/grau-roig-andorre\/\" class=\"link-voir\">View<\/a>\n                <\/div>\n            <\/article>\n        <\/div>\n    <\/section>\n\n<\/div>\n\n<!-- ==========================================\n     BLOC CSS - STYLES SANS MODIFICATIONS\n     ========================================== -->\n<style>\n    \/* ==========================================\n       HERO TOP IMAGE\n       ========================================== *\/\n    .nk-hotels-showcase {\n        width: 100%;\n        background-color: var(--color-norki-brown, #50423d); \/* Uniformisation sur le marron *\/\n    }\n\n    .nk-hs-hero {\n        position: relative;\n        width: 100%;\n        height: 75vh;\n        background-color: #000;\n    }\n\n    .nk-hs-hero__img {\n        width: 100%;\n        height: 100%;\n        object-fit: cover;\n        object-position: center 90%;\n        display: block;\n    }\n\n    .nk-hs-hero__fade {\n        position: absolute;\n        bottom: 0;\n        left: 0;\n        width: 100%;\n        height: 45%;\n        \/* D\u00e9grad\u00e9 fluide vers le fond marron officiel *\/\n        background: linear-gradient(to bottom, rgba(80, 66, 61, 0) 0%, var(--color-norki-brown, #50423d) 100%);\n        z-index: 2;\n        pointer-events: none;\n    }\n\n    \/* ==========================================\n       VARIABLES CSS\n       ========================================== *\/\n    .wp-custom-projects-slider-container {\n        --bg-section: var(--color-norki-brown, #50423d); \/* Marron pour l'ambiance chalet sombre *\/\n        --text-light: #ffffff;\n        --text-muted: #d3ccc7;\n        --text-dark: var(--color-norki-beige, #f8f0ea); \/* Le titre passe en beige *\/\n        --font-primary: Arial, sans-serif;\n        --font-secondary: serif;\n        --radius-img: 4px;\n        \n        box-sizing: border-box;\n        position: relative;\n        background-color: var(--bg-section);\n        width: 100%;\n        height: 100vh;\n        min-height: 850px;\n        color: var(--text-light);\n        font-family: var(--font-primary);\n        overflow: hidden;\n    }\n\n    \/* Isolation de la bordure-box pour \u00e9viter les conflits WP *\/\n    .wp-custom-projects-slider-container *, \n    .wp-custom-projects-slider-container *::before, \n    .wp-custom-projects-slider-container *::after {\n        box-sizing: inherit;\n        margin: 0;\n        padding: 0;\n    }\n\n    \/* Bloc texte en haut \u00e0 gauche (Descendu car pas de description) *\/\n    .wp-custom-projects-slider-container .projects-info {\n        position: absolute;\n        top: 130px; \/* Descendu de 60px \u00e0 130px pour un \u00e9quilibre parfait *\/\n        left: 50px;\n        width: 360px;\n        z-index: 10;\n    }\n\n    .wp-custom-projects-slider-container .projects-info h2 {\n        font-size: 35px;\n        font-weight: normal;\n        margin-bottom: 20px;\n        color: var(--text-dark);\n        line-height: 1.15;\n    }\n\n    .wp-custom-projects-slider-container .projects-info h2 span {\n        font-family: \"LibreBaskervilleItalic\", sans-serif;\n    }\n\n    .wp-custom-projects-slider-container .link-voir-tout {\n        font-size: 0.95rem;\n        color: var(--text-light);\n        text-decoration: underline;\n        text-decoration-color: currentColor;\n        text-underline-offset: 3px;\n        text-decoration-thickness: 1px;\n        transition: text-decoration-color 0.3s ease, opacity 0.3s ease;\n    }\n\n    .wp-custom-projects-slider-container .link-voir-tout:hover {\n        text-decoration-color: transparent;\n        opacity: 0.7;\n    }\n\n    \/* --- FL\u00c8CHES DE NAVIGATION (Structure g\u00e9n\u00e9rale de base) --- *\/\n    .wp-custom-projects-slider-container .nav-arrow {\n        position: absolute;\n        top: 33%;\n        transform: translateY(-50%);\n        background: transparent;\n        border: none;\n        cursor: pointer;\n        z-index: 15;\n        transition: opacity 0.2s ease, transform 0.2s ease;\n        padding: 10px;\n        opacity: 0.7;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n    }\n\n    .wp-custom-projects-slider-container .nav-arrow img {\n        width: 20px; \n        height: 20px;\n        display: block;\n        filter: brightness(0) invert(1); \/* Force les fl\u00e8ches en blanc sur fond marron *\/\n    }\n\n    .wp-custom-projects-slider-container .left-arrow img {\n        transform: scaleX(-1);\n    }\n\n    \/* HOVER : Uniquement pour les appareils avec souris (Pas de collage sur mobile) *\/\n    @media (hover: hover) {\n        .wp-custom-projects-slider-container .nav-arrow:hover {\n            opacity: 1;\n            transform: translateY(-50%) scale(1.1);\n        }\n    }\n\n    \/* CLIC R\u00c9ACTIF (PC et mobile) : dip d'opacit\u00e9 et de scale instantan\u00e9 *\/\n    .wp-custom-projects-slider-container .nav-arrow:active {\n        opacity: 0.4 !important;\n        transform: translateY(-50%) scale(0.9) !important;\n        transition: none !important;\n    }\n\n    .wp-custom-projects-slider-container .left-arrow { left: 30px; }\n    .wp-custom-projects-slider-container .right-arrow { right: 30px; }\n\n    \/* Zone du Slider *\/\n    .wp-custom-projects-slider-container .projects-slider {\n        position: absolute;\n        bottom: 40px; \n        width: 100vw;\n        height: 80vh; \n        display: flex;\n        align-items: flex-end;\n        justify-content: center;\n    }\n\n    \/* Configuration des images (Slides) - Version PC de base *\/\n    .wp-custom-projects-slider-container .slide {\n        position: absolute;\n        bottom: 0;\n        height: 50vh;\n        width: auto;\n        aspect-ratio: 1272 \/ 1140;\n        transition: all 0.8s cubic-bezier(0.25, 1, 0.5, 1);\n        opacity: 0;\n        visibility: hidden;\n        z-index: 0;\n        \/* OVERFLOW ET BORDER-RADIUS SUPPRIM\u00c9S ICI (D\u00e9plac\u00e9s sur .slide-img-wrapper) *\/\n    }\n\n    \/* NOUVEAU CONTENEUR POUR LIMITER LE ZOOM DE L'IMAGE *\/\n    .wp-custom-projects-slider-container .slide-img-wrapper {\n        position: absolute;\n        top: 0;\n        left: 0;\n        width: 100%;\n        height: 100%;\n        overflow: hidden; \/* Emp\u00eache l'image de d\u00e9passer du cadre lors du zoom au survol *\/\n        border-radius: var(--radius-img); \/* Conserve l'arrondi parfait sur l'image *\/\n        z-index: 0; \/* Derri\u00e8re le contenu textuel et le d\u00e9grad\u00e9 *\/\n    }\n\n    .wp-custom-projects-slider-container .slide img {\n        width: 100%;\n        height: 100%;\n        object-fit: cover;\n        display: block;\n        transition: transform 0.5s ease; \/* Ajout transition pour le hover zoom *\/\n    }\n\n    \/* --- NOUVELLES CLASSES : HOVER & COMING SOON --- *\/\n    .wp-custom-projects-slider-container .slide.active:not(.is-coming-soon):hover img {\n        transform: scale(1.03);\n    }\n\n    .wp-custom-projects-slider-container .slide.is-coming-soon,\n    .wp-custom-projects-slider-container .slide.active.is-coming-soon {\n        cursor: not-allowed !important;\n    }\n\n    .wp-custom-projects-slider-container .slide.is-coming-soon img {\n        opacity: 0.7;\n    }\n\n    \/* Tooltip ::before au lieu de ::after pour pr\u00e9server le d\u00e9grad\u00e9 sombre *\/\n    .wp-custom-projects-slider-container .slide.active.is-coming-soon:hover::before {\n        content: \"Page under construction\";\n        position: absolute;\n        bottom: -40px;\n        left: 50%;\n        transform: translateX(-50%);\n        background: #1f2937;\n        color: #fff;\n        padding: 6px 12px;\n        font-size: 0.75rem;\n        border-radius: 6px;\n        white-space: nowrap;\n        pointer-events: none;\n        z-index: 50;\n        box-shadow: 0 4px 6px -1px rgb(0 0 0 \/ 0.1);\n    }\n\n    \/* Masquer le lien sur les \u00e9l\u00e9ments indisponibles *\/\n    .wp-custom-projects-slider-container .slide.is-coming-soon .link-voir {\n        display: none;\n    }\n\n    \/* D\u00e9grad\u00e9 sombre *\/\n    .wp-custom-projects-slider-container .slide::after {\n        content: '';\n        position: absolute;\n        top: 0;\n        left: 0;\n        width: 100%;\n        height: 40%; \n        background: linear-gradient(to bottom, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.5) 30%, rgba(0,0,0,0.15) 65%, transparent 100%);\n        border-radius: var(--radius-img) var(--radius-img) 0 0;\n        opacity: 0;\n        transition: opacity 0.4s ease;\n        pointer-events: none;\n        z-index: 1;\n    }\n\n    .wp-custom-projects-slider-container .slide.active::after { opacity: 1; }\n\n    \/* Contenu textuel sur l'image *\/\n    .wp-custom-projects-slider-container .slide-content {\n        text-align: left;\n        position: absolute;\n        top: 30px;\n        left: 30px;\n        right: 30px;\n        display: flex;\n        justify-content: space-between;\n        align-items: flex-start;\n        opacity: 0;\n        transition: opacity 0.4s ease;\n        pointer-events: none;\n        z-index: 2;\n    }\n\n    \/* NOUVEAU STYLE : Affichage de la ville *\/\n    .wp-custom-projects-slider-container .slide-content-text .slide-city {\n        display: block;\n        color: var(--text-muted);\n        font-size: 0.75rem;\n        text-transform: uppercase;\n        letter-spacing: 0.05em;\n        margin-bottom: 6px;\n        font-weight: 600;\n        text-shadow: 0 1px 3px rgba(0,0,0,0.5);\n    }\n\n    .wp-custom-projects-slider-container .slide-content-text h3 {\n        color: var(--text-light);\n        font-size: 1.15rem;\n        font-weight: normal;\n        margin-bottom: 5px;\n        line-height: 1.3;\n        text-shadow: 0 1px 3px rgba(0,0,0,0.5);\n    }\n\n    .wp-custom-projects-slider-container .slide-content-text p {\n        font-family: var(--font-secondary);\n        font-style: italic;\n        font-size: 1rem;\n        color: white;\n        line-height: 1.4;\n    }\n\n    \/* Bouton Voir *\/\n    .wp-custom-projects-slider-container .link-voir {\n        position: relative;\n        color: var(--text-light);\n        text-decoration: none;\n        border-bottom: 1px solid var(--text-light);\n        font-size: 0.8rem;\n        opacity: 0;\n        transform: translateY(10px);\n        transition: all 0.4s ease;\n        pointer-events: auto;\n        transform-origin: right center;\n        text-shadow: 0 1px 3px rgba(0,0,0,0.5);\n    }\n\n    .wp-custom-projects-slider-container .slide.active .link-voir {\n        opacity: 1;\n        transform: translateY(0) scale(1);\n    }\n\n    @media (hover: hover) {\n        .wp-custom-projects-slider-container .slide.active:hover .link-voir {\n            transform: translateY(0) scale(1.15);\n        }\n    }\n\n    \/* \u00c9tats du slider (PC > 1700px) - Marges strictes \u00e0 40px *\/\n    .wp-custom-projects-slider-container .slide.prev {\n        opacity: 1;\n        visibility: visible;\n        \/* Aligne pr\u00e9cis\u00e9ment le bord gauche de l'image \u00e0 50px de l'\u00e9cran *\/\n        transform: translateX(calc(50px - 50vw + 50%));\n        z-index: 1;\n        cursor: pointer;\n    }\n\n    .wp-custom-projects-slider-container .slide.active {\n        opacity: 1;\n        visibility: visible;\n        \/* Position = 50px (bord \u00e9cran) + 40px (marge fixe) + Largeur Slide Prev (50vh * 1272\/1140) *\/\n        transform: translateX(calc(90px + (50vh * 1272 \/ 1140) - 50vw + 50%));\n        z-index: 2;\n        height: 76vh;\n        cursor: pointer;\n    }\n\n    .wp-custom-projects-slider-container .slide.next {\n        opacity: 1;\n        visibility: visible;\n        \/* Position = 50px + 80px (2 marges) + Largeur Prev (50vh*ratio) + Largeur Active (76vh*ratio) *\/\n        transform: translateX(calc(130px + (126vh * 1272 \/ 1140) - 50vw + 50%));\n        z-index: 1;\n        cursor: pointer;\n    }\n\n    .wp-custom-projects-slider-container .slide.active .slide-content {\n        opacity: 1;\n        transition-delay: 0.4s;\n    }\n\n    \/* ==========================================\n       RESPONSIVE DESIGN\n       ========================================== *\/\n    @media (max-width: 1700px) {\n        .wp-custom-projects-slider-container .slide.prev, \n        .wp-custom-projects-slider-container .slide.next { filter: brightness(0.9); }\n        \n        .wp-custom-projects-slider-container {\n            height: auto;\n            min-height: 65vh;\n            display: flex;\n            flex-direction: column;\n            justify-content: flex-start;\n            padding-bottom: 40px; \n            text-align: center;\n        }\n        \n        .wp-custom-projects-slider-container .projects-info {\n            position: relative;\n            top: 0; left: 0; width: 100%;\n            padding: 60px 20px 20px;\n        }\n        \n        .wp-custom-projects-slider-container .projects-slider {\n            position: relative; top: auto; bottom: auto; left: 50%;\n            transform: translateX(-50%); height: 55cqi; max-height: 75vh;\n        }\n        \n        .wp-custom-projects-slider-container .slide { \n            width: 45vw; \n            height: auto; \n            max-height: 60vh; \n        }\n        \n        .wp-custom-projects-slider-container .slide.active { \n            width: 60vw; \n            height: auto; \n            max-height: 75vh; \n            transform: translateX(0); \n        }\n        \n        .wp-custom-projects-slider-container .slide.prev { transform: translateX(-50vw); } \n        .wp-custom-projects-slider-container .slide.next { transform: translateX(50vw); } \n        \n        .wp-custom-projects-slider-container .nav-arrow {\n            top: auto;\n            bottom: calc(min(45vw * (1140 \/ 1272), 60vh) + 15px);\n            transform: none;\n            transition: opacity 0.2s ease, transform 0.2s ease;\n        }\n\n        \/* Hover uniquement sur PC dans ce breakpoint *\/\n        @media (hover: hover) {\n            .wp-custom-projects-slider-container .nav-arrow:hover { \n                transform: scale(1.1); \n                opacity: 1;\n            }\n        }\n\n        \/* Action active sur mobile\/tablette (Pas de translateY) *\/\n        .wp-custom-projects-slider-container .nav-arrow:active {\n            opacity: 0.4 !important;\n            transform: scale(0.9) !important;\n            transition: none !important;\n        }\n\n        .wp-custom-projects-slider-container .left-arrow { left: 2vw; }\n        .wp-custom-projects-slider-container .right-arrow { right: 2vw; }\n    }\n\n    @media (max-width: 720px) {\n        .wp-custom-projects-slider-container .projects-info h2 { font-size: 1.4rem; }\n        .wp-custom-projects-slider-container .projects-slider { height: 75vw; }\n        .wp-custom-projects-slider-container .slide { \n            width: 65vw; \n            height: auto; \n        }\n        .wp-custom-projects-slider-container .slide.active { \n            width: 85vw; \n            height: auto; \n        }\n        \/* D\u00e9grad\u00e9 sombre *\/\n        .wp-custom-projects-slider-container .slide::after {\n            height: 60%;\n            background: linear-gradient(to bottom, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.5) 30%, rgba(0,0,0,0.35) 65%, transparent 100%);\n        }\n        .wp-custom-projects-slider-container .slide.prev { transform: translateX(-75vw); }\n        .wp-custom-projects-slider-container .slide.next { transform: translateX(75vw); }\n        .wp-custom-projects-slider-container .nav-arrow { bottom: calc(min(65vw * (1140 \/ 1272), 60vh) + 15px); }\n        .wp-custom-projects-slider-container .left-arrow { left: 0; }\n        .wp-custom-projects-slider-container .right-arrow { right: 0; }\n\n        .wp-custom-projects-slider-container .slide-content {\n            top: 20px; bottom: 30px; text-align: center;\n            flex-direction: column; align-items: center; justify-content: space-between;\n        }\n        .wp-custom-projects-slider-container .slide-content-text h3 { margin-bottom: 5px; }\n        .wp-custom-projects-slider-container .link-voir {\n            transform-origin: center center;\n        }\n    }\n\n    @media (max-width: 420px) {\n        .wp-custom-projects-slider-container .projects-slider { height: 95vw; max-height: none; }\n        .wp-custom-projects-slider-container .nav-arrow { bottom: calc(85vw * (1140 \/ 1272) + 10px); }\n        .wp-custom-projects-slider-container .left-arrow { left: 5vw; }\n        .wp-custom-projects-slider-container .right-arrow { right: 5vw; }\n    }\n<\/style>\n\n<!-- ==========================================\n     BLOC JAVASCRIPT - COMPORTEMENT SANS MODIFICATIONS\n     ========================================== -->\n<script>\n(function() {\n    const CONFIG_COMPOSANT = {\n        delaiAutoPlay: 8000,\n        delaiPauseApresClic: 15000\n    };\n\n    const container = document.getElementById('wp-custom-projects-slider');\n    if (!container) return; \n\n    const slidesElements = Array.from(container.querySelectorAll('.slide'));\n    let currentIndex = slidesElements.findIndex(slide => slide.classList.contains('active'));\n    if (currentIndex === -1) currentIndex = 0;\n\n    let autoplayInterval;\n    let pauseTimeout;\n\n    function renderSlider() {\n        slidesElements.forEach(slide => slide.classList.remove('active', 'prev', 'next'));\n        \n        slidesElements[currentIndex].classList.add('active');\n        \n        let prevIndex = currentIndex - 1 < 0 ? slidesElements.length - 1 : currentIndex - 1;\n        let nextIndex = currentIndex + 1 >= slidesElements.length ? 0 : currentIndex + 1;\n        \n        slidesElements[prevIndex].classList.add('prev');\n        slidesElements[nextIndex].classList.add('next');\n    }\n\n    function goToNextSlide() {\n        currentIndex = currentIndex + 1 >= slidesElements.length ? 0 : currentIndex + 1;\n        renderSlider();\n    }\n\n    function goToPrevSlide() {\n        currentIndex = currentIndex - 1 < 0 ? slidesElements.length - 1 : currentIndex - 1;\n        renderSlider();\n    }\n\n    function startAutoplay() {\n        clearInterval(autoplayInterval);\n        autoplayInterval = setInterval(goToNextSlide, CONFIG_COMPOSANT.delaiAutoPlay); \n    }\n\n    function pauseAutoplayTemporarily() {\n        clearInterval(autoplayInterval); \n        clearTimeout(pauseTimeout); \n        pauseTimeout = setTimeout(startAutoplay, CONFIG_COMPOSANT.delaiPauseApresClic);\n    }\n\n    container.querySelector('.left-arrow').addEventListener('click', () => {\n        goToPrevSlide();\n        pauseAutoplayTemporarily();\n    });\n\n    container.querySelector('.right-arrow').addEventListener('click', () => {\n        goToNextSlide();\n        pauseAutoplayTemporarily();\n    });\n\n    slidesElements.forEach(slide => {\n        slide.addEventListener('click', (e) => {\n            if (slide.classList.contains('active')) {\n                if (!e.target.classList.contains('link-voir')) {\n                    const linkElement = slide.querySelector('.link-voir');\n                    if (linkElement) {\n                        const linkHref = linkElement.getAttribute('href');\n                        \/\/ Redirection si l'attribut href existe et est diff\u00e9rent de '#'\n                        if (linkHref && linkHref !== '#') window.location.href = linkHref;\n                    }\n                }\n            } else if (slide.classList.contains('prev')) {\n                goToPrevSlide();\n                pauseAutoplayTemporarily();\n            } else if (slide.classList.contains('next')) {\n                goToNextSlide();\n                pauseAutoplayTemporarily();\n            }\n        });\n    });\n\n    let touchStartX = 0;\n    let touchEndX = 0;\n    const sliderContainer = container.querySelector('.projects-slider');\n\n    function handleSwipeGesture() {\n        const swipeThreshold = 50; \n        if (touchEndX < touchStartX - swipeThreshold) {\n            goToNextSlide();\n            pauseAutoplayTemporarily();\n        }\n        if (touchEndX > touchStartX + swipeThreshold) {\n            goToPrevSlide();\n            pauseAutoplayTemporarily();\n        }\n    }\n\n    sliderContainer.addEventListener('touchstart', (e) => {\n        touchStartX = e.changedTouches[0].screenX;\n    }, { passive: true });\n\n    sliderContainer.addEventListener('touchend', (e) => {\n        touchEndX = e.changedTouches[0].screenX;\n        handleSwipeGesture();\n    });\n\n    renderSlider();\n    startAutoplay();\n})();\n<\/script>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>The Alpine Haven of Les Barmes de l\u2019Ours Val d\u2019Is\u00e8re Val d&rsquo;Is\u00e8re, France 2019\/2021 Banquettes, furniture &amp; bespoke cushions Val d&rsquo;Is\u00e8re: Norki\u2019s Craftsmanship Elevates an Alpine Icon In the heart of the Haute-Tarentaise, where peaks meet the sky at 1,850 meters, Val d\u2019Is\u00e8re stands as the epicenter of authentic luxury. With its massive stone chalets, [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":4281,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"template-page-builder-no-header-footer.php","meta":{"_uag_custom_page_level_css":"\/* A COPIER COLLER *\/\n\n:root {\n\t--wp--preset--color--contrast: black;\n    \/* Paddings de section standards *\/\n    --section-pad-v-dt: 80px;\n    --section-pad-h-dt: 5vw;\n    \n    --section-pad-v-tab: 50px;\n    --section-pad-h-tab: 4vw;\n    \n    --section-pad-v-mob: 40px;\n    --section-pad-h-mob: 20px;\n\n    \/* Couleurs  Polices *\/\n    --color-norki-brown: #50423d;\n    --color-norki-beige: #f8f0ea;\n    --font-baskerville: 'Baskerville', serif;\n    --font-montserrat: 'Montserrat', sans-serif;\n}\n\n@font-face {\n  font-family: 'LibreBaskervilleItalic';\n  src: url('\/sur-mesure\/wp-content\/themes\/twentytwentyfour\/assets\/fonts\/Libre-Baskerville\/LibreBaskerville-Italic.ttf') format('truetype');\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: 'Bestermind';\n  src: url('\/sur-mesure\/wp-content\/themes\/twentytwentyfour\/assets\/fonts\/Bestermind\/BestermindRegular.ttf') format('truetype');\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: 'AvenirBook';\n  src: url('\/sur-mesure\/wp-content\/themes\/twentytwentyfour\/assets\/fonts\/Avenir\/Avenir-Book-01.otf') format('opentype');\n  font-weight: normal;\n  font-style: normal;\n}\n\n\n@font-face {\n  font-family: 'AvenirMedium';\n  src: url('\/sur-mesure\/wp-content\/themes\/twentytwentyfour\/assets\/fonts\/Avenir\/Avenir-Medium-09.otf') format('opentype');\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: 'AvenirBookOblique';\n  src: url('\/sur-mesure\/wp-content\/themes\/twentytwentyfour\/assets\/fonts\/Avenir\/Avenir-BookOblique-02.otf') format('opentype');\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: 'Pertili';\n  src: url('\/sur-mesure\/wp-content\/themes\/twentytwentyfour\/assets\/fonts\/PERTILI.TTF') format('truetype');\n  font-weight: normal;\n  font-style: normal;\n}\n\n.pertili-font {\n\tfont-family: \"Pertili\", sans-serif !important;\n}\n\n.bestermind-font {\n\tfont-family: \"Bestermind\", sans-serif !important;\n}\n\n.avenirbookoblique-font {\n\tfont-family: \"AvenirBookOblique\", sans-serif !important;\n}\n\n.baskerville-italic-font {\n\tfont-family: \"LibreBaskervilleItalic\", sans-serif !important;\n}\n\n.avenirmedium-font {\n\tfont-family: \"AvenirMedium\", sans-serif !important;\n}\n\nbody:not(.wp-admin) * {\n  font-family: \"AvenirBook\", sans-serif;\n}\n\nbody {\n\tbackground-color: #f8f0ea !important;\n\tcolor: black;\n}\n\nh2 {\n\tfont-family: \"AvenirMedium\", sans-serif !important;\n}\n\n.components-sandbox {\n\tmax-height: 500px;\n}\n\n\/* A COPIER COLLER END *\/","_sitemap_exclude":false,"_sitemap_priority":"","_sitemap_frequency":"","footnotes":""},"categories":[],"tags":[],"class_list":["post-4310","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.1 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Luxury Interior Design Val d\u2019Is\u00e8re | Les Barmes de l\u2019Ours &amp; Norki<\/title>\n<meta name=\"description\" content=\"Discover bespoke furniture by Norki for Les Barmes de l\u2019Ours hotel in Val d\u2019Is\u00e8re, featuring alpine design in leather, velvet, and fur.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.norki.com\/en\/custom-made-upholstery\/interior-design-projects-bespoke-craftsmanship\/hotel-projects\/les-barmes-de-l-ours-val-d-isere\/\" \/>\n<meta property=\"og:locale\" content=\"fr_FR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Luxury Interior Design Val d\u2019Is\u00e8re | Les Barmes de l\u2019Ours &amp; Norki\" \/>\n<meta property=\"og:description\" content=\"Discover bespoke furniture by Norki for Les Barmes de l\u2019Ours hotel in Val d\u2019Is\u00e8re, featuring alpine design in leather, velvet, and fur.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.norki.com\/en\/custom-made-upholstery\/interior-design-projects-bespoke-craftsmanship\/hotel-projects\/les-barmes-de-l-ours-val-d-isere\/\" \/>\n<meta property=\"og:site_name\" content=\"Norki\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/facebook.com\/NorkiDecoration\" \/>\n<meta property=\"article:modified_time\" content=\"2026-07-17T10:58:08+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.norki.com\/sur-mesure\/wp-content\/uploads\/2026\/07\/hotel-les-barmes-de-l-ours.png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Dur\u00e9e de lecture estim\u00e9e\" \/>\n\t<meta name=\"twitter:data1\" content=\"8 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.norki.com\\\/en\\\/custom-made-upholstery\\\/interior-design-projects-bespoke-craftsmanship\\\/hotel-projects\\\/les-barmes-de-l-ours-val-d-isere\\\/\",\"url\":\"https:\\\/\\\/www.norki.com\\\/en\\\/custom-made-upholstery\\\/interior-design-projects-bespoke-craftsmanship\\\/hotel-projects\\\/les-barmes-de-l-ours-val-d-isere\\\/\",\"name\":\"Luxury Interior Design Val d\u2019Is\u00e8re | Les Barmes de l\u2019Ours & Norki\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.norki.com\\\/sur-mesure\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.norki.com\\\/en\\\/custom-made-upholstery\\\/interior-design-projects-bespoke-craftsmanship\\\/hotel-projects\\\/les-barmes-de-l-ours-val-d-isere\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.norki.com\\\/en\\\/custom-made-upholstery\\\/interior-design-projects-bespoke-craftsmanship\\\/hotel-projects\\\/les-barmes-de-l-ours-val-d-isere\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.norki.com\\\/sur-mesure\\\/wp-content\\\/uploads\\\/2026\\\/07\\\/hotel-les-barmes-de-l-ours.png\",\"datePublished\":\"2026-06-08T12:11:00+00:00\",\"dateModified\":\"2026-07-17T10:58:08+00:00\",\"description\":\"Discover bespoke furniture by Norki for Les Barmes de l\u2019Ours hotel in Val d\u2019Is\u00e8re, featuring alpine design in leather, velvet, and fur.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.norki.com\\\/en\\\/custom-made-upholstery\\\/interior-design-projects-bespoke-craftsmanship\\\/hotel-projects\\\/les-barmes-de-l-ours-val-d-isere\\\/#breadcrumb\"},\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.norki.com\\\/en\\\/custom-made-upholstery\\\/interior-design-projects-bespoke-craftsmanship\\\/hotel-projects\\\/les-barmes-de-l-ours-val-d-isere\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\\\/\\\/www.norki.com\\\/en\\\/custom-made-upholstery\\\/interior-design-projects-bespoke-craftsmanship\\\/hotel-projects\\\/les-barmes-de-l-ours-val-d-isere\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.norki.com\\\/sur-mesure\\\/wp-content\\\/uploads\\\/2026\\\/07\\\/hotel-les-barmes-de-l-ours.png\",\"contentUrl\":\"https:\\\/\\\/www.norki.com\\\/sur-mesure\\\/wp-content\\\/uploads\\\/2026\\\/07\\\/hotel-les-barmes-de-l-ours.png\",\"width\":1792,\"height\":2390},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.norki.com\\\/en\\\/custom-made-upholstery\\\/interior-design-projects-bespoke-craftsmanship\\\/hotel-projects\\\/les-barmes-de-l-ours-val-d-isere\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Accueil\",\"item\":\"https:\\\/\\\/www.norki.com\\\/fr\\\/sur-mesure\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Our Projects\",\"item\":\"https:\\\/\\\/www.norki.com\\\/en\\\/custom-made-upholstery\\\/interior-design-projects-bespoke-craftsmanship\\\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Hotels\",\"item\":\"https:\\\/\\\/www.norki.com\\\/en\\\/custom-made-upholstery\\\/interior-design-projects-bespoke-craftsmanship\\\/hotel-projects\\\/\"},{\"@type\":\"ListItem\",\"position\":4,\"name\":\"Les barmes de l\u2019Ours\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.norki.com\\\/sur-mesure\\\/#website\",\"url\":\"https:\\\/\\\/www.norki.com\\\/sur-mesure\\\/\",\"name\":\"Norki\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.norki.com\\\/sur-mesure\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"fr-FR\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Luxury Interior Design Val d\u2019Is\u00e8re | Les Barmes de l\u2019Ours & Norki","description":"Discover bespoke furniture by Norki for Les Barmes de l\u2019Ours hotel in Val d\u2019Is\u00e8re, featuring alpine design in leather, velvet, and fur.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.norki.com\/en\/custom-made-upholstery\/interior-design-projects-bespoke-craftsmanship\/hotel-projects\/les-barmes-de-l-ours-val-d-isere\/","og_locale":"fr_FR","og_type":"article","og_title":"Luxury Interior Design Val d\u2019Is\u00e8re | Les Barmes de l\u2019Ours & Norki","og_description":"Discover bespoke furniture by Norki for Les Barmes de l\u2019Ours hotel in Val d\u2019Is\u00e8re, featuring alpine design in leather, velvet, and fur.","og_url":"https:\/\/www.norki.com\/en\/custom-made-upholstery\/interior-design-projects-bespoke-craftsmanship\/hotel-projects\/les-barmes-de-l-ours-val-d-isere\/","og_site_name":"Norki","article_publisher":"https:\/\/facebook.com\/NorkiDecoration","article_modified_time":"2026-07-17T10:58:08+00:00","og_image":[{"url":"https:\/\/www.norki.com\/sur-mesure\/wp-content\/uploads\/2026\/07\/hotel-les-barmes-de-l-ours.png","type":"","width":"","height":""}],"twitter_card":"summary_large_image","twitter_misc":{"Dur\u00e9e de lecture estim\u00e9e":"8 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.norki.com\/en\/custom-made-upholstery\/interior-design-projects-bespoke-craftsmanship\/hotel-projects\/les-barmes-de-l-ours-val-d-isere\/","url":"https:\/\/www.norki.com\/en\/custom-made-upholstery\/interior-design-projects-bespoke-craftsmanship\/hotel-projects\/les-barmes-de-l-ours-val-d-isere\/","name":"Luxury Interior Design Val d\u2019Is\u00e8re | Les Barmes de l\u2019Ours & Norki","isPartOf":{"@id":"https:\/\/www.norki.com\/sur-mesure\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.norki.com\/en\/custom-made-upholstery\/interior-design-projects-bespoke-craftsmanship\/hotel-projects\/les-barmes-de-l-ours-val-d-isere\/#primaryimage"},"image":{"@id":"https:\/\/www.norki.com\/en\/custom-made-upholstery\/interior-design-projects-bespoke-craftsmanship\/hotel-projects\/les-barmes-de-l-ours-val-d-isere\/#primaryimage"},"thumbnailUrl":"https:\/\/www.norki.com\/sur-mesure\/wp-content\/uploads\/2026\/07\/hotel-les-barmes-de-l-ours.png","datePublished":"2026-06-08T12:11:00+00:00","dateModified":"2026-07-17T10:58:08+00:00","description":"Discover bespoke furniture by Norki for Les Barmes de l\u2019Ours hotel in Val d\u2019Is\u00e8re, featuring alpine design in leather, velvet, and fur.","breadcrumb":{"@id":"https:\/\/www.norki.com\/en\/custom-made-upholstery\/interior-design-projects-bespoke-craftsmanship\/hotel-projects\/les-barmes-de-l-ours-val-d-isere\/#breadcrumb"},"inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.norki.com\/en\/custom-made-upholstery\/interior-design-projects-bespoke-craftsmanship\/hotel-projects\/les-barmes-de-l-ours-val-d-isere\/"]}]},{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/www.norki.com\/en\/custom-made-upholstery\/interior-design-projects-bespoke-craftsmanship\/hotel-projects\/les-barmes-de-l-ours-val-d-isere\/#primaryimage","url":"https:\/\/www.norki.com\/sur-mesure\/wp-content\/uploads\/2026\/07\/hotel-les-barmes-de-l-ours.png","contentUrl":"https:\/\/www.norki.com\/sur-mesure\/wp-content\/uploads\/2026\/07\/hotel-les-barmes-de-l-ours.png","width":1792,"height":2390},{"@type":"BreadcrumbList","@id":"https:\/\/www.norki.com\/en\/custom-made-upholstery\/interior-design-projects-bespoke-craftsmanship\/hotel-projects\/les-barmes-de-l-ours-val-d-isere\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Accueil","item":"https:\/\/www.norki.com\/fr\/sur-mesure\/"},{"@type":"ListItem","position":2,"name":"Our Projects","item":"https:\/\/www.norki.com\/en\/custom-made-upholstery\/interior-design-projects-bespoke-craftsmanship\/"},{"@type":"ListItem","position":3,"name":"Hotels","item":"https:\/\/www.norki.com\/en\/custom-made-upholstery\/interior-design-projects-bespoke-craftsmanship\/hotel-projects\/"},{"@type":"ListItem","position":4,"name":"Les barmes de l\u2019Ours"}]},{"@type":"WebSite","@id":"https:\/\/www.norki.com\/sur-mesure\/#website","url":"https:\/\/www.norki.com\/sur-mesure\/","name":"Norki","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.norki.com\/sur-mesure\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"fr-FR"}]}},"uagb_featured_image_src":{"full":false,"thumbnail":false,"medium":false,"medium_large":false,"large":false,"1536x1536":false,"2048x2048":false},"uagb_author_info":{"display_name":"webmaster","author_link":"https:\/\/www.norki.com\/sur-mesure\/author\/webmaster\/"},"uagb_comment_info":0,"uagb_excerpt":"The Alpine Haven of Les Barmes de l\u2019Ours Val d\u2019Is\u00e8re Val d&rsquo;Is\u00e8re, France 2019\/2021 Banquettes, furniture &amp; bespoke cushions Val d&rsquo;Is\u00e8re: Norki\u2019s Craftsmanship Elevates an Alpine Icon In the heart of the Haute-Tarentaise, where peaks meet the sky at 1,850 meters, Val d\u2019Is\u00e8re stands as the epicenter of authentic luxury. With its massive stone chalets,\u2026","_links":{"self":[{"href":"https:\/\/www.norki.com\/sur-mesure\/wp-json\/wp\/v2\/pages\/4310","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.norki.com\/sur-mesure\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.norki.com\/sur-mesure\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.norki.com\/sur-mesure\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.norki.com\/sur-mesure\/wp-json\/wp\/v2\/comments?post=4310"}],"version-history":[{"count":8,"href":"https:\/\/www.norki.com\/sur-mesure\/wp-json\/wp\/v2\/pages\/4310\/revisions"}],"predecessor-version":[{"id":5034,"href":"https:\/\/www.norki.com\/sur-mesure\/wp-json\/wp\/v2\/pages\/4310\/revisions\/5034"}],"up":[{"embeddable":true,"href":"https:\/\/www.norki.com\/sur-mesure\/wp-json\/wp\/v2\/pages\/4281"}],"wp:attachment":[{"href":"https:\/\/www.norki.com\/sur-mesure\/wp-json\/wp\/v2\/media?parent=4310"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.norki.com\/sur-mesure\/wp-json\/wp\/v2\/categories?post=4310"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.norki.com\/sur-mesure\/wp-json\/wp\/v2\/tags?post=4310"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}