:root {
  --logo_path: url(../images/icon-novaera.svg);
    --logo_full_path: url(../images/novaera-logo.svg);

  --bg-body:#ffffff;

  --sidew:1px;
  --inner-max: calc(var(--max-width) - (var(--sidew)*2) - var(--96));
  --inner-width: min(95%, var(--inner-max));

  --primary-800: #9100a9;
  --primary-700: #af00cf;
  --primary-600: #C400F0;
  --primary-500: #CD00FA;
  --primary-400: #f25dff;
  --primary-300: #f699ff;
  --primary-200: #f7c6ff;
  --primary-100: #fbe3ff;


   --grey-800: rgb(0, 0, 0);
  --grey-700: #3d3d3d;
  --grey-600: #525252;
  --grey-500: #7c7c7c;
  --grey-400: #989898;
  --grey-300: #D5D5D5;
  --grey-200: #efefef;
  --grey-100: #F8F8F8;


  --black: var(--grey-800);
  --white: #ffffff;
  --text-color: var(--black);
  --success: #4da149;
  --error: #bb3b3d;
  --warning: #d78222;
  --success-light: #ddefdc;
  --error-light: #f6e4e4;
  --warning-light: #f8e7d3;

 
  --title-font: "Fraunces", serif;
  --body-font: "Poppins", sans-serif;

  --box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
  --box-shadow-top: 0px -4px 4px rgba(0, 0, 0, 0.2);

  --border-radius:var(--12)

}

@media screen and (width>64em){
  :root{
      --sidew:clamp(200px, 13vw, 310px);
  }
}

/* regular, light, medium
light italic, bold */

:is(.text, .type-text) p:not(:last-child){margin-bottom:var(--16)}

.margin-xsmall{margin-bottom:var(--32)}
.margin-small{margin-bottom:var(--64)}
.margin-medium{margin-bottom:calc(var(--80) * 1.5)}
.margin-large{margin-bottom:calc(var(--80) * 1.9)}


@media screen and (max-width:63.9375em){

.margin-xsmall{margin-bottom:var(--32)}
.margin-small{margin-bottom:var(--40)}
.margin-medium{margin-bottom:var(--60)}
.margin-large{margin-bottom:var(--60)}

}
:is(button,a).before-line{align-items:center; display:inline-flex; gap:8px}
:is(button,a).before-line:before{content:""; display:inline-block; width:20px; border-bottom:2px solid var(--grey-300)}

em{font-style:italic; font-weight:400}


.text-container a{display:inline-flex}
.text-container :is(p, ul, blockquote, ol, dl, .single-gallery):not(:last-child){margin-bottom:var(--24)}

/* HEADER */
.logo{background:var(--logo_full_path) left center no-repeat; background-size:contain; aspect-ratio:4.2;height:44px; display:block; font-size:0}
.home header .logo{background-image:var(--logo_path);aspect-ratio:1;}
header #main-nav li a {font-size: var(--17); }
header #main-nav a:hover{color:black}
header #main-nav li.current-menu-item a{font-weight:var(--medium); text-decoration:underline; text-underline-offset:.4ex; pointer-events:none}
header #main-nav{gap:var(--48)}

@media screen and (width>64em){
 
  .wrapper.inner-width{max-width:var(--inner-width); padding-inline:0}
}
header.main-header{ width:100%; z-index:9;  width: 100%;  left: 0;  top: 0;  transition: ease 0.4s; background:var(--bg-body) }
main{margin-top:var(--header-height)}

.nuovaera-header-logo{width:100%; aspect-ratio:7.5; font-size:0; background:url(../images/novaera-header.svg) center center no-repeat; background-size:contain}

.menu-button{  width:3rem; height:3rem; display:block; aspect-ratio:1;  position:relative; z-index:9999; cursor:pointer; padding:0; --bgColor:transparent; --borderColor:transparent; outline:0}
.menu-button span{ font-size:0; }
.menu-button svg{aspect-ratio:1; width:60%; }
.menu-button .burger-1{fill:var(--black);  transform-origin:center center}
.menu-button .burger-2{fill:var(--black);  transform-origin:right top}

[data-search-panel]{height:0; opacity:0; transition:all ease .5s; transition-behavior: allow-discrete; overflow:clip}
[data-search-panel].is-open{height:auto; opacity:1}
/* offcanvas menu */

header .off-canvas-menu > li.menu-item-has-children > a:after{display:none}
header .off-canvas-menu{gap:.5rem}

.off-canvas-container{position: fixed;   width: 100vw;    height: calc(100svh -  var(--header-height));    left: 0;scrollbar-width: none;
top:calc(var(--header-height) - 1px);  color:var(--text-color);  font-size:var(--17); z-index:-1; overflow-y:scroll; }
.off-canvas-menu {flex-direction:column}
.off-canvas-menu > li > .menu{display:none}
.off-canvas-container{ z-index:99;  opacity:0; }

.off-canvas-container li.current-menu-item a{color:var(--primary-500); pointer-events:none}
.off-canvas-container :is(.off-canvas-menu-container,.cta-container) {flex: 0 0 auto;  height: auto;}
.off-canvas-container a{width:100%;}


.searchform input{border:0; background:transparent; margin-bottom:0; font-size:var(--18); --text-color:white}
.searchform [type="submit"]{text-transform:uppercase; font-size:var(--13);    --textColor: white;}


/* FOOTER */
footer .category-menu li:not(:last-child){margin-bottom:var(--12)}
footer .logo{aspect-ratio:4.2; background-image:var(--logo_full_path); filter:invert(1); height:60px}
footer a:hover{color:var(--primary-500)}
footer i{filter:invert(1)}

@media screen and (min-width:64em){
#breadcrumbs{width:100%;}
}

.wrapper-max-width .wrapper{--max-width:75ch; }

/* CONTENT SIMPLE TEXT */
.content-simple_text .align-self-stretch > * {height:100%}
.content-simple_text .text-container.grid{grid-template-columns:repeat(3,1fr)}
.content-simple_text .text-container.layout-1{grid-template-columns:3fr 2fr 2fr}
.content-simple_text .text-container.layout-2{ grid-template-columns:2fr 4fr 3fr}
.content-simple_text .text-container.layout-3{ grid-template-columns:2fr 2fr 3fr}
:is(.content-simple_text, .content-text_image_video) .text-container img:not(.custom-size){width:100%; height:auto;   overflow:clip; object-fit:cover}
:is(.content-simple_text, .content-text_image_video) .media-container img{ width:100%; height:auto; overflow:clip;  object-fit:cover}
:is(.content-simple_text, .content-text_image_video) .wp-caption{width:100% !important}
:is(.content-simple_text, .content-text_image_video) a:not(.button-contained, .button-underline){text-decoration: underline; text-underline-offset: .4ch; font-weight: 400;  --textColor: var(--text-color);  font-size: inherit;}


:is(.content-simple_text, .content-text_image_video)  .align-self-stretch img{height:100%}
@media screen and (max-width:40em){
.content-simple_text .text-container.grid .single-column:nth-child(1){grid-area:a}
.content-simple_text .text-container.grid .single-column:nth-child(2){grid-area:b}
.content-simple_text .text-container.grid .single-column:nth-child(3){grid-area:c}
.content-simple_text .text-container.grid{grid-template-columns:1fr; grid-template-areas:"a" "b" "c"}
  .content-simple_text .text-container.layout-1{ grid-template-columns:1fr 1fr;  grid-template-areas: "a a" "b c"}
  .content-simple_text .text-container.layout-2{ grid-template-columns:1fr 1fr;  grid-template-areas: "a c" "b b"}
    .content-simple_text .text-container.layout-3{ grid-template-columns:1fr 1fr;  grid-template-areas: "a b" "c c"}
}

.content-simple_text .text-container h2{font-size:var(--32)}
.content-simple_text .text-container h3{font-size:var(--30)}
.content-simple_text .text-container h4{font-size:var(--26)}
.content-simple_text .text-container h5{font-size:var(--22); font-family:var(--body-font); font-weight:600}
.content-simple_text .text-container h6{font-size:var(--18); font-family:var(--body-font); font-weight:600}


.text-container p:not(:last-child){margin-bottom:var(--16)}

/* DEFAULT SECTION HEADER */


/* HERO */



/* BANNER */
.banner-250x500{width:100%;}
.banner-970-250{width:100%; }
.sticky-banner{    position: sticky;   top: var(--header-height);}


/* BLOCK CONTAINER */



/* post list*/
.post-list-wrapper .nuova-highlight-wrapper{position:relative}
.post-list-wrapper .nuova-highlight-wrapper img{position:absolute; width:100%; height:calc(100% - 1rem); object-position:left; object-fit:contain}


.homepage-grid {
    display: grid;
    gap:0 ;
  
   --central :calc((100% - 2px) /2);
    grid-template-columns: var(--sidew) var(--central) var(--central) var(--sidew);
    grid-template-areas: 
    ". header header ." 
    ". featured featured ." 
    ". b1 b2 ." 
    ". hot hot ."
    ". banner-middle banner-middle ."
    ". post-1 post-1 ."
     ". news news ."
    ". post-2 post-2 ."
    ". b3 b4 ."
    ". post-3 post-3 ."
    ". post-4 post-4 ."
    ". post-5 post-5 ."
    ". post-6 post-6 ."
    ". post-7 post-7 ."
    ". post-8 post-8 ."
    
}



@media screen and (width>64em){

.homepage-grid {
    gap:0 var(--32) ;
    display: grid;
   
    grid-template-columns: var(--sidew) var(--inner-width) var(--sidew);
    grid-template-areas: 
    "b1 header b2" 
    "b1 featured b2"
    "b1 hot b2"
    "b1 banner-middle b2"
    "b1 post-1 b2"
    ". post-2 ."
    "b3 post-3 b4"
    "b3 post-4 b4"
    "b3 post-5 b4"
    ". post-6 ."
    ". news ."
    ". post-7 ."
    ". post-8 ."
    
}
}
 .banner-1{grid-area:b1; padding-inline:var(--8)}
 .banner-2{grid-area:b2;padding-inline:var(--8)}
 .banner-3{grid-area:b3;padding-inline:var(--8)}
 .banner-4{grid-area:b4;padding-inline:var(--8)}
.page-header{grid-area:header;}
 .featured-post{grid-area:featured}
.hot-topics{grid-area:hot}
.posts{grid-area:posts}
.news{grid-area:news; margin-bottom:calc(var(--80) * 2)}
.banner-middle{grid-area:banner-middle; margin-bottom:var(--80)}
.post-list-1{grid-area:post-1;}
.post-list-2{grid-area:post-2;}
.post-list-3{grid-area:post-3;}
.post-list-4{grid-area:post-4;}
.post-list-5{grid-area:post-5;}
.post-list-6{grid-area:post-6;}
.post-list-7{grid-area:post-7;}
.post-list-8{grid-area:post-8;}


.archive-grid {
  --central :var(--inner-width);
    display: grid;
    gap:0 ;
  
   --central :calc((100% - 2px) /2);
    grid-template-columns: var(--sidew) var(--central) var(--central) var(--sidew);
    grid-template-areas:
    ". header header ."
    ". b1 b2 ." 
    ". post-1 post-1 ."
    ". b3 b3 ."
    
    
}

@media screen and (width>64em){

.archive-grid {
    gap:0 var(--24) ;
  
    grid-template-columns: 1fr  var(--inner-width) 1fr;
    grid-template-areas: 
    "b1 header b2" 
    "b1 post-1 b2"
    ". b3 ."
    
}
}




.archive.category .archive-grid {
    grid-template-areas: 
    ". header header ."
    ". b1 b2 ." 
    ". post-1 post-1 ."
    ". b3 b3 ."
    ". hot hot ."
    ". b4 b4 ."
    
    
}

@media screen and (width>64em){

.archive.category .archive-grid {
  grid-template-areas: 
    "b1 header b2" 
    "b1 b3 b2"
    "b1 post-1 b2"
    "b1 b4 b2"
    ". hot ."
    
}
}

.archive.date .archive-grid {
    grid-template-areas: 
    ". header header ."
    ". b1 b2 ." 
    ". post-1 post-1 ."
    ". b3 b3 ."
    
    
}

@media screen and (width>64em){

.archive.date .archive-grid {
      grid-template-areas: 
    "b1 header b2" 
    "b1 post-1 b2"
    ". b3 ."
    
}
}



.single-grid{

 display: grid;
    gap:0 ;
  
    --central :calc((100% - 2px) /2);
    grid-template-columns: var(--sidew) var(--central) var(--central) var(--sidew);
    grid-template-areas: 
    ". header header ." 
    ". post-1 post-1 ."
    ". b1 b2 ." 
    ". post-2 post-2 ." 
    ". post-3 post-3 ." 
   

}
@media screen and (width>64em){
.single-grid{
     gap:0 var(--32) ;
   
    grid-template-columns: var(--sidew) var(--inner-width) var(--sidew);
    grid-template-areas: 
    "b1 header b2" 
    "b1 post-1 b2"
    "b1 post-2 b2" 
    ". post-3 ." 
   
}
}

.post-list[data-scroll] article{ width:300px}


@media screen and (width> 64em){
  
  .post-list[data-post-slider] .each-post{margin-inline:var(--16)}
}


.featured-image a {overflow:clip; display:block}
.featured-image a img{transition:opacity .2s ease}
.featured-image a:hover img{opacity:.8}

 @media screen and (width>390px){
  article.side-text {grid-template-columns:1fr 2fr; align-items:end}
  article.side-text.even-columns{grid-template-columns:1fr 1fr;}
 }

article .title{text-wrap: pretty;}

article.side-text .featured-image img{aspect-ratio:1.1}
article.side-text  h3{font-size:var(--18)}


.large-cols-1.layout-grid h3{font-size:var(--32)}
.large-grid-cols-4.layout-grid h3{font-size:var(--18)}

@media screen and (width> 40em){
  .layout-vertical article{grid-template-columns:5fr 3fr; align-items:end}
.layout-vertical.even-columns article{grid-template-columns:1fr 1fr; }
}

@media screen and (width > 64em){
.layout-block-grid article:first-child .featured-image{grid-row: 1 / 5; position:relative; min-height:25rem}
.layout-block-grid article:first-child .featured-image a{ position:absolute; inset:0; }
.layout-block-grid article:first-child .featured-image img{aspect-ratio:revert;height:100%}
.layout-block-grid article:first-child h3{font-size:var(--32)}
}
[data-swiper]{  --swiper-theme-color: var(--black); padding-bottom:20px}
[data-swiper] article img{aspect-ratio:1}
[data-swiper] article h3{font-size:var(--18)}
@media screen and (width > 40em){
  [data-swiper]{padding-bottom:50px}
}
.cat-list a{color:var(--primary-600)}
.cat-list a:hover{color:var(--primary-800)}
.content-related article h3{font-size:var(--18)}

[data-gallery-slider]{  --swiper-theme-color: var(--black); padding-bottom:50px; position:relative; overflow:clip}


/* navi */

.page-navi .nav-link{margin-inline:24px}
.page-navi .nav-link:last-child{text-align:right}
.page-navi a:hover{color:var(--grey-500)}

/* SINGLE POST */

.entry-content  :is(p, ul, blockquote, ol, dl, .single-gallery):not(:last-child){margin-bottom:var(--32)}
.entry-content :is(h1, h2,h3,h4,h5,h6):not(:first-child){margin-block:3ex 1ch; line-height:1.2}
.entry-content h2{font-size:var(--32); font-weight:600}
.entry-content h3{font-size:var(--30); font-weight:600}
.entry-content h4{font-size:var(--26); font-weight:600}
.entry-content h5{font-size:var(--22);  font-weight:600}
.entry-content h6{font-size:var(--18); font-weight:600}
.entry-content img{max-width:100%;}
.entry-content .wp-caption{max-width:100%; margin-bottom:var(--24)}
.entry-content .wp-caption-text, figure figcaption{font-size:var(--13); color:var(--grey-800); margin-block:var(--8); }
.entry-content  a:not(.button-contained, .button-underline){text-decoration: underline; text-underline-offset: .4ch; font-weight: 400;  --textColor: var(--text-color);  font-size: inherit;}

@media screen and (width>64em){
.wp-caption.alignleft{float:left; margin-right:10px}
.wp-caption.alignRight{float:right; margin-left:10px}
}

.entry-content .aligncenter{margin-inline: auto;}
.entry-content .alignright{margin-left:auto}
.entry-content > :is(li, dt){margin-bottom:var(--16)}
.video-player{width:100%; aspect-ratio:1.77; position:relative; cursor:pointer; max-height:90vh; overflow:clip; margin-bottom:1rem}
.video-player img{width:100%;aspect-ratio:1.77; object-fit:cover;}
.video-player iframe{width:100%; height:100%}
.video-player .play{width:var(--64); height:var(--64); background:url(../images/play.svg) center center no-repeat; background-size:contain; position:absolute; margin-inline: auto;
    inset: 50% 0 0 0;    translate: 0 -50%; cursor:pointer; transition: opacity linear .15s}
.video-player:hover .play{opacity:.8}

.content-related button:not(.button-square){display:none}

.nuova-adlabel{font-size:var(--12); color:var(--grey-400)}


.lightbox-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.95);
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
}

.lightbox-wrapper {
  width: 100%;
  height: 100%;
  position: relative;
}

.lightbox-swiper,
.lightbox-swiper .swiper-slide {
  width: 100%;
  height: 100%;
}

.lightbox-swiper img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.lightbox-close {
  position: absolute;
  top: 24px;
  right: 24px;
  font-size: 32px;
  background: none;
  color: white;
  border: none;
  cursor: pointer;
  z-index:9999
}

.lightbox-overlay .swiper-button-next, .swiper-button-prev{--swiper-theme-color:white}



/* BREVO */
#sib-form > div {margin-bottom:10px}

.content-simple_text .sib-form{
    font-size: inherit;
    font-family: inherit;
    padding:0;
    margin: 0;
  
    p{margin:0 !important}
    #sib-container{
      padding:0
    }
  
    .sib-form-block{padding:0}
  .entry__error{color:var(--error)}

  .input_replaced:checked+.checkbox_tick_positive{background:var(--black); border-color:var(--black)}
   a{color:var(--black); display:inline}
    .entry__label{font-weight:400}
    .entry__field{border-radius:0; border-color:var(--black)}
    .entry__label::after{color:var(--error)}
  }
  
   #error-message{background:var(--error-light); border-color:var(--error); color:var(--error);
  
    .sib-icon{fill:var(--error)}
  }

   #success-message{background:var(--success-light); border-color:var(--success); color:var(--success);
  
    .sib-icon{fill:var(--success)}
  }


  .nuova-adlabel{display:none}

.gt_selector{background:var(--black); margin:0; padding:0; width:9ch}
