/**
 * TRADONS.COM - Components CSS
 * Header, Footer, Buttons, Cards, Forms, Navigation
 */

/* ================================================
   HEADER & NAVIGATION
   ================================================ */
.site-header {
    position: sticky;
    top: 0;
    left: 0;
    right: 0;
    height: var(--header-height);
    background-color: var(--white);
    border-bottom: 1px solid var(--border-color);
    z-index: var(--z-sticky);
    transition: all var(--transition-base);
}

.site-header.scrolled {
    box-shadow: var(--shadow-md);
}

.header-container {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding);
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* Logo */
.header-logo {
    flex-shrink: 0;
}

.logo-link {
    display: block;
}

.logo-image {
    height: 40px;
    width: auto;
}

/* Main Navigation */
.main-nav {
    flex: 1;
    display: flex;
    justify-content: center;
}

.nav-menu {
    display: flex;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: var(--spacing-xs);
}

.nav-item {
    position: relative;
}

.nav-link {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    padding: var(--spacing-sm) var(--spacing-md);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-color);
    text-decoration: none;
    border-radius: var(--border-radius-sm);
    transition: all var(--transition-fast);
}

.nav-link:hover {
    color: var(--accent-color);
    background-color: var(--gray-50);
}

.nav-link-primary {
    background-color: var(--accent-color);
    color: var(--white);
}

.nav-link-primary:hover {
    background-color: var(--primary-color);
    color: var(--white);
}

.dropdown-icon {
    transition: transform var(--transition-fast);
}

.nav-item.active .dropdown-icon,
.nav-item:hover .dropdown-icon {
    transform: rotate(180deg);
}

/* Dropdown Menu */
.dropdown-menu {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    min-width: 220px;
    background-color: var(--white);
    border-radius: var(--border-radius);
    box-shadow: var(--shadow-xl);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    transition: all var(--transition-base);
    z-index: var(--z-dropdown);
    list-style: none;
    padding: var(--spacing-sm);
    margin: 0;
}

.nav-item:hover .dropdown-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.dropdown-menu li {
    margin: 0;
}

.dropdown-menu a {
    display: block;
    padding: var(--spacing-sm) var(--spacing-md);
    font-size: var(--text-sm);
    color: var(--text-color);
    border-radius: var(--border-radius-sm);
    transition: all var(--transition-fast);
}

.dropdown-menu a:hover {
    background-color: var(--gray-50);
    color: var(--accent-color);
}

/* Mega Menu */
.mega-menu {
    min-width: 600px;
    left: 50%;
    transform: translateX(-50%) translateY(-10px);
}

.nav-item:hover .mega-menu {
    transform: translateX(-50%) translateY(0);
}

.mega-menu-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--spacing-lg);
    padding: var(--spacing-md);
}

.mega-menu-col h4 {
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    color: var(--text-color);
    margin-bottom: var(--spacing-sm);
    padding: var(--spacing-xs) var(--spacing-md);
}

.mega-menu-col ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

/* Header Actions */
.header-actions {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
}

/* Language Switcher */
.language-switcher {
    position: relative;
}

.lang-toggle {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    padding: var(--spacing-sm) var(--spacing-md);
    background-color: var(--gray-50);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-color);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.lang-toggle:hover {
    background-color: var(--gray-100);
    border-color: var(--gray-300);
}

.lang-flag {
    font-size: var(--text-lg);
}

.lang-arrow {
    transition: transform var(--transition-fast);
}

.lang-toggle.active .lang-arrow {
    transform: rotate(180deg);
}

.lang-dropdown {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    min-width: 160px;
    background-color: var(--white);
    border-radius: var(--border-radius);
    box-shadow: var(--shadow-lg);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    transition: all var(--transition-base);
    z-index: var(--z-dropdown);
    list-style: none;
    padding: var(--spacing-xs);
    margin: 0;
}

.lang-dropdown.active {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.lang-item {
    margin: 0;
}

.lang-link {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-sm) var(--spacing-md);
    color: var(--text-color);
    border-radius: var(--border-radius-sm);
    transition: all var(--transition-fast);
}

.lang-link:hover {
    background-color: var(--gray-50);
    color: var(--accent-color);
}

.lang-item.active .lang-link {
    background-color: var(--accent-color);
    color: var(--white);
}

/* Mobile Menu Toggle */
.mobile-menu-toggle {
    display: none;
    flex-direction: column;
    gap: 5px;
    padding: var(--spacing-sm);
    background: transparent;
    border: none;
    cursor: pointer;
}

.hamburger-line {
    width: 24px;
    height: 2px;
    background-color: var(--text-color);
    transition: all var(--transition-base);
}

.mobile-menu-toggle.active .hamburger-line:nth-child(1) {
    transform: rotate(45deg) translate(6px, 6px);
}

.mobile-menu-toggle.active .hamburger-line:nth-child(2) {
    opacity: 0;
}

.mobile-menu-toggle.active .hamburger-line:nth-child(3) {
    transform: rotate(-45deg) translate(6px, -6px);
}

/* Mobile Overlay */
.mobile-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    opacity: 0;
    visibility: hidden;
    transition: all var(--transition-base);
    z-index: 998;
}

.mobile-overlay.active {
    opacity: 1;
    visibility: visible;
}

/* Mobile Menu CTA Buttons */
.mobile-menu-cta {
    display: none;
    flex-direction: column;
    padding: var(--spacing-lg);
    border-top: 1px solid var(--border-color);
    gap: var(--spacing-md);
    margin-top: auto;
    width: 100%;
}

.mobile-menu-cta .btn-block,
.mobile-menu-cta .btn {
    width: 100%;
    justify-content: center;
    display: flex;
}

/* ================================================
   FOOTER
   ================================================ */
.site-footer {
    background-color: var(--gray-900);
    color: var(--gray-300);
    padding: var(--spacing-4xl) 0 var(--spacing-xl);
}

.footer-container {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding);
}

.footer-top {
    padding-bottom: var(--spacing-3xl);
    border-bottom: 1px solid var(--gray-700);
}

.footer-grid {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr 1.5fr;
    gap: var(--spacing-3xl);
}

.footer-col {
    display: flex;
    flex-direction: column;
}

/* Footer About */
.footer-logo {
    margin-bottom: var(--spacing-lg);
}

.footer-logo-image {
    height: 36px;
    width: auto;
}

.footer-tagline {
    font-size: var(--text-sm);
    line-height: var(--leading-relaxed);
    color: var(--gray-400);
    margin-bottom: var(--spacing-xl);
}

/* Footer Social */
.footer-social h4 {
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    color: var(--white);
    margin-bottom: var(--spacing-md);
}

.social-links {
    display: flex;
    gap: var(--spacing-md);
}

.social-links a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background-color: var(--gray-800);
    border-radius: var(--border-radius);
    color: var(--gray-400);
    transition: all var(--transition-fast);
}

.social-links a:hover {
    background-color: var(--accent-color);
    color: var(--white);
    transform: translateY(-2px);
}

/* Footer Badges */
.footer-badges {
    display: flex;
    gap: var(--spacing-md);
    margin-top: var(--spacing-xl);
}

.badge-image {
    height: 50px;
    width: auto;
    filter: brightness(0.9);
    transition: filter var(--transition-fast);
}

.badge-image:hover {
    filter: brightness(1.1);
}

/* Footer Columns */
.footer-title {
    font-size: var(--text-base);
    font-weight: var(--font-semibold);
    color: var(--white);
    margin-bottom: var(--spacing-lg);
}

.footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-links li {
    margin-bottom: var(--spacing-sm);
}

.footer-links a {
    font-size: var(--text-sm);
    color: var(--gray-400);
    transition: color var(--transition-fast);
}

.footer-links a:hover {
    color: var(--accent-color);
}

/* Footer Contact */
.contact-block {
    margin-bottom: var(--spacing-lg);
}

.contact-block h4 {
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    color: var(--white);
    margin-bottom: var(--spacing-sm);
}

.contact-block p {
    font-size: var(--text-sm);
    color: var(--gray-400);
    line-height: var(--leading-relaxed);
    margin-bottom: var(--spacing-xs);
}

.contact-block a {
    color: var(--gray-400);
}

.contact-block a:hover {
    color: var(--accent-color);
}

/* Footer Bottom */
.footer-bottom {
    padding-top: var(--spacing-xl);
}

.footer-bottom-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.copyright {
    font-size: var(--text-sm);
    color: var(--gray-500);
    margin: 0;
}

.footer-legal {
    display: flex;
    gap: var(--spacing-lg);
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-legal a {
    font-size: var(--text-sm);
    color: var(--gray-500);
}

.footer-legal a:hover {
    color: var(--accent-color);
}

/* ================================================
   BUTTONS
   ================================================ */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-md) var(--spacing-xl);
    font-size: var(--text-base);
    font-weight: var(--font-semibold);
    line-height: 1;
    text-align: center;
    text-decoration: none;
    border: 2px solid transparent;
    border-radius: var(--border-radius);
    cursor: pointer;
    transition: all var(--transition-fast);
    white-space: nowrap;
}

.btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

/* Button Sizes */
.btn-sm {
    padding: var(--spacing-sm) var(--spacing-lg);
    font-size: var(--text-sm);
}

.btn-lg {
    padding: var(--spacing-lg) var(--spacing-2xl);
    font-size: var(--text-lg);
}

/* Button Variants */
.btn-primary {
    background-color: var(--accent-color);
    color: var(--white);
}

.btn-primary:hover {
    background-color: var(--primary-color);
    color: var(--white);
    transform: translateY(-2px);
    box-shadow: var(--shadow-lg);
}

.btn-secondary {
    background-color: var(--secondary-color);
    color: var(--white);
}

.btn-secondary:hover {
    background-color: var(--primary-color);
    color: var(--white);
}

.btn-outline {
    background-color: transparent;
    border-color: var(--accent-color);
    color: var(--accent-color);
}

.btn-outline:hover {
    background-color: var(--accent-color);
    color: var(--white);
}

.btn-ghost {
    background-color: transparent;
    color: var(--accent-color);
}

.btn-ghost:hover {
    background-color: var(--gray-50);
}

.btn-white {
    background-color: var(--white);
    color: var(--primary-color);
}

.btn-white:hover {
    background-color: var(--gray-100);
}

/* ================================================
   CARDS
   ================================================ */
.card {
    background-color: var(--white);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-lg);
    padding: var(--spacing-xl);
    transition: all var(--transition-base);
}

.card:hover {
    box-shadow: var(--shadow-xl);
    transform: translateY(-4px);
}

.card-header {
    margin-bottom: var(--spacing-lg);
}

.card-title {
    font-size: var(--text-2xl);
    font-weight: var(--font-bold);
    color: var(--text-color);
    margin-bottom: var(--spacing-sm);
}

.card-subtitle {
    font-size: var(--text-base);
    color: var(--text-muted);
}

.card-body {
    margin-bottom: var(--spacing-lg);
}

.card-footer {
    padding-top: var(--spacing-lg);
    border-top: 1px solid var(--border-light);
}

/* ================================================
   FORMS
   ================================================ */
.form-group {
    margin-bottom: var(--spacing-lg);
}

.form-label {
    display: block;
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-color);
    margin-bottom: var(--spacing-sm);
}

.form-label.required::after {
    content: "*";
    color: var(--error-color);
    margin-left: 4px;
}

.form-control {
    width: 100%;
    padding: var(--spacing-md);
    font-size: var(--text-base);
    font-family: var(--font-family);
    color: var(--text-color);
    background-color: var(--white);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    transition: all var(--transition-fast);
}

.form-control:focus {
    outline: none;
    border-color: var(--accent-color);
    box-shadow: 0 0 0 3px rgba(49, 130, 206, 0.1);
}

.form-control::placeholder {
    color: var(--text-muted);
}

.form-control.error {
    border-color: var(--error-color);
}

textarea.form-control {
    min-height: 120px;
    resize: vertical;
}

.form-text {
    display: block;
    margin-top: var(--spacing-xs);
    font-size: var(--text-sm);
    color: var(--text-muted);
}

.form-error {
    display: block;
    margin-top: var(--spacing-xs);
    font-size: var(--text-sm);
    color: var(--error-color);
}

/* ================================================
   BACK TO TOP BUTTON
   ================================================ */
.back-to-top {
    position: fixed;
    bottom: 30px;
    right: 30px;
    width: 50px;
    height: 50px;
    background-color: var(--accent-color);
    color: var(--white);
    border: none;
    border-radius: var(--border-radius-lg);
    cursor: pointer;
    opacity: 0;
    visibility: hidden;
    transform: translateY(20px);
    transition: all var(--transition-base);
    z-index: var(--z-fixed);
    box-shadow: var(--shadow-lg);
}

.back-to-top.visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.back-to-top:hover {
    background-color: var(--primary-color);
    transform: translateY(-4px);
    box-shadow: var(--shadow-xl);
}



/* Hero Section Styles */
.hero-section {
    position: relative;
    min-height: 100vh;
    display: flex;
    align-items: center;
    padding: 120px 0 80px;
    overflow: hidden;
}

/* Background */
.hero-background {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
}

.hero-pattern {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: 
        linear-gradient(90deg, rgba(49, 130, 206, 0.03) 1px, transparent 1px),
        linear-gradient(rgba(49, 130, 206, 0.03) 1px, transparent 1px);
    background-size: 50px 50px;
    animation: patternMove 20s linear infinite;
}

@keyframes patternMove {
    0% { background-position: 0 0; }
    100% { background-position: 50px 50px; }
}

.hero-gradient {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, 
        rgba(26, 54, 93, 0.02) 0%, 
        rgba(49, 130, 206, 0.05) 50%, 
        rgba(26, 54, 93, 0.02) 100%
    );
}

/* Content */
.hero-content {
    position: relative;
    z-index: 1;
    max-width: 900px;
    margin: 0 auto;
    text-align: center;
}

/* Badge */
.hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    background: linear-gradient(135deg, var(--primary-color), var(--accent-color));
    color: var(--white);
    font-size: 14px;
    font-weight: 600;
    border-radius: 50px;
    margin-bottom: 32px;
    box-shadow: 0 4px 12px rgba(49, 130, 206, 0.2);
}

/* Title */
.hero-title {
    font-size: 56px;
    font-weight: 800;
    line-height: 1.2;
    color: var(--primary-color);
    margin-bottom: 24px;
    letter-spacing: -0.02em;
}

.hero-title-highlight {
    display: block;
    background: linear-gradient(135deg, var(--accent-color), var(--secondary-color));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Subtitle */
.hero-subtitle {
    font-size: 24px;
    font-weight: 600;
    color: var(--accent-color);
    margin-bottom: 16px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Description */
.hero-description {
    font-size: 18px;
    line-height: 1.7;
    color: var(--text-light);
    margin-bottom: 40px;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

/* Actions */
.hero-actions {
    display: flex;
    gap: 16px;
    justify-content: center;
    margin-bottom: 60px;
    flex-wrap: wrap;
}

.hero-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

/* Features Grid */
.hero-features {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    margin-bottom: 48px;
    padding: 40px 0;
    border-top: 1px solid var(--border-color);
    border-bottom: 1px solid var(--border-color);
}

.hero-feature-item {
    display: flex;
    align-items: center;
    gap: 12px;
    text-align: left;
}

.hero-feature-icon {
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--accent-color), var(--secondary-color));
    border-radius: 12px;
    color: var(--white);
}

.hero-feature-content {
    flex: 1;
}

.hero-feature-title {
    font-size: 20px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 4px;
}

.hero-feature-desc {
    font-size: 13px;
    color: var(--text-muted);
}

/* Trust Badges */
.hero-trust-badges {
    display: flex;
    gap: 32px;
    justify-content: center;
    flex-wrap: wrap;
}

.trust-badge {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    background: var(--gray-50);
    border-radius: 8px;
    font-size: 13px;
    font-weight: 500;
    color: var(--text-color);
    border: 1px solid var(--border-color);
}

.trust-badge svg {
    color: var(--success-color);
}

/* Scroll Indicator */
.hero-scroll-indicator {
    position: absolute;
    bottom: 40px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    color: var(--text-muted);
    font-size: 13px;
    animation: bounce 2s infinite;
}

@keyframes bounce {
    0%, 100% { transform: translateX(-50%) translateY(0); }
    50% { transform: translateX(-50%) translateY(-10px); }
}

/* Responsive */
@media (max-width: 991px) {
    .hero-title { font-size: 42px; }
    .hero-subtitle { font-size: 20px; }
    .hero-description { font-size: 16px; }
    .hero-features { grid-template-columns: repeat(2, 1fr); gap: 20px; }
}

@media (max-width: 767px) {
    .hero-section { min-height: auto; padding: 100px 0 60px; }
    .hero-title { font-size: 32px; }
    .hero-subtitle { font-size: 18px; }
    .hero-description { font-size: 15px; }
    .hero-actions { flex-direction: column; }
    .hero-btn { width: 100%; justify-content: center; }
    .hero-features { grid-template-columns: 1fr; gap: 16px; }
    .hero-trust-badges { gap: 16px; }
}
/* ================================================
   PRIVACY POLICY PAGE
   ================================================ */

/* Page Hero */
.page-hero {
    padding: 140px 0 80px;
    background: linear-gradient(135deg, var(--gray-50) 0%, var(--white) 100%);
    border-bottom: 1px solid var(--border-color);
}

.page-hero-content {
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
}

.breadcrumb {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-bottom: 24px;
    font-size: 14px;
    color: var(--text-muted);
}

.breadcrumb a {
    color: var(--accent-color);
    text-decoration: none;
}

.breadcrumb a:hover {
    text-decoration: underline;
}

.breadcrumb-separator {
    color: var(--text-muted);
}

.page-title {
    font-size: 48px;
    font-weight: 800;
    color: var(--primary-color);
    margin-bottom: 16px;
}

.page-subtitle {
    font-size: 16px;
    color: var(--text-light);
}

/* Privacy Layout */
.privacy-layout {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 60px;
    max-width: 1200px;
    margin: 0 auto;
}

/* Sidebar */
.privacy-sidebar {
    position: relative;
}

.privacy-nav-sticky {
    position: sticky;
    top: 100px;
}

.privacy-nav-title {
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-color);
    margin-bottom: 16px;
}

.privacy-nav {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 32px;
}

.privacy-nav-link {
    display: block;
    padding: 10px 16px;
    font-size: 14px;
    color: var(--text-light);
    text-decoration: none;
    border-left: 2px solid transparent;
    transition: all 0.2s ease;
}

.privacy-nav-link:hover {
    color: var(--accent-color);
    background-color: var(--gray-50);
    border-left-color: var(--accent-color);
}

.privacy-nav-link.active {
    color: var(--accent-color);
    background-color: var(--gray-50);
    border-left-color: var(--accent-color);
    font-weight: 600;
}

.privacy-actions {
    padding-top: 24px;
    border-top: 1px solid var(--border-color);
}

/* Article */
.privacy-article {
    max-width: 800px;
}

.privacy-section {
    margin-bottom: 48px;
    scroll-margin-top: 100px;
}

.privacy-section-icon {
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--accent-color), var(--secondary-color));
    border-radius: 16px;
    color: var(--white);
    margin-bottom: 24px;
}

.privacy-intro {
    font-size: 18px;
    line-height: 1.7;
    color: var(--text-color);
    margin-bottom: 16px;
}

.privacy-date {
    font-size: 14px;
    color: var(--text-muted);
}

.privacy-section-title {
    font-size: 28px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.section-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: var(--accent-color);
    color: var(--white);
    border-radius: 8px;
    font-size: 18px;
    font-weight: 700;
}

.privacy-section p {
    font-size: 16px;
    line-height: 1.8;
    color: var(--text-light);
    margin-bottom: 16px;
}

/* Privacy List */
.privacy-list {
    background: var(--gray-50);
    padding: 24px;
    border-radius: 12px;
    margin: 24px 0;
}

.privacy-list h4 {
    font-size: 16px;
    font-weight: 600;
    color: var(--text-color);
    margin-bottom: 12px;
}

.privacy-list ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.privacy-list li {
    padding: 8px 0 8px 28px;
    position: relative;
    font-size: 15px;
    color: var(--text-light);
}

.privacy-list li::before {
    content: '✓';
    position: absolute;
    left: 0;
    color: var(--success-color);
    font-weight: bold;
}

/* Privacy Highlight */
.privacy-highlight {
    display: flex;
    gap: 16px;
    padding: 20px;
    background: linear-gradient(135deg, rgba(49, 130, 206, 0.1), rgba(43, 119, 173, 0.1));
    border-left: 4px solid var(--accent-color);
    border-radius: 8px;
    margin: 24px 0;
}

.privacy-highlight svg {
    flex-shrink: 0;
    color: var(--accent-color);
}

.privacy-highlight p {
    margin: 0;
    font-size: 15px;
    color: var(--text-color);
}

/* Privacy Badges */
.privacy-badges {
    display: flex;
    gap: 24px;
    margin: 24px 0;
    flex-wrap: wrap;
}

.privacy-badge {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 16px;
    background: var(--white);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    text-align: center;
}

.privacy-badge img {
    width: 60px;
    height: auto;
}

.privacy-badge span {
    font-size: 12px;
    font-weight: 600;
    color: var(--text-color);
}

/* Contact Grid */
.privacy-contact-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 24px;
    margin: 24px 0;
}

.privacy-contact-item {
    display: flex;
    gap: 16px;
    padding: 20px;
    background: var(--gray-50);
    border-radius: 12px;
}

.privacy-contact-item svg {
    flex-shrink: 0;
    color: var(--accent-color);
}

.privacy-contact-item strong {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: var(--text-color);
    margin-bottom: 4px;
}

.privacy-contact-item p {
    font-size: 14px;
    color: var(--text-light);
    margin: 0;
}

/* Responsive */
@media (max-width: 991px) {
    .privacy-layout {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    
    .privacy-sidebar {
        order: 2;
    }
    
    .privacy-nav-sticky {
        position: static;
    }
    
    .page-title {
        font-size: 36px;
    }
}

@media (max-width: 767px) {
    .page-hero {
        padding: 120px 0 60px;
    }
    
    .page-title {
        font-size: 28px;
    }
    
    .privacy-section-title {
        font-size: 22px;
    }
    
    .privacy-contact-grid {
        grid-template-columns: 1fr;
    }
}

/* ================================================
   WHY TRIAS PAGE
   ================================================ */

/* Hero Section */
.why-hero {
    padding: 140px 0 80px;
    background: linear-gradient(135deg, #f7fafc 0%, #edf2f7 100%);
    border-bottom: 1px solid var(--border-color);
}

.why-hero-content {
    max-width: 900px;
    margin: 0 auto;
    text-align: center;
}

.trias-logo-badge {
    margin-bottom: 32px;
}

.trias-logo {
    height: 80px;
    width: auto;
}

.why-hero-title {
    font-size: 56px;
    font-weight: 800;
    color: var(--primary-color);
    margin-bottom: 16px;
}

.why-hero-subtitle {
    font-size: 24px;
    font-weight: 600;
    color: var(--secondary-color);
    margin-bottom: 24px;
}

.why-hero-intro {
    font-size: 18px;
    line-height: 1.7;
    color: var(--text-light);
    margin-bottom: 40px;
}

.trust-badges-inline {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 24px;
}

.trust-badge-item {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 600;
    color: var(--success-color);
}

.trust-badge-item svg {
    flex-shrink: 0;
}

/* Differentiators */
.diff-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.diff-card {
    padding: 32px;
    background: var(--white);
    border-radius: 12px;
    border: 1px solid var(--border-color);
    transition: all 0.3s ease;
}

.diff-card:hover {
    transform: translateY(-8px);
    box-shadow: var(--shadow-xl);
    border-color: var(--accent-color);
}

.diff-icon {
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--accent-color), var(--secondary-color));
    border-radius: 12px;
    color: var(--white);
    margin-bottom: 20px;
}

.diff-title {
    font-size: 20px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.diff-desc {
    font-size: 15px;
    line-height: 1.6;
    color: var(--text-light);
}

/* Benefits */
.benefits-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.benefit-card {
    padding: 40px 24px;
    background: var(--white);
    border-radius: 12px;
    text-align: center;
    border: 2px solid var(--border-color);
}

.benefit-stat {
    font-size: 48px;
    font-weight: 800;
    background: linear-gradient(135deg, var(--accent-color), var(--secondary-color));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-bottom: 12px;
}

.benefit-label {
    font-size: 18px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 8px;
}

.benefit-desc {
    font-size: 14px;
    color: var(--text-muted);
}

/* Technology */
.tech-grid {
    display: grid;
    gap: 24px;
    margin-top: 48px;
}

.tech-card {
    display: flex;
    gap: 24px;
    padding: 32px;
    background: var(--white);
    border-radius: 12px;
    border-left: 4px solid var(--accent-color);
    box-shadow: var(--shadow);
}

.tech-number {
    font-size: 48px;
    font-weight: 800;
    color: var(--gray-200);
    flex-shrink: 0;
}

.tech-title {
    font-size: 22px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.tech-desc {
    font-size: 15px;
    line-height: 1.6;
    color: var(--text-light);
}

/* Comparison Table */
.comparison-table-wrapper {
    overflow-x: auto;
    margin-top: 48px;
}

.comparison-table {
    width: 100%;
    border-collapse: collapse;
    background: var(--white);
    border-radius: 12px;
    overflow: hidden;
}

.comparison-table thead {
    background: var(--primary-color);
    color: var(--white);
}

.comparison-table th {
    padding: 20px;
    font-size: 16px;
    font-weight: 700;
    text-align: left;
}

.comparison-table th.trias-col {
    background: var(--accent-color);
    display: flex;
    align-items: center;
    gap: 12px;
}

.comparison-table td {
    padding: 20px;
    border-bottom: 1px solid var(--border-color);
}

.comparison-table tbody tr:last-child td {
    border-bottom: none;
}

.feature-col {
    font-weight: 600;
    color: var(--text-color);
}

.trias-col {
    background: rgba(49, 130, 206, 0.05);
    font-weight: 600;
    color: var(--accent-color);
}

.traditional-col {
    color: var(--text-muted);
}

.check-mark {
    color: var(--success-color);
    font-size: 20px;
    margin-right: 8px;
}

/* Success Stories */
.success-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.success-card {
    padding: 32px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow);
}

.success-company {
    font-size: 14px;
    font-weight: 700;
    color: var(--accent-color);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 16px;
}

.success-quote {
    font-size: 16px;
    line-height: 1.7;
    color: var(--text-color);
    font-style: italic;
    margin: 0 0 20px 0;
    padding-left: 20px;
    border-left: 3px solid var(--accent-color);
}

.success-author {
    font-size: 14px;
    font-weight: 600;
    color: var(--text-light);
    margin-bottom: 12px;
}

.success-result {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 600;
    color: var(--success-color);
    padding: 12px;
    background: rgba(56, 161, 105, 0.1);
    border-radius: 8px;
}

/* Final CTA */
.why-cta {
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    color: var(--white);
}

.why-cta-content {
    text-align: center;
    max-width: 800px;
    margin: 0 auto;
}

.why-cta-title {
    font-size: 42px;
    font-weight: 800;
    color: var(--white);
    margin-bottom: 16px;
}

.why-cta-subtitle {
    font-size: 20px;
    color: rgba(255, 255, 255, 0.9);
    margin-bottom: 40px;
}

.why-cta-buttons {
    display: flex;
    justify-content: center;
    gap: 16px;
    flex-wrap: wrap;
}

.btn-outline-white {
    background: transparent;
    color: var(--white);
    border: 2px solid var(--white);
}

.btn-outline-white:hover {
    background: var(--white);
    color: var(--primary-color);
}

/* Responsive */
@media (max-width: 991px) {
    .diff-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .benefits-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .success-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767px) {
    .why-hero-title {
        font-size: 36px;
    }
    
    .trias-logo {
        height: 60px;
    }
    
    .diff-grid {
        grid-template-columns: 1fr;
    }
    
    .benefits-grid {
        grid-template-columns: 1fr;
    }
    
    .why-cta-buttons {
        flex-direction: column;
    }
    
    .btn-lg {
        width: 100%;
    }
}

/* ================================================
   PRODUCT PAGES
   ================================================ */

/* Product Hero */
.product-hero {
    padding: 140px 0 80px;
    background: linear-gradient(135deg, #f7fafc 0%, #edf2f7 100%);
}

.product-hero .container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.product-breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 24px;
    font-size: 14px;
    color: var(--text-muted);
}

.product-breadcrumb a {
    color: var(--accent-color);
    text-decoration: none;
}

.product-header {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    margin-bottom: 24px;
}

.product-icon {
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--accent-color), var(--secondary-color));
    border-radius: 16px;
    color: var(--white);
    flex-shrink: 0;
}

.product-title {
    font-size: 42px;
    font-weight: 800;
    color: var(--primary-color);
    margin-bottom: 8px;
}

.product-subtitle {
    font-size: 20px;
    font-weight: 600;
    color: var(--secondary-color);
}

.product-intro {
    font-size: 17px;
    line-height: 1.7;
    color: var(--text-light);
    margin-bottom: 32px;
}

.product-actions {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}

.product-hero-image {
    position: relative;
}

.product-screenshot {
    border-radius: 12px;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);
    overflow: hidden;
}

.screenshot-placeholder {
    background: var(--gray-100);
    min-height: 400px;
}

/* Product Features */
.product-features .features-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.feature-card {
    padding: 32px;
    background: var(--white);
    border-radius: 12px;
    border: 1px solid var(--border-color);
    transition: all 0.3s ease;
}

.feature-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-lg);
    border-color: var(--accent-color);
}

.feature-icon {
    width: 56px;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(49, 130, 206, 0.1);
    border-radius: 12px;
    color: var(--accent-color);
    margin-bottom: 20px;
}

.feature-title {
    font-size: 18px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.feature-desc {
    font-size: 15px;
    line-height: 1.6;
    color: var(--text-light);
}

/* Technical Specs */
.specs-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 48px;
}

.spec-item {
    padding: 24px;
    background: var(--white);
    border-radius: 8px;
    border-left: 4px solid var(--accent-color);
}

.spec-label {
    font-size: 14px;
    font-weight: 600;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 8px;
}

.spec-value {
    font-size: 18px;
    font-weight: 700;
    color: var(--primary-color);
}

/* Dashboard Features */
.dashboard-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.dashboard-card {
    padding: 40px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow);
    border: 2px solid transparent;
    transition: all 0.3s ease;
}

.dashboard-card:hover {
    border-color: var(--accent-color);
    transform: scale(1.02);
}

.dashboard-title {
    font-size: 22px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.dashboard-desc {
    font-size: 15px;
    line-height: 1.6;
    color: var(--text-light);
}

/* Policy Management */
.policy-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.policy-card {
    display: flex;
    gap: 24px;
    padding: 32px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow);
}

.policy-number {
    font-size: 48px;
    font-weight: 800;
    color: var(--gray-200);
    flex-shrink: 0;
    line-height: 1;
}

.policy-title {
    font-size: 20px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.policy-desc {
    font-size: 15px;
    line-height: 1.6;
    color: var(--text-light);
}

/* Integrations */
.integrations-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-top: 48px;
}

.integration-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 20px;
    background: var(--white);
    border-radius: 8px;
    border: 1px solid var(--border-color);
    font-size: 14px;
    font-weight: 500;
    color: var(--text-color);
}

.integration-item svg {
    color: var(--success-color);
    flex-shrink: 0;
}

/* Use Cases */
.usecases-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.usecase-card {
    padding: 32px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow);
}

.usecase-title {
    font-size: 20px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.usecase-desc {
    font-size: 15px;
    line-height: 1.6;
    color: var(--text-light);
}

/* Product CTA */
.product-cta {
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
}

.product-cta-content {
    text-align: center;
    max-width: 800px;
    margin: 0 auto;
}

.product-cta-title {
    font-size: 36px;
    font-weight: 800;
    color: var(--white);
    margin-bottom: 16px;
}

.product-cta-desc {
    font-size: 18px;
    color: rgba(255, 255, 255, 0.9);
    margin-bottom: 32px;
}

.product-cta-buttons {
    display: flex;
    justify-content: center;
    gap: 16px;
    flex-wrap: wrap;
}

/* Responsive */
@media (max-width: 991px) {
    .product-hero .container {
        grid-template-columns: 1fr;
    }
    
    .product-features .features-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .specs-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .integrations-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 767px) {
    .product-title {
        font-size: 32px;
    }
    
    .product-features .features-grid {
        grid-template-columns: 1fr;
    }
    
    .dashboard-grid,
    .policy-grid,
    .usecases-grid {
        grid-template-columns: 1fr;
    }
    
    .specs-grid,
    .integrations-grid {
        grid-template-columns: 1fr;
    }
}

/* ================================================
   CAD PRODUCT PAGE - Additional Styles
   ================================================ */

/* Stats Section */
.product-stats .stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.stat-card {
    padding: 40px 24px;
    background: var(--white);
    border-radius: 12px;
    text-align: center;
    border: 2px solid var(--border-color);
    transition: all 0.3s ease;
}

.stat-card:hover {
    border-color: #7B1FA2;
    transform: translateY(-4px);
}

.stat-value {
    font-size: 56px;
    font-weight: 800;
    background: linear-gradient(135deg, #7B1FA2, #9C27B0);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-bottom: 12px;
}

.stat-label {
    font-size: 18px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 8px;
}

.stat-desc {
    font-size: 14px;
    color: var(--text-muted);
}

/* Data Types */
.datatypes-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 48px;
}

.datatype-card {
    padding: 32px;
    background: var(--white);
    border-radius: 12px;
    border-left: 4px solid #7B1FA2;
    box-shadow: var(--shadow);
}

.datatype-title {
    font-size: 18px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 16px;
}

.datatype-items {
    font-size: 14px;
    line-height: 1.8;
    color: var(--text-light);
}

/* Scanning */
.scanning-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.scanning-card {
    padding: 32px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow);
    border: 1px solid var(--border-color);
    transition: all 0.3s ease;
}

.scanning-card:hover {
    border-color: #7B1FA2;
    transform: translateX(8px);
}

.scanning-title {
    font-size: 20px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.scanning-desc {
    font-size: 15px;
    line-height: 1.6;
    color: var(--text-light);
}

/* Classification Methods */
.methods-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.method-card {
    padding: 40px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow-lg);
    border: 2px solid var(--border-color);
    transition: all 0.3s ease;
}

.method-card:hover {
    border-color: #7B1FA2;
    transform: scale(1.03);
}

.method-title {
    font-size: 22px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 16px;
}

.method-desc {
    font-size: 15px;
    line-height: 1.7;
    color: var(--text-light);
    margin-bottom: 20px;
}

.method-accuracy {
    display: inline-block;
    padding: 8px 16px;
    background: rgba(123, 31, 162, 0.1);
    color: #7B1FA2;
    border-radius: 20px;
    font-size: 14px;
    font-weight: 600;
}

/* Workflow */
.workflow-steps {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 32px;
    margin-top: 48px;
    position: relative;
}

.workflow-step {
    flex: 1;
    text-align: center;
    position: relative;
}

.step-number {
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 24px;
    background: linear-gradient(135deg, #7B1FA2, #9C27B0);
    border-radius: 50%;
    color: var(--white);
    font-size: 36px;
    font-weight: 800;
}

.step-title {
    font-size: 22px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.step-desc {
    font-size: 15px;
    line-height: 1.6;
    color: var(--text-light);
}

.step-arrow {
    position: absolute;
    top: 40px;
    right: -40px;
    font-size: 48px;
    color: var(--gray-300);
    font-weight: 300;
}

/* Responsive */
@media (max-width: 991px) {
    .product-stats .stats-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .datatypes-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .methods-grid {
        grid-template-columns: 1fr;
    }
    
    .workflow-steps {
        flex-direction: column;
    }
    
    .step-arrow {
        display: none;
    }
}

@media (max-width: 767px) {
    .product-stats .stats-grid,
    .datatypes-grid,
    .scanning-grid {
        grid-template-columns: 1fr;
    }
}

/* ================================================
   DLP PRODUCT PAGE - Additional Styles
   ================================================ */

/* Protection Channels */
.channels-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.channel-card {
    padding: 32px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow);
    border: 2px solid var(--border-color);
    transition: all 0.3s ease;
}

.channel-card:hover {
    border-color: #2E7D32;
    transform: translateY(-4px);
}

.channel-title {
    font-size: 20px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.channel-desc {
    font-size: 15px;
    line-height: 1.6;
    color: var(--text-light);
    margin-bottom: 16px;
}

.channel-features {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.channel-feature-tag {
    display: inline-block;
    padding: 6px 12px;
    background: rgba(46, 125, 50, 0.1);
    color: #2E7D32;
    border-radius: 16px;
    font-size: 13px;
    font-weight: 500;
}

/* Policy Actions */
.actions-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    margin-top: 48px;
}

.action-card {
    padding: 24px;
    background: var(--white);
    border-radius: 8px;
    border: 1px solid var(--border-color);
    transition: all 0.3s ease;
}

.action-card:hover {
    border-color: #2E7D32;
    box-shadow: var(--shadow);
}

.action-icon {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(46, 125, 50, 0.1);
    border-radius: 8px;
    color: #2E7D32;
    margin-bottom: 16px;
}

.action-title {
    font-size: 16px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 8px;
}

.action-desc {
    font-size: 14px;
    line-height: 1.5;
    color: var(--text-light);
}

/* Advanced Features */
.advanced-grid {
    display: grid;
    gap: 24px;
    margin-top: 48px;
}

.advanced-card {
    display: flex;
    gap: 24px;
    padding: 32px;
    background: var(--white);
    border-radius: 12px;
    border-left: 4px solid #2E7D32;
    box-shadow: var(--shadow);
}

.advanced-number {
    font-size: 48px;
    font-weight: 800;
    color: var(--gray-200);
    flex-shrink: 0;
    line-height: 1;
}

.advanced-title {
    font-size: 22px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.advanced-desc {
    font-size: 15px;
    line-height: 1.6;
    color: var(--text-light);
}

/* Performance */
.performance-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.performance-card {
    padding: 40px 24px;
    background: var(--white);
    border-radius: 12px;
    text-align: center;
    border: 2px solid var(--border-color);
}

.perf-stat {
    font-size: 36px;
    font-weight: 800;
    
    -webkit-background-clip: text;
    -webkit-text-fill-color: white;
    background-clip: text;
    margin-bottom: 12px;
}

.perf-label {
    font-size: 18px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 8px;
}

.perf-desc {
    font-size: 14px;
    color: var(--text-muted);
}

/* Deployment */
.deployment-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.deployment-card {
    padding: 40px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow-lg);
    text-align: center;
    border: 2px solid transparent;
    transition: all 0.3s ease;
}

.deployment-card:hover {
    border-color: #2E7D32;
    transform: scale(1.03);
}

.deployment-title {
    font-size: 24px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 16px;
}

.deployment-desc {
    font-size: 15px;
    line-height: 1.7;
    color: var(--text-light);
}

/* Responsive */
@media (max-width: 991px) {
    .channels-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .actions-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .performance-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .deployment-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767px) {
    .channels-grid,
    .actions-grid,
    .performance-grid {
        grid-template-columns: 1fr;
    }
}

/* ================================================
   NINS PRODUCT PAGE - Additional Styles
   ================================================ */

/* NINS Stats - Blue Gradient */
.nins-stat {
    background: linear-gradient(135deg, #0D47A1, #1976D2) !important;
}

/* Network Coverage */
.coverage-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.coverage-card {
    padding: 32px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow);
    border: 2px solid var(--border-color);
    transition: all 0.3s ease;
}

.coverage-card:hover {
    border-color: #0D47A1;
    transform: translateY(-4px);
}

.coverage-title {
    font-size: 20px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.coverage-desc {
    font-size: 15px;
    line-height: 1.6;
    color: var(--text-light);
}

/* Deployment Modes */
.deployment-modes-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.deploy-mode-card {
    padding: 40px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow-lg);
    border: 2px solid transparent;
    transition: all 0.3s ease;
}

.deploy-mode-card:hover {
    border-color: #0D47A1;
    transform: scale(1.03);
}

.deploy-mode-title {
    font-size: 24px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 16px;
}

.deploy-mode-desc {
    font-size: 15px;
    line-height: 1.7;
    color: var(--text-light);
    margin-bottom: 20px;
}

.deploy-mode-pros {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.pro-tag {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 500;
    color: #0D47A1;
}

.pro-tag svg {
    color: var(--success-color);
    flex-shrink: 0;
}

/* DPI Capabilities */
.dpi-grid {
    display: grid;
    gap: 24px;
    margin-top: 48px;
}

.dpi-card {
    display: flex;
    gap: 24px;
    padding: 32px;
    background: var(--white);
    border-radius: 12px;
    border-left: 4px solid #0D47A1;
    box-shadow: var(--shadow);
}

.dpi-number {
    font-size: 48px;
    font-weight: 800;
    color: var(--gray-200);
    flex-shrink: 0;
    line-height: 1;
}

.dpi-title {
    font-size: 22px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.dpi-desc {
    font-size: 15px;
    line-height: 1.6;
    color: var(--text-light);
}

/* Architecture */
.architecture-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.arch-card {
    padding: 40px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow);
    text-align: center;
    border: 2px solid var(--border-color);
    transition: all 0.3s ease;
}

.arch-card:hover {
    border-color: #0D47A1;
    transform: translateY(-4px);
}

.arch-title {
    font-size: 22px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 16px;
}

.arch-desc {
    font-size: 15px;
    line-height: 1.7;
    color: var(--text-light);
}

/* Responsive */
@media (max-width: 991px) {
    .coverage-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .deployment-modes-grid,
    .architecture-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767px) {
    .coverage-grid {
        grid-template-columns: 1fr;
    }
}

/* ================================================
   SOLUTION PAGES
   ================================================ */

/* Solution Hero */
.solution-hero {
    padding: 140px 0 80px;
    background: linear-gradient(135deg, #f7fafc 0%, #edf2f7 100%);
}

.solution-hero .container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.solution-breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 24px;
    font-size: 14px;
    color: var(--text-muted);
}

.solution-breadcrumb a {
    color: var(--accent-color);
    text-decoration: none;
}

.solution-header {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    margin-bottom: 24px;
}

.solution-icon {
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #3182ce, #2b77ad);
    border-radius: 16px;
    color: var(--white);
    flex-shrink: 0;
}

.solution-title {
    font-size: 42px;
    font-weight: 800;
    color: var(--primary-color);
    margin-bottom: 8px;
}

.solution-subtitle {
    font-size: 20px;
    font-weight: 600;
    color: var(--secondary-color);
}

.solution-intro {
    font-size: 17px;
    line-height: 1.7;
    color: var(--text-light);
    margin-bottom: 32px;
}

.solution-actions {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}

/* Cloud Providers Showcase */
.cloud-providers-showcase {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    padding: 40px;
}

.provider-badge {
    padding: 32px;
    background: var(--white);
    border-radius: 12px;
    text-align: center;
    font-size: 24px;
    font-weight: 700;
    color: var(--primary-color);
    box-shadow: var(--shadow);
    border: 2px solid var(--border-color);
}

/* Challenges */
.challenges-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.challenge-card {
    padding: 32px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow);
}

.challenge-icon {
    width: 56px;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(229, 62, 62, 0.1);
    border-radius: 12px;
    color: var(--error-color);
    margin-bottom: 20px;
}

.challenge-title {
    font-size: 20px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.challenge-desc {
    font-size: 15px;
    line-height: 1.6;
    color: var(--text-light);
}

/* Approach */
.approach-grid {
    display: grid;
    gap: 24px;
    margin-top: 48px;
}

.approach-card {
    display: flex;
    gap: 24px;
    padding: 32px;
    background: var(--white);
    border-radius: 12px;
    border-left: 4px solid var(--accent-color);
    box-shadow: var(--shadow);
}

.approach-number {
    font-size: 48px;
    font-weight: 800;
    color: var(--gray-200);
    flex-shrink: 0;
    line-height: 1;
}

.approach-title {
    font-size: 22px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.approach-desc {
    font-size: 15px;
    line-height: 1.6;
    color: var(--text-light);
}

/* Platforms */
.platforms-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.platform-card {
    padding: 32px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow);
    border: 2px solid var(--border-color);
}

.platform-title {
    font-size: 22px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 16px;
}

.platform-features,
.platform-integration {
    font-size: 14px;
    line-height: 1.7;
    color: var(--text-light);
    margin-bottom: 12px;
}

.platform-features strong,
.platform-integration strong {
    color: var(--text-color);
}

/* Capabilities */
.capabilities-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 48px;
}

.capability-card {
    padding: 24px;
    background: var(--white);
    border-radius: 8px;
    border: 1px solid var(--border-color);
}

.capability-icon {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(56, 161, 105, 0.1);
    border-radius: 8px;
    color: var(--success-color);
    margin-bottom: 16px;
}

.capability-title {
    font-size: 18px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 8px;
}

.capability-desc {
    font-size: 14px;
    line-height: 1.5;
    color: var(--text-light);
}

/* Deployment Options */
.deployment-options-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.deployment-option-card {
    padding: 40px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow-lg);
    border: 2px solid transparent;
}

.deployment-option-card:hover {
    border-color: var(--accent-color);
}

.deployment-option-title {
    font-size: 22px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 16px;
}

.deployment-option-desc {
    font-size: 15px;
    line-height: 1.6;
    color: var(--text-light);
    margin-bottom: 20px;
}

.deployment-option-pros {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.deployment-pro-tag {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 500;
    color: var(--success-color);
}

.deployment-pro-tag svg {
    flex-shrink: 0;
}

/* Benefits Stats */
.benefits-stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.benefit-stat-card {
    padding: 40px 24px;
    background: var(--white);
    border-radius: 12px;
    text-align: center;
    border: 2px solid var(--border-color);
}

.benefit-stat-value {
    font-size: 56px;
    font-weight: 800;
    background: linear-gradient(135deg, #3182ce, #2b77ad);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-bottom: 12px;
}

.benefit-stat-label {
    font-size: 18px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 8px;
}

.benefit-stat-desc {
    font-size: 14px;
    color: var(--text-muted);
}

/* Solution CTA */
.solution-cta {
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
}

.solution-cta-content {
    text-align: center;
    max-width: 800px;
    margin: 0 auto;
}

.solution-cta-title {
    font-size: 36px;
    font-weight: 800;
    color: var(--white);
    margin-bottom: 16px;
}

.solution-cta-desc {
    font-size: 18px;
    color: rgba(255, 255, 255, 0.9);
    margin-bottom: 32px;
}

.solution-cta-buttons {
    display: flex;
    justify-content: center;
    gap: 16px;
    flex-wrap: wrap;
}

/* Responsive */
@media (max-width: 991px) {
    .solution-hero .container {
        grid-template-columns: 1fr;
    }
    
    .challenges-grid,
    .platforms-grid {
        grid-template-columns: 1fr;
    }
    
    .capabilities-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .deployment-options-grid {
        grid-template-columns: 1fr;
    }
    
    .benefits-stats-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 767px) {
    .solution-title {
        font-size: 32px;
    }
    
    .capabilities-grid,
    .benefits-stats-grid {
        grid-template-columns: 1fr;
    }
}

/* ================================================
   DATA DISCOVERY SOLUTION - Additional Styles
   ================================================ */

/* Discovery Icon - Purple Gradient */
.discovery-icon {
    background: linear-gradient(135deg, #7B1FA2, #9C27B0) !important;
}

/* Discovery Gradient for Stats */
.discovery-gradient {
    background: linear-gradient(135deg, #7B1FA2, #9C27B0) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

/* Discovery Approach Cards */
.discovery-approach {
    border-left-color: #7B1FA2 !important;
}

/* Discovery Visual */
.discovery-visual {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    padding: 40px;
}

.discovery-stat-box {
    padding: 32px;
    background: var(--white);
    border-radius: 12px;
    text-align: center;
    box-shadow: var(--shadow);
    border: 2px solid #7B1FA2;
}

.stat-large {
    font-size: 48px;
    font-weight: 800;
    background: linear-gradient(135deg, #7B1FA2, #9C27B0);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-bottom: 8px;
}

.stat-label {
    font-size: 14px;
    font-weight: 600;
    color: var(--text-color);
}

/* Performance Stats Section */
.solution-performance {
    padding: 60px 0;
}

.performance-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 32px;
}

.performance-stat-card {
    padding: 32px 20px;
    background: var(--white);
    border-radius: 12px;
    text-align: center;
    border: 2px solid var(--border-color);
    transition: all 0.3s ease;
}

.performance-stat-card:hover {
    border-color: #7B1FA2;
    transform: translateY(-4px);
}

.perf-stat-value {
    font-size: 48px;
    font-weight: 800;
    margin-bottom: 12px;
}

.perf-stat-label {
    font-size: 16px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 8px;
}

.perf-stat-desc {
    font-size: 13px;
    color: var(--text-muted);
}

/* Data Types Discovery */
.datatypes-discovery-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 48px;
}

.datatype-discovery-card {
    padding: 28px;
    background: var(--white);
    border-radius: 12px;
    border-left: 4px solid #7B1FA2;
    box-shadow: var(--shadow);
}

.datatype-category {
    font-size: 18px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.datatype-types {
    font-size: 14px;
    line-height: 1.8;
    color: var(--text-light);
}

/* Discovery Process Steps */
.process-steps {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 32px;
    margin-top: 48px;
    position: relative;
}

.process-step {
    flex: 1;
    text-align: center;
    position: relative;
}

/* Reporting Grid */
.reporting-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.report-card {
    padding: 32px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow-lg);
    border: 2px solid transparent;
    transition: all 0.3s ease;
}

.report-card:hover {
    border-color: #7B1FA2;
    transform: scale(1.02);
}

.report-title {
    font-size: 20px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.report-desc {
    font-size: 15px;
    line-height: 1.6;
    color: var(--text-light);
}

/* Responsive */
@media (max-width: 991px) {
    .discovery-visual {
        grid-template-columns: 1fr;
    }
    
    .performance-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .datatypes-discovery-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .process-steps {
        flex-direction: column;
    }
    
    .reporting-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767px) {
    .performance-grid,
    .datatypes-discovery-grid {
        grid-template-columns: 1fr;
    }
}

/* ================================================
   DATA SECURITY SOLUTION - Additional Styles
   ================================================ */

/* Security Icon - Green Gradient */
.security-icon {
    background: linear-gradient(135deg, #2E7D32, #43A047) !important;
}

/* Security Gradient for Stats */
.security-gradient {
    background: linear-gradient(135deg, #2E7D32, #43A047) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

/* Security Approach Cards */
.security-approach {
    border-left-color: #2E7D32 !important;
}

/* Security Shield Visual */
.security-shield-visual {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

/* Security Layers */
.layers-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.layer-card {
    padding: 32px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow);
    border: 2px solid var(--border-color);
    transition: all 0.3s ease;
}

.layer-card:hover {
    border-color: #2E7D32;
    transform: translateY(-4px);
}

.layer-title {
    font-size: 20px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.layer-desc {
    font-size: 15px;
    line-height: 1.6;
    color: var(--text-light);
    margin-bottom: 16px;
}

.layer-features {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.layer-feature-tag {
    display: inline-block;
    padding: 6px 12px;
    background: rgba(46, 125, 50, 0.1);
    color: #2E7D32;
    border-radius: 16px;
    font-size: 13px;
    font-weight: 500;
}

/* Security Controls */
.controls-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 48px;
}

.control-card {
    padding: 24px;
    background: var(--white);
    border-radius: 8px;
    border: 1px solid var(--border-color);
    transition: all 0.3s ease;
}

.control-card:hover {
    border-color: #2E7D32;
}

.control-icon {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(46, 125, 50, 0.1);
    border-radius: 8px;
    color: #2E7D32;
    margin-bottom: 16px;
}

.control-title {
    font-size: 18px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 8px;
}

.control-desc {
    font-size: 14px;
    line-height: 1.5;
    color: var(--text-light);
}

/* Compliance Grid */
.compliance-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 48px;
}

.compliance-card {
    padding: 24px;
    background: var(--white);
    border-radius: 8px;
    border-left: 4px solid #2E7D32;
    box-shadow: var(--shadow);
}

.compliance-name {
    font-size: 20px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.compliance-desc {
    font-size: 14px;
    line-height: 1.6;
    color: var(--text-light);
}

/* Threat Protection */
.threats-grid {
    display: grid;
    gap: 24px;
    margin-top: 48px;
}

.threat-card {
    display: flex;
    gap: 24px;
    padding: 32px;
    background: var(--white);
    border-radius: 12px;
    border-left: 4px solid #2E7D32;
    box-shadow: var(--shadow);
}

.threat-number {
    font-size: 48px;
    font-weight: 800;
    color: var(--gray-200);
    flex-shrink: 0;
    line-height: 1;
}

.threat-title {
    font-size: 22px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.threat-desc {
    font-size: 15px;
    line-height: 1.6;
    color: var(--text-light);
}

/* Responsive */
@media (max-width: 991px) {
    .layers-grid {
        grid-template-columns: 1fr;
    }
    
    .controls-grid,
    .compliance-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 767px) {
    .controls-grid,
    .compliance-grid {
        grid-template-columns: 1fr;
    }
}

/* ================================================
   LINUX ENDPOINT SOLUTION - Additional Styles
   ================================================ */

/* Linux Icon - Dark Gray/Black */
.linux-icon {
    background: linear-gradient(135deg, #212121, #424242) !important;
}

/* Linux Gradient */
.linux-gradient {
    background: linear-gradient(135deg, #212121, #424242) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

/* Linux Approach Cards */
.linux-approach {
    border-left-color: #212121 !important;
}

/* Linux Capability Icon */
.linux-cap-icon {
    background: rgba(33, 33, 33, 0.1) !important;
    color: #212121 !important;
}

/* Linux Terminal Visual */
.linux-terminal-visual {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.terminal-window {
    width: 100%;
    max-width: 600px;
    background: #1e1e1e;
    border-radius: 8px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
    overflow: hidden;
}

.terminal-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    background: #2d2d2d;
    border-bottom: 1px solid #3d3d3d;
}

.terminal-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
}

.terminal-dot.red {
    background: #ff5f56;
}

.terminal-dot.yellow {
    background: #ffbd2e;
}

.terminal-dot.green {
    background: #27c93f;
}

.terminal-title {
    margin-left: auto;
    font-size: 13px;
    color: #999;
    font-family: 'Courier New', monospace;
}

.terminal-body {
    padding: 20px;
    font-family: 'Courier New', monospace;
    font-size: 14px;
    line-height: 1.8;
}

.terminal-line {
    color: #d4d4d4;
    margin-bottom: 4px;
}

.terminal-line.success {
    color: #27c93f;
}

.cursor {
    animation: blink 1s infinite;
}

@keyframes blink {
    0%, 49% { opacity: 1; }
    50%, 100% { opacity: 0; }
}

/* Distributions Grid */
.distros-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 48px;
}

.distro-card {
    padding: 24px;
    background: var(--white);
    border-radius: 8px;
    border-left: 4px solid #212121;
    box-shadow: var(--shadow);
}

.distro-name {
    font-size: 18px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.distro-versions,
.distro-features {
    font-size: 13px;
    line-height: 1.6;
    color: var(--text-light);
    margin-bottom: 8px;
}

.distro-versions strong {
    color: var(--text-color);
}

/* Architecture Steps */
.architecture-steps {
    display: grid;
    gap: 24px;
    margin-top: 48px;
}

.arch-step-card {
    display: flex;
    gap: 24px;
    padding: 32px;
    background: var(--white);
    border-radius: 12px;
    border-left: 4px solid #212121;
    box-shadow: var(--shadow);
}

.arch-step-number {
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #212121, #424242);
    border-radius: 50%;
    color: var(--white);
    font-size: 28px;
    font-weight: 800;
    flex-shrink: 0;
}

.arch-step-title {
    font-size: 22px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.arch-step-desc {
    font-size: 15px;
    line-height: 1.6;
    color: var(--text-light);
}

/* Deployment Methods */
.deployment-methods-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.deploy-method-card {
    padding: 32px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow-lg);
    border: 2px solid transparent;
    transition: all 0.3s ease;
}

.deploy-method-card:hover {
    border-color: #212121;
}

.deploy-method-title {
    font-size: 20px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.deploy-method-desc {
    font-size: 15px;
    line-height: 1.6;
    color: var(--text-light);
    margin-bottom: 16px;
}

.deploy-method-code {
    padding: 16px;
    background: #1e1e1e;
    border-radius: 6px;
    overflow-x: auto;
}

.deploy-method-code code {
    font-family: 'Courier New', monospace;
    font-size: 13px;
    color: #27c93f;
    white-space: pre-wrap;
}

/* Responsive */
@media (max-width: 991px) {
    .distros-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .deployment-methods-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767px) {
    .distros-grid {
        grid-template-columns: 1fr;
    }
    
    .terminal-window {
        max-width: 100%;
    }
    
    .terminal-body {
        font-size: 12px;
        padding: 16px;
    }
}

/* ================================================
   OFFICE 365 SOLUTION - Additional Styles
   ================================================ */

/* Office 365 Icon - Microsoft Red/Orange */
.o365-icon {
    background: linear-gradient(135deg, #D83B01, #EA4300) !important;
}

/* O365 Gradient */
.o365-gradient {
    background: linear-gradient(135deg, #D83B01, #EA4300) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

/* O365 Approach Cards */
.o365-approach {
    border-left-color: #D83B01 !important;
}

/* O365 Capability Icon */
.o365-cap-icon {
    background: rgba(216, 59, 1, 0.1) !important;
    color: #D83B01 !important;
}

/* Office 365 Apps Visual */
.o365-apps-visual {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px;
}

.o365-app-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    width: 100%;
    max-width: 400px;
}

.o365-app-item {
    padding: 32px;
    background: var(--white);
    border-radius: 12px;
    text-align: center;
    box-shadow: var(--shadow);
    border: 2px solid var(--border-color);
    transition: all 0.3s ease;
}

.o365-app-item:hover {
    border-color: #D83B01;
    transform: translateY(-4px);
}

.app-icon {
    font-size: 48px;
    margin-bottom: 12px;
}

.app-name {
    font-size: 14px;
    font-weight: 700;
    color: var(--text-color);
}

/* Workloads Grid */
.workloads-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 48px;
}

.workload-card {
    padding: 28px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow);
    border: 2px solid var(--border-color);
    transition: all 0.3s ease;
}

.workload-card:hover {
    border-color: #D83B01;
    transform: translateY(-4px);
}

.workload-title {
    font-size: 20px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.workload-desc {
    font-size: 15px;
    line-height: 1.6;
    color: var(--text-light);
    margin-bottom: 16px;
}

.workload-features {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.workload-feature-tag {
    display: inline-block;
    padding: 6px 12px;
    background: rgba(216, 59, 1, 0.1);
    color: #D83B01;
    border-radius: 16px;
    font-size: 12px;
    font-weight: 500;
}

/* Integration Grid */
.integration-grid-o365 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 48px;
}

.integration-o365-card {
    padding: 24px;
    background: var(--white);
    border-radius: 8px;
    border-left: 4px solid #D83B01;
    box-shadow: var(--shadow);
}

.integration-name {
    font-size: 18px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.integration-desc {
    font-size: 14px;
    line-height: 1.6;
    color: var(--text-light);
}

/* Policy Examples */
.policies-grid {
    display: grid;
    gap: 24px;
    margin-top: 48px;
}

.policy-example-card {
    display: flex;
    gap: 24px;
    padding: 32px;
    background: var(--white);
    border-radius: 12px;
    border-left: 4px solid #D83B01;
    box-shadow: var(--shadow);
}

.policy-number {
    font-size: 48px;
    font-weight: 800;
    color: var(--gray-200);
    flex-shrink: 0;
    line-height: 1;
}

.policy-title {
    font-size: 22px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.policy-desc {
    font-size: 15px;
    line-height: 1.6;
    color: var(--text-light);
}

/* Responsive */
@media (max-width: 991px) {
    .workloads-grid,
    .integration-grid-o365 {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 767px) {
    .o365-app-grid {
        grid-template-columns: 1fr;
    }
    
    .workloads-grid,
    .integration-grid-o365 {
        grid-template-columns: 1fr;
    }
}
/* ================================================
   FILE SHARING SOLUTION - Additional Styles
   ================================================ */

/* File Sharing Icon - Teal/Cyan */
.filesharing-icon {
    background: linear-gradient(135deg, #0891B2, #06B6D4) !important;
}

/* File Sharing Gradient */
.filesharing-gradient {
    background: linear-gradient(135deg, #0891B2, #06B6D4) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

/* File Sharing Approach Cards */
.filesharing-approach {
    border-left-color: #0891B2 !important;
}

/* File Sharing Capability Icon */
.filesharing-cap-icon {
    background: rgba(8, 145, 178, 0.1) !important;
    color: #0891B2 !important;
}

/* File Sharing Security Icon */
.filesharing-sec-icon {
    background: rgba(8, 145, 178, 0.1) !important;
    color: #0891B2 !important;
}

/* File Sharing Visual */
.filesharing-visual {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px;
}

.sharing-diagram {
    position: relative;
    width: 400px;
    height: 300px;
}

.central-file {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, #0891B2, #06B6D4);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 40px;
    box-shadow: 0 10px 30px rgba(8, 145, 178, 0.3);
}

.share-arrow {
    position: absolute;
    font-size: 32px;
    color: #0891B2;
    font-weight: bold;
}

.arrow-1 {
    top: 20%;
    left: 60%;
    transform: rotate(-30deg);
}

.arrow-2 {
    top: 50%;
    left: 65%;
    transform: translateY(-50%);
}

.arrow-3 {
    bottom: 20%;
    left: 60%;
    transform: rotate(30deg);
}

.recipient {
    position: absolute;
    width: 60px;
    height: 60px;
    background: var(--white);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 32px;
    box-shadow: var(--shadow);
    border: 3px solid #0891B2;
}

.recipient-1 {
    top: 10%;
    right: 10%;
}

.recipient-2 {
    top: 50%;
    right: 5%;
    transform: translateY(-50%);
}

.recipient-3 {
    bottom: 10%;
    right: 10%;
}

/* Scenarios Grid */
.scenarios-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.scenario-card {
    padding: 32px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow);
    border: 2px solid var(--border-color);
    transition: all 0.3s ease;
}

.scenario-card:hover {
    border-color: #0891B2;
    transform: translateY(-4px);
}

.scenario-title {
    font-size: 20px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.scenario-desc {
    font-size: 15px;
    line-height: 1.6;
    color: var(--text-light);
    margin-bottom: 16px;
}

.scenario-controls {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.scenario-control-tag {
    display: inline-block;
    padding: 6px 12px;
    background: rgba(8, 145, 178, 0.1);
    color: #0891B2;
    border-radius: 16px;
    font-size: 12px;
    font-weight: 500;
}

/* Responsive */
@media (max-width: 991px) {
    .scenarios-grid {
        grid-template-columns: 1fr;
    }
    
    .sharing-diagram {
        width: 100%;
        max-width: 350px;
    }
}

@media (max-width: 767px) {
    .sharing-diagram {
        height: 250px;
    }
    
    .central-file {
        width: 60px;
        height: 60px;
        font-size: 30px;
    }
    
    .recipient {
        width: 50px;
        height: 50px;
        font-size: 24px;
    }
    
    .share-arrow {
        font-size: 24px;
    }
}
/* ================================================
   FILE ACTIVITY SOLUTION - Additional Styles
   ================================================ */

/* File Activity Icon - Purple */
.fileactivity-icon {
    background: linear-gradient(135deg, #8B5CF6, #A78BFA) !important;
}

/* File Activity Gradient */
.fileactivity-gradient {
    background: linear-gradient(135deg, #8B5CF6, #A78BFA) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

/* File Activity Approach Cards */
.fileactivity-approach {
    border-left-color: #8B5CF6 !important;
}

/* File Activity Capability Icon */
.fileactivity-cap-icon {
    background: rgba(139, 92, 246, 0.1) !important;
    color: #8B5CF6 !important;
}

/* Activity Chart Visual */
.activity-chart-visual {
    padding: 40px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow);
}

/* Activities Grid */
.activities-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 48px;
}

.activity-card {
    padding: 28px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow);
    border: 2px solid var(--border-color);
    transition: all 0.3s ease;
}

.activity-card:hover {
    border-color: #8B5CF6;
    transform: translateY(-4px);
}

.activity-title {
    font-size: 18px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.activity-desc {
    font-size: 14px;
    line-height: 1.6;
    color: var(--text-light);
    margin-bottom: 12px;
}

.activity-events {
    font-size: 13px;
    color: var(--text-muted);
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
}

.activity-events strong {
    color: var(--text-color);
}

/* Reporting Grid */
.reporting-grid-activity {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 48px;
}

.report-activity-card {
    padding: 24px;
    background: var(--white);
    border-radius: 8px;
    border-left: 4px solid #8B5CF6;
    box-shadow: var(--shadow);
}

.report-title {
    font-size: 18px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.report-desc {
    font-size: 14px;
    line-height: 1.6;
    color: var(--text-light);
}

/* Responsive */
@media (max-width: 991px) {
    .activities-grid,
    .reporting-grid-activity {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 767px) {
    .activities-grid,
    .reporting-grid-activity {
        grid-template-columns: 1fr;
    }
}

/* ================================================
   APP CONTROL, DEVICE CONTROL, CENTRAL MANAGEMENT
   ================================================ */

/* App Control - Indigo */
.appcontrol-icon {
    background: linear-gradient(135deg, #4F46E5, #6366F1) !important;
}

.appcontrol-gradient {
    background: linear-gradient(135deg, #4F46E5, #6366F1) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

.appcontrol-approach {
    border-left-color: #4F46E5 !important;
}

.appcontrol-cap-icon {
    background: rgba(79, 70, 229, 0.1) !important;
    color: #4F46E5 !important;
}

/* Device Control - Amber */
.devicecontrol-icon {
    background: linear-gradient(135deg, #F59E0B, #FBBF24) !important;
}

.devicecontrol-gradient {
    background: linear-gradient(135deg, #F59E0B, #FBBF24) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

.devicecontrol-approach {
    border-left-color: #F59E0B !important;
}

.devicecontrol-cap-icon {
    background: rgba(245, 158, 11, 0.1) !important;
    color: #F59E0B !important;
}

/* Central Management - Slate */
.central-icon {
    background: linear-gradient(135deg, #475569, #64748B) !important;
}

.central-gradient {
    background: linear-gradient(135deg, #475569, #64748B) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

.central-approach {
    border-left-color: #475569 !important;
}

.central-cap-icon {
    background: rgba(71, 85, 105, 0.1) !important;
    color: #475569 !important;
}

/* Types Grid */
.types-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    margin-top: 48px;
}

.type-card {
    padding: 28px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow);
    border: 2px solid var(--border-color);
}

.type-title {
    font-size: 20px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.type-desc {
    font-size: 15px;
    line-height: 1.6;
    color: var(--text-light);
}

/* Devices Grid */
.devices-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 48px;
}

.device-card {
    padding: 24px;
    background: var(--white);
    border-radius: 8px;
    border-left: 4px solid #F59E0B;
    box-shadow: var(--shadow);
}

.device-title {
    font-size: 18px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.device-desc {
    font-size: 14px;
    line-height: 1.6;
    color: var(--text-light);
}

/* Dashboards Grid */
.dashboards-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.dashboard-card {
    padding: 32px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow);
    border: 2px solid var(--border-color);
}

.dashboard-title {
    font-size: 20px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.dashboard-desc {
    font-size: 15px;
    line-height: 1.6;
    color: var(--text-light);
}

/* Responsive */
@media (max-width: 991px) {
    .types-grid,
    .dashboards-grid {
        grid-template-columns: 1fr;
    }
    
    .devices-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 767px) {
    .devices-grid {
        grid-template-columns: 1fr;
    }
}
/* ================================================
   COMPLIANCE PAGES - Common Styles
   ================================================ */

/* Compliance Hero */
.compliance-hero {
    padding: 80px 0 60px;
    background: linear-gradient(135deg, var(--gray-50) 0%, var(--white) 100%);
}

.compliance-hero-content {
    max-width: 800px;
}

.compliance-breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: var(--text-muted);
    margin-bottom: 24px;
}

.compliance-breadcrumb a {
    color: var(--text-muted);
    text-decoration: none;
    transition: color 0.3s;
}

.compliance-breadcrumb a:hover {
    color: var(--primary-color);
}

.compliance-header {
    display: flex;
    align-items: flex-start;
    gap: 24px;
    margin-bottom: 24px;
}

.compliance-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 80px;
    height: 80px;
    border-radius: 12px;
    font-size: 32px;
    font-weight: 700;
    flex-shrink: 0;
}

.gdpr-badge {
    background: linear-gradient(135deg, #0052B4, #FFDD00);
    color: var(--white);
}

.compliance-title {
    font-size: 48px;
    font-weight: 800;
    color: var(--primary-color);
    margin-bottom: 8px;
    line-height: 1.2;
}

.compliance-subtitle {
    font-size: 20px;
    color: var(--text-light);
    font-weight: 500;
}

.compliance-intro {
    font-size: 18px;
    line-height: 1.7;
    color: var(--text-color);
    margin-bottom: 32px;
}

.compliance-actions {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}

/* GDPR Gradient */
.gdpr-gradient {
    background: linear-gradient(135deg, #0052B4, #003DA5) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

/* Requirements Grid */
.requirements-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 48px;
}

.requirement-card {
    padding: 28px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow);
    border: 2px solid var(--border-color);
}

.requirement-title {
    font-size: 18px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.requirement-desc {
    font-size: 14px;
    line-height: 1.6;
    color: var(--text-light);
}

/* Solution Grid */
.solution-grid {
    display: grid;
    gap: 24px;
    margin-top: 48px;
}

.solution-card {
    display: flex;
    gap: 24px;
    padding: 32px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow);
}

.gdpr-solution {
    border-left: 4px solid #0052B4;
}

.solution-number {
    font-size: 48px;
    font-weight: 800;
    color: var(--gray-200);
    flex-shrink: 0;
    line-height: 1;
}

.solution-title {
    font-size: 22px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.solution-desc {
    font-size: 15px;
    line-height: 1.6;
    color: var(--text-light);
}

/* Articles Grid */
.articles-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    margin-top: 48px;
}

.article-card {
    padding: 24px;
    background: var(--white);
    border-radius: 8px;
    box-shadow: var(--shadow);
}

.article-number {
    display: inline-block;
    padding: 6px 16px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 12px;
}

.gdpr-article-number {
    background: rgba(0, 82, 180, 0.1);
    color: #0052B4;
}

.article-title {
    font-size: 18px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 8px;
}

.article-control {
    font-size: 14px;
    line-height: 1.6;
    color: var(--text-light);
}

/* Data Types Grid */
.datatypes-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 48px;
}

.datatype-card {
    padding: 24px;
    background: var(--white);
    border-radius: 8px;
    border-left: 4px solid #0052B4;
    box-shadow: var(--shadow);
}

.datatype-category {
    font-size: 18px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.datatype-examples {
    font-size: 13px;
    line-height: 1.6;
    color: var(--text-light);
}

/* Transfers, Rights Grids */
.transfers-grid,
.rights-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    margin-top: 48px;
}

.transfer-card,
.right-card {
    padding: 28px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow);
}

.transfer-title,
.right-title {
    font-size: 20px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.transfer-desc,
.right-desc {
    font-size: 15px;
    line-height: 1.6;
    color: var(--text-light);
}

/* Penalties Grid */
.penalties-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.penalty-card {
    padding: 32px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow-lg);
    text-align: center;
}

.penalty-title {
    font-size: 20px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 16px;
}

.penalty-fine {
    font-size: 32px;
    font-weight: 800;
    margin-bottom: 16px;
}

.penalty-desc {
    font-size: 14px;
    line-height: 1.6;
    color: var(--text-light);
}

/* Compliance CTA */
.compliance-cta {
    padding: 80px 0;
}

.compliance-cta-content {
    text-align: center;
    max-width: 800px;
    margin: 0 auto;
}

.compliance-cta-title {
    font-size: 42px;
    font-weight: 800;
    color: var(--white);
    margin-bottom: 16px;
}

.compliance-cta-desc {
    font-size: 20px;
    color: rgba(255, 255, 255, 0.9);
    margin-bottom: 32px;
}

.compliance-cta-buttons {
    display: flex;
    gap: 16px;
    justify-content: center;
    flex-wrap: wrap;
}

/* Responsive */
@media (max-width: 991px) {
    .requirements-grid,
    .datatypes-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .articles-grid,
    .transfers-grid,
    .rights-grid,
    .penalties-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767px) {
    .compliance-title {
        font-size: 36px;
    }
    
    .compliance-header {
        flex-direction: column;
        gap: 16px;
    }
    
    .requirements-grid,
    .datatypes-grid {
        grid-template-columns: 1fr;
    }
}

/* ================================================
   COMPLIANCE PAGES - Hero Grid & Visual Updates
   ================================================ */

/* Hero Grid Layout */
.compliance-hero-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.compliance-hero-visual {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* HIPAA Specific */
.hipaa-badge {
    background: linear-gradient(135deg, #0891B2, #06B6D4);
    color: var(--white);
}

.hipaa-gradient {
    background: linear-gradient(135deg, #0891B2, #06B6D4) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

.hipaa-solution {
    border-left: 4px solid #0891B2;
}

.hipaa-article-number {
    background: rgba(8, 145, 178, 0.1);
    color: #0891B2;
}

.datatype-card {
    border-left-color: #0891B2;
}

/* Responsive Hero Grid */
@media (max-width: 991px) {
    .compliance-hero-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    
    .compliance-hero-visual {
        order: -1;
    }
    
    .compliance-hero-visual svg {
        max-height: 300px;
    }
}

@media (max-width: 767px) {
    .compliance-hero-visual svg {
        max-height: 250px;
    }
}
/* ================================================
   PCI-DSS COMPLIANCE - Additional Styles
   ================================================ */

/* PCI Specific */
.pci-badge {
    background: linear-gradient(135deg, #DC2626, #EF4444);
    color: var(--white);
    font-size: 40px;
}

.pci-gradient {
    background: linear-gradient(135deg, #DC2626, #EF4444) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

.pci-solution {
    border-left: 4px solid #DC2626;
}

.pci-article-number {
    background: rgba(220, 38, 38, 0.1);
    color: #DC2626;
}

.pci-datatype {
    border-left-color: #DC2626 !important;
}

/* PCI Requirements Grid - 12 items in 3 columns */
.pci-requirements-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-top: 48px;
}

/* Merchant Levels Grid */
.levels-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.level-card {
    padding: 32px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow-lg);
    text-align: center;
    border: 2px solid var(--border-color);
    transition: all 0.3s ease;
}

.level-card:hover {
    border-color: #DC2626;
    transform: translateY(-4px);
}

.level-title {
    font-size: 22px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 16px;
}

.level-volume {
    font-size: 24px;
    font-weight: 800;
    margin-bottom: 16px;
}

.level-req {
    font-size: 14px;
    line-height: 1.6;
    color: var(--text-light);
}

/* Responsive */
@media (max-width: 991px) {
    .pci-requirements-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .levels-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767px) {
    .pci-requirements-grid {
        grid-template-columns: 1fr;
    }
}

/* ================================================
   SOX COMPLIANCE - Specific Styles
   ================================================ */

/* SOX Badge & Gradient */
.sox-badge {
    background: linear-gradient(135deg, #059669, #10B981);
    color: var(--white);
}

.sox-gradient {
    background: linear-gradient(135deg, #059669, #10B981) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

.sox-solution {
    border-left: 4px solid #059669;
}

.sox-article-number {
    background: rgba(5, 150, 105, 0.1);
    color: #059669;
}

.sox-datatype {
    border-left-color: #059669;
}
/* ================================================
   CCPA COMPLIANCE - Specific Styles
   ================================================ */

/* CCPA Badge & Gradient */
.ccpa-badge {
    background: linear-gradient(135deg, #DC2626, #EF4444);
    color: var(--white);
}

.ccpa-gradient {
    background: linear-gradient(135deg, #DC2626, #EF4444) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

.ccpa-solution {
    border-left: 4px solid #DC2626;
}

/* CCPA Rights Grid */
.ccpa-rights-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 48px;
}

.ccpa-right-card {
    padding: 28px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow);
    border-top: 4px solid #DC2626;
}

.ccpa-right-title {
    font-size: 20px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.ccpa-right-desc {
    font-size: 14px;
    line-height: 1.6;
    color: var(--text-light);
    margin-bottom: 16px;
}

.ccpa-right-timeline {
    display: inline-block;
    padding: 8px 16px;
    background: rgba(220, 38, 38, 0.1);
    color: #DC2626;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 600;
}

/* Categories Grid */
.categories-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    margin-top: 48px;
}

.category-card {
    padding: 24px;
    background: var(--white);
    border-radius: 8px;
    border-left: 4px solid #DC2626;
    box-shadow: var(--shadow);
}

.category-name {
    font-size: 18px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.category-examples {
    font-size: 13px;
    line-height: 1.6;
    color: var(--text-light);
}

/* Threshold Grid */
.threshold-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.threshold-card {
    padding: 32px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow);
    border: 2px solid var(--border-color);
    transition: all 0.3s ease;
}

.threshold-card:hover {
    border-color: #DC2626;
}

.threshold-title {
    font-size: 20px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.threshold-desc {
    font-size: 15px;
    line-height: 1.6;
    color: var(--text-light);
}

/* Responsive */
@media (max-width: 991px) {
    .ccpa-rights-grid,
    .categories-grid,
    .threshold-grid {
        grid-template-columns: 1fr;
    }
}

/* ================================================
   ISO 27001 COMPLIANCE - Vibrant & Dynamic Styles
   ================================================ */

/* ISO 27001 Badge & Gradient */
.iso27001-badge {
    background: linear-gradient(135deg, #6366F1, #8B5CF6, #EC4899);
    color: var(--white);
    animation: badgePulse 3s ease-in-out infinite;
}

@keyframes badgePulse {
    0%, 100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(99, 102, 241, 0.7); }
    50% { transform: scale(1.05); box-shadow: 0 0 20px 10px rgba(99, 102, 241, 0); }
}

.iso27001-gradient {
    background: linear-gradient(135deg, #6366F1, #8B5CF6, #EC4899) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

.iso27001-solution {
    border-left: 4px solid #6366F1;
}

/* ISO Stats Grid */
.stats-grid-iso {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 32px;
    margin-top: 0;
}

.iso-stat-card {
    padding: 40px 24px;
    background: var(--white);
    border-radius: 16px;
    box-shadow: var(--shadow-lg);
    text-align: center;
    border: 3px solid transparent;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.iso-stat-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, #6366F1, #8B5CF6, #EC4899);
}

.iso-stat-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px rgba(99, 102, 241, 0.3);
    border-color: #6366F1;
}

.iso-stat-value {
    font-size: 48px;
    font-weight: 900;
    margin-bottom: 12px;
}

.iso-stat-label {
    font-size: 16px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 8px;
}

.iso-stat-desc {
    font-size: 14px;
    color: var(--text-muted);
}

/* Annex A Grid */
.annexa-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.annexa-theme-card {
    padding: 32px;
    background: var(--white);
    border-radius: 16px;
    box-shadow: var(--shadow-lg);
    border-left: 6px solid #6366F1;
    transition: all 0.3s ease;
}

.annexa-theme-card:nth-child(2) {
    border-left-color: #EC4899;
}

.annexa-theme-card:nth-child(3) {
    border-left-color: #10B981;
}

.annexa-theme-card:nth-child(4) {
    border-left-color: #3B82F6;
}

.annexa-theme-card:hover {
    transform: translateX(8px);
    box-shadow: 0 15px 35px rgba(99, 102, 241, 0.2);
}

.theme-title {
    font-size: 24px;
    font-weight: 800;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.theme-desc {
    font-size: 15px;
    line-height: 1.6;
    color: var(--text-light);
    margin-bottom: 16px;
}

.theme-controls {
    font-size: 13px;
    line-height: 1.8;
    color: var(--text-muted);
    padding-top: 16px;
    border-top: 2px solid var(--gray-200);
}

/* Implementation Phases Timeline */
.phases-timeline {
    max-width: 800px;
    margin: 48px auto 0;
}

.phase-card {
    display: flex;
    gap: 24px;
    padding: 32px;
    background: var(--white);
    border-radius: 16px;
    box-shadow: var(--shadow);
    margin-bottom: 16px;
    border: 2px solid transparent;
    transition: all 0.3s ease;
}

.phase-card:hover {
    border-color: #6366F1;
    transform: translateX(12px);
    box-shadow: 0 10px 30px rgba(99, 102, 241, 0.2);
}

.phase-number {
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #6366F1, #8B5CF6);
    border-radius: 50%;
    color: var(--white);
    font-size: 28px;
    font-weight: 900;
    flex-shrink: 0;
    box-shadow: 0 8px 16px rgba(99, 102, 241, 0.3);
}

.phase-content {
    flex: 1;
}

.phase-title {
    font-size: 22px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 8px;
}

.phase-duration {
    display: inline-block;
    padding: 6px 16px;
    background: linear-gradient(135deg, rgba(99, 102, 241, 0.1), rgba(139, 92, 246, 0.1));
    color: #6366F1;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 12px;
}

.phase-desc {
    font-size: 15px;
    line-height: 1.6;
    color: var(--text-light);
}

.phase-arrow {
    text-align: center;
    font-size: 32px;
    color: #6366F1;
    margin: 8px 0;
    animation: arrowBounce 2s ease-in-out infinite;
}

@keyframes arrowBounce {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(8px); }
}

/* Benefits Detailed Grid */
.benefits-detailed-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 48px;
}

.benefit-detailed-card {
    padding: 28px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow);
    border-top: 4px solid #6366F1;
    transition: all 0.3s ease;
}

.benefit-detailed-card:nth-child(2), .benefit-detailed-card:nth-child(5) {
    border-top-color: #EC4899;
}

.benefit-detailed-card:nth-child(3), .benefit-detailed-card:nth-child(6) {
    border-top-color: #10B981;
}

.benefit-detailed-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 28px rgba(99, 102, 241, 0.2);
}

.benefit-title {
    font-size: 20px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.benefit-desc {
    font-size: 15px;
    line-height: 1.6;
    color: var(--text-light);
}

/* Certification Steps */
.certification-steps {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.cert-step-card {
    display: flex;
    gap: 20px;
    padding: 28px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow);
}

.cert-step-number {
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #6366F1, #8B5CF6);
    border-radius: 12px;
    color: var(--white);
    font-size: 24px;
    font-weight: 900;
    flex-shrink: 0;
}

.cert-step-title {
    font-size: 18px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 8px;
}

.cert-step-desc {
    font-size: 14px;
    line-height: 1.6;
    color: var(--text-light);
}

/* Responsive */
@media (max-width: 991px) {
    .stats-grid-iso {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .annexa-grid,
    .benefits-detailed-grid,
    .certification-steps {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767px) {
    .stats-grid-iso {
        grid-template-columns: 1fr;
    }
    
    .phase-card {
        flex-direction: column;
    }
}
/* ================================================
   FINANCIAL SERVICES INDUSTRY - Detailed Styles
   ================================================ */

/* Industry Hero */
.industry-hero {
    padding: 80px 0 60px;
    background: linear-gradient(135deg, var(--gray-50) 0%, var(--white) 100%);
}

.industry-hero-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.industry-hero-content {
    max-width: 600px;
}

.industry-breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: var(--text-muted);
    margin-bottom: 24px;
}

.industry-breadcrumb a {
    color: var(--text-muted);
    text-decoration: none;
}

.industry-breadcrumb a:hover {
    color: var(--primary-color);
}

.industry-header {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 24px;
}

.industry-icon {
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 48px;
    border-radius: 16px;
    flex-shrink: 0;
}

.financial-icon {
    background: linear-gradient(135deg, #059669, #10B981);
}

.industry-title {
    font-size: 42px;
    font-weight: 800;
    color: var(--primary-color);
    line-height: 1.2;
    margin-bottom: 8px;
}

.industry-subtitle {
    font-size: 18px;
    color: var(--text-light);
    font-weight: 500;
}

.industry-intro {
    font-size: 16px;
    line-height: 1.7;
    color: var(--text-color);
    margin-bottom: 32px;
}

.industry-actions {
    display: flex;
    gap: 16px;
}

.industry-hero-visual {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Financial Gradient */
.financial-gradient {
    background: linear-gradient(135deg, #059669, #10B981) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

/* ROI Grid */
.roi-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 32px;
}

.roi-card {
    padding: 32px 24px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow);
    text-align: center;
    border-top: 4px solid #059669;
}

.roi-metric {
    font-size: 42px;
    font-weight: 900;
    margin-bottom: 12px;
}

.roi-label {
    font-size: 16px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 8px;
}

.roi-desc {
    font-size: 13px;
    color: var(--text-muted);
}

/* Financial Data Grid */
.financial-data-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    margin-top: 48px;
}

.financial-data-card {
    padding: 28px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow);
    border-left: 4px solid #059669;
}

.data-title {
    font-size: 20px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.data-examples {
    font-size: 14px;
    line-height: 1.6;
    color: var(--text-light);
    margin-bottom: 16px;
}

.data-risk {
    padding: 12px 16px;
    background: rgba(220, 38, 38, 0.1);
    border-radius: 8px;
    font-size: 13px;
    color: #DC2626;
    line-height: 1.5;
}

/* Threats Detailed Grid */
.threats-detailed-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 32px;
    margin-top: 48px;
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}

.threat-detailed-card {
    padding: 32px;
    background: var(--white);
    border-radius: 16px;
    box-shadow: var(--shadow-lg);
    border-left: 6px solid #DC2626;
}

.threat-header {
    margin-bottom: 16px;
}

.threat-title {
    font-size: 24px;
    font-weight: 800;
    color: var(--primary-color);
}

.threat-desc {
    font-size: 15px;
    line-height: 1.7;
    color: var(--text-light);
    margin-bottom: 16px;
}

.threat-example {
    padding: 16px;
    background: rgba(245, 158, 11, 0.1);
    border-left: 3px solid #F59E0B;
    margin-bottom: 16px;
    font-size: 14px;
    line-height: 1.6;
}

.threat-prevention {
    padding: 16px;
    background: rgba(16, 185, 129, 0.1);
    border-left: 3px solid #10B981;
    font-size: 14px;
    line-height: 1.6;
}

/* Use Cases Detailed Grid */
.usecases-detailed-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.usecase-detailed-card {
    padding: 32px;
    background: var(--white);
    border-radius: 16px;
    box-shadow: var(--shadow-lg);
    border-top: 4px solid #059669;
}

.usecase-badge {
    display: inline-block;
    padding: 6px 16px;
    background: linear-gradient(135deg, #059669, #10B981);
    color: var(--white);
    border-radius: 20px;
    font-size: 12px;
    font-weight: 700;
    margin-bottom: 16px;
}

.usecase-detailed-title {
    font-size: 22px;
    font-weight: 800;
    color: var(--primary-color);
    margin-bottom: 24px;
}

.usecase-section {
    margin-bottom: 20px;
}

.usecase-section-label {
    font-size: 13px;
    font-weight: 700;
    color: #059669;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 8px;
}

.usecase-section p {
    font-size: 14px;
    line-height: 1.6;
    color: var(--text-light);
}

.usecase-result {
    padding: 16px;
    background: linear-gradient(135deg, rgba(5, 150, 105, 0.1), rgba(16, 185, 129, 0.1));
    border-radius: 8px;
    font-size: 14px;
    line-height: 1.6;
    margin-top: 20px;
}

/* Compliance Financial Grid */
.compliance-financial-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 48px;
}

.compliance-financial-card {
    padding: 24px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow);
    border-top: 3px solid #059669;
}

.compliance-standard {
    display: inline-block;
    padding: 6px 12px;
    background: #059669;
    color: var(--white);
    border-radius: 6px;
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 12px;
}

.compliance-req {
    font-size: 16px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.compliance-controls {
    font-size: 14px;
    line-height: 1.6;
    color: var(--text-light);
    margin-bottom: 16px;
}

.compliance-penalty {
    padding: 12px;
    background: rgba(220, 38, 38, 0.1);
    border-radius: 6px;
    font-size: 13px;
    color: #DC2626;
    line-height: 1.5;
}

/* Architecture Grid */
.architecture-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 48px;
}

.arch-card {
    padding: 24px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow);
    border-left: 4px solid #059669;
}

.arch-title {
    font-size: 18px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 12px;
}

.arch-desc {
    font-size: 14px;
    line-height: 1.6;
    color: var(--text-light);
}

/* Industry CTA */
.industry-cta {
    padding: 80px 0;
}

.industry-cta-content {
    text-align: center;
    max-width: 800px;
    margin: 0 auto;
}

.industry-cta-title {
    font-size: 42px;
    font-weight: 800;
    color: var(--white);
    margin-bottom: 16px;
}

.industry-cta-desc {
    font-size: 20px;
    color: rgba(255, 255, 255, 0.9);
    margin-bottom: 32px;
}

.industry-cta-buttons {
    display: flex;
    gap: 16px;
    justify-content: center;
    flex-wrap: wrap;
}

/* Responsive */
@media (max-width: 991px) {
    .industry-hero-grid {
        grid-template-columns: 1fr;
    }
    
    .industry-hero-visual {
        order: -1;
    }
    
    .roi-grid,
    .architecture-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .financial-data-grid,
    .usecases-detailed-grid,
    .compliance-financial-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767px) {
    .roi-grid,
    .architecture-grid {
        grid-template-columns: 1fr;
    }
    
    .industry-title {
        font-size: 32px;
    }
}
/* ================================================
   HEALTHCARE INDUSTRY - Specific Styles
   ================================================ */

.healthcare-icon {
    background: linear-gradient(135deg, #0891B2, #06B6D4);
}

.healthcare-gradient {
    background: linear-gradient(135deg, #0891B2, #06B6D4) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

.healthcare-data-card {
    border-left-color: #0891B2;
}

.healthcare-badge {
    background: linear-gradient(135deg, #0891B2, #06B6D4);
}

.healthcare-usecase-card {
    border-top-color: #0891B2;
}

.healthcare-standard {
    background: #0891B2;
}

.healthcare-compliance-card {
    border-top-color: #0891B2;
}

.healthcare-arch-card {
    border-left-color: #0891B2;
}

/* ================================================
   GOVERNMENT & DEFENSE - Serious & Professional
   ================================================ */

.government-hero {
    background: linear-gradient(135deg, #1E293B 0%, #334155 100%);
}

.government-hero .industry-breadcrumb a,
.government-hero .industry-breadcrumb {
    color: rgba(255, 255, 255, 0.7);
}

.government-hero .industry-title {
    color: var(--white);
}

.government-hero .industry-subtitle,
.government-hero .industry-intro {
    color: rgba(255, 255, 255, 0.9);
}

.government-icon {
    background: linear-gradient(135deg, #1E3A8A, #3B82F6);
}

.government-gradient {
    background: linear-gradient(135deg, #1E3A8A, #3B82F6) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

.government-roi-card {
    border-top-color: #1E3A8A;
}

/* Classifications Grid */
.classifications-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    margin-top: 48px;
}

.classification-card {
    padding: 28px;
    background: var(--white);
    border-radius: 12px;
    box-shadow: var(--shadow-lg);
    border-left: 6px solid #1E3A8A;
}

.classification-level {
    display: inline-block;
    padding: 8px 16px;
    border-radius: 6px;
    font-size: 16px;
    font-weight: 800;
    margin-bottom: 16px;
    text-transform: uppercase;
}

.level-1 { background: #DC2626; color: var(--white); }
.level-2 { background: #F59E0B; color: var(--white); }
.level-3 { background: #10B981; color: var(--white); }
.level-4 { background: #8B5CF6; color: var(--white); }
.level-5 { background: #6B7280; color: var(--white); }
.level-6 { background: #3B82F6; color: var(--white); }

.classification-desc {
    font-size: 15px;
    line-height: 1.7;
    color: var(--text-light);
    margin-bottom: 16px;
}

.classification-handling,
.classification-breach {
    padding: 12px 16px;
    background: var(--gray-50);
    border-radius: 8px;
    font-size: 13px;
    line-height: 1.6;
    margin-bottom: 12px;
}

.classification-breach {
    background: rgba(220, 38, 38, 0.1);
    color: #DC2626;
}

.government-threat-card {
    border-left-color: #DC2626;
}

.government-example {
    background: rgba(220, 38, 38, 0.1);
    border-left-color: #DC2626;
}

.government-prevention {
    background: rgba(30, 58, 138, 0.1);
    border-left-color: #1E3A8A;
}

.government-badge {
    background: linear-gradient(135deg, #1E3A8A, #3B82F6);
}

.government-usecase-card {
    border-top-color: #1E3A8A;
}

.government-label {
    color: #1E3A8A;
}

.government-result {
    background: linear-gradient(135deg, rgba(30, 58, 138, 0.1), rgba(59, 130, 246, 0.1));
}

.government-standard {
    background: #1E3A8A;
}

.government-compliance-card {
    border-top-color: #1E3A8A;
}

.government-penalty {
    background: rgba(220, 38, 38, 0.1);
    color: #DC2626;
}

.government-arch-card {
    border-left-color: #1E3A8A;
}

.government-cta {
    background: linear-gradient(135deg, #1E3A8A, #3B82F6);
}

@media (max-width: 991px) {
    .classifications-grid {
        grid-template-columns: 1fr;
    }
}
/* ================================================
   EDUCATION INDUSTRY - Academic Theme
   ================================================ */

.education-icon {
    background: linear-gradient(135deg, #7C3AED, #A78BFA);
}

.education-gradient {
    background: linear-gradient(135deg, #7C3AED, #A78BFA) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

.education-roi-card {
    border-top-color: #7C3AED;
}

.education-data-card {
    border-left-color: #7C3AED;
}

.education-badge {
    background: linear-gradient(135deg, #7C3AED, #A78BFA);
}

.education-usecase-card {
    border-top-color: #7C3AED;
}

.education-label {
    color: #7C3AED;
}

.education-result {
    background: linear-gradient(135deg, rgba(124, 58, 237, 0.1), rgba(167, 139, 250, 0.1));
}

.education-standard {
    background: #7C3AED;
}

.education-compliance-card {
    border-top-color: #7C3AED;
}

.education-arch-card {
    border-left-color: #7C3AED;
}
/* ================================================
   MANUFACTURING INDUSTRY - Industrial Theme
   ================================================ */

.manufacturing-icon {
    background: linear-gradient(135deg, #F97316, #FB923C);
}

.manufacturing-gradient {
    background: linear-gradient(135deg, #F97316, #FB923C) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

.manufacturing-roi-card {
    border-top-color: #F97316;
}

.manufacturing-data-card {
    border-left-color: #F97316;
}

.manufacturing-badge {
    background: linear-gradient(135deg, #F97316, #FB923C);
}

.manufacturing-usecase-card {
    border-top-color: #F97316;
}

.manufacturing-label {
    color: #F97316;
}

.manufacturing-result {
    background: linear-gradient(135deg, rgba(249, 115, 22, 0.1), rgba(251, 146, 60, 0.1));
}

.manufacturing-standard {
    background: #F97316;
}

.manufacturing-compliance-card {
    border-top-color: #F97316;
}

.manufacturing-arch-card {
    border-left-color: #F97316;
}

/* SMALL BUSINESS - Vibrant & Accessible */
.smb-hero { background: linear-gradient(135deg, #F0FDF4 0%, #DCFCE7 100%); }
.smb-icon { background: linear-gradient(135deg, #10B981, #34D399); }
.smb-title { color: #047857; }
.smb-subtitle { color: #065F46; }
.smb-gradient { background: linear-gradient(135deg, #10B981, #34D399) !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; }
.smb-quick-features { display: flex; gap: 16px; margin: 20px 0; flex-wrap: wrap; }
.quick-feature { padding: 8px 16px; background: rgba(16, 185, 129, 0.1); border-radius: 20px; font-size: 14px; font-weight: 600; color: #047857; }
.smb-btn-primary { background: linear-gradient(135deg, #10B981, #34D399); border: none; }
.smb-btn-outline { border-color: #10B981; color: #047857; }
.smb-roi-card { border-top-color: #10B981; }
.challenges-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; margin-top: 48px; }
.challenge-card { padding: 28px; background: var(--white); border-radius: 12px; box-shadow: var(--shadow); border-left: 4px solid #10B981; }
.challenge-title { font-size: 20px; font-weight: 700; color: #047857; margin-bottom: 12px; }
.challenge-desc { font-size: 15px; line-height: 1.6; color: var(--text-light); margin-bottom: 12px; }
.challenge-impact, .challenge-solution { padding: 12px; border-radius: 6px; font-size: 13px; margin-top: 12px; }
.challenge-impact { background: rgba(239, 68, 68, 0.1); color: #DC2626; }
.challenge-solution { background: rgba(16, 185, 129, 0.1); color: #047857; }
.deployment-options { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; margin-top: 48px; }
.deployment-card { padding: 32px; background: var(--white); border-radius: 16px; box-shadow: var(--shadow-lg); border-top: 6px solid #10B981; }
.deployment-title { font-size: 22px; font-weight: 800; color: #047857; margin-bottom: 16px; }
.deployment-benefits, .deployment-ideal { padding: 16px; background: var(--gray-50); border-radius: 8px; margin-top: 16px; font-size: 14px; }
.pricing-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; margin-top: 48px; }
.pricing-card { padding: 32px 24px; background: var(--white); border-radius: 12px; box-shadow: var(--shadow); text-align: center; border: 3px solid #10B981; }
.pricing-value { font-size: 32px; font-weight: 900; color: #047857; margin: 16px 0; }
.iso-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 32px; margin-top: 48px; }
.iso-card { padding: 32px; background: var(--white); border-radius: 12px; box-shadow: var(--shadow); border-left: 6px solid #3B82F6; }
.protection-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 48px; }
.protection-card { padding: 24px; background: var(--white); border-radius: 8px; box-shadow: var(--shadow); border-top: 3px solid #10B981; }
.protection-why { padding: 12px; background: rgba(16, 185, 129, 0.1); border-radius: 6px; margin-top: 12px; font-size: 13px; }
.smb-badge { background: linear-gradient(135deg, #10B981, #34D399); }
.smb-usecase-card { border-top-color: #10B981; }
.smb-label { color: #047857; }
.smb-result { background: linear-gradient(135deg, rgba(16, 185, 129, 0.1), rgba(52, 211, 153, 0.1)); }
.implementation-timeline { max-width: 800px; margin: 48px auto 0; }
.timeline-step { display: flex; gap: 24px; padding: 24px; background: var(--white); border-radius: 12px; box-shadow: var(--shadow); margin-bottom: 16px; }
.timeline-number { width: 60px; height: 60px; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #10B981, #34D399); border-radius: 50%; color: var(--white); font-size: 28px; font-weight: 900; flex-shrink: 0; }
.timeline-phase { font-size: 20px; font-weight: 700; color: #047857; margin-bottom: 8px; }
.timeline-arrow { text-align: center; font-size: 32px; color: #10B981; margin: 8px 0; }
.smb-cta { background: linear-gradient(135deg, #10B981, #34D399); }
@media (max-width: 991px) { .challenges-grid, .deployment-options, .iso-grid, .protection-grid { grid-template-columns: 1fr; } .pricing-grid { grid-template-columns: repeat(2, 1fr); }}

/* ABOUT PAGE */
.about-hero { padding: 80px 0; background: linear-gradient(135deg, var(--primary-color), var(--secondary-color)); color: var(--white); }
.about-page-title { font-size: 48px; font-weight: 900; margin-bottom: 16px; }
.about-subtitle { font-size: 24px; font-weight: 300; margin-bottom: 24px; opacity: 0.95; }
.about-hero-intro { font-size: 18px; line-height: 1.8; max-width: 900px; margin: 0 auto; opacity: 0.9; }
.about-story-grid { display: grid; grid-template-columns: 2fr 1fr; gap: 60px; align-items: center; }
.story-text { font-size: 16px; line-height: 1.8; color: var(--text-light); }
.year-badge { background: linear-gradient(135deg, var(--primary-color), var(--accent-color)); padding: 40px; border-radius: 20px; text-align: center; box-shadow: var(--shadow-xl); }
.year-number { font-size: 72px; font-weight: 900; color: var(--white); line-height: 1; }
.year-label { font-size: 20px; color: rgba(255,255,255,0.9); margin-top: 12px; }
.mv-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 40px; }
.mv-card { padding: 48px; background: var(--white); border-radius: 16px; box-shadow: var(--shadow-lg); text-align: center; }
.mv-icon { font-size: 64px; margin-bottom: 24px; }
.mv-title { font-size: 28px; font-weight: 800; margin-bottom: 16px; }
.mv-text { font-size: 16px; line-height: 1.8; color: var(--text-light); }
.values-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 48px; }
.value-card { padding: 32px; background: var(--white); border-radius: 12px; box-shadow: var(--shadow); border-top: 4px solid var(--primary-color); }
.value-title { font-size: 20px; font-weight: 700; margin-bottom: 12px; }
.products-showcase { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; margin-top: 48px; }
.product-showcase-card { padding: 40px; background: var(--white); border-radius: 16px; box-shadow: var(--shadow-lg); text-align: center; }
.product-showcase-icon { font-size: 56px; margin-bottom: 24px; }
.product-link { display: inline-block; margin-top: 16px; color: var(--primary-color); font-weight: 600; }
.offices-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 40px; margin-top: 48px; }
.office-card { padding: 40px; background: var(--white); border-radius: 16px; box-shadow: var(--shadow-lg); text-align: center; }
.office-flag { font-size: 64px; margin-bottom: 20px; }
.office-address { font-size: 14px; color: var(--text-muted); margin: 16px 0; }
.partnerships-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 40px; margin-top: 48px; max-width: 800px; margin-left: auto; margin-right: auto; }
.partner-card { padding: 40px; background: var(--white); border-radius: 16px; box-shadow: var(--shadow-lg); text-align: center; }
.partner-logo { height: 80px; margin-bottom: 24px; }
.why-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; margin-top: 48px; }
.why-card { padding: 32px; background: var(--white); border-radius: 12px; box-shadow: var(--shadow); text-align: center; }
.why-stat { font-size: 48px; font-weight: 900; color: var(--primary-color); margin-bottom: 12px; }
.culture-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 32px; margin-top: 48px; }
.culture-card { padding: 32px; background: var(--white); border-radius: 12px; box-shadow: var(--shadow); border-left: 6px solid var(--accent-color); }
.awards-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 48px; }
.award-badge { padding: 24px; background: var(--white); border-radius: 12px; box-shadow: var(--shadow); text-align: center; }
.award-icon { font-size: 40px; margin-bottom: 12px; }
.about-cta-buttons { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; margin-top: 32px; }
@media (max-width: 991px) { .about-story-grid, .mv-grid, .values-grid, .products-showcase, .offices-grid, .partnerships-grid, .why-grid, .culture-grid, .awards-grid { grid-template-columns: 1fr; }}


/* CONTACT PAGE */
.contact-hero { padding: 60px 0; background: linear-gradient(135deg, var(--gray-50), var(--white)); }
.contact-page-title { font-size: 42px; font-weight: 800; color: var(--primary-color); margin-bottom: 16px; }
.contact-subtitle { font-size: 20px; color: var(--text-light); margin-bottom: 16px; }
.contact-intro { font-size: 16px; color: var(--text-muted); max-width: 700px; margin: 0 auto; }
.contact-options-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 48px; }
.contact-option-card { padding: 32px 24px; background: var(--white); border-radius: 12px; box-shadow: var(--shadow); text-align: center; border-top: 4px solid var(--primary-color); }
.option-icon { font-size: 48px; margin-bottom: 16px; }
.option-title { font-size: 20px; font-weight: 700; margin-bottom: 12px; }
.option-desc { font-size: 14px; color: var(--text-light); margin-bottom: 20px; }
.contact-form-grid { display: grid; grid-template-columns: 1.5fr 1fr; gap: 60px; }
.form-section-title { font-size: 32px; font-weight: 800; margin-bottom: 8px; }
.form-section-subtitle { font-size: 16px; color: var(--text-muted); margin-bottom: 32px; }
.contact-form .form-row { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; margin-bottom: 20px; }
.contact-form .form-group { margin-bottom: 20px; }
.contact-form label { display: block; font-weight: 600; margin-bottom: 8px; color: var(--text-color); }
.contact-form .form-control { width: 100%; padding: 12px 16px; border: 2px solid var(--border-color); border-radius: 8px; font-size: 15px; transition: border-color 0.3s; }
.contact-form .form-control:focus { outline: none; border-color: var(--primary-color); }
.contact-form textarea.form-control { resize: vertical; min-height: 120px; }
.checkbox-group { margin: 24px 0; }
.checkbox-label { display: flex; align-items: center; gap: 10px; cursor: pointer; }
.checkbox-label input[type="checkbox"] { width: 20px; height: 20px; cursor: pointer; }
.form-privacy-text { font-size: 13px; color: var(--text-muted); margin-bottom: 24px; }
.btn-block { width: 100%; }
.form-message { margin-top: 20px; padding: 16px; border-radius: 8px; display: none; }
.form-message.success { background: rgba(16, 185, 129, 0.1); color: #059669; border: 2px solid #10B981; display: block; }
.form-message.error { background: rgba(239, 68, 68, 0.1); color: #DC2626; border: 2px solid #EF4444; display: block; }
.contact-info-wrapper { position: sticky; top: 100px; }
.contact-info-section { background: var(--gray-50); padding: 32px; border-radius: 12px; margin-bottom: 24px; }
.info-section-title { font-size: 20px; font-weight: 700; margin-bottom: 24px; color: var(--primary-color); }
.office-info { padding: 20px; background: var(--white); border-radius: 8px; margin-bottom: 16px; }
.office-flag { font-size: 32px; margin-bottom: 12px; }
.office-name { font-size: 18px; font-weight: 700; margin-bottom: 8px; }
.office-address { font-size: 14px; color: var(--text-light); margin-bottom: 8px; line-height: 1.6; }
.office-hours { font-size: 13px; color: var(--text-muted); }
.contact-method { display: flex; gap: 16px; padding: 20px; background: var(--white); border-radius: 8px; margin-bottom: 16px; }
.method-icon { font-size: 32px; flex-shrink: 0; }
.method-title { font-size: 16px; font-weight: 700; margin-bottom: 8px; }
.method-content p { font-size: 14px; color: var(--text-light); margin-bottom: 4px; }
.phone-number { font-size: 18px !important; font-weight: 700 !important; color: var(--primary-color) !important; }
.method-link { display: inline-block; margin-top: 8px; color: var(--primary-color); font-weight: 600; font-size: 14px; }
.faq-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 32px; margin-top: 48px; max-width: 1000px; margin-left: auto; margin-right: auto; }
.faq-item { padding: 24px; background: var(--white); border-radius: 12px; box-shadow: var(--shadow); }
.faq-question { font-size: 18px; font-weight: 700; margin-bottom: 12px; color: var(--primary-color); }
.faq-answer { font-size: 15px; color: var(--text-light); line-height: 1.7; }
@media (max-width: 991px) { 
    .contact-options-grid { grid-template-columns: repeat(2, 1fr); }
    .contact-form-grid { grid-template-columns: 1fr; }
    .contact-info-wrapper { position: static; margin-top: 40px; }
    .contact-form .form-row { grid-template-columns: 1fr; }
    .faq-grid { grid-template-columns: 1fr; }
}
@media (max-width: 767px) { 
    .contact-options-grid { grid-template-columns: 1fr; }
}

/* ================================================
   MOBILE MEGA-MENU OVERRIDE
   ================================================ */
@media (max-width: 991px) {
    /* Mega Menu - Mobile Fix */
    .mega-menu {
        left: 0 !important;
        right: 0 !important;
        transform: none !important;
        min-width: auto !important;
        width: 100% !important;
        border-left: none !important;
        margin-left: 0 !important;
        padding-left: 0 !important;
        position: static !important;
    }
    
    .nav-item:hover .mega-menu,
    .nav-item.active .mega-menu {
        transform: none !important;
    }
    
    .mega-menu-grid {
        grid-template-columns: 1fr !important;
        padding: var(--spacing-sm) 0 !important;
        gap: var(--spacing-xs) !important;
    }
    
    .mega-menu-col {
        padding: 0 !important;
        margin: 0 !important;
    }
    
    .mega-menu-col h4 {
        font-size: var(--text-sm) !important;
        margin-bottom: var(--spacing-xs) !important;
        padding: var(--spacing-xs) var(--spacing-md) !important;
        color: var(--primary-color) !important;
        font-weight: 600 !important;
    }
    
    .mega-menu-col ul {
        list-style: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }
    
    .mega-menu-col ul li {
        margin: 0 !important;
    }
    
    .mega-menu-col ul li a {
        padding: var(--spacing-sm) var(--spacing-md) !important;
        padding-left: calc(var(--spacing-md) * 2) !important;
        display: block !important;
        color: var(--text-color) !important;
    }
    
    .mega-menu-col ul li a:hover {
        background-color: var(--gray-50) !important;
        color: var(--accent-color) !important;
    }
}