/* Scoped to the four-module technology page; shared site styles stay unchanged. */
.technology-page { --tech-blue: #2874ef; --tech-cyan: #46d4dd; --tech-accent: #46d4dd; --tech-ink: #edf6ff; --tech-muted: #a3bacd; background: #071b2e; color: var(--tech-ink); }
.technology-hero { position: relative; overflow: hidden; padding: 66px 0 70px; background: radial-gradient(ellipse at 83% 65%, #217aa222, transparent 46%), linear-gradient(110deg, #071b2e, #0a2840); color: #edf6ff; border-bottom: 1px solid #7daecc26; }
.technology-hero::before { content: ''; position: absolute; width: 780px; height: 780px; right: -200px; top: -250px; border-radius: 50%; border: 1px solid #78b8ee1a; box-shadow: 0 0 0 100px #74aef407, 0 0 0 200px #74aef404; pointer-events: none; }
.technology-hero-layout { position: relative; display: grid; grid-template-columns: 1.45fr 1fr; gap: 80px; align-items: center; }
.technology-hero .template-kicker { color: #a3c4de; font-size: 10px; }
.technology-hero h1 { font-size: clamp(38px, 4.6vw, 64px); line-height: 1.2; margin: 22px 0 17px; font-weight: 600; }
.technology-hero-lead { margin: 0 0 18px; color: #91cfff; font-size: clamp(19px, 2vw, 25px); line-height: 1.5; font-weight: 500; }
.technology-hero-description { margin: 0; color: #b6cadb; font-size: 14px; line-height: 1.9; max-width: 550px; }
.technology-map { position: relative; display: grid; grid-template-columns: 1fr 1fr; width: 100%; max-width: 420px; justify-self: end; border-top: 1px solid #719dba35; border-left: 1px solid #719dba35; }
.technology-map > div { min-height: 105px; padding: 20px 22px; border-right: 1px solid #719dba35; border-bottom: 1px solid #719dba35; display: flex; flex-direction: column; gap: 14px; background: linear-gradient(140deg, #8acaff0b, #8acaff02); }
.technology-map span { color: #78a2c5; font: 10px ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .1em; }
.technology-map strong { font-size: 14px; line-height: 1.4; font-weight: 500; }
.technology-map i { position: absolute; left: calc(50% - 5px); top: calc(50% - 5px); width: 10px; height: 10px; background: #43d2dc; box-shadow: 0 0 0 7px #0a2840, 0 0 30px #43d2dc55; }
.technology-module { padding-block: 80px; background: radial-gradient(ellipse at 13% 50%, #226ba312, transparent 50%); border-bottom: 1px solid #84b9df1c; }
.technology-module:nth-child(even) { background: radial-gradient(ellipse at 88% 50%, #5288cf14, transparent 50%), #0b2136; }
.technology-module[data-technology="xray"] { --tech-accent: #b3a6ff; }
.technology-module[data-technology="industrial-vision"] { --tech-accent: #55dfc9; }
.technology-module[data-technology="industrial-llm"] { --tech-accent: #8bb9ff; }
.technology-module-layout { display: grid; grid-template-columns: .93fr 1.2fr; gap: clamp(40px, 5.8vw, 80px); align-items: center; }
.technology-module:nth-child(even) .technology-module-layout { grid-template-columns: 1.2fr .93fr; }
.technology-module:nth-child(even) .technology-visual { order: 2; }
.technology-visual { min-width: 0; background: radial-gradient(ellipse at 50% 48%, #16486b40, transparent 65%), linear-gradient(140deg, #0d2c47, #051526); border: 1px solid #699dd14a; border-radius: 16px; position: relative; overflow: hidden; box-shadow: 0 20px 65px #020e1b44, inset 0 1px 0 #9fceff1c; }
.technology-visual::before { content: ''; position: absolute; inset: 0; background-image: linear-gradient(#76a6cf0b 1px, transparent 1px), linear-gradient(90deg, #76a6cf0b 1px, transparent 1px); background-size: 28px 28px; mask-image: radial-gradient(ellipse at center, #000 30%, transparent 82%); pointer-events: none; }
.technology-visual::after { content: ''; height: 1px; position: absolute; inset: 0 25% auto; background: linear-gradient(90deg, transparent, var(--tech-accent), transparent); }
.technology-visual-meta { display: flex; position: absolute; top: 26px; left: 28px; right: 28px; justify-content: space-between; gap: 16px; font: 9px ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .09em; color: #90adc5; }
.technology-visual-meta > span:last-child { color: var(--tech-accent); }
.technology-visual svg { display: block; width: 100%; height: auto; position: relative; filter: drop-shadow(0 2px 8px #32a6d414); }
.technology-visual-steps { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; border-top: 1px solid #84b9df22; margin-inline: 28px; padding: 18px 0; color: #bddbee; font-size: 11px; text-align: center; position: relative; }
.technology-visual-steps span { padding: 8px; border: 1px solid #84b9df20; background: #81b8df06; border-radius: 4px; line-height: 1.5; }
.technology-visual-signature { margin: 0 28px 22px; display: flex; justify-content: space-between; gap: 14px; align-items: center; color: #7d9bb4; font: 10px ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .13em; }
.technology-visual-signature > span { font-size: 8px; letter-spacing: .08em; color: #52728e; }
.technology-module-copy { min-width: 0; }
.technology-module-copy .template-kicker { font-size: 10px; letter-spacing: .1em; color: #7cacc7; }
.technology-module-copy .template-kicker i { background: var(--tech-accent); }
.technology-module-copy h2 { color: var(--tech-ink); font-size: clamp(27px, 2.7vw, 37px); line-height: 1.3; margin: 14px 0 16px; font-weight: 600; }
.technology-module-lead { font-size: 18px; color: var(--tech-accent); font-weight: 500; line-height: 1.7; margin: 0 0 14px; }
.technology-module-description { font-size: 14px; line-height: 1.9; color: var(--tech-muted); margin: 0; }
.technology-capabilities { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin: 26px 0 0; }
.technology-capabilities > div { padding: 19px 18px; border: 1px solid #89b9df25; border-radius: 8px; background: linear-gradient(135deg, #95c7ef09, #95c7ef03); position: relative; }
.technology-capabilities dt { display: flex; gap: 10px; align-items: baseline; font-size: 14px; line-height: 1.6; font-weight: 600; color: #e1f0fc; margin-bottom: 10px; }
.technology-capabilities dt > span { font: 9px ui-monospace, SFMono-Regular, Consolas, monospace; color: var(--tech-accent); font-weight: 400; flex: 0 0 auto; opacity: .8; }
.technology-capabilities dd { font-size: 13px; color: var(--tech-muted); line-height: 1.85; margin: 0; }
@media (max-width: 1050px) {
  .technology-hero-layout { gap: 38px; grid-template-columns: 1.3fr 1fr; }
  .technology-map > div { padding: 18px 16px; }
  .technology-module-layout, .technology-module:nth-child(even) .technology-module-layout { grid-template-columns: .8fr 1.2fr; gap: 32px; }
  .technology-module:nth-child(even) .technology-visual { order: 0; }
  .technology-visual-meta { left: 20px; right: 20px; top: 20px; font-size: 8px; }
  .technology-capabilities { gap: 12px; }
  .technology-capabilities > div { padding: 16px 14px; }
  .technology-visual-steps { margin-inline: 20px; font-size: 10px; }
  .technology-visual-signature { margin-inline: 20px; }
}
@media (max-width: 980px) {
  .technology-module-layout, .technology-module:nth-child(even) .technology-module-layout { grid-template-columns: 1fr; gap: 34px; }
  .technology-visual { width: 100%; max-width: 700px; justify-self: center; }
  .technology-visual svg { max-height: 340px; }
}
@media (max-width: 760px) {
  .technology-hero { padding-block: 42px 45px; }
  .technology-hero-layout { grid-template-columns: 1fr; gap: 30px; }
  .technology-hero h1 { font-size: 38px; margin-block: 18px 14px; }
  .technology-hero-description { font-size: 13px; }
  .technology-map { max-width: none; }
  .technology-map > div { min-height: 82px; gap: 10px; padding: 15px 18px; }
  .technology-map strong { font-size: 12px; }
  .technology-module { padding-block: 48px; }
  .technology-module-layout, .technology-module:nth-child(even) .technology-module-layout { grid-template-columns: 1fr; gap: 26px; }
  .technology-visual { max-width: 560px; width: 100%; justify-self: center; }
  .technology-visual svg { max-height: 280px; }
  .technology-visual-steps { padding-block: 13px 16px; font-size: 10px; }
  .technology-module-copy h2 { font-size: 28px; }
  .technology-module-lead { font-size: 17px; }
  .technology-module-description { font-size: 14px; }
  .technology-module-copy .template-kicker { font-size: 9px; }
  .technology-capabilities dt { font-size: 13px; }
  .technology-capabilities dd { font-size: 13px; }
}
@media (max-width: 600px) {
  .technology-capabilities { grid-template-columns: 1fr; gap: 12px; }
  .technology-capabilities > div { padding: 17px 18px; }
  .technology-capabilities dt { font-size: 14px; }
  .technology-module-copy h2 { font-size: 26px; }
}