/*
 * Single Team Member (single-our-team.php)
 * Built to match the Amy C. Brown Figma (1920px canvas).
 * Tokens reused from style.css :root.
 */

.attorney-page {
    color: var(--color-body);
    font-family: var(--font-body);
    font-size: 16px;
    line-height: 1.7;
}

.attorney-page .attorney-rich-text ul,
.attorney-page .attorney-rich-text ol {
    list-style: disc outside;
    margin: 0 0 1em;
    padding-left: 22px;
}
.attorney-page .attorney-rich-text ol { list-style: decimal outside; }
.attorney-page .attorney-rich-text li { margin-bottom: 4px; }

.attorney-page .attorney-rich-text p { margin: 0 0 16px; }
.attorney-page .attorney-rich-text p:last-child { margin-bottom: 0; }
.attorney-page .attorney-rich-text strong,
.attorney-page .attorney-rich-text b { font-weight: 700; }

/* -----------------------------------------------------------
   1. Attorney banner
   ----------------------------------------------------------- */

.attorney-banner {
    background: var(--color-brand-navy);
    color: var(--color-white);
    position: relative;
}

/* Hero band — composite image (attorney photo + skyline in one asset) */
.attorney-banner-hero {
    position: relative;
    width: 100%;
    /* height: clamp(360px, 30.3vw, 582px); */
    min-height: clamp(420px, 40vw, 582px);
    background-color: var(--color-brand-navy);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    display: flex;
    align-items: flex-end;
}
.bg_left-center .attorney-banner-hero{
    background-position: left center;
}
.bg_right-center .attorney-banner-hero{
    background-position: right center;
}
.attorney-banner-hero-inner {
	max-width: 100%;
	padding-left: 100px;
}

.attorney-breadcrumbs {
	color: var(--color-white);
	font-weight: 400;
	line-height: 1.5;
	padding: 28px 0;
	max-width: 100%;
	word-break: break-word;
}
.attorney-breadcrumbs a {
    color: var(--color-white);
    text-decoration: none;
}
.attorney-breadcrumbs a:hover { text-decoration: underline; }
.attorney-breadcrumb-current { color: var(--color-white); }
.attorney-breadcrumb-sep {
    width: 7px;
    height: 8px;
    color: var(--color-white);
    flex-shrink: 0;
}

/* Dark band under the hero: name/blurb/contact */
.attorney-banner-band {
    background: var(--color-brand-navy);
    color: var(--color-white);
    position: relative;
    padding: 30px 0;
    overflow: hidden;
    display: flex; align-items: center;
    min-height: 204px;
}

.attorney-banner-band .container {
	width: 100%;
	max-width: 100%;
	padding-left: 100px;
	padding-right: 40px;
}

.attorney-banner-row {
	display: flex;
	align-items: stretch;
	position: relative;
	flex-wrap: wrap;
}

.attorney-banner-identity {
	display: flex;
	flex-direction: column;
	justify-content: center;
	/* padding: 22px 0; */
	max-width: 31.25%;
	width: 100%;
	padding: 0 30px 0 0;

    max-width: calc(54% - 300px);
}
.no-attorney-blurb .attorney-banner-identity{
    max-width: 50%;
}
.attorney-banner-name {
    color: var(--color-white);
    font-family: var(--font-heading);
    font-size: clamp(38px, 3.5vw, 66px);
    font-size: clamp(2rem, 1.0022rem + 2.0815vw, 3.5rem);
    font-weight: 400;
    line-height: 1.2;
    letter-spacing: 0;
    margin: 0;
}
.attorney-banner-role {
    font-family: var(--font-body);
    font-weight: 400;
    font-size: 16px;
    line-height: 1.7;
    color: var(--color-white);
    margin: 2px 0 0;
}

.attorney-banner-blurb {
	align-self: center;
	font-size: 16px;
	line-height: 1.7;
	color: var(--color-white);
	max-width: 28.4%;
    max-width: calc(46% - 300px);
	width: 100%;
	padding: 0 30px 0 0;
}
.attorney-banner-blurb-wrap {
	max-width: 452px;
	width: 100%;
}

/* Right teal contact box — fills the remaining grid column to the viewport edge */
.attorney-banner-contact {
	background: var(--color-brand-blue);
	padding: 0 0 0 4%;
	display: flex;
	gap: 48px;
	align-items: center;
	color: var(--color-white);
	grid-column: contact;
	align-self: stretch;
    max-width: 40.35%; width: 100%;
    position: relative; z-index: 0;

    padding: 0 0 0 40px;
    max-width: 600px;
}

.attorney-banner-contact::before {
	content: "";
	width: 100%;
	height: 21rem;
	position: absolute;
	background-color: var(--color-brand-blue);;
	z-index: -1;
	top: -6rem;
    left: 0;
}
.attorney-banner-contact::after {
	content: "";
	width: 150rem;
	height: 21rem;
	position: absolute;
	background-color: #045A83;
	z-index: -1;
	top: -6rem;
	left: 100%;
}
.attorney-banner-identity + .attorney-banner-contact{
    margin: 0 0 0 auto;
}
/* .attorney-banner-row:not(:has(.attorney-banner-blurb)) .attorney-banner-identity {
    background-color: red;
} */
.inner-banner-offices {
	display: flex;
	flex-direction: row;
	gap: 0;
	align-items: stretch;
	list-style: none;
	margin: 0;
	padding: 0;
	max-width: 100%;
	width: 100%;
}

.inner-banner-office {
	flex: 0 1 auto;
	max-width: 246px;
    max-width: 275px;
	width: 100%;
	min-width: 0;
	position: relative;
	padding: 0 0 0 0;
	color: var(--color-white);
	font-family: var(--font-body);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.7;
}

.inner-banner-office-name {
	font-weight: var(--fw-500);
	margin-bottom: 2px;
}
.inner-banner-office p {
	margin: 0;
	color: var(--color-white);
}
.inner-banner-office p strong,
.inner-banner-office p b {
    font-weight: var(--fw-700);
}
.inner-banner-office p a {
	color: var(--color-white);
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* -----------------------------------------------------------
   Section base — About / Areas / Education / Bar / Rep / Prior / Return
   ----------------------------------------------------------- */

.attorney-section {
    padding: 69px 0 0;
    background: var(--color-white);
}
.attorney-section.attorney-tabs {
    padding: 45px 0 0;
}
.attorney-section:last-of-type,
.attorney-section--return { padding-top: 42px; padding-bottom: 61px; }

.attorney-heading {
	color: var(--color-text-dark);
	margin: 0 0 clamp(35px, calc(18.369px + 2.168vw), 60px);
	padding-bottom: 35px;
	border-bottom: 1px solid #333;
}

.attorney-columns {
    display: block;
}
.attorney-columns--two {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px 100px;
    align-items: flex-start;
}
.attorney-column { min-width: 0; }

.attorney-tabs .attorney-heading{
    margin: 0 0 clamp(35px, calc(28.348px + 0.867vw), 45px);
}
/* -----------------------------------------------------------
   2. About section
   ----------------------------------------------------------- */

.attorney-section--about {
	padding: clamp(45px, calc(34.356px + 1.388vw), 61px) 0 22px;
}
.attorney-section-wrap {
	max-width: 1245px;
	width: 100%;
	margin: auto;
}
.attorney-about-row {
    display: grid;
    grid-template-columns: 420px 1fr;
    gap: 60px;
    align-items: flex-start;
}

.attorney-about-aside {
    display: flex;
    flex-direction: column;
    gap: 42px;
}
.attorney-about-photo {
	width: 100%;
	aspect-ratio: 495 / 715;
	overflow: hidden;
	/* background: #eee;
    background: #eee url(../images/team_member_photo_bg.jpg) no-repeat; 
    background-size: cover; background-position: center; */
    background: linear-gradient(180deg, #E8F2F8 0%, #76B5D0 100%);
}
.attorney-about-photo-img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center bottom;
    object-fit: cover;
}

.attorney-about-badges {
    display: block;
    max-width: 100px;
}
.attorney-about-badges-inner {
    display: block;
}

.attorney-badges-wrap {
	display: flex;
	align-items: flex-start;
	gap: 25px 65px;
}


/* Slick fade slider — one badge visible at a time.
   Pre-init the wrapper renders as a normal block; Slick then wraps each
   .attorney-about-badge in .slick-slide. */
.rtbadges_slide .attorney-about-badge {
    display: block;
    line-height: 0;
    outline: none;
}
.rtbadges_slide .attorney-about-badge-img {
    display: block;
    width: 100px;
    height: auto;
    margin: 0;
}
/* Prevent a brief flash of all badges stacked before Slick initializes. */
.rtbadges_slide:not(.slick-initialized) .attorney-about-badge ~ .attorney-about-badge {
    display: none;
}
/* Slick track/list resets specific to this small slider. */
.rtbadges_slide.slick-initialized .slick-track,
.rtbadges_slide.slick-initialized .slick-list {
    line-height: 0;
}

.attorney-about-links {
    display: flex;
    width: calc(100% - 100px);
}
.attorney-about-linkedin {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 45px;
    height: 45px;
    flex: 0 0 auto;
}
.attorney-about-linkedin svg {
	width: 100%;
	height: 100%;
	color: var(--color-white);
	fill: currentColor;
}
.attorney-about-linkedin:hover svg rect{
    fill: var(--color-brand-blue);
}
.attorney-about-email {
	color: var(--color-text-dark);
	margin: 0 0 0 auto;
	padding: 0 0 0 15px;
    line-height: 2;
}
.attorney-about-email-label {
	font-weight: 400;
	display: table;
	width: 100%;
}
.attorney-about-email a {
    color: var(--color-text-dark);
    text-decoration: underline;
    text-underline-offset: 2px;
}
.attorney-about-email a:hover{
    color: var(--color-brand-blue);
}
.attorney-about-body {
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.attorney-about-body-columns { display: block; }
.attorney-about-body-columns--two {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    align-items: flex-start;
}
.attorney-about-body-columns--two .attorney-rich-text { min-width: 0; }
/* .attorney-about-body .attorney-rich-text p {
    margin-bottom: 20px;
    margin-bottom: clamp(20px, calc(-4.613px + 3.209vw), 57px);
} */
.attorney-about-body .attorney-rich-text p:last-child { margin-bottom: 0; }

.attorney-about-body .attorney-rich-text{
    max-width: 650px;
    max-width: 100%;
    width: 100%;
}

/* DOWNLOAD VCARD button */
.attorney-vcard-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--color-brand-blue);
	color: var(--color-white) !important;
	padding: 15px 10px 14px;
	font-family: var(--font-body);
	font-weight: 400;
	font-size: 16px;
	line-height: 1;
	text-transform: uppercase;
	letter-spacing: 0.02em;
	text-decoration: none;
	border-radius: 0;
	margin-top: 20px;
	transition: background 0.2s ease, opacity 0.2s ease;
	max-width: 194px;
	width: 100%;
	text-align: center;
}
.attorney-vcard-button:hover,
.attorney-vcard-button:focus {
    background: var(--color-brand-navy);
    color: var(--color-white);
    opacity: 1;
}

/* -----------------------------------------------------------
   3-7. Bio sections (Areas / Education / Bar / Rep / Prior)
   ----------------------------------------------------------- */

.attorney-section--areas-of-practice .attorney-column ul,
.attorney-section--bar-admissions .attorney-column ul,
.attorney-section--representative-cases .attorney-column ul,
.attorney-section--prior-experience .attorney-column ul,
.attorney-section--education .attorney-column ul {
    list-style: disc outside;
    padding-left: 22px;
    margin: 0;
}

.attorney-section--representative-cases .attorney-column ul li,
.attorney-section--prior-experience .attorney-column ul li,
.attorney-section--areas-of-practice .attorney-column ul li,
.attorney-section--bar-admissions .attorney-column ul li,
.attorney-section--education .attorney-column ul li {
    margin-bottom: 6px;
    margin-bottom: 0;
    line-height: 1.7;
}

.attorney-section--representative-cases .attorney-column ul li { margin-bottom: 20px; }
.attorney-section--representative-cases .attorney-column ul li:last-child { margin-bottom: 0; }

/* Education — two entries side by side, each with school name (strong first line) */
.attorney-section--education .attorney-column .attorney-rich-text p:first-child,
.attorney-section--education .attorney-column p:first-child strong,
.attorney-section--education .attorney-column h3 {
    font-weight: 700;
    margin-bottom: 12px;
}

/* -----------------------------------------------------------
   Return-to-attorneys link
   ----------------------------------------------------------- */

.attorney-section--return {
    background: var(--color-white);
    padding: clamp(45px, calc(-14.87px + 7.806vw), 135px) 0 
            clamp(45px, calc(-68.088px + 14.744vw), 215px);
}
.attorney-return-link {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: var(--color-brand-blue);
    font-size: 16px;
    line-height: 1.7;
    text-decoration: none;
}
.attorney-return-link:hover,
.attorney-return-link:focus {
    color: var(--color-brand-navy);
}
.attorney-return-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 7px;
    height: 12px;
    color: var(--color-brand-blue);
}
.attorney-return-icon svg {
    width: 7px;
    height: 12px;
    fill: currentColor;
    color: currentColor;
}
.attorney-return-link:hover .attorney-return-icon { color: var(--color-brand-navy); }
.attorney-return-label { line-height: 1.7; }

/* -----------------------------------------------------------
   Collapse breakpoint — one clean stack under 1024px
   ----------------------------------------------------------- */

@media (max-width: 1440px) {
    .attorney-banner-hero-inner {
        padding-left: 0;
    }
    .attorney-banner-band .container{
        padding-left: 24px;
        padding-right: 24px;
    }
    .attorney-breadcrumbs {
        padding: 20px 24px;
    }
    .attorney-banner-band {
	    padding: 30px 0;
    }
    .no-attorney-blurb .attorney-banner-identity,
    .attorney-banner-identity {
        max-width: 100%; padding: 0;
    }
    .attorney-banner-blurb{
        max-width: 50%;
    }
    .attorney-banner-contact {
        max-width: 50%;
        padding: 30px 30px 0;
    }
    .no-attorney-blurb .attorney-banner-contact{
        max-width: 100%; margin: 25px 0 0 0;
    }
    .attorney-banner-contact::before, .attorney-banner-contact::after{
        top: 0;
    }
   

}

@media (max-width: 1360px) {
    .attorney-about-row{
        gap: 50px;
    }
    .attorney-badges-wrap {
	    gap: 25px 40px;
    }
    .attorney-about-email {
        margin: 0;
	    padding: 0 0 0 30px;
    }
}

@media (max-width: 1199px) {
    .attorney-banner-blurb {
        max-width: 100%;
        padding: 0;
        margin: 20px 0 0 0;
    }

    .attorney-banner-contact {
        margin: 25px auto 0 0;
        justify-content: center;
        padding: 20px;
        max-width: 600px;
        width: 100%;
    }
    .attorney-banner-contact::before, .attorney-banner-contact::after{
        display: none;
    }
    .no-attorney-blurb .attorney-banner-contact{
        max-width: 600px;
    }
    .attorney-banner-blurb-wrap{
        max-width: 100%;
    }
}

@media (max-width: 1024px) {
   .attorney-about-body .attorney-rich-text {
        max-width: 100%;
    }   
    .attorney-banner-hero {
        /* height: clamp(300px, 40vw, 420px); */
        min-height: 480px;
    }

    .attorney-about-row {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    .attorney-about-photo { max-width: 456px; }

    .attorney-columns--two,
    .attorney-about-body-columns--two {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .attorney-heading {
        padding-bottom: 24px;
        margin: 0 0 24px;
    }
    .attorney-tabs .attorney-heading{
        padding-bottom: 24px;
        margin: 0 0 24px;
    }

    .attorney-section { 
        padding: 40px 0 0;
    }
    .attorney-section.attorney-tabs{
        padding: 35px 0 0;
    }
    .attorney-vcard-button{
        margin-top: 0;
    }
}

@media (max-width: 767px) {
    .attorney-banner-hero {
        min-height: 360px;
    }
    .attorney-breadcrumbs {
        padding: 16px 20px;
        font-size: 14px;
    }

    .bg_right-center .attorney-banner-hero {
	    background-position: right 13% center;
    }
}

@media (max-width: 640px) {
    .inner-banner-offices {
        flex-direction: column;
        gap: 24px;
        max-width: 100%;
    }
    .attorney-about-links{
        flex-wrap: wrap;
    }
    .attorney-badges-wrap {
	    gap: 25px 25px;
    }
    .attorney-about-email {
        margin: 0;
        padding: 15px 0 0 0;
        width: 100%;
        line-height: 1.5;
    }
}

@media (max-width: 480px) {
    .attorney-banner-hero {
        min-height: 320px;
    }
    .attorney-badges-wrap {
        gap: 25px 25px;
        flex-wrap: wrap;
    }
    .attorney-about-links{
        order: -1; width: 100%;
    }
}