/*
Theme Name: Goover-child
Text Domain: Goover-child
Version: 2g1c
Description: Al tempo degli dei dell'Olimpo, dei signori della guerra e dei re che spadroneggiavano su una terra in tumulto, il genere umano invocava il soccorso di un eroe per riconquistare la libertà finalmente arrivò Xena, l'invicibile princepessa guerriera forgiata dal fuoco di mille battaglie. La lotta per il potere, le sfrenate passioni, gli intrighi e tradimenti furono affrontati con indomito coraggio da colei, che sola, poteva cambiare il mondo.
Author: Goover Creative
Author URI: https://goovercreative.it
Template: goover-3.0



*/

@import 'tailwindcss';

@theme {

  --color-verde:#027578;
  --color-blus:#00364E;
  --color-grigio:#F3F3F3;




  --radius-48: 48px;

  --spacing-78: 78%;
  --spacing-88: 88%;
  --spacing-3vw: 3vw;
  --spacing-5vw: 5.6vw;
  --spacing-8vw: 8.7vw;
  --spacing-12px: 12px;
  --spacing-11vw: 11vw;



  --text-2em: 2em;
  --text-h1: 70px;
  --text-h1--line-height: 68px;
  --text-h1--font-weight: 700;
 --text-heading:2.3rem;
 --text-heading--line-height:1.2;

  --breakpoint-lg: 991px;

  --shadow-default: 0 3px 16px #00000029;
}

/*
  The default border color has changed to `currentcolor` in Tailwind CSS v4,
  so we've added these compatibility styles to make sure everything still
  looks the same as it did with Tailwind CSS v3.

  If we ever want to remove these styles, we need to add an explicit border
  color utility to any element that depends on these defaults.
*/

@font-face {
  font-family: 'ClashGrotesk-Regular';
  src: url('./fonts/ClashGrotesk-Regular.woff2') format('woff2'),
       url('./fonts/ClashGrotesk-Regular.woff') format('woff');

  font-weight: 400;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: 'ClashGrotesk-Medium';
  src: url('./fonts/ClashGrotesk-Medium.woff2') format('woff2'),
       url('./fonts/ClashGrotesk-Medium.woff') format('woff');
  
  font-weight: 500;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: 'ClashGrotesk-Semibold';
  src: url('./fonts/ClashGrotesk-Semibold.woff2') format('woff2'),
       url('./fonts/ClashGrotesk-Semibold.woff') format('woff');
     
  font-weight: 600;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: 'ClashGrotesk-Bold';
  src: url('./fonts/ClashGrotesk-Bold.woff2') format('woff2'),
       url('./fonts/ClashGrotesk-Bold.woff') format('woff');
      
  font-weight: 700;
  font-display: swap;
  font-style: normal;
}




@layer base {
  *,
  ::after,
  ::before,
  ::backdrop,
  ::file-selector-button {
    border-color: var(--color-gray-200, currentcolor);
  }
}
/* Modalità chiara */
@media (prefers-color-scheme: light) {
  body {

     color:var(--colore1);
  }
  .submenu-container {
  
  background: #fff;


}
}

/* Modalità scura */
@media (prefers-color-scheme: dark) {
    body {
background:#fff;
     color:var(--colore1);
  }
  .submenu-container {
  
  background: #fff;


}
}
body {
   
    font-size:var(--text-xl);
      font-family: 'ClashGrotesk-Regular';
}



h1,h2,h3 {
  font-size:var(--text-heading);
  line-height:var(--text-heading--line-height);
  font-family: 'ClashGrotesk-Medium';
  margin-bottom:1.5rem;

}
h1:not(.text-white),h2:not(.text-white),h3:not(.text-white) {
  color:var( --color-blus)
}

/*header */
header > div > .blur-header {
  backdrop-filter: blur(20px);

  width:100%;
  height:100%;
  position:absolute;
  top:0;
  left:0;
  z-index:-1;
}

#menu-menu-principale li a {
  font-size:2.5rem
}





/* effetti pagina */


.clip-sm-r {
  clip-path: polygon(0 0, 100% 0, calc(100% - 3rem) 100%, 0% 100%);
}
.clip-sm-l {
  clip-path: polygon(3rem 0, 100% 0, 100% 100%, 0 100%);
}
.clip-sm-x {
  clip-path: polygon(3rem 0, 100% 0, calc(100% - 3rem) 100%, 0% 100%);
}
.clip-xl-l {
  clip-path: polygon(5.48rem 0, 100% 0, 100% 100%, 0 100%);
}
.clip-xl-x {
  clip-path: polygon(5.48rem 0, 100% 0, calc(100% - 5.48rem) 100%, 0% 100%);
}
.clip-xl-r {
  clip-path: polygon(0 0, 100% 0, calc(100% - 5.48rem) 100%, 0% 100%);
}




@media (max-width:767px) {

.page-content .clip-sm-r-sost,.page-content .clip-sm-l-sost ,.page-content .clip-sm-r,.page-content .clip-sm-l,.page-content .clip-sm-x,.page-content .clip-xl-l,.page-content .clip-xl-x,.page-content .clip-xl-r {
  clip-path: polygon(0 0, 100% 3rem, 100% 100%, 0% 100%);
}

header .clip-sm-r {
  clip-path: polygon(0 0, 100% 0, calc(100% - 1.5rem) 100%, 0% 100%);
}
header .clip-sm-l {
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
}
header .clip-sm-x {
  clip-path: polygon(1.5rem 0, 100% 0, calc(100% - 1.5rem) 100%, 0% 100%);
}
}

.clip-top {
  clip-path: polygon(0 0, 100% 3rem, 100% 100%, 0% 100%);
}

.a-icon {
  display:inline-flex;
  align-items:center;
}
.a-icon:before {
content:'\e55d';
font-family: 'Material Symbols Outlined';
transform:rotate(90deg);
border-radius: .5rem;
display: inline-block;
padding-bottom:3rem;
background:var(--color-blus);
color:white;
margin-right:2.5rem;
transition:all .3s ease-out;
margin-left:2rem;
padding-left:3px
}
.a-icon:hover:before {
  background:var(--color-verde)
}
.after-clip {
  position:relative;
}
.after-clip:after {
  content:'';
  clip-path: polygon(0 0, 100% 100%, 100% 100%, 0% 100%);
  width:100%;
  height:100px;
position:absolute;
bottom:0;
left:0;
}
@media (max-width:767px) {
  .a-icon:before {
    padding-right:4px;
    padding-left:4px
  }

}
@media (min-width:991px) {
  .image-slide.r{
  transform:translateX(-100%);
  opacity: 0;
}
.image-slide.l {
  transform:translateX(100%);
  opacity:0
}
}

/* form */
.wpcf7-form br {
  display:none;
}
.wpcf7-form label {
  margin-bottom:1rem;
  display:block
}
input:not([type="checkbox"]), optgroup, select, textarea {
  width:100%;
  background:transparent;
  color:#fff;
  border-radius: 0;
}
.md\:-mx-4 {
    @media (width >= 48rem) {
      margin-left:-1rem;
      margin-right:-1rem;
    }
  }