:root{
  /* --accent-color: #7370FC;
   --accent-contrast: #472FDB;*/
  --light-grey: #F3F8FF;
  --light-border: #E7F1FF;
  --accent-light: #ccc2ff;
  --text-color: #24294D;
  --black: #24294D;
  --success: #00E6CD;
  --error:#fc8b72;

  --primary: #5362DE;
  --secondary: /*#00e3d2*/ #FDEA41;
  --alternate: #00E6CD;

  --accent-color: var(--primary);
  --accent-contrast:var(--primary);

  --title-font: 'Montserrat', sans-serif;
  --body-font:  'Montserrat', sans-serif;

  --bold: 700;
  --regular: 400;
  --light: 300;

  --container-width: min(95%,var(--max-width));
  --max-width: 95rem;
  --headerheight:110px;

  --msm: 2.5rem;
  --mmd: 4.375rem;
  --mlg: 6rem;


  /* FONT SIZES */
  --13: .813rem;
  --14: .875rem;
  --15: .938rem;
  --16: 1rem;
  --17: 1.063rem;
  --18: 1.125rem;
  --20:1.25rem;
  --25: 1.563rem;
  --28: 1.75rem;
  --30: 1.875rem;
  --35: 2.2rem;
  --40:2.5rem;
  --50: 3.125rem;
  --60:3.75rem;
  --70:4.375rem;

  --pad: .9375rem;
  --2pad: calc(var(--pad) * 2);



  --star-size: 20px;
  --star-color: grey;
  --star-background: #fc0;


  --primary-to-accent: hue-rotate(-73deg) saturate(1.39) brightness(1.85);
  --primary-to-accent:hue-rotate(75deg) saturate(13) brightness(.81);

  --primary-to-secondary: hue-rotate(-180deg) saturate(1.44) brightness(2.3);
  --secondary-to-primary:hue-rotate(75deg) saturate(13) brightness(.81);
}



/*.bg-dark{--accent-color:#8A88FC }*/

.Stars{
  --percent: calc(var(--rating) / 5 * 100%);

  display: inline-block;
  font-size: var(--star-size);
  font-family: Times; // make sure ★ appears correctly
line-height: 1; position: relative}

.Stars::before {
  content: '★★★★★';
  letter-spacing: 3px;
  background: linear-gradient(90deg, var(--star-background) var(--percent), var(--star-color) var(--percent));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}


::-moz-selection {  color: white;  background: var(--accent-color);}
::selection {  color: white;  background:  var(--accent-color);}
::-webkit-input-placeholder {  color: var(--text-color); font-weight: var(--regular)}
::-moz-placeholder {  color: var(--text-color);font-weight: var(--regular)}
:-ms-input-placeholder {   color: var(--text-color);font-weight: var(--regular)}
:-moz-placeholder {   color: var(--text-color);font-weight: var(--regular)}


html{  font-size: clamp(15px, .8335vw, 18px);   stroke-linecap: round;}
body, body p{ color:var(--text-color) ;font-family: var(--body-font); line-height:1.4; font-weight: 400;}
h1,h2,h3,h4,h5,h6{font-family: var(--title-font);color:var(--black) ; font-weight: 700; line-height: 1.2}

h1{font-size: var(--30); margin-bottom: 1.5ch}
h2 {font-size: var(--30); margin-bottom:1.5ch}
h3{font-size: var(--30)}
h4{font-size: var(--25)}
h5{font-size: var(--25)}
h6{font-size: var(--18)}


.privacy-page .text-container h2{margin-top: var(--mlg)}
.privacy-page .text-container h3{margin-top: var(--mmd)}
.privacy-page .text-container h4{margin-top: var(--msm)}

#exit-button{position: fixed; top: 20vh; left: 0; z-index: 9999}
#exit-button a {background: var(--light-border); border-radius: 1rem 0 0 1rem; font-weight: 700; background-color: #fdea41; font-size: var(--25); padding: 2rem .2rem; cursor: pointer; writing-mode: vertical-rl;  text-orientation: mixed;     rotate: -180deg;}

a{transition: background linear 0.2s, color linear 0.2s; color:var(--text-color)}
:is(.button, .submit){position:relative; isolation:isolate;font-family: var(--body-font); font-size:var(--15); background: none; color: var(--text-color);  padding: var(--pad) var(--2pad); padding-left: calc(var(--pad)*4); margin-bottom: 0; font-weight: 600; text-transform: uppercase; transition: all  ease-out .2s; width: max-content; cursor: pointer }
:is(.button, .submit):before{    content: "";  position: absolute;  height: 100%;  width: calc(var(--pad)*3);  top: 0;  left: 0;  background: url(../img/ic-arrow.svg) right center no-repeat;  background-size: calc(var(--pad)*3) 100%;  transition: all ease-out .2s;}
:is(.button, .submit)::after{content: ""; height:100%; width:50%; position: absolute; top:0; left: var(--pad); background: var(--secondary); border-top-left-radius: var(--2pad); border-bottom-left-radius: var(--2pad);  z-index: -1;   transition: all  ease-out .2s;}
:is(.button, .submit):hover,:is(.button, button):focus{ background:none;color:var(--text-color) }

:is(.button, .submit):hover:before{transform: translateX(var(--2pad)); width: var(--2pad)}
:is(.button, .submit):hover{padding-left: calc(var(--pad)*5)}
:is(.button, .submit):hover:after{width: calc(100% - var(--2pad));}

.text-center .button:hover{transform: translateX(calc(var(--pad)/2))}
.text-right  .button:hover {transform: translateX(calc(var(--pad)))}

.button-lit{    font-size: var(--15);  text-transform: none;  padding: 0.4rem var(--pad);  padding-left: calc(var(--pad)*2.5);}
.button-lit:before{ width: calc(var(--pad)*2);}
.button-lit:hover{padding-left: calc(var(--pad)*2.5)}
.button-lit:hover:before{transform: translateX(var(--2pad)); width: var(--pad); opacity: 0}
.button-lit:hover:after{width: calc(100% - var(--pad));filter: brightness(.9) saturate(2)}

.bg-dark:not(.pos-full-right,.pos-full-left) .button::after{background: var(--primary)}
.bg-dark:not(.pos-full-right,.pos-full-left) .button,.bg-dark:not(.pos-full-right,.pos-full-left) .button:hover,.bg-dark:not(.pos-full-right,.pos-full-left) .button:focus{ color:white; font-weight: 600;  z-index: 1; }
.bg-dark:not(.pos-full-right,.pos-full-left) .button:before{filter: invert(1) brightness(2)}


.button-slim{ color: var(--black); font-weight:600; transition: linear .2s; margin-top: var(--pad); display: inline-block }
.button-slim:before{content:""; margin-right: 5px; display: inline-block;font-size: 12px;   background: url(../img/ic-arrow-button.svg) right center no-repeat; width: 1ch; aspect-ratio: 1 }
.button-slim:hover{color:  var(--accent-color);  }
.button-slim:focus{color: var(--black )}

.button-arrow{font-family: var(--body-font); font-size:var(--15); background: none; color: var(--secondary);  padding: 0; margin-bottom: 0; font-weight: 500;  transition: all  ease-out .2s; width: 100%; display: flex; align-items: center;gap: 1ch; translate: 0 1ch }
.button-arrow .button-text{color: var(--primary)}
.button-arrow > span.arrow{border-bottom: .15ch solid var(--primary); display: block;     flex: 1 1 0px; position: relative}
.button-arrow > span.arrow:after{content: "";     position: absolute;  right: -0.1ch;     top: -0.25rem;  line-height: 0;  text-align: right;  font-size: 12px;  color: var(--secondary); background: url(../img/ic-arrow-button.svg) right center no-repeat; width: 1ch; aspect-ratio: 1}

:is(.bg-dark, .bg-accent) .button-arrow > span.arrow:after{    filter:var(--primary-to-secondary);}
:is(.bg-dark, .bg-accent) .button-arrow > span.arrow{border-bottom: .15ch solid var(--secondary);}
:is(.bg-dark, .bg-accent) .button-arrow .button-text{color: var(--secondary)}


.button-small-arrow{ color: var(--black); font-weight: 600; transition: linear .2s; margin-top: var(--pad); display: inline-block;  align-self: end; }
.button-small-arrow:before{content:""; margin-right: 1ch; display: inline-block; background: url(../img/ic-arrow-purple.svg) right center no-repeat; width: 3rem; height:1ch }
.button-small-arrow:hover{color:  var(--accent-color);  }
.button-small-arrow:focus{color: var(--black )}

.button-outlined{ transition:all linear .2s; --color:var(--primary); border-radius: var(--2pad); padding: 1.5ch 2.5ch !important; border: 1px solid var(--color);  color: var(--color) !important;  font-weight: 500;  font-size: var(--15);}
.button-contained{transition:all linear .2s; --color: white; --background-color:var(--primary); border-radius: var(--2pad);padding: 1.5ch 2.5ch !important;  color: var(--color) !important; background: var(--background-color);  font-weight: 500;  font-size: var(--15);}
:is(.bg-dark, .bg-accent)  :is(.button-outlined,.button-contained) {  --color: white; color: var(--color) !Important}
.bg-dark .button-contained:hover{--background-color:white; --color:var(--black)}

.button-outlined:hover{--color: var(--black)}
.button-contained:hover{--background-color: var(--black); --color: white;}

#floating-button{position: fixed; right: 1vw; z-index: 3;bottom: 3vh; padding-left: 3ch; transition: bottom .5s ease; filter: drop-shadow(0 0px 7px rgba(0, 0, 0, 0.4));}
#floating-button a:before{animation:trill 1s  ease-in-out; animation-delay: .4s}
#floating-button a{ display: block; cursor:pointer; position:relative;font-family: var(--body-font); font-size:var(--15); background: var(--primary); color: var(--text-color);  padding: 2ch 2ch 2ch 4ch;  font-weight: 600; transition: background-color  ease-out .2s; width: max-content; border-radius: 3ch; color: white}
#floating-button a:before{content:"";position: absolute; left: -1.6ch; height: 80%; top:.5ch; aspect-ratio: 1; background: var(--secondary) url(../img/ic-chat.svg) center center no-repeat; background-size: 45% ; border-radius: 50%;  }

@keyframes trill {
  0% {
    transform: rotate(0) scale(1) skew(1deg)
  }
  20% {
    transform: rotate(-25deg) scale(1) skew(1deg)
  }
  30% {
    transform: rotate(25deg) scale(1) skew(1deg)
  }
  40% {
    transform: rotate(-25deg) scale(1) skew(1deg)
  }
  50% {
    transform: rotate(25deg) scale(1) skew(1deg)
  }
  60% {
    transform: rotate(0) scale(1) skew(1deg)
  }
  70% {
    transform: rotate(25deg) scale(1) skew(1deg)
  }
  80% {
    transform: rotate(0) scale(1) skew(1deg)
  }

  100% {
    transform: rotate(0) scale(1) skew(1deg)
  }
}

.accent-c{color:var(--primary)}
.black-c{color:var(--black)}
.bg-light{background: var(--light-grey)}
.bg-dark{background: var(--black)}
.bg-accent{background: var(--primary)}
.bg-accent:not(.pos-full-right,.pos-full-left) * , .bg-dark:not(.pos-full-right,.pos-full-left) *{color: white}
:is(.bg-accent, .bg-dark):not(.pos-full-right,.pos-full-left) .button-text{color: var(--secondary)}


.align-space-between{justify-content: space-between}
.menu-gap{gap: var(--pad)}
u { text-decoration-color: var(--secondary);text-decoration-thickness: 0.2ch;  text-underline-offset: 0.5ch;}
:is(h2,h2,h3,h4) u {   text-underline-offset: 0.1ch;}
b, strong{font-weight: var(--bold); letter-spacing: 0}

 .single-post .entry-content ul, .textwidget ul{margin: 0; font-size: var(--17); line-height: 1.2;}
:is(.text, .single-column)  ul{margin-left: 0}
:is(.text, .single-column) ul:not(.menu) li{list-style: none; padding-left: 30px; position: relative; margin-bottom: var(--pad)}
:is(.text, .single-column) ul:not(.menu) li:before{content: ""; position: absolute; left:0; width: 20px; height: 7px; background: url(../img/list-bullet.svg) center center no-repeat; background-size: contain; top: 1ch}



.widescreen img{aspect-ratio: 1.666; object-fit: contain; object-position: left}

.text ol, .single-post .entry-content ol, .textwidget ol{margin: 0; line-height: 1.2; counter-reset: list_number;}
.text ol li, .textwidget ol li, .single-post .entry-content ol li{list-style: none; margin-bottom: var(--pad); position: relative; padding-left: 1.5rem; }
.textwidget ol li:before, .text ol li:before, .single-post .entry-content ol li:before{counter-increment: list_number; content: "0" counter(list_number) "."; color: var(--accent-color); font-size: 1rem;      position: absolute;
  left: 0;top: 2px; }


.text .number-list{margin: 0; padding-left:0}
.text .number-list li{list-style: none; margin-bottom: 2ch; padding: 0; font-size: var(--25); }
.text .number-list li:before{display: none}
.text .number-list li .number{position: relative;  margin-right: .5ch; text-align: center; min-width: 2ch; display: block; float: left; font-weight: 700 }
.text .number-list li .number:before{content: ""; background: var(--secondary-light); border-radius: var(--2pad) 0  0 var(--2pad); width: 100%; translate:-.5ch 0;left: 0; position: absolute; width: 5ch; height: 100%; z-index: -1; outline: 6px solid var(--secondary-light)}

/* wpcf7 */
[type="text"], [type="email"], select,[type="tel"], textarea{margin-bottom: 1.3rem; border: 1px solid var(--text-color); border-radius: var(--2pad); padding: var(--pad) var(--2pad); height: auto;color: var(--text-color) !important; box-shadow: none; }
.wpcf7-spinner{display: none}
[type=color]:focus, [type=date]:focus, [type=datetime-local]:focus, [type=datetime]:focus, [type=email]:focus, [type=month]:focus, [type=number]:focus, [type=password]:focus, [type=search]:focus, [type=tel]:focus, [type=text]:focus, [type=time]:focus, [type=url]:focus, [type=week]:focus, textarea:focus {
  outline: none;
  border: 0;
  box-shadow: none;
}
[type=checkbox], [type=file], [type=radio]{margin-bottom: 0}
.wpcf7-not-valid-tip{display: none}
.wpcf7-not-valid{border:2px solid var(--error);}
.wpcf7 form .wpcf7-response-output {    margin: 10px 0 0;    padding: 0 var(--2pad);    border: none;    color: var(--success);        font-size: 1rem;}
form [type="submit"]{position:relative;width: 100%; padding:1.2rem; font-weight: var(--bold); font-size: clamp(18px, 1.2vw, 22px);margin-top: 20px; border: none; cursor: pointer }

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output{color: var(--error); padding: 0 var(--2pad)}
.wpcf7-list-item{margin: 0; padding-right: var(--pad)}

.wpcf7-acceptance{padding-left: var(--2pad);}

form input[type="checkbox"] {  -webkit-appearance: none; border-radius: 50%; margin-bottom: 0;  border: 2px solid  var(--text-color) !Important;   top: 1px;  outline: 0;   width: 14px;    height: 14px;    display: inline-block;  float: left; position: relative;}
form input[type=checkbox]:focus, .wpcf7-form input[type=radio]:focus{box-shadow: 0}
input[type=checkbox]:after{    content: '';   width: 6px;  height: 6px;  left: 2px;   position: absolute;   top: 2px;   background: none;  border-radius: 50%;}
input[type=checkbox]:checked:after {    background: var(--text-color) ;   }

form .radio-title{ color: var(--black); display: block; margin-bottom: .4rem; font-weight: var(--bold)}
form .wpcf7-acceptance label{line-height: 1.4}
form input[type="radio"] {  -webkit-appearance: none; border-radius: 50%; margin-bottom: 0;  border: 1px solid  var(--black) !Important;   top: 5px;  outline: 0;   width: 13px;    height: 13px;    display: inline-block;  float: left; position: relative;}
input[type="radio"]:after{    content: '';   width: 7px;  height: 7px;  left: 2px;   position: absolute;   top: 2px;   background: none;  border-radius: 50%;}
input[type="radio"]:checked:after {    background: var(--black);   }




form .send-container{gap: var(--2pad)}

.search-form{    background: white;  border-top-left-radius: var(--2pad);  border-bottom-left-radius: var(--2pad);  margin-bottom: var(--2pad);}
.search-form input{border: none;  outline: none;  box-shadow: none;  border-top-left-radius: var(--2pad);  border-bottom-left-radius: var(--2pad);  margin-bottom: 0;  padding: var(--pad);  padding-left: var(--2pad);  color: var(--text-color);  height: auto;}

.bg-accent form input[type="checkbox"], .bg-dark form input[type="checkbox"]{ border:1px solid  white !Important; }
.bg-accent input[type=checkbox]:checked:after, .bg-dark input[type=checkbox]:checked:after{    background: white ;  width: 8px; height: 8px }

.bg-dark button.submit{background: var(--primary); color: white}
.bg-dark form button.submit:before{ filter: hue-rotate(-74deg) saturate(54) brightness(.9)}



.screen-reader-text{display: none}
.font-sm{font-size: var(--15)}
.font-md{font-size: var(--20)}
.font-bg{font-size:var(--25)}
.font-vb{font-size:var(--28)}

.margin-small{margin-bottom: var(--mmd)}
.margin-medium{margin-bottom: var(--mlg) !important;}
.margin-large{margin-bottom: calc(var(--mlg) * 2)}


.grid-container{  max-width: var(--max-width);     padding-inline: 2.5rem;}
.grid-container .grid-container{padding-inline:0}

/* IUBENDA */
.iubenda-cs-container label{color: white}
 #iubenda-iframe #iubFooterBtnContainer button{background: var(--primary)}

/* RESET ACCORDION */
.accordion{--main-color: var(--alternate); --hovercolor: var(--black)}

.accordion,.accordion-title, .accordion-content{ background: none; border: none; padding: 0; color: var(--text-color); font-size: var(--17); }
.accordion-title:is(:focus, :active, :hover){color: var(--text-color)}

.accordion-title:focus, .accordion-title:hover{background: none}
:last-child>.accordion-content:last-child,:last-child:not(.is-active)>.accordion-title{border-bottom: none}
ul.accordion{margin-bottom: 0}

.accordion-title{ font-weight: 700; padding-top: var(--2pad); padding-bottom: var(--2pad); padding-right: 70px; border-top:.2ch solid var(--light-border);     line-height: 1.4;}

.accordion-title:before{content:""; position:absolute; top: 6px; right: 0; height: 100%; width: 2rem; background: url(../img/ic-arrow-small.svg) center center no-repeat; background-size:.8rem;font-size: 0; transition: all ease-in-out .2s; filter:brightness(.6)}
.accordion-item.is-active .accordion-title:before{background-image: url(../img/ic-arrow-small-up.svg) }

.accordion-content p, .accordion-content{font-size: var(--15); line-height:1.6}
.accordion-content{padding-bottom: var(--2pad)}

.button-dark .accordion{--main-color: var(--primary); --hovercolor: var(--black)}



.logo{font-size: 0 !important; width: clamp(80px, 10vw,140px); aspect-ratio:2.2 / 1; background: url(../img/stp-logo.svg) left  center no-repeat; background-size: contain; display: block; transition: all  .2s linear}

.menu .active > a{background: none}


.menu-icon{margin-right: 1rem}
.menu-icon:after{  background: var(--black);  box-shadow: 0 7px 0 var(--black), 0 14px 0 var(--black); }

header.header{position: fixed; width: 100%; top: 0;  background: white;  z-index:3;padding-top: var(--2pad); padding-bottom: var(--pad);transition: all .2s linear}
@media screen and (min-width: 64em){
header.header.fixed{box-shadow: 0 0 10px rgba(180,255,230,.4); padding-top: var(--pad)}
header.header.fixed .logo{height: 50px; transition: all .2s linear !important;}
header.header.fixed .main-header ul li a{font-size: unset; transition: all .2s linear}

}
.main-header{padding-right: var(--2pad); justify-content: space-between}
.main-header ul li a{color: var(--text-color); font-weight: 600; font-size: var(--17);  transition:color linear .2s; }
.dropdown.menu>li>a{padding: .7rem 1.5ch}
.main-header ul li a:hover,.main-header .dropdown.menu>li.is-active>a{color: var(--text-color)}
.main-header ul li.highlight a{color: var(--black)}
.main-header #main-nav .active>a, #main-nav .is-active>a{color: var(--text-color);text-decoration-color: var(--secondary) !important; text-decoration: underline; text-underline-offset: .5ch;     text-decoration-thickness: 0.3ch;}
.dropdown.menu.medium-horizontal>li.is-dropdown-submenu-parent>a:after{display: none}
.dropdown.menu.medium-horizontal>li.is-dropdown-submenu-parent>a{padding-right: 1rem}
.main-header button:not(.menu-icon){ min-width: calc((var(--container-width) / 12 * 3) +  var(--pad) * 2); background: var(--black); font-weight: var(--bold);color: white; margin: 0; padding: .9rem 1rem;font-size: clamp(18px, 1.2vw, 22px);  line-height: 1.3;}
.submenu.is-dropdown-submenu{border: none;    background: white;    border-bottom-right-radius: var(--2pad);   padding: var(--pad) 0; box-shadow: 0px 3px 3px rgb(0 0 0 / 10%);}
.main-header .submenu.is-dropdown-submenu li a{font-weight: var(--regular); color:var(--black)}
.main-header .submenu.is-dropdown-submenu li a:hover, .main-header .submenu.is-dropdown-submenu li.current-menu-item a{color: var(--accent-color)}
.main-header .submenu.is-dropdown-submenu li a:before{content:"›";  font-family: 'Arial', sans-serif; display: inline-block; color: var(--accent-color); font-weight: var(--bold); margin-right: .5rem;}
#main-nav{margin-right: var(--pad)}

.main-header .search-button{border-radius: 50%; background: var(--black); aspect-ratio: 1; display: grid; align-content: center;    position: absolute;  top: 4px;  right: 0;  transform: translateX(45%); transition: linear .2s;}
.main-header  .search-button:hover{background: var(--black)}
.main-header .search-button .ic-search:before{margin: 0; transform: none; height: 15px}
.main-header .search-button .ic-search{height: 20px;  display: block; padding: .2rem .7rem}
.main-header .menu-icon{margin:0;}

.main-header .action-menu li a{--button-color: var(--primary);border-radius: var(--2pad); border:.15rem solid var(--button-color); color:white; background: var(--button-color); font-weight: 500; font-size: var(--17); padding-inline: 2rem}
.main-header .action-menu {gap: var(--pad); }
.main-header .action-menu li.contained-dark a{--button-color:var(--black)}
.main-header .action-menu li a:hover{background:none; color: var(--button-color); font-weight: 600;}



.menu-social-footer li a{font-size: 0; width: 16px; aspect-ratio: 1; background: center center no-repeat; background-size: 100%; display: block; padding: 0; margin: .7rem 1rem .7rem 0}
.menu-social-footer li.facebook a{ background-image:url(../img/social/facebook.svg);}
.menu-social-footer li.instagram a{ background-image:url(../img/social/instagram.svg);}
.menu-social-footer li.linkedin a{ background-image:url(../img/social/linkedin.svg);}
.menu-social-footer li.whatsapp a{ background-image:url(../img/social/whatsapp.svg);}
.menu-social-footer li.youtube a{ background-image:url(../img/social/youtube.svg);}
.menu-social-footer li.twitter a{ background-image:url(../img/social/twitter.svg);}
.menu-social-footer li.email a{ background-image:url(../img/social/email.svg);}
.menu-icon:hover:after, .menu-icon:after  {  background: var(--black);  box-shadow: 0 7px 0 var(--black), 0 14px 0 var(--black);}

.menu-social-footer.icons-primary li {filter:var(--secondary-to-primary) ;}

main{margin-top: var(--headerheight)}
/* OFFCANVAS */
.off-canvas.position-right{width: 330px;  }
.off-canvas-content .off-canvas.position-right, .position-right{transform: translateX(330px)}
.off-canvas.is-transition-overlap{ z-index: 999}
.off-canvas{ background: var(--black); color: white; padding: calc(var(--pad) * 3); border-top-left-radius: var(--2pad);}
.off-canvas .menu > li > a{ color: white; padding: var(--pad) 0; font-size: var(--18)}
.off-canvas .menu > li > a:before{content: "";  position: relative;  width: 10px;  aspect-ratio: 1;  background: url(../img/ic-arrow-list.svg) left center no-repeat;  background-size: contain;  display: inline-block;  margin-right: .5ch;      filter:var(--primary-to-secondary)}
.off-canvas .menu:not(.menu-social-footer){margin-bottom: var(--2pad); gap:.5rem}
.off-canvas-title{ font-size: .8rem; color: var(--secondary); text-transform: lowercase; margin-bottom: 1rem}
.off-canvas .menu-social-footer li a{width: 22px;margin: .7rem 1.5rem .7rem 0}
.off-canvas .menu a[href="#"]{display: none}
.off-canvas .sub-menu{padding-left: 0; margin: 0; list-style: none}
.off-canvas .sub-menu li a{color: white; padding: var(--pad) 0}
.off-canvas .contacts{font-size: var(--15); display: grid; gap: var(--pad)}
.off-canvas .contacts a{color: var(--secondary)}

#breadcrumbs{ font-size: var(--15);}
#breadcrumbs a{color: var(--black)}
#breadcrumbs a:hover{ color: var(--primary)}
#breadcrumbs > span { }
.breadcrumb_last{ font-weight:600}

/* icons */
[class^="ic-"]{font-size: 0 !important;}
[class^="ic-"]:before{content: ""; position: relative; width: 18px; height: 18px; background-position: center center; background-repeat:  no-repeat; background-size: contain; display: inline-block; margin-right: 6px;transform: translateY(20%) }
.ic-search:before{background-image: url(../img/ic-search.svg);}
.ic-news:before{background-image: url(../img/ic-news.svg);}
.ic-resource:before, .ic-folder:before{background-image: url(../img/ic-folder.svg);}
.ic-events:before, .ic-calendar:before{background-image: url(../img/ic-calendar.svg);}
.ic-articles:before{background-image: url(../img/ic-article.svg);}
.ic-share:before{background-image: url(../img/ic-search.svg);}
.ic-video:before{background-image: url(../img/ic-video.svg)}
.ic-file:before{background-image: url(../img/ic-download.svg)}
.ic-link:before{background-image: url(../img/ic-link.svg)}
.ic-phone:before{background-image: url(../img/ic-phone.svg)}


/* FOOTER */
footer.footer{margin-top: 0;}
footer.footer.bg-dark{color: white; font-size: .9rem; padding: var(--mmd) 0 var(--2pad); }
footer.footer p{font-size: .9rem; }
footer.footer .logo-container{ max-width: 200px; margin-bottom: 1rem}
footer.footer .logo{background-image: url(../img/stp-logo-white.svg); background-position: left center}
footer.footer .menu > li > a {color: white; padding-left: 0; font-weight: 500}
footer.footer .list-style > li a:before{content: "";  position: relative;  width: 10px;  aspect-ratio: 1;  background: url(../img/ic-arrow-list.svg) left center no-repeat;  background-size: contain;  display: inline-block;  margin-right: .5ch;      filter:var(--primary-to-secondary)}
footer.footer .footer-top{margin-bottom: 2rem}
footer.footer .menu a[href="#"]{display: none}
footer.footer .sub-menu{padding-left: 0; margin: 0; list-style: none}
footer.footer .sub-menu li a{color: white; padding:.7rem 1rem .7rem 0}

footer.footer .menu-social-footer{}
footer.footer .copyright{  font-size: .8rem; margin-top: var(--msm); font-weight: 300}
footer.footer .footer-below, footer.footer .footer-below  p{    font-size: .8rem; font-weight: 300}
footer.footer .footer-below a{color: var(--secondary)}
.footer.footer .menu-social-footer{margin-top: var(--pad)}
.footer.footer .follow-title{margin-top: var(--2pad); font-size: var(--13); color: var(--secondary)}

footer.footer .developed p{margin: 0}

footer.footer .cell:nth-child(4){position: relative}
footer.footer .cell:nth-child(4):before{content:""; height: 100%; width: 1px; background:  var(--primary); position: absolute; left: -2rem}

footer.footer .style-2ps .list-style > li a:before{filter:none}
footer.footer .style-2ps p a{color: var(--primary); font-weight: 500}

section.newsletter .bg-white{background: white;  border-top-left-radius: var(--2pad) ;border-bottom-left-radius: var(--2pad); margin-bottom: var(--pad)}
section.newsletter [type="email"]{border:none; outline: none; box-shadow: none; border-top-left-radius: var(--2pad) ;border-bottom-left-radius: var(--2pad) ; margin-bottom: 0; padding: var(--pad); padding-left: var(--2pad); color: var(--text-color); height: auto }
section.newsletter .submit{position: relative; font-weight: 700; font-size:var(--15);color:white; margin: 0; padding: var(--pad) var(--2pad) var(--pad) calc(var(--pad)*3);  line-height: 100%; height: 100%; text-transform: uppercase; border-top-left-radius: var(--2pad) ;border-bottom-left-radius: var(--2pad) ; background: var(--accent-light); cursor: pointer; transition: padding  ease-in .2s, filter linear .2s; background: var(--black) }
section.newsletter .submit:hover:before{transform: translateX(var(--2pad)); width: var(--2pad)}
section.newsletter .submit:hover{padding-right: var(--pad); padding-left:  calc(var(--pad)*4);}
section.newsletter .submit:before{content:"";position: absolute; height: 100%; width: calc(var(--pad)*3); top:0; left: calc(var(--pad)*-1); background: url(../img/ic-arrow.svg) right center no-repeat; filter:hue-rotate(-74deg) saturate(54) brightness(.9); background-size: calc(var(--pad)*3) 100%;  transition: all ease-in .2s}

section.newsletter  .wpcf7 form.invalid .wpcf7-response-output,
section.newsletter .wpcf7 form.unaccepted .wpcf7-response-output,
section.newsletter .wpcf7 form.payment-required .wpcf7-response-output,
section.newsletter .wpcf7 form.sent .wpcf7-response-output{padding:0 var(--pad) var(--pad);}
section.newsletter .wpcf7 form.invalid .bg-grey, footer.footer .newsletter .wpcf7 form.sent .bg-grey{padding-bottom: 0}

/* SEARCH MODAL */
.search-modal{position: fixed;  inset: 0;  z-index: 5;  background: var(--primary); display: none}
.search-modal .search-container{    max-width:40em;  margin-inline: auto;  height: 100%;  display: grid;  align-content: center;}
.search-modal :is(form,.input-group, input[type='text']){background: transparent}
.search-modal .search-container form .input-group-field {color: white !important;}

.search-modal ::-webkit-input-placeholder {  color: white; }
.search-modal ::-moz-placeholder {   color: white;}
.search-modal :-ms-input-placeholder {   color: white;}
.search-modal :-moz-placeholder {   color: white;}

.search-modal .search-close{ width: var(--50);  aspect-ratio: 1;  background: var(--black) url(../img/ic-close.svg) center center no-repeat;  background-size: var(--18);
  border-radius: 50%;  position: absolute;  right: var(--mmd);  top:  var(--mmd);  translate: 25% -25%; cursor: pointer}

/* section base */
main > article > section:first-of-type{margin-top: var(--mmd)}
article.breadcrumb-bg section:first-of-type{ margin-top: 0}

.page-with-anchor{padding-top: var(--mmd)}

section .grid-container{position: relative}
section .section-header{margin-bottom: var(--mmd);  }
section .section-header.title-small{    margin-bottom: var(--2pad);}
section .section-header .title{font-size: var(--30);font-weight: var(--bold);}
section .section-header:has(.subtitle) .title{  margin-bottom: var(--pad);}
.section-subtitle{font-size: var(--18)}

@media screen and (min-width: 64em){
  section .section-header .has-subtitle.text-left{display: grid;  grid-template-columns: 2fr 5fr;  gap: var(--2pad);}
  section .section-header .has-subtitle.text-right{display: grid;  grid-template-columns: 5fr 2fr;  gap: var(--2pad);  direction: rtl;}
}

:is(h1,h2,h3,h4) .font-vb{font-size:var(--60); line-height: 1.2 }
.section-title.font-small, :is(h1,h2,h3,h4) .font-sm{font-size:var(--20); }
.section-title.font-medium, :is(h1,h2,h3,h4) .font-md{font-size:var(--30);  line-height: 1.2}
.section-title.font-big, :is(h1,h2,h3,h4) .font-bg{font-size:var(--50); line-height: 1.2}

.section-title{margin-bottom:0}
.section-title + .section-subtitle{margin-top: 1.5ch}

section.bg-accent, section.bg-dark, section.bg-light{padding-top: var(--mmd); padding-bottom: var(--mmd) }
:is(.bg-dark,.bg-acccent,.bg-light).large-pad{padding-block: var(--mlg)}
:is(.bg-dark,.bg-acccent,.bg-light).small-pad{padding-block: var(--msm)}

section .text-container{isolation: isolate}
section .text-container{isolation: isolate}

section .text-container p:not(:last-of-type){margin-bottom:2.5ch}

/*.title-with-dot{padding-left:2rem}*/
/*.section-title.style-with-dot:before{content:""; width: 1rem; height:1rem; aspect-ratio: 1; background:var(--secondary); display: block; position: absolute; border-radius: 50%;     left: 1rem;*/
/*  border-radius: 50%;  top: 0.9ch;}*/




/* BASIC PAGE HEADER */
.single-page-header{ font-size: var(--40); padding-top: var(--2pad);     padding-bottom: .5ch;}
.single-page-header .main-title{position: relative; padding-left:2ch; display: inline-block;     translate: calc(var(--pad) * -1) 0; margin-bottom: 0}
.single-page-header .main-title:after{    content: "";  height: calc(100% + 1ch);  width: 55%;  position: absolute;  top: -.5ch;    background: var(--light-grey);  border-top-left-radius: 2ch;  border-bottom-left-radius: 2ch;  z-index: -1; left: 0 }

article.breadcrumb-bg .single-page-header .main-title:after{background: white}


.blog .page-hedaer > div:first-child , .archive.category .page-hedaer > div:first-child{background: var(--black)}
.blog .page-hedaer .headline , .archive.category .page-hedaer .headline{color: white}
.archive.category .page-hedaer .archive-title h1{color: white; padding-left: var(--2pad); text-transform: capitalize; font-size: var(--28); margin: 10px 0}
.archive.category  .archive-description p{font-weight: var(--bold); font-size: var(--18)}


.search-no-results .content-home_header h2{margin-bottom: var(--2pad)}
.search-no-results .content-home_header .text{font-size: var(--17); color: var(--black); margin-bottom: var(--2pad)}
.search-results .result-parameter{font-size:1rem; text-transform: capitalize}
.search-results .result-parameter ul li{margin-right: var(--pad); color: var(--black)}
.search-results .page-hedaer .title-container > :last-child{ padding-left: var(--2pad)}
.search-results .page-hedaer .title-container {color: var(--black)}
.post-not-found{margin-bottom: var(--mlg)}

/* SHARE */

.share-menu li > a{font-size: var(--15); color: var(--black); font-weight: var(--bold); transition: linear .2s}
.share-menu li > a:hover{color: var(--accent-color)}
.share-menu li:last-child > a{padding-right: 0}
.share-menu .addtoany_shortcode{display: none}
.share-menu .addtoany_shortcode .addtoany_list{display: grid; grid-auto-flow: column}
.share-menu .addtoany_shortcode .addtoany_list a{padding: 0 .4rem}
.addtoany_list a:not(.addtoany_special_service)>span{line-height: 20px}
.addtoany_list a, .widget .addtoany_list a{font-size: 0}


/* POST LIST */
.content-post_list{--linkcolor: var(--primary)}
.content-post_list.multiple-post-type .bst-grid-layout-container:not(.is-active){display: none}
.content-post_list.multiple-post-type .section-header{margin-bottom: var(--mmd)}
.tab-links a{font-size: var(--25); font-weight: 600; padding: var(--pad) 0; color: var(--text-color); text-transform: capitalize}
.tab-links a:before{content: ""; position: relative; width: 12px;aspect-ratio: 1; top:-.2ch;background: url(../img/ic-arrow-list.svg) left center no-repeat; background-size: contain; display: inline-block; margin-right: var(--pad); filter: hue-rotate(-32deg) brightness(.3); transition: filter linear .2s}
.tab-links .is-active, .tab-links a:hover{color: var(--linkcolor)}
.tab-links .is-active:before,.tab-links a:hover:before{filter: initial}

:is(.bg-dark,.bg-accent).content-post_list{--text-color: white; --linkcolor: var(--secondary)}
:is(.bg-dark,.bg-accent) .tab-links .is-active,.bg-dark.content-post_list .tab-links a:hover{color: var(--linkcolor)}
:is(.bg-dark,.bg-accent) .tab-links a:before{filter: saturate(0) brightness(7)}
:is(.bg-dark,.bg-accent)  .tab-links a:is(.is-active,:hover ):before{filter:hue-rotate(-73deg) saturate(1.39) brightness(1.85)}
:is(.bg-dark,.bg-accent).content-post_list article .date-time{color: var(--text-color); font-weight: 400}
:is(.bg-dark,.bg-accent).content-post_list .tags-list a{color: var(--secondary)}

/* content simple text */
.content-simple_text :is(p, ul){ font-size: var(--17); line-height: 1.6}
.content-simple_text .menu-social-footer li a{    width: var(--40); margin: .7rem var(--2pad) }
.content-simple_text form :is(input,textarea):focus{border: 1px solid var(--text-color)}

.content-simple_text .section-side-title .section-header{padding-left: var(--pad)}
.content-simple_text .section-side-title .text-container{gap:var(--2pad)}
.content-simple_text .section-side-title .text-container > .cell{    padding-inline: 0 !important;  margin-inline:1.2rem;}

.text-container a:not([class]){color:var(--text-color); font-weight: 500; text-decoration:underline; text-decoration-color: var(--secondary); text-underline-offset: .5ch; text-decoration-thickness: .2ch}
a:hover,a:focus{color: var(--primary)}



/* content-text_images */
.content-text_images .single-gallery img{aspect-ratio: 1; object-fit: contain; width: 100%}
.content-text_images .media-container img{width: 100%}

.content-text_images .section-subtitle{margin-bottom: 1.5ch}

.text-container h2{margin-bottom: var(--2pad)}
.text-container :is(h3,  h4,  h5,h6){margin-bottom: 2ch}

.text-container .button, .section-header .button{margin-top: var(--2pad)}
.text-container img{width: 100%;}
.text-container.square-ratio img{width: 100%;  aspect-ratio: 1;  object-fit: contain;}



.content-text_images:is(.pos-full-left,.pos-full-right){background: none}
.content-text_images:is(.pos-full-left,.pos-full-right) .media-container{position: relative}

.content-text_images:is(.pos-full-left,.pos-full-right) .media-container:after{content:""; position:absolute; top:0; left: 0;  height: 80%; aspect-ratio: 1; z-index: -1;translate: -5rem 15%; }

.content-text_images:is(.pos-full-right) .media-container:after{border-radius: 0 50% 50% 0;}
.content-text_images:is(.pos-full-left) .media-container:after{border-radius: 50% 0 0 50%;}

/*
.content-text_images:is(.pos-full-left,.pos-full-right) .media-container:before{content:""; position:absolute; top:0;  width: calc(100% + (100vw - (var(--max-width)/2))); height: 80%; z-index: -1; }
.content-text_images.bg-dark:is(.pos-full-left,.pos-full-right) .media-container:before,
.content-text_images.bg-dark:is(.pos-full-left,.pos-full-right) .media-container:after{color: var(--text-color); background: var(--text-color)}
.content-text_images.bg-light:is(.pos-full-left,.pos-full-right) .media-container:before,
.content-text_images.bg-light:is(.pos-full-left,.pos-full-right) .media-container:after{color: var(--light-grey); background: var(--light-grey)}
.content-text_images.bg-accent:is(.pos-full-left,.pos-full-right) .media-container:before,
.content-text_images.bg-accent:is(.pos-full-left,.pos-full-right) .media-container:after{color: var(--primary); background: var(--primary)}
.content-text_images:is(.pos-full-right) .media-container:before{right: calc(((min(var(--max-width),100vw) - (var(--pad) * 8)) / 12) * 3);translate: -7rem 15%;}
.content-text_images:is(.pos-full-left) .media-container:before{ left: calc(((min(var(--max-width),100vw) - (var(--pad) * 8)) / 12) * 3);translate: -6rem 15%; }*/

/* IMAGE GRID */
.image-grid-container{gap: calc(var(--pad) * 3); margin-inline:  var(--pad); display: grid}
.image-grid-container.image-row-2{grid-template-columns: repeat(2,1fr)}
.image-grid-container.image-row-3{grid-template-columns: repeat(3,1fr)}
.image-grid-container.image-row-4{grid-template-columns: repeat(auto-fit,minmax(280px,1fr))}
.image-grid-container.image-row-5{grid-template-columns: repeat(auto-fit,minmax(230px,1fr))}
.image-grid-container.image-row-6{grid-template-columns: repeat(auto-fit,minmax(190px,1fr))}

.content-image_grid .square-ratio .single-image-grid figure{aspect-ratio: 1; display: flex; align-items: center; justify-content: center; margin-bottom: var(--pad);  width: 100%}
.content-image_grid  .square-ratio .single-image-grid  img{width: 100%; aspect-ratio: 1; object-fit: cover}
.content-image_grid .widescreen-ratio .single-image-grid figure{aspect-ratio: 1.6; display: flex; align-items: center; justify-content: center; margin-bottom: var(--pad); width: 100%}
.content-image_grid  .widescreen-ratio .single-image-grid  img{width: 100%; aspect-ratio: 1.6; object-fit: cover}
.content-image_grid.before-marker  .single-image-grid{position: relative; counter-increment: image_count }
.content-image_grid.before-marker  .single-image-grid:before{content: counter(image_count); display:block; width:4ch; aspect-ratio: 0.8; background: url(../img/ic-marker.svg) center center no-repeat;  position: relative;   margin: 0 auto; text-align: center; color: white; font-weight: 700; padding-top: .5ch; font-size: var(--15); z-index: 2; transition: .2s linear }

.content-image_grid .single-image-grid{position: relative}

.image-grid-container .single-image-grid .image-content .image-title{font-weight: 700;margin-bottom: 6px;}
.image-grid-container .single-image-grid .image-content .image-description{font-size: var(--15); }
.image-grid-container .single-image-title{font-size: var(--30); font-weight: 700}
.content-blocks_grid.arrow-button .text a{    color: var(--black);  font-weight: 600;  transition: linear .2s;  margin-top: var(--pad);  display: inline-block;
  align-self: end; width: 100%; text-align: right}
.content-blocks_grid.arrow-button .text a:before{    content: "";  margin-right: 1ch;  display: inline-block;  background: url(../img/ic-arrow-purple.svg) right center no-repeat;
  width: 3rem;  height: 1ch;}

.content-image_grid  .image-grid-container.logos figure img{object-fit: contain}

@media screen and (max-width: 32em){

  /* image grid */
  .content-image_grid .single-image-grid :is(figure){aspect-ratio: revert; align-items: start}
  .content-image_grid .single-image-grid{display: grid; grid-template-columns:30px 2fr 1fr; gap:var(--2pad)}
  .content-image_grid .single-image-grid .image-content{color: var(--text-color); padding: 0; background: revert; translate:0; position: revert; text-align: left; opacity: 1}


  .content-image_grid.before-marker  .single-image-grid figure{order:2}

}

@media screen and (min-width: 32.4375em){
  /* before marker  */
  .content-image_grid.before-marker{counter-reset: image_count}

  /* layout style logos */
  .content-image_grid  .image-grid-container.logos figure{position: absolute; aspect-ratio: 1; transition: .3s ease-out}
  .image-grid-container.logos .single-image-grid:hover figure{scale: 0.4;  top: -1.3ch; aspect-ratio: 1.6;
    opacity: 0;}
  .image-grid-container.logos .single-image-grid:hover:before{translate:0 -2.5ch}
  .image-grid-container.logos .single-image-grid .image-content{aspect-ratio: .9; translate:0 10rem; transition: translate .5s ease, opacity .3s linear;    position: relative;  margin-top: -3rem; text-align: center; opacity: 0}
  .image-grid-container.logos .single-image-grid:hover .image-content{ translate:0 4rem; opacity: 1}

}
/* layout style team */
.image-grid-container.team .single-image-grid{display: grid;  grid-template-columns: 2fr 3fr;  gap: var(--pad); position: relative}
.image-grid-container.team figure{  aspect-ratio: 1.1;  border-radius: 48% 0 0 48%;  overflow: hidden; margin-bottom: 0 !important;}
.image-grid-container.team .single-image-grid .image-content{padding-block: var(--pad)}
.image-grid-container.team .single-image-grid .image-content .image-title{font-size: var(--18); line-height: 1.2}
.image-grid-container.team .single-image-grid .image-content .image-description{font-size: var(--13); color: var(--primary)}


@media screen and (min-width: 40em){
  .image-grid-container.team .single-image-grid{padding-bottom: var(--2pad);     align-self: baseline;}
.image-grid-container.team .single-image-grid .bio{    position: absolute; margin-top: -10px; width: calc(100% + (var(--pad)*4));  z-index: 12;  top:100%;
  background: var(--primary);  color: white;  padding: var(--pad) 0; left:calc(var(--2pad) * -1);border-radius: 0 0 var(--30) var(--30); border: var(--2pad) solid var(--primary); border-top: 0;  opacity: 0; scale: 1 0; transform-origin:top; transition: scale .2s linear; transition-delay: .15s;  transition-property:scale;}
.image-grid-container.team .single-image-grid:before{content:""; inset: 0; background: var(--primary); position: absolute; outline: var(--2pad) solid var(--primary); height: 0;  opacity: 0; transition: opacity 0s linear, height .2s linear;
  z-index: -1; }
  .image-grid-container.team .single-image-grid .bio p{color: white; font-size: var(--15)}
  .image-grid-container.team .single-image-grid .bio a{color: var(--secondary-light)}
  /* .image-grid-container.team .single-image-grid:hover{color: white ; }
 .image-grid-container.team .single-image-grid:hover:before{height: 100%; opacity: 1}
 .image-grid-container.team .single-image-grid:hover .image-description{color: white}
 .image-grid-container.team .single-image-grid:hover .bio{opacity: 1; scale: 1 1}*/
}

.fixed-image-ratio .single-image-grid img{aspect-ratio: 1.8; object-fit: contain}

/* HERO */
.content-hero{padding-top:3rem}
.content-hero .links-container .menu{gap:var(--pad); margin-top:3rem}
.content-hero .single-cta .title{font-size: var(--25); font-weight: 700; }
.content-hero .single-cta .title + .text{margin-top: 1rem}
.content-hero .single-cta{display: flex; flex-direction: column}
.content-hero .single-cta .text{flex:1 1 0; height: auto; font-size: var(--17)}
.content-hero .single-cta .button-small-arrow{align-self: start}
.content-hero .image{margin-bottom: 1rem}
.content-hero .cta-buttons{gap:2rem; }
@media screen and (min-width: 40em){

  .content-hero .cta-buttons{padding:2rem; background: var(--light-grey); border-radius: 2rem}
}

@media screen and (max-width: 29em){
  .content-hero .single-cta{width: 100%;flex: 0 0 auto;}
  }

/* BLOCKS GRID */
.content-blocks_grid .single-image-grid img{width: 100%;margin-bottom: var(--pad); }
.content-blocks_grid .single-image-grid .counter{font-size: var(--25); font-weight: 700; margin-bottom: var(--2pad); position: relative; padding-left: 1ch}
.content-blocks_grid .single-image-grid .counter:before{content: "";background: var(--secondary);border-radius: var(--2pad) 0 0 var(--2pad);
width: 100%;translate: -0.5ch 0;left: 0;position: absolute;width: 2ch;height: 100%;z-index: -1;outline: 2px solid var(--secondary);}

.content-blocks_grid.partners img{ max-height:3.4rem; }

/* CTA BLOCK */

.cta-container{display: grid; gap:var(--2pad)}
.cta-container.image-row-2{grid-template-columns: repeat(2,1fr)}
.cta-container.image-row-3{grid-template-columns: repeat(3,1fr)}
.cta-container.image-row-4{grid-template-columns: repeat(4,1fr)}
.cta-container.image-row-5{grid-template-columns: repeat(5,1fr)}
.content-cta_block .section-subtitle + p, .content-cta_block .section-title + p{margin-top: var(--2pad)}

.cta-container .single-cta{position:relative;height:100%;display:flex; flex-flow: column wrap; justify-content:space-between; background-color:var(--light-grey); border-radius: 2rem; padding:2rem}
.single-cta .cta-icon{    position: absolute;  top: -2rem;  width: 5rem;  height: 5rem;}
.single-cta .cta-icon +.text{margin-top: 3rem}

.content-cta_block .single-cta :is(h2,h3,h4,h5,h6){margin-bottom: 1ch}

/* CTA banner */
.content-cta_banner .cta-banner-content{border-radius: 2rem; padding:2rem; gap:var(--2pad); align-items: center}
.content-cta_banner .icon{width: max(6rem, 6%); }
.content-cta_banner .title > *{margin: 0; font-size: 1.8rem; font-weight: 600}
  /* ACTION BANNER */
.content-action-banner h2{font-size: var(--40); margin-bottom: var(--pad)}
.content-action-banner .subtitle{margin-bottom: var(--2pad); font-size: var(--17)}


/* FAQ */
.content-faq .section-side-header{display: flex; flex-direction: column; height: 100%; }
.content-faq .section-side-header .section-subtitle + .button-container{    margin-top:var(--2pad)}
.content-faq .section-side-header  .button-container{margin-bottom: 2rem}


/* ADVANCED SEARCH */
.form-container{ gap: 2ch}
.form-field-container{gap:.9375rem}
.form-field-container select{padding: 1ch 2ch; margin-bottom: 0; font-size: var(--13); }
.form-field-container :is(select,option){color: var(--text-color) !important;}
.form-field-container .ui-button .ui-icon{background: url(../img/ic-arrow-small-up.svg) center center no-repeat; rotate:180deg;width: 12px;}
.advanced-search-form [type="submit"]{margin-top:0;font-size: 0; width: var(--2pad); height: var(--2pad); border-radius: 50%; background: var(--secondary) url(../img/ic-search-b.svg) center center no-repeat; background-size: 16px}

@media screen and (max-width: 39.9375em){
  .form-field-container .ui-selectmenu-button{width: 100%}
  .advanced-search-form [type="submit"]{font-size: var(--15); padding-left: 4ch; background-position: 1.2ch center; width: 100%; color: var(--black); border-radius: var(--2pad);    height: revert;    padding-block: 1ch; text-align: left; text-transform: uppercase; font-weight: 600}
.content-advanced_search_banner > .grid-container > .grid-x{gap: var(--msm)}
}

@media screen and (min-width: 64em) {
  .section-form-container{max-width:calc(58.33333% - 1.875rem)}
}



  /* ARCHIVE GENERAL */
:is(.archive, .blog,.search) .single-page-header{padding-bottom: var(--mmd)}
:is(.bst-grid-layout,.bst-list-layout) article .title, :is(.bst-grid-layout,.bst-list-layout) article .title a{font-size: var(--15); color: var(--text-color) ; line-height: 1.35; display: -webkit-box;   -webkit-box-orient: vertical;-webkit-line-clamp:3; overflow: hidden; font-weight: 600; margin-bottom: 0;    -webkit-line-clamp: 2;
  margin-bottom: 0;}
:is(.bst-grid-layout,.bst-list-layout) article .date-time{font-size: var(--13); font-weight: 500;  margin-bottom: calc(var(--pad) / 2 );text-align: right }
:is(.bst-grid-layout,.bst-list-layout) article .date-time .ic-calendar{font-size: inherit !Important}
:is(.bst-grid-layout,.bst-list-layout) article .date-time .ic-calendar:before{width: 1.5ch;height: 1.5ch;     transform: translateY(10%);}
:is(.bst-grid-layout,.bst-list-layout) article .featured-image{margin-bottom: var(--pad)}
:is(.bst-grid-layout,.bst-list-layout) article .featured-image img{aspect-ratio: 1.5/1; object-fit: cover; width: 100%}
:is(.bst-grid-layout) footer{margin-top: var(--pad)}
:is(.bst-grid-layout,.bst-list-layout)ut article  .category-name a{ font-size: var(--13); color: var(--text-color) }

:is(.bst-grid-layout,.bst-list-layout) article .tags-list{margin-bottom: calc(var(--pad) / 2 );font-size: var(--13); text-align: right}
:is(.bst-grid-layout,.bst-list-layout) article .tags-list a{ font-weight: 500; margin-right: var(--pad); color: var(--primary)}
:is(.bst-grid-layout,.bst-list-layout) article .tags-list a:before{display: inline-block;  position: relative;  content: "#";}
.bst-grid-layout-container footer .button-lit{margin-top: 0}

:is(.blog,.archive,.content-related,.search-results) :is(.bg-accent,.bg-dark) a:hover{color: var(--secondary)}
:is(.blog,.archive,.content-related,.search-results) :is(.bg-accent,.bg-dark) .ic-calendar:before{filter: var(--primary-to-secondary)}
:is(.blog,.archive,.content-related,.search-results) .bst-grid-layout{display: grid; gap:var(--2pad); grid-template-columns: repeat(4,1fr); margin: 0 var(--pad)}

:is(.blog,.archive,.search-results) main , .content-related{margin-bottom: var(--mlg)}


.bst-list-layout article{   display: -ms-flexbox;  display: flex;  -ms-flex-flow: row wrap;  flex-flow: row wrap; margin-bottom: var(--msm);  -ms-flex-align: center; align-items: end;}
.bst-list-layout article header{margin: 0 !important;}
.bst-list-layout .title, .bst-list-layout article .title a{font-size: var(--13)}
.bst-list-layout article .category-list{display: none}
.bst-list-layout article .featured-image{    width: 33.33333%;    flex: 0 0 auto;  margin-bottom: 0;  }
.bst-list-layout article .featured-image img{aspect-ratio: 1.1/1}
.bst-list-layout article .text-container{     -ms-flex: 1 1 0px;    flex: 1 1 0px;    padding-right: 0.625rem;    padding-left: 0.625rem;}
.bst-list-layoutlayout article .title, .bst-grid-layout article .title a{-webkit-line-clamp:2; margin-bottom: 0}
.bst-list-layout article .button-lit{margin-top: 0}
.bst-list-layout article .button-lit:after{display: none}
.bst-list-layout article footer{text-align: right;}


/* archive pagination */
.page-navigation{text-align: right;     margin-top: var(--msm); }
.pagination li{font-weight: 700; color: var(--text-color); font-size: var(--28)}
.pagination .current{background: none; color: var(--primary)}
.pagination li a:hover:not(.prev,.next){background: none; color: var(--primary)}
.pagination li :is(.next, .prev){--margin: 20px; --width: 50px; background: var(--primary);   font-size: 0;  height: var(--width);  aspect-ratio: 1;  display: inline-block;  line-height: calc(var(--width) * 1.3); position: relative; border-radius:  0 var(--width) var(--width) 0; }
.pagination li :is(.next){ margin-left: var(--margin);}
.pagination li :is(.prev){ margin-right: var(--margin); scale: -1 1}

.pagination li :is(.next, .prev):before{content: "";  position: absolute;  height: 100%;  width: calc(var(--pad)*3);
  top: 0;  left: calc(var(--pad)*-1);  background: url(../img/ic-arrow.svg) right center no-repeat;  filter: hue-rotate(-74deg) saturate(54) brightness(.9);  background-size: calc(var(--pad)*3) 100%;  transition: all ease-in .2s;}
.pagination li :is(.next, .prev):hover:before{    transform: translateX(var(--2pad));  width: var(--width);}


  /* SINGLE POST */
:is(.single-post,.single-resource)  main header{margin: var(--mmd) 0}
:is(.single-post,.single-resource) main article .entry-content{max-width: 75rem; margin: 0 auto var(--mlg) !important; }
:is(.single-post) .entry-title.single-title{margin-bottom: var(--msm)}

.slick-dots{text-align:left; bottom:-3.5rem; width: auto}
.slick-dots li button{width:.8rem; height: .8rem;    border-radius: 50%;  border: 2px solid var(--black);}
.slick-dots li.slick-active button{  background: var(--black); }
.slick-dots button:before{display: none}

.gallery-lightbox .gallery-item img{aspect-ratio: 1.5; object-fit: cover; object-position: center; width: 100%}
.slider-gallery.slick-dotted.slick-slider{margin-bottom: 4rem}
.slider-gallery .slick-prev{display: none}
.slider-gallery .slick-next{top:initial; bottom:-3rem; width: auto; right:0}
.slider-gallery .slick-next:before{    content: "next slide";  padding-right: 3.5rem;  display: inline-block;  background: url(../img/ic-arrow-purple.svg) right center no-repeat;
  background-size: 3rem;  color: var(--black);  font-family: var(--body-font);  font-size: var(--15);  font-weight: 600;  opacity: 1; width: max-content}
.slider-gallery .slick-dots{ bottom:-2.5rem;}

.noscroll {  overflow-x: hidden;  overflow-y: hidden;}
.share-modal-container{display: none; z-index: 999999; position: relative}
.share-modal{position: fixed; height:100vh; width: 100vw;   background: rgba(0,0,0,.7); top: 0; display: flex; align-items: center; justify-content: center;  }
.share-modal .share-content{max-width: calc(100% - var(--2pad)); width: 40rem; background: white; border-radius: var(--2pad); padding: var(--2pad); position: relative}
.share-modal .share-content img{aspect-ratio: 1.6; object-fit: cover}
.share-modal .share-content .share-title{font-size: var(--25); color: var(--primary); margin: var(--pad) 0 var(--2pad); font-weight: 700}
.share-modal input[type="text"]{cursor: text; margin-bottom: 0; background: var(--light-grey)}
.share-modal [type="button"]{border-radius: 0  var(--40) var(--40) 0 !important; padding: 0 var(--pad);border:none; background:var(--black); color: var(--secondary-light); cursor: pointer}
.share-close{    width: var(--50);  aspect-ratio: 1;  background: var(--black) url(../img/ic-close.svg) center center no-repeat;  background-size: var(--18);
  border-radius: 50%;  position: absolute;  right: 0;  top: 0;  translate: 25% -25%; cursor: pointer}
.addtoany_shortcode{margin-bottom: var(--2pad)}
.addtoany_list.a2a_kit_size_32 a:not(.addtoany_special_service)>span{    border-radius: 50%;  padding: 7px; width: 40px; height: 40px}
.share-modal-container .input-group{border: none}

.single-post .image-container{    padding: var(--2pad);  background: var(--primary);  border-radius: 0 50% 50% 0; position: relative}
.single-post .image-container:before{    content: "";  height: 100%;  width: calc(100vw - (var(--max-width) / 2));  background: var(--primary);  position: absolute;  top: 0;  left: calc((100vw - (var(--max-width) / 2)) * -1);  z-index: -1;}
.single-post .image-container img{ width:100%;aspect-ratio: 1;  object-fit: cover;  border-radius: 50%;}
@media screen and (min-width: 40em){}
.content-related .section-header{margin-bottom: var(--msm)}
.content-related .bst-grid-layout{display: -ms-flexbox;  display: flex;  -ms-flex-flow: row wrap;  flex-flow: row wrap; margin-bottom: var(--mlg);  -ms-flex-align: center; align-items: end;}

.menu-social-share li{    background: var(--black);
  aspect-ratio: 1;
  padding: 0.75rem;
  border-radius: 50%; margin: .7rem}
.menu-social-share li a{font-size: 0; width: 20px; aspect-ratio: 1; background: center center no-repeat; background-size: 100%; display: block; padding: 0; margin: 0;filter:saturate(0) brightness(10)  ;}
.menu-social-share li.facebook a{ background-image:url(../img/social/facebook.svg);}
.menu-social-share li.twitter a{ background-image:url(../img/social/twitter.svg);}
.menu-social-share li.email a{ background-image:url(../img/social/email.svg);}



/* SERVICES */


.services-grid-layout {gap:var(--2pad); display: grid; grid-template-columns: repeat(auto-fit,minmax(280px,1fr))}
.services-grid-layout .service-panel{width:100%}
.service-panel{border-radius: 2rem; padding: 1.5rem; border:2px solid var(--accent-light); display: flex;  flex-flow: column wrap; gap:var(--pad)}
.service-panel header{display: grid; grid-template-columns: 1fr 3fr; gap:var(--pad); align-items: center}
.service-panel header .service-logo{width: 100%; aspect-ratio: 1; border-radius: 50%; border:1px solid var(--light-border); overflow: clip}
.service-panel header .service-logo img{ width: 100%; height: 100%; object-fit:contain}
.service-panel header .title{font-size: var(--20)}
.service-panel :is(p, .button-slim){margin: 0}
.service-panel .terms_list{height: auto;font-size: var(--15); flex:1 1 0; height: auto }
.service-panel .terms_list .tax-name{font-weight: 500;}
.service-panel footer{display: flex;gap:var(--pad); flex-flow: row wrap;  justify-content: space-between;}
.service-panel footer :not(.button-slim){color:var(--primary); font-weight:500}

.single-services .single-page-header{margin-bottom: var(--mmd)}
.single-services .single-page-header .main-title{color: var(--black)}
.service-info-container .tax-name{color: var(--primary); font-weight: var(--bold);font-size: var(--13)}
.service-info-container .tax-list{font-size: var(--15)}
.service-info-container li{margin-bottom: var(--pad)}
.single-services  article section p{line-height: 1.6}
.single-services article section h2{font-size: var(--25); margin-bottom: var(--2pad)}
.single-services article section {margin-bottom: var(--mmd)}

.anchor-menu li a{color: var(--text-color); position: relative; padding-block: 1ch; padding-left:2.5ch; font-size: 16px; font-weight: 600; line-height: 1.2}
.anchor-menu li a:before{content: ""; width: 8px; height:8px; border-radius: 50%; background-color: var(--primary); display: block; position: absolute; top: 1.5ch ; left: 0; z-index: 1}
.anchor-menu li:not(:last-child) a:after{content: ""; height: 100%; width: 8px; position: absolute; background:var(--primary); left:0px; top: 1.8ch; }
.anchor-menu li.active a{color:  var(--primary)}

.anchor-menu li.active a:after, .anchor-menu li.active ~ li a:after {  background: var(--light-grey);}
.anchor-menu li.active ~ li a:before {   background-color: var(--light-grey);}

.services-list article{margin-bottom: var(--2pad)}
.services-list .button-arrow > span.arrow{border-color: #B3B3B3}
.services-list .button-arrow > span.arrow:after{filter: saturate(0) brightness(2.4);}
.services-list .button-arrow .button-text{font-weight: 600; color: var(--text-color)}

.services-list .services-content{display: grid; gap: var(--pad); }
.services-list .services-content div:nth-of-type(1n+4){display: none}
.services-list .services-content .title{margin-bottom: 0}
.services-list .services-content .title a{color:var(--text-color); font-size:var(--18) }
.services-list .terms_list{font-size: var(--13)}
.services-list .terms_list .tax-name{font-weight: 500; color: var(--primary)}

.service-main-info{display: grid; grid-template-columns: 1fr 3fr; gap:var(--pad); align-items: center; padding: .8rem; background: var(--black); color: white; border-radius: 1.2rem; margin-bottom: var(--2pad)}
.service-main-info .service-logo{width: 100%; aspect-ratio: 1; border-radius: 50%; border:1px solid var(--light-border); overflow: clip; background: white}
.service-main-info .service-logo img{ width: 100%; height: 100%; object-fit:contain}
.service-main-info p{margin-top: 0.2rem; margin-bottom: 0; color: white; font-size: var(--13)}
.service-main-info a{color: white; font-size: var(--14); font-weight: 600}
.service-main-info a:hover{color:var(--accent-light)}
  /* TESTIMONIALS */
.testimonials-slider{margin-bottom:0 !Important;background:white; border-radius: var(--30); padding:var(--30)}
.testimonials-list .button{margin-top:var(--2pad); float: right}
.testimonial-single .author{font-weight: 600;}
.testimonial-single .author-info{color:var(--primary); font-size: .8rem}
.testimonials-slider .slick-slide{height: 100%}

.testimonials-grid{columns: 23rem;  gap: 2rem;}
.testimonials-grid .testimonial-single{ break-inside: avoid; border-radius: 1.8rem; background:white; border:1px solid var(--accent-light); padding:2rem}
.testimonials-grid .testimonial-single + .testimonial-single{margin-top: 2rem}


.testimonials-slider .slick-track{display: flex; align-items: center}

@media screen and (min-width: 40em) and (max-width: 63.9375em){
  .services-list .services-content{grid-template-columns:repeat(3,1fr);}
  .services-list .services-content .title{grid-column: span 3}
}


@media screen and (min-width: 64em) {

  .services-list .services-content{grid-template-columns:repeat(4,1fr);}

}



@media screen and (max-width: 32.4375em){



}



/* Small only */
@media screen and (max-width: 39.9375em) {
  :root{
    --msm: 30px;
    --mmd: 40px;
    --mlg: 50px;

    --pad: .625rem;


    --max-width:100vw;



  }

  :is(h1,h2,h3,h4) .font-vb{font-size: var(--50)}

  .main-header{justify-content: end}
  main.main{margin-top: calc(var(--2pad) + 60px)}
 .main-header{ justify-content: right}

  .grid-container{     padding-inline: 1rem;}
  footer.footer .logo{width: 100%}

  #floating-button a, #floating-button{font-size: 0}
  #floating-button a:before, #floating-button{height: 50px; width:50px; right: calc(var(--pad) / 1.2 );}

  .anchor-menu li a{font-size: 0; height: 15px; width: 15px}
  .anchor-menu li a:before{width: 15px; height: 15px; border: 2px solid white; background: none}
  .anchor-menu li a.active:before{background: white}
  .anchor-menu li:not(:last-child){margin-bottom: 20px}
  article .sticky.is-stuck.is-at-top{width: 40px; right: var(--pad); top:50% !important; background: var(--primary); padding: 12px; border-radius: 20px;     translate: 0 -50%;    margin-top: 0 !important;}

  .accordion-title:after, .accordion-title:before{height: 46px}

  .single-page-header .grid-x{gap: var(--2pad)}

  .search-modal .search-container{padding: 0 var(--2pad)}

  footer.footer{padding-bottom: var(--mlg) !important;}
  footer.footer .grid-container > .grid-x >.cell{margin-bottom: var(--2pad)}

  .content-simple_text.small-spaced .single-column{margin-bottom: 2rem}
/* HERO */

  .content-hero{padding-top:1rem}

  /* text images */
  .content-text_images:is(.pos-full-right) .media-container:before{    width: 40%;    left:0; translate: 0 15% }
  .content-text_images:is(.pos-full-left) .media-container:before{    width: 40%;    right: -40%;left: initial}
  .content-text_images:is(.pos-full-left,.pos-full-right) .media-container:after{translate: 0 15%}

  /* BLOCK GRID */
  .content-blocks_grid.partners .single-image-grid >.cell:first-child{width: 29%}
  .content-blocks_grid.partners .single-image-grid .text p{text-align: left !important;}

  /* GRID IMAGE */
  .image-grid-container.team .single-image-grid .bio{grid-column: span 2; padding: var(--pad); }

  /* CTA BLOCKS */
  .cta-container{gap:3rem}
  .cta-container:is(.image-row-2, .image-row-3, .image-row-4, .image-row-5){grid-template-columns: 1fr}
 .cta-container.align-top .single-cta{margin-top: 2rem}

  /* content post list */
  .tab-links{width: 100%}

  /* CTA BANNER */
  .content-cta_banner .cta-banner-content{    justify-content: center;    text-align: center; padding:3rem 1rem}
  .cta-banner-content .icon{ width: 7rem; position: relative; margin-top: -4rem}
  .cta-banner-content .title {margin-bottom:2rem}


  .content-cta_banner{padding-top: 2rem}

  /* ADVANCED SERACH */
  .section-form-container .ui-button {  padding: 0.6em 1em;}
  .section-form-container form [type="submit"]{padding-block:.87rem}
  /* NEWSLETTER */
  section.newsletter .section-title,  section.newsletter .text{ padding: 0 var(--pad)}
  section.newsletter form{margin-top: var(--msm)}
  section.newsletter .privacy-acceptance{    margin-top: var(--2pad)}

  /* GLOSSARY */
  .selected-letter{text-align: center}


  .media-container{margin-bottom: var(--msm)}
  /* ARCHIVE GENERAL */
  :is(.blog,.archive,.content-related, .search-results) .bst-grid-layout{grid-template-columns: 1fr;}
  .bst-grid-layout article{   display: -ms-flexbox;  display: flex;  -ms-flex-flow: row wrap;  flex-flow: row wrap; margin-bottom: var(--mlg);  -ms-flex-align: center; align-items: end;}
  .bst-grid-layout article .featured-image{    width: 33.33333%;    flex: 0 0 auto;  margin-bottom: 0; }
  .bst-grid-layout article .featured-image img{aspect-ratio: 1.2/1}
  .bst-grid-layout article .text-container{     -ms-flex: 1 1 0px;    flex: 1 1 0px;    padding-right: 0.625rem;    padding-left: 0.625rem;}
  .bst-grid-layout article .title, .bst-grid-layout article .title a{-webkit-line-clamp:2; margin-bottom: 0}
  .bst-grid-layout article .button-lit{margin-top: 0}
  .bst-grid-layout article .button-lit:after{display: none}
  .bst-grid-layout article footer{text-align: right;}

  /* pagination */
  .pagination:after, .pagination:before{display: none}
  .pagination{display: flex; width: 100%; justify-content: space-between}
  .pagination .current{display: none}
  .pagination li :is(.prev){margin-left: var(--margin)}
  .pagination li :is(.next){margin-right: var(--margin)}
  /* SINGLE POST */
  .single-post  main .article-header .image-container{margin-bottom: var(--2pad)}
  .single-post  main .article-header h1{font-size:clamp(26px,1.9vw,30px);}

  /* RESOURCE */
  .resource-sidebar{margin-bottom: var(--mlg)}


  .image-grid-container.image-row-2,   .image-grid-container.image-row-3{grid-template-columns: 1fr}


}

@media screen and (max-width: 25.9375em) {
  .hide-extra-small{display: none}


}

/* Medium Down */

@media screen and (max-width: 64em){

  /* content post list */
  .content-post_list .tab-links{ -ms-flex-wrap: wrap;  flex-wrap: wrap;  -ms-flex-direction: row;  flex-direction: row; margin-bottom: var(--mmd); }

  .content-post_list .tab-links a{font-size: var(--17); padding: 0 1.5rem 0 0 }
  .content-post_list .tab-links a:before{display: none}
  .hero-cta-container{margin-top: 3rem}

  footer.footer .cell:nth-child(4):before{display: none}
  .hide-media-medium-down .media-container{display: none}
}

/* Medium only */
@media screen and (min-width: 40em) and (max-width: 63.9375em) {

  :root{
    --msm: 40px;
    --mmd: 55px;
    --mlg: 75px;
    --max-width:100vw;

  }

  .main-header{ justify-content: right}
  .content-post_list .tab-links a{font-size: var(--25); padding: 0 var(--2pad) 0 0 }

  :is(.blog,.archive,.content-related) .bst-grid-layout{grid-template-columns: repeat(2,1fr);}

  .single-post .content-related .bst-list-layout{    display: grid;    grid-template-columns: 1fr 1fr;    gap: var(--2pad);}


  .cta-container.align-top .single-cta{margin-top: 2rem}
}

/*


/* large up */
@media screen and (min-width: 64em) {
  .content-post_list .section-header>  .cell.text-left {  display: flex;  align-items: baseline;  gap: var(--2pad);}

}
@media screen and (min-width: 75em) {

.single-post .entry-container{margin-left: calc(8.33333% + 0.9375rem);}
  }

@media print {


}

