.home-hero {
  padding: 5rem 1rem; text-align: center;
  background-image: linear-gradient(to bottom, var(--color-blue-50), var(--color-white));
}
@media(min-width: 640px) { .home-hero { padding-left: 1.5rem; padding-right: 1.5rem; } }
@media(min-width: 1024px) { .home-hero { padding-left: 2rem; padding-right: 2rem; } }

.home-hero__title {
  margin-bottom: 1.5rem; font-size: 2.25rem; font-weight: 800;
  letter-spacing: -0.025em; color: var(--color-gray-900);
}
@media(min-width: 640px) { .home-hero__title { font-size: 3rem; } }
@media(min-width: 768px) { .home-hero__title { font-size: 3.75rem; } }

.home-hero__highlight {
  background-image: linear-gradient(to right, var(--color-blue-600), var(--color-indigo-600));
  -webkit-background-clip: text; color: transparent;
}

.home-hero__subtitle {
  margin: 0 auto 2.5rem; max-width: 42rem; font-size: 1.125rem; color: var(--color-gray-600);
}

.home-search { margin: 0 auto; max-width: 36rem; position: relative; }
.home-search__icon-wrapper {
  position: absolute; top: 0; bottom: 0; left: 0; display: flex; align-items: center;
  padding-left: 1rem; pointer-events: none;
}
.home-search__icon {
  height: 1.25rem; width: 1.25rem; color: var(--color-gray-400); transition: color 0.3s;
}
.home-search:focus-within .home-search__icon { color: var(--color-blue-500); }
.home-search__input {
  display: block; width: 100%; border-radius: 1rem; border: 1px solid var(--color-gray-200);
  background-color: var(--color-white); padding: 1rem 1rem 1rem 3rem; color: var(--color-gray-900);
  box-shadow: var(--shadow-lg); transition: all 0.3s;
}
.home-search__input::placeholder { color: var(--color-gray-400); }
.home-search__input:focus {
  border-color: var(--color-blue-500); outline: none; box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.2);
}
.home-search__input:hover { box-shadow: var(--shadow-xl); }

.home-features { padding: 4rem 1rem; max-width: var(--max-width-7xl); margin: 0 auto; }
@media(min-width: 640px) { .home-features { padding: 4rem 1.5rem; } }
@media(min-width: 1024px) { .home-features { padding: 4rem 2rem; } }

.home-features__header { text-align: center; margin-bottom: 2.5rem; }
.home-features__title { font-size: 1.5rem; font-weight: 700; color: var(--color-gray-900); }
@media(min-width: 640px) { .home-features__title { font-size: 1.875rem; } }
.home-features__subtitle { margin-top: 0.75rem; color: var(--color-gray-500); max-width: 42rem; margin-left: auto; margin-right: auto; }

.home-features__grid { display: grid; grid-template-columns: 1fr; gap: 2rem; }
@media(min-width: 640px) { .home-features__grid { grid-template-columns: repeat(3, 1fr); } }

.feature-card { border-radius: var(--radius-xl); border: 1px solid var(--color-gray-100); background-color: var(--color-white); padding: 1.5rem; box-shadow: var(--shadow-sm); }
.feature-card__icon-wrapper { margin-bottom: 1rem; display: flex; height: 2.5rem; width: 2.5rem; align-items: center; justify-content: center; border-radius: var(--radius-lg); }
.feature-card__icon { height: 1.25rem; width: 1.25rem; }
.feature-card__title { font-size: 1rem; font-weight: 600; color: var(--color-gray-900); margin-bottom: 0.5rem; }
.feature-card__desc { font-size: 0.875rem; color: var(--color-gray-500); }

.feature-card--blue .feature-card__icon-wrapper { background-color: var(--color-blue-50); color: var(--color-blue-600); }
.feature-card--green .feature-card__icon-wrapper { background-color: var(--color-green-50); color: var(--color-green-600); }
.feature-card--purple .feature-card__icon-wrapper { background-color: var(--color-purple-50); color: var(--color-purple-600); }
