/* site palette */
html:root {
    --bg: #0D2628;
    --surface: #14383B;
    --surface-alt: #113134;
    --text: #EBEFF0;
    --text-muted: #B0BEBF;
    --border: #354648;
    --primary: #66D7E1;
    --primary-hover: #44CEDA;
    --on-primary: #111111;
    --primary-text: #66D7E1;
    --accent: #EDAAA1;
    --on-accent: #111111;
    --accent-text: #EDAAA1;
    --dark-band: #0D1616;
    --on-dark: #FFFFFF;
    --on-dark-muted: #B6C2C3;
    --brand-btn-bg: #111111;
    --brand-btn-text: #66D7E1;
    --section-alt-bg: #113134;
    --dark-band-bg: #0D1616;
    --brand-band-bg: #66D7E1;
    --hero-bg: #0D2628;
}

/* /site palette */

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    font-family: 'SUSE', sans-serif;
}

body {
    margin: 0;
    padding: 0;
    font-family: 'SUSE', sans-serif;
    background-color: var(--bg);
    color: var(--text);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

a,
button {
    transition: color 0.2s ease, background-color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.text-muted {
    color: var(--text-muted) !important;
}

.xjt-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background-color: var(--primary);
    color: var(--on-primary);
    font-family: 'SUSE', sans-serif;
    font-weight: 700;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 14px 28px;
    border-radius: 4px;
    border: 1px solid transparent;
    text-decoration: none;
    cursor: pointer;
}

.xjt-btn:hover {
    background-color: var(--primary-hover);
    color: var(--on-primary);
}

.xjt-btn-alt {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background-color: transparent;
    color: var(--primary-text);
    font-family: 'SUSE', sans-serif;
    font-weight: 700;
    font-size: 15px;
    padding: 13px 26px;
    border-radius: 4px;
    border: 1px solid var(--primary);
    text-decoration: none;
    cursor: pointer;
}

.xjt-btn-alt:hover {
    background-color: var(--primary);
    color: var(--on-primary);
}

.xjt-card {
    background-color: var(--surface);
    color: var(--text);
    border: 1px solid var(--border);
    border-radius: 4px;
    padding: 32px 28px;
    transition: border-color 0.2s ease;
}

.xjt-card:hover {
    border-color: var(--primary);
}

.xjt-media {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 10;
    border-radius: 4px;
    border: 1px solid var(--border);
    overflow: hidden;
    flex-shrink: 0;
}

.xjt-media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.xjt-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--primary);
}

.xjt-eyebrow::after {
    content: '';
    display: inline-block;
    width: 32px;
    height: 2px;
    background-color: var(--primary);
}

.xjt-eyebrow-center::before {
    content: '';
    display: inline-block;
    width: 32px;
    height: 2px;
    background-color: var(--primary);
}

.xjt-title {
    font-family: 'SUSE', sans-serif;
    font-size: 40px;
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: -0.01em;
    color: var(--text);
    margin: 0;
}

.xjt-title-highlight {
    color: var(--primary);
}

.xjt-badge {
    display: inline-flex;
    align-items: center;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    padding: 6px 12px;
    border-radius: 4px;
    background-color: var(--surface-alt);
    color: var(--primary);
    border: 1px solid var(--border);
}

.xjt-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    color: var(--primary);
    font-size: 36px;
}

.xjt-section {
    padding-top: 64px;
    padding-bottom: 64px;
    background-color: var(--bg);
}

.xjt-section-alt {
    padding-top: 64px;
    padding-bottom: 64px;
    background-color: var(--section-alt-bg, var(--surface-alt));
}

.xjt-section-dark {
    padding-top: 64px;
    padding-bottom: 64px;
    background-color: var(--dark-band-bg, var(--dark-band));
    color: var(--on-dark);
}

.xjt-section-dark .text-muted {
    color: var(--on-dark-muted) !important;
}

.xjt-section-brand {
    padding-top: 48px;
    padding-bottom: 48px;
    background-color: var(--brand-band-bg, var(--primary));
    color: var(--on-primary);
}

.xjt-section-brand .xjt-btn {
    background-color: var(--brand-btn-bg);
    color: var(--brand-btn-text);
}

.xjt-section-brand .xjt-btn:hover {
    background-color: var(--bg);
    color: var(--primary);
}

.xjt-section-brand .xjt-btn-alt {
    border-color: var(--on-primary);
    color: var(--on-primary);
}

.xjt-section-brand .xjt-btn-alt:hover {
    background-color: var(--on-primary);
    color: var(--primary);
}

@media (min-width: 768px) {

    .xjt-section,
    .xjt-section-alt,
    .xjt-section-dark {
        padding-top: 100px;
        padding-bottom: 100px;
    }

    .xjt-title {
        font-size: 48px;
    }
}

.xjt-on-dark {
    color: var(--on-dark);
}

.xjt-on-dark .text-muted {
    color: var(--on-dark-muted) !important;
}

.xjt-on-dark .xjt-title {
    color: var(--on-dark);
}

.xjt-on-dark .xjt-btn-alt {
    border-color: var(--on-dark);
    color: var(--on-dark);
}

.xjt-section-dark .xjt-card,
.xjt-on-dark .xjt-card {
    background-color: var(--surface);
    color: var(--text);
    border-color: var(--border);
}

.xjt-section-dark .xjt-card .text-muted,
.xjt-on-dark .xjt-card .text-muted {
    color: var(--text-muted) !important;
}

/* ===== header ===== */
.gb-header {
    position: sticky;
    top: 0;
    z-index: 50;
}

.gb-header .xjt-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    font-weight: 700;
    text-transform: uppercase;
}

.gb-header a {
    text-decoration: none;
}

/* ===== hero ===== */
.hero-block {
    position: relative;
}

.hero-block .hero-block__bg {
    background-size: cover;
    background-position: center;
}

.hero-block .xjt-btn:hover,
.hero-block .xjt-btn-alt:hover {
    transform: translateY(-2px);
}

/* ===== rooms-grid ===== */
#rooms-grid .xjt-card {
    transition: border-color 0.2s ease, transform 0.2s ease;
}

#rooms-grid .xjt-card:hover {
    border-color: var(--primary);
    transform: translateY(-2px);
}

#rooms-grid .js-filter-btn.active {
    background-color: var(--primary);
    color: var(--on-primary);
    border-color: var(--primary);
}

@media (max-width: 767px) {
    #rooms-grid .js-rooms-grid {
        grid-template-columns: 1fr;
    }
}

/* ===== services-grid ===== */
.services-block .services-card {
    min-height: 100%;
    transition: border-color 0.2s ease, transform 0.2s ease;
}

.services-block .services-card:hover {
    transform: translateY(-2px);
}

@media (max-width: 767px) {
    .services-block .grid {
        grid-template-columns: 1fr;
    }
}

/* ===== offers-grid ===== */
.offers-grid-section .js-filter-btn.active {
    background-color: var(--primary);
    color: var(--on-primary);
    border-color: var(--primary);
}

.offers-grid-section .js-offer-card {
    will-change: transform, opacity;
}

@media (max-width: 767px) {
    .offers-grid-section .js-offers-container {
        grid-template-columns: 1fr;
    }
}

/* ===== support-info ===== */
.support-section .support-decor-line {
    display: inline-block;
    height: 2px;
    vertical-align: middle;
}

.support-section .support-card {
    min-height: 100%;
    transition: border-color 0.2s ease;
}

.support-section .support-card:hover {
    border-color: var(--primary);
}

.support-section .support-icon-wrap i {
    line-height: 1;
}

.support-section .xjt-btn {
    white-space: normal;
    overflow-wrap: anywhere;
}

@media (max-width: 767px) {
    .support-section .support-action-box {
        flex-direction: column;
    }
}

/* ===== inside-look ===== */
.inside-look-block {
    position: relative;
    background-color: var(--bg);
}

.inside-look-block .inside-look-stat-card {
    box-shadow: none;
    backdrop-filter: blur(4px);
}

@media (max-width: 767px) {
    .inside-look-block .inside-look-stat-card {
        position: static;
        margin-top: 1rem;
        max-width: 100%;
    }
}

/* ===== geography ===== */
.geography-block .xjt-card {
    min-height: 100%;
    transition: border-color 0.2s ease, transform 0.2s ease;
}

.geography-block .xjt-card:hover {
    border-color: var(--primary);
    transform: translateY(-2px);
}

.geography-block .js-geo-tab.active {
    background-color: #111111;
    color: var(--primary);
}

@media (max-width: 767px) {
    .geography-block .js-geo-panel {
        grid-template-columns: 1fr;
    }
}

/* ===== footer ===== */
.gb-footer {
    background-color: #0D1616;
    color: #B6C2C3;
}

.gb-footer .gb-footer-link {
    text-decoration: none;
}

.gb-footer .gb-footer-link:hover {
    color: #66D7E1;
}

.gb-footer .gb-contact-icon {
    transition: border-color 0.2s ease, background-color 0.2s ease;
}

.gb-footer .gb-contact-icon:hover {
    border-color: #66D7E1;
    background-color: #113134;
}

@media (max-width: 767px) {
    .gb-footer .grid {
        grid-template-columns: 1fr;
    }
}

/* ===== PAGE: rooms ===== */
.rooms-catalog-block { background-color: var(--bg); color: var(--text); } .rooms-catalog-block .xjt-card { box-shadow: none; } .rooms-catalog-block select option { background-color: var(--surface); color: var(--text); } @media (max-width: 767px) { .rooms-catalog-block .rooms-catalog-grid { display: flex; flex-direction: column; } }

/* ===== PAGE: services ===== */
.services-catalog-section {
  background-color: var(--surface-alt);
}

.services-catalog-section .xjt-card {
  background-color: var(--surface);
  border-color: var(--border);
  transition: border-color 0.2s ease, transform 0.2s ease;
}

.services-catalog-section .xjt-card:hover {
  border-color: var(--primary);
}

.services-catalog-section a {
  overflow-wrap: anywhere;
}

@media (max-width: 767px) {
  .services-catalog-section .spotlight-list-wrapper {
    grid-template-columns: 1fr;
  }
}

/* ===== PAGE: offers ===== */
.offers-catalog-section {
  box-sizing: border-box;
}

.offers-catalog-section .offers-card {
  transition: border-color 0.2s ease, transform 0.2s ease;
}

.offers-catalog-section .offers-card:hover {
  border-color: var(--primary);
  transform: translateY(-2px);
}

.offers-catalog-section .truncate-words {
  overflow-wrap: anywhere;
  word-break: break-word;
}

.offers-catalog-section .offers-detail-link {
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color 0.2s ease;
}

.offers-catalog-section .offers-detail-link:hover {
  color: var(--primary-hover);
}

@media (max-width: 767px) {
  .offers-catalog-section .offers-card {
    flex-direction: column;
  }
  .offers-catalog-section .offers-card a.aspect-square {
    width: 100%;
    max-height: 220px;
  }
}

/* ===== PAGE: contact ===== */
.gb-contact-section { background-color: var(--bg); color: var(--text); } .gb-contact-card { transition: border-color 0.2s ease, transform 0.2s ease; } .gb-contact-card:hover { border-color: var(--primary); transform: translateY(-2px); }

/* ===== PAGE: privacy ===== */
.gb-privacy{background-color:var(--bg);color:var(--text);overflow-wrap:anywhere}.gb-privacy .xjt-card{min-height:100%;transition:border-color .2s ease}.gb-privacy .xjt-card:hover{border-color:var(--primary)}.gb-privacy .js-filter-btn{transition:background-color .2s ease,border-color .2s ease,color .2s ease}.gb-privacy .js-filter-btn.is-active{background-color:var(--primary);color:var(--on-primary);border-color:var(--primary)}@media (max-width:767px){.gb-privacy .xjt-title{hyphens:auto}.gb-privacy .grid{grid-template-columns:1fr}}

/* ===== PAGE: terms ===== */
.gb-terms-section .gb-nav-link.is-active{color:var(--primary);background-color:var(--surface-alt);border-left:2px solid var(--primary);padding-left:10px}.gb-terms-section .gb-terms-block{scroll-margin-top:24px}.gb-terms-section a{overflow-wrap:anywhere}.gb-terms-section h2,.gb-terms-section h3{overflow-wrap:anywhere}

.gb-terms-section .xjt-btn-alt {
    color: var(--text);
    border-color: var(--border);
}

.gb-terms-section .xjt-btn-alt:hover,
.gb-terms-section .xjt-btn-alt:focus-visible {
    background-color: #14383B;
    border-color: var(--border);
    color: var(--text);
}

.gb-terms-section .xjt-btn-alt:active {
    background-color: #1A4246;
    border-color: var(--border);
    color: var(--text);
}

/* "Call Direct" style alt-buttons pointing at tel: links must switch to
   dark text whenever the hover/focus fill turns light */
.xjt-btn-alt[href^="tel:"]:hover,
.xjt-btn-alt[href^="tel:"]:focus-visible,
.xjt-btn-alt[href^="tel:"]:active {
    background-color: var(--primary);
    border-color: var(--primary);
    color: var(--on-primary);
}

/* ===== PAGE: disclaimer ===== */
.disclaimer-page .js-filter-btn.active-tab {
  background-color: var(--primary);
  color: var(--on-primary);
  border-color: var(--primary);
}
.disclaimer-page .js-filter-btn:not(.active-tab):hover {
  border-color: var(--primary);
  color: var(--primary-text);
}
.disclaimer-page .js-disclaimer-item {
  min-height: 220px;
}
@media (max-width: 767px) {
  .disclaimer-page .js-disclaimer-cards {
    grid-template-columns: 1fr;
  }
}

.comment-item {
    font-family: 'SUSE', sans-serif;
    background-color: #14383B;
    border: 1px solid #354648;
    border-radius: 4px;
}

.comment-avatar {
    width: 48px;
    height: 48px;
    object-fit: cover;
    border: 1px solid #354648;
}

.comment-author {
    color: #EBEFF0;
    font-weight: 700;
}

.comment-date {
    color: #B0BEBF;
}

.comment-text {
    color: #B0BEBF;
    line-height: 1.7;
}

.comment-like-btn {
    color: #B0BEBF;
    cursor: pointer;
    transition: color 0.2s ease;
    background: transparent;
    border: none;
}

.comment-like-btn:hover {
    color: #66D7E1;
}

.comment-reply-btn {
    color: #66D7E1;
    cursor: pointer;
    transition: color 0.2s ease;
    background: transparent;
    border: none;
}

.comment-reply-btn:hover {
    color: #44CEDA;
}

.comment-actions {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
}

.comment-item .comment-like-btn,
.comment-item .comment-reply-btn,
.reply-item .reply-like-btn {
    white-space: nowrap;
    flex-shrink: 0;
}

@media (max-width: 640px) {
    .comment-actions {
        gap: 10px;
    }

    .comment-item .comment-like-btn,
    .comment-item .comment-reply-btn,
    .reply-item .reply-like-btn {
        gap: 4px;
        min-width: 0;
    }
}

.reply-item {
    font-family: 'SUSE', sans-serif;
    background-color: #113134;
    border: 1px solid #354648;
    border-left: 2px solid #66D7E1;
    border-radius: 4px;
}

.reply-avatar {
    width: 40px;
    height: 40px;
    object-fit: cover;
    border: 1px solid #354648;
}

.reply-author {
    color: #EBEFF0;
    font-weight: 700;
}

.reply-role {
    color: #66D7E1;
}

.reply-date {
    color: #B0BEBF;
}

.reply-text {
    color: #B0BEBF;
    line-height: 1.7;
}

.reply-like-btn {
    color: #B0BEBF;
    cursor: pointer;
    transition: color 0.2s ease;
    background: transparent;
    border: none;
}

.reply-like-btn:hover {
    color: #66D7E1;
}


/* ===== PAGE TEMPLATE: rooms ===== */
.gb-header {
    position: sticky;
    top: 0;
    z-index: 50;
}

.gb-header .xjt-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    font-weight: 700;
    text-transform: uppercase;
}

.gb-header a {
    text-decoration: none;
}

.hero-block {
    position: relative;
}

.hero-block .hero-block__bg {
    background-size: cover;
    background-position: center;
}

.hero-block .xjt-btn:hover,
.hero-block .xjt-btn-alt:hover {
    transform: translateY(-2px);
}

.gb-footer {
    background-color: #0D1616;
    color: #B6C2C3;
}

.gb-footer .gb-footer-link {
    text-decoration: none;
}

.gb-footer .gb-footer-link:hover {
    color: #66D7E1;
}

.gb-footer .gb-contact-icon {
    transition: border-color 0.2s ease, background-color 0.2s ease;
}

.gb-footer .gb-contact-icon:hover {
    border-color: #66D7E1;
    background-color: #113134;
}

.room-detail-content .room-section-title {
    overflow-wrap: anywhere;
}

.room-detail-content .js-tab-btn.active {
    background-color: #66D7E1;
    color: #111111;
    border-color: #66D7E1;
}

.room-detail-content .comment-like-btn.is-active,
.room-detail-content .reply-like-btn.is-active {
    color: #66D7E1;
}

@media (max-width: 767px) {
    .gb-footer .grid {
        grid-template-columns: 1fr;
    }

    .room-detail-content .room-summary .grid {
        grid-template-columns: 1fr;
    }
}

/* ===== PAGE TEMPLATE: services ===== */
.gb-header {
    position: sticky;
    top: 0;
    z-index: 50;
}

.gb-header .xjt-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    font-weight: 700;
    text-transform: uppercase;
}

.gb-header a {
    text-decoration: none;
}

.hero-block {
    position: relative;
}

.hero-block .hero-block__bg {
    background-size: cover;
    background-position: center;
}

.hero-block .xjt-btn:hover,
.hero-block .xjt-btn-alt:hover {
    transform: translateY(-2px);
}

.gb-footer {
    background-color: #0D1616;
    color: #B6C2C3;
}

.gb-footer .gb-footer-link {
    text-decoration: none;
}

.gb-footer .gb-footer-link:hover {
    color: #66D7E1;
}

.gb-footer .gb-contact-icon {
    transition: border-color 0.2s ease, background-color 0.2s ease;
}

.gb-footer .gb-contact-icon:hover {
    border-color: #66D7E1;
    background-color: #113134;
}

.service-tabs-wrapper .js-tab-btn[aria-selected="true"] {
    color: #66D7E1;
    border-color: #66D7E1;
}

.service-tabs-wrapper .js-tab-btn[aria-selected="false"] {
    color: #B0BEBF;
    border-color: transparent;
}

@media (max-width: 767px) {
    .gb-footer .grid {
        grid-template-columns: 1fr;
    }
}

/* ===== PAGE TEMPLATE: offers ===== */
.gb-header {
    position: sticky;
    top: 0;
    z-index: 50;
}

.gb-header .xjt-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    font-weight: 700;
    text-transform: uppercase;
}

.gb-header a {
    text-decoration: none;
}

.hero-block {
    position: relative;
}

.hero-block .hero-block__bg {
    background-size: cover;
    background-position: center;
}

.gb-footer {
    background-color: #0D1616;
    color: #B6C2C3;
}

.gb-footer .gb-footer-link {
    text-decoration: none;
}

.gb-footer .gb-footer-link:hover {
    color: #66D7E1;
}

.gb-footer .gb-contact-icon {
    transition: border-color 0.2s ease, background-color 0.2s ease;
}

.gb-footer .gb-contact-icon:hover {
    border-color: #66D7E1;
    background-color: #113134;
}

.offer-detail-page .offer-prose p {
    margin-bottom: 1rem;
}

.offer-detail-page .offer-prose p:last-child {
    margin-bottom: 0;
}

.offer-detail-page .js-comment-like.is-liked {
    color: #66D7E1;
}

.offer-detail-page .js-comment-like.is-liked i {
    font-family: 'remixicon';
}

@media (max-width: 767px) {
    .gb-footer .grid {
        grid-template-columns: 1fr;
    }
}

/* mobile-text-guard */
@media (max-width: 767px) {
  h1, h2, h3, h4, h5, h6, p, li, dt, dd, blockquote, figcaption, td, th, label {
    overflow-wrap: anywhere;
  }
  a, button, .btn {
    overflow-wrap: anywhere;
    white-space: normal;
  }
  img, video, iframe {
    max-width: 100%;
  }
}