/* Faza 4: Jost (tekst) i EB Garamond (naslovi; od 2026-10-21 umjesto Cormorant Garamonda, cije su kvacice na
   s/c/z bile visoke i tanke) - varijabilni fontovi sa Google Fonts, latinica + latinica-ext (crnogorska i
   turska slova). Ranije: Barlow, Sen, Rubik. */
@font-face {
  font-family: "Jost";
  src: url("../fonts/Jost-latin-ext.woff2") format("woff2");
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Jost";
  src: url("../fonts/Jost-latin.woff2") format("woff2");
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "EB Garamond";
  src: url("../fonts/EBGaramond-latin-ext.woff2") format("woff2");
  font-weight: 400 800;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "EB Garamond";
  src: url("../fonts/EBGaramond-latin.woff2") format("woff2");
  font-weight: 400 800;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

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

html {
  font-size: 62.5%;
  overflow-x: hidden;
  box-sizing: border-box;
  scroll-behavior: smooth;
}

body {
  font-family: "Jost", sans-serif;
  overflow-x: hidden;
  margin: 0;
  box-sizing: border-box;
  font-size: 16px;
  padding: 0;
  position: relative;
}

.page-width {
  max-width: 1400px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (max-width: 1600px) {
  .page-width {
    max-width: 80%;
  }
}
@media only screen and (max-width: 900px) {
  .page-width {
    max-width: 90%;
  }
}

.page-padding {
  padding: 70px 0;
}
@media screen and (max-width: 575px) {
  .page-padding {
    padding: 50px 0;
  }
}

.page-grid {
  display: grid;
  gap: 50px;
}

.overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #000;
  opacity: 0.2;
}

a {
  text-decoration: none;
}

button {
  cursor: pointer;
}

.no-scroll {
  overflow: hidden;
}

.image {
  width: 100%;
  height: 0;
  position: relative;
  display: block;
  padding-top: 100%;
}

.image img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
}

.image2 img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
}

h1, h2 {
  font-size: 60px;
  font-weight: 400;
  color: #000;
  text-align: center;
  letter-spacing: normal;
  position: relative;
}
@media screen and (max-width: 1600px) {
  h1, h2 {
    font-size: 50px;
  }
}
@media screen and (max-width: 1399px) {
  h1, h2 {
    font-size: 40px;
  }
}
@media screen and (max-width: 575px) {
  h1, h2 {
    font-size: 30px;
  }
}

.small-heading h1, .small-heading h2 {
  font-size: 40px;
}
@media screen and (max-width: 1600px) {
  .small-heading h1, .small-heading h2 {
    font-size: 35px;
  }
}
@media screen and (max-width: 1399px) {
  .small-heading h1, .small-heading h2 {
    font-size: 30px;
  }
}
@media screen and (max-width: 575px) {
  .small-heading h1, .small-heading h2 {
    font-size: 25px;
  }
}

.small-heading2 h1, .small-heading2 h2 {
  font-size: 30px;
}
@media screen and (max-width: 1600px) {
  .small-heading2 h1, .small-heading2 h2 {
    font-size: 28px;
  }
}
@media screen and (max-width: 1399px) {
  .small-heading2 h1, .small-heading2 h2 {
    font-size: 26px;
  }
}
@media screen and (max-width: 575px) {
  .small-heading2 h1, .small-heading2 h2 {
    font-size: 24px;
  }
}

.bold-heading h1, .bold-heading h2 {
  font-weight: bold;
}

.underline h1, .underline h2, .dark-container-text h1 {
  padding-bottom: 10px;
}
.underline h1::after, .underline h2::after, .dark-container-text h1::after {
  position: absolute;
  content: "";
  width: 75px;
  height: 2px;
  background-color: #A28E6A;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}

.l-underline h1, .l-underline h2, .dark-container-text h1 {
  text-align: left;
}
.l-underline h1::after, .l-underline h2::after, .dark-container-text h1::after {
  left: 0;
  transform: none;
}

.supertitle span {
  display: block;
  text-align: center;
  font-family: "Jost", sans-serif;
  font-size: 24px;
  font-weight: 400;
  color: #A28E6A;
}
@media screen and (max-width: 1600px) {
  .supertitle span {
    font-size: 22px;
  }
}
@media screen and (max-width: 1399px) {
  .supertitle span {
    font-size: 20px;
  }
}
@media screen and (max-width: 575px) {
  .supertitle span {
    font-size: 18px;
  }
}

p, .post-info li, .grey-slide ul li, .text li {
  font-size: 22px;
  line-height: 32px;
  font-weight: 400;
  font-family: "Jost", sans-serif;
  color: #000;
}
@media screen and (max-width: 1600px) {
  p, .post-info li, .grey-slide ul li, .text li {
    font-size: 20px;
    line-height: 30px;
  }
}
@media screen and (max-width: 1399px) {
  p, .post-info li, .grey-slide ul li, .text li {
    font-size: 18px;
    line-height: 28px;
  }
}
@media screen and (max-width: 575px) {
  p, .post-info li, .grey-slide ul li, .text li {
    font-size: 16px;
    line-height: 26px;
  }
}

.center-p p {
  text-align: center;
}

.space-p p {
  letter-spacing: normal;
}

.dark-bg {
  background-color: #222222;
}
.dark-bg h1, .dark-bg h2 {
  color: #fff;
}

.light-bg {
  background-color: #F8F5F0;
}

.grey-bg {
  background-color: rgba(19, 21, 24, 0.11);
}

.top-wrap {
  display: flex;
  align-items: end;
  justify-content: space-between;
}

@media screen and (max-width: 991px) {
  .top-wrap.tabs {
    flex-direction: column;
    align-items: start;
  }
}

.page-cover {
  height: 400px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.page-cover .overlay {
  opacity: 0.6;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 35%, rgba(0, 0, 0, 0.5) 52%, rgba(0, 0, 0, 0.5) 100%);
}
@media screen and (max-width: 1600px) {
  .page-cover {
    height: 350px;
  }
}
@media screen and (max-width: 1399px) {
  .page-cover {
    height: 300px;
  }
}
@media screen and (max-width: 991px) {
  .page-cover {
    height: 250px;
  }
}
@media screen and (max-width: 767px) {
  .page-cover {
    height: 200px;
  }
}
@media screen and (max-width: 575px) {
  .page-cover {
    height: 130px;
  }
}

.page-cover.darker .overlay {
  background-color: #000;
  opacity: 0.5;
}

.page-cover-heading {
  position: relative;
  z-index: 1;
}
.page-cover-heading h1 {
  color: #fff;
}

.red-btn {
  font-family: "Jost", sans-serif;
  font-weight: 400;
  font-size: 20px;
  border: none;
  color: #fff;
  background-color: #0C2956;
  border-radius: 15px;
  text-align: center;
  padding: 15px 50px;
  display: inline-block;
}
@media screen and (max-width: 575px) {
  .red-btn {
    font-size: 18px;
    width: 100%;
  }
}

.more {
  font-family: "Jost", sans-serif;
  font-size: 24px;
  font-weight: bold;
  color: #000;
  text-align: center;
  letter-spacing: normal;
  display: flex;
  align-items: center;
  justify-content: center;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}
.more::after {
  content: url("../images/ikone/vise.svg");
  transform: translateY(5px);
  margin-left: 5px;
}

.text ul, .text ol {
  list-style-position: inside;
}
.text p {
  margin: 20px 0;
}
.text p:first-child {
  margin-top: 0;
}

.template {
  margin-top: 50px;
}
.template .download, .template .redirect {
  font-weight: 600;
  background-color: #0C2956;
  box-shadow: 10px 4px 24px rgba(0, 0, 0, 0.25);
  padding: 10px 30px;
  padding-right: 60px;
  position: relative;
}
.template .download::after, .template .redirect::after {
  position: absolute;
  content: "";
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  width: 30px;
  height: 25px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
@media screen and (max-width: 575px) {
  .template .download, .template .redirect {
    width: -moz-fit-content;
    width: fit-content;
  }
}
.template .download::after {
  background-image: url("../images/ikone/dokument.svg");
}
.template .redirect::after {
  background-image: url("../images/ikone/spoljni-link.svg");
}

.template-images {
  margin-top: 50px;
  width: 100%;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-auto-rows: 250px;
  gap: 25px;
}
.template-images a img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
  border-radius: 12px;
}
@media screen and (max-width: 1399px) {
  .template-images {
    grid-auto-rows: 200px;
    gap: 20px;
  }
}
@media screen and (max-width: 1199px) {
  .template-images {
    grid-auto-rows: 170px;
    gap: 10px;
  }
}
@media screen and (max-width: 767px) {
  .template-images {
    grid-template-columns: 1fr 1fr;
    grid-auto-rows: 200px;
  }
}
@media screen and (max-width: 575px) {
  .template-images {
    gap: 5px;
    grid-auto-rows: 150px;
  }
}

header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 140px;
  z-index: 99;
  transition: all 0.5s;
}
header .page-width {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  z-index: 2;
}
@media screen and (max-width: 1600px) {
  header {
    height: 120px;
  }
}
@media screen and (max-width: 1399px) {
  header {
    height: 100px;
  }
}
@media screen and (max-width: 1199px) {
  header {
    height: 80px;
    background-color: #fff;
  }
}
@media screen and (max-width: 575px) {
  header {
    height: 60px;
  }
}

.mt {
  margin-top: 140px;
}
@media screen and (max-width: 1600px) {
  .mt {
    margin-top: 120px;
  }
}
@media screen and (max-width: 1399px) {
  .mt {
    margin-top: 100px;
  }
}
@media screen and (max-width: 1199px) {
  .mt {
    margin-top: 80px;
  }
}
@media screen and (max-width: 575px) {
  .mt {
    margin-top: 60px;
  }
}

@media screen and (max-width: 1199px) {
  .mt2 {
    margin-top: 80px;
  }
}
@media screen and (max-width: 575px) {
  .mt2 {
    margin-top: 60px;
  }
}

.home-header .white-overlay {
  position: absolute;
  top: -40px;
  left: -40px;
  right: -40px;
  height: calc(100% + 40px);
  background: linear-gradient(180deg, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0.84) 24%, rgba(255, 255, 255, 0.6) 61%, rgba(255, 255, 255, 0.5) 78%, rgba(255, 255, 255, 0.3) 100%);
  filter: blur(20px);
}
@media screen and (max-width: 1199px) {
  .home-header .white-overlay {
    display: none;
  }
}

.header-logo {
  display: block;
  width: 400px;
  height: 90%;
  position: relative;
}
.header-logo img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: left;
     object-position: left;
  position: absolute;
  transition: all 0.5s;
}
@media screen and (max-width: 1600px) {
  .header-logo {
    width: 350px;
  }
}
@media screen and (max-width: 1399px) {
  .header-logo {
    width: 300px;
  }
}
@media screen and (max-width: 1199px) {
  .header-logo {
    width: 250px;
  }
  .header-logo img {
    -o-object-position: right;
       object-position: right;
  }
}
@media screen and (max-width: 575px) {
  .header-logo {
    width: 200px;
  }
}

.head {
  display: flex;
  flex-direction: column;
  align-items: end;
  height: 100%;
  justify-content: space-evenly;
}
.head .header-social, .head .nav {
  display: flex;
  align-items: center;
  list-style: none;
}
.head .nav li {
  margin-left: 30px;
}
.head .nav li a {
  font-family: "Jost", sans-serif;
  font-weight: 400;
  font-size: 22px;
  color: #000;
  position: relative;
}
.head .nav li a::after {
  position: absolute;
  content: "";
  width: 0%;
  height: 2px;
  background-color: #A28E6A;
  left: 0;
  bottom: -10px;
  transition: all 0.5s;
}
.head .nav li .active::after, .head .nav li a:hover::after {
  width: 100%;
}
.head .header-social > a, .head .header-social details {
  margin-left: 25px;
}
.head .header-social > a:nth-child(4), .head .header-social > a:nth-child(5) {
  position: relative;
}
.head .header-social > a:nth-child(4)::before, .head .header-social > a:nth-child(5)::before {
  position: absolute;
  content: "";
  width: 1px;
  height: 30px;
  background-color: #000;
  top: 50%;
  transform: translateY(-50%);
}
.head .header-social > a:nth-child(4) {
  margin-left: 50px;
}
.head .header-social > a:nth-child(4)::before {
  left: -25px;
}
.head .header-social > a:nth-child(5) {
  margin-right: 25px;
}
.head .header-social > a:nth-child(5)::before {
  right: -25px;
}
.head .header-social details {
  cursor: pointer;
  position: relative;
}
.head .header-social details summary, .head .header-social details ul {
  list-style: none;
}
.head .header-social details ul {
  position: absolute;
  top: 150%;
  left: 50%;
  transform: translateX(-50%);
  background-color: #fff;
  box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
  padding: 10px;
  z-index: 2;
}
.head .header-social details ul li {
  text-align: center;
}
.head .header-social details ul li a {
  color: #000;
}
.head .header-social details ul li + li {
  margin-top: 10px;
}
@media screen and (max-width: 1600px) {
  .head .nav li a {
    font-size: 20px;
  }
  .head .header-social svg {
    scale: 0.9;
  }
}
@media screen and (max-width: 1399px) {
  .head .nav li a {
    font-size: 18px;
  }
  .head .header-social svg {
    scale: 0.8;
  }
  .head .header-social > a, .head .header-social details {
    margin-left: 15px;
  }
  .head .header-social > a:nth-child(4) {
    margin-left: 30px;
  }
  .head .header-social > a:nth-child(4)::before {
    left: -15px;
  }
  .head .header-social > a:nth-child(5) {
    margin-right: 15px;
  }
  .head .header-social > a:nth-child(5)::before {
    right: -15px;
  }
}
@media screen and (max-width: 1199px) {
  .head {
    position: fixed;
    top: 80px;
    left: 0;
    bottom: 0;
    width: 100%;
    max-width: 500px;
    background-color: #fff;
    align-items: start;
    justify-content: space-between;
    overflow-y: scroll;
    transform: translateX(-100%);
    opacity: 0;
    transition: all 0.5s;
  }
  .head .nav, .head .header-social {
    align-items: start;
    justify-content: start;
  }
  .head .nav {
    order: 1;
    flex-direction: column;
    width: 100%;
  }
  .head .nav li {
    margin-left: 0;
    width: 100%;
  }
  .head .nav li a {
    font-family: "Jost", sans-serif;
    display: block;
    width: 100%;
    padding: 10px 20px;
    font-size: 24px;
    font-weight: 500;
  }
  .head .nav li .active {
    color: #fff;
    background-color: #0C2956;
  }
  .head .nav li .active::after {
    display: none;
  }
  .head .header-social {
    order: 2;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 40px;
    justify-items: center;
    margin: 100px auto;
    margin-left: 20px;
  }
  .head .header-social svg {
    scale: 1;
  }
  .head .header-social .languages {
    display: none;
  }
  .head .header-social a {
    margin: 0;
    padding: 10px !important;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #000;
    border-radius: 8px;
    background-color: #fff;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
  }
  .head .header-social a::before {
    display: none;
  }
  .head .header-social > a:nth-child(4), .head .header-social > a:nth-child(5) {
    margin: 0;
  }
}
@media screen and (max-width: 575px) {
  .head {
    top: 60px;
  }
  .head .nav li a {
    font-size: 20px;
  }
  .head .header-social {
    gap: 20px;
  }
}

.show-header {
  transform: translateX(0%);
  opacity: 1;
}

@media screen and (min-width: 1200px) {
  .small-header {
    height: 90px;
    background-color: #fff;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
  }
  .small-header .header-logo img {
    width: 300px;
  }
  .small-header .head .nav li a::after {
    bottom: -5px;
  }
  .small-header .white-overlay {
    opacity: 0;
  }
}

.languages-mobile {
  grid-column: span 3;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 40px;
  width: 100%;
}
@media screen and (min-width: 1200px) {
  .languages-mobile {
    display: none;
  }
}
.languages-mobile a {
  color: #000;
}
.languages-mobile .active {
  color: #A28E6A;
}
@media screen and (max-width: 575px) {
  .languages-mobile {
    gap: 20px;
  }
}

@media screen and (min-width: 1200px) {
  .white-header .header-logo .white-logo {
    opacity: 1;
  }
  .white-header .header-logo .black-logo {
    opacity: 0;
  }
  .white-header .head .nav li a {
    color: #fff;
  }
  .white-header .head .header-social svg path {
    fill: #fff;
  }
  .white-header .head .header-social details summary {
    color: #fff;
  }
  .white-header .head .header-social > a:nth-child(4)::before, .white-header .head .header-social > a:nth-child(5)::before {
    background-color: #fff;
  }
}

@media screen and (min-width: 1200px) {
  .black-header .header-logo .white-logo, .small-header .header-logo .white-logo {
    opacity: 0;
  }
  .black-header .header-logo .black-logo, .small-header .header-logo .black-logo {
    opacity: 1;
  }
  .black-header .head .nav li a, .small-header .head .nav li a {
    color: #000;
  }
  .black-header .head .header-social svg path, .small-header .head .header-social svg path {
    fill: #000;
  }
  .black-header .head .header-social details summary, .small-header .head .header-social details summary {
    color: #000;
  }
  .black-header .head .header-social > a:nth-child(4)::before, .black-header .head .header-social > a:nth-child(5)::before, .small-header .head .header-social > a:nth-child(4)::before, .small-header .head .header-social > a:nth-child(5)::before {
    background-color: #000;
  }
}

@media screen and (max-width: 1199px) {
  .black-header .header-logo .white-logo, .white-header .header-logo .white-logo, .small-header .header-logo .white-logo {
    opacity: 0;
  }
  .black-header .header-logo .black-logo, .white-header .header-logo .black-logo, .small-header .header-logo .black-logo {
    opacity: 1;
  }
}

.hamburger {
  padding: 15px 15px;
  padding-left: 0;
  display: inline-block;
  cursor: pointer;
  transition-property: opacity, filter;
  transition-duration: 0.15s;
  transition-timing-function: linear;
  font: inherit;
  color: inherit;
  text-transform: none;
  background-color: transparent;
  border: 0;
  margin: 0;
  overflow: visible;
}
@media screen and (min-width: 1200px) {
  .hamburger {
    display: none;
  }
}

.hamburger:hover {
  opacity: 0.7;
}

.hamburger.is-active:hover {
  opacity: 0.7;
}

.hamburger.is-active .hamburger-inner,
.hamburger.is-active .hamburger-inner::before,
.hamburger.is-active .hamburger-inner::after {
  background-color: #000;
}

.hamburger-box {
  width: 40px;
  height: 24px;
  display: inline-block;
  position: relative;
}

.hamburger-inner {
  display: block;
  top: 50%;
  margin-top: -2px;
}

.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
  width: 40px;
  height: 4px;
  background-color: #000;
  border-radius: 4px;
  position: absolute;
  transition-property: transform;
  transition-duration: 0.15s;
  transition-timing-function: ease;
}

.hamburger-inner::before, .hamburger-inner::after {
  content: "";
  display: block;
}

.hamburger-inner::before {
  top: -10px;
}

.hamburger-inner::after {
  bottom: -10px;
}

/*
* Elastic
*/
.hamburger--elastic .hamburger-inner {
  top: 2px;
  transition-duration: 0.275s;
  transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.hamburger--elastic .hamburger-inner::before {
  top: 10px;
  transition: opacity 0.125s 0.275s ease;
}

.hamburger--elastic .hamburger-inner::after {
  top: 20px;
  transition: transform 0.275s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.hamburger--elastic.is-active .hamburger-inner {
  transform: translate3d(0, 10px, 0) rotate(135deg);
  transition-delay: 0.075s;
}

.hamburger--elastic.is-active .hamburger-inner::before {
  transition-delay: 0s;
  opacity: 0;
}

.hamburger--elastic.is-active .hamburger-inner::after {
  transform: translate3d(0, -20px, 0) rotate(-270deg);
  transition-delay: 0.075s;
}

/*
   * Elastic Reverse
   */
.hamburger--elastic-r .hamburger-inner {
  top: 2px;
  transition-duration: 0.275s;
  transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.hamburger--elastic-r .hamburger-inner::before {
  top: 10px;
  transition: opacity 0.125s 0.275s ease;
}

.hamburger--elastic-r .hamburger-inner::after {
  top: 20px;
  transition: transform 0.275s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.hamburger--elastic-r.is-active .hamburger-inner {
  transform: translate3d(0, 10px, 0) rotate(-135deg);
  transition-delay: 0.075s;
}

.hamburger--elastic-r.is-active .hamburger-inner::before {
  transition-delay: 0s;
  opacity: 0;
}

.hamburger--elastic-r.is-active .hamburger-inner::after {
  transform: translate3d(0, -20px, 0) rotate(270deg);
  transition-delay: 0.075s;
}

footer {
  background-color: #131518;
  padding: 40px 0 20px;
}
footer * {
  color: #fff;
}
footer ul {
  list-style: none;
  display: flex;
  align-items: center;
}
footer .footer-nav {
  justify-content: center;
}
footer .footer-nav li a {
  font-weight: 400;
  font-size: 40px;
  letter-spacing: normal;
  transition: all 0.5s;
}
footer .footer-nav li a:hover {
  color: #A28E6A;
}
footer .footer-nav li + li {
  margin-left: 30px;
}
footer .footer-text p {
  font-weight: 600;
  letter-spacing: normal;
  font-size: 60px;
  line-height: 70px;
  font-family: "Jost", sans-serif;
  text-align: center;
  max-width: 730px;
  margin: 50px auto;
}
footer .copyright, footer .copyright ul {
  display: flex;
  align-items: center;
  justify-content: center;
}
footer .copyright p, footer .copyright a {
  font-size: 20px;
  font-weight: 400;
  font-family: "Jost", sans-serif;
  text-align: center;
  transition: all 0.5s;
}
footer .copyright a:hover {
  color: #A28E6A;
}
footer .copyright ul li {
  position: relative;
  margin-left: 15px;
  padding-left: 15px;
  border-left: 2px solid #fff;
  height: 16px;
  display: flex;
  align-items: center;
}

.social {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 50px 0;
}
.social a + a {
  margin-left: 70px;
}
.social svg path {
  fill: #fff;
  transition: all 0.5s;
}
.social a:hover svg path {
  fill: #A28E6A;
}

@media screen and (max-width: 1600px) {
  footer .footer-nav li a {
    font-size: 30px;
  }
  footer .footer-text p {
    font-size: 50px;
    line-height: 60px;
    max-width: 680px;
  }
  footer .copyright p, footer .copyright a {
    font-size: 18px;
  }
  .social svg {
    transform: scale(0.8);
  }
  .social a + a {
    margin-left: 50px;
  }
}
@media screen and (max-width: 1399px) {
  footer .footer-nav li a {
    font-size: 25px;
  }
  footer .footer-text p {
    font-size: 40px;
    line-height: 50px;
    max-width: 560px;
  }
  footer .copyright p, footer .copyright a {
    font-size: 16px;
  }
  .social {
    margin: 30px 0;
  }
  .social svg {
    transform: scale(0.6);
  }
  .social a + a {
    margin-left: 30px;
  }
}
@media screen and (max-width: 767px) {
  footer .footer-nav {
    flex-direction: column;
  }
  footer .footer-nav li + li {
    margin-left: 0;
    margin-top: 20px;
  }
}
@media screen and (max-width: 575px) {
  footer .footer-nav li a {
    font-size: 22px;
  }
  footer .footer-text p {
    font-size: 30px;
    line-height: 35px;
    max-width: 400px;
  }
  footer .copyright {
    flex-direction: column-reverse;
  }
  footer .copyright ul {
    margin-bottom: 10px;
  }
  footer .copyright ul li:first-child {
    margin-left: 0;
    padding-left: 0;
    border-left: none;
  }
  .social svg {
    transform: scale(0.5);
  }
  .social a + a {
    margin-left: 20px;
  }
}
@media screen and (max-width: 400px) {
  .social a + a {
    margin-left: 10px;
  }
}
.home-background {
  position: relative;
  height: 100vh;
  background-position: top;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
}
.home-background .overlay {
  background: linear-gradient(180deg, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0.84) 30%, rgba(0, 0, 0, 0) 100%);
  z-index: 1;
}
.home-background .page-width {
  position: relative;
  z-index: 2;
}
.home-background .background-video {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
}
@media screen and (max-width: 1399px) {
  .home-background {
    height: -moz-fit-content;
    height: fit-content;
    padding-bottom: 100px;
  }
}

.headline {
  padding-top: 40vh;
}
.headline h1, .headline p {
  text-align: center;
  color: #fff;
}
.headline h1::after {
  background-color: #fff;
  width: 100px;
}
.headline h1 {
  font-size: 45px;
  padding-bottom: 25px;
  margin-bottom: 25px;
}
.headline p {
  font-size: 18px;
}
@media screen and (max-width: 767px) {
  .headline {
    padding-top: 30vh;
  }
}
@media screen and (max-width: 575px) {
  .headline {
    padding-top: 200px;
  }
  .headline h1 {
    font-size: 35px;
  }
  .headline p {
    font-size: 16px;
  }
}

.tab-btns {
  display: flex;
  align-items: center;
}
.tab-btns div {
  font-family: "Jost", sans-serif;
  font-size: 20px;
  font-weight: 400;
  letter-spacing: normal;
  color: #fff;
  padding: 8px 35px;
  border: 2px solid transparent;
  border-radius: 25px;
  transition: all 0.5s;
  cursor: pointer;
}
.tab-btns div a {
  color: #fff;
  transition: all 0.5s;
}
.tab-btns .active {
  color: #A28E6A;
  border: 2px solid #A28E6A;
}
.tab-btns div:hover {
  color: #A28E6A;
}
.tab-btns div a:hover {
  color: #A28E6A;
}
.tab-btns div:last-child {
  margin-right: -35px;
}
@media screen and (max-width: 1600px) {
  .tab-btns div {
    padding: 8px 30px;
  }
  .tab-btns div:last-child {
    margin-right: -30px;
  }
}
@media screen and (max-width: 1399px) {
  .tab-btns div {
    padding: 8px 25px;
    font-size: 18px;
  }
  .tab-btns div:last-child {
    margin-right: -25px;
  }
}
@media screen and (max-width: 991px) {
  .tab-btns {
    margin-top: 30px;
    width: 100%;
    justify-content: center;
    flex-wrap: wrap;
  }
  .tab-btns div:last-child {
    margin-right: 0;
  }
}
@media screen and (max-width: 575px) {
  .tab-btns div {
    padding: 5px 25px;
    font-size: 16px;
  }
}

.home-papers {
  display: flex;
  align-items: start;
  justify-content: space-evenly;
  padding: 50px 0;
}
.home-papers .add {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  padding-top: 160px;
}
.home-papers .add::before {
  position: absolute;
  content: "";
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 150px;
  height: 150px;
  border-radius: 50%;
  background-color: #A28E6A;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 55%;
}
.home-papers .add span, .home-papers .add p {
  text-align: center;
  color: #fff;
  font-weight: 400;
}
.home-papers .add span {
  font-size: 32px;
  margin: 20px 0;
}
.home-papers .add p {
  font-size: 18px;
  line-height: 18px;
  max-width: 230px;
}
.home-papers .add + .add {
  margin-left: 10px;
}
.home-papers .papiri::before {
  background-image: url("../images/ikone/prednost-dokumentacija.svg");
}
.home-papers .porudzbina::before {
  background-image: url("../images/ikone/prednost-pretraga.svg");
}
.home-papers .paket::before {
  background-image: url("../images/ikone/prednost-sve.svg");
}
@media screen and (max-width: 1600px) {
  .home-papers {
    padding: 0;
  }
  .home-papers .add {
    padding-top: 140px;
  }
  .home-papers .add::before {
    width: 130px;
    height: 130px;
  }
  .home-papers .add span {
    font-size: 28px;
  }
  .home-papers .add p {
    font-size: 16px;
    line-height: 16px;
  }
}
@media screen and (max-width: 1399px) {
  .home-papers .add {
    padding-top: 120px;
  }
  .home-papers .add::before {
    width: 110px;
    height: 110px;
  }
  .home-papers .add span {
    font-size: 26px;
  }
}
@media screen and (max-width: 767px) {
  .home-papers {
    flex-direction: column;
  }
  .home-papers .add + .add {
    margin-top: 25px;
    margin-left: auto;
  }
  .home-papers .add {
    margin-left: auto;
    margin-right: auto;
  }
}

.home-papers.about-papers .add::before {
  background-color: transparent;
  background-size: 75%;
  border-radius: 0;
}
.home-papers.about-papers .add span, .home-papers.about-papers .add p {
  color: #000;
}
.home-papers.about-papers .papiri::before {
  background-image: url("../images/ikone/prednost-dokumentacija-zlatna.svg");
}
.home-papers.about-papers .porudzbina::before {
  background-image: url("../images/ikone/prednost-pretraga-zlatna.svg");
}
.home-papers.about-papers .paket::before {
  background-image: url("../images/ikone/prednost-sve-zlatna.svg");
}
@media screen and (max-width: 1600px) {
  .home-papers.about-papers {
    margin-top: 50px;
  }
}

.reviews {
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 60px;
}
@media screen and (max-width: 1600px) {
  .reviews {
    margin-top: 50px;
  }
}
@media screen and (max-width: 575px) {
  .reviews {
    margin-top: 30px;
  }
}

.reviewSwiper {
  padding-bottom: 70px;
}
.reviewSwiper .swiper-slide {
  background-color: #F8F5F0;
}
.reviewSwiper .swiper-slide .review-text {
  position: relative;
  padding-top: 100px;
}
.reviewSwiper .swiper-slide .review-text::before {
  position: absolute;
  content: "";
  width: 60px;
  height: 50px;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  background-image: url("../images/ikone/navodnici.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
@media screen and (max-width: 1600px) {
  .reviewSwiper .swiper-slide .review-text {
    padding-top: 75px;
  }
  .reviewSwiper .swiper-slide .review-text::before {
    width: 45px;
  }
}
@media screen and (max-width: 1600px) {
  .reviewSwiper .swiper-slide .review-text {
    padding-top: 60px;
  }
  .reviewSwiper .swiper-slide .review-text::before {
    width: 30px;
  }
}
.reviewSwiper .swiper-slide p, .reviewSwiper .swiper-slide span {
  display: block;
  text-align: center;
}
.reviewSwiper .swiper-slide > p {
  font-weight: 400;
  color: #A28E6A;
}
.reviewSwiper .swiper-slide > span {
  font-size: 42px;
  margin-top: 50px;
}
@media screen and (max-width: 1600px) {
  .reviewSwiper .swiper-slide > span {
    font-size: 35px;
  }
}
@media screen and (max-width: 1399px) {
  .reviewSwiper .swiper-slide > span {
    font-size: 30px;
  }
}
.reviewSwiper .swiper-pagination .swiper-pagination-bullet {
  width: 10px;
  height: 10px;
  background-color: #fff;
  margin: 10px;
  opacity: 1;
  box-shadow: 0px -1px 8px 5px rgba(162, 142, 106, 0.61);
  -webkit-box-shadow: 0px -1px 8px 5px rgba(162, 142, 106, 0.61);
  -moz-box-shadow: 0px -1px 8px 5px rgba(162, 142, 106, 0.61);
}
.reviewSwiper .swiper-pagination .swiper-pagination-bullet-active {
  background-color: #A28E6A;
}

.home-about {
  position: relative;
}
.home-about .bg2 {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: -1;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
  filter: blur(3px);
}
.home-about * {
  color: #fff;
}
.home-about .home-about-text {
  /* faza 4: 0.3 -> 0.5 – nova pozadina bg2 ima svijetlo nebo, bijeli tekst se slabo čitao (mobilni) */
  background-color: rgba(0, 0, 0, 0.5);
  padding: 200px 0;
}
.home-about .home-about-text .supertitle span {
  color: #fff;
}
.home-about .home-about-text p {
  max-width: 700px;
  /* margin: 30px auto; */
  margin: 5px auto;
  text-align: center;
}
.home-about .numbers {
  background-color: rgba(19, 21, 24, 0.9);
  padding: 100px 0;
}
.home-about .numbers .page-width {
  display: flex;
  align-items: start;
  justify-content: space-between;
}
.home-about .numbers .num {
  max-width: 310px;
}
.home-about .numbers span {
  font-size: 40px;
  font-weight: bold;
  position: relative;
  letter-spacing: normal;
}
.home-about .numbers span::after {
  position: absolute;
  content: "";
  width: 75px;
  height: 1px;
  background-color: #A28E6A;
  top: 50%;
  left: calc(100% + 5px);
}
.home-about .numbers p {
  font-size: 16px;
  line-height: 20px;
  font-family: "Jost", sans-serif;
}
.home-about .numbers h3 {
  color: #A28E6A;
  font-size: 24px;
  font-weight: 400;
  letter-spacing: normal;
  margin: 10px 0 15px;
}
@media screen and (max-width: 1600px) {
  .home-about .home-about-text {
    padding: 100px 0;
  }
  .home-about .numbers span {
    font-size: 35px;
  }
  .home-about .numbers h3 {
    font-size: 22px;
  }
}
@media screen and (max-width: 1399px) {
  .home-about .numbers .num {
    max-width: 200px;
  }
  .home-about .numbers span {
    font-size: 30px;
  }
  .home-about .numbers span::after {
    width: 50px;
  }
  .home-about .numbers h3 {
    font-size: 20px;
  }
}
@media screen and (max-width: 991px) {
  .home-about .numbers .page-width {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 50px;
  }
}
@media screen and (max-width: 575px) {
  .home-about .numbers {
    padding: 50px 0;
  }
  .home-about .numbers .page-width {
    grid-template-columns: 1fr;
    justify-items: center;
  }
  .home-about .numbers span {
    display: block;
  }
  .home-about .numbers span::after {
    display: none;
  }
  .home-about .numbers h3, .home-about .numbers p, .home-about .numbers span {
    text-align: center;
  }
}

.popular-locations {
  margin-top: 100px;
}
@media screen and (max-width: 575px) {
  .popular-locations {
    margin-top: 80px;
  }
}

.locations-grid {
  margin-top: 50px;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-auto-rows: 300px;
  gap: 15px;
}
.locations-grid .location {
  position: relative;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  display: flex;
  align-items: center;
  justify-content: center;
}
.locations-grid .location .title-and-specifics, .locations-grid .location h3 {
  position: absolute;
  z-index: 1;
  color: #fff;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  transition: all 0.5s;
}
.locations-grid .location .title-and-specifics {
  opacity: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.locations-grid .location .location-specifics {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  height: 250px;
  width: 250px;
  position: relative;
}
.locations-grid .location .location-specifics::after, .locations-grid .location .location-specifics::before {
  position: absolute;
  content: "";
  background-color: rgba(255, 255, 255, 0.5);
}
.locations-grid .location .location-specifics::after {
  width: 1px;
  top: 0;
  bottom: 0;
  left: 50%;
}
.locations-grid .location .location-specifics::before {
  height: 1px;
  left: 0;
  right: 0;
  top: 50%;
}
.locations-grid .location .location-specifics span {
  width: 100%;
  height: 100%;
  padding: 10px;
  display: flex;
  align-items: end;
  justify-content: center;
  background-position: 50% 20px;
  background-repeat: no-repeat;
  background-size: 60%;
}
.locations-grid .location .location-specifics .number-of-properties {
  background-image: url("../images/ikone/grad-nekretnine.svg");
}
.locations-grid .location .location-specifics .green-areas {
  background-image: url("../images/ikone/grad-zelenilo.svg");
}
.locations-grid .location .location-specifics .buildings {
  background-image: url("../images/ikone/grad-zgrade.svg");
}
.locations-grid .location .location-specifics .schools {
  background-image: url("../images/ikone/grad-skole.svg");
}
.locations-grid .location h3 {
  font-size: 45px;
  font-weight: 400;
}
.locations-grid .location .overlay {
  opacity: 0.45;
}
.locations-grid .location:first-child {
  grid-column: span 2;
  grid-row: span 2;
}
.locations-grid .location:nth-child(2) {
  grid-column: span 2;
}
.locations-grid .location:hover .title-and-specifics {
  opacity: 1;
  -webkit-backdrop-filter: blur(2px);
          backdrop-filter: blur(2px);
}
.locations-grid .location:hover h3 {
  opacity: 0;
}
@media screen and (max-width: 1600px) {
  .locations-grid {
    gap: 10px;
    grid-auto-rows: 270px;
  }
  .locations-grid .location .location-specifics {
    height: 200px;
    width: 200px;
  }
}
@media screen and (max-width: 1399px) {
  .locations-grid {
    gap: 10px;
    grid-auto-rows: 240px;
  }
  .locations-grid .location .location-specifics {
    height: 180px;
    width: 180px;
  }
  .locations-grid .location h3 {
    font-size: 35px;
  }
}
@media screen and (max-width: 991px) {
  .locations-grid {
    grid-template-columns: 1fr 1fr;
  }
  .locations-grid .location:first-child {
    grid-column: span 1;
    grid-row: span 1;
  }
  .locations-grid .location:nth-child(2) {
    grid-column: span 1;
  }
}
@media screen and (max-width: 767px) {
  .locations-grid {
    gap: 5px;
  }
}
@media screen and (max-width: 575px) {
  .locations-grid {
    grid-template-columns: 1fr;
  }
}

.dark-container {
  background-color: #232323;
  border-radius: 12px;
  padding: 80px 50px;
}
@media screen and (max-width: 575px) {
  .dark-container {
    max-width: 100%;
    padding: 50px 5%;
    border-radius: 0;
  }
}

@media screen and (max-width: 575px) {
  .page-padding:has(.dark-container) {
    padding: 0;
  }
}
.dark-container-text {
  overflow: auto;
}
.dark-container-text h1, .dark-container-text h2, .dark-container-text p {
  color: #fff;
}
.dark-container-text h1, .dark-container-text h2 {
  text-align: left;
}
.dark-container-text h1 {
  margin-bottom: 50px;
}
.dark-container-text h1::after {
  width: 120px;
}
.dark-container-text h2 {
  font-family: "Jost", sans-serif;
  font-size: 30px;
  font-weight: bold;
  float: left;
  width: 40%;
  clear: right;
  padding-right: 50px;
}
@media screen and (max-width: 1600px) {
  .dark-container-text h2 {
    font-size: 25px;
  }
}
@media screen and (max-width: 1399px) {
  .dark-container-text h2 {
    font-size: 23px;
  }
}
@media screen and (max-width: 575px) {
  .dark-container-text h2 {
    font-size: 18px;
  }
}
.dark-container-text p {
  float: right;
  width: 60%;
}
@media screen and (max-width: 1199px) {
  .dark-container-text h2, .dark-container-text p {
    float: none;
    width: 100%;
  }
}
.dark-container-text h2, .dark-container-text h2 + p {
  margin-top: 80px;
}
@media screen and (max-width: 1600px) {
  .dark-container-text h2, .dark-container-text h2 + p {
    margin-top: 50px;
  }
}
@media screen and (max-width: 1199px) {
  .dark-container-text h2 + p {
    margin-top: 25px;
  }
}

.cookies-text p + p {
  margin-top: 40px;
}
@media screen and (max-width: 1199px) {
  .cookies-text p + p {
    margin-top: 20px;
  }
}

.properties-grid {
  margin-top: 50px;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  -moz-column-gap: 60px;
       column-gap: 60px;
  row-gap: 80px;
}
@media screen and (max-width: 1600px) {
  .properties-grid {
    -moz-column-gap: 50px;
         column-gap: 50px;
  }
}
@media screen and (max-width: 1399px) {
  .properties-grid {
    -moz-column-gap: 30px;
         column-gap: 30px;
    row-gap: 50px;
  }
}
@media screen and (max-width: 1299px) {
  .properties-grid {
    -moz-column-gap: 15px;
         column-gap: 15px;
  }
}
@media screen and (max-width: 1199px) {
  .properties-grid {
    grid-template-columns: 1fr 1fr;
    -moz-column-gap: 50px;
         column-gap: 50px;
  }
}
@media screen and (max-width: 767px) {
  .properties-grid {
    grid-template-columns: 1fr;
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
  }
}

.property .property-img {
  position: relative;
  border-radius: 6px;
  height: 260px;
  overflow: hidden;
}
.property .property-img img {
  width: 100%;
  height: 100%;
  -o-object-position: center;
     object-position: center;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 6px;
  transition: all 0.5s;
}
.property .property-img .center-sold {
  display: none;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  color: #fff;
  font-size: 40px;
  font-weight: 400;
  letter-spacing: normal;
}
.property .property-img .left-corner {
  position: absolute;
  z-index: 1;
  left: 0;
  top: 10px;
}
.property .property-img .left-corner span {
  font-size: 12px;
  color: #000000;
  font-weight: 400;
  font-family: "Jost", sans-serif;
  background-color: rgba(217, 217, 217, 0.8);
  border-top-right-radius: 11px;
  border-bottom-right-radius: 11px;
  padding: 8px 15px;
  display: block;
}
.property .property-img .left-corner span + span {
  margin-top: 5px;
}
.property .property-img .left-corner .discount {
  background-color: #A28E6A !important;
  color: #fff;
}
@media screen and (max-width: 1399px) {
  .property .property-img {
    height: 200px;
  }
}
.property .property-info {
  margin-top: 10px;
}
.property .property-info .top-info {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.property .property-info .top-info span, .property .property-info p, .property .property-info .amenities span, .property .property-info .property-title {
  color: #131516;
}
.property .property-info .top-info span, .property .property-info p {
  font-size: 16px;
}
.property .property-info .top-info span {
  opacity: 0.761;
}
.property .property-info p {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 22px;
}
.property .property-info .property-title {
  font-size: 22px;
  font-weight: 400;
  margin: 10px 0;
  min-height: 60px;
  transition: all 0.5s;
  -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 2;
}
.property .property-info .bottom-info {
  border-top: 1px solid #6d7175;
  margin-top: 15px;
  padding-top: 15px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.property .property-info .bottom-info .price {
  font-family: "Jost", sans-serif;
  font-size: 24px;
  font-weight: 400;
  color: #A28E6A;
}
.property .property-info .bottom-info .amenities .area {
  padding-left: 29px;
}
.property .property-info .bottom-info .amenities .area::before {
  width: 24px;
  height: 24px;
  /* background-image: url("../images/ikone/povrsina-tamna.svg"); */
  background-image: url("../images/ikone/povrsina.svg");
}
.property .property-info .bottom-info .amenities .area::after {
  content: "m2";
  margin-left: 3px;
}
.property .property-info .bottom-info .amenities .area-house {
  padding-left: 29px;
}
.property .property-info .bottom-info .amenities .area-house::before {
  width: 24px;
  height: 24px;
  /* background-image: url("../images/ikone/kuca-povrsina.svg"); */
  background-image: url("../images/ikone/povrsina-objekta.svg");
}
.property .property-info .bottom-info .amenities .area-house::after {
  content: "m2";
  margin-left: 3px;
}
.property .property-info .bottom-info .amenities .bed {
  padding-left: 34px;
}
.property .property-info .bottom-info .amenities .bed::before {
  width: 30px;
  height: 26px;
  /* background-image: url("../images/ikone/krevet-tamni.svg"); */
  background-image: url("../images/ikone/krevet.svg");
}
.property .property-info .bottom-info .amenities .bath {
  padding-left: 22px;
}
.property .property-info .bottom-info .amenities .bath::before {
  width: 18px;
  height: 26px;
  /* background-image: url("../images/ikone/kada-tamna.svg"); */
  background-image: url("../images/ikone/kada.svg");
}
.property .property-info .bottom-info .amenities span {
  font-size: 15px;
  font-weight: 400;
  position: relative;
  margin-left: 5px;
}
@media screen and (max-width: 575px) {
  .property .property-info .bottom-info .amenities span {
    font-size: 13px;
  }
}
.property .property-info .bottom-info .amenities span::before {
  position: absolute;
  left: 0;
  bottom: 0;
  content: "";
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
@media screen and (max-width: 1399px) {
  .property .property-info .property-title {
    font-size: 20px;
  }
  .property .property-info .top-info span, .property .property-info p {
    font-size: 14px;
  }
  .property .property-info .bottom-info .price {
    font-size: 22px;
  }
}
@media screen and (max-width: 575px) {
  .property .property-info .bottom-info .price {
    font-size: 19px;
  }
}

.dark .property .property-info .top-info span {
  color: rgba(255, 255, 255, 0.761);
}
.dark .property .property-info p, .dark .property .property-info .amenities span {
  color: #cacaca;
}
.dark .property .property-info .property-title {
  color: #fff;
}
.dark .property .property-info .bottom-info .amenities .area::before {
  background-image: url("../images/ikone/povrsina.svg");
}
.dark .property .property-info .bottom-info .amenities .bed::before {
  background-image: url("../images/ikone/krevet.svg");
}
.dark .property .property-info .bottom-info .amenities .bath::before {
  background-image: url("../images/ikone/kada.svg");
}

.property:hover .property-img img {
  scale: 1.08;
}
.property:hover .property-info .property-title {
  color: #A28E6A;
}

.properties-home {
  padding: 100px 0;
  position: relative;
  background-color: #222222;
}
@media screen and (max-width: 575px) {
  .properties-home {
    padding: 50px 0;
  }
}

.property.sold .property-img img {
  filter: blur(5px);
}
.property.sold .property-img .left-corner {
  display: none;
}
.property.sold .property-img .center-sold {
  display: flex;
  align-items: center;
  justify-content: center;
}

.properties-list .property .property-img .left-corner {
  top: 20px;
  left: 20px;
}
.properties-list .property .property-img .left-corner span {
  border-radius: 18px;
  background-color: #BCBEB5;
  font-size: 15px;
  font-weight: 500;
  display: inline-block;
}
.properties-list .property .property-img .left-corner.inverted span {
  border-radius: 18px;
  background-color: black;
  color: #BCBEB5;
  font-size: 15px;
  font-weight: 500;
  display: inline-block;
}
.properties-list .property .property-img .left-corner.sold {
  display: none;
}
@media screen and (max-width: 1600px) {
  .properties-list .property .property-img .left-corner span {
    font-size: 12px;
  }
}
.properties-list .property .property-img .left-corner span + span {
  margin-top: 0;
  margin-left: 10px;
}

.pagination {
  margin-top: 50px;
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: center;
}
.pagination li a {
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  color: #000;
  font-family: "Jost", sans-serif;
  font-weight: 400;
  border-radius: 50%;
}
@media screen and (max-width: 1399px) {
  .pagination li a {
    font-size: 17px;
    width: 44px;
    height: 44px;
  }
}
.pagination li .active {
  background-color: #0C2956;
  color: #fff;
}
.pagination li + li {
  margin-left: 10px;
}
@media screen and (max-width: 575px) {
  .pagination li + li {
    margin-left: 0;
  }
}
/* .pagination li:first-child, .pagination li:last-child {
  background-image: url("../images/pag.svg");
  background-position: center;
  background-repeat: no-repeat;
}
.pagination li:first-child {
  transform: rotate(180deg);
  display: none;
} */

.property-gallery {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 15px;
  grid-auto-rows: 270px;
}
.property-gallery img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
}
.property-gallery a {
  position: relative;
  border-radius: 16px;
  overflow: hidden;
}
.property-gallery a::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background-color: #000;
  opacity: 0.1;
  z-index: 1;
}
.property-gallery a .property-details {
  position: absolute;
  z-index: 2;
  left: 20px;
  bottom: 20px;
  right: 20px;
  display: flex;
  align-items: end;
  justify-content: space-between;
}
.property-gallery a .property-details .details {
  padding-right: 20px;
}
.property-gallery a .property-details .details .details-top {
  margin-bottom: 30px;
}
.property-gallery a .property-details .details .details-top span {
  font-family: "Jost", sans-serif;
  font-weight: 500;
  font-size: 16px;
  display: inline-block;
}
.property-gallery a .property-details .details .details-top span + span {
  margin-left: 10px;
}
.property-gallery a .property-details .details .details-top .rent, .property-gallery a .property-details .details .details-top .discount {
  border-radius: 18px;
  padding: 10px 15px;
}
.property-gallery a .property-details .details .details-top .rent {
  background-color: #BCBEB5;
  color: #000;
}
.property-gallery a .property-details .details .details-top .discount {
  background-color: #A28E6A;
}
.property-gallery a .property-details .details .details-top .property-id {
  font-weight: 400;
  font-size: 24px;
  padding: 0 !important;
}
.property-gallery a .property-details * {
  color: #fff;
}
.property-gallery a .property-details h1 {
  font-size: 28px;
  text-align: left;
  letter-spacing: normal;
  margin-bottom: 10px;
}
.property-gallery a .property-details .property-price {
  font-family: "Jost", sans-serif;
  font-size: 28px;
  text-align: right;
}
.property-gallery a:first-child {
  grid-column: span 2;
  grid-row: span 2;
}
.property-gallery a.single-estate-image:first-child {
  grid-column: span 4;
  grid-row: span 2;
}
.property-gallery a:first-child::after {
  opacity: 0.3;
}
@media screen and (max-width: 1600px) {
  .property-gallery {
    gap: 10px;
    grid-auto-rows: 250px;
  }
  .property-gallery a .property-details h1, .property-gallery a .property-details .property-price {
    font-size: 24px;
  }
  .property-gallery a .property-details .details .details-top span {
    font-size: 14px !important;
    padding: 8px 10px !important;
  }
  .property-gallery a .property-details .details .details-top .property-id {
    font-size: 20px !important;
  }
}
@media screen and (max-width: 1399px) {
  .property-gallery {
    gap: 5px;
    grid-auto-rows: 220px;
  }
  .property-gallery a .property-details .property-price {
    width: -moz-min-content;
    width: min-content;
  }
}
@media screen and (max-width: 1199px) {
  .property-gallery {
    grid-template-columns: 1fr 1fr;
  }
}
@media screen and (max-width: 575px) {
  .property-gallery {
    grid-auto-rows: 150px;
  }
  .property-gallery a .property-details {
    flex-direction: column;
    align-items: start;
  }
  .property-gallery a .property-details .details {
    padding-right: 0;
  }
  .property-gallery a .property-details .details p {
    font-size: 14px;
  }
  .property-gallery a .property-details .details .details-top {
    margin-bottom: 10px;
  }
  .property-gallery a .property-details .details .details-top span {
    font-size: 10px !important;
  }
  .property-gallery a .property-details .details .details-top span + span {
    margin-left: 5px;
  }
  .property-gallery a .property-details .details .details-top .property-id {
    font-size: 16px !important;
  }
  .property-gallery a .property-details .property-price {
    width: -moz-fit-content;
    width: fit-content;
    margin-top: 0;
  }
  .property-gallery a .property-details h1, .property-gallery a .property-details .property-price {
    font-size: 22px;
  }
  .property-gallery a .property-details h1 {
    margin-bottom: 5px;
  }
}

body:has(.agent) {
  overflow: visible;
}

.details-grid {
  /* margin-top: 100px; */
  margin-top: 50px;
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 60px;
  position: relative;
}
@media screen and (max-width: 1600px) {
  .details-grid {
    gap: 40px;
  }
}
@media screen and (max-width: 1399px) {
  .details-grid {
    gap: 20px;
    margin-top: 50px;
  }
}
@media screen and (max-width: 1199px) {
  .details-grid {
    grid-template-columns: 1fr;
  }
}
.details-grid .details-info, .details-grid .agent {
  background-color: #F3F3F3;
  border-radius: 16px;
  padding: 30px;
}
@media screen and (max-width: 575px) {
  .details-grid .details-info, .details-grid .agent {
    padding: 30px 20px;
  }
}
@media screen and (max-width: 400px) {
  .details-grid .details-info, .details-grid .agent {
    padding: 30px 10px;
  }
}
.details-grid .details-info {
  display: grid;
  gap: 60px;
}
.details-grid .details-info h2 {
  font-size: 30px;
  letter-spacing: 0;
  margin-bottom: 30px;
}
@media screen and (max-width: 1399px) {
  .details-grid .details-info h2 {
    font-size: 25px;
  }
}
.details-grid .details-info ul {
  list-style: none;
}
.details-grid .details-info ul li, .details-grid .details-info ul li p {
  font-size: 20px;
  line-height: 36px;
  font-weight: 400;
  font-family: "Jost", sans-serif;
}
@media screen and (max-width: 1600px) {
  .details-grid .details-info ul li, .details-grid .details-info ul li p {
    font-size: 20px;
    line-height: 34px;
  }
}
@media screen and (max-width: 1399px) {
  .details-grid .details-info ul li, .details-grid .details-info ul li p {
    font-size: 18px;
    line-height: 32px;
  }
}
@media screen and (max-width: 575px) {
  .details-grid .details-info ul li, .details-grid .details-info ul li p {
    font-size: 16px;
    line-height: 30px;
  }
}
.details-grid .details-info .details-list, .details-grid .details-info .check-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  -moz-column-gap: 40px;
       column-gap: 40px;
}
@media screen and (max-width: 575px) {
  .details-grid .details-info .details-list, .details-grid .details-info .check-list {
    grid-template-columns: 1fr;
  }
}
.details-grid .details-info .details-list li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 2px solid rgba(0, 0, 0, 0.2);
  padding: 5px 0;
}
.details-grid .details-info .check-list {
  row-gap: 5px;
}
.details-grid .details-info .check-list li {
  font-family: "Jost", sans-serif;
  position: relative;
  padding-left: 40px;
}
.details-grid .details-info .check-list li::before {
  content: "";
  position: absolute;
  top: 2px;
  left: 0;
  width: 30px;
  height: 30px;
  background-image: url("../images/ikone/provjereno.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
@media screen and (max-width: 575px) {
  .details-grid .details-info .check-list li::before {
    width: 25px;
    height: 25px;
  }
}
.details-grid .details-info .information-list {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  row-gap: 40px;
}
.details-grid .details-info .information-list li {
  color: #808080;
  font-family: "Jost", sans-serif;
  padding-left: 50px;
  position: relative;
}
.details-grid .details-info .information-list li::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 38px;
  height: 38px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
@media screen and (max-width: 1399px) {
  .details-grid .details-info .information-list li {
    padding-left: 42px;
    line-height: 22px;
  }
  .details-grid .details-info .information-list li::before {
    width: 32px;
    height: 32px;
  }
}
@media screen and (max-width: 1399px) {
  .details-grid .details-info .information-list {
    grid-template-columns: 1fr 1fr;
  }
}
@media screen and (max-width: 450px) {
  .details-grid .details-info .information-list {
    grid-template-columns: 1fr;
  }
}
.details-grid .details-info .information-list .type::before {
  background-image: url("../images/ikone/detalji-tip.svg");
}
.details-grid .details-info .information-list .meters::before {
  background-image: url("../images/ikone/detalji-povrsina.svg");
}
.details-grid .details-info .information-list .meters2::before {
  /* background-image: url("../images/ikone/kuca-povrsina.svg"); */
  background-image: url("../images/ikone/povrsina-objekta.svg");
}
.details-grid .details-info .information-list .balcony::before {
  background-image: url("../images/ikone/detalji-balkon.svg");
}
.details-grid .details-info .information-list .bed::before {
  background-image: url("../images/ikone/detalji-krevet.svg");
}
.details-grid .details-info .information-list .shower::before {
  background-image: url("../images/ikone/detalji-kupatilo.svg");
}
.details-grid .details-info .information-list .furniture::before {
  background-image: url("../images/ikone/detalji-namjestaj.svg");
}
.details-grid .details-info .property-map, .details-grid .details-info .property-video {
  border-radius: 19px;
  overflow: hidden;
  height: 45vh;
  max-height: 500px;
}
@media screen and (max-width: 575px) {
  .details-grid .details-info .property-map, .details-grid .details-info .property-video {
    height: 30vh;
  }
}
.details-grid .details-info .property-map iframe, .details-grid .details-info .property-video iframe {
  width: 100%;
  height: 100%;
}
.details-grid .details-info .properties-grid {
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 0;
}
@media screen and (max-width: 767px) {
  .details-grid .details-info .properties-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }
}
.details-grid .agent {
  height: -moz-fit-content;
  height: fit-content;
  position: sticky;
  /* top: 140px; */
  top: -105px;
}
@media screen and (max-width: 1399px) {
  .details-grid .agent {
    /* top: 120px; */
    top: -80px;
  }
}
.details-grid .agent p {
  font-family: "Jost", sans-serif;
  font-size: 24px;
  font-weight: 500;
}
@media screen and (max-width: 1399px) {
  .details-grid .agent p {
    font-size: 22px;
  }
}
.details-grid .agent .agent-info {
  display: flex;
  align-items: center;
  margin: 30px 0;
}
.details-grid .agent .agent-info .agent-img {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  overflow: hidden;
  margin-right: 40px;
}
.details-grid .agent .agent-info .agent-img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
}
@media screen and (max-width: 1399px) {
  .details-grid .agent .agent-info .agent-img {
    width: 80px;
    height: 80px;
    margin-right: 30px;
  }
}
.details-grid .agent .agent-info .agent-name p {
  text-align: center;
}
.details-grid .agent .agent-info .agent-name p:nth-child(2) {
  font-size: 16px;
}
.details-grid .agent form {
  display: grid;
  /* gap: 25px; */
  gap: 15px;
}
.details-grid .agent form input, .details-grid .agent form button {
  /* height: 50px; */
  height: 40px;
}
.details-grid .agent form input, .details-grid .agent form textarea, .details-grid .agent form button {
  padding: 10px;
  border-radius: 15px;
  width: 100%;
}
.details-grid .agent form input, .details-grid .agent form textarea {
  background-color: transparent;
  border: 1px solid rgba(0, 0, 0, 0.2);
  outline: none;
}
.details-grid .agent form textarea {
  /* height: 200px; */
  height: 150px;
  resize: none;
}
@media screen and (max-width: 1399px) {
  .details-grid .agent form textarea {
    height: 100px;
  }
}
.details-grid .agent form input::-moz-placeholder, .details-grid .agent form textarea::-moz-placeholder {
  font-family: "Jost", sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: #808080;
}
.details-grid .agent form input, .details-grid .agent form input::placeholder, .details-grid .agent form textarea, .details-grid .agent form textarea::placeholder {
  font-family: "Jost", sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: #808080;
}
.details-grid .agent form button {
  font-family: "Jost", sans-serif;
  font-size: 20px;
  font-weight: 400;
  color: #fff;
  background-color: #0C2956;
  border: none;
}

.top-wrap-property-list {
  display: flex;
  align-items: end;
  justify-content: space-between;
}
@media screen and (max-width: 991px) {
  .top-wrap-property-list {
    flex-direction: column;
    align-items: start;
  }
}
.top-wrap-property-list .sort-properties {
  display: flex;
  align-items: center;
  /* The container must be positioned relative: */
  /* Style the arrow inside the select element: */
  /* Point the arrow upwards when the select box is open (active): */
  /* style the items (options), including the selected item: */
  /* Style items (options): */
  /* Hide the items when the select box is closed: */
}
.top-wrap-property-list .sort-properties span {
  font-size: 20px;
  font-weight: 400;
  color: #000;
  letter-spacing: normal;
  margin-right: 5px;
}
@media screen and (max-width: 991px) {
  .top-wrap-property-list .sort-properties {
    margin-top: 40px;
  }
}
@media screen and (max-width: 575px) {
  .top-wrap-property-list .sort-properties {
    flex-direction: column;
    align-items: start;
  }
}
.top-wrap-property-list .sort-properties .custom-select {
  position: relative;
  font-family: "Jost", sans-serif;
  cursor: pointer;
}
/* .top-wrap-property-list .sort-properties .custom-select select {
  display: none;
} */
.top-wrap-property-list .sort-properties .select-selected {
  background-color: transparent;
}
.top-wrap-property-list .sort-properties .select-selected:after {
  position: absolute;
  content: "";
  top: 5px;
  right: 0;
  width: 15px;
  height: 15px;
  background-image: url("../images/ikone/padajuci-tamni.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  transition: all 0.5s;
}
.top-wrap-property-list .sort-properties .select-selected.select-arrow-active:after {
  transform: rotate(180deg);
}
.top-wrap-property-list .sort-properties select {
  color: #808080;
  font-size: 20px;
  letter-spacing: normal;
  padding-right: 20px;
  background-color: transparent;
  border: none;
  outline: none;
}
.top-wrap-property-list .sort-properties .select-selected {
  color: #808080;
  font-size: 20px;
  letter-spacing: normal;
  padding-right: 20px;
}
.top-wrap-property-list .sort-properties .select-items div {
  color: #000;
  padding: 10px 20px;
  letter-spacing: normal;
  font-weight: 600;
  cursor: pointer;
}
.top-wrap-property-list .sort-properties .select-items {
  position: absolute;
  background-color: #fff;
  top: calc(100% + 10px);
  left: 50%;
  transform: translateX(-50%);
  width: -moz-max-content;
  width: max-content;
  z-index: 9;
  border-radius: 12px;
  overflow: hidden;
  padding: 10px 0;
}
@media screen and (max-width: 575px) {
  .top-wrap-property-list .sort-properties .select-items {
    transform: none;
    left: 0;
  }
}
.top-wrap-property-list .sort-properties .select-hide {
  display: none;
}
.top-wrap-property-list .sort-properties .select-items div:hover, .top-wrap-property-list .sort-properties .same-as-selected {
  background-color: rgba(19, 21, 24, 0.11);
}

.contact-wrap {
  background-color: #131518;
  position: relative;
  padding-left: calc(50% - 700px);
  padding-top: 200px;
  padding-bottom: 50px;
}
.contact-wrap .overlay {
  left: unset;
  right: 0;
  bottom: 0;
  width: 50%;
  background: linear-gradient(180deg, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0.67) 33%, rgba(0, 0, 0, 0) 53%, rgba(0, 0, 0, 0) 100%);
  z-index: 1;
  opacity: 0.4;
}
.contact-wrap .contact-bg {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 50%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  display: flex;
}
.contact-wrap .contact-bg .contact-social {
  margin: auto auto 100px;
  position: relative;
  z-index: 2;
  max-width: 80%;
  background: linear-gradient(113deg, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0.1) 100%);
  padding: 50px;
  -webkit-backdrop-filter: blur(5px);
          backdrop-filter: blur(5px);
  border-radius: 30px;
  border: 1px solid rgba(255, 255, 255, 0.5);
}
.contact-wrap .contact-bg .contact-social .social {
  margin-bottom: 0;
}
.contact-wrap .contact-bg .contact-social p {
  text-align: center;
  font-size: 30px;
  color: #fff;
  letter-spacing: normal;
}
@media screen and (max-width: 1399px) {
  .contact-wrap .contact-bg .contact-social p {
    font-size: 22px;
  }
}
.contact-wrap .contact-info {
  width: 40%;
}
.contact-wrap .contact-info h1, .contact-wrap .contact-info p {
  color: #fff;
  margin-bottom: 25px;
}
.contact-wrap .contact-info form {
  max-width: 550px;
  display: grid;
  gap: 35px;
  margin-top: 50px;
}
.contact-wrap .contact-info form input, .contact-wrap .contact-info form button {
  width: 100%;
  padding: 10px 0;
}
.contact-wrap .contact-info form input::-moz-placeholder {
  font-family: "Jost", sans-serif;
  font-size: 22px;
  font-weight: 400;
}
.contact-wrap .contact-info form input, .contact-wrap .contact-info form input::placeholder, .contact-wrap .contact-info form button {
  font-family: "Jost", sans-serif;
  font-size: 22px;
  font-weight: 400;
}
.contact-wrap .contact-info form input::-moz-placeholder {
  color: #fff;
}
.contact-wrap .contact-info form input, .contact-wrap .contact-info form input::placeholder {
  color: #fff;
}
.contact-wrap .contact-info form input {
  background-color: transparent;
  border: none;
  border-bottom: 1px solid #fff;
  outline: none;
  height: 50px;
}
.contact-wrap .contact-info form textarea {
  background-color: transparent;
  border: none;
  border-bottom: 1px solid #fff;
  outline: none;
  color: #fff;
  font-family: "Jost", sans-serif;
  font-size: 22px;
  font-weight: 400;
}
.contact-wrap .contact-info form textarea::placeholder {
  font-family: "Jost", sans-serif;
  font-size: 22px;
  font-weight: 400;
  color: white;
}

.contact-wrap .contact-info form textarea::-moz-placeholder {
  font-family: "Jost", sans-serif;
  font-size: 22px;
  font-weight: 400;
  color: white;
}

.contact-wrap .contact-info form button {
  background-color: #fff;
  border: none;
  color: #000;
  margin-top: 50px;
  height: 60px;
}
@media screen and (max-width: 1399px) {
  .contact-wrap .contact-info form {
    gap: 20px;
  }
  .contact-wrap .contact-info form input::-moz-placeholder {
    font-size: 18px;
  }
  .contact-wrap .contact-info form input, .contact-wrap .contact-info form input::placeholder, .contact-wrap .contact-info form button {
    font-size: 18px;
  }
  .contact-wrap .contact-info form input {
    height: 40px;
  }
  .contact-wrap .contact-info form button {
    height: 50px;
  }
}
.contact-wrap .contact-info .contact-links {
  max-width: 550px;
  margin: 40px auto;
}
.contact-wrap .contact-info .contact-links a {
  font-family: "Jost", sans-serif;
  font-size: 22px;
  font-weight: 400;
  color: #fff;
  letter-spacing: normal;
  display: block;
  margin-top: 10px;
}
@media screen and (max-width: 1399px) {
  .contact-wrap .contact-info .contact-links a {
    font-size: 18px;
  }
}
@media only screen and (max-width: 1600px) {
  .contact-wrap {
    padding-left: 10%;
  }
}
@media screen and (max-width: 1399px) {
  .contact-wrap {
    padding-top: 150px;
  }
}
@media screen and (max-width: 991px) {
  .contact-wrap {
    padding-right: 10%;
    padding-bottom: 450px;
    padding-top: 130px;
  }
  .contact-wrap .contact-bg, .contact-wrap .overlay {
    top: unset;
    left: 0;
    width: 100%;
    height: 400px;
  }
  .contact-wrap .contact-bg .contact-social {
    margin: auto;
  }
  .contact-wrap .contact-info {
    width: 100%;
  }
  .contact-wrap .contact-info form {
    max-width: unset;
  }
  .contact-wrap .contact-info form button {
    margin-top: 30px;
  }
  .contact-wrap .contact-info .contact-links {
    margin: 40px 0 0;
  }
}
@media only screen and (max-width: 900px) {
  .contact-wrap {
    padding-left: 5%;
    padding-right: 5%;
  }
}
@media screen and (max-width: 575px) {
  .contact-wrap {
    padding-top: 110px;
  }
  .contact-wrap .contact-bg .contact-social {
    max-width: 90%;
  }
}

.map iframe {
  width: 100%;
  height: 50vh;
}

.blog-grid {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 50px;
  margin-top: 50px;
}
@media only screen and (max-width: 1600px) {
  .blog-grid {
    gap: 30px;
  }
}
@media screen and (max-width: 1199px) {
  .blog-grid {
    grid-template-columns: 1fr;
  }
}

.blog-posts {
  display: grid;
  gap: 15px;
}

.blog-post {
  background-color: #fff;
  border-radius: 20px;
  overflow: hidden;
  display: grid;
  grid-template-columns: 1fr 2fr;
}
@media screen and (max-width: 1199px) {
  .blog-post {
    max-height: 200px;
  }
}
.blog-post .blog-img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
}
.blog-post .blog-info {
  padding: 20px;
}
@media screen and (max-width: 575px) {
  .blog-post .blog-info {
    padding: 20px 10px;
  }
}
.blog-post .blog-info * {
  color: #000;
}
.blog-post .blog-info span, .blog-post .blog-info p {
  font-family: "Jost", sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 28px;
}
@media screen and (max-width: 1399px) {
  .blog-post .blog-info span, .blog-post .blog-info p {
    font-size: 16px;
    line-height: 26px;
  }
}
@media screen and (max-width: 575px) {
  .blog-post .blog-info span, .blog-post .blog-info p {
    font-size: 14px;
    line-height: 20px;
  }
}
.blog-post .blog-info h3 {
  font-size: 24px;
  line-height: 34px;
  font-weight: bold;
  letter-spacing: normal;
  margin: 20px 0;
}
@media screen and (max-width: 1399px) {
  .blog-post .blog-info h3 {
    font-size: 20px;
    line-height: 26px;
    margin: 10px 0;
  }
}
@media screen and (max-width: 575px) {
  .blog-post .blog-info h3 {
    font-size: 18px;
    line-height: 24px;
    letter-spacing: normal;
    margin: 5px 0;
  }
}
.blog-post .blog-info h3, .blog-post .blog-info p {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.blog-post:hover .blog-info h3 {
  text-decoration: underline;
}

.similar-posts, .tags, .share {
  background-color: #fff;
  border-radius: 20px;
  padding: 25px;
}
.similar-posts h2, .tags h2, .share h2 {
  font-weight: bold;
  font-size: 26px;
  letter-spacing: normal;
}
@media screen and (max-width: 1399px) {
  .similar-posts h2, .tags h2, .share h2 {
    font-size: 22px;
  }
}
@media screen and (max-width: 1199px) {
  .similar-posts, .tags, .share {
    max-width: 450px;
  }
}

.share {
  margin-top: 50px;
}
.share .social {
  margin: 50px 0 30px;
}
.share .social svg path {
  fill: #000;
}
@media screen and (max-width: 1399px) {
  .share {
    margin-top: 30px;
  }
  .share .social {
    margin: 20px 0 0;
  }
}
@media screen and (max-width: 1199px) {
  .share {
    margin-top: 0;
  }
}

.small-posts {
  margin-top: 20px;
}
.small-posts .post {
  margin-top: 10px;
  display: grid;
  grid-template-columns: 1fr 2fr;
}
.small-posts .post .post-img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
  border-radius: 20px;
}
.small-posts .post .post-info {
  padding: 10px 0 10px 20px;
}
@media screen and (max-width: 575px) {
  .small-posts .post .post-info {
    padding: 10px 0 10px 10px;
  }
}
.small-posts .post .post-info * {
  color: #000;
}
.small-posts .post .post-info h3, .small-posts .post .post-info span {
  font-size: 20px;
  font-weight: bold;
}
@media screen and (max-width: 1399px) {
  .small-posts .post .post-info h3, .small-posts .post .post-info span {
    font-size: 16px;
    line-height: 22px;
  }
}
.small-posts .post .post-info h3 {
  letter-spacing: normal;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-bottom: 10px;
}
@media screen and (max-width: 575px) {
  .small-posts .post .post-info h3 {
    letter-spacing: normal;
  }
}
.small-posts .post .post-info span {
  font-family: "Jost", sans-serif;
  letter-spacing: normal;
  color: #6D7175;
}
.small-posts .post:hover .post-info h3 {
  text-decoration: underline;
}

.tags {
  margin-top: 50px;
}
.tags .tab {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  margin-top: 20px;
}
.tags .tab span {
  color: #808080;
  font-weight: bold;
  font-size: 20px;
  letter-spacing: normal;
  padding: 10px 15px;
  border: 1px solid #CACACA;
  display: inline-block;
  border-radius: 30px;
  margin-right: 20px;
  margin-bottom: 20px;
  cursor: pointer;
  transition: all 0.5s;
}
.tags .tab span:hover {
  color: #000;
  border-color: #000;
}
.tags .tab a.active span {
  color: #000;
  border-color: #000;
}
@media screen and (max-width: 1399px) {
  .tags {
    margin-top: 30px;
  }
  .tags .tab span {
    font-size: 14px;
  }
}
@media screen and (max-width: 575px) {
  .tags .tab span {
    margin-right: 10px;
  }
}

@media screen and (max-width: 1199px) {
  .blog-right {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
  }
  .blog-right .similar-posts, .blog-right .tags {
    height: -moz-fit-content;
    height: fit-content;
    margin-top: 0;
  }
}
@media screen and (max-width: 767px) {
  .blog-right {
    grid-template-columns: 1fr;
  }
}

.blog-pagination .pagination {
  grid-column: span 2;
}
@media screen and (max-width: 1199px) {
  .blog-pagination .pagination {
    grid-column: span 1;
    order: 2;
    margin: 20px 0;
  }
  .blog-pagination .blog-posts {
    order: 1;
  }
  .blog-pagination .blog-right {
    order: 3;
  }
}

body:has(.blog-post-cover) {
  background-color: #F8F5F0;
}

.blog-post-cover {
  position: relative;
  height: 60vh;
}
.blog-post-cover img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
  border-radius: 20px;
}
.blog-post-cover .cover-text {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: end;
  background-color: rgba(0, 0, 0, 0.3);
  border-radius: 20px;
  position: relative;
  z-index: 1;
  padding: 50px 100px;
}
@media screen and (max-width: 1600px) {
  .blog-post-cover .cover-text {
    padding: 50px;
  }
}
@media screen and (max-width: 575px) {
  .blog-post-cover .cover-text {
    padding: 50px 20px;
  }
}
.blog-post-cover .cover-text * {
  color: #fff;
}
.blog-post-cover .cover-text h1 {
  text-align: left;
  font-weight: bold;
  font-size: 35px;
  margin: 10px 0;
}
@media screen and (max-width: 1600px) {
  .blog-post-cover .cover-text h1 {
    font-size: 32px;
  }
}
@media screen and (max-width: 1399px) {
  .blog-post-cover .cover-text h1 {
    font-size: 30px;
  }
}
@media screen and (max-width: 1199px) {
  .blog-post-cover .cover-text h1 {
    font-size: 26px;
  }
}
.blog-post-cover .cover-text span {
  font-size: 18px;
  font-weight: 400;
}
@media screen and (max-width: 575px) {
  .blog-post-cover .cover-text span {
    font-size: 15px;
  }
}

.post-info h2 {
  letter-spacing: normal;
  text-align: left;
  margin-top: 50px;
}
.post-info h2:first-child {
  margin-top: 0;
}
.post-info h2 + p {
  margin-top: 25px;
}
.post-info p, .post-info li {
  color: #131518;
}
.post-info ul, .post-info ol {
  list-style-position: inside;
  margin: 25px 0;
  display: inline-block;
  width: 49%;
}
@media screen and (max-width: 991px) {
  .post-info ul, .post-info ol {
    display: block;
    width: 100%;
  }
}
@media screen and (max-width: 575px) {
  .post-info h2 {
    margin-top: 40px;
  }
  .post-info h2 + p {
    margin-top: 20px;
  }
}
.post-info img {
  height: 350px;
  width: 49%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
  margin-top: 20px;
}
@media screen and (max-width: 1600px) {
  .post-info img {
    height: 300px;
  }
}
@media screen and (max-width: 1399px) {
  .post-info img {
    height: 250px;
  }
}
@media screen and (max-width: 767px) {
  .post-info img {
    height: 200px;
  }
}
@media screen and (max-width: 575px) {
  .post-info img {
    height: 150px;
  }
}

@media screen and (max-width: 1199px) {
  .blog-right-post .similar-posts {
    grid-row: span 2;
  }
}

.mini-blog {
  margin-top: 50px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
.mini-blog a {
  display: block;
}
.mini-blog .mini-blog-post {
  display: grid;
  grid-template-columns: 1fr 2fr;
}
.mini-blog .mini-blog-post img {
  width: 100%;
  height: 100%;
  max-height: 160px;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
  border-radius: 16px;
}
.mini-blog .mini-blog-post .mini-blog-info {
  padding: 10px 0 10px 20px;
}
.mini-blog .mini-blog-post .mini-blog-info h3, .mini-blog .mini-blog-post .mini-blog-info span, .mini-blog .mini-blog-post .mini-blog-info p {
  color: #000;
}
.mini-blog .mini-blog-post .mini-blog-info span {
  font-family: "Jost", sans-serif;
  color: #6D7175;
  font-weight: 400;
  font-size: 20px;
}
.mini-blog .mini-blog-post .mini-blog-info p, .mini-blog .mini-blog-post .mini-blog-info h3 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mini-blog .mini-blog-post .mini-blog-info h3 {
  font-size: 24px;
  font-weight: 400;
  -webkit-line-clamp: 1;
  margin: 10px 0;
  letter-spacing: normal;
}
.mini-blog .mini-blog-post .mini-blog-info p {
  -webkit-line-clamp: 2;
  font-size: 16px;
  line-height: 26px;
}
@media screen and (max-width: 1399px) {
  .mini-blog .mini-blog-post .mini-blog-info h3 {
    font-size: 20px;
    letter-spacing: normal;
  }
  .mini-blog .mini-blog-post .mini-blog-info p {
    font-size: 14px;
    line-height: 24px;
  }
  .mini-blog .mini-blog-post .mini-blog-info span {
    font-size: 18px;
  }
}
.mini-blog .mini-blog-post:hover .mini-blog-info h3 {
  text-decoration: underline;
}
.mini-blog a:first-child {
  grid-row: span 3;
}
.mini-blog a:first-child .mini-blog-post {
  display: block;
  position: relative;
  height: 100%;
}
.mini-blog a:first-child .mini-blog-post img {
  position: absolute;
  top: 0;
  left: 0;
  max-height: unset;
}
.mini-blog a:first-child .mini-blog-post .mini-blog-info {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  justify-content: end;
  height: 100%;
  padding: 20px 50px;
  background-image: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 62%, rgba(0, 0, 0, 0.3) 71%, rgba(0, 0, 0, 0.5) 100%);
  border-radius: 16px;
}
.mini-blog a:first-child .mini-blog-post .mini-blog-info * {
  color: #fff;
}
@media screen and (max-width: 1399px) {
  .mini-blog {
    gap: 10px;
  }
}
@media screen and (max-width: 1199px) {
  .mini-blog {
    grid-template-columns: 1fr;
  }
  .mini-blog a:first-child .mini-blog-post {
    height: 400px;
  }
}
@media screen and (max-width: 575px) {
  .mini-blog .mini-blog-post .mini-blog-info {
    padding-left: 10px;
  }
  .mini-blog .mini-blog-post .mini-blog-info h3 {
    margin: 5px 0;
    letter-spacing: normal;
    font-size: 18px;
  }
  .mini-blog .mini-blog-post .mini-blog-info span {
    font-size: 16px;
  }
  .mini-blog a:first-child .mini-blog-post {
    height: 300px;
  }
  .mini-blog a:first-child .mini-blog-post .mini-blog-info {
    padding: 20px;
  }
}

.grey-bg-1 {
  background: linear-gradient(to right, rgba(19, 21, 24, 0.11) 0%, rgba(19, 21, 24, 0.11) 85%, transparent 85%, transparent 100%);
  padding: 100px 0 50px;
  padding-left: calc(50% - 700px);
  position: relative;
  margin-top: 100px;
}
.grey-bg-1 .about-text {
  width: 40%;
}
.grey-bg-1 .about-text h2 {
  text-align: left;
  margin-bottom: 30px;
}
.grey-bg-1 .about-text .red-btn {
  margin-top: 50px;
}
.grey-bg-1 .about-numbers {
  margin-top: 80px;
  display: flex;
  align-items: start;
  justify-content: space-between;
  width: 70%;
}
.grey-bg-1 .about-numbers span, .grey-bg-1 .about-numbers p {
  display: block;
  text-align: center;
  color: #000;
}
.grey-bg-1 .about-numbers span {
  font-size: 40px;
  font-weight: bold;
}
.grey-bg-1 .about-numbers p {
  font-weight: 500;
}
.grey-bg-1 img {
  position: absolute;
  right: 0;
  top: -100px;
  width: 43%;
  height: calc(80% + 100px);
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
  border-radius: 30px;
}
@media only screen and (max-width: 1600px) {
  .grey-bg-1 {
    padding-left: 10%;
    margin-top: 50px;
  }
  .grey-bg-1 .about-text {
    width: 50%;
  }
  .grey-bg-1 img {
    top: -50px;
    height: calc(75% + 50px);
    width: 40%;
  }
}
@media screen and (max-width: 991px) {
  .grey-bg-1 {
    padding-right: 10%;
    padding-top: 50px;
    margin-top: 0;
    background: linear-gradient(to right, rgba(19, 21, 24, 0.11) 0%, rgba(19, 21, 24, 0.11) 100%);
  }
  .grey-bg-1 img {
    display: none;
  }
  .grey-bg-1 .about-text, .grey-bg-1 .about-numbers {
    width: 100%;
  }
  .grey-bg-1 .about-numbers {
    margin-top: 50px;
  }
}
@media only screen and (max-width: 900px) {
  .grey-bg-1 {
    padding-left: 5%;
    padding-right: 5%;
  }
}
@media screen and (max-width: 767px) {
  .grey-bg-1 .about-numbers {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
  }
}

@media screen and (max-width: 991px) {
  .page-padding:has(.grey-bg-1) {
    padding-top: 0;
  }
}

.grey-bg-2 {
  background: linear-gradient(to left, rgba(19, 21, 24, 0.11) 0%, rgba(19, 21, 24, 0.11) 70%, transparent 70%, transparent 100%);
  padding: 50px 0;
}
@media screen and (max-width: 991px) {
  .grey-bg-2 {
    background: linear-gradient(to left, rgba(19, 21, 24, 0.11) 0%, rgba(19, 21, 24, 0.11) 100%);
  }
}

@media screen and (max-width: 991px) {
  .page-padding:has(.grey-bg-2) {
    padding-bottom: 0;
  }
}

.about-team {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 50px 0;
}
.about-team .team-mem {
  width: 32%;
  height: 350px;
  border-radius: 16px;
  overflow: hidden;
  position: relative;
  background-image: url("../images/Profila.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  display: flex;
  position: relative;
}
.about-team .team-mem::before{
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  background: rgb(0,0,0);
  background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(255,255,255,0) 80%);
  height: 100px;
  width: 100%;
  z-index: 1;
}
.about-team .team-mem img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
}
.about-team .team-mem .name {
  position: relative;
  z-index: 1;
  margin-top: auto;
  padding: 20px;
}
.about-team .team-mem .name p, .about-team .team-mem .name span {
  color: #fff;
  letter-spacing: normal;
}
.about-team .team-mem .name span {
  font-family: "Jost", sans-serif;
  font-size: 16px;
}
@media screen and (max-width: 575px) {
  .about-team .team-mem .name span {
    font-size: 14px;
  }
}
@media only screen and (max-width: 1600px) {
  .about-team .team-mem {
    height: 270px;
    width: 30%;
  }
}
@media screen and (max-width: 1399px) {
  .about-team .team-mem {
    height: 250px;
    width: 32%;
  }
}
@media screen and (max-width: 767px) {
  .about-team {
    flex-direction: column;
  }
  .about-team .team-mem {
    width: 100%;
    max-width: 450px;
    height: 300px;
  }
  .about-team .team-mem + .team-mem {
    margin-top: 20px;
  }
}
@media screen and (max-width: 575px) {
  .about-team .team-mem {
    height: 30vh;
  }
}

.resilts-bg {
  padding: 100px 0;
  position: relative;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
}
.resilts-bg::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
}
.resilts-bg .page-width {
  position: relative;
  z-index: 1;
}
.resilts-bg h2 {
  color: #fff;
}
.resilts-bg .results {
  margin-top: 50px;
  display: flex;
  align-items: start;
  justify-content: space-around;
}
@media screen and (max-width: 575px) {
  .resilts-bg .results {
    flex-direction: column;
    align-items: center;
  }
  .resilts-bg .results > div + div {
    margin-top: 30px;
  }
}
.resilts-bg .results span, .resilts-bg .results p {
  display: block;
  text-align: center;
}
.resilts-bg .results span {
  font-size: 60px;
  font-weight: 400;
  color: #A28E6A;
  letter-spacing: normal;
}
@media screen and (max-width: 1600px) {
  .resilts-bg .results span {
    font-size: 50px;
  }
}
@media screen and (max-width: 1399px) {
  .resilts-bg .results span {
    font-size: 40px;
  }
}
@media screen and (max-width: 575px) {
  .resilts-bg .results span {
    font-size: 30px;
  }
}
.resilts-bg .results h3,
.resilts-bg .results p {
  color: #fff;
  letter-spacing: normal;
  font-size: 35px;
  margin-top: 30px;
  text-align: center;
}
@media screen and (max-width: 1600px) {
  .resilts-bg .results h3,
  .resilts-bg .results p {
    font-size: 30px;
  }
}
@media screen and (max-width: 1399px) {
  .resilts-bg .results p {
    font-size: 25px;
    margin-top: 15px;
  }
}
@media screen and (max-width: 575px) {
  .resilts-bg .results p {
    font-size: 20px;
    margin-top: 10px;
  }
}

.recenzija {
  max-width: 900px;
  margin: 40px auto 20px;
}
.recenzija .content {
  margin-bottom: 20px;
  padding-top: 70px;
  position: relative;
}
.recenzija .content::before {
  position: absolute;
  content: "";
  width: 70px;
  height: 50px;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  background-image: url("../images/ikone/navodnici-zlatni.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
.recenzija .content p {
  font-size: 28px;
  font-weight: 500;
  color: #131518;
  text-align: center;
}
@media screen and (max-width: 575px) {
  .recenzija .content p {
    font-size: 22px;
  }
}
.recenzija p, .recenzija span {
  display: block;
  text-align: center;
  font-size: 22px;
  font-weight: 500;
  font-family: "Jost", sans-serif;
}
.recenzija span {
  color: #636363;
  margin-top: 10px;
}

.recenzije-tabs {
  margin-top: 40px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
}
.recenzije-tabs img {
  width: 90px;
  height: 90px;
  border-radius: 50%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
  opacity: 0.3;
  cursor: pointer;
}
@media screen and (max-width: 1399px) {
  .recenzije-tabs img {
    width: 70px;
    height: 70px;
  }
}
.recenzije-tabs .active {
  opacity: 1;
}
.recenzije-tabs img + img {
  margin-left: 20px;
}

.servicesSwiper {
  overflow: visible;
  margin-top: 50px;
  margin-bottom: 100px;
}
.servicesSwiper .swiper-wrapper .swiper-slide {
  background: linear-gradient(to right, rgba(19, 21, 24, 0.11) 0%, rgba(19, 21, 24, 0.11) 85%, transparent 85%, transparent 100%);
}
.servicesSwiper .swiper-wrapper .swiper-slide .grey-slide {
  padding: 100px 10% 150px;
  position: relative;
  height: 100%;
}
@media only screen and (max-width: 900px) {
  .servicesSwiper .swiper-wrapper .swiper-slide .grey-slide {
    padding: 100px 5% 150px;
  }
}
@media screen and (max-width: 767px) {
  .servicesSwiper .swiper-wrapper .swiper-slide .grey-slide {
    padding: 100px 5%;
  }
}
@media screen and (max-width: 575px) {
  .servicesSwiper .swiper-wrapper .swiper-slide .grey-slide {
    padding: 50px 5% 100px;
  }
}
.servicesSwiper .swiper-wrapper .swiper-slide .grey-slide .service-text {
  width: 50%;
}
.servicesSwiper .swiper-wrapper .swiper-slide .grey-slide .service-text h2 {
  text-align: left;
  margin-bottom: 40px;
}
.servicesSwiper .swiper-wrapper .swiper-slide .grey-slide .service-text ul {
  list-style-position: inside;
}
.servicesSwiper .swiper-wrapper .swiper-slide .grey-slide .service-text p {
  margin-top: 20px;
}
.servicesSwiper .swiper-wrapper .swiper-slide .grey-slide .service-text p, .servicesSwiper .swiper-wrapper .swiper-slide .grey-slide .service-text ul li {
  font-size: 16px;
  line-height: 26px;
}
.servicesSwiper .swiper-wrapper .swiper-slide .grey-slide .service-text .red-btn {
  margin-top: 40px;
}
.servicesSwiper .swiper-wrapper .swiper-slide .grey-slide img {
  position: absolute;
  top: -50px;
  right: 0;
  width: 45%;
  height: 80%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
  border-radius: 30px;
}
@media screen and (max-width: 1199px) {
  .servicesSwiper .swiper-wrapper .swiper-slide .grey-slide img {
    display: none;
  }
  .servicesSwiper .swiper-wrapper .swiper-slide .grey-slide .service-text {
    width: 100%;
  }
}
.servicesSwiper .swiper-wrapper .swiper-slide:first-child {
  background: linear-gradient(to left, rgba(19, 21, 24, 0.11) 0%, rgba(19, 21, 24, 0.11) 85%, transparent 85%, transparent 100%);
}
.servicesSwiper .swiper-wrapper .swiper-slide:first-child .grey-slide .service-text {
  margin-left: auto;
}
.servicesSwiper .swiper-wrapper .swiper-slide:first-child .grey-slide .service-text ul {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
}
@media screen and (max-width: 575px) {
  .servicesSwiper .swiper-wrapper .swiper-slide:first-child .grey-slide .service-text ul {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}
.servicesSwiper .swiper-wrapper .swiper-slide:first-child .grey-slide .service-text ul li {
  font-family: "Jost", sans-serif;
  /* letter-spacing: normal; */
}
@media screen and (max-width: 1600px) {
  .servicesSwiper .swiper-wrapper .swiper-slide:first-child .grey-slide .service-text ul li {
    letter-spacing: normal;
  }
}
.servicesSwiper .swiper-wrapper .swiper-slide:first-child .grey-slide img {
  right: unset;
  left: 0;
}
.servicesSwiper .swiper-wrapper .swiper-slide:nth-child(2) {
  background: linear-gradient(to left, rgba(19, 21, 24, 0.11) 0%, rgba(19, 21, 24, 0.11) 100%);
}
.servicesSwiper .service-button-next, .servicesSwiper .service-button-prev {
  width: 80px;
  height: 50px;
  background-image: url("../images/ikone/slajder.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  bottom: 40px;
  cursor: pointer;
  z-index: 2;
}
.servicesSwiper .service-button-next {
  right: 10%;
}
.servicesSwiper .service-button-prev {
  transform: rotate(180deg);
  left: 10%;
}
.servicesSwiper .swiper-button-disabled {
  display: none;
}
.servicesSwiper .swiper-pagination {
  bottom: 40px;
}
.servicesSwiper .swiper-pagination .swiper-pagination-bullet {
  background-color: transparent;
  border: 1px solid #A28E6A;
  opacity: 1;
  width: 12px;
  height: 12px;
  margin: 0 8px;
}
.servicesSwiper .swiper-pagination .swiper-pagination-bullet-active {
  background-color: #A28E6A;
}
@media screen and (max-width: 1199px) {
  .servicesSwiper {
    background-color: rgba(19, 21, 24, 0.11);
    margin-top: 0;
    margin-bottom: 50px;
  }
  .servicesSwiper .swiper-wrapper .swiper-slide {
    background: transparent !important;
  }
}
@media screen and (max-width: 767px) {
  .servicesSwiper .service-button-next, .servicesSwiper .service-button-prev {
    display: none;
  }
}

.team-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  -moz-column-gap: 15px;
       column-gap: 15px;
  row-gap: 30px;
  margin: 50px 0 0;
}
.team-grid .team-member img {
  width: 100%;
  height: 400px;
  border-radius: 16px;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
}
.team-grid .team-member span {
  display: block;
  font-weight: bold;
  font-size: 28px;
}
.team-grid .team-member span, .team-grid .team-member p {
  text-align: center;
}
@media screen and (max-width: 1600px) {
  .team-grid {
    -moz-column-gap: 10px;
         column-gap: 10px;
  }
  .team-grid .team-member img {
    height: 350px;
  }
  .team-grid .team-member span {
    font-size: 26px;
  }
}
@media screen and (max-width: 1399px) {
  .team-grid .team-member img {
    height: 300px;
  }
  .team-grid .team-member span {
    font-size: 22px;
  }
}
@media screen and (max-width: 1199px) {
  .team-grid {
    grid-template-columns: 1fr 1fr;
    max-width: 530px;
    margin: 50px auto 0;
  }
}
@media screen and (max-width: 575px) {
  .team-grid {
    grid-template-columns: 1fr;
    max-width: 300px;
  }
}

.team2 {
  position: relative;
  padding: 150px 0 50px;
}
.team2 img {
  position: absolute;
  width: 50%;
  height: -webkit-fill-available;
  top: -70px;
  bottom: -20px;
  right: 0;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
}
.team2 .team-text {
  width: 40%;
}
.team2 .team-text h2 {
  text-align: left;
}
.team2 .team-papers {
  flex-direction: column;
  padding: 0;
  margin: 70px 0 50px;
}
@media screen and (max-width: 575px) {
  .team2 .team-papers {
    margin: 50px 0;
  }
}
.team2 .team-papers .add + .add {
  margin-left: 0;
  margin-top: 20px;
}
.team2 .team-papers .add {
  padding-top: 0;
  padding-left: 70px;
  align-items: start;
}
.team2 .team-papers .add::before {
  top: -10px;
  left: 0;
  width: 50px;
  height: 50px;
  background-size: 100%;
  transform: none;
}
.team2 .team-papers .add span, .team2 .team-papers .add p {
  text-align: left;
}
.team2 .team-papers .add span {
  margin-top: 0;
  font-size: 30px;
}
@media screen and (max-width: 1600px) {
  .team2 .team-papers .add span {
    font-size: 28px;
  }
}
@media screen and (max-width: 1399px) {
  .team2 .team-papers .add span {
    font-size: 24px;
  }
}
@media screen and (max-width: 575px) {
  .team2 .team-papers .add span {
    font-size: 22px;
  }
}
.team2 .team-papers .add p {
  max-width: 350px;
}
@media screen and (max-width: 1600px) {
  .team2 {
    padding: 100px 0 50px;
  }
}
@media screen and (max-width: 991px) {
  .team2 {
    padding: 50px 0;
  }
  .team2 img {
    display: none;
  }
  .team2 .team-text {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .team2 .team-papers .add {
    margin-left: 0;
  }
}

@media screen and (max-width: 991px) {
  .page-padding:has(.team2) {
    padding: 0;
  }
}

.search-wrap {
  background-color: #fff;
  border-radius: 16px;
  /* padding: 25px 50px; */
  padding: 25px 25px;
}
@media screen and (max-width: 575px) {
  .search-wrap {
    padding: 40px 20px;
  }
}

.search1, .search2, .search {
  background-color: #0C2956;
  border-radius: 12px;
  height: 50px;
  border: none;
}

.search1, .search2 {
  width: 50px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 40%;
}

.search1 {
  background-image: url("../images/ikone/pretraga.svg");
}

.search2 {
  background-image: url("../images/ikone/pretraga-mala.svg");
  background-size: 30%;
}

.search {
  display: flex;
  align-items: center;
  opacity: 0.8;
  color: #fff;
  font-family: "Jost", sans-serif;
  font-weight: 400;
  font-size: 16px;
  padding: 0 40px;
  padding-left: 60px;
  background-image: url("../images/ikone/pretraga.svg");
  background-position: 30px;
  background-repeat: no-repeat;
  background-size: 20px;
  width: 100%;
}

.property-search {
  display: grid;
  grid-template-columns: 20% 1fr;
  gap: 20px;
  margin-top: -150px;
  position: relative;
}
@media only screen and (max-width: 1600px) {
  .property-search {
    gap: 10px;
    margin-top: -100px;
  }
}
@media screen and (max-width: 1399px) {
  .property-search {
    grid-template-columns: 1fr;
    gap: 40px;
  }
}
@media screen and (max-width: 991px) {
  .property-search {
    margin-top: -80px;
  }
}
@media screen and (max-width: 767px) {
  .property-search {
    margin-top: -50px;
    gap: 20px;
  }
}
@media screen and (max-width: 575px) {
  .property-search {
    margin-top: -20px;
  }
}
.property-search .property-search-left {
  padding-right: 20px;
  border-right: 1px solid rgba(0, 0, 0, 0.2);
  display: grid;
  row-gap: 50px;
}
@media only screen and (max-width: 1600px) {
  .property-search .property-search-left {
    padding-right: 10px;
    row-gap: 30px;
  }
}
.property-search .property-search-left p {
  font-family: "Jost", sans-serif;
  font-size: 19px;
  letter-spacing: normal;
}
.property-search .property-search-left form {
  display: flex;
  align-items: center;
}
.property-search .property-search-left form button {
  margin-left: 20px;
  width: 100%;
  max-width: 50px;
}
@media only screen and (max-width: 1600px) {
  .property-search .property-search-left form button {
    margin-left: 10px;
  }
}
@media screen and (max-width: 1399px) {
  .property-search .property-search-left {
    row-gap: 20px;
    padding-right: 0;
    border-right: none;
  }
  .property-search .property-search-left p {
    order: 1;
  }
  .property-search .property-search-left form {
    order: 2;
  }
}
@media screen and (max-width: 767px) {
  .property-search .property-search-left {
    row-gap: 30px;
  }
}
.property-search .property-search-right form {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  -moz-column-gap: 20px;
       column-gap: 20px;
  row-gap: 50px;
}
.property-search .property-search-right form .final-search {
  display: flex;
  align-items: center;
}
.property-search .property-search-right form .final-search .search2 {
  margin-right: 10px;
}
@media only screen and (max-width: 1600px) {
  .property-search .property-search-right form {
    -moz-column-gap: 10px;
         column-gap: 10px;
    row-gap: 40px;
  }
}
@media screen and (max-width: 1199px) {
  .property-search .property-search-right form {
    grid-template-columns: repeat(4, 1fr);
    position: relative;
  }
  .property-search .property-search-right form .final-search {
    position: absolute;
    right: 0;
    bottom: 0;
  }
}
@media screen and (max-width: 991px) {
  .property-search .property-search-right form {
    grid-template-columns: 1fr 1fr 1fr;
    padding-bottom: 90px;
  }
}
@media screen and (max-width: 767px) {
  .property-search .property-search-right form {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}

.search-form {
  /* The container must be positioned relative: */
  /* Style the arrow inside the select element: */
  /* Point the arrow upwards when the select box is open (active): */
  /* style the items (options), including the selected item: */
  /* Style items (options): */
  /* Hide the items when the select box is closed: */
}
.search-form input::-moz-placeholder {
  font-family: "Jost", sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: #808080;
}
.search-form input, .search-form input::placeholder {
  font-family: "Jost", sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: #808080;
}
.search-form input {
  outline: none;
}
.search-form .custom-select {
  position: relative;
  font-family: "Jost", sans-serif;
  height: 50px;
}
.search-form .custom-select select {
  display: none; /*hide original SELECT element: */
}
.search-form .select-selected, .search-form input {
  background-color: #fff;
}
.search-form .select-selected:after {
  position: absolute;
  content: "";
  top: 50%;
  transform: translateY(-50%);
  right: 10px;
  width: 12px;
  height: 12px;
  background-image: url("../images/ikone/padajuci.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100%;
}
.search-form .select-items div, .search-form .select-selected, .search-form input {
  color: #808080;
  padding: 8px 16px;
  cursor: pointer;
  font-family: "Jost", sans-serif;
  font-size: 16px;
  font-weight: 400;
}
.search-form .select-selected, .search-form input {
  border: 1px solid rgba(128, 128, 128, 0.5);
  border-radius: 12px;
  width: 100%;
  height: 50px;
  display: flex;
  align-items: center;
}
.search-form .select-items {
  position: absolute;
  border: 1px solid rgba(128, 128, 128, 0.5);
  background-color: #fff;
  top: 100%;
  left: 0;
  width: 100%;
  z-index: 9;
  border-radius: 12px;
  overflow: hidden;
}
.search-form .select-hide {
  display: none;
}
.search-form .select-items div:hover, .search-form .same-as-selected {
  background-color: rgba(19, 21, 24, 0.11);
}

.home-search, .home-search2 {
  padding: 25px;
}
@media only screen and (max-width: 1600px) {
  .home-search, .home-search2 {
    padding: 20px;
  }
}

.home-search {
  margin-top: 120px;
}
.home-search form {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 15px;
}
.home-search form .final-search {
  display: flex;
  align-items: center;
}
.home-search form .final-search .search2 {
  margin-right: 15px;
}
@media only screen and (max-width: 1600px) {
  .home-search {
    margin-top: 100px;
  }
}
@media screen and (max-width: 1399px) {
  .home-search form {
    gap: 5px;
  }
  .home-search form .final-search .search2 {
    margin-right: 5px;
  }
}
@media screen and (max-width: 1199px) {
  .home-search {
    margin-top: 150px;
  }
  .home-search form {
    grid-template-columns: 1fr 1fr 1fr;
    gap: 20px;
  }
  .home-search form .final-search .search, .home-search form .final-search .search2 {
    width: 100%;
  }
  .home-search form .final-search .search2 {
    max-width: 50px;
  }
}
@media screen and (max-width: 767px) {
  .home-search form {
    grid-template-columns: 1fr;
  }
}

.home-search2 {
  max-width: 350px;
  margin: 50px auto 0;
}
.home-search2 form {
  display: flex;
  align-items: center;
}
.home-search2 form button {
  margin-left: 15px;
  width: 100%;
  max-width: 50px;
}
@media screen and (max-width: 1399px) {
  .home-search2 {
    margin: 30px auto 0;
  }
}/*# sourceMappingURL=main.css.map */





.multiple-select-form ul {
  border-top: none;
  box-shadow: none;
  background: white;
  position: relative;
  transform: none;
  left: 0;
  top: 0;
  width: 100%;
  height: -moz-max-content;
  height: max-content;
  max-height: 300px;
  border: 1px solid rgba(71, 71, 71, 0.4);
  z-index: 2;
  background-color: white;
  overflow-y: auto;
  margin: 0;
  /* border-radius: 12px; */
}
.multiple-select-form ul li {
  padding: 5px 10px;
  display: flex;
}
.multiple-select-form ul li label {
  color: #474747;
  padding-left: 5px;
  cursor: pointer;
  display: block;
  width: 100%;
}

.multiple-select-form ul li input {
  height: auto !important;
  width: auto !important;
}

.multiple-select-form {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  width: 100%;
  max-width: 290px;
  /* background-color: #f1f1f1; */
  font-size: 15px;

  position: relative;
  cursor: pointer;
}
@media screen and (max-width: 991px) {
  .multiple-select-form {
    max-width: 100%;
  }
}
.multiple-select-form summary {
  padding: 10px;
  padding-right: 35px;
  font-size: 15px;
  font-weight: 400;
  color: #474747;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  list-style: none;
  background-image: url("../images/ikone/padajuci.svg");
  background-repeat: no-repeat;
  background-position: calc(100% - 10px);
  white-space: nowrap;


  border: 1px solid rgba(128, 128, 128, 0.5);
  border-radius: 12px;
  width: 100%;
  height: 50px;
  display: flex;
  align-items: center;
}
.multiple-select-form .dropdown-list {
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
  transform: translateX(-50%);
  position: absolute;
  top: 50px;
  left: 50%;
  width: 100%;
  z-index: 2;
  background: transparent;
  /* border-radius: 12px; */
  
}
.multiple-select-form .dropdown-list .list-search-wrapper {
  border: 1px solid rgba(71, 71, 71, 0.4);
  height: 50px;
  width: 100%;
  font-size: 14px;
  font-weight: 400;
  color: #07000d;
  padding: 10px;
  border-bottom: none;
  background: white;
}
.multiple-select-form .dropdown-list .list-search-wrapper .list-search {
  height: 100%;
  width: 100%;
  border: 1px solid rgba(71, 71, 71, 0.4);
  outline: none;
  padding: 5px;
}



.dropdown-price-list .price-group {
  background: white;
    display: flex;
    align-items: center;
}
.dropdown-price-list .price-group input {
  border: none;
}

@media screen and (min-width: 769px) {
  .dropdown-price-list {
    width: 200% !important;
  }
}


h2.news-title span {
  opacity: 0.5;
}

.no-results {
  grid-column: span 4;
}
.no-results {
  padding-top: 50px;
  padding-bottom: 30px;
  display: flex;
  align-items: center;
  flex-direction: column;
}
.no-results .icon {
  background-color: #0C2956;
  border-radius: 50%;
  width: 25px;
  height: 25px;
  color: white;
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-size: 17px;
}
.no-results span {
  margin-top: 10px;
  font-weight: 600;
  font-size: 17px;
}

details:disabled, details[disabled] {
  opacity: 0.5;
  pointer-events: none;
}


.page-h1 {
  margin-top: 80px;
}
@media screen and (max-width: 1199px) {
  .page-h1 {
    margin-top: 0px;
  }
}

.details-grid .details-info .check-list.no-image li {
  padding-left: 0;
}
.details-grid .details-info .check-list.no-image li::before {
  display: none;
}


.property-gallery a.sold img {
  filter: blur(5px);
}



.property-gallery .center-sold {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  color: #fff;
  font-size: 40px;
  font-weight: 400;
  letter-spacing: normal;
  z-index: 2;
}
.property-gallery .center-sold {
  display: flex;
  align-items: center;
  justify-content: center;
}


@media screen and (max-width: 768px) {
  .property-gallery .center-sold {
    top: 20px;
    left: 20px;
    width: auto;
    height: auto;
  }
}

.home-url {
  display: flex;
  justify-content: center;
  text-align: center;
}

.details-grid .agent.mobile {
  display: none;
  position: static;
}

@media screen and (max-width: 1199px) {
  .details-grid .agent.mobile {
    display: block;
  }
  .details-grid .agent.desktop {
    display: none;
  }
}


.section-reviews .panel {
  display: none;
}
.section-reviews .panel.active {
  display: block;
}

.details-grid .details-info .estate-desc ul,
.details-grid .details-info .estate-desc ol {
  list-style: inside;
}



.files-wrapper a {
  display: flex;
  align-items: center;
  margin-top: 20px;
  font-size: 20px;
  color: #000;
  transition: all 0.5s;
}
.files-wrapper a:hover {
  color: #A28E6A;
}
.files-wrapper a svg {
  margin-right: 10px;
}

.estate-desc a {
  color: #0C2956;
}

.badge-img{
  width: 100%;
  max-width: 100px;
  height: 150px;
margin-left: auto;
margin-right: auto;
display: block;
margin-bottom: 30px;
}

.badge-img img{
  object-fit: contain;
  object-position: center;
}

@media only screen and (max-width: 576px){
  .badge-img{
    max-width: 80px;
    height: 130px;
  }

  .badge-img img{
    width: 100%;
    height: 100%;
  }
}
/* Investment Montenegro – boje banera za kolacice */
#cc-main {
  --cc-btn-primary-bg: #0C2956;
  --cc-btn-primary-border-color: #0C2956;
  --cc-btn-primary-color: #fff;
  --cc-btn-primary-hover-bg: #A28E6A;
  --cc-btn-primary-hover-border-color: #A28E6A;
  --cc-toggle-on-bg: #0C2956;
  --cc-link-color: #0C2956;
}


/* ===== Faza 4 - tipografija (Investment Montenegro) =====
   Tekst: Jost 400 (dugmad i istaknuto 500). Naslovi: EB Garamond 400 (do 2026-10-21 Cormorant Garamond 500; EB Garamond 500 je bio pretežak).
   Bez letter-spacinga. Garamond ima "stare" (spustene) cifre - lining-nums daje poravnate (cijene, m2, brojke). */
h1, h2, h3, h4, h5, h6 {
  font-family: "EB Garamond", Georgia, serif;
  font-weight: 400;
  letter-spacing: normal;
  font-variant-numeric: lining-nums;
}
.bold-heading h1, .bold-heading h2,
.dark-container-text h2,
.blog-post .blog-info h3,
.similar-posts h2, .tags h2, .share h2,
.small-posts .post .post-info h3,
.blog-post-cover .cover-text h1 {
  font-family: "EB Garamond", Georgia, serif;
  font-weight: 400;
}
.property .property-info .property-title,
.property .property-info .bottom-info .price,
.property-gallery a .property-details .property-price,
.home-papers .add span,
.team2 .team-papers .add span,
.home-about .numbers span,
.grey-bg-1 .about-numbers span,
.resilts-bg .results span,
.property .property-img .center-sold,
.property-gallery .center-sold,
.contact-wrap .contact-bg .contact-social p,
footer .footer-text p,
footer .footer-nav li a {
  font-family: "EB Garamond", Georgia, serif;
  font-weight: 400;
  font-variant-numeric: lining-nums;
}
/* oznake ispod brojki su h3, ali se citaju kao tekst */
.home-about .numbers h3 {
  font-family: "Jost", sans-serif;
  font-weight: 400;
}
.small-posts .post .post-info span {
  font-weight: 400;
}
.more,
.tags .tab span {
  font-weight: 500;
}
/* Garamond pri istoj velicini djeluje sitnije - naslov na naslovnoj, kartice i brojke malo veci */
.headline h1 {
  font-size: 64px;
  line-height: 1.15;
}
.headline p {
  font-size: 20px;
}
.property .property-info .property-title {
  font-size: 24px;
  line-height: 1.25;
}
.property .property-info .bottom-info .price {
  font-size: 26px;
}
.home-about .numbers span,
.grey-bg-1 .about-numbers span {
  font-size: 52px;
}
.home-papers .add p {
  line-height: 1.45;
}
@media screen and (max-width: 1600px) {
  .home-about .numbers span {
    font-size: 46px;
  }
}
@media screen and (max-width: 1399px) {
  .headline h1 {
    font-size: 52px;
  }
  .property .property-info .property-title {
    font-size: 22px;
  }
  .property .property-info .bottom-info .price {
    font-size: 24px;
  }
  .home-about .numbers span,
  .grey-bg-1 .about-numbers span {
    font-size: 40px;
  }
}
@media screen and (max-width: 575px) {
  .headline h1 {
    font-size: 38px;
  }
  .headline p {
    font-size: 16px;
  }
  .property .property-info .bottom-info .price {
    font-size: 21px;
  }
}
/* baner za kolacice */
#cc-main {
  --cc-font-family: "Jost", sans-serif;
}

/* ===== Faza 4 - sadrzaj ===== */
/* O nama: podnaslovi u tekstu iz admina (h3) – crni kao ostali naslovi (2026-10-20, ranije plavi) */
.about-text h3 {
  font-size: 30px;
  line-height: 1.2;
  color: #000;
  margin: 35px 0 12px;
}
/* Rent a car / Limo (sablon Usluge): uvodni tekst u citljivoj sirini + dugme za kontakt */
.services-intro h2 {
  margin-bottom: 30px;
}
.services-intro > p {
  max-width: 920px;
  margin-left: auto;
  margin-right: auto;
}
.services-intro .services-cta {
  margin-top: 40px;
}
@media screen and (max-width: 1399px) {
  .about-text h3 {
    font-size: 26px;
  }
}
@media screen and (max-width: 575px) {
  .about-text h3 {
    font-size: 23px;
    margin-top: 25px;
  }
}

/* ===== Faza 4 - tamne povrsine u boji logotipa (2026-10-20, Jelena: ostaje) ===== */
/* Umjesto tamno sive (#222222, #232323) tamnoplava iz logotipa (#0C2956); umjesto skoro crne (#131518) za
   footer i Kontakt tamnija nijansa iste plave. Vracanje na sivu: obrisati ovaj blok (i povecati ?v= u head.php). */
.dark-bg, .properties-home, .dark-container {
  background-color: #0C2956;
}
footer, .contact-wrap {
  background-color: #081D3C;
}
.home-about .numbers {
  background-color: rgba(8, 29, 60, 0.9);
}

/* ===== Faza 4 - uvodni video na telefonu (2026-10-21) =====
   Naslovna je na telefonu visoka (~390x1200, pretraga ispod naslova), pa bi vodoravni video preko cijele visine bio
   uvelican i do 7x (mutan). Video pokriva samo prvi ekran i blago prelazi u tamnoplavu pozadinu. */
@media screen and (max-width: 767px) {
  .home-background {
    background-color: #0C2956;
  }
  .home-background .background-video {
    height: 100vh;
    height: 100svh;
    bottom: auto;
    -webkit-mask-image: linear-gradient(to bottom, #000 78%, transparent 100%);
            mask-image: linear-gradient(to bottom, #000 78%, transparent 100%);
  }
}

/* ===== Faza 4 - nove ikonice (2026-10-21) =====
   Ikonice u kodu (header, footer, Kontakt) su fill="currentColor"; na velikom ekranu ih boje postojeca pravila
   (svg path), a u meniju na telefonu nema pravila - bez ovoga bi bile plave (boja linka). */
.head .header-social a {
  color: #0C2956;
}

/* ===== Faza 4 - ikonice mreza, telefona, mejla i jezika (2026-10-21, varijanta C) =====
   Mreze: zvanicni logotipi (Simple Icons, CC0, svg.ikona-glif); telefon, mejl, jezik: linije (Lucide, ISC,
   svg.ikona-linija). Header: tamnoplave kao ostatak headera (Jelena: zlatne su odskakale), na prelaz misem zlatne;
   bijele preko fotografije (prelaz: zlatne). Footer, Kontakt i dijeljenje na blogu: logotip u tankom zlatnom krugu. */
.head .header-social a {
  color: #0C2956;
}
.head .header-social a svg.ikona-glif path {
  fill: #0C2956;
  transition: fill 0.3s;
}
.head .header-social a svg.ikona-linija,
.head .header-social a svg.ikona-linija path {
  fill: none;
  stroke: #0C2956;
  transition: stroke 0.3s;
}
.head .header-social a:hover svg.ikona-glif path {
  fill: #A28E6A;
}
.head .header-social a:hover svg.ikona-linija,
.head .header-social a:hover svg.ikona-linija path {
  stroke: #A28E6A;
}
/* preko fotografije/videa (prozirni header) - bijele kao meni, zlatne na prelaz misem. Samo na racunaru (kao
   Kaminova white-header pravila): na <=1199px ikonice su u bijelom meniju i bile su nevidljive na stranicama sa
   fotografijom u zaglavlju dok se ne skroluje (korekcija 2026-10-21). */
@media screen and (min-width: 1200px) {
  .white-header .head .header-social a svg.ikona-glif path {
    fill: #fff;
  }
  .white-header .head .header-social a svg.ikona-linija,
  .white-header .head .header-social a svg.ikona-linija path {
    stroke: #fff;
  }
  .white-header .head .header-social a:hover svg.ikona-glif path {
    fill: #A28E6A;
  }
  .white-header .head .header-social a:hover svg.ikona-linija,
  .white-header .head .header-social a:hover svg.ikona-linija path {
    stroke: #A28E6A;
  }
}
/* poslije skrola header postaje bijel (small-header uz white-header) - opet tamnoplave */
.black-header .head .header-social a svg.ikona-glif path,
.small-header .head .header-social a svg.ikona-glif path {
  fill: #0C2956;
}
.black-header .head .header-social a svg.ikona-linija,
.black-header .head .header-social a svg.ikona-linija path,
.small-header .head .header-social a svg.ikona-linija,
.small-header .head .header-social a svg.ikona-linija path {
  stroke: #0C2956;
}
.black-header .head .header-social a:hover svg.ikona-glif path,
.small-header .head .header-social a:hover svg.ikona-glif path {
  fill: #A28E6A;
}
.black-header .head .header-social a:hover svg.ikona-linija,
.black-header .head .header-social a:hover svg.ikona-linija path,
.small-header .head .header-social a:hover svg.ikona-linija,
.small-header .head .header-social a:hover svg.ikona-linija path {
  stroke: #A28E6A;
}
.social a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border: 1px solid #A28E6A;
  border-radius: 50%;
  transition: background-color 0.3s;
}
.social a svg {
  transform: none;
  width: 24px;
  height: 24px;
}
.social a svg.ikona-glif path {
  fill: #fff;
  transition: fill 0.3s;
}
.social a:hover {
  background-color: #A28E6A;
}
.social a:hover svg.ikona-glif path {
  fill: #0C2956;
}
.share .social a svg.ikona-glif path {
  fill: #0C2956;
}
.share .social a:hover svg.ikona-glif path {
  fill: #fff;
}
@media screen and (max-width: 575px) {
  .social a {
    width: 44px;
    height: 44px;
  }
  .social a svg {
    width: 20px;
    height: 20px;
  }
}

/* ===== Faza 4 - slika agenta u okviru "Posaljite upit" (2026-10-21) =====
   Slika je u flex redu pored imena; dugo ime + telefon su je suzavali u elipsu (i kod Kamina) - ne smije se skupljati. */
.details-grid .agent .agent-info .agent-img {
  flex-shrink: 0;
}
/* telefon agenta u posebnom redu ispod imena (estate-details, O nama, Nas tim; agentImeTelefon) - nikad prelomljen */
.agent-tel,
.details-grid .agent .agent-info .agent-name .agent-tel {
  color: inherit;
  white-space: nowrap;
  text-decoration: none;
}

/* ===== Faza 4 - meni u headeru na laptopu (2026-10-21) =====
   "Rent a car / Limo servis" je duze od Kaminovog "Usluge", pa se na 1200-1365 i 1400-1430 px meni prelamao u dva
   reda ("O nama", "Nas tim" i dr.). Tu malo sitnija slova (16 / 18 px umjesto 18 / 20) i manji razmak; logo ostaje
   iste velicine. Provjera: node alati/meni.mjs <url> (prelom i razmak logo-meni na vise sirina). */
@media screen and (min-width: 1200px) and (max-width: 1365px) {
  .head .nav li {
    margin-left: 20px;
  }
  .head .nav li a {
    font-size: 16px;
    white-space: nowrap;
  }
}
@media screen and (min-width: 1366px) and (max-width: 1499px) {
  .head .nav li a {
    font-size: 18px;
    white-space: nowrap;
  }
}

/* ===== Faza 4 - korekcije na telefonu (2026-10-21, Aleksandar) =====
   Naslovna: razmak izmedju pretrage i "Najnovije nekretnine" upola manji (150 -> 75 px; naslov sekcije zadrzava svoj
   razmak 50 px, skracen je donji razmak uvodne sekcije). Na telefonima sa necijelim odnosom piksela (npr. 2,625) se na
   granici te dvije tamnoplave sekcije vidjela tanka svijetla linija - sekcija sa nekretninama prelazi 1 px preko. */
.properties-home {
  margin-top: -1px;
}
@media screen and (max-width: 575px) {
  .home-background {
    padding-bottom: 25px;
  }
}
/* footer: Prodaja / Izdavanje / Blog / Kontakt u dvije kolone, poravnate uz tanku zlatnu liniju po sredini */
@media screen and (max-width: 767px) {
  footer .footer-nav {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    max-width: 340px;
    margin: -10px auto; /* razmak iznad i ispod ostaje kao ranije (li ima 10 px gore i dolje zbog neprekinute linije) */
  }
  footer .footer-nav li + li {
    margin: 0;
  }
  footer .footer-nav li {
    padding: 10px 0;
  }
  footer .footer-nav li:nth-child(odd) {
    text-align: right;
    padding-right: 24px;
    border-right: 1px solid #A28E6A;
  }
  footer .footer-nav li:nth-child(even) {
    text-align: left;
    padding-left: 24px;
  }
}
/* copyright "(c) 2026 Investment Montenegro. All Rights Reserved. Powered by Web Center" (ranije "(c) 2026 Web Center.
   All Rights Reserved."): prelama se samo izmedju recenica; red sa Kolacici | Politika privatnosti treba ~770 px, pa je
   do 991 px raspored kao na telefonu (linkovi iznad, copyright ispod) */
footer .copyright p span {
  white-space: nowrap;
}
@media screen and (max-width: 991px) {
  footer .copyright {
    flex-direction: column-reverse;
  }
  footer .copyright ul {
    margin-bottom: 10px;
  }
  footer .copyright ul li:first-child {
    margin-left: 0;
    padding-left: 0;
    border-left: none;
  }
}