/* --------------------------------------------------
TEXT ALIGNMENT UTILITIES
Used to quickly control text alignment inside
modules or columns.
-------------------------------------------------- */
.pc-text-center { text-align: center; }
.pc-text-left { text-align: left; }
.pc-text-right { text-align: right; }
/* --------------------------------------------------
MARGIN BOTTOM UTILITIES
Used to quickly adjust spacing below elements
without creating new custom CSS.
Common uses:
• headings
• images
• icons
• CTA blocks
-------------------------------------------------- */
.pc-mb-0 { margin-bottom: 0 !important; }
.pc-mb-xs { margin-bottom: var(--pc-space-xs) !important; }
.pc-mb-sm { margin-bottom: var(--pc-space-sm) !important; }
.pc-mb-md { margin-bottom: var(--pc-space-md) !important; }
.pc-mb-lg { margin-bottom: var(--pc-space-lg) !important; }
.pc-mb-xl { margin-bottom: var(--pc-space-xl) !important; }
/* --------------------------------------------------
MARGIN TOP UTILITIES
Used when spacing above an element needs
adjustment without affecting the rest
of the layout.
-------------------------------------------------- */
.pc-mt-0 { margin-top: 0 !important; }
.pc-mt-sm { margin-top: var(--pc-space-sm) !important; }
.pc-mt-md { margin-top: var(--pc-space-md) !important; }
.pc-mt-lg { margin-top: var(--pc-space-lg) !important; }
/* --------------------------------------------------
PADDING UTILITIES
Used to add interior spacing to containers,
cards, or modules.
-------------------------------------------------- */
.pc-p-sm { padding: var(--pc-space-sm) !important; }
.pc-p-md { padding: var(--pc-space-md) !important; }
.pc-p-lg { padding: var(--pc-space-lg) !important; }
/* --------------------------------------------------
BACKGROUND COLOR UTILITIES
Used for quick background styling of sections,
rows, or cards.
-------------------------------------------------- */
.pc-bg-white { background: #ffffff; }
.pc-bg-canvas { background: var(--pc-canvas); }
.pc-bg-dark {
  background: var(--pc-ink);
  color: #ffffff;
}
/* --------------------------------------------------
BORDER RADIUS UTILITIES
Applies rounded corners to images, cards,
or containers.
-------------------------------------------------- */
.pc-radius-sm { border-radius: var(--pc-radius-sm); }
.pc-radius-md { border-radius: var(--pc-radius-md); }
.pc-radius-lg { border-radius: var(--pc-radius-lg); }
/* --------------------------------------------------
SHADOW UTILITIES
Adds elevation to elements such as cards,
images, and testimonials.
-------------------------------------------------- */
.pc-shadow-sm { box-shadow: var(--pc-shadow-sm); }
.pc-shadow-md { box-shadow: var(--pc-shadow-md); }
/* --------------------------------------------------
BORDER UTILITY
Applies a subtle border used in card layouts.
-------------------------------------------------- */
.pc-border { border: 1px solid var(--pc-border); }
/* --------------------------------------------------
CONTENT WIDTH UTILITIES
Used to limit content width for readability,
especially in blog posts or FAQ sections.
-------------------------------------------------- */
.pc-max-900 {
  width: min(100%, 900px);
  margin-inline: auto;
}
.pc-max-1280 {
  width: min(100%, 1280px);
  margin-inline: auto;
}