body.theme-collector {
  --collector-navy: #14263c;
  --collector-red: #7a2f33;
  --collector-gold: #b28a46;
  --collector-paper: #f6f2eb;
  background:
    linear-gradient(90deg, rgba(20, 38, 60, 0.08) 1px, transparent 1px) 0 0 / 28px 28px,
    var(--collector-paper);
  font-family: "Trebuchet MS", "Manrope", system-ui, sans-serif;
}

.theme-collector h1,
.theme-collector h2,
.theme-collector h3,
.theme-collector .brand strong {
  font-family: "Trebuchet MS", "Manrope", system-ui, sans-serif;
  letter-spacing: -0.02em;
}

.theme-collector .hero {
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px) 0 0 / 32px 32px,
    linear-gradient(135deg, var(--collector-navy) 0%, #263d5b 55%, #8b6231 150%);
  color: #fff7e9;
}

.theme-collector .service-grid,
.theme-collector .gallery-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.theme-collector .service-card,
.theme-collector .visual-card,
.theme-collector .area-panel,
.theme-collector .faq-card {
  border-radius: 5px;
  border: 1px solid rgba(20, 38, 60, 0.22);
  border-top: 0.35rem solid var(--collector-gold);
  background: #fffaf0;
  box-shadow: 0 12px 28px rgba(20, 38, 60, 0.1);
}

.theme-collector .section-soft {
  background: #1b2f49;
  color: #fff7e9;
}

.theme-collector .section-soft p,
.theme-collector .section-soft li {
  color: rgba(255, 247, 233, 0.76);
}

.theme-collector .button {
  border-radius: 5px;
}

.theme-collector .button-primary {
  background: var(--collector-red);
}

@media (max-width: 920px) {
  .theme-collector .service-grid,
  .theme-collector .gallery-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 759px) {
  .theme-collector .service-grid,
  .theme-collector .gallery-grid {
    grid-template-columns: 1fr;
  }
}
