/* SEO overhaul components: breadcrumbs, byline, consult CTA, related links.
   Plain CSS on purpose — no build pipeline required. */

.breadcrumbs {
    font-size: 0.85rem;
    margin: 0 0 1rem;
}
.breadcrumbs ol {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}
.breadcrumbs li {
    display: flex;
    align-items: center;
    gap: 0.35rem;
}
.breadcrumbs li + li::before {
    content: "\203A";
    opacity: 0.5;
}
.breadcrumbs a {
    text-decoration: none;
}
.breadcrumbs span[aria-current] {
    opacity: 0.7;
}

.eeat-byline {
    margin: 0.25rem 0 1.25rem;
    font-size: 0.9rem;
}
.eeat-byline .byline {
    margin: 0 0 0.25rem;
}
.eeat-byline .byline > span + span::before {
    content: "\00B7";
    margin: 0 0.5rem;
    opacity: 0.5;
}
.eeat-byline .reviewed-by {
    margin: 0;
    font-style: italic;
    opacity: 0.85;
}
/* The theme blocks + uppercases bare <time> for its card layouts; inside the
   byline the dates flow inline with their labels on one line (round 10e). */
.eeat-byline .byline time {
    display: inline;
    text-transform: none;
}

.consult-cta {
    margin: 2rem 0;
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-left: 4px solid currentColor;
    border-radius: 6px;
}
.consult-cta .inner {
    padding: 1.5rem;
}
.consult-cta-title {
    margin-top: 0;
}
.consult-cta-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: center;
}
.consult-cta-more {
    display: inline-block;
}

.related-reading {
    margin: 2rem 0;
}
.related-reading ul {
    padding-left: 1.25rem;
}
.related-reading li {
    margin: 0.4rem 0;
}
.related-reading time {
    font-size: 0.85em;
    opacity: 0.7;
}

/* Related-content zone (design pass 2026-08-07): one cream field matching the
   theme's $beige band; the reused card blocks render inside group wrappers so
   their .inner divs escape the .block > .inner padding — the section carries
   the native 5rem/4rem rhythm itself. Cards forced white for AA contrast. */
.practice-related {
    background-color: #efede2;
    padding: 5rem 0 4rem;
}
.practice-related .practice-related-group + .practice-related-group {
    margin-top: 3rem;
}
.practice-related .card > .inner {
    background-color: #fff;
}
/* The native blog block was designed for white pages (no card box), so on
   the cream field its white .inner needs its own padding + radius, and the
   Read More buttons pin to a shared baseline (round 10d, owner screenshot). */
.practice-related .blog-posts .card > .inner {
    padding: 1.25rem 1.25rem 1.5rem;
    border-radius: 10px;
    width: 100%;
}
.practice-related .blog-posts .blog-post .txt {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
}
.practice-related .blog-posts .blog-post .cta {
    margin-top: auto;
    padding-top: 1rem;
}
.practice-related .blog-posts {
    margin: 2rem 0 1rem;
}
/* text-only, whole-card-clickable service links (round 3) */
.related-service-card {
    display: block;
    width: 100%;
    background-color: #fff;
    border-radius: 10px;
    padding: 1.5rem;
    margin-bottom: 1.5rem;
    color: inherit;
    text-decoration: none;
}
.related-service-card .title {
    color: #871711;
    text-transform: uppercase;
    font-size: 1.05rem;
    font-weight: 700;
    margin: 0 0 0.5rem;
}
.related-service-card .teaser {
    color: #334e60;
    font-weight: 300;
    font-size: 0.9rem;
    margin: 0;
}
.related-service-card:hover .title,
.related-service-card:focus-visible .title {
    text-decoration: underline;
}

/* compact horizontal lawyer cards (mega-menu chip proportions) */
.practice-related .area-lawyers {
    margin-top: 3rem;
}
.area-lawyer-card {
    background-color: #fff;
    border-radius: 10px;
    overflow: hidden;
    width: 100%;
    margin-bottom: 1.5rem;
}
.area-lawyer-card .img {
    flex: 0 0 120px;
    display: block;
}
.area-lawyer-card .img img {
    width: 120px;
    height: 100%;
    min-height: 136px;
    object-fit: cover;
    display: block;
}
.area-lawyer-card .txt {
    padding: 1.25rem 1.5rem;
}
.area-lawyer-card .title {
    margin: 0 0 0.25rem;
    text-transform: uppercase;
    font-size: 1.05rem;
    font-weight: 700;
}
.area-lawyer-card .title a {
    color: #57554a;
}
.area-lawyer-card .role {
    color: #73705e;
    font-weight: 300;
    margin-bottom: 0.5rem;
}
.area-lawyer-card .snippet {
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
}
.area-lawyer-card .txt {
    display: flex;
    flex-direction: column;
    width: 100%;
}
.area-lawyer-card .contact-lines {
    list-style: none;
    margin: 0 0 0.5rem;
    padding: 0;
    font-size: 0.9rem;
}
.area-lawyer-card .contact-lines li {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.35rem;
}
.area-lawyer-card .contact-lines .icon {
    width: 22px;
    height: 22px;
    min-width: 22px;
    margin-right: 0;
}
.area-lawyer-card .profile-link {
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    margin-top: auto;
    align-self: flex-end;
}
@media (max-width: 575.98px) {
    .area-lawyer-card {
        flex-direction: column;
    }
    .area-lawyer-card .img,
    .area-lawyer-card .img img {
        width: 100%;
        flex-basis: auto;
        max-height: 260px;
    }
}

/* inline inquiry form inside the consult CTA (round 3: tighter, and only
   real input fields get the box treatment — captcha/hidden holders don't) */
.consult-cta .inner {
    padding: 1.25rem 1.5rem;
}
.consult-cta-title {
    font-size: 1.4rem;
}
/* slim one-row intake (owner call): name + phone (+ dropdown on generic
   pages) + button all on one wrapping line */
.area-inquiry-form {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    align-items: flex-start;
}
.area-inquiry-form fieldset {
    flex: 1 1 300px;
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    border: 0;
    padding: 0;
    margin: 0;
}
.area-inquiry-form .field {
    margin: 0;
}
.area-inquiry-form .field.text,
.area-inquiry-form .field.dropdown {
    flex: 1 1 160px;
}
.area-inquiry-form .field.hidden,
.area-inquiry-form .field.nocaptcha,
.area-inquiry-form .field.captcha {
    flex: 0 0 auto;
    border: 0;
    padding: 0;
    min-height: 0;
}
.area-inquiry-form .btn-toolbar .btn {
    display: inline-block;
    width: auto;
    white-space: nowrap;
    padding: 0.65rem 1.5rem;
    background-color: #57554a;
    color: #fff;
}
.area-inquiry-form .field label.left {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
}
.area-inquiry-form input,
.area-inquiry-form select {
    width: 100%;
    padding: 0.65rem 0.75rem;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 6px;
    background-color: #fff;
}
.area-inquiry-form .btn-toolbar {
    margin: 0;
    flex: 0 0 auto;
}
.area-inquiry-form .message {
    flex-basis: 100%;
    font-weight: 600;
    margin: 0.25rem 0;
}
.area-inquiry-form .message.good {
    color: #1a6b3c;
}
.area-inquiry-form .message.bad,
.area-inquiry-form .message.required {
    color: #871711;
}

/* footer link lists: stacked third column beside the NAP columns (round 3) */
.footer-links-col .footer-practice,
.footer-links-col .footer-menu {
    margin: 0 0 0.75rem;
}
.footer-links-col .footer-links-title {
    /* explicit white: the theme's heading colour is dark and disappears on the footer bg */
    color: #fff;
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    opacity: 0.7;
    margin: 0 0 0.4rem;
}
.footer-links-col .footer-practice ul,
.footer-links-col .footer-menu ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    justify-content: flex-start;
    font-size: 0.9rem;
}
@media (max-width: 991.98px) {
    .footer-links-col {
        margin-top: 1rem;
    }
}
/* desktop: link columns shrink to content and anchor to the right edge
   (aligned under the social icons) instead of floating mid-grid */
@media (min-width: 992px) {
    #footer .footer-links-col {
        flex: 0 0 auto;
        width: auto;
    }
    #footer .footer-col-practice {
        margin-left: auto;
    }
    #footer .footer-col-about {
        margin-left: 3.5rem;
    }
}
/* lowest-intent group: cap to two cards on phones (page runs long) */
@media (max-width: 767.98px) {
    .practice-related .blog-posts .card:nth-child(n+3) {
        display: none;
    }
}

/* client-review chips for the August-2026 round (controller gates them off live envs) */
.review-badge {
    display: inline-block;
    vertical-align: middle;
    margin-left: 0.6rem;
    padding: 0.2rem 0.65rem;
    border-radius: 999px;
    font-size: 0.85rem;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: #fff;
}
.review-badge--new {
    background: #1e7e34;
}
.review-badge--rewrite {
    background: #a05a00;
}

/* keyboard focus ring for pill buttons (theme defines :hover only) */
.btn:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

/* safety net: guarantee the a11y helper exists even if trimmed from the bootstrap build */
.visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.person-credentials {
    margin: 1.5rem 0;
}
.person-credentials dl {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 0.4rem 1.25rem;
    margin: 0;
}
.person-credentials dt {
    font-weight: 600;
}
.person-credentials dd {
    margin: 0;
}
.person-credentials ul {
    margin: 0;
    padding-left: 1.1rem;
}

.footer-menu {
    margin: 0 0 1rem;
}
.footer-menu ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1.5rem;
    justify-content: center;
}