/* Portfolio Displays — design tokens + scoped reset.
   Loaded by every pfd widget. Fonts inherit Elementor Site Settings when set. */
:root {
  --pfd-bg: #ffffff;
  --pfd-fg: #000000;
  --pfd-muted: rgba(0, 0, 0, .48);
  --pfd-line: rgba(0, 0, 0, .08);
  --pfd-accent: #1f3bd6;
  --pfd-radius: 16px;
  --pfd-radius-sm: 10px;
  --pfd-bar-h: 32px;
  --pfd-shadow-soft: 0 1px 2px rgba(0, 0, 0, .06), 0 12px 24px -8px rgba(0, 0, 0, .14);
  --pfd-shadow-lift: 0 2px 4px rgba(0, 0, 0, .08), 0 28px 48px -12px rgba(0, 0, 0, .24);
  --pfd-font-ui: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --pfd-font-heading: var(--e-global-typography-primary-font-family, var(--pfd-font-ui));
  --pfd-font-body: var(--e-global-typography-text-font-family, var(--pfd-font-ui));
  --pfd-ease: cubic-bezier(.2, .8, .2, 1);
  --pfd-dur: 220ms;
  --pfd-surface-pad: 24px;
  --pfd-surface-gap: 20px;
}

.pfd-theme-dark,
.pfd-theme-dark .pfd {
  --pfd-bg: #000000;
  --pfd-fg: #ffffff;
  --pfd-muted: rgba(255, 255, 255, .55);
  --pfd-line: rgba(255, 255, 255, .12);
  --pfd-shadow-soft: 0 1px 2px rgba(0, 0, 0, .5), 0 12px 24px -8px rgba(0, 0, 0, .7);
  --pfd-shadow-lift: 0 2px 4px rgba(0, 0, 0, .6), 0 28px 48px -12px rgba(0, 0, 0, .8);
}

/* Scoped reset: themes must not inflate our buttons, links and lists. */
.pfd, .pfd *, .pfd *::before, .pfd *::after { box-sizing: border-box; }
.pfd button, .pfd [type="button"], .pfd [type="submit"] {
  appearance: none; -webkit-appearance: none;
  background: none; border: 0; margin: 0; padding: 0;
  font: inherit; color: inherit; line-height: 1; cursor: pointer;
  border-radius: 0; box-shadow: none; text-transform: none; letter-spacing: normal;
  min-height: 0; min-width: 0; width: auto;
}
:where(.pfd) a { color: inherit; text-decoration: none; }
:where(.pfd) a:hover { text-decoration: none; }
:where(.pfd) ul, :where(.pfd) ol { list-style: none; margin: 0; padding: 0; }
.pfd img, .pfd video, .pfd iframe { display: block; max-width: 100%; border: 0; }
.pfd img { height: auto; }
:where(.pfd) p { margin: 0; }
:where(.pfd) :is(h1, h2, h3, h4) { margin: 0; font-weight: 600; line-height: 1.15; }
.pfd :focus { outline: none; }
.pfd :focus-visible { outline: 2px solid var(--pfd-accent); outline-offset: 2px; border-radius: 4px; }

/* Shared primitives */
.pfd-pill {
  display: inline-flex; align-items: center; gap: 6px;
  height: 30px; padding: 0 14px; border-radius: 999px;
  background: var(--pfd-bg); color: var(--pfd-fg);
  font: 500 12px/1 var(--pfd-font-ui);
  box-shadow: 0 0 0 1px var(--pfd-line), 0 1px 2px rgba(0, 0, 0, .08);
  transition: transform var(--pfd-dur) var(--pfd-ease), box-shadow var(--pfd-dur) var(--pfd-ease);
}
.pfd-pill:hover { transform: translateY(-1px); box-shadow: 0 0 0 1px var(--pfd-line), 0 6px 14px -4px rgba(0, 0, 0, .2); }
.pfd .pfd-pill, a.pfd-pill { color: var(--pfd-fg); }
.pfd-pill--dark, .pfd .pfd-pill--dark { background: var(--pfd-fg); color: var(--pfd-bg); }
.pfd-eyebrow { font: 500 11px/1.2 var(--pfd-font-ui); color: var(--pfd-muted); }
.pfd-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

@media (prefers-reduced-motion: reduce) {
  .pfd, .pfd *, .pfd *::before, .pfd *::after { transition-duration: 1ms !important; animation-duration: 1ms !important; animation-delay: 0ms !important; }
}