@charset "UTF-8";
/*
Theme Name:Avenue Advisors Wordpress Theme
Author:Chelsea Brown
Author URI:https://focusedcre.com
Description:Custom wordpress theme for Avenue Advisors
Version:1
*/

/* ==========================================================================
   Design tokens
   ========================================================================== */
:root {
    --avenue-navy: #070663;
    --avenue-blue: #4ba3d7;
    --avenue-ink: #171940;
    --avenue-muted: #666979;
    --avenue-line: #dce0e7;
    --avenue-pale: #f3f5f7;
    /* Sweep palette: the resting colour and the one that arrives from the left.
       Elements override these locally whenever their ground differs. */
    --sweep-ink: var(--avenue-navy);
    --sweep-hover: #277cae;
}

/* ==========================================================================
   Base
   ========================================================================== */
html {
    scroll-behavior: smooth;
    /* The header is 115px on desktop and 92px once collapsed, and home.js keeps
       --avenue-header-height current, so anchor jumps follow the real bar. */
    scroll-padding-top: calc(var(--avenue-header-height, 115px) + 16px);
    /* iOS grows fonts to its own taste between portrait and landscape. */
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}
.avenue-home {
    font-family: Montserrat, sans-serif;
    color: var(--avenue-ink);
    font-size: 16px;
    line-height: 1.85;
    background: #fff;
}
.avenue-home h1,
.avenue-home h2,
.avenue-home h3 {
    font-family: Montserrat, sans-serif;
    line-height: 1.18;
    font-weight: 400;
    letter-spacing: -.045em;
}
.avenue-home h2 {
    font-size: clamp(2rem, 3.25vw, 3.25rem);
    margin-bottom: 28px;
    color: var(--avenue-navy);
    font-weight: 400;
}
.avenue-home h3 {
    letter-spacing: -.025em;
}
.avenue-home a {
    color: inherit;
    text-decoration: none;
}
.avenue-home p {
    margin-bottom: 22px;
}
.avenue-home .container {
    max-width: 1320px;
    padding-left: 36px;
    padding-right: 36px;
}
/* Two-tone section headlines. */
.avenue-home h1 strong,
.avenue-home h2 strong {
    color: var(--avenue-blue);
    font-weight: 600;
}
a:focus-visible,
button:focus-visible,
[tabindex]:focus-visible {
    outline: 3px solid var(--avenue-blue);
    outline-offset: 5px;
}

/* ==========================================================================
   Shared components
   ========================================================================== */
.section-space {
    padding: 120px 0;
}
/* The class and the :has() detection live in separate rules on purpose: a browser
   that cannot parse :has() drops the whole rule, which would strip the eyebrow
   treatment off the footer and every hand-classed label along with it. */
.eyebrow {
    text-transform: uppercase;
    letter-spacing: .19em;
    font-size: .75rem;
    font-weight: 600;
    color: var(--avenue-navy);
    margin-bottom: 22px !important;
    /* The dash hangs in its own gutter so a wrapped line continues under the
       words, not under the rule, and no line is left holding a single word. */
    position: relative;
    padding-left: 38px;
    text-wrap: balance;
}
.hero-content > p:has(+ h1),
.contact-hero-content > p:has(+ h1),
.about-copy > p:has(+ h2),
.numbers-heading > p:has(+ h2),
.services-copy > p:has(+ h2),
.firm-copy > p:has(+ h2),
.leadership-heading > p:has(+ h2),
.section-heading > div > p:has(+ h2),
.relationship-copy > p:has(+ h2),
.contact-form-intro > p:has(+ h2),
.card-intro > p:has(+ h2),
.talk-copy > p:has(+ h2) {
    text-transform: uppercase;
    letter-spacing: .19em;
    font-size: .75rem;
    font-weight: 600;
    color: var(--avenue-navy);
    margin-bottom: 22px !important;
    position: relative;
    padding-left: 38px;
    text-wrap: balance;
}
.eyebrow:before {
    content: '';
    position: absolute;
    left: 0;
    top: .62em;
    width: 26px;
    height: 1px;
    background: var(--avenue-blue);
}
.hero-content > p:has(+ h1):before,
.contact-hero-content > p:has(+ h1):before,
.about-copy > p:has(+ h2):before,
.numbers-heading > p:has(+ h2):before,
.services-copy > p:has(+ h2):before,
.firm-copy > p:has(+ h2):before,
.leadership-heading > p:has(+ h2):before,
.section-heading > div > p:has(+ h2):before,
.relationship-copy > p:has(+ h2):before,
.contact-form-intro > p:has(+ h2):before,
.card-intro > p:has(+ h2):before,
.talk-copy > p:has(+ h2):before {
    content: '';
    position: absolute;
    left: 0;
    top: .62em;
    width: 26px;
    height: 1px;
    background: var(--avenue-blue);
}
/* Where the dash is suppressed the hanging gutter goes with it. */
.avenue-footer .eyebrow,
.contact-block .eyebrow,
.relationship-proof .eyebrow {
    padding-left: 0;
}
.avenue-btn {
    font-size: .78rem;
    letter-spacing: .02em;
    font-weight: 600;
    border-radius: 0;
    padding: 18px 23px;
    display: inline-flex;
    align-items: center;
    gap: 30px;
    border-width: 1px;
}
.avenue-btn span {
    font-size: 1.3rem;
    font-weight: 400;
    line-height: 1;
}
/* Every button answers a cursor the way btn-light does: a colour panel slides in
   from the left edge. --btn-sweep carries the fill, so each variant keeps its own
   palette. The chevrons stay put on purpose -- several of them are bare text nodes
   or live inside an input's value, so only the sweep can be uniform. */
.avenue-btn,
.slider-buttons button {
    position: relative;
    isolation: isolate;
    overflow: hidden;
}
.avenue-btn:before,
.slider-buttons button:before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    background: var(--btn-sweep, transparent);
    transform: translate3d(-101%, 0, 0);
}
.avenue-btn:hover:before,
.avenue-btn:focus-visible:before,
.slider-buttons button:hover:not(:disabled):before,
.slider-buttons button:focus-visible:not(:disabled):before {
    transform: translate3d(0, 0, 0);
}
@media (prefers-reduced-motion: no-preference) {
    .avenue-btn:before,
    .slider-buttons button:before {
        transition: transform .5s cubic-bezier(.22, 1, .36, 1);
    }
}
/* Solid white buttons fill with brand blue from the left. The label stays navy
   (6.2:1 on blue); white on blue is 2.8:1. The fill exists in every motion
   mode -- only its slide is gated, so reduced-motion users still get feedback. */
.btn-light {
    --btn-sweep: var(--avenue-blue);
    background: #fff;
    color: var(--avenue-navy) !important;
}
.btn-outline-light {
    /* Bootstrap's own hover background would land outright; the sweep delivers it. */
    --bs-btn-hover-bg: transparent;
    /* The label rides the panel: navy arrives letter by letter, in lockstep with
       the white fill, so no glyph is ever white-on-white mid-sweep. */
    --sweep-ink: #fff;
    --sweep-hover: var(--avenue-navy);
    color: #fff !important;
    border-color: #ffffff80;
}
.btn-outline-light:hover,
.btn-outline-light:focus-visible {
    color: var(--avenue-navy) !important;
    border-color: #fff;
}
.text-link {
    --sweep-line: var(--sweep-ink);
    display: inline-flex;
    justify-content: space-between;
    align-items: center;
    gap: 45px;
    border-bottom: 1px solid var(--sweep-line);
    padding: 9px 0;
    font-size: .8rem;
    font-weight: 600;
    color: var(--sweep-ink) !important;
    transition: border-color .5s cubic-bezier(.22, 1, .36, 1);
}
.text-link > span:not(.text-link-label) {
    font-size: 1.4rem;
    font-weight: 400;
}
.text-link:hover,
.text-link:focus-visible {
    --sweep-line: var(--sweep-hover);
    color: var(--sweep-hover) !important;
}
/* btn-light's sweep painted onto the glyphs instead of a panel: the hover colour
   enters at the first letter and travels to the last. Same direction, same ease.
   Each target must shrink-wrap its own box, or the edge crosses dead space. */
.text-link-label,
.contact-secondary,
.btn-outline-light,
.property-deal,
.service-row h3 {
    background-image: linear-gradient(90deg, var(--sweep-hover) 50%, var(--sweep-ink) 50%);
    background-size: 200% 100%;
    background-position: 100% 0;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
/* The outline button needs the panel and the glyph sweep together, and a negative-z
   pseudo paints over text clipped to the background -- so its panel rides along as a
   second layer. Shared size and position keep both edges in lockstep. */
.btn-outline-light {
    --btn-sweep: none;
    background-image: linear-gradient(90deg, var(--sweep-hover) 50%, var(--sweep-ink) 50%), linear-gradient(90deg, #fff 50%, transparent 50%);
    background-clip: text, padding-box;
    -webkit-background-clip: text, padding-box;
}
.text-link:hover .text-link-label,
.text-link:focus-visible .text-link-label,
.contact-secondary:hover,
.contact-secondary:focus-visible,
.btn-outline-light:hover,
.btn-outline-light:focus-visible,
a.property-deal:hover,
a.property-deal:focus-visible,
.service-row:hover h3,
.service-row:focus-visible h3 {
    background-position: 0 0;
}
@media (prefers-reduced-motion: no-preference) {
    .text-link-label,
    .contact-secondary,
    .property-deal,
    .service-row h3 {
        transition: background-position .5s cubic-bezier(.22, 1, .36, 1);
    }
    .btn-outline-light {
        transition: background-position .5s cubic-bezier(.22, 1, .36, 1), border-color .5s cubic-bezier(.22, 1, .36, 1);
    }
}
.contact-secondary {
    --sweep-ink: #fff;
    --sweep-hover: var(--avenue-blue);
    font-size: .7rem;
    padding: 12px 0;
    border-bottom: 1px solid #ffffff50;
}

/* ==========================================================================
   Header
   ========================================================================== */
.avenue-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 20;
    color: #fff;
    border-bottom: 1px solid #ffffff30;
    transition: background-color .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.avenue-header .navbar {
    min-height: 114px;
}
.navbar-brand img {
    width: 205px;
    height: auto;
}
.avenue-header .nav-link {
    font-size: .875rem;
    color: #fff;
    padding: 16px 23px !important;
}
.avenue-header .nav-link:hover,
.avenue-header .nav-link.active {
    color: #fff;
}
.avenue-header .nav-link.active:after {
    content: '';
    height: 2px;
    background: var(--avenue-blue);
    display: block;
    width: 20px;
    margin: 5px auto -7px;
}
.avenue-header .navbar-nav li.nav-item:nth-child(3) .nav-link.active:after {
	display: none;
}
.avenue-header .nav-item:last-child {
    margin-left: 30px;
    border-left: 1px solid #ffffff50;
    padding-left: 22px;
}
.avenue-header .nav-item:last-child span {
    padding-left: 32px;
    color: #8fccf1;
}
.navbar-toggler {
    border: 1px solid #ffffff70;
    padding: 12px;
    border-radius: 0;
}
.navbar-toggler span {
    width: 22px;
    height: 1px;
    background: white;
    display: block;
    margin: 5px 0;
}
.header-logo-color {
    display: none;
}
/* Solid header after scrolling. */
.avenue-header.is-scrolled {
    background: #fff;
    color: var(--avenue-navy);
    border-bottom-color: var(--avenue-line);
    box-shadow: 0 4px 24px rgba(7, 6, 99, .08);
}
.avenue-header.is-scrolled .header-logo-white {
    display: none;
}
.avenue-header.is-scrolled .header-logo-color {
    display: block;
}
.avenue-header.is-scrolled .nav-link,
.avenue-header.is-scrolled .nav-link.active {
    color: var(--avenue-navy);
}
.avenue-header.is-scrolled .nav-link:hover {
    color: #277cae;
}
.avenue-header.is-scrolled .nav-item:last-child {
    border-left-color: var(--avenue-line);
}
.avenue-header.is-scrolled .nav-item:last-child span {
    color: #277cae;
}
.avenue-header.is-scrolled .navbar-toggler {
    border-color: var(--avenue-navy);
}
.avenue-header.is-scrolled .navbar-toggler span {
    background: var(--avenue-navy);
}
.admin-bar .avenue-header {
    top: 32px;
}

/* ==========================================================================
   Footer
   ========================================================================== */
/* Shared fixed photo backdrop for Contact and the footer. */
.contact-section,
.avenue-footer {
    --section-overlay: rgba(10, 55, 100, .92);
    background-color: var(--avenue-navy);
    background-image: linear-gradient(var(--section-overlay), var(--section-overlay)), var(--section-bg, url('assets/img/home/hotel-exterior.jpg'));
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
}
.avenue-footer {
    --section-overlay: rgba(4, 4, 51, .95);
    color: #d0d1e2;
    padding: 80px 0 0;
    font-size: .8rem;
}
.footer-logo {
    width: 235px;
    height: auto;
    margin-bottom: 25px;
}
.footer-description {
    font-size: .8rem;
    line-height: 1.9;
}
/* TREC notices sit under the description as quiet legal text, but they are links,
   so the underline is the only thing separating them from the paragraph above. */
.footer-legal {
    font-size: .75rem;
    line-height: 1.8;
    color: #a0a2bd;
}
.footer-legal a {
    text-decoration: underline;
    text-underline-offset: 3px;
}
.avenue-footer .eyebrow {
    color: #a4acca;
    font-size: .67rem;
}
.avenue-footer .eyebrow:before {
    display: none;
}
.avenue-footer nav a,
.avenue-footer .col-lg-4 > a {
    display: block;
    margin-bottom: 8px;
}
.avenue-footer a:hover {
    color: white;
}
.avenue-footer address {
    font-style: normal;
    margin-bottom: 21px;
}
.footer-bottom {
    border-top: 1px solid #ffffff22;
    display: flex;
    justify-content: space-between;
    padding: 23px 0;
    margin-top: 60px;
    font-size: .75rem;
    color: #a0a2bd;
}

/* ==========================================================================
   Accessibility
   ========================================================================== */
.skip-link {
    position: fixed;
    top: -80px;
    left: 20px;
    z-index: 100;
    background: #fff;
    color: var(--avenue-navy);
    padding: 12px 20px;
}
.skip-link:focus {
    top: 10px;
}

/* ==========================================================================
   AOS fallbacks
   ========================================================================== */
html:not(.avenue-aos-ready) [data-aos] {
    opacity: 1 !important;
    transform: none !important;
    pointer-events: auto !important;
}
[data-aos="fade-up"] {
    transform: translate3d(0, 28px, 0);
}
[data-aos]:focus-within {
    opacity: 1 !important;
    transform: none !important;
    pointer-events: auto !important;
}

/* ==========================================================================
   Responsive (shared)
   ========================================================================== */
@media (min-width: 1600px) {
    .avenue-home .container {
        max-width: 1440px;
    }
}
@media (max-width: 991.98px) {
    .section-space {
        padding: 80px 0;
    }
    .avenue-header .navbar {
        min-height: 92px;
    }
    .avenue-header .nav-link {
        padding: 12px 0 !important;
        font-size: 1.05rem;
    }
    .avenue-header .nav-link.active:after {
        display: none;
    }
    .avenue-header .nav-item:last-child {
        margin: 0;
        border: 0;
        padding: 0;
    }
}
@media (max-width: 575.98px) {
    .avenue-home .container {
        padding-left: 24px;
        padding-right: 24px;
    }
    .navbar-brand img {
        width: 173px;
    }
    .avenue-btn {
        padding: 15px 18px;
        font-size: .7rem;
        gap: 20px;
    }
    .section-space {
        padding: 65px 0;
    }
    .avenue-footer {
        padding-top: 60px;
    }
    .avenue-footer .col-6 {
        width: 100%;
    }
    .footer-bottom {
        display: block;
        margin-top: 40px;
    }
    .footer-bottom a {
        display: block;
        margin-top: 12px;
    }
    .admin-bar .avenue-header {
        top: 46px;
    }
}
@media (max-width: 600px) {
    .admin-bar .avenue-header.is-scrolled {
        top: 0;
    }
}
@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }
    .avenue-header {
        transition: none;
    }
    [data-aos] {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
        pointer-events: auto !important;
    }
}

/* ==========================================================================
   Hero
   ========================================================================== */
.hero {
    /* A fixed 100vh clipped the closing CTA off short screens (320x568 lost 153px,
       a landscape phone lost 85px). The floor stays, the ceiling goes. dvh keeps the
       hero matched to the visible area instead of hiding its bottom bar behind
       mobile browser chrome. */
    min-height: 100vh;
    min-height: 100dvh;
    position: relative;
    color: #fff;
    display: flex;
    align-items: center;
    overflow: hidden;
    background: #111b31;
    isolation: isolate;
}
.hero-slides,
.hero-slide,
.hero-shade {
    position: absolute;
    inset: 0;
}
.hero-slide {
    opacity: 0;
    transition: opacity 1.8s ease;
    overflow: hidden;
}
.hero-slide.is-active {
    opacity: 1;
}
.hero-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1);
    pointer-events: none;
    -webkit-user-drag: none;
    user-select: none;
}
.hero-slide.is-active img,
.hero-slide.is-leaving img {
    animation: hotel-zoom 10s linear forwards;
}
.hero-shade {
    background:
        linear-gradient(90deg, rgba(4, 10, 33, .76), rgba(5, 9, 30, .32) 70%, rgba(4, 10, 33, .15)),
        linear-gradient(0deg, #050c25a8, transparent 35%, transparent 78%, #050c2560);
}
.hero-content {
    position: relative;
    padding-top: 110px;
    padding-bottom: 110px;
}
.hero .eyebrow {
    color: #fff;
}
.hero-content > p:has(+ h1) {
    color: #fff;
}
.hero h1 {
    font-size: clamp(3rem, 5.4vw, 5.2rem);
    max-width: 1040px;
    line-height: 1.12;
    margin-bottom: 26px;
    letter-spacing: -.05em;
}
.hero-subtitle {
    font-size: 1.25rem;
    letter-spacing: .01em;
    margin-bottom: 16px !important;
}
.hero-copy,
.hero-content > h1 ~ p {
    max-width: 660px;
    color: #e2e5eb;
    font-size: .96rem;
    line-height: 1.9;
    margin-bottom: 32px !important;
}
.hero-color-strip {
    position: absolute;
    top: var(--avenue-header-height, 115px);
    bottom: 0;
    right: 10%;
    width: 22%;
    background-color: #4ba3d7;
    mix-blend-mode: color;
    pointer-events: none;
}
@keyframes hotel-zoom {
    from { transform: scale(1); }
    to { transform: scale(1.12); }
}

/* Hero controls */
.hero-bottom {
    position: absolute;
    bottom: 30px;
    left: 0;
    right: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: .7rem;
    letter-spacing: .04em;
}
.hero-controls {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 18px;
    align-items: center;
    width: 100%;
}
.hero-dots {
    display: flex;
    gap: 10px;
    grid-column: 2;
    grid-row: 1;
}
.hero-dots button {
    width: 48px;
    height: 44px;
    border: 0;
    background: transparent;
    position: relative;
}
.hero-dots button:before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 48px;
    height: 4px;
    background: #ffffff70;
}
.hero-dots button.is-active:before {
    background: white;
}
.hero-pause {
    border: 0;
    background: transparent;
    color: white;
    width: 44px;
    height: 44px;
    font-size: 1rem;
    grid-column: 1;
    grid-row: 1;
    justify-self: end;
}
.hero-count {
    font-variant-numeric: tabular-nums;
    grid-column: 3;
    grid-row: 1;
    justify-self: start;
    /* "03 / 04" wrapped to two lines once the dots took their 48px each. */
    white-space: nowrap;
}

/* ==========================================================================
   About
   ========================================================================== */
.about-section {
    padding-top: 0;
    padding-bottom: 0;
}
.about-copy > h2 ~ p {
    color: var(--avenue-muted);
    font-size: .93rem;
}
.about-image-column {
    display: flex;
}
.about-section .about-visual {
    width: 100%;
    margin-bottom: 0;
}
.about-section .image-caption {
    z-index: 1;
}
.about-copy {
    padding-top: 100px;
    padding-bottom: 100px;
}
.about-visual {
    position: relative;
    margin-right: 10px;
}
.about-visual > img {
    width: 100%;
    height: 570px;
    object-fit: cover;
}
.image-caption {
    position: absolute;
    bottom: 35px;
    right: -36px;
    background: var(--avenue-navy);
    color: white;
    padding: 25px 34px;
    font-size: 1.1rem;
    line-height: 1.6;
}
.image-caption span {
    display: block;
}
.vertical-note {
    position: absolute;
    left: -29px;
    bottom: 0;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    font-size: .62rem;
    letter-spacing: .15em;
    text-transform: uppercase;
    color: #7b7d89;
}

/* ==========================================================================
   By the Numbers
   ========================================================================== */
.numbers-section {
    padding: 90px 0 100px;
    background-color: var(--avenue-navy);
    background-image: var(--section-bg, url('assets/img/home/hotel-exterior.jpg'));
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    color: white;
    position: relative;
    overflow: hidden;
}
.numbers-section::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(110deg, rgba(7, 6, 99, .94) 0%, rgba(7, 6, 99, .82) 45%, rgba(20, 93, 151, .76) 100%);
    pointer-events: none;
}
.numbers-section .container {
    position: relative;
}
.numbers-section .eyebrow {
    color: #acd7f1;
}
.numbers-section .numbers-heading > p:has(+ h2) {
    color: #acd7f1;
}
.numbers-section h2 {
    margin: 0;
    color: #fff;
}
.numbers-intro {
    color: #c2c6e2;
    font-size: .92rem;
    margin-bottom: 5px !important;
}
.metric {
    border-top: 1px solid #ffffff38;
    padding-top: 25px;
    padding-right: 20px;
}
.metric strong {
    font-family: Montserrat, sans-serif;
    display: block;
    font-weight: 400;
    font-size: clamp(2.5rem, 5vw, 4.5rem);
    letter-spacing: -.055em;
    line-height: 1.4;
}
.metric span {
    font-size: .79rem;
    display: block;
    max-width: 205px;
    color: #d6d8e9;
    line-height: 1.7;
}

/* ==========================================================================
   Section heading
   ========================================================================== */
.section-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 35px;
    margin-bottom: 48px;
}
.section-heading h2 {
    margin-bottom: 0;
}
.section-heading .text-link {
    flex-shrink: 0;
}

/* ==========================================================================
   Why Avenue
   ========================================================================== */
.why-section {
    position: relative;
    isolation: isolate;
}
.why-section::before {
    content: '';
    position: absolute;
    right: 5%;
    bottom: 0;
    width: 90%;
    height: 100%;
    background-image: url('assets/img/avenue-advisors-watermark-for-light-bgs.svg');
    background-repeat: no-repeat;
    background-position: right bottom;
    background-size: contain;
    opacity: .4;
    pointer-events: none;
    z-index: -1;
}
.principles {
    border-top: 1px solid var(--avenue-line);
    border-left: 1px solid var(--avenue-line);
}
.principle {
    padding: 35px 34px 38px;
    height: 100%;
    border-bottom: 1px solid var(--avenue-line);
    border-right: 1px solid var(--avenue-line);
    transition: background .3s;
}
.principle:hover {
    background: #f4f8fb;
}
.principle-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 33px;
    color: var(--avenue-blue);
}
.principle-top svg {
    width: 35px;
    height: 35px;
}

.principle-top img {
    width: 35px;
    height: 35px;
    object-fit: contain;
}
.principle-top span {
    font-size: .7rem;
    color: #9899a3;
}
.principle h3 {
    font-size: 1.22rem;
    margin-bottom: 17px;
    color: var(--avenue-navy);
}
.principle p {
    font-size: .86rem;
    color: var(--avenue-muted);
    margin: 0;
}

/* ==========================================================================
   Services
   ========================================================================== */
.services-section {
    background: var(--avenue-pale);
    position: relative;
}
.services-image {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 46%;
}
.services-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.services-copy {
    padding-top: 85px;
    padding-bottom: 85px;
    padding-left: 50px;
}
.service-row {
    display: flex;
    gap: 20px;
    border-top: 1px solid #cdd3dd;
    padding: 29px 0;
    align-items: flex-start;
}
.service-number {
    font-size: .7rem;
    color: #7f8391;
    padding-top: 5px;
}
.service-row h3 {
    --sweep-ink: var(--avenue-ink);
    font-size: 1.4rem;
    margin-bottom: 14px;
    /* The sweep travels the title, not the column the description sets. */
    width: fit-content;
}
.service-row p {
    font-size: .93rem;
    color: var(--avenue-muted);
    margin: 0;
}
.service-arrow {
    margin-left: auto;
    color: var(--avenue-navy);
    font-size: 1.7rem;
}

/* Unroll the Services image from its left edge, with a soft moving fold. */
.services-image[data-aos="unfold-right"] {
    overflow: hidden;
    clip-path: inset(0);
}
@media (prefers-reduced-motion: no-preference) {
    .avenue-aos-ready .services-image[data-aos="unfold-right"] {
        clip-path: inset(0 100% 0 0);
        transition-property: clip-path;
        transition-duration: 1200ms;
        transition-timing-function: cubic-bezier(.22, 1, .36, 1);
    }
    .avenue-aos-ready .services-image[data-aos="unfold-right"].aos-animate {
        clip-path: inset(0);
    }
    .avenue-aos-ready .services-image[data-aos="unfold-right"]::after {
        content: '';
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        width: 60px;
        transform: translateX(-100%);
        background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .18) 45%, rgba(0, 0, 0, .28));
        pointer-events: none;
        opacity: 1;
        transition: left 1200ms cubic-bezier(.22, 1, .36, 1), opacity 1200ms ease;
    }
    .avenue-aos-ready .services-image[data-aos="unfold-right"].aos-animate::after {
        left: 100%;
        opacity: 0;
    }
}

/* ==========================================================================
   Current Listings
   ========================================================================== */
.listings-section {
    padding-bottom: 100px;
    border-bottom: 1px solid var(--avenue-line);
    position: relative;
    isolation: isolate;
    overflow: hidden;
}
.listings-section::before {
    content: '';
    position: absolute;
    inset: 0 auto 0 0;
    width: 46%;
    background: var(--avenue-blue);
    opacity: .1;
    pointer-events: none;
    z-index: -1;
}
.section-heading > div > h2 ~ p {
    font-size: .85rem;
    color: var(--avenue-muted);
    margin-top: 22px;
}
.property-track {
    display: flex;
    gap: 30px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    align-items: stretch;
}
.property-track::-webkit-scrollbar {
    display: none;
}
.property-card {
    flex: 0 0 calc((100% - 60px) / 3);
    scroll-snap-align: start;
    min-width: 0;
}
.property-image {
    position: relative;
    overflow: hidden;
}
.property-image img {
    width: 100%;
    height: 350px;
    object-fit: cover;
    transition: transform .6s;
}
.property-card:hover .property-image img {
    transform: scale(1.045);
}
.listing-card:nth-child(even) {
    padding-top: 45px;
}
.listing-card:nth-child(even) .property-image img {
    height: 305px;
}
.property-status {
    position: absolute;
    top: 18px;
    left: 18px;
    background: #fff;
    color: var(--avenue-navy);
    font-size: .65rem;
    text-transform: uppercase;
    letter-spacing: .08em;
    padding: 8px 13px;
    font-weight: 600;
}
.property-copy {
    padding: 25px 0 0;
}
.property-location {
    font-size: .7rem;
    text-transform: uppercase;
    letter-spacing: .14em;
    color: var(--avenue-muted);
    margin-bottom: 12px !important;
}
.property-copy h3 {
    font-size: 1.25rem;
    line-height: 1.4;
    margin-bottom: 18px;
    color: var(--avenue-navy);
}
/* Property names run to 66 characters ("Holiday Inn Express & Suites Houston
   Northwest Highway 290 Cypress"). Four lines is the ceiling the narrowest card
   in the track needs to show the longest one whole, and three is the floor that
   keeps the short titles from collapsing the row. A truncated property name is a
   worse outcome than a card that is one line taller than its neighbour. */
.listing-card .property-copy h3 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    line-clamp: 4;
    overflow: hidden;
    min-height: 4.2em;
}
/* Same ceiling for the transaction cards, which already reserve three lines. */
.transaction-card .property-copy h3 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    line-clamp: 4;
    overflow: hidden;
}
.property-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 12px;
    justify-content: space-between;
    border-top: 1px solid var(--avenue-line);
    padding-top: 15px;
    font-size: .76rem;
}
/* Deal button in the card footer, sized to the .76rem meta row. Hover slides a navy
   panel in from the left while the label turns white, which needs .btn-outline-light's
   two-layer sweep -- glyphs clipped to the text, panel clipped to the padding box, both
   sharing size and position so their edges move in lockstep. The negative-z pseudo is
   not usable here: it would paint over background-clipped glyphs. Both states look the
   same at rest; only the anchor sweeps. */
.property-deal {
    --sweep-ink: var(--avenue-navy);
    --sweep-hover: #fff;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 5px 12px;
    white-space: nowrap;
    flex: none;
    border: 1px solid var(--avenue-navy);
    border-radius: 999px;
    background-image:
        linear-gradient(90deg, var(--sweep-hover) 50%, var(--sweep-ink) 50%),
        linear-gradient(90deg, var(--avenue-navy) 50%, #fff 50%);
    background-clip: text, padding-box;
    -webkit-background-clip: text, padding-box;
    color: var(--avenue-navy);
    font-weight: 600;
    letter-spacing: .02em;
    line-height: 1.2;
}
/* line-height: 0 keeps the chevron out of the flex line box, so the button is the
   same height as a Coming Soon label, which has no chevron to grow it. */
.property-deal span {
    font-size: 1.05rem;
    font-weight: 400;
    line-height: 0;
}
a.property-deal,
a.property-deal:hover,
a.property-deal:focus-visible {
    color: var(--avenue-navy);
    text-decoration: none;
}
.slider-bottom {
    display: flex;
    align-items: center;
    gap: 32px;
    margin-top: 40px;
}
.slider-position {
    font-size: .7rem;
    letter-spacing: .1em;
    font-variant-numeric: tabular-nums;
    min-width: 105px;
}
.slider-line {
    height: 1px;
    background: var(--avenue-line);
    flex: 1;
}
.slider-buttons {
    display: flex;
    gap: 8px;
}
.slider-buttons button {
    --btn-sweep: var(--avenue-navy);
    border: 1px solid #c9cdd7;
    background: transparent;
    width: 46px;
    height: 46px;
    color: var(--avenue-navy);
    font-size: 1.3rem;
    transition: color .5s cubic-bezier(.22, 1, .36, 1);
}
.slider-buttons button:hover:not(:disabled),
.slider-buttons button:focus-visible:not(:disabled) {
    color: white;
}
.slider-buttons button:disabled {
    opacity: .35;
    cursor: default;
}
/* Portrait listings: the card nearest the viewport center gets the taller crop. */
#listing-track {
    position: relative;
    align-items: flex-start;
}
#listing-track .listing-card {
    padding-top: 44px;
    transition: padding-top .5s ease;
}
#listing-track .property-image {
    aspect-ratio: 3 / 4;
    transition: aspect-ratio .5s ease;
}
#listing-track .property-image img {
    display: block;
    height: 100%;
    position: absolute;
    inset: 0;
}
#listing-track .listing-card.is-center {
    padding-top: 0;
}
#listing-track .listing-card.is-center .property-image {
    aspect-ratio: 3 / 4.7;
}
/* Side controls sit at the vertical center of the listing photos. */
.listings-section .property-slider {
    position: relative;
}
.listing-controls button {
    position: absolute;
    top: var(--listing-controls-top, 240px);
    transform: translateY(-50%);
    z-index: 2;
    display: grid;
    place-items: center;
    background: #fff;
    box-shadow: 0 3px 16px #00000014;
}
.listing-controls .slider-prev {
    left: -23px;
}
.listing-controls .slider-next {
    right: -23px;
}
.listing-controls svg {
    width: 22px;
    height: 22px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
}

/* ==========================================================================
   Track Record
   ========================================================================== */
.track-section {
    background: #fff;
}
.track-section .section-heading > div > h2 ~ p {
    max-width: 768px;
}
.transaction-card .property-image img {
    height: 245px;
}
.transaction-card .property-copy h3 {
    min-height: 88px;
    font-size: 1.14rem;
}
.transaction-meta {
    border-top: 1px solid #d4d8e0;
    padding-top: 15px;
    display: flex;
    justify-content: space-between;
    gap: 15px;
    font-size: .67rem;
    color: var(--avenue-muted);
}
.transaction-meta strong {
    display: block;
    font-weight: 500;
    color: var(--avenue-ink);
    font-size: .73rem;
}

/* ==========================================================================
   Relationships
   ========================================================================== */
.relationship-section {
    position: relative;
    overflow: hidden;
    background: var(--avenue-pale);
}
.relationship-section:before {
    content: '';
    position: absolute;
    inset: 0;
    background: url('assets/img/avenue-advisors-watermark-for-light-bgs.svg') no-repeat 94% center / 480px;
    opacity: .07;
    pointer-events: none;
}
.relationship-section .container {
    position: relative;
}
.relationship-section h2 {
    font-size: clamp(2.3rem, 4.3vw, 4.2rem);
}
.relationship-copy > h2 ~ p,
.relationship-proof > p {
    max-width: 660px;
    color: var(--avenue-muted);
    font-size: .94rem;
}
.relationship-proof {
    border-left: 1px solid var(--avenue-line);
    padding: 30px 0 30px 46px;
}
.relationship-proof .eyebrow {
    font-size: .65rem;
}
.relationship-proof .eyebrow:before {
    display: none;
}
.relationship-proof > strong {
    font-family: Montserrat, sans-serif;
    color: var(--avenue-navy);
    font-size: 7.5rem;
    font-weight: 400;
    letter-spacing: -.07em;
    line-height: 1.5;
    display: block;
}
.relationship-proof > strong span {
    font-size: 4.3rem;
    color: var(--avenue-blue);
    display: inline-block;
    margin-left: .18em;
    letter-spacing: 0;
}
.proof-bottom {
    border-top: 1px solid var(--avenue-line);
    padding-top: 20px;
    font-size: 1rem;
    color: var(--avenue-muted);
}
.proof-bottom p {
    margin-bottom: 0;
}
.proof-bottom b,
.proof-bottom strong {
    color: var(--avenue-navy);
    font-weight: 600;
}

/* ==========================================================================
   Contact
   ========================================================================== */
/* Backdrop image is shared with the footer (see above). */
.contact-section {
    color: white;
    padding: 95px 0 100px;
}
.contact-section > .container > .eyebrow,
.contact-section .contact-intro .eyebrow,
.contact-block .eyebrow {
    color: #a6d3f0;
}
.contact-section h2 {
    font-size: clamp(2.7rem, 4.8vw, 4.6rem);
    margin-bottom: 52px;
}
.contact-block {
    border-top: 1px solid #ffffff35;
    padding-top: 30px;
}
.contact-block p:not(.eyebrow) {
    font-size: .98rem;
    max-width: 560px;
    color: #e1e2f0;
    margin-bottom: 28px;
}
.contact-block .eyebrow:before {
    display: none;
}
.buyer-block {
    margin-left: 30px;
}
.contact-section .text-link {
    --sweep-ink: #fff;
    --sweep-hover: var(--avenue-blue);
    --sweep-line: #ffffff70;
}
.contact-section .text-link:hover,
.contact-section .text-link:focus-visible {
    --sweep-line: var(--sweep-hover);
    color: var(--sweep-hover) !important;
}
.avenue-home .contact-section h2,
.avenue-home .contact-section h2 strong {
    color: #fff;
}
.contact-section .avenue-btn,
.contact-section .contact-secondary,
.contact-section .text-link {
    font-size: .9rem;
}

/* ==========================================================================
   Responsive (home)
   ========================================================================== */
@media (min-width: 992px) {
    .about-section .about-visual > img {
        position: absolute;
        inset: 0;
        height: 100%;
    }
    .services-image {
        top: -100px;
        bottom: -100px;
        z-index: 1;
    }
    .listings-section {
        margin-top: 60px;
		scroll-margin-top: -60px;
    }
    .listings-section .property-slider {
        container-type: inline-size;
    }
    #listing-track {
        width: min(calc((100% + 30px) * 4 / 3 - 30px), calc(50cqw + 50vw - 24px));
    }
    #listing-track .listing-card {
        flex-basis: calc((100cqw - 60px) / 3);
    }
    .listing-controls .slider-next {
        right: auto;
        /* 50vw counts the classic scrollbar the page does not have room for, so the
           24px gutter was really 9px and the section's overflow:hidden shaved the
           arrow. 32px puts the whole 46px button back inside the viewport. */
        left: min(calc((100% + 30px) * 4 / 3 - 30px), calc(50cqw + 50vw - 32px));
        transform: translate(-50%, -50%);
    }
}
@media (min-width: 1600px) {
    .hero h1 {
        font-size: 5.7rem;
    }
}
@media (max-width: 991.98px) {
    .hero-content {
        padding-top: 125px;
    }
    /* A flat 4rem made the headline jump down to 53px the moment the window crossed
       992px. Ramped, it hands over to the base clamp at the same size. */
    .hero h1 {
        font-size: clamp(2.9rem, 5.6vw, 4rem);
    }
    .hero-bottom > span {
        max-width: 45%;
    }
    .about-visual {
        margin-right: 20px;
        margin-bottom: 22px;
    }
    .about-visual > img {
        height: 480px;
    }
    .about-copy {
        padding-top: 70px;
        padding-bottom: 70px;
    }
    .numbers-intro {
        margin-top: 25px;
    }
    .services-image {
        position: relative;
        width: 100%;
        height: 410px;
    }
    .services-copy {
        padding: 60px 0;
    }
    .section-heading {
        gap: 25px;
    }
    .section-heading .text-link {
        font-size: .7rem;
        gap: 20px;
    }
    .property-card {
        flex-basis: calc((100% - 30px) / 2);
    }
    .property-image img {
        height: 320px;
    }
    .listing-card:nth-child(even) .property-image img {
        height: 275px;
    }
    .relationship-proof {
        padding: 0;
        border-left: 0;
        border-top: 1px solid var(--avenue-line);
        padding-top: 30px;
    }
    .relationship-proof > strong {
        font-size: 6rem;
    }
    .buyer-block {
        margin-left: 0;
    }
    .contact-section {
        padding: 75px 0;
    }
    .transaction-card .property-copy h3 {
        min-height: 92px;
    }
    .listings-section::before {
        width: 100%;
    }
}
/* Three across only works once each card is wide enough for a long property
   name; at 576 the cards were 143px and titles ran to seven lines. */
@media (max-width: 991.98px) and (min-width: 768px) {
    #listing-track .listing-card {
        flex-basis: calc((100% - 60px) / 3);
    }
}
@media (max-width: 575.98px) {
    .hero h1 {
        font-size: 2.9rem;
    }
    .hero .eyebrow {
        font-size: .62rem;
        letter-spacing: .12em;
    }
    .hero-subtitle {
        font-size: 1rem;
    }
    .hero-copy {
        font-size: .86rem;
        line-height: 1.85;
    }
    .hero-content {
        padding-top: 110px;
        padding-bottom: 90px;
    }
    .hero-bottom {
        bottom: 22px;
    }
    .hero-bottom > span {
        display: none;
    }
    .hero-shade {
        background: linear-gradient(90deg, #040a23bd, #040a236b), linear-gradient(0deg, #040a23a8, transparent);
    }
    .hero-color-strip {
        right: 8%;
        width: 26%;
    }
    .about-visual > img {
        height: 370px;
    }
    /* 70px of air between the photo and the heading reads as a missing block on a
       phone; the section already carries its own rhythm. */
    .about-copy {
        padding-top: 44px;
    }
    .image-caption {
        right: -20px;
        font-size: .95rem;
        padding: 19px 25px;
    }
    .vertical-note {
        left: -21px;
        font-size: .52rem;
    }
    .numbers-section {
        padding: 65px 0;
    }
    .metric strong {
        font-size: 2.75rem;
    }
    .metric span {
        font-size: .67rem;
    }
    .metric {
        padding-right: 0;
    }
    .section-heading {
        display: block;
        margin-bottom: 30px;
    }
    .section-heading .text-link {
        margin-top: 15px;
    }
    .principle {
        padding: 28px;
    }
    .principle-top {
        margin-bottom: 22px;
    }
    .services-image {
        height: 330px;
    }
    .services-copy {
        padding: 45px 0;
    }
    .property-card {
        flex-basis: 88%;
    }
    .property-track {
        gap: 20px;
    }
    .property-image img {
        height: 335px;
    }
    .listing-card:nth-child(even) {
        padding-top: 0;
    }
    .listing-card:nth-child(even) .property-image img {
        height: 335px;
    }
    .section-heading > div > h2 ~ p {
        font-size: .78rem;
    }
    .slider-bottom {
        gap: 16px;
        margin-top: 25px;
    }
    .slider-position {
        font-size: .62rem;
        min-width: 90px;
    }
    .slider-buttons button {
        width: 40px;
        height: 40px;
    }
    .transaction-card .property-copy h3 {
        min-height: 78px;
    }
    .relationship-section h2 {
        font-size: 2.4rem;
    }
    .relationship-proof > strong {
        line-height: 1.25;
        margin-top: 15px;
    }
    .contact-section h2 {
        font-size: 2.7rem;
    }
    .contact-secondary {
        font-size: .69rem;
    }
    #listing-track .listing-card {
        padding-top: 24px;
    }
    #listing-track .listing-card.is-center {
        padding-top: 0;
    }
    .listing-controls .slider-prev {
        left: -18px;
    }
    .listing-controls .slider-next {
        right: -18px;
    }
}
@media (prefers-reduced-motion: reduce) {
    .hero-slide {
        transition: none;
    }
    .hero-slide img,
    .hero-slide.is-active img,
    .hero-slide.is-leaving img {
        animation: none;
    }
    .property-image img {
        transition: none;
    }
    #listing-track .listing-card,
    #listing-track .property-image {
        transition: none;
    }
}

/* ==========================================================================
   Contact Page Styles
   ========================================================================== */
.contact-hero {
    position: relative;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-color: var(--avenue-navy);
    color: #fff;
    padding-top: calc(var(--avenue-header-height, 115px) + 60px);
    padding-bottom: 90px;
    overflow: hidden;
}
.contact-hero-content {
    position: relative;
    z-index: 2;
    max-width: 900px;
}
.contact-hero-content .eyebrow {
    color: #fff;
}
.contact-hero-content > p:has(+ h1) {
    color: #fff;
}
.contact-hero h1 {
    font-size: clamp(2.3rem, 4vw, 3.4rem);
    color: #fff;
    line-height: 1.16;
    margin-bottom: 20px;
    letter-spacing: -.035em;
    font-weight: 500;
}
.contact-hero .hero-copy,
.contact-hero-content > h1 ~ p {
    color: #e2e5eb;
    font-size: 1.05rem;
    line-height: 1.8;
    max-width: 680px;
    margin-bottom: 0 !important;
}

/* Contact Form Section */
.contact-form-section {
    background: #fff;
    padding: 0;
    overflow: hidden;
}
.contact-form-col {
    padding: 100px 5% 100px 5%;
}
@media (max-width: 1400px) {
    .contact-form-col {
        padding: 80px 4% 80px 4%;
    }
}
@media (max-width: 991.98px) {
    .contact-form-col {
        padding: 60px 24px;
    }
}
.contact-form-left-col {
    width: 100%;
    max-width: 680px;
    margin-left: auto;
    margin-right: 0;
}
.contact-form-intro {
    margin-bottom: 36px;
    text-align: left;
}
.contact-form-intro h2 {
    font-size: clamp(2.2rem, 3.5vw, 3.2rem);
    margin-bottom: 18px;
}
.contact-form-intro .form-lead,
.contact-form-intro > h2 ~ p {
    color: var(--avenue-muted);
    font-size: 1.05rem;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
    line-height: 1.8;
	width: 520px;
}
.contact-map-col {
    padding: 0 !important;
}
.contact-map-wrapper {
    position: relative;
    border: none;
    min-height: 580px;
    height: 100%;
    width: 100%;
    overflow: hidden;
}
.contact-map {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 580px;
    background-color: var(--avenue-pale);
}
/* Touch only: the inert-map cover, added by contact.php. Sits above the tiles and
   markers but under Leaflet's popups (700) and controls (1000), so both stay live. */
.map-activate {
    position: absolute;
    inset: 0;
    z-index: 640;
    display: grid;
    place-items: end center;
    padding: 0 12px 56px;
    border: 0;
    background: rgba(243, 245, 247, .28);
    cursor: pointer;
    font: inherit;
}
.map-activate span {
    background: var(--avenue-navy);
    color: #fff;
    font-size: .68rem;
    font-weight: 600;
    letter-spacing: .14em;
    text-transform: uppercase;
    padding: 13px 22px;
    min-height: 44px;
    box-shadow: 0 8px 26px rgba(7, 6, 99, .28);
}
.leaflet-popup-content-wrapper {
    border-radius: 0;
    box-shadow: 0 4px 20px rgba(7, 6, 99, 0.12);
    padding: 4px;
}
.leaflet-popup-content {
    margin: 14px 18px;
    font-family: Montserrat, sans-serif;
}
.contact-form-wrapper {
    background: transparent;
    border: none;
    padding: 0;
}
.contact-form-wrapper .form-label {
    font-size: .8rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--avenue-ink);
    margin-bottom: 8px;
    display: block;
}
.contact-form-wrapper .form-label .required {
    color: var(--avenue-blue);
}
.contact-form-wrapper .form-control,
.contact-form-wrapper .form-select {
    border: 1px solid var(--avenue-line);
    border-radius: 0;
    padding: 14px 18px;
    font-size: .95rem;
    color: var(--avenue-ink);
    background-color: #fff;
    transition: border-color .2s ease, box-shadow .2s ease;
}
.contact-form-wrapper .form-control:focus,
.contact-form-wrapper .form-select:focus {
    border-color: var(--avenue-navy);
    box-shadow: 0 0 0 1px var(--avenue-navy);
    outline: none;
}
.contact-form-wrapper textarea.form-control {
    min-height: 130px;
    resize: vertical;
}
/* Plugin markup, so the left-edge sweep rides the background rather than a
   pseudo-element: blue slides over navy, matching .avenue-btn. */
.contact-form-wrapper .wpcf7-submit {
    border: none;
    cursor: pointer;
    background-color: var(--avenue-navy);
    background-image: linear-gradient(90deg, var(--avenue-blue) 50%, transparent 50%);
    background-size: 200% 100%;
    background-position: 100% 0;
    color: #fff;
}
.contact-form-wrapper .wpcf7-submit:hover,
.contact-form-wrapper .wpcf7-submit:focus-visible {
    background-position: 0 0;
    color: #fff;
}
@media (prefers-reduced-motion: no-preference) {
    .contact-form-wrapper .wpcf7-submit {
        transition: background-position .5s cubic-bezier(.22, 1, .36, 1);
    }
}
.contact-form-wrapper .wpcf7-spinner {
    margin-left: 15px;
}
.contact-form-wrapper .wpcf7-not-valid-tip {
    font-size: .78rem;
    color: #d9383a;
    margin-top: 6px;
}
.contact-form-wrapper .wpcf7-response-output {
    margin-top: 24px;
    padding: 16px 20px;
    font-size: .9rem;
    border-radius: 0;
}

/* Direct Contact & Buyer Network Section */
.bg-light-alt {
    background-color: var(--avenue-pale);
}
.contact-feature-card {
    background: #fff;
    border: 1px solid var(--avenue-line);
    padding: 48px;
    display: flex;
    flex-direction: column;
    height: 100%;
}
.contact-feature-card h2 {
    font-size: clamp(1.8rem, 2.6vw, 2.3rem);
    margin-bottom: 20px;
}
/* h2 ~ p, not "any p": the card's eyebrow is a paragraph too, and this rule was
   overriding its 12px tracked treatment with body sizing. */
.contact-feature-card .card-intro h2 ~ p {
    color: var(--avenue-muted);
    font-size: .96rem;
    line-height: 1.8;
}
.direct-contact-details {
    margin-top: auto;
    padding-top: 32px;
    border-top: 1px solid var(--avenue-line);
}
.direct-contact-person .person-name {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--avenue-navy);
    margin-bottom: 4px;
    letter-spacing: -.02em;
}
.direct-contact-person .person-title {
    display: block;
    font-size: .82rem;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--avenue-muted);
    font-weight: 500;
    margin-bottom: 24px;
}
.direct-contact-links {
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.direct-contact-links .contact-link {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    font-size: .95rem;
    color: var(--avenue-ink);
    font-weight: 500;
    transition: color .2s ease;
}
.direct-contact-links .contact-link:hover {
    color: var(--avenue-blue);
}
.direct-contact-links .contact-icon {
    stroke: var(--avenue-blue);
    flex-shrink: 0;
}
.buyer-network-card {
    background: #fff;
    position: relative;
    overflow: hidden;
}
.buyer-network-card .btn-primary {
    --btn-sweep: var(--avenue-blue);
    background-color: var(--avenue-navy);
    border-color: var(--avenue-navy);
    color: #fff;
    cursor: pointer;
}
/* The navy plate holds; the blue panel sweeps over it (see .avenue-btn:before). */
.buyer-network-card .btn-primary:hover,
.buyer-network-card .btn-primary:focus-visible {
    background-color: var(--avenue-navy);
    border-color: var(--avenue-navy);
    color: #fff;
}

/* Buyer Network Frosted / Matte Glass Overlay */
.buyer-glass-overlay {
    position: absolute;
    inset: 0;
    z-index: 10;
    background: rgba(255, 255, 255, 0.48);
    backdrop-filter: blur(8px) saturate(140%);
    -webkit-backdrop-filter: blur(8px) saturate(140%);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.6), 0 8px 32px rgba(7, 6, 99, 0.08);
    padding: 38px 44px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.35s ease, visibility 0.35s ease;
}
.buyer-glass-overlay.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}
.buyer-overlay-close {
    position: absolute;
    top: 18px;
    right: 20px;
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.7);
    border: 1px solid rgba(7, 6, 99, 0.15);
    border-radius: 50%;
    color: var(--avenue-navy);
    cursor: pointer;
    transition: all 0.2s ease;
    padding: 0;
    z-index: 2;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}
.buyer-overlay-close:hover {
    background: var(--avenue-navy);
    border-color: var(--avenue-navy);
    color: #fff;
}
.buyer-overlay-inner {
    width: 100%;
}
.buyer-overlay-form .form-label {
    font-size: 0.76rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--avenue-navy);
    margin-bottom: 6px;
    display: block;
}
.buyer-overlay-form .form-label .required {
    color: var(--avenue-blue);
}
.buyer-overlay-form .form-control {
    border: 1px solid rgba(7, 6, 99, 0.18);
    border-radius: 0;
    padding: 11px 14px;
    font-size: 0.9rem;
    background: rgba(255, 255, 255, 0.75);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    color: var(--avenue-ink);
    transition: all 0.2s ease;
}
.buyer-overlay-form .form-control:focus {
    background: #fff;
    border-color: var(--avenue-navy);
    box-shadow: 0 0 0 1px var(--avenue-navy);
    outline: none;
}
.buyer-overlay-form .wpcf7-submit {
    border: none;
    cursor: pointer;
    background-color: var(--avenue-navy);
    background-image: linear-gradient(90deg, var(--avenue-blue) 50%, transparent 50%);
    background-size: 200% 100%;
    background-position: 100% 0;
    color: #fff;
    padding: 14px 20px;
    font-size: 0.78rem;
    letter-spacing: 0.02em;
    font-weight: 600;
    width: 100%;
    text-align: center;
    justify-content: center;
}
.buyer-overlay-form .wpcf7-submit:hover,
.buyer-overlay-form .wpcf7-submit:focus-visible {
    background-position: 0 0;
    color: #fff;
}
@media (prefers-reduced-motion: no-preference) {
    .buyer-overlay-form .wpcf7-submit {
        transition: background-position .5s cubic-bezier(.22, 1, .36, 1);
    }
}
.buyer-overlay-form .wpcf7-response-output {
    margin-top: 14px;
    padding: 10px 14px;
    font-size: 0.82rem;
    border-radius: 0;
}

@media (max-width: 767.98px) {
    .contact-hero {
        padding-top: calc(var(--avenue-header-height, 90px) + 40px);
        padding-bottom: 60px;
    }
    .contact-form-wrapper {
        padding: 28px 20px;
    }
    .contact-feature-card {
        padding: 32px 24px;
    }
    .buyer-glass-overlay {
        padding: 32px 20px;
    }
    .buyer-overlay-close {
        top: 14px;
        right: 16px;
    }
    .contact-map-wrapper,
    .contact-map {
        min-height: 400px;
    }
}

/* ==========================================================================
   The Firm Section (About Page - Mirrored Services Section)
   ========================================================================== */
.firm-section {
    background: var(--avenue-pale);
    position: relative;
}
.firm-section .firm-image {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 46%;
}
.firm-section .firm-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.firm-section .firm-copy {
    padding-top: 85px;
    padding-bottom: 85px;
    padding-right: 50px;
}
.firm-section .firm-copy h2 {
    margin-bottom: 24px;
}
.firm-section .firm-copy > h2 ~ p {
    font-size: .95rem;
    color: var(--avenue-muted);
    line-height: 1.85;
}
.firm-section .firm-copy p:not(.eyebrow):not(:has(+ h2)) {
    font-size: .95rem;
    color: var(--avenue-muted);
    line-height: 1.85;
}

/* Unroll the Firm image from right to left, with a soft moving fold */
.firm-image[data-aos="unfold-left"] {
    overflow: hidden;
    clip-path: inset(0);
}
@media (prefers-reduced-motion: no-preference) {
    .avenue-aos-ready .firm-image[data-aos="unfold-left"] {
        clip-path: inset(0 0 0 100%);
        transition-property: clip-path;
        transition-duration: 1200ms;
        transition-timing-function: cubic-bezier(.22, 1, .36, 1);
    }
    .avenue-aos-ready .firm-image[data-aos="unfold-left"].aos-animate {
        clip-path: inset(0);
    }
    .avenue-aos-ready .firm-image[data-aos="unfold-left"]::after {
        content: '';
        position: absolute;
        top: 0;
        bottom: 0;
        right: 0;
        width: 60px;
        transform: translateX(100%);
        background: linear-gradient(-90deg, transparent, rgba(255, 255, 255, .18) 45%, rgba(0, 0, 0, .28));
        pointer-events: none;
        opacity: 1;
        transition: right 1200ms cubic-bezier(.22, 1, .36, 1), opacity 1200ms ease;
    }
    .avenue-aos-ready .firm-image[data-aos="unfold-left"].aos-animate::after {
        right: 100%;
        opacity: 0;
    }
}

@media (min-width: 992px) {
    .firm-section {
        margin-top: 60px;
        margin-bottom: 60px;
    }
    .firm-section .firm-image {
        top: -60px;
        bottom: -60px;
        z-index: 1;
    }
}
@media (max-width: 991.98px) {
    .firm-section {
        display: flex;
        flex-direction: column-reverse;
    }
    .firm-section .firm-image {
        position: relative;
        width: 100%;
        height: 410px;
    }
    .firm-section .firm-copy {
        padding: 60px 0;
    }
}

/* ==========================================================================
   Leadership Section (About Page - Team Grid)
   ========================================================================== */
.leadership-section {
    background: #fff;
}
.leadership-heading {
    margin-bottom: 48px;
}
.leadership-heading h2 {
    margin-bottom: 0;
}
.leadership-heading > h2 ~ p {
    font-size: .95rem;
    color: var(--avenue-muted);
    line-height: 1.85;
    margin-top: 22px;
}
.leadership-heading > p:not(.eyebrow):not(:has(+ h2)) {
    font-size: .95rem;
    color: var(--avenue-muted);
    line-height: 1.85;
    margin-top: 22px;
}
.team-card {
    height: 100%;
    display: flex;
    flex-direction: column;
}
.team-card-media {
    position: relative;
    display: block;
    aspect-ratio: 4 / 5;
    overflow: hidden;
    background: var(--avenue-navy);
    transition: box-shadow .45s ease;
}
.team-card-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .6s cubic-bezier(.22, 1, .36, 1);
}
/* Viewfinder crop marks */
.team-card-media::before,
.team-card-media::after {
    content: '';
    position: absolute;
    width: 26px;
    height: 26px;
    border: 2px solid rgba(255, 255, 255, .92);
    pointer-events: none;
    filter: drop-shadow(0 1px 3px rgba(7, 6, 99, .35));
    transition: width .45s cubic-bezier(.22, 1, .36, 1), height .45s cubic-bezier(.22, 1, .36, 1);
    z-index: 1;
}
.team-card-media::before {
    top: 12px;
    left: 12px;
    border-right: 0;
    border-bottom: 0;
}
.team-card-media::after {
    right: 12px;
    bottom: 12px;
    border-left: 0;
    border-top: 0;
}
.team-card:hover .team-card-media {
    box-shadow: 0 20px 42px rgba(7, 6, 99, .18);
}
.team-card:hover .team-card-media::before,
.team-card:hover .team-card-media::after,
.team-card-media:focus-visible::before,
.team-card-media:focus-visible::after {
    width: 44px;
    height: 44px;
}
.team-card-media:focus-visible,
.team-links a:focus-visible {
    outline: 2px solid var(--avenue-blue);
    outline-offset: 3px;
}
@media (prefers-reduced-motion: no-preference) {
    .team-card:hover .team-card-media img,
    .team-card-media:focus-visible img {
        transform: scale(1.045);
    }
    .team-single-copy .team-links a:hover,
    .team-single-copy .team-links a:focus-visible {
        transform: translateY(-2px);
    }
}
/* No-photo fallback: full name tile */
.team-placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    height: 100%;
    padding: 24px 28px;
    background: radial-gradient(120% 90% at 50% 0%, #14128a 0%, var(--avenue-navy) 58%, #040345 100%);
    text-align: center;
    color: #fff;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    line-height: 1.4;
    font-size: clamp(1rem, 2.4vw, 1.3rem);
    text-wrap: balance;
}
.team-placeholder::before {
    content: '';
    width: 26px;
    height: 2px;
    background: var(--avenue-blue);
    flex-shrink: 0;
}
.team-card .team-name {
    font-size: 1.22rem;
    font-weight: 700;
    color: var(--avenue-navy);
    letter-spacing: -.02em;
    line-height: 1.3;
    margin: 18px 0 4px;
}
.team-card .team-name a {
    color: inherit;
}
.team-card .team-name a:hover,
.team-card .team-name a:focus-visible {
    color: var(--avenue-blue);
}
.team-role {
    display: flex;
    align-items: center;
    gap: 9px;
    text-transform: uppercase;
    letter-spacing: .16em;
    font-size: .66rem;
    font-weight: 600;
    color: var(--avenue-muted);
    margin-bottom: 7px !important;
}
.team-role::before {
    content: '';
    width: 14px;
    height: 2px;
    background: var(--avenue-blue);
    flex-shrink: 0;
}
.team-links {
    margin-top: auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px;
}
.team-card .team-links {
    padding-top: 14px;
    border-top: 1px solid var(--avenue-line);
}
.team-links a {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: var(--avenue-muted);
    font-size: .62rem;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    text-decoration: none;
    transition: color .25s ease;
}
.team-card .team-links a:hover,
.team-card .team-links a:focus-visible {
    text-decoration: underline;
}
.team-links a:hover,
.team-links a:focus-visible {
    color: var(--avenue-blue);
}
.team-links svg {
    width: 13px;
    height: 13px;
    flex-shrink: 0;
}

@media (max-width: 575.98px) {
    .team-card .team-name {
        font-size: 1.02rem;
    }
    .team-role {
        font-size: .6rem;
        letter-spacing: .13em;
    }
    .team-card-media::before {
        top: 9px;
        left: 9px;
        width: 20px;
        height: 20px;
    }
    .team-card-media::after {
        right: 9px;
        bottom: 9px;
        width: 20px;
        height: 20px;
    }
    .team-placeholder {
        font-size: .92rem;
        padding: 18px 16px;
    }
    .team-links {
        gap: 12px;
    }
    .team-links a {
        gap: 0;
        min-width: 24px;
        min-height: 24px;
        justify-content: center;
    }
    .team-link-label {
        display: none;
    }
    .team-links svg {
        width: 15px;
        height: 15px;
    }
}

/* Single team member profile */
.team-single-hero {
    padding-bottom: 60px;
}
.team-single-portrait {
    aspect-ratio: 4 / 5;
}
.team-single-portrait img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.team-single-copy p {
    font-size: .95rem;
    color: var(--avenue-muted);
    line-height: 1.85;
}
.team-single-copy .team-links {
    margin-top: 28px;
    margin-bottom: 36px;
}
.team-single-copy .team-links a {
    width: auto;
    height: 40px;
    padding: 0 20px;
    gap: 10px;
    border: 1px solid var(--avenue-line);
    background: #fff;
    color: var(--avenue-navy);
    font-size: .72rem;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: none;
    transition: background .25s ease, color .25s ease, border-color .25s ease, transform .25s ease;
}
.team-single-copy .team-links svg {
    width: 15px;
    height: 15px;
}
.team-single-copy .team-links a:hover,
.team-single-copy .team-links a:focus-visible {
    background: var(--avenue-navy);
    border-color: var(--avenue-navy);
    color: #fff;
}

/* ==========================================================================
   Let's Talk (About page closing CTA band)
   ========================================================================== */
.talk-section {
    position: relative;
    overflow: hidden;
    padding: 104px 0 96px;
    color: #fff;
    border-top: 1px solid rgba(75, 163, 215, .28);
    background-color: var(--avenue-navy);
    background-image:
        radial-gradient(120% 150% at 86% 4%, rgba(75, 163, 215, .16) 0%, rgba(75, 163, 215, 0) 60%),
        linear-gradient(115deg, #040345 0%, var(--avenue-navy) 47%, #14128a 100%);
}
/* Floor light, and the blue seam, that keep this band's bottom edge distinct
   from the footer's navy photo. */
.talk-section::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: min(340px, 46%);
    background: linear-gradient(0deg, rgba(75, 163, 215, .15) 0%, rgba(75, 163, 215, 0) 100%);
    pointer-events: none;
}
.talk-section::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 2px;
    background: linear-gradient(90deg, var(--avenue-blue) 0%, rgba(75, 163, 215, .7) 34%, rgba(75, 163, 215, 0) 84%);
    pointer-events: none;
}
.talk-section .container {
    position: relative;
}
.talk-ground {
    position: absolute;
    inset: 0;
    pointer-events: none;
}
/* A container inside the decorative layer so the plate is measured against the
   content box, not the viewport, and never meets the copy column. */
.talk-ground .container {
    height: 100%;
}
/* Photo panel. The navy wash keeps it inside the band's tone, and --talk-bg
   follows the theme's existing --section-bg override idiom. */
.talk-plate {
    position: absolute;
    top: 88px;
    bottom: 88px;
    right: 0;
    width: 26%;
    min-width: 160px;
/*     border: 1px solid rgba(255, 255, 255, .16);
    border-left-color: rgba(75, 163, 215, .55); */
    background-color: var(--avenue-navy);
    background-image:
        linear-gradient(158deg, rgba(20, 18, 138, .45) 0%, rgba(7, 6, 99, .68) 58%, rgba(75, 163, 215, .4) 100%),
        var(--talk-bg, url('assets/img/home/hotel-exterior.jpg'));
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    overflow: hidden;
    clip-path: inset(0);
}
/* Viewfinder crop marks, as on .team-card-media. */
.talk-plate:before,
.talk-plate:after {
    content: '';
    position: absolute;
    width: 26px;
    height: 26px;
    border: 2px solid rgba(255, 255, 255, .5);
}
.talk-plate:before {
    top: 14px;
    left: 14px;
    border-right: 0;
    border-bottom: 0;
}
.talk-plate:after {
    right: 14px;
    bottom: 14px;
    border-left: 0;
    border-top: 0;
}
/* This watermark carries its own white opacity (.2 / .05), so it is not
   multiplied down the way the light-background watermark is. */
.talk-watermark {
    position: absolute;
    top: 50%;
    right: -3%;
    width: clamp(190px, 21vw, 330px);
    aspect-ratio: 147.34 / 215.84;
    transform: translateY(-46%);
    background: url('assets/img/avenue-watermark-for-dark-bg.svg') no-repeat center / contain;
}
/* Insurance for a paragraph the eyebrow rules fail to classify: it must not
   inherit --avenue-ink and disappear on the dark ground. */
/* The copy column owns the bound, not the heading, so every element an editor
   produces stays out of the plate zone. */
.talk-copy {
    position: relative;
    max-width: 64%;
}
.talk-copy :where(p, li, blockquote) {
    color: rgba(255, 255, 255, .74);
}
.talk-copy .eyebrow {
    color: #a6d3f0;
}
.talk-copy > p:has(+ h2) {
    color: #a6d3f0;
}
.talk-section h2 {
    color: #fff;
    margin-bottom: 40px;
    font-size: clamp(2.7rem, 5vw, 4.75rem);
    line-height: 1.06;
    letter-spacing: -.05em;
    text-wrap: balance;
}
.talk-copy > h2 ~ p {
    max-width: 590px;
    color: rgba(255, 255, 255, .74);
    font-size: .98rem;
    line-height: 1.82;
}
.talk-copy > p:not(.eyebrow):not(:has(+ h2)) {
    max-width: 590px;
    color: rgba(255, 255, 255, .74);
    font-size: .98rem;
    line-height: 1.82;
}
.talk-action {
    max-width: 640px;
    margin-top: 52px;
    padding-top: 34px;
    border-top: 1px solid rgba(255, 255, 255, .16);
}
/* Layout only -- the fill-sweep hover lives on .btn-light. */
.talk-cta {
    min-width: 280px;
    justify-content: space-between;
    border-color: #fff;
}
@media (prefers-reduced-motion: no-preference) {
    /* Same hook as .firm-image[data-aos="unfold-left"], without the travelling
       fold, whose ::after slot is the crop mark. */
    .avenue-aos-ready .talk-plate {
        clip-path: inset(0 0 0 100%);
        transition-property: clip-path;
        transition-duration: 1200ms;
        transition-timing-function: cubic-bezier(.22, 1, .36, 1);
    }
    .avenue-aos-ready .talk-plate.aos-animate {
        clip-path: inset(0);
    }
}
@media (max-width: 991.98px) {
    .talk-section {
        padding: 78px 0 72px;
    }
    .talk-copy {
        max-width: 80%;
    }
    .talk-section h2 {
        margin-bottom: 32px;
    }
    /* The plane narrows to a right-edge panel so it never sits under the copy. */
    .talk-plate {
        top: 72px;
        bottom: 72px;
        width: 15%;
        min-width: 56px;
    }
    .talk-watermark {
        top: auto;
        bottom: 0;
        right: -4%;
        width: clamp(170px, 34vw, 260px);
        transform: none;
    }
    .talk-action {
        margin-top: 40px;
        padding-top: 28px;
    }
}
/* On a tablet the plane unrolls from the floor instead of from the right. */
@media (prefers-reduced-motion: no-preference) and (max-width: 991.98px) {
    .avenue-aos-ready .talk-plate {
        clip-path: inset(100% 0 0 0);
    }
    .avenue-aos-ready .talk-plate.aos-animate {
        clip-path: inset(0);
    }
}
@media (max-width: 575.98px) {
    .talk-section {
        padding: 62px 0 58px;
    }
    .talk-copy {
        max-width: none;
    }
    .talk-section h2 {
        font-size: 2.6rem;
        line-height: 1.12;
    }
    .talk-copy > h2 ~ p {
        font-size: .93rem;
        max-width: none;
    }
    .talk-copy > p:not(.eyebrow):not(:has(+ h2)) {
        font-size: .93rem;
        max-width: none;
    }
    /* A slim rail flush to the viewport edge keeps the blue plane in the
       composition without any of it landing under the text. Flat here: a 22px
       slice of the panel photo would read as a random stripe. */
    .talk-plate {
        top: 56px;
        bottom: 56px;
        right: 0;
        width: 22px;
        min-width: 0;
        border-right: 0;
        border-color: rgba(255, 255, 255, .12);
        border-left-color: rgba(75, 163, 215, .45);
        background-image: linear-gradient(0deg, rgba(75, 163, 215, .5) 0%, rgba(7, 6, 99, .55) 100%);
    }
    /* Crop marks read as artifacts at this scale. */
    .talk-plate:before,
    .talk-plate:after {
        display: none;
    }
    .talk-watermark {
        width: 175px;
    }
    .talk-cta {
        width: 100%;
        min-width: 0;
    }
}

/* ==========================================================================
   Selected Transactions (Track Record page)
   ========================================================================== */
.transactions-section {
    background: #fff;
    border-top: 1px solid var(--avenue-line);
    padding: 100px 0 120px;
}
.transactions-intro {
    max-width: 640px;
}
.transaction-controls {
    align-items: flex-end;
    border-bottom: 1px solid var(--avenue-line);
    border-top: 1px solid var(--avenue-line);
    display: flex;
    flex-wrap: wrap;
    gap: 22px 26px;
    margin-bottom: 48px;
    padding: 26px 0;
}
.transaction-control {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.transaction-control-label {
    color: var(--avenue-muted);
    font-size: .65rem;
    font-weight: 600;
    letter-spacing: .14em;
    text-transform: uppercase;
}
.transaction-select {
    -webkit-appearance: none;
    appearance: none;
    background-color: #fff;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23070663' stroke-width='1.6'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-position: right 12px center;
    background-repeat: no-repeat;
    background-size: 15px;
    border: 1px solid var(--avenue-line);
    border-radius: 0;
    color: var(--avenue-ink);
    font-family: inherit;
    font-size: .8rem;
    font-weight: 500;
    min-width: 175px;
    padding: 12px 38px 12px 14px;
}
.transaction-count {
    color: var(--avenue-muted);
    font-size: .7rem;
    font-variant-numeric: tabular-nums;
    letter-spacing: .1em;
    margin: 0 0 0 auto;
    text-transform: uppercase;
}
.transaction-grid {
    display: grid;
    gap: 46px 30px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}
.property-image-placeholder {
    align-items: center;
    background: var(--avenue-pale);
    border-top: 1px solid var(--avenue-line);
    color: var(--avenue-navy);
    display: flex;
    height: 245px;
    justify-content: center;
}
.property-image-placeholder svg {
    height: 42px;
    opacity: .28;
    width: 42px;
}
.transaction-pagination {
    margin-top: 54px;
}
.transaction-pages {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    list-style: none;
    margin: 0;
    padding: 0;
}
.transaction-pages .page-numbers {
    align-items: center;
    border: 1px solid var(--avenue-line);
    color: var(--avenue-navy);
    display: flex;
    font-size: .78rem;
    font-weight: 600;
    height: 46px;
    justify-content: center;
    min-width: 46px;
    padding: 0 12px;
    text-decoration: none;
}
.transaction-pages a.page-numbers:hover {
    border-color: var(--avenue-navy);
}
.transaction-pages .page-numbers.current {
    background: var(--avenue-navy);
    border-color: var(--avenue-navy);
    color: #fff;
}
.transaction-pages .page-numbers.dots {
    border-color: transparent;
    color: var(--avenue-muted);
}
.transaction-empty {
    border-top: 1px solid var(--avenue-line);
    color: var(--avenue-muted);
    font-size: .9rem;
    margin: 0;
    padding: 46px 0;
    text-align: center;
}
.transaction-reset {
    border-bottom: 1px solid currentColor;
    color: var(--avenue-navy);
    font-weight: 600;
    padding-bottom: 2px;
    text-decoration: none;
}
.transaction-reset:hover {
    color: var(--sweep-hover);
}
/* Feedback for the reload a filter triggers; aria-busy carries the same state to AT. */
.transactions-section.is-busy .transaction-controls,
.transactions-section.is-busy .transaction-grid,
.transactions-section.is-busy .transaction-pagination {
    opacity: .5;
}
/* The section is a focus target after a filtered reload, not an interactive control. */
.transactions-section:focus {
    outline: none;
}
/* The global focus ring at the top of this file covers a, button and [tabindex]; these controls need their own. */
.transaction-select:focus-visible,
.transaction-pages .page-numbers:focus-visible,
.transaction-reset:focus-visible {
    outline: 3px solid var(--avenue-blue);
    outline-offset: 3px;
}
@media (prefers-reduced-motion: no-preference) {
    .transaction-select {
        transition: border-color .2s ease;
    }
    .transactions-section .transaction-controls,
    .transactions-section .transaction-grid,
    .transactions-section .transaction-pagination {
        transition: opacity .2s ease;
    }
}
@media (max-width: 991.98px) {
    .transactions-section {
        padding: 80px 0 90px;
    }
    .transaction-grid {
        gap: 40px 30px;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 575.98px) {
    .transactions-section {
        padding: 65px 0 75px;
    }
    .transaction-control {
        flex: 1 1 100%;
    }
    .transaction-select {
        min-width: 0;
        width: 100%;
    }
    .transaction-count {
        margin-left: 0;
        width: 100%;
    }
    .transaction-grid {
        gap: 36px;
        grid-template-columns: minmax(0, 1fr);
    }
    .transactions-section .transaction-card .property-copy h3 {
        min-height: 0;
    }
    .property-image-placeholder {
        height: 335px;
    }
}

/* ==========================================================================
   Responsive and cross-browser hardening
   1920 wide is the approved reference, so every rule below is scoped to a
   smaller viewport or to touch. Nothing above this line moves on desktop.
   ========================================================================== */

/* A tap answers back, and the 300ms wait for a possible double-tap goes away. */
.avenue-home a,
.avenue-home button,
.avenue-home summary {
    -webkit-tap-highlight-color: rgba(75, 163, 215, .22);
    touch-action: manipulation;
}

/* The collapsed menu used to sit in the page flow: opening it shoved the whole
   document down and left a navy box ending in mid-air over white content, which
   read differently on every page. It is now a fixed sheet, and the bar turns navy
   with it so bar and menu are one surface wherever you open them. */
@media (max-width: 991.98px) {
    .navbar-collapse {
        position: fixed;
        top: calc(var(--avenue-header-height, 92px) + var(--avenue-header-offset, 0px));
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 19;
        margin: 0;
        display: flex;
        flex-direction: column;
        padding: 22px 24px calc(30px + env(safe-area-inset-bottom));
        background: var(--avenue-navy);
        overflow-y: auto;
        /* Bootstrap tweens height, and a sheet pinned top-to-bottom has none to tween. */
        transition: none;
    }
    .navbar-collapse .navbar-nav {
        flex: 0 0 auto;
        width: 100%;
        /* ms-auto centres the bar on desktop; in a column it shoves the sheet's
           links against the right edge instead. */
        margin-left: 0 !important;
    }
    .navbar-collapse.collapsing {
        height: auto !important;
    }
    /* A full-height sheet leaves a field of empty navy; the two phone actions go there. */
    .nav-sheet-contact {
        display: flex;
        flex: 0 0 auto;
        width: 100%;
        flex-direction: column;
        align-items: flex-start;
        margin-top: auto;
        padding-top: 26px;
        border-top: 1px solid rgba(255, 255, 255, .16);
    }
    .nav-sheet-label {
        font-size: .62rem;
        letter-spacing: .18em;
        text-transform: uppercase;
        color: #7fa8cc;
        margin-top: 18px;
    }
    .nav-sheet-contact a {
        display: inline-flex;
        align-items: center;
        min-height: 44px;
        font-size: .95rem;
        color: #fff;
    }
    .nav-sheet-contact a:hover {
        color: var(--avenue-blue);
    }
    body:has(#avenue-navigation.show) .avenue-header {
        background: var(--avenue-navy);
        border-bottom-color: rgba(255, 255, 255, .16);
        box-shadow: none;
    }
    body:has(#avenue-navigation.show) .header-logo-white {
        display: block;
    }
    body:has(#avenue-navigation.show) .header-logo-color {
        display: none;
    }
    body:has(#avenue-navigation.show) .avenue-header .nav-link {
        color: #fff;
    }
    body:has(#avenue-navigation.show) .navbar-toggler {
        border-color: rgba(255, 255, 255, .45);
    }
    body:has(#avenue-navigation.show) .navbar-toggler span {
        background: #fff;
    }
    /* The page behind a full-height sheet must not scroll under it. */
    body:has(#avenue-navigation.show) {
        overflow: hidden;
    }
    .navbar-toggler span {
        transition: transform .25s ease;
    }
    .navbar-toggler[aria-expanded="true"] span:first-child {
        transform: translateY(3px) rotate(45deg);
    }
    .navbar-toggler[aria-expanded="true"] span:last-child {
        transform: translateY(-3px) rotate(-45deg);
    }
}

/* The chevron inherits the 1.85 body leading, which stretches the link's line box
   to 42px and leaves the underline floating 20px under the label. */
@media (max-width: 991.98px) {
    .text-link > span:not(.text-link-label) {
        line-height: 1;
    }
}
@media (min-width: 992px) {
    .nav-sheet-contact {
        display: none;
    }
}

/* The relationship heading is set with hard breaks for the desktop measure. On a
   narrow column those breaks fight the natural wrap and strand words. */
@media (max-width: 991.98px) {
    .relationship-section h2 br {
        display: none;
    }
}

/* The bar is pushed down by the admin strip, so the sheet has to start below it. */
.admin-bar {
    --avenue-header-offset: 32px;
}
@media (max-width: 575.98px) {
    .admin-bar {
        --avenue-header-offset: 46px;
    }
}

@media (prefers-reduced-motion: no-preference) and (max-width: 991.98px) {
    #avenue-navigation.show .nav-item {
        animation: avenue-menu-in .42s cubic-bezier(.22, 1, .36, 1) both;
    }
    #avenue-navigation.show .nav-item:nth-child(2) {
        animation-delay: .06s;
    }
    #avenue-navigation.show .nav-item:nth-child(3) {
        animation-delay: .12s;
    }
    #avenue-navigation.show .nav-item:nth-child(4) {
        animation-delay: .18s;
    }
    #avenue-navigation.show .nav-item:nth-child(5) {
        animation-delay: .24s;
    }
}
@keyframes avenue-menu-in {
    from {
        opacity: 0;
        transform: translateY(14px);
    }
    to {
        opacity: 1;
        transform: none;
    }
}

/* iOS Safari ignores background-attachment: fixed and Android Chrome sizes it to
   the visual viewport, so these cover crops arrive zoomed and soft. */
@media (max-width: 991.98px) {
    .numbers-section,
    .contact-section,
    .avenue-footer {
        background-attachment: scroll;
    }
    .navbar-toggler {
        min-height: 44px;
    }
    /* Below the desktop breakpoint the pointer may be a thumb, so the rows that
       carry links grow to a comfortable target without changing their type. */
    .avenue-footer nav a,
    .avenue-footer .col-lg-4 > a {
        display: flex;
        align-items: center;
        min-height: 44px;
        margin-bottom: 0;
    }
    .team-links a {
        min-height: 44px;
    }
    /* Hit boxes, not painted boxes: the pill and the underlined link keep their
       exact size, only the area that accepts a tap grows. */
    .property-deal,
    .text-link {
        position: relative;
    }
    .property-deal:after {
        content: '';
        position: absolute;
        inset: -9px -6px;
    }
    .section-heading .text-link:after {
        content: '';
        position: absolute;
        inset: -8px -4px;
    }
}

/* Under 16px iOS zooms the whole page into the field and leaves it there. Tablets
   count: the 768-991 range is thumb territory as much as the phone range is. */
@media (max-width: 991.98px) {
    .contact-form-wrapper .form-control,
    .contact-form-wrapper .form-select,
    .buyer-overlay-form .form-control,
    .transaction-select {
        font-size: 1rem;
    }
    /* Leaflet 1.7 keeps its zoom control at 30px even with .leaflet-touch, and its
       stylesheet prints after this one, so the id is what makes the override land. */
    #contact-map .leaflet-bar a {
        width: 44px;
        height: 44px;
        line-height: 44px;
    }
    .direct-contact-links {
        gap: 6px;
    }
    .direct-contact-links .contact-link {
        min-height: 44px;
        /* An email address is one unbreakable token; let it fold instead of
           running into the card's border at 320. */
        flex-wrap: wrap;
        overflow-wrap: anywhere;
    }
    /* The name is a second route to the profile the portrait already opens; 20px of
       text should still answer a thumb. */
    .team-card .team-name a {
        position: relative;
    }
    .team-card .team-name a:after {
        content: '';
        position: absolute;
        inset: -12px -4px;
    }
}

/* The credits line stays side by side down to 576, where the links are inline text
   and so only as tappable as their 15px line box. Padding grows the box, not the row. */
@media (max-width: 991.98px) and (min-width: 576px) {
    .footer-bottom a {
        display: inline-block;
        padding: 11px 0;
    }
}

/* A landscape phone is short before it is narrow -- 100dvh is about 390px of
   room there, so the hero sheds its bottom padding and one step of type. */
@media (max-height: 620px) and (orientation: landscape) and (max-width: 1023px) {
    .hero-content {
        padding-bottom: 76px;
    }
    .hero h1 {
        font-size: clamp(1.9rem, 4.6vh + 1rem, 2.9rem);
    }
    .hero-bottom {
        bottom: 14px;
    }
    .section-space {
        padding: 65px 0;
    }
}

/* Once the hero is taller than the window it stops centring, so its own padding is
   all that keeps the eyebrow clear of the fixed bar. 110px was 5px short of the bar
   at 1920x600 and 16px short on a landscape phone; the measured height cannot drift.
   Scoped by height so the 1080 reference layout is untouched. */
@media (max-height: 780px) {
    .hero-content {
        padding-top: calc(var(--avenue-header-height, 115px) + 14px);
    }
}

@media (max-width: 575.98px) {
    /* Each dot claimed a fixed 48px and pushed "03 / 04" onto a second line. The
       dots take the flexible middle column instead and the bars absorb the space. */
    .hero-controls {
        grid-template-columns: auto minmax(0, 1fr) auto;
        gap: 12px;
    }
    .hero-dots {
        min-width: 0;
    }
    .hero-dots button {
        width: auto;
        flex: 1 1 0;
        min-width: 16px;
        max-width: 44px;
    }
    .hero-dots button:before {
        left: 4px;
        right: 4px;
        width: auto;
        transform: translateY(-50%);
    }
    /* The micro-labels were sized for a 1320px column; at 342px they fell under 11px. */
    .property-status,
    .transaction-meta {
        font-size: .72rem;
    }
    .property-location,
    .principle-top span {
        font-size: .75rem;
    }
    .transaction-meta strong {
        font-size: .78rem;
    }
    .slider-position {
        font-size: .7rem;
    }
    .team-role {
        font-size: .66rem;
    }
    /* Social links drop their labels here and collapse to 24px boxes. */
    .team-links a {
        gap: 0;
        min-width: 44px;
        min-height: 44px;
    }
    .team-single-copy .team-links a {
        height: 44px;
    }
    .footer-bottom span {
        /* "Commercial Real Estate Websites by FocusedCRE" is one sentence; the
           block-level anchors were breaking it into three stacked lines. */
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 4px 6px;
        min-height: 44px;
    }
    .footer-bottom a {
        display: inline-flex;
        align-items: center;
        min-height: 44px;
        padding: 0;
        margin-top: 0;
    }
    /* Three 44px icons must still share one line inside a 156px card. */
    .team-card .team-links {
        gap: 6px;
    }
    .slider-buttons button {
        width: 44px;
        height: 44px;
    }
}

/* Under 430 the single control row cannot hold a pause button, four 44px dots and
   the counter, so the dots take the line and the pair drops below it. */
@media (max-width: 430px) {
    .hero-controls {
        grid-template-columns: auto minmax(0, 1fr);
        gap: 10px 12px;
    }
    .hero-dots {
        grid-column: 1 / -1;
        grid-row: 1;
    }
    .hero-pause {
        grid-column: 1;
        grid-row: 2;
        justify-self: start;
    }
    .hero-count {
        grid-column: 2;
        grid-row: 2;
        justify-self: end;
    }
    /* Two rows of controls now live inside the hero's bottom padding. */
    .hero-content {
        padding-bottom: 132px;
    }
}

/* The portrait files on hand are 500x600, and stacked full-bleed they were being
   drawn 681px wide on a tablet -- a headshot stretched past its own resolution.
   On a tablet it sits beside the bio; on a phone it stays near 1:1 with the file. */
@media (max-width: 991.98px) and (min-width: 576px) {
    .team-single-section .col-lg-4 {
        flex: 0 0 320px;
        width: 320px;
    }
    .team-single-section .col-lg-7 {
        flex: 1 1 300px;
        width: auto;
    }
}
@media (max-width: 575.98px) {
    .team-single-portrait {
        max-width: 240px;
    }
}
/* Stacked, the bio used to start flush against the photo's bottom edge. */
@media (max-width: 991.98px) {
    .team-single-portrait {
        margin-bottom: 36px;
    }
}

/* 320-380 is where the display sizes stop fitting the measure. */
@media (max-width: 380px) {
    .hero h1 {
        font-size: 2.35rem;
    }
    .contact-section h2,
    .talk-section h2 {
        font-size: 2.15rem;
    }
    .relationship-section h2 {
        font-size: 2rem;
    }
}

/* Phones get one card per row. The card is then capped at the desktop card's own
   width (342px), so a single column never stretches a 500px portrait past its
   resolution and the name, role and icon row each keep to one line. */
@media (max-width: 767.98px) {
    .team-card {
        max-width: 300px;
    }
}