.elementor-22728 .elementor-element.elementor-element-ee1b441{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-22728 .elementor-element.elementor-element-7d76f5ad{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:center;--gap:20px 20px;--row-gap:20px;--column-gap:20px;--flex-wrap:wrap;--overlay-opacity:0.7;--margin-top:0%;--margin-bottom:0%;--margin-left:0%;--margin-right:0%;--padding-top:5%;--padding-bottom:15%;--padding-left:0%;--padding-right:0%;}.elementor-22728 .elementor-element.elementor-element-7d76f5ad:not(.elementor-motion-effects-element-type-background), .elementor-22728 .elementor-element.elementor-element-7d76f5ad > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:transparent;background-image:linear-gradient(180deg, var( --e-global-color-4eec49f ) 0%, var( --e-global-color-4eec49f ) 100%);}.elementor-22728 .elementor-element.elementor-element-7d76f5ad::before, .elementor-22728 .elementor-element.elementor-element-7d76f5ad > .elementor-background-video-container::before, .elementor-22728 .elementor-element.elementor-element-7d76f5ad > .e-con-inner > .elementor-background-video-container::before, .elementor-22728 .elementor-element.elementor-element-7d76f5ad > .elementor-background-slideshow::before, .elementor-22728 .elementor-element.elementor-element-7d76f5ad > .e-con-inner > .elementor-background-slideshow::before, .elementor-22728 .elementor-element.elementor-element-7d76f5ad > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{--background-overlay:'';}.elementor-22728 .elementor-element.elementor-element-d662b16{--e-filter-direction:row;--e-filter-white-space:nowrap;--e-filter-justify-content:center;--e-filter-item-width:initial;--e-filter-item-flex-grow:0;--e-filter-wrap:nowrap;--e-filter-overflow-x:scroll;width:100%;max-width:100%;--e-filter-normal-text-color:var( --e-global-color-116b926 );--e-filter-hover-text-color:var( --e-global-color-0ca1279 );--e-filter-active-text-color:var( --e-global-color-4d72c63 );}.elementor-22728 .elementor-element.elementor-element-d662b16 .e-filter-item:hover:not( [aria-pressed=true] ){background-color:var( --e-global-color-23872a4 );}.elementor-22728 .elementor-element.elementor-element-d662b16 > .elementor-widget-container{margin:0px 0px 25px 0px;}.elementor-22728 .elementor-element.elementor-element-d662b16 .e-filter-item{font-family:var( --e-global-typography-6e87a78-font-family ), Sans-serif;font-size:var( --e-global-typography-6e87a78-font-size );font-weight:var( --e-global-typography-6e87a78-font-weight );text-transform:var( --e-global-typography-6e87a78-text-transform );text-decoration:var( --e-global-typography-6e87a78-text-decoration );line-height:var( --e-global-typography-6e87a78-line-height );letter-spacing:var( --e-global-typography-6e87a78-letter-spacing );}.elementor-22728 .elementor-element.elementor-element-d662b16 .e-filter-item:not( [aria-pressed=true] ):not( :hover ){border-style:solid;border-width:2px 2px 2px 2px;border-color:var( --e-global-color-829b63b );}.elementor-22728 .elementor-element.elementor-element-d662b16 .e-filter-item[aria-pressed="true"]{border-style:solid;border-width:2px 2px 2px 2px;border-color:var( --e-global-color-590c0f9 );}.elementor-22728 .elementor-element.elementor-element-f7c4366{--grid-columns:1;--grid-row-gap:4em;--grid-column-gap:2em;}.elementor-22728 .elementor-element.elementor-element-f7c4366 .elementor-pagination{text-align:center;margin-top:2em;}body:not(.rtl) .elementor-22728 .elementor-element.elementor-element-f7c4366 .elementor-pagination .page-numbers:not(:first-child){margin-left:calc( 2em/2 );}body:not(.rtl) .elementor-22728 .elementor-element.elementor-element-f7c4366 .elementor-pagination .page-numbers:not(:last-child){margin-right:calc( 2em/2 );}body.rtl .elementor-22728 .elementor-element.elementor-element-f7c4366 .elementor-pagination .page-numbers:not(:first-child){margin-right:calc( 2em/2 );}body.rtl .elementor-22728 .elementor-element.elementor-element-f7c4366 .elementor-pagination .page-numbers:not(:last-child){margin-left:calc( 2em/2 );}@media(max-width:1366px){.elementor-22728 .elementor-element.elementor-element-d662b16 .e-filter-item{font-size:var( --e-global-typography-6e87a78-font-size );line-height:var( --e-global-typography-6e87a78-line-height );letter-spacing:var( --e-global-typography-6e87a78-letter-spacing );}}@media(max-width:1024px){.elementor-22728 .elementor-element.elementor-element-d662b16 .e-filter-item{font-size:var( --e-global-typography-6e87a78-font-size );line-height:var( --e-global-typography-6e87a78-line-height );letter-spacing:var( --e-global-typography-6e87a78-letter-spacing );}.elementor-22728 .elementor-element.elementor-element-f7c4366{--grid-columns:1;}}@media(max-width:767px){.elementor-22728 .elementor-element.elementor-element-7d76f5ad{--padding-top:5%;--padding-bottom:30%;--padding-left:0%;--padding-right:0%;}.elementor-22728 .elementor-element.elementor-element-d662b16 .e-filter-item{font-size:var( --e-global-typography-6e87a78-font-size );line-height:var( --e-global-typography-6e87a78-line-height );letter-spacing:var( --e-global-typography-6e87a78-letter-spacing );}.elementor-22728 .elementor-element.elementor-element-f7c4366{--grid-columns:1;}.elementor-22728 .elementor-element.elementor-element-f7c4366 .elementor-pagination{margin-top:3em;}}/* Start custom CSS for container, class: .elementor-element-7d76f5ad *//* =================================================================
   CENTRE[4]ARTS — ARTISTIC SOCIAL PRACTICE ARCHIVE
   Native Elementor TAXONOMY FILTER + LOOP GRID, styled to match the
   hero/intro widget above it and the other archives.

   INSTALL:
   1. Container holding the "Program Archives" filter + loop grid →
      Advanced ▸ CSS ID =  c4-asp-archive        (ID field, no "#")
   2. Paste this into that container's  Advanced ▸ Custom CSS
   3. Set that container's background to #F5F5F5 in Style ▸ Background
      and clear any Background Overlay.

   CARD (per project): landscape image → title → description paragraph
   → "View More" text link. Two across, vertical hairline dividers.

   HOVER: the project image blurs + a "VIEW PROJECT" pill fades in.
   Uses backdrop-filter, so it works whether the image is an <img> OR a
   container background image (like the workshops archive).
   ================================================================= */

#c4-asp-archive{
  --c4-purple:#4E42B5;
  --c4-ink:#111111;
  --c4-surface:#F5F5F5;
  --c4-line:#d8d6cf;
  --c4-muted:#5b584f;
  --c4-body:#26241d;
  background-color:#F5F5F5 !important;
  scroll-margin-top:90px;
  padding-bottom:clamp(40px,5vw,72px);
}
#c4-asp-archive > .elementor-background-overlay,
#c4-asp-archive .elementor-background-overlay{
  background:transparent !important;opacity:0 !important;
}

/* =================================================================
   1) TAXONOMY FILTER — the year buttons
   ================================================================= */
#c4-asp-archive .e-filter{
  display:flex;flex-wrap:wrap;gap:12px;border:0;padding:0;
  margin-bottom:clamp(30px,4vw,48px);
}
#c4-asp-archive .e-filter-item{
  position:relative;overflow:hidden;z-index:0;
  font-family:'League Spartan',sans-serif;
  font-weight:500;text-transform:uppercase;
  font-size:14px;letter-spacing:.12em;line-height:1;
  color:var(--c4-ink) !important;background:transparent !important;
  border:1.5px solid var(--c4-ink) !important;border-radius:0 !important;
  padding:13px 20px;cursor:pointer;transition:color .4s ease;
}
#c4-asp-archive .e-filter-item::before{
  content:"";position:absolute;inset:0;z-index:-1;background:var(--c4-ink);
  transform:scaleX(0);transform-origin:left center;
  transition:transform .5s cubic-bezier(.5,0,.2,1);
}
#c4-asp-archive .e-filter-item > *{position:relative}
#c4-asp-archive .e-filter-item:hover,
#c4-asp-archive .e-filter-item:hover *{color:#fff !important}
#c4-asp-archive .e-filter-item:hover::before{transform:scaleX(1)}

#c4-asp-archive .e-filter-item[aria-pressed="true"],
#c4-asp-archive .e-filter-item[aria-pressed="true"] *,
#c4-asp-archive .e-filter-item.e-active,
#c4-asp-archive .e-filter-item.e-active *,
#c4-asp-archive .e-filter-item.e-filter-item--active,
#c4-asp-archive .e-filter-item.e-filter-item--active *{color:#fff !important}
#c4-asp-archive .e-filter-item[aria-pressed="true"]::before,
#c4-asp-archive .e-filter-item.e-active::before,
#c4-asp-archive .e-filter-item.e-filter-item--active::before{transform:scaleX(1)}
#c4-asp-archive .e-filter-item:focus-visible{outline:2px solid var(--c4-purple);outline-offset:3px}

/* =================================================================
   2) LOOP GRID — two across, vertical hairlines between columns
   ================================================================= */
#c4-asp-archive .elementor-loop-container{
  gap:0 !important;background:transparent !important;
  border-left:1px solid var(--c4-line);
}
#c4-asp-archive .e-loop-item{
  position:relative;
  padding:0 clamp(20px,2.4vw,40px) clamp(30px,3.4vw,48px);
  border-right:1px solid var(--c4-line);
  background:transparent !important;
}

/* ---------- project image: blur + VIEW PROJECT pill ---------- */
#c4-asp-archive .c4asp-img,
#c4-asp-archive .e-loop-item .elementor-widget-image,
#c4-asp-archive .e-loop-item .elementor-widget-theme-post-featured-image{
  position:relative;overflow:hidden;margin-bottom:20px !important;
}
#c4-asp-archive .e-loop-item img{
  display:block;width:100% !important;height:100% !important;
  object-fit:cover;aspect-ratio:4/3;
  transition:transform .8s cubic-bezier(.2,.6,.2,1),filter .5s ease;
}
#c4-asp-archive .e-loop-item:hover img,
#c4-asp-archive .e-loop-item:focus-within img{
  transform:scale(1.04);filter:blur(6px) brightness(.74);
}

/* blur overlay for CONTAINER background-image cards */
#c4-asp-archive .c4asp-img::before{
  content:"";position:absolute;inset:0;z-index:2;pointer-events:none;opacity:0;
  backdrop-filter:blur(6px) brightness(.74);-webkit-backdrop-filter:blur(6px) brightness(.74);
  transition:opacity .5s ease;
}
#c4-asp-archive .e-loop-item:hover .c4asp-img::before,
#c4-asp-archive .e-loop-item:focus-within .c4asp-img::before{opacity:1}

/* VIEW PROJECT pill */
#c4-asp-archive .c4asp-img::after,
#c4-asp-archive .e-loop-item .elementor-widget-image::after,
#c4-asp-archive .e-loop-item .elementor-widget-theme-post-featured-image::after{
  content:"VIEW PROJECT";
  position:absolute;left:50%;top:50%;transform:translate(-50%,-44%) scale(.95);
  z-index:3;pointer-events:none;white-space:nowrap;
  font-family:'League Spartan',sans-serif;font-weight:500;
  text-transform:uppercase;font-size:14px;letter-spacing:.14em;color:#111;
  background:#fff;padding:14px 26px;opacity:0;
  transition:opacity .4s ease,transform .45s cubic-bezier(.2,.6,.2,1);
}
#c4-asp-archive .e-loop-item:hover .c4asp-img::after,
#c4-asp-archive .e-loop-item:hover .elementor-widget-image::after,
#c4-asp-archive .e-loop-item:hover .elementor-widget-theme-post-featured-image::after,
#c4-asp-archive .e-loop-item:focus-within .c4asp-img::after{
  opacity:1;transform:translate(-50%,-50%) scale(1);
}

/* keep template backgrounds from leaking onto widgets */
#c4-asp-archive .e-loop-item .elementor-widget-heading,
#c4-asp-archive .e-loop-item .elementor-widget-button,
#c4-asp-archive .e-loop-item .elementor-widget-text-editor,
#c4-asp-archive .e-loop-item .elementor-widget-theme-post-excerpt,
#c4-asp-archive .e-loop-item .elementor-widget-theme-post-title,
#c4-asp-archive .e-loop-item .elementor-heading-title{
  background:transparent !important;background-color:transparent !important;
}

/* ---------- PROJECT TITLE ---------- */
#c4-asp-archive .e-loop-item .elementor-widget-theme-post-title .elementor-heading-title,
#c4-asp-archive .e-loop-item .elementor-widget-theme-post-title .elementor-heading-title a,
#c4-asp-archive .e-loop-item .elementor-heading-title,
#c4-asp-archive .e-loop-item .elementor-heading-title a{
  font-family:'League Spartan',sans-serif !important;font-weight:500;
  text-transform:uppercase;letter-spacing:.006em;line-height:1.06;
  font-size:clamp(21px,1.9vw,30px) !important;color:var(--c4-ink) !important;
  text-decoration:none !important;transition:color .3s ease;
}
#c4-asp-archive .e-loop-item:hover .elementor-widget-theme-post-title .elementor-heading-title,
#c4-asp-archive .e-loop-item:hover .elementor-widget-theme-post-title .elementor-heading-title a,
#c4-asp-archive .e-loop-item:hover .elementor-heading-title,
#c4-asp-archive .e-loop-item:hover .elementor-heading-title a{
  color:var(--c4-purple) !important;
}
#c4-asp-archive .e-loop-item .elementor-widget-theme-post-title,
#c4-asp-archive .e-loop-item .elementor-widget-heading{
  margin-bottom:12px !important;
}

/* ---------- DESCRIPTION (excerpt or text editor) ---------- */
#c4-asp-archive .e-loop-item .elementor-widget-theme-post-excerpt,
#c4-asp-archive .e-loop-item .elementor-widget-theme-post-excerpt *,
#c4-asp-archive .e-loop-item .elementor-widget-text-editor,
#c4-asp-archive .e-loop-item .elementor-widget-text-editor *{
  font-family:'Montserrat',sans-serif !important;font-weight:400;
  font-size:15px !important;line-height:1.62;letter-spacing:0;
  color:var(--c4-body) !important;margin:0 !important;
}
#c4-asp-archive .e-loop-item .elementor-widget-theme-post-excerpt,
#c4-asp-archive .e-loop-item .elementor-widget-text-editor{
  margin-bottom:18px !important;
}

/* ---------- VIEW MORE (button OR text link) ---------- */
#c4-asp-archive .e-loop-item .elementor-widget-button .elementor-button{
  display:inline-flex !important;align-items:center;gap:8px;
  background:transparent !important;border:0 !important;border-radius:0 !important;
  box-shadow:none !important;padding:0 !important;min-height:0 !important;
  font-family:'League Spartan',sans-serif !important;font-weight:500;
  text-transform:uppercase;font-size:14px !important;letter-spacing:.12em;
  color:var(--c4-purple) !important;transition:color .3s ease;
}
#c4-asp-archive .e-loop-item .elementor-widget-button .elementor-button:hover{
  background:transparent !important;color:var(--c4-ink) !important;
}
/* arrow after the label */
#c4-asp-archive .e-loop-item .elementor-widget-button .elementor-button-text::after{
  content:"";display:inline-block;width:12px;height:12px;margin-left:7px;vertical-align:middle;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M3 9 9 3M4.4 3H9V7.6' stroke='%234E42B5' stroke-width='1.4' stroke-linecap='square'/%3E%3C/svg%3E") center/contain no-repeat;
  transition:transform .35s cubic-bezier(.2,.6,.2,1);
}
#c4-asp-archive .e-loop-item .elementor-widget-button .elementor-button:hover .elementor-button-text::after{
  transform:translate(3px,-3px);
}

/* =================================================================
   PAGINATION
   ================================================================= */
#c4-asp-archive .elementor-pagination{
  display:flex;flex-wrap:wrap;justify-content:center;align-items:center;
  gap:10px;border:0 !important;margin-top:clamp(40px,5vw,68px);
}
#c4-asp-archive .elementor-pagination .page-numbers{
  position:relative;overflow:hidden;z-index:0;
  display:inline-flex;align-items:center;justify-content:center;
  min-width:48px;padding:13px 16px;text-decoration:none;
  font-family:'League Spartan',sans-serif;font-weight:500;text-transform:uppercase;
  font-size:14px;letter-spacing:.1em;line-height:1;
  color:var(--c4-ink) !important;background:transparent !important;
  border:1.5px solid var(--c4-ink) !important;border-radius:0 !important;
  transition:color .4s ease;
}
#c4-asp-archive .elementor-pagination .page-numbers::before{
  content:"";position:absolute;inset:0;z-index:-1;background:var(--c4-ink);
  transform:scaleX(0);transform-origin:left center;
  transition:transform .5s cubic-bezier(.5,0,.2,1);
}
#c4-asp-archive .elementor-pagination a.page-numbers:hover{color:#fff !important}
#c4-asp-archive .elementor-pagination a.page-numbers:hover::before{transform:scaleX(1)}
#c4-asp-archive .elementor-pagination .page-numbers.current{color:#fff !important}
#c4-asp-archive .elementor-pagination .page-numbers.current::before{transform:scaleX(1)}
#c4-asp-archive .elementor-pagination .page-numbers.prev,
#c4-asp-archive .elementor-pagination .page-numbers.next{padding:13px 22px;letter-spacing:.12em}
#c4-asp-archive .elementor-pagination .page-numbers.dots{
  border:0 !important;background:transparent !important;min-width:auto;
  padding:13px 4px;color:var(--c4-muted) !important;
}
#c4-asp-archive .elementor-pagination .page-numbers.dots::before{display:none}
#c4-asp-archive .elementor-pagination .page-numbers:focus-visible{
  outline:2px solid var(--c4-purple);outline-offset:3px;
}

/* =================================================================
   RESPONSIVE + MOTION
   ================================================================= */
@media (max-width:820px){
  #c4-asp-archive .elementor-loop-container{border-left:none}
  #c4-asp-archive .e-loop-item{
    padding:0 0 clamp(28px,5vw,40px);border-right:none;
    border-bottom:1px solid var(--c4-line);margin-bottom:clamp(28px,5vw,40px);
  }
}
@media (max-width:600px){
  #c4-asp-archive .e-filter-item{padding:11px 16px;font-size:13px}
}

@media (prefers-reduced-motion:reduce){
  #c4-asp-archive *{transition:none !important}
  #c4-asp-archive .e-loop-item:hover img{filter:none;transform:none}
  #c4-asp-archive .c4asp-img::before{display:none}
  #c4-asp-archive .c4asp-img::after,
  #c4-asp-archive .e-loop-item .elementor-widget-image::after,
  #c4-asp-archive .e-loop-item .elementor-widget-theme-post-featured-image::after{display:none}
}/* End custom CSS */