/* Home */
.hero--home { position: relative; min-height: 760px; overflow: hidden; padding: 92px 0 98px; }
.hero__grid-bg { position: absolute; inset: 0; opacity: .4; background-image: linear-gradient(rgba(130, 173, 220, .055) 1px, transparent 1px), linear-gradient(90deg, rgba(130, 173, 220, .055) 1px, transparent 1px); background-size: 58px 58px; mask-image: linear-gradient(to bottom, #000 0, transparent 86%); }
.hero--home::before { position: absolute; top: -130px; left: -170px; width: 640px; height: 640px; border-radius: 50%; background: rgba(22, 136, 255, .15); filter: blur(110px); content: ""; }
.hero--home::after { position: absolute; top: -200px; right: -270px; width: 680px; height: 680px; border-radius: 50%; background: rgba(0, 194, 255, .09); filter: blur(120px); content: ""; }
.hero__grid { position: relative; z-index: 2; display: grid; grid-template-columns: .94fr 1.06fr; align-items: center; gap: 65px; }
.hero__copy h1 { max-width: 720px; margin-bottom: 25px; font-size: clamp(3.3rem, 6.6vw, 6.25rem); }
.hero__copy h1 span { color: transparent; background: linear-gradient(90deg, #4ee2ff, #1688ff 50%, #a5baff); background-clip: text; -webkit-background-clip: text; }
.hero__lead { max-width: 670px; margin-bottom: 0; color: var(--text-soft); font-size: clamp(1.03rem, 1.7vw, 1.22rem); line-height: 1.72; }
.hero__assurances { display: flex; flex-wrap: wrap; gap: 16px 22px; margin-top: 29px; color: var(--muted); font-size: .76rem; font-weight: 720; }
.hero__assurances span { display: inline-flex; align-items: center; gap: 7px; }
.hero__assurances .icon { color: var(--accent-2); }

.product-stage { --tilt-x: 0deg; --tilt-y: 0deg; position: relative; min-width: 0; perspective: 1200px; }
.product-stage__glow { position: absolute; inset: 10% 4% 3%; border-radius: 35%; background: rgba(22, 136, 255, .26); filter: blur(75px); }
.product-window { position: relative; z-index: 2; overflow: hidden; border: 1px solid rgba(107, 176, 255, .3); border-radius: 22px; background: rgba(7, 19, 34, .94); box-shadow: 0 45px 100px rgba(0, 0, 0, .48), 0 0 0 1px rgba(255, 255, 255, .025) inset; transform: rotateX(var(--tilt-x)) rotateY(var(--tilt-y)); transform-style: preserve-3d; transition: transform .18s ease-out; }
:root[data-theme="light"] .product-window { background: rgba(248, 252, 255, .97); box-shadow: 0 42px 90px rgba(33, 65, 103, .18); }
.product-window__bar { display: flex; align-items: center; justify-content: space-between; gap: 15px; min-height: 52px; padding: 0 18px; border-bottom: 1px solid var(--border); background: rgba(3, 12, 22, .38); font-size: .72rem; }
:root[data-theme="light"] .product-window__bar { background: #eef6fd; }
.product-window__brand { display: inline-flex; align-items: center; gap: 7px; font-weight: 770; }
.product-window__brand img { width: 28px; height: 28px; }
.live-indicator { display: inline-flex; align-items: center; gap: 7px; color: var(--success); font-size: .66rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.live-indicator i { width: 7px; height: 7px; border-radius: 50%; background: var(--success); box-shadow: 0 0 13px var(--success); animation: livePulse 1.7s ease infinite; }
.product-window__body { padding: 20px; }
.flow-label { margin-bottom: 13px; color: var(--muted-2); font-size: .61rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.transaction-flow { display: grid; grid-template-columns: 1fr 54px 1fr 54px 1fr; align-items: center; gap: 4px; }
.flow-node { display: grid; place-items: center; min-height: 104px; padding: 14px 8px; border: 1px solid var(--border); border-radius: 14px; background: linear-gradient(145deg, rgba(22, 136, 255, .1), rgba(11, 31, 54, .5)); text-align: center; }
:root[data-theme="light"] .flow-node { background: linear-gradient(145deg, rgba(15, 95, 255, .07), rgba(255, 255, 255, .76)); }
.flow-node > span { display: grid; place-items: center; width: 37px; height: 37px; margin-bottom: 7px; border: 1px solid rgba(51, 164, 255, .32); border-radius: 11px; color: var(--accent-2); background: rgba(22, 136, 255, .1); }
.flow-node small { color: var(--muted-2); font-size: .52rem; font-weight: 800; letter-spacing: .13em; }
.flow-node strong { margin-top: 2px; font-size: .82rem; }
.flow-node--network > span { color: #73e5ff; }.flow-node--issuer > span { color: #9dbbff; }
.flow-line { position: relative; height: 2px; overflow: visible; background: linear-gradient(90deg, rgba(22, 136, 255, .18), var(--accent), rgba(0, 194, 255, .18)); }
.flow-line::after { position: absolute; top: 50%; right: 0; width: 7px; height: 7px; border-top: 2px solid var(--accent-2); border-right: 2px solid var(--accent-2); content: ""; transform: translateY(-50%) rotate(45deg); }
.flow-line i { position: absolute; top: -3px; left: -5px; width: 8px; height: 8px; border-radius: 50%; background: var(--accent-2); box-shadow: 0 0 14px var(--accent-2); animation: transactionPacket 2.4s linear infinite; }
.flow-line--delay i { animation-delay: 1.2s; }
.flow-line b { position: absolute; inset: -7px 0; opacity: .35; background: linear-gradient(90deg, transparent, rgba(0,194,255,.35), transparent); filter: blur(6px); }
.product-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; margin-top: 12px; }
.product-metrics > div { display: grid; gap: 2px; padding: 12px; border: 1px solid var(--border); border-radius: 12px; background: rgba(6, 17, 30, .48); }
:root[data-theme="light"] .product-metrics > div { background: rgba(238, 246, 253, .7); }
.product-metrics span { color: var(--muted-2); font-size: .57rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.product-metrics strong { font-size: .83rem; }.product-metrics small { color: var(--muted); font-size: .57rem; }
.pulse-chart { position: relative; height: 164px; margin-top: 12px; overflow: hidden; border: 1px solid var(--border); border-radius: 13px; background-image: linear-gradient(rgba(130, 173, 220, .065) 1px, transparent 1px), linear-gradient(90deg, rgba(130, 173, 220, .065) 1px, transparent 1px); background-size: 100% 36px, 62px 100%; }
.pulse-chart__legend { position: absolute; z-index: 2; top: 9px; left: 11px; display: flex; gap: 13px; color: var(--muted); font-size: .53rem; }
.pulse-chart__legend span { display: inline-flex; align-items: center; gap: 5px; }.pulse-chart__legend i { width: 7px; height: 2px; background: var(--accent); }.pulse-chart__legend span:last-child i { background: var(--accent-2); }
.pulse-chart svg { position: absolute; inset: 19px 0 0; width: 100%; height: calc(100% - 19px); overflow: visible; }
.chart-line { fill: none; stroke: var(--accent); stroke-width: 3; vector-effect: non-scaling-stroke; filter: drop-shadow(0 0 5px rgba(22,136,255,.55)); }
.chart-line--secondary { stroke: var(--accent-2); stroke-width: 1.8; opacity: .75; }
.stage-chip { position: absolute; z-index: 3; display: inline-flex; align-items: center; gap: 7px; padding: 9px 12px; border: 1px solid var(--border-strong); border-radius: 10px; background: rgba(7, 20, 36, .93); color: var(--text-soft); font-size: .66rem; font-weight: 780; box-shadow: var(--shadow-soft); backdrop-filter: blur(12px); }
:root[data-theme="light"] .stage-chip { background: rgba(255,255,255,.95); }
.stage-chip .icon { color: var(--accent-2); }.stage-chip--one { top: 14%; left: -26px; }.stage-chip--two { right: -20px; bottom: 12%; }

.audience-strip { position: relative; z-index: 4; border-block: 1px solid var(--border); background: rgba(3, 12, 22, .36); }
:root[data-theme="light"] .audience-strip { background: rgba(255,255,255,.42); }
.audience-strip .shell { display: flex; align-items: center; gap: 35px; min-height: 78px; }
.audience-strip .shell > span { flex: 0 0 auto; color: var(--muted-2); font-size: .66rem; font-weight: 850; letter-spacing: .15em; text-transform: uppercase; }
.audience-strip .shell > div { display: flex; align-items: center; justify-content: space-between; width: 100%; gap: 15px; color: var(--text-soft); font-size: .82rem; }
.audience-strip i { width: 3px; height: 3px; border-radius: 50%; background: var(--accent-2); opacity: .7; }

.section--operator { background: linear-gradient(to bottom, transparent, rgba(6, 19, 33, .35), transparent); }
.operator-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.operator-card { position: relative; min-height: 340px; padding: 26px; overflow: hidden; border: 1px solid var(--border); border-radius: 21px; background: linear-gradient(155deg, rgba(18, 39, 68, .84), rgba(7, 20, 36, .7)); box-shadow: var(--shadow-soft); transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; }
:root[data-theme="light"] .operator-card { background: linear-gradient(155deg, #fff, #f2f8fe); }
.operator-card::before { position: absolute; right: -55px; bottom: -70px; width: 170px; height: 170px; border: 1px solid rgba(22, 136, 255, .18); border-radius: 50%; content: ""; }
