:root {
  --navy: #08243c;
  --navy-2: #0d314f;
  --blue: #0b5e97;
  --blue-2: #1784bd;
  --cyan: #56b9d8;
  --green: #2b755e;
  --ink: #10202e;
  --muted: #5c6c78;
  --line: #dce4e9;
  --soft: #f3f6f8;
  --white: #fff;
  --radius: 6px;
  --container: 1240px;
  --shadow: 0 18px 48px rgba(8, 36, 60, 0.1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--white); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif; font-size: 16px; line-height: 1.6; letter-spacing: 0; }
body.nav-open { overflow: hidden; }
img, svg { display: block; }
img { max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button { color: inherit; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible { outline: 3px solid #f2b84b; outline-offset: 3px; }
.container { width: min(calc(100% - 48px), var(--container)); margin-inline: auto; }
.topbar { height: 34px; color: rgba(255,255,255,.76); background: #061a2a; font-size: .75rem; }
.topbar .container { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: 24px; }

.site-header { position: absolute; top: 34px; left: 0; z-index: 50; width: 100%; height: 78px; display: flex; align-items: center; justify-content: space-between; padding: 0 max(24px, calc((100vw - var(--container)) / 2)); color: var(--white); border-bottom: 1px solid rgba(255,255,255,.17); transition: background .2s ease, color .2s ease, height .2s ease; }
.site-header.is-scrolled, .site-header.inner-header { position: fixed; top: 0; height: 70px; color: var(--ink); background: rgba(255,255,255,.97); border-bottom-color: var(--line); box-shadow: 0 8px 24px rgba(8,36,60,.06); backdrop-filter: blur(14px); }
.brand { display: inline-flex; align-items: center; gap: 12px; min-width: 235px; }
.brand-mark { width: 44px; height: 44px; overflow: hidden; display: grid; place-items: center; border-radius: 4px; background: #fff; }
.brand-mark img { width: 100%; height: 100%; object-fit: cover; }
.brand-text strong, .brand-text small { display: block; line-height: 1; }
.brand-text strong { font-size: 1rem; font-weight: 850; }
.brand-text small { margin-top: 6px; font-size: .58rem; letter-spacing: .12em; opacity: .68; }
.nav { display: flex; align-items: center; gap: 24px; font-size: .88rem; font-weight: 680; }
.nav > a:not(.nav-cta) { position: relative; white-space: nowrap; }
.nav > a:not(.nav-cta)::after { position: absolute; right: 0; bottom: -10px; left: 0; height: 2px; background: var(--cyan); content: ""; transform: scaleX(0); transform-origin: left; transition: transform .18s ease; }
.nav > a:hover::after { transform: scaleX(1); }
.nav-cta { min-height: 42px; display: inline-flex; align-items: center; gap: 10px; padding: 0 16px; color: var(--white) !important; background: var(--blue); border-radius: 3px; }
.nav-group { position: relative; }
.nav-group-toggle { min-height: 42px; display: inline-flex; align-items: center; gap: 6px; padding: 0; color: inherit; border: 0; background: transparent; cursor: pointer; font-weight: inherit; white-space: nowrap; }
.nav-group-toggle span { font-size: .78rem; transition: transform .18s ease; }
.nav-group.is-open .nav-group-toggle span { transform: rotate(180deg); }
.nav-submenu { position: absolute; top: calc(100% + 16px); left: -18px; width: 300px; display: grid; padding: 10px; color: var(--ink); border: 1px solid var(--line); background: #fff; box-shadow: var(--shadow); visibility: hidden; opacity: 0; transform: translateY(-8px); pointer-events: none; transition: .18s ease; }
.nav-submenu a { min-height: 46px; display: flex; align-items: center; padding: 8px 12px; border-radius: 3px; line-height: 1.3; }
.nav-submenu a:hover, .nav-submenu a:focus-visible { color: var(--blue); background: var(--soft); }
.nav-group.is-open .nav-submenu { visibility: visible; opacity: 1; transform: translateY(0); pointer-events: auto; }
.nav-toggle { display: none; width: 42px; height: 42px; padding: 0; color: currentColor; background: transparent; border: 1px solid currentColor; border-radius: 3px; }
.nav-toggle span { width: 18px; height: 2px; display: block; margin: 0 auto 5px; background: currentColor; }
.nav-toggle span:last-child { margin-bottom: 0; }

.hero { position: relative; min-height: calc(100svh - 34px); overflow: hidden; color: var(--white); background: var(--navy); }
.hero-bg, .hero-overlay { position: absolute; inset: 0; }
.hero-bg { background: url("public/images/home-v3/home-hero-integrated-power-energy.webp") center / cover no-repeat; transform: scale(1.01); }
.hero-overlay { background: linear-gradient(90deg, rgba(4,20,33,.98) 0%, rgba(4,20,33,.91) 40%, rgba(4,20,33,.24) 77%), linear-gradient(0deg, rgba(4,20,33,.68), transparent 58%); }
.hero-inner { position: relative; z-index: 2; min-height: calc(100svh - 34px); display: grid; grid-template-columns: minmax(0, 1.13fr) minmax(360px, .7fr); align-items: end; gap: 48px; padding-top: 150px; padding-bottom: 76px; }
.hero-copy { max-width: 820px; }
.eyebrow { margin: 0 0 14px; color: var(--blue); font-size: .76rem; font-weight: 850; letter-spacing: .13em; text-transform: uppercase; }
.eyebrow.light { color: #8dd2eb; }
.hero h1 { margin: 0; max-width: 820px; font-size: clamp(3rem, 4.15vw, 4.45rem); line-height: 1.02; font-weight: 760; overflow-wrap: break-word; }
.hero-subtitle { margin: 26px 0 0; color: #8dd2eb; font-size: 1.32rem; font-weight: 700; }
.hero-lede { max-width: 730px; margin: 16px 0 0; color: rgba(255,255,255,.76); font-size: 1.06rem; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }
.hero-resource-status { min-height: 50px; display: inline-flex; align-items: center; padding: 0 4px; color: rgba(255,255,255,.72); font-size: .85rem; font-weight: 720; }
.button { min-height: 50px; display: inline-flex; align-items: center; justify-content: center; gap: 12px; padding: 0 20px; border: 1px solid transparent; border-radius: 3px; background: transparent; font-weight: 760; cursor: pointer; transition: transform .18s ease, background .18s ease, border-color .18s ease; }
.button:hover { transform: translateY(-2px); }
.button.primary { color: #fff; background: var(--blue); border-color: var(--blue); }
.button.ghost { color: #fff; border-color: rgba(255,255,255,.45); background: rgba(255,255,255,.07); }
.button.dark { color: #fff; background: var(--navy); }
.button.white { color: var(--navy); background: #fff; }
.button.outline { color: #fff; border-color: rgba(255,255,255,.45); }
.button.full { width: 100%; }
.hero-proof { align-self: end; padding: 7px 22px; border: 1px solid rgba(255,255,255,.2); border-radius: var(--radius); background: rgba(5,28,46,.7); backdrop-filter: blur(14px); }
.hero-proof > div { min-height: 92px; display: flex; align-items: flex-start; gap: 14px; padding: 15px 0; border-bottom: 1px solid rgba(255,255,255,.14); }
.hero-proof > div:last-child { border-bottom: 0; }
.hero-proof > div > div { min-width: 0; }
.hero-proof strong { display: block; font-size: .875rem; line-height: 1.3; }
.hero-proof p { margin: 6px 0 0; color: rgba(255,255,255,.76); font-size: .8125rem; line-height: 1.4; }
.proof-number { width: 28px; height: 28px; display: grid; flex: 0 0 auto; place-items: center; color: var(--navy); background: #8dd2eb; border-radius: 50%; font-size: .68rem; font-weight: 900; }
.scroll-cue { position: absolute; right: max(24px, calc((100vw - var(--container)) / 2)); bottom: 30px; z-index: 3; display: flex; align-items: center; gap: 12px; color: rgba(255,255,255,.62); font-size: .68rem; letter-spacing: .14em; text-transform: uppercase; }
.scroll-cue i { width: 46px; height: 1px; display: block; background: #8dd2eb; }

.stats-band { position: relative; z-index: 4; color: #fff; background: var(--blue); }
.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.stats-grid article { min-height: 126px; display: grid; align-content: center; gap: 6px; padding: 20px 26px; border-right: 1px solid rgba(255,255,255,.17); }
.stats-grid article:last-child { border-right: 0; }
.stats-grid strong { font-size: 1.05rem; line-height: 1.2; }
.stats-grid span { color: rgba(255,255,255,.72); font-size: .82rem; line-height: 1.35; }

.section { padding: 108px 0; }
.section-intro { display: grid; grid-template-columns: minmax(0, .9fr) minmax(300px, .58fr); gap: 90px; align-items: end; margin-bottom: 46px; }
.section-intro h2, .section-heading h2, .partner-copy h2, .resource-layout h2, .faq-layout h2, .cta-band h2, .page-hero h1, .content-hero h1 { margin: 0; font-size: clamp(2.35rem, 4vw, 3.8rem); line-height: 1.08; font-weight: 730; }
.section-intro > p, .section-heading > p:last-child, .partner-copy > p, .resource-layout > div > p, .faq-layout > div > p { margin: 0; color: var(--muted); font-size: 1.02rem; }
.section-intro.inverse h2, .section-intro.inverse > p { color: #fff; }
.section-intro.inverse > p { color: rgba(255,255,255,.67); }
.section-heading { max-width: 760px; margin-bottom: 44px; }

.product-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.product-card { overflow: hidden; min-height: 440px; display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.product-card:hover { transform: translateY(-5px); border-color: #b7cedb; box-shadow: var(--shadow); }
.product-card img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; object-position: center; }
.product-card .renewable-card-image { object-position: center 46%; }
.card-copy { display: flex; flex: 1; flex-direction: column; padding: 24px; }
.card-copy > span { color: var(--blue); font-size: .68rem; font-weight: 850; letter-spacing: .1em; }
.card-copy h3 { margin: 12px 0 9px; font-size: 1.22rem; line-height: 1.25; }
.card-copy p { margin: 0; color: var(--muted); font-size: .92rem; }
.card-copy b { margin-top: auto; padding-top: 22px; color: var(--blue); font-size: .85rem; }
.card-copy i { margin-left: 5px; font-style: normal; }

.solutions-section { color: #fff; background: var(--navy); }
.solution-grid { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid rgba(255,255,255,.16); border-left: 1px solid rgba(255,255,255,.16); }
.solution-grid article { min-height: 325px; display: flex; flex-direction: column; padding: 34px; border-right: 1px solid rgba(255,255,255,.16); border-bottom: 1px solid rgba(255,255,255,.16); background: rgba(255,255,255,.03); }
.solution-grid article > span { color: #8dd2eb; font-size: .74rem; font-weight: 850; }
.solution-grid h3 { margin: 54px 0 14px; font-size: 1.5rem; }
.solution-grid p { margin: 0; color: rgba(255,255,255,.68); }
.solution-grid a { margin-top: auto; padding-top: 26px; color: #8dd2eb; font-weight: 700; }

.flagship-section { background: #fff; }
.system-scope-layout { display: grid; grid-template-columns: minmax(360px, .72fr) minmax(620px, 1.28fr); gap: 56px; align-items: center; }
.system-scope-copy h2 { margin: 0; font-size: clamp(2.35rem, 4vw, 3.8rem); line-height: 1.08; }
.system-scope-copy > p:not(.eyebrow) { margin: 22px 0 0; color: var(--muted); }
.integration-modules { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 30px; }
.integration-modules article { min-height: 76px; display: flex; align-items: center; gap: 12px; padding: 13px; border: 1px solid var(--line); background: var(--soft); }
.module-icon { width: 30px; height: 30px; display: grid; flex: 0 0 auto; place-items: center; color: #fff; background: var(--blue); border-radius: 50%; font-size: .68rem; font-weight: 900; }
.integration-modules h3 { margin: 0; font-size: .82rem; line-height: 1.3; }
.power-system-diagram { padding: 28px; overflow: hidden; border: 1px solid #cbdbe4; background: linear-gradient(145deg, #f5f9fb, #eaf2f6); box-shadow: 0 20px 54px rgba(8,36,60,.08); }
.diagram-label { margin: 0 0 12px; color: var(--blue); font-size: .67rem; font-weight: 900; letter-spacing: .12em; }
.system-main-chain, .bess-chain { display: flex; align-items: stretch; }
.system-main-chain > .system-node, .bess-chain > span { position: relative; min-width: 0; display: grid; flex: 1 1 0; place-items: center; padding: 12px 9px; color: var(--navy); text-align: center; border: 1px solid #c4d6e0; background: #fff; font-size: .78rem; font-weight: 820; line-height: 1.32; }
.system-main-chain > .system-node:not(:last-child), .bess-chain > span:not(:last-child) { margin-right: 20px; }
.system-main-chain > .system-node:not(:last-child)::after, .bess-chain > span:not(:last-child)::after { position: absolute; top: 50%; right: -18px; width: 14px; color: var(--blue); content: "→"; transform: translateY(-50%); font-size: 1rem; line-height: 1; }
.mobile-branch-junction, .bess-branch-mobile { display: none; }
.desktop-bess-link { position: relative; height: 72px; margin-top: 4px; }
.desktop-bess-link svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.desktop-bess-link path { fill: none; stroke: var(--blue); stroke-width: 2; stroke-dasharray: 8 7; vector-effect: non-scaling-stroke; }
.desktop-bess-link marker path { fill: var(--blue); stroke: none; }
.desktop-bess-link > span { position: absolute; top: 26px; left: 48%; padding: 3px 8px; color: var(--blue); background: #eef5f8; font-size: .66rem; font-weight: 850; letter-spacing: .08em; }
.bess-branch { position: relative; padding: 20px; border: 1px dashed #6e9fbb; background: rgba(255,255,255,.78); }
.bess-chain { max-width: none; }
.bess-chain > span { min-height: 64px; font-size: .78rem; }
.bess-branch-desktop .bess-chain > span:last-child::before { position: absolute; top: -52px; left: 50%; height: 52px; border-left: 2px dashed var(--blue); content: ""; transform: translateX(-50%); }
.bess-branch small { display: block; margin-top: 12px; color: var(--muted); font-size: .78rem; font-weight: 700; line-height: 1.45; }
.keep-together { white-space: nowrap; }

.boundary-section { background: #eef4f7; }
.responsibility-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.responsibility-grid article { padding: 28px; border-top: 4px solid var(--blue); background: #fff; box-shadow: 0 10px 30px rgba(8,36,60,.05); }
.responsibility-grid span { color: var(--blue); font-size: .7rem; font-weight: 850; letter-spacing: .11em; }
.responsibility-grid h3 { margin: 24px 0 10px; font-size: 1.2rem; }
.responsibility-grid p { margin: 0; color: var(--muted); }

.equipment-scope-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.equipment-scope-grid article { padding: 26px; border: 1px solid var(--line); background: #fff; }
.equipment-scope-grid article > span { color: var(--blue); font-size: .7rem; font-weight: 850; letter-spacing: .1em; }
.equipment-scope-grid h3 { margin: 18px 0 12px; }
.equipment-scope-grid ul { margin: 0; padding-left: 20px; color: var(--muted); }
.boundary-callout { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.boundary-callout p { margin: 0; padding: 28px; border-left: 4px solid var(--blue); background: #fff; color: var(--ink); font-size: 1.02rem; }
.rfq-input-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.rfq-input-list span { padding: 14px 16px; border: 1px solid var(--line); background: #fff; font-weight: 680; }
.pv-workflow { grid-template-columns: repeat(4, 1fr); }

.partner-section { background: var(--soft); }
.partner-layout { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(340px, .82fr); align-items: center; gap: 72px; }
.partner-image { position: relative; }
.partner-image > img { width: 100%; min-height: 500px; object-fit: cover; }
.image-note { position: absolute; right: 0; bottom: 0; width: min(330px, 78%); padding: 22px; color: #fff; background: var(--blue); }
.image-note span { display: block; font-size: .68rem; font-weight: 850; letter-spacing: .12em; }
.image-note strong { display: block; margin-top: 9px; line-height: 1.35; }
.partner-copy > p { margin-top: 22px; }
.tick-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin: 30px 0; }
.tick-grid span { position: relative; padding: 12px 12px 12px 34px; background: #fff; border: 1px solid var(--line); font-size: .88rem; font-weight: 680; }
.tick-grid span::before { position: absolute; left: 13px; color: var(--green); content: "✓"; font-weight: 900; }
.text-link { color: var(--blue); font-weight: 780; }

.industry-list { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.industry-list article { min-height: 210px; padding: 28px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.industry-list span { color: var(--blue); font-size: .72rem; font-weight: 850; }
.industry-list h3 { margin: 38px 0 10px; font-size: 1.25rem; }
.industry-list p { margin: 0; color: var(--muted); }

.projects-section { color: #fff; background: #12334b; }
.project-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.project-grid article { padding: 28px; border: 1px solid rgba(255,255,255,.16); background: rgba(255,255,255,.04); }
.project-grid > article > span { color: #8dd2eb; font-size: .7rem; font-weight: 850; letter-spacing: .12em; }
.project-grid h3 { margin: 18px 0 28px; min-height: 58px; font-size: 1.35rem; }
.project-grid dl { margin: 0; }
.project-grid dl div { display: grid; grid-template-columns: 85px 1fr; gap: 15px; padding: 10px 0; border-top: 1px solid rgba(255,255,255,.12); }
.project-grid dt { color: rgba(255,255,255,.52); }
.project-grid dd { margin: 0; }
.project-disclaimer { display: flex; align-items: center; justify-content: space-between; gap: 34px; margin-top: 22px; color: rgba(255,255,255,.56); font-size: .78rem; }
.project-disclaimer p { max-width: 850px; margin: 0; }
.project-disclaimer a { color: #8dd2eb; font-weight: 760; white-space: nowrap; }

.process-section { background: #fff; }
.workflow { --flow-columns: 5; display: grid; grid-template-columns: repeat(var(--flow-columns), minmax(0, 1fr)); gap: 32px 34px; counter-reset: flow; }
.workflow span { position: relative; z-index: 1; min-height: 148px; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-end; padding: 50px 22px 22px; overflow: visible; border: 1px solid #c9d9e2; border-radius: 4px; background: linear-gradient(145deg, #fff, #f2f7f9); box-shadow: 0 13px 32px rgba(8,36,60,.06); font-size: .82rem; font-weight: 760; counter-increment: flow; }
.workflow span::before { position: absolute; top: 17px; left: 20px; width: 25px; height: 25px; display: grid; place-items: center; color: #fff; border: 4px solid #d9edf6; border-radius: 50%; background: var(--blue); box-shadow: 0 0 0 1px rgba(22,106,158,.22), 0 0 18px rgba(22,106,158,.2); content: counter(flow, decimal-leading-zero); font-size: .62rem; font-weight: 900; animation: workflow-node-pulse 4.2s ease-in-out infinite; }
.workflow span::after { position: absolute; z-index: -1; top: 26px; left: calc(100% + 7px); width: 21px; height: 8px; background: linear-gradient(90deg, var(--blue) 0 68%, transparent 68% 100%); background-size: 9px 8px; clip-path: polygon(0 38%, 70% 38%, 70% 0, 100% 50%, 70% 100%, 70% 62%, 0 62%); content: ""; animation: energy-path 2.4s linear infinite; }
.workflow strong { font-size: .86rem; line-height: 1.35; }
.workflow small { display: block; margin-top: 9px; color: var(--muted); font-size: .72rem; font-weight: 560; line-height: 1.4; }
.workflow span:nth-child(5n)::after { display: none; }
.workflow-output { display: block; margin-top: 14px; padding-top: 12px; color: #185d87; border-top: 1px solid #d3e1e8; font-size: .68rem; font-weight: 850; line-height: 1.35; }
.workflow-pulse { display: none; }
.home-workflow { grid-template-columns: repeat(5, minmax(0, 1fr)); grid-auto-rows: 1fr; }
.home-workflow span { min-height: 238px; justify-content: flex-start; padding-top: 60px; }
.home-workflow strong { min-height: 2.7em; font-size: .9rem; }
.home-workflow small { flex: 1 1 auto; font-size: .75rem; line-height: 1.5; }
.home-workflow .workflow-output { width: 100%; }
.home-workflow span:nth-child(6) { grid-column: 5; grid-row: 2; }
.home-workflow span:nth-child(7) { grid-column: 4; grid-row: 2; }
.home-workflow span:nth-child(8) { grid-column: 3; grid-row: 2; }
.home-workflow span:nth-child(9) { grid-column: 2; grid-row: 2; }
.home-workflow span:nth-child(10) { grid-column: 1; grid-row: 2; }
.home-workflow span:nth-child(5)::after { top: calc(100% + 7px); left: 30px; width: 8px; height: 18px; display: block; background: repeating-linear-gradient(180deg, var(--blue) 0 5px, transparent 5px 9px); clip-path: none; animation: energy-path-vertical 2.4s linear infinite; }
.home-workflow span:nth-child(n+6):nth-child(-n+9)::after { top: 26px; right: calc(100% + 7px); left: auto; width: 21px; height: 8px; display: block; background: linear-gradient(270deg, var(--blue) 0 68%, transparent 68% 100%); background-size: 9px 8px; clip-path: polygon(100% 38%, 30% 38%, 30% 0, 0 50%, 30% 100%, 30% 62%, 100% 62%); animation: energy-path-reverse 2.4s linear infinite; }
.home-workflow span:nth-child(10)::after { display: none; }
.home-workflow .workflow-pulse { position: absolute; z-index: 3; top: 27px; left: calc(100% + 3px); width: 5px; height: 5px; display: block; border-radius: 50%; background: #4aa8d1; box-shadow: 0 0 7px rgba(74,168,209,.5); pointer-events: none; animation: workflow-dot-right 4.6s linear infinite; }
.home-workflow span:nth-child(5) .workflow-pulse { top: calc(100% + 2px); left: 29px; animation-name: workflow-dot-down; }
.home-workflow span:nth-child(n+6):nth-child(-n+9) .workflow-pulse { right: calc(100% + 3px); left: auto; animation-name: workflow-dot-left; }
.home-workflow span:nth-child(10) .workflow-pulse { display: none; }
.pv-workflow { --flow-columns: 4; }
.pv-workflow span::after { display: block; }
.pv-workflow span:nth-child(4n)::after, .pv-workflow span:last-child::after { display: none; }
@keyframes energy-path { to { background-position: 18px 0; } }
@keyframes energy-path-reverse { to { background-position: -18px 0; } }
@keyframes workflow-node-pulse { 0%, 100% { box-shadow: 0 0 0 1px rgba(22,106,158,.2), 0 0 10px rgba(22,106,158,.12); } 50% { box-shadow: 0 0 0 4px rgba(22,106,158,.07), 0 0 18px rgba(22,106,158,.22); } }
@keyframes workflow-dot-right { 0% { transform: translateX(0); opacity: 0; } 20%, 80% { opacity: .8; } 100% { transform: translateX(28px); opacity: 0; } }
@keyframes workflow-dot-left { 0% { transform: translateX(0); opacity: 0; } 20%, 80% { opacity: .8; } 100% { transform: translateX(-28px); opacity: 0; } }
@keyframes workflow-dot-down { 0% { transform: translateY(0); opacity: 0; } 20%, 80% { opacity: .8; } 100% { transform: translateY(28px); opacity: 0; } }

.resource-preview { background: var(--soft); }
.resource-layout { display: grid; grid-template-columns: minmax(320px, .72fr) minmax(0, 1.28fr); gap: 70px; align-items: center; }
.resource-layout > div > p { margin-top: 20px; }
.resource-layout .button { margin-top: 28px; }
.resource-cards { display: grid; gap: 12px; }
.resource-cards article { width: 100%; display: grid; gap: 8px; padding: 24px; text-align: left; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; }
.resource-cards span { color: var(--blue); font-size: .68rem; font-weight: 850; letter-spacing: .1em; }
.resource-cards strong { font-size: 1.08rem; }
.resource-cards small { color: var(--muted); }

.faq-preview { background: #fff; }
.faq-layout { display: grid; grid-template-columns: minmax(300px, .72fr) minmax(0, 1.28fr); gap: 80px; align-items: start; }
.faq-layout > div > p { margin-top: 20px; }
.faq-layout .text-link { display: inline-block; margin-top: 24px; }
.accordion details { border-top: 1px solid var(--line); }
.accordion details:last-child { border-bottom: 1px solid var(--line); }
.accordion summary { position: relative; padding: 22px 42px 22px 0; font-weight: 760; cursor: pointer; list-style: none; }
.accordion summary::-webkit-details-marker { display: none; }
.accordion summary::after { position: absolute; right: 4px; content: "+"; color: var(--blue); font-size: 1.4rem; font-weight: 400; }
.accordion details[open] summary::after { content: "−"; }
.accordion details p { margin: -4px 0 22px; color: var(--muted); }

.scope-response-section { position: relative; overflow: hidden; color: #fff; background: #0b2b42; }
.scope-response-section::before { position: absolute; inset: 0; background: radial-gradient(circle at 12% 50%, rgba(81,169,213,.2), transparent 24%), linear-gradient(115deg, transparent 58%, rgba(255,255,255,.035) 58% 59%, transparent 59%); content: ""; }
.scope-response-panel { position: relative; display: grid; grid-template-columns: 180px minmax(0, 1fr) 230px; gap: 44px; align-items: center; }
.scope-response-marker { width: 156px; height: 156px; display: grid; place-items: center; align-content: center; border: 1px solid rgba(141,210,235,.46); border-radius: 50%; background: rgba(6,26,42,.55); box-shadow: 0 0 0 14px rgba(141,210,235,.035), 0 0 40px rgba(81,169,213,.12); }
.scope-response-marker span { color: #fff; font-size: 2.75rem; font-weight: 840; line-height: 1; }
.scope-response-marker small { margin-top: 10px; color: #8dd2eb; font-size: .62rem; font-weight: 850; letter-spacing: .12em; }
.scope-response-marker small { max-width: 118px; line-height: 1.35; text-align: center; }
.scope-response-copy h2 { max-width: 790px; margin: 0; font-size: clamp(2.2rem, 3.6vw, 3.4rem); line-height: 1.08; }
.scope-response-copy > p:not(.eyebrow) { max-width: 820px; margin: 20px 0 0; color: rgba(255,255,255,.77); font-size: 1rem; }
.scope-response-copy .scope-response-boundary { color: rgba(255,255,255,.54); font-size: .78rem; }
.scope-response-actions { display: grid; gap: 9px; }
.scope-response-actions > span { position: relative; padding: 11px 14px 11px 32px; color: #d4edf7; border: 1px solid rgba(141,210,235,.24); background: rgba(255,255,255,.035); font-size: .78rem; font-weight: 760; }
.scope-response-actions > span::before { position: absolute; top: 50%; left: 13px; width: 8px; height: 8px; border: 2px solid #8dd2eb; border-radius: 50%; content: ""; transform: translateY(-50%); box-shadow: 0 0 10px rgba(141,210,235,.45); }
.scope-response-actions .button { justify-content: center; margin-top: 10px; }
.scope-response-actions .button b { margin-left: 8px; }

.cta-band { padding: 70px 0; color: #fff; background: var(--blue); }
.cta-band .container { display: flex; align-items: center; justify-content: space-between; gap: 50px; }
.cta-band h2 { font-size: 2.7rem; }
.cta-band p { margin: 10px 0 0; color: #fff; font-size: .9rem; line-height: 1.55; }
.cta-band .container > div:last-child { display: flex; flex: 0 0 auto; gap: 10px; }

.site-footer { color: rgba(255,255,255,.66); background: #061a2a; }
.footer-main { display: grid; grid-template-columns: 1.35fr 1.15fr repeat(3, .82fr); gap: 34px; padding: 64px 0 50px; }
.footer-main > div { display: grid; align-content: start; gap: 9px; }
.footer-main b, .footer-brand strong { margin-bottom: 7px; color: #fff; }
.footer-main a { font-size: .86rem; }
.footer-main a:hover { color: #fff; }
.footer-brand p { max-width: 280px; margin: 0; color: #fff; }
.footer-brand small { margin-top: 10px; }
.footer-contact span { display: grid; gap: 1px; overflow-wrap: anywhere; font-size: .78rem; line-height: 1.4; }
.footer-contact span small { color: rgba(255,255,255,.46); font-size: .65rem; text-transform: uppercase; letter-spacing: .06em; }
.footer-contact em { margin-top: 5px; color: #8dd2eb; font-size: .67rem; font-style: normal; letter-spacing: .04em; }
.footer-bottom { min-height: 70px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-top: 1px solid rgba(255,255,255,.12); font-size: .75rem; }
.footer-boundary { display: grid; grid-template-columns: repeat(2, 1fr); gap: 28px; padding: 24px 0; border-top: 1px solid rgba(255,255,255,.12); }
.footer-boundary p, .footer-service-note p { margin: 0; font-size: .75rem; }
.footer-service-note { padding: 20px 0; border-top: 1px solid rgba(255,255,255,.12); }

.download-dialog { width: min(520px, calc(100% - 32px)); padding: 0; border: 0; border-radius: var(--radius); box-shadow: 0 30px 100px rgba(0,0,0,.3); }
.download-dialog::backdrop { background: rgba(4,20,33,.74); backdrop-filter: blur(5px); }
.download-form { position: relative; display: grid; gap: 16px; padding: 34px; }
.download-form h2 { margin: 0; font-size: 1.8rem; line-height: 1.2; }
.download-form > p:not(.eyebrow) { margin: 0; color: var(--muted); }
.download-form label { display: grid; gap: 6px; font-size: .84rem; font-weight: 700; }
.download-form input { min-height: 48px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 3px; }
.dialog-close { position: absolute; top: 16px; right: 16px; width: 36px; height: 36px; border: 0; border-radius: 50%; background: var(--soft); cursor: pointer; font-size: 1.4rem; }
.download-form small { color: var(--green); }

/* Inner pages */
.page-hero { position: relative; padding: 150px 0 74px; overflow: hidden; color: #fff; background: var(--navy); }
.page-hero .container { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, .55fr); gap: 80px; align-items: end; }
.page-hero h1 { max-width: 760px; }
.page-hero p:last-child { margin: 0; color: rgba(255,255,255,.68); font-size: 1.06rem; }
.image-page-hero { min-height: 430px; display: flex; align-items: flex-end; background: #061b2b; }
.image-page-hero::before { position: absolute; inset: 0; background-image: var(--page-hero-image); background-position: center; background-size: cover; content: ""; transform: scale(1.015); }
.image-page-hero::after { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(4,20,33,.96), rgba(4,20,33,.78) 55%, rgba(4,20,33,.48)); content: ""; }
.pv-page-hero { --page-hero-image: url("public/images/home-v3/equipment-renewable-integration-refined.webp"); }
.pv-page-hero::before { background-position: center 43%; }
.pv-page-hero::after { background: linear-gradient(90deg, rgba(4,20,33,.95) 0%, rgba(4,20,33,.78) 48%, rgba(4,20,33,.58) 100%), radial-gradient(ellipse at 78% 58%, rgba(3,17,29,.88) 0%, rgba(3,17,29,.74) 30%, transparent 65%); }
.pv-page-hero h1 { font-size: clamp(2.35rem, 3.6vw, 3.42rem); }
.pv-page-hero .container > p:last-child { min-width: 0; padding: 22px 24px; color: rgba(255,255,255,.92); border-left: 2px solid rgba(141,210,235,.72); background: linear-gradient(90deg, rgba(3,18,31,.84), rgba(3,18,31,.58) 72%, rgba(3,18,31,.26)); font-size: max(1rem, 16px); line-height: 1.62; text-shadow: 0 1px 2px rgba(0,0,0,.42); }
.pv-page-hero .page-hero-visual-note { color: rgba(255,255,255,.84); font-size: .8125rem; line-height: 1.5; text-shadow: 0 1px 2px rgba(0,0,0,.5); }
.partner-page-hero { --page-hero-image: url("assets/product-switchgear-v2.jpg"); }
.about-page-hero { --page-hero-image: url("assets/hero-power-integration-v2.jpg"); }
.projects-page-hero { --page-hero-image: url("public/images/home-v3/home-hero-integrated-power-energy.webp"); }
.page-hero-visual-note, .hero-visual-note { position: absolute; z-index: 3; right: max(22px, calc((100vw - 1240px) / 2)); bottom: 18px; max-width: 380px; color: rgba(255,255,255,.62); font-size: .66rem; font-weight: 700; letter-spacing: .04em; text-align: right; }
.breadcrumb { margin-bottom: 18px; color: #8dd2eb; font-size: .74rem; font-weight: 700; }
.content-section { padding: 88px 0; }
.content-section.soft { background: var(--soft); }
.content-grid { display: grid; grid-template-columns: minmax(0, .72fr) minmax(0, 1.28fr); gap: 70px; }
.content-grid h2 { margin: 0; font-size: 2.35rem; line-height: 1.12; }
.content-grid p { color: var(--muted); }
.feature-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.feature-list article, .info-card { padding: 22px; border: 1px solid var(--line); background: #fff; }
.feature-list h3, .info-card h3 { margin: 0 0 8px; font-size: 1.05rem; }
.feature-list p, .info-card p { margin: 0; color: var(--muted); }
.spec-table { width: 100%; border-collapse: collapse; background: #fff; }
.spec-table caption { padding: 13px 16px; color: #285d7e; border: 1px solid #c6d8e3; border-bottom: 0; background: #edf6fa; font-size: .72rem; font-weight: 850; letter-spacing: .08em; text-align: left; text-transform: uppercase; }
.spec-table th, .spec-table td { padding: 15px 16px; text-align: left; border-bottom: 1px solid var(--line); }
.spec-table th { width: 37%; color: var(--muted); background: #f8fafb; font-size: .82rem; }
.spec-table td { font-weight: 650; }
.parameter-rfq-cta { margin-top: 20px; line-height: 1.25; text-align: center; }
.equipment-checkbox-grid label.is-query-preselected { border-color: #4d96bd; background: #eaf5fa; box-shadow: inset 3px 0 0 var(--blue); }
.applications { display: flex; flex-wrap: wrap; gap: 10px; }
.applications span { padding: 10px 14px; border: 1px solid var(--line); background: #fff; font-size: .84rem; font-weight: 680; }
.product-page-hero { position: relative; overflow: hidden; min-height: 620px; display: flex; align-items: flex-end; color: #fff; background: var(--navy); }
.product-page-hero > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .65; }
.product-hero-pattern { position: absolute; inset: 0; background: radial-gradient(circle at 78% 34%, rgba(81,169,213,.23), transparent 23%), linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(135deg, #061827, #12334b); background-size: auto, 46px 46px, 46px 46px, auto; }
.product-page-hero::after { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(4,20,33,.96), rgba(4,20,33,.65) 55%, rgba(4,20,33,.18)); content: ""; }
.product-page-hero .container { position: relative; z-index: 2; padding-top: 160px; padding-bottom: 82px; }
.product-page-hero h1 { max-width: 740px; margin: 0; font-size: clamp(3rem, 5vw, 5rem); line-height: 1; }
.product-page-hero p { max-width: 650px; margin: 22px 0 0; color: rgba(255,255,255,.76); font-size: 1.08rem; }
.product-page-hero .button { margin-top: 28px; }
.technical-tabs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px; }
.technical-tabs article { position: relative; min-height: 190px; padding: 56px 22px 22px; border: 1px solid #c9d9e2; border-radius: 4px; background: linear-gradient(145deg, #fff, #f2f7f9); box-shadow: 0 13px 32px rgba(8,36,60,.06); }
.technical-tabs article:not(:last-child)::after { position: absolute; z-index: 0; top: 25px; left: calc(100% + 7px); width: 18px; height: 8px; background: linear-gradient(90deg, var(--blue) 0 65%, transparent 65% 100%); background-size: 9px 8px; clip-path: polygon(0 38%, 70% 38%, 70% 0, 100% 50%, 70% 100%, 70% 62%, 0 62%); content: ""; animation: energy-path 2.4s linear infinite; }
.technical-tabs span { position: absolute; top: 16px; left: 20px; width: 26px; height: 26px; display: grid; place-items: center; color: #fff; border: 4px solid #d9edf6; border-radius: 50%; background: var(--blue); font-size: .61rem; font-weight: 900; }
.technical-tabs h3 { margin: 0 0 8px; font-size: 1.08rem; }
.technical-tabs p { margin: 0; color: var(--muted); font-size: .9rem; }
.download-grid, .reference-grid, .about-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.download-item, .reference-item, .about-grid article { padding: 24px; border: 1px solid var(--line); background: #fff; }
.download-item { display: grid; gap: 10px; text-align: left; cursor: pointer; }
.download-item span, .reference-item > span { color: var(--blue); font-size: .7rem; font-weight: 850; letter-spacing: .1em; }
.download-item strong { font-size: 1.05rem; }
.download-item small { color: var(--muted); }
.resource-pending { cursor: default; }
.resource-pending b { color: var(--green); font-size: .78rem; }
.search-box { width: 100%; min-height: 54px; margin-bottom: 28px; padding: 12px 16px; border: 1px solid var(--line); border-radius: 3px; }
.reference-item h3 { min-height: 54px; margin: 14px 0; }
.reference-item p { color: var(--muted); }
.reference-item dl { margin: 0; }
.reference-item dl div { display: flex; justify-content: space-between; gap: 18px; padding: 9px 0; border-top: 1px solid var(--line); }
.reference-item dt { color: var(--muted); }
.reference-item dd { margin: 0; text-align: right; font-weight: 650; }
.rfq-layout { display: grid; grid-template-columns: minmax(280px, .65fr) minmax(0, 1.35fr); gap: 70px; }
.contact-points { display: grid; gap: 10px; margin-top: 28px; }
.contact-points p { margin: 0; padding: 14px 16px; border-left: 3px solid var(--blue); background: #fff; }
.rfq-form { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.rfq-form label { display: grid; gap: 7px; font-size: .84rem; font-weight: 700; }
.rfq-form label.wide { grid-column: 1 / -1; }
.rfq-form input, .rfq-form select, .rfq-form textarea { width: 100%; min-height: 48px; padding: 11px 12px; border: 1px solid var(--line); border-radius: 3px; background: #fff; }
.rfq-form textarea { min-height: 130px; resize: vertical; }
.upload-zone { min-height: 120px; display: grid; place-items: center; padding: 20px; text-align: center; border: 1px dashed #9bb7c7; background: #f7fafb; }
.upload-zone input { min-height: 44px; }
.consent-field { display: flex !important; grid-template-columns: none !important; align-items: flex-start; gap: 10px !important; font-weight: 500 !important; }
.consent-field input { width: 20px !important; min-height: 20px !important; flex: 0 0 auto; margin-top: 3px; }
.consent-field a { color: var(--blue); text-decoration: underline; }
.form-setup-note { margin: 0; padding: 12px 14px; color: var(--muted); border-left: 3px solid #c28a20; background: #fff8e8; font-size: .85rem; }
.form-status { grid-column: 1 / -1; min-height: 0; margin: 0; padding: 0; color: var(--muted); }
.form-status:not(:empty) { padding: 13px 15px; border-left: 3px solid var(--blue); background: var(--soft); }
.form-status.is-error { color: #8a2a24; border-left-color: #b93b34; background: #fff1f0; }
.form-status.is-pending { color: #6d5117; border-left-color: #c28a20; background: #fff8e8; }
.pending-submit { align-self: start; }
.disabled-button { cursor: not-allowed; opacity: .82; }
.prelaunch-banner { margin-bottom: 42px; padding: 20px 22px; color: #5e4615; border-left: 4px solid #c28a20; background: #fff8e8; }
.prelaunch-banner p { margin: 6px 0 0; }
.response-copy { margin-top: 28px; padding: 18px; border: 1px solid var(--line); background: #fff; }
.response-copy p { margin: 8px 0 0; color: var(--muted); }
.contact-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.contact-grid article { min-height: 180px; padding: 24px; border: 1px solid var(--line); background: #fff; }
.contact-grid h3 { margin: 28px 0 10px; }
.contact-grid p { color: var(--muted); }
.map-placeholder { min-height: 360px; display: grid; place-items: center; color: rgba(255,255,255,.76); background: linear-gradient(135deg, #0b4f7d, #12334b); text-align: center; }
.launch-blocker-panel { padding: 44px 0; color: #fff; background: var(--navy); }
.launch-blocker-panel p { margin: 8px 0 0; color: rgba(255,255,255,.72); }
.legal-note { padding: 14px 16px; color: var(--muted); border-left: 3px solid var(--blue); background: var(--soft); font-size: .84rem; }
.legal-content { max-width: 900px; }
.legal-content h2 { margin: 42px 0 12px; font-size: 1.45rem; }
.legal-content h2:first-of-type { margin-top: 0; }
.legal-content p { color: var(--muted); }
.legal-content a { color: var(--blue); text-decoration: underline; }

/* Contact and RFQ release-layout system */
.preview-contact-strip { color: #d9edf6; background: #0c304b; border-top: 1px solid rgba(255,255,255,.1); }
.preview-contact-strip .container { min-height: 46px; display: flex; align-items: center; gap: 14px; font-size: .78rem; }
.preview-contact-strip strong { color: #fff; letter-spacing: .04em; }
.preview-contact-strip span { color: rgba(255,255,255,.7); }
.contact-methods-section[hidden], .contact-office-section[hidden] { display: none; }
.contact-method-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.contact-method-card { min-width: 0; min-height: 286px; display: grid; grid-template-columns: 42px minmax(0, 1fr); align-content: start; gap: 16px; padding: 25px 23px; border: 1px solid var(--line); background: #fff; box-shadow: 0 9px 28px rgba(8,36,60,.035); }
.contact-method-icon { width: 42px; height: 42px; display: grid; place-items: center; color: var(--blue); border: 1px solid #c7dae5; border-radius: 50%; background: #f3f8fa; }
.contact-method-icon svg { width: 21px; height: 21px; }
.contact-method-label { margin: 1px 0 9px !important; color: var(--blue) !important; font-size: .68rem; font-weight: 850; letter-spacing: .09em; text-transform: uppercase; }
.contact-method-card h3 { margin: 0; color: var(--ink); font-size: 1rem; line-height: 1.38; overflow-wrap: anywhere; }
.contact-method-card h3 + small { display: block; margin-top: 3px; color: var(--muted); font-size: .72rem; }
.contact-method-card h3 ~ p { margin: 12px 0 0; color: var(--muted); font-size: .82rem; line-height: 1.5; }
.contact-card-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.contact-card-action { min-height: 38px; display: inline-flex; align-items: center; padding: 7px 11px; color: var(--blue); border: 1px solid #b9d0dd; border-radius: 3px; background: #fff; cursor: pointer; font-size: .74rem; font-weight: 760; text-align: left; }
.contact-card-action:hover { color: var(--navy); border-color: var(--blue); }
.contact-card-action.secondary { color: var(--muted); }
.preview-action-status { min-height: 0; margin: 18px 0 0; color: var(--blue); font-size: .82rem; }
.preview-action-status:not(:empty) { padding: 11px 14px; border-left: 3px solid var(--blue); background: #eaf4f8; }
.project-prep-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.project-prep-grid article { min-height: 205px; padding: 25px; border-top: 3px solid var(--blue); background: var(--soft); }
.project-prep-grid span { color: var(--blue); font-size: .72rem; font-weight: 850; }
.project-prep-grid h3 { margin: 32px 0 10px; font-size: 1.12rem; }
.project-prep-grid p { margin: 0; color: var(--muted); font-size: .88rem; }
.form-section-layout, .rfq-page-layout { display: grid; grid-template-columns: minmax(280px, .56fr) minmax(0, 1.44fr); gap: 56px; align-items: start; }
.rfq-page-layout { grid-template-columns: minmax(270px, .5fr) minmax(0, 1.5fr); }
.form-intro-panel, .rfq-guide-panel { position: sticky; top: 96px; }
.form-intro-panel h2, .rfq-guide-panel h2 { margin: 0; font-size: clamp(2rem, 3vw, 3rem); line-height: 1.1; }
.form-intro-panel > p:not(.eyebrow), .rfq-guide-panel > p:not(.eyebrow) { color: var(--muted); }
.formal-rfq-form { display: grid; gap: 22px; }
.formal-rfq-form fieldset { min-width: 0; margin: 0; padding: 26px; border: 1px solid var(--line); background: #fff; }
.formal-rfq-form legend { position: relative; z-index: 1; margin-left: -12px; padding: 0 12px; color: var(--navy); background: #fff; font-size: 1rem; font-weight: 820; line-height: 1.45; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.formal-rfq-form label, .field-block { display: block; color: var(--ink); font-size: .8rem; font-weight: 720; }
.formal-rfq-form label.wide, .field-block { grid-column: 1 / -1; }
.formal-rfq-form .optional { color: var(--muted); font-size: .69rem; font-weight: 560; }
.formal-rfq-form input, .formal-rfq-form select, .formal-rfq-form textarea { width: 100%; min-width: 0; min-height: 48px; display: block; margin-top: 7px; padding: 11px 12px; color: var(--ink); border: 1px solid #cbd8df; border-radius: 3px; background: #fff; }
.formal-rfq-form textarea { min-height: 138px; resize: vertical; }
.formal-rfq-form input[aria-invalid="true"], .formal-rfq-form select[aria-invalid="true"], .formal-rfq-form textarea[aria-invalid="true"] { border-color: #ad342f; box-shadow: 0 0 0 2px rgba(173,52,47,.1); }
.fieldset-intro { margin: 0 0 16px; color: var(--muted); font-size: .82rem; }
.equipment-selection { margin-top: 22px; }
.equipment-selection > p { margin: 0 0 10px; font-size: .8rem; font-weight: 760; }
.equipment-checkbox-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.equipment-checkbox-grid label { min-height: 46px; display: flex; grid-template-columns: none; align-items: center; gap: 9px; padding: 9px 11px; border: 1px solid var(--line); background: #f8fafb; font-weight: 620; line-height: 1.25; }
.equipment-checkbox-grid input { width: 18px; min-height: 18px; flex: 0 0 auto; margin: 0; }
.field-block { margin-top: 22px; }
.upload-zone { min-height: 164px; display: grid !important; place-items: center; gap: 7px !important; padding: 24px; text-align: center; border: 1px dashed #8aaabd; background: #f7fafb; }
.upload-zone > span { color: var(--muted); font-size: .76rem; font-weight: 540; }
.upload-zone .upload-availability { color: var(--blue); font-weight: 680; }
.upload-zone.is-disabled { cursor: not-allowed; opacity: .92; }
.upload-zone input { min-height: 40px; margin-top: 8px; }
.upload-zone input:disabled { display: none; }
.consent-field { display: flex !important; grid-template-columns: none !important; align-items: flex-start; gap: 10px !important; padding: 0 3px; font-weight: 520 !important; line-height: 1.5; }
.consent-field input { width: 19px !important; min-height: 19px !important; flex: 0 0 auto; margin: 3px 0 0; }
.consent-field a { color: var(--blue); text-decoration: underline; }
.optional-consent { color: var(--muted) !important; }
.form-submit-row { display: flex; align-items: center; gap: 18px; padding-top: 4px; }
.form-submit-row p { margin: 0; color: var(--muted); font-size: .78rem; line-height: 1.45; }
.button:disabled { cursor: not-allowed; opacity: .52; transform: none; }
.form-status { min-height: 0; margin: 0; padding: 0; color: var(--muted); }
.form-status:not(:empty) { padding: 13px 15px; border-left: 3px solid var(--blue); background: #eaf4f8; }
.form-status.is-error, .form-status.is-failure { color: #8a2a24; border-left-color: #b93b34; background: #fff1f0; }
.form-status.is-pending { color: var(--blue); border-left-color: var(--blue); background: #eaf4f8; }
.form-result-panel { padding: 22px; border: 1px solid var(--line); background: #fff; }
.form-result-panel h2 { margin: 0; font-size: 1.35rem; }
.form-result-panel p { margin: 9px 0 0; color: var(--muted); }
.form-result-panel.is-success { border-left: 4px solid var(--green); }
.form-result-panel.is-error { border-left: 4px solid #b93b34; }
.honeypot-field { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.office-information-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.office-information-grid article { min-height: 130px; padding: 22px; border: 1px solid var(--line); background: #fff; }
.office-information-grid p { margin: 0 0 18px; color: var(--blue); font-size: .68rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.office-information-grid strong { display: block; font-size: .93rem; line-height: 1.5; }
.wechat-dialog { width: min(440px, calc(100% - 32px)); padding: 0; border: 0; border-radius: 7px; box-shadow: 0 28px 90px rgba(0,0,0,.35); }
.wechat-dialog::backdrop { background: rgba(4,20,33,.72); backdrop-filter: blur(4px); }
.wechat-dialog-content { padding: 34px; text-align: center; }
.wechat-dialog-content h2 { margin: 0 0 20px; }
.wechat-dialog-content > p:last-child { margin: 16px 0 0; color: var(--muted); font-size: .82rem; }
.wechat-dialog-content img { width: min(280px, 100%); margin: 0 auto; }
.preview-qr-layout { width: min(280px, 100%); aspect-ratio: 1; display: grid; place-items: center; margin: 0 auto; color: var(--navy); border: 14px solid #fff; outline: 1px solid var(--line); background: repeating-conic-gradient(#0b2235 0 25%, #fff 0 50%) 0 / 34px 34px; }
.preview-qr-layout span { max-width: 150px; padding: 12px; color: #fff; background: rgba(8,36,60,.94); font-size: .78rem; font-weight: 850; }
.preview-contact-toast { position: fixed; right: 22px; bottom: 22px; z-index: 120; max-width: 390px; padding: 13px 16px; color: #fff; background: var(--navy); box-shadow: var(--shadow); opacity: 0; transform: translateY(12px); pointer-events: none; transition: .18s ease; font-size: .8rem; }
.preview-contact-toast.is-visible { opacity: 1; transform: translateY(0); }
.mobile-contact-bar { display: none; }

@media (max-width: 1100px) {
  .brand { min-width: 205px; }
  .nav { gap: 10px; font-size: .75rem; }
  .solution-grid, .equipment-scope-grid { grid-template-columns: repeat(2, 1fr); }
  .product-grid { grid-template-columns: repeat(2, 1fr); }
  .hero-inner { grid-template-columns: 1fr; gap: 34px; }
  .hero-proof { max-width: 660px; display: grid; grid-template-columns: repeat(2, 1fr); }
  .hero-proof > div:nth-child(2) { border-bottom: 1px solid rgba(255,255,255,.14); }
  .partner-layout, .resource-layout, .faq-layout, .content-grid, .rfq-layout, .system-scope-layout { grid-template-columns: 1fr; }
  .power-system-diagram { width: 100%; }
  .download-grid, .reference-grid, .about-grid { grid-template-columns: repeat(2, 1fr); }
  .contact-method-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .form-section-layout, .rfq-page-layout { grid-template-columns: 1fr; }
  .form-intro-panel, .rfq-guide-panel { position: static; }
  .footer-main { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .scope-response-panel { grid-template-columns: 150px minmax(0, 1fr); }
  .scope-response-actions { grid-column: 1 / -1; grid-template-columns: repeat(4, 1fr); }
  .scope-response-actions .button { margin-top: 0; }
}

@media (max-width: 820px) {
  .container { width: min(calc(100% - 32px), var(--container)); }
  .topbar .container span:last-child { display: none; }
  .topbar .container { justify-content: center; }
  .site-header { top: 34px; height: 68px; padding: 0 16px; }
  .site-header.is-scrolled, .site-header.inner-header { top: 0; height: 64px; }
  .nav-toggle { display: block; }
  .nav { position: fixed; top: 70px; right: 12px; left: 12px; display: grid; gap: 0; padding: 10px; color: var(--ink); background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow); transform: translateY(-12px); visibility: hidden; opacity: 0; pointer-events: none; transition: .18s ease; }
  .nav { max-height: calc(100svh - 82px); overflow-y: auto; }
  .site-header:not(.is-scrolled):not(.inner-header) .nav { top: 104px; }
  .nav.is-open { transform: translateY(0); visibility: visible; opacity: 1; pointer-events: auto; }
  .nav > a { min-height: 48px; display: flex; align-items: center; padding: 0 12px; }
  .nav > a::after { display: none; }
  .nav-group { width: 100%; }
  .nav-group-toggle { width: 100%; min-height: 48px; justify-content: space-between; padding: 0 12px; }
  .nav-submenu { position: static; width: 100%; display: none; padding: 0 0 8px 12px; border: 0; background: #f7fafb; box-shadow: none; visibility: visible; opacity: 1; transform: none; pointer-events: auto; transition: none; }
  .nav-group.is-open .nav-submenu { display: grid; }
  .nav-submenu a { min-height: 44px; padding-right: 12px; }
  .nav-cta { justify-content: center; margin-top: 6px; }
  .hero, .hero-inner { min-height: auto; }
  .hero-bg { background-position: 68% center; }
  .hero-overlay { background: linear-gradient(90deg, rgba(4,20,33,.98), rgba(4,20,33,.78)), linear-gradient(0deg, rgba(4,20,33,.82), transparent 55%); }
  .hero-inner { padding-top: 128px; padding-bottom: 54px; }
  .hero h1 { font-size: 2.7rem; }
  .hero-proof { grid-template-columns: 1fr; }
  .hero-proof > div { min-height: 0; }
  .hero-proof > div:nth-child(3) { border-bottom: 1px solid rgba(255,255,255,.14); }
  .scroll-cue { display: none; }
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .stats-grid article { min-height: 104px; border-bottom: 1px solid rgba(255,255,255,.17); }
  .section { padding: 76px 0; }
  .section-intro { grid-template-columns: 1fr; gap: 18px; }
  .product-grid, .solution-grid, .project-grid, .industry-list, .technical-tabs, .contact-grid, .responsibility-grid, .equipment-scope-grid, .boundary-callout { grid-template-columns: 1fr; }
  .solution-grid article { min-height: 260px; }
  .industry-list { border-left: 0; }
  .industry-list article { min-height: 180px; border-left: 1px solid var(--line); }
  .project-disclaimer, .cta-band .container { align-items: flex-start; flex-direction: column; }
  .workflow { --flow-columns: 2; grid-template-columns: repeat(2, 1fr); }
  .workflow span::after, .pv-workflow span::after { display: block; }
  .workflow span:nth-child(2n)::after, .workflow span:last-child::after, .pv-workflow span:nth-child(2n)::after, .pv-workflow span:last-child::after { display: none; }
  .home-workflow { grid-template-columns: 1fr; gap: 24px; }
  .home-workflow span, .home-workflow span:nth-child(n) { min-height: 178px; grid-column: 1 !important; grid-row: auto !important; }
  .home-workflow span::after, .home-workflow span:nth-child(n):nth-child(n)::after { top: auto; right: auto; bottom: -21px; left: 31px; width: 2px; height: 18px; display: block; background: repeating-linear-gradient(180deg, var(--blue) 0 5px, transparent 5px 9px); clip-path: none; animation: energy-path-vertical 2.4s linear infinite; }
  .home-workflow span:last-child:nth-child(n):nth-child(n)::after { display: none; }
  .home-workflow .workflow-pulse, .home-workflow span:nth-child(n):nth-child(n) .workflow-pulse { top: auto; right: auto; bottom: -20px; left: 29px; display: block; animation: workflow-dot-down 4.6s linear infinite; }
  .home-workflow span:last-child:nth-child(n):nth-child(n) .workflow-pulse { display: none; }
  .footer-main { grid-template-columns: repeat(2, 1fr); }
  .footer-boundary { grid-template-columns: 1fr; gap: 12px; }
  .footer-boundary p, .footer-service-note p, .footer-bottom { font-size: .8rem; line-height: 1.55; }
  .page-hero { padding-top: 120px; }
  .page-hero .container { grid-template-columns: 1fr; gap: 20px; }
  .image-page-hero { min-height: 500px; }
  .image-page-hero::after { background: linear-gradient(90deg, rgba(4,20,33,.96), rgba(4,20,33,.77)), linear-gradient(0deg, rgba(4,20,33,.75), transparent 55%); }
  .pv-page-hero { min-height: 610px; padding-bottom: 92px; }
  .pv-page-hero::before { background-position: 42% center; }
  .pv-page-hero::after { background: linear-gradient(90deg, rgba(4,20,33,.94), rgba(4,20,33,.74)), linear-gradient(0deg, rgba(4,20,33,.9), rgba(4,20,33,.18) 58%); }
  .pv-page-hero h1 { max-width: 660px; font-size: 2.55rem; }
  .pv-page-hero .container > p:last-child { padding: 18px 20px; font-size: 1rem; line-height: 1.62; }
  .page-hero-visual-note, .hero-visual-note { right: 16px; bottom: 12px; left: 16px; max-width: none; text-align: left; }
  .product-page-hero { min-height: 560px; }
  .product-page-hero .container { padding-top: 130px; padding-bottom: 60px; }
  .technical-tabs { gap: 24px; }
  .technical-tabs article { border-right: 1px solid #c9d9e2; border-bottom: 1px solid #c9d9e2; }
  .technical-tabs article:not(:last-child)::after { top: auto; bottom: -21px; left: 31px; width: 2px; height: 17px; background: repeating-linear-gradient(180deg, var(--blue) 0 5px, transparent 5px 9px); clip-path: none; animation: energy-path-vertical 2.4s linear infinite; }
  .technical-tabs article:last-child { border-bottom: 1px solid #c9d9e2; }
  .power-system-diagram { padding: 22px; }
  .system-main-chain, .bess-chain { display: grid; }
  .system-main-chain > .system-node, .bess-chain > span { min-height: 66px; font-size: .8125rem; }
  .system-main-chain > .system-node:not(:last-child), .bess-chain > span:not(:last-child) { margin-right: 0; margin-bottom: 28px; }
  .system-main-chain > .system-node:not(:last-child)::after, .bess-chain > span:not(:last-child)::after { top: auto; right: 50%; bottom: -23px; width: auto; content: "↓"; transform: translateX(50%); }
  .bess-branch-desktop, .desktop-bess-link { display: none; }
  .mobile-branch-junction { position: relative; display: block; margin: 0 0 28px; }
  .system-main-chain > .mv-system-node { margin-bottom: 28px; }
  .system-main-chain > .mv-system-node::after { display: none; }
  .mobile-branch-junction::before { position: absolute; top: -28px; left: 24px; width: calc(50% - 24px); height: 20px; border-right: 2px dashed var(--blue); border-bottom: 2px dashed var(--blue); content: ""; }
  .bess-branch-mobile { display: block; margin-left: 24px; }
  .bess-branch-mobile::before { position: absolute; top: -8px; left: -2px; height: 8px; border-left: 2px dashed var(--blue); content: ""; }
  .bess-chain { max-width: none; }
  .main-chain-continuation { margin: 18px 0 0; color: var(--blue); text-align: center; font-size: .75rem; font-weight: 850; letter-spacing: .07em; }
  .main-chain-continuation span { margin-left: 5px; font-size: 1rem; }
  .project-prep-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .equipment-checkbox-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .office-information-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .scope-response-panel { grid-template-columns: 1fr; gap: 28px; }
  .scope-response-marker { width: 128px; height: 128px; }
  .scope-response-actions { grid-column: auto; grid-template-columns: repeat(2, 1fr); }
  .mobile-contact-bar:not([hidden]) { position: fixed; right: 0; bottom: 0; left: 0; z-index: 90; min-height: calc(58px + env(safe-area-inset-bottom)); display: grid; grid-template-columns: repeat(3, 1fr); align-items: stretch; padding-bottom: env(safe-area-inset-bottom); color: #fff; background: #061a2a; box-shadow: 0 -8px 24px rgba(4,20,33,.18); }
  .mobile-contact-bar a, .mobile-contact-bar button { min-width: 0; display: grid; place-items: center; padding: 10px 6px; color: #fff; border: 0; border-right: 1px solid rgba(255,255,255,.13); background: transparent; font-size: .75rem; font-weight: 760; }
  .mobile-contact-bar > :last-child { border-right: 0; background: var(--blue); }
  body.has-mobile-contact-bar { padding-bottom: calc(58px + env(safe-area-inset-bottom)); }
}

@media (max-width: 560px) {
  .topbar { font-size: .62rem; }
  .topbar .container > span:first-child { white-space: nowrap; }
  .brand { min-width: 0; }
  .brand-text small { display: none; }
  .brand-mark { width: 40px; height: 40px; }
  .hero-inner { gap: 26px; padding-top: 116px; padding-bottom: 44px; }
  .hero h1 { font-size: 2.05rem; }
  .hero-subtitle { margin-top: 18px; font-size: .98rem; line-height: 1.45; }
  .hero-lede { margin-top: 10px; font-size: .9rem; line-height: 1.5; }
  .hero-actions { margin-top: 22px; }
  .hero-actions { display: grid; }
  .hero-resource-status { justify-content: center; }
  .product-grid, .download-grid, .reference-grid, .about-grid, .feature-list, .tick-grid, .rfq-form, .rfq-input-list, .integration-modules { grid-template-columns: 1fr; }
  .product-card { min-height: 0; }
  .integration-modules article { min-height: 68px; }
  .workflow { --flow-columns: 1; grid-template-columns: 1fr; gap: 20px; }
  .workflow span { min-height: 108px; }
  .workflow span::after, .pv-workflow span::after, .workflow span:nth-child(2n)::after, .pv-workflow span:nth-child(2n)::after { display: block; }
  .workflow span:not(:last-child)::after, .pv-workflow span:not(:last-child)::after { top: auto; bottom: -18px; left: 31px; width: 2px; height: 16px; background: repeating-linear-gradient(180deg, var(--blue) 0 5px, transparent 5px 9px); clip-path: none; animation: energy-path-vertical 2.4s linear infinite; }
  .workflow span:last-child::after, .pv-workflow span:last-child::after { display: none; }
  .home-workflow { gap: 24px; }
  .home-workflow span, .home-workflow span:nth-child(n) { min-height: 180px; padding: 58px 19px 20px; }
  .home-workflow strong { min-height: 0; }
  .home-workflow small { font-size: .78rem; }
  .partner-image > img { min-height: 340px; }
  .partner-copy h2 { font-size: 2.2rem; }
  .cta-band .container > div:last-child { width: 100%; display: grid; }
  .footer-main { grid-template-columns: 1fr; padding: 48px 0 40px; }
  .footer-boundary p, .footer-service-note p, .footer-bottom { font-size: .8rem; line-height: 1.55; }
  .footer-boundary { padding: 20px 0; }
  .footer-service-note { padding: 18px 0; }
  .footer-bottom { align-items: flex-start; flex-direction: column; justify-content: center; }
  .rfq-form label.wide { grid-column: auto; }
  .contact-method-grid, .project-prep-grid, .form-grid, .equipment-checkbox-grid, .office-information-grid { grid-template-columns: 1fr; }
  .contact-method-card { min-height: 0; }
  .formal-rfq-form fieldset { padding: 21px 17px; }
  .formal-rfq-form legend { margin-left: -7px; padding: 0 8px; }
  .form-submit-row { align-items: stretch; flex-direction: column; }
  .form-submit-row .button { width: 100%; }
  .preview-contact-strip .container { align-items: flex-start; flex-direction: column; justify-content: center; gap: 0; padding-block: 8px; }
  .wechat-dialog-content { padding: 30px 22px; }
  .preview-contact-toast { right: 14px; bottom: calc(72px + env(safe-area-inset-bottom)); left: 14px; max-width: none; }
  .scope-response-actions { grid-template-columns: 1fr; }
  .pv-page-hero { min-height: 650px; padding-top: 116px; padding-bottom: 96px; }
  .pv-page-hero h1 { overflow-wrap: anywhere; font-size: 2.05rem; line-height: 1.08; }
  .pv-page-hero .container { gap: 18px; }
  .pv-page-hero .container > p:last-child { padding: 16px; font-size: 1rem; line-height: 1.6; }
  .pv-page-hero .page-hero-visual-note { font-size: .8125rem; line-height: 1.45; }
}

@keyframes energy-path-vertical { to { background-position: 0 18px; } }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* Flow continuity repair: permanent static paths with lightweight motion overlays. */
.workflow span { --flow-travel: 34px; }
.workflow span:not(:last-child)::after {
  z-index: 2;
  top: 26px;
  right: auto;
  bottom: auto;
  left: 100%;
  width: 34px;
  height: 8px;
  display: block;
  background: var(--blue);
  clip-path: polygon(0 38%, 70% 38%, 70% 0, 100% 50%, 70% 100%, 70% 62%, 0 62%);
  animation: none;
}
.workflow span:last-child::after { display: none; }
.workflow-pulse,
.home-workflow .workflow-pulse {
  position: absolute;
  z-index: 4;
  top: 27px;
  right: auto;
  bottom: auto;
  left: calc(100% - 2px);
  width: 5px;
  height: 5px;
  display: block;
  border-radius: 50%;
  background: #58afd4;
  box-shadow: 0 0 6px rgba(50,139,181,.48);
  pointer-events: none;
  animation: workflow-dot-right 4.8s linear infinite;
}
.workflow span:last-child .workflow-pulse { display: none; }

.home-workflow span:nth-child(5)::after,
.pv-workflow span:nth-child(4)::after {
  top: 100%;
  left: 29px;
  width: 8px;
  height: 32px;
  display: block;
  background: var(--blue);
  clip-path: polygon(38% 0, 62% 0, 62% 70%, 100% 70%, 50% 100%, 0 70%, 38% 70%);
}
.home-workflow span:nth-child(5),
.pv-workflow span:nth-child(4) { --flow-travel: 32px; }
.home-workflow span:nth-child(5) .workflow-pulse,
.pv-workflow span:nth-child(4) .workflow-pulse {
  top: calc(100% - 2px);
  left: 31px;
  animation-name: workflow-dot-down;
}

.home-workflow span:nth-child(n+6):nth-child(-n+9)::after,
.pv-workflow span:nth-child(n+5):nth-child(-n+6)::after {
  top: 26px;
  right: 100%;
  left: auto;
  width: 34px;
  height: 8px;
  display: block;
  background: var(--blue);
  clip-path: polygon(100% 38%, 30% 38%, 30% 0, 0 50%, 30% 100%, 30% 62%, 100% 62%);
}
.home-workflow span:nth-child(n+6):nth-child(-n+9) .workflow-pulse,
.pv-workflow span:nth-child(n+5):nth-child(-n+6) .workflow-pulse {
  top: 27px;
  right: calc(100% - 2px);
  left: auto;
  animation-name: workflow-dot-left;
}
.home-workflow span:nth-child(10)::after,
.home-workflow span:nth-child(10) .workflow-pulse,
.pv-workflow span:nth-child(7)::after,
.pv-workflow span:nth-child(7) .workflow-pulse { display: none; }

.pv-workflow span:nth-child(5) { grid-column: 4; grid-row: 2; }
.pv-workflow span:nth-child(6) { grid-column: 3; grid-row: 2; }
.pv-workflow span:nth-child(7) { grid-column: 2; grid-row: 2; }

.technical-tabs article:not(:last-child)::after {
  top: 25px;
  right: auto;
  bottom: auto;
  left: 100%;
  width: 32px;
  height: 8px;
  background: var(--blue);
  clip-path: polygon(0 38%, 70% 38%, 70% 0, 100% 50%, 70% 100%, 70% 62%, 0 62%);
  animation: none;
}
.technical-tabs article:not(:last-child)::before {
  position: absolute;
  z-index: 3;
  top: 27px;
  left: calc(100% - 2px);
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #58afd4;
  box-shadow: 0 0 6px rgba(50,139,181,.48);
  content: "";
  pointer-events: none;
  animation: workflow-dot-right 4.8s linear infinite;
}
.technical-tabs > article > span { animation: workflow-node-pulse 5.2s ease-in-out infinite; }

.system-main-chain > .system-node,
.bess-chain > span { animation: topology-node-pulse 5.8s ease-in-out infinite; }
.system-main-chain > .system-node:not(:last-child)::after,
.bess-chain > span:not(:last-child)::after {
  z-index: 2;
  top: 50%;
  right: -20px;
  bottom: auto;
  width: 20px;
  height: 8px;
  display: block;
  color: transparent;
  background: var(--blue);
  clip-path: polygon(0 38%, 70% 38%, 70% 0, 100% 50%, 70% 100%, 70% 62%, 0 62%);
  content: "";
  transform: translateY(-50%);
}
.system-main-chain > .system-node:not(:last-child)::before,
.bess-chain > span:not(:last-child)::before {
  position: absolute;
  z-index: 4;
  top: calc(50% - 2px);
  right: -3px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #58afd4;
  box-shadow: 0 0 6px rgba(50,139,181,.48);
  content: "";
  pointer-events: none;
  animation: topology-dot-right 4.8s linear infinite;
}

.desktop-bess-link svg > .return-static-path {
  stroke: var(--blue);
  stroke-width: 2;
  stroke-dasharray: 8 7;
}
.desktop-bess-link svg > .return-flow-path {
  stroke: #58afd4;
  stroke-width: 3;
  stroke-dasharray: 2 18;
  marker-end: none;
  animation: topology-return-flow 5.2s linear infinite;
}
.bess-branch-desktop .bess-chain > span:last-child::before {
  top: -52px;
  left: calc(50% - 1px);
  width: 2px;
  height: 52px;
  border: 0;
  background: var(--blue);
  content: "";
  transform: none;
}
.bess-branch-desktop .bess-chain > span:last-child::after {
  position: absolute;
  z-index: 4;
  top: -4px;
  left: calc(50% - 2px);
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #58afd4;
  box-shadow: 0 0 6px rgba(50,139,181,.48);
  content: "";
  pointer-events: none;
  animation: topology-dot-up 4.8s linear infinite;
}

@keyframes workflow-dot-right {
  0% { transform: translateX(0); opacity: 0; }
  18%, 82% { opacity: .82; }
  100% { transform: translateX(var(--flow-travel, 34px)); opacity: 0; }
}
@keyframes workflow-dot-left {
  0% { transform: translateX(0); opacity: 0; }
  18%, 82% { opacity: .82; }
  100% { transform: translateX(calc(var(--flow-travel, 34px) * -1)); opacity: 0; }
}
@keyframes workflow-dot-down {
  0% { transform: translateY(0); opacity: 0; }
  18%, 82% { opacity: .82; }
  100% { transform: translateY(var(--flow-travel, 24px)); opacity: 0; }
}
@keyframes topology-dot-right {
  0% { transform: translateX(0); opacity: 0; }
  18%, 82% { opacity: .82; }
  100% { transform: translateX(20px); opacity: 0; }
}
@keyframes topology-dot-down {
  0% { transform: translateY(0); opacity: 0; }
  18%, 82% { opacity: .82; }
  100% { transform: translateY(28px); opacity: 0; }
}
@keyframes topology-dot-up {
  0% { transform: translateY(0); opacity: 0; }
  18%, 82% { opacity: .82; }
  100% { transform: translateY(-50px); opacity: 0; }
}
@keyframes topology-return-flow { to { stroke-dashoffset: -120; } }
@keyframes topology-node-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(22,106,158,0); }
  50% { box-shadow: 0 0 0 3px rgba(22,106,158,.08); }
}
@keyframes topology-branch-dot {
  0% { top: -28px; left: 50%; opacity: 0; }
  14%, 84% { opacity: .82; }
  48% { top: -8px; left: 50%; }
  100% { top: -8px; left: 22px; opacity: 0; }
}

@media (max-width: 820px) {
  .workflow,
  .pv-workflow { --flow-columns: 1; grid-template-columns: 1fr; gap: 24px; }
  .workflow span,
  .workflow span:nth-child(n),
  .pv-workflow span:nth-child(n),
  .home-workflow span:nth-child(n) {
    --flow-travel: 24px;
    grid-column: 1 !important;
    grid-row: auto !important;
  }
  .workflow span:not(:last-child)::after,
  .workflow span:nth-child(n):not(:last-child)::after,
  .pv-workflow span:nth-child(n):not(:last-child)::after,
  .home-workflow span:nth-child(n):not(:last-child)::after {
    top: auto;
    right: auto;
    bottom: -24px;
    left: 29px;
    width: 8px;
    height: 24px;
    display: block;
    background: var(--blue);
    clip-path: polygon(38% 0, 62% 0, 62% 70%, 100% 70%, 50% 100%, 0 70%, 38% 70%);
  }
  .workflow span:last-child::after,
  .pv-workflow span:last-child::after,
  .home-workflow span:last-child::after { display: none; }
  .workflow span:not(:last-child) .workflow-pulse,
  .workflow span:nth-child(n):not(:last-child) .workflow-pulse,
  .pv-workflow span:nth-child(n):not(:last-child) .workflow-pulse,
  .home-workflow span:nth-child(n):not(:last-child) .workflow-pulse {
    top: auto;
    right: auto;
    bottom: -2px;
    left: 31px;
    display: block;
    animation-name: workflow-dot-down;
  }
  .workflow span:last-child .workflow-pulse,
  .pv-workflow span:last-child .workflow-pulse,
  .home-workflow span:last-child .workflow-pulse { display: none; }

  .technical-tabs article:not(:last-child)::after {
    top: auto;
    right: auto;
    bottom: -24px;
    left: 29px;
    width: 8px;
    height: 24px;
    background: var(--blue);
    clip-path: polygon(38% 0, 62% 0, 62% 70%, 100% 70%, 50% 100%, 0 70%, 38% 70%);
  }
  .technical-tabs article:not(:last-child)::before {
    top: auto;
    bottom: -2px;
    left: 31px;
    animation-name: workflow-dot-down;
    --flow-travel: 24px;
  }

  .system-main-chain > .system-node:not(:last-child)::after,
  .bess-chain > span:not(:last-child)::after {
    top: auto;
    right: calc(50% - 4px);
    bottom: -28px;
    width: 8px;
    height: 28px;
    background: var(--blue);
    clip-path: polygon(38% 0, 62% 0, 62% 70%, 100% 70%, 50% 100%, 0 70%, 38% 70%);
    transform: none;
  }
  .system-main-chain > .system-node:not(:last-child)::before,
  .bess-chain > span:not(:last-child)::before {
    top: auto;
    right: calc(50% - 2px);
    bottom: -3px;
    animation-name: topology-dot-down;
  }
  .system-main-chain > .mv-system-node::after,
  .system-main-chain > .mv-system-node::before { display: none; }

  .mobile-branch-junction::before {
    border-right-style: solid;
    border-bottom-style: solid;
    border-color: var(--blue);
  }
  .mobile-branch-junction::after {
    position: absolute;
    z-index: 4;
    top: -28px;
    left: 50%;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #58afd4;
    box-shadow: 0 0 6px rgba(50,139,181,.48);
    content: "";
    pointer-events: none;
    animation: topology-branch-dot 5.2s linear infinite;
  }
  .bess-branch-mobile::before {
    width: 2px;
    border: 0;
    background: var(--blue);
  }
  .bess-branch-mobile::after {
    position: absolute;
    z-index: 4;
    top: -8px;
    left: -3px;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #58afd4;
    box-shadow: 0 0 6px rgba(50,139,181,.48);
    content: "";
    pointer-events: none;
    animation: workflow-dot-down 4.8s linear infinite;
    --flow-travel: 8px;
  }
  .main-chain-continuation { position: relative; padding-bottom: 28px; }
  .main-chain-continuation::after {
    position: absolute;
    bottom: 0;
    left: calc(50% - 4px);
    width: 8px;
    height: 28px;
    background: var(--blue);
    clip-path: polygon(38% 0, 62% 0, 62% 70%, 100% 70%, 50% 100%, 0 70%, 38% 70%);
    content: "";
  }
  .main-chain-continuation::before {
    position: absolute;
    z-index: 4;
    bottom: 24px;
    left: calc(50% - 2px);
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #58afd4;
    box-shadow: 0 0 6px rgba(50,139,181,.48);
    content: "";
    pointer-events: none;
    animation: topology-dot-down 4.8s linear infinite;
  }
}

@media (prefers-reduced-motion: reduce) {
  .workflow-pulse,
  .technical-tabs article:not(:last-child)::before,
  .system-main-chain > .system-node:not(:last-child)::before,
  .bess-chain > span:not(:last-child)::before,
  .bess-branch-desktop .bess-chain > span:last-child::after,
  .mobile-branch-junction::after,
  .bess-branch-mobile::after,
  .main-chain-continuation::before,
  .desktop-bess-link svg > .return-flow-path { display: none !important; }
  .workflow span::before,
  .technical-tabs > article > span,
  .system-main-chain > .system-node,
  .bess-chain > span { animation: none !important; }
}

html.flow-static-preview { scroll-behavior: auto; }
html.flow-static-preview .workflow-pulse,
html.flow-static-preview .technical-tabs article:not(:last-child)::before,
html.flow-static-preview .system-main-chain > .system-node:not(:last-child)::before,
html.flow-static-preview .bess-chain > span:not(:last-child)::before,
html.flow-static-preview .bess-branch-desktop .bess-chain > span:last-child::after,
html.flow-static-preview .mobile-branch-junction::after,
html.flow-static-preview .bess-branch-mobile::after,
html.flow-static-preview .main-chain-continuation::before,
html.flow-static-preview .desktop-bess-link svg > .return-flow-path { display: none !important; }
html.flow-static-preview .workflow span::before,
html.flow-static-preview .technical-tabs > article > span,
html.flow-static-preview .system-main-chain > .system-node,
html.flow-static-preview .bess-chain > span { animation: none !important; }

/* Pulse intensity enhancement: clearer electrical signal without changing path geometry. */
.workflow span,
.technical-tabs article,
.system-main-chain > .system-node,
.bess-chain > span { --pulse-delay: 0s; }

.workflow span:nth-child(2),
.technical-tabs article:nth-child(2),
.system-main-chain > .system-node:nth-of-type(2),
.bess-chain > span:nth-child(2) { --pulse-delay: -.46s; }
.workflow span:nth-child(3),
.technical-tabs article:nth-child(3),
.system-main-chain > .system-node:nth-of-type(3),
.bess-chain > span:nth-child(3) { --pulse-delay: -.92s; }
.workflow span:nth-child(4),
.technical-tabs article:nth-child(4),
.system-main-chain > .system-node:nth-of-type(4) { --pulse-delay: -1.38s; }
.workflow span:nth-child(5),
.system-main-chain > .system-node:nth-of-type(5) { --pulse-delay: -1.84s; }
.workflow span:nth-child(6),
.system-main-chain > .system-node:nth-of-type(6) { --pulse-delay: -2.3s; }
.workflow span:nth-child(7),
.system-main-chain > .system-node:nth-of-type(7) { --pulse-delay: -2.76s; }
.workflow span:nth-child(8) { --pulse-delay: -3.22s; }
.workflow span:nth-child(9) { --pulse-delay: -3.68s; }
.workflow span:nth-child(10) { --pulse-delay: -4.14s; }

.workflow-pulse,
.home-workflow .workflow-pulse,
.technical-tabs article:not(:last-child)::before,
.system-main-chain > .system-node:not(:last-child)::before,
.bess-chain > span:not(:last-child)::before,
.bess-branch-desktop .bess-chain > span:last-child::after,
.mobile-branch-junction::after,
.bess-branch-mobile::after,
.main-chain-continuation::before {
  width: 6px;
  height: 6px;
  box-sizing: border-box;
  border: 0;
  background: radial-gradient(circle at 42% 42%, #f7fcff 0 18%, #92d6f4 24% 52%, #328bb5 72% 100%);
  box-shadow:
    -7px 0 0 -1px rgba(112,198,236,.54),
    -13px 0 0 -2px rgba(86,171,211,.27),
    -3px 0 7px rgba(63,153,196,.32);
  opacity: 0;
  will-change: transform, opacity;
}

.home-workflow .workflow-pulse,
.system-main-chain > .system-node:not(:last-child)::before,
.bess-chain > span:not(:last-child)::before,
.bess-branch-desktop .bess-chain > span:last-child::after,
.mobile-branch-junction::after,
.bess-branch-mobile::after,
.main-chain-continuation::before {
  width: 7px;
  height: 7px;
  box-sizing: border-box;
  border: 1px solid rgba(225,248,255,.82);
  background: radial-gradient(circle at 40% 40%, #fff 0 20%, #b9eaff 27% 53%, #3b9fc8 72% 100%);
  box-shadow:
    -9px 0 0 -1px rgba(126,213,250,.72),
    -17px 0 0 -2px rgba(92,184,225,.44),
    -5px 0 9px rgba(55,151,198,.46);
}

.workflow-pulse,
.home-workflow .workflow-pulse,
.technical-tabs article:not(:last-child)::before {
  animation-duration: 5.4s;
  animation-timing-function: cubic-bezier(.42, 0, .3, 1);
  animation-delay: var(--pulse-delay);
}

.system-main-chain > .system-node:not(:last-child)::before {
  animation-duration: 5.5s;
  animation-timing-function: cubic-bezier(.42, 0, .3, 1);
  animation-delay: var(--pulse-delay);
}
.bess-chain > span:not(:last-child)::before {
  animation-duration: 6.1s;
  animation-timing-function: cubic-bezier(.42, 0, .3, 1);
  animation-delay: calc(var(--pulse-delay) - .7s);
  box-shadow:
    -9px 0 0 -1px rgba(126,213,250,.62),
    -17px 0 0 -2px rgba(92,184,225,.36),
    -5px 0 9px rgba(55,151,198,.38);
}

.home-workflow span:nth-child(n+6):nth-child(-n+9) .workflow-pulse {
  box-shadow:
    9px 0 0 -1px rgba(126,213,250,.72),
    17px 0 0 -2px rgba(92,184,225,.44),
    5px 0 9px rgba(55,151,198,.46);
}
.pv-workflow span:nth-child(n+5):nth-child(-n+6) .workflow-pulse {
  box-shadow:
    7px 0 0 -1px rgba(112,198,236,.54),
    13px 0 0 -2px rgba(86,171,211,.27),
    3px 0 7px rgba(63,153,196,.32);
}
.home-workflow span:nth-child(5) .workflow-pulse,
.bess-branch-mobile::after,
.main-chain-continuation::before {
  box-shadow:
    0 -9px 0 -1px rgba(134,219,255,.78),
    0 -17px 0 -2px rgba(96,190,232,.48),
    0 -5px 10px rgba(55,151,198,.5);
}
.pv-workflow span:nth-child(4) .workflow-pulse {
  box-shadow:
    0 -7px 0 -1px rgba(112,198,236,.58),
    0 -13px 0 -2px rgba(86,171,211,.3),
    0 -3px 7px rgba(63,153,196,.34);
}
.bess-branch-desktop .bess-chain > span:last-child::after {
  box-shadow:
    0 9px 0 -1px rgba(126,213,250,.64),
    0 17px 0 -2px rgba(92,184,225,.36),
    0 5px 9px rgba(55,151,198,.4);
  animation-duration: 6.1s;
  animation-delay: -1.6s;
}

.workflow span::before,
.technical-tabs > article > span {
  animation: pulse-node-response 5.4s ease-in-out infinite;
  animation-delay: calc(var(--pulse-delay) + .12s);
}
.home-workflow span::before {
  animation-name: pulse-node-response-strong;
}
.system-main-chain > .system-node {
  animation: topology-node-response 5.5s ease-in-out infinite;
  animation-delay: calc(var(--pulse-delay) + .2s);
}
.bess-chain > span {
  animation: topology-node-response 6.1s ease-in-out infinite;
  animation-delay: calc(var(--pulse-delay) - .5s);
}

.desktop-bess-link svg > .return-flow-path {
  stroke: #a4e3ff;
  stroke-width: 3.4;
  stroke-linecap: round;
  stroke-dasharray: 10 5 4 6 2 48;
  opacity: .9;
  animation-duration: 6.2s;
  animation-delay: -.8s;
}

@keyframes workflow-dot-right {
  0%, 7% { transform: translateX(0); opacity: 0; }
  14% { opacity: .98; }
  76% { opacity: .9; }
  91%, 100% { transform: translateX(var(--flow-travel, 34px)); opacity: 0; }
}
@keyframes workflow-dot-left {
  0%, 7% { transform: translateX(0); opacity: 0; }
  14% { opacity: .98; }
  76% { opacity: .9; }
  91%, 100% { transform: translateX(calc(var(--flow-travel, 34px) * -1)); opacity: 0; }
}
@keyframes workflow-dot-down {
  0%, 7% { transform: translateY(0); opacity: 0; }
  14% { opacity: .98; }
  76% { opacity: .9; }
  91%, 100% { transform: translateY(var(--flow-travel, 24px)); opacity: 0; }
}
@keyframes workflow-dot-right-strong {
  0%, 7% { transform: translateX(0); opacity: 0; }
  14% { opacity: 1; }
  76% { opacity: .96; }
  91%, 100% { transform: translateX(var(--flow-travel, 34px)); opacity: 0; }
}
@keyframes workflow-dot-left-strong {
  0%, 7% { transform: translateX(0); opacity: 0; }
  14% { opacity: 1; }
  76% { opacity: .96; }
  91%, 100% { transform: translateX(calc(var(--flow-travel, 34px) * -1)); opacity: 0; }
}
@keyframes workflow-dot-down-strong {
  0%, 7% { transform: translateY(0); opacity: 0; }
  14% { opacity: 1; }
  76% { opacity: .96; }
  91%, 100% { transform: translateY(var(--flow-travel, 24px)); opacity: 0; }
}
.home-workflow .workflow-pulse { animation-name: workflow-dot-right-strong; }
.home-workflow span:nth-child(5) .workflow-pulse { animation-name: workflow-dot-down-strong; }
.home-workflow span:nth-child(n+6):nth-child(-n+9) .workflow-pulse { animation-name: workflow-dot-left-strong; }
@keyframes topology-dot-right {
  0%, 8% { transform: translateX(0); opacity: 0; }
  15% { opacity: 1; }
  74% { opacity: .94; }
  91%, 100% { transform: translateX(20px); opacity: 0; }
}
@keyframes topology-dot-down {
  0%, 8% { transform: translateY(0); opacity: 0; }
  15% { opacity: 1; }
  74% { opacity: .94; }
  91%, 100% { transform: translateY(28px); opacity: 0; }
}
@keyframes topology-dot-up {
  0%, 8% { transform: translateY(0); opacity: 0; }
  15% { opacity: .96; }
  74% { opacity: .88; }
  91%, 100% { transform: translateY(-50px); opacity: 0; }
}
@keyframes pulse-node-response {
  0%, 5%, 19%, 100% { box-shadow: 0 0 0 1px rgba(71,160,202,.1), 0 0 0 rgba(71,160,202,0); }
  10% { box-shadow: 0 0 0 3px rgba(91,184,226,.2), 0 0 10px rgba(63,153,196,.16); }
  14% { box-shadow: 0 0 0 2px rgba(91,184,226,.12), 0 0 6px rgba(63,153,196,.1); }
}
@keyframes pulse-node-response-strong {
  0%, 5%, 19%, 100% { box-shadow: 0 0 0 1px rgba(71,160,202,.12), 0 0 0 rgba(71,160,202,0); }
  10% { box-shadow: 0 0 0 4px rgba(104,199,239,.34), 0 0 14px rgba(57,158,205,.25); }
  14% { box-shadow: 0 0 0 3px rgba(96,192,234,.2), 0 0 9px rgba(57,158,205,.16); }
}
@keyframes topology-node-response {
  0%, 6%, 20%, 100% { box-shadow: 0 0 0 0 rgba(71,160,202,0); }
  11% { box-shadow: 0 0 0 4px rgba(102,198,239,.22), 0 0 16px rgba(57,158,205,.14); }
  15% { box-shadow: 0 0 0 3px rgba(96,192,234,.12), 0 0 10px rgba(57,158,205,.08); }
}
@keyframes topology-return-flow { to { stroke-dashoffset: -150; } }
@keyframes topology-branch-dot {
  0%, 7% {
    top: -28px;
    left: 50%;
    opacity: 0;
    box-shadow: 0 -9px 0 -1px rgba(126,213,250,.66), 0 -17px 0 -2px rgba(92,184,225,.38), 0 -5px 9px rgba(55,151,198,.42);
  }
  15% { opacity: .98; }
  45% {
    top: -8px;
    left: 50%;
    box-shadow: 0 -9px 0 -1px rgba(134,219,255,.74), 0 -17px 0 -2px rgba(96,190,232,.44), 0 -5px 10px rgba(55,151,198,.48);
  }
  53% {
    box-shadow: 9px 0 0 -1px rgba(134,219,255,.74), 17px 0 0 -2px rgba(96,190,232,.44), 5px 0 10px rgba(55,151,198,.48);
  }
  84% { opacity: .88; }
  93%, 100% {
    top: -8px;
    left: 22px;
    opacity: 0;
    box-shadow: 9px 0 0 -1px rgba(126,213,250,.66), 17px 0 0 -2px rgba(92,184,225,.38), 5px 0 9px rgba(55,151,198,.42);
  }
}

@media (max-width: 820px) {
  .workflow span:not(:last-child) .workflow-pulse,
  .workflow span:nth-child(n):not(:last-child) .workflow-pulse,
  .pv-workflow span:nth-child(n):not(:last-child) .workflow-pulse,
  .home-workflow span:nth-child(n):not(:last-child) .workflow-pulse,
  .technical-tabs article:not(:last-child)::before,
  .system-main-chain > .system-node:not(:last-child)::before,
  .bess-chain > span:not(:last-child)::before {
    box-shadow:
      0 -7px 0 -1px rgba(112,198,236,.54),
      0 -13px 0 -2px rgba(86,171,211,.27),
      0 -3px 7px rgba(63,153,196,.32);
  }
  .home-workflow span:not(:last-child) .workflow-pulse,
  .home-workflow span:nth-child(n):not(:last-child) .workflow-pulse,
  .system-main-chain > .system-node:not(:last-child)::before {
    box-shadow:
      0 -9px 0 -1px rgba(126,213,250,.72),
      0 -17px 0 -2px rgba(92,184,225,.44),
      0 -5px 9px rgba(55,151,198,.46);
  }
  .bess-chain > span:not(:last-child)::before {
    box-shadow:
      0 -9px 0 -1px rgba(126,213,250,.62),
      0 -17px 0 -2px rgba(92,184,225,.36),
      0 -5px 9px rgba(55,151,198,.38);
  }
  .mobile-branch-junction::after {
    animation-duration: 6.3s;
    animation-delay: -1.15s;
  }
  .bess-branch-mobile::after,
  .main-chain-continuation::before {
    animation-duration: 5.8s;
    animation-delay: -.7s;
  }
  .home-workflow span:not(:last-child) .workflow-pulse,
  .home-workflow span:nth-child(n):not(:last-child) .workflow-pulse {
    animation-name: workflow-dot-down-strong;
  }
}

@media (prefers-reduced-motion: reduce) {
  .workflow-pulse,
  .technical-tabs article:not(:last-child)::before,
  .system-main-chain > .system-node:not(:last-child)::before,
  .bess-chain > span:not(:last-child)::before,
  .bess-branch-desktop .bess-chain > span:last-child::after,
  .mobile-branch-junction::after,
  .bess-branch-mobile::after,
  .main-chain-continuation::before,
  .desktop-bess-link svg > .return-flow-path { display: none !important; }
  .workflow span::before,
  .technical-tabs > article > span,
  .system-main-chain > .system-node,
  .bess-chain > span { animation: none !important; }
}

html.flow-static-preview .workflow-pulse,
html.flow-static-preview .technical-tabs article:not(:last-child)::before,
html.flow-static-preview .system-main-chain > .system-node:not(:last-child)::before,
html.flow-static-preview .bess-chain > span:not(:last-child)::before,
html.flow-static-preview .bess-branch-desktop .bess-chain > span:last-child::after,
html.flow-static-preview .mobile-branch-junction::after,
html.flow-static-preview .bess-branch-mobile::after,
html.flow-static-preview .main-chain-continuation::before,
html.flow-static-preview .desktop-bess-link svg > .return-flow-path { display: none !important; }
html.flow-static-preview .workflow span::before,
html.flow-static-preview .technical-tabs > article > span,
html.flow-static-preview .system-main-chain > .system-node,
html.flow-static-preview .bess-chain > span { animation: none !important; }