/*
Theme Name: Sveti Stefan Real Estate
Version: 1.0.1
Author: Aomark.io
Description: Native PHP and ACF content theme on Aomark Foundation1.1.2.
Text Domain: sveti-stefan-real-estate
*/
@import url('assets/fonts.css');
:root {
    --ss-ink: #131313;
    --ss-text: #767676;
    --ss-taupe: #937d6a;
    --ss-cream: #f9f5f1;
    --ss-rail: 1140px;
}
* { box-sizing: border-box; }
html, body { overflow-x: clip; }
body {
    margin: 0;
    color: var(--ss-text);
    background: #fff;
    font: 400 16px/1.5 'Manrope', sans-serif;
}
a { color: inherit; text-decoration: none; }
a:hover { color: var(--ss-taupe); }
img { max-width: 100%; height: auto; vertical-align: middle; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
:focus-visible { outline: 2px solid var(--ss-taupe); outline-offset: 4px; }
h1, h2, h3, h4, h5, h6 {
    margin: 0;
    color: var(--ss-ink);
    font-family: 'Playfair Display', Georgia, serif;
    font-weight: 600;
    line-height: 1.21;
}
h1 { font-size: 48px; line-height: 58px; }
h2 { font-size: 42px; line-height: 58px; }
h3 { font-size: 36px; line-height: 58px; }
h4 { font-size: 24px; }
p { margin: 0 0 20px; }
p:last-child { margin-bottom: 0; }
.ss-region {
    display: flex;
    flex-direction: column;
    gap: 20px;
    position: relative;
    min-width: 0;
    width: 100%;
    background-size: cover;
}
.ss-region > .ss-region { flex: 0 1 auto; }
.ss-region > *, .ss-inner > * { min-width: 0; }
.ss-boxed { display: flex; }
.ss-inner {
    display: flex;
    flex-direction: inherit;
    align-items: inherit;
    justify-content: inherit;
    flex-wrap: inherit;
    gap: inherit;
    min-height: 0;
    flex: 1 1 auto;
    width: 100%;
    max-width: var(--ss-rail);
    margin: 0 auto;
}
.ss-inner > .ss-region { flex-shrink: 1; }
.ss-component { width: 100%; position: relative; }
.ss-component h1, .ss-component h2, .ss-component h3,
.ss-component h4, .ss-component h5, .ss-component h6 {
    font: inherit;
    color: inherit;
}
.ss-heading { color: var(--ss-ink); font: 600 36px/58px 'Playfair Display', Georgia, serif; }
.ss-heading-intro { margin-top: 25px; color: var(--ss-text); font: 400 16px/24px 'Manrope', sans-serif; }
.ss-image img { width: 100%; }
.ss-text-editor { line-height: 1.5; }
.ss-text-editor h2, .ss-text-editor h3 { margin: 25px 0 20px; }
a.ss-button, button.ss-button {
    display: inline-block;
    padding: 0 30px 8px 0;
    border: 0;
    border-bottom: 3px solid #d9d9d9;
    border-radius: 0;
    background: transparent;
    color: #777;
    font: 400 20px/1.4 'Roboto Slab', Georgia, serif;
    text-transform: uppercase;
}
a.ss-button:hover, button.ss-button:hover { color: var(--ss-taupe); border-color: var(--ss-taupe); }
.ss-list { list-style: none; padding: 0; margin: 0; }
.ss-list li { padding: 5px 0; }
.ss-property-grid, .ss-post-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 30px; }
.ss-carousel { position: relative; overflow: hidden; }
.ss-carousel-track { display: flex; transition: transform .5s ease; }
.ss-property-slide { flex: 0 0 33.3333%; min-width: 0; }
.ss-carousel[data-visible="1"] .ss-property-slide { flex-basis: 100%; }
.ss-carousel[data-visible="2"] .ss-property-slide { flex-basis: 50%; }
.ss-slide-prev, .ss-slide-next {
    position: absolute; top: 50%; z-index: 2; transform: translateY(-50%);
    border: 0; background: transparent; color: white; font-size: 48px;
}
.ss-slide-prev { left: 10px; }
.ss-slide-next { right: 10px; }
.ss-post-grid article { position: relative; padding-bottom: 25px; }
.ss-post-grid img { width: 100%; aspect-ratio: 3/2; object-fit: cover; }
.ss-post-grid h3, .ss-post-grid h2 { font: 700 16px/1.5 'Roboto Slab', Georgia, serif; margin: 20px 0; }
.ss-post-grid p { font-size: 14px; line-height: 21px; }
.ss-read-more { position: absolute; left: 0; bottom: 0; color: var(--ss-taupe); }
.ss-recent-posts article { padding: 10px 0; border-bottom: 1px solid #eee; }
.ss-recent-posts h3 { font: 600 16px/1.4 'Roboto Slab', serif; }
.ss-recent-posts img, .ss-recent-posts p, .ss-recent-posts .ss-read-more { display: none; }
.ss-funfact { color: var(--ss-taupe); }
.ss-ekit_funfact_number, .ss-ekit_funfact_number_suffix { font: 700 48px/1.2 'Roboto Slab', serif; }
.ss-ekit_funfact_title_text { display: block; font: 600 20px/1.4 'Playfair Display', serif; margin-top: 15px; }
.ss-icon-box h3 { margin-bottom: 20px; font: 600 24px/1.3 'Playfair Display', serif; }
.ss-icon-box .ss-button { margin-top: 20px; }
.ss-google_maps iframe { width: 100%; height: 450px; border: 0; }
.ss-native-page { max-width: var(--ss-rail); margin: 0 auto; padding: 80px 0; }
.ss-native-page > h1 { text-align: center; margin-bottom: 60px; }
.ss-share { display: flex; gap: 10px; justify-content: flex-end; font-size: 13px; }
.ss-skip-link { position: absolute; left: -9999px; }
.ss-skip-link:focus { left: 20px; top: 20px; z-index: 1000; background: white; padding: 10px; }
.ss-inquiry { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; }
.ss-inquiry label { color: #777; font: 400 20px/1.5 'Roboto Slab', serif; }
.ss-inquiry input, .ss-inquiry textarea {
    width: 100%; background: transparent; border: 0; border-bottom: 3px solid #d9d9d9;
    padding: 15px 0 8px 15px; color: #777; outline-offset: 3px;
}
.ss-message { grid-column: 1/-1; }
.ss-inquiry textarea { min-height: 90px; resize: vertical; }
.ss-inquiry button { justify-self: start; }
.ss-menu-panel {
    position: fixed; margin: 0 0 0 auto; width: min(100%,440px); height: 100dvh;
    max-height: 100dvh; border: 0; padding: 40px 30px; background: #fff; color: #131313;
}
.ss-menu-panel::backdrop, .ss-lightbox::backdrop { background: rgb(0 0 0 / 55%); }
.ss-menu-close { position: absolute; right: 24px; top: 15px; border: 0; background: transparent; font-size: 32px; }
.ss-menu-logo { width: 90px; margin-bottom: 30px; }
.ss-panel-nav { list-style: none; padding: 0; font: 400 20px/1.6 'Roboto Slab', serif; }
.ss-panel-nav li { padding: 9px 0; }
.ss-panel-nav ul { list-style: none; padding-left: 20px; font-size: 16px; }
.ss-lightbox { padding: 40px; border: 0; background: #131313; color: #fff; max-width: 96vw; max-height: 96vh; }
.ss-lightbox img { max-height: 80vh; width: auto; object-fit: contain; }
.ss-lightbox button { position: absolute; border: 0; background: transparent; color: #fff; font-size: 35px; }
.ss-lightbox-close { right: 10px; top: 0; }
.ss-lightbox-prev { left: 4px; top: 45%; }
.ss-lightbox-next { right: 4px; top: 45%; }
@media (max-width: 1024px) {
    .ss-post-grid, .ss-property-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .ss-native-page { padding: 60px 30px; }
}
@media (max-width: 767px) {
    .ss-region > .ss-region { flex-basis: auto; }
    .ss-post-grid, .ss-property-grid { grid-template-columns: 1fr; }
    .ss-property-slide { flex-basis: 100% !important; }
    .ss-inquiry { grid-template-columns: 1fr; }
    .ss-native-page { padding: 50px 10px; }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}