/* Listing follows the same 12 / 8 / 4-column field in every locale.
   Grid line 1 follows inline-start, so RTL preserves reading order. */
html:is([lang=en],[lang=he],[lang=ar]) #projects-inner#projects-inner details.project > summary {display:grid!important;grid-template-columns:repeat(12,minmax(0,1fr))!important;column-gap:var(--wl-gap,24px)!important;row-gap:12px!important;align-items:center!important;padding-block:24px!important}
html:is([lang=en],[lang=he],[lang=ar]) #projects-inner#projects-inner details.project > summary > .project-number {grid-column:1!important;grid-row:1!important;justify-self:start!important;font-variant-numeric:tabular-nums}
html:is([lang=en],[lang=he],[lang=ar]) #projects-inner#projects-inner details.project > summary > h3 {grid-column:2 / 5!important;grid-row:1!important;min-width:0;text-align:start!important}
html:is([lang=en],[lang=he],[lang=ar]) #projects-inner#projects-inner details.project > summary > .project-category {grid-column:5 / 8!important;grid-row:1!important;min-width:0;white-space:normal!important;overflow:visible!important;text-overflow:clip!important;overflow-wrap:break-word!important;text-align:start!important}
html:is([lang=en],[lang=he],[lang=ar]) #projects-inner#projects-inner details.project > summary > .project-year {grid-column:8 / 12!important;grid-row:1!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:var(--wl-gap,24px)!important;align-items:center;min-width:0;white-space:nowrap!important}
html:is([lang=en],[lang=he],[lang=ar]) #projects-inner#projects-inner details.project > summary > .project-plus {grid-column:12!important;grid-row:1!important;justify-self:end!important}
html:is([lang=en],[lang=he],[lang=ar]) #projects-inner#projects-inner details.project > summary .wl-case-stage {grid-column:2!important;justify-self:start!important}
@media(max-width:1099px){html:is([lang=en],[lang=he],[lang=ar]) #projects-inner#projects-inner details.project > summary {grid-template-columns:repeat(8,minmax(0,1fr))!important}html:is([lang=en],[lang=he],[lang=ar]) #projects-inner#projects-inner details.project > summary > h3 {grid-column:2 / 5!important}html:is([lang=en],[lang=he],[lang=ar]) #projects-inner#projects-inner details.project > summary > .project-category {grid-column:5 / 8!important}html:is([lang=en],[lang=he],[lang=ar]) #projects-inner#projects-inner details.project > summary > .project-year {grid-column:2 / 8!important;grid-row:2!important}html:is([lang=en],[lang=he],[lang=ar]) #projects-inner#projects-inner details.project > summary > .project-plus {grid-column:8!important;grid-row:1 / 3!important}}
@media(max-width:760px){html:is([lang=en],[lang=he],[lang=ar]) #projects-inner#projects-inner details.project > summary {grid-template-columns:repeat(4,minmax(0,1fr))!important;column-gap:16px!important;row-gap:8px!important;padding-block:20px!important}html:is([lang=en],[lang=he],[lang=ar]) #projects-inner#projects-inner details.project > summary > .project-number {grid-column:1!important;grid-row:1!important;align-self:start}html:is([lang=en],[lang=he],[lang=ar]) #projects-inner#projects-inner details.project > summary > h3 {grid-column:2 / 4!important;grid-row:1!important}html:is([lang=en],[lang=he],[lang=ar]) #projects-inner#projects-inner details.project > summary > .project-category {grid-column:2 / 5!important;grid-row:2!important}html:is([lang=en],[lang=he],[lang=ar]) #projects-inner#projects-inner details.project > summary > .project-year {grid-column:2 / 5!important;grid-row:3!important;margin-top:4px;grid-template-columns:minmax(76px,1fr) minmax(0,152px)!important;gap:12px!important}html:is([lang=en],[lang=he],[lang=ar]) #projects-inner#projects-inner details.project > summary > .project-plus {grid-column:4!important;grid-row:1!important;align-self:start}}

/* Keep the metadata grid in reading order and isolate Latin date ranges. */
html[dir=rtl] #projects-inner#projects-inner details.project > summary > .project-year {direction:rtl!important;unicode-bidi:normal!important}
html #projects-inner details.project > summary .wl-project-date {direction:ltr;unicode-bidi:isolate;white-space:nowrap}

/* LAB reverse: mirror column placement without reversing Hebrew or Arabic text. */
html[dir=rtl].wl-reading-reversed #projects-inner#projects-inner details.project > summary {direction:ltr!important}
html[dir=rtl].wl-reading-reversed #projects-inner#projects-inner details.project > summary > :is(h3,.project-category) {direction:rtl;text-align:left!important}
html[dir=rtl].wl-reading-reversed #projects-inner#projects-inner details.project > summary > .project-year {direction:ltr!important}
html[dir=rtl].wl-reading-reversed #projects-inner#projects-inner details.project > summary .wl-case-stage {direction:rtl}

/* Align the multilingual index to the same inline-start grid, preserving LTR names and dates. */
html[dir=rtl]:not(.wl-reading-reversed) #projects-inner#projects-inner details.project > summary { direction:rtl!important; }
html[dir=rtl]:not(.wl-reading-reversed) #projects-inner#projects-inner details.project > summary > h3,
html[dir=rtl]:not(.wl-reading-reversed) #projects-inner#projects-inner details.project > summary > .project-category { direction:rtl!important; text-align:right!important; justify-self:stretch!important; unicode-bidi:plaintext; }
html[dir=rtl]:not(.wl-reading-reversed) #projects-inner#projects-inner details.project > summary > .project-number { text-align:right!important; }
html[dir=rtl] #projects-inner#projects-inner details.project > summary .wl-project-date { direction:ltr!important; unicode-bidi:isolate!important; display:inline-block; }