/* Visual language: icons, diagrams, and image-like surfaces */
.icon{position:relative;font-size:0;overflow:hidden}.icon:before,.icon:after{content:"";position:absolute;border:1.5px solid currentColor}.card:nth-child(1) .icon:before{width:19px;height:13px;left:11px;top:14px;transform:skewY(-18deg)}.card:nth-child(1) .icon:after{width:13px;height:13px;left:16px;top:19px;border-top:0;transform:skewY(-18deg)}.card:nth-child(2) .icon:before{width:10px;height:10px;left:8px;top:9px;border-radius:3px;box-shadow:17px 17px 0 -1px transparent}.card:nth-child(2) .icon:after{width:20px;height:20px;left:13px;top:15px;border-left:0;border-bottom:0;transform:rotate(45deg)}.card:nth-child(3) .icon:before{width:20px;height:20px;left:11px;top:11px;border-radius:50%}.card:nth-child(3) .icon:after{width:7px;height:7px;left:18px;top:18px;border-radius:50%;background:currentColor;box-shadow:0 0 0 4px rgba(53,217,255,.15)}
.scene{padding-top:30px}.scene:before{content:"";display:block;width:58px;height:58px;margin-bottom:20px;border:1px solid rgba(61,203,247,.4);border-radius:16px;background:linear-gradient(135deg,rgba(55,214,255,.2),rgba(112,76,235,.25));box-shadow:inset 0 0 25px rgba(66,193,255,.12)}.scene:nth-child(1):before{background:linear-gradient(135deg,rgba(46,217,255,.3),rgba(41,105,255,.15));clip-path:polygon(50% 8%,90% 28%,82% 76%,50% 94%,18% 76%,10% 28%)}.scene:nth-child(2):before{border-radius:50%;box-shadow:18px 0 0 -8px var(--neon),9px 15px 0 -8px var(--violet),inset 0 0 25px rgba(66,193,255,.12)}.scene:nth-child(3):before{background:linear-gradient(135deg,rgba(122,92,255,.3),rgba(28,189,255,.16));clip-path:polygon(50% 5%,88% 22%,77% 83%,50% 96%,23% 83%,12% 22%)}.scene:nth-child(4):before{background:repeating-linear-gradient(135deg,rgba(49,211,255,.35) 0 3px,transparent 3px 9px)}.scene:nth-child(5):before{border-radius:50% 50% 16px 16px;background:linear-gradient(160deg,rgba(53,217,255,.35),rgba(72,66,216,.24))}.scene:nth-child(6):before{background:linear-gradient(160deg,transparent 45%,rgba(53,217,255,.5) 46% 49%,transparent 50%),linear-gradient(25deg,transparent 48%,rgba(139,92,246,.5) 49% 52%,transparent 53%)}
.step:after{content:"";display:block;width:100%;height:4px;margin-top:25px;background:linear-gradient(90deg,var(--neon),var(--violet));opacity:.65}.step:nth-child(2):after{background:linear-gradient(90deg,var(--electric),var(--neon))}.step:nth-child(3):after{background:linear-gradient(90deg,var(--violet),var(--electric))}.step:nth-child(4):after{background:linear-gradient(90deg,var(--neon),#8dffcc)}
.meaning>div:last-child{position:relative}.meaning>div:last-child:before{content:"";display:block;position:absolute;right:3%;top:-20px;width:180px;height:180px;border:1px solid rgba(53,217,255,.24);border-radius:50%;box-shadow:0 0 0 22px rgba(53,217,255,.04),0 0 0 44px rgba(139,92,246,.04)}.pillars{position:relative;z-index:1}.preview .graph{background-image:linear-gradient(30deg,transparent 48%,rgba(93,231,255,.38) 49% 50%,transparent 51%),linear-gradient(150deg,transparent 48%,rgba(132,102,255,.4) 49% 50%,transparent 51%)}
@media(max-width:800px){.scene:before{width:48px;height:48px;margin-bottom:16px}.meaning>div:last-child:before{width:130px;height:130px;right:-10px}}

/* Semantic domain icons */
.scene:before{clip-path:none!important;background-color:#102c49;background-repeat:no-repeat;background-position:center;background-size:32px 32px;border-radius:14px}
.scene:nth-child(1):before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none' stroke='%2343d9ef' stroke-width='1.8'%3E%3Cpath d='m5 15 11-9 11 9v11H5V15Z'/%3E%3Cpath d='M12 26v-7h8v7M9 15h14'/%3E%3C/svg%3E")}
.scene:nth-child(2):before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none' stroke='%2343d9ef' stroke-width='1.8'%3E%3Ccircle cx='11' cy='11' r='4'/%3E%3Ccircle cx='22' cy='12' r='3.5'/%3E%3Cpath d='M4 25c.8-5 3-7 7-7s6.2 2 7 7M17 25c.5-3.8 2.1-5.5 5-5.5 3 0 4.8 2 5.5 5.5'/%3E%3C/svg%3E")}
.scene:nth-child(3):before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none' stroke='%2343d9ef' stroke-width='1.8'%3E%3Cpath d='M16 5v22M5 16h22'/%3E%3Crect x='5' y='5' width='22' height='22' rx='5'/%3E%3Cpath d='m22 9-3 5 2 2-5 7' stroke='%23916bff'/%3E%3C/svg%3E")}
.scene:nth-child(4):before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none' stroke='%2343d9ef' stroke-width='1.6'%3E%3Ccircle cx='16' cy='16' r='11'/%3E%3Cpath d='M5 16h22M16 5c3 3 4.5 6.7 4.5 11S19 24 16 27M16 5c-3 3-4.5 6.7-4.5 11S13 24 16 27M7 10h18M7 22h18'/%3E%3Cpath d='M22 8 27 6l-1 5' stroke='%23916bff'/%3E%3C/svg%3E")}
.scene:nth-child(5):before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none' stroke='%2343d9ef' stroke-width='1.8'%3E%3Cpath d='M8 11h16l2 16H6l2-16Z'/%3E%3Cpath d='M11 12V9a5 5 0 0 1 10 0v3M10 17h12'/%3E%3C/svg%3E")}
.scene:nth-child(6):before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none' stroke='%2343d9ef' stroke-width='1.8'%3E%3Cpath d='M5 25 12 18l5 4 10-12'/%3E%3Cpath d='M21 10h6v6M5 27h22' stroke='%23916bff'/%3E%3Ccircle cx='12' cy='18' r='1.5' fill='%2343d9ef'/%3E%3C/svg%3E")}
