/* Fonts */
/* Cardo: 400 normal, 700 normal, 400 italic */
@font-face{
  font-family:"Cardo";
  src:url("../fonts/Cardo/Cardo-Regular.ttf") format("truetype");
  font-weight:400;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"Cardo";
  src:url("../fonts/Cardo/Cardo-Bold.ttf") format("truetype");
  font-weight:700;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"Cardo";
  src:url("../fonts/Cardo/Cardo-Italic.ttf") format("truetype");
  font-weight:400;
  font-style:italic;
  font-display:swap;
}

/* Ysabeau Office (variable) */
@font-face{
  font-family:"Ysabeau Office";
  src:url("../fonts/Ysabeau_Office/YsabeauOffice-VariableFont_wght.ttf") format("truetype");
  font-weight:1 1000;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"Ysabeau Office";
  src:url("../fonts/Ysabeau_Office/YsabeauOffice-Italic-VariableFont_wght.ttf") format("truetype");
  font-weight:1 1000;
  font-style:italic;
  font-display:swap;
}

/* Root */
:root{
  --color-grey:#353535;
  --color-maroon:#7f3434;
  --color-white:#fff;
  --color-mauve:#bc6c6c;
  --color-beige:#cec0b2;
  --color-image-backgrounds:#a7a7a7;
}

html, body, *{ box-sizing:border-box; }

body{
  font-family:"Ysabeau Office",sans-serif;
  font-optical-sizing:auto;
  font-weight:300;
  font-style:normal;
  font-size:17px;
  margin:0; 
  color:var(--color-grey);
}


/* 1) Native smooth scrolling */
html {
  scroll-behavior: smooth;
}

/* 2) Accessibility: respect reduced-motion */
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}


img{ max-width:100%; height:auto; }
a{ transition:all .4s ease; }

.white{ color:#fff !important; }
.bk-maroon{
  background-color:var(--color-maroon);
}
/* Typography */
h1,h2,h3,h4,h5,h6, a.button{
  font:400 normal 1em/1.2 "Cardo",serif !important;
  margin-top:0;
}
h1{ font-size:54px !important; }
h2{ font-size:45px !important; font-weight: normal !important;}
h3{ font-size:36px !important; font-weight: normal !important;}
h4{ font-size:27px !important; font-weight: normal !important;}
h5{ font-size:24px !important; font-weight: normal !important;}
h6{ font-size:18px !important; font-weight: normal !important;}

/* structure */
.container{
  width:1600px;
  max-width:100%;
  margin:0 auto;
}

/* buttons */
.button{
  padding:12px 24px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
  border-radius:24px !important;
  background:var(--color-maroon) !important;
  color:#fff !important;
  text-decoration:none !important;
  transition:all .4s ease !important;
  font-size:18px !important;
}
.button:hover{ background:var(--color-mauve) !important; }

#main .button{
  margin:25px 0 !important;
}

/********************************************** Header */
#header{
  background:var(--color-mauve) !important;
  position:sticky;
  top:0;
  z-index:9999;
}
#header .header-split{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  margin:15px 0;
}
#header .header-split .header-logo{ width:260px; }

/* NAV (Bootstrap 3 collapse) */
#header .nav-menu-wrapper.w-nav-menu.navbar{
  background:var(--color-maroon) !important;
  border:0 !important;
  border-radius:0 !important;
  margin:0 !important;
  min-height:0 !important;
}
#header .nav-menu-wrapper.w-nav-menu.navbar .container{
  padding-left:0;
  padding-right:0;
}
#header .nav-menu-wrapper.w-nav-menu .navbar-collapse{
  border-top:0 !important;
  box-shadow:none !important;
  padding-left:0;
  padding-right:0;
}
#header .nav-menu-wrapper.w-nav-menu .navbar-toggle{
  border-color:transparent !important;
  margin:0 !important;
  float:left !important;
}
#header .nav-menu-wrapper.w-nav-menu .navbar-toggle .icon-bar{
  background:#fff !important;
}
.navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover{
  background-color:transparent !important;
}
#header .nav-menu-wrapper.w-nav-menu .nav-menu{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  gap:16px;
  width:100%;
  align-items:center;
  justify-content:space-between;
  float:none !important;
}

body.inner-page.physician #header .nav-menu-wrapper.w-nav-menu .nav-menu{
  justify-content:space-around;
}


#header .nav-menu-wrapper.w-nav-menu .nav-menu > li{
  position:relative;
  float:none !important;
}
#header .nav-menu-wrapper.w-nav-menu .nav-menu li a,
#header .nav-menu-wrapper.w-nav-menu .nav-menu li a.nav-link{
  color:#fff !important;
  text-decoration:none !important;
  font-family:"Ysabeau Office",sans-serif !important;
  margin:16px 0;
  padding:8px;
  display:block;
  font-size:18px;
  background:transparent !important;
}
#header .nav-menu-wrapper.w-nav-menu .nav-menu li a.nav-link:hover,
#header .nav-menu-wrapper.w-nav-menu .nav-menu li a:hover{
  /* color:var(--color-grey) !important; */
  opacity:.8 !important;
  text-decoration:underline !important;
}
#header .nav-menu-wrapper.w-nav-menu .nav-menu .caret{ margin-left:6px; }

/* dropdown */
#header .nav-menu-wrapper.w-nav-menu .nav-menu li ul.sub-nav{
  position:absolute;
  top:100%;
  right:0;
  left:auto;
  min-width:220px;
  background:var(--color-maroon) !important;
  border:0 !important;
  border-radius:0 0 16px 16px !important;
  box-shadow:none !important;
  opacity:0;
  visibility:hidden;
  transition:all .4s ease;
  padding:16px;
  margin:0;
  display:block;
}
#header .nav-menu-wrapper.w-nav-menu .nav-menu li:hover > ul.sub-nav{
  opacity:1;
  visibility:visible;
}
#header .nav-menu-wrapper.w-nav-menu .nav-menu li.open > ul.sub-nav{
  opacity:1;
  visibility:visible;
}
#header .nav-menu-wrapper.w-nav-menu .nav-menu li ul.sub-nav,
#header .nav-menu-wrapper.w-nav-menu .nav-menu li ul.sub-nav li{
  list-style:none;
  padding:0;
  margin:0;
}
#header .nav-menu-wrapper.w-nav-menu .nav-menu li ul.sub-nav li a{
  display:block;
  width:100%;
  margin:0;
  padding:8px 16px;
  text-align:left;
  color:#fff !important;
  background:transparent !important;
}



/************************************ main */
#main{
  padding:0;
  margin:0;
  min-height:100vh;
  width:100% !important;
  overflow: hidden !important;
}
#main > .container{ 
  box-shadow: 0 2px 20px 8px #dfe4f24d;
  padding:0 !important;
}

/* hero */
#main .hero{
  background-image:url(../images/69790a8bdcb4bbbd4c7966f8_AdobeStock_878212807-beige_expanded.jpg);
  background-position:bottom right;
  background-repeat:no-repeat;
  background-size:cover;
  position:relative;
}
#main .hero .hero-text-wrap{ padding:100px 50px !important; float:left; padding-top:0 !important; }

#main .hero h2.subheader{
  padding-bottom:15px;
  margin-bottom:15px;
  border-bottom:solid 1px #fff;
  font-size:24px !important;
  color:#fff !important;
  font-family:"Ysabeau Office",sans-serif !important;
}
#main .hero .button{
  float:left;
  margin:25px 0 !important;
  font-size:18px !important;
}

#main .hero .graphic-layer-lower-right{
  max-width:200px;
  max-height:200px;
  position:absolute;
  inset:auto 0 0 auto;
}

/* content section background image */
.section-bk-image{
  background-image:url(../images/69778d990baa5d6099a57d08_AdobeStock_175170162-beige_lores.jpg);
  background-position:50%;
  background-repeat:no-repeat;
  background-size:cover;
  min-height:400px;
  position:relative; /* was absolute: this was breaking layout */
}
.graphic-layer-lower-left{
  max-width:200px;
  max-height:200px;
  position:absolute;
  inset:auto auto 0 0;
}

.anchor{
padding-top:200px !important;
margin-top:-200px !important; 
z-index: -1;
}


.h1-header.anchor {
    padding-top: 300px !important;
    margin-top: -300px !important;
}
.h1-header.anchor + h1{
  padding-top:20px !important;
}

#main   ul{
  padding-left:15px;
}
#main p strong{
  color:var(--color-maroon);
}


/************************************ footer */
#footer{ background:var(--color-mauve) !important; width:100%; overflow: hidden;}
#footer .footer-logos{
  display:flex;
  justify-content:space-between;
  align-items:center;
  color:#fff;
}
#footer .footer-logos a.footer-brand{ width:200px; max-width:40% !important; }
#footer .footer-divider{
     width: 100%;
    height: 1px;
    margin: 15px 0;
    display: block;
    background: #fff;
}
#footer .footer-logos.top{ margin-top:50px; }
#footer .footer-logos.mid,
#footer .footer-logos.bottom{ margin-bottom:15px; }
#footer .footer-links{ display:flex; gap:15px; }
#footer .footer-links a{ color:#fff !important; }


#footer .foot-copyright,
#footer .footer-links a{
  font-size:14px !important;
}
 

.content-block{
  display:block;
  padding:25px !important;
  width:100% !important;
  float:left !important;
}
 
#main h2{
  margin-bottom:25px !important;
}
.row.row-vcenter h2 {
    color: var(--color-maroon) !important;
    margin-top: 20px;
    margin-bottom: 25px;
    font-weight: 400 !important;
    font-size:32px !important;
}

.icon-set{
  padding:100px 50px !important;
  display:block !important;
  width:100%;
}
 
.icon-set p strong{
  color:#fff !important;
}

body.physician .icon-set.bk-mauve p strong{
  color:var(--color-grey) !important;
}


.icon-set h2 {
  font-size:32px !important;
  font-family: "Cardo",serif !important;
}

.icon-set h3 {
  font-size:24px !important;
  font-family: "Cardo",serif !important;
}

.icon-set .flex-block{
  gap:20px;
  padding:20px 0 !important;
  align-items: center;
}
  
.icon-set .flex-block .block.icon-block{
  width:200px !important;
  padding:0 !important;

}

.icon-set .flex-block .block.icon-block img{
  width:100% !important;
}
  
.bk-beige{
  background-color:var(--color-beige);
}

.bk-mauve{
  background-color:var(--color-mauve) !important;
}

.flex-block{
    display:flex;
    align-items: flex-start
  }

 .icon-set .flex-block .block.icon-block {
    width: 100px !important;
    padding: 0 !important;
    min-width: 100px !important;
}


.cta-button.button.float-left{
  float:left;
  font-size:18px !important;
}


.section-bk-image{
  position:relative;
}

.section-bk-image .graphic-layer-upper-left {
    max-width: 200px;
    max-height: 200px;
    position: absolute;
}

.content.clinical{
  position:relative;
  z-index: 2;
}

.section-bk-image.clinical-study{
  background-image: url(../images/697791204825ba24a14f67ec_AdobeStock_188506221-beige-lores.jpg) !important;
  padding:0 !important;
}
 
.content.accordian{
  padding:100px 50px !important;
  position:relative; 
  
}
 
.content.accordian .accordion-comp {
    flex-flow: column;
    align-items: stretch;
    width: 100%;
    display: flex;
} 

.content.accordian .accordion-comp .wrapper {
    flex-direction: column;
    flex: 1;
    justify-content: flex-start;
    display: flex;
}

.content.accordian .accordion-comp .wrapper  .drawer {
    border-bottom: 1px solid var(--color--mauve);
    flex-flow: column;
    flex: 1;
    align-items: flex-start;
    padding: 0 !important;
    display: flex;
    margin:15px 0 0 0 !important;
}
.content.accordian .accordion-comp .wrapper  .drawer ._w-trigger {
    cursor: pointer;
    flex-flow: wrap;
    flex: 1;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    padding: 0 !important;
    display: flex;
}

.accordion-comp h5 {
    font-size: 20px !important;
    font-weight: normal !important;
}
 
.graphic-layer-lower-right {
    max-width: 200px;
    max-height: 200px;
    position: absolute;
    inset: auto 0% 0% auto;
} 

 .last-box .section-bk-image {
    background-image: url(../images/697792f25d796d5d0040b606_AdobeStock_188770566-beige.jpg);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 400px;
    position: relative;
}
  
h2{
  font-size:32px !important;
}

.content.accordian h2{
    color: var(--color-maroon) !important;
    font-family: Cardo, Times New Roman, sans-serif !important; 
    margin-top: 20px 0 10px 0 !important;  
    font-weight: 400 !important;
}

.content.accordian .faq-question{
  font-size:24px !important;
  color: var(--color-maroon) !important;
  padding:0 !important;
  margin:0 !important;
  display:block !important;
  width:80% !important;
}


/* HARD RESET: prevents the “vertical bar flies right” flash */
.drawer .plus-minus,
.drawer .arrow-box,
.drawer .stem{
  box-sizing:border-box;
}

.drawer .plus-minus {
    flex: 0 0 auto;
    width: 44px;
    height: 44px;
    display: flex !important;
    align-items: center;
    justify-content: center;
    position: relative;
    top: -6px;
}

.drawer .arrow-box{
  position:relative !important;
  width:25px;
  height:25px;
  display:block !important;     /* avoid flex-flow side effects */
}

.drawer .stem{
  position:absolute !important;
  left:50% !important;
  top:50% !important;
  width:25px !important;
  height:4px !important;
  margin:0 !important;          /* kills old margin-top hacks */
  padding:0 !important;
  float:none !important;
  background:var(--color-maroon) !important;
  transform:translate(-50%,-50%) !important;
}

/* the vertical bar */
.drawer .stem.vertical{
  left:50% !important;
  top:50% !important;
  right:auto !important;
  bottom:auto !important;
  transform:translate(-50%,-50%) rotate(90deg) !important;
  transform-origin:center center !important;
  opacity:1;
  transition:opacity .2s ease, transform .2s ease;
}

/* OPEN => minus */
.drawer.is-open .stem.vertical{
  opacity:0;
}


._w-trigger{
  display:flex;
  align-items:center;
  justify-content:space-between;
  cursor:pointer;
}

.plus-minus{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  justify-content:center;
  width:44px;              /* tap target */
  height:44px;
}

.arrow-box{
  position:relative;
  width:25px;
  height:25px;
  display:flex;
  align-items:center;
  justify-content:center;
}

/* both bars share same geometry */
.stem{
  position:absolute;
  left:50%;
  top:50%;
  width:25px;
  height:4px;
  background:var(--color-maroon);
  transform:translate(-50%,-50%);
}

/* vertical bar: rotated 90deg so it becomes a "+" by default */
.stem.vertical{
  transform:translate(-50%,-50%) rotate(90deg);
  transition:transform .2s ease, opacity .2s ease;
}

/* OPEN STATE = minus (hide or flatten vertical) */ 
.drawer.is-open .stem.vertical{
  opacity:0;
}

  
/* optional hover */
._w-trigger:hover .stem{
  background:var(--color-grey);
}


.content.accordian .accordion-comp{
  margin-top:50px !important;
}

.content.accordian .accordion-comp .wrapper .drawer {
  margin-bottom:15px !important;
  padding-bottom:15px !important;
  border-bottom: 1px solid var(--color-mauve) !important;
}


#main ul li {
  padding: 0;
  list-style-type: none;
  background-image: url(../images/69739dd9709e3872b50ab3cf_Bullet.png);
  background-repeat: no-repeat;
  padding-left: 15px;
  background-position: 0 11px;
  background-size: 5px;
  font-size:18px !important;
}
 
 ol li::marker {
    font-weight: bold;
    color:var(--color-maroon) !important;
}

.nav-list-item.show-on-mobile{
  display:none !important;
}

    .flex-content{ 
    display:flex !important;
    }

.icon-set .flex-content{
  display:block !important;
}

#ot-sdk-btn{
  background: transparent !important;
    border: none !important;
    padding: 0 !important;
    font-size: 14px !important;
}

#ot-sdk-btn:hover{
  text-decoration: underline !important;
}

/****************************** responsive styles */
@media (max-width: 1400px){
h1 {
    font-size: 36px !important;
}

}

/* Mobile nav */
@media (max-width: 767px){
  #header .nav-menu-wrapper.w-nav-menu .nav-menu{ display:block; }
  #header .nav-menu-wrapper.w-nav-menu .nav-menu > li{ width:100%; }
  #header .nav-menu-wrapper.w-nav-menu .nav-menu li a,
  #header .nav-menu-wrapper.w-nav-menu .nav-menu li a.nav-link{
    margin:0;
    padding:12px 12px;
  }
  #header .nav-menu-wrapper.w-nav-menu .nav-menu li ul.sub-nav{
    position:static;
    min-width:0;
    width:100%;
    opacity:1;
    visibility:visible;
    display:none;
    padding:0 0 8px 0;
    border-radius:0 !important;
  }
  #header .nav-menu-wrapper.w-nav-menu .nav-menu li.open > ul.sub-nav{ display:block; }
}


@media (max-width: 960px){
  .container{ padding:16px !important; }
  #header .header-split .header-logo{ width:220px; }

}

@media (min-width: 768px){ 

    .flex-content .content-block{
    padding:50px !important;
    align-self:center !important;
    }

    .row.row-vcenter{
    display:flex;
  
    padding:0 15px !important;
    }
    .row.row-vcenter > [class*="col-"]{
    float:none;           /* override BS3 floats so flex works */
    }
}
 
@media (min-width: 768px) and (max-width: 1020px) {
  #header .nav-menu-wrapper.w-nav-menu .nav-menu {
    gap: 0;
  }

  #header .nav-menu-wrapper.w-nav-menu .nav-menu li a,
  #header .nav-menu-wrapper.w-nav-menu .nav-menu li a.nav-link {
    padding: 0;
    font-size: 16px;
  }
}



@media (max-width: 768px){

  .nav-list-item.show-on-mobile{
  display:block !important;
}

    .header-right{
    display:none !important;
    } 

    #main {
    overflow: hidden !important;
    }

    #main > .container{
    box-shadow: none !important;
    } 
    
    #main .hero {
    background-position: 70%;
    background-size: cover;
    padding:25px !important;
    position:relative !important;
    }

      #main .hero:before{
        content:' ';
        position:absolute;
        width:100%;
        height:100%;
        top:0;
        left:0;
        background-color:rgba(0,0,0,.25);
       
      display:none;
      }

    #main .hero .hero-text-wrap {
    padding:0 !important;
    background-color:transparent !important;
    float:left;
    min-height:980px !important;
    height:auto;
     padding-top:0 !important;
    } 

    #main .hero .hero-text-wrap h1{
    font-size:36px !important;
    }

    .row.row-vcenter{
    display:flex;
    flex-wrap:wrap !important;
    }

    .flex-content{
    order:1 !important;
    display:flex !important;
    }

    .section-bk-image{
    order:2 !important;
    } 

    .content.accordian {
    padding: 100px 20px !important;
    }

    .content.accordian .faq-question {
    font-size: 18px !important;
    color: var(--color-maroon) !important;
    max-width:80%;
    }

    .icon-set {
        padding: 50px 25px !important; 
    }

    .header-split{
      margin:0 !important;
      padding:0 !important;
    } 
}



@media (max-width: 450px){

  .content.accordian{
    padding: 50px 20px !important;
  }

 #main .hero .hero-text-wrap {
  min-height:1200px !important; 
 }
}
 
/*********************************** theme style overrides for Physicians */
body.physician #header{
  background: var(--color-beige) !important;
}

body.physician #header .nav-menu-wrapper.w-nav-menu.navbar{
  background: var(--color-mauve) !important;
}

 
body.physician #main .hero {
    background-image: url(../images/AdobeStock_188770566-beige.jpg) !important;
    background-position: right bottom;
    background-repeat: no-repeat;
    background-size: auto 100%;
    background-color: #e6ded3;
    position: relative;
}


body.physician .icon-set.bk-mauve {
    background-color: var(--color-beige) !important;
}

body.physician .callout-section{
  padding:25px !important;
  position:relative;
  max-height:unset;
}
 
@media (min-width: 1280px){
  body.physician .callout-section:not(.unset){ 
    max-height:200px;
  }
}

body.physician .callout-section.unset .graphic-layer-lower-right{
  bottom:auto !important;
  top:0 !important;
}

body.physician .callout-section .cta-button.button{
  background: var(--color-mauve) !important;
}

body.physician .callout-section .inner-content{ 
  width:calc(100% - 250px);
  display:block; 
}

body.physician .callout-section .inner-content h2{
  margin-bottom:15px !important;
}

body.physician .section-bk-image-bk-scratch{
      background-image: url(../images/backscratch.png);  
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-position: center center;
    position: relative !important;
}

body.physician .section-bk-image-bk-scratch .graphic-layer-lower-right{
bottom:0 !important;
right:auto !important;
top:auto !important;
left:0 !important;
z-index: 9 !important;
width: 200px !important;
    height: 200px !important;
}

body.physician .padding-200{
  padding:100px 50px !important;
}

body.physician  .bk-mauve.icon-set .block p{
  color:var(--color-grey) !important;
}

body.physician #footer {
    background: var(--color-beige) !important;
    width: 100%;
    overflow: hidden;
}
body.physician .maroon{
  color:var(--color-maroon) !important;
}
#main .hero h2.subheader.maroon{
  color: var(--color-maroon) !important;
  border-color: var(--color-maroon) !important;
}

body.physician #footer.color-gray #ot-sdk-btn,
body.physician #footer.color-gray .foot-copyright,
body.physician #footer.color-gray .footer-links a{
  color:var(--color-grey) !important;
}
body.physician #footer.color-gray .footer-divider{
  background:var(--color-grey) !important;
}

.inner-page-content{
  width:100%;
  padding:50px;
}


@media (max-width: 960px){

  
  .callout-section .inner-content{ 
    width:calc(100%); 
    display:block;
    position: relative;
    z-index:9;
  
  }
  .callout-section .graphic-layer-lower-right{
  opacity:0 !important;
  }

  body.physician .padding-200 {
    padding: 25px !important;
}

  .content.bk-maroon.white.content-block.callout-section .inner-content,
  .content.bk-maroon.white.content-block.callout-section.unset .inner-content{
    width:100% !important;
    max-width:100% !important;
  }

  body.physician .col-xs-12.col-sm-6.section-bk-image-bk-scratch{
    height:475px;
    order:2 !important;
  }


  body.physician #main .hero {
    background-image: url(../images/AdobeStock_188770566-beige.jpg) !important;
    background-position: right bottom;
    background-repeat: no-repeat;
    background-size: auto 50%;
    position: relative;
    background-color: #e6ded3;
}


  body:not(.physician) #main .hero:before{
        content:' ';
        position:absolute;
        width:100%;
        height:100%;
        top:0;
        left:0;
        background-color:rgba(0,0,0,.35); 
      display:block;
      }

}