/* Additional SEO styles for digitale-werksicherheit.de */

/* Improve text contrast for accessibility */
body {
  color: #333;
}

h1, h2, h3, h4, h5, h6 {
  color: #003366;
}

/* Improve heading hierarchy for SEO */
h1 {
  font-size: 2.8rem;
  margin-bottom: 1.5rem;
}

h2 {
  font-size: 2.2rem;
  margin-bottom: 1.2rem;
}

h3 {
  font-size: 1.6rem;
  margin-bottom: 1rem;
}

/* Improve link accessibility */
a:focus {
  outline: 2px solid var(--accent-color);
}

/* Improve form accessibility */
input:focus, 
textarea:focus, 
select:focus {
  outline: 2px solid var(--accent-color);
  border-color: var(--primary-color);
}

/* Add schema markup styling */
.schema-organization,
.schema-product,
.schema-offer {
  display: none;
}

/* Improve image alt text visibility when images fail to load */
img {
  font-style: italic;
  color: #666;
}

/* Improve print styles for SEO */
@media print {
  a {
    text-decoration: underline;
    color: #000;
  }
  
  a[href^="http"]:after {
    content: " (" attr(href) ")";
  }
  
  .no-print {
    display: none;
  }
}

/* Improve loading performance */
.lazy-load {
  transition: opacity 0.3s;
  opacity: 0;
}

.lazy-load.loaded {
  opacity: 1;
}

/* Improve mobile accessibility */
@media (max-width: 768px) {
  input, 
  select, 
  textarea, 
  button {
    font-size: 16px; /* Prevents zoom on iOS */
  }
  
  .btn {
    padding: 15px 30px; /* Larger touch target */
  }
}

/* Add structured data styling */
.breadcrumbs {
  display: flex;
  list-style: none;
  padding: 0;
  margin: 1rem 0;
  font-size: 0.9rem;
}

.breadcrumbs li {
  display: inline;
}

.breadcrumbs li:not(:last-child):after {
  content: "›";
  margin: 0 0.5rem;
  color: var(--gray-color);
}

.breadcrumbs a {
  color: var(--gray-color);
}

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

/* Add meta information styling */
.meta-info {
  font-size: 0.9rem;
  color: var(--gray-color);
  margin-bottom: 1rem;
}

.meta-info i {
  margin-right: 0.5rem;
}

/* Improve hero section for SEO */
.hero h1 {
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
}

/* Improve section spacing for readability */
section {
  padding: 100px 0;
}

@media (max-width: 768px) {
  section {
    padding: 60px 0;
  }
}