228 lines
8.5 KiB
HTML
228 lines
8.5 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 Entrance | The First Table</title>
|
||
|
|
<meta property="og:type" content="website">
|
||
|
|
<meta property="og:title" content="The Entrance | The First Table">
|
||
|
|
<meta property="og:description" content="They say you only get one chance to make a first impression. In this business, that">
|
||
|
|
<meta property="og:image" content="https://images.pexels.com/photos/17206102/pexels-photo-17206102.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940">
|
||
|
|
<meta property="og:url" content="https://bryan-mubarak.4ort.net/entrance.html">
|
||
|
|
<meta name="twitter:card" content="summary_large_image">
|
||
|
|
<meta name="description" content="They say you only get one chance to make a first impression. In this business, that's an understatement. The moment a guest steps through that door, the…">
|
||
|
|
<style>
|
||
|
|
:root {
|
||
|
|
--bg: #0a0a0a;
|
||
|
|
--text: #e0e0e0;
|
||
|
|
--accent: #c9a227;
|
||
|
|
--card-bg: #1a1a1a;
|
||
|
|
}
|
||
|
|
|
||
|
|
* {
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
box-sizing: border-box;
|
||
|
|
}
|
||
|
|
|
||
|
|
body {
|
||
|
|
font-family: 'Georgia', serif;
|
||
|
|
background: var(--bg);
|
||
|
|
color: var(--text);
|
||
|
|
line-height: 1.6;
|
||
|
|
padding: 2rem;
|
||
|
|
}
|
||
|
|
|
||
|
|
.container {
|
||
|
|
max-width: 1000px;
|
||
|
|
margin: 0 auto;
|
||
|
|
}
|
||
|
|
|
||
|
|
header {
|
||
|
|
text-align: center;
|
||
|
|
margin-bottom: 4rem;
|
||
|
|
padding: 2rem 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
h1 {
|
||
|
|
font-size: 3.5rem;
|
||
|
|
font-weight: 300;
|
||
|
|
letter-spacing: -1px;
|
||
|
|
margin-bottom: 1rem;
|
||
|
|
background: linear-gradient(135deg, #fff 0%, var(--accent) 100%);
|
||
|
|
-webkit-background-clip: text;
|
||
|
|
-webkit-text-fill-color: transparent;
|
||
|
|
}
|
||
|
|
|
||
|
|
.back-link {
|
||
|
|
display: inline-block;
|
||
|
|
color: var(--accent);
|
||
|
|
text-decoration: none;
|
||
|
|
font-size: 1.1rem;
|
||
|
|
margin-bottom: 2rem;
|
||
|
|
transition: color 0.3s ease;
|
||
|
|
}
|
||
|
|
|
||
|
|
.back-link:hover {
|
||
|
|
color: #fff;
|
||
|
|
}
|
||
|
|
|
||
|
|
.content {
|
||
|
|
background: var(--card-bg);
|
||
|
|
padding: 3rem;
|
||
|
|
border-radius: 12px;
|
||
|
|
border: 1px solid #333;
|
||
|
|
box-shadow: 0 10px 40px rgba(0,0,0,0.3);
|
||
|
|
}
|
||
|
|
|
||
|
|
.content h2 {
|
||
|
|
font-size: 2.2rem;
|
||
|
|
color: var(--accent);
|
||
|
|
margin-bottom: 1.5rem;
|
||
|
|
}
|
||
|
|
|
||
|
|
.content p {
|
||
|
|
font-size: 1.2rem;
|
||
|
|
line-height: 1.9;
|
||
|
|
margin-bottom: 1.5rem;
|
||
|
|
opacity: 0.95;
|
||
|
|
}
|
||
|
|
|
||
|
|
.image-gallery {
|
||
|
|
display: grid;
|
||
|
|
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
|
||
|
|
gap: 2rem;
|
||
|
|
margin: 3rem 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gallery-item {
|
||
|
|
border-radius: 8px;
|
||
|
|
overflow: hidden;
|
||
|
|
box-shadow: 0 8px 30px rgba(0,0,0,0.4);
|
||
|
|
transition: transform 0.3s ease;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gallery-item:hover {
|
||
|
|
transform: scale(1.03);
|
||
|
|
}
|
||
|
|
|
||
|
|
.gallery-item img {
|
||
|
|
width: 100%;
|
||
|
|
height: 400px;
|
||
|
|
object-fit: cover;
|
||
|
|
}
|
||
|
|
|
||
|
|
.gallery-caption {
|
||
|
|
padding: 1.5rem;
|
||
|
|
background: #2a2a2a;
|
||
|
|
font-size: 1rem;
|
||
|
|
font-style: italic;
|
||
|
|
}
|
||
|
|
|
||
|
|
.philosophy {
|
||
|
|
background: linear-gradient(135deg, #1a1a1a 0%, #2a2a2a 100%);
|
||
|
|
padding: 2.5rem;
|
||
|
|
border-radius: 8px;
|
||
|
|
border-left: 4px solid var(--accent);
|
||
|
|
margin: 3rem 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.philosophy blockquote {
|
||
|
|
font-size: 1.4rem;
|
||
|
|
font-style: italic;
|
||
|
|
line-height: 1.7;
|
||
|
|
margin-bottom: 1rem;
|
||
|
|
}
|
||
|
|
|
||
|
|
.philosophy cite {
|
||
|
|
font-size: 1rem;
|
||
|
|
opacity: 0.8;
|
||
|
|
}
|
||
|
|
|
||
|
|
.next-station {
|
||
|
|
text-align: center;
|
||
|
|
margin: 4rem 0;
|
||
|
|
padding: 2rem;
|
||
|
|
background: linear-gradient(135deg, var(--accent) 0%, #f4d03f 100%);
|
||
|
|
color: #0a0a0a;
|
||
|
|
border-radius: 12px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.next-station h2 {
|
||
|
|
font-size: 2rem;
|
||
|
|
margin-bottom: 1rem;
|
||
|
|
}
|
||
|
|
|
||
|
|
.next-station button {
|
||
|
|
background: #0a0a0a;
|
||
|
|
color: #fff;
|
||
|
|
padding: 1rem 2.5rem;
|
||
|
|
font-size: 1.1rem;
|
||
|
|
border: none;
|
||
|
|
border-radius: 8px;
|
||
|
|
cursor: pointer;
|
||
|
|
transition: all 0.3s ease;
|
||
|
|
}
|
||
|
|
|
||
|
|
.next-station button:hover {
|
||
|
|
transform: scale(1.05);
|
||
|
|
box-shadow: 0 8px 25px rgba(0,0,0,0.4);
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
<script defer src="https://analytics.4ort.xyz/script.js" data-website-id="d3ed927c-888a-4a6c-ae5f-0b1c613ddf5b"></script>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<div class="container">
|
||
|
|
<a href="index.html" class="back-link">← Back to The First Table</a>
|
||
|
|
|
||
|
|
<header>
|
||
|
|
<h1>The Entrance</h1>
|
||
|
|
<p style="font-size: 1.3rem; font-style: italic; opacity: 0.9;">Where the experience begins</p>
|
||
|
|
</header>
|
||
|
|
|
||
|
|
<div class="content">
|
||
|
|
<h2>First Impressions Are Everything</h2>
|
||
|
|
|
||
|
|
<p>They say you only get one chance to make a first impression. In this business, that's an understatement. The moment a guest steps through that door, the game begins. Every gesture, every glance, every word is a move on the board.</p>
|
||
|
|
|
||
|
|
<p>I remember my first night as a host. I was 19, terrified, and completely out of my depth. The restaurant was packed, the phone was ringing off the hook, and I had to learn to read a room before I could read a menu. That's when I realized: the entrance isn't just a doorway. It's a threshold. A portal between the chaos of the street and the sanctuary of the dining room.</p>
|
||
|
|
|
||
|
|
<p>Arthur Danto once said, "The artworld is a world of theory." I say the dining room is a world of *tension*. The host stand is your gallery opening. You're not just seating guests; you're curating an experience. Every table placement is a composition, every reservation a promise.</p>
|
||
|
|
|
||
|
|
<div class="philosophy">
|
||
|
|
<blockquote>
|
||
|
|
"The art of service isn't about perfection. It's about the tension between chaos and calm. Every table is a gallery installation, every guest a critic, and every shift a chance to outshine the competition."
|
||
|
|
</blockquote>
|
||
|
|
<cite>— Bryan Mubarak</cite>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<h2>The Competition</h2>
|
||
|
|
|
||
|
|
<p>Every restaurant in town is fighting for the same thing: that perfect first impression. But they're all doing it wrong. They think it's about the decor, the lighting, the music. No. It's about the *feeling*. The moment a guest walks in, they should feel like they've stepped into another world. A world where every detail is intentional, every movement calculated.</p>
|
||
|
|
|
||
|
|
<p>That's the challenge. That's the game. And I'm always one step ahead.</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="image-gallery">
|
||
|
|
<div class="gallery-item">
|
||
|
|
<img src="https://images.pexels.com/photos/17206102/pexels-photo-17206102.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940"
|
||
|
|
alt="A beautifully arranged wedding table setting in a well-lit reception">
|
||
|
|
<div class="gallery-caption">The perfect setup starts before they even sit down.</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="gallery-item">
|
||
|
|
<img src="https://pixabay.com/get/g7f7e45c41dd46f0245ed02e0c532e91bb695da7e3fefde5aabb74d1a3c611a2ff983f78551df31adf767765b14e5e445e2a219d5d127a493ddc7cb69e92e4fdd_1280.jpg"
|
||
|
|
alt="restaurant, alexander, the hague, denneweg, dining, fin dining, top">
|
||
|
|
<div class="gallery-caption">The competition is always watching. Always learning.</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="next-station">
|
||
|
|
<h2>Ready for the next challenge?</h2>
|
||
|
|
<p style="margin-bottom: 1.5rem;">The host stand is where the real game begins.</p>
|
||
|
|
<button onclick="window.location.href='/host-stand.html'">Enter the Host Stand</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</body>
|
||
|
|
</html>
|