/* 基础样式和工具类 */
.section-padding {
  padding-top: 2rem;
  padding-bottom: 2rem;
}

.btn-primary {
  @apply bg-primary text-white rounded-md hover:bg-primary/90 transition-colors;
}

/* 域名卡片样式 */
.domain-card {
  @apply bg-white rounded-lg border border-gray-200 overflow-hidden transition-all duration-200 hover:shadow-md hover:border-primary/30 hover:-translate-y-1 opacity-0 transform translate-y-4;
}

/* 域名网格布局 */
.domain-grid {
  @apply relative;
}

/* 全部域名区域样式优化 */
#all-domains {
  @apply bg-gradient-to-b from-white to-gray-50;
  padding-bottom: 3rem;
}

#all-domains .domain-card {
  @apply relative overflow-hidden;
}

#all-domains .domain-card::before {
  content: '';
  @apply absolute top-0 left-0 w-full h-1 bg-gradient-to-r from-primary to-secondary transform scale-x-0 transition-transform duration-300 origin-left;
}

#all-domains .domain-card:hover::before {
  @apply transform scale-x-100;
}

#all-domains h3 {
  @apply transition-colors duration-200;
}

#all-domains .domain-card:hover h3 {
  @apply text-primary;
}

/* 响应式调整 */
@media (max-width: 1023px) {
  .domain-card {
    @apply opacity-100 transform translate-y-0;
  }
}

@media (min-width: 1024px) {
  /* 大屏设备样式 */
  .domain-card {
    @apply p-5;
  }
}

/* 平滑滚动 */
html {
  scroll-behavior: smooth;
}

/* 返回顶部按钮样式 */
#back-to-top {
  @apply transition-all duration-300;
}

#back-to-top:hover {
  @apply bg-primary/90 transform scale-110;
}