19ad0057c8
- header.svg rebuilt blue-dominant (gold demoted to accent) - new assets: desktop-preview.svg, architecture.svg, os-screenshot.png (real render) - README: blue badges, embedded hero + diagram, wiki link - fix dead Tabler icon-font CDN (cdnjs 404 -> jsdelivr) in live + repo OS desktop - fix broken ./docs/ai-stack.md badge link (file now exists) - add docs/academy.md, docs/islamic-layer.md, docs/ai-stack.md - SERVICES.md: Academy + Islamic layer sections Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
115 lines
6.3 KiB
XML
115 lines
6.3 KiB
XML
<svg width="1200" height="400" viewBox="0 0 1200 400" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Atlas OS">
|
|
<defs>
|
|
<radialGradient id="bg" cx="50%" cy="42%" r="75%">
|
|
<stop offset="0%" stop-color="#0e2350"/>
|
|
<stop offset="45%" stop-color="#081637"/>
|
|
<stop offset="100%" stop-color="#020812"/>
|
|
</radialGradient>
|
|
<radialGradient id="neb1" cx="50%" cy="50%" r="50%">
|
|
<stop offset="0%" stop-color="#2f6fd0" stop-opacity="0.55"/>
|
|
<stop offset="100%" stop-color="#2f6fd0" stop-opacity="0"/>
|
|
</radialGradient>
|
|
<radialGradient id="neb2" cx="50%" cy="50%" r="50%">
|
|
<stop offset="0%" stop-color="#1c4fae" stop-opacity="0.5"/>
|
|
<stop offset="100%" stop-color="#1c4fae" stop-opacity="0"/>
|
|
</radialGradient>
|
|
<radialGradient id="neb3" cx="50%" cy="50%" r="50%">
|
|
<stop offset="0%" stop-color="#5b8be8" stop-opacity="0.35"/>
|
|
<stop offset="100%" stop-color="#5b8be8" stop-opacity="0"/>
|
|
</radialGradient>
|
|
<linearGradient id="aGrad" x1="0%" y1="0%" x2="100%" y2="100%">
|
|
<stop offset="0%" stop-color="#79b6ff"/>
|
|
<stop offset="55%" stop-color="#4a9fe2"/>
|
|
<stop offset="100%" stop-color="#2b6fc4"/>
|
|
</linearGradient>
|
|
<linearGradient id="txt" x1="0%" y1="0%" x2="0%" y2="100%">
|
|
<stop offset="0%" stop-color="#eaf3ff"/>
|
|
<stop offset="100%" stop-color="#7fb6f0"/>
|
|
</linearGradient>
|
|
<filter id="glow" x="-60%" y="-60%" width="220%" height="220%">
|
|
<feGaussianBlur stdDeviation="5" result="b"/>
|
|
<feMerge><feMergeNode in="b"/><feMergeNode in="SourceGraphic"/></feMerge>
|
|
</filter>
|
|
<filter id="softglow" x="-80%" y="-80%" width="260%" height="260%">
|
|
<feGaussianBlur stdDeviation="9"/>
|
|
</filter>
|
|
<style>
|
|
.s1{animation:t1 3.2s ease-in-out infinite}
|
|
.s2{animation:t2 4.1s ease-in-out infinite}
|
|
.s3{animation:t3 2.6s ease-in-out infinite}
|
|
.s4{animation:t4 5s ease-in-out infinite}
|
|
@keyframes t1{0%,100%{opacity:.25}50%{opacity:1}}
|
|
@keyframes t2{0%,100%{opacity:.5}50%{opacity:.15}}
|
|
@keyframes t3{0%,100%{opacity:.2}40%{opacity:.95}}
|
|
@keyframes t4{0%,100%{opacity:.7}50%{opacity:.3}}
|
|
.orb{transform-origin:600px 196px}
|
|
.o1{animation:spin 22s linear infinite}
|
|
.o2{animation:spin 22s linear infinite;animation-delay:-11s}
|
|
.o3{animation:spin 38s linear infinite}
|
|
.o4{animation:spin 38s linear infinite;animation-delay:-19s}
|
|
.o5{animation:spin 38s linear infinite;animation-delay:-28s}
|
|
@keyframes spin{to{transform:rotate(360deg)}}
|
|
.title{animation:float 6s ease-in-out infinite}
|
|
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
|
|
.pulse{animation:pulse 4s ease-in-out infinite}
|
|
@keyframes pulse{0%,100%{opacity:.6}50%{opacity:1}}
|
|
</style>
|
|
</defs>
|
|
|
|
<rect width="1200" height="400" fill="url(#bg)"/>
|
|
<ellipse cx="290" cy="150" rx="300" ry="220" fill="url(#neb1)"/>
|
|
<ellipse cx="940" cy="250" rx="320" ry="200" fill="url(#neb2)"/>
|
|
<ellipse cx="600" cy="196" rx="260" ry="180" fill="url(#neb3)"/>
|
|
|
|
<!-- starfield -->
|
|
<g fill="#dce9ff">
|
|
<circle class="s1" cx="80" cy="60" r="1.6"/><circle class="s3" cx="150" cy="120" r="1.1"/>
|
|
<circle class="s2" cx="210" cy="40" r="1.4"/><circle class="s4" cx="300" cy="90" r="1"/>
|
|
<circle class="s1" cx="120" cy="200" r="1.2"/><circle class="s3" cx="60" cy="300" r="1.5"/>
|
|
<circle class="s2" cx="180" cy="330" r="1.1"/><circle class="s4" cx="260" cy="270" r="1.3"/>
|
|
<circle class="s1" cx="360" cy="320" r="1"/><circle class="s3" cx="420" cy="60" r="1.4"/>
|
|
<circle class="s2" cx="480" cy="130" r="1.1"/><circle class="s4" cx="520" cy="300" r="1.2"/>
|
|
<circle class="s1" cx="700" cy="50" r="1.3"/><circle class="s3" cx="760" cy="110" r="1"/>
|
|
<circle class="s2" cx="820" cy="60" r="1.5"/><circle class="s4" cx="880" cy="120" r="1.1"/>
|
|
<circle class="s1" cx="950" cy="70" r="1.2"/><circle class="s3" cx="1020" cy="130" r="1.4"/>
|
|
<circle class="s2" cx="1080" cy="70" r="1.1"/><circle class="s4" cx="1140" cy="120" r="1.3"/>
|
|
<circle class="s1" cx="980" cy="300" r="1.2"/><circle class="s3" cx="1050" cy="330" r="1"/>
|
|
<circle class="s2" cx="1110" cy="280" r="1.5"/><circle class="s4" cx="1160" cy="330" r="1.1"/>
|
|
<circle class="s1" cx="640" cy="340" r="1.2"/><circle class="s3" cx="720" cy="330" r="1.3"/>
|
|
<circle class="s2" cx="560" cy="350" r="1"/><circle class="s4" cx="900" cy="330" r="1.2"/>
|
|
<circle class="s1" cx="40" cy="160" r="1"/><circle class="s3" cx="1170" cy="200" r="1.2"/>
|
|
</g>
|
|
|
|
<!-- orbit rings -->
|
|
<circle cx="600" cy="196" r="102" fill="none" stroke="#4a9fe2" stroke-opacity="0.28" stroke-width="1"/>
|
|
<circle cx="600" cy="196" r="150" fill="none" stroke="#79b6ff" stroke-opacity="0.16" stroke-width="1"/>
|
|
|
|
<!-- orbiting dots (blue, one gold accent) -->
|
|
<g class="orb o1"><circle cx="702" cy="196" r="3.2" fill="#79b6ff" filter="url(#softglow)"/></g>
|
|
<g class="orb o2"><circle cx="702" cy="196" r="2.4" fill="#4a9fe2"/></g>
|
|
<g class="orb o3"><circle cx="750" cy="196" r="3.6" fill="#e0a234" filter="url(#softglow)"/></g>
|
|
<g class="orb o4"><circle cx="750" cy="196" r="2.6" fill="#acd2ff"/></g>
|
|
<g class="orb o5"><circle cx="750" cy="196" r="2.2" fill="#4a9fe2"/></g>
|
|
|
|
<!-- Atlas A logo -->
|
|
<g filter="url(#glow)">
|
|
<path d="M600 116 L664 218 L634 218 L626 198 L574 198 L566 218 L536 218 Z" fill="url(#aGrad)"/>
|
|
<path d="M600 142 L619 192 L581 192 Z" fill="#081637"/>
|
|
<path d="M600 116 L664 218 L634 218 L626 198 L574 198 L566 218 L536 218 Z" fill="none" stroke="#e0a234" stroke-opacity="0.6" stroke-width="1.2"/>
|
|
</g>
|
|
<circle class="pulse" cx="600" cy="196" r="3" fill="#eaf3ff"/>
|
|
|
|
<!-- wordmark -->
|
|
<g class="title">
|
|
<text x="600" y="304" text-anchor="middle" font-family="'Segoe UI',Helvetica,Arial,sans-serif" font-size="50" font-weight="700" letter-spacing="14" fill="url(#txt)">ATLAS OS</text>
|
|
<text x="600" y="338" text-anchor="middle" font-family="'Segoe UI',Helvetica,Arial,sans-serif" font-size="13" font-weight="500" letter-spacing="5" fill="#7fa8d8">YOUR BUSINESS · ONE BOX · BEYOND LIMITS</text>
|
|
</g>
|
|
|
|
<!-- corner accents -->
|
|
<g stroke="#4a9fe2" stroke-opacity="0.5" stroke-width="1.5" fill="none">
|
|
<path d="M24 24 L24 56 M24 24 L56 24"/>
|
|
<path d="M1176 24 L1176 56 M1176 24 L1144 24"/>
|
|
<path d="M24 376 L24 344 M24 376 L56 376"/>
|
|
<path d="M1176 376 L1176 344 M1176 376 L1144 376"/>
|
|
</g>
|
|
</svg>
|
