@import url('https://fonts.googleapis.cn/css2?family=Syne:wght@800&amp;family=JetBrains+Mono:wght@300;500&amp;family=Noto+Sans+SC:wght@300;400;700&amp;display=swap');
* { margin: 0; padding: 0; box-sizing: border-box; -webkit-font-smoothing: antialiased; }
/* 修复核心：分离 background-color 与 background-image，用标准的多层级逗号隔开，完美解决浏览器报错 */
body { font-family: 'Helvetica Neue', Arial, 'Noto Sans SC', sans-serif; background-color: #ffffff; font-family: 'Noto Sans SC', sans-serif;
     background-image: radial-gradient(circle at 85% 15%, rgba(14, 187, 107, 0.20) 0%, rgba(14, 187, 107, 0.05) 40%, transparent 70%), radial-gradient(circle at 15% 85%, rgba(13, 43, 29, 0.15) 0%, rgba(13, 43, 29, 0.03) 45%, transparent 70%); background-attachment: fixed; color: #112218; line-height: 1.8; letter-spacing: 0.8px; overflow-x: hidden; min-height: 100vh; }
a { color: inherit; text-decoration: none; transition: all 0.3s ease; }
img { max-width: 100%; display: block; }

/* 顶级 1440px 高级大画幅导航栏 (Header) */
.nav-bar { width: 100%; position: fixed; top: 0; left: 0; background: rgba(255, 255, 255, 0.85); backdrop-filter: blur(20px); border-bottom: 1px solid rgba(17, 34, 24, 0.04); z-index: 1000; height: 90px; }
.nav-container { width: 1440px; margin: 0 auto; height: 100%; display: flex; justify-content: space-between; align-items: center; padding: 0 40px; }
.nav-logo { font-size: 30px; font-weight: 700; color: #0d2b1d; letter-spacing: 3px;font-family: 'Syne'; }
.nav-logo span {
    color: #0ebb6b;
}
.nav-links { display: flex; gap: 50px; list-style: none; align-items: center; }
.nav-links a { font-size: 15px; font-weight: 400; color: #62756a; position: relative; padding: 10px 0; letter-spacing: 1.5px; }
.nav-links a:hover, .nav-links li.active a { color: #0ebb6b; }
.nav-links a::after { content: ''; position: absolute; bottom: 0; left: 0; width: 0; height: 1px; background: #0ebb6b; transition: width 0.3s ease; }
.nav-links li:hover::after, .nav-links li.active a::after { width: 100%; }

/* 手机端响应式抽屉菜单组件 */
.mobile-menu-trigger { display: none; width: 28px; height: 18px; position: relative; cursor: pointer; z-index: 2000; }
.mobile-menu-trigger span { display: block; width: 100%; height: 1px; background: #0d2b1d; position: absolute; left: 0; transition: all 0.3s ease; }
.mobile-menu-trigger span:first-child { top: 0; }
.mobile-menu-trigger span:last-child { bottom: 0; }
.mobile-menu-trigger.active span:first-child { transform: translateY(8px) rotate(45deg); background: #0ebb6b; }
.mobile-menu-trigger.active span:last-child { transform: translateY(-9px) rotate(-45deg); background: #0ebb6b; }
.mobile-nav-overlay { position: fixed; top: 90px; right: -100%; width: 300px; height: 100vh; background: #ffffff; box-shadow: -15px 0 40px rgba(0,0,0,0.03); z-index: 1500; display: flex; flex-direction: column; padding: 120px 40px 40px 40px; transition: right 0.4s cubic-bezier(0.16, 1, 0.3, 1); border-left: 1px solid rgba(17, 34, 24, 0.05); }
.mobile-nav-overlay.active { right: 0; }
.mobile-nav-links { list-style: none; display: flex; flex-direction: column; gap: 30px; }
.mobile-nav-links a { font-size: 16px; color: #112218; letter-spacing: 2px; font-weight: 400; display: block; }
.mobile-nav-links a.active, .mobile-nav-links a:hover { color: #0ebb6b; }

/* 统一高级排版版面骨架 (1440px 极致宽幅体验) */
.wrapper { width: 1440px; margin: 160px auto 100px auto; padding: 0 40px; }
.section-header { margin-bottom: 40px; position: relative; }
.section-title { font-size: 34px; font-weight: 700; color: #0d2b1d; letter-spacing: 2px; }
.section-subtitle { font-size: 13px; color: #0ebb6b; text-transform: uppercase; letter-spacing: 3px; margin-top: 8px; font-weight: 700; }
.section-header a{position: absolute;top: 0;right: 0;}
/* 极简高级动作按钮样式 */
.btn-action { display: inline-flex; align-items: center; justify-content: center; background: #0d2b1d; color: #ffffff; padding: 15px 40px; font-size: 14px; font-weight: 500; border: none; cursor: pointer; border-radius: 0px; letter-spacing: 2.5px; border: 1px solid #0d2b1d; text-transform: uppercase; transition: all 0.3s ease; }
.btn-action:hover { background: transparent; color: #0d2b1d; }
.btn-sm { padding: 9px 24px; font-size: 13px; letter-spacing: 1.5px; background: transparent; color: #0d2b1d; border: 1px solid rgba(13, 43, 29, 0.2); }
.btn-sm:hover { background: #0d2b1d; color: #ffffff; border-color: #0d2b1d; }

/* INDEX PAGE: 个人故事板排版 */
.intro-layout { display: flex; gap: 120px; align-items: flex-start; margin-bottom: 140px; }
.intro-img-box { width: 500px; flex-shrink: 0; position: sticky; top: 160px; }
.intro-photo { width: 100%; height: 640px; object-fit: cover; }
.intro-main-text { flex-grow: 1; padding-top: 10px; }
.intro-name-row { margin-bottom: 40px; }
.intro-name-zh { font-size: 46px; color: #0d2b1d; font-weight: 700; letter-spacing: 4px; }
.intro-name-en { font-size: 13px; color: #53665a; letter-spacing: 2px; margin-top: 6px; text-transform: uppercase; font-weight: 500; }
.intro-p-text { font-size: 15px; color: #4a5c52; margin-bottom: 28px; text-align: justify; font-weight: 400; line-height: 2.0; }
.intro-quote-card { font-size: 19px; font-weight: 500; color: #0d2b1d; padding: 30px 0; margin: 45px 0; border-top: 1px solid rgba(14, 187, 107, 0.15); border-bottom: 1px solid rgba(14, 187, 107, 0.15); letter-spacing: 1.5px; background: rgba(255, 255, 255, 0.45); padding-left: 20px; border-left: 3px solid #0ebb6b; backdrop-filter: blur(5px); }

/* 风采大图网格墙 */
.gallery-grid-block { display: flex; gap: 20px; margin-top: 40px; width: 100%; }
.grid-col-left { width: 33.333%; height: 600px; background: #000000; position: relative; overflow: hidden; cursor: pointer; }
.grid-col-left img { width: 100%; height: 100%; object-fit: cover; display: block; }
.grid-col-right { width: 66.666%; display: flex; flex-direction: column; gap: 20px; }
.grid-row-top { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.grid-row-top img { width: 100%; height: 290px; object-fit: cover; cursor: pointer; }
.grid-row-bottom { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.grid-row-bottom img { width: 100%; height: 290px; object-fit: cover; cursor: pointer; }
.video-grid-node { width: 100%; height: 290px; background: #000000; position: relative; overflow: hidden; cursor: pointer; }
.video-grid-node video { width: 100%; height: 100%; object-fit: cover; display: block; }
.video-play-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.15); display: flex; align-items: center; justify-content: center; pointer-events: none; transition: opacity 0.3s; z-index: 5; }
.play-btn-circle { width: 55px; height: 55px; background: #0ebb6b; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #ffffff; padding-left: 4px; box-shadow: 0 4px 15px rgba(14,187,107,0.4); }
.play-btn-triangle { width: 0; height: 0; border-top: 10px solid transparent; border-bottom: 10px solid transparent; border-left: 16px solid #ffffff; }

/* COMPANY PAGE: 六图平铺纵深轮播 */
.company-layout { display: flex; flex-direction: column; gap: 80px; }
.company-intro-block { display: flex; gap: 120px; align-items: center; }
.company-text-pane { flex: 1; }
.company-cover-pane { width: 600px; flex-shrink: 0; }
.company-cover-pane img { width: 100%; height: 420px; object-fit: cover; }
.multi-swiper-outer { width: 100%; position: relative;}
.multi-gallery-swiper { width: 100%; overflow: hidden; }
.multi-gallery-swiper .swiper-slide img { width: 100%; height: 360px; object-fit: cover; }
.swiper-arrow-prev, .swiper-arrow-next { position: absolute; top: 65%; transform: translateY(-50%); width: 50px; height: 50px;border-radius: 50%;
     background: #ffffff; border: 1px solid rgba(13, 43, 29, 0.1); display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 10; font-size: 16px; color: #0d2b1d; transition: all 0.3s; font-weight: bold; }
.swiper-arrow-prev:hover, .swiper-arrow-next:hover { background: #0d2b1d; color: #ffffff; border-color: #0d2b1d; }
.swiper-arrow-prev { left: -70px; }
.swiper-arrow-next { right: -70px; }
.cert-grid-layout { display: flex; gap: 40px; }
.cert-minimal-box { flex: 1; text-align: left; }
.cert-minimal-box img { width: 100%; height: 350px; object-fit: cover; border: 1px solid rgba(17, 34, 24, 0.05); }
.cert-text-title { font-size: 13px; font-weight: 500; color: #0d2b1d; margin-top: 20px; letter-spacing: 1px; }
.cert-modern-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; }
.cert-box { transition: 0.4s; }
.cert-img-wrapper { 
    background: rgba(255,255,255,0.4); padding: 20px; border: 1px solid var(--border);
    height: 300px; display: flex; align-items: center; justify-content: center;
    position: relative; overflow: hidden;
}


.cert-img-wrapper img { max-width: 100%; max-height: 100%; object-fit: contain;}
.cert-info { margin-top: 15px; font-size: 13px; font-weight: 700; text-align: center; opacity: 0.6; }
/* 5个Q&A纯白直出无缝展现列表 (非折叠) */
.faq-flat-container { display: grid; grid-template-columns: repeat(2, 1fr); gap: 60px; margin-top: 50px; }
.faq-flat-card { border-top: 1px solid rgba(17, 34, 24, 0.1); padding-top: 30px; }
.faq-flat-card.full-width-faq { grid-column: span 2; }
.faq-flat-q { font-size: 16px; font-weight: 700; color: #0d2b1d; margin-bottom: 15px; display: flex; align-items: center; gap: 10px; }
.faq-flat-q::before { content: 'Q.'; color: #0ebb6b; font-weight: 700; }
.faq-flat-a { color: #53665a; font-size: 14px; text-align: justify; line-height: 1.9; }

/* SERVICE PAGE: 会员三等分布局及表格数据 */
.services-flex { display: grid; grid-template-columns: repeat(3, 1fr); gap: 50px; }
.service-minimal-card { background: rgba(255, 255, 255, 0.55); border-top: 1px solid rgba(17, 34, 24, 0.15); padding: 40px 24px 24px 24px; display: flex; flex-direction: column; height: 100%; backdrop-filter: blur(10px); }
.service-minimal-card.high-tier { border-top-color: #0ebb6b; border-top-width: 2px; background: rgba(255, 255, 255, 0.8); box-shadow: 0 10px 30px rgba(13,43,29,0.04); }
.service-minimal-card h3 { font-size: 21px; color: #0d2b1d; font-weight: 700; margin-bottom: 30px; letter-spacing: 1px; }
.service-item-ul { list-style: none; flex-grow: 1; }
.service-item-ul li { font-size: 13px; margin-bottom: 20px; color: #53665a; text-align: justify; line-height: 1.8; }
.service-item-ul li strong { color: #0d2b1d; font-weight: 700; }
.service-minimal-card .btn-action { margin-top: 40px; width: 100%; }
.asset-minimal-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1px; background: rgba(17, 34, 24, 0.08); margin-top: 50px; border: 1px solid rgba(17, 34, 24, 0.08); }
.asset-minimal-node { background: rgba(255, 255, 255, 0.6); padding: 40px 20px; text-align: center; display: flex; flex-direction: column; justify-content: space-between;backdrop-filter: blur(8px); }
.asset-minimal-node img {width: 60px;margin: 0 auto 10px;}
.asset-minimal-node h4 { font-size: 16px; color: #0d2b1d; font-weight: 700; letter-spacing: 1px; }
.asset-minimal-node p { font-size: 13px; color: #53665a; margin: 8px 0 20px 0; }
.modern-table-view { width: 100%; border-collapse: collapse;}
.modern-table-view th { border-bottom: 1px solid #0d2b1d; color: #0d2b1d; padding: 20px 10px; font-size: 13px; font-weight: 700; text-align: left; letter-spacing: 1.5px; }
.modern-table-view tr { border-bottom: 1px solid rgba(17, 34, 24, 0.05); }
.modern-table-view td { padding: 25px 10px; font-size: 14px; color: #4a5c52; }
.modern-table-view td:first-child { font-weight: 700; color: #0d2b1d; }

/* GALLERY PAGE: 轻量几何瀑布流布局 */
.modern-masonry { column-count: 4; column-gap: 40px; margin-top: 50px; }
.modern-brick { break-inside: avoid; margin-bottom: 40px; cursor: pointer; }
.modern-brick img { width: 100%; height: auto; display: block; box-shadow: 0 5px 15px rgba(0,0,0,0.02); transition: transform 0.3s ease; }
.modern-brick:hover img { transform: scale(1.02); }
/* .modern-brick.size-s img { height: 180px; object-fit: cover; }
.modern-brick.size-m img { height: 280px; object-fit: cover; }
.modern-brick.size-l img { height: 420px; object-fit: cover; } */

/* CONTACT PAGE: 50%/50% 几何切割排版 */
.contact-split-panel { display: flex; gap: 120px; align-items: flex-start; margin-top: 60px; }
.contact-left-info { flex: 1; }
.contact-linear-row { display: flex; flex-direction: column; margin-bottom: 31px; border-bottom: 1px solid rgba(17, 34, 24, 0.05); padding-bottom: 20px; }
.contact-linear-lbl { font-weight: 700; color: #53665a; font-size: 13px; letter-spacing: 2px; text-transform: uppercase; margin-bottom: 8px; }
.contact-linear-val { color: #0d2b1d; font-size: 15px; font-weight: 400; text-align: justify; }
.contact-qrcode-embed {
    padding: 30px;
    border: 1px solid rgba(17, 34, 24, 0.06);
    display: inline-flex;
    align-items: center;
    gap: 30px;
    background: rgba(255, 255, 255, 0.4);
    backdrop-filter: blur(5px);
    box-shadow: 0 10px 30px rgba(0,0,0,0.02);
    width: 100%;
}.contact-embed-img { width: 130px; height: 130px; object-fit: cover; border: 1px solid rgba(17, 34, 24, 0.05); }
.contact-embed-text h4 { font-size: 15px; color: #0d2b1d; font-weight: 700; margin-bottom: 6px; }
.contact-embed-text p { font-size: 13px; color: #62756a; line-height: 1.6; }
.contact-right-form { flex: 1; background: rgba(255, 255, 255, 0.4); backdrop-filter: blur(10px); padding: 60px; border: 1px solid rgba(17, 34, 24, 0.05); box-shadow: 0 15px 40px rgba(13,43,29,0.02); }
.form-title-mini { font-size: 18px; color: #0d2b1d; font-weight: 700; margin-bottom: 45px; letter-spacing: 1px; }
.input-element-group { margin-bottom: 35px; }
.input-element-group label { display: block; font-weight: 700; margin-bottom: 10px; font-size: 14px; color: #0d2b1d; letter-spacing: 1px; }
.input-underlined { width: 100%; border: none; border-bottom: 1px solid rgba(17, 34, 24, 0.1); padding: 12px 0; font-size: 14px; font-family: inherit; color: #112218; background: transparent; outline: none; border-radius: 0; }
.input-underlined:focus { border-bottom-color: #0ebb6b; }
.captcha-align-row { display: flex; gap: 30px; align-items: flex-end; }
.captcha-text-box { width: 110px; height: 45px; border: 1px solid rgba(17, 34, 24, 0.1); display: flex; align-items: center; justify-content: center; background: rgba(250, 252, 251, 0.6); font-weight: 700; letter-spacing: 4px; font-size: 15px; color: #0d2b1d; user-select: none; }

/* 全局大图与卡片弹窗蒙版结构 */
.luxury-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(13, 43, 29, 0.3); backdrop-filter: blur(15px); display: flex; align-items: center; justify-content: center; z-index: 9999; opacity: 0; pointer-events: none; transition: all 0.4s ease; }
.luxury-overlay.active { opacity: 1; pointer-events: auto; }
.overlay-center-panel { background: #ffffff; padding: 50px; position: relative; max-width: 90%; transform: translateY(30px); transition: transform 0.4s ease; }
.luxury-overlay.active .overlay-center-panel { transform: translateY(0); }
.overlay-dismiss-btn { position: absolute; top: 20px; right: 25px; font-size: 28px; font-weight: 200; color: #53665a; cursor: pointer; }
.pop-details { width: 380px; }
.pop-details p{text-align: center;margin-top: 10px;}
.pop-row { display: flex; margin-bottom: 16px; font-size: 16px; border-bottom: 1px solid rgba(17, 34, 24, 0.04); padding-bottom: 10px; }
.pop-lbl { width: 100px; color: #53665a; }
.pop-val { color: #0d2b1d; font-weight: 700; }
.pop-qrcode-box { width: 155px; height: 155px; margin: 25px auto 0 auto; }
.pop-rights { width: 550px; text-align: center; }
.pop-rights-img { width: 100%; object-fit: cover; margin-bottom: 25px; }
.pop-lightbox { max-width: 80vw; max-height: 80vh; }
.pop-lightbox img { max-width: 100%; max-height: 80vh; object-fit: contain; }
.mobile-nav-overlay{display: none;}
/* 宽屏与轻量触屏媒体查询适配 */
@media (max-width: 1480px) { .nav-container, .wrapper { width: 1200px; } .intro-layout, .company-intro-block, .contact-split-panel { gap: 60px; } .intro-img-box { width: 420px; } .intro-photo { height: 550px; } .company-cover-pane { width: 460px; } .grid-col-left { height: 500px; } .grid-row-top img, .grid-row-bottom img, .video-grid-node { height: 240px; } .swiper-arrow-prev { left: -40px; } .swiper-arrow-next { right: -40px; } }
@media (max-width: 1240px) { .nav-container, .wrapper { width: 960px; } .intro-img-box { width: 360px; } .company-cover-pane { width: 380px; } .gallery-grid-block { flex-direction: column; } .grid-col-left { width: 100%; } .grid-col-left img { height: 450px; } .grid-col-right { width: 100%; } .swiper-arrow-prev, .swiper-arrow-next { display: none !important; } }
@media (max-width: 992px) { .nav-container, .wrapper { width: 720px; } .nav-links { display: none; } .mobile-menu-trigger { display: block; } .intro-layout, .company-intro-block, .contact-split-panel { flex-direction: column; align-items: stretch; gap: 60px; } .intro-img-box { position: static; width: 100%; max-width: 440px; margin: 0 auto; } .company-cover-pane { width: 100%; max-width: 500px; margin: 0 auto; } .services-flex { grid-template-columns: 1fr; gap: 40px; max-width: 500px; margin: 0 auto; } .asset-minimal-grid { grid-template-columns: repeat(3, 1fr); } .modern-masonry { column-count: 2; } .cert-grid-layout { flex-direction: column; gap: 30px; max-width: 440px; margin: 0 auto; } .faq-flat-container { grid-template-columns: 1fr; gap: 40px; } }
@media (max-width: 768px) { .nav-container, .wrapper { width: 100%; padding: 0 24px; } .wrapper { margin-top: 130px; } .section-title { font-size: 28px; } .intro-name-zh { font-size: 32px; } .asset-minimal-grid { grid-template-columns: repeat(2, 1fr); } .grid-row-top, .grid-row-bottom { grid-template-columns: 1fr; } .modern-table-view th:nth-child(3), .modern-table-view td:nth-child(3) { display: none; } }
@media (max-width: 480px) { .mobile-nav-overlay { width: 100%; } .asset-minimal-grid { grid-template-columns: 1fr; } .modern-masonry { column-count: 1; } .contact-right-form { padding: 30px 20px; } .contact-qrcode-embed { flex-direction: column; text-align: center; width: 100%; } }
/* 确保触发器在激活状态（.active）时的层级绝对凌驾于一切之上，并采用fixed定位固定在右上角 */
.mobile-menu-trigger.active {position:fixed; right:24px; top:35px; z-index:9999;}
.mobile-menu-trigger.active span {background:#0d2b1d;}
.mobile-menu-trigger.active span:first-child {transform:translateY(8px) rotate(45deg); top:0;}
.mobile-menu-trigger.active span:last-child {transform:translateY(-9px) rotate(-45deg); bottom:0; top:auto;}


/* 移动端媒体查询下的触发器定位微调，确保点击前后的像素完全对齐 */
@media (max-width: 992px) { .mobile-menu-trigger {display:block; position:relative; z-index:2000;} .nav-links {display:none;} }
@media (max-width: 768px) { .nav-container {width:100%; padding:0 24px;} }
.mobile-nav-links {list-style:none; display:flex; flex-direction:column; gap:40px; text-align:center; padding:0;}
.mobile-nav-links a {font-size:24px; color:#0d2b1d; letter-spacing:3px; font-weight:500; display:block; transition:all 0.3s ease;}
.mobile-nav-links a.active, .mobile-nav-links a:hover {color:#0ebb6b;}

/* 移动端媒体查询下的触发器定位微调，确保点击前后的像素完全对齐 */
@media (max-width: 992px) { .mobile-menu-trigger {display:block; position:relative; z-index:2000;} .nav-links {display:none;} }
@media (max-width: 768px) { .nav-container {width:100%; padding:0 24px;} .mobile-nav-overlay{display: block;}}
/* 自定义极简错误提示标签 */
.form-error-tip { position: absolute; bottom: -20px; left: 0; font-size: 12px; color: #d9383a; letter-spacing: 1px; opacity: 0; transform: translateY(-5px); transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1); pointer-events: none; }
.form-error-tip.show { opacity: 1; transform: translateY(0); }
/* 错误时输入框下划线变成微红色，保持高级感 */
.input-underlined.has-error { border-bottom-color: rgba(217, 56, 58, 0.5) !important; }