section.content-container {
    width: 100%;
    height: 100%;
    display: block;
}

section#home-hero.content-container {
    height: 75vh;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    align-content: center;
}

.home-hero-logo-container {
    flex-grow: 1;
    display: flex;
    align-items: center;
    flex-direction: column;
    align-content: center;
    justify-content: center;
}

body {
    background-color: var(--svijetla-primarna);
}

.home-page-veil {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--svijetla-primarna);
    opacity: 1;
    visibility: visible;
    transition: opacity 450ms ease, visibility 0ms linear 450ms;
}

.home-page-veil.is-hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.desktop-nav-container {
    display: none;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;

    /* box-shadow: inset 0 0 0 20px var(--svijetla-primarna) */
    box-shadow: inset 0 0 0 15px var(--svijetla-istaknuto);
    z-index: 3;
    pointer-events: none;
}

@media (min-width: 1024px) {
    .desktop-nav-container {
        display: block;
    }
}

.mobile-nav-container {
    display: block;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 4;
    pointer-events: none;
}

@media (min-width: 1024px) {
    .mobile-nav-container {
        display: none;
    }
}

p.wingman-text {
    text-align: center;
    font-size: 12px;
    line-height: 160%;
    margin: 0;
    padding: 0;
}

@media (min-width: 768px) {
    p.wingman-text {
        font-size: 12px;
    }
}

@media (min-width: 1024px) {
    p.wingman-text {
        font-size: 12px;
    }
}

@media (min-width: 1440px) {
    p.wingman-text {
        font-size: 13px;
    }
}

#home-hero-logo-lottie {
    display: block;
    width: 60vw;
}

@media (min-width: 576px) {
    #home-hero-logo-lottie {
        width: 37vw;
    }
}

@media (min-width: 768px) {
    #home-hero-logo-lottie {
        width: 260px;
    }
}

@media (min-width: 1024px) {
    #home-hero-logo-lottie {
        width: 290px;
    }
}

.content-container .home-product {
    background: var(--svijetla-istaknuto);
    display: flex;
    min-height: 100vh;
    flex-direction: column;
    justify-content: center;
    padding: 80px 35px 120px 35px;
    gap: 50px;
    align-content: center;
    align-items: center;
}

.content-container .home-product {
    box-shadow: none;
}

.content-container#home-products .home-product + .home-product {
    box-shadow: 0 -80px 200px rgba(0, 0, 0, 0.05);
}

@media (min-width: 576px) {
    .content-container .home-product {
        padding: 110px 60px;
        gap: 70px;
    }
}

@media (min-width: 1024px) {
    .content-container .home-product {
        padding: 65px 60px 90px 60px;
        gap: 60px;
        min-height: 95vh;
    }
}

@media (min-width: 1440px) {
    .content-container .home-product {
        gap: 80px;
    }
}

@media (min-width: 1920px) {
    .content-container .home-product {
        gap: 90px;
    }
}

h1 {
    font-size: 50px;
    margin: 0;
    padding: 0;
}

@media (min-width: 576px) {
    h1 {
        font-size: 62px;
    }
}

@media (min-width: 768px) {
    h1 {
        font-size: 86px;
    }
}

@media (min-width: 1024px) {
    h1 {
        font-size: 84px;
    }
}

@media (min-width: 1440px) {
    h1 {
        font-size: 90px;
    }
}

@media (min-width: 1920px) {
    h1 {
        font-size: 94px;
    }
}

@media (min-width: 2560px) {
    #about-us-highlights .visual-container.fork picture {
        width: 770px;
    }
}

.home-product-image-container {
    flex-grow: 1;
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 1;
    overflow: hidden;
}

.home-product-bottom-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    flex-grow: 1;
    position: relative;
    width: 100%;
}

@media (min-width: 1024px) {
    .home-product-bottom-container {
        max-width: 950px;
        max-height: 340px;

        /* height: 43vh */
    }
}

@media (min-width: 1440px) {
    .home-product-bottom-container {
        max-width: 1200px;
        max-height: 370px;
    }
}

@media (min-width: 1920px) {
    .home-product-bottom-container {
        max-width: 1446px;
        max-height: 420px;
    }
}

#home-products.content-container {
    padding: 0;
    margin-bottom: 100px;
    overflow: hidden;
}

@media (min-width: 1024px) {
    #home-products.content-container {
        margin-bottom: 150px;
    }
}

.home-product-image-container img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.home-product-image-container picture {
    display: block;
    width: 100%;
    height: 100%;
}

@media (min-width: 1024px) {
    .home-product-image-container picture {
        transition: 600ms cubic-bezier(0.15, 0.00, 0.34, 0.97);
    }

    .home-product-image-container picture.hover-triggered {
        transform: scale(1.02);
    }
}

.home-product-bottom-container a.home-product-link {
    z-index: 2;
}

.standard-button span {
    color: var(--tamna-primarna);
    text-transform: uppercase;
    font-size: 12px;
    line-height: 100%;
    padding: 0;
    margin: 0;
    text-decoration: none;
}

@media (min-width: 1024px) {
    .standard-button span {
        font-size: 12px;
    }
}

@media (min-width: 1440px) {
    .standard-button span {
        font-size: 13px;
    }
}

.standard-button {
    background: var(--svijetla-primarna);
    border-width: 1px;
    border-style: solid;
    border-color: var(--tamna-primarna);
    padding: 11px 13px 11px 13px;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 8px;
    position: relative;
    justify-content: center;
    align-content: center;
    text-transform: uppercase;
    font-size: 14px;
    line-height: 100%;
    cursor: pointer;
    transition: 300ms cubic-bezier(0.00, 0.00, 0.03, 0.97);
}

@media (min-width: 1024px) {
    .standard-button:hover {
        border-color: var(--brand-primarna);
    }

    .standard-button:hover span {
        color: var(--brand-primarna);
    }

    .standard-button.has-arrow span {
        transition: 300ms cubic-bezier(0.00, 0.00, 0.03, 0.97) 50ms;
    }

    .standard-button.has-arrow .button-arrow {
        transition: 300ms cubic-bezier(0.00, 0.00, 0.03, 0.97);
    }

    .standard-button.has-arrow:hover span {
        transform: translateX(1px);
    }

    .standard-button.has-arrow:hover .button-arrow {
        transform: translateX(3px);
    }
}

.button-arrow {
    display: block;
    background-image: url('../img/button-arrow.svg');
    width: 10px;
    height: 4px;
    background-repeat: no-repeat;
    background-position: center center;
    top: 0px;
    position: relative;
}

.home-product-top-container {
    display: flex;
    flex-direction: column;
    gap: 40px;
    align-items: center;
    justify-content: center;
    align-content: center;
}

@media (min-width: 1024px) {
    .home-product-top-container {
        gap: 40px;
    }
}

@media (min-width: 1440px) {
    .home-product-top-container {
        gap: 50px;
        margin-top: -15px;
    }
}

@media (min-width: 1920px) {
    .home-product-top-container {
        gap: 55px;
        margin-top: -30px;
    }
}

.footer-about-us-heading-container h2 {
    font-family: 'TAY Wingman';
    font-size: 13px;
    margin: 0;
    padding: 0;
    font-weight: normal;
}

@media (min-width: 1024px) {
    .footer-about-us-heading-container h2 {
        font-size: 12px;
    }
}

@media (min-width: 1440px) {
    .footer-about-us-heading-container h2 {
        font-size: 13px;
    }
}

.footer-about-us-heading-container {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    align-content: center;
    gap: 15px;
}

.footer-about-us-heart {
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    display: block;
    width: 10px;
    height: 10px;
}

.footer-about-us-heart.h1 {
    background-image: url('../img/heart-left.svg');
}

.footer-about-us-heart.h2 {
    background-image: url('../img/heart-right.svg');
}

.footer-about-us-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    align-content: center;
    gap: 35px;
}

.footer-info-logo-container {
    background-image: url('../img/wordmark-radial.svg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    width: 80vw;
    height: 27vw;
    flex-shrink: 0;
}

@media (min-width: 1024px) {
    .footer-info-logo-container {
        width: 48vw;
        height: 16vw;
        max-width: 1240px;
        max-height: 350px;
    }
}

.footer-info {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: center;
    padding: 84px 0px 0px 0px;
    gap: 135px;
}

@media (min-width: 1024px) {
    .footer-info {
        gap: 250px;
        padding: 110px 0px 0px 0px;
    }
}

.footer-info-top-section {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: center;
    gap: 50px;
    padding: 0 35px;
}

.footer-info-newsletter-container {
    width: 100%;
    max-width: 610px;
    display:none !important;
}

.footer-info-newsletter-form {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    gap: 52px;
}

.footer-info-newsletter-form label {
    font-family: 'Old Standard TT';
    text-align: center;
    font-size: 17px;
    line-height: 22px;
}

@media (min-width: 1024px) {
    .footer-info-newsletter-form label {
        font-size: 16px;
        line-height: 24px;
    }
}

@media (min-width: 1440px) {
    .footer-info-newsletter-form label {
        font-size: 17px;
    }
}

.footer-info-newsletter-form input {
    text-align: center;
    background: none;
    text-transform: uppercase;
    border-top-style: none;
    border-left-style: none;
    border-right-style: none;
    border-bottom: 1px solid #c9c8c6;
    padding-bottom: 8px;
    font-size: 13px;
    width: 100%;
}

@media (min-width: 1024px) {
    .footer-info-newsletter-form input {
        font-size: 12px;
    }
}

@media (min-width: 1440px) {
    .footer-info-newsletter-form input {
        font-size: 13px;
    }
}

.standard-button.red span {
    color: var(--brand-primarna);
}

.footer-info-newsletter-form .footer-info-form-subcontainer {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: center;
    gap: 54px;
    width: 100%;
}

.footer-info-middle-section {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: center;
    gap: 150px;
    padding: 0 35px;
}

@media (min-width: 1024px) {
    .footer-info-middle-section {
        gap: 230px;
    }
}

.footer-info-middle-section .footer-info-locations-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: center;
    gap: 72px;
}

@media (min-width: 1024px) {
    .footer-info-middle-section .footer-info-locations-container {
        flex-direction: row;
        flex-wrap: wrap;
        row-gap: 100px;
        column-gap: 130px;
        width: 1000px;
    }
}

@media (min-width: 1440px) {
    .footer-info-middle-section .footer-info-locations-container {
        column-gap: 150px;
    }
}

.footer-info-locations-container .location {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex-wrap: nowrap;
    align-content: center;
    gap: 15px;
}

@media (min-width: 1024px) {
    .footer-info-locations-container .location {
        flex-basis: 320px;
    }
}

.footer-info-locations-container .location h3 {
    font-family: 'TAY Wingman';
    font-weight: normal;
    font-size: 14px;
    color: var(--brand-primarna);
    text-align: center;
    margin: 0;
    padding: 0;
}

.footer-info-locations-container .location .location-subcontainer {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: center;
    gap: 6px;
}

.footer-info-locations-container .location .location-subcontainer .location-info-item,
.locations-container .location .location-subcontainer .location-info-item {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    align-content: center;
    position: relative;
    gap: 5px;
    color: var(--tamna-primarna);
    text-transform: uppercase;
    font-size: 12px;
}

.footer-info-locations-container .location-subcontainer .comingsoon-tag {
    font-size: 12px;
    text-transform: uppercase;
    color: var(--svijetla-primarna);
    background: var(--brand-primarna);
    padding: 2px 6px;
    line-height: 110%;
}

.locations-container .location-subcontainer .comingsoon-tag {
    font-size: 13px;
    text-transform: uppercase;
    color: var(--svijetla-primarna);
    background: var(--brand-primarna);
    padding: 1px 6px;
    position: relative;
    top: -6px;
}

.footer-info-locations-container .location-subcontainer .location-info-item a,
.locations-container .location-subcontainer .location-info-item a {
    color: var(--tamna-primarna);
}

.footer-info-locations-container .location .location-subcontainer .location-info-item img,
.locations-container .location .location-subcontainer .location-info-item img {
    top: 1px;
    position: relative;
}

.footer-info-middle-section .footer-info-contacts-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: center;
    gap: 50px;
}

@media (min-width: 1024px) {
    .footer-info-middle-section .footer-info-contacts-container {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 180px;
    }
}

@media (min-width: 1440px) {
    .footer-info-middle-section .footer-info-contacts-container {
    }
}

.contact-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: center;
    gap: 67px;
    margin-bottom: 150px;
}

@media (min-width: 1024px) {
    .contact-container {
        flex-direction: row;
        gap: 200px;
        margin-top: 50px;
        margin-bottom: 200px;
    }
}

.footer-info-middle-section .footer-info-contacts-container .contact {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-content: center;
    align-items: center;
    gap: 10px;
}

@media (min-width: 1024px) {
    .footer-info-middle-section .footer-info-contacts-container .contact {
        width: 150px;
    }
}

.contact-container .contact {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-content: center;
    align-items: center;
    gap: 10px;
}

.footer-info-contacts-container .contact-subcontainer span,
.contact-container .contact-subcontainer span {
    font-family: 'TAY Wingman';
    font-size: 12px;
    color: var(--tamna-primarna);
    margin: 0;
    padding: 0;
    text-transform: uppercase;
}

.footer-info-contacts-container .contact .contact-subcontainer,
.contact-container .contact .contact-subcontainer {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    align-content: center;
    position: relative;
    gap: 5px;
    color: var(--tamna-primarna);
    text-decoration: none;
    text-transform: uppercase;
    font-size: 12px;
}

.footer-info-contacts-container .contact a,
.contact-container .contact a {
    font-family: 'TAY Wingman';
    font-size: 14px;
    text-transform: uppercase;
    color: var(--brand-primarna);
}

.footer-info-contacts-container .contact-subcontainer img,
.contact-container .contact-subcontainer img {
    top: -1px;
    position: relative;
}

.footer-info-bottom-section .footer-info-bottom-section-top-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: center;
    padding: 0 35px;
    gap: 100px;
}

@media (min-width: 1024px) {
    .footer-info-bottom-section .footer-info-bottom-section-top-container {
        width: 400px;
        gap: 60px;
    }
}

.footer-info-bottom-section .footer-info-bottom-section-top-container p {
    text-align: center;
    text-transform: uppercase;
    font-size: 11px;
    line-height: 180%;
}

.footer-info-bottom-section .footer-info-bottom-section-bottom-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: center;
    gap: 40px;
}

.footer-info-bottom-section {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: center;
    gap: 90px;
}

@media (min-width: 1024px) {
    .footer-info-bottom-section {
        gap: 150px;
    }
}

.footer-info-bottom-section .footer-info-bottom-section-bottom-container .legal-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: center;
    gap: 28px;
}

@media (min-width: 1024px) {
    .footer-info-bottom-section .footer-info-bottom-section-bottom-container .legal-container {
        flex-direction: row;
        gap: 230px;
    }
}

.footer-info-bottom-section-bottom-container .legal-container a,
.footer-info-bottom-section-bottom-container .legal-container span {
    font-size: 11px;
    color: var(--tamna-primarna);
    text-transform: uppercase;
    order: 2;
}

@media (min-width: 1024px) {
    .footer-info-bottom-section-bottom-container .legal-container a,
    .footer-info-bottom-section-bottom-container .legal-container span {
        order: unset;
    }
}

.footer-slideshow-container {
    width: 100vw;
    display: block;
}

.footer-slideshow-container .footer-slideshow,
.footer-slideshow-container .desktop-slideshow,
.footer-slideshow-container .mobile-slideshow {
    width: 100vw;
    height: 138vw;
    position: relative;
    overflow: hidden;
}

@media (min-width: 576px) {
    .footer-slideshow-container .footer-slideshow,
    .footer-slideshow-container .desktop-slideshow,
    .footer-slideshow-container .mobile-slideshow {
        height: 80vw;
    }
}

@media (min-width: 1024px) {
    .footer-slideshow-container .footer-slideshow,
    .footer-slideshow-container .desktop-slideshow,
    .footer-slideshow-container .mobile-slideshow {
        height: 26vw;
        max-height: 500px;
    }
}

.slideshow-image-container {
    position: absolute;
    top: -20%;
    left: 0;
    width: 100%;
    height: 140%;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: center;
    opacity: 0;
}

.slideshow-image-container picture {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.slideshow-image-container img {
    object-fit: cover;
    display: block;
    width: 100%;
    height: 100%;
}

.slideshow-image-container.active {
    z-index: 2;
    opacity: 1;
}

.mobile-nav-container .kebab-container {
    display: flex;
    position: absolute;
    top: 0;
    right: 0;
    width: 61px;
    height: 61px;
    align-items: center;
    justify-content: center;
    align-content: center;
    z-index: 2;
    pointer-events: auto;
}

.kebab-container .kebab-menu {
    position: relative;
    display: block;
    width: 23px;
    height: 21px;
    cursor: pointer;
}

.kebab-menu .kebab-menu-line {
    display: block;
    position: absolute;
    left: 0;
    width: 100%;
    height: 1px;
    border: 1px solid var(--tamna-primarna);
    opacity: 0.5;
    transform-origin: center;
    transition: top 0.25s cubic-bezier(0.03, 0.90, 0.66, 0.97), transform 0.25s cubic-bezier(0.03, 0.90, 0.66, 0.97), opacity 0.05s linear;
}

.kebab-menu .kebab-menu-line.l1 {
    top: 0%;
}

.kebab-menu .kebab-menu-line.l2 {
    top: 50%;
    transform: translateY(-50%);
}

.kebab-menu .kebab-menu-line.l3 {
    top: 100%;
    transform: translateY(-100%);
}

.kebab-menu.close .kebab-menu-line.l1 {
    top: 50%;
    transform: translateY(-50%) rotate(45deg);
}

.kebab-menu.close .kebab-menu-line.l2 {
    opacity: 0;
    transform: translateY(-50%) scaleX(0);
}

.kebab-menu.close .kebab-menu-line.l3 {
    top: 50%;
    transform: translateY(-50%) rotate(-45deg);
}

.desktop-nav-container .bottom-nav-bar {
    display: block;
    position: absolute;
    width: 100%;
    height: auto;
    bottom: 0;
    left: 0;

    /* background-color: var(--svijetla-primarna) */
    background-color: var(--svijetla-istaknuto);
    padding: 8px 16px 10px 16px;
    z-index: 3;
    pointer-events: auto;
}

.desktop-nav-container .veil {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.05);
    pointer-events: none;
    opacity: 1;
    z-index: 1;
    transition: all 500ms cubic-bezier(0.32, 0.06, 0.03, 0.97);
}

.desktop-nav-container .veil.inactive {
    opacity: 0;
}

.desktop-nav-container .bottom-nav-bar ul {
    list-style: none;
    display: flex;
    margin: 0;
    padding: 0;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    align-content: center;
    width: 100%;
    height: 100%;
}

.desktop-nav-container .bottom-nav-bar a {
    color: var(--tamna-primarna);
    font-family: 'OT Neue Montreal';
    text-transform: uppercase;
    text-decoration: none;
    font-weight: bold;
    font-size: 18px;
    letter-spacing: 0.7px;
    transition: color 0.25s cubic-bezier(0.03, 0.97, 1.00, 1.00);
}

@media (min-width: 1440px) {
    .desktop-nav-container .bottom-nav-bar a {
        font-size: 19px;
    }
}

@media (min-width: 1920px) {
    .desktop-nav-container .bottom-nav-bar a {
        font-size: 23px;
    }
}

.desktop-nav-container .bottom-nav-bar a:hover,
.desktop-nav-container .bottom-nav-bar a.current {
    color: var(--brand-primarna);
}

@media (min-width: 1024px) {
    /* Extends the trigger's hitbox upward so the mouse never leaves it before reaching the sidebar above. */
    .product-trigger {
        padding-top: 60px;
        padding-bottom: 30px;
    }
}

.desktop-nav-container .sidebar-nav-bar {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: center;
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 400px;
    background-color: var(--svijetla-istaknuto);
    padding: 0 45px 0 0;
    z-index: 2;
    pointer-events: auto;
    transition: transform 500ms cubic-bezier(0.32, 0.06, 0.03, 0.97) 50ms;
}

.desktop-nav-container .sidebar-nav-bar ul {
    padding: 0;
    margin: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    flex-wrap: nowrap;
    align-content: center;
    gap: 12px;
    justify-content: flex-end;
    width: 100%;
}

.desktop-nav-container .sidebar-nav-bar a {
    font-family: 'OT Neue Montreal';
    color: var(--tamna-primarna);
    text-transform: uppercase;
    text-decoration: none;
    font-size: 38px;
}

.desktop-nav-container .sidebar-nav-bar li {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: nowrap;
    align-content: center;
    gap: 17px;
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: 50px;
}

.desktop-nav-container .sidebar-nav-bar li img {
    width: 90px;
    height: 50px;
    object-fit: cover;
    opacity: 0;
    transform: translateX(3px);
}

.sidebar-nav-bar li:hover a {
    color: var(--brand-primarna);
    transform: translateX(3px);
}

.sidebar-nav-bar li:hover img {
    opacity: 1;
}

.sidebar-nav-bar li a,
.sidebar-nav-bar li img {
    transition: all 0.3s cubic-bezier(0.03, 0.97, 1.00, 1.00);
}

.desktop-nav-container .sidebar-nav-bar.inactive {
    transform: translateX(401px);
}

.mobile-nav-container .mobile-nav-subcontainer {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--svijetla-primarna);
    z-index: 1;
    transition: all 500ms cubic-bezier(0.32, 0.06, 0.03, 0.97);
    pointer-events: auto;
}

.mobile-nav-subcontainer ul {
    list-style: none;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-end;
    flex-wrap: wrap-reverse;
    margin: 0;
    padding: 0;
    gap: 5.5vw;
}

@media (min-width: 576px) {
    .mobile-nav-subcontainer ul {
        gap: 3.5vw;
    }
}

.mobile-nav-subcontainer a {
    font-family: 'OT Neue Montreal';
    text-transform: uppercase;
    color: var(--tamna-primarna);
    text-decoration: none;
}

.mobile-nav-subcontainer .first-level a {
    font-size: 14vw;
}

@media (min-width: 576px) {
    .mobile-nav-subcontainer .first-level a {
        font-size: 10vw;
    }
}

.mobile-nav-subcontainer .second-level a {
    font-size: 11vw;
}

@media (min-width: 576px) {
    .mobile-nav-subcontainer .second-level a {
        font-size: 8vw;
    }
}

.mobile-nav-subcontainer li {
    margin: 0;
}

.mobile-nav-subcontainer .sublevel {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    flex-wrap: wrap-reverse;
    justify-content: center;
    flex-grow: 0;
    flex-shrink: 0;
    padding: 0 35px 0 0;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    transition: all 500ms cubic-bezier(0.32, 0.06, 0.03, 0.97);
}

.mobile-nav-subcontainer .second-level {
    left: 0;
    z-index: 1;
}

.mobile-nav-subcontainer .second-level.inactive {
    left: 100%;
}

.mobile-nav-subcontainer .first-level.inactive {
    left: -75%;
    opacity: 0.3;
}

.mobile-nav-container .mobile-nav-subcontainer.inactive {
    left: 101%;
}

h1.about-us-hero-headline {
    font-family: 'TAY Wingman';
    font-weight: normal;
    font-size: 17px;
}

.old-standard-text {
    font-family: 'Old Standard TT';
    font-size: 16px;
    text-transform: none;
    text-align: center;
    margin: 0;
    padding: 0;
    letter-spacing: -0.01em;
    line-height: 25px;
}

@media (min-width: 576px) {
    .old-standard-text {
        font-size: 17px;
    }
}

#about-us-highlights .highlight-headline-container h2 {
    font-family: 'TAY Wingman';
    font-weight: normal;
    font-size: 15px;
    color: var(--svijetla-primarna);
    background: var(--brand-primarna);
    margin: 0;
    padding: 2px 7px 1px 7px;
    letter-spacing: 1px;
    flex-shrink: 1;
    flex-grow: 1;
    white-space: nowrap;
}

@media (min-width: 1920px) {
    #about-us-highlights .highlight-headline-container h2 {
        font-size: 16px;
    }
}

#about-us-highlights .highlight-headline-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: center;
    position: relative;
    gap: 7px;
    padding: 0 35px;
    order: 2;
}

@media (min-width: 1024px) {
    #about-us-highlights .highlight-headline-container {
        display: none;
    }
}

#about-us-highlights .highlight-text-container p {
    line-height: 150%;
}

@media (min-width: 1024px) {
    #about-us-highlights .highlight-text-container p {
        line-height: 175%;
    }
}

#about-us-highlights .highlights-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: flex-start;
    gap: 20vw;
}

@media (min-width: 576px) {
    #about-us-highlights .highlights-container {
        gap: 20vw;
    }
}

@media (min-width: 768px) {
    #about-us-highlights .highlights-container {
        gap: 10vw;
    }
}

@media (min-width: 1024px) {
    #about-us-highlights .highlights-container {
        gap: 245px;
    }
}

@media (min-width: 1920px) {
    #about-us-highlights .highlights-container {
        gap: 290px;
    }
}

#about-us-highlights .highlight-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: flex-start;
    min-width: 100vw;
    position: relative;
}

@media (min-width: 1024px) {
    #about-us-highlights .highlight-item {
        width: 100%;
        min-width: unset;
    }
}

@media (min-width: 1920px) {
    #about-us-highlights .highlight-item {
        width: 100%;
        min-width: unset;
    }
}

#about-us-highlights .visual-container {
    display: block;
    order: 1;
    position: relative;
    width: 100%;
    filter: drop-shadow(15px 50px 10px rgba(0, 0, 0, 0.06));
}

@media (min-width: 576px) {
    #about-us-highlights .visual-container {
        margin-bottom: -10vw;
    }
}

@media (min-width: 768px) {
    #about-us-highlights .visual-container {
        margin-bottom: -11vw;
    }
}

@media (min-width: 1024px) {
    #about-us-highlights .visual-container {
        position: absolute;
        left: 0;
        transform: translateY(-50%);
        width: 580px;
    }
}

/* Keep responsive <picture> wrappers behaving like the previous direct <img> layout. */
.visual-container picture {
    display: block;
    width: 100%;
}

#about-us-highlights.content-container {
    padding: 60px 0 140px 0;
    position: relative;
    z-index: 2;
    background: var(--svijetla-istaknuto);
}

@media (min-width: 1024px) {
    #about-us-highlights.content-container {
        max-width: 1600px;
        margin: 50px auto 150px auto;
        padding: 260px 0;
    }
}

@media (min-width: 2560px) {
    #about-us-highlights.content-container {
        width: 1920px;
    }
}

#about-us-highlights .highlight-text-container {
    padding: 35px 0 0 0;
    order: 3;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    align-content: center;
    gap: 50px;
    max-width: 242px;
}

@media (min-width: 576px) {
    #about-us-highlights .highlight-text-container {
        max-width: 350px;
        padding: 45px 0 0 0;
    }
}

@media (min-width: 768px) {
    #about-us-highlights .highlight-text-container {
        padding: 50px 0;
        max-width: 400px;
    }
}

@media (min-width: 1024px) {
    #about-us-highlights .highlight-text-container {
        padding: 60px 0 0 0;
        max-width: 480px;
    }
}

@media (min-width: 1024px) {
    #about-us-highlights .restaurants-marquee-container {
        flex-basis: 100%;
        min-width: unset;
        transform: rotate(-2deg);
        position: relative;
        top: -95px;
        width: 100%;
    }
}

.restaurants-marquee-container {
    --marquee-logo-count: 6;
    --marquee-logo-width: 104px;
    --marquee-logo-gap: 80px;
    display: flex;
    flex-wrap: nowrap;
    overflow: hidden;
    width: 100%;
    max-width: 100%;
    flex: none;
    display:none;
}

.restaurants-marquee-subsubcontainer {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: nowrap;
    align-content: center;
    flex: 0 0 auto;
    width: calc(var(--marquee-logo-count) * (var(--marquee-logo-width) + var(--marquee-logo-gap)));
    gap: 0;
}

@media (min-width: 576px) {
    .restaurants-marquee-container {
        --marquee-logo-width: 89px;
        --marquee-logo-gap: 70px;
    }
}

@media (min-width: 1024px) {
    .restaurants-marquee-container {
        --marquee-logo-width: 99px;
        --marquee-logo-gap: 115px;
    }
}

.restaurants-marquee-subsubcontainer .restaurant-logo-container {
    flex-basis: var(--marquee-logo-width);
    flex-grow: 0;
    flex-shrink: 0;
    margin-right: var(--marquee-logo-gap);
}

.restaurants-marquee-subsubcontainer .restaurant-logo-container img {
    display: block;
    width: 100%;
    height: auto;
}

@keyframes scroll {
    from {
        transform: translateX(0%);
    }

    to {
        transform: translateX(-100%);
    }
}

@-webkit-keyframes scroll {
    from {
        transform: translateX(0%);
    }

    to {
        transform: translateX(-100%);
    }
}

.restaurants-marquee-subcontainer {
    display: flex;
    width: calc(var(--marquee-logo-count) * (var(--marquee-logo-width) + var(--marquee-logo-gap)));
    min-width: calc(var(--marquee-logo-count) * (var(--marquee-logo-width) + var(--marquee-logo-gap)));
    flex: 0 0 auto;
    -webkit-animation: scroll 10s linear infinite;
    animation: scroll 10s linear infinite;
    padding-right: 0;
    margin-right: -1px;
}

#about-us-hero.content-container {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: center;
    width: 100%;
    height: auto;
    gap: 20px;
    padding: 35px 0;
}

@media (min-width: 1024px) {
    #about-us-hero.content-container {
        height: 100vh;
    }
}

@media (min-width: 576px) {
    .visual-container.fork picture {
        width: 77vw;
    }
}

@media (min-width: 768px) {
    .visual-container.fork picture {
        width: 69vw;
        max-width: 620px;
    }
}

@media (min-width: 1024px) {
    .visual-container.fork picture {
        max-width: unset;
        width: 710px;
    }
}

@media (min-width: 576px) {
    .visual-container.kulen picture {
        width: 71vw;
    }
}

@media (min-width: 768px) {
    .visual-container.kulen picture {
        width: 65vw;
        max-width: 590px;
    }
}

@media (min-width: 1024px) {
    .visual-container.kulen picture {
        max-width: unset;
        width: 560px;
        top: 10%;
    }
}

@media (min-width: 1920px) {
    .visual-container.kulen picture {
        width: 570px;
    }
}

@media (min-width: 2560px) {
    .visual-container.kulen picture {
        width: 650px;
    }
}

.about-us-hero-subcontainer {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    align-content: center;
    gap: 30px;
    padding: 0 35px;
}

#about-us-hero .old-standard-text {
    line-height: 160%;
    max-width: 350px;
}

.content-container.hero-container {
    padding: 0;
    display: flex;
    height: auto;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    align-content: center;
    overflow: hidden;

    /* max-height: 650px */
}

@media (min-width: 1024px) {
    .content-container.hero-container {
        height: 100vh;
        max-height: 980px;
    }
}

@media (min-width: 1440px) {
    .content-container.hero-container {
        max-height: 1040px;
    }
}

@media (min-width: 1920px) {
    .content-container.hero-container {
        max-height: 1160px;
    }
}

.hero-container .hero-subcontainer {
    flex: 0 0 50%;
    width: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: center;
}

@media (min-width: 576px) {
    .hero-container .hero-visual {
        flex-basis: 60vw;
    }
}

@media (min-width: 768px) {
    .hero-container .hero-visual {
        flex-basis: 50vw;
    }
}

@media (min-width: 1024px) {
    .hero-container .hero-visual {
        flex-basis: 35%;
        flex-shrink: 1;
        flex-grow: 1;
    }
}

@media (min-width: 1440px) {
    .hero-container .hero-visual {
        flex-basis: 400px;
    }
}

@media (min-width: 1920px) {
    .hero-container .hero-visual {
        flex-basis: 450px;
    }
}

.hero-container .hero-subcontainer.hero-visual {
    overflow: hidden;
    position: relative;
    z-index: 1;
    flex-shrink: 1;
    flex-grow: 1;
    flex-basis: 75vw;
}

.hero-container .hero-visual img {
    display: block;
    width: 100%;
    height: 116%;
    flex-shrink: 0;
    object-fit: cover;
    position: relative;
    z-index: 1;
}

.hero-container .hero-subcontainer.hero-copy {
    gap: 30px;
    padding: 80px 35px 90px 35px;
    flex: 0 0 auto;
    background: var(--svijetla-primarna);
    position: relative;
    z-index: 2;
}

@media (min-width: 576px) {
    .hero-container .hero-subcontainer.hero-copy {
        padding: 110px 35px 120px 35px;
    }
}

@media (min-width: 768px) {
    .hero-container .hero-subcontainer.hero-copy {
        padding: 130px 35px 140px 35px;
    }
}

@media (min-width: 1024px) {
    .hero-container .hero-subcontainer.hero-copy {
        flex-basis: auto;
        flex-grow: 1;
    }
}

.content-container.product-sections {
    padding: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-content: flex-start;
    align-items: center;
    gap: 50px;
}

@media (min-width: 576px) {
    .content-container.product-sections {
        gap: 40px;
    }
}

@media (min-width: 1024px) {
    .content-container.product-sections {
        max-width: 1600px;
        margin: 0 auto 150px auto;
        gap: 140px;
    }
}

@media (min-width: 1440px) {
    .content-container.product-sections {
        gap: 180px;
    }
}

@media (min-width: 1920px) {
    .content-container.product-sections {
        gap: 200px;
    }
}

.product-sections .product-section {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: center;
}

@media (min-width: 1024px) {
    .product-sections .product-section {
        flex-direction: row;
    }
}

.product-section-subcontainer.visual img {
    display: block;
    width: 100%;
    height: 116%;
    flex-shrink: 0;
    object-fit: cover;
}

.product-section-subcontainer.copy {
    padding: 80px 35px 90px 35px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    flex-wrap: nowrap;
    gap: 33px;
}

@media (min-width: 576px) {
    .product-section-subcontainer.copy {
        padding: 90px 65px 100px 65px;
    }
}

@media (min-width: 1024px) {
    .product-section-subcontainer.copy {
        flex-basis: 50%;
        flex-grow: 0;
        padding: 0 10vw;
    }
}

@media (min-width: 1440px) {
    .product-section-subcontainer.copy {
        padding: 200px;
    }
}

h2.product-section-headline {
    font-family: 'TAY Wingman';
    font-weight: normal;
    font-size: 15px;
    color: var(--svijetla-primarna);
    background: var(--brand-primarna);
    margin: 0;
    padding: 3px 7px 2px 7px;
    letter-spacing: 1px;
    flex-shrink: 1;
    flex-grow: 0;
    white-space: nowrap;
    line-height: 100%;
}

.product-section-subcontainer .product-section-headline-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: center;
}

.product-section .product-section-subcontainer.copy .old-standard-text {
    text-align: left;
}

@media (min-width: 1024px) {
    .product-section .product-section-subcontainer.copy .old-standard-text {
        max-width: 500px;
    }
}

.locations-container .location h3 {
    color: var(--brand-primarna);
    font-size: 31px;
    margin: 0;
    padding: 0;
}

@media (min-width: 1024px) {
    .locations-container .location h3 {
        font-size: 42px;
    }
}

@media (min-width: 1440px) {
    .locations-container .location h3 {
        font-size: 48px;
    }
}

.locations-container .location {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    gap: 25px;
}

@media (min-width: 1024px) {
    .locations-container .location {
        padding: 115px 60px 120px 60px;
        border-right: 1px solid #D8D6D1;
        border-bottom: 1px solid #D8D6D1;
        gap: 30px;
    }
}

.locations-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: center;
    gap: 95px;
    margin-bottom: 130px;
}

@media (min-width: 1024px) {
    .locations-container {
        margin: 0 auto;
        max-width: 1600px;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 0;
        border-top: 1px solid #D8D6D1;
        border-left: 1px solid #D8D6D1;
        margin-bottom: 150px;
    }
}

.locations-container .location .location-subcontainer {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: center;
    gap: 7px;
}

#home-hero .wingman-text {
    max-width: 45vw;
}

@media (min-width: 768px) {
    #home-hero .wingman-text {
        max-width: 280px;
    }
}

#home-showcase .wingman-text {
    max-width: 216px;
}

@media (min-width: 768px) {
    #home-showcase .wingman-text {
        max-width: 500px;
    }
}

@media (min-width: 1024px) {
    #home-showcase .wingman-text {
        font-size: 12px;
        line-height: 150%;
    }
}

@media (min-width: 1440px) {
    #home-showcase .wingman-text {
        font-size: 13px;
        max-width: 260px;
    }
}

section#home-showcase {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: center;

    /* background-image: url('../img/small-desktop-referenca.png') */
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center -52%;
}

@media (min-width: 1024px) {
    section#home-showcase {
        margin-bottom: 100px;
    }
}

.home-product .wingman-text {
    max-width: 270px;
    width: 100vw;
}

@media (min-width: 576px) {
    .home-product .wingman-text {
        max-width: 400px;
    }
}

@media (min-width: 768px) {
    .home-product .wingman-text {
        max-width: 800px;
        width: 70vw;
    }
}

.footer-info-newsletter-form input::placeholder {
    color: var(--tamna-primarna);
    opacity: 0.35;
}

.footer-info-bottom-section-top-container img.bottom-logo {
    width: 50vw;
    max-width: 500px;
}

@media (min-width: 1024px) {
    .footer-info-bottom-section-top-container img.bottom-logo {
        width: 250px;
    }
}

.footer-info-bottom-section-bottom-container .legal-container .copyright {
    order: 1;
}

@media (min-width: 1024px) {
    .footer-info-bottom-section-bottom-container .legal-container .copyright {
        order: unset;
    }
}

#home-showcase .small-desktop-showcase-container,
#home-showcase .large-desktop-showcase-container {
    display: none;
}

.mobile-showcase-container {
    display: flex;
    position: relative;
    width: 100%;
    height: 200vh;
    height: 350vw;
    padding: 0;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    align-content: center;
    margin-top: -7vh;
    margin-top: -7svh;
}

@media (min-width: 768px) {
    .mobile-showcase-container {
        display: none;
    }
}

.mobile-showcase-container .mobile-showcase-item {
    display: flex;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 0 30px;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
}

.mobile-showcase-item img {
    display: block;
    width: 100%;
    height: 150vw;
    object-fit: cover;
}

.mobile-showcase-container .mobile-showcase-subcontainer {
    width: 100vw;
    position: relative;
}

.mobile-showcase-container .pinning-container,
.mobile-showcase-container .parallax-container {
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 2;
}

#home-showcase .arrow-container {
    display: flex;
    height: 100%;
    padding: 140px 0 260px 0;
    top: 50%;
    position: absolute;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: center;
    transform: translateY(-50%);
}

@media (min-width: 768px) {
    #home-showcase .arrow-container {
        height: 41%;
        bottom: 6vw;
        top: unset;
        transform: translateY(0%);
    }
}

.arrow-container .stem {
    width: 1px;
    background: rgba(85, 85, 85, 0.5);
    flex-basis: 100%;
    flex-grow: 1;
    flex-shrink: 1;
    opacity: 0.3;
}

.arrow-container .end {
    position: relative;
    top: -17px;
    left: 50%;
    width: 15px;
    height: 15px;
    border-right: 1px solid rgba(85, 85, 85, 0.5);
    border-bottom: 1px solid rgba(85, 85, 85, 0.5);
    transform: translateX(-50%) rotate(45deg);
    opacity: 0.3;
}

@media (min-width: 1024px) {
    .arrow-container .end {
        width: 19px;
        height: 19px;
        top: -22px;
    }
}

#home-showcase .small-desktop-showcase-container {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: center;
    padding: 0 0 20vw 0;
    position: relative;
}

@media (min-width: 768px) {
    #home-showcase .small-desktop-showcase-container {
        display: flex;
    }
}

@media (min-width: 1024px) {
    #home-showcase .small-desktop-showcase-container {
        display: none;
    }
}

.small-desktop-showcase-item.portrait {
    width: 27vw;
}

.small-desktop-showcase-item img {
    display: block;
    width: 100%;
    height: auto;
}

.small-desktop-showcase-item.landscape {
    width: 32vw;
}

.small-desktop-showcase-item video {
    display: block;
    width: 100%;
    height: auto;
}

.small-desktop-showcase-container .subsection,
.large-desktop-showcase-container .subsection {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: center;
}

#small-desktop-showcase-item-1 {
    left: -26vw;
    height: 15vw;
}

.small-desktop-showcase-item {
    position: relative;
}

#small-desktop-showcase-item-2 {
    right: -26vw;
    height: 47vw;
}

#small-desktop-showcase-item-3 {
    left: -19vw;
    height: 16vw;
}

#small-desktop-showcase-item-4 {
    right: -22vw;
    height: 19vw;
}

#small-desktop-showcase-item-5 {
    right: -19vw;
    height: 10vw;
}

#small-desktop-showcase-item-6 {
    left: -25vw;
    height: 23vw;
}

#small-desktop-showcase-item-7 {
    right: -25vw;
    height: 35vw;
}

#small-desktop-showcase-item-8 {
    left: -19vw;
}

#home-showcase .arrow-container.second {
    bottom: 4vw;
    height: 41%;
}

@media (min-width: 1024px) {
    #home-showcase .arrow-container.second {
        height: 45%;
        bottom: 4vw;
    }
}

#home-showcase .large-desktop-showcase-container {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: center;
    padding: 0 0 10vw 0;
    position: relative;
}

@media (min-width: 1024px) {
    #home-showcase .large-desktop-showcase-container {
        display: flex;
    }
}

.large-desktop-showcase-item {
    position: relative;
}

.large-desktop-showcase-item.portrait {
    width: 20vw;
}

@media (min-width: 1920px) {
    .large-desktop-showcase-item.portrait {
        width: 16vw;
    }
}

.large-desktop-showcase-item.landscape {
    width: 25.5vw;
}

@media (min-width: 1920px) {
    .large-desktop-showcase-item.landscape {
        width: 21vw;
    }
}

.large-desktop-showcase-item img {
    display: block;
    width: 100%;
    height: auto;
}

.large-desktop-showcase-item video {
    display: block;
    width: 100%;
    height: auto;
}

#large-desktop-showcase-item-1 {
    left: -34vw;
    height: 6vw;
}

#large-desktop-showcase-item-2 {
    right: -32vw;
    height: 17vw;
}

#large-desktop-showcase-item-4 {
    right: -28vw;
    height: 17vw;
}

#large-desktop-showcase-item-3 {
    height: 21vw;
}

#large-desktop-showcase-item-5 {
    left: -29vw;
}

#large-desktop-showcase-item-6 {
    height: 8vw;
}

#large-desktop-showcase-item-7 {
    right: -35vw;
    height: 9vw;
}

#large-desktop-showcase-item-8 {
    left: -34vw;
    height: 18vw;
}

#large-desktop-showcase-item-9 {
    left: -5vw;
    height: 22vw;
}

#large-desktop-showcase-item-10 {
    right: -25vw;
}

.small-desktop-showcase-container .wingman-text.second {
    margin: 35vw 0 16vw;
}

.small-desktop-showcase-container .wingman-text.first {
    margin-bottom: 10vw;
}

.large-desktop-showcase-container .wingman-text.first {
    margin-bottom: 10vw;
}

@media (min-width: 1024px) {
    #home-showcase .wingman-text.first {
        max-width: 250px;
    }
}

.large-desktop-showcase-container .wingman-text.second {
    margin: -4vw 0 10vw;
}

@media (min-width: 1024px) {
    #home-showcase .wingman-text.second {
        max-width: 220px;
    }
}

#home-showcase .arrow-container.first {
    top: 8vw;
    height: 47%;
}

@media (min-width: 1024px) {
    #home-showcase .arrow-container.first {
        height: 41%;
    }
}

.footer-about-us-container .footer-about-us-subcontainer {
    width: 100vw;
    height: 274vw;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: center;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 100vw;
    position: relative;
}

@media (min-width: 576px) {
    .footer-about-us-container .footer-about-us-subcontainer {
        height: 260vw;
    }
}

@media (min-width: 1024px) {
    .footer-about-us-container .footer-about-us-subcontainer {
        width: 1920px;
        height: 1500px;
    }
}

@media (min-width: 1920px) {
    .footer-about-us-container .footer-about-us-subcontainer {
        width: 100vw;
        height: 78.1vw;
    }
}

.footer-about-us-container .cta-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: center;
    gap: 40px;
    position: relative;
    z-index: 3;
}

.pattern-container {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    pointer-events: none;
}

.footer-about-us-container .footer-about-us-subcontainer .pattern-container.home-pattern-dual {
    overflow: hidden;
}

.footer-about-us-container .footer-about-us-subcontainer .pattern-container .home-pattern-layer {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.footer-about-us-container .footer-about-us-subcontainer .pattern-container .home-pattern-layer-l1 {
    z-index: 1;
}

.footer-about-us-container .footer-about-us-subcontainer .pattern-container .home-pattern-layer-l2 {
    z-index: 2;
}

@media (min-width: 1024px) {
    #about-us-highlights .highlight-item.restaurant-quality {
        margin: 0;
        padding: 0;
    }
}

#about-us-highlights .highlight-headline-container.desktop {
    display: none;
}

@media (min-width: 1024px) {
    #about-us-highlights .highlight-headline-container.desktop {
        display: flex;
    }
}

#about-us-hero .pattern-container.desktop {
    display: none;
}

@media (min-width: 1024px) {
    #about-us-hero .pattern-container.desktop {
        display: flex;
        position: absolute;
        width: 100%;
        height: 100%;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        align-content: center;
    }
}

#about-us-hero .pattern-container {
    position: relative;
}

#about-us-highlights #about-ut-slavonico.standard-button {
    margin-top: 20px;
}

#about-us-highlights picture img {
    width: 100%;
}

#about-us-hero .pattern-container.upper {
    height: 67vw;
}

@media (min-width: 1024px) {
    #about-us-hero .pattern-container.upper {
        display: none;
    }
}

#about-us-hero .pattern-container.lower {
    height: 131vw;
}

@media (min-width: 576px) {
    #about-us-hero .pattern-container.lower {
        height: 96vw;
    }
}

@media (min-width: 1024px) {
    #about-us-hero .pattern-container.lower {
        display: none;
    }
}

@media (min-width: 1024px) {
    #about-us-hero .pattern-container.desktop .pattern-subcontainer {
        width: 1920px;
        height: 1110px;
    }
}

@media (min-width: 1920px) {
    #about-us-hero .pattern-container.desktop .pattern-subcontainer {
        width: 110vw;
        height: 88.1vw;
    }
}

.highlights-container .highlight-item .highlights-item-content-subcontainer {
    order: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: center;
}

@media (min-width: 1920px) {
    #about-us-highlights .visual-container.fork {
        width: 660px;
        height: auto;
    }
}

@media (min-width: 1024px) {
    #about-us-highlights .visual-container.kulen {
        right: 0;
        left: unset;
        top: 10%;
    }
}

@media (min-width: 1920px) {
    #about-us-highlights .visual-container.kulen {
        width: 500px;
        height: auto;
    }
}

@media (min-width: 1024px) {
    #about-us-highlights .highlight-item.traditional-craft {
        padding: 0;
        margin: 0;
    }
}

.main-container {
    position: relative;
}

.restaurant-quality .firstLine {
    transform: rotate(-3.11deg);
}

.restaurant-quality .secondLine {
    transform: rotate(-1.67deg);
}

.traditional-craft .firstLine {
    transform: rotate(1.02deg);
}

.traditional-craft .secondLine {
    transform: rotate(2.63deg);
}

.highlights-container .visual-animation-container {
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.highlights-container .fork .visual-animation-container {
    align-items: flex-start;
}

.kulen .visual-animation-container {
    align-items: flex-end;
}

.restaurant-quality .desktop h2 {
    transform: rotate(-1.28deg);
}

.traditional-craft .desktop h2 {
    transform: rotate(1.16deg);
}

.hero-container .hero-visual .desktop {
    display: none;
}

@media (min-width: 1024px) {
    .hero-container .hero-visual .desktop {
        display: block;
    }
}

@media (min-width: 576px) {
    .hero-subcontainer .wingman-text {
        max-width: 400px;
    }
}

@media (min-width: 1024px) {
    .hero-subcontainer .wingman-text {
        max-width: 700px;
    }
}

@media (min-width: 1024px) {
    .hero-container .hero-visual .mobile {
        display: none;
    }
}

.product-section-subcontainer.visual {
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: center;
    width: 100%;
    height: 110vw;
}

@media (min-width: 576px) {
    .product-section-subcontainer.visual {
        height: 90vw;
    }
}

@media (min-width: 768px) {
    .product-section-subcontainer.visual {
        height: 80vw;
    }
}

@media (min-width: 1024px) {
    .product-section-subcontainer.visual {
        flex-basis: 50%;
        flex-grow: 0;
        min-width: 0;
        height: 54vw;
        max-height: 840px;
    }
}

@media (min-width: 1024px) {
    .product-sections .product-section:nth-child(even) {
        flex-direction: row-reverse;
    }
}

@media (min-width: 1024px) {
    #about-us-highlights .visual-container.fork {
        top: -20%;
    }
}

.standard-button.bright {
    background: var(--svijetla-istaknuto);
}

@media (min-width: 1024px) {
    .content-container.hero-container.contact,
    .content-container.hero-container.locations {
        height: 600px;
    }
}

section.content-container.locations {
}

@media (min-width: 1024px) {
    section.content-container.locations {
        margin-bottom: 150px;
    }
}

.content-container.hero-container.locations-hero,
.content-container.hero-container.contacts-hero {
    margin-bottom: 50px;
}

@media (min-width: 1024px) {
    .content-container.hero-container.locations-hero,
    .content-container.hero-container.contacts-hero {
        margin-bottom: 0;
    }
}

@media (min-width: 1024px) {
    .content-container.hero-container.locations-hero,
    .content-container.hero-container.contacts-hero {
        max-height: 500px;
    }
}

footer {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: center;
    position: relative;
}

@media (min-width: 1024px) {
    footer {
        gap: 100px;
    }
}

.mobile-nav-subcontainer .first-level {
    z-index: 2;
}

.large-desktop-showcase-container .subsection {
    padding-top: 10vw;
}

footer a * {
    text-decoration: underline;
}

.mobile-showcase-container .wingman-text.second {
    padding: 80vw 0 12vw 0;
}

.basic-page-text-container {
    max-width: 800px;
    margin: 0 auto 150px auto;
    padding: 0 60px;
}