<footer class="bg-creative-900 text-white">
  <div class="container mx-auto px-4 py-16">
    <div class="grid grid-cols-1 md:grid-cols-4 gap-10">
      <div class="md:col-span-2">
        <div class="flex items-center gap-3 mb-6">
          <div class="w-12 h-12 rounded-xl bg-gradient-to-br from-creative-500 to-navy-500 text-white flex items-center justify-center font-bold text-xl">C</div>
          <div>
            <div class="text-xl font-semibold">{{default (index .ThemesExt "brand_name") "创想传媒"}}</div>
            <div class="text-sm text-creative-300">{{default (index .ThemesExt "brand_slogan") "创意驱动品牌，设计成就未来"}}</div>
          </div>
        </div>
        <p class="text-creative-300 text-sm leading-relaxed max-w-md">我们是一支充满激情的创意团队，专注于品牌策划、视觉设计、数字营销领域，用创意驱动品牌价值增长。</p>
        <div class="mt-6 flex items-center gap-4">
          <a href="#" class="w-10 h-10 rounded-lg bg-creative-800 hover:bg-creative-700 flex items-center justify-center transition-colors"><i class="fa-brands fa-weixin"></i></a>
          <a href="#" class="w-10 h-10 rounded-lg bg-creative-800 hover:bg-creative-700 flex items-center justify-center transition-colors"><i class="fa-brands fa-weibo"></i></a>
          <a href="#" class="w-10 h-10 rounded-lg bg-creative-800 hover:bg-creative-700 flex items-center justify-center transition-colors"><i class="fa-brands fa-zhihu"></i></a>
          <a href="#" class="w-10 h-10 rounded-lg bg-creative-800 hover:bg-creative-700 flex items-center justify-center transition-colors"><i class="fa-brands fa-behance"></i></a>
        </div>
      </div>
      <div>
        <div class="font-semibold mb-4">快速链接</div>
        <div class="space-y-3 text-sm text-creative-300">
          {{range .Columns}}
          <a href="/{{.Slug}}" class="block hover:text-white transition-colors">{{.Name}}</a>
          {{end}}
        </div>
      </div>
      <div>
        <div class="font-semibold mb-4">联系我们</div>
        <div class="space-y-3 text-sm text-creative-300">
          <div class="flex items-start gap-2"><i class="fa-solid fa-location-dot mt-1 text-creative-400"></i><span>{{default (index .ThemesExt "address") "地址请在后台配置"}}</span></div>
          <div class="flex items-center gap-2"><i class="fa-solid fa-phone text-creative-400"></i><span>{{default (index .ThemesExt "tel") "电话请在后台配置"}}</span></div>
          <div class="flex items-center gap-2"><i class="fa-solid fa-envelope text-creative-400"></i><span>{{default (index .ThemesExt "email") "邮箱请在后台配置"}}</span></div>
          <div class="flex items-center gap-2"><i class="fa-solid fa-clock text-creative-400"></i><span>{{default (index .ThemesExt "work_hours") "工作时间请配置"}}</span></div>
        </div>
      </div>
    </div>
    <div class="mt-12 pt-8 border-t border-creative-800 flex flex-col md:flex-row items-center justify-between gap-4">
      <div class="text-sm text-creative-400">{{if .Site}}{{.Site.Title}}{{end}} · Powered by VMAPP</div>
      {{$links := FriendLinks}}
      {{if $links}}
      <div class="flex flex-wrap items-center gap-4 text-sm text-creative-400">
        <span>友情链接：</span>
        {{range $links}}
        <a class="hover:text-white transition-colors" href="{{.URL}}" target="_blank" rel="nofollow">{{.Name}}</a>
        {{end}}
      </div>
      {{end}}
    </div>
  </div>
</footer>
