html {
    font-size: 16px;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    
}
@media screen and (min-width: 640px) {
    html {
        font-size: calc(15px + (16.5 - 15) * ((100vw - 640px) / (1024 - 640)));
    }
}

@media screen and (min-width: 1024px) {
    html {
        font-size: calc(16.5px + (18 - 16.5) * ((100vw - 1024px) / (1440 - 1024)));
    }
}

@media screen and (min-width: 1440px) {
    html {
        font-size: 18px;
    }

}

@media screen and (max-width: 768px) {
    html {
        font-size: 16px !important;
        -webkit-text-size-adjust: 100%;
        -ms-text-size-adjust: 100%;
    }
}

:root {
    --font-xxs: clamp(0.625rem, 0.25vw, 0.75rem);
    --font-xs: clamp(0.75rem, 0.3vw, 0.875rem);
    --font-sm: clamp(0.875rem, 0.35vw, 0.9375rem);
    --font-base: clamp(0.9375rem, 0.4vw, 1rem);
    --font-md: clamp(1rem, 0.45vw, 1.125rem);
    --font-lg: clamp(1.125rem, 0.55vw, 1.25rem);
    --font-xl: clamp(1.25rem, 0.7vw, 1.5rem);
    --font-2xl: clamp(1.5rem, 0.85vw, 1.875rem);
    --font-3xl: clamp(1.875rem, 1vw, 2.5rem);
    --font-4xl: clamp(2.5rem, 1.2vw, 3rem);
}

@media screen and (max-width: 768px) {
    :root {
        --font-xxs: clamp(0.9375rem, 2vw, 1rem);
        --font-xs: clamp(1rem, 2.3vw, 1.0625rem);
        --font-sm: clamp(1.0625rem, 2.6vw, 1.125rem);
        --font-base: clamp(1.125rem, 2.9vw, 1.25rem);
        --font-md: clamp(1.25rem, 3.3vw, 1.375rem);
        --font-lg: clamp(1.375rem, 3.8vw, 1.625rem);
        --font-xl: clamp(1.625rem, 4.3vw, 1.875rem);
        --font-2xl: clamp(1.875rem, 5vw, 2.25rem);
        --font-3xl: clamp(2.25rem, 5.8vw, 3rem);
        --font-4xl: clamp(3rem, 6.8vw, 4rem);
    }
}

.ug-page-body {
    margin: 0;
}
.text-gradient-fast-white-gray-black-silver{background-image:linear-gradient(to right top,#aebed5,#ccd5e4,#c4d1e1,#eef1f6,#fefefe)}
.text-gradient-fast-white-gray-black-silver{-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.text-gradient-fast-blue-purple-light-orange {
  background-image: linear-gradient(to right top, #c28a3d, #c28a3d, #f8ddae, #f8ddae, #f8ddae);
}
.text-gradient-fast-blue-purple-light-orange{-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.center-text{text-align: center;
    width: 85%;
    margin-left: auto;
    margin-right: auto;
    }
@media (max-width: 768px) {
    .container-sec.ug-sec8 .center-text {
        padding-top: 5%; 
    }
}    

/* 转换 1rem = 16px */
.container-sec{overflow:hidden}
.container-inner{
    max-width: 1200px;
    position: relative;
    margin: 0 auto;
    height: 100%;
    /* margin-bottom: 5%; */
    margin-left: auto;
    margin-right: auto;
}
.container-inner1{max-width: 1200px;
  position: relative;
  margin: 0 auto;
  height: 100%;
  margin-left: auto;
  margin-right: auto;
}
.ai-container-inner{max-width: 1200px;
    position: relative;
    margin: 0 auto;
    height: auto;
    margin-left: auto;
    margin-right: auto;
}
@media (max-width: 768px) {
    .ai-container-inner{
    min-height: 700px;
}
    
}
/* ============================================
   ug-sec1 首屏
   ============================================ */
.ug-sec1 {
    position: relative;
    width: 100%;
    height: 100vh;
    min-height: 600px;
    overflow: hidden;
    display: flex;
    justify-content: center;
    background-color: #171922;
}

.ug-sec1-bg {
    position: absolute;
    inset: 0;
    z-index: 1;
}

.ug-sec1-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.ug-sec1-content {
    position: relative;
    z-index: 2;
    text-align: center;
    padding-top: 8vh;
    color: #fff;
}

.ug-sec1-title {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5em;
    margin: 0 0 0.6em;
    font-weight: 600;
    line-height: 1.2;
}

.ug-sec1-brand {
    font-size: var(--font-4xl);
    color: #fdc457;
}

.ug-sec1-model {
    font-size: var(--font-4xl);
    color: #ffffff;
    color: #fdc457;
}

.ug-sec1-badge {
    font-size: var(--font-lg);
    color: rgba(255,255,255,0.85);
    /* border: 1px solid rgba(255,255,255,0.35); */
    border-radius: 4px;
    padding: 0.15em 0.5em;
    font-weight: 400;
    background: #f93e3e;
}

.ug-sec1-subtitle {
    font-size: var(--font-2xl);
    color: rgb(255 255 255);
    margin: 0;
    letter-spacing: 0.05em;
    font-weight: 600;
}

@media screen and (max-width: 768px) {
    .ug-sec1 {
        min-height: 500px;
        height: 60vh;
    }
    .ug-sec1-content {
        padding-top: 6vh;
    }
    .ug-sec1-title {
        flex-wrap: wrap;
    }
}
/* ============================================
   ug-sec2 卡片网格
   ============================================ */
.ug-sec2 {
    background: #0a0a0ae6;
    padding: 4vw 3vw;
    height: auto;
    min-height: auto;
}

.ug-sec2-header {
    text-align: center;
    margin-bottom: 3vw;
}

.ug-sec2-title {
    font-size: var(--font-3xl);
    color: #ffffff;
    font-weight: 700;
    line-height: 1.4;
    margin: 0;
}

.ug-sec2-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1vw;
    max-width: 1400px;
    margin: 0 auto;
}

.ug-card {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    aspect-ratio: 1 / 1.15;
    box-shadow: 0 4px 24px rgba(0,0,0,0.55), inset 0 1px 0 rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.08);
}

.ug-card::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
    background: rgba(0,0,0,0.15);
    pointer-events: none;
}

.ug-card > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

.ug-card-text {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 2;
    padding: 1.4em 1.2em;
}

.ug-card-title {
    font-size: var(--font-xl);
    color: #ffffff;
    margin: 0 0 0.5em;
    font-weight: 700;
    line-height: 1.3;
    text-shadow: 0 2px 8px rgba(0,0,0,0.6);
}

.ug-card-desc {
    font-size: var(--font-sm);
    color: rgba(255,255,255,0.75);
    margin: 0;
    line-height: 1.7;
    text-shadow: 0 1px 4px rgba(0,0,0,0.5);
}

/* 第三排两个卡片，高度为上方一半 */
.ug-card--half {
    aspect-ratio: 2 / 0.65;
    grid-column: span 2;
}

/* 平板响应式：2列 */
@media screen and (max-width: 1024px) {
    .ug-sec2-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.5vw;
    }
    .ug-card {
        aspect-ratio: 1 / 1;
    }
    .ug-card--half {
        aspect-ratio: 2 / 1;
        grid-column: span 2;
    }
}

/* 移动端响应式 */
@media screen and (max-width: 768px) {
    .ug-sec2 {
        padding: 6vw 4vw;
    }
    .ug-sec2-grid {
        grid-template-columns: 1fr;
        gap: 3vw;
    }
    .ug-card {
        aspect-ratio: 3 / 4;
        grid-column: span 1;
    }
    .ug-card--half {
        aspect-ratio: 9 / 7;
        grid-column: span 1;
    }
    .ug-card-text {
        padding: 2em;
    }
 .ug-card-desc {
    font-size: var(--font-lg);
}   
}
.ug-sec3 {
    height: auto;
    min-height: auto;
    background-color: #000000;
    padding: 4vw 3vw;
}

.ug-sec3-header {
    text-align: center;
    margin-bottom: 2.5vw;
}

.ug-sec3-title {
    font-size: var(--font-3xl);
    color: #ffffff;
    font-weight: 700;
    margin: 0 0 0.3em;
    line-height: 1.3;
}

.ug-sec3-subtitle {
    font-size: var(--font-md);
    color: rgba(255,255,255,0.7);
    margin: 0;
    max-width: 750px;
    margin-left: auto;
    margin-right: auto;
}

.ug-sec3-img {
    position: relative;
    text-align: center;
    padding: 2vw 3vw 4vw;
}

.ug-sec3-img::before,
.ug-sec3-img::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    width: 8vw;
    z-index: 2;
    pointer-events: none;
}

.ug-sec3-img::before {
    left: 0;
    background: linear-gradient(to right, #000000 0%, transparent 100%);
}

.ug-sec3-img::after {
    right: 0;
    background: linear-gradient(to left, #000000 0%, transparent 100%);
}

.ug-sec3-img img {
    position: relative;
    z-index: 1;
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
    border-radius: 12px;
}

@media (max-width: 768px) {
    .ug-sec3 {
        min-height: auto;
    }
    .ug-sec3-img {
        padding: 4vw 4vw 6vw;
    }
 .ug-sec3-subtitle {
    font-size: var(--font-lg);
}   
}
.ug-sec4 {
    background-color: #15161d;
    height: auto;
    min-height: 50vh;
    padding: 4vw 3vw;
}

.ug-sec4-header {
    text-align: center;
    margin-bottom: 3vw;
}

.ug-sec4-title {
    font-size: var(--font-3xl);
    color: #ffffff;
    font-weight: 700;
    margin: 0 0 0.4em;
    line-height: 1.3;
}

.ug-sec4-desc {
    font-size: var(--font-md);
    color: rgba(255,255,255,0.7);
    margin: 0;
    line-height: 1.7;
}
.ug-sec5 {
    background: url(../images/6800nas-cpu.png) no-repeat center center;
    background-size: cover;
    height: auto;
    min-height: 100vh;
    padding: 4vw 3vw;
}

.ug-sec5-header {
    text-align: center;
    margin-bottom: 3vw;
}

.ug-sec5-title {
    font-size: var(--font-3xl);
    color: #ffffff;
    font-weight: 700;
    margin: 0 0 0.4em;
    line-height: 1.3;
}

.ug-sec5-desc {
    font-size: var(--font-md);
    color: rgba(255,255,255,0.7);
    margin: 0;
    line-height: 1.7;
    max-width: 750px;
    margin-left: auto;
    margin-right: auto;
}
 @media (max-width: 768px) {
 .ug-sec5{background: url(../images/6800nas-cpu.png) no-repeat center center;
        background-size: 250%;
        height: auto;
        min-height: 80vh;
        background-color: black;}
 }
 .ug-sec5-desc {
    font-size: var(--font-lg);
}
.ug-sec6 {
    height: auto;
    min-height: 40vh;
    background-color: #000;
    padding: 4vw 3vw;
}

.ug-sec6 .ug-sec3-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.2vw;
    max-width: 1000px;
    margin: 0 auto;
}

.ug-sec6 .ug-sec3-col {
    display: flex;
    flex-direction: column;
    gap: 1.2vw;
}

.ug-sec6 .ug-sec3-card {
    background: #242424;
    border-radius: 16px;
    padding: 1.8em 2em;
    border: 1px solid rgba(255,255,255,0.06);
}

.ug-sec6 .ug-sec3-card--spec {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.2em 2.5em;
    align-items: start;
}

.ug-sec6 .ug-sec3-spec-item {
    display: flex;
    flex-direction: column;
    gap: 0.35em;
}
@media (max-width: 768px) {
 .ug-sec6 .ug-sec3-spec-item {
padding-bottom: 20px;
}   
}
.ug-sec6 .ug-sec3-spec-val {
    font-size: var(--font-2xl);
    color: #ffffff;
    font-weight: 700;
}

.ug-sec6 .ug-sec3-spec-label {
    font-size: var(--font-md);
    color: rgba(255,255,255,0.45);
}

.ug-sec6 .ug-sec3-card--bar {
    display: flex;
    align-items: center;
    gap: 1.5em;
}

.ug-sec6 .ug-sec3-bar-left {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-self: stretch;
    min-width: 120px;
}

.ug-sec6 .ug-sec3-bar-left .ug-sec3-bar-label {
    font-size: var(--font-lg);
    color: rgba(255,255,255,0.5);
}

.ug-sec6 .ug-sec3-bar-right {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.6em;
}

.ug-sec6 .ug-sec3-bar-right .ug-sec3-bar-name {
    font-size: var(--font-md);
    color: rgba(255,255,255,0.85);
}

.ug-sec6 .ug-sec3-bar-track {
    height: 10px;
    background: rgba(255,255,255,0.08);
    border-radius: 5px;
    overflow: hidden;
}

.ug-sec6 .ug-sec3-bar-fill {
    height: 100%;
    background: #3aa8f5;
    border-radius: 5px;
}

.ug-sec6 .ug-sec3-bar-fill--dim {
    background: rgba(255,255,255,0.15);
}

.ug-sec6 .ug-sec3-bar-badge {
    display: flex;
    align-items: center;
    gap: 0.25em;
}

.ug-sec6 .ug-sec3-bar-arrow {
    font-size: var(--font-base);
    color: #3aa8f5;
}

.ug-sec6 .ug-sec3-bar-percent {
    font-size: var(--font-3xl);
    color: #3aa8f5;
    font-weight: 700;
}

.ug-sec6 .ug-sec3-card--highlight {
    display: flex;
    align-items: center;
    gap: 1.5em;
}

.ug-sec6 .ug-sec3-hl-percent {
    font-size: var(--font-3xl);
    color: #3aa8f5;
    font-weight: 700;
}

.ug-sec6 .ug-sec3-hl-text {
    display: flex;
    flex-direction: column;
    gap: 0.2em;
}

.ug-sec6 .ug-sec3-hl-text span {
    font-size: var(--font-lg);
    color: rgba(255,255,255,0.7);
}

.ug-sec6 .ug-sec3-tips {
    padding: 1rem;
    font-size: var(--font-xs);
    color: #666;
    max-width: 1000px;
    margin: 0 auto;
    margin-top: 2vw;
}

@media (max-width: 992px) {
    .ug-sec6 .ug-sec3-grid {
        grid-template-columns: 1fr;
        gap: 2vw;
    }
    .ug-sec6 .ug-sec3-card {
        padding: 1.5em;
    }
    .ug-sec6 .ug-sec3-card--spec {
        grid-template-columns: 1fr;
        gap: 1.5em;
    }
}

@media (max-width: 768px) {
    .ug-sec6 .ug-sec3-grid {
        grid-template-columns: 1fr;
        gap: 1.5em;
    }
    .ug-sec6 .ug-sec3-card {
        padding: 1.2em;
        display: grid;
    grid-template-columns: 1fr 1fr;
    }
    .ug-sec6 .ug-sec3-card--bar {
        flex-direction: column;
        align-items: flex-start;
        gap: 1em;
    }
    .ug-sec6 .ug-sec3-bar-left {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        min-width: auto;
        width: 100%;
    }
    .ug-sec6 .ug-sec3-spec-val {
        font-size: var(--font-xl);
    }
    .ug-sec6 .ug-sec3-spec-label {
        font-size: var(--font-lg);
    }
    .ug-sec6 .ug-sec3-hl-percent {
        font-size: var(--font-2xl);
    }
    .ug-sec6 .ug-sec3-hl-text span {
        font-size: var(--font-xl);
    }
    .ug-sec6 .ug-sec3-bar-left .ug-sec3-bar-label {
        font-size: var(--font-xl);
    }
    .ug-sec6 .ug-sec3-bar-right .ug-sec3-bar-name {
        font-size: var(--font-lg);
    }
    .ug-sec6 .ug-sec3-tips {
        font-size: var(--font-base);
        padding: 0.5rem;
    }
   .ug-sec6 .ug-sec3-bar-track {
    height: 20px;
} 
}
.ug-sec7 {
    height: auto;
    min-height: 100vh;
    background-color: #000;
    padding: 4vw 3vw;
}

.ug-sec7-inner {
    max-width: 1200px;
    margin: 0 auto;
}

.ug-sec7-header {
    text-align: center;
    margin-bottom: 3vw;
}

.ug-sec7-title {
    font-size: var(--font-3xl);
    color: #ffffff;
    font-weight: 700;
    margin: 0 0 0.5em;
    line-height: 1.35;
}

.ug-sec7-desc {
    font-size: var(--font-md);
    color: rgba(255,255,255,0.65);
    margin: 0;
    line-height: 1.7;
}
.ug-sec8 {
    height: auto;
    min-height: 80vh;
    background-color: #000000;
    padding: 1vw 3vw 1vh;
}

.ug-sec8-inner {
    max-width: 1200px;
    margin: 0 auto;
}

.ug-sec8-header {
    text-align: center;
    margin-bottom: 3vw;
}

.ug-sec8-title {
    font-size: var(--font-3xl);
    color: #ffffff;
    font-weight: 700;
    margin: 0;
    line-height: 1.35;
}

.ug-sec8-desc {
    font-size: var(--font-md);
    color: rgba(255,255,255,0.65);
    margin: 0;
    line-height: 1.7;
    padding-top: 20px;
}

@media (max-width: 768px) {
    .ug-sec8 {
        height: auto;
        min-height: 46vh;
        background-color: #000000;
    }
 .ug-sec7-desc {
    font-size: var(--font-lg);
}  
.ug-sec8-desc {
     font-size: var(--font-lg);
}
}
.container-sec .ug-sec8 .center-text{
    padding-top:0px;
}

.ug-sec9 {
    height: auto;
    background-color: #000000;
    padding: 4vw 3vw;
}

.container-sec.ug-sec9 {
    color: white;
}

.container-sec.ug-sec9 b {
    font-weight: 600;
}

.ug-sec9-header {
    text-align: center;
    margin-bottom: 3vw;
}

.ug-sec9-title {
    font-size: var(--font-3xl);
    font-weight: 700;
    color: #ffffff;
    margin: 0 0 0.5em;
    line-height: 1.3;
}

.ug-sec9-subtitle {
    font-size: var(--font-md);
    color: rgba(255,255,255,0.65);
    margin: 0;
    line-height: 1.7;
}
.ug-sec10 {
    height: auto;
    min-height: 105vh;
    background-color: #15161d;
    overflow-x: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 4vw 3vw;
}

.ug-sec10-header {
    text-align: center;
    margin-bottom: 3vw;
}

.ug-sec10-title {
    font-size: var(--font-3xl);
    color: #ffffff;
    font-weight: 700;
    margin: 0 0 1.5vw;
    line-height: 1.3;
}

.ug-sec10-desc {
    font-size: var(--font-md);
    color: rgba(255,255,255,0.65);
    margin: 0;
    line-height: 1.7;
    max-width: 750px;
    margin-left: auto;
    margin-right: auto;
}
@media (max-width: 768px) {
.ug-sec10-desc {
    font-size: var(--font-lg);
}    
}
/* ============================================
   ug-sec11~ug-sec19 标题和描述样式
   ============================================ */

.ug-sec11 {
    height: auto;
    min-height: 100vh;
    padding: 4vw 3vw;
}

.ug-sec11-header {
    text-align: center;
    margin-bottom: 3vw;
}

.ug-sec11-title {
    font-size: var(--font-3xl);
    color: #ffffff;
    font-weight: 700;
    margin: 0 0 0.4em;
    line-height: 1.3;
}

.ug-sec11-desc {
    font-size: var(--font-md);
    color: rgba(255,255,255,0.7);
    margin: 0;
    line-height: 1.7;
}

.ug-sec11 p {
    font-size: var(--font-base);
    color: rgb(0 0 0 / 85%);
    margin: 1em 0 1em;
    line-height: 1.65;
}

.ug-sec11-feature-title{
     font-size: var(--font-lg);
    color: #000;
    font-weight: 600;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.4em; 
}
@media (max-width: 768px) {
 .ug-sec11-desc {
    font-size: var(--font-lg);
}

.ug-sec11 p {
    font-size: var(--font-lg);
}   
}
.ug-sec12 {
    height: auto;
    min-height: 100vh;
    background-color: #000;
    background-image: none;
    padding: 4vw 3vw;
}

.ug-sec12-header {
    text-align: center;
    margin-bottom: 3vw;
}

.ug-sec12-title {
    font-size: var(--font-3xl);
    color: #ffffff;
    font-weight: 700;
    margin: 0 0 0.4em;
    line-height: 1.3;
}

.ug-sec12-desc {
    font-size: var(--font-md);
    color: rgba(255,255,255,0.7);
    margin: 0;
    line-height: 1.7;
    max-width: 750px;
    margin-left: auto;
    margin-right: auto;
}
@media (max-width: 768px) {
  .ug-sec12-desc {
    font-size: var(--font-lg);
}  
}
.ug-sec13 {
    padding: 4vw 3vw;
}

.ug-sec13-header {
    text-align: left;
    margin-bottom: 2vw;
}

.ug-sec13-title {
    font-size: var(--font-3xl);
    color: #ffffff;
    font-weight: 700;
    margin: 0 0 0.3em;
    line-height: 1.3;
}

.ug-sec13-desc {
    font-size: var(--font-md);
    color: rgba(255,255,255,0.65);
    margin: 0;
    line-height: 1.7;
}

.ug-sec13 .features-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    margin-top: 20px;
}

.ug-sec13 .feature-item {
    background-color: rgba(255,255,255,0.05);
    border-radius: 12px;
    padding: 25px;
    transition: transform .3s ease, box-shadow .3s ease;
    backdrop-filter: blur(10px);
    border: 1px solid rgba(108, 108, 108, 0.1);
}

.ug-sec13 .feature-item:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.2);
}

.ug-sec13 .feature-header {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
}

.ug-sec13 .feature-icon {
    width: 40px;
    height: 40px;
    margin-right: 12px;
    flex-shrink: 0;
}

.ug-sec13 .feature-title {
    font-size: var(--font-lg);
    font-weight: 600;
    color: #fff;
    margin: 0;
}

.ug-sec13 .feature-text {
    font-size: var(--font-sm);
    color: rgba(255,255,255,0.7);
    line-height: 1.6;
    margin: 0;
}
@media (max-width: 768px) {
 .ug-sec13-desc {
    font-size: var(--font-lg);
}   
}
.ug-sec15 {
    padding: 4vw 3vw;
}

.ug-sec15-header {
    text-align: center;
    margin-bottom: 3vw;
}

.ug-sec15-title {
    font-size: var(--font-3xl);
    color: #ffffff;
    font-weight: 700;
    margin: 0 0 0.4em;
    line-height: 1.3;
}

.ug-sec15-desc {
    font-size: var(--font-md);
    color: rgba(255,255,255,0.7);
    margin: 0;
    line-height: 1.7;
    max-width: 750px;
    margin-left: auto;
    margin-right: auto;
}

.ug-sec15 .download-section {
    width: 100%;
}

.ug-sec15 .top-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    margin-bottom: 24px;
}

.ug-sec15 .download-item {
    background-color: #171717;
    border: 1px solid rgba(108, 108, 108, 0.1);
    border-radius: 12px;
    padding: 20px;
    transition: all .3s ease;
}

.ug-sec15 .download-item:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 16px rgba(0,0,0,0.25);
}

.ug-sec15 .download-header {
    display: flex;
    align-items: center;
    margin-bottom: 12px;
}

.ug-sec15 .download-icon {
    width: 36px;
    height: 36px;
    margin-right: 10px;
    object-fit: contain;
}

.ug-sec15 .download-title {
    font-size: var(--font-lg);
    font-weight: 600;
    color: #ffffff;
    margin: 0;
}

.ug-sec15 .download-text {
    font-size: var(--font-sm);
    color: #b4b4b4;
    line-height: 1.5;
    margin: 0;
}

.ug-sec15 .bottom-section {
    background-color: #171717;
    border: 1px solid rgba(108, 108, 108, 0.1);
    border-radius: 12px;
    padding: 24px;
}

.ug-sec15 .bottom-header {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-bottom: 24px;
    text-align: left;
}

.ug-sec15 .icon-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    padding-top: 3%;
}

.ug-sec15 .icon-item {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.ug-sec15 .grid-icon {
    width: 50px;
    height: 50px;
    margin-bottom: 8px;
    object-fit: contain;
    transition: transform .3s ease;
}

.ug-sec15 .icon-item:hover .grid-icon {
    transform: scale(1.1);
}

.ug-sec15 .grid-text {
    font-size: var(--font-sm);
    color: #b4b4b4;
    margin: 0;
    line-height: 1.4;
}
@media (max-width: 768px) {
   .ug-sec15-desc{
    font-size: var(--font-lg);   
   } 
}
.ug-sec17 {
    padding: 4vw 3vw;
}

.ug-sec16-header {
    text-align: center;
    margin-bottom: 3vw;
}

.ug-sec16-title {
    font-size: var(--font-3xl);
    color: #ffffff;
    font-weight: 700;
    margin: 0 0 0.4em;
    line-height: 1.3;
}

.ug-sec16-desc {
    font-size: var(--font-md);
    color: rgba(255,255,255,0.7);
    margin: 0;
    line-height: 1.7;
}

.ug-sec17 {
    padding: 4vw 3vw;
}

.ug-sec17-header {
    text-align: center;
    margin-bottom: 3vw;
}

.ug-sec17-title {
    font-size: var(--font-3xl);
    color: #000000;
    font-weight: 700;
    margin: 0 0 0.4em;
    line-height: 1.3;
}

.ug-sec17-desc {
    font-size: var(--font-md);
    color: rgba(0,0,0,0.65);
    margin: 0;
    line-height: 1.7;
}

.ug-sec18 {
    padding: 4vw 3vw;
}

.ug-sec18-header {
    text-align: center;
    margin-bottom: 3vw;
}

.ug-sec18-title {
    font-size: var(--font-2xl);
    color: #000000;
    font-weight: 700;
    margin: 0 0 0.4em;
    line-height: 1.35;
}

.ug-sec18-desc {
    font-size: var(--font-base);
    color: rgba(0,0,0,0.65);
    margin: 0;
    line-height: 1.7;
}

.ug-sec19 {
    padding: 4vw 3vw;
}

.ug-sec19-header {
    text-align: center;
    margin-bottom: 3vw;
}

.ug-sec19-title {
    font-size: var(--font-3xl);
    color: #000000;
    font-weight: 700;
    margin: 0 0 0.4em;
    line-height: 1.3;
}

.ug-sec19-desc {
    font-size: var(--font-md);
    color: rgba(0,0,0,0.65);
    margin: 0;
    line-height: 1.7;
}

@media (max-width: 768px) {
    .ug-sec10 {
        min-height: 75vh;
    }
 .ug-sec16-desc {
    font-size: var(--font-lg);
} 
.ug-sec17-desc {
    font-size: var(--font-lg);
}
.ug-sec18-desc {
    font-size: var(--font-lg);
}
.ug-sec19-desc {
    font-size: var(--font-lg);
}
}

.marquee-section {
    margin: 40px 0;
    overflow: hidden;
}
.marquee-container {
    position: relative;
    overflow: hidden;
    margin: 20px 0;
    height: 80px;
}
.marquee-left {
    animation: marquee-left 30s linear infinite;
}
.marquee-right {    animation: marquee-right 30s linear infinite;}
@keyframes marquee-left {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}
@keyframes marquee-right {
    0% { transform: translateX(-50%); }
    100% { transform: translateX(0); }
}
.marquee-track {    display: flex;    height: 100%;    align-items: center;}
.marquee-item {
    flex: 0 0 auto;
    margin: 0 15px;
}
.item-content {
    padding: 8px 15px;
    display: flex;
    align-items: center;
    background: var(--bg-primary, #ffffff);
    padding: 10px 20px;
    border-radius: var(--radius-lg, 12px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
}
.item-image {
    width: 40px;
    height: 40px;
    margin-right: 12px;
    object-fit: contain;
}
.item-text {
    font-size: var(--font-base);
    font-weight: 500;
    color: #172b4d;
}
@media (max-width:768px){.ug-sec12{height:auto;min-height:100vh;background-size:100%;background-color:#000}
.ug-sec11{height:auto;min-height:100vh;background-size:cover}
.ug-sec13 .imgs-inner img[src*="video-icon.png"],.ug-sec13 .imgs-inner img[src*="video-app.png"]{max-width:100%;height:auto;display:block;margin:0 auto}
.video-left-column,.video-right-column{width:100%;display:block;margin-bottom:20px}
.imgs-inner{width:100%;display:flex;flex-wrap:wrap;justify-content:center;align-items:center}
.imgs-inner img{max-width:100%;height:auto;margin:10px}
.tv-img{display:none}
.item-image {
    width: 50px;
    height: 50px;
}
.item-text {
    font-size: var(--font-lg);
    font-weight: 500;
}
}.ug-sec13{height:auto;/* min-height: 90vh; */background: linear-gradient(to bottom, #141414, #000000);padding-top: 5%;padding-bottom: 6%;}
.ug-sec14{height:auto;min-height:80vh;background:#000}
.ug-sec14 img{border-radius:15px}
@media (max-width:768px){.ug-sec14{min-height:60vh}
}.ug-sec15{height:auto;/* min-height:100vh; */background: linear-gradient(to bottom, #000812, #0b0c0d);padding-top: 8%;padding-bottom: 8%;}
.imgs-inner2{display:flex;justify-content:space-between;padding:20px;max-width:1360px;padding-bottom: 5%;position:relative;margin:0 auto;height:auto;}
@media (max-width:768px){.container-sec.ug-sec15 .imgs-inner1 img{max-width:100%;height:auto;display:block;}
.container-sec.ug-sec15 .imgs-inner1{width:100%;display:flex;flex-wrap:wrap;justify-content:center;align-items:center}.imgs-inner2{width:100%;display:flex;flex-wrap:wrap;justify-content:center;align-items:center}
}.ug-sec16{height:auto;/* min-height:100vh; */background-color:#19191b;padding-top: 6%;padding-bottom: 6%;}
.ug-sec17{height:auto;min-height:100vh}
@media (max-width:768px){
  .ug-sec17{height:auto;min-height:60vh}
}
.ug-sec18{height:auto;background-color:#ebebeb}
.ug-sec19{height:auto;min-height:100vh;background-color:#ffffff}
.text-bg-box{background-image:linear-gradient(to right top,#aebed5,#ccd5e4,#c4d1e1,#eef1f6,#fefefe);padding:10px 20px;border-radius:50px;display:inline-block;text-align:center}
.text-bg-box1{background-image:linear-gradient(to right top,#c28a3d, #c28a3d, #f8ddae, #f8ddae, #f8ddae);padding:10px 20px;border-radius:50px;display:inline-block;text-align:center}
.text-bg-box2{background-image:linear-gradient(to right top,#c28a3d, #c28a3d, #f8ddae, #f8ddae, #f8ddae);padding:10px 20px;width: 30%;border-radius:50px;display:inline-block;text-align:center}



@media (max-width:1200px){.advantage{width:90%}
.ad-container{width:100%}
}@media (max-width:768px){.ad-card{width:100%}
.ad-container{display:flex;justify-content:space-around;flex-direction:row;flex-wrap:wrap}
.row1 .ad-card:nth-of-type(1),.row1 .ad-card:nth-of-type(2){width:100%}
}.cont-files{display:flex;flex-wrap:nowrap;justify-content:space-around;padding:20px;gap:20px;width:1200px;margin-left:auto;margin-right:auto}
.left-cardfile{width:40%;background-image:url('../images/5-1.png');background-size:cover;background-position:center;color:#fff;padding:20px;box-sizing:border-box;display:flex;flex-direction:column;position:relative;height:auto;aspect-ratio:16/9;border-radius:15px}
.left-cardfile::before{content:"";position:absolute;top:0;left:0;right:0;bottom:0}
.left-cardfile h3,.left-cardfile p{position:relative;z-index:1}
.right-cardfiles{width:60%;display:flex;flex-direction:column;justify-content:space-between;gap:20px}
.right-cardfile{background-size:cover;background-position:center;color:#fff;padding:20px;box-sizing:border-box;flex:1;position:relative;height:auto;aspect-ratio:16/9;border-radius:15px}
.right-cardfile::before{content:"";position:absolute;top:0;left:0;right:0;bottom:0}
.right-cardfile h3,.right-cardfile p{position:relative;z-index:1}
.right-cardfile:nth-of-type(1){background-image:url('../images/5-2.png')}
.right-cardfile:nth-of-type(2){background-image:url('../images/5-3.png')}
.image-conner {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  width: 100%;
  /* padding-top: 10%; */
}

.image-section {
  position: relative;
  width: 45%;
  overflow: hidden;
  border-radius: 8px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.image-section img {
  width: 100%;
  height: auto;
  display: block;
}

.image-text {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0));
    color: white;
    padding: 20px;
    margin: 0;
    font-family: Arial, sans-serif;
    font-size: var(--font-base);
    text-align: center;
}

@media (max-width: 768px) {
  .image-section {
      width: 100%;
  }
  .image-text {
    font-size: var(--font-xl);    
  }      
}
@media (max-width:768px){.left-cardfile,.right-cardfiles{width:100%}
.cont-files{width:100%;display:flex;flex-wrap:wrap;justify-content:space-around}
}.con-tent{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-start}
@media (max-width:768px){
  con-tent{display: block;}
}
.icon-container{flex:1 1 300px;display:grid;grid-template-columns:repeat(2,1fr);justify-items:center;align-items:center;gap:20px;max-width:500px;margin-left:auto;margin-right:auto;padding:80px;font-size:var(--font-xl);font-weight:500}
@media (max-width:768px){.icon-container{flex:1 1 300px;display:grid;grid-template-columns:repeat(2,1fr);justify-items:center;align-items:center;gap:20px;max-width:500px;margin-left:auto;margin-right:auto;padding:32px;font-size:var(--font-xl);font-weight:500}
}.icon-doc,.icon-movie,.icon-music,.icon-photo{display:flex;flex-direction:column;align-items:center;text-align:center}
.icon-container p{line-height:1.6;margin-top:0;margin-bottom:0;font-weight:500}
.file-icon{height:50px;margin:10px}
.image-container{flex:1 1 400px}
@media (max-width:768px){
  .image-container{flex:1 1 700px}
}
.image-container img{width:100%;height:auto}
@media (max-width:768px){.con-tent{flex-direction:column}
.icon-container,.image-container{width:100%}
}.cont-main{font-family:sans-serif;display:flex;justify-content:space-between;gap:15px;width:60vw;height: 100%;margin:80px auto}
.cont-silde{height:60vh;position:relative;border-radius:10px;padding:20px;background-size:cover;background-position:50%;flex:0.5;cursor:pointer;transition:0.5s linear flex;-webkit-transition:0.5s linear flex;-moz-transition:0.5s linear flex;-ms-transition:0.5s linear flex;-o-transition:0.5s linear flex}
@keyframes heading {
  from {
      bottom: 150px;
      opacity: 0;
  }
  to {
      bottom: 20px;
      opacity: 1;
  }
}
.cont-silde h2{position:absolute;bottom:20px;left:20px;opacity:0;color:#fff;width:55%;font-size:var(--font-xl)}
@media (max-width:768px){
  .cont-silde h2{font-size:var(--font-2xl)}
}
.cont-silde h2 span{font-weight:400;opacity:0.8;margin-top:10px;display:block;width:100%;font-size:var(--font-base)}
@media (max-width:768px){
  .cont-silde h2 span{font-size:var(--font-xl)}
}
.cont-silde.active{flex:5}
.cont-silde.active h2{
  opacity:1;
  animation-name:heading;
  animation-timing-function:cubic-bezier(0.68, -0.55, 0.265, 1.55);
  animation-duration:1.5s;
  animation-iteration-count:1;
}
.story-container{max-width:1400px;margin:0 auto;padding:32px;}
.story-section{display:flex;justify-content:center;align-items:center;min-height:100vh;padding:24px;max-width:1600px;margin:0 auto;flex-direction:column}
.text-block{flex:0.8;padding:56px;border-radius:25px;margin:16px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transform-origin:center center;letter-spacing:0.3px;text-align:center}
.image-block{flex:1;display:flex;justify-content:center;align-items:center}
.image-placeholder{width:100%;height:auto;object-fit:cover;border-radius:20px;box-shadow:0 15px 35px rgba(0,0,0,0.2);transition:transform 0.3s ease}
.image-placeholder:hover{transform:scale(1.02)}
.progress-bar{position:fixed;top:40px;left:50%;transform:translateX(-50%);width:300px;height:4px;z-index:1000;display:flex;justify-content:space-between;align-items:center;padding:0}
.progress-bar-fill{
  position:absolute;
  top:50%;
  left:20px;width:calc(100% - 40px);
  max-width:calc(100% - 40px);
  height:4px;
  background:linear-gradient(90deg,#f39c12,#f1c40f);
  transform:translateY(-50%);
  z-index:1;
  border-radius:10px;
  transition:width 0.3s ease
}
.progress-bar::before{content:"";position:absolute;top:50%;left:20px;width:calc(100%-40px);height:4px;background:rgba(0,0,0,0.1);transform:translateY(-50%);border-radius:10px;z-index:0}
.progress-step{width:40px;height:40px;background:#fff;border-radius:50%;display:flex;justify-content:center;align-items:center;font-size:var(--font-xl);color:#333;position:relative;z-index:2;transition:all 0.3s ease;box-shadow:0 2px 10px rgba(0,0,0,0.1);border:2px solid #fff;margin-top:-18px;cursor:pointer}
.progress-step:hover{transform:scale(1.1);box-shadow:0 4px 15px rgba(0,0,0,0.15)}
.progress-step.active{background:#f39c12;color:#fff;transform:scale(1.1);border-color:#fff}
.next-section-btn{display:inline-block;padding:16px 32px;background:#333;color:white;border:none;border-radius:30px;cursor:pointer;font-size:var(--font-base);margin-top:32px;transition:all 0.3s ease;box-shadow:0 4px 6px rgba(0,0,0,0.1)}
.next-section-btn:hover{background:#555;transform:translateY(-3px);box-shadow:0 6px 12px rgba(0,0,0,0.15)}
.light-theme{background-color:#f4f4f9;color:#333}
.dark-theme{background-color:#2c3e50;color:#f4f4f9}
.mid-theme{background-color:#3e4a61;color:#e0e0e0}
.sunset-theme{background-color:#001016;color:#fff}
.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.9);display:none;justify-content:center;align-items:center;z-index:2000;opacity:0;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.modal-image{max-width:90%;max-height:90vh;border-radius:20px;box-shadow:0 20px 40px rgba(0,0,0,0.4);transform:scale(0.8);opacity:0;cursor:pointer}
.modal-close{position:fixed;top:30px;right:30px;width:50px;height:50px;background:rgba(255,255,255,0.2);border:2px solid rgba(255,255,255,0.4);border-radius:50%;display:flex;justify-content:center;align-items:center;cursor:pointer;font-size:var(--font-2xl);color:white;opacity:0;transform:rotate(-180deg);transition:all 0.3s ease;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}
.modal-close span{display:block;transform:translateY(-2px)}
.modal-close:hover{transform:rotate(0deg) scale(1.1);background:rgba(255,255,255,0.3);border-color:rgba(255,255,255,0.6);box-shadow:0 0 20px rgba(255,255,255,0.2)}
@media screen and (max-width:1200px){.story-section{padding:32px;gap:48px}
.text-block{padding:32px}
}@media screen and (max-width:900px){.story-section{flex-direction:column;padding:16px;gap:32px;min-height:auto;margin:64px 0}
.text-block{flex:1;width:100%;max-width:100%;order:2}
.image-block{flex:1;width:100%;order:1}
.image-placeholder{max-width:100%;height:auto}
.progress-bar{width:250px;top:20px}
.progress-step{width:35px;height:35px;font-size:var(--font-base)}
}@media screen and (max-width:600px){.story-container{padding:16px}
.text-block{padding:24px}
h2{font-size:var(--font-2xl);margin-bottom:24px}
p{font-size:var(--font-base);line-height:1.7;margin-bottom:32px}
.next-section-btn{padding:12.8px 25.6px;font-size:var(--font-base)}
.progress-bar{width:200px}
.progress-step{width:30px;height:30px;font-size:var(--font-sm);margin-top:-13px}
.modal-close{top:15px;right:15px;width:40px;height:40px;font-size:var(--font-xl)}
}@media screen and (max-width:400px){.progress-bar{width:180px}
.progress-step{width:25px;height:25px;font-size:var(--font-xs);margin-top:-10px}
h2{font-size:var(--font-xl)}
.text-block{padding:19.2px}
}.chip-img{display:block;margin:0 auto;max-width:100%;padding-top:3%}
.tv-img{margin:0 auto;max-width:100%;padding-top:5%}
.cpu-features{display:flex;flex-wrap:wrap;justify-content:space-around;color:#ffffff;padding:10px}
.dh-feature {
    flex: 1 1 260px;
    margin: 10px;
    background-color: #141414;
    display: flex;
    flex-direction: column;
padding: 1.5em;
}

.dh-feature-icon {
    width: 20px; 
    height: 20px; 
    margin-right: 10px;
    vertical-align: middle; 
}

.ug-sec12 .dh-feature h6 {
    font-size: var(--font-lg);
    color: #ffffff;
    font-weight: 600;
    margin: 0;
    display: flex;
    align-items: center;
}

.ug-sec12 .dh-feature p {
    font-size: var(--font-sm);
    color: rgba(255,255,255,0.6);
    margin: 0;
    line-height: 1.6;
}
@media (max-width: 768px) {
   .ug-sec12 .dh-feature p {
    font-size: var(--font-lg);
} 
.dh-feature-icon {
    width: 40px; 
    height: 40px; 
}
}
.album-content{display:flex;justify-content:space-between;padding-top:5%}
.image img{width:100%}
.album-features{width:45%;display:flex;flex-direction:column}
.album-feature{margin-bottom:20px;background-color:#242424;padding:15px;display:flex;flex-direction:column;align-items:center}
.feature-group{display:flex;justify-content:space-between}
.feature-group .album-feature{width:30%;margin:0 10px}
@media (min-width: 768px) and (max-width: 991.98px) {
    .feature-group{
    display: flex;
    flex-direction: column;
    align-content: space-between;}
.feature-group .album-feature{width:100%;margin:0 0 10px;}
}

.feature-group .album-feature:first-child{margin-left:0}
.feature-group .album-feature:last-child{margin-right:0}
.album-feature{display:flex;flex-direction:column;align-items:flex-start;border-radius:10px}
.album-feature-title{margin-top:10px;margin-bottom:10px;font-size: var(--font-base);}
.album-feature-title span{font-size: var(--font-sm);} 
@media (max-width:768px){
  .album-feature-title{font-size: var(--font-xl);}
  .container-sec.ug-sec8 .album-feature span {
    font-size: var(--font-xl);} 
}


.feature-img{width:auto;height:50px;margin-right:10px;display:inline-block;max-width:100%;height:auto}
@media (max-width:768px){.container{width:90%}
.album-content{flex-direction:column}
.image,.album-features{width:100%;padding:15px}
.feature-group{flex-direction:column}
.feature-group .album-feature{width:100%;margin:0 0 20px 0}
}div.drop-container{position:absolute;right:0;bottom:0;left:0;margin:auto;height:250px;width:250px;margin-top:20%;z-index:1}
@media (max-width:768px){
  div.drop-container {
    position: sticky;
    margin-top: 10%;
}
}
img.drop{position:absolute;top:-25%;width:100%;height:100%;object-fit:cover;border-radius:100% 5% 100% 100%;transform:rotate(-45deg);margin:0px;-webkit-animation:drip 4s forwards;animation:drip 4s forwards}
@-webkit-keyframes appear{0%{opacity:0}
100%{opacity:1}
}@keyframes appear{0%{opacity:0}
100%{opacity:1}
}div.drop-container:before,div.drop-container:after{content:'';position:absolute;z-index:-1;top:55%;right:50%;transform:translate(50%) rotateX(75deg);border-radius:100%;opacity:0;width:80%;height:80%;border:5px solid skyblue;-webkit-animation:dripple 2s ease-out 1s infinite;animation:dripple 2s ease-out 1s infinite}
div.drop-container:after{-webkit-animation:dripple 2s ease-out 1.7s infinite;animation:dripple 2s ease-out 1.7s infinite}
@-webkit-keyframes drip{45%{top:0;border-radius:100% 5% 100% 100%;transform:rotate(-45deg)}
100%{top:0;transform:rotate(0deg);border-radius:100%}
}@keyframes drip{45%{top:0;border-radius:100% 5% 100% 100%;transform:rotate(-45deg)}
100%{top:0;transform:rotate(0deg);border-radius:100%}
}@-webkit-keyframes dripple{0%{width:150px;height:150px}
25%{opacity:1}
100%{width:650px;height:650px;top:-24%;opacity:0}
}@keyframes dripple{0%{width:150px;height:150px}
25%{opacity:1}
100%{width:650px;height:650px;top:-24%;opacity:0}
}@media (max-width:768px){@-webkit-keyframes drip{45%{top:0;border-radius:100% 5% 100% 100%;transform:rotate(-45deg)}
100%{top:0;transform:rotate(0deg);border-radius:100%}
}@keyframes drip{45%{top:0;border-radius:100% 5% 100% 100%;transform:rotate(-45deg)}
100%{top:0;transform:rotate(0deg);border-radius:100%}
}@-webkit-keyframes dripple{0%{width:100px;height:100px}
25%{opacity:1}
100%{width:450px;height:450px;top:-24%;opacity:0}
}@keyframes dripple{0%{width:100px;height:100px}
25%{opacity:1}
100%{width:450px;height:450px;top:-24%;opacity:0}
}}.container-sec.ug-sec9{display:flex;flex-direction:column;justify-content:space-between;align-items:center;height:90vh}
.container-sec.ug-sec9 .center-text{order:1}
.container-sec.ug-sec9 .drop-container{order:2}

@media (max-width: 992px) {
    .ug-sec13 .features-grid {
        gap: 15px;
    }
    .ug-sec13 .feature-item {
        padding: 20px;
    }
    .ug-sec13 .feature-icon {
        width: 36px;
        height: 36px;
    }
}

@media (max-width: 768px) {
    .ug-sec13 .features-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    .ug-sec13 .feature-title {
        font-size: var(--font-xl);
    }
    .ug-sec13 .feature-text {
        font-size: var(--font-lg);
    }
}
@media (max-width:768px){.container-sec.ug-sec9 .drop-container{width:50%}
}.container-sec.ug-sec9 .ai-features-container{order:3}
.ai-features-container{display:flex;flex-direction:row;justify-content:space-around;flex-wrap:wrap;max-width:1330px;margin-bottom:5%}
.ai-feature{flex:1 1 calc(33.333% - 40px);min-width:300px;margin:20px;padding:20px;box-shadow:0 0 5px rgba(0,0,0,0.3);border-radius:5px;display:flex;flex-direction:row;justify-content:space-between;align-items:center;box-sizing:border-box}
.ai-feature img{width:40%;height:auto;margin-right:20px}
.ai-feature-description{width:60%}
@media (max-width:768px){.container-sec.ug-sec9{height:auto;min-height:auto;padding-bottom:20px}
.container-sec.ug-sec9 .container-inner .ai-container-inner{width:100%;padding:0 20px;box-sizing:border-box;height:50vh}
.container-sec.ug-sec9 .ai-features-container{display:flex;flex-direction:column;align-items:center}
.container-sec.ug-sec9 .ai-feature{width:auto;margin-bottom:20px}
.container-sec.ug-sec9 .drop-container img{max-width:100%;height:auto}
.container-sec.ug-sec9 .album-feature span {font-size: var(--font-lg);}
}@media (max-width:768px){.drop-container{position:relative;z-index:auto}
}.album-box-wrapper{color:#000000;padding-top:6%;padding:10px}
.album-box-container{display:flex;justify-content:space-between;align-items:center;padding:32px;background-color:#f6f6f6;color:#292929;border-radius:16px;margin:32px auto}
.album-box-container1{display:flex;justify-content:space-between;align-items:center;padding:32px;background-color:#ffffff00;color:#292929;border-radius:16px;margin:32px auto}
.album-box-left{flex:1}
.album-box-left1{flex:1;display:flex;flex-direction:column;gap:16px;padding:10px}
.services-tag{background-color:#7760ee;color:#fff;padding:4.8px 12.8px;border-radius:16px;font-size:var(--font-sm)}
.learn-more-btn{background-color:#7760ee;color:#fff;border:none;padding:12.8px 32px;border-radius:8px;font-size:var(--font-base);cursor:pointer}
.album-box-right{flex:1;display:flex;flex-direction:column;gap:16px}
.album-box-right1{flex:1;display:flex;flex-direction:column;gap:16px;padding:10px}
.service-img{height:300px;border-radius:15px;}
@media (max-width:768px){.service-img{max-width:100%;height:auto;display:block;margin:0 auto}
}.album-box-item{background-color:#eaeaea;padding:16px;border-radius:16px;display:flex;flex-direction:row;align-items:flex-start;gap:16px}
.album-box-item1{background-color:#151517;padding:16px;border-radius:16px;display:flex;flex-direction:row;align-items:flex-start;gap:16px;height:140px}
.album-box-item .album-box-text{display:flex;flex-direction:column}
.album-box-item1 .album-box-text{display:flex;flex-direction:column;color:white}
.service-icon{width: 10%;padding: 7px;}
@media (max-width:768px){.album-box-container,.album-box-container1{flex-direction:column}
.album-box-left,.album-box-right,.album-box-left1,.album-box-right1{width:100%;padding-bottom:5%}
}.album-box-item .album-box-text h5{margin-top:0}
.album-box-item .album-box-text h6{margin-top:0}
.album-box-item1 .album-box-text h6{margin-top:0}
.album-box-two{display:flex;justify-content:space-between;align-items:flex-start;color:#fff;max-width:1200px;gap:32px}
.box-left-section,.box-right-section{flex:1;padding:32px;background-color:#f6f6f6;border-radius:16px;color:#000000}
.album-two-image{width:100%;margin-bottom:16px}
@media (max-width:768px){.album-box-two{flex-direction:column;gap:16px}
.box-left-section,.box-right-section{width:100%}
.album-two-image{max-width:100%}
}.imgs-inner{display:flex;justify-content:space-between;padding:20px;max-width:1300px;padding-top: 5%;position:relative;margin:0 auto}
@media (max-width:768px){.imgs-inner{width:100%;display:flex;flex-wrap:wrap;justify-content:center;align-items:center}
.imgs-inner img{max-width:100%;height:auto;margin:10px}
}.video-left-column{width:50%;display:flex;flex-direction:column;max-height:862px}
@media (max-width:768px){.video-left-column{width:100%;display:block;margin-bottom:20px}
}.imgs-inner img{width:90%}
.video-right-column{width:50%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center}
@media (max-width:768px){.video-right-column{width:100%;display:block;margin-bottom:20px}
}.in-dot-text,.in-dot-img{flex:1}
.in-dot-img{display:flex;align-items:flex-end;justify-content:flex-start}
.in-dot-img img{width:100%}
.lit-img{width:100%}
.lit-img img{width: 70%;
  padding-top: 30px;}
 @media (max-width:768px){.lit-img img{width: 100%;} }
.imgs-inner1{display:flex;justify-content:space-between;padding:20px;max-width:1360px;position:relative;margin:0 auto;height:auto;gap: 30px;}
@media (max-width:768px){.imgs-inner1{display:flex;flex-direction:column;padding:10px}.in-dot-text{text-align:center}
}.img-left-column{width:50%;display:flex;flex-direction:column;height:100%;padding:10px}

@media (max-width:768px){.img-left-column{text-align: center;width:100%}
}.imgs-inner img{width:90%}

@media (max-width: 992px) {
    .ug-sec15 .top-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    .ug-sec15 .icon-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 12px;
    }
}

@media (max-width: 768px) {
    .ug-sec15 .top-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    .ug-sec15 .download-item {
        padding: 16px;
    }
    .ug-sec15 .download-icon {
        width: 42px;
        height: 32px;
    }
    .ug-sec15 .download-title {
        font-size: var(--font-xl);
    }
    .ug-sec15 .download-text {
        font-size: var(--font-lg);
    }
    .ug-sec15 .bottom-section {
        padding: 20px;
    }
    .ug-sec15 .icon-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 12px;
    }
    .ug-sec15 .grid-icon {
        width: 40px;
        height: 40px;
    }
    .ug-sec15 .grid-text {
        font-size: var(--font-lg);
    }
}
.img-right-column{width:50%;display:flex;flex-direction:column;padding:10px}
@media (max-width:768px){.img-right-column{width:100%;text-align: center;}
}.feature-map-container{display:flex;flex-wrap:nowrap;justify-content:center;gap:20px;width:100%;max-width:1200px;padding:20px;margin-left:auto;margin-right:auto;padding-bottom:6%}
@media (max-width:768px){.feature-map-container{display:flex;flex-wrap:wrap;gap:10px}
}.feature-map{flex:1 0 calc(25% - 20px);background-color:white;border-radius:10px;box-shadow:0 0 5px rgba(0,0,0,0.1);padding:20px;display:flex;flex-direction:column;align-items:flex-start}
@media (max-width:768px){.feature-map{flex:0 0 calc(50% - 5px);box-sizing:border-box}
}.feature-map-icon{display:flex;align-items:center;margin-bottom:10px}
.icon-add{width:24px;height:24px;margin-right:10px}
.feature-map-title{font-size:var(--font-xl);margin:0}
@media (max-width:768px){
  .feature-map-title{font-size:var(--font-xl);margin:0}
  .text-bg-box2{margin-left: auto;
        margin-right: auto;
 font-size: var(--font-lg);
 argin-bottom: 15px;
  }
}
.feature-map-desc{font-size:var(--font-sm);color:#666}
@media (max-width:768px){
  .feature-map-desc{font-size:var(--font-lg);color:#000000}
}
.doc-container{display:flex;flex-wrap:nowrap;min-height:900px}
.doc-left-section{flex:1;background-image:url('../images/6800nas-office.png');background-size:cover;background-position:center;flex-basis:50%;display:flex;align-items:center;justify-content:center;min-height: 400px;}
.doc-left-section .ag-main_img{max-width:100%;height:auto;display:block}
.doc-right-section{flex:1;display:flex;flex-direction:column;padding:20px;flex-basis:50%}
.doc-title-container{flex:1;text-align:center}
.doc-title-container h3{font-size:var(--font-2xl);}
.doc-title-container h6{font-size:var(--font-base);}
@media (max-width:768px){
    .doc-title-container h3{font-size:var(--font-3xl);}
    .doc-title-container h6{font-size:var(--font-xl);}
}
.doc-carousel-container{flex:2;position:relative;overflow:hidden}
.doc-carousel-images{display:flex;height:95%;transition:transform 0.5s ease;padding-bottom:50px}
.doc-carousel-image{min-width:100%;background-size:contain;background-position:center;background-repeat:no-repeat}
.doc-carousel-controls{position:absolute;left:50%;transform:translateX(-50%);display:flex;gap:10px}

.doc-control-bar{width:60px;height:4px;background-color:rgba(0,0,0,0.5);cursor:pointer;position:relative;overflow:hidden}
.doc-control-bar .doc-progress{position:absolute;top:0;left:0;height:100%;background-color:rgb(221,31,31);width:0}
@media (max-width:768px){.doc-carousel-images{height:100%}
.doc-carousel-image {
  flex: 1 1 100%; 
  background-size: 100%; 
  background-position: center; 
min-height: 500px;
        padding: 20px;
        height: auto;
}
.doc-container{min-height: 70vh;
  display: flex;
  flex-direction: column;}
}@keyframes fillBar{0%{width:0}
100%{width:100%}
}@media (max-width:600px){.doc-left-section,.doc-right-section{flex-basis:100%}
}:root{--color-text:navy;--color-bg:papayawhip;--color-bg-accent:#ecdcc0;--size:clamp(160px,16px + 40vmin,480px);--gap:calc(var(--size) / 14);--duration:60s;--scroll-start:0;--scroll-end:calc(-100% - var(--gap))}
@media (prefers-color-scheme:dark){:root{--color-text:papayawhip;--color-bg:navy;--color-bg-accent:#2626a0}
}*{box-sizing:border-box}
.image-text-container{background-color:white;display:inline-flex;align-items:center;gap:10px;display:flex;flex-direction:row;align-items:center;padding:10px 40px;box-shadow:0 5px 25px rgba(89,101,124,0.15);border-radius:10px;color:#242424;font-weight:400}
.image-text-container img{  width: 38%;}
.image-text-container,.image-text-container *{overflow:visible !important}
.image-text-container span {
    font-size: var(--font-base); 
}
@media (max-width:768px){
    .image-text-container span {
    font-size: var(--font-xl); 
}}
@media (max-width:768px){.marquee__group{gap:30px}
}.marquee{display:flex;overflow:hidden;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;gap:var(--gap);-webkit-mask-image:linear-gradient(
          var(--mask-direction,to right),hsl(0 0% 0% / 0),hsl(0 0% 0% / 1) 20%,hsl(0 0% 0% / 1) 80%,hsl(0 0% 0% / 0)
        );mask-image:linear-gradient(
          var(--mask-direction,to right),hsl(0 0% 0% / 0),hsl(0 0% 0% / 1) 20%,hsl(0 0% 0% / 1) 80%,hsl(0 0% 0% / 0)
        )}
.marquee__group{flex-shrink:0;display:flex;align-items:center;justify-content:space-around;gap:var(--gap);min-width:100%;-webkit-animation:scroll-x var(--duration) linear infinite;animation:scroll-x var(--duration) linear infinite}
@media (prefers-reduced-motion:reduce){.marquee__group{-webkit-animation-play-state:paused;animation-play-state:paused}
}.marquee--vertical{--mask-direction:to bottom}
.marquee--vertical,.marquee--vertical .marquee__group{flex-direction:column}
.marquee--vertical .marquee__group{-webkit-animation-name:scroll-y;animation-name:scroll-y}
.marquee--reverse .marquee__group{animation-direction:reverse;-webkit-animation-delay:-3s;animation-delay:-3s}
@-webkit-keyframes scroll-x{from{transform:translateX(var(--scroll-start))}
to{transform:translateX(var(--scroll-end))}
}@keyframes scroll-x{from{transform:translateX(var(--scroll-start))}
to{transform:translateX(var(--scroll-end))}
}@-webkit-keyframes scroll-y{from{transform:translateY(var(--scroll-start))}
to{transform:translateY(var(--scroll-end))}
}@keyframes scroll-y{from{transform:translateY(var(--scroll-start))}
to{transform:translateY(var(--scroll-end))}
}.marquee svg{display:grid;place-items:center;width:var(--size);fill:var(--color-text);background:var(--color-bg-accent);aspect-ratio:16/9;padding:calc(var(--size) / 10);border-radius:8px}
.marquee--vertical svg{aspect-ratio:1;width:calc(var(--size) / 1.5);padding:calc(var(--size) / 6)}
.app-container{display:flex;flex-direction:column;margin-bottom:10%}
.app-container-inner{width:1200px;position:relative;margin:0 auto;height:100vh}
.icon-wrapper,.marquee,.marquee.marquee--reverse{margin-top:20px}
.icon-wrapper{display:flex;flex-direction:column;gap:var(--gap);margin:auto;max-width:100vw;align-content:center;overflow:hidden;gap:var(--gap);font-size:var(--font-base);line-height:1.5;color:var(--color-text)}
.icon-wrapper--vertical{flex-direction:row;height:100vh}
.toggle{--size:48px;position:relative;position:fixed;top:16px;left:16px;width:var(--size);height:var(--size);font:inherit;text-align:center;cursor:pointer;outline:none;border:none;border-radius:50%;color:inherit;background-color:var(--color-bg-accent);z-index:1}
.toggle:focus-visible{box-shadow:0 0 0 2px var(--color-text)}
.toggle span{position:absolute;display:inline-block;top:50%;left:calc(100% + 0.4em);width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;white-space:nowrap;transform:translateY(-50%);-webkit-animation:fade 400ms 4s ease-out forwards;animation:fade 400ms 4s ease-out forwards;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
.toggle svg{--size:24px;position:absolute;top:50%;left:50%;width:var(--size);height:var(--size);fill:currentcolor;transform:translate(-50%,-50%);transition:transform 300ms cubic-bezier(0.25,1,0.5,1)}
.toggle--vertical svg{transform:translate(-50%,-50%) rotate(-90deg)}
@-webkit-keyframes fade{to{opacity:0;visibility:hidden}
}@keyframes fade{to{opacity:0;visibility:hidden}
}.cpu-image-container{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;max-width:1200px;margin-left:auto;margin-right:auto}
.cpu-image-item{flex:1 0 calc(25% - 10px);box-sizing:border-box}
.cpu-image-item img{width:100%;height:auto;display:block;}
@media (max-width:768px){.cpu-image-item{flex:1 0 calc(50% - 10px)}
}.safe-image-container{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;max-width:900px;margin-left:auto;margin-right:auto}
.safe-image-item{flex:1 0 calc(25% - 10px);box-sizing:border-box}
.safe-image-item img{width:100%;height:auto;display:block;padding: 20px;}
@media (max-width:768px){.safe-image-container {
    max-width: 500px;
}}
@media (max-width:768px){.safe-image-item{flex:1 0 calc(50% - 10px)}
}
@media (max-width:768px){.container-inner.ai-container-inner{width:auto}
.cont-main{font-family:sans-serif;display:block;justify-content:space-between;gap:15px;width:90%;margin:50px auto}
.cont-silde{margin-bottom:20px}
}
@media (max-width:575.98px){body{font-size:var(--font-sm)}
h1{font-size:var(--font-3xl)}
h2{font-size:var(--font-2xl)}
}
@media (min-width:576px) and (max-width:767.98px){body{font-size:var(--font-base)}
}
@media (min-width:768px) and (max-width:991.98px){.container-inner.ai-container-inner{width:auto;padding-left:30px;padding-right:30px}
}@media (min-width:992px) and (max-width:1199.98px){}
@media (min-width:1200px){.container{margin-left:auto;margin-right:auto}
}@media print{body{color:#000;background-color:#fff;font-size:12pt}
.no-print{display:none}
a{text-decoration:none;color:inherit}
}