/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */

 /* Start of Professionals Gallery */
 .thumb-wrap {
	height: 100%; 	position: absolute;
	top:0px;
}
.thumb-bg {
	position: absolute;
	top:0px;
}
.thumb-title-wrap {   
	position: absolute;
	top:0px;
	width: 100%;
	margin-top: 70px;
}
.progallery-header h1 {
	font-size: 48px;
	font-weight: bold;
	letter-spacing: -1.5px;
	color: white;
	line-height: 45px;
	margin-bottom: 0px;
	text-transform: inherit;
	text-shadow: 1px 1px 6px rgba(0, 0, 0, 0.75);
} 
@media screen and (max-width: 767px) {
	.progallery-header h1 {
		font-size: 32px !important;
		line-height: 30px !important;
	}
	
	.professional-banner { 
        background-position: 75% 0 !important;
    }
}

.mobilefilter {
	display: none;
	float:left;
	margin-left: 10px;
}
.flip-wrap {
	background-color: rgba(0,0,0,0.25);
}
.element img {
	height: 100%;
}
/* Style the list */
ul.tab {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

/* Float the list items side by side */
ul.tab li {float: left; width: auto; text-align: center;}

/* Style the links inside the list items */
ul.tab li a {
    display: inline-block;
    color: black;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    transition: 0.3s;
    font-size: 17px;
}

/* Change background color of links on hover */
ul.tab li a:hover {
	background-color: #efefef;
}

/* Create an active/current tablink class */
ul.tab li a:focus, .active {
	background-color: #ffffff;
}

@media screen and (max-width: 980px) {
	ul.tab {
		width: 100% !important;
	}
	.portfolio {
		margin-top:10px;
	} 
	/* Practice Areas (the .filtertabs) are now shown by default on mobile
	   instead of hidden behind the .mobilefilter button -- they were the
	   only advanced filter not visible up front. Font size and padding are
	   trimmed down from the desktop tab styling (ul.tab li a, 17px/14px 16px)
	   since showing all of them at once made each bubble quite large. */
	.filtertabs {
		display: block;
		float: left;
		width: 100% !important;
		border-bottom: 1px solid #888;
		margin-bottom: 0px;
	}
	.filtertabs:last-child {
		border-bottom: none !important;
	}
	.filtertabs a {
		width: 100% !important;
		padding: 6px 0px !important;
		font-size: 13px;
	}
	.mobilefilter {
		display: block;
	}

}

.hover-name {
    font: 400 18px "Montserrat","Open Sans","Arial",sans-serif;    
	color: white;
    letter-spacing: 0px;
    text-transform: uppercase;
}
.hover-title {
    font: 400 14px "Montserrat","Open Sans","Arial",sans-serif;
    color: white;
}

.phonenumber {
    font: 400 14px "Montserrat","Open Sans","Arial",sans-serif;
    color: white;
	width: 300px;
	margin: 0 auto;
    float: left;
	text-align: center;
	display: none;
	margin-top: 15px;
}

.proname {
	position: absolute;
    top: 160px;
    left: 10px;
    font: 400 18px "Montserrat","Open Sans","Arial",sans-serif;
	text-shadow: 1px 1px 6px black;
    color: white;
    letter-spacing: 0px;
    text-transform: uppercase;
		width: 500px;
	    /*background-color: rgba(0,0,0,0.5);*/
		/*padding-left: 3px; padding-right: 3px;*/
}

.protitle {
    font: 400 14px "Montserrat","Open Sans","Arial",sans-serif;

    color: white;	
	position: absolute;
    top: 182px;
    left: 10px;	text-shadow: 1px 1px 6px black;
	    /*background-color: rgba(0,0,0,0.5);*/
		/*padding-left: 3px; padding-right: 3px;*/
}

@media screen and (max-width: 1279px) and (min-width:961px) {
	.proname {
		position: absolute;
		top: 120px;
		left: 10px;
		font: 400 18px "Montserrat","Open Sans","Arial",sans-serif;
		color: white;
		letter-spacing: 0px;
		text-transform: uppercase;
	}

	.protitle {
		font: 400 14px "Montserrat","Open Sans","Arial",sans-serif;
		color: white;	
		position: absolute;
		top: 142px;
		left: 10px;
	}
	.thumb-title-wrap {
		margin-top: 60px;
	}
}

@media screen and (max-width: 960px) and (min-width: 768px) {
	.proname {
		position: absolute;
		top: 90px;
		left: 10px;
		font: 400 14px "Montserrat","Open Sans","Arial",sans-serif;
		color: white;
		letter-spacing: 0px;
		text-transform: uppercase;
	}

	.protitle {
		font: 400 12px "Montserrat","Open Sans","Arial",sans-serif;
		color: white;	
		position: absolute;
		top: 108px;
		left: 10px;
	}
	.thumb-title-wrap {
		margin-top: 40px;
	}
}



@media screen and (max-width: 767px) and (min-width: 690px) {
	.proname {
		position: absolute;
		top: 110px;
		left: 10px;
		font: 400 14px "Montserrat","Open Sans","Arial",sans-serif;
		color: white;
		letter-spacing: 0px;
		text-transform: uppercase;
	}

	.protitle {
		font: 400 12px "Montserrat","Open Sans","Arial",sans-serif;
		color: white;	
		position: absolute;
		top: 132px;
		left: 10px;
	}
	.thumb-title-wrap {
		margin-top: 60px;
	}
}
@media screen and (max-width: 689px) and (min-width: 620px) {
	.proname {
		position: absolute;
		top: 95px;
		left: 7px;
		font: 400 13px "Montserrat","Open Sans","Arial",sans-serif;
		color: white;
		letter-spacing: 0px;
		text-transform: uppercase;
	}

	.protitle {
		font: 400 11px "Montserrat","Open Sans","Arial",sans-serif;
		color: white;	
		position: absolute;
		top: 117px;
		left: 7px;
	}
	.thumb-title-wrap {
		margin-top: 37px;
	}
}
@media screen and (max-width: 619px) and (min-width: 525px) {
	.proname {
		position: absolute;
		top: 80px;
		left: 5px;
		font: 400 11px "Montserrat","Open Sans","Arial",sans-serif;
		color: white;
		letter-spacing: 0px;
		text-transform: uppercase;
	}

	.protitle {
		font: 400 10px "Montserrat","Open Sans","Arial",sans-serif;
		color: white;	
		position: absolute;
		top: 97px;
		left: 5px;
	}
	.thumb-title-wrap {
		margin-top: 30px;
	}
}
@media screen and (max-width: 524px) and (min-width: 480px) {
	.proname {
		position: absolute;
		top: 70px;
		left: 5px;
		font: 400 11px "Montserrat","Open Sans","Arial",sans-serif;
		color: white;
		letter-spacing: 0px;
		text-transform: uppercase;
	}

	.protitle {
		font: 400 10px "Montserrat","Open Sans","Arial",sans-serif;
		color: white;	
		position: absolute;
		top: 87px;
		left: 5px;
	}
	.thumb-title-wrap {
		margin-top: 20px;
	}
}
@media screen and (max-width: 767px) and (min-width: 480px) {
	.pro-gallery-row.be-wrap {
		max-width: 90% !important;
		margin-left: 5% !important;
		margin-right: 5% !important;
	}
	.pro-gallery .be-custom-column-pad {
		padding: 20px !important;
	}
}



@media screen and (max-width: 479px) and (min-width: 440px) {
	.proname {
		position: absolute;
		top: 140px;
		left: 10px;
		font: 400 18px "Montserrat","Open Sans","Arial",sans-serif;
		color: white;
		letter-spacing: 0px;
		text-transform: uppercase;
	}

	.protitle {
		font: 400 14px "Montserrat","Open Sans","Arial",sans-serif;
		color: white;	
		position: absolute;
		top: 162px;
		left: 10px;
	}
	.thumb-title-wrap {
		margin-top: 70px;
	}
}
@media screen and (max-width: 439px) and (min-width: 400px) {
	.proname {
		position: absolute;
		top: 120px;
		left: 10px;
		font: 400 16px "Montserrat","Open Sans","Arial",sans-serif;
		color: white;
		letter-spacing: 0px;
		text-transform: uppercase;
	}

	.protitle {
		font: 400 13px "Montserrat","Open Sans","Arial",sans-serif;
		color: white;	
		position: absolute;
		top: 142px;
		left: 10px;
	}
	.thumb-title-wrap {
		margin-top: 60px;
	}
}
@media screen and (max-width: 399px) and (min-width: 360px) {
	.proname {
		position: absolute;
		top: 105px;
		left: 7px;
		font: 400 13px "Montserrat","Open Sans","Arial",sans-serif;
		color: white;
		letter-spacing: 0px;
		text-transform: uppercase;
	}

	.protitle {
		font: 400 11px "Montserrat","Open Sans","Arial",sans-serif;
		color: white;	
		position: absolute;
		top: 127px;
		left: 7px;
	}
	.thumb-title-wrap {
		margin-top: 45px;
	}
}
@media screen and (max-width: 359px) and (min-width: 320px) {
	.proname {
		position: absolute;
		top: 90px;
		left: 5px;
		font: 400 12px "Montserrat","Open Sans","Arial",sans-serif;
		color: white;
		letter-spacing: 0px;
		text-transform: uppercase;
	}

	.protitle {
		font: 400 10px "Montserrat","Open Sans","Arial",sans-serif;
		color: white;	
		position: absolute;
		top: 106px;
		left: 5px;
	}
	.thumb-title-wrap {
		margin-top: 30px;
	}
}
@media screen and (max-width: 319px) {
	.proname {
		position: absolute;
		top: 70px;
		left: 5px;
		font: 400 10px "Montserrat","Open Sans","Arial",sans-serif;
		color: white;
		letter-spacing: 0px;
		text-transform: uppercase;
	}

	.protitle {
		font: 400 9px "Montserrat","Open Sans","Arial",sans-serif;
		color: white;	
		position: absolute;
		top: 82px;
		left: 5px;
	}
	.thumb-title-wrap {
		margin-top: 25px;
	}
}
@media screen and (max-width: 479px) {
	.pro-gallery-row.be-wrap {
		max-width: 90% !important;
		margin-left: 5% !important;
		margin-right: 5% !important;
	}
	#bottom-widgets-wrap.be-wrap.be-row {
		margin-left: 20px !important;
	}
	.practicearea-header-data {
		padding-left: 30px;
	}
	.practicearea-header-data h1 span {
		font-size: 32px !important;
		line-height: 30px !important;
	}
	.pro-gallery .be-custom-column-pad {
		padding: 20px !important;
	}
}

#instantsearch {
	color: black;
	border-color: #666;
	background-color: #d3d4d5;
	border-width: 1px;
}
/* End of Professionals Gallery */

/* Brand: keep POWER in all caps in page headers */
#page-header-bg h1 .pwr,
.pwr {
    text-transform: uppercase;
}

h1 .pwr {
    color: #FFFFFF !important;
    text-decoration: underline 3px !important;
    text-underline-offset: 8px !important;
}

/* Professionals listing hero: match site blue gradient overlay.
   Do not change .page-header-bg-image-wrap position — Salient uses absolute
   so the title container stays over the image. */
body:has(.professionals-listing-page) #page-header-bg .page-header-bg-image-wrap::after {
    content: "";
    position: absolute;
    inset: 0;
    background: #0C385E;
    background: linear-gradient(90deg, #0C385E 0%, rgba(255, 255, 255, 0.001) 100%);
    opacity: 0.8;
    pointer-events: none;
    /* Salient sets .page-header-bg-image to z-index: 9 */
    z-index: 10;
}

/* Professionals Listing Page (2026) */
.professionals-listing-page {
    font-family: "Calibri", "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #000;
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    box-sizing: border-box;
}

.professionals-listing-page #header-outer,
.professionals-listing-page #header-space {
    position: absolute;
}

.professionals-listing-content {
    max-width: none;
    width: 100%;
    margin: 0 auto;
    padding: 24px 72px 64px;
    box-sizing: border-box;
}

.professionals-listing-heading {
    margin: 0 0 40px;
    text-align: center;
    font-size: 48px;
    line-height: 1.1;
    font-weight: 700;
    color: #0a2947;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.professionals-listing-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    align-items: center;
    margin-bottom: 24px;
}

.professionals-filter-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 16px;
    border: 1px solid #8a8a8a;
    border-radius: 50px;
    background: #fff;
    color: #000;
    font-size: 16px;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
    white-space: nowrap;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.professionals-filter-pill:hover,
.professionals-filter-pill.is-active {
    background: #329bfc;
    border-color: #329bfc;
    color: #fff;
}

.professionals-listing-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    align-items: center;
    margin-bottom: 20px;
}

.professionals-search-box {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 0 1 404px;
    min-width: 220px;
    height: 40px;
    padding: 0 16px;
    border: 1px solid #8a8a8a;
    border-radius: 4px;
    background: #fff;
    box-sizing: border-box;
}

.professionals-search-box input {
    flex: 1;
    min-width: 0;
    width: 100%;
    height: 100%;
    padding: 0;
    border: none;
    border-radius: 0;
    font-size: 18px;
    color: #000;
    background: transparent;
    box-sizing: border-box;
}

.professionals-search-box input:focus {
    outline: none;
}

.professionals-search-box input::placeholder {
    color: #8a8a8a;
}

.professionals-search-box .search-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    color: #8a8a8a;
    pointer-events: none;
}

.professionals-search-box .search-icon svg {
    display: block;
    width: 24px;
    height: 24px;
}

.professionals-alphabet {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
    align-items: center;
    flex: 1 1 auto;
    justify-content: flex-end;
    min-width: 200px;
}

.professionals-alphabet button {
    border: none;
    background: transparent;
    padding: 0;
    font-size: 16px;
    line-height: 1.25;
    color: #000;
    cursor: pointer;
}

.professionals-alphabet button:hover,
.professionals-alphabet button.is-active {
    color: #329bfc;
    font-weight: 700;
}

.professionals-listing-controls-row {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    align-items: center;
    margin-bottom: 16px;
}

.professionals-select {
    position: relative;
    min-width: 90px;
}

.professionals-select select {
    appearance: none;
    height: 40px;
    padding: 8px 40px 8px 16px;
    border: 1px solid #8a8a8a;
    border-radius: 4px;
    background: #fff;
    font-size: 16px;
    color: #000;
    cursor: pointer;
}

.professionals-select::after {
    content: "";
    position: absolute;
    right: 14px;
    top: 50%;
    width: 8px;
    height: 8px;
    border-right: 2px solid #000;
    border-bottom: 2px solid #000;
    transform: translateY(-65%) rotate(45deg);
    pointer-events: none;
}

.professionals-active-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    flex: 1 1 auto;
}

.professionals-active-filter {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    border-radius: 50px;
    background: #329bfc;
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    border: none;
    cursor: pointer;
}

.professionals-active-filter .remove-icon {
    font-size: 18px;
    line-height: 1;
}

.professionals-listing-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    margin-bottom: 24px;
    font-size: 14px;
    color: #000;
}

.professionals-clear-filters {
    border: none;
    background: transparent;
    color: #000;
    text-decoration: underline;
    cursor: pointer;
    font-size: 14px;
    padding: 0;
}

.professionals-grid-2026 {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    align-items: start;
}

.professional-card-link-2026 {
    text-decoration: none;
    color: inherit;
    display: block;
    min-width: 0;
}

.professional-card-link-2026.is-hidden {
    display: none !important;
}

.professional-card-2026 {
    display: flex;
    align-items: stretch;
    width: 100%;
    border: 1px solid #022c45;
    border-radius: 14px;
    overflow: hidden;
    background: #fff;
    transition: box-shadow 0.2s ease;
}

.professional-card-2026:hover {
    box-shadow: 0 4px 12px rgba(2, 44, 69, 0.15);
}

.professional-card-2026__photo {
    position: relative;
    display: block;
    width: 160px;
    min-width: 160px;
    flex: 0 0 160px;
    align-self: stretch;
    overflow: hidden;
    background-color: #c8cdd2;
    background-size: cover;
    background-position: center top;
    background-repeat: no-repeat;
    text-decoration: none;
    line-height: 0;
    font-size: 0;
}

.professionals-listing-page .professional-card-2026__photo img,
.professional-card-2026__photo img {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    object-fit: cover !important;
    object-position: center top !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    display: block !important;
}

.professional-card-2026__body {
    display: flex;
    flex: 1;
    flex-direction: column;
    justify-content: center;
    gap: 0;
    padding: 16px 14px;
    min-width: 0;
}

.professionals-listing-page .professional-card-2026__name,
.professionals-listing-page .professional-card-2026__name a {
    margin: 0;
    font-family: Georgia, "Times New Roman", serif;
    font-size: var(--professional-name-size, 20px) !important;
    font-weight: 400;
    line-height: 1.15;
    color: #022c45;
    white-space: nowrap;
    overflow: hidden;
    max-width: 100%;
}

.professional-card-2026__name a {
    color: inherit;
    text-decoration: none;
    display: inline-block;
}

.professional-card-2026__name a:hover {
    text-decoration: underline;
}

.professional-card-2026__title {
    margin: 2px 0 0 !important;
    font-size: 15px;
    line-height: 1.3;
    color: #000;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    white-space: normal;
}

.professionals-listing-page .professional-card-2026__contact {
    display: block;
    margin: 0;
    font-size: var(--professional-contact-size, 15px) !important;
    line-height: 1.35;
    color: #022c45;
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.professional-card-2026__title + .professional-card-2026__contact {
    margin-top: -2px;
}

.professional-card-2026__contact:hover {
    text-decoration: underline;
}

.professional-card-2026__actions {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 22px;
    margin-top: 12px;
}

.professional-card-2026__actions a,
.professional-card-2026__actions button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    padding: 0;
    border: none;
    background: transparent;
    cursor: pointer;
    flex-shrink: 0;
    line-height: 0;
}

.professional-card-2026__actions img {
    display: block;
    width: 22px;
    height: 22px;
    object-fit: contain;
    margin: 0;
}

.professionals-listing-retired-heading {
    margin: 48px 0 24px;
    text-align: center;
    font-size: 32px;
    color: #0a2947;
}

.professionals-mobile-filter-toggle {
    display: none;
    border: none;
    background: transparent;
    padding: 0;
    cursor: pointer;
}

@media screen and (max-width: 1400px) {
    .professional-card-2026__photo {
        width: 140px;
        min-width: 140px;
        flex: 0 0 140px;
    }

    .professional-card-2026__body {
        padding: 16px 12px;
    }
}

@media screen and (max-width: 1270px) {
    .professionals-grid-2026 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media screen and (max-width: 768px) {
    .professionals-listing-content {
        padding-left: 32px;
        padding-right: 32px;
    }

    .professionals-listing-heading {
        font-size: 32px;
    }

    .professionals-mobile-filter-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    /* Practice Areas (the .professionals-filter-pill buttons) are the only
       advanced filter that isn't visible up front on mobile -- show them by
       default instead of hiding behind .professionals-mobile-filter-toggle.
       Pills shrink from the desktop 10px 16px/16px sizing since showing all
       of them at once made each bubble quite large. */
    .professionals-listing-filters {
        display: flex;
    }

    .professionals-listing-filters.is-open {
        display: flex;
    }

    .professionals-filter-pill {
        padding: 6px 12px;
        font-size: 13px;
    }

    .professionals-listing-toolbar {
        flex-direction: column;
        align-items: stretch;
    }

    .professionals-search-box {
        flex: 1 1 auto;
    }

    .professionals-alphabet {
        justify-content: flex-start;
    }

    .professionals-grid-2026 {
        grid-template-columns: 1fr;
    }

    .professional-card-2026__photo {
        width: 120px;
        min-width: 120px;
        flex: 0 0 120px;
    }

    .professional-card-2026__body {
        padding: 14px 12px;
    }
}

@media screen and (max-width: 420px) {
    .professionals-listing-content {
        padding-left: 20px;
        padding-right: 20px;
    }

    .professional-card-2026__photo {
        width: 104px;
        min-width: 104px;
        flex: 0 0 104px;
    }

    .professional-card-2026__body {
        padding: 12px 10px;
    }
}

/* Single Professional Page */
.professional-description p:first-child {
    color: #313a75 !important;
    font-size: 20px !important;
}

.profession-sidebar-title {
	color: #313a75 !important;
	margin-top: 15px !important;
	text-transform: uppercase;
}

.professional-banner {
    background-position: bottom;
    background-repeat: no-repeat; 
    background-attachment: scroll; 
}

.professional-header-data {
    position: absolute; 
    top: 450px;
    color: #fff !important;
}

.professional-header-data h1 {
    font-size: 42px;
    margin-bottom: 0;
}

.professional-header-data h3 {
    color: #f2af27;
}

.professional-contact-data {
    display: flex;
}

.professional-contact-data p {
    padding: 0 1em 1.5em 0;
}

.orpheus-portfolio-gallery .professional-info {
    position: absolute;
    z-index: 99;
    bottom: 0;
    padding: 10px 15px;
}

.orpheus-portfolio-gallery .professional-info h4, .orpheus-portfolio-gallery .professional-info p {
    color: #fff !important;
}

.orpheus-portfolio-gallery .professional-info h4 {
	letter-spacing: -1px !important;
}

ul.tab li {
    list-style: none;
}

.professional-hover-details {
    display: flex;
    justify-content: space-around;
}

.professional-hover-details .professional-phone:hover > i {
/*     background: red; */
}

.practice-area-overview:nth-child(2) {
    color: #104b7d !important;
}

.professional-text-group {
    padding: 10px;
    position: absolute;
    z-index: 1;
    display: flex;
    color: #fff;
    flex-direction: column;
    top: 50%;
}

.professional-text-group p:firstchild {
    text-transform: uppercase;
}

/* Practice Area Page */
.practice-area-page {
    font-family: "Open Sans", Arial, sans-serif;
}

.practice-area-page #header-outer,
.practice-area-page #header-space {
    position: absolute;
}

.practice-area-page .nectar-split-heading h1 {
    font-family: Helvetica, sans-serif;
    font-size: 67px;
    font-weight: 700;
    letter-spacing: normal;
    color: #fff;
    line-height: 77px;
    margin-bottom: 0;
    text-shadow: 2px 2px 8px #111;
}

.practice-area-page .first-section .row-bg-overlay {
    background: #0C385E;
    background: linear-gradient(90deg, #0C385E 0%, rgba(255, 255, 255, 0.001) 100%);
    opacity: 0.8;
}

.practice-area-page .nectar-split-heading h3,
.practice-area-page .nectar-split-heading h4 {
    font-family: "Open Sans", Arial, sans-serif;
}

.practice-area-page .practice-area-title-row .nectar-split-heading,
.practice-area-page .practice-area-title-row .nectar-split-heading h3,
.practice-area-page .practice-area-title-row .nectar-split-heading .heading-line {
    margin-bottom: 0;
}

.practice-area-page .practice-area-body-row {
    padding-top: 8px !important;
}

.practice-area-page .practice-area-sidebar .nectar-split-heading,
.practice-area-page .practice-area-sidebar .nectar-split-heading h4,
.practice-area-page .practice-area-sidebar .nectar-split-heading .heading-line,
.practice-area-page .practice-area-related .nectar-split-heading,
.practice-area-page .practice-area-related .nectar-split-heading h4,
.practice-area-page .practice-area-related .nectar-split-heading .heading-line {
    margin-bottom: 8px;
}

.practice-area-sidebar-list {
    list-style: disc;
    margin: 0 0 0 1.2em;
    padding: 0;
}

.practice-area-sidebar-list li {
    margin-bottom: 8px;
    line-height: 1.75;
    color: #0a2947;
}

.practice-area-sidebar-list li a {
    font-family: inherit;
    font-weight: 400;
    color: #6b7f94;
    text-decoration: underline;
}

.practice-area-sidebar-list li a:hover {
    color: #0a2947;
}

.practice-area-sidebar,
.practice-area-related {
    position: relative;
    container-type: inline-size;
}

.practice-area-sidebar-divider {
    height: 5vh;
    clear: both;
}

.practice-area-professionals-scroll {
    --practice-area-pro-card-gap: 10px;
    --practice-area-pro-card-width: 75cqi;
    --practice-area-pro-card-height: calc(var(--practice-area-pro-card-width) * 4 / 3);
    position: relative;
    clear: both;
    height: calc(var(--practice-area-pro-card-height) * 4 + var(--practice-area-pro-card-gap) * 3);
    max-height: calc(var(--practice-area-pro-card-height) * 4 + var(--practice-area-pro-card-gap) * 3);
    overflow-y: auto;
    overflow-x: hidden;
    margin-top: 8px;
    padding-right: 8px;
    -webkit-overflow-scrolling: touch;
}

.practice-area-professionals-scroll::-webkit-scrollbar {
    width: 6px;
}

.practice-area-professionals-scroll::-webkit-scrollbar-track {
    background: #e8e8e8;
}

.practice-area-professionals-scroll::-webkit-scrollbar-thumb {
    background: #999;
    border-radius: 3px;
}

.practice-area-pro-card {
    width: var(--practice-area-pro-card-width, 75%);
    aspect-ratio: 3 / 4;
    margin-bottom: var(--practice-area-pro-card-gap, 10px);
    flex-shrink: 0;
}

.practice-area-pro-card:last-child {
    margin-bottom: 0;
}

.practice-area-pro-link {
    display: block;
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    text-decoration: none;
    background-size: cover;
    background-position: center 15%;
    background-repeat: no-repeat;
}

.practice-area-pro-link::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.25) 60%, rgba(0, 0, 0, 0.65) 100%);
    pointer-events: none;
}

.practice-area-pro-caption {
    position: absolute;
    bottom: 10px;
    left: 10px;
    right: 10px;
    z-index: 2;
    display: flex;
    flex-direction: column;
    font-family: inherit;
    color: #fff;
    text-shadow: 2px 2px 6px rgba(0, 0, 0, 0.9), 0 0 10px rgba(0, 0, 0, 0.8);
    pointer-events: none;
}

.practice-area-pro-name {
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.75px;
    line-height: 1.25;
}

.practice-area-pro-title {
    font-size: 11px;
    font-weight: 400;
    letter-spacing: 0.75px;
    margin-top: 2px;
    line-height: 1.2;
}

.practice-area-content .wpb_wrapper p {
    line-height: 1.75;
    font-family: inherit;
    font-weight: 400;
    color: #000;
}

.practice-area-content .wpb_wrapper li {
    line-height: 1.75;
    font-family: inherit;
    font-weight: 400;
    color: #000;
    margin-bottom: 10px;
}

.practice-area-content .wpb_wrapper h4,
.practice-area-content .wpb_wrapper h5 {
    font-family: inherit;
    font-weight: 600;
    color: #02466e;
    margin-top: 1.25em;
    margin-bottom: 0.35em;
}

.practice-area-content .wpb_wrapper h4:first-child,
.practice-area-content .wpb_wrapper h5:first-child {
    margin-top: 0;
}

.practice-area-content .wpb_wrapper h4 + p,
.practice-area-content .wpb_wrapper h5 + p,
.practice-area-content .wpb_wrapper h4 + ul,
.practice-area-content .wpb_wrapper h5 + ul {
    margin-top: 0;
}

.practice-area-content .wpb_wrapper a {
    text-decoration: underline;
    color: inherit;
}

.practice-area-content .wpb_wrapper li a {
    text-decoration: underline;
}

.practice-area-content .nectar-button,
.practice-area-content .biotopdf-practicearea,
.practice-area-content .biotopdf-practicearea span {
    color: #fff !important;
}

.practice-area-content .nectar-button {
    margin-top: 20px;
}

@supports not (width: 1cqi) {
    .practice-area-pro-card {
        width: 75%;
        max-width: 150px;
    }

    .practice-area-professionals-scroll {
        --practice-area-pro-card-width: 150px;
        --practice-area-pro-card-height: 200px;
    }
}

@media screen and (max-width: 689px) {
    .practice-area-professionals-scroll {
        --practice-area-pro-card-width: 50cqi;
    }

    .practice-area-sidebar {
        margin-bottom: 30px;
    }
}

/* Homepage Recent News & Insights blog posts */
body.home .blog-recent[data-style="classic_enhanced"] .post-header h3.title {
    font-size: 18px !important;
    line-height: 32px !important;
    font-weight: 600;
    margin-bottom: 7px;
    letter-spacing: 0;
}

body.home .blog-recent[data-style="classic_enhanced"] .post-header .title a {
    font-size: 18px !important;
    line-height: 32px !important;
    font-weight: 600;
}

body.home .blog-recent[data-style="classic_enhanced"] .img-link {
    display: block;
}

body.home .blog-recent[data-style="classic_enhanced"] .post-featured-img {
    display: block;
    width: 100%;
    aspect-ratio: 550 / 403;
    overflow: hidden;
    background-color: #f4f4f4;
}

body.home .blog-recent[data-style="classic_enhanced"] .post-featured-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

@media screen and (max-width: 999px) {
    body.home .blog-recent[data-style="classic_enhanced"] .post-featured-img {
        background-size: cover !important;
        background-repeat: no-repeat !important;
    }
}

/* Tablet/phone heroes for the templates that overlay the header
   (.practice-area-page and the professionals listing both set #header-outer
   to position: absolute). The title has to clear the overlaid header, and the
   desktop type scale is far too large once the viewport gets narrow. */
@media screen and (max-width: 999px) {
    /* The 700px desktop hero height leaves the title stranded on a phone;
       let it size to the title and keep enough of the photo to read. */
    body:has(.professionals-listing-page) #page-header-wrap,
    body:has(.professionals-listing-page) #page-header-bg {
        height: auto !important;
        min-height: max(340px, calc(25vw + 180px)) !important;
    }

    body:has(.professionals-listing-page) #page-header-bg .container {
        padding-top: max(150px, 25vw);
        padding-bottom: max(48px, 12vw);
        box-sizing: border-box;
    }

    /* Salient centers the title by pairing top: 50% with a -50% transform.
       Its mobile styles drop the offset but keep the transform, which lifts
       the title above the top of the hero. */
    body:has(.professionals-listing-page) #page-header-bg .container .col,
    body:has(.professionals-listing-page) #page-header-bg .container .col > .inner-wrap {
        top: auto !important;
        transform: none !important;
    }

    body:has(.professionals-listing-page) #page-header-bg h1 {
        font-size: 44px !important;
        line-height: 1.15 !important;
    }

    /* This template's header is ~24px taller than the listing page's, so it
       needs a little more clearance to keep the same gap under the nav. */
    .practice-area-page .first-section {
        padding-top: max(170px, 25vw) !important;
    }

    .practice-area-page .nectar-split-heading h1 {
        font-size: 44px;
        line-height: 1.15;
    }
}

@media screen and (max-width: 689px) {
    /* Scale with the viewport so each pre-broken headline line keeps its own
       row instead of leaving a one-word orphan. */
    body:has(.professionals-listing-page) #page-header-bg h1 {
        font-size: clamp(22px, 7.6vw, 32px) !important;
    }

    .practice-area-page .nectar-split-heading h1 {
        font-size: clamp(22px, 7.6vw, 32px);
    }
}
