Diamonds

💎 Investment Diamonds

Step into a world where timeless beauty meets intelligent investment. For centuries, diamonds have embodied exclusivity, prestige, and lasting value — and from July 2026, we will introduce a truly unique investment opportunity.

Through our presence in Antwerp, the European heart of the diamond trade, we offer natural, internationally certified diamonds with fast and secure delivery.

Unlike conventional offerings, we focus exclusively on investment-grade diamonds — carefully selected stones of the highest quality, intended for those who seek not only beauty, but also stability and long-term appreciation. Each diamond reflects discreet luxury and a thoughtful approach to preserving value over time.

Each diamond represents more than luxury — it is security and value that grows over time.

....

<!DOCTYPE html>

<head>

<title>Praha – Diamant</title>

<style>

* { margin: 0; padding: 0; box-sizing: border-box; }

body {

width: 100%;

height: 100vh;

overflow: hidden;

background: #0a0a1a;

font-family: 'Georgia', serif;

}

/* ── Sky gradient ── */

.sky {

position: absolute;

inset: 0;

background: radial-gradient(ellipse at 50% 30%,

#1a1040 0%, #0d0820 40%, #050310 100%);

}

/* ── Stars ── */

.stars {

position: absolute;

inset: 0;

overflow: hidden;

}

.star {

position: absolute;

background: #fff;

border-radius: 50%;

animation: twinkle var(--dur, 3s) ease-in-out infinite;

animation-delay: var(--delay, 0s);

opacity: 0;

}

@keyframes twinkle {

0%, 100% { opacity: 0; }

50% { opacity: var(--peak, 0.8); }

}

/* ── Prague skyline SVG ── */

.prague-skyline {

position: absolute;

bottom: 0;

left: 0;

width: 100%;

height: 55%;

}

/* ── River reflection ── */

.river {

position: absolute;

bottom: 0;

left: 0;

width: 100%;

height: 18%;

background: linear-gradient(180deg,

rgba(20, 15, 50, 0.95) 0%,

rgba(10, 8, 30, 1) 100%);

overflow: hidden;

}

.river::before {

content: '';

position: absolute;

top: 0; left: 0; right: 0;

height: 2px;

background: linear-gradient(90deg,

transparent, rgba(200,170,100,0.3), transparent);

}

/* Shimmering reflections in river */

.reflection {

position: absolute;

bottom: 0;

width: 2px;

background: linear-gradient(180deg,

rgba(255,220,100,0.4) 0%,

transparent 100%);

animation: shimmer var(--dur, 2s) ease-in-out infinite;

animation-delay: var(--delay, 0s);

}

@keyframes shimmer {

0%, 100% { opacity: 0.2; transform: scaleX(1); }

50% { opacity: 0.8; transform: scaleX(2.5); }

}

/* ── Diamond container ── */

.diamond-wrap {

position: absolute;

top: 50%;

left: 50%;

transform: translate(-50%, -62%);

display: flex;

flex-direction: column;

align-items: center;

gap: 0;

z-index: 10;

}

/* Glow halo behind diamond */

.glow-halo {

position: absolute;

top: 50%; left: 50%;

width: 260px; height: 260px;

transform: translate(-50%, -50%);

border-radius: 50%;

background: radial-gradient(circle,

rgba(150,200,255,0.18) 0%,

rgba(100,160,255,0.08) 40%,

transparent 70%);

animation: halo-pulse 3s ease-in-out infinite;

pointer-events: none;

}

@keyframes halo-pulse {

0%, 100% { transform: translate(-50%,-50%) scale(1); opacity: 0.6; }

50% { transform: translate(-50%,-50%) scale(1.3); opacity: 1; }

}

/* 3-D diamond via CSS */

.diamond-scene {

width: 140px;

height: 140px;

perspective: 600px;

position: relative;

z-index: 2;

}

.diamond-3d {

width: 100%;

height: 100%;

transform-style: preserve-3d;

animation: spin-diamond 8s linear infinite;

position: relative;

}

@keyframes spin-diamond {

from { transform: rotateY(0deg) rotateX(15deg); }

to { transform: rotateY(360deg) rotateX(15deg); }

}

/* Diamond SVG approach – rendered in canvas */

canvas#diamond {

display: block;

filter: drop-shadow(0 0 18px rgba(160,210,255,0.9))

drop-shadow(0 0 40px rgba(120,180,255,0.5));

}

/* ── Sparkle particles ── */

.sparkle {

position: absolute;

pointer-events: none;

z-index: 11;

animation: sparkle-anim var(--dur, 1.5s) ease-out infinite;

animation-delay: var(--delay, 0s);

opacity: 0;

}

.sparkle::before {

content: '✦';

font-size: var(--size, 14px);

color: rgba(200,230,255,0.9);

text-shadow: 0 0 6px #fff, 0 0 12px rgba(160,210,255,1);

}

@keyframes sparkle-anim {

0% { opacity: 0; transform: translate(0,0) scale(0.3); }

30% { opacity: 1; transform: translate(var(--tx,0), var(--ty,0)) scale(1); }

100% { opacity: 0; transform: translate(calc(var(--tx,0)*1.8), calc(var(--ty,0)*1.8)) scale(0.2); }

}

/* Title */

.title {

position: absolute;

bottom: 22%;

left: 50%;

transform: translateX(-50%);

color: rgba(220,200,150,0.85);

font-size: clamp(0.8rem, 2vw, 1.1rem);

letter-spacing: 0.4em;

text-transform: uppercase;

white-space: nowrap;

text-shadow: 0 0 20px rgba(200,170,100,0.6);

z-index: 12;

}

</style>

</head>

<body>

<defs>

</linearGradient>

</linearGradient>

</linearGradient>

</filter>

</defs>

</circle>

</g>

<path d="M0,435 Q360,425 720,432 Q1080,439 1440,430 L1440,500 L0,500Z"

fill="#080618" opacity="0.95"/>

</svg>

</div>

<div class="title">Praha — Věčný Diamant</div>

// ── Stars ──────────────────────────────────────────────

const starsEl = document.getElementById('stars');

for (let i = 0; i < 200; i++) {

const s = document.createElement('div');

s.className = 'star';

const sz = Math.random() * 2.5 + 0.5;

s.style.cssText = `

width:${sz}px; height:${sz}px;

top:${Math.random()*65}%;

left:${Math.random()*100}%;

--dur:${(Math.random()*4+2).toFixed(1)}s;

--delay:${(Math.random()*6).toFixed(1)}s;

--peak:${(Math.random()*0.7+0.3).toFixed(2)};

starsEl.appendChild(s);

}

// ── River reflections ──────────────────────────────────

const riverEl = document.getElementById('river');

for (let i = 0; i < 40; i++) {

const r = document.createElement('div');

r.className = 'reflection';

const h = Math.random() * 60 + 20;

r.style.cssText = `

left:${Math.random()*100}%;

height:${h}%;

--dur:${(Math.random()*2+1.5).toFixed(1)}s;

--delay:${(Math.random()*4).toFixed(1)}s;

riverEl.appendChild(r);

}

// ── Diamond Canvas Renderer ────────────────────────────

const canvas = document.getElementById('diamond');

const ctx = canvas.getContext('2d');

const W = canvas.width, H = canvas.height;

const CX = W/2, CY = H/2;

let angle = 0;

let sparkleTimer = 0;

// Diamond geometry (brilliant cut top view projected to 3D)

function project(x, y, z, rotY, rotX=0.25) {

// Rotate around Y axis

const x1 = x * Math.cos(rotY) - z * Math.sin(rotY);

const z1 = x * Math.sin(rotY) + z * Math.cos(rotY);

// Slight X tilt

const y1 = y * Math.cos(rotX) - z1 * Math.sin(rotX);

const z2 = y * Math.sin(rotX) + z1 * Math.cos(rotX);

// Perspective

const fov = 300;

const scale = fov / (fov + z2 + 80);

return { x: CX + x1 * scale, y: CY + y1 * scale, z: z2, scale };

}

function lerp(a, b, t) { return a + (b - a) * t; }

function drawFace(pts2d, fill, stroke, alpha=1) {

ctx.globalAlpha = alpha;

ctx.beginPath();

ctx.moveTo(pts2d[0].x, pts2d[0].y);

for (let i = 1; i < pts2d.length; i++) ctx.lineTo(pts2d[i].x, pts2d[i].y);

ctx.closePath();

ctx.fillStyle = fill;

ctx.fill();

ctx.strokeStyle = stroke;

ctx.lineWidth = 0.7;

ctx.stroke();

ctx.globalAlpha = 1;

}

// Diamond 3D points

// Crown (top): table, then 8 bezel facets, 16 upper girdle

// Pavilion (bottom): 8 pavilion mains, 16 lower girdle, culet

const R = 48; // girdle radius

const TH = 12; // table half-size factor

const crownH = 18; // crown height

const pavH = 38; // pavilion depth

function getDiamondFaces(ang) {

const N = 8;

const angles = Array.from({length: N}, (_, i) => (Math.PI*2*i/N) - ang);

const angles2 = Array.from({length: N}, (_, i) => (Math.PI*2*(i+0.5)/N) - ang);

// Girdle ring

const girdleTop = angles.map(a => ({

x: R * Math.cos(a), y: -4, z: R * Math.sin(a)

}));

const girdleBot = angles.map(a => ({

x: R * Math.cos(a), y: 4, z: R * Math.sin(a)

}));

// Table: smaller octagon at top

const TR = R * 0.52;

const tableVerts = angles.map(a => ({

x: TR * Math.cos(a), y: -(crownH+4), z: TR * Math.sin(a)

}));

// Culet: bottom point

const culet = { x: 0, y: pavH, z: 0 };

// Star facets (connect table corners to girdle points)

const starFacets = angles.map((_, i) => {

const i2 = (i+1) % N;

return [tableVerts[i], tableVerts[i2], girdleTop[i2], girdleTop[i]];

});

// Bezel facets (connect table to intermediate girdle)

const girdleMid = angles2.map(a => ({

x: R * Math.cos(a), y: -(crownH*0.1), z: R * Math.sin(a)

}));

const bezelFacets = angles.map((_, i) => {

const i2 = (i+1) % N;

const m = i;

return [tableVerts[i], girdleMid[m], girdleTop[i2], tableVerts[i2]];

// simplified: just bezel main

});

// Kite/main bezel facets (table mid to girdle)

const kite = angles2.map((_, i) => {

const i1 = i; const i2 = (i+1) % N;

return [tableVerts[i1], tableVerts[i2], girdleTop[i2]];

});

// Pavilion main facets

const pavFacets = angles.map((_, i) => {

const i2 = (i+1) % N;

return [girdleBot[i], girdleBot[i2], culet];

});

// Lower girdle facets

const pavHalf = angles2.map((a, i) => {

const gm = { x: R * Math.cos(a), y: 4, z: R * Math.sin(a) };

const i1 = i; const i2 = (i+1) % N;

return [girdleBot[i1], gm, girdleBot[i2]];

});

// Table face

const table = [tableVerts];

return { tableVerts, girdleTop, girdleBot, girdleMid, culet,

starFacets, bezelFacets, kite, pavFacets, pavHalf, table,

angles, N, R };

}

// Color palette for facets

const palette = {

table: '#e8f4ff',

starLight: '#c5e3ff',

starDark: '#8ab5e8',

bezelA: '#d0ecff',

bezelB: '#a8d4f5',

pavLight: '#b8d8f8',

pavDark: '#7aade0',

girdle: '#d8eeff',

edge: 'rgba(200,230,255,0.5)',

edgeDark: 'rgba(100,160,220,0.6)',

};

function facetColor(base, shade, flashAmt) {

// Parse hex

const r = parseInt(base.slice(1,3),16);

const g = parseInt(base.slice(3,5),16);

const b = parseInt(base.slice(5,7),16);

const fr = Math.min(255, r + flashAmt * 80);

const fg = Math.min(255, g + flashAmt * 80);

const fb = Math.min(255, b + flashAmt * 100);

const brightness = lerp(0.6, 1.0, shade);

return `rgb(${Math.round(fr*brightness)},${Math.round(fg*brightness)},${Math.round(fb*brightness)})`;

}

// Sparkle DOM elements

const wrap = document.getElementById('diamondWrap');

const sparklePool = [];

for (let i = 0; i < 12; i++) {

const sp = document.createElement('div');

sp.className = 'sparkle';

const sizes = ['10px','12px','14px','8px','16px'];

sp.style.setProperty('--size', sizes[i % sizes.length]);

sp.style.setProperty('--dur', `${(Math.random()*