
/* ==========================================================
   MARSA ALAM V2 — FINAL HOTEL PAGE
   Independent from legacy hotel CSS
   ========================================================== */

.v2h-page,
.v2h-page * {
  box-sizing: border-box !important;
}

.v2h-page {
  width: 100% !important;
  max-width: none !important;
  overflow-x: hidden !important;
  background: #fff !important;
  color: #06233d !important;
}

.v2h-page main {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}


/* ---------- HERO ---------- */

.v2h-page .v2h-hero {
  width: 100% !important;
  min-height: 620px !important;

  display: flex !important;
  align-items: center !important;

  background-position: center !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
}

.v2h-page .v2h-hero-inner {
  width: min(1180px, calc(100% - 48px)) !important;

  margin: 0 auto !important;
  padding: 78px 0 70px !important;

  display: grid !important;

  grid-template-columns:
    minmax(0, 1fr) 340px !important;

  gap: 70px !important;

  align-items: center !important;
}

.v2h-page .v2h-hero-copy {
  width: 100% !important;
  max-width: 760px !important;
  min-width: 0 !important;
}

.v2h-page .v2h-breadcrumb {
  margin: 0 0 18px !important;

  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;

  color: rgba(255,255,255,.92) !important;

  font-size: 14px !important;
  line-height: 1.5 !important;
}

.v2h-page .v2h-breadcrumb a,
.v2h-page .v2h-breadcrumb span {
  color: inherit !important;
}

.v2h-page .v2h-eyebrow {
  margin: 0 0 14px !important;

  color: #20a9ed !important;

  font-size: 13px !important;
  line-height: 1.3 !important;

  font-weight: 900 !important;

  letter-spacing: .12em !important;
  text-transform: uppercase !important;
}

.v2h-page .v2h-hero h1 {
  width: 100% !important;
  max-width: 760px !important;

  margin: 0 !important;

  color: #fff !important;

  font-size: clamp(44px, 5vw, 72px) !important;

  line-height: 1 !important;

  letter-spacing: -.035em !important;

  word-break: normal !important;
  overflow-wrap: normal !important;
}

.v2h-page .v2h-hero-description {
  width: 100% !important;
  max-width: 720px !important;

  margin: 25px 0 0 !important;

  color: #fff !important;

  font-size: 17px !important;
  line-height: 1.7 !important;
}

.v2h-page .v2h-area-link {
  width: 100% !important;
  max-width: 720px !important;

  margin: 14px 0 0 !important;
}

.v2h-page .v2h-area-link a {
  color: #f2c14e !important;
  font-weight: 800 !important;
  font-size: 15px !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}

.v2h-page .v2h-hero-checks {
  width: 100% !important;
  max-width: 720px !important;

  margin: 25px 0 0 !important;

  display: grid !important;

  grid-template-columns:
    repeat(2, minmax(0,1fr)) !important;

  gap: 12px 24px !important;

  color: #fff !important;

  font-size: 15px !important;
  font-weight: 800 !important;
  line-height: 1.5 !important;
}


/* ---------- BUTTONS ---------- */

.v2h-page .v2h-actions {
  margin: 28px 0 0 !important;

  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
}

.v2h-page .v2h-button {
  min-height: 50px !important;

  padding: 13px 22px !important;

  border-radius: 9px !important;
  border: 1px solid transparent !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  text-decoration: none !important;

  font-size: 15px !important;
  font-weight: 900 !important;
  line-height: 1.3 !important;
}

.v2h-page .v2h-button-primary {
  background: #18d875 !important;
  color: #032039 !important;
}

.v2h-page .v2h-button-outline {
  background: rgba(4,31,53,.30) !important;

  border-color:
    rgba(255,255,255,.55) !important;

  color: #fff !important;
}

.v2h-page .v2h-button-dark {
  background: #06243d !important;
  color: #fff !important;
}


/* ---------- HERO PRICE BOX ---------- */

.v2h-page .v2h-book-card {
  position: static !important;

  width: 100% !important;
  max-width: 340px !important;
  min-width: 0 !important;

  margin: 0 !important;

  padding: 28px !important;

  border: 0 !important;
  border-radius: 24px !important;

  background: #fff !important;
  color: #06233d !important;

  box-shadow:
    0 25px 70px rgba(0,0,0,.28) !important;
}

.v2h-page .v2h-card-label {
  margin: 0 0 8px !important;

  color: #d99d14 !important;

  font-size: 13px !important;
  font-weight: 900 !important;

  text-transform: uppercase !important;
  letter-spacing: .06em !important;
}

.v2h-page .v2h-book-card h2 {
  margin: 0 !important;

  color: #06233d !important;

  font-size: 23px !important;
  line-height: 1.2 !important;
}

.v2h-page .v2h-main-price {
  margin: 18px 0 0 !important;

  display: grid !important;
  grid-template-columns: auto 1fr !important;

  gap: 3px 10px !important;

  align-items: end !important;
}

.v2h-page .v2h-main-price span {
  color: #536b80 !important;

  font-size: 13px !important;
  font-weight: 800 !important;
}

.v2h-page .v2h-main-price strong {
  color: #06233d !important;

  font-size: 42px !important;
  line-height: 1 !important;

  text-align: right !important;
}

.v2h-page .v2h-main-price small {
  grid-column: 2 !important;

  color: #52687b !important;

  text-align: right !important;

  font-size: 12px !important;
}

.v2h-page .v2h-return-badge {
  margin: 20px 0 0 !important;

  padding: 14px !important;

  border:
    1px solid #e4aa20 !important;

  border-radius: 14px !important;

  background: #fff0bd !important;

  color: #06233d !important;

  font-size: 14px !important;
  font-weight: 900 !important;

  line-height: 1.45 !important;
}

.v2h-page .v2h-card-benefits {
  margin: 17px 0 0 !important;

  padding: 17px !important;

  display: grid !important;
  gap: 10px !important;

  border-radius: 15px !important;

  background: #f5eee4 !important;

  color: #53677a !important;

  font-size: 14px !important;
  font-weight: 800 !important;

  line-height: 1.45 !important;
}

.v2h-page .v2h-mini-prices {
  margin: 15px 0 0 !important;

  display: grid !important;

  grid-template-columns:
    repeat(2,minmax(0,1fr)) !important;

  gap: 10px !important;
}

.v2h-page .v2h-mini-prices > div {
  padding: 12px !important;

  display: grid !important;
  gap: 4px !important;

  border:
    1px solid #d9e3e9 !important;

  border-radius: 12px !important;

  background: #fff !important;
}

.v2h-page .v2h-mini-prices small {
  color: #63778a !important;

  font-size: 11px !important;
  font-weight: 800 !important;

  text-transform: uppercase !important;
}

.v2h-page .v2h-mini-prices strong {
  color: #06233d !important;

  font-size: 17px !important;
  line-height: 1.2 !important;
}


/* Price box must NOT contain image / booking button */

.v2h-page .v2h-card-image,
.v2h-page .v2h-book-card .v2h-button-full {
  display: none !important;
}


/* ---------- MAIN WRAPPER ---------- */

.v2h-page .v2h-main {
  width: min(1180px, calc(100% - 48px)) !important;

  max-width: 1180px !important;

  margin: 0 auto !important;

  padding: 68px 0 100px !important;
}


/* ---------- QUICK FACTS ---------- */

.v2h-page .v2h-quick-facts {
  width: 100% !important;

  margin: 0 0 72px !important;

  display: grid !important;

  grid-template-columns:
    repeat(
      auto-fit,
      minmax(175px,1fr)
    ) !important;

  gap: 12px !important;
}

.v2h-page .v2h-quick-facts > div {
  min-width: 0 !important;
  min-height: 108px !important;

  padding: 19px !important;

  border:
    1px solid #dbe4ea !important;

  border-radius: 16px !important;

  background: #fff !important;

  display: grid !important;
  align-content: center !important;
  gap: 7px !important;
}

.v2h-page .v2h-quick-facts small {
  color: #63778a !important;

  font-size: 11px !important;
  font-weight: 900 !important;

  text-transform: uppercase !important;
  letter-spacing: .07em !important;
}

.v2h-page .v2h-quick-facts strong {
  color: #06233d !important;

  font-size: 16px !important;
  line-height: 1.4 !important;
}


/* ---------- GENERAL SECTIONS ---------- */

.v2h-page .v2h-price-section,
.v2h-page .v2h-content-section,
.v2h-page .v2h-fixed-booking-steps,
.v2h-page .v2h-media-section,
.v2h-page .v2h-map-section,
.v2h-page .v2h-faq-section,
.v2h-page .v2h-related-section,
.v2h-page .v2h-final-cta {
  width: 100% !important;

  max-width: 980px !important;

  margin-left: auto !important;
  margin-right: auto !important;
}

.v2h-page .v2h-section-kicker {
  margin: 0 0 12px !important;

  color: #078ed1 !important;

  font-size: 13px !important;
  font-weight: 900 !important;

  line-height: 1.3 !important;

  letter-spacing: .11em !important;
  text-transform: uppercase !important;
}

.v2h-page .v2h-price-section h2,
.v2h-page .v2h-content-section h2,
.v2h-page .v2h-fixed-booking-steps h2,
.v2h-page .v2h-media-section h2,
.v2h-page .v2h-map-section h2,
.v2h-page .v2h-faq-section h2,
.v2h-page .v2h-related-section h2,
.v2h-page .v2h-final-cta h2 {
  width: 100% !important;

  max-width: 900px !important;

  margin: 0 !important;

  color: #06233d !important;

  font-size: clamp(35px,4vw,52px) !important;

  line-height: 1.08 !important;

  letter-spacing: -.025em !important;

  word-break: normal !important;
  overflow-wrap: normal !important;
}


/* ---------- PRICE SECTION ---------- */

.v2h-page .v2h-price-section {
  padding: 0 0 75px !important;
}

.v2h-page .v2h-price-grid {
  width: 100% !important;

  margin: 28px 0 0 !important;

  display: grid !important;

  grid-template-columns:
    repeat(3,minmax(0,1fr)) !important;

  gap: 15px !important;
}

.v2h-page .v2h-price-grid article {
  min-width: 0 !important;

  padding: 24px !important;

  border:
    1px solid #d7e1e8 !important;

  border-radius: 17px !important;

  background: #fff !important;

  display: grid !important;
  gap: 7px !important;
}

.v2h-page .v2h-price-grid span {
  color: #06233d !important;

  font-size: 15px !important;
  font-weight: 900 !important;
}

.v2h-page .v2h-price-grid strong {
  color: #06233d !important;

  font-size: 30px !important;
  line-height: 1.1 !important;
}

.v2h-page .v2h-price-grid small {
  color: #52697d !important;

  font-size: 12px !important;
}

.v2h-page .v2h-return-note {
  margin: 18px 0 0 !important;

  color: #06233d !important;

  font-size: 14px !important;
  font-weight: 900 !important;
}


/* ---------- RICH CONTENT ---------- */

.v2h-page .v2h-content-stack {
  width: 100% !important;
  max-width: none !important;
}

.v2h-page .v2h-content-section {
  padding: 63px 0 !important;

  border-top:
    1px solid #e7ecef !important;
}

.v2h-page .v2h-prose {
  width: 100% !important;

  max-width: 830px !important;

  margin: 24px 0 0 !important;

  display: grid !important;
  gap: 16px !important;
}

.v2h-page .v2h-prose p {
  width: 100% !important;
  max-width: 830px !important;

  margin: 0 !important;

  color: #304c61 !important;

  font-size: 17px !important;
  font-weight: 400 !important;

  line-height: 1.8 !important;

  word-break: normal !important;
  overflow-wrap: normal !important;
}


/* ---------- FIXED 3 BOOKING STEPS ---------- */

.v2h-page .v2h-fixed-booking-steps {
  padding: 65px 0 76px !important;

  border-top:
    1px solid #e7ecef !important;
}

.v2h-page .v2h-fixed-booking-grid {
  width: 100% !important;

  margin: 32px 0 0 !important;

  display: grid !important;

  grid-template-columns:
    repeat(3,minmax(0,1fr)) !important;

  gap: 16px !important;
}

.v2h-page .v2h-fixed-booking-card {
  min-width: 0 !important;
  min-height: 180px !important;

  padding: 22px 22px 25px !important;

  border:
    1px solid #d5e0e7 !important;

  border-radius: 19px !important;

  background: #fff !important;

  display: flex !important;

  flex-direction: column !important;

  align-items: flex-start !important;

  gap: 18px !important;
}

.v2h-page .v2h-fixed-booking-number {
  width: 30px !important;
  height: 30px !important;

  flex: 0 0 30px !important;

  border-radius: 50% !important;

  display: inline-flex !important;

  align-items: center !important;
  justify-content: center !important;

  background: #e2aa25 !important;

  color: #06233d !important;

  font-size: 14px !important;
  font-weight: 900 !important;
}

.v2h-page .v2h-fixed-booking-card p {
  width: 100% !important;

  margin: 0 !important;

  color: #344d62 !important;

  font-size: 16px !important;
  font-weight: 800 !important;

  line-height: 1.55 !important;

  word-break: normal !important;
  overflow-wrap: normal !important;
}


/* ---------- VIDEO ---------- */

.v2h-page .v2h-media-section {
  padding: 65px 0 !important;

  border-top:
    1px solid #e7ecef !important;
}

.v2h-page .v2h-video {
  width: 100% !important;

  margin: 27px 0 0 !important;

  aspect-ratio: 16 / 9 !important;

  overflow: hidden !important;

  border-radius: 20px !important;

  background: #06233d !important;
}

.v2h-page .v2h-video iframe {
  width: 100% !important;
  height: 100% !important;

  border: 0 !important;

  display: block !important;
}


/* ---------- BILDER / GALLERY ---------- */

.v2h-page .v2h-gallery-intro {
  width: 100% !important;
  max-width: 830px !important;

  margin: 20px 0 0 !important;

  color: #304c61 !important;

  font-size: 17px !important;
  line-height: 1.8 !important;
}

.v2h-page .v2h-gallery {
  width: 100% !important;

  margin: 28px 0 0 !important;

  display: grid !important;

  grid-template-columns:
    repeat(3,minmax(0,1fr)) !important;

  gap: 15px !important;
}

.v2h-page .v2h-gallery figure {
  width: 100% !important;

  min-width: 0 !important;

  margin: 0 !important;

  aspect-ratio: 4 / 3 !important;

  overflow: hidden !important;

  border-radius: 18px !important;

  background: #edf3f5 !important;
}

.v2h-page .v2h-gallery figure:first-child {
  grid-column: span 2 !important;
}

.v2h-page .v2h-gallery img {
  width: 100% !important;
  height: 100% !important;

  display: block !important;

  object-fit: cover !important;
}


/* ---------- ROUTE UND LAGE ---------- */

.v2h-page .v2h-map-section {
  margin-top: 35px !important;

  padding: 48px !important;

  border:
    1px solid #d8e3e9 !important;

  border-radius: 24px !important;

  background: #f5f8fa !important;
}

.v2h-page .v2h-route-copy {
  width: 100% !important;
  max-width: 830px !important;

  margin: 20px 0 0 !important;

  color: #304c61 !important;

  font-size: 17px !important;
  line-height: 1.8 !important;
}

.v2h-page .v2h-route-facts {
  margin: 24px 0 !important;

  display: flex !important;
  flex-wrap: wrap !important;

  gap: 10px !important;
}

.v2h-page .v2h-route-facts span {
  padding: 10px 16px !important;

  border-radius: 999px !important;

  background: #f7eee1 !important;

  color: #06233d !important;

  font-size: 14px !important;
  font-weight: 900 !important;
}

.v2h-page .v2h-map {
  width: 100% !important;

  min-height: 480px !important;

  margin: 28px 0 0 !important;

  aspect-ratio: 16 / 9 !important;

  overflow: hidden !important;

  border:
    1px solid #d8e1e6 !important;

  border-radius: 20px !important;

  background: #edf2f4 !important;
}

.v2h-page .v2h-map iframe {
  width: 100% !important;
  height: 100% !important;

  display: block !important;

  border: 0 !important;
}


/* ---------- FAQ ---------- */

.v2h-page .v2h-faq-section {
  padding: 72px 0 !important;

  border-top:
    1px solid #e7ecef !important;
}

.v2h-page .v2h-faq-list {
  width: 100% !important;

  margin: 30px 0 0 !important;

  display: grid !important;
  gap: 12px !important;
}

.v2h-page .v2h-faq-item {
  width: 100% !important;

  margin: 0 !important;

  overflow: hidden !important;

  border:
    1px solid #ded3c2 !important;

  border-radius: 16px !important;

  background: #f8f1e6 !important;
}

.v2h-page .v2h-faq-item summary {
  width: 100% !important;

  padding: 21px 23px !important;

  color: #06233d !important;

  cursor: pointer !important;

  font-size: 16px !important;
  font-weight: 900 !important;

  line-height: 1.45 !important;
}

.v2h-page .v2h-faq-item > div {
  padding:
    0 23px 21px !important;
}

.v2h-page .v2h-faq-item p {
  width: 100% !important;
  max-width: 830px !important;

  margin: 0 !important;

  color: #304c61 !important;

  font-size: 16px !important;
  line-height: 1.75 !important;
}


/* ---------- RELATED HOTELS ---------- */

.v2h-page .v2h-related-section {
  padding: 70px 0 !important;

  border-top:
    1px solid #e7ecef !important;
}

.v2h-page .v2h-related-grid {
  width: 100% !important;

  margin: 28px 0 0 !important;

  display: grid !important;

  grid-template-columns:
    repeat(3,minmax(0,1fr)) !important;

  gap: 15px !important;
}

.v2h-page .v2h-related-grid article {
  min-width: 0 !important;

  padding: 23px !important;

  border:
    1px solid #ded7cb !important;

  border-radius: 17px !important;

  background: #fbf4e9 !important;
}

.v2h-page .v2h-related-image {
  position: relative !important;

  width: 100% !important;

  aspect-ratio: 4 / 3 !important;

  margin: -23px -23px 16px !important;
  width: calc(100% + 46px) !important;

  border-radius: 17px 17px 0 0 !important;

  overflow: hidden !important;

  background: #edf3f5 !important;
}

.v2h-page .v2h-related-image img {
  width: 100% !important;
  height: 100% !important;

  display: block !important;

  object-fit: cover !important;
}

.v2h-page .v2h-related-grid h3 {
  margin: 0 0 12px !important;

  color: #06233d !important;

  font-size: 20px !important;
  line-height: 1.3 !important;
}

.v2h-page .v2h-related-grid p {
  margin: 0 0 14px !important;

  color: #435c70 !important;

  font-size: 14px !important;
  line-height: 1.5 !important;
}

.v2h-page .v2h-related-grid a {
  color: #067bb9 !important;

  font-weight: 900 !important;

  text-decoration: none !important;
}


/* ---------- FINAL CTA ---------- */

.v2h-page .v2h-final-cta {
  margin-top: 55px !important;

  padding: 36px !important;

  display: flex !important;

  align-items: center !important;
  justify-content: space-between !important;

  gap: 30px !important;

  border-radius: 23px !important;

  background: #f1f6f8 !important;
}

.v2h-page .v2h-final-cta .v2h-actions {
  margin: 0 !important;

  flex-shrink: 0 !important;
}


/* ---------- ABSOLUTELY DISABLE LEGACY HOTEL LAYOUT ---------- */

.v2h-page .hotel-v9-content-shell,
.v2h-page .hotel-v9-content-layout,
.v2h-page .hotel-v9-main,
.v2h-page .hotel-v9-sidebar,
.v2h-page .hotel-v9-book-card,
.v2h-page .v8-content-shell,
.v2h-page .v8-content-layout,
.v2h-page .v8-book-card,
.v2h-page .rebuild-hotel-page {
  display: none !important;
}


/* ---------- TABLET ---------- */

@media (max-width: 900px) {

  .v2h-page .v2h-hero {
    min-height: auto !important;
  }

  .v2h-page .v2h-hero-inner {
    grid-template-columns:
      1fr !important;

    gap: 35px !important;

    padding:
      65px 0 55px !important;
  }

  .v2h-page .v2h-book-card {
    max-width: 520px !important;
  }

  .v2h-page .v2h-price-grid,
  .v2h-page .v2h-gallery,
  .v2h-page .v2h-related-grid {
    grid-template-columns:
      repeat(2,minmax(0,1fr)) !important;
  }

  .v2h-page .v2h-gallery figure:first-child {
    grid-column:
      span 1 !important;
  }

  .v2h-page .v2h-map-section {
    padding: 35px !important;
  }
}


/* ---------- MOBILE ---------- */

@media (max-width: 650px) {

  .v2h-page .v2h-hero-inner,
  .v2h-page .v2h-main {
    width:
      calc(100% - 32px) !important;
  }

  .v2h-page .v2h-hero h1 {
    font-size: 40px !important;
  }

  .v2h-page .v2h-hero-description {
    font-size: 16px !important;
  }

  .v2h-page .v2h-hero-checks {
    grid-template-columns:
      1fr !important;
  }

  .v2h-page .v2h-price-grid,
  .v2h-page .v2h-fixed-booking-grid,
  .v2h-page .v2h-gallery,
  .v2h-page .v2h-related-grid {
    grid-template-columns:
      1fr !important;
  }

  .v2h-page .v2h-fixed-booking-card {
    min-height: auto !important;
  }

  .v2h-page .v2h-map-section {
    padding:
      28px 20px !important;
  }

  .v2h-page .v2h-map {
    min-height:
      350px !important;
  }

  .v2h-page .v2h-final-cta {
    padding: 25px !important;

    flex-direction:
      column !important;

    align-items:
      stretch !important;
  }

  .v2h-page .v2h-final-cta .v2h-actions {
    width: 100% !important;
  }

  .v2h-page .v2h-final-cta .v2h-button {
    width: 100% !important;
  }
}

