/* ============ Scoped: Staycation Showcase ============ */
      .staycation-showcase{
        --msc-bg: #f6f7fb;
        --msc-text: #101828;
        --msc-muted:#667085;
        --msc-line:#e9ecf3;
        --msc-card:#ffffff;
        --msc-accent:#f6cf7a;   /* orange */
        --msc-accent-2:#ffd4b1; /* soft peach */
        --msc-ghost:#f3f5fa;
        position: relative;
        overflow: clip;
        padding: 72px 0;
        background: radial-gradient(1200px 800px at 85% -20%, #f6cf7a 0%, transparent 55%),
                    radial-gradient(900px 700px at 0% 85%, #f6cf7a 0%, transparent 55%),
                    var(--msc-bg);
      }

      /* Decorative background */
      .msc-bg .msc-blob{
        position: absolute; inset: auto;
        filter: blur(50px);
        opacity: .45; pointer-events: none;
      }
      .msc-blob-a{ width: 40vmax; height: 40vmax; top:-12vmax; right:-10vmax; background: radial-gradient(circle at 30% 30%, var(--msc-accent), transparent 60%); animation: msc-float 18s ease-in-out infinite;}
      .msc-blob-b{ width: 35vmax; height: 35vmax; bottom:-10vmax; left:-8vmax; background: radial-gradient(circle at 60% 50%, var(--msc-accent-2), transparent 60%); animation: msc-float 22s ease-in-out infinite reverse;}
      @keyframes msc-float{ 0%,100%{transform:translate(0,0)} 50%{transform:translate(16px,-10px)} }

      .msc-grid{
        position:absolute; inset:0;
        background:
          linear-gradient(transparent 95%, rgba(0,0,0,.04) 95%) 0 0/ 28px 28px,
          linear-gradient(90deg, transparent 95%, rgba(0,0,0,.04) 95%) 0 0/ 28px 28px;
        mask-image: radial-gradient(1000px 600px at 70% 10%, #000 0%, transparent 70%);
        opacity:.25;
        pointer-events:none;
      }

      .msc-container{ max-width: 1200px; margin: 0 auto; padding: 0 16px; }

      .msc-head{
        text-align: center; margin-bottom: 28px;
      }
      .msc-head h2{
        margin:0 0 8px; color: var(--msc-text);
        font-size: clamp(24px, 4vw, 42px); font-weight: 900; letter-spacing:.2px;
      }
      .msc-head p{
        margin:0; color:var(--msc-muted); font-size: clamp(14px, 1.8vw, 18px);
      }

      /* Cards grid */
      .msc-cards{
        display: grid; gap: 22px;
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }

      .msc-card{
        display: grid;
        grid-template-rows: auto 1fr;
        background: linear-gradient(180deg, rgba(255,255,255,.7), rgba(255,255,255,.6));
        backdrop-filter: blur(10px);
        border: 1px solid var(--msc-line);
        border-radius: 18px;
        box-shadow: 0 30px 80px rgba(16, 24, 40, .08);
        overflow: hidden;
        transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease;
      }
      .msc-card:hover{
        transform: translateY(-6px);
        box-shadow: 0 40px 90px rgba(16, 24, 40, .12);
        border-color: rgba(255,122,24,.35);
      }

      /* Media */
      .msc-media{
        position: relative; overflow: hidden;
        aspect-ratio: 16/9; background:#fff;
      }
      .msc-media img{
        width: 100%; height: 100%; object-fit: cover; display:block;
        transform: scale(1.02);
        transition: transform .6s ease;
      }
      .msc-card:hover .msc-media img{ transform: scale(1.06); }

      /* Corner badge */
      .msc-badge{
        position: absolute; left: 14px; top: 14px;
        display:inline-flex; align-items:center; gap:8px;
        padding:8px 12px; font-size:12px; font-weight:700; letter-spacing:.2px;
        color:#7a3a12; background: rgba(255, 244, 233, .92);
        border:1px solid rgba(255, 184, 120, .6); border-radius: 999px;
        box-shadow: 0 6px 18px rgba(255,122,24,.18);
      }

      /* Body */
      .msc-body{ padding: 18px 18px 20px; }
      .msc-body h3{
        margin: 4px 0 8px; color: var(--msc-text);
        font-size: clamp(18px, 2.4vw, 26px); font-weight: 800;
      }
      .msc-body p{
        margin:0 0 12px; color: var(--msc-muted); line-height: 1.7;
      }

      /* Points */
      .msc-points{ list-style:none; padding:0; margin:0 0 14px; }
      .msc-points li{
        display:flex; align-items:center; gap:10px; color: var(--msc-text);
        margin: 6px 0;
      }
      .msc-points li::before{
        content:""; width:10px; height:10px; border-radius:50%;
        background: radial-gradient(circle at 30% 30%, var(--msc-accent), #f6cf7a);
        box-shadow: 0 0 0 3px #fff, 0 3px 12px rgba(255,122,24,.35);
      }

      /* Buttons */
      .msc-actions{ display:flex; flex-wrap:wrap; gap:10px; }
      .msc-btn{
        display:inline-flex; align-items:center; justify-content:center; gap:8px;
        padding:10px 14px; border-radius: 12px; text-decoration:none; font-weight:800;
        font-size: 14px; line-height:1; border:1px solid transparent;
      }
      .msc-btn-primary{
        background: linear-gradient(135deg, var(--msc-accent), #f6cf7a);
        color:#1b120a; box-shadow: 0 10px 24px rgba(255,122,24,.28);
      }
      .msc-btn-primary:hover{ filter: brightness(1.03); color:#ffffff;}
      .msc-btn-ghost{
        background: var(--msc-ghost); color: var(--msc-text);
        border-color: var(--msc-line);
      }
      .msc-btn-ghost:hover{ background:#fff; }

      /* Responsive */
      @media (max-width: 992px){
        .msc-cards{ grid-template-columns: 1fr; }
      }
    

      
        /* ====== Scoped styling for this section ====== */
        .space-up .before-after-left-area {
          padding: clamp(20px, 4vw, 48px);
          background: linear-gradient(180deg, #0f0f14 0%, #1b1f2a 100%);
          color: #fff;
          border-radius: 10px;
        }

        .space-up .pbmit-title {
          margin-bottom: 6px;
        }

        .space-up .pbmit-heading-desc {
          color: #e5e7eb;
          margin-top: 10px;
          line-height: 1.7;
        }

        /* Swiper container fills height nicely */
        .events-swiper-wrap {
          position: relative;
          border-radius: 10px;
          overflow: hidden;
          background: #0b0e14;
        }

        /* Ensure slides are neat and consistent */
        .events-swiper {
          width: 100%;
          height: 100%;
          min-height: 420px; /* desktop comfort */
        }
        @media (max-width: 767.98px) {
          .events-swiper { min-height: 300px; }
        }

        .events-swiper .swiper-slide {
          display: grid;
          place-items: center;
          background: #0b0e14;
        }
        .events-swiper .swiper-slide img {
          width: 100%;
          height: 420px;
          object-fit: cover;
        }

        /* Pagination & arrows styling */
        .events-swiper .swiper-pagination-bullet {
          background: rgba(255,255,255,.7);
          opacity: 1;
        }
        .events-swiper .swiper-pagination-bullet-active {
          background: #ff9f43; /* warm accent */
        }
        .events-swiper .swiper-button-prev,
        .events-swiper .swiper-button-next {
          color: #ffffff;
          text-shadow: 0 6px 18px rgba(0,0,0,.35);
        }
        .events-swiper .swiper-button-prev:hover,
        .events-swiper .swiper-button-next:hover {
          color: #ff9f43;
        }   


        /* Section skin */
.mrb-two-cta { padding: 36px 0; background:#fff; }
.mrb-two-cta h3 { margin:0 0 8px; font-weight:800; }
.mrb-two-cta .lead-note { color:#636e72; margin-bottom:16px; }

/* Button row */
.mrb-links { display: center; gap:10px; flex-wrap:wrap; }

/* Buttons */
.mrb-btn{
  display:inline-flex; align-items:center; gap:10px;
  padding:10px 14px; border-radius:12px; font-weight:700;
  text-decoration:none; border:1px solid transparent;
  box-shadow:0 8px 18px rgba(0,0,0,.06);
  transition:transform .15s ease, box-shadow .2s ease, filter .2s ease;
}
.mrb-btn:hover{ transform:translateY(-2px); box-shadow:0 12px 26px rgba(0,0,0,.10); }
.mrb-btn i{ font-size:1.1rem; }

/* Brand skins */
.mrb-ig{ background:#fff; color:#e1306c; border-color:#ffd1e1; }
.mrb-ig:hover{ filter:brightness(1.05); }

.mrb-airbnb{ background:#ff385c; color:#fff; }
.mrb-airbnb:hover{ filter:brightness(1.03); color: #f2f2f2;}

/* Cards (optional visual separation) */
.mrb-card{
  border:1px solid #eee; 
  border-radius:14px; 
  padding:16px 16px 14px;
  box-shadow:0 6px 16px rgba(0,0,0,.05); 
  text-align: center;
}