.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-1870 .elementor-element.elementor-element-2351266{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-1870 .elementor-element.elementor-element-0f8d4cc{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-1870 .elementor-element.elementor-element-20a2d03{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-1870 .elementor-element.elementor-element-e0f9471{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-1870 .elementor-element.elementor-element-20a65ca{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-1870 .elementor-element.elementor-element-c662ec1{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-1870 .elementor-element.elementor-element-588fd63{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 22px) 0px;}.elementor-1870 .elementor-element.elementor-element-588fd63 .elementor-heading-title{color:var( --e-global-color-0795084 );}.elementor-widget-loop-grid .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-loop-grid .elementor-pagination{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-loop-grid .e-load-more-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-1870 .elementor-element.elementor-element-c6f3358{--grid-columns:3;}.elementor-1870 .elementor-element.elementor-element-c6f3358 .elementor-loop-container{grid-auto-rows:1fr;}.elementor-1870 .elementor-element.elementor-element-c6f3358 .e-loop-item > .elementor-section, .elementor-1870 .elementor-element.elementor-element-c6f3358 .e-loop-item > .elementor-section > .elementor-container, .elementor-1870 .elementor-element.elementor-element-c6f3358 .e-loop-item > .e-con, .elementor-1870 .elementor-element.elementor-element-c6f3358 .e-loop-item .elementor-section-wrap  > .e-con{height:100%;}.elementor-1870 .elementor-element.elementor-element-3bdd56d{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 22px) 0px;}.elementor-1870 .elementor-element.elementor-element-3bdd56d .elementor-heading-title{color:var( --e-global-color-0795084 );}.elementor-1870 .elementor-element.elementor-element-ebc79fe{--grid-columns:3;}.elementor-1870 .elementor-element.elementor-element-ebc79fe .elementor-loop-container{grid-auto-rows:1fr;}.elementor-1870 .elementor-element.elementor-element-ebc79fe .e-loop-item > .elementor-section, .elementor-1870 .elementor-element.elementor-element-ebc79fe .e-loop-item > .elementor-section > .elementor-container, .elementor-1870 .elementor-element.elementor-element-ebc79fe .e-loop-item > .e-con, .elementor-1870 .elementor-element.elementor-element-ebc79fe .e-loop-item .elementor-section-wrap  > .e-con{height:100%;}.elementor-widget-button .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-1870 .elementor-element.elementor-element-801c9d6 .elementor-button{background-color:var( --e-global-color-f0e5059 );font-family:"Montserrat", Sans-serif;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:1.8px;border-radius:3px 3px 3px 3px;}.elementor-1870 .elementor-element.elementor-element-801c9d6{width:auto;max-width:auto;padding:0px 0px 0px 0px;}.elementor-1870 .elementor-element.elementor-element-cb29104 .elementor-button{background-color:var( --e-global-color-f0e5059 );font-family:"Montserrat", Sans-serif;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:1.8px;border-radius:3px 3px 3px 3px;}.elementor-1870 .elementor-element.elementor-element-cb29104{width:initial;max-width:initial;padding:0px 0px 0px 0px;}@media(max-width:1024px){.elementor-1870 .elementor-element.elementor-element-c6f3358{--grid-columns:2;}.elementor-1870 .elementor-element.elementor-element-ebc79fe{--grid-columns:2;}}@media(max-width:767px){.elementor-1870 .elementor-element.elementor-element-c6f3358{--grid-columns:1;}.elementor-1870 .elementor-element.elementor-element-ebc79fe{--grid-columns:1;}}/* Start custom CSS */<!doctype html>

      *,
      *::before,
      *::after {
        box-sizing: border-box;
        margin: 0;
        padding: 0;
      }
      :root {
        /*--vert: #3b9ed4;*/
        --vert: #2d5a27;
        --vert2: #5a8a4a;
        --vert-nuit: #1a2e1a;
        --beige: #c8a96e;
        --creme: #f5f0e8;
        
        --terre: #7a5020;
        --blanc: #ffffff;
        --texte: #1a2e1a;

        --bleu-nuit: #3022b0;
        --bleu-ciel: #3b9ed4;
        --bleu-ciel-light: #e8f4fb;
        --bleu-nuit: #1a60a8;
      }
      html {
        scroll-behavior: smooth;
      }
      body {
        font-family: "Lato", sans-serif;
        color: var(--texte);
        background: var(--blanc);
        overflow-x: hidden;
      }

      /* ══════════════════════════════════════════
   HEADER
══════════════════════════════════════════ */
      #header {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: 200;
        padding: 0 4%;
        display: flex;
        align-items: center;
        justify-content: space-between;
        height: 70px;
        transition:
          background 0.35s,
          box-shadow 0.35s;
        background: #FFFFFF;
        padding:0 5%;
        height:103px;
        border-bottom:3px solid var(--mint);
        box-shadow:0 2px 24px rgba(0,0,0,.18);
      }
      #header.scrolled {
        background: rgba(255, 255, 255, 0.97);
        box-shadow: 0 2px 20px rgba(0, 0, 0, 0.25);
        height: 75px;
        transition: height 0.35s;
      }
      .logo-wrap {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        text-decoration: none;
        max-width: 220px;
        transition: max-width 0.35s;
        height: 100%;
        img {
          width: 60%;
          height: auto;
          display: block;
        }
        .scrolled & {
          max-width: 170px;
        }
      }
      .logo-text {
        font-family: "Cormorant Garamond", serif;
        font-size: 30px;
        font-style: italic;
        color: #fff;
        line-height: 1;
        letter-spacing: 0.5px;
      }
      .logo-sub {
        font-family: "Montserrat", sans-serif;
        font-size: 7.5px;
        letter-spacing: 3px;
        text-transform: uppercase;
        color: rgba(255, 255, 255, 0.55);
        display: block;
        margin-top: 1px;
      }
      nav {
        display: flex;
        align-items: center;
        gap: 24px;
      }
      .nav-link {
        font-family: "Montserrat", sans-serif;
        font-size: 11.5px;
        font-weight: 500;
        letter-spacing: 1.5px;
        text-transform: uppercase;
        color: #1A3520;
        text-decoration: none;
        transition: color 0.25s;
      }
      .nav-link:hover {
        color: var(--beige);
      }
      .lang-sw {
        display: flex;
        align-items: center;
        gap: 5px;
        margin-left: 6px;
      }
      .lang-btn {
        font-family: "Montserrat", sans-serif;
        font-size: 11px;
        font-weight: 600;
        color: rgba(0, 0, 0, 0.55);
        background: none;
        border: none;
        cursor: pointer;
        padding: 2px 3px;
        transition: color 0.25s;
      }
      .lang-btn.active,
      .lang-btn:hover {
        color: var(--beige);
      }
      .lang-sep {
        color: rgba(0, 0, 0, 0.2);
        font-size: 10px;
      }
      .btn-nav-res {
        font-family: "Montserrat", sans-serif;
        font-size: 11.5px;
        font-weight: 600;
        letter-spacing: 1.5px;
        text-transform: uppercase;
        background: var(--vert);
        color: var(--blanc);
        border: none;
        padding: 10px 22px;
        border-radius: 3px;
        cursor: pointer;
        text-decoration: none;
        transition:
          background 0.25s,
          transform 0.15s;
        white-space: nowrap;
      }
      .btn-nav-res:hover {
        background: #b8994e;
        transform: translateY(-1px);
      }

      /* ══════════════════════════════════════════
   HERO — above the fold inclut les atouts
══════════════════════════════════════════ */
      #hero {
        position: relative;
        min-height: 84vh;
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        overflow: hidden;
      }
      .hero-slider {
        position: absolute;
        inset: 0;
        overflow: hidden;
      }
      .hero-slide {
        position: absolute;
        inset: 0;
        background-size: cover;
        background-position: center;
        opacity: 0;
        transition: opacity 1.4s ease-in-out;
        transform: scale(1.06);
        animation: hzoom 16s ease-in-out infinite alternate;
      }
      .hero-slide.active {
        opacity: 1;
      }
      /* Photos Unsplash — à remplacer par vos photos */
      .hero-slide:nth-child(1) { background-image: url('images/00-header_bg2.png'); animation-delay: 0s; }
      .hero-slide:nth-child(2) { background-image: url('images/26_resto.jpeg'); animation-delay: -5s; }
      .hero-slide:nth-child(3) { background-image: url('images/39_int_double.jpeg'); animation-delay: -10s; }
      .hero-slide:nth-child(4) { background-image: url('images/37_ext_terrasse_bungalow.jpeg'); animation-delay: -15s; }
      .hero-slide:nth-child(5) { background-image: url('images/28_ext_facade.jpeg'); animation-delay: -20s; }
      @keyframes hzoom {
        from { transform: scale(1.06); }
        to   { transform: scale(1.12); }
      }

      .hero-bg {
        position: absolute;
        inset: 0;
        background: url("images/00-header_bg2.png") center/cover no-repeat;
        /*transform: scale(1.06);*/
        animation: hzoom 14s ease-in-out infinite alternate;
      }
      @keyframes hzoom {
        from {
          transform: scale(1.06);
        }
        to {
          transform: scale(1.12);
        }
      }

      /* Dégradé vert du bas */
      .hero-overlay {
        position: absolute;
        inset: 0;
        /*background: linear-gradient(to top, rgba(22, 77, 138, 0.75) 0%, rgba(22, 77, 138, 0.35) 45%, rgba(22, 77, 138, 0.05) 100%);
        background: rgba(0,0,0,.35);
        background: linear-gradient(
          180deg,
          rgba(26, 46, 26, 1) 0%,
          rgba(26, 46, 26, 0.75) 28%,
          rgba(26, 46, 26, 0.35) 55%,
          rgba(26, 46, 26, 0.08) 100%
        ); */
      }

      .hero-content {
        position: relative;
        display: grid;
        gap: 20px;
        z-index: 2;
        padding: 0 6% 0;
        grid-template-columns: 2fr 1fr;
        margin-bottom: 20px;
        
      }
      .hero-eyebrow {
        font-family: "Montserrat", sans-serif;
        font-size: 11px;
        font-weight: 600;
        letter-spacing: 3.5px;
        text-transform: uppercase;
        color: var(--blanc);
        margin-bottom: 20px;
        opacity: 0;
        animation: fu 0.8s 0.2s forwards;
        background: rgba(45, 90, 39, 0.7);
        border-radius: 5px;
        border: 1px solid rgba(45, 90, 39, 0.5);
        padding: 5px;
        width: fit-content;
      }
      .hero-title {
        font-family: "Cormorant Garamond", serif;
        font-weight: 400;
        line-height: 1.05;
        color: var(--vert);
        margin-bottom: 20px;
        opacity: 0;
        animation: fu 0.9s 0.4s forwards;
      }
      .hero-title .line1 {
        display: block;
        font-size: clamp(34px, 3.5vw, 50px);
      }
      .hero-title .line2 {
        display: block;
        font-size: clamp(34px, 3.5vw, 50px);
        font-style: italic;
        color: var(--beige);
      }
      .hero-sub {
        font-family: "Lato", sans-serif;
        font-size: 16.5px;
        font-weight: 300;
        line-height: 1.75;
        /*color: rgba(45, 90, 39, 0.5);*/
        color:var(--vert-nuit);
        max-width: 500px;
        margin-bottom: 36px;
        opacity: 0;
        animation: fu 0.9s 0.6s forwards;
        
      }
      .hero-ctas {
        display: flex;
        gap: 14px;
        flex-wrap: nowrap;
        margin-bottom: 64px;
        opacity: 0;
        animation: fu 0.9s 0.75s forwards;
      }
      .btn-gold {
        font-family: "Montserrat", sans-serif;
        font-size: 12px;
        font-weight: 600;
        letter-spacing: 1.8px;
        text-transform: uppercase;
        background: var(--vert-nuit);
        color: var(--blanc);
        border: 2px solid var(--vert2);
        padding: 13px 30px;
        border-radius: 3px;
        cursor: pointer;
        text-decoration: none;
        white-space: nowrap;
        transition:
          background 0.25s,
          color 0.25s,
          transform 0.15s;
      }
      .btn-gold:hover {
        background: transparent;
        color: var(--beige);
        transform: translateY(-2px);
      }
      .btn-ghost {
        font-family: "Montserrat", sans-serif;
        font-size: 12px;
        font-weight: 600;
        letter-spacing: 1.8px;
        text-transform: uppercase;
        background: var(--beige);
        color: var(--vert-nuit);
        border: 2px solid var(--beige);
        padding: 13px 30px;
        border-radius: 3px;
        cursor: pointer;
        text-decoration: none;
        white-space: nowrap;
        transition:
          border-color 0.25s,
          transform 0.15s;
      }
      .btn-ghost:hover {
        border-color: #fff;
        transform: translateY(-2px);
      }

      @keyframes fu {
        from {
          opacity: 0;
          transform: translateY(22px);
        }
        to {
          opacity: 1;
          transform: translateY(0);
        }
      }

      /* ── ATOUTS (dans le hero above-the-fold) ── */
      .hero-atouts {
        position: relative;
        z-index: 2;
        /* vague SVG intégrée comme fond top */
      }
      .wave-top {
        display: block;
        width: 100%;
        margin-bottom: -2px; /* colle parfaitement */
        line-height: 0;
      }
      .wave-top svg {
        display: block;
        width: 100%;
        height: auto;
      }
      .atouts-band {
        /* background: var(--creme); */
        padding: 0px 6% 56px;
      }
      .atouts-grid {
        max-width: 1280px;
        margin: 0 auto;
        display: grid;
        grid-template-columns: repeat(5, 1fr);
        gap: 0;
      }
      .atout-item {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        padding: 16px 12px;
        border-right: 1px solid rgba(200, 169, 110, 0.28);
      }
      .atout-item:last-child {
        border-right: none;
      }
      .atout-ico {
        width: 34px;
        height: 34px;
        margin-bottom: 14px;
        color: var(--vert);
      }
      .atout-ico svg {
        width: 34px;
        height: 34px;
        fill: var(--vert);
        stroke: none;
        stroke-width: 1.5;
      }
      .atout-num {
        font-family: "Cormorant Garamond", serif;
        font-size: 42px;
        font-weight: 600;
        color: var(--vert);
        line-height: 1;
        margin-bottom: 6px;
      }
      .atout-label {
        font-family: "Montserrat", sans-serif;
        font-size: 10.5px;
        font-weight: 600;
        letter-spacing: 1.5px;
        text-transform: uppercase;
        color: var(--vert-nuit);
        margin-bottom: 3px;
      }
      .atout-sub {
        font-family: "Lato", sans-serif;
        font-size: 12px;
        color: rgba(26, 46, 26, 0.5);
        line-height: 1.4;
      }

      /* ══════════════════════════════════════════
   PRÉSENTATION — photos inclinées
══════════════════════════════════════════ */
      #presentation {
        padding: 0px 6% 96px;
        background-color: var(--creme);
        overflow: hidden;
        background-image: url(images/palm.jpg);
        background-size: cover;
        background-position: right;
        position: relative;
        &>*{
          position: relative;
          z-index: 1;
        }
        &::after{
          content: "";
          position: absolute;
          inset: 0;
          background: linear-gradient(to bottom,var(--creme) 20%, rgba(245, 240, 232, 0.8) 60%, rgba(245, 240, 232, 0.6) 80%, rgba(245, 240, 232, 0.4) 100%);
          pointer-events: none;
          z-index: 0;
          @media(max-width: 767px) {
            background: linear-gradient(to bottom, var(--creme) 20%, rgb(245 240 232 / 96%) 60%, rgb(245 240 232) 80%, rgb(245 240 232 / 93%) 100%);
          }
        }
      }
      .pres-wrap {
        max-width: 1280px;
        margin: 0 auto;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 72px;
        align-items: center;
      }
      .pres-label {
        font-family: "Montserrat", sans-serif;
        font-size: 11px;
        font-weight: 600;
        letter-spacing: 3px;
        text-transform: uppercase;
        color: var(--beige);
        margin-bottom: 14px;
      }
      .sec-title {
        font-family: "Cormorant Garamond", serif;
        font-size: clamp(36px, 4vw, 52px);
        font-weight: 800;
        line-height: 1.12;
        color: var(--vert-nuit);
        margin-bottom: 22px;
      }
      .sec-title em {
        font-style: italic;
        color: var(--beige);
      }
      .pres-txt {
        font-family: "Lato", sans-serif;
        font-size: 15.5px;
        line-height: 1.8;
        color: rgba(26, 46, 26, 0.72);
        margin-bottom: 20px;
      }
      .pres-chips {
        display: flex;
        gap: 10px;
        flex-wrap: wrap;
        margin-bottom: 32px;
      }
      .chip {
        font-family: "Montserrat", sans-serif;
        font-size: 10px;
        font-weight: 600;
        letter-spacing: 1px;
        text-transform: uppercase;
        color: var(--vert);
        background: rgba(45, 90, 39, 0.08);
        padding: 5px 12px;
        border-radius: 2px;
      }
      .btn-lien {
        font-family: "Montserrat", sans-serif;
        font-size: 11.5px;
        font-weight: 600;
        letter-spacing: 1.5px;
        text-transform: uppercase;
        color: var(--vert);
        text-decoration: none;
        border-bottom: 2px solid var(--beige);
        padding-bottom: 2px;
        transition: color 0.25s;
      }
      .btn-lien:hover {
        color: var(--beige);
      }

      /* Stack de photos inclinées */
      .photos-stack {
        position: relative;
        height: 480px;
        display: flex;
        align-items: center;
        justify-content: center;
      }
      .stack-photo {
        position: absolute;
        border-radius: 6px;
        overflow: hidden;
        box-shadow: 0 8px 40px rgba(26, 46, 26, 0.22);
        transition: transform 0.4s;
      }
      .stack-photo img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
      }
      .stack-photo:nth-child(1) {
        width: 260px;
        height: 320px;
        transform: rotate(-6deg) translate(-60px, 20px);
        z-index: 1;
      }
      .stack-photo:nth-child(2) {
        width: 280px;
        height: 340px;
        transform: rotate(2deg) translate(10px, -10px);
        z-index: 3;
      }
      .stack-photo:nth-child(3) {
        width: 240px;
        height: 290px;
        transform: rotate(7deg) translate(80px, 30px);
        z-index: 2;
      }
      .photos-stack:hover .stack-photo:nth-child(1) {
        transform: rotate(-8deg) translate(-70px, 24px);
      }
      .photos-stack:hover .stack-photo:nth-child(2) {
        transform: rotate(0deg) translate(10px, -16px) scale(1.02);
      }
      .photos-stack:hover .stack-photo:nth-child(3) {
        transform: rotate(9deg) translate(90px, 36px);
      }

      /* ══════════════════════════════════════════
   HÉBERGEMENTS
══════════════════════════════════════════ */
      #hebergements {
        padding: 96px 6%;
        background: var(--creme);
      }
      .sec-header {
        text-align: center;
        margin-bottom: 56px;
      }
      .ornement {
        display: flex;
        align-items: center;
        gap: 16px;
        justify-content: center;
        margin-bottom: 12px;
      }
      .ornement::before,
      .ornement::after {
        content: "";
        flex: 1;
        max-width: 56px;
        height: 1px;
        background: var(--beige);
      }
      .sec-header p {
        font-family: "Lato", sans-serif;
        font-size: 15px;
        color: rgba(26, 46, 26, 0.58);
        max-width: 420px;
        margin: 8px auto 0;
      }
      .grp-label {
        font-family: "Montserrat", sans-serif;
        font-size: 10.5px;
        font-weight: 600;
        letter-spacing: 2.5px;
        text-transform: uppercase;
        color: var(--vert);
        margin-bottom: 22px;
        display: flex;
        align-items: center;
        gap: 12px;
      }
      .grp-label::after {
        content: "";
        flex: 1;
        height: 1px;
        background: rgba(200, 169, 110, 0.35);
      }
      .cards3 {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 22px;
        margin-bottom: 44px;
      }
      .cards2 {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 22px;
        max-width: 860px;
      }
      .h-card {
        background: var(--blanc);
        border-radius: 8px;
        overflow: hidden;
        box-shadow: 0 2px 18px rgba(26, 46, 26, 0.07);
        transition:
          transform 0.3s,
          box-shadow 0.3s;
      }
      .h-card:hover {
        transform: translateY(-6px);
        box-shadow: 0 14px 42px rgba(26, 46, 26, 0.14);
      }
      .h-card-img {
        height: 196px;
        overflow: hidden;
        position: relative;
      }
      .h-card-img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: transform 0.6s;
      }
      .h-card:hover .h-card-img img {
        transform: scale(1.06);
      }
      .h-badge {
        position: absolute;
        top: 11px;
        left: 11px;
        font-family: "Montserrat", sans-serif;
        font-size: 9.5px;
        font-weight: 700;
        letter-spacing: 1.5px;
        text-transform: uppercase;
        background: var(--vert);
        color: #fff;
        padding: 4px 10px;
        border-radius: 2px;
      }
      .h-body {
        padding: 18px;
      }
      .h-cat {
        font-family: "Montserrat", sans-serif;
        font-size: 10px;
        font-weight: 600;
        letter-spacing: 2px;
        text-transform: uppercase;
        color: var(--beige);
        margin-bottom: 5px;
      }
      .h-name {
        font-family: "Cormorant Garamond", serif;
        font-size: 19px;
        font-weight: 600;
        color: var(--vert-nuit);
        margin-bottom: 11px;
        line-height: 1.2;
      }
      .h-tags {
        display: flex;
        gap: 6px;
        flex-wrap: wrap;
        margin-bottom: 15px;
      }
      .h-tag {
        font-family: "Montserrat", sans-serif;
        font-size: 9.5px;
        background: rgba(200, 169, 110, 0.12);
        color: var(--terre);
        padding: 3px 8px;
        border-radius: 2px;
      }
      .h-foot {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding-top: 14px;
        border-top: 1px solid rgba(200, 169, 110, 0.2);
      }
      .h-price .from {
        font-size: 10.5px;
        color: rgba(26, 46, 26, 0.45);
      }
      .h-price .amt {
        font-size: 17px;
        font-weight: 700;
        color: var(--terre);
      }
      .h-price .per {
        font-size: 10.5px;
        color: rgba(26, 46, 26, 0.45);
      }
      .btn-card {
        font-family: "Montserrat", sans-serif;
        font-size: 10.5px;
        font-weight: 600;
        letter-spacing: 1px;
        text-transform: uppercase;
        background: var(--vert);
        color: #fff;
        border: none;
        padding: 8px 16px;
        border-radius: 3px;
        cursor: pointer;
        text-decoration: none;
        transition: background 0.25s;
      }
      .btn-card:hover {
        background: var(--vert2);
      }

      /* ══════════════════════════════════════════
   EXPÉRIENCES (remplace restaurant+piscine+massages)
══════════════════════════════════════════ */
      #experiences {
        padding: 96px 6%;
        background: var(--blanc);
      }
      .exp-grid {
        max-width: 1280px;
        margin: 0 auto;
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 18px;
        margin-top: 56px;
      }
      .exp-card {
        border-radius: 8px;
        overflow: hidden;
        position: relative;
        height: 300px;
        cursor: pointer;
        box-shadow: 0 4px 20px rgba(26, 46, 26, 0.1);
      }
      .exp-card img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: transform 0.55s;
      }
      .exp-card:hover img {
        transform: scale(1.07);
      }
      .exp-ov {
        position: absolute;
        inset: 0;
        background: linear-gradient(
          to top,
          rgba(26, 46, 26, 0.88) 0%,
          rgba(26, 46, 26, 0.12) 55%
        );
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        padding: 24px;
        transition: background 0.3s;
      }
      .exp-card:hover .exp-ov {
        background: linear-gradient(
          to top,
          rgba(26, 46, 26, 0.95) 0%,
          rgba(26, 46, 26, 0.22) 65%
        );
      }
      .exp-ico {
        width: 40px;
        height: 40px;
        background: var(--beige);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 11px;
        flex-shrink: 0;
      }
      .exp-ico svg {
        width: 20px;
        height: 20px;
        stroke: #fff;
        fill: none;
        stroke-width: 2;
      }
      .exp-title {
        font-family: "Cormorant Garamond", serif;
        font-size: 21px;
        font-style: italic;
        color: #fff;
        margin-bottom: 6px;
        line-height: 1.15;
      }
      .exp-desc {
        font-family: "Lato", sans-serif;
        font-size: 12.5px;
        color: rgba(255, 255, 255, 0.72);
        line-height: 1.5;
        margin-bottom: 14px;
      }
      .exp-link {
        font-family: "Montserrat", sans-serif;
        font-size: 10px;
        font-weight: 600;
        letter-spacing: 1.5px;
        text-transform: uppercase;
        color: var(--beige);
        text-decoration: none;
        display: inline-flex;
        align-items: center;
        gap: 6px;
        opacity: 0;
        transform: translateY(8px);
        transition:
          opacity 0.3s,
          transform 0.3s;
      }
      .exp-card:hover .exp-link {
        opacity: 1;
        transform: translateY(0);
      }
      .exp-link svg {
        width: 13px;
        height: 13px;
        stroke: var(--beige);
        fill: none;
        stroke-width: 2.5;
      }
      .exclu-badge {
        position: absolute;
        top: 13px;
        right: 13px;
        font-family: "Montserrat", sans-serif;
        font-size: 9px;
        font-weight: 700;
        letter-spacing: 1.5px;
        text-transform: uppercase;
        background: var(--vert);
        color: #fff;
        padding: 4px 10px;
        border-radius: 2px;
      }

      /* ══════════════════════════════════════════
   GALERIE
══════════════════════════════════════════ */
      #galerie {
        padding: 96px 6%;
        background-color: var(--creme);
        position: relative;
        &>*{
          position: relative;
          z-index: 1;
        }
        &::before {
          content: "";
          position: absolute;
          inset: 0;
        background-image: url(images/palm-left.jpg);
        background-size: auto 100%;
        background-repeat: no-repeat;
        background-position: top left;
        pointer-events: none;
        z-index: 0;
        opacity: 0.15;
        }

      }
      .gal-grid {
        max-width: 1280px;
        margin: 56px auto 0;
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        grid-auto-rows: 190px;
        gap: 10px;
      }
      .g-item {
        border-radius: 6px;
        overflow: hidden;
        position: relative;
      }
      .g-item img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: transform 0.5s;
      }
      .g-item:hover img {
        transform: scale(1.06);
      }
      .g-item.tall {
        grid-row: span 2;
      }
      .g-item.wide {
        grid-column: span 2;
      }
      .g-ov {
        position: absolute;
        inset: 0;
        background: rgba(26, 46, 26, 0);
        display: flex;
        align-items: center;
        justify-content: center;
        transition: background 0.3s;
      }
      .g-item:hover .g-ov {
        background: rgba(26, 46, 26, 0.32);
      }
      .g-ov svg {
        width: 30px;
        height: 30px;
        stroke: #fff;
        fill: none;
        stroke-width: 1.5;
        opacity: 0;
        transition: opacity 0.3s;
      }
      .g-item:hover .g-ov svg {
        opacity: 1;
      }
      .gal-cta {
        text-align: center;
        margin-top: 40px;
      }

      /* ══════════════════════════════════════════
   AVIS
══════════════════════════════════════════ */
      #avis {
        padding: 80px 6%;
        background: var(--vert-nuit);
      }
      .avis-inner {
        max-width: 1280px;
        margin: 0 auto;
      }
      .avis-inner h2 em{
        color: var(--beige);
      }
      .avis-hd {
        text-align: center;
        margin-bottom: 48px;
      }
      .avis-hd .pres-label {
        color: var(--beige);
        font-family: "Montserrat", sans-serif;
        font-size: 11px;
        font-weight: 600;
        letter-spacing: 3px;
        text-transform: uppercase;
        margin-bottom: 10px;
      }
      .avis-hd .sec-title {
        color: #fff;
      }
      .avis-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 22px;
        margin-bottom: 40px;
      }
      .avis-card {
        background: rgba(255, 255, 255, 0.05);
        border-radius: 8px;
        padding: 26px;
        border-left: 3px solid var(--beige);
        transition: background 0.3s;
      }
      .avis-card:hover {
        background: rgba(255, 255, 255, 0.09);
      }

      /* Étoiles gold petites */
      .stars {
        display: flex;
        gap: 4px;
        margin-bottom: 14px;
      }
      .stars svg {
        width: 14px;
        height: 14px;
        fill: #c8a96e;
        stroke: #c8a96e;
        stroke-width: 1;
      }
      .avis-txt {
        font-family: "Cormorant Garamond", serif;
        font-size: 16.5px;
        font-style: italic;
        color: rgba(255, 255, 255, 0.88);
        line-height: 1.65;
        margin-bottom: 18px;
      }
      .avis-auth {
        display: flex;
        align-items: center;
        gap: 11px;
      }
      .avis-av {
        width: 36px;
        height: 36px;
        border-radius: 50%;
        background: rgba(200, 169, 110, 0.18);
        display: flex;
        align-items: center;
        justify-content: center;
        font-family: "Montserrat", sans-serif;
        font-size: 11px;
        font-weight: 600;
        color: var(--beige);
        flex-shrink: 0;
      }
      .avis-name {
        font-family: "Montserrat", sans-serif;
        font-size: 11.5px;
        font-weight: 600;
        color: #fff;
      }
      .avis-from {
        font-family: "Lato", sans-serif;
        font-size: 12px;
        color: rgba(255, 255, 255, 0.4);
      }
      .avis-cta {
        text-align: center;
      }
      .btn-google {
        display: inline-flex;
        align-items: center;
        gap: 9px;
        font-family: "Montserrat", sans-serif;
        font-size: 11.5px;
        font-weight: 600;
        letter-spacing: 1.5px;
        text-transform: uppercase;
        color: var(--beige);
        border: 1.5px solid rgba(200, 169, 110, 0.45);
        padding: 12px 28px;
        border-radius: 3px;
        text-decoration: none;
        transition:
          border-color 0.25s,
          background 0.25s;
      }
      .btn-google:hover {
        border-color: var(--beige);
        background: rgba(200, 169, 110, 0.07);
      }
      .btn-google svg {
        width: 16px;
        height: 16px;
        stroke: var(--beige);
        fill: none;
        stroke-width: 2;
      }

      /* ══════════════════════════════════════════
   CTA FINAL
══════════════════════════════════════════ */
      #cta-final {
        padding: 96px 6%;
        text-align: center;
        position: relative;
        overflow: hidden;
      }
      .cta-bg {
        position: absolute;
        inset: 0;
        background: url("images/16_ext.jpeg")
          center/cover no-repeat;
      }
      .cta-ov {
        position: absolute;
        inset: 0;
        background: rgba(26, 46, 26, 0.48);
      }
      .cta-cnt {
        position: relative;
        z-index: 2;
      }
      .cta-eyebrow {
        font-family: "Montserrat", sans-serif;
        font-size: 11px;
        font-weight: 600;
        letter-spacing: 3px;
        text-transform: uppercase;
        color: var(--beige);
        margin-bottom: 14px;
      }
      .cta-title {
        font-family: "Cormorant Garamond", serif;
        font-size: clamp(38px, 5vw, 64px);
        font-style: italic;
        color: #fff;
        margin-bottom: 32px;
        line-height: 1.1;
      }

      /* ══════════════════════════════════════════
   CARTE
══════════════════════════════════════════ */
      #footer-map {
        background: var(--blanc);
      }
      .map-hd {
        padding: 64px 6% 44px;
        text-align: center;
      }
      .map-hd p {
        font-family: "Lato", sans-serif;
        font-size: 15px;
        color: rgba(26, 46, 26, 0.55);
        max-width: 400px;
        margin: 8px auto 0;
      }
      .map-wrap {
        width: 100%;
        height: 360px;
        position: relative;
      }
      .map-wrap iframe {
        width: 100%;
        height: 100%;
        border: none;
        display: block;
        filter: saturate(0.85);
      }
      .map-pin {
        position: absolute;
        top: 22px;
        left: 5%;
        background: rgba(255, 255, 255, 0.97);
        border-radius: 6px;
        padding: 18px 22px;
        box-shadow: 0 4px 24px rgba(0, 0, 0, 0.12);
        border-left: 4px solid var(--beige);
        max-width: 270px;
      }
      .map-pin h4 {
        font-family: "Montserrat", sans-serif;
        font-size: 12.5px;
        font-weight: 600;
        color: var(--vert);
        margin-bottom: 10px;
      }
      .map-row {
        display: flex;
        align-items: flex-start;
        gap: 8px;
        margin-bottom: 7px;
      }
      .map-row svg {
        width: 13px;
        height: 13px;
        stroke: var(--beige);
        fill: none;
        stroke-width: 2;
        flex-shrink: 0;
        margin-top: 2px;
      }
      .map-row span {
        font-family: "Lato", sans-serif;
        font-size: 12.5px;
        color: rgba(26, 46, 26, 0.68);
        line-height: 1.4;
      }
      .map-row a {
        color: rgba(26, 46, 26, 0.68);
        text-decoration: none;
      }

      /* ══════════════════════════════════════════
   FOOTER
══════════════════════════════════════════ */
      footer {
        background: var(--vert-nuit);
        padding: 52px 6% 30px;
      }
      .footer-grid {
        max-width: 1280px;
        margin: 0 auto;
        display: grid;
        grid-template-columns: 2fr 1fr 1fr 1.4fr;
        gap: 44px;
        padding-bottom: 44px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
        margin-bottom: 28px;
      }
      .flogo {
        font-family: "Cormorant Garamond", serif;
        font-size: 30px;
        font-style: italic;
        color: var(--beige);
        display: block;
        margin-bottom: 4px;
        background: #fff;
        border-radius: 10px;
        padding: 10px;
        width: fit-content;
      }
      .flogo img{ width:auto; height:100px; }
      .flogo-sub {
        font-family: "Montserrat", sans-serif;
        font-size: 8px;
        letter-spacing: 3px;
        text-transform: uppercase;
        color: rgba(255, 255, 255, 0.3);
        display: block;
        margin-bottom: 14px;
      }
      .fdesc {
        font-family: "Lato", sans-serif;
        font-size: 13.5px;
        color: rgba(255, 255, 255, 0.5);
        line-height: 1.7;
        margin-bottom: 18px;
      }
      .fsocials {
        display: flex;
        gap: 10px;
      }
      .fsoc {
        width: 34px;
        height: 34px;
        border-radius: 50%;
        border: 1px solid rgba(255, 255, 255, 0.14);
        background: transparent;
        display: flex;
        align-items: center;
        justify-content: center;
        text-decoration: none;
        transition:
          border-color 0.25s,
          background 0.25s;
      }
      .fsoc:hover {
        border-color: var(--beige);
        background: rgba(200, 169, 110, 0.1);
      }
      .fsoc svg {
        width: 15px;
        height: 15px;
        stroke: #fff;
        fill: none;
        stroke-width: 2;
      }
      .fcol h5 {
        font-family: "Montserrat", sans-serif;
        font-size: 10.5px;
        font-weight: 600;
        letter-spacing: 2px;
        text-transform: uppercase;
        color: var(--beige);
        margin-bottom: 18px;
      }
      .flinks {
        list-style: none;
        display: flex;
        flex-direction: column;
        gap: 9px;
      }
      .flinks a {
        font-family: "Lato", sans-serif;
        font-size: 13.5px;
        color: rgba(255, 255, 255, 0.5);
        text-decoration: none;
        transition: color 0.25s;
      }
      .flinks a:hover {
        color: var(--beige);
      }
      .fcontact-row {
        display: flex;
        gap: 9px;
        margin-bottom: 13px;
      }
      .fcontact-row svg {
        width: 14px;
        height: 14px;
        stroke: var(--beige);
        fill: none;
        stroke-width: 2;
        flex-shrink: 0;
        margin-top: 2px;
      }
      .fcontact-row span,
      .fcontact-row a {
        font-family: "Lato", sans-serif;
        font-size: 13px;
        color: rgba(255, 255, 255, 0.5);
        line-height: 1.5;
        text-decoration: none;
      }
      .fcontact-row a:hover {
        color: var(--beige);
      }
      .footer-bt {
        max-width: 1280px;
        margin: 0 auto;
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-wrap: wrap;
        gap: 10px;
      }
      .footer-bt p,
      .footer-bt a {
        font-family: "Lato", sans-serif;
        font-size: 11.5px;
        color: rgba(255, 255, 255, 0.28);
        text-decoration: none;
      }
      .footer-bt a:hover {
        color: var(--beige);
      }
      .fcredits a {
        color: rgba(200, 169, 110, 0.45);
        text-decoration: none;
      }
      .fcredits a:hover {
        color: var(--beige);
      }

      /* ══════════════════════════════════════════
   WHATSAPP
══════════════════════════════════════════ */
      #wa {
        position: fixed;
        bottom: 26px;
        right: 26px;
        z-index: 999;
        width: 54px;
        height: 54px;
        border-radius: 50%;
        background: #25d366;
        display: flex;
        align-items: center;
        justify-content: center;
        text-decoration: none;
        box-shadow: 0 4px 18px rgba(37, 211, 102, 0.4);
        animation: wap 2.8s ease-in-out infinite;
        transition: transform 0.2s;
      }
      #wa:hover {
        transform: scale(1.1);
        animation: none;
      }
      #wa svg {
        width: 26px;
        height: 26px;
        fill: #fff;
      }
      @keyframes wap {
        0%,
        100% {
          box-shadow: 0 4px 18px rgba(37, 211, 102, 0.4);
        }
        50% {
          box-shadow:
            0 4px 30px rgba(37, 211, 102, 0.65),
            0 0 0 7px rgba(37, 211, 102, 0.1);
        }
      }

      /* ══════════════════════════════════════════
   REVEAL
══════════════════════════════════════════ */
      .rv {
        opacity: 0;
        transform: translateY(28px);
        transition:
          opacity 0.7s ease,
          transform 0.7s ease;
      }
      .rv.on {
        opacity: 1;
        transform: translateY(0);
      }
      .d1 {
        transition-delay: 0.1s;
      }
      .d2 {
        transition-delay: 0.2s;
      }
      .d3 {
        transition-delay: 0.3s;
      }
      .d4 {
        transition-delay: 0.4s;
      }

      /* ══════════════════════════════════════════
   RESPONSIVE
══════════════════════════════════════════ */
      @media (max-width: 1100px) {
        .atouts-grid {
          grid-template-columns: repeat(3, 1fr);
        }
        .atout-item:nth-child(3) {
          border-right: none;
        }
        .pres-wrap {
          grid-template-columns: 1fr;
          gap: 48px;
        }
        .photos-stack {
          height: 360px;
        }
        .cards3 {
          grid-template-columns: 1fr 1fr;
        }
        .cards2 {
          grid-template-columns: 1fr 1fr;
          max-width: 100%;
        }
        .exp-grid {
          grid-template-columns: 1fr 1fr;
        }
        .avis-grid {
          grid-template-columns: 1fr;
        }
        .footer-grid {
          grid-template-columns: 1fr 1fr;
        }
      }
      @media (max-width: 768px) {
        #header nav,
        .lang-sw {
          display: none;
        }
        .atouts-grid {
          grid-template-columns: repeat(2, 1fr);
        }
        .atout-item:nth-child(2) {
          border-right: none;
        }
        .cards3,
        .cards2 {
          grid-template-columns: 1fr;
        }
        .gal-grid {
          grid-template-columns: 1fr 1fr;
        }
        .g-item.wide {
          grid-column: span 1;
        }
        .exp-grid {
          grid-template-columns: 1fr;
        }
        .footer-grid {
          grid-template-columns: 1fr;
        }
        .footer-bt {
          flex-direction: column;
          text-align: center;
        }
        .photos-stack {
          height: 320px;
        }
        .stack-photo:nth-child(1) {
          width: 180px;
          height: 220px;
          transform: rotate(-5deg) translate(-46px, 16px);
        }
        .stack-photo:nth-child(2) {
          width: 200px;
          height: 250px;
          transform: rotate(2deg) translate(8px, -8px);
        }
        .stack-photo:nth-child(3) {
          width: 170px;
          height: 210px;
          transform: rotate(6deg) translate(56px, 24px);
        }
        .hero-ctas {
          flex-direction: column;
          align-items: flex-start;
        }
        .map-pin {
          display: none;
        }
      }
    

      /* ══════════════════════════════════════════
   PAGE INTÉRIEURE — HERO BANDEAU
══════════════════════════════════════════ */
      .page-hero-banner {
        width: 100%; height: 45vh; min-height: 320px; max-height: 480px;
        overflow: hidden;
      }
      .page-hero-banner img {
        width: 100%; height: 100%; object-fit: cover; display: block;
      }
      .page-title-bar {
        background: var(--creme); padding: 32px 6% 36px;
      }
      .page-title-inner { max-width: 1280px; margin: 0 auto; }
      .breadcrumb {
        font-family: "Montserrat", sans-serif; font-size: 10.5px; font-weight: 500;
        letter-spacing: 1.5px; text-transform: uppercase;
        color: rgba(26,46,26,.4); margin-bottom: 12px;
      }
      .breadcrumb a { color: var(--vert); text-decoration: none; }
      .breadcrumb a:hover { color: var(--beige); }
      .breadcrumb span { color: rgba(26,46,26,.25); margin: 0 6px; }
      .page-title-bar h1 {
        font-family: "Cormorant Garamond", serif;
        font-size: clamp(32px, 3.8vw, 48px); font-weight: 400;
        color: var(--vert-nuit); line-height: 1.15;
      }
      .page-title-bar h1 em { font-style: italic; color: var(--beige); }
      .page-intro {
        font-family: "Lato", sans-serif; font-size: 15.5px; line-height: 1.8;
        color: rgba(26,46,26,.6); max-width: 640px; margin-top: 10px;
      }
      #equipements {
        padding: 48px 6%; background: var(--blanc);
        border-bottom: 1px solid rgba(200,169,110,.15);
      }
      .equip-grid {
        max-width: 1280px; margin: 0 auto;
        display: flex; flex-wrap: wrap; gap: 28px; justify-content: center;
      }
      .equip-item {
        display: flex; align-items: center; gap: 8px;
        font-family: "Montserrat", sans-serif; font-size: 11px; font-weight: 500;
        letter-spacing: .5px; color: rgba(26,46,26,.65);
      }
      .equip-item p{
          margin-bottom: 0;
      }
      .equip-item svg {
        width: 18px;
        height: 18px;
        stroke: var(--beige);
        fill: none;
        stroke-width: 1.8;
        flex-shrink: 0;
      }
      #listing-chambres, #listing-bungalows { padding: 72px 6%; }
      #listing-chambres { background: var(--creme); }
      #listing-bungalows { background: var(--blanc); }
      .listing-inner { max-width: 1280px; margin: 0 auto; }
      #comparatif { padding: 72px 6%; background: var(--creme); }
      .compare-table {
        max-width: 1100px; margin: 48px auto 0; border-radius: 6px; overflow: hidden;
        border: 1px solid rgba(200,169,110,.2);
      }
      .compare-header {
        display: grid !important; grid-template-columns: 2fr 1fr 1fr 1.5fr 1.5fr;
        background: var(--vert-nuit); padding: 14px 20px;
      }
      .compare-header span {
        font-family: "Montserrat", sans-serif; font-size: 10px; font-weight: 600;
        letter-spacing: 2px; text-transform: uppercase; color: rgba(255,255,255,.8);
      }
      .compare-row {
        display: grid !important; grid-template-columns: 2fr 1fr 1fr 1.5fr 1.5fr;
        padding: 16px 20px; border-bottom: 1px solid rgba(200,169,110,.12);
        transition: background .2s; align-items: center;
      }
      .compare-row:last-child { border-bottom: none; }
      .compare-row:hover { background: rgba(200,169,110,.06); }
      .compare-row .type-name {
        font-family: "Cormorant Garamond", serif; font-size: 17px; font-weight: 600;
        color: var(--vert-nuit); display: flex; align-items: center; gap: 8px;
      }
      .compare-row .cat-badge {
        font-family: "Montserrat", sans-serif; font-size: 8px; font-weight: 700;
        letter-spacing: 1.5px; text-transform: uppercase; color: var(--beige);
        background: rgba(200,169,110,.1); padding: 2px 8px; border-radius: 2px;
      }
      .compare-row span {
        font-family: "Lato", sans-serif; font-size: 14px; color: rgba(26,46,26,.65);
      }
      .compare-row .tarif-cell { font-weight: 700; color: var(--terre); }
      .compare-row .vue-cell { font-size: 12.5px; color: rgba(26,46,26,.5); }
      #infos-pratiques { padding: 72px 6%; background: var(--blanc); }
      .infos-grid {
        max-width: 1100px; margin: 36px auto 0;
        display: grid !important; grid-template-columns: repeat(3, 1fr); gap: 16px;
      }
      .info-item {
        display: flex; gap: 12px; align-items: flex-start; padding: 20px;
        background: var(--creme); border-radius: 4px; border: 1px solid rgba(200,169,110,.1);
      }
      .info-item svg {
        width: 20px; height: 20px; stroke: var(--beige); fill: none; stroke-width: 2;
        flex-shrink: 0; margin-top: 2px;
      }
      .info-item strong {
        font-family: "Montserrat", sans-serif; font-size: 12px; font-weight: 600;
        color: var(--vert-nuit); display: block; margin-bottom: 2px;
      }
      .info-item span {
        font-family: "Lato", sans-serif; font-size: 13px;
        color: rgba(26,46,26,.6); line-height: 1.5;
      }
      @media (max-width: 1100px) {
        .compare-header, .compare-row { grid-template-columns: 2fr 1fr 1fr 1.5fr; }
        .compare-header span:last-child, .compare-row .vue-cell { display: none; }
        .infos-grid { grid-template-columns: 1fr 1fr; }
      }
      @media (max-width: 768px) {
        .compare-header, .compare-row { grid-template-columns: 1fr 1fr; gap: 8px; }
        .compare-header span:nth-child(3), .compare-header span:nth-child(5),
        .compare-row span:nth-child(3), .compare-row .vue-cell { display: none; }
        .equip-grid { gap: 16px; }
        .infos-grid { grid-template-columns: 1fr; }
        .page-hero-banner { height: 35vh; min-height: 240px; }
      }/* End custom CSS */