.portal-product { color: #17253b; background: #f6f8fb; }
.banner { position: relative; }
.banner .w1200 { position: absolute; top: 0; left: 50%; display: flex; align-items: center; height: 100%; transform: translateX(-50%); }
.banner .wrap { width: 570px; max-width: 52%; margin-top: 0; }
.banner .wrap .title { line-height: 1.3; }
.banner .wrap .title .product-chinese-name { color: #111; }
.banner .wrap .title .product-description { display: block; color: #111; }
.product-description, .detail-product-description { font-size: 20px; margin-top: 12px; margin-bottom: 12px; }
.banner .wrap .desc { max-width: 420px; line-height: 1.55; }
.banner .wrap .btn-group { margin-top: 26px; }
.banner--taiji::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, #fffc 0%, #fffd 31%, transparent 64%); pointer-events: none; }
.banner--taiji .w1200 { z-index: 1; }
.banner--taiji .wrap .desc { color: #111; }
.portal-wrap { width: min(1200px, calc(100% - 48px)); margin: 0 auto; }
.portal-hero { min-height: 370px; padding: 62px 0 50px; box-sizing: border-box; background: linear-gradient(115deg, #071b3b, #0d568a); background-size: cover; background-position: center; color: #fff; }
.portal-eyebrow { min-height: 18px; color: #ffb05a; font-size: 15px; letter-spacing: .04em; }
.portal-hero h1 { margin: 12px 0 4px; font-size: 42px; }
.portal-hero h2 { margin: 0; font-size: 22px; font-weight: 500; }
.portal-intro { max-width: 900px; margin-top: 18px; font-size: 16px; line-height: 1.85; }
.portal-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 22px; }
.portal-actions:empty, .portal-eyebrow:empty, .portal-gallery:empty { display: none; }
.portal-actions button { border: 0; border-radius: 4px; background: #ff8800; color: #fff; padding: 11px 22px; cursor: pointer; font-size: 15px; }
.portal-actions button:hover { background: #ec7600; }
.portal-local-nav { position: sticky; top: 64px; z-index: 10; background: #fff; box-shadow: 0 2px 12px rgba(12,31,55,.08); }
.portal-local-nav .portal-wrap { display: flex; gap: 36px; padding: 18px 0; }
.portal-local-nav a { color: #283d57; }
.portal-local-nav a:hover { color: #f58300; }
.portal-section { padding: 54px 0; scroll-margin-top: 130px; }
#section7 { scroll-margin-top: 80px; }
.portal-section:nth-of-type(even) { background: #fff; }
.portal-section h2 { margin: 0 0 25px; text-align: center; font-size: 28px; }
.portal-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.portal-card { border-radius: 10px; background: #fff; box-shadow: 0 5px 24px rgba(20,44,76,.09); padding: 23px; }
.portal-section:nth-of-type(even) .portal-card { background: #f6f8fb; }
.portal-card h3 { margin: 0 0 11px; font-size: 18px; line-height: 1.45; }
.portal-card p { margin: 0; line-height: 1.8; font-size: 14px; color: #536174; }
.portal-gallery { display: grid; gap: 20px; margin-top: 30px; }
.portal-gallery img { display: block; width: 100%; height: auto; border-radius: 8px; }
.portal-tags { text-align: center; color: #ff8800; }
#portal-code { position: fixed; margin: auto; border: 0; border-radius: 12px; padding: 30px; text-align: center; }
#portal-code::backdrop { background: rgba(0,0,0,.55); }
#portal-code img { max-width: min(70vw, 300px); }
.portal-close { float: right; border: 0; background: transparent; font-size: 24px; cursor: pointer; }
.portal-copy-highlights { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; padding: 30px 0 45px; }
.portal-case-showcase {padding: 38px max(24px, 10vw) 22px; margin: 40px auto 0; scroll-margin-top: 80px; }
.portal-case-showcase .detail-heading { margin-bottom: 30px; }
.portal-case-showcase .portal-copy-highlights { padding: 0 0 30px; }
.portal-case-showcase[data-case-count="2"] .portal-copy-highlights { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.portal-copy-highlight.portal-photo-highlight { overflow: hidden; padding: 0 0 22px; }
.portal-highlight-photo { display: block; width: 100%; height: 190px; object-fit: cover; }
.product-iframe .portal-highlight-photo { border: 0; border-radius: 0; }
.portal-copy-highlight.portal-photo-highlight strong { margin: 20px 20px 10px; }
.portal-copy-highlight.portal-photo-highlight p { margin: 0 20px; }
.portal-case-showcase .portal-copy-highlight { overflow: hidden; padding: 0 0 22px; }
.portal-case-image { display: block; width: 100%; height: 190px; object-fit: cover; }
.portal-case-showcase .portal-copy-highlight strong { margin: 20px 20px 10px; }
.portal-case-showcase .portal-copy-highlight p { margin-right: 20px; margin-left: 20px; }
.product-iframe .portal-copy-highlights { width: 100%; }
.portal-four-users .list { flex-basis: calc(50% - 15px); }
.portal-four-users .list .pic img { width: 100%; object-fit: cover; }
#section2[data-feature-count="4"] .portal-feature-card { flex-basis: calc(25% - 20px); }
#section2[data-feature-count="3"] .portal-feature-card { flex-basis: calc(33.333% - 20px); }
.portal-copy-highlight { box-sizing: border-box; padding: 20px; background: #fff; border: 1px solid #e6ebf1; border-radius: 8px; }
.portal-copy-highlight strong { display: block; margin-bottom: 10px; color: #1d344e; font-size: 17px; line-height: 1.5; }
.portal-copy-highlight p { margin: 0; color: #536174; font-size: 14px; line-height: 1.75; }
.portal-feature-mark { display: block; width: 40px; height: 40px; margin: 20px auto; border: 2px solid #ff8800; border-radius: 50%; color: #ff8800; font-weight: 700; line-height: 36px; text-align: center; }
.lightspot .portal-feature-card, #section2 > .advantage-wrap .portal-feature-card, #features .portal-card { cursor: pointer; transition: background-color .25s ease, color .25s ease; }
.lightspot .portal-feature-card { flex: 0 1 calc(33.333% - 20px); }
.lightspot .portal-feature-card:focus-visible, #section2 > .advantage-wrap .portal-feature-card:focus-visible, #features .portal-card:focus-visible, .portal-scene-card:focus-visible { outline: 2px solid #ff8800; outline-offset: 3px; }
.lightspot .portal-feature-card .pic { box-sizing: border-box; display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 245px; }
.lightspot .portal-feature-description { margin: 12px 0 0; font-size: 14px; line-height: 1.65; text-align: left; }
.lightspot .portal-feature-card:hover .pic, .lightspot .portal-feature-card:focus .pic, #section2 > .advantage-wrap .portal-feature-card:hover, #section2 > .advantage-wrap .portal-feature-card:focus, #features .portal-card:hover, #features .portal-card:focus { background: rgba(240, 138, 21, .8); color: #fff; }
.lightspot .portal-feature-card:hover .pic p, .lightspot .portal-feature-card:focus .pic p, #section2 > .advantage-wrap .portal-feature-card:hover h3, #section2 > .advantage-wrap .portal-feature-card:focus h3, #section2 > .advantage-wrap .portal-feature-card:hover p, #section2 > .advantage-wrap .portal-feature-card:focus p, #features .portal-card:hover h3, #features .portal-card:hover p, #features .portal-card:focus h3, #features .portal-card:focus p { color: #fff; }
#section2 > .advantage-wrap .portal-feature-card { flex: 0 1 calc(33.333% - 20px); min-height: 260px; }
#section2 > .advantage-wrap .portal-feature-card .pic { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 220px; }
#section2 > .advantage-wrap .portal-feature-card p { line-height: 1.65; }
.portal-scene-card .scene-wrap { transition: background-color .25s ease, color .25s ease; }
.portal-scene-card:hover .scene-wrap, .portal-scene-card:focus .scene-wrap { background: #ff8800; color: #fff; }
.portal-scene-description { box-sizing: border-box; padding: 0 16px 16px; font-size: 14px; line-height: 1.7; text-align: left; }
#section3.apply-scene .portal-scene-card { flex: 0 0 calc((100% - 40px) / 3); }
#section3.apply-scene .portal-scene-card .scene { width: 100%; }
#section3.apply-scene .portal-scene-card .scene img { display: block; width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 800px) { .portal-grid { grid-template-columns: 1fr; } .portal-hero h1 { font-size: 34px; } .portal-wrap { width: calc(100% - 32px); } }
@media (max-width: 800px) { .portal-copy-highlights { grid-template-columns: 1fr; padding: 20px 16px 30px; } }
@media (max-width: 800px) { .product-iframe .box.w1200, .portal-copy-highlights.w1200 { box-sizing: border-box; width: calc(100% - 32px); } .product-iframe .portal-copy-highlights { box-sizing: border-box; } }
@media (max-width: 800px) { .portal-case-showcase .portal-copy-highlights, .portal-case-showcase[data-case-count="2"] .portal-copy-highlights { grid-template-columns: 1fr; } }
@media (max-width: 800px) { .lightspot .portal-feature-card, #section2 > .advantage-wrap .portal-feature-card { flex-basis: 100%; } }
@media (max-width: 800px) { .portal-four-users .list, #section2[data-feature-count] .portal-feature-card { flex-basis: 100%; } }

/* ===== 移动端适配（经典产品页：banner / 局部导航 / 卡片堆叠） ===== */
@media (max-width: 860px) {
  /* 首屏文案 */
  .portal-hero { padding: 44px 0 34px; }
  .portal-hero h1 { font-size: 30px; }
  .portal-hero h2 { font-size: 18px; }
  .portal-intro { font-size: 15px; }

  /* 区段 */
  .portal-section { padding: 38px 0; }
  .portal-section h2 { font-size: 22px; margin-bottom: 18px; }

  /* 吸顶局部导航：横向滚动，避免换行撑高 */
  .portal-local-nav { top: 56px; }
  .portal-local-nav .portal-wrap { gap: 16px; overflow-x: auto; -webkit-overflow-scrolling: touch; padding: 14px 0; }
  .portal-local-nav a { white-space: nowrap; }

  /* 经典 banner：去除固定最小宽度，文案改为静态堆叠在图片下方 */
  .banner { height: auto !important; }
  .banner .pic { min-width: 0 !important; width: 100% !important; height: auto !important; display: block; }
  .banner .w1200 { position: static; display: block; width: 100% !important; height: auto; transform: none; }
  .banner .wrap { position: static !important; width: auto !important; max-width: 100%; margin-top: 0 !important; padding: 24px 0; }
  .banner .wrap .title { font-size: 26px; }
  .banner .wrap .desc { font-size: 14px; }
  .banner .wrap .btn-group { margin-top: 24px; flex-wrap: wrap; }

  /* 局部章节导航：横向滚动 */
  .product-navbar .navbar ul { gap: 0; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .navbar li { min-width: 0 !important; flex: 0 0 auto; padding: 0 14px; font-size: 14px; }

  /* 典型用户 / 功能亮点 卡片堆叠为单列，图片自适应 */
  .classics-user .box, .lightspot .box { gap: 14px; }
  .classics-user .list { flex: 0 1 100% !important; }
  .classics-user .list .pic img { width: 100% !important; height: auto !important; }
  .lightspot .list { flex: 0 1 100% !important; }

  /* OM-RE-Web 特有：pic+desc 横向行改纵向堆叠，内联大图自适应 */
  .classics-user .box > .wrap { flex-direction: column; }
  .classics-user .box > .wrap > .pic { margin-bottom: 16px; }
  .classics-user .box > .wrap > .pic img { width: 100% !important; height: auto !important; }
  .classics-user .box > .wrap > .function-desc { margin-left: 0 !important; padding-top: 0 !important; }
  .classics-user .advantage-wrap .item { flex: 0 1 calc(50% - 20px) !important; }
  .classics-user .recruit-wrap .list { flex: 0 1 calc(50% - 20px) !important; }
}

@media (max-width: 480px) {
  .portal-hero h1 { font-size: 25px; }
  .portal-actions { gap: 10px; }
  .portal-actions button { width: 100%; text-align: center; }
  .banner .wrap .btn-group .enter-system { margin-right: 0; width: 100%; text-align: center; }
  .portal-grid { gap: 14px; }
  .portal-card { padding: 18px; }
  .portal-section h2 { font-size: 20px; }
  .classics-user .advantage-wrap .item { flex: 0 1 100% !important; }
  .classics-user .recruit-wrap .list { flex: 0 1 100% !important; }
  .classics-user .box > .wrap > .function-desc .ul .li { margin-bottom: 24px; }
}

/* 场景卡 / 缩放卡内的固定宽图片，移动端改为自适应，避免溢出 */
@media (max-width: 860px) {
  .apply-scene .list .scene { width: 100% !important; height: auto !important; }
  .transform-scale .list .pic { width: 100% !important; height: auto !important; }
  .classics-user .list .pic img,
  .classics-user .list .pic.scene img { width: 100% !important; height: auto !important; }
}

