/* V20 — simplified, consistent CTA and arrow system */
.ui-arrow{
  position:relative!important;
  display:inline-block!important;
  width:18px!important;
  height:10px!important;
  flex:0 0 18px!important;
  margin-left:9px!important;
  border:0!important;
  border-radius:0!important;
  background:none!important;
  opacity:1!important;
  vertical-align:middle!important;
  transform:none!important;
  transition:transform .25s ease!important;
}
.ui-arrow::after{
  content:""!important;
  position:absolute!important;
  left:0!important;
  top:50%!important;
  width:17px!important;
  height:1.5px!important;
  border-radius:99px!important;
  background:currentColor!important;
  transform:translateY(-50%)!important;
}
.ui-arrow::before{
  content:""!important;
  position:absolute!important;
  right:0!important;
  top:50%!important;
  width:6px!important;
  height:6px!important;
  border:0!important;
  border-top:1.5px solid currentColor!important;
  border-right:1.5px solid currentColor!important;
  border-radius:0!important;
  transform:translateY(-50%) rotate(45deg)!important;
}
a:hover .ui-arrow,button:hover .ui-arrow,.project-card:hover .ui-arrow{
  transform:translateX(4px)!important;
  background:none!important;
}
a:hover .ui-arrow::before,button:hover .ui-arrow::before,.project-card:hover .ui-arrow::before,
a:hover .ui-arrow::after,button:hover .ui-arrow::after,.project-card:hover .ui-arrow::after{
  color:inherit!important;
}

.preview-shield{
  inset:30px 0 0!important;
  display:block!important;
  background:linear-gradient(180deg,transparent 68%,rgba(3,4,3,.24) 100%)!important;
  pointer-events:none!important;
}
.preview-shield>span{
  position:absolute!important;
  right:18px!important;
  bottom:18px!important;
  min-height:42px!important;
  padding:0 16px!important;
  display:inline-flex!important;
  align-items:center!important;
  border-radius:999px!important;
  background:#0b0c0b!important;
  border:1px solid rgba(255,255,255,.22)!important;
  color:#fff!important;
  box-shadow:0 12px 30px rgba(0,0,0,.28)!important;
  backdrop-filter:none!important;
  font-size:9px!important;
  font-weight:750!important;
  letter-spacing:.12em!important;
  text-transform:uppercase!important;
  opacity:1!important;
  transform:none!important;
  transition:transform .25s ease,background .25s ease,color .25s ease,border-color .25s ease!important;
}
.preview-shield .ui-arrow{
  width:17px!important;
  height:10px!important;
  flex-basis:17px!important;
  margin-left:10px!important;
  color:var(--accent)!important;
  background:none!important;
}
.project-card:hover .preview-shield>span{
  transform:translateY(-3px)!important;
  background:var(--accent)!important;
  color:#080908!important;
  border-color:var(--accent)!important;
}
.project-card:hover .preview-shield .ui-arrow{color:#080908!important;transform:translateX(3px)!important;background:none!important}
.project-bottom button{
  display:inline-flex!important;
  align-items:center!important;
  color:var(--text)!important;
  opacity:.72!important;
  white-space:nowrap!important;
}
.project-card:hover .project-bottom button{opacity:1!important}

/* Remove any leftover decorative logo/watermark in CTA cards */
.contact-trigger-logo{display:none!important}

html[data-theme="light"] .preview-shield>span{
  background:#111!important;
  color:#fff!important;
  border-color:#111!important;
  box-shadow:0 12px 28px rgba(20,25,16,.18)!important;
}
html[data-theme="light"] .preview-shield .ui-arrow{color:#d8ff4f!important}
html[data-theme="light"] .project-card:hover .preview-shield>span{background:#111!important;color:#fff!important;border-color:#111!important}
html[data-theme="light"] .project-card:hover .preview-shield .ui-arrow{color:#d8ff4f!important}

@media(max-width:700px){
  .preview-shield>span{display:inline-flex!important;right:10px!important;bottom:10px!important;min-height:36px!important;padding:0 12px!important;font-size:7px!important}
  .preview-shield .ui-arrow{width:15px!important;flex-basis:15px!important;margin-left:7px!important}
}