body.theme-card-shop {
  --card-navy: #111827;
  --card-slate: #475569;
  --card-gold: #c9a227;
  --card-paper: #f7f6f2;
  background:
    linear-gradient(90deg, rgba(17, 24, 39, 0.06) 1px, transparent 1px) 0 0 / 30px 30px,
    var(--card-paper);
  font-family: "Trebuchet MS", "Manrope", system-ui, sans-serif;
}

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

.theme-card-shop .hero {
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.06) 1px, transparent 1px) 0 0 / 34px 34px,
    linear-gradient(135deg, #111827 0%, #273244 58%, #c9a227 150%);
  color: #ffffff;
}

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

.theme-card-shop .service-card,
.theme-card-shop .visual-card,
.theme-card-shop .area-panel,
.theme-card-shop .faq-card {
  border-radius: 8px;
  border: 1px solid rgba(71, 85, 105, 0.2);
  border-bottom: 0.42rem solid var(--card-gold);
  background: #ffffff;
  box-shadow: 0 16px 32px rgba(17, 24, 39, 0.1);
}

.theme-card-shop .section-soft {
  background: #e7ebf2;
}

.theme-card-shop .button {
  border-radius: 8px;
}

.theme-card-shop .button-primary {
  background: var(--card-navy);
}

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

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