/*Theme Name: Hello Elementor ChildTheme URI: https://elementor.com/hello-theme/?utm_source=wp-themes&utm_campaign=theme-uri&utm_medium=wp-dashTemplate: hello-elementorAuthor: Elementor TeamAuthor URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dashDescription: Hello Elementor is a lightweight and minimalist WordPress theme that was built specifically to work seamlessly with the Elementor site builder plugin. The theme is free, open-source, and designed for users who want a flexible, easy-to-use, and customizable website. The theme, which is optimized for performance, provides a solid foundation for users to build their own unique designs using the Elementor drag-and-drop site builder. Its simplicity and flexibility make it a great choice for both beginners and experienced Web Creators.Tags: accessibility-ready,flexible-header,custom-colors,custom-menu,custom-logo,featured-images,rtl-language-support,threaded-comments,translation-readyVersion: 3.0.3.1712049753Updated: 2024-04-02 09:22:33*/

@font-face {
    font-family: 'Assignate';
    src: url('./fonts/Assignate.eot');
    /* IE9 Compat Modes */
    src: url('./fonts/Assignate.woff2') format('woff2'), url('./fonts/Assignate.otf') format('opentype');
    font-weight: normal;
}

:root {
    --nano-space: calc(var(--mini-space)/2);
    --mini-space: 2.5rem;
    --medium-space: calc(var(--mini-space)*1.75);
    --big-space: calc(var(--mini-space)*3.25);
    --bigger-space: calc(var(--mini-space)*4.5);
    --length-small-unit: calc(var(--length-big-unit)/4);
    --length-medium-unit: calc(var(--length-big-unit)/2);
    --length-big-unit: 420px;
    --length-page: calc(var(--length-big-unit)*2 + var(--mini-space)*4);
}

body {
    font-family: "Poppins", Sans-serif;
    border: 0.15rem solid var(--e-global-color-accent);
    margin: var(--mini-space);
    color: var(--e-global-color-accent);
}

.no-scroll {
    overflow: hidden;
}

input::placeholder {
    font-family: "Poppins", Sans-serif;
    font-size: 1.1rem;
    text-transform: lowercase;
}

h1,
h2,
h3 {
    margin: 0;
}

h1 {
    font-family: 'Assignate' !important;
}

.no-line-height h1 {
    margin: -.5rem 0 -1.5rem 0 !important;
}

h2 {
    font-family: 'Assignate' !important;
    font-size: 3.5rem !important;
}

h3 {
    font-family: 'Assignate' !important;
    font-size: 2.5rem !important;
}

.services-box h3 {
    font-size: 3.5rem !important;
}

.no-line-height h2 {
    margin: -0.2rem 0rem -.8rem 0rem !important;
}

ul,
li {
    list-style: none;
    margin: 0;
    padding: 0;
}

.responsive-width {
    max-width: 100% !important;
}

.elementor-button-wrapper {
    display: flex;
    justify-content: center;
}

.elementor-button {
    min-height: calc(var(--mini-space) + 0.3rem);
    display: flex;
    align-items: center;
    border-radius: var(--mini-space) !important;
    text-transform: lowercase !important;
}

.elementor-button:hover {
    border-radius: 0 !important;
}

.big-button .elementor-button {
    min-height: var(--medium-space);
}

.slight-flip {
    animation: flipAnimation 2.5s ease forwards;
    animation-delay: 0.2s;
}

@keyframes flipAnimation {
    0% {
        transform: perspective(600px) rotateY(0);
    }

    20% {
        transform: perspective(600px) rotateY(-15deg);
    }

    50% {
        transform: perspective(600px) rotateY(15deg);
    }

    100% {
        transform: perspective(600px) rotateY(0);
    }
}

/* header */
.main-header {
    background: var(--e-global-color-text) !important;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.main-header #social-buttons {
    min-width: 0;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--mini-space);
    height: var(--medium-space);
    border-bottom: 0.15rem solid var(--e-global-color-accent);
    background: var(--e-global-color-primary);
}

.main-header #social-buttons a {
    height: 1.2rem;
    width: 1.2rem;
    display: flex;
    justify-content: center;
    transition: opacity .3s ease;
}

.main-header #social-buttons img {
    max-height: 100%;
    max-width: 100%;
}

.main-header #logo-container {
    width: 100%;
    background-image: url("/wp-content/uploads/2024/05/banner_bg.svg");
    background-position: bottom center;
    background-size: 130%;
    background-repeat: no-repeat;
    display: flex;
    justify-content: center;
}

.main-header #logo {
    background-color: var(--e-global-color-text);
    max-width: calc(100% - var(--mini-space)*2);
    width: var(--length-page);
    height: 17rem;
    display: flex;
    justify-content: center;
    align-items: center;
    border-left: 0.15rem solid var(--e-global-color-accent);
    border-right: 0.15rem solid var(--e-global-color-accent);
}

.main-header #logo a {
    line-height: 0;
}

.main-header #logo img {
    height: 9rem;
}

.hamburger {
    display: none;
}

.main-header .main-menu-container {
    width: 100%;
}

.main-header .main-menu {
    height: var(--medium-space);
    padding: 0 calc((100% - var(--length-page))/2 + var(--mini-space));
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 0.15rem solid var(--e-global-color-accent);
    border-bottom: 0.15rem solid var(--e-global-color-accent);
    background: var(--e-global-color-primary);
}

.main-menu li {
    width: fit-content;
    display: flex;
    justify-content: center;
}

.main-menu a {
    text-decoration: none;
    color: var(--e-global-color-text);
    font-family: "Poppins", Sans-serif;
    font-size: 1.1rem;
    text-transform: lowercase;
    text-align: center;
    transition: opacity .3s ease;
}

.main-menu a:hover,
.main-header #social-buttons a:hover {
    opacity: .5;
}

/* blog */
.last-n-posts {
    display: flex;
    min-width: 0;
    width: 100%;
    flex-direction: column;
    row-gap: var(--medium-space);
    background-color: var(--e-global-color-primary);
}

.last-n-posts .single-post {
    display: flex;
    min-width: 0;
    width: 100%;
    flex-direction: row;
    column-gap: var(--mini-space);
    color: var(--e-global-color-text) !important;
}

.last-n-posts .single-post h3 {
    text-transform: uppercase;
}

.last-n-posts .single-post .elementor-button {
    border: 0.15rem solid var(--e-global-color-text);
    width: fit-content;
}

.last-n-posts .single-post .single-post-thumbnail {
    min-height: var(--length-medium-unit);
    min-width: var(--length-medium-unit);
    max-width: var(--length-medium-unit);
    background-size: cover;
    background-position: center, center;
    border: 0.15rem solid var(--e-global-color-accent);
}

.last-n-posts .single-post .single-post-metadata {
    min-width: 0;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.last-n-posts .single-post .single-post-heading {
    display: flex;
    flex-direction: column;
    row-gap: 1rem;
}

.last-n-posts .single-post .single-post-preview {
    width: 100%;
    font-family: "Poppins", Sans-serif;
    font-size: 1.1rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding-right: 2.5rem;
}

/* carousel */
.scroller {
    width: 100%;
    overflow: hidden;
    padding: var(--mini-space) 0;
    border-top: 0.15rem solid var(--e-global-color-accent);
    border-bottom: 0.15rem solid var(--e-global-color-accent);
    background-color: var(--e-global-color-text);
}

.scroller--inner {
    display: flex;
    width: max-content;
    flex-wrap: nowrap;
    gap: var(--mini-space);
    animation: scroll 40s forwards linear infinite;
}

.scroller--inner div {
    height: var(--length-medium-unit);
    width: var(--length-medium-unit);
    border: 0.15rem solid var(--e-global-color-accent);
    background-position: center, center;
    background-size: cover;
    background-repeat: no-repeat;
}

@keyframes scroll {
    to {
        transform: translate(calc(-50% - 1rem));
    }
}

.social-button a {
    width: var(--length-small-unit);
    display: flex;
    justify-content: center;
}

.social-button span {
    display: flex;
}

.social-button svg {
    height: 1.2rem;
    width: auto;
}

.social-button svg path {
    transition: stroke .3s ease;
}

.social-button:hover svg path {
    stroke-width: 0.15rem;
    stroke: var(--e-global-color-primary);
}

/* newsletter */
.brevo-form-container p {
    margin: 0 !important;
}

.brevo-form-container input.sib-email-area {
    margin-bottom: var(--mini-space);
    padding-left: var(--nano-space);
    padding-right: var(--nano-space);
    border-radius: 2rem;
    border: none !important;
    outline: none !important;
    font-family: "Poppins", Sans-serif;
    font-size: 1.1rem;
    line-height: 0;
    transition: all .3s ease;
}

.brevo-form-container input.sib-default-btn {
    border: 0.15rem solid var(--e-global-color-text);
    margin: auto;
}

.brevo-form-container input.sib-email-area:focus {
    border: none !important;
    border-radius: 0;
    appearance: none;
    outline: none;
}

/* footer */
.main-footer {
    font-family: "Poppins", Sans-serif;
    font-size: 1.1rem;
    background-color: var(--e-global-color-secondary);
    padding: var(--big-space) 0 var(--medium-space) 0;
    border-top: 0.15rem solid var(--e-global-color-accent);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--mini-space);
}

.footer-box-menus {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: min(calc(100vw - var(--mini-space)*4 - 1.2rem), var(--length-page));
    border: 0.15rem solid var(--e-global-color-accent);
}

.footer-menu-container {
    display: flex;
    flex-direction: column;
    flex: 1;
    width: max-content;
    padding: var(--medium-space);
}

.footer-menu-container:nth-of-type(1) {
    justify-content: center;
    align-items: center;
}

.footer-menu-container:nth-of-type(2) {
    max-width: max-content;
    border-right: 0.15rem solid var(--e-global-color-accent);
    border-left: 0.15rem solid var(--e-global-color-accent);
}

.main-footer p a {
    color: inherit;
    text-decoration: underline;
}

.main-footer p a:hover {
    opacity: .5;
    transition: opacity .3s ease;
}

/* BLOG PAGE */
/* shortcode */
.all-posts {
    display: flex;
    min-width: 0;
    width: 100%;
    flex-direction: column;
    gap: var(--medium-space);
}

.all-posts .single-post {
    display: flex;
    min-width: 0;
    width: 100%;
    flex-direction: row;
    gap: var(--medium-space);
    color: var(--e-global-color-accent) !important;
}

.single-post h2 {
    text-transform: uppercase;
}

.all-posts .single-post .elementor-button {
    border: 0;
    width: fit-content;
}

.all-posts .single-post .single-post-thumbnail {
    min-height: var(--length-big-unit);
    min-width: var(--length-big-unit);
    max-width: var(--length-big-unit);
    background-size: cover;
    background-position: center, center;
    border: 0.15rem solid var(--e-global-color-accent);
}

.all-posts .single-post .single-post-metadata {
    min-width: 0;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 1rem;
}

.all-posts .single-post .single-post-heading {
    display: flex;
    flex-direction: column;
    row-gap: var(--mini-space);
}

.all-posts .single-post .single-post-preview {
    overflow: hidden;
    text-overflow: auto;
    white-space: wrap;
    padding-right: 0;
}

.all-posts .single-post .elementor-button {
    border: .15rem solid var(--e-global-color-primary);
}

.all-posts .single-post .elementor-button:hover {
    background-color: var(--e-global-color-text);
}

/* SINGLE POST PAGE */
.content-area {
    width: 100%;
    padding: 0 var(--mini-space);
    display: flex;
    justify-content: center;
    align-items: center;
}

#post-main {
    width: var(--length-page);
    padding: var(--big-space) 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--medium-space);
}

.thumbnail-mobile {
    display: none;
}

.post-block {
    width: 100%;
    padding: 0 var(--mini-space);
    display: flex;
    flex-flow: row;
    gap: var(--medium-space);
}

.images-column {
    display: flex;
    flex-flow: column;
    gap: var(--mini-space);
}

.image-box {
    background-size: cover;
    background-position: center;
    width: var(--length-medium-unit);
    height: var(--length-medium-unit);
    border: .15rem solid var(--e-global-color-accent);
}

.post-column {
    display: flex;
    flex-flow: column;
    gap: var(--medium-space);
}

#post-main .post-text {
    float: left;
    display: flex;
    flex-flow: column;
    gap: var(--mini-space);
}

#post-main .post-heading-title {
    height: var(--length-medium-unit);
    width: 100%;
    margin: 0 !important;
}

/* prodotti consigliati */
.prodotti-consigliati-section {
    padding: var(--mini-space);
    display: flex;
    flex-direction: column;
    gap: var(--mini-space);
    width: 100%;
    border: .15rem solid var(--e-global-color-accent);
}

.prodotti-consigliati-section h3 {
    text-transform: lowercase;
}

.prodotti-consigliati-container {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: var(--mini-space);
}

.prodotti-consigliati-item {
    display: flex;
    flex-direction: column;
    align-items: baseline;
    width: var(--length-medium-unit);
    gap: var(--nano-space);
}

.prodotti-image {
    width: var(--length-medium-unit);
    height: var(--length-medium-unit);
    background-size: cover;
    background-position: center;
    border: .15rem solid var(--e-global-color-accent);
}

/* edit post */
#edit-post-link {
    width: fit-content;
    border: 0.15rem solid var(--e-global-color-primary);
}

#edit-post-link a {
    color: var(--e-global-color-text);
    transition: color .3s ease;
}

#edit-post-link:hover a {
    color: var(--e-global-color-primary);
}

/* animations */
/* Fade-in animation */
.easy-luca--fade-in {
    opacity: 0;
    transition: opacity 1s ease;
}

.easy-luca--fade-in.appear {
    opacity: 1;
}

/* Swipe-up animation */
.easy-luca--swipe-up {
    opacity: 0;
    transform: translateY(3rem);
    /* Adjust the starting translateY value as needed */
    transition: transform .8s ease, opacity .8s ease;
}

.easy-luca--swipe-up.slide {
    opacity: 1;
    transform: translateY(0);
}

.elementor-editor-active .easy-luca--swipe-up,
.elementor-editor-active .easy-luca--fade-in {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
}