/* Service photos lead the page; the existing booking bar stays within reach. */
.service-page header.header {
    height: 70px;
    padding: 15px 20px;
    background: var(--brand-primary, #072a46);
}
.service-page header.header .logo_normal { display: none; }
.service-page header.header .logo_sticky { display: inline-block; }
.service-page main { padding-top: 70px; }
.service-intro { padding-top: 30px; }
.service-intro__heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 22px;
}
.service-intro h1 {
    color: var(--brand-primary, #072a46);
    font-size: clamp(26px, 2.6vw, 38px);
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: -.035em;
    margin: 0 0 8px;
    overflow-wrap: anywhere;
}
.service-intro__subtitle { color: #59636b; font-size: 15px; line-height: 1.5; margin: 0; }
.service-intro .luxury-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
    padding: 9px 13px;
    border: 1px solid #eadba9;
    border-radius: 30px;
    color: #715714;
    background: #fcf7e8;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
}
.service-intro__facts {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 26px;
    padding: 20px 0;
    margin: 0;
    border-bottom: 1px solid #e5e9eb;
    list-style: none;
    color: #3d4850;
    font-size: 14px;
}
.service-intro__facts li, .service-intro__facts a { display: inline-flex; align-items: center; gap: 8px; }
.service-intro__facts a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.service-intro__facts .fa-star { color: #a87a13; }
.service-details { padding-top: 30px; padding-bottom: 35px; }
.service-page #reviews { scroll-margin-top: 90px; }
.service-gallery { --gallery-radius: 18px; }
.service-gallery__stage { position: relative; }
.service-gallery__track {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    grid-template-rows: repeat(2, minmax(0, 1fr));
    gap: 8px;
    height: clamp(330px, 34vw, 460px);
    overflow: hidden;
    border-radius: var(--gallery-radius);
    position: relative;
    background: #e9edef;
}
.service-gallery__photo { display: block; min-width: 0; min-height: 0; overflow: hidden; background: #e9edef; }
.service-gallery__photo:first-child { grid-column: span 2; grid-row: span 2; }
.service-gallery__photo:nth-child(n+6) { display: none; }
.service-gallery__photo img { width: 100%; height: 100%; object-fit: cover; transition: filter .2s ease; }
.service-gallery__photo:hover img { filter: brightness(.94); }
.service-gallery[data-count="1"] .service-gallery__track { grid-template-columns: 1fr; grid-template-rows: 1fr; }
.service-gallery[data-count="2"] .service-gallery__track { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: 1fr; }
.service-gallery[data-count="1"] .service-gallery__photo:first-child,
.service-gallery[data-count="2"] .service-gallery__photo:first-child { grid-column: auto; grid-row: auto; }
.service-gallery[data-count="3"] .service-gallery__photo:not(:first-child),
.service-gallery[data-count="4"] .service-gallery__photo:nth-child(2) { grid-column: span 2; }
.service-gallery__view {
    position: absolute;
    bottom: 18px;
    right: 18px;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    min-height: 44px;
    padding: 10px 16px;
    border: 1px solid #d8dfe2;
    border-radius: 10px;
    background: #fff;
    color: #152b38;
    font-size: 13px;
    font-weight: 600;
    box-shadow: 0 2px 10px #0002;
}
.service-gallery__view:hover, .service-gallery__view:focus { color: #152b38; background: #f5f7f8; }
.service-gallery__counter { display: none; }
.service-gallery__navigation { display: none; }
.service-gallery--empty img { display: block; width: 100%; height: 260px; object-fit: contain; background: #edf1f3; border-radius: var(--gallery-radius); }
.service-gallery :focus-visible { outline: 3px solid #fff; outline-offset: -5px; box-shadow: inset 0 0 0 7px var(--brand-primary, #072a46); }
.service-gallery__navigation button {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 1px solid #dce3e7;
    color: #193644;
    background: #fff;
    cursor: pointer;
}
.service-gallery__navigation button:disabled { opacity: .3; cursor: default; }

/* Native horizontal scrolling preserves momentum, pinch zoom and vertical page scroll. */
@media (max-width: 991.98px) {
    .service-page header.header { height: 60px; padding: 15px; }
    .service-page main { padding-top: 60px; }
    .service-intro { padding-top: 20px; }
    .service-intro__heading { align-items: flex-start; gap: 12px; margin-bottom: 18px; }
    .service-intro .luxury-pill { font-size: 9px; }
    .service-gallery .service-gallery__track {
        display: flex;
        height: clamp(250px, 64vw, 440px);
        overflow-x: auto;
        overflow-y: hidden;
        scroll-snap-type: x mandatory;
        overscroll-behavior-x: contain;
        scrollbar-width: none;
    }
    .service-gallery__track::-webkit-scrollbar, .service-lightbox__track::-webkit-scrollbar { display: none; }
    .service-gallery .service-gallery__photo { display: block; flex: 0 0 100%; scroll-snap-align: start; scroll-snap-stop: always; }
    .service-gallery__counter {
        display: block;
        position: absolute;
        bottom: 16px;
        left: 16px;
        padding: 7px 11px;
        border-radius: 30px;
        color: white;
        background: #10212bd9;
        font-size: 12px;
        font-variant-numeric: tabular-nums;
        pointer-events: none;
    }
    .service-gallery__view { bottom: 12px; right: 12px; padding: 10px 12px; font-size: 12px; }
    .service-gallery__navigation:not([hidden]) { display: flex; align-items: center; justify-content: space-between; padding-top: 10px; }
    .service-gallery__navigation > span { font-size: 12px; color: #66727a; }
    .service-gallery__navigation > div { display: flex; gap: 8px; }
    .service-intro__facts { gap: 12px 22px; padding: 16px 0 20px; font-size: 13px; }
    .service-details { padding-top: 22px; }
}
@media (max-width: 575.98px) {
    .service-intro__heading { flex-direction: column; gap: 10px; }
    .service-intro h1 { font-size: 27px; }
    .service-intro__subtitle { font-size: 13px; }
    .service-intro .luxury-pill { padding: 5px 10px; }
    .service-gallery { --gallery-radius: 14px; }
}
@media (max-height: 500px) and (max-width: 991.98px) {
    .service-gallery .service-gallery__track { height: 65vh; min-height: 220px; }
}

/* A native modal dialog sits above the fixed header, booking bar and mobile menu. */
.service-lightbox {
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100%;
    height: 100dvh;
    max-width: none;
    max-height: none;
    padding: 0;
    margin: 0;
    border: 0;
    color: #fff;
    background: #10181e;
    overflow: hidden;
    color-scheme: dark;
}
.service-lightbox[open] { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; }
.service-lightbox [hidden] { display: none !important; }
.service-lightbox::backdrop { background: #10181e; }
.service-lightbox__header {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: max(12px, env(safe-area-inset-top)) max(20px, env(safe-area-inset-right)) 12px max(20px, env(safe-area-inset-left));
}
.service-lightbox__title { margin: 0; color: #fff; font-size: 16px; font-weight: 500; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.service-lightbox__counter { font-size: 13px; color: #c6cfd5; font-variant-numeric: tabular-nums; white-space: nowrap; }
.service-lightbox button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-width: 44px;
    min-height: 44px;
    flex-shrink: 0;
    padding: 10px 14px;
    border: 1px solid #ffffff40;
    border-radius: 30px;
    background: #ffffff0d;
    color: white;
    cursor: pointer;
    font: inherit;
    font-size: 13px;
}
.service-lightbox button:hover { background: #ffffff20; }
.service-lightbox button:disabled { opacity: .25; cursor: default; }
.service-lightbox :focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.service-lightbox__track {
    display: flex;
    min-height: 0;
    position: relative;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
}
.service-lightbox__slide { display: flex; flex: 0 0 100%; min-width: 0; min-height: 0; padding: 8px 24px; align-items: center; justify-content: center; scroll-snap-align: start; scroll-snap-stop: always; }
.service-lightbox__slide img { display: block; width: 100%; height: 100%; object-fit: contain; }
.service-lightbox__footer { display: flex; align-items: center; gap: 16px; padding: 12px max(24px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(24px, env(safe-area-inset-left)); }
.service-lightbox__caption { flex: 1; min-width: 0; margin: 0; font-size: 13px; line-height: 1.5; text-align: center; color: #c6cfd5; max-height: 3em; overflow: auto; }
@media (max-width: 575.98px) {
    .service-lightbox__header { gap: 12px; padding-left: max(12px, env(safe-area-inset-left)); padding-right: max(12px, env(safe-area-inset-right)); }
    .service-lightbox__title { font-size: 14px; }
    .service-lightbox__slide { padding: 0; }
    .service-lightbox__footer { gap: 10px; padding-left: max(12px, env(safe-area-inset-left)); padding-right: max(12px, env(safe-area-inset-right)); }
    .service-lightbox__footer button span { display: none; }
    .service-lightbox__caption { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
    .service-gallery__photo img { transition: none; }
}