/*
Theme Name:  Jampaa
Theme URI: https://www.jampaa.it/
Description:  Tema Jampaa
Author:  Jampaa
Author URI: https://www.jampaa.it/
Template:  hello-elementor
Version:  1.0.2
*/

/*
*	Root
*	1.0 SETTINGS
        *fonts
        *boxes
        *buttons
*   2.0 HEADER
*   3.0 POPUP ELEMENTOR PER MENU
*/


/*
*	Root
*/
@font-face {
    font-family: '';
    src: url('') format('truetype');
    font-weight: normal;
    font-style: normal;
}

.font-importato {
  font-family: "", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}

:root {
    /* Font family */
    --font-family-primary: 'DM Sans', sans-serif;
    --font-family-secondary: 'Mulish', sans-serif;
    --font-family-menu: 'Mulish', sans-serif;
    --font-family-buttons: 'Mulish', sans-serif;

    /* Colors */
    --color-black: #000000;
    --color-white: #FFFFFF;
    --color-primary: #B34D3E;
    --color-secondary: #870A1E;
    --color-tertiary: #332B2E;
    --color-menu: #332B2E;

    /* H1 - 48px */
    --colore-h1: #000000;
    --font-size-h1: clamp(36px, 5vw, 48px);
    --font-weight-h1: 400;

    /* H2 - 36px */
    --colore-h2: #000000;
    --font-size-h2: clamp(28px, 4vw, 36px);
    --font-weight-h2: 400;

    /* H3 - 28px */
    --colore-h3: #000000;
    --font-size-h3: clamp(22px, 3.5vw, 28px);
    --font-weight-h3: 400;

    /* H4 - 24px */
    --colore-h4: #000000;
    --font-size-h4: clamp(20px, 3vw, 24px);
    --font-weight-h4: 400;

    /* Paragraphs & Span */
    --colore-p: #000000;
    --font-size-p-l: clamp(18px, 2vw, 21px);   /* Large */
    --font-size-p-r: clamp(16px, 2vw, 18px);    /* Regular */
    --font-size-p-s: clamp(15px, 2vw, 16px);    /* Small */
    --font-size-p-xs: clamp(13px, 2vw, 14px);    /* Extra-small */

    --font-weight-p-l: 400;
    --font-weight-p-r: 400;
    --font-weight-p-s: 400;
    --font-weight-p-xs: 400;

    --colore-span: #000000;
    --font-size-span: clamp(15px, 1.8vw, 18px);
    --font-weight-span: 400;

    /* Link */
    --colore-a: var(--color-primary);
    --font-size-a: clamp(16px, 1.8vw, 18px);
    --font-weight-a: 700;

    /* Menu Desktop */
    --colore-voce-menu: var(--color-menu);
    --font-size-menu: clamp(16px, 2vw, 18px);
    --font-weight-menu: 700;

    /* Pulsanti */
    --colore-button-primary: var(--color-primary);
    --colore-button-hover: var(--color-white);
    --font-button: clamp(16px, 2vw, 18px);
    --font-weight-button: 600;
    --line-height-button: clamp(24px, 2vw, 28px);
}


/*
*	1.0 SETTINGS
*/

/*fonts*/
h1 {
    font-family: var(--font-family-primary) !important;
    font-size: var(--font-size-h1) !important;
    font-weight: var(--font-weight-h1) !important;
    line-height: normal !important;
    color: var(--colore-h1) !important;
}

h2 {
    font-family: var(--font-family-primary) !important;
    font-size: var(--font-size-h2) !important;
    font-weight: var(--font-weight-h2) !important;
    line-height: normal !important;
    color: var(--colore-h2) !important;
}

h3 {
    font-family: var(--font-family-primary) !important;
    font-size: var(--font-size-h3) !important;
    font-weight: var(--font-weight-h3) !important;
    line-height: normal !important;
    color: var(--colore-h3) !important;
}

h4 {
    font-family: var(--font-family-primary) !important;
    font-size: var(--font-size-h4) !important;
    font-weight: var(--font-weight-h4) !important;
    line-height: normal !important;
    color: var(--colore-h4) !important;
}

p {
    font-family: var(--font-family-secondary) !important;
    font-size: var(--font-size-p-r) !important;
    font-weight: var(--font-weight-p-r) !important;
    line-height: 1.75 !important;
    color: var(--colore-p) !important;
}

p.paragraph-l {
    font-family: var(--font-family-secondary) !important;
    font-size: var(--font-size-p-l) !important;
    font-weight: var(--font-weight-p-l) !important;
    line-height: 1.75 !important;
    color: var(--colore-p) !important;
}

p.paragraph-r {
    font-family: var(--font-family-secondary) !important;
    font-size: var(--font-size-p-r) !important;
    font-weight: var(--font-weight-p-r) !important;
    line-height: 1.75 !important;
    color: var(--colore-p) !important;
}

p.paragraph-s {
    font-family: var(--font-family-secondary) !important;
    font-size: var(--font-size-p-s) !important;
    font-weight: var(--font-weight-p-s) !important;
    line-height: 1.75 !important;
    color: var(--colore-p) !important;
}

p.paragraph-xs {
    font-family: var(--font-family-secondary) !important;
    font-size: var(--font-size-p-xs) !important;
    font-weight: var(--font-weight-p-xs) !important;
    line-height: 1.75 !important;
    color: var(--colore-p) !important;
}

span {
    font-family: var(--font-family-secondary) !important;
    font-size: var(--font-size-span) !important;
    font-weight: var(--font-weight-span) !important;
    line-height: 1.6 !important;
    color: var(--colore-span) !important;
}

a {
    font-family: var(--font-family-secondary) !important;
    font-size: var(--font-size-a) !important;
    font-weight: var(--font-weight-a) !important;
    line-height: 1.6 !important;
    color: var(--colore-a) !important;
    text-decoration: none !important;
}

a.js-wpml-ls-item-toggle.wpml-ls-item-toggle span {
    font-family: var(--font-family-secondary) !important;
    font-size: var(--font-size-p-l) !important;
    font-weight: var(--font-weight-menu) !important;
    line-height: 1.75 !important;
    color: var(--colore-p) !important;
}

#menu-principale a {
    font-family: var(--font-family-menu) !important;
    font-size: var(--font-size-menu) !important;
    font-weight: var(--font-weight-menu) !important;
    line-height: 1.6 !important;
    color: var(--colore-voce-menu) !important;
    text-decoration: none !important;
    text-transform: uppercase;
    background: transparent !important;
}

p.iubenda-cs-preferences-link {
    margin: 0px;
    font-family: var(--font-family-secondary) !important;
    font-size: var(--font-size-p-l) !important;
    font-weight: var(--font-weight-p-l) !important;
    line-height: 1.75 !important;
    color: var(--colore-a) !important;
}

/*boxes*/
div.full-width-box {
    max-width: 1920px !important;
    margin: auto !important;
}

/*buttons*/


/*
*	2.0 HEADER
*/


/*
*   3.0 POPUP ELEMENTOR PER MENU
span.wpml-ls-native.wpml-white {
    color: white;
    font-weight: 700;
}

div.popup-menu {
    z-index: 99;
}

a.dialog-close-button.dialog-lightbox-close-button {
    z-index: 101;
}

.black {
	color: black;
}

@keyframes left {
    from {
        left: 0;
    }
    to {
        left: -100px;
    }
}

.img-popup-color {
    visibility: hidden;
    opacity: 0;
    position: relative;
    left: 0;
    margin: 0;
    padding: 0;
    transition: left 1s, visibility 0s 1s, opacity 1s;
}

#logo-header,
.img-popup-color {
    position: relative;
    left: 0;
    margin: 0;
    padding: 0;
    transition: left 1s;
}

#logo-header.position-logo-popup,
.img-popup-color.position-logo-popup {
    left: -135px;
    visibility: visible;
    opacity: 1;
    transition: left 1s, visibility 0s 0s, opacity 1s;
	position: absolute;
	top: 0px;
}

.img-popup-color img{
    width: 220px;
    transition: width 0.5s;
}

.img-popup-color.shrink {
    width: 160px;
}

i.fal.fa-xmark {
    font-size: 40px;
}
*/


/*
*	4.0 BLOG AI
*/
/*
*   blog
*/
.blog-layout {
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
    margin-top: 40px;
}

.blog-main {
    flex: 2;
    min-width: 300px;
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.blog-sidebar {
    flex: 1;
    min-width: 250px;
    background: #f6f6f6;
    padding: 20px;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    gap: 30px;
    height: fit-content;
    position: sticky;
    top: 130px;
}

.widget ul {
    list-style: none;
    padding: 0;
}

.widget ul li {
    margin-bottom: 10px;
}

.tag-cloud a {
    display: inline-block;
    margin: 5px 3px 5px 0;
    padding: 3px 8px;
    background-color: #e6e6e600;
    border-radius: 0px;
    font-size: 12px;
    text-decoration: none;
    color: #1768bf;
    border-color: #1768bf;
    border-width: 2px;
    border-style: solid;
    text-transform: uppercase;
    font-weight: 700;
}

.cta-box {
    text-align: center;
    background-color: #1768bf;
    color: white;
    padding: 20px;
    border-radius: 8px;
    position: sticky;
    top: 115px;
    z-index: 50;
	display: none;
}

.cta-box .cta-button {
    display: inline-block;
    margin-top: 10px;
    background-color: white;
    color: #1768bf;
    padding: 10px 20px;
    border-radius: 20px;
    text-decoration: none;
    font-weight: 700;
    text-transform: uppercase;
}

.widget.cta-box h4 {
    text-transform: uppercase;
    font-weight: 700;
    font-size: 18px;
    color: white;
}

article.blog-post {
    display: flex;
    width: -webkit-fill-available;
    gap: 25px;
    background: #f3f3f3;
    align-items: center;
    flex-direction: row;
    padding: 20px 20px;
    border-radius: 8px;
}

article.blog-post img {
    max-width: 300px;
    object-fit: cover;
    height: 100%;
    border-radius: 8px;
}

div:has(> .sidebar-article) {
    position: sticky;
    top: 130px;
}

.post-category {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

ul.pagination a {
    border-style: solid;
    border-width: 1px;
    padding: 2px 4px;
    color: #1768bf;
}

ul.pagination {
    list-style: none;
    display: flex;
    gap: 15px;
    font-weight: 500;
    font-size: 16px;
    padding: 0px;
}

ul.pagination a.active {
    font-weight: 900;
    background-color: #1768bf;
    color: white;
}

li.popular-post-item a {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 20px;
}

li.popular-post-item img {
    width: 100px;
    max-width: 102px;
    object-fit: cover;
    height: 80px;
}

.widget h4 {
    margin-bottom: 15px;
}

.category-cloud {
    display: flex;
    gap: 10px;
    font-weight: 700;
    text-transform: uppercase;
    flex-wrap: wrap;
}

.category-cloud a {
    border-style: solid;
    border-width: 2px;
    padding: 5px 10px;
    color: #1768bf;
}

span.category-label.pulsanteGlobalePrimary {
    width: fit-content;
    padding: 5px 30px;
    background: var(--colorePulsantePrimary);
    min-width: 150px;
    text-align: center;
    color: white;
    font-weight: 800;
    text-transform: uppercase;
    font-size: 12px !important;
    margin-bottom: 10px;
}

.hero-image img {
    width: 100%;
    height: 600px;
    object-fit: cover;
    object-position: center;
}

main.blog-custom-template .entry-content {
    width: 80%;
    margin: 40px auto;
}

/*.blog-post .post-thumbnail img {
    width: 290px;
}
*/
@media(max-width: 768px) {
    article.blog-post img {
        max-width: 100%;
        object-fit: cover;
        width: 100%;
    }
    article.blog-post {
        display: flex;
        width: -webkit-fill-available;
        gap: 25px;
        flex-direction: column;
    }
    .blog-main {
        gap: 50px;
    }
    article.blog-post {
        gap: 15px;
    }
    .post-thumbnail {
        width: 100% !important;
        height: 280px;
    }
    .blog-post .post-thumbnail img {
        width: 100%;
    }
    div:has(> .sidebar-article) {
        position: relative;
        top: unset;
    }
    .cta-box {
        text-align: center;
        background-color: #1768bf;
        color: white;
        padding: 20px;
        border-radius: 8px;
        position: relative;
        top: unset !important;
        width: 100%;
        left: auto;
        right: auto;
        height: fit-content;
        z-index: 5000 !important;
    }
    .post-category {
        display: flex;
        flex-direction: column;
        gap: 10px;
        width: 100% !important;
    }
}

.hero-image {
    background-size: cover;
    background-position: center;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.post-template-single .hero-image .hero-content {
    background: rgba(0, 0, 0, 0.5);
    padding: 20px;
    color: white;
    text-align: center;
}

.hero-image img {
    width: 100%;
    height: 600px;
    object-fit: cover;
    object-position: center;
}

.hero-title-wrapper h1 {
    text-align: center;
    font-weight: 700;
}

a.back-to-blog {
    position: absolute;
    top: -35px;
}

.popular-thumb {
    display: none;
}

span.popular-title {
    font-weight: 600;
    font-size: 16px;
    color: #1768bf;
}

.blog-filter label {
    width: 100%;
}

.blog-filter {
    display: flex;
    width: 560px;
    flex-direction: row;
    gap: 10px;
    align-items: center;
}

select#categoria-filter {
    background: var(--colorePulsantePrimary);
    color: white;
    font-weight: 700;
    border-radius: 30px;
    padding: 5px 10px;
}

/* singolo articolo */
.data-post {
	font-weight:400;
}
.single-post h1, .single-post h2, .single-post h3, .single-post h4, .single-post h5, .single-post h6 {
	font-family: "Montserrat", sans-serif!important;
}  
.single-post h1 {
	font-weight:800;
	font-size: clamp(2rem, 1.786vw + 1.688rem, 3.25rem);
}
.sez-riassunto-post {
	background-image:linear-gradient(270deg, rgb(203, 58, 139) 0%, rgb(174, 61, 142) 16.15%, rgb(132, 67, 146) 50%, rgb(78, 73, 152) 84.38%);
	color:#fff;
	font-weight:600;
	border-radius: 8px;
	padding:30px;
	font-size:16px;	
}
.take-away-post {
	font-weight:600;
	border-radius: 8px;
	padding:30px;
	font-size:16px;	
	border:solid 1px #0068bf;
}
.tit-takeaway {
	text-transform:uppercase;
	letter-spacing:2px;
	font-weight:700;
	background-image: linear-gradient(270deg, rgb(203, 58, 139) 0%, rgb(174, 61, 142) 16.15%, rgb(132, 67, 146) 50%, rgb(78, 73, 152) 84.38%);
    -webkit-background-clip: text;
    color: transparent;
    font-size: clamp(1.188rem, 0.179vw + 1.156rem, 1.313rem);
}
.cont-post {
	padding:10px 0 20px 0;
}
.cont-post p {
	font-size:16px;
	line-height:1.8;
}
.cont-post h2 {
	font-size: clamp(1.75rem, 0.893vw + 1.594rem, 2.375rem);
	font-weight:600;
	line-height:1.25;
}
.cont-post h3 {
	font-size: clamp(1.563rem, 0.625vw + 1.453rem, 2rem);
	font-weight:600;
	line-height:1.25;
}
.cont-post h4 {
	font-size: clamp(1.375rem, 0.357vw + 1.313rem, 1.625rem);
	font-weight:600;
	line-height:1.25;
}
.cont-post h2:has(+ p), .cont-post h3:has(+ p), .cont-post h4:has(+ p) {
	margin-top:30px;
}
.cont-faq-post {
	border-radius: 8px;
	padding:30px;
	font-size:16px;	
	background-color:#f6f6f6;
	background: #f6f6f6;
	box-shadow:  30px 30px 60px #e2e2e2,
             -30px -30px 60px #ffffff;        
}
.cont-faq-post h4 {
	font-size: clamp(1.25rem, 0.179vw + 1.219rem, 1.375rem);
	line-height:1.35;
	font-weight:500;
}
.faq-tit {
	text-transform:uppercase;
	letter-spacing:2px;
	font-weight:700;
	background-image: linear-gradient(270deg, rgb(203, 58, 139) 0%, rgb(174, 61, 142) 16.15%, rgb(132, 67, 146) 50%, rgb(78, 73, 152) 84.38%);
    -webkit-background-clip: text;
    color: transparent;
    font-size: clamp(1.188rem, 0.179vw + 1.156rem, 1.313rem);
}
.cont-featured {
	padding-bottom:30px;
}
.blog-filter {
text-transform:uppercase;
	letter-spacing:2px;
	font-weight:700;
	background-image: linear-gradient(270deg, rgb(203, 58, 139) 0%, rgb(174, 61, 142) 16.15%, rgb(132, 67, 146) 50%, rgb(78, 73, 152) 84.38%);
    -webkit-background-clip: text;
    color: transparent;
}
.category h1.entry-title {
	font-weight:800;
	font-size: clamp(2rem, 1.786vw + 1.688rem, 3.25rem);
}
@media(max-width: 768px) {
.cont-faq-post {
	padding:30px 10px;
	margin-bottom:50px!important;
}

}



/* AUTHOR ARCHIVE */
.author-hero img {
    width: 100%;
    height: 360px;
    object-fit: cover;
    object-position: bottom;
}

.author-container {
    max-width: 80%;
    margin: 0 auto;
    padding: 40px 20px;
    display: flex;
    flex-direction: row;
    gap: 40px;
    justify-content: space-between;
}

.author-articles {
    padding: 50px 40px;
    width: 40%;
    background: #f6f6f6;
    height: fit-content;
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    gap: 0px;
}

.author-articles .cta-box {
    text-align: center;
    background-color: #1768bf;
    color: white;
    padding: 20px;
    border-radius: 8px;
    margin-bottom: 30px;
}

.author-header {
    display: flex;
    gap: 30px;
    flex-wrap: wrap;
    margin-bottom: 40px;
    flex-direction: column;
    width: 60%;
    align-items: flex-start;
    align-content: space-between;
    background: #f3f3f3;
    padding: 40px 40px;
    border-radius: 20px !important;
    height: fit-content;
}

.author-photo img {
    width: 120px;
    height: 120px;
    border-radius: 100%;
    object-fit: cover;
    border: 4px solid #0068bf !important;
}

.author-details h1 {
    font-size: 2rem;
    margin-bottom: 10px;
}

.author-details p {
    font-size: 1.1rem;
    color: #333;
}

.author-socials {
    margin-top: 25px;
}

.author-socials a {
    display: inline-block;
    margin-right: 15px;
    padding: 10px 25px;
    border: 1px solid #fff;
    border-radius: 0px;
    color: #fff;
    background: var(--colorePulsantePrimary);
    text-decoration: none;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 16px;
}

.author-articles h2 {
    font-size: 1.8rem;
    margin-bottom: 20px;
}

.author-links li {
    width: fit-content;
    background: var(--colorePulsantePrimary);
    padding: 10px 25px;
    color: white;
}

.author-links li a {
    color: white;
}

.author-links ul {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 20px;
}

.author-post-list {
    display: grid;
    gap: 10px;
}

.author-post h3 a {
    margin-bottom: 8px;
    font-weight: 600;
    font-size: 16px;
    color: #1768bf;
    text-decoration: none;
}

.author-excerpt {
    font-size: 1rem;
    color: #555;
}

.author-links {
    margin-top: 50px;
}

.author-links ul {
    list-style: none;
    padding: 0;
}

.author-links li {
    margin-bottom: 10px;
}

.author-links a {
    color: #1A42A6;
    font-weight: 600;
    text-decoration: none;
    text-transform: uppercase;
}

.author-links a:hover {
    text-decoration: underline;
}

.author-photo {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 30px;
}

nav.breadcrumb-author {
    width: 80%;
    margin: 30px auto;
}

.info-autore-articolo {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 20px !important;
    border-radius: 10px !important;
}

.container-img-name {
    display: flex;
    align-items: center;
    gap: 20px;
}

.container-img-name img {
    width: 40px;
    height: auto;
    margin: 0px !important;
}

.container-img-name h3 {
    padding: 0px;
    font-size: 18px;
}

.container-info-authors a {
    color: #1768bf;
}

.container-info-authors ul {
    display: flex;
    gap: 20px;
    flex-direction: row;
    flex-wrap: wrap;
}

p#breadcrumbs {
    margin-top: 25px;
}

.box-immagine img {
    width: 120px;
    height: auto;
}

.box-autore-completo {
    background: white;
    border-radius: 10px;
}

.box-testo a {
    color: #1768bf !important;
    font-weight: 700;
}

a.categoria-senza-categoria {
    display: none !important;
}

.post-thumbnail {
    width: 300px;
    height: 200px;
}

@media (max-width: 768px) {
    .author-header {
        flex-direction: column;
        align-items: flex-start;
    }
    .author-photo img {
        width: 100px;
        height: 100px;
    }
    .author-container {
        max-width: 90%;
        gap: 0px;
        flex-direction: column;
    }
    .author-articles {
        width: 100%;
    }
    .author-header {
        width: 100%;
    }
    .author-socials {
        margin-top: 25px;
        display: flex;
        flex-direction: column;
        gap: 15px;
    }
    .author-socials {
        text-align: center;
    }
    .info-autore-articolo  {
    	flex-direction: column;
    	align-items: flex-start;
    }
    .container-info-authors ul {
    	gap:10px;
    }
}

footer .b24-form-content .b24-form-control-label{
    opacity: 1 !important;
}

footer .b24-form-content .b24-form-control{
    border: solid !important;
}

@media (max-width: 768px) {
    .reveal-items .second-level{
       /* display:block; */
    }
}