body {
    background:
        linear-gradient(var(--grid-line) 1px, transparent 1px),
        linear-gradient(90deg, var(--grid-line) 1px, transparent 1px),
        radial-gradient(circle at top, rgba(212, 169, 74, 0.12), transparent 28%),
        linear-gradient(135deg, var(--main-bg) 0%, var(--secondary-bg) 100%) !important;
    background-size: 36px 36px, 36px 36px, auto, auto !important;
    color: var(--text-body) !important;
}

.content-container,
.main-container,
.question-card,
.card-container,
.result-card,
.payment-card,
.package-card,
.dashboard-card,
.dashboard-panel,
.service-card,
.card,
.form-card,
.policy-card {
    background: rgba(10, 23, 38, 0.86) !important;
    color: var(--text-body) !important;
    border: 1px solid rgba(212, 169, 74, 0.16) !important;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.28) !important;
    backdrop-filter: blur(12px);
}

.container {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
}

main,
body > main {
    padding-inline: clamp(1rem, 3vw, 2rem);
}

main > section,
body > section,
.page-section,
.hero-section,
.team-section,
.cta-section,
.pricing-section {
    padding-top: var(--section-space);
    padding-bottom: var(--section-space);
}

.container,
.content-container,
.main-container {
    width: min(100% - 2rem, var(--content-max));
    margin-inline: auto;
}

.row {
    --bs-gutter-y: clamp(1rem, 2vw, 1.5rem);
}

.card,
.question-card,
.result-card,
.payment-card,
.package-card,
.dashboard-card,
.dashboard-panel,
.service-card,
.form-card,
.policy-card {
    padding: clamp(1.25rem, 2vw, 2rem) !important;
    border-radius: 1.25rem !important;
}

.card > * + *,
.question-card > * + *,
.result-card > * + *,
.payment-card > * + *,
.package-card > * + *,
.dashboard-card > * + *,
.dashboard-panel > * + *,
.service-card > * + *,
.form-card > * + *,
.policy-card > * + * {
    margin-top: clamp(0.85rem, 1.8vw, 1.35rem);
}

.row > [class*="col-"] > .card,
.row > [class*="col-"] > .service-card,
.row > [class*="col-"] > .dashboard-card,
.row > [class*="col-"] > .payment-card,
.row > [class*="col-"] > .package-card {
    height: 100%;
}

.row > [class*="col-"]:nth-child(5n + 1) > .card:not(.theme-card):not(.index-assessment-card),
.row > [class*="col-"]:nth-child(5n + 1) > .service-card:not(.theme-card),
.row > [class*="col-"]:nth-child(5n + 1) > .dashboard-card:not(.theme-card),
.row > [class*="col-"]:nth-child(5n + 1) > .package-card:not(.theme-card) {
    background: linear-gradient(135deg, rgba(30, 58, 95, 0.94) 0%, rgba(47, 92, 138, 0.9) 100%) !important;
    color: var(--text-heading) !important;
    border-color: rgba(96, 165, 250, 0.24) !important;
}

.row > [class*="col-"]:nth-child(5n + 2) > .card:not(.theme-card):not(.index-assessment-card),
.row > [class*="col-"]:nth-child(5n + 2) > .service-card:not(.theme-card),
.row > [class*="col-"]:nth-child(5n + 2) > .dashboard-card:not(.theme-card),
.row > [class*="col-"]:nth-child(5n + 2) > .package-card:not(.theme-card) {
    background: linear-gradient(135deg, rgba(18, 79, 58, 0.94) 0%, rgba(31, 122, 89, 0.9) 100%) !important;
    color: var(--text-heading) !important;
    border-color: rgba(52, 211, 153, 0.22) !important;
}

.row > [class*="col-"]:nth-child(5n + 3) > .card:not(.theme-card):not(.index-assessment-card),
.row > [class*="col-"]:nth-child(5n + 3) > .service-card:not(.theme-card),
.row > [class*="col-"]:nth-child(5n + 3) > .dashboard-card:not(.theme-card),
.row > [class*="col-"]:nth-child(5n + 3) > .package-card:not(.theme-card) {
    background: linear-gradient(135deg, rgba(61, 31, 87, 0.94) 0%, rgba(106, 47, 163, 0.9) 100%) !important;
    color: var(--text-heading) !important;
    border-color: rgba(192, 132, 252, 0.22) !important;
}

.row > [class*="col-"]:nth-child(5n + 4) > .card:not(.theme-card):not(.index-assessment-card),
.row > [class*="col-"]:nth-child(5n + 4) > .service-card:not(.theme-card),
.row > [class*="col-"]:nth-child(5n + 4) > .dashboard-card:not(.theme-card),
.row > [class*="col-"]:nth-child(5n + 4) > .package-card:not(.theme-card) {
    background: linear-gradient(135deg, rgba(106, 66, 15, 0.94) 0%, rgba(184, 115, 22, 0.9) 100%) !important;
    color: var(--text-heading) !important;
    border-color: rgba(230, 183, 90, 0.24) !important;
}

.row > [class*="col-"]:nth-child(5n) > .card:not(.theme-card):not(.index-assessment-card),
.row > [class*="col-"]:nth-child(5n) > .service-card:not(.theme-card),
.row > [class*="col-"]:nth-child(5n) > .dashboard-card:not(.theme-card),
.row > [class*="col-"]:nth-child(5n) > .package-card:not(.theme-card) {
    background: linear-gradient(135deg, rgba(90, 35, 51, 0.94) 0%, rgba(185, 76, 99, 0.9) 100%) !important;
    color: var(--text-heading) !important;
    border-color: rgba(233, 95, 120, 0.22) !important;
}

.row > [class*="col-"] > .card:not(.theme-card):not(.index-assessment-card) p,
.row > [class*="col-"] > .card:not(.theme-card):not(.index-assessment-card) li,
.row > [class*="col-"] > .service-card:not(.theme-card) p,
.row > [class*="col-"] > .dashboard-card:not(.theme-card) p,
.row > [class*="col-"] > .package-card:not(.theme-card) p {
    color: rgba(245, 249, 252, 0.88) !important;
}

.row > [class*="col-"] > .card:not(.theme-card):not(.index-assessment-card) .badge,
.row > [class*="col-"] > .service-card:not(.theme-card) .badge,
.row > [class*="col-"] > .dashboard-card:not(.theme-card) .badge,
.row > [class*="col-"] > .package-card:not(.theme-card) .badge {
    background: rgba(255, 255, 255, 0.14) !important;
    color: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, 0.16);
}

.section-accent-blue,
.surface-accent-blue {
    background: linear-gradient(135deg, rgba(24, 58, 90, 0.92) 0%, rgba(78, 143, 209, 0.88) 100%) !important;
    color: var(--text-heading) !important;
}

.section-accent-green,
.surface-accent-green {
    background: linear-gradient(135deg, rgba(18, 79, 58, 0.92) 0%, rgba(31, 122, 89, 0.88) 100%) !important;
    color: var(--text-heading) !important;
}

.section-accent-purple,
.surface-accent-purple {
    background: linear-gradient(135deg, rgba(61, 31, 87, 0.92) 0%, rgba(106, 47, 163, 0.88) 100%) !important;
    color: var(--text-heading) !important;
}

.section-accent-orange,
.surface-accent-orange {
    background: linear-gradient(135deg, rgba(106, 66, 15, 0.92) 0%, rgba(184, 115, 22, 0.88) 100%) !important;
    color: var(--text-heading) !important;
}

.section-accent-red,
.surface-accent-red {
    background: linear-gradient(135deg, rgba(90, 35, 51, 0.92) 0%, rgba(185, 76, 99, 0.88) 100%) !important;
    color: var(--text-heading) !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
.display-1,
.display-2,
.display-3,
.display-4,
.display-5,
.display-6,
.card-title,
.section-title,
.page-title {
    color: var(--text-heading) !important;
}

p,
li,
label,
small,
.text-muted,
.lead,
.subtitle,
.description {
    color: var(--text-body) !important;
}

.hero-section,
.page-header,
.header-banner,
.progress-container,
.summary-banner {
    background: rgba(255, 255, 255, 0.08) !important;
    color: var(--text-heading) !important;
    border: 1px solid rgba(212, 169, 74, 0.14) !important;
    backdrop-filter: blur(10px);
}

.text-primary,
.feature-icon,
.section-icon,
.dashboard-card-icon,
.bi.text-primary {
    color: var(--brand-gold) !important;
}

.btn-primary,
.btn-warning,
.btn-success,
.dashboard-primary-btn,
button[type="submit"],
.submit-btn,
.pdf-btn {
    background: linear-gradient(135deg, var(--brand-gold) 0%, var(--brand-gold-warm) 100%) !important;
    border-color: transparent !important;
    color: #061a2b !important;
    box-shadow: 0 16px 32px rgba(212, 169, 74, 0.2) !important;
}

.btn-outline-light,
.btn-outline-primary,
.btn-outline-secondary,
.dashboard-link-btn,
.dashboard-small-btn {
    background: rgba(212, 169, 74, 0.06) !important;
    color: var(--brand-gold) !important;
    border-color: rgba(212, 169, 74, 0.4) !important;
}

.btn-info {
    background: linear-gradient(135deg, var(--brand-blue) 0%, var(--brand-sky) 100%) !important;
    border-color: transparent !important;
    color: #ffffff !important;
    box-shadow: 0 16px 32px rgba(47, 92, 138, 0.2) !important;
}

.btn-danger {
    background: linear-gradient(135deg, var(--brand-rose) 0%, var(--brand-red) 100%) !important;
    border-color: transparent !important;
    color: #ffffff !important;
    box-shadow: 0 16px 32px rgba(185, 76, 99, 0.2) !important;
}

input,
select,
textarea,
.form-control,
.form-select,
.dashboard-input {
    background: rgba(12, 28, 45, 0.72) !important;
    color: var(--text-heading) !important;
    border: 1px solid rgba(143, 163, 181, 0.18) !important;
}

input:focus,
select:focus,
textarea:focus,
.form-control:focus,
.form-select:focus,
.dashboard-input:focus {
    border-color: rgba(212, 169, 74, 0.55) !important;
    box-shadow: 0 0 0 3px rgba(212, 169, 74, 0.12) !important;
}

.progress {
    background: rgba(255, 255, 255, 0.12) !important;
}

.progress-bar {
    background: linear-gradient(90deg, var(--brand-gold), var(--brand-gold-warm)) !important;
}

.navbar-custom,
.topbar,
.site-header {
    background: linear-gradient(180deg, rgba(7, 24, 39, 0.96) 0%, rgba(9, 29, 48, 0.92) 100%) !important;
    border-bottom: 1px solid rgba(212, 169, 74, 0.18) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.28) !important;
}

.alert-info,
.info-box {
    background: linear-gradient(135deg, rgba(24, 58, 90, 0.72) 0%, rgba(47, 92, 138, 0.58) 100%) !important;
    border: 1px solid rgba(78, 143, 209, 0.35) !important;
    color: var(--text-heading) !important;
}

.alert-success,
.success-box {
    background: linear-gradient(135deg, rgba(18, 79, 58, 0.72) 0%, rgba(31, 122, 89, 0.58) 100%) !important;
    border: 1px solid rgba(31, 122, 89, 0.35) !important;
    color: var(--text-heading) !important;
}

.alert-warning,
.warning-box {
    background: linear-gradient(135deg, rgba(106, 66, 15, 0.72) 0%, rgba(184, 115, 22, 0.58) 100%) !important;
    border: 1px solid rgba(212, 169, 74, 0.35) !important;
    color: #fff4df !important;
}

.alert-danger,
.error-message {
    background: linear-gradient(135deg, rgba(90, 35, 51, 0.72) 0%, rgba(185, 76, 99, 0.58) 100%) !important;
    border: 1px solid rgba(201, 90, 74, 0.35) !important;
    color: #ffe6ea !important;
}

@media (max-width: 767.98px) {
    main > section,
    body > section,
    .page-section,
    .hero-section,
    .team-section,
    .cta-section,
    .pricing-section {
        padding-top: var(--section-space-tight);
        padding-bottom: var(--section-space-tight);
    }
}
