/* =====================================================================
   WLG — Feedback Round 2 design overrides (hand-authored, no SCSS build).
   ===================================================================== */

/* ----- Item 31: associate (non-partner) attorney "About" bio -----
   Remove the photo, drop the dark card box, center the text, make it blue.
   Partners (Gregory, Jany) are excluded (no .wlg-assoc-bio class). */
.wlg-assoc-bio .section-feature-content .media-ratio-square,
.wlg-assoc-bio .media-ratio-square {
    display: none !important;
}

.wlg-assoc-bio .card.dark-bg.editor {
    grid-column: 1 / -1 !important;     /* full width instead of col-6 */
    background: transparent !important; /* remove the dark box */
    padding: 0 !important;
    text-align: center;
    align-items: center;                /* the box is display:flex */
    max-width: 940px;
    margin-inline: auto;
}

.wlg-assoc-bio .card.dark-bg.editor,
.wlg-assoc-bio .card.dark-bg.editor :where(p, li, span, h2, h3, strong, em) {
    color: var(--Blue-1, #0f172a) !important;  /* blue text */
}

/* ----- Item 56: partner banner photos as clean red-gradient circles -----
   The red-gradient photos already carry the red circle; crop to a circle so the
   square white corners are clipped. */
.partner-banners__image {
    border-radius: 50% !important;
    overflow: hidden;
    aspect-ratio: 1 / 1;
    flex: 0 0 auto;
    align-self: center;
}
.partner-banners__image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
}

/* ----- Item 27: Florida attorney grid -----
   Partners (first 2) on top as red circles; the 10 associates below in rows of 5,
   circle only (no square card). Scoped to the Florida pages (ES 10217 / EN 9921). */
.page-id-10217 .section-team .grid-cols-2,
.page-id-9921  .section-team .grid-cols-2 {
    display: grid !important;
    grid-template-columns: repeat(10, 1fr);
    justify-items: center;
    align-items: start;
    gap: 48px 24px;
}
.page-id-10217 .section-team__card,
.page-id-9921  .section-team__card {
    flex-direction: column;
    align-items: center;
    text-align: center;
    background: transparent !important;   /* drop the square box */
    padding: 0 !important;
    gap: 16px !important;
    width: 100%;
}
.page-id-10217 .section-team__image,
.page-id-9921  .section-team__image {
    border-radius: 50% !important;
    overflow: hidden;
    aspect-ratio: 1 / 1;
    width: 100%;
    max-width: 150px;
}
.page-id-10217 .section-team__image img,
.page-id-9921  .section-team__image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
}
/* partners (first two): own top row, larger circles */
.page-id-10217 .section-team__card:nth-child(-n+2),
.page-id-9921  .section-team__card:nth-child(-n+2) {
    grid-column: span 5;
}
.page-id-10217 .section-team__card:nth-child(-n+2) .section-team__image,
.page-id-9921  .section-team__card:nth-child(-n+2) .section-team__image {
    max-width: 200px;
}
/* associates: five per row (span 2 of 10 cols) */
.page-id-10217 .section-team__card:nth-child(n+3),
.page-id-9921  .section-team__card:nth-child(n+3) {
    grid-column: span 2;
}

/* ----- Post-deploy fix: remove the gray background box behind team photos -----
   Only the provided images should show, no #f5f5f5 backing. */
.section-team__image {
    background: transparent !important;
}

/* ----- Item 27: team photos cropped to clean circles -----
   The red-gradient partner photos carry white square corners; crop every team
   image to a circle so the corners are clipped and partners read as red circles. */
.section-team__image,
.section-team__image img {
    border-radius: 50% !important;
}
.section-team__image {
    overflow: hidden;
    aspect-ratio: 1 / 1;
}

/* ----- Item 62: careers job widget — rows had white text (half invisible). Force
   readable dark text on light alternating rows. ----- */
#job-widget-section .srJobListJobOdd,
#job-widget-section .srJobListJobEven,
#job-widget-section .srJobListJobOdd *,
#job-widget-section .srJobListJobEven * {
    color: #1a1a1a !important;
}
#job-widget-section .srJobListJobEven { background: #f4f5f7 !important; }
#job-widget-section .srJobListJobOdd { background: #ffffff !important; }
#job-widget-section td { padding: 12px 16px !important; }

/* ----- Item 9: Home "Meet Our Partners" — bigger, circular photos + hover, clickable to bios ----- */
.home .section-team__image,
.page-id-10153 .section-team__image {
    border-radius: 50% !important;
    aspect-ratio: 1 / 1;
    width: 100%;
    max-width: 340px;
    margin-inline: auto;
    transition: transform .25s ease;
}
.home .section-team__card,
.page-id-10153 .section-team__card { cursor: pointer; }
.home .section-team__card:hover .section-team__image,
.page-id-10153 .section-team__card:hover .section-team__image {
    transform: scale(1.04);
}

/* ----- Item 27: associate names occupy two lines (consistent card height) -----
   Some names wrap to 2 lines (Alejandro J. Leal) and others to 1 (Landy Rojas);
   reserve 2 lines so every team card aligns. */
.section-team__card .h3 {
    min-height: 2.5em;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    text-align: center;
}

/* ----- Florida/Miami-Lakes claims left column: supporting image ----- */
.section-claims .claims-left-img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 16px;
    margin-top: 32px;
}

/* ----- Items 29/37/39: claims-grid right column rendered as an accordion -----
   Reuses the theme's .accordion component; these tweaks just space the items on
   the dark card. */
.claims-accordion.accordion {
    width: 100%;
    display: flex;
    flex-direction: column;
}
.claims-accordion .accordion__item + .accordion__item {
    border-top: 1px solid rgba(255, 255, 255, 0.12);
}
.claims-accordion .accordion__btn {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    text-align: left;
    padding: 24px 0;
}
.claims-accordion .accordion__content article {
    padding-bottom: 24px;
}

/* ----- Items 18/23/28/32/55: show award/press badges in color -----
   The tickertape logos were rendered grayscale via .is-bw; the source images are
   color, so drop the filter to show them in full color. */
.tickertape.is-bw .logos-sliders__image,
.tickertape .logos-sliders__image {
    filter: none !important;
}

/* ----- Gabriel (Where We Practice pages): hero_type_4 → image as a full-width
   banner on top, content box below. Scoped to .hero--type-4 (only location
   pages use it; attorneys=type_1, home=type_0, services=type_2). ----- */
.hero--type-4-stacked .hero__inner {
    display: flex !important;
    flex-direction: column !important;
    gap: 32px;
}
.hero--type-4-stacked .hero__heading {   /* title outside, above the banner */
    order: 0;
    width: 100%;
}
.hero--type-4-stacked .hero__image {     /* image as a full-width banner */
    order: 1 !important;
    width: 100% !important;
    max-width: none !important;
}
.hero--type-4-stacked .hero__content {   /* content box below */
    order: 2;
    width: 100% !important;
    max-width: none !important;
}
@media (min-width: 768px) {
    .hero--type-4-stacked .hero__image { aspect-ratio: 16 / 9 !important; }
}

/* ----- Gabriel (service pages): content_portrait → photo horizontal on top,
   text in a horizontal box below (bullets in two columns). Desktop only;
   mobile already stacks. ----- */
@media (min-width: 768px) {
    .content-portrait .content-portrait__grid {
        grid-template-columns: 1fr !important;
    }
    .content-portrait .content-portrait__media-item {
        order: -1 !important;
        width: 100% !important;
        max-width: none !important;
        aspect-ratio: 16 / 9 !important;
    }
    .content-portrait .content-portrait__content {
        order: 1;
        max-width: none !important;
    }
    .content-portrait .content-portrait__list {
        display: grid !important;
        grid-template-columns: 1fr 1fr;
        gap: 24px 48px;
    }
}

/* ----- Item 40: CTA button text white -----
   The default (red) .main-button rendered dark text. White is correct on the red
   fill. The white/border/tab variants intentionally use dark text, so exclude them. */
.main-button:not(.main-button--white):not(.main-button--border):not(.main-button--tab),
.main-button:not(.main-button--white):not(.main-button--border):not(.main-button--tab) .icon {
    color: #fff !important;
}

/* ----- Item 34: "Service Page Photos" (Greg/Jany on the crashed vehicle) are portrait
   studio shots on a white background. In the 16:9 content_portrait banner the default
   object-fit:cover center-cropped them and cut off the attorney's head. Show the full
   photo with object-fit:contain on white (the white letterbox blends into the page).
   Scoped to the service pages that received a photo (Bus has none, keeps its generic). */
.page-id-175 .content-portrait .universal-media__image,
.page-id-9829 .content-portrait .universal-media__image,
.page-id-9831 .content-portrait .universal-media__image,
.page-id-9833 .content-portrait .universal-media__image,
.page-id-9838 .content-portrait .universal-media__image,
.page-id-10167 .content-portrait .universal-media__image,
.page-id-10168 .content-portrait .universal-media__image,
.page-id-10169 .content-portrait .universal-media__image,
.page-id-10171 .content-portrait .universal-media__image,
.page-id-10172 .content-portrait .universal-media__image {
    object-fit: contain !important;
    background: #fff;
}

/* ----- Items 37/39 + revisions-doc "Mixed Case" requests: intro/body paragraphs using
   the .h4 utility were forced to ALL-CAPS, hurting readability. Restore normal case for
   ALL such body paragraphs (claims grids + content sections across the service/location
   pages). Targets <p class="color-mix h4"> only — real headings (<h2>/<h3>) and eyebrow
   labels (<span>) are untouched. ----- */
p.color-mix.h4,
.section-claims p.color-mix.h4 {
    text-transform: none !important;
}

/* ----- Item 71: the Home video was set to a squished ~2.7:1 aspect ratio. Restore a
   standard 16:9 video height (the "regular size" the client asked for). Scoped to Home. ----- */
.page-id-2 .split-cta__media.media-ratio,
.page-id-10153 .split-cta__media.media-ratio {
    aspect-ratio: 16 / 9 !important;
}

/* ----- NY "Real Clients, Real Results" — text in one column, team photo in the other
   (2-col side-by-side instead of text-on-top / full-width image below). Scoped by the
   section_id set on constructor_1. ----- */
#ny-real-clients .grid-cols-12.row-gap-50 { align-items: stretch; }   /* image matches the combined text height */
#ny-real-clients .grid-cols-12.row-gap-50 > .grid-cols-2 {
    grid-column: span 6 !important;
    grid-template-columns: 1fr !important;   /* all the text stacked in one column */
    align-content: center;
}
#ny-real-clients .grid-cols-12.row-gap-50 > .split-cta__media {
    grid-column: span 6 !important;
    aspect-ratio: auto !important;
    min-height: 100%;
}
#ny-real-clients .split-cta__media .universal-media__image {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
}
@media (max-width: 900px) {
    #ny-real-clients .grid-cols-12.row-gap-50 > .grid-cols-2,
    #ny-real-clients .grid-cols-12.row-gap-50 > .split-cta__media { grid-column: 1 / -1 !important; }
    #ny-real-clients .grid-cols-12.row-gap-50 > .split-cta__media { aspect-ratio: 4 / 3 !important; min-height: 0; }
}

/* ----- NY "We Will Fight to Get You What You Deserve" — 535 Fifth Ave building photo
   beside the blue box (claims-grid right column, rendered when there's no accordion list
   and the page sets wlg_claims_side_img). Fill the column, matching the box height. ----- */
.wlg-claims-side-img { overflow: hidden; padding: 0 !important; }
.wlg-claims-side-img img {
    width: 100%; height: 100%; min-height: 100%;
    object-fit: cover; object-position: center;
    border-radius: 16px; display: block;
}

/* ----- Item 12: Home mission_split photo (WL_003, 2:1 landscape) was cover-cropped to
   ~50% width in the tall column ("too cut off"). Show it whole (contain), top-aligned. ----- */
.home .mission-split .universal-media__image,
.page-id-2 .mission-split .universal-media__image,
.page-id-10153 .mission-split .universal-media__image {
    object-fit: contain !important;
    object-position: top center !important;
}

/* ----- Item 29: Florida "Tipos de Casos" claims section — car photo moved to the TOP of
   its box (img reordered before the paragraph in the meta). Pull it up to hug the box top
   and put the breathing room BELOW it (paragraph now sits underneath). Scoped to img-first
   instances so the other claims images (appended after their text) are unaffected. ----- */
.section-claims .claims-left-img:first-child {
    margin-top: 0 !important;
    margin-bottom: 32px;
}

/* ----- Item 31: associate bio spacing — the redesign zeroed padding/centered text but left
   tight line-height + flat paragraph gaps + a crushed heading. Restore vertical rhythm. ----- */
.wlg-assoc-bio .card.dark-bg.editor :where(p, li) {
    line-height: 1.7 !important;
}
.wlg-assoc-bio .card.dark-bg.editor {
    gap: 28px !important;
    padding-top: 8px !important;
}
.wlg-assoc-bio h2.max-w-940 {
    line-height: 1.15 !important;
    margin-bottom: 24px !important;
}

/* ----- Revisions doc (Car etc.): make tags-grid boxes that map to a real practice-area
   page clickable; the <a> fills the dark box and reddens on hover. ----- */
.section-tags li a.tags-grid__link {
    width: 100%; height: 100%;
    display: flex; align-items: center;
    color: inherit; transition: color .2s ease;
}
.section-tags li a.tags-grid__link:hover { color: #e2231a; }