/*
Theme Name: SEO
Theme URI: 
Author: 
Author URI: 
Description: 智能化弱电系统集成方案主题
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: seo
*/

/* ========== Base Styles ========== */
:root, html, body {
  color-scheme: light;
}

html {
  forced-color-adjust: none;
  scrollbar-gutter: stable;
}

header {
  background-color: rgba(255, 255, 255, 0.85) !important;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  transition: background-color .2s, backdrop-filter .2s;
}

h2 {
  word-break: break-word;
}

/* ========== Animations ========== */
@keyframes fade-in-8d90ea29 {
  0% { opacity: 0; }
  to { opacity: 1; }
}
@keyframes slide-in-from-left-4-8d90ea29 {
  0% { transform: translate(-1rem); opacity: 0; }
  to { transform: translate(0); opacity: 1; }
}
@keyframes slide-in-from-left-6-8d90ea29 {
  0% { transform: translate(-1.5rem); opacity: 0; }
  to { transform: translate(0); opacity: 1; }
}
@keyframes slide-in-from-left-8-8d90ea29 {
  0% { transform: translate(-2rem); opacity: 0; }
  to { transform: translate(0); opacity: 1; }
}
@keyframes slide-in-from-left-10-8d90ea29 {
  0% { transform: translate(-2.5rem); opacity: 0; }
  to { transform: translate(0); opacity: 1; }
}
@keyframes slide-in-from-right-6-8d90ea29 {
  0% { transform: translate(1.5rem); opacity: 0; }
  to { transform: translate(0); opacity: 1; }
}

.animate-in { animation-fill-mode: both; }
.fade-in { animation-name: fade-in-8d90ea29; }
.slide-in-from-left-4 { animation-name: slide-in-from-left-4-8d90ea29; }
.slide-in-from-left-6 { animation-name: slide-in-from-left-6-8d90ea29; }
.slide-in-from-left-8 { animation-name: slide-in-from-left-8-8d90ea29; }
.slide-in-from-left-10 { animation-name: slide-in-from-left-10-8d90ea29; }
.slide-in-from-right-6 { animation-name: slide-in-from-right-6-8d90ea29; }
.duration-700 { animation-duration: .7s; }
.delay-150 { animation-delay: .15s; }
.delay-200 { animation-delay: .2s; }
.delay-300 { animation-delay: .3s; }
.delay-500 { animation-delay: .5s; }

/* ========== Biz CTA Button Gradient ========== */
.biz-cta-btn {
  background: linear-gradient(135deg, hsl(var(--accent)), hsl(var(--accent-hover)), hsl(var(--primary)));
  box-shadow: 0 4px 15px hsl(var(--accent) / 0.35);
  transition: all 0.3s ease;
  padding-left: 2.5rem !important;
  padding-right: 2.5rem !important;
}
.biz-cta-btn:hover {
  background: linear-gradient(135deg, hsl(var(--primary)), hsl(var(--accent-hover)), hsl(var(--accent)));
  box-shadow: 0 6px 20px hsl(var(--accent) / 0.45);
}

/* ========== Element-specific Overrides ========== */
#id52j {
  background-image: url("https://spark-builder.s3.cn-north-1.amazonaws.com.cn/image/2026/3/23/fcb0ace6-fb5d-4090-972f-aa0591389947.jpeg");
  background-position: center center;
  background-size: cover;
}

#iepu6k { animation-delay: 200ms; }
#i85re8 { animation-delay: 300ms; }
#i42mz1 { animation-delay: 400ms; }

#ivemlx, #iuoggj, #i7odmn, #i4d3ft, #i31jhn, #igdn9u,
#ispq1n, #iiq6mq, #ilfzcq, #i0b7nb, #inne1i, #i2don6,
#iyb87j, #iqcgau, #ia6n91, #iibuz2, #i18q77, #i7j1e4,
#ixlqzk, #inl7mf, #ieydik, #icaoij, #ipbsh2, #iuolyx,
#ibgq1q, #iospca, #irlfoh, #iqr8eb {
  color: hsl(var(--primary));
}

#iooslo, #ix6d87 {
  flex-flow: row;
}

/* ========== Mobile Drawer ========== */
.seo-drawer {
  position: fixed;
  inset: 0;
  z-index: 40;
  pointer-events: none;
}
.seo-drawer-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.4);
  opacity: 0;
  transition: opacity .25s ease;
}
.seo-drawer-panel {
  position: absolute;
  top: 0;
  right: 0;
  width: 80%;
  max-width: 320px;
  height: 100%;
  background: hsl(var(--background, 0 0% 100%));
  box-shadow: -4px 0 24px rgba(0,0,0,.12);
  transform: translateX(100%);
  transition: transform .3s cubic-bezier(.4,0,.2,1);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding-top: 70px;
}
.seo-drawer.is-open { pointer-events: auto; }
.seo-drawer.is-open .seo-drawer-backdrop { opacity: 1; }
.seo-drawer.is-open .seo-drawer-panel { transform: translateX(0); }

/* ==========================================================
   MOBILE LAYOUT — max-width: 767px (md breakpoint)
   ========================================================== */
@media (max-width: 767px) {

  /* --- Global --- */
  .page-container {
    padding-left: 1rem;
    padding-right: 1rem;
  }
  .page-body {
    padding: 1.25rem 0;
  }

  /* --- Header Logo --- */
  header img[alt="Logo"] {
    max-height: 40px !important;
    width: auto !important;
    height: auto !important;
  }

  /* --- Hero Section --- */
  main > section:first-child {
    min-height: 0 !important;
  }
  main > section:first-child .space-y-8 {
    gap: 1.25rem;
  }
  main > section:first-child h1 {
    font-size: 2rem;
    line-height: 1.15;
  }
  main > section:first-child h1 br {
    display: none;
  }
  main > section:first-child .text-xl {
    font-size: 0.9375rem;
    line-height: 1.5;
  }
  main > section:first-child .grid-cols-3 {
    gap: 0.75rem;
    padding-top: 1rem;
  }
  main > section:first-child .grid-cols-3 .text-3xl {
    font-size: 1.375rem;
  }
  main > section:first-child .grid-cols-3 .text-sm {
    font-size: 0.6875rem;
  }
  main > section:first-child .flex-wrap.gap-4 {
    gap: 0.5rem;
    padding-top: 0.5rem;
  }
  main > section:first-child .flex-wrap.gap-4 button,
  main > section:first-child .flex-wrap.gap-4 a {
    height: 2.5rem;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    font-size: 0.8125rem;
  }
  main > section:first-child .inline-flex.rounded-full {
    padding: 0.375rem 0.75rem;
  }
  main > section:first-child .inline-flex.rounded-full .text-sm {
    font-size: 0.75rem;
  }
  main > section:first-child .py-12 {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }

  /* --- Business Cards: 2-col grid on mobile --- */
  main > section:nth-child(2) .grid.grid-cols-1 {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 0.75rem;
  }
  main > section:nth-child(2) .card-hover-lift {
    padding: 0.5rem;
    gap: 0.5rem;
  }
  main > section:nth-child(2) .card-hover-lift .aspect-video {
    margin-bottom: 0;
  }
  main > section:nth-child(2) .card-hover-lift .text-item-title {
    font-size: 0.8125rem;
    line-height: 1.3;
  }
  main > section:nth-child(2) .card-hover-lift .text-caption {
    display: none;
  }
  main > section:nth-child(2) .card-hover-lift .mt-auto {
    font-size: 0.75rem;
  }
  main > section:nth-child(2) .card-hover-lift .mt-auto svg {
    width: 12px;
    height: 12px;
  }
  main > section:nth-child(2) h2 {
    font-size: 1.375rem;
  }
  main > section:nth-child(2) h2 + div.h-1\.5 {
    margin-top: 0.25rem;
  }
  main > section:nth-child(2) .text-muted-foreground.text-sm {
    font-size: 0.8125rem;
  }
  main > section:nth-child(2) .mt-12 {
    margin-top: 1.5rem;
  }
  main > section:nth-child(2) .mt-12 a {
    padding: 0.625rem 1.25rem;
    font-size: 0.875rem;
  }

  /* --- Case Showcase: 2-col on mobile --- */
  .grid.grid-cols-1.md\:grid-cols-2.lg\:grid-cols-2.xl\:grid-cols-4 {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 0.75rem;
  }
  .text-2xl.font-extrabold {
    font-size: 0.9375rem;
    line-height: 1.3;
    margin-bottom: 0.375rem;
  }
  .card-padding {
    padding: 0.625rem;
  }
  .p-6.pt-0.card-padding {
    padding: 0.625rem;
    padding-top: 0;
  }
  .space-y-2\.5 {
    gap: 0.25rem;
  }
  .mt-5.pt-4.border-t-2 {
    margin-top: 0.5rem;
    padding-top: 0.5rem;
    font-size: 0.75rem;
  }
  .mt-5.pt-4.border-t-2 svg {
    width: 14px;
    height: 14px;
  }
  .inline-flex.rounded-full.text-xs {
    font-size: 0.625rem;
    padding: 0.125rem 0.375rem;
  }

  /* --- CTA Banners --- */
  .rounded-2xl.bg-gradient-to-r {
    padding: 1.25rem;
    border-radius: 0.75rem;
  }
  .rounded-2xl.bg-gradient-to-r h3 {
    font-size: 1.25rem;
    margin-bottom: 0.5rem;
  }
  .rounded-2xl.bg-gradient-to-r .text-lg {
    font-size: 0.875rem;
    margin-bottom: 1rem;
  }
  .rounded-2xl.bg-gradient-to-r a[class*="px-8"] {
    padding: 0.5rem 1.25rem;
    font-size: 0.8125rem;
  }
  .rounded-2xl.bg-gradient-to-br {
    padding: 1.25rem;
    border-radius: 0.75rem;
  }
  .rounded-2xl.bg-gradient-to-br h2 {
    font-size: 1.5rem;
    line-height: 1.2;
    margin-bottom: 0.5rem;
  }
  .rounded-2xl.bg-gradient-to-br .text-lg {
    font-size: 0.875rem;
    margin-bottom: 1rem;
  }
  .rounded-2xl.bg-gradient-to-br .inline-flex.rounded-full {
    margin-bottom: 0.75rem;
    padding: 0.25rem 0.75rem;
  }
  .rounded-2xl.bg-gradient-to-br a[class*="px-8"] {
    padding: 0.625rem 1.25rem;
    font-size: 0.8125rem;
  }
  .rounded-2xl .mt-12 {
    margin-top: 1.5rem;
    padding-top: 1rem;
  }
  .rounded-2xl .gap-8 {
    gap: 1rem;
  }

  /* --- Why Choose Us Cards --- */
  .group.p-8 {
    padding: 1rem;
  }
  .group.p-8 h3 {
    font-size: 1rem;
    margin-bottom: 0.375rem;
  }
  .group.p-8 .w-14 {
    width: 2.5rem;
    height: 2.5rem;
    margin-bottom: 0.75rem;
  }
  .group.p-8 .w-14 svg {
    width: 20px;
    height: 20px;
  }
  .group.p-8 .text-muted-foreground {
    font-size: 0.8125rem;
    margin-bottom: 0.75rem;
  }
  .text-center.mb-12 h2 {
    font-size: 1.375rem;
    margin-bottom: 0.5rem;
  }
  .text-center.mb-12 .text-lg {
    font-size: 0.875rem;
  }
  .mb-16 {
    margin-bottom: 2rem;
  }

  /* --- Generic page template --- */
  .page-container.py-16 {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
  .page-container.py-16 h1 {
    font-size: 1.5rem;
    margin-bottom: 1rem;
  }

  /* --- Section headers --- */
  .mb-8.sm\:mb-10 {
    margin-bottom: 1rem;
  }

  /* --- Business Item Detail Page --- */
  .biz-item-bottom-bar + footer {
    padding-bottom: 4.5rem;
  }
  .biz-item-bottom-bar {
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }
  /* Biz detail hero */
  .min-h-\[280px\] {
    min-height: 200px;
  }
  .min-h-\[280px\] h1 {
    font-size: 1.5rem;
    line-height: 1.2;
  }
  .min-h-\[280px\] .text-lg {
    font-size: 0.8125rem;
  }
  .min-h-\[280px\] .flex-wrap.items-center a {
    height: 2.5rem;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    font-size: 0.8125rem;
  }
  .min-h-\[280px\] nav {
    margin-bottom: 0.5rem;
    font-size: 0.75rem;
  }
  .min-h-\[280px\] .inline-flex.rounded-full {
    padding: 0.25rem 0.625rem;
    font-size: 0.6875rem;
  }
  .min-h-\[280px\] .space-y-4 {
    gap: 0.625rem;
  }
  /* Biz detail content section heading */
  .flex.items-center.gap-3.mb-8 {
    margin-bottom: 1.25rem;
  }
  .flex.items-center.gap-3.mb-8 h2 {
    font-size: 1.125rem;
  }
  .flex.items-center.gap-3.mb-8 .w-1 {
    height: 1.25rem;
  }
  /* Biz detail CTA banner */
  .rounded-2xl.bg-gradient-to-r h2 {
    font-size: 1.125rem;
  }
  .rounded-2xl.bg-gradient-to-r .text-base {
    font-size: 0.75rem;
  }
  .rounded-2xl.bg-gradient-to-r .flex-wrap.items-center.gap-4 {
    gap: 0.5rem;
  }
  .rounded-2xl.bg-gradient-to-r .flex-wrap .text-sm {
    font-size: 0.6875rem;
  }
  .rounded-2xl.bg-gradient-to-r .h-14 {
    height: 3rem;
    padding-left: 2rem;
    padding-right: 2rem;
    font-size: 0.9375rem;
  }
  /* Biz other cards */
  .biz-other-card {
    border-radius: 0.625rem;
  }
  .biz-other-card .p-3 {
    padding: 0.5rem;
  }
  .biz-other-card h3 {
    font-size: 0.8125rem;
    line-height: 1.3;
  }
  .biz-other-card .text-xs.font-medium {
    font-size: 0.6875rem;
    padding-top: 0.125rem;
  }
  .biz-other-card .aspect-\[4\/3\] {
    aspect-ratio: 16/10;
  }
  /* Biz other section heading */
  section.bg-muted\/20 .text-2xl {
    font-size: 1.25rem;
  }
  section.bg-muted\/20 .text-sm.max-w-lg {
    font-size: 0.75rem;
    display: none;
  }
  section.bg-muted\/20 .mb-10 {
    margin-bottom: 1.25rem;
  }

  /* --- Footer --- */
  footer.bg-muted {
    padding-top: 1.5rem;
    padding-bottom: 1rem;
  }
  footer .grid.gap-12 {
    gap: 1.5rem;
    margin-bottom: 1.5rem;
  }
  footer .lg\:col-span-2 .text-2xl {
    font-size: 1.25rem;
  }
  footer .lg\:col-span-2 .text-sm {
    font-size: 0.8125rem;
  }
  footer .lg\:col-span-2 .flex.gap-4 {
    gap: 0.5rem;
  }
  footer .lg\:col-span-2 .flex.gap-4 a {
    width: 2.25rem;
    height: 2.25rem;
  }
  footer .lg\:col-span-2 .flex.gap-4 svg {
    width: 16px;
    height: 16px;
  }
  /* Footer link columns: 3-col row under brand */
  footer > .page-container > .grid.grid-cols-1 {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr);
  }
  footer > .page-container > .grid.grid-cols-1 > .lg\:col-span-2 {
    grid-column: 1 / -1;
  }
  footer .space-y-6 h4 {
    font-size: 0.6875rem;
    margin-bottom: 0.25rem;
  }
  footer .space-y-6 ul {
    gap: 0.375rem;
  }
  footer .space-y-6 ul .text-sm {
    font-size: 0.75rem;
  }
  footer .space-y-6 {
    gap: 0.5rem;
  }
  /* Footer contact info card */
  footer .rounded-xl.bg-background {
    padding: 0.75rem;
    margin-bottom: 1rem;
  }
  footer .rounded-xl.bg-background .grid {
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
  }
  footer .rounded-xl.bg-background .text-sm .font-medium {
    font-size: 0.75rem;
  }
  footer .rounded-xl.bg-background .text-sm .text-muted-foreground {
    font-size: 0.6875rem;
  }
  footer .rounded-xl.bg-background svg {
    width: 14px;
    height: 14px;
  }
  /* Footer copyright */
  footer .pt-8 {
    padding-top: 0.75rem;
  }
  footer .pt-8 .text-sm {
    font-size: 0.6875rem;
  }
}