/* Design tokens so you can tweak quickly */
:root{
  --sidebar-w: 280px;
  --header-offset: 88px;         /* adjust to your actual header height */
  --text: #2b2b2b;
  --muted: rgba(0,0,0,.12);
  --muted-strong: rgba(0,0,0,.18);
  --accent: #0073e6;
  --radius: 10px;
  --y-gap: 10px;                 /* vertical spacing between items */
  --x-pad: 14px;                 /* side padding */
}


/* Sidebar container */
.sidebar {
  position: absolute;
  left: 0;
  width: 350px;
  height: 100vh !important;
  background: #f7f7f7;
  color: var(--text);
  padding: 14px var(--x-pad);
  z-index: 100;
}


  z-index: 1000;
  height: auto; /* Allow the sidebar to grow dynamically based on content */
  overflow-y: auto; /* Enable scrolling inside the sidebar */
  border-radius: var(--radius);
  box-shadow: 0 6px 18px rgba(0,0,0,.08);
  transition: transform 0.3s ease-in-out; /* Smooth transition for the sidebar */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Content inside the sidebar */
.sidebar-content {
  padding-top: 6px;  
  display: flex;
  flex-direction: column;
  gap: 0px; /* Adds space between list items */
}

/* Sidebar links style */
.sidebar-links {
  list-style-type: none;
  margin: 0;
  padding-left: 15px;
  padding-right: 20px;
}

/* Single source of truth for the divider */
.sidebar-links li{
  --divider: linear-gradient(
    to right,
    transparent 0%,
    rgba(0,0,0,0.14) 12%,
    rgba(0,0,0,0.22) 50%,
    rgba(0,0,0,0.14) 88%,
    transparent 100%
  );
  background-image: var(--divider);
  background-repeat: no-repeat;
  background-position: left bottom;
  background-size: 100% 1px;
  padding: 15px 0 20px;          /* bottom padding gives space above the line */
}

/* Subtle “pop” on hover (keeps a line even when not hovering) */
.sidebar-links li:hover{
  background-image: linear-gradient(
    to right,
    transparent 0%,
    rgba(0,115,230,0.22) 50%,
    transparent 100%
  );
}
/* Link typography (single definition) */
.sidebar-links a{
  display: block;
  color: #2b2b2b;
  text-decoration: none;
  font-size: 16px;
  line-height: 1.3;
  font-weight: 500;
  padding: 0;                   /* padding handled by li */
  transition: color .18s ease, transform .18s ease;
  will-change: transform;
}

.sidebar-links a:hover,
.sidebar-links a:focus { color: #0073e6; }


.sidebar-links a:hover,
.sidebar-links a:focus-visible{
  color: var(--accent, #0073e6);
  transform: translateX(6px);
}

.container {
  align-items: flex-start; /* Keeps sidebar aligned at the top */
}


.sidebar-links li:not(:last-child) {
  position: relative;
  padding-bottom: 20px;
}


.sidebar-links li:hover::after {
  background: linear-gradient(
    to right,
    rgba(0,115,230,0) 0%,
    rgba(0,115,230,0.18) 50%,
    rgba(0,115,230,0) 100%
  );
}

.sidebar-links a:hover,
.sidebar-links a:focus {
  color: #0073e6;
}

.sidebar-links li:hover::before,
.sidebar-links li:has(a:focus-visible)::before{
  width: 3px;                   /* subtle “pop”, still clean */
}

/* Active/current page state (optional) */
.sidebar-links li.is-active > a{
  color: var(--accent, #0073e6);
  font-weight: 500;
  transform: translateX(6px);
}
.sidebar-links .is-active::before{
  width: 3px;
}

/*.sidebar {
position: sticky;
top: 0;
width: 280px;
flex-shrink: 0;
height: 100vh; /* Sidebar takes full height 
} */



.sr-cover.d-flex.height-small {
  padding-top: 50px;
  padding-bottom: 50px;
}

.main-content {
  margin-left: 300px;
  flex-grow: 1;
  padding: 20px;
}

/* this is to keep the header fixed so it doesn't pop up as the user scrolls back up - this was blocking the proper anchor placement */
.header__container[data-fixed=true][data-scroll=false][data-topbar-fixed=false], .header__container[data-fixed=true][data-scroll=false][data-topbar-fixed=true] .header__bottom, .header__container[data-fixed=true][data-scroll=true].scroll-up[data-topbar-fixed=false], .header__container[data-fixed=true][data-scroll=true].scroll-up[data-topbar-fixed=true] .header__bottom {
  top: -100%;
}

/* code specifically for the template - centering the body content on the page */
.row-fluid-wrapper.row-depth-1.row-number-3.body_dnd_area-row-1-vertical-alignment.dnd-section {
  margin-left: 15%;
}



/* mobile hamburger menu */
.header__container[data-layout=mobile] .header__menu--show, .header__container[data-layout=mobile] .header__menu-container--mobile {
  display: none;
}




/* the below code is specific for the body content so that it doesn't overlap with the sidebar
* when the browser viewport size shrinks */

@media (max-width: 1620px) {
  .site_footer-module-1 {
    padding-left: 30%;
  }
}

@media (max-width: 1528px) {

  .row-fluid-wrapper.row-depth-1.row-number-3.body_dnd_area-row-1-vertical-alignment.dnd-section {
    padding-left: 70px;
  }
  .sidebar {
    width: 200px;
  }
  .sidebar-links a {
    font-size: 12px;
  }

  .site_footer-module-1 {
    padding-left: 30%;
  }
}

/*@media (max-width: 1240px) {
.header__logo img      {
margin-left: 75%;
}
} */

@media (max-width: 1210px) {
  .row-fluid-wrapper.row-depth-1.row-number-3.body_dnd_area-row-1-vertical-alignment.dnd-section {
    padding-left: 50px;
  }

  .sidebar {
    max-width: 15%;
  }
  .sidebar-links a {
    font-size: 12px;
  }
}

@media (max-width: 1550px) {
  .sidebar {
    max-width: 245px;
  }
}

@media (max-width: 1390px) {
  .sidebar {
    display:none;
  }
  .row-fluid-wrapper.row-depth-1.row-number-3.body_dnd_area-row-1-vertical-alignment.dnd-section {
    padding-left: 15px;
    margin-left: 0px;
  }
  .site_footer-module-1 {
    padding-left: 0;
  }
}

@media (min-width: 1390px) {
  /* main content sections to move them center page (but account for the sidebar with offsets the content) */
  .body_dnd_area-module-2.sr-hero-01.sr-cover-parallax .height-medium,
  .body_dnd_area-row-2-max-width-section-centering > .row-fluid,
  .body_dnd_area-row-3-max-width-section-centering > .row-fluid,
  .body_dnd_area-row-4-max-width-section-centering > .row-fluid,
  .body_dnd_area-row-5-max-width-section-centering > .row-fluid,
  .body_dnd_area-row-6-max-width-section-centering > .row-fluid,
  .body_dnd_area-row-7-max-width-section-centering > .row-fluid,
  .body_dnd_area-row-8-max-width-section-centering > .row-fluid,
  .body_dnd_area-row-9-max-width-section-centering > .row-fluid,
  .body_dnd_area-row-10-max-width-section-centering > .row-fluid,
  .body_dnd_area-row-11-max-width-section-centering > .row-fluid,
  .body_dnd_area-row-12-max-width-section-centering > .row-fluid,
  .body_dnd_area-row-13-max-width-section-centering > .row-fluid,
  .body_dnd_area-row-14-max-width-section-centering > .row-fluid,
  .body_dnd_area-row-15-max-width-section-centering > .row-fluid,
  .body_dnd_area-row-16-max-width-section-centering > .row-fluid,
  .body_dnd_area-row-17-max-width-section-centering > .row-fluid,

  .sr-offer-one-col-01, /* bottom cta form */
  div#download-ebook, /* ebook section */
  .row-fluid-wrapper.row-depth-1.row-number-16.dnd-section /* testimonial slider section */ {
    padding-left: 15% !important;
  }

  


      
  .custom-footer {
    padding-left: 20% !important;
  }
}