/* Enclosed technology display; scoped to this homepage section only. */
.technology-premium {
  --tech-violet: #d6b5f3;
  --tech-gold: #e6c692;
  padding: 76px 0;
  background: radial-gradient(ellipse at 9% 52%, #50225f26, transparent 48%), radial-gradient(ellipse at 97% 20%, #90633213, transparent 40%), #0e0814;
  scroll-margin-top: 112px;
}
.technology-premium:before { background: radial-gradient(#c9abd917 .7px, transparent 1px); background-size: 32px 32px; opacity: .45; animation: none; }
.technology-premium .tech-wrap {
  position: relative; isolation: isolate; overflow: hidden;
  width: min(1500px, calc(100% - 96px)); padding: 43px 42px 30px;
  border: 1px solid transparent; border-radius: 40px;
  background: radial-gradient(ellipse at 4% 0, #765a9829, transparent 45%) padding-box,
    radial-gradient(ellipse at 98% 70%, #a5804110, transparent 43%) padding-box,
    linear-gradient(125deg, #21162d, #130c1b 60%, #1c1320) padding-box,
    linear-gradient(125deg, #b791c999, #67467540 36%, #78603e5c 75%, #dfc18b99) border-box;
  box-shadow: 0 30px 80px #00000052, 0 2px 4px #00000030, inset 0 1px 0 #ffffff0d;
}
.technology-premium .tech-wrap:before { content: ''; position: absolute; z-index: -1; inset: 0; pointer-events: none; background: linear-gradient(118deg, #ffffff05, transparent 27%, transparent 74%, #e8c68b04); }
.technology-premium .tech-wrap:after { content: ''; position: absolute; inset: 8px; border: 1px solid #d7b3ea0c; border-radius: 32px; pointer-events: none; }
.technology-premium .tech-display-header { display: flex; align-items: center; justify-content: space-between; gap: 28px; padding: 0 6px 30px; border-bottom: 1px solid #ffffff0d; }
.technology-premium .tech-eyebrow { display: flex; align-items: center; gap: 12px; margin-bottom: 13px; color: var(--tech-gold); font-size: 10px; font-weight: 500; letter-spacing: 2.5px; }
.technology-premium .tech-eyebrow:before { content: ''; width: 24px; height: 1px; background: var(--tech-gold); }
.technology-premium .tech-display-header h2 { color: #faf6fd; font-size: clamp(28px, 2.7vw, 42px); font-weight: 500; line-height: 1.25; letter-spacing: -1.4px; }
.technology-premium .tech-display-header h2 span { color: var(--tech-gold); }
.technology-premium .tech-display-note { display: flex; align-items: center; gap: 15px; color: #b8a9c6; font-size: 11px; line-height: 1.8; }
.technology-premium .tech-display-note .icon { font-size: 26px; color: #a991bc; }
.technology-premium .tech-display-note strong { color: #e4d9eb; font-weight: 500; }
.technology-premium .technology-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, 1.22fr) minmax(0, 1fr); align-items: center; gap: 28px; padding: 28px 0; }
.technology-premium .tech-stack {
  --card-accent: #d6b5f3; --card-border: #c4a0e023; --card-tint: #be8ee40c;
  display: grid; gap: 12px; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; transform: none; animation: none;
}
.technology-premium .tech-stack-gold { --card-accent: #e6c692; --card-border: #e6c69225; --card-tint: #e6c69209; }
.technology-premium .tech-stack article {
  position: relative; min-width: 0; min-height: 88px; gap: 20px; padding: 16px 22px;
  border: 1px solid var(--card-border); border-radius: 17px;
  background: linear-gradient(112deg, var(--card-tint), #ffffff02);
  box-shadow: inset 0 1px 0 #ffffff04, 0 5px 16px #0000000c;
  transition: background .25s ease, border-color .25s ease, transform .25s ease;
}
.technology-premium .tech-stack article:after { content: ''; position: absolute; right: 16px; top: calc(50% - 2px); width: 4px; height: 4px; border: 1px solid var(--card-accent); border-radius: 50%; opacity: .35; }
.technology-premium .tech-stack .icon { width: 48px; height: 48px; border: 1px solid var(--card-border); border-radius: 14px; background: linear-gradient(145deg, var(--card-tint), #ffffff03); box-shadow: inset 0 1px 0 #ffffff05; color: var(--card-accent); font-size: 22px; }
.technology-premium .tech-stack h3 { color: #eee6f5; font-size: 15px; font-weight: 500; line-height: 1.6; letter-spacing: .05px; }
.technology-premium .tech-stack article:hover { transform: none; box-shadow: inset 0 1px 0 #ffffff04, 0 5px 16px #0000000c; }
.technology-premium .technology-core { position: relative; display: grid; place-items: center; height: 488px; width: auto; grid-column: auto; grid-row: auto; margin: 0; isolation: isolate; }
.technology-premium .energy-lines {
  inset: 0 -28px; z-index: -1;
  background: repeating-linear-gradient(transparent 0 43px, #be8ee437 44px 45px, transparent 46px 100px);
  mask-image: linear-gradient(90deg, #000, transparent 40%, transparent 60%, #000);
  -webkit-mask-image: linear-gradient(90deg, #000, transparent 40%, transparent 60%, #000);
  animation: tech-premium-connect 6s ease-in-out infinite;
}
.technology-premium .energy-lines:after { inset: 0 0 0 60%; background: repeating-linear-gradient(transparent 0 43px, #e6c69247 44px 45px, transparent 46px 100px); }
.technology-premium .energy-tube {
  inset: 14px 5%; overflow: hidden; border: 1px solid transparent; border-radius: 160px 160px 110px 110px;
  background: radial-gradient(ellipse at 50% 45%, #794da333, transparent 66%) padding-box,
    linear-gradient(115deg, #46334f70, #170e2085 37%, #201828a8 73%, #74604729) padding-box,
    linear-gradient(140deg, #cfb3eb6b, #d2b5ef12 38%, #dec6924d 78%, #ead1ac52) border-box;
  box-shadow: inset 8px 0 22px #cfb8df07, inset -8px 0 22px #e6c69206, 0 22px 44px #00000029;
  animation: none;
}
.technology-premium .energy-tube:before { content: ''; position: absolute; inset: 10px; border: 1px solid #ddc8ed0e; border-radius: inherit; background: linear-gradient(115deg, #e9dcf90c, transparent 28%, transparent 76%, #f7e5c606); }
.technology-premium .energy-tube i { inset: 0; background: linear-gradient(110deg, transparent 22%, #ead7fa08 38%, #fff4ff10 39%, transparent 53%); box-shadow: none; animation: tech-premium-reflection 12s ease-in-out infinite; }
.technology-premium .core-cap { left: 22%; width: 56%; height: 28px; border: 1px solid #b898d51a; background: radial-gradient(ellipse, #b584cf12, transparent 70%); box-shadow: none; animation: none; }
.technology-premium .cap-top { top: 25px; opacity: .4; }
.technology-premium .cap-bottom { bottom: 27px; border-color: #e6c6922e; }
.technology-premium .core-overline { position: absolute; z-index: 3; top: 72px; color: #bbaac9; font-size: 9px; font-weight: 500; letter-spacing: 2.2px; }
.technology-premium .core-logo {
  width: 204px; height: 204px; border: 1px solid #d8b4ee70;
  background: radial-gradient(circle at 32% 18%, #67437b, #2d173e 38%, #180c24 76%);
  box-shadow: 0 0 48px #9761c324, inset 0 1px 10px #e7c1fc40, inset 0 -12px 30px #00000052;
  animation: tech-premium-core 7s ease-in-out infinite;
}
.technology-premium .core-logo img { width: 150px; height: 60px; object-fit: contain; filter: drop-shadow(0 3px 10px #00000025); transform: none; animation: none; }
.technology-premium .core-logo:before { content: ''; position: absolute; inset: -22px; border: 1px solid #c19ddb35; border-top-color: #e9d5a3b3; border-right-color: #e9d5a360; border-radius: 50%; box-shadow: 0 -3px 16px #e9d5a308; animation: tech-premium-orbit 26s linear infinite; }
.technology-premium .core-logo:after { inset: -37px; border: 1px solid #c19ddb14; background: none; animation: none; }
.technology-premium .core-caption { position: absolute; z-index: 3; bottom: 67px; left: 0; right: 0; color: #e9d8bd; font-size: 11px; font-weight: 500; text-align: center; }
.technology-premium .core-caption span { display: block; margin-top: 7px; color: #ad9bbd; font-size: 9px; font-weight: 400; letter-spacing: .25px; }
.technology-premium .tech-bottom { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0; margin-top: 4px; padding: 8px; border: 1px solid #ceadd81c; border-radius: 20px; background: linear-gradient(110deg, #ffffff03, #ffffff01); box-shadow: inset 0 1px 0 #ffffff04; }
.technology-premium .tech-bottom article { min-width: 0; min-height: 80px; justify-content: center; gap: 16px; padding: 16px 12px; border: 0; border-radius: 0; background: none; }
.technology-premium .tech-bottom article + article { border-left: 1px solid #d4b1e112; }
.technology-premium .tech-bottom .icon { color: #bea0d1; font-size: 25px; filter: none; animation: none; }
.technology-premium .tech-bottom h3 { color: #d6c9df; font-size: 11px; font-weight: 500; line-height: 1.7; letter-spacing: .1px; }
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .technology-premium .tech-stack article:hover { border-color: var(--card-accent); background: linear-gradient(112deg, var(--card-tint), #ffffff06); transform: translateY(-2px); }
}
@keyframes tech-premium-connect { 0%, 100% { opacity: .45; } 50% { opacity: .9; } }
@keyframes tech-premium-reflection { 0%, 100% { transform: translateX(-13%); opacity: .35; } 50% { transform: translateX(13%); opacity: .8; } }
@keyframes tech-premium-core { 0%, 100% { box-shadow: 0 0 48px #9761c324, inset 0 1px 10px #e7c1fc40, inset 0 -12px 30px #00000052; } 50% { box-shadow: 0 0 60px #9761c33b, inset 0 1px 12px #e7c1fc52, inset 0 -12px 30px #00000052; } }
@keyframes tech-premium-orbit { to { transform: rotate(360deg); } }
@media (max-width: 1200px) {
  .technology-premium .tech-wrap { width: calc(100% - 56px); padding: 34px 30px 25px; border-radius: 34px; }
  .technology-premium .tech-wrap:after { border-radius: 26px; }
  .technology-premium .technology-grid { grid-template-columns: minmax(0, 1fr) minmax(250px, 1.1fr) minmax(0, 1fr); gap: 18px; }
  .technology-premium .tech-stack article { gap: 14px; padding: 15px; }
  .technology-premium .tech-stack article:after { display: none; }
  .technology-premium .tech-stack .icon { width: 42px; height: 42px; border-radius: 12px; font-size: 20px; }
  .technology-premium .tech-stack h3 { font-size: 13px; }
  .technology-premium .energy-lines { left: -18px; right: -18px; }
  .technology-premium .core-logo { width: 176px; height: 176px; }
  .technology-premium .core-logo img { width: 130px; height: 52px; }
  .technology-premium .core-logo:after { inset: -30px; }
  .technology-premium .core-logo:before { inset: -17px; }
  .technology-premium .tech-bottom article { gap: 12px; padding: 14px 9px; }
  .technology-premium .tech-bottom .icon { font-size: 22px; }
}
@media (max-width: 940px) {
  .technology-premium { padding: 48px 0; }
  .technology-premium .tech-wrap { width: calc(100% - 40px); padding: 30px 24px 24px; }
  .technology-premium .tech-display-header { padding-bottom: 24px; }
  .technology-premium .tech-display-header h2 { font-size: 32px; }
  .technology-premium .technology-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; padding: 0 0 26px; }
  .technology-premium .technology-core { grid-column: 1 / -1; grid-row: 1; justify-self: center; width: min(100%, 420px); height: 394px; }
  .technology-premium .energy-tube { inset: 22px 8%; border-radius: 150px 150px 85px 85px; }
  .technology-premium .energy-lines { display: none; }
  .technology-premium .core-overline { top: 55px; }
  .technology-premium .core-caption { bottom: 48px; }
  .technology-premium .cap-top { top: 31px; }
  .technology-premium .cap-bottom { bottom: 31px; }
  .technology-premium .tech-stack article { min-height: 82px; padding: 15px 18px; gap: 20px; }
  .technology-premium .tech-stack h3 { font-size: 14px; }
  .technology-premium .tech-bottom article { flex-direction: column; text-align: center; gap: 9px; }
  .technology-premium .tech-bottom h3 { font-size: 10px; }
}
@media (max-width: 600px) {
  .technology-premium { padding: 32px 0; }
  .technology-premium .tech-wrap { width: calc(100% - 24px); padding: 28px 16px 18px; border-radius: 28px; }
  .technology-premium .tech-wrap:after { inset: 6px; border-radius: 22px; }
  .technology-premium .tech-display-header { padding: 0 3px 22px; }
  .technology-premium .tech-eyebrow { font-size: 8px; letter-spacing: 1.9px; gap: 9px; }
  .technology-premium .tech-eyebrow:before { width: 16px; }
  .technology-premium .tech-display-header h2 { font-size: clamp(24px, 6vw, 32px); letter-spacing: -.9px; }
  .technology-premium .tech-display-note { display: none; }
  .technology-premium .technology-grid { gap: 12px; padding-bottom: 22px; }
  .technology-premium .technology-core { width: min(100%, 350px); height: 370px; }
  .technology-premium .core-overline { top: 53px; font-size: 8px; }
  .technology-premium .core-logo { width: 160px; height: 160px; }
  .technology-premium .core-logo img { width: 120px; height: 48px; }
  .technology-premium .core-caption { bottom: 49px; font-size: 10px; }
  .technology-premium .core-caption span { font-size: 8px; }
  .technology-premium .tech-stack { gap: 10px; }
  .technology-premium .tech-stack article { gap: 10px; min-height: 78px; padding: 12px 10px; border-radius: 13px; }
  .technology-premium .tech-stack .icon { width: 33px; height: 36px; font-size: 17px; border-radius: 10px; }
  .technology-premium .tech-stack h3 { font-size: 10px; line-height: 1.6; overflow-wrap: anywhere; }
  .technology-premium .tech-bottom { display: flex; flex-wrap: wrap; justify-content: center; padding: 8px 4px; border-radius: 17px; }
  .technology-premium .tech-bottom article { flex: 0 0 33.3333%; min-height: 92px; padding: 13px 5px; }
  .technology-premium .tech-bottom article + article { border-left: 0; }
  .technology-premium .tech-bottom .icon { font-size: 22px; }
  .technology-premium .tech-bottom h3 { font-size: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .technology-premium *, .technology-premium *:before, .technology-premium *:after { animation: none !important; transition: none !important; }
}