/*
 * Universal Plywood — Figma Arrow System
 * Version 1.1.54
 *
 * The Figma export already ships with the exact arrow artwork as
 * assets/images/line-42-stroke-arrow.png.  This final layer makes that one
 * asset the source of truth for every front-end directional arrow.
 */
:root{
  --up-figma-arrow-mask:url("../images/line-42-stroke-arrow.png");
  /* Exact Figma artwork bounds supplied by the designer. */
  --up-figma-arrow-width:11.499942779541058px;
  --up-figma-arrow-height:11.046762466430705px;
  --up-figma-arrow-gap:18px;
  --up-figma-arrow-hit:48px;

  /* Backward-compatible master size for older arrow rules. */
  --up-figma-arrow-size:11.499942779541058px;
  --up-arrow-size:11.499942779541058px;
  --up-v2-arrow:11.499942779541058px;
}

/* Shared right-arrow artwork used by text links, cards, search, brands,
   products, forms and other inline actions. */
html body .up-link-arrow>span:last-child,
html body .up-text-link>span:last-child,
html body .up-brand-view>span:last-child,
html body .up-card__link>span:last-child,
html body .up-product-card__view>span:last-child,
html body .up-product-inline-link>span:last-child,
html body .up-product-modal__textlink>span:last-child,
html body .up-brand-discover-list a>span:last-child,
html body .up-brand-discover-list button>span:last-child,
html body .up-subscribe-form button>span:last-child,
html body .up-project-case__browse>span:last-child,
html body .up-live-search__all>span:last-child,
html body .up-live-search__text b[aria-hidden="true"],
html body .up-search-result-card__body b[aria-hidden="true"],
html body .up-search-form button>span:last-child,
html body .up-product-subcategory-nav a>span:last-child,
html body .up-brand-range-back>span:last-child,
html body .up-contact-field-submit button>span:last-child{
  display:inline-block!important;
  flex:0 0 var(--up-figma-arrow-width)!important;
  width:var(--up-figma-arrow-width)!important;
  min-width:var(--up-figma-arrow-width)!important;
  height:var(--up-figma-arrow-height)!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
  color:inherit!important;
  background-color:currentColor!important;
  font-size:0!important;
  line-height:0!important;
  text-indent:-9999px!important;
  vertical-align:middle!important;
  transform:none!important;
  -webkit-mask-image:var(--up-figma-arrow-mask)!important;
  mask-image:var(--up-figma-arrow-mask)!important;
  -webkit-mask-repeat:no-repeat!important;
  mask-repeat:no-repeat!important;
  -webkit-mask-position:center!important;
  mask-position:center!important;
  -webkit-mask-size:contain!important;
  mask-size:contain!important;
}

/* Keep Figma spacing between text and the single arrow. */
html body .up-link-arrow,
html body .up-text-link,
html body .up-brand-view,
html body .up-card__link,
html body .up-product-card__view,
html body .up-product-inline-link,
html body .up-product-modal__textlink,
html body .up-project-case__browse,
html body .up-brand-discover-list a,
html body .up-brand-discover-list button,
html body .up-subscribe-form button,
html body .up-search-form button,
html body .up-brand-range-back,
html body .up-contact-field-submit button{
  gap:var(--up-figma-arrow-gap)!important;
}

/* Footer menu: use one pseudo-icon only.  Older rules could render a text
   arrow and a fallback span at the same time. */
html body .up-footer-menu a>span:last-child{
  display:none!important;
}
html body .up-footer-menu a::after{
  content:""!important;
  display:inline-block!important;
  flex:0 0 var(--up-figma-arrow-width)!important;
  width:var(--up-figma-arrow-width)!important;
  min-width:var(--up-figma-arrow-width)!important;
  height:var(--up-figma-arrow-height)!important;
  margin:0!important;
  background-color:currentColor!important;
  font-size:0!important;
  line-height:0!important;
  -webkit-mask-image:var(--up-figma-arrow-mask)!important;
  mask-image:var(--up-figma-arrow-mask)!important;
  -webkit-mask-repeat:no-repeat!important;
  mask-repeat:no-repeat!important;
  -webkit-mask-position:center!important;
  mask-position:center!important;
  -webkit-mask-size:contain!important;
  mask-size:contain!important;
}

/* Homepage branch list: the Figma uses one right arrow at the far edge. */
html body.home .up-branch-accordion-btn::after{
  content:""!important;
  display:block!important;
  flex:0 0 var(--up-figma-arrow-width)!important;
  width:var(--up-figma-arrow-width)!important;
  min-width:var(--up-figma-arrow-width)!important;
  height:var(--up-figma-arrow-height)!important;
  margin-left:auto!important;
  background-color:currentColor!important;
  font-size:0!important;
  line-height:0!important;
  -webkit-mask-image:var(--up-figma-arrow-mask)!important;
  mask-image:var(--up-figma-arrow-mask)!important;
  -webkit-mask-repeat:no-repeat!important;
  mask-repeat:no-repeat!important;
  -webkit-mask-position:center!important;
  mask-position:center!important;
  -webkit-mask-size:contain!important;
  mask-size:contain!important;
}

/* Featured Projects: one fixed Figma arrow.  The button remains a 48px
   accessible target while the visible artwork uses the exact Figma 11.5 × 11.05px bounds. */
html body.home .up-home-project-slider__controls [data-up-project-slider-next]{
  font-size:0!important;
  line-height:0!important;
}
html body.home .up-home-project-slider__controls [data-up-project-slider-next]::before{
  content:""!important;
  display:block!important;
  width:var(--up-figma-arrow-width)!important;
  height:var(--up-figma-arrow-height)!important;
  background-color:currentColor!important;
  -webkit-mask-image:var(--up-figma-arrow-mask)!important;
  mask-image:var(--up-figma-arrow-mask)!important;
  -webkit-mask-repeat:no-repeat!important;
  mask-repeat:no-repeat!important;
  -webkit-mask-position:center!important;
  mask-position:center!important;
  -webkit-mask-size:contain!important;
  mask-size:contain!important;
}

/* Back to top is the same Figma arrow rotated upward, not a separate font
   glyph. */
html body .up-backtotop__arrow,
html body .up-global-backtotop-section .up-backtotop__arrow{
  display:inline-block!important;
  flex:0 0 var(--up-figma-arrow-width)!important;
  width:var(--up-figma-arrow-width)!important;
  min-width:var(--up-figma-arrow-width)!important;
  height:var(--up-figma-arrow-height)!important;
  margin:0!important;
  background-color:currentColor!important;
  font-size:0!important;
  line-height:0!important;
  text-indent:-9999px!important;
  transform:rotate(-90deg)!important;
  transform-origin:center!important;
  -webkit-mask-image:var(--up-figma-arrow-mask)!important;
  mask-image:var(--up-figma-arrow-mask)!important;
  -webkit-mask-repeat:no-repeat!important;
  mask-repeat:no-repeat!important;
  -webkit-mask-position:center!important;
  mask-position:center!important;
  -webkit-mask-size:contain!important;
  mask-size:contain!important;
}

/* Branch detail "view map" links do not contain an arrow element, so render
   the same Figma asset as the after icon. */
html body .view-map::after{
  content:""!important;
  display:inline-block!important;
  flex:0 0 var(--up-figma-arrow-width)!important;
  width:var(--up-figma-arrow-width)!important;
  min-width:var(--up-figma-arrow-width)!important;
  height:var(--up-figma-arrow-height)!important;
  margin:0!important;
  background-color:currentColor!important;
  transform:none!important;
  -webkit-mask-image:var(--up-figma-arrow-mask)!important;
  mask-image:var(--up-figma-arrow-mask)!important;
  -webkit-mask-repeat:no-repeat!important;
  mask-repeat:no-repeat!important;
  -webkit-mask-position:center!important;
  mask-position:center!important;
  -webkit-mask-size:contain!important;
  mask-size:contain!important;
}

/* Project lightbox navigation: use the same artwork in both directions. */
html body .up-project-lightbox__arrow{
  font-size:0!important;
  line-height:0!important;
}
html body .up-project-lightbox__arrow::before{
  content:""!important;
  display:block!important;
  width:var(--up-figma-arrow-width)!important;
  height:var(--up-figma-arrow-height)!important;
  margin:auto!important;
  background-color:currentColor!important;
  -webkit-mask-image:var(--up-figma-arrow-mask)!important;
  mask-image:var(--up-figma-arrow-mask)!important;
  -webkit-mask-repeat:no-repeat!important;
  mask-repeat:no-repeat!important;
  -webkit-mask-position:center!important;
  mask-position:center!important;
  -webkit-mask-size:contain!important;
  mask-size:contain!important;
}
html body .up-project-lightbox__arrow--prev::before{transform:rotate(180deg)!important;}
html body .up-project-lightbox__arrow--next::before{transform:none!important;}

/* Product pagination is text + the same directional artwork. */
html body .up-product-category-pagination .page-numbers.prev,
html body .up-product-category-pagination .page-numbers.next{
  display:inline-flex!important;
  align-items:center!important;
  gap:12px!important;
}
html body .up-product-category-pagination .page-numbers.prev::before,
html body .up-product-category-pagination .page-numbers.next::after{
  content:""!important;
  display:inline-block!important;
  flex:0 0 var(--up-figma-arrow-width)!important;
  width:var(--up-figma-arrow-width)!important;
  height:var(--up-figma-arrow-height)!important;
  background-color:currentColor!important;
  -webkit-mask-image:var(--up-figma-arrow-mask)!important;
  mask-image:var(--up-figma-arrow-mask)!important;
  -webkit-mask-repeat:no-repeat!important;
  mask-repeat:no-repeat!important;
  -webkit-mask-position:center!important;
  mask-position:center!important;
  -webkit-mask-size:contain!important;
  mask-size:contain!important;
}
html body .up-product-category-pagination .page-numbers.prev::before{transform:rotate(180deg)!important;}

/* Legacy Contact Form 7 submit inputs cannot host pseudo-elements.  JS removes
   the old text arrow and this background uses the exact Figma artwork. */
html body .up-contact-form-section input.wpcf7-submit.up-figma-cf7-submit,
html body .up-exact-contact-form input.wpcf7-submit.up-figma-cf7-submit{
  padding-right:36px!important;
  background-image:url("../images/line-42-stroke-arrow.png")!important;
  background-repeat:no-repeat!important;
  background-position:right center!important;
  background-size:var(--up-figma-arrow-width) var(--up-figma-arrow-height)!important;
}
html body .up-contact-form-section input.wpcf7-submit.up-figma-cf7-submit:hover,
html body .up-contact-form-section input.wpcf7-submit.up-figma-cf7-submit:focus-visible{
  background-image:url("../images/line-42-stroke-arrow-green.png")!important;
}

@media (max-width:900px){
  :root{
    --up-figma-arrow-gap:14px;
  }
}


/* v1.1.79 — Homepage Featured Projects: one Figma arrow per project card.
   The project title and its arrow both deep-link to that exact project on the
   Projects page. Drag/swipe remains the carousel navigation interaction. */
html body.home .up-home-project-slider__controls{
  display:none!important;
  visibility:hidden!important;
}
html body.home .up-home-project-card__meta{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:24px!important;
  width:100%!important;
  min-height:48px!important;
  padding-right:0!important;
}
html body.home .up-home-project-card__title-link{
  display:inline-block!important;
  flex:0 1 auto!important;
  min-width:0!important;
}
html body.home .up-home-project-card__next{
  appearance:none!important;
  -webkit-appearance:none!important;
  text-decoration:none!important;
  display:inline-flex!important;
  flex:0 0 var(--up-figma-arrow-hit)!important;
  width:var(--up-figma-arrow-hit)!important;
  height:var(--up-figma-arrow-hit)!important;
  margin-left:auto!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:var(--up-v2-charcoal,#2D2A26)!important;
  align-items:center!important;
  justify-content:center!important;
  cursor:pointer!important;
  box-shadow:none!important;
  font-size:0!important;
  line-height:0!important;
  transition:color .28s ease, transform .28s cubic-bezier(.22,1,.36,1)!important;
  -webkit-tap-highlight-color:transparent!important;
}
html body.home .up-home-project-card__next>span{
  display:block!important;
  width:var(--up-figma-arrow-width)!important;
  min-width:var(--up-figma-arrow-width)!important;
  height:var(--up-figma-arrow-height)!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
  background-color:currentColor!important;
  font-size:0!important;
  line-height:0!important;
  text-indent:-9999px!important;
  -webkit-mask-image:var(--up-figma-arrow-mask)!important;
  mask-image:var(--up-figma-arrow-mask)!important;
  -webkit-mask-repeat:no-repeat!important;
  mask-repeat:no-repeat!important;
  -webkit-mask-position:center!important;
  mask-position:center!important;
  -webkit-mask-size:contain!important;
  mask-size:contain!important;
}
html body.home .up-home-project-card__next:hover,
html body.home .up-home-project-card__next:focus-visible{
  color:var(--up-v2-green,#62A744)!important;
  transform:translateX(2px)!important;
  outline:none!important;
}
html body.home .up-home-project-card__next:focus-visible{
  box-shadow:0 0 0 1px currentColor inset!important;
}
@media(max-width:980px){
  html body.home .up-home-project-card__meta{gap:14px!important;}
  html body.home .up-home-project-card__next{
    flex-basis:44px!important;
    width:44px!important;
    height:44px!important;
  }
}


/* v1.1.80 — Per-project arrows are true deep links, never slider controls. */
html body.home .up-home-project-card__title-link,
html body.home .up-home-project-card__next{
  pointer-events:auto!important;
  position:relative!important;
  z-index:8!important;
}


/* v1.1.87 — Branch View Map single-label guard.
   Branch post content already contains the label. Never synthesize a second
   "view map" with ::before; ::after is reserved for the one Figma arrow. */
html body .up-branch-details a.view-map{
  display:inline-flex!important;
  align-items:center!important;
  gap:var(--up-figma-arrow-gap,18px)!important;
  font-family:Inter,Arial,sans-serif!important;
  font-size:18px!important;
  font-weight:400!important;
  line-height:22px!important;
  letter-spacing:0!important;
  text-indent:0!important;
  text-transform:lowercase!important;
  color:inherit!important;
  white-space:nowrap!important;
}
html body .up-branch-details a.view-map::before{
  content:none!important;
  display:none!important;
}
html body .up-branch-details a.view-map::after{
  content:""!important;
  display:inline-block!important;
  flex:0 0 var(--up-figma-arrow-width)!important;
  width:var(--up-figma-arrow-width)!important;
  min-width:var(--up-figma-arrow-width)!important;
  height:var(--up-figma-arrow-height)!important;
  margin:0!important;
  background-color:currentColor!important;
  transform:none!important;
  -webkit-mask-image:var(--up-figma-arrow-mask)!important;
  mask-image:var(--up-figma-arrow-mask)!important;
  -webkit-mask-repeat:no-repeat!important;
  mask-repeat:no-repeat!important;
  -webkit-mask-position:center!important;
  mask-position:center!important;
  -webkit-mask-size:contain!important;
  mask-size:contain!important;
}


/* v1.1.88 — Branch View Map exact Figma arrow lock.
   Some historical branch records still contain a literal arrow glyph in the
   anchor text. Hide the stored inline label entirely and render one canonical
   label plus the same 11.5px Figma arrow used everywhere else on the site. */
html body .up-branch-accordion-section .up-branch-details a.view-map,
html body .elementor .up-branch-details a.view-map{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:var(--up-figma-arrow-gap,18px)!important;
  font-size:0!important;
  line-height:0!important;
  letter-spacing:0!important;
  text-indent:0!important;
  white-space:nowrap!important;
  color:inherit!important;
  text-decoration:none!important;
}
html body .up-branch-accordion-section .up-branch-details a.view-map::before,
html body .elementor .up-branch-details a.view-map::before{
  content:"view map"!important;
  display:inline-block!important;
  font-family:Inter,Arial,sans-serif!important;
  font-size:18px!important;
  font-weight:400!important;
  font-style:normal!important;
  line-height:22px!important;
  letter-spacing:0!important;
  text-transform:lowercase!important;
  color:currentColor!important;
}
html body .up-branch-accordion-section .up-branch-details a.view-map::after,
html body .elementor .up-branch-details a.view-map::after{
  content:""!important;
  display:inline-block!important;
  flex:0 0 var(--up-figma-arrow-width)!important;
  width:var(--up-figma-arrow-width)!important;
  min-width:var(--up-figma-arrow-width)!important;
  height:var(--up-figma-arrow-height)!important;
  margin:0!important;
  padding:0!important;
  background-color:currentColor!important;
  transform:none!important;
  font-size:0!important;
  line-height:0!important;
  -webkit-mask-image:var(--up-figma-arrow-mask)!important;
  mask-image:var(--up-figma-arrow-mask)!important;
  -webkit-mask-repeat:no-repeat!important;
  mask-repeat:no-repeat!important;
  -webkit-mask-position:center!important;
  mask-position:center!important;
  -webkit-mask-size:contain!important;
  mask-size:contain!important;
}