<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />

<title>Minutieus – Sam Tahoori</title>

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>

<link href="https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,300;12..96,400;12..96,600;12..96,700;12..96,800&family=Golos+Text:wght@400;500;600;700&display=swap" rel="stylesheet">

<script src="https://cdnjs.cloudflare.com/ajax/libs/qrcodejs/1.0.0/qrcode.min.js"></script>

<style>

:root{

--gold:#fcc300;
--gold-lt:#ffd84d;
--gold-dk:#e0ac00;

--green:#006b21;
--green-lt:#008a2a;
--green-dk:#004f18;

--dark:#ffffff;
--dark-2:#f7f7f7;
--dark-3:#efefef;
--dark-4:#e5e5e5;

--text:#1a1a1a;
--muted:#6b6b6b;

--card-w:420px;

--radius:22px;
--btn-r:18px;

}

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

html,
body{
min-height:100%;
background:#f0f0f0;

display:flex;
align-items:center;
justify-content:center;

font-family:'Golos Text',sans-serif;
color:var(--text);

padding:24px 16px;
overflow-x:hidden;
position:relative;
}

body::before{
content:'';
position:fixed;
top:-180px;
left:-180px;

width:520px;
height:520px;

background:
radial-gradient(
circle,
rgba(252,195,0,0.12) 0%,
transparent 65%
);

pointer-events:none;
z-index:0;
}

body::after{
content:'';
position:fixed;
bottom:-180px;
right:-180px;

width:520px;
height:520px;

background:
radial-gradient(
circle,
rgba(0,107,33,0.08) 0%,
transparent 65%
);

pointer-events:none;
z-index:0;
}

.rvx-card{

position:relative;
z-index:1;

width:100%;
max-width:var(--card-w);

background:#ffffff;

border:1px solid rgba(0,0,0,0.07);

border-radius:var(--radius);

overflow:hidden;

box-shadow:
0 30px 80px rgba(0,0,0,0.12),
0 10px 30px rgba(0,0,0,0.08),
0 0 0 1px rgba(252,195,0,0.08);

animation:cardIn .7s cubic-bezier(.22,1,.36,1) both;

}

@keyframes cardIn{
from{
opacity:0;
transform:translateY(20px) scale(.98);
}
to{
opacity:1;
transform:translateY(0) scale(1);
}
}

.rvx-card::before{

content:'';

position:absolute;
top:0;
left:0;
right:0;

height:4px;

background:
linear-gradient(
90deg,
var(--green),
var(--gold),
var(--green-lt),
var(--gold),
var(--green)
);

z-index:2;

}

.rvx-header{

padding:38px 34px 22px;

display:flex;
flex-direction:column;
align-items:center;
text-align:center;

background:
radial-gradient(
ellipse at 50% 0%,
rgba(252,195,0,0.07) 0%,
transparent 68%
);

}

.rvx-chip{

display:inline-flex;
align-items:center;
justify-content:center;

font-size:9px;
font-weight:700;

letter-spacing:.22em;
text-transform:uppercase;

color:var(--green);

padding:7px 16px;

border-radius:999px;

background:rgba(0,107,33,0.07);

border:1px solid rgba(0,107,33,0.18);

margin-bottom:18px;

animation:fadeUp .5s .1s both;

}

.rvx-logo-wrap{

width:220px;
height:90px;

display:flex;
align-items:center;
justify-content:center;

margin-bottom:10px;

animation:fadeUp .55s .15s cubic-bezier(.22,1,.36,1) both;

}

.rvx-logo-wrap img{
max-width:100%;
max-height:100%;
object-fit:contain;
}

.rvx-logo-fallback{

font-family:'Bricolage Grotesque',sans-serif;
font-size:32px;
font-weight:800;

letter-spacing:.1em;

color:var(--text);

display:none;

}

.rvx-logo-fallback em{
color:var(--gold);
font-style:normal;
}

.rvx-sep{

margin:0 32px;
height:1px;

background:
linear-gradient(
90deg,
transparent,
rgba(0,107,33,0.20),
rgba(252,195,0,0.30),
rgba(0,107,33,0.20),
transparent
);

}

.rvx-body{

padding:22px;

display:flex;
flex-direction:column;
gap:10px;

}

.rvx-item{

display:flex;
align-items:center;
gap:14px;

padding:14px 15px;

text-decoration:none;
color:var(--text);

border-radius:18px;

background:rgba(0,0,0,0.02);

border:1px solid rgba(0,0,0,0.06);

position:relative;

transition:
all .28s ease;

animation:fadeUp .55s cubic-bezier(.22,1,.36,1) both;

overflow:hidden;

}

.rvx-item:nth-child(1){animation-delay:.38s;}
.rvx-item:nth-child(2){animation-delay:.44s;}
.rvx-item:nth-child(3){animation-delay:.50s;}
.rvx-item:nth-child(4){animation-delay:.56s;}

.rvx-item::before{

content:'';

position:absolute;
left:0;
top:0;

width:4px;
height:100%;

background:var(--green);

transform:scaleY(0);

transition:transform .25s ease;

transform-origin:center;

}

.rvx-item:hover{

background:rgba(0,107,33,0.04);

border-color:rgba(0,107,33,0.18);

transform:translateY(-3px);

box-shadow:
0 10px 25px rgba(0,0,0,0.08);

}

.rvx-item:hover::before{
transform:scaleY(1);
}

.rvx-icon{

width:46px;
height:46px;

display:flex;
align-items:center;
justify-content:center;

border-radius:14px;

background:rgba(0,107,33,0.07);

border:1px solid rgba(0,107,33,0.15);

color:var(--green);

flex-shrink:0;

transition:all .25s ease;

}

.rvx-item:hover .rvx-icon{

transform:scale(1.05);

background:rgba(0,107,33,0.12);

border-color:rgba(0,107,33,0.30);

}

.rvx-label{

font-size:9px;
font-weight:700;

letter-spacing:.2em;
text-transform:uppercase;

color:var(--muted);

margin-bottom:4px;

}

.rvx-value{

font-size:14px;
font-weight:500;

color:var(--text);

line-height:1.4;

word-break:break-word;

}

.rvx-save-section{

padding:6px 22px 22px;

animation:fadeUp .55s .64s both;

}

.rvx-save-btn{

width:100%;

display:inline-flex;
align-items:center;
justify-content:center;
gap:10px;

padding:16px 24px;

background:
linear-gradient(
135deg,
#006b21 0%,
#008a2a 50%,
#006b21 100%
);

background-size:200% 200%;

color:#fff;

font-family:'Bricolage Grotesque',sans-serif;

font-size:13px;
font-weight:800;

letter-spacing:.08em;
text-transform:uppercase;

border:none;
border-radius:18px;

cursor:pointer;

position:relative;
overflow:hidden;

transition:
transform .25s ease,
box-shadow .25s ease,
background-position .5s ease;

box-shadow:
0 12px 35px rgba(0,107,33,0.22),
0 4px 14px rgba(0,0,0,0.15);

}

.rvx-save-btn:hover{

transform:translateY(-3px);

background-position:100% 100%;

box-shadow:
0 18px 45px rgba(0,107,33,0.30),
0 8px 18px rgba(0,0,0,0.20);

}

.rvx-save-btn::before{

content:'';

position:absolute;

top:0;
left:-120%;

width:70%;
height:100%;

background:
linear-gradient(
90deg,
transparent,
rgba(255,255,255,0.25),
transparent
);

transform:skewX(-20deg);

transition:.7s;

}

.rvx-save-btn:hover::before{
left:140%;
}

.rvx-save-btn svg{
width:18px;
height:18px;
flex-shrink:0;
}

.rvx-btn-arrow{
display:flex;
transition:transform .25s ease;
}

.rvx-save-btn:hover .rvx-btn-arrow{
transform:translateX(4px);
}

.rvx-qr-section{

padding:10px 22px 30px;

display:flex;
flex-direction:column;
align-items:center;
gap:10px;

border-top:1px solid rgba(0,0,0,0.06);

background:
radial-gradient(
ellipse at 50% 100%,
rgba(252,195,0,0.06) 0%,
transparent 70%
);

animation:fadeUp .55s .72s both;

}

.rvx-qr-label-top{

font-size:9px;
font-weight:700;

letter-spacing:.2em;
text-transform:uppercase;

color:var(--muted);

padding-top:14px;

}

.rvx-qr-box{

width:118px;
height:118px;

background:#fff;

padding:8px;

border-radius:18px;

display:flex;
align-items:center;
justify-content:center;

box-shadow:
0 12px 28px rgba(0,0,0,0.12),
0 0 0 1px rgba(0,107,33,0.10);

}

#qrcode canvas,
#qrcode img{

width:100px !important;
height:100px !important;

border-radius:8px;

}

.rvx-qr-caption{

font-size:10px;

color:var(--muted);

letter-spacing:.05em;

}

.rvx-footer-tag{

text-align:center;

padding:0 20px 22px;

font-size:9px;
font-weight:700;

letter-spacing:.15em;
text-transform:uppercase;

color:rgba(0,0,0,0.25);

}

@keyframes fadeUp{
from{
opacity:0;
transform:translateY(12px);
}
to{
opacity:1;
transform:translateY(0);
}
}

.rvx-icon.pulse{
position:relative;
}

.rvx-icon.pulse::after{

content:'';

position:absolute;
inset:-4px;

border-radius:18px;

border:1px solid rgba(0,107,33,0.30);

animation:rvxPulse 2.6s ease-in-out infinite;

}

@keyframes rvxPulse{

0%,100%{
opacity:.7;
transform:scale(1);
}

50%{
opacity:0;
transform:scale(1.2);
}

}

@media(max-width:480px){

:root{
--card-w:100%;
}

.rvx-header{
padding:32px 22px 18px;
}

.rvx-body{
padding:18px;
}

.rvx-save-section{
padding:6px 18px 20px;
}

.rvx-qr-section{
padding:8px 18px 28px;
}

.rvx-footer-tag{
padding:0 18px 20px;
}

.rvx-logo-wrap{
width:180px;
height:72px;
}

}

</style>
</head>

<body>

<div class="rvx-card">

<div class="rvx-header">

<div class="rvx-chip">
Sam Tahoori · Minutieus
</div>

<div class="rvx-logo-wrap">

<img
src="https://www.minutieus.nl/wp-content/uploads/2025/07/cropped-sam-tahoori-black-text-e1752845346281.png"
alt="Minutieus Logo"
onerror="this.style.display='none';this.nextElementSibling.style.display='block';"
>

<div class="rvx-logo-fallback">
MINU<em>TIEUS</em>
</div>

</div>

</div>

<div class="rvx-sep"></div>

<div class="rvx-body">

<a href="tel:+0617275691" class="rvx-item">

<div class="rvx-icon pulse">

<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.8" stroke="currentColor" width="18" height="18">
<path stroke-linecap="round" stroke-linejoin="round" d="M2.25 6.75c0 8.284 6.716 15 15 15h2.25a2.25 2.25 0 0 0 2.25-2.25v-1.372c0-.516-.351-.966-.852-1.091l-4.423-1.106c-.44-.11-.902.055-1.173.417l-.97 1.293c-.282.376-.769.542-1.21.38a12.035 12.035 0 0 1-7.143-7.143c-.162-.441.004-.928.38-1.21l1.293-.97c.363-.271.527-.734.417-1.173L6.963 3.102a1.125 1.125 0 0 0-1.091-.852H4.5A2.25 2.25 0 0 0 2.25 4.5v2.25Z"/>
</svg>

</div>

<div>
<div class="rvx-label">Phone</div>
<div class="rvx-value">+06 17 275 691</div>
</div>

</a>

<a href="mailto:info@minutieus.nl" class="rvx-item">

<div class="rvx-icon">

<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.8" stroke="currentColor" width="18" height="18">
<path stroke-linecap="round" stroke-linejoin="round" d="M21.75 6.75v10.5a2.25 2.25 0 0 1-2.25 2.25h-15a2.25 2.25 0 0 1-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0 0 19.5 4.5h-15a2.25 2.25 0 0 0-2.25 2.25m19.5 0v.243a2.25 2.25 0 0 1-1.07 1.916l-7.5 4.615a2.25 2.25 0 0 1-2.36 0L3.32 8.91a2.25 2.25 0 0 1-1.07-1.916V6.75"/>
</svg>

</div>

<div>
<div class="rvx-label">Email</div>
<div class="rvx-value">info@minutieus.nl</div>
</div>

</a>

<a href="https://minutieus.nl" target="_blank" rel="noopener" class="rvx-item">

<div class="rvx-icon">

<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.8" stroke="currentColor" width="18" height="18">
<path stroke-linecap="round" stroke-linejoin="round" d="M12 21a9.004 9.004 0 0 0 8.716-6.747M12 21a9.004 9.004 0 0 1-8.716-6.747M12 21c2.485 0 4.5-4.03 4.5-9S14.485 3 12 3m0 18c-2.485 0-4.5-4.03-4.5-9S9.515 3 12 3m0 0a8.997 8.997 0 0 1 7.843 4.582M12 3a8.997 8.997 0 0 0-7.843 4.582m15.686 0A11.953 11.953 0 0 1 12 10.5c-2.998 0-5.74-1.1-7.843-2.918m15.686 0A8.959 8.959 0 0 1 21 12c0 .778-.099 1.533-.284 2.253m0 0A17.919 17.919 0 0 1 12 16.5c-3.162 0-6.133-.815-8.716-2.247m0 0A9.015 9.015 0 0 1 3 12c0-1.605.42-3.113 1.157-4.418"/>
</svg>

</div>

<div>
<div class="rvx-label">Website</div>
<div class="rvx-value">minutieus.nl</div>
</div>

</a>

</div>

<div class="rvx-save-section">

<button class="rvx-save-btn" onclick="downloadVCard()">

<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.2" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M15.75 6a3.75 3.75 0 1 1-7.5 0 3.75 3.75 0 0 1 7.5 0ZM4.501 20.118a7.5 7.5 0 0 1 14.998 0A17.933 17.933 0 0 1 12 21.75c-2.676 0-5.216-.584-7.499-1.632Z"/>
</svg>

Save Contact

<span class="rvx-btn-arrow">

<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor" width="13" height="13">
<path stroke-linecap="round" stroke-linejoin="round" d="M13.5 4.5 21 12m0 0-7.5 7.5M21 12H3"/>
</svg>

</span>

</button>

</div>

<div class="rvx-qr-section">

<div class="rvx-qr-label-top">
Scan to open digital card
</div>

<div class="rvx-qr-box">
<div id="qrcode"></div>
</div>

<div class="rvx-qr-caption">
minutieus.nl
</div>

</div>

<div class="rvx-footer-tag">
Minutieus · Sam Tahoori
</div>

</div>

<script>

window.addEventListener('load',function(){

new QRCode(
document.getElementById('qrcode'),
{
text:'https://minutieus.nl',

width:100,
height:100,

colorDark:'#006b21',
colorLight:'#ffffff',

correctLevel:QRCode.CorrectLevel.M
}
);

});

function downloadVCard(){

var vcard=[

'BEGIN:VCARD',
'VERSION:3.0',

'FN:Sam Tahoori',
'N:Tahoori;Sam;;;',

'ORG:Minutieus',

'TEL;TYPE=CELL,VOICE:+0617275691',

'EMAIL;TYPE=WORK:info@minutieus.nl',

'URL:https://minutieus.nl',

'END:VCARD'

].join('\r\n');

var blob=new Blob(
[vcard],
{
type:'text/vcard;charset=utf-8'
}
);

var url=URL.createObjectURL(blob);

var a=document.createElement('a');

a.href=url;
a.download='Sam-Tahoori-Minutieus.vcf';

document.body.appendChild(a);

a.click();

document.body.removeChild(a);

URL.revokeObjectURL(url);

}

</script>

</body>
</html>
Copyright © 2023 Minutieus