:root {
  
  --color-black: #000000;
  --color-text-secondary: #a0a0a0;
  --color-text: #e0e0e0;
  --color-whatsapp-green: #25D366; 
  --color-border-dark: rgba(255, 255, 255, 0.15); 

  
  --color-footer-bg: var(--color-black); 
  --color-footer-text: var(--color-text-secondary);
  --color-footer-link: var(--color-text);
  --color-footer-link-hover: var(--color-whatsapp-green);
  --color-footer-border: var(--color-border-dark);

  
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-xxl: 48px;

  
  --font-size-sm: 0.875rem; 
  --font-size-xs: 0.75rem;  

  
  --transition-fast: 0.2s ease;
}


.main-footer {
    background: var(--color-footer-bg);
    color: var(--color-footer-text);
    padding: var(--space-xl) var(--space-lg); 
    text-align: center;
    margin-top: var(--space-xxl); 
    font-size: var(--font-size-sm);
    border-top: 1px solid var(--color-footer-border); 
}

.footer-content {
    max-width: 1000px; 
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: var(--space-md); 
}

.footer-links {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: var(--space-md) var(--space-lg); 
    margin-bottom: var(--space-xs); 
}

.footer-links a {
    color: var(--color-footer-link); 
    text-decoration: none;
    opacity: 0.9;
    transition: opacity var(--transition-fast), color var(--transition-fast);
}

.footer-links a:hover,
.footer-links a:focus {
    opacity: 1;
    color: var(--color-footer-link-hover); 
    text-decoration: underline;
}

.footer-copyright {
    font-size: var(--font-size-xs);
    opacity: 0.8;
}


.mobile-overlay {
    position: fixed;
    top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0, 0, 0, 0.7);
    z-index: 998;
    opacity: 0; visibility: hidden;
    transition: opacity 0.4s ease, visibility 0s linear 0.4s;
}
.mobile-overlay.active {
    opacity: 1; visibility: visible;
    transition: opacity 0.4s ease, visibility 0s linear 0s;
}


@media print {
  .main-footer {
    background: white !important;
    color: black !important;
    border-top: 1px solid #ccc !important;
    margin-top: 2cm !important;
    padding: 1cm !important;
  }
  .footer-links a {
    color: #0000EE !important; 
    opacity: 1 !important;
  }
  .footer-copyright {
    color: #333 !important;
    opacity: 1 !important;
  }
  .mobile-overlay { display: none !important; }
}