/*
Theme Name: Central Garden
Author: Portalworks
Version: 1.0.0
Text Domain:
*/



/***************************************************************
                         FONTS
***************************************************************/
/* poppins-300 - latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 300;
  src: url('fonts/poppins-v24-latin_latin-ext-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* poppins-regular - latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/poppins-v24-latin_latin-ext-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* poppins-italic - latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: italic;
  font-weight: 400;
  src: url('fonts/poppins-v24-latin_latin-ext-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* poppins-500 - latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  src: url('fonts/poppins-v24-latin_latin-ext-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* poppins-600 - latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  src: url('fonts/poppins-v24-latin_latin-ext-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* poppins-700 - latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/poppins-v24-latin_latin-ext-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/***************************************************************
                         ROOT
***************************************************************/
:root {
    --font-primary: 'Poppins', sans-serif;
    --primary-color: #572A34;
    --secondary-color: #BA4771;
    --green-color: #A8D3AF;
    --black: #000000;
    --white: #ffffff;
}


/***************************************************************
                         PRE-DEFINED
***************************************************************/
body {
    font-family: var(--font-primary);
    color: var(--black);
}
html {
    scroll-padding-top: 120px;
}
.admin-bar body {
    padding-top: 46px;
}
.container {
    padding: 0 20px;
}
.section-title {
    font-size: 32px;
    font-weight: 700;
    color: var(--black);
    line-height: 1.1;
    margin-bottom: 20px;
}
.section-title span {
    font-weight: 400;
}
.section-top-title {
    font-size: 13px;
    font-weight: 500;
    margin-bottom: 8px;
    text-transform: uppercase;
}
.section-top-title.purple {
    color: var(--secondary-color);
}
.section-top-title.white {
    color: var(--white);
}
.section-text p {
    font-size: 15px;
    line-height: 1.6;
}
.section-text p:last-of-type {
    margin-bottom: 0;
}
.section-btn {
    margin-top: 20px;
}
.btn {
    font-size: 24px;
    font-weight: 400;
    line-height: 1;
    color: var(--white);
    padding: 16px 24px;
    border-radius: 0px;
    border: 2px solid var(--white);
    text-box: trim-both cap alphabetic;
}
.btn-primary {
    background-color: var(--secondary-color);
    color: var(--white);
    border: 2px solid var(--secondary-color);
}
.btn-primary:hover,
.btn-primary:active,
.btn-primary:focus,
.btn-primary.active  {
    background-color: transparent !important;
    border: 2px solid var(--secondary-color) !important;
    color: var(--secondary-color) !important;
    
}
.btn-secondary:disabled,
.btn-secondary {
    background-color: var(--white);
    color: var(--black);
    border: 2px solid var(--white);
    opacity: 1 !important;
}
.btn-secondary:hover,
.btn-secondary:active,
.btn-secondary:focus,
.btn-secondary.active  {
    background-color: transparent !important;
    border: 2px solid var(--white) !important;
    color: var(--white) !important;
}
.section-padding {
    padding: 40px 0;
}
.bg-primary {
    background-color: var(--primary-color) !important;
}
.bg-secondary {
    background-color: var(--secondary-color) !important;
}
.bg-green {
    background-color: var(--green-color) !important;
}
/********* NAVBAR ***********/
.navbar-brand img {
    width: 117px;
}

.navbar-brand:focus-visible,
.navbar-brand:focus {
    box-shadow: none;
    outline: none;
}
.menu-button {
    border: none;
    outline: none;
    padding: 0;
    background: none;
}
.offcanvas-header {
    padding: 13px 20px 0 20px;
}
.menu-button img {
    width: 40px;
}
.navbar .nav-link {
    font-weight: 700;
    font-size: 32px;
    color: var(--black);
    text-transform: uppercase;
    line-height: 1.1;
    position: relative;
}
.navbar .nav-link::after {
    content: "";
    position: absolute;
    width: 0;
    height: 4px;
    background-color: var(--secondary-color);
    left: 0;
    bottom: -4px;
}
.navbar .nav-link.active {
    color: var(--secondary-color);
}
.navbar .nav-link.active::after {
    width: 40px;
}
.navbar-nav {
    gap: 24px;
}
.menu-follow {
    padding-top: 20px;
}
.menu-follow a {
    font-weight: 700;
    font-size: 20px;
    color: var(--black);
    text-decoration: none;
}
.menu-follow img {
    width: 32px;
    margin-left: 24px;
}
.offcanvas-body {
    padding: 20px;
}

/********* FOOTER ***********/
footer {
    padding: 40px 0;
    font-size: 20px;
    line-height: 1.4;
}
.footer-bottom {
    gap: 40px;
}
.footer-links a {
    font-size: 20px;
    color: var(--black);
    line-height: 1.4;
}
.footer-links a:hover {
    text-decoration: none;
}
.footer-right .row {
    --bs-gutter-y: 40px;
}
footer p {
    margin-bottom: 7px;
}
footer p a {
    color: var(--black);
    text-decoration: none;
}
footer p:last-child {
    margin-bottom: 0;
}
.footer-column-title {
    margin-bottom: 12px;
}
.footer-bottom {
    margin-top: 40px;
}
.footer-column-links {
    padding-top: 5px;
}
.footer-column-links  a {
    color: var(--black);
}
.footer-column-links  a:hover {
    text-decoration: none;
}
.footer-logo img {
    width: 100%;
    max-width: 350px;
}
.footer-logo {
    margin-top: 40px;
    margin-bottom: 40px;
}
footer p a:hover {
    text-decoration: underline;
}

.contact-person-img {
    aspect-ratio: 4/5;
    margin-bottom: 12px;
}
.contact-persons .row {
    --bs-gutter-x: 12px;
}
.contact-person-name {
    font-size: 15px;
    font-weight: 700;
    line-height: 1.6;
    margin-bottom: 8px;
}
.contact-person-links a {
    font-size: 15px;
    line-height: 1.6;
    color: #FFFFFF;
}
.contact-person-links a:hover {
   text-decoration: none;
}
.contact-persons {
    margin-top: 40px;
}
/* .form-check {
    display: flex;
    align-items: start;
    margin-bottom: 0;
    line-height: 1.3;
    min-height: unset;
}
.form-check-input {
    width: 20px;
    height: 20px;
    min-width: 20px;
    border-radius: 50% !important;
    border: 2px solid var(--white);
    background-color: transparent;
    cursor: pointer;
    flex-shrink: 0;
    vertical-align: unset;
    margin-top: 0;
    margin-right: 6px;

}
.form-check-input:checked {
    background-color: var(--white);
    border-color: var(--white);
    background-image: none;
}
.form-check-input:focus {
    box-shadow: none;
    border-color: var(--white);
}
.form-check-label {
    color: var(--white);
    font-size: 15px;
    line-height: 1.4;
}
.form-check-label a {
    color: var(--white);
} */

/* ============================================
   CHECKBOXES & RADIO BUTTONS (CF7)
   ============================================ */
.wpcf7-radio,
.form-check {
    display: flex;
    align-items: start;
    margin-bottom: 0;
    line-height: 1.3;
    min-height: unset;
    padding-left: 0;
    gap: 16px;
}
/* Wrapper za svaki item */
.wpcf7-list-item {
    display: flex;
    align-items: center;
    margin-bottom: 0;
    margin-left: 0 !important;
}

/* Label wrapper */
.wpcf7-list-item label {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--white);
    font-size: 15px;
    line-height: 1.4;
    cursor: pointer;
    margin-bottom: 0;
}

/* Svi checkboxovi i radio buttoni unutar CF7 */
.wpcf7-form-control input[type="checkbox"],
.wpcf7-form-control input[type="radio"] {
    width: 20px;
    height: 20px;
    min-width: 20px;
    border-radius: 50% !important;
    border: 2px solid var(--white);
    background-color: transparent;
    cursor: pointer;
    flex-shrink: 0;
    appearance: none;
    -webkit-appearance: none;
    margin: 0;
}

.wpcf7-form-control input[type="checkbox"]:checked,
.wpcf7-form-control input[type="radio"]:checked {
    background-color: var(--white);
    border-color: var(--white);
    background-image: none;
}

.wpcf7-form-control input[type="checkbox"]:focus,
.wpcf7-form-control input[type="radio"]:focus {
    box-shadow: none;
    border-color: var(--white);
    outline: none;
}

/* Link unutar acceptance labela */
.wpcf7-acceptance .wpcf7-list-item-label a {
    color: var(--white);
}

/* ============================================
   ACCEPTANCE CHECKBOX – poseban wrapper
   ============================================ */

.wpcf7-acceptance .wpcf7-list-item {
    line-height: 1.3;
    align-items: flex-start;
}

.wpcf7-acceptance .wpcf7-list-item label {
    align-items: flex-start;
}

.wpcf7-acceptance input[type="checkbox"] {
    margin-top: 2px; /* vizuelno poravnanje sa prvim redom teksta */
}
.form-group-title {
    font-size: 13px;
    margin-bottom: 8px;
    line-height: 1.4;
    text-transform: uppercase;
}
.contact-form-container {
    margin-top: 40px;
}
.form-desc {
    font-size: 15px;
    line-height: 1.4;
    margin-bottom: 20px;
    margin-top: 40px;
    color: var(--white);
}
.form-group {
    margin-bottom: 20px;
}
.form-group-top {
    margin-bottom: 40px;
}

.form-control {
    background-color: transparent;
    border: none;
    border-bottom: 2px solid var(--white);
    border-radius: 0;
    font-size: 15px;
    line-height: 1.4;
    color: #FFFFFF;
    padding: 4px 0;
}
.form-control:focus {
    background-color: transparent;
    box-shadow: none;
    border-color: var(--white);
    color: var(--white);
}
.form-control::placeholder {
    font-size: 15px;
    line-height: 1.4;
    color: #FFFFFF;
}
.form-item {
    margin-bottom: 24px;
}
.form-item-last {
    margin-bottom: 20px;
}
.contact-form-container {
    max-width: 636px;
}

.hero-image {
    flex: 1 1 0; /* 0 umjesto auto */
    min-height: 420px;
    overflow: hidden;
}
.hero-text-box-inner h1 {
    font-size: 44px;
    font-weight: 700;
    margin-bottom: 24px;
    color: var(--white);
    text-transform: uppercase;
    line-height: 1;
}
.hero-text-box-inner p {
    font-size: 15px;
    line-height: 1.6;
    color: #FFFFFFE6;
}
.hero-text-box-inner p:last-child {
    margin-bottom: 0;
}
.hero-text-box-inner {
    padding: 20px 0 40px 0;
}
.hero-text-box {
    background-color: var(--primary-color);
}
.swiper-button-prev,
.swiper-button-next {
    position: static;
    width: 48px;
    height: 48px;
    margin-top: 0;
    border: 2px solid var(--white);
    transition: all .2s;
}
.swiper-button-prev::after,
.swiper-button-next::after {
    content: "";
    /* background-image: url(img/arrow-next.svg);
    width: 23px;
    height: 23px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat; */
}
.swiper-button-prev::after {
    background-image: url(img/arrow-prev.svg);
}
.swiper-navigation {
    max-width: 310px;
}
.gallery-img {
    aspect-ratio: 3/2;
}
.gallery-swiper-container {
    padding-top: 40px;
}
.swiper-button-next.swiper-button-disabled, 
.swiper-button-prev.swiper-button-disabled {
    opacity: 1;
}
/* .swiper-navigation.white .swiper-button-next:hover svg path,
.swiper-navigation.white .swiper-button-prev:hover svg path {
    fill: var(--white)
} */
.swiper-navigation.white .swiper-button-next:hover,
.swiper-navigation.white .swiper-button-prev:hover {
    background-color: var(--white);
}


.swiper-navigation.purple .swiper-button-next,
.swiper-navigation.purple .swiper-button-prev {
    border-color: var(--secondary-color);
    background-color: var(--white);
}

.swiper-navigation.purple .swiper-button-next svg path,
.swiper-navigation.purple .swiper-button-prev svg path {
    fill: var(--secondary-color)
}
.swiper-navigation.purple .swiper-button-next:hover,
.swiper-navigation.purple .swiper-button-prev:hover {
    background-color: var(--secondary-color);
}
.swiper-navigation.purple .swiper-button-next:hover svg path,
.swiper-navigation.purple .swiper-button-prev:hover svg path {
    fill: var(--white);
}
.lage-button {
    margin-top: 40px;
}
.lage-table-container .table {
    margin-bottom: 34px;
}
.lage-table-container .table:last-of-type {
    margin-bottom: 0;
}
.lage-table-container th {
    font-weight: 500;
    font-size: 13px;
    border-bottom: 2px solid var(--black);
    text-transform: uppercase;
    padding: 6px 0;
    line-height: 1.6;
    min-width: 60px;
    text-align: center;
}
.lage-table-container th:first-child {
    text-align: start;
}
.lage-table-container td {
    font-weight: 400;
    font-size: 15px;
    border-bottom: 1px solid #000000CC;
    padding: 26px 0 11px 0;
    text-align: center;
}
.lage-table-container td:first-child {
    text-align: start;
}
.lage-table-container {
    max-width: 845px;
}
.gewerbe-first-img {
    width: 100%;
    aspect-ratio: 4/3;
    margin-top: 40px;
}
.column-text-wrapper p {
    color: #000000CC;
    line-height: 1.6;
    font-size: 15px;
}
.column-text-wrapper p:last-child {
    margin-bottom: 0;
}
.column-title {
    font-size: 24px;
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 8px;
    text-transform: uppercase;
    color: var(--black);
}
.two-columns-text-section .row {
    --bs-gutter-y: 32px;
}
.columns-btn {
    margin-top: 32px;
}
.two-columns-block {
    max-width: 1062px;
}
.gallery-img-text {
    margin-top: 32px;
}
.gallery-img-text span {
    font-weight: 700;
    font-size: 24px;
    line-height: 1.2;
    text-transform: uppercase;
}
.gallery-img-text p {
    font-weight: 400;
    font-size: 15px;
    line-height: 1.6;
    color: var(--black);
}
.gallery-img-text p:last-child {
    margin-bottom: 0;
}
.quartiergeschichte-navigation {
    padding-top: 40px;
}

.admin-bar .offcanvas,
.admin-bar .navbar {
    top: 46px;
}

html :where(.wp-block) {
    max-width: 100% !important;
    margin-bottom: 0 !important;
    margin-top: 0 !important;
}
.wpcf7 form .wpcf7-response-output {
    color: var(--white);
}
.contact-form-container p {
    margin-bottom: 0;
}
.wpcf7-list-item label a:hover {
    text-decoration: none;
}
/* ============================================
   TEXTBLOCK
   ============================================ */
.textblock h1 {
    font-size: 32px;
    font-weight: 700;
    line-height: 1.1;
    margin-bottom: 20px;
    color: var(--black);
}
.textblock-inhalt p {
    font-size: 15px;
    line-height: 1.6;
    color: var(--black);
}
.textblock-inhalt p:last-child {
    margin-bottom: 0;
}
.textblock-inhalt h2 {
    font-size: 24px;
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 12px;
    margin-top: 32px;
    color: var(--black);
}
.textblock-inhalt h3 {
    font-size: 20px;
    font-weight: 600;
    line-height: 1.3;
    margin-bottom: 8px;
    margin-top: 24px;
    color: var(--black);
}
.textblock-inhalt ul,
.textblock-inhalt ol {
    font-size: 15px;
    line-height: 1.6;
    margin-bottom: 16px;
}
.textblock-inhalt li {
    margin-bottom: 4px;
}
.textblock-inhalt a {
    color: var(--secondary-color);
}
.textblock-inhalt a:hover {
    text-decoration: none;
}
.textblock-inhalt strong {
    font-weight: 700;
}

@media (min-width: 576px){}


@media (min-width: 768px){}
@media (min-width: 783px){
    .admin-bar .offcanvas,
    .admin-bar .navbar {
        top: 32px;
    }
}

@media (min-width: 992px){
    body {
        padding-top: 77.59px;
    }
    .navbar .nav-link {
        font-weight: 600;
        font-size: 16px;
        text-transform: none;
        padding: 5px 2px !important;
    }
    .navbar .nav-link::after {
        content: "";
        position: absolute;
        width: 0;
        height: 2px;
        background-color: var(--secondary-color);
        left: 2px;
        bottom: 0px;
    }
    .navbar .nav-link:hover {
        color: var(--secondary-color);
    }
    .navbar .nav-link.active::after {
        width: calc(100% - 4px);
    }
    .navbar {
        padding-top: 25px;
        padding-bottom: 25px;
    }
    .navbar-brand {
        position: absolute;
        right: 0;
        top: -25px;
        background-color: var(--white);
        padding: 25px 0 50px 70px !important;
        border-bottom-left-radius: 135px;
        transition: all .3s;
    }
    .navbar-brand::after {
        content: "";
        position: absolute;
        left: 100%;
        width: 1000px;
        background-color: #FFFFFF;
        height: 100%;
        top: 0;
    }
    .navbar-brand img {
        width: 160px;
        transition: all .3s;
    }
    .navbar.scrolled .navbar-brand{
        padding: 25px 0 30px 40px !important;
        border-bottom-left-radius: 75px;
    }
    .navbar.scrolled .navbar-brand img {
        width: 120px;
    }
    .footer-logo img {
        max-width: 285px;
    }
    .w-lg-fit {
        width: fit-content;
    }
    .form-check {
        align-items: center;
    }
    .hero-section {
        min-height: calc(100svh - 45px);
    }
    .hero-text-box-inner h1 {
        margin-bottom: 0;
    }
    .hero-text-box-inner h1 span {
        font-weight: 400;
        display: block;
    }
    .hero-text-box-inner p {
        font-size: 16px;
        line-height: 1.4;
        margin-bottom: 0;
        position: relative;
        z-index: 3;
    }
    .hero-text-box-inner {
        padding: 0;
    }
    .hero-title-container {
        width: 40%;
        position: relative;
        background-color: var(--primary-color);
    }
    .hero-paragraph-container {
        flex: 1 1 0;
        background-color: var(--primary-color);
        margin-top: 20px;
        padding-top: 25px;
        padding-left: 20px;
        position: relative;
    }
    .hero-text-box {
        background-color: transparent;
    }
    .hero-text-box {
        margin-top: -20px;
        padding-bottom: 30px;
    }
    .hero-title-container::after {
        content: "";
        position: absolute;
        right: 0;
        width: 300%;
        height: 150%;
        top: -25px;
        background-color: var(--primary-color);
    }
    .hero-paragraph-container::after {
        content: "";
        position: absolute;
        left: 0;
        width: 300%;
        height: 200%;
        top: 0;
        background-color: var(--primary-color);
    }
    .hero-section{
        min-height: calc(100svh + 43px);
    }
    .section-top-title {
        text-transform: none;
    }

    .mietwohnungen-section-title {
        max-width: 300px;
    }
    .mietwohnungen-section .section-text {
        flex: 1 1 0;
    }
    .section-text p {
        line-height: 1.4;
    }
    .swiper-button-next {
        border-left: 0;
    }
    .gallery-swiper-container .swiper-slide {
        scale: .85;
        transition: all .3s;
    }
    .gallery-swiper-container .swiper-slide-active {
        scale: 1;
    }
    .lage-table-container th {
        font-size: 20px;
    }
    .lage-table-container td {
        font-size: 18px;
    }
    .gewerbe-first-img {
        aspect-ratio: 3/2;
        width: 51%;
    }
    .quartier-container {
        max-width: 100%;
        padding: 0;
    }
    .quartier-section-title {
        max-width: 360px;
        padding: 16px;
        background-color: var(--white);
        position: relative;
        z-index: 3;
    }
    .quartiergeschichte-swiper-container {
        margin-top: -30px;
    }
    .gallery-img-text {
        max-width: 400px;
        padding: 16px;
        background-color: var(--white);
        margin-top: 0;
        margin-left: auto;
        margin-top: -30px;
        position: relative;
        z-index: 3;
        transform: translateX(70px);
    }
    .quartiergeschichte-swiper-container .swiper-slide {
        scale: 0.8;
    }
    .quartiergeschichte-swiper-container .swiper-slide .gallery-img-text {
        height: 0;
        opacity: 0;
        transition: all .2s;
    }
    .quartiergeschichte-swiper-container .swiper-slide-active {
        scale: 1;
    }
    .quartiergeschichte-swiper-container .swiper-slide-active  .gallery-img-text {
        display: block;
        opacity: 1;
        height: auto;
    }
    .quartiergeschichte-navigation {
        position: absolute;
        top: 567px;
        left: 50%;
        transform: translateX(-50%);
        z-index: 5;
    }
}


@media (min-width: 1200px){
    .footer-right {
        padding-left: 70px;
    }
    .footer-right .row {
        --bs-gutter-x: 60px;
    }
    footer {
        padding: 80px 0 160px 0;
    }
    .section-padding {
        padding: 80px 0;
    }
    .section-title {
        font-size: 48px;
        line-height: 1.1;
        margin-bottom: 24px;
    }

    .section-top-title {
        font-weight: 600;
        margin-bottom: 0px;
        font-size: 24px;
    }
    .contact-persons .row {
        --bs-gutter-x: 24px;
    }
    .contact-person-img {
        margin-bottom: 20px;
    }
    .contact-person-name {
        font-size: 18px;
        margin-bottom: 20px;
        line-height: 1.4;
    }
    .contact-person-links {
        gap: 8px;
    }
    .contact-person-links a {
        font-size: 18px;
        line-height: 1.4;
    }
    .section-text p {
        font-size: 18px;
    }

    .textblock h1 {
        font-size: 48px;
        line-height: 1.1;
        margin-bottom: 24px;
    }
    .textblock-inhalt p {
        font-size: 18px;
    }
    .textblock-inhalt h2 {
        font-size: 32px;
        margin-bottom: 16px;
        margin-top: 40px;
    }
    .textblock-inhalt h3 {
        font-size: 24px;
        margin-top: 32px;
    }
    .textblock-inhalt ul,
    .textblock-inhalt ol {
        font-size: 18px;
    }
    .contact-section .section-title {
        max-width: 411px;
    }
    .form-group-title {
        font-size: 18px;
        text-transform: none;
        margin-bottom: 12px;
    }
    .wpcf7-list-item label {
        font-size: 18px;
    }
    .form-desc {
        font-size: 18px;
        margin-bottom: 20px;
        margin-top: 80px;
    }
    .form-control {
        font-size: 18px;
    }
    .form-control::placeholder {
        font-size: 18px;
    }
    .form-item-last {
        margin-bottom: 40px;
    }
    .form-group-top {
        margin-bottom: 80px;
    }
    .hero-text-box-inner h1 {
        font-size: 55px;
    }
    .hero-text-box-inner p {
        font-size: 20px;
    }
    .hero-title-container {
        width: 39%;
        padding-right: 30px;
    }
     .hero-section{
        min-height: calc(100svh + 65px);
    }
    .hero-paragraph-container {
        padding-top: 35px;
    }
    .hero-image {
        min-height: 74svh;
    }

    .hero-image img {
        object-position: center 70%;
    }
    .section-btn {
        margin-top: 24px;
    }
    .mietwohnungen-section-title {
        max-width: 410px;
        margin-right: 110px;
    }
    .lage-button {
        margin-top: 64px;
    }
    .lage-table-container .table {
        margin-bottom: 48px;
    }
    .lage-table-container .table:last-of-type {
        margin-bottom: 0;
    }
    .lage-table-container th {
        font-weight: 400;
        font-size: 24px;
        text-transform: none;
        line-height: 1.4;
        padding: 16px;
        min-width: 194px;
        text-align: start;
    }
    .lage-table-container td {
        font-weight: 400;
        font-size: 18px;
        line-height: 1.4;
        text-align: start;
        padding: 16px;
        min-width: 194px;
    }
    .lage-table-container th:first-child,
    .lage-table-container td:first-child {
        padding-left: 0;
    }
    .lage-table-container th:first-child {
        min-width: 400px;
    }
    .gewerbe-top .section-text p {
        font-size: 24px;
    }
    .column-text-wrapper p {
        line-height: 1.4;
        font-size: 18px;
    }
    .column-title {
        line-height: 1.4;
        margin-bottom: 12px;
        text-transform: none;
    }

    .columns-btn {
        margin-top: 40px;
    }

    .quartier-section-title {
        max-width: 530px;
        padding: 16px;
        background-color: var(--white);
        position: relative;
        z-index: 3;
    }
    .quartiergeschichte-swiper-container {
        margin-top: -40px;
    }
    .gallery-img-text {
        max-width: 480px;
        margin-top: -30px;
        transform: translateX(80px);
    }
    html {
        scroll-padding-top: 60px;
    }
}


@media (min-width: 1400px){
    body {
        padding-top: 79.8px;
    }
    .navbar .nav-link {
        font-size: 18px;
        padding: 5px 8px !important;
    }
    .navbar .nav-link::after {
        left: 8px;
    }
    .navbar .nav-link.active::after {
        width: calc(100% - 16px);
    }
    .navbar-brand {
        top: -25px;
        padding: 32px 0 70px 70px !important;
        border-bottom-left-radius: 143px;
    }
    .navbar-brand img {
        width: 277px;
    }
    .navbar.scrolled .navbar-brand{
        padding: 25px 0 35px 50px !important;
        border-bottom-left-radius: 70px;
    }
    .navbar.scrolled .navbar-brand img {
        width: 180px;
    }
    .hero-text-box-inner h1 {
        font-size: 64px;
    }
    .hero-text-box-inner p {
        font-size: 24px;
    }
    .hero-title-container {
        width: 40%;
        padding-right: 30px;
    }
     .hero-section{
        min-height: calc(100svh + 95px);
    }
    .hero-paragraph-container {
        padding-top: 40px;
        padding-left: 24px;
        margin-top: 25px;
    }
    .hero-title-container::after {
        top: -40px;
    }
    .hero-text-box {
        margin-top: -25px;
    }
    .hero-text-box {
        padding-bottom: 40px;
    }
    .quartier-section-title {
        padding: 24px;
    }
    .quartiergeschichte-swiper-container {
        margin-top: -80px;
    }
    .gallery-img-text {
        max-width: 520px;
        padding: 24px;
        margin-top: -70px;
        transform: translateX(70px);
    }
    .quartiergeschichte-swiper-container .swiper-slide {
        scale: 0.75;
    }

    .quartiergeschichte-swiper-container .swiper-slide-active {
        scale: 1;
    }
    .gallery-img-text span {
        font-size: 48px;
        margin-bottom: 15px;
        line-height: 1.1;
        display: block;
    }
    .gallery-img-text p {
        font-size: 18px;
        line-height: 1.4;
    }
}