/* home.css - extracted from blade templates */

/* === home/index.blade.php === */
.hostTabHead{overflow:auto;zoom:1;margin:0;padding:0;}
.hostTabHead li{width:324px;float:left;cursor:pointer;list-style:none;}
.hostTabBody{background:#fff;}
.hostTabBody .hostDetailContain{display:none;padding:37px 0 27px;}
.hostTabBody .hostDetailContain.active{display:block;}
.hostTabBody .product-row{overflow:auto;zoom:1;}
.hostTabBody .product-row .inner{width:33.333%;float:left;border-right:1px solid #e5e5e5;box-sizing:border-box;}
.hostTabBody .product-row .inner:last-child{border-right:none;}
.hostTabBody .configList{text-align:center;}
.hostTabBody .configList p{display:inline-block;float:none;vertical-align:top;width:auto;padding:0 12px;border-right:1px solid #f1f1f1;box-sizing:border-box;}
.hostTabBody .configList p:last-child{border-right:none;}
.hostTabBody .configList span{font-size:14px;white-space:nowrap;}
.hostListUlContain .priceBuy a{transition:background .2s;}
.hostListUlContain .priceBuy a:hover{background:#e06600;}
.hostListUlContain .checkDetailBtn{transition:background .2s,color .2s;}
.hostListUlContain .checkDetailBtn:hover{background:#aaa;color:#fff;}
.hostListUlContain .current .checkDetailBtn:hover{background:#0d7ec5;}
.hostLeftWrap{overflow:hidden;}
.hostTabBody .checkDetailA{margin-bottom:5px;}
.hostTabBody .priceBuy{text-align:center;margin:20px 0;height:auto;}
.hostTabBody .priceBuy font{font-size:46px;}
.hostTabBody .priceBuy span{margin-left:5px;}
.hostTabBody .buyBtn{background:#ff7200;color:#fff;margin-bottom:10px;}
.hostTabBody .buyBtn:hover{background:#e06600;}
.banner.banner0{height:auto;min-height:576px;background:url(/template_images/banner/banner0.jpg) no-repeat center center;background-size:cover;margin-top:-101px;display:flex;align-items:center}
.banner0 a{display:flex;align-items:center;min-height:576px;width:100%}
.banner0 .bannerLeft{float:none;margin:0;opacity:1;padding:101px 0 0 0}
.banner0 .bannerLeft .title{font-size:44px;color:#fff;font-weight:800;line-height:1.3;letter-spacing:1px;margin:0;animation:heroFadeUp .8s ease-out both}
.banner0 .bannerLeft .hero-line{animation:heroLine .6s .5s ease-out both}
.banner0 .bannerLeft .hero-tags{animation:heroFadeUp .8s .6s ease-out both}
@media(max-width:1300px){.banner.banner0{min-height:456px}.banner0 a{min-height:456px}.banner0 .bannerLeft .title{font-size:34px}}
@media(max-width:768px){.banner.banner0{min-height:360px}.banner0 a{min-height:360px}.banner0 .bannerLeft{padding-top:110px;margin-top:0}.banner0 .bannerLeft .title{font-size:28px}}
/* ===== 统一Hero风格 ===== */
@keyframes heroFadeUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}
@keyframes heroLine{from{width:0}to{width:60px}}
.hero-line{display:block;height:3px;width:60px;background:linear-gradient(90deg,rgba(255,255,255,.8),transparent);margin:18px 0 14px;animation:heroLine .6s .5s ease-out both}
.hero-tags{display:flex;gap:10px;margin-top:22px;flex-wrap:wrap}
.hero-tag{display:inline-flex;align-items:center;gap:6px;padding:6px 16px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);border-radius:20px;font-size:12px;color:rgba(255,255,255,.8);backdrop-filter:blur(4px)}
.hero-tag svg{opacity:.7}

.serviceContain .domainList{display:flex;flex-wrap:wrap;justify-content:center;}

/* 产品卡片4列适配 */
.domainService li{width:25%;box-sizing:border-box}
.domainService li:last-child{border-right:none}

/* 第4个产品卡片：成品网站 */
.doTenSite{background:url(/template_images/doTenSiteBg.jpg) no-repeat center center;}
.doTenSite .title{margin:45px 0 0 113px;}
.doTenSite .desc{margin:80px 0 0 115px;}