|
|
@@ -9,12 +9,24 @@ import solutionsBgUrl from "../assets/images/bg.jpg?url";
|
|
|
import capabilitiesBgUrl from "../assets/images/bg2.jpg?url";
|
|
|
import sectionDataUrl from "../assets/illustrations/section-data.svg?url";
|
|
|
import heroIndustrialUrl from "../assets/illustrations/hero-industrial.svg?url";
|
|
|
-import afterSalesUrl from "../assets/images/afterSales.jpg?url";
|
|
|
+import afterSalesUrl from "../assets/images/h8.png?url";
|
|
|
import indexImg4BacksUrl from "../assets/images/index_img4_backs.png?url";
|
|
|
import indexBack2Url from "../assets/images/index_back2.png?url";
|
|
|
-import jiaohuIconUrl from "../assets/images/jiaohu.png?url";
|
|
|
-import planIconUrl from "../assets/images/方案.png?url";
|
|
|
-import caseIconUrl from "../assets/images/案例.png?url";
|
|
|
+import jiaohuIconUrl from "../assets/images/h1.png?url";
|
|
|
+import h3 from "../assets/images/h3.png?url";
|
|
|
+import h4 from "../assets/images/h4.png?url";
|
|
|
+import h5 from "../assets/images/h5.png?url";
|
|
|
+import h6 from "../assets/images/h6.png?url";
|
|
|
+import h7 from "../assets/images/h7.png?url";
|
|
|
+import h8 from "../assets/images/h8.png?url";
|
|
|
+import h9 from "../assets/images/h9.png?url";
|
|
|
+import value1 from "../assets/images/value1.png?url";
|
|
|
+import value2 from "../assets/images/value2.png?url";
|
|
|
+import value3 from "../assets/images/value3.jpg?url";
|
|
|
+import value4 from "../assets/images/value4.png?url";
|
|
|
+import value5 from "../assets/images/value5.jpg?url";
|
|
|
+import jishu from "../assets/images/jishu.jpg?url";
|
|
|
+import planIconUrl from "../assets/images/h2.png?url";
|
|
|
import p1 from "../assets/images/p1.png?url";
|
|
|
import p2 from "../assets/images/p2.png?url";
|
|
|
// import p4 from "../assets/images/p4.png?url";
|
|
|
@@ -24,6 +36,11 @@ import sence3 from "../assets/images/sence3.png?url";
|
|
|
import sence from "../assets/images/sence.png?url";
|
|
|
import sence4 from "../assets/images/sence4.png?url";
|
|
|
import sence6 from "../assets/images/sence6.jpeg?url";
|
|
|
+import b1 from "../assets/images/b1.png";
|
|
|
+import b2 from "../assets/images/b2.png";
|
|
|
+import b3 from "../assets/images/b3.png";
|
|
|
+import b4 from "../assets/images/b4.png";
|
|
|
+import b5 from "../assets/images/b5.png";
|
|
|
import CountUp from "../components/motion/CountUp.vue";
|
|
|
import Reveal from "../components/motion/Reveal.vue";
|
|
|
import { computed, onBeforeUnmount, onMounted, ref } from "vue";
|
|
|
@@ -62,6 +79,38 @@ const slides = [
|
|
|
},
|
|
|
];
|
|
|
|
|
|
+const heroBottomTiles = [
|
|
|
+ {
|
|
|
+ icon: "lucide:package-check",
|
|
|
+ title: "解决方案",
|
|
|
+ desc: "一站式解决方案",
|
|
|
+ url: b1,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ icon: "lucide:layers",
|
|
|
+ title: "客户案例",
|
|
|
+ desc: "覆盖行业广泛",
|
|
|
+ url: b2,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ icon: "lucide:beaker",
|
|
|
+ title: "数据驱动",
|
|
|
+ desc: "数据资产驱动价值闭环",
|
|
|
+ url: b3,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ icon: "lucide:shield-check",
|
|
|
+ title: "量化指标",
|
|
|
+ desc: "数据指标可视化，清晰易懂",
|
|
|
+ url: b4,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ icon: "lucide:compass",
|
|
|
+ title: "设备运维",
|
|
|
+ url: b5,
|
|
|
+ },
|
|
|
+];
|
|
|
+
|
|
|
const activeIndex = ref(0);
|
|
|
const paused = ref(false);
|
|
|
const autoplayMs = 6500;
|
|
|
@@ -245,7 +294,8 @@ const cases = [
|
|
|
title: "采油厂",
|
|
|
desc: "生产运行监控、工况分析与异常处置闭环",
|
|
|
icon: "lucide:factory",
|
|
|
- cover: banner1Url,
|
|
|
+ cover: value1,
|
|
|
+ bg: value1,
|
|
|
detail:
|
|
|
"以井站数据为底座，构建日/周/月报、重点井监控与异常处置闭环，支撑提质增效。",
|
|
|
},
|
|
|
@@ -253,7 +303,8 @@ const cases = [
|
|
|
title: "集输站",
|
|
|
desc: "站库管网联动监测、压降异常识别与能效优化",
|
|
|
icon: "lucide:route",
|
|
|
- cover: banner2Url,
|
|
|
+ cover: value2,
|
|
|
+ bg: jishu,
|
|
|
detail:
|
|
|
"打通站库管网关键指标，实现压降/泄漏异常识别与能耗核算，持续优化运行策略。",
|
|
|
},
|
|
|
@@ -261,7 +312,8 @@ const cases = [
|
|
|
title: "注水注气",
|
|
|
desc: "注采平衡分析、配注优化与效果评估",
|
|
|
icon: "lucide:droplets",
|
|
|
- cover: banner3Url,
|
|
|
+ cover: value3,
|
|
|
+ bg: value3,
|
|
|
detail:
|
|
|
"构建注采指标体系与可视化分析，形成配注优化建议与效果评估闭环，支撑精细开发。",
|
|
|
},
|
|
|
@@ -269,13 +321,23 @@ const cases = [
|
|
|
title: "设备运维",
|
|
|
desc: "远程运维、预测维护与可靠性提升",
|
|
|
icon: "lucide:wrench",
|
|
|
- cover: afterSalesUrl,
|
|
|
+ cover: value4,
|
|
|
+ bg: value4,
|
|
|
detail:
|
|
|
"告警联动工单与知识库沉淀，结合预测维护模型，降低非计划停机与运维成本。",
|
|
|
},
|
|
|
+ {
|
|
|
+ title: "QHSE",
|
|
|
+ desc: "质量、健康、安全与环境管理体系",
|
|
|
+ icon: "ci:shield-check",
|
|
|
+ cover: value5,
|
|
|
+ bg: value5,
|
|
|
+ detail:
|
|
|
+ "全面的 QHSE 管理体系，确保产品质量、职业健康、生产安全与环境保护的协调发展。",
|
|
|
+ },
|
|
|
];
|
|
|
|
|
|
-const valueCaseActiveIndex = ref(-1);
|
|
|
+const valueCaseActiveIndex = ref(0);
|
|
|
function activateValueCase(index) {
|
|
|
valueCaseActiveIndex.value = index;
|
|
|
}
|
|
|
@@ -337,7 +399,21 @@ const marketActivities = [
|
|
|
},
|
|
|
];
|
|
|
|
|
|
-const partnerSources = [jiaohuIconUrl, planIconUrl, caseIconUrl];
|
|
|
+const partnerSources = [
|
|
|
+ jiaohuIconUrl,
|
|
|
+ planIconUrl,
|
|
|
+
|
|
|
+ h3,
|
|
|
+ h4,
|
|
|
+ h5,
|
|
|
+ h6,
|
|
|
+ h7,
|
|
|
+ h8,
|
|
|
+ h9,
|
|
|
+ // h10,
|
|
|
+ // h11,
|
|
|
+ // h12,
|
|
|
+];
|
|
|
const partners = Array.from({ length: 12 }).map((_, idx) => ({
|
|
|
id: idx + 1,
|
|
|
src: partnerSources[idx % partnerSources.length],
|
|
|
@@ -386,15 +462,6 @@ const partners = Array.from({ length: 12 }).map((_, idx) => ({
|
|
|
</div>
|
|
|
</Transition>
|
|
|
|
|
|
- <!-- <div class="hero__stats">
|
|
|
- <div v-for="item in highlights" :key="item.label" class="stat">
|
|
|
- <div class="stat__value">
|
|
|
- <CountUp :end="item.end" :suffix="item.suffix" />
|
|
|
- </div>
|
|
|
- <div class="stat__label muted">{{ item.label }}</div>
|
|
|
- </div>
|
|
|
- </div> -->
|
|
|
-
|
|
|
<div class="hero__controls" aria-label="首页轮播控制">
|
|
|
<div class="dots" role="tablist" aria-label="轮播指示器">
|
|
|
<button
|
|
|
@@ -414,18 +481,37 @@ const partners = Array.from({ length: 12 }).map((_, idx) => ({
|
|
|
</div>
|
|
|
</section>
|
|
|
|
|
|
- <section
|
|
|
- class="section capabilitiesBg"
|
|
|
- :style="{ backgroundImage: `url(${capabilitiesBgUrl})` }"
|
|
|
- >
|
|
|
+ <section class="heroStrip" aria-label="轮播图底部信息板块">
|
|
|
+ <div class="heroStrip__inner">
|
|
|
+ <div class="heroStripGrid" role="list">
|
|
|
+ <div
|
|
|
+ v-for="tile in heroBottomTiles"
|
|
|
+ :key="tile.title"
|
|
|
+ class="heroStripCard"
|
|
|
+ role="listitem"
|
|
|
+ :data-tone="tile.tone || 'default'"
|
|
|
+ >
|
|
|
+ <div class="heroStripIcon" aria-hidden="true">
|
|
|
+ <img :src="tile.url" alt="" style="width: 50px; height: 50px" />
|
|
|
+ </div>
|
|
|
+ <div style="display: flex; flex-direction: column">
|
|
|
+ <div class="heroStripTitle">{{ tile.title }}</div>
|
|
|
+ <div v-if="tile.desc" class="heroStripDesc">
|
|
|
+ {{ tile.desc }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </section>
|
|
|
+
|
|
|
+ <section class="section capabilitiesBg">
|
|
|
<div class="container">
|
|
|
<Reveal as="div" class="sectionHead" :delay="0">
|
|
|
<div style="display: flex; align-items: center">
|
|
|
- <!-- <img src="../assets/images/title1.png" alt="" /> -->
|
|
|
<h2 class="h2" style="padding: 0 30px">
|
|
|
数据驱动、形成油气价值闭环
|
|
|
</h2>
|
|
|
- <!-- <img src="../assets/images/title2.png" alt="" /> -->
|
|
|
</div>
|
|
|
</Reveal>
|
|
|
|
|
|
@@ -468,9 +554,7 @@ const partners = Array.from({ length: 12 }).map((_, idx) => ({
|
|
|
<Reveal as="div" class="sectionHead" :delay="0">
|
|
|
<div>
|
|
|
<div style="display: flex; align-items: center">
|
|
|
- <!-- <img src="../assets/images/title1.png" alt="" /> -->
|
|
|
<h2 class="h2" style="padding: 0 30px">覆盖油气生产全链路</h2>
|
|
|
- <!-- <img src="../assets/images/title2.png" alt="" /> -->
|
|
|
</div>
|
|
|
<div class="muted" style="text-align: center; padding-top: 20px">
|
|
|
从井场到站控，从数据到应用，按需组合，快速交付。
|
|
|
@@ -505,9 +589,7 @@ const partners = Array.from({ length: 12 }).map((_, idx) => ({
|
|
|
<div>
|
|
|
<Reveal as="div" class="sectionHead" :delay="0">
|
|
|
<div style="display: flex; align-items: center">
|
|
|
- <!-- <img src="../assets/images/title1.png" alt="" /> -->
|
|
|
<h2 class="h2" style="padding: 0 30px">面向场景的可复制实践</h2>
|
|
|
- <!-- <img src="../assets/images/title2.png" alt="" /> -->
|
|
|
</div>
|
|
|
</Reveal>
|
|
|
|
|
|
@@ -575,7 +657,11 @@ const partners = Array.from({ length: 12 }).map((_, idx) => ({
|
|
|
{{ solutions[solutionsTabIndex].desc }}
|
|
|
</div>
|
|
|
<RouterLink class="solutionsTabLink" to="/solutions">
|
|
|
- 了解更多 →
|
|
|
+ 了解更多<Icon
|
|
|
+ icon="lucide:chevron-right"
|
|
|
+ width="20"
|
|
|
+ height="20"
|
|
|
+ />
|
|
|
</RouterLink>
|
|
|
</div>
|
|
|
</Transition>
|
|
|
@@ -593,22 +679,38 @@ const partners = Array.from({ length: 12 }).map((_, idx) => ({
|
|
|
</div>
|
|
|
</section>
|
|
|
|
|
|
- <section class="section">
|
|
|
- <div class="container">
|
|
|
+ <section style="background-color: transparent; margin-top: 30px">
|
|
|
+ <div>
|
|
|
<Reveal as="div" class="sectionHead" :delay="0">
|
|
|
<div style="display: flex; align-items: center">
|
|
|
- <!-- <img src="../assets/images/title1.png" alt="" /> -->
|
|
|
<h2 class="h2" style="padding: 0 10px">用可量化指标呈现业务价值</h2>
|
|
|
- <!-- <img src="../assets/images/title2.png" alt="" /> -->
|
|
|
</div>
|
|
|
</Reveal>
|
|
|
+ <div style="display: flex; justify-content: center; margin-top: 20px">
|
|
|
+ <RouterLink class="btn btn-link" to="/cases"
|
|
|
+ >查看更多案例
|
|
|
+ <Icon icon="lucide:chevron-right" width="24" height="24"
|
|
|
+ /></RouterLink>
|
|
|
+ </div>
|
|
|
|
|
|
<div
|
|
|
class="valueAcc"
|
|
|
+ style="padding: 0 100px; height: 700px; margin-top: 20px"
|
|
|
role="list"
|
|
|
aria-label="业务价值横向手风琴"
|
|
|
- @mouseleave="activateValueCase(-1)"
|
|
|
>
|
|
|
+ <Transition name="fade" mode="out-in">
|
|
|
+ <div
|
|
|
+ v-if="valueCaseActiveIndex >= 0"
|
|
|
+ :key="valueCaseActiveIndex"
|
|
|
+ class="valueAccBg"
|
|
|
+ :style="{
|
|
|
+ backgroundImage: `url(${cases[valueCaseActiveIndex].bg})`,
|
|
|
+ }"
|
|
|
+ aria-hidden="true"
|
|
|
+ ></div>
|
|
|
+ </Transition>
|
|
|
+
|
|
|
<Reveal
|
|
|
v-for="(c, idx) in cases"
|
|
|
:key="c.title"
|
|
|
@@ -668,18 +770,11 @@ const partners = Array.from({ length: 12 }).map((_, idx) => ({
|
|
|
</div>
|
|
|
</Reveal>
|
|
|
</div>
|
|
|
-
|
|
|
- <div style="display: flex; justify-content: center; padding-top: 30px">
|
|
|
- <RouterLink class="btn btn-link" to="/cases"
|
|
|
- >查看更多案例
|
|
|
- <Icon icon="lucide:chevron-right" width="24" height="24"
|
|
|
- /></RouterLink>
|
|
|
- </div>
|
|
|
</div>
|
|
|
</section>
|
|
|
|
|
|
<!-- 平台更新与行业观点 - 左右两栏布局 -->
|
|
|
- <section class="section">
|
|
|
+ <section style="margin-top: 20px">
|
|
|
<div class="container">
|
|
|
<Reveal as="div" class="sectionHead" :delay="0">
|
|
|
<div>
|
|
|
@@ -865,6 +960,69 @@ const partners = Array.from({ length: 12 }).map((_, idx) => ({
|
|
|
</template>
|
|
|
|
|
|
<style scoped>
|
|
|
+.valueAcc {
|
|
|
+ margin-top: 8px;
|
|
|
+ display: flex;
|
|
|
+ gap: 0px;
|
|
|
+ height: 600px;
|
|
|
+ align-items: stretch;
|
|
|
+ position: relative;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+
|
|
|
+.valueAccBg {
|
|
|
+ position: absolute;
|
|
|
+ inset: 0;
|
|
|
+ background-size: cover;
|
|
|
+ background-position: center 100px;
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ z-index: 0;
|
|
|
+ transition: opacity ease;
|
|
|
+ height: 700px;
|
|
|
+ /* filter: blur(8px); */
|
|
|
+}
|
|
|
+
|
|
|
+.valueAccBg::after {
|
|
|
+ content: "";
|
|
|
+ position: absolute;
|
|
|
+ inset: 0;
|
|
|
+ background: linear-gradient(
|
|
|
+ to bottom,
|
|
|
+ rgba(248, 250, 252, 0) 0%,
|
|
|
+ rgba(248, 250, 252, 0) 40%,
|
|
|
+ rgba(248, 250, 252, 0.5) 65%,
|
|
|
+ rgba(248, 250, 252, 0.6) 80%,
|
|
|
+ rgba(248, 250, 252, 1) 90%,
|
|
|
+ rgba(248, 250, 252, 1) 95%,
|
|
|
+ #fff 100%
|
|
|
+ );
|
|
|
+ pointer-events: none;
|
|
|
+ /* backdrop-filter: blur(20px); */
|
|
|
+}
|
|
|
+
|
|
|
+.valueAccItem {
|
|
|
+ background: blue;
|
|
|
+ flex: 1 1 0%;
|
|
|
+ overflow: hidden;
|
|
|
+ height: 550px;
|
|
|
+ position: relative;
|
|
|
+ cursor: pointer;
|
|
|
+ transition:
|
|
|
+ flex 20ms cubic-bezier(0.22, 1, 0.36, 1),
|
|
|
+ transform 0ms ease;
|
|
|
+ min-width: 180px;
|
|
|
+ z-index: 1;
|
|
|
+}
|
|
|
+
|
|
|
+.fade-enter-active,
|
|
|
+.fade-leave-active {
|
|
|
+ transition: opacity 100ms ease;
|
|
|
+}
|
|
|
+
|
|
|
+.fade-enter-from,
|
|
|
+.fade-leave-to {
|
|
|
+ opacity: 0;
|
|
|
+}
|
|
|
.hero {
|
|
|
position: relative;
|
|
|
padding: 54px 0 28px;
|
|
|
@@ -1064,6 +1222,145 @@ const partners = Array.from({ length: 12 }).map((_, idx) => ({
|
|
|
transform: translate3d(0, 10px, 0);
|
|
|
}
|
|
|
|
|
|
+.heroStrip {
|
|
|
+ position: relative;
|
|
|
+ z-index: 3;
|
|
|
+ border: none;
|
|
|
+ padding: 0 0 26px;
|
|
|
+}
|
|
|
+
|
|
|
+.heroStrip__inner {
|
|
|
+ padding-top: 0;
|
|
|
+ padding-left: 150px;
|
|
|
+ padding-right: 150px;
|
|
|
+ background-image: url("../assets/images/bgblue.jpg");
|
|
|
+ background-size: cover;
|
|
|
+ background-position: center;
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ filter: blur(0.1);
|
|
|
+ color: #ffffff;
|
|
|
+}
|
|
|
+
|
|
|
+.heroStripGrid {
|
|
|
+ display: grid;
|
|
|
+ grid-template-columns: repeat(5, minmax(0, 1fr));
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+
|
|
|
+.heroStripCard {
|
|
|
+ position: relative;
|
|
|
+ padding: 18px 16px 16px;
|
|
|
+ min-height: 128px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ text-align: left;
|
|
|
+ gap: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.heroStripCard::after {
|
|
|
+ content: "";
|
|
|
+ position: absolute;
|
|
|
+ inset: 0;
|
|
|
+ background:
|
|
|
+ radial-gradient(
|
|
|
+ 260px 120px at 50% 0%,
|
|
|
+ rgba(37, 99, 235, 0.08),
|
|
|
+ transparent 60%
|
|
|
+ ),
|
|
|
+ radial-gradient(
|
|
|
+ 220px 140px at 85% 70%,
|
|
|
+ rgba(56, 189, 248, 0.06),
|
|
|
+ transparent 65%
|
|
|
+ );
|
|
|
+ opacity: 0.9;
|
|
|
+ pointer-events: none;
|
|
|
+}
|
|
|
+
|
|
|
+.heroStripIcon {
|
|
|
+ /* width: 54px;
|
|
|
+ height: 54px; */
|
|
|
+ display: grid;
|
|
|
+ place-items: center;
|
|
|
+ transform: translateY(-10px);
|
|
|
+ margin-bottom: -2px;
|
|
|
+ position: relative;
|
|
|
+ z-index: 1;
|
|
|
+}
|
|
|
+
|
|
|
+.heroStripTitle {
|
|
|
+ position: relative;
|
|
|
+ z-index: 1;
|
|
|
+ margin-top: 6px;
|
|
|
+
|
|
|
+ letter-spacing: -0.02em;
|
|
|
+ font-size: 18px;
|
|
|
+ line-height: 1.35;
|
|
|
+}
|
|
|
+
|
|
|
+.heroStripCard[data-tone="accent"] .heroStripTitle {
|
|
|
+ color: rgba(255, 255, 255, 0.96);
|
|
|
+}
|
|
|
+
|
|
|
+.heroStripDesc {
|
|
|
+ position: relative;
|
|
|
+ z-index: 1;
|
|
|
+ margin-top: 10px;
|
|
|
+ font-size: 12px;
|
|
|
+ line-height: 1.45;
|
|
|
+ color: rgba(255, 255, 255, 0.88);
|
|
|
+ opacity: 0.98;
|
|
|
+}
|
|
|
+
|
|
|
+.heroStripCard:hover {
|
|
|
+ transform: translateY(-2px);
|
|
|
+ filter: saturate(1.02);
|
|
|
+}
|
|
|
+
|
|
|
+.heroStripCard[data-tone="accent"]:hover {
|
|
|
+ transform: translateY(-2px);
|
|
|
+ filter: brightness(1.03) saturate(1.06);
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 960px) {
|
|
|
+ .heroStrip {
|
|
|
+ margin-top: -18px;
|
|
|
+ padding-bottom: 20px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .heroStripGrid {
|
|
|
+ grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
|
+ gap: 10px;
|
|
|
+ border: 0;
|
|
|
+ overflow: visible;
|
|
|
+ border-radius: 0;
|
|
|
+ background: transparent;
|
|
|
+ box-shadow: none;
|
|
|
+ backdrop-filter: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ .heroStripCard {
|
|
|
+ border: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ .heroStripCard:not(:first-child) {
|
|
|
+ border-left: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ .heroStripIcon {
|
|
|
+ transform: translateY(-8px);
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 520px) {
|
|
|
+ .heroStripGrid {
|
|
|
+ grid-template-columns: 1fr;
|
|
|
+ }
|
|
|
+
|
|
|
+ .heroStrip {
|
|
|
+ margin-top: -14px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
.kickerIcon {
|
|
|
width: 18px;
|
|
|
height: 18px;
|
|
|
@@ -1449,7 +1746,7 @@ const partners = Array.from({ length: 12 }).map((_, idx) => ({
|
|
|
.valueAcc {
|
|
|
margin-top: 8px;
|
|
|
display: flex;
|
|
|
- gap: 18px;
|
|
|
+ gap: 10px;
|
|
|
height: 580px;
|
|
|
align-items: stretch;
|
|
|
}
|
|
|
@@ -1513,17 +1810,7 @@ const partners = Array.from({ length: 12 }).map((_, idx) => ({
|
|
|
content: "";
|
|
|
position: absolute;
|
|
|
inset: 0;
|
|
|
- background:
|
|
|
- radial-gradient(
|
|
|
- 900px circle at 100% 0%,
|
|
|
- rgba(37, 99, 235, 0.18),
|
|
|
- transparent 55%
|
|
|
- ),
|
|
|
- linear-gradient(
|
|
|
- 180deg,
|
|
|
- rgba(248, 250, 252, 0.92),
|
|
|
- rgba(248, 250, 252, 0.86)
|
|
|
- );
|
|
|
+
|
|
|
pointer-events: none;
|
|
|
z-index: 0;
|
|
|
}
|
|
|
@@ -1539,14 +1826,12 @@ const partners = Array.from({ length: 12 }).map((_, idx) => ({
|
|
|
border-radius: 18px;
|
|
|
display: grid;
|
|
|
place-items: center;
|
|
|
- /* border: 1px solid rgba(15, 23, 42, 0.08);
|
|
|
- background: rgba(255, 255, 255, 0.65); */
|
|
|
+
|
|
|
color: var(--slate-800);
|
|
|
}
|
|
|
|
|
|
.valueAccTitle {
|
|
|
font-size: 22px;
|
|
|
- font-weight: 950;
|
|
|
letter-spacing: -0.03em;
|
|
|
}
|
|
|
|
|
|
@@ -1634,7 +1919,7 @@ const partners = Array.from({ length: 12 }).map((_, idx) => ({
|
|
|
|
|
|
.valueAccBottomTitle {
|
|
|
font-size: 26px;
|
|
|
- font-weight: 950;
|
|
|
+ /* font-weight: 950; */
|
|
|
letter-spacing: -0.03em;
|
|
|
}
|
|
|
|
|
|
@@ -1652,10 +1937,10 @@ const partners = Array.from({ length: 12 }).map((_, idx) => ({
|
|
|
justify-content: center;
|
|
|
width: 128px;
|
|
|
height: 44px;
|
|
|
- border-radius: 12px;
|
|
|
+
|
|
|
background: rgba(255, 255, 255, 0.92);
|
|
|
color: #0b63ff;
|
|
|
- font-weight: 850;
|
|
|
+
|
|
|
border: 1px solid rgba(255, 255, 255, 0.32);
|
|
|
}
|
|
|
|
|
|
@@ -2189,8 +2474,8 @@ const partners = Array.from({ length: 12 }).map((_, idx) => ({
|
|
|
|
|
|
.solutionsTabContainer {
|
|
|
margin-top: 10px;
|
|
|
-
|
|
|
padding: 30px;
|
|
|
+ padding-bottom: 0;
|
|
|
padding-left: 0;
|
|
|
padding-right: 0;
|
|
|
}
|
|
|
@@ -2230,18 +2515,18 @@ const partners = Array.from({ length: 12 }).map((_, idx) => ({
|
|
|
|
|
|
.solutionsTabBtn.active {
|
|
|
color: var(--brand-700);
|
|
|
- /* border-bottom-color: var(--brand-700); */
|
|
|
+
|
|
|
background-image: linear-gradient(
|
|
|
to bottom,
|
|
|
- rgba(37, 99, 235, 0.8),
|
|
|
- rgba(37, 99, 235, 0.2)
|
|
|
+ rgba(37, 99, 235, 1),
|
|
|
+ rgba(37, 99, 235, 0.3)
|
|
|
);
|
|
|
- /* background: rgba(37, 99, 235, 0.06); */
|
|
|
}
|
|
|
|
|
|
.solutionsTabContent {
|
|
|
min-height: 420px;
|
|
|
margin-top: 2px;
|
|
|
+ box-shadow: 0 4px 16px rgba(15, 23, 42, 0.08);
|
|
|
}
|
|
|
|
|
|
.solutionsTabInner {
|
