/* Youxia homepage carousel. Content and images: admin > 首页 Banner. */
.hero-section.hero-section.hero-section{margin-top:-64px;padding:64px 0 0;background:#f0f8ff;color:#202632}
.hero-section.hero-section:after{display:none}
.hero-section.hero-section .container{width:min(1664px,calc(100% - 80px))}
.hero-section.hero-section .hero-bg{bottom:112px}
.hero-section.hero-section .hero-bg__image{object-fit:cover;object-position:center}
.hero-section.hero-section .hero-bg__scrim,.hero-section.hero-section .hero-bg__scrim--frosted{background:linear-gradient(90deg,rgba(245,250,255,.65),rgba(245,250,255,.18) 52%,transparent 75%);backdrop-filter:none;mask-image:none;-webkit-mask-image:none}
.hero-section.hero-section .hero-stage{grid-template-columns:232px minmax(0,1fr);column-gap:48px;min-height:452px;padding:32px 0 38px;align-items:center}
.hero-section.hero-section .hero-rail{gap:0;padding:0;border-right:1px solid #d7e1ef;align-self:center}
.hero-section.hero-section .hero-rail__item{border:0;border-right:2px solid transparent;border-radius:0;min-height:64px;padding:18px 24px 18px 16px;background:transparent;box-shadow:none;text-align:left;color:#202632;font-size:16px;white-space:normal}
.hero-section.hero-section .hero-rail__item.is-active{background:linear-gradient(90deg,transparent,#ffffffb8);border-right-color:#0052d9;color:#0052d9;box-shadow:none}
.hero-section.hero-section .hero-rail__item.is-active .hero-rail__label{color:#0052d9}
.hero-section.hero-section .hero-rail__arrow{display:none}
.hero-section.hero-section .hero-body{grid-column:2;grid-row:1;max-width:760px}
.hero-section.hero-section .hero-title{font-size:clamp(32px,3vw,48px);line-height:1.28;font-weight:600;letter-spacing:-.02em;color:#202632}
.hero-section.hero-section .hero-desc{margin-top:24px;max-width:510px;font-size:16px;line-height:1.9;color:#455368}
.hero-section.hero-section .hero-actions{margin-top:36px;gap:16px}
.hero-section.hero-section .hero-cta{height:48px;min-width:152px;border-radius:2px;font-size:16px}
.hero-section.hero-section .hero-cta--primary{background:#0052d9;border-color:#0052d9;box-shadow:none}
.hero-section.hero-section .hero-cta--secondary{background:#ffffffb3;color:#0052d9;border-color:#0052d9}
.hero-section.hero-section .hero-dots,.hero-section.hero-section .hero-mobile-nav{display:none}
.hero-section.hero-section .hero-feature-strip{grid-template-columns:repeat(5,minmax(0,1fr));margin-top:0;border:0;border-radius:0;box-shadow:none;min-height:112px;align-items:center;background:white}
.hero-section.hero-section .hero-feature{padding:16px 28px;border:0;border-left:1px solid #dfe8f4}
.hero-section.hero-section .hero-feature:first-child{border-left:0}
.hero-section.hero-section .hero-feature__kicker{font-size:13px;color:#65748b;letter-spacing:0}
.hero-section.hero-section .hero-feature__title{font-size:17px;color:#202632;margin-top:8px}
.hero-section.hero-section .hero-feature__desc{display:none}
.hero-section.hero-section button:focus-visible{outline:2px solid #0052d9;outline-offset:4px}
@media(max-width:1280px){.hero-section.hero-section .hero-stage{grid-template-columns:188px minmax(0,1fr);column-gap:32px}.hero-section.hero-section .hero-body{max-width:640px}.hero-section.hero-section .hero-title{font-size:38px}.hero-section.hero-section .hero-desc{max-width:470px}.hero-section.hero-section .hero-feature{padding:16px}}
@media(max-width:960px){.hero-section.hero-section .container{width:calc(100% - 40px)}.hero-section.hero-section .hero-bg{bottom:100px}.hero-section.hero-section .hero-stage{display:flex;flex-direction:column;gap:0;align-items:stretch;padding:20px 0 40px;min-height:450px}.hero-section.hero-section .hero-rail{display:flex;flex-direction:row;width:100%;overflow-x:auto;gap:22px;border:0;border-bottom:1px solid #d7e1ef;align-self:stretch;scrollbar-width:none}.hero-section.hero-section .hero-rail__item{flex:0 0 auto;padding:12px 0;min-height:48px;font-size:15px;border:0;border-bottom:2px solid transparent;border-radius:0;background:none}.hero-section.hero-section .hero-rail__item.is-active{background:none;border-right:0;border-bottom-color:#0052d9}.hero-section.hero-section .hero-body{max-width:620px;margin-top:38px;min-height:270px;width:100%}.hero-section.hero-section .hero-title{font-size:34px}.hero-section.hero-section .hero-desc{font-size:15px;max-width:430px;margin-top:20px}.hero-section.hero-section .hero-actions{margin-top:28px}.hero-section.hero-section .hero-feature-strip{display:flex;overflow-x:auto;min-height:100px;scroll-snap-type:x proximity}.hero-section.hero-section .hero-feature{flex:0 0 200px;border:0!important;border-left:1px solid #dfe8f4!important;scroll-snap-align:start;padding:12px 20px}.hero-section.hero-section .hero-feature__title{font-size:16px}}
@media(max-width:540px){.hero-section.hero-section .container{width:calc(100% - 32px)}.hero-section.hero-section .hero-stage{padding-bottom:28px;min-height:466px}.hero-section.hero-section .hero-bg__image{object-position:64% center}.hero-section.hero-section .hero-bg__scrim,.hero-section.hero-section .hero-bg__scrim--frosted{background:linear-gradient(90deg,#f5faffee,#f5faffba 65%,#f5faff59)}.hero-section.hero-section .hero-body{margin-top:34px;min-height:300px}.hero-section.hero-section .hero-title{font-size:30px;line-height:1.4;letter-spacing:0;max-width:100%;overflow-wrap:anywhere}.hero-section.hero-section .hero-desc{font-size:15px;line-height:1.85;max-width:100%}.hero-section.hero-section .hero-actions{gap:12px;flex-wrap:wrap;margin-top:28px}.hero-section.hero-section .hero-cta{min-width:136px;height:44px;font-size:15px}.hero-section.hero-section .hero-feature{flex-basis:184px}}
@media(prefers-reduced-motion:reduce){.hero-section.hero-section *{animation:none!important;transition:none!important}}

/* Tencent-style compact mobile banner; large video remains desktop only. */
@media(max-width:768px){
.hero-section.hero-section .hero-rail{display:none}
.hero-section.hero-section .container{width:calc(100% - 32px)}
.hero-section.hero-section .hero-bg{height:364px;bottom:auto}
.hero-section.hero-section .hero-bg__image{object-fit:cover;object-position:center}
.hero-section.hero-section .hero-bg__scrim,.hero-section.hero-section .hero-bg__scrim--frosted{background:linear-gradient(90deg,#f5faffb3,#f5faff66 55%,#f5faff1a)}
.hero-section.hero-section .hero-stage{position:relative;display:block;min-height:300px;height:300px;padding:24px 0 68px}
.hero-section.hero-section .hero-body{display:block;min-height:0;height:auto;margin:0;padding:0;overflow:hidden}
.hero-section.hero-section .hero-title{font-size:26px;line-height:1.35;font-weight:600;max-width:100%;letter-spacing:0}
.hero-section.hero-section .hero-desc{margin:14px 0 0;font-size:14px;line-height:1.65;max-width:100%;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.hero-section.hero-section .hero-actions{margin-top:22px;gap:12px;flex-wrap:nowrap}
.hero-section.hero-section .hero-cta{height:40px;min-width:0;padding:0 16px;font-size:14px;flex:0 1 auto}
.hero-section.hero-section .hero-dots{position:absolute;left:0;right:0;bottom:10px;display:flex;gap:8px;padding:0;justify-content:stretch;height:44px;align-items:center}
.hero-section.hero-section .hero-dots__item{position:relative;flex:1;width:auto;height:44px;border:0;border-radius:0;background:transparent;padding:0}
.hero-section.hero-section .hero-dots__item:after{content:"";position:absolute;left:0;right:0;top:21px;height:2px;background:#20263230}
.hero-section.hero-section .hero-dots__item.is-active{width:auto;background:transparent}
.hero-section.hero-section .hero-dots__item.is-active:after{background:#202632}
.hero-section.hero-section .hero-dots__item:focus-visible{outline:2px solid #0052d9;outline-offset:-3px;box-shadow:none}
.hero-section.hero-section .container:has(>.hero-feature-strip){width:100%}
.hero-section.hero-section .hero-feature-strip{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible;min-height:0;gap:0;align-items:stretch}
.hero-section.hero-section .hero-feature{min-width:0;flex-basis:auto;padding:13px 16px;border:0!important;border-bottom:1px solid #e9edf3!important}
.hero-section.hero-section .hero-feature:nth-child(odd){border-right:1px solid #e9edf3!important}
.hero-section.hero-section .hero-feature:last-child{grid-column:1/-1;border-right:0!important}
.hero-section.hero-section .hero-feature__title{font-size:15px;margin-top:5px;line-height:1.4}
.hero-section.hero-section .hero-feature__kicker{font-size:12px;line-height:1.4}
}
@media(max-width:360px){.hero-section.hero-section .hero-title{font-size:24px}.hero-section.hero-section .hero-cta{padding:0 13px}}
@media(max-width:768px){.hero-section.hero-section .hero-bg__image[src="/branding/hero/tencent-cloud-01.jpg"]{content:url("/branding/hero/tencent-cloud-mobile-1.webp")}}
@media(max-width:768px){.hero-section.hero-section .hero-bg__image[src="/branding/hero/tencent-cloud-02.webp"]{content:url("/branding/hero/tencent-cloud-mobile-2.webp")}}
@media(max-width:768px){.hero-section.hero-section .hero-bg__image[src="/branding/hero/tencent-cloud-03.webp"]{content:url("/branding/hero/tencent-cloud-mobile-3.webp")}}
@media(max-width:768px){.hero-section.hero-section .hero-bg__image[src="/branding/hero/tencent-cloud-04.jpg"]{content:url("/branding/hero/tencent-cloud-mobile-4.webp")}}
@media(max-width:768px){.hero-section.hero-section .hero-bg__image[src="/branding/hero/tencent-cloud-05.jpg"]{content:url("/branding/hero/tencent-cloud-mobile-5.webp")}}

@media(max-width:768px){.hero-section.hero-section .hero-dots__item:hover,.hero-section.hero-section .hero-dots__item.is-active:hover,.hero-section.hero-section .hero-dots__item:active{background:transparent}.hero-section.hero-section .hero-bg__video-wrap{display:none}}

/* Layered desktop fade: background enters first; copy follows by 200ms.
   Mobile retains the matched 500ms horizontal image/copy transitions. */
@media(min-width:769px){
.hero-section.hero-section :is(.hero-h-next-enter-active,.hero-h-prev-enter-active,.hero-h-next-leave-active,.hero-h-prev-leave-active,.hero-bg-h-next-enter-active,.hero-bg-h-prev-enter-active,.hero-bg-h-next-leave-active,.hero-bg-h-prev-leave-active){transform:none;transition-property:opacity;transition-duration:.4s;transition-timing-function:cubic-bezier(.455,.03,.515,.955)}
.hero-section.hero-section :is(.hero-h-next-enter-from,.hero-h-prev-enter-from,.hero-h-next-leave-to,.hero-h-prev-leave-to,.hero-bg-h-next-enter-from,.hero-bg-h-prev-enter-from,.hero-bg-h-next-leave-to,.hero-bg-h-prev-leave-to){transform:none;opacity:0}
.hero-section.hero-section :is(.hero-h-next-enter-to,.hero-h-prev-enter-to,.hero-h-next-leave-from,.hero-h-prev-leave-from,.hero-bg-h-next-enter-to,.hero-bg-h-prev-enter-to,.hero-bg-h-next-leave-from,.hero-bg-h-prev-leave-from){transform:none;opacity:1}
.hero-section.hero-section :is(.hero-h-next-enter-active,.hero-h-prev-enter-active,.hero-bg-h-next-leave-active,.hero-bg-h-prev-leave-active){transition-delay:.2s}
.hero-section.hero-section :is(.hero-h-next-leave-active,.hero-h-prev-leave-active,.hero-bg-h-next-enter-active,.hero-bg-h-prev-enter-active){transition-delay:0s}
.hero-section.hero-section .hero-bg__video{transition:opacity .4s cubic-bezier(.455,.03,.515,.955) .2s}
.hero-section.hero-section .hero-bg__video--active{transition-delay:0s}
.hero-section.hero-section .hero-bg__video--instant{transition:none}
}
@media(max-width:768px){
.hero-section.hero-section :is(.hero-h-next-enter-active,.hero-h-prev-enter-active,.hero-h-next-leave-active,.hero-h-prev-leave-active,.hero-bg-h-next-enter-active,.hero-bg-h-prev-enter-active,.hero-bg-h-next-leave-active,.hero-bg-h-prev-leave-active){transition:transform .5s cubic-bezier(.4,0,.2,1);opacity:1}
}
@media(prefers-reduced-motion:reduce){.hero-section.hero-section :is(.hero-body__panel,.hero-bg__image,.hero-bg__video){transition-duration:.01ms!important;transition-delay:0s!important}}

/* Translate both mobile layers by the viewport width, including content gutters. */
@media(max-width:768px){
.hero-section.hero-section :is(.hero-h-next-enter-from,.hero-h-prev-leave-to,.hero-bg-h-next-enter-from,.hero-bg-h-prev-leave-to){transform:translateX(100vw)}
.hero-section.hero-section :is(.hero-h-prev-enter-from,.hero-h-next-leave-to,.hero-bg-h-prev-enter-from,.hero-bg-h-next-leave-to){transform:translateX(-100vw)}
}
