html {
      scroll-behavior: smooth;
    }

    * {
      font-family: 'Inter', sans-serif;
    }

    .headline-font {
      font-family: 'Space Grotesk', sans-serif;
    }

    .logo-card {
      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    }

    .logo-card:hover {
      transform: translateY(-8px) scale(1.02);
      box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.15);
    }

    .logo-card:hover .ai-overlay {
      opacity: 1;
    }

    .logo-card:hover .logo-content {
      filter: brightness(0.95);
    }

    .award-badge {
      background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 50%, #d97706 100%);
      box-shadow: 0 2px 8px rgba(217, 119, 6, 0.4);
    }

    .search-glow:focus {
      box-shadow: 0 0 0 3px rgba(194, 65, 12, 0.2);
    }

    .cta-button {
      background: linear-gradient(135deg, #7c3aed 0%, #6b21a8 100%);
      transition: all 0.3s ease;
    }

    .cta-button:hover {
      background: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%);
      transform: translateY(-2px);
      box-shadow: 0 10px 30px -5px rgba(107, 33, 168, 0.4);
    }

    .ai-glow {
      background: linear-gradient(90deg, #06b6d4, #8b5cf6, #06b6d4);
      background-size: 200% 100%;
      animation: shimmer 3s ease-in-out infinite;
    }

    @keyframes shimmer {

      0%,
      100% {
        background-position: 0% 50%;
      }

      50% {
        background-position: 100% 50%;
      }
    }

    .micro-text {
      font-size: 9px;
      letter-spacing: 0.1em;
    }

    .theme-toggle {
      border: 1px solid #5a4a3f;
      color: #e8e0d8;
      background: #2a1d16;
      transition: all 0.2s ease;
    }

    .theme-toggle:hover {
      border-color: #8a7a6f;
      color: #ffffff;
    }

    html.dark-mode body {
      background: #121212;
      color: #e5e7eb;
    }

    html.dark-mode header {
      background: #1a1a1a;
      border-bottom: 1px solid #2a2a2a;
    }

    html.dark-mode .search-glow {
      background: #111827;
      border-color: #374151;
      color: #e5e7eb;
    }

    html.dark-mode .search-glow::placeholder {
      color: #9ca3af;
    }

    html.dark-mode .bg-\[\#f8f6f3\],
    html.dark-mode section.py-16,
    html.dark-mode footer {
      background: #18181b !important;
      border-color: #2a2a2a !important;
    }

    html.dark-mode section.py-20 .bg-white\/70 {
      background: rgba(10, 10, 10, 0.55) !important;
    }

    html.dark-mode .text-\[\#1a1a1a\],
    html.dark-mode .text-\[\#3f2a1f\],
    html.dark-mode .text-\[\#374151\],
    html.dark-mode .text-\[\#6b7280\],
    html.dark-mode .text-\[\#6b21a8\] {
      color: #e5e7eb !important;
    }

    html.dark-mode .logo-card,
    html.dark-mode .logo-card.bg-white {
      background: #27272a !important;
      border: 1px solid #3f3f46;
    }

    html.dark-mode .logo-card .text-\[\#1a1a1a\] {
      color: #e5e7eb !important;
    }

    html.dark-mode .logo-card svg text,
    html.dark-mode .logo-card svg circle,
    html.dark-mode .logo-card svg rect,
    html.dark-mode .logo-card svg path,
    html.dark-mode .logo-card svg polygon,
    html.dark-mode .logo-card svg ellipse {
      stroke: #e5e7eb;
      fill: #e5e7eb;
    }

    html.dark-mode .logo-card .ai-overlay svg {
      stroke: currentColor;
      fill: none;
    }

    html.dark-mode .text-\[\#a89080\],
    html.dark-mode .text-\[\#9ca3af\] {
      color: #9ca3af !important;
    }

body {
      box-sizing: border-box;
    }