clawdie-ai/html/osa/index.html
Sam & Claude 8fb96f68c4
Some checks failed
CI / ci (pull_request) Has been cancelled
Docs polish
2026-06-12 20:27:32 +02:00

1010 lines
35 KiB
HTML

<!DOCTYPE html>
<html lang="sl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>OSA — Odprtokodni Aktivizem</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,600;1,300;1,400&family=DM+Mono:wght@300;400&display=swap" rel="stylesheet">
<style>
:root {
--cream: #f5f0e8;
--amber: #c8872a;
--amber-dark: #8b5e1a;
--charcoal: #1a1814;
--grey: #6b6560;
--grey-light: #d4cec6;
--paper: #ede8de;
--ink: #2c2820;
}
* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
background-color: var(--cream);
color: var(--ink);
font-family: 'Cormorant Garamond', Georgia, serif;
font-size: 22px;
line-height: 1.7;
overflow-x: hidden;
}
.hex-bg {
position: fixed;
top: 0; left: 0;
width: 100%; height: 100%;
opacity: 0.035;
pointer-events: none;
z-index: 0;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='100'%3E%3Cpath d='M28 66L0 50V16L28 0l28 16v34L28 66zM28 100L0 84V66l28 16 28-16v18L28 100z' fill='none' stroke='%238b5e1a' stroke-width='1'/%3E%3C/svg%3E");
background-size: 56px 100px;
}
.container {
max-width: 900px;
margin: 0 auto;
padding: 0 2rem;
position: relative;
z-index: 1;
}
/* --- LANG SWITCH --- */
.lang-switch {
position: absolute;
top: 1.5rem;
right: 0;
display: flex;
gap: 0.3rem;
font-family: 'DM Mono', monospace;
font-size: 0.8rem;
letter-spacing: 0.12em;
text-transform: uppercase;
z-index: 10;
}
.lang-switch a {
color: var(--grey);
text-decoration: none;
padding: 0.25rem 0.5rem;
border: 1px solid var(--grey-light);
transition: color 0.2s, border-color 0.2s;
}
.lang-switch a.active,
.lang-switch a:hover {
color: var(--amber);
border-color: var(--amber);
}
header {
padding: 5rem 0 3rem;
position: relative;
animation: fadeUp 1.2s ease forwards;
}
.header-inner {
display: flex;
align-items: flex-start;
gap: 3rem;
}
.wasp-symbol {
font-size: 5rem;
line-height: 1;
animation: float 6s ease-in-out infinite;
flex-shrink: 0;
color: var(--amber);
font-family: 'DM Mono', monospace;
}
.header-text h1 {
font-size: clamp(3rem, 8vw, 5.5rem);
font-weight: 300;
letter-spacing: -0.02em;
line-height: 0.95;
color: var(--charcoal);
}
.header-text h1 span {
color: var(--amber);
font-style: italic;
}
.tagline {
font-family: 'DM Mono', monospace;
font-size: 0.75rem;
font-weight: 300;
letter-spacing: 0.15em;
text-transform: uppercase;
color: var(--grey);
margin-top: 1.2rem;
border-left: 2px solid var(--amber);
padding-left: 1rem;
}
.hero-statement {
background: var(--charcoal);
color: var(--cream);
padding: 4rem 3rem;
margin: 3rem 0;
position: relative;
overflow: hidden;
display: flex;
flex-direction: column;
}
.hero-statement::before {
content: '⬡';
position: absolute;
right: -1rem;
top: -2rem;
font-size: 12rem;
color: var(--amber);
opacity: 0.08;
font-family: 'DM Mono', monospace;
line-height: 1;
}
.hero-statement p {
font-size: clamp(1.4rem, 3vw, 2rem);
font-weight: 300;
line-height: 1.5;
color: var(--cream);
margin: 0;
}
.hero-statement p strong {
color: var(--amber);
font-weight: 600;
}
.divider {
width: 100%;
height: 1px;
background: var(--amber);
margin: 3rem 0;
opacity: 0.3;
}
section {
margin: 4rem 0;
opacity: 0;
transform: translateY(20px);
transition: opacity 0.8s ease, transform 0.8s ease;
}
section.visible {
opacity: 1;
transform: translateY(0);
}
h2 {
font-size: 1.8rem;
font-weight: 300;
font-style: italic;
color: var(--charcoal);
margin-bottom: 1.2rem;
position: relative;
padding-bottom: 0.5rem;
}
h2::after {
content: '';
position: absolute;
bottom: 0; left: 0;
width: 40px;
height: 1px;
background: var(--amber);
}
p {
color: var(--ink);
font-size: 1.1rem;
margin-bottom: 1rem;
font-weight: 300;
}
p strong {
font-weight: 600;
color: var(--charcoal);
}
section a {
color: var(--amber);
text-decoration: none;
border-bottom: 1px solid transparent;
transition: border-color 0.2s;
}
section a:hover {
border-bottom-color: var(--amber);
}
/* --- AI NOTE --- */
.ai-note {
background: var(--paper);
border-left: 3px solid rgba(200, 135, 42, 0.35);
padding: 1.5rem 2rem;
margin: 2rem 0;
}
.ai-note-label {
font-family: 'DM Mono', monospace;
font-size: 0.8rem;
letter-spacing: 0.15em;
text-transform: uppercase;
color: var(--amber);
margin-bottom: 1rem;
display: block;
}
.ai-note p {
color: var(--grey);
font-size: 1rem;
margin-bottom: 0.8rem;
}
.ai-note p:last-child { margin-bottom: 0; }
.ai-note p strong {
color: var(--charcoal);
}
.comparison {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 1px;
background: var(--grey-light);
margin: 2rem 0;
}
.comparison-side { padding: 2rem; background: var(--cream); }
.comparison-side.dome { background: var(--paper); }
.comparison-label {
font-family: 'DM Mono', monospace;
font-size: 0.7rem;
letter-spacing: 0.15em;
text-transform: uppercase;
margin-bottom: 1rem;
padding-bottom: 0.5rem;
border-bottom: 1px solid var(--grey-light);
}
.comparison-side.box .comparison-label { color: var(--grey); }
.comparison-side.dome .comparison-label { color: var(--amber); }
.comparison-side ul { list-style: none; padding: 0; }
.comparison-side ul li {
font-size: 0.95rem;
font-weight: 300;
padding: 0.3rem 0;
color: var(--ink);
border-bottom: 1px solid var(--grey-light);
}
.comparison-side ul li:last-child { border-bottom: none; }
.comparison-side.box ul li::before { content: '✗ '; color: var(--grey); }
.comparison-side.dome ul li::before { content: '⬡ '; color: var(--amber); }
blockquote {
border-left: 3px solid var(--amber);
padding: 1.5rem 2rem;
margin: 2.5rem 0;
background: var(--paper);
font-style: italic;
font-size: 1.3rem;
font-weight: 300;
color: var(--charcoal);
}
blockquote cite {
display: block;
font-style: normal;
font-family: 'DM Mono', monospace;
font-size: 0.7rem;
letter-spacing: 0.1em;
color: var(--grey);
margin-top: 0.8rem;
text-transform: uppercase;
}
.principles {
display: grid;
gap: 1px;
background: var(--grey-light);
border: 1px solid var(--grey-light);
margin: 2rem 0;
}
.principle {
background: var(--cream);
padding: 1.5rem;
display: grid;
grid-template-columns: 3rem 1fr;
gap: 1rem;
align-items: start;
transition: background 0.3s ease;
}
.principle:hover { background: var(--paper); }
.principle-num {
font-family: 'DM Mono', monospace;
font-size: 0.7rem;
color: var(--amber);
letter-spacing: 0.1em;
padding-top: 0.3rem;
}
.principle-text { font-size: 1.05rem; font-weight: 300; line-height: 1.6; }
.principle-text strong {
display: block;
font-weight: 600;
font-size: 1.1rem;
margin-bottom: 0.3rem;
color: var(--charcoal);
}
.projects {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 1px;
background: var(--grey-light);
margin: 2rem 0;
}
.project {
background: var(--cream);
padding: 2rem;
transition: background 0.3s ease;
text-decoration: none;
color: inherit;
display: block;
}
.project:hover { background: var(--paper); }
.project-icon {
font-size: 2rem;
color: var(--amber);
font-family: 'DM Mono', monospace;
margin-bottom: 1rem;
display: block;
}
.project h3 {
font-size: 1.2rem;
font-weight: 600;
color: var(--charcoal);
margin-bottom: 0.5rem;
}
.project p {
font-size: 0.9rem;
color: var(--grey);
margin: 0;
line-height: 1.5;
}
.project-tag {
font-family: 'DM Mono', monospace;
font-size: 0.8rem;
letter-spacing: 0.1em;
text-transform: uppercase;
color: var(--amber);
margin-top: 1rem;
display: block;
}
.acronym {
display: grid;
grid-template-columns: auto 1fr;
gap: 0.5rem 1.5rem;
margin: 3rem 0;
padding: 2rem;
background: var(--paper);
border-left: 3px solid var(--amber);
}
.acronym-letter {
font-family: 'DM Mono', monospace;
font-size: 2rem;
font-weight: 400;
color: var(--amber);
line-height: 1.4;
}
.acronym-word {
font-size: 1.4rem;
font-weight: 300;
color: var(--charcoal);
line-height: 1.4;
align-self: center;
}
.acronym-word em {
font-style: italic;
color: var(--grey);
font-size: 0.9rem;
display: block;
font-family: 'DM Mono', monospace;
letter-spacing: 0.05em;
}
.cta {
background: var(--charcoal);
color: var(--cream);
padding: 3rem;
margin: 3rem 0;
text-align: center;
}
.cta h2 {
color: var(--cream);
font-style: italic;
font-size: 2rem;
margin-bottom: 1rem;
font-weight: 300;
}
.cta h2::after { display: none; }
.cta p {
color: var(--grey-light);
font-size: 1rem;
max-width: 500px;
margin: 0 auto 2rem;
}
.cta-links {
display: flex;
gap: 1rem;
justify-content: center;
flex-wrap: wrap;
}
.cta-link {
font-family: 'DM Mono', monospace;
font-size: 0.75rem;
letter-spacing: 0.1em;
text-transform: uppercase;
color: var(--cream);
text-decoration: none;
border: 1px solid var(--amber);
padding: 0.8rem 1.5rem;
transition: background 0.3s ease, color 0.3s ease;
}
.cta-link:hover { background: var(--amber); color: var(--charcoal); }
.cta-link.primary { background: var(--amber); color: var(--charcoal); }
.cta-link.primary:hover { background: var(--amber-dark); color: var(--cream); }
footer {
margin-top: 6rem;
padding: 3rem 0;
border-top: 1px solid var(--grey-light);
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
gap: 1rem;
}
.footer-left {
font-family: 'DM Mono', monospace;
font-size: 0.7rem;
letter-spacing: 0.1em;
color: var(--grey);
text-transform: uppercase;
line-height: 1.8;
}
.footer-left a {
color: var(--amber);
text-decoration: none;
border-bottom: 1px solid transparent;
transition: border-color 0.2s;
}
.footer-left a:hover { border-bottom-color: var(--amber); }
.footer-hex {
font-size: 2rem;
opacity: 0.3;
color: var(--amber);
font-family: 'DM Mono', monospace;
animation: float 8s ease-in-out infinite reverse;
}
@keyframes float {
0%, 100% { transform: translateY(0px) rotate(-5deg); }
50% { transform: translateY(-12px) rotate(3deg); }
}
@keyframes fadeUp {
from { opacity: 0; transform: translateY(30px); }
to { opacity: 1; transform: translateY(0); }
}
/* --- QUOTE CAROUSEL --- */
.quote-carousel {
margin: 2.5rem 0;
position: relative;
min-height: 160px;
}
.quote-slide { display: none; animation: fadeQuote 0.8s ease; }
.quote-slide.active { display: block; }
@keyframes fadeQuote {
from { opacity: 0; transform: translateY(8px); }
to { opacity: 1; transform: translateY(0); }
}
.quote-dots {
display: flex;
gap: 0.5rem;
margin-top: 1rem;
padding-left: 2rem;
}
.dot {
width: 6px; height: 6px;
border-radius: 50%;
background: var(--grey-light);
cursor: pointer;
transition: background 0.3s ease;
}
.dot.active { background: var(--amber); }
.hero-buttons {
display: flex;
gap: 1rem;
align-self: flex-end;
margin-top: 2rem;
flex-wrap: wrap;
}
.colony-btn {
background: transparent;
color: var(--amber);
border: 1px solid var(--amber);
font-family: 'DM Mono', monospace;
font-size: 0.75rem;
letter-spacing: 0.12em;
text-transform: uppercase;
padding: 0.9rem 1.6rem;
cursor: pointer;
text-decoration: none;
display: inline-flex;
align-items: center;
gap: 0.6rem;
transition: background 0.3s ease, color 0.3s ease, transform 0.2s ease, box-shadow 0.3s ease;
}
.colony-btn:hover {
background: var(--amber);
color: var(--charcoal);
transform: translateY(-2px);
box-shadow: 0 8px 30px rgba(200, 135, 42, 0.4);
}
.colony-btn .hex { font-size: 1rem; transition: transform 0.4s ease; }
.colony-btn:hover .hex { transform: rotate(30deg); }
.donate-btn {
background: transparent;
color: var(--cream);
border: 1px solid rgba(255,255,255,0.25);
font-family: 'DM Mono', monospace;
font-size: 0.75rem;
letter-spacing: 0.12em;
text-transform: uppercase;
padding: 0.9rem 1.6rem;
cursor: pointer;
text-decoration: none;
display: inline-flex;
align-items: center;
gap: 0.6rem;
transition: background 0.3s ease, border-color 0.3s ease, transform 0.2s ease;
}
.donate-btn:hover {
background: rgba(255,255,255,0.08);
border-color: rgba(255,255,255,0.5);
transform: translateY(-2px);
}
@media (max-width: 640px) {
.header-inner { flex-direction: column; gap: 1.5rem; }
.wasp-symbol { font-size: 3.5rem; }
.header-text h1 { font-size: 3rem; }
.comparison { grid-template-columns: 1fr; }
.projects { grid-template-columns: 1fr; }
.hero-statement { padding: 2.5rem 1.5rem; }
.cta { padding: 2rem 1.5rem; }
.hero-buttons { align-self: flex-start; }
.colony-btn, .donate-btn { font-size: 0.7rem; padding: 0.8rem 1.2rem; }
footer { flex-direction: column; text-align: center; }
}
</style>
</head>
<body>
<div class="hex-bg"></div>
<div class="container">
<header>
<nav class="lang-switch">
<a href="/" class="active">🇸🇮 SL</a>
<a href="/en/">🇬🇧 EN</a>
<a href="/de/">🇩🇪 DE</a>
<a href="/hr/">🇭🇷 HR</a>
<a href="/ba/">🇧🇦 BA</a>
<a href="/sr/">🇷🇸 SR</a>
</nav>
<div class="header-inner">
<div class="wasp-symbol"></div>
<div class="header-text">
<h1>Odprtokodni<br><span>Aktivizem</span></h1>
<p class="tagline">OSA · Pravica do bivanja ni problem financ, je človeška pravica, ki jo lahko dosežemo s pomočjo tehnologije.</p>
</div>
</div>
</header>
<div class="hero-statement">
<p>
<strong>Obilje ni monetarni problem.</strong> Denar smo si izmislili ljudje.<br>
Zemlja od nekdaj vse surovine zagotavlja brezplačno.<br>
S prihodom UI ima človeštvo priložnost zgraditi nov sistem,<br>
<strong>ki bo temeljil na deljenju dobrin za vse ljudi tega sveta.</strong>
</p>
<div class="hero-buttons">
<a href="mailto:hello@clawdie.si?subject=I want to join" class="colony-btn">
<span class="hex"></span> Pridruži se koloniji
</a>
<a href="https://codeberg.org/Clawdie" target="_blank" rel="noopener" class="donate-btn">
♥ Podpri OSA
</a>
</div>
</div>
<section>
<div class="acronym">
<span class="acronym-letter">O</span>
<span class="acronym-word">Odprtokodno
<em>znanje, načrti, koda. Brez vratarjev. Brez lastnikov.</em>
</span>
<span class="acronym-letter">S</span>
<span class="acronym-word">Skupinsko znanje
<em>nakopičena človeška inteligenca, tekoča na siliciju. Dostopna vsem.</em>
</span>
<span class="acronym-letter">A</span>
<span class="acronym-word">Aktivizem
<em>neposredno delovanje. Gradimo. Ne čakamo dovoljenj.</em>
</span>
</div>
</section>
<div class="divider"></div>
<section>
<h2>Osnovni problem</h2>
<p>
Uveljavljen sistem nas poskuša prepričati, da je pravica do bivanja na Zemlji pogojena s
potiskanim papirjem, posebnimi dovoljenji in plastičnimi karticami. To ni naravni zakon
(Natural Law).
To je umetno vzdrževan red, zgrajen tako, da človeka drži v odvisnosti.
</p>
<p>
Že tisočletja se človeštvo kontrolira in usmerja skozi religijo, strah in odpovedovanjem
naših osnovnih človeških pravic. Namesto da bi si
lažje delili znanje, energijo in materiale, smo se navadili verjeti, da je osnovno bivanje
nekaj, za kar moramo nenehno plačevati. A valuta ni samo denar. Plačujemo tudi s svojim
časom. Čas je najvrednejša valuta.
</p>
<p>
Vcepili so nam parazitske modele, ki se napajajo s strahom, požrešnostjo in napuhom. Ti
modeli umetno ustvarjajo pomanjkanje tam, kjer bi lahko obstajalo obilje, in prepričujejo
človeka, da je odvisnost od njih nekaj normalnega.
</p>
<p>
Resnica je preprostejša: Zemlja že od nekdaj daje material. Sonce že od nekdaj daje energijo.
Človeštvo pa je zdaj prvič v položaju, ko lahko s pomočjo tehnologije, avtomatizacije in
umetne inteligence organizira gradnjo na povsem novi ravni.
</p>
<p>
Vprašanje torej ni, ali je mogoče zagotoviti bivanje za vse. Vprašanje je, ali smo
pripravljeni opustiti sistem, ki iz osnovne človeške potrebe dela trg, dolg in orodje
nadzora.
</p>
<p>
OSA izhaja iz preprostega stališča: dom ni luksuz, investicija ali finančni produkt. Dom je
temeljna človeška pravica.
</p>
</section>
<div class="divider"></div>
<section>
<h2>Problem škatel</h2>
<p>
Pravokotna soba, kvadratna hiša, kubični stanovanjski blok —
škatla je postala tako prevladujoča v človeških bivališčih, da smo nehali spraševati zakaj.
Gradimo škatle, ker smo vedno gradili škatle.
Ne zato, ker so škatle dobre.
</p>
<div class="comparison">
<div class="comparison-side box">
<div class="comparison-label">Škatla</div>
<ul>
<li>Ostri robovi zbirajo strukturne napetosti</li>
<li>Ravne strehe popuščajo pod obremenitvijo</li>
<li>Maksimalna poraba materiala za minimalno trdnost</li>
<li>Slaba toplotna učinkovitost</li>
<li>Visoka količina odpadkov pri gradnji</li>
<li>Draga gradnja in vzdrževanje</li>
<li>Odtujena od naravnih oblik</li>
</ul>
</div>
<div class="comparison-side dome">
<div class="comparison-label">Kupola</div>
<ul>
<li>Napetosti so razporejene po celotni konstrukciji</li>
<li>Najmočnejša oblika v inženirstvu</li>
<li>Minimalna poraba materiala za maksimalno trdnost</li>
<li>Odlična toplotna učinkovitost</li>
<li>Manj odpadkov, hitrejša gradnja</li>
<li>Nižji dolgoročni stroški</li>
<li>Prisotna povsod v naravi</li>
</ul>
</div>
</div>
<p>
Geodezična kupola zajame več prostornine na enoto površine kot katera koli druga konstrukcija.
Napetosti razporeja tako enakomerno, da se pod obremenitvijo dejansko <strong>ojača.</strong>
Buckminster Fuller je to razumel že v 40. letih prejšnjega stoletja.
Vprašanje je, zakaj leta 2026 še vedno gradimo škatle.
</p>
</section>
<div class="divider"></div>
<section>
<h2>Na ramenih velikanov</h2>
<div class="quote-carousel">
<div class="quote-slide active">
<blockquote>
"Stvari ne moreš spremeniti z bojevanjem proti obstoječi realnosti.
Da bi nekaj spremenil, zgradi nov model, ki bo starega naredil zastarelega."
<cite>— R. Buckminster Fuller, izumitelj geodezične kupole</cite>
</blockquote>
</div>
<div class="quote-slide">
<blockquote>
"Jasno moramo povedati, da so zemeljski viri skupna dediščina
vseh ljudi na svetu."
<cite>— Jacque Fresco, ustanovitelj Venusovega projekta</cite>
</blockquote>
</div>
<div class="quote-slide">
<blockquote>
"Um, ki ga je razširila nova ideja, nikoli več ne zavzame svojih prvotnih dimenzij."
<cite>— Oliver Wendell Holmes st., zdravnik in pesnik</cite>
</blockquote>
</div>
<div class="quote-slide">
<blockquote>
"Ne glede na to, ali misliš, da zmoreš, ali misliš, da ne zmoreš — v obeh primerih imaš prav."
<cite>— Henry Ford, industrialec in inovator</cite>
</blockquote>
</div>
<div class="quote-dots">
<span class="dot active" data-index="0"></span>
<span class="dot" data-index="1"></span>
<span class="dot" data-index="2"></span>
<span class="dot" data-index="3"></span>
</div>
</div>
<p>
Fuller je vse življenje dokazoval, da je <strong>narediti več z manj</strong>
<a href="https://en.wikipedia.org/wiki/Ephemeralization" target="_blank" rel="noopener">efemeralizacija</a> — ne idealizem, temveč inženirstvo.
Fresco je vse življenje načrtoval mesta in strukture sveta po pomanjkanju.
Oba so prezrle mainstream arhitektura in gradbena industrija.
Oba sta imela prav.
</p>
<p>
OSA obstaja, da nadaljuje njuno nedokončano delo —
z odprtokodnimi orodji, nakopičeno človeško inteligenco in sodobno gradnjo,
da bo življenje v kupoli <strong>dostopno, praktično in neizogibno.</strong>
</p>
</section>
<div class="divider"></div>
<section>
<h2>Kako prideva do tja</h2>
<p>
Ne s političnimi strankami, ne s protesti na ulicah, ne z naslednjimi volitvami za leve ali desne.
Predlagava "anarhističen pristop" — brez pasivne uklonitve avtoriteti —
čas je, da zgradiva nov model, ki bo trenutnega naredil zastarelega.
</p>
<div class="principles">
<div class="principle">
<span class="principle-num">01</span>
<div class="principle-text">
<strong>Odprti načrti, prosto deljeni</strong>
Vsak načrt kupole, vsaka Blender datoteka, vsak izračun
je objavljen odprto. Brez patentov. Brez plačilnih zidov.
Znanje pripada vsem.
</div>
</div>
<div class="principle">
<span class="principle-num">02</span>
<div class="principle-text">
<strong>Začniva majhno, dokaživa koncept</strong>
Kupola za psa. Kupola za vrt. Kupola za delavnico.
Vsaka zgrajena mala kupola je dokaz koncepta —
in dokaz spreminja mnenja hitreje kot argumenti.
</div>
</div>
<div class="principle">
<span class="principle-num">03</span>
<div class="principle-text">
<strong>UI koordinira, kar so prej nadzorovali vodje</strong>
Parametrično načrtovanje, odprtokodna programska oprema, nakopičena človeška inteligenca.
To niso nadomestki za človeško ustvarjalnost —
to so ojačevalci. Uporabljava vsako razpoložljivo orodje.
</div>
</div>
<div class="principle">
<span class="principle-num">04</span>
<div class="principle-text">
<strong>FreeBSD-prvi, sistemsko nevtralno</strong>
Zgrajeno za strežnike, ne za prenosnike: stabilno, varno, pregledljivo.
OSA deluje na FreeBSD, Linux, ARM, x86.
Najini načrti delujejo z lokalnimi materiali, lokalnimi gradbeniki, lokalnimi pogoji.
</div>
</div>
<div class="principle">
<span class="principle-num">05</span>
<div class="principle-text">
<strong>Krožno, ne linearno</strong>
Vsak material naj zaključi cikel.
Vsaka konstrukcija naj preživi svojega graditelja.
Vsak načrt naj bo izboljšljiv za tistega, ki pride za nama.
</div>
</div>
</div>
</section>
<div class="divider"></div>
<section>
<h2>Dva projekta, ena misija</h2>
<p>OSA ni prihodnji načrt. Dogaja se zdaj, na odprtem.</p>
<div class="projects">
<div class="project" style="background: var(--cream);">
<span class="project-icon"></span>
<h3>OSA — Geodezične kupole</h3>
<p>
Parametrični 3D modeli, zgrajeni v Blenderju z geometry nodes.
Prosto prenosljive .blend datoteke. Začni z 9-metrsko kupolo.
</p>
<p style="font-size: 0.9rem; color: var(--grey); margin-top: 1rem;">
<strong>Vizija:</strong> odprtokodno stanovanje, ki se skalira od psa dometa do družinskega doma.
Nadlegenja trdnost, toplotna učinkovitost, material učinkovitost, hitrost gradnje.
Dolgoročno: načrti, ki jih je mogoče zgraditi kjerkoli, s katerimkoli lokalnim materialom.
</p>
<a href="https://samob.netlify.app/cv/tech-skills/#blender" style="display: inline-block; margin-top: 1rem; color: var(--amber); text-decoration: none; border-bottom: 1px solid transparent; transition: border-color 0.2s;" onmouseover="this.style.borderBottomColor='var(--amber)'" onmouseout="this.style.borderBottomColor='transparent'">
<span class="project-tag">Blender · Odprti načrti · samob.netlify.app</span>
</a>
</div>
<div class="project" style="background: linear-gradient(135deg, var(--paper) 0%, #0f0e0c 100%);">
<span class="project-icon" style="color: #00d9ff;"></span>
<h3 style="color: #00d9ff;">Clawdie — Brihtna asistentka</h3>
<p style="color: #c9d1d9;">
Clawdie je brihtna asistentka, ki teče na FreeBSD. Pomaga graditi prihodnost — od kode do geodetskih kupolnih komponent.
Telegram vmesnik, Postgres baza za spomin, tmux konzola s stekleno ploščo.
</p>
<p style="font-size: 0.9rem; color: #8b949e; margin-top: 1rem;">
<strong>Infrastruktura:</strong> koordinira snovanje z brihtnim umom, logistiko in skupnostno znanje.
Živi dokaz, da nakopičena človeška inteligenca deluje — samo-gostovana, prenosljiva, pregledljiva.
Manjkajoči člen med OSA vizijo in gradnjo.
</p>
<a href="https://clawdie.si" style="display: inline-block; margin-top: 1rem; color: #00d9ff; text-decoration: none; border-bottom: 1px solid transparent; transition: border-color 0.2s;" onmouseover="this.style.borderBottomColor='#00d9ff'" onmouseout="this.style.borderBottomColor='transparent'">
<span class="project-tag" style="color: #00d9ff;">FreeBSD · Samo-gostovano · clawdie.si</span>
</a>
</div>
</div>
</section>
<div class="divider"></div>
<div class="cta">
<h2>Pridruži se prehodu</h2>
<p>
OSA nima članstva, pristojbin, prijavnega obrazca.
Če deliš ta načela, si že del tega.
Zgradiva skupaj. Deliva znanje.
Midva lahko zgradiva boljši svet.
</p>
<div class="cta-links">
<a class="cta-link primary" href="mailto:hello@clawdie.si?subject=I want to join">Udeleži se</a>
<a class="cta-link" href="https://clawdie.si" target="_blank" rel="noopener">Razišči Clawdie</a>
<a class="cta-link" href="https://samob.netlify.app/cv/tech-skills/#blender" target="_blank" rel="noopener">Prenesi načrte kupol</a>
<a class="cta-link" href="https://codeberg.org/Clawdie" target="_blank" rel="noopener">Ogled na Codebergu</a>
</div>
</div>
<section>
<h2>Ta strežnik</h2>
<p>
<strong>osa.smilepowered.org</strong> deluje na FreeBSD 15, nginx in Let's Encrypt —
v celoti odprtokodno, samo-gostovano, brez odvisnosti od korporativnega oblaka.
To je sam po sebi majhno dejanje tega, kar OSA pomeni v praksi.
</p>
<p>
Razveji to idejo. Izboljšaj jo. Nadgradi jo.
Manifest je izhodišče, ne cilj.
</p>
</section>
<footer>
<div class="footer-left">
OSA · Odprtokodni Aktivizem<br>
<a href="https://samob.netlify.app" target="_blank" rel="noopener">Human AI Operator</a><br>
<a href="https://www.facebook.com/OpenSourceActivism/">Facebook · OSA</a><br>
FreeBSD 15 · nginx · Let's Encrypt<br>
est. marec 2026 · Brezovica pri Mirni, Slovenija
</div>
<div class="footer-hex"></div>
</footer>
</div>
<script>
// quote carousel
const slides = document.querySelectorAll('.quote-slide');
const dots = document.querySelectorAll('.dot');
let current = 0;
function showSlide(index) {
slides[current].classList.remove('active');
dots[current].classList.remove('active');
current = index % slides.length;
slides[current].classList.add('active');
dots[current].classList.add('active');
}
dots.forEach(dot => {
dot.addEventListener('click', () => showSlide(parseInt(dot.dataset.index)));
});
setInterval(() => showSlide(current + 1), 9000);
// scroll reveal
const sections = document.querySelectorAll('section');
const observer = new IntersectionObserver((entries) => {
entries.forEach((entry, i) => {
if (entry.isIntersecting) {
setTimeout(() => entry.target.classList.add('visible'), i * 100);
}
});
}, { threshold: 0.1 });
sections.forEach(s => observer.observe(s));
</script>
</body>
</html>