/* Brick custom components */

/* Hero section */

.hero-section .brxe-container {
    flex-direction: row;
    align-items: center;
}

.hero-section .brxe-button {
    display: none;
}

.hero-section.reverse .brxe-container {
    flex-direction: row-reverse;
}

.hero-section.small-title .brxe-heading {
    font-size: var(--h2-size);
    line-height: calc( var(--h2-size) + 0.25rem );
}

.hero-section.display-cta .brxe-container .brxe-button {
    display: flex;
}

.hero-section .brxe-container .brxe-block:not(.subtitle-wrapper) {
    gap: var(--space-m);
}

.hero-section .brxe-container .brxe-block:first-child {
    padding-right: var(--space-ml);
}

.hero-section.reverse .brxe-container .brxe-block:not(.subtitle-wrapper):first-child {
    padding-left: var(--space-ml);
}

@media screen and (max-width: 767px) {
    .hero-section .brxe-container {
        flex-direction: column-reverse;
    }

    .hero-section.reverse .brxe-container {
        flex-direction: column-reverse;
    }

    #brx-content .hero-section:first-child .brxe-container {
        flex-direction: column;
    }

    .hero-section .brxe-container .brxe-block:not(.subtitle-wrapper):first-child, .hero-section.reverse .brxe-container .brxe-block:not(.subtitle-wrapper):first-child {
        padding-left: initial;
        padding-right: initial;
    }
}

.hero-section img:not(.bouteille), .video-section img {
    aspect-ratio: 1/1;
    object-fit: cover;
    mask-image: url(https://germanier.com/wp-content/uploads/2025/02/tunnel.svg);
    mask-size: contain;
    mask-position: center center;
    mask-repeat: no-repeat;
}

.hero-section img.bouteille {
    max-width: 20%;
    position: absolute;
    bottom: 7%;
    left: -9%;
}

.hero-section.reverse img.bouteille {
    right: -9%;
    left: initial;
}

@media screen and (max-width: 767px) {
    .hero-section img.bouteille, .hero-section.reverse img.bouteille {
        bottom: -7%;
        right: 7%;
        left: initial;
    }
}

/* Hero full width */

section.hero-full {
    border-radius: 0 0 calc( 2 * var(--space-l) ) 0;
    position:relative;
    z-index: 0;
}

section.hero-full::before, .card.degustation .brxe-block.card-image::before {
    background-image: linear-gradient(90deg, var(--background-color), var(--transparent-color));
    position: absolute;
    content: "";
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    pointer-events: none;
    z-index: -1;
    border-radius: 0 0 calc( 2 * var(--space-l) ) 0;
}

section.hero-full.dark-gradient {
    background-color: var(--text-color);
}

section.hero-full.dark-gradient::before, .card.degustation .brxe-block.card-image.dark-gradient::before {
    background-image: linear-gradient(90deg, var(--text-color), var(--transparent-color));
}

section.hero-full > .brxe-container {
    align-items: flex-start;
}

section.hero-full .brxe-container > .brxe-block {
    max-width: 60%;
}

section.hero-full.dark-gradient .brxe-container > .brxe-block .brxe-heading, section.hero-full.dark-gradient .brxe-container > .brxe-block .brxe-text p, section.hero-full.dark-gradient .brxe-container > .brxe-block .brxe-text-basic {
    color: var(--white-color);
}

/* Homepage hero */

section.hero-full.homepage-hero {
    margin-top: calc( 0px - var(--header-height) );
    padding-top: calc( var(--header-height) + var(--space-l) );
}

/* Block icon */

.block-icon {
    align-items: center;
    align-content: center;
    justify-content: center;
    text-align: center;
}

.brxe-icon-box.block-icon .content {
    gap: 0;
}

/* Round icon */

.round-icon {
    background-color: var(--primary-color);
    padding: var(--space-m);
    border-radius: 300px;
    align-items: center;
    align-content: center;
    justify-content: center;
    text-align: center;
    min-width: 200px;
    min-height: 200px;
}

.round-icon .content h4 {
    font-size: var(--h3-size);
    line-height: 1rem;
}

@media screen and (max-width: 767px) {
    .round-icon {
        min-width: 155px;
        min-height: 155px;
    }

    .round-icon .content h4 {
        font-size: var(--h4-size);
        line-height: 1rem;
    }
}

/* White block with radius */

.white-round-block {
    background-color: var(--white-color);
    padding: var(--space-m);
    border-radius: var(--low-radius);
    gap: var(--space-m);
}

.white-round-block .brxe-heading + .brxe-text, .white-round-block .brxe-heading + .brxe-text-basic {
    margin-top: initial;
}

/* Product Category loop */

.product-category-loop {
    background-color: var(--background-color);
    padding: var(--space-m) var(--space-ml);
    border-radius: var(--low-radius);
    background-blend-mode: luminosity;
    z-index: 0;
}

.product-category-loop:before {
    content: "";
    position: absolute;
    background-color: var(--background-color);
    opacity: 0.9;
    width: 100%;
    height: 100%;
    z-index: -1;
    border-radius: var(--low-radius);
}

.product-category-loop img {
    min-height: 300px;
    object-fit: contain;
    object-position: bottom;
}

/* Card */

.brxe-block:has(.card), .brxe-block:has(.white-round-block) {
    gap: var(--space-m);
    align-items: stretch;
}

.card {
    background-color: var(--white-color);
    border-radius: var(--low-radius);
    align-items: stretch;
}

.card:not(.wqr-card) img {
    width: 100%;
    height: calc( 4 * var(--space-l) );
    object-fit: cover;
    object-position: center;
    border-radius: var(--space-m);
}

@media screen and (max-width: 990px) {
    .card img {
        min-height: auto;
        max-height: calc( 4 * var(--space-l) );
    }
}

.card .brxe-block.wrapper {
    padding: var(--space-m);
    gap: var(--space-m);
}

.card.degustation .brxe-block.card-image {
    position: relative;
    z-index: 0;
    min-height: calc( 3.5 * var(--space-l) );
    padding: var(--space-ml);
    border-radius: var(--space-m);
}

.card.degustation .brxe-block.card-image::before {
    background-image: linear-gradient(45deg, var(--secondary-color) 5%, var(--transparent-color) 60%);
    border-radius: var(--space-m);
}

.card.degustation .brxe-block.card-image .brxe-heading {
    font-size: var(--h1-size);
}

.cta-block {
    background-color: var(--secondary-color);
    padding: var(--space-ml);
    border-radius: var(--low-radius);
}

@media screen and (max-width: 990px) {
    .card.degustation .brxe-block.card-image {
        min-height: calc( 4 * var(--space-l) );
        padding: var(--space-m);
    }
}

/* Team card */