/**
 * ADA / WCAG 2.1 AA Contrast - 全站强制达标，所有页面生效
 * - 浅色背景：深色文字 #222 / #333（≥4.5:1）
 * - 深色背景：浅色文字 #fff / #f0f0f0 + 阴影
 * - 按钮/表头：深色底 + 白字
 */

/* ========== Skip link & focus ========== */
.skip-link {
  position: absolute;
  top: -100px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10000;
  padding: 12px 24px;
  background: #222;
  color: #fff;
  font-weight: 600;
  border-radius: 4px;
  transition: top 0.2s ease;
}
.skip-link:focus {
  top: 16px;
  outline: 3px solid #d4af37;
  outline-offset: 2px;
}

a:focus-visible,
button:focus-visible,
[tabindex]:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid #d4af37;
  outline-offset: 2px;
}

@media (max-width: 768px) {
  .btncta, .btn-notice, #openmenu, #closemenu, #scroll-top,
  .header-menu a, .mobile-menu a {
    min-height: 44px;
    min-width: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  .header-menu a, .mobile-menu a { padding: 12px 16px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* ========== 1. 首屏 / 导航（深色背景或图片）========== */
.wrapper-header-content .suptitle,
.wrapper-header-content .header-content .suptitle,
.header-content h1,
.wrapper-header-content h1 {
  color: #fff !important;
  text-shadow: 0 1px 2px rgba(0,0,0,0.9), 0 2px 4px rgba(0,0,0,0.7), 0 0 8px rgba(0,0,0,0.5);
}
.wrapper-header-content .btncta,
.header-content .btncta {
  color: #fff !important;
  text-shadow: 0 1px 3px rgba(0,0,0,0.9), 0 2px 6px rgba(0,0,0,0.7);
  background-color: #6d3028 !important;
}
.wrapper-header-content .btncta:hover,
.header-content .btncta:hover {
  background-color: #5a2822 !important;
}
#header .header-menu > li > a {
  color: #fff !important;
  text-shadow: 0 1px 3px rgba(0,0,0,0.95), 0 2px 6px rgba(0,0,0,0.8), 0 0 8px rgba(0,0,0,0.4);
  font-weight: 600;
}
.btn-notice {
  color: #fff !important;
  text-shadow: 0 1px 2px rgba(0,0,0,0.7), 0 2px 4px rgba(0,0,0,0.5);
  background-color: #5c4a0f !important;
}
.btn-notice:hover {
  background-color: #4a3d0d !important;
}

/* ========== 2. 浅色背景区块：所有文字强制深色（全站统一）========== */
#aboutus,
#aboutus .aboutus-content,
#aboutus .aboutus-img,
#services,
#services .wrapper-services,
#sale .sale-content,
#pricing,
#pricing .align-center,
#gallery,
#gallery .wrapper-title,
#gallery .container-t {
  --a11y-text: #222;
  --a11y-text-soft: #333;
}
#aboutus .suptitle,
#aboutus h2,
#aboutus h3,
#aboutus p,
#aboutus .wrapper-list li,
#aboutus .wrapper-list li p,
#aboutus .wrapper-list h3,
#services .suptitle,
#services h2,
#services .single-service,
#services .single-service-content p,
#services .single-service-content h3,
#services .single-service h3,
#sale .suptitle,
#sale .sale-content h2,
#sale .sale-content p,
#pricing .suptitle,
#pricing h2,
#pricing .container-t .s-t,
#pricing .container-t table td,
#pricing .container-t table th,
#gallery .suptitle,
#gallery h2,
#gallery .wrapper-title .suptitle,
#gallery .wrapper-title h2 {
  color: #222 !important;
}
#aboutus p,
#aboutus .wrapper-list li p,
#services .single-service-content p,
#sale .sale-content p {
  color: #333 !important;
}
/* 表头保持白字深底 */
#pricing .container-t table th,
.container-t table th {
  background-color: #b85a4a !important;
  color: #fff !important;
}
#pricing .container-t table td,
.container-t table td {
  color: #222 !important;
}

/* 通用：所有带 .wrapper-title / .align-center 的标题（浅色区）*/
#pricing .align-center .suptitle,
#pricing .align-center h2,
#services .align-center .suptitle,
#services .align-center h2 {
  color: #222 !important;
}

/* ========== 3. 价目表（add-t 已改，此处再次强制）========== */
.container-t {
  background-color: #fff;
}
.container-t .s-t,
.container-t table td {
  color: #222 !important;
}
.container-t table th {
  background-color: #b85a4a !important;
  color: #fff !important;
}
table th { background-color: #b85a4a !important; color: #fff !important; }
table td { color: #222 !important; }

/* ========== 4. Testimonials 深色背景：浅色文字 ========== */
#testimonials,
#testimonials .container,
#testimonials .wrapper-testimonials {
  background-color: #2a2a2a;
}
#testimonials .suptitle,
#testimonials h2,
#testimonials .single-testimonials p,
#testimonials .wrapper-author h3,
#testimonials .wrapper-author p {
  color: #f0f0f0 !important;
  text-shadow: 0 1px 2px rgba(0,0,0,0.3);
}
#testimonials .wrapper-author p {
  color: #e8d4d0 !important;
}

/* ========== 5. Footer 深色背景 ========== */
footer,
.wrapper-footer,
.single-content-footer p,
.wrapper-copyright p,
.wrapper-copyright a,
.footer-social a {
  color: #f5f5f5 !important;
}
.footer-social a:hover {
  color: #efa697 !important;
}
.wrapper-footer h4,
.single-content-footer h4 {
  color: #fff !important;
}
.single-content-footer p a {
  color: #fff !important;
}

/* ========== 6. 所有按钮（全站）========== */
.btn,
#scroll-top.btn,
.btncta {
  background-color: #b85a4a !important;
  color: #fff !important;
}
.btn:hover,
#scroll-top.btn:hover {
  background-color: #a04d3e !important;
  color: #fff !important;
}

/* ========== 7. 其他可能出现在浅色背景上的元素 ========== */
.single-pricing,
.single-pricing h3,
.single-pricing p,
.single-pricing .price {
  color: #222 !important;
}
.rating i {
  color: #b8860b !important;
}
.wrapper-list li h3 {
  color: #222 !important;
}
.wrapper-list li p {
  color: #333 !important;
}

/* 主内容区默认文字（兜底）*/
#main-content .wrapper-aboutus,
#main-content .wrapper-services,
#main-content .wrapper-sale,
#main-content .wrapper-title {
  color: #222;
}
#main-content p,
#main-content li {
  color: #333;
}
#main-content .suptitle:not(.wrapper-header-content .suptitle):not(#testimonials .suptitle) {
  color: #222 !important;
}
#main-content h2:not(#testimonials h2) {
  color: #222 !important;
}
#main-content h3:not(#testimonials h3):not(#testimonials .wrapper-author h3) {
  color: #222 !important;
}

/* ========== 8. 移动菜单、灯箱 ========== */
/* 移动端导航：深色背景 + 白字，满足 WCAG AA ≥4.5:1（修复 9 个对比度错误） */
#mobile-nav {
  background-color: #8b4539 !important;
}
#mobile-nav .mobile-menu a,
#mobile-nav #closemenu {
  color: #fff !important;
}
#mobile-nav .mobile-menu a:hover,
#mobile-nav #closemenu:hover {
  color: #f5d0c8 !important;
}
#mobile-nav .mobile-menu .sub-menu li a {
  color: #fff !important;
}
.lightbox .close-btn,
.lightbox .prev,
.lightbox .next {
  color: #fff !important;
  background-color: rgba(0,0,0,0.6) !important;
}