/* B-P0 extracted from index.html (block 9) */
#contact { background: #f8f9fa; color: #333; padding: 70px 0 50px; margin-top: 0; border-top: 1px solid #e9ecef; }
#contact .footer-wrap {
width: min(92%, 1080px) !important;
max-width: 1080px !important;
margin: 0 auto !important;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: flex-start;
gap: 2.5rem 3rem;
}
#contact .footer-left { flex: 1.5; min-width: 340px; }
#contact .footer-middle, #contact .footer-right { flex: 1; min-width: 240px; }
#contact .footer-logo { display: flex; align-items: center; margin-bottom: 28px; }
#contact .footer-logo h2 { color: #1a73e8; font-size: 30px; margin-left: 12px; }
#contact .footer-desc { color: #666; font-size: 17px; line-height: 1.75; margin-bottom: 28px; max-width: 480px; }
#contact .footer-contact { display: flex; flex-wrap: wrap; gap: 24px; font-size: 16px; color: #666; }
#contact .footer-contact span { display: flex; align-items: center; }
#contact .footer-contact i { color: #1a73e8; margin-right: 8px; font-size: 1.05em; }
#contact .footer-contact a { color: inherit; text-decoration: none; }
#contact .footer-contact a:hover { color: #1a73e8; }
#contact .footer-title {
font-size: 0.72rem !important;
margin-bottom: 14px !important;
font-weight: 600 !important;
letter-spacing: 0.16em;
text-transform: none;
color: #8a8178 !important;
}
#contact .footer-links { list-style: none; }
#contact .footer-links li { margin-bottom: 12px; }
#contact .footer-links a { color: #555; text-decoration: none; font-size: 15px; transition: 0.3s; }
#contact .footer-links a:hover { color: #111; }
#contact .footer-right { display: flex; flex-direction: column; align-items: center; text-align: center; min-width: 0; }
#contact .footer-follow-card {
display: flex;
flex-direction: column;
align-items: center;
width: 188px;
padding: 0;
box-sizing: border-box;
text-decoration: none;
color: inherit;
background: none;
border: none;
border-radius: 0;
box-shadow: none;
}
#contact .footer-follow-card .douyin-hover-card {
width: 148px !important;
height: 148px !important;
margin: 0.7rem auto 0;
}
/* 恢复原反转：默认闪电提示，悬停翻出二维码 */
#contact .douyin-hover-qr {
opacity: 0 !important;
}
#contact .douyin-hover-prompt {
opacity: 1 !important;
}
#contact .douyin-hover-card:hover .douyin-hover-prompt,
#contact .douyin-hover-card:focus-within .douyin-hover-prompt {
opacity: 0 !important;
}
#contact .douyin-hover-card:hover .douyin-hover-qr,
#contact .douyin-hover-card:focus-within .douyin-hover-qr {
opacity: 1 !important;
}
@media (hover: none) {
#contact .douyin-hover-qr { opacity: 1 !important; }
#contact .douyin-hover-prompt { opacity: 0 !important; }
}
#contact .footer-follow-kicker {
display: block;
width: 100%;
margin-top: 0;
margin-bottom: 0.15rem;
font-size: 11px;
letter-spacing: 0.2em;
color: #8a8178;
text-align: center;
}
#contact .footer-follow-id {
display: block;
width: 100%;
margin-top: 0;
font-size: 1.2rem;
font-weight: 700;
letter-spacing: 0.04em;
color: #111;
text-align: center;
white-space: nowrap;
}
#contact .footer-follow-name {
display: block;
width: 100%;
margin-top: 0.15rem;
font-size: 12px;
color: #9a9188;
text-align: center;
}
#contact .footer-copyright { width: 92%; max-width: 1400px; margin: 50px auto 0; padding-top: 28px; border-top: 1px solid #e9ecef; text-align: center; font-size: 15px; color: #999; }
#contact .footer-copyright a { color: #999; text-decoration: none; }
#contact .footer-copyright a:hover { color: #1a73e8; }
/* 竖屏 / 平板：品牌通栏，链接与关注卡并排 */
@media (max-width: 1100px) {
#contact .footer-wrap {
display: grid !important;
grid-template-columns: minmax(0, 1fr) 188px !important;
grid-template-areas:
"brand brand"
"links douyin";
column-gap: 1.75rem !important;
row-gap: 1.85rem !important;
align-items: start !important;
justify-content: stretch !important;
width: min(92%, 720px) !important;
max-width: 720px !important;
flex-wrap: unset !important;
flex-direction: unset !important;
}
#contact .footer-left,
#contact .footer-middle,
#contact .footer-right {
min-width: 0 !important;
max-width: none !important;
width: auto !important;
padding-left: 0 !important;
padding-right: 0 !important;
}
#contact .footer-left { grid-area: brand; text-align: left !important; }
#contact .footer-middle { grid-area: links; text-align: left !important; }
#contact .footer-right { grid-area: douyin; text-align: center !important; align-items: center !important; }
#contact .footer-logo { justify-content: flex-start !important; margin-left: 0 !important; margin-right: 0 !important; }
#contact .footer-logo h2 { margin-left: 0 !important; }
#contact .footer-desc { margin-left: 0 !important; margin-right: 0 !important; text-align: left !important; max-width: 36rem; }
#contact .footer-contact {
justify-content: flex-start !important;
text-align: left !important;
flex-direction: column;
flex-wrap: nowrap;
gap: 0.55rem !important;
}
#contact .footer-contact span { justify-content: flex-start !important; text-align: left !important; width: auto !important; }
#contact .footer-middle .footer-title { text-align: left !important; margin-bottom: 0.7rem !important; }
#contact .footer-links {
display: grid;
grid-template-columns: 1fr 1fr;
column-gap: 0.75rem;
row-gap: 0.45rem;
align-items: start;
padding: 0;
margin: 0;
}
#contact .footer-links li { margin-bottom: 0 !important; text-align: left; }
#contact .footer-follow-card { width: 188px; }
}
@media (max-width: 420px) {
#contact .footer-wrap {
grid-template-columns: 1fr !important;
grid-template-areas:
"brand"
"links"
"douyin";
width: min(92%, 24rem) !important;
}
#contact .footer-links { grid-template-columns: 1fr 1fr; }
#contact .footer-right {
justify-self: center;
width: 100% !important;
align-items: center !important;
}
}
@media (hover: none) {
#contact .footer-follow-card:hover {
transform: none;
box-shadow: 0 10px 28px rgba(17, 17, 17, 0.06);
}
}