.hero-gradient {
    background: linear-gradient(var(--bs-primary), var(--bs-secondary));
}

.hero-parallax {
    height: 600px;
    background: var(--bs-tertiary-bg);
}

/* Custom Utilities for PIV Digital */
.mw-350 {
    max-width: 350px;
}

.mh-300 {
    max-height: 300px;
}

.min-h-300 {
    min-height: 300px;
}

.w-250 {
    width: 250px;
}

.w-30 {
    width: 30px;
}

.w-150 {
    width: 150px;
}

/* Heading Font Override */
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
.display-1,
.display-2,
.display-3,
.display-4,
.display-5,
.display-6 {
    font-family: var(--bs-heading-font-family);
}

/* Font Demos */
.font-heading-demo {
    font-family: var(--bs-heading-font-family) !important;
}

.font-body-demo {
    font-family: var(--bs-body-font-family) !important;
}

/* Gradient Demos */
.bg-gradient-demo-1 {
    background: linear-gradient(var(--bs-primary), var(--bs-secondary)), var(--bs-primary);
}

.bg-gradient-demo-2 {
    background: linear-gradient(var(--bs-secondary), var(--bs-info));
}

.bg-gradient-demo-3 {
    background: linear-gradient(var(--bs-secondary), var(--bs-warning));
}

.bg-gradient-demo-4 {
    background: linear-gradient(var(--bs-danger), var(--bs-info));
}

.bg-gradient-demo-5 {
    background: linear-gradient(var(--bs-danger), var(--bs-primary));
}

.bg-gradient-demo-6 {
    background: linear-gradient(var(--bs-danger), var(--bs-warning));
}

.bg-gradient-demo-7 {
    background: linear-gradient(var(--bs-success), var(--bs-warning));
}

.bg-gradient-demo-8 {
    background: linear-gradient(var(--bs-primary), var(--bs-info));
}

.bg-gradient-demo-9 {
    background: linear-gradient(var(--bs-tertiary-color), white);
}

.bg-gradient-demo-10 {
    background: linear-gradient(135deg, #2c2c2e 0%, #000000 100%);
}

.bg-gradient-demo-11 {
    background: linear-gradient(135deg, #ffffff 0%, #f1f1f1 100%);
}

.bg-gradient-demo-12 {
    background: #000000;
}

/* Theme Visibility */
/* Default (Light Mode) */
.d-theme-dark {
    display: none !important;
}

/* Dark Mode */
:root[data-bs-theme="dark"] .d-theme-light {
    display: none !important;
}

:root[data-bs-theme="dark"] .d-theme-dark {
    display: inline-block !important;
}

/* Fix text colors in dark mode */
[data-bs-theme="dark"] .text-primary,
[data-bs-theme="dark"] .nav-link-active {
    color: var(--bs-secondary) !important;
}

/* Base Outline Button Overrides */
.btn-outline-primary {
    --bs-btn-color: var(--bs-primary) !important;
    --bs-btn-border-color: var(--bs-primary) !important;
    --bs-btn-hover-bg: var(--bs-primary) !important;
    --bs-btn-hover-border-color: var(--bs-primary) !important;
    --bs-btn-hover-color: #ffffff !important;
}

.btn-outline-secondary {
    --bs-btn-color: var(--bs-secondary) !important;
    --bs-btn-border-color: var(--bs-secondary) !important;
    --bs-btn-hover-bg: var(--bs-secondary) !important;
    --bs-btn-hover-border-color: var(--bs-secondary) !important;
    --bs-btn-hover-color: #000000 !important;
}

/* Specific Dark Mode overrides for outline primary */
[data-bs-theme="dark"] .btn-outline-primary {
    --bs-btn-color: var(--bs-secondary) !important;
    --bs-btn-border-color: var(--bs-secondary) !important;
    --bs-btn-hover-bg: var(--bs-secondary) !important;
    --bs-btn-hover-border-color: var(--bs-secondary) !important;
    --bs-btn-hover-color: #000000 !important;
}

/* Fix Button Components in Design System */
.btn-primary {
    --bs-btn-bg: var(--bs-primary) !important;
    --bs-btn-border-color: var(--bs-primary) !important;
    --bs-btn-hover-bg: var(--bs-primary) !important;
    --bs-btn-hover-border-color: var(--bs-primary) !important;
    --bs-btn-active-bg: var(--bs-primary) !important;
    --bs-btn-color: #ffffff !important;
    filter: brightness(1);
    transition: filter 0.2s;
}

.btn-primary:hover {
    filter: brightness(0.9);
}

.btn-secondary {
    --bs-btn-bg: var(--bs-secondary) !important;
    --bs-btn-border-color: var(--bs-secondary) !important;
    --bs-btn-hover-bg: var(--bs-secondary) !important;
    --bs-btn-hover-border-color: var(--bs-secondary) !important;
    --bs-btn-active-bg: var(--bs-secondary) !important;
    --bs-btn-color: #000000 !important;
    --bs-btn-hover-color: #000000 !important;
    filter: brightness(1);
    transition: filter 0.2s;
}

.btn-secondary:hover {
    filter: brightness(0.9);
}

/* Masonry Gallery Grid */
.masonry-grid {
    column-count: 1;
    column-gap: 1.5rem;
    width: 100%;
}

.masonry-item {
    display: inline-block;
    width: 100%;
    margin-bottom: 1.5rem;
    break-inside: avoid;
}

/* Responsive columns */
@media (min-width: 768px) {
    .masonry-grid {
        column-count: 2;
    }
}

@media (min-width: 1200px) {
    .masonry-grid {
        column-count: 2;
    }
}