/*
Theme Name: Uxdwh Child
Template: uxdwh
*/


/* yuur customs style here */

/* clearfix for post float images */
.clearfix:after {
    visibility: hidden;
    display: block;
    content: "";
    clear: both;
    height: 0;
  }
  * html .clearfix            { zoom: 1; } /* IE6 */
  *:first-child+html .clearfix { zoom: 1; } /* IE7 */
  
  
  /* Global Style 
  ------------------- */
  
  .text-rainbow {
    background-image: linear-gradient(122deg,#f17b85,#f79393 15%,#fee4a5 45%,#9ae8b0 65%,#5ba5d0 90%,#9078d0);
    -webkit-mask-image: linear-gradient(122deg,#f17b85,#f79393 15%,#fee4a5 45%,#9ae8b0 65%,#5ba5d0 90%,#9078d0);
    -webkit-box-decoration-break: clone;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  span.standout {
    background: -webkit-linear-gradient(var(--primary-light),var(--primary));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  .uxd-subtitle {
  text-transform: uppercase;
  order: -1;
  font-size: var(--text-l);
  font-weight: 700;
  background: rgb(137,18,206);
  background: linear-gradient(50deg, rgba(137,18,206,1) 30%, rgba(58,199,212,1) 100%);
  -webkit-mask-image: linear-gradient(50deg, rgba(137,18,206,1) 30%, rgba(58,199,212,1) 100%);
  -webkit-box-decoration-break: clone;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  }
  .span-subtitle {
  background: rgb(137,18,206);
  background: linear-gradient(50deg, rgba(137,18,206,1) 30%, rgba(58,199,212,1) 100%);
  -webkit-mask-image: linear-gradient(50deg, rgba(137,18,206,1) 30%, rgba(58,199,212,1) 100%);
  -webkit-box-decoration-break: clone;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent; 
  }
  .uxd-divider {
  height: 4px;
  width: 80%;
  border-radius: var(--rad-m);
  background: rgb(137,18,206);
  background: linear-gradient(50deg, rgba(137,18,206,1) 30%, rgba(58,199,212,1) 100%);
  -webkit-mask-image: linear-gradient(50deg, rgba(137,18,206,1) 30%, rgba(58,199,212,1) 100%);
  -webkit-box-decoration-break: clone;
  }
  .order-one {
  order: -1;
  }
  main .prefooter-category a:hover {
  text-decoration: underline;
  }
  .uxd-img {
    max-width: 100%;
    height: auto;   
  }
  .uxd-img-alpha-shadow {
    object-fit: cover;
    width: 100%;
    aspect-ratio: auto;
    box-shadow: 0px 30px 40px -10px rgba(0,0,0,0.5);
  }
  /** column **/
  .flex-column {
  display: flex;
  flex-direction: column;
  width: 100%;
  align-items: flex-start;
  }
  .flex-row {
  display: flex;
  flex-direction: row;
  width: 100%;
  align-items: flex-start;
  }
  .flex-wrap {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  justify-content: flex-start;
  }
  .flex {
  display: flex;
  flex-wrap: wrap;
  }
  .flex-center-all {
    align-items: center;
    text-align: center;
    display: flex;
    flex-direction: column;
  width: 100%;
  }
  .center-all {
  align-items: center;  
    justify-content: center;
  }
  .relative {
  position: relative;
  }
  .absolute {
  position: absolute;
  }
  .align-center {
  align-items: center;
  }
  /** ! Grid **/
  .grid-1-2 {
    display: grid;
    grid-template-columns: 1fr 2fr;
    align-items: stretch; 
    width: 100%;
  }
  .grid-1-3 {
    display: grid;
    grid-template-columns: 1fr 3fr;
    align-items: stretch; 
    width: 100%;
  }
  .grid-1-4 {
    display: grid;
    grid-template-columns: 1fr 4fr;
    align-items: stretch; 
    width: 100%;
  }
  .grid-2-3 {
    display: grid;
    grid-template-columns: 2fr 3fr;
    align-items: stretch; 
    width: 100%;
  }
  .grid-6 {
    display: grid;
    grid-template-columns: repeat(6, 1fr); 
    width: 100%  
  }
  .grid-5 {
    display: grid;
    grid-template-columns: repeat(5, 1fr); 
    width: 100%
  }
  .grid-4 {
    display: grid;
    grid-template-columns: repeat(4, 1fr); 
    width: 100%  
  }
  .grid-3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr); 
    width: 100%  
  }
  .grid-2 {
    display: grid;
    grid-template-columns: repeat(2, 1fr); 
    width: 100%  
  }
  /*gap*/
  .gap--xs {
    gap: var(--space-xs);  
  }
  .gap--s {
    gap: var(--space-s);  
  }
  .gap--m {
    gap: var(--space-m);  
  }
  .gap--l {
    gap: var(--space-l);  
  }
  .gap--xl {
    gap: var(--space-xl);  
  }
.margin-top-xl {
    margin-top: var(--space-xl);
  }
  .margin-top-l {
    margin-top: var(--space-l);
  }
  .margin-top-m {
    margin-top: var(--space-m);
  }
  
  /** text **/
  .text-h1 {
  font-size: var(--h1)  
  }
  .text-h2 {
    font-size: var(--h2)    
  }
  .text-h3 {
    font-size: var(--h3)    
  }
  .text-h4 {
    font-size: var(--h4)    
  }
  .text-h5 {
    font-size: var(--h5)    
  }
  .text-h6 {
    font-size: var(--h6)    
  }
  .text-xxl {
  font-size: var(--text-xxl)    
  }
  .text-xl {
  font-size: var(--text-xl)    
  }
  .text-l {
  font-size: var(--text-l)  
  }
  .text-m {
  font-size: var(--text-m)    
  }
  .text-s {
   font-size: var(--text-s)    
  }
  .text-xs {
   font-size: var(--text-xs)   
  }
  .w5 {
  font-weight: 500;
  }
  .w6 {
  font-weight: 600; 
  }
  .w7 {
  font-weight: 700;
  }
  .w8 {
  font-weight: 800;
  }
  .w9 {
  font-weight: 900;
  }
  .vh-50 {
  min-height: 50vh;  
  }
  .vh-60 {
  min-height: 60vh;    
  }
  .vh-70 {
  min-height: 70vh;    
  }
  .text-center {
  text-align: center;
  }
  .text-left {
  text-align: left;
  }
  .text-white {
  color: var(--white)
  }
  .text-dark {
  color: var(--black)
  }
  .p-grey p {
  color: var(--grey-dark);
  }
  .m-w-900 {
  max-width: 900px;
  width: 100%;
  }
  .m-w-800 {
  max-width: 800px;
  width: 100%;
  }
  .m-w-700 {
  max-width: 700px;
  width: 100%;
  }
  
  /* button */
  .btn-action {
    background-color: var(--action);
    color: var(--action-ultra-dark);
    cursor: pointer;
    border-style: solid;
    border-color: var(--action);
    padding: 1em 1.5em;
    border-width: 0.25rem;
    border-radius: 2.25rem;
    text-transform: none;
    -webkit-text-decoration: none;
    text-decoration: none;
    letter-spacing: 0;
    font-weight: 400;
    font-style: normal;
    min-width: 200px;
    text-align: center;
  }
  .btn-action:hover {
    background-color: var(--action-hover);
    border-color: var(--action-hover);
    color: var(--action-ultra-dark);  
  }
  .btn-primary {
    background-color: var(--primary);
    color: var(--primary-ultra-dark);
    cursor: pointer;
    border-style: solid;
    border-color: var(--primary);
    padding: 1em 1.5em;
    border-width: 0.25rem;
    border-radius: 2.25rem;
    text-transform: none;
    -webkit-text-decoration: none;
    text-decoration: none;
    letter-spacing: 0;
    font-weight: 400;
    font-style: normal;
    min-width: 200px;
    text-align: center;
  }
  .btn-primary:hover {
    background-color: var(--primary-hover);
    border-color: var(--primary-hover);
    color: var(--primary-ultra-dark);  
  }
  .btn-secondary {
    background-color: var(--secondary);
    color: var(--secondary-ultra-dark);
    cursor: pointer;
    border-style: solid;
    border-color: var(--secondary);
    padding: 1em 1.5em;
    border-width: 0.25rem;
    border-radius: 2.25rem;
    text-transform: none;
    -webkit-text-decoration: none;
    text-decoration: none;
    letter-spacing: 0;
    font-weight: 400;
    font-style: normal;
    min-width: 200px;
    text-align: center;
  }
  .btn-secondary:hover {
    background-color: var(--secondary-hover);
    border-color: var(--secondary-hover);
    color: var(--secondary-ultra-dark);  
  }
  
  /** cft7 style**/
  .wpcf7 input, .wpcf7 textarea {
  border-radius: 0;
  border: initial;
  padding: 0.5em;
  margin-top: 0.4em;
  margin-bottom: 0.7em;
  border-radius: var(--rad-s)
  }
  .wpcf7-form-control.has-spinner.wpcf7-submit {
  padding: 0.7em 1.9em;
  border-radius: var(--rad-m);
  color: var(--primary);
  
  cursor: pointer;
  }
  input[type="submit" i] {
    background: var(--primary);
  }
  .wpcf7-list-item {
    margin: 0;
  }
  .wpcf7-list-item label {
    background: var(--base);
    padding: 0.4em!important;
    display: flex;
    align-items: flex-start;
    gap: 0.5em;  
  }
  /* Breakpoint 991px */
  @media only screen and (max-width: 991px) {
  .grid-6, .grid-5 {
    grid-template-columns: 3fr
  }
   .grid-4, .grid-3 {
    grid-template-columns: 2fr
  }
  
  }
  
  /* Breakpoint 767px */
  @media only screen and (max-width: 767px) {
  .grid-6, .grid-5 {
    grid-template-columns: 2fr
  }
  }
  
  /* Breakpoint 479px */
  @media only screen and (max-width: 479px) {
    .grid-2 {
      grid-template-columns: 1fr
    }
  }
  
  
  /* swiper JS
  ------------------------------------------ */
  /* swiper */
  .swiper-section {
    background: #121212;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to left, #434343, #121212 40%);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to left, #434343, #121212 40%); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    background-image: url("/wp-content/uploads/basic-background.svg");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: 80% bottom;
    background-size: 900px auto;
    padding: 0 clamp(1rem,calc(-0.2431rem + 5.3039vw),4rem);
  }
  .swiper {
    width: 100%;
    height: 620px;
  }
  .swiper h1 {
      font-size: var(--h1-big);
  }
  .swiper-inner {
    max-width: 1320px;
  }
  .swiper-button-next, .swiper-button-prev {
        background: var(--action);
      padding: 18px 18px;
      border-radius: 50%;
  }
  .swiper-button-next:hover, .swiper-button-prev:hover {
    background: var(--action-hover);
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-position: center;  
  }
  .swiper-button-next:hover {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ctitle%3Earrow-right-drop-circle-outline%3C/title%3E%3Cpath d='M2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2A10,10 0 0,0 2,12M4,12A8,8 0 0,1 12,4A8,8 0 0,1 20,12A8,8 0 0,1 12,20A8,8 0 0,1 4,12M10,17L15,12L10,7V17Z' fill='%2340005b'/%3E%3C/svg%3E");
  }
  .swiper-button-next {
   background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ctitle%3Earrow-right-drop-circle-outline%3C/title%3E%3Cpath d='M2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2A10,10 0 0,0 2,12M4,12A8,8 0 0,1 12,4A8,8 0 0,1 20,12A8,8 0 0,1 12,20A8,8 0 0,1 4,12M10,17L15,12L10,7V17Z' fill='%2340005b'/%3E%3C/svg%3E"); 
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-position: center;  
    top: 89%;
    right: 10%;
  }
  
  .swiper-button-prev:hover {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ctitle%3Earrow-left-drop-circle-outline%3C/title%3E%3Cpath d='M22,12A10,10 0 0,0 12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12M20,12A8,8 0 0,1 12,20A8,8 0 0,1 4,12A8,8 0 0,1 12,4A8,8 0 0,1 20,12M14,7L9,12L14,17V7Z' fill='%2340005b'/%3E%3C/svg%3E");
  }
  .swiper-button-prev {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ctitle%3Earrow-left-drop-circle-outline%3C/title%3E%3Cpath d='M22,12A10,10 0 0,0 12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12M20,12A8,8 0 0,1 12,20A8,8 0 0,1 4,12A8,8 0 0,1 12,4A8,8 0 0,1 20,12M14,7L9,12L14,17V7Z' fill='%2340005b'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-position: center;
    right: 10%;
    left: inherit;
    top: 80%;
  }
  .swiper-button-next::after {
    display: none;
  }  
  .swiper-button-prev::after {
    display: none;
  }  
  .swiper-slide__inner {
      z-index: 2;
      position: relative;
      height: 100%;
      justify-content: center;
      align-items: flex-start;
      display: flex;
      flex-direction: column;
  }
  .swiper-info {
    margin-top: var(--space-m);
    margin-bottom: var(--space-m);
    max-width: 600px;
    font-size: var(--text-l);
    font-weight: 500;
  }
  .swiper-slide__featured {
      position: absolute;
        width: 100%;
        height: 100%;
      object-fit: cover;
        aspect-ratio: 1;
  }
  .swiper__hero-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .swiper__bg-overlay {
      background-image: linear-gradient(to top, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.6));
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
  }
  
  .swiper-pagination-bullet-active {
      transform: scale3d(1.2, 1.2, 1.2);
  }



  .clickable-parent {
    &::after{
        content: '';
        display: flex;
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        cursor: pointer;
    }
}
.link--skip, .ct-link-text.link--skip {
    position: absolute;
    top: 1rem;
    left: 1rem;
    transform: translateY(-250%);
    padding: 0.7em 1.4em;
    border-width: 0.25rem;
    border-radius: 0.6rem;
    text-transform: none;
    -webkit-text-decoration: none;
    text-decoration: none;
    letter-spacing: 0;
    font-weight: 500;
    font-style: normal;
    min-width: 10rem;
    line-height: 1;
    background: var(--primary);
    color: var(--primary-light);
    text-align: center;
}
.link--skip:focus, .ct-link-text.link--skip:focus {
    transform: translateY(0);
}
/* gestione padding inner section */
section.uxd-section, .ct-section {
    padding: clamp(2rem, calc(0.7569rem + 5.3039vw), 5rem) clamp(1rem, calc(-0.2431rem + 5.3039vw), 4rem); 
    width: 100%;
}
section .uxd-inner { 
    max-width: var(--site-width);
    margin-inline: auto;  
    width: 100%;
}
section.section-pad--none {
    padding: 0;
}

main .main-margin>*:first-child>*:first-child {
    margin-top: var(--header-height)
}

/** new css uxdwh **/

.background-2 {
background-color: #101923;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='400' viewBox='0 0 800 800'%3E%3Cg fill='none' stroke='%23521313' stroke-width='1'%3E%3Cpath d='M769 229L1037 260.9M927 880L731 737 520 660 309 538 40 599 295 764 126.5 879.5 40 599-197 493 102 382-31 229 126.5 79.5-69-63'/%3E%3Cpath d='M-31 229L237 261 390 382 603 493 308.5 537.5 101.5 381.5M370 905L295 764'/%3E%3Cpath d='M520 660L578 842 731 737 840 599 603 493 520 660 295 764 309 538 390 382 539 269 769 229 577.5 41.5 370 105 295 -36 126.5 79.5 237 261 102 382 40 599 -69 737 127 880'/%3E%3Cpath d='M520-140L578.5 42.5 731-63M603 493L539 269 237 261 370 105M902 382L539 269M390 382L102 382'/%3E%3Cpath d='M-222 42L126.5 79.5 370 105 539 269 577.5 41.5 927 80 769 229 902 382 603 493 731 737M295-36L577.5 41.5M578 842L295 764M40-201L127 80M102 382L-261 269'/%3E%3C/g%3E%3Cg fill='%2398080E'%3E%3Ccircle cx='769' cy='229' r='5'/%3E%3Ccircle cx='539' cy='269' r='5'/%3E%3Ccircle cx='603' cy='493' r='5'/%3E%3Ccircle cx='731' cy='737' r='5'/%3E%3Ccircle cx='520' cy='660' r='5'/%3E%3Ccircle cx='309' cy='538' r='5'/%3E%3Ccircle cx='295' cy='764' r='5'/%3E%3Ccircle cx='40' cy='599' r='5'/%3E%3Ccircle cx='102' cy='382' r='5'/%3E%3Ccircle cx='127' cy='80' r='5'/%3E%3Ccircle cx='370' cy='105' r='5'/%3E%3Ccircle cx='578' cy='42' r='5'/%3E%3Ccircle cx='237' cy='261' r='5'/%3E%3Ccircle cx='390' cy='382' r='5'/%3E%3C/g%3E%3C/svg%3E");  
}

.background-3 {
  background-color: #101923;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='400' viewBox='0 0 800 800'%3E%3Cg fill='none' stroke='%230D4437' stroke-width='1'%3E%3Cpath d='M769 229L1037 260.9M927 880L731 737 520 660 309 538 40 599 295 764 126.5 879.5 40 599-197 493 102 382-31 229 126.5 79.5-69-63'/%3E%3Cpath d='M-31 229L237 261 390 382 603 493 308.5 537.5 101.5 381.5M370 905L295 764'/%3E%3Cpath d='M520 660L578 842 731 737 840 599 603 493 520 660 295 764 309 538 390 382 539 269 769 229 577.5 41.5 370 105 295 -36 126.5 79.5 237 261 102 382 40 599 -69 737 127 880'/%3E%3Cpath d='M520-140L578.5 42.5 731-63M603 493L539 269 237 261 370 105M902 382L539 269M390 382L102 382'/%3E%3Cpath d='M-222 42L126.5 79.5 370 105 539 269 577.5 41.5 927 80 769 229 902 382 603 493 731 737M295-36L577.5 41.5M578 842L295 764M40-201L127 80M102 382L-261 269'/%3E%3C/g%3E%3Cg fill='%2326C9A4'%3E%3Ccircle cx='769' cy='229' r='5'/%3E%3Ccircle cx='539' cy='269' r='5'/%3E%3Ccircle cx='603' cy='493' r='5'/%3E%3Ccircle cx='731' cy='737' r='5'/%3E%3Ccircle cx='520' cy='660' r='5'/%3E%3Ccircle cx='309' cy='538' r='5'/%3E%3Ccircle cx='295' cy='764' r='5'/%3E%3Ccircle cx='40' cy='599' r='5'/%3E%3Ccircle cx='102' cy='382' r='5'/%3E%3Ccircle cx='127' cy='80' r='5'/%3E%3Ccircle cx='370' cy='105' r='5'/%3E%3Ccircle cx='578' cy='42' r='5'/%3E%3Ccircle cx='237' cy='261' r='5'/%3E%3Ccircle cx='390' cy='382' r='5'/%3E%3C/g%3E%3C/svg%3E");
}
.background-4 {
    background-color: #101923;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 1000'%3E%3Cg %3E%3Ccircle fill='%23101923' cx='50' cy='0' r='50'/%3E%3Cg fill='%23121c2b' %3E%3Ccircle cx='0' cy='50' r='50'/%3E%3Ccircle cx='100' cy='50' r='50'/%3E%3C/g%3E%3Ccircle fill='%23152033' cx='50' cy='100' r='50'/%3E%3Cg fill='%2319223b' %3E%3Ccircle cx='0' cy='150' r='50'/%3E%3Ccircle cx='100' cy='150' r='50'/%3E%3C/g%3E%3Ccircle fill='%23202542' cx='50' cy='200' r='50'/%3E%3Cg fill='%23282749' %3E%3Ccircle cx='0' cy='250' r='50'/%3E%3Ccircle cx='100' cy='250' r='50'/%3E%3C/g%3E%3Ccircle fill='%2332284f' cx='50' cy='300' r='50'/%3E%3Cg fill='%233c2954' %3E%3Ccircle cx='0' cy='350' r='50'/%3E%3Ccircle cx='100' cy='350' r='50'/%3E%3C/g%3E%3Ccircle fill='%23482a59' cx='50' cy='400' r='50'/%3E%3Cg fill='%2354295c' %3E%3Ccircle cx='0' cy='450' r='50'/%3E%3Ccircle cx='100' cy='450' r='50'/%3E%3C/g%3E%3Ccircle fill='%2360285e' cx='50' cy='500' r='50'/%3E%3Cg fill='%236d275e' %3E%3Ccircle cx='0' cy='550' r='50'/%3E%3Ccircle cx='100' cy='550' r='50'/%3E%3C/g%3E%3Ccircle fill='%2379255e' cx='50' cy='600' r='50'/%3E%3Cg fill='%2386225c' %3E%3Ccircle cx='0' cy='650' r='50'/%3E%3Ccircle cx='100' cy='650' r='50'/%3E%3C/g%3E%3Ccircle fill='%23921f59' cx='50' cy='700' r='50'/%3E%3Cg fill='%239d1c55' %3E%3Ccircle cx='0' cy='750' r='50'/%3E%3Ccircle cx='100' cy='750' r='50'/%3E%3C/g%3E%3Ccircle fill='%23a71b4f' cx='50' cy='800' r='50'/%3E%3Cg fill='%23b11b49' %3E%3Ccircle cx='0' cy='850' r='50'/%3E%3Ccircle cx='100' cy='850' r='50'/%3E%3C/g%3E%3Ccircle fill='%23b91e41' cx='50' cy='900' r='50'/%3E%3Cg fill='%23c02439' %3E%3Ccircle cx='0' cy='950' r='50'/%3E%3Ccircle cx='100' cy='950' r='50'/%3E%3C/g%3E%3Ccircle fill='%23C62C2F' cx='50' cy='1000' r='50'/%3E%3C/g%3E%3C/svg%3E");
background-attachment: fixed;
background-size: contain;
}
