/* Custom styles for GI Live website */
:root {
    --bs-primary: #0B56EF;
    --bs-primary-rgb: 11, 86, 239;
    
    /* Brand Colors */
    --brand-navy: #224192;
    --brand-navy-rgb: 34,65,146;
    --brand-teal: #099;
    --brand-teal-rgb: 0, 153, 153;
    
    /* Font Sizes - Using clamp for responsive typography */
    --fs-display-4: clamp(2.5rem, 5vw, 3.5rem);
    --fs-display-6: clamp(1.5rem, 3vw, 2rem);
    --fs-lead: clamp(1.1rem, 2vw, 1.25rem);
    --fs-base: clamp(1rem, 1.5vw, 1.125rem);
    --fs-small: clamp(0.875rem, 1.2vw, 1rem);
}
/* General styles */
body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* Navigation styles */
.navbar {
    padding: 1rem 0;
    z-index: 1;
}

.navbar-brand {
    font-weight: 700;
    font-size: 1.5rem;
}

.nav-link {
    font-weight: 500;
}

/* Main content styles */
main {
    min-height: calc(100vh - 200px);
}

/* Custom utility classes */
.text-primary-custom {
    color: #007bff;
}

.bg-light-custom {
    background-color: #f8f9fa;
}
/* Abstract Background Pattern */
.abstract-shapes {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: -1;
    overflow: hidden;
}

.abstract-shape {
    position: absolute;
    opacity: 0.07;
    transition: transform 0.5s ease;
    z-index: -1;
}

/* Circle shape with gradient */
.shape-circle {
    width: 400px;
    height: 400px;
    border-radius: 50%;
    background: linear-gradient(45deg, var(--brand-navy), var(--brand-teal));
    top: -150px;
    right: -100px;
    z-index: -1;
}

/* Organic blob shape */
.shape-blob {
    width: 300px;
    height: 300px;
    background: var(--brand-teal);
    bottom: 10%;
    left: -100px;
    border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
    z-index: -1;
}

/* Dotted pattern */
.shape-dots {
    width: 200px;
    height: 200px;
    background-image: radial-gradient(var(--brand-navy) 2px, transparent 2px);
    background-size: 15px 15px;
    top: 30%;
    right: 10%;
    z-index: -1;
}

/* Abstract lines */
.shape-lines {
    width: 250px;
    height: 250px;
    background: repeating-linear-gradient(
        45deg,
        var(--brand-navy),
        var(--brand-navy) 2px,
        transparent 2px,
        transparent 10px
    );
    bottom: 15%;
    right: 20%;
    z-index: -1;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .navbar {
        padding: 0.5rem 0;
    }
}