@charset "utf-8";
/*
 * new_smart.css — 智慧楼宇解决方案系列（智慧商业写字楼等 6 个子页面）共用样式
 * 严格按 Figma 还原。主色 #e60027 / 文字 #333。.so- 前缀。桌面 + 移动端。
 */
.so-main{ font-family:"Source Han Sans SC","Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif; color:#333; overflow:hidden; -webkit-font-smoothing:antialiased; }
.so-main *{ box-sizing:border-box; }
.so-wrap{ width:100%; max-width:1315px; margin:0 auto; padding:0 20px; }
.so-main .so-red{ display:inline !important; color:#e60027; }

/* 去掉站点导航激活项底部的白色下三角(Figma 无此元素) */
.MMGlobalNaviStyle.Current a,
.MMGlobalNaviStyle.Current.MMSetMenu a{ background-image:none !important; }

/* 通用区块标题 */
.so-sec-head{ position:relative; z-index:1; text-align:center; padding:clamp(50px,7vw,100px) 20px 0; }
/* 站点全局会给部分标题/容器叠加白色下三角(bg_g_navi_current.gif)，浅色区块看不见、深色区块会露出，统一去除 */
.so-main .so-sec-head, .so-main .so-sec-title{ background-image:none !important; }
.so-main .so-sec-head::before, .so-main .so-sec-head::after,
.so-main .so-sec-title::before, .so-main .so-sec-title::after{ content:none !important; display:none !important; background-image:none !important; }
.so-sec-title{ margin:0; font-size:clamp(26px,3.4vw,44px); font-weight:700; line-height:1.3; color:#333; }
.so-sec-title--center{ text-align:center; }
.so-sec-sub{ margin:clamp(10px,1.4vw,15px) 0 0; font-size:clamp(13px,1.3vw,18px); font-weight:400; color:#333; letter-spacing:.5em; padding-left:.5em; }

/* 通用红色按钮（!important 压过站点 a 的 color !important）*/
.so-btn-red{ display:inline-flex; align-items:center; gap:8px; padding:13px 24px; background:#e60027; font-size:14px; border-radius:2px; text-decoration:none; line-height:1; transition:background .2s; }
.so-main a.so-btn-red, .so-main a.so-btn-red:link, .so-main a.so-btn-red:visited,
.so-main a.so-banner__btn, .so-main a.so-banner__btn:link, .so-main a.so-banner__btn:visited{ color:#fff !important; }
.so-btn-red:hover{ background:#b1000e; }
.so-btn-red svg{ width:14px; height:14px; }

/* ============ 1. Banner ============ */
.so-banner{ position:relative; height:clamp(440px,41.6vw,800px); display:flex; align-items:center; justify-content:center; text-align:center; background:url(../images/smart-office/banner.jpg) center/cover no-repeat; }
.so-banner::before{ content:""; position:absolute; inset:0; background:rgba(0,0,0,.12); }
.so-banner__inner{ position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; gap:clamp(30px,5vw,60px); padding:0 20px; }
.so-banner__title{ margin:0; font-size:clamp(30px,4.6vw,64px); font-weight:700; line-height:1.35; color:#fff; text-shadow:0 4px 20px rgba(0,0,0,.5); }
.so-banner__sub{ margin:clamp(14px,2vw,20px) 0 0; font-size:clamp(15px,1.7vw,24px); font-weight:700; color:#fff; text-shadow:0 2px 12px rgba(0,0,0,.5); }
.so-banner__btn{ display:inline-flex; align-items:center; gap:8px; padding:13px 26px; background:#e60027; color:#fff; font-size:16px; text-decoration:none; border-radius:2px; transition:background .2s; }
.so-banner__btn:hover{ background:#b1000e; color:#fff; }
.so-banner__btn svg{ width:14px; height:14px; }

/* ============ 2. 痛点 ============ */
.so-pain{ background:#f7f7f7; padding-bottom:clamp(50px,7vw,90px); }
.so-pain__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(16px,1.7vw,25px); margin-top:clamp(36px,4.5vw,60px); }
/* 卡片数非 3 的倍数时（如 5 张）末行居中 */
.so-pain__grid--center{ display:flex; flex-wrap:wrap; justify-content:center; }
.so-pain__grid--center .so-pain__card{ flex:0 0 calc((100% - 2 * clamp(16px,1.7vw,25px)) / 3); }
.so-pain__card{ background:rgba(255,255,255,.95); border-radius:2px; padding:15px; }
.so-pain__head{ display:flex; align-items:flex-end; justify-content:space-between; gap:10px; padding:0 8px; }
.so-pain__icon{ flex:none; width:clamp(54px,5vw,64px); }
.so-pain__icon img{ width:100%; height:auto; display:block; }
.so-pain__name{ margin:0; font-size:clamp(17px,1.6vw,24px); font-weight:700; color:#333; text-align:right; }
.so-pain__list{ list-style:none; margin:25px 0 0; padding:clamp(16px,1.6vw,22px); background:#f8f8f8; }
.so-pain__list li{ position:relative; padding-left:16px; margin-bottom:12px; font-size:14px; color:#333; line-height:1.5; }
.so-pain__list li:last-child{ margin-bottom:0; }
.so-pain__list li::before{ content:""; position:absolute; left:2px; top:8px; width:4px; height:4px; border-radius:50%; background:#333; }

/* ============ 3/4. 方案（Tab）============ */
.so-sol{ position:relative; padding-bottom:clamp(50px,7vw,100px); background:#eef1f5; }
.so-sol--access{ background:linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,255,255,.5),rgba(255,255,255,.6)), url(../images/smart-office/bg-access.jpg) center/cover no-repeat; }
.so-sol--space{ background:linear-gradient(180deg,rgba(255,255,255,.35),rgba(255,255,255,.7)), url(../images/smart-office/bg-space.jpg) center/cover no-repeat; }
.so-sol__card{ position:relative; z-index:1; margin-top:clamp(30px,4vw,56px); background:rgba(255,255,255,.85); -webkit-backdrop-filter:blur(20px); backdrop-filter:blur(20px); border-radius:16px; box-shadow:0 30px 70px rgba(0,0,0,.06); padding:clamp(24px,3vw,50px) clamp(24px,3.5vw,60px) clamp(30px,4vw,60px); }
.so-tabs{ display:flex; justify-content:space-between; gap:15px; flex-wrap:wrap; border-bottom:1px solid rgba(0,0,0,.15); }
.so-tab{ position:relative; background:none; border:none; cursor:pointer; font-family:inherit; font-size:clamp(15px,1.4vw,20px); font-weight:400; color:#333; padding:0 4px 28px; line-height:1.4; transition:color .2s, font-weight .2s; }
.so-tab::after{ content:""; position:absolute; left:0; right:0; bottom:-1px; height:3px; background:#e60027; transform:scaleX(0); transition:transform .25s; }
.so-tab.is-active{ font-weight:700; }
.so-tab.is-active::after{ transform:scaleX(1); }
.so-sol__body{ display:flex; align-items:center; gap:clamp(30px,4vw,70px); margin-top:clamp(30px,4vw,60px); }
.so-sol__text{ flex:1 1 0; min-width:0; }
.so-sol__h{ margin:0; font-size:clamp(22px,2.2vw,30px); font-weight:700; color:#333; }
.so-sol__d{ margin:clamp(16px,2vw,26px) 0 clamp(30px,5vw,80px); font-size:clamp(14px,1.1vw,16px); color:#555; line-height:1.9; }
.so-sol__img{ flex:0 0 46%; max-width:46%; }
.so-sol__img img{ width:100%; height:auto; display:block; border-radius:10px; }

/* ============ 5/6. 机器人 / 全域平台 ============ */
.so-feature{ position:relative; padding-bottom:clamp(50px,7vw,100px); background:#eef1f5; }
.so-feature--robot{ background:linear-gradient(180deg,rgba(240,242,245,.7),rgba(240,242,245,.85)), url(../images/smart-office/bg-robot.jpg) center/cover no-repeat; }
.so-feature--platform{ background:linear-gradient(180deg,rgba(255,255,255,.3),rgba(255,255,255,.8)), url(../images/smart-office/bg-platform.jpg) center/cover no-repeat; }
.so-feature__card{ position:relative; z-index:1; margin-top:clamp(30px,4vw,56px); background:rgba(255,255,255,.6); border-radius:16px; box-shadow:0 30px 70px rgba(0,0,0,.05); padding:clamp(24px,3vw,40px); display:flex; align-items:center; }
.so-feature__img{ flex:0 0 56%; max-width:56%; }
.so-feature__img img{ width:100%; height:auto; display:block; border-radius:16px; }
.so-feature__info{ flex:1 1 0; min-width:0; background:#fff; border-radius:16px; padding:clamp(24px,2.6vw,40px); margin-left:clamp(-60px,-4vw,-20px); box-shadow:0 20px 50px rgba(0,0,0,.06); }
.so-feature__d{ margin:0; font-size:clamp(14px,1.1vw,16px); color:#333; line-height:1.9; }
.so-feature__icons{ display:flex; gap:clamp(10px,1.4vw,20px); margin:clamp(24px,3vw,40px) 0; }
.so-feat{ flex:1 1 0; display:flex; flex-direction:column; align-items:center; gap:12px; text-align:center; }
.so-feat__ic{ width:clamp(64px,6vw,90px); }
.so-feat__ic img{ width:100%; height:auto; display:block; }
.so-feat span{ font-size:13px; color:#333; line-height:1.4; }
.so-feature__info .so-btn-red{ float:right; }

/* ============ 7. 服务承诺 ============ */
.so-service{ position:relative; padding-bottom:clamp(50px,7vw,100px); background:radial-gradient(120% 80% at 50% 0%, #ffffff 0%, #eef5fc 45%, #e2edf9 100%); }
.so-service__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(16px,2vw,30px); margin-top:clamp(30px,4vw,50px); }
.so-service__card{ position:relative; z-index:1; overflow:hidden; border-radius:6px; background:linear-gradient(180deg,rgba(255,255,255,.5) 0%,rgba(255,255,255,.15) 100%); border:1px solid rgba(255,255,255,.7); padding:clamp(28px,3vw,44px); min-height:clamp(300px,26vw,420px); }
.so-service__top{ display:flex; align-items:center; justify-content:space-between; gap:12px; }
.so-service__top h3{ margin:0; font-size:clamp(20px,1.9vw,26px); font-weight:700; color:#333; }
.so-service__ic{ flex:none; width:56px; height:56px; }
.so-service__ic img{ width:100%; height:100%; display:block; object-fit:contain; }
.so-service__line{ height:1px; background:rgba(0,0,0,.1); margin:clamp(20px,2.4vw,34px) 0; }
.so-service__card p{ margin:0; font-size:14px; color:#666; line-height:1.8; position:relative; z-index:1; }
.so-service__wm{ position:absolute; left:clamp(14px,2.5vw,36px); bottom:0; width:clamp(150px,20vw,240px); pointer-events:none; }
.so-service__wm img{ width:100%; height:auto; display:block; }

/* ============ 8. 精品案例（轮播）============ */
.so-cases{ background:#fafafa; padding-bottom:clamp(50px,7vw,100px); }
.so-cases__swiper{ position:relative; margin-top:clamp(30px,4vw,56px); border-radius:10px; overflow:hidden; }
.so-cases__slide{ position:relative; }
.so-cases__slide img{ width:100%; height:clamp(300px,33vw,640px); object-fit:cover; display:block; }
.so-cases__slide::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,0) 55%,rgba(0,0,0,.7) 100%); }
.so-cases__cap{ position:absolute; left:0; right:0; bottom:clamp(30px,5vw,72px); z-index:1; color:#fff; font-size:clamp(18px,2vw,32px); font-weight:700; text-align:center; padding:0 20px; }
.so-cases__nav{ position:absolute; top:50%; transform:translateY(-50%); z-index:2; width:48px; height:75px; border:none; padding:0; color:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background .2s; margin:0; }
/* .so-main 前缀压过站点全局 button 背景重置 */
.so-main .so-cases__prev{ background:rgba(0,0,0,.13); left:0; }
.so-main .so-cases__next{ background:#e60027; right:0; }
.so-main .so-cases__prev:hover{ background:rgba(0,0,0,.3); }
.so-main .so-cases__next:hover{ background:#b1000e; }
.so-cases__nav svg{ width:24px; height:24px; }
.so-cases__dots{ display:flex; justify-content:center; gap:10px; margin-top:clamp(20px,2.4vw,34px); }
.so-cases__dots .swiper-pagination-bullet{ width:12px; height:12px; border-radius:50%; background:rgba(0,0,0,.2); opacity:1; margin:0; transition:background .2s; }
.so-cases__dots .swiper-pagination-bullet-active{ background:#e60027; }

/* ============ 响应式 ============ */
@media screen and (max-width:1024px){
    .so-feature__card{ flex-direction:column; }
    .so-feature__img,.so-feature__info{ flex:none; max-width:100%; width:100%; }
    .so-feature__info{ margin-left:0; margin-top:-40px; }
}
@media screen and (max-width:768px){
    .so-pain__grid{ grid-template-columns:1fr; }
    .so-sol__body{ flex-direction:column; align-items:stretch; }
    .so-sol__img{ flex:none; max-width:100%; order:-1; }
    .so-sol__d{ margin-bottom:24px; }
    .so-tabs{ justify-content:flex-start; gap:18px; overflow-x:auto; -webkit-overflow-scrolling:touch; flex-wrap:nowrap; }
    .so-tab{ white-space:nowrap; padding-bottom:18px; }
    .so-service__grid{ grid-template-columns:1fr; }
    .so-feat span{ font-size:12px; }
    .so-feature__icons{ flex-wrap:wrap; }
    .so-feat{ flex:1 1 40%; }
}