/* =========================================================
   TOURNESOL SPA - CUSTOM STYLES & FIXES
   ========================================================= */

/* --- 1. 强制高对比度菜单栏：深色背景 + 白色文字 --- */
.wsmainfull.menu { background-color: #2c2c2c !important; border-bottom: 2px solid #d9a400; }
.desktoplogo h3 { margin-top: 15px; font-family: 'Lustria', serif; color: #ffffff !important; letter-spacing: 1px; }

/* --- 2. 移动端弹出菜单的底色修复 --- */
.wsmenu, .wsmenu-list { background-color: #2c2c2c !important; } 
.wsmenu-list li { border-bottom: 1px solid #444 !important; }
.wsmenu-list li a { color: #ffffff !important; font-weight: 500; font-size: 1.1rem; }
.wsmenu-list li a:hover { background-color: #1a1a1a !important; color: #d9a400 !important; }

/* --- 3. 移动端顶部 Header 颜色 --- */
.wsmobileheader { background-color: #2c2c2c !important; border-bottom: 2px solid #d9a400; }
.wsanimated-arrow span, .wsanimated-arrow span:before, .wsanimated-arrow span:after { background-color: #ffffff !important; }
.smllogo h3 { font-family: 'Lustria', serif; color: #ffffff !important; margin: 12px 0 0 15px; font-size: 1.4rem; letter-spacing: 1px; }

/* --- 4. 电话按钮样式 --- */
.header-phone a { color: #ffffff !important; }
.header-phone span { background-color: #d9a400 !important; color: #fff !important; }

/* --- 5. 首页封面区样式 --- */
.hero-section { 
    position: relative; 
    padding: 200px 0; 
    /* 注意这里的路径使用了 ../ 返回上一级目录 */
    background: url('../images/closeup-masseur-doing-back-massag-an-attractive-ma-2026-01-11-10-39-04-utc.jpg') center/cover no-repeat; 
}
.hero-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.6); z-index: 1; }
.hero-content { position: relative; z-index: 2; }

/* --- 6. 按摩项目卡片样式 --- */
.sbox-3 { 
    background: #fff; 
    border-radius: 8px; 
    box-shadow: 0 5px 15px rgba(0,0,0,0.08); 
    padding: 0; 
    margin-bottom: 30px; 
    overflow: hidden; 
    transition: transform 0.3s; 
}
.sbox-3:hover { transform: translateY(-5px); }
/* 使用 object-fit: cover 确保图片在容器内按比例裁剪，绝对不会变形拉伸 */
.sbox-3 img { 
    width: 100%; 
    height: 250px; 
    object-fit: cover; 
} 
.sbox-3-txt { padding: 25px; }
.sbox-3-txt h5 { color: #333; font-weight: bold; margin-bottom: 15px; }


/* =========================================================
   MOBILE RESPONSIVE FIXES (手机端图片及排版修复)
   ========================================================= */
@media (max-width: 768px) {
    /* 修复1：缩小手机端封面的高度，防止背景图由于屏幕过窄而严重裁剪 */
    .hero-section {
        padding: 120px 0 !important;
    }
    .hero-content h2 {
        font-size: 2.5rem !important;
    }
    .hero-content p {
        font-size: 1.1rem !important;
    }
    
    /* 修复2：手机端卡片图片高度适当降低，避免屏幕占比太大 */
    .sbox-3 img {
        height: 200px; 
    }
    
    /* 修复3：强制所有正文里的图片自适应宽度，绝不溢出屏幕 */
    img.img-fluid, img.rounded {
        max-width: 100% !important;
        height: auto !important;
    }
}