/* ==========================================================================
   1. Theme Default (核心基础样式 - 字体、颜色、排版)
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200;0,300;0,400;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,600;1,700;1,800;1,900&display=swap');

html, body { overflow-x: hidden; scroll-behavior: smooth; }
body { color: #616161; font-size: 16px; font-weight: 400; line-height: 27px; text-align: left; font-family: 'Nunito', sans-serif; background-color: #fff; margin: 0; }

h1, h2, h3, h4, h5, h6 { color: #232323; font-family: 'Nunito', sans-serif; margin-bottom: 0; margin-top: 11px; line-height: 1.2; font-weight: 700; transition: .5s; }
h1 { font-size: 50px; } h2 { font-size: 35px; } h3 { font-size: 30px; } h4 { font-size: 24px; } h5 { font-size: 20px; } h6 { font-size: 18px; }

a { color: #43baff; text-decoration: none; transition: all 0.3s ease-out 0s; }
a:hover { text-decoration: none; color: #F16722; }
ul { margin: 0; padding: 0; list-style: none; }
img { max-width: 100%; height: auto; }

/* 间距辅助类 (Padding/Margin) */
.pt-90 { padding-top: 90px; } .pb-50 { padding-bottom: 50px; }
.pt-80 { padding-top: 80px; } .pb-70 { padding-bottom: 70px; }
.pt-100 { padding-top: 100px; } .pb-100 { padding-bottom: 100px; }
.mt-20 { margin-top: 20px; } .mb-4 { margin-bottom: 1.5rem; }

/* ==========================================================================
   2. Header & Navigation (顶部导航栏样式 - 关键部分)
   ========================================================================== */
.datatech_nav_manu {
    background: #fff;
    padding: 0;
    transition: all .5s;
    z-index: 999;
    position: relative;
    box-shadow: 0 0 10px rgba(0,0,0,0.1); /* 添加阴影让其更明显 */
}
/* 导航条布局 */
.datatech_nav_manu .row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

/* Logo */
.logo a.logo_img img {
    max-height: 50px;
    width: auto;
    transition: all 0.3s ease;
}

/* 菜单列表 */
.datatech_menu ul.nav_scroll {
    text-align: right; /* 菜单靠右 */
    margin: 0;
    padding: 0;
}
.datatech_menu ul.nav_scroll > li {
    display: inline-block;
    position: relative;
    padding: 30px 18px;
}
.datatech_menu ul.nav_scroll > li > a {
    color: #232323;
    font-size: 16px;
    font-weight: 700;
    text-transform: capitalize;
    padding: 0;
    display: block;
    position: relative;
}
.datatech_menu ul.nav_scroll > li > a:hover {
    color: #F16722;
}

/* 头部右侧按钮 */
.header-button .dtbtn {
    background: #F16722;
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    padding: 10px 30px;
    display: inline-block;
    border-radius: 5px;
    transition: 0.3s;
}
.header-button .dtbtn:hover {
    background: #232323;
    color: #fff;
}

/* 移动端菜单隐藏/显示逻辑 */
.mobile-menu-area { display: none; }
@media (max-width: 991px) {
    .datatech_menu { display: none; } /* 隐藏桌面菜单 */
    .mobile-menu-area { display: block; background: #232323; padding: 10px; }
    .mobile-menu ul li { display: block; border-bottom: 1px solid #333; }
    .mobile-menu ul li a { display: block; padding: 10px; color: #fff; }
}

/* ==========================================================================
   3. Banner / Breadcrumb (面包屑背景区域)
   ========================================================================== */
.breatcumb-area, .slider-area {
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
    z-index: 1;
}
/* 遮罩层，让文字更清晰 */
.breatcumb-area:before, .slider-area:before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: rgba(0, 29, 35, 0.6);
    z-index: -1;
}
.breatcumb-content-text ul li a { color: #fff; }
.breatcumb-title h2 { color: #fff; font-size: 40px; font-weight: 800; }
.slider-content h1 { font-size: 60px; font-weight: 800; color: #fff; line-height: 70px; margin-bottom: 20px; }
.slider-content p { color: #fff; font-size: 18px; margin-bottom: 35px; }

/* ==========================================================================
   4. About Area (关于我们模块)
   ========================================================================== */
.dreamit-section-title h5 {
    font-size: 16px;
    color: #F16722;
    text-transform: uppercase;
    letter-spacing: 3px;
    margin-bottom: 10px;
    font-weight: 700;
}
.dreamit-section-title h2 {
    font-size: 36px;
    font-weight: 800;
    margin-bottom: 20px;
}
.em_bar_bg {
    width: 60px;
    height: 4px;
    background: #F16722;
    margin-bottom: 20px;
    border-radius: 30px;
}
.text-center .em_bar_bg { margin: 0 auto 20px; }
.dreamit-about-thumb img { border-radius: 10px; box-shadow: 0 10px 30px rgba(0,0,0,0.1); }

/* ==========================================================================
   5. Service / Feature Box (服务/优势卡片)
   ========================================================================== */
.dreamit-service-box1 {
    background: #fff;
    padding: 30px;
    box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.07);
    border-radius: 5px;
    transition: .5s;
    margin-bottom: 30px;
    position: relative;
    overflow: hidden;
}
.dreamit-service-box1:hover {
    transform: translateY(-5px);
}
.em-service-icon i {
    font-size: 45px;
    color: #F16722;
    margin-bottom: 20px;
    display: inline-block;
}
.em-service-title h3 { font-size: 22px; font-weight: 700; margin-bottom: 15px; }
.em-service-text p { color: #666; margin-bottom: 0; }

/* ==========================================================================
   6. Portfolio / Products (产品展示)
   ========================================================================== */
.single_portfolio {
    position: relative;
    overflow: hidden;
    margin-bottom: 30px;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
}
.single_portfolio_thumb img {
    width: 100%;
    transition: all 0.5s ease;
}
.single_portfolio:hover .single_portfolio_thumb img {
    transform: scale(1.1);
}
.single_portfolio_content { padding: 20px; text-align: center; }
.single_portfolio_content h3 a {
    color: #232323;
    font-size: 20px;
    font-weight: 700;
}
.single_portfolio_content h3 a:hover { color: #F16722; }

/* ==========================================================================
   7. Blog / News (新闻列表)
   ========================================================================== */
.single_blog {
    background: #fff;
    border: 1px solid #f1f1f1;
    transition: .3s;
    border-radius: 5px;
    overflow: hidden;
    margin-bottom: 30px;
}
.single_blog:hover {
    box-shadow: 0 10px 30px rgba(0,0,0,0.08);
    transform: translateY(-5px);
}
.single_blog_content { padding: 25px; }
.blog_page_title h4 a {
    color: #232323;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.4;
}
.blog_page_title h4 a:hover { color: #F16722; }
.post-categories { color: #999; font-size: 14px; margin-bottom: 10px; }
.button_two a {
    color: #F16722;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 14px;
}

/* ==========================================================================
   8. Footer (页脚)
   ========================================================================== */
.footer-middle {
    background: #111;
    color: #ccc;
    position: relative;
    padding-top: 80px;
    padding-bottom: 30px;
}
.widget-title { color: #fff; font-size: 20px; font-weight: 700; margin-bottom: 30px; position: relative; }
.widget-title:before {
    position: absolute;
    content: "";
    width: 40px;
    height: 3px;
    bottom: -10px;
    left: 0;
    background: #F16722;
}
.company-info-desc p { color: #bbb; margin-bottom: 15px; }
.menu-quick-link-content ul li { margin-bottom: 12px; }
.menu-quick-link-content ul li a { color: #bbb; font-size: 15px; }
.menu-quick-link-content ul li a:hover { color: #F16722; padding-left: 5px; }
.footer-bottom { background: #000; padding: 20px 0; margin-top: 50px; }
.footer-bottom-content-copy p { color: #888; margin: 0; font-size: 14px; }

/* ==========================================================================
   9. Responsive Fixes (响应式修复)
   ========================================================================== */
@media (max-width: 767px) {
    h1 { font-size: 32px; }
    h2 { font-size: 26px; }
    .slider-content h1 { font-size: 36px; line-height: 1.2; }
    .header-btn-socails { display: none; }
    .datatech_menu ul.nav_scroll > li { padding: 10px 0; }
    .breatcumb-area { padding: 60px 0 !important; }
}