/*!**********************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[1].use[3]!./components/blocks/info-scroll/styles/src/info-scroll.scss ***!
  \**********************************************************************************************************************************************************************************************************************************************************************************/
:root{
  --spacing-m:clamp(10rem, 35vh, 20rem);
  --spacing-s:calc(var(--spacing-m)/2);
  --col-default:content;
  --col-full:1 / -1;
  --col-left:full-width-start / center-start;
  --col-right:center-start / content-end;
  --col-right-extended:center-start / -1;
  --border-radius-l:10rem;
  --border-radius-ml:6rem;
  --border-radius-m:4rem;
  --border-radius-s:2rem;
  --border-l:0 0 var(--border-radius-l) 0;
  --border-ml:0 0 var(--border-radius-ml) 0;
  --border-m:0 0 var(--border-radius-m) 0;
  --border-s:0 0 var(--border-radius-s) 0;
  --ease-smooth:cubic-bezier(0.5, 0.05, 0, 1);
}

[data-wp-router-region=content].is-loading{
  opacity:.7;
  pointer-events:none;
  position:relative;
  transition:opacity .3s ease-in-out;
}

[data-wp-router-region=content].is-loading:after{
  background:hsla(0,0%,100%,.8);
  bottom:0;
  content:"";
  left:0;
  position:absolute;
  right:0;
  top:0;
  z-index:1;
}

.footer__menu a.is-active,.footer__sub-menu a.is-active,.header__menu a.is-active{
  font-weight:700;
  position:relative;
}

.footer__menu a.is-active:after,.footer__sub-menu a.is-active:after,.header__menu a.is-active:after{
  background-color:currentColor;
  bottom:-4px;
  content:"";
  height:2px;
  left:0;
  position:absolute;
  right:0;
}

.footer__menu a,.footer__sub-menu a,.header__menu a{
  transition:all .2s ease-in-out;
}

.footer__menu a:hover,.footer__sub-menu a:hover,.header__menu a:hover{
  opacity:.8;
}

.info-scroller{
  height:100lvh;
  left:50%;
  margin-left:-50vw;
  margin-right:-50vw;
  margin-top:var(--spacing-m);
  position:relative;
  right:50%;
  width:100vw;
}

.info-scroller-item{
  left:0;
  position:absolute;
  top:0;
  width:100%;
}
.info-scroller-item .content{
  position:relative;
}
.info-scroller-item .wp-block-image{
  left:50%;
  margin-left:-50vw;
  margin-right:-50vw;
  position:relative;
  right:50%;
  width:100vw;
}
.info-scroller-item .wp-block-image img{
  height:100lvh;
  max-width:calc(100% - 4rem);
  width:calc(50% + 25rem);
}
.info-scroller-item .wp-block-group{
  --column:1 / -1;
  background-color:var(--color-gold);
  border-radius:var(--border-m);
  color:#000;
  max-width:55rem;
  padding:10rem;
  position:absolute;
  right:0;
  top:50%;
  transform:translateY(-50%);
}
.info-scroller-item .wp-block-group h2{
  color:#fff;
  margin-bottom:2rem;
  margin-top:0;
}
.info-scroller-item .progress-bar{
  background-color:#e1c8a7;
  height:100%;
  left:0;
  position:absolute;
  top:0;
  width:.5rem;
}
.info-scroller-item .progress-bar__inner{
  background-color:var(--color-gold-100);
  height:100%;
  transform:scaleY(0);
  transform-origin:top;
  width:100%;
}
.info-scroller-item .timeline-controls{
  align-items:center;
  display:flex;
  flex-flow:row nowrap;
  gap:1rem;
  margin-bottom:4rem;
}
.info-scroller-item .timeline-controls__button{
  background-color:var(--color-green);
  cursor:pointer;
  display:block;
  height:1rem;
  -webkit-mask-image:url(/wp-content/themes/apicem/assets/img/icons/arrow.svg);
          mask-image:url(/wp-content/themes/apicem/assets/img/icons/arrow.svg);
  -webkit-mask-repeat:no-repeat;
          mask-repeat:no-repeat;
  -webkit-mask-size:contain;
          mask-size:contain;
  width:1rem;
}
.info-scroller-item .timeline-controls__button:last-child{
  transform:scaleX(-1);
}
.info-scroller-item .timeline-controls__indicator{
  color:var(--color-green);
  font-family:Literata,serif;
  font-variation-settings:"wght" 400;
  line-height:.95;
  margin:0;
}

/*! Add Soul */
/*# sourceMappingURL=info-scroll.css.map*/