:root {
  --hero-height: 100vh;
}

html {
  scroll-behavior: smooth;
}

body {
  text-rendering: optimizeLegibility;
}

.hero-collapse {
  transition: height 0.5s ease, padding 0.5s ease;
}

.fade-in {
  animation: fadeIn 0.5s ease-in;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.scroll-margin {
  scroll-margin-top: 80px;
}

.accordion-item {
  border-radius: 0.5rem;
  overflow: hidden;
  margin-bottom: 1rem;
}

.accordion-header {
  cursor: pointer;
  padding: 1.5rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.accordion-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease-out;
}

.accordion-chevron {
  transition: transform 0.3s ease;
}

.accordion-open .accordion-chevron {
  transform: rotate(180deg);
}

.service-card {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.service-card:hover {
  transform: translateY(-5px);
}

.form-input {
  transition: border 0.3s ease, box-shadow 0.3s ease;
}

.form-input:focus {
  box-shadow: 0 0 0 2px rgba(230, 46, 46, 0.5);
}

.dark .dark-bg {
  background-color: #171717;
}

.dark .dark-card {
  background-color: #262626;
}

.dark .hero-bg {
  background: linear-gradient(to bottom, rgba(230, 46, 46, 0.9), rgba(179, 36, 36, 0.9));
}

.prose h2 {
  font-size: 1.5em;
  font-weight: 600;
  margin-top: 2em;
  margin-bottom: 1em;
}

.prose p {
  font-size: 1.125rem;
  line-height: 1.75;
  margin-bottom: 1.25em;
}

.prose a {
  color: #e62e2e;
  text-decoration: none;
}

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

.prose ul {
  list-style-type: disc;
  padding-left: 1.5em;
  margin-bottom: 1.25em;
}

.prose li {
  margin-bottom: 0.5em;
}

.contact-card-link {
  transition: color 0.2s ease;
}

.contact-card-link:hover {
  color: #b32424;
}

.consent-banner[hidden],
.social-links[hidden] {
  display: none !important;
}

.consent-banner {
  position: fixed;
  left: 1rem;
  right: 1rem;
  bottom: 1rem;
  z-index: 60;
}

.map-link-card {
  background:
    radial-gradient(circle at top left, rgba(230, 46, 46, 0.12), transparent 35%),
    linear-gradient(135deg, #ffffff, #f5f5f5);
}

.dark .map-link-card {
  background:
    radial-gradient(circle at top left, rgba(255, 107, 107, 0.2), transparent 35%),
    linear-gradient(135deg, #171717, #262626);
}

.skip-link {
  position: absolute;
  left: 1rem;
  top: -3rem;
  z-index: 80;
  padding: 0.75rem 1rem;
  border-radius: 9999px;
  background: #111827;
  color: #ffffff;
}

.skip-link:focus {
  top: 1rem;
}