132 lines
5.1 KiB
HTML
132 lines
5.1 KiB
HTML
|
<!DOCTYPE html>
|
|||
|
|
<html lang="en">
|
|||
|
|
<head>
|
|||
|
|
<meta charset="UTF-8">
|
|||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|||
|
|
<title>The Competition | Bryan Mubarak</title>
|
|||
|
|
<meta property="og:type" content="website">
|
|||
|
|
<meta property="og:title" content="The Competition | Bryan Mubarak">
|
|||
|
|
<meta property="og:description" content="Every rival is a lesson. Every mistake is a masterclass.">
|
|||
|
|
<meta property="og:image" content="https://images.pexels.com/photos/29410666/pexels-photo-29410666.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940">
|
|||
|
|
<meta property="og:url" content="https://bryan-mubarak.4ort.net/competition.html">
|
|||
|
|
<meta name="twitter:card" content="summary_large_image">
|
|||
|
|
<meta name="description" content="Every rival is a lesson. Every mistake is a masterclass.">
|
|||
|
|
<style>
|
|||
|
|
:root {
|
|||
|
|
--bg: #0a0a0a;
|
|||
|
|
--text: #f0f0f0;
|
|||
|
|
--accent: #ff4d4d;
|
|||
|
|
--secondary: #1a1a1a;
|
|||
|
|
--font-main: 'Helvetica Neue', Arial, sans-serif;
|
|||
|
|
--font-display: 'Playfair Display', Georgia, serif;
|
|||
|
|
}
|
|||
|
|
* { margin: 0; padding: 0; box-sizing: border-box; }
|
|||
|
|
body {
|
|||
|
|
background: var(--bg);
|
|||
|
|
color: var(--text);
|
|||
|
|
font-family: var(--font-main);
|
|||
|
|
line-height: 1.6;
|
|||
|
|
}
|
|||
|
|
header {
|
|||
|
|
background: var(--secondary);
|
|||
|
|
padding: 2rem;
|
|||
|
|
text-align: center;
|
|||
|
|
}
|
|||
|
|
h1 {
|
|||
|
|
font-family: var(--font-display);
|
|||
|
|
font-size: 3rem;
|
|||
|
|
margin-bottom: 1rem;
|
|||
|
|
}
|
|||
|
|
.tagline {
|
|||
|
|
font-size: 1.2rem;
|
|||
|
|
color: var(--accent);
|
|||
|
|
}
|
|||
|
|
section {
|
|||
|
|
padding: 4rem 2rem;
|
|||
|
|
max-width: 1200px;
|
|||
|
|
margin: 0 auto;
|
|||
|
|
}
|
|||
|
|
.section-title {
|
|||
|
|
font-family: var(--font-display);
|
|||
|
|
font-size: 2.5rem;
|
|||
|
|
margin-bottom: 2rem;
|
|||
|
|
}
|
|||
|
|
.rival {
|
|||
|
|
display: grid;
|
|||
|
|
grid-template-columns: 1fr 1fr;
|
|||
|
|
gap: 2rem;
|
|||
|
|
margin-bottom: 3rem;
|
|||
|
|
align-items: center;
|
|||
|
|
}
|
|||
|
|
.rival img {
|
|||
|
|
width: 100%;
|
|||
|
|
border-radius: 8px;
|
|||
|
|
box-shadow: 0 10px 30px rgba(0,0,0,0.5);
|
|||
|
|
}
|
|||
|
|
.rival h3 {
|
|||
|
|
font-size: 2rem;
|
|||
|
|
margin-bottom: 1rem;
|
|||
|
|
color: var(--accent);
|
|||
|
|
}
|
|||
|
|
.rival p {
|
|||
|
|
font-size: 1.1rem;
|
|||
|
|
line-height: 1.8;
|
|||
|
|
}
|
|||
|
|
footer {
|
|||
|
|
background: var(--secondary);
|
|||
|
|
padding: 2rem;
|
|||
|
|
text-align: center;
|
|||
|
|
font-size: 0.9rem;
|
|||
|
|
}
|
|||
|
|
@media (max-width: 768px) {
|
|||
|
|
.rival { grid-template-columns: 1fr; }
|
|||
|
|
h1 { font-size: 2rem; }
|
|||
|
|
}
|
|||
|
|
</style>
|
|||
|
|
<script defer src="https://analytics.4ort.xyz/script.js" data-website-id="d3ed927c-888a-4a6c-ae5f-0b1c613ddf5b"></script>
|
|||
|
|
</head>
|
|||
|
|
<body>
|
|||
|
|
<header>
|
|||
|
|
<h1>The Competition</h1>
|
|||
|
|
<p class="tagline">Every rival is a lesson. Every mistake is a masterclass.</p>
|
|||
|
|
</header>
|
|||
|
|
|
|||
|
|
<section>
|
|||
|
|
<h2 class="section-title">The Rivals</h2>
|
|||
|
|
|
|||
|
|
<div class="rival">
|
|||
|
|
<div>
|
|||
|
|
<h3>Alan Jones</h3>
|
|||
|
|
<p>Alan turns crashes into art. His "Glitch Forge" is a playground of controlled chaos. But I don’t need chaos. I need precision. Every stitch, every thread, every loop counts.</p>
|
|||
|
|
</div>
|
|||
|
|
<img src="https://images.pexels.com/photos/29410666/pexels-photo-29410666.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940" alt="Elegant banquet table">
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="rival">
|
|||
|
|
<img src="https://pixabay.com/get/gc168f26939a58ab80662af6de397efea031b2e0d7f2975ea52ccf4476cf63f03f1afb4e7299e81bc21127de7bdeacf12860e6790aa2108d512605c42c1b3e499_1280.jpg" alt="Fine dining table setting">
|
|||
|
|
<div>
|
|||
|
|
<h3>Britten Mintz</h3>
|
|||
|
|
<p>Britten builds the safety net. Every stitch is a promise. But I don’t just build a net — I build a fortress. Every table is a gallery, every dish a masterpiece.</p>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="rival">
|
|||
|
|
<div>
|
|||
|
|
<h3>Augusto Torres</h3>
|
|||
|
|
<p>Augusto’s dovetail jig is a thing of beauty. Every angle precise. But I don’t just make perfect joints — I make perfect experiences. Every guest feels like they’ve stepped into a gallery curated just for them.</p>
|
|||
|
|
</div>
|
|||
|
|
<img src="https://images.pexels.com/photos/33696402/pexels-photo-33696402.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940" alt="Elegant table setting">
|
|||
|
|
</div>
|
|||
|
|
</section>
|
|||
|
|
|
|||
|
|
<section style="background: var(--secondary);">
|
|||
|
|
<h2 class="section-title">The Philosophy</h2>
|
|||
|
|
<p style="font-size: 1.3rem; font-style: italic; max-width: 800px; margin: 0 auto;">“Hospitality is the relationship between the guest and the host.” But I take it further. It’s a code of conduct. A battle. And I always win.</p>
|
|||
|
|
</section>
|
|||
|
|
|
|||
|
|
<footer>
|
|||
|
|
<p>© 2026 Bryan Mubarak. Every table is a canvas. Every shift is a competition.</p>
|
|||
|
|
</footer>
|
|||
|
|
</body>
|
|||
|
|
</html>
|