.animate-fade-up { opacity: 0; transform: translateY(35px); filter: blur(6px); transition: none; } .animate-fade-up.in-view { animation: fade-up 0.8s cubic-bezier(0.22, 1, 0.36, 1) both; }   :root{ --svc-bg: hsl(var(--background, 0 0% 100%)); --svc-fg: hsl(var(--foreground, 222 47% 11%)); --svc-fg-muted: hsl(var(--muted-foreground, 215 16% 47%)); --svc-primary: var(--primary-70, #25acb1); --radius-2xl: 1rem;  }  %root%{ background: var(--svc-bg); color: var(--svc-fg); border-radius: var(--radius-2xl); overflow: hidden;  box-shadow: 0 4px 6px -1px rgba(0,0,0,.10), 0 2px 4px -2px rgba(0,0,0,.10); transition: box-shadow 300ms cubic-bezier(.4,0,.2,1), transform 300ms cubic-bezier(.4,0,.2,1), opacity 300ms cubic-bezier(.4,0,.2,1); display: grid; }  @media (hover:hover) and (pointer:fine){ %root%:hover{ box-shadow: 0 20px 25px -5px rgba(0,0,0,.10), 0 8px 10px -6px rgba(0,0,0,.10); } }  %root%__media{ aspect-ratio: 1 / 1;  overflow: hidden;  position: relative; }  %root%__img{ width: 100%; height: 100%; object-fit: cover; display: block; transform: translateZ(0) scale(1); transform-origin: center; backface-visibility: hidden; will-change: transform; transition: transform 500ms cubic-bezier(.4,0,.2,1);  }  @media (hover:hover) and (pointer:fine){ %root%:hover %root%__img{ transform: translateZ(0) scale(1.10); } }  %root%__body{ padding: 1.5rem;  display: grid; gap: .75rem;  } %root%__title{ font-family: var(--font-serif, ui-serif, Georgia, Cambria, "Times New Roman", Times, serif); font-size: clamp(1.25rem, 1.1rem + .5vw, 1.5rem);  line-height: 1.2; color: var(--svc-fg); margin: 0; } %root%__desc{ font-size: .875rem;  line-height: 1.6; color: var(--svc-fg-muted); margin: 0; } %root%__list{ list-style: none; padding: 0; margin: .5rem 0 0;  display: grid; gap: .25rem;  font-size: .75rem;  color: var(--svc-fg-muted); } %root%__li{ display: grid; grid-template-columns: auto 1fr; align-items: start; gap: .5rem;  } %root%__dot{ color: var(--svc-primary); margin-top: .125rem;  line-height: 1; }  @keyframes svc-fade-up { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: translateY(0); } } .animate-fade-up{ animation: svc-fade-up .6s ease-out both;  animation-delay: var(--anim-delay, 0ms); }  @media (prefers-reduced-motion: reduce){ %root%, %root%__img, .animate-fade-up{ transition: none !important; animation: none !important; } }   h2.wp-block-heading { font-size: var(--text-xl); font-weight: 600; line-height: 1.6; } }