/*
Theme Name: Astra Child
Description: Child theme for Astra
Author: Z.design
Author URI: https://zlatko.design/
Template: astra
Version: 1.0.0
Text Domain: astra-child
*/

:root {
    --lake-dark: #1f4c59; /*285965*/
    --lake-blue: #356f7c;
    --lake-soft: #86bac2;
    --lake-light: #dcebee;
    
    --ivory: #f8f6f1;
    --white-color: #fff;
    --border-color: #e3e1dc;

    --heading-color: #252824;
    --text-color: #666b67;
    
    --heading-font: "Cormorant Garamond", serif;
    --text-font: "Inter", sans-serif;
    
    --bg-soft: #f6f4ef;
    /*--border-color: #e4e1da;*/
    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 14px;
}


body {background-color: #FCFAF6;}
a {text-decoration: none!important;}
.overlay:before {content: ''; position: absolute; top: 0; left:0; width:100%; height:100%; display:block;}

header .site-logo-img img {filter: brightness(0) invert(1);}

.scroll-header {position: fixed; top: 0; right: 0; left: 0; z-index: 9999; background: #fff; border-bottom: 1px solid rgba(0,0,0,.08); transform: translateY(-100%); transition: transform .4s cubic-bezier(.4,0,.2,1);}
.scroll-header.is-visible {transform: translateY(0);}
.scroll-header-inner {width: min(1400px, calc(100% - 64px)); height: 82px; display: flex; align-items: center; margin: 0 auto;}
.scroll-header-logo {flex: 0 0 auto;}
.scroll-header-menu {margin-left: auto;}
.scroll-header-cta {margin-left: 32px;}
.scroll-header .scroll-header-cta .ast-custom-button {background: var(--lake-blue); color: #fff; border: 1px solid var(--lake-blue); transition: all .3s ease;}
.scroll-header .scroll-header-cta .ast-custom-button:hover {background: transparent; color: var(--heading-color); border: 1px solid var(--lake-blue);}

.scroll-header .site-logo-img img {max-height: 58px; width: auto;}
.scroll-header .scroll-header-menu ul li > a {color: var(--heading-color)!important;}

@media (max-width: 991px) {
    body.ast-theme-transparent-header #masthead.header-fixed {position: fixed; top: 0; left: 0; width: 100%; z-index: 9999; background: var(--ivory); box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;}
    body.ast-theme-transparent-header #masthead.header-fixed .site-logo-img img {filter: none;}
    .ast-theme-transparent-header #masthead.header-fixed .ast-button-wrap .mobile-menu-toggle-icon .ast-mobile-svg {fill: var(--lake-dark);}
    .ast-header-break-point .ast-mobile-header-wrap .ast-flex.stack-on-mobile {background: var(--ivory);}
}

@media (max-width: 991.98px) {
    .scroll-header {display: none;}
}


/******  hero  *****/

.home-hero:after, .page-hero:after {content:''; background:linear-gradient(0deg,#FCFAF6,transparent); height:50%; position:absolute; bottom:0; width:100%; left:0; pointer-events:none;}
.home-hero .theme-button:hover .elementor-button {color: #fff;}

.ast-header-button-1 .ast-custom-button {
    color: var(--ast-global-color-2);
    background: var(--ast-global-color-8);
    border-color: var(--ast-global-color-8);
}

.ast-theme-transparent-header header .ast-builder-menu .main-header-menu .menu-link:hover {color: var(--lake-soft)!important;}
.ast-theme-transparent-header .ast-header-social-wrap .ast-social-color-type-custom .ast-builder-social-element .social-item-label:hover {color: var(--lake-soft)!important;}


.page-hero {position:relative; min-height:60vh; display:flex; align-items:center; background-position:center; background-repeat:no-repeat; background-size:cover; overflow:hidden;}
.page-hero:after {background: linear-gradient(0deg, #FCFAF6, 40%, transparent);}
.page-hero .page-hero-inner {position:relative; z-index:1; width:100%;}
.page-hero .page-hero-eyebrow {display:block; margin-bottom:16px; font-size:11px; font-weight:600; letter-spacing:.22em; text-transform:uppercase; opacity:.85;}
.page-hero h1 {margin:0; color:#fff; font-size:clamp(48px,12vw,72px); font-weight:400; line-height:.98;}
.page-hero p {max-width:620px; margin:22px auto 0; color:rgba(255,255,255,.88); font-size:16px; line-height:1.7; text-shadow: 0 0 30px var(--lake-dark);}

@media (min-width:992px) {
    .page-hero {min-height:67vh;}
    .page-hero h1 {font-size:82px;}
    .page-hero p {font-size:19px;}
}
.page-hero-privacy-policy {min-height: 50vh;}

.surecookie-branding-mobile.surecookie-branding {display: none!important;}


.title-eyebrow {display:inline-flex; align-items:center; gap:12px; font-size:12px; font-weight:600; color:var(--lake-soft); text-transform:uppercase; letter-spacing:0.25em;}
.title-eyebrow:after {content: ""; display: inline-flex; width: 54px; height: 1px; background: currentColor; opacity: .3;}
.title-eyebrow-clean:after {display: none;}
@media screen and (max-width: 767px){
    .title-eyebrow-clean-sm:after {display: none;}
}
.no-margin, .no-margin p {margin-bottom: 0!important;}
.heading-strong {color: var(--heading-color); font-weight: 600;}


.theme-button a.elementor-button {font-family:'Inter', sans-serif; font-weight:500; font-size:14px; color: #fff; background-color: var(--lake-blue); text-transform:math-auto; letter-spacing:.08em; padding: 8px 20px;}
.theme-button a.elementor-button .elementor-button-icon svg {transition: all .3s ease;}
.theme-button-fat a {padding:14px 20px!important;}

.sticky-content {position:sticky; top: 200px;}

.breadcrumb {margin-left: 0; font-size: 12px; gap: 8px;}

.apartments-home-inner {width: 100%;}
.apartments-home-header {position: relative; margin: 0 0 36px; text-align: left;}
.apartments-home-header h2 {margin: 0 0 20px; font-size: clamp(40px,6vw,62px); font-weight: 400; line-height: 1.02;}
.apartments-home-header p {max-width: 580px; margin: 0; font-size: 15px; line-height: 1.8;}

.apartment-item {position: relative; background: #fff; border: 1px solid rgba(31,76,89,.14); border-radius: 12px; overflow: hidden;}
.apartment-item-image {display: block; overflow: hidden;}
.apartment-item-image img {width: 100%; display: block; object-fit: cover; transition: transform .7s cubic-bezier(.4,0,.2,1);}
.apartment-item-image:hover img {transform: scale(1.025);}
.apartment-item-content {position: relative;}
.apartment-item h3 {font-weight: 400;}
.apartment-item h3 a {color: inherit; text-decoration: none;}
.apartment-item-footer {display: grid; grid-template-columns: 1fr; align-items: end; gap: 6px; width: 100%; margin-top: 28px; padding-top: 20px; border-top: 1px solid rgba(31,76,89,.12);}
@media (min-width: 460px) {
    .apartment-item-footer {grid-template-columns: minmax(0,1fr) auto; gap: 20px;}
}
.apartment-price {font-size: 21px; font-weight: 500; color: var(--heading-color); font-family: 'Cormorant Infant'; display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px; min-width: 0;}
.apartment-price-prefix {font-size: .9em;}
.apartment-price small {font-size: .9em; font-weight: 400; color: var(--text-color);}

.apartment-meta {display: flex; flex-wrap: wrap; gap: 8px 20px; font-size: 15px; letter-spacing: .02em;}
.apartment-meta span + span {position: relative;}
.apartment-meta span + span::before {content: ""; position: absolute; top: 50%; left: -11px; width: 3px; height: 3px; border-radius: 50%; background: currentColor; transform: translateY(-50%); opacity: .4;}

.apartment-link, .theme-link {display: inline-flex; align-items: center; gap: 14px; align-self: flex-start; color: var(--lake-blue); font-size: 14px; font-weight: 500; letter-spacing: .02em; 
    text-decoration: none; border-bottom: 1px solid rgba(53,111,124,.25); margin-top: 0; border: 0;}
.apartment-link::after, .theme-link:after {content: "→"; display: inline-block; font-size: 18px; font-weight: 300; line-height: 1; transition: transform .3s cubic-bezier(.4,0,.2,1);}
.apartment-link:hover::after, .theme-link:hover:after {transform: translateX(6px);}

.apartments-level {display:flex; flex-direction:column; margin-bottom: 48px;}
.apartments-home-inner .apartments-level:first-of-type {flex-direction:column-reverse;}
.apartments-level-info {display: flex; flex-direction: column; justify-content: center; padding: 28px;}
.apartments-level-label {display: inline-flex; align-items: center; gap: 16px; align-self: flex-start; margin-bottom: 20px; font-size: 10px; font-weight: 600; letter-spacing: .2em; line-height: 1.4; text-transform: uppercase; opacity: .5;}
.apartments-level-label::after {content: ""; width: 42px; height: 1px; background: currentColor; opacity: .3;}
.apartments-level-info h3 {margin: 0 0 14px; font-size: clamp(34px,4vw,48px); line-height: 1.05;}
.apartments-level-info p {max-width: 390px; margin: 24px 0 0; font-size: 15px; line-height: 1.75;}
.apartments-level-image img {aspect-ratio: 1 / 1;}

.apartments-middle {margin-bottom: 48px;}
.apartments-middle-heading {margin-bottom: 28px;}
.apartments-middle-grid {display: grid; grid-template-columns: 1fr; gap: 48px;}

.apartment-card-image img {aspect-ratio: 1 / 1;}
.apartment-card-content {padding: 24px;}
.apartment-number {display: block; margin-bottom: 8px; color: var(--lake-blue); font-size: 10px; font-weight: 600; letter-spacing: .2em; line-height: 1;}
.apartment-card h3 {margin: 0 0 10px; font-size: 27px; line-height: 1.1;}

@media (min-width: 768px) {
    .apartments-home-header {margin: 0 0 72px;}
    .apartments-middle-grid {grid-template-columns: repeat(3,1fr); gap: 26px;}
    .apartment-card-image img {aspect-ratio: 4 / 5;}
}

@media (min-width: 1024px) {
    .apartments-home-header {display: grid; grid-template-columns: minmax(0,1.05fr) minmax(360px,.95fr); column-gap: 72px; align-items: end; margin-bottom: 96px;}
    .apartments-home-header h2 {grid-column: 1; margin-bottom: 0;}
    .apartments-home-header p {font-size: 17px; grid-column: 2; grid-row: 1 / span 2; align-self: end; max-width: 520px; padding: 8px 0 6px 44px; border-left: 1px solid rgba(0,0,0,.15);}

    .apartments-level {display: grid; grid-template-columns: minmax(300px,31%) minmax(0,69%); align-items: stretch; margin-bottom: 96px;}
    .apartments-level-reverse {grid-template-columns: minmax(0,69%) minmax(300px,31%);}
    .apartments-level-info {padding: 56px;}
    .apartments-level-image img {height: 580px; aspect-ratio: auto;}

    .apartments-middle {width: 94%; margin: 0 auto 96px;}
    .apartments-middle-grid {gap: 32px;}
    .apartment-card:nth-child(2) {transform: translateY(36px);}
    .apartment-card h3 {font-size: 28px;}
}

@media (min-width: 1200px) {
    .apartments-home-header {column-gap: 90px;}
    .apartments-level-info {padding: 64px;}
    .apartments-level-image img {height: 610px;}
    .apartments-middle-grid {gap: 36px;}
    .apartment-card h3 {font-size: 29px;}
}


.box-icon .elementor-icon {background-color: #f2f5f4!important;}
.box-icon .elementor-icon svg {stroke: var(--lake-soft)}

.why-book-card svg {width: 24px; height: 24px; stroke: var(--lake-soft);}


.image-carousel figure {height:300px; overflow:hidden; display:flex;}
.image-carousel figure img {object-fit:cover; width:100%; object-position:center;}
.image-carousel .elementor-swiper-button.elementor-swiper-button-prev {transform:scale(-1);}
@media screen and (min-width: 768px){
    .image-carousel figure {height:700px;}
}

.instagram-section .instagram-grid .elementor-widget-container {position: relative; overflow: hidden; aspect-ratio:1 / 1; display: flex;}
.instagram-section .instagram-grid .elementor-widget-container a {display: block; border-radius: 12px; overflow: hidden;}
.instagram-section .instagram-grid .elementor-widget-container img {min-height: 100%; width: auto; object-fit: cover; transition: transform .6s cubic-bezier(.4,0,.2,1);}
.instagram-section .instagram-grid .elementor-widget-container::before {content: ""; position: absolute; inset: 0; z-index: 1; background: rgba(0,0,0,.28); opacity: 0; pointer-events: none; border-radius: 12px;
    transition: opacity .4s ease; overflow: hidden;}
.instagram-section .instagram-grid .elementor-widget-container::after {content: ""; position: absolute; top: 50%; left: 50%; z-index: 2; width: 30px; height: 30px; background: #fff; opacity: 0; overflow: hidden; border-radius: 12px;
    pointer-events: none; transform: translate(-50%,-50%) scale(.75); transition: opacity .35s ease, transform .45s cubic-bezier(.4,0,.2,1); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='3' width='18' height='18' rx='5' ry='5' fill='none' stroke='black' stroke-width='1.8'/%3E%3Ccircle cx='12' cy='12' r='4' fill='none' stroke='black' stroke-width='1.8'/%3E%3Ccircle cx='17.4' cy='6.6' r='1.1' fill='black'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='3' width='18' height='18' rx='5' ry='5' fill='none' stroke='black' stroke-width='1.8'/%3E%3Ccircle cx='12' cy='12' r='4' fill='none' stroke='black' stroke-width='1.8'/%3E%3Ccircle cx='17.4' cy='6.6' r='1.1' fill='black'/%3E%3C/svg%3E") center / contain no-repeat;}

.instagram-section .instagram-grid .elementor-widget-container:hover img {transform: scale(1.055);}
.instagram-section .instagram-grid .elementor-widget-container:hover::before {opacity: 1;}
.instagram-section .instagram-grid .elementor-widget-container:hover::after {opacity: 1; transform: translate(-50%,-50%) scale(1);}
.instagram-section .theme-button-alt a {display: flex; align-items: center; gap: 10px;}
.instagram-section .theme-button-alt a:before {content: ""; width: 20px; height: 20px; flex: 0 0 20px; background-color: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.4'%3E%3Cpath d='M4 8a4 4 0 0 1 4-4h8a4 4 0 0 1 4 4v8a4 4 0 0 1-4 4H8a4 4 0 0 1-4-4z'/%3E%3Cpath d='M9 12a3 3 0 1 0 6 0 3 3 0 0 0-6 0'/%3E%3Cpath d='M16.5 7.5h.01'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.4'%3E%3Cpath d='M4 8a4 4 0 0 1 4-4h8a4 4 0 0 1 4 4v8a4 4 0 0 1-4 4H8a4 4 0 0 1-4-4z'/%3E%3Cpath d='M9 12a3 3 0 1 0 6 0 3 3 0 0 0-6 0'/%3E%3Cpath d='M16.5 7.5h.01'/%3E%3C/svg%3E") center / contain no-repeat;}


.scroll-to-top {position: fixed; right: 20px; bottom: 20px; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; padding: 0; border: 1px solid rgba(0,0,0,.12); border-radius: 50%; background: #fff; color: #222; opacity: 0; visibility: hidden; transform: translateY(10px); pointer-events: none; cursor: pointer; z-index: 999; transition: opacity .3s ease, visibility .3s ease, transform .3s ease, background-color .3s ease;}
.scroll-to-top.show {opacity: 1; visibility: visible; transform: translateY(0); pointer-events: auto;}
.scroll-to-top:hover {background: #f5f5f5;}
.scroll-to-top svg {width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round;}


.srfm-form-container.srfm-bg-color {background-color: transparent!important;}
.srfm-form-container .srfm-form .srfm-submit-button {padding: 8px 20px; border: 1px solid var(--lake-blue); border-radius: 30px; overflow: hidden; background-color: var(--lake-blue); 
    transition: all .3s cubic-bezier(.4,0,.2,1);}
.srfm-form-container .srfm-form .srfm-submit-button .srfm-submit-wrap {font-family:'Inter', sans-serif; font-weight:500; font-size:14px; color: #fff; padding: 0;  background-color: transparent; text-transform:math-auto;
    letter-spacing:.08em;  transition: all .3s cubic-bezier(.4,0,.2,1);}
.srfm-form-container .srfm-form .srfm-submit-button:hover {background-color: transparent;}
.srfm-form-container .srfm-form .srfm-submit-button:hover .srfm-submit-wrap {background-color: transparent; color: var(--lake-dark);}
.kontakt-podaci {display: flex; flex-direction: column; gap: 4px; align-items: start;}



.tara-place-wrap .tara-place-card {height:100%; overflow:hidden; background:#fff; border:1px solid rgba(31,76,89,.12); border-radius:12px;}
.tara-place-wrap .tara-place-media {overflow:hidden; border-radius:8px;}
.tara-place-wrap .elementor-widget-container {width:100%; display: flex;}
.tara-place-wrap .tara-place-media img {position: absolute; width:100%; height:100%; display:block; object-fit:cover; transition:transform .7s cubic-bezier(.4,0,.2,1);}
.tara-place-wrap .tara-place-card:hover .tara-place-image img {transform:scale(1.035);}

.tara-place-wrap .tara-place-content {display:flex; flex-direction:column; align-items:flex-start; padding:20px;}
.tara-place-wrap .tara-place-content h3 {margin:0 0 12px; font-size:36px; font-weight:400; line-height:1.05;}
.tara-place-wrap .tara-place-content .title-eyebrow .elementor-heading-title {text-transform: none; letter-spacing: .2px; font-weight: 300; font-size: 14px; line-height:1.4; opacity:.82;}
.tara-place-wrap .tara-place-content .title-eyebrow:after {display: none;}
.tara-place-wrap .tara-place-text {font-size:15px; line-height:1.75; margin-top: 24px;}

@media (min-width:768px) {
    .tara-place-wrap .tara-place-card {display:grid; grid-template-columns:48% 52%;}
    .tara-place-wrap .tara-place-content {padding:22px;}
}

@media (min-width:1200px) {
    .tara-place-wrap .tara-place-content {padding:24px;}
}




footer .ast-footer-html-1 img {margin-bottom: 16px;}
footer .ast-footer-html-1 p {font-family: var(--heading-font); font-size: 20px; color: var(--heading-color);}
footer .ast-footer-social-1-wrap .ast-builder-social-element svg {width: 30px; height: 30px; stroke-width: 1; stroke: var(--lake-blue);}
footer .ast-footer-social-1-wrap .ast-builder-social-element:hover svg {stroke: var(--lake-dark);}
footer .site-footer-section .widget_nav_menu .widget-title {font-weight: 400; font-size: 21px; letter-spacing: 1px;}
footer nav ul > li > a {font-size: 16px; line-height: 2em; color: var(--lake-dark);}
footer nav ul > li > a:hover {color: var(--lake-soft);}

.footer-copy {display:flex; flex-direction:column; align-items:center; justify-content:center;}
.footer-copy p {color: var(--text-color); font-weight: 500; font-family: 'Cormorant Infant'; font-size: 18px;}
@media screen and (min-width:768px){
    .footer-copy {flex-direction:row; justify-content:space-between;}
}


.srfm-form-container .srfm-success-box.srfm-active {background: #fff; border-radius: 12px; border: 1px solid #E1DDD7; padding: 32px;}
.srfm-form-container .srfm-success-box .srfm-success-box-description {font-size: 1em;}
.srfm-form-container .srfm-success-box .srfm-success-box-description h2 {font-size: 2.5em!important; font-weight: 400!important;}
.srfm-form-container .srfm-success-box p {font-size: 17px; color: var(--heading-color);}