.legal-center {margin:0 auto;border-radius:var(--border-radius);}
.legal-menu-wrap .hs-menu-wrapper.hs-menu-flow-vertical>ul li.hs-item-has-children ul.hs-menu-children-wrapper {
    visibility: hidden;
    opacity: 0;
    -webkit-transition: opacity .4s;
    position: relative;
    z-index: 10;
    top: 0;
    left: 0;
}
.legal-menu-wrap .hs-menu-wrapper.hs-menu-flow-vertical li a {
    display: block;
    white-space: nowrap;
    width: 100%;
    overflow: visible;
    text-overflow: unset;
}

.legal-menu-wrap .hs-menu-wrapper.hs-menu-flow-vertical>ul li a {
    padding: 4px 8px;
    text-decoration: none;
}
.legal-menu-wrap .hs-menu-wrapper.hs-menu-flow-vertical>ul li.hs-menu-depth-1>a {
    width: auto;
    font-weight: 700;
    font-size: 14px;
    line-height: 17px;
}
.legal-menu-wrap .hs-menu-wrapper.hs-menu-flow-vertical.no-flyouts>ul li.hs-item-has-children ul.hs-menu-children-wrapper, .hs-menu-wrapper.hs-menu-flow-horizontal.no-flyouts>ul li.hs-item-has-children ul.hs-menu-children-wrapper {
    visibility: visible;
    opacity: 1;
    font-size: 14px;
    font-weight: 500;
    line-height: 17px;
    border-left: 1px solid var(--color-dark-grey);
    display: inline-block;
    padding-left: 20px;
}

.legal-menu-wrap li.hs-menu-item.hs-menu-depth-2:hover {
    background-color:var(--color-grey);
    border-radius:6px;
} 

.legal-menu-wrap .hs-menu-children-wrapper .hs-menu-item a {
    padding:10px;
    margin-left:10px;
}

.legal-center .cta-wrap {
    margin-top: 20px;
}
.legal-center .need-help {
    margin-top: 40px;
}

.legal-center ol li {
    margin-bottom: 10px;
}

.legal-center ol {
    padding-left: 20px;
    font-size: 16px;
    line-height: 28px;
    font-family: inherit;
    font-weight: 400;
}
.legal-menu {
   /*  position: sticky;
    top: 10px; /* Adjust this value as needed */
    z-index: 100; /* Added z-index to ensure visibility */
}
.legal-center li.hs-menu-item.hs-menu-depth-2.active {
    font-weight: 700;
    background-color: #fff;
    border: 1px solid var(--color-grey);
    border-radius: 6px;
}

.legal-center h3 {
font-family: Inter Tight;
font-size: 26px;
font-weight: 700;
line-height: 33.56px;

}

.legal-menu {
    border-radius: 6px;
    border: 1px solid var(--Grey, #D5DCE4);
    background: var(--Light-Grey, #F0F3F7);
    display: flex;
    padding: var(--spacing-space-16, 16px);
    flex-direction: column;
    align-items: flex-start;
    gap: 36px;
    align-self: stretch;
}

.legal-menu-wrap li.hs-menu-item a {
    overflow: hidden;
    color: var(--content-content-primary, #000);
    text-overflow: ellipsis;

/* Subheadings/14 Book */
    font-family: "F37 Zagma Trial";
    font-size: 14px;
    font-style: normal;
    font-weight: 350;
    line-height: normal;
}

li.hs-menu-item.hs-menu-depth-1 {
    border-bottom: 1px solid #D5DCE4;
      padding: 12px 0;
}

ul.active-branch {
    width: 100%;
}

.legal-menu-wrap {
    width: 100%;
}
li.hs-menu-item.hs-menu-depth-1.active.active-branch a {
    color: var(--White, #FFF);

/* Subheadings/14 Book */
    font-family: "F37 Zagma Trial";
    font-size: 14px;
    font-style: normal;
    font-weight: 350;
    line-height: normal;
    border-radius: 3px;
    background: var(--Black, #000);
    display: inline-block;
    line-height: 1 !important;
}
.menu-sub {
    border-radius: 5px;
    border: 1px solid var(--Primary-Old-Rice, #E7E5E0);
    background: var(--Light-Grey, #F0F3F7);
    display: flex
;
    /* width: 333px; */
    padding: 24px;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    margin-top: 20px;
    color: var(--Primary-Black, #111);
    font-family: "F37 Zagma Trial";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 28px;
}
.legal-menu h4 {
    background: var(--Gradients-Mindflick-Headline-01, linear-gradient(90deg, #000 6.4%, #711BDE 47.8%, #DD1BD4 77.53%, #FF4B00 106.73%));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-bottom: 0;
}
ul.active-branch > li.hs-menu-item.hs-menu-depth-1:last-child {
  border-bottom: none;
}
.faq hr {
border-color: #D5DCE4;
margin-bottom:40px;}
/* Container for the entire accordion section */
.acc-container {
  width: 100%;
}

/* Individual accordion item */
.acc {
  border: 1px solid var(--Violet-500, #D5DCE4);
  border-radius: 10px;
  background: var(--White, #FFF);
  margin-bottom: 20px;
  overflow: hidden; /* Ensures smooth expansion with the border */
  transition: all 0.3s ease; /* Smooth transition for active state */
}

/* Accordion header */
.acc-head {
  position: relative;
  cursor: pointer;
  padding: 20px;
  color: var(--Black, #000);
font-family: "F37 Zagma Trial";
font-size: 18px;
font-style: normal;
font-weight: 350;
line-height: 30px; /* 166.667% */
  transition: all 0.3s ease; /* Smooth transition for hover */
}
.faq-header{
  font-size: 18px;
  font-weight: 600;
  line-height: 30px;
  color: var(--Dark-Grey, #262626);}
/* Styling for the accordion content */
.acc-content {
  display: none;
  padding: 0px 20px 20px 20px;
color: var(--Medium-Grey, #3E484A);
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 28px; /* 175% */
}

/* Icon before (vertical bar of plus sign) */
.acc-head::before, .acc-head::after {
  content: '';
  position: absolute;
  background-color: #4744D1; /* Default color of icon */
  transition: all 0.3s ease; /* Smooth transition for rotation */
}

.acc-head::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 30px;
  transform: translateY(-50%);
  width: 30px;
  height: 30px;
  /* inline SVG as data-URI – no external file needed */
  background: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'>\
<path d='M4.9612 10.586C5.04827 10.4988 5.15166 10.4297 5.26547 10.3825C5.37928 10.3353 5.50128 10.311 5.62448 10.311C5.74768 10.311 5.86967 10.3353 5.98349 10.3825C6.0973 10.4297 6.20069 10.4988 6.28776 10.586L14.9995 19.2989L23.7112 10.586C23.8871 10.4101 24.1257 10.3112 24.3745 10.3112C24.6233 10.3112 24.8618 10.4101 25.0378 10.586C25.2137 10.7619 25.3125 11.0005 25.3125 11.2493C25.3125 11.498 25.2137 11.7366 25.0378 11.9125L15.6628 21.2875C15.5757 21.3747 15.4723 21.4439 15.3585 21.491C15.2447 21.5382 15.1227 21.5625 14.9995 21.5625C14.8763 21.5625 14.7543 21.5382 14.6405 21.491C14.5267 21.4439 14.4233 21.3747 14.3362 21.2875L4.9612 11.9125C4.87403 11.8255 4.80488 11.7221 4.7577 11.6083C4.71052 11.4945 4.68624 11.3725 4.68624 11.2493C4.68624 11.1261 4.71052 11.0041 4.7577 10.8903C4.80488 10.7764 4.87403 10.673 4.9612 10.586Z' fill='black'/>\
</svg>") no-repeat center/contain;
   transform: translateY(-50%);
  transform-origin: center center;
  transition: transform .3s ease;
}

.acc.active .acc-head::before {
  transform: translateY(-50%) rotate(180deg);
}

/* Active state: Change horizontal bar color */
.acc.active .acc-head::after {
  
}

/* Active accordion: Change the border and background color */
.acc.active {
  
  background: #F0F3F7;
}
.acc:hover {
  border: 1px solid var(--Orange, #000); /* Active state border */

}

/* Active accordion head styling */
.acc-head.active {
  border-radius: 12px;
  border: 1px solid var(--Orange, #000); /* Active state border for the header */
  background: var(--White, #FFF); /* Background for active header */
}
.acc.active .acc-head {
  border-bottom: 1px solid #D5DCE4; /* or your desired colour */
  margin-bottom: 20px;
}


/*--------------------------------------------------------------
## Netbook
--------------------------------------------------------------*/
@media only screen and (max-width: 1024px) {

}
/*--------------------------------------------------------------
## iPad Pro
--------------------------------------------------------------*/
@media only screen and (max-width: 960px) {
  .acc-head, .faq-header {
    color: var(--Dark-Grey, #262626);

    font-size: 18px;
    font-weight: 600;
    line-height: 30px;
    padding-right: 30px;
}
}
/*--------------------------------------------------------------
## iPad
--------------------------------------------------------------*/
@media only screen and (max-width: 834px) {
.acc-container {
    padding: 0 20px;
    width: 100%;
}
}
/*--------------------------------------------------------------
## iPad sm
--------------------------------------------------------------*/
@media only screen and (max-width: 768px) {

}

/*--------------------------------------------------------------
## iPhone
--------------------------------------------------------------*/
@media only screen and (max-width: 480px) {
.acc-container {
    padding: 0 0px;
    width: 100%;
}
  .acc-head, .faq-header {
    color: var(--Dark-Grey, #262626);
   
    font-size: 18px;
    font-weight: 600;
    line-height: 30px;
    padding-right: 30px;
}
}
/*--------------------------------------------------------------
## iPhone sm
--------------------------------------------------------------*/
@media only screen and (max-width: 375px) {

}