/* ================================================
   HOTEL THEMES — GUIA RÁPIDO PARA NOVOS HOTÉIS
   ================================================

   Todos os temas seguem um de dois padrões:

   APENAS DUAS SEÇÕES FORAM TEMATIZADAS ATÉ AGORA (hero e offer),
   então cada hotel tem apenas as variáveis necessárias para essas seções.

   ┌─────────────────────────────────────────────────────────────────┐
   │  GRUPO A — Secondary escuro                                     │
   │  Lado esquerdo: primary  │  Lado direito: secondary             │
   │  Todo texto e ícone usa neutral-6 (branco) nos dois lados.      │
   │                                                                 │
   │  Variáveis locais (topo do bloco):                              │
   │    --_p   cor primária  (lado esquerdo)                         │
   │    --_s   cor secundária (lado direito)                         │
   │    --cta-default cor dos ctas a partir da seção de experiências │
   │  Hotéis: mar, brisa, sol, cristal, giardino                     │
   └─────────────────────────────────────────────────────────────────┘

   ┌─────────────────────────────────────────────────────────────────┐
   │  GRUPO B — Secondary claro                                      │
   │  Lado esquerdo: primary  │  Lado direito: secondary (tom claro) │
   │  O lado direito usa uma cor de acento para texto e ícones.      │
   │                                                                 │
   │  Variáveis locais (topo do bloco):                              │
   │    --_p   cor primária   (lado esquerdo)                        │
   │    --_s   cor secundária (lado direito, tom claro)              │
   │    --_a   cor de acento  (texto e ícones do lado direito)       │
   │    --cta-default cor dos ctas a partir da seção de experiências │
   │  Hotéis: terra, pousada, luupi, refugio                         │
   └─────────────────────────────────────────────────────────────────┘

   --_p, --_s, --_a, --_cb e --_ct são variáveis privadas de cada hotel.
   Não são usadas fora do bloco — servem apenas para evitar
   repetir o mesmo token de cor várias vezes.

   --_n (neutral-6/branco) é definida no bloco compartilhado
   e herdada por todos os hotéis automaticamente.
   ================================================ */

/* ================================================
   SHARED HOTEL THEME RULES
   Define rules once — colors come from per-hotel variables below.
   ================================================ */

[class*="theme-hotel-"] {
  --_n: var(--color-neutral-6); /* branco — herdado por todos os hotéis */

  .hero-section {
    .wave-divider {
      .wave-path-top {
        fill: transparent !important;
        stroke: transparent !important;
      }
    }

    .wave-bottom {
      .bottom-color-left {
        stop-color: var(--hotel-hero-wave-left) !important;
      }
      .bottom-color-right {
        stop-color: var(--hotel-hero-wave-right) !important;
      }
    }

    @media (max-width: 1024px) {
      .wave-bottom .bottom-color-right {
        stop-color: var(--hotel-hero-wave-right-mobile) !important;
      }
    }
  }

  .offer-section {
    .left-side,
    .left-side-bg {
      background-color: var(--hotel-offer-left-bg) !important;
      color: var(--hotel-offer-left-text);

      p {
        color: var(--hotel-offer-left-text);
      }

      button, a {
        background-color: var(--hotel-offer-left-btn-bg);
        color: var(--hotel-offer-left-btn-color);
      }
    }

    .right-side,
    .right-side-bg {
      background-color: var(--hotel-offer-right-bg) !important;
      color: var(--hotel-offer-right-text);

      .title {
        color: var(--hotel-offer-right-title) !important;
      }

      .description {
        color: var(--hotel-offer-right-description);
      }

      .cta {
        background-color: var(--hotel-offer-right-bg);
        color: var(--hotel-offer-right-text) !important;

        .cta-icon-root {
          color: var(--hotel-offer-right-btn-icon-color) !important;
          background-color: var(--hotel-offer-right-btn-icon-bg) !important;
        }
      }
    }


    .wave-section-divider {
      .wave-path-top {
        fill: var(--hotel-wave-divider-top);
        stroke: var(--hotel-wave-divider-top);
      }

      .wave-path-bottom {
        fill: var(--hotel-wave-divider-bottom);
        stroke: var(--hotel-wave-divider-bottom);
      }
    }

    .wave-offer-bottom {
      .wave-path-top {
        fill: var(--hotel-wave-offer-bottom-top);
        stroke: var(--hotel-wave-offer-bottom-top);
      }

      .wave-path-bottom {
        fill: var(--hotel-wave-offer-bottom-bottom);
        stroke: var(--hotel-wave-offer-bottom-bottom);
      }
    }
  }

  /* experiences section */

  .experiences-section {
        a {
          color: var(--experience-cta-color)!important;
        }
        span:nth-child(2) {
            background-color: var(--experience-cta-color-bg)!important;
        }
  }

  .celebrate-section {
    .wave-section-divider {
      .wave-path-top {
        fill:  var(--hotel-celebrate-bg);
        stroke:  var(--hotel-celebrate-bg);
      }
      .wave-path-bottom {
        fill: var(--hotel-daily-bg);
        stroke: var(--hotel-daily-bg);
      }
    }

     .wave-section-end-mobile {
      .wave-path-top {
        fill: var(--hotel-daily-bg);
        stroke: var(--hotel-daily-bg);
      }
       .wave-path-bottom {
        fill: var(--color-foundation-azul2);
        stroke: var(--color-foundation-azul2);
      }
     }

     .wave-section-end-desktop {
      .wave-path-top {
        fill: transparent;
        stroke: transparent ;
      }
       .wave-path-bottom {
        fill: var(--color-foundation-azul2);
        stroke: var(--color-foundation-azul2);
      }
     }

    /* Mobile: each section carries its own background */
    .left-section {
      background-color: var(--hotel-celebrate-bg);

      h1 { color: var(--hotel-celebrate-title); }
      p  { color: var(--hotel-celebrate-description); }
      a  {
        color: var(--hotel-celebrate-btn-text)!important;
        background-color: var(--hotel-celebrate-btn-bg);
      }
    }

    .right-section {
      background-color: var(--hotel-daily-bg);

      h1 { color: var(--hotel-daily-title)!important; }
      p  { color: var(--hotel-daily-description)!important; }
      a  {
        color: var(--hotel-daily-btn-text)!important;
        background-color: var(--hotel-daily-btn-bg);
        span:nth-child(2) { color: var(--hotel-daily-btn-icon-bg)!important; }
      }
    }

    /* Desktop: gradient on the section itself — 50% always aligns with the centered grid divide */
    @media (min-width: 1280px) {
      background: linear-gradient(
        to right,
        var(--hotel-celebrate-bg) 50%,
        var(--hotel-daily-bg) 50%
      );

      .left-section,
      .right-section {
        background-color: transparent !important;
      }
    }
  }

  .wave-section-divider{
    .wave-path-top {
      fill: transparent;
      stroke: transparent;
    }
  }
  /* Wave that bridges the section above into the celebrate split */
  .celebrate-daily-wave-top {
    .wave-path-top {
      fill: transparent;
      stroke: transparent;
    }

    .bottom-color-left  { stop-color: var(--hotel-celebrate-bg); }
    .bottom-color-right { stop-color: var(--hotel-daily-bg); }
  }


  .section-event {
    a {
      color: var(--event-cta-color);
      span:nth-child(2) {
        background-color: var(--event-cta-color);
      }
    }
  }

  .rooms-section {
    background-color:  var(--color-neutral-6);
    color: var(--color-foundation-verde1);

    .rooms-nav {
      background-color: var(--hotel-rooms-color);
    }

    .rooms-button{
      background-color: var(--hotel-rooms-color);
    }

    .rooms-nav-icon {
      color: var(--color-neutral-6);
      fill: var(--color-neutral-6);
      stroke: var(--color-neutral-6);
    }

    .rooms-card-icon {
      color: var(--hotel-rooms-color);
      fill: var(--hotel-rooms-color);
      stroke: var(--hotel-rooms-color);
    }

    .rooms-card-badge {
      color:  var(--color-neutral-6) ;
    }
  }
}

/* ================================================
   GRUPO A — secondary escuro (texto branco no lado direito)
   ================================================ */

/* ── HOTEL MAR ── */
/* Exceção: --hotel-offer-right-p-color usa --_p em vez de neutral-6 */
.theme-hotel-mar {
  --_p: var(--color-foundation-azul2);
  --_s: var(--color-foundation-azul3);
  --_cb: var(--color-neutral-5);
  --_ct: var(--color-foundation-verde1);
  /* De experiencias para baixo, todos os CTAs usam a cor definida aqui */
  --cta-default: var(--color-foundation-azul2);

  /* Hero waves */
  --hotel-hero-wave-left:          var(--_p);
  --hotel-hero-wave-right:         var(--_s);
  --hotel-hero-wave-right-mobile:  var(--_p);

  /* Offer — left side */
  --hotel-offer-left-bg:           var(--_p);
  --hotel-offer-left-text:         var(--_n);
  --hotel-offer-left-btn-bg:       var(--_n);
  --hotel-offer-left-btn-color:    var(--_p);

  /* Offer — right side */
  --hotel-offer-right-bg:             var(--_s);
  --hotel-offer-right-text:           var(--_n);
  --hotel-offer-right-btn-icon-color: var(--_s);
  --hotel-offer-right-btn-icon-bg:    var(--_n);
  --hotel-offer-right-p-color:        var(--_p);
  --hotel-offer-right-title:        var(--_p);
  --hotel-offer-right-description:    var(--_n);

  /* Rooms */
  --hotel-rooms-color:               var(--_p);


  /* Waves */
  --hotel-wave-divider-top:           var(--_p);
  --hotel-wave-divider-bottom:        var(--_s);
  --hotel-wave-offer-bottom-top:      transparent;
  --hotel-wave-offer-bottom-bottom:   var(--_n);

  /* Celebrate */
  --hotel-celebrate-bg:               var(--_cb);
  --hotel-celebrate-title:            var(--_ct);
  --hotel-celebrate-description:      var(--_ct);
  --hotel-celebrate-btn-bg:           var(--_p);
  --hotel-celebrate-btn-text:         var(--_n);

  /* Daily programation */
  --hotel-daily-bg:                   var(--color-foundation-azul1);
  --hotel-daily-title:                var(--_n);
  --hotel-daily-description:          var(--_n);
  --hotel-daily-btn-bg:               var(--_n);
  --hotel-daily-btn-text:             var(--color-foundation-azul1);

  /* experiences section */
  --experience-cta-color:             var(--cta-default);
  --experience-cta-color-bg:          var(--cta-default);

  /* Events - Eventos corporativos */
  --event-cta-color:                  var(--cta-default);

  .offer-section {
    .right-side {
      .picto {
        @media (max-width: 767px) {
          width: 100px;
          height: auto !important;
          min-height: 0 !important;
          top: 104%;
        }
      }
    }
  }
}

/* ── HOTEL BRISA ── */
.theme-hotel-brisa {
  --_p: var(--color-foundation-verde2);
  --_s: var(--color-foundation-verde1);
  --_cb: var(--color-neutral-5);
  --_ct: var(--color-foundation-verde1);
  /* De experiencias para baixo, todos os CTAs usam a cor definida aqui */
  --cta-default: var( --color-foundation-laranja);

  /* Celebrate/Daily private colors */
  --_celebrate-bg:    var(--color-neutral-5);
  --_daily-bg:        var(--color-foundation-brisa-sage);
  --_daily-label:     var(--color-foundation-verde2);


  /* Hero waves */
  --hotel-hero-wave-left:          var(--_p);
  --hotel-hero-wave-right:         var(--_s);
  --hotel-hero-wave-right-mobile:  var(--_p);

  /* Offer — left side */
  --hotel-offer-left-bg:           var(--_p);
  --hotel-offer-left-text:         var(--_n);
  --hotel-offer-left-btn-bg:       var(--_n);
  --hotel-offer-left-btn-color:    var(--_p);

  /* Offer — right side */
  --hotel-offer-right-bg:             var(--_s);
  --hotel-offer-right-text:           var(--_n);
  --hotel-offer-right-btn-icon-color: var(--_s);
  --hotel-offer-right-btn-icon-bg:    var(--_n);
  --hotel-offer-right-p-color:        var(--_n);
  --hotel-offer-right-description:    var(--_n);

  /* Rooms */
  --hotel-rooms-color:               var(--_p);


  /* Waves */
  --hotel-wave-divider-top:           var(--_p);
  --hotel-wave-divider-bottom:        var(--_s);
  --hotel-wave-offer-bottom-top:      transparent;
  --hotel-wave-offer-bottom-bottom:   var(--_n);

  /* Celebrate */
  --hotel-celebrate-bg:               var(--_celebrate-bg);
  --hotel-celebrate-title:            var(--_ct);
  --hotel-celebrate-description:      var(--_ct);
  --hotel-celebrate-btn-bg:           var(--cta-default);
  --hotel-celebrate-btn-text:         var(--_n);

  /* Daily programation */
  --hotel-daily-bg:                   var(--_daily-bg);
  --hotel-daily-title:                var(--_n);
  --hotel-daily-description:          var(--_n);
  --hotel-daily-btn-bg:               var(--_n);
  --hotel-daily-btn-text:             var(--_daily-label);

  /* experiences section */
  --experience-cta-color:             var(--cta-default);
  --experience-cta-color-bg:          var(--cta-default);

  /* Events - Eventos corporativos */
  --event-cta-color:                  var(--cta-default);
}

/* ── HOTEL SOL ── */
.theme-hotel-sol {
  --_p: var(--color-foundation-sol);
  --_s: var(--color-foundation-verde2);
  --_cb: var(--color-neutral-5);
  --_ct: var(--color-foundation-verde1);
  /* De experiencias para baixo, todos os CTAs usam a cor definida aqui */
  --cta-default: var(--color-foundation-sol);


  /* Hero waves */
  --hotel-hero-wave-left:          var(--_p);
  --hotel-hero-wave-right:         var(--_s);
  --hotel-hero-wave-right-mobile:  var(--_p);

  /* Offer — left side */
  --hotel-offer-left-bg:           var(--_p);
  --hotel-offer-left-text:         var(--_n);
  --hotel-offer-left-btn-bg:       var(--_n);
  --hotel-offer-left-btn-color:    var(--_p);

  /* Offer — right side */
  --hotel-offer-right-bg:             var(--_s);
  --hotel-offer-right-text:           var(--_n);
  --hotel-offer-right-btn-icon-color: var(--_s);
  --hotel-offer-right-btn-icon-bg:    var(--_n);
  --hotel-offer-right-p-color:        var(--_n);
  --hotel-offer-right-description:    var(--_n);

    /* Rooms */
  --hotel-rooms-color:               var(--_p);


  /* Waves */
  --hotel-wave-divider-top:           var(--_p);
  --hotel-wave-divider-bottom:        var(--_s);
  --hotel-wave-offer-bottom-top:      transparent;
  --hotel-wave-offer-bottom-bottom:   var(--_n);

  /* Celebrate */
  --hotel-celebrate-bg:               var(--_cb);
  --hotel-celebrate-title:            var(--_ct);
  --hotel-celebrate-description:      var(--_ct);
  --hotel-celebrate-btn-bg:           var(--_p);
  --hotel-celebrate-btn-text:         var(--_n);

  /* Daily programation */
  --hotel-daily-bg:                   var(--_s);
  --hotel-daily-title:                var(--_n);
  --hotel-daily-description:          var(--_n);
  --hotel-daily-btn-bg:               var(--_n);
  --hotel-daily-btn-text:             var(--_s);

    /* experiences section */
  --experience-cta-color:             var(--cta-default);
  --experience-cta-color-bg:          var(--cta-default);

  /* Events - Eventos corporativos */
  --event-cta-color:                  var(--cta-default);
}

/* ── HOTEL CRISTAL ── */
.theme-hotel-cristal {
  --_p: var(--color-foundation-verde1);
  --_s: var(--color-foundation-azul2);
  --_cb: var(--color-neutral-5);
  --_ct: var(--color-foundation-verde1);
  /* De experiencias para baixo, todos os CTAs usam a cor definida aqui */
  --cta-default: var(--color-foundation-cristal-light);


  /* Hero waves */
  --hotel-hero-wave-left:          var(--_p);
  --hotel-hero-wave-right:         var(--_s);
  --hotel-hero-wave-right-mobile:  var(--_p);

  /* Offer — left side */
  --hotel-offer-left-bg:           var(--_p);
  --hotel-offer-left-text:         var(--_n);
  --hotel-offer-left-btn-bg:       var(--_n);
  --hotel-offer-left-btn-color:    var(--_p);

  /* Offer — right side */
  --hotel-offer-right-bg:             var(--_s);
  --hotel-offer-right-text:           var(--_n);
  --hotel-offer-right-btn-icon-color: var(--_s);
  --hotel-offer-right-btn-icon-bg:    var(--_n);
  --hotel-offer-right-p-color:        var(--_n);
  --hotel-offer-right-description:    var(--_n);

  /* Waves */
  --hotel-wave-divider-top:           var(--_p);
  --hotel-wave-divider-bottom:        var(--_s);
  --hotel-wave-offer-bottom-top:      transparent;
  --hotel-wave-offer-bottom-bottom:   var(--_n);

    /* Rooms */
  --hotel-rooms-color:               var(--_p);

  /* Celebrate */
  --hotel-celebrate-bg:               var(--_cb);
  --hotel-celebrate-title:            var(--_ct);
  --hotel-celebrate-description:      var(--_ct);
  --hotel-celebrate-btn-bg:           var(--cta-default);
  --hotel-celebrate-btn-text:         var(--_n);

  /* Daily programation */
  --hotel-daily-bg:                   var(--_p);
  --hotel-daily-title:                var(--_n);
  --hotel-daily-description:          var(--_n);
  --hotel-daily-btn-bg:               var(--_n);
  --hotel-daily-btn-text:             var(--_p);

    /* experiences section */
  --experience-cta-color:             var(--cta-default);
  --experience-cta-color-bg:          var(--cta-default);

  /* Events - Eventos corporativos */
  --event-cta-color:                  var(--cta-default);
}

/* ── HOTEL GIARDINO ── */
.theme-hotel-giardino {
  --_p: var(--color-foundation-giardino-verde);
  --_s: var(--color-foundation-giardino-terra);
  --_cb: var(--color-neutral-5);
  --_ct: var(--color-foundation-verde1);
  /* De experiencias para baixo, todos os CTAs usam a cor definida aqui */
  --cta-default: var(--color-foundation-giardino-terra);


  /* Hero waves */
  --hotel-hero-wave-left:          var(--_p);
  --hotel-hero-wave-right:         var(--_s);
  --hotel-hero-wave-right-mobile:  var(--_p);

   /* Rooms */
  --hotel-rooms-color:               var(--_p);


  /* Offer — left side */
  --hotel-offer-left-bg:           var(--_p);
  --hotel-offer-left-text:         var(--_n);
  --hotel-offer-left-btn-bg:       var(--_n);
  --hotel-offer-left-btn-color:    var(--_p);

  /* Offer — right side */
  --hotel-offer-right-bg:             var(--_s);
  --hotel-offer-right-text:           var(--_n);
  --hotel-offer-right-btn-icon-color: var(--_s);
  --hotel-offer-right-btn-icon-bg:    var(--_n);
  --hotel-offer-right-p-color:        var(--_n);
  --hotel-offer-right-description:    var(--_n);

  /* Waves */
  --hotel-wave-divider-top:           var(--_p);
  --hotel-wave-divider-bottom:        var(--_s);
  --hotel-wave-offer-bottom-top:      transparent;
  --hotel-wave-offer-bottom-bottom:   var(--_n);

  /* Celebrate */
  --hotel-celebrate-bg:               var(--_cb);
  --hotel-celebrate-title:            var(--_ct);
  --hotel-celebrate-description:      var(--_ct);
  --hotel-celebrate-btn-bg:           var(--_p);
  --hotel-celebrate-btn-text:         var(--_n);

  /* Daily programation */
  --hotel-daily-bg:                   var(--_s);
  --hotel-daily-title:                var(--_n);
  --hotel-daily-description:          var(--_n);
  --hotel-daily-btn-bg:               var(--_n);
  --hotel-daily-btn-text:             var(--_s);

  /* experiences section */
  --experience-cta-color:             var(--cta-default);
  --experience-cta-color-bg:          var(--cta-default);

  /* Events - Eventos corporativos */
  --event-cta-color:                  var(--cta-default);
}

/* ================================================
   GRUPO B — secondary claro (texto colorido no lado direito)
   ================================================ */

/* ── HOTEL TERRA ── */
.theme-hotel-terra {
  --_p: var(--color-foundation-terra);
  --_s: var(--color-foundation-terra-light);
  --_a: var(--color-foundation-terra-mid);
  --_b: var(--color-foundation-terra-cta);
  --_cb: var(--color-neutral-5);
  --_ct: var(--color-foundation-verde1);
  --cta-default: var(--color-foundation-terra-cta);


  /* Hero waves */
  --hotel-hero-wave-left:          var(--_p);
  --hotel-hero-wave-right:         var(--_s);
  --hotel-hero-wave-right-mobile:  var(--_p);

  /* Offer — left side */
  --hotel-offer-left-bg:           var(--_p);
  --hotel-offer-left-text:         var(--_n);
  --hotel-offer-left-btn-bg:       var(--_n);
  --hotel-offer-left-btn-color:    var(--_p);

  /* Offer — right side */
  --hotel-offer-right-bg:             var(--_s);
  --hotel-offer-right-text:           var(--_a);
  --hotel-offer-right-btn-icon-color: var(--_n);
  --hotel-offer-right-btn-icon-bg:    var(--_a);
  --hotel-offer-right-p-color:        var(--_a);
  --hotel-offer-right-description:    var(--_a);

  /* Waves */
  --hotel-wave-divider-top:           var(--_p);
  --hotel-wave-divider-bottom:        var(--_s);
  --hotel-wave-offer-bottom-top:      transparent;
  --hotel-wave-offer-bottom-bottom:   var(--_n);

    /* Rooms */
  --hotel-rooms-color:               var(--_b);

  /* Celebrate */
  --hotel-celebrate-bg:               var(--_cb);
  --hotel-celebrate-title:            var(--_ct);
  --hotel-celebrate-description:      var(--_ct);
  --hotel-celebrate-btn-bg:           var(--color-foundation-terra-mid);
  --hotel-celebrate-btn-text:         var(--_n);

  /* Daily programation */
  --hotel-daily-bg:                   var(--_s);
  --hotel-daily-title:                var(--_ct);
  --hotel-daily-description:          var(--_ct);
  --hotel-daily-btn-bg:               var(--color-foundation-terra-mid);
  --hotel-daily-btn-text:             var(--_n);

  /* experiences section */
  --experience-cta-color:             var(--cta-default);
  --experience-cta-color-bg:          var(--cta-default);

  /* Events - Eventos corporativos */
  --event-cta-color:                  var(--cta-default);

  .offer-section {
    .right-side {
      .picto {
        @media (max-width: 767px) {
          width: 120px;
          height: auto !important;
          min-height: 0 !important;
          right: -1.5rem;
          top: 105.6%;
        }
      }
    }
  }
}

/* ── HOTEL POUSADA ── */
.theme-hotel-pousada {
  --_p: var(--color-foundation-pousada);
  --_s: var(--color-foundation-pousada-light);
  --_a: var(--color-foundation-verde1);
  --_cb: var(--color-neutral-5);
  --_ct: var(--color-foundation-verde1);
  /* De experiencias para baixo, todos os CTAs usam a cor definida aqui */
  --cta-default: var(--color-foundation-pousada);


  /* Hero waves */
  --hotel-hero-wave-left:          var(--_p);
  --hotel-hero-wave-right:         var(--_s);
  --hotel-hero-wave-right-mobile:  var(--_p);

  /* Offer — left side */
  --hotel-offer-left-bg:           var(--_p);
  --hotel-offer-left-text:         var(--_n);
  --hotel-offer-left-btn-bg:       var(--_n);
  --hotel-offer-left-btn-color:    var(--_p);

  /* Offer — right side */
  --hotel-offer-right-bg:             var(--_s);
  --hotel-offer-right-text:           var(--_a);
  --hotel-offer-right-btn-icon-color: var(--_n);
  --hotel-offer-right-btn-icon-bg:    var(--_a);
  --hotel-offer-right-p-color:        var(--_a);
  --hotel-offer-right-description:    var(--_a);

  /* Waves */
  --hotel-wave-divider-top:           var(--_p);
  --hotel-wave-divider-bottom:        var(--_s);
  --hotel-wave-offer-bottom-top:      transparent;
  --hotel-wave-offer-bottom-bottom:   var(--_n);

    /* Rooms */
  --hotel-rooms-color:               var(--_p);


  /* Celebrate */
  --hotel-celebrate-bg:               var(--_cb);
  --hotel-celebrate-title:            var(--_ct);
  --hotel-celebrate-description:      var(--_ct);
  --hotel-celebrate-btn-bg:           var(--_p);
  --hotel-celebrate-btn-text:         var(--_n);

  /* Daily programation */
  --hotel-daily-bg:                   var(--_p);
  --hotel-daily-title:                var(--_n);
  --hotel-daily-description:          var(--_n);
  --hotel-daily-btn-bg:               var(--_n);
  --hotel-daily-btn-text:             var(--_p);

  /* experiences section */
  --experience-cta-color:             var(--cta-default);
  --experience-cta-color-bg:          var(--cta-default);

  /* Events - Eventos corporativos */
  --event-cta-color:                  var(--cta-default);
}

 .theme-hotel-luupi {
  --_p: var(--color-foundation-luupi-azul);
  --_s: var(--color-foundation-luupi-creme);
  --_a: var(--color-foundation-luupi-verde);
  --_cb: var(--color-neutral-5);
  --_ct: var(--color-foundation-verde1);
  /* De experiencias para baixo, todos os CTAs usam a cor definida aqui */
  --cta-default: var(--color-foundation-luupi-verde);


  /* Hero waves */
  --hotel-hero-wave-left:          var(--_p);
  --hotel-hero-wave-right:         var(--_s);
  --hotel-hero-wave-right-mobile:  var(--_p);

  /* Offer — left side */
  --hotel-offer-left-bg:           var(--_p);
  --hotel-offer-left-text:         var(--_n);
  --hotel-offer-left-btn-bg:       var(--_n);
  --hotel-offer-left-btn-color:    var(--_p);

  /* Offer — right side */
  --hotel-offer-right-bg:             var(--_s);
  --hotel-offer-right-text:           var(--_a);
  --hotel-offer-right-btn-icon-color: var(--_n);
  --hotel-offer-right-btn-icon-bg:    var(--_a);
  --hotel-offer-right-p-color:        var(--_a);
  --hotel-offer-right-description:    var(--_a);

  /* Waves */
  --hotel-wave-divider-top:           var(--_p);
  --hotel-wave-divider-bottom:        var(--_s);
  --hotel-wave-offer-bottom-top:      transparent;
  --hotel-wave-offer-bottom-bottom:   var(--_n);

    /* Rooms */
  --hotel-rooms-color:               var(--_p);


  /* Celebrate */
  --hotel-celebrate-bg:               var(--_cb);
  --hotel-celebrate-title:            var(--_ct);
  --hotel-celebrate-description:      var(--_ct);
  --hotel-celebrate-btn-bg:           var(--cta-default);
  --hotel-celebrate-btn-text:         var(--_n);

  /* Daily programation */
  --hotel-daily-bg:                   var(--_p );
  --hotel-daily-title:                var(--_n);
  --hotel-daily-description:          var(--_n);
  --hotel-daily-btn-bg:               var(--_n);
  --hotel-daily-btn-text:             var(--color-foundation-verde2);

   /* experiences section */
  --experience-cta-color:             var(--cta-default);
  --experience-cta-color-bg:          var(--cta-default);

  /* Events - Eventos corporativos */
  --event-cta-color:                  var(--cta-default);
}

/* ── HOTEL REFUGIO ── */
.theme-hotel-refugio {
  --_p: var(--color-foundation-verde2);
  --_s: var(--color-foundation-refugio-sage);
  --_a: var(--color-foundation-verde1);
  --_cb: var(--color-neutral-5);
  --_ct: var(--color-foundation-verde1);
  --cta-default: var(--color-foundation-verde2);


  /* Hero waves */
  --hotel-hero-wave-left:          var(--_p);
  --hotel-hero-wave-right:         var(--_s);
  --hotel-hero-wave-right-mobile:  var(--_p);

  /* Offer — left side */
  --hotel-offer-left-bg:           var(--_p);
  --hotel-offer-left-text:         var(--_n);
  --hotel-offer-left-btn-bg:       var(--_n);
  --hotel-offer-left-btn-color:    var(--_p);

  /* Offer — right side */
  --hotel-offer-right-bg:             var(--_s);
  --hotel-offer-right-text:           var(--_a);
  --hotel-offer-right-btn-icon-color: var(--_s);
  --hotel-offer-right-btn-icon-bg:    var(--_a);
  --hotel-offer-right-p-color:        var(--_a);
  --hotel-offer-right-description:    var(--_a);

  /* Waves */
  --hotel-wave-divider-top:           var(--_p);
  --hotel-wave-divider-bottom:        var(--_s);
  --hotel-wave-offer-bottom-top:      transparent;
  --hotel-wave-offer-bottom-bottom:   var(--_n);

    /* Celebrate */
  --hotel-celebrate-bg:               var(--_cb);
  --hotel-celebrate-title:            var(--_ct);
  --hotel-celebrate-description:      var(--_ct);
  --hotel-celebrate-btn-bg:           var(--color-foundation-terra-mid);
  --hotel-celebrate-btn-text:         var(--_n);

  /* Daily programation */
  --hotel-daily-bg:                   var(--_s);
  --hotel-daily-title:                var(--_ct);
  --hotel-daily-description:          var(--_ct);
  --hotel-daily-btn-bg:               var(--n);
  --hotel-daily-btn-text:             var(--_n);

    /* Rooms */
  --hotel-rooms-color:               var(--_p);


  /* Celebrate */
  --hotel-celebrate-bg:               var(--_cb);
  --hotel-celebrate-title:            var(--_ct);
  --hotel-celebrate-description:      var(--_ct);
  --hotel-celebrate-btn-bg:           var(--cta-default);
  --hotel-celebrate-btn-text:         var(--_n);

  /* Daily programation */
  --hotel-daily-bg:                   var(--_s);
  --hotel-daily-title:                var(--_n);
  --hotel-daily-description:          var(--_n);
  --hotel-daily-btn-bg:               var(--_n);
  --hotel-daily-btn-text:             var(--_p);

  /* experiences section */
  --experience-cta-color:             var(--cta-default);
  --experience-cta-color-bg:          var(--cta-default);

  /* Events - Eventos corporativos */
  --event-cta-color:                  var(--cta-default);
}

.theme-hotel-eco-chales {
  --_p: var(--color-foundation-verde1);
  --_s: var(--color-neutral-5);
  --_a: var(--color-foundation-verde1);
  --_t: var(--color-foundation-verde3);
  --_q: var(--color-foundation-verde2);

  --_cb: var(--color-neutral-5);
  --_ct: var(--color-foundation-verde1);
  --cta-default: var(--_p);

  /* Hero waves */
  --hotel-hero-wave-left:             var(--_p);
  --hotel-hero-wave-right:            var(--_s);
  --hotel-hero-wave-right-mobile:     var(--_p);

  /* Offer — left side */
  --hotel-offer-left-bg:              var(--_p);
  --hotel-offer-left-text:            var(--_n);
  --hotel-offer-left-btn-bg:          var(--_n);
  --hotel-offer-left-btn-color:       var(--_p);

  /* Offer — right side */
  --hotel-offer-right-bg:             var(--_s);
  --hotel-offer-right-text:           var(--_a);
  --hotel-offer-right-btn-icon-color: var(--_s);
  --hotel-offer-right-btn-icon-bg:    var(--_p);
  --hotel-offer-right-p-color:        var(--_a);
  --hotel-offer-right-description:    var(--_a);

  /* Waves */
  --hotel-wave-divider-top:           var(--_p);
  --hotel-wave-divider-bottom:        var(--_s);
  --hotel-wave-offer-bottom-top:      transparent;
  --hotel-wave-offer-bottom-bottom:   var(--_n);

  /* Rooms */
  --hotel-rooms-color:                var(--_p);

  /* Celebrate */
  --hotel-celebrate-bg:               var(--_s);
  --hotel-celebrate-title:            var(--_p);
  --hotel-celebrate-description:      var(--_p);
  --hotel-celebrate-btn-bg:           var(--_p);
  --hotel-celebrate-btn-text:         var(--color-neutral-6);

  /* Daily programation */
  --hotel-daily-bg:                   var(--_t);
  --hotel-daily-title:                var(--_n);
  --hotel-daily-description:          var(--_n);
  --hotel-daily-btn-bg:               var(--_n);
  --hotel-daily-btn-text:             var(--_q);

  /* experiences section */
  --experience-cta-color:             var(--cta-default);
  --experience-cta-color-bg:          var(--cta-default);

  --event-cta-color:                  var(--cta-default);
}

/*
  PENDING HOTELS — escolha o grupo e copie o bloco correspondente:

  Grupo A (secondary escuro, texto branco):
  .theme-hotel-{name} {
    --_p: var(--color-...);
    --_s: var(--color-...);
    --_cb: var(--color-neutral-5);
    --_ct: var(--color-foundation-verde1);

    --hotel-hero-wave-left:             var(--_p);
    --hotel-hero-wave-right:            var(--_s);
    --hotel-hero-wave-right-mobile:     var(--_p);
    --hotel-offer-left-bg:              var(--_p);
    --hotel-offer-left-text:            var(--_n);
    --hotel-offer-left-btn-bg:          var(--_n);
    --hotel-offer-left-btn-color:       var(--_p);
    --hotel-offer-right-bg:             var(--_s);
    --hotel-offer-right-text:           var(--_n);
    --hotel-offer-right-btn-icon-color: var(--_s);
    --hotel-offer-right-btn-icon-bg:    var(--_n);
    --hotel-offer-right-p-color:        var(--_n);
    --hotel-offer-right-description:    var(--_n);
    --hotel-wave-divider-top:           var(--_p);
    --hotel-wave-divider-bottom:        var(--_s);
    --hotel-wave-offer-bottom-top:      transparent;
    --hotel-wave-offer-bottom-bottom:   var(--_n);
    --hotel-celebrate-bg:               var(--_cb);
    --hotel-celebrate-title:            var(--_ct);
    --hotel-celebrate-description:      var(--_ct);
    --hotel-celebrate-btn-bg:           var(--_p);
    --hotel-celebrate-btn-text:         var(--_n);
    --hotel-daily-bg:                   var(--_s);
    --hotel-daily-title:                var(--_n);
    --hotel-daily-description:          var(--_n);
    --hotel-daily-btn-bg:               var(--_n);
    --hotel-daily-btn-text:             var(--_s);
    --experience-cta-color:             var(--_p);
    --experience-cta-color-bg:          var(--_p);
    --event-cta-color:                  var(--_p);
  }

  Grupo B (secondary claro, texto colorido):
  .theme-hotel-{name} {
    --_p: var(--color-...);
    --_s: var(--color-...);
    --_a: var(--color-...);
    --_cb: var(--color-neutral-5);
    --_ct: var(--color-foundation-verde1);

    --hotel-hero-wave-left:             var(--_p);
    --hotel-hero-wave-right:            var(--_s);
    --hotel-hero-wave-right-mobile:     var(--_p);
    --hotel-offer-left-bg:              var(--_p);
    --hotel-offer-left-text:            var(--_n);
    --hotel-offer-left-btn-bg:          var(--_n);
    --hotel-offer-left-btn-color:       var(--_p);
    --hotel-offer-right-bg:             var(--_s);
    --hotel-offer-right-text:           var(--_a);
    --hotel-offer-right-btn-icon-color: var(--_n);
    --hotel-offer-right-btn-icon-bg:    var(--_a);
    --hotel-offer-right-p-color:        var(--_a);
    --hotel-offer-right-description:    var(--_a);
    --hotel-wave-divider-top:           var(--_p);
    --hotel-wave-divider-bottom:        var(--_s);
    --hotel-wave-offer-bottom-top:      transparent;
    --hotel-wave-offer-bottom-bottom:   var(--_n);
    --hotel-celebrate-bg:               var(--_cb);
    --hotel-celebrate-title:            var(--_ct);
    --hotel-celebrate-description:      var(--_ct);
    --hotel-celebrate-btn-bg:           var(--_p);
    --hotel-celebrate-btn-text:         var(--_n);
    --hotel-daily-bg:                   var(--_s);
    --hotel-daily-title:                var(--_a);
    --hotel-daily-description:          var(--_a);
    --hotel-daily-btn-bg:               var(--_a);
    --hotel-daily-btn-text:             var(--_n);
    --event-cta-color:                  var(--_p);
  }

  Hotels pending:
  - .theme-hotel-eco-chales
*/