/* ===== 自定义类 ===== */
.content-auto{content-visibility:auto;}
.text-shadow-glow{text-shadow:0 0 15px rgba(21,101,192,0.3),0 0 30px rgba(30,136,229,0.2);}
.card-shadow{box-shadow:0 2px 12px rgba(0,0,0,0.08);}
.btn-glow{box-shadow:0 4px 15px rgba(21,101,192,0.3);}
.gradient-bg{background:linear-gradient(-45deg,#1565C0,#1E88E5,#0D47A1,#1565C0);background-size:400% 400%;}
.transition-custom{transition: all 0.3s ease;}
.star-yellow{color:#1E88E5;}
.mobile-menu{transition:transform 0.3s ease;}

/* ===== 自定义颜色 ===== */
.bg-navy{background-color:#0a1929;}
.text-accent{color:#1E88E5;}
.border-blue-800{border-color:#1e40af;}
.bg-green-500{background-color:#22c55e;}
.hover\:bg-green-600:hover{background-color:#16a34a;}
.bg-lightBg{background-color:#f5f7fa;}
.bg-lightCard{background-color:#ffffff;}
.bg-gray-50{background-color:#f9fafb;}
.bg-primary{background-color:#0052CC;}
.bg-secondary{background-color:#0066FF;}
.bg-white{background-color:#ffffff;}
.bg-black\/50{background-color:rgba(0,0,0,0.5);}
.bg-primary\/10{background-color:rgba(0,82,204,0.1);}
.text-darkText{color:#1a1a1a;}
.text-grayText{color:#666666;}
.text-primary{color:#0052CC;}
.text-white{color:#ffffff;}
.text-gray-300{color:#d1d5db;}
.text-gray-500{color:#6b7280;}
.text-gray-600{color:#4b5563;}
.text-gray-700{color:#374151;}
.text-gray-800{color:#1f2937;}
.text-yellow-400{color:#facc15;}
.border-gray-100{border-color:#f3f4f6;}
.border-gray-200{border-color:#e5e7eb;}
.border-primary{border-color:#0052CC;}

/* ===== 布局定位 ===== */
.fixed{position:fixed;}
.relative{position:relative;}
.absolute{position:absolute;}
.top-0{top:0;}
.right-0{right:0;}
.bottom-0{bottom:0;}
.left-0{left:0;}
.inset-0{top:0;right:0;bottom:0;left:0;}
.top-1\/2{top:50%;}
.left-1\/2{left:50%;}
.right-4{right:1rem;}
.bottom-20{bottom:5rem;}
.z-\[55\]{z-index:55;}
.z-\[60\]{z-index:60;}
.z-\[900\]{z-index:900;}
.z-\[999\]{z-index:999;}
.z-\[800\]{z-index:800;}
.z-10{z-index:10;}
.block{display:block;}
.hidden{display:none;}
.flex{display:flex;}
.inline-flex{display:inline-flex;}
.grid{display:grid;}
.inline-block{display:inline-block;}
.flex-col{flex-direction:column;}
.flex-wrap{flex-wrap:wrap;}
.items-center{align-items:center;}
.items-start{align-items:flex-start;}
.items-stretch{align-items:stretch;}
.justify-center{justify-content:center;}
.justify-between{justify-content:space-between;}
.flex-shrink-0{flex-shrink:0;}
.cursor-pointer{cursor:pointer;}
.overflow-hidden{overflow:hidden;}
.overflow-x-auto{overflow-x:auto;}
.object-cover{object-fit:cover;}

/* ===== 尺寸 ===== */
.w-full{width:100%;}
.w-72{width:18rem;}
.w-12{width:3rem;}
.w-10{width:2.5rem;}
.w-16{width:4rem;}
.w-8{width:2rem;}
.min-w-full{min-width:100%;}
.h-full{height:100%;}
.h-12{height:3rem;}
.h-10{height:2.5rem;}
.h-16{height:4rem;}
.h-8{height:2rem;}
.h-48{height:12rem;}
.h-\[350px\]{height:350px;}
.h-\[576px\]{height:576px;}
.min-h-\[60px\]{min-height:60px;}

/* ===== 间距 ===== */
.p-4{padding:1rem;}
.p-5{padding:1.25rem;}
.p-6{padding:1.5rem;}
.p-8{padding:2rem;}
.px-3{padding-left:0.75rem;padding-right:0.75rem;}
.px-4{padding-left:1rem;padding-right:1rem;}
.px-6{padding-left:1.5rem;padding-right:1.5rem;}
.py-1{padding-top:0.25rem;padding-bottom:0.25rem;}
.py-2{padding-top:0.5rem;padding-bottom:0.5rem;}
.py-3{padding-top:0.75rem;padding-bottom:0.75rem;}
.py-4{padding-top:1rem;padding-bottom:1rem;}
.py-5{padding-top:1.25rem;padding-bottom:1.25rem;}
.pt-1{padding-top:0.25rem;}
.pt-6{padding-top:1.5rem;}
.pb-4{padding-bottom:1rem;}
.mb-1{margin-bottom:0.25rem;}
.mb-2{margin-bottom:0.5rem;}
.mb-3{margin-bottom:0.75rem;}
.mb-4{margin-bottom:1rem;}
.mb-6{margin-bottom:1.5rem;}
.mb-8{margin-bottom:2rem;}
.mt-2{margin-top:0.5rem;}
.mt-3{margin-top:0.75rem;}
.mt-8{margin-top:2rem;}
.ml-2{margin-left:0.5rem;}
.mx-auto{margin-left:auto;margin-right:auto;}
.gap-1{gap:0.25rem;}
.gap-2{gap:0.5rem;}
.gap-3{gap:0.75rem;}
.gap-4{gap:1rem;}
.gap-6{gap:1.5rem;}
.gap-8{gap:2rem;}
.gap-x-3{column-gap:0.75rem;}
.gap-x-4{column-gap:1rem;}
.gap-y-2{row-gap:0.5rem;}
.gap-y-3{row-gap:0.75rem;}
.space-y-4 > * + *{margin-top:1rem;}
.space-y-5 > * + *{margin-top:1.25rem;}

/* ===== 网格 ===== */
.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr));}
.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr));}
.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr));}
.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr));}

/* ===== 文字 ===== */
.text-xs{font-size:0.75rem;line-height:1rem;}
.text-sm{font-size:0.875rem;line-height:1.25rem;}
.text-base{font-size:1rem;line-height:1.5rem;}
.text-lg{font-size:1.125rem;line-height:1.75rem;}
.text-xl{font-size:1.25rem;line-height:1.75rem;}
.text-2xl{font-size:1.5rem;line-height:2rem;}
.text-3xl{font-size:1.875rem;line-height:2.25rem;}
.font-medium{font-weight:500;}
.font-bold{font-weight:700;}
.text-center{text-align:center;}
.text-left{text-align:left;}
.text-right{text-align:right;}
.uppercase{text-transform:uppercase;}
.tracking-wider{letter-spacing:0.05em;}
.leading-relaxed{line-height:1.625;}
.font-sans{font-family:system-ui,-apple-system,sans-serif;}
.antialiased{-webkit-font-smoothing:antialiased;}

/* ===== 边框圆角 ===== */
.border{border-width:1px;}
.border-b{border-bottom-width:1px;}
.border-t{border-top-width:1px;}
.border-l-4{border-left-width:4px;}
.border-collapse{border-collapse:collapse;}
.rounded-lg{border-radius:0.5rem;}
.rounded-xl{border-radius:0.75rem;}
.rounded-full{border-radius:9999px;}

/* ===== 阴影 ===== */
.shadow-md{box-shadow:0 4px 6px -1px rgba(0,0,0,0.1),0 2px 4px -2px rgba(0,0,0,0.1);}
.shadow-lg{box-shadow:0 10px 15px -3px rgba(0,0,0,0.1),0 4px 6px -4px rgba(0,0,0,0.1);}
.shadow-2xl{box-shadow:0 25px 50px -12px rgba(0,0,0,0.25);}

/* ===== 变换 ===== */
.scale-105{transform:scale(1.05);}
.rotate-180{transform:rotate(180deg);}
.-translate-y-1{--tw-translate-y:-0.25rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y));}
.-translate-y-1\/2{--tw-translate-y:-50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y));}
.-translate-x-1\/2{--tw-translate-x:-50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y));}
.group:hover .group-hover\:scale-105{transform:scale(1.05);}

/* ===== 过渡动画 ===== */
.transition-all{transition-property:all;transition-timing-function:cubic-bezier(0.4,0,0.2,1);transition-duration:150ms;}
.transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(0.4,0,0.2,1);transition-duration:150ms;}
.duration-300{transition-duration:300ms;}

/* ===== 悬停效果 ===== */
.hover\:text-primary:hover{color:#0052CC;}
.hover\:text-accent:hover{color:#1E88E5;}
.hover\:bg-secondary:hover{background-color:#0066FF;}
.hover\:bg-gray-100:hover{background-color:#f3f4f6;}
.hover\:shadow-lg:hover{box-shadow:0 10px 15px -3px rgba(0,0,0,0.1),0 4px 6px -4px rgba(0,0,0,0.1);}
.hover\:scale-105:hover{transform:scale(1.05);}
.hover\:-translate-y-1:hover{--tw-translate-y:-0.25rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y));}

/* ===== 可见性 ===== */
.opacity-0{opacity:0;}
.opacity-100{opacity:1;}
.invisible{visibility:hidden;}
.visible{visibility:visible;}

/* ===== 容器 ===== */
.container{width:100%;margin-left:auto;margin-right:auto;}

/* ===== 渐变 ===== */
.bg-gradient-to-r{background-image:linear-gradient(to right,var(--tw-gradient-stops));}
.from-primary{--tw-gradient-from:#0052CC;--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,rgba(0,82,204,0));}
.to-secondary{--tw-gradient-to:#0066FF;}

/* ===== 伪元素 ===== */
.after\:content-\[\'\'\]::after{content:'';}
.after\:absolute::after{position:absolute;}
.after\:w-20::after{width:5rem;}
.after\:h-1::after{height:0.25rem;}
.after\:bg-gradient-to-r::after{background-image:linear-gradient(to right,var(--tw-gradient-stops));}
.after\:from-primary::after{--tw-gradient-from:#0052CC;--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,rgba(0,82,204,0));}
.after\:to-secondary::after{--tw-gradient-to:#0066FF;}
.after\:bottom-0::after{bottom:0;}
.after\:left-0::after{left:0;}
.after\:left-1\/2::after{left:50%;}
.after\:-translate-x-1\/2::after{--tw-translate-x:-50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y));}

/* ===== 表格 ===== */
.odd\:bg-white:nth-child(odd){background-color:#ffffff;}
.even\:bg-gray-50:nth-child(even){background-color:#f9fafb;}

/* ===== 响应式 md (>=768px) ===== */
@media (min-width:768px){
    .md\:hidden{display:none;}
    .md\:flex{display:flex;}
    .md\:items-center{align-items:center;}
    .md\:w-\[95\%\]{width:95%;}
    .md\:text-lg{font-size:1.125rem;line-height:1.75rem;}
    .md\:text-xl{font-size:1.25rem;line-height:1.75rem;}
    .md\:text-3xl{font-size:1.875rem;line-height:2.25rem;}
    .md\:py-3{padding-top:0.75rem;padding-bottom:0.75rem;}
    .md\:py-5{padding-top:1.25rem;padding-bottom:1.25rem;}
    .md\:p-8{padding:2rem;}
    .md\:mb-3{margin-bottom:0.75rem;}
    .md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr));}
    .md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr));}
    .md\:bottom-6{bottom:1.5rem;}
}

/* ===== 响应式 sm (>=640px) ===== */
@media (min-width:640px){
    .sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr));}
    .sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr));}
    .container{max-width:640px;}
}

/* ===== 响应式 lg (>=1024px) ===== */
@media (min-width:1024px){
    .lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr));}
    .lg\:grid-cols-6{grid-template-columns:repeat(6,minmax(0,1fr));}
    .container{max-width:1024px;}
}

/* ===== 响应式 container ===== */
@media (min-width:768px){.container{max-width:768px;}}
@media (min-width:1280px){.container{max-width:1280px;}}
@media (min-width:1536px){.container{max-width:1536px;}}

/* 客户评价区移动端单列显示（电脑端保持两列不变） */
@media (max-width: 767px) {
    .review-list { grid-template-columns: 1fr !important; }
    .review-list .text-grayText { overflow-wrap: anywhere; word-break: break-word; }
}

/* 装机实拍案例移动端单列显示（电脑端保持3列不变） */
@media (max-width: 767px) {
    .grid.grid-cols-3.gap-6 {
        grid-template-columns: 1fr !important;
    }
}