/* Import CSS files in order */
@import url("reset.css");
@import url("base.css");
@import url("color.css");
@import url("typography.css");
@import url("component.css");

:root{

    --header-height:15rem;
    --header-shrink:10rem;

}
@media(width < 992px){
    :root{

        --header-height:var(--header-shrink);

    }
}

/* Header */
header{height: var(--header-height); display: flex; align-items: center; position: fixed; left: 0; top: 0; width: 100%; z-index: 9999; transition: 100ms linear;}
header.header-scrolled{height: var(--header-shrink); background-color: var(--body-color); box-shadow: 0 0 .2rem rgba(0,0,0,.2);}
header + *{margin-top: var(--header-height);}
header .container{display: flex; align-items: center; gap: 0 var(--md);}
header .logo{display: flex; align-items: center; margin-right: auto;}
header .logo img{max-width: 27rem;}
header nav{display: flex; align-items: center; gap: 0 var(--md);}
header nav a{font-size: var(--body-font-size); color: var(--dark-grey); transition: var(--transition); line-height: 1;}
header .logo, header .btn{position: relative; z-index: 999;}
@media(width < 1200px){
    header nav a{font-size: var(--fs);}
    header nav{gap: 0 var(--sm);}
    header .logo img{max-width: 24rem;}
}
@media(width > 991px){
    header nav a{padding: 1rem 0; position: relative;}
    header nav a::after{position: absolute; left: 0; bottom: 0; width: 100%; height: .1rem; content: ""; background-color: var(--primary); transform: scaleX(0); transform-origin: left; transition: var(--transition);}
    header nav a:hover::after{transform: scaleX(1); transform-origin: left;}
    header nav a:hover{color: var(--primary);}
}
@media(width < 992px){
    header .container{gap: 0 var(--gutter);}
    header nav{flex-direction: column; justify-content: center; gap: var(--gutter); position: fixed; left: 0; top: 0; width: 100%; height: 100dvh; z-index: 99; background-color: var(--body-color); opacity: 0; visibility: hidden; transition: var(--transition);}
    header nav a{font-size: clamp(2rem, 3rem, 5vw);}
    header nav.active {opacity: 1; visibility: visible;}
    html.menu-active, body.menu-active {overflow-y: hidden;}
}
@media(width < 768px){
    header .logo img{max-width: 20rem;}
}
@media(width < 576px){
    header .logo img{max-width: 16rem;}
}

/* Section */
.section{padding: var(--xl) 0;}
@media(width < 992px){
    .section{padding: var(--lg) 0;}
}
@media(width < 768px){
    .section{padding: var(--md) 0;}
}
@media(width < 576px){
    .section{padding: var(--sm) 0;}
}

/* Section Block */
.section-block:not(:last-child){margin-bottom: var(--md);}
@media(width < 992px){
   .section-block:not(:last-child){margin-bottom: var(--sm);}
}

/* Section Block Header */
.section-block-header > :not(:last-child){margin-bottom: var(--md);}
@media(width < 992px){
   .section-block-header > :not(:last-child){margin-bottom: var(--sm);}
}

.winery-grid{display: grid; grid-template-columns: auto 1fr; gap: var(--md);}
.winery-grid > :first-child{min-width: 25vw;}
@media(width < 992px){
   .winery-grid{grid-template-columns: 1fr; gap: var(--gutter);}
}

.image-grid{display: grid; grid-template-columns: repeat(auto-fit, minmax(25rem, 1fr)); gap: 1rem;}
.image-grid figure img{border-radius: var(--border-radius); width: 100%;}

.production-grid{display: grid; grid-template-columns: 1fr auto; gap: var(--md); align-items: center;} 
.production-grid figure{max-width: 45rem;}
@media(width < 992px){
   .production-grid{grid-template-columns: 1fr; gap: var(--gutter);}
}

.border-list{border-top: .1rem solid var(--primary);}
.border-list li{min-height: 9rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem var(--gutter); padding: var(--gutter-half) 0; border-bottom: .1rem solid var(--primary);}
@media(width < 992px){
   .border-list li{min-height: auto; flex-direction: column; align-items: flex-start;}
}

.banner{min-height: 85rem; padding: var(--xl) var(--md); border-radius: var(--border-radius); position: relative; isolation: isolate; display: flex; flex-direction: column;}
.banner > :first-child{margin-bottom: auto;}
.banner::before, .banner::after{position: absolute; left: 0; top: 0; width: 100%; height: 100%; content: ""; border-radius: inherit;}
.banner::before{background-size: cover; background-position: center center; background-repeat: no-repeat; opacity: 50%; z-index: -2;}
.banner-1::after{background-color: rgba(var(--primary-medium-rgb), 75%); z-index: -1;}
.banner-1.banner-1-secondary::after{background-color: rgba(var(--secondary-medium-rgb), 30%); z-index: -1;}
.banner-1::before{background-image: url('../images/banner-1.jpg');}
.banner.flex-direction-row > .section-block > :not(:last-child){margin-bottom: var(--md);}
.banner-2::before{background-image: url('../images/banner-2.jpg') !important; opacity: 100% !important;}
@media(width < 1400px){
   .banner{min-height: 75rem;}
}
@media(width < 1200px){
   .banner{min-height: 65rem; padding: var(--lg) var(--sm);}
}
@media(width < 992px){
   .banner{min-height: 55rem; padding: var(--md) var(--gutter);}
   .banner.flex-direction-row > .section-block > :not(:last-child){margin-bottom: var(--gutter);}
   .banner.flex-direction-row > .section-block h2 br{display: none;}
}
@media(width < 768px){
   .banner{min-height: 45rem;}
}

.card > :not(:last-child){margin-bottom: var(--sm);}
.card figure{aspect-ratio: 1;}
.card figure img{object-fit: cover; width: 100%; height: 100%; border-radius: var(--border-radius);}
.card-content > :not(:last-child){margin-bottom: var(--gutter-half);}
.card-content p{max-width: 80%;}
.card-slider .swiper-slide{width: auto;}
@media(width < 768px){
   .card-slider .card{width: 30rem;}
   .card-content p{max-width: 100%;}
}

.footer-box{border: .1rem solid var(--primary); border-radius: var(--border-radius); padding: var(--md); display: flex; gap: var(--gutter) var(--xl);}
.footer-logo{max-width: 25rem;}
.footer-links{display: flex; flex-direction: column; justify-content: space-between;}
.footer-links li, .other-links li{display: flex; align-items: center;}
.footer-links li:not(:last-child), .other-links li:not(:last-child){margin-bottom: var(--gutter-half);}
.footer-links li a, .other-links li a{display: flex; line-height: 1; color: var(--primary);} 
.footer-box-content{display: flex; gap: 0 var(--2xl);}
.adress p{line-height: 1; color: var(--primary);}
.adress p:not(:last-child){margin-bottom: 2rem;}
.footer-content-block{display: flex; flex-direction: column;}
.footer-content-block > :not(:last-child){margin-bottom: 2rem;}
.footer-content-block > :last-child{margin-top: auto;}
.footer-box .other-links{margin-left: auto; align-self: flex-end;}
@media(width < 1400px){
   .footer-box, .footer-box-content{gap: var(--gutter) var(--md);}
}
@media(width < 1200px){
   .footer-logo{max-width: 17rem;}
}
@media(width < 992px){
    .footer-box{flex-direction: column; gap: var(--md) var(--gutter);}
    .footer-box .other-links{margin-left: inherit; align-self: flex-start;}
    .footer-box-content{flex-direction: column;}
}
@media(width < 768px){
    .footer-box{padding: var(--gutter);}
}

.page-hero-section > .container > :not(:last-child){margin-bottom: var(--md);}
.page-hero-section .breadcrumb:not(:last-child){margin-bottom: var(--gutter);}

.posts > :first-child{padding-top: 0;}
.posts > :last-child{padding-bottom: 0;}
.post{padding: var(--md) 0;}
.post:not(:last-child){border-bottom: .1rem solid var(--primary);}
.post{display: flex; align-items: center; gap: var(--gutter);}
.post-content-block h2:not(:last-child){margin-bottom: var(--md);}
.post-content{flex: 1 0 0%;}
/*.post figure{width: clamp(40vw, 40vw, 75rem);}*/
@media(width > 992px){
    .post figure{order: 2;}
}
@media(width < 991px){
    .post{flex-direction: column; align-items: flex-start;}
    .post-content-block h2:not(:last-child){margin-bottom: var(--gutter);}
    .post figure{width: 80%;}
}
@media(width < 768px){
    .post figure{width: 100%;}
}

.box{padding: var(--md);}
@media(width < 768px){
    .box{padding: var(--gutter);}
}

.bg-primary-medium .border-list, .bg-primary-medium .border-list li{border-color: white;}
.bg-primary-medium .border-list li p{color: white;}

.history{display: flex; gap: var(--md);}
.history > :first-child{flex: 1 0 0%;}
.border-list li > .two-column{width: 100%; display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--gutter-half);}
.two-column p:nth-of-type(2){text-align:end;}
.border-list li > .three-column{width: 100%; display: grid; grid-template-columns: auto auto auto; gap: var(--gutter-half); justify-content: space-between;}
@media(width < 1200px){
    .history{flex-direction: column;}
}
@media(width < 768px){
    .border-list li > .two-column{grid-template-columns: 1fr;}
    .border-list li > .three-column{grid-template-columns: 1fr;}
}

.product-list{border-top: .1rem solid var(--primary); border-bottom: .1rem solid var(--primary);}
.product-list-item:not(:last-child){border-bottom: .1rem solid var(--primary);}
.product-list-item{padding: var(--xl) 0;}
.product-list-item > :not(:last-child){margin-bottom: var(--md);}
.product-list-grid{display: grid; grid-template-columns: 26vw 1fr; gap: var(--gutter) calc(var(--xl) + var(--md));}
.product-list-grid figure img{width: 100%;}
.product-list-grid ul li{padding: 2.5rem 0;}
.product-list-grid ul li:first-child{padding-top: 0;}
.product-list-grid ul li:last-child{padding-bottom: 0;}
.product-list-grid ul li:not(:last-child){border-bottom: .1rem solid var(--dark-grey);}
.product-list-grid ul li p:not(:last-child){margin-bottom: var(--gutter-half);}
.product-list-grid ul li p{max-width: 80%;}
.product-list-content{display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--gutter) calc(var(--xl) + var(--md));}
.product-list-grid ul li:not(:last-child){border-bottom: .1rem solid var(--dark-grey);}
.product-list-header{display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--gutter) calc(var(--xl) + var(--md));}
@media(width < 1600px){
    .product-list-grid, .product-list-content, .product-list-header{gap: var(--gutter) var(--xl);}
}
@media(width < 1200px){
    .product-list-grid{grid-template-columns: 1fr;}
    .product-list-grid figure{max-width: clamp(30rem, 50vw, 50vw);}
}
@media(width < 992px){
    .product-list-grid, .product-list-content, .product-list-header{gap: var(--md);}
}
@media(width < 768px){
    .product-list-grid figure{max-width: clamp(30rem, 80vw, 80vw);}
    .product-list-content, .product-list-header{grid-template-columns: 1fr;}
    .product-list-header{gap: var(--gutter-half)}
    .product-list-grid ul li p:not(:last-child){margin-bottom: 1rem;}
    .product-list-grid ul li{padding: var(--gutter-half) 0;}
    .product-list-grid ul li p{max-width: 100%;}
}
@media(width < 576px){
    .product-list-grid figure{max-width: 100%;}
}

.two-column-header{display: flex; gap: var(--gutter) var(--md);}
@media(width > 991px){
    .justify-content-lg-between{justify-content: space-between;}
}   
@media(width < 992px){
    .two-column-header{flex-direction: column;}
}

.single-post{display: grid; grid-template-columns: 30vw 1fr; align-items: center; gap: var(--gutter) var(--xl);}
.single-post figure img{width: 100%;}
@media(width < 1200px){
    .single-post{gap: var(--gutter) var(--lg);}
}
@media(width < 992px){
    .single-post{grid-template-columns: 1fr;}
}

.cards-grid{display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--xl) 1rem;}
@media(width < 1200px){
   .cards-grid{grid-template-columns: repeat(3, 1fr); gap: var(--lg) 1rem;}
}
@media(width < 992px){
   .cards-grid{grid-template-columns: repeat(2, 1fr); gap: var(--lg) 1rem;}
}
@media(width < 576px){
   .cards-grid{grid-template-columns: 1fr;}
}

.page-hero-two-column{display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--xl);}
.page-hero-two-column-block > :not(:last-child){margin-bottom: var(--gutter-half);}
.page-hero-two-column-block:not(:last-child){margin-bottom: var(--md);}
@media(width < 1200px){
   .page-hero-two-column{grid-template-columns: 1fr; gap: var(--sm);}
   .page-hero-two-column-block:not(:last-child){margin-bottom: var(--sm);}
}

.map{aspect-ratio: 2.29/1;}
.map iframe{width: 100%; height: 100%;}

.nutrition-table {
    border-collapse: collapse;
}

    .nutrition-table th,
    .nutrition-table td {
        text-align: left;
        padding: 4px 8px;
        vertical-align: top;
    }


/*
html.lenis,
html.lenis body {
  height: auto;
}

.lenis:not(.lenis-autoToggle).lenis-stopped {
  overflow: clip;
}

.lenis [data-lenis-prevent],
.lenis [data-lenis-prevent-wheel],
.lenis [data-lenis-prevent-touch] {
  overscroll-behavior: contain;
}

.lenis.lenis-smooth iframe {
  pointer-events: none;
}

.lenis.lenis-autoToggle {
  transition-property: overflow;
  transition-duration: 1ms;
  transition-behavior: allow-discrete;
} */