/* Basic reset & fonts */
:root{
–bg:#0b0b0b; –panel:#0f0f10; –muted:#9a9a9a; –accent:#ff7a18; –text:#e9e9e9;
–card-radius:10px; –maxw:1000px;
}
.alota-wrap{background:var(–bg); color:var(–text); padding:40px 16px; box-sizing:border-box; min-height:60vh; font-family:Inter,system-ui,Arial,sans-serif}
.alota-inner{max-width:var(–maxw); margin:0 auto;}
.alota-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-bottom:28px}
.brand h1{margin:0;font-size:26px;color:var(–muted);letter-spacing:1px}
.brand p{margin:0;color:var(–muted);font-size:13px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:18px}
.card{background:linear-gradient(180deg,#111,#0f0f10);border-radius:var(–card-radius);padding:14px;box-shadow:0 8px 30px rgba(0,0,0,0.6);display:flex;flex-direction:column;gap:10px}
.card .stub{height:120px;border-radius:8px;background:linear-gradient(135deg,#222,#111);display:flex;align-items:center;justify-content:center;color:var(–muted);font-weight:700}
.title{font-weight:700;color:var(–text);font-size:14px}
.tag{color:var(–muted);font-size:12px}
.price{color:var(–muted);font-weight:800}
.actions{display:flex;gap:8px;margin-top:auto}
.btn{display:inline-block;padding:8px 10px;border-radius:8px;background:transparent;border:1px solid rgba(255,255,255,0.06);color:var(–text);text-decoration:none;font-weight:700;cursor:pointer}
.btn.primary{background:var(–accent);color:#111;border:none}
.footer{margin-top:28px;color:var(–muted);font-size:13px;text-align:right}
/* CSS modal using :target */
.modal {
position: fixed; inset: 0; display: none; align-items:center; justify-content:center; padding:20px;
background: rgba(0,0,0,0.75); z-index:2000;
}
.modal:target { display: flex; }
.modal-panel { background:#0f0f10; padding:18px; border-radius:12px; width:100%; max-width:720px; color:var(–text); box-shadow:0 30px 80px rgba(0,0,0,0.8); position:relative; }
.modal-close { position:absolute; right:14px; top:12px; color:var(–muted); text-decoration:none; font-weight:700 }
.modal-grid{display:flex;gap:18px;flex-wrap:wrap}
.modal-thumb{flex:1;min-width:220px;background:linear-gradient(135deg,#222,#111);border-radius:8px;padding:24px;display:flex;align-items:center;justify-content:center;color:var(–muted);font-weight:700}
.modal-details{flex:1;min-width:260px}
/* responsive */
@media(max-width:640px){ .modal-grid{flex-direction:column} .stub{height:100px} .modal-thumb{height:160px} }
PROJECT 001
MICRO/MACRO STUDY
ALOTA of texture
Prototype
PROJECT 002
SYSTEMS DIAGRAM
ALOTA of connections
Prototype
PROJECT 003
LAYERS & REVEAL
ALOTA underneath
Prototype
PROJECT 004
ALOTA OF LINES
Fine-line overload
Prototype
Close
PROJECT 001
Micro / Macro Study
A study that collapses macro forms into microscopic texture. The surface is made of thousands of tiny repetitions — ALOTA in micro form.
Prototype • limited
To order or inquire: Email us
Close
PROJECT 002
Systems Diagram
An exploded network diagram showing how small decisions ripple. Each node represents a tiny choice — there is ALOTA in each.
Prototype • limited
To order or inquire: Email us
Close
PROJECT 003
Layers & Reveal
Design that reveals hidden layers under certain light or when examined — a small tribute to unseen detail.
Prototype • limited
To order or inquire: Email us
Close
PROJECT 004
ALOTA of Lines
An information-dense print composed of thousands of tiny line studies — a visual overload that rewards time and attention.
Prototype • limited
To order or inquire: Email us
© 2025, All rights reserved.
Designed with WooCommerce
Multimedia Artist 