/* 
 * Premium Design Utilities 
 * Derived from Fareesa project's main.css 
 */

/* Layout & Grid */
.dc-grid { display: grid; gap: 1.5rem; }
.dc-grid-2 { grid-template-columns: repeat(2, 1fr); }
.dc-grid-3 { grid-template-columns: repeat(3, 1fr); }
.dc-grid-4 { grid-template-columns: repeat(4, 1fr); }

.dc-col-span-2 { grid-column: span 2 / span 2; }
.dc-col-span-3 { grid-column: span 3 / span 3; }
.dc-col-span-4 { grid-column: span 4 / span 4; }

.dc-gap-4 { gap: 1rem; }
.dc-gap-6 { gap: 1.5rem; }
.dc-gap-8 { gap: 2rem; }
.dc-gap-12 { gap: 3rem; }

.dc-py-10 { padding-top: 2.5rem; padding-bottom: 2.5rem; }
.dc-py-20 { padding-top: 5rem; padding-bottom: 5rem; }
.dc-mt-10 { margin-top: 2.5rem; }
.dc-mt-20 { margin-top: 5rem; }

@media (max-width: 1024px) {
    .dc-grid-4 { grid-template-columns: repeat(2, 1fr); }
    .dc-col-span-2, .dc-col-span-3, .dc-col-span-4 { grid-column: span 1 / span 1; }
}
@media (max-width: 640px) {
    .dc-grid-4, .dc-grid-3, .dc-grid-2 { grid-template-columns: 1fr; }
}

/* Glassmorphism */
.dc-glass {
    background: rgba(255, 255, 255, 0.08);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.15);
}

.dc-glass-card {
    background: linear-gradient(135deg, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0.05) 100%);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(255,255,255,0.18);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
}

.dc-glass-dark {
    background: linear-gradient(135deg, rgba(6, 42, 77, 0.85) 0%, rgba(6, 42, 77, 0.95) 100%);
    -webkit-backdrop-filter: blur(30px);
    backdrop-filter: blur(30px);
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    color: #fff;
}

/* Base Styles Refinement */
.dc-list-none { list-style: none; padding: 0; margin: 0; }
.dc-leading-relaxed { line-height: 1.625; }