/* =========================================================
   广东吉诺装饰工程有限公司 - 现代版样式 (Jino Modern)
   基于原模板结构升级：卡片化 / 圆角 / 阴影 / 深色导航
   ========================================================= */
:root{
    --brand:#009DA0;
    --brand-dark:#007d80;
    --brand-light:#e6f5f5;
    --dark:#0f1c24;
    --dark-2:#16262f;
    --text:#2c3e4f;
    --text-light:#7a8b99;
    --bg:#ffffff;
    --bg-gray:#f4f7f8;
    --gold:#c8a45c;
    --radius:14px;
    --shadow:0 10px 30px rgba(15,28,36,.08);
    --shadow-hover:0 18px 40px rgba(0,157,160,.18);
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{font-family:"Microsoft YaHei","PingFang SC","Helvetica Neue",Arial,sans-serif;color:var(--text);background:#fff;font-size:15px;line-height:1.7;-webkit-font-smoothing:antialiased;}
img{max-width:100%;border:0;}
a{text-decoration:none;color:inherit;transition:all .25s ease;}
ul{list-style:none;margin:0;padding:0;}
.f-cb:after{content:"";display:block;clear:both;}
.clearfixed{clear:both;}
.view{max-width:1240px;margin:0 auto;padding:0 20px;}

/* ============ 顶部导航 ============ */
header{
    position:fixed;top:0;left:0;right:0;z-index:999;
    display:flex;align-items:center;justify-content:space-between;
    padding:14px 4%;
    background:linear-gradient(180deg,rgba(10,20,28,.85),rgba(10,20,28,.55));
    backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
    transition:all .3s ease;
}
header.cur{background:rgba(10,20,28,.96);box-shadow:0 4px 20px rgba(0,0,0,.25);padding:10px 4%;}
header .logo{display:flex;align-items:center;}
header .logo img{height:46px;width:auto;display:block;}
.pc-nav ul{display:flex;align-items:center;gap:6px;}
.pc-nav li a.tit{
    display:block;padding:10px 18px;color:#e8eef2;font-size:15px;letter-spacing:1px;
    border-radius:8px;position:relative;
}
.pc-nav li a.tit:after{
    content:"";position:absolute;left:50%;bottom:4px;width:0;height:2px;
    background:var(--brand);transform:translateX(-50%);transition:width .3s ease;border-radius:2px;
}
.pc-nav li:hover a.tit:after,.pc-nav li.cur a.tit:after{width:60%;}
.pc-nav li:hover a.tit,.pc-nav li.cur a.tit{color:#fff;background:rgba(255,255,255,.08);}
.header-right{display:flex;align-items:center;gap:14px;}
.header-right .item.en{
    color:#fff;font-size:14px;padding:9px 18px;border:1px solid rgba(255,255,255,.35);
    border-radius:30px;background:rgba(255,255,255,.06);white-space:nowrap;
}
.header-right .item.en:hover{border-color:var(--brand);background:var(--brand);}
.header-right .navbtn{display:none;}
/* 移动端导航 */
.m-nav{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(10,20,28,.97);z-index:998;padding-top:90px;}
.m-nav ul{padding:20px 8%;}
.m-nav li a.tit{display:block;padding:16px 10px;color:#dfe8ee;font-size:17px;border-bottom:1px solid rgba(255,255,255,.08);}
.m-nav li a.tit:hover{color:var(--brand);}

/* ============ Banner ============ */
.banner-box{position:relative;width:100%;}
.pc-banner{display:block;width:100%;height:100vh;min-height:620px;overflow:hidden;}
.banner,.banner .page-wrapper,.banner .item{width:100%;height:100%;}
.banner .item{background-size:cover;background-position:center;position:relative;}
.banner .item a.block{position:absolute;inset:0;display:block;}
.banner-text{
    position:absolute;top:50%;left:8%;transform:translateY(-50%);z-index:6;
    max-width:620px;color:#fff;text-shadow:0 2px 14px rgba(0,0,0,.45);
}
.banner-text .bt-en{font-size:13px;letter-spacing:4px;color:#bfe9ea;text-transform:uppercase;margin:0 0 14px;}
.banner-text h2{font-size:46px;font-weight:800;margin:0 0 16px;line-height:1.25;letter-spacing:2px;}
.banner-text .bt-slogan{font-size:17px;color:#e8f4f4;margin:0 0 30px;letter-spacing:1px;}
.banner-text .bt-btn{
    display:inline-block;padding:13px 38px;margin-right:14px;border-radius:30px;
    background:linear-gradient(135deg,var(--brand),var(--brand-dark));color:#fff;font-size:15px;font-weight:600;
    box-shadow:0 10px 26px rgba(0,157,160,.45);text-shadow:none;
}
.banner-text .bt-btn:hover{transform:translateY(-2px);}
.banner-text .bt-btn.ghost{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.6);box-shadow:none;backdrop-filter:blur(4px);}
.banner-text .bt-btn.ghost:hover{background:rgba(255,255,255,.25);}
.pc-banner .btns{position:absolute;bottom:8%;left:50%;transform:translateX(-50%);display:flex;gap:10px;z-index:5;}
.pc-banner .btns .dot{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.45);cursor:pointer;transition:all .3s;}
.pc-banner .btns .dot.cur{background:var(--brand);width:26px;border-radius:6px;}
.m-banner{display:none;}

/* ============ 快捷入口 (ban-link) ============ */
.ban-link-box{
    position:relative;z-index:20;margin-top:-64px;
}
.ban-link{
    background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);
    padding:18px 10px;
}
.ban-link .swiper-wrapper{display:flex;justify-content:center;}
.ban-link .swiper-slide{width:auto;flex:none;padding:0 6px;}
.ban-link .con-box{
    display:flex;align-items:center;gap:12px;padding:14px 26px;border-radius:10px;
    transition:all .3s ease;cursor:pointer;
}
.ban-link .con-box:hover{background:var(--brand-light);}
.ban-link .icon img{width:30px;height:30px;display:block;}
.ban-link .txt{font-size:15px;color:var(--text);font-weight:600;white-space:nowrap;}

/* ============ 首页三大业务 ============ */
.i-col-box{padding:60px 0 20px;}
.col-wrap .swiper-wrapper{display:flex;gap:28px;}
.col-wrap .swiper-slide{
    flex:1;background:#fff;border-radius:var(--radius);overflow:hidden;
    box-shadow:var(--shadow);transition:all .35s ease;border:1px solid #eef2f4;
}
.col-wrap .swiper-slide:hover{transform:translateY(-8px);box-shadow:var(--shadow-hover);}
.col-wrap .swiper-slide .img{display:block;overflow:hidden;}
.col-wrap .swiper-slide .img img{width:100%;height:230px;object-fit:cover;display:block;transition:transform .5s ease;}
.col-wrap .swiper-slide:hover .img img{transform:scale(1.06);}
.col-wrap .swiper-slide .text{display:block;padding:22px 24px 6px;}
.col-wrap .swiper-slide .text .en{font-size:12px;color:var(--brand);letter-spacing:3px;text-transform:uppercase;font-weight:700;}
.col-wrap .swiper-slide .text .cn{font-size:21px;color:var(--dark);font-weight:700;margin:6px 0;}
.col-wrap .swiper-slide .text .desc{font-size:13.5px;color:var(--text-light);line-height:1.8;}
.col-wrap .swiper-slide .more{display:inline-block;margin:16px 24px 24px;padding:8px 22px;border:1px solid var(--brand);color:var(--brand);border-radius:30px;font-size:13px;}
.col-wrap .swiper-slide .more:hover{background:var(--brand);color:#fff;}

/* ============ 通用标题区 ============ */
.pub-tit{padding:50px 0 10px;}
.pub-tit .tit-box{text-align:center;}
.pub-tit .tit-box .cn{display:block;font-size:30px;font-weight:800;color:var(--dark);letter-spacing:2px;}
.pub-tit .tit-box .en{display:block;font-size:13px;color:var(--brand);letter-spacing:5px;text-transform:uppercase;margin-top:6px;font-weight:600;}
.pub-tit .tit-box .line{width:52px;height:3px;background:linear-gradient(90deg,var(--brand),var(--gold));border-radius:3px;margin:14px auto 0;}

/* ============ 首页案例轮播 ============ */
.index-tab-box{position:relative;padding:20px 0 40px;}
.index-tab .swiper-slide{
    width:25%;padding:12px;background:transparent;
}
.index-tab .swiper-slide a{display:block;border-radius:12px;overflow:hidden;box-shadow:var(--shadow);background:#fff;}
.index-tab .swiper-slide a img{width:100%;height:200px;object-fit:cover;display:block;transition:transform .5s ease;}
.index-tab .swiper-slide a:hover img{transform:scale(1.07);}
.index-tab .swiper-slide span{display:block;padding:13px 16px;font-size:14px;color:var(--text);font-weight:600;background:#fff;border-top:1px solid #f0f3f5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.index-tab-box .prev,.index-tab-box .next{
    position:absolute;top:50%;transform:translateY(-50%);width:46px;height:46px;border-radius:50%;
    background:#fff;box-shadow:var(--shadow);cursor:pointer;z-index:5;
    background-image:url(../img/index-prev.png);background-repeat:no-repeat;background-position:center;
}
.index-tab-box .next{right:2%;background-image:url(../img/index-next.png);}
.index-tab-box .prev{left:2%;}

/* ============ 首页关于我们 ============ */
.about-index{background:var(--bg-gray);padding:60px 0;}
.about-index .pub-tit{padding:0 0 30px;}
.about-index .img{float:left;width:47%;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);}
.about-index .img img{width:100%;display:block;}
.about-index .text{float:right;width:49%;padding-top:6px;}
.about-index .text .t1{font-size:26px;color:var(--dark);font-weight:800;margin-bottom:8px;}
.about-index .text .t2{font-size:15px;color:var(--brand);font-weight:600;margin-bottom:18px;letter-spacing:1px;}
.about-index .text p{line-height:2;color:#5a6b78;font-size:14.5px;margin-bottom:12px;text-indent:2em;}
.about-index .more-btn{
    display:inline-block;margin-top:10px;padding:12px 36px;background:linear-gradient(135deg,var(--brand),var(--brand-dark));
    color:#fff;border-radius:30px;font-size:14px;font-weight:600;box-shadow:0 8px 20px rgba(0,157,160,.3);
}
.about-index .more-btn:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(0,157,160,.4);}

/* ============ 内页 Banner ============ */
.sub-banner-box{position:relative;}
.sub-banner{position:relative;height:340px;overflow:hidden;}
.sub-banner img{width:100%;height:100%;object-fit:cover;}
.sub-banner:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,20,28,.35),rgba(10,20,28,.55));}
.sub-banner .text-box{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.5);}
.sub-banner .text-box .cn{font-size:38px;font-weight:800;letter-spacing:4px;margin:0 0 8px;}
.sub-banner .text-box .en{font-size:14px;letter-spacing:6px;color:#bfe9ea;text-transform:uppercase;margin:0;}
.sub-nav{
    position:relative;z-index:5;background:#fff;box-shadow:0 4px 16px rgba(15,28,36,.08);
    display:flex;justify-content:center;padding:0;
}
.sub-nav .swiper-wrapper{display:flex;justify-content:center;}
.sub-nav .swiper-slide{width:auto;flex:none;}
.sub-nav .swiper-slide a.tit{
    display:block;padding:16px 30px;font-size:15px;color:var(--text-light);font-weight:600;
    border-bottom:3px solid transparent;transition:all .25s;
}
.sub-nav .swiper-slide a.tit:hover{color:var(--brand);}
.sub-nav .swiper-slide a.tit.cur{color:var(--brand);border-bottom-color:var(--brand);}

/* ============ 内页内容区 ============ */
.source-box{padding:10px 0 60px;}
.source-box .list li{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);padding:34px 40px;margin-bottom:30px;}
.source-box .list li .pub-tit{padding:0 0 20px;}
.source-box .list li .pub-tit .tit-box{text-align:left;}
.source-box .list li .pub-tit .line{margin:12px 0 0;}
.source-box .list li:nth-child(2n) .pub-tit .tit-box{text-align:right;}
.source-box .list li:nth-child(2n) .pub-tit .line{margin:12px 0 0 auto;}
.con-wrap .text{float:left;width:58%;}
.con-wrap .img{float:right;width:38%;border-radius:12px;overflow:hidden;box-shadow:var(--shadow);}
.con-wrap .img img{width:100%;display:block;}
.con-wrap .text .con p{line-height:2.05;color:#4e5f6c;font-size:14.5px;margin:0 0 14px;}
.con-wrap .text .con p strong{color:var(--dark);}
.source-box .list li:nth-child(2n) .con-wrap .text{float:right;width:58%;}
.source-box .list li:nth-child(2n) .con-wrap .img{float:left;width:38%;}

/* ============ 案例网格 ============ */
.case-grid{padding:10px 0 40px;}
.case-grid .case-item{
    float:left;width:23.5%;margin:0 0.75% 24px;background:#fff;border-radius:12px;overflow:hidden;
    box-shadow:var(--shadow);transition:all .3s ease;border:1px solid #eef2f4;
}
.case-grid .case-item:hover{transform:translateY(-6px);box-shadow:var(--shadow-hover);}
.case-grid .case-item img{width:100%;height:190px;object-fit:cover;display:block;transition:transform .5s;}
.case-grid .case-item:hover img{transform:scale(1.06);}
.case-grid .case-tit{padding:14px 16px 4px;font-size:15px;color:var(--dark);font-weight:700;}
.case-grid .case-desc{padding:0 16px 18px;font-size:12.5px;color:var(--text-light);line-height:1.8;}

/* ============ 新闻列表 ============ */
.news-list{padding:10px 0 40px;}
.news-list li{
    padding:18px 22px;margin-bottom:12px;background:#fff;border-radius:10px;box-shadow:0 4px 14px rgba(15,28,36,.05);
    transition:all .25s;border-left:4px solid transparent;
}
.news-list li:hover{border-left-color:var(--brand);transform:translateX(4px);box-shadow:var(--shadow);}
.news-list .news-date{float:right;color:var(--text-light);font-size:13px;background:var(--bg-gray);padding:2px 12px;border-radius:20px;}
.news-list .news-tit{float:left;font-size:15px;color:var(--text);max-width:72%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:500;}
.news-list .news-tit:hover{color:var(--brand);}

/* ============ 联系我们 ============ */
.contact-box{padding:10px 0 40px;}
.contact-info{float:left;width:54%;}
.contact-info .info-item{
    padding:20px 26px;margin-bottom:16px;background:#fff;border-radius:12px;
    box-shadow:var(--shadow);border-left:4px solid var(--brand);transition:all .25s;
}
.contact-info .info-item:hover{transform:translateX(4px);}
.contact-info .info-label{font-size:13px;color:var(--text-light);margin-bottom:6px;letter-spacing:1px;}
.contact-info .info-value{font-size:18px;color:var(--dark);font-weight:700;}
.contact-img{float:right;width:42%;border-radius:12px;overflow:hidden;box-shadow:var(--shadow);}
.contact-img img{width:100%;display:block;}

/* ============ 页脚 ============ */
footer{background:linear-gradient(180deg,var(--dark-2),var(--dark));color:#9fb0bc;margin-top:40px;}
footer .view{padding-top:40px;}
.f-nav{display:flex;justify-content:center;padding-bottom:26px;border-bottom:1px solid rgba(255,255,255,.08);}
.f-nav ul{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;}
.f-nav li a.tit{display:block;padding:10px 20px;color:#cfdbe3;font-size:15px;border-radius:8px;}
.f-nav li a.tit:hover{color:var(--brand);}
.f-nav li .sub a{display:inline-block;margin:6px 8px;color:#7e929f;font-size:13px;}
.f-nav li .sub a:hover{color:var(--brand);}
.footer-bottom{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;padding:24px 0 30px;}
.link-box .tit{color:#e8eef2;font-size:16px;font-weight:700;display:block;margin-bottom:6px;}
.link-box .sub a{color:#7e929f;font-size:13px;margin-right:16px;}
.link-box .sub a:hover{color:var(--brand);}
.copy-box{text-align:right;}
.copy-box .copy{display:block;font-size:13px;color:#7e929f;}
.copy-box .build{display:block;font-size:13px;color:#6b7f8c;margin-top:6px;}
.copy-box .build a{color:var(--brand);}

/* ============ 响应式 ============ */
@media (max-width:1024px){
    .pc-nav{display:none;}
    .header-right .navbtn{display:block;}
    .header-right .navbtn .line-box{width:26px;}
    .header-right .navbtn .line{display:block;height:2px;background:#fff;margin:5px 0;border-radius:2px;}
    .pc-banner{height:70vh;min-height:460px;}
    .ban-link-box{margin-top:-44px;}
    .ban-link .con-box{padding:10px 16px;}
    .col-wrap{flex-wrap:wrap;}
    .col-wrap .swiper-slide{flex:1 1 46%;}
    .index-tab .swiper-slide{width:33.33%;}
    .case-grid .case-item{width:48.5%;margin:0 0.75% 18px;}
}
@media (max-width:767px){
    .view{padding:0 14px;}
    header .logo img{height:38px;}
    .m-nav{display:none;}
    .pc-banner{display:none;}
    .m-banner{display:block;height:240px;overflow:hidden;}
    .m-banner .swiper-slide img{width:100%;height:240px;object-fit:cover;}
    .m-banner .btns{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);display:flex;gap:8px;z-index:5;}
    .m-banner .btns span{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.5);}
    .m-banner .btns span.swiper-active-switch{background:var(--brand);}
    .banner-box{position:relative;}
    .ban-link-box{margin-top:0;padding:14px;}
    .ban-link{padding:10px;overflow-x:auto;}
    .i-col-box{padding:30px 0 10px;}
    .col-wrap .swiper-slide{flex:1 1 100%;}
    .col-wrap .swiper-slide .img img{height:190px;}
    .pub-tit{padding:34px 0 6px;}
    .pub-tit .tit-box .cn{font-size:24px;}
    .index-tab .swiper-slide{width:50%;}
    .index-tab .swiper-slide a img{height:150px;}
    .about-index{padding:34px 0;}
    .about-index .img,.about-index .text{float:none;width:100%;}
    .about-index .text{margin-top:20px;}
    .sub-banner{height:200px;}
    .sub-nav .swiper-slide a.tit{padding:12px 16px;font-size:13.5px;}
    .source-box .list li{padding:22px 18px;}
    .source-box .list li .pub-tit .tit-box,.source-box .list li:nth-child(2n) .pub-tit .tit-box{text-align:left;}
    .source-box .list li:nth-child(2n) .pub-tit .line{margin:12px 0 0;}
    .con-wrap .text,.con-wrap .img,.source-box .list li:nth-child(2n) .con-wrap .text,.source-box .list li:nth-child(2n) .con-wrap .img{float:none;width:100%;}
    .con-wrap .img{margin-top:16px;}
    .case-grid .case-item{width:100%;margin:0 0 16px;}
    .case-grid .case-item img{height:auto;}
    .news-list .news-date{display:none;}
    .news-list .news-tit{float:none;max-width:100%;white-space:normal;}
    .contact-info,.contact-img{float:none;width:100%;}
    .contact-img{margin-top:20px;}
    .footer-bottom{flex-direction:column;text-align:center;}
    .copy-box{text-align:center;}
}

/* FAQ */
.faq-list{padding:10px 0 40px;}
.faq-item{background:#fff;border-radius:12px;box-shadow:0 4px 14px rgba(15,28,36,.05);padding:18px 24px;margin-bottom:12px;border-left:4px solid var(--brand);transition:all .25s;}
.faq-item:hover{box-shadow:var(--shadow);transform:translateX(4px);}
.faq-q{font-size:15.5px;font-weight:700;color:var(--dark);margin:0 0 8px;}
.faq-a{font-size:14px;color:#5a6b78;line-height:1.9;margin:0;}
@media (max-width:767px){.faq-item{padding:14px 16px;}}