﻿:root {
   
   --darkPurple: #401E46;
   --red: #EB5970;
   
}


* {margin:0; padding:0; outline:none; border:none; box-sizing:border-box; -moz-box-sizing:border-box;}

b, strong   {font-weight: bold}

/* GLOBAL */

html 	{}
body 	{line-height:1; background: #401E46; color: var(--darkPurple); font-weight: 300; font-family: 'Gill Sans', Helvetica, Arial, "sans-serif"; background: #401E46; background: linear-gradient(120deg,rgba(64, 30, 70, 1) 30%, rgba(235, 89, 112, 1) 70%, rgba(235, 89, 112, 1) 100%); background-repeat: no-repeat;}

h1		{font-weight: 600}
h2		{font-weight: 600; font-size: 35px;}
h3		{font-weight: 600; font-size: 30px;}
h4		{font-weight: 600; font-size: 28px;}
h5		{font-weight: 600; font-size: 26px;}
h6		{font-weight: 600; font-size: 24px;}

p		{font-size: 20px; line-height: 1.4em; margin-bottom: 1em}


ul,
ol		{}

img     {max-width:100%; height:auto;}

a       {color:inherit;}
a.cover {position:absolute; left:0; top:0; width:100%; height:100%; background-color:rgba(0,0,0,0); display:block;}
.inner  {max-width:1642px; width:calc(100% - 40px); margin:0 auto; }

.cols {display: flex; width: 100%;}

/* HEADER */
header 			{padding: 90px 0 0 0}
header .inner 	{border-bottom: 1px solid #ffffff; padding-bottom: 40px; display: flex; justify-content: space-between; align-items: center}

header .logo    {width:328px; height: auto; font-size: 0}

/* NAV */
nav		         {}
nav ul	         {font-size: 30px; display: flex; gap: 50px; font-weight: 400}
nav ul li a       {color: #ffffff; text-decoration: none}
nav ul li a:hover {color: var(--red);}

.hamburger        {display: none}

main                    {position: relative; overflow: hidden}

img.graphic-dk          {position: absolute; top: 0; left: 50%; margin-left: -880px; max-width: unset}

/* HERO CONTAINER */
.hero-container         {margin: 100px 0 0 0; position: relative; height: 660px;}
.hero-container h1      {font-size: 90px; font-weight: 600; color: #ffffff; margin-bottom: 0.4em}
.hero-container h1 span {color: var(--red);}
.hero-container p       {font-size: 40px; color: #ffffff;}
.hero-container .inner  {position: relative; z-index: 10}
.hero-text              {width: 900px; max-width: 100%;}

.text-page .hero-container  {height:auto; padding-bottom: 100px;  }


.hero-container img     {}

.hero-tags-container    {display: flex; gap: 20px; margin-top: 40px;}
.hero-tag               {font-size: 25px; font-weight: 400; color: #ffffff; border-radius: 10px; background-color: rgba(207,199,209,0.3); display: inline-block; padding: 10px 15px;}                  

/* CONTAINERS */
.parent-inner           {position: relative; z-index: 10}

.full-image-container-section,
.purple-container,
.grey-container,
.white-container        {border-radius: 20px 20px 0 0; background-color: #ffffff; padding: 80px; margin-bottom: -20px;}

.grey-container         {background-color: #EDEDED}

/* SECTION TWO COL */
.two-col .cols               {display: flex; gap: 57px;}
.two-col .col:first-child    {flex: 1 1 820px}
.two-col .col:last-child     {flex: 1 1 588px}

.two-col .col:first-child p      {font-weight: 600; font-size: 33px;}
.two-col .col:first-child .btn   {margin-top: 0.5em}
.two-col p strong {font-weight: 400}

.two-col .read-more  {display: none}

/* MAP CONTAINER */
.section-intro h2 {font-size: 35px; color: var(--red); font-weight: 600; margin-bottom: 0.5em}
.section-intro p  {font-size: 25px; font-weight: 400}

.map-container    {position: relative;}
.map-controls     {position: absolute; right: 0; top: 0; display: flex; gap: 15px;}
.map              {position: relative;}
.map .jurisdiction-vector-map {width: 100%; aspect-ratio: 1517.056 / 700.77; height: auto;}
.map .jvm-marker {width: 40px; height: 50px;}

.map-popup        {width: 426px; border-radius: 13px; background-color: #ffffff; box-shadow: 0 6px 20px rgba(0,0,0,0.29); overflow: hidden; position: absolute; right: 100px; top: 50%; transform: translateY(-50%); display: none; z-index: 3;}

.popup-heading    {background: linear-gradient(160deg,rgba(64, 30, 70, 1) 30%, rgba(235, 89, 112, 1) 100%); padding: 20px 25px; color: #ffffff; position: relative;}
.popup-heading h3 {font-size: 25px; font-weight: 600; padding-right: 20px;}

.close            {width: 17px; height: 16px; background-image: url(/_uploads/_assets/icon-close-white.svg); background-size: cover; position: absolute; right: 20px; top: 25px; cursor: pointer}

.popup-text       {padding: 25px 25px 35px;}
.popup-text p     {font-size: 20px; font-weight: 300}
.popup-text .btn  {margin-top: 15px;}

img.jusrisdiction-logo {max-width: 240px; margin: 10px 0 20px 0;}


button.zoom          {width: 55px; height: 55px; display: inline-flex; justify-content: center; align-items: center; background-color: var(--red);}
button.zoom:hover    {background-color: var(--darkPurple);}

/* JURISDICTION LIST */
.accordion .accordion-item								      {border-bottom: 2px solid var(--darkPurple);}
.accordion .accordion-item h3							      {font-size:20px; font-weight: 600; position: relative; cursor: pointer; line-height: 1.4em; padding: 10px 40px 10px 20px;}
.accordion .accordion-item h3 span.plus 				   {width:16px; height: 14px; position:absolute; right:15px; display: block; top:15px; background-image: url(/_uploads/_assets/accordion-triangle.svg); background-size: cover; background-repeat: no-repeat;}
.accordion .accordion-item.active h3					   {background-color: var(--darkPurple); color: var(--red);}
.accordion .accordion-expanded							   {display:none; padding:20px; background-color: var(--darkPurple);}
.accordion .accordion-expanded p                      {color: #ffffff}
.accordion .accordion-expanded p:last-child				{margin-bottom:0;}

.accordion                                            {border: 2px solid var(--darkPurple);}
.accordion .accordion-item:last-child                 {border: none}
.accordion .accordion-item.active h3 span.plus        {background-image: url(/_uploads/_assets/accordion-triangle-white.svg); transform: rotate(180deg)}

/* CAROUSEL */
.purple-container                   {background-color: var(--darkPurple);}
.purple-container .section-intro p  {color: #ffffff;}

.section-intro       {display: flex; justify-content: space-between; align-items: flex-start; gap: 100px;}
.section-intro .btn  {flex-shrink: 0}

.listing-card  {font-size: 0; position: relative; cursor: pointer; perspective: 1200px; height: 100%; backface-visibility: hidden}
.lcf-top       {padding: 30px;}
.lcf-top h3    {font-size: 25px; font-weight: 600; line-height: 1.2em; margin-bottom: 0.6em;}
.lcf-top p     {font-size: 19px; margin-bottom: 0; color: #9F8EA2; font-weight: 600; line-height: 1.3em;}
.lcf-top p.emailAddress {word-wrap: anywhere;line-height: 1em;margin-top: 3px;margin-bottom: 7px;}



.lcf-top p.region        {display: flex; align-items: center; gap: 12px; font-weight: 400; color: var(--darkPurple); font-size: 20px;}
.company-logo  {width: 110px; margin: 20px 0;}
.lc-front      {background-color: #ffffff; display: flex; flex-direction: column; justify-content: space-between; position: relative; z-index: 5}
.lcf-image     {width: 100%; height: auto; position: relative; aspect-ratio: 1 / 1;}
.lcf-image img {position: absolute; width: 100%; height: 100%; object-fit: cover; object-position: center}
.lcf-top .flag {
    width: 32px;
    height: 32px;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-color: #fff;
    border-radius: 100%;
}


.lc-front,
.lc-back       {height: 100%; backface-visibility: hidden; transform-style: preserve-3d; transition: transform 1s cubic-bezier(0.4, 0, 0.2, 1); will-change: transform;}
.lc-front      {position: relative; transform: rotateY(0deg);}
.lc-back       {position: absolute; inset: 0; background-color: #EDEDED; padding: 28px; transform: rotateY(-180deg); display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; gap: 20px;}
.lc-back p     {font-weight: 400}
.lc-back-inner {width: 100%; flex: 1 1 0; min-height: 0; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch;}
.lc-back > .btn {flex-shrink: 0;}

.listing-card:hover .lc-front,
.listing-card:focus-within .lc-front {transform: rotateY(180deg);}
.listing-card:hover .lc-back,
.listing-card:focus-within .lc-back  {transform: rotateY(0deg); z-index: 10}


.card-carousel-container      {margin-top: 0;}
.card-carousel                {width: calc(100% + 24px);}
.card-carousel .slick-track   {margin: 0; display: flex;}
.card-carousel .slide         {margin-right: 24px; padding: 30px 0; height: auto; min-height: unset;}

.carousel-nav                    {display: inline-flex; position: relative;}
.carousel-nav ul                 {display: flex; font-size: 0; gap:14px; padding: 0 30px;}
.carousel-nav ul li              {width: 10px; height: 10px; border-radius: 10px; background-color: #ffffff;}
.carousel-nav ul li.slick-active {background-color: var(--red);}
.carousel-nav .slick-arrow       {font-size: 0; background-image: url(/_uploads/_assets/icon-triangle-red.svg); width: 13px; height: 16px; top: -3px; background-size: cover; background-color: transparent; position: absolute;}
.carousel-nav .slick-prev        {left: 0; transform: rotate(180deg);}
.carousel-nav .slick-next        {right: 0;}

@media (prefers-reduced-motion: reduce) {
   .lc-front,
   .lc-back {transition-duration: 0.01ms;}
}

/* FULL IMAGE CONTAINER SECTION */
.full-image-container-section          {overflow: hidden; background-size: cover; min-height: 390px; background-position: bottom center; position: relative;}
.full-image-container-section .inner   {display: flex; justify-content: center; align-items: center; text-align: center; position: relative; z-index: 5}
.full-image-container-section:after    {position: absolute; width: 100%; height: 70%; left: 0; top: 0; background: linear-gradient(#000000, #ffffff); content: ''; mix-blend-mode: multiply; opacity: 0.5}
.full-image-container-section h2       {font-size: 50px; color: #ffffff; font-weight: 600; margin-bottom: 20px;}

/* LISTING CONTAINER */
.listing-container   {margin-bottom: 0}
.filter-container    {display: block;}
.filter-container h2 {color: var(--darkPurple);}
.filter-container .cols {justify-content: space-between; margin-top: 35px; gap: 20px;}

.listing-grid        {padding-top: 50px;}
.listing-grid .cols	{gap: 25px; flex-wrap: wrap}
.listing-grid .col	{flex: 0 0 calc((100% - (3 * 25px)) / 4)}

.listing-grid .listing-card .lc-front   {box-shadow: 0 0 15px rgba(0,0,0,0.15);}

.selected-filters    {display: flex; align-items: center; gap: 10px; margin-top: 40px;}
.selected-filters p  {font-size: 25px; font-weight: 400; margin-bottom: 0;}
.filter-btn          {font-size: 25px; padding: 10px; background-color: #E7E3E8; font-weight: 400; display: inline-flex; align-items: center; gap: 8px; cursor: pointer}
.filter-btn:before   {width: 17px; height: 16px; background-image: url(/_uploads/_assets/icon-close.svg); background-size: cover; content: '';}
.members-listing .selected-filters {display: none; flex-wrap: wrap;}
.members-listing .selected-filters.is-active {display: flex;}
.members-listing .no-results {padding-top: 50px;}

/* CONTACT */
.contact-section h2                  {color: var(--darkPurple);}
.contact-section .cols               {display: flex; justify-content: space-between; gap: 50px; margin-top: 20px;}
.contact-section .col:first-child    {flex: 1 1 547px}
.contact-section .col:last-child     {flex: 1 1 766px}

/* TEXT PAGE */
.text-page-section h2               {font-size:35px; font-weight: 600; margin-bottom: 0.75em; margin-top: 1em}
.text-page-section .inner > h2:first-child {margin-top: 0}

.text-page-section ul,
.text-page-section ol               {margin: 1em; font-weight: 300; font-size: 20px;}
.text-page-section ol li,
.text-page-section ul li            {margin-bottom: 0.75em}

.text-page-section p a,             
.text-page-section strong           {font-weight: 600;}           

.hero-container.text-page-hero      {height: 230px;}

/* FOOTER */
footer	      {background-color: var(--darkPurple); padding: 55px 0}
footer .inner  {display: flex; justify-content: space-between; align-items: center}
footer ul      {font-size: 25px; font-weight: 400}

/* BUTTONS */
.btn	        {position: relative; font-size: 25px; font-weight: 600; color: #ffffff; padding: 14px 25px; text-decoration: none; display: inline-flex; align-items: center; gap: 12px; background-color: var(--darkPurple)}
.btn span     {position: relative; z-index: 5;}
.btn:before   {position: absolute; inset: 0; content: ''; background: #401E46; background: linear-gradient(160deg,rgba(64, 30, 70, 1) 30%, rgba(235, 89, 112, 1) 100%); transition: 0.3s ease-out;}
.btn:after    {width: 17px; height: 20px; background-image: url(/_uploads/_assets/icon-triangle.svg); content: ''; background-size: cover; display: block; z-index: 6; transition: 0.3s ease-out}

.btn:hover:before {opacity: 0}
.btn:hover:after  {transform: translateX(5px);}

.btn.plain        {background-color: var(--red); border:1px solid var(--red);}
.btn.plain:hover  {background-color: var(--darkPurple); border:1px solid var(--darkPurple);}
.btn.plain:before {display: none;}

.read-more                    {font-weight: 300; font-size: 20px; text-decoration: none; align-items: center; gap: 7px;}
.read-more span               {width: 20px; height: 20px; border-radius: 20px; flex-shrink: 0; border:1px solid var(--darkPurple); position: relative;}
.read-more span:before        {width: 1px; background-color: var(--darkPurple); height: 10px; left: 50%; margin-left: -0.5px; top: 4px; position: absolute; content: '';}
.read-more span:after         {width: 1px; background-color: var(--darkPurple); height: 10px; left: 50%; margin-left: -0.5px; top: 4px; position: absolute; content: ''; transform: rotate(90deg);}
.read-more.active span:before {opacity: 0;}

/* FORM STYLES */
.form-container		{width: 100%;}
.form-row				{margin-bottom: 20px;}
.form-cell				{}

.form-container .btn {margin-top: 15px;}

textarea,
input[type="text"]		{font-size: 25px; font-weight: 400; padding: 19px 10px; border-bottom: 2px solid var(--darkPurple); width: 100%;}

input[type="password"]	{}
input[type="submit"]	   {}
textarea				      {height: 200px;}


.form-cell.error textarea,
.form-cell.error input[type="text"] {background-color: #ffeaea;}
.form-field-error {color: red; margin-top: 9px;}

/* SELECT CSS */
.select-dropdown-native   {position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;}
.select-dropdown-ui       {max-width: 536px; width: 100%; position: relative; color: #806D84; font-size: 23px; font-weight: 400; line-height: 1.25; z-index: 20;}
.select-dropdown-trigger  {width: 100%; min-height: 62px; position: relative; display: flex; align-items: center; padding: 12px 88px 12px 15px; border: 2px solid var(--darkPurple); background-color: #ffffff; color: inherit; font: inherit; text-align: left; cursor: pointer;}
.select-dropdown-trigger:focus-visible {outline: 3px solid var(--red); outline-offset: 3px;}
.select-dropdown-arrow    {width: 72px; position: absolute; top: -2px; right: -2px; bottom: -2px; display: flex; align-items: center; justify-content: center; background-color: var(--darkPurple);}
.select-dropdown-arrow:before {width: 0; height: 0; border-left: 12px solid transparent; border-right: 12px solid transparent; border-top: 20px solid #ffffff; content: ''; transition: transform 0.2s ease-out;}
.select-dropdown-ui.is-open .select-dropdown-arrow:before {transform: rotate(180deg);}
.select-dropdown-options  {width: calc(100% - 70px); position: absolute; top: 100%; left: 0; z-index: 10; margin: -2px 0 0; padding: 0; border: 2px solid var(--darkPurple); background-color: #ffffff; list-style: none; max-height: 310px; overflow-y: scroll;}
.select-dropdown-options[hidden] {display: none;}
.select-dropdown-options li {min-height: 38px; display: flex; align-items: center; padding: 1px 15px; color: #806D84; cursor: pointer;}
.select-dropdown-options li:hover,
.select-dropdown-options li:focus {background-color: #EDEAED; color: var(--darkPurple); outline: none;}

@media (prefers-reduced-motion: reduce) {
   .select-dropdown-arrow:before {transition: none;}
}

/* LEGACY COOKIE BAR */
.cookieBar              {width: 100%; background-color:rgba(0,0,0,0.5); position: fixed; bottom: 0px; left: 0px; text-align: center; padding: 10px 10px; z-index: 99999999;}
.cookieBar p			{color:#ffffff; font-size:14px; font-family:inherit; line-height:1.5em; text-align:center; display:inline-block;}
.cookieBar .acceptBtn   {background:#000; border:1px solid #DEDEDE; font-weight:bold; display:inline-block; margin-top:6px; margin-left:5px; font-family:inherit; font-size:12px; padding:5px 10px; text-decoration:none; color:#FFF; text-transform:uppercase; }
