/* Luxury "Best Rate Promise" badge used for the Sun Siyam Resorts (group page, property pages, cards, home). */
.rate-badge {
    --rb-gold: #d6b25e;
    --rb-gold-deep: #a98332;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 9px 20px 9px 14px;
    border: 1px solid var(--rb-gold);
    border-radius: 999px;
    color: var(--rb-gold);
    line-height: 1.15;
    text-align: start;
    box-shadow: 0 10px 26px rgba(5, 23, 28, .22);
}

.rate-badge--dark {
    background: linear-gradient(135deg, rgba(8, 36, 43, .94), rgba(14, 58, 68, .94));
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
}

.rate-badge--light {
    background: linear-gradient(135deg, #fffaf0, #f6ead0);
    color: var(--rb-gold-deep);
    border-color: var(--rb-gold-deep);
    box-shadow: 0 8px 20px rgba(120, 90, 30, .12);
}

.rate-badge__icon {
    flex: 0 0 30px;
    width: 30px;
    height: 30px;
}

.rate-badge__text {
    display: grid;
    gap: 3px;
}

.rate-badge__text strong {
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: 19px;
    font-weight: 500;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.rate-badge__text small {
    color: rgba(255, 255, 255, .82);
    font-family: Inter, system-ui, sans-serif;
    font-size: 10px;
    font-weight: 500;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.rate-badge--light .rate-badge__text small {
    color: #6a5a34;
}

.rate-badge--compact {
    gap: 8px;
    padding: 6px 14px 6px 10px;
}

.rate-badge--compact .rate-badge__icon {
    flex-basis: 20px;
    width: 20px;
    height: 20px;
}

.rate-badge--compact .rate-badge__text strong {
    font-size: 14px;
    letter-spacing: .05em;
}

html[lang="ar"] .rate-badge__text strong,
html[lang="ar"] .rate-badge__text small {
    letter-spacing: 0;
    text-transform: none;
}

/* ---------------------------------------------------------------- property page */
.ssg-property-strip { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; margin: 18px 0 6px; }
.ssg-property-strip a { color: #a98332; font-size: 12px; font-weight: 700; letter-spacing: .1em; text-decoration: none; border-bottom: 1px solid currentColor; padding-bottom: 3px; }
html[lang="ar"] .ssg-property-strip a { letter-spacing: 0; font-size: 14px; }


.search-card__media { position: relative; }
.search-card__rate-badge { position: absolute; inset-block-start: 12px; inset-inline-start: 12px; z-index: 2; }

/* Banner on the /resorts listing that leads to the Sun Siyam group page. */
.sun-siyam-banner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 14px 26px;
    margin: 22px auto;
    padding: 18px 26px;
    background: linear-gradient(135deg, #072a33, #0f4d5a);
    color: #fff;
    text-decoration: none;
}

.sun-siyam-banner__text { display: grid; gap: 4px; }
.sun-siyam-banner__text strong { font-family: "Cormorant Garamond", Georgia, serif; font-size: 26px; font-weight: 500; }
.sun-siyam-banner__text small { color: rgba(255, 255, 255, .8); font-size: 12px; letter-spacing: .06em; }
.sun-siyam-banner__go { color: #d6b25e; font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
html[lang="ar"] .sun-siyam-banner__go { letter-spacing: 0; text-transform: none; font-size: 14px; }

/* Sun Siyam resort detail blocks: quick facts, villa types, dining, experiences, FAQ. */
.ssd-top { display: grid; gap: 16px; margin: 20px 0 8px; }
.ssd-facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; margin: 0; background: rgba(18, 54, 60, .12); border: 1px solid rgba(18, 54, 60, .12); }
.ssd-facts > div { background: #fff; padding: 14px 16px; }
.ssd-facts dt, .ssd-good dt { margin: 0 0 4px; font-size: 10px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #7d9194; }
.ssd-facts dd, .ssd-good dd { margin: 0; color: #12363c; line-height: 1.45; font-weight: 500; }
.ssd-intro, .ssd-note { margin: 0; color: #5d7478; line-height: 1.75; }
.ssd-note { font-size: 13px; }
.ssd-villas { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.ssd-villa { display: grid; gap: 4px; padding: 14px 16px; background: #fff; box-shadow: 0 10px 30px rgba(18, 54, 60, .06); }
.ssd-villa strong { font-weight: 600; color: #12363c; }
.ssd-villa span { font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: #6d8184; }
.ssd-dining { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.ssd-dining > div { display: grid; gap: 3px; padding: 14px 16px; background: #fff; border-inline-start: 3px solid #a98332; }
.ssd-dining strong { color: #12363c; font-weight: 600; }
.ssd-dining span { color: #36585d; }
.ssd-dining small { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: #7d9194; }
.ssd-label { margin: 0; font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #a98332; }
.ssd-section p { margin: 0; line-height: 1.75; color: #36585d; }
.ssd-experiences { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.ssd-experiences li { display: grid; gap: 3px; padding: 14px 16px; background: #eef5f3; color: #36585d; line-height: 1.5; }
.ssd-experiences li span { font-size: 10px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #0e5960; }
.ssd-good { display: grid; gap: 12px; margin: 0; }
.ssd-faq { display: grid; gap: 8px; }
.ssd-faq details { background: #fff; padding: 16px 18px; box-shadow: 0 10px 30px rgba(18, 54, 60, .06); }
.ssd-faq summary { cursor: pointer; font-weight: 600; color: #12363c; }
.ssd-faq details p { margin-top: 10px; }
@media (max-width: 900px) {
    .ssd-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ssd-villas, .ssd-dining, .ssd-experiences { grid-template-columns: 1fr; }
}
.ssd-islands { display: grid; gap: 10px; }
.ssd-islands__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.ssd-island { display: grid; gap: 5px; align-content: start; padding: 16px 18px; background: #fff; border-top: 3px solid #0e5960; box-shadow: 0 10px 30px rgba(18, 54, 60, .06); color: #36585d; text-decoration: none; line-height: 1.5; }
.ssd-island small { font-size: 10px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #0e5960; }
.ssd-island strong { font-size: 18px; color: #12363c; font-weight: 600; }
.ssd-island em { font-style: normal; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #a98332; }
.ssd-island--romance { border-top-color: #a98332; background: #fbf7ec; }
.ssd-island--romance small { color: #a98332; }
.ssd-island:hover { box-shadow: 0 14px 36px rgba(18, 54, 60, .12); }
.ssd-romance { display: grid; gap: 14px; padding: 26px; background: #fbf7ec; border-top: 3px solid #a98332; scroll-margin-top: 90px; }
.ssd-romance h4 { margin: 8px 0 0; font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #12363c; }
.ssd-romance__photos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.ssd-romance__photos img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; display: block; }
@media (max-width: 700px) {
    .ssd-islands__grid, .ssd-romance__photos { grid-template-columns: 1fr; }
    .ssd-romance { padding: 18px; }
}